/**
 * IT Project Design Tokens - V3
 * Based on edu-design-system
 * Compatible with Bootstrap 4.5
 */

:root {
  /* ============================================
     색상 토큰 (Color Tokens)
     ============================================ */

  /* Primary - 블루 */
  --edu-primary-50: #E6F4FF;
  --edu-primary-100: #B3DCFF;
  --edu-primary-200: #80C4FF;
  --edu-primary-300: #4DACFF;
  --edu-primary-400: #2694FF;
  --edu-primary-500: #0080FF;
  --edu-primary-600: #0073E6;  /* Main */
  --edu-primary-700: #0060BF;
  --edu-primary-800: #004D99;
  --edu-primary-900: #003366;

  /* Secondary - 틸 */
  --edu-secondary-50: #E6F9F7;
  --edu-secondary-100: #B3EFE8;
  --edu-secondary-200: #80E5D9;
  --edu-secondary-300: #4DDBCA;
  --edu-secondary-400: #26D4BF;
  --edu-secondary-500: #00CDB3;
  --edu-secondary-600: #00B9A3;  /* Main */
  --edu-secondary-700: #009A87;
  --edu-secondary-800: #007B6B;
  --edu-secondary-900: #005C4F;

  /* Accent - 앰버 */
  --edu-accent-50: #FFF8E6;
  --edu-accent-100: #FFECB3;
  --edu-accent-200: #FFE080;
  --edu-accent-300: #FFD44D;
  --edu-accent-400: #FFCB26;
  --edu-accent-500: #FFC200;
  --edu-accent-600: #FFB800;  /* Main */
  --edu-accent-700: #FFA200;
  --edu-accent-800: #FF8C00;
  --edu-accent-900: #E67700;

  /* Neutral - 그레이 */
  --edu-neutral-0: #FFFFFF;
  --edu-neutral-50: #F9FAFB;
  --edu-neutral-100: #F3F4F6;
  --edu-neutral-200: #E5E7EB;
  --edu-neutral-300: #D1D5DB;
  --edu-neutral-400: #9CA3AF;
  --edu-neutral-500: #6B7280;
  --edu-neutral-600: #4B5563;
  --edu-neutral-700: #374151;
  --edu-neutral-800: #1F2937;
  --edu-neutral-900: #111827;

  /* Semantic Colors */
  --edu-success-50: #F0FDF4;
  --edu-success-500: #22C55E;
  --edu-success-600: #16A34A;
  --edu-success-700: #15803D;

  --edu-warning-50: #FFFBEB;
  --edu-warning-100: #FEF3C7;
  --edu-warning-200: #FDE68A;
  --edu-warning-300: #FCD34D;
  --edu-warning-500: #F59E0B;
  --edu-warning-600: #EA580C;
  --edu-warning-700: #C2410C;
  --edu-warning-800: #92400E;
  --edu-warning-900: #78350F;

  --edu-error-50: #FEF2F2;
  --edu-error-100: #FEE2E2;
  --edu-error-200: #FECACA;
  --edu-error-300: #FCA5A5;
  --edu-error-400: #F87171;
  --edu-error-600: #DC2626;
  --edu-error-700: #B91C1C;
  --edu-error-800: #991B1B;

  --edu-info-50: #EFF6FF;
  --edu-info-600: #2563EB;
  --edu-info-700: #1D4ED8;

  /* CTA - 딥 네이비 (강한 액션 버튼) */
  --edu-cta-600: #1E3A8A;  /* Main */
  --edu-cta-700: #1E40AF;  /* Hover */
  --edu-cta-800: #172554;  /* Active */

  /* 출석 상태 (Attendance Status) */
  /* 양호 - Emerald */
  --edu-attendance-good-bg: #ECFDF5;
  --edu-attendance-good-bg-hover: #D1FAE5;
  --edu-attendance-good-dot: #10B981;
  --edu-attendance-good-text: #047857;

  /* 경고 - Amber */
  --edu-attendance-warning-bg: #FFFBEB;
  --edu-attendance-warning-bg-hover: #FEF3C7;
  --edu-attendance-warning-dot: #F59E0B;
  --edu-attendance-warning-text: #92400E;

  /* 위험 - Rose */
  --edu-attendance-danger-bg: #FEF2F2;
  --edu-attendance-danger-bg-hover: #FEE2E2;
  --edu-attendance-danger-dot: #F43F5E;
  --edu-attendance-danger-text: #DC2626;

  /* ============================================
     타이포그래피 (Typography)
     ============================================ */

  /* Font Family */
  --edu-font-sans: 'Pretendard Variable', -apple-system, BlinkMacSystemFont,
                   'Segoe UI', 'Malgun Gothic', sans-serif;

  /* Font Sizes (+2px typography scale) */
  --edu-text-micro: 0.6875rem; /* 11px - UI 미세 라벨 */
  --edu-text-2xs: 0.75rem;     /* 12px - 메타 정보, 카운트 */
  --edu-text-mini: 0.8125rem;  /* 13px - 보조 설명 */
  --edu-text-xs: 0.875rem;     /* 14px (was 12px) */
  --edu-text-sm: 1rem;         /* 16px (was 14px) */
  --edu-text-base: 1.125rem;   /* 18px (was 16px) */
  --edu-text-lg: 1.25rem;      /* 20px (was 18px) */
  --edu-text-xl: 1.375rem;     /* 22px (was 20px) */
  --edu-text-2xl: 1.625rem;    /* 26px (was 24px) */
  --edu-text-3xl: 2rem;        /* 32px (was 30px) */
  --edu-text-4xl: 2.375rem;    /* 38px (was 36px) */
  --edu-text-5xl: 3.125rem;    /* 50px (was 48px) */
  --edu-text-6xl: 3.875rem;    /* 62px (was 60px) */
  --edu-text-stat: 2.25rem;    /* 36px - 통계 수치 */

  /* Semantic Typography Tokens */
  --edu-text-page-title: 1.875rem;     /* 30px - 페이지 제목 */
  --edu-text-card-title: 1.25rem;      /* 20px - 카드 제목 */
  --edu-text-section-label: 1.0625rem; /* 17px - 섹션 라벨 */
  --edu-text-body: 1rem;               /* 16px - 본문 */
  --edu-text-caption: 0.9375rem;       /* 15px - 캡션 */

  /* Font Weights */
  --edu-font-normal: 400;
  --edu-font-medium: 500;
  --edu-font-semibold: 600;
  --edu-font-bold: 700;
  --edu-font-extrabold: 800;

  /* Line Heights */
  --edu-leading-none: 1;
  --edu-leading-tight: 1.25;
  --edu-leading-snug: 1.375;
  --edu-leading-normal: 1.5;
  --edu-leading-relaxed: 1.625;
  --edu-leading-loose: 2;

  /* Letter Spacing */
  --edu-tracking-tight: -0.02em;   /* 한글 제목용 - 타이트 */
  --edu-tracking-normal: 0;

  /* ============================================
     간격 시스템 (Spacing - 8pt Grid)
     ============================================ */

  --edu-spacing-0: 0;
  --edu-spacing-1: 0.25rem;    /* 4px */
  --edu-spacing-2: 0.5rem;     /* 8px */
  --edu-spacing-3: 0.75rem;    /* 12px */
  --edu-spacing-4: 1rem;       /* 16px */
  --edu-spacing-5: 1.25rem;    /* 20px */
  --edu-spacing-6: 1.5rem;     /* 24px */
  --edu-spacing-7: 1.75rem;    /* 28px */
  --edu-spacing-8: 2rem;       /* 32px */
  --edu-spacing-10: 2.5rem;    /* 40px */
  --edu-spacing-12: 3rem;      /* 48px */
  --edu-spacing-16: 4rem;      /* 64px */
  --edu-spacing-20: 5rem;      /* 80px */
  --edu-spacing-24: 6rem;      /* 96px */

  /* ============================================
     Border Radius
     ============================================ */

  --edu-radius-none: 0;
  --edu-radius-sm: 0.25rem;    /* 4px */
  --edu-radius-md: 0.5rem;     /* 8px */
  --edu-radius-lg: 0.75rem;    /* 12px */
  --edu-radius-xl: 1rem;       /* 16px */
  --edu-radius-2xl: 1.5rem;    /* 24px */
  --edu-radius-full: 9999px;

  /* ============================================
     Shadows
     ============================================ */

  --edu-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --edu-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
                   0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --edu-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
                   0 4px 6px -2px rgba(0, 0, 0, 0.05);
  --edu-shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1),
                   0 10px 10px -5px rgba(0, 0, 0, 0.04);
  --edu-shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  --edu-shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);

  /* ============================================
     Z-Index 레이어
     ============================================ */

  --edu-z-base: 0;
  --edu-z-dropdown: 1000;
  --edu-z-sticky: 1020;
  --edu-z-fixed: 1030;
  --edu-z-modal-backdrop: 1040;
  --edu-z-modal: 1050;
  --edu-z-popover: 1060;
  --edu-z-tooltip: 1070;

  /* ============================================
     모바일 레이아웃 (Mobile Layout)
     ============================================ */

  --mz-header-height: 56px;
  --mz-tabbar-height: 71.5px;
  --mz-counsel-height: 0px;
  --mz-bottom-nav-height: var(--mz-tabbar-height);
}