/*
 * stage-theme.css —— 后台框架统一主题（一份文件管所有框架页 + 内容页）
 * 引用位置：stage/index.html、stage/app/{plat,agent,sw,xqs}/index.html、stage/home.html，
 *           以及 login.html / register.html / signupAgent.html（靠 body.login-page 限定作用域），
 *           必须放在 INSPINIA main.css / iview.css / element index.css 之后才能生效。
 *
 * 换色步骤：改下面 :root 里的 6 个色值即可；另有 3 处主色派生色无法用变量计算
 * （老浏览器不支持 color-mix），需一并手改：
 *   --ny-soft 的 rgba(248,50,68,.08)、.ivu-input focus 的 rgba(248,50,68,.15)、
 *   淡底 #fef4f5 / 禁用 #fcb0b8 / 描边 #fca9b3 / 浅线 #f6dfe2。
 * 单个页面想换风格，在本页 <link> 之后再写一段 <style>:root{--ny-main:#xxxxxx;...}</style> 覆盖。
 */

/* ==================== 1. 色板 ==================== */
:root {
    --ny-main: #F83244;                 /* 主色 */
    --ny-main-lite: #ff5c6c;            /* hover 提亮 */
    --ny-main-deep: #d8213c;            /* 侧栏渐变下端 / 按下态 */
    --ny-sub: #cf1f37;                  /* 二级子菜单面板（主色暗调） */
    --ny-sub-deep: #b81a30;             /* 三级及更深子菜单面板 */
    --ny-soft: rgba(248, 50, 68, .08);  /* 浅色底（hover 背景、选中项淡底） */
    --ny-line: #ebedf2;                 /* 分隔线 */
    --ny-text: #5a5f6b;                 /* 正文次要文字 */
}

/* ==================== 2. 背景全白 ==================== */
/* 这里必须用 background-color 而不是 background 简写：简写会把 background-image 重置为 none，
   而 !important 的外部样式优先级高于 body 上的内联 style，
   会把 login.html / register.html / signupAgent.html / showCode.html / registerPhone.html
   写在内联 style 里的登录页背景图直接抹掉 */
html, body { background-color: #fff !important; }
body.gray-bg, .gray-bg, #page-wrapper, .J_mainContent, .content-tabs,
nav.navbar-static-top, .footer, .border-bottom { background-color: #fff !important; }
.ivu-notice { width: 535px; }

/* ==================== 3. 左侧导航 ==================== */
nav.navbar-default.navbar-static-side {
    background: linear-gradient(180deg, var(--ny-main) 0%, var(--ny-main-deep) 100%) !important;
    border-right: none !important;
    box-shadow: 2px 0 12px rgba(216, 33, 60, .18);
}
.sidebar-collapse, .sidebar-collapse .nav, .slimScrollDiv { background: transparent !important; }
.navbar-static-side .slimScrollBar { background: rgba(255, 255, 255, .55) !important; }
.navbar-static-side .slimScrollRail { background: rgba(0, 0, 0, .10) !important; }

/* 品牌区（logo + 站点名） */
#side-menu li.nav-header { background: rgba(0, 0, 0, .12) !important; padding-bottom: 16px !important; }
.nav-header .dropdown.profile-element, .nav-header .logo-element,
.nav-header a, .nav-header span { color: #fff !important; }
.nav-header .dropdown.profile-element { letter-spacing: .5px; text-shadow: 0 1px 2px rgba(0, 0, 0, .2); }
.nav-header .logo-element img { filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .25)); }

/*
 * 主题原规则 .nav > li.active { background:#293846; border-left:4px solid #19aa8d; }
 * 刷在 li 本身，必须先中和，否则半透明白叠上去会发脏灰蓝，还会多一条绿色左框
 */
#side-menu, #side-menu > ul { background: transparent !important; }
#side-menu li.active { background: transparent !important; border-left-color: transparent !important; }
#side-menu > li { border-bottom: 1px solid rgba(255, 255, 255, .08); }
#side-menu > li:last-child { border-bottom: none; }
#side-menu > li > a {
    color: rgba(255, 255, 255, .92) !important;
    background: transparent !important;
    padding: 13px 15px;
    border-left: 3px solid transparent;
    transition: all .18s ease;
}
#side-menu > li > a:hover, #side-menu > li > a:focus {
    background: rgba(255, 255, 255, .12) !important;
    color: #fff !important;
    border-left-color: rgba(255, 255, 255, .85);
}
#side-menu > li.active > a {
    background: #fff !important;
    color: var(--ny-main) !important;
    font-weight: 600;
    border-left-color: #fff;
}
#side-menu > li > a > i { color: rgba(255, 255, 255, .88) !important; width: 18px; text-align: center; }
#side-menu > li.active > a > i { color: var(--ny-main) !important; }
#side-menu .fa.arrow { color: rgba(255, 255, 255, .7) !important; }
#side-menu > li.active .fa.arrow { color: var(--ny-main) !important; }

