/* ========================================
   EyeChartPro - CSS Variables
   색상, 크기, 폰트 등 전역 변수
   ======================================== */

:root {
    /* ========================================
       Colors - 색상
       ======================================== */
    /* Primary Colors - 주요 색상 */
    --color-primary: #1a1a2e;
    --color-primary-light: #374151;
    --color-primary-dark: #0f0f1a;
    --color-navy: #1e3a5f;

    /* Primary Blue - 프라이머리 블루 (버튼, 강조) */
    --color-blue-primary: #1e3a8a;
    --color-blue-hover: #1e40af;
    --color-blue-light: #2563eb;
    --color-blue-lighter: #1d4ed8;

    /* Background Colors - 배경 색상 */
    --color-bg: #f5f5f7;
    --color-bg-white: #FFFFFF;
    --color-bg-hover: rgba(0, 0, 0, 0.08);
    --color-bg-active: rgba(0, 0, 0, 0.12);
    --color-bg-gray: #f5f7fa;
    --color-bg-gray-light: #f8fafc;
    --color-bg-gray-lighter: #fafafa;
    --color-bg-subtle: #f9fafb;
    --color-bg-blue-light: #e8f0fe;

    /* Border Colors - 테두리 색상 */
    --color-border: #e5e7eb;
    --color-border-subtle: #e2e8f0;  /* 테이블, 카드 테두리 */
    --color-border-light: #f3f4f6;
    --color-border-lighter: #f1f5f9;  /* 리스트 구분선 */
    --color-border-medium: #d1d5db;
    --color-border-dark: #9ca3af;

    /* Text Colors - 텍스트 색상 */
    --color-text: #1a1a2e;
    --color-text-secondary: #374151;
    --color-text-muted: #6b7280;
    --color-text-light: #9ca3af;

    /* Table Header Colors - 테이블 헤더 (네이비 계열) */
    --color-table-header: #334155;
    --color-table-header-dark: #1e293b;
    --color-table-header-border: #0f172a;
    --color-table-header-divider: #475569;

    /* Status Colors - 상태 색상 */
    /* Success (녹색) */
    --color-success: #059669;
    --color-success-hover: #047857;
    --color-success-light: #dcfce7;
    --color-success-text: #166534;

    /* Danger/Error (빨강) */
    --color-danger: #dc2626;
    --color-danger-hover: #b91c1c;
    --color-danger-light: #fee2e2;
    --color-danger-text: #991b1b;

    /* Warning (노랑) */
    --color-warning: #d97706;
    --color-warning-light: #fef9c3;
    --color-warning-lighter: #fef08a;
    --color-warning-text: #854d0e;
    --color-warning-bg: #fefce8;
    --color-warning-border: #ca8a04;
    --color-period-tag-bg: #fef3c7;
    --color-period-tag-text: #92400e;
    --color-period-tag-border: #fcd34d;

    /* Info (파랑) */
    --color-info: #2563eb;
    --color-info-light: #dbeafe;
    --color-info-lighter: #eff6ff;
    --color-info-bg: #f0f7ff;  /* 승인 fieldset 배경 */
    --color-info-border: #93c5fd;  /* 승인 fieldset 테두리 */
    --color-info-text: #1e40af;

    /* Orange (주황) - 거부/경고 */
    --color-orange: #ea580c;
    --color-orange-light: #fff7ed;  /* 거부 fieldset 배경 */
    --color-orange-border: #fdba74;  /* 거부 fieldset 테두리 */

    /* Selection/Highlight (선택됨) */
    --color-selected: #fef9c3;
    --color-selected-hover: #fef08a;
    --color-highlight: #22c55e;
    --color-highlight-pink: #fce7f3;
    --color-highlight-pink-hover: #fbcfe8;
    --color-highlight-purple: #f3e8ff;
    --color-highlight-purple-hover: #e9d5ff;
    --color-purple: #7c3aed;

    /* Emerald Green - 에메랄드 그린 */
    --color-emerald: #10b981;

    /* Calendar/Schedule Colors - 캘린더 색상 */
    --color-sunday: #dc2626;
    --color-sunday-bg: #fef2f2;
    --color-sunday-light: #fff5f5;
    --color-sunday-header: #fca5a5;
    --color-saturday: #2563eb;
    --color-saturday-bg: #eff6ff;
    --color-saturday-light: #f0f9ff;
    --color-saturday-header: #93c5fd;
    --color-today: #fef9c3;
    --color-calendar-header: #f0f0f0;

    /* Badge Colors - 뱃지 색상 */
    --color-badge-surgery: #dbeafe;
    --color-badge-surgery-text: #1e40af;
    --color-badge-cataract: #dcfce7;
    --color-badge-cataract-text: #166534;

    /* Accent Colors - 강조 색상 */
    --color-notice: #d97706;
    
    /* ========================================
       Sizes - 크기
       ======================================== */
    /* Header */
    --header-height: 40px;
    
    /* Sidebar */
    --sidebar-width: 144px;
    --sidebar-width-collapsed: 0px;
    
    /* Spacing */
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 12px;
    --spacing-lg: 16px;
    --spacing-xl: 20px;

    /* Input Heights */
    --input-height-sm: 26px;  /* 플로팅 입력 필드 */
    --input-height-md: 32px;
    --input-height-lg: 40px;

    /* Textarea Heights */
    --textarea-height-sm: 50px;
    --textarea-height-md: 60px;
    
    /* ========================================
       Typography - 폰트
       ======================================== */
    --font-family: 'Geist Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    
    /* Font Sizes */
    --font-size-xs: 10px;
    --font-size-2xs: 11px;  /* 플로팅 라벨, 일반 텍스트 */
    --font-size-sm: 12px;
    --font-size-md: 13px;
    --font-size-lg: 14px;
    --font-size-xl: 16px;
    --font-size-2xl: 28px;
    --font-size-3xl: 40px;
    
    /* Font Weights */
    --font-weight-normal: 450;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    
    /* Line Heights */
    --line-height: 1.5;
    
    /* ========================================
       Transitions - 애니메이션
       ======================================== */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;
    
    /* ========================================
       Border Radius - 모서리
       ======================================== */
    --radius-xs: 2px;
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
    
    /* ========================================
       Z-Index - 레이어
       ======================================== */
    --z-header: 100;
    --z-sidebar: 90;
    --z-modal: 200;
    --z-tooltip: 150;

    /* ========================================
       Front-Desk 페이지 전용
       ======================================== */
    --workflow-sidebar-width: 255px;
    --discount-step-padding: 14px;
    --discount-active-inset: 5px;
    --discount-select-width: 120px;
    --discount-amount-width: 85px;
    --panel-gap: 6px;
}
