
/* ============================================================
   TUA PELE — interface aprovada pronta para produção
   Autor: Hacker 0 5 90
   Objetivo: aplicar o visual branco/mobile-app do design aprovado
   sem quebrar IDs, Firebase, Functions, permissões ou UX otimista.
   ============================================================ */

:root {
  --tp-bg: #FFFFFF;
  --tp-surface: #FFFFFF;
  --tp-soft: #F7F1EA;
  --tp-soft-2: #F2EAE2;
  --tp-line: #EDE3D9;
  --tp-line-strong: rgba(92,48,32,.16);
  --tp-ink: #3A2118;
  --tp-brown: #5C3020;
  --tp-brown-2: #8B4A2E;
  --tp-muted: #7A6154;
  --tp-muted-2: #A08A7C;
  --tp-green: #5D8A5E;
  --tp-red: #C0392B;
  --tp-radius-sm: 9px;
  --tp-radius: 12px;
  --tp-radius-lg: 16px;
  --tp-bottom-h: 66px;
  --barra-inferior: 66px;
}

html,
body {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: var(--tp-ink) !important;
  font-family: var(--fonte-corpo), 'DM Sans', system-ui, sans-serif !important;
  min-height: 100vh;
  overflow-x: hidden;
}

body,
body[class],
body[style],
body::before,
body::after {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  box-shadow: none !important;
}

body.page-hidden {
  opacity: 1 !important;
  visibility: visible !important;
  animation: none !important;
}

body.auth-body,
body.login-body,
body.cliente-cadastro-body,
body.loja-body,
body.produto-body,
body.cart-body,
body.checkout-body,
body.minhas-compras-body,
body.profile-body,
body.client-home-body,
body.lista-body,
body.pedidos-body,
body.delivery-body,
body.adm-body,
body.dashboard-body,
body.painel-body,
body.caixa-body,
body.cadastro-body,
body.perfil-body,
body.pesquisa-body,
body.anuncios-body,
body.cardapio-body {
  background: #FFFFFF !important;
  background-image: none !important;
}

/* Remove fundos antigos com gradiente/radial das folhas legadas */
body :is(.app-bg, .page-bg, .hero-bg),
body :is(.login-body)::before,
body :is(.login-body)::after {
  display: none !important;
}

.logo-tua {
  color: var(--tp-brown) !important;
  font-family: var(--fonte-script), 'Great Vibes', cursive !important;
  font-weight: 400 !important;
  -webkit-text-stroke: 0 !important;
}
.logo-pele {
  color: var(--tp-brown-2) !important;
  font-family: var(--fonte-titulo), 'Cormorant Garamond', Georgia, serif !important;
  font-weight: 600 !important;
  -webkit-text-stroke: 0 !important;
}

