:root {
  --od-admin-text: #e6eef9;
  --od-admin-muted: rgba(191, 219, 254, 0.76);
  --od-admin-dim: rgba(148, 163, 184, 0.84);
  --od-admin-border: rgba(148, 163, 184, 0.14);
  --od-admin-border-strong: rgba(148, 163, 184, 0.22);
  --od-admin-surface-0: linear-gradient(180deg, rgba(10, 15, 28, 0.94), rgba(7, 11, 21, 0.9));
  --od-admin-surface-1: linear-gradient(180deg, rgba(15, 23, 42, 0.82), rgba(8, 13, 24, 0.74));
  --od-admin-surface-2: linear-gradient(180deg, rgba(7, 12, 22, 0.76), rgba(8, 14, 26, 0.68));
  --od-admin-hero: radial-gradient(circle at top left, rgba(56, 189, 248, 0.12), transparent 34%), radial-gradient(circle at top right, rgba(34, 197, 94, 0.08), transparent 30%), linear-gradient(160deg, rgba(11, 19, 35, 0.98), rgba(8, 13, 24, 0.94));
  --od-admin-header-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0));
  --od-admin-footer-bg: linear-gradient(180deg, rgba(5, 9, 18, 0.18), rgba(5, 9, 18, 0.98) 34%);
  --od-admin-shadow: 0 28px 80px rgba(3, 7, 18, 0.46);
  --od-admin-soft-shadow: 0 18px 44px rgba(2, 6, 23, 0.24);
  --od-admin-chip-bg: rgba(15, 23, 42, 0.64);
  --od-admin-chip-text: #dbeafe;
  --od-admin-table-hover: rgba(15, 23, 42, 0.46);
  --odx-bg-0: rgba(4, 9, 18, 0.92);
  --odx-bg-1: rgba(9, 16, 30, 0.92);
  --odx-bg-2: rgba(15, 26, 44, 0.84);
  --odx-line: rgba(148, 163, 184, 0.16);
  --odx-line-strong: rgba(148, 163, 184, 0.26);
  --odx-text: #ecf4ff;
  --odx-muted: #98a6bf;
  --odx-muted-2: #6f809a;
  --odx-glow: rgba(64, 181, 255, 0.2);
}

html[data-theme-mode="light"] {
  --od-admin-text: #0f172a;
  --od-admin-muted: rgba(30, 41, 59, 0.78);
  --od-admin-dim: rgba(51, 65, 85, 0.82);
  --od-admin-border: rgba(59, 130, 246, 0.14);
  --od-admin-border-strong: rgba(59, 130, 246, 0.22);
  --od-admin-surface-0: linear-gradient(180deg, rgba(251, 253, 255, 0.98), rgba(232, 240, 249, 0.94));
  --od-admin-surface-1: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(239, 246, 255, 0.92));
  --od-admin-surface-2: linear-gradient(180deg, rgba(241, 247, 254, 0.94), rgba(229, 238, 248, 0.9));
  --od-admin-hero: radial-gradient(circle at top left, rgba(37, 99, 235, 0.12), transparent 34%), radial-gradient(circle at top right, rgba(14, 165, 233, 0.08), transparent 30%), linear-gradient(160deg, rgba(252, 254, 255, 0.98), rgba(233, 241, 250, 0.94));
  --od-admin-header-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.22));
  --od-admin-footer-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.36), rgba(227, 236, 247, 0.96) 36%);
  --od-admin-shadow: 0 24px 64px rgba(37, 99, 235, 0.18);
  --od-admin-soft-shadow: 0 12px 28px rgba(37, 99, 235, 0.12);
  --od-admin-chip-bg: rgba(248, 250, 252, 0.92);
  --od-admin-chip-text: #0f172a;
  --od-admin-table-hover: rgba(219, 234, 254, 0.56);
  --odx-bg-0: rgba(255, 255, 255, 0.98);
  --odx-bg-1: rgba(239, 246, 255, 0.94);
  --odx-bg-2: rgba(231, 240, 249, 0.9);
  --odx-line: rgba(59, 130, 246, 0.14);
  --odx-line-strong: rgba(59, 130, 246, 0.22);
  --odx-text: #0f172a;
  --odx-muted: #475569;
  --odx-muted-2: #64748b;
  --odx-glow: rgba(37, 99, 235, 0.14);
}

.od-profile-modal,
#invBackdrop .modal,
#ordBackdrop .modal,
#payBackdrop .modal {
  background: var(--od-admin-surface-0) !important;
  border-color: var(--od-admin-border-strong) !important;
  box-shadow: var(--od-admin-shadow) !important;
  color: var(--od-admin-text);
}

