/* Cookie banner presented as a centered modal with backdrop so it can't be ignored */
#cookie-banner {
    /* full-screen overlay */
    position: fixed;
    inset: 0; /* top:0; right:0; bottom:0; left:0; */
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45); /* dim the page */
    z-index: 99999;
    -webkit-tap-highlight-color: transparent;
}

/* The visible panel */
#cookie-banner .cookie-content {
    width: calc(100% - 64px);
    max-width: 820px;
    background: linear-gradient(180deg, rgba(50,74,99,0.98), rgba(30,40,55,0.98));
    color: #fff;
    padding: 20px 22px;
    border-radius: 14px;
    box-shadow: 0 18px 48px rgba(8, 10, 12, 0.5);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

#cookie-banner p { margin: 0; font-size: 15px; line-height: 1.4; color: rgba(255,255,255,0.96); flex:1; }

.cookie-actions { display: flex; gap: 12px; align-items: center; }

/* Buttons reuse site's btn classes; add small overrides for cookie banner */
#cookie-banner .btn { padding: 9px 14px; border-radius: 10px; font-size: 15px; }

@media (max-width: 720px) {
    #cookie-banner .cookie-content { flex-direction: column; align-items: stretch; padding: 16px; }
    .cookie-actions { justify-content: flex-end; margin-top: 8px; }
}

/* Override site-wide button entry animation so banner buttons are visible immediately */
#cookie-banner .btn {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
}

/* Ensure accessible focus outline */
#cookie-banner .btn:focus {
    outline: 3px solid rgba(216,156,90,0.25);
    outline-offset: 2px;
}

/* Make sure the overlay itself doesn't steal pointer events from the panel */
#cookie-banner .cookie-content { pointer-events: auto; }

/* Prevent clicks on the backdrop from interacting with the page beneath */
#cookie-banner { pointer-events: auto; }