@import url('./base_color.css');

:root {
  /* Altura menu */
  --navbar-size: 7rem;
  --navbar-logo-size: 5rem;

  /* font-family padrão */

  --font-size-body: 10px;
  /* --font-family: "Roboto", sans-serif; */
  --font-weight: 400;
  --min-width-body: 360px;
  --size-width: 1240px;
  --cor-promocao-produtos-bg: var(--origem_roxo_5);
  --cor-promocao-produtos-texto: var(--cinza_claro_super);
}

html[data-tema="tema_origem"] {
  --cor-texto-padrao: var(--chumbo);
  --cor-padrao-ativo: var(--origem_roxo_5);
  --cor-titulo-padrao: var(--preto);

  /* BODY */
  --cor-body-bg: var(--origem_roxo_4);

  /* NAVBAR HEADER */
  --cor-navbar-bg: var(--branco);
  --cor-navbar-texto: var(--cor-texto-padrao);
  --cor-navbar-texto-hover: var(--origem_roxo_3);

  /*NOVO*/
  --cor-subnavbar-bg: var(--origem_roxo_3);
  --cor-subnavbar-bg-hover: var(--origem_roxo_5);
  --cor-subnavbar-text: var(--branco);

  --cor-frete-header-bg: var(--origem_roxo_3);
  --cor-frete-header-texto: var(--branco);
  --cor-frete-body-bg: var(--branco);
  --cor-frete-body-texto: var(--preto);
  /********/

  --cor-navbar-icone: var(--origem_roxo_5);
  --cor-navbar-icone-hover: var(--branco);

  /* Container */
  --cor-container-bg: var(--branco);
  --cor-container-texto: var(--cor-texto-padrao);

  /* Body Card */
  --cor-card-bg: var(--cinza_claro_super);
  --cor-card-texto: var(--cor-texto-padrao);
  --cor-card-marca: var(--origem_roxo_5);

  /* Paginacao */
  --cor-paginacao-ativo: var(--cor-padrao-ativo);
  --cor-paginacao-texto-ativo: var(--branco);
  --cor-paginacao-borda-ativo: var(--cor-padrao-ativo);

  --cor-paginacao-padrao: var(--origem_roxo_3);
  --cor-paginacao-texto-padrao: var(--branco);
  --cor-paginacao-borda-padrao: var(--cinza_claro);
  --cor-paginacao-de-ate: var(--cinza);

  /* Cor botões */
  --cor-botao-bg: var(--origem_roxo_5);
  --cor-botao-texto: var(--branco);
  --cor-botao-bg-hover: var(--origem_roxo_4);
  --cor-botao-texto-hover: var(--branco);

  /* produto item */
  --cor-preco-real-produto: var(--origem_roxo_4);
  --cor-preco-promo-produto: var(--origem_preto_1);
  --cor-estrela-produto: var(--amarelo);
  --cor-coracao-produto: var(--vermelho);
  --cor-share-produto: var(--azul);

  /* carrinho */
  --cor-botao-comprar-bg: var(--origem_azul_5);
  --cor-botao-comprar-texto: var(--branco);
  --cor-texto-header-carrinho: var(--cor-texto-padrao);
  --cor-carrinho-bg: var(--cinza_claro_super);
  --cor-carrinho-card-bg: var(--branco);
  --cor-carrinho-card-texto: var(--cor-texto-padrao);
  --cor-carrinho-borda: var(--cinza_claro);
  --cor-carrinho-botao-remover: var(--vermelho);
  --cor-carrinho-botao-continuar: var(--crimson);
  --cor-botao-comprar-bg-hover: var(--origem_azul_1);


  /* footer */
  /* info */
  --cor-footer-padrao-bg: var(--origem_marrom_1);
  --cor-footer-padrao-texto: var(--origem_preto_5);

  --cor-footer-info-bg: var(--origem_azul_4);
  --cor-footer-info-texto: var(--origem_marrom_1);
  --cor-footer-info-icone-bg: var(--origem_marrom_1);
  --cor-footer-info-icone: var(--origem_roxo_3);
  --cor-footer-icone-hover-bg: var(--origem_roxo_3);
  --cor-footer-icone-hover: var(--origem_marrom_1);
  --cor-footer-titulo: var(--origem_roxo_3);

  --cor-footer-info-botao-bg: var(--origem_marrom_1);
  --cor-footer-info-botao-texto: var(--origem_roxo_3);
  --cor-footer-info-botao-bg-hover: var(--origem_roxo_3);
  --cor-footer-info-botao-texto-hover: var(--origem_marrom_1);

  /* modal */
  --cor-modal-bg: var(--branco);
  --cor-modal-texto: var(--cor-texto-padrao);
  --cor-modal-continuar: var(--crimson);
}

