/*
 * Alomran Design Tokens — v7.5
 * ----------------------------------------------------------
 * Single source of truth for brand colour, surfaces, type,
 * radii, elevation and motion. Legacy selectors consume these
 * tokens; raw values are reserved for third-party brand colours.
 */

:root {
    /* Brand */
    --alomran-green: #1E4724;
    --alomran-green-dark: #173D23;
    --alomran-green-deep: #0F2F1C;
    --alomran-green-hover: #285B30;

    --alomran-gold: #D4AF37;
    --alomran-gold-light: #E8D08C;
    --alomran-gold-mid: #C4A35A;
    --alomran-gold-text: #8B6828; /* readable gold/brown on light surfaces */

    --alomran-dark: #3C2B1A;
    --alomran-brown: #5C3D11;
    --alomran-text: #3C2B1A;
    --alomran-text-muted: #6A5A3A;
    --alomran-text-soft: #7A6A49;
    --alomran-white: #FFFFFF;

    /* RGB channels + four opacity levels per family for consistent translucent treatments */
    --alomran-green-rgb: 30, 71, 36;
    --alomran-gold-rgb: 212, 175, 55;
    --alomran-gold-light-rgb: 232, 208, 140;
    --alomran-ink-rgb: 28, 20, 8;
    --alomran-alpha-subtle: 0.04;
    --alomran-alpha-soft: 0.10;
    --alomran-alpha-medium: 0.25;
    --alomran-alpha-strong: 0.65;
    --alomran-ink-alpha-subtle: 0.08;
    --alomran-ink-alpha-soft: 0.20;
    --alomran-ink-alpha-medium: 0.55;
    --alomran-ink-alpha-strong: 0.90;

    /* Surfaces: three primary levels + deliberate banner gradient */
    --alomran-surface: #FFF9ED;
    --alomran-surface-alt: #F5EDD8;
    --alomran-surface-warm: #EFE1C2;
    --alomran-sand: #E8D4A4;
    --alomran-map-sand-start: #E5D1A8;
    --alomran-map-sand-mid: #DCC294;
    --alomran-map-sand-end: #D2B47E;

    --alomran-border: #D4BF8A;
    --alomran-border-soft: #E3D2A2;


    /* Functional */
    --alomran-header-bg: rgba(232, 212, 164, 0.96);
    --alomran-hover-bg: rgba(212, 175, 55, 0.22);

    /* Typography */
    --alomran-fs-micro: 11px;
    --alomran-fs-xs: 12px;
    --alomran-fs-caption: 13px;
    --alomran-fs-sm: 14px;
    --alomran-fs-ui: 15px;
    --alomran-fs-body: 16px;
    --alomran-fs-body-md: 17px;
    --alomran-fs-body-lg: 18px;
    --alomran-fs-reading: 19px;
    --alomran-fs-h4: 20px;
    --alomran-fs-subtitle: 22px;
    --alomran-fs-h3: 24px;
    --alomran-fs-h2-mobile: 24px;
    --alomran-fs-h1-mobile: 28px;
    --alomran-fs-h2: 28px;
    --alomran-fs-h1: clamp(30px, 2.6vw, 36px);
    --alomran-fs-display: clamp(32px, 3vw, 44px);

    /* Icon/display-only sizing (kept separate from text hierarchy) */
    --alomran-icon-lg: 34px;
    --alomran-icon-xl: 38px;
    --alomran-icon-2xl: 40px;

    /* Radius */
    --alomran-radius-xs: 6px;
    --alomran-radius-sm: 8px;
    --alomran-radius-md: 12px;
    --alomran-radius-lg: 16px;
    --alomran-radius-xl: 18px;
    --alomran-radius-pill: 999px;

    /* Elevation — three standard levels; modal/control/focus are functional exceptions */
    --alomran-shadow-sm: 0 3px 10px rgba(44, 30, 5, 0.08);
    --alomran-shadow-md: 0 9px 24px rgba(44, 30, 5, 0.11);
    --alomran-shadow-lg: 0 16px 38px rgba(44, 30, 5, 0.14);
    --alomran-shadow-control: 0 8px 24px rgba(28, 20, 8, 0.20);
    --alomran-shadow-modal: 0 30px 80px rgba(0, 0, 0, 0.42);
    --alomran-focus-ring: 0 0 0 6px rgba(212, 175, 55, 0.42);


    /* Motion */
    --alomran-transition: 0.25s ease;
    --alomran-transition-smooth: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    --alomran-dropdown-ease: cubic-bezier(0.22, 1, 0.36, 1);
    --alomran-dropdown-duration: 0.56s;
}