/* ========================================
 * SafeNow 테마 베이스 토큰
 * 계층: themes (테마 시스템 기초)
 * 모든 테마의 기본값 정의 (~55종)
 * 로드: head.jsp 전역 (가장 먼저 로드)
 * ======================================== */

:root {
  /* ── Brand (구) ──
  --sfn-primary: #696cff;
  --sfn-primary-hover: #5f61e6;
  --sfn-primary-active: #5456cc;
  --sfn-primary-subtle: #e6f0ff;
  --sfn-secondary: #8592a3;
  --sfn-accent: #03c3ec;
  --sfn-logo-filter: none;
  --sfn-brand-hue: 268;
  ── */

  /* ── Brand (신규) ── */
  --sfn-primary:       #0064DC;
  --sfn-primary-hover: #ECF2FA;
  --sfn-secondary-3:   #1D5996;  /* 쨍한 (진한 네이비) */
  --sfn-secondary-4:   #5F8DBC;  /* 중간 블루 */
  --sfn-secondary-5:   #BAC6D2;  /* 연한 블루그레이 */
  --sfn-secondary-6:   #EBEFF3;  /* 가장 연한 */

  /* ── Semantic (8종) ── */
  --sfn-success: #71dd37;
  --sfn-success-subtle: #e8fadb;
  --sfn-warning: #ffab00;
  --sfn-warning-subtle: #fff3cd;
  --sfn-danger: #ff3e1d;
  --sfn-danger-subtle: #ffe0db;
  --sfn-info: #03c3ec;
  --sfn-info-subtle: #d7f5fc;

  /* ── Status (업무 상태 색상) ── */
  --sfn-status-pending:          #9F9F9F;
  --sfn-status-pending-subtle:   #EDEDED;
  --sfn-status-progress:         #67A1CE;
  --sfn-status-progress-subtle:  #DDEDF8;
  --sfn-status-completed:        #6EBA72;
  --sfn-status-completed-subtle: #E7F5E8;
  --sfn-status-overdue:          #D45353;
  --sfn-status-overdue-subtle:   #FBE9E9;
  --sfn-status-rejected:         #DD982F;
  --sfn-status-rejected-subtle:  #FAF5E9;
  --sfn-status-signing:          #9086BE;
  --sfn-status-signing-subtle:   #E4E1F3;

  /* ── 신호등 색상 (이행현황 전용) ── */
  --sfn-signal-complete: #55C71E;
  --sfn-signal-progress: #FFAB0A;

  /* ── Surface (10종) ── */
  --sfn-bg-body: #f5f5f9;
  --sfn-bg-card: #ffffff;
  --sfn-bg-subtle: #f8f9fc;
  --sfn-bg-light: #f5f5f5;
  --sfn-bg-highlight: #e8f0fe;
  --sfn-bg-banner: #EBEFF3;
  --sfn-bg-input: #ffffff;
  --sfn-bg-hover: #f0f0f5;
  --sfn-bg-overlay: rgb(0 0 0 / 0.5);
  --sfn-bg-section: #fdfdfd;
  --sfn-shadow: rgb(161 172 184 / 0.45);

  /* ── Text (7종) ── */
  --sfn-text: #333333;           /* 기본 본문/검정 */
  --sfn-text-sub: #595959;           /* 검정 한단계 연한 (명암비 7:1) */
  --sfn-text-muted: #697a8d;     /* 보조 설명 (블루그레이) */
  --sfn-text-light: #a1acb8;     /* 연한 회색 */
  --sfn-text-on-primary: #ffffff; /* 유색 배경 위 */
  --sfn-text-link: #0064DC;      /* 링크 / 파란 강조 */
  --sfn-text-breadcrumb: var(--sfn-secondary-3); /* 브레드크럼 네이비 #1D5996 */

  /* ── Border (5종) ── */
  --sfn-border: #dddddd;
  --sfn-border-light: #e9ecef;
  --sfn-border-strong: #BAC6D2;
  --sfn-border-input: #d9dee3;
  --sfn-border-table: #d9dee3;
  --sfn-border-section: #e4e4e4;

  /* ── Action (2종) ── */
  --sfn-action: #0064dc;
  --sfn-action-hover: #0055b8;

  /* ── Blue Scale (구, 9종) ──
  --sfn-blue-900: #1D5996;
  --sfn-blue-700: #4e7ba8;
  --sfn-blue-600: #5F8DBC;
  --sfn-blue-500: #697a8d;
  --sfn-blue-400: #566a7f;
  --sfn-blue-300: #BAC6D2;
  --sfn-blue-200: #d9dee3;
  --sfn-blue-100: #EBEFF3;
  --sfn-blue-50: #e8f0fe;
  ── */

  /* ── Status Colors (구, 10종) ──
  --sfn-status-pending: #697a8d;
  --sfn-status-pending-subtle: rgba(105, 122, 141, 0.12);
  --sfn-status-progress: #FFAB0A;
  --sfn-status-progress-subtle: rgba(255, 171, 10, 0.12);
  --sfn-status-completed: #55C71E;
  --sfn-status-completed-subtle: rgba(85, 199, 30, 0.12);
  --sfn-status-overdue: #FF4D4D;
  --sfn-status-overdue-subtle: rgba(255, 77, 77, 0.12);
  --sfn-status-rejected: #7C5DC7;
  --sfn-status-rejected-subtle: rgba(124, 93, 199, 0.12);
  ── */

  /* ── Status Colors (신규, 10종) ── */
  --sfn-status-pending:          #9F9F9F;
  --sfn-status-pending-subtle:   #EDEDED;
  --sfn-status-progress:         #67A1CE;
  --sfn-status-progress-subtle:  #DDEDF8;
  --sfn-status-completed:        #6EBA72;
  --sfn-status-completed-subtle: #E7F5E8;
  --sfn-status-overdue:          #D45353;
  --sfn-status-overdue-subtle:   #FBE9E9;
  --sfn-status-rejected:         #DD982F;
  --sfn-status-rejected-subtle:  #FAF5E9;

  /* ── Neutral Scale (구, 9종) ──
  --sfn-neutral-900: #1a1a1a;
  --sfn-neutral-800: #252525;
  --sfn-neutral-700: #333333;
  --sfn-neutral-600: #555555;
  --sfn-neutral-500: #6c757d;
  --sfn-neutral-400: #999999;
  --sfn-neutral-300: #cccccc;
  --sfn-neutral-200: #e9ecef;
  --sfn-neutral-100: #f5f5f5;
  ── */

  /* ── Neutral Scale (신규, 7종) ── */
  --sfn-neutral-900: #333333;
  --sfn-neutral-800: #555555;
  --sfn-neutral-700: #7C7C7C;
  --sfn-neutral-600: #9C9C9C;
  --sfn-neutral-500: #C8C8C8;
  --sfn-neutral-400: #E3E3E3;
  --sfn-neutral-300: #F3F3F3;

  /* ── 모달 닫기/취소 버튼 ── */
  --sfn-modal-close-bg:       #333333;
  --sfn-modal-close-bg-hover: #555555;
  --sfn-modal-close-color:    #ffffff;

  /* ── 기타 색상 (UI 포인트) ── */
  --sfn-cyan:        #03c3ec;
  --sfn-cyan-subtle: #d7f5fc;
  --sfn-required:    #DD4545;

  /* ── 액션 색상 투명도 변형 ── */
  --sfn-action-subtle:     rgba(0, 100, 220, 0.12);
  --sfn-action-subtle-md:  rgba(0, 100, 220, 0.08);
  --sfn-action-subtle-sm:  rgba(0, 100, 220, 0.06);
  --sfn-action-subtle-xs:  rgba(0, 100, 220, 0.04);
  --sfn-action-subtle-xxs: rgba(0, 100, 220, 0.03);

  /* ── 오버레이 (반투명 레이어) ── */
  --sfn-overlay-dark-sm:  rgba(0, 0, 0, 0.04);
  --sfn-overlay-dark-md:  rgba(0, 0, 0, 0.08);
  --sfn-overlay-white-sm: rgba(255, 255, 255, 0.25);

  /* ── 카드 그림자 ── */
  --sfn-shadow-card:       0 2px 6px rgba(0, 0, 0, 0.06);
  --sfn-shadow-card-hover: 0 4px 14px rgba(0, 0, 0, 0.10);
}

