/* ==========================================================================
   Age Verification Gate — frontend.css  v1.3.1
   Theme: Catppuccin Mocha
   ========================================================================== */

/* ── Utility ──────────────────────────────────────────────────────────── */
.avg-hidden { display: none !important; }

/* ── Overlay (popup backdrop) ─────────────────────────────────────────── */
#avg-overlay {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.avg-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(17, 17, 27, 0.92);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* ── Modal card ───────────────────────────────────────────────────────── */
.avg-modal {
    position: relative;
    background: #1e1e2e;
    border: 1px solid #313244;
    border-radius: 18px;
    padding: 2.75rem 2.25rem 2rem;
    max-width: 500px;
    width: 100%;
    text-align: center;
    box-shadow:
        0 0 0 1px rgba(205, 214, 244, 0.06),
        0 24px 80px rgba(0, 0, 0, 0.65);
    animation: avg-pop-in 0.35s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

@keyframes avg-pop-in {
    from { transform: scale(0.82) translateY(12px); opacity: 0; }
    to   { transform: scale(1)    translateY(0);    opacity: 1; }
}

/* ── Logo ─────────────────────────────────────────────────────────────── */
.avg-logo {
    margin-bottom: 1.25rem;
}
.avg-logo img {
    max-height: 56px;
    max-width: 100%;
    object-fit: contain;
}

/* ── Main icon ────────────────────────────────────────────────────────── */
.avg-icon {
    font-size: 3rem;
    line-height: 1;
    margin-bottom: 1rem;
    display: block;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, .4));
}

/* ── Title ────────────────────────────────────────────────────────────── */
.avg-title {
    font-size: 1.55rem !important;
    font-weight: 700 !important;
    color: #cdd6f4 !important;
    margin: 0 0 .85rem !important;
    line-height: 1.3 !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

/* ── Body message ─────────────────────────────────────────────────────── */
.avg-message {
    font-size: .95rem !important;
    color: #a6adc8 !important;
    line-height: 1.65 !important;
    margin: 0 0 1.75rem !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}
.avg-message strong { color: #cdd6f4; }

/* ── Buttons ──────────────────────────────────────────────────────────── */
.avg-buttons {
    display: flex;
    flex-direction: column;
    gap: .75rem;
    margin-bottom: 1.25rem;
}

.avg-btn {
    display: block;
    width: 100%;
    padding: .8rem 1.5rem;
    border: none;
    border-radius: 10px;
    font-size: 1rem;
    font-weight: 600;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
    letter-spacing: .01em;
    transition: transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
    box-sizing: border-box;
}

.avg-btn:hover  { transform: translateY(-2px); }
.avg-btn:active { transform: translateY(0); }

/* Confirm — Catppuccin Green */
.avg-btn-confirm {
    background: #a6e3a1;
    color: #1e1e2e;
    box-shadow: 0 4px 18px rgba(166, 227, 161, .25);
}
.avg-btn-confirm:hover {
    background: #94d48f;
    box-shadow: 0 6px 24px rgba(166, 227, 161, .35);
}

/* Decline — subtle dark */
.avg-btn-decline {
    background: #313244;
    color: #a6adc8;
    border: 1px solid #45475a;
}
.avg-btn-decline:hover {
    background: #45475a;
    color: #cdd6f4;
}

/* ── Legal footnote ───────────────────────────────────────────────────── */
.avg-legal {
    font-size: .76rem !important;
    color: #585b70 !important;
    margin: 0 !important;
    line-height: 1.5 !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

/* ==========================================================================
   Denied / Blocked full-screen
   ========================================================================== */

#avg-denied {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #11111b;
    padding: 2rem;
    text-align: center;
    animation: avg-fade-in .4s ease both;
}

@keyframes avg-fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.avg-denied-inner {
    max-width: 500px;
    width: 100%;
}

/* Blocked icon with subtle pulse */
.avg-denied-icon {
    font-size: 5rem;
    display: block;
    margin-bottom: 1.5rem;
    filter: drop-shadow(0 0 24px rgba(243, 139, 168, .4));
    animation: avg-pulse 2.8s ease-in-out infinite;
}

@keyframes avg-pulse {
    0%, 100% { transform: scale(1); }
    50%       { transform: scale(1.06); }
}

/* Denied title */
#avg-denied h2 {
    font-size: 2rem !important;
    font-weight: 700 !important;
    color: #f38ba8 !important;
    margin: 0 0 .9rem !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

/* Denied body */
#avg-denied p {
    font-size: 1.05rem !important;
    color: #a6adc8 !important;
    line-height: 1.65 !important;
    margin: 0 0 2rem !important;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}
#avg-denied p strong { color: #cdd6f4; }

/* ── Denied action buttons container ─────────────────────────────────── */
.avg-denied-actions {
    display: flex;
    flex-direction: column;
    gap: .85rem;
    max-width: 340px;
    margin: 0 auto;
}

/* Re-verify button — Catppuccin Sapphire/Blue accent */
.avg-btn-reverify {
    background: #89b4fa;
    color: #1e1e2e;
    box-shadow: 0 4px 18px rgba(137, 180, 250, .25);
}
.avg-btn-reverify:hover {
    background: #74aaef;
    box-shadow: 0 6px 24px rgba(137, 180, 250, .35);
    color: #1e1e2e;
}

/* Leave this page link styled as button */
.avg-btn-redirect {
    background: #313244;
    color: #a6adc8 !important;
    border: 1px solid #45475a;
}
.avg-btn-redirect:hover {
    background: #45475a;
    color: #cdd6f4 !important;
}

/* ── Mobile ───────────────────────────────────────────────────────────── */
@media (max-width: 440px) {
    .avg-modal {
        padding: 2rem 1.25rem 1.5rem;
        border-radius: 14px;
    }

    .avg-title {
        font-size: 1.3rem !important;
    }

    #avg-denied h2 {
        font-size: 1.5rem !important;
    }

    .avg-denied-icon {
        font-size: 3.5rem;
    }
}

