/**
 * Tôrres ENM CP — banner de consentimento.
 *
 * O banner é construído no cliente; este ficheiro é estático e igual
 * para todos os visitantes, por isso é cacheável pelo browser e pela
 * CDN sem qualquer variação.
 */

/* O contentor impresso pelo servidor é apenas um ponto de ancoragem e
   não deve ocupar espaço nem criar contexto de empilhamento. */
#torres-consent-root {
    display: contents;
}

/* [hidden] tem de vencer o display:flex abaixo — sem isto o atributo
   não esconde nada e o banner ficaria sempre visível. */
.torres-consent[hidden] {
    display: none !important;
}

.torres-consent {
    position: fixed;
    z-index: 999999;
    box-sizing: border-box;
    width: min(calc(100vw - 32px), var(--torres-consent-max, 520px));
    display: flex;
    align-items: center;
    gap: clamp(16px, 2.2vw, 24px);
    padding: clamp(18px, 2.2vw, 24px);
    border: 1px solid color-mix(in srgb, var(--torres-consent-text) 12%, transparent);
    border-radius: var(--torres-consent-radius);
    background: var(--torres-consent-bg);
    color: var(--torres-consent-text);
    font-size: 13px;
    line-height: 1.55;
    box-shadow:
        0 1px 2px rgba(16, 28, 58, .06),
        0 12px 28px -8px rgba(16, 28, 58, .18),
        0 32px 64px -24px rgba(16, 28, 58, .28);
}

.torres-consent *,
.torres-consent *::before,
.torres-consent *::after {
    box-sizing: inherit;
}

/* Entrada suave; sem movimento para quem o pediu. */
@keyframes torres-consent-in {
    from { opacity: 0; transform: translate3d(0, 12px, 0) scale(.985); }
    to   { opacity: 1; transform: none; }
}

.torres-consent {
    animation: torres-consent-in .34s cubic-bezier(.16, .84, .44, 1) both;
}

@media (prefers-reduced-motion: reduce) {
    .torres-consent { animation-duration: .01ms; }
}

/* Posições. As variantes centradas usam margin auto em vez de
   translate, para não colidirem com o transform da animação. */
.torres-consent.is-top-left     { left: 20px;  top: 20px; }
.torres-consent.is-top-right    { right: 20px; top: 20px; }
.torres-consent.is-bottom-left  { left: 20px;  bottom: 20px; }
.torres-consent.is-bottom-right { right: 20px; bottom: 20px; }
.torres-consent.is-top-center    { top: 20px;    left: 0; right: 0; margin-inline: auto; }
.torres-consent.is-bottom-center { bottom: 20px; left: 0; right: 0; margin-inline: auto; }
.torres-consent.is-center {
    top: 0; bottom: 0; left: 0; right: 0;
    margin: auto;
    height: max-content;
}

/* Larguras. */
.torres-consent.is-width-compact  { --torres-consent-max: 380px; }
.torres-consent.is-width-standard { --torres-consent-max: 520px; }
.torres-consent.is-width-wide     { --torres-consent-max: 760px; }
.torres-consent.is-width-full {
    --torres-consent-max: none;
    left: 20px; right: 20px;
    width: auto;
    margin-inline: 0;
}

/* Layouts. */
.torres-consent.is-bar {
    left: 0; right: 0; bottom: 0; top: auto;
    width: auto;
    --torres-consent-max: none;
    margin-inline: 0;
    border-radius: 0;
    border-inline: 0;
    border-bottom: 0;
    padding: 18px max(20px, calc((100vw - 1200px) / 2));
    gap: 28px;
    box-shadow: 0 -8px 32px -12px rgba(16, 28, 58, .24);
}

.torres-consent.is-bar.is-top-left,
.torres-consent.is-bar.is-top-center,
.torres-consent.is-bar.is-top-right {
    top: 0; bottom: auto;
    border-top: 0;
    border-bottom: 1px solid color-mix(in srgb, var(--torres-consent-text) 12%, transparent);
}

