/* ============================================================
   Loja Core · lc-chrome.css — cores do header e o footer do design "18-PDP-Produto".
   As variáveis --hdr-* / --ftr-* vêm do tom escolhido em Aparência → Header e footer
   (inc/chrome-tones.php). Carrega por último (depois de lc-cta.css): no header só troca cor,
   a estrutura continua a do tema. `!important` apenas onde lc-cta.css já usava.
   ============================================================ */

/* ─── Header ─────────────────────────────────────────────── */

/* Faixa de avisos */
body .mo-hdr-promo { background: var(--hdr-top) !important; color: var(--hdr-ink) !important; }
body .lcpb__msg { color: var(--hdr-ink); }
body .lcpb__msg .lcpb__ic { color: var(--hdr-ink2); }
body .lcpb__hl { color: var(--hdr-promo-hl); }

/* Barra do logo + busca: superfície lisa (sem a grade decorativa), como no design */
body .mo-hdr-wrap { background: var(--hdr-main); }
body .mo-hdr-main { background: var(--hdr-main) !important; background-image: none !important; color: var(--hdr-ink); box-shadow: var(--hdr-edge); }
body .mo-hdr-main__pattern { display: none; }
body .mo-hdr-wrap.is-sticky.is-scrolled .mo-hdr-main { box-shadow: var(--hdr-edge), 0 8px 24px rgba(12, 36, 64, .14); }

body .mo-hdr-main .lc-logo__word { color: var(--hdr-ink); }
body .mo-hdr-main .lc-logo__word em { color: var(--hdr-logo-em); }
body .mo-hdr-main .lc-logo__tag { color: var(--hdr-ink2); }

body .mo-hdr-main__search .mo-hdr-main__search-input { box-shadow: var(--hdr-search-bd); }
body .mo-hdr-main__search .mo-hdr-main__search-input:focus { box-shadow: var(--hdr-search-bd), 0 0 0 3px rgba(52, 131, 250, .35); }
body .mo-hdr-main__search-btn { background: var(--hdr-cat); box-shadow: none; transition-property: background-color, scale; }
body .mo-hdr-main__search-btn:hover { background: var(--hdr-cat); filter: brightness(1.15); }
body .mo-hdr-main__search-btn:active { scale: .96; }

body .mo-hdr-main__util { color: var(--hdr-ink); transition: opacity .15s ease; }
body .mo-hdr-main__util:hover { color: var(--hdr-ink); opacity: .75; }
body .mo-hdr-main__util-ic,
body .mo-hdr-main__util:hover .mo-hdr-main__util-ic { background: var(--hdr-chip); border-color: transparent; box-shadow: none; color: var(--hdr-ink) !important; }
body .mo-hdr-main__util-txt small { color: var(--hdr-ink2); }
body .mo-hdr-main__util-txt strong { color: var(--hdr-ink); }