html[data-tema="padrao"] {
  --cor-texto-padrao: var(--chumbo);
  --cor-padrao-ativo: var(--crimson);
  --cor-titulo-padrao: var(--preto);

  /* BODY */
  --cor-body-bg: var(--cinza_claro);

  /* NAVBAR HEADER */
  --cor-navbar-bg: var(--branco);
  --cor-navbar-texto: var(--cor-texto-padrao);
  --cor-navbar-hover: var(--preto);
  --cor-navbar-icone-hover: var(--branco);

  /* Container */
  --cor-container-bg: var(--branco);
  --cor-container-texto: var(--cor-texto-padrao);

  /* Body Card */
  --cor-card-bg: var(--cinza_claro_super);
  --cor-card-texto: var(--cor-texto-padrao);
  --cor-card-marca: var(--cor-card-bg);

  /* Paginacao */
  --cor-paginacao-ativo: var(--cor-padrao-ativo);
  --cor-paginacao-texto-ativo: var(--branco);
  --cor-paginacao-borda-ativo: var(--cor-padrao-ativo);

  --cor-paginacao-padrao: var(--cinza);
  --cor-paginacao-texto-padrao: var(--branco);
  --cor-paginacao-borda-padrao: var(--cinza_claro);
  --cor-paginacao-de-ate: var(--cinza);

  /* Cor botões */
  --cor-botao-bg: var(--preto);
  --cor-botao-texto: var(--branco);
  --cor-botao-bg-hover: var(--cinza);
  --cor-botao-texto-hover: var(--branco);

  /* produto item */
  --cor-preco-real-produto: var(--vermelho);
  --cor-preco-promo-produto: var(--amarelo);
  --cor-estrela-produto: var(--amarelo);
  --cor-coracao-produto: var(--vermelho);
  --cor-share-produto: var(--azul);

  /* carrinho */
  --cor-botao-comprar-bg: var(--verde_claro);
  --cor-botao-comprar-texto: var(--branco);
  --cor-texto-header-carrinho: var(--cor-texto-padrao);
  --cor-carrinho-bg: var(--cinza_claro_super);
  --cor-carrinho-card-bg: var(--branco);
  --cor-carrinho-card-texto: var(--cor-texto-padrao);
  --cor-carrinho-borda: var(--cinza_claro);
  --cor-carrinho-botao-remover: var(--vermelho);
  --cor-carrinho-botao-continuar: var(--crimson);
  --cor-botao-comprar-bg-hover: var(--verde_claro_super);


  /* footer */
  /* info */
  --cor-footer-padrao-bg: var(--branco);
  --cor-footer-padrao-texto: var(--cor-texto-padrao);

  --cor-footer-info-bg: var(--preto);
  --cor-footer-info-texto: var(--branco);
  --cor-footer-info-icone-bg: var(--branco);
  --cor-footer-info-icone: var(--preto);
  --cor-footer-icone-hover-bg: var(--preto);
  --cor-footer-icone-hover: var(--branco);
  --cor-footer-titulo: var(--cor-titulo-padrao);

  --cor-footer-info-botao-bg: var(--branco);
  --cor-footer-info-botao-texto: var(--preto);
  --cor-footer-info-botao-bg-hover: var(--cinza);
  --cor-footer-info-botao-texto-hover: var(--cinza_claro_super);

  /* modal */
  --cor-modal-bg: var(--branco);
  --cor-modal-texto: var(--cor-texto-padrao);
  --cor-modal-continuar: var(--crimson);
}

html[data-tema="escuro"] {
  --cor-texto-padrao: var(--branco);
  --cor-padrao-ativo: var(--crimson);
  --cor-titulo-padrao: var(--branco);

  /* BODY */
  --cor-body-bg: var(--cinza_medio);

  /* NAVBAR HEADER */
  --cor-navbar-bg: var(--preto);
  --cor-navbar-texto: var(--cor-texto-padrao);
  --cor-navbar-hover: var(--branco);
  --cor-navbar-icone-hover: var(--preto);

  /* Container */
  --cor-container-bg: var(--chumbo);
  --cor-container-texto: var(--cor-texto-padrao);

  /* Body Card */
  --cor-card-bg: var(--preto_medio);
  --cor-card-texto: var(--cor-texto-padrao);

  /* Paginacao */
  --cor-paginacao-ativo: var(--cor-padrao-ativo);
  --cor-paginacao-texto-ativo: var(--branco);
  --cor-paginacao-borda-ativo: var(--branco);

  --cor-paginacao-padrao: var(--cinza);
  --cor-paginacao-texto-padrao: var(--branco);
  --cor-paginacao-borda-padrao: var(--cinza_claro);
  --cor-paginacao-de-ate: var(--branco);

  /* Cor botões */
  --cor-botao-bg: var(--preto);
  --cor-botao-texto: var(--branco);
  --cor-botao-bg-hover: var(--cinza);
  --cor-botao-texto-hover: var(--branco);

  /* produto item */
  --cor-preco-real-produto: var(--vermelho);
  --cor-preco-promo-produto: var(--amarelo);
  --cor-estrela-produto: var(--amarelo);
  --cor-coracao-produto: var(--vermelho);
  --cor-share-produto: var(--azul);

  /* carrinho */
  --cor-botao-comprar-bg: var(--verde_claro);
  --cor-botao-comprar-texto: var(--branco);
  --cor-texto-header-carrinho: var(--branco);
  --cor-carrinho-bg: var(--preto_medio);
  --cor-carrinho-card-bg: var(--cinza_claro);
  --cor-carrinho-card-texto: var(--preto);
  --cor-carrinho-borda: var(--cinza_claro);
  --cor-carrinho-botao-remover: var(--vermelho);
  --cor-carrinho-botao-continuar: var(--crimson);
  --cor-botao-comprar-bg-hover: var(--verde_claro_super);


  /* footer */
  /* info */
  --cor-footer-padrao-bg: var(--preto);
  --cor-footer-padrao-texto: var(--cor-texto-padrao);

  --cor-footer-info-bg: var(--branco);
  --cor-footer-info-texto: var(--preto);
  --cor-footer-info-icone-bg: var(--preto);
  --cor-footer-info-icone: var(--branco);
  --cor-footer-icone-hover-bg: var(--preto);
  --cor-footer-icone-hover: var(--branco);
  --cor-footer-titulo: var(--branco);

  --cor-footer-info-botao-bg: var(--preto);
  --cor-footer-info-botao-texto: var(--branco);
  --cor-footer-info-botao-bg-hover: var(--cinza);
  --cor-footer-info-botao-texto-hover: var(--cinza_claro);

  /* modal */
  --cor-modal-bg: var(--branco);
  --cor-modal-texto: var(--cor-texto-padrao);
  --cor-modal-continuar: var(--crimson);
}

