@charset "UTF-8";

/* ==========================================
   Contest System - Unified CSS Variables
   자유공모/지정공모 통합 변수 시스템
   ========================================== */

:root {
    /* ========== 자유공모 색상 ========== */
    --free-primary: #e89438;
    --free-light: #ffb366;
    --free-dark: #d97835;
    --free-gradient: linear-gradient(135deg, #e89438 0%, #ffb366 100%);
    --free-gradient-hover: linear-gradient(135deg, #d97835 0%, #e89438 100%);
    --free-bg-light: rgba(232, 148, 56, 0.05);
    --free-bg-medium: rgba(232, 148, 56, 0.1);
    --free-border: rgba(232, 148, 56, 0.3);
    --free-shadow: 0 4px 16px rgba(232, 148, 56, 0.3);
    
    /* ========== 지정공모 색상 ========== */
    --designated-primary: #3a1c74;
    --designated-light: #7c5bb8;
    --designated-dark: #2e1659;
    --designated-gradient: linear-gradient(135deg, #3a1c74 0%, #5a3b94 100%);
    --designated-gradient-hover: linear-gradient(135deg, #2e1659 0%, #3a1c74 100%);
    --designated-bg-light: rgba(58, 28, 116, 0.05);
    --designated-bg-medium: rgba(58, 28, 116, 0.1);
    --designated-border: rgba(58, 28, 116, 0.3);
    --designated-shadow: 0 4px 16px rgba(58, 28, 116, 0.3);
    
    /* ========== 기업 과제 색상 (오렌지 계열) ========== */
    --corp-primary: #ff6b35;
    --corp-light: #ff8c5a;
    --corp-gradient: linear-gradient(135deg, #ff6b35 0%, #ff8c5a 100%);
    
    /* ========== 공공/정부 과제 색상 (보라 계열) ========== */
    --govt-primary: #7c3aed;
    --govt-light: #a855f7;
    --govt-gradient: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%);
    
    /* ========== 공통 색상 ========== */
    --white: #ffffff;
    --light-bg: #f8f9fa;
    --card-bg: #ffffff;
    --border-color: #e5e7eb;
    --border-dark: #d1d5db;
    
    /* ========== 텍스트 색상 ========== */
    --text-primary: #1f2937;
    --text-secondary: #6b7280;
    --text-tertiary: #9ca3af;
    --text-disabled: #d1d5db;
    
    /* ========== 상태 색상 ========== */
    --success: #10b981;
    --success-light: #d4edda;
    --success-dark: #155724;
    --error: #ef4444;
    --error-light: #fee;
    --warning: #f59e0b;
    --warning-light: #fff3cd;
    --info: #3b82f6;
    
    /* ========== 그림자 ========== */
    --shadow-sm: 0 2px 10px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.08);
    --shadow-lg: 0 10px 40px rgba(0, 0, 0, 0.1);
    
    /* ========== 간격 ========== */
    --spacing-xs: 0.25rem;   /* 4px */
    --spacing-sm: 0.5rem;    /* 8px */
    --spacing-md: 1rem;      /* 16px */
    --spacing-lg: 1.5rem;    /* 24px */
    --spacing-xl: 2rem;      /* 32px */
    --spacing-2xl: 3rem;     /* 48px */
    
    /* ========== 폰트 크기 ========== */
    --font-xs: 0.75rem;      /* 12px */
    --font-sm: 0.85rem;      /* 13.6px */
    --font-base: 0.95rem;    /* 15.2px */
    --font-md: 1rem;         /* 16px */
    --font-lg: 1.125rem;     /* 18px */
    --font-xl: 1.25rem;      /* 20px */
    --font-2xl: 1.5rem;      /* 24px */
    --font-3xl: 2rem;        /* 32px */
    
    /* ========== 폰트 굵기 ========== */
    --font-light: 300;
    --font-normal: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-extrabold: 800;
    
    /* ========== Border Radius ========== */
    --radius-sm: 0.375rem;   /* 6px */
    --radius-md: 0.5rem;     /* 8px */
    --radius-lg: 0.75rem;    /* 12px */
    --radius-xl: 1rem;       /* 16px */
    --radius-2xl: 1.5rem;    /* 24px */
    --radius-full: 50%;
    
    /* ========== 전환 효과 ========== */
    --transition-fast: all 0.15s ease;
    --transition-base: all 0.3s ease;
    --transition-slow: all 0.5s ease;
}

/* ==========================================
   지정공모 모드 변수 오버라이드
   ========================================== */
body.designated {
    --active-primary: var(--designated-primary);
    --active-light: var(--designated-light);
    --active-gradient: var(--designated-gradient);
    --active-bg-light: var(--designated-bg-light);
    --active-border: var(--designated-border);
    --active-shadow: var(--designated-shadow);
}

/* 자유공모는 기본값 */
body:not(.designated) {
    --active-primary: var(--free-primary);
    --active-light: var(--free-light);
    --active-gradient: var(--free-gradient);
    --active-bg-light: var(--free-bg-light);
    --active-border: var(--free-border);
    --active-shadow: var(--free-shadow);
}

/* ==========================================
   전문가 모드 (추가용)
   ========================================== */
body.expert-mode {
    --active-primary: var(--success);
    --active-gradient: linear-gradient(135deg, #10b981 0%, #059669 100%);
    --active-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
}

/* ==========================================
   사용 예시 주석
   ========================================== */
/*
기본 사용:
  background: var(--active-gradient);
  color: var(--active-primary);
  box-shadow: var(--active-shadow);
  
특정 모드 강제:
  background: var(--free-gradient);
  background: var(--designated-gradient);
  
간격:
  padding: var(--spacing-lg);
  margin: var(--spacing-md);
  
폰트:
  font-size: var(--font-base);
  font-weight: var(--font-semibold);
  
라운드:
  border-radius: var(--radius-lg);
*/