/* ============================================================================
   一网通办 · Apple 风格主题层 (theme.css)
   ----------------------------------------------------------------------------
   在所有内联样式之后加载，覆盖设计令牌与关键组件样式，系统级生效。
   设计基准参考 Apple Human Interface Guidelines / apple.com：
   - SF Pro 字体栈 + 苹方（中文），字距收紧，字重以 500/600 为主
   - Apple 蓝 #0071e3，iOS 系统语义色
   - 中性灰体系（#1d1d1f / #6e6e73 / #86868b / #f5f5f7）
   - 大圆角（14 / 18 / 20）、发丝级描边、大范围低不透明阴影
   - 顶栏与底栏毛玻璃（saturate + blur），克制且可中断的动效
   ========================================================================== */

:root {
  /* ---- Apple 中性色 ---- */
  --color-paper: #f5f5f7;
  --color-paper-2: #ececf0;
  --color-card: #ffffff;
  --color-ink: #1d1d1f;
  --color-ink-2: #6e6e73;
  --color-ink-3: #86868b;
  --color-line: rgba(0, 0, 0, .10);
  --color-line-strong: rgba(0, 0, 0, .16);

  /* ---- Apple 蓝 ---- */
  --color-accent: #0071e3;
  --color-accent-soft: #eaf3ff;

  /* ---- iOS 系统语义色 ---- */
  --color-success: #34c759;
  --color-warning: #ff9f0a;
  --color-danger: #ff3b30;

  /* ---- 字体：SF Pro + 苹方 ---- */
  --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro SC", "SF Pro Text",
    "Helvetica Neue", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;
  --font-body: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro SC",
    "Helvetica Neue", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", system-ui, sans-serif;

  /* ---- 圆角 ---- */
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 20px;

  /* ---- 阴影：大范围、低不透明（Apple 式景深） ---- */
  --sh-xs: 0 1px 2px rgba(0, 0, 0, .04);
  --sh-sm: 0 1px 2px rgba(0, 0, 0, .04), 0 4px 14px rgba(0, 0, 0, .05);
  --sh-md: 0 2px 6px rgba(0, 0, 0, .04), 0 14px 34px rgba(0, 0, 0, .08);
  --sh-lg: 0 6px 18px rgba(0, 0, 0, .07), 0 30px 70px rgba(0, 0, 0, .14);

  /* ---- 动效 ---- */
  --ease-out: cubic-bezier(.32, .72, 0, 1);
  --ease-enter: cubic-bezier(.32, .72, 0, 1);
  --dur-fast: 160ms;
  --dur-med: 260ms;
}

/* ------------------------------------------------------------------ 基础 */
html, body {
  background: var(--color-paper);
  color: var(--color-ink);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
.alo-shell { background: var(--color-paper); }

/* 全局滚动条（macOS 观感） */
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, .18); border-radius: 999px; border: 2px solid transparent; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: rgba(0, 0, 0, .30); background-clip: content-box; }

/* ------------------------------------------------------ 顶栏（毛玻璃） */
.alo-shell .ant-layout-header {
  background: rgba(255, 255, 255, .72) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  border-bottom: 1px solid var(--color-line) !important;
  box-shadow: none !important;
}
.alo-shell .alo-header-title .txt { font-weight: 600; letter-spacing: -.011em; }

/* ------------------------------------------------------ 侧边栏（毛玻璃） */
.alo-shell .desktop-sider {
  background: rgba(255, 255, 255, .72) !important;
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  border-right: 1px solid var(--color-line) !important;
}
.alo-shell .sider-brand {
  background: transparent !important;
  border-bottom: 1px solid var(--color-line);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
}

/* 内容区：更从容的留白 */
.alo-shell .alo-content { padding: 28px 32px 84px; max-width: 1340px; }

/* ------------------------------------------------------ 标题 / 排版 */
.alo-shell .alo-page-title h2 {
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 25px;
  letter-spacing: -.022em;
  line-height: 1.22;
}
.alo-shell .alo-page-title .sub { color: var(--color-ink-3); letter-spacing: -.005em; }
.alo-shell .empty-hint { color: var(--color-ink-3); }

/* ------------------------------------------------------ 卡片 */
.alo-shell .ant-card,
.alo-shell .alo-card {
  border: 1px solid var(--color-line) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--sh-sm);
  background: var(--color-card);
}
.alo-shell .ant-card { overflow: hidden; }
.alo-shell .ant-card > .ant-card-head { border-bottom: 1px solid var(--color-line); min-height: 52px; }
.alo-shell .ant-card > .ant-card-head .ant-card-head-title { font-weight: 600; letter-spacing: -.01em; }
.alo-shell .ant-card > .ant-card-body { padding: 22px; }

