:root {
  --bg: #f2f7f9;
  --surface: #ffffff;
  --surface-soft: #f7fbfc;
  --text: #123b5d;
  --text-strong: #0d2d48;
  --muted: #667b8d;
  --line: #dce8ec;
  --brand-navy: #123b5d;
  --brand-teal: #2a8baa;
  --brand-cyan: #42b8c5;
  --accent: #2a8baa;
  --accent-dark: #1f6f88;
  --accent-soft: #eaf5f7;
  --teal: #42b8c5;
  --success: #16855b;
  --danger: #c43d4b;
  --warning: #9a6500;
  --shadow: 0 12px 34px rgba(18, 59, 93, 0.09);
  --radius: 17px;
}

* { box-sizing: border-box; }

html { min-height: 100%; }

body {
  min-height: 100vh;
  margin: 0;
  background:
    radial-gradient(circle at 88% 0%, rgba(66, 184, 197, 0.10), transparent 30rem),
    linear-gradient(180deg, #f4fafb 0%, var(--bg) 35%, #f3f7fa 100%);
  color: var(--text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}

button, input, select { font: inherit; }
a { color: inherit; }

.topbar {
  min-height: 76px;
  background: linear-gradient(110deg, #0d263c 0%, #123b5d 64%, #174b66 100%);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 0 26px;
  position: sticky;
  top: 0;
  z-index: 20;
  box-shadow: 0 8px 26px rgba(13, 45, 72, 0.22);
}

.brand {
  display: flex;
  gap: 13px;
  align-items: center;
  text-decoration: none;
}

.brand-mark {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--brand-navy), var(--brand-teal) 58%, var(--brand-cyan));
  display: grid;
  place-items: center;
  font-weight: 850;
  font-size: 14px;
  letter-spacing: 0.04em;
  box-shadow: 0 6px 18px rgba(42, 139, 170, 0.32);
}

.brand strong { display: block; font-size: 16px; line-height: 1.25; }
.brand small { display: block; color: #bdd0dc; font-size: 12px; margin-top: 1px; }

.top-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.scan-form { margin: 0; }

.account-chip {
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 999px;
  padding: 9px 14px;
  color: #d3e3ea;
  font-size: 12px;
  max-width: 260px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page-shell {
  width: min(1540px, 100%);
  margin: 0 auto;
  padding: 30px;
}

.footer {
  text-align: center;
  color: var(--muted);
  font-size: 11px;
  padding: 26px 20px 34px;
}

.hero {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  margin-bottom: 20px;
}

.hero.compact { margin-bottom: 17px; }

.hero h1 {
  font-size: clamp(26px, 3vw, 34px);
  line-height: 1.13;
  letter-spacing: -0.025em;
  margin: 5px 0 0;
}

.hero p {
  margin: 6px 0 0;
  color: var(--muted);
}

.eyebrow {
  color: var(--accent);
  font-size: 10px;
  font-weight: 850;
  letter-spacing: 0.15em;
}

.last-scan {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 13px;
  padding: 12px 16px;
  min-width: 235px;
  box-shadow: 0 5px 18px rgba(23,45,82,.04);
}

.last-scan span,
.last-scan strong { display: block; }

.last-scan span {
  color: var(--muted);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 5px;
}

.last-scan strong { font-size: 12px; }

.metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin: 17px 0 22px;
}

.metric-card {
  min-width: 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 20px;
  display: flex;
  align-items: center;
  gap: 14px;
}

.metric-card small {
  display: block;
  color: var(--muted);
  font-size: 11px;
  margin-bottom: 4px;
}

.metric-card strong {
  display: block;
  font-size: clamp(20px, 2.1vw, 26px);
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.metric-icon {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: 13px;
  background: var(--accent-soft);
  color: var(--accent);
  display: grid;
  place-items: center;
  font-size: 18px;
}

.status-completed { color: var(--success); }
.status-running, .status-preparing { color: var(--accent); }
.status-queued { color: var(--warning); }
.status-failed { color: var(--danger); }
.status-interrupted { color: var(--warning); }

.grid-2 {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: 18px;
  align-items: start;
  margin-bottom: 18px;
}

.dashboard-grid > .panel { height: 100%; }
.single-grid { display: grid; grid-template-columns: 1fr; margin-bottom: 18px; }

.panel {
  min-width: 0;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 21px;
  margin-bottom: 18px;
}

.panel-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 16px;
}

.panel-head h2 {
  font-size: 17px;
  line-height: 1.25;
  margin: 3px 0 0;
}

.muted { color: var(--muted); font-size: 12px; }

.path {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  overflow-wrap: anywhere;
}

.bar-chart {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.bar-row {
  display: block;
  text-decoration: none;
  border-radius: 9px;
  padding: 3px;
}

.bar-row:hover { background: var(--surface-soft); }

.bar-label {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 13px;
  margin-bottom: 6px;
}

.bar-label span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bar-label strong {
  flex: 0 0 auto;
  font-size: 12px;
}

.bar-track,
.month-track {
  height: 9px;
  background: #edf1f6;
  border-radius: 999px;
  overflow: hidden;
}

.bar-track span,
.month-track span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--accent), var(--teal));
  border-radius: 999px;
}

.bar-meta {
  font-size: 10px;
  color: var(--muted);
  margin-top: 5px;
}

.ranking { display: flex; flex-direction: column; }

.rank-row {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  text-decoration: none;
  padding: 10px 5px;
  border-bottom: 1px solid var(--line);
  border-radius: 8px;
}

.rank-row:last-child { border-bottom: 0; }
.rank-row:hover { background: var(--surface-soft); }

.rank-num {
  width: 24px;
  height: 24px;
  border-radius: 8px;
  background: #eef3f9;
  color: var(--muted);
  font-size: 11px;
  display: grid;
  place-items: center;
}

.rank-main,
.rank-value { min-width: 0; }

.rank-main strong,
.rank-main small,
.rank-value strong,
.rank-value small { display: block; }

.rank-main strong {
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rank-main small,
.rank-value small {
  font-size: 10px;
  color: var(--muted);
}

.rank-value { text-align: right; }
.rank-value strong { font-size: 12px; }

.table-wrap,
.file-table-shell {
  overflow: auto;
  border-radius: 11px;
}

table {
  width: 100%;
  border-collapse: collapse;
}

th {
  font-size: 9px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
  text-align: left;
  padding: 12px;
  border-bottom: 1px solid var(--line);
  white-space: nowrap;
}

td {
  padding: 13px 12px;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
  vertical-align: middle;
}

tbody tr:hover { background: var(--surface-soft); }

.right { text-align: right; }
.strong { font-weight: 750; }

.resource-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  text-decoration: none;
  font-weight: 700;
}

.resource-link:hover { color: var(--accent); }

.folder-dot {
  width: 10px;
  height: 10px;
  border-radius: 3px;
  background: #79a9ee;
  display: inline-block;
  flex: 0 0 auto;
}

.mini-share {
  display: inline-block;
  width: 90px;
  height: 6px;
  background: #edf1f6;
  border-radius: 999px;
  overflow: hidden;
  margin-right: 7px;
  vertical-align: middle;
}

.mini-share span {
  display: block;
  height: 100%;
  background: var(--accent);
  border-radius: 999px;
}

.btn {
  border: 0;
  border-radius: 10px;
  padding: 10px 15px;
  font-weight: 750;
  font-size: 12px;
  cursor: pointer;
  transition: transform .12s ease, opacity .12s ease, background .12s ease;
}

.btn:hover:not(:disabled) { transform: translateY(-1px); }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn-primary { background: var(--accent); color: #fff; }
.btn-primary:hover:not(:disabled) { background: var(--accent-dark); }
.btn-secondary { background: #eef3f9; color: #25354a; }
.link-button { display: inline-block; text-decoration: none; }

.flash {
  padding: 12px 15px;
  border-radius: 12px;
  margin-bottom: 15px;
  font-size: 12px;
  border: 1px solid;
}

.flash-success { background: #effaf5; color: #146545; border-color: #c8eadc; }
.flash-warning { background: #fff7e8; color: #79530a; border-color: #f0ddb6; }
.flash-danger { background: #fff0f2; color: #8b2732; border-color: #f3cbd0; }
.flash-info { background: #eef6ff; color: #205a9b; border-color: #cfe2f7; }

.scan-card {
  background: #eef6ff;
  border: 1px solid #cfe2f7;
  border-radius: 15px;
  padding: 16px;
  margin-bottom: 19px;
  box-shadow: 0 5px 18px rgba(23,105,224,.05);
}

.scan-top {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

.scan-title { font-weight: 850; font-size: 13px; }

.scan-detail {
  font-size: 11px;
  color: #4f6681;
  margin-top: 4px;
}

.status-pill {
  flex: 0 0 auto;
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 10px;
  font-weight: 800;
  background: #dceaff;
  color: var(--accent-dark);
}

.status-pill.status-queued {
  background: #fff0cf;
  color: #805700;
}

.scan-track {
  height: 8px;
  background: #dce8f7;
  border-radius: 999px;
  margin-top: 13px;
  overflow: hidden;
}

.scan-track span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--accent), var(--teal));
  animation: pulse 1.5s ease-in-out infinite;
}

.scan-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-top: 11px;
}

.scan-grid div {
  background: rgba(255,255,255,.72);
  border-radius: 9px;
  padding: 9px;
}

.scan-grid small,
.scan-grid strong { display: block; }

.scan-grid small {
  color: #6b7e94;
  font-size: 8px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.scan-grid strong {
  font-size: 11px;
  margin-top: 3px;
}

@keyframes pulse {
  0%,100% { opacity: .78; }
  50% { opacity: 1; }
}

.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 20px;
}

.breadcrumbs a {
  text-decoration: none;
  color: var(--accent);
}

.empty-state {
  text-align: center;
  color: var(--muted);
  padding: 30px 15px;
  font-size: 12px;
}

.compact-empty { padding: 18px 12px; }

.monthly-panel { overflow: hidden; }

.filter-row {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.filter-row label,
.file-toolbar label {
  display: flex;
  flex-direction: column;
  gap: 5px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
}

select,
input[type="search"] {
  min-height: 38px;
  border: 1px solid #d8e0eb;
  border-radius: 9px;
  background: #fff;
  color: var(--text);
  padding: 8px 10px;
  outline: none;
}

select:focus,
input[type="search"]:focus {
  border-color: #70b7c8;
  box-shadow: 0 0 0 3px rgba(42,139,170,.13);
}

.monthly-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 220px));
  gap: 10px;
  margin-bottom: 16px;
}

.monthly-summary div {
  background: var(--surface-soft);
  border: 1px solid var(--line);
  border-radius: 11px;
  padding: 13px;
}

.monthly-summary small,
.monthly-summary strong { display: block; }

.monthly-summary small {
  color: var(--muted);
  font-size: 10px;
  margin-bottom: 4px;
}

.monthly-summary strong { font-size: 18px; }

.month-chart {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.month-row {
  width: 100%;
  display: grid;
  grid-template-columns: 72px minmax(100px,1fr) 90px 100px;
  gap: 10px;
  align-items: center;
  border: 0;
  background: transparent;
  border-radius: 8px;
  padding: 7px 8px;
  color: var(--text);
  text-align: left;
  cursor: pointer;
}

.month-row:hover,
.month-row-active { background: var(--surface-soft); }

.month-label { font-size: 11px; font-weight: 750; }
.month-row strong { font-size: 11px; text-align: right; }
.month-row small { font-size: 9px; color: var(--muted); text-align: right; }

.panel-note {
  color: var(--muted);
  font-size: 10px;
  margin: 13px 0 0;
}

.files-panel { min-width: 0; }
.files-heading { align-items: center; }

.file-toolbar {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  flex-wrap: wrap;
  padding: 13px;
  margin-bottom: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface-soft);
}

.search-control { flex: 1 1 260px; }
.search-control input { width: 100%; }

.file-status {
  min-height: 18px;
  margin: 4px 0 8px;
}

.file-table-shell {
  max-height: 580px;
  border: 1px solid var(--line);
}

.file-table { min-width: 920px; }

.file-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f9fbfd;
  box-shadow: 0 1px 0 var(--line);
}

.file-name-cell {
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 430px;
}

.file-name-cell span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.file-icon { color: var(--accent); }

.type-badge {
  display: inline-block;
  max-width: 140px;
  border-radius: 999px;
  padding: 4px 7px;
  background: #eef3f9;
  color: #506079;
  font-size: 9px;
  font-weight: 800;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pagination {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 11px;
  margin-top: 13px;
}

.error-panel {
  max-width: 680px;
  margin: 60px auto;
  text-align: center;
}

.error-panel h1 { margin: 8px 0; }
.error-panel p { color: var(--muted); margin-bottom: 20px; }



/* CampaignHub header navigation */
.header-nav {
  margin-left: auto;
  display: flex;
  align-items: center;
}

.nav-dropdown {
  position: relative;
}

.nav-dropdown summary {
  list-style: none;
}

.nav-dropdown summary::-webkit-details-marker {
  display: none;
}

.nav-dropdown-toggle {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 13px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 11px;
  color: #d9e7ed;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  user-select: none;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}

.nav-dropdown-toggle:hover,
.nav-dropdown[open] .nav-dropdown-toggle,
.nav-dropdown[data-current="true"] .nav-dropdown-toggle {
  color: #fff;
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.25);
}

.nav-chevron {
  font-size: 15px;
  line-height: 1;
  transition: transform .18s ease;
}

.nav-dropdown[open] .nav-chevron {
  transform: rotate(180deg);
}

.nav-dropdown-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 310px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 20px 48px rgba(13,45,72,.20);
  z-index: 50;
}

.nav-dropdown-menu::before {
  content: "";
  position: absolute;
  top: -6px;
  right: 22px;
  width: 11px;
  height: 11px;
  background: #fff;
  border-left: 1px solid var(--line);
  border-top: 1px solid var(--line);
  transform: rotate(45deg);
}

.nav-dropdown-menu a {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 11px;
  align-items: center;
  padding: 11px;
  color: var(--text);
  text-decoration: none;
  border-radius: 11px;
}

.nav-dropdown-menu a:hover,
.nav-dropdown-menu a.active {
  background: var(--accent-soft);
  color: var(--accent-dark);
}

.nav-dropdown-menu a strong,
.nav-dropdown-menu a small {
  display: block;
}

.nav-dropdown-menu a strong {
  font-size: 12px;
  margin-bottom: 2px;
}

.nav-dropdown-menu a small {
  color: var(--muted);
  font-size: 10px;
  font-weight: 500;
  line-height: 1.35;
}

.nav-item-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: grid;
  place-items: center;
  color: var(--accent);
  background: var(--accent-soft);
  font-size: 16px;
}

.btn-primary {
  background: linear-gradient(135deg, var(--brand-teal), var(--brand-cyan));
  border-color: transparent;
  color: #fff;
  box-shadow: 0 7px 18px rgba(42,139,170,.22);
}

.btn-primary:hover:not(:disabled) {
  background: linear-gradient(135deg, var(--accent-dark), var(--brand-teal));
}

.bar-track span,
.mini-share span {
  background: linear-gradient(90deg, var(--brand-teal), var(--brand-cyan));
}

.resource-link,
.text-link {
  color: var(--brand-teal);
}

.panel {
  border-color: rgba(42,139,170,.14);
}

.metric-card {
  border-color: rgba(42,139,170,.14);
}

@media (max-width: 720px) {
  .nav-dropdown-menu {
    position: fixed;
    top: 72px;
    left: 16px;
    right: 16px;
    width: auto;
  }

  .nav-dropdown-menu::before {
    display: none;
  }
}

@media (max-width: 1050px) {
  .metrics { grid-template-columns: repeat(2, 1fr); }
  .scan-grid { grid-template-columns: repeat(2, 1fr); }
  .grid-2 { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .page-shell { padding: 20px; }
  .account-chip { display: none; }
  .month-row {
    grid-template-columns: 62px minmax(80px,1fr) 75px;
  }
  .month-row small { display: none; }
}

@media (max-width: 560px) {
  .topbar { padding: 0 15px; min-height: 68px; }
  .brand strong { font-size: 14px; }
  .brand small { font-size: 11px; }
  .page-shell { padding: 16px; }
  .metrics { grid-template-columns: 1fr; }
  .hero { display: block; }
  .last-scan { margin-top: 14px; width: 100%; }
  .metric-card strong { font-size: 22px; }
  .scan-grid { grid-template-columns: 1fr; }
  .scan-top { display: block; }
  .status-pill { display: inline-block; margin-top: 9px; }
  .monthly-summary { grid-template-columns: 1fr 1fr; }
  .panel { padding: 17px; }
  .panel-head { display: block; }
  .compact-filter { margin-top: 12px; }
}


/* Production additions */

.hero-actions {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
}

.metrics-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.metric-card em {
  display: block;
  margin-top: 5px;
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
}

.metric-text {
  font-size: 12px;
  font-weight: 900;
}

.status-line {
  display: block;
  margin-top: 6px;
  font-size: 10px;
  font-weight: 750;
}

.text-link {
  color: var(--accent);
  text-decoration: none;
  font-size: 11px;
  font-weight: 750;
}

.text-link:hover { text-decoration: underline; }

.status-badge {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 800;
  text-transform: capitalize;
  background: #eef3f9;
}

.status-badge.status-completed { color: #126c4a; background: #eaf8f2; }
.status-badge.status-failed { color: #9a2533; background: #fff0f2; }
.status-badge.status-interrupted { color: #7a5200; background: #fff6df; }
.status-badge.status-running { color: #0c54bd; background: #eaf2ff; }

.btn-small {
  padding: 7px 10px;
  border-radius: 8px;
  font-size: 10px;
}

.action-cell {
  white-space: nowrap;
}

.chart-spaced {
  margin-bottom: 22px;
}

.compact-panel {
  padding-bottom: 10px;
}

.trend-grid {
  display: flex;
  align-items: flex-end;
  gap: 11px;
  min-height: 220px;
  overflow-x: auto;
  padding: 18px 4px 2px;
}

.trend-column {
  flex: 1 0 58px;
  min-width: 58px;
  display: grid;
  grid-template-rows: 28px 145px 20px;
  align-items: end;
  text-align: center;
}

.trend-value {
  color: var(--muted);
  font-size: 8px;
  align-self: start;
}

.trend-track {
  width: 22px;
  height: 145px;
  margin: 0 auto;
  border-radius: 8px 8px 4px 4px;
  background: #edf1f6;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}

.trend-track span {
  display: block;
  width: 100%;
  background: linear-gradient(180deg, var(--brand-cyan), var(--brand-teal));
  border-radius: 8px 8px 4px 4px;
}

.trend-column small {
  color: var(--muted);
  font-size: 8px;
  transform: rotate(-30deg);
  transform-origin: center;
  white-space: nowrap;
}

input[type="datetime-local"],
input[type="search"],
select {
  min-height: 40px;
  border: 1px solid #d8e0eb;
  border-radius: 9px;
  background: #fff;
  color: var(--text);
  padding: 8px 10px;
  outline: none;
}

input[type="datetime-local"]:focus,
input[type="search"]:focus,
select:focus {
  border-color: #70b7c8;
  box-shadow: 0 0 0 3px rgba(42,139,170,.13);
}

.file-filter-grid,
.report-filter-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(145px, 1fr));
  gap: 12px;
  align-items: end;
}

.file-filter-grid label,
.report-filter-grid label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.file-filter-grid label > span,
.report-filter-grid label > span {
  color: var(--muted);
  font-size: 10px;
  font-weight: 750;
}

.filter-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  flex-wrap: wrap;
}

.file-summary-metrics,
.report-metrics {
  margin-top: 0;
}

.file-browser .file-table-shell {
  max-height: 660px;
}

.report-filter-panel {
  margin-bottom: 20px;
}

code {
  background: #eef3f9;
  border-radius: 5px;
  padding: 2px 5px;
  font-size: 10px;
}

.scan-card.scan-queued {
  background: #fff8e9;
  border-color: #ead6a7;
}

.scan-card.scan-failed {
  background: #fff0f2;
  border-color: #efc7cd;
}

.scan-card.scan-interrupted {
  background: #fff8e9;
  border-color: #ead6a7;
}

@media (max-width: 1280px) {
  .metrics-5 { grid-template-columns: repeat(3, 1fr); }
  .file-filter-grid,
  .report-filter-grid { grid-template-columns: repeat(3, minmax(160px, 1fr)); }
}

@media (max-width: 900px) {
  .topbar { flex-wrap: wrap; padding-top: 12px; padding-bottom: 12px; }
  .top-actions { margin-left: auto; }
  .metrics-5 { grid-template-columns: repeat(2, 1fr); }
  .file-filter-grid,
  .report-filter-grid { grid-template-columns: repeat(2, minmax(150px, 1fr)); }
}

@media (max-width: 560px) {
  .top-actions .btn { padding: 9px 11px; }
  .metrics-5 { grid-template-columns: 1fr; }
  .file-filter-grid,
  .report-filter-grid { grid-template-columns: 1fr; }
  .filter-actions { width: 100%; }
  .filter-actions .btn { flex: 1; }
  .hero-actions { margin-top: 14px; }
}


/* V12 monitoring and tenant-reporting refinements */

.timezone-form {
  margin: 0;
}

.timezone-form label {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #cfe0e7;
  font-size: 10px;
  font-weight: 750;
}

.timezone-form select {
  min-height: 38px;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 10px;
  background: rgba(255,255,255,.08);
  color: #fff;
  padding: 7px 28px 7px 10px;
  font-size: 11px;
  font-weight: 750;
  cursor: pointer;
}

.timezone-form select option {
  color: var(--text);
  background: #fff;
}

.hero-meta {
  margin-top: 7px !important;
  font-size: 11px;
}

.metrics-6 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.monitoring-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 18px;
}

.signal-card {
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(247,251,252,.98));
  border: 1px solid rgba(42,139,170,.15);
  border-radius: 14px;
  box-shadow: 0 7px 22px rgba(18,59,93,.06);
  padding: 15px 17px;
}

.signal-card > span,
.signal-card > strong,
.signal-card > small {
  display: block;
}

.signal-card > span {
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.signal-card > strong {
  margin-top: 6px;
  font-size: 18px;
  color: var(--text-strong);
}

.signal-card > small {
  margin-top: 4px;
  color: var(--muted);
  font-size: 9px;
}

.delta-up {
  color: #16855b !important;
}

.delta-down {
  color: #c43d4b !important;
}

.panel-head-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.operations-grid {
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .55fr);
}

.health-list {
  display: grid;
  gap: 1px;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
}

.health-list > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  background: var(--surface-soft);
  padding: 11px 13px;
}

.health-list span {
  color: var(--muted);
  font-size: 10px;
}

.health-list strong {
  font-size: 11px;
  text-align: right;
}

.report-filter-grid {
  grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
}

.report-bars .static-row {
  cursor: default;
}

.report-bars .static-row:hover {
  transform: none;
}

.panel-subtitle {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.45;
}

.audit-callout {
  display: grid;
  grid-template-columns: minmax(220px, .55fr) minmax(0, 1.45fr);
  gap: 18px;
  align-items: center;
  margin: 0 0 18px;
  padding: 16px 18px;
  border: 1px solid #efd9a8;
  border-radius: 14px;
  background: #fff8ea;
  box-shadow: 0 6px 18px rgba(154,101,0,.05);
}

.audit-callout strong {
  display: block;
  margin-top: 4px;
  color: #7a5200;
  font-size: 17px;
}

.audit-callout p {
  margin: 0;
  color: #6e624d;
  font-size: 10px;
  line-height: 1.5;
}

.unassigned-row {
  background: #fffaf1;
}

.table-note {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 9px;
  font-weight: 500;
}

@media (max-width: 1380px) {
  .metrics-6 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1000px) {
  .monitoring-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .operations-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .timezone-form label > span {
    display: none;
  }

  .timezone-form select {
    max-width: 150px;
  }

  .audit-callout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .metrics-6,
  .monitoring-strip {
    grid-template-columns: 1fr;
  }

  .top-actions {
    width: 100%;
    justify-content: flex-end;
  }

  .timezone-form select {
    max-width: 130px;
  }
}


/* V13 billing, tenant monitoring and internal-accounting refinements */

.shared-metric .metric-icon {
  color: #9b6a14;
  background: #fff6e5;
}

.billing-overview {
  background:
    radial-gradient(circle at 100% 0%, rgba(66,184,197,.10), transparent 34%),
    linear-gradient(180deg, #fff, #fbfdfe);
}

.billing-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.billing-kpis > div {
  min-width: 0;
  padding: 15px 16px;
  border: 1px solid var(--line);
  border-radius: 13px;
  background: var(--surface-soft);
}

.billing-kpis small,
.billing-kpis strong,
.billing-kpis em {
  display: block;
}

.billing-kpis small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.billing-kpis strong {
  margin-top: 6px;
  color: var(--text-strong);
  font-size: 20px;
  line-height: 1.15;
}

.billing-kpis em {
  margin-top: 5px;
  color: var(--muted);
  font-size: 9px;
  font-style: normal;
}

.tenant-monitoring-panel {
  min-width: 0;
}

.tenant-table-wrap {
  overflow-x: auto;
}

.tenant-monitoring-table {
  min-width: 760px;
}

.tenant-identity {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  color: var(--text-strong);
  text-decoration: none;
}

.tenant-identity strong {
  color: var(--brand-teal);
  font-size: 12px;
}

.tenant-identity small {
  color: var(--muted);
  font-size: 9px;
  font-weight: 600;
}

.tenant-identity:hover strong {
  text-decoration: underline;
}

.tiny-note {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 8px;
}

.billing-statement-head {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  align-items: center;
  margin: 0 0 18px;
  padding: 19px 21px;
  color: #fff;
  border: 1px solid rgba(42,139,170,.22);
  border-radius: 16px;
  background:
    radial-gradient(circle at 92% 20%, rgba(66,184,197,.26), transparent 32%),
    linear-gradient(135deg, #103b5c, #155b76);
  box-shadow: 0 10px 26px rgba(18,59,93,.12);
}

.billing-statement-head .eyebrow {
  color: #8bdbe2;
}

.billing-statement-head h2 {
  margin: 4px 0 2px;
  color: #fff;
  font-size: 27px;
  letter-spacing: .02em;
}

.billing-statement-head strong {
  color: #e3f4f7;
  font-size: 11px;
}

.statement-period {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  text-align: right;
}

.statement-period small {
  color: #a9cbd7;
  font-size: 9px;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .07em;
}

.statement-period strong {
  color: #fff;
  font-size: 11px;
}

.statement-period span {
  color: #cde6ed;
  font-size: 9px;
}

.billing-config-grid {
  align-items: stretch;
}

.pricing-profile-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-top: 4px;
}

.pricing-profile-grid > div {
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface-soft);
}

.pricing-profile-grid small,
.pricing-profile-grid strong {
  display: block;
}

.pricing-profile-grid small {
  color: var(--muted);
  font-size: 8px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.pricing-profile-grid strong {
  margin-top: 4px;
  color: var(--text-strong);
  font-size: 10px;
}

.pricing-source {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 3px 10px;
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px solid var(--line);
}

.pricing-source span {
  color: var(--muted);
  font-size: 9px;
}

.pricing-source strong {
  font-size: 10px;
}

.pricing-source small {
  grid-column: 2;
  color: var(--muted);
  font-size: 8.5px;
  line-height: 1.4;
}

.shared-cost-list {
  display: grid;
  gap: 0;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
}

.shared-cost-list > div {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 12px;
  background: var(--surface-soft);
  border-bottom: 1px solid var(--line);
}

.shared-cost-list > div:last-child {
  border-bottom: 0;
}

.shared-cost-list span {
  color: var(--muted);
  font-size: 9.5px;
}

.shared-cost-list strong {
  font-size: 10.5px;
  text-align: right;
}

.shared-cost-list .strong-line {
  background: #edf7f9;
}

.shared-cost-list .strong-line span,
.shared-cost-list .strong-line strong {
  color: var(--text-strong);
  font-weight: 800;
}

.shared-cost-list .allocation-line {
  background: #eaf7f2;
}

.shared-cost-list .allocation-line span,
.shared-cost-list .allocation-line strong {
  color: #156f50;
  font-weight: 850;
}

.billing-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 64px;
  padding: 6px 9px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .04em;
}

