/* ============================================================
   Client 区全站暗色科技主题 · dark-theme.css · 2026-08-30
   ------------------------------------------------------------
   作用域：仅 body:has(.pn-navbar) 命中的页面 = client 区布局
   （resources/views/client/layouts/app.blade.php 渲染的一切页面）。
   前台首页（/）与登录/注册等独立整页模板均不含 .pn-navbar，
   本文件任何选择器都不会命中它们 —— 天然隔离，无需排除。
   设计语言与 ui-refresh.css 尾部「登录/注册科技感深色背景」段
   完全一致：同一张背景图 + 同一套深蓝渐变 + 玻璃拟态卡片。
   依赖加载顺序：本文件必须以 <link> 放在 ui-refresh.css 之后。
   说明：所有规则均带 !important（覆盖模板内联样式与主题变量）；
   body 本体规则用双 :has 提升特异性，与布局内联
   :root[data-theme="dark"] body 打平后靠加载顺序取胜。
   ============================================================ */

/* ── 0. 设计令牌重映射：布局与 ui-refresh 的变量在 client 区整体翻转
      自定义属性可继承，设在 body 上只影响 client 区，不污染 :root ── */
body:has(.pn-navbar) {
    /* 布局内联 <style> 使用的令牌 */
    --primary: #4d8dff !important;
    --primary-light: rgba(77, 141, 255, 0.14) !important;
    --primary-dark: #1a66ff !important;
    --accent: #34d399 !important;
    --accent-dark: #10b981 !important;
    --danger: #ef4444 !important;
    --warning: #f59e0b !important;
    --success: #10b981 !important;
    --bg: rgba(255, 255, 255, 0.045) !important;
    --card: rgba(15, 20, 50, 0.62) !important;
    --border: rgba(255, 255, 255, 0.14) !important;
    --text: rgba(255, 255, 255, 0.92) !important;
    --muted: rgba(255, 255, 255, 0.62) !important;
    --shadow: 0 8px 32px rgba(0, 0, 0, 0.45) !important;
    --shadow-md: 0 12px 40px rgba(0, 0, 0, 0.55) !important;
    --radius: 14px !important;
    --radius-sm: 10px !important;
    /* ui-refresh.css（ur- 前缀）令牌 */
    --ur-primary: #4d8dff !important;
    --ur-primary-hover: #7db0ff !important;
    --ur-primary-soft: rgba(0, 82, 255, 0.16) !important;
    --ur-primary-soft-hover: rgba(0, 82, 255, 0.10) !important;
    --ur-primary-glow: rgba(0, 82, 255, 0.35) !important;
    --ur-text: rgba(255, 255, 255, 0.92) !important;
    --ur-muted: rgba(255, 255, 255, 0.62) !important;
    --ur-faint: rgba(255, 255, 255, 0.45) !important;
    --ur-border: rgba(255, 255, 255, 0.14) !important;
    --ur-input-border: rgba(255, 255, 255, 0.22) !important;
    --ur-bg: rgba(255, 255, 255, 0.045) !important;
    --ur-card: rgba(255, 255, 255, 0.06) !important;
    --ur-shadow-card: 0 8px 32px rgba(0, 0, 0, 0.45) !important;
}

/* ── 1. 页面底色：深蓝渐变叠加科技背景图（与登录页同图同语言） ── */
body:has(.pn-navbar):has(.pn-main) {
    background:
        linear-gradient(135deg, rgba(8, 12, 36, 0.88) 0%, rgba(16, 22, 64, 0.75) 45%, rgba(6, 14, 44, 0.90) 100%),
        url('../images/auth-tech-bg.png') center / cover no-repeat fixed !important;
    background-color: #080c24 !important;
    color: rgba(255, 255, 255, 0.92) !important;
    color-scheme: dark !important;
}

/* 划选高亮：主色半透明 */
body:has(.pn-navbar) ::selection {
    background: rgba(0, 82, 255, 0.40) !important;
    color: #ffffff !important;
}

/* 滚动条：webkit 深色细条 + Firefox 协调色 */
body:has(.pn-navbar) {
    scrollbar-color: #33406b rgba(255, 255, 255, 0.04);
}
body:has(.pn-navbar)::-webkit-scrollbar {
    width: 9px !important;
    height: 9px !important;
}
body:has(.pn-navbar)::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.03) !important;
}
body:has(.pn-navbar)::-webkit-scrollbar-thumb {
    background: #2b3763 !important;
    border-radius: 9999px !important;
    border: 2px solid rgba(8, 12, 36, 0.9) !important;
}
body:has(.pn-navbar)::-webkit-scrollbar-thumb:hover {
    background: #3d4d85 !important;
}

