/* ============================================================================
   XMED Cloud — Ubuntu/Yaru theme: DESIGN TOKENS (the frozen contract)
   Values verified against libadwaita-1-5 + ubuntu/yaru + gnome-shell 46
   (Ubuntu 24.04 LTS). Light = body.yaru, dark = body.yaru.yaru-dark.
   RULE: no file other than this one may contain a literal color hex.
   ========================================================================== */

body.yaru {
    /* ---- surfaces (light) ---- */
    /* OWNER 2026-08-11: "the white color is too bright ... a little, little bit
       of gray". Pure #ffffff is gone from the light surfaces.

       MEASURED CORRECTION to the caution first written here: darkening these
       does NOT eat the contrast headroom, because --yaru-fg / --yaru-fg-dim are
       ALPHA blacks, not fixed inks — they composite over whatever ground is
       under them and darken WITH it. The tightest pair in the app (fg-dim at
       55% black) measures 4.72:1 on #fbfbfa and still 4.59:1 on a ground as
       grey as #efefec. Body text (80% black) never drops below 11.5:1. So the
       limit on these values is TASTE, not legibility — but re-measure if
       fg-dim is ever changed to a solid colour, which would break that
       property immediately. */
    --yaru-bg-window:        #f4f4f2;   /* window/dialog chrome ground        */
    --yaru-bg-view:          #fbfbfa;   /* content: grids, panels, popup body */
    --yaru-bg-headerbar:     #fbfbfa;   /* titlebars, grid headers, tab strip */

    /* A softer pair for surfaces the owner wants calmer than the app default.
       Used by the customer dialog (yaru-customer.css re-points the two tokens
       above to these INSIDE that window, so every descendant inherits the
       quieter ground without a single per-element rule). Measured on this
       ground: fg-dim 4.64:1, fg 11.78:1. */
    --yaru-bg-view-soft:     #f3f3f0;
    --yaru-bg-window-soft:   #ecebe8;
    --yaru-bg-raised:        #f2f2f2;   /* toolbars, pagers, button ground    */
    --yaru-bg-inset:         rgba(0,0,0,0.06); /* text entry interior         */
    --yaru-bg-popover:       #ffffff;   /* menus, dropdowns, tooltips' card   */
    --yaru-bg-sidebar:       #ebebeb;

    /* ---- text ---- */
    --yaru-fg:               rgba(0,0,0,0.8);
    --yaru-fg-dim:           rgba(0,0,0,0.55);
    --yaru-fg-disabled:      rgba(0,0,0,0.4);
    --yaru-fg-on-accent:     #ffffff;
    --yaru-fg-backdrop:      rgba(0,0,0,0.5);   /* unfocused titlebar text    */

    /* ---- accent (Ubuntu orange drives everything interactive) ---- */
    --yaru-accent:           #E95420;
    --yaru-accent-hover:     #EB5F2D;
    --yaru-accent-active:    #D2440F;
    --yaru-accent-fg:        #ffffff;
    --yaru-accent-soft:      rgba(233,84,32,0.15);  /* selection tint (light) */
    --yaru-accent-standalone:#C4400E;  /* accent-colored TEXT on light bg     */

    /* ---- semantic (stock Adwaita — Yaru keeps these) ---- */
    --yaru-error:            #e01b24;
    --yaru-error-standalone: #c30000;
    --yaru-error-soft:       rgba(224,27,36,0.15);
    --yaru-success:          #2ec27e;
    --yaru-success-standalone:#007c3d;
    --yaru-success-soft:     rgba(46,194,126,0.15);
    --yaru-warning:          #e5a50a;
    --yaru-warning-standalone:#905400;
    --yaru-warning-soft:     rgba(229,165,10,0.18);
    --yaru-info:             #3584e4;
    --yaru-info-standalone:  #1a5fb4;
    /* info tint at the same alpha as the other *-soft pair — added for the
       customer-file status pills (Freezed); completes the semantic quartet */
    --yaru-info-soft:        rgba(53,132,228,0.15);
    --yaru-link:             #C4400E;

    /* ---- lines ---- */
    --yaru-border:           rgba(0,0,0,0.15);
    --yaru-border-strong:    rgba(0,0,0,0.26);
    --yaru-divider:          rgba(0,0,0,0.08);

    /* ---- interaction overlays (libadwaita alphas) ---- */
    --yaru-hover:            rgba(0,0,0,0.07);
    --yaru-active:           rgba(0,0,0,0.13);
    --yaru-row-hover:        rgba(0,0,0,0.04);
    --yaru-row-active:       rgba(0,0,0,0.08);
    --yaru-scrim:            rgba(0,0,0,0.32);   /* window-mask / modal wash  */

    /* ---- window chrome ---- */
    --yaru-headerbar-backdrop:#fafafa;
    --yaru-win-outline:      rgba(0,0,0,0.08);
    --yaru-tool-bg:          rgba(0,0,0,0.08);   /* titlebar button circles   */
    --yaru-tool-bg-hover:    rgba(0,0,0,0.14);
    --yaru-tool-bg-active:   rgba(0,0,0,0.26);
    --yaru-shadow-window:    0 2px 8px 2px rgba(0,0,0,0.13), 0 3px 20px 10px rgba(0,0,0,0.09), 0 6px 32px 16px rgba(0,0,0,0.04);
    --yaru-shadow-window-backdrop: 0 1px 3px 3px rgba(0,0,0,0.09), 0 2px 14px 5px rgba(0,0,0,0.05), 0 4px 28px 12px rgba(0,0,0,0.03);
    --yaru-shadow-popover:   0 1px 5px 1px rgba(0,0,0,0.09), 0 2px 14px 3px rgba(0,0,0,0.05);

    /* ---- shell (dark in BOTH modes — Yaru forces the panel dark) ---- */
    --yaru-panel-bg:         #131313;
    --yaru-panel-fg:         #F2F2F2;
    --yaru-panel-hover:      rgba(242,242,242,0.17);
    --yaru-panel-active:     rgba(242,242,242,0.28);
    --yaru-dock-bg:          rgba(19,19,19,0.8);
    --yaru-dock-indicator:   var(--yaru-accent);   /* follows the user accent */
    --yaru-dock-item-hover:  rgba(242,242,242,0.10);
    --yaru-dock-item-active: rgba(242,242,242,0.25);
    --yaru-osd-bg:           rgba(0,0,0,0.8);    /* tooltips / OSD pills      */
    --yaru-osd-fg:           rgba(255,255,255,0.9);

    /* ---- geometry ---- */
    --yaru-radius-window:    12px;
    --yaru-radius-widget:    6px;
    --yaru-radius-sm:        4px;
    --yaru-radius-pill:      9999px;
    --yaru-panel-height:     32px;
    --yaru-dock-width:       72px;
    --yaru-headerbar-height: 46px;

    /* ---- focus ---- */
    --yaru-focus-ring:       2px;
    --yaru-focus-color:      var(--yaru-accent);      /* follows the user accent */
    --yaru-focus-soft:       var(--yaru-accent-soft);

    /* ---- motion ---- */
    --yaru-dur-fast:         150ms;
    --yaru-dur-med:          200ms;
    --yaru-ease:             cubic-bezier(0.25,0.46,0.45,0.94);

    /* ---- scrollbars (color only — width stays superBlue's 8px) ---- */
    --yaru-scrollbar-thumb:  rgba(0,0,0,0.35);
    --yaru-scrollbar-thumb-hover: rgba(0,0,0,0.55);

    /* ---- wallpaper (default; a user's own choice always wins via the inline
       var applyPrefs writes) ---- Northern Lights photo is the tenant default
       for ALL users (owner 2026-08-11); the old Yaru gradient is retired. */
    --yaru-wallpaper: url("/assets/ubuntu-theme/wallpaper/gallery/northern-lights.jpg");

    /* ---- accent SWATCHES (display only) ----
       The 13 Yaru accent choices as flat colors, so any UI that has to SHOW the
       palette (the settings dialog's swatch grid) can paint itself from a token
       instead of carrying a literal. These never drive a component: the active
       accent is always --yaru-accent below, switched by the [data-accent] blocks. */
    --yaru-swatch-orange:    #E95420;
    --yaru-swatch-bark:      #787859;
    --yaru-swatch-sage:      #657B69;
    --yaru-swatch-olive:     #4B8501;
    --yaru-swatch-viridian:  #03875B;
    --yaru-swatch-prussian:  #308280;
    --yaru-swatch-blue:      #0073E5;
    --yaru-swatch-purple:    #7764D8;
    --yaru-swatch-magenta:   #B34CB3;
    --yaru-swatch-red:       #DA3450;
    --yaru-swatch-gold:      #B0821B;
    --yaru-swatch-teal:      #00A3A3;
    --yaru-swatch-slate:     #596E79;

    /* ---- font ---- */
    --yaru-font: "Ubuntu Sans", "Ubuntu", Tajawal, system-ui, sans-serif;
}

