/* Aiden Design System v0.2 semantic tokens (hex-resolved) + fonts.
   Source of truth: aiden-design-system/tokens/*.json — update manually on DS release. */

@font-face {
    font-family: "Amberes Grotesk";
    src: url("../aiden/fonts/Amberes-Grotesk.otf") format("opentype");
    font-display: swap;
}

@font-face {
    font-family: "Ubuntu";
    src: url("../aiden/fonts/Ubuntu-Light.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Ubuntu";
    src: url("../aiden/fonts/Ubuntu-LightItalic.ttf") format("truetype");
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Ubuntu";
    src: url("../aiden/fonts/Ubuntu-Regular.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Ubuntu";
    src: url("../aiden/fonts/Ubuntu-Italic.ttf") format("truetype");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Ubuntu";
    src: url("../aiden/fonts/Ubuntu-Medium.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Ubuntu";
    src: url("../aiden/fonts/Ubuntu-MediumItalic.ttf") format("truetype");
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Ubuntu";
    src: url("../aiden/fonts/Ubuntu-Bold.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Ubuntu";
    src: url("../aiden/fonts/Ubuntu-BoldItalic.ttf") format("truetype");
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

:root {
    /* Brand primitives */
    --aiden-limelight: #BFD730;
    --aiden-limelight-hover: #C9DD4F;
    --aiden-sapphire: #1010DB;
    --aiden-sapphire-hover: #0E0EBA;
    --aiden-royal: #3C5279;
    --aiden-warm-black: #32363D;
    --aiden-cool-grey: #D3DAE1;
    --aiden-off-white: #FFFFFF;
    --aiden-whatsapp-green: #25D366;
    --aiden-success: var(--aiden-color-status-success);
    --aiden-danger: #B42318;
    --aiden-warning: #B54708;
    --aiden-neutral-0: #FFFFFF;

    /* Semantic — light */
    --aiden-color-text-primary: var(--aiden-warm-black);
    --aiden-color-text-secondary: var(--aiden-royal);
    --aiden-color-text-disabled: var(--aiden-cool-grey);
    --aiden-color-text-on-action: var(--aiden-warm-black);
    --aiden-color-text-on-dark: var(--aiden-neutral-0);
    --aiden-color-text-link: var(--aiden-royal);
    --aiden-color-text-link-hover: var(--aiden-sapphire-hover);
    --aiden-color-text-link-inverse: var(--aiden-limelight);
    --aiden-color-text-link-inverse-hover: var(--aiden-limelight-hover);

    --aiden-color-surface-canvas: var(--aiden-off-white);
    --aiden-color-surface-default: var(--aiden-neutral-0);
    --aiden-color-surface-inverse: var(--aiden-warm-black);

    --aiden-color-border-default: var(--aiden-cool-grey);
    --aiden-color-border-focus: var(--aiden-royal);

    --aiden-color-action-primary: var(--aiden-limelight);
    --aiden-color-action-primary-hover: var(--aiden-limelight-hover);
    --aiden-color-action-secondary: var(--aiden-royal);
    --aiden-color-action-danger: var(--aiden-danger);

    --aiden-color-status-success: var(--aiden-whatsapp-green);
    --aiden-color-status-warning: var(--aiden-warning);
    --aiden-color-status-danger: var(--aiden-danger);
    --aiden-color-status-info: var(--aiden-royal);

    /* Link primitives */
    --aiden-link: var(--aiden-color-text-link);
    --aiden-link-hover: var(--aiden-color-text-link-hover);
    --aiden-link-inverse: var(--aiden-color-text-link-inverse);
    --aiden-link-inverse-hover: var(--aiden-color-text-link-inverse-hover);

    /* Space scale */
    --aiden-space-1: 4px;
    --aiden-space-2: 8px;
    --aiden-space-3: 12px;
    --aiden-space-4: 16px;
    --aiden-space-5: 24px;
    --aiden-space-6: 32px;
    --aiden-space-7: 48px;
    --aiden-space-8: 64px;
    --aiden-space-control-gap: var(--aiden-space-2);
    --aiden-space-section-gap: var(--aiden-space-6);
    --aiden-space-page-gutter: var(--aiden-space-5);

    /* Radius */
    --aiden-radius-sm: 4px;
    --aiden-radius-md: 8px;
    --aiden-radius-lg: 12px;
    --aiden-radius-full: 9999px;

    /* Elevation */
    --aiden-elevation-resting: 0 1px 2px rgba(60, 82, 121, 0.06);
    --aiden-elevation-raised: 0 2px 8px rgba(60, 82, 121, 0.08);

    /* Layout */
    --aiden-layout-content-max-width: 1440px;
    --aiden-layout-breakpoint-compact: 768px;

    /* Font stacks */
    --aiden-font-display: "Amberes Grotesk", Ubuntu, Arial, sans-serif;
    --aiden-font-body: Ubuntu, Arial, sans-serif;

    /* Component tokens */
    --aiden-app-bar-background: var(--aiden-color-surface-default);
    --aiden-app-bar-text: var(--aiden-color-text-primary);
    --aiden-app-bar-border: var(--aiden-color-border-default);
    --aiden-app-bar-shadow: var(--aiden-elevation-resting);

    --aiden-app-shell-background: var(--aiden-color-surface-canvas);
    --aiden-app-shell-surface: var(--aiden-color-surface-default);
    --aiden-app-shell-border: var(--aiden-color-border-default);

    --aiden-env-pill-background: var(--aiden-color-action-primary);
    --aiden-env-pill-text: var(--aiden-color-text-on-action);
    --aiden-env-pill-border: var(--aiden-color-action-primary-hover);
    --aiden-env-pill-radius: var(--aiden-radius-full);

    --aiden-user-widget-background: var(--aiden-color-surface-default);
    --aiden-user-widget-text: var(--aiden-color-text-primary);
    --aiden-user-widget-border: var(--aiden-color-border-default);
    --aiden-user-widget-radius: var(--aiden-radius-md);

    --aiden-nav-section-label-color: var(--aiden-color-text-secondary);
    --aiden-nav-item-text: var(--aiden-color-text-secondary);
    --aiden-nav-item-background-hover: var(--aiden-color-surface-default);
    --aiden-nav-item-text-active: var(--aiden-color-text-on-action);
    --aiden-nav-item-background-active: var(--aiden-color-action-primary);
    --aiden-nav-item-radius: var(--aiden-radius-md);

    --aiden-tabs-background: var(--aiden-color-surface-default);
    --aiden-tabs-border: var(--aiden-color-border-default);
    --aiden-tabs-text: var(--aiden-color-text-secondary);
    --aiden-tabs-text-active: var(--aiden-color-text-primary);
    --aiden-tabs-indicator: var(--aiden-color-action-primary);

    --aiden-status-pill-ok-background: var(--aiden-color-status-success);
    --aiden-status-pill-ok-text: var(--aiden-color-text-on-dark);
    --aiden-status-pill-attention-background: var(--aiden-color-status-warning);
    --aiden-status-pill-attention-text: var(--aiden-color-text-on-dark);
    --aiden-status-pill-neutral-background: var(--aiden-color-status-info);
    --aiden-status-pill-neutral-text: var(--aiden-color-text-on-dark);
    --aiden-status-pill-radius: var(--aiden-radius-full);

    --aiden-metric-card-background: var(--aiden-color-surface-default);
    --aiden-metric-card-text: var(--aiden-color-text-primary);
    --aiden-metric-card-border: var(--aiden-color-border-default);
    --aiden-metric-card-shadow: var(--aiden-elevation-resting);
    --aiden-metric-card-radius: var(--aiden-radius-lg);

    --aiden-empty-state-background: var(--aiden-color-surface-default);
    --aiden-empty-state-text: var(--aiden-color-text-secondary);
    --aiden-empty-state-border: var(--aiden-color-border-default);
    --aiden-empty-state-radius: var(--aiden-radius-lg);

    --aiden-split-view-background: var(--aiden-color-surface-canvas);
    --aiden-split-view-panel-background: var(--aiden-color-surface-default);
    --aiden-split-view-divider: var(--aiden-color-border-default);

    --aiden-toolbar-background: var(--aiden-color-surface-default);
    --aiden-toolbar-text: var(--aiden-color-text-primary);
    --aiden-toolbar-border: var(--aiden-color-border-default);
    --aiden-toolbar-shadow: var(--aiden-elevation-resting);

    --aiden-link-default-color: var(--aiden-link);
    --aiden-link-default-color-hover: var(--aiden-link-hover);
    --aiden-link-inverse-color: var(--aiden-link-inverse);
    --aiden-link-inverse-color-hover: var(--aiden-link-inverse-hover);
    --aiden-link-underline-thickness: 2px;

    /* Derived product aliases used by integrator-theme.css */
    --int-ink: var(--aiden-color-text-primary);
    --int-ink-strong: var(--aiden-royal);
    --int-muted: color-mix(in srgb, var(--aiden-royal) 72%, var(--aiden-cool-grey));
    --int-line: var(--aiden-color-border-default);
    --int-line-strong: color-mix(in srgb, var(--aiden-royal) 28%, var(--aiden-cool-grey));
    --int-canvas: var(--aiden-color-surface-canvas);
    --int-surface: var(--aiden-color-surface-default);
    --int-primary: var(--aiden-royal);
    --int-primary-dark: color-mix(in srgb, var(--aiden-royal) 88%, #000);
    --int-primary-deeper: color-mix(in srgb, var(--aiden-royal) 72%, #000);
    --int-secondary: var(--aiden-limelight);
    --int-surface-shadow: 0 10px 30px rgba(50, 54, 61, 0.06);
    --int-surface-radius: var(--aiden-radius-lg);
    --int-control-radius: var(--aiden-radius-md);
    --int-sidebar-gradient: var(--aiden-royal);
    --int-focus-ring: color-mix(in srgb, var(--aiden-royal) 22%, transparent);
    --int-success-fg: #087944;
    --int-success-bg: color-mix(in srgb, var(--aiden-whatsapp-green) 22%, white);
    --int-success-bd: color-mix(in srgb, var(--aiden-whatsapp-green) 45%, white);
    --int-error-fg: var(--aiden-danger);
    --int-error-bg: #fde8e7;
    --int-error-bd: color-mix(in srgb, var(--aiden-danger) 28%, white);
    --int-info-fg: var(--aiden-royal);
    --int-info-bg: color-mix(in srgb, var(--aiden-royal) 10%, white);
    --int-info-bd: color-mix(in srgb, var(--aiden-royal) 28%, var(--aiden-cool-grey));
    --int-warning-fg: var(--aiden-warning);
    --int-warning-bg: color-mix(in srgb, var(--aiden-warning) 12%, white);
    --int-warning-bd: color-mix(in srgb, var(--aiden-warning) 32%, white);

    --code-bg: #f6f8fa;
    --code-border: #d0d7de;
    --code-border-soft: #e2e8f0;
    --code-text: #24292f;
    --code-muted: #6e7781;
    --code-placeholder: #8c959f;
    --code-accent: #0969da;
    --code-accent-strong: #0550ae;
    --code-caret: var(--aiden-royal);
    --code-focus: color-mix(in srgb, var(--aiden-royal) 22%, transparent);
    --code-wash: color-mix(in srgb, var(--aiden-royal) 12%, transparent);
    --tok-key: #cf222e;
    --tok-str: #0a7d42;
    --tok-num: #0550ae;
    --tok-bool: #8250df;
    --tok-punc: #6e7781;
    --tok-fn: #8250df;
    --tok-path: var(--aiden-royal);
    --tok-ident: #24292f;
    --tok-plain: #57606a;
    --integrator-topbar-height: 64px;
    --portal-topbar-height: 64px;
    --int-appbar-bg: rgba(255, 255, 255, 0.94);
}

/* Dark semantic overrides (aiden.dark.tokens.json + product chrome) */
.theme-dark-mode {
    /* Soft blue-grey ink on deep navy — avoid pure white glare */
    --aiden-color-text-primary: #d5dee8;
    --aiden-color-text-secondary: #a8b6c7;
    --aiden-color-text-disabled: #7f8fa3;
    --aiden-color-text-on-dark: #d5dee8;
    --aiden-color-text-link: var(--aiden-limelight);
    --aiden-color-text-link-hover: var(--aiden-limelight-hover);
    --aiden-color-text-link-inverse: var(--aiden-limelight);
    --aiden-color-text-link-inverse-hover: var(--aiden-limelight-hover);
    --aiden-color-surface-canvas: #141a24;
    --aiden-color-surface-default: #1c2533;
    --aiden-color-surface-inverse: #d5dee8;
    --aiden-color-border-default: color-mix(in srgb, var(--aiden-royal) 45%, #0e1420);
    --aiden-color-border-focus: var(--aiden-limelight);

    --int-ink: #d5dee8;
    --int-ink-strong: #e4ebf3;
    --int-muted: #a8b6c7;
    --int-line: var(--aiden-color-border-default);
    --int-line-strong: color-mix(in srgb, var(--aiden-cool-grey) 28%, #0e1420);
    --int-canvas: var(--aiden-color-surface-canvas);
    --int-surface: var(--aiden-color-surface-default);
    --int-surface-shadow: 0 12px 28px rgba(0, 0, 0, 0.32);
    --int-sidebar-gradient: #152033;
    --int-focus-ring: color-mix(in srgb, var(--aiden-limelight) 28%, transparent);
    --int-success-fg: #3dcb6c;
    --int-success-bg: rgba(37, 211, 102, 0.14);
    --int-success-bd: rgba(37, 211, 102, 0.35);
    --int-error-fg: #ff6b84;
    --int-error-bg: rgba(180, 35, 24, 0.18);
    --int-error-bd: rgba(180, 35, 24, 0.4);
    --int-info-fg: #9eb6d4;
    --int-info-bg: rgba(60, 82, 121, 0.28);
    --int-info-bd: rgba(60, 82, 121, 0.5);
    --int-warning-fg: #ffb545;
    --int-warning-bg: rgba(181, 71, 8, 0.2);
    --int-warning-bd: rgba(181, 71, 8, 0.4);
    --int-appbar-bg: #152033;
    --wba-chrome-bg: #152033;
    --wba-chrome-text: #d5dee8;
    --code-bg: #0b1220;
    --code-border: #334155;
    --code-border-soft: #1e293b;
    --code-text: #e2e8f0;
    --code-muted: #94a3b8;
    --code-placeholder: #64748b;
    --code-accent: #9eb6d4;
    --code-accent-strong: #c5d4e8;
    --code-caret: var(--aiden-limelight);
    --code-focus: color-mix(in srgb, var(--aiden-limelight) 22%, transparent);
    --code-wash: color-mix(in srgb, var(--aiden-royal) 18%, transparent);
    --tok-key: #7dd3fc;
    --tok-str: #86efac;
    --tok-num: #fbbf24;
    --tok-bool: #c4b5fd;
    --tok-punc: #94a3b8;
    --tok-fn: #d4a5c9;
    --tok-path: #38bdf8;
    --tok-ident: #e2e8f0;
    --tok-plain: #cbd5e1;
}