/**
 * AI 智能客服平台 - 亮色主题差异覆盖 - login.css
 * 结构样式复用 css/common/login.css（主题无关部分），本文件不重复结构，
 * 仅写亮色下的颜色/背景/边框/圆角等差异覆盖；全部规则带
 * html[data-theme="light"] 前缀，暗色主题零影响。
 * 作者: Calvin Liu <calvinliu@hk.chinamobile.com>
 * 版本: V1.0.0
 * 版权: MIT
 */

/* ===== 登录页提亮 ===== */
html[data-theme="light"] .login-card {
    background: rgba(255, 255, 255, 0.8);
    border-color: rgba(15, 23, 42, 0.1);
    box-shadow: 0 12px 40px rgba(15, 23, 42, 0.12);
}

/* ===== 登录页输入框提亮（深色半透明底改为浅色实底） ===== */
html[data-theme="light"] .login-input {
    background: rgba(255, 255, 255, 0.95) !important;
    color: var(--text-primary) !important;
    border-color: rgba(15, 23, 42, 0.14) !important;
}

html[data-theme="light"] .login-input input {
    background: transparent !important;
    color: var(--text-primary) !important;
}

/* 登录页夜景插画在亮色主题下略显突兀：降低不透明度并提亮，融入浅色背景 */
html[data-theme="light"] .login-scene {
    opacity: 0.5;
    filter: saturate(0.75) brightness(1.3);
}

/* ================= 第二轮：全面适配（验证码/登录插画/品牌/下拉/弹窗/tabs/监控） ================= */

/* ===== 1. 图形验证码：容器全透明，字符经滤镜加深在白底上清晰可读 ===== */
html[data-theme="light"] .login-captcha-box {
    background: transparent;
}

html[data-theme="light"] .login-captcha-box svg {
    /* 霓虹字符转深色：亮度压低、饱和度提升，亮黄/亮绿也可辨认 */
    filter: brightness(0.52) saturate(1.5);
}

/* ===== 2. 登录页 CSS 插画：夜景转日间办公场景，融入浅色页面背景 ===== */
html[data-theme="light"] .login-scene {
    opacity: 1;
    filter: none;
}