/* ========================= ACCENT PALETTE (light) =========================
   Ubuntu 24.04 ships 13 accents. ORANGE is the default and therefore has NO
   block: ubuntu-shell.js only writes body[data-accent] for the other twelve
   and removes the attribute again for orange, so the base block above stays
   the single source of the stock look.
   Each block re-points the four interactive accent tokens plus the selection
   tint; everything downstream (buttons, focus tint, dock dot, tab underline)
   already reads those, so nothing else has to change.
   ======================================================================== */
body.yaru[data-accent="bark"] {
    --yaru-accent:           #787859;
    --yaru-accent-hover:     #86866B;
    --yaru-accent-active:    #62624A;
    --yaru-accent-soft:      rgba(120,120,89,0.15);
    --yaru-accent-standalone:#5D5D45;
}
body.yaru[data-accent="sage"] {
    --yaru-accent:           #657B69;
    --yaru-accent-hover:     #71887A;
    --yaru-accent-active:    #536450;
    --yaru-accent-soft:      rgba(101,123,105,0.15);
    --yaru-accent-standalone:#4F6153;
}
body.yaru[data-accent="olive"] {
    --yaru-accent:           #4B8501;
    --yaru-accent-hover:     #569509;
    --yaru-accent-active:    #3D6D01;
    --yaru-accent-soft:      rgba(75,133,1,0.15);
    --yaru-accent-standalone:#3F7001;
}
body.yaru[data-accent="viridian"] {
    --yaru-accent:           #03875B;
    --yaru-accent-hover:     #0A9765;
    --yaru-accent-active:    #026F4B;
    --yaru-accent-soft:      rgba(3,135,91,0.15);
    --yaru-accent-standalone:#02714C;
}
body.yaru[data-accent="prussian"] {
    --yaru-accent:           #308280;
    --yaru-accent-hover:     #3B918F;
    --yaru-accent-active:    #276B69;
    --yaru-accent-soft:      rgba(48,130,128,0.15);
    --yaru-accent-standalone:#266967;
}
body.yaru[data-accent="blue"] {
    --yaru-accent:           #0073E5;
    --yaru-accent-hover:     #1580EC;
    --yaru-accent-active:    #005EBC;
    --yaru-accent-soft:      rgba(0,115,229,0.15);
    --yaru-accent-standalone:#005CB8;
}
body.yaru[data-accent="purple"] {
    --yaru-accent:           #7764D8;
    --yaru-accent-hover:     #8574DF;
    --yaru-accent-active:    #6151B8;
    --yaru-accent-soft:      rgba(119,100,216,0.15);
    --yaru-accent-standalone:#5F4FB5;
}
body.yaru[data-accent="magenta"] {
    --yaru-accent:           #B34CB3;
    --yaru-accent-hover:     #BE5CBE;
    --yaru-accent-active:    #953E95;
    --yaru-accent-soft:      rgba(179,76,179,0.15);
    --yaru-accent-standalone:#913D91;
}
body.yaru[data-accent="red"] {
    --yaru-accent:           #DA3450;
    --yaru-accent-hover:     #E0475F;
    --yaru-accent-active:    #B82A42;
    --yaru-accent-soft:      rgba(218,52,80,0.15);
    --yaru-accent-standalone:#B42940;
}
body.yaru[data-accent="gold"] {
    --yaru-accent:           #B0821B;
    --yaru-accent-hover:     #BD8F28;
    --yaru-accent-active:    #93690F;
    --yaru-accent-soft:      rgba(176,130,27,0.15);
    --yaru-accent-standalone:#8A650C;
}
body.yaru[data-accent="teal"] {
    --yaru-accent:           #00A3A3;
    --yaru-accent-hover:     #12B0B0;
    --yaru-accent-active:    #008585;
    --yaru-accent-soft:      rgba(0,163,163,0.15);
    --yaru-accent-standalone:#007878;
}
body.yaru[data-accent="slate"] {
    --yaru-accent:           #596E79;
    --yaru-accent-hover:     #657B87;
    --yaru-accent-active:    #475861;
    --yaru-accent-soft:      rgba(89,110,121,0.15);
    --yaru-accent-standalone:#46575F;
}

