/*
 * Nexus Edge — Frontend Theme Tokens V1
 * Exclusive to frontend authenticated pages.
 */

:root,
html[data-fe-theme="light"] {
    color-scheme: light;

    --fe-page: #e6e7ee;
    --fe-page-soft: #edf0f5;
    --fe-surface: #e6e7ee;
    --fe-surface-raised: #eef1f6;
    --fe-surface-recessed: #dfe3eb;
    --fe-surface-inset: var(--fe-surface-recessed);
    --fe-surface-strong: #f3f5f9;

    --fe-text: #31344b;
    --fe-text-soft: #44476a;
    --fe-text-muted: #66708b;
    --fe-text-faint: #8a93aa;

    --fe-border: rgba(75, 87, 120, .14);
    --fe-border-strong: rgba(49, 95, 174, .22);

    --fe-primary: #315fae;
    --fe-primary-hover: #244f9b;
    --fe-primary-soft: rgba(49, 95, 174, .10);
    --fe-accent: #357f95;

    --fe-success: #18634b;
    --fe-success-soft: rgba(24, 99, 75, .11);
    --fe-warning: #9a6c00;
    --fe-warning-soft: rgba(154, 108, 0, .12);
    --fe-danger: #a91e2c;
    --fe-danger-soft: rgba(169, 30, 44, .10);
    --fe-neutral-soft: rgba(68, 71, 106, .10);

    --fe-shadow-raised:
        10px 10px 22px rgba(163, 177, 198, .48),
        -10px -10px 22px rgba(255, 255, 255, .88);
    --fe-shadow-soft:
        6px 6px 14px rgba(163, 177, 198, .34),
        -6px -6px 14px rgba(255, 255, 255, .82);
    --fe-shadow-inset:
        inset 4px 4px 10px rgba(163, 177, 198, .36),
        inset -4px -4px 10px rgba(255, 255, 255, .84);
    --fe-shadow-pressed:
        inset 5px 5px 11px rgba(163, 177, 198, .42),
        inset -5px -5px 11px rgba(255, 255, 255, .78);

    --fe-focus: 0 0 0 3px rgba(49, 95, 174, .16);

    --fe-radius-sm: 10px;
    --fe-radius-md: 16px;
    --fe-radius-lg: 22px;
    --fe-radius-xl: 28px;
    --fe-radius-pill: 999px;

    --fe-space-1: 4px;
    --fe-space-2: 8px;
    --fe-space-3: 12px;
    --fe-space-4: 16px;
    --fe-space-5: 24px;
    --fe-space-6: 32px;
    --fe-space-7: 40px;

    --fe-sidebar-width: 286px;
    --fe-sidebar-collapsed-width: 84px;
    --fe-page-max: 1720px;
    --fe-control-height: 42px;

    /* White-label accents must not replace structural tokens. */
    --fe-brand-primary: var(--nx-brand-primary, var(--fe-primary));
    --fe-brand-secondary: var(--nx-brand-secondary, var(--fe-accent));
}

html[data-fe-theme="dark"] {
    color-scheme: dark;

    --fe-page: #171a20;
    --fe-page-soft: #1c2027;
    --fe-surface: #20242b;
    --fe-surface-raised: #272c34;
    --fe-surface-recessed: #191d23;
    --fe-surface-inset: var(--fe-surface-recessed);
    --fe-surface-strong: #2b3039;

    --fe-text: #f0f3f8;
    --fe-text-soft: #d3d8e1;
    --fe-text-muted: #9ba5b6;
    --fe-text-faint: #747f91;

    --fe-border: rgba(255, 255, 255, .07);
    --fe-border-strong: rgba(99, 154, 255, .28);

    --fe-primary: #79a8ff;
    --fe-primary-hover: #98bcff;
    --fe-primary-soft: rgba(121, 168, 255, .14);
    --fe-accent: #67d8ea;

    --fe-success: #55d5a6;
    --fe-success-soft: rgba(85, 213, 166, .13);
    --fe-warning: #f0be58;
    --fe-warning-soft: rgba(240, 190, 88, .13);
    --fe-danger: #ff7c91;
    --fe-danger-soft: rgba(255, 124, 145, .13);
    --fe-neutral-soft: rgba(255, 255, 255, .07);

    --fe-shadow-raised:
        12px 12px 26px rgba(0, 0, 0, .48),
        -8px -8px 22px rgba(255, 255, 255, .025);
    --fe-shadow-soft:
        7px 7px 18px rgba(0, 0, 0, .34),
        -5px -5px 14px rgba(255, 255, 255, .02);
    --fe-shadow-inset:
        inset 5px 5px 12px rgba(0, 0, 0, .42),
        inset -4px -4px 10px rgba(255, 255, 255, .025);
    --fe-shadow-pressed:
        inset 6px 6px 14px rgba(0, 0, 0, .50),
        inset -5px -5px 12px rgba(255, 255, 255, .02);

    --fe-focus: 0 0 0 3px rgba(121, 168, 255, .24);
}