/* ============================================================
   信奥李拜天 OJ · 轻量美化皮肤（wb-skin）
   主色：深蓝 #1a56a0 —— 低饱和、沉稳、专业
   范围：配色 + 圆角 + 阴影 + 导航/卡片/表格/按钮细节
   原则：不动布局结构、不动评测状态色（AC/WA/TLE 等）
   ============================================================ */

/* ---------- 亮色主题变量 ---------- */
:root {
  --wb-primary: #1a56a0;
  --wb-primary-dark: #123f7a;
  --wb-primary-light: #eef3fb;
  --wb-ink: #2b3440;
  --wb-muted: #7a869a;
  --wb-line: #e6ebf2;
  --wb-divider: #f1f5f9;
  --wb-bg: #f4f6f9;
  --wb-surface: #ffffff;
  --wb-th: #f8fafc;
  --wb-input-line: #d7dfeb;
  --wb-shadow: 0 1px 2px rgba(16, 24, 40, 0.05), 0 4px 14px rgba(16, 24, 40, 0.06);
}

/* ---------- 暗色主题变量（同源，降明度不换色相） ---------- */
html.theme--dark {
  --wb-primary: #4a8ae0;
  --wb-primary-dark: #6ba3ef;
  --wb-primary-light: #1a2637;
  --wb-ink: #e6ecf5;
  --wb-muted: #8394a8;
  --wb-line: #24303f;
  --wb-divider: #1f2937;
  --wb-bg: #0d1420;
  --wb-surface: #151d2b;
  --wb-th: #111827;
  --wb-input-line: #2a3748;
  --wb-shadow: 0 1px 2px rgba(0, 0, 0, 0.45), 0 8px 20px rgba(0, 0, 0, 0.35);
}

/* ---------- Element Plus 主色统一为深蓝 ---------- */
:root {
  --el-color-primary: #1a56a0;
  --el-color-primary-light-3: #5c88c2;
  --el-color-primary-light-5: #8fadcf;
  --el-color-primary-light-7: #b7cbe2;
  --el-color-primary-light-8: #cbdaf0;
  --el-color-primary-light-9: #eef3fb;
  --el-color-primary-dark-2: #123f7a;
}
html.theme--dark {
  --el-color-primary: #4a8ae0;
  --el-color-primary-light-3: #6ba3ef;
  --el-color-primary-light-5: #4a8ae0;
  --el-color-primary-light-7: #2f5b96;
  --el-color-primary-light-8: #244673;
  --el-color-primary-light-9: #1a2f4d;
  --el-color-primary-dark-2: #6ba3ef;
}

/* ---------- 页面底色与文字 ---------- */
html body,
#panel,
.main {
  background-color: var(--wb-bg) !important;
  color: var(--wb-ink) !important;
}

/* ---------- 顶部导航 ---------- */
.nav,
.slideout-menu {
  background-color: var(--wb-surface) !important;
  border-bottom: 1px solid var(--wb-line) !important;
}
.nav .nav__item,
.slideout-menu .menu__link {
  color: var(--wb-ink) !important;
}
.nav .nav__item:hover,
.nav .nav__item.nav--active {
  color: var(--wb-primary) !important;
  background-color: var(--wb-primary-light) !important;
}
.nav__logo {
  display: inline-flex;
  align-items: center;
}

/* ---------- 卡片 ---------- */
.section {
  background-color: var(--wb-surface) !important;
  border: 1px solid var(--wb-line) !important;
  border-radius: 14px !important;
  box-shadow: var(--wb-shadow) !important;
  overflow: hidden;
}
.section__header {
  padding: 16px 20px 12px !important;
  border-bottom: 1px solid var(--wb-divider);
}
.section__title {
  color: var(--wb-ink) !important;
  font-weight: 600 !important;
}
.section__body {
  padding: 14px 20px !important;
}

/* ---------- 链接 ----------
   不再全局强制链接颜色：Hydro 原生链接本就是深蓝 #215db0（与主色一致）。
   全局覆盖会把白字按钮/彩色徽章等 <a> 元素也染成蓝，导致看不清。 */

/* ---------- 按钮（主按钮随 el 主色） ---------- */
.el-button {
  border-radius: 8px !important;
}
.el-button--primary {
  --el-button-bg-color: var(--el-color-primary);
  --el-button-border-color: var(--el-color-primary);
  --el-button-hover-bg-color: var(--el-color-primary-dark-2);
  --el-button-hover-border-color: var(--el-color-primary-dark-2);
}

/* ---------- 输入框 ---------- */
.el-input__wrapper,
.el-textarea__inner {
  border-radius: 8px !important;
}

/* ---------- 表格 ---------- */
.section table th,
.section__table th,
.data-table th {
  background-color: var(--wb-th) !important;
  color: var(--wb-muted) !important;
  font-weight: 600 !important;
}
.section table td,
.section__table td,
.data-table td {
  border-bottom: 1px solid var(--wb-divider) !important;
}
.section table tbody tr:hover,
.section__table tbody tr:hover,
.data-table tbody tr:hover {
  background-color: #f2f6fb !important;
}

/* ---------- 页脚 ---------- */
.footer {
  color: var(--wb-muted) !important;
}
.footer a {
  color: var(--wb-muted) !important;
}
.footer a:hover {
  color: var(--wb-primary) !important;
}

/* ---------- 下拉菜单 / 标签页 ---------- */
.el-tabs__item.is-active {
  color: var(--wb-primary) !important;
}
.el-tabs__active-bar {
  background-color: var(--wb-primary) !important;
}

/* ---------- 分隔线 ---------- */
hr {
  border-color: var(--wb-line) !important;
}

/* ---------- 沉浸式页面（登录/注册/找回密码等） ----------
   原版设计是深色背景 + inverse 白字，必须恢复深色底才能保证可读性 */
html.layout--immersive body,
html.layout--immersive #panel,
html.layout--immersive .main {
  background: linear-gradient(165deg, #2464b2 0%, #1a56a0 55%, #113e77 100%) !important;
  color: #ffffff !important;
}
html.layout--immersive a {
  color: #ffffff !important;
}
html.layout--immersive a:hover {
  color: #cfe0f5 !important;
}

/* ---------- 比赛侧栏 ----------
   顶部色块原版白字设计，显式加固；菜单链接恢复原版深灰（白底可读） */
.contest-sidebar__bg,
.contest-sidebar__bg h1 {
  color: #ffffff !important;
}
.section .menu__link:not(.active) {
  color: #555555;
}

/* ---------- 整体字号放大（原版偏小） ----------
   html 基准 16→17px（rem 元素整体 +6%），正文 14→15px */
html {
  font-size: 17px !important;
}
html body {
  font-size: 15px !important;
}
:root {
  --el-font-size-base: 15px;
}
