/* =============================================================================
 *  iOS 设计系统（beatrix 1.5 UI 重构层）
 *  用法：在 layui.css / theme.css 之后引入本文件即可覆盖为 iOS 风格。
 *  设计原则：
 *    1. 只做「视觉覆盖」——不改任何 layui 组件的类名与 DOM 结构，
 *       因此表单提交、表格渲染、弹窗、AJAX 契约全部保持不变（业务与安全零影响）；
 *    2. 完全对齐 Apple HIG：系统色板、SF 字体栈、分组列表、16px 圆角、
 *       毛玻璃导航、iOS 开关/分段控件、危险操作红字；
 *    3. 移动优先（卖卡类站点 90% 流量来自手机），桌面端自动加宽留白；
 *    4. 支持深色模式（prefers-color-scheme）。
 * ========================================================================== */

/* ---------------------------------------------------------------------------
 *  1. 设计令牌（Design Tokens）
 * ------------------------------------------------------------------------ */
:root {
  /* 系统色 */
  --ios-blue: #007aff;
  --ios-blue-dark: #0062cc;
  --ios-green: #34c759;
  --ios-red: #ff3b30;
  --ios-orange: #ff9500;
  --ios-yellow: #ffcc00;
  --ios-purple: #af52de;
  --ios-pink: #ff2d55;
  --ios-teal: #5ac8fa;
  --ios-indigo: #5856d6;

  /* 文字 */
  --ios-label: #000000;
  --ios-label-2: rgba(60, 60, 67, 0.6);
  --ios-label-3: rgba(60, 60, 67, 0.3);
  --ios-label-inverse: #ffffff;

  /* 背景 */
  --ios-bg: #f2f2f7;
  --ios-bg-elevated: #ffffff;
  --ios-bg-grouped: #ffffff;
  --ios-fill: rgba(120, 120, 128, 0.12);
  --ios-fill-2: rgba(120, 120, 128, 0.16);

  /* 线条 */
  --ios-separator: rgba(60, 60, 67, 0.29);
  --ios-separator-thin: rgba(60, 60, 67, 0.15);

  /* 圆角与阴影 */
  --ios-radius-sm: 8px;
  --ios-radius: 10px;
  --ios-radius-lg: 14px;
  --ios-radius-xl: 20px;
  --ios-radius-pill: 999px;
  --ios-shadow-1: 0 1px 2px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.06);
  --ios-shadow-2: 0 8px 24px rgba(0, 0, 0, 0.08);
  --ios-shadow-3: 0 16px 48px rgba(0, 0, 0, 0.16);

  /* 动效 */
  --ios-ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ios-dur: 0.22s;

  /* 字体栈：SF Pro → 苹方 → 思源/微软雅黑 */
  --ios-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display",
    "PingFang SC", "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei",
    system-ui, sans-serif;
  --ios-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  /* 安全区（iPhone 刘海/底部横条） */
  --ios-safe-top: env(safe-area-inset-top, 0px);
  --ios-safe-bottom: env(safe-area-inset-bottom, 0px);
}

/* 深色模式 */
@media (prefers-color-scheme: dark) {
  :root {
    --ios-label: #ffffff;
    --ios-label-2: rgba(235, 235, 245, 0.6);
    --ios-label-3: rgba(235, 235, 245, 0.3);
    --ios-bg: #000000;
    --ios-bg-elevated: #1c1c1e;
    --ios-bg-grouped: #1c1c1e;
    --ios-fill: rgba(120, 120, 128, 0.36);
    --ios-fill-2: rgba(120, 120, 128, 0.44);
    --ios-separator: rgba(84, 84, 88, 0.65);
    --ios-separator-thin: rgba(84, 84, 88, 0.4);
    --ios-shadow-1: none;
    --ios-shadow-2: 0 8px 24px rgba(0, 0, 0, 0.5);
  }
}

/* ---------------------------------------------------------------------------
 *  2. 全局重置与排版
 * ------------------------------------------------------------------------ */
html {
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}

body {
  font-family: var(--ios-font) !important;
  font-size: 15px !important;
  line-height: 1.5;
  color: var(--ios-label) !important;
  background-color: var(--ios-bg) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  letter-spacing: -0.01em;
}

body.layui-layout-body {
  background-color: var(--ios-bg) !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--ios-font);
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0;
}

a {
  color: var(--ios-blue);
  text-decoration: none;
  transition: opacity var(--ios-dur) var(--ios-ease);
}
a:active { opacity: 0.5; }

/* 滚动条：iOS 细条 */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb {
  background: rgba(120, 120, 128, 0.32);
  border-radius: var(--ios-radius-pill);
}
::-webkit-scrollbar-track { background: transparent; }

/* ---------------------------------------------------------------------------
 *  3. 表单控件
 * ------------------------------------------------------------------------ */
.layui-input,
.layui-textarea,
.layui-select,
input[type="text"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="email"],
input[type="tel"],
select,
textarea {
  font-family: var(--ios-font) !important;
  font-size: 16px !important; /* iOS 上 ≥16px 可避免聚焦时自动放大 */
  height: 44px !important;
  line-height: 44px !important;
  padding: 0 14px !important;
  color: var(--ios-label) !important;
  background: var(--ios-bg-elevated) !important;
  border: none !important;
  border-radius: var(--ios-radius) !important;
  box-shadow: inset 0 0 0 1px var(--ios-separator-thin);
  transition: box-shadow var(--ios-dur) var(--ios-ease),
    background var(--ios-dur) var(--ios-ease);
  appearance: none;
  -webkit-appearance: none;
}

.layui-textarea,
textarea {
  height: auto !important;
  min-height: 96px !important;
  line-height: 1.5 !important;
  padding: 12px 14px !important;
}

.layui-input:hover,
input[type="text"]:hover {
  box-shadow: inset 0 0 0 1px var(--ios-separator);
}

.layui-input:focus,
.layui-textarea:focus,
input:focus,
select:focus,
textarea:focus {
  outline: none !important;
  border: none !important;
  box-shadow: 0 0 0 3.5px rgba(0, 122, 255, 0.22),
    inset 0 0 0 1px var(--ios-blue) !important;
  background: var(--ios-bg-elevated) !important;
}

.layui-input::placeholder,
input::placeholder,
textarea::placeholder {
  color: var(--ios-label-3) !important;
}

/* 表单行：iOS 分组列表风格 */
.layui-form-item {
  margin-bottom: 14px;
  clear: both;
}

.layui-form-label {
  font-family: var(--ios-font) !important;
  font-size: 15px !important;
  font-weight: 500;
  color: var(--ios-label-2) !important;
  line-height: 44px !important;
  padding: 0 14px 0 0 !important;
}

.layui-input-block,
.layui-input-inline {
  margin-left: 0 !important;
  min-height: 44px;
  position: relative;
}

/* 输入框内嵌图标（iOS 风格）：图标 span + 输入框为相邻兄弟节点时自动留出左侧空间 */
.ios-field-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ios-label-3);
  font-size: 17px;
  line-height: 1;
  pointer-events: none;
  z-index: 2;
}

.ios-field-icon + .layui-input,
.ios-field-icon + input {
  padding-left: 42px !important;
}

/* 下拉选择框（layui 自绘） */
.layui-form-select .layui-input {
  cursor: pointer;
  padding-right: 38px !important;
}

.layui-form-select .layui-edge {
  border-top-color: var(--ios-label-2);
  right: 16px;
}

.layui-form-select dl {
  margin-top: 6px;
  padding: 6px;
  background: var(--ios-bg-elevated);
  border: none;
  border-radius: var(--ios-radius-lg);
  box-shadow: var(--ios-shadow-2);
  max-height: 260px;
  overflow: auto;
}

.layui-form-select dl dd,
.layui-form-select dl dt {
  font-size: 15px;
  line-height: 40px;
  padding: 0 12px;
  border-radius: var(--ios-radius-sm);
  color: var(--ios-label);
  transition: background var(--ios-dur) var(--ios-ease);
}

.layui-form-select dl dd:hover,
.layui-form-select dl dd.layui-this {
  background: rgba(0, 122, 255, 0.1) !important;
  color: var(--ios-blue) !important;
  font-weight: 500;
}

/* 复选 / 单选：iOS 圆形与勾选 */
.layui-form-checkbox[lay-skin="primary"] i,
.layui-form-radio i {
  width: 22px;
  height: 22px;
  line-height: 22px;
  border-radius: var(--ios-radius-pill);
  font-size: 14px;
  border: 1.5px solid var(--ios-label-3);
  background: transparent;
  transition: all var(--ios-dur) var(--ios-ease);
}

.layui-form-checked[lay-skin="primary"] i,
.layui-form-radioed i {
  background: var(--ios-blue);
  border-color: var(--ios-blue);
  color: #fff;
}

.layui-form-checkbox,
.layui-form-radio {
  font-size: 15px;
  color: var(--ios-label);
  padding-right: 16px;
}

/* iOS 开关 */
.layui-form-switch {
  width: 51px;
  height: 31px;
  line-height: 31px;
  border: none;
  border-radius: var(--ios-radius-pill);
  background: var(--ios-fill-2);
  transition: background var(--ios-dur) var(--ios-ease);
  box-sizing: border-box;
}

.layui-form-switch em {
  display: none;
}

.layui-form-switch i {
  width: 27px;
  height: 27px;
  left: 2px;
  top: 2px;
  border-radius: var(--ios-radius-pill);
  background: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  transition: left var(--ios-dur) var(--ios-ease);
  position: absolute;
}

.layui-form-onswitch {
  background: var(--ios-green);
  border-color: var(--ios-green);
}

.layui-form-onswitch i {
  left: 22px;
}

/* 提示文字 */
.layui-form-mid,
.layui-word-aux {
  font-size: 13px !important;
  color: var(--ios-label-2) !important;
  line-height: 22px !important;
}

.layui-form-danger {
  box-shadow: 0 0 0 3.5px rgba(255, 59, 48, 0.18),
    inset 0 0 0 1px var(--ios-red) !important;
}

/* ---------------------------------------------------------------------------
 *  4. 按钮
 * ------------------------------------------------------------------------ */
.layui-btn,
button.layui-btn,
input.layui-btn {
  font-family: var(--ios-font) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  height: 46px !important;
  line-height: 46px !important;
  padding: 0 22px !important;
  border: none !important;
  border-radius: var(--ios-radius-lg) !important;
  background: var(--ios-blue) !important;
  color: #fff !important;
  cursor: pointer;
  transition: transform 0.12s var(--ios-ease), opacity var(--ios-dur) var(--ios-ease),
    background var(--ios-dur) var(--ios-ease);
  box-shadow: none !important;
  letter-spacing: -0.01em;
}

.layui-btn:active {
  transform: scale(0.97);
  opacity: 0.85;
}

.layui-btn-normal { background: var(--ios-blue) !important; }
.layui-btn-danger,
.layui-btn-warm { background: var(--ios-red) !important; }
.layui-btn-checked,
.layui-btn-primary:hover { background: var(--ios-green) !important; }

/* 次要按钮（描边/Tinted） */
.layui-btn-primary {
  background: rgba(0, 122, 255, 0.12) !important;
  color: var(--ios-blue) !important;
}

.layui-btn-disabled,
.layui-btn[disabled] {
  opacity: 0.4 !important;
  pointer-events: none;
}

.layui-btn-sm {
  height: 34px !important;
  line-height: 34px !important;
  font-size: 14px !important;
  padding: 0 14px !important;
  border-radius: var(--ios-radius) !important;
}

.layui-btn-xs {
  height: 28px !important;
  line-height: 28px !important;
  font-size: 13px !important;
  padding: 0 10px !important;
  border-radius: var(--ios-radius-sm) !important;
  font-weight: 500 !important;
}

.layui-btn-block,
.layui-btn-fluid {
  width: 100% !important;
}

/* 按钮组：iOS 分段控件 */
.layui-btn-group {
  display: inline-flex;
  background: var(--ios-fill);
  border-radius: var(--ios-radius);
  padding: 2px;
  gap: 2px;
}

.layui-btn-group .layui-btn {
  height: 32px !important;
  line-height: 32px !important;
  font-size: 13px !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: var(--ios-label) !important;
  box-shadow: none !important;
  padding: 0 14px !important;
}

.layui-btn-group .layui-btn-primary {
  background: var(--ios-bg-elevated) !important;
  box-shadow: var(--ios-shadow-1) !important;
  font-weight: 600 !important;
}

