:root {
  --hz-primary: #08658f;
  --hz-deep: #044564;
  --hz-bright: #0f8fbe;
  --hz-cyan: #4eb4d8;
  --hz-soft: #e9f6fb;
  --hz-bg: #f5f8fa;
  --hz-card: #ffffff;
  --hz-text: #16384d;
  --hz-ink: #12354a;
  --hz-muted: #71899a;
  --hz-border: #dceaf1;
  --hz-shadow-sm: 0 8px 22px rgba(13, 63, 91, 0.055);
  --hz-shadow-md: 0 14px 34px rgba(13, 63, 91, 0.085);
  --hz-shadow-hero: 0 18px 42px rgba(8, 101, 143, 0.16);
  --hz-hero-gradient: linear-gradient(135deg, #075577 0%, #087eaa 56%, #48add2 100%);

  /* Bootstrap 5 variable overrides — Bootstrap components auto-use brand values */
  --bs-primary: #075b88;
  --bs-primary-rgb: 7, 91, 136;
  --bs-secondary: #6c8a9e;
  --bs-secondary-rgb: 108, 138, 158;
  --bs-success: #16804f;
  --bs-success-rgb: 22, 128, 79;
  --bs-danger: #b94848;
  --bs-danger-rgb: 185, 72, 72;
  --bs-warning: #b98418;
  --bs-warning-rgb: 185, 132, 24;
  --bs-info: #0f8fbe;
  --bs-info-rgb: 15, 143, 190;
  --bs-body-bg: #f4f7fa;
  --bs-body-color: #263746;
  --bs-body-font-weight: 400;
  --bs-border-radius: 0.65rem;
  --bs-border-radius-lg: 0.85rem;
  --bs-border-radius-xl: 1.1rem;
  --bs-border-radius-xxl: 1.5rem;
  --bs-card-bg: #ffffff;
  --bs-card-border-radius: 1.1rem;
  --bs-card-border-color: #dceaf1;
  --bs-card-box-shadow: 0 14px 34px rgba(13, 63, 91, 0.085);
  --bs-link-color: #0875a5;
  --bs-link-hover-color: #064b71;
}

body {
  background:
    radial-gradient(circle at 10% 0%, rgba(17, 148, 195, 0.08), transparent 26rem),
    linear-gradient(180deg, #f8fbfd 0%, var(--hz-bg) 100%) !important;
  color: var(--hz-text) !important;
}

.app-shell-inner {
  max-width: 1440px;
}

.brand-nav {
  background: linear-gradient(115deg, #06486b 0%, #075b88 46%, #0b7fae 100%) !important;
  box-shadow: 0 10px 26px rgba(5, 57, 86, 0.18) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12) !important;
}

.brand-nav-links {
  background: rgba(255, 255, 255, 0.09) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.brand-nav .nav-link {
  color: rgba(238, 248, 255, 0.9) !important;
}

.brand-nav .nav-link.active {
  color: var(--hz-primary) !important;
  background: #ffffff !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.1) !important;
}

.page-hero,
.station-hero,
.station-list-hero,
.receipt-hero,
.account-hero,
.account-detail-hero,
.profile-hero,
.sys-hero,
.entry-hero,
.import-hero {
  background: var(--hz-hero-gradient) !important;
  color: #fff !important;
  border-radius: 24px !important;
  box-shadow: var(--hz-shadow-hero) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
}

.page-hero p,
.station-hero p,
.station-list-hero p,
.receipt-hero p,
.account-hero p,
.account-detail-hero p,
.profile-hero p,
.sys-hero p,
.entry-hero p,
.import-hero p,
.page-hero .muted,
.station-hero .muted {
  color: rgba(255, 255, 255, 0.86) !important;
}

.panel,
.card.panel,
.station-main-card,
.station-section-card,
.station-summary-card,
.station-list-filter-card,
.station-list-table-card,
.receipt-table-panel,
.receipt-summary-card,
.account-summary-card,
.account-filter-panel,
.account-table-panel,
.account-detail-card,
.detail-card,
.profile-card,
.profile-section-card,
.sys-panel,
.sys-summary-card,
.entry-form-card,
.entry-section-card,
.import-section,
.metric-panel {
  border: 1px solid rgba(11, 92, 142, 0.08) !important;
  background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
  box-shadow: var(--hz-shadow-sm) !important;
}

.station-summary-card,
.receipt-summary-card,
.account-summary-card,
.sys-summary-card {
  border-radius: 20px !important;
}

.panel,
.card.panel,
.station-list-filter-card,
.station-list-table-card,
.receipt-table-panel,
.account-filter-panel,
.account-table-panel {
  border-radius: 22px !important;
}

.metric-card {
  box-shadow: var(--hz-shadow-md) !important;
  border-radius: 18px !important;
}

.metric-card.blue,
.metric-card.cyan {
  background: linear-gradient(135deg, var(--hz-primary), var(--hz-bright)) !important;
}

.metric-card.green {
  background: linear-gradient(135deg, #147a4b, #35ad72) !important;
}

.metric-card.red {
  background: linear-gradient(135deg, #b94848, #e06666) !important;
}

.metric-card.yellow {
  background: linear-gradient(135deg, #b98418, #e0aa34) !important;
}


.table thead th,
.station-list-table-card thead th,
.receipt-table-panel thead th,
.account-table-panel thead th {
  background: #f1f7fb !important;
  color: #5b7486 !important;
  border-bottom: 1px solid var(--hz-border) !important;
  font-weight: 700 !important;
}

.table tbody tr:hover,
.station-list-table-card tbody tr:hover,
.receipt-table-panel tbody tr:hover,
.account-table-panel tbody tr:hover {
  background: rgba(17, 148, 195, 0.035) !important;
}

.form-control,
.form-select,
input,
select,
textarea {
  border-color: #d6e4ec !important;
}

.form-control:focus,
.form-select:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: rgba(7, 91, 136, 0.48) !important;
  box-shadow: 0 0 0 0.16rem rgba(7, 91, 136, 0.1) !important;
}


.text-muted,
.station-summary-note,
.receipt-summary-note,
.account-summary-note {
  color: var(--hz-muted) !important;
}

a {
  color: #0875a5;
}

a:hover {
  color: var(--hz-deep);
}

/* 顶部导航与移动端底栏。 */
.brand-nav .nav-link {
  color: rgba(238, 248, 255, .9) !important;
}

.brand-nav .nav-link:hover,
.brand-nav .nav-link:focus {
  color: #fff !important;
}

.brand-nav .nav-link.active {
  color: var(--hz-btn-blue) !important;
}

.mobile-bottom-link {
  color: #304f63;
  text-decoration: none;
}

.mobile-bottom-link:hover,
.mobile-bottom-link:focus {
  color: var(--hz-btn-blue);
}

.mobile-bottom-link.active {
  color: var(--hz-btn-blue);
}

/* 禁用态：统一降低视觉权重，不让白字消失。 */
.btn:disabled,
.btn.disabled,
.hz-btn:disabled,
.hz-btn.disabled,
.action-btn:disabled,
.action-btn.disabled,
.hz-list-action:disabled,
.hz-list-action.disabled {
  opacity: .58;
  pointer-events: none;
  box-shadow: none !important;
  transform: none !important;
}

@media (max-width: 767.98px) {
  .action-btn,
  .hz-btn,
  .hz-workspace-actions .btn,
  .settlement-actionbar .btn {
    min-height: 44px;
  }

  .hz-list-actions {
    justify-content: flex-start;
  }

  .hz-list-action,
  .hz-mini-action,
  .allocation-mini-btn,
  .bank-info-entry-btn,
  .section-action-btn {
    min-height: 38px;
  }
}

/* --------------------------------------------------------------------------
 * 2026-07-12 final button refresh
 * 目标：统一所有页面按钮、筛选 chip、表格操作链接的可读性，避免 hover/active 后出现白底白字或蓝底深字。
 * -------------------------------------------------------------------------- */

.btn,
.hz-btn,
.action-btn,
.hz-list-action,
.quick-chip,
.table-inline-link,
.date-picker-open-btn,
.month-picker-trigger,
.period-trigger,
.bank-info-entry-btn,
.allocation-mini-btn,
.allocation-carry-btn {
  -webkit-font-smoothing: antialiased;
}

.btn,
.hz-btn,
.action-btn,
.hz-list-action {
  min-height: 2.5rem;
  padding-inline: 1rem;
}

.btn-sm,
.hz-list-action,
.table-inline-link,
.bank-info-entry-btn,
.allocation-mini-btn,
.allocation-carry-btn {
  min-height: 2.15rem;
}

/* Bootstrap outline variants: default state stays light, hover/active becomes solid with white text. */
.btn-outline-primary,
.btn-outline-info {
  border-color: rgba(7, 91, 136, .22) !important;
  background: #fff !important;
  color: var(--hz-btn-blue) !important;
  box-shadow: 0 8px 18px rgba(7, 91, 136, .06);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.active,
.btn-outline-info:hover,
.btn-outline-info:focus,
.btn-outline-info:active,
.btn-outline-info.active {
  border-color: var(--hz-btn-blue) !important;
  background: linear-gradient(135deg, var(--hz-btn-blue), var(--hz-btn-blue-2)) !important;
  color: #fff !important;
  box-shadow: var(--hz-btn-shadow);
  transform: translateY(-1px);
}

.btn-secondary,
.btn-outline-dark {
  border-color: var(--hz-btn-border) !important;
  background: #fff !important;
  color: var(--hz-btn-blue) !important;
}

.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary.active,
.btn-outline-dark:hover,
.btn-outline-dark:focus,
.btn-outline-dark:active,
.btn-outline-dark.active {
  border-color: rgba(7, 91, 136, .28) !important;
  background: var(--hz-btn-soft) !important;
  color: var(--hz-btn-blue-dark) !important;
  box-shadow: var(--hz-btn-shadow);
}

.btn-warning,
.btn-outline-warning {
  border-color: rgba(185, 132, 24, .3) !important;
  background: #fff8e6 !important;
  color: #8a6415 !important;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning.active,
.btn-outline-warning:hover,
.btn-outline-warning:focus,
.btn-outline-warning:active,
.btn-outline-warning.active {
  border-color: var(--hz-btn-warning) !important;
  background: linear-gradient(135deg, #b98418, #e0aa34) !important;
  color: #fff !important;
  box-shadow: 0 12px 26px rgba(185, 132, 24, .18);
  transform: translateY(-1px);
}

.btn-outline-success {
  border-color: rgba(22, 128, 79, .28) !important;
  background: #f3fbf6 !important;
  color: var(--hz-btn-success) !important;
}

.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success:active,
.btn-outline-success.active {
  border-color: var(--hz-btn-success) !important;
  background: linear-gradient(135deg, var(--hz-btn-success), var(--hz-btn-success-2)) !important;
  color: #fff !important;
}

