/*
 * Fallen Kingdom — Popup Surface Policy
 *
 * Permanent UI rule:
 * - popup/modal/card itself must always be 100% opaque;
 * - only the backdrop BEHIND a popup may be translucent / blurred.
 *
 * Loaded after theme/layout CSS so legacy rgba/gradient popup backgrounds
 * cannot leak the page through the popup surface.
 */

/* ==========================================================================
   MODERN UI / PARCHMENT + FUTURE MODERN THEMES
   ========================================================================== */

html body.fk-modern-ui:not(.landing-page) {
    /* --ui-row-bg is a solid content surface in the Modern theme system. */
    --fk-popup-solid-bg: var(--ui-row-bg, #f3ebce);
    --fk-popup-solid-alt-bg: var(--ui-card-bg-alt, #e7dab4);
}

/* Main popup/modal surfaces. */
html body.fk-modern-ui:not(.landing-page) .fk-message-modal,
html body.fk-modern-ui:not(.landing-page) .fk-kingdom-message-modal,
html body.fk-modern-ui:not(.landing-page) .fk-modal-card,
html body.fk-modern-ui:not(.landing-page) .kd-result-modal {
    background: var(--fk-popup-solid-bg) !important;
    background-color: var(--fk-popup-solid-bg) !important;
    background-image: none !important;
    opacity: 1 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    color: var(--ui-text) !important;
    isolation: isolate !important;
}

/* Raid + Dungeon result popup.
   Both pages use the same .kd-result-* component classes. */
html body.fk-modern-ui:not(.landing-page) .kd-result-modal h2,
html body.fk-modern-ui:not(.landing-page) .kd-result-modal h3,
html body.fk-modern-ui:not(.landing-page) .kd-result-modal strong,
html body.fk-modern-ui:not(.landing-page) .kd-result-modal li {
    color: var(--ui-text) !important;
    text-shadow: none !important;
}

html body.fk-modern-ui:not(.landing-page) .kd-result-grid > div,
html body.fk-modern-ui:not(.landing-page) .kd-result-rewards {
    background: var(--fk-popup-solid-alt-bg) !important;
    background-color: var(--fk-popup-solid-alt-bg) !important;
    background-image: none !important;
    opacity: 1 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-color: var(--ui-row-border) !important;
    box-shadow: none !important;
}

html body.fk-modern-ui:not(.landing-page) .kd-result-grid span,
html body.fk-modern-ui:not(.landing-page) .kd-result-cooldown {
    color: var(--ui-muted) !important;
    opacity: 1 !important;
}

/* Generic FK popup inner panels must not be translucent either. */
html body.fk-modern-ui:not(.landing-page) .fk-modal-summary,
html body.fk-modern-ui:not(.landing-page) .fk-kingdom-message-content {
    background: var(--fk-popup-solid-alt-bg) !important;
    background-color: var(--fk-popup-solid-alt-bg) !important;
    background-image: none !important;
    opacity: 1 !important;
    border-color: var(--ui-row-border) !important;
    color: var(--ui-text) !important;
}

/* Creature XP popup uses .fk-modal-card as its outer surface; keep its
   detailed cards solid too. */
html body.fk-modern-ui:not(.landing-page)
.fk-creature-xp-modal-grid > div {
    background: var(--fk-popup-solid-alt-bg) !important;
    background-color: var(--fk-popup-solid-alt-bg) !important;
    background-image: none !important;
    opacity: 1 !important;
}

/* Keep close/buttons readable on the now-light solid popup. */
html body.fk-modern-ui:not(.landing-page) .fk-modal-close,
html body.fk-modern-ui:not(.landing-page) .fk-kingdom-message-close,
html body.fk-modern-ui:not(.landing-page) .kd-result-close {
    background: var(--ui-button-bg) !important;
    background-image: none !important;
    color: var(--ui-button-text) !important;
    border-color: var(--ui-button-border) !important;
    opacity: 1 !important;
}

/* IMPORTANT:
   Backdrops are intentionally NOT made opaque here.
   Their job is to dim/blur the page behind the solid popup. */