/* ==========================================================================
   Samaa/IDO EDMS — Design tokens
   --------------------------------------------------------------------------
   Ported from new-theme-design/src/styles/globals.css (the approved design
   system). Every value used by theme-bridge.css must originate here.

   Brand source: i-do HOLDING mark, #0B46BE (approved primary accent).
   ========================================================================== */

/* --- Inter (variable font, weights 100-900) ------------------------------ */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../fonts/inter/inter-latin.65850a373e25.woff2") format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
        U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
        U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("../fonts/inter/inter-latin-ext.01ba6c2a184b.woff2") format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7,
        U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F,
        U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
        U+A720-A7FF;
}

/* --------------------------------------------------------------------------
   1. Primitive tokens
   -------------------------------------------------------------------------- */

:root {
    /* --- Brand ------------------------------------------------------------ */
    --brand-blue: #0b46be;

    /* --- Primary ramp (derived from --brand-blue) ------------------------- */
    --color-primary-25: #f6f9ff;
    --color-primary-50: #eef3fe;
    --color-primary-100: #dbe6fd;
    --color-primary-200: #bccefa;
    --color-primary-300: #8fadf6;
    --color-primary-400: #5b82ef;
    --color-primary-500: #2b5ce0;
    --color-primary-600: #0b46be; /* brand */
    --color-primary-700: #0938a0;
    --color-primary-800: #0a2f7f;
    --color-primary-900: #0c2a66;

    /* --- Neutral ramp (cool slate) ---------------------------------------- */
    --color-neutral-0: #ffffff;
    --color-neutral-25: #fbfcfd;
    --color-neutral-50: #f6f8fa;
    --color-neutral-100: #eff2f6;
    --color-neutral-200: #e3e8ef;
    --color-neutral-300: #cdd5df;
    --color-neutral-400: #9aa4b2;
    --color-neutral-500: #697586;
    --color-neutral-600: #4b5565;
    --color-neutral-700: #364152;
    --color-neutral-800: #202939;
    --color-neutral-900: #121926;

    /* --- Status ramps ------------------------------------------------------ */
    --color-success-50: #ecfdf3;
    --color-success-200: #abefc6;
    --color-success-600: #067647;
    --color-success-700: #085d3a;

    --color-warning-50: #fffaeb;
    --color-warning-200: #fedf89;
    --color-warning-600: #b54708;
    --color-warning-700: #93370d;

    --color-danger-50: #fef3f2;
    --color-danger-200: #fecdca;
    --color-danger-600: #b42318;
    --color-danger-700: #912018;

    /* --- Spacing (4px base) ------------------------------------------------ */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-12: 48px;

    /* --- Radius ------------------------------------------------------------- */
    --radius-sm: 8px; /* small controls */
    --radius-md: 12px; /* cards and fields */
    --radius-lg: 16px; /* large modal / drop zone */
    --radius-pill: 999px;

    /* --- Elevation ---------------------------------------------------------- */
    --shadow-xs: 0 1px 2px rgba(18, 25, 38, 0.05);
    --shadow-sm: 0 1px 3px rgba(18, 25, 38, 0.08), 0 1px 2px rgba(18, 25, 38, 0.04);
    --shadow-md: 0 4px 8px -2px rgba(18, 25, 38, 0.08), 0 2px 4px -2px rgba(18, 25, 38, 0.04);
    --shadow-lg: 0 12px 16px -4px rgba(18, 25, 38, 0.08), 0 4px 6px -2px rgba(18, 25, 38, 0.03);
    --shadow-xl: 0 20px 24px -4px rgba(18, 25, 38, 0.1), 0 8px 8px -4px rgba(18, 25, 38, 0.04);

    /* --- Typography families ------------------------------------------------ */
    --font-latin: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
    --font-arabic: 'IBM Plex Sans Arabic', 'Noto Sans Arabic', 'Segoe UI', Tahoma, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, monospace;
    --font-ui: var(--font-latin);

    /* --- Type scale ---------------------------------------------------------- */
    --text-page-title-size: 28px;
    --text-page-title-line: 36px;
    --text-section-title-size: 18px;
    --text-section-title-line: 26px;
    --text-body-size: 14px;
    --text-body-line: 22px;
    --text-table-size: 13px;
    --text-table-line: 20px;
    --text-label-size: 12px;
    --text-label-line: 18px;

    --weight-regular: 400;
    --weight-medium: 500;
    --weight-semibold: 600;

    /* --- Motion -------------------------------------------------------------- */
    --duration-fast: 120ms;
    --duration-base: 180ms;
    --duration-slow: 260ms;
    --ease-standard: cubic-bezier(0.2, 0, 0, 1);

    /* --- Layout -------------------------------------------------------------- */
    --sidebar-width: 264px;
    --topbar-height: 64px;
    --content-gutter: var(--space-8);
    --facet-width: 220px;
    --z-sticky: 100;
    --z-drawer: 200;
    --z-modal: 300;
    --z-menu: 400;
    --z-toast: 500;
}