/* ============================== DARK ==================================== */
body.yaru.yaru-dark {
    --yaru-bg-window:        #242424;
    --yaru-bg-view:          #1e1e1e;
    --yaru-bg-headerbar:     #303030;
    --yaru-bg-raised:        #2e2e2e;
    --yaru-bg-inset:         rgba(255,255,255,0.08);
    --yaru-bg-popover:       #383838;
    --yaru-bg-sidebar:       #303030;

    /* The soft pair exists to take GLARE off a too-bright light ground; dark
       mode has no glare to take off, and the dark ink is a SOLID white rather
       than the light mode's alpha black, so shifting the ground here would move
       contrast for real. Neutralised to the dark defaults: any surface that
       opts into the soft pair renders identically to every other dark window. */
    --yaru-bg-view-soft:     #1e1e1e;
    --yaru-bg-window-soft:   #242424;

    --yaru-fg:               #ffffff;
    --yaru-fg-dim:           rgba(255,255,255,0.55);
    --yaru-fg-disabled:      rgba(255,255,255,0.4);
    --yaru-fg-backdrop:      rgba(255,255,255,0.5);

    --yaru-accent-soft:      rgba(233,84,32,0.25);
    --yaru-accent-standalone:#FF8A66;

    --yaru-error:            #c01c28;
    --yaru-error-standalone: #ff938c;
    --yaru-error-soft:       rgba(192,28,40,0.3);
    --yaru-success:          #26a269;
    --yaru-success-standalone:#78e9ab;
    --yaru-success-soft:     rgba(38,162,105,0.25);
    --yaru-warning:          #cd9309;
    --yaru-warning-standalone:#ffc252;
    --yaru-warning-soft:     rgba(205,147,9,0.25);
    --yaru-info:             #3584e4;
    --yaru-info-standalone:  #99c1f1;
    --yaru-info-soft:        rgba(53,132,228,0.25);
    --yaru-link:             #FF8A66;

    --yaru-border:           rgba(255,255,255,0.15);
    --yaru-border-strong:    rgba(255,255,255,0.3);
    --yaru-divider:          rgba(255,255,255,0.08);

    --yaru-hover:            rgba(255,255,255,0.1);
    --yaru-active:           rgba(255,255,255,0.18);
    --yaru-row-hover:        rgba(255,255,255,0.04);
    --yaru-row-active:       rgba(255,255,255,0.08);
    --yaru-scrim:            rgba(0,0,0,0.45);

    --yaru-headerbar-backdrop:#242424;
    --yaru-win-outline:      rgba(0,0,0,0.5);
    --yaru-tool-bg:          rgba(255,255,255,0.1);
    --yaru-tool-bg-hover:    rgba(255,255,255,0.15);
    --yaru-tool-bg-active:   rgba(255,255,255,0.3);

    --yaru-scrollbar-thumb:  rgba(255,255,255,0.35);
    --yaru-scrollbar-thumb-hover: rgba(255,255,255,0.55);

    /* same Northern Lights default in dark — a photo needs no dark variant */
    --yaru-wallpaper: url("/assets/ubuntu-theme/wallpaper/gallery/northern-lights.jpg");
}

