@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

/* ===========================================
   THEME VARIABLES
   =========================================== */
:root {
  --primary: #BF5EFF;
  --primary-hover: #b258ee;
  --pink: #FF9EE2;
  --blue: #9ec5ff;
  --red:#f87171;
  --grad: linear-gradient(135deg, #FF9EE2 0%, #A871FF 100%);
  --grad-hover: linear-gradient(135deg, #f793d9 0%, #9c6aec 100%);
  --fontSans: 'Noto Sans KR', sans-serif;
  --radiusSm: 6px;
  --radiusMd: 10px;
  --radiusLg: 16px;
  --contPadding: 30px 1.5em 60px;
  --headerPadding: 0 1.5em;
  --footerTopM: 60px;
  --transition: 0.2s ease;
  --sidebarW: 220px;
  --gnbH: 56px;
  --sidebarCollapsed: 56px;
  --minW: 350px;
  --maxSub: 900px;
}
@media (max-width:900px){
  :root {
    --maxSub: 100%;
  }
}
@media (max-width:600px){
  :root {
    --contPadding: 20px 1em 50px;
    --headerPadding: 0 1em;
    --footerTopM: 50px;
  }
}

html[data-theme="dark"] {
  color-scheme: dark;
  --logo: url(../img/common/logo_dark.png);
  --bg: #0b0f14;
  --bgOp: #0b0f14ee;  
  --bgGrad: linear-gradient(180deg, #0b0f1400 0%, #0b0f14 100%);
  --pSoft: #bf5eff22;
  --surface: #131820;
  --surface1: #131820;
  --surface2: #25282e;
  --surface3: #303238;
  --fg: #e8eaf0;
  --fgMuted: #8a93a8;
  --fgDim: #555f75;
  --border: #333;
  --border2: #444;
  --hBtnBg: #25282e;
  --hBtnHover: #3f454d;
  --hBtnText: #e8eaf0;
  --sBtnText : #e8eaf0;
  --tagBg: #2a1f3d;
  --tagText: #efcdff;
  --atagBg: #131820;
  --inputBg: #25282e;
  --shadow: 0 4px 24px rgba(0,0,0,.5);
  --shadowCard:0 2px 12px rgba(0,0,0,.4);
  --aiMsg: #131820;
  --userMsg: #bf5eff22;
  --subMenu: #131820;
  --subMenu-hover: #25282e;
  --toastBg:#303238;
}

html[data-theme="light"] {
  color-scheme: light;
  --logo: url(../img/common/logo_light.png);
  --bg: #fff;
  --bgOp: #f4f2faee;
  --bgGrad: linear-gradient(180deg, #ffffff00 0%, #fff 100%);
  --pSoft: #faf4ff;
  --surface: #fff;
  --surface1: #f9f9f9;
  --surface2: #f0eef8;
  --surface3: #edeaf5;
  --fg:#1a1625;
  --fgMuted: #6b6480;
  --fgDim: #aaa5bb;
  --border: #e2ddf2;
  --border2: #d0caee;
  --hBtnBg:#BF5EFF;
  --hBtnHover: #cc7eff;
  --hBtnText: #fff;
  --sBtnText : #BF5EFF;
  --tagBg: #faefff;
  --tagText: #BF5EFF;
  --atagBg: #f5f3fc;
  --inputBg: #fff;
  --shadow: 0 4px 24px rgba(168,113,255,.1);
  --shadowCard:0 2px 12px rgba(168,113,255,.08);
  --aiMsg: #f9f9f9;
  --userMsg: #fbf5ff;
  --subMenu: #fcf9ff;
  --subMenu-hover: #faf4ff;
  --toastBg:#6d7075;
}

/*
=========================================================================
base CSS Document
=========================================================================
*/
/* reset */
body,p,div,span,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select {margin:0; padding:0;}
body,input,textarea,button,select {font-family: var(--fontSans);}
html,body{font-size:15px; line-height:1.5;}

*,*::before,*::after {box-sizing:border-box; margin:0; padding:0;}
body {background:var(--bg); color:var(--fg); min-height:100vh; overflow-x:hidden; transition:background var(--transition), color var(--transition);}
h1,h2,h3,h4,h5,h6 {font-size:1em;}
img,fieldset,button {border:0;}
textarea {overflow:auto;}
input[type=submit],input[type=button],button {cursor:pointer; border:none; box-shadow:none; border-radius:0; padding:0; overflow:visible; background:none;}
img {max-width:100%; display:block;}
address,em {font-style:normal;}
table {border-spacing:0; border-collapse:collapse;}
table,th,td {border:none;}
caption {overflow:hidden; line-height:0; text-indent:-2000em;}
legend,.hidden {padding:0; margin:0; overflow:hidden !important; text-indent:100%; white-space:nowrap; font-size:0;}
i {font-style:normal;}
select {background:var(--bg);}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display:block;}
figure {padding:0; margin:0;}
a {color:inherit;}
a:link,a:visited,a:hover,a:active,a:focus {text-decoration:none;}
ul,ol,li {list-style:none;}

/* placeholder */
input::placeholder,input::-webkit-input-placeholder,input:-ms-input-placeholder,
textarea::placeholder,textarea::-webkit-input-placeholder,textarea:-ms-input-placeholder {color:var(--fgDim);}

/* scrollbar */
* {scrollbar-width:thin;}

/* swiper 플래시 현상 방지 */
.swiper {visibility:hidden;}
.swiper.swiper-initialized {visibility:visible;}

/* input number */
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0;}
/* Firefox  */
input[type='number'] { -moz-appearance: textfield;}