/**
 * OWL Design System — Foundations (vendored)
 * Source: design project "OWL Help Center" colors_and_type.css, itself consolidated
 * from Onwave.UI.Components wwwroot/css/{colors,light-theme,dark-theme,shadows,global}.css.
 * Do not restyle brand tokens here — regenerate from the design system instead.
 */

/* 1. FONTS — Inter (UI), Inter Display (large headlines), IBM Plex Sans (numeric accent) */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url("../font/Inter-Regular.woff2") format("woff2"); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url("../font/Inter-Medium.woff2") format("woff2"); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url("../font/Inter-SemiBold.woff2") format("woff2"); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url("../font/Inter-Bold.woff2") format("woff2"); }
@font-face { font-family: 'Inter Display'; font-style: normal; font-weight: 600; font-display: swap; src: url("../font/InterDisplay-SemiBold.woff2") format("woff2"); }
@font-face { font-family: 'Inter Display'; font-style: normal; font-weight: 700; font-display: swap; src: url("../font/InterDisplay-Bold.woff2") format("woff2"); }
@font-face { font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 500; font-display: swap; src: url("../font/IBMPlexSans-Medium.ttf") format("truetype"); }

/* 2. BASE COLOR SCALES */
:root {
    --lm-neutral-0: #ffffff; --lm-neutral-1: #f6f8fa; --lm-neutral-2: #eff2f5;
    --lm-neutral-3: #e6eaef; --lm-neutral-4: #e0e6eb; --lm-neutral-5: #dae0e7;
    --lm-neutral-6: #d1d9e0; --lm-neutral-7: #c8d1da; --lm-neutral-8: #818b98;
    --lm-neutral-9: #59636e; --lm-neutral-10: #454c54; --lm-neutral-11: #393f46;
    --lm-neutral-12: #25292e; --lm-neutral-13: #1f2328;

    --lm-blue-0: #ddf4ff; --lm-blue-1: #b6e3ff; --lm-blue-2: #80ccff;
    --lm-blue-3: #54aeff; --lm-blue-4: #218bff; --lm-blue-5: #0969da;
    --lm-blue-6: #0550ae; --lm-blue-7: #033d8b; --lm-blue-8: #0a3069; --lm-blue-9: #002155;

    --lm-green-0: #dafbe1; --lm-green-1: #aceebb; --lm-green-2: #6fdd8b;
    --lm-green-3: #4ac26b; --lm-green-4: #2da44e; --lm-green-5: #1a7f37;
    --lm-green-6: #116329; --lm-green-7: #044f1e; --lm-green-8: #003d16; --lm-green-9: #002d11;

    --lm-yellow-0: #fff8c5; --lm-yellow-1: #fae17d; --lm-yellow-2: #eac54f;
    --lm-yellow-3: #d4a72c; --lm-yellow-4: #bf8700; --lm-yellow-5: #9a6700;
    --lm-yellow-6: #7d4e00; --lm-yellow-7: #633c01; --lm-yellow-8: #4d2d00; --lm-yellow-9: #3b2300;

    --lm-orange-0: #fff1e5; --lm-orange-1: #ffd8b5; --lm-orange-2: #ffb77c;
    --lm-orange-3: #fb8f44; --lm-orange-4: #e16f24; --lm-orange-5: #bc4c00;
    --lm-orange-6: #953800; --lm-orange-7: #762c00; --lm-orange-8: #5c2200; --lm-orange-9: #471700;

    --lm-red-0: #ffebe9; --lm-red-1: #ffcecb; --lm-red-2: #ffaba8;
    --lm-red-3: #ff8182; --lm-red-4: #fa4549; --lm-red-5: #cf222e;
    --lm-red-6: #a40e26; --lm-red-7: #82071e; --lm-red-8: #660018; --lm-red-9: #4c0014;

    --lm-purple-0: #fbefff; --lm-purple-1: #ecd8ff; --lm-purple-2: #d8b9ff;
    --lm-purple-3: #c297ff; --lm-purple-4: #a475f9; --lm-purple-5: #8250df;
    --lm-purple-6: #6639ba; --lm-purple-7: #512a97; --lm-purple-8: #3e1f79; --lm-purple-9: #2e1461;

    --lm-pink-0: #ffeff7; --lm-pink-1: #ffd3eb; --lm-pink-2: #ffadda;
    --lm-pink-3: #ff80c8; --lm-pink-4: #e85aad; --lm-pink-5: #bf3989;
    --lm-pink-6: #99286e; --lm-pink-7: #772057; --lm-pink-8: #611347; --lm-pink-9: #4d0336;

    /* BRAND (Onwave/OWL signature coral-orange) */
    --lm-brand-0: #fff0eb; --lm-brand-1: #ffd6cc; --lm-brand-2: #ffb4a1;
    --lm-brand-3: #fd8c73; --lm-brand-4: #f1582b;
    --lm-brand-5: #c4432b; --lm-brand-6: #9e2f1c; --lm-brand-7: #801f0f;
    --lm-brand-8: #691105; --lm-brand-9: #510901;

    --dm-neutral-0: #010409; --dm-neutral-1: #0d1117; --dm-neutral-2: #151b23;
    --dm-neutral-3: #212830; --dm-neutral-4: #262c36; --dm-neutral-5: #2a313c;
    --dm-neutral-6: #2f3742; --dm-neutral-7: #3d444d; --dm-neutral-8: #656c76;
    --dm-neutral-9: #9198a1; --dm-neutral-10: #b7bdc8; --dm-neutral-11: #d1d7e0;
    --dm-neutral-12: #f0f6fc; --dm-neutral-13: #ffffff;

    --dm-blue-4: #388bfd; --dm-blue-5: #1f6feb; --dm-blue-6: #1158c7;
    --dm-green-4: #2ea043; --dm-green-5: #238636;
    --dm-yellow-3: #d29922; --dm-yellow-4: #bb8009;
    --dm-orange-3: #f0883e; --dm-orange-4: #db6d28;
    --dm-red-4: #f85149; --dm-red-5: #da3633;
    --dm-purple-4: #ab7df8; --dm-purple-5: #8957e5;
    --dm-brand-4: #f1582b; --dm-brand-5: #cf462d;

    --lm-neutral-trans-0: #ffffffa6;
    --lm-neutral-trans-2: #eff2f5a6;
    --lm-neutral-trans-8: #818b98a6;
    --dm-neutral-trans-0: #010409a6;
    --dm-neutral-trans-8: #656c76a6;
}