/* Estrutura real, sem camada falsa por cima: a página em si é branca */
main,
.content-wrapper,
.cart-main,
.checkout-main,
.purchase-main,
.profile-main,
.delivery-main,
.dashboard-main,
.seller-main,
.adm-main,
.page-main,
.products-container,
.page-content,
.main-content,
.admin-main,
.caixa-main,
.painel-main,
.orders-main,
.produto-main,
.product-page,
.lista-main {
  background: #FFFFFF !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Topbar igual ao desenho aprovado: branca, fina, sem sombra pesada */
.loja-header,
.admin-header,
.delivery-header,
.profile-topbar,
.cart-header,
.checkout-header,
.purchase-header,
.seller-header,
.dashboard-header,
.caixa-header,
.painel-header,
.app-header,
.products-header,
.lista-header,
.product-header,
header[class*="header"] {
  background: #FFFFFF !important;
  background-image: none !important;
  border-bottom: 1px solid var(--tp-line) !important;
  box-shadow: none !important;
  color: var(--tp-ink) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.header-center h1,
.admin-header h1,
.delivery-header h1,
.checkout-header h1,
.purchase-header h1,
.cart-header h1,
.seller-header h1,
.dashboard-header h1,
.caixa-title,
.page-title,
.admin-title {
  color: var(--tp-brown) !important;
  font-family: var(--fonte-titulo), 'Cormorant Garamond', Georgia, serif !important;
  font-size: clamp(20px, 5.4vw, 26px) !important;
  font-weight: 600 !important;
  letter-spacing: -.01em !important;
}

/* Botões/ícones compactos do design */
.icon-btn,
.header-icon-btn,
.hamburger-btn,
.back-btn,
.search-categories-btn,
.filter-btn,
.order-filter-btn,
.purchase-filter-btn,
.transfer-filter-btn,
.profile-tab-btn,
.tab-btn,
button[class*="filter"],
.btn-secundario,
.secondary-btn,
.state-btn.secondary,
.header-cart-btn {
  border: 1px solid var(--tp-line) !important;
  background: #FFFFFF !important;
  background-image: none !important;
  color: var(--tp-muted) !important;
  box-shadow: none !important;
  border-radius: 999px !important;
}
.icon-btn,
.header-icon-btn,
.hamburger-btn,
.back-btn,
.header-cart-btn {
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  border-radius: 10px !important;
  color: var(--tp-brown) !important;
  background: var(--tp-soft) !important;
}
.search-categories-btn {
  height: 40px !important;
  border-radius: 20px !important;
  padding: 0 12px !important;
  text-align: left !important;
}

.btn-primario,
.primary-btn,
.submit-btn,
.state-btn.primary,
.finish-order-btn,
.checkout-btn,
.action-btn.primary,
button[type="submit"],
.confirm-btn,
.sheet-add-btn,
.delivery-action-btn,
.availability-btn,
.payment-btn,
.btn-primary {
  background: var(--tp-ink) !important;
  background-image: none !important;
  color: #FFFFFF !important;
  border: 1px solid var(--tp-ink) !important;
  border-radius: 13px !important;
  box-shadow: none !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
.btn-primario:hover,
.primary-btn:hover,
.submit-btn:hover,
.finish-order-btn:hover,
.checkout-btn:hover,
.action-btn.primary:hover,
button[type="submit"]:hover,
.btn-primary:hover {
  background: var(--tp-brown) !important;
  color: #FFFFFF !important;
  transform: translateY(-1px);
}

/* Cards e painéis — exatamente no espírito dos ecrãs: branco + linha fina */
.horizontal-section,
.checkout-panel,
.checkout-summary .summary-card,
.cart-card,
.cart-summary,
.purchase-card,
.order-card,
.delivery-card,
.adm-card,
.filters-card,
.metric-card,
.profile-panel,
.profile-hero-card,
.product-main-info,
.product-description-card,
.product-specs-card,
.bottom-sheet-content,
.sheet-content,
.modal-content,
.summary-card,
.empty-state,
.state-box,
.auth-card,
.client-card,
.dashboard-card,
.seller-card,
.list-card,
.panel-card,
.report-card,
.stat-card,
.kpi-card,
.employee-card,
.transfer-history-item,
.order-item,
.purchase-item,
.cart-item,
.summary-item {
  background: #FFFFFF !important;
  background-image: none !important;
  border: 1px solid var(--tp-line) !important;
  border-radius: var(--tp-radius-lg) !important;
  box-shadow: none !important;
}
.horizontal-section,
.products-container {
  border-color: transparent !important;
}

.section-title,
.section-heading h2,
.section-heading h3,
.panel-heading h2,
.summary-heading h2,
.profile-panel__title,
.product-title,
.product-name,
.card-title,
.adm-card h2,
.adm-card h3,
.metric-card strong,
.kpi-card strong {
  font-family: var(--fonte-titulo), 'Cormorant Garamond', Georgia, serif !important;
  color: var(--tp-brown) !important;
  font-weight: 600 !important;
}
.section-title,
.section-heading h2,
.panel-heading h2 {
  position: relative;
  display: inline-block;
  margin: 6px 0 18px !important;
  font-size: clamp(24px, 7vw, 28px) !important;
}
.section-title::after,
.section-heading h2::after,
.panel-heading h2::after {
  content: "";
  display: block;
  width: 60px;
  height: 3px;
  margin: 6px auto 0;
  border-radius: 2px;
  background: linear-gradient(90deg, transparent, #D4A88A, transparent);
}
.panel-heading h2::after,
.section-heading h2::after { margin-left: 0; }

/* Loja/produtos — alinhado ao design aprovado */
.products-horizontal-grid,
.rolar-x {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  gap: 11px !important;
  padding: 0 0 2px !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
}
.products-horizontal-grid::-webkit-scrollbar,
.rolar-x::-webkit-scrollbar { height: 0 !important; display:none !important; }

.product-card,
.products-horizontal-grid .product-card,
.product-card-link,
.recommended-card {
  background: #FFFFFF !important;
  background-image: none !important;
  border: 1px solid var(--tp-line) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  overflow: hidden !important;
  transform: none !important;
  transition: transform .18s ease, border-color .18s ease !important;
}
.product-card:hover,
.recommended-card:hover {
  transform: translateY(-1px) !important;
  box-shadow: none !important;
  border-color: var(--tp-line-strong) !important;
}
.product-image-wrapper,
.product-image-gallery,
.gallery-main,
.product-thumb,
.summary-thumb,
.cart-item-image,
.purchase-thumb,
.order-thumb,
.card-media,
.product-media,
.product-main-image {
  background: repeating-linear-gradient(45deg, #F7F1EA 0 7px, #EFE6DB 7px 14px) !important;
}
.product-image-wrapper {
  aspect-ratio: auto !important;
  min-height: 134px !important;
}
.product-image {
  object-fit: cover !important;
  transition: transform .18s ease !important;
}
.product-card:hover .product-image { transform: none !important; }
.product-info,
.recommended-card-body,
.cart-item-content,
.purchase-card-content,
.order-card-content {
  padding: 11px 12px 13px !important;
}
.product-title {
  margin: 0 0 4px !important;
  font-size: 16px !important;
  line-height: 1.15 !important;
  color: #782B0F !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.product-description,
.product-meta,
.meta-item,
.product-subtitle,
.card-description {
  color: var(--tp-muted) !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}
.stock-info {
  color: #6E5612 !important;
  background: #F7F1EA !important;
  border: 0 !important;
  border-radius: 8px !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  padding: 2px 6px !important;
}
.product-price,
.summary-total,
.cart-total,
.purchase-total,
.order-total,
.price,
.preco,
.total-value,
#totalValue,
#subtotalValue,
#shippingValue,
#estimatedRefundValue {
  color: var(--tp-green) !important;
  font-family: var(--fonte-corpo), system-ui, sans-serif !important;
  font-size: clamp(17px, 4.5vw, 18px) !important;
  font-weight: 700 !important;
}
.old-price,
.compare-price {
  color: #A8887A !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}
.discount-badge,
.badge-promo,
.card-badge.promo {
  background: var(--tp-red) !important;
  color: #FFFFFF !important;
  border-radius: 999px !important;
}
.card-badge,
.badge-featured,
.featured-badge,
.card-badge.destaque {
  padding: 4px 10px !important;
  border-radius: 999px !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: .05em !important;
  text-transform: uppercase !important;
  box-shadow: 0 4px 10px rgba(0,0,0,.15) !important;
}
.card-badge.destaque,
.badge-featured,
.featured-badge {
  background: linear-gradient(135deg, var(--tp-brown), #3A2118) !important;
  color: #F5EAE0 !important;
}

/* Formulários */
.input,
.form-field input,
.form-field textarea,
.form-field select,
.campo input,
.campo textarea,
.campo select,
.custom-select-btn,
.filter-select,
.search-box input,
input:not([type="checkbox"]):not([type="radio"]),
textarea,
select {
  background: #FFFFFF !important;
  background-image: none !important;
  border: 1px solid var(--tp-line) !important;
  border-radius: var(--tp-radius) !important;
  color: var(--tp-ink) !important;
  box-shadow: none !important;
  min-height: 44px;
}
.input:focus,
.form-field input:focus,
.form-field textarea:focus,
.search-box input:focus,
textarea:focus,
select:focus {
  border-color: var(--tp-brown) !important;
  box-shadow: 0 0 0 3px rgba(92,48,32,.08) !important;
}
label,
.form-field label,
.campo label {
  color: #5C4438 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

/* Filtros/separadores */
.filters-wrapper,
.profile-tabs,
.delivery-filters,
.order-filters,
.purchase-filters,
.adm-tabs,
.transfer-tabs,
.section-tabs,
.filter-tabs,
.orders-tabs,
.status-tabs {
  background: #FFFFFF !important;
  background-image: none !important;
  border-bottom: 1px solid var(--tp-line) !important;
  box-shadow: none !important;
}
.filter-btn.active,
.order-filter-btn.active,
.purchase-filter-btn.active,
.transfer-filter-btn.active,
.profile-tab-btn.active,
.tab-btn.active,
.active-filter {
  background: var(--tp-ink) !important;
  color: #FFFFFF !important;
  border-color: var(--tp-ink) !important;
  box-shadow: none !important;
}

/* Bottom sheets, modais e alertas */
.bottom-sheet,
.sheet-backdrop,
.sheet-overlay { z-index: 2200 !important; }
.bottom-sheet-content,
.sheet-content,
[class*="bottom-sheet"] [class*="content"],
.selection-modal-content,
.modal-card,
.tp-confirm-card {
  border-radius: 20px 20px 0 0 !important;
  background: #FFFFFF !important;
  background-image: none !important;
  border-top: 1px solid var(--tp-line) !important;
  box-shadow: 0 -12px 34px rgba(60,33,24,.18) !important;
}
.modal-content,
.tp-confirm-card {
  border-radius: 18px !important;
  border: 1px solid var(--tp-line) !important;
}
.tp-toast,
.toast,
.ux-toast {
  background: #FFFFFF !important;
  color: var(--tp-ink) !important;
  border: 1px solid var(--tp-line) !important;
  box-shadow: 0 10px 24px rgba(60,33,24,.12) !important;
  border-radius: 14px !important;
}

/* Checkout/endereço do perfil */
.delivery-profile-address {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 13px 14px;
  margin: 14px 0 10px;
  border-radius: 14px;
  border: 1px solid var(--tp-line);
  background: var(--tp-soft);
}
.delivery-profile-address i {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #FFFFFF;
  color: var(--tp-brown);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
}
.delivery-profile-address strong { display:block; color:var(--tp-ink); font-size:13.5px; }
.delivery-profile-address span { display:block; margin-top:2px; color:var(--tp-muted); font-size:12px; line-height:1.45; }
.delivery-profile-address a { margin-left:auto; color:var(--tp-brown-2); font-size:12px; font-weight:700; white-space:nowrap; }
.delivery-profile-address.is-missing { background: #FDF7E8; border-color: rgba(192,154,43,.35); }
.delivery-post-note { color:var(--tp-muted) !important; font-size:12.5px !important; }

/* Barra inferior aprovada */
.tua-bottom-nav {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  z-index: 2100;
  display: none;
  justify-content: space-between;
  gap: 2px;
  padding: 8px 18px calc(12px + env(safe-area-inset-bottom));
  background: #FFFFFF;
  border-top: 1px solid var(--tp-line);
  box-shadow: 0 -6px 18px rgba(60,33,24,.07);
}
.tua-bottom-nav a,
.tua-bottom-nav button {
  flex: 1;
  min-height: 44px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  color: var(--tp-muted);
  font-size: 10px;
  font-weight: 500;
  border: 0 !important;
  background: transparent !important;
  border-radius: 12px !important;
  text-align: center;
  line-height: 1.1;
}
.tua-bottom-nav a i,
.tua-bottom-nav button i { font-size: 15px; }
.tua-bottom-nav a.is-active,
.tua-bottom-nav button.is-active { color: var(--tp-brown); font-weight: 600; }
.tua-bottom-nav a.is-active i,
.tua-bottom-nav button.is-active i { color: var(--tp-brown); }

/* Mobile: sem gaveta, sem fundo bege, com app branco real */
@media (max-width: 768px) {
  html,
  body,
  body[class],
  main,
  .content-wrapper,
  .cart-main,
  .checkout-main,
  .purchase-main,
  .profile-main,
  .delivery-main,
  .dashboard-main,
  .seller-main,
  .adm-main,
  .page-main {
    width: 100% !important;
    max-width: 100% !important;
    background: #FFFFFF !important;
    background-image: none !important;
  }

  body.has-tua-bottom-nav {
    padding-bottom: calc(var(--tp-bottom-h) + env(safe-area-inset-bottom)) !important;
  }

  main,
  .content-wrapper,
  .cart-main,
  .checkout-main,
  .purchase-main,
  .profile-main,
  .delivery-main,
  .dashboard-main,
  .seller-main,
  .adm-main,
  .page-main,
  .lista-main,
  .products-container {
    margin: 0 auto !important;
    padding-bottom: calc(86px + env(safe-area-inset-bottom)) !important;
  }

  .loja-header,
  .admin-header,
  .delivery-header,
  .profile-topbar,
  .cart-header,
  .checkout-header,
  .purchase-header,
  .seller-header,
  .dashboard-header,
  .caixa-header,
  .app-header,
  .products-header,
  header[class*="header"] {
    position: sticky !important;
    top: 0 !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    min-height: 56px !important;
    padding: 10px 16px 12px !important;
    z-index: 1000 !important;
    animation: none !important;
  }

  .content-wrapper { margin-top: 0 !important; padding: 18px 18px calc(86px + env(safe-area-inset-bottom)) !important; }
  .loja-header .auth-lema { display: none !important; }
  .loja-header .logo-tua { font-size: 26px !important; }
  .loja-header .logo-pele { font-size: 18px !important; }
  .header-search-container { margin: 0 !important; }

  .hamburger-btn,
  #menu-toggle,
  .nav-drawer,
  .drawer-overlay,
  #menu-mobile,
  #menu-overlay {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
  .drawer-open,
  body.menu-open { overflow: auto !important; }
  .footer,
  footer:not(.keep-footer),
  .adm-footer,
  .loja-footer,
  .site-footer { display: none !important; }

  .tua-bottom-nav { display: flex !important; }

  .horizontal-section {
    margin: 0 0 26px !important;
    padding: 0 !important;
    border: 0 !important;
  }
  .section-header,
  .section-heading,
  .panel-heading {
    margin-bottom: 16px !important;
  }
  .products-horizontal-grid .product-card {
    flex: 0 0 156px !important;
    width: 156px !important;
    min-width: 156px !important;
  }
  .products-horizontal-grid .product-image-wrapper { height: 134px !important; min-height: 134px !important; }
  .products-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 12px !important;
    padding: 0 !important;
  }
  .products-grid .product-image-wrapper { height: 150px !important; min-height: 150px !important; }

  .filters-wrapper {
    position: static !important;
    top: auto !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
  }
  .filters-container {
    padding: 11px 0 !important;
    margin: 0 !important;
    max-width: none !important;
  }

  .cart-page-shell,
  .checkout-shell,
  .orders-shell,
  .profile-shell,
  .delivery-shell,
  .adm-shell,
  .dashboard-shell,
  .painel-shell {
    background: #FFFFFF !important;
    border: 0 !important;
    box-shadow: none !important;
  }
}

/* PC/tablet: gaveta permitida, fundo branco, largura elegante */
@media (min-width: 769px) {
  .tua-bottom-nav { display: none !important; }
  html,
  body,
  body[class] {
    background: #FFFFFF !important;
  }
  body:not(.auth-body) > header,
  body:not(.auth-body) > main,
  body:not(.auth-body) > footer,
  body:not(.auth-body) > .profile-topbar {
    max-width: min(1180px, calc(100vw - 48px));
    margin-left: auto;
    margin-right: auto;
  }
  body:is(.loja-body,.produto-body,.cart-body,.checkout-body,.minhas-compras-body,.profile-body,.delivery-body) > header,
  body:is(.loja-body,.produto-body,.cart-body,.checkout-body,.minhas-compras-body,.profile-body,.delivery-body) > main {
    max-width: min(760px, calc(100vw - 48px));
  }
  .nav-drawer { display: block; }
}

/* Ajustes finais contra resíduos antigos */
[class*="gradient"],
[class*="blob"],
.decorative-bg,
.floating-bg {
  background-image: none !important;
}
.sheet-helper-note {
  margin: 10px 0 0;
  color: var(--tp-muted);
  font-size: 12.5px;
  line-height: 1.45;
}

/* ============================================================
   AJUSTES DE PRODUÇÃO — LISTA 1 DO CLIENTE
   Data: 2026-08-02
   Objetivo: corrigir as páginas apontadas nos prints sem mexer
   no backend nem nos IDs usados pelo Firebase.
   ============================================================ */

/* O efeito de carregamento agora nasce branco, sem bege nem gradiente. */
.page-loader,
#pageLoader,
.loader-overlay,
.loading-overlay,
.skeleton-page,
body.page-hidden::before,
body.page-hidden::after {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
}
.page-loader::before,
.page-loader::after,
#pageLoader::before,
#pageLoader::after {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Login / criar conta: remover linhas de contorno desnecessárias. */
.auth-body,
.login-body,
.cliente-cadastro-body {
  background: #FFFFFF !important;
  background-image: none !important;
}
.login-body::before,
.login-body::after,
.cliente-cadastro-body::before,
.cliente-cadastro-body::after {
  display: none !important;
  content: none !important;
  background: transparent !important;
}
.auth-header,
.login-body .auth-header,
.cliente-cadastro-body .auth-header,
.login-branding-side {
  border: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
.auth-logo::before,
.auth-logo::after,
.auth-header::before,
.auth-header::after,
.login-branding-side::before,
.login-branding-side::after {
  display: none !important;
  content: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.auth-card,
.login-card,
.cliente-cadastro-body .auth-card,
.login-body .auth-card {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}
.login-body .auth-logo,
.cliente-cadastro-body .auth-logo {
  border: 0 !important;
  box-shadow: none !important;
}

/* Loja/index: laterais das galerias ficam brancas como o body. */
.loja-body .content-wrapper,
.loja-body .horizontal-section,
.loja-body .products-container,
.loja-body .section-header,
.loja-body .products-horizontal-grid,
.loja-body .products-grid {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
}
@media (max-width: 768px) {
  .loja-body .content-wrapper {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
  .loja-body .horizontal-section,
  .loja-body .products-container {
    width: 100% !important;
    overflow: hidden !important;
  }
  .loja-body .products-horizontal-grid {
    margin-left: -18px !important;
    margin-right: -18px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
    scroll-padding-left: 18px !important;
    scroll-padding-right: 18px !important;
  }
}

/* Header da loja: carrinho alinhado e sem corte. */
.loja-header .header-right,
.loja-header .header-buttons {
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex: 0 0 40px !important;
  overflow: visible !important;
}
.loja-header .header-cart-btn {
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  overflow: visible !important;
}
.loja-header .header-cart-btn i {
  display: block !important;
  line-height: 1 !important;
  margin: 0 !important;
  transform: none !important;
}

/* Pesquisa: corrigir barra e remover containers dos títulos. */
.pesquisa-body .search-page-container {
  padding-left: 18px !important;
  padding-right: 18px !important;
  gap: 28px !important;
}
.pesquisa-body .input-wrapper {
  height: 54px !important;
  border: 1.5px solid var(--tp-brown) !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  box-shadow: 0 8px 24px rgba(92,48,32,.05) !important;
  background: #FFFFFF !important;
}
.pesquisa-body .search-input-field {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding-right: 62px !important;
}
.pesquisa-body .search-submit-btn {
  right: 7px !important;
  top: 50% !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  border-radius: 50% !important;
  transform: translateY(-50%) !important;
  box-shadow: none !important;
  border: 0 !important;
  z-index: 2 !important;
}
.pesquisa-body .search-submit-btn:hover {
  transform: translateY(-50%) !important;
}
.pesquisa-body .section-title,
.pesquisa-body .section-heading h2,
.pesquisa-body .panel-heading h2 {
  width: 100% !important;
  max-width: none !important;
  display: block !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  text-align: center !important;
}
.pesquisa-body .section-title::after,
.pesquisa-body .section-heading h2::after,
.pesquisa-body .panel-heading h2::after {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Listar-c: filtros compactos, sem espaço vago acima. */
.lista-body .filters-wrapper {
  margin-top: 0 !important;
  margin-bottom: 10px !important;
  padding-top: 0 !important;
  background: #FFFFFF !important;
}
.lista-body .filters-container {
  min-height: 0 !important;
  padding: 6px 18px 8px !important;
  margin: 0 auto !important;
  gap: 8px !important;
}
.lista-body .filters-inner,
.lista-body .filter-buttons {
  gap: 8px !important;
  min-height: 0 !important;
}
.lista-body .filter-btn,
.lista-body .promo-toggle {
  min-height: 34px !important;
  padding: 6px 12px !important;
}
@media (max-width: 768px) {
  .lista-body .content-wrapper {
    padding-top: 64px !important;
  }
  .lista-body .products-container {
    padding-top: 8px !important;
  }
}

/* Produto/produto-c: preservar a estrutura original; só fundo branco + barra inferior. */
.produto-body .product-detail-container,
.produto-body .product-main-info,
.produto-body .product-image-gallery,
.produto-body .product-details,
.produto-body .product-main-info,
.produto-body .product-main-info:is(.product-main-info) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}
.produto-body .product-details {
  max-height: none !important;
  overflow: visible !important;
}
@media (max-width: 768px) {
  .produto-body .content-wrapper {
    padding: 65px 0 calc(86px + env(safe-area-inset-bottom)) !important;
    margin: 0 !important;
  }
  .produto-body .product-detail-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .produto-body .product-main-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100% !important;
  }
  .produto-body .product-image-gallery {
    width: 100% !important;
    margin-bottom: 20px !important;
  }
  .produto-body .main-image-container {
    border-radius: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
  }
}

/* Corrigir pequenos resíduos de links/preview local com URL limpa só em produção. */
@media (max-width: 768px) {
  .tua-bottom-nav {
    background: #FFFFFF !important;
    border-top-color: var(--tp-line) !important;
  }
}


/* ============================================================
   AJUSTES DE PRODUÇÃO — LISTA 2 DO CLIENTE
   Data: 2026-08-02
   Objetivo: corrigir inputs, cards, produto-c e espaços vazios
   mantendo a lógica Firebase intacta.
   ============================================================ */

:root {
  --tp-card-warm: #FDF8F4;
  --tp-card-warm-2: #FAF1EA;
}

/* Login/criar conta: campos como linha horizontal, sem caixas. */
.login-body .auth-form .campo,
.cliente-cadastro-body .auth-form .campo {
  margin-bottom: 18px !important;
}

.login-body .auth-form .input,
.cliente-cadastro-body .auth-form .input,
.login-body .auth-form input.input,
.cliente-cadastro-body .auth-form input.input,
.cliente-cadastro-body .auth-form textarea.input,
.login-body .auth-form button.custom-select-btn,
.cliente-cadastro-body .auth-form button.custom-select-btn {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 1.4px solid rgba(92, 48, 32, 0.26) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 11px 2px 10px !important;
  min-height: 44px !important;
  color: var(--tp-ink) !important;
}

.login-body .auth-form .input:hover,
.cliente-cadastro-body .auth-form .input:hover,
.login-body .auth-form .input:focus,
.cliente-cadastro-body .auth-form .input:focus,
.login-body .auth-form input.input:focus,
.cliente-cadastro-body .auth-form input.input:focus,
.cliente-cadastro-body .auth-form textarea.input:focus,
.login-body .auth-form button.custom-select-btn:focus,
.cliente-cadastro-body .auth-form button.custom-select-btn:focus,
.login-body .auth-form button.custom-select-btn.active,
.cliente-cadastro-body .auth-form button.custom-select-btn.active {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1.6px solid var(--tp-brown) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.login-body .password-input-wrap {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1.4px solid rgba(92, 48, 32, 0.26) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
}

.login-body .password-input-wrap:focus-within {
  border-bottom-color: var(--tp-brown) !important;
}

.login-body .password-input-wrap .input {
  border-bottom: 0 !important;
  padding-right: 44px !important;
}

.login-body .password-toggle {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: var(--tp-brown) !important;
  width: 38px !important;
  height: 38px !important;
  margin-left: -40px !important;
}

.cliente-cadastro-body .auth-grid-2 {
  gap: 18px 20px !important;
}

.cliente-cadastro-body .profile-upload-label {
  background: var(--tp-card-warm) !important;
  border: 1px dashed rgba(92, 48, 32, 0.32) !important;
  box-shadow: none !important;
}

/* Cards de produtos: voltar para fundo creme suave para destacar no body branco. */
.product-card,
.products-horizontal-grid .product-card,
.products-grid .product-card,
.product-card-link,
.recommended-card,
.recommended-section .product-card {
  background: var(--tp-card-warm) !important;
  background-color: var(--tp-card-warm) !important;
  border-color: rgba(92, 48, 32, 0.16) !important;
}

.product-card .product-info,
.recommended-card-body {
  background: var(--tp-card-warm) !important;
  background-color: var(--tp-card-warm) !important;
}

/* Manter mídia dos produtos neutra, sem quebrar a imagem real. */
.product-image-wrapper,
.card-media,
.product-media {
  background: #EFE7DF !important;
}

/* Produto-c/produto: header grudado na galeria e cards de informação com o mesmo creme. */
.produto-body .content-wrapper {
  background: #FFFFFF !important;
}

@media (max-width: 768px) {
  .produto-body .content-wrapper {
    padding-top: 57px !important;
  }

  .produto-body .product-detail-container {
    padding-top: 0 !important;
  }

  .produto-body .product-main-info {
    margin-top: 0 !important;
  }

  .produto-body .product-image-gallery {
    margin-top: 0 !important;
    margin-bottom: 16px !important;
  }

  .produto-body .gallery-controls {
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
  }

  .produto-body .main-image-container {
    margin: 0 !important;
    height: calc(100vw - 0px) !important;
    border-radius: 0 !important;
  }

  .produto-body .thumbnail-list {
    background: #FFFFFF !important;
    padding: 12px 18px 0 !important;
  }
}

.produto-body .price-and-buy-section,
.produto-body .product-description,
.produto-body .product-variations,
.produto-body .product-specs,
.produto-body .stock-shipping,
.produto-body .guarantee-section,
.produto-body .social-summary-card,
.produto-body .reviews-list,
.produto-body .rating-toggle-row,
.produto-body .product-category-gender-audience,
.produto-body .product-specs-card,
.produto-body .product-description-card,
.produto-body .product-info-card,
.produto-body .product-meta-card {
  background: var(--tp-card-warm) !important;
  background-color: var(--tp-card-warm) !important;
  border: 1px solid rgba(92, 48, 32, 0.12) !important;
  box-shadow: none !important;
}

/* Chips dentro do produto continuam leves. */
.produto-body .category-badge,
.produto-body .gender-badge,
.produto-body .audience-badge,
.produto-body .meta-item {
  background: #FFFFFF !important;
  border: 1px solid rgba(92, 48, 32, 0.10) !important;
}

/* Listar-c: eliminar o espaço vago entre header e filtros. */
.lista-body .content-wrapper {
  padding-top: 57px !important;
}

.lista-body .filters-wrapper {
  top: 57px !important;
  margin-top: 0 !important;
  margin-bottom: 8px !important;
  padding: 0 !important;
}

.lista-body .filters-container {
  padding-top: 6px !important;
  padding-bottom: 7px !important;
}

.lista-body .products-container {
  padding-top: 0 !important;
}

@media (max-width: 768px) {
  .lista-body .content-wrapper {
    padding-top: 57px !important;
  }

  .lista-body .filters-wrapper {
    top: 57px !important;
  }
}


/* ============================================================
   AJUSTES DE PRODUÇÃO — LISTA 3 DO CLIENTE
   Data: 2026-08-02
   Objetivo: eliminar espaços vazios, limpar blocos creme indevidos,
   expandir conteúdo e reorganizar avaliações.
   ============================================================ */

/* Header mobile com altura real fixa para evitar cálculo errado de espaço. */
@media (max-width: 768px) {
  .produto-body .loja-header,
  .lista-body .loja-header,
  .loja-header {
    height: 56px !important;
    min-height: 56px !important;
    padding-top: 7px !important;
    padding-bottom: 7px !important;
  }
}

/* Produto-c/produto: galeria deve começar imediatamente abaixo do header. */
@media (max-width: 768px) {
  .produto-body .content-wrapper {
    padding-top: 56px !important;
    margin-top: 0 !important;
  }

  .produto-body .product-detail-container,
  .produto-body .product-main-info,
  .produto-body .product-image-gallery,
  .produto-body .gallery-controls {
    margin-top: 0 !important;
    padding-top: 0 !important;
    top: auto !important;
  }

  .produto-body .product-detail-container {
    width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .produto-body .product-image-gallery {
    display: block !important;
    width: 100% !important;
    gap: 0 !important;
  }

  .produto-body .gallery-controls {
    display: block !important;
    width: 100% !important;
    line-height: 0 !important;
  }

  .produto-body .main-image-container {
    display: block !important;
    width: 100% !important;
    height: min(100vw, 520px) !important;
    min-height: 360px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    line-height: 0 !important;
  }

  .produto-body .main-product-image {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  .produto-body .thumbnail-list {
    margin: 0 !important;
    padding: 12px 18px 0 !important;
  }
}

/* Listar-c: remover espaço real entre header e filtros. */
@media (max-width: 768px) {
  .lista-body .content-wrapper {
    padding-top: 56px !important;
    margin-top: 0 !important;
  }

  .lista-body .filters-wrapper {
    position: sticky !important;
    top: 56px !important;
    margin-top: 0 !important;
    margin-bottom: 8px !important;
    padding-top: 0 !important;
    border-top: 0 !important;
  }

  .lista-body .filters-container {
    padding-top: 6px !important;
    padding-bottom: 7px !important;
    margin-top: 0 !important;
  }

  .lista-body .products-container {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }
}

/* Onde não precisa fundo creme: chips/categorias e blocos simples voltam a branco. */
.produto-body .product-category-gender-audience,
.produto-body .rating-toggle-row,
.produto-body .reviews-toolbar,
.produto-body .toolbar-group,
.produto-body .review-form-locked,
.produto-body .reviews-list,
.produto-body .review-card,
.produto-body .category-badge,
.produto-body .gender-badge,
.produto-body .audience-badge {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
}

/* Container de categorias não deve ter caixa retangular externa. */
.produto-body .product-category-gender-audience {
  width: 100% !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 20px 0 16px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

.produto-body .category-badge,
.produto-body .gender-badge,
.produto-body .audience-badge {
  border: 1px solid rgba(92, 48, 32, 0.13) !important;
  border-radius: 999px !important;
  padding: 9px 18px !important;
}

/* Cards de produto: remover a linha retangular da descrição curta. */
.product-card .product-description,
.products-grid .product-card .product-description,
.products-horizontal-grid .product-card .product-description,
.recommended-section .product-card .product-description {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
}

/* Produto-c: conteúdo deve preencher a largura útil, sem ficar comprimido à esquerda. */
@media (max-width: 768px) {
  .produto-body .product-details {
    width: 100% !important;
    max-width: none !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
    box-sizing: border-box !important;
  }

  .produto-body .price-and-buy-section,
  .produto-body .stock-shipping,
  .produto-body .guarantee-section,
  .produto-body .product-description,
  .produto-body .product-variations,
  .produto-body .product-specs,
  .produto-body .social-product-section,
  .produto-body .social-summary-card {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Avaliações: limpar linhas quebradas e organizar como card limpo. */
.produto-body .social-product-section {
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.produto-body .social-summary-card {
  background: var(--tp-card-warm) !important;
  border: 1px solid rgba(92, 48, 32, 0.12) !important;
  border-radius: 20px !important;
  padding: 20px !important;
  box-shadow: none !important;
}

.produto-body .social-summary-card,
.produto-body .social-summary-card * {
  box-sizing: border-box !important;
}

.produto-body .social-summary-top {
  border: 0 !important;
  margin-bottom: 16px !important;
}

.produto-body .social-summary-top h3 {
  margin: 0 0 4px !important;
  font-family: var(--fonte-titulo), Georgia, serif !important;
  font-size: 26px !important;
  color: var(--tp-brown) !important;
}

.produto-body .social-summary-top p {
  margin: 0 !important;
  color: var(--tp-muted) !important;
}

.produto-body .social-rating-overview {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 16px !important;
  margin: 0 0 18px !important;
}

.produto-body .rating-big-box {
  background: #FFFFFF !important;
  border: 1px solid rgba(92, 48, 32, 0.14) !important;
  border-radius: 18px !important;
  padding: 22px 16px !important;
  box-shadow: none !important;
}

.produto-body .rating-breakdown {
  display: grid !important;
  gap: 9px !important;
}

.produto-body .rating-breakdown .breakdown-row {
  display: grid !important;
  grid-template-columns: 34px 1fr 22px !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.produto-body .breakdown-row .bar {
  height: 8px !important;
  background: #EEDDD0 !important;
  border-radius: 999px !important;
  overflow: hidden !important;
}

.produto-body .breakdown-row .fill {
  background: var(--tp-brown) !important;
  border-radius: 999px !important;
}

.produto-body .reviews-toolbar {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
  margin: 18px 0 10px !important;
  border: 0 !important;
  padding: 0 !important;
}

.produto-body .reviews-toolbar select.input {
  background: #FFFFFF !important;
  border: 1px solid rgba(92, 48, 32, 0.14) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  min-height: 48px !important;
  padding: 0 14px !important;
}

.produto-body .review-form-locked {
  border: 0 !important;
  color: var(--tp-muted) !important;
  line-height: 1.45 !important;
  padding: 6px 0 !important;
  margin: 0 !important;
}

.produto-body .reviews-list {
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

.produto-body .reviews-list:empty::after {
  content: "Sem avaliações.";
  display: block;
  color: var(--tp-muted);
  padding: 8px 0 0;
}

/* Se o JS inserir texto solto, evita aparência de tabela quebrada. */
.produto-body .reviews-list > * {
  border: 0 !important;
  box-shadow: none !important;
}