/* 二 / 三级菜单：主色暗调实色面板，不用半透黑叠渐变（会发闷） */
#side-menu ul.nav-second-level, #side-menu ul.nav-third-level {
    background: var(--ny-sub) !important;
    padding: 0 0 4px;
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, .10);
}
/*
 * 三 / 四级菜单：menu-item 模板是递归的，DOM 里并不会出现 nav-third-level
 * （全站模板 0 处），更深层仍然是嵌套的 ul.nav-second-level，
 * 所以按嵌套层级逐层加深底色 + 加大缩进；nav-third-level 选择器一并保留兼容。
 */
#side-menu ul.nav-second-level ul.nav-second-level,
#side-menu ul.nav-third-level {
    background: var(--ny-sub-deep) !important;
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, .12);
}
#side-menu ul.nav-second-level > li > a,
#side-menu ul.nav-third-level > li > a {
    color: rgba(255, 255, 255, .86) !important;
    background: transparent !important;
    font-size: 13px;
    font-weight: 500;
    padding: 9px 15px 9px 38px;
    border-left: 3px solid transparent;
    transition: all .18s ease;
}
#side-menu ul.nav-second-level ul.nav-second-level > li > a,
#side-menu ul.nav-third-level > li > a { padding-left: 54px; font-size: 12.5px; }
#side-menu ul.nav-second-level ul.nav-second-level ul.nav-second-level > li > a { padding-left: 68px; }
#side-menu ul.nav-second-level > li > a:hover, #side-menu ul.nav-second-level > li > a:focus {
    background: rgba(255, 255, 255, .14) !important;
    color: #fff !important;
    border-left-color: rgba(255, 255, 255, .6);
}
#side-menu ul.nav-second-level > li.active > a,
#side-menu ul.nav-third-level > li.active > a {
    background: rgba(255, 255, 255, .20) !important;
    color: #fff !important;
    font-weight: 600;
    border-left-color: #fff;
}

/* 收起态（mini-navbar）：主题的 #2f4050 弹层改为跟随主色 */
body.mini-navbar #side-menu ul.nav-second-level,
body.mini-navbar #side-menu ul.nav-third-level {
    background: var(--ny-main) !important;
    border-radius: 0 8px 8px 0;
    box-shadow: 3px 6px 16px rgba(216, 33, 60, .3);
}
body.mini-navbar #side-menu ul.nav-second-level > li > a,
body.mini-navbar #side-menu ul.nav-third-level > li > a { color: #fff !important; background: transparent !important; }
body.mini-navbar #side-menu ul.nav-second-level > li > a:hover { background: rgba(255, 255, 255, .16) !important; }

