/*
 * 9TIVO Bots — the white-label look of the `bot` instance (ADR 0021, brand/9tivo-bots.json → look.stylesheet).
 * Loaded after the product's tokens, so it redefines them; nothing else in the app changes.
 * Palette and type from the 9TIVO system (the same values support.9tivo.com uses):
 *   ink #0D0D10 · ivory #F5F2EC · emerald (products: Sender, Safeer, Bots) · gold (the second colour) · Alexandria.
 * Text tokens keep at least 4.5:1 on their surfaces in both themes.
 */

@font-face {
  font-family: 'Alexandria';
  src: url('./fonts/alexandria-arabic-wght-normal.woff2') format('woff2-variations'), url('./fonts/alexandria-arabic-wght-normal.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891, U+0898-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}
@font-face {
  font-family: 'Alexandria';
  src: url('./fonts/alexandria-latin-wght-normal.woff2') format('woff2-variations'), url('./fonts/alexandria-latin-wght-normal.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  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;
}

:root {
  --font-latin: 'Alexandria', 'Inter Variable', 'Inter', system-ui, sans-serif;
  --font-arabic: 'Alexandria', 'Tajawal', system-ui, sans-serif;
  --font-mono: 'IBM Plex Mono', 'Alexandria', ui-monospace, monospace;

  /* Slightly softer corners, as on the 9TIVO pages. */
  --r-xs: 6px;
  --r-sm: 8px;
  --r-md: 10px;
  --r-lg: 13px;
  --r-xl: 18px;

  /* The top bar, rail and floating panels stay ink in both themes. */
  --railIcon: #a9a39a;
  --railHover: rgba(245, 242, 236, 0.07);
  --unread: #e0675f;
  --panelFg: #a9a39a;
  --panelFgStrong: #f5f2ec;
  --panelLabel: #938d84;
  --panelIcon: #a9a39a;
  --panelLine: rgba(245, 242, 236, 0.07);
  --panelHover: rgba(245, 242, 236, 0.05);
  --panelCard: rgba(245, 242, 236, 0.045);
  --panelCardLine: rgba(245, 242, 236, 0.08);
  --panelTrack: rgba(245, 242, 236, 0.1);
  --panelSoft: #d6d0c5;
  --panelInput: #f5f2ec;
  --toastFg: #f5f2ec;
  --toastGood: #5fb19a;
  --toastAcc: #c8a96a;
  --toastWarn: #d9a441;
  --toastBad: #f6dcd9;
  --copilotFg: #f5f2ec;
  --copilotMuted: #a9a39a;
  --copilotLine: rgba(245, 242, 236, 0.09);
  --copilotRaise: rgba(245, 242, 236, 0.05);
  --copilotAccent: #c8a96a;
  --copilotGood: #5fb19a;
  --copilotGoodBg: rgba(95, 177, 154, 0.14);
  --copilotWarnBg: rgba(217, 164, 65, 0.16);

  --goodSolid: #1f6b4e;
  --warnSolid: #8a5a0b;
  --badSolid: #a3302b;
  --offline: #938d84;
  --knob: #fbf9f5;
  --series-main: #3e8c76;
  --series-support: #8f6e3a;
  --series-sales: #c8a96a;
  --series-vip: #d9a441;
  --series-delivery: #7a5c2e;
  --series-warranty: #a3302b;
  --series-billing: #2c4e7a;
  --series-returns: #5fb19a;
  --series-concierge: #8a5a0b;
  --series-breach: #e0675f;

  /* Single accent, no gradient: the 9TIVO system uses flat colour. */
  --accGrad: var(--acc);
  --accShadowBtn: 0 3px 10px color-mix(in srgb, var(--acc) 22%, transparent);
  --accShadowRail: 0 4px 14px color-mix(in srgb, var(--acc) 35%, transparent);
  --accShadowNav: 0 2px 10px color-mix(in srgb, var(--acc) 30%, transparent);
  --accShadowCompose: 0 4px 14px color-mix(in srgb, var(--acc) 26%, transparent);
  --shadow-chip: 0 1px 3px rgba(13, 13, 16, 0.1);
  --shadow-knob: 0 1px 3px rgba(13, 13, 16, 0.3);
  --shadow-toast: 0 14px 40px rgba(13, 13, 16, 0.34);
  --shadow-pop: 0 24px 64px -24px rgba(13, 13, 16, 0.28);
}

:root,
:root[data-theme='light'],
[data-theme='light'] {
  --ink: #0d0d10;
  --muted: #4f4a43;
  --faint: #5f5950;
  --breachText: #a3302b;
  --dim: #6b655c;
  --ghost: #a39b8e;
  --sep: #c4b9a6;
  --surface: #fbf9f5;
  --surface2: #f7f4ee;
  --surface3: #f3efe7;
  --canvas: #f5f2ec;
  --chrome: #fbf9f5;
  --shell: #efeae1;
  --field: #f1ece3;
  --track: #e9e3d8;
  --rail: #0d0d10;
  --panel: #16161a;
  --toast: #16161a;
  --border: #dcd4c6;
  --borderHi: #c4b9a6;
  --line: #e8e2d7;
  --acc: #14382f;
  --acc2: #14382f;
  --onAcc: #fbf9f5;
  --accSoft: #e3ece8;
  --accSoft2: #eef3f0;
  --accSoft3: #d6e3dd;
  --accSoft4: #c7d9d1;
  --accLine: #c7d9d1;
  --accText: #14382f;
  --ai: #8f6e3a;
  --goodBg: #e5f0ea;
  --goodFg: #1f6b4e;
  --goodLine: #a9cdbb;
  --goodSoft: #f3f8f5;
  --warnBg: #f6ebd6;
  --warnFg: #7a5209;
  --warnLine: #dcc08a;
  --warnSoft: #fbf5ea;
  --badBg: #f8e7e5;
  --badFg: #a3302b;
  --badLine: #e3b1ac;
  --alertBg: #fcf4f3;
  --infoBg: #e6edf6;
  --infoFg: #2c4e7a;
  --violetBg: #f1e8d8;
  --violetFg: #7a5c2e;
  --noteBg: #fdf9f0;
  --noteLine: #dcc08a;
  --inverse: #0d0d10;
  --onInverse: #fbf9f5;
  --switchOff: #c4b9a6;
  --chartBar: #a9cdbb;
  --scroll: #d6cec0;
  --scrollHi: #c4b9a6;
  --overlay: rgba(13, 13, 16, 0.45);
  /* The sign-in field (features/auth/ModuleField) and the motto's marked letters. */
  --fieldModule: #0d0d10;
  --brandGold: #8f6e3a;
  /* Avatars carry their initials in --onAcc (ivory here), so their faces are the deep brand tones. */
  --avatar-1: #14382f;
  --avatar-2: #7a5c2e;
  --avatar-3: #2c4e7a;
  --avatar-4: #1f6b4e;
  --avatar-5: #5a4626;
  --avatarOffline: #6b655c;
}

:root[data-theme='dark'],
[data-theme='dark'] {
  --ink: #f5f2ec;
  --muted: #a9a39a;
  --faint: #969087;
  --breachText: #e0675f;
  --dim: #a09a91;
  --ghost: #5a5650;
  --sep: #3b3b43;
  --surface: #16161a;
  --surface2: #1b1b20;
  --surface3: #1f1f24;
  --canvas: #0d0d10;
  --chrome: #121215;
  --shell: #0a0a0c;
  --field: #1f1f24;
  --track: #26262c;
  --rail: #0a0a0c;
  --panel: #121215;
  --toast: #1f1f24;
  --border: #2a2a30;
  --borderHi: #3b3b43;
  --line: #222227;
  /* 9TIVO emerald-hover: ink text on it stays above 4.5:1 even where the product fades it to 85%. */
  --acc: #4c9c85;
  --acc2: #4c9c85;
  --onAcc: #0d0d10;
  --accSoft: #15241f;
  --accSoft2: #13201c;
  --accSoft3: #1a2d27;
  --accSoft4: #1f362f;
  --accLine: #24493a;
  --accText: #5fb19a;
  --ai: #c8a96a;
  --goodBg: #13241d;
  --goodFg: #4fae86;
  --goodLine: #24493a;
  --goodSoft: #101c17;
  --warnBg: #241c0e;
  --warnFg: #d9a441;
  --warnLine: #5a4417;
  --warnSoft: #1b150a;
  --badBg: #2a1515;
  --badFg: #e0675f;
  --badLine: #6b2d2a;
  --alertBg: #1f1111;
  --infoBg: #172231;
  --infoFg: #7fa6da;
  --violetBg: #2a241a;
  --violetFg: #c8a96a;
  --noteBg: #1f1a10;
  --noteLine: #5a4417;
  --inverse: #f5f2ec;
  --onInverse: #0d0d10;
  --switchOff: #3b3b43;
  --chartBar: #24493a;
  --scroll: #2a2a30;
  --scrollHi: #3b3b43;
  --overlay: rgba(0, 0, 0, 0.6);
  --fieldModule: #f5f2ec;
  --brandGold: #c8a96a;
  /* Initials are ink (--onAcc) in this theme, so the faces are the light brand tones. */
  --avatar-1: #5fb19a;
  --avatar-2: #c8a96a;
  --avatar-3: #7fa6da;
  --avatar-4: #4fae86;
  --avatar-5: #d6bc86;
  --avatarOffline: #938d84;
}

/*
 * A workspace that picked its own accent (or ink) keeps it: the product's override blocks, repeated after this
 * look's palette so they still win. Copied verbatim from packages/tokens/src/tokens.css.
 */
/* Non-default workspace accent: derive the tints instead of using the tuned defaults. */
:root[data-accent='custom'] {
  --accSoft: color-mix(in srgb, var(--acc) 9%, var(--surface));
  --accSoft2: color-mix(in srgb, var(--acc) 6%, var(--surface));
  --accSoft3: color-mix(in srgb, var(--acc) 13%, var(--surface));
  --accSoft4: color-mix(in srgb, var(--acc) 19%, var(--surface));
  --accLine: color-mix(in srgb, var(--acc) 20%, var(--surface));
  --accText: color-mix(in srgb, var(--acc) 80%, var(--ink));
  --acc2: color-mix(in srgb, var(--acc) 78%, #ffffff);
}
:root[data-accent='ink'] {
  --acc: var(--ink);
  --onAcc: var(--surface);
  --accSoft: color-mix(in srgb, var(--ink) 7%, var(--surface));
  --accSoft2: color-mix(in srgb, var(--ink) 4%, var(--surface));
  --accSoft3: color-mix(in srgb, var(--ink) 10%, var(--surface));
  --accSoft4: color-mix(in srgb, var(--ink) 15%, var(--surface));
  --accLine: color-mix(in srgb, var(--ink) 18%, var(--surface));
  --accText: var(--ink);
  --acc2: color-mix(in srgb, var(--ink) 78%, var(--surface));
}
:root[data-accent='ink'][data-theme='dark'] {
  --accSoft: color-mix(in srgb, var(--ink) 12%, var(--surface));
  --accSoft2: color-mix(in srgb, var(--ink) 8%, var(--surface));
  --accSoft3: color-mix(in srgb, var(--ink) 16%, var(--surface));
  --accSoft4: color-mix(in srgb, var(--ink) 22%, var(--surface));
  --accLine: color-mix(in srgb, var(--ink) 30%, var(--surface));
}
:root[data-accent='custom'][data-theme='dark'],
[data-accent='custom'] [data-theme='dark'] {
  --accSoft: color-mix(in srgb, var(--acc) 22%, var(--surface));
  --accSoft2: color-mix(in srgb, var(--acc) 18%, var(--surface));
  --accSoft3: color-mix(in srgb, var(--acc) 28%, var(--surface));
  --accSoft4: color-mix(in srgb, var(--acc) 33%, var(--surface));
  --accLine: color-mix(in srgb, var(--acc) 45%, var(--surface));
  --accText: color-mix(in srgb, var(--acc) 45%, #ffffff);
}