/* =========================================================
   状态开关 / Switch 修复
   解决表格状态按钮太浅、看不清问题
   ========================================================= */

/* Layui 默认开关 */
.layui-form-switch {
    min-width: 54px !important;
    height: 28px !important;
    line-height: 26px !important;
    padding: 0 10px !important;
    margin-top: 0 !important;
    border: 2px solid #cbd5e1 !important;
    border-radius: 999px !important;
    background: #e5e7eb !important;
    background-color: #e5e7eb !important;
    color: #334155 !important;
    box-sizing: border-box !important;
    box-shadow: inset 0 1px 3px rgba(15, 23, 42, 0.12) !important;
}

/* 关闭状态文字 */
.layui-form-switch em {
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    margin-left: 24px !important;
    margin-right: 4px !important;
}

/* 开关圆点 */
.layui-form-switch i {
    width: 20px !important;
    height: 20px !important;
    top: 2px !important;
    left: 3px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.25) !important;
}

/* 开启状态 */
.layui-form-onswitch {
    border-color: #6d5dfc !important;
    background: linear-gradient(135deg, #6d5dfc, #7c3aed) !important;
    background-color: #6d5dfc !important;
    color: #ffffff !important;
    box-shadow: 0 6px 16px rgba(109, 93, 252, 0.25) !important;
}

/* 开启状态文字 */
.layui-form-onswitch em {
    color: #ffffff !important;
    margin-left: 4px !important;
    margin-right: 24px !important;
    font-weight: 900 !important;
}

/* 开启状态圆点位置 */
.layui-form-onswitch i {
    left: calc(100% - 23px) !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
}

/* 如果页面使用 checkbox/switch 原生样式 */
input[type="checkbox"],
input[type="radio"] {
    accent-color: #6d5dfc !important;
}

/* 通用 toggle / switch 类名 */
.switch,
.toggle,
.status-switch,
.status-toggle,
.el-switch,
.el-switch__core {
    border-radius: 999px !important;
    border: 2px solid #cbd5e1 !important;
    background: #e5e7eb !important;
    background-color: #e5e7eb !important;
    box-shadow: inset 0 1px 3px rgba(15, 23, 42, 0.12) !important;
}

/* Element UI 开关开启状态 */
.el-switch.is-checked .el-switch__core {
    border-color: #6d5dfc !important;
    background: #6d5dfc !important;
    background-color: #6d5dfc !important;
}

/* 表格里的状态列居中更清楚 */
td .layui-form-switch,
.layui-table td .layui-form-switch {
    display: inline-block !important;
    vertical-align: middle !important;
}

/* 防止全白主题覆盖 switch 背景 */
.layui-form-switch[style],
.layui-form-switch *,
.layui-form-onswitch[style],
.el-switch__core[style] {
    opacity: 1 !important;
}

/* 禁止之前的全白主题把 switch 背景刷白 */
.layui-form-switch,
.layui-form-switch i,
.layui-form-onswitch,
.el-switch__core,
.switch,
.toggle,
.status-switch {
    background-image: none;
}

/* 开启状态重新补渐变 */
.layui-form-onswitch {
    background-image: linear-gradient(135deg, #6d5dfc, #7c3aed) !important;
}