/* --------------------------------------------------------------------------
   2. Semantic tokens
   -------------------------------------------------------------------------- */

:root {
    /* --- Surfaces ----------------------------------------------------------- */
    --canvas: var(--color-neutral-50);
    --surface: var(--color-neutral-0);
    --surface-muted: var(--color-neutral-50);
    --surface-sunken: var(--color-neutral-100);
    --surface-hover: var(--color-neutral-50);
    --surface-active: var(--color-neutral-100);
    --surface-selected: var(--color-primary-50);
    --surface-overlay: rgba(18, 25, 38, 0.45);
    --surface-sidebar: var(--color-neutral-0);
    --surface-topbar: var(--color-neutral-0);

    /* --- Text ---------------------------------------------------------------- */
    --text-strong: var(--color-neutral-900);
    --text-default: var(--color-neutral-700);
    --text-muted: var(--color-neutral-500);
    --text-subtle: var(--color-neutral-400);
    --text-on-primary: var(--color-neutral-0);
    --text-link: var(--color-primary-600);

    /* --- Borders ------------------------------------------------------------- */
    --border-subtle: var(--color-neutral-100);
    --border-default: var(--color-neutral-200);
    --border-strong: var(--color-neutral-300);

    /* --- Interactive --------------------------------------------------------- */
    --primary: var(--color-primary-600);
    --primary-hover: var(--color-primary-700);
    --primary-active: var(--color-primary-800);
    --primary-soft: var(--color-primary-50);
    --primary-soft-hover: var(--color-primary-100);
    --primary-border: var(--color-primary-200);

    /* --- Status -------------------------------------------------------------- */
    --success: var(--color-success-600);
    --success-soft: var(--color-success-50);
    --success-border: var(--color-success-200);
    --warning: var(--color-warning-600);
    --warning-soft: var(--color-warning-50);
    --warning-border: var(--color-warning-200);
    --danger: var(--color-danger-600);
    --danger-hover: var(--color-danger-700);
    --danger-soft: var(--color-danger-50);
    --danger-border: var(--color-danger-200);
    --info: var(--color-primary-600);
    --info-soft: var(--color-primary-50);
    --info-border: var(--color-primary-200);

    /* --- Focus ---------------------------------------------------------------- */
    --focus-ring-color: var(--color-primary-600);
    --focus-ring-halo: rgba(11, 70, 190, 0.22);
    --focus-ring-width: 2px;
    --focus-ring-offset: 2px;
}

/* --------------------------------------------------------------------------
   3. Language and direction adjustments
   -------------------------------------------------------------------------- */

:root[lang='ar'] {
    --font-ui: var(--font-arabic);
    --text-page-title-line: 44px;
    --text-section-title-line: 32px;
    --text-body-line: 26px;
    --text-table-line: 24px;
    --text-label-line: 22px;
}

/* --------------------------------------------------------------------------
   4. Base adjustments (kept minimal — Bootstrap provides the reset)
   -------------------------------------------------------------------------- */

:focus-visible {
    outline: var(--focus-ring-width) solid var(--focus-ring-color);
    outline-offset: var(--focus-ring-offset);
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* --------------------------------------------------------------------------
   Shared utilities

   Ported from new-theme-design/src/styles/globals.css section 5. These were
   missed in the original port; the components layer and the reference markup
   both rely on them, so they belong here with the rest of the base layer.
   -------------------------------------------------------------------------- */

/* Anchor reset from globals.css. Also missed in the original port, and its
   absence is visible: components that colour their own link text — the
   document label cell, tag badges — inherited the user agent's underline,
   which the design does not use except on hover. Element specificity (0,0,1)
   keeps this weaker than any component rule. */
a {
    color: var(--text-link);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.edms-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

/* Force LTR for inherently left-to-right technical strings (tokens, file
   paths, code) so bidi reordering cannot scramble them inside Arabic copy. */
.edms-ltr {
    direction: ltr;
    unicode-bidi: isolate;
}