.billing-status-ready {
  color: #126c4a;
  background: #e8f7f0;
}

.billing-status-review {
  color: #865d0f;
  background: #fff4dc;
}

.billing-status-partial,
.billing-status-unavailable {
  color: #9a3440;
  background: #fff0f2;
}

.cost-table {
  min-width: 680px;
}

.cost-table .subtotal-row td {
  background: #f4f8fa;
  font-weight: 800;
}

.cost-table .grand-total-row td {
  color: #0e5f78;
  background: #eaf6f7;
  border-top: 1px solid #b7dfe4;
  font-weight: 900;
}

.billing-review-note {
  margin-top: 12px;
  padding: 11px 13px;
  border: 1px solid #efd9a8;
  border-radius: 11px;
  background: #fff8e9;
  color: #725e37;
  font-size: 9.5px;
  line-height: 1.5;
}

.billing-callout {
  margin: 14px 0;
  padding: 13px 15px;
  border: 1px solid #cce8dc;
  border-radius: 12px;
  background: #eff9f5;
  color: #315f50;
}

.billing-callout strong {
  color: #176f51;
}

.report-accounting-note {
  margin: 18px 0 0;
  padding: 13px 15px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #f8fafc;
  color: var(--muted);
  font-size: 9px;
  line-height: 1.55;
}

.pricing-profile-grid + .panel-note,
.panel .panel-note {
  margin-top: 11px;
}

.status-badge.status-queued,
.status-badge.status-partial,
.status-badge.status-review {
  color: #815914;
  background: #fff4dc;
}

.status-badge.status-unavailable,
.status-badge.status-disabled {
  color: #6a7782;
  background: #eef2f4;
}

@media (max-width: 1220px) {
  .billing-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pricing-profile-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .billing-statement-head {
    display: block;
  }

  .statement-period {
    align-items: flex-start;
    margin-top: 14px;
    text-align: left;
  }

  .billing-kpis,
  .pricing-profile-grid {
    grid-template-columns: 1fr;
  }
}

/* =====================================================================
   CampaignHub Blue Glass UI — V13.1
   Theme-only layer. Backend behavior and data rendering are unchanged.
   ===================================================================== */

:root {
  --ch-blue-950: #022a59;
  --ch-blue-900: #043b78;
  --ch-blue-850: #054887;
  --ch-blue-800: #07559e;
  --ch-blue-700: #0867c6;
  --ch-blue-600: #0b7de8;
  --ch-blue-500: #168cff;
  --ch-blue-400: #39a7ff;
  --ch-cyan-400: #46c8ff;
  --ch-cyan-300: #78ddff;
  --ch-ink: #0a3158;
  --ch-muted: #6c8199;
  --ch-line: #d5e6f7;
  --ch-surface: rgba(255,255,255,.97);
  --ch-surface-soft: #f4f9ff;

  --bg: #eaf4ff;
  --surface: var(--ch-surface);
  --surface-soft: var(--ch-surface-soft);
  --text: #163a5c;
  --text-strong: #082e55;
  --muted: var(--ch-muted);
  --line: var(--ch-line);
  --brand-navy: var(--ch-blue-950);
  --brand-teal: var(--ch-blue-600);
  --brand-cyan: var(--ch-cyan-400);
  --accent: var(--ch-blue-600);
  --accent-dark: var(--ch-blue-800);
  --accent-soft: #e9f4ff;
  --teal: var(--ch-cyan-400);
  --shadow: 0 16px 38px rgba(0, 54, 116, .13);
  --radius: 18px;
}

