/* (2026-10-04) Tema CLARO no celular (pedido do Evanes: "no mobile deixe todas as páginas com o fundo claro").
   A loja era vinho escuro (#210814) até 575px e em várias páginas (carrinho, finalizar, adicionais,
   observações, meus pedidos, gaveta do carrinho, painel lateral) em qualquer largura.
   Este arquivo vem do cabecalho.php (fora do modo totem) e sobrescreve tudo até 991px.
   Os cards de produto da home (arco vinho sobre a foto) continuam na cor da marca de propósito. */
@media (max-width: 991.98px) {

  html body {
    --lc-bg: #F6F4F7;
    --lc-card: #FFFFFF;
    --lc-card-2: #FBF8FA;
    --lc-borda: #ECE4EA;
    --lc-texto: #24121C;
    --lc-muted: #7A6872;
    --lc-sombra: 0 4px 14px rgba(36, 18, 28, .07);
    /* variáveis das próprias páginas (texto claro -> escuro) */
    --fin-dark: #24121C; --fin-muted: #7A6872; --fin-card-from: #FFFFFF; --fin-card-to: #FFFFFF;
    --obs-dark: #24121C; --obs-muted: #7A6872;
    --add-dark: #24121C; --add-muted: #7A6872;
    --drawer-dark: #24121C; --drawer-muted: #7A6872;
  }

  html, html body { background: var(--lc-bg) !important; color: var(--lc-texto); }

  /* ---------- HOME ---------- */
  html body nav.navbar.bg-light.fixed-top {
    background: rgba(255, 255, 255, .92) !important;
    border-bottom: 1px solid var(--lc-borda) !important;
    box-shadow: 0 2px 12px rgba(36, 18, 28, .05);
  }
  html body #slider .flexslider { background: var(--lc-card) !important; box-shadow: var(--lc-sombra) !important; }

  html body .padding_input {
    background: var(--lc-card) !important; border: 1px solid var(--lc-borda) !important; box-shadow: var(--lc-sombra) !important;
  }
  html body .padding_input:focus-within { background: var(--lc-card) !important; border-color: rgba(255, 122, 0, .65) !important; }
  html body .padding_input input { color: var(--lc-texto) !important; }
  html body .padding_input input::placeholder { color: var(--lc-muted) !important; }
  html body #area_busca .list-group-item {
    background: var(--lc-card) !important; border: 1px solid var(--lc-borda) !important; box-shadow: var(--lc-sombra) !important;
  }
  html body #area_busca .titulo-item { color: var(--lc-texto) !important; }
  html body #area_busca .subtitulo-item-menor { color: var(--lc-muted) !important; }

  html body .category-area.ocultar_dasktop { background: transparent !important; }
  html body .category-area.ocultar_dasktop .cat-banner-nome { color: #3B2732 !important; }

  html body #combo .combo-card { background: var(--lc-card) !important; border: 1px solid var(--lc-borda) !important; box-shadow: var(--lc-sombra) !important; }
  html body #combo .combo-card__foto { background: var(--lc-card-2) !important; }
  html body #combo .combo-card__nome,
  html body #combo .combo-cab__titulo { color: var(--lc-texto) !important; }
  html body #combo .combo-card__desc { color: var(--lc-muted) !important; }


  /* título da categoria aberta na home e botão do carrinho no topo */
  html body #categoria-produtos-inline-titulo { color: var(--lc-texto) !important; }
  html body .header__info-cart > button { background: #F3EEF2 !important; border: 1px solid var(--lc-borda) !important; }
  html body .header__info-cart > button img { filter: brightness(0) invert(14%); }

  /* gaveta do carrinho (icone-carrinho.php) */
  html body .tpcartinfo, html body .tpcart__title { background: var(--lc-bg) !important; color: var(--lc-texto) !important; }
  html body .cart-drawer-item { background: var(--lc-card) !important; border-color: var(--lc-borda) !important; box-shadow: var(--lc-sombra) !important; color: var(--lc-texto) !important; }
  html body .carrinho-vazio { color: var(--lc-muted) !important; }

  /* ---------- PAINEL LATERAL (categoria / produto) ---------- */
  html body #cat-lateral-painel { background: var(--lc-bg) !important; box-shadow: -6px 0 24px rgba(36, 18, 28, .18) !important; }
  html body #cat-lateral-header { background: rgba(255, 255, 255, .94) !important; border-bottom: 1px solid var(--lc-borda) !important; }
  html body #cat-lateral-header a, html body #cat-lateral-titulo { color: var(--lc-texto) !important; }
  html body #cat-lateral-body div[style*="3A1424"] { background: var(--lc-card) !important; border-color: var(--lc-borda) !important; box-shadow: var(--lc-sombra) !important; }
  html body #cat-lateral-body div[style*="3A1424"] h4 { color: var(--lc-texto) !important; }
  html body #cat-lateral-body div[style*="3A1424"] p { color: var(--lc-muted) !important; }

  html body .prod-lateral-topo::after { background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 100%) !important; }
  html body .prod-lateral-info,
  html body .prod-lateral-qtd { background: var(--lc-card) !important; color: var(--lc-texto) !important; }
  html body .prod-lateral-qtd { border-bottom-color: #EFE9EE !important; }
  html body .prod-lateral-qtd__valor,
  html body .prod-lateral-nome,
  html body .prod-lateral-item-nome,
  html body .prod-lateral-stepper button,
  html body .prod-lateral-stepper input,
  html body .prod-lateral-stepper span,
  html body .prod-lateral-stepper-qtd button { color: var(--lc-texto) !important; }
  html body .prod-lateral-descricao,
  html body .prod-lateral-grupo-sub,
  html body .prod-lateral-grupo-limite { color: var(--lc-muted) !important; }
  html body .prod-lateral-grupo-titulo { background: #EFE9EE !important; color: var(--lc-texto) !important; }
  html body .prod-lateral-grupo-passo { background: #FFFFFF !important; color: var(--lc-muted) !important; border: 1px solid var(--lc-borda); }
  html body .prod-lateral-busca input { background: var(--lc-card) !important; color: var(--lc-texto) !important; border-color: var(--lc-borda) !important; }
  html body .prod-lateral-busca input::placeholder { color: var(--lc-muted) !important; }
  html body .prod-lateral-item-grade {
    background: var(--lc-card) !important; border: 1px solid var(--lc-borda) !important; box-shadow: 0 2px 8px rgba(36, 18, 28, .05) !important; color: var(--lc-texto);
  }
  html body .prod-lateral-item-grade.selecionado { background: #FFF4EA !important; border-color: #FF7A00 !important; box-shadow: 0 4px 14px rgba(255, 122, 0, .18) !important; }
  html body .prod-lateral-item-valor { color: #15803D !important; }
  html body .prod-lateral-item-limite { color: #DC2626 !important; }
  html body .prod-lateral-obs { border-top-color: #EFE9EE !important; color: var(--lc-texto) !important; }
  html body .prod-lateral-obs textarea { background: var(--lc-card) !important; color: var(--lc-texto) !important; border: 1px solid var(--lc-borda) !important; }
  html body .prod-lateral-obs textarea::placeholder { color: var(--lc-muted) !important; }
  html body .prod-lateral-rodape { background: rgba(255, 255, 255, .96) !important; border-top: 1px solid var(--lc-borda) !important; box-shadow: 0 -4px 16px rgba(36, 18, 28, .06); }

  /* ---------- ADICIONAIS ---------- */
  html body .destaque,
  html body .list-group-item,
  html body .destaque-qtd { background: var(--lc-card) !important; border-color: var(--lc-borda) !important; color: var(--lc-texto); box-shadow: var(--lc-sombra); }

  /* ---------- OBSERVAÇÕES ---------- */
  html body .obs-product-card,
  html body .obs-section { background: var(--lc-card) !important; border-color: var(--lc-borda) !important; box-shadow: var(--lc-sombra) !important; }
  html body .obs-textarea { color: var(--lc-texto) !important; background: var(--lc-card-2) !important; border-color: var(--lc-borda) !important; }
  html body .obs-textarea::placeholder { color: var(--lc-muted) !important; }
  html body .obs-footer-bar { background: rgba(255, 255, 255, .96) !important; border-top: 1px solid var(--lc-borda) !important; }

  /* ---------- CARRINHO ---------- */
  html body .navbar-totem { background: rgba(255, 255, 255, .94) !important; border-bottom: 1px solid var(--lc-borda) !important; box-shadow: 0 2px 12px rgba(36, 18, 28, .05) !important; }
  html body .navbar-totem .navbar-brand,
  html body .navbar-totem .navbar-brand a,
  html body .cart-title,
  html body .cart-item-name,
  html body .cart-stepper-value,
  html body .overlay-excluir,
  html body .sugestoes-carrinho__nome,
  html body .destaque-qtd { color: var(--lc-texto) !important; }
  html body .cart-item-borda,
  html body .cart-item-actions a,
  html body .cart-item-unitario,
  html body .sugestoes-carrinho__titulo { color: var(--lc-muted) !important; }
  html body .btn-cart-outline { background: var(--lc-card) !important; color: var(--lc-texto) !important; border: 1px solid var(--lc-borda) !important; }
  html body .cart-item-card,
  html body .sugestoes-carrinho__item,
  html body .total-pedido { background: var(--lc-card) !important; border: 1px solid var(--lc-borda) !important; box-shadow: var(--lc-sombra) !important; color: var(--lc-texto) !important; }
  html body .total-pedido * { color: inherit; }
  html body .cart-item-img { border-color: var(--lc-borda) !important; }
  html body .cart-stepper { background: #F3EEF2 !important; border-color: var(--lc-borda) !important; }
  html body .cart-stepper-btn { background: var(--lc-card) !important; color: var(--lc-texto) !important; }
  html body .area-pedidos { background: linear-gradient(180deg, rgba(246, 244, 247, 0) 0%, var(--lc-bg) 18%) !important; }
  html body .modal-content { background: var(--lc-card) !important; color: var(--lc-texto) !important; border-color: var(--lc-borda) !important; }
  html body .modal-content .form-select,
  html body .modal-content .form-control,
  html body .modal-content .list-group-item { color: var(--lc-texto) !important; background-color: var(--lc-card) !important; border-color: var(--lc-borda) !important; }
  html body .modal-content .form-control::placeholder { color: var(--lc-muted) !important; }


  /* o .btn:hover do Bootstrap zera o fundo (var --bs-btn-hover-bg vazia): no tema claro o texto branco sumia */
  html body .btn-cart-finalizar:hover,
  html body .btn-cart-finalizar:focus,
  html body .btn-cart-finalizar:active { background-color: #E86F00 !important; color: #FFFFFF !important; border-color: transparent !important; }

  /* ---------- FINALIZAR ---------- */
  html body .fin-page .accordion-item,
  html body .fin-page .accordion-button,
  html body .fin-page .accordion-body,
  html body #div_cupom,
  html body #collapse4, html body #collapse4 .accordion-body,
  html body #area-obs,
  html body .fin-page #collapseTwo .list-group-item,
  html body .fin-page #collapse4 .form-check { background: var(--lc-card) !important; border-color: var(--lc-borda) !important; color: var(--lc-texto); }
  html body .fin-page .accordion-item { box-shadow: var(--lc-sombra) !important; }
  html body .total-finalizar.fin-page { background: rgba(255, 255, 255, .97) !important; border-top: 1px solid var(--lc-borda) !important; color: var(--lc-texto); }
  html body .fin-page .input:-webkit-autofill,
  html body .fin-page .input:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--lc-texto) !important; -webkit-box-shadow: 0 0 0 1000px #FFFFFF inset !important; box-shadow: 0 0 0 1000px #FFFFFF inset !important;
  }
  html body .telefone_user::placeholder, html body #nome::placeholder { color: var(--lc-muted) !important; }
  html body .swal-fin-sucesso.swal2-popup { background: var(--lc-card) !important; color: var(--lc-texto) !important; }
  html body .select2-container--default .select2-selection--single .select2-selection__rendered,
  html body .select2-container--default .select2-search--dropdown .select2-search__field,
  html body .select2-container--default .select2-results__option { color: var(--lc-texto) !important; }
  html body .select2-dropdown { background: var(--lc-card) !important; border-color: var(--lc-borda) !important; }


  /* finalizar: divisórias, linhas dos campos e botão "Não" eram brancos translúcidos (sumiam no fundo branco) */
  html body .fin-page .accordion-item { box-shadow: 0 4px 16px rgba(36, 18, 28, .07) !important; border: 1px solid var(--lc-borda) !important; }
  html body .fin-page .accordion-button:not(.collapsed) { border-bottom: 1px solid var(--lc-borda) !important; box-shadow: none !important; }
  html body .fin-page .accordion-button::after { filter: none !important; opacity: .65; }
  html body .fin-page .accordion-body hr { border-color: var(--lc-borda) !important; opacity: 1; }
  html body .fin-page .accordion-body img[src*="user.jpg"] { background: #F3EEF2 !important; }
  html body .fin-page .input,
  html body .fin-page #collapseOne .telefone_user,
  html body .fin-page #collapseOne .nome_user input {
    background: #FBF8FA !important; color: var(--lc-texto) !important; border: 0 !important; border-bottom: 1px solid #DCD1D8 !important; border-radius: 10px 10px 0 0 !important;
  }
  html body .fin-page .input:focus,
  html body .fin-page #collapseOne .telefone_user:focus,
  html body .fin-page #collapseOne .nome_user input:focus { background: #FFFFFF !important; border-bottom: 2px solid #FF7A00 !important; }
  html body .fin-page .label { color: var(--lc-muted) !important; }
  html body #area-obs .input { background: #FBF8FA !important; border-bottom: 1px solid #DCD1D8 !important; }
  html body #div_cupom .form-control { background: #FBF8FA !important; color: var(--lc-texto) !important; border: 1px solid #DCD1D8 !important; }
  html body #div_cupom .form-control::placeholder { color: var(--lc-muted) !important; }
  html body .fin-page .botao_nao { background: #FFFFFF !important; color: var(--lc-texto) !important; border: 1px solid #DCD1D8 !important; }
  html body .fin-page .botao_nao:hover,
  html body .fin-page .botao_nao:active,
  html body .fin-page .botao_nao:focus { background: #F6F1F4 !important; color: var(--lc-texto) !important; border-color: #C9BCC4 !important; }
  html body .fin-page #collapseTwo .list-group-item,
  html body .fin-page #collapse4 .form-check { border: 1px solid var(--lc-borda) !important; }
  html body .fin-page #collapseTwo .list-group-item:hover { border-color: rgba(255, 122, 0, .45) !important; }
  html body .fin-page #collapseTwo .list-group-item:has(.form-check-input:checked) { border-color: #FF7A00 !important; background: #FFF7F0 !important; }

  /* ---------- MEUS PEDIDOS ---------- */
  html body .pedido-card-app { background: var(--lc-card) !important; color: var(--lc-texto) !important; border-color: var(--lc-borda) !important; box-shadow: var(--lc-sombra) !important; }
  html body .pedido-card-app:hover { color: var(--lc-texto) !important; }
  html body .pedido-card-app__data, html body .meus-pedidos-vazio { color: var(--lc-muted) !important; }

  /* valores e textos com cor clara fixa (id ou style inline) */
  html body #total-do-pedido { color: var(--lc-texto) !important; }
  html body [style*="color:#f1e9ee" i], html body [style*="color: #f1e9ee" i] { color: var(--lc-texto) !important; }
  html body [style*="color:#c9b3bf" i], html body [style*="color: #c9b3bf" i] { color: var(--lc-muted) !important; }
}