/*
 * EW-Flow cookie banner styles.
 * Minimal, dependency-free, dark-mode friendly.
 */
.ew-cookie-banner {
    position: fixed;
    bottom: 16px;
    left: 16px;
    right: 16px;
    max-width: 640px;
    margin: 0 auto;
    background: #ffffff;
    color: #1a1a1a;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
    padding: 20px 24px;
    z-index: 2147483000;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.5;
}

.ew-cookie-banner a { color: #1d4ed8; }

@media (prefers-color-scheme: dark) {
    .ew-cookie-banner {
        background: #1f2330;
        color: #f1f5f9;
        border-color: rgba(255, 255, 255, 0.12);
    }
    .ew-cookie-banner a { color: #93c5fd; }
}

.ew-cc-title {
    margin: 0 0 8px 0;
    font-size: 16px;
    /* Medium: a 600 here made the website load its GT America Bold file just for this title, on the critical path. */
    font-weight: 500;
}

.ew-cc-body {
    margin: 0 0 16px 0;
}

.ew-cc-categories {
    margin: 12px 0 16px 0;
    padding: 12px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.02);
}

@media (prefers-color-scheme: dark) {
    .ew-cc-categories {
        border-color: rgba(255, 255, 255, 0.08);
        background: rgba(255, 255, 255, 0.02);
    }
}

.ew-cc-cat {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 6px 12px;
    margin-bottom: 12px;
    align-items: start;
}
.ew-cc-cat:last-child { margin-bottom: 0; }
.ew-cc-cat strong { font-size: 14px; }
.ew-cc-cat .ew-cc-desc {
    grid-column: 2;
    color: rgba(0, 0, 0, 0.6);
    font-size: 12px;
}
@media (prefers-color-scheme: dark) {
    .ew-cc-cat .ew-cc-desc { color: rgba(255, 255, 255, 0.65); }
}

.ew-cc-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ew-cc-btn {
    flex: 1 1 auto;
    min-width: 140px;
    padding: 10px 16px;
    border-radius: 8px;
    border: 1px solid transparent;
    font-weight: 500;   /* Medium, as the title: no Bold file for the banner */
    font-size: 14px;
    cursor: pointer;
    background: #f3f4f6;
    color: #1a1a1a;
    transition: background-color 120ms ease, transform 120ms ease;
}
.ew-cc-btn:hover { background: #e5e7eb; }

/* Equal prominence — Accept and Reject share visual weight per Garante 2021 guidelines. */
.ew-cc-btn-accept,
.ew-cc-btn-reject {
    background: #1f2937;
    color: #ffffff;
    border-color: #1f2937;
}
.ew-cc-btn-accept:hover,
.ew-cc-btn-reject:hover {
    background: #111827;
    border-color: #111827;
}

.ew-cc-btn-customise,
.ew-cc-btn-save {
    background: transparent;
    color: inherit;
    border-color: rgba(0, 0, 0, 0.2);
}
@media (prefers-color-scheme: dark) {
    .ew-cc-btn { background: #374151; color: #f9fafb; }
    .ew-cc-btn:hover { background: #4b5563; }
    .ew-cc-btn-accept,
    .ew-cc-btn-reject { background: #f9fafb; color: #111827; border-color: #f9fafb; }
    .ew-cc-btn-accept:hover,
    .ew-cc-btn-reject:hover { background: #e5e7eb; border-color: #e5e7eb; }
    .ew-cc-btn-customise,
    .ew-cc-btn-save { border-color: rgba(255, 255, 255, 0.25); }
}

@media (max-width: 540px) {
    .ew-cookie-banner { left: 8px; right: 8px; bottom: 8px; padding: 16px; }
    .ew-cc-btn { min-width: 0; flex-basis: 100%; }
}

/* Campaign landing pages (_LandingLayout) on a phone: a compact banner at the top, so the hero's primary button and the
   request form below it stay uncovered until the visitor chooses. The three choices keep the same look (one row). */
@media (max-width: 540px) {
    body:has(.ews-landing) .ew-cookie-banner { top: 8px; bottom: auto; padding: 12px 14px; font-size: 12px; line-height: 1.4; }
    body:has(.ews-landing) .ew-cc-title { margin-bottom: 4px; font-size: 14px; }
    body:has(.ews-landing) .ew-cc-body { margin-bottom: 10px; }
    body:has(.ews-landing) .ew-cc-btn { flex: 1 1 0; padding: 8px 4px; font-size: 13px; }
}