.torres-consent.is-bar.is-center { top: auto; bottom: 0; margin: 0; }
.torres-consent.is-bar .torres-consent__content { flex: 1 1 auto; }

.torres-consent.is-compact { display: block; padding: 16px 18px; }
.torres-consent.is-compact .torres-consent__actions { margin-top: 14px; }

.torres-consent.is-modal {
    display: block;
    --torres-consent-max: 600px;
    padding: clamp(24px, 3vw, 32px);
}
.torres-consent.is-modal .torres-consent__actions { margin-top: 20px; }

/* Temas. */
.torres-consent.is-dark {
    --torres-consent-bg: #0f172a;
    --torres-consent-text: #eef2fb;
    border-color: rgba(255, 255, 255, .12);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 20px 48px -16px rgba(0, 0, 0, .6);
}

.torres-consent.is-glass {
    background: color-mix(in srgb, var(--torres-consent-bg) 78%, transparent);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    backdrop-filter: blur(20px) saturate(180%);
    border-color: color-mix(in srgb, var(--torres-consent-text) 16%, transparent);
}

.torres-consent.is-shadow-none { box-shadow: none; }
.torres-consent.is-shadow-strong {
    box-shadow:
        0 2px 4px rgba(16, 28, 58, .1),
        0 24px 56px -12px rgba(16, 28, 58, .36),
        0 48px 96px -32px rgba(16, 28, 58, .44);
}

/* Fundo escurecido: overlay real, não um box-shadow de 100vmax — pode
   animar e não interfere com o layout do cartão. */
.torres-consent.is-backdrop::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background: rgba(11, 19, 38, .55);
    animation: torres-consent-fade .34s ease both;
}

@keyframes torres-consent-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .torres-consent.is-backdrop::before { animation-duration: .01ms; }
}

/* Conteúdo. */
.torres-consent__content { min-width: 0; }

.torres-consent__title {
    display: block;
    margin: 0 0 4px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -.01em;
    line-height: 1.3;
}

.torres-consent p {
    margin: 0;
    color: inherit;
    opacity: .72;
    font-size: 13px;
    line-height: 1.55;
}

.torres-consent__link {
    display: inline-block;
    margin-top: 6px;
    font-size: 12px;
    font-weight: 600;
    color: var(--torres-consent-accent);
    text-underline-offset: 2px;
}

/* Preferências. */
.torres-consent__preferences {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 14px 0 0;
    padding-top: 14px;
    border-top: 1px solid color-mix(in srgb, var(--torres-consent-text) 10%, transparent);
}

.torres-consent__preferences[hidden] { display: none; }

.torres-consent__preferences label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 11px;
    border: 1px solid color-mix(in srgb, var(--torres-consent-text) 14%, transparent);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: border-color .16s, background-color .16s;
}

.torres-consent__preferences label:hover {
    border-color: color-mix(in srgb, var(--torres-consent-accent) 50%, transparent);
}

.torres-consent__preferences input {
    accent-color: var(--torres-consent-accent);
    margin: 0;
    width: 15px;
    height: 15px;
}

.torres-consent__preferences input:disabled { opacity: .55; }

/* Acções. */
.torres-consent__actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    flex: 0 0 auto;
}

.torres-consent button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    border: 1px solid color-mix(in srgb, var(--torres-consent-text) 18%, transparent);
    border-radius: 10px;
    padding: 0 15px;
    background: transparent;
    color: inherit;
    font: inherit;
    font-weight: 600;
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
    white-space: nowrap;
    transition: background-color .16s, border-color .16s, transform .16s, box-shadow .16s;
}

.torres-consent button[hidden] { display: none; }

.torres-consent button:hover {
    background: color-mix(in srgb, var(--torres-consent-text) 6%, transparent);
    border-color: color-mix(in srgb, var(--torres-consent-text) 30%, transparent);
}

