@charset "UTF-8";

/**
 * --------------------------------------------------------------------------
 * Global Variables
 * --------------------------------------------------------------------------
 * @description 시스템 전역에서 사용하는 색상, 치수, 레이어 우선순위 정의
 * @version 2.0 (Fully Variable-driven Theme System)
 */

:root {
  /* [1. Brand Colors] */
  --primary-color: #399546;
  --primary-hover: #2a6f34;
  --primary-rgb: 57, 149, 70;
  --danger-color: #E54E5E;
  --danger-hover: #D63D4D;

  /*[2. Backgrounds] - Light Mode */
  --bg-base: #FFFFFF;           /* 최하단 바닥 */
  --bg-sidebar: #F9FAFB;        /* 사이드바 영역 */
  --bg-content: #F2F4F6;        /* 컨텐츠 배경 (바닥보다 한 단계 위) */
  --bg-card: #FFFFFF;           /* 카드 및 컨테이너 (가장 위로 떠오름) */
  --bg-header: #FFFFFF;         /* 헤더 영역 */
  --bg-input: #FFFFFF;          /* 입력창 배경 */
  --bg-input-readonly: #F9FAFB; /* 읽기전용 입력창 */

  /* [3. Text Colors] - Light Mode */
  --text-primary: #333D4B;      /* 메인 텍스트 (Toss Grey 800) */
  --text-secondary: #4E5968;    /* 서브 텍스트 (Toss Grey 700) */
  --text-tertiary: #8B95A1;     /* 비활성/플레이스홀더 (Toss Grey 500) */
  --text-quaternary: #003575;
  --text-white: #FFFFFF;

  /*[4. Borders & Shadows] */
  --border-color: #E5E8EB;
  --border-focus: color-mix(in srgb, var(--primary-color) 40%, transparent);
  --shadow-focus: 0 0 0 3px color-mix(in srgb, var(--primary-color) 10%, transparent);
  --shadow-card: 0 4px 20px rgba(0, 0, 0, 0.03);
  --breadcrumb-separator: #ADB5BD;

  /* [5. Interaction] */
  --hover-bg: #F2F4F6;
  --toggle-bg: transparent;
  --toggle-hover: rgba(0, 0, 0, 0.05);
  --toggle-icon: #333D4B;

  /* [6. Dimensions] */
  --radius-base: 8px;
  --radius-lg: 16px;
  --header-height: 60px;
  --sidebar-width: 250px;
  --sidebar-collapsed: 68px;

  /* [7. Z-Index Priority] */
  --z-header: 1200;
  --z-sidebar: 1100;
  --z-overlay: 1050;
  --z-progress: 1300;
  --z-dialog: 2000;
  --z-loading: 9999;

  /* [8. Module Extensions] - MDI & Monitoring */
  --bg-tab-inactive: #EEEEEE;
  --mon-bg: #F0F2F5;
  --mon-card: #FFFFFF;
  --mon-text-main: #191F28;
  --mon-text-sub: #8B95A1;
  --mon-border: #E1E4E8;
  --mon-accent: #3182F6;
  --mon-success: #2EB85C;
  --mon-danger: #E55353;
  --mon-warn: #F9B115;

  --grid-header-bg: #f2f4f6; /* TUI Grid 헤더 및 스크롤바 우측 상단 배경색 */

  /* ========================================================================
     [9. Button System] - Soft Pastel UI (Light Mode)
     ======================================================================== */
  /* Action (조회, 등록, 저장) */
  --btn-action-bg: #3182f6;
  --btn-action-text: #ffffff;
  --btn-action-border: #3182f6;
  --btn-action-hover-bg: #1b64da;
  --btn-action-hover-text: #ffffff;

  /*--btn-action-bg: #e8f0fe;*/
  /*--btn-action-text: #1b64da;*/
  /*--btn-action-border: #d1e3fd;*/
  /*--btn-action-hover-bg: #d1e3fd;*/
  /*--btn-action-hover-text: #0d47a1;*/

  /* Basic (수정, 목록, 행추가) */
  --btn-basic-bg: #e5e8eb;
  --btn-basic-text: #4e5968;
  --btn-basic-border: #d1d6db;
  --btn-basic-hover-bg: #d1d6db;
  --btn-basic-hover-text: #333d4b;

  /* Success (엑셀다운로드, 승인) */
  --btn-success-bg: #e6f6eb;
  --btn-success-text: #118a3a;
  --btn-success-border: #d1f0db;
  --btn-success-hover-bg: #d1f0db;
  --btn-success-hover-text: #0d6e2e;

  /* Danger (삭제, 반려) */
  --btn-danger-bg: #fce8e8;
  --btn-danger-text: #e54e5e;
  --btn-danger-border: #fad1d1;
  --btn-danger-hover-bg: #fad1d1;
  --btn-danger-hover-text: #be123c;

  /* Warning (보류, 마감취소) */
  --btn-warning-bg: #fef5e5;
  --btn-warning-text: #b97500;
  --btn-warning-border: #fde6b5;
  --btn-warning-hover-bg: #fde6b5;
  --btn-warning-hover-text: #8f5a00;

  /* Info (상세보기, 팝업호출) */
  --btn-info-bg: #e1f5f8;
  --btn-info-text: #007c89;
  --btn-info-border: #c3ebf1;
  --btn-info-hover-bg: #c3ebf1;
  --btn-info-hover-text: #005b66;

  /* Cancel (취소, 닫기, 초기화) */
  --btn-cancel-bg: transparent;
  --btn-cancel-text: #8b95a1;
  --btn-cancel-border: #d1d6db;
  --btn-cancel-hover-bg: #f2f4f6;
  --btn-cancel-hover-text: #4e5968;
  --btn-cancel-hover-border: #b0b8c1;

  /* ========================================================================[10. Global Components] - Toast, Loading, Scrollbar (Light Mode)
     ======================================================================== */
  --toast-bg: #ffffff;
  --toast-text: #191f28;
  --toast-border: rgba(0, 0, 0, 0.05);
  --toast-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);

  --loading-bg: rgba(255, 255, 255, 0.5);

  --scrollbar-thumb: rgba(0, 0, 0, 0.2);
  --scrollbar-hover: rgba(0, 0, 0, 0.4);
}

