/* ============================================================
   radio_net 台网签到系统 — 主题覆盖层 theme.css v2.0
   注入位置：各页面 </head> 之前（晚于页内 <style>，同级选择器后者生效）
   设计语言与主站一致：Signal Teal · 玻璃拟态
   ============================================================ */
:root {
  --brand-1: #238599;
  --brand-2: #28b8a9;
  --brand-deep: #0e5f6b;
  --ink: #16323c;
  --muted: #5c7480;
  --glass: rgba(255, 255, 255, 0.74);
  --glass-strong: rgba(255, 255, 255, 0.9);
  --line: rgba(35, 133, 153, 0.16);
  --grad: linear-gradient(120deg, #238599, #28b8a9);
  --radius: 14px;
  --shadow: 0 8px 30px rgba(18, 66, 78, 0.10);
  --shadow-lg: 0 16px 48px rgba(18, 66, 78, 0.16);
  --font-num: "Bahnschrift", "DIN Alternate", "Segoe UI", Consolas, sans-serif;
}

body {
  font-family: "Microsoft YaHei", "PingFang SC", "Source Han Sans SC", system-ui, sans-serif !important;
  color: var(--ink);
}
/* 背景柔化层，保证可读性 */
body::after {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(180deg, rgba(238,246,246,.5), rgba(238,246,246,.2) 35%, rgba(238,246,246,.55));
}
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: rgba(35,133,153,.06); }
::-webkit-scrollbar-thumb { background: linear-gradient(#238599,#28b8a9); border-radius: 6px; }
::selection { background: rgba(40,184,169,.25); }

/* ============================================================
   顶部导航（top-header 系列）
   ============================================================ */
.top-header {
  background: linear-gradient(120deg, rgba(12,79,92,.95), rgba(20,120,112,.92)) !important;
  backdrop-filter: blur(14px);
  border-bottom: none !important;
  box-shadow: 0 4px 22px rgba(12,79,92,.30) !important;
  color: #fff !important;
}
.top-header::before {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
  background: linear-gradient(90deg, transparent, #37e6a8, transparent);
  opacity: .8;
}
.header-left-title { color: #fff !important; font-weight: 700 !important; letter-spacing: 1px; }
.header-center-text { color: rgba(255,255,255,.75) !important; }
.header-user-box, .header-user-box .dropdown-toggle { color: #fff !important; }
.header-user-box .dropdown-toggle { border-radius: 999px; padding: 4px 12px; transition: background .15s ease; }
.header-user-box .dropdown-toggle:hover { background: rgba(255,255,255,.12); }
.admin-badge {
  background: linear-gradient(120deg, #ffb347, #ff8c42) !important;
  color: #fff !important; border: none !important;
  border-radius: 999px !important; padding: 1px 9px !important;
  font-size: 11px !important; letter-spacing: 1px;
  box-shadow: 0 2px 8px rgba(255,140,66,.45);
}
.dropdown-menu {
  border: 1px solid rgba(255,255,255,.7) !important; border-radius: 12px !important;
  box-shadow: var(--shadow-lg) !important; backdrop-filter: blur(16px);
  background: rgba(255,255,255,.92) !important; padding: 6px !important;
}
.dropdown-item { border-radius: 8px; font-size: 14px; padding: 8px 14px; }
.dropdown-item:hover { background: rgba(35,133,153,.09); color: var(--brand-1); }

/* 实时状态芯片（theme.js 注入） */
.rn-live {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 12.5px; color: rgba(255,255,255,.92);
  background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.22);
  border-radius: 999px; padding: 3px 13px; margin-left: 14px;
  font-family: var(--font-num); letter-spacing: .5px; white-space: nowrap;
}
.rn-live .dot {
  width: 7px; height: 7px; border-radius: 50%; background: #ffd166; flex: none;
}
.rn-live.onair .dot { background: #37e6a8; animation: rnpulse 1.8s infinite; }
@keyframes rnpulse {
  0% { box-shadow: 0 0 0 0 rgba(55,230,168,.65); }
  70% { box-shadow: 0 0 0 8px rgba(55,230,168,0); }
  100% { box-shadow: 0 0 0 0 rgba(55,230,168,0); }
}

/* ============================================================
   布局骨架
   ============================================================ */
.container-wrap { padding-top: 18px; }

/* 侧边栏 */
.left-sidebar {
  background: var(--glass) !important;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.8) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow) !important;
  overflow: hidden;
}
.sidebar-active-top {
  background: var(--grad) !important; color: #fff !important;
  font-weight: 700 !important; letter-spacing: 1px;
  box-shadow: 0 4px 14px rgba(35,133,153,.30);
}
.sidebar-menu-list li a {
  border-radius: 9px !important; margin: 2px 8px; transition: all .15s ease;
}
.sidebar-menu-list li a:hover {
  background: rgba(40,184,169,.12) !important; color: var(--brand-1) !important;
  transform: translateX(3px);
}

/* ============================================================
   卡片
   ============================================================ */
.content-card, .table-wrap-card, .welcome-card, .stat-card,
.card, .card-main, .master-card, .action-card, .hint-box, .err-card {
  background: var(--glass) !important;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.8) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow) !important;
}
.content-card-header, .table-title-bar {
  background: transparent !important;
  border-bottom: 1px dashed var(--line) !important;
  font-weight: 700 !important; letter-spacing: .5px; color: var(--ink);
}
.content-card-header > span:first-child, .table-title-bar > span:first-child {
  border-radius: 3px !important;
  background: var(--grad) !important;
  box-shadow: 0 2px 6px rgba(35,133,153,.4);
}
.welcome-card {
  background: linear-gradient(130deg, rgba(12,79,92,.94), rgba(20,120,112,.9)) !important;
  color: #fff !important; border: none !important;
}
.welcome-card h2 { color: #fff !important; }
.welcome-card p { color: rgba(255,255,255,.8) !important; }

/* 统计卡 */
.stat-card { transition: transform .2s ease, box-shadow .2s ease; overflow: hidden; position: relative; }
.stat-card::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: var(--grad);
}
.stat-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg) !important; }
.stat-icon-box {
  background: var(--grad) !important; color: #fff !important;
  border-radius: 12px !important;
  box-shadow: 0 5px 16px rgba(35,133,153,.35);
}
.stat-card .num, .stat-text .num {
  font-family: var(--font-num) !important; font-weight: 800 !important;
  color: var(--brand-deep) !important; letter-spacing: 1px;
}
.stat-card h4, .stat-text h4, .stat-card h5 { color: var(--muted) !important; font-weight: 500 !important; }