/* 3. SEMANTIC TOKENS — light default, dark override */
:root,
[data-theme="light"] {
    --theme: "light";
    --bgColour-primary: var(--lm-neutral-1);
    --sfColour-primary: var(--lm-neutral-0);
    --sfColour-secondary: var(--lm-neutral-4);
    --sfColour-hover: var(--lm-neutral-2);
    --sfColour-selected: var(--lm-neutral-3);
    --sfColour-danger: var(--lm-red-0);
    --sfColour-success: var(--lm-green-0);
    --sfColour-informational: var(--lm-blue-0);
    --textColour-primary: var(--lm-neutral-12);
    --textColour-secondary: var(--lm-neutral-9);
    --textColour-tertiary: var(--lm-neutral-8);
    --textColour-disabled: var(--lm-neutral-trans-8);
    --textColour-link: var(--lm-blue-5);
    --textColour-brand: var(--lm-brand-4);
    --textColour-white: var(--lm-neutral-0);
    --iconColour-primary: var(--lm-neutral-12);
    --iconColour-secondary: var(--lm-neutral-9);
    --iconColour-tertiary: var(--lm-neutral-8);
    --iconColour-brand: var(--lm-brand-4);
    --buttonColour-primary: var(--lm-brand-4);
    --buttonColour-primary-hover: var(--lm-brand-5);
    --buttonColour-tertiary: var(--lm-neutral-2);
    --buttonColour-tertiary-hover: var(--lm-neutral-3);
    --buttonColour-altPrimary: var(--lm-neutral-11);
    --buttonColour-altPrimary-hover: var(--lm-neutral-13);
    --borderColour-primary: var(--lm-neutral-4);
    --borderColour-secondary: var(--lm-neutral-2);
    --borderColour-active: var(--lm-neutral-11);
    --dividerColour-primary: var(--lm-neutral-4);
    --tableColour-header: var(--lm-neutral-1);
    --tableColour-body: var(--lm-neutral-0);
}