/* ---------------------------------------------------------------------------
 *  5. 卡片 / 面板 / 分组列表
 * ------------------------------------------------------------------------ */
.layui-card {
  background: var(--ios-bg-grouped) !important;
  border-radius: var(--ios-radius-lg) !important;
  box-shadow: var(--ios-shadow-1) !important;
  overflow: hidden;
  margin-bottom: 16px;
}

.layui-card-header {
  font-size: 17px !important;
  font-weight: 600 !important;
  color: var(--ios-label) !important;
  border-bottom: 1px solid var(--ios-separator-thin) !important;
  height: auto !important;
  line-height: 1.4 !important;
  padding: 15px 16px !important;
}

.layui-card-body { padding: 16px !important; }

.layui-elem-quote {
  background: rgba(0, 122, 255, 0.08) !important;
  border-left: 3px solid var(--ios-blue) !important;
  border-radius: var(--ios-radius) !important;
  color: var(--ios-label) !important;
  padding: 12px 14px !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

.layui-elem-field { border-color: var(--ios-separator) !important; }
.layui-elem-field legend {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--ios-label-2) !important;
}

/* 分组列表容器：用 class="ios-list-group" 包住若干 ios-cell */
.ios-list-group {
  background: var(--ios-bg-grouped);
  border-radius: var(--ios-radius-lg);
  box-shadow: var(--ios-shadow-1);
  overflow: hidden;
  margin-bottom: 16px;
}

.ios-list-group.ios-list-inset { margin: 0 0 16px; }

.ios-cell {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 16px;
  min-height: 46px;
  color: var(--ios-label);
  font-size: 16px;
  background: var(--ios-bg-grouped);
  border-bottom: 1px solid var(--ios-separator-thin);
  position: relative;
}

.ios-cell:last-child { border-bottom: none; }
.ios-cell .ios-cell-label { color: var(--ios-label-2); font-size: 15px; }
.ios-cell .ios-cell-value { color: var(--ios-label-2); font-size: 15px; }
.ios-cell-link::after {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--ios-label-3);
  border-bottom: 2px solid var(--ios-label-3);
  transform: rotate(-45deg);
  margin-left: 6px;
  flex: none;
}

.ios-section-title {
  font-size: 13px;
  font-weight: 400;
  color: var(--ios-label-2);
  text-transform: none;
  padding: 4px 16px 8px;
  letter-spacing: 0.01em;
}

/* ---------------------------------------------------------------------------
 *  6. 表格：iOS 内嵌列表风格
 * ------------------------------------------------------------------------ */
.layui-table-view {
  border: none !important;
  border-radius: var(--ios-radius-lg) !important;
  background: var(--ios-bg-grouped) !important;
  box-shadow: var(--ios-shadow-1) !important;
  overflow: hidden;
  margin: 0 0 16px !important;
}

.layui-table-box { border-radius: var(--ios-radius-lg); }

.layui-table-header {
  background: var(--ios-bg-grouped) !important;
  border-bottom: 1px solid var(--ios-separator) !important;
}

.layui-table-header th,
.layui-table thead th {
  background: transparent !important;
  color: var(--ios-label-2) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  height: 40px !important;
  line-height: 40px !important;
  border-bottom: none !important;
  padding: 0 12px !important;
}

.layui-table td,
.layui-table-cell {
  font-size: 15px !important;
  color: var(--ios-label) !important;
  height: 48px !important;
  line-height: 48px !important;
  padding: 0 12px !important;
  border-color: var(--ios-separator-thin) !important;
}

.layui-table tbody tr:hover,
.layui-table-hover {
  background: rgba(0, 122, 255, 0.06) !important;
}

.layui-table tbody tr:active { background: var(--ios-fill) !important; }

.layui-table[lay-even] tbody tr:nth-child(even) {
  background: transparent !important;
}

.layui-table-page {
  background: var(--ios-bg-grouped) !important;
  border-top: 1px solid var(--ios-separator-thin) !important;
  height: auto !important;
  padding: 10px 12px !important;
}

.layui-laypage a,
.layui-laypage span {
  min-width: 32px;
  height: 32px;
  line-height: 32px;
  border-radius: var(--ios-radius-sm) !important;
  border: none !important;
  background: transparent !important;
  color: var(--ios-label) !important;
  font-size: 14px !important;
  margin-right: 4px;
}

.layui-laypage .layui-laypage-curr .layui-laypage-em {
  background: var(--ios-blue) !important;
  border-radius: var(--ios-radius-sm) !important;
}

.layui-laypage input,
.layui-laypage select {
  height: 32px !important;
  line-height: 32px !important;
  font-size: 14px !important;
  border-radius: var(--ios-radius-sm) !important;
}

.layui-table-tool {
  background: var(--ios-bg-grouped) !important;
  border-bottom: 1px solid var(--ios-separator-thin) !important;
  padding: 10px 12px !important;
  min-height: auto !important;
}

/* 注意：绝不能隐藏 .layui-table-tool-self ——
   卡密页的「导出」下拉是 JS 往这个容器里 append 的，隐藏它会导致导出功能不可达（真回归）。
   这里只把自带图标按钮改成 iOS 风格的浅灰按钮。 */
.layui-table-tool-self .layui-table-tool-temp { padding-right: 0; }

.layui-table-tool-self .layui-btn,
.layui-table-tool-self .layui-inline .layui-btn {
  height: 32px !important;
  line-height: 32px !important;
  padding: 0 12px !important;
  font-size: 13px !important;
  border-radius: var(--ios-radius-sm) !important;
  background: var(--ios-fill) !important;
  color: var(--ios-label) !important;
  font-weight: 500 !important;
}

.layui-table-link { color: var(--ios-blue) !important; }

/* 表格内小标签 */
.layui-badge,
.layui-badge-rim {
  font-family: var(--ios-font) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  height: 20px !important;
  line-height: 20px !important;
  padding: 0 8px !important;
  border-radius: var(--ios-radius-pill) !important;
  background: var(--ios-red) !important;
  color: #fff !important;
  border: none !important;
}

.layui-badge-rim {
  background: var(--ios-fill) !important;
  color: var(--ios-label-2) !important;
}

/* 状态点（可用/停用） */
.ios-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: var(--ios-radius-pill);
  margin-right: 6px;
  vertical-align: middle;
}
.ios-dot-ok { background: var(--ios-green); }
.ios-dot-off { background: var(--ios-label-3); }
.ios-dot-warn { background: var(--ios-orange); }

/* ---------------------------------------------------------------------------
 *  7. 后台框架（顶栏 / 侧栏 / 标签页）
 * ------------------------------------------------------------------------ */
.layui-layout-admin .layui-header,
.custom-header {
  background: rgba(255, 255, 255, 0.82) !important;
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--ios-separator-thin) !important;
  box-shadow: none !important;
  height: 52px !important;
  padding-top: var(--ios-safe-top);
}

@media (prefers-color-scheme: dark) {
  .layui-layout-admin .layui-header,
  .custom-header { background: rgba(28, 28, 30, 0.82) !important; }
}

.layui-layout-admin .layui-header .layui-nav,
.layui-layout-admin .layui-header .layui-nav-item a {
  color: var(--ios-label) !important;
  font-size: 15px !important;
}

.layui-layout-admin .layui-header .layui-nav .layui-nav-more {
  border-top-color: var(--ios-label-2) !important;
}

.layui-layout-admin .layui-header .layui-nav-item a:hover {
  background: transparent !important;
  opacity: 0.6;
}

.layui-layout-admin .layui-header .layui-nav-child {
  background: var(--ios-bg-elevated) !important;
  border-radius: var(--ios-radius-lg) !important;
  box-shadow: var(--ios-shadow-2) !important;
  border: none !important;
  padding: 6px !important;
  margin-top: 6px;
  min-width: 160px;
}

.layui-layout-admin .layui-header .layui-nav-child dd a {
  border-radius: var(--ios-radius-sm);
  font-size: 15px;
  padding: 0 12px;
  line-height: 40px;
}

.layui-layout-admin .layui-header .layui-nav-child dd a:hover {
  background: rgba(0, 122, 255, 0.1) !important;
  color: var(--ios-blue) !important;
}

/* 侧栏：iOS 分组列表 */
.layui-layout-admin .layui-side,
.custom-admin {
  background-color: var(--ios-bg) !important;
  border-right: 1px solid var(--ios-separator-thin) !important;
  width: 232px !important;
  top: 52px !important;
  box-shadow: none !important;
}

.layui-layout-admin .layui-side-scroll { width: 100% !important; }

.custom-logo {
  height: auto !important;
  line-height: 1.3 !important;
  padding: 20px 18px 12px !important;
  color: var(--ios-label) !important;
  border-bottom: none !important;
}

.custom-logo h1,
.custom-logo #logos {
  font-size: 22px !important;
  font-weight: 700 !important;
  letter-spacing: -0.03em;
  color: var(--ios-label) !important;
  margin: 0 !important;
  display: inline-block !important;
}

.custom-logo span,
.custom-logo #logowz {
  font-size: 13px !important;
  color: var(--ios-label-2) !important;
  margin-left: 8px;
}

.layui-nav-tree {
  background: transparent !important;
  width: 100% !important;
  padding: 4px 12px 24px;
  box-sizing: border-box;
}

.layui-nav-tree .layui-nav-item {
  margin-bottom: 2px;
}

.layui-nav-tree .layui-nav-item > a {
  height: 42px !important;
  line-height: 42px !important;
  border-radius: var(--ios-radius) !important;
  padding: 0 12px !important;
  color: var(--ios-label) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  transition: background var(--ios-dur) var(--ios-ease);
}

.layui-nav-tree .layui-nav-item > a:hover {
  background: var(--ios-fill) !important;
}

.layui-nav-tree .layui-nav-item > a .layui-icon {
  font-size: 16px !important;
  margin-right: 8px;
  color: var(--ios-blue);
}

.layui-nav-tree .layui-nav-child {
  background: transparent !important;
  padding: 2px 0 6px !important;
}

.layui-nav-tree .layui-nav-child dd {
  margin: 1px 0;
}

.layui-nav-tree .layui-nav-child dd a {
  height: 38px !important;
  line-height: 38px !important;
  padding-left: 34px !important;
  border-radius: var(--ios-radius) !important;
  color: var(--ios-label) !important;
  font-size: 14.5px !important;
  transition: background var(--ios-dur) var(--ios-ease);
}

.layui-nav-tree .layui-nav-child dd a:hover {
  background: var(--ios-fill) !important;
}

.layui-nav-tree .layui-nav-child dd a.layui-this,
.layui-nav-tree .layui-nav-child dd.layui-this > a,
.layui-nav-tree .layui-this > a {
  background: var(--ios-blue) !important;
  color: #fff !important;
  font-weight: 600 !important;
}

.layui-nav-tree .layui-nav-child dd a.layui-this::before,
.layui-nav-tree .layui-this > a::before {
  background: transparent !important;
}

.layui-nav-tree .layui-nav-bar {
  background: transparent !important;
  width: 0 !important;
}

/* 主体区 */
.layui-layout-admin .layui-body {
  background-color: var(--ios-bg) !important;
  left: 232px !important;
  top: 52px !important;
  bottom: 0 !important;
  padding: 0 !important;
}

/* 标签页：iOS 分段 + 内容留白 */
.layui-tab {
  margin: 0 !important;
  background: transparent !important;
}

.layui-tab-title {
  background: rgba(242, 242, 247, 0.9) !important;
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--ios-separator-thin) !important;
  height: 44px !important;
  line-height: 44px !important;
  padding: 0 12px;
  box-sizing: border-box;
}

@media (prefers-color-scheme: dark) {
  .layui-tab-title { background: rgba(28, 28, 30, 0.9) !important; }
}

.layui-tab-title li {
  font-size: 14px !important;
  color: var(--ios-label-2) !important;
  line-height: 44px !important;
  min-width: auto !important;
  padding: 0 14px !important;
  transition: color var(--ios-dur) var(--ios-ease);
}

.layui-tab-title li:hover { color: var(--ios-label) !important; }

.layui-tab-title .layui-this {
  color: var(--ios-label) !important;
  font-weight: 600 !important;
  background: transparent !important;
}

.layui-tab-title .layui-this::after,
.layui-tab-brief > .layui-tab-title .layui-this::after {
  border: none !important;
  border-bottom: 2.5px solid var(--ios-blue) !important;
  border-radius: 0 !important;
  height: 44px !important;
  bottom: 0 !important;
}

