/* Consent banner. Non-modal <dialog>, fixed to the bottom, out of document flow so it
   does not shift the page. Sits clear of the bottom-right feedback launcher. */

.consent {
    position: fixed;
    z-index: 24;
    inset: auto auto max(12px, env(safe-area-inset-bottom)) auto;
    left: max(12px, env(safe-area-inset-left));
    right: auto;
    margin: 0;
    width: min(34rem, calc(100vw - 8.5rem));
    max-width: calc(100vw - 8.5rem);
    max-height: min(40vh, 12rem);
    overflow: auto;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--card);
    color: var(--text);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
    font-family: Outfit, system-ui, sans-serif;
    opacity: 0;
    transform: translateY(8px);
    transition-property: opacity, transform, display;
    transition-duration: 0.18s;
    transition-timing-function: ease-out;
    transition-behavior: allow-discrete;
}
html.light .consent { box-shadow: 0 8px 24px rgba(15, 23, 42, 0.14); }
.consent[open] {
    opacity: 1;
    transform: none;
}
@media (prefers-reduced-motion: no-preference) {
    .consent[open] {
        @starting-style {
            opacity: 0;
            transform: translateY(8px);
        }
    }
}
@media (prefers-reduced-motion: reduce) {
    .consent {
        transform: none;
        transition: none;
    }
}

.consent-form { display: grid; gap: 8px; }
.consent-form p { margin: 0; font-size: 0.92rem; line-height: 1.45; max-width: 65ch; }
.consent-note { color: var(--muted); font-size: 0.82rem; }
html.light .consent-note { color: #475569; }
.consent-note a { color: inherit; text-underline-offset: 3px; }
.consent-note a:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; border-radius: 3px; }
.consent-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.consent-actions button {
    flex: 1 1 0;
    min-width: 0;
    min-height: 44px;
    padding: 8px 12px;
    border-radius: 10px;
    border: 1px solid color-mix(in srgb, var(--text) 32%, transparent);
    background: transparent;
    color: var(--text);
    font: 600 0.9rem/1.2 Outfit, system-ui, sans-serif;
    cursor: pointer;
}
.consent-actions button:hover { background: color-mix(in srgb, var(--text) 6%, transparent); }
.consent-actions button:focus-visible { outline: 3px solid var(--text); outline-offset: 2px; }

.site-footer .consent-settings {
    background: none;
    border: 0;
    padding: 0;
    color: var(--text);
    font: 600 0.95rem/1.4 Outfit, system-ui, sans-serif;
    cursor: pointer;
    text-decoration: none;
}
.site-footer .consent-settings:hover { text-decoration: underline; }
.site-footer .consent-settings:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; border-radius: 3px; }

@media (max-width: 600px) {
    .consent {
        width: min(34rem, calc(100vw - 5.75rem));
        max-width: calc(100vw - 5.75rem);
        padding: 10px 12px;
    }
    .consent-form p { font-size: 0.88rem; }
}