/* ── 2. 顶部导航：深蓝玻璃 + 模糊 + 白色系链接 ── */
body:has(.pn-navbar) .pn-navbar {
    background: rgba(8, 12, 36, 0.72) !important;
    backdrop-filter: blur(18px) saturate(1.3) !important;
    -webkit-backdrop-filter: blur(18px) saturate(1.3) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.35) !important;
}
body:has(.pn-navbar) .pn-brand {
    color: #ffffff !important;
}
body:has(.pn-navbar) .pn-brand-dot {
    background: #4d8dff !important;
    box-shadow: 0 0 10px rgba(77, 141, 255, 0.9) !important;
}
body:has(.pn-navbar) .pn-nav-link {
    color: rgba(255, 255, 255, 0.72) !important;
}
body:has(.pn-navbar) .pn-nav-link:hover {
    color: #7db0ff !important;
    background: rgba(255, 255, 255, 0.08) !important;
}
/* 激活态：白字 + 主色底部 2px 指示条（inset shadow 不占布局） */
body:has(.pn-navbar) .pn-nav-link.active {
    color: #ffffff !important;
    background: rgba(77, 141, 255, 0.12) !important;
    box-shadow: inset 0 -2px 0 0 #4d8dff !important;
    border-radius: 8px 8px 0 0 !important;
}
body:has(.pn-navbar) .pn-chevron {
    color: rgba(255, 255, 255, 0.55) !important;
}

/* 下拉菜单：深色玻璃面板 */
body:has(.pn-navbar) .pn-dropdown {
    background: rgba(10, 14, 40, 0.92) !important;
    backdrop-filter: blur(20px) saturate(1.3) !important;
    -webkit-backdrop-filter: blur(20px) saturate(1.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.6) !important;
}
body:has(.pn-navbar) .pn-dropdown a {
    color: rgba(255, 255, 255, 0.82) !important;
}
body:has(.pn-navbar) .pn-dropdown a:hover {
    background: rgba(0, 82, 255, 0.18) !important;
    color: #7db0ff !important;
}
body:has(.pn-navbar) .pn-dropdown .sep {
    background: rgba(255, 255, 255, 0.10) !important;
}

/* 用户按钮 + 头像 */
body:has(.pn-navbar) .pn-user-btn {
    background: rgba(255, 255, 255, 0.10) !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    color: #ffffff !important;
}
body:has(.pn-navbar) .pn-user-btn:hover {
    background: rgba(77, 141, 255, 0.25) !important;
    border-color: rgba(77, 141, 255, 0.5) !important;
    color: #ffffff !important;
}
body:has(.pn-navbar) .pn-avatar {
    background: linear-gradient(135deg, #1a66ff 0%, #0052ff 100%) !important;
    box-shadow: 0 0 12px rgba(0, 82, 255, 0.55) !important;
}

/* 明暗切换按钮（内联样式走 var()，变量已翻转，这里补边框/悬停） */
body:has(.pn-navbar) .dark-toggle:hover {
    border-color: rgba(255, 255, 255, 0.4) !important;
    color: #ffffff !important;
}

/* 移动端汉堡菜单与抽屉 */
body:has(.pn-navbar) .pn-hamburger {
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}
body:has(.pn-navbar) .pn-hamburger span {
    background: rgba(255, 255, 255, 0.85) !important;
}
body:has(.pn-navbar) .pn-mobile-menu {
    background: rgba(8, 12, 36, 0.94) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.10) !important;
}
body:has(.pn-navbar) .pn-mobile-menu a {
    color: rgba(255, 255, 255, 0.82) !important;
}
body:has(.pn-navbar) .pn-mobile-menu a:hover {
    background: rgba(0, 82, 255, 0.16) !important;
    color: #7db0ff !important;
}
body:has(.pn-navbar) .pn-mobile-sec {
    color: rgba(255, 255, 255, 0.45) !important;
}

