/* Light/Dark 테마 CSS 변수 정의 - snainfo.com 디자인 적용 */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&family=Noto+Sans+KR:wght@400;500;700&family=Play:wght@400;700&display=swap');

:root {
  /* Layout */
  --color-body-bg: #f9f9f9;
  --color-header-bg: #0c1015;
  --color-header-text: #ffffff;
  --color-sidebar-bg: #212020;
  --color-sidebar-hover: #333333;
  --color-sidebar-border: #333333;
  --color-sidebar-text: #cccccc;
  --color-sidebar-text-sub: #999999;
  --color-sidebar-input-bg: #333333;
  --color-sidebar-input-border: #555555;

  /* Content */
  --color-card-bg: #ffffff;
  --color-card-alt-bg: #f9f9f9;
  --color-text-primary: #333333;
  --color-text-secondary: #666666;
  --color-text-tertiary: #999999;
  --color-text-label: #555555;
  --color-border: #ddd;
  --color-border-light: #e9e9e9;
  --color-border-lighter: #eeeeee;
  --color-border-section: #eeeeee;
  --color-shadow: rgba(0,0,0,0.1);
  --color-shadow-heavy: rgba(97,97,97,0.2);

  /* Interactive - snainfo.com primary blue */
  --color-primary: #3a8afd;
  --color-primary-hover: #0050cc;
  --color-primary-focus: rgba(58,138,253,0.25);
  --color-danger: #ff3061;
  --color-danger-hover: #d13f4a;
  --color-success: #8abc2a;
  --color-warning-bg: #fff3cd;
  --color-warning-text: #856404;

  /* Forms */
  --color-input-bg: #ffffff;
  --color-input-border: #ccc;
  --color-input-readonly-bg: #f5f5f5;
  --color-input-text-bg: #f9f9f9;

  /* Popups */
  --color-popup-bg: #ffffff;
  --color-popup-header-bg: #f9f9f9;
  --color-popup-hover: #f5f5f5;
  --color-popup-logout-hover: #fff5f5;

  /* Table */
  --color-table-header-bg: #f5f5f5;
  --color-table-row-hover: #f9f9f9;
  --color-table-border: #e9e9e9;
  --color-table-cell-border: #eeeeee;

  /* Modal */
  --color-modal-bg: #ffffff;
  --color-modal-overlay: rgba(0,0,0,0.5);

  /* Status badges */
  --color-badge-active-bg: #e8f5e9;
  --color-badge-active-text: #2e7d32;
  --color-badge-inactive-bg: #ffebee;
  --color-badge-inactive-text: #c62828;

  /* Pagination */
  --color-pagination-bg: #ffffff;
  --color-pagination-border: #ddd;
  --color-pagination-disabled-bg: #f5f5f5;

  /* Progress */
  --color-progress-bg: #eeeeee;

  /* 기본 텍스트 색상 */
  color: #333;
}

[data-theme="dark"] {
  /* Layout */
  --color-body-bg: #0c1015;
  --color-header-bg: #080b0e;
  --color-header-text: #e0e0e0;
  --color-sidebar-bg: #121820;
  --color-sidebar-hover: #1a2530;
  --color-sidebar-border: #1a2530;
  --color-sidebar-text: #cccccc;
  --color-sidebar-text-sub: #888888;
  --color-sidebar-input-bg: #1a2530;
  --color-sidebar-input-border: #2a3a4a;

  /* Content */
  --color-card-bg: #161d26;
  --color-card-alt-bg: #1c2530;
  --color-text-primary: #e0e0e0;
  --color-text-secondary: #aaaaaa;
  --color-text-tertiary: #777777;
  --color-text-label: #999999;
  --color-border: #2a3540;
  --color-border-light: #2a3540;
  --color-border-lighter: #222c36;
  --color-border-section: #2a3540;
  --color-shadow: rgba(0,0,0,0.4);
  --color-shadow-heavy: rgba(0,0,0,0.5);

  /* Interactive */
  --color-primary: #3a8afd;
  --color-primary-hover: #5a9dfd;
  --color-primary-focus: rgba(58,138,253,0.3);
  --color-danger: #ff3061;
  --color-danger-hover: #ff5a7a;
  --color-success: #8abc2a;
  --color-warning-bg: #3d3520;
  --color-warning-text: #ffd54f;

  /* Forms */
  --color-input-bg: #1c2530;
  --color-input-border: #2a3a4a;
  --color-input-readonly-bg: #121820;
  --color-input-text-bg: #1c2530;

  /* Popups */
  --color-popup-bg: #161d26;
  --color-popup-header-bg: #1c2530;
  --color-popup-hover: #222c36;
  --color-popup-logout-hover: #3a1a1a;

  /* Table */
  --color-table-header-bg: #1c2530;
  --color-table-row-hover: #222c36;
  --color-table-border: #2a3540;
  --color-table-cell-border: #222c36;

  /* Modal */
  --color-modal-bg: #161d26;
  --color-modal-overlay: rgba(0,0,0,0.7);

  /* Status badges */
  --color-badge-active-bg: #1b3a20;
  --color-badge-active-text: #8abc2a;
  --color-badge-inactive-bg: #3a1b1b;
  --color-badge-inactive-text: #ff3061;

  /* Pagination */
  --color-pagination-bg: #1c2530;
  --color-pagination-border: #2a3a4a;
  --color-pagination-disabled-bg: #121820;

  /* Progress */
  --color-progress-bg: #222c36;

  /* 기본 텍스트 색상 */
  color: #e0e0e0;
}

/* 테마 토글 버튼 */
.theme-btn {
  font-size: 16px;
  transition: transform 0.3s ease;
}

.theme-btn:hover {
  transform: scale(1.2);
}