.layui-tab-title li .layui-tab-close {
  border-radius: var(--ios-radius-pill);
  font-size: 12px;
  color: var(--ios-label-3);
}

.layui-tab-title li .layui-tab-close:hover {
  background: var(--ios-red);
  color: #fff;
}

.layui-tab-brief > .layui-tab-more li.layui-this::after {
  border-bottom-color: var(--ios-blue) !important;
}

.layui-tab-content {
  padding: 20px !important;
  background-color: var(--ios-bg) !important;
}

.app-container.layui-tab { border: none !important; box-shadow: none !important; }
.app-container > .layui-tab-content { padding: 0 !important; height: calc(100% - 44px); }

.layui-tab-content iframe {
  width: 100%;
  height: 100%;
  border: none !important;
  display: block;
  background: var(--ios-bg);
}

.mobile-mask {
  background: rgba(0, 0, 0, 0.4) !important;
  backdrop-filter: blur(2px);
}

/* 侧栏折叠时 */
@media (max-width: 991px) {
  .layui-layout-admin .layui-body { left: 0 !important; }
  .layui-layout-admin .layui-side {
    transform: translateX(-100%);
    transition: transform var(--ios-dur) var(--ios-ease);
    z-index: 1000;
    box-shadow: var(--ios-shadow-3);
    height: 100%;
    overflow-y: auto;
  }
  .layui-layout-admin.fold-side-bar-xs .layui-side { transform: translateX(0); }
  .layui-layout-admin.fold-side-bar .layui-side { transform: translateX(0); }
}

@media (min-width: 992px) {
  .layui-layout-admin.fold-side-bar .layui-side { width: 64px !important; }
  .layui-layout-admin.fold-side-bar .layui-body { left: 64px !important; }
  .layui-layout-admin.fold-side-bar .layui-nav-tree .layui-nav-child,
  .layui-layout-admin.fold-side-bar .custom-logo span,
  .layui-layout-admin.fold-side-bar .layui-nav-tree em { display: none !important; }
}

/* ---------------------------------------------------------------------------
 *  8. 弹窗 / 提示（layer 与 sweetalert）
 * ------------------------------------------------------------------------ */
.layui-layer {
  border-radius: var(--ios-radius-lg) !important;
  box-shadow: var(--ios-shadow-3) !important;
  border: none !important;
  background: var(--ios-bg-elevated) !important;
  overflow: hidden;
}

.layui-layer-title {
  background: transparent !important;
  border-bottom: 1px solid var(--ios-separator-thin) !important;
  color: var(--ios-label) !important;
  font-family: var(--ios-font) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  height: 52px !important;
  line-height: 52px !important;
  padding: 0 20px !important;
}

.layui-layer-content {
  color: var(--ios-label) !important;
  font-family: var(--ios-font) !important;
  font-size: 15px !important;
}

.layui-layer-btn {
  padding: 8px 16px 16px !important;
  text-align: right;
  border-top: 1px solid var(--ios-separator-thin) !important;
}

.layui-layer-btn a {
  font-family: var(--ios-font) !important;
  height: 38px !important;
  line-height: 38px !important;
  padding: 0 18px !important;
  border: none !important;
  border-radius: var(--ios-radius) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  background: var(--ios-fill) !important;
  color: var(--ios-blue) !important;
  margin-left: 8px !important;
}

.layui-layer-btn .layui-layer-btn0 {
  background: var(--ios-blue) !important;
  color: #fff !important;
}

/* 轻提示（layer.msg / 加载中） */
.layui-layer-msg,
.layui-layer-loading,
.layui-layer-hui {
  border-radius: var(--ios-radius-lg) !important;
  border: none !important;
  background: rgba(30, 30, 32, 0.9) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  color: #fff !important;
  box-shadow: var(--ios-shadow-2) !important;
  padding: 14px 20px !important;
  min-width: 120px !important;
  font-size: 15px !important;
}

.layui-layer-msg .layui-layer-content,
.layui-layer-loading .layui-layer-content,
.layui-layer-hui .layui-layer-content {
  color: #fff !important;
  font-size: 15px !important;
  text-align: center;
}

.layui-layer-msg i,
.layui-layer-hui i { color: #fff !important; }

.layui-layer-shade {
  background: rgba(0, 0, 0, 0.4) !important;
  opacity: 1 !important;
}

.layui-layer-tips .layui-layer-content {
  background: rgba(30, 30, 32, 0.92) !important;
  color: #fff !important;
  border-radius: var(--ios-radius) !important;
  font-size: 14px !important;
  backdrop-filter: blur(20px);
}

.layui-layer-tips .layui-layer-content .layui-layer-TipsG {
  border-right-color: rgba(30, 30, 32, 0.92) !important;
}

.layui-layer-setwin .layui-layer-close2 {
  background-color: rgba(120, 120, 128, 0.6);
  border-radius: var(--ios-radius-pill);
  color: #fff !important;
}

/* sweetalert（前台公告弹窗） */
.swal-overlay { background: rgba(0, 0, 0, 0.4) !important; }

.swal-modal {
  border-radius: var(--ios-radius-xl) !important;
  background: var(--ios-bg-elevated) !important;
  box-shadow: var(--ios-shadow-3) !important;
  font-family: var(--ios-font) !important;
  padding: 24px 20px 18px !important;
  width: auto !important;
  max-width: 92vw !important;
}

.swal-title {
  font-family: var(--ios-font) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--ios-label) !important;
  margin-bottom: 12px !important;
  padding: 0 !important;
}

.swal-text,
.swal-content {
  font-family: var(--ios-font) !important;
  font-size: 15px !important;
  color: var(--ios-label-2) !important;
  text-align: left;
  max-height: 52vh;
  overflow: auto;
  line-height: 1.6;
}

.swal-content img { max-width: 100%; border-radius: var(--ios-radius); }

.swal-button {
  font-family: var(--ios-font) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  height: 46px !important;
  border-radius: var(--ios-radius-lg) !important;
  background: var(--ios-blue) !important;
  box-shadow: none !important;
  width: 100%;
  margin: 6px 0 0 !important;
}

.swal-button:active { transform: scale(0.98); }

.swal-icon {
  border-color: var(--ios-green) !important;
  color: var(--ios-green) !important;
}

.swal-icon--success__line { background-color: var(--ios-green) !important; }
.swal-icon--success::after,
.swal-icon--success::before { background: transparent !important; }

/* Qmsg 消息条 */
.qmsg {
  font-family: var(--ios-font) !important;
  border-radius: var(--ios-radius-lg) !important;
  border: none !important;
  box-shadow: var(--ios-shadow-2) !important;
  backdrop-filter: blur(20px);
  font-size: 15px !important;
  padding: 12px 16px !important;
  min-width: 200px !important;
}

.qmsg-info { background: rgba(0, 122, 255, 0.95) !important; color: #fff !important; }
.qmsg-success { background: rgba(52, 199, 89, 0.95) !important; color: #fff !important; }
.qmsg-warning { background: rgba(255, 149, 0, 0.95) !important; color: #fff !important; }
.qmsg-error { background: rgba(255, 59, 48, 0.95) !important; color: #fff !important; }

/* ---------------------------------------------------------------------------
 *  9. 前台首页（index.php）
 * ------------------------------------------------------------------------ */
.layui-container {
  padding-left: 16px;
  padding-right: 16px;
  max-width: 560px !important;
  margin: 0 auto;
  box-sizing: border-box;
}

/* 顶部品牌区：iOS 大标题 + 毛玻璃 */
.layui-logo,
.wz-title {
  background: transparent !important;
  text-align: center;
  padding: 22px 0 6px;
}

.wz-title h1 {
  font-size: 30px !important;
  font-weight: 700 !important;
  letter-spacing: -0.04em;
  color: var(--ios-label) !important;
  line-height: 1.2;
}

.layui-logo .img {
  margin: 14px 0 4px;
}

.layui-logo .img img {
  max-width: 132px;
  border-radius: var(--ios-radius-xl) !important;
  background: var(--ios-bg-elevated) !important;
  box-shadow: var(--ios-shadow-2);
}

/* 前台卡片 */
.layui-logo .layui-card {
  box-shadow: none !important;
  background: transparent !important;
}

.layui-logo .layui-card-body { padding: 0 !important; }

/* 公告/客服/网盘 三个胶囊按钮 */
.cer {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin-top: 16px !important;
  flex-wrap: wrap;
}

.cer .buwz { text-decoration: none !important; }

.cer .layui-btn {
  min-width: 96px;
  background: var(--ios-bg-elevated) !important;
  color: var(--ios-label) !important;
  box-shadow: var(--ios-shadow-1) !important;
  border-radius: var(--ios-radius-pill) !important;
  height: 40px !important;
  line-height: 40px !important;
  font-size: 15px !important;
  font-weight: 500 !important;
}

.cer .layui-btn-danger {
  color: var(--ios-red) !important;
  background: rgba(255, 59, 48, 0.12) !important;
}
.cer .layui-btn-normal {
  color: var(--ios-blue) !important;
  background: rgba(0, 122, 255, 0.12) !important;
}
.cer .layui-btn-checked {
  color: var(--ios-green) !important;
  background: rgba(52, 199, 89, 0.14) !important;
}

/* 主面板：iOS 分组卡片 */
.main {
  background: var(--ios-bg-grouped);
  border-radius: var(--ios-radius-lg);
  box-shadow: var(--ios-shadow-1);
  padding: 6px 0 18px;
  margin-top: 18px;
  overflow: hidden;
}

.main .layui-tab { background: transparent !important; }

.main .layui-tab-title {
  background: transparent !important;
  border-bottom: 1px solid var(--ios-separator-thin) !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  display: flex;
  justify-content: space-around;
}

.main .layui-tab-title li {
  flex: 1;
  text-align: center;
  padding: 0 4px !important;
  font-size: 15px !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.main .layui-tab-title .layui-this {
  color: var(--ios-blue) !important;
}

.main .layui-tab-title .layui-this::after,
.main .layui-tab-brief > .layui-tab-title .layui-this::after {
  border-bottom: 2.5px solid var(--ios-blue) !important;
}

.main .layui-tab-content {
  padding: 18px 16px 6px !important;
  background: transparent !important;
}

/* 前台输入框：内嵌分组风格 */
.main .layui-input-block {
  margin: 0 0 12px !important;
  padding: 0 !important;
}

.main .inputs,
.main .layui-input {
  background-color: var(--ios-bg) !important;
  height: 48px !important;
  line-height: 48px !important;
  border-radius: var(--ios-radius) !important;
  box-shadow: none !important;
  font-size: 16px !important;
}

.main .inputs:focus {
  background: var(--ios-bg-elevated) !important;
  box-shadow: 0 0 0 3.5px rgba(0, 122, 255, 0.22),
    inset 0 0 0 1px var(--ios-blue) !important;
}

/* 提交按钮：iOS 大按钮 */
.main .submit,
.main .layui-btn-xs.submit {
  margin: 18px 0 6px !important;
  padding: 0 !important;
}

.main .submit .layui-btn {
  width: 100% !important;
  height: 50px !important;
  line-height: 50px !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  border-radius: var(--ios-radius-lg) !important;
}

/* 查询结果：iOS 提示卡 */
.time { width: 100% !important; margin: 12px 0 !important; }

.time > div {
  border-radius: var(--ios-radius-lg) !important;
  border: none !important;
  padding: 14px 16px !important;
  font-size: 15px !important;
  line-height: 1.55 !important;
  background: rgba(52, 199, 89, 0.12) !important;
  color: #1c7c33 !important;
  box-shadow: inset 0 0 0 1px rgba(52, 199, 89, 0.25);
}

@media (prefers-color-scheme: dark) {
  .time > div { color: #6ee08a !important; }
}

/* 底部 */
.layui-footer {
  background: transparent !important;
  color: var(--ios-label-3) !important;
  font-size: 13px !important;
  text-align: center;
  padding: 24px 0 calc(24px + var(--ios-safe-bottom)) !important;
  line-height: 1.6;
}

/* ---------------------------------------------------------------------------
 * 10. 登录页
 * ------------------------------------------------------------------------ */
.login-page,
body.ios-login {
  min-height: 100vh;
  background-color: var(--ios-bg) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px calc(24px + var(--ios-safe-bottom));
  box-sizing: border-box;
}

.login-wrap {
  width: 100%;
  max-width: 400px;
}

.login-brand {
  text-align: center;
  margin-bottom: 26px;
}

.login-brand h1 {
  font-size: 32px;
  font-weight: 700;
  letter-spacing: -0.04em;
  color: var(--ios-label);
}

.login-brand p {
  margin: 6px 0 0;
  font-size: 15px;
  color: var(--ios-label-2);
}

.login-card {
  background: var(--ios-bg-grouped);
  border-radius: var(--ios-radius-xl);
  box-shadow: var(--ios-shadow-2);
  padding: 22px 20px 20px;
}

.login-card .layui-form-item { margin-bottom: 14px; }

.login-card .layui-input-block { position: relative; }

.login-card .ios-field-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--ios-label-3);
  font-size: 17px;
  pointer-events: none;
}

.login-card .layui-input { padding-left: 42px !important; }

.login-card .captcha-row {
  display: flex;
  gap: 10px;
  align-items: center;
}

.login-card .captcha-row .layui-input { flex: 1; }

.login-card .codeimg {
  height: 48px;
  width: 118px;
  border-radius: var(--ios-radius);
  background: var(--ios-fill);
  object-fit: cover;
  cursor: pointer;
  flex: none;
}

.login-card .layui-btn {
  width: 100%;
  height: 50px !important;
  line-height: 50px !important;
  font-size: 17px !important;
}

.login-tip {
  text-align: center;
  font-size: 13px;
  color: var(--ios-label-3);
  margin-top: 18px;
  line-height: 1.6;
}

/* ---------------------------------------------------------------------------
 * 11. 后台内容页通用修饰
 * ------------------------------------------------------------------------ */
.layui-body > .layui-tab-content { padding: 20px !important; }

/* 内容页（iframe 内）也是 iOS 底 */
body:not(.layui-layout-body) { background: var(--ios-bg) !important; }

/* 页面标题（内容页内） */
.ios-page-head { margin: 0 0 18px; }

.ios-page-title {
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--ios-label);
  margin: 0 0 4px;
}

.ios-page-desc {
  font-size: 14px;
  color: var(--ios-label-2);
  margin: 0 0 16px;
}

/* 安全提示列表（后台首页由 PHP 输出的 list-group-item / btn-sm 标签，
   这里只用 CSS 把它们改造成 iOS 内嵌列表样式，不改任何输出逻辑） */
#test2 { margin: 0; padding: 0; list-style: none; }

#test2 .list-group-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  list-style: none;
  padding: 13px 16px;
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
  color: var(--ios-label);
  background: var(--ios-bg-grouped);
  border-bottom: 1px solid var(--ios-separator-thin);
}

#test2 .list-group-item:first-child {
  border-top-left-radius: var(--ios-radius-lg);
  border-top-right-radius: var(--ios-radius-lg);
}

#test2 .list-group-item:last-child {
  border-bottom: none;
  border-bottom-left-radius: var(--ios-radius-lg);
  border-bottom-right-radius: var(--ios-radius-lg);
}