/* ── OKLCH Progressive Enhancement ── */
@supports (color: oklch(0% 0 0)) {
  :root {
    /* Brand OKLCH (구 — hex 토큰 교체로 비활성)
    --sfn-primary: oklch(55% 0.27 268);
    --sfn-primary-hover: oklch(50% 0.24 268);
    --sfn-primary-active: oklch(45% 0.22 268);
    --sfn-primary-subtle: oklch(94% 0.05 268);
    --sfn-secondary: oklch(64% 0.04 250);
    --sfn-accent: oklch(76% 0.14 215);
    */

    /* Semantic OKLCH */
    --sfn-success: oklch(81% 0.22 140);
    --sfn-success-subtle: oklch(96% 0.06 140);
    --sfn-warning: oklch(79% 0.18 75);
    --sfn-warning-subtle: oklch(97% 0.04 85);
    --sfn-danger: oklch(60% 0.24 30);
    --sfn-danger-subtle: oklch(94% 0.05 25);
    --sfn-info: oklch(76% 0.14 215);
    --sfn-info-subtle: oklch(95% 0.04 215);

    /* Surface OKLCH */
    --sfn-bg-body: oklch(97% 0.003 280);
    --sfn-bg-card: oklch(100% 0 0);
    --sfn-bg-subtle: oklch(98% 0.003 260);
    --sfn-bg-light: oklch(97% 0 0);
    --sfn-bg-highlight: oklch(95% 0.03 260);
    --sfn-bg-banner: oklch(95% 0.008 250);
    --sfn-bg-input: oklch(100% 0 0);
    --sfn-bg-hover: oklch(96% 0.005 270);
    --sfn-bg-overlay: oklch(0% 0 0 / 0.5);
    --sfn-shadow: oklch(75% 0.02 250 / 0.45);

    /* Text OKLCH */
    --sfn-text: oklch(30% 0 0);
    --sfn-text-sub: oklch(42% 0 0);      /* #595959 상당 */
    --sfn-text-muted: oklch(55% 0.03 245);
    --sfn-text-light: oklch(72% 0.02 250);
    --sfn-text-on-primary: oklch(100% 0 0);
    /* --sfn-text-link: oklch(55% 0.27 268); */ /* 구 — hex 토큰 교체 */

    /* Border OKLCH */
    --sfn-border: oklch(89% 0 0);
    --sfn-border-light: oklch(93% 0.005 250);
    --sfn-border-strong: oklch(82% 0.02 245);
    --sfn-border-input: oklch(90% 0.01 245);
    --sfn-border-table: oklch(90% 0.01 245);

    /* Blue Scale OKLCH (구 — secondary scale로 교체)
    --sfn-blue-900: oklch(43% 0.11 250);
    --sfn-blue-700: oklch(56% 0.08 245);
    --sfn-blue-600: oklch(62% 0.08 245);
    --sfn-blue-500: oklch(55% 0.03 245);
    --sfn-blue-400: oklch(50% 0.04 245);
    --sfn-blue-300: oklch(82% 0.02 245);
    --sfn-blue-200: oklch(90% 0.01 245);
    --sfn-blue-100: oklch(95% 0.008 250);
    --sfn-blue-50: oklch(95% 0.03 260);
    */

    /* Status Colors OKLCH (구 — hex 토큰 교체로 비활성)
    --sfn-status-pending: oklch(55% 0.03 245);
    --sfn-status-pending-subtle: oklch(55% 0.03 245 / 0.12);
    --sfn-status-progress: oklch(79% 0.18 75);
    --sfn-status-progress-subtle: oklch(79% 0.18 75 / 0.12);
    --sfn-status-completed: oklch(73% 0.22 140);
    --sfn-status-completed-subtle: oklch(73% 0.22 140 / 0.12);
    --sfn-status-overdue: oklch(58% 0.24 25);
    --sfn-status-overdue-subtle: oklch(58% 0.24 25 / 0.12);
    --sfn-status-rejected: oklch(50% 0.18 300);
    --sfn-status-rejected-subtle: oklch(50% 0.18 300 / 0.12);
    */

    /* Neutral Scale OKLCH (구 — hex 토큰 교체로 비활성)
    --sfn-neutral-900: oklch(18% 0 0);
    --sfn-neutral-800: oklch(22% 0 0);
    --sfn-neutral-700: oklch(30% 0 0);
    --sfn-neutral-600: oklch(42% 0 0);
    --sfn-neutral-500: oklch(52% 0 0);
    --sfn-neutral-400: oklch(67% 0 0);
    --sfn-neutral-300: oklch(83% 0 0);
    --sfn-neutral-200: oklch(93% 0.005 250);
    --sfn-neutral-100: oklch(97% 0 0);
    */
  }
}