/* 主控卡片（net_add_step1） */
.master-card { transition: all .2s ease; }
.master-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg) !important; border-color: rgba(40,184,169,.5) !important; }
.master-card-head, .master-call { color: var(--brand-deep) !important; }
.auto-filled { background: rgba(40,184,169,.10) !important; }

/* 管理面板动作卡 */
.action-card { transition: all .2s ease; }
.action-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg) !important; }
.action-card .bi { color: var(--brand-1); }

/* ============================================================
   表格
   ============================================================ */
.table { --bs-table-bg: transparent; }
.table thead th, .inline-edit-table th, .preview-table th {
  background: linear-gradient(120deg, rgba(35,133,153,.94), rgba(40,184,169,.9)) !important;
  color: #fff !important; font-weight: 600 !important; letter-spacing: 1px;
  border: none !important; white-space: nowrap;
}
.table thead th:first-child { border-radius: 10px 0 0 10px; }
.table thead th:last-child { border-radius: 0 10px 10px 0; }
.table tbody tr, .preview-table tr { background: rgba(255,255,255,.55) !important; }
.table tbody td, .preview-table td { border-color: rgba(35,133,153,.10) !important; }
.table-hover tbody tr:hover, .table tbody tr:hover, .preview-table tr:hover {
  background: rgba(40,184,169,.10) !important;
}
.table-scroll-wrap { border-radius: 10px; }

/* ============================================================
   表单
   ============================================================ */