/*
* Novos temas
*/
html[data-tema="pera"] {
  --cor-texto-padrao: var(--branco);
  --cor-padrao-ativo: var(--crimson);
  --cor-titulo-padrao: var(--pera_3);

  /* BODY */
  --cor-body-bg: var(--cinza_claro_super);

  /* NAVBAR HEADER */
  --cor-navbar-bg: var(--pera_1_claro);
  --cor-navbar-texto: var(--pera_3);
  --cor-navbar-hover: var(--pera_3);
  --cor-navbar-icone-hover: var(--pera_1);

  /* Container */
  --cor-container-bg: var(--pera_1_claro);
  --cor-container-texto: var(--pera_3);

  /* Body Card */
  --cor-card-bg: var(--pera_3_claro);
  --cor-card-texto: var(--branco);
  --cor-card-marca: var(--pera_1);

  /* Paginacao */
  --cor-paginacao-ativo: var(--pera_1);
  --cor-paginacao-texto-ativo: var(--pera_3);
  --cor-paginacao-borda-ativo: var(--pera_2);

  --cor-paginacao-padrao: var(--pera_2);
  --cor-paginacao-texto-padrao: var(--branco);
  --cor-paginacao-borda-padrao: var(--cinza_claro);
  --cor-paginacao-de-ate: var(--pera_2);

  /* Cor botões */
  --cor-botao-bg: var(--pera_3);
  --cor-botao-texto: var(--branco);
  --cor-botao-bg-hover: var(--pera_2);
  --cor-botao-texto-hover: var(--branco);

  /* produto item */
  --cor-preco-real-produto: var(--chumbo);
  --cor-preco-promo-produto: var(--amarelo);
  --cor-estrela-produto: var(--amarelo);
  --cor-coracao-produto: var(--vermelho);
  --cor-share-produto: var(--azul);

  /* carrinho */
  --cor-botao-comprar-bg: var(--verde_claro);
  --cor-botao-comprar-texto: var(--branco);
  --cor-texto-header-carrinho: var(--pera_3);
  --cor-carrinho-bg: var(--pera_1_claro);
  --cor-carrinho-card-bg: var(--pera_2_claro);
  --cor-carrinho-card-texto: var(--preto);
  --cor-carrinho-borda: var(--cinza_claro);
  --cor-carrinho-botao-remover: var(--vermelho);
  --cor-carrinho-botao-continuar: var(--azul);
  --cor-botao-comprar-bg-hover: var(--verde_claro_super);


  /* footer */
  /* info */
  --cor-footer-padrao-bg: var(--pera_1_claro);
  --cor-footer-padrao-texto: var(--pera_3);

  --cor-footer-info-bg: var(--pera_2_claro);
  --cor-footer-info-texto: var(--pera_3);
  --cor-footer-info-icone-bg: var(--pera_3);
  --cor-footer-info-icone: var(--pera_3_claro);
  --cor-footer-icone-hover-bg: var(--preto);
  --cor-footer-icone-hover: var(--branco);
  --cor-footer-titulo: var(--pera_3);

  --cor-footer-info-botao-bg: var(--pera_3_claro);
  --cor-footer-info-botao-texto: var(--branco);
  --cor-footer-info-botao-bg-hover: var(--pera_1_claro);
  --cor-footer-info-botao-texto-hover: var(--pera_3);

  /* modal */
  --cor-modal-bg: var(--branco);
  --cor-modal-texto: var(--cor-texto-padrao);
  --cor-modal-continuar: var(--azul);
}