/* ── Sneat/Bootstrap 변수 오버라이드 ──
 * _base.css는 core.css 이후에 로드되므로 cascade로 Sneat 변수를 덮어씀.
 * 테마 파일이 --sfn-* 를 바꾸면 --bs-* 도 자동 반영.
 *
 * 파생 색상(text-emphasis, border-subtle)은 color-mix()로 자동 계산.
 * -rgb 변수는 정적 값이므로 각 테마 파일에서 오버라이드.
 * ── */
:root {
  /* ── Primary 계열 ── */
  --bs-primary: var(--sfn-primary);
  --bs-primary-bg-subtle: var(--sfn-primary-subtle);
  --bs-primary-text-emphasis: #2a2b66;
  --bs-primary-text-emphasis: color-mix(in srgb, var(--sfn-primary) 40%, black);
  --bs-primary-border-subtle: #c3c4ff;
  --bs-primary-border-subtle: color-mix(in srgb, var(--sfn-primary) 40%, white);

  /* ── Success 계열 ── */
  --bs-success: var(--sfn-success);
  --bs-success-bg-subtle: var(--sfn-success-subtle);
  --bs-success-text-emphasis: #2d5816;
  --bs-success-text-emphasis: color-mix(in srgb, var(--sfn-success) 40%, black);
  --bs-success-border-subtle: #c3eea1;
  --bs-success-border-subtle: color-mix(in srgb, var(--sfn-success) 40%, white);

  /* ── Danger 계열 ── */
  --bs-danger: var(--sfn-danger);
  --bs-danger-bg-subtle: var(--sfn-danger-subtle);
  --bs-danger-text-emphasis: #66190c;
  --bs-danger-text-emphasis: color-mix(in srgb, var(--sfn-danger) 40%, black);
  --bs-danger-border-subtle: #ff9e8e;
  --bs-danger-border-subtle: color-mix(in srgb, var(--sfn-danger) 40%, white);

  /* ── Warning 계열 ── */
  --bs-warning: var(--sfn-warning);
  --bs-warning-bg-subtle: var(--sfn-warning-subtle);
  --bs-warning-text-emphasis: #664400;
  --bs-warning-text-emphasis: color-mix(in srgb, var(--sfn-warning) 40%, black);
  --bs-warning-border-subtle: #ffc966;
  --bs-warning-border-subtle: color-mix(in srgb, var(--sfn-warning) 40%, white);

  /* ── Info 계열 ── */
  --bs-info: var(--sfn-info);
  --bs-info-bg-subtle: var(--sfn-info-subtle);
  --bs-info-text-emphasis: #014e5e;
  --bs-info-text-emphasis: color-mix(in srgb, var(--sfn-info) 40%, black);
  --bs-info-border-subtle: #68dbf4;
  --bs-info-border-subtle: color-mix(in srgb, var(--sfn-info) 40%, white);

  /* ── Secondary 계열 ── */
  --bs-secondary: var(--sfn-secondary);
  --bs-secondary-text-emphasis: #353a41;
  --bs-secondary-text-emphasis: color-mix(in srgb, var(--sfn-secondary) 40%, black);
  --bs-secondary-border-subtle: #c8cdd2;
  --bs-secondary-border-subtle: color-mix(in srgb, var(--sfn-secondary) 40%, white);
  --bs-secondary-color: var(--sfn-text-muted);
  --bs-secondary-bg: var(--sfn-neutral-200);

  /* ── Light / Dark ── */
  --bs-light: var(--sfn-neutral-200);
  --bs-dark: var(--sfn-neutral-800);
  --bs-light-text-emphasis: var(--sfn-text-muted);
  --bs-dark-text-emphasis: var(--sfn-text-muted);
  --bs-light-bg-subtle: var(--sfn-neutral-100);
  --bs-dark-bg-subtle: var(--sfn-neutral-300);
  --bs-light-border-subtle: var(--sfn-neutral-200);
  --bs-dark-border-subtle: var(--sfn-neutral-300);

  /* ── Link ── */
  --bs-link-color: var(--sfn-text-link);
  --bs-link-hover-color: var(--sfn-primary-hover);

  /* ── Surface / Body ── */
  --bs-body-bg: var(--sfn-bg-body);
  --bs-body-color: var(--sfn-text);
  --bs-heading-color: var(--sfn-text);
  --bs-emphasis-color: var(--sfn-text);
  --bs-tertiary-bg: var(--sfn-neutral-100);

  /* ── Border ── */
  --bs-border-color: var(--sfn-border);
  --bs-border-color-translucent: rgb(0 0 0 / 0.175);

  /* ── Form validation ── */
  --bs-form-valid-color: var(--sfn-success);
  --bs-form-valid-border-color: var(--sfn-success);
  --bs-form-invalid-color: var(--sfn-danger);
  --bs-form-invalid-border-color: var(--sfn-danger);

  /* ── -rgb 기본값 (Sneat 기본 팔레트) — 테마에서 오버라이드 ── */
  --bs-primary-rgb: 0, 100, 220;
  --bs-secondary-rgb: 133, 146, 163;
  --bs-success-rgb: 113, 221, 55;
  --bs-danger-rgb: 255, 62, 29;
  --bs-warning-rgb: 255, 171, 0;
  --bs-info-rgb: 3, 195, 236;
  --bs-light-rgb: 233, 236, 239;
  --bs-dark-rgb: 37, 37, 37;
  --bs-body-color-rgb: 51, 51, 51;
  --bs-body-bg-rgb: 245, 245, 249;
  --bs-emphasis-color-rgb: 37, 37, 37;
  --bs-secondary-color-rgb: 105, 122, 141;
  --bs-link-color-rgb: 105, 108, 255;
  --bs-link-hover-color-rgb: 95, 97, 230;
}