.form-control, .form-select, .edit-input, .inline-edit-table .form-control {
  border: 1.5px solid rgba(35,133,153,.18) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.8) !important;
  color: var(--ink) !important;
  transition: all .18s ease !important;
}
.form-control:hover, .form-select:hover { border-color: rgba(35,133,153,.35) !important; }
.form-control:focus, .form-select:focus, .edit-input:focus, .inline-edit-table .form-control:focus {
  border-color: var(--brand-2) !important; background: #fff !important;
  box-shadow: 0 0 0 4px rgba(40,184,169,.14) !important;
}
.form-label { font-weight: 700; color: var(--ink); letter-spacing: .5px; }
.required-star { color: #e05a4e; }
.form-check-input:checked { background-color: var(--brand-1); border-color: var(--brand-1); }

/* ============================================================
   按钮
   ============================================================ */
.btn-primary, .btn-success, .btn-save, .finish-btn,
.btn-play, .control-btn:not(.btn-stop):not(.btn-pause) {
  background: var(--grad) !important;
  border: none !important; border-radius: 999px !important;
  box-shadow: 0 5px 16px rgba(35,133,153,.30);
  letter-spacing: 1px; transition: all .18s ease !important;
}
.btn-primary:hover, .btn-success:hover, .btn-save:hover, .finish-btn:hover {
  filter: brightness(1.07); transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(35,133,153,.40) !important;
}
.btn-edit, .btn-edit-master, .btn-action, .btn-nav, .template-btn {
  background: rgba(255,255,255,.7) !important; color: var(--brand-1) !important;
  border: 1.5px solid var(--line) !important; border-radius: 999px !important;
  transition: all .15s ease !important;
}
.btn-edit:hover, .btn-edit-master:hover, .btn-action:hover, .btn-nav:hover, .template-btn:hover {
  border-color: var(--brand-2) !important; background: #fff !important;
  transform: translateY(-1px);
}
.btn-del-master, .btn-cancel, .danger-box .btn-primary {
  background: linear-gradient(120deg, #c94b4b, #e06d5a) !important;
  border: none !important; color: #fff !important; border-radius: 999px !important;
  box-shadow: 0 5px 16px rgba(201,75,75,.28);
}
.btn-stop { background: linear-gradient(120deg, #c94b4b, #e06d5a) !important; border: none !important; border-radius: 999px !important; }
.btn-pause { background: linear-gradient(120deg, #e8a13c, #d98c2b) !important; border: none !important; border-radius: 999px !important; color: #fff !important; }

/* ============================================================
   提示 / 面包屑 / 徽章
   ============================================================ */
.alert {
  border-radius: 10px !important; border: 1px solid transparent !important;
  backdrop-filter: blur(8px); font-size: 14px;
}
.alert-success { background: rgba(236,249,240,.9) !important; color: #1f8a52 !important; border-color: rgba(31,138,82,.2) !important; }
.alert-danger, .alert-warning { background: rgba(251,236,229,.9) !important; color: #b3362a !important; border-color: rgba(179,54,42,.18) !important; }
.breadcrumb {
  background: rgba(255,255,255,.55) !important; border-radius: 999px;
  padding: 7px 16px; backdrop-filter: blur(8px); font-size: 13px;
}
.badge { border-radius: 999px !important; letter-spacing: 1px; }

/* ============================================================
   登录页（login.php / index.php）
   ============================================================ */
.login-container {
  background: var(--glass-strong) !important;
  backdrop-filter: blur(20px) !important; -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,.85) !important;
  border-radius: 20px !important;
  box-shadow: var(--shadow-lg) !important;
  position: relative; overflow: hidden;
  animation: rnSlideDown .45s ease;
}
.login-container::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; background: var(--grad);
}
.radio-logo .icon {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 66px; height: 66px; border-radius: 20px;
  background: var(--grad); color: #fff !important; font-size: 28px !important;
  box-shadow: 0 10px 26px rgba(35,133,153,.38); margin-bottom: 14px !important;
}
.radio-logo h1 { font-weight: 800 !important; letter-spacing: 1px; }
.login-container .btn-primary { width: 100%; padding: 12px 0 !important; }
@keyframes rnSlideDown { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }

/* ============================================================
   日历（rili.php）
   ============================================================ */
.calendar-container { background: var(--glass) !important; backdrop-filter: blur(14px); border-radius: var(--radius); box-shadow: var(--shadow); }
.calendar-header { background: var(--grad) !important; color: #fff !important; border-radius: 12px 12px 0 0; }
.calendar-day { border-radius: 10px !important; transition: all .15s ease; }
.calendar-day:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.calendar-day.today { outline: 2px solid var(--brand-2); outline-offset: -2px; }
.calendar-day.has-session { background: rgba(40,184,169,.14) !important; }
.session-dot { background: var(--grad) !important; }

/* ============================================================
   步骤条（csv_import.php）
   ============================================================ */
.step-number { background: rgba(35,133,153,.12); color: var(--brand-1); font-family: var(--font-num); }
.step-item.active .step-number { background: var(--grad) !important; color: #fff !important; box-shadow: 0 4px 14px rgba(35,133,153,.35); }
.step-item.completed .step-number { background: #2fae7d !important; color: #fff !important; }

/* 排行徽章（record_summary.php） */
.rank-badge { border-radius: 999px !important; font-family: var(--font-num); letter-spacing: 1px; }
.rank-1 { background: linear-gradient(120deg, #f5b942, #e8a13c) !important; }
.rank-2 { background: linear-gradient(120deg, #a8b6c4, #8d9dab) !important; }
.rank-3 { background: linear-gradient(120deg, #d0986a, #b97f52) !important; }

/* 自动补全下拉 */
.autocomplete-list, .dropdown-options {
  border: 1px solid rgba(255,255,255,.7) !important; border-radius: 12px !important;
  box-shadow: var(--shadow-lg) !important; backdrop-filter: blur(14px);
  background: rgba(255,255,255,.95) !important; overflow: hidden;
}
.autocomplete-list li:hover, .dropdown-options li:hover:not(.text-muted) { background: rgba(40,184,169,.12) !important; }

/* 模态框 */
.modal-content {
  border: 1px solid rgba(255,255,255,.8) !important; border-radius: 18px !important;
  box-shadow: var(--shadow-lg) !important; backdrop-filter: blur(18px);
  background: rgba(255,255,255,.94) !important;
}

/* 加载动画 */
.loader { border-top-color: var(--brand-2) !important; }
.loading-box, .err-card { border-radius: var(--radius) !important; }

/* 数字统一等宽 */
.num, .session-count, .master-no { font-family: var(--font-num); }

/* 淡入动画兜底（部分页面依赖自身 keyframes，这里补充通用） */
.fade-in { animation: rnFadeIn .5s ease; }
@keyframes rnFadeIn { from { opacity: 0; } to { opacity: 1; } }

/* 响应式 */
@media (max-width: 900px) {
  .rn-live { display: none; }
  .header-center-text { display: none !important; }
}