html[data-tema="morango"] {
  --cor-texto-padrao: var(--branco);
  --cor-padrao-ativo: var(--crimson);
  --cor-titulo-padrao: var(--morango_2_escuro);

  /* BODY */
  --cor-body-bg: var(--cinza_claro_super);

  /* NAVBAR HEADER */
  --cor-navbar-bg: var(--morango_1_escuro);
  --cor-navbar-texto: var(--morango_2);
  --cor-navbar-hover: var(--morango_3_claro);
  --cor-navbar-icone-hover: var(--morango_2);

  /* Container */
  --cor-container-bg: var(--morango_1);
  --cor-container-texto: var(--morango_2_escuro);

  /* Body Card */
  --cor-card-bg: var(--morango_1_escuro);
  --cor-card-texto: var(--branco);
  --cor-card-marca: var(--morango_2);

  /* Paginacao */
  --cor-paginacao-ativo: var(--morango_2);
  --cor-paginacao-texto-ativo: var(--morango_1);
  --cor-paginacao-borda-ativo: var(--morango_3);

  --cor-paginacao-padrao: var(--morango_1_escuro);
  --cor-paginacao-texto-padrao: var(--branco);
  --cor-paginacao-borda-padrao: var(--morango_1_escuro);
  --cor-paginacao-de-ate: var(--morango_3);

  /* Cor botões */
  --cor-botao-bg: var(--morango_2_escuro);
  --cor-botao-texto: var(--branco);
  --cor-botao-bg-hover: var(--morango_2);
  --cor-botao-texto-hover: var(--branco);

  /* produto item */
  --cor-preco-real-produto: var(--morango_2);
  --cor-preco-promo-produto: var(--amarelo);
  --cor-estrela-produto: var(--amarelo);
  --cor-coracao-produto: var(--vermelho);
  --cor-share-produto: var(--azul);

  /* carrinho */
  --cor-botao-comprar-bg: var(--verde_claro);
  --cor-botao-comprar-texto: var(--branco);
  --cor-texto-header-carrinho: var(--morango_2_escuro);
  --cor-carrinho-bg: var(--morango_1);
  --cor-carrinho-card-bg: var(--morango_1_escuro);
  --cor-carrinho-card-texto: var(--preto);
  --cor-carrinho-borda: var(--cinza_claro);
  --cor-carrinho-botao-remover: var(--vermelho);
  --cor-carrinho-botao-continuar: var(--morango_2_escuro);
  --cor-botao-comprar-bg-hover: var(--verde_claro_super);


  /* footer */
  /* info */
  --cor-footer-padrao-bg: var(--morango_1_escuro);
  --cor-footer-padrao-texto: var(--morango_2_escuro);

  --cor-footer-info-bg: var(--morango_2);
  --cor-footer-info-texto: var(--morango_1);
  --cor-footer-info-icone-bg: var(--uva_1);
  --cor-footer-info-icone: var(--morango_2);
  --cor-footer-icone-hover-bg: var(--preto);
  --cor-footer-icone-hover: var(--branco);
  --cor-footer-titulo: var(--morango_2_escuro);

  --cor-footer-info-botao-bg: var(--morango_3_claro);
  --cor-footer-info-botao-texto: var(--morango_2);
  --cor-footer-info-botao-bg-hover: var(--morango_3);
  --cor-footer-info-botao-texto-hover: var(--morango_2_escuro);

  /* modal */
  --cor-modal-bg: var(--branco);
  --cor-modal-texto: var(--cor-texto-padrao);
  --cor-modal-continuar: var(--azul);
}


html[data-tema="uva"] {
  --cor-texto-padrao: var(--branco);
  --cor-padrao-ativo: var(--crimson);
  --cor-titulo-padrao: var(--pera_3);

  /* BODY */
  --cor-body-bg: var(--cinza_claro_super);

  /* NAVBAR HEADER */
  --cor-navbar-bg: var(--uva_2);
  --cor-navbar-texto: var(--uva_3_claro);
  --cor-navbar-hover: var(--uva_3_claro);
  --cor-navbar-icone-hover: var(--uva_2);

  /* Container */
  --cor-container-bg: var(--uva_3);
  --cor-container-texto: var(--uva_1);

  /* Body Card */
  --cor-card-bg: var(--uva_2);
  --cor-card-texto: var(--branco);
  --cor-card-marca: var(--uva_3_claro);

  /* Paginacao */
  --cor-paginacao-ativo: var(--uva_2);
  --cor-paginacao-texto-ativo: var(--uva_3);
  --cor-paginacao-borda-ativo: var(--uva_1);

  --cor-paginacao-padrao: var(--uva_1);
  --cor-paginacao-texto-padrao: var(--branco);
  --cor-paginacao-borda-padrao: var(--uva_2);
  --cor-paginacao-de-ate: var(--uva_2);

  /* Cor botões */
  --cor-botao-bg: var(--uva_2);
  --cor-botao-texto: var(--branco);
  --cor-botao-bg-hover: var(--uva_1);
  --cor-botao-texto-hover: var(--branco);

  /* produto item */
  --cor-preco-real-produto: var(--uva_3_claro);
  --cor-preco-promo-produto: var(--amarelo);
  --cor-estrela-produto: var(--amarelo);
  --cor-coracao-produto: var(--vermelho);
  --cor-share-produto: var(--azul);

  /* carrinho */
  --cor-botao-comprar-bg: var(--verde_claro);
  --cor-botao-comprar-texto: var(--branco);
  --cor-texto-header-carrinho: var(--pera_3);
  --cor-carrinho-bg: var(--uva_3);
  --cor-carrinho-card-bg: var(--uva_3_escuro);
  --cor-carrinho-card-texto: var(--branco);
  --cor-carrinho-borda: var(--cinza_claro);
  --cor-carrinho-botao-remover: var(--vermelho);
  --cor-carrinho-botao-continuar: var(--uva_3_claro);
  --cor-botao-comprar-bg-hover: var(--verde_claro_super);


  /* footer */
  /* info */
  --cor-footer-padrao-bg: var(--uva_3);
  --cor-footer-padrao-texto: var(--uva_2);

  --cor-footer-info-bg: var(--uva_2);
  --cor-footer-info-texto: var(--uva_3_claro);
  --cor-footer-info-icone-bg: var(--uva_1);
  --cor-footer-info-icone: var(--uva_2);
  --cor-footer-icone-hover-bg: var(--preto);
  --cor-footer-icone-hover: var(--branco);
  --cor-footer-titulo: var(--uva_2);

  --cor-footer-info-botao-bg: var(--uva_1);
  --cor-footer-info-botao-texto: var(--uva_3_claro);
  --cor-footer-info-botao-bg-hover: var(--uva_3);
  --cor-footer-info-botao-texto-hover: var(--uva_1);

  /* modal */
  --cor-modal-bg: var(--branco);
  --cor-modal-texto: var(--cor-texto-padrao);
  --cor-modal-continuar: var(--azul);
}


