/*
 * Cormass Design Tokens
 * Based on the Atlassian Design System (ADS) light theme.
 * This file defines all CSS custom properties globally so every page
 * (custom apps AND WordPress) can consume a single, consistent palette.
 *
 * Token naming follows ADS convention: --ds-<category>-<variant>
 */

/* ================================================================
   Font: Manrope (loaded locally by WordPress wp-fonts-local)
   No @font-face needed here; WP Twenty Twenty-Five provides the
   @font-face via wp-fonts-local on every page.
   ================================================================ */

:root {

  /* =============================================================
     FONT FAMILIES
     ============================================================= */
  --ds-font-family-sans: "Manrope", -apple-system, BlinkMacSystemFont,
    "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;
  --ds-font-family-monospace: "SFMono-Medium", "SF Mono", "Segoe UI Mono",
    "Roboto Mono", "Ubuntu Mono", Menlo, Consolas, Courier, monospace;
  --ds-font-family-heading: var(--ds-font-family-sans);
  --ds-font-family-body: var(--ds-font-family-sans);
  --ds-font-family-brand: "Charlie Display", "Manrope", -apple-system,
    BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;

  /* =============================================================
     TYPOGRAPHY -- shorthand tokens
     font: <weight> <size>/<line-height> <family>
     ============================================================= */
  --ds-font-heading-xxlarge: 500 2.1429rem / 2.2857rem var(--ds-font-family-heading);
  --ds-font-heading-xlarge:  600 1.7143rem / 2rem      var(--ds-font-family-heading);
  --ds-font-heading-large:   600 1.4286rem / 1.7143rem var(--ds-font-family-heading);
  --ds-font-heading-medium:  600 1.1429rem / 1.4286rem var(--ds-font-family-heading);
  --ds-font-heading-small:   600 1rem      / 1.1429rem var(--ds-font-family-heading);
  --ds-font-heading-xsmall:  600 0.8571rem / 1.1429rem var(--ds-font-family-heading);

  --ds-font-body-large: 400 1.1429rem / 1.4286rem var(--ds-font-family-body);
  --ds-font-body:       400 1rem      / 1.4286rem var(--ds-font-family-body);
  --ds-font-body-small: 400 0.8571rem / 1.1429rem var(--ds-font-family-body);

  --ds-font-code: 400 0.875em / 1.4286rem var(--ds-font-family-monospace);

  /* Individual typography primitives */
  --ds-font-size-050: 0.6875rem;   /* 11px */
  --ds-font-size-075: 0.75rem;     /* 12px */
  --ds-font-size-100: 0.875rem;    /* 14px -- ADS base */
  --ds-font-size-200: 1rem;        /* 16px */
  --ds-font-size-300: 1.25rem;     /* 20px */
  --ds-font-size-400: 1.5rem;      /* 24px */
  --ds-font-size-500: 1.8125rem;   /* 29px */
  --ds-font-size-600: 2.1875rem;   /* 35px */

  --ds-font-weight-regular: 400;
  --ds-font-weight-medium:  500;
  --ds-font-weight-semibold: 600;
  --ds-font-weight-bold:    700;

  --ds-font-lineHeight-100: 1rem;
  --ds-font-lineHeight-200: 1.25rem;
  --ds-font-lineHeight-300: 1.5rem;
  --ds-font-lineHeight-400: 1.75rem;
  --ds-font-lineHeight-500: 2rem;
  --ds-font-lineHeight-600: 2.5rem;

  /* =============================================================
     SPACING (8-point grid, rem-based)
     ============================================================= */
  --ds-space-0:    0;
  --ds-space-025:  0.125rem;  /* 2px  */
  --ds-space-050:  0.25rem;   /* 4px  */
  --ds-space-075:  0.375rem;  /* 6px  */
  --ds-space-100:  0.5rem;    /* 8px  */
  --ds-space-150:  0.75rem;   /* 12px */
  --ds-space-200:  1rem;      /* 16px */
  --ds-space-250:  1.25rem;   /* 20px */
  --ds-space-300:  1.5rem;    /* 24px */
  --ds-space-400:  2rem;      /* 32px */
  --ds-space-500:  2.5rem;    /* 40px */
  --ds-space-600:  3rem;      /* 48px */
  --ds-space-800:  4rem;      /* 64px */
  --ds-space-1000: 5rem;      /* 80px */

  /* =============================================================
     BORDER RADIUS
     ============================================================= */
  --ds-radius-050: 0.125rem;  /* 2px  */
  --ds-radius-100: 0.1875rem; /* 3px  */
  --ds-radius-200: 0.5rem;    /* 8px  */
  --ds-radius-300: 0.75rem;   /* 12px */
  --ds-radius-400: 1rem;      /* 16px */
  --ds-radius-round: 50%;

  /* =============================================================
     TEXT COLORS
     ============================================================= */
  --ds-text:                   #172B4D;
  --ds-text-subtle:            #44546F;
  --ds-text-subtlest:          #626F86;
  --ds-text-inverse:           #FFFFFF;
  --ds-text-disabled:          #091E424F;
  --ds-text-brand:             #0c66e4;
  --ds-text-selected:          #0c66e4;
  --ds-text-danger:            #AE2E24;
  --ds-text-warning:           #A54800;
  --ds-text-warning-inverse:   #172B4D;
  --ds-text-success:           #216E4E;
  --ds-text-discovery:         #6E5DC6;
  --ds-text-information:       #0055CC;

  /* =============================================================
     LINK COLORS
     ============================================================= */
  --ds-link:                   #0c66e4;
  --ds-link-pressed:           #0055CC;
  --ds-link-visited:           #6E5DC6;
  --ds-link-visited-pressed:   #5A4FB5;

  /* =============================================================
     ICON COLORS
     ============================================================= */
  --ds-icon:                   #44546F;
  --ds-icon-subtle:            #626F86;
  --ds-icon-inverse:           #FFFFFF;
  --ds-icon-disabled:          #091E424F;
  --ds-icon-brand:             #0c66e4;
  --ds-icon-selected:          #0c66e4;
  --ds-icon-danger:            #C9372C;
  --ds-icon-warning:           #D97008;
  --ds-icon-warning-inverse:   #172B4D;
  --ds-icon-success:           #22A06B;
  --ds-icon-discovery:         #8270DB;
  --ds-icon-information:       #1D7AFC;

  /* =============================================================
     BORDER COLORS
     ============================================================= */
  --ds-border:                 #091E4224;
  --ds-border-bold:            #758195;
  --ds-border-inverse:         #FFFFFF;
  --ds-border-focused:         #388BFF;
  --ds-border-input:           #091E4224;
  --ds-border-disabled:        #091E420F;
  --ds-border-brand:           #0c66e4;
  --ds-border-selected:        #0c66e4;
  --ds-border-danger:          #E34935;
  --ds-border-warning:         #D97008;
  --ds-border-success:         #22A06B;
  --ds-border-discovery:       #8270DB;
  --ds-border-information:     #1D7AFC;

  /* =============================================================
     BACKGROUND COLORS
     ============================================================= */
  /* Neutral */
  --ds-background-neutral-default:       #091E420F;
  --ds-background-neutral-hovered:       #091E4224;
  --ds-background-neutral-pressed:       #091E424F;
  --ds-background-neutral-subtle-default:  transparent;
  --ds-background-neutral-subtle-hovered:  #091E420F;
  --ds-background-neutral-subtle-pressed:  #091E4224;
  --ds-background-neutral-bold-default:    #44546F;
  --ds-background-neutral-bold-hovered:    #2C3E5D;
  --ds-background-neutral-bold-pressed:    #172B4D;

  /* Brand */
  --ds-background-brand-default:   #0c66e4;
  --ds-background-brand-hovered:   #0055CC;
  --ds-background-brand-pressed:   #09326C;
  --ds-background-brand-subtlest-default: #E9F2FF;
  --ds-background-brand-subtlest-hovered: #CCE0FF;
  --ds-background-brand-subtlest-pressed: #85B8FF;
  --ds-background-brand-bold-default:     #0c66e4;
  --ds-background-brand-bold-hovered:     #0055CC;
  --ds-background-brand-bold-pressed:     #09326C;

  /* Selected */
  --ds-background-selected-default:   #E9F2FF;
  --ds-background-selected-hovered:   #CCE0FF;
  --ds-background-selected-pressed:   #85B8FF;
  --ds-background-selected-bold-default:  #0c66e4;
  --ds-background-selected-bold-hovered:  #0055CC;
  --ds-background-selected-bold-pressed:  #09326C;

  /* Danger */
  --ds-background-danger-default:   #FFECEB;
  --ds-background-danger-hovered:   #FFD5D2;
  --ds-background-danger-pressed:   #FD9891;
  --ds-background-danger-bold-default:  #C9372C;
  --ds-background-danger-bold-hovered:  #AE2E24;
  --ds-background-danger-bold-pressed:  #5D1F1A;

  /* Warning */
  --ds-background-warning-default:   #FFF7D6;
  --ds-background-warning-hovered:   #F5CD47;
  --ds-background-warning-pressed:   #E2B203;
  --ds-background-warning-bold-default:  #E2B203;
  --ds-background-warning-bold-hovered:  #CF9F02;
  --ds-background-warning-bold-pressed:  #B38600;

  /* Success */
  --ds-background-success-default:   #DCFFF1;
  --ds-background-success-hovered:   #BAF3DB;
  --ds-background-success-pressed:   #7EE2B8;
  --ds-background-success-bold-default:  #1F845A;
  --ds-background-success-bold-hovered:  #216E4E;
  --ds-background-success-bold-pressed:  #164B35;

  /* Discovery */
  --ds-background-discovery-default:   #F3F0FF;
  --ds-background-discovery-hovered:   #DFD8FD;
  --ds-background-discovery-pressed:   #B8ACF6;
  --ds-background-discovery-bold-default:  #6E5DC6;
  --ds-background-discovery-bold-hovered:  #5A4FB5;
  --ds-background-discovery-bold-pressed:  #352C63;

  /* Information */
  --ds-background-information-default:   #E9F2FF;
  --ds-background-information-hovered:   #CCE0FF;
  --ds-background-information-pressed:   #85B8FF;
  --ds-background-information-bold-default:  #0c66e4;
  --ds-background-information-bold-hovered:  #0055CC;
  --ds-background-information-bold-pressed:  #09326C;

  /* Input */
  --ds-background-input-default:   #FFFFFF;
  --ds-background-input-hovered:   #F7F8F9;
  --ds-background-input-pressed:   #FFFFFF;

  /* Disabled */
  --ds-background-disabled:        #091E420F;

  /* =============================================================
     BLANKET / OVERLAY
     ============================================================= */
  --ds-blanket:                #091E427A;
  --ds-blanket-selected:       #388BFF14;
  --ds-blanket-danger:         #EF5C4814;

  /* =============================================================
     INTERACTION
     ============================================================= */
  --ds-interaction-hovered:    #091E420F;

  /* =============================================================
     SKELETON (loading states)
     ============================================================= */
  --ds-skeleton:               #091E420F;
  --ds-skeleton-subtle:        #091E4208;

  /* =============================================================
     SURFACE & ELEVATION
     ============================================================= */
  --ds-surface:                #FFFFFF;
  --ds-surface-hovered:        #F1F2F4;
  --ds-surface-pressed:        #DCDFE4;
  --ds-surface-overlay:        #FFFFFF;
  --ds-surface-raised:         #FFFFFF;
  --ds-surface-sunken:         #F7F8F9;

  /* =============================================================
     SHADOWS (elevation hierarchy)
     ============================================================= */
  --ds-shadow-raised:     0px 1px 1px #091E4240, 0px 0px 1px #091E424F;
  --ds-shadow-overlay:    0px 8px 12px #091E4226, 0px 0px 1px #091E424F;
  --ds-shadow-overflow:   0px 0px 8px #091E4224, 0px 2px 1px #091E421F;
  --ds-shadow-overflow-spread: #091E4224;
  --ds-shadow-overflow-perimeter: #091E421F;

  /* =============================================================
     OPACITY
     ============================================================= */
  --ds-opacity-loading:   0.2;
  --ds-opacity-disabled:  0.4;

  /* =============================================================
     CHART PALETTE (for data visualizations)
     ============================================================= */
  --ds-chart-brand:         #1D7AFC;
  --ds-chart-brand-hovered: #0c66e4;
  --ds-chart-neutral:       #8590A2;
  --ds-chart-neutral-hovered: #758195;
  --ds-chart-success:       #22A06B;
  --ds-chart-success-hovered: #1F845A;
  --ds-chart-danger:        #E34935;
  --ds-chart-danger-hovered: #C9372C;
  --ds-chart-warning:       #D97008;
  --ds-chart-warning-hovered: #B65C02;
  --ds-chart-information:   #1D7AFC;
  --ds-chart-information-hovered: #0c66e4;
  --ds-chart-discovery:     #8270DB;
  --ds-chart-discovery-hovered: #6E5DC6;

  --ds-chart-categorical-1: #1D7AFC;
  --ds-chart-categorical-2: #6E5DC6;
  --ds-chart-categorical-3: #E56910;
  --ds-chart-categorical-4: #2898BD;
  --ds-chart-categorical-5: #E34935;
  --ds-chart-categorical-6: #1F845A;
  --ds-chart-categorical-7: #8F7EE7;
  --ds-chart-categorical-8: #50253F;

  /* =============================================================
     CONVENIENCE ALIASES (bridge old --var to new --ds-var)
     These let existing code keep working while we migrate.
     ============================================================= */
  --bg:      var(--ds-surface);
  --text:    var(--ds-text);
  --muted:   var(--ds-text-subtlest);
  --line:    var(--ds-border);
  --panel:   var(--ds-surface-sunken);
  --blue:    var(--ds-link);
  --blue-600: var(--ds-link-pressed);
  --shadow:  var(--ds-shadow-raised);
  --radius:  var(--ds-radius-300);

  --s1: var(--ds-space-050);
  --s2: var(--ds-space-100);
  --s3: var(--ds-space-150);
  --s4: var(--ds-space-200);
  --s5: var(--ds-space-300);
  --s6: var(--ds-space-400);

  /* Auth-specific aliases */
  --gh-bg:      var(--ds-background-brand-default);
  --gh-text:    var(--ds-text);
  --gh-muted:   var(--ds-text-subtlest);
  --gh-panel:   var(--ds-surface);
  --gh-line:    var(--ds-border);
  --gh-radius:  var(--ds-radius-300);
  --gh-shadow:  var(--ds-shadow-overlay);
}

/* =================================================================
   BASE RESET -- applied globally
   ================================================================= */
html {
  font-size: 14px; /* ADS base unit is 14px (1rem = 14px) */
}

body {
  font-family: var(--ds-font-family-sans);
  color: var(--ds-text);
  line-height: 1.4286;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

a {
  color: var(--ds-link);
  text-decoration: none;
}

a:hover {
  color: var(--ds-link-pressed);
  text-decoration: underline;
}

a:visited {
  color: var(--ds-link-visited);
}