/* ==========================================================================
   [Dark Mode Overrides]
   ========================================================================== */
[data-theme="dark"] {
  /* Backgrounds */
  --bg-base: #0F1012;
  --bg-sidebar: #111317;
  --bg-content: #15171A;
  --bg-card: #202227;
  --bg-header: #202227;
  --bg-input: #2C2F36;
  --bg-input-readonly: #1A1C21;

  /* Text */
  --text-primary: #F2F4F6;
  --text-secondary: #D1D6DB;
  --text-tertiary: #8B95A1;
  --text-quaternary: #F2F4F6;

  /* Borders & Shadows */
  --border-color: #33363B;
  --shadow-card: none;
  --breadcrumb-separator: #3B3B3B;

  /* Interaction */
  --hover-bg: rgba(255, 255, 255, 0.08);
  --toggle-icon: #FFFFFF;

  /* Module Extensions */
  --bg-tab-inactive: #2C2C2C;
  --mon-bg: #0D0D0D;
  --mon-card: #1C1C1C;
  --mon-text-main: #F2F4F6;
  --mon-text-sub: #8B95A1;
  --mon-border: #333333;

  /* [9. Button System] - Dark Mode */
  /*--btn-action-bg: rgba(49, 130, 246, 0.15);*/
  /*--btn-action-text: #60a5fa;*/
  /*--btn-action-border: rgba(49, 130, 246, 0.3);*/
  /*--btn-action-hover-bg: rgba(49, 130, 246, 0.25);*/
  /*--btn-action-hover-text: #93c5fd;*/

  --btn-basic-bg: rgba(255, 255, 255, 0.08);
  --btn-basic-text: #d1d6db;
  --btn-basic-border: rgba(255, 255, 255, 0.15);
  --btn-basic-hover-bg: rgba(255, 255, 255, 0.15);
  --btn-basic-hover-text: #ffffff;

  --btn-success-bg: rgba(46, 184, 92, 0.15);
  --btn-success-text: #4ade80;
  --btn-success-border: rgba(46, 184, 92, 0.3);
  --btn-success-hover-bg: rgba(46, 184, 92, 0.25);
  --btn-success-hover-text: #86efac;

  --btn-danger-bg: rgba(229, 78, 94, 0.15);
  --btn-danger-text: #f87171;
  --btn-danger-border: rgba(229, 78, 94, 0.3);
  --btn-danger-hover-bg: rgba(229, 78, 94, 0.25);
  --btn-danger-hover-text: #fca5a5;

  --btn-warning-bg: rgba(249, 177, 21, 0.15);
  --btn-warning-text: #fbbf24;
  --btn-warning-border: rgba(249, 177, 21, 0.3);
  --btn-warning-hover-bg: rgba(249, 177, 21, 0.25);
  --btn-warning-hover-text: #fcd34d;

  --btn-info-bg: rgba(0, 184, 217, 0.15);
  --btn-info-text: #22d3ee;
  --btn-info-border: rgba(0, 184, 217, 0.3);
  --btn-info-hover-bg: rgba(0, 184, 217, 0.25);
  --btn-info-hover-text: #67e8f9;

  --btn-cancel-bg: transparent;
  --btn-cancel-text: #9ca3af;
  --btn-cancel-border: #4b5563;
  --btn-cancel-hover-bg: rgba(255, 255, 255, 0.05);
  --btn-cancel-hover-text: #ffffff;
  --btn-cancel-hover-border: #6b7280;

  /*[10. Global Components] - Dark Mode */
  --toast-bg: #2c2c2c;
  --toast-text: #f2f4f6;
  --toast-border: rgba(255, 255, 255, 0.1);
  --toast-shadow: 0 8px 30px rgba(0, 0, 0, 0.5);

  --loading-bg: rgba(0, 0, 0, 0.5);

  --scrollbar-thumb: rgba(255, 255, 255, 0.25);
  --scrollbar-hover: rgba(255, 255, 255, 0.45);

  --grid-header-bg: #2c2c3a; /* 그리드 헤더 배경색 */
}