.od-profile-head,
#invBackdrop .modal-head,
#ordBackdrop .modal-head,
#payBackdrop .modal-head {
  background: var(--od-admin-header-bg) !important;
  border-bottom-color: var(--od-admin-border) !important;
}

.od-profile-foot,
#invBackdrop .modal-foot,
#ordBackdrop .modal-foot,
#payBackdrop .modal-foot {
  background: var(--od-admin-footer-bg) !important;
  border-top-color: var(--od-admin-border) !important;
}

.od-profile-shell,
.od-inv-stage,
.od-orders-stage {
  color: var(--od-admin-text);
}

.tabs {
  padding-top: 3px;
}

.tabs .tab:hover,
.tabs .tab:focus-visible {
  transform: none !important;
  filter: brightness(1.08);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 8px 18px rgba(2, 6, 23, 0.16);
}

.od-profile-hero,
.od-inv-hero,
.od-orders-hero {
  background: var(--od-admin-hero) !important;
  border-color: var(--od-admin-border-strong) !important;
  box-shadow: var(--od-admin-soft-shadow) !important;
}

.od-meta-chip,
.od-spotlight,
.od-alert-pill,
.od-panel-card,
.od-info-card,
.od-kpi-card,
.od-alert-row,
.od-stack-row,
.od-doc-card,
.od-timeline-item,
.od-orders-control,
.od-orders-mainPanel,
.od-orders-sidePanel,
.od-orders-lane,
.od-orders-signal,
.od-order-kpi,
.od-order-mini,
.od-orders-sideStat,
.od-order-routeStat,
.od-orders-laneItem,
.od-order-row,
.od-order-panel,
.od-inv-zone,
.od-inv-listPanel,
.od-inv-sidePanel,
.od-inv-modalHero,
.od-inv-detailSection,
.od-inv-financePanel,
.od-inv-routeStrip,
.od-inv-stat,
.od-inv-sideCard,
.od-inv-sideItem,
.od-inv-issuerLine,
.od-inv-packageLine,
.od-inv-packageCard,
.od-inv-metric,
.od-inv-financeItem,
.od-inv-routeNode,
.od-inv-contactCard,
.od-inv-timelineItem {
  background: var(--od-admin-surface-1) !important;
  border-color: var(--od-admin-border) !important;
  box-shadow: none !important;
}

.od-table tbody tr:hover,
.od-inv-table tbody tr:hover,
.od-inv-packageOrders tbody tr:hover,
.od-orders-laneItem:hover,
.od-order-row:hover {
  background: var(--od-admin-table-hover) !important;
}

.od-profile-head .modal-sub,
.od-profile-hero__sub,
.od-meta-chip__label,
.od-spotlight__label,
.od-spotlight__meta,
.od-panel-head p,
.od-panel-kicker,
.od-kpi-card__label,
.od-kpi-card__meta,
.od-alert-row__body span,
.od-stack-row__body span,
.od-info-card__title,
.od-kv-row dt,
.od-table th,
.od-inv-stat__label,
.od-inv-sectionHead span,
.od-inv-zoneTitle span,
.od-inv-listHead span,
.od-inv-detailMeta__label,
.od-inv-empty span,
.od-inv-sideCard p,
.od-inv-stat__meta,
.od-inv-detailMeta__value,
.od-inv-zoneTitle small,
.od-inv-listHead small,
.od-inv-sectionHead p,
.od-orders-signal__label,
.od-order-kpi__label,
.od-order-mini__label,
.od-orders-sideStat__label,
.od-order-routeStat__label,
.od-order-row__eyebrow,
.od-orders-panel__kicker,
.od-order-panel__kicker,
.od-orders-signal__meta,
.od-order-kpi__meta,
.od-order-mini__meta,
.od-orders-sideStat__meta,
.od-order-routeStat__meta,
.od-orders-mainHead p,
.od-orders-panel__sub,
.od-order-panel__sub,
.od-order-row__routeMeta,
.od-order-row__support,
.od-orders-empty,
.od-orders-statusMatrix span,
.od-orders-filterSnapshot span {
  color: var(--od-admin-muted) !important;
}