/* 月亮转太阳 */
html[data-theme="light"] .cc-moon {
    background: radial-gradient(circle at 35% 35%, #fffdf2, #ffe9a8 62%, #ffce6b);
    box-shadow: 0 0 30px rgba(255, 196, 66, 0.5);
    opacity: 0.95;
}

/* 楼体转浅色剪影，窗格灯点转白 */
html[data-theme="light"] .cc-skyline {
    opacity: 0.5;
}

html[data-theme="light"] .cc-skyline span {
    background-color: #c3cfec;
    border-top-color: rgba(15, 23, 42, 0.06);
    background-image: radial-gradient(rgba(255, 255, 255, 0.85) 1.2px, transparent 1.7px);
}

/* 吊灯头与光锥 */
html[data-theme="light"] .cc-lamp::before {
    background: #b7c2dd;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.18);
}

html[data-theme="light"] .cc-lamp i {
    background: linear-gradient(180deg, rgba(255, 205, 96, 0.22), rgba(255, 205, 96, 0));
}

/* 地面：浅灰蓝渐变，底部融入页面 */
html[data-theme="light"] .cc-floor {
    background: linear-gradient(180deg, rgba(238, 241, 248, 0) 0%, rgba(224, 231, 245, 0.55) 40%, rgba(210, 219, 238, 0.9) 100%);
}

html[data-theme="light"] .cc-floor::before {
    background: radial-gradient(ellipse at center, rgba(96, 165, 250, 0.1), transparent 70%);
}

/* 座椅 / 坐席背影 / 耳机 */
html[data-theme="light"] .cc-chair {
    background: linear-gradient(180deg, #d5ddf0, #c2cde8);
    border-color: rgba(15, 23, 42, 0.1);
}

html[data-theme="light"] .cc-shoulders {
    background: linear-gradient(180deg, #c7d2ec, #aebbdd);
    box-shadow: inset 0 2px 0 rgba(96, 165, 250, 0.35);
}

html[data-theme="light"] .cc-head {
    background: linear-gradient(180deg, #cfd9f0, #b8c5e4);
    box-shadow: inset 0 3px 0 rgba(96, 165, 250, 0.4);
}

html[data-theme="light"] .cc-band {
    border-color: #9fb0d4;
}

html[data-theme="light"] .cc-cup {
    background: #8fa2c8;
    border-color: rgba(96, 165, 250, 0.55);
    box-shadow: 0 0 8px rgba(96, 165, 250, 0.3);
}

html[data-theme="light"] .cc-mic {
    background: #8fa2c8;
}

html[data-theme="light"] .cc-mic::after {
    background: #0891b2;
    box-shadow: 0 0 6px rgba(96, 165, 250, 0.6);
}

/* 显示器：亮框浅屏 */
html[data-theme="light"] .cc-monitor {
    background: #f4f7fd;
    border-color: rgba(15, 23, 42, 0.14);
    box-shadow: 0 0 24px rgba(96, 165, 250, 0.12), 0 10px 24px rgba(15, 23, 42, 0.14);
}

html[data-theme="light"] .cc-screen {
    background: linear-gradient(160deg, #e8eefc, #dde6f8);
}

html[data-theme="light"] .cc-scr-line {
    background: rgba(100, 116, 155, 0.3);
}

html[data-theme="light"] .cc-stand {
    background: #b7c2dd;
}

/* 桌面 / 键盘 / 桌腿 */
html[data-theme="light"] .cc-board {
    background: linear-gradient(180deg, #ccd6ee, #b3c0e0);
    box-shadow: 0 3px 0 rgba(96, 165, 250, 0.18), 0 14px 28px rgba(15, 23, 42, 0.16);
}

html[data-theme="light"] .cc-keyboard {
    background: #dfe6f5;
    border-color: rgba(15, 23, 42, 0.14);
}

html[data-theme="light"] .cc-leg {
    background: linear-gradient(180deg, #b3c0e0, #9dadcf);
}

/* ================= 第四轮：经典 B 端商务白（浅灰底 + 纯白卡片） ================= */

/* 登录页场景画布：商务白下更柔和的浅色插画氛围 */
html[data-theme="light"] .login-scene {
    opacity: 0.85;
}

/* ===== 登录卡片：纯白 + 输入框标准商务白 ===== */
html[data-theme="light"] .login-card {
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

html[data-theme="light"] .login-input {
    background: #ffffff !important;
    border: 1px solid rgba(15, 23, 42, 0.18) !important;
    color: var(--text-primary) !important;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

html[data-theme="light"] .login-input::placeholder {
    color: rgba(100, 116, 139, 0.55) !important;
}

html[data-theme="light"] .login-input:focus {
    background: #ffffff !important;
    border-color: rgba(96, 165, 250, 0.55) !important;
    box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.14) !important;
}

html[data-theme="light"] .login-field:focus-within .login-field-icon {
    color: #60a5fa;
}

/* 登录卡片右侧面板：纯白实底（去磨砂半透明与彩色渐变） */
html[data-theme="light"] .login-main {
    background: #ffffff;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 16px 48px rgba(15, 23, 42, 0.1), 0 2px 8px rgba(15, 23, 42, 0.05);
}

/* 登录标题/副标题颜色修正 */
html[data-theme="light"] .login-main .login-title,
html[data-theme="light"] .login-main h2,
html[data-theme="light"] .login-main h3 {
    color: var(--text-primary);
    text-shadow: none;
}

html[data-theme="light"] .login-main .login-subtitle,
html[data-theme="light"] .login-main p {
    color: var(--text-secondary);
    text-shadow: none;
}