/* --- 스니펫 ID: 2556 | 다크 모드 스위치 리뉴얼 - 애플 2 svg 에러 수정 --- */
/* 위치 */

#dark-mode-toggle{
position:fixed;
bottom:20px;
left:20px;
z-index:10000;
}


/* 스위치 */

.apple-toggle{
width:60px;
height:32px;
border-radius:20px;
background:#e9e9ea;
position:relative;
cursor:pointer;
transition:.35s;

box-shadow:
inset 0 1px 3px rgba(0,0,0,0.15);
}


/* 슬라이더 */

.apple-toggle::after{
content:"";
position:absolute;

width:26px;
height:26px;

border-radius:50%;

top:3px;
left:3px;

background:white;

transition:.35s;

box-shadow:
0 2px 6px rgba(0,0,0,0.25);
z-index: 2;
}


/* 아이콘 */

.toggle-icon{

position:absolute;
top:50%;
transform:translateY(-50%);

width:16px;
height:16px;

opacity:.6;

transition:.35s;
z-index: 3;
}


/* sun */

.icon-sun{

left:8px;
opacity:0;

}


/* moon */

.icon-moon{

right:8px;
color:#a87ffb;

}


/* hover */

.apple-toggle:hover{
transform:scale(1.05);
}


/* ------------------------------------------------
   DARK MODE
------------------------------------------------ */

body.dark-theme .apple-toggle{

background:#2c2c2e;

box-shadow:
inset 0 1px 3px rgba(0,0,0,0.6),
0 0 8px rgba(90,120,255,0.25); /* glow */

}


body.dark-theme .apple-toggle::after{

left:31px;
background:#1c1c1e;

box-shadow:
0 2px 6px rgba(0,0,0,0.6);

}


/* 아이콘 페이드 */

body.dark-theme .icon-sun{

opacity:.8;
color:#eebf5e;

}

body.dark-theme .icon-moon{

opacity:0;

}


/* 클릭 느낌 */

.apple-toggle:active::after{

transform:scale(.9);

}