.od-profile-hero h2,
.od-profile-head .modal-title,
.od-meta-chip__value,
.od-spotlight__value,
.od-panel-head h3,
.od-kpi-card__value,
.od-alert-row__body strong,
.od-stack-row__body strong,
.od-kv-row dd,
.od-table td,
.od-doc-card__title,
.od-timeline-item__body h4,
.od-orders-hero__copy h2,
.od-orders-controlTitle,
.od-orders-mainHead h3,
.od-orders-panel__head h3,
.od-order-panel__head h3,
.od-orders-lane__head h3,
.od-orders-signal__value,
.od-order-kpi__value,
.od-order-mini__value,
.od-orders-sideStat__value,
.od-order-routeStat__value,
.od-orders-laneItem strong,
.od-order-row h3,
.od-order-hero h2,
.od-inv-hero h2,
.od-inv-zoneTitle strong,
.od-inv-listHead strong,
.od-inv-sideTitle strong,
.od-inv-sectionHead h4,
.od-inv-modalHero h3,
.od-inv-stat__value,
.od-inv-metric__value,
.od-inv-financeItem__value,
.od-inv-routeNode strong,
.od-inv-sideItem strong,
.od-inv-issuerLine strong,
.od-inv-packageLine strong,
.od-inv-detailMeta__valueStrong,
.od-inv-timelineItem__title {
  color: var(--od-admin-text) !important;
}

.od-profile-modal input,
.od-profile-modal select,
.od-profile-modal textarea,
.od-orders-searchField input,
.od-orders-filterRow select,
.od-orders-filterRow input,
.od-order-panel .field input,
.od-order-panel .field select,
.od-order-panel .field textarea,
.od-inv-control__bar input,
.od-inv-control__bar select,
.od-inv-nativeCard input,
.od-inv-nativeCard select {
  background: var(--od-admin-surface-2) !important;
  color: var(--od-admin-text) !important;
  border-color: var(--od-admin-border) !important;
}

.od-profile-modal .btn,
.od-orders-filterRow .btn,
.od-order-row .btn,
.od-order-panel .btn,
.od-order-modal .modal-foot .btn,
.od-inv-control__bar .btn,
.od-inv-nativeCard .btn,
#invBackdrop .btn,
#payBackdrop .btn,
#ordBackdrop .btn,
.od-profile-foot .btn {
  border-color: var(--od-admin-border) !important;
}

.od-profile-modal .badge-light,
#invBackdrop .badge-light,
#ordBackdrop .badge-light,
#payBackdrop .badge-light,
.odx-badge.is-neutral,
.od-badge.is-muted {
  background: var(--od-admin-chip-bg) !important;
  border-color: var(--od-admin-border) !important;
  color: var(--od-admin-chip-text) !important;
}

/* premium light rebuild */
@keyframes odAdminGlowFloat {
  from {
    transform: translate3d(0, 0, 0) scale(1);
  }
  to {
    transform: translate3d(14px, -12px, 0) scale(1.05);
  }
}

html[data-theme-mode="light"] {
  --od-admin-text: #10233d;
  --od-admin-muted: rgba(49, 65, 91, 0.78);
  --od-admin-dim: rgba(71, 85, 105, 0.82);
  --od-admin-border: rgba(71, 95, 129, 0.14);
  --od-admin-border-strong: rgba(71, 95, 129, 0.22);
  --od-admin-surface-0: linear-gradient(180deg, rgba(248, 251, 255, 0.98), rgba(232, 240, 248, 0.94));
  --od-admin-surface-1: linear-gradient(180deg, rgba(251, 253, 255, 0.98), rgba(236, 242, 248, 0.92));
  --od-admin-surface-2: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(238, 243, 249, 0.92));
  --od-admin-hero: radial-gradient(circle at top left, rgba(37, 99, 235, 0.12), transparent 34%), radial-gradient(circle at top right, rgba(14, 165, 233, 0.08), transparent 30%), linear-gradient(160deg, rgba(250, 252, 255, 0.99), rgba(232, 240, 248, 0.94));
  --od-admin-header-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.34));
  --od-admin-footer-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.34), rgba(228, 236, 245, 0.96) 36%);
  --od-admin-shadow: 0 22px 52px rgba(71, 85, 105, 0.16);
  --od-admin-soft-shadow: 0 14px 30px rgba(71, 85, 105, 0.12);
  --od-admin-chip-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.96), rgba(236, 242, 248, 0.92));
  --od-admin-chip-text: #10233d;
  --od-admin-table-hover: rgba(223, 233, 244, 0.62);
  --odx-bg-0: rgba(251, 253, 255, 0.98);
  --odx-bg-1: rgba(239, 245, 251, 0.94);
  --odx-bg-2: rgba(232, 239, 247, 0.92);
  --odx-line: rgba(71, 95, 129, 0.14);
  --odx-line-strong: rgba(71, 95, 129, 0.22);
  --odx-text: #10233d;
  --odx-muted: #51627c;
  --odx-muted-2: #677892;
  --odx-glow: rgba(37, 99, 235, 0.14);
}

html[data-theme-mode="light"] .od-profile-modal,
html[data-theme-mode="light"] #invBackdrop .modal,
html[data-theme-mode="light"] #ordBackdrop .modal,
html[data-theme-mode="light"] #payBackdrop .modal {
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