body.campaignhub-blue-theme {
  position: relative;
  isolation: isolate;
  min-height: 100vh;
  background:
    radial-gradient(circle at 78% -8%, rgba(54, 181, 255, .52), transparent 26rem),
    radial-gradient(circle at -5% 88%, rgba(44, 153, 255, .30), transparent 30rem),
    linear-gradient(135deg, #04366f 0%, #0759aa 45%, #0875dc 100%);
  background-attachment: fixed;
  color: var(--text);
}

body.campaignhub-blue-theme::before,
body.campaignhub-blue-theme::after {
  content: "";
  position: fixed;
  z-index: -1;
  pointer-events: none;
  border-radius: 50%;
  filter: blur(1px);
  opacity: .56;
}

body.campaignhub-blue-theme::before {
  width: 340px;
  height: 340px;
  right: -110px;
  top: 170px;
  background:
    radial-gradient(circle at 50% 50%, transparent 0 31%, rgba(49,183,255,.32) 32% 43%, transparent 45%),
    radial-gradient(circle at 50% 50%, rgba(72,207,255,.16), rgba(0,82,183,.05) 68%, transparent 70%);
}

body.campaignhub-blue-theme::after {
  width: 260px;
  height: 260px;
  left: -90px;
  bottom: 45px;
  background:
    radial-gradient(circle at 50% 50%, transparent 0 29%, rgba(60,193,255,.27) 30% 42%, transparent 44%),
    radial-gradient(circle at 50% 50%, rgba(29,133,244,.18), transparent 68%);
}

/* Header / official logo */
.campaignhub-blue-theme .topbar {
  min-height: 88px;
  padding: 0 28px 0 0;
  gap: 20px;
  background:
    radial-gradient(circle at 48% -90%, rgba(56,196,255,.55), transparent 23rem),
    linear-gradient(105deg, rgba(2,42,89,.98), rgba(4,70,140,.97) 50%, rgba(3,50,105,.98));
  border-bottom: 1px solid rgba(255,255,255,.17);
  box-shadow: 0 14px 38px rgba(0,23,61,.28);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.campaignhub-blue-theme .campaignhub-brand {
  align-self: stretch;
  gap: 22px;
}

.campaignhub-blue-theme .brand-logo-panel {
  align-self: stretch;
  width: 244px;
  min-height: 88px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 13px 21px;
  background: #fff;
  border-radius: 0 0 22px 0;
  box-shadow: 12px 0 28px rgba(0,31,78,.18);
}

.campaignhub-blue-theme .brand-official-logo {
  display: block;
  width: 190px;
  max-width: 100%;
  height: auto;
}

.campaignhub-blue-theme .brand-product {
  color: #f6fbff;
  font-size: 19px;
  font-weight: 720;
  letter-spacing: -.015em;
  white-space: nowrap;
  text-shadow: 0 2px 12px rgba(0,38,90,.22);
}

.campaignhub-blue-theme .header-nav {
  margin-left: auto;
}

.campaignhub-blue-theme .nav-dropdown-toggle {
  border-color: rgba(255,255,255,.20);
  background: rgba(255,255,255,.07);
  color: #e9f7ff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.campaignhub-blue-theme .nav-dropdown-toggle:hover,
.campaignhub-blue-theme .nav-dropdown[open] .nav-dropdown-toggle,
.campaignhub-blue-theme .nav-dropdown[data-current="true"] .nav-dropdown-toggle {
  border-color: rgba(126,218,255,.50);
  background: rgba(32,153,255,.25);
  color: #fff;
}

.campaignhub-blue-theme .nav-dropdown-menu {
  border-color: rgba(39,126,218,.22);
  box-shadow: 0 26px 65px rgba(0,31,76,.27);
}

.campaignhub-blue-theme .nav-dropdown-menu a:hover,
.campaignhub-blue-theme .nav-dropdown-menu a.active {
  background: linear-gradient(135deg, #e7f4ff, #f4fbff);
  color: var(--ch-blue-800);
}

.campaignhub-blue-theme .nav-item-icon {
  color: var(--ch-blue-600);
  background: linear-gradient(145deg, #e6f3ff, #f5fbff);
  border: 1px solid #d2e8ff;
}

.campaignhub-blue-theme .timezone-form label {
  color: #d7eeff;
}

.campaignhub-blue-theme .timezone-form select {
  border-color: rgba(255,255,255,.24);
  background: rgba(255,255,255,.11);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

.campaignhub-blue-theme .btn-primary {
  background: linear-gradient(135deg, #1593ff, #0874df);
  border: 1px solid rgba(139,220,255,.28);
  color: #fff;
  box-shadow: 0 9px 24px rgba(0,91,203,.34), inset 0 1px 0 rgba(255,255,255,.20);
}

.campaignhub-blue-theme .btn-primary:hover:not(:disabled) {
  background: linear-gradient(135deg, #35a8ff, #0874df);
  box-shadow: 0 12px 28px rgba(0,91,203,.42), inset 0 1px 0 rgba(255,255,255,.22);
}

/* Dashboard canvas */
.campaignhub-blue-theme .page-shell {
  width: min(1580px, 100%);
  padding: 28px 30px 40px;
}

.campaignhub-blue-theme .hero {
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
  padding: 23px 25px;
  color: #fff;
  border: 1px solid rgba(125,211,255,.24);
  border-radius: 23px;
  background:
    radial-gradient(circle at 92% 25%, rgba(50,193,255,.24), transparent 22rem),
    linear-gradient(115deg, rgba(2,45,94,.82), rgba(4,91,173,.70));
  box-shadow: 0 18px 44px rgba(0,29,78,.22), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.campaignhub-blue-theme .hero::after {
  content: "";
  position: absolute;
  width: 165px;
  height: 165px;
  right: 12%;
  bottom: -120px;
  border: 24px solid rgba(85,202,255,.13);
  border-radius: 50%;
  transform: rotate(12deg);
}

.campaignhub-blue-theme .hero h1 {
  color: #fff;
  text-shadow: 0 3px 16px rgba(0,32,81,.25);
}

.campaignhub-blue-theme .hero p,
.campaignhub-blue-theme .hero-meta,
.campaignhub-blue-theme .hero .muted {
  color: #cceaff !important;
}

.campaignhub-blue-theme .hero .eyebrow {
  color: #7fdcff;
}

.campaignhub-blue-theme .last-scan {
  position: relative;
  z-index: 1;
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.10);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.campaignhub-blue-theme .last-scan span {
  color: #b9e0fb;
}

/* Cards */
.campaignhub-blue-theme .metric-card,
.campaignhub-blue-theme .signal-card,
.campaignhub-blue-theme .panel {
  border-color: rgba(189,218,246,.78);
  background:
    linear-gradient(180deg, rgba(255,255,255,.99), rgba(249,252,255,.97));
  box-shadow:
    0 15px 34px rgba(0,43,103,.14),
    inset 0 1px 0 rgba(255,255,255,.90);
}

.campaignhub-blue-theme .metric-card {
  position: relative;
  overflow: hidden;
  min-height: 105px;
  padding: 18px;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.campaignhub-blue-theme .metric-card::after {
  content: "";
  position: absolute;
  top: -48px;
  right: -40px;
  width: 105px;
  height: 105px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(46,168,255,.11), transparent 67%);
}

.campaignhub-blue-theme .metric-card:hover {
  transform: translateY(-2px);
  border-color: rgba(69,164,248,.45);
  box-shadow: 0 19px 42px rgba(0,43,103,.18);
}

.campaignhub-blue-theme .metric-card small {
  color: #71869c;
  font-weight: 650;
}

.campaignhub-blue-theme .metric-card strong {
  color: #082f59;
}

.campaignhub-blue-theme .metric-card em {
  color: #7690a7;
}

.campaignhub-blue-theme .metric-icon {
  width: 47px;
  height: 47px;
  border: 1px solid #cde5ff;
  border-radius: 15px;
  background: linear-gradient(145deg, #eef7ff, #dfeeff);
  color: var(--ch-blue-600);
  box-shadow: inset 0 1px 0 #fff, 0 7px 18px rgba(13,105,210,.10);
}

.campaignhub-blue-theme .metric-svg svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.campaignhub-blue-theme .shared-metric .metric-icon {
  color: #087be7;
  background: linear-gradient(145deg, #eff9ff, #dff1ff);
}

.campaignhub-blue-theme .signal-card {
  border-radius: 16px;
}

.campaignhub-blue-theme .signal-card > span {
  color: #67829d;
}

.campaignhub-blue-theme .signal-card > strong {
  color: #0b3965;
}

/* Panels and section headings */
.campaignhub-blue-theme .panel {
  border-radius: 19px;
}

.campaignhub-blue-theme .panel-head h2 {
  color: #0b355d;
}

.campaignhub-blue-theme .eyebrow {
  color: #0878dc;
}

.campaignhub-blue-theme .panel-subtitle,
.campaignhub-blue-theme .muted {
  color: #71859a;
}

.campaignhub-blue-theme .billing-overview {
  background:
    radial-gradient(circle at 100% 0%, rgba(47,174,255,.12), transparent 28rem),
    linear-gradient(180deg, #ffffff, #f4faff);
}

.campaignhub-blue-theme .billing-kpis > div,
.campaignhub-blue-theme .pricing-profile-grid > div,
.campaignhub-blue-theme .health-list > div {
  border-color: #d9e9f8;
  background: linear-gradient(180deg, #f7fbff, #f0f7ff);
}

.campaignhub-blue-theme .billing-kpis strong {
  color: #0a3764;
}

.campaignhub-blue-theme .billing-statement-head {
  border-color: rgba(89,193,255,.33);
  background:
    radial-gradient(circle at 91% 5%, rgba(80,206,255,.29), transparent 26rem),
    linear-gradient(135deg, #03396f, #0769c6);
  box-shadow: 0 17px 38px rgba(0,58,130,.19);
}

/* Data visuals */
.campaignhub-blue-theme .bar-track,
.campaignhub-blue-theme .month-track,
.campaignhub-blue-theme .mini-share,
.campaignhub-blue-theme .trend-track {
  background: #e6f0fb;
}

.campaignhub-blue-theme .bar-track span,
.campaignhub-blue-theme .month-track span,
.campaignhub-blue-theme .mini-share span {
  background: linear-gradient(90deg, #0d80ec, #36bbff);
  box-shadow: 0 0 14px rgba(29,151,248,.18);
}

.campaignhub-blue-theme .trend-track span {
  background: linear-gradient(180deg, #52caff, #087fe9);
}

.campaignhub-blue-theme .resource-link,
.campaignhub-blue-theme .text-link,
.campaignhub-blue-theme .tenant-identity strong,
.campaignhub-blue-theme .breadcrumbs a {
  color: #087be5;
}

/* Tables */
.campaignhub-blue-theme .table-wrap,
.campaignhub-blue-theme .file-table-shell {
  border: 1px solid #e0ecf7;
  background: #fff;
}

.campaignhub-blue-theme th,
.campaignhub-blue-theme .file-table thead th {
  color: #5b7590;
  background: linear-gradient(180deg, #f6faff, #edf5fd);
  border-bottom-color: #dbe9f7;
}

.campaignhub-blue-theme td {
  border-bottom-color: #e7eff7;
}

.campaignhub-blue-theme tbody tr:hover {
  background: #f3f9ff;
}

.campaignhub-blue-theme .btn-secondary {
  border: 1px solid #d4e6f7;
  background: linear-gradient(180deg, #f5faff, #eaf4ff);
  color: #0b4e8a;
}

.campaignhub-blue-theme .btn-secondary:hover:not(:disabled) {
  background: #e3f1ff;
}

.campaignhub-blue-theme select,
.campaignhub-blue-theme input[type="search"],
.campaignhub-blue-theme input[type="datetime-local"] {
  border-color: #ccdef0;
  background: #fff;
  color: #173b5c;
}

.campaignhub-blue-theme select:focus,
.campaignhub-blue-theme input[type="search"]:focus,
.campaignhub-blue-theme input[type="datetime-local"]:focus {
  border-color: #3aa4ff;
  box-shadow: 0 0 0 3px rgba(31,147,247,.14);
}

.campaignhub-blue-theme code {
  color: #0b5ca5;
  background: #eaf5ff;
}

.campaignhub-blue-theme .scan-card {
  border-color: #bcdcff;
  background: linear-gradient(135deg, #eff8ff, #e2f1ff);
}

.campaignhub-blue-theme .scan-track span {
  background: linear-gradient(90deg, #0b7ee9, #42c3ff);
}

/* Navigation / breadcrumbs / footer over blue canvas */
.campaignhub-blue-theme .breadcrumbs {
  color: #d0e9fb;
}

.campaignhub-blue-theme .footer {
  color: rgba(225,243,255,.78);
  text-shadow: 0 1px 5px rgba(0,34,82,.30);
}

/* CampaignHub Container Analyzer V16.4.3 — polished glass login.
   Deliberately contains no decorative vector or social-login elements. */
.login-page {
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0;
  overflow-x: hidden;
  position: relative;
  isolation: isolate;
  background-color: #004e91;
  background-image:
    radial-gradient(ellipse 76% 66% at 50% 13%, rgba(0, 150, 255, .84) 0%, rgba(0, 112, 205, .58) 38%, transparent 70%),
    radial-gradient(circle at 8% 92%, rgba(0, 38, 80, .62) 0%, transparent 45%),
    radial-gradient(circle at 92% 88%, rgba(0, 74, 139, .55) 0%, transparent 48%),
    linear-gradient(138deg, #003663 0%, #0066b9 49%, #004477 100%);
  color: #fff;
}

.login-page::before {
  position: fixed;
  z-index: -1;
  inset: 0;
  background-image: radial-gradient(rgba(255,255,255,.20) .45px, transparent .65px);
  background-size: 4px 4px;
  content: "";
  opacity: .13;
  pointer-events: none;
}

.login-page .login-scene {
  position: relative;
  z-index: 1;
  min-height: 100vh;
  min-height: 100dvh;
  width: min(1140px, 72vw);
  margin: 0 auto;
  display: grid;
  grid-template-rows: auto auto;
  align-content: center;
  gap: clamp(10px, 1.8vh, 16px);
  padding: clamp(12px, 4vh, 32px) 0;
}

.login-page .login-stage {
  width: 100%;
  min-height: clamp(520px, 71vh, 640px);
  display: grid;
  place-items: center;
  padding: clamp(18px, 4vh, 38px) clamp(12px, 2vw, 20px);
  border: 1px solid rgba(91,184,242,.12);
  border-radius: 18px;
  background:
    radial-gradient(ellipse 62% 72% at 50% 45%, rgba(26,149,239,.42) 0%, rgba(4,101,185,.19) 47%, transparent 73%),
    linear-gradient(145deg, rgba(0,35,74,.76), rgba(0,72,132,.56));
  box-shadow:
    0 28px 75px rgba(0,25,55,.18),
    inset 0 1px 0 rgba(104,200,255,.07);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}

.login-page .login-card {
  width: clamp(300px, 24vw, 340px);
  max-width: 100%;
  padding: clamp(25px, 3.8vh, 34px) clamp(28px, 3vw, 36px) clamp(24px, 3.5vh, 31px);
  border: 1px solid rgba(190,226,255,.24);
  border-radius: 17px;
  background:
    linear-gradient(145deg, rgba(64,158,235,.39), rgba(13,104,192,.27));
  box-shadow:
    0 28px 70px rgba(0,31,75,.27),
    inset 0 1px 0 rgba(255,255,255,.17),
    inset 0 -1px 0 rgba(0,69,139,.14);
  backdrop-filter: blur(22px) saturate(135%);
  -webkit-backdrop-filter: blur(22px) saturate(135%);
}

.login-page .login-brand {
  text-align: center;
  padding-bottom: 18px;
}

.login-page .login-logo-holder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(204px, 100%);
  height: 58px;
  overflow: hidden;
  padding: 0 8px;
  border: 1px solid rgba(255,255,255,.78);
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 9px 24px rgba(0,42,91,.18);
}

.login-page .login-logo {
  display: block;
  width: 184px;
  max-width: 100%;
  height: auto;
}

.login-page .login-product {
  margin-top: 9px;
  color: #eaf7ff;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .01em;
}

.login-page .login-heading p {
  margin: 7px 0 0;
  color: rgba(235,248,255,.80);
  font-size: 13px;
}

.login-page .login-heading {
  margin: 4px 0 17px;
}

.login-page .login-heading h1 {
  margin: 0;
  color: #fff;
  font-size: clamp(24px, 6vw, 27px);
  line-height: 1.1;
  letter-spacing: -.025em;
}

.login-page .login-form {
  display: grid;
  gap: 13px;
}

.login-page .login-form label {
  display: grid;
  gap: 6px;
  color: #f4fbff;
  font-size: 13px;
  font-weight: 750;
}

.login-page .login-form input {
  width: 100%;
  height: 44px;
  padding: 0 13px;
  border: 1px solid rgba(255,255,255,.68);
  border-radius: 9px;
  outline: 0;
  background: rgba(255,255,255,.97);
  color: #123c64;
  font-size: 14px;
  font-weight: 600;
  -webkit-font-smoothing: antialiased;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.login-page .login-form input::placeholder {
  color: #526d86;
  font-weight: 650;
  opacity: 1;
}

.login-page .login-form input:focus {
  border-color: #a4e2ff;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(162,225,255,.23);
}

.login-page .login-forgot-link {
  width: fit-content;
  margin-top: -7px;
  color: #e6f6ff;
  font-size: 12px;
  text-decoration: none;
}

.login-page .login-forgot-link:hover {
  color: #fff;
  text-decoration: underline;
}

.login-page .login-submit {
  min-height: 44px;
  margin-top: 4px;
  border: 0;
  border-radius: 9px;
  background: linear-gradient(135deg, #073f75, #042f5e);
  color: #fff;
  cursor: pointer;
  font-weight: 850;
  box-shadow: 0 11px 24px rgba(0,37,85,.27);
}

.login-page .login-submit:hover {
  filter: brightness(1.04);
}

.login-page .login-submit:focus-visible {
  outline: 3px solid rgba(190,231,255,.55);
  outline-offset: 3px;
}

.login-page .login-alert {
  margin: 0 0 17px;
  padding: 11px 13px;
  border: 1px solid;
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.45;
}

.login-page .login-alert-error {
  border-color: rgba(255,193,201,.74);
  background: rgba(88,18,31,.70);
  color: #ffe9ec;
}

.login-page .login-alert-warning {
  border-color: rgba(255,222,154,.72);
  background: rgba(91,61,5,.65);
  color: #fff3d2;
}

.login-page .login-alert-success {
  border-color: rgba(164,235,206,.68);
  background: rgba(6,79,56,.64);
  color: #e4fff4;
}

.login-page .login-footer {
  margin: 0;
  color: rgba(255,255,255,.82);
  font-size: 12px;
  line-height: 1.45;
  text-align: center;
  text-shadow: 0 2px 8px rgba(0,25,60,.28);
}

.login-page .login-footer a {
  color: #fff;
  font-weight: 800;
  text-underline-offset: 3px;
}

.login-page .login-footer a:hover {
  color: #cfeeff;
}

.login-page .login-help-card .login-heading {
  margin-top: 8px;
}

.login-page .login-help-steps {
  display: grid;
  gap: 11px;
  margin: 0 0 20px;
}

.login-page .login-help-steps > div {
  display: grid;
  gap: 3px;
  padding: 12px 13px;
  border: 1px solid rgba(194,231,255,.23);
  border-radius: 10px;
  background: rgba(2,61,115,.24);
}

.login-page .login-help-steps strong {
  color: #fff;
  font-size: 13px;
}

.login-page .login-help-steps span {
  color: rgba(235,248,255,.78);
  font-size: 12px;
  line-height: 1.45;
}

.login-page .login-return-link {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

@media (max-width: 900px) {
  .login-page .login-scene {
    width: min(680px, calc(100% - 24px));
  }
}

@media (max-width: 520px) {
  .login-page .login-scene {
    width: min(calc(100% - 16px), 440px);
    gap: 8px;
    padding: 8px 0 10px;
  }

  .login-page .login-stage {
    min-height: calc(100dvh - 58px);
    padding: 14px 9px;
    border-radius: 16px;
  }

  .login-page .login-card {
    padding: 25px 21px 23px;
    border-radius: 16px;
  }

  .login-page .login-logo {
    width: 166px;
  }

  .login-page .login-footer {
    padding: 0 8px;
    font-size: 11px;
  }
}

@media (max-height: 740px) and (min-width: 521px) {
  .login-page .login-scene {
    gap: 8px;
    padding: 10px 0;
  }

  .login-page .login-stage {
    min-height: calc(100dvh - 52px);
    padding: 14px;
    border-radius: 18px;
  }

  .login-page .login-card {
    padding: 19px 28px;
    border-radius: 16px;
  }

  .login-page .login-brand {
    padding-bottom: 10px;
  }

  .login-page .login-logo-holder {
    min-height: 0;
    padding: 0;
  }

  .login-page .login-logo {
    width: 154px;
  }

  .login-page .login-product {
    margin-top: 6px;
    font-size: 13px;
  }

  .login-page .login-heading {
    margin: 3px 0 12px;
  }

  .login-page .login-heading p {
    margin-top: 4px;
  }

  .login-page .login-form {
    gap: 10px;
  }

  .login-page .login-form input {
    height: 43px;
  }

  .login-page .login-forgot-link {
    margin-top: -4px;
  }

  .login-page .login-submit {
    min-height: 44px;
  }

  .login-page .login-footer {
    font-size: 11px;
  }
}

@media (max-width: 360px) {
  .login-page .login-stage {
    padding: 10px 6px;
    border-radius: 14px;
  }

  .login-page .login-card {
    padding-right: 16px;
    padding-left: 16px;
  }

  .login-page .login-logo {
    width: min(160px, 100%);
  }
}

/* Responsive theme refinements */
@media (max-width: 1100px) {
  .campaignhub-blue-theme .brand-logo-panel {
    width: 205px;
  }

  .campaignhub-blue-theme .brand-official-logo {
    width: 164px;
  }

  .campaignhub-blue-theme .brand-product {
    font-size: 16px;
  }
}

@media (max-width: 900px) {
  .campaignhub-blue-theme .topbar {
    padding-right: 18px;
  }

  .campaignhub-blue-theme .campaignhub-brand {
    min-height: 70px;
  }

  .campaignhub-blue-theme .brand-logo-panel {
    min-height: 70px;
    width: 180px;
    border-radius: 0 0 18px 0;
  }

  .campaignhub-blue-theme .brand-official-logo {
    width: 145px;
  }

  .campaignhub-blue-theme .brand-product {
    display: none;
  }
}

@media (max-width: 720px) {
  .campaignhub-blue-theme .page-shell {
    padding: 18px 15px 28px;
  }

  .campaignhub-blue-theme .hero {
    padding: 19px;
    border-radius: 18px;
  }
}

@media (max-width: 560px) {
  .campaignhub-blue-theme .topbar {
    min-height: 70px;
    padding-left: 0;
  }

  .campaignhub-blue-theme .brand-logo-panel {
    width: 154px;
    padding: 11px 14px;
  }

  .campaignhub-blue-theme .brand-official-logo {
    width: 125px;
  }

  .campaignhub-blue-theme .nav-dropdown-toggle {
    padding: 8px 10px;
  }

  .campaignhub-blue-theme .metric-card {
    min-height: 92px;
  }
}

/* =====================================================================
   CampaignHub Stable UI Fixes — V13.1.1
   Transparent official logo, readable scan state, responsive cards.
   ===================================================================== */

/* Official logo: no white panel/canvas in the top navigation. */
.campaignhub-blue-theme .campaignhub-brand {
  align-self: center;
  gap: 16px;
  min-width: 0;
}

.campaignhub-blue-theme .brand-logo-panel {
  align-self: center;
  width: auto;
  min-height: 0;
  padding: 7px 0 7px 18px;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
}

.campaignhub-blue-theme .brand-official-logo {
  width: clamp(132px, 12vw, 188px);
  max-width: 100%;
  height: auto;
  object-fit: contain;
  filter:
    drop-shadow(0 1px 1px rgba(255,255,255,.28))
    drop-shadow(0 6px 14px rgba(0,20,58,.16));
}

.campaignhub-blue-theme .brand-product {
  font-size: clamp(15px, 1.45vw, 19px);
}

/* Last completed scan: date and status remain clearly visible. */
.campaignhub-blue-theme .monitoring-hero {
  align-items: center;
}

.campaignhub-blue-theme .last-scan {
  flex: 0 1 auto;
  width: clamp(245px, 25vw, 330px);
  min-width: 0;
  padding: 13px 16px;
  border: 1px solid rgba(154,224,255,.30);
  background:
    linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.075));
  color: #fff;
}

.campaignhub-blue-theme .last-scan span {
  color: #c8eaff !important;
  font-weight: 750;
}

.campaignhub-blue-theme .last-scan strong {
  color: #fff !important;
  font-size: 12.5px;
  line-height: 1.38;
  white-space: normal;
  overflow-wrap: anywhere;
  text-shadow: 0 1px 7px rgba(0,27,70,.34);
}

.campaignhub-blue-theme .last-scan .status-line {
  display: inline-flex;
  align-items: center;
  width: auto;
  max-width: 100%;
  margin-top: 8px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 9px;
  line-height: 1.1;
  font-weight: 850;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.campaignhub-blue-theme .last-scan .status-completed {
  color: #d6ffe9 !important;
  background: rgba(24,190,108,.24);
  border: 1px solid rgba(116,246,176,.36);
}

.campaignhub-blue-theme .last-scan .status-running,
.campaignhub-blue-theme .last-scan .status-preparing {
  color: #e3f6ff !important;
  background: rgba(35,157,255,.25);
  border: 1px solid rgba(120,211,255,.34);
}

.campaignhub-blue-theme .last-scan .status-failed {
  color: #ffe2e6 !important;
  background: rgba(212,62,79,.25);
  border: 1px solid rgba(255,145,157,.34);
}

.campaignhub-blue-theme .last-scan .status-interrupted,
.campaignhub-blue-theme .last-scan .status-queued {
  color: #fff2ca !important;
  background: rgba(230,164,38,.23);
  border: 1px solid rgba(255,210,113,.36);
}

/* Main KPI cards: responsive balanced layout and content-sized height. */
.campaignhub-blue-theme .metrics-6 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
}

.campaignhub-blue-theme .metric-card {
  width: 100%;
  min-width: 0;
  min-height: 104px;
  height: auto;
  padding: clamp(15px, 1.4vw, 20px);
}

.campaignhub-blue-theme .metric-card > div {
  min-width: 0;
  flex: 1 1 auto;
}

.campaignhub-blue-theme .metric-card strong {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: anywhere;
}

.campaignhub-blue-theme .metric-card em {
  display: block;
  margin-top: 4px;
  line-height: 1.25;
  white-space: normal;
}

/* Secondary monitoring and billing information cards adapt as content grows. */
.campaignhub-blue-theme .monitoring-strip {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch;
}

.campaignhub-blue-theme .signal-card {
  height: auto;
  min-height: 92px;
}

.campaignhub-blue-theme .signal-card > strong,
.campaignhub-blue-theme .billing-kpis strong,
.campaignhub-blue-theme .pricing-profile-grid strong {
  overflow-wrap: anywhere;
}

.campaignhub-blue-theme .billing-kpis {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch;
}

.campaignhub-blue-theme .billing-kpis > div {
  height: auto;
  min-height: 86px;
}

/* Tables stay within their card and scroll horizontally only when necessary. */
.campaignhub-blue-theme .table-wrap,
.campaignhub-blue-theme .file-table-shell {
  max-width: 100%;
  overflow-x: auto;
}

/* Responsive layout: balanced rather than fixed pixel boxes. */
@media (max-width: 1180px) {
  .campaignhub-blue-theme .metrics-6 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .campaignhub-blue-theme .monitoring-strip,
  .campaignhub-blue-theme .billing-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .campaignhub-blue-theme .monitoring-hero {
    display: block;
  }

  .campaignhub-blue-theme .last-scan {
    width: 100%;
    margin-top: 15px;
  }

  .campaignhub-blue-theme .metrics-6,
  .campaignhub-blue-theme .monitoring-strip,
  .campaignhub-blue-theme .billing-kpis {
    grid-template-columns: 1fr;
  }

  .campaignhub-blue-theme .brand-logo-panel {
    padding-left: 14px;
  }
}

@media (max-width: 560px) {
  .campaignhub-blue-theme .brand-official-logo {
    width: 128px;
  }

  .campaignhub-blue-theme .metric-card {
    min-height: 92px;
  }
}

/* =====================================================================
   CampaignHub Professional Typography — V13.1.2
   Typography-only refinement. Existing layout and functionality unchanged.
   ===================================================================== */

:root {
  --ch-font-sans:
    "Inter",
    "Segoe UI Variable Text",
    "Segoe UI",
    Roboto,
    Helvetica,
    Arial,
    sans-serif;

  --ch-font-mono:
    "SFMono-Regular",
    Consolas,
    "Liberation Mono",
    Menlo,
    monospace;
}

/* Global application typography */
html,
body,
button,
input,
select,
textarea {
  font-family: var(--ch-font-sans);
}

body {
  font-weight: 400;
  letter-spacing: -0.008em;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Monitoring and billing numbers are easier to compare when digits align. */
.metric-card strong,
.signal-card > strong,
.billing-kpis strong,
.pricing-profile-grid strong,
.last-scan strong,
table,
.table,
.file-table,
code {
  font-variant-numeric: tabular-nums lining-nums;
}

/* Product title in header */
.campaignhub-blue-theme .brand-product {
  font-family: var(--ch-font-sans);
  font-size: clamp(18px, 1.6vw, 25px);
  line-height: 1.08;
  font-weight: 700;
  letter-spacing: -0.032em;
}

/* Hero / page introduction */
.campaignhub-blue-theme .hero .eyebrow,
.campaignhub-blue-theme .billing-statement-head .eyebrow {
  font-size: 11px;
  line-height: 1.2;
  font-weight: 760;
  letter-spacing: 0.145em;
  text-transform: uppercase;
}

.campaignhub-blue-theme .hero h1 {
  margin-top: 8px;
  margin-bottom: 8px;
  font-family: var(--ch-font-sans);
  font-size: clamp(34px, 3vw, 42px);
  line-height: 1.06;
  font-weight: 720;
  letter-spacing: -0.045em;
}

.campaignhub-blue-theme .hero p,
.campaignhub-blue-theme .hero-meta {
  font-size: 14px;
  line-height: 1.5;
  font-weight: 440;
  letter-spacing: -0.012em;
}

/* Last completed scan */
.campaignhub-blue-theme .last-scan > span:first-child {
  font-size: 10.5px;
  line-height: 1.2;
  font-weight: 760;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.campaignhub-blue-theme .last-scan strong {
  font-size: 13px;
  line-height: 1.42;
  font-weight: 680;
  letter-spacing: -0.015em;
}

.campaignhub-blue-theme .last-scan .status-line {
  font-size: 9.5px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: 0.035em;
}

/* KPI cards */
.campaignhub-blue-theme .metric-card small {
  font-size: 11px;
  line-height: 1.25;
  font-weight: 590;
  letter-spacing: -0.006em;
}

.campaignhub-blue-theme .metric-card strong {
  font-size: clamp(22px, 2.15vw, 29px);
  line-height: 1.06;
  font-weight: 720;
  letter-spacing: -0.035em;
}

.campaignhub-blue-theme .metric-card em {
  font-size: 10.5px;
  line-height: 1.35;
  font-style: normal;
  font-weight: 430;
  letter-spacing: -0.006em;
}

/* Secondary monitoring cards */
.campaignhub-blue-theme .signal-card > span,
.campaignhub-blue-theme .billing-kpis > div > span,
.campaignhub-blue-theme .pricing-profile-grid > div > span {
  font-size: 10px;
  line-height: 1.3;
  font-weight: 650;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.campaignhub-blue-theme .signal-card > strong,
.campaignhub-blue-theme .billing-kpis strong {
  font-size: clamp(17px, 1.65vw, 22px);
  line-height: 1.08;
  font-weight: 700;
  letter-spacing: -0.028em;
}

/* Panel hierarchy */
.campaignhub-blue-theme .panel-head h2,
.campaignhub-blue-theme .panel h2 {
  font-size: 18px;
  line-height: 1.18;
  font-weight: 700;
  letter-spacing: -0.026em;
}

.campaignhub-blue-theme .panel-head .eyebrow,
.campaignhub-blue-theme .panel > .eyebrow {
  font-size: 10px;
  line-height: 1.2;
  font-weight: 760;
  letter-spacing: 0.125em;
  text-transform: uppercase;
}

.campaignhub-blue-theme .panel-subtitle,
.campaignhub-blue-theme .muted {
  font-size: 11px;
  line-height: 1.45;
  font-weight: 420;
  letter-spacing: -0.004em;
}

/* Tenant names, links and important labels */
.campaignhub-blue-theme .tenant-identity strong,
.campaignhub-blue-theme .resource-link,
.campaignhub-blue-theme .text-link,
.campaignhub-blue-theme .breadcrumbs a {
  font-weight: 650;
  letter-spacing: -0.012em;
}

/* Tables */
.campaignhub-blue-theme table,
.campaignhub-blue-theme .table,
.campaignhub-blue-theme .file-table {
  font-size: 11.5px;
  line-height: 1.4;
  letter-spacing: -0.006em;
}

.campaignhub-blue-theme th,
.campaignhub-blue-theme .file-table thead th {
  font-size: 9.5px;
  line-height: 1.25;
  font-weight: 720;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.campaignhub-blue-theme td {
  font-weight: 440;
}

.campaignhub-blue-theme td strong {
  font-weight: 670;
}

/* Navigation and controls */
.campaignhub-blue-theme .nav-dropdown-toggle,
.campaignhub-blue-theme .timezone-form select,
.campaignhub-blue-theme .btn-primary,
.campaignhub-blue-theme .btn-secondary {
  font-size: 12px;
  line-height: 1.2;
  font-weight: 650;
  letter-spacing: -0.012em;
}

.campaignhub-blue-theme .timezone-form label {
  font-size: 10px;
  line-height: 1.2;
  font-weight: 650;
  letter-spacing: 0.02em;
}

/* Form controls on report/filter pages */
.campaignhub-blue-theme select,
.campaignhub-blue-theme input[type="search"],
.campaignhub-blue-theme input[type="datetime-local"],
.campaignhub-blue-theme input[type="text"],
.campaignhub-blue-theme input[type="date"] {
  font-size: 12px;
  font-weight: 450;
  letter-spacing: -0.006em;
}

/* Buttons remain compact and professional. */
.campaignhub-blue-theme button,
.campaignhub-blue-theme .btn {
  font-family: var(--ch-font-sans);
}

/* Breadcrumbs/footer */
.campaignhub-blue-theme .breadcrumbs {
  font-size: 11px;
  line-height: 1.4;
  font-weight: 450;
}

.campaignhub-blue-theme .footer {
  font-size: 10.5px;
  line-height: 1.4;
  font-weight: 420;
  letter-spacing: -0.004em;
}

/* Monospaced values only where technically useful. */
.campaignhub-blue-theme code {
  font-family: var(--ch-font-mono);
  font-size: .93em;
  letter-spacing: 0;
}

/* Responsive typography */
@media (max-width: 900px) {
  .campaignhub-blue-theme .brand-product {
    font-size: 18px;
  }

  .campaignhub-blue-theme .hero h1 {
    font-size: clamp(31px, 6vw, 38px);
  }

  .campaignhub-blue-theme .panel-head h2,
  .campaignhub-blue-theme .panel h2 {
    font-size: 17px;
  }
}

@media (max-width: 560px) {
  .campaignhub-blue-theme .hero h1 {
    font-size: 30px;
    letter-spacing: -0.038em;
  }

  .campaignhub-blue-theme .hero p,
  .campaignhub-blue-theme .hero-meta {
    font-size: 13px;
  }

  .campaignhub-blue-theme .metric-card strong {
    font-size: 23px;
  }

  .campaignhub-blue-theme table,
  .campaignhub-blue-theme .table,
  .campaignhub-blue-theme .file-table {
    font-size: 11px;
  }
}

/* =====================================================================
   CampaignHub V15 monitoring + reconciled billing refinements
   ===================================================================== */

.signal-card-link {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}

.signal-card-link:hover {
  transform: translateY(-2px);
  border-color: rgba(58,164,255,.42);
  box-shadow: 0 16px 34px rgba(0,43,103,.17);
}

.object-change-panel {
  scroll-margin-top: 110px;
}

.change-table code {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.change-table-wrap {
  max-width: 100%;
  max-height: 520px;
  overflow: auto;
}

.change-table {
  min-width: 760px;
  table-layout: fixed;
}

.change-table th,
.change-table td {
  min-width: 0;
}

.change-table .change-path-cell {
  overflow: hidden;
}

.change-table .change-action-column,
.change-table .change-action-cell {
  width: 124px;
  min-width: 124px;
  white-space: nowrap;
}

.change-table .change-action-cell .btn {
  display: inline-flex;
  min-width: 86px;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

.change-table-tenant th:nth-child(1) { width: 27%; }
.change-table-tenant th:nth-child(2) { width: 17%; }
.change-table-tenant th:nth-child(3) { width: 10%; }
.change-table-tenant th:nth-child(4) { width: 14%; }
.change-table-tenant th:nth-child(5) { width: 16%; }

.change-table-infrastructure th:nth-child(1) { width: 15%; }
.change-table-infrastructure th:nth-child(2) { width: 45%; }
.change-table-infrastructure th:nth-child(3) { width: 8%; }
.change-table-infrastructure th:nth-child(4) { width: 10%; }
.change-table-infrastructure th:nth-child(5) { width: 12%; }

.billing-status-modeled {
  color: #075fbd;
  background: #e7f3ff;
  border-color: #b9dcff;
}

.operation-rule-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.account-reconciliation-panel .strong-line {
  margin-top: 4px;
}

@media (max-width: 1180px) {
  .operation-rule-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .operation-rule-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}



/* =====================================================================
   CampaignHub V15 Billing Reconciliation UI
   ===================================================================== */

.billing-status-reconciled,
.status-reconciled {
  color: #08734a !important;
  background: #e7f8ef !important;
  border-color: #afe8cb !important;
}

.billing-status-provisional,
.status-provisional {
  color: #8a5700 !important;
  background: #fff5dc !important;
  border-color: #f4d38a !important;
}

.billing-callout-success {
  border-color: rgba(24, 172, 102, .28);
  background: linear-gradient(135deg, #effbf5, #f8fffb);
}

.billing-info-steps {
  display: grid;
  gap: 10px;
}

.billing-info-steps > div {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: start;
  gap: 11px;
  padding: 11px 12px;
  border: 1px solid #dbe9f7;
  border-radius: 13px;
  background: linear-gradient(180deg, #f8fbff, #f2f8ff);
}

.billing-info-steps > div > strong {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border-radius: 9px;
  color: #fff;
  background: linear-gradient(145deg, #0b7de8, #168cff);
  box-shadow: 0 6px 13px rgba(7, 100, 200, .18);
}

.billing-info-steps > div > span {
  color: #31526f;
  font-size: 12px;
  line-height: 1.48;
}

.billing-detail-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.billing-detail-cards > div {
  min-width: 0;
  padding: 15px;
  border: 1px solid #d9e8f7;
  border-radius: 15px;
  background: linear-gradient(180deg, #fbfdff, #f1f7fe);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95);
}

.billing-detail-cards small {
  display: block;
  margin-bottom: 7px;
  color: #6a8097;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.billing-detail-cards strong {
  display: block;
  color: #083862;
  font-size: 20px;
  line-height: 1.12;
  font-weight: 720;
  letter-spacing: -.025em;
  overflow-wrap: anywhere;
  font-variant-numeric: tabular-nums lining-nums;
}

.billing-detail-cards span {
  display: block;
  margin-top: 6px;
  color: #70869b;
  font-size: 11px;
  line-height: 1.4;
}

.billing-detail-cards .billing-final-card {
  border-color: #a9ddc5;
  background: linear-gradient(145deg, #edf9f3, #f7fdfa);
}

.billing-detail-cards .billing-final-card strong {
  color: #08734a;
}

.tenant-billing-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.tenant-billing-card {
  min-width: 0;
  padding: 15px;
  border: 1px solid #d9e8f7;
  border-radius: 15px;
  background: linear-gradient(180deg, #fff, #f4f9ff);
  box-shadow: 0 8px 18px rgba(0, 45, 105, .07);
}

.tenant-billing-card-inactive {
  opacity: .76;
}

.tenant-billing-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.tenant-billing-card-head > strong {
  color: #0878dc;
  font-size: 15px;
  font-weight: 750;
}

.tenant-billing-card-total {
  margin-top: 13px;
  color: #083862;
  font-size: 25px;
  font-weight: 740;
  letter-spacing: -.03em;
  font-variant-numeric: tabular-nums lining-nums;
}

.tenant-billing-card small,
.tenant-billing-card > span {
  display: block;
  margin-top: 6px;
  color: #6f8599;
  font-size: 10.5px;
  line-height: 1.4;
}

.reconciliation-cards {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.usage-evidence-cards {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

@media (max-width: 1180px) {
  .billing-detail-cards,
  .tenant-billing-card-grid,
  .reconciliation-cards,
  .usage-evidence-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .billing-detail-cards,
  .tenant-billing-card-grid,
  .reconciliation-cards,
  .usage-evidence-cards {
    grid-template-columns: 1fr;
  }
}


/* =====================================================================
   CampaignHub Simple Billing UX — V15.1
   Plain-language help, simplified report cards, technical details on demand.
   ===================================================================== */

.page-help {
  margin: -8px 0 18px;
  border: 1px solid rgba(145, 210, 255, .30);
  border-radius: 14px;
  background: rgba(255,255,255,.10);
  color: #fff;
  backdrop-filter: blur(10px);
}

.page-help > summary {
  cursor: pointer;
  list-style: none;
  padding: 11px 15px;
  font-size: 12px;
  font-weight: 700;
}

.page-help > summary::-webkit-details-marker,
.term-help > summary::-webkit-details-marker,
.advanced-details > summary::-webkit-details-marker,
.glossary-panel > summary::-webkit-details-marker {
  display: none;
}

.page-help-grid,
.glossary-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  padding: 0 15px 15px;
}

.page-help-grid > div,
.glossary-grid > div {
  padding: 11px 12px;
  border-radius: 11px;
  background: rgba(255,255,255,.11);
}

.page-help-grid strong,
.page-help-grid span,
.glossary-grid strong,
.glossary-grid span {
  display: block;
}

.page-help-grid span {
  margin-top: 4px;
  color: #d8efff;
  font-size: 11px;
  line-height: 1.45;
}

.term-help {
  position: relative;
  display: inline-block;
}

.term-help > summary {
  cursor: pointer;
  list-style: none;
  min-width: 28px;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 9px;
  border: 1px solid #cae2f6;
  border-radius: 999px;
  background: #f0f7ff;
  color: #0b6dcc;
  font-size: 11px;
  font-weight: 750;
  user-select: none;
}

.term-help-wide > summary {
  padding-inline: 11px;
}

.term-help-popover {
  position: absolute;
  z-index: 40;
  right: 0;
  top: calc(100% + 8px);
  width: min(390px, 82vw);
  padding: 14px;
  border: 1px solid #cfe2f4;
  border-radius: 14px;
  background: #fff;
  color: #173a5c;
  box-shadow: 0 18px 48px rgba(0,44,100,.20);
}

.term-help-popover strong {
  display: block;
  margin-top: 8px;
  color: #083c70;
  font-size: 12px;
}

.term-help-popover strong:first-child { margin-top: 0; }

.term-help-popover p {
  margin: 3px 0 8px;
  color: #667f98;
  font-size: 11px;
  line-height: 1.45;
}

.simple-status-callout strong {
  font-size: 16px;
}

.billing-callout-danger {
  background: #fff1f1;
  border-color: #f0c7c7;
}

.simple-cost-summary .billing-detail-cards {
  grid-template-columns: repeat(4, minmax(0,1fr));
}

.simple-money-cards > div {
  min-height: 104px;
}

.cost-check-line {
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid #d9e6f1;
  border-radius: 12px;
  background: #f4f8fc;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.cost-check-line strong {
  color: #173a5c;
}

.cost-check-line span {
  font-weight: 800;
  color: #9a6500;
}

.cost-check-line.cost-check-ok {
  border-color: #bfe5cf;
  background: #ecfaf2;
}

.cost-check-line.cost-check-ok span {
  color: #08734a;
}

.simple-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
}

.simple-steps > div {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 14px;
  border: 1px solid #d8e7f5;
  border-radius: 13px;
  background: #f7fbff;
}

.simple-steps > div > strong {
  flex: 0 0 26px;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #1489ed;
  color: #fff;
}

.simple-steps > div > span {
  color: #526d87;
  font-size: 12px;
  line-height: 1.5;
}

.simple-tenant-cards .tenant-billing-card small,
.simple-tenant-cards .tenant-billing-card span {
  display: block;
  margin-top: 5px;
}

.advanced-details,
.glossary-panel {
  overflow: visible;
}

.advanced-details > summary,
.glossary-panel > summary {
  cursor: pointer;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  padding: 18px 20px;
}

.advanced-details > summary strong,
.glossary-panel > summary strong {
  display: block;
  margin-top: 3px;
  color: #103c64;
  font-size: 16px;
}

.advanced-details-body {
  padding: 0 20px 20px;
}

.glossary-grid {
  padding: 0 20px 20px;
}

.glossary-grid > div {
  background: #f5f9fd;
  border: 1px solid #dce9f5;
}

.glossary-grid span {
  margin-top: 4px;
  color: #677e94;
  font-size: 11px;
  line-height: 1.45;
}

.simple-intro h2 {
  margin-top: 0;
}

.simple-cost-panel .panel-head-actions {
  align-items: center;
}

@media (max-width: 1000px) {
  .simple-cost-summary .billing-detail-cards {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .simple-steps {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .page-help-grid,
  .glossary-grid,
  .simple-cost-summary .billing-detail-cards {
    grid-template-columns: 1fr;
  }

  .term-help-popover {
    position: fixed;
    left: 16px;
    right: 16px;
    top: 18vh;
    width: auto;
    max-height: 64vh;
    overflow-y: auto;
  }
}


/* =====================================================================
   CampaignHub Billing Clarity — V15.2
   ===================================================================== */

.billing-callout-provisional {
  background: linear-gradient(135deg, #fff7df, #fffaf0) !important;
  border-color: #efd28a !important;
  color: #72571b !important;
}

.billing-callout-provisional strong {
  color: #8a5a00 !important;
}

.billing-callout-danger strong {
  color: #a63b45 !important;
}

.billing-status-provisional {
  color: #8a5700 !important;
  background: #fff3cf !important;
  border-color: #edcb72 !important;
}

.simple-cost-panel .billing-kpis strong,
.simple-cost-summary .billing-detail-cards strong,
.simple-tenant-summary .billing-detail-cards strong,
.tenant-billing-card-total {
  font-variant-numeric: tabular-nums;
}



/* =====================================================================
   CampaignHub Tenant-Focused Scope — V15.3
   ===================================================================== */

.report-scope-field {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 63px;
  padding: 9px 12px;
  border: 1px solid #d5e5f3;
  border-radius: 12px;
  background: #f5f9fd;
}

.report-scope-field > span {
  color: #6d8398;
  font-size: 10px;
  font-weight: 650;
}

.report-scope-field > strong {
  margin-top: 3px;
  color: #0b4d84;
  font-size: 13px;
  font-weight: 750;
}

.report-scope-field > small {
  margin-top: 2px;
  color: #7890a5;
  font-size: 9px;
}

.object-change-panel .change-table th:first-child,
.object-change-panel .change-table td:first-child {
  padding-left: 14px;
}



.advanced-cost-breakdown {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid #dbe8f3;
}

.advanced-cost-breakdown > strong {
  color: #0d416f;
  font-size: 13px;
}

.advanced-cost-breakdown > p {
  margin: 4px 0 10px;
  color: #6c8297;
  font-size: 10.5px;
  line-height: 1.45;
}

.advanced-cost-breakdown .glossary-grid {
  padding: 0;
}



/* =====================================================================
   CampaignHub Billing & Container Clarity — V15.4
   ===================================================================== */

.container-change-panel {
  margin-top: 16px;
}

.container-change-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
}

.container-change-card {
  border: 1px solid #d6e5f2;
  border-radius: 16px;
  padding: 15px;
  background: linear-gradient(180deg, #ffffff, #f7fbff);
}

.container-change-tenant {
  border-color: #b9e5d2;
  background: linear-gradient(180deg, #ffffff, #f3fcf8);
}

.container-change-infra {
  border-color: #d8e2ed;
  background: linear-gradient(180deg, #ffffff, #f6f8fb);
}

.container-change-head,
.change-scope-head,
.advanced-cost-breakdown-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}

.container-change-head > div {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.container-change-head strong {
  color: #0b3e6d;
  font-size: 14px;
}

.scope-pill {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  min-height: 22px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .02em;
}

.scope-pill-tenant {
  background: #e8f8f0;
  border: 1px solid #b9e7d0;
  color: #08714a;
}

.scope-pill-infra {
  background: #f1f5f9;
  border: 1px solid #d6e0ea;
  color: #5a7187;
}

.container-change-values {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 9px;
  margin-top: 14px;
}

.container-change-values > div {
  padding: 10px;
  border-radius: 11px;
  background: #fff;
  border: 1px solid #e0ebf4;
}

.container-change-values small,
.container-change-values strong {
  display: block;
}

.container-change-values small {
  color: #70869a;
  font-size: 9px;
}

.container-change-values strong {
  margin-top: 4px;
  color: #123f68;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}

.container-change-card > p {
  margin: 12px 0 0;
  color: #70869a;
  font-size: 10px;
  line-height: 1.45;
}

.change-scope-box {
  margin-top: 13px;
  overflow: hidden;
  border: 1px solid #d7e5f1;
  border-radius: 14px;
  background: #fbfdff;
}

.change-scope-tenant {
  border-color: #bfe4d2;
}

.change-scope-infra {
  border-color: #d9e2eb;
}

.change-scope-head {
  align-items: center;
  padding: 12px 14px;
  background: #f4f9fd;
  border-bottom: 1px solid #e0eaf3;
}

.change-scope-tenant .change-scope-head {
  background: #f2fbf7;
}

.change-scope-head > div {
  display: flex;
  align-items: center;
  gap: 10px;
}

.change-scope-head > div > strong {
  color: #0d426f;
  font-size: 12px;
}

.change-scope-head > span {
  color: #71879b;
  font-size: 10px;
}

.compact-empty {
  min-height: 74px;
  padding-block: 22px;
}

.cost-summary-five {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

.cost-check-provisional {
  background: #fff6dc !important;
  border-color: #edcf83 !important;
}

.cost-check-provisional strong,
.cost-check-provisional span {
  color: #8a5a00 !important;
}

.tenant-cost-hero {
  margin-bottom: 12px;
}

.tenant-cost-hero > div {
  padding: 16px 18px;
  border: 1px solid #bfe4cf;
  border-radius: 14px;
  background: linear-gradient(135deg, #f1fbf6, #ffffff);
}

.tenant-cost-hero small,
.tenant-cost-hero strong,
.tenant-cost-hero span {
  display: block;
}

.tenant-cost-hero small {
  color: #70869a;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .05em;
  font-weight: 700;
}

.tenant-cost-hero strong {
  margin-top: 4px;
  color: #0d704b;
  font-size: 28px;
  font-variant-numeric: tabular-nums;
}

.tenant-cost-hero span {
  margin-top: 4px;
  color: #6d8296;
  font-size: 10px;
}

.tenant-cost-split {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.activity-reason-callout {
  display: grid;
  grid-template-columns: 135px 1fr;
  align-items: center;
  gap: 16px;
  margin: 13px 0;
  padding: 13px 15px;
  border-radius: 13px;
  border: 1px solid #d9e6f1;
  background: #f7fbff;
}

.activity-reason-active {
  border-color: #bfe6d1;
  background: #f1fbf6;
}

.activity-reason-inactive {
  border-color: #dde5ec;
  background: #f7f9fb;
}

.activity-reason-callout small,
.activity-reason-callout strong {
  display: block;
}

.activity-reason-callout small {
  color: #758a9d;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.activity-reason-callout strong {
  margin-top: 3px;
  color: #0c6d49;
  font-size: 14px;
}

.activity-reason-inactive strong {
  color: #607588;
}

.activity-reason-callout p {
  margin: 0;
  color: #506a82;
  font-size: 11px;
  line-height: 1.5;
}

.tenant-evidence-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.tenant-activity-reason {
  margin-top: 8px !important;
  padding-top: 7px;
  border-top: 1px solid #e2ebf3;
  color: #61778c !important;
  line-height: 1.4;
}

.cost-source-breakdown-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.advanced-cost-breakdown {
  margin-top: 0;
  padding: 14px;
  border: 1px solid #dbe8f3;
  border-radius: 13px;
  background: #f8fbfe;
}

.advanced-cost-breakdown-head {
  margin-bottom: 10px;
}

.advanced-cost-breakdown-head > div > strong {
  color: #0d416f;
  font-size: 12px;
}

.advanced-cost-breakdown-head > div > p {
  margin: 3px 0 0;
  color: #72879a;
  font-size: 9.5px;
  line-height: 1.4;
}

.advanced-cost-breakdown-head > b {
  color: #0b4d84;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}

.tenant-category-allocation {
  margin-top: 14px;
}

@media (max-width: 1150px) {
  .cost-summary-five {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .tenant-evidence-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 850px) {
  .cost-summary-five,
  .tenant-cost-split,
  .tenant-evidence-grid,
  .cost-source-breakdown-grid {
    grid-template-columns: 1fr !important;
  }

  .activity-reason-callout {
    grid-template-columns: 1fr;
  }

  .container-change-values {
    grid-template-columns: 1fr;
  }
}



/* Azure Cost Management cache/rate-limit status — V15.4.1 */
.billing-review-note-soft {
  background: #f4f8fc;
  border-color: #d8e5f0;
  color: #5f768c;
}

.billing-review-note-soft strong {
  color: #244f73;
}


/* =====================================================================
   CampaignHub Container Analyzer V16.0
   Multi-view professional UI
   Views: Modern Clean / Executive Summary / Dark Premium
   ===================================================================== */

/* ---------- Change View control ---------- */
.view-dropdown {
  position: relative;
  margin: 0;
}

.view-dropdown > summary {
  list-style: none;
}

.view-dropdown > summary::-webkit-details-marker {
  display: none;
}

.view-dropdown-toggle {
  min-height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 10px;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.2;
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

.view-dropdown[open] .view-dropdown-toggle,
.view-dropdown-toggle:hover {
  background: rgba(255,255,255,.15);
  border-color: rgba(255,255,255,.35);
}

.view-toggle-icon {
  font-size: 14px;
  line-height: 1;
}

.view-dropdown[open] .nav-chevron {
  transform: rotate(180deg);
}

.view-dropdown-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: 286px;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 22px 55px rgba(8,34,70,.22);
  z-index: 80;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.view-dropdown-menu::before {
  content: "";
  position: absolute;
  top: -6px;
  right: 23px;
  width: 11px;
  height: 11px;
  border-left: 1px solid var(--line);
  border-top: 1px solid var(--line);
  background: inherit;
  transform: rotate(45deg);
}

.view-option {
  width: 100%;
  display: grid;
  grid-template-columns: 38px minmax(0,1fr) 22px;
  gap: 10px;
  align-items: center;
  padding: 10px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: #173b5e;
  text-align: left;
  cursor: pointer;
}

.view-option:hover,
.view-option.active {
  background: #eef6ff;
  color: #075fbd;
}

.view-option-icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border: 1px solid #d8e8f7;
  border-radius: 10px;
  background: #f5faff;
  color: #0876e8;
  font-size: 16px;
}

.view-option strong,
.view-option small {
  display: block;
}

.view-option strong {
  font-size: 12px;
  line-height: 1.25;
}

.view-option small {
  margin-top: 3px;
  color: #71859a;
  font-size: 9.5px;
  line-height: 1.3;
}

.view-option-check {
  opacity: 0;
  color: #0876e8;
  font-weight: 850;
}

.view-option.active .view-option-check {
  opacity: 1;
}

/* ---------- Shared dashboard layout engine ---------- */
.dashboard-page {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.dashboard-hero { order: 10; }
.dashboard-help { order: 20; }
.dashboard-metrics { order: 30; }
.dashboard-signals { order: 40; }
.dashboard-container-changes { order: 50; }
.dashboard-change-map { order: 60; }
.dashboard-billing { order: 70; }
.dashboard-storage-tenants { order: 80; }
.dashboard-monthly { order: 90; }
.dashboard-operations { order: 100; }
.dashboard-scans { order: 110; }

/* Keep the high-value tenant table wider than the compact container summary. */
.dashboard-storage-tenants {
  grid-template-columns: minmax(300px, .72fr) minmax(0, 1.48fr);
  align-items: stretch;
}

.dashboard-storage-tenants > .panel {
  height: 100%;
}

.storage-distribution-panel,
.tenant-monitoring-panel {
  min-width: 0;
}

.tenant-monitoring-panel .tenant-table-wrap {
  overflow-x: visible;
}

.tenant-monitoring-panel .tenant-monitoring-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}

.tenant-monitoring-panel .tenant-monitoring-table th,
.tenant-monitoring-panel .tenant-monitoring-table td {
  padding-left: 8px;
  padding-right: 8px;
  white-space: nowrap;
}

.tenant-monitoring-panel .tenant-monitoring-table th:nth-child(1),
.tenant-monitoring-panel .tenant-monitoring-table td:nth-child(1) { width: 15%; text-align: left; }
.tenant-monitoring-panel .tenant-monitoring-table th:nth-child(2),
.tenant-monitoring-panel .tenant-monitoring-table td:nth-child(2) { width: 17%; }
.tenant-monitoring-panel .tenant-monitoring-table th:nth-child(3),
.tenant-monitoring-panel .tenant-monitoring-table td:nth-child(3) { width: 15%; }
.tenant-monitoring-panel .tenant-monitoring-table th:nth-child(4),
.tenant-monitoring-panel .tenant-monitoring-table td:nth-child(4) { width: 12%; }
.tenant-monitoring-panel .tenant-monitoring-table th:nth-child(5),
.tenant-monitoring-panel .tenant-monitoring-table td:nth-child(5) { width: 18%; }
.tenant-monitoring-panel .tenant-monitoring-table th:nth-child(6),
.tenant-monitoring-panel .tenant-monitoring-table td:nth-child(6) { width: 23%; }

.tenant-monitoring-panel .tenant-monitoring-table th {
  font-size: 8.5px;
  letter-spacing: .05em;
}

/* =====================================================================
   VIEW 1 — MODERN CLEAN
   Balanced daily monitoring.
   ===================================================================== */
html[data-view="modern"] body.campaignhub-blue-theme {
  --bg: #f3f7fc;
  --surface: #ffffff;
  --surface-soft: #f7faff;
  --text: #183c60;
  --text-strong: #0b2f55;
  --muted: #6d8298;
  --line: #dbe7f2;
  --accent: #0876e8;
  --accent-dark: #075fbd;
  --accent-soft: #eaf4ff;
  --brand-teal: #0876e8;
  --teal: #3aaeff;
  --shadow: 0 10px 28px rgba(23,65,111,.075);
  background:
    radial-gradient(circle at 84% 0%, rgba(76,174,255,.10), transparent 30rem),
    linear-gradient(180deg, #f8fbff 0%, #f3f7fc 54%, #edf4fb 100%);
}

html[data-view="modern"] body.campaignhub-blue-theme::before,
html[data-view="modern"] body.campaignhub-blue-theme::after {
  display: none;
}

html[data-view="modern"] body.campaignhub-blue-theme .topbar,
html[data-view="executive"] body.campaignhub-blue-theme .topbar {
  min-height: 72px;
  padding: 0 22px;
  gap: 18px;
  background: rgba(255,255,255,.96);
  color: #153a60;
  border-bottom: 1px solid #dbe7f2;
  box-shadow: 0 5px 24px rgba(22,60,102,.08);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

html[data-view="modern"] body.campaignhub-blue-theme .campaignhub-brand,
html[data-view="executive"] body.campaignhub-blue-theme .campaignhub-brand {
  gap: 15px;
}

html[data-view="modern"] body.campaignhub-blue-theme .brand-logo-panel,
html[data-view="executive"] body.campaignhub-blue-theme .brand-logo-panel {
  padding: 7px 11px;
  border: 1px solid #e1e9f1;
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 5px 14px rgba(23,65,111,.07);
}

html[data-view="modern"] body.campaignhub-blue-theme .brand-official-logo,
html[data-view="executive"] body.campaignhub-blue-theme .brand-official-logo {
  width: 164px;
  filter: none;
}

html[data-view="modern"] body.campaignhub-blue-theme .brand-product,
html[data-view="executive"] body.campaignhub-blue-theme .brand-product {
  color: #12395f !important;
  text-shadow: none !important;
  font-size: 17px;
}

html[data-view="modern"] body.campaignhub-blue-theme .nav-dropdown-toggle,
html[data-view="executive"] body.campaignhub-blue-theme .nav-dropdown-toggle,
html[data-view="modern"] body.campaignhub-blue-theme .view-dropdown-toggle,
html[data-view="executive"] body.campaignhub-blue-theme .view-dropdown-toggle {
  color: #254b70;
  border-color: #d9e5f0;
  background: #f8fbff;
  box-shadow: none;
}

html[data-view="modern"] body.campaignhub-blue-theme .nav-dropdown-toggle:hover,
html[data-view="modern"] body.campaignhub-blue-theme .nav-dropdown[open] .nav-dropdown-toggle,
html[data-view="modern"] body.campaignhub-blue-theme .nav-dropdown[data-current="true"] .nav-dropdown-toggle,
html[data-view="executive"] body.campaignhub-blue-theme .nav-dropdown-toggle:hover,
html[data-view="executive"] body.campaignhub-blue-theme .nav-dropdown[open] .nav-dropdown-toggle,
html[data-view="executive"] body.campaignhub-blue-theme .nav-dropdown[data-current="true"] .nav-dropdown-toggle,
html[data-view="modern"] body.campaignhub-blue-theme .view-dropdown[open] .view-dropdown-toggle,
html[data-view="executive"] body.campaignhub-blue-theme .view-dropdown[open] .view-dropdown-toggle {
  color: #075fbd;
  border-color: #bcd7f3;
  background: #edf6ff;
}

html[data-view="modern"] body.campaignhub-blue-theme .timezone-form label,
html[data-view="executive"] body.campaignhub-blue-theme .timezone-form label {
  color: #6b8095;
}

html[data-view="modern"] body.campaignhub-blue-theme .timezone-form select,
html[data-view="executive"] body.campaignhub-blue-theme .timezone-form select {
  color: #173c61;
  border-color: #d9e5f0;
  background: #f8fbff;
  box-shadow: none;
}

html[data-view="modern"] body.campaignhub-blue-theme .page-shell {
  width: min(1600px, 100%);
  padding: 25px 28px 38px;
}

html[data-view="modern"] body.campaignhub-blue-theme .monitoring-hero {
  min-height: 144px;
  align-items: center;
  padding: 25px 29px;
  border-color: rgba(64,159,255,.25);
  border-radius: 20px;
  background:
    radial-gradient(circle at 83% 40%, rgba(108,196,255,.38), transparent 23rem),
    linear-gradient(118deg, #06488f 0%, #0876e8 61%, #70b7ff 140%);
  box-shadow: 0 16px 34px rgba(7,92,181,.18);
}

html[data-view="modern"] body.campaignhub-blue-theme .panel,
html[data-view="modern"] body.campaignhub-blue-theme .metric-card {
  border-color: #dbe7f2;
  box-shadow: 0 8px 24px rgba(20,65,113,.065);
}

html[data-view="modern"] body.campaignhub-blue-theme .metrics-6 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
}

html[data-view="modern"] body.campaignhub-blue-theme .metric-card {
  min-height: 96px;
  padding: 16px;
  border-radius: 15px;
}

html[data-view="modern"] body.campaignhub-blue-theme .metric-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
}

html[data-view="modern"] body.campaignhub-blue-theme .metric-card strong {
  font-size: clamp(18px, 1.55vw, 23px);
}

html[data-view="modern"] body.campaignhub-blue-theme .billing-overview {
  background:
    radial-gradient(circle at 100% 0%, rgba(48,163,255,.08), transparent 28rem),
    linear-gradient(180deg, #fff, #f9fcff);
}

html[data-view="modern"] body.campaignhub-blue-theme .container-change-card,
html[data-view="modern"] body.campaignhub-blue-theme .change-scope-box {
  box-shadow: none;
}

/* =====================================================================
   VIEW 2 — EXECUTIVE SUMMARY
   Costs and KPIs first, quieter operational detail.
   ===================================================================== */
html[data-view="executive"] body.campaignhub-blue-theme {
  --bg: #f5f8fc;
  --surface: #ffffff;
  --surface-soft: #f8faff;
  --text: #1c3a5d;
  --text-strong: #102c4e;
  --muted: #72839a;
  --line: #dde6f1;
  --accent: #096fe2;
  --accent-dark: #0759b9;
  --accent-soft: #edf5ff;
  --brand-teal: #096fe2;
  --teal: #4ca7ff;
  --shadow: 0 9px 25px rgba(21,52,90,.065);
  background:
    radial-gradient(circle at 50% -10%, rgba(80,167,255,.10), transparent 36rem),
    linear-gradient(180deg, #f8fbff, #f3f7fb 60%, #eef4fa);
}

html[data-view="executive"] body.campaignhub-blue-theme::before,
html[data-view="executive"] body.campaignhub-blue-theme::after {
  display: none;
}

html[data-view="executive"] body.campaignhub-blue-theme .page-shell {
  width: min(1680px, 100%);
  padding: 26px 32px 40px;
}

html[data-view="executive"] .dashboard-hero { order: 10; }
html[data-view="executive"] .dashboard-billing { order: 20; }
html[data-view="executive"] .dashboard-metrics { order: 30; }
html[data-view="executive"] .dashboard-storage-tenants { order: 40; }
html[data-view="executive"] .dashboard-signals { order: 50; }
html[data-view="executive"] .dashboard-container-changes { order: 60; }
html[data-view="executive"] .dashboard-change-map { order: 70; }
html[data-view="executive"] .dashboard-monthly { order: 80; }
html[data-view="executive"] .dashboard-operations { order: 90; }
html[data-view="executive"] .dashboard-scans { order: 100; }
html[data-view="executive"] .dashboard-help { order: 110; }

html[data-view="executive"] body.campaignhub-blue-theme .monitoring-hero {
  min-height: 154px;
  align-items: center;
  padding: 28px 30px;
  color: #102f53;
  border: 1px solid #d8e5f1;
  border-radius: 19px;
  background:
    radial-gradient(circle at 39% 55%, rgba(69,173,255,.13), transparent 18rem),
    linear-gradient(135deg, #ffffff 0%, #f6faff 70%, #edf6ff 100%);
  box-shadow: 0 10px 28px rgba(18,58,99,.07);
}

html[data-view="executive"] body.campaignhub-blue-theme .monitoring-hero .eyebrow {
  color: #0871e1;
}

html[data-view="executive"] body.campaignhub-blue-theme .monitoring-hero h1 {
  color: #102f53 !important;
  font-size: clamp(34px, 3.6vw, 48px);
  text-shadow: none;
}

html[data-view="executive"] body.campaignhub-blue-theme .monitoring-hero .hero-meta {
  color: #617990 !important;
  font-size: 12px;
}

html[data-view="executive"] body.campaignhub-blue-theme .last-scan {
  border-color: #d7e5f1;
  background: #fff;
  color: #173a5d;
  box-shadow: 0 5px 18px rgba(26,61,99,.06);
}

html[data-view="executive"] body.campaignhub-blue-theme .last-scan span {
  color: #71869b !important;
}

html[data-view="executive"] body.campaignhub-blue-theme .last-scan strong {
  color: #12395f !important;
  text-shadow: none;
}

html[data-view="executive"] body.campaignhub-blue-theme .last-scan .status-completed {
  color: #08714a !important;
  background: #e9f8f0;
  border-color: #bee8d3;
}

html[data-view="executive"] body.campaignhub-blue-theme .billing-overview {
  padding: 22px;
  border: 1px solid #d7e4f0;
  background:
    radial-gradient(circle at 0% 0%, rgba(32,126,232,.08), transparent 23rem),
    linear-gradient(180deg, #fff, #f8fbff);
  box-shadow: 0 11px 30px rgba(23,60,103,.075);
}

html[data-view="executive"] body.campaignhub-blue-theme .billing-overview .panel-head h2 {
  font-size: 20px;
}

html[data-view="executive"] body.campaignhub-blue-theme .billing-kpis {
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
}

html[data-view="executive"] body.campaignhub-blue-theme .billing-kpis > div {
  min-height: 98px;
  padding: 16px;
  border-radius: 14px;
}

html[data-view="executive"] body.campaignhub-blue-theme .billing-kpis > div:nth-child(1) {
  color: #fff;
  border-color: #0b55a9;
  background: linear-gradient(135deg, #123d79, #075fbd);
}

html[data-view="executive"] body.campaignhub-blue-theme .billing-kpis > div:nth-child(2) {
  border-color: #b9dfcb;
  background: linear-gradient(135deg, #edf9f2, #fafffc);
}

html[data-view="executive"] body.campaignhub-blue-theme .billing-kpis > div:nth-child(3) {
  border-color: #f0d6a5;
  background: linear-gradient(135deg, #fff7e8, #fffdf9);
}

html[data-view="executive"] body.campaignhub-blue-theme .billing-kpis > div:nth-child(4) {
  border-color: #ded1f4;
  background: linear-gradient(135deg, #f8f2ff, #fdfbff);
}

html[data-view="executive"] body.campaignhub-blue-theme .billing-kpis > div:nth-child(1) small,
html[data-view="executive"] body.campaignhub-blue-theme .billing-kpis > div:nth-child(1) strong,
html[data-view="executive"] body.campaignhub-blue-theme .billing-kpis > div:nth-child(1) em {
  color: #fff;
}

html[data-view="executive"] body.campaignhub-blue-theme .metrics-6 {
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 12px;
}

html[data-view="executive"] body.campaignhub-blue-theme .metric-card {
  min-height: 102px;
  padding: 17px;
  border-radius: 15px;
}

html[data-view="executive"] body.campaignhub-blue-theme .metric-card strong {
  font-size: clamp(19px, 1.6vw, 24px);
}

html[data-view="executive"] body.campaignhub-blue-theme .monitoring-strip {
  gap: 11px;
}

html[data-view="executive"] body.campaignhub-blue-theme .signal-card {
  border-color: #dce7f1;
  background: #fff;
  box-shadow: none;
}

html[data-view="executive"] body.campaignhub-blue-theme .dashboard-help {
  opacity: .88;
}

/* =====================================================================
   VIEW 3 — DARK PREMIUM
   Dense operations view with a premium navy visual system.
   ===================================================================== */
html[data-view="dark"] body.campaignhub-blue-theme {
  --bg: #061629;
  --surface: #0b2037;
  --surface-soft: #0e2945;
  --text: #d7e6f5;
  --text-strong: #f2f8ff;
  --muted: #8ba3bb;
  --line: #1a3a59;
  --brand-navy: #07182b;
  --brand-teal: #4aa5ff;
  --brand-cyan: #4bd5ff;
  --accent: #3698ff;
  --accent-dark: #1681ee;
  --accent-soft: rgba(54,152,255,.13);
  --teal: #35c6e8;
  --success: #42d58d;
  --danger: #ff5d72;
  --warning: #f6b849;
  --shadow: 0 14px 38px rgba(0,0,0,.26);
  background:
    radial-gradient(circle at 88% 0%, rgba(20,110,223,.20), transparent 31rem),
    radial-gradient(circle at 4% 88%, rgba(24,114,205,.13), transparent 27rem),
    linear-gradient(145deg, #041120 0%, #071a2e 48%, #061425 100%);
  color: var(--text);
}

html[data-view="dark"] body.campaignhub-blue-theme::before {
  display: block;
  opacity: .18;
  background:
    radial-gradient(circle at 50% 50%, transparent 0 31%, rgba(31,144,255,.27) 32% 43%, transparent 45%),
    radial-gradient(circle at 50% 50%, rgba(39,128,231,.12), transparent 68%);
}

html[data-view="dark"] body.campaignhub-blue-theme::after {
  display: block;
  opacity: .12;
}

html[data-view="dark"] body.campaignhub-blue-theme .topbar {
  min-height: 72px;
  padding: 0 22px;
  background:
    radial-gradient(circle at 52% -120%, rgba(41,143,255,.20), transparent 27rem),
    linear-gradient(105deg, rgba(4,18,34,.98), rgba(7,28,49,.98) 55%, rgba(5,20,38,.98));
  border-bottom: 1px solid #183957;
  box-shadow: 0 11px 31px rgba(0,0,0,.28);
}

html[data-view="dark"] body.campaignhub-blue-theme .brand-logo-panel {
  padding: 7px 11px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}

html[data-view="dark"] body.campaignhub-blue-theme .brand-official-logo {
  width: 164px;
  filter: none;
}

html[data-view="dark"] body.campaignhub-blue-theme .brand-product {
  color: #eef7ff !important;
  text-shadow: none !important;
  font-size: 17px;
}

html[data-view="dark"] body.campaignhub-blue-theme .page-shell {
  width: min(1720px, 100%);
  padding: 22px 24px 34px;
}

html[data-view="dark"] .dashboard-hero { order: 10; }
html[data-view="dark"] .dashboard-metrics { order: 20; }
html[data-view="dark"] .dashboard-storage-tenants { order: 30; }
html[data-view="dark"] .dashboard-signals { order: 40; }
html[data-view="dark"] .dashboard-container-changes { order: 50; }
html[data-view="dark"] .dashboard-billing { order: 60; }
html[data-view="dark"] .dashboard-change-map { order: 70; }
html[data-view="dark"] .dashboard-operations { order: 80; }
html[data-view="dark"] .dashboard-scans { order: 90; }
html[data-view="dark"] .dashboard-monthly { order: 100; }
html[data-view="dark"] .dashboard-help { order: 110; }

html[data-view="dark"] body.campaignhub-blue-theme .monitoring-hero {
  min-height: 126px;
  align-items: center;
  padding: 22px 25px;
  border: 1px solid #16436c;
  border-radius: 16px;
  background:
    linear-gradient(rgba(27,74,116,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(27,74,116,.08) 1px, transparent 1px),
    radial-gradient(circle at 92% 32%, rgba(43,145,255,.17), transparent 23rem),
    linear-gradient(118deg, #071a30, #0a2947);
  background-size: 30px 30px, 30px 30px, auto, auto;
  box-shadow: 0 13px 32px rgba(0,0,0,.25);
}

html[data-view="dark"] body.campaignhub-blue-theme .hero h1 {
  color: #f5f9ff !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .hero p,
html[data-view="dark"] body.campaignhub-blue-theme .monitoring-hero .hero-meta {
  color: #9ab2ca !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .eyebrow {
  color: #55b8ff;
}

html[data-view="dark"] body.campaignhub-blue-theme .last-scan {
  border-color: #245175;
  background: rgba(14,43,70,.78);
  color: #edf7ff;
  box-shadow: none;
}

html[data-view="dark"] body.campaignhub-blue-theme .last-scan span {
  color: #8cb5d8 !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .last-scan strong {
  color: #eef7ff !important;
  text-shadow: none;
}

html[data-view="dark"] body.campaignhub-blue-theme .panel,
html[data-view="dark"] body.campaignhub-blue-theme .metric-card {
  color: var(--text);
  border-color: #183b5b;
  background:
    linear-gradient(180deg, rgba(14,40,67,.96), rgba(8,29,50,.96));
  box-shadow: 0 11px 30px rgba(0,0,0,.20);
}

html[data-view="dark"] body.campaignhub-blue-theme .panel-head h2,
html[data-view="dark"] body.campaignhub-blue-theme .metric-card strong,
html[data-view="dark"] body.campaignhub-blue-theme .signal-card > strong,
html[data-view="dark"] body.campaignhub-blue-theme .billing-kpis strong,
html[data-view="dark"] body.campaignhub-blue-theme .health-list strong,
html[data-view="dark"] body.campaignhub-blue-theme td,
html[data-view="dark"] body.campaignhub-blue-theme td strong {
  color: #eaf4ff;
}

html[data-view="dark"] body.campaignhub-blue-theme .metrics-6 {
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 9px;
}

html[data-view="dark"] body.campaignhub-blue-theme .metric-card {
  min-height: 88px;
  padding: 14px;
  border-radius: 13px;
}

html[data-view="dark"] body.campaignhub-blue-theme .metric-icon {
  width: 40px;
  height: 40px;
  color: #6db9ff;
  border: 1px solid #1d4c76;
  background: rgba(36,123,210,.12);
  box-shadow: inset 0 0 18px rgba(24,118,224,.08);
}

html[data-view="dark"] body.campaignhub-blue-theme .shared-metric .metric-icon {
  color: #ffc65d;
  border-color: rgba(236,168,43,.27);
  background: rgba(236,168,43,.10);
}

html[data-view="dark"] body.campaignhub-blue-theme .metric-card strong {
  font-size: clamp(17px, 1.45vw, 22px);
}

html[data-view="dark"] body.campaignhub-blue-theme .metric-card small,
html[data-view="dark"] body.campaignhub-blue-theme .metric-card em,
html[data-view="dark"] body.campaignhub-blue-theme .muted {
  color: #89a1b9;
}

html[data-view="dark"] body.campaignhub-blue-theme .monitoring-strip {
  gap: 9px;
}

html[data-view="dark"] body.campaignhub-blue-theme .signal-card {
  min-height: 82px;
  padding: 13px 14px;
  border-color: #173957;
  background: linear-gradient(180deg, #0d2945, #0a2037);
  box-shadow: none;
}

html[data-view="dark"] body.campaignhub-blue-theme .signal-card > span,
html[data-view="dark"] body.campaignhub-blue-theme .signal-card > small {
  color: #829cb5;
}

html[data-view="dark"] body.campaignhub-blue-theme .billing-overview {
  border-color: #1a4163;
  background:
    radial-gradient(circle at 100% 0%, rgba(36,137,240,.11), transparent 25rem),
    linear-gradient(180deg, #0d2945, #091e34);
}

html[data-view="dark"] body.campaignhub-blue-theme .billing-kpis > div {
  border-color: #1b4263;
  background: rgba(12,39,65,.83);
}

html[data-view="dark"] body.campaignhub-blue-theme .billing-kpis small,
html[data-view="dark"] body.campaignhub-blue-theme .billing-kpis em {
  color: #8da5bd;
}

html[data-view="dark"] body.campaignhub-blue-theme .bar-track,
html[data-view="dark"] body.campaignhub-blue-theme .month-track,
html[data-view="dark"] body.campaignhub-blue-theme .mini-share {
  background: #173451;
}

html[data-view="dark"] body.campaignhub-blue-theme .bar-track span,
html[data-view="dark"] body.campaignhub-blue-theme .month-track span {
  background: linear-gradient(90deg, #2a8cff, #47c8ff);
}

html[data-view="dark"] body.campaignhub-blue-theme table,
html[data-view="dark"] body.campaignhub-blue-theme .table {
  color: #dbeafa;
}

html[data-view="dark"] body.campaignhub-blue-theme th,
html[data-view="dark"] body.campaignhub-blue-theme .file-table thead th {
  color: #829db7;
  border-bottom-color: #1a3a59;
  background: rgba(9,31,53,.54);
}

html[data-view="dark"] body.campaignhub-blue-theme td {
  border-bottom-color: #173653;
}

html[data-view="dark"] body.campaignhub-blue-theme tbody tr:hover {
  background: rgba(33,95,150,.13);
}

html[data-view="dark"] body.campaignhub-blue-theme .resource-link,
html[data-view="dark"] body.campaignhub-blue-theme .text-link,
html[data-view="dark"] body.campaignhub-blue-theme .tenant-identity strong {
  color: #59adff;
}

html[data-view="dark"] body.campaignhub-blue-theme .health-list {
  border-color: #1a3b59;
}

html[data-view="dark"] body.campaignhub-blue-theme .health-list > div {
  background: #0b2540;
}

html[data-view="dark"] body.campaignhub-blue-theme .container-change-card {
  border-color: #1c4262;
  background: linear-gradient(180deg, #0d2944, #092038);
}

html[data-view="dark"] body.campaignhub-blue-theme .container-change-tenant {
  border-color: #1d634e;
  background: linear-gradient(180deg, #0d2d38, #092637);
}

html[data-view="dark"] body.campaignhub-blue-theme .container-change-infra {
  border-color: #29425a;
  background: linear-gradient(180deg, #102941, #0a2137);
}

html[data-view="dark"] body.campaignhub-blue-theme .container-change-head strong,
html[data-view="dark"] body.campaignhub-blue-theme .container-change-values strong,
html[data-view="dark"] body.campaignhub-blue-theme .change-scope-head > div > strong {
  color: #e4f1ff;
}

html[data-view="dark"] body.campaignhub-blue-theme .container-change-values > div {
  border-color: #1a405f;
  background: #0a223a;
}

html[data-view="dark"] body.campaignhub-blue-theme .container-change-values small,
html[data-view="dark"] body.campaignhub-blue-theme .container-change-card > p,
html[data-view="dark"] body.campaignhub-blue-theme .change-scope-head > span {
  color: #829bb3;
}

html[data-view="dark"] body.campaignhub-blue-theme .change-scope-box {
  border-color: #1b405f;
  background: #0a2138;
}

html[data-view="dark"] body.campaignhub-blue-theme .change-scope-head {
  border-bottom-color: #1a3d5c;
  background: #0d2945;
}

html[data-view="dark"] body.campaignhub-blue-theme .change-scope-tenant .change-scope-head {
  background: #0d2c38;
}

html[data-view="dark"] body.campaignhub-blue-theme .scope-pill-tenant {
  color: #70e2b1;
  border-color: rgba(63,204,145,.28);
  background: rgba(31,156,106,.12);
}

html[data-view="dark"] body.campaignhub-blue-theme .scope-pill-infra {
  color: #a1b7ca;
  border-color: #2a4965;
  background: #102b44;
}

html[data-view="dark"] body.campaignhub-blue-theme .page-help {
  border-color: #193d5c;
  background: #0a2037;
}

html[data-view="dark"] body.campaignhub-blue-theme .page-help > summary {
  color: #86bfff;
}

html[data-view="dark"] body.campaignhub-blue-theme .page-help-grid > div {
  border-color: #193b59;
  background: #0c2742;
}

html[data-view="dark"] body.campaignhub-blue-theme .page-help-grid strong {
  color: #e3effb;
}

html[data-view="dark"] body.campaignhub-blue-theme .page-help-grid span {
  color: #8ba3bb;
}

html[data-view="dark"] body.campaignhub-blue-theme .term-help-popover,
html[data-view="dark"] body.campaignhub-blue-theme .nav-dropdown-menu,
html[data-view="dark"] body.campaignhub-blue-theme .view-dropdown-menu {
  color: #d7e7f7;
  border-color: #254764;
  background: rgba(8,29,49,.98);
  box-shadow: 0 24px 58px rgba(0,0,0,.42);
}

html[data-view="dark"] body.campaignhub-blue-theme .nav-dropdown-menu::before,
html[data-view="dark"] body.campaignhub-blue-theme .view-dropdown-menu::before {
  border-color: #254764;
  background: #0a2239;
}

html[data-view="dark"] body.campaignhub-blue-theme .nav-dropdown-menu a {
  color: #d7e7f7;
}

html[data-view="dark"] body.campaignhub-blue-theme .nav-dropdown-menu a:hover,
html[data-view="dark"] body.campaignhub-blue-theme .nav-dropdown-menu a.active {
  color: #84c6ff;
  background: rgba(44,129,211,.14);
}

html[data-view="dark"] body.campaignhub-blue-theme .view-option {
  color: #d7e7f7;
}

html[data-view="dark"] body.campaignhub-blue-theme .view-option:hover,
html[data-view="dark"] body.campaignhub-blue-theme .view-option.active {
  color: #8bcaff;
  background: rgba(44,129,211,.14);
}

html[data-view="dark"] body.campaignhub-blue-theme .view-option-icon {
  color: #78c1ff;
  border-color: #234b6c;
  background: #0e2b48;
}

html[data-view="dark"] body.campaignhub-blue-theme .view-option small {
  color: #829bb4;
}

html[data-view="dark"] body.campaignhub-blue-theme input,
html[data-view="dark"] body.campaignhub-blue-theme select,
html[data-view="dark"] body.campaignhub-blue-theme textarea {
  color: #dceafa;
  border-color: #244661;
  background: #0c2843;
}

html[data-view="dark"] body.campaignhub-blue-theme select option {
  color: #dceafa;
  background: #0c2843;
}

html[data-view="dark"] body.campaignhub-blue-theme .btn-secondary {
  color: #cfe3f7;
  border-color: #294c69;
  background: #102c48;
}

html[data-view="dark"] body.campaignhub-blue-theme code {
  color: #a8d7ff;
  background: #071a2d;
}

html[data-view="dark"] body.campaignhub-blue-theme .footer {
  color: #68849d;
}

/* Common compactness / professional alignment */
html[data-view="dark"] body.campaignhub-blue-theme .panel {
  border-radius: 14px;
  padding: 17px;
}

html[data-view="dark"] body.campaignhub-blue-theme .panel-head {
  margin-bottom: 12px;
}

html[data-view="dark"] body.campaignhub-blue-theme .panel-head h2 {
  font-size: 15px;
}

html[data-view="dark"] body.campaignhub-blue-theme th {
  padding-top: 10px;
  padding-bottom: 10px;
}

html[data-view="dark"] body.campaignhub-blue-theme td {
  padding-top: 10px;
  padding-bottom: 10px;
}

/* ---------- Responsive multi-view behavior ---------- */
@media (max-width: 1320px) {
  html[data-view="modern"] body.campaignhub-blue-theme .metrics-6,
  html[data-view="executive"] body.campaignhub-blue-theme .metrics-6,
  html[data-view="dark"] body.campaignhub-blue-theme .metrics-6 {
    grid-template-columns: repeat(3, minmax(0,1fr));
  }
}

@media (max-width: 1120px) {
  .dashboard-storage-tenants {
    grid-template-columns: 1fr;
  }

  .tenant-monitoring-panel .tenant-table-wrap {
    overflow-x: auto;
  }

  .tenant-monitoring-panel .tenant-monitoring-table {
    min-width: 760px;
    table-layout: auto;
  }

  .view-dropdown-toggle > span:nth-child(2) {
    display: none;
  }

  html[data-view="modern"] body.campaignhub-blue-theme .brand-product,
  html[data-view="executive"] body.campaignhub-blue-theme .brand-product,
  html[data-view="dark"] body.campaignhub-blue-theme .brand-product {
    display: none;
  }
}

@media (max-width: 900px) {
  html[data-view="modern"] body.campaignhub-blue-theme .topbar,
  html[data-view="executive"] body.campaignhub-blue-theme .topbar,
  html[data-view="dark"] body.campaignhub-blue-theme .topbar {
    padding-left: 14px;
    padding-right: 14px;
    gap: 10px;
  }

  html[data-view="modern"] body.campaignhub-blue-theme .brand-official-logo,
  html[data-view="executive"] body.campaignhub-blue-theme .brand-official-logo,
  html[data-view="dark"] body.campaignhub-blue-theme .brand-official-logo {
    width: 138px;
  }

  .view-dropdown-menu {
    position: fixed;
    top: 72px;
    right: 14px;
  }
}

@media (max-width: 760px) {
  html[data-view="modern"] body.campaignhub-blue-theme .metrics-6,
  html[data-view="executive"] body.campaignhub-blue-theme .metrics-6,
  html[data-view="dark"] body.campaignhub-blue-theme .metrics-6 {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

  html[data-view="modern"] body.campaignhub-blue-theme .page-shell,
  html[data-view="executive"] body.campaignhub-blue-theme .page-shell,
  html[data-view="dark"] body.campaignhub-blue-theme .page-shell {
    padding: 18px;
  }
}

@media (max-width: 560px) {
  html[data-view="modern"] body.campaignhub-blue-theme .metrics-6,
  html[data-view="executive"] body.campaignhub-blue-theme .metrics-6,
  html[data-view="dark"] body.campaignhub-blue-theme .metrics-6 {
    grid-template-columns: 1fr;
  }

  .view-dropdown-menu {
    left: 14px;
    right: 14px;
    width: auto;
  }
}


/* =====================================================================
   CampaignHub Container Analyzer V16.0.1
   Dark Premium contrast and cockpit correction
   ===================================================================== */

.dark-premium-kpis,
.dark-premium-rail {
  display: none;
}

/* ----- Dark Premium: target visual system ----- */
html[data-view="dark"] body.campaignhub-blue-theme {
  --bg: #041323;
  --surface: #0a2037;
  --surface-soft: #0c2843;
  --text: #dce9f6;
  --text-strong: #f4f8fd;
  --muted: #91a7bd;
  --line: #1c405f;
  --accent: #3b9dff;
  --accent-dark: #1c83ec;
  --accent-soft: rgba(50,151,255,.14);
  --success: #4bd696;
  --danger: #ff6377;
  --warning: #f5ba57;
  --shadow: 0 14px 34px rgba(0,0,0,.24);

  background:
    radial-gradient(circle at 83% -8%, rgba(19,112,219,.18), transparent 30rem),
    radial-gradient(circle at 4% 88%, rgba(24,111,204,.10), transparent 28rem),
    linear-gradient(145deg, #03101d 0%, #06172a 50%, #041423 100%);
}

html[data-view="dark"] body.campaignhub-blue-theme .page-shell {
  width: min(1740px, 100%);
  padding: 20px 22px 34px;
}

/* Hide the light-view KPI groups and replace them with the premium cockpit row. */
html[data-view="dark"] .dashboard-metrics,
html[data-view="dark"] .dashboard-signals {
  display: none !important;
}

html[data-view="dark"] .dark-premium-kpis {
  order: 20;
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 9px;
  margin: 0 0 14px;
}

.dark-kpi-card {
  min-width: 0;
  min-height: 94px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11px;
  border: 1px solid #1b4568;
  border-radius: 13px;
  background:
    radial-gradient(circle at 88% 8%, rgba(38,139,237,.10), transparent 8rem),
    linear-gradient(180deg, #0d2946, #091f36);
  box-shadow: 0 10px 25px rgba(0,0,0,.16);
}

.dark-kpi-card > div {
  min-width: 0;
}

.dark-kpi-card small,
.dark-kpi-card strong,
.dark-kpi-card em {
  display: block;
}

.dark-kpi-card small {
  color: #8fa9c0;
  font-size: 9.5px;
  line-height: 1.2;
  font-weight: 720;
  text-transform: uppercase;
  letter-spacing: .055em;
}

.dark-kpi-card strong {
  margin-top: 5px;
  color: #f4f8fd;
  font-size: clamp(15px, 1.1vw, 20px);
  line-height: 1.05;
  font-weight: 720;
  letter-spacing: -.025em;
  white-space: nowrap;
  overflow: visible;
  font-variant-numeric: tabular-nums lining-nums;
}

.dark-kpi-card em {
  margin-top: 4px;
  color: #728da6;
  font-size: 8.5px;
  line-height: 1.3;
  font-style: normal;
}

.dark-kpi-icon {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  color: #66b8ff;
  border: 1px solid #24577e;
  border-radius: 12px;
  background:
    radial-gradient(circle, rgba(62,158,255,.22), rgba(24,82,136,.10));
  box-shadow:
    inset 0 0 18px rgba(43,142,246,.10),
    0 0 20px rgba(30,123,220,.08);
  font-size: 17px;
  font-weight: 780;
}

.dark-kpi-icon-amber {
  color: #ffc55b;
  border-color: rgba(230,169,59,.34);
  background: rgba(211,142,25,.10);
}

.dark-kpi-change .dark-kpi-icon {
  color: #ff7184;
  border-color: rgba(255,91,113,.34);
  background: rgba(214,53,74,.10);
}

/* Hero proportions closer to the approved concept. */
html[data-view="dark"] body.campaignhub-blue-theme .monitoring-hero {
  min-height: 132px;
  margin-bottom: 12px;
  padding: 22px 27px;
  border: 1px solid #17466f;
  border-radius: 15px;
  background:
    linear-gradient(rgba(37,91,139,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(37,91,139,.07) 1px, transparent 1px),
    radial-gradient(circle at 89% 32%, rgba(55,153,255,.17), transparent 22rem),
    linear-gradient(118deg, #06182c, #0a2a48);
  background-size: 31px 31px, 31px 31px, auto, auto;
  box-shadow: 0 13px 30px rgba(0,0,0,.24);
}

html[data-view="dark"] body.campaignhub-blue-theme .monitoring-hero h1 {
  font-size: clamp(31px, 2.65vw, 41px);
}

html[data-view="dark"] body.campaignhub-blue-theme .monitoring-hero .hero-meta {
  max-width: 760px;
  color: #a0b4c8 !important;
  font-size: 12px;
}

html[data-view="dark"] body.campaignhub-blue-theme .last-scan {
  width: clamp(270px, 24vw, 350px);
  padding: 13px 16px;
  border-color: #245476;
  border-radius: 12px;
  background: linear-gradient(145deg, rgba(15,48,77,.93), rgba(10,39,66,.90));
}

/* Three-column first-screen content: containers / tenants / operations rail. */
html[data-view="dark"] .dashboard-storage-tenants {
  order: 30;
  grid-template-columns: minmax(245px, .82fr) minmax(520px, 1.58fr) minmax(285px, .90fr);
  gap: 12px;
  align-items: stretch;
  margin-bottom: 14px;
}

html[data-view="dark"] .dashboard-storage-tenants > .panel,
html[data-view="dark"] .dashboard-storage-tenants > .dark-premium-rail {
  margin-bottom: 0;
}

html[data-view="dark"] .dark-premium-rail {
  display: grid;
  grid-template-rows: 1fr 1fr;
  gap: 12px;
  min-width: 0;
}

html[data-view="dark"] .dark-rail-card {
  min-height: 0;
  margin: 0;
  padding: 14px;
  border-color: #1b4465;
  border-radius: 13px;
  background:
    radial-gradient(circle at 90% 0%, rgba(47,151,255,.09), transparent 12rem),
    linear-gradient(180deg, #0d2945, #091f36);
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
}

.dark-rail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.dark-rail-head h2 {
  margin: 3px 0 0;
}

.dark-rail-period {
  color: #728ba3;
  font-size: 8.5px;
  white-space: nowrap;
}

.dark-change-core {
  display: grid;
  grid-template-columns: minmax(112px, .95fr) minmax(105px, 1fr);
  align-items: center;
  gap: 11px;
  margin-top: 11px;
}

.dark-change-ring {
  width: min(126px, 100%);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  margin: 0 auto;
  border-radius: 50%;
  background:
    radial-gradient(circle at center, #0a2139 0 55%, transparent 56%),
    conic-gradient(from 215deg, #ff6076, #e94a65 65%, #922e48);
  box-shadow:
    0 0 0 1px rgba(255,96,118,.18),
    0 0 28px rgba(237,74,101,.14);
}

.dark-change-ring > div {
  width: 70%;
  text-align: center;
}

.dark-change-ring strong,
.dark-change-ring small {
  display: block;
}

.dark-change-ring strong {
  color: #ff7184;
  font-size: clamp(10px, .86vw, 14px);
  line-height: 1.08;
  font-weight: 750;
  font-variant-numeric: tabular-nums lining-nums;
  white-space: nowrap;
}

.dark-change-ring small {
  margin-top: 4px;
  color: #8ca4bc;
  font-size: 8px;
}

.dark-change-stats {
  display: grid;
  gap: 7px;
}

.dark-change-stats > div {
  padding: 9px 10px;
  border: 1px solid #1c4566;
  border-radius: 10px;
  background: #0a223b;
}

.dark-change-stats small,
.dark-change-stats strong {
  display: block;
}

.dark-change-stats small {
  color: #7f99b2;
  font-size: 8.5px;
}

.dark-change-stats strong {
  margin-top: 3px;
  color: #e9f3fd;
  font-size: 12px;
  font-variant-numeric: tabular-nums lining-nums;
}

.dark-rail-link {
  display: block;
  margin-top: 10px;
  padding-top: 9px;
  color: #69b7ff;
  border-top: 1px solid #173b59;
  text-align: center;
  text-decoration: none;
  font-size: 9.5px;
  font-weight: 650;
}

.dark-rail-link:hover {
  color: #a4d6ff;
}

.dark-cost-total {
  margin-top: 11px;
  padding: 11px 12px;
  border: 1px solid #1d4b70;
  border-radius: 11px;
  background: linear-gradient(135deg, rgba(32,104,177,.17), rgba(12,38,64,.45));
}

.dark-cost-total small,
.dark-cost-total strong,
.dark-cost-total span {
  display: block;
}

.dark-cost-total small {
  color: #8ba6bf;
  font-size: 8.5px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.dark-cost-total strong {
  margin-top: 4px;
  color: #f2f8ff;
  font-size: 21px;
  line-height: 1.05;
  font-weight: 740;
}

.dark-cost-total span {
  margin-top: 4px;
  color: #7f9ab3;
  font-size: 8px;
  line-height: 1.3;
}

.dark-cost-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 6px;
  margin-top: 7px;
}

.dark-cost-grid > div {
  min-width: 0;
  padding: 8px;
  border: 1px solid #173c5b;
  border-radius: 9px;
  background: #091f36;
}

.dark-cost-grid small,
.dark-cost-grid strong {
  display: block;
}

.dark-cost-grid small {
  color: #7892ab;
  font-size: 7.5px;
  line-height: 1.2;
}

.dark-cost-grid strong {
  margin-top: 3px;
  color: #e7f2fc;
  font-size: 10.5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Panel hierarchy and readable dark typography. */
html[data-view="dark"] body.campaignhub-blue-theme .panel {
  border-color: #1a4263;
  background:
    radial-gradient(circle at 100% 0%, rgba(42,137,228,.055), transparent 17rem),
    linear-gradient(180deg, #0c2844, #081f36);
}

html[data-view="dark"] body.campaignhub-blue-theme .panel-head h2,
html[data-view="dark"] body.campaignhub-blue-theme .panel h2 {
  color: #f2f7fc;
  font-size: 16px;
}

html[data-view="dark"] body.campaignhub-blue-theme .panel-subtitle,
html[data-view="dark"] body.campaignhub-blue-theme .muted,
html[data-view="dark"] body.campaignhub-blue-theme .bar-meta,
html[data-view="dark"] body.campaignhub-blue-theme .tiny-note,
html[data-view="dark"] body.campaignhub-blue-theme .panel-note {
  color: #8ba3ba !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .bar-label,
html[data-view="dark"] body.campaignhub-blue-theme .bar-label strong {
  color: #e9f3fd;
}

html[data-view="dark"] body.campaignhub-blue-theme .bar-row:hover {
  background: rgba(44,121,190,.10);
}

/* Critical contrast fix: no light table surfaces inside Dark Premium. */
html[data-view="dark"] body.campaignhub-blue-theme .table-wrap,
html[data-view="dark"] body.campaignhub-blue-theme .file-table-shell,
html[data-view="dark"] body.campaignhub-blue-theme .change-table-wrap {
  color: #dce9f6 !important;
  border-color: #1a4465 !important;
  background: #081e34 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.015);
}

html[data-view="dark"] body.campaignhub-blue-theme table,
html[data-view="dark"] body.campaignhub-blue-theme .table,
html[data-view="dark"] body.campaignhub-blue-theme .file-table {
  color: #dce9f6 !important;
  background: transparent !important;
}

html[data-view="dark"] body.campaignhub-blue-theme thead,
html[data-view="dark"] body.campaignhub-blue-theme thead tr,
html[data-view="dark"] body.campaignhub-blue-theme th,
html[data-view="dark"] body.campaignhub-blue-theme .file-table thead th {
  color: #94aac0 !important;
  border-bottom-color: #214762 !important;
  background: linear-gradient(180deg, #102d49, #0c2741) !important;
  box-shadow: none !important;
}

html[data-view="dark"] body.campaignhub-blue-theme tbody tr {
  color: #dce9f6 !important;
  background: #0a223a !important;
}

html[data-view="dark"] body.campaignhub-blue-theme tbody tr:nth-child(even) {
  background: #092038 !important;
}

html[data-view="dark"] body.campaignhub-blue-theme tbody tr:hover {
  background: #0e2d4b !important;
}

html[data-view="dark"] body.campaignhub-blue-theme td,
html[data-view="dark"] body.campaignhub-blue-theme td strong {
  color: #dce9f6 !important;
  border-bottom-color: #173b59 !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .tenant-monitoring-table td.right.strong,
html[data-view="dark"] body.campaignhub-blue-theme .tenant-monitoring-table td[data-tenant-cost] {
  color: #eaf4ff !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .tenant-identity strong,
html[data-view="dark"] body.campaignhub-blue-theme .resource-link,
html[data-view="dark"] body.campaignhub-blue-theme .text-link,
html[data-view="dark"] body.campaignhub-blue-theme .breadcrumbs a {
  color: #64b6ff !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .tenant-identity:hover strong,
html[data-view="dark"] body.campaignhub-blue-theme .resource-link:hover,
html[data-view="dark"] body.campaignhub-blue-theme .text-link:hover {
  color: #a6d7ff !important;
}

/* Status chips remain legible without bringing back white pills. */
html[data-view="dark"] body.campaignhub-blue-theme .status-badge {
  color: #b8cce0;
  border: 1px solid #2a4b68;
  background: #102b45;
}

html[data-view="dark"] body.campaignhub-blue-theme .status-badge.status-completed,
html[data-view="dark"] body.campaignhub-blue-theme .billing-status-ready,
html[data-view="dark"] body.campaignhub-blue-theme .billing-status-reconciled,
html[data-view="dark"] body.campaignhub-blue-theme .status-reconciled {
  color: #7ae2b4 !important;
  border-color: rgba(68,210,148,.30) !important;
  background: rgba(38,155,109,.13) !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .status-badge.status-failed,
html[data-view="dark"] body.campaignhub-blue-theme .billing-status-unavailable {
  color: #ff9aa7 !important;
  border-color: rgba(255,99,119,.30) !important;
  background: rgba(201,56,76,.13) !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .status-badge.status-running,
html[data-view="dark"] body.campaignhub-blue-theme .status-badge.status-preparing {
  color: #8cc9ff !important;
  border-color: rgba(72,159,242,.32) !important;
  background: rgba(44,125,206,.13) !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .status-badge.status-queued,
html[data-view="dark"] body.campaignhub-blue-theme .status-badge.status-partial,
html[data-view="dark"] body.campaignhub-blue-theme .status-badge.status-review,
html[data-view="dark"] body.campaignhub-blue-theme .billing-status-review,
html[data-view="dark"] body.campaignhub-blue-theme .billing-status-provisional,
html[data-view="dark"] body.campaignhub-blue-theme .status-provisional {
  color: #ffd47e !important;
  border-color: rgba(238,181,74,.30) !important;
  background: rgba(186,127,30,.13) !important;
}

/* Change cards and detail blocks. */
html[data-view="dark"] body.campaignhub-blue-theme .container-change-card {
  border-color: #1b4565;
  background: linear-gradient(180deg, #0c2944, #092139);
}

html[data-view="dark"] body.campaignhub-blue-theme .container-change-tenant {
  border-color: #22614f;
  background: linear-gradient(180deg, #0d2d3d, #09243a);
}

html[data-view="dark"] body.campaignhub-blue-theme .container-change-infra {
  border-color: #294a64;
  background: linear-gradient(180deg, #102a43, #092139);
}

html[data-view="dark"] body.campaignhub-blue-theme .container-change-values > div {
  border-color: #1b4363;
  background: #081f36;
}

html[data-view="dark"] body.campaignhub-blue-theme .container-change-head strong,
html[data-view="dark"] body.campaignhub-blue-theme .container-change-values strong,
html[data-view="dark"] body.campaignhub-blue-theme .change-scope-head > div > strong {
  color: #eaf4ff !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .container-change-values small,
html[data-view="dark"] body.campaignhub-blue-theme .container-change-card > p,
html[data-view="dark"] body.campaignhub-blue-theme .change-scope-head > span {
  color: #859eb6 !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .change-scope-box {
  border-color: #1b4564;
  background: #081f36;
}

html[data-view="dark"] body.campaignhub-blue-theme .change-scope-head {
  border-bottom-color: #1b4261;
  background: #0d2a46;
}

html[data-view="dark"] body.campaignhub-blue-theme .change-scope-tenant .change-scope-head {
  background: #0c2c3d;
}

/* Billing card, system health, recent scans, monthly activity. */
html[data-view="dark"] body.campaignhub-blue-theme .billing-overview {
  border-color: #1b4565;
  background:
    radial-gradient(circle at 100% 0%, rgba(45,145,240,.09), transparent 24rem),
    linear-gradient(180deg, #0c2945, #081f36);
}

html[data-view="dark"] body.campaignhub-blue-theme .billing-kpis > div,
html[data-view="dark"] body.campaignhub-blue-theme .monthly-summary > div {
  color: #dce9f6;
  border-color: #1c4565;
  background: #092139;
}

html[data-view="dark"] body.campaignhub-blue-theme .billing-kpis small,
html[data-view="dark"] body.campaignhub-blue-theme .billing-kpis em,
html[data-view="dark"] body.campaignhub-blue-theme .monthly-summary small {
  color: #8ba4bb;
}

html[data-view="dark"] body.campaignhub-blue-theme .billing-kpis strong,
html[data-view="dark"] body.campaignhub-blue-theme .monthly-summary strong {
  color: #eef6ff;
}

html[data-view="dark"] body.campaignhub-blue-theme .health-list {
  border-color: #1b4362;
}

html[data-view="dark"] body.campaignhub-blue-theme .health-list > div {
  color: #dce9f6;
  border-color: #173b59;
  background: #092139;
}

html[data-view="dark"] body.campaignhub-blue-theme .health-list span {
  color: #88a1b9;
}

html[data-view="dark"] body.campaignhub-blue-theme .trend-value,
html[data-view="dark"] body.campaignhub-blue-theme .trend-column small {
  color: #adc0d2;
}

html[data-view="dark"] body.campaignhub-blue-theme .trend-track,
html[data-view="dark"] body.campaignhub-blue-theme .bar-track,
html[data-view="dark"] body.campaignhub-blue-theme .month-track,
html[data-view="dark"] body.campaignhub-blue-theme .mini-share {
  background: #173854 !important;
}

/* Dark report/filter pages: remove remaining light islands. */
html[data-view="dark"] body.campaignhub-blue-theme input[type="search"],
html[data-view="dark"] body.campaignhub-blue-theme input[type="datetime-local"],
html[data-view="dark"] body.campaignhub-blue-theme input[type="text"],
html[data-view="dark"] body.campaignhub-blue-theme input[type="date"],
html[data-view="dark"] body.campaignhub-blue-theme select,
html[data-view="dark"] body.campaignhub-blue-theme textarea {
  color: #dce9f6 !important;
  border-color: #234965 !important;
  background: #0a243d !important;
}

html[data-view="dark"] body.campaignhub-blue-theme select option {
  color: #dce9f6;
  background: #0a243d;
}

html[data-view="dark"] body.campaignhub-blue-theme .billing-info-steps > div,
html[data-view="dark"] body.campaignhub-blue-theme .billing-detail-cards > div,
html[data-view="dark"] body.campaignhub-blue-theme .tenant-billing-card,
html[data-view="dark"] body.campaignhub-blue-theme .advanced-cost-breakdown,
html[data-view="dark"] body.campaignhub-blue-theme .cost-check-line,
html[data-view="dark"] body.campaignhub-blue-theme .report-accounting-note,
html[data-view="dark"] body.campaignhub-blue-theme .activity-reason-callout {
  color: #dce9f6 !important;
  border-color: #1b4564 !important;
  background: #092139 !important;
  box-shadow: none !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .billing-detail-cards strong,
html[data-view="dark"] body.campaignhub-blue-theme .tenant-billing-card-total,
html[data-view="dark"] body.campaignhub-blue-theme .advanced-cost-breakdown strong,
html[data-view="dark"] body.campaignhub-blue-theme .advanced-cost-breakdown-head > div > strong,
html[data-view="dark"] body.campaignhub-blue-theme .cost-check-line strong,
html[data-view="dark"] body.campaignhub-blue-theme .activity-reason-callout strong {
  color: #edf6ff !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .billing-detail-cards small,
html[data-view="dark"] body.campaignhub-blue-theme .billing-detail-cards span,
html[data-view="dark"] body.campaignhub-blue-theme .tenant-billing-card small,
html[data-view="dark"] body.campaignhub-blue-theme .tenant-billing-card > span,
html[data-view="dark"] body.campaignhub-blue-theme .advanced-cost-breakdown p,
html[data-view="dark"] body.campaignhub-blue-theme .advanced-cost-breakdown-head > div > p,
html[data-view="dark"] body.campaignhub-blue-theme .report-accounting-note,
html[data-view="dark"] body.campaignhub-blue-theme .activity-reason-callout p {
  color: #8ba3ba !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .cost-table .subtotal-row td {
  color: #dce9f6 !important;
  background: #0c2943 !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .cost-table .grand-total-row td {
  color: #8ed2ff !important;
  border-top-color: #25597c !important;
  background: #0d304c !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .unassigned-row {
  background: #2b2519 !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .billing-review-note,
html[data-view="dark"] body.campaignhub-blue-theme .billing-review-note-soft {
  color: #d5c28b !important;
  border-color: #5d4d27 !important;
  background: #2a2418 !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .billing-callout,
html[data-view="dark"] body.campaignhub-blue-theme .billing-callout-success {
  color: #a8d8c3 !important;
  border-color: #285d4a !important;
  background: #0c2d28 !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .billing-callout strong {
  color: #79deb2 !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .term-help > summary {
  color: #79beff;
  border-color: #285678;
  background: #0e2c48;
}

html[data-view="dark"] body.campaignhub-blue-theme .term-help-popover strong {
  color: #dceeff;
}

html[data-view="dark"] body.campaignhub-blue-theme .term-help-popover p {
  color: #91a7bd;
}

html[data-view="dark"] body.campaignhub-blue-theme .scan-card,
html[data-view="dark"] body.campaignhub-blue-theme .scan-card.scan-queued,
html[data-view="dark"] body.campaignhub-blue-theme .scan-card.scan-failed,
html[data-view="dark"] body.campaignhub-blue-theme .scan-card.scan-interrupted {
  color: #dce9f6;
  border-color: #1c4869;
  background: #0b2945;
}

html[data-view="dark"] body.campaignhub-blue-theme .scan-detail,
html[data-view="dark"] body.campaignhub-blue-theme .scan-grid small {
  color: #8fa7bd;
}

/* Keep detail sections below the cockpit, matching the mockup first screen
   without removing any information from the analyzer. */
html[data-view="dark"] .dashboard-container-changes { order: 40; }
html[data-view="dark"] .dashboard-billing { order: 50; }
html[data-view="dark"] .dashboard-change-map { order: 60; }
html[data-view="dark"] .dashboard-operations { order: 70; }
html[data-view="dark"] .dashboard-scans { order: 80; }
html[data-view="dark"] .dashboard-monthly { order: 90; }
html[data-view="dark"] .dashboard-help { order: 100; }

/* Responsive dark cockpit. */
@media (max-width: 1280px) {
  html[data-view="dark"] .dark-premium-kpis {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  html[data-view="dark"] .dashboard-storage-tenants {
    grid-template-columns: minmax(250px, .85fr) minmax(480px, 1.55fr);
  }

  html[data-view="dark"] .dark-premium-rail {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
  }
}

@media (max-width: 1120px) {
  html[data-view="dark"] .dashboard-storage-tenants {
    grid-template-columns: 1fr;
  }

  html[data-view="dark"] .dark-premium-rail {
    grid-column: auto;
  }
}

@media (max-width: 860px) {
  html[data-view="dark"] .dark-premium-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  html[data-view="dark"] .dark-premium-rail {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  html[data-view="dark"] .dark-premium-kpis {
    grid-template-columns: 1fr;
  }
}


/* =====================================================================
   CampaignHub Container Analyzer V16.0.2
   Modern Clean replacement — reference light dashboard layout
   ===================================================================== */

.modern-clean-summary,
.modern-clean-primary,
.modern-clean-insights,
.modern-clean-bottom {
  display: none;
}

html[data-view="modern"] .modern-clean-summary,
html[data-view="modern"] .modern-clean-primary,
html[data-view="modern"] .modern-clean-insights,
html[data-view="modern"] .modern-clean-bottom {
  display: grid;
}

/* Replace the original Modern Clean top-level blocks with the new reference layout. */
html[data-view="modern"] .dashboard-metrics,
html[data-view="modern"] .dashboard-signals,
html[data-view="modern"] .dashboard-billing,
html[data-view="modern"] .dashboard-storage-tenants,
html[data-view="modern"] .dashboard-operations,
html[data-view="modern"] .dashboard-scans,
html[data-view="modern"] .dashboard-monthly {
  display: none !important;
}

html[data-view="modern"] .dashboard-hero { order: 10; }
html[data-view="modern"] .modern-clean-summary { order: 20; }
html[data-view="modern"] .modern-clean-primary { order: 30; }
html[data-view="modern"] .modern-clean-insights { order: 40; }
html[data-view="modern"] .modern-clean-bottom { order: 50; }
html[data-view="modern"] .dashboard-container-changes { order: 60; }
html[data-view="modern"] .dashboard-change-map { order: 70; }
html[data-view="modern"] .dashboard-help { order: 80; }

/* Main canvas */
html[data-view="modern"] body.campaignhub-blue-theme {
  --bg: #f4f8fd;
  --surface: #ffffff;
  --surface-soft: #f7faff;
  --text: #173c61;
  --text-strong: #0a2e55;
  --muted: #70849a;
  --line: #dce7f2;
  --accent: #0877ed;
  --accent-dark: #075fc3;
  --accent-soft: #edf6ff;
  --brand-teal: #0877ed;
  --teal: #36abff;
  --shadow: 0 8px 24px rgba(27,69,117,.065);
  background:
    radial-gradient(circle at 88% -5%, rgba(93,179,255,.13), transparent 32rem),
    linear-gradient(180deg, #f9fbff 0%, #f5f8fc 48%, #eef5fb 100%);
}

html[data-view="modern"] body.campaignhub-blue-theme .page-shell {
  width: min(1680px, 100%);
  padding: 22px 22px 36px;
}

/* Hero closely follows the approved light reference. */
html[data-view="modern"] body.campaignhub-blue-theme .monitoring-hero {
  position: relative;
  min-height: 166px;
  align-items: center;
  margin-bottom: 14px;
  padding: 27px 34px;
  overflow: hidden;
  border: 1px solid rgba(61,153,248,.26);
  border-radius: 18px;
  background:
    radial-gradient(circle at 74% 48%, rgba(133,204,255,.34), transparent 16rem),
    radial-gradient(circle at 92% 20%, rgba(139,191,255,.40), transparent 24rem),
    linear-gradient(116deg, #064991 0%, #0877ed 57%, #71b5ff 135%);
  box-shadow: 0 13px 31px rgba(13,93,185,.16);
}

html[data-view="modern"] body.campaignhub-blue-theme .monitoring-hero::before,
html[data-view="modern"] body.campaignhub-blue-theme .monitoring-hero::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border: 1px solid rgba(255,255,255,.12);
  transform: rotate(30deg);
}

html[data-view="modern"] body.campaignhub-blue-theme .monitoring-hero::before {
  width: 78px;
  height: 78px;
  right: 42%;
  top: 30px;
  border-radius: 12px;
  box-shadow:
    50px 23px 0 -1px rgba(255,255,255,.035),
    95px -11px 0 -1px rgba(255,255,255,.025);
}

html[data-view="modern"] body.campaignhub-blue-theme .monitoring-hero::after {
  width: 210px;
  height: 210px;
  right: -68px;
  bottom: -115px;
  border-radius: 34px;
}

html[data-view="modern"] body.campaignhub-blue-theme .monitoring-hero h1 {
  color: #fff !important;
  font-size: clamp(30px, 3vw, 40px);
  letter-spacing: -.035em;
  text-shadow: 0 2px 12px rgba(0,48,111,.18);
}

html[data-view="modern"] body.campaignhub-blue-theme .monitoring-hero .hero-meta {
  max-width: 590px;
  color: #e9f5ff !important;
  font-size: 12px;
  line-height: 1.55;
}

html[data-view="modern"] body.campaignhub-blue-theme .monitoring-hero .eyebrow {
  color: #cceaff;
}

html[data-view="modern"] body.campaignhub-blue-theme .last-scan {
  z-index: 1;
  width: clamp(280px, 26vw, 360px);
  padding: 16px 18px;
  border-color: rgba(213,240,255,.30);
  border-radius: 14px;
  background: rgba(255,255,255,.11);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

html[data-view="modern"] body.campaignhub-blue-theme .last-scan span {
  color: #d5efff !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .last-scan strong {
  color: #fff !important;
  font-size: 14px;
  text-shadow: none;
}

html[data-view="modern"] body.campaignhub-blue-theme .last-scan .status-completed {
  color: #e7fff2 !important;
  background: rgba(24,181,106,.35);
  border-color: rgba(149,242,192,.40);
}

/* Ten compact KPI cards: five by two on wide screens. */
html[data-view="modern"] .modern-clean-summary {
  grid-template-columns: repeat(5, minmax(0,1fr));
  gap: 12px;
  margin: 0 0 14px;
}

html[data-view="modern"] .modern-kpi-card {
  min-width: 0;
  min-height: 88px;
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 14px 15px;
  border: 1px solid #dce7f2;
  border-radius: 14px;
  background: linear-gradient(180deg, #fff, #fbfdff);
  box-shadow: 0 6px 18px rgba(24,65,111,.055);
}

html[data-view="modern"] .modern-kpi-icon {
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid #d8e9fb;
  border-radius: 50%;
  background: #eef6ff;
  color: #0878ed;
  font-size: 18px;
  font-weight: 800;
}

html[data-view="modern"] .modern-kpi-card > div {
  min-width: 0;
}

html[data-view="modern"] .modern-kpi-card small,
html[data-view="modern"] .modern-kpi-card strong,
html[data-view="modern"] .modern-kpi-card em {
  display: block;
}

html[data-view="modern"] .modern-kpi-card small {
  margin-bottom: 4px;
  color: #5d7690;
  font-size: 9.5px;
  font-weight: 720;
}

html[data-view="modern"] .modern-kpi-card strong {
  color: #0d3158;
  font-size: clamp(18px, 1.45vw, 23px);
  line-height: 1.08;
  letter-spacing: -.02em;
  overflow-wrap: anywhere;
}

html[data-view="modern"] .modern-kpi-card em {
  margin-top: 5px;
  color: #7d90a4;
  font-size: 8.5px;
  font-style: normal;
  line-height: 1.25;
}

html[data-view="modern"] .modern-kpi-shared .modern-kpi-icon {
  color: #6f94b8;
  background: #f1f6fb;
  border-color: #dce7f1;
}

html[data-view="modern"] .modern-kpi-change .modern-kpi-icon {
  color: #e23b4a;
  background: #fff1f2;
  border-color: #ffd7dc;
}

html[data-view="modern"] .modern-kpi-cost .modern-kpi-icon {
  color: #079566;
  background: #edf9f4;
  border-color: #d3eee3;
}

/* Main storage / tenant tables */
html[data-view="modern"] .modern-clean-primary {
  grid-template-columns: minmax(430px, .98fr) minmax(560px, 1.02fr);
  gap: 14px;
  margin-bottom: 14px;
}

html[data-view="modern"] .modern-clean-primary > .panel,
html[data-view="modern"] .modern-clean-insights > .panel,
html[data-view="modern"] .modern-clean-bottom > .panel {
  height: 100%;
  margin-bottom: 0;
  padding: 18px;
  border: 1px solid #dbe6f1;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 7px 21px rgba(28,68,112,.055);
}

html[data-view="modern"] .modern-clean-primary .panel-head,
html[data-view="modern"] .modern-clean-insights .panel-head,
html[data-view="modern"] .modern-clean-bottom .panel-head {
  align-items: center;
  margin-bottom: 12px;
}

html[data-view="modern"] .modern-clean-primary .panel-head h2,
html[data-view="modern"] .modern-clean-insights .panel-head h2,
html[data-view="modern"] .modern-clean-bottom .panel-head h2 {
  margin-top: 2px;
  color: #0d3158;
  font-size: 15px;
}

html[data-view="modern"] .modern-table-wrap {
  overflow: hidden;
  border: 1px solid #e2ebf4;
  border-radius: 10px;
}

html[data-view="modern"] .modern-data-table {
  width: 100%;
  table-layout: auto;
  background: #fff;
}

html[data-view="modern"] .modern-data-table th {
  padding: 9px 10px;
  color: #698199;
  border-bottom: 1px solid #dde8f2;
  background: #f5f9fd;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .055em;
}

html[data-view="modern"] .modern-data-table td {
  padding: 10px;
  color: #1b4268;
  border-bottom-color: #e6eef6;
  font-size: 10.5px;
}

html[data-view="modern"] .modern-data-table tbody tr:last-child td {
  border-bottom: 0;
}

html[data-view="modern"] .modern-data-table tbody tr:hover {
  background: #f7fbff;
}

html[data-view="modern"] .modern-share-cell {
  display: grid;
  grid-template-columns: minmax(80px,1fr) auto;
  align-items: center;
  gap: 7px;
  min-width: 126px;
}

html[data-view="modern"] .modern-share-cell .mini-share {
  height: 7px;
  background: #e7eef7;
}

html[data-view="modern"] .modern-share-cell .mini-share span {
  background: linear-gradient(90deg, #0b7df2, #54b3ff);
}

html[data-view="modern"] .modern-share-cell small {
  color: #5f7790;
  font-size: 9px;
}

html[data-view="modern"] .modern-tenant-table {
  table-layout: fixed;
}

html[data-view="modern"] .modern-tenant-table th:nth-child(1),
html[data-view="modern"] .modern-tenant-table td:nth-child(1) { width: 15%; }
html[data-view="modern"] .modern-tenant-table th:nth-child(2),
html[data-view="modern"] .modern-tenant-table td:nth-child(2) { width: 16%; }
html[data-view="modern"] .modern-tenant-table th:nth-child(3),
html[data-view="modern"] .modern-tenant-table td:nth-child(3) { width: 15%; }
html[data-view="modern"] .modern-tenant-table th:nth-child(4),
html[data-view="modern"] .modern-tenant-table td:nth-child(4) { width: 13%; }
html[data-view="modern"] .modern-tenant-table th:nth-child(5),
html[data-view="modern"] .modern-tenant-table td:nth-child(5) { width: 18%; }
html[data-view="modern"] .modern-tenant-table th:nth-child(6),
html[data-view="modern"] .modern-tenant-table td:nth-child(6) { width: 23%; }

/* Analytics row */
html[data-view="modern"] .modern-clean-insights {
  grid-template-columns: minmax(300px, .86fr) minmax(360px, 1.22fr) minmax(330px, 1.02fr);
  gap: 14px;
  margin-bottom: 14px;
}

html[data-view="modern"] .modern-change-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
}

html[data-view="modern"] .modern-change-grid > div {
  min-height: 92px;
  padding: 13px 14px;
  border: 1px solid #e3ebf4;
  border-radius: 11px;
  background: #fbfdff;
}

html[data-view="modern"] .modern-change-grid small,
html[data-view="modern"] .modern-change-grid strong {
  display: block;
}

html[data-view="modern"] .modern-change-grid small {
  color: #6f8499;
  font-size: 9px;
}

html[data-view="modern"] .modern-change-grid strong {
  margin-top: 10px;
  font-size: 21px;
  letter-spacing: -.02em;
}

html[data-view="modern"] .modern-change-meta {
  margin-top: 10px;
  color: #778ba0;
  font-size: 9px;
}

html[data-view="modern"] .modern-chart-shell {
  position: relative;
  height: 150px;
  overflow: hidden;
  border: 1px solid #e2ebf3;
  border-radius: 11px;
  background:
    linear-gradient(#edf3f8 1px, transparent 1px),
    linear-gradient(90deg, #edf3f8 1px, transparent 1px),
    #fbfdff;
  background-size: 100% 37px, 86px 100%, auto;
}

html[data-view="modern"] .modern-line-chart {
  width: 100%;
  height: 100%;
  overflow: visible;
}

html[data-view="modern"] .modern-chart-line {
  fill: none;
  stroke: #0878ed;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

html[data-view="modern"] .modern-chart-area {
  fill: url(#modernStorageArea);
}

html[data-view="modern"] .modern-chart-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #8799aa;
  font-size: 10px;
}

html[data-view="modern"] .modern-chart-empty[hidden] {
  display: none;
}

html[data-view="modern"] .modern-cost-hero small,
html[data-view="modern"] .modern-cost-hero strong,
html[data-view="modern"] .modern-cost-hero span {
  display: block;
}

html[data-view="modern"] .modern-cost-hero small {
  color: #71859a;
  font-size: 9px;
}

html[data-view="modern"] .modern-cost-hero strong {
  margin-top: 3px;
  color: #0e3157;
  font-size: 25px;
  letter-spacing: -.025em;
}

html[data-view="modern"] .modern-cost-hero span {
  margin-top: 4px;
  color: #73879a;
  font-size: 8.5px;
  line-height: 1.3;
}

html[data-view="modern"] .modern-cost-stack {
  height: 9px;
  display: flex;
  margin: 15px 0 13px;
  overflow: hidden;
  border-radius: 999px;
  background: #edf2f7;
}

html[data-view="modern"] .modern-cost-segment {
  display: block;
  width: 0;
  height: 100%;
  transition: width .25s ease;
}

html[data-view="modern"] .modern-cost-own { background: #0878ed; }
html[data-view="modern"] .modern-cost-shared { background: #19a875; }
html[data-view="modern"] .modern-cost-residual { background: #9a73e8; }

html[data-view="modern"] .modern-cost-legend {
  display: grid;
  gap: 7px;
}

html[data-view="modern"] .modern-cost-legend > div {
  display: grid;
  grid-template-columns: 9px minmax(0,1fr) auto;
  align-items: center;
  gap: 7px;
  color: #637b92;
  font-size: 9px;
}

html[data-view="modern"] .modern-cost-legend strong {
  color: #153b61;
  font-size: 10px;
}

html[data-view="modern"] .modern-cost-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
}

/* Bottom inventory / recent-scans row */
html[data-view="modern"] .modern-clean-bottom {
  grid-template-columns: minmax(320px, .78fr) minmax(620px, 1.52fr);
  gap: 14px;
  margin-bottom: 14px;
}

html[data-view="modern"] .modern-inventory-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 9px;
}

html[data-view="modern"] .modern-inventory-grid > div {
  min-width: 0;
  min-height: 82px;
  padding: 12px;
  border: 1px solid #e1eaf3;
  border-radius: 11px;
  background: #f9fcff;
}

html[data-view="modern"] .modern-inventory-grid small,
html[data-view="modern"] .modern-inventory-grid strong {
  display: block;
}

html[data-view="modern"] .modern-inventory-grid small {
  color: #70859a;
  font-size: 8.5px;
}

html[data-view="modern"] .modern-inventory-grid strong {
  margin-top: 8px;
  color: #10345b;
  font-size: 18px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

html[data-view="modern"] .modern-recent-scans .modern-table-wrap {
  max-height: 256px;
  overflow-y: auto;
}

/* The technical evidence remains below the approved dashboard layout. */
html[data-view="modern"] .dashboard-container-changes,
html[data-view="modern"] .dashboard-change-map {
  margin-top: 0;
}

html[data-view="modern"] .dashboard-container-changes .panel-subtitle,
html[data-view="modern"] .dashboard-change-map .panel-subtitle {
  max-width: 900px;
}

/* Responsive */
@media (max-width: 1380px) {
  html[data-view="modern"] .modern-clean-summary {
    grid-template-columns: repeat(5, minmax(0,1fr));
  }

  html[data-view="modern"] .modern-clean-primary {
    grid-template-columns: minmax(360px, .88fr) minmax(520px, 1.12fr);
  }
}

@media (max-width: 1180px) {
  html[data-view="modern"] .modern-clean-summary {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

  html[data-view="modern"] .modern-clean-primary,
  html[data-view="modern"] .modern-clean-bottom {
    grid-template-columns: 1fr;
  }

  html[data-view="modern"] .modern-clean-insights {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }

  html[data-view="modern"] .modern-cost-card {
    grid-column: 1 / -1;
  }

  html[data-view="modern"] .modern-table-wrap {
    overflow-x: auto;
  }

  html[data-view="modern"] .modern-data-table {
    min-width: 700px;
  }
}

@media (max-width: 760px) {
  html[data-view="modern"] .modern-clean-summary,
  html[data-view="modern"] .modern-clean-insights,
  html[data-view="modern"] .modern-inventory-grid {
    grid-template-columns: 1fr;
  }

  html[data-view="modern"] .modern-cost-card {
    grid-column: auto;
  }

  html[data-view="modern"] body.campaignhub-blue-theme .monitoring-hero {
    padding: 22px;
  }
}

/* =====================================================================
   CampaignHub Container Analyzer V16.0.4
   Light-theme footer and Dashboard Help visibility correction
   Dark Premium intentionally unchanged.
   ===================================================================== */

/* Modern Clean — Dashboard Help */
html[data-view="modern"] body.campaignhub-blue-theme .dashboard-help {
  color: #1f3f64 !important;
  border-color: #cddfed !important;
  background: rgba(248, 251, 255, 0.94) !important;
  opacity: 1 !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .dashboard-help > summary {
  color: #315875 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .dashboard-help > summary::marker {
  color: #315875 !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .dashboard-help .page-help-grid {
  color: #294d70 !important;
  opacity: 1 !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .dashboard-help .page-help-grid > div {
  color: #294d70 !important;
  border-color: #dce7f1 !important;
  background: #ffffff !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .dashboard-help .page-help-grid strong {
  color: #153b61 !important;
  opacity: 1 !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .dashboard-help .page-help-grid span {
  color: #627b92 !important;
  opacity: 1 !important;
}

/* Executive Summary — Dashboard Help */
html[data-view="executive"] body.campaignhub-blue-theme .dashboard-help {
  color: #1f3f64 !important;
  border-color: #cddfed !important;
  background: rgba(248, 251, 255, 0.94) !important;
  opacity: 1 !important;
}

html[data-view="executive"] body.campaignhub-blue-theme .dashboard-help > summary {
  color: #315875 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

html[data-view="executive"] body.campaignhub-blue-theme .dashboard-help > summary::marker {
  color: #315875 !important;
}

html[data-view="executive"] body.campaignhub-blue-theme .dashboard-help .page-help-grid {
  color: #294d70 !important;
  opacity: 1 !important;
}

html[data-view="executive"] body.campaignhub-blue-theme .dashboard-help .page-help-grid > div {
  color: #294d70 !important;
  border-color: #dce7f1 !important;
  background: #ffffff !important;
}

html[data-view="executive"] body.campaignhub-blue-theme .dashboard-help .page-help-grid strong {
  color: #153b61 !important;
  opacity: 1 !important;
}

html[data-view="executive"] body.campaignhub-blue-theme .dashboard-help .page-help-grid span {
  color: #627b92 !important;
  opacity: 1 !important;
}

/* Modern Clean — application footer */
html[data-view="modern"] body.campaignhub-blue-theme .footer {
  position: relative;
  z-index: 1;
  color: #607891 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  padding-top: 22px;
  padding-bottom: 30px;
}

html[data-view="modern"] body.campaignhub-blue-theme .footer a,
html[data-view="modern"] body.campaignhub-blue-theme .footer strong,
html[data-view="modern"] body.campaignhub-blue-theme .footer span {
  color: #4f6983 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

/* Executive Summary — application footer */
html[data-view="executive"] body.campaignhub-blue-theme .footer {
  position: relative;
  z-index: 1;
  color: #607891 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  padding-top: 22px;
  padding-bottom: 30px;
}

html[data-view="executive"] body.campaignhub-blue-theme .footer a,
html[data-view="executive"] body.campaignhub-blue-theme .footer strong,
html[data-view="executive"] body.campaignhub-blue-theme .footer span {
  color: #4f6983 !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

/* Preserve Dark Premium exactly as it is. */

/* =====================================================================
   CampaignHub Container Analyzer V16.0.5
   Dark Premium live-scan contrast correction
   Light themes intentionally unchanged.
   ===================================================================== */

/* Main running / queued / failed scan panel */
html[data-view="dark"] body.campaignhub-blue-theme .scan-card,
html[data-view="dark"] body.campaignhub-blue-theme .scan-card.scan-queued,
html[data-view="dark"] body.campaignhub-blue-theme .scan-card.scan-failed,
html[data-view="dark"] body.campaignhub-blue-theme .scan-card.scan-interrupted {
  color: #e6f1fb !important;
  border-color: #23577b !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(49,151,255,.10), transparent 22rem),
    linear-gradient(180deg, #0d304f 0%, #0a2945 100%) !important;
  box-shadow:
    0 12px 28px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
}

/* Scan heading and active-container description */
html[data-view="dark"] body.campaignhub-blue-theme .scan-title {
  color: #f3f8fd !important;
  font-weight: 780 !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .scan-detail {
  color: #9eb5ca !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .scan-detail strong {
  color: #dcecff !important;
  font-weight: 720 !important;
}

/* Running / queued status pill */
html[data-view="dark"] body.campaignhub-blue-theme .status-pill {
  color: #8dcbff !important;
  border: 1px solid #2a648f !important;
  background: #123d60 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .status-pill.status-running {
  color: #8ed0ff !important;
  border-color: #2a6a9b !important;
  background: #123f66 !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .status-pill.status-queued {
  color: #ffd98a !important;
  border-color: #755d2c !important;
  background: #3b311c !important;
}

/* Progress track */
html[data-view="dark"] body.campaignhub-blue-theme .scan-track {
  background: #173b59 !important;
  box-shadow:
    inset 0 1px 3px rgba(0,0,0,.32),
    0 0 0 1px rgba(47,107,151,.18) !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .scan-track span {
  background: linear-gradient(90deg, #168cf5 0%, #34b7f2 100%) !important;
  box-shadow: 0 0 14px rgba(45,172,255,.28) !important;
}

/*
 * Critical V16.0.5 correction:
 * base CSS used rgba(255,255,255,.72) here, which created pale gray cards
 * inside Dark Premium.
 */
html[data-view="dark"] body.campaignhub-blue-theme .scan-grid > div {
  color: #eaf4fd !important;
  border: 1px solid #23506f !important;
  background:
    linear-gradient(180deg, #103856 0%, #0d304d 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 4px 12px rgba(0,0,0,.10) !important;
}

/* Metric labels */
html[data-view="dark"] body.campaignhub-blue-theme .scan-grid small {
  color: #8eabc5 !important;
  opacity: 1 !important;
  font-weight: 700 !important;
}

/* Metric values */
html[data-view="dark"] body.campaignhub-blue-theme .scan-grid strong {
  color: #f1f7fd !important;
  opacity: 1 !important;
  font-weight: 760 !important;
  text-shadow: none !important;
}

/* Dark-theme flash messages shown immediately after requesting a scan */
html[data-view="dark"] body.campaignhub-blue-theme .flash-success {
  color: #a6e6ca !important;
  border-color: #2c6856 !important;
  background: #0c302a !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .flash-info {
  color: #a9d6ff !important;
  border-color: #285d82 !important;
  background: #0c2c47 !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .flash-warning {
  color: #f4d58f !important;
  border-color: #6a572a !important;
  background: #332b1b !important;
}

html[data-view="dark"] body.campaignhub-blue-theme .flash-danger {
  color: #ffb8c2 !important;
  border-color: #743948 !important;
  background: #351d27 !important;
}

/* Preserve readable contrast when the scan grid collapses responsively. */
@media (max-width: 1050px) {
  html[data-view="dark"] body.campaignhub-blue-theme .scan-grid > div {
    min-height: 66px;
  }
}


/* =====================================================================
   CampaignHub Container Analyzer V16.1.0
   Modern Clean replacement — Concept B executive dashboard
   Includes prior V16.0.4/V16.0.5 contrast fixes as baseline.
   ===================================================================== */

.concept-b-sidebar,
.concept-b-dashboard {
  display: none;
}

/* ----- Modern Clean shell: fixed navy sidebar + compact white control bar ----- */
html[data-view="modern"] body.campaignhub-blue-theme {
  background: #f4f7fb !important;
  color: #163453;
}

html[data-view="modern"] body.campaignhub-blue-theme::before,
html[data-view="modern"] body.campaignhub-blue-theme::after {
  display: none !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .concept-b-sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 80;
  width: 244px;
  display: flex;
  flex-direction: column;
  padding: 22px 16px 18px;
  color: #f3f8ff;
  background:
    radial-gradient(circle at 45% -10%, rgba(35,139,255,.24), transparent 19rem),
    linear-gradient(180deg, #062d63 0%, #03234f 52%, #021b3d 100%);
  border-right: 1px solid rgba(255,255,255,.08);
  box-shadow: 10px 0 30px rgba(3,31,73,.10);
}

html[data-view="modern"] .concept-b-brand {
  display: block;
  color: #fff;
  text-decoration: none;
  padding: 2px 4px 20px;
}

html[data-view="modern"] .concept-b-logo-holder {
  width: 100%;
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 9px 12px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 20px rgba(0,0,0,.16);
}

html[data-view="modern"] .concept-b-logo-holder img {
  display: block;
  width: 170px;
  max-width: 100%;
  height: auto;
}

html[data-view="modern"] .concept-b-product {
  display: block;
  margin-top: 10px;
  padding-left: 4px;
  color: #e7f3ff;
  font-size: 12px;
  font-weight: 720;
  letter-spacing: .01em;
}

html[data-view="modern"] .concept-b-nav {
  display: grid;
  gap: 5px;
  margin-top: 4px;
}

html[data-view="modern"] .concept-b-nav a {
  min-height: 43px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 11px;
  color: #cfdef0;
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: 9px;
  font-size: 12px;
  font-weight: 630;
  transition: background .16s ease, color .16s ease, border-color .16s ease;
}

html[data-view="modern"] .concept-b-nav a:hover {
  color: #fff;
  border-color: rgba(104,180,255,.20);
  background: rgba(41,126,224,.18);
}

html[data-view="modern"] .concept-b-nav a.active {
  color: #fff;
  border-color: rgba(102,181,255,.32);
  background: linear-gradient(135deg, #0b76ef, #075dcc);
  box-shadow: 0 8px 20px rgba(0,84,190,.26);
}

html[data-view="modern"] .concept-b-nav-icon {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  color: #9fcfff;
  font-size: 15px;
  line-height: 1;
}

html[data-view="modern"] .concept-b-nav a.active .concept-b-nav-icon {
  color: #fff;
}

html[data-view="modern"] .concept-b-sidebar-scan {
  margin-top: auto;
  padding: 13px;
  border: 1px solid rgba(126,186,244,.30);
  border-radius: 11px;
  background: rgba(4,39,82,.60);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

html[data-view="modern"] .concept-b-sidebar-scan span,
html[data-view="modern"] .concept-b-sidebar-scan strong,
html[data-view="modern"] .concept-b-sidebar-scan small {
  display: block;
}

html[data-view="modern"] .concept-b-sidebar-status {
  color: #9fbedb;
  font-size: 9px;
  font-weight: 740;
  text-transform: uppercase;
  letter-spacing: .05em;
}

html[data-view="modern"] .concept-b-sidebar-scan strong {
  margin-top: 6px;
  color: #f4f9ff;
  font-size: 10.5px;
  line-height: 1.35;
}

html[data-view="modern"] .concept-b-sidebar-badge {
  width: fit-content;
  margin-top: 8px;
  padding: 4px 7px;
  border-radius: 999px;
  color: #a9e5c8;
  border: 1px solid rgba(98,213,158,.28);
  background: rgba(27,139,94,.19);
  font-size: 8.5px;
  font-weight: 760;
}

html[data-view="modern"] .concept-b-sidebar-badge.status-failed,
html[data-view="modern"] .concept-b-sidebar-badge.status-interrupted {
  color: #ffc1c8;
  border-color: rgba(255,125,140,.32);
  background: rgba(177,46,65,.20);
}

html[data-view="modern"] .concept-b-sidebar-meta {
  padding: 13px 5px 0;
  color: #90aac4;
}

html[data-view="modern"] .concept-b-sidebar-meta span,
html[data-view="modern"] .concept-b-sidebar-meta small {
  display: block;
}

html[data-view="modern"] .concept-b-sidebar-meta span {
  font-size: 9px;
}

html[data-view="modern"] .concept-b-sidebar-meta small {
  margin-top: 7px;
  font-size: 8px;
  opacity: .78;
}

html[data-view="modern"] body.campaignhub-blue-theme .topbar {
  position: sticky;
  top: 0;
  z-index: 70;
  width: auto;
  min-height: 72px;
  margin-left: 244px;
  padding: 0 24px;
  gap: 12px;
  color: #173b61;
  border-bottom: 1px solid #dce6f0;
  background: rgba(255,255,255,.96);
  box-shadow: 0 5px 22px rgba(20,55,96,.07);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

html[data-view="modern"] body.campaignhub-blue-theme .topbar .campaignhub-brand,
html[data-view="modern"] body.campaignhub-blue-theme .topbar .header-nav {
  display: none !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .top-actions {
  margin-left: auto;
}

html[data-view="modern"] body.campaignhub-blue-theme .timezone-form label {
  color: #687f97 !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .timezone-form select,
html[data-view="modern"] body.campaignhub-blue-theme .view-dropdown-toggle {
  color: #173a60 !important;
  border-color: #d8e4ef !important;
  background: #f9fbfe !important;
  box-shadow: none !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .view-dropdown-toggle:hover,
html[data-view="modern"] body.campaignhub-blue-theme .view-dropdown[open] .view-dropdown-toggle {
  color: #075fc3 !important;
  border-color: #bcd6f0 !important;
  background: #eef6ff !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .page-shell {
  width: auto !important;
  max-width: none !important;
  margin-left: 244px;
  padding: 22px 24px 34px !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .footer {
  display: none !important;
}

/* ----- Concept B dashboard content ----- */
html[data-view="modern"] .concept-b-dashboard {
  order: 5;
  display: grid;
  gap: 15px;
  min-width: 0;
}

/* Hide previous Modern Clean presentation. Executive and Dark remain untouched. */
html[data-view="modern"] .dashboard-hero,
html[data-view="modern"] .modern-clean-summary,
html[data-view="modern"] .modern-clean-primary,
html[data-view="modern"] .modern-clean-insights,
html[data-view="modern"] .modern-clean-bottom,
html[data-view="modern"] .dashboard-metrics,
html[data-view="modern"] .dashboard-signals,
html[data-view="modern"] .dashboard-billing,
html[data-view="modern"] .dashboard-storage-tenants,
html[data-view="modern"] .dashboard-monthly {
  display: none !important;
}

/* Keep audit/technical sections below the Concept B first screen. */
html[data-view="modern"] .dashboard-container-changes { order: 20; }
html[data-view="modern"] .dashboard-change-map { order: 30; }
html[data-view="modern"] .dashboard-operations { order: 40; }
html[data-view="modern"] .dashboard-scans { order: 50; }
html[data-view="modern"] .dashboard-help { order: 60; }

html[data-view="modern"] .concept-b-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  padding: 1px 2px 4px;
}

html[data-view="modern"] .concept-b-overline {
  display: block;
  margin-bottom: 3px;
  color: #0875e4;
  font-size: 8.5px;
  font-weight: 820;
  letter-spacing: .10em;
}

html[data-view="modern"] .concept-b-heading h1 {
  margin: 0;
  color: #102d50;
  font-size: 25px;
  font-weight: 780;
  letter-spacing: -.025em;
}

html[data-view="modern"] .concept-b-heading p {
  margin: 4px 0 0;
  color: #667d95;
  font-size: 10.5px;
}

html[data-view="modern"] .concept-b-heading-meta {
  display: flex;
  align-items: center;
  gap: 8px;
}

html[data-view="modern"] .concept-b-period-chip,
html[data-view="modern"] .concept-b-timezone-chip {
  display: inline-flex;
  align-items: center;
  min-height: 33px;
  padding: 7px 10px;
  border: 1px solid #d8e4ef;
  border-radius: 8px;
  color: #385775;
  background: #fff;
  font-size: 9.5px;
  font-weight: 650;
}

html[data-view="modern"] .concept-b-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 14px;
}

html[data-view="modern"] .concept-b-kpi {
  position: relative;
  min-width: 0;
  min-height: 148px;
  overflow: hidden;
  padding: 17px 18px;
  color: #fff;
  border-radius: 13px;
  box-shadow: 0 10px 24px rgba(16,56,104,.14);
}

html[data-view="modern"] .concept-b-kpi::before {
  content: "";
  position: absolute;
  right: -38px;
  bottom: -52px;
  width: 145px;
  height: 145px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 50%;
}

html[data-view="modern"] .concept-b-kpi-blue { background: linear-gradient(135deg, #0a4b9e, #123a84); }
html[data-view="modern"] .concept-b-kpi-green { background: linear-gradient(135deg, #08733e, #07592f); }
html[data-view="modern"] .concept-b-kpi-purple { background: linear-gradient(135deg, #6129bd, #4b239a); }
html[data-view="modern"] .concept-b-kpi-orange { background: linear-gradient(135deg, #f58b18, #f17411); }

html[data-view="modern"] .concept-b-kpi-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: rgba(255,255,255,.88);
  font-size: 9px;
  font-weight: 720;
}

html[data-view="modern"] .concept-b-kpi-icon {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 9px;
  background: rgba(255,255,255,.09);
  color: #fff;
  font-size: 15px;
  font-weight: 800;
}

html[data-view="modern"] .concept-b-kpi > strong {
  position: relative;
  z-index: 1;
  display: block;
  margin-top: 12px;
  color: #fff !important;
  font-size: clamp(22px, 2vw, 31px);
  line-height: 1.05;
  font-weight: 790;
  letter-spacing: -.035em;
  overflow-wrap: anywhere;
}

html[data-view="modern"] .concept-b-kpi-orange > strong {
  font-size: clamp(18px, 1.65vw, 24px);
  line-height: 1.18;
}

html[data-view="modern"] .concept-b-kpi > small {
  position: relative;
  z-index: 1;
  display: block;
  margin-top: 8px;
  color: rgba(255,255,255,.80) !important;
  font-size: 8.7px;
  line-height: 1.35;
}

html[data-view="modern"] .concept-b-inline-status {
  display: inline-flex;
  align-items: center;
  padding: 3px 7px;
  border-radius: 999px;
  color: #eafff2;
  background: rgba(9,115,59,.25);
  border: 1px solid rgba(214,255,232,.24);
  font-weight: 730;
}

html[data-view="modern"] .concept-b-bars {
  position: absolute;
  right: 18px;
  bottom: 15px;
  height: 36px;
  display: flex;
  align-items: flex-end;
  gap: 4px;
  opacity: .48;
}

html[data-view="modern"] .concept-b-bars i {
  width: 6px;
  border-radius: 2px 2px 0 0;
  background: #d9b9ff;
}

html[data-view="modern"] .concept-b-bars i:nth-child(1) { height: 12px; }
html[data-view="modern"] .concept-b-bars i:nth-child(2) { height: 19px; }
html[data-view="modern"] .concept-b-bars i:nth-child(3) { height: 15px; }
html[data-view="modern"] .concept-b-bars i:nth-child(4) { height: 27px; }
html[data-view="modern"] .concept-b-bars i:nth-child(5) { height: 14px; }
html[data-view="modern"] .concept-b-bars i:nth-child(6) { height: 23px; }
html[data-view="modern"] .concept-b-bars i:nth-child(7) { height: 34px; }

html[data-view="modern"] .concept-b-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid #dce6f0;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 5px 18px rgba(25,63,105,.045);
}

html[data-view="modern"] .concept-b-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 15px;
  padding: 15px 17px 11px;
}

html[data-view="modern"] .concept-b-card-head.compact {
  padding-bottom: 7px;
}

html[data-view="modern"] .concept-b-card-head h2 {
  margin: 0;
  color: #112f52;
  font-size: 13px;
  font-weight: 770;
  letter-spacing: -.012em;
}

html[data-view="modern"] .concept-b-card-head h2 span {
  color: #647b92;
  font-weight: 560;
}

html[data-view="modern"] .concept-b-card-head p {
  margin: 3px 0 0;
  color: #74889d;
  font-size: 8.5px;
  line-height: 1.35;
}

html[data-view="modern"] .concept-b-card-head a,
html[data-view="modern"] .concept-b-card-foot a {
  color: #086ee0;
  text-decoration: none;
  font-size: 8.8px;
  font-weight: 700;
  white-space: nowrap;
}

html[data-view="modern"] .concept-b-card-head a:hover,
html[data-view="modern"] .concept-b-card-foot a:hover {
  text-decoration: underline;
}

html[data-view="modern"] .concept-b-primary-row {
  display: grid;
  grid-template-columns: minmax(330px, .82fr) minmax(610px, 1.58fr);
  gap: 14px;
}

html[data-view="modern"] .concept-b-storage-body {
  min-height: 223px;
  display: grid;
  grid-template-columns: 185px minmax(0,1fr);
  align-items: center;
  gap: 15px;
  padding: 4px 18px 17px;
}

html[data-view="modern"] .concept-b-donut-wrap {
  position: relative;
  width: 166px;
  height: 166px;
  margin: auto;
}

html[data-view="modern"] .concept-b-donut {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}

html[data-view="modern"] .concept-b-donut-base,
html[data-view="modern"] .concept-b-donut-segment {
  fill: none;
  stroke-width: 15;
}

html[data-view="modern"] .concept-b-donut-base { stroke: #edf2f8; }
html[data-view="modern"] .concept-b-donut-segment { stroke-linecap: butt; }
html[data-view="modern"] .concept-b-donut-segment-0 { stroke: #0b6df2; }
html[data-view="modern"] .concept-b-donut-segment-1 { stroke: #0da3a2; }
html[data-view="modern"] .concept-b-donut-segment-2 { stroke: #7d5ae7; }
html[data-view="modern"] .concept-b-donut-segment-3 { stroke: #f59c22; }
html[data-view="modern"] .concept-b-donut-segment-4 { stroke: #36b879; }
html[data-view="modern"] .concept-b-donut-segment-5 { stroke: #e55f72; }

html[data-view="modern"] .concept-b-donut-center {
  position: absolute;
  inset: 0;
  display: grid;
  place-content: center;
  text-align: center;
}

html[data-view="modern"] .concept-b-donut-center strong,
html[data-view="modern"] .concept-b-donut-center span {
  display: block;
}

html[data-view="modern"] .concept-b-donut-center strong {
  max-width: 96px;
  color: #11345a;
  font-size: 15px;
  line-height: 1.15;
  font-weight: 780;
}

html[data-view="modern"] .concept-b-donut-center span {
  margin-top: 4px;
  color: #70869d;
  font-size: 8.5px;
}

html[data-view="modern"] .concept-b-storage-legend {
  display: grid;
  gap: 10px;
}

html[data-view="modern"] .concept-b-storage-legend a {
  display: grid;
  grid-template-columns: 10px minmax(0,1fr);
  gap: 9px;
  align-items: start;
  color: #14365b;
  text-decoration: none;
}

html[data-view="modern"] .concept-b-storage-legend a:hover strong { color: #0871e2; }
html[data-view="modern"] .concept-b-storage-legend strong,
html[data-view="modern"] .concept-b-storage-legend small { display: block; }
html[data-view="modern"] .concept-b-storage-legend strong { font-size: 9.5px; overflow-wrap: anywhere; }
html[data-view="modern"] .concept-b-storage-legend small { margin-top: 2px; color: #74899d; font-size: 8.3px; }

html[data-view="modern"] .concept-b-legend-dot {
  width: 8px;
  height: 8px;
  margin-top: 3px;
  border-radius: 50%;
}
html[data-view="modern"] .concept-b-legend-dot-0 { background: #0b6df2; }
html[data-view="modern"] .concept-b-legend-dot-1 { background: #0da3a2; }
html[data-view="modern"] .concept-b-legend-dot-2 { background: #7d5ae7; }
html[data-view="modern"] .concept-b-legend-dot-3 { background: #f59c22; }
html[data-view="modern"] .concept-b-legend-dot-4 { background: #36b879; }
html[data-view="modern"] .concept-b-legend-dot-5 { background: #e55f72; }

html[data-view="modern"] .concept-b-table-wrap {
  margin: 0 16px;
  overflow-x: auto;
  border: 1px solid #e1e9f2;
  border-radius: 8px;
}

html[data-view="modern"] .concept-b-table {
  width: 100%;
  min-width: 670px;
  border-collapse: collapse;
  table-layout: fixed;
  color: #173b61;
  background: #fff;
}

html[data-view="modern"] .concept-b-table th,
html[data-view="modern"] .concept-b-table td {
  padding: 8px 9px;
  border-bottom: 1px solid #e7eef5;
  white-space: nowrap;
}

html[data-view="modern"] .concept-b-table th {
  color: #627994;
  background: #f5f8fc;
  font-size: 7.5px;
  font-weight: 790;
  letter-spacing: .03em;
  text-transform: uppercase;
}

html[data-view="modern"] .concept-b-table td {
  color: #173b61 !important;
  font-size: 9.5px;
}

html[data-view="modern"] .concept-b-table td strong { color: #12375f !important; }
html[data-view="modern"] .concept-b-table td a { color: #0870df; text-decoration: none; }
html[data-view="modern"] .concept-b-table tbody tr:last-child td { border-bottom: 0; }
html[data-view="modern"] .concept-b-table tbody tr:hover { background: #f7fbff; }

html[data-view="modern"] .concept-b-card-foot {
  display: flex;
  justify-content: flex-end;
  padding: 10px 16px 13px;
}

html[data-view="modern"] .concept-b-secondary-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 14px;
}

html[data-view="modern"] .concept-b-state {
  display: inline-flex;
  min-height: 24px;
  align-items: center;
  padding: 4px 8px;
  border-radius: 7px;
  font-size: 7.7px;
  font-weight: 760;
  text-transform: capitalize;
  white-space: nowrap;
}

html[data-view="modern"] .concept-b-state-change {
  color: #b24c18;
  border: 1px solid #ffd1b5;
  background: #fff4ea;
}

html[data-view="modern"] .concept-b-state-ok {
  color: #117240;
  border: 1px solid #c7ead7;
  background: #effaf4;
}

html[data-view="modern"] .concept-b-activity-body {
  display: grid;
  grid-template-columns: 124px minmax(0,1fr);
  align-items: center;
  gap: 14px;
  padding: 6px 16px 4px;
}

html[data-view="modern"] .concept-b-activity-ring {
  --activity-pct: 0%;
  position: relative;
  width: 108px;
  height: 108px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: conic-gradient(#0b74ec 0 var(--activity-pct), #e6edf5 var(--activity-pct) 100%);
}

html[data-view="modern"] .concept-b-activity-ring::after {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: 50%;
  background: #fff;
}

html[data-view="modern"] .concept-b-activity-ring > div {
  position: relative;
  z-index: 1;
  text-align: center;
}

html[data-view="modern"] .concept-b-activity-ring strong,
html[data-view="modern"] .concept-b-activity-ring span,
html[data-view="modern"] .concept-b-activity-ring small { display: block; }
html[data-view="modern"] .concept-b-activity-ring strong { color: #0a6fe3; font-size: 20px; }
html[data-view="modern"] .concept-b-activity-ring span { color: #173a60; font-size: 9px; font-weight: 720; }
html[data-view="modern"] .concept-b-activity-ring small { margin-top: 2px; color: #71869a; font-size: 7.7px; }

html[data-view="modern"] .concept-b-activity-list {
  display: grid;
  gap: 7px;
}

html[data-view="modern"] .concept-b-activity-list > div {
  display: grid;
  grid-template-columns: 8px 46px minmax(0,1fr);
  align-items: center;
  gap: 7px;
  color: #71869a;
  font-size: 8.3px;
}

html[data-view="modern"] .concept-b-activity-list strong { color: #183b61; font-size: 8.8px; }
html[data-view="modern"] .concept-b-activity-dot { width: 7px; height: 7px; border-radius: 50%; background: #c7d3df; }
html[data-view="modern"] .concept-b-activity-list > div.is-active .concept-b-activity-dot { background: #0b73e8; box-shadow: 0 0 0 3px #e8f3ff; }
html[data-view="modern"] .concept-b-activity-list > div.is-active > span:last-child { color: #087447; font-weight: 690; }

html[data-view="modern"] .concept-b-change-value {
  padding: 8px 17px 7px;
}

html[data-view="modern"] .concept-b-change-value strong,
html[data-view="modern"] .concept-b-change-value span { display: block; }
html[data-view="modern"] .concept-b-change-value strong { font-size: 20px; font-weight: 790; }
html[data-view="modern"] .concept-b-change-value span { margin-top: 3px; color: #768a9e; font-size: 8.2px; }

html[data-view="modern"] .concept-b-change-lines {
  display: grid;
  gap: 1px;
  margin: 4px 16px 0;
  border: 1px solid #e6edf4;
  border-radius: 8px;
  overflow: hidden;
}

html[data-view="modern"] .concept-b-change-lines > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 7px 9px;
  color: #5f7790;
  background: #fbfdff;
  font-size: 8px;
}

html[data-view="modern"] .concept-b-change-lines strong { font-size: 8.3px; font-weight: 730; }

html[data-view="modern"] .concept-b-infra-ok {
  min-height: 140px;
  display: grid;
  place-items: center;
  align-content: center;
  text-align: center;
  padding: 15px;
}

html[data-view="modern"] .concept-b-shield {
  width: 44px;
  height: 48px;
  display: grid;
  place-items: center;
  clip-path: polygon(50% 0, 95% 18%, 88% 70%, 50% 100%, 12% 70%, 5% 18%);
  color: #0b8b52;
  background: #ecf9f2;
  font-size: 18px;
  font-weight: 900;
}

html[data-view="modern"] .concept-b-infra-ok strong { margin-top: 9px; color: #153a60; font-size: 10px; }
html[data-view="modern"] .concept-b-infra-ok small { margin-top: 4px; color: #74899c; font-size: 7.8px; }

html[data-view="modern"] .concept-b-billing-card {
  padding-bottom: 3px;
}

html[data-view="modern"] .concept-b-billing-equation {
  display: grid;
  grid-template-columns: minmax(130px,1fr) 22px minmax(130px,1fr) 22px minmax(145px,1fr) 22px minmax(130px,1fr) 22px minmax(150px,1.12fr);
  align-items: center;
  gap: 8px;
  padding: 4px 17px 13px;
}

html[data-view="modern"] .concept-b-billing-equation > b {
  color: #385a80;
  text-align: center;
  font-size: 20px;
  font-weight: 500;
}

html[data-view="modern"] .concept-b-cost-box {
  min-height: 78px;
  padding: 11px 12px;
  border: 1px solid #dfe8f1;
  border-radius: 9px;
  background: #f8fbff;
}

html[data-view="modern"] .concept-b-cost-box small,
html[data-view="modern"] .concept-b-cost-box strong,
html[data-view="modern"] .concept-b-cost-box span { display: block; }
html[data-view="modern"] .concept-b-cost-box small { font-size: 7.5px; font-weight: 790; text-transform: uppercase; letter-spacing: .03em; }
html[data-view="modern"] .concept-b-cost-box strong { margin-top: 5px; color: #12365c; font-size: 14px; }
html[data-view="modern"] .concept-b-cost-box span { margin-top: 3px; color: #70869a; font-size: 7.7px; }

html[data-view="modern"] .concept-b-cost-own { border-color: #cfe0f8; background: #f2f7ff; }
html[data-view="modern"] .concept-b-cost-own small { color: #0870df; }
html[data-view="modern"] .concept-b-cost-platform { border-color: #cdebd9; background: #f1faf5; }
html[data-view="modern"] .concept-b-cost-platform small { color: #16814e; }
html[data-view="modern"] .concept-b-cost-other { border-color: #f2dfbb; background: #fff9ec; }
html[data-view="modern"] .concept-b-cost-other small { color: #bf6c09; }
html[data-view="modern"] .concept-b-cost-unassigned { border-color: #e2d6f7; background: #f8f3ff; }
html[data-view="modern"] .concept-b-cost-unassigned small { color: #7546c5; }
html[data-view="modern"] .concept-b-cost-total { color: #fff; border-color: #072f70; background: linear-gradient(135deg, #073579, #06275c); }
html[data-view="modern"] .concept-b-cost-total small,
html[data-view="modern"] .concept-b-cost-total strong,
html[data-view="modern"] .concept-b-cost-total span { color: #fff !important; }

html[data-view="modern"] .concept-b-billing-note,
html[data-view="modern"] .concept-b-disclaimer {
  margin: 0;
  color: #6c8298;
  text-align: center;
  font-size: 8px;
  line-height: 1.35;
}

html[data-view="modern"] .concept-b-billing-note { padding: 1px 16px 12px; }
html[data-view="modern"] .concept-b-disclaimer { padding: 0 6px 3px; }

/* Advanced sections remain light and readable under Concept B. */
html[data-view="modern"] body.campaignhub-blue-theme .dashboard-container-changes,
html[data-view="modern"] body.campaignhub-blue-theme .dashboard-change-map,
html[data-view="modern"] body.campaignhub-blue-theme .dashboard-operations,
html[data-view="modern"] body.campaignhub-blue-theme .dashboard-scans,
html[data-view="modern"] body.campaignhub-blue-theme .dashboard-help {
  color: #173c61 !important;
  border-color: #dce6f0 !important;
  background: #fff !important;
  box-shadow: 0 5px 18px rgba(25,63,105,.045) !important;
}

html[data-view="modern"] body.campaignhub-blue-theme .dashboard-help > summary {
  color: #345b7b !important;
}

/* ----- Responsive Concept B ----- */
@media (max-width: 1280px) {
  html[data-view="modern"] body.campaignhub-blue-theme .concept-b-sidebar { width: 220px; }
  html[data-view="modern"] body.campaignhub-blue-theme .topbar,
  html[data-view="modern"] body.campaignhub-blue-theme .page-shell { margin-left: 220px; }
  html[data-view="modern"] .concept-b-kpis { grid-template-columns: repeat(2, minmax(0,1fr)); }
  html[data-view="modern"] .concept-b-primary-row { grid-template-columns: 1fr; }
  html[data-view="modern"] .concept-b-secondary-row { grid-template-columns: repeat(2, minmax(0,1fr)); }
  html[data-view="modern"] .concept-b-infra-card { grid-column: 1 / -1; }
  html[data-view="modern"] .concept-b-billing-equation {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  html[data-view="modern"] .concept-b-billing-equation > b { display: none; }
  html[data-view="modern"] .concept-b-cost-total { grid-column: 1 / -1; }
}

@media (max-width: 980px) {
  html[data-view="modern"] body.campaignhub-blue-theme .concept-b-sidebar { display: none; }
  html[data-view="modern"] body.campaignhub-blue-theme .topbar,
  html[data-view="modern"] body.campaignhub-blue-theme .page-shell { margin-left: 0; }
  html[data-view="modern"] body.campaignhub-blue-theme .topbar .campaignhub-brand { display: flex !important; }
  html[data-view="modern"] body.campaignhub-blue-theme .topbar { padding-left: 14px; padding-right: 14px; }
  html[data-view="modern"] body.campaignhub-blue-theme .topbar .brand-product { display: none !important; }
  html[data-view="modern"] .concept-b-secondary-row { grid-template-columns: 1fr; }
  html[data-view="modern"] .concept-b-infra-card { grid-column: auto; }
}

@media (max-width: 720px) {
  html[data-view="modern"] .concept-b-heading { display: block; }
  html[data-view="modern"] .concept-b-heading-meta { margin-top: 12px; }
  html[data-view="modern"] .concept-b-kpis { grid-template-columns: 1fr; }
  html[data-view="modern"] .concept-b-storage-body { grid-template-columns: 1fr; }
  html[data-view="modern"] .concept-b-activity-body { grid-template-columns: 1fr; justify-items: center; }
  html[data-view="modern"] .concept-b-activity-list { width: 100%; }
  html[data-view="modern"] .concept-b-billing-equation { grid-template-columns: 1fr; }
  html[data-view="modern"] .concept-b-cost-total { grid-column: auto; }
}

/* =====================================================================
   CampaignHub Container Analyzer V16.1.1
   Functional Concept B sidebar pages: Analytics / Scans / Storage / Tenants
   ===================================================================== */

.concept-section-page {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.concept-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  padding: 4px 2px 2px;
}

.concept-section-overline {
  display: block;
  margin-bottom: 4px;
  color: #0874e8;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .105em;
}

.concept-section-head h1 {
  margin: 0;
  color: #0b2e55;
  font-size: clamp(26px, 2.4vw, 34px);
  line-height: 1.08;
  letter-spacing: -.03em;
}

.concept-section-head p {
  margin: 7px 0 0;
  color: #6c8197;
  font-size: 11.5px;
  line-height: 1.5;
}

.concept-section-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.concept-section-kpis > article {
  min-width: 0;
  min-height: 106px;
  padding: 16px;
  border: 1px solid #dbe7f2;
  border-radius: 14px;
  background: linear-gradient(180deg, #fff, #f9fcff);
  box-shadow: 0 7px 20px rgba(25,65,110,.055);
}

.concept-section-kpis small,
.concept-section-kpis strong,
.concept-section-kpis span {
  display: block;
}

.concept-section-kpis small {
  color: #70859b;
  font-size: 9px;
  font-weight: 750;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.concept-section-kpis strong {
  margin-top: 7px;
  color: #0d3158;
  font-size: clamp(19px, 1.7vw, 25px);
  line-height: 1.12;
  overflow-wrap: anywhere;
}

.concept-section-kpis span {
  margin-top: 6px;
  color: #7a8da1;
  font-size: 9px;
  line-height: 1.35;
}

.concept-section-grid {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.concept-section-grid-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.concept-section-card {
  min-width: 0;
  padding: 18px;
  border: 1px solid #dbe7f2;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 7px 22px rgba(25,65,110,.055);
}

.concept-section-card-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 13px;
}

.concept-section-card-head h2 {
  margin: 0;
  color: #11375d;
  font-size: 15px;
  letter-spacing: -.012em;
}

.concept-section-card-head p {
  margin: 4px 0 0;
  color: #7b8fa3;
  font-size: 9.5px;
  line-height: 1.4;
}

.concept-section-card-head a {
  color: #0874e8;
  font-size: 10px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.concept-section-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 10.5px;
}

.concept-section-table th {
  padding: 9px 10px;
  color: #698198;
  border-bottom: 1px solid #dce7f1;
  background: #f4f8fc;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
  text-align: left;
  white-space: nowrap;
}

.concept-section-table td {
  padding: 10px;
  color: #1b4268;
  border-bottom: 1px solid #e6eef5;
  vertical-align: middle;
}

.concept-section-table tbody tr:last-child td {
  border-bottom: 0;
}

.concept-section-table tbody tr:hover {
  background: #f7fbff;
}

.concept-section-table a {
  color: #0874e8;
  text-decoration: none;
}

.concept-section-table .right {
  text-align: right;
}

.concept-section-note {
  padding: 12px 14px;
  border: 1px solid #d8e6f3;
  border-radius: 12px;
  color: #58738d;
  background: #f5faff;
  font-size: 10px;
  line-height: 1.45;
}

.concept-storage-share {
  display: grid;
  grid-template-columns: minmax(90px, 1fr) auto;
  gap: 8px;
  align-items: center;
  min-width: 150px;
}

.concept-storage-share > div {
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #e5eef8;
}

.concept-storage-share > div > span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #0a79ed, #4eb7ff);
}

.concept-storage-share small {
  color: #667d94;
  font-size: 9px;
}

.concept-location-note {
  display: block;
  margin-top: 2px;
  color: #8093a6;
  font-size: 8.5px;
}

.concept-change-list {
  display: grid;
  gap: 8px;
}

.concept-change-list > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 11px;
  border: 1px solid #e2ebf3;
  border-radius: 10px;
  color: #1b4268;
  background: #fbfdff;
  text-decoration: none;
}

.concept-change-list > a:hover {
  border-color: #c7dcf0;
  background: #f5faff;
}

.concept-change-list span,
.concept-change-list strong,
.concept-change-list b,
.concept-change-list small {
  display: block;
}

.concept-change-list strong,
.concept-change-list b {
  font-size: 10.5px;
}

.concept-change-list small {
  margin-top: 3px;
  color: #7a8ea2;
  font-size: 8.5px;
}

.concept-change-list > a > span:last-child {
  text-align: right;
}

.concept-analytics-bars {
  height: 230px;
  display: flex;
  align-items: stretch;
  gap: 8px;
  overflow-x: auto;
  padding: 8px 2px 0;
}

.concept-analytics-bars > div {
  min-width: 54px;
  flex: 1 1 0;
  display: grid;
  grid-template-rows: 24px minmax(100px, 1fr) 24px;
  gap: 5px;
  text-align: center;
}

.concept-analytics-bars strong {
  color: #58718a;
  font-size: 7.5px;
  font-weight: 650;
}

.concept-analytics-bars > div > div {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
  border-radius: 7px;
  background: #f2f7fc;
}

.concept-analytics-bars > div > div > span {
  width: 46%;
  min-height: 4px;
  border-radius: 6px 6px 2px 2px;
  background: linear-gradient(180deg, #4ab8ff, #0875e8);
}

.concept-analytics-bars small {
  color: #71879b;
  font-size: 7.5px;
}

/* Dark Premium route pages retain full text contrast. */
html[data-view="dark"] .concept-section-overline,
html[data-view="dark"] .concept-section-card-head a,
html[data-view="dark"] .concept-section-table a {
  color: #69b8ff;
}

html[data-view="dark"] .concept-section-head h1,
html[data-view="dark"] .concept-section-kpis strong,
html[data-view="dark"] .concept-section-card-head h2,
html[data-view="dark"] .concept-section-table td,
html[data-view="dark"] .concept-change-list > a {
  color: #e8f3fd;
}

html[data-view="dark"] .concept-section-head p,
html[data-view="dark"] .concept-section-kpis small,
html[data-view="dark"] .concept-section-kpis span,
html[data-view="dark"] .concept-section-card-head p,
html[data-view="dark"] .concept-section-note,
html[data-view="dark"] .concept-change-list small,
html[data-view="dark"] .concept-location-note {
  color: #8fa7bd;
}

html[data-view="dark"] .concept-section-kpis > article,
html[data-view="dark"] .concept-section-card {
  border-color: #1b405f;
  background: linear-gradient(180deg, #0d2945, #091f36);
  box-shadow: 0 10px 28px rgba(0,0,0,.18);
}

html[data-view="dark"] .concept-section-table th {
  color: #8fa8c0;
  border-bottom-color: #1d405d;
  background: #0b243d;
}

html[data-view="dark"] .concept-section-table td {
  border-bottom-color: #173852;
}

html[data-view="dark"] .concept-section-table tbody tr:hover {
  background: rgba(47,121,184,.10);
}

html[data-view="dark"] .concept-section-note,
html[data-view="dark"] .concept-change-list > a,
html[data-view="dark"] .concept-analytics-bars > div > div {
  border-color: #1d425f;
  background: #0b243d;
}

html[data-view="dark"] .concept-storage-share > div {
  background: #173b58;
}

@media (max-width: 1100px) {
  .concept-section-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .concept-section-grid-2 {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 700px) {
  .concept-section-head {
    display: block;
  }

  .concept-section-head > .btn {
    margin-top: 12px;
  }

  .concept-section-kpis {
    grid-template-columns: 1fr;
  }

  .concept-section-card {
    padding: 14px;
  }
}

/* =====================================================================
   CampaignHub Container Analyzer V16.2.0
   Global historical-period selector and archive-state UI
   ===================================================================== */
.period-form {
  display: inline-flex;
  align-items: flex-end;
  gap: 6px;
  min-width: 0;
}

.period-form label {
  display: grid;
  gap: 3px;
  min-width: 152px;
  color: rgba(255,255,255,.72);
  font-size: 8px;
  font-weight: 700;
  line-height: 1;
}

.period-form label > span {
  padding-left: 2px;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.period-form select {
  width: 100%;
  min-height: 38px;
  padding: 7px 30px 7px 10px;
  border: 1px solid rgba(255,255,255,.20);
  border-radius: 9px;
  outline: none;
  background: rgba(255,255,255,.08);
  color: #fff;
  font: inherit;
  font-size: 11px;
  font-weight: 650;
  cursor: pointer;
}

.period-form select option {
  color: #183b60;
  background: #fff;
}

.period-arrow {
  width: 34px;
  min-width: 34px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255,255,255,.20);
  border-radius: 9px;
  background: rgba(255,255,255,.07);
  color: #fff;
  text-decoration: none;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
}

.period-arrow:hover {
  border-color: rgba(255,255,255,.34);
  background: rgba(255,255,255,.14);
}

.period-arrow.disabled {
  opacity: .34;
  pointer-events: none;
}

/* Modern Clean / Concept B light header */
html[data-view="modern"] body.campaignhub-blue-theme .period-form label,
html[data-view="executive"] body.campaignhub-blue-theme .period-form label {
  color: #687f97;
}

html[data-view="modern"] body.campaignhub-blue-theme .period-form select,
html[data-view="executive"] body.campaignhub-blue-theme .period-form select,
html[data-view="modern"] body.campaignhub-blue-theme .period-arrow,
html[data-view="executive"] body.campaignhub-blue-theme .period-arrow {
  color: #173a60;
  border-color: #d8e4ef;
  background: #f9fbfe;
  box-shadow: none;
}

html[data-view="modern"] body.campaignhub-blue-theme .period-form select:hover,
html[data-view="executive"] body.campaignhub-blue-theme .period-form select:hover,
html[data-view="modern"] body.campaignhub-blue-theme .period-arrow:hover,
html[data-view="executive"] body.campaignhub-blue-theme .period-arrow:hover {
  color: #075fc3;
  border-color: #bcd6f0;
  background: #eef6ff;
}

/* Dark Premium */
html[data-view="dark"] body.campaignhub-blue-theme .period-form label {
  color: #86a2bb;
}

html[data-view="dark"] body.campaignhub-blue-theme .period-form select,
html[data-view="dark"] body.campaignhub-blue-theme .period-arrow {
  color: #dcecff;
  border-color: #244b6a;
  background: #0d2a46;
}

html[data-view="dark"] body.campaignhub-blue-theme .period-form select option {
  color: #dcecff;
  background: #0c2843;
}

html[data-view="dark"] body.campaignhub-blue-theme .period-form select:hover,
html[data-view="dark"] body.campaignhub-blue-theme .period-arrow:hover {
  color: #8bcaff;
  border-color: #32678e;
  background: #123653;
}

.period-data-note {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 14px;
  padding: 10px 13px;
  border: 1px solid #d5e5f3;
  border-radius: 11px;
  background: #f7fbff;
  color: #506d88;
  font-size: 10px;
  line-height: 1.45;
}

.period-data-note strong {
  color: #173f68;
}

.period-data-note.warning {
  border-color: #ead8a8;
  background: #fff9ea;
  color: #78643a;
}

html[data-view="dark"] .period-data-note {
  color: #96aec4;
  border-color: #234761;
  background: #0b2944;
}

html[data-view="dark"] .period-data-note strong {
  color: #e2effb;
}

html[data-view="dark"] .period-data-note.warning {
  color: #dfc47e;
  border-color: #5a4b28;
  background: #2b2519;
}

/* Historical pages show archived summaries, not live-folder drill-down. */
.historical-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 8px;
  border: 1px solid #cfe0f1;
  border-radius: 999px;
  background: #f2f8ff;
  color: #376385;
  font-size: 8px;
  font-weight: 760;
  letter-spacing: .03em;
  text-transform: uppercase;
}

html[data-view="dark"] .historical-badge {
  color: #8cc8fa;
  border-color: #2a5678;
  background: #0e2d49;
}

@media (max-width: 1220px) {
  .period-form label { min-width: 132px; }
  .period-form label > span { display: none; }
  .timezone-form label > span { display: none; }
}

@media (max-width: 980px) {
  .period-arrow { display: none; }
  .period-form label { min-width: 122px; }
}
html[data-view="modern"] .dashboard-legacy-period-note { display: none !important; }
html[data-view="executive"] .dashboard-legacy-period-note,
html[data-view="dark"] .dashboard-legacy-period-note { display: flex; order: 4; }

/*
 * Light-theme breadcrumb contrast fix.
 *
 * The shared blue-theme breadcrumb colour (#d0e9fb) is intended for the
 * dark/blue canvas. On Modern Clean and Executive Summary it makes the
 * separator and current (non-link) breadcrumb nearly invisible.
 */
html[data-view="modern"] body.campaignhub-blue-theme .breadcrumbs,
html[data-view="executive"] body.campaignhub-blue-theme .breadcrumbs {
  color: #4f6881 !important;
  font-weight: 600;
  text-shadow: none;
}

html[data-view="modern"] body.campaignhub-blue-theme .breadcrumbs a,
html[data-view="executive"] body.campaignhub-blue-theme .breadcrumbs a {
  color: #0871df;
}

html[data-view="modern"] body.campaignhub-blue-theme .breadcrumbs a:hover,
html[data-view="executive"] body.campaignhub-blue-theme .breadcrumbs a:hover {
  color: #045bb8;
}

/* CampaignHub Container Analyzer V16.2.2 — stability status components. */
:root {
  --ch-complete-text: #17633a;
  --ch-complete-bg: #eaf8f0;
  --ch-complete-border: #a9ddbd;
  --ch-partial-text: #7a4a05;
  --ch-partial-bg: #fff7df;
  --ch-partial-border: #efcf7a;
  --ch-no-data-text: #9a2f2f;
  --ch-no-data-bg: #fff0f0;
  --ch-no-data-border: #efb5b5;
}

.period-quality-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 4px 10px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 750;
  line-height: 1;
  white-space: nowrap;
}

.period-quality-complete {
  color: var(--ch-complete-text) !important;
  background: var(--ch-complete-bg) !important;
  border-color: var(--ch-complete-border) !important;
}

.period-quality-partial {
  color: var(--ch-partial-text) !important;
  background: var(--ch-partial-bg) !important;
  border-color: var(--ch-partial-border) !important;
}

.period-quality-no_data {
  color: var(--ch-no-data-text) !important;
  background: var(--ch-no-data-bg) !important;
  border-color: var(--ch-no-data-border) !important;
}

.scan-health-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.scan-health-grid .health-list {
  margin-top: 4px;
}

.scan-health-grid .health-list strong {
  max-width: 58%;
  overflow-wrap: anywhere;
  text-align: right;
}

.scan-health-error {
  display: grid;
  gap: 4px;
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid var(--ch-no-data-border);
  border-radius: 10px;
  background: var(--ch-no-data-bg);
  color: var(--ch-no-data-text);
  font-size: 12px;
}

html[data-view="dark"] .period-quality-complete {
  color: #9de5ba !important;
  background: #123b2a !important;
  border-color: #2b6d4a !important;
}

html[data-view="dark"] .period-quality-partial {
  color: #ffd98a !important;
  background: #493713 !important;
  border-color: #80601d !important;
}

html[data-view="dark"] .period-quality-no_data,
html[data-view="dark"] .scan-health-error {
  color: #ffb4b4 !important;
  background: #491f27 !important;
  border-color: #793a45 !important;
}

@media (max-width: 900px) {
  .scan-health-grid {
    grid-template-columns: 1fr;
  }
}

/* V16.4.2 local account menu and administration */
.user-dropdown {
  position: relative;
  flex: 0 0 auto;
}

.user-dropdown > summary {
  list-style: none;
}

.user-dropdown > summary::-webkit-details-marker {
  display: none;
}

.user-dropdown-toggle {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 5px 11px 5px 6px;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 13px;
  background: rgba(255,255,255,.10);
  color: inherit;
  cursor: pointer;
  user-select: none;
}

.user-dropdown[open] .user-dropdown-toggle,
.user-dropdown-toggle:hover {
  background: rgba(255,255,255,.18);
}

.user-avatar {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: linear-gradient(135deg, #0788e8, #39bdf3);
  color: #fff;
  font-size: 14px;
  font-weight: 900;
  box-shadow: 0 5px 14px rgba(3,91,168,.24);
}

.user-summary {
  min-width: 74px;
  display: grid;
  gap: 1px;
  line-height: 1.1;
}

.user-summary strong {
  max-width: 120px;
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-summary small {
  opacity: .72;
  font-size: 10px;
}

.user-dropdown-menu {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 80;
  width: 220px;
  padding: 9px;
  border: 1px solid #cbdceb;
  border-radius: 14px;
  background: #fff;
  color: #153a5c;
  box-shadow: 0 18px 45px rgba(5,45,84,.22);
}

.user-dropdown-menu::before {
  content: "";
  position: absolute;
  top: -6px;
  right: 22px;
  width: 10px;
  height: 10px;
  border-top: 1px solid #cbdceb;
  border-left: 1px solid #cbdceb;
  background: #fff;
  transform: rotate(45deg);
}

.user-dropdown-identity {
  display: grid;
  gap: 3px;
  padding: 9px 10px 11px;
  border-bottom: 1px solid #e0ebf4;
}

.user-dropdown-identity strong {
  overflow-wrap: anywhere;
  font-size: 13px;
}

.user-dropdown-identity span {
  color: #6b8298;
  font-size: 11px;
}

.user-dropdown-links {
  display: grid;
  gap: 3px;
  padding-top: 7px;
}

.user-dropdown-links a {
  display: block;
  padding: 9px 10px;
  border-radius: 9px;
  color: #145a96;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.user-dropdown-links a:hover {
  background: #edf5fc;
}

.user-dropdown-menu form {
  margin: 8px 0 0;
}

.user-dropdown-menu button {
  width: 100%;
  padding: 10px 12px;
  border: 0;
  border-radius: 9px;
  background: #edf5fc;
  color: #145a96;
  cursor: pointer;
  font-weight: 800;
  text-align: left;
}

.user-dropdown-menu button:hover {
  background: #dfeefa;
}

html[data-view="modern"] .user-dropdown-toggle,
html[data-view="executive"] .user-dropdown-toggle {
  border-color: #ccdef0;
  background: #f5f9fd;
  color: #173b5c;
}

html[data-view="modern"] .user-dropdown[open] .user-dropdown-toggle,
html[data-view="modern"] .user-dropdown-toggle:hover,
html[data-view="executive"] .user-dropdown[open] .user-dropdown-toggle,
html[data-view="executive"] .user-dropdown-toggle:hover {
  background: #eaf4fc;
}

.admin-users-page,
.account-password-page {
  display: grid;
  gap: 20px;
  padding-bottom: 32px;
}

.admin-users-heading {
  margin-bottom: 0;
}

.admin-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.admin-summary-card,
.admin-panel,
.account-password-card {
  border: 1px solid #d5e3ef;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(18, 67, 109, .08);
}

.admin-summary-card {
  display: grid;
  gap: 6px;
  min-height: 138px;
  padding: 22px;
}

.admin-summary-card > span {
  color: #637d96;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .07em;
  text-transform: uppercase;
}

.admin-summary-card strong {
  color: #073a69;
  font-size: clamp(28px, 3vw, 38px);
  line-height: 1;
}

.admin-summary-card small,
.admin-panel-heading p,
.admin-users-table small,
.account-password-form small {
  color: #6b8298;
  font-size: 12px;
}

.admin-panel {
  padding: 22px;
}

.admin-panel-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 22px;
  margin-bottom: 18px;
}

.admin-panel-heading h2 {
  margin: 3px 0 0;
  color: #0a3b67;
  font-size: 22px;
}

.admin-panel-heading p {
  max-width: 520px;
  margin: 0;
  text-align: right;
}

.admin-create-form {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) minmax(145px, .6fr) minmax(180px, 1fr) minmax(180px, 1fr) auto;
  align-items: end;
  gap: 12px;
}

.admin-create-form label,
.admin-reset-password label,
.account-password-form label {
  display: grid;
  gap: 7px;
  color: #315a7c;
  font-size: 12px;
  font-weight: 800;
}

.admin-create-form input,
.admin-create-form select,
.admin-inline-form select,
.admin-reset-password input,
.account-password-form input {
  width: 100%;
  min-height: 43px;
  padding: 9px 11px;
  border: 1px solid #c7d9e8;
  border-radius: 10px;
  outline: 0;
  background: #f9fcff;
  color: #123b5e;
  font: inherit;
}

.admin-create-form input:focus,
.admin-create-form select:focus,
.admin-inline-form select:focus,
.admin-reset-password input:focus,
.account-password-form input:focus {
  border-color: #0788e8;
  box-shadow: 0 0 0 3px rgba(7, 136, 232, .13);
}

.admin-table-wrap {
  overflow-x: auto;
  border: 1px solid #e0eaf2;
  border-radius: 13px;
}

.admin-users-table,
.admin-audit-table {
  width: 100%;
  min-width: 950px;
  border-collapse: collapse;
  background: #fff;
}

.admin-audit-table {
  min-width: 670px;
}

.admin-users-table th,
.admin-users-table td,
.admin-audit-table th,
.admin-audit-table td {
  padding: 14px;
  border-bottom: 1px solid #e4edf4;
  color: #315a7c;
  font-size: 12px;
  text-align: left;
  vertical-align: top;
}

.admin-users-table th,
.admin-audit-table th {
  background: #f2f7fb;
  color: #516f89;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.admin-users-table tbody tr:last-child td,
.admin-audit-table tbody tr:last-child td {
  border-bottom: 0;
}

.admin-user-name {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 170px;
}

.admin-user-name > span:last-child {
  display: grid;
  gap: 3px;
}

.admin-user-name strong {
  color: #0b3e6a;
  font-size: 13px;
}

.admin-current-user,
.admin-status {
  display: inline-flex;
  align-items: center;
  margin-top: 8px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 900;
}

.admin-current-user {
  background: #eaf4fc;
  color: #14639f;
}

.admin-status.active {
  background: #def7e9;
  color: #147246;
}

.admin-status.locked {
  background: #fff0d5;
  color: #966000;
}

.admin-status.disabled {
  background: #f1f3f5;
  color: #6c7781;
}

.admin-inline-form,
.admin-user-actions {
  display: flex;
  align-items: center;
  gap: 7px;
}

.admin-inline-form {
  margin-bottom: 7px;
}

.admin-inline-form select {
  min-width: 120px;
  min-height: 36px;
  padding: 6px 8px;
}

.admin-user-actions {
  align-items: flex-start;
  flex-wrap: wrap;
  min-width: 220px;
}

.admin-user-actions form {
  margin: 0;
}

.admin-user-actions .btn,
.admin-inline-form .btn {
  min-height: 36px;
  padding: 8px 11px;
  font-size: 11px;
  white-space: nowrap;
}

.admin-reset-password {
  position: relative;
}

.admin-reset-password > summary {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  padding: 8px 11px;
  border: 1px solid #c8dceb;
  border-radius: 9px;
  background: #f3f8fc;
  color: #145a96;
  cursor: pointer;
  font-size: 11px;
  font-weight: 800;
  list-style: none;
  white-space: nowrap;
}

.admin-reset-password > summary::-webkit-details-marker {
  display: none;
}

.admin-reset-password[open] > summary {
  background: #e6f2fb;
}

.admin-reset-password form {
  position: static;
  width: 280px;
  display: grid;
  gap: 12px;
  margin-top: 8px;
  padding: 15px;
  border: 1px solid #cbddea;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 16px 35px rgba(12, 55, 92, .22);
}

.admin-permission-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.admin-permission-grid article {
  padding: 18px;
  border: 1px solid #d9e6f0;
  border-radius: 14px;
  background: #f8fbfe;
}

.admin-permission-grid h3 {
  margin: 0 0 10px;
  color: #0b4677;
  font-size: 16px;
}

.admin-permission-grid ul {
  display: grid;
  gap: 7px;
  margin: 0;
  padding-left: 18px;
  color: #56728a;
  font-size: 12px;
}

.account-password-card {
  width: min(100%, 620px);
  padding: 26px;
}

.account-password-form {
  display: grid;
  gap: 16px;
}

.account-password-actions {
  display: flex;
  gap: 10px;
  margin-top: 4px;
}

.admin-notice {
  margin-bottom: 18px;
  padding: 12px 14px;
  border: 1px solid;
  border-radius: 10px;
  font-size: 12px;
  line-height: 1.45;
}

.admin-notice.warning {
  border-color: #f0cf88;
  background: #fff7df;
  color: #795100;
}

.admin-notice.error {
  border-color: #efb4bd;
  background: #fff0f2;
  color: #9c2636;
}

html[data-view="dark"] .admin-summary-card,
html[data-view="dark"] .admin-panel,
html[data-view="dark"] .account-password-card,
html[data-view="dark"] .admin-users-table,
html[data-view="dark"] .admin-audit-table,
html[data-view="dark"] .admin-reset-password form {
  border-color: #244968;
  background: #0c2942;
  color: #dce9f6;
  box-shadow: 0 14px 34px rgba(0, 8, 17, .25);
}

html[data-view="dark"] .admin-summary-card > span,
html[data-view="dark"] .admin-summary-card small,
html[data-view="dark"] .admin-panel-heading p,
html[data-view="dark"] .admin-users-table small,
html[data-view="dark"] .account-password-form small,
html[data-view="dark"] .admin-users-table td,
html[data-view="dark"] .admin-audit-table td,
html[data-view="dark"] .admin-permission-grid ul {
  color: #9fb8cd;
}

html[data-view="dark"] .admin-summary-card strong,
html[data-view="dark"] .admin-panel-heading h2,
html[data-view="dark"] .admin-user-name strong,
html[data-view="dark"] .admin-permission-grid h3,
html[data-view="dark"] .admin-create-form label,
html[data-view="dark"] .admin-reset-password label,
html[data-view="dark"] .account-password-form label {
  color: #e6f2fb;
}

html[data-view="dark"] .admin-users-table th,
html[data-view="dark"] .admin-audit-table th {
  border-color: #244968;
  background: #102f49;
  color: #a8c2d8;
}

html[data-view="dark"] .admin-table-wrap,
html[data-view="dark"] .admin-users-table td,
html[data-view="dark"] .admin-audit-table td,
html[data-view="dark"] .admin-permission-grid article {
  border-color: #244968;
}

html[data-view="dark"] .admin-permission-grid article {
  background: #102f49;
}

html[data-view="dark"] .admin-create-form input,
html[data-view="dark"] .admin-create-form select,
html[data-view="dark"] .admin-inline-form select,
html[data-view="dark"] .admin-reset-password input,
html[data-view="dark"] .account-password-form input {
  border-color: #315776;
  background: #081e34;
  color: #e6f2fb;
}

html[data-view="dark"] .user-dropdown-menu,
html[data-view="dark"] .user-dropdown-menu::before {
  border-color: #315776;
  background: #0c2942;
  color: #dce9f6;
}

html[data-view="dark"] .user-dropdown-identity {
  border-color: #244968;
}

html[data-view="dark"] .user-dropdown-identity span {
  color: #9fb8cd;
}

html[data-view="dark"] .user-dropdown-links a,
html[data-view="dark"] .user-dropdown-menu button {
  color: #b8dcfa;
}

html[data-view="dark"] .user-dropdown-links a:hover,
html[data-view="dark"] .user-dropdown-menu button:hover {
  background: #153b5a;
}

@media (max-width: 1180px) {
  .admin-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-create-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-create-form .btn {
    justify-self: start;
  }
}

@media (max-width: 700px) {
  .admin-summary-grid,
  .admin-create-form,
  .admin-permission-grid {
    grid-template-columns: 1fr;
  }

  .admin-panel,
  .account-password-card {
    padding: 17px;
    border-radius: 14px;
  }

  .admin-panel-heading {
    display: grid;
    gap: 8px;
  }

  .admin-panel-heading p {
    text-align: left;
  }

  .account-password-actions {
    align-items: stretch;
    flex-direction: column;
  }
}

@media (max-width: 1320px) {
  .user-summary {
    display: none;
  }
}

@media (max-width: 560px) {
  .user-dropdown-toggle {
    min-height: 42px;
    padding: 3px 7px 3px 3px;
  }

  .user-avatar {
    width: 34px;
    height: 34px;
  }

  .user-dropdown-toggle .nav-chevron {
    display: none;
  }
}