/* ── 3. 页脚：透明深底 + 浅色信任文字 ── */
body:has(.pn-navbar) .pn-footer {
    background: rgba(8, 12, 36, 0.5) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.10) !important;
    color: rgba(255, 255, 255, 0.55) !important;
}
body:has(.pn-navbar) .pn-footer a {
    color: #7db0ff !important;
}
body:has(.pn-navbar) .pn-footer a:hover {
    color: #a3c7ff !important;
}

/* ── 4. 内容卡片：统一深玻璃拟态
      .pn-card（布局）/ .card（Bootstrap 风格）/ 各页面 *-card 面板 ── */
body:has(.pn-navbar) .pn-card,
body:has(.pn-navbar) .card,
body:has(.pn-navbar) [class*="-card"]:not([class*="card-"]) {
    background: rgba(15, 20, 50, 0.62) !important;
    backdrop-filter: blur(16px) saturate(1.25) !important;
    -webkit-backdrop-filter: blur(16px) saturate(1.25) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    border-radius: 14px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}
body:has(.pn-navbar) .pn-card-header,
body:has(.pn-navbar) .card-header {
    background: rgba(255, 255, 255, 0.03) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
}
body:has(.pn-navbar) .card-footer {
    background: transparent !important;
    border-top: 1px solid rgba(255, 255, 255, 0.10) !important;
}

/* ── 5. 标题与文字层级 ── */
body:has(.pn-navbar) .pn-page-title,
body:has(.pn-navbar) .pn-card-title,
body:has(.pn-navbar) .card-title,
body:has(.pn-navbar) .page-header h1,
body:has(.pn-navbar) .pn-main h1,
body:has(.pn-navbar) .pn-main h2,
body:has(.pn-navbar) .pn-main h3,
body:has(.pn-navbar) .pn-main h4,
body:has(.pn-navbar) .pn-main .h3 {
    color: rgba(255, 255, 255, 0.95) !important;
}
body:has(.pn-navbar) .pn-page-subtitle,
body:has(.pn-navbar) .text-muted,
body:has(.pn-navbar) .form-hint {
    color: rgba(255, 255, 255, 0.62) !important;
}
body:has(.pn-navbar) .text-dark {
    color: rgba(255, 255, 255, 0.92) !important;
}
body:has(.pn-navbar) .text-danger {
    color: #f87171 !important;
}
body:has(.pn-navbar) .text-warning {
    color: #fbbf24 !important;
}
body:has(.pn-navbar) .text-success {
    color: #34d399 !important;
}
body:has(.pn-navbar) .bg-warning {
    background: rgba(245, 158, 11, 0.18) !important;
}
body:has(.pn-navbar) hr {
    border-color: rgba(255, 255, 255, 0.10) !important;
}

/* ── 6. 链接：主色浅蓝，悬停更亮（排除按钮/统计卡等自带配色元素） ── */
body:has(.pn-navbar) .pn-main a:not(.btn):not(.pn-stat):not(.pn-nav-link),
body:has(.pn-navbar) .link,
body:has(.pn-navbar) .pn-back {
    color: #7db0ff !important;
}
body:has(.pn-navbar) .pn-main a:not(.btn):not(.pn-stat):not(.pn-nav-link):hover,
body:has(.pn-navbar) .link:hover,
body:has(.pn-navbar) .pn-back:hover {
    color: #a3c7ff !important;
}
body:has(.pn-navbar) .pn-table a {
    color: #7db0ff !important;
}

/* ── 7. 表格：深底表头 + 细分隔 + 主色悬停行 ── */
body:has(.pn-navbar) .pn-table th,
body:has(.pn-navbar) .pn-main table th {
    background: rgba(255, 255, 255, 0.06) !important;
    color: rgba(255, 255, 255, 0.55) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}
body:has(.pn-navbar) .pn-table td,
body:has(.pn-navbar) .pn-main table td {
    color: rgba(255, 255, 255, 0.88) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
    background: transparent !important;
}
body:has(.pn-navbar) .pn-table tbody tr:last-child td {
    border-bottom: none !important;
}
body:has(.pn-navbar) .pn-table tbody tr:hover td,
body:has(.pn-navbar) .pn-main table tbody tr:hover td {
    background: rgba(0, 82, 255, 0.10) !important;
}
body:has(.pn-navbar) .table {
    border-color: rgba(255, 255, 255, 0.08) !important;
}