body .mo-hdr-main__cart { background: #F4731C; box-shadow: none; transition-property: background-color, scale; transition-duration: .18s; }
body .mo-hdr-main__cart:hover { background: #E0640F; }
body .mo-hdr-main__cart:active { scale: .96; }
body .mo-hdr-main__cart-badge { background: #FFFFFF; color: #16375F; border: 0; box-shadow: 0 0 0 2px var(--hdr-main); }

/* Barra de categorias */
body .mo-hdr-nav { background: var(--hdr-nav) !important; box-shadow: var(--hdr-edge); }
body .mo-hdr-nav__cats,
body .mo-hdr-nav__cats:hover,
body .mo-hdr-nav__cats[aria-expanded="true"] { background: var(--hdr-cat); color: #FFFFFF; }
body .mo-hdr-nav__cats:hover { filter: brightness(1.12); }

body .lcn__top { color: var(--hdr-nav-ink); }
body .lcn__item:hover > .lcn__top,
body .lcn__item:focus-within > .lcn__top,
body .lcn__item.is-active > .lcn__top { color: var(--hdr-nav-ink); background: var(--hdr-hover); }
body .lcn__item--accent .lcn__top,
body .lcn__item--accent:hover .lcn__top { color: var(--hdr-hot); }
body .lcn__item--accent .lcn__top .lcn__ic { color: var(--hdr-hot); filter: none; }

body .lcn__cta {
  border: 0;
  background: var(--hdr-quote-bg);
  box-shadow: inset 0 0 0 1.5px var(--hdr-quote-bd);
  color: var(--hdr-quote-ink);
  transition-property: background-color, color, box-shadow, scale;
}
body .lcn__cta:hover,
body .lcn__cta:focus-visible { background: #F4731C; box-shadow: inset 0 0 0 1.5px #F4731C; color: #FFFFFF; }
body .lcn__cta:active { scale: .96; }
@media (max-width: 1023px) {
  body .lcn__cta { background: var(--hdr-nav); box-shadow: inset 0 0 0 1.5px var(--hdr-quote-bd), -14px 0 14px var(--hdr-nav); }
}

/* ─── Footer ─────────────────────────────────────────────── */

.lcf {
  --lcf-accent: #1FA85C;
  margin-top: 48px;
  color: var(--ftr-ink);
  font-family: var(--lc-font-body);
  -webkit-font-smoothing: antialiased;
}
.lcf *, .lcf *::before, .lcf *::after { box-sizing: border-box; }
.lcf :where(a) { color: inherit; text-decoration: none; }
.lcf :where(h4) { margin: 0; font-family: inherit; letter-spacing: normal; text-transform: none; }

.lcf__band--0 { background: var(--ftr-b0); }
.lcf__band--1 { background: var(--ftr-b1); box-shadow: var(--ftr-top); }
.lcf__band--2 { background: var(--ftr-b2); box-shadow: var(--ftr-top); }
.lcf__band--3 { background: var(--ftr-b3); box-shadow: var(--ftr-top); }
.lcf__band--4 { background: var(--ftr-b4); box-shadow: var(--ftr-top); }
.lcf__band--5 { background: var(--ftr-b5); box-shadow: var(--ftr-top); }
.lcf__in { max-width: 1312px; margin: 0 auto; padding-left: 16px; padding-right: 16px; } /* 1280 de conteúdo, como no design */

/* Ícones em quadrado suave */
.lcf__ic { display: flex; flex: none; align-items: center; justify-content: center; background: var(--ftr-icon-bg); color: var(--ftr-icon); }
.lcf__ic--40 { width: 40px; height: 40px; border-radius: 9px; }
.lcf__ic--34 { width: 34px; height: 34px; border-radius: 8px; }
body.lc-ftr-light .lcf__ic { box-shadow: inset 0 0 0 1px var(--ftr-chip-bd); }

/* 1 · Newsletter */
.lcf__news { padding-top: 18px; padding-bottom: 18px; display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.lcf__news-head { display: flex; align-items: center; gap: 12px; flex: 1 1 340px; min-width: 0; }
.lcf__news-txt { min-width: 0; }
.lcf__news-t { display: block; font-size: 19px; font-weight: 800; line-height: 1.25; color: var(--ftr-ink); text-wrap: balance; }
.lcf__accent { color: var(--lcf-accent); }
.lcf__news-s { display: block; margin-top: 2px; font-size: 12.5px; color: var(--ftr-ink2); text-wrap: pretty; }
.lcf__news-form { display: flex; gap: 8px; flex: 1 1 320px; min-width: 240px; margin: 0; }
.lcf .lcf__news-form input {
  flex: 1; min-width: 0; height: 44px; margin: 0; padding: 0 14px; border: 0; border-radius: 8px;
  background: #FFFFFF; color: #0C2440; font-size: 14px; font-family: inherit;
  box-shadow: inset 0 0 0 1px rgba(12, 36, 64, .18); outline: none;
  transition: box-shadow .15s ease;
}
.lcf .lcf__news-form input::placeholder { color: rgba(12, 36, 64, .45); }
.lcf .lcf__news-form input:focus { box-shadow: inset 0 0 0 1px rgba(12, 36, 64, .18), 0 0 0 3px rgba(31, 168, 92, .35); }
.lcf .lcf__news-form button {
  min-height: 44px; margin: 0; padding: 0 18px; border: 0; border-radius: 8px;
  background: var(--lcf-accent); color: #FFFFFF; font-family: inherit; font-size: 12.5px; font-weight: 800; letter-spacing: .6px;
  white-space: nowrap; cursor: pointer; box-shadow: none;
  transition-property: background-color, scale; transition-duration: .15s;
}
.lcf .lcf__news-form button:hover { background: #188A4B; color: #FFFFFF; }
.lcf .lcf__news-form button:active { scale: .96; }

/* 2 · Vantagens */
.lcf__perks { padding-top: 12px; padding-bottom: 12px; display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 10px 20px; }
.lcf__perk { display: flex; align-items: center; gap: 10px; min-width: 0; }
.lcf__perk-txt { font-size: 13px; line-height: 1.35; color: var(--ftr-ink); }
.lcf__perk-txt strong { display: block; font-weight: 700; }
.lcf__perk-txt span { display: block; font-size: 12px; color: var(--ftr-ink2); }

/* 3 · Links */
.lcf__cols { padding-top: 24px; padding-bottom: 22px; display: flex; flex-wrap: wrap; gap: 24px 32px; }
.lcf__col { min-width: 0; }
.lcf__col--inst { flex: 1 1 300px; }
.lcf__col--tel { flex: 1 1 190px; }
.lcf__col--cats { flex: 2 1 380px; }
.lcf .lcf__h {
  position: relative; margin-bottom: 10px; padding-bottom: 7px; border-bottom: 1px solid var(--ftr-div);
  font-size: 15px; font-weight: 800; line-height: 1.3; color: var(--ftr-ink);
}
.lcf .lcf__h::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 40px; height: 3px; border-radius: 2px 2px 0 0; background: var(--lcf-accent); }
.lcf .lcf__h--gap { margin-top: 18px; }
.lcf__links { display: grid; gap: 0 18px; }
.lcf__links--140 { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
.lcf__links--160 { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }
.lcf__links a, .lcf__plain, .lcf__legal a, .lcf__co-line[href] { transition: opacity .15s ease, color .15s ease; }
.lcf__links a { display: flex; align-items: center; min-height: 24px; font-size: 13px; font-weight: 600; line-height: 1.3; color: var(--ftr-link); text-wrap: pretty; }
.lcf__links a:hover, .lcf__plain:hover { color: var(--ftr-link); opacity: .68; }
.lcf__plain { display: inline-flex; align-items: center; gap: 7px; min-height: 24px; font-size: 13px; font-weight: 600; color: var(--ftr-link); }
.lcf__mail { overflow-wrap: anywhere; }
.lcf__mail svg, .lcf__phone svg { flex: none; opacity: .8; }
.lcf__phone { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; font-size: 19px; font-weight: 800; color: var(--ftr-ink); font-variant-numeric: tabular-nums; }
.lcf__phone:hover { color: var(--ftr-ink); }

/* 4 · Empresa + logos */
.lcf__co { padding-top: 22px; padding-bottom: 22px; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 22px 36px; }
.lcf__co-main { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.lcf__logo { display: inline-flex; align-self: flex-start; align-items: center; gap: 11px; }
.lcf__logo img { width: 42px; height: 42px; flex: none; border-radius: 9px; box-shadow: 0 2px 10px rgba(0, 0, 0, .18); }
.lcf__logo-txt { display: flex; flex-direction: column; line-height: 1.15; }
.lcf__logo-word { font-size: 17px; font-weight: 800; color: var(--ftr-ink); }
.lcf__logo-tag { font-size: 10px; font-weight: 700; letter-spacing: 3px; color: #F4731C; }
.lcf__co-info { display: flex; flex-wrap: wrap; gap: 10px 26px; }
.lcf__co-info > span { min-width: 0; }
.lcf__co-name { display: block; font-size: 12px; font-weight: 800; letter-spacing: .6px; color: var(--ftr-ink); }
.lcf__co-line { display: block; margin-top: 3px; font-size: 12.5px; color: var(--ftr-ink2); text-wrap: pretty; font-variant-numeric: tabular-nums; }
.lcf .lcf__co-line a:hover, .lcf .lcf__co-line[href]:hover { color: var(--ftr-ink); }
.lcf__br {
  align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; min-height: 30px; padding: 0 12px; border-radius: 7px;
  background: rgba(31, 168, 92, .16); box-shadow: inset 0 0 0 1px rgba(31, 168, 92, .42);
  font-size: 11.5px; font-weight: 800; letter-spacing: .7px; color: var(--ftr-br-ink);
}
.lcf__br img { width: 16px; height: 11px; border-radius: 2px; }
.lcf__co-side { flex: 2 1 420px; min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px 28px; }
.lcf__group--full { grid-column: 1 / -1; }
.lcf__lbl { font-size: 10.5px; font-weight: 800; letter-spacing: 1.6px; color: var(--ftr-lbl); }
.lcf__logos { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 8px; }
/* Bandeiras/Pix: os SVGs já são selos 48×32 com fundo próprio — só um contorno sutil para dar corpo */
.lcf__pay { display: block; width: 45px; height: 30px; border-radius: 5px; outline: 1px solid var(--ftr-chip-bd); outline-offset: -1px; }
/* Selos e transportadoras têm texto escuro: ficam num cartão branco em qualquer tom */
.lcf__tile {
  display: inline-flex; align-items: center; justify-content: center; min-height: 34px; padding: 0 12px; border-radius: 7px;
  background: #FFFFFF; box-shadow: inset 0 0 0 1px var(--ftr-chip-bd);
}
.lcf__tile img { display: block; height: 24px; width: auto; }
.lcf__tile img[src*="correios"], .lcf__tile img[src*="transportadora"] { height: 14px; }

/* 5 · Políticas */
.lcf__legal { padding-top: 12px; padding-bottom: 14px; display: flex; flex-wrap: wrap; justify-content: center; gap: 2px 20px; }
.lcf__legal a { display: inline-flex; align-items: center; min-height: 28px; font-size: 12.5px; font-weight: 700; color: var(--ftr-link); }
.lcf__legal a:hover { color: #F4731C; }

/* 6 · Termos, marcas, copyright */
.lcf__seo { padding-top: 16px; padding-bottom: 16px; }
.lcf__seo-row { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; }
.lcf__seo-row--az { gap: 6px; margin-top: 12px; }
.lcf .lcf__seo-t { margin-right: 4px; font-size: 13px; font-weight: 800; color: var(--ftr-ink); }
.lcf__chip, .lcf__letter {
  display: inline-flex; align-items: center; background: var(--ftr-chip-bg); box-shadow: inset 0 0 0 1px var(--ftr-chip-bd); color: var(--ftr-link);
  transition-property: opacity, background-color, color, box-shadow; transition-duration: .15s;
}
.lcf__chip { min-height: 26px; padding: 0 10px; border-radius: 999px; font-size: 12.5px; }
.lcf__chip:hover { color: var(--ftr-link); opacity: .7; }
.lcf__letter { justify-content: center; width: 26px; height: 26px; border-radius: 6px; font-size: 12px; font-weight: 700; }
.lcf__letter:hover { background: var(--lcf-accent); box-shadow: inset 0 0 0 1px var(--lcf-accent); color: #FFFFFF; }
.lcf__copy {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 18px; margin-top: 8px; padding-top: 10px;
  border-top: 1px solid var(--ftr-div); font-size: 11.5px; color: var(--ftr-ink2);
}
.lcf__copy strong { color: var(--ftr-ink); }

/* Televendas: "Todas as localidades" e o telefone sempre em linhas próprias */
.lcf__col--tel .lcf__plain, .lcf__col--tel .lcf__phone { display: flex; width: fit-content; }

/* Celular: o espaço da tab bar vira parte da última faixa (sem tira bege embaixo do rodapé) */
@media (max-width: 900px) {
  body.lc-has-tabbar:has(.lcf) { padding-bottom: 0 !important; }
  body.lc-has-tabbar .lcf__band--5 { padding-bottom: calc(var(--mo-tabbar-h, 64px) + var(--mo-fab-rise, 25px) + env(safe-area-inset-bottom)); }
}
@media (max-width: 720px) {
  .lcf__news-t { font-size: 17px; }
  .lcf__news-form { min-width: 100%; }
  .lcf__phone { font-size: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .lcf *, body .mo-hdr-main__cart, body .lcn__cta { transition: none !important; }
}

/* Mercado Pago na faixa de pagamentos: mesmo cartão branco dos selos, um pouco mais alto que as bandeiras */
.lcf__tile--mp { min-height: 30px; padding: 0 10px; }
.lcf__tile--mp img { height: 22px; }

/* Tons claros do header (azul-claro, branco): o lc-cta.css força o quadradinho dos ícones (Enviar para,
   Pedidos, Conta) em branco translúcido com !important — sobre o fundo claro ele sumia. Aqui, e não no
   geo.css, para valer mesmo com o "Enviar para" desligado. */
body.lc-hdr-light .mo-hdr-main__util-ic,
body.lc-hdr-light .mo-hdr-main__util:hover .mo-hdr-main__util-ic { background: var(--hdr-chip) !important; border-color: rgba(20, 32, 46, .14) !important; color: var(--hdr-ink) !important; }