#test2 .btn-sm {
  flex: none;
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  height: 20px;
  padding: 0 8px;
  border-radius: var(--ios-radius-pill);
  color: #fff;
  background: var(--ios-label-3);
  white-space: nowrap;
  margin-top: 1px;
}

#test2 .btn-danger { background: var(--ios-red); }
#test2 .btn-warning { background: var(--ios-orange); }
#test2 .btn-success { background: var(--ios-green); }
#test2 .btn-info,
#test2 .btn-primary { background: var(--ios-blue); }

/* 首页安全提示放进卡片里更整齐 */
.layui-elem-quote #test2 {
  border-radius: var(--ios-radius-lg);
  overflow: hidden;
  box-shadow: var(--ios-shadow-1);
  background: var(--ios-bg-grouped);
}

.layui-elem-quote {
  border-left: none !important;
  background: transparent !important;
  padding: 0 !important;
}

/* 统计卡片（控制台） */
.ios-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.ios-stat {
  background: var(--ios-bg-grouped);
  border-radius: var(--ios-radius-lg);
  box-shadow: var(--ios-shadow-1);
  padding: 16px;
  position: relative;
  overflow: hidden;
}

.ios-stat .ios-stat-label {
  font-size: 13px;
  color: var(--ios-label-2);
  margin-bottom: 6px;
}

.ios-stat .ios-stat-value {
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--ios-label);
  line-height: 1.15;
}

.ios-stat .ios-stat-icon {
  position: absolute;
  right: 14px;
  top: 14px;
  font-size: 22px;
  opacity: 0.35;
}

.ios-stat.ios-stat-blue .ios-stat-value { color: var(--ios-blue); }
.ios-stat.ios-stat-green .ios-stat-value { color: var(--ios-green); }
.ios-stat.ios-stat-orange .ios-stat-value { color: var(--ios-orange); }
.ios-stat.ios-stat-purple .ios-stat-value { color: var(--ios-purple); }

/* 工具条 */
.ios-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 14px;
}

.ios-toolbar .layui-input { max-width: 220px; }

/* 危险操作红字 */
.ios-danger-text { color: var(--ios-red) !important; }
.ios-ok-text { color: var(--ios-green) !important; }
.ios-muted { color: var(--ios-label-2) !important; }

/* 空状态 */
.ios-empty {
  text-align: center;
  padding: 48px 16px;
  color: var(--ios-label-3);
  font-size: 15px;
}

/* ---------------------------------------------------------------------------
 * 12. 移动端适配
 * ------------------------------------------------------------------------ */
@media (max-width: 768px) {
  .layui-container { padding-left: 12px; padding-right: 12px; }
  .wz-title h1 { font-size: 26px !important; }
  .layui-tab-content { padding: 14px !important; }
  .ios-stat-grid { grid-template-columns: repeat(2, 1fr); }
  .ios-stat .ios-stat-value { font-size: 22px; }
  .layui-layer { max-width: 92vw !important; }
  .ios-toolbar .layui-input { max-width: 100%; }

  /* 表格在窄屏下变成卡片列表（不改 DOM，只用 CSS） */
  .layui-table-view .layui-table td:first-child,
  .layui-table-view .layui-table th:first-child { display: table-cell; }
  .ios-page-title { font-size: 22px; }
}

@media (max-width: 420px) {
  .cer .layui-btn { min-width: 84px; padding: 0 14px !important; }
  .main .layui-tab-title li { font-size: 14px !important; }
}

/* 打印友好 */
@media print {
  .layui-header, .layui-side, .mobile-mask { display: none !important; }
  .layui-body { left: 0 !important; top: 0 !important; }
}

/* ---------------------------------------------------------------------------
 * 13. 旧主题色中和（theme.css / admin.css / home.css / logon.css 残留的
 *     绿色系配色统一收口到 iOS 系统色，避免"皮肤花掉"）
 * ------------------------------------------------------------------------ */
.layui-bg-green, .layui-bg-cyan, .layui-bg-blue, .layui-bg-black,
.layui-bg-normal, .layui-btn-normal { background-color: var(--ios-blue) !important; }
.layui-bg-red, .layui-bg-orange { background-color: var(--ios-red) !important; }
.layui-bg-green { background-color: var(--ios-green) !important; }
.layui-bg-orange { background-color: var(--ios-orange) !important; }
.layui-bg-purple { background-color: var(--ios-purple) !important; }

.layui-text-green, .layui-font-green { color: var(--ios-green) !important; }
.layui-text-red { color: var(--ios-red) !important; }
.layui-text-blue { color: var(--ios-blue) !important; }
.layui-text-orange { color: var(--ios-orange) !important; }

/* 主题遗留的卡片/表头背景 */
.card { border-radius: var(--ios-radius-lg) !important; box-shadow: var(--ios-shadow-1) !important; }
.card-box-title { font-size: 13px !important; opacity: 0.85; }
.card-box-num { font-size: 28px !important; font-weight: 700 !important; letter-spacing: -0.03em; }

/* 控制台图表区高度适配移动端 */
@media (max-width: 768px) {
  .layui-card-body[style*="55vh"] { height: 38vh !important; }
}
/* ---------------------------------------------------------------------------
 * 14. 内容页标题块紧凑化
 *     说明：列表页的表格高度是 table.render 里写的 full-170（固定扣减），
 *     加了标题块后会多出滚动条。这里把标题块压到约 48px，并已把表格高度
 *     补偿为 full-236，两端对齐后不再出现多余滚动条。
 * ------------------------------------------------------------------------ */
.ios-page-head {
  margin: 0 0 14px;
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}
.ios-page-title { font-size: 22px; margin: 0; }
.ios-page-desc { font-size: 13px; margin: 0; }

@media (max-width: 768px) {
  .ios-page-title { font-size: 20px; }
  .ios-page-desc { display: none; }
}
/* ===========================================================================
 * 15. 玻璃卡片版（前台 · 深色壁纸 + 毛玻璃 + iOS 列表卡片）
 *     视觉语言：暗色动漫壁纸 → 半透明毛玻璃卡片（backdrop-filter）→
 *     彩色圆角图标 + 主标题 + 副标题 + 右侧箭头，与 Apple 的
 *     "inset grouped list on dark material" 完全一致。
 *     实现方式仍是纯 CSS 覆盖：不新增依赖、不改任何 id / 接口 / 业务逻辑。
 * =========================================================================== */

body.ios-front {
  /* 玻璃材质令牌 */
  --glass-bg: rgba(24, 24, 30, 0.44);
  --glass-bg-strong: rgba(26, 26, 32, 0.56);
  --glass-border: rgba(255, 255, 255, 0.14);
  --glass-highlight: rgba(255, 255, 255, 0.06);
  --glass-text: #ffffff;
  --glass-text-2: rgba(255, 255, 255, 0.66);
  --glass-text-3: rgba(255, 255, 255, 0.42);

  color: var(--glass-text) !important;
  background-color: #0a0a0e !important;
  /* 壁纸 + 暗化渐变（--ios-wallpaper 由 PHP 用站点配置的图片注入） */
  /* 分层：暗化渐变 → 站点自定义图（可为 none）→ 本地默认图 → 兜底渐变
     任意一层加载失败都不影响出图（失败的层不占位） */
  background-image:
    linear-gradient(180deg, rgba(8, 8, 12, 0.42) 0%, rgba(8, 8, 12, 0.62) 42%, rgba(8, 8, 12, 0.88) 100%),
    var(--ios-wallpaper, none),
    var(--ios-wallpaper-default, url('/assets/img/bg-default.jpg')),
    linear-gradient(160deg, #2a1c3d 0%, #14141c 55%, #0a0a0e 100%);
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-color: #eef0f4;
  -webkit-backdrop-filter: saturate(120%);
  min-height: 100vh;
}

@media (max-width: 768px) {
  body.ios-front {
    /* iOS Safari 对 fixed 背景支持很差，手机/平板一律用 scroll，并把视觉重心偏右（人物在画面右侧） */
    background-attachment: scroll;
    background-position: 68% 24%;
  }
}

/* ---- 顶部品牌区 ---- */
body.ios-front .layui-logo,
body.ios-front .wz-title {
  padding: 34px 0 4px;
  text-align: center;
}

body.ios-front .wz-title h1,
body.ios-front .ios-hero-title {
  font-size: 30px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em;
  color: #fff !important;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.55);
  margin: 0 0 6px;
}

body.ios-front .ios-hero {
  text-align: center;
  padding: 30px 0 6px;
}

body.ios-front .ios-hero-sub {
  font-size: 14px;
  color: var(--glass-text-2);
  margin: 0 0 16px;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.5);
}

/* logo 图在新版里让位给壁纸（元素保留在 DOM 中，避免影响原有懒加载逻辑） */
body.ios-front .layui-logo .img { display: none !important; }

/* ---- 公告 / 客服 / 网盘：毛玻璃胶囊 ---- */
body.ios-front .cer { margin-top: 14px !important; }

body.ios-front .cer .layui-btn,
body.ios-front .cer .layui-btn-danger,
body.ios-front .cer .layui-btn-normal,
body.ios-front .cer .layui-btn-checked {
  background: var(--glass-bg) !important;
  background-image: none !important;
  color: #fff !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.28) !important;
  -webkit-backdrop-filter: blur(18px) saturate(170%);
  backdrop-filter: blur(18px) saturate(170%);
  height: 40px !important;
  line-height: 38px !important;
  font-size: 14.5px !important;
  font-weight: 500 !important;
  border-radius: var(--ios-radius-pill) !important;
  min-width: 92px;
}