/* ==================== 4. 顶部工具栏 ==================== */
#page-wrapper > .border-bottom { border-bottom: 1px solid var(--ny-line) !important; }
nav.navbar-static-top { border: none !important; }
.navbar-top-links > li > a { color: var(--ny-text) !important; background: transparent !important; transition: all .18s ease; }
.navbar-top-links > li > a:hover { color: var(--ny-main) !important; background: var(--ny-soft) !important; }
.minimalize-styl-2, .navbar-minimalize {
    background: #fff !important;
    color: var(--ny-main) !important;
    border: 1px solid var(--ny-line) !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06) !important;
    border-radius: 8px !important;
}
.minimalize-styl-2:hover { background: var(--ny-soft) !important; border-color: var(--ny-main) !important; }

/* ==================== 5. 选项卡 ==================== */
.content-tabs { border-bottom: 1px solid var(--ny-line) !important; }
.page-tabs-content > a.J_menuTab {
    color: #666 !important;
    background: #fff !important;
    border-right: 1px solid var(--ny-line) !important;
    transition: all .18s ease;
}
.J_menuTab:hover { color: var(--ny-main) !important; background: var(--ny-soft) !important; }
.J_menuTab.active {
    color: var(--ny-main) !important;
    font-weight: 600;
    background: #fff !important;
    box-shadow: inset 0 -2px 0 var(--ny-main);
}
.roll-nav { color: #8c92a0 !important; background: #fff !important; border-left: 1px solid var(--ny-line) !important; }
.roll-nav:hover { color: var(--ny-main) !important; background: var(--ny-soft) !important; }
.J_tabClose { border: none !important; }

/* ==================== 6. 页脚 ==================== */
.footer { border-top: 1px solid var(--ny-line) !important; color: #a7b1c2 !important; }
.footer a { color: #909399 !important; }
.footer a:hover { color: var(--ny-main) !important; }

/* ==================== 7. layer 弹窗 ==================== */
.layui-layer-btn .layui-layer-btn0 { background-color: var(--ny-main) !important; border-color: var(--ny-main) !important; }
.layui-layer-title {
    background: #fff !important;
    color: #303133 !important;
    border-bottom: 1px solid var(--ny-line) !important;
    font-weight: 600;
}
.layui-layer-setwin a { color: var(--ny-main) !important; }

/* ==================== 8. iView 组件主色 ==================== */
.ivu-btn-primary { background-color: var(--ny-main) !important; border-color: var(--ny-main) !important; }
.ivu-btn-primary:hover { background-color: var(--ny-main-lite) !important; border-color: var(--ny-main-lite) !important; }
.ivu-btn-text:hover { color: var(--ny-main) !important; }
.ivu-tabs-ink-bar { background-color: var(--ny-main) !important; }
.ivu-tabs-nav .ivu-tabs-tab:hover, .ivu-tabs-nav .ivu-tabs-tab-active { color: var(--ny-main) !important; }
.ivu-radio-checked .ivu-radio-inner { border-color: var(--ny-main) !important; background: var(--ny-main) !important; }
.ivu-radio-wrapper:hover .ivu-radio-inner { border-color: var(--ny-main) !important; }
.ivu-input:focus, .ivu-input-focused, .ivu-input:hover {
    border-color: var(--ny-main) !important;
    box-shadow: 0 0 0 2px rgba(248, 50, 68, .15) !important;
}
.ivu-page-item-active { border-color: var(--ny-main) !important; }
.ivu-page-item-active a { color: var(--ny-main) !important; }
.ivu-page-prev:hover, .ivu-page-next:hover, .ivu-page-item:hover { border-color: var(--ny-main) !important; }
.ivu-page-item:hover a { color: var(--ny-main) !important; }

/* ==================== 9. Element-UI 组件主色 ==================== */
/* 该版本 theme-chalk 未使用 CSS 变量（index.css 中无 --el-color-primary），只能逐组件覆盖 */
#rrapp .el-card { border: 1px solid #eef0f4; border-radius: 10px; background: #fff; box-shadow: 0 1px 6px rgba(0, 0, 0, .04) !important; }
#rrapp .el-card__header { padding: 12px 18px; border-bottom: 1px solid #f2f3f6; background: #fff; border-radius: 10px 10px 0 0; }
#rrapp .el-card__header > div > span:first-child, #rrapp .el-card__header > span:first-child {
    display: inline-block;
    padding-left: 9px;
    border-left: 3px solid var(--ny-main);
    font-weight: 600;
    line-height: 1.25;
    color: #303133;
}
#rrapp .el-card__body { background: #fff; }

.el-button--primary { background-color: var(--ny-main); border-color: var(--ny-main); }
.el-button--primary:hover, .el-button--primary:focus { background-color: var(--ny-main-lite); border-color: var(--ny-main-lite); }
.el-button--primary.is-active { background-color: var(--ny-main-deep); border-color: var(--ny-main-deep); }
.el-button--primary.is-disabled, .el-button--primary.is-disabled:hover,
.el-button--primary.is-disabled:focus, .el-button--primary.is-disabled:active {
    background-color: #fcb0b8;
    border-color: #fcb0b8;
}
.el-button--primary.is-plain { background: #fef4f5; border-color: #fca9b3; color: var(--ny-main); }
.el-button--primary.is-plain:hover, .el-button--primary.is-plain:focus { background: var(--ny-main); border-color: var(--ny-main); color: #fff; }
.el-button--text { color: var(--ny-main); }
.el-button--text:hover, .el-button--text:focus { color: var(--ny-main-lite); }

.el-radio-button__inner:hover { color: var(--ny-main); }
.el-radio-button__orig-radio:checked + .el-radio-button__inner {
    background-color: var(--ny-main);
    border-color: var(--ny-main);
    box-shadow: -1px 0 0 0 var(--ny-main);
}
.el-radio-button__orig-radio:disabled:checked + .el-radio-button__inner { background-color: #fcb0b8; border-color: #fcb0b8; }
.el-radio__inner:hover, .el-checkbox__inner:hover, .el-checkbox__input.is-focus .el-checkbox__inner { border-color: var(--ny-main); }
.el-radio__input.is-checked .el-radio__inner, .el-checkbox__input.is-checked .el-checkbox__inner,
.el-checkbox__input.is-indeterminate .el-checkbox__inner { background-color: var(--ny-main); border-color: var(--ny-main); }
.el-radio__input.is-checked + .el-radio__label, .el-checkbox__input.is-checked + .el-checkbox__label { color: var(--ny-main); }

.el-input__inner:focus, .el-textarea__inner:focus, .el-select .el-input.is-focus .el-input__inner { border-color: var(--ny-main); }
.el-select-dropdown__item.selected { color: var(--ny-main); }
.el-range-editor.is-active, .el-range-editor.is-active:hover { border-color: var(--ny-main); }
.el-date-table td.current:not(.disabled) span, .el-date-table td.start-date span, .el-date-table td.end-date span { background-color: var(--ny-main); }
.el-date-table td.today span, .el-date-table td.available:hover, .el-date-picker__header-label:hover { color: var(--ny-main); }
.el-date-table td.in-range div, .el-month-table td.in-range div, .el-year-table td.in-range div { background-color: #fef4f5; }
.el-month-table td.current:not(.disabled) .cell, .el-year-table td.current:not(.disabled) .cell { color: var(--ny-main); }

.el-tabs__item:hover, .el-tabs__item.is-active { color: var(--ny-main); }
.el-tabs__active-bar { background-color: var(--ny-main); }
.el-pagination button:hover, .el-pager li:not(.disabled).active { color: var(--ny-main); }
.el-pagination.is-background .el-pager li:not(.disabled).active { background-color: var(--ny-main); }
.el-table__body tr.current-row > td.el-table__cell { background: #fef4f5 !important; }
.el-carousel__indicator .el-carousel__button { background: #dcdfe6; }
.el-carousel__indicator.is-active .el-carousel__button { background: var(--ny-main); }
.el-timeline-item__node--primary { background-color: var(--ny-main); }
.el-timeline-item__tail { border-left: 1px solid #f6dfe2; }
.el-loading-spinner .path { stroke: var(--ny-main); }
.el-loading-spinner .el-loading-text { color: var(--ny-main); }
.el-switch.is-checked .el-switch__core { background-color: var(--ny-main); border-color: var(--ny-main); }
.el-link.el-link--primary { color: var(--ny-main); }
/* 10 个内容页在自己的 <style> 里把 .avatar-uploader .el-upload:hover 写死成 #409EFF，
   而页面内联 <style> 在主题 link 之后，同特异度下后者胜；这里多叠一层 body 抬特异度压回去 */
body .el-upload--picture-card:hover, body .avatar-uploader .el-upload:hover { border-color: var(--ny-main); }

/* ==================== 10. 登录 / 注册 / 代理开户 / 验码页 ==================== */
/* 适用：login.html、register.html、signupAgent.html、showCode.html、registerPhone.html
   （5 页 body 都是 class="signin hold-transition login-page"）。
   用 body.login-page 限定作用域，不会污染后台其它页面的 .ivu-btn-success（“成功”绿）；
   选器多写一层 body.signin 是因为 login.css 里有 body.signin{background:url(login_bg.jpg)...}，
   其特异度 (0,1,1) 高于单写 .login-page (0,1,0)，会被它抢回旧图 */

/* 10.1 页面背景：主色渐变，带高光和沉底，呼应原图的几何层次感 */
body.signin.login-page {
    min-height: 100vh;
    /* padding 不是装饰：.signinpanel 的 margin-top 会和 body 发生 margin 塌陷，
       把 body 盒子整体下推，而 background-attachment:fixed 的背景仍只在 body 盒内绘制，
       顶部就会露出一条 html 的白底。加 padding 阻断塌陷 */
    padding-top: 6vh;
    padding-bottom: 6vh;
    box-sizing: border-box;
    background-image:
        radial-gradient(1100px 620px at 8% 4%, rgba(255, 255, 255, .22), transparent 62%),
        radial-gradient(880px 560px at 94% 98%, rgba(60, 2, 12, .38), transparent 62%),
        linear-gradient(135deg, var(--ny-main, #F83244) 0%, var(--ny-main-deep, #d8213c) 54%, #8c1122 100%) !important;
    background-attachment: fixed;
    background-repeat: no-repeat;
}

/* 10.2 卡片：白底 + 大圆角 + 深阴影，从红背景里抬出来 */
body.login-page .signinpanel {
    /* 上下间距由 body 的 padding 兜住，这里只压掉 login.css 原来自带的 margin:8% auto，
       避免它的 margin-top 再次和 body 塌陷 */
    margin: 50px auto 0;
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(92, 7, 22, .40) !important;
}
/* INSPINIA 的 .row{border-bottom:1px solid #e7eaec} 会在白卡里多划一条线 */
body.login-page .row { border-top: none; border-bottom: none; }
/* login.css 的 .signinpanel form 自带一圈 rgba(255,255,255,.3) 描边和
   box-shadow:0 3px 0 rgba(12,12,12,.03) 实底投影；在白卡上描边看不见，
   但投影会显形成表单底部一条多余的横线 */
body.login-page .signinpanel form {
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
}
body.login-page .apply_form { padding-top: 36px; }
body.login-page .apply_title { color: #1f2329; font-weight: 600; letter-spacing: .5px; }
body.login-page .line_style {
    width: 56px;
    height: 4px;
    border-radius: 2px;
    background-image: linear-gradient(90deg, var(--ny-main), var(--ny-main-lite));
}

/* 10.3 输入框：原本 border:0 + 近白底，在白卡上没对比度；补描边 + 聚焦主色 */
body.login-page .apply_detail .form-group input {
    background: #f7f8fa;
    border: 1px solid #e3e6ec;
    transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}
body.login-page .apply_detail .form-group input:hover { background: #f1f3f6; }
body.login-page .apply_detail .form-group input:focus {
    background: #fff;
    border-color: var(--ny-main);
    box-shadow: 0 0 0 3px rgba(248, 50, 68, .12);
}
/* 不在 .apply_detail 里的 iView 输入框兜底 */
body.login-page .ivu-input:hover { border-color: var(--ny-main); }
body.login-page .ivu-input:focus {
    border-color: var(--ny-main);
    box-shadow: 0 0 0 3px rgba(248, 50, 68, .12);
}

/* 10.4 主按钮：主色渐变 + 投影，悬停上浮 */
body.login-page .ivu-btn-success {
    background-color: var(--ny-main);
    background-image: linear-gradient(135deg, var(--ny-main-lite), var(--ny-main) 52%, var(--ny-main-deep));
    border: none;
    box-shadow: 0 10px 24px rgba(216, 33, 60, .32);
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
body.login-page .ivu-btn-success:hover, body.login-page .ivu-btn-success:focus {
    background-image: linear-gradient(135deg, var(--ny-main-lite), var(--ny-main-lite) 60%, var(--ny-main));
    border: none;
    transform: translateY(-2px);
    box-shadow: 0 16px 30px rgba(216, 33, 60, .42);
}
body.login-page .ivu-btn-success:active {
    transform: translateY(0);
    background-image: linear-gradient(135deg, var(--ny-main-deep), var(--ny-main));
    box-shadow: 0 6px 14px rgba(216, 33, 60, .34);
}
/* 次级（企业注册 / 代理注册 / 返回登录）：主色描边胶囊，悬停反色 */
body.login-page .ivu-btn-dashed {
    color: var(--ny-main);
    background: #fff;
    border: 1px solid #f6b6bd;
    border-radius: 40px;
    transition: all .18s ease;
}
body.login-page .ivu-btn-dashed:hover, body.login-page .ivu-btn-dashed:focus {
    color: #fff;
    background: var(--ny-main);
    border-color: var(--ny-main);
    box-shadow: 0 8px 18px rgba(216, 33, 60, .22);
}

/* 10.5 卡内页脚：白底上原来的半透明白分隔线看不见，改浅灰线 */
body.login-page .signup-footer {
    border-top: 1px solid #eef0f4;
    color: #98a0ac;
    font-size: 12px;
}
body.login-page .signup-footer .pull-left { color: #98a0ac; }
body.login-page .signup-footer a { color: var(--ny-main); }
body.login-page .signup-footer a:hover { color: var(--ny-main-lite); }
/* login.html 的 footer 里版权信息整段被注释掉了，只剩一个空 div：
   它会表现成卡片底部一截 60px 空白 + 一条悬空的分隔线。空 div 用 :empty 判不出来
   （注释节点和空白文本也算内容），改用 :has() 判“有没有元素子节点”。
   老浏览器不支持 :has() 时这条规则整体被丢弃，退化成现在的样子，不会更差 */
body.login-page .signup-footer:not(:has(*)) { display: none; }

/* 10.6 registerPhone.html 的“获取短信验证码”：markup 里只写了 class，
   没写 type，默认是 iView 灰按钮，在主色表单里很突兀 */
body.login-page .ivu-btn.weui-vcode-btn {
    color: var(--ny-main);
    background: #fff;
    border: 1px solid #f6b6bd;
    border-radius: 40px;
    height: 58px;
    transition: all .18s ease;
}
body.login-page .ivu-btn.weui-vcode-btn:hover, body.login-page .ivu-btn.weui-vcode-btn:focus {
    color: #fff;
    background: var(--ny-main);
    border-color: var(--ny-main);
}
/* 倒计时中（disabled）：内联 style 写了 color:#666，这里同样用内联级特异度压回中性灰 */
body.login-page .ivu-btn.weui-vcode-btn.ivu-btn-disabled,
body.login-page .ivu-btn.weui-vcode-btn[disabled] {
    color: #a8adb5 !important;
    background: #f2f3f5;
    border-color: #e3e6ec;
}

