/* 易付通现代商户中心主题
 * 仅在 user_style=8 时启用，业务页面和链接保持原样。
 */
:root {
  --modern-primary: #2878f0;
  --modern-primary-deep: #195bc4;
  --modern-ink: #17243b;
  --modern-muted: #7f8da6;
  --modern-line: #e9eef6;
  --modern-surface: #ffffff;
  --modern-canvas: #f4f7fb;
}

.theme-modern {
  background: var(--modern-canvas) !important;
  color: var(--modern-ink);
  font-family: "Inter", "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .01em;
}

.theme-modern .app-header {
  height: 68px;
  background: var(--modern-surface);
  border-bottom: 1px solid var(--modern-line);
  box-shadow: 0 4px 18px rgba(35, 56, 94, .05);
}
.theme-modern.app-header-fixed { padding-top: 68px; }

.theme-modern .navbar-header {
  width: 240px;
  height: 68px;
  background: linear-gradient(145deg, #246ff0 0%, #3c9bf4 100%) !important;
}

.theme-modern .navbar-brand {
  width: 100%;
  height: 68px;
  line-height: 48px;
  padding: 10px 24px;
  color: #fff !important;
  font-size: 17px;
  font-weight: 700;
}

.theme-modern .navbar-brand > i {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-right: 8px;
  border-radius: 11px;
  background: rgba(255,255,255,.22);
}

.theme-modern .navbar-collapse {
  height: 68px !important;
  margin-left: 240px;
  background: #fff !important;
  border: 0;
}

.theme-modern .navbar-collapse .navbar-btn {
  color: var(--modern-muted);
  font-size: 18px;
  padding: 19px 24px;
}

.theme-modern .navbar-right > li > a {
  height: 68px;
  padding: 19px 24px;
  color: var(--modern-ink);
}

.theme-modern .navbar-right .avatar img {
  width: 34px;
  height: 34px;
  border: 2px solid #e8f0ff;
}

.theme-modern .app-aside {
  position: fixed;
  top: 68px;
  bottom: 0;
  left: 0;
  width: 240px;
  height: auto;
  background: #fff !important;
  border-right: 1px solid var(--modern-line);
  box-shadow: 3px 0 16px rgba(35, 56, 94, .03);
}

.theme-modern .navi-wrap { padding: 20px 14px; }
.theme-modern .navi > ul > li.hidden-folded { padding: 16px 13px 8px; color: #a9b4c6 !important; }
.theme-modern .navi > ul > li > a {
  min-height: 44px;
  margin: 3px 0;
  padding: 12px 14px;
  border-radius: 11px;
  color: #64738b;
  transition: .2s ease;
}
.theme-modern .navi > ul > li > a:hover { color: var(--modern-primary); background: #f2f6ff; }
.theme-modern .navi > ul > li.active > a,
.theme-modern .navi > ul > li.active > a:hover {
  color: var(--modern-primary) !important;
  background: #edf4ff;
  box-shadow: inset 3px 0 0 var(--modern-primary);
}
.theme-modern .navi > ul > li > a > i { width: 23px; margin-right: 5px; color: currentColor !important; }
.theme-modern .navi .nav-sub { padding-left: 18px; background: transparent; }
.theme-modern .navi .nav-sub li a { padding: 9px 14px 9px 31px; color: #8693a8; border-radius: 8px; }
.theme-modern .navi .nav-sub li.active a,
.theme-modern .navi .nav-sub li a:hover { color: var(--modern-primary); background: #f7faff; }
.theme-modern .navi .line { border-color: var(--modern-line); }

.theme-modern .app-content { margin-left: 240px; padding-top: 68px; background: var(--modern-canvas); }
.theme-modern .app-content-body { min-height: calc(100vh - 68px); }
.theme-modern .app-content-body > .bg-light {
  padding: 27px 32px 21px;
  background: transparent !important;
  border: 0;
}
.theme-modern .app-content-body > .bg-light h1 { color: var(--modern-ink); font-weight: 700; }
.theme-modern .app-content-body > .bg-light small { color: var(--modern-muted); }
.theme-modern .wrapper-md.control { padding: 0 32px 36px; }

.theme-modern .alert {
  border: 0;
  border-radius: 12px;
  box-shadow: 0 6px 18px rgba(35, 56, 94, .05);
}
.theme-modern .row-sm > [class*="col-"] { padding-left: 8px; padding-right: 8px; }
.theme-modern .row-sm { margin-left: -8px; margin-right: -8px; }
.theme-modern .panel {
  overflow: hidden;
  border: 1px solid var(--modern-line);
  border-radius: 14px;
  background: var(--modern-surface);
  box-shadow: 0 8px 24px rgba(31, 55, 94, .05);
}
.theme-modern .panel.item {
  min-height: 132px;
  padding: 18px 14px;
  text-align: left;
  border-top: 3px solid var(--modern-primary);
}
.theme-modern .panel.item .round {
  width: 44px;
  height: 44px;
  margin: 7px 0 0 8px;
  line-height: 42px;
  border: 0;
  color: var(--modern-primary);
  background: #edf4ff;
  font-size: 18px;
}
.theme-modern .panel.item .h1 { margin-top: 11px; color: var(--modern-ink) !important; font-size: 25px; font-weight: 700; }
.theme-modern .panel.item .text-muted { color: var(--modern-muted); font-size: 12px; }
.theme-modern .panel-heading {
  padding: 17px 20px;
  color: var(--modern-ink);
  background: #fff !important;
  border-bottom: 1px solid var(--modern-line);
}
.theme-modern .panel-heading h3,
.theme-modern .panel-heading .font-bold { font-weight: 700; }
.theme-modern .panel .bg-info { background: linear-gradient(135deg, #2878f0, #56a6ff) !important; }
.theme-modern .panel .bg-info a { background: rgba(255,255,255,.16) !important; border-color: rgba(255,255,255,.24) !important; }
.theme-modern .panel .hbox { background: #fbfcff !important; border-color: var(--modern-line) !important; }
.theme-modern .panel .hbox .col { padding: 17px 10px; color: var(--modern-muted); }
.theme-modern .panel .hbox .h3 { color: var(--modern-ink); font-weight: 700; }
.theme-modern .list-group-item { border-color: var(--modern-line); padding: 15px 20px; color: #5f6f87; }
.theme-modern .table { margin-bottom: 0; }
.theme-modern .table > thead > tr > th { color: #7d8aa0; font-size: 12px; font-weight: 600; border-bottom: 1px solid var(--modern-line); }
.theme-modern .table > tbody > tr > td { padding: 13px 15px; color: #55647b; border-color: #f0f3f8; }
.theme-modern .nav-tabs { border-bottom: 1px solid var(--modern-line); }
.theme-modern .nav-tabs > li > a { color: #8995a7; border: 0; border-bottom: 2px solid transparent; }
.theme-modern .nav-tabs > li.active > a,
.theme-modern .nav-tabs > li > a:hover { color: var(--modern-primary); border: 0; border-bottom: 2px solid var(--modern-primary); background: transparent; }
.theme-modern .form-control { height: 42px; border-color: #dfe6f0; border-radius: 9px; box-shadow: none; }
.theme-modern .form-control:focus { border-color: #8ebaff; box-shadow: 0 0 0 3px rgba(40,120,240,.12); }
.theme-modern .btn-primary { border: 0; border-radius: 9px; background: linear-gradient(135deg, #2878f0, #4c9af7); box-shadow: 0 6px 14px rgba(40,120,240,.18); }
.theme-modern .btn-info { border: 0; border-radius: 9px; background: #edf4ff; color: var(--modern-primary); }
.theme-modern .btn-rounded { border-radius: 9px; }
.theme-modern .app-footer { margin-left: 240px; background: transparent; color: #9aa6b7; }
.theme-modern .app-footer .wrapper { border-color: var(--modern-line) !important; background: transparent !important; }

/* 登录、注册等未登录页面共用的现代卡片风格 */
.theme-modern-login {
  min-height: 100vh;
  background: radial-gradient(circle at 15% 15%, #e7f2ff 0, transparent 35%), linear-gradient(145deg, #f5f8ff, #edf4fb);
  color: var(--modern-ink);
}
.theme-modern-login .container { width: 430px; max-width: calc(100% - 32px); margin-top: 8vh; padding: 38px 42px 28px; border: 1px solid rgba(255,255,255,.9); border-radius: 22px; background: rgba(255,255,255,.92); box-shadow: 0 20px 55px rgba(46, 84, 142, .16); }
.theme-modern-login .navbar-brand { display: block; float: none; height: auto; margin: 0 0 24px; padding: 0; color: var(--modern-primary); font-size: 23px; font-weight: 700; }
.theme-modern-login .wrapper.text-center strong { display: block; margin-bottom: 20px; font-size: 20px; }
.theme-modern-login .list-group-item { padding: 0; border: 1px solid #e4eaf3; border-radius: 10px; margin-bottom: 10px; background: #fbfcff; }
.theme-modern-login .list-group-item + .list-group-item { border-top: 1px solid #e4eaf3; }
.theme-modern-login .list-group-item input { height: 48px; border-radius: 10px; background: transparent; }
.theme-modern-login #submit { height: 48px; border: 0; border-radius: 10px; background: linear-gradient(135deg, #2878f0, #4c9af7); box-shadow: 0 8px 18px rgba(40,120,240,.2); }
.theme-modern-login .btn-info {
  border: 1px solid #d7e6fc;
  border-radius: 9px;
  background: #edf4ff;
  color: var(--modern-primary) !important;
}
.theme-modern-login .btn-info:hover,
.theme-modern-login .btn-info:focus { background: #e4efff; color: var(--modern-primary-deep) !important; }
.theme-modern-login .btn-danger {
  border: 1px solid #f3cdd1;
  border-radius: 9px;
  background: #fff0f1;
  color: #bd4d58 !important;
}
.theme-modern-login .btn-danger:hover,
.theme-modern-login .btn-danger:focus { background: #ffe6e8; color: #a53e49 !important; }

@media (max-width: 767px) {
  .theme-modern .navbar-header { width: auto; }
  .theme-modern .navbar-collapse { margin-left: 0; height: auto !important; }
  .theme-modern .app-aside { top: 68px; width: 220px; }
  .theme-modern .app-content { margin-left: 0; padding-top: 68px; }
  .theme-modern .app-footer { margin-left: 0; }
  .theme-modern .app-content-body > .bg-light { padding: 23px 18px 15px; }
  .theme-modern .wrapper-md.control { padding: 0 12px 26px; }
  .theme-modern-login .container { margin-top: 4vh; padding: 28px 24px 22px; }
}

/* 侧栏排版审查覆盖：明确中文行高、图标占位和折叠层级，避免旧版 app.css 的 float 规则串入。 */
.theme-modern .app-aside {
  overflow: hidden;
}
.theme-modern .aside-wrap,
.theme-modern .navi-wrap {
  height: 100%;
}
.theme-modern .navi-wrap {
  box-sizing: border-box;
  overflow-y: auto;
  padding: 17px 12px 26px;
  scrollbar-width: thin;
  scrollbar-color: #d6e1f1 transparent;
}
.theme-modern .navi-wrap::-webkit-scrollbar { width: 5px; }
.theme-modern .navi-wrap::-webkit-scrollbar-thumb { background: #d6e1f1; border-radius: 5px; }
.theme-modern .navi,
.theme-modern .navi > ul { width: 100%; margin: 0; padding: 0; }
.theme-modern .navi ul.nav li { width: 100%; }
.theme-modern .navi > ul > li.hidden-folded {
  box-sizing: border-box;
  margin: 8px 0 4px !important;
  padding: 8px 12px 6px !important;
  color: #9aa8bc !important;
  font-size: 11px;
  line-height: 18px;
  letter-spacing: .08em;
}
.theme-modern .navi > ul > li > a {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 42px;
  margin: 2px 0;
  padding: 10px 12px;
  color: #53657d;
  font-size: 13px;
  font-weight: 500;
  line-height: 20px;
  white-space: nowrap;
}
.theme-modern .navi > ul > li > a > i {
  position: static;
  order: 1;
  flex: 0 0 22px;
  width: 22px;
  height: 20px;
  margin: 0 9px 0 0;
  color: currentColor !important;
  font-size: 14px;
  line-height: 20px;
  text-align: center;
}
.theme-modern .navi > ul > li > a > span:not(.pull-right) {
  order: 2;
  min-width: 0;
  overflow: hidden;
  color: inherit;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.theme-modern .navi > ul > li > a > .pull-right {
  order: 3;
  flex: 0 0 auto;
  margin-left: auto;
  color: #a4b1c3 !important;
  float: none;
  line-height: 20px;
}
.theme-modern .navi > ul > li > a > .label {
  order: 3;
  flex: 0 0 auto;
  margin-left: auto;
  padding: 2px 6px;
  border-radius: 5px;
  font-size: 10px;
  line-height: 15px;
}
.theme-modern .navi ul.nav > li > .nav-sub {
  height: 0;
  margin: 0 !important;
  padding: 0;
  overflow: hidden;
  border-left: 1px solid #e5edf8;
  opacity: 0;
}
.theme-modern .navi ul.nav > li.active > .nav-sub {
  height: auto !important;
  margin: 2px 0 6px 22px !important;
  padding: 3px 0 4px;
  overflow: visible;
  opacity: 1;
}
.theme-modern .navi ul.nav li li a {
  display: block;
  box-sizing: border-box;
  min-height: 36px;
  margin: 1px 0;
  padding: 8px 10px 8px 18px !important;
  color: #8795aa;
  font-size: 12px;
  line-height: 20px;
  white-space: nowrap;
}
.theme-modern .navi ul.nav li li a span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.theme-modern .navi ul.nav li li a:hover,
.theme-modern .navi ul.nav li li.active > a { color: var(--modern-primary); background: #f4f8ff; }
.theme-modern .navi > ul > li.line,
.theme-modern .navi ul.nav li.line {
  width: auto;
  height: 1px;
  margin: 13px 4px !important;
  padding: 0 !important;
  background: #edf1f6 !important;
  border: 0 !important;
}
.theme-modern .navi-wrap > .wrapper.m-t {
  margin: 18px 4px 0 !important;
  padding: 16px 10px 0;
  border-top: 1px solid #edf1f6;
  color: #8d9ab0;
  font-size: 11px;
  line-height: 18px;
}
.theme-modern .navi-wrap > .wrapper.m-t .progress { height: 3px; margin: 7px 0 12px; background: #edf2f8; }
.theme-modern .navi-wrap > .wrapper.m-t .progress-bar { border-radius: 3px; background: #80aef2 !important; }
.theme-modern .navbar-brand {
  box-sizing: border-box;
  overflow: hidden;
  font-size: 15px;
  line-height: 48px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 页面按钮和警示色统一到同一套蓝色基础色，保留语义但降低刺眼度。 */
.theme-modern .btn-default { color: #5f6e83; background: #f6f8fb; border-color: #e0e7f0; box-shadow: none; }
.theme-modern .btn-success { color: #187d58; background: #eaf8f1; border-color: #c8eddb; box-shadow: none; }
.theme-modern .btn-warning { color: #9a6800; background: #fff6e4; border-color: #f5dfae; box-shadow: none; }
.theme-modern .btn-danger { color: #bd4d58; background: #fff0f1; border-color: #f3cdd1; box-shadow: none; }
.theme-modern .panel-warning > .panel-heading,
.theme-modern .panel-danger > .panel-heading,
.theme-modern .panel-success > .panel-heading,
.theme-modern .panel-info > .panel-heading { color: var(--modern-ink); }

@media (max-width: 767px) {
  .theme-modern .app-aside {
    position: absolute;
    top: 68px;
    bottom: auto;
    width: 220px;
    height: calc(100vh - 68px);
  }
  .theme-modern .navi-wrap { padding: 14px 10px 22px; }
  .theme-modern .navi > ul > li > a { font-size: 13px; }
}