/* ========================= ACCENT PALETTE (dark) ==========================
   The dark block above re-states the ORANGE selection tint and standalone, so
   at equal specificity (0,2,1) it would otherwise win back over the light
   [data-accent] blocks. These carry one more class than those blocks (0,3,1)
   and restore the chosen accent's two dark-only values:
     -soft        the same RGB at the dark 0.25 alpha
     -standalone  a LIGHTENED tint, because standalone means accent-colored
                  TEXT and the mid-tone hues never clear 4.5:1 on #1e1e1e.
   -accent / -hover / -active are not repeated: the dark block never touches
   them, so the light [data-accent] values carry straight through.
   ======================================================================== */
body.yaru.yaru-dark[data-accent="bark"] {
    --yaru-accent-soft:      rgba(120,120,89,0.25);
    --yaru-accent-standalone:#B3B39A;
}
body.yaru.yaru-dark[data-accent="sage"] {
    --yaru-accent-soft:      rgba(101,123,105,0.25);
    --yaru-accent-standalone:#9DB3A3;
}
body.yaru.yaru-dark[data-accent="olive"] {
    --yaru-accent-soft:      rgba(75,133,1,0.25);
    --yaru-accent-standalone:#8FCA45;
}
body.yaru.yaru-dark[data-accent="viridian"] {
    --yaru-accent-soft:      rgba(3,135,91,0.25);
    --yaru-accent-standalone:#4FC79B;
}
body.yaru.yaru-dark[data-accent="prussian"] {
    --yaru-accent-soft:      rgba(48,130,128,0.25);
    --yaru-accent-standalone:#7FC0BE;
}
body.yaru.yaru-dark[data-accent="blue"] {
    --yaru-accent-soft:      rgba(0,115,229,0.25);
    --yaru-accent-standalone:#66B0FF;
}
body.yaru.yaru-dark[data-accent="purple"] {
    --yaru-accent-soft:      rgba(119,100,216,0.25);
    --yaru-accent-standalone:#AFA3F0;
}
body.yaru.yaru-dark[data-accent="magenta"] {
    --yaru-accent-soft:      rgba(179,76,179,0.25);
    --yaru-accent-standalone:#E08FE0;
}
body.yaru.yaru-dark[data-accent="red"] {
    --yaru-accent-soft:      rgba(218,52,80,0.25);
    --yaru-accent-standalone:#FF7A8C;
}
body.yaru.yaru-dark[data-accent="gold"] {
    --yaru-accent-soft:      rgba(176,130,27,0.25);
    --yaru-accent-standalone:#E3B84D;
}
body.yaru.yaru-dark[data-accent="teal"] {
    --yaru-accent-soft:      rgba(0,163,163,0.25);
    --yaru-accent-standalone:#5BD4D4;
}
body.yaru.yaru-dark[data-accent="slate"] {
    --yaru-accent-soft:      rgba(89,110,121,0.25);
    --yaru-accent-standalone:#A3B8C2;
}

/* ==================== base typography under Yaru ======================== */
body.yaru { font-family: var(--yaru-font); }