html[data-theme-mode="light"] .od-profile-hero,
html[data-theme-mode="light"] .od-inv-hero,
html[data-theme-mode="light"] .od-orders-hero {
  box-shadow: var(--od-admin-soft-shadow) !important;
}

html[data-theme-mode="light"] .od-profile-hero::after,
html[data-theme-mode="light"] .od-inv-hero:after,
html[data-theme-mode="light"] .od-orders-hero::before,
html[data-theme-mode="light"] .od-orders-hero::after {
  opacity: 0.34;
  animation: odAdminGlowFloat 18s ease-in-out infinite alternate;
}

html[data-theme-mode="light"] .odx-badge,
html[data-theme-mode="light"] .od-badge,
html[data-theme-mode="light"] .od-alert-pill,
html[data-theme-mode="light"] .badge-light {
  background: var(--od-admin-chip-bg) !important;
  color: var(--od-admin-chip-text) !important;
  border-color: var(--od-admin-border) !important;
  box-shadow: none !important;
}

html[data-theme-mode="light"] .od-profile-modal .btn,
html[data-theme-mode="light"] .od-orders-filterRow .btn,
html[data-theme-mode="light"] .od-order-row .btn,
html[data-theme-mode="light"] .od-order-panel .btn,
html[data-theme-mode="light"] .od-order-modal .modal-foot .btn,
html[data-theme-mode="light"] .od-inv-control__bar .btn,
html[data-theme-mode="light"] .od-inv-nativeCard .btn,
html[data-theme-mode="light"] #invBackdrop .btn,
html[data-theme-mode="light"] #payBackdrop .btn,
html[data-theme-mode="light"] #ordBackdrop .btn {
  background: linear-gradient(180deg, rgba(252, 254, 255, 0.98), rgba(233, 240, 248, 0.92)) !important;
  color: #10233d !important;
  border-color: var(--od-admin-border) !important;
  box-shadow: none !important;
}

html[data-theme-mode="light"] .od-profile-modal .btn.primary,
html[data-theme-mode="light"] .od-order-panel .btn.primary,
html[data-theme-mode="light"] .od-order-row .btn.primary,
html[data-theme-mode="light"] #invBackdrop .btn.primary,
html[data-theme-mode="light"] #ordBackdrop .btn.primary,
html[data-theme-mode="light"] #payBackdrop .btn.primary {
  background: linear-gradient(135deg, #1368ff, #23b7ff) !important;
  color: #f8fbff !important;
  border-color: transparent !important;
  box-shadow: 0 14px 28px rgba(37, 99, 235, 0.18) !important;
}

html[data-theme-mode="light"] .od-orders-signal,
html[data-theme-mode="light"] .od-order-kpi,
html[data-theme-mode="light"] .od-order-mini,
html[data-theme-mode="light"] .od-orders-sideStat,
html[data-theme-mode="light"] .od-order-routeStat,
html[data-theme-mode="light"] .od-inv-stat,
html[data-theme-mode="light"] .od-kpi-card,
html[data-theme-mode="light"] .od-meta-chip,
html[data-theme-mode="light"] .od-spotlight {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(236, 242, 248, 0.92)) !important;
}

html[data-theme-mode="light"] .od-orders-laneItem:hover,
html[data-theme-mode="light"] .od-order-row:hover,
html[data-theme-mode="light"] .od-kpi-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(71, 85, 105, 0.10) !important;
}

/* premium light polish */

html[data-theme-mode="light"] .od-profile-shell,
html[data-theme-mode="light"] .od-orders-shell,
html[data-theme-mode="light"] .od-inv-shell,
html[data-theme-mode="light"] .od-profile-tabs,
html[data-theme-mode="light"] .od-orders-filterRow,
html[data-theme-mode="light"] .od-inv-control__bar {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.84), rgba(234, 241, 248, 0.76)) !important;
  border-color: rgba(70, 88, 123, 0.14) !important;
  box-shadow: 0 18px 34px rgba(148, 163, 184, 0.12) !important;
}

html[data-theme-mode="light"] .od-profile-tab:not(.active):hover,
html[data-theme-mode="light"] .od-orders-filterRow .btn:hover,
html[data-theme-mode="light"] .od-inv-control__bar .btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(148, 163, 184, 0.14) !important;
}

html[data-theme-mode="light"] .od-profile-panel,
html[data-theme-mode="light"] .od-order-panel,
html[data-theme-mode="light"] .od-orders-lane,
html[data-theme-mode="light"] .od-inv-nativeCard,
html[data-theme-mode="light"] .od-profile-metric,
html[data-theme-mode="light"] .od-order-kpi,
html[data-theme-mode="light"] .od-inv-stat {
  content-visibility: auto;
  contain-intrinsic-size: 340px;
}