/* 悬浮卡（统计 / 服务 / 消息） */
.alo-shell .stat-card,
.alo-shell .stat-tile,
.alo-shell .svc-card,
.alo-shell .msg-card,
.alo-shell .plate-preview {
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--sh-sm);
  transition: transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.alo-shell .stat-card:hover,
.alo-shell .stat-tile.tappable:hover,
.alo-shell .svc-card:hover,
.alo-shell .msg-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-md);
  border-color: rgba(0, 113, 227, .30) !important;
}

/* Hero 横幅：更大圆角与柔和阴影 */
.alo-shell .alo-hero { border-radius: 24px; box-shadow: var(--sh-md); }

/* ------------------------------------------------------ 按钮 */
.alo-shell .ant-btn {
  height: 38px;
  padding: 0 18px;
  border-radius: 12px;
  font-weight: 500;
  letter-spacing: -.01em;
  box-shadow: none;
  transition: background .18s var(--ease-out), color .18s var(--ease-out),
    border-color .18s var(--ease-out), box-shadow .18s var(--ease-out), transform .12s var(--ease-out);
}
.alo-shell .ant-btn-sm { height: 32px; padding: 0 14px; border-radius: 10px; }
.alo-shell .ant-btn-lg { height: 46px; padding: 0 24px; border-radius: 14px; }

/* 主按钮：Apple 蓝 + 微光晕 */
.alo-shell .ant-btn-primary {
  background: var(--color-accent);
  border-color: var(--color-accent);
  box-shadow: 0 4px 14px rgba(0, 113, 227, .28);
}
.alo-shell .ant-btn-primary:not(:disabled):hover {
  background: #0077ed;
  border-color: #0077ed;
  box-shadow: 0 6px 18px rgba(0, 113, 227, .34);
}
.alo-shell .ant-btn-primary:not(:disabled):active { transform: scale(.975); }

/* 次级按钮：浅灰填充、无边框（Apple 次要按钮） */
.alo-shell .ant-btn:not(.ant-btn-primary):not(.ant-btn-text):not(.ant-btn-link):not(.ant-btn-ghost):not(.ant-btn-dangerous):not(:disabled) {
  background: #f5f5f7;
  border-color: transparent;
  color: var(--color-ink);
}
.alo-shell .ant-btn:not(.ant-btn-primary):not(.ant-btn-text):not(.ant-btn-link):not(.ant-btn-ghost):not(.ant-btn-dangerous):not(:disabled):hover {
  background: #ececf0;
  border-color: transparent;
  color: var(--color-ink);
}
.alo-shell .ant-btn-default.ant-btn-dangerous:not(:disabled) {
  color: var(--color-danger);
  background: rgba(255, 59, 48, .08);
  border-color: transparent;
}
.alo-shell .ant-btn-default.ant-btn-dangerous:not(:disabled):hover {
  color: #d70015;
  background: rgba(255, 59, 48, .14);
  border-color: transparent;
}
.alo-shell .ant-btn-text, .alo-shell .ant-btn-link { font-weight: 500; color: var(--color-accent); }
.alo-shell .ant-btn:active { transform: scale(.98); }