/* ── 8. 表单：玻璃输入框 + 主色聚焦光晕 ── */
body:has(.pn-navbar) .form-label,
body:has(.pn-navbar) .pn-label,
body:has(.pn-navbar) .pn-main label,
body:has(.pn-navbar) [class*="-lbl"] {
    color: rgba(255, 255, 255, 0.85) !important;
}
body:has(.pn-navbar) .form-label .req {
    color: #f87171 !important;
}
body:has(.pn-navbar) input:not([type="radio"]):not([type="checkbox"]):not([type="file"]):not([type="range"]),
body:has(.pn-navbar) select,
body:has(.pn-navbar) textarea,
body:has(.pn-navbar) .form-control,
body:has(.pn-navbar) .pn-input,
body:has(.pn-navbar) .form-select {
    background: rgba(255, 255, 255, 0.10) !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
    transition: border-color 0.18s, box-shadow 0.18s, background 0.18s !important;
}
body:has(.pn-navbar) input::placeholder,
body:has(.pn-navbar) textarea::placeholder {
    color: rgba(255, 255, 255, 0.40) !important;
}
body:has(.pn-navbar) input:focus,
body:has(.pn-navbar) select:focus,
body:has(.pn-navbar) textarea:focus,
body:has(.pn-navbar) .form-control:focus,
body:has(.pn-navbar) .pn-input:focus,
body:has(.pn-navbar) .form-select:focus {
    background: rgba(255, 255, 255, 0.14) !important;
    border-color: #4d8dff !important;
    box-shadow: 0 0 0 3px rgba(0, 82, 255, 0.35) !important;
    outline: 0 !important;
}
/* 原生下拉选项面板与日期控件图标适配深底 */
body:has(.pn-navbar) select option {
    background: #0d1335 !important;
    color: rgba(255, 255, 255, 0.92) !important;
}
body:has(.pn-navbar) input[type="date"]::-webkit-calendar-picker-indicator,
body:has(.pn-navbar) input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    filter: invert(1) !important;
    opacity: 0.7 !important;
}
body:has(.pn-navbar) input[type="radio"],
body:has(.pn-navbar) input[type="checkbox"] {
    accent-color: #4d8dff !important;
}
body:has(.pn-navbar) input[type="range"] {
    accent-color: #4d8dff !important;
}
body:has(.pn-navbar) input[type="file"] {
    color: rgba(255, 255, 255, 0.75) !important;
}
body:has(.pn-navbar) input[type="file"]::file-selector-button {
    background: rgba(255, 255, 255, 0.10) !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    color: rgba(255, 255, 255, 0.85) !important;
    border-radius: 8px !important;
    padding: 6px 14px !important;
    margin-right: 10px !important;
    cursor: pointer !important;
}