html[data-tema="blueberry"] {
  --cor-texto-padrao: var(--branco);
  --cor-padrao-ativo: var(--crimson);
  --cor-titulo-padrao: var(--blueberry_3);

  /* BODY */
  --cor-body-bg: var(--cinza_claro_super);

  /* NAVBAR HEADER */
  --cor-navbar-bg: var(--blueberry_1_claro);
  --cor-navbar-texto: var(--blueberry_3);
  --cor-navbar-hover: var(--blueberry_2);
  --cor-navbar-icone-hover: var(--blueberry_3);

  /* Container */
  --cor-container-bg: var(--blueberry_2_claro);
  --cor-container-texto: var(--blueberry_3);

  /* Body Card */
  --cor-card-bg: var(--blueberry_1_claro);
  --cor-card-texto: var(--preto);
  --cor-card-marca: var(--blueberry_3);

  /* Paginacao */
  --cor-paginacao-ativo: var(--blueberry_4);
  --cor-paginacao-texto-ativo: var(--blueberry_3);
  --cor-paginacao-borda-ativo: var(--blueberry_2);

  --cor-paginacao-padrao: var(--blueberry_1_claro);
  --cor-paginacao-texto-padrao: var(--blueberry_3);
  --cor-paginacao-borda-padrao: var(--blueberry_2);
  --cor-paginacao-de-ate: var(--blueberry_3);

  /* Cor botões */
  --cor-botao-bg: var(--blueberry_1);
  --cor-botao-texto: var(--blueberry_3);
  --cor-botao-bg-hover: var(--blueberry_3);
  --cor-botao-texto-hover: var(--branco);

  /* produto item */
  --cor-preco-real-produto: var(--blueberry_3);
  --cor-preco-promo-produto: var(--blueberry_4);
  --cor-estrela-produto: var(--amarelo);
  --cor-coracao-produto: var(--vermelho);
  --cor-share-produto: var(--azul);

  /* carrinho */
  --cor-botao-comprar-bg: var(--verde_claro);
  --cor-botao-comprar-texto: var(--branco);
  --cor-texto-header-carrinho: var(--blueberry_3);
  --cor-carrinho-bg: var(--blueberry_2_claro);
  --cor-carrinho-card-bg: var(--blueberry_1_claro);
  --cor-carrinho-card-texto: var(--blueberry_3);
  --cor-carrinho-borda: var(--cinza_claro);
  --cor-carrinho-botao-remover: var(--vermelho);
  --cor-carrinho-botao-continuar: var(--blueberry_3);
  --cor-botao-comprar-bg-hover: var(--verde_claro_super);


  /* footer */
  /* info */
  --cor-footer-padrao-bg: var(--blueberry_2_claro);
  --cor-footer-padrao-texto: var(--blueberry_3);

  --cor-footer-info-bg: var(--blueberry_1_claro);
  --cor-footer-info-texto: var(--blueberry_3);
  --cor-footer-info-icone-bg: var(--blueberry_2);
  --cor-footer-info-icone: var(--blueberry_3);
  --cor-footer-icone-hover-bg: var(--preto);
  --cor-footer-icone-hover: var(--branco);
  --cor-footer-titulo: var(--blueberry_3);

  --cor-footer-info-botao-bg: var(--blueberry_3);
  --cor-footer-info-botao-texto: var(--blueberry_2);
  --cor-footer-info-botao-bg-hover: var(--blueberry_2);
  --cor-footer-info-botao-texto-hover: var(--blueberry_3);

  /* modal */
  --cor-modal-bg: var(--branco);
  --cor-modal-texto: var(--cor-texto-padrao);
  --cor-modal-continuar: var(--azul);
}