[data-theme="dark"] {
    --theme: "dark";
    --bgColour-primary: var(--dm-neutral-1);
    --sfColour-primary: var(--dm-neutral-0);
    --sfColour-secondary: var(--dm-neutral-6);
    --sfColour-hover: var(--dm-neutral-2);
    --sfColour-selected: var(--dm-neutral-3);
    --textColour-primary: var(--dm-neutral-12);
    --textColour-secondary: var(--dm-neutral-10);
    --textColour-tertiary: var(--dm-neutral-9);
    --textColour-link: var(--dm-blue-5);
    --textColour-brand: var(--dm-brand-4);
    --textColour-white: var(--dm-neutral-13);
    --iconColour-primary: var(--dm-neutral-12);
    --iconColour-brand: var(--dm-brand-4);
    --buttonColour-primary: var(--dm-brand-4);
    --buttonColour-primary-hover: var(--dm-brand-5);
    --buttonColour-tertiary: var(--dm-neutral-3);
    --buttonColour-tertiary-hover: var(--dm-neutral-5);
    --borderColour-primary: var(--dm-neutral-5);
    --borderColour-secondary: var(--dm-neutral-2);
    --tableColour-header: var(--dm-neutral-1);
    --tableColour-body: var(--dm-neutral-0);
    --dividerColour-primary: var(--dm-neutral-4);
}

/* 4. SHADOWS */
:root {
    --shadow-basic-01: 0px 0px 8px 2px rgba(46, 46, 46, 0.02);
    --shadow-basic-02: 0px 5px 16px 0px rgba(0, 0, 0, 0.01), 0px 1px 8px 0px rgba(0, 0, 0, 0.10);
    --shadow-basic-03: 0px 2px 8px 0px rgba(0, 0, 0, 0.22), 0px 10px 18px 0px rgba(0, 0, 0, 0.16);
    --shadow-basic-04: 0px 4px 12px 0px rgba(0, 0, 0, 0.20);
    --shadow-basic-06: 0px 24px 48px -12px rgba(16, 24, 40, 0.18);
    --shadow-header-01: 0px 4px 10px 0px rgba(78, 78, 78, 0.10);
    --shadow-surface-hover: 0px 1px 12px 0px rgba(0, 0, 0, 0.15);
}

/* 5. TYPOGRAPHY */
:root {
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-display: 'Inter Display', 'Inter', -apple-system, sans-serif;
    --font-mono-accent: 'IBM Plex Sans', 'Inter', sans-serif;

    --fs-h1: 32px; --lh-h1: 40px;
    --fs-h2: 24px; --lh-h2: 32px;
    --fs-h3: 20px; --lh-h3: 28px;
    --fs-h4: 18px; --lh-h4: 24px;
    --fs-h5: 16px; --lh-h5: 22px;
    --fs-body-01: 16px; --lh-body-01: 22px;
    --fs-body-02: 14px; --lh-body-02: 18px;
    --fs-body-03: 13px; --lh-body-03: 18px;
    --fs-caption: 12px; --lh-caption: 16px;
    --fs-overline: 11px; --lh-overline: 16px;
}

/* 6. SPACING / RADII / MOTION */
:root {
    --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-xl: 12px; --radius-pill: 999px;
    --ease-standard: cubic-bezier(0.2, 0, 0.2, 1);
    --duration-fast: 120ms; --duration-normal: 200ms; --duration-slow: 320ms;
    --z-sticky: 100; --z-overlay: 500; --z-modal: 1000; --z-toast: 2000;
}

/* 7. GLOBAL DEFAULTS */
*, *::before, *::after { box-sizing: border-box; }
html {
    font-size: 16px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
body {
    margin: 0;
    padding: 0;
    font-family: var(--font-sans);
    font-size: var(--fs-body-02);
    line-height: var(--lh-body-02);
    font-weight: 400;
    color: var(--textColour-primary);
    background-color: var(--bgColour-primary);
    font-feature-settings: 'liga' 1, 'calt' 1;
}
input, textarea, select, button { font-family: inherit; font-size: inherit; line-height: inherit; color: inherit; }
button { cursor: pointer; }
