/* Banner de consentimento LGPD (loja). Tokens --ss-* com fallback claro:
   escuro no SeuSaude, neutro nos demais tenants. */
.loja-consent {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: 12px;
    z-index: 9999;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    max-width: 1100px;
    margin: 0 auto;
    padding: 14px 18px;
    border-radius: 14px;
    background: var(--ss-surface, #ffffff);
    color: var(--ss-text, #1f2430);
    border: 1px solid var(--ss-borda, #e2e8f0);
    box-shadow: 0 16px 44px -14px rgba(0, 0, 0, 0.45);
    font-size: 13.5px;
    line-height: 1.45;
}
.loja-consent a { color: var(--ss-ciano, #2563eb); text-decoration: underline; }
/* 09/10/2026: a gaveta do carrinho (z-index 999) e a janela do produto ficavam por baixo do banner
   (9999) e o "Finalizar compra" sumia atrás dele em 1366x768. Com a gaveta aberta o banner se recolhe;
   volta ao fechar. */
body:has(#cart-sidebar.show) .loja-consent,
body:has(#modal-produto.show) .loja-consent { visibility: hidden; }
.lc-txt { flex: 1 1 320px; }
.lc-acoes { display: flex; gap: 10px; flex-shrink: 0; }
.lc-aceitar,
.lc-recusar {
    padding: 9px 18px;
    border-radius: 9px;
    font-weight: 700;
    font-size: 13px;
    cursor: pointer;
    border: 0;
}
.lc-aceitar { background: var(--ss-cta-grad, #7c3aed); color: #ffffff; }
.lc-aceitar:hover { filter: brightness(1.06); }
.lc-recusar { background: transparent; color: var(--ss-text-2, #4b5566); border: 1px solid var(--ss-borda, #d8dee9); }
.lc-recusar:hover { border-color: var(--ss-roxo, #7c3aed); color: var(--ss-text, #1f2430); }
@media (max-width: 560px) {
    .loja-consent { flex-direction: column; align-items: stretch; gap: 10px; }
    /* 17/09/2026: em coluna o eixo principal é a altura, e o flex-basis de 320px
       do texto virava 320px de ALTURA: o banner media 396px em 320x568 (70% da
       tela) e cobria o WhatsApp fixo. Medido com Playwright. */
    .lc-txt { flex-basis: auto; }
    .lc-acoes { justify-content: flex-end; }
}
/* Alvo de toque de 44px (WCAG 2.5.5) só onde o ponteiro é grosso. */
@media (any-pointer: coarse) {
    .lc-aceitar, .lc-recusar { min-height: 44px; }
}
/* "Saiba mais" com alvo de toque de 44 px sem abrir vão na frase (PESO, 04/10/2026).
   loja-mobilenav.css aplica `body .lc-txt a { display: inline-flex; min-height: 44px }` com
   ponteiro grosso: a caixa de 44 px entra na linha e afasta a última linha do parágrafo (medido
   em 390 px). Em linha, com recheio vertical, a área de toque continua com 44 px e a altura da
   linha não muda. O recheio é maior em cima (23 px) do que embaixo (7 px) porque embaixo vêm os
   botões, a 10 px do texto: com 15 px dos dois lados, os 5 px finais do link ficavam debaixo do
   botão e o toque ali não era do link. */
@media (pointer: coarse) {
    .loja-consent .lc-txt a { display: inline; min-height: 0; padding-block: 23px 7px; }
}