/*
  全站霜蓝灰主题覆盖文件。
  以 #8b919e（霜蓝灰）作为品牌强调色，保留灰度的克制与蓝色
  的清冷感，所有按钮、标签、chip、tab、分页、选中态、导航激活
  态、灰底浅面板等全部协调为霜蓝灰色系，页面背景采用纵向渐变，
  整体呈现出冷静、专业、略带科技感的商城氛围。
  使用 html:root 提高覆盖优先级，无需修改任何页面引用。
*/
html:root {
  /* === 品牌与状态色 === */
  --theme-color-brand: #8b919e;
  --theme-color-brand-strong: #6e7480;
  --theme-color-price: #ef2f02;
  --theme-color-success: #2f7d56;
  --theme-color-warning: #b96b16;
  --theme-color-danger: #ef2f02;
  --theme-color-accent: #7d8793;
  --theme-color-info: #909399;

  /* === 文字层级 === */
  --theme-text-primary: #303133;
  --theme-text-regular: #4d4f53;
  --theme-text-secondary: #7c7f84;
  --theme-text-placeholder: #a8acb2;
  --theme-text-inverse: #ffffff;
  --theme-text-title: var(--theme-text-primary);
  --theme-text-body: var(--theme-text-regular);
  --theme-text-description: var(--theme-text-regular);
  --theme-text-note: var(--theme-text-secondary);

  /* === 边框色 === */
  --theme-border-base: #c4c7cd;
  --theme-border-light: #d5d7dc;
  --theme-border-lighter: #e5e6ea;

  /* === 阴影体系 === */
  /* 优化：使用品牌色系阴影，与霜蓝灰主题协调 */
  --theme-shadow-card: 0 6px 16px rgba(139, 145, 158, 0.12);
  --theme-shadow-card-strong: 0 10px 24px rgba(139, 145, 158, 0.18);
  --theme-shadow-hero: 0 18px 40px rgba(110, 116, 128, 0.16);

  /* === 背景 === */
  --theme-bg-page: linear-gradient(180deg, #e8e9ee 0%, #f0f1f5 22%, #f8f9fb 100%);
  --theme-bg-page-plain: #f0f1f5;
  --theme-bg-surface: #ffffff;
  --theme-bg-surface-soft: #f3f4f7;
  --theme-bg-surface-elevated: #fafafa;
  --theme-bg-accent-soft: #eef0f4;
  --theme-bg-success-soft: #edf7f1;
  --theme-bg-warning-soft: #fff5eb;
  --theme-bg-danger-soft: #fff4f0;
  --theme-promo-card-bg: #f1f2f6;
  --theme-promo-card-text: #4d535b;
  --theme-promo-card-border: rgba(125, 135, 147, 0.2);

  /* === 输入框 === */
  --theme-input-bg: var(--theme-bg-surface);
  --theme-input-border: #c4c7cd;
  --theme-input-border-hover: #8b919e;
  --theme-input-border-focus: #8b919e;
  --theme-input-placeholder: var(--theme-text-placeholder);

  /* === 标签与 chip === */
  --theme-chip-bg: #eef0f3;
  --theme-chip-border: #c4c7cd;
  --theme-chip-text: #6e7480;
  --theme-filter-chip-bg: transparent;
  --theme-filter-chip-border: transparent;
  --theme-filter-chip-text: #6e7480;
  --theme-filter-chip-hover-bg: #eef0f3;
  --theme-filter-chip-hover-text: #6e7480;
  --theme-filter-chip-active-bg: #8b919e;
  --theme-filter-chip-active-border: #8b919e;
  --theme-filter-chip-active-text: #ffffff;

  /* === 选项卡 === */
  --theme-tab-bg: transparent;
  --theme-tab-active-bg: #eef0f3;
  --theme-tab-active-text: #6e7480;

  /* === 分页 === */
  --theme-pagination-bg: var(--theme-bg-surface);
  --theme-pagination-border: #d5d7dc;
  --theme-pagination-active-bg: #eef0f3;
  --theme-pagination-active-border: #c4c7cd;
  --theme-pagination-active-text: #6e7480;

  /* === 轮播点与轻导航点 === */
  --theme-dot-bg: rgba(139, 145, 158, 0.24);
  --theme-dot-bg-active: rgba(139, 145, 158, 0.88);
  --theme-dot-bg-light: rgba(255, 255, 255, 0.35);
  --theme-dot-bg-light-active: #ffffff;

  /* === 多选框 === */
  --theme-checkbox-border: #c4c7cd;
  --theme-checkbox-checked-bg: #8b919e;
  --theme-checkbox-checked-border: #8b919e;
  --theme-checkbox-check-color: #ffffff;
  --theme-checkbox-focus-ring: rgba(139, 145, 158, 0.18);
  --theme-account-list-action-color: #6e7480;
  --theme-account-list-action-hover: #8b919e;

  /* === 购物车 === */
  --theme-cart-panel-title: var(--theme-text-title);
  --theme-cart-summary-quantity: var(--theme-text-body);
  --theme-cart-summary-amount: var(--theme-color-price);

  /* === 按钮体系 === */
  --theme-btn-bg-transparent: transparent;
  --theme-btn-bg-light: var(--theme-bg-surface);
  --theme-btn-bg-light-hover: var(--theme-bg-surface-elevated);
  --theme-btn-bg-soft: #f3f4f7;
  --theme-btn-bg-soft-hover: #eef0f3;
  --theme-btn-bg-soft-active: #e5e7eb;
  --theme-btn-bg-active: var(--theme-tab-active-bg);
  --theme-btn-bg-brand: #8b919e;
  --theme-btn-bg-primary: #8b919e;
  --theme-btn-bg-primary-hover: #6e7480;
  --theme-btn-bg-primary-disabled: #c4c7cd;
  --theme-btn-border-primary: #8b919e;
  --theme-btn-text-primary: #ffffff;
  --theme-btn-bg-secondary: #ffffff;
  --theme-btn-bg-secondary-hover: #f2f3f5;
  --theme-btn-border-secondary: #8b919e;
  --theme-btn-text-secondary: #8b919e;
  --theme-btn-bg-hot: #ff5b2d;
  --theme-btn-bg-dot-light: var(--theme-dot-bg-light);
  --theme-btn-bg-dot-light-active: var(--theme-dot-bg-light-active);
  --theme-btn-bg-dot-dark: var(--theme-dot-bg);
  --theme-btn-bg-dot-dark-active: var(--theme-dot-bg-active);

  /* === 弹窗按钮 === */
  --theme-modal-secondary-bg: #ffffff;
  --theme-modal-secondary-border: #8b919e;
  --theme-modal-secondary-text: #8b919e;
  --theme-modal-secondary-hover-bg: #f2f3f5;
  --theme-modal-primary-bg: #8b919e;
  --theme-modal-primary-text: #ffffff;
  --theme-modal-primary-hover-bg: #6e7480;
  --theme-modal-close-bg: #f3f4f7;
  --theme-modal-close-text: #4d4f53;
  --theme-modal-close-hover-bg: #eef0f3;

  /* === 壳组件 === */
  --theme-shell-header-bg: rgba(255, 255, 255, 0.94);
  --theme-shell-header-border: #d5d7dc;
  --theme-shell-nav-text: #4d4f53;
  --theme-shell-nav-text-active: #6e7480;
  --theme-shell-nav-underline: #8b919e;
  --theme-shell-cart-icon: #8b919e;
  --theme-shell-cart-text: var(--theme-text-regular);
  --theme-shell-footer-bg: transparent;
  --theme-shell-footer-text: #7c7f84;
  --theme-shell-footer-border: #e5e6ea;
  --theme-shell-mobile-header-bg: rgba(255, 255, 255, 0.96);
  --theme-shell-mobile-header-border: #d5d7dc;
  --theme-shell-mobile-status-text: #4d4f53;
  --theme-shell-mobile-status-icon: #4d4f53;
  --theme-shell-search-icon: #8b919e;
  --theme-shell-mobile-more-hover: #f3f4f7;
  --theme-shell-bottom-nav-bg: rgba(255, 255, 255, 0.98);
  --theme-shell-bottom-nav-text: #7c7f84;
  --theme-shell-bottom-nav-text-active: #6e7480;
  --theme-shell-bottom-nav-icon-filter: none;
  --theme-shell-bottom-nav-icon-filter-active: brightness(0) saturate(100%) invert(58%) sepia(8%) saturate(290%) hue-rotate(182deg) brightness(92%) contrast(86%);

  /* === 首页公告卡 === */
  /* 优化：增强公告条对比度，使其在页面背景上更清晰可见 */
  --theme-announce-bg: linear-gradient(90deg, #e1e3e8 0%, #dfe1e6 100%);
  --theme-announce-border: #c4c7cd;
  --theme-announce-text: #3d4148;
  --theme-announce-label-bg: rgba(139, 145, 158, 0.18);
  --theme-announce-label-text: #4d535b;

  /* === 课程详情购买卡 === */
  --theme-detail-purchase-label-bg: #8b919e;
  --theme-detail-purchase-label-text: #ffffff;
  --theme-detail-secondary-btn-bg: #f3f4f7;
  --theme-detail-secondary-btn-border: #8b919e;
  --theme-detail-secondary-btn-text: #8b919e;
  --theme-detail-secondary-btn-hover-bg: #eef0f3;

  /* === 个人中心 === */
  --theme-account-sidebar-item-bg: #f3f4f7;
  --theme-account-sidebar-item-border: transparent;
  --theme-account-sidebar-item-active-bg: #8b919e;
  --theme-account-sidebar-item-active-border: transparent;
  --theme-account-sidebar-item-active-text: #ffffff;
  --theme-account-sidebar-item-text: #4d4f53;
  --theme-account-auth-notice-bg: #f3f4f7;
  --theme-account-auth-notice-border: #d5d7dc;
  --theme-account-auth-notice-text: #4d4f53;
  --theme-account-subnav-bg: #ffffff;
  --theme-account-subnav-border: #c4c7cd;
  --theme-account-subnav-text: #6e7480;
  --theme-account-subnav-active-bg: #eef0f3;
  --theme-account-subnav-active-text: #6e7480;
  --theme-pill-tab-shell-bg: var(--theme-account-subnav-bg);
  --theme-pill-tab-shell-border: var(--theme-account-subnav-border);
  --theme-pill-tab-text: var(--theme-account-subnav-text);
  --theme-pill-tab-active-bg: var(--theme-account-subnav-active-bg);
  --theme-pill-tab-active-text: var(--theme-account-subnav-active-text);
  --theme-account-message-unread-bg: #f3f4f7;
  --theme-account-message-unread-text: #6e7480;
  --theme-account-message-read-bg: #eef0f3;
  --theme-account-message-read-text: #7c7f84;
}