body.ios-front .cer .layui-btn:active { transform: scale(0.96); opacity: 0.9; }

/* 三个按钮用一点点色调区分（保持玻璃质感） */
body.ios-front .cer .layui-btn-danger { border-color: rgba(255, 120, 110, 0.42) !important; }
body.ios-front .cer .layui-btn-normal { border-color: rgba(120, 180, 255, 0.42) !important; }
body.ios-front .cer .layui-btn-checked { border-color: rgba(120, 240, 180, 0.38) !important; }

/* ---- 主面板：透明容器 + 玻璃卡片列表 ---- */
body.ios-front .main {
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin-top: 14px !important;
  overflow: visible !important;
}

body.ios-front .main .layui-tab { border: none !important; border-radius: 0 !important; }

body.ios-front .main .layui-tab-title {
  /* 用 flex 而不是 grid：layui 给 .layui-tab-title 设了 font-size:0 + white-space:nowrap，
     在这种继承环境下 grid 容器会塌成 0 宽度（实测），flex 容器则正常撑满 */
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 12px;
  width: 100% !important;
  overflow: visible !important;
  white-space: normal !important;
  font-size: 15px !important;
  background: transparent !important;
  border: none !important;
  height: auto !important;
  line-height: 1.4 !important;
  padding: 0 !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  margin-bottom: 14px;
}

/* 每张卡片 = iOS 内嵌列表行（图标 + 标题 + 副标题 + 箭头） */
body.ios-front .main .layui-tab-title li {
  display: flex !important;
  align-items: center !important;
  gap: 14px;
  flex: 1 1 240px;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  font-size: 17px !important;
  height: auto !important;
  line-height: 1.35 !important;
  padding: 14px 16px !important;
  margin: 0 !important;
  text-align: left !important;
  border-radius: 18px !important;
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.30), inset 0 1px 0 var(--glass-highlight) !important;
  -webkit-backdrop-filter: blur(22px) saturate(170%);
  backdrop-filter: blur(22px) saturate(170%);
  color: var(--glass-text) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  transition: transform 0.14s var(--ios-ease), background 0.22s var(--ios-ease);
}

body.ios-front .main .layui-tab-title li:active { transform: scale(0.985); }