html[data-tema="laranja"] {
  --cor-texto-padrao: var(--branco);
  --cor-padrao-ativo: var(--crimson);
  --cor-titulo-padrao: var(--laranja_3);

  /* BODY */
  --cor-body-bg: var(--cinza_claro_super);

  /* NAVBAR HEADER */
  --cor-navbar-bg: var(--laranja_1_escuro);
  --cor-navbar-texto: var(--laranja_3);
  --cor-navbar-hover: var(--laranja_2_claro);
  --cor-navbar-icone-hover: var(--laranja_1);

  /* Container */
  --cor-container-bg: var(--laranja_2_claro);
  --cor-container-texto: var(--laranja_3);

  /* Body Card */
  --cor-card-bg: var(--laranja_1_escuro);
  --cor-card-texto: var(--branco);
  --cor-card-marca: var(--laranja_3);

  /* Paginacao */
  --cor-paginacao-ativo: var(--laranja_3);
  --cor-paginacao-texto-ativo: var(--laranja_1);
  --cor-paginacao-borda-ativo: var(--laranja_1);

  --cor-paginacao-padrao: var(--laranja_2);
  --cor-paginacao-texto-padrao: var(--branco);
  --cor-paginacao-borda-padrao: var(--uva_2);
  --cor-paginacao-de-ate: var(--laranja_3);

  /* Cor botões */
  --cor-botao-bg: var(--laranja_2);
  --cor-botao-texto: var(--branco);
  --cor-botao-bg-hover: var(--laranja_3);
  --cor-botao-texto-hover: var(--branco);

  /* produto item */
  --cor-preco-real-produto: var(--laranja_3);
  --cor-preco-promo-produto: var(--laranja_2);
  --cor-estrela-produto: var(--amarelo);
  --cor-coracao-produto: var(--vermelho);
  --cor-share-produto: var(--azul);

  /* carrinho */
  --cor-botao-comprar-bg: var(--verde_claro);
  --cor-botao-comprar-texto: var(--branco);
  --cor-texto-header-carrinho: var(--laranja_3);
  --cor-carrinho-bg: var(--laranja_2_claro);
  --cor-carrinho-card-bg: var(--laranja_1_claro);
  --cor-carrinho-card-texto: var(--laranja_3);
  --cor-carrinho-borda: var(--cinza_claro);
  --cor-carrinho-botao-remover: var(--vermelho);
  --cor-carrinho-botao-continuar: var(--laranja_3);
  --cor-botao-comprar-bg-hover: var(--verde_claro_super);


  /* footer */
  /* info */
  --cor-footer-padrao-bg: var(--laranja_2_claro);
  --cor-footer-padrao-texto: var(--laranja_3);

  --cor-footer-info-bg: var(--laranja_1_escuro);
  --cor-footer-info-texto: var(--laranja_3);
  --cor-footer-info-icone-bg: var(--laranja_2_claro);
  --cor-footer-info-icone: var(--laranja_3);
  --cor-footer-icone-hover-bg: var(--preto);
  --cor-footer-icone-hover: var(--branco);
  --cor-footer-titulo: var(--laranja_3);

  --cor-footer-info-botao-bg: var(--laranja_3);
  --cor-footer-info-botao-texto: var(--laranja_2_claro);
  --cor-footer-info-botao-bg-hover: var(--laranja_2);
  --cor-footer-info-botao-texto-hover: var(--laranja_3);

  /* modal */
  --cor-modal-bg: var(--branco);
  --cor-modal-texto: var(--cor-texto-padrao);
  --cor-modal-continuar: var(--azul);
}

html[data-tema="coral_sereno"] {
  --cor-texto-padrao: var(--branco);
  --cor-padrao-ativo: var(--crimson);
  --cor-titulo-padrao: var(--coral_5);

  /* BODY */
  --cor-body-bg: var(--cinza_claro_super);

  /* NAVBAR HEADER */
  --cor-navbar-bg: var(--coral_3);
  --cor-navbar-texto: var(--coral_4);
  --cor-navbar-hover: var(--coral_1);
  --cor-navbar-icone-hover: var(--coral_3);

  /* Container */
  --cor-container-bg: var(--coral_2);
  --cor-container-texto: var(--coral_5);

  /* Body Card */
  --cor-card-bg: var(--coral_3);
  --cor-card-texto: var(--chumbo);
  --cor-card-marca: var(--coral_4);

  /* Paginacao */
  --cor-paginacao-ativo: var(--coral_5);
  --cor-paginacao-texto-ativo: var(--branco);
  --cor-paginacao-borda-ativo: var(--coral_5);

  --cor-paginacao-padrao: var(--coral_3);
  --cor-paginacao-texto-padrao: var(--coral_4);
  --cor-paginacao-borda-padrao: var(--coral_5);
  --cor-paginacao-de-ate: var(--coral_4);

  /* Cor botões */
  --cor-botao-bg: var(--coral_1);
  --cor-botao-texto: var(--branco);
  --cor-botao-bg-hover: var(--coral_3);
  --cor-botao-texto-hover: var(--branco);

  /* produto item */
  --cor-preco-real-produto: var(--coral_4);
  --cor-preco-promo-produto: var(--coral_5);
  --cor-estrela-produto: var(--amarelo);
  --cor-coracao-produto: var(--vermelho);
  --cor-share-produto: var(--azul);

  /* carrinho */
  --cor-botao-comprar-bg: var(--verde_claro);
  --cor-botao-comprar-texto: var(--branco);
  --cor-texto-header-carrinho: var(--coral_4);
  --cor-carrinho-bg: var(--coral_2);
  --cor-carrinho-card-bg: var(--coral_3);
  --cor-carrinho-card-texto: var(--chumbo);
  --cor-carrinho-borda: var(--cinza_claro);
  --cor-carrinho-botao-remover: var(--vermelho);
  --cor-carrinho-botao-continuar: var(--coral_4);
  --cor-botao-comprar-bg-hover: var(--verde_claro_super);


  /* footer */
  /* info */
  --cor-footer-padrao-bg: var(--coral_2);
  --cor-footer-padrao-texto: var(--coral_4);

  --cor-footer-info-bg: var(--coral_3);
  --cor-footer-info-texto: var(--coral_4);
  --cor-footer-info-icone-bg: var(--coral_2);
  --cor-footer-info-icone: var(--coral_5);
  --cor-footer-icone-hover-bg: var(--preto);
  --cor-footer-icone-hover: var(--branco);
  --cor-footer-titulo: var(--coral_5);

  --cor-footer-info-botao-bg: var(--coral_1);
  --cor-footer-info-botao-texto: var(--branco);
  --cor-footer-info-botao-bg-hover: var(--coral_5);
  --cor-footer-info-botao-texto-hover: var(--coral_2);

  /* modal */
  --cor-modal-bg: var(--branco);
  --cor-modal-texto: var(--cor-texto-padrao);
  --cor-modal-continuar: var(--azul);
}

