@charset "UTF-8";
/*!
 * 纷齐内网门户 · Element UI 视觉升级层
 * ---------------------------------------------------------------------------
 * 加载顺序（不可颠倒）：
 *   admin.css / front.css / site.css（原有皮肤）
 *   → vendor/element/element-ui.css（Element UI 组件样式）
 *   → element-fq.css（本文件：品牌主题 + 原生控件形态升级）
 *
 * 设计原则：只改视觉，不动 DOM、不动 name/id/action、不动任何业务脚本。
 * 所有原有布局尺寸（顶栏高度、侧栏宽度、表格行高、分页位置）保持不变。
 */
:root {
  --fq-el-font: "Source Han Sans SC", "Noto Sans SC", "Microsoft YaHei", "PingFang SC", sans-serif;
  --fq-el-border: #DCDFE6;
  --fq-el-border-light: #EBEEF5;
  --fq-el-text: #606266;
  --fq-el-text-light: #909399;
  --fq-el-bg-light: #F5F7FA;
  --fq-el-radius: 4px;
  --fq-el-radius-lg: 6px;
  --fq-el-shadow: 0 2px 12px 0 rgba(16, 32, 72, .10);
  --fq-el-shadow-lg: 0 8px 28px 0 rgba(16, 32, 72, .16);
}

/* ==========================================================================
   一、Element UI 组件主题：默认蓝 #409EFF → 纷齐品牌蓝 #1156E8
   ========================================================================== */