/* ------------------------------------------------------ 输入 / 选择 */
.alo-shell .ant-input,
.alo-shell .ant-input-affix-wrapper,
.alo-shell .ant-select:not(.ant-select-customize-input) .ant-select-selector,
.alo-shell .ant-input-number,
.alo-shell .ant-picker,
.alo-shell .ant-cascader-picker {
  border-radius: 11px !important;
  background: #f5f5f7 !important;
  border-color: transparent !important;
  box-shadow: none;
}
.alo-shell .ant-input:hover,
.alo-shell .ant-input-affix-wrapper:hover,
.alo-shell .ant-select:not(.ant-select-disabled):hover .ant-select-selector,
.alo-shell .ant-picker:hover,
.alo-shell .ant-input-number:hover { background: #efeff3 !important; border-color: transparent !important; }
.alo-shell .ant-input:focus,
.alo-shell .ant-input-focused,
.alo-shell .ant-input-affix-wrapper-focused,
.alo-shell .ant-select-focused:not(.ant-select-disabled) .ant-select-selector,
.alo-shell .ant-picker-focused,
.alo-shell .ant-input-number-focused {
  background: #fff !important;
  border-color: var(--color-accent) !important;
  box-shadow: 0 0 0 4px rgba(0, 113, 227, .14) !important;
}
.alo-shell .ant-form-item-label > label { font-weight: 500; color: var(--color-ink-2); }

/* ------------------------------------------------------ 侧边菜单 */
.alo-shell .desktop-sider .ant-menu { background: transparent; }
.alo-shell .desktop-sider .ant-menu-item { border-radius: 10px; }
.alo-shell .desktop-sider .ant-menu-item:hover { background: rgba(0, 0, 0, .045); color: var(--color-ink); }
.alo-shell .desktop-sider .ant-menu-item-selected {
  background: var(--color-accent-soft) !important;
  color: var(--color-accent) !important;
  font-weight: 600;
}
.alo-shell .desktop-sider .ant-menu-item-group-title { color: var(--color-ink-3); font-size: 11px; letter-spacing: .04em; text-transform: uppercase; }

/* ------------------------------------------------------ 标签页 / 分段控件 */
.alo-shell .ant-tabs-nav::before { border-bottom: 1px solid var(--color-line); }
.alo-shell .ant-tabs-tab { font-weight: 500; }
.alo-shell .ant-tabs-tab-active .ant-tabs-tab-btn { color: var(--color-accent) !important; font-weight: 600; }
.alo-shell .ant-tabs-ink-bar { background: var(--color-accent); height: 2.5px; border-radius: 3px; }
.alo-shell .ant-segmented { background: #ececf0; padding: 3px; border-radius: 12px; }
.alo-shell .ant-segmented-item { border-radius: 9px; font-weight: 500; }
.alo-shell .ant-segmented-item-selected {
  background: #fff;
  border-radius: 9px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
  color: var(--color-ink);
}
.alo-shell .ant-segmented-item-selected .ant-segmented-item-label { font-weight: 600; }

/* ------------------------------------------------------ 表格 */
.alo-shell .ant-table { background: transparent; font-size: 13.5px; }
.alo-shell .ant-table-thead > tr > th {
  background: #fbfbfd;
  color: var(--color-ink-3);
  font-weight: 600;
  letter-spacing: -.005em;
}
.alo-shell .ant-table-thead > tr > th::before { display: none; }
.alo-shell .ant-table-tbody > tr > td { border-bottom: 1px solid rgba(0, 0, 0, .055); }
.alo-shell .ant-table-tbody > tr:hover > td { background: #f7f9fc !important; }

/* ------------------------------------------------------ 其它组件 */
.alo-shell .ant-tag { border-radius: 8px; font-weight: 500; }
.alo-shell .ant-collapse { border-radius: 16px; background: #fff; border-color: var(--color-line); }
.alo-shell .ant-collapse > .ant-collapse-item > .ant-collapse-header { font-weight: 600; }
.alo-shell .ant-list-item { border-radius: 12px; border-block-end: 1px solid var(--color-line); }
.alo-shell .ant-descriptions-bordered .ant-descriptions-view { border-radius: 14px; overflow: hidden; border-color: var(--color-line); }
.alo-shell .ant-descriptions-bordered .ant-descriptions-item-label { background: #fbfbfd; color: var(--color-ink-2); font-weight: 500; }
.alo-shell .ant-empty-description { color: var(--color-ink-3); }

/* 弹窗 / 抽屉圆角 */
.ant-modal-content { border-radius: 20px; overflow: hidden; }
.ant-drawer-right .ant-drawer-content { border-radius: 20px 0 0 20px; }
.ant-drawer-bottom .ant-drawer-content { border-radius: 20px 20px 0 0; }
.ant-drawer-header { border-bottom: 1px solid var(--color-line); }
.ant-modal-header { border-bottom: 1px solid var(--color-line); }

/* ------------------------------------------------------ 移动端底栏（毛玻璃） */
@media (max-width: 767px) {
  .alo-shell .alo-content { padding: 16px 16px 88px; }
  .alo-shell .mobile-nav {
    background: rgba(255, 255, 255, .82) !important;
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    backdrop-filter: saturate(180%) blur(20px);
    border-top: 1px solid var(--color-line);
    box-shadow: 0 -8px 30px -22px rgba(0, 0, 0, .5);
  }
  .alo-shell .alo-page-title h2 { font-size: 21px; }
}

/* ------------------------------------------------------ 无障碍：减少动效 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}