/* ==========================================================================
   Language Switcher  (inline SVG flags — v1.3.1)
   ========================================================================== */

/* ── Switcher container ───────────────────────────────────────────────── */
.avg-lang-switcher {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
    margin-bottom: 1.1rem;
}

/* ── Individual flag button ───────────────────────────────────────────── */
.avg-lang-btn {
    /* Reset all button defaults */
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    border: 2px solid transparent;
    padding: .2rem;
    margin: 0;
    cursor: pointer;
    border-radius: 50%;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition:
        border-color .18s ease,
        transform    .18s ease,
        box-shadow   .18s ease,
        background   .18s ease;
    /* Override any theme's .avg-btn sizing — these are icon-only */
    width: auto !important;
    min-width: 0 !important;
    font-size: inherit;
    font-weight: normal;
    letter-spacing: 0;
}

.avg-flag {
    line-height: 1;
    display: block;
    width: 28px;
    height: 20px;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 0 0 1px rgba(205, 214, 244, .18);
    /* Subtle grayscale on inactive flags */
    filter: grayscale(55%) opacity(.7);
    transition: filter .18s ease, transform .18s ease, box-shadow .18s ease;
}

.avg-flag-svg {
    display: block;
    width: 28px;
    height: 20px;
}

.avg-lang-btn.avg-lang-active .avg-flag,
.avg-lang-btn:hover .avg-flag {
    box-shadow: 0 0 0 1px rgba(205, 214, 244, .35);
}

/* ── Hover state ─────────────────────────────────────────────────────── */
.avg-lang-btn:hover .avg-flag {
    filter: grayscale(0%) opacity(1);
    transform: scale(1.18);
}

.avg-lang-btn:hover {
    background: rgba(205, 214, 244, .07);
    transform: none; /* prevent double-scale with .avg-btn:hover */
}

/* ── Active / selected flag ──────────────────────────────────────────── */
.avg-lang-btn.avg-lang-active {
    border-color: #89b4fa;
    background: rgba(137, 180, 250, .12);
    box-shadow: 0 0 0 3px rgba(137, 180, 250, .18);
}

.avg-lang-btn.avg-lang-active .avg-flag {
    filter: grayscale(0%) opacity(1);
}

.avg-lang-btn.avg-lang-active:hover {
    transform: none;
}

/* ── Focus ring (keyboard nav) ───────────────────────────────────────── */
.avg-lang-btn:focus-visible {
    outline: 2px solid #89b4fa;
    outline-offset: 3px;
}

/* ── Denied screen: switcher sits on top center ──────────────────────── */
#avg-denied .avg-lang-switcher {
    margin-bottom: 1.5rem;
}

/* ── Prevent the generic .avg-btn rule from stretching flag buttons ──── */
#avg-overlay .avg-lang-btn,
#avg-denied  .avg-lang-btn {
    width: auto !important;
    display: inline-flex !important;
    padding: .2rem !important;
    font-size: inherit !important;
    box-shadow: none;
}

#avg-overlay .avg-lang-btn.avg-lang-active,
#avg-denied  .avg-lang-btn.avg-lang-active {
    box-shadow: 0 0 0 3px rgba(137, 180, 250, .18) !important;
}

/* ── Mobile tweak ────────────────────────────────────────────────────── */
@media (max-width: 440px) {
    .avg-flag,
    .avg-flag-svg {
        width: 25px;
        height: 18px;
    }
}