.torres-consent button:active { transform: translateY(1px); }

.torres-consent button.is-primary,
.torres-consent button.is-save {
    border-color: transparent;
    background: var(--torres-consent-accent);
    color: #fff;
    box-shadow:
        0 1px 2px rgba(16, 28, 58, .12),
        0 6px 16px -6px color-mix(in srgb, var(--torres-consent-accent) 70%, transparent);
}

.torres-consent button.is-primary:hover,
.torres-consent button.is-save:hover {
    background: color-mix(in srgb, var(--torres-consent-accent) 88%, #000);
}

.torres-consent.is-buttons-outline button.is-primary,
.torres-consent.is-buttons-outline button.is-save {
    background: transparent;
    color: var(--torres-consent-accent);
    border-color: var(--torres-consent-accent);
    box-shadow: none;
}

.torres-consent.is-buttons-outline button.is-primary:hover,
.torres-consent.is-buttons-outline button.is-save:hover {
    background: color-mix(in srgb, var(--torres-consent-accent) 10%, transparent);
}

.torres-consent.is-buttons-pill button { border-radius: 999px; padding: 0 18px; }

/* Foco visível — necessário para teclado, e é o detalhe que faz o
   banner parecer acabado. */
.torres-consent button:focus-visible,
.torres-consent a:focus-visible,
.torres-consent input:focus-visible {
    outline: 2px solid var(--torres-consent-accent);
    outline-offset: 2px;
    border-radius: 8px;
}

/* Botão de reabertura (shortcode [torres_consent_preferences]). */
.torres-consent-reopen {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    padding: 0 14px;
    border: 1px solid currentColor;
    border-radius: 999px;
    background: transparent;
    color: inherit;
    font: inherit;
    font-size: 13px;
    cursor: pointer;
    opacity: .8;
}

.torres-consent-reopen:hover { opacity: 1; }

/* Mobile: empilha sempre, botões a toda a largura. */
@media (max-width: 640px) {
    .torres-consent {
        display: block;
        left: 12px; right: 12px; bottom: 12px; top: auto;
        width: auto;
        --torres-consent-max: none;
        margin-inline: 0;
        padding: 18px;
    }

    .torres-consent.is-center,
    .torres-consent.is-top-left,
    .torres-consent.is-top-center,
    .torres-consent.is-top-right {
        top: auto; bottom: 12px; margin: 0;
    }

    .torres-consent.is-bar {
        left: 0; right: 0; bottom: 0;
        padding: 16px 18px;
        border-radius: 0;
    }

    .torres-consent.is-bar.is-top-left,
    .torres-consent.is-bar.is-top-center,
    .torres-consent.is-bar.is-top-right {
        top: 0; bottom: auto;
    }

    .torres-consent__actions { margin-top: 16px; }
    .torres-consent__actions button { flex: 1 1 auto; }
}

/* P12 — composição legível de escolhas e ações em cartões estreitos.
   Mantém o mesmo CSS estático, logo não cria variação por visitante nem
   reduz a cacheabilidade de página ou CDN. */
.torres-consent:not(.is-bar) .torres-consent__content { flex: 1 1 260px; }
.torres-consent.is-card .torres-consent__actions { display: grid; flex: 0 1 185px; grid-template-columns: 1fr; }
.torres-consent.is-card .torres-consent__actions button { width: 100%; }
.torres-consent__preferences label { display: flex; align-items: flex-start; border-radius: 10px; }
.torres-consent__preference-copy { display: grid; gap: 2px; }
.torres-consent__preference-copy strong { font-size: 12px; }
.torres-consent__preference-copy small { color: inherit; font-size: 11px; font-weight: 400; line-height: 1.35; opacity: .72; }
.torres-consent button.is-close { font-size: 12px; opacity: .78; }

@media (max-width: 640px) {
    .torres-consent.is-card .torres-consent__actions { display: grid; }
}