html[data-tema="violeta_veludo"] {
  --cor-texto-padrao: var(--branco);
  --cor-padrao-ativo: var(--crimson);
  --cor-titulo-padrao: var(--violeta_5);

  /* BODY */
  --cor-body-bg: var(--cinza_claro_super);

  /* NAVBAR HEADER */
  --cor-navbar-bg: var(--violeta_2_claro);
  --cor-navbar-texto: var(--violeta_4);
  --cor-navbar-hover: var(--coral_1);
  --cor-navbar-icone-hover: var(--coral_3);

  /* Container */
  --cor-container-bg: var(--violeta_1_claro);
  --cor-container-texto: var(--violeta_4);

  /* Body Card */
  --cor-card-bg: var(--violeta_2_claro);
  --cor-card-texto: var(--chumbo);
  --cor-card-marca: var(--coral_5);

  /* Paginacao */
  --cor-paginacao-ativo: var(--violeta_4);
  --cor-paginacao-texto-ativo: var(--branco);
  --cor-paginacao-borda-ativo: var(--violeta_4);

  --cor-paginacao-padrao: var(--violeta_2);
  --cor-paginacao-texto-padrao: var(--branco);
  --cor-paginacao-borda-padrao: var(--violeta_3);
  --cor-paginacao-de-ate: var(--coral_4);

  /* Cor botões */
  --cor-botao-bg: var(--violeta_3);
  --cor-botao-texto: var(--branco);
  --cor-botao-bg-hover: var(--violeta_2);
  --cor-botao-texto-hover: var(--branco);

  /* produto item */
  --cor-preco-real-produto: var(--violeta_5);
  --cor-preco-promo-produto: var(--coral_3);
  --cor-estrela-produto: var(--amarelo);
  --cor-coracao-produto: var(--vermelho);
  --cor-share-produto: var(--azul);

  /* carrinho */
  --cor-botao-comprar-bg: var(--verde_claro);
  --cor-botao-comprar-texto: var(--branco);
  --cor-texto-header-carrinho: var(--coral_4);
  --cor-carrinho-bg: var(--violeta_1_claro);
  --cor-carrinho-card-bg: var(--violeta_2_claro);
  --cor-carrinho-card-texto: var(--chumbo);
  --cor-carrinho-borda: var(--cinza_claro);
  --cor-carrinho-botao-remover: var(--vermelho);
  --cor-carrinho-botao-continuar: var(--violeta_5);
  --cor-botao-comprar-bg-hover: var(--verde_claro_super);


  /* footer */
  /* info */
  --cor-footer-padrao-bg: var(--violeta_1_claro);
  --cor-footer-padrao-texto: var(--violeta_5);

  --cor-footer-info-bg: var(--violeta_2_claro);
  --cor-footer-info-texto: var(--violeta_5);
  --cor-footer-info-icone-bg: var(--violeta_2);
  --cor-footer-info-icone: var(--violeta_4);
  --cor-footer-icone-hover-bg: var(--preto);
  --cor-footer-icone-hover: var(--branco);
  --cor-footer-titulo: var(--violeta_5);

  --cor-footer-info-botao-bg: var(--violeta_2);
  --cor-footer-info-botao-texto: var(--branco);
  --cor-footer-info-botao-bg-hover: var(--violeta_3);
  --cor-footer-info-botao-texto-hover: var(--coral_2);

  /* modal */
  --cor-modal-bg: var(--branco);
  --cor-modal-texto: var(--cor-texto-padrao);
  --cor-modal-continuar: var(--azul);
}

html[data-tema="terracota"] {
  --cor-texto-padrao: var(--marrom_2_claro);
  --cor-padrao-ativo: var(--crimson);
  --cor-titulo-padrao: var(--marrom_1);

  /* BODY */
  --cor-body-bg: var(--marrom_2_claro);

  /* NAVBAR HEADER */
  --cor-navbar-bg: var(--marrom_3);
  --cor-navbar-texto: var(--marrom_2_claro);
  --cor-navbar-hover: var(--marrom_2);
  --cor-navbar-icone-hover: var(--marrom_1);

  /* Container */
  --cor-container-bg: var(--marrom_2);
  --cor-container-texto: var(--marrom_1);

  /* Body Card */
  --cor-card-bg: var(--marrom_3);
  --cor-card-texto: var(--marrom_2_claro);
  --cor-card-marca: var(--chumbo);

  /* Paginacao */
  --cor-paginacao-ativo: var(--marrom_1_claro);
  --cor-paginacao-texto-ativo: var(--branco);
  --cor-paginacao-borda-ativo: var(--marrom_3);

  --cor-paginacao-padrao: var(--marrom_3);
  --cor-paginacao-texto-padrao: var(--branco);
  --cor-paginacao-borda-padrao: var(--marrom_4);
  --cor-paginacao-de-ate: var(--marrom_1);

  /* Cor botões */
  --cor-botao-bg: var(--marrom_1_claro);
  --cor-botao-texto: var(--branco);
  --cor-botao-bg-hover: var(--marrom_1);
  --cor-botao-texto-hover: var(--branco);

  /* produto item */
  --cor-preco-real-produto: var(--branco);
  --cor-preco-promo-produto: var(--marrom_2_claro);
  --cor-estrela-produto: var(--amarelo);
  --cor-coracao-produto: var(--vermelho);
  --cor-share-produto: var(--azul);

  /* carrinho */
  --cor-botao-comprar-bg: var(--verde_claro_super);
  --cor-botao-comprar-texto: var(--branco);
  --cor-texto-header-carrinho: var(--marrom_1);
  --cor-carrinho-bg: var(--marrom_2);
  --cor-carrinho-card-bg: var(--marrom_4);
  --cor-carrinho-card-texto: var(--marrom_1);
  --cor-carrinho-borda: var(--cinza_claro);
  --cor-carrinho-botao-remover: var(--vermelho);
  --cor-carrinho-botao-continuar: var(--marrom_1);
  --cor-botao-comprar-bg-hover: var(--verde_claro);

  /* footer */
  /* info */
  --cor-footer-padrao-bg: var(--marrom_2_claro_super);
  --cor-footer-padrao-texto: var(--marrom_1);

  --cor-footer-info-bg: var(--marrom_3);
  --cor-footer-info-texto: var(--marrom_2_claro);
  --cor-footer-info-icone-bg: var(--marrom_1_claro);
  --cor-footer-info-icone: var(--marrom_4);
  --cor-footer-icone-hover-bg: var(--preto);
  --cor-footer-icone-hover: var(--branco);
  --cor-footer-titulo: var(--marrom_1);

  --cor-footer-info-botao-bg: var(--marrom_4);
  --cor-footer-info-botao-texto: var(--marrom_2_claro);
  --cor-footer-info-botao-bg-hover: var(--marrom_3_escuro);
  --cor-footer-info-botao-texto-hover: var(--marrom_2_claro_super);

  /* modal */
  --cor-modal-bg: var(--branco);
  --cor-modal-texto: var(--cor-texto-padrao);
  --cor-modal-continuar: var(--azul);
}

