/*
 * Sovereign Series token bridge.
 * Canonical tokens live in /branding/tokens.css; aliases below keep older
 * SECINTEL styles working without forking the token source.
 */
@import url("/branding/tokens.css");

:root {
  --font-sans: var(--font-body);
  --font-heading: var(--font-display);
  --font-size-xs: var(--text-xs);
  --font-size-sm: var(--text-sm);
  --font-size-base: var(--text-base);
  --font-size-lg: var(--text-lg);
  --font-size-xl: var(--text-xl);
  --font-size-2xl: var(--text-2xl);
  --font-size-3xl: var(--text-3xl);
  --font-size-4xl: var(--text-4xl);
  --font-weight-normal: var(--weight-normal);
  --font-weight-medium: var(--weight-medium);
  --font-weight-semibold: var(--weight-semibold);
  --font-weight-bold: var(--weight-bold);
  --font-weight-light: var(--weight-normal);
  --line-height-tight: 1.25;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.75;
  --space-0: 0;
  --space-10: var(--space-8);
  --space-12: calc(var(--space-8) + var(--space-6));
  --radius-none: 0;

  --cerise-red: var(--dv8-red);
  --coal-black: var(--dv8-black);
  --snow-white: var(--dv8-white);
  --cool-grey: var(--dv8-grey);
  --dv8-red-500: var(--dv8-red);
  --dv8-red-subtle: color-mix(in srgb, var(--dv8-red), transparent 65%);
  --success-light: color-mix(in srgb, var(--success), white 16%);
  --success-dark: color-mix(in srgb, var(--success), var(--dv8-black) 18%);
  --info-light: color-mix(in srgb, var(--info), white 16%);
  --info-dark: color-mix(in srgb, var(--info), var(--dv8-black) 18%);
  --warning-light: color-mix(in srgb, var(--warning), white 16%);
  --warning-dark: color-mix(in srgb, var(--warning), var(--dv8-black) 18%);
  --danger-light: color-mix(in srgb, var(--danger), white 16%);
  --danger-dark: color-mix(in srgb, var(--danger), var(--dv8-black) 18%);
  --status-bg-success: color-mix(in srgb, var(--success), transparent 92%);
  --status-bg-warning: color-mix(in srgb, var(--warning), transparent 92%);
  --status-bg-danger: color-mix(in srgb, var(--danger), transparent 92%);
  --status-bg-info: color-mix(in srgb, var(--info), transparent 92%);
  --surface-overlay: color-mix(in srgb, var(--surface-elevated), transparent 5%);
  --surface-muted: var(--surface-bg);
  --text-primary: var(--text);
  --text-disabled: color-mix(in srgb, var(--text-tertiary), transparent 24%);
  --border-subtle: color-mix(in srgb, var(--border), transparent 48%);
  --focus-ring-offset: var(--page-bg);
  --shadow-sm: var(--shadow-card);
  --shadow-md: var(--shadow-elevated);
  --shadow-lg: var(--shadow-xl);
  --shadow-focus: 0 0 0 3px var(--focus-ring);
  --glass-bg: color-mix(in srgb, var(--surface-elevated), transparent 18%);
  --glass-border: color-mix(in srgb, var(--border), transparent 55%);
  --glass-shadow: var(--shadow-elevated);
  --glass-backdrop: blur(12px);
  --glass-opacity-light: 0.1;
  --glass-opacity-medium: 0.12;
  --glass-opacity-strong: 0.14;
  --glass-weak: color-mix(in srgb, var(--dv8-grey), transparent 92%);
  --glass-strong: color-mix(in srgb, var(--dv8-grey), transparent 86%);
  --z-base: 0;
  --z-dropdown: 1000;
  --z-sticky: 1020;
  --z-fixed: 1030;
  --z-modal-backdrop: 1040;
  --z-modal: 1050;
  --z-popover: 1060;
  --z-tooltip: 1070;
  --touch-target-min: var(--touch-min);
  --brand-600: var(--dv8-red);
  --brand-700: var(--dv8-red-hover);
  --accent-500: var(--dv8-red);
  --bg-000: var(--page-bg);
  --bg-950: var(--quantum-navy-950);
  --font-family-primary: var(--font-body);

  --bua-brand-primary: var(--dv8-red);
  --bua-brand-primary-dark: var(--dv8-red-hover);
  --bua-brand-primary-darker: color-mix(in srgb, var(--dv8-red-hover), var(--dv8-black) 18%);
  --bua-brand-primary-light: color-mix(in srgb, var(--dv8-red-light), transparent 72%);
  --bua-brand-primary-lighter: color-mix(in srgb, var(--dv8-red-light), transparent 86%);
  --bua-brand-coal-black: var(--dv8-black);
  --bua-brand-white: var(--dv8-white);
  --bua-brand-deep-charcoal: var(--quantum-navy-900);
  --bua-neutral-50: var(--surface-bg);
  --bua-neutral-100: var(--surface-elevated);
  --bua-neutral-200: var(--border);
  --bua-neutral-300: var(--border-strong);
  --bua-neutral-400: var(--text-tertiary);
  --bua-neutral-500: var(--text-tertiary);
  --bua-neutral-600: var(--text-secondary);
  --bua-neutral-700: color-mix(in srgb, var(--text), transparent 20%);
  --bua-neutral-800: var(--text);
  --bua-neutral-900: var(--quantum-navy-950);
  --bua-page-bg: var(--page-bg);
  --bua-frame-bg: var(--surface-bg);
  --bua-surface-bg: var(--surface-elevated);
  --bua-text-primary: var(--text);
  --bua-text-secondary: var(--text-secondary);
  --bua-text-tertiary: var(--text-tertiary);
  --bua-text-muted: var(--text-tertiary);
  --bua-text-disabled: var(--text-disabled);
  --bua-text-inverse: var(--text-inverse);
  --bua-border-primary: var(--border);
  --bua-border-secondary: var(--border-subtle);
  --bua-border-focus: var(--dv8-red);
  --bua-input-bg: var(--surface-elevated);
  --bua-input-border: var(--border);
  --bua-input-border-hover: var(--border-strong);
  --bua-input-border-focus: var(--dv8-red);
  --bua-input-text: var(--text);
  --bua-input-placeholder: var(--text-tertiary);
  --bua-accent-primary: var(--dv8-red);
  --bua-accent-primary-hover: var(--dv8-red-hover);
  --bua-accent-primary-active: color-mix(in srgb, var(--dv8-red-hover), var(--dv8-black) 18%);
  --bua-hover-overlay: color-mix(in srgb, var(--text), transparent 96%);
  --bua-active-overlay: color-mix(in srgb, var(--text), transparent 92%);
  --bua-disabled-overlay: color-mix(in srgb, var(--text), transparent 88%);
  --bua-card-bg: var(--surface-elevated);
  --bua-card-border: var(--border);
  --bua-card-shadow: var(--shadow-card);
  --bua-header-bg: var(--surface-bg);
  --bua-header-border: var(--border);
  --bua-footer-bg: var(--surface-bg);
  --bua-footer-border: var(--dv8-red);
  --bua-overlay-bg: color-mix(in srgb, var(--dv8-black), transparent 50%);
  --bua-modal-bg: var(--surface-elevated);
  --bua-success: var(--success);
  --bua-success-light: var(--success-light);
  --bua-warning: var(--warning);
  --bua-warning-light: var(--warning-light);
  --bua-danger: var(--danger);
  --bua-danger-light: var(--danger-light);
  --bua-info: var(--info);
  --bua-info-light: var(--info-light);
  --bua-status-success: var(--success);
  --bua-status-success-bg: var(--status-bg-success);
  --bua-status-warning: var(--warning);
  --bua-status-warning-bg: var(--status-bg-warning);
  --bua-status-danger: var(--danger);
  --bua-status-danger-bg: var(--status-bg-danger);
  --bua-status-info: var(--info);
  --bua-status-info-bg: var(--status-bg-info);
  --bua-shadow-sm: var(--shadow-sm);
  --bua-shadow-md: var(--shadow-md);
  --bua-shadow-lg: var(--shadow-lg);
  --bua-radius-sm: var(--radius-sm);
  --bua-radius-md: var(--radius-md);
  --bua-radius-lg: var(--radius-lg);
  --bua-transition-fast: var(--transition-fast);
  --bua-transition-base: var(--transition-base);
  --bua-ease-out: cubic-bezier(.4, 0, .2, 1);
  --bua-font-heading: var(--font-display);
  --bua-font-body: var(--font-body);
  --bua-font-weight-light: var(--weight-normal);
  --bua-font-weight-regular: var(--weight-normal);
  --bua-font-weight-medium: var(--weight-medium);
  --bua-font-weight-semibold: var(--weight-semibold);
  --bua-font-weight-bold: var(--weight-bold);
  --bua-z-sticky: var(--z-sticky);
  --bua-focus-ring-width: 3px;
  --bua-focus-ring-style: solid;
  --bua-focus-ring-offset: 2px;
  --bua-focus-ring-color: var(--focus-ring);
}