/* ── 9. 按钮：主色渐变发光 / 玻璃描边次按钮 ── */
body:has(.pn-navbar) .btn,
body:has(.pn-navbar) .pn-btn {
    border-radius: 9999px !important;
}
body:has(.pn-navbar) .btn-primary,
body:has(.pn-navbar) .btn-accent,
body:has(.pn-navbar) .pn-btn-primary {
    background: linear-gradient(180deg, #1a66ff 0%, #0052ff 100%) !important;
    border: none !important;
    color: #ffffff !important;
    box-shadow: 0 4px 18px rgba(0, 82, 255, 0.45) !important;
    transition: transform 0.15s, box-shadow 0.18s !important;
}
body:has(.pn-navbar) .btn-primary:hover,
body:has(.pn-navbar) .btn-accent:hover,
body:has(.pn-navbar) .pn-btn-primary:hover {
    background: linear-gradient(180deg, #3577ff 0%, #0a44d6 100%) !important;
    box-shadow: 0 6px 26px rgba(0, 82, 255, 0.65) !important;
    transform: translateY(-1px) !important;
    color: #ffffff !important;
}
/* 次按钮：玻璃描边（同登录页微信按钮写法） */
body:has(.pn-navbar) .btn-outline,
body:has(.pn-navbar) .btn-default,
body:has(.pn-navbar) .btn-secondary {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1.5px solid rgba(255, 255, 255, 0.30) !important;
    color: #ffffff !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}
body:has(.pn-navbar) .btn-outline:hover,
body:has(.pn-navbar) .btn-default:hover,
body:has(.pn-navbar) .btn-secondary:hover {
    background: rgba(255, 255, 255, 0.14) !important;
    border-color: rgba(255, 255, 255, 0.55) !important;
    color: #ffffff !important;
}
/* 危险/成功/警告：半透明色玻璃，语义保留 */
body:has(.pn-navbar) .btn-danger,
body:has(.pn-navbar) .pn-btn-danger {
    background: rgba(239, 68, 68, 0.20) !important;
    border: 1px solid rgba(239, 68, 68, 0.45) !important;
    color: #f87171 !important;
}
body:has(.pn-navbar) .btn-danger:hover,
body:has(.pn-navbar) .pn-btn-danger:hover {
    background: rgba(239, 68, 68, 0.32) !important;
    border-color: rgba(248, 113, 113, 0.65) !important;
    color: #fecaca !important;
}
body:has(.pn-navbar) .btn-success {
    background: rgba(16, 185, 129, 0.18) !important;
    border: 1px solid rgba(16, 185, 129, 0.40) !important;
    color: #34d399 !important;
}
body:has(.pn-navbar) .btn-success:hover {
    background: rgba(16, 185, 129, 0.30) !important;
    color: #6ee7b7 !important;
}
body:has(.pn-navbar) .btn-warning {
    background: rgba(245, 158, 11, 0.18) !important;
    border: 1px solid rgba(245, 158, 11, 0.40) !important;
    color: #fbbf24 !important;
}
body:has(.pn-navbar) .btn-warning:hover {
    background: rgba(245, 158, 11, 0.30) !important;
    color: #fde68a !important;
}
/* 缺货态：比禁用略亮的中性玻璃，保持不可点语义 */
body:has(.pn-navbar) .btn-outline.ur-soldout,
body:has(.pn-navbar) .btn-outline.ur-soldout:hover {
    background: rgba(255, 255, 255, 0.03) !important;
    border-color: rgba(255, 255, 255, 0.10) !important;
    color: rgba(255, 255, 255, 0.35) !important;
    cursor: default !important;
    transform: none !important;
}
/* 禁用/提交中：暗灰玻璃 */
body:has(.pn-navbar) .btn:disabled,
body:has(.pn-navbar) .btn.disabled,
body:has(.pn-navbar) .btn.submitting,
body:has(.pn-navbar) .btn-outline:disabled,
body:has(.pn-navbar) .btn-default:disabled {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: rgba(255, 255, 255, 0.35) !important;
    cursor: not-allowed !important;
    transform: none !important;
    box-shadow: none !important;
}

/* ── 10. 徽章 badge：四档语义玻璃色 ── */
/* 成功 */
body:has(.pn-navbar) .badge-active,
body:has(.pn-navbar) .badge-paid,
body:has(.pn-navbar) .badge-yes,
body:has(.pn-navbar) .badge-low {
    background: rgba(16, 185, 129, 0.18) !important;
    color: #34d399 !important;
}
/* 警告 */
body:has(.pn-navbar) .badge-pending,
body:has(.pn-navbar) .badge-unpaid,
body:has(.pn-navbar) .badge-medium,
body:has(.pn-navbar) .badge-soon {
    background: rgba(245, 158, 11, 0.18) !important;
    color: #fbbf24 !important;
}
/* 危险 */
body:has(.pn-navbar) .badge-overdue,
body:has(.pn-navbar) .badge-high,
body:has(.pn-navbar) .badge-critical,
body:has(.pn-navbar) .badge-danger {
    background: rgba(239, 68, 68, 0.18) !important;
    color: #f87171 !important;
}
/* 信息（工单开放/处理中/客户回复） */
body:has(.pn-navbar) .badge-open,
body:has(.pn-navbar) .badge-answered,
body:has(.pn-navbar) .badge-in-progress,
body:has(.pn-navbar) .badge-customer-reply {
    background: rgba(77, 141, 255, 0.16) !important;
    color: #7db0ff !important;
}
/* 中性 */
body:has(.pn-navbar) .badge-suspended,
body:has(.pn-navbar) .badge-terminated,
body:has(.pn-navbar) .badge-cancelled,
body:has(.pn-navbar) .badge-closed,
body:has(.pn-navbar) .badge-no {
    background: rgba(255, 255, 255, 0.12) !important;
    color: rgba(255, 255, 255, 0.88) !important;
}

/* ── 11. 警告条 alert：半透明深色写法（同登录页） ── */
body:has(.pn-navbar) .pn-alert {
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    border-radius: 10px !important;
}
body:has(.pn-navbar) .pn-alert-success,
body:has(.pn-navbar) .alert-success {
    background: rgba(16, 185, 129, 0.12) !important;
    border: 1px solid rgba(52, 211, 153, 0.35) !important;
    color: #6ee7b7 !important;
}
body:has(.pn-navbar) .pn-alert-error,
body:has(.pn-navbar) .pn-alert-danger,
body:has(.pn-navbar) .alert-danger {
    background: rgba(239, 68, 68, 0.12) !important;
    border: 1px solid rgba(248, 113, 113, 0.40) !important;
    color: #fca5a5 !important;
}
body:has(.pn-navbar) .pn-alert-info,
body:has(.pn-navbar) .alert-info {
    background: rgba(0, 82, 255, 0.14) !important;
    border: 1px solid rgba(77, 141, 255, 0.40) !important;
    color: #a3c7ff !important;
}
body:has(.pn-navbar) .pn-alert-warning,
body:has(.pn-navbar) .alert-warning {
    background: rgba(245, 158, 11, 0.12) !important;
    border: 1px solid rgba(251, 191, 36, 0.35) !important;
    color: #fcd34d !important;
}
body:has(.pn-navbar) .pn-alert a {
    color: #7db0ff !important;
}

/* ── 12. 仪表盘：欢迎横幅 / 统计卡 ── */
body:has(.pn-navbar) .pn-welcome {
    background: linear-gradient(135deg, rgba(26, 102, 255, 0.32) 0%, rgba(0, 82, 255, 0.14) 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
}
body:has(.pn-navbar) .pn-stat-val {
    color: #ffffff !important;
}
body:has(.pn-navbar) .pn-stat-lbl {
    color: rgba(255, 255, 255, 0.62) !important;
}
body:has(.pn-navbar) .pn-stat:hover {
    box-shadow: 0 8px 28px rgba(0, 82, 255, 0.25) !important;
}
body:has(.pn-navbar) .pn-stat-icon-blue {
    background: rgba(77, 141, 255, 0.16) !important;
    color: #7db0ff !important;
}
body:has(.pn-navbar) .pn-stat-icon-green {
    background: rgba(52, 211, 153, 0.14) !important;
    color: #34d399 !important;
}
body:has(.pn-navbar) .pn-stat-icon-orange {
    background: rgba(251, 191, 36, 0.14) !important;
    color: #fbbf24 !important;
}
body:has(.pn-navbar) .pn-stat-icon-red {
    background: rgba(248, 113, 113, 0.14) !important;
    color: #f87171 !important;
}

/* ── 13. 详情列表 / 进度条 / 空状态 / 面包屑返回 / 代码 ── */
body:has(.pn-navbar) .pn-detail-list li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
}
body:has(.pn-navbar) .pn-detail-list .key {
    color: rgba(255, 255, 255, 0.62) !important;
}
body:has(.pn-navbar) .pn-detail-list .val {
    color: rgba(255, 255, 255, 0.92) !important;
}
body:has(.pn-navbar) .pn-progress-wrap {
    background: rgba(255, 255, 255, 0.12) !important;
}
body:has(.pn-navbar) .pn-progress-fill {
    background: linear-gradient(90deg, #1a66ff 0%, #0052ff 100%) !important;
    box-shadow: 0 0 12px rgba(0, 82, 255, 0.6) !important;
}
body:has(.pn-navbar) .pn-empty {
    color: rgba(255, 255, 255, 0.55) !important;
}
body:has(.pn-navbar) .pn-empty p {
    color: rgba(255, 255, 255, 0.55) !important;
}
body:has(.pn-navbar) .pn-code,
body:has(.pn-navbar) .pn-main code {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;
    color: #a3c7ff !important;
}

/* ── 14. 工单消息流 ── */
body:has(.pn-navbar) .pn-msg {
    background: rgba(15, 20, 50, 0.62) !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
}
body:has(.pn-navbar) .pn-msg.staff {
    border-left: 3px solid #4d8dff !important;
}
body:has(.pn-navbar) .pn-msg-head {
    background: rgba(255, 255, 255, 0.05) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
}
body:has(.pn-navbar) .pn-msg.staff .pn-msg-head {
    background: rgba(0, 82, 255, 0.12) !important;
}
body:has(.pn-navbar) .pn-msg-author {
    color: rgba(255, 255, 255, 0.92) !important;
}
body:has(.pn-navbar) .pn-msg.staff .pn-msg-author {
    color: #7db0ff !important;
}
body:has(.pn-navbar) .pn-msg-date {
    color: rgba(255, 255, 255, 0.55) !important;
}
body:has(.pn-navbar) .pn-msg-body {
    color: rgba(255, 255, 255, 0.88) !important;
}

/* ── 15. 支付网关 tabs（发票/服务详情） ── */
body:has(.pn-navbar) .gw-tab {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1.5px solid rgba(255, 255, 255, 0.18) !important;
    color: rgba(255, 255, 255, 0.72) !important;
}
body:has(.pn-navbar) .gw-tab:hover {
    border-color: rgba(77, 141, 255, 0.55) !important;
    color: #7db0ff !important;
}
body:has(.pn-navbar) .gw-tab.active {
    background: linear-gradient(180deg, #1a66ff 0%, #0052ff 100%) !important;
    border-color: #0052ff !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(0, 82, 255, 0.4) !important;
}
body:has(.pn-navbar) .gw-form-box {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

/* ── 16. 商店/产品卡 · 结算 · 支付方式 · 金额档位 ── */
body:has(.pn-navbar) .pn-product-card {
    transition: all 0.2s !important;
}
body:has(.pn-navbar) .pn-product-card:hover {
    box-shadow: 0 12px 36px rgba(0, 82, 255, 0.28) !important;
    border-color: rgba(77, 141, 255, 0.45) !important;
}
body:has(.pn-navbar) .pn-product-card.featured {
    border-color: rgba(77, 141, 255, 0.6) !important;
}
body:has(.pn-navbar) .pn-product-price {
    color: #ffffff !important;
}
body:has(.pn-navbar) .pn-product-price .cycle {
    color: rgba(255, 255, 255, 0.55) !important;
}
body:has(.pn-navbar) .pn-popular {
    background: linear-gradient(90deg, #1a66ff 0%, #0052ff 100%) !important;
}
/* 支付方式 / 周期选择：玻璃卡片单选 */
body:has(.pn-navbar) .pn-pay-option,
body:has(.pn-navbar) .cycle-option,
body:has(.pn-navbar) .config-option {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 2px solid rgba(255, 255, 255, 0.14) !important;
    color: rgba(255, 255, 255, 0.85) !important;
}
body:has(.pn-navbar) .pn-pay-option:hover,
body:has(.pn-navbar) .cycle-option:hover,
body:has(.pn-navbar) .config-option:hover {
    border-color: rgba(77, 141, 255, 0.55) !important;
    background: rgba(0, 82, 255, 0.10) !important;
}
body:has(.pn-navbar) .pn-pay-option.selected,
body:has(.pn-navbar) .cycle-option.selected,
body:has(.pn-navbar) .config-option.selected {
    border-color: #4d8dff !important;
    background: rgba(0, 82, 255, 0.16) !important;
    box-shadow: 0 0 0 1px #4d8dff inset !important;
}
body:has(.pn-navbar) .cycle-label,
body:has(.pn-navbar) .pn-pay-option span {
    color: rgba(255, 255, 255, 0.62) !important;
}
body:has(.pn-navbar) .cycle-price {
    color: #7db0ff !important;
}
/* 充值金额档位 */
body:has(.pn-navbar) .pn-amount-btn {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1.5px solid rgba(255, 255, 255, 0.18) !important;
    color: rgba(255, 255, 255, 0.88) !important;
}
body:has(.pn-navbar) .pn-amount-btn:hover,
body:has(.pn-navbar) .pn-amount-btn.selected {
    border-color: #4d8dff !important;
    background: rgba(0, 82, 255, 0.16) !important;
    color: #a3c7ff !important;
}
/* 订单摘要 / 购物车明细 */
body:has(.pn-navbar) .pn-order-row,
body:has(.pn-navbar) .summary-row {
    border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
    color: rgba(255, 255, 255, 0.88) !important;
}
body:has(.pn-navbar) .pn-order-row .key {
    color: rgba(255, 255, 255, 0.62) !important;
}
body:has(.pn-navbar) .ur-total-row {
    border-top: 1px solid rgba(255, 255, 255, 0.14) !important;
}
body:has(.pn-navbar) .ur-total-val,
body:has(.pn-navbar) #summaryTotal {
    color: #7db0ff !important;
}
body:has(.pn-navbar) .order-summary {
    color: rgba(255, 255, 255, 0.88) !important;
}
/* 联盟推广统计 */
body:has(.pn-navbar) .pn-aff-val {
    color: #7db0ff !important;
}
body:has(.pn-navbar) .pn-aff-lbl {
    color: rgba(255, 255, 255, 0.55) !important;
}

/* ── 17. 分页（Laravel links() 默认 Tailwind 视图）：玻璃按钮 ── */
body:has(.pn-navbar) nav[role="navigation"] a,
body:has(.pn-navbar) nav[role="navigation"] span:not([aria-current]) {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    color: rgba(255, 255, 255, 0.75) !important;
}
body:has(.pn-navbar) nav[role="navigation"] a:hover {
    background: rgba(0, 82, 255, 0.16) !important;
    border-color: rgba(77, 141, 255, 0.5) !important;
    color: #a3c7ff !important;
}
body:has(.pn-navbar) nav[role="navigation"] [aria-current="page"] {
    background: linear-gradient(180deg, #1a66ff 0%, #0052ff 100%) !important;
    border-color: #0052ff !important;
    color: #ffffff !important;
    box-shadow: 0 2px 10px rgba(0, 82, 255, 0.45) !important;
}
body:has(.pn-navbar) nav[role="navigation"] [aria-disabled="true"] {
    background: rgba(255, 255, 255, 0.03) !important;
    color: rgba(255, 255, 255, 0.30) !important;
    cursor: not-allowed !important;
}
body:has(.pn-navbar) nav[role="navigation"] p {
    color: rgba(255, 255, 255, 0.55) !important;
}

/* ── 18. 弹层：微信绑定弹窗（模板纯内联样式，按 id 覆盖） ── */
body:has(.pn-navbar) #wxBindModal > div {
    background: rgba(15, 20, 50, 0.92) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    border-radius: 14px !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.65) !important;
    color: rgba(255, 255, 255, 0.92) !important;
}
body:has(.pn-navbar) #wxBindModal h3 {
    color: #ffffff !important;
}
body:has(.pn-navbar) #wxBindModal #wxBindClose {
    color: rgba(255, 255, 255, 0.6) !important;
}
body:has(.pn-navbar) #wxBindModal #wxBindClose:hover {
    color: #ffffff !important;
}
/* 二维码本体保留白底（扫码识别需要） */
body:has(.pn-navbar) #wxBindModal #wxBindQrImg {
    background: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    border-radius: 8px !important;
}

/* ── 19. 键盘焦点可见性 ── */
body:has(.pn-navbar) :focus-visible {
    outline: 2px solid #7db0ff !important;
    outline-offset: 2px !important;
}

/* ── 20. 不支持 :has 的旧浏览器：整体不生效，回退原有亮色主题，
      与 ui-refresh.css auth 段同样的兜底策略（不破坏页面） ── */
@supports not (selector(:has(*))) {
    /* 无 :has 支持时本文件所有规则自动失配，页面保持原样 */
}

/* ===== logo sizing ===== */
body:has(.pn-navbar) .pn-brand img{max-height:48px !important;width:auto;display:block}
body:has(.pn-navbar) .pn-brand{gap:10px;margin-right:8px}
body:has(.pn-navbar) .pn-brand img{background:rgba(255,255,255,.95);border-radius:12px;padding:5px;box-shadow:0 2px 10px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.25)}
body:has(.pn-navbar) footer img[src*='company-logo'], body:has(.pn-navbar) .pn-footer img[src*='company-logo']{background:rgba(255,255,255,.95);border-radius:10px;padding:4px;height:36px !important;box-shadow:0 2px 8px rgba(0,0,0,.3)}

/* ===== logo final size v2 ===== */
body:has(.pn-navbar) .pn-brand img{max-height:54px !important;padding:4px;border-radius:12px;box-shadow:0 2px 12px rgba(0,0,0,.4)}
.pn-footer img{max-height:44px !important}

/* ===== logo final size v3 ===== */
body:has(.pn-navbar) .pn-brand img{max-height:50px !important;padding:4px;border-radius:11px}
body:has(.login-box) img[src*="company-logo"]{max-height:72px !important;width:auto !important}