/* Temas Light */
html[data-tema="uva_light"] {
  --cor-texto-padrao: var(--branco);
  --cor-padrao-ativo: var(--crimson);
  --cor-titulo-padrao: var(--pera_3);

  /* BODY */
  --cor-body-bg: var(--uva_3);

  /* NAVBAR HEADER */
  --cor-navbar-bg: var(--uva_2);
  --cor-navbar-texto: var(--uva_3_claro);
  --cor-navbar-hover: var(--uva_3_claro);
  --cor-navbar-icone-hover: var(--uva_2);

  /* Container */
  --cor-container-bg: var(--cinza_claro_super);
  --cor-container-texto: var(--uva_1);

  /* Body Card */
  --cor-card-bg: var(--cinza_claro);
  --cor-card-texto: var(--branco);
  --cor-card-marca: var(--uva_3_claro);

  /* Paginacao */
  --cor-paginacao-ativo: var(--uva_2);
  --cor-paginacao-texto-ativo: var(--uva_3);
  --cor-paginacao-borda-ativo: var(--uva_1);

  --cor-paginacao-padrao: var(--uva_1);
  --cor-paginacao-texto-padrao: var(--branco);
  --cor-paginacao-borda-padrao: var(--uva_2);
  --cor-paginacao-de-ate: var(--uva_2);

  /* Cor botões */
  --cor-botao-bg: var(--uva_2);
  --cor-botao-texto: var(--branco);
  --cor-botao-bg-hover: var(--uva_1);
  --cor-botao-texto-hover: var(--branco);

  /* produto item */
  --cor-preco-real-produto: var(--uva_3_claro);
  --cor-preco-promo-produto: var(--amarelo);
  --cor-estrela-produto: var(--amarelo);
  --cor-coracao-produto: var(--vermelho);
  --cor-share-produto: var(--azul);

  /* carrinho */
  --cor-botao-comprar-bg: var(--verde_claro);
  --cor-botao-comprar-texto: var(--branco);
  --cor-texto-header-carrinho: var(--pera_3);
  --cor-carrinho-bg: var(--uva_3);
  --cor-carrinho-card-bg: var(--uva_3_escuro);
  --cor-carrinho-card-texto: var(--branco);
  --cor-carrinho-borda: var(--cinza_claro);
  --cor-carrinho-botao-remover: var(--vermelho);
  --cor-carrinho-botao-continuar: var(--uva_3_claro);
  --cor-botao-comprar-bg-hover: var(--verde_claro_super);


  /* footer */
  /* info */
  --cor-footer-padrao-bg: var(--uva_3);
  --cor-footer-padrao-texto: var(--uva_2);

  --cor-footer-info-bg: var(--uva_2);
  --cor-footer-info-texto: var(--uva_3_claro);
  --cor-footer-info-icone-bg: var(--uva_1);
  --cor-footer-info-icone: var(--uva_2);
  --cor-footer-icone-hover-bg: var(--preto);
  --cor-footer-icone-hover: var(--branco);
  --cor-footer-titulo: var(--uva_2);

  --cor-footer-info-botao-bg: var(--uva_1);
  --cor-footer-info-botao-texto: var(--uva_3_claro);
  --cor-footer-info-botao-bg-hover: var(--uva_3);
  --cor-footer-info-botao-texto-hover: var(--uva_1);

  /* modal */
  --cor-modal-bg: var(--branco);
  --cor-modal-texto: var(--cor-texto-padrao);
  --cor-modal-continuar: var(--azul);
}


html[data-font="roboto"] {
  --font-family: "Roboto", sans-serif;
}

html[data-font="cursive"] {
  --font-family: Cursive, san-serif;
}

html[data-font="bodoni"] {
  --font-family: "Bodoni Moda", serif;
}

html[data-font="krona"] {
  --font-family: "Krona One", sans-serif;
}

html[data-font="syne"] {
  --font-family: "Syne", sans-serif;
}

html[data-font="viaoda"] {
  --font-family: "Viaoda Libre", cursive;
}

html[data-font="yeseva"] {
  --font-family: "Yeseva One", cursive;
}