.el-button--primary,
.el-button--primary.is-active,
.el-button--primary:active {
  background-color: var(--brand, #1156E8);
  border-color: var(--brand, #1156E8);
  color: #fff;
}
.el-button--primary:focus,
.el-button--primary:hover {
  background: var(--brand-l, #2E72EE);
  border-color: var(--brand-l, #2E72EE);
  color: #fff;
}
.el-button--primary.is-plain {
  color: var(--brand, #1156E8);
  background: var(--brand-50, #EEF3FE);
  border-color: var(--brand-200, #B9CFFB);
}
.el-button--primary.is-plain:focus,
.el-button--primary.is-plain:hover {
  background: var(--brand, #1156E8);
  border-color: var(--brand, #1156E8);
  color: #fff;
}
.el-button--danger { background-color: var(--err, #D02238); border-color: var(--err, #D02238); }
.el-button--danger:focus, .el-button--danger:hover { background: #E04659; border-color: #E04659; }
.el-button--success { background-color: var(--ok, #0A7A39); border-color: var(--ok, #0A7A39); }
.el-button--warning { background-color: var(--warn, #9C5A06); border-color: var(--warn, #9C5A06); }
.el-button--text, .el-link.el-link--primary, .el-link--inner { color: var(--brand, #1156E8); }
.el-button--text:hover, .el-link.el-link--primary:hover { color: var(--brand-l, #2E72EE); }
.el-button.is-disabled, .el-button.is-disabled:hover { color: var(--fq-el-text-light); }

.el-input__inner:focus,
.el-textarea__inner:focus,
.el-select .el-input.is-focus .el-input__inner,
.el-range-editor.is-active { border-color: var(--brand, #1156E8); }
.el-input.is-disabled .el-input__inner { color: var(--fq-el-text-light); }
.el-checkbox__input.is-checked .el-checkbox__inner,
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
  background-color: var(--brand, #1156E8);
  border-color: var(--brand, #1156E8);
}
.el-checkbox__inner:hover, .el-checkbox__input.is-focus .el-checkbox__inner,
.el-radio__inner:hover { border-color: var(--brand, #1156E8); }
.el-radio__input.is-checked .el-radio__inner {
  border-color: var(--brand, #1156E8);
  background: var(--brand, #1156E8);
}
.el-radio__input.is-checked + .el-radio__label,
.el-checkbox__input.is-checked + .el-checkbox__label { color: var(--brand, #1156E8); }
.el-select-dropdown__item.selected,
.el-select-dropdown__item.selected.hover { color: var(--brand, #1156E8); }
.el-switch.is-checked .el-switch__core {
  border-color: var(--brand, #1156E8);
  background-color: var(--brand, #1156E8);
}
.el-tabs__item.is-active, .el-tabs__item:hover { color: var(--brand, #1156E8); }
.el-tabs__active-bar { background-color: var(--brand, #1156E8); }
.el-slider__bar, .el-progress-bar__inner { background-color: var(--brand, #1156E8); }
.el-pagination.is-background .el-pager li:not(.disabled).is-active,
.el-pagination.is-background .el-pager li:not(.disabled):hover { background-color: var(--brand, #1156E8); }
.el-pagination .el-pager li:hover, .el-pagination button:hover { color: var(--brand, #1156E8); }
.el-date-table td.today:not(.available), .el-date-table td.current:not(.disabled) .el-date-table-cell__text { color: var(--brand, #1156E8); }
.el-date-table td.available:hover { color: var(--brand, #1156E8); }

.el-loading-spinner .path { stroke: var(--brand, #1156E8); }
.el-loading-spinner .el-loading-text { color: var(--brand, #1156E8); font-size: 14px; }
.el-message-box__title { color: var(--tx, #16181D); font-size: 17px; font-weight: 600; }
.el-message-box__content { color: var(--tx2, #5C6273); font-size: 15px; line-height: 1.75; }
.el-message-box__status.el-icon-warning { color: var(--warn, #9C5A06); }
.el-message-box__status.el-icon-question { color: var(--brand, #1156E8); }
.el-message-box__headerbtn:hover .el-message-box__close { color: var(--brand, #1156E8); }
.el-message__content, .el-notification__content { font-size: 14px; line-height: 1.7; }
.el-alert--info { background-color: var(--brand-50, #EEF3FE); color: var(--brand-700, #0B3FA8); border-color: var(--brand-200, #B9CFFB); }
.el-alert--success { background-color: var(--ok-bg, #E3F6EB); color: var(--ok, #0A7A39); }
.el-alert--warning { background-color: var(--warn-bg, #FFF6E6); color: var(--warn, #9C5A06); }
.el-alert--error { background-color: var(--err-bg, #FCE9EC); color: var(--err, #D02238); }
.el-dialog__title { color: var(--tx, #16181D); font-weight: 600; }
.el-tag { border-radius: var(--fq-el-radius); }
.el-popper, .el-select-dropdown, .el-message-box, .el-dialog, .el-notification {
  box-shadow: var(--fq-el-shadow-lg);
}

/* Element UI 弹层统一中文字体栈，避免 Helvetica 回退导致字形不一致 */
.el-button, .el-input__inner, .el-textarea__inner, .el-message-box,
.el-message, .el-notification, .el-dialog, .el-alert, .el-tag,
.el-loading-text, .el-select-dropdown__item, .el-form-item__label {
  font-family: var(--f, var(--fq-el-font));
}
.el-message-box, .el-message, .el-notification { border-radius: 8px; }
.fq-msgbox { border-radius: 10px; padding-bottom: 18px; }
.fq-msgbox .el-message-box__header { padding-top: 22px; }
.fq-msgbox .el-message-box__btns { padding: 12px 20px 0; }
.fq-msgbox-ok.el-button--primary { min-width: 84px; }
.fq-loading .el-loading-spinner { top: 46%; }

/* ==========================================================================
   二、原有控件 → Element UI 形态（保持布局尺寸，只换质感）
   ========================================================================== */

/* --- 2.1 按钮：扁平化、实色主按钮、细边框次按钮、Element UI 交互态 --- */
.btn, a.btn, button.btn {
  border-radius: var(--fq-el-radius-lg);
  font-weight: 500;
  box-shadow: none;
  background: var(--brand, #1156E8);
  border: 1px solid var(--brand, #1156E8);
  color: #fff;
  transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s;
  text-decoration: none;
}
.btn:hover, a.btn:hover, button.btn:hover {
  filter: none; transform: none;
  background: var(--brand-l, #2E72EE);
  border-color: var(--brand-l, #2E72EE);
  color: #fff;
  box-shadow: 0 2px 8px rgba(17, 86, 232, .18);
}
.btn:active, a.btn:active, button.btn:active {
  transform: none;
  background: var(--brand-d, #0E4BC7);
  border-color: var(--brand-d, #0E4BC7);
}
.btn:disabled, .btn.off, .btn.is-disabled {
  opacity: .55; pointer-events: none; transform: none; filter: none; box-shadow: none;
}
/* 次按钮 / 描边按钮 —— Element UI default */
.btn.o, .btn.sec, .btn.ghost,
.cd .btn.o, .cd form .btn:not(.p):not(.rd):not(.gn):not(.pri):not(.main) {
  background: #fff;
  color: var(--tx2, #5C6273);
  border: 1px solid var(--line-2, #CFDCF2);
  box-shadow: none;
}
.btn.o:hover, .btn.sec:hover, .btn.ghost:hover,
.cd .btn.o:hover, .cd form .btn:not(.p):not(.rd):not(.gn):not(.pri):not(.main):hover {
  background: var(--brand-50, #EEF3FE);
  color: var(--brand, #1156E8);
  border-color: var(--brand-200, #B9CFFB);
  box-shadow: none;
}
/* 语义色按钮 */
.btn.danger, .btn.d, .btn.rd { background: var(--err, #D02238); border-color: var(--err, #D02238); color: #fff; }
.btn.danger:hover, .btn.d:hover, .btn.rd:hover { background: #E04659; border-color: #E04659; color: #fff; box-shadow: 0 2px 8px rgba(208, 34, 56, .2); }
.btn.ok, .btn.gn { background: var(--ok, #0A7A39); border-color: var(--ok, #0A7A39); color: #fff; }
.btn.ok:hover, .btn.gn:hover { background: #0C8F44; border-color: #0C8F44; color: #fff; }
.btn.warn { background: var(--warn, #9C5A06); border-color: var(--warn, #9C5A06); color: #fff; }
.btn.warn:hover { background: #B46B0A; border-color: #B46B0A; color: #fff; }
.btn.p, .btn.pri, .btn.main { background: var(--brand, #1156E8); border-color: var(--brand, #1156E8); color: #fff; }
/* 尺寸档保留原高度，仅收敛圆角 */
.btn.lg { border-radius: 7px; }
.btn.sm, .btn.xs { border-radius: var(--fq-el-radius); }
/* 操作列：保留白底细边框（Element UI default），统一 26px 与 hover */
.tb td.ops .btn.sec, .tb td.ops .btn.o { background: #fff !important; }
.tb td.ops .btn.pri { background: var(--brand, #1156E8) !important; border-color: var(--brand, #1156E8) !important; }
.tb td.ops .btn.danger, .tb td.ops .danger { border-radius: var(--fq-el-radius) !important; }
.tb td.ops .btn { border-radius: var(--fq-el-radius) !important; }

/* --- 2.2 输入框 / 下拉：Element UI input 质感（高度不动） --- */
input.ip, select.ip, textarea.ip, textarea.ipt, input.ipt, select.ipt,
.fm input:not([type=checkbox]):not([type=radio]),
.fm select, .fm .fq-sel-btn, .ipt,
.filters input[type=text], .filters select,
.fq-bar input[type=text], .fq-bar select,
.fp-send, .fp-code .ip {
  border: 1px solid var(--line-2, #CFDCF2);
  border-radius: var(--fq-el-radius-lg);
  background-color: #fff;
  color: var(--tx, #16181D);
  box-shadow: none;
  outline: none;
  font-family: inherit;
  transition: border-color .15s, box-shadow .15s;
}
input.ip:hover, select.ip:hover, textarea.ip:hover, textarea.ipt:hover,
.fm input:not([type=checkbox]):not([type=radio]):hover, .fm select:hover,
.filters input[type=text]:hover, .filters select:hover, .fq-sel-btn:hover {
  border-color: var(--brand-200, #B9CFFB);
}
input.ip:focus, select.ip:focus, textarea.ip:focus, textarea.ipt:focus,
.fm input:not([type=checkbox]):not([type=radio]):focus, .fm select:focus,
.filters input[type=text]:focus, .filters select:focus, .ipt:focus {
  border-color: var(--brand, #1156E8);
  box-shadow: 0 0 0 3px rgba(17, 86, 232, .12);
  background: #fff;
}
input::placeholder, textarea::placeholder { color: var(--fq-el-text-light); opacity: 1; }
input[type=checkbox], input[type=radio] { accent-color: var(--brand, #1156E8); }

/* 自绘下拉 fq-select：Element UI select / dropdown 质感 */
.fq-sel-btn { border-radius: var(--fq-el-radius-lg) !important; }
.fq-sel-list {
  border: 1px solid var(--fq-el-border-light);
  border-radius: var(--fq-el-radius);
  box-shadow: var(--fq-el-shadow);
  padding: 6px 0;
}
.fq-sel-opt { transition: background-color .12s, color .12s; }
.fq-sel-opt:hover, .fq-sel-opt.on, .fq-sel-opt[aria-selected=true] {
  background: var(--brand-50, #EEF3FE);
  color: var(--brand, #1156E8);
}

/* 富文本编辑器工具条 */
.fq-editor { border-radius: var(--fq-el-radius-lg); overflow: hidden; }
.fq-editor-bar { background: var(--fq-el-bg-light); border-bottom: 1px solid var(--fq-el-border-light); }
.fq-editor-bar button { border-radius: var(--fq-el-radius); }

/* --- 2.3 表格：Element UI table（浅灰表头、细分割线、整行 hover） --- */
.tb { border-radius: var(--fq-el-radius-lg); }
.tb th {
  background: var(--fq-el-bg-light);
  color: var(--tx2, #5C6273);
  font-weight: 600;
  border-bottom: 1px solid var(--fq-el-border-light);
}
.tb td { border-bottom: 1px solid var(--fq-el-border-light); }
.tb tbody tr:hover, .tb tr:hover { background: var(--brand-50, #EEF3FE); }
.tb tbody tr:last-child td { border-bottom: none; }

/* --- 2.4 状态徽章：Element UI tag（小圆角 + 细边框 + 浅底） --- */
.tg {
  border-radius: var(--fq-el-radius);
  padding: 3px 9px;
  border: 1px solid var(--brand-200, #B9CFFB);
  background: var(--brand-50, #EEF3FE);
  color: var(--brand, #1156E8);
  font-size: var(--fs-xs, 13px);
  line-height: 1.5;
  font-weight: 500;
}
.tg.d { background: var(--brand-50, #EEF3FE); color: var(--brand, #1156E8); border-color: var(--brand-200, #B9CFFB); }
.tg.x { background: var(--ok-bg, #E3F6EB); color: var(--ok, #0A7A39); border-color: #B9E4CC; }
.tg.p { background: var(--err-bg, #FCE9EC); color: var(--err, #D02238); border-color: #F5C9D0; }
.tg.dd { background: var(--fq-el-bg-light); color: var(--tx2, #5C6273); border-color: var(--fq-el-border-light); }

/* --- 2.5 提示条：Element UI alert（左侧语义色条 + 图标位） --- */
.alert, .fp-msg.ok, .fp-msg.err, .fp-off {
  border-radius: var(--fq-el-radius-lg);
  border: 1px solid var(--brand-200, #B9CFFB);
  border-left: 4px solid var(--brand, #1156E8);
  background: var(--brand-50, #EEF3FE);
  color: var(--brand-700, #0B3FA8);
  padding: 13px 18px;
  line-height: 1.75;
  font-size: var(--fs-sm, 14.5px);
}
.alert.ok, .fp-msg.ok {
  background: var(--ok-bg, #E3F6EB); border-color: #B9E4CC; border-left-color: var(--ok, #0A7A39); color: #1B5E38;
}
.alert.err, .fp-msg.err {
  background: var(--err-bg, #FCE9EC); border-color: #F5C9D0; border-left-color: var(--err, #D02238); color: #8E1A2A;
}
.alert.warn, .fp-off {
  background: var(--warn-bg, #FFF6E6); border-color: var(--warn-bd, #F2DFBB); border-left-color: var(--warn, #9C5A06); color: #7A6020;
}
.alert b { color: inherit; }
.fq-flash-alert { margin-bottom: 20px; }
.fq-flash-alert .el-alert__description { margin: 0; font-size: var(--fs-sm, 14.5px); line-height: 1.75; }

/* --- 2.6 分页：Element UI pagination（小方块、实心当前页） --- */
.pager .pg-btn, .pager .pg-num {
  border-radius: var(--fq-el-radius);
  border: 1px solid var(--fq-el-border);
  background: #fff;
  color: var(--tx2, #5C6273);
  box-shadow: none;
  transition: color .15s, border-color .15s, background-color .15s;
}
.pager .pg-btn:hover, .pager .pg-num:hover {
  border-color: var(--brand, #1156E8); background: #fff; color: var(--brand, #1156E8);
}
.pager .pg-num.cur {
  background: var(--brand, #1156E8); color: #fff;
  border-color: var(--brand, #1156E8);
  box-shadow: none; font-weight: 600;
}
.pager .pg-num.cur:hover { background: var(--brand-l, #2E72EE); color: #fff; }
.pager .pg-num.em { border-color: transparent; background: transparent; }
.pager .pg-btn.off { opacity: .45; }
.pager .pg-total { color: var(--tx3, #666E7D); }

/* --- 2.7 卡片 / 面板：Element UI card（细边框、轻阴影、不悬浮） --- */
.panel, .cd, .stat, .qi {
  border: 1px solid var(--fq-el-border-light);
  border-radius: 8px;
  box-shadow: 0 1px 3px rgba(16, 32, 72, .04);
}
.panel:hover, .stat:hover, .qi:hover { transform: none; box-shadow: 0 3px 12px rgba(16, 32, 72, .08); }
.login-box { border-radius: 8px; }

/* --- 2.8 面包屑 / 空态 / 页标题 --- */
.crumb { font-size: var(--fs-xs, 13px); color: var(--tx3, #666E7D); }
.empty, .emp { color: var(--tx3, #666E7D); }
.empty .i, .emp .i { color: var(--brand-200, #B9CFFB); opacity: .9; }
.ph { font-weight: 600; color: var(--tx, #16181D); }

/* --- 2.9 登录 / 找回密码页表单 --- */
.login-form .fm label, .fp-step + .fm label { font-weight: 500; color: var(--tx2, #5C6273); }
.login-form .btn { letter-spacing: 2px; }
.fp-dot { border-radius: var(--fq-el-radius); }

/* --- 2.10 细滚动条（Element UI 风格） --- */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #C9D2E3; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #AEBBD2; }
::-webkit-scrollbar-track { background: transparent; }

/* --- 2.11 弹层 / 编辑框：Element UI dialog 阴影 --- */
[id$="Box"], .modal-box, .editbox {
  border-radius: 8px;
  box-shadow: var(--fq-el-shadow-lg);
}
