/**
 * Glassmorphism System — Base
 *
 * Variables, @supports fallback, accessibility media queries.
 */

/* ==========================================================================
   Base Variables
   ========================================================================== */

:root {
    /* The mobile cap, read by every preset through min(). Not a blur VALUE:
       a value would raise glass-fx-subtle, which blurs at 6px. */
    --glass-fx-blur-max: 999px;
}

/* ==========================================================================
   @supports Fallback — solid background when unsupported

   The three fallbacks below (here, reduced-transparency, print) keep the
   `background` SHORTHAND on purpose, where presets.css paints its washes as
   background-image. A fallback must replace the wash with an opaque surface,
   and the shorthand resets background-image to none; background-color alone
   would leave the wash painted on top of it. See the note in presets.css.
   ========================================================================== */

@supports not (backdrop-filter: blur(1px)) {
    [class*="glass-fx-"] {
        background: var(--color-base-200) !important;
    }
}

/* ==========================================================================
   Accessibility — prefers-reduced-transparency
   ========================================================================== */

@media (prefers-reduced-transparency: reduce) {
    [class*="glass-fx-"] {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: var(--color-base-200) !important;
    }
}

/* ==========================================================================
   Mobile — reduce blur for performance
   ========================================================================== */

@media (max-width: 767px) {
    [class*="glass-fx-"] {
        --glass-fx-blur-max: 8px;
    }
}

/* ==========================================================================
   Print — disable glass effects
   ========================================================================== */

@media print {
    [class*="glass-fx-"] {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: var(--color-base-100) !important;
    }
}
