/* ================================================================
 * RM-324 客户后台登录页 · 整页蓝色改版 + 左图 5 场景轮播
 * 配色令牌：主蓝 #4588CE / 信息蓝 #51A6EC
 *          登录按钮渐变 linear-gradient(90deg,#4588CE,#51A6EC)
 *          文案白 #FFFFFF / 激活圆点 #4588CE
 * 认证逻辑（login.js）与表单字段/name 一律不动，此处仅换皮肤 + 轮播样式
 * ================================================================ */

body { font-family: "\5FAE\8F6F\96C5\9ED1", sans-serif; }
.login-layout { background: #edeff2; }

/* 页面底：浅灰 */
.main-content {
    min-height: 100vh;
    background: #edeff2;
    box-sizing: border-box;
    display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-orient: vertical; -webkit-box-direction: normal;
    -ms-flex-direction: column; flex-direction: column;
}

/* 居中容器（顶栏内容 + 卡片共用） */
.main_c { width: 1200px; max-width: 94%; margin: 0 auto; position: relative; }

/* ---------------- 顶栏 ---------------- */
.top_nav {
    -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto;
    height: 68px;
    background: #ffffff;
    border-bottom: 1px solid #eceef1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.top_nav .main_c { height: 68px; line-height: 68px; }
.main_c .logo {
    display: inline-block;
    width: 148px; height: 38px;
    margin: 0 0 0 4px;
    vertical-align: middle;
    background: url("../images/cms_logo.png") no-repeat left center;
    background-size: contain;
}
/* 「十二年老牌厂商」蓝色胶囊标签（纯 CSS，不切图） */
.brand-tag {
    display: inline-block;
    vertical-align: middle;
    margin-left: 14px;
    padding: 4px 14px;
    line-height: 1.4;
    font-size: 13px;
    color: #4588CE;
    background: #eaf3fc;
    border: 1px solid #cfe4f7;
    border-radius: 12px;
}
.call {
    position: absolute; right: 0; top: 0;
    height: 68px;
    display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-align: center; -ms-flex-align: center; align-items: center;
}
.call .call_icon {
    width: 22px; height: 22px;
    display: inline-block;
    margin-right: 9px;
    vertical-align: middle;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24'%3E%3Cpath fill='%23333a44' d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E") no-repeat center;
    background-size: contain;
}
.call .call_w { display: inline-block; vertical-align: middle; line-height: 1.25; }
.call_us { display: block; font-size: 12px; color: #8a9099; }
.tell_num { display: block; font-size: 20px; font-weight: bold; color: #333a44; }

/* ---------------- 登录卡片 ---------------- */
.login-main {
    -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto;
    margin-top: 0;
    display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-orient: vertical; -webkit-box-direction: normal;
    -ms-flex-direction: column; flex-direction: column;
    -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
    padding: 34px 0;
    box-sizing: border-box;
}
.login_card {
    display: -webkit-box; display: -ms-flexbox; display: flex;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(20, 40, 80, 0.10);
    overflow: hidden;
    min-height: 440px;
}

/* ---------------- 左区：轮播 ---------------- */
.hero-carousel {
    position: relative;
    -webkit-box-flex: 0; -ms-flex: 0 0 68%; flex: 0 0 68%;
    max-width: 68%;
    overflow: hidden;
    background: #1f2733; /* 图裂兜底深色底 */
}
.hero-slide {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    opacity: 0;
    -webkit-transition: opacity 0.5s ease-in-out;
    transition: opacity 0.5s ease-in-out;
    background-color: #1f2733; /* 图加载失败时露出的深色底 */
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.hero-slide.active { opacity: 1; }
/* 5 张背景图（路径相对本 css 文件） */
.hero-slide.hs-1 { background-image: url(../images/hero-1-dingwei.jpg); }
.hero-slide.hs-2 { background-image: url(../images/hero-2-kebai.jpg); }
.hero-slide.hs-3 { background-image: url(../images/hero-3-xundian.jpg); }
.hero-slide.hs-4 { background-image: url(../images/hero-4-xunjian.jpg); }
.hero-slide.hs-5 { background-image: url(../images/hero-5-kaiche.jpg); }
/* 底部深色渐变遮罩：兜底白字可读性 */
.hero-slide:after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 62%;
    background: -webkit-linear-gradient(bottom, rgba(15, 22, 33, 0.78) 0%, rgba(15, 22, 33, 0.22) 50%, rgba(15, 22, 33, 0) 100%);
    background: linear-gradient(to top, rgba(15, 22, 33, 0.78) 0%, rgba(15, 22, 33, 0.22) 50%, rgba(15, 22, 33, 0) 100%);
    pointer-events: none;
}
/* 文案叠加：左下角，标题在上、副标题在下，均白色 */
.hero-caption {
    position: absolute;
    left: 48px; bottom: 70px;
    z-index: 2;
    max-width: 92%;
}
.hero-caption .h-title {
    margin-bottom: 14px;
    font-size: 34px;
    font-weight: bold;
    line-height: 1.2;
    color: #FFFFFF;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
}
.hero-caption .h-sub {
    font-size: 18px;
    line-height: 1.4;
    color: #FFFFFF;
    white-space: nowrap; /* 副标题单行不折行 */
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
}
/* 底部圆点：左下一排 5 个，当前页加长成胶囊 + 主蓝高亮 */
.hero-dots {
    position: absolute;
    left: 48px; bottom: 34px;
    z-index: 3;
    display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-align: center; -ms-flex-align: center; align-items: center;
}
.hero-dot {
    width: 9px; height: 9px;
    margin-right: 8px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.45);
    cursor: pointer;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.hero-dot.active {
    width: 26px;
    background: #4588CE;
}
/* 左右半透明箭头 */
.hero-arrow {
    position: absolute;
    top: 50%;
    z-index: 3;
    width: 38px; height: 38px;
    margin-top: -19px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.28);
    color: #ffffff;
    font-size: 18px;
    line-height: 38px;
    text-align: center;
    cursor: pointer;
    -webkit-transition: background 0.2s ease;
    transition: background 0.2s ease;
}
.hero-arrow:hover { background: rgba(0, 0, 0, 0.46); }
.hero-arrow:focus { outline: 0; }
.hero-arrow.prev { left: 16px; }
.hero-arrow.next { right: 16px; }
.hero-arrow.prev:before { content: "\276E"; }
.hero-arrow.next:before { content: "\276F"; }

/* ---------------- 右区：表单（仅换蓝皮肤，字段/结构不变） ---------------- */
.form_side {
    -webkit-box-flex: 1; -ms-flex: 1 1 32%; flex: 1 1 32%;
    padding: 44px 36px;
    box-sizing: border-box;
    display: -webkit-box; display: -ms-flexbox; display: flex;
    -webkit-box-orient: vertical; -webkit-box-direction: normal;
    -ms-flex-direction: column; flex-direction: column;
    -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;
}
.form_side .form_act { width: 100%; float: none; background: none; }
.form_side .login_tit {
    height: auto;
    margin-bottom: 28px;
    text-align: center;
    font-size: 22px;
    font-weight: bold;
    line-height: normal;
    color: #4588CE; /* 表单标题 → 主蓝 */
}
.form_side .block { display: block; width: 100%; margin: 0; }
.form_side fieldset > .block { margin-bottom: 16px; }
.form_side .input-icon { display: block; width: 100%; }
.form_side .the-padding-left {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 11px 14px;
    font-size: 14px;
    color: #333;
    background-color: #ffffff;
    background-image: none;
    border: 1px solid #dfe3e8;
    border-radius: 6px;
}
.form_side .the-padding-left:focus {
    outline: 0;
    border-color: #4588CE;
    box-shadow: 0 0 0 2px rgba(69, 136, 206, 0.12);
}
.form_side label { color: #5a626c; font-size: 13px; cursor: pointer; }
.form_side .error { color: #e5504d; font-size: 13px; margin-bottom: 12px; }
.form_side .space { height: 6px; }
.form_side .space-4 { height: 0; }

/* 登录按钮：橙 → 蓝色横向渐变（.login_card 作用域，压过 bootstrap .btn-danger 等单类规则） */
.login_card .login_btn {
    width: 100%;
    display: block;
    margin: 4px auto 0;
    padding: 11px 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    color: #FFFFFF;
    border: none;
    border-radius: 6px;
    background-color: #4588CE; /* 兜底纯色 */
    background-image: -webkit-linear-gradient(left, #4588CE, #51A6EC);
    background-image: linear-gradient(90deg, #4588CE, #51A6EC);
}
.login_card .login_btn:hover { opacity: 0.92; }
.login_card .login_btn:focus { outline: 0; }

/* ---------------- 页脚（不变，仅配色协调） ---------------- */
.copyright {
    -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto;
    padding: 6px 0 30px;
    text-align: center;
    font-size: 13px;
    color: #9aa0a8;
}