body.ios-front .main .layui-tab-title li.layui-this {
  background: rgba(0, 122, 255, 0.34) !important;
  border-color: rgba(120, 180, 255, 0.55) !important;
  box-shadow: 0 10px 30px rgba(0, 90, 220, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

/* 去掉 layui 原有的下划线选中态（避免和卡片风格打架） */
body.ios-front .main .layui-tab-title .layui-this::after,
body.ios-front .main .layui-tab-brief > .layui-tab-title .layui-this::after {
  display: none !important;
  border: none !important;
}

/* 卡片内的图标方块 */
.ios-card-icon {
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 21px;
  line-height: 1;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.ios-card-icon-blue { background: linear-gradient(160deg, #4da2ff, #0a6cff); }
.ios-card-icon-green { background: linear-gradient(160deg, #5ee08a, #17a84a); }
.ios-card-icon-purple { background: linear-gradient(160deg, #b98cff, #7b45e0); }
.ios-card-icon-orange { background: linear-gradient(160deg, #ffc463, #f08a00); }
.ios-card-icon-red { background: linear-gradient(160deg, #ff8080, #e0342b); }

.ios-card-icon .layui-icon { font-size: 21px !important; color: #fff !important; }

/* 卡片文本区 */
.ios-card-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.ios-card-title { font-size: 17px; font-weight: 600; color: #fff; letter-spacing: -0.01em; }
.ios-card-sub { font-size: 12.5px; font-weight: 400; color: var(--glass-text-2); }

/* 右侧箭头（不用 ::after，避免与 layui 的选中下划线冲突） */
.ios-card-arrow {
  flex: none;
  width: 8px;
  height: 8px;
  border-right: 2px solid rgba(255, 255, 255, 0.45);
  border-bottom: 2px solid rgba(255, 255, 255, 0.45);
  transform: rotate(-45deg);
  margin-left: 4px;
}

/* ---- 表单面板：毛玻璃 ---- */
body.ios-front .main .layui-tab-content {
  background: var(--glass-bg-strong) !important;
  border: 1px solid var(--glass-border) !important;
  border-radius: 20px !important;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.38), inset 0 1px 0 var(--glass-highlight) !important;
  -webkit-backdrop-filter: blur(26px) saturate(180%);
  backdrop-filter: blur(26px) saturate(180%);
  padding: 18px 16px 20px !important;
  margin-top: 0 !important;
}

body.ios-front .main .layui-input-block { margin-bottom: 12px !important; }

/* 输入框：深色玻璃 + 白色文字 */
body.ios-front .main .inputs,
body.ios-front .main .layui-input {
  background: rgba(255, 255, 255, 0.09) !important;
  color: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16) !important;
  border-radius: 13px !important;
  height: 48px !important;
  line-height: 48px !important;
  font-size: 16px !important;
}

body.ios-front .main .inputs:focus,
body.ios-front .main .layui-input:focus {
  background: rgba(255, 255, 255, 0.14) !important;
  box-shadow: 0 0 0 3.5px rgba(0, 122, 255, 0.28), inset 0 0 0 1px rgba(120, 180, 255, 0.9) !important;
}

body.ios-front .main .layui-input::placeholder { color: var(--glass-text-3) !important; }

body.ios-front .ios-field-icon { color: rgba(255, 255, 255, 0.55) !important; }

/* 下拉选择：深色玻璃面板 */
body.ios-front .layui-form-select .layui-input { color: #fff !important; }

body.ios-front .layui-form-select dl {
  background: rgba(24, 24, 30, 0.92) !important;
  -webkit-backdrop-filter: blur(24px) saturate(180%);
  backdrop-filter: blur(24px) saturate(180%);
  border: 1px solid var(--glass-border) !important;
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.5) !important;
}

body.ios-front .layui-form-select dl dd,
body.ios-front .layui-form-select dl dt {
  color: rgba(255, 255, 255, 0.92) !important;
}

body.ios-front .layui-form-select dl dd:hover,
body.ios-front .layui-form-select dl dd.layui-this {
  background: rgba(0, 122, 255, 0.28) !important;
  color: #fff !important;
}

body.ios-front .layui-form-select .layui-edge { border-top-color: rgba(255, 255, 255, 0.6) !important; }

/* 主按钮：iOS 蓝（玻璃底上依旧醒目） */
body.ios-front .main .submit { margin: 16px 0 2px !important; }

body.ios-front .main .submit .layui-btn {
  width: 100% !important;
  height: 50px !important;
  line-height: 50px !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  border-radius: 15px !important;
  background: linear-gradient(180deg, #2f8bff, #0a6cff) !important;
  color: #fff !important;
  box-shadow: 0 10px 26px rgba(10, 108, 255, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
}

/* 查询结果：绿色玻璃 */
body.ios-front .time { width: 100% !important; margin: 10px 0 14px !important; }

body.ios-front .time > div {
  background: rgba(52, 199, 89, 0.20) !important;
  color: #d6ffe3 !important;
  border: 1px solid rgba(52, 199, 89, 0.42) !important;
  border-radius: 16px !important;
  padding: 14px 16px !important;
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  backdrop-filter: blur(18px) saturate(160%);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28);
}

body.ios-front .time > div b { color: #fff !important; }

/* 底部 */
body.ios-front .layui-footer {
  color: var(--glass-text-3) !important;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.6);
  padding: 28px 0 calc(30px + var(--ios-safe-bottom)) !important;
}

/* 每日一言 / 联系水印（可选展示，用 .ios-quote 复用你图里的排版） */
body.ios-front .ios-quote {
  margin: 8px auto 0;
  max-width: 560px;
  text-align: center;
  color: var(--glass-text-2);
  font-size: 14px;
  line-height: 1.7;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.6);
}

body.ios-front .ios-quote-title {
  display: block;
  color: #fff;
  font-weight: 600;
  font-size: 15px;
  margin-bottom: 4px;
}

/* 桌面端：卡片三列并排（对应你图里的两列卡片网格） */
@media (min-width: 768px) {
  body.ios-front .main .layui-tab-title li { flex: 1 1 30%; }
  body.ios-front .main .layui-tab-content { padding: 22px 22px 24px !important; }
  body.ios-front .layui-container { max-width: 760px !important; }
}

/* ---- 后台登录页：同一套玻璃材质（与前台统一） ---- */
body.ios-login {
  background-color: #0a0a0e !important;
  background-image:
    linear-gradient(180deg, rgba(8, 8, 12, 0.42) 0%, rgba(8, 8, 12, 0.70) 55%, rgba(8, 8, 12, 0.9) 100%),
    var(--ios-wallpaper, linear-gradient(160deg, #2a1c3d 0%, #14141c 55%, #0a0a0e 100%));
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

body.ios-login .login-brand h1 { color: #fff !important; text-shadow: 0 2px 18px rgba(0, 0, 0, 0.6); }
body.ios-login .login-brand p { color: rgba(255, 255, 255, 0.68) !important; }

body.ios-login .login-card {
  background: rgba(24, 24, 30, 0.62) !important;
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  -webkit-backdrop-filter: blur(26px) saturate(180%);
  backdrop-filter: blur(26px) saturate(180%);
}

body.ios-login .login-card .layui-input {
  background: rgba(255, 255, 255, 0.09) !important;
  color: #fff !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16) !important;
}

body.ios-login .login-card .layui-input::placeholder { color: rgba(255, 255, 255, 0.42) !important; }
body.ios-login .login-card .ios-field-icon { color: rgba(255, 255, 255, 0.55) !important; }
body.ios-login .login-card .codeimg { background: rgba(255, 255, 255, 0.12); }
body.ios-login .login-card .layui-btn {
  background: linear-gradient(180deg, #2f8bff, #0a6cff) !important;
  box-shadow: 0 10px 26px rgba(10, 108, 255, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.28) !important;
}
body.ios-login .login-tip { color: rgba(255, 255, 255, 0.42) !important; }

/* 开关颜色统一（layui form 模块会内联注入 teal 色，这里用 !important 压过去） */
.layui-form-onswitch,
.layui-form-switch.layui-form-onswitch { background: var(--ios-green) !important; border-color: var(--ios-green) !important; }
.layui-form-onswitch i { background: #fff !important; }
/* ---------------------------------------------------------------------------
 * 16. 深色页面上的弹窗 / 提示：统一为深色玻璃（公告弹窗、layer 弹窗、轻提示）
 * ------------------------------------------------------------------------ */
body.ios-front .swal-overlay,
body.ios-login .swal-overlay { background: rgba(0, 0, 0, 0.55) !important; }

body.ios-front .swal-modal,
body.ios-login .swal-modal {
  background: rgba(26, 26, 32, 0.90) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  backdrop-filter: blur(30px) saturate(180%);
}

body.ios-front .swal-title,
body.ios-login .swal-title { color: #fff !important; }

body.ios-front .swal-text,
body.ios-front .swal-content,
body.ios-login .swal-text,
body.ios-login .swal-content { color: rgba(255, 255, 255, 0.82) !important; }

body.ios-front .swal-content a,
body.ios-front .swal-content b { color: #fff !important; }

/* 公告里的图片（管理员上传的图） */
body.ios-front .swal-content img { border-radius: 14px; }

/* layer 弹窗（前台用到的提示/确认） */
body.ios-front .layui-layer {
  background: rgba(26, 26, 32, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  -webkit-backdrop-filter: blur(28px) saturate(180%);
  backdrop-filter: blur(28px) saturate(180%);
}

body.ios-front .layui-layer-title {
  color: #fff !important;
  border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

body.ios-front .layui-layer-content { color: rgba(255, 255, 255, 0.88) !important; }

body.ios-front .layui-layer-btn {
  border-top-color: rgba(255, 255, 255, 0.12) !important;
}

body.ios-front .layui-layer-btn a {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
}

body.ios-front .layui-layer-btn .layui-layer-btn0 {
  background: linear-gradient(180deg, #2f8bff, #0a6cff) !important;
  color: #fff !important;
}
/* ===========================================================================
 * 17. 浅色玻璃模式（浅色调壁纸专用）
 *     为什么需要：默认壁纸是浅色插画，如果用深色玻璃 + 白色文字，
 *     对比度和可读性都会变差。这里用「白色毛玻璃 + 深色文字」，
 *     与 iOS 浅色模式一致；通过 body 上的 ios-glass-light / ios-glass-dark
 *     两个 class 一键切换，index.php 里已按图片自动选好。
 * =========================================================================== */
body.ios-front.ios-glass-light {
  --glass-bg: rgba(255, 255, 255, 0.62);
  --glass-bg-strong: rgba(255, 255, 255, 0.76);
  --glass-border: rgba(255, 255, 255, 0.85);
  --glass-highlight: rgba(255, 255, 255, 0.95);
  --glass-text: #1c1c1e;
  --glass-text-2: rgba(60, 60, 67, 0.62);
  --glass-text-3: rgba(60, 60, 67, 0.42);

  color: #1c1c1e !important;
  background-color: #eef0f4 !important;
  /* 浅色暗化：只加一层很淡的白纱，保留插画细节，同时让深色文字可读 */
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(255, 255, 255, 0.34) 45%, rgba(255, 255, 255, 0.70) 100%),
    var(--ios-wallpaper, none),
    var(--ios-wallpaper-default, none),
    linear-gradient(160deg, #f7f8fc 0%, #e9ecf3 100%);
}

body.ios-front.ios-glass-light .ios-hero-title,
body.ios-front.ios-glass-light .wz-title h1 {
  color: #14161a !important;
  text-shadow: 0 2px 14px rgba(255, 255, 255, 0.95);
}

body.ios-front.ios-glass-light .ios-hero-sub {
  color: rgba(60, 60, 67, 0.72) !important;
  text-shadow: 0 1px 10px rgba(255, 255, 255, 0.9);
}

/* 胶囊按钮：白玻璃 */
body.ios-front.ios-glass-light .cer .layui-btn,
body.ios-front.ios-glass-light .cer .layui-btn-danger,
body.ios-front.ios-glass-light .cer .layui-btn-normal,
body.ios-front.ios-glass-light .cer .layui-btn-checked {
  background: rgba(255, 255, 255, 0.78) !important;
  color: #1c1c1e !important;
  border: 1px solid rgba(255, 255, 255, 0.95) !important;
  box-shadow: 0 6px 18px rgba(60, 60, 67, 0.13) !important;
}

/* 卡片：白玻璃 + 深色文字 */
body.ios-front.ios-glass-light .main .layui-tab-title li {
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: 0 8px 24px rgba(60, 60, 67, 0.11), inset 0 1px 0 var(--glass-highlight) !important;
  color: #1c1c1e !important;
}

body.ios-front.ios-glass-light .main .layui-tab-title li.layui-this {
  background: rgba(0, 122, 255, 0.16) !important;
  border-color: rgba(0, 122, 255, 0.42) !important;
  box-shadow: 0 10px 26px rgba(0, 90, 220, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

body.ios-front.ios-glass-light .ios-card-title { color: #14161a; }
body.ios-front.ios-glass-light .ios-card-sub { color: rgba(60, 60, 67, 0.62); }

body.ios-front.ios-glass-light .ios-card-arrow {
  border-right-color: rgba(60, 60, 67, 0.35);
  border-bottom-color: rgba(60, 60, 67, 0.35);
}

/* 表单面板 */
body.ios-front.ios-glass-light .main .layui-tab-content {
  background: var(--glass-bg-strong) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: 0 14px 36px rgba(60, 60, 67, 0.14), inset 0 1px 0 var(--glass-highlight) !important;
}

/* 输入框：白色实底（保证可读性最好） */
body.ios-front.ios-glass-light .main .inputs,
body.ios-front.ios-glass-light .main .layui-input {
  background: rgba(255, 255, 255, 0.92) !important;
  color: #14161a !important;
  box-shadow: inset 0 0 0 1px rgba(60, 60, 67, 0.13) !important;
}

body.ios-front.ios-glass-light .main .inputs:focus,
body.ios-front.ios-glass-light .main .layui-input:focus {
  background: #fff !important;
  box-shadow: 0 0 0 3.5px rgba(0, 122, 255, 0.22), inset 0 0 0 1px var(--ios-blue) !important;
}

body.ios-front.ios-glass-light .main .layui-input::placeholder { color: rgba(60, 60, 67, 0.42) !important; }
body.ios-front.ios-glass-light .ios-field-icon { color: rgba(60, 60, 67, 0.45) !important; }

/* 下拉面板 */
body.ios-front.ios-glass-light .layui-form-select dl {
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid rgba(60, 60, 67, 0.12) !important;
  box-shadow: 0 16px 40px rgba(60, 60, 67, 0.18) !important;
}

body.ios-front.ios-glass-light .layui-form-select dl dd,
body.ios-front.ios-glass-light .layui-form-select dl dt { color: #1c1c1e !important; }

body.ios-front.ios-glass-light .layui-form-select dl dd:hover,
body.ios-front.ios-glass-light .layui-form-select dl dd.layui-this {
  background: rgba(0, 122, 255, 0.12) !important;
  color: var(--ios-blue) !important;
}

body.ios-front.ios-glass-light .layui-form-select .layui-edge { border-top-color: rgba(60, 60, 67, 0.5) !important; }

/* 查询结果 */
body.ios-front.ios-glass-light .time > div {
  background: rgba(52, 199, 89, 0.16) !important;
  color: #10592a !important;
  border: 1px solid rgba(52, 199, 89, 0.34) !important;
}

body.ios-front.ios-glass-light .time > div b { color: #0d4a23 !important; }

/* 底部 */
body.ios-front.ios-glass-light .layui-footer {
  color: rgba(60, 60, 67, 0.55) !important;
  text-shadow: none !important;
}

body.ios-front.ios-glass-light .ios-quote { color: rgba(60, 60, 67, 0.62); text-shadow: none; }
body.ios-front.ios-glass-light .ios-quote-title { color: #14161a; }

/* 浅色模式下的弹窗 */
body.ios-front.ios-glass-light .layui-layer {
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid rgba(60, 60, 67, 0.12) !important;
}

body.ios-front.ios-glass-light .layui-layer-title {
  color: #14161a !important;
  border-bottom-color: rgba(60, 60, 67, 0.12) !important;
}

body.ios-front.ios-glass-light .layui-layer-content { color: rgba(60, 60, 67, 0.9) !important; }
body.ios-front.ios-glass-light .layui-layer-btn { border-top-color: rgba(60, 60, 67, 0.12) !important; }
body.ios-front.ios-glass-light .layui-layer-btn a { background: rgba(120, 120, 128, 0.14) !important; color: var(--ios-blue) !important; }
body.ios-front.ios-glass-light .layui-layer-btn .layui-layer-btn0 { background: linear-gradient(180deg, #2f8bff, #0a6cff) !important; color: #fff !important; }

body.ios-glass-light .swal-modal { background: rgba(255, 255, 255, 0.96) !important; border: 1px solid rgba(60, 60, 67, 0.12) !important; }
body.ios-glass-light .swal-title { color: #14161a !important; }
body.ios-glass-light .swal-text,
body.ios-glass-light .swal-content { color: rgba(60, 60, 67, 0.86) !important; }
body.ios-glass-light .swal-content b { color: #14161a !important; }

/* 登录页浅色玻璃 */
body.ios-login.ios-glass-light {
  background-color: #eef0f4 !important;
  background-image:
    linear-gradient(180deg, rgba(255, 255, 255, 0.10) 0%, rgba(255, 255, 255, 0.42) 50%, rgba(255, 255, 255, 0.72) 100%),
    var(--ios-wallpaper, none),
    var(--ios-wallpaper-default, none),
    linear-gradient(160deg, #f7f8fc 0%, #e9ecf3 100%);
  background-size: cover;
  background-position: center center;
  background-attachment: scroll;
}

body.ios-login.ios-glass-light .login-brand h1 { color: #14161a !important; text-shadow: 0 2px 14px rgba(255, 255, 255, 0.95); }
body.ios-login.ios-glass-light .login-brand p { color: rgba(60, 60, 67, 0.7) !important; }

body.ios-login.ios-glass-light .login-card {
  background: rgba(255, 255, 255, 0.78) !important;
  border: 1px solid rgba(255, 255, 255, 0.95) !important;
  box-shadow: 0 18px 46px rgba(60, 60, 67, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

body.ios-login.ios-glass-light .login-card .layui-input {
  background: rgba(255, 255, 255, 0.95) !important;
  color: #14161a !important;
  box-shadow: inset 0 0 0 1px rgba(60, 60, 67, 0.13) !important;
}

body.ios-login.ios-glass-light .login-card .layui-input::placeholder { color: rgba(60, 60, 67, 0.4) !important; }
body.ios-login.ios-glass-light .login-card .ios-field-icon { color: rgba(60, 60, 67, 0.45) !important; }
body.ios-login.ios-glass-light .login-card .codeimg { background: rgba(255, 255, 255, 0.9); }
body.ios-login.ios-glass-light .login-tip { color: rgba(60, 60, 67, 0.5) !important; }

/* 平板（iPad 竖屏/横屏）微调：卡片宽度更舒展，壁纸重心略上 */
@media (min-width: 768px) and (max-width: 1024px) {
  body.ios-front { background-position: 72% 18%; }
  body.ios-front .layui-container { max-width: 640px !important; }
  body.ios-front .main .layui-tab-title li { flex: 1 1 46%; }
}
/* ---------------------------------------------------------------------------
 * 18. 壁纸独立层（.ios-bg）
 *     实测教训：把 background-image 放在 body 上会被 layui/主题里其它 body 背景
 *     规则覆盖（表现为背景图整条失效），所以壁纸改由一个专属的固定层承载：
 *     层级最低、不吃事件、随视口铺满，任意屏幕比例都用 cover 居中裁切。
 * ------------------------------------------------------------------------ */
.ios-bg {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  pointer-events: none;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: scroll;
  /* 兜底色，图片未加载完也有体面的底色 */
  background-color: var(--ios-bg);
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

/* 手机/平板：把视觉重心偏右偏上（人物在画面右侧中部），并锁住滚动不抖动 */
@media (max-width: 1024px) {
  .ios-bg {
    background-position: 26% 40%;
  }
}

/* 桌面宽屏：居中，保证人物与留白都在画面内 */
@media (min-width: 1025px) {
  .ios-bg {
    background-position: 50% center;
  }
}
/* ---------------------------------------------------------------------------
 * 19. 后台多标签（custom-tab）选中态收口
 *     admin.css 里 .layui-tab-title.custom-tab .layui-this:after 用的是主题青色块，
 *     在 iOS 皮肤下要改成"文字高亮 + 蓝色下划线"，否则会出现一块突兀的青色方块。
 * ------------------------------------------------------------------------ */
.layui-tab-title.custom-tab .layui-this {
  background-color: transparent !important;
  color: var(--ios-label) !important;
  font-weight: 600 !important;
}

.layui-tab-title.custom-tab .layui-this::after,
.layui-tab-title.custom-tab li.layui-this:after {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-bottom: 2.5px solid var(--ios-blue) !important;
  height: 44px !important;
  top: 0 !important;
  bottom: 0 !important;
}

/* 后台标签栏图标/关闭按钮与 iOS 一致 */
.layui-tab-title.custom-tab li { color: var(--ios-label-2) !important; }
.layui-tab-title.custom-tab li:hover { color: var(--ios-label) !important; }

/* 统计磁贴：让 8 个数字卡在宽屏上自动均分两行，不留孤零零一个 */
.ios-stat-grid { grid-template-columns: repeat(auto-fit, minmax(168px, 1fr)); }

@media (max-width: 768px) {
  .ios-stat-grid { grid-template-columns: repeat(2, 1fr); }
}
/* ---------------------------------------------------------------------------
 * 20. 更新地址按钮（原「网盘」入口，移到用户查询下方）
 *     样式与卡片同材质：半透明玻璃 + 描边，保证壁纸能透出来。
 * ------------------------------------------------------------------------ */
.ios-link-row {
  margin-top: 10px !important;
  margin-bottom: 2px !important;
}

.ios-btn-plain {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: 48px;
  border-radius: 15px;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none !important;
  color: #fff !important;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.22);
  -webkit-backdrop-filter: blur(18px) saturate(170%);
  backdrop-filter: blur(18px) saturate(170%);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.12);
  transition: transform 0.14s var(--ios-ease), background 0.2s var(--ios-ease);
}

.ios-btn-plain:active {
  transform: scale(0.985);
  background: rgba(255, 255, 255, 0.18);
}

.ios-btn-plain .layui-icon { font-size: 18px; }

/* 浅色玻璃模式下同步适配（如果站长切回 light） */
body.ios-front.ios-glass-light .ios-btn-plain {
  background: rgba(255, 255, 255, 0.78);
  border-color: rgba(255, 255, 255, 0.95);
  color: #1c1c1e !important;
  box-shadow: 0 6px 18px rgba(60, 60, 67, 0.13);
}

/* 标题下不再有副标题/按钮，压缩一下间距 */
body.ios-front .ios-hero { padding: 30px 0 18px; }
body.ios-front .ios-hero-title { margin-bottom: 0 !important; }
/* ---------------------------------------------------------------------------
 * 21. 壁纸铺法分端策略
 *     手机竖屏比例极窄，用 cover 会把画面放得很大（只剩一小块，看不到人物）。
 *     所以：手机 = contain 完整显示插画，上下用同色系渐变兜底（无黑边）；
 *           平板/电脑 = cover 铺满。
 *     图层顺序由 PHP 输出：暗化渐变 → 站点自定义图（可选）→ 默认插画 → 同色兜底渐变
 * ------------------------------------------------------------------------ */
.ios-bg {
  background-size: cover, cover, cover;
  background-position: center center, 50% center, center center;
}

@media (max-width: 640px) {
  .ios-bg {
    background-size: cover, contain, cover;
    background-position: center top, center 24%, center center;
  }
}

@media (min-width: 641px) and (max-width: 1024px) {
  .ios-bg {
    background-size: cover, cover, cover;
    background-position: center center, 40% center, center center;
  }
}
/* ---------------------------------------------------------------------------
 * 22. 卡片列表调整（按需求）
 *     · 卡片内只保留标题（去掉功能说明副标题），行高更紧凑
 *     · 「更新地址」是独立卡片（li.ios-link-tab），与另外三张完全同款
 *     · 手机 2 列 / 平板 2 列 / 电脑 2 列（2×2 网格，与你给的参考图一致）
 * ------------------------------------------------------------------------ */
body.ios-front .main .layui-tab-title li {
  flex: 1 1 calc(50% - 6px);
  min-width: 0;
}

body.ios-front .main .layui-tab-title .ios-card-text { gap: 0; }

/* 更新地址卡（非页签）：外层 li 去掉内边距，内层 a 承担卡片外观 */
body.ios-front .main .layui-tab-title li.ios-link-tab {
  padding: 0 !important;
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.30), inset 0 1px 0 var(--glass-highlight) !important;
}

body.ios-front .main .layui-tab-title li.ios-link-tab:active { transform: scale(0.985); }

.ios-card-link {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 14px 16px;
  box-sizing: border-box;
  text-decoration: none !important;
  color: inherit !important;
  border-radius: inherit;
}

.ios-card-link .ios-card-text { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.ios-card-link .ios-card-title { color: inherit; }

body.ios-front.ios-glass-light .main .layui-tab-title li.ios-link-tab {
  background: var(--glass-bg) !important;
  border: 1px solid var(--glass-border) !important;
  box-shadow: 0 8px 24px rgba(60, 60, 67, 0.11), inset 0 1px 0 var(--glass-highlight) !important;
}

body.ios-front.ios-glass-light .ios-card-link { color: #1c1c1e !important; }

/* 手机窄屏：字号缩小一点，保证 2 列也能完整显示标题 */
@media (max-width: 420px) {
  body.ios-front .main .layui-tab-title li { padding: 12px 12px !important; gap: 10px; }
  .ios-card-link { padding: 12px 12px; gap: 10px; }
  .ios-card-icon { width: 40px; height: 40px; border-radius: 12px; }
  .ios-card-title { font-size: 15.5px; }
  .ios-card-arrow { width: 7px; height: 7px; }
}

/* 桌面端：卡片区 2 列，间距略大 */
@media (min-width: 768px) {
  body.ios-front .main .layui-tab-title { gap: 14px; }
  body.ios-front .main .layui-tab-title li { flex: 1 1 calc(50% - 7px); }
}
/* ---------------------------------------------------------------------------
 * 23. 修正两处细节
 *     ① 卡片标题不换行（窄屏 2 列时才不会被挤成两行）
 *     ② 手机端"完整插画层"：竖屏用 contain 完整显示插画（人物可见），
 *        下层仍由 .ios-bg 的 cover 铺满，避免出现大片空白
 * ------------------------------------------------------------------------ */
.ios-card-title,
.ios-card-link .ios-card-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ios-bg-art { display: none; }

@media (max-width: 640px) {
  .ios-bg-art {
    display: block;
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    /* 第一层是轻遮罩（渐变），第二层是完整插画（contain 居中偏上，人物在可见区域内） */
    background-size: cover, contain;
    background-position: center top, center 18%;
    background-repeat: no-repeat, no-repeat;
  }
}
/* ---------------------------------------------------------------------------
 * 24. 卡片列数最终策略（按实际渲染效果定的）
 *     手机（≤560px）：单列 —— 4 字标题 + 图标 + 箭头在 200px 宽度里会被截断成省略号
 *     平板/电脑：两列 —— 与你给的参考图一致
 * ------------------------------------------------------------------------ */
@media (max-width: 560px) {
  body.ios-front .main .layui-tab-title li { flex: 1 1 100%; }
  body.ios-front .main .layui-tab-title .ios-card-title { font-size: 16.5px; }
  .ios-bg-art { background-position: center top, center 10%; }
}
/* ===========================================================================
 * 25. 最终修正（按实机渲染结果定稿）
 *   ① 更新地址卡片：主题里有一条 `.layui-tab-title li a { display:block }`
 *      （优先级 0,2,1）压过了 `.ios-card-link`（0,1,0），导致图标/文字/箭头竖着堆。
 *      这里用更高优先级 + !important 钉死为一行 flex。
 *   ② 手机端背景：原来叠了"完整图 contain"层，结果是上半部分一条画、下半部分空，
 *      观感很差。改为手机也用 cover 铺满（按人物位置取景），去掉多余那一层。
 * =========================================================================== */

body.ios-front .main .layui-tab-title li.ios-link-tab > .ios-card-link,
.ios-card-link {
  display: flex !important;
  align-items: center !important;
  flex-direction: row !important;
  gap: 14px !important;
  width: 100% !important;
  padding: 15px 16px !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
  color: inherit !important;
}

.ios-card-link .ios-card-text {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

.ios-card-link .ios-card-arrow {
  display: block !important;
  flex: none !important;
  margin-left: 4px;
}

/* 背景：统一单值，避免图层数量变化导致 size/position 错配 */
.ios-bg {
  background-size: cover !important;
  background-position: 50% 50% !important;
  background-repeat: no-repeat !important;
}

/* 手机：cover 铺满，取景对准人物（竖屏只看得到约 22% 宽度，所以按人物位置偏左） */
@media (max-width: 640px) {
  .ios-bg {
    background-position: 26% 46% !important;
  }
  /* 去掉之前那层"完整图"，否则会出现一条画 + 大片空白 */
  .ios-bg-art { display: none !important; }
}

/* 平板：略偏左，保留人物在画面内 */
@media (min-width: 641px) and (max-width: 1024px) {
  .ios-bg { background-position: 40% 50% !important; }
  .ios-bg-art { display: none !important; }
}

/* 桌面：居中，画面完整 */
@media (min-width: 1025px) {
  .ios-bg { background-position: 50% 50% !important; }
  .ios-bg-art { display: none !important; }
}
/* ---------------------------------------------------------------------------
 * 26. 卡片内边距统一（修「更新地址」卡片与其它三张不对齐）
 *     普通卡片：li 自己带内边距（窄屏 12/12、宽屏 14/16）
 *     链接卡片：li 内边距为 0，由内部 a 承担 → 必须与普通卡逐档完全一致，
 *     否则会出现"高 6px、图标左缩进多 4px"的错位（实测差异就在这）。
 * ------------------------------------------------------------------------ */
body.ios-front .main .layui-tab-title li.ios-link-tab > .ios-card-link {
  padding: 14px 16px !important;
  gap: 14px !important;
}

@media (max-width: 420px) {
  /* 与普通卡在窄屏的 12/12 内边距对齐（这一档最容易错位） */
  body.ios-front .main .layui-tab-title li.ios-link-tab > .ios-card-link {
    padding: 12px 12px !important;
    gap: 10px !important;
  }
}

/* 桌面上普通卡是 14/16、间距 14，这里保持同值 */
@media (min-width: 768px) {
  body.ios-front .main .layui-tab-title li.ios-link-tab > .ios-card-link {
    padding: 14px 16px !important;
    gap: 14px !important;
  }
}
/* ---------------------------------------------------------------------------
 * 27. 链接卡的负外边距归零（修「更新地址」图标比别的卡靠左 15px）
 *     主题里有一条 `.layui-tab-title li a { margin-left:-15px }`（layui 的老写法，
 *     用负边距让页签文字盖住内边距），我们的链接卡也是 li>a 结构，被一起带偏了。
 *     这里用 !important 明确归零，padding 仍与普通卡逐档一致。
 * ------------------------------------------------------------------------ */
body.ios-front .main .layui-tab-title li.ios-link-tab > .ios-card-link,
body.ios-front .main .layui-tab-title li.ios-link-tab > a.ios-card-link {
  margin: 0 !important;
  padding: 14px 16px !important;
  width: 100% !important;
  left: auto !important;
  right: auto !important;
  position: relative !important;
}

@media (max-width: 420px) {
  body.ios-front .main .layui-tab-title li.ios-link-tab > .ios-card-link,
  body.ios-front .main .layui-tab-title li.ios-link-tab > a.ios-card-link {
    padding: 12px 12px !important;
    gap: 10px !important;
  }
}
/* 登录页外层透明（修灰白底板挡壁纸） */
body.ios-login, .login-page { background: transparent !important; }

/* ---------------------------------------------------------------------------
 * 28. 壁纸层兜底底色（修"图片未加载完时闪一下浅灰/图片挂了整屏灰白"）
 *     实测：.ios-bg 继承到的是 --ios-bg（浅灰 #f2f2f7），深色玻璃模式下
 *     一旦壁纸层图片没渲染出来，整页就是浅灰白。这里按主题给兜底色。
 * ------------------------------------------------------------------------ */
body.ios-glass-dark .ios-bg {
  background-color: #0a0a0e !important;
}
body.ios-glass-light .ios-bg {
  background-color: #eef0f4 !important;
}
/* 前台首页同理：body 深色底已经设了，这里保证各页面一致 */
body.ios-front.ios-glass-dark,
body.ios-login.ios-glass-dark {
  background-color: #0a0a0e !important;
}
/* ---------------------------------------------------------------------------
 * 29. 下拉选择框：定位 / 宽度 / 层级修正（修后台弹窗里"选项错位 + 盖住确定按钮"）
 *     根因实测：主题 theme.css / home.css 里有两条历史规则——
 *       .layui-form-select dl { top: 30px }                       ← 位置写死，弹窗内整体偏移
 *       .layui-form-select dl dd, dt { width:75%; margin:0 auto } ← 选项只有 75% 宽且居中
 *       .layui-form-select dl dd.layui-select-tips { width:75%; margin:0 auto }
 *     这三条覆盖在 layui 原生定位之上，表现为浮层错位、选项行右侧缺一块、层级低于弹窗按钮。
 * ------------------------------------------------------------------------ */
.layui-form-select {
  position: relative;
}

/* 定位：只覆盖主题写死的 top:30px —— 故意【不加 !important】，
   这样 layui 的内联定位（如果将来升级支持智能翻转）仍然优先；
   本项目的"空间不够向上弹"由 assets/js/ios-ui.js 添加 .ios-select-up 实现。 */
body .layui-form-select.layui-form-select:not(.ios-select-fixed) dl {
  top: 100%;
  bottom: auto;
  left: 0;
  width: 100%;
  min-width: 100%;
  margin-top: 6px;
  /* 关键：限高到可视区内，否则在弹窗里会被 .layui-layer-content 的 overflow 裁掉，
     表现为"下拉里的选项滑不到、点不着" */
  max-height: min(240px, 34vh);
  overflow-y: auto;
  overscroll-behavior: contain;
  z-index: 9999;
}

/* 由 ios-ui.js 判定空间不足时添加，向上弹 */
body .layui-form-select.layui-form-select.ios-select-up:not(.ios-select-fixed) dl {
  top: auto !important;
  bottom: 100% !important;
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}

.layui-form-select dl dd,
.layui-form-select dl dt,
.layui-form-select dl dd.layui-select-tips {
  width: auto !important;        /* 选项铺满整行 */
  margin: 0 !important;          /* 不再居中 */
  float: none !important;
  text-align: left;
}
/* ---------------------------------------------------------------------------
 * 30. 后台表单对齐 + 弹窗内下拉逃出裁剪
 *     实测根因（都来自旧主题，不是业务代码）：
 *       ① theme.css：.layui-input-block{ height:60px; line-height:60px; text-align:center; margin:0 auto }
 *          → 输入块被撑到 60px 且内容居中，视觉上整体偏移
 *       ② theme.css / home.css：.layui-form-label{ width:50px; float:left }
 *          → 标签被压成 50px 宽，必填红星号被挤到第二行
 *       ③ layer.css：.layui-layer-content{ overflow-y:auto }
 *          → 弹窗是滚动容器，绝对定位的下拉浮层被裁掉（"弹出来了却看不见"）
 * ------------------------------------------------------------------------ */

/* ① 表单标签：不再浮动、不固定宽度（iOS 风格：标签在上，控件在下） */
.layui-form .layui-form-label,
.ios-content .layui-form-label,
.layui-layer .layui-form-label {
  float: none !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
  text-align: left !important;
  padding: 0 0 6px 2px !important;
  line-height: 22px !important;
}
.layui-form .layui-form-label .layui-must,
.layui-layer .layui-must {
  margin-left: 4px;
}

/* ② 输入块：清掉固定高/行高/居中 */
.layui-form-item,
.layui-form .layui-input-block,
.layui-input-block,
.layui-input-inline,
.layui-layer .layui-input-block {
  height: auto !important;
  line-height: normal !important;
  text-align: left !important;
  color: inherit !important;
}
.layui-form .layui-input-block,
.layui-input-block,
.layui-input-inline {
  margin: 0 0 12px !important;
  padding: 0 !important;
  min-height: 44px;
  position: relative;
}
.layui-form-item { margin-bottom: 10px !important; }

/* ③ 弹窗内的下拉浮层：改成 fixed，彻底逃出 .layui-layer-content 的裁剪
 *    （坐标与最大高度由 assets/js/ios-ui.js 按实际空间动态计算） */
.layui-form-select.ios-select-fixed > dl {
  position: fixed !important;
  margin: 0 !important;
  z-index: 19891015 !important;   /* 高于 layer 自身层级 */
  max-height: 42vh;
  overflow-y: auto;
  overscroll-behavior: contain;
}
/* ---------------------------------------------------------------------------
 * 31. iOS 开关：开启态滑块必须滑到右边
 *     实测 bug：本文件里 `.layui-form-switch i { left: 2px }`（0,1,1）与 layui
 *     原版的 `.layui-form-onswitch i { left:auto; right:5px }`（0,1,1）优先级相同，
 *     而 ios.css 排在后面 → 把"开启态"整个压掉，表现为"点开启，滑块还在左边"。
 *     这里用更高优先级（0,2,1）补回开启态定位。
 * ------------------------------------------------------------------------ */
.layui-form-switch.layui-form-onswitch i,
.layui-form-switch.layui-form-onswitch em {
  left: auto !important;
  right: 2px !important;
}

/* 关闭态显式固定在左（与开启态成对，避免以后再被压掉） */
.layui-form-switch:not(.layui-form-onswitch) i {
  left: 2px !important;
  right: auto !important;
}

/* 开关文字（layui 默认显示"开/关"字样，iOS 风格隐藏，仅留颜色与滑块） */
.layui-form-switch em { display: none !important; }

/* 键盘/触控可达性：整块可点，状态过渡更顺 */
.layui-form-switch {
  cursor: pointer;
  transition: background-color var(--ios-dur, 0.25s) var(--ios-ease, ease) !important;
}
.layui-form-switch i {
  transition: left var(--ios-dur, 0.25s) var(--ios-ease, ease), right var(--ios-dur, 0.25s) var(--ios-ease, ease) !important;
}
/* ---------------------------------------------------------------------------
 * 32. 后台表单紧凑化（修"一个页面往下滑，一节一节的窗口"）
 *     实测：new_kami.php 这类长表单页，每个字段独占一行且上下留白过大
 *     （页面总高 1241px / 视口 800px），滚动时满屏都是分组卡片，像好几个窗口。
 *     这里只收紧间距与控件高度，不改结构、不改字段。
 * ------------------------------------------------------------------------ */
.ios-form-page .layui-form-item,
.ios-content .layui-form-item {
  margin-bottom: 8px !important;
}
.ios-form-page .layui-form-label,
.ios-content .layui-form-label {
  padding: 0 0 4px 2px !important;
  line-height: 20px !important;
  font-size: 14px !important;
}
.ios-form-page .layui-input-block,
.ios-content .layui-input-block {
  margin: 0 0 8px !important;
  min-height: 40px !important;
}
.ios-form-page .layui-input,
.ios-form-page .layui-select,
.ios-form-page .layui-textarea,
.ios-content .layui-input,
.ios-content .layui-textarea {
  height: 40px !important;
  line-height: 40px !important;
  font-size: 15px !important;
}
/* 说明文字（辅助提示）：缩小、贴紧，不再各占一大行 */
.ios-form-page .layui-form-mid,
.ios-content .layui-form-mid,
.ios-form-page .ios-hint,
.ios-content .ios-hint,
.ios-form-page .layui-word-aux {
  font-size: 12px !important;
  line-height: 16px !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  color: var(--ios-label-3) !important;
}
/* 分组卡片：收紧内边距与间距 */
.ios-form-page .ios-list-group,
.ios-content .ios-list-group {
  padding: 12px 14px !important;
  margin-bottom: 12px !important;
}
.ios-form-page .ios-section-title,
.ios-content .ios-section-title {
  padding: 2px 14px 6px !important;
}
.ios-form-page .ios-form-item:last-child .layui-form-item:last-child,
.ios-form-page .layui-form-item:last-child {
  margin-bottom: 0 !important;
}
/* 多选/单选的选项行也压一压 */
.ios-form-page .layui-form-checkbox,
.ios-form-page .layui-form-radio {
  margin-top: 2px !important;
  margin-bottom: 2px !important;
}

/* ---------------------------------------------------------------------------
 * 33. 默认皮肤复选框（未写 lay-skin 的 checkbox）：做成 iOS 圆角方框 + 勾选
 *     实测：new_kami.php 的「拓展参数」「卡密复制」是普通 checkbox，
 *     本文件此前只给 lay-skin="primary" 做了样式，导致这两个开关渲染成灰色方块。
 * ------------------------------------------------------------------------ */
.layui-form-checkbox:not([lay-skin]) {
  height: 24px !important;
  line-height: 24px !important;
  margin: 4px 12px 4px 0 !important;
  padding: 0 4px 0 30px !important;
  background: none !important;
  border: none !important;
  color: var(--ios-label) !important;
  font-size: 15px !important;
  position: relative;
  box-shadow: none !important;
}
.layui-form-checkbox:not([lay-skin]) i {
  position: absolute !important;
  left: 0 !important;
  top: 1px !important;
  width: 22px !important;
  height: 22px !important;
  line-height: 22px !important;
  border: 1.5px solid var(--ios-label-3) !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: transparent !important;
  font-size: 14px !important;
  text-align: center;
  transition: background var(--ios-dur) var(--ios-ease), border-color var(--ios-dur) var(--ios-ease), color var(--ios-dur) var(--ios-ease);
}
.layui-form-checkbox:not([lay-skin]).layui-form-checked i {
  background: var(--ios-blue) !important;
  border-color: var(--ios-blue) !important;
  color: #fff !important;
}
.layui-form-checkbox:not([lay-skin]):hover i {
  border-color: var(--ios-blue) !important;
}
/* ---------------------------------------------------------------------------
 * 34. 业务页合并为「单面板」（修"一个页面里一堆窗口"）
 *     实测：生成卡密/新增用户/网站管理等页面由多个分组块组成，每块各自有圆角+阴影+间距，
 *     滚动时看起来就是"一个接一个的窗口"。
 *     做法：把面板外观（背景/圆角/阴影）放到整页容器 .ios-content 上，
 *     各分组变成面板内部的小节，只用 1px 分隔线区分 —— 整页就是【一块】。
 *     （注意：不要用 :first-of-type 判断首尾，它是按标签名匹配的，会失效）
 * ------------------------------------------------------------------------ */
/* 实测结构是 .ios-content > .ios-form-page（面板在外层），所以用 :has() 反向匹配容器，
   之前写成 .ios-form-page > .ios-content 方向错了，规则一直没生效 */
.ios-content:has(.ios-form-page),
.ios-content:has(> .ios-form-page) {
  background: var(--ios-bg-elevated) !important;
  border-radius: var(--ios-radius-lg, 14px) !important;
  box-shadow: var(--ios-shadow-1, 0 1px 3px rgba(0, 0, 0, 0.08)) !important;
  padding: 0 0 8px !important;
  margin-bottom: 14px !important;
  overflow: hidden;
}

/* 标题区留白在面板内部 */
.ios-form-page .ios-page-title,
.ios-form-page .ios-page-desc {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

/* 分组：透明、无圆角、无阴影，只用分隔线 */
.ios-form-page .ios-list-group,
.ios-content .ios-list-group {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin-bottom: 0 !important;
  padding: 14px 16px !important;
  border-bottom: 1px solid var(--ios-separator, rgba(120, 120, 128, 0.16)) !important;
}
.ios-form-page .ios-list-group:last-of-type,
.ios-content .ios-list-group:last-of-type {
  border-bottom: none !important;
}

/* 小节标题也变成面板内部的一行 */
.ios-form-page .ios-section-title,
.ios-content .ios-section-title {
  padding: 14px 16px 6px !important;
  background: transparent !important;
  border-top: 1px solid var(--ios-separator, rgba(120, 120, 128, 0.16)) !important;
}
.ios-form-page .ios-section-title:first-child,
.ios-content .ios-section-title:first-child {
  border-top: none !important;
}

/* 底部按钮与工具栏：贴到面板下方，不再单独成块 */
.ios-form-page .ios-toolbar {
  margin: 12px 0 0 !important;
}
/* 第一块：只保留上圆角 */
.ios-form-page .ios-list-group:first-of-type,
.ios-content .ios-list-group:first-of-type {
  border-radius: var(--ios-radius-lg, 14px) var(--ios-radius-lg, 14px) 0 0 !important;
}

/* 最后一块：只保留下圆角，且不再画分隔线 */
.ios-form-page .ios-list-group:last-of-type,
.ios-content .ios-list-group:last-of-type {
  border-radius: 0 0 var(--ios-radius-lg, 14px) var(--ios-radius-lg, 14px) !important;
  border-bottom: none !important;
}

/* 只有一个分组时：四角都圆 */
.ios-form-page .ios-list-group:only-of-type,
.ios-content .ios-list-group:only-of-type {
  border-radius: var(--ios-radius-lg, 14px) !important;
}

/* 分组小标题：贴到面板内部，不再浮在外面形成"第三块窗口" */
.ios-form-page > .ios-section-title,
.ios-content > .ios-section-title {
  padding: 14px 16px 6px !important;
  background: var(--ios-bg-elevated) !important;
  margin-top: 0 !important;
  border-top: 1px solid var(--ios-separator, rgba(120, 120, 128, 0.16)) !important;
}
.ios-form-page > .ios-section-title:first-of-type,
.ios-content > .ios-section-title:first-of-type {
  border-top: none !important;
}
/* ---------------------------------------------------------------------------
 * 35. 默认复选框的"文字块"清掉（layui 老皮肤会给标题加灰底/绿底方块，
 *     看起来像个小按钮，和 iOS 风格不搭）
 * ------------------------------------------------------------------------ */
.layui-form-checkbox:not([lay-skin]) span {
  background: none !important;
  background-color: transparent !important;
  padding: 0 0 0 8px !important;
  margin: 0 !important;
  color: var(--ios-label) !important;
  font-size: 15px !important;
  line-height: 24px !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.layui-form-checkbox:not([lay-skin]):hover span {
  color: var(--ios-blue) !important;
  background: none !important;
}