/* ============================================
   606导航 - 暗黑模式开关样式
   引入方式：在 common.css / admin.css 之后
   ============================================ */

/* ========== 开关容器 ========== */
.theme-switch {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}
.theme-switch #themeIcon,
.theme-switch #adminThemeIcon {
    font-size: 16px;
    color: rgba(255,255,255,.85);
    transition: color .3s;
}

/* ========== Switch 开关 ========== */
.switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
}
.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}
.slider {
    position: absolute;
    cursor: pointer;
    inset: 0;
    background: rgba(255,255,255,.25);
    border-radius: 24px;
    transition: .3s;
}
.slider::before {
    content: "";
    position: absolute;
    height: 18px;
    width: 18px;
    left: 3px;
    top: 3px;
    background: #fff;
    border-radius: 50%;
    transition: .3s;
    box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.switch input:checked + .slider {
    background: #6366F1;
}
.switch input:checked + .slider::before {
    transform: translateX(20px);
}

/* ========== 暗黑模式 body 背景 ========== */
body.dark-mode {
    background: #0F1419;
    color: #E2E8F0;
}

/* ========== 后台暗黑 body ========== */
.admin-body.dark-mode {
    background: #0F1419;
}

/* ========== 移动端适配 ========== */
@media (max-width: 768px) {
    .theme-switch { order: 2; }
    .switch { width: 40px; height: 22px; }
    .slider::before { height: 16px; width: 16px; }
    .switch input:checked + .slider::before { transform: translateX(18px); }
}