@charset "utf-8";
/* Global Style
   ========================================================================== */
/**
 * Variables
 * --text- : font
 * --color- : border | bg 
 */
/* 라이트 모드 변수 */
:root {
  --color-text-base: #333;
  --color-text-light: #666;
  --color-text-muted: #888;
  --color-text-transparent: transparent;

  --color-text-accent: #5E32C3;
  --color-text-success: #4cc9f0;
  --color-text-warning: #f72585;

  --color-black: #000000;
  --color-white: #ffffff;

  --color-base-50: #f8f7fc;
  --color-base-100: #f1edf7;
  --color-base-200: #e6e2f0;
  --color-base-300: #d0cbe0;
  --color-base-400: #78797e;
  --color-base-500: #69676e;
  --color-base-600: #57565a;
  --color-base-700: #434346;
  --color-base-800: #333333;
  --color-base-900: #111111;

  --color-gray-50: #fafafa;
  --color-gray-100: #f4f4f5;
  --color-gray-200: #e4e4e7;
  --color-gray-300: #d4d4d8;
  --color-gray-400: #a1a1aa;
  --color-gray-500: #71717a;
  --color-gray-600: #52525b;
  --color-gray-700: #3f3f46;
  --color-gray-800: #27272a;
  --color-gray-900: #18181b;
  --color-gray-950: #111111;

  --color-primary-50: #fef2f2;
  --color-primary-100: #ffe2e2;
  --color-primary-200: #ffc9c9;
  --color-primary-300: #ffa2a2;
  --color-primary-400: #ff6467;
  --color-primary-500: #fb2c36;
  --color-primary-600: #e7000b;
  --color-primary-700: #8a4cea;
  --color-primary-800: #7333d3;
  --color-primary-900: #82181a;
  
  --color-secondary-25: #fbfbff;
  --color-secondary-50: #f6f6fe;
  --color-secondary-100: #ececfd;
  --color-secondary-200: #dedeff;
  --color-secondary-300: #ccccfa;
  --color-secondary-400: #b7b7ff;
  --color-secondary-500: #a4a2fa;
  --color-secondary-600: #8080f2;
  --color-secondary-700: #5c46ce;
  --color-secondary-800: #5038ca;
  --color-secondary-900: #361fac;

  --color-red-50: #fef2f2;
  --color-red-100: #ffe2e2;
  --color-red-200: #ffc9c9;
  --color-red-300: #ffa2a2;
  --color-red-400: #ff6467;
  --color-red-500: #fb2c36;
  --color-red-600: #e7000b;
  --color-red-700: #c10007;
  --color-red-800: #9f0712;
  --color-red-900: #82181a;
  
  --color-purple-25: #fcfcfd;
  --color-purple-50: #f6f6fe;
  --color-purple-100: #ececfd;
  --color-purple-200: #dedeff;
  --color-purple-300: #ccccfa;
  --color-purple-400: #b7b7ff;
  --color-purple-500: #a0a0f5;
  --color-purple-600: #8080f2;
  --color-purple-700: #7e5ffb;
  --color-purple-800: #4b32c3;
  --color-purple-900: #5324c2;
  
  --color-pink-25: #fcfcfd;
  --color-pink-50: #f6f6fe;
  --color-pink-100: #ececfd;
  --color-pink-200: #dedeff;
  --color-pink-300: #ccccfa;
  --color-pink-400: #b7b7ff;
  --color-pink-500: #a0a0f5;
  --color-pink-600: #8080f2;
  --color-pink-700: #7b46ce;
  --color-pink-800: #6a33c2;
  --color-pink-900: #5324c2;

  --color-rose-25: #fff5f6;
  --color-rose-50: #fff1f3;
  --color-rose-100: #ffe4e8;
  --color-rose-200: #fecdd6;
  --color-rose-300: #fea3b4;
  --color-rose-400: #ff859b;


  --body-background-color: var(--color-white);
  --header-overlay-background-color: var(--color-white);
  --header-accent-color: var(--color-text-accent);
  --gnb-color: var(--color-base-900);


  /* --primary-color: #4361ee;
  --primary-light: rgba(67, 97, 238, 0.1);
  --secondary-color: #3f37c9;
  --accent-color: #4895ef;
  --success-color: #4cc9f0;
  --warning-color: #f72585;
  --text-color: #333;
  --text-light: #666;
  --text-muted: #888;
  --bg-color: #f8f9fa;
  --card-bg: #ffffff;
  --border-color: #e0e0e0;
  --sidebar-width: 260px;
  --sidebar-collapsed-width: 70px;
  --header-height: 70px;
  --shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  --transition: all 0.3s ease; */
  
  
}

/* 다크 모드 변수 */
[data-theme="dark"] {
  --color-text-base: #ffffff;
  --color-text-light: var(--color-base-300);
  /*
  --color-text-muted: #888;
  --color-text-transparent: transparent;

  --color-text-accent: #4895ef;
  --color-text-success: #4cc9f0;
  --color-text-warning: #f72585; */

  --color-base-50: #f8f7fc;
  --color-base-100: #f1edf7;
  --color-base-200: #e6e2f0;
  --color-base-300: #d0cbe0;
  --color-base-400: #78797e;
  --color-base-500: #69676e;
  --color-base-600: #57565a;
  --color-base-700: #434346;
  --color-base-800: #333333;
  --color-base-900: #111111;

  --body-background-color: #101828;
  --header-overlay-background-color: #1b2231;

  --header-accent-color: var(--color-secondary-500);
  --gnb-color: var(--color-white);


  
  /* --primary-color: #4361ee;
  --primary-light: rgba(67, 97, 238, 0.15);
  --secondary-color: #3f37c9;
  --accent-color: #4895ef;
  --success-color: #4cc9f0;
  --warning-color: #f72585;
  --text-color: #e0e0e0;
  --text-light: #a0a0a0;
  --text-muted: #888;
  --bg-color: #121212;
  --card-bg: #1e1e1e;
  --border-color: #333;
  --shadow: 0 4px 6px rgba(0, 0, 0, 0.3); */
}