/*
 * ============================================================
 * SECINTEL legacy compatibility (folded from the retired
 * css/tokens-compat.css so this file is the ONE token bridge).
 * Every alias below resolves to a canonical token in
 * /branding/tokens.css. Do not add divergent literal values.
 * ============================================================
 */
:root {
  /* Legacy heading font alias (plural spelling used by older component CSS) */
  --font-headings: var(--font-display);

  /* Legacy brand + accent aliases */
  --brand-500: var(--dv8-red-light);
  --accent-600: var(--dv8-red-hover);
  --dv8-red-500: var(--dv8-red);

  /* Legacy surface / background aliases */
  --surface: var(--surface-bg);
  --bg-050: var(--surface-elevated);
  --surface-overlay: color-mix(in srgb, var(--surface-elevated), transparent 5%);

  /* Legacy ink (text) ramp */
  --ink-900: var(--text);
  --ink-800: var(--text);
  --ink-700: var(--text-secondary);
  --ink-600: var(--text-secondary);
  --ink-500: var(--text-tertiary);
  --ink-400: var(--text-tertiary);
  --ink-300: var(--text-tertiary);

  /* Legacy semantic 500 ramp */
  --success-500: var(--success);
  --info-500: var(--info);
  --warning-500: var(--warning);
  --danger-500: var(--danger);
  --success-700: var(--success-dark);
  --warning-700: var(--warning-dark);
  --danger-700: var(--danger-dark);
  --info-700: var(--info-dark);

  /* Legacy semantic color aliases */
  --color-bg: var(--page-bg);
  --color-surface: var(--surface-bg);
  --color-text: var(--text);
  --color-muted: var(--text-secondary);
  --color-primary: var(--dv8-red);
  --color-primary-600: var(--dv8-red-hover);
  --color-primary-hover: var(--dv8-red-hover);
  --color-primary-active: var(--dv8-red-hover);
  --color-success: var(--success);
  --color-warning: var(--warning);
  --color-danger: var(--danger);
  --color-info: var(--info);

  /* Legacy named spacing (t-shirt sizes) */
  --space-xs: var(--space-1);
  --space-sm: var(--space-2);
  --space-md: var(--space-3);
  --space-lg: var(--space-4);
  --space-xl: var(--space-5);
  --space-2xl: var(--space-6);
  --space-3xl: var(--space-7);
  --spacing-1: var(--space-1);
  --spacing-2: var(--space-2);
  --spacing-3: var(--space-3);
  --spacing-4: var(--space-4);
  --spacing-5: var(--space-5);
  --spacing-6: var(--space-6);
  --spacing-7: var(--space-7);
  --spacing-8: var(--space-8);

  /* Legacy radius alias */
  --radius-xs: var(--radius-sm);

  /* Legacy shadow aliases */
  --shadow-elev: var(--shadow-elevated);
  --shadow-soft: var(--shadow-elevated);
  --shadow-focus: 0 0 0 3px var(--focus-ring);
  --shadow-focus-danger: 0 0 0 3px rgba(220, 38, 38, 0.4);
  --shadow-focus-success: 0 0 0 3px rgba(22, 163, 74, 0.4);

  /* Legacy motion aliases */
  --motion-fast: var(--transition-fast);
  --motion-medium: var(--transition-base);
  --motion-slow: var(--transition-base);
  --motion-easing: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-default: cubic-bezier(0.4, 0, 0.2, 1);

  /* Legacy accessibility / touch aliases */
  --touch-target: var(--touch-min);
  --touch-target-min: var(--touch-min);
  --min-touch-target: var(--touch-comfortable);
  --focus-offset: 3px;
  --focus-ring-width: 2px;
  --focus-ring-offset: 2px;
  --focus-ring-color: var(--focus-ring);
  --focus-ring-color-invert: var(--text-inverse);
  --disabled-opacity: 0.5;
  --disabled-cursor: not-allowed;

  /* Legacy border aliases */
  --border-color: var(--border);
  --border-light: var(--border-subtle);
}

[data-theme="dark"] {
  --surface-overlay: rgba(15, 23, 36, 0.95);
  --bg-000: var(--page-bg);
  --bg-050: var(--surface-elevated);
  --bg-950: var(--surface-bg);
}
