﻿/* ============================================
   FLUID SCALING SYSTEM
   ============================================ */

:root {
    /* Fluid Type Scale using clamp() */
    --text-xs-fluid: clamp(0.7rem, 0.65rem + 0.25vw, 0.75rem);
    --text-sm-fluid: clamp(0.8rem, 0.75rem + 0.25vw, 0.875rem);
    --text-base-fluid: clamp(0.9rem, 0.85rem + 0.25vw, 1rem);
    --text-lg-fluid: clamp(1.1rem, 1rem + 0.5vw, 1.25rem);
    --text-xl-fluid: clamp(1.3rem, 1.2rem + 0.5vw, 1.5rem);
    --text-2xl-fluid: clamp(1.5rem, 1.4rem + 0.75vw, 1.875rem);
    --text-3xl-fluid: clamp(1.8rem, 1.6rem + 1vw, 2.25rem);
    --text-4xl-fluid: clamp(2.2rem, 2rem + 1.5vw, 3rem);
    /* Fluid Spacing Scale */
    --space-1-fluid: clamp(0.2rem, 0.18rem + 0.1vw, 0.25rem);
    --space-2-fluid: clamp(0.4rem, 0.35rem + 0.25vw, 0.5rem);
    --space-3-fluid: clamp(0.6rem, 0.55rem + 0.25vw, 0.75rem);
    --space-4-fluid: clamp(0.85rem, 0.8rem + 0.25vw, 1rem);
    --space-5-fluid: clamp(1.2rem, 1.1rem + 0.5vw, 1.5rem);
    --space-6-fluid: clamp(1.6rem, 1.5rem + 0.75vw, 2rem);
    --space-8-fluid: clamp(2.4rem, 2.2rem + 1vw, 3rem);
    /* Fluid Layout Heights */
    --height-header-fluid: clamp(3.5rem, 3.25rem + 1.25vw, 3.75rem);
    --height-toolbar-fluid: clamp(2.75rem, 2.5rem + 1.25vw, 3rem);
}

/* Responsive Root Font Size */
html {
    /* Fluid root size: 14px mobile → 16px desktop */
    font-size: clamp(0.875rem, 0.8rem + 0.5vw, 1rem);
}

/* Accessibility: Respect user preferences */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* High contrast mode adjustments */
@media (prefers-contrast: high) {
    :root {
        --radius-sm: 0;
        --radius-md: 0;
        --radius-lg: 0;
    }
}
