/**
 * CookieShift Design Polish v7
 * Premium enterprise SaaS visual system — CSS-only, no logic changes.
 * 8px scale: 4 · 8 · 12 · 16 · 20 · 24 · 32 · 40 · 48 · 64 · 80 · 96
 */

/* ─── Design tokens (8px grid, Stripe/Vercel-inspired) ─── */
:root {
  /* Surfaces */
  --ds-color-bg: #f8fafc;
  --ds-color-surface: #ffffff;
  --ds-color-border: #e2e8f0;
  --ds-color-neutral: #0f172a;
  --ds-color-muted: #666666;
  --ds-color-muted-2: #94a3b8;

  /* Brand */
  --ds-color-primary: #2562ff;
  --ds-color-primary-hover: #0f172a;
  --ds-color-primary-muted: #ccfbf1;
  --ds-color-on-primary: #ffffff;
  --ds-color-shell-accent: #2562ff;
  --ds-color-shell-accent-muted: #eef2ff;

  /* Semantic */
  --ds-color-success: #10b981;
  --ds-color-danger: #ef4444;
  --ds-color-warning: #f59e0b;
  --ds-color-info: #3b82f6;
  --ds-color-focus-ring: rgba(13, 148, 136, 0.35);

  /* Typography */
  --ds-font-family: "DM Sans", Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --ds-font-mono: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --ds-font-size-xs: 13px;
  --ds-font-size-sm: 15px;
  --ds-font-size-md: 16px;
  --ds-font-size-lg: 18px;
  --ds-font-size-xl: 24px;
  --ds-font-size-2xl: 30px;
  --ds-font-weight-normal: 400;
  --ds-font-weight-medium: 500;
  --ds-font-weight-semibold: 600;
  --ds-font-weight-bold: 700;

  /* Spacing (8px system — no arbitrary values) */
  --ds-space-xs: 4px;
  --ds-space-sm: 8px;
  --ds-space-md: 12px;
  --ds-space-lg: 16px;
  --ds-space-xl: 24px;
  --ds-space-2xl: 32px;
  --ds-space-3xl: 40px;
  --ds-space-4xl: 48px;
  --ds-space-5xl: 64px;
  --ds-space-6xl: 80px;
  --ds-space-7xl: 96px;

  /* Layout rhythm — widescreen-first */
  --ds-page-max: 1760px;
  --ds-page-gutter: var(--ds-space-4xl);
  --ds-page-top: var(--ds-space-3xl);
  --ds-page-bottom: var(--ds-space-7xl);
  --ds-hero-to-stats: var(--ds-space-2xl);
  --ds-section-gap: var(--ds-space-2xl);
  --ds-stack-gap: var(--ds-space-xl);
  --ds-card-gap: var(--ds-space-xl);

  /* Sidebar */
  --ds-sidebar-hover-bg: rgba(99, 102, 241, 0.12);
  --ds-sidebar-hover-text: #f8fafc;
  --ds-sidebar-active-bg: rgba(99, 102, 241, 0.22);
  --ds-sidebar-active-border: #818cf8;
  --ds-sidebar-muted-text: rgba(248, 250, 252, 0.68);

  /* Radius */
  --ds-radius-sm: 8px;
  --ds-radius-md: 12px;
  --ds-radius-lg: 16px;
  --ds-radius-xl: 20px;

  /* Elevation */
  --ds-shadow-flat: 0 1px 2px rgba(15, 23, 42, 0.04), 0 1px 3px rgba(15, 23, 42, 0.06);
  --ds-shadow-elevated: 0 4px 6px -1px rgba(15, 23, 42, 0.06), 0 10px 24px -4px rgba(15, 23, 42, 0.08);
  --ds-shadow-button: 0 1px 2px rgb(66 83 248 / 30%);
  --ds-shadow-button-hover: 0 4px 12px rgb(56 67 208 / 21%);

  /* Components */
  --ds-card-radius: var(--ds-radius-lg);
  --ds-card-padding: var(--ds-space-2xl);
  --ds-card-header-padding: var(--ds-space-xl) var(--ds-space-2xl);
  --ds-card-footer-padding: var(--ds-space-xl) var(--ds-space-2xl);
  --ds-card-border: 1px solid var(--ds-color-border);
  --ds-field-gap: 8px;
  --ds-field-label-size: var(--ds-font-size-sm);
  --ds-field-input-radius: var(--ds-radius-sm);
  --ds-field-input-padding-y: 10px;
  --ds-field-input-padding-x: 14px;
  --ds-btn-radius: var(--ds-radius-sm);
  --ds-btn-height: 40px;
  --ds-btn-padding-y: 0;
  --ds-btn-padding-x: 20px;

  /* Legacy aliases used in bundle */
  --cmp-primary: var(--ds-color-primary);
  --cmp-primary-hover: var(--ds-color-primary-hover);
  --cmp-secondary: var(--ds-color-primary-muted);
  --cmp-neutral: var(--ds-color-neutral);
  --cmp-success: var(--ds-color-success);
  --cmp-danger: var(--ds-color-danger);
  --cmp-surface: var(--ds-color-surface);
  --cmp-bg: var(--ds-color-bg);
  --cmp-border: var(--ds-color-border);
  --cmp-muted: var(--ds-color-muted);
  --cmp-muted-2: var(--ds-color-muted-2);
  --color-background-primary: var(--ds-color-surface);
  --color-background-secondary: var(--ds-color-bg);
  --color-border-primary: var(--ds-color-border);
  --color-border-secondary: #e2e8f0;
  --color-border-tertiary: #eaeaea;
  --color-text-primary: var(--ds-color-neutral);
  --color-text-secondary: var(--ds-color-muted);
  --color-text-tertiary: var(--ds-color-muted-2);
  --font-sans: var(--ds-font-family);
  --sidebar-bg: #ffffff;
  --sidebar-text-active: var(--ds-color-neutral);
  --border-color: var(--ds-color-border);
  --text-secondary: var(--ds-color-muted);
  --text-muted: var(--ds-color-muted-2);
  --primary: var(--ds-color-primary);
  --accent-purple: var(--ds-color-shell-accent);
}

/* ─── Base ─── */
html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

body,
#root {
  background: var(--ds-color-bg);
  color: var(--ds-color-neutral);
  font-family: var(--ds-font-family);
  font-size: var(--ds-font-size-md);
  line-height: 1.5;
}

/* Site-wide: DM Sans replaces legacy DM Mono utility classes */
.ai-usage-mono,
.acc-mono,
.bill-mono,
.cr-mono,
.ai-set-mono,
.sys-mono,
[class*="-mono"] {
  font-family: var(--ds-font-family) !important;
  font-variant-numeric: tabular-nums;
}

#initial-loader,
.initial-loader {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: var(--ds-color-bg);
  color: #2563eb;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.initial-loader-dot {
  width: 18px;
  height: 18px;
  border: 2px solid #bfdbfe;
  border-top-color: #2563eb;
  background: transparent;
  border-radius: 50%;
  animation: cs-inline-spin 0.75s linear infinite;
}

@keyframes cs-inline-spin {
  to {
    transform: rotate(360deg);
  }
}

/* Inline loading text — spinner + meaningful color */
.cs-inline-loading,
.cr-loading,
.bill-loading,
.acc-loading,
.ai-set-loading,
.ai-usage-loading,
.policy-gen-loading,
.scan-auto-monitor__loading,
.cr-table-empty.scan-auto-monitor__loading {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #2563eb;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  margin: 0;
}

.cs-inline-loading::before,
.cr-loading::before,
.bill-loading::before,
.acc-loading::before,
.ai-set-loading::before,
.ai-usage-loading::before,
.policy-gen-loading::before,
.scan-auto-monitor__loading::before,
.cr-table-empty.scan-auto-monitor__loading::before {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border: 2px solid #bfdbfe;
  border-top-color: #2563eb;
  border-radius: 50%;
  animation: cs-inline-spin 0.75s linear infinite;
}

.card.cs-inline-loading,
.sys-settings-card > .cs-inline-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 120px;
  width: 100%;
}

td.cs-inline-loading,
th.cs-inline-loading {
  display: table-cell;
  color: #2563eb;
  font-weight: 600;
}

td.cs-inline-loading::before,
th.cs-inline-loading::before {
  display: inline-block;
  vertical-align: -3px;
  margin-right: 10px;
}

.fullpage-loader {
  color: #2563eb;
}

.fullpage-loader-spinner {
  border-color: #bfdbfe;
  border-top-color: #2563eb;
}

.fullpage-loader-text {
  color: #2563eb;
  font-weight: 600;
  margin: 0;
}

/* ─── App shell & layout ─── */
.app-shell {
  background: var(--ds-color-bg);
}

.app-page,
.main-content {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.app-container,
.main-container {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  flex: 1;
  width: 100%;
  min-height: 0;
  max-width: var(--ds-page-max);
  margin-left: auto;
  margin-right: auto;
  padding: 40px 50px 40px;
}
.app-main {
  padding: var(--ds-page-top) 0 var(--ds-page-bottom);
}

@media (max-width: 1280px) {
  .app-container, .main-container {
    padding-left: var(--ds-space-2xl);
    padding-right: var(--ds-space-2xl);
    padding-top: var(--ds-space-2xl);
    padding-bottom: var(--ds-space-2xl);
}
}

@media (max-width: 1024px) {
  .app-container,
  .main-container {
    padding-left: var(--ds-space-2xl);
    padding-right: var(--ds-space-2xl);
    padding-top: var(--ds-space-2xl);
    padding-bottom: var(--ds-space-2xl);
  }
}

@media (max-width: 768px) {
  .app-container,
  .main-container {
    padding-left: var(--ds-space-xl);
    padding-right: var(--ds-space-xl);
    padding-top: var(--ds-space-xl);
    padding-bottom: var(--ds-space-xl);
  }
}

@media (max-width: 640px) {
  .app-container,
  .main-container {
    padding-left: var(--ds-space-lg);
    padding-right: var(--ds-space-lg);
    padding-top: var(--ds-space-xl);
    padding-bottom: var(--ds-space-xl);
  }
}

.product-hub-page,
.hc-premium-page,
.consent-premium-page {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* ─── Sidebar — dark shell (Linear / GitHub style) ─── */
.app-sidebar,
.sidebar {
  background: var(--ds-color-surface);
  border-right: 1px solid var(--ds-color-border);
  padding: var(--ds-space-lg) var(--ds-space-md) var(--ds-space-xl);
  gap: var(--ds-space-sm);
  box-shadow: 1px 0 0 rgba(15, 23, 42, 0.04);
}

.app-shell-dark .sidebar,
.app-shell-dark .app-sidebar {
  background: #0f172a;
  border-right-color: #1e293b;
}

.app-sidebar-brand,
.cmp-sidebar-logo.logo-area {
  padding: var(--ds-space-sm) var(--ds-space-sm) var(--ds-space-lg);
  font-size: var(--ds-font-size-lg);
  font-weight: var(--ds-font-weight-bold);
  letter-spacing: -0.03em;
}

.nav-item,
.app-sidebar-link.nav-item {
  display: flex;
  align-items: center;
  gap: 12px;
  height: 36px;
  min-height: 36px;
  border-radius: var(--ds-radius-sm);
  padding: 0 10px;
  margin: 1px 0;
  font-size: 14px;
  font-weight: var(--ds-font-weight-medium);
  line-height: 1.25;
  color: var(--ds-sidebar-muted-text);
  border-left: 3px solid transparent;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.app-sidebar-link.nav-item .nav-icon,
.app-sidebar-link.nav-item svg.nav-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  color: inherit;
  opacity: 0.85;
  transition: color 0.15s ease, opacity 0.15s ease;
}

/* Dark sidebar hover — readable text, subtle lift */
.app-shell-dark .app-sidebar-link.nav-item:hover,
.app-shell-dark .nav-item:hover {
  background: var(--ds-sidebar-hover-bg);
  color: var(--ds-sidebar-hover-text);
  border-left-color: transparent;
}

.app-shell-dark .app-sidebar-link.nav-item:hover .nav-icon,
.app-shell-dark .app-sidebar-link.nav-item:hover svg.nav-icon {
  color: #c7d2fe;
  opacity: 1;
}

.app-shell-dark .app-sidebar-link.nav-item.is-active,
.app-shell-dark .nav-item.active {
  background: var(--ds-sidebar-active-bg);
  color: #ffffff;
  border-left-color: var(--ds-sidebar-active-border);
  box-shadow: none;
  font-weight: var(--ds-font-weight-semibold);
}
.app-shell-dark.sidebar-collapsed .app-sidebar-link.nav-item.is-active,
.app-shell-dark.sidebar-collapsed .nav-item.active {
  border-top: solid 2px;
  border-left: none;
  border-top-color: var(--ds-sidebar-active-border);
}

.app-shell-dark .app-sidebar-link.nav-item.is-active .nav-icon,
.app-shell-dark .app-sidebar-link.nav-item.is-active svg.nav-icon {
  color: #a5b4fc;
  opacity: 1;
}

.app-shell-dark .app-sidebar-link.nav-item:focus-visible,
.app-shell-dark .nav-item:focus-visible {
  outline: 2px solid #818cf8;
  outline-offset: 2px;
}

/* Light sidebar (non-dark shell) */
.app-shell:not(.app-shell-dark) .app-sidebar-link.nav-item:hover,
.app-shell:not(.app-shell-dark) .nav-item:hover {
  background: #eaeaea;
  color: var(--ds-color-neutral);
}

.app-shell:not(.app-shell-dark) .app-sidebar-link.nav-item.is-active,
.app-shell:not(.app-shell-dark) .nav-item.active {
  background: var(--ds-color-shell-accent-muted);
  color: var(--ds-color-shell-accent);
  border-left-color: var(--ds-color-shell-accent);
  font-weight: var(--ds-font-weight-semibold);
}

/* ─── Page headers ─── */
.product-hub-hero {
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, rgba(255, 255, 255, 1) 48%, rgba(13, 148, 136, 0.04) 100%);
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-radius-xl);
  padding: var(--ds-space-xl) var(--ds-space-xl);
  box-shadow: var(--ds-shadow-flat);
}

.product-hub-hero__title {
  font-size: var(--ds-font-size-2xl);
  font-weight: var(--ds-font-weight-bold);
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: var(--ds-color-neutral);
  margin: 0 0 var(--ds-space-sm);
}

.product-hub-hero__desc,
.product-hub-hero__subtitle {
  color: var(--ds-color-muted);
  font-size: var(--ds-font-size-md);
  line-height: 1.6;
  max-width: 62ch;
}

.product-hub-hero__eyebrow {
  color: var(--ds-color-shell-accent);
  font-weight: var(--ds-font-weight-semibold);
  letter-spacing: 0.08em;
}

/* ─── Cards ─── */
.card,
.product-hub-stat-card,
.prem-stat-card,
.scan-card,
.consent-premium-panel,
.product-hub-section,
.config-section-card,
.gs-onboard {
  background: var(--ds-color-surface);
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-radius-lg);
  box-shadow: var(--ds-shadow-flat);
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.card {
  padding: var(--ds-card-padding);
}

.card:hover,
.product-hub-stat-card:hover,
.scan-card:hover {
  border-color: #cbd5e1;
  box-shadow: var(--ds-shadow-elevated);
}

.product-hub-stat-card {
  padding: var(--ds-space-lg) var(--ds-space-xl);
}

.product-hub-stat-grid {
  gap: var(--ds-space-lg);
}

.consent-premium-panel {
  padding: 26px 32px 32px;
}

.product-hub-section {
  overflow: hidden;
}

.config-section-header {
  background: #f8fafc;
  border-bottom: 1px solid var(--ds-color-border);
  padding: var(--ds-space-lg) var(--ds-space-2xl);
  font-size: var(--ds-font-size-md);
}

/* ─── Buttons ─── */
.btn,
.consent-setup-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ds-space-sm);
  min-height: var(--ds-btn-height);
  border-radius: var(--ds-btn-radius);
  padding: var(--ds-btn-padding-y) var(--ds-btn-padding-x);
  font-size: var(--ds-font-size-sm);
  font-weight: var(--ds-font-weight-semibold);
  letter-spacing: -0.01em;
  line-height: 1.2;
  box-shadow: var(--ds-shadow-button);
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease, color 0.15s ease;
}

.btn:hover:not(:disabled) {
  box-shadow: var(--ds-shadow-button-hover);
  transform: translateY(-1px);
}

.btn:active:not(:disabled) {
  transform: translateY(0);
}

.btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  box-shadow: none;
}

.btn.secondary,
.btn-secondary {
  background: var(--ds-color-surface);
  color: var(--ds-color-neutral);
  border: 1px solid var(--ds-color-border);
  box-shadow: var(--ds-shadow-flat);
}

.btn.secondary:hover:not(:disabled),
.btn-secondary:hover:not(:disabled) {
  background: #f8fafc;
  border-color: #cbd5e1;
}

.btn.ghost,
.btn-ghost {
  background: transparent;
  border-color: transparent;
  color: var(--ds-color-muted);
  box-shadow: none;
}

.btn.ghost:hover:not(:disabled),
.btn-ghost:hover:not(:disabled) {
  background: #eaeaea;
  color: var(--ds-color-neutral);
}

.btn.danger,
.btn-danger {
  background: var(--ds-color-danger);
  border-color: var(--ds-color-danger);
}

/* ─── Forms ─── */
.field {
  gap: var(--ds-field-gap);
  margin-bottom: var(--ds-space-lg);
}

.field label {
  font-size: var(--ds-font-size-sm);
  font-weight: var(--ds-font-weight-medium);
  color: var(--ds-color-neutral);
  opacity: 1;
  letter-spacing: -0.01em;
}

.field input,
.field select,
.field textarea,
.ai-set-input,
.cs-field input,
.cs-field select,
.cs-field textarea {
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-field-input-radius);
  padding: var(--ds-field-input-padding-y) var(--ds-field-input-padding-x);
  font-size: var(--ds-font-size-md);
  background: var(--ds-color-surface);
  color: var(--ds-color-neutral);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.field input::placeholder,
.field textarea::placeholder {
  color: var(--ds-color-muted-2);
}

.field input:hover,
.field select:hover,
.field textarea:hover {
  border-color: #cbd5e1;
}

.field input:focus-visible,
.field select:focus-visible,
.field textarea:focus-visible {
  outline: none;
  border-color: var(--ds-color-primary);
  box-shadow: 0 0 0 3px var(--ds-color-focus-ring);
}

.product-hub-panel-note {
  color: var(--ds-color-muted);
  font-size: 16px;
  line-height: 1.6;
  margin-top: var(--ds-space-xs);
}
.product-hub-config-card__subsection .product-hub-panel-note {
  margin-bottom: 20px;
}
/* ─── Tables ─── */
table {
  font-size: var(--ds-font-size-sm);
}

.scan-cookie-table th,
table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  text-align: left;
  font-size: var(--ds-font-size-xs);
  font-weight: var(--ds-font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ds-color-muted);
  background: #f8fafc;
  border-bottom: 1px solid var(--ds-color-border);
  padding: var(--ds-space-lg) var(--ds-space-xl);
}

.scan-cookie-table td,
table tbody td {
  padding: var(--ds-space-lg) var(--ds-space-xl);
  color: #334155;
  border-bottom: 1px solid #eaeaea;
  vertical-align: middle;
}

table tbody tr:hover td {
  background: #f8fafc;
}

table tbody tr:last-child td {
  border-bottom: none;
}

/* ─── Badges & status ─── */
.badge-success,
.badge-warning,
.badge-danger,
.badge-info,
.badge-neutral,
.app-status-chip {
  border-radius: 999px;
  padding: 4px 10px;
  font-size: var(--ds-font-size-xs);
  font-weight: var(--ds-font-weight-semibold);
  letter-spacing: 0.02em;
}

.app-status-chip--ok {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #065f46;
}

.app-status-chip--warn {
  background: #fffbeb;
  border-color: #fde68a;
  color: #92400e;
}

.system-health-status {
  border-radius: 999px;
  font-weight: var(--ds-font-weight-semibold);
}

/* ─── Modals ─── */
.cmp-report-modal-overlay,
.modal-overlay {
  background: rgba(15, 23, 42, 0.45);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  padding: var(--ds-space-lg);
}

.cmp-report-modal,
.modal-content {
  border-radius: var(--ds-radius-xl);
  border: 1px solid var(--ds-color-border);
  box-shadow: 0 24px 48px rgba(15, 23, 42, 0.16);
}

/* ─── Empty states ─── */
.product-hub-empty-state {
  border: 1px dashed #cbd5e1;
  border-radius: var(--ds-radius-xl);
  padding: var(--ds-space-4xl) var(--ds-space-xl);
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.product-hub-empty-state__title {
  font-size: var(--ds-font-size-lg);
  font-weight: var(--ds-font-weight-semibold);
  color: var(--ds-color-neutral);
  margin-bottom: var(--ds-space-sm);
}

.product-hub-empty-state__desc {
  color: var(--ds-color-muted);
  font-size: var(--ds-font-size-md);
  line-height: 1.6;
  max-width: 48ch;
  margin: 0 auto var(--ds-space-lg);
}

/* ─── Loading / skeleton ─── */
.dash-skeleton-card {
  border-radius: var(--ds-radius-md);
  border-color: #e2e8f0;
  background: linear-gradient(90deg, #f1f5f9 0%, #e2e8f0 45%, #f1f5f9 90%) 0 0 / 240% 100%;
}

.dash-skeleton-grid {
  gap: var(--ds-space-md);
}

/* ─── Scanner ─── */
.scan-section {
  margin-bottom: var(--ds-section-gap);
}

.scan-card {
  padding: var(--ds-space-2xl);
}

.scan-card-title {
  font-size: var(--ds-font-size-lg);
  font-weight: var(--ds-font-weight-bold);
  letter-spacing: -0.02em;
  margin-bottom: var(--ds-space-lg);
}

.overview-stats {
  gap: var(--ds-space-xl);
}

/* ─── Banner builder preview ─── */
.cs-premium-cmp {
  --cs-radius: var(--ds-radius-lg);
  --cs-shadow: var(--ds-shadow-elevated);
}

.cs-premium-cmp .panel-wrap {
  border-radius: var(--ds-radius-xl);
  box-shadow: var(--ds-shadow-elevated);
}

/* ─── Billing & pricing ─── */
.billing-plan-grid {
  gap: var(--ds-space-lg);
}

.prem-banner {
  border-radius: var(--ds-radius-md);
  border: 1px solid var(--ds-color-border);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.prem-banner:hover {
  border-color: #cbd5e1;
  box-shadow: var(--ds-shadow-flat);
}

/* ─── Login ─── */
.login-forgot-link {
  color: var(--ds-color-primary);
}

/* ─── Help & discoverability ─── */
.contextual-help-link,
.page-discoverability__link {
  
  font-weight: var(--ds-font-weight-medium);
  text-decoration: none;
  transition: color 0.15s ease;
}

.contextual-help-link:hover,
.page-discoverability__link:hover {
  color: var(--ds-color-primary-hover);
  text-decoration: underline;
}

.page-discoverability {
  gap: var(--ds-space-sm);
  padding: var(--ds-space-md) 0;
}

/* ─── Onboarding ─── */
.gs-onboard {
  border-radius: var(--ds-radius-xl);
  box-shadow: var(--ds-shadow-elevated);
}

.gs-onboard__title {
  letter-spacing: -0.03em;
}

/* ─── Topbar / header chips ─── */
.topbar,
.app-topbar {
  background: var(--ds-color-surface);
  border-bottom: 1px solid var(--ds-color-border);
  padding: var(--ds-space-md) var(--ds-space-xl);
  min-height: 64px;
}

.app-content-footer {
  margin-top: var(--ds-space-2xl);
  padding: var(--ds-space-xl) 0 var(--ds-space-lg);
  gap: var(--ds-space-md);
}

.app-header-right {
  gap: var(--ds-space-md);
}

/* Header profile dropdown — item icons */
.cmp-dropdown-panel--profile .cmp-dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
}

.cmp-dropdown-panel--profile .cmp-dropdown-item::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-color: #3668e9;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: 16px 16px;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: 16px 16px;
}

.cmp-dropdown-panel--profile .cmp-dropdown-item:nth-child(1)::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='5'/%3E%3Cpath d='M20 21a8 8 0 0 0-16 0'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='5'/%3E%3Cpath d='M20 21a8 8 0 0 0-16 0'/%3E%3C/svg%3E");
}

.cmp-dropdown-panel--profile .cmp-dropdown-item:nth-child(2)::before {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.cmp-dropdown-panel--profile .cmp-dropdown-item.cmp-dropdown-item--danger::before {
  background-color: #ef4444;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpolyline points='16 17 21 12 16 7'/%3E%3Cline x1='21' x2='9' y1='12' y2='12'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpolyline points='16 17 21 12 16 7'/%3E%3Cline x1='21' x2='9' y1='12' y2='12'/%3E%3C/svg%3E");
}

.cmp-dropdown-panel--profile .cmp-dropdown-item:hover::before,
.cmp-dropdown-panel--profile .cmp-dropdown-item:focus-visible::before {
  background-color: currentColor;
}

/* ─── Focus & accessibility ─── */
:focus-visible {
  outline: none;
  outline-offset: 0;
}

.btn:focus-visible,
.nav-item:focus-visible,
a:focus-visible {
  outline: none;
  outline-offset: 0;
}

/* ─── Alerts / toasts ─── */
.hc-docs-unavailable-banner {
  border-radius: var(--ds-radius-md);
  padding: var(--ds-space-md) var(--ds-space-lg);
}

.premium-cmp-toast,
.cs-premium-cmp .premium-cmp-toast {
  border-radius: var(--ds-radius-md);
  box-shadow: var(--ds-shadow-elevated);
}

/* ─── Consent premium accordions ─── */
.consent-premium-panel__head {
  padding-bottom: var(--ds-space-md);
  margin-bottom: var(--ds-space-md);
}

.consent-premium-stack {
  gap: 30px;
}

/* ─── Responsive polish ─── */
@media (max-width: 1024px) {
  .product-hub-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .app-sidebar {
    width: 260px;
  }
}

@media (max-width: 640px) {
  .product-hub-hero {
    padding: var(--ds-space-lg);
  }

  .product-hub-hero__title {
    font-size: var(--ds-font-size-xl);
  }

  .product-hub-stat-grid {
    grid-template-columns: 1fr;
  }

  .scan-card {
    padding: var(--ds-space-lg);
  }

  table {
    min-width: 0;
  }
}

/* ─── Reduced motion ─── */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .btn:hover:not(:disabled) {
    transform: none;
  }
}

/* ═══════════════════════════════════════════════════════════
   INFORMATION ARCHITECTURE — visual hierarchy & disclosure
   (Preserves all content; makes beginner path scannable)
   ═══════════════════════════════════════════════════════════ */

/* Page rhythm: hero → stats → primary panels → collapsed advanced */
.product-hub-page,
.consent-premium-page,
.hc-premium-page {
  width: 100%;
  max-width: none;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.product-hub-hero__subtitle {
  font-size: var(--ds-font-size-lg);
  line-height: 1.65;
  color: var(--ds-color-muted);
  max-width: 58ch;
}

/* Status cards read as health, not raw metrics */
.product-hub-stat-grid {
  margin-bottom: 0;
  gap: var(--ds-space-lg);
}
dl.scan-coverage-grid dt {
  font-size: 15px !important;
}
dl.scan-coverage-grid dd {
  font-size: 19px;
}
section.scan-diagnostics-panel h3,
section.scan-coverage-summary h3 {
  font-size: 20px !important;
}
.cr-panel p {
  font-size: 16px;
  margin-bottom: 17px !important;
}
.product-hub-stat-card {
  min-height: 96px;
  display: flex;
  flex-direction: column;
  justify-content: start;
}

.product-hub-stat-card [class*="value"],
.product-hub-stat-card strong {
  font-size: 22px;
  font-weight: var(--ds-font-weight-bold);
  letter-spacing: -0.02em;
}

/* Primary configuration panels — always visible, approachable */
.consent-premium-stack {
  gap: 30px;
}

.consent-premium-panel:first-of-type {
  border-color: #cbd5e1;
}

.consent-premium-panel__title {
  font-size: var(--ds-font-size-lg);
  font-weight: var(--ds-font-weight-bold);
  letter-spacing: -0.02em;
}

.consent-premium-panel__desc {
  color: var(--ds-color-muted);
  font-size: var(--ds-font-size-md);
  line-height: 1.6;
  max-width: 80%;
}

/* Toggle rows feel like primary actions, not buried checkboxes */
.product-hub-toggle-row {
  background: #f8fafc;
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-radius-md);
  padding: var(--ds-space-md) var(--ds-space-lg);
  margin-bottom: var(--ds-space-lg);
  transition: background 0.15s ease, border-color 0.15s ease;
}

/* Modern checkboxes — dashboard & app pages (excludes landing + toggle switches) */
body:not(.cookieshift-landing) input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  min-width: 20px;
  margin: 0;
  border: 2px solid #cbd5e1;
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  position: relative;
  flex-shrink: 0;
  vertical-align: middle;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

body:not(.cookieshift-landing) input[type="checkbox"]:hover:not(:disabled) {
  border-color: #aecff3
}

body:not(.cookieshift-landing) input[type="checkbox"]:checked {
  background: #2563eb;
  border-color: #2563eb;
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.25);
}

body:not(.cookieshift-landing) input[type="checkbox"]:checked::after {
  content: "";
  position: absolute;
  left: 6px;
  top: 2px;
  width: 3px;
  height: 7px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

body:not(.cookieshift-landing) input[type="checkbox"]:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35);
}

body:not(.cookieshift-landing) input[type="checkbox"]:checked:focus-visible {
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35), 0 1px 2px rgba(37, 99, 235, 0.25);
}

body:not(.cookieshift-landing) input[type="checkbox"]:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Preserve hidden checkbox inputs inside toggle switches */
.scan-auto-monitor__switch > input[type="checkbox"],
.cs-premium-cmp .toggle > input[type="checkbox"] {
  width: 100%;
  height: 100%;
  min-width: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  opacity: 0;
  position: absolute;
  inset: 0;
  z-index: 1;
}

.scan-auto-monitor__switch > input[type="checkbox"]::after,
.cs-premium-cmp .toggle > input[type="checkbox"]::after {
  content: none;
  display: none;
}

.scan-auto-monitor__switch > input[type="checkbox"]:hover:not(:disabled),
.cs-premium-cmp .toggle > input[type="checkbox"]:hover:not(:disabled),
.scan-auto-monitor__switch > input[type="checkbox"]:checked,
.cs-premium-cmp .toggle > input[type="checkbox"]:checked,
.scan-auto-monitor__switch > input[type="checkbox"]:focus-visible,
.cs-premium-cmp .toggle > input[type="checkbox"]:focus-visible {
  border: none;
  background: transparent;
  box-shadow: none;
}

/* Checked-state row highlights for common checkbox labels */
body:not(.cookieshift-landing) .product-hub-toggle-row:has(input[type="checkbox"]:checked),
body:not(.cookieshift-landing) .checkbox-row:has(input[type="checkbox"]:checked),
body:not(.cookieshift-landing) .toggle-row:has(input[type="checkbox"]:checked) {
  background: #eff6ff;
  border-color: #bfdbfe;
}

/* Technical signal grid — visually secondary (still accessible) */
.product-hub-signal-grid {
  gap: var(--ds-space-md);
  padding: var(--ds-space-md);
  background: #f8fafc;
  border: 1px dashed #e2e8f0;
  border-radius: var(--ds-radius-md);
}

.product-hub-signal-card {
  background: var(--ds-color-surface);
  padding: var(--ds-space-md) var(--ds-space-lg);
  font-size: var(--ds-font-size-sm);
}

.product-hub-signal-card code {
  font-size: var(--ds-font-size-md);
  font-weight: var(--ds-font-weight-semibold);
  color: var(--ds-color-muted);
  text-transform: none;
}

.product-hub-signal-card--granted {
  border-color: #a7f3d0;
  background: #f0fdf4;
}

.product-hub-signal-card--denied {
  border-color: #fecaca;
  background: #fef2f2;
}

/* Collapsible advanced sections — clear progressive disclosure */
.product-hub-section:not(.is-open) {
  background: #f8fafc;
  border-style: dashed;
}

.product-hub-section.is-open {
  border-style: solid;
  box-shadow: var(--ds-shadow-elevated);
}

.product-hub-section__head {
  padding: 15px 20px 17px;
}

.product-hub-section:not(.is-open) .product-hub-section__title::before,
.product-hub-section.is-open .product-hub-section__title::before {
  content: none;
}

.product-hub-section__head-meta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.product-hub-section__chevron {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  color: #3668e9;
  opacity: 1;
  transition: transform 0.2s ease, color 0.15s ease;
}

.product-hub-section__head:hover .product-hub-section__chevron {
  color: #2562ff;
}

.product-hub-section.is-open .product-hub-section__chevron {
  transform: rotate(180deg);
  color: #2562ff;
}

.product-hub-section__desc {
  color: var(--ds-color-muted);
  font-size: 15px;
  margin-top: var(--ds-space-xs);
}

.product-hub-section__body {
  padding: 24px var(--ds-space-xl) var(--ds-space-xl);
  border-top: 1px solid var(--ds-color-border);
}

/* Nested technical subsections stay compact inside accordions */
.product-hub-config-card__subsection {
  padding: 0;
  border-bottom: none;
}

.product-hub-config-card__subsection h4 {
  font-size: var(--ds-font-size-md);
  font-weight: var(--ds-font-weight-semibold);
  color: var(--ds-color-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: var(--ds-space-sm);
}

.product-hub-troubleshooting__list {
  font-size: var(--ds-font-size-md);
  line-height: 1.6;
  color: var(--ds-color-muted);
}

/* Setup wizard — guide users step by step */
.product-hub-wizard {
  gap: var(--ds-space-md);
  margin-bottom: var(--ds-space-xl);
  padding: var(--ds-space-md);
  background: linear-gradient(180deg, #eef2ff 0%, #f8fafc 100%);
  border: 1px solid #e0e7ff;
  border-radius: var(--ds-radius-lg);
}

.product-hub-wizard__step {
  border-radius: var(--ds-radius-md);
  box-shadow: var(--ds-shadow-flat);
}

.product-hub-wizard__step.is-current {
  border-color: var(--ds-color-shell-accent);
  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.15);
}

.product-hub-wizard__step.is-done {
  border-color: #a7f3d0;
  background: #f0fdf4;
}

.product-hub-wizard__copy strong {
  display: block;
  font-size: var(--ds-font-size-lg);
  margin-bottom: 5px;
}

.product-hub-wizard__copy span {
  font-size: var(--ds-font-size-sm);
  color: var(--ds-color-muted);
  line-height: 1.45;
}

/* Tables: bounded height, no endless page scroll for data grids */
.scan-cookie-table,
.history-table-wrap,
.product-hub-table-wrap,
.table-scroll {
  max-height: min(520px, 60vh);
  overflow: auto;
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-radius-md);
  background: var(--ds-color-surface);
}

/* Code / JSON blocks — developer territory, visually contained */
.product-hub-code-block,
pre[class*="code"],
.product-hub-code-input {
  border-radius: var(--ds-radius-md);
  font-size: var(--ds-font-size-xs);
}

/* Inline code in descriptions — softer, not shouting */
.consent-premium-panel__desc code,
.product-hub-panel-note code {
  background: #f1f5f9;
  color: #475569;
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.9em;
}

/* Troubleshooting cards */
.product-hub-troubleshooting__item,
.consent-troubleshooting-item {
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-radius-md);
  padding: var(--ds-space-md) var(--ds-space-lg);
  margin-bottom: var(--ds-space-sm);
  background: var(--ds-color-surface);
}

/* Empty states — guide next action */
.product-hub-empty-state .btn {
  margin-top: var(--ds-space-md);
}

/* Help footer pattern */
.page-discoverability {
  margin-top: var(--ds-space-xl);
  padding: var(--ds-space-md) var(--ds-space-lg);
  background: #f8fafc;
  border-radius: var(--ds-radius-md);
  border: 1px solid var(--ds-color-border);
}

/* Integration hub cards — scannable feature picker */
.consent-premium-nav-grid {
  gap: var(--ds-space-lg);
}

.consent-premium-nav-card {
  border-radius: var(--ds-radius-lg);
  padding: var(--ds-space-lg);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
}

.consent-premium-nav-card:hover {
  border-color: #cbd5e1;
  box-shadow: var(--ds-shadow-elevated);
  transform: translateY(-2px);
}

/* Save actions stay visible within panels */
.consent-premium-panel__actions {
  padding-top: 0;
  border-top: none;
  margin-top: 0;
  gap: var(--ds-space-md);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
}

/* System health — status-first */
.system-health-status--healthy {
  background: #ecfdf5;
  color: #065f46;
}

.system-health-status--warning {
  background: #fffbeb;
  color: #92400e;
}

.system-health-status--failed {
  background: #fef2f2;
  color: #991b1b;
}

/* Onboarding — guided, not overwhelming */
.gs-onboard__subtitle {
  max-width: 52ch;
  line-height: 1.6;
}

/* Reduce visual weight of long config section stacks */
.config-section-card + .config-section-card {
  margin-top: var(--ds-space-lg);
}

/* ═══════════════════════════════════════════════════════════
   SPACING SYSTEM v4 — global rhythm, containers, components
   ═══════════════════════════════════════════════════════════ */

/* ─── Page shells (remove cramped bundle padding) ─── */
.settings-page-premium,
.system-settings-page,
.ds-page,
.cr-page,
.policy-generator-page,
.ai-assistant-page,
.ai-assist-page,
.ai-review-page,
.ai-usage-page,
.ai-set-page,
.mod-page,
.translations-page,
.acc-page,
.security-settings-page,
.bill-page {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

.policy-generator-page,
.ai-assistant-page,
.ai-assist-page {
  display: flex;
  flex-direction: column;
  gap: 0;
}

/* ─── Vertical rhythm: sibling sections ─── */
.app-container > * + *:not(.app-content-footer),
.app-container > .dash-page > * + *,
.app-container > .settings-page-premium > * + *,
.app-container > .product-hub-page > * + *,
.app-container > .consent-premium-page > * + *,
.app-container > .hc-premium-page > * + *,
.app-container > .ds-page > * + *,
.app-container > .system-settings-page > * + *,
.app-container > .cr-page > * + *,
.app-container > .prem-scanner-root > * + *,
.app-container > .policy-generator-page > * + *,
.app-container > .ai-assistant-page > * + *,
.app-container > .ai-assist-page > * + *,
.app-container > .ai-review-page > * + *,
.app-container > .ai-usage-page > * + *,
.app-container > .ai-set-page > * + *,
.app-container > .mod-page > * + *,
.app-container > .translations-page > * + *,
.app-container > .acc-page > * + *,
.app-container > .security-settings-page > * + *,
.product-hub-page > * + *,
.consent-premium-page > * + *,
.hc-premium-page > * + *,
.ds-page > * + *,
.cr-page > * + *,
.prem-scanner-root > * + *,
.settings-page-premium > * + *,
.main-container > .dash-page > * + *,
.main-container > .settings-page-premium > * + *,
.main-container > .product-hub-page > * + *,
.main-container > .consent-premium-page > * + *,
.main-container > .hc-premium-page > * + *,
.main-container > .ds-page > * + *,
.main-container > .cr-page > * + *,
.main-container > .policy-generator-page > * + *,
.main-container > .ai-assistant-page > * + *,
.main-container > .ai-assist-page > * + *,
.main-container > .ai-review-page > * + *,
.main-container > .ai-usage-page > * + *,
.main-container > .ai-set-page > * + *,
.main-container > .mod-page > * + *,
.main-container > .translations-page > * + *,
.main-container > .acc-page > * + *,
.main-container > .security-settings-page > * + *,
.main-container > .websites-page-shell > * + * {
  margin-top: 30px;
}

/* Tighter hero → status cards (32px) */
.product-hub-hero + .product-hub-stat-grid,
.product-hub-hero + .prem-stat-grid,
.consent-premium-page .product-hub-hero + .product-hub-stat-grid {
  margin-top: var(--ds-hero-to-stats) !important;
}

.consent-premium-page .product-hub-stat-grid {
  margin-bottom: 0 !important;
}
.app-container > .product-hub-page > * + *.product-hub-link-grid {
  margin-top: 40px;
}

.product-hub-link-card__logo {
  display: block;
  width: 50px;
  height: 50px;
  margin-bottom: 12px;
  object-fit: contain;
}

/* ─── Page headers & titles ─── */
.dash-page-head,
.settings-page-head,
.cmp-page-head,
.cr-page-head,
.prem-page-head,
.ds-page-header,
.websites-page-head,
.bill-head {
  margin-bottom: var(--ds-section-gap);
  gap: var(--ds-space-lg);
}

.dash-page-title,
.settings-page-title,
.cmp-page-title,
.prem-page-title,
.websites-page-title,
.cr-page-title,
.bill-title {
  margin: 0 0 0;
  letter-spacing: -0.03em;
  line-height: 1.2;
}

.dash-page-subtitle,
.settings-page-subtitle,
.settings-page-desc,
.cmp-page-subtitle,
.ai-assistant-page-sub,
.ds-page-subtitle,
.bill-subtitle,
[class*="page-subtitle"],
[class*="page-desc"] {
  margin: var(--ds-space-md) 0 0;
  color: var(--ds-color-muted);
  line-height: 1.6;
  max-width: 62ch;
}

.product-hub-hero__desc,
.product-hub-hero__subtitle {
  margin: var(--ds-space-md) 0 0;
}

/* Section headings inside pages */
.consent-premium-panel__title,
.product-hub-section__title,
.scan-card-title,
.config-section-header,
.gs-onboard__title {
  margin: 0 0 0;
}

.consent-premium-panel__desc,
.product-hub-section__desc,
.scan-card-desc,
.gs-onboard__subtitle {
  margin: var(--ds-space-xs) 0 0;
}

.consent-premium-panel__head {
  padding-bottom: 0;
  margin-bottom: 15px;
  border-bottom: none;
}

.product-hub-section__head {
  padding: var(--ds-space-xl) var(--ds-space-2xl);
}
/* ─── Cards — Stripe/Vercel density ─── */
.card,
.dash-kpi-card,
.dash-chart-card,
.dash-trend-card,
.dash-consent-logs-card,
.dash-cookie-summary-left,
.dash-cookie-summary-right,
.dash-recommend-card,
.dash-quick-action-card,
.product-hub-stat-card,
.prem-stat-card,
.scan-card,
.config-section-card {
  border-radius: var(--ds-radius-lg);
  box-shadow: var(--ds-shadow-flat);
}

.card,
.dash-kpi-card,
.dash-chart-card,
.dash-trend-card,
.dash-consent-logs-card,
.dash-cookie-summary-left,
.dash-cookie-summary-right,
.dash-recommend-card,
.dash-quick-action-card {
  padding: var(--ds-card-padding);
}
.dash-cookie-summary-right,
.cc-scan-coverage section.card {
  padding: 26px 32px 32px;
}
.product-hub-stat-card,
.prem-stat-card {
  padding: 25px 25px 22px;
  min-height: 96px;
}

.card:hover,
.dash-kpi-card:hover,
.product-hub-stat-card:hover,
.scan-card:hover,
.consent-premium-panel:hover {
  border-color: #cbd5e1;
  box-shadow: var(--ds-shadow-elevated);
  transform: translateY(-1px);
}

.dash-kpi-grid,
.dash-middle-grid,
.dash-cookie-summary-row,
.billing-plan-grid,
.consent-premium-nav-grid {
  gap: var(--ds-space-xl);
}

.dash-quick-actions-section {
  margin-top: var(--ds-section-gap);
}

.dash-skeleton-grid {
  gap: var(--ds-space-lg);
}

/* ─── Forms & fields ─── */
.field {
  gap: var(--ds-space-sm);
  margin-bottom: 0;
}

.field:last-child {
  margin-bottom: 0;
}
.product-hub-config-card .field {
  margin-bottom: 15px;
}
.field .btn.secondary {
  margin-bottom: 31px;
}
.field label,
.field-label {
  margin-bottom: var(--ds-space-xs);
  font-size: var(--ds-font-size-md);
  font-weight: var(--ds-font-weight-semibold);
}
.product-hub-config-card {
  padding: 15px 20px 20px;
}
.field-help,
.field-hint,
.input-help,
.form-hint,
[class*="field-desc"],
[class*="help-text"] {
  margin-top: var(--ds-space-sm);
  font-size: var(--ds-font-size-sm);
  line-height: 1.5;
  color: var(--ds-color-muted);
}

.field-row,
.form-row,
.admin-filter-row {
  gap: var(--ds-space-lg);
}

.checkbox-row,
.toggle-row,
.product-hub-toggle-row {
  gap: var(--ds-space-md);
  padding: 16px 18px;
  margin-bottom: 15px;
}

/* ─── Buttons & action bars ─── */
.btn + .btn,
.cmp-page-actions .btn + .btn,
.dash-page-actions .btn + .btn,
.ds-page-actions .btn + .btn,
.product-hub-inline-actions .btn + .btn {
  margin-left: 0;
}

.cmp-page-actions,
.dash-page-actions,
.ds-page-actions,
.cr-page-actions,
.product-hub-inline-actions,
.product-hub-hero__actions,
.form-actions,
.card-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: var(--ds-space-md);
  margin-top: var(--ds-space-xl);
}

.cmp-page-head,
.dash-page-head-row,
.settings-page-head-row {
  gap: var(--ds-space-lg);
}
.product-hub-config-card__subsection .product-hub-inline-actions {
  margin-top: 0;
  margin-bottom: 0 !important;
}
/* ─── Tables, filters, pagination ─── */
.filter-bar {
  margin-bottom: var(--ds-space-lg);
  padding: var(--ds-space-lg);
  gap: var(--ds-space-md);
  border-radius: var(--ds-radius-md);
  background: #f8fafc;
  border: 1px solid var(--ds-color-border);
}

.pagination,
.cr-page-numbers,
.table-pagination {
  margin: var(--ds-space-xl) 0;
  gap: var(--ds-space-md);
}

.cr-page-btn {
  padding: var(--ds-space-sm) var(--ds-space-md);
  border-radius: var(--ds-radius-sm);
}

.history-table-message,
.table-empty-message {
  margin: 0 0 var(--ds-space-lg);
}

.dash-consent-table th,
.dash-consent-table td {
  padding: var(--ds-space-lg) var(--ds-space-xl);
}
.dash-consent-table-wrap {
  width: 100%;
}
table.dash-consent-table {
  max-width: 100%;
  min-width: 100%;
}

/* Dashboard — Recent Consent Logs action colors */
.dash-theme-cmp .dash-consent-table .dash-consent-action,
.dash-consent-table .dash-consent-action {
  display: inline-flex;
  align-items: center;
  font-weight: 700;
  font-size: 13px;
  line-height: 1.3;
  letter-spacing: 0.01em;
  text-transform: capitalize;
}

.dash-theme-cmp .dash-consent-table .dash-consent-action--accepted,
.dash-consent-table .dash-consent-action--accepted {
  color: #15803d;
}

.dash-theme-cmp .dash-consent-table .dash-consent-action--rejected,
.dash-consent-table .dash-consent-action--rejected {
  color: #dc2626;
}

.dash-theme-cmp .dash-consent-table .dash-consent-action--partial,
.dash-consent-table .dash-consent-action--partial {
  color: #d97706;
}

.dash-theme-cmp .dash-consent-table .dash-consent-action--unknown,
.dash-consent-table .dash-consent-action--unknown {
  color: #64748b;
}
/* ─── Alerts, badges, empty states ─── */
.alert,
.banner,
.prem-banner,
.hc-docs-unavailable-banner,
[class*="alert-"],
[class*="notice-"] {
  padding: var(--ds-space-lg) var(--ds-space-xl);
  margin-bottom: var(--ds-space-xs);
  border-radius: var(--ds-radius-md);
}

.badge-success,
.badge-warning,
.badge-danger,
.badge-info,
.badge-neutral,
.app-status-chip {
  padding: var(--ds-space-xs) var(--ds-space-md);
}

.product-hub-empty-state,
.feature-empty-state,
.dash-empty-state {
  padding: var(--ds-space-5xl) var(--ds-space-2xl);
  gap: var(--ds-space-lg);
}

.product-hub-empty-state__title {
  margin-bottom: var(--ds-space-md);
}

.page-discoverability {
  margin-top: 0;
  padding: var(--ds-space-lg) var(--ds-space-xl);
}

/* ─── Tabs & modals ─── */
.tabs,
.tab-list,
[role="tablist"] {
  gap: var(--ds-space-sm);
  margin-bottom: var(--ds-space-xl);
}

.tab-panel,
[role="tabpanel"] {
  padding-top: var(--ds-space-xl);
}

.cmp-report-modal,
.modal-content {
  padding: var(--ds-space-2xl);
}

.modal-header,
.modal-footer {
  padding: var(--ds-space-xl) var(--ds-space-2xl);
}

/* ─── Scanner & reports ─── */
.scan-card-title {
  margin-bottom: var(--ds-space-xl);
}

.product-hub-config-card__subsection {
  margin-top: 16px;
  padding-top: var(--ds-space-xl);
  border-top: 1px solid #eaeaea;
}
.product-hub-config-card__subsection:first-child {
  padding-top: 0;
  border-top: none;
  margin-top: 0;
}
.product-hub-config-card__subsection h4 {
  margin: 0 0 var(--ds-space-md);
}

.product-hub-troubleshooting__list {
  gap: var(--ds-space-lg);
}

.product-hub-troubleshooting__item {
  padding: var(--ds-space-lg) var(--ds-space-xl);
}

/* ─── Login & auth surfaces ─── */
.login-card,
.auth-card {
  padding: var(--ds-space-2xl);
  gap: var(--ds-space-xl);
}

/* ─── Topbar breathing room ─── */
.topbar,
.app-topbar {
  padding: var(--ds-space-md) var(--ds-space-xl);
}

/* ─── Responsive spacing scale ─── */
@media (min-width: 1536px) {
  :root {
    --ds-page-gutter: var(--ds-space-5xl);
  }

  .app-container.app-container--consent-builder {
    padding-left: var(--ds-space-4xl);
    padding-right: var(--ds-space-4xl);
  }
}

@media (max-width: 1280px) {
  :root {
    --ds-page-gutter: var(--ds-space-3xl);
    --ds-section-gap: var(--ds-space-3xl);
  }
}

@media (max-width: 1024px) {
  :root {
    --ds-page-gutter: var(--ds-space-2xl);
    --ds-section-gap: var(--ds-space-2xl);
  }

  .consent-premium-panel,
  .card,
  .scan-card {
    padding: var(--ds-space-xl);
  }
}

@media (max-width: 640px) {
  :root {
    --ds-page-gutter: var(--ds-space-lg);
    --ds-section-gap: var(--ds-space-2xl);
    --ds-hero-to-stats: var(--ds-space-xl);
  }

  .product-hub-section__head,
  .product-hub-section__body,
  .consent-premium-panel,
  .card,
  .scan-card {
    padding: var(--ds-space-lg);
  }

  .cmp-page-actions,
  .dash-page-actions,
  .ds-page-actions,
  .consent-premium-panel__actions {
    justify-content: stretch;
  }

  .cmp-page-actions .btn,
  .dash-page-actions .btn,
  .consent-premium-panel__actions .btn {
    flex: 1 1 auto;
  }
}
@media (max-width: 768px) {
  .product-hub-signal-grid {
    grid-template-columns: 1fr;
  }

  .product-hub-wizard {
    flex-direction: column;
  }

  .product-hub-wizard__step {
    min-width: 0;
    width: 100%;
  }
}

/* ═══════════════════════════════════════════════════════════
   v7 — Widescreen layout, consent builder, tabs, typography
   ═══════════════════════════════════════════════════════════ */

/* Full-bleed builder uses horizontal space; standard pages stay capped */
.app-container.app-container--consent-builder {
  max-width: 100%;
}

/* ─── Consent Setup / Banner Builder ─── */
.app-container .settings-page-premium.consent-setup-shell,
.app-container .consent-setup-shell.cmp-builder-shell {
  overflow: hidden;
  box-shadow: none;
  background: transparent;
}

.app-container .consent-setup-shell .consent-setup-header {
  gap: var(--ds-space-xl);
  padding: 0;
  background-color: transparent;
  align-items: center;
}

.app-container .consent-setup-shell .consent-setup-title {
  font-size: var(--ds-font-size-2xl);
  font-weight: var(--ds-font-weight-bold);
  letter-spacing: -0.03em;
  margin: 0;
}

.app-container .consent-setup-shell .consent-setup-subtitle {
  margin: 10px 0 0;
  font-size: var(--ds-font-size-md);
  line-height: 1.6;
  color: var(--ds-color-muted);
  max-width: 62ch;
}

.app-container .consent-setup-shell .consent-setup-header-actions {
  gap: var(--ds-space-md);
}

.app-container .consent-setup-shell .consent-setup-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 56px;
  margin-top: 22px;
  padding: 10px var(--ds-space-xl);
  gap: var(--ds-space-lg);
  border-bottom: 1px solid var(--ds-color-border);
  background: var(--ds-color-surface);
  border-radius: 12px;
}

.app-container .consent-setup-shell .consent-setup-topbar-left,
.app-container .consent-setup-shell .consent-setup-topbar-right {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.app-container .consent-setup-shell .consent-setup-breadcrumb {
  flex: 0 0 auto;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  color: #3668e9;
  white-space: nowrap;
}

.app-container .consent-setup-shell .consent-setup-site-select {
  box-sizing: border-box;
  min-width: 280px;
  max-width: 360px;
  width: min(360px, 42vw);
  min-height: 34px;
  padding: 0 40px 0 14px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  color: #0f172a;
  border-radius: 10px;
  border: 1.5px solid #cbd5e1;
  background-color: #fff;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #f8fafc 0%, #f8fafc 40px, transparent 40px);
  background-repeat: no-repeat, no-repeat;
  background-position: right 12px center, center;
  background-size: 18px 18px, 100% 100%;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background 0.15s ease;
}

.app-container .consent-setup-shell .consent-setup-site-select::-ms-expand {
  display: none;
}

.app-container .consent-setup-shell .consent-setup-site-select:hover {
  border-color: #94a3b8;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%233730a3' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #f1f5f9 0%, #f1f5f9 40px, transparent 40px);
}

.app-container .consent-setup-shell .consent-setup-site-select:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow:
    0 0 0 3px rgba(99, 102, 241, 0.15),
    0 1px 2px rgba(15, 23, 42, 0.05);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #eef2ff 0%, #eef2ff 40px, transparent 40px);
}

.app-container .consent-setup-shell .consent-setup-scan-time {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  color: #3668e9;
  white-space: nowrap;
}

.app-container .consent-setup-shell .consent-setup-scan-time::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233668e9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.app-container .consent-setup-shell .consent-setup-issues-badge {
  padding: var(--ds-space-xs) var(--ds-space-md);
  font-size: var(--ds-font-size-xs);
  font-weight: var(--ds-font-weight-semibold);
}

/* Consent Setup — hide removed header elements */
.app-container .consent-setup-shell .consent-setup-breadcrumb,
.app-container .consent-setup-shell .consent-setup-subtitle,
.app-container .consent-setup-shell .consent-setup-hero-status,
.app-container .consent-setup-shell .consent-setup-scan-time,
.app-container .consent-setup-shell .consent-setup-issues-badge,
.app-container .consent-setup-shell .consent-setup-hero-preview-row,
.app-container .consent-setup-shell .consent-setup-topbar-right {
  display: none !important;
}

/* Consent Setup — relocated header controls (title row + preview row) */
.app-container .consent-setup-shell .consent-setup-topbar--relocated {
  display: none !important;
}

.app-container .consent-setup-shell .consent-setup-header--relocated .product-hub-hero__main {
  align-items: flex-start;
}

.app-container .consent-setup-shell .consent-setup-hero-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 18px;
  width: 100%;
}

.app-container .consent-setup-shell .consent-setup-hero-title-row .consent-setup-title {
  flex: 0 0 auto;
  margin: 0;
}

.app-container .consent-setup-shell .consent-setup-hero-title-row .consent-setup-topbar-left {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 1 auto;
  min-width: 0;
}

.app-container .consent-setup-shell .consent-setup-hero-status {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex: 0 1 auto;
  min-width: 0;
  margin-left: auto;
}

.app-container .consent-setup-shell .consent-setup-hero-actions-col {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 10px;
  flex-shrink: 0;
  margin-left: auto;
}

.app-container .consent-setup-shell .consent-setup-hero-preview-row {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px;
}

.app-container .consent-setup-shell .consent-setup-hero-preview-row .consent-setup-btn.ghost {
  color: #2562ff;
  background: #fff;
  border: 1px solid #c7d2fe;
}

.app-container .consent-setup-shell .consent-setup-hero-preview-row .consent-setup-btn.ghost:hover:not(:disabled) {
  color: #3730a3;
  background: #eef2ff;
  border-color: #a5b4fc;
}

.app-container .consent-setup-shell .consent-setup-hero-preview-row .consent-setup-btn.primary {
  color: #fff;
  background: linear-gradient(135deg, #4f46e5 0%, #6366f1 100%);
  border: 1px solid #4f46e5;
  text-decoration: none;
}

.app-container .consent-setup-shell .consent-setup-hero-preview-row .consent-setup-btn.primary:hover:not(:disabled) {
  background: linear-gradient(135deg, #2562ff 0%, #4f46e5 100%);
  border-color: #2562ff;
}

@media (max-width: 1024px) {
  .app-container .consent-setup-shell .consent-setup-hero-title-row {
    gap: 10px 14px;
  }

  .app-container .consent-setup-shell .consent-setup-hero-status {
    margin-left: 0;
    width: 100%;
    justify-content: flex-start;
  }

  .app-container .consent-setup-shell .consent-setup-hero-actions-col {
    width: 100%;
    align-items: stretch;
  }

  .app-container .consent-setup-shell .consent-setup-hero-preview-row {
    justify-content: flex-start;
  }
}

/* 35% config / 65% preview split */
.app-container .consent-setup-shell .consent-setup-main.consent-setup-layout.consent-setup-layout--split {
  display: grid !important;
  grid-template-columns: minmax(380px, 35%) minmax(0, 65%) !important;
  gap: 0;
  min-height: 0;
  flex: 1;
  margin-top: 0;
}

.app-container .consent-setup-shell .consent-setup-editor.consent-settings-panel {
  background: #f8fafc;
  border-right: 1px solid var(--ds-color-border);
  overflow-x: hidden;
  overflow-y: auto;
}

.app-container .consent-setup-shell .consent-setup-preview.consent-preview-panel {
  background: #eef2f7;
  min-width: 0;
}

.app-container .consent-setup-shell .consent-setup-preview-frame {
  flex: 1;
  min-height: 0;
  background: linear-gradient(180deg, #eef2f7 0%, #e2e8f0 100%);
}

/* Premium tabs */
.app-container .consent-setup-shell .consent-setup-tabs-shell {
  display: flex;
  align-items: stretch;
  gap: 0;
  margin: 0 0 20px;
  padding: 4px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  position: relative;
}

.app-container .consent-setup-shell .consent-setup-tabs-shell .consent-setup-tabs.consent-tabs {
  display: flex;
  flex: 1 1 auto;
  gap: 4px;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.app-container .consent-setup-shell .consent-setup-tabs-shell .consent-setup-tabs.consent-tabs::-webkit-scrollbar {
  display: none;
}

.app-container .consent-setup-shell .consent-setup-tabs-nav {
  flex: 0 0 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  min-width: 28px;
  margin: 0;
  padding: 0;
  color: #94a3b8;
  background: transparent;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: color 0.15s ease, background-color 0.15s ease, opacity 0.15s ease;
}

.app-container .consent-setup-shell .consent-setup-tabs-nav:hover:not(:disabled) {
  color: #6366f1;
  background: rgba(255, 255, 255, 0.75);
}

.app-container .consent-setup-shell .consent-setup-tabs-nav:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
}

.app-container .consent-setup-shell .consent-setup-tabs-nav:disabled {
  opacity: 0.35;
  cursor: default;
}

.app-container .consent-setup-shell .consent-setup-tabs-shell:not(.consent-setup-tabs-shell--scrollable) .consent-setup-tabs-nav {
  display: none;
}

.app-container .consent-setup-shell .consent-setup-tabs-shell--can-left::before,
.app-container .consent-setup-shell .consent-setup-tabs-shell--can-right::after {
  content: "";
  position: absolute;
  top: 4px;
  bottom: 4px;
  width: 18px;
  pointer-events: none;
  z-index: 1;
}

.app-container .consent-setup-shell .consent-setup-tabs-shell--can-left::before {
  left: 28px;
  background: linear-gradient(90deg, #f1f5f9 25%, rgba(241, 245, 249, 0));
}

.app-container .consent-setup-shell .consent-setup-tabs-shell--can-right::after {
  right: 28px;
  background: linear-gradient(270deg, #f1f5f9 25%, rgba(241, 245, 249, 0));
}

/* Consent Setup — horizontal tab scroll when tabs overflow (all viewports) */
.app-container .consent-setup-shell .consent-setup-tabs.consent-tabs,
html.cs-modal-embed .consent-setup-shell .consent-setup-tabs.consent-tabs,
.app-container .consent-setup-shell .consent-setup-tabs.consent-tabs[data-cs-tabs-scroll="true"],
html.cs-modal-embed .consent-setup-shell .consent-setup-tabs.consent-tabs[data-cs-tabs-scroll="true"] {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
}

.app-container .consent-setup-shell .consent-setup-tabs.consent-tabs::-webkit-scrollbar,
html.cs-modal-embed .consent-setup-shell .consent-setup-tabs.consent-tabs::-webkit-scrollbar {
  display: none;
}

.app-container .consent-setup-shell .consent-setup-tabs.consent-tabs .consent-setup-tab-btn.consent-tab,
.app-container .consent-setup-shell .consent-setup-tabs.consent-tabs .consent-tab,
html.cs-modal-embed .consent-setup-shell .consent-setup-tabs.consent-tabs .consent-setup-tab-btn.consent-tab,
html.cs-modal-embed .consent-setup-shell .consent-setup-tabs.consent-tabs .consent-tab {
  flex: 0 0 auto !important;
  width: 100px !important;
  min-width: 88px !important;
  max-width: none !important;
  white-space: nowrap;
}

.app-container .consent-setup-shell .consent-setup-tabs.consent-tabs {
  display: flex;
  gap: 4px;
  margin: 0 0 20px;
  padding: 4px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow-x: auto;
}
.app-container .consent-setup-shell .consent-setup-tab-btn.consent-tab {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100px;
  min-height: 54px;
  height: auto;
  padding: 8px 6px;
  border: none;
  border-radius: 9px;
  cursor: pointer;
  transition: color 0.15s ease, background-color 0.15s ease, box-shadow 0.15s ease;
}

.app-container .consent-setup-shell .consent-tab-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.2;
}

.app-container .consent-setup-shell .consent-tab svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

.app-container .consent-setup-shell .consent-tab:not(.active):not(.is-active) {
  color: #6f7f97;
  background: transparent;
}

.app-container .consent-setup-shell .consent-tab:not(.active):not(.is-active):hover {
  color: #475569;
  background: rgba(255, 255, 255, 0.7);
}

.app-container .consent-setup-shell .consent-tab.active,
.app-container .consent-setup-shell .consent-tab.is-active {
  color: #2562ff;
  background: #fff;
  box-shadow:
    0 1px 3px rgba(15, 23, 42, 0.08),
    0 0 0 1px rgba(99, 102, 241, 0.12);
}

.app-container .consent-setup-shell .consent-tab.active svg,
.app-container .consent-setup-shell .consent-tab.is-active svg {
  color: #6366f1;
  stroke: #6366f1;
}

/* Consent Setup — law confirm modal above portaled tab nav + workspace close */
.consent-setup-shell:has(.cs-law-confirm-root) {
  position: relative;
  z-index: 2147483400 !important;
}

.cs-workspace-ready .consent-setup-shell.cs-workspace-open:has(.cs-law-confirm-root) {
  z-index: 2147483400 !important;
}

.consent-setup-shell .cs-law-confirm-root {
  z-index: 2147483500 !important;
}

body:has(.cs-law-confirm-root) #cs-tabs-nav-layer-consent,
body:has(.cs-law-confirm-root) #cs-tabs-nav-layer-consent .cs-tabs-nav-slot {
  z-index: 1 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body:has(.cs-law-confirm-root) .cs-workspace-close,
body:has(.cs-law-confirm-root) .cs-workspace-close.is-visible {
  z-index: 1 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* Accordion / appearance editor */
.app-container .consent-setup-shell .consent-setup-fields {
  padding: 0;
}

.app-container .consent-setup-shell .cmp-ae-accordion-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.app-container .consent-setup-shell .cmp-ae-section {
  margin-bottom: 0;
  border: 1.5px solid #e2e8f0;
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.app-container .consent-setup-shell .cmp-ae-section.is-open {
  border-color: #c7d2fe;
  box-shadow: 0 1px 3px rgba(99, 102, 241, 0.08);
}

.app-container .consent-setup-shell .cmp-ae-section-trigger {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 56px;
  padding: 14px 16px;
  text-align: left;
  cursor: pointer;
  background: transparent;
  border: none;
  transition: background-color 0.15s ease;
}

.app-container .consent-setup-shell .cmp-ae-section-trigger:hover {
  background: #f8fafc;
}

.app-container .consent-setup-shell .cmp-ae-section-trigger-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.app-container .consent-setup-shell .cmp-ae-section-title {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: #0f172a;
}

.app-container .consent-setup-shell .cmp-ae-section-hint {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  color: #94a3b8;
}

.app-container .consent-setup-shell .cmp-ae-section-chevron {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  color: #94a3b8;
  transition: transform 0.2s ease, color 0.15s ease;
}

.app-container .consent-setup-shell .cmp-ae-section.is-open .cmp-ae-section-chevron {
  color: #6366f1;
  transform: rotate(180deg);
}

.app-container .consent-setup-shell .cmp-ae-section-body {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 0 16px 16px;
}

.app-container .consent-setup-shell .cmp-ae-block {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.app-container .consent-setup-shell .cmp-ae-row {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 0;
}

.app-container .consent-setup-shell .cmp-ae-row--toggle {
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.app-container .consent-setup-shell .cmp-ae-row--toggle .cmp-ae-label {
  margin: 0;
}

.app-container .consent-setup-shell .cmp-ae-label {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 2px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  color: #333f50;
}

.app-container .consent-setup-shell .cmp-ae-muted,
.app-container .consent-setup-shell .cmp-ae-tip {
  font-size: 13px;
  line-height: 1.45;
  color: #94a3b8;
}

.app-container .consent-setup-shell .cmp-ae-divider {
  height: 1px;
  margin: 4px 0;
  background: #eaeaea;
}

.app-container .consent-setup-shell .cmp-ae-select,
.app-container .consent-setup-shell .cmp-ae-input,
.app-container .consent-setup-shell .consent-setup-select,
.app-container .consent-setup-shell .consent-setup-input,
.app-container .consent-setup-shell .consent-setup-textarea,
.app-container .consent-setup-shell .cmp-ae-custom-css__input,
.app-container .consent-setup-shell .ai-assistant-card .field select,
.app-container .consent-setup-shell .ai-premium-section-body .field select {
  box-sizing: border-box;
  width: 100%;
  min-height: 42px;
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  color: #0f172a;
  background-color: #fff;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.app-container .consent-setup-shell .consent-setup-textarea,
.app-container .consent-setup-shell .cmp-ae-custom-css__input {
  min-height: 96px;
  padding: 12px 14px;
  resize: vertical;
}

.app-container .consent-setup-shell .cmp-ae-select,
.app-container .consent-setup-shell .consent-setup-select,
.app-container .consent-setup-shell select.consent-setup-select--compact,
.app-container .consent-setup-shell .ai-assistant-card .field select,
.app-container .consent-setup-shell .ai-premium-section-body .field select {
  padding-right: 40px;
  cursor: pointer;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-color: #fff !important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #f8fafc 0%, #f8fafc 40px, transparent 40px) !important;
  background-repeat: no-repeat, no-repeat !important;
  background-position: right 12px center, center !important;
  background-size: 18px 18px, 100% 100% !important;
}

.app-container .consent-setup-shell .cmp-ae-select::-ms-expand,
.app-container .consent-setup-shell .consent-setup-select::-ms-expand,
.app-container .consent-setup-shell select.consent-setup-select--compact::-ms-expand,
.app-container .consent-setup-shell .ai-assistant-card .field select::-ms-expand,
.app-container .consent-setup-shell .ai-premium-section-body .field select::-ms-expand {
  display: none;
}

.app-container .consent-setup-shell .cmp-ae-select:hover,
.app-container .consent-setup-shell .consent-setup-select:hover,
.app-container .consent-setup-shell .ai-assistant-card .field select:hover,
.app-container .consent-setup-shell .ai-premium-section-body .field select:hover,
.app-container .consent-setup-shell .cmp-ae-input:hover,
.app-container .consent-setup-shell .consent-setup-input:hover {
  border-color: #94a3b8;
}

.app-container .consent-setup-shell .cmp-ae-select:focus,
.app-container .consent-setup-shell .consent-setup-select:focus,
.app-container .consent-setup-shell .ai-assistant-card .field select:focus,
.app-container .consent-setup-shell .ai-premium-section-body .field select:focus,
.app-container .consent-setup-shell .cmp-ae-input:focus,
.app-container .consent-setup-shell .consent-setup-input:focus,
.app-container .consent-setup-shell .consent-setup-textarea:focus,
.app-container .consent-setup-shell .cmp-ae-custom-css__input:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.14);
}

.app-container .consent-setup-shell .ai-assistant-card .field label,
.app-container .consent-setup-shell .ai-premium-section-body .field label {
  margin: 0 0 2px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  color: #333f50;
  opacity: 1;
}

.app-container .consent-setup-shell .ai-premium-section-body .row .field {
  margin-bottom: 0;
}

.app-container .consent-setup-shell .cmp-ae-segmented {
  display: flex;
  gap: 4px;
  padding: 3px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
}

.app-container .consent-setup-shell .cmp-ae-segmented-btn {
  flex: 1 1 0;
  min-width: 0;
  min-height: 36px;
  height: auto;
  padding: 0 10px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  color: #3668e9;
  background: transparent;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.app-container .consent-setup-shell .cmp-ae-segmented-btn:hover:not(.is-active) {
  color: #475569;
  background: rgba(255, 255, 255, 0.75);
}
.app-container .consent-setup-shell input[type="radio"] {
  width: 16px;
  height: 16px;
  margin: 0;
  accent-color: #6366f1;
  cursor: pointer;
}

.app-container .consent-setup-shell .consent-setup-toggle {
  flex-shrink: 0;
  width: 44px;
  height: 26px;
  padding: 0;
  border: none;
  border-radius: 999px;
  background: #e2e8f0;
  cursor: pointer;
  position: relative;
  transition: background-color 0.2s ease;
}

.app-container .consent-setup-shell .consent-setup-toggle span {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.18);
  transition: transform 0.2s ease;
  transform: translateX(0);
}

.app-container .consent-setup-shell .consent-setup-toggle.is-on {
  background: #6366f1;
}

.app-container .consent-setup-shell .consent-setup-toggle.is-on span {
  transform: translateX(18px);
}

.app-container .consent-setup-shell .cmp-ae-row--slider .cmp-ae-slider {
  display: block;
  width: 100%;
  line-height: normal;
  height: auto;
}

.app-container .consent-setup-shell .cmp-ae-row--slider .cmp-ae-slider .config-slider-field {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  margin: 0;
}

.app-container .consent-setup-shell .config-slider-field {
  margin-bottom: 16px;
}

.app-container .consent-setup-shell .config-slider-head {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  margin: 0;  order: 2;
}

.app-container .consent-setup-shell .config-slider-label {
  font-size: 13px;
  font-weight: 600;
  color: #475569;
}

.app-container .consent-setup-shell .config-slider-val {
  flex: 0 0 auto;
  min-width: 36px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  color: #6366f1;
}

.app-container .consent-setup-shell .cmp-ae-row--slider .config-slider {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  height: 20px;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 999px;
  background: transparent;
  accent-color: #6366f1;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

.app-container .consent-setup-shell .config-slider {
  accent-color: #6366f1;
  cursor: pointer;
}

.app-container .consent-setup-shell .cmp-ae-row--slider .config-slider::-webkit-slider-runnable-track {
  height: 6px;
  border-radius: 999px;
  background: linear-gradient(90deg, #e0e7ff 0%, #eef2ff 100%);
}

.app-container .consent-setup-shell .cmp-ae-row--slider .config-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 16px;
  height: 16px;
  margin-top: -5px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #6366f1;
  box-shadow: 0 1px 3px rgba(99, 102, 241, 0.35);
  cursor: pointer;
}

.app-container .consent-setup-shell .cmp-ae-row--slider .config-slider::-moz-range-track {
  height: 6px;
  border-radius: 999px;
  border: none;
  background: linear-gradient(90deg, #e0e7ff 0%, #eef2ff 100%);
}

.app-container .consent-setup-shell .cmp-ae-row--slider .config-slider::-moz-range-thumb {
  width: 16px;
  height: 16px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #6366f1;
  box-shadow: 0 1px 3px rgba(99, 102, 241, 0.35);
  cursor: pointer;
}

.app-container .consent-setup-shell .cmp-ae-row--slider .config-slider:focus-visible::-webkit-slider-thumb,
.app-container .consent-setup-shell .cmp-ae-row--slider .config-slider:focus-visible::-moz-range-thumb {
  box-shadow:
    0 0 0 3px rgba(99, 102, 241, 0.22),
    0 1px 3px rgba(99, 102, 241, 0.35);
}

.app-container .consent-setup-shell .cmp-ae-color-group-title {
  margin: 4px 0 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #94a3b8;
}

.app-container .consent-setup-shell .cmp-ae-color-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.app-container .consent-setup-shell .cmp-ae-color-chip {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  padding: 10px;
  border: 1.5px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}

.app-container .consent-setup-shell .cmp-ae-color-chip-label,
.app-container .consent-setup-shell .config-color-field-label {
  font-size: 12px;
  font-weight: 600;
  color: #475569;
}

.app-container .consent-setup-shell .cmp-ae-color-chip .config-color-field-row,
.app-container .consent-setup-shell .config-color-field-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.app-container .consent-setup-shell .config-color-swatch {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 2px solid #fff;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 0 0 1px #e2e8f0, 0 2px 6px rgba(15, 23, 42, 0.1);
}

.app-container .consent-setup-shell .config-color-hex {
  flex: 1 1 auto;
  min-width: 0;
  padding: 6px 8px;
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: #475569;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}

.app-container .consent-setup-shell .consent-setup-logo-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.app-container .consent-setup-shell .consent-setup-upload-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  color: #2562ff;
  background: #f5f3ff;
  border: 1.5px dashed #c7d2fe;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.app-container .consent-setup-shell .consent-setup-upload-btn::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='17 8 12 3 7 8'/%3E%3Cline x1='12' x2='12' y1='3' y2='15'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.app-container .consent-setup-shell .consent-setup-upload-btn:hover {
  color: #3730a3;
  background: #eef2ff;
  border-color: #a5b4fc;
}

.app-container .consent-setup-shell .consent-setup-upload-btn.danger {
  color: #b91c1c;
  background: #fef2f2;
  border-style: solid;
  border-color: #fecaca;
}

.app-container .consent-setup-shell .consent-setup-upload-btn.danger::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6'/%3E%3Cpath d='M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2'/%3E%3C/svg%3E");
}

.app-container .consent-setup-shell .consent-setup-logo-thumb {
  width: 48px;
  height: 48px;
  object-fit: contain;
  border: 1.5px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
  padding: 4px;
}

.app-container .consent-setup-shell .cmp-ae-button-card {
  padding: 12px;
  border: 1.5px solid #e2e8f0;
  border-radius: 10px;
  background: #f8fafc;
}

.app-container .consent-setup-shell .cmp-ae-button-card-title {
  margin-bottom: 10px;
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
}

.app-container .consent-setup-shell .consent-setup-law-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
  padding: 14px 16px;
  border: 1.5px solid #e2e8f0;
  border-radius: 12px;
  background: linear-gradient(135deg, #fff 0%, #f8fafc 100%);
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.app-container .consent-setup-shell .consent-setup-law-strip__main {
  flex: 1 1 auto;
  min-width: 0;
}

.app-container .consent-setup-shell .consent-setup-law-strip__eyebrow {
  font-size: 11px;
}

.app-container .consent-setup-shell .consent-setup-law-strip__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.app-container .consent-setup-shell .consent-setup-law-strip__law {
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
}

.app-container .consent-setup-shell .consent-setup-law-strip__hint {
  font-size: 13px;
  font-weight: 500;
  color: #3668e9;
}

.app-container .consent-setup-shell .consent-setup-law-strip__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-shrink: 0;
  min-height: 30px;
  padding: 0 9px;
  font-size: 13px;
  font-weight: 600;
  color: #2562ff;
  background: #eef2ff;
  border: 1.5px solid #c7d2fe;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.12s ease;
}

.app-container .consent-setup-shell .consent-setup-law-strip__cta::after {
  content: "";
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.app-container .consent-setup-shell .consent-setup-law-strip__cta:hover {
  color: #3730a3;
  background: #e0e7ff;
  border-color: #a5b4fc;
}

.app-container .consent-setup-shell .consent-setup-btn,
.app-container .consent-setup-shell .btn.consent-setup-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.12s ease, box-shadow 0.15s ease;
}

.app-container .consent-setup-shell .consent-setup-btn.ghost:not(.consent-setup-btn--discard),
.app-container .consent-setup-shell .btn.consent-setup-btn.ghost:not(.consent-setup-btn--discard) {
  color: #475569;
  background: #fff;
  border: 1.5px solid #e2e8f0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.app-container .consent-setup-shell .consent-setup-btn.ghost:hover:not(:disabled):not(.consent-setup-btn--discard),
.app-container .consent-setup-shell .btn.consent-setup-btn.ghost:hover:not(:disabled):not(.consent-setup-btn--discard) {
  color: #334155;
  background: #f8fafc;
  border-color: #cbd5e1;
}

.app-container .consent-setup-shell .consent-setup-btn.primary,
.app-container .consent-setup-shell .btn.consent-setup-btn.primary {
  color: #fff;
  background: #6366f1;
  border: 1.5px solid #6366f1;
  box-shadow: 0 1px 3px rgba(99, 102, 241, 0.25);
}

.app-container .consent-setup-shell .consent-setup-btn.primary:hover:not(:disabled),
.app-container .consent-setup-shell .btn.consent-setup-btn.primary:hover:not(:disabled) {
  background: #4f46e5;
  border-color: #4f46e5;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.28);
}

.app-container .consent-setup-shell .consent-setup-topbar .consent-setup-btn.primary::after {
  content: "";
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

/* Preview toolbar */
.app-container .consent-setup-shell .consent-preview-lang-strip,
.app-container .consent-setup-shell .consent-preview-ab-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 10px 16px 10px 20px;
  background: #fff;
  border-bottom: 1px solid #e2e8f0;
}

/* Banner preview fullscreen popup — language strip (portaled to body) */
.cs-banner-preview-fs-toolbar .consent-preview-lang-strip,
.cs-banner-preview-fs-toolbar .consent-preview-ab-strip {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
}

.cs-banner-preview-fs-toolbar .consent-preview-ab-strip-label {
  flex-shrink: 0;
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  color: #475569;
}

.cs-banner-preview-fs-toolbar .consent-preview-lang-strip > .consent-preview-ab-strip-label:first-of-type {
  margin-right: 4px;
}

.cs-banner-preview-fs-toolbar .consent-preview-lang-strip > a.consent-preview-ab-strip-label:hover {
  color: #2562ff;
}

.cs-banner-preview-fs-toolbar .consent-preview-ab-chip {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  margin: 0;
  padding: 6px 14px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  color: #3668e9;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  cursor: pointer;
  box-shadow: none;
  appearance: none;
  -webkit-appearance: none;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.cs-banner-preview-fs-toolbar .consent-preview-ab-chip:hover:not(.is-active):not(.active) {
  color: #475569;
  background: #f8fafc;
  border-color: #cbd5e1;
}

.cs-banner-preview-fs-toolbar .consent-preview-ab-chip.is-active,
.cs-banner-preview-fs-toolbar .consent-preview-ab-chip.active {
  color: #6366f1;
  background: #eef2ff;
  border-color: #6366f1;
}

.cs-banner-preview-fs-toolbar {
  background: #fff;
  border-bottom: 1px solid #e2e8f0;
}

.cs-banner-preview-fs-title {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
}

.app-container .consent-setup-shell .consent-preview-ab-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  margin-right: 0;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 600;
  color: #3668e9;
  background: #f8fafc;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.app-container .consent-setup-shell .consent-preview-ab-chip.is-active,
.app-container .consent-setup-shell .consent-preview-ab-chip.active {
  color: #2562ff;
  background: #eef2ff;
  border-color: #c7d2fe;
}

.app-container .consent-setup-preview-frame .banner-preview-premium-head.preview-topbar {
  padding: 0 20px;
  background: var(--ds-color-surface);
  border-bottom: 1px solid var(--ds-color-border);
  height: 50px;
}

.app-container .consent-setup-preview-frame .banner-preview-viewport.preview-viewport,
.app-container .consent-setup-preview-frame .banner-preview-react-shell {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 20px;
  box-sizing: border-box;
}

.app-container .consent-setup-preview-frame .banner-preview-device-frame.consent-preview-container {
  padding: 0;
  width: 1390px !important;
}

.app-container .consent-setup-preview-frame .banner-preview-device-frame[data-preview-device="mobile"] .banner-preview-viewport.preview-viewport,
.app-container .consent-setup-preview-frame .banner-preview-device-frame[data-preview-device="tablet"] .banner-preview-viewport.preview-viewport {
  padding: 20px 14px;
}

.app-container .consent-setup-preview-frame .preview-topbar-left,
.app-container .consent-setup-preview-frame .preview-topbar-right {
  gap: 10px;
}

.app-container .consent-setup-preview-frame .preview-device-btn,
.app-container .consent-setup-preview-frame .banner-preview-device.preview-device-btn {
  min-height: 34px;
  padding: 0 12px;
  font-size: 13px;
}

.app-container .consent-setup-preview-frame .preview-device-btn,
.app-container .consent-setup-preview-frame .banner-preview-device.preview-device-btn {
  min-height: 36px;
  min-width: 36px;
  padding: var(--ds-space-sm);
  border-radius: var(--ds-radius-sm);
}

.app-container .consent-setup-preview-frame .preview-device-btn.active,
.app-container .consent-setup-preview-frame .preview-device-btn.is-active {
  background: var(--ds-color-shell-accent-muted);
  color: var(--ds-color-shell-accent);
}

/* Consent Setup preview — Cookie preferences panel polish */
.app-container .consent-setup-preview-frame .cs-premium-cmp,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp,
.cs-banner-preview-fs-root .cs-premium-cmp {
  --cs-teal: #1d9e75;
  --cs-teal-dark: #0f6e56;
  --cs-teal-light: #e1f5ee;
  --cs-bg: #f8fafc;
  --cs-border: #e2e8f0;
  --cs-text: #0f172a;
  --cs-muted: #3668e9;
  font-family: "DM Sans", system-ui, -apple-system, sans-serif;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .panel-wrap,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .panel-wrap,
.cs-banner-preview-fs-root .cs-premium-cmp .panel-wrap {
  min-height: 0;
  max-height: none;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .sb-logo,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .sb-logo,
.cs-banner-preview-fs-root .cs-premium-cmp .sb-logo {
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: linear-gradient(135deg, #eef2ff 0%, #f8fafc 58%, #fff 100%);
  border-bottom: 1px solid #e2e8f0;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .sb-logo-icon,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .sb-logo-icon,
.cs-banner-preview-fs-root .cs-premium-cmp .sb-logo-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .sb-logo-name,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .sb-logo-name,
.cs-banner-preview-fs-root .cs-premium-cmp .sb-logo-name {
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #3668e9;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .topbar,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .topbar,
.cs-banner-preview-fs-root .cs-premium-cmp .topbar {
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: #fff;
  border-bottom: 1px solid #e2e8f0;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .topbar-btn:first-child,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .topbar-btn:first-child,
.cs-banner-preview-fs-root .cs-premium-cmp .topbar-btn:first-child {
  display: none;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .topbar-center,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .topbar-center,
.cs-banner-preview-fs-root .cs-premium-cmp .topbar-center {
  flex: 1;
  min-width: 0;
  text-align: left;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .topbar-center h2,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .topbar-center h2,
.cs-banner-preview-fs-root .cs-premium-cmp .topbar-center h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: #0f172a;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .topbar-center p,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .topbar-center p,
.cs-banner-preview-fs-root .cs-premium-cmp .topbar-center p {
  margin: 3px 0 0;
  font-size: 11px;
  line-height: 1.35;
  color: #94a3b8;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .topbar-btn:last-child,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .topbar-btn:last-child,
.cs-banner-preview-fs-root .cs-premium-cmp .topbar-btn:last-child {
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  font-size: 0;
  color: #3668e9;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .topbar-btn:last-child:hover,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .topbar-btn:last-child:hover,
.cs-banner-preview-fs-root .cs-premium-cmp .topbar-btn:last-child:hover {
  color: #0f172a;
  background: #f1f5f9;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .topbar-btn:last-child svg,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .topbar-btn:last-child svg,
.cs-banner-preview-fs-root .cs-premium-cmp .topbar-btn:last-child svg {
  width: 16px;
  height: 16px;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .sb-nav,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .sb-nav,
.cs-banner-preview-fs-root .cs-premium-cmp .sb-nav {
  gap: 6px;
  padding: 10px 14px;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .nav-item,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .nav-item,
.cs-banner-preview-fs-root .cs-premium-cmp .nav-item {
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 42px;
  padding: 10px 12px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  color: #334155;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .nav-item.active,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .nav-item.active,
.cs-banner-preview-fs-root .cs-premium-cmp .nav-item.active {
  color: #0f6e56;
  background: linear-gradient(135deg, #ecfdf5 0%, #f0fdfa 100%);
  border-color: #a7f3d0;
  box-shadow: inset 0 0 0 1px rgba(29, 158, 117, 0.08);
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .nav-badge,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .nav-badge,
.cs-banner-preview-fs-root .cs-premium-cmp .nav-badge {
  margin-left: auto;
  min-width: 28px;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  border-radius: 999px;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .panel-body,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .panel-body,
.cs-banner-preview-fs-root .cs-premium-cmp .panel-body {
  gap: 10px;
  padding: 12px 14px 16px;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .cat-card,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .cat-card,
.cs-banner-preview-fs-root .cs-premium-cmp .cat-card {
  border-color: #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .cat-card.open,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .cat-card.open,
.cs-banner-preview-fs-root .cs-premium-cmp .cat-card.open {
  border-color: #c7d2fe;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(99, 102, 241, 0.08);
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .cat-head,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .cat-head,
.cs-banner-preview-fs-root .cs-premium-cmp .cat-head {
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .cat-icon,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .cat-icon,
.cs-banner-preview-fs-root .cs-premium-cmp .cat-icon {
  width: 36px;
  height: 36px;
  margin-top: 0;
  border-radius: 999px;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .cat-name,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .cat-name,
.cs-banner-preview-fs-root .cs-premium-cmp .cat-name {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .cat-meta,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .cat-meta,
.cs-banner-preview-fs-root .cs-premium-cmp .cat-meta {
  margin-top: 3px;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #94a3b8;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .cat-right,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .cat-right,
.cs-banner-preview-fs-root .cs-premium-cmp .cat-right {
  align-self: center;
  align-items: center;
  gap: 8px;
  padding-top: 0;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .always-pill,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .always-pill,
.cs-banner-preview-fs-root .cs-premium-cmp .always-pill {
  padding: 5px 10px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  white-space: nowrap;
  color: #0f6e56;
  background: #dcfce7;
  border: 1px solid #bbf7d0;
  border-radius: 999px;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .cat-providers,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .cat-providers,
.cs-banner-preview-fs-root .cs-premium-cmp .cat-providers {
  background: #f8fafc;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .prov-row,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .prov-row,
.cs-banner-preview-fs-root .cs-premium-cmp .prov-row {
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 12px 16px;
  border-bottom-color: #e2e8f0;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .prov-init,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .prov-init,
.cs-banner-preview-fs-root .cs-premium-cmp .prov-init {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  font-size: 11px;
  font-weight: 700;
  border-radius: 999px;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .prov-name,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .prov-name,
.cs-banner-preview-fs-root .cs-premium-cmp .prov-name {
  flex: 1;
  min-width: 0;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  color: #0f172a;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp .prov-count,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp .prov-count,
.cs-banner-preview-fs-root .cs-premium-cmp .prov-count {
  flex-shrink: 0;
  margin-left: auto;
  padding: 4px 10px;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  white-space: nowrap;
  color: #0f6e56;
  background: #e1f5ee;
  border: 1px solid #9fe1cb;
  border-radius: 999px;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp.cs-premium-cmp--narrow .sb-nav,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp.cs-premium-cmp--narrow .sb-nav,
.cs-banner-preview-fs-root .cs-premium-cmp.cs-premium-cmp--narrow .sb-nav {
  flex-direction: column;
  flex-wrap: nowrap;
  overflow: visible;
}

.app-container .consent-setup-preview-frame .cs-premium-cmp.cs-premium-cmp--narrow .nav-item,
.consent-setup-preview-frame--fullscreen .cs-premium-cmp.cs-premium-cmp--narrow .nav-item,
.cs-banner-preview-fs-root .cs-premium-cmp.cs-premium-cmp--narrow .nav-item {
  width: 100%;
}

/* ─── Dashboard, Websites & Consent Setup — page hero (System Health style) ─── */
.dash-theme-cmp .dash-page-head.product-hub-hero,
.websites-page-shell .websites-header.product-hub-hero,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0;
  margin-bottom: 20px;
  padding: 22px 24px;
  background: linear-gradient(135deg, #eef2ff 0%, #fff 52%, #f0fdfa 100%);
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 1px 3px rgba(15, 23, 42, 0.06);
  opacity: 1 !important;
  transform: none !important;
}

.app-container .consent-setup-shell .consent-setup-header.product-hub-hero {
  flex-shrink: 0;
}

.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__eyebrow,
.websites-page-shell .websites-header.product-hub-hero .product-hub-hero__eyebrow,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .product-hub-hero__eyebrow {
  margin: 0 0 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #6366f1;
}

.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__main,
.websites-page-shell .websites-header.product-hub-hero .product-hub-hero__main,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .product-hub-hero__main {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px 24px;
  width: 100%;
}

.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__copy,
.websites-page-shell .websites-header.product-hub-hero .product-hub-hero__copy,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .product-hub-hero__copy {
  flex: 1 1 280px;
  min-width: 0;
}

.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__title,
.websites-page-shell .websites-header.product-hub-hero .product-hub-hero__title,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .product-hub-hero__title {
  font-size: clamp(28px, 2.2vw, 34px);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.15;
  color: #0f172a;
  margin: 0;
}

.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__subtitle,
.websites-page-shell .websites-header.product-hub-hero .product-hub-hero__subtitle,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .product-hub-hero__subtitle {
  margin: 8px 0 0;
  font-size: 16px;
  line-height: 1.55;
  color: #3668e9;
  max-width: 62ch;
}

.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__actions,
.websites-page-shell .websites-header.product-hub-hero .product-hub-hero__actions,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .product-hub-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  margin-top: 0;
  flex-shrink: 0;
}

/* Dashboard hero actions */
.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 20px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  border-radius: 10px;
  text-decoration: none;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__actions .btn svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

/* Dashboard chart card title icons */
.dash-theme-cmp .dash-section-icon--consent {
  color: #6d28d9;
  background: #ede9fe;
}

.dash-theme-cmp .dash-section-icon--trends {
  color: #1d4ed8;
  background: #dbeafe;
}

.dash-theme-cmp .dash-section-icon--categories {
  color: #047857;
  background: #d1fae5;
}

.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__actions .btn.secondary {
  color: #0f172a !important;
  background: #fff !important;
  border: 1px solid #d1d5db !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__actions .btn.secondary:hover:not(:disabled) {
  color: #0f172a !important;
  background: #f8fafc !important;
  border-color: #94a3b8 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__actions .btn:not(.secondary) {
  color: #fff !important;
  border: none !important;
  background: linear-gradient(135deg, #3b49df 0%, #4da1ff 100%) !important;
  box-shadow: 0 2px 8px rgba(59, 73, 223, 0.28);
}

.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__actions .btn:not(.secondary):hover:not(:disabled) {
  background: linear-gradient(135deg, #3344c8 0%, #3d8fe8 100%) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(59, 73, 223, 0.34);
}

.dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__subtitle {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
}

.dash-theme-cmp .dash-page-head.product-hub-hero .dash-domain-link {
  color: #2563eb;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
  padding-left: 6px;
}

.dash-theme-cmp .dash-page-head.product-hub-hero .dash-domain-link:hover {
  color: #1d4ed8;
  text-decoration: none;
}

/* Websites hero actions */
.websites-page-shell .websites-header.product-hub-hero .websites-register-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  border-radius: 10px;
  border: 1px solid #a7f3d0;
  color: #047857 !important;
  background: #ecfdf5 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  text-decoration: none;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.websites-page-shell .websites-header.product-hub-hero .websites-register-btn:hover {
  color: #065f46 !important;
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.14);
}

.websites-page-shell .websites-header.product-hub-hero .websites-register-btn svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

/* Add website page — back button */
.websites-page-shell .websites-header.product-hub-hero .product-hub-hero__actions .btn.secondary,
.websites-page-shell .websites-header.product-hub-hero .websites-back-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  border-radius: 10px;
  text-decoration: none;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.websites-page-shell .websites-header.product-hub-hero .product-hub-hero__actions .btn.secondary:hover:not(:disabled),
.websites-page-shell .websites-header.product-hub-hero .websites-back-btn:hover {
  color: #0f172a !important;
  background: #f8fafc !important;
  border-color: #94a3b8 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

.websites-page-shell .websites-header.product-hub-hero .websites-back-btn svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

/* Add website — connect domain card */
.websites-page-shell .websites-empty-card--register {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 820px;
  margin: 20px auto 0;
  padding: 32px 28px 28px;
  text-align: center;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    0 1px 3px rgba(15, 23, 42, 0.06),
    0 8px 24px rgba(15, 23, 42, 0.04);
}

.websites-page-shell .websites-empty-card--register .websites-empty-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin: 0 auto 16px;
  color: #0d9488;
  background: #f0fdfa;
  border: 1px solid #99f6e4;
  border-radius: 14px;
}

.websites-page-shell .websites-empty-card--register .websites-empty-icon svg {
  width: 28px;
  height: 28px;
}

.websites-page-shell .websites-empty-card--register .websites-empty-title {
  margin: 0 0 8px;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
  letter-spacing: -0.5px;
}

.websites-page-shell .websites-empty-card--register .websites-register-helper--empty {
  margin: 0 0 24px;
  font-size: 16px;
  line-height: 1.55;
  color: #3668e9;
}

.websites-page-shell .websites-empty-card--register .websites-register-form {
  width: 100%;
  text-align: left;
}

.websites-page-shell .websites-empty-card--register .websites-register-form .websites-register-field {
  margin: 0 0 16px;
}

.websites-page-shell .websites-empty-card--register .websites-register-form .field label {
  display: block;
  margin: 0 0 3px;
  font-size: 17px;
  font-weight: 700;
  color: #334155;
  text-align: center;
}

.websites-page-shell .websites-empty-card--register .websites-register-form input[type="text"] {
  box-sizing: border-box;
  width: 100%;
  min-height: 44px;
  padding: 11px 14px;
  font-size: 15px;
  font-weight: 500;
  color: #0f172a;
  background: #fff;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.websites-page-shell .websites-empty-card--register .websites-register-form input[type="text"]:hover {
  border-color: #94a3b8;
}

.websites-page-shell .websites-empty-card--register .websites-register-form input[type="text"]:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow:
    0 0 0 3px rgba(37, 99, 235, 0.18),
    0 1px 2px rgba(15, 23, 42, 0.05);
}

.websites-page-shell .websites-empty-card--register .websites-register-field-error,
.websites-page-shell .websites-empty-card--register .websites-register-api-error {
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.45;
}

.websites-page-shell .websites-empty-card--register .websites-register-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  margin: 4px 0 0;
}

.websites-page-shell .websites-empty-card--register .websites-register-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 44px;
  padding: 0 18px;
  font-size: 16px;
  font-weight: 600;
  border-radius: 10px;
}

/* Consent Setup hero — unsaved label + action buttons */
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: 4px;
  padding: 8px 12px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  border-radius: 10px;
  border: 1.5px solid transparent;
}

.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn.consent-setup-btn--discard {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 600;
  border-radius: 10px;
  color: #b91c1c !important;
  background: #fef2f2 !important;
  border: 1.5px solid #fecaca !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn.consent-setup-btn--discard::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6'/%3E%3Cpath d='M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn.consent-setup-btn--discard:hover:not(:disabled) {
  color: #991b1b !important;
  background: #fee2e2 !important;
  border-color: #fca5a5 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(239, 68, 68, 0.15);
}

.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn.ghost:not(.consent-setup-btn--discard) {
  min-height: 42px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 600;
  border-radius: 10px;
  color: #2562ff !important;
  background: #eef2ff !important;
  border: 1px solid #c7d2fe !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn.ghost:hover:not(:disabled):not(.consent-setup-btn--discard) {
  color: #3730a3 !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.18);
}

.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn.primary {
  min-height: 42px;
  padding: 0 20px;
  font-size: 15px;
  font-weight: 700;
  border-radius: 10px;
  color: #fff !important;
  border: 1.5px solid #6366f1 !important;
  background: #6366f1 !important;
  box-shadow: 0 1px 3px rgba(99, 102, 241, 0.25);
}

.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn.primary:hover:not(:disabled) {
  background: #4f46e5 !important;
  border-color: #4f46e5 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.28);
}

@media (max-width: 768px) {
  .dash-theme-cmp .dash-page-head.product-hub-hero,
  .websites-page-shell .websites-header.product-hub-hero,
  .app-container .consent-setup-shell .consent-setup-header.product-hub-hero {
    padding: 18px 16px;
    margin-bottom: 16px;
  }
  .dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__main,
  .websites-page-shell .websites-header.product-hub-hero .product-hub-hero__main,
  .app-container .consent-setup-shell .consent-setup-header.product-hub-hero .product-hub-hero__main {
    align-items: flex-start;
  }

  .dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__actions,
  .websites-page-shell .websites-header.product-hub-hero .product-hub-hero__actions,
  .app-container .consent-setup-shell .consent-setup-header.product-hub-hero .product-hub-hero__actions {
    width: 100%;
    justify-content: flex-start;
  }
}

/* Consent setup action buttons — see editor polish block above */

/* ─── Global tabs (premium) ─── */
.tabs,
.tab-list,
.consent-tabs,
[role="tablist"] {
  gap: var(--ds-space-xs);
  margin-bottom: var(--ds-space-xl);
}

.tab,
[role="tab"],
.consent-tab {
  min-height: 44px;
  padding: var(--ds-space-sm) var(--ds-space-lg);
  border-radius: 0;
  font-weight: var(--ds-font-weight-medium);
  transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
  font-size: 15px;
}

/* ─── Typography hierarchy ─── */
.dash-page-title,
.settings-page-title,
.cmp-page-title,
.prem-page-title,
.websites-page-title,
.cr-page-title,
.bill-title,
.consent-setup-title,
.product-hub-hero__title {
  font-size: clamp(24px, 2.2vw, 36px);
  font-weight: var(--ds-font-weight-bold);
  letter-spacing: -0.03em;
  line-height: 1.15;
}

.ds-page-subtitle,
.bill-subtitle,
.dash-page-subtitle,
.product-hub-hero__subtitle,
.consent-setup-subtitle {
  font-size: var(--ds-font-size-md);
  line-height: 1.65;
  color: var(--ds-color-muted);
}

/* ─── Input height consistency ─── */
.field input,
.field select,
.field textarea,
.consent-setup-input,
.cmp-ae-input,
.cmp-ae-select,
.ai-set-input {
  min-height: 40px;
  padding: var(--ds-space-sm) var(--ds-space-md);
  font-size: var(--ds-font-size-sm);
  border-radius: var(--ds-radius-sm);
  border: 1px solid var(--ds-color-border);
}

.field textarea,
.consent-setup-textarea,
.cmp-ae-custom-css__input {
  min-height: 96px;
  padding: var(--ds-space-md);
}

/* ─── Consent builder responsive ─── */
@media (max-width: 1200px) {
  .app-container .consent-setup-shell .consent-setup-main.consent-setup-layout.consent-setup-layout--split {
    grid-template-columns: minmax(320px, 38%) minmax(0, 62%) !important;
  }
}

@media (max-width: 1024px) {
  .app-container.app-container--consent-builder {
    padding-left: var(--ds-space-xl);
    padding-right: var(--ds-space-xl);
  }

  .app-container .consent-setup-shell .consent-setup-main.consent-setup-layout.consent-setup-layout--split {
    grid-template-columns: 1fr !important;
    grid-template-rows: minmax(320px, auto) minmax(480px, 1fr);
    overflow-y: auto;
  }

  .app-container .consent-setup-shell .consent-setup-editor.consent-settings-panel {
    border-right: none;
    border-bottom: 1px solid var(--ds-color-border);
    max-height: none;
  }

  .app-container .settings-page-premium.consent-setup-shell {
    height: auto;
    min-height: calc(100vh - 96px);
  }
}

@media (max-width: 640px) {
  .app-container .consent-setup-shell .consent-setup-header,
  .app-container .consent-setup-shell .consent-setup-topbar {
    padding-left: var(--ds-space-lg);
    padding-right: var(--ds-space-lg);
  }

  .app-container .consent-setup-shell .consent-setup-tabs-shell {
    flex-wrap: nowrap;
  }

  .app-container .consent-setup-shell .consent-setup-tabs-shell .consent-setup-tabs.consent-tabs,
  .app-container .consent-setup-shell .consent-setup-tabs.consent-tabs {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }

  .app-container .consent-setup-shell .consent-setup-tabs-shell .consent-setup-tab-btn.consent-tab,
  .app-container .consent-setup-shell .consent-setup-tab-btn.consent-tab {
    flex: 0 0 auto !important;
    min-width: 88px;
    width: 100px;
  }
}

/* ─── IAB TCF 2.2 Foundation — modern layout ─── */
.tcf-foundation-page .consent-premium-stack {
  gap: 24px;
}

.tcf-foundation-page .consent-premium-panel {
  padding: 20px 22px;
}

.tcf-foundation-page .tcf-foundation-panel__title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 15px;
  padding-top:0;
}

.tcf-foundation-page .tcf-foundation-panel__title-row .consent-premium-panel__title {
  margin: 0;
}

.tcf-foundation-page .tcf-foundation-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 25px;
}

.tcf-foundation-page .tcf-foundation-back {
  margin-top: 25px;
}

.tcf-foundation-page .tcf-foundation-registry-note {
  margin-top: 12px;
}

.tcf-foundation-page .tcf-picker__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 18px;
  margin-bottom: 12px;
}

.tcf-foundation-page .tcf-picker__search-wrap {
  flex: 1 1 280px;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  border: 1px solid var(--ds-color-border);
  border-radius: var(--ds-field-input-radius);
  background: var(--ds-color-surface);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.tcf-foundation-page .tcf-picker__search-wrap::before {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") no-repeat center / contain;
  opacity: 0.9;
  pointer-events: none;
}

.tcf-foundation-page .tcf-picker__search-wrap:hover {
  border-color: #cbd5e1;
}

.tcf-foundation-page .tcf-picker__search-wrap:focus-within {
  border-color: var(--ds-color-primary);
  box-shadow: 0 0 0 3px var(--ds-color-focus-ring);
}

.tcf-foundation-page .tcf-picker__search {
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  border: none;
  background: transparent;
  padding: 10px 0;
  font-size: var(--ds-font-size-md);
  color: var(--ds-color-neutral);
  outline: none;
  box-shadow: none;
}

.tcf-foundation-page .tcf-picker__search::placeholder {
  color: var(--ds-color-muted-2);
}

.tcf-foundation-page .tcf-picker__search:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.tcf-foundation-page .tcf-picker__meta {
  font-size: 15px;
  font-weight: 600;
  color: #3668e9;
  white-space: nowrap;
}

.tcf-foundation-page .tcf-picker__meta--selected {
  color: #1d4ed8;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  padding: 4px 14px;
  line-height: 1.2;
}

.tcf-foundation-page .tcf-picker__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}

.tcf-foundation-page .tcf-picker__chip {
  display: inline-flex;
  align-items: center;
  padding: 0px 12px;
  border-radius: 999px;
  border: 1px solid #cbd5e1;
  background: #f8fafc;
  color: #334155;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  line-height: 1;
  height: 28px;
}

.tcf-foundation-page .tcf-picker__chip:hover:not(:disabled) {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1d4ed8;
}

.tcf-foundation-page .btn--tcf-clear,
.tcf-foundation-page .tcf-picker__clear {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  padding: 0;
  color: #dc2626 !important;
  border: none !important;
  box-shadow: none;
  min-height: auto;
  margin-left: 7px;
}

.tcf-foundation-page .btn--tcf-clear::before,
.tcf-foundation-page .tcf-picker__clear::before {
  content: "";
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23dc2626' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6'/%3E%3Cpath d='M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2'/%3E%3Cline x1='10' x2='10' y1='11' y2='17'/%3E%3Cline x1='14' x2='14' y1='11' y2='17'/%3E%3C/svg%3E") no-repeat center / contain;
}

.tcf-foundation-page .btn--tcf-clear:hover:not(:disabled),
.tcf-foundation-page .tcf-picker__clear:hover:not(:disabled) {
  box-shadow: none;
}

.tcf-foundation-page .tcf-picker__list,
.tcf-foundation-page .tcf-purpose-editor__li-list {
  max-height: 260px;
  overflow: auto;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #f8fafc;
  padding: 10px 12px;
}

.tcf-foundation-page .tcf-picker__item {
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 8px 5px;
  margin-bottom: 4px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 15px;
  line-height: 1.45;
  transition: background 0.15s ease;
}

.tcf-foundation-page .tcf-picker__item:has(input[type="checkbox"]:checked) {
  background: #eff6ff;
}

.tcf-foundation-page .tcf-picker__item:has(input[type="checkbox"]:checked):hover {
  background: #dbeafe;
}

.tcf-foundation-page .tcf-picker__item:hover {
  background: #fff;
}

.tcf-foundation-page .tcf-picker__item:last-child {
  margin-bottom: 0;
}

.tcf-foundation-page .tcf-picker__item-text strong {
  font-weight: 600;
  color: #0f172a;
}

.tcf-foundation-page .tcf-picker__item-meta {
  color: #3668e9;
}

.tcf-foundation-page .tcf-purpose-editor__group {
  margin-top: 26px;
}

.tcf-foundation-page .tcf-purpose-editor__group:first-of-type {
  margin-top: 0;
}

.tcf-foundation-page .tcf-purpose-editor__group-title {
  display: flex;
  align-items: center;
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 18px;
  padding: 8px 12px;
  border-radius: 0 8px 8px 0;
  border-left: 4px solid;
  line-height: 1.3;
}

.tcf-foundation-page .tcf-purpose-editor__group-title--analytics {
  color: #1d4ed8;
  background: #eff6ff;
  border-left-color: #3b82f6;
}

.tcf-foundation-page .tcf-purpose-editor__group-title--marketing {
  color: #6d28d9;
  background: #f5f3ff;
  border-left-color: #8b5cf6;
}

.tcf-foundation-page .tcf-purpose-editor__group-title--preferences {
  color: #047857;
  background: #ecfdf5;
  border-left-color: #10b981;
}

.tcf-foundation-page .tcf-purpose-editor__group-title--leg-int {
  color: #b45309;
  background: #fffbeb;
  border-left-color: #f59e0b;
}

.tcf-foundation-page .tcf-purpose-editor__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tcf-foundation-page .tcf-purpose-chip {
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 10px;
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #334155;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.3;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.tcf-foundation-page .tcf-purpose-chip:hover:not(:disabled) {
  border-color: #93c5fd;
  background: #f8fafc;
}

.tcf-foundation-page .tcf-purpose-chip--selected {
  color: #1d4ed8;
  background: #eff6ff;
  border-color: #3b82f6;
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.15);
}

.tcf-foundation-page .tcf-purpose-editor__li {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid #e2e8f0;
}

.tcf-foundation-page .tcf-vendor-restrictions {
  display: grid;
  gap: 12px;
  margin-top: 4px;
}

.tcf-foundation-page .consent-premium-panel__head {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-bottom: 0;
  margin-bottom: 16px;
  border-bottom: none;
}

.tcf-foundation-page .consent-premium-panel__title {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.35;
  color: #0f172a;
}

.tcf-foundation-page .consent-premium-panel__desc {
  margin: 0;
  max-width: none;
  font-size: 14px;
  line-height: 1.55;
  color: #3668e9;
}

.tcf-foundation-page .consent-premium-panel > .product-hub-panel-note {
  margin: 0;
  padding: 14px 16px;
  font-size: 14px;
  line-height: 1.55;
  color: #3668e9;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}

.tcf-foundation-page .tcf-vendor-restriction-card {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #f8fafc;
  padding: 14px 16px;
}

.tcf-foundation-page .tcf-vendor-restriction-card__title {
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
  margin-bottom: 8px;
}

.tcf-foundation-page .btn--tcf-save {
  color: #fff !important;
  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
  border: 1px solid #1d4ed8 !important;
  box-shadow: 0 1px 2px rgba(29, 78, 216, 0.25);
}

.tcf-foundation-page .btn--tcf-save:hover:not(:disabled) {
  background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%) !important;
}

.tcf-foundation-page .btn--tcf-preview {
  color: #4f46e5 !important;
  background: #eef2ff !important;
  border: 1px solid #c7d2fe !important;
}

.tcf-foundation-page .btn--tcf-preview:hover:not(:disabled) {
  color: #2562ff !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
}
.tcf-foundation-page .product-hub-section__body {
  padding-top: 30px;
}
@media (max-width: 900px) {
  .tcf-foundation-page .tcf-foundation-fields {
    grid-template-columns: 1fr;
  }
}

/* ─── Websites page — summary tile label icons ─── */
.websites-page-shell .websites-summary-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.websites-page-shell .websites-summary-label::before {
  content: "";
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

.websites-page-shell .websites-summary-label--total {
  color: #4f46e5;
}

.websites-page-shell .websites-summary-label--total::before {
  background-color: #eef2ff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='16' height='16' x='4' y='4' rx='2'/%3E%3Crect width='6' height='6' x='9' y='9' rx='1'/%3E%3Cpath d='M15 2v2'/%3E%3Cpath d='M15 20v2'/%3E%3Cpath d='M2 15h2'/%3E%3Cpath d='M20 15h2'/%3E%3C/svg%3E");
}

.websites-page-shell .websites-summary-label--scanned {
  color: #16a34a;
}

.websites-page-shell .websites-summary-label--scanned::before {
  background-color: #dcfce7;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpath d='m9 11 3 3L22 4'/%3E%3C/svg%3E");
}

.websites-page-shell .websites-summary-label--not-scanned {
  color: #d97706;
}

.websites-page-shell .websites-summary-label--not-scanned::before {
  background-color: #ffedd5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 8v4'/%3E%3Cpath d='M12 16h.01'/%3E%3C/svg%3E");
}

.websites-page-shell .websites-summary-label--consent-rate {
  color: #2563eb;
}

.websites-page-shell .websites-summary-label--consent-rate::before {
  background-color: #dbeafe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18'/%3E%3Cpath d='m19 9-5 5-4-4-3 3'/%3E%3C/svg%3E");
}

/* Fallback for cached JS without label modifier classes */
.websites-page-shell .websites-summary-bar .websites-summary-tile:nth-child(1) .websites-summary-label:not([class*="--"]) {
  color: #4f46e5;
}

.websites-page-shell .websites-summary-bar .websites-summary-tile:nth-child(2) .websites-summary-label:not([class*="--"]) {
  color: #16a34a;
}

.websites-page-shell .websites-summary-bar .websites-summary-tile:nth-child(3) .websites-summary-label:not([class*="--"]) {
  color: #d97706;
}

.websites-page-shell .websites-summary-bar .websites-summary-tile:nth-child(4) .websites-summary-label:not([class*="--"]) {
  color: #2563eb;
}

/* Websites page — action buttons */
.websites-page-shell .websites-actions-cell {
  gap: 8px;
}

.websites-page-shell .websites-actions-cell .websites-scan-btn,
.websites-page-shell .websites-actions-cell .websites-configure-btn,
.websites-page-shell .websites-actions-cell .websites-delete-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 32px;
  padding: 0 12px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  border-radius: 8px;
  text-decoration: none;
  cursor: pointer;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease;
}

.websites-page-shell .websites-actions-cell .websites-scan-btn svg,
.websites-page-shell .websites-actions-cell .websites-configure-btn svg,
.websites-page-shell .websites-actions-cell .websites-delete-btn svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}

.websites-page-shell .websites-actions-cell .websites-scan-btn {
  color: #1d4ed8;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
}

.websites-page-shell .websites-actions-cell .websites-scan-btn:hover {
  color: #1e40af;
  background: #dbeafe;
  border-color: #93c5fd;
}

.websites-page-shell .websites-actions-cell .websites-configure-btn {
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}

.websites-page-shell .websites-actions-cell .websites-configure-btn:hover {
  color: #3730a3;
  background: #e0e7ff;
  border-color: #a5b4fc;
}

.websites-page-shell .websites-actions-cell .websites-delete-btn {
  color: #dc2626;
  background: #fef2f2;
  border: 1px solid #fecaca;
  font-family: inherit;
}

.websites-page-shell .websites-actions-cell .websites-delete-btn:hover:not(:disabled) {
  color: #b91c1c;
  background: #fee2e2;
  border-color: #fca5a5;
}

.websites-page-shell .websites-actions-cell .websites-delete-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* ─── HubSpot Integration — stat card label icons ─── */
.hubspot-integration-page .product-hub-stat-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.hubspot-integration-page .product-hub-stat-card {
  display: grid !important;
  grid-template-columns: 28px 1fr;
  grid-template-rows: auto auto auto;
  column-gap: 10px;
  row-gap: 6px;
  align-items: center;
  min-height: 0;
}

/* Connection summary card has no icon — drop empty left column */
.hubspot-integration-page .product-hub-stat-card:not(:has(.product-hub-stat-card__icon)) {
  grid-template-columns: 1fr;
  column-gap: 0;
}

.hubspot-integration-page .product-hub-stat-card:not(:has(.product-hub-stat-card__icon)) .product-hub-stat-card__label,
.hubspot-integration-page .product-hub-stat-card:not(:has(.product-hub-stat-card__icon)) .product-hub-stat-card__value,
.hubspot-integration-page .product-hub-stat-card:not(:has(.product-hub-stat-card__icon)) .product-hub-stat-card__helper,
.hubspot-integration-page .product-hub-stat-card:not(:has(.product-hub-stat-card__icon)) strong {
  grid-column: 1;
}

.hubspot-integration-page .product-hub-stat-card__icon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background-color: #f1f5f9;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
  pointer-events: none;
  grid-column: 1;
  grid-row: 1;
  align-self: center;
}

.hubspot-integration-page .product-hub-panel-note strong {
  color: #262626;
}

.hubspot-integration-page .product-hub-stat-card__label {
  grid-column: 2;
  grid-row: 1;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  align-self: center;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1.2;
}

.hubspot-integration-page .product-hub-stat-card__value,
.hubspot-integration-page .product-hub-stat-card strong {
  grid-column: 1 / -1;
  grid-row: 2;
  margin-top: 2px;
}

.hubspot-integration-page .product-hub-stat-card__helper {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: 0;
  font-size: 14px;
  line-height: 1.4;
}

.hubspot-integration-page .product-hub-stat-card__icon--portal {
  background-color: #ffede8;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ff5c35' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E");
}

.hubspot-integration-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label {
  color: #ff5c35;
}

.hubspot-integration-page .product-hub-stat-card__icon--tracking {
  background-color: #dbeafe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.hubspot-integration-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label {
  color: #2563eb;
}

.hubspot-integration-page .product-hub-stat-card__icon--crm-sync {
  background-color: #ede9fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

.hubspot-integration-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label {
  color: #7c3aed;
}

.hubspot-integration-page .product-hub-stat-card__icon--connector {
  background-color: #ccfbf1;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230d9488' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22v-5'/%3E%3Cpath d='M9 8V2'/%3E%3Cpath d='M15 8V2'/%3E%3Cpath d='M18 8v5a4 4 0 0 1-4 4h-4a4 4 0 0 1-4-4V8Z'/%3E%3C/svg%3E");
}

.hubspot-integration-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label {
  color: #0d9488;
}

/* ─── HubSpot Integration — action buttons ─── */
.hubspot-integration-page .btn--hubspot-connect,
.hubspot-integration-page .btn--hubspot-validate,
.hubspot-integration-page .btn--hubspot-health,
.hubspot-integration-page .btn--hubspot-sync {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

.hubspot-integration-page .btn--hubspot-connect::after,
.hubspot-integration-page .btn--hubspot-validate::after,
.hubspot-integration-page .btn--hubspot-health::after,
.hubspot-integration-page .btn--hubspot-sync::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.hubspot-integration-page .btn--hubspot-connect,
.hubspot-integration-page .product-hub-inline-actions > .btn:first-child {
  color: #c2410c !important;
  background: #ffede8 !important;
  background-image: none !important;
  border: 1px solid #fdba74 !important;
}

.hubspot-integration-page .btn--hubspot-connect:hover:not(:disabled),
.hubspot-integration-page .product-hub-inline-actions > .btn:first-child:hover:not(:disabled) {
  color: #9a3412 !important;
  background: #fed7aa !important;
  border-color: #fb923c !important;
}

.hubspot-integration-page .btn--hubspot-connect::after,
.hubspot-integration-page .product-hub-inline-actions > .btn:first-child::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23c2410c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E");
}

.hubspot-integration-page .btn--hubspot-validate {
  color: #2563eb !important;
  background: #eff6ff !important;
  border: 1px solid #bfdbfe !important;
}

.hubspot-integration-page .btn--hubspot-validate:hover:not(:disabled) {
  color: #1d4ed8 !important;
  background: #dbeafe !important;
  border-color: #93c5fd !important;
}

.hubspot-integration-page .btn--hubspot-validate::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.hubspot-integration-page .btn--hubspot-health {
  color: #16a34a !important;
  background: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
}

.hubspot-integration-page .btn--hubspot-health:hover:not(:disabled) {
  color: #15803d !important;
  background: #dcfce7 !important;
  border-color: #86efac !important;
}

.hubspot-integration-page .btn--hubspot-health::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z'/%3E%3C/svg%3E");
}

.hubspot-integration-page .btn--hubspot-sync {
  color: #7c3aed !important;
  background: #f5f3ff !important;
  border: 1px solid #ddd6fe !important;
}

.hubspot-integration-page .btn--hubspot-sync:hover:not(:disabled) {
  color: #6d28d9 !important;
  background: #ede9fe !important;
  border-color: #c4b5fd !important;
}

.hubspot-integration-page .btn--hubspot-sync::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

/* HubSpot Integration — remove collapsed Diagnostics/Troubleshooting dash lines in config card */
.hubspot-integration-page .product-hub-config-card > .product-hub-section {
  display: none;
}

/* ─── Google Additional Consent — stat card label icons ─── */
.google-acm-page .product-hub-stat-card {
  position: static;
  padding-top: 16px;
  padding-right: 18px;
  display: grid;
  grid-template-columns: 28px 1fr;
  column-gap: 10px;
  row-gap: 8px;
  align-items: center;
}

.google-acm-page .product-hub-stat-card__icon {
  position: static;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background-color: #f1f5f9;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
  pointer-events: none;
  grid-column: 1;
  grid-row: 1;
}

.google-acm-page .product-hub-stat-card__label {
  grid-column: 2;
  grid-row: 1;
  margin-bottom: 0;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.google-acm-page .product-hub-stat-card__value,
.google-acm-page .product-hub-stat-card strong {
  grid-column: 1 / -1;
  grid-row: 2;
}

.google-acm-page .product-hub-stat-card__helper {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: 0;
}

.google-acm-page .product-hub-stat-card__icon--acm-status {
  background-color: #e8f0fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%231a73e8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='12' x='2' y='6' rx='6'/%3E%3Ccircle cx='16' cy='12' r='3' fill='%231a73e8' stroke='none'/%3E%3C/svg%3E");
}

.google-acm-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label {
  color: #1a73e8;
}

.google-acm-page .product-hub-stat-card__icon--atp-vendors {
  background-color: #eef2ff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
}

.google-acm-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label {
  color: #4f46e5;
}

.google-acm-page .product-hub-stat-card__icon--consent-mode {
  background-color: #dbeafe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%234285f4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10'/%3E%3C/svg%3E");
}

.google-acm-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label {
  color: #4285f4;
}

.google-acm-page .product-hub-stat-card__icon--validation {
  background-color: #dcfce7;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

.google-acm-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label {
  color: #16a34a;
}

/* ─── Cross Domain Consent — stat card label icons ─── */
.cross-domain-consent-page .product-hub-stat-card {
  position: static;
  padding-top: 16px;
  padding-right: 18px;
  display: grid;
  grid-template-columns: 28px 1fr;
  column-gap: 10px;
  row-gap: 8px;
  align-items: center;
}

.cross-domain-consent-page .product-hub-stat-card__icon {
  position: static;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background-color: #f1f5f9;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
  pointer-events: none;
  grid-column: 1;
  grid-row: 1;
}

.cross-domain-consent-page .product-hub-stat-card__label {
  grid-column: 2;
  grid-row: 1;
  margin-bottom: 0;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.cross-domain-consent-page .product-hub-stat-card__value,
.cross-domain-consent-page .product-hub-stat-card strong {
  grid-column: 1 / -1;
  grid-row: 2;
}

.cross-domain-consent-page .product-hub-stat-card__helper {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: 0;
}

.cross-domain-consent-page .product-hub-stat-card__icon--sync-status {
  background-color: #ccfbf1;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230d9488' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

.cross-domain-consent-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label {
  color: #0d9488;
}

.cross-domain-consent-page .product-hub-stat-card__icon--domains {
  background-color: #dbeafe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E");
}

.cross-domain-consent-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label {
  color: #2563eb;
}

.cross-domain-consent-page .product-hub-stat-card__icon--last-sync {
  background-color: #ede9fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E");
}

.cross-domain-consent-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label {
  color: #7c3aed;
}

.cross-domain-consent-page .product-hub-stat-card__icon--verification {
  background-color: #dcfce7;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

.cross-domain-consent-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label {
  color: #16a34a;
}

/* ─── Cross Domain Consent — relatable icons on marked elements ─── */

/* Section tabs: icon before each label */
.cross-domain-consent-page .product-hub-tabs .product-hub-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.cross-domain-consent-page .product-hub-tabs .product-hub-tab::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  opacity: 0.9;
}

.cross-domain-consent-page .product-hub-tabs .product-hub-tab:nth-child(1)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='4' x2='4' y1='21' y2='14'/%3E%3Cline x1='4' x2='4' y1='10' y2='3'/%3E%3Cline x1='12' x2='12' y1='21' y2='12'/%3E%3Cline x1='12' x2='12' y1='8' y2='3'/%3E%3Cline x1='20' x2='20' y1='21' y2='16'/%3E%3Cline x1='20' x2='20' y1='12' y2='3'/%3E%3Cline x1='2' x2='6' y1='14' y2='14'/%3E%3Cline x1='10' x2='14' y1='8' y2='8'/%3E%3Cline x1='18' x2='22' y1='16' y2='16'/%3E%3C/svg%3E");
}

.cross-domain-consent-page .product-hub-tabs .product-hub-tab:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-2.48a2 2 0 0 0-1.93 1.46l-2.35 8.36a.25.25 0 0 1-.48 0L9.24 2.18a.25.25 0 0 0-.48 0l-2.35 8.36A2 2 0 0 1 4.49 12H2'/%3E%3C/svg%3E");
}

.cross-domain-consent-page .product-hub-tabs .product-hub-tab:nth-child(3)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 2v7.31'/%3E%3Cpath d='M14 9.3V1.99'/%3E%3Cpath d='M8.5 2h7'/%3E%3Cpath d='M14 9.3a6.5 6.5 0 1 1-4 0'/%3E%3Cpath d='M5.58 16.5h12.85'/%3E%3C/svg%3E");
}

.cross-domain-consent-page .product-hub-tabs .product-hub-tab:nth-child(4)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20'/%3E%3C/svg%3E");
}

.cross-domain-consent-page .product-hub-tabs .product-hub-tab.is-active::before {
  opacity: 1;
}

.cross-domain-consent-page .product-hub-tabs .product-hub-tab.is-active:nth-child(1)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='4' x2='4' y1='21' y2='14'/%3E%3Cline x1='4' x2='4' y1='10' y2='3'/%3E%3Cline x1='12' x2='12' y1='21' y2='12'/%3E%3Cline x1='12' x2='12' y1='8' y2='3'/%3E%3Cline x1='20' x2='20' y1='21' y2='16'/%3E%3Cline x1='20' x2='20' y1='12' y2='3'/%3E%3Cline x1='2' x2='6' y1='14' y2='14'/%3E%3Cline x1='10' x2='14' y1='8' y2='8'/%3E%3Cline x1='18' x2='22' y1='16' y2='16'/%3E%3C/svg%3E");
}

.cross-domain-consent-page .product-hub-tabs .product-hub-tab.is-active:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-2.48a2 2 0 0 0-1.93 1.46l-2.35 8.36a.25.25 0 0 1-.48 0L9.24 2.18a.25.25 0 0 0-.48 0l-2.35 8.36A2 2 0 0 1 4.49 12H2'/%3E%3C/svg%3E");
}

.cross-domain-consent-page .product-hub-tabs .product-hub-tab.is-active:nth-child(3)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 2v7.31'/%3E%3Cpath d='M14 9.3V1.99'/%3E%3Cpath d='M8.5 2h7'/%3E%3Cpath d='M14 9.3a6.5 6.5 0 1 1-4 0'/%3E%3Cpath d='M5.58 16.5h12.85'/%3E%3C/svg%3E");
}

.cross-domain-consent-page .product-hub-tabs .product-hub-tab.is-active:nth-child(4)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5v-15A2.5 2.5 0 0 1 6.5 2H19a1 1 0 0 1 1 1v18a1 1 0 0 1-1 1H6.5a1 1 0 0 1 0-5H20'/%3E%3C/svg%3E");
}

/* Diagnostics summary: icon before "Last sync" and "Last verification" */
.cross-domain-consent-page section[aria-labelledby="cross-domain-diagnostics"] > ul.product-hub-troubleshooting__list > li > strong::before {
  content: "";
  display: inline-block;
  vertical-align: -2px;
  width: 15px;
  height: 15px;
  margin-right: 7px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.cross-domain-consent-page section[aria-labelledby="cross-domain-diagnostics"] > ul.product-hub-troubleshooting__list > li:nth-child(1) > strong::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E");
}

.cross-domain-consent-page section[aria-labelledby="cross-domain-diagnostics"] > ul.product-hub-troubleshooting__list > li:nth-child(2) > strong::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

/* Token validation heading: key icon */
.cross-domain-consent-page section[aria-labelledby="cross-domain-testing"] > div.product-hub-config-card__subsection:nth-child(3) > h4 {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.cross-domain-consent-page section[aria-labelledby="cross-domain-testing"] > div.product-hub-config-card__subsection:nth-child(3) > h4::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15.5 7.5 2.3 2.3a1 1 0 0 0 1.4 0l2.1-2.1a1 1 0 0 0 0-1.4L19 4'/%3E%3Cpath d='m21 2-9.6 9.6'/%3E%3Ccircle cx='7.5' cy='15.5' r='5.5'/%3E%3C/svg%3E");
}

/* Marked action buttons: icons + minimal highlight */
.cross-domain-consent-page .btn--cross-domain-refresh,
.cross-domain-consent-page .btn--cross-domain-verify {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: none;
}

.cross-domain-consent-page .btn--cross-domain-refresh::before,
.cross-domain-consent-page .btn--cross-domain-verify::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

.cross-domain-consent-page .btn--cross-domain-refresh {
  color: #1d4ed8;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
}

.cross-domain-consent-page .btn--cross-domain-refresh:hover:not(:disabled) {
  color: #1e40af;
  background: #dbeafe;
  border-color: #93c5fd;
}

.cross-domain-consent-page .btn--cross-domain-refresh::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231d4ed8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

.cross-domain-consent-page .btn--cross-domain-verify {
  color: #6d28d9;
  background: #f5f3ff;
  border: 1px solid #ddd6fe;
}

.cross-domain-consent-page .btn--cross-domain-verify:hover:not(:disabled) {
  color: #5b21b6;
  background: #ede9fe;
  border-color: #c4b5fd;
}

.cross-domain-consent-page .btn--cross-domain-verify::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236d28d9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

/* ─── Microsoft UET Consent Mode — stat card label icons ─── */
.microsoft-uet-page .product-hub-stat-card:has(.product-hub-stat-card__icon),
.microsoft-uet-page .product-hub-stat-card:nth-child(-n+4) {
  display: grid;
  grid-template-columns: 28px 1fr;
  column-gap: 10px;
  row-gap: 8px;
  align-items: start;
}

.microsoft-uet-page .product-hub-stat-card__icon {
  position: static;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background-color: #f1f5f9;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
  pointer-events: none;
  grid-column: 1;
  grid-row: 1;
}
.microsoft-uet-page .product-hub-inline-actions {
  justify-content: start;
  margin-top: 0;
}
.microsoft-uet-page .product-hub-stat-card__label {
  grid-column: 2;
  grid-row: 1;
  margin-bottom: 0;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.05em;
}

.microsoft-uet-page .product-hub-stat-card__value,
.microsoft-uet-page .product-hub-stat-card strong {
  grid-column: 1 / -1;
  grid-row: 2;
}

.microsoft-uet-page .product-hub-stat-card__helper {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: 0;
}

.microsoft-uet-page .product-hub-stat-card__icon--status {
  background-color: #e8f4fc;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230078d4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

.microsoft-uet-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label {
  color: #0078d4;
}

.microsoft-uet-page .product-hub-stat-card__icon--signals {
  background-color: #dbeafe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12.83 2.18 2 3.41'/%3E%3Cpath d='M21.83 12.18 18.42 14'/%3E%3Cpath d='m2.18 12.83 3.41-2'/%3E%3Cpath d='M12.83 21.82 14 18.42'/%3E%3Cpath d='M12 8a4 4 0 1 0 0 8 4 4 0 0 0 0-8Z'/%3E%3C/svg%3E");
}

.microsoft-uet-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label {
  color: #2563eb;
}

.microsoft-uet-page .product-hub-stat-card__icon--runtime {
  background-color: #ede9fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='16 18 22 12 16 6'/%3E%3Cpolyline points='8 6 2 12 8 18'/%3E%3C/svg%3E");
}

.microsoft-uet-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label {
  color: #7c3aed;
}

.microsoft-uet-page .product-hub-stat-card__icon--live-uetq {
  background-color: #ecfeff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230e7490' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='14' x='2' y='3' rx='2'/%3E%3Cpath d='M8 21h8'/%3E%3Cpath d='M12 17v4'/%3E%3C/svg%3E");
}

.microsoft-uet-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label {
  color: #0e7490;
}
.microsoft-uet-page .product-hub-signal-grid,
.microsoft-uet-page .product-hub-section {
  margin-bottom: 20px;
}
.product-hub-wizard,
.microsoft-uet-page .product-hub-section:last-child {
  margin-bottom: 0;
}
/* ─── Microsoft UET Consent Mode — validation buttons ─── */
.microsoft-uet-page .btn--microsoft-uet-rerun,
.microsoft-uet-page .product-hub-inline-actions[style*="marginBottom"] > .btn.secondary {
  color: #1d4ed8;
  background-color: #eff6ff !important;
  border: 1px solid #bfdbfe !important;
  box-shadow: 0 1px 2px rgba(29, 78, 216, 0.12);
}

.microsoft-uet-page .btn--microsoft-uet-rerun:hover:not(:disabled),
.microsoft-uet-page .product-hub-inline-actions[style*="marginBottom"] > .btn.secondary:hover:not(:disabled) {
  color: #1e40af;
  background-color: #dbeafe !important;
  border-color: #93c5fd !important;
}

.microsoft-uet-page .btn--microsoft-uet-doc,
.microsoft-uet-page .product-hub-config-card__subsection > .product-hub-inline-actions > .btn.secondary {
  color: #0078d4;
  background-color: #e8f4fc !important;
  border: 1px solid #b3d9f2 !important;
  box-shadow: 0 1px 2px rgba(0, 120, 212, 0.12);
}

.microsoft-uet-page .btn--microsoft-uet-doc:hover:not(:disabled),
.microsoft-uet-page .product-hub-config-card__subsection > .product-hub-inline-actions > .btn.secondary:hover:not(:disabled) {
  color: #005a9e;
  background-color: #cce4f7 !important;
  border-color: #7ec0eb !important;
}

/* Microsoft UET Consent Mode — live-site verification callout */
.microsoft-uet-page #microsoft-uet-validation .product-hub-panel-note:has(code) {
  position: relative;
  margin-top: 16px;
  margin-bottom: 0;
  padding: 14px 16px 14px 46px;
  font-size: 15px;
  line-height: 1.65;
  color: #0f4c75;
  background: linear-gradient(180deg, #e8f4fc 0%, #f0f9ff 100%);
  border: 1px solid #b3d9f2;
  border-left: 4px solid #0078d4;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0, 120, 212, 0.1);
}

.microsoft-uet-page #microsoft-uet-validation .product-hub-panel-note:has(code)::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 15px;
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230078d4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20'/%3E%3Cpath d='M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z'/%3E%3C/svg%3E");
}

.microsoft-uet-page #microsoft-uet-validation .product-hub-panel-note:has(code) code {
  font-size: 13px;
  font-weight: 600;
  padding: 2px 8px;
  color: #005a9e;
  background: #fff;
  border: 1px solid #7ec0eb;
  border-radius: 6px;
}

/* ─── Cross Domain Consent — fill test origins button ─── */
.btn--cross-domain-fill {
  margin-top: 8px;
  color: #0e7490;
  background-color: #ecfeff !important;
  border: 1px solid #a5f3fc !important;
  box-shadow: 0 1px 2px rgba(14, 116, 144, 0.1);
}

.btn--cross-domain-fill:hover:not(:disabled) {
  color: #155e75;
  background-color: #cffafe !important;
  border-color: #67e8f9 !important;
}

/* ─── Cross Domain Consent — diagnostics refresh button ─── */
section[aria-labelledby="cross-domain-diagnostics"] .btn--cross-domain-refresh,
section[aria-labelledby="cross-domain-diagnostics"] > .btn.secondary {
  color: #1d4ed8;
  background-color: #eff6ff !important;
  border: 1px solid #bfdbfe !important;
  box-shadow: 0 1px 2px rgba(29, 78, 216, 0.12);
}

section[aria-labelledby="cross-domain-diagnostics"] .btn--cross-domain-refresh:hover:not(:disabled),
section[aria-labelledby="cross-domain-diagnostics"] > .btn.secondary:hover:not(:disabled) {
  color: #1e40af;
  background-color: #dbeafe !important;
  border-color: #93c5fd !important;
}

/* ─── Cross Domain Consent — testing tab buttons ─── */
section[aria-labelledby="cross-domain-testing"] .btn--cross-domain-accept,
section[aria-labelledby="cross-domain-testing"] .product-hub-config-card__subsection:first-of-type > div > .btn:nth-child(1) {
  color: #16a34a;
  background-color: rgb(22 163 74 / 7%) !important;
  border: 1px solid #16a34a !important;
  box-shadow: 0 1px 2px rgba(22, 163, 74, 0.15);
}

section[aria-labelledby="cross-domain-testing"] .btn--cross-domain-accept:hover:not(:disabled),
section[aria-labelledby="cross-domain-testing"] .product-hub-config-card__subsection:first-of-type > div > .btn:nth-child(1):hover:not(:disabled) {
  color: #fff;
  background-color: #15803d !important;
  border-color: #15803d !important;
}

section[aria-labelledby="cross-domain-testing"] .btn--cross-domain-reject,
section[aria-labelledby="cross-domain-testing"] .product-hub-config-card__subsection:first-of-type > div > .btn:nth-child(2) {
  color: #dc2626;
  background-color: rgb(220 38 38 / 7%) !important;
  border: 1px solid #dc2626 !important;
  box-shadow: 0 1px 2px rgba(220, 38, 38, 0.15);
}

section[aria-labelledby="cross-domain-testing"] .btn--cross-domain-reject:hover:not(:disabled),
section[aria-labelledby="cross-domain-testing"] .product-hub-config-card__subsection:first-of-type > div > .btn:nth-child(2):hover:not(:disabled) {
  color: #fff;
  background-color: #b91c1c !important;
  border-color: #b91c1c !important;
}

section[aria-labelledby="cross-domain-testing"] .btn--cross-domain-category,
section[aria-labelledby="cross-domain-testing"] .product-hub-config-card__subsection:first-of-type > div > .btn:nth-child(3) {
  color: #2563eb;
  background-color: rgb(37 99 235 / 7%) !important;
  border: 1px solid #2563eb !important;
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.15);
}

section[aria-labelledby="cross-domain-testing"] .btn--cross-domain-category:hover:not(:disabled),
section[aria-labelledby="cross-domain-testing"] .product-hub-config-card__subsection:first-of-type > div > .btn:nth-child(3):hover:not(:disabled) {
  color: #fff;
  background-color: #1d4ed8 !important;
  border-color: #1d4ed8 !important;
}

section[aria-labelledby="cross-domain-testing"] .btn--cross-domain-verify,
section[aria-labelledby="cross-domain-testing"] .product-hub-config-card__subsection:nth-of-type(2) > .btn.secondary {
  color: #4f46e5;
  background-color: #eef2ff !important;
  border: 1px solid #c7d2fe !important;
  box-shadow: 0 1px 2px rgba(79, 70, 229, 0.12);
}

section[aria-labelledby="cross-domain-testing"] .btn--cross-domain-verify:hover:not(:disabled),
section[aria-labelledby="cross-domain-testing"] .product-hub-config-card__subsection:nth-of-type(2) > .btn.secondary:hover:not(:disabled) {
  color: #2562ff;
  background-color: #e0e7ff !important;
  border-color: #a5b4fc !important;
}

/* ─── Google Consent Mode v2 — stat card label icons ─── */
.google-gcm-page .product-hub-stat-card {
  position: static;
  min-height: 168px;
  padding: 16px 18px 18px;
  display: grid;
  grid-template-columns: 28px 1fr;
  column-gap: 10px;
  row-gap: 10px;
  align-items: start;
  align-content: start;
}

.google-gcm-page .product-hub-stat-card__icon {
  position: static;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background-color: #f1f5f9;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
  pointer-events: none;
  grid-column: 1;
  grid-row: 1;
}

.google-gcm-page .product-hub-stat-card__label {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  padding-top: 5px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.2;
}

.google-gcm-page .product-hub-stat-card__value,
.google-gcm-page .product-hub-stat-card strong {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
  min-height: 0;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.02em;
  color: #0f172a;
}

.google-gcm-page .product-hub-stat-card__helper {
  grid-column: 1 / -1;
  grid-row: 3;
  margin: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  color: #64748b;
}

/* Pending / processing KPI state — align chip, title, description */
.google-gcm-page .product-hub-stat-card .product-hub-stat-card__value:has(.cs-kpi-metric),
.google-gcm-page .product-hub-stat-card .cs-kpi-metric--inline,
.google-gcm-page .product-hub-stat-card .cs-kpi-metric--overlay {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  min-height: 0;
  padding: 0;
  width: 100%;
}

.google-gcm-page .product-hub-stat-card .cs-kpi-metric__icon-wrap {
  display: inline-flex;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  margin: 0;
}

.google-gcm-page .product-hub-stat-card .cs-kpi-metric__icon-wrap svg {
  width: 16px;
  height: 16px;
}

.google-gcm-page .product-hub-stat-card .cs-kpi-metric__chip {
  margin: 0;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.02em;
}

/* Keep clock icon + Pending chip on one row */
.google-gcm-page .product-hub-stat-card .cs-kpi-metric--inline > .cs-kpi-metric__icon-wrap {
  order: 0;
}

.google-gcm-page .product-hub-stat-card .cs-kpi-metric--inline > .cs-kpi-metric__chip {
  order: 0;
}

.google-gcm-page .product-hub-stat-card .cs-kpi-metric--inline {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 8px;
  row-gap: 6px;
  align-items: center;
}

.google-gcm-page .product-hub-stat-card .cs-kpi-metric--inline > .cs-kpi-metric__icon-wrap {
  grid-column: 1;
  grid-row: 1;
}

.google-gcm-page .product-hub-stat-card .cs-kpi-metric--inline > .cs-kpi-metric__chip {
  grid-column: 2;
  grid-row: 1;
  justify-self: start;
}

.google-gcm-page .product-hub-stat-card .cs-kpi-metric--inline > .cs-kpi-metric__subtitle,
.google-gcm-page .product-hub-stat-card .cs-kpi-metric--inline > .cs-kpi-metric__desc,
.google-gcm-page .product-hub-stat-card .cs-kpi-metric--inline > .cs-kpi-metric__action {
  grid-column: 1 / -1;
}

.google-gcm-page .product-hub-stat-card .cs-kpi-metric__subtitle {
  margin: 2px 0 0;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: #0f172a;
}

.google-gcm-page .product-hub-stat-card .cs-kpi-metric__desc {
  margin: 0;
  max-width: none;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.45;
  color: #3668e9;
}

.google-gcm-page .product-hub-stat-card .cs-kpi-metric__action {
  margin-top: 2px;
}

.google-gcm-page .product-hub-stat-card__icon--enabled {
  background-color: #dcfce7;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='12' x='2' y='6' rx='6'/%3E%3Ccircle cx='16' cy='12' r='3' fill='%2316a34a' stroke='none'/%3E%3C/svg%3E");
}

.google-gcm-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label {
  color: #16a34a;
}

.google-gcm-page .product-hub-stat-card__icon--validation {
  background-color: #dbeafe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

.google-gcm-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label {
  color: #2563eb;
}

.google-gcm-page .product-hub-stat-card__icon--signal {
  background-color: #ffedd5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-4l-3 9L9 3l-3 9H2'/%3E%3C/svg%3E");
}

.google-gcm-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label {
  color: #d97706;
}

.google-gcm-page .product-hub-stat-card__icon--gtm {
  background-color: #e8f0fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%234285f4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.586 2.586A2 2 0 0 0 11.172 2H4a2 2 0 0 0-2 2v7.172a2 2 0 0 0 .586 1.414l8.704 8.704a2.426 2.426 0 0 0 3.42 0l6.58-6.58a2.426 2.426 0 0 0 0-3.42z'/%3E%3Ccircle cx='7.5' cy='7.5' r='1.25' fill='%234285f4' stroke='none'/%3E%3C/svg%3E");
}

.google-gcm-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label {
  color: #4285f4;
}

/* ─── Google Consent Mode v2 — test signal button colors ─── */
/* Google Consent Mode v2 — action buttons (icons + minimal, overrides gradient .btn) */

.google-gcm-page [class*="btn--gcm-"]::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.google-gcm-page .btn--gcm-refresh::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

.google-gcm-page .btn--gcm-accept {
  color: #047857 !important;
  background: #ecfdf5 !important;
  border-color: #a7f3d0 !important;
}

.google-gcm-page .btn--gcm-accept:hover:not(:disabled),
.google-gcm-page .btn--gcm-accept:focus-visible {
  color: #065f46 !important;
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
}

.google-gcm-page .btn--gcm-accept::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

.google-gcm-page .btn--gcm-reject {
  color: #dc2626 !important;
  background: #fef2f2 !important;
  border-color: #fecaca !important;
}

.google-gcm-page .btn--gcm-reject:hover:not(:disabled),
.google-gcm-page .btn--gcm-reject:focus-visible {
  color: #b91c1c !important;
  background: #fee2e2 !important;
  border-color: #fca5a5 !important;
}

.google-gcm-page .btn--gcm-reject::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23dc2626' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E");
}

.google-gcm-page .btn--gcm-analytics {
  color: #1d4ed8 !important;
  background: #eff6ff !important;
  border-color: #bfdbfe !important;
}

.google-gcm-page .btn--gcm-analytics:hover:not(:disabled),
.google-gcm-page .btn--gcm-analytics:focus-visible {
  color: #1e40af !important;
  background: #dbeafe !important;
  border-color: #93c5fd !important;
}

.google-gcm-page .btn--gcm-analytics::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%231d4ed8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18'/%3E%3Cpath d='M7 16V9'/%3E%3Cpath d='M12 16V5'/%3E%3Cpath d='M17 16v-3'/%3E%3C/svg%3E");
}

.google-gcm-page .btn--gcm-doc {
  color: #1d4ed8 !important;
  background: #fff !important;
  border-color: #bfdbfe !important;
}

.google-gcm-page .btn--gcm-doc:hover:not(:disabled),
.google-gcm-page .btn--gcm-doc:focus-visible {
  color: #1e40af !important;
  background: #eff6ff !important;
  border-color: #93c5fd !important;
}

.google-gcm-page .btn--gcm-doc::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%231d4ed8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6'/%3E%3Cpath d='M10 14 21 3'/%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3C/svg%3E");
}

.google-gcm-page .btn--gcm-link {
  color: #2562ff !important;
  background: #eef2ff !important;
  border-color: #c7d2fe !important;
}

.google-gcm-page .btn--gcm-link:hover:not(:disabled),
.google-gcm-page .btn--gcm-link:focus-visible {
  color: #3730a3 !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
}

.google-gcm-page .btn--gcm-link::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E");
}

/* Cross Domain overrides GCM top-right stat layout (left label icons) */
.consent-premium-page.cross-domain-consent-page .product-hub-stat-card {
  position: static;
  padding-top: 16px;
  padding-right: 18px;
}

.consent-premium-page.cross-domain-consent-page .product-hub-stat-card__icon {
  position: static;
  top: auto;
  right: auto;
  width: 28px;
  height: 28px;
}

/* Google ACM overrides GCM top-right stat layout (left label icons) */
.consent-premium-page.google-acm-page .product-hub-stat-card {
  position: static;
  padding-top: 16px;
  padding-right: 18px;
}

.consent-premium-page.google-acm-page .product-hub-stat-card__icon {
  position: static;
  top: auto;
  right: auto;
  width: 28px;
  height: 28px;
}

/* ─── Cookie compliance page — action buttons ─── */
.prem-scanner-root [class*="btn--cc-"] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  background-image: none !important;
  font-weight: 600;
}

.prem-scanner-root [class*="btn--cc-"]::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.prem-scanner-root .btn--cc-view-report {
  font-size: 14px;
  padding: 6px 18px;
  color: #3730a3 !important;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  text-decoration: none;
}

.prem-scanner-root .btn--cc-view-report:hover,
.prem-scanner-root .btn--cc-view-report:focus-visible {
  color: #312e81;
  background: #e0e7ff;
  border-color: #a5b4fc;
}

.prem-scanner-root .btn--cc-view-report::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%233730a3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3Cpath d='M10 9H8'/%3E%3Cpath d='M16 13H8'/%3E%3Cpath d='M16 17H8'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-run-scan {
  color: #047857 !important;
  background: #ecfdf5 !important;
  border: 1px solid #a7f3d0 !important;
}

.prem-scanner-root .btn--cc-run-scan:hover:not(:disabled) {
  color: #065f46 !important;
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
}

.prem-scanner-root .btn--cc-run-scan::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7V5a2 2 0 0 1 2-2h2'/%3E%3Cpath d='M17 3h2a2 2 0 0 1 2 2v2'/%3E%3Cpath d='M21 17v2a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M7 21H5a2 2 0 0 1-2-2v-2'/%3E%3Cpath d='M7 12h10'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-run-full-scan {
  color: #0f766e !important;
  background: #f0fdfa !important;
  border: 1px solid #99f6e4 !important;
}

.prem-scanner-root .btn--cc-run-full-scan:hover:not(:disabled) {
  color: #115e59 !important;
  background: #ccfbf1 !important;
  border-color: #5eead4 !important;
}

.prem-scanner-root .btn--cc-run-full-scan::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230f766e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3-1.9 5.8a2 2 0 0 1-1.3 1.3L3 12l5.8 1.9a2 2 0 0 1 1.3 1.3L12 21l1.9-5.8a2 2 0 0 1 1.3-1.3L21 12l-5.8-1.9a2 2 0 0 1-1.3-1.3Z'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-stop-scan {
  color: #b91c1c !important;
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
}

.prem-scanner-root .btn--cc-stop-scan:hover:not(:disabled) {
  color: #991b1b !important;
  background: #fee2e2 !important;
  border-color: #fca5a5 !important;
}

.prem-scanner-root .btn--cc-stop-scan::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='6' width='12' height='12' rx='1'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-export-report {
  color: #b45309 !important;
  background: #fffbeb !important;
  border: 1px solid #fde68a !important;
}

.prem-scanner-root .btn--cc-export-report:hover:not(:disabled) {
  color: #92400e !important;
  background: #fef3c7 !important;
  border-color: #fcd34d !important;
}

.prem-scanner-root .btn--cc-export-report::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V3'/%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-refresh {
  color: #2563eb !important;
  background: #eff6ff !important;
  border: 1px solid #bfdbfe !important;
}

.prem-scanner-root .btn--cc-refresh:hover:not(:disabled) {
  color: #1d4ed8 !important;
  background: #dbeafe !important;
  border-color: #93c5fd !important;
}

.prem-scanner-root .btn--cc-refresh::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8'/%3E%3Cpath d='M21 3v5h-5'/%3E%3Cpath d='M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16'/%3E%3Cpath d='M8 16H3v5'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-load-preset {
  color: #6d28d9 !important;
  background: #f5f3ff !important;
  border: 1px solid #ddd6fe !important;
}

.prem-scanner-root .btn--cc-load-preset:hover:not(:disabled) {
  color: #5b21b6 !important;
  background: #ede9fe !important;
  border-color: #c4b5fd !important;
}

.prem-scanner-root .btn--cc-load-preset::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236d28d9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18'/%3E%3Cpath d='M3 12h18'/%3E%3Cpath d='m16 8 4 4-4 4'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-enterprise-scan {
  color: #15803d !important;
  background: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
}

.prem-scanner-root .btn--cc-enterprise-scan:hover:not(:disabled) {
  color: #166534 !important;
  background: #dcfce7 !important;
  border-color: #86efac !important;
}

.prem-scanner-root .btn--cc-enterprise-scan::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2315803d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z'/%3E%3Cpath d='m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.4 22.4 0 0 1-4 2z'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-ai-review {
  color: #7c3aed !important;
  background: #f5f3ff !important;
  border: 1px solid #ddd6fe !important;
}

.prem-scanner-root .btn--cc-ai-review:hover:not(:disabled) {
  color: #6d28d9 !important;
  background: #ede9fe !important;
  border-color: #c4b5fd !important;
}

.prem-scanner-root .btn--cc-ai-review::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 8V4H8'/%3E%3Crect width='16' height='12' x='4' y='8' rx='2'/%3E%3Cpath d='M2 14h2'/%3E%3Cpath d='M20 14h2'/%3E%3Cpath d='M15 13v2'/%3E%3Cpath d='M9 13v2'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-chart-view {
  color: #2563eb !important;
  background: #eff6ff !important;
  border: 1px solid #bfdbfe !important;
}

.prem-scanner-root .btn--cc-chart-view.is-active {
  color: #1d4ed8 !important;
  background: #dbeafe !important;
  border-color: #60a5fa !important;
  box-shadow: 0 0 0 1px #93c5fd;
}

.prem-scanner-root .btn--cc-chart-view::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18'/%3E%3Cpath d='M18 17V9'/%3E%3Cpath d='M13 17V5'/%3E%3Cpath d='M8 17v-3'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-table-view {
  color: #475569 !important;
  background: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
}

.prem-scanner-root .btn--cc-table-view.is-active {
  color: #334155 !important;
  background: #e2e8f0 !important;
  border-color: #94a3b8 !important;
  box-shadow: 0 0 0 1px #cbd5e1;
}

.prem-scanner-root .btn--cc-table-view::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18'/%3E%3Cpath d='M3 12h18'/%3E%3Cpath d='M3 7h18'/%3E%3Cpath d='M3 17h18'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-group-domain {
  color: #0e7490 !important;
  background: #ecfeff !important;
  border: 1px solid #a5f3fc !important;
}

.prem-scanner-root .btn--cc-group-domain.is-active {
  color: #155e75 !important;
  background: #cffafe !important;
  border-color: #22d3ee !important;
  box-shadow: 0 0 0 1px #67e8f9;
}

.prem-scanner-root .btn--cc-group-domain::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230e7490' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M2 12h20'/%3E%3Cpath d='M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-compliance-issues {
  color: #c2410c !important;
  background: #fff7ed !important;
  border: 1px solid #fed7aa !important;
}

.prem-scanner-root .btn--cc-compliance-issues:hover:not(:disabled) {
  color: #9a3412 !important;
  background: #ffedd5 !important;
  border-color: #fdba74 !important;
}

.prem-scanner-root .btn--cc-compliance-issues::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23c2410c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-valid {
  color: #15803d !important;
  background: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
  padding: 6px 10px;
  font-size: 12px;
}

.prem-scanner-root .btn--cc-valid:hover:not(:disabled) {
  background: #dcfce7 !important;
  border-color: #86efac !important;
}

.prem-scanner-root .btn--cc-valid::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2315803d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-false-positive {
  color: #b91c1c !important;
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
  padding: 6px 10px;
  font-size: 12px;
}

.prem-scanner-root .btn--cc-false-positive:hover:not(:disabled) {
  background: #fee2e2 !important;
  border-color: #fca5a5 !important;
}

.prem-scanner-root .btn--cc-false-positive::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m15 9-6 6'/%3E%3Cpath d='m9 9 6 6'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-export-pdf {
  color: #be123c !important;
  background: #fff1f2 !important;
  border: 1px solid #fecdd3 !important;
}

.prem-scanner-root .btn--cc-export-pdf:hover:not(:disabled) {
  background: #ffe4e6 !important;
  border-color: #fda4af !important;
}

.prem-scanner-root .btn--cc-export-pdf::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23be123c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 2v6h6'/%3E%3Cpath d='M10 13H8'/%3E%3Cpath d='M16 17H8'/%3E%3Cpath d='M16 13h-2'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-export-csv {
  color: #047857 !important;
  background: #ecfdf5 !important;
  border: 1px solid #a7f3d0 !important;
}

.prem-scanner-root .btn--cc-export-csv:hover:not(:disabled) {
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
}

.prem-scanner-root .btn--cc-export-csv::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 2v6h6'/%3E%3Cpath d='M8 13h2'/%3E%3Cpath d='M8 17h2'/%3E%3Cpath d='M14 13h2'/%3E%3Cpath d='M14 17h2'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-download {
  color: #2563eb !important;
  background: #eff6ff !important;
  border: 1px solid #bfdbfe !important;
  padding: 3px 12px;
  font-size: 14px;
}

.prem-scanner-root .btn--cc-download:hover:not(:disabled) {
  background: #dbeafe !important;
  border-color: #93c5fd !important;
}

.prem-scanner-root .btn--cc-download::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V3'/%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-page-prev,
.prem-scanner-root .btn--cc-page-next {
  color: #475569 !important;
  background: #f8fafc !important;
  border: 1px solid #cbd5e1 !important;
  padding: 8px 12px;
}

.prem-scanner-root .btn--cc-page-prev:hover:not(:disabled),
.prem-scanner-root .btn--cc-page-next:hover:not(:disabled) {
  background: #f1f5f9 !important;
  border-color: #94a3b8 !important;
}

.prem-scanner-root .btn--cc-page-prev::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15 18-6-6 6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-page-next::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .btn--cc-page-num {
  background: #fff;
  border: 1px solid #e2e8f0;
  min-width: 36px;
  justify-content: center;
}

.prem-scanner-root .btn--cc-page-num::after {
  display: none;
}

.prem-scanner-root .btn--cc-page-num.is-active {
  color: #1d4ed8 !important;
  background: #eff6ff !important;
  border-color: #93c5fd !important;
  font-weight: 700;
}

.prem-scanner-root .cc-head-actions {
  gap: 10px;
}

/* Cookie compliance — tab bar */
.prem-scanner-root .cc-tabs {
  gap: 4px;
  margin: 20px 0 24px;
  padding: 5px;
  border-bottom: none;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
  min-width: 0;
  max-width: 100%;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.prem-scanner-root .cc-tabs::-webkit-scrollbar {
  display: none;
}

.prem-scanner-root .cc-tabs .cc-tab {
  flex: 0 0 auto;
  white-space: nowrap;
}

.prem-scanner-root .cc-tab {
  position: relative;
  border: none;
  border-bottom: none;
  border-radius: 8px;
  margin-bottom: 0;
  padding: 10px 16px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: var(--ds-color-muted);
  background: transparent;
  cursor: pointer;
  transition: color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.prem-scanner-root .cc-tab:hover:not(.active) {
  color: #334155;
  background: rgba(226, 232, 240, 0.65);
}

.prem-scanner-root .cc-tab.active {
  color: #1e40af;
  background: #fff;
  border-bottom: none;
  font-weight: 700;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.06),
    0 0 0 1px rgba(148, 163, 184, 0.25);
}

.prem-scanner-root .cc-tab.active::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 5px;
  height: 3px;
  border-radius: 999px;
  background: #2563eb;
}

/* Per-tab accent when active */
.prem-scanner-root .cc-tab.active:nth-child(1) {
  color: #3730a3;
}

.prem-scanner-root .cc-tab.active:nth-child(1)::after {
  background: #4f46e5;
}

.prem-scanner-root .cc-tab.active:nth-child(2) {
  color: #0f766e;
}

.prem-scanner-root .cc-tab.active:nth-child(2)::after {
  background: #0d9488;
}

.prem-scanner-root .cc-tab.active:nth-child(3) {
  color: #6d28d9;
}

.prem-scanner-root .cc-tab.active:nth-child(3)::after {
  background: #7c3aed;
}

.prem-scanner-root .cc-tab.active:nth-child(4) {
  color: #1d4ed8;
}

.prem-scanner-root .cc-tab.active:nth-child(4)::after {
  background: #2563eb;
}

.prem-scanner-root .cc-tab.active:nth-child(5) {
  color: #047857;
}

.prem-scanner-root .cc-tab.active:nth-child(5)::after {
  background: #059669;
}

.prem-scanner-root .cc-tab.active:nth-child(6) {
  color: #c2410c;
}

.prem-scanner-root .cc-tab.active:nth-child(6)::after {
  background: #ea580c;
}

/* Cookie compliance — tab list scroll navigation (only below 1280px) */
.prem-scanner-root .cc-tabs-shell {
  display: contents;
}

.prem-scanner-root .cc-tabs-nav {
  display: none;
}

@media (max-width: 1279.98px) {
  /* Bare tab list (no shell wrapper in React) — horizontal scroll */
  .prem-scanner-root .cc-tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .prem-scanner-root .cc-tabs::-webkit-scrollbar {
    display: none;
  }

  .prem-scanner-root .cc-tabs .cc-tab {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .prem-scanner-root .cc-tabs-shell {
    display: flex;
    align-items: stretch;
    gap: 0;
    position: relative;
    margin: 20px 0 24px;
    padding: 5px;
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  }

  .prem-scanner-root .cc-tabs-shell .cc-tabs {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    padding: 0;
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .prem-scanner-root .cc-tabs-shell .cc-tabs::-webkit-scrollbar {
    display: none;
  }

  .prem-scanner-root .cc-tabs-shell .cc-tab {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .prem-scanner-root .cc-tabs-nav {
    flex: 0 0 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    min-width: 30px;
    margin: 0;
    padding: 0;
    color: #3668e9;
    background: transparent;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: color 0.15s ease, background-color 0.15s ease, opacity 0.15s ease;
  }

  .prem-scanner-root .cc-tabs-nav:hover:not(:disabled) {
    color: #2563eb;
    background: rgba(255, 255, 255, 0.85);
  }

  .prem-scanner-root .cc-tabs-nav:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.2);
  }

  .prem-scanner-root .cc-tabs-nav:disabled {
    opacity: 0.35;
    cursor: default;
  }

  .prem-scanner-root .cc-tabs-shell:not(.cc-tabs-shell--scrollable) .cc-tabs-nav {
    display: none;
  }

  .prem-scanner-root .cc-tabs-shell--can-left::before,
  .prem-scanner-root .cc-tabs-shell--can-right::after {
    content: "";
    position: absolute;
    top: 5px;
    bottom: 5px;
    width: 20px;
    pointer-events: none;
    z-index: 1;
  }

  .prem-scanner-root .cc-tabs-shell--can-left::before {
    left: 30px;
    background: linear-gradient(90deg, #f4f7fb 25%, rgba(244, 247, 251, 0));
  }

  .prem-scanner-root .cc-tabs-shell--can-right::after {
    right: 30px;
    background: linear-gradient(270deg, #f4f7fb 25%, rgba(244, 247, 251, 0));
  }
}

/* Cookie compliance — search & filter inputs */
.prem-scanner-root .cr-table-tools {
  gap: 10px;
  margin-bottom: 18px;
  padding: 14px;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.prem-scanner-root .cr-search,
.prem-scanner-root .cr-filter {
  font-size: 15px;
  font-weight: 500;
  color: #0f172a;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  padding: 11px 14px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.prem-scanner-root .cr-search {
  flex: 1 1 100%;
  min-width: 0 !important;
  width: 100%;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left 12px center;
  background-size: 16px;
  padding-left: 38px;
}

.prem-scanner-root .cr-search::placeholder {
  color: var(--ds-color-muted);
  font-weight: 400;
}

.prem-scanner-root .cr-filter {
  min-width: 160px;
  cursor: pointer;
  appearance: none;
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  padding-right: 36px;
}

.prem-scanner-root .cr-filter:nth-child(2) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .cr-filter:nth-child(3) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230891b2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .cr-filter:nth-child(4) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ea580c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .cr-filter:nth-child(n + 5) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .cr-search:hover,
.prem-scanner-root .cr-filter:hover {
  border-color: #3668e9;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.06);
}

.prem-scanner-root .cr-search:focus,
.prem-scanner-root .cr-filter:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow:
    0 0 0 3px rgba(37, 99, 235, 0.18),
    0 1px 2px rgba(15, 23, 42, 0.05);
}

.prem-scanner-root .cr-search:focus {
  background-color: #fff;
}

/* Cookie compliance — Enterprise scan configuration selects */
.prem-scanner-root .prem-enterprise__body select.cc-ctrl-input {
  cursor: pointer;
  appearance: none;
  width: 100%;
  min-height: 44px;
  padding: 11px 36px 11px 14px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 500;
  color: #0f172a;
  background-color: #fff;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.prem-scanner-root .prem-enterprise__body .cc-ctrl-grid label:nth-child(3) select.cc-ctrl-input,
.prem-scanner-root .prem-enterprise__body .cc-ctrl-grid select.cc-ctrl-input:first-of-type {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E");
}

.prem-scanner-root .prem-enterprise__body .cc-ctrl-grid label:nth-child(6) select.cc-ctrl-input,
.prem-scanner-root .prem-enterprise__body .cc-ctrl-grid select.cc-ctrl-input:last-of-type {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ea580c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .prem-enterprise__body select.cc-ctrl-input:hover {
  border-color: #94a3b8;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.06);
}

.prem-scanner-root .prem-enterprise__body select.cc-ctrl-input:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow:
    0 0 0 3px rgba(37, 99, 235, 0.18),
    0 1px 2px rgba(15, 23, 42, 0.05);
}

/* Tracker inventory — toolbar, chart & legend alignment */
.prem-scanner-root section[aria-labelledby="cr-table-heading"] .cr-section-title {
  margin: 0 0 0px;
  font-size: 1.25rem;
  font-weight: 700;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"].cr-panel {
  padding: 20px 22px 22px;
}

.prem-scanner-root .cc-inventory-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px 20px;
  margin-bottom: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid #e2e8f0;
}

.prem-scanner-root .cc-inventory-toolbar__left {
  flex: 1 1 260px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.prem-scanner-root .cc-inventory-toolbar__desc {
  margin: 10px 0 14px !important;
  font-size: 16px;
  line-height: 1.5;
  color: #475569;
}

.prem-scanner-root .cc-inventory-toolbar__chart-label {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
  color: #3668e9;
  margin-bottom: 0 !important;
}

.prem-scanner-root .cc-inventory-toolbar__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex: 1 1 520px;
}

.prem-scanner-root .cc-inventory-toolbar__actions [class*="btn--cc-"] {
  font-size: 13px;
  min-height: 38px;
  padding: 8px 14px;
  white-space: nowrap;
}

.prem-scanner-root .cc-inventory-chart {
  width: 100%;
  height: 280px;
  margin: 4px 0 16px;
  padding: 14px 10px 8px;
  background: #fafbfc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-sizing: border-box;
}

.prem-scanner-root .cc-inventory-chart .recharts-wrapper {
  margin: 0 auto;
}

.prem-scanner-root .cc-inventory-chart .recharts-cartesian-axis-tick-value {
  font-size: 12px;
  fill: #3668e9;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] .cr-tracker-summary {
  align-items: center;
  gap: 10px 14px;
  margin: 0 0 16px;
  padding: 12px 16px;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] .cr-tracker-summary__total {
  display: flex;
  align-items: baseline;
  gap: 4px;
  flex-shrink: 0;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] .cr-tracker-summary__total strong {
  font-size: 18px;
  line-height: 1.2;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] .cr-tracker-summary__total span {
  font-size: 14px;
  line-height: 1.2;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] .cr-tracker-summary__chips {
  gap: 6px 10px;
  flex: 1;
  align-items: center;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] .cr-tracker-summary__chip {
  gap: 5px;
  font-size: 13px;
  line-height: 1.3;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] .cr-tracker-summary__dot {
  width: 7px;
  height: 7px;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] .cr-tracker-summary__pct {
  font-size: 12px;
}

@media (max-width: 900px) {
  .prem-scanner-root .cc-inventory-toolbar__actions {
    justify-content: flex-start;
    flex-basis: 100%;
  }
}

/* Tracker inventory — data table alignment & typography */
.prem-scanner-root .cr-table-scroll--inventory {
  border-color: #e2e8f0;
  border-radius: 12px;
  margin-bottom: 12px;
}

.prem-scanner-root .cr-table--inventory {
  font-size: 16px;
}

.prem-scanner-root .cr-table--inventory th {
  padding: 12px 14px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
  vertical-align: middle;
  white-space: nowrap;
}

.prem-scanner-root .cr-table--inventory td {
  padding: 12px 14px;
  vertical-align: middle !important;
  line-height: 1.45;
}

.prem-scanner-root .cr-table--inventory .cr-th-btn {
  font-size: 13px;
  font-weight: 700;
}

.prem-scanner-root .cr-table--inventory .cr-td-mono {
  font-size: 15px;
  line-height: 1.4;
  max-width: 340px;
}

.prem-scanner-root .cr-table--inventory .cr-td-group {
  font-size: 14px;
  max-width: 160px;
}

.prem-scanner-root .cr-table--inventory .cr-td-url {
  font-size: 14px;
  line-height: 1.4;
  max-width: 300px;
}

.prem-scanner-root .cr-table--inventory .cr-badge {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 11px;
  line-height: 1.35;
  vertical-align: middle;
}

.prem-scanner-root .cr-table--inventory .cr-badge--risk {
  font-weight: 700;
  border: 1px solid transparent;
}

.prem-scanner-root .cr-table--inventory .cr-td-review {
  width: 1%;
  white-space: nowrap;
  vertical-align: middle !important;
}

.prem-scanner-root .cr-table--inventory .cc-inventory-review {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
}

.prem-scanner-root .cr-table--inventory .cc-inventory-review [class*="btn--cc-"] {
  font-size: 13px;
  min-height: 34px;
  padding: 6px 11px;
  gap: 6px;
  white-space: nowrap;
}

.prem-scanner-root .cr-table--inventory .cc-inventory-review [class*="btn--cc-"]::after {
  width: 14px;
  height: 14px;
}

.prem-scanner-root .cr-table--inventory tbody tr:nth-child(2n) td {
  background: rgba(230, 255, 250, 0.22);
}

.prem-scanner-root .cr-table--inventory tbody tr:hover td {
  background: rgba(15, 118, 110, 0.08);
}

/* Cookie compliance — Why this classification panel */
.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 16px;
  padding: 16px 18px;
  background: linear-gradient(180deg, #eef2ff 0%, #f8fafc 100%);
  border: 1px solid #c7d2fe;
  border-left: 4px solid #6366f1;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(99, 102, 241, 0.1);
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > strong {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
  color: #3730a3;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div {
  margin-top: 0 !important;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > strong + div {
  margin-top: 10px !important;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="word-break"] {
  padding: 10px 12px;
  font-size: 14px;
  line-height: 1.45;
  color: #334155;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="word-break"] + div {
  margin-top: 8px !important;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="color: rgb(71, 85, 105)"],
.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="#475569"] {
  padding: 10px 12px;
  font-size: 15px;
  line-height: 1.55;
  color: #475569;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="color: rgb(71, 85, 105)"] + div,
.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="#475569"] + div[style*="font-size: 13px"],
.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="#475569"] + div[style*="font-size:13px"] {
  margin-top: 8px !important;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="font-size: 13px"],
.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="font-size:13px"] {
  padding: 10px 12px;
  font-size: 15px !important;
  line-height: 1.55;
  color: #334155;
  background: #fff;
  border: 1px solid #e2e8f0;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="#475569"] + div[style*="font-size: 13px"],
.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="#475569"] + div[style*="font-size:13px"] {
  border-radius: 10px 10px 0 0;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="font-size: 13px"] + div[style*="font-size: 13px"],
.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="font-size:13px"] + div[style*="font-size:13px"] {
  border-top: none;
  border-radius: 0;
}

.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="font-size: 13px"]:last-child,
.prem-scanner-root section[aria-labelledby="cr-table-heading"] > .card > div[style*="font-size:13px"]:last-child {
  border-radius: 0 0 10px 10px;
}

/* Cookie compliance — AI-classified cookies variant coverage */
.prem-scanner-root section[aria-labelledby="cr-ai-cookies-heading"] > .card {
  margin-bottom: 14px;
  padding: 14px 16px;
  background: linear-gradient(180deg, #eff6ff 0%, #f8fafc 100%);
  border: 1px solid #bfdbfe;
  border-left: 4px solid #2563eb;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(37, 99, 235, 0.08);
}

.prem-scanner-root section[aria-labelledby="cr-ai-cookies-heading"] > .card > strong {
  display: block;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  color: #1d4ed8;
}

.prem-scanner-root section[aria-labelledby="cr-ai-cookies-heading"] > .card > div[style*="display: flex"],
.prem-scanner-root section[aria-labelledby="cr-ai-cookies-heading"] > .card > div[style*="display:flex"] {
  display: flex !important;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 10px !important;
  margin-top: 10px !important;
}

.prem-scanner-root section[aria-labelledby="cr-ai-cookies-heading"] > .card > div[style*="display: flex"] > .cr-badge,
.prem-scanner-root section[aria-labelledby="cr-ai-cookies-heading"] > .card > div[style*="display:flex"] > .cr-badge {
  display: inline-flex;
  align-items: center;
  flex: 1 1 calc(50% - 5px);
  min-width: min(100%, 280px);
  min-height: 42px;
  margin: 0;
  padding: 10px 14px;
  border-radius: 10px;
  font-size: 13px !important;
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: 0;
  color: #1e3a8a;
  background: #fff;
  border: 1px solid #93c5fd;
  box-shadow: 0 1px 2px rgba(37, 99, 235, 0.08);
  white-space: normal;
}

/* Tracker inventory by category — summary highlight */
.prem-scanner-root .cc-category-summary {
  margin-top: 18px;
  padding: 16px 18px;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.8),
    0 1px 2px rgba(15, 23, 42, 0.04);
}

.prem-scanner-root .cc-category-summary__title {
  margin: 0 0 12px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
}

.prem-scanner-root .cc-category-summary__counts {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
}

.prem-scanner-root .cc-category-summary__chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  border: 1px solid transparent;
}

.prem-scanner-root .cc-category-summary__chip strong {
  font-size: 14px;
  font-weight: 700;
}

.prem-scanner-root .cc-category-summary__chip--necessary {
  color: #166534;
  background: #dcfce7;
  border-color: #bbf7d0;
}

.prem-scanner-root .cc-category-summary__chip--preferences {
  color: #6d28d9;
  background: #f3e8ff;
  border-color: #e9d5ff;
}

.prem-scanner-root .cc-category-summary__chip--statistics {
  color: #a16207;
  background: #fef9c3;
  border-color: #fde68a;
}

.prem-scanner-root .cc-category-summary__chip--marketing {
  color: #b91c1c;
  background: #fee2e2;
  border-color: #fecaca;
}

.prem-scanner-root .cc-category-summary__chip--unclassified {
  color: #475569;
  background: #f1f5f9;
  border-color: #e2e8f0;
}

/* Compliance issues tab — overview, exports & history */
.prem-scanner-root .cc-issues-panel {
  margin-bottom: 0;
}

.prem-scanner-root .cc-issues-panel .cr-section-title {
  margin: 0 0 8px;
  font-size: 1.25rem;
  font-weight: 700;
  color: #0f172a;
}

.prem-scanner-root .cc-issues-panel .cr-panel-desc {
  margin: 0 0 10px !important;
  font-size: 16px;
  line-height: 1.45;
  color: #475569;
}

.prem-scanner-root .cc-issues-note {
  margin: 0 0 19px !important;
  font-size: 15px;
  line-height: 1.45;
}

.prem-scanner-root .cc-issues-chart {
  width: 100%;
  height: 248px;
  min-height: 220px;
  max-height: 260px;
  margin: 0;
  padding: 10px 8px 4px;
  background: #fafbfc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-sizing: border-box;
}

.prem-scanner-root .cc-issues-chart .recharts-wrapper {
  margin: 0 auto;
}

.prem-scanner-root .cc-issues-export-row {
  margin-top: 16px !important;
  margin-bottom: 16px !important;
  padding: 0 2px;
  gap: 10px;
  align-items: center;
}

.prem-scanner-root .cc-issues-export-row [class*="btn--cc-"] {
  font-size: 14px;
  min-height: 40px;
  padding: 9px 16px;
}

.prem-scanner-root .cc-export-history-panel {
  margin-top: 0 !important;
}

.prem-scanner-root .cc-export-history-panel .cr-section-title {
  margin: 0 0 14px;
  font-size: 1.25rem;
  font-weight: 700;
  color: #0f172a;
}

.prem-scanner-root .cc-export-history-panel .cr-muted {
  margin: 0;
  font-size: 14px;
}

.prem-scanner-root .cc-export-history-scroll {
  border-color: #e2e8f0;
  border-radius: 12px;
  margin: 0;
  max-height: none;
  overflow-x: auto;
}

.prem-scanner-root .cc-export-history-table {
  font-size: 14px;
}

.prem-scanner-root .cc-export-history-table th {
  padding: 11px 14px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ds-color-muted);
  vertical-align: middle;
  white-space: nowrap;
}

.prem-scanner-root .cc-export-history-table td {
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.4;
  vertical-align: middle !important;
  color: #334155;
}

.prem-scanner-root .cc-export-history-table .btn--cc-download {
  font-size: 13px;
  min-height: 34px;
  padding: 6px 12px;
  white-space: nowrap;
}

/* Categories tab — category breakdown chart & legend */
.prem-scanner-root .cc-categories-section .cr-section-title {
  margin: 0 0 14px;
  font-size: 1.25rem;
  font-weight: 700;
  color: #0f172a;
}

.prem-scanner-root .cc-category-breakdown {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(200px, 0.8fr);
  gap: 20px 28px;
  align-items: end;
  padding: 18px 40px 30px !important;
}

.prem-scanner-root .cc-category-chart {
  width: 80%;
  height: 330px;
  min-height: 330px;
  padding: 4px 0 0;
  box-sizing: border-box;
}

.prem-scanner-root .cc-category-chart .recharts-wrapper {
  margin: 0 auto;
}

.prem-scanner-root .cc-category-chart .recharts-pie-label-text {
  font-size: 12px;
  font-weight: 700;
  fill: #334155;
}

.prem-scanner-root .cc-category-chart .recharts-default-legend {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 6px 14px !important;
  padding: 6px 8px 0 !important;
  margin: 0 !important;
}

.prem-scanner-root .cc-category-chart .recharts-legend-item {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  line-height: 1.3;
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
}

.prem-scanner-root .cc-category-chart .recharts-legend-item-text {
  font-size: 16px !important;
  color: #475569 !important;
}

.prem-scanner-root .cc-category-legend {
  display: flex;
  flex-direction: column;
  gap: 15px;
  justify-content: center;
  padding: 4px 0;
  max-width: 281px;
  width: 100%;
  margin-left: auto;
}

.prem-scanner-root .cc-category-legend-row {
  display: grid;
  grid-template-columns: 10px 1fr minmax(52px, auto);
  align-items: center;
  gap: 10px 12px;
  font-size: 16px;
  line-height: 1.35;
  color: #334155;
}

.prem-scanner-root .cc-category-legend-name {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.prem-scanner-root .cc-category-legend-row strong {
  font-size: 14px;
  font-weight: 700;
  color: #0f172a;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.prem-scanner-root .cc-category-legend-total {
  margin-top: 6px;
  padding-top: 10px;
  border-top: 1px solid #e2e8f0;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  text-align: right;
  color: #334155;
}

.prem-scanner-root .cc-category-legend .cr-category-dot {
  width: 8px;
  height: 8px;
}

@media (max-width: 900px) {
  .prem-scanner-root .cc-category-breakdown {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .prem-scanner-root .cc-category-legend {
    max-width: none;
    margin-left: 0;
  }
}

/* Scan coverage — plan meta highlight */
.prem-scanner-root .cc-scan-coverage-meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 12px;
  margin: 4px 0 14px;
  padding: 14px 16px;
  background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
  border: 1px solid #93c5fd;
  border-radius: 12px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 1px 2px rgba(37, 99, 235, 0.08);
}

.prem-scanner-root .cc-scan-coverage-meta__item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.prem-scanner-root .cc-scan-coverage-meta dt {
  margin: 0;
  font-weight: 600;
  color: #1e40af;
  letter-spacing: 0.01em;
}

.prem-scanner-root .cc-scan-coverage-meta dd {
  margin: 0;
  font-size: 18px !important;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.2;
}

.prem-scanner-root .cc-scan-coverage-meta__item--warn dt {
  color: #c2410c;
}

.prem-scanner-root .cc-scan-coverage-meta__item--warn dd {
  color: #9a3412;
}

/* Scanner diagnostics — summary highlight */
.prem-scanner-root .cc-scanner-diagnostics-summary {
  margin: 0 0 14px !important;
  padding: 12px 16px;
  background: linear-gradient(180deg, #f0fdf4 0%, #dcfce7 100%);
  border: 1px solid #86efac;
  border-radius: 12px;
  font-size: 14px !important;
  line-height: 1.45;
  color: #166534;
  font-weight: 500;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 1px 2px rgba(22, 101, 52, 0.08);
}

/* ─── Dashboard charts — unified Recharts hover tooltips ─── */
body:not(.cookieshift-landing) .recharts-tooltip-wrapper {
  z-index: 20;
  pointer-events: none;
  outline: none;
}

body:not(.cookieshift-landing) .recharts-default-tooltip {
  margin: 0 !important;
  padding: 10px 14px 12px !important;
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.1) !important;
  font-family: inherit;
  text-align: center;
}

body:not(.cookieshift-landing) .recharts-tooltip-label {
  margin: 0 0 6px !important;
  padding: 0 !important;
  font-size: 12px !important;
  font-weight: 600;
  line-height: 1.35;
  color: #3668e9 !important;
  text-align: center;
}

body:not(.cookieshift-landing) .recharts-tooltip-item-list {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}

body:not(.cookieshift-landing) .recharts-tooltip-item {
  position: relative;
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 0 4px;
  margin: 0 !important;
  padding: 0 0 10px !important;
  font-size: 14px !important;
  font-weight: 600;
  line-height: 1.4;
  color: #0f172a;
  text-align: center;
}

body:not(.cookieshift-landing) .recharts-tooltip-item-name,
body:not(.cookieshift-landing) .recharts-tooltip-item-value {
  font-size: 14px !important;
  font-weight: 600;
  line-height: 1.4;
}

body:not(.cookieshift-landing) .recharts-tooltip-item-separator {
  margin: 0 1px;
  color: inherit;
}

body:not(.cookieshift-landing) .recharts-tooltip-item-unit {
  font-size: 13px !important;
  font-weight: 500;
  color: #3668e9;
}

body:not(.cookieshift-landing) .recharts-tooltip-item-color {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100% !important;
  height: 3px !important;
  margin: 0 !important;
  border-radius: 999px;
}

/* Chart.js tooltips (compliance report & other canvas charts) */
body:not(.cookieshift-landing) .chartjs-tooltip,
body:not(.cookieshift-landing) #chartjs-tooltip {
  opacity: 1 !important;
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.1) !important;
  padding: 10px 14px !important;
  font-family: inherit;
  font-size: 14px !important;
  font-weight: 600;
  line-height: 1.4;
  color: #0f172a;
  text-align: center;
}

body:not(.cookieshift-landing) .chartjs-tooltip-key,
body:not(.cookieshift-landing) .chartjs-tooltip-body {
  text-align: center;
}

/* Scan trend line chart — 16px typography */
.prem-scanner-root .prem-chart-card--trend .prem-chart-card__label {
  font-size: 16px;
}

.prem-scanner-root .prem-chart-card--trend .prem-trend-legend {
  font-size: 16px;
}

.prem-scanner-root .prem-trend-chart .recharts-cartesian-axis-tick-value {
  font-size: 14px !important;
  fill: #3668e9;
}

.prem-scanner-root .prem-trend-chart .recharts-default-tooltip,
.prem-scanner-root .prem-trend-chart .recharts-tooltip-label,
.prem-scanner-root .prem-trend-chart .recharts-tooltip-item,
.prem-scanner-root .prem-trend-chart .recharts-tooltip-item-name,
.prem-scanner-root .prem-trend-chart .recharts-tooltip-item-value {
  font-size: 15px !important;
}

/* Tracker table pagination — row count & page size highlight */
.prem-scanner-root .cc-pagination-meta-bar {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  padding: 12px 11px 12px 16px;
  background: linear-gradient(180deg, #faf5ff 0%, #f3e8ff 100%);
  border: 1px solid #d8b4fe;
  border-radius: 12px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 1px 2px rgba(109, 40, 217, 0.08);
}

.prem-scanner-root .cr-pagination .cc-pagination-meta-bar {
  margin-left: auto;
  flex-shrink: 0;
}

.prem-scanner-root .cc-history-section .cr-pagination {
  margin: 16px 0 4px;
  padding-top: 4px;
}

.prem-scanner-root .cc-pagination-row-count {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  color: #5b21b6;
  white-space: nowrap;
}

.prem-scanner-root .cc-pagination-row-count strong {
  font-size: 16px;
  font-weight: 700;
  color: #4c1d95;
  font-variant-numeric: tabular-nums;
}

.prem-scanner-root .cc-pagination-page-size {
  min-width: 118px;
  min-height: 40px;
  padding: 8px 34px 8px 14px;
  font-size: 14px;
  font-weight: 600;
  color: #3730a3;
  text-align: left;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.01em;
  background-color: #fff;
  border: 1.5px solid #c4b5fd;
  border-radius: 10px;
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 16px;
}

.prem-scanner-root .cc-pagination-page-size:hover {
  border-color: #a78bfa;
  background-color: #faf5ff;
}

.prem-scanner-root .cc-pagination-page-size:focus {
  outline: none;
  border-color: #7c3aed;
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.18);
}

/* Scanner status + empty state highlight */
.prem-scanner-root .cc-scanner-status-banner {
  margin: 0 0 12px;
  padding: 12px 16px;
  background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
  border: 1px solid #93c5fd;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.45;
  color: #1e40af;
  text-align: center;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 1px 2px rgba(37, 99, 235, 0.08);
}

.prem-scanner-root .cc-scanner-status-banner.cr-infra--warn {
  background: linear-gradient(180deg, #fffbeb 0%, #fef3c7 100%) !important;
  border-color: #fcd34d !important;
  color: #92400e;
}

.prem-scanner-root .cc-scanner-empty-state {
  margin-top: 0;
  padding: 32px 28px;
  text-align: center;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1px solid #cbd5e1;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.8),
    0 2px 8px rgba(15, 23, 42, 0.06);
}

.prem-scanner-root .cc-scanner-status-banner + .cc-scanner-empty-state {
  margin-top: 12px;
}

.prem-scanner-root .cc-scanner-empty-state .cr-empty-title {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
}

.prem-scanner-root .cc-scanner-empty-state .cr-empty-text {
  margin: 0 auto;
  max-width: 520px;
  font-size: 15px;
  line-height: 1.55;
  color: #475569;
}

/* Related links bar — slash separators & alignment (PageDiscoverability) */
body:not(.cookieshift-landing) .page-discoverability {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  row-gap: 8px;
}

body:not(.cookieshift-landing) .page-discoverability__label {
  margin-right: 12px;
  flex-shrink: 0;
  line-height: 1.4;
}

body:not(.cookieshift-landing) .page-discoverability__link {
  display: inline-flex;
  align-items: center;
  font-size: 15px;
  line-height: 1.4;
  white-space: nowrap;
}

body:not(.cookieshift-landing) .page-discoverability__link::after {
  content: none !important;
  margin: 0 !important;
}

body:not(.cookieshift-landing) .page-discoverability__link:last-child::after {
  content: none !important;
}

body:not(.cookieshift-landing) .page-discoverability__link:has(+ .page-discoverability__link)::after {
  content: "/" !important;
  margin: 0 12px !important;
  color: #94a3b8 !important;
  font-weight: 400;
  text-decoration: none;
  pointer-events: none;
}

body:not(.cookieshift-landing) .page-discoverability .contextual-help-link {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  font-size: 15px;
  line-height: 1.4;
  padding-left: 16px;
}

/* Dashboard Quick Actions — distinct icon colors & light backgrounds */
body:not(.cookieshift-landing) .dash-quick-action-icon {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  margin-bottom: 10px;
}

body:not(.cookieshift-landing) .dash-quick-action-icon svg {
  width: 22px;
  height: 22px;
}

/* Rescan Domain */
body:not(.cookieshift-landing) .dash-quick-action-icon--info {
  color: #2563eb;
  background: #dbeafe;
}

/* Export PDF (no modifier class — 2nd card) */
body:not(.cookieshift-landing) .dash-quick-actions-grid .dash-quick-action-card:nth-child(2) .dash-quick-action-icon {
  color: #7c3aed;
  background: #ede9fe;
}

/* Integration */
body:not(.cookieshift-landing) .dash-quick-action-icon--success {
  color: #059669;
  background: #d1fae5;
}

/* Alerts */
body:not(.cookieshift-landing) .dash-quick-action-icon--warning {
  color: #d97706;
  background: #fef3c7;
}

/* Cookie compliance — Compare scans & Scan history */
.prem-scanner-root .prem-history-card {
  margin-top: 24px;
  padding: 22px 24px 20px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

.prem-scanner-root .cc-section-head {
  margin-bottom: 14px;
}

.prem-scanner-root .prem-history-card__title {
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #0f172a;
}

.prem-scanner-root .scan-compare-intro {
  margin: 0 0 16px;
  font-size: 15px;
  line-height: 1.55;
  color: #475569;
}

.prem-scanner-root .scan-compare-pickers {
  align-items: end;
  gap: 14px;
  margin-bottom: 16px;
  padding: 14px 16px;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.prem-scanner-root .scan-auto-field {
  gap: 6px;
  margin-bottom: 0;
  min-width: 0;
}

.prem-scanner-root .scan-auto-field > span {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #3668e9;
}

.prem-scanner-root .scan-compare-pickers .cr-filter {
  width: 100%;
  min-width: 0 !important;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .scan-compare-pickers .btn--cc-refresh {
  align-self: end;
  min-height: 44px;
  padding: 10px 18px !important;
  font-size: 14px !important;
  white-space: nowrap;
}

.prem-scanner-root .scan-compare-results {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 16px;
}

/* Delta summary chips — highlighted panel */
.prem-scanner-root .scan-auto-diff__chips {
  gap: 10px;
  margin-top: 0;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.75),
    0 1px 2px rgba(37, 99, 235, 0.08);
}

.prem-scanner-root .scan-auto-chip {
  padding: 7px 14px;
  font-size: 14px;
  font-weight: 700;
  border-radius: 999px;
  border: 1px solid transparent;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
}

.prem-scanner-root .scan-auto-chip--new {
  color: #1d4ed8;
  background: #fff;
  border-color: #93c5fd;
}

.prem-scanner-root .scan-auto-chip:not(.scan-auto-chip--new):not(.scan-auto-chip--warn) {
  color: #475569;
  background: #fff;
  border-color: #cbd5e1;
}

.prem-scanner-root .scan-auto-chip--warn {
  color: #c2410c;
  background: #fff7ed;
  border-color: #fdba74;
}

/* Collapsible change lists — highlighted boxes */
.prem-scanner-root .scan-compare-details {
  margin-top: 0;
  padding: 0;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1px solid #cbd5e1;
  border-left: 4px solid #6366f1;
  border-radius: 12px;
  font-size: 14px;
  overflow: hidden;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.8),
    0 1px 2px rgba(15, 23, 42, 0.04);
}

.prem-scanner-root .scan-compare-details[open] {
  background: linear-gradient(180deg, #eef2ff 0%, #e0e7ff 100%);
  border-color: #a5b4fc;
  border-left-color: #4f46e5;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.85),
    0 2px 6px rgba(79, 70, 229, 0.1);
}

.prem-scanner-root .scan-compare-details > summary {
  list-style: none;
  cursor: pointer;
  padding: 14px 16px;
  font-size: 15px;
  font-weight: 700;
  color: #312e81;
  display: flex;
  align-items: center;
  gap: 10px;
  user-select: none;
  transition: background 0.15s ease;
}

.prem-scanner-root .scan-compare-details > summary::-webkit-details-marker {
  display: none;
}

.prem-scanner-root .scan-compare-details > summary::marker {
  content: "";
}

.prem-scanner-root .scan-compare-details > summary::before {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid #4f46e5;
  border-bottom: 2px solid #4f46e5;
  transform: rotate(-45deg);
  transition: transform 0.2s ease;
  flex-shrink: 0;
  margin-top: -2px;
}

.prem-scanner-root .scan-compare-details[open] > summary::before {
  transform: rotate(45deg);
  margin-top: 2px;
}

.prem-scanner-root .scan-compare-details > summary:hover {
  background: rgba(99, 102, 241, 0.08);
}

.prem-scanner-root .scan-compare-list {
  max-height: 220px;
  margin: 0;
  padding: 12px 16px 14px;
  font-size: 14px;
  line-height: 1.8;
  background: #fff;
  border-top: 1px solid #c7d2fe;
  border-radius: 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* Scan history — filter toolbar */
.prem-scanner-root .history-toolbar {
  gap: 12px;
  margin: 0 0 16px;
  padding: 14px 16px;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.prem-scanner-root .history-toolbar__group {
  gap: 10px;
}

.prem-scanner-root .history-toolbar .cr-filter {
  min-width: 150px;
  flex: 1 1 150px;
  background-color: #fff;
}

.prem-scanner-root .history-toolbar__group:first-child .cr-filter:nth-child(1) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .history-toolbar__group:first-child input.cr-filter {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230891b2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E");
}

.prem-scanner-root .history-toolbar__group:last-child .cr-filter:nth-child(1) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ea580c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .history-toolbar__group:last-child .cr-filter:nth-child(2) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

/* Scan history — table */
.prem-scanner-root .cc-history-table-shell {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}

.prem-scanner-root .cc-hist-table {
  font-size: 15px;
}

.prem-scanner-root .cc-hist-table th {
  padding: 12px 14px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.05em;
  color: #3668e9;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.prem-scanner-root .cc-hist-table td {
  padding: 14px;
  color: #334155;
  border-bottom: 1px solid #eaeaea;
  vertical-align: middle;
}

.prem-scanner-root .cc-hist-table tbody tr:nth-child(2n) td {
  background: #fafbfc;
}

.prem-scanner-root .cc-hist-table tbody tr:hover td {
  background: #f1f5f9;
}

.prem-scanner-root .prem-risk-badge,
.prem-scanner-root .cc-risk-pill {
  padding: 5px 12px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  border-radius: 999px;
}

.prem-scanner-root .prem-risk-badge {
  color: #b91c1c;
  background: #fee2e2;
  border: 1px solid #fecaca;
}

.prem-scanner-root .cc-hist-actions a.bv,
.prem-scanner-root .cc-hist-actions button.bv,
.prem-scanner-root .prem-hist-actions a.bv,
.prem-scanner-root .prem-hist-actions button.bv {
  min-height: 34px;
  padding: 7px 14px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: normal;
  text-transform: none;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.prem-scanner-root .cc-hist-actions a.bv,
.prem-scanner-root .prem-hist-actions a.bv {
  color: #3730a3;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  text-decoration: none;
}

.prem-scanner-root .cc-hist-actions a.bv:hover,
.prem-scanner-root .prem-hist-actions a.bv:hover {
  color: #312e81;
  background: #e0e7ff;
  border-color: #a5b4fc;
}

.prem-scanner-root .cc-hist-actions button.bv,
.prem-scanner-root .prem-hist-actions button.bv {
  color: #047857;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
}

.prem-scanner-root .cc-hist-actions button.bv:hover:not(:disabled),
.prem-scanner-root .prem-hist-actions button.bv:hover:not(:disabled) {
  color: #065f46;
  background: #d1fae5;
  border-color: #6ee7b7;
}

.prem-scanner-root .cc-hist-actions button.bv:disabled,
.prem-scanner-root .prem-hist-actions button.bv:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

@media (max-width: 900px) {
  .prem-scanner-root .scan-compare-pickers {
    grid-template-columns: 1fr;
  }

  .prem-scanner-root .scan-compare-pickers .btn--cc-refresh {
    width: 100%;
    justify-content: center;
  }
}

/* Change Detection — Automated Monitoring spacing & typography */
.prem-scanner-root .scan-auto-monitor {
  padding: 24px;
  margin-bottom: 0;
}

.prem-scanner-root .scan-auto-monitor__header {
  gap: 16px;
  margin-bottom: 20px;
}

.prem-scanner-root .scan-auto-monitor__title {
  margin: 0 0 6px;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
}

.prem-scanner-root .scan-auto-monitor__desc {
  max-width: 56ch;
  font-size: 15px;
  line-height: 1.55;
  color: #475569;
}

.prem-scanner-root .scan-auto-monitor__body {
  gap: 20px;
}

.prem-scanner-root .scan-auto-monitor__section {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.prem-scanner-root .scan-auto-monitor__section-title {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #3668e9;
}

.prem-scanner-root .scan-auto-monitor__status-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

.prem-scanner-root .scan-auto-monitor__stat {
  flex-direction: column;
  align-items: stretch;
  gap: 14px;
  min-height: 120px;
  padding: 20px 24px;
  border-radius: 16px;
  border: 1px solid #eaeaea;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.prem-scanner-root .scan-auto-monitor__stat-icon {
  width: 40px;
  height: 40px;
  margin-top: 0;
  border-radius: 10px;
}

.prem-scanner-root .scan-auto-monitor__stat-body {
  flex: 1;
  min-width: 0;
  gap: 8px;
  flex-direction: column;
}

.prem-scanner-root .scan-auto-monitor__stat-label {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #3668e9;
  text-align: left;
}

.prem-scanner-root .scan-auto-monitor__stat-value {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  color: #111827;
  text-align: left;
  word-break: break-word;
}

.prem-scanner-root .scan-auto-monitor__stat-value .scan-auto-monitor__pill {
  display: inline-flex;
  margin-top: 2px;
}

.prem-scanner-root .scan-auto-monitor__columns {
  gap: 16px;
  align-items: stretch;
}

.prem-scanner-root .scan-auto-monitor__card {
  padding: 0;
  height: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

.prem-scanner-root .scan-auto-monitor__card-head,
.prem-scanner-root .scan-auto-monitor__card-head--split {
  gap: 12px;
  margin-bottom: 0;
  align-items: center;
  flex-shrink: 0;
}

.prem-scanner-root .scan-auto-monitor__card-title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
  color: #0f172a;
}

.prem-scanner-root .scan-auto-monitor__card-sub {
  margin: 4px 0 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--ds-color-muted);
}

.prem-scanner-root .scan-auto-monitor__form-grid,
.prem-scanner-root .scan-auto-monitor__schedule-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0;
  padding: 20px;
  flex: 1;
  background: transparent;
  border: 0;
}

.prem-scanner-root .scan-auto-monitor__field {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  align-items: center;
  gap: 8px 16px;
  margin: 0;
  min-height: 44px;
}

.prem-scanner-root .scan-auto-monitor__field-label {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.3;
  letter-spacing: normal;
  text-transform: none;
  color: #475569;
  align-self: center;
}

/* Scan Schedule + additional schedule inputs — match cr-filter reference */
.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] .scan-auto-monitor__input,
.prem-scanner-root .scan-auto-monitor__schedule-form .scan-auto-monitor__input,
.prem-scanner-root .scan-auto-monitor__custom-fields .scan-auto-monitor__input {
  width: 100%;
  min-height: 44px;
  padding: 11px 14px;
  font-size: 15px;
  font-weight: 500;
  color: #0f172a;
  background-color: #fff;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] .scan-auto-monitor__input:hover,
.prem-scanner-root .scan-auto-monitor__schedule-form .scan-auto-monitor__input:hover,
.prem-scanner-root .scan-auto-monitor__custom-fields .scan-auto-monitor__input:hover {
  border-color: #94a3b8;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.06);
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] .scan-auto-monitor__input:focus,
.prem-scanner-root .scan-auto-monitor__schedule-form .scan-auto-monitor__input:focus,
.prem-scanner-root .scan-auto-monitor__custom-fields .scan-auto-monitor__input:focus {
  outline: none;
  border-color: #2563eb;
  background-color: #fff;
  box-shadow:
    0 0 0 3px rgba(37, 99, 235, 0.18),
    0 1px 2px rgba(15, 23, 42, 0.05);
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] select.scan-auto-monitor__input,
.prem-scanner-root .scan-auto-monitor__schedule-form select.scan-auto-monitor__input,
.prem-scanner-root .scan-auto-monitor__custom-fields select.scan-auto-monitor__input {
  cursor: pointer;
  appearance: none;
  padding-right: 36px;
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] select.cc-timezone-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ea580c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E");
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] input[type="time"].scan-auto-monitor__input,
.prem-scanner-root .scan-auto-monitor__schedule-form input[type="time"].scan-auto-monitor__input,
.prem-scanner-root .cc-time-input[type="time"] {
  padding-right: 36px;
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230891b2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E");
  position: relative;
}

.prem-scanner-root .cc-time-field {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
  width: 100%;
}

.prem-scanner-root .cc-time-field .scan-auto-monitor__input,
.prem-scanner-root .cc-time-field .cc-time-input[type="time"] {
  flex: 1 1 0;
  min-width: 0;
  width: auto;
  max-width: 100%;
}

.prem-scanner-root .cc-time-now-btn {
  flex: 0 0 auto;
  align-self: center;
  min-height: 44px;
  height: 44px;
  padding: 0 12px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  color: #15803d;
  background: #f0fdf4;
  border: 1.5px solid #86efac;
  border-radius: 10px;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.prem-scanner-root .cc-time-now-btn:hover {
  color: #166534;
  background: #dcfce7;
  border-color: #4ade80;
}

.prem-scanner-root .cc-time-now-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.22);
}

.prem-scanner-root input[type="time"].scan-auto-monitor__input::-webkit-datetime-edit,
.prem-scanner-root .cc-time-input[type="time"]::-webkit-datetime-edit {
  padding: 0;
  font-size: 15px;
  font-weight: 500;
}

.prem-scanner-root input[type="time"].scan-auto-monitor__input::-webkit-datetime-edit-hour-field,
.prem-scanner-root input[type="time"].scan-auto-monitor__input::-webkit-datetime-edit-minute-field,
.prem-scanner-root input[type="time"].scan-auto-monitor__input::-webkit-datetime-edit-ampm-field,
.prem-scanner-root .cc-time-input[type="time"]::-webkit-datetime-edit-hour-field,
.prem-scanner-root .cc-time-input[type="time"]::-webkit-datetime-edit-minute-field,
.prem-scanner-root .cc-time-input[type="time"]::-webkit-datetime-edit-ampm-field {
  padding: 2px 4px;
  border-radius: 4px;
}

.prem-scanner-root input[type="time"].scan-auto-monitor__input::-webkit-datetime-edit-ampm-field,
.prem-scanner-root .cc-time-input[type="time"]::-webkit-datetime-edit-ampm-field {
  margin-left: 6px;
  color: #0f172a;
  font-weight: 600;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] input[type="time"].scan-auto-monitor__input::-webkit-calendar-picker-indicator,
.prem-scanner-root .scan-auto-monitor__schedule-form input[type="time"].scan-auto-monitor__input::-webkit-calendar-picker-indicator,
.prem-scanner-root .cc-time-input[type="time"]::-webkit-calendar-picker-indicator {
  opacity: 0;
  position: absolute;
  right: 10px;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

.prem-scanner-root .scan-auto-monitor__schedule-form input[type="text"].scan-auto-monitor__input {
  padding-right: 14px;
  background-image: none;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] input[type="number"].scan-auto-monitor__input,
.prem-scanner-root .scan-auto-monitor__schedule-form input[type="number"].scan-auto-monitor__input,
.prem-scanner-root .scan-auto-monitor__custom-fields input[type="number"].scan-auto-monitor__input {
  padding-right: 14px;
  background-image: none;
}

.prem-scanner-root .scan-auto-monitor__schedule-form {
  gap: 16px;
  padding: 20px;
}

.prem-scanner-root .scan-auto-monitor__schedule-form .scan-auto-monitor__field {
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 8px 16px;
  align-items: center;
  min-height: 44px;
}

.prem-scanner-root .scan-auto-monitor__toggle-grid,
.prem-scanner-root .scan-auto-monitor__toggle-grid--alerts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  padding: 20px;
  flex: 1;
  background: transparent;
  border: 0;
}

.prem-scanner-root .scan-auto-monitor__toggle-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 72px;
  height: 100%;
  padding: 14px 16px;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #eaeaea;
  border-radius: 12px;
}

.prem-scanner-root .scan-auto-monitor__toggle-row:hover {
  background: #fafbff;
  border-color: #dbeafe;
}

.prem-scanner-root .scan-auto-monitor__toggle-copy {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 4px;
  padding-top: 0;
  min-width: 0;
}

.prem-scanner-root .scan-auto-monitor__toggle-title {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  color: #111827;
}

.prem-scanner-root .scan-auto-monitor__toggle-desc {
  font-size: 14px;
  line-height: 1.45;
  color: var(--ds-color-muted);
  margin: 0;
}

.prem-scanner-root .scan-auto-monitor__switch {
  flex-shrink: 0;
  margin-top: 0;
  align-self: center;
}

.prem-scanner-root .scan-auto-monitor__card--alerts .scan-auto-monitor__card-head {
  margin: 0;
  margin-bottom: 0;
}

.prem-scanner-root .scan-auto-monitor__alerts-group {
  margin: 0;
  padding: 16px 20px 20px;
  background: #faf6f0;
}

.prem-scanner-root .scan-auto-monitor__alerts-heading {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin: 0 0 16px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #78716c;
}

.prem-scanner-root .scan-auto-monitor__card--alerts .scan-auto-monitor__toggle-grid--alerts {
  padding: 0;
  gap: 12px;
  background: transparent;
  border: 0;
}

.prem-scanner-root .scan-auto-monitor__card--alerts .scan-auto-monitor__toggle-row {
  min-height: 72px;
  align-items: center;
}

.prem-scanner-root .scan-auto-monitor__schedule-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.prem-scanner-root .scan-auto-monitor__empty {
  margin: 0;
  padding: 24px 20px;
  text-align: center;
  font-size: 14px;
  line-height: 1.5;
  color: #94a3b8;
  background: #fafafa;
  border: 1px dashed #e2e8f0;
  border-radius: 12px;
}

.prem-scanner-root .scan-auto-monitor__schedule-card {
  background: rgba(99, 102, 241, 0.06);
  border: 1px solid #e0e7ff;
  border-radius: 12px;
  padding: 16px 18px;
}

.prem-scanner-root .scan-auto-monitor__schedule-name {
  font-size: 16px;
  font-weight: 600;
  color: #111827;
}

.prem-scanner-root .scan-auto-monitor__schedule-meta {
  font-size: 14px;
  color: #3668e9;
}

.prem-scanner-root .scan-auto-monitor__schedule-form {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-top: none;
  border-radius: 0 0 12px 12px;
  margin-top: -1px;
  padding: 16px 18px;
}

.prem-scanner-root .scan-auto-monitor__diff {
  margin-top: 0;
  padding: 20px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.prem-scanner-root .scan-auto-monitor__diff .scan-auto-monitor__section-title {
  margin: 0 0 14px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #3668e9;
}

.prem-scanner-root .scan-auto-monitor__diff .scan-auto-diff__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
}

.prem-scanner-root .scan-auto-monitor__diff .scan-auto-chip {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  font-size: 13px;
  font-weight: 600;
  color: #1d4ed8;
  background: #dbeafe;
  border-radius: 999px;
}

.prem-scanner-root .scan-auto-monitor__diff .scan-auto-chip--new {
  color: #1d4ed8;
  background: #dbeafe;
}

.prem-scanner-root .scan-auto-monitor__diff .scan-auto-chip--warn {
  color: #9a3412;
  background: #ffedd5;
}

.prem-scanner-root .scan-auto-monitor__footer {
  margin-top: 16px;
  padding-top: 0;
  display: flex;
  justify-content: flex-end;
}

.prem-scanner-root .scan-auto-monitor__save.btn-p,
.prem-scanner-root .scan-auto-monitor__save {
  min-width: 220px;
  min-height: 44px;
  padding: 0 24px;
  font-size: 15px;
  font-weight: 600;
  color: #fff;
  background: linear-gradient(90deg, #1d4ed8 0%, #2563eb 45%, #3b82f6 100%);
  border: none;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.28);
  transition: opacity 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.prem-scanner-root .scan-auto-monitor__save.btn-p:hover:not(:disabled),
.prem-scanner-root .scan-auto-monitor__save:hover:not(:disabled) {
  opacity: 0.92;
  box-shadow: 0 4px 14px rgba(37, 99, 235, 0.34);
  transform: translateY(-1px);
}

/* Change Detection — highlighted section cards & headers */
.prem-scanner-root .scan-auto-monitor__header-actions > .scan-auto-monitor__pill {
  padding: 6px 14px;
  font-size: 13px;
  font-weight: 700;
  color: #b45309;
  background: linear-gradient(180deg, #fffbeb 0%, #fef3c7 100%);
  border: 1px solid #fcd34d;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.prem-scanner-root .scan-auto-monitor__header-actions > .scan-auto-monitor__pill--active,
.prem-scanner-root .scan-auto-monitor__header-actions > .scan-auto-monitor__pill--success {
  color: #15803d;
  background: linear-gradient(180deg, #f0fdf4 0%, #dcfce7 100%);
  border-color: #86efac;
}

.prem-scanner-root .scan-auto-monitor__header-actions > .scan-auto-monitor__pill--running {
  color: #1d4ed8;
  background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
  border-color: #93c5fd;
}

.prem-scanner-root .scan-auto-monitor__header-actions > .scan-auto-monitor__pill--warn {
  color: #c2410c;
  background: linear-gradient(180deg, #fff7ed 0%, #ffedd5 100%);
  border-color: #fdba74;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"],
.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-triggers"],
.prem-scanner-root .scan-auto-monitor__card--alerts,
.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] {
  overflow: hidden;
}

/* Scan Schedule — teal */
.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] {
  background: linear-gradient(180deg, #eef2ff 0%, #e0e7ff 100%);
  border-color: #a5b4fc;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85), 0 1px 3px rgba(79, 70, 229, 0.08);
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] > .scan-auto-monitor__card-head {
  margin: 0;
  padding: 14px 16px;
  border-bottom: 1px solid #a5b4fc;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] .scan-auto-monitor__form-grid {
  background: transparent;
  border-top: 0;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] .scan-auto-monitor__card-icon {
  color: #3730a3;
  background: #fff;
  border: 1px solid #a5b4fc;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] .scan-auto-monitor__card-title {
  color: #3730a3;
}

/* Smart Triggers — amber */
.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-triggers"] {
  background: #fff;
  border-color: #eaeaea;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.85),
    0 1px 3px rgba(217, 119, 6, 0.08);
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-triggers"] > .scan-auto-monitor__card-head {
  margin: 0;
  padding: 14px 16px;
  border-bottom: 1px solid #e2e8f0;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-triggers"] .scan-auto-monitor__toggle-grid {
  background: transparent;
  border-top: 0;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-triggers"] .scan-auto-monitor__card-icon {
  color: #b45309;
  background: #fff;
  border: 1px solid #fbbf24;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-triggers"] .scan-auto-monitor__card-title {
  color: #92400e;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-triggers"] .scan-auto-monitor__toggle-grid {
  padding: 20px;
  gap: 12px;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-triggers"] .scan-auto-monitor__toggle-row {
  min-height: 72px;
  border-color: #eaeaea;
}

/* Alerts — peach/orange */
.prem-scanner-root .scan-auto-monitor__card--alerts {
  background: #fff;
  border: 1px solid rgb(255 114 0 / 27%);
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.prem-scanner-root .scan-auto-monitor__card--alerts > .scan-auto-monitor__card-head {
  margin: 0;
  padding: 16px 20px;
  background: linear-gradient(180deg, #fff7ed 0%, #ffedd5 100%);
  border-bottom: 1px solid #fdba74;
}

.prem-scanner-root .scan-auto-monitor__card--alerts .scan-auto-monitor__card-sub {
  color: #c2410c;
  margin: 6px 0 0;
  font-size: 15px;
  line-height: 1.5;
  max-width: 72ch;
}

.prem-scanner-root .scan-auto-monitor__card--alerts .scan-auto-monitor__card-icon {
  color: #c2410c;
  background: #fff;
  border: 1px solid #fdba74;
}

.prem-scanner-root .scan-auto-monitor__card--alerts .scan-auto-monitor__card-title {
  color: #9a3412;
}

.prem-scanner-root .scan-auto-monitor .scan-auto-monitor__card-icon svg {
  width: 20px;
  height: 20px;
}

/* Additional Schedules — white card */
.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] {
  background: #fff;
  border: 1px solid #eaeaea;
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] > .scan-auto-monitor__card-head--split {
  margin: 0;
  padding: 16px 20px;
  border-bottom: 1px solid #e2e8f0;
  align-items: center;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] .scan-auto-monitor__schedule-list,
.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] .scan-auto-monitor__empty {
  margin: 0;
  padding: 20px;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] .scan-auto-monitor__card-head--split > .scan-auto-monitor__card-head {
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] .scan-auto-monitor__card-icon {
  color: #4f46e5;
  background: #fff;
  border: 1px solid #c7d2fe;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] .scan-auto-monitor__card-title {
  color: #0f172a;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] .scan-auto-monitor__card-sub {
  font-size: 15px;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] .scan-auto-monitor__btn--primary {
  min-height: 40px;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  background: #059669;
  border: none;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12);
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] .scan-auto-monitor__btn--primary:hover {
  background: #047857;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] .scan-auto-monitor__btn--ghost {
  color: #374151;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
}

.prem-scanner-root .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-extra"] .scan-auto-monitor__btn--danger {
  color: #dc2626;
  background: #fff;
  border: 1px solid #fecaca;
  border-radius: 10px;
}


@media (max-width: 1100px) {
  .prem-scanner-root .scan-auto-monitor__status-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 900px) {
  .prem-scanner-root .scan-auto-monitor__status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .prem-scanner-root .scan-auto-monitor__columns,
  .prem-scanner-root .scan-auto-monitor__toggle-grid,
  .prem-scanner-root .scan-auto-monitor__toggle-grid--alerts {
    grid-template-columns: 1fr;
  }

  .prem-scanner-root .scan-auto-monitor__field,
  .prem-scanner-root .scan-auto-monitor__schedule-form .scan-auto-monitor__field {
    grid-template-columns: 1fr;
    gap: 6px;
    align-items: stretch;
  }

  .prem-scanner-root .scan-auto-monitor__toggle-row {
    min-height: 0;
  }
}

@media (max-width: 560px) {
  .prem-scanner-root .scan-auto-monitor__status-grid {
    grid-template-columns: 1fr;
  }
}

/* ═══════════════════════════════════════════════════════════
   LOGS & REPORTS — Consent Logs, Compliance Reports,
   Scheduled Reports, View Report (Full Compliance)
   Scanner-aligned spacing, forms, tables, title icons
   ═══════════════════════════════════════════════════════════ */

/* --- Shared form controls (scanner cr-filter reference) --- */
.consent-logs-page .cs-input,
.consent-logs-page .cs-select,
.compliance-report-standalone .cr-filter,
.compliance-report-standalone .cr-ctrl-input,
.compliance-report-standalone .history-toolbar .cr-filter,
.cfr-page .cfr-search,
.cfr-page .cfr-select,
.cfr-page .cr-filter,
.product-hub-page:has(.compliance-auto-runs) .cr-filter,
.product-hub-page:has(.compliance-auto-runs) .scan-auto-grid input,
.product-hub-page:has(.compliance-auto-runs) .scan-auto-grid select {
  box-sizing: border-box;
  min-height: 44px;
  padding: 11px 14px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 500;
  color: #0f172a;
  background-color: #fff;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.consent-logs-page .cs-select,
.compliance-report-standalone .cr-filter,
.compliance-report-standalone .history-toolbar select.cr-filter,
.cfr-page .cfr-select,
.cfr-page select.cr-filter,
.product-hub-page:has(.compliance-auto-runs) .cr-filter,
.product-hub-page:has(.compliance-auto-runs) .scan-auto-grid select {
  cursor: pointer;
  appearance: none;
  padding-right: 36px;
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.consent-logs-page input[type="date"].cs-input {
  padding-right: 14px;
  font-variant-numeric: tabular-nums;
}

.consent-logs-page .cs-input:hover,
.consent-logs-page .cs-select:hover,
.compliance-report-standalone .cr-filter:hover,
.compliance-report-standalone .cr-ctrl-input:hover,
.cfr-page .cfr-search:hover,
.cfr-page .cfr-select:hover,
.cfr-page .cr-filter:hover,
.product-hub-page:has(.compliance-auto-runs) .cr-filter:hover,
.product-hub-page:has(.compliance-auto-runs) .scan-auto-grid input:hover,
.product-hub-page:has(.compliance-auto-runs) .scan-auto-grid select:hover {
  border-color: #94a3b8;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.06);
}

.consent-logs-page .cs-input:focus,
.consent-logs-page .cs-select:focus,
.compliance-report-standalone .cr-filter:focus,
.compliance-report-standalone .cr-ctrl-input:focus,
.cfr-page .cfr-search:focus,
.cfr-page .cfr-select:focus,
.cfr-page .cr-filter:focus,
.product-hub-page:has(.compliance-auto-runs) .cr-filter:focus,
.product-hub-page:has(.compliance-auto-runs) .scan-auto-grid input:focus,
.product-hub-page:has(.compliance-auto-runs) .scan-auto-grid select:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow:
    0 0 0 3px rgba(37, 99, 235, 0.18),
    0 1px 2px rgba(15, 23, 42, 0.05);
}

.cfr-page .cfr-search {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left 12px center;
  background-size: 16px;
  padding-left: 38px;
}

/* --- Shared field labels --- */
.consent-logs-page .field-label,
.compliance-report-standalone .cr-ctrl-lbl,
.product-hub-page:has(.compliance-auto-runs) .scan-auto-field > span {
  display: block;
  margin-bottom: 6px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ds-color-muted);
}

.consent-logs-page .field,
.product-hub-page:has(.compliance-auto-runs) .scan-auto-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  margin: 0;
}

/* --- Shared buttons --- */
.consent-logs-page .btn-outlined,
.compliance-report-standalone .cr-btn-outline,
.compliance-report-standalone .cr-mini-btn,
.compliance-report-standalone a.cr-mini-btn,
.cfr-page .btn.secondary,
.cfr-page .cfr-preset-clear,
.cfr-page .cfr-filter-toggle,
.product-hub-page:has(.compliance-auto-runs) .btn-p {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 16px;
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  color: #334155;
  background: #fff;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.consent-logs-page .btn-outlined:hover:not(:disabled),
.compliance-report-standalone .cr-btn-outline:hover:not(:disabled),
.compliance-report-standalone .cr-mini-btn:hover,
.compliance-report-standalone a.cr-mini-btn:hover,
.cfr-page .btn.secondary:hover:not(:disabled),
.cfr-page .cfr-preset-clear:hover,
.cfr-page .cfr-filter-toggle:hover,
.product-hub-page:has(.compliance-auto-runs) .btn-p:hover:not(:disabled) {
  color: #0f172a;
  background: #f8fafc;
  border-color: #94a3b8;
}

.compliance-report-standalone .cr-btn-run,
.compliance-report-standalone a.cr-btn-run {
  min-height: 44px;
  padding: 0 18px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 10px;
}

.compliance-report-standalone .cr-mini-btn,
.compliance-report-standalone a.cr-mini-btn {
  min-height: 36px;
  padding: 0 12px;
  font-size: 13px;
  border-radius: 8px;
}

/* --- Shared data tables --- */
.consent-logs-page .consent-logs-table.cs-table,
.compliance-report-standalone .cr-table,
.cfr-page .cfr-table {
  font-size: 14px;
  border-collapse: collapse;
}

.consent-logs-page .consent-logs-table.cs-table thead th,
.compliance-report-standalone .cr-table thead th,
.cfr-page .cfr-table thead th {
  padding: 12px 16px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ds-color-muted);
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.consent-logs-page .consent-logs-table.cs-table tbody td,
.compliance-report-standalone .cr-table tbody td,
.cfr-page .cfr-table tbody td {
  padding: 12px 16px;
  vertical-align: middle;
  line-height: 1.45;
  color: #334155;
  border-bottom: 1px solid #eaeaea;
}

.consent-logs-page .consent-logs-table.cs-table tbody tr:hover td,
.compliance-report-standalone .cr-table tbody tr:hover td,
.cfr-page .cfr-table tbody tr.cfr-data-row:hover td {
  background: #f8fafc;
}

.compliance-report-standalone .cr-table tbody td {
  height: auto;
  min-height: 52px;
}

/* --- Shared section cards --- */
.consent-logs-page .consent-filters-card,
.consent-logs-page .consent-logs-table-card,
.consent-logs-page .consent-logs-site-row,
.compliance-report-standalone .cr-history-card,
.compliance-report-standalone .cr-chart-card,
.compliance-report-standalone .cr-stat-card,
.compliance-report-standalone .cr-accordion,
.cfr-page .cfr-table-shell,
.cfr-page .cfr-toolbar,
.cfr-page .cfr-card,
.product-hub-page:has(.compliance-auto-runs) .prem-history-card.scan-automation-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

/* ═══ CONSENT LOGS ═══ */
.consent-logs-page {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.consent-logs-page .page-header.consent-logs-header {
  margin-bottom: 0;
  gap: 16px;
}

.consent-logs-page .page-breadcrumb {
  margin-bottom: 10px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--ds-color-shell-accent);
}

.consent-logs-page .page-title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font-size: clamp(24px, 2.2vw, 32px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0f172a;
}

.consent-logs-page .page-title::before {
  content: "";
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: #f8fafc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3Cline x1='16' x2='8' y1='13' y2='13'/%3E%3Cline x1='16' x2='8' y1='17' y2='17'/%3E%3Cpolyline points='10 9 9 9 8 9'/%3E%3C/svg%3E") center / 20px no-repeat;
  border: 1px solid #e2e8f0;
}

/* Website context row */
.consent-logs-page .consent-logs-site-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  margin-bottom: 0;
  padding: 14px 18px;
}

.consent-logs-page .consent-logs-site-label {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #3668e9;
}

.consent-logs-page .consent-logs-site-url {
  font-size: 15px;
  font-weight: 600;
  color: #0f172a;
  word-break: break-all;
}

.consent-logs-page .consent-logs-site-hint {
  flex: 1 1 200px;
  margin-left: 0;
  font-size: 15px;
  line-height: 1.45;
  color: var(--ds-color-muted);
}

.consent-logs-page .consent-logs-site-row > .btn-outlined {
  margin-left: auto;
  flex-shrink: 0;    
  padding: 0 20px;
  font-size: 14px;
}

/* Consent analytics card */
.consent-logs-page .analytics-upsell {
  margin-bottom: 0;
  padding: 0;
  overflow: hidden;
  background: #fff;
  border-color: #e2e8f0;
}

.consent-logs-page .analytics-upsell-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px 20px;
  padding: 18px 20px 0;
}

.consent-logs-page .analytics-upsell-left {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  min-width: 0;
}

.consent-logs-page .analytics-upsell-icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  color: #2563eb;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
}

.consent-logs-page .analytics-upsell-text-title {
  margin: 0 0 6px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
}

.consent-logs-page .analytics-upsell-text-desc {
  margin: 0;
  font-size: 16px;
  line-height: 1.55;
}

.consent-logs-page .analytics-upsell-text-desc strong {
  color: #334155;
  font-weight: 600;
}

.consent-logs-page .analytics-upsell-body {
  margin-top: 0;
  padding: 16px 20px 20px;
  border-top: 1px solid #e2e8f0;
}

.consent-logs-page .analytics-upsell-top + .analytics-upsell-body {
  margin-top: 16px;
}

/* Analytics toolbar — Range, Bucket, actions */
.consent-logs-page .analytics-upsell-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px 14px;
  margin-bottom: 0;
  padding: 14px 16px;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.consent-logs-page .analytics-upsell-filters .field {
  flex: 0 1 180px;
  min-width: 140px;
}

.consent-logs-page .analytics-upsell-filters > .btn-outlined {
  flex-shrink: 0;
  align-self: flex-end;
}

/* Analytics summary metrics — individual stat cards */
.consent-logs-page .analytics-upsell-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 25px;
  margin-top: 28px;
  margin-bottom: 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
}

.consent-logs-page .analytics-upsell-summary > div {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
  padding: 25px 22px;
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 2px rgba(15, 23, 42, 0.04);
}

.consent-logs-page .analytics-upsell-summary > div:nth-child(1) {
  border-top: 3px solid #3b82f6;
}

.consent-logs-page .analytics-upsell-summary > div:nth-child(2) {
  border-top: 3px solid #3668e9;
}

.consent-logs-page .analytics-upsell-summary > div:nth-child(3) {
  border-top: 3px solid #059669;
}

.consent-logs-page .analytics-upsell-summary > div:nth-child(4) {
  border-top: 3px solid #d97706;
}

.consent-logs-page .analytics-upsell-summary strong {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #3668e9;
  line-height: 1.35;
}

.consent-logs-page .analytics-upsell-summary strong::before {
  content: "";
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  margin-top: -1px;
  border-radius: 6px;
  background-color: #f1f5f9;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
  border: 1px solid #e2e8f0;
}

.consent-logs-page .analytics-upsell-summary > div:nth-child(1) strong::before {
  background-color: #eff6ff;
  border-color: #bfdbfe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20V10'/%3E%3Cpath d='M18 20V4'/%3E%3Cpath d='M6 20v-4'/%3E%3C/svg%3E");
}

.consent-logs-page .analytics-upsell-summary > div:nth-child(2) strong::before {
  background-color: #f8fafc;
  border-color: #e2e8f0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-4l-3 9L9 3l-3 9H2'/%3E%3C/svg%3E");
}

.consent-logs-page .analytics-upsell-summary > div:nth-child(3) strong::before {
  background-color: #ecfdf5;
  border-color: #a7f3d0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23059669' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpath d='m9 11 3 3L22 4'/%3E%3C/svg%3E");
}

.consent-logs-page .analytics-upsell-summary > div:nth-child(4) strong::before {
  background-color: #fffbeb;
  border-color: #fde68a;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
}

.consent-logs-page .analytics-upsell-summary .score-display {
  font-size: 1.7rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: #0f172a;
  font-variant-numeric: tabular-nums;
}

.consent-logs-page .analytics-upsell-summary > div:nth-child(3) .score-display {
  color: #047857;
}

.consent-logs-page .analytics-upsell-summary .score-display strong {
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: inherit;
  text-transform: none;
  color: inherit;
}

/* Analytics charts */
.consent-logs-page .analytics-chart {
  width: 100%;
  height: 280px;
  margin-top: 16px;
  margin-bottom: 0;
  padding: 14px 12px 10px;
  background: linear-gradient(180deg, #fafbfc 0%, #fff 55%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-sizing: border-box;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.04);
}

.consent-logs-page .analytics-chart + .analytics-chart {
  margin-top: 12px;
}

.consent-logs-page .analytics-chart .recharts-wrapper {
  margin: 0 auto;
}

.consent-logs-page .analytics-chart .recharts-cartesian-axis-tick-value {
  font-size: 12px !important;
  font-weight: 500;
  fill: #3668e9;
}

.consent-logs-page .analytics-chart .recharts-cartesian-grid-horizontal line,
.consent-logs-page .analytics-chart .recharts-cartesian-grid-vertical line {
  stroke: #e2e8f0;
  stroke-opacity: 0.85;
}

.consent-logs-page .analytics-chart .recharts-line-curve {
  filter: drop-shadow(0 1px 2px rgba(15, 23, 42, 0.08));
}

.consent-logs-page .analytics-chart .recharts-legend-wrapper {
  padding-top: 4px !important;
}

.consent-logs-page .analytics-chart .recharts-default-legend {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px 16px;
  margin: 0 !important;
  padding: 8px 4px 0 !important;
}

.consent-logs-page .analytics-chart .recharts-legend-item {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  margin: 0 !important;
  padding: 4px 10px !important;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
}

.consent-logs-page .analytics-chart .recharts-legend-item-text {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #475569 !important;
}

.consent-logs-page .analytics-chart .recharts-legend-item .recharts-surface {
  margin-right: 2px !important;
}

.consent-logs-page .analytics-chart .recharts-bar-rectangle {
  rx: 4;
}

.consent-logs-page .analytics-chart .recharts-tooltip-cursor {
  stroke: #cbd5e1 !important;
  stroke-width: 1;
}

.consent-logs-page .analytics-upsell-body .section-desc,
.consent-logs-page .analytics-upsell-body .cs-inline-loading {
  margin: 12px 0 0;
  font-size: 14px;
  color: #3668e9;
}

/* Log filters card */
.consent-logs-page .consent-filters-card {
  margin-bottom: 0;
  padding: 18px 20px 20px;
}

.consent-logs-page .consent-score-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-bottom: 16px;
  padding-bottom: 14px;
  padding-top: 0;
  border-bottom: 1px solid #e2e8f0;
}

.consent-logs-page .consent-score-label {
  font-size: 20px;
  font-weight: 600;
  color: #334155;
  text-transform: none;
  letter-spacing: -0.5px;
}

.consent-logs-page .consent-score-value {
  font-size: 20px;
  font-weight: 700;
}

.consent-logs-page .consent-score-hint {
  flex: 1 1 100%;
  margin: 0 0 4px;
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-color-muted);
  text-transform: none;
  letter-spacing: 0;
}

.consent-logs-page .consent-score-hint a {
  color: #2563eb;
  font-weight: 600;
}

.consent-logs-page .filter-row-1,
.consent-logs-page .filter-row-2,
.consent-logs-page .filter-row-2--dsar {
  display: grid;
  gap: 14px;
  align-items: end;
}

.consent-logs-page .filter-row-1 {
  grid-template-columns: repeat(6, minmax(130px, 1fr));
  margin-bottom: 0;
}

.consent-logs-page .filter-row-2 {
  grid-template-columns: minmax(180px, 220px) auto auto 1fr 1fr auto;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #eaeaea;
}

.consent-logs-page .filter-row-2--dsar {
  grid-template-columns: 1fr 1fr auto;
  margin-top: 16px;
  padding: 14px 16px;
  background: linear-gradient(180deg, #faf5ff 0%, #f5f3ff 100%);
  border: 1px solid #ddd6fe;
  border-radius: 12px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.85),
    0 1px 2px rgba(109, 40, 217, 0.06);
}

/* DSAR inputs — highlighted boxes */
.consent-logs-page .filter-row-2--dsar .cs-input {
  background-color: #fff;
  border: 2px solid #c4b5fd;
  box-shadow:
    0 0 0 1px rgba(109, 40, 217, 0.06),
    0 1px 3px rgba(109, 40, 217, 0.1);
}

.consent-logs-page .filter-row-2--dsar .field-label {
  color: #6d28d9;
  font-weight: 700;
}

.consent-logs-page .filter-row-2--dsar .cs-input::placeholder {
  color: #a78bfa;
  font-weight: 400;
}

.consent-logs-page .filter-row-2--dsar .cs-input:hover {
  border-color: #a78bfa;
  box-shadow:
    0 0 0 3px rgba(167, 139, 250, 0.18),
    0 1px 3px rgba(109, 40, 217, 0.12);
}

.consent-logs-page .filter-row-2--dsar .cs-input:focus {
  outline: none;
  border-color: #7c3aed;
  background-color: #fff;
  box-shadow:
    0 0 0 3px rgba(124, 58, 237, 0.22),
    0 1px 3px rgba(109, 40, 217, 0.14);
}

.consent-logs-page .filter-row-2--dsar .field:first-child .cs-input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='16' x='2' y='4' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left 12px center;
  background-size: 16px;
  padding-left: 38px;
}

.consent-logs-page .filter-row-2--dsar .field:last-of-type .cs-input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left 12px center;
  background-size: 16px;
  padding-left: 38px;
}

.consent-logs-page .consent-filters-card .field {
  min-width: 0;
}

.consent-logs-page .consent-logs-hint {
  margin-top: 10px;
  font-size: 13px;
  color: #3668e9;
}

/* Audit log table */
.consent-logs-page .consent-logs-table-card {
  margin-bottom: 0;
  overflow: hidden;
}

.consent-logs-page .consent-logs-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.consent-logs-page .consent-logs-table.cs-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
}

.consent-logs-page .consent-logs-table.cs-table tbody td {
  font-size: 13px;
  font-family: inherit;
  vertical-align: middle;
}

.consent-logs-page .consent-logs-table.cs-table tbody td:first-child {
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.consent-logs-page .consent-decode-panel {
  margin-top: 16px;
  padding: 16px 18px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}

.consent-logs-page .consent-decode-panel h3 {
  margin: 0 0 12px;
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
}

/* Button icons + relatable colors (icon on right) */
.consent-logs-page .btn-outlined {
  gap: 8px;
}

.consent-logs-page .consent-logs-site-row > .btn-outlined::after,
.consent-logs-page .analytics-upsell-filters > .btn-outlined::after,
.consent-logs-page .filter-row-2:not(.filter-row-2--dsar) > .btn-outlined::after,
.consent-logs-page .filter-row-2--dsar > .btn-outlined::after,
.consent-logs-page .consent-logs-table .btn-outlined::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* Refresh — teal */
.consent-logs-page .consent-logs-site-row > .btn-outlined,
.consent-logs-page .analytics-upsell-filters > .btn-outlined:first-of-type {
  color: #0e7490;
  background: #ecfeff;
  border-color: #67e8f9;
}

.consent-logs-page .consent-logs-site-row > .btn-outlined::after,
.consent-logs-page .analytics-upsell-filters > .btn-outlined:first-of-type::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230e7490' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8'/%3E%3Cpath d='M21 3v5h-5'/%3E%3C/svg%3E");
}

.consent-logs-page .consent-logs-site-row > .btn-outlined:hover:not(:disabled),
.consent-logs-page .analytics-upsell-filters > .btn-outlined:first-of-type:hover:not(:disabled) {
  color: #155e75;
  background: #cffafe;
  border-color: #22d3ee;
}

/* Export / download — blue */
.consent-logs-page .analytics-upsell-filters > .btn-outlined:last-of-type,
.consent-logs-page .filter-row-2:not(.filter-row-2--dsar) > .btn-outlined:last-of-type {
  color: #1d4ed8;
  background: #eff6ff;
  border-color: #93c5fd;
}

.consent-logs-page .analytics-upsell-filters > .btn-outlined:last-of-type::after,
.consent-logs-page .filter-row-2:not(.filter-row-2--dsar) > .btn-outlined:last-of-type::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%231d4ed8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V3'/%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
}

.consent-logs-page .analytics-upsell-filters > .btn-outlined:last-of-type:hover:not(:disabled),
.consent-logs-page .filter-row-2:not(.filter-row-2--dsar) > .btn-outlined:last-of-type:hover:not(:disabled) {
  color: #1e40af;
  background: #dbeafe;
  border-color: #60a5fa;
}

/* Save retention — green */
.consent-logs-page .filter-row-2:not(.filter-row-2--dsar) > .btn-outlined:first-of-type {
  color: #047857;
  background: #ecfdf5;
  border-color: #6ee7b7;
}

.consent-logs-page .filter-row-2:not(.filter-row-2--dsar) > .btn-outlined:first-of-type::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z'/%3E%3Cpolyline points='17 21 17 13 7 13 7 21'/%3E%3Cpolyline points='7 3 7 8 15 8'/%3E%3C/svg%3E");
}

.consent-logs-page .filter-row-2:not(.filter-row-2--dsar) > .btn-outlined:first-of-type:hover:not(:disabled) {
  color: #065f46;
  background: #d1fae5;
  border-color: #34d399;
}

/* Export DSAR history — violet */
.consent-logs-page .filter-row-2--dsar > .btn-outlined {
  color: #6d28d9;
  background: #f5f3ff;
  border-color: #c4b5fd;
}

.consent-logs-page .filter-row-2--dsar > .btn-outlined::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%236d28d9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3Cpath d='M12 18v-6'/%3E%3Cpath d='m9 15 3 3 3-3'/%3E%3C/svg%3E");
}

.consent-logs-page .filter-row-2--dsar > .btn-outlined:hover:not(:disabled) {
  color: #5b21b6;
  background: #ede9fe;
  border-color: #a78bfa;
}

/* Table receipt download — slate-blue */
.consent-logs-page .consent-logs-table .btn-outlined {
  min-height: 34px;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 600;
  color: #1e40af;
  background: #eff6ff;
  border-color: #bfdbfe;
  white-space: nowrap;
}

.consent-logs-page .consent-logs-table .btn-outlined::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%231e40af' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V3'/%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
}

.consent-logs-page .consent-logs-table .btn-outlined:hover:not(:disabled) {
  color: #1d4ed8;
  background: #dbeafe;
  border-color: #93c5fd;
}

.consent-logs-page .consent-logs-table td:last-child {
  text-align: right;
  white-space: nowrap;
}

.consent-logs-page .consent-logs-table thead th:last-child {
  text-align: right;
}

.consent-logs-page .inline-link {
  color: #2563eb;
  font-size: 14px;
  font-weight: 600;
}

/* ═══ COMPLIANCE REPORTS ═══ */
.compliance-report-standalone {
  background: #f8fafc;
}

.compliance-report-inner {
  padding: 28px 24px 40px;
}

.compliance-report-standalone .cr-page-head {
  margin-bottom: 4px;
  gap: 16px 24px;
}

.compliance-report-standalone .cr-breadcrumb {
  font-size: 13px;
  color: #3668e9;
}

.compliance-report-standalone .cr-page-title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 8px;
  font-size: clamp(24px, 2.2vw, 32px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
}

.compliance-report-standalone .cr-page-title::before {
  content: "";
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: #f8fafc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23059669' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E") center / 20px no-repeat;
  border: 1px solid #e2e8f0;
}

.compliance-report-standalone .cr-head-actions {
  gap: 10px;
}

.compliance-report-standalone .cr-stats-row {
  gap: 14px;
  margin-top: 24px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.compliance-report-standalone .cr-stat-card {
  padding: 18px 20px;
}

.compliance-report-standalone .cr-stat-value {
  font-size: 28px;
}

.compliance-report-standalone .cr-stat-label {
  font-size: 14px;
}

.compliance-report-standalone .cr-banners-row {
  gap: 12px;
  margin-top: 20px;
}

.compliance-report-standalone .cr-banner {
  padding: 14px 16px;
}

.compliance-report-standalone .cr-charts-row {
  gap: 16px;
  margin-top: 24px;
}

.compliance-report-standalone .cr-chart-card {
  padding: 20px 22px;
}

.compliance-report-standalone .cr-chart-card-title {
  font-size: 15px;
  font-weight: 700;
}

.compliance-report-standalone .cr-history-card {
  margin-top: 24px;
}

.compliance-report-standalone .cr-history-head {
  padding: 16px 20px;
}

.compliance-report-standalone .cr-history-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #0f172a;
}

.compliance-report-standalone .cr-history-title::before {
  content: "";
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: #f8fafc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18'/%3E%3Cpath d='m19 9-5 5-4-4-3 3'/%3E%3C/svg%3E") center / 16px no-repeat;
  border: 1px solid #e2e8f0;
}

.compliance-report-standalone .history-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px 14px;
  padding: 14px 20px;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border-bottom: 1px solid #e2e8f0;
}

.compliance-report-standalone .history-toolbar__group {
  display: flex;
  flex-direction: row;
  gap: 6px;
  min-width: 0;
}

.compliance-report-standalone .cr-table-wrap {
  border-radius: 0 0 16px 16px;
}

.compliance-report-standalone .cr-table-actions {
  gap: 8px;
  flex-wrap: nowrap;
}

.compliance-report-standalone .cr-accordion {
  margin-top: 20px;
}

.compliance-report-standalone .cr-acc-body-inner {
  gap: 14px;
  padding: 0 20px 20px;
}

/* Compliance report — Scan Schedule highlights (Mode/Time/Timezone controls) */
.compliance-report-standalone .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] .scan-auto-monitor__input {
  width: 100%;
  min-height: 44px;
  padding: 11px 14px;
  font-size: 15px;
  font-weight: 500;
  color: #0f172a;
  background-color: #fff;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.compliance-report-standalone .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] .scan-auto-monitor__input:hover {
  border-color: #94a3b8;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.06);
}

.compliance-report-standalone .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] .scan-auto-monitor__input:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow:
    0 0 0 3px rgba(37, 99, 235, 0.18),
    0 1px 2px rgba(15, 23, 42, 0.05);
}

.compliance-report-standalone .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] select.scan-auto-monitor__input {
  cursor: pointer;
  appearance: none;
  padding-right: 36px;
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.compliance-report-standalone .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] select.cc-timezone-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ea580c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E");
}

.compliance-report-standalone .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] input[type="time"].scan-auto-monitor__input,
.compliance-report-standalone .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] .cc-time-input[type="time"] {
  padding-right: 36px;
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230891b2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E");
  position: relative;
}

.compliance-report-standalone .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] input[type="time"].scan-auto-monitor__input::-webkit-calendar-picker-indicator,
.compliance-report-standalone .scan-auto-monitor__card[aria-labelledby="scan-auto-monitor-schedule"] .cc-time-input[type="time"]::-webkit-calendar-picker-indicator {
  opacity: 0;
  position: absolute;
  right: 10px;
  width: 24px;
  height: 24px;
  cursor: pointer;
}

.compliance-report-standalone .cc-time-field {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
  width: 100%;
}

.compliance-report-standalone .cc-time-field .scan-auto-monitor__input,
.compliance-report-standalone .cc-time-field .cc-time-input[type="time"] {
  flex: 1 1 160px;
  min-width: 0;
  width: auto;
  max-width: 100%;
}

.compliance-report-standalone .cc-time-now-btn {
  flex: 0 0 auto;
  align-self: center;
  min-height: 44px;
  height: 44px;
  padding: 0 14px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 600;
  color: #15803d;
  background: #f0fdf4;
  border: 1.5px solid #86efac;
  border-radius: 10px;
  cursor: pointer;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.compliance-report-standalone .cc-time-now-btn:hover {
  color: #166534;
  background: #dcfce7;
  border-color: #4ade80;
}

.compliance-report-standalone .cc-time-now-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.22);
}

/* ═══ SCHEDULED REPORTS ═══ */
.product-hub-page:has(.compliance-auto-runs) {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.product-hub-page:has(.compliance-auto-runs) .product-hub-hero {
  margin-bottom: 0;
  padding: 22px 24px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

.product-hub-page:has(.compliance-auto-runs) .product-hub-hero__eyebrow {
  margin-bottom: 6px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3668e9;
}

.product-hub-page:has(.compliance-auto-runs) .product-hub-hero__title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font-size: clamp(24px, 2.2vw, 32px);
}

.product-hub-page:has(.compliance-auto-runs) .product-hub-hero__title::before {
  content: "";
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: #f8fafc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230891b2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E") center / 20px no-repeat;
  border: 1px solid #e2e8f0;
}

.product-hub-page:has(.compliance-auto-runs) .product-hub-hero__subtitle {
  margin-top: 8px;
  font-size: 15px;
  line-height: 1.55;
  color: #3668e9;
}

.product-hub-page:has(.compliance-auto-runs) .product-hub-stat-grid {
  gap: 14px;
  margin: 0;
}

.product-hub-page:has(.compliance-auto-runs) .product-hub-stat-card {
  padding: 18px 20px;
  min-height: 0;
}

.product-hub-page:has(.compliance-auto-runs) .product-hub-stat-card__label {
  margin-bottom: 6px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #3668e9;
}

.product-hub-page:has(.compliance-auto-runs) .product-hub-stat-card__value {
  font-size: 22px;
  font-weight: 700;
  color: #0f172a;
}

.product-hub-page:has(.compliance-auto-runs) .product-hub-stat-card__helper {
  font-size: 13px;
  color: #3668e9;
}

.product-hub-page:has(.compliance-auto-runs) .prem-history-card.scan-automation-card {
  margin-top: 0;
  padding: 22px 24px 20px;
}

.product-hub-page:has(.compliance-auto-runs) .prem-history-card__head.cc-section-head {
  margin-bottom: 16px;
}

.product-hub-page:has(.compliance-auto-runs) .prem-history-card__title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: none;
  color: #0f172a;
}

.product-hub-page:has(.compliance-auto-runs) .prem-history-card__title::before {
  content: "";
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: #f8fafc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230891b2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='16' x='2' y='4' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E") center / 16px no-repeat;
  border: 1px solid #e2e8f0;
}

.product-hub-page:has(.compliance-auto-runs) .scan-auto-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 14px 16px;
  margin-bottom: 16px;
  padding: 14px 16px;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}

.product-hub-page:has(.compliance-auto-runs) .scan-auto-toggles,
.product-hub-page:has(.compliance-auto-runs) .compliance-auto-runs {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.product-hub-page:has(.compliance-auto-runs) .scan-auto-toggles > li,
.product-hub-page:has(.compliance-auto-runs) .compliance-auto-runs > li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 14px;
  padding: 12px 14px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  font-size: 14px;
  line-height: 1.45;
  color: #334155;
}

.product-hub-page:has(.compliance-auto-runs) .scan-auto-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.product-hub-page:has(.compliance-auto-runs) .scan-auto-badge {
  font-size: 12px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 999px;
  color: #475569;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
}

.product-hub-page:has(.compliance-auto-runs) .scan-auto-badge--active {
  color: #166534;
  background: #f0fdf4;
  border-color: #bbf7d0;
}

/* ═══ VIEW REPORT (Full Compliance) ═══ */
.cfr-page {
  padding: 24px 20px 48px;
  background: #f8fafc;
}

.cfr-page .cfr-top {
  margin-bottom: 20px;
  gap: 16px 24px;
}

.cfr-page .cfr-breadcrumb {
  font-size: 13px;
  color: #3668e9;
}

.cfr-page .cfr-breadcrumb a {
  color: #475569;
  font-weight: 600;
}

.cfr-page .cfr-title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: clamp(24px, 2.2vw, 32px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0f172a;
}

.cfr-page .cfr-title::before {
  content: "";
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: #f8fafc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3Cpath d='M10 9H8M16 13H8M16 17H8'/%3E%3C/svg%3E") center / 20px no-repeat;
  border: 1px solid #e2e8f0;
}

.cfr-page .cfr-meta {
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.55;
  color: #3668e9;
}

.cfr-page .cfr-actions {
  gap: 10px;
}

.cfr-page .cfr-cards {
  gap: 12px;
  margin-bottom: 20px;
}

.cfr-page .cfr-card {
  padding: 16px 18px;
}

.cfr-page .cfr-card-value {
  font-size: 1.35rem;
  color: #0f172a;
}

.cfr-page .cfr-card-label {
  margin-top: 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: #3668e9;
}

.cfr-page .cfr-card--total .cfr-card-value,
.cfr-page .cfr-card--analytics .cfr-card-value,
.cfr-page .cfr-card--marketing .cfr-card-value,
.cfr-page .cfr-card--preferences .cfr-card-value,
.cfr-page .cfr-card--necessary .cfr-card-value,
.cfr-page .cfr-card--unclassified .cfr-card-value {
  color: #0f172a;
}

.cfr-page .cfr-toolbar {
  gap: 12px;
  margin-bottom: 14px;
  padding: 14px 16px;
}

.cfr-page .cfr-toolbar-row1,
.cfr-page .cfr-toolbar-row2 {
  gap: 12px;
}

.cfr-page .cfr-toggle-group {
  background: #f1f5f9;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
}

.cfr-page .cfr-toggle {
  min-height: 40px;
  padding: 8px 14px;
  font-size: 13px;
  font-weight: 600;
}

.cfr-page .cfr-toggle.is-active {
  color: #1e40af;
  background: #fff;
}

.cfr-page .cfr-table-shell {
  margin-bottom: 14px;
}

.cfr-page .cfr-table thead th {
  padding: 12px 16px;
  font-size: 12px;
}

.cfr-page .cfr-table tbody td {
  padding: 12px 16px;
  font-size: 13px;
}

.cfr-page .cfr-group-row td {
  padding: 12px 16px;
  font-size: 13px;
  font-weight: 700;
  color: #0f172a;
  background: #f1f5f9 !important;
}

.cfr-page .cfr-url {
  font-size: 12px;
  color: #1e40af;
}

.cfr-page .cfr-cat-pill,
.cfr-page .cfr-risk {
  font-size: 11px;
  font-weight: 600;
}

.cfr-page .cr-pagination {
  gap: 12px;
  margin: 0 0 8px;
  padding: 12px 0;
}

.cfr-page .cr-page-btn {
  min-height: 36px;
  min-width: 36px;
  font-size: 13px;
  font-weight: 600;
  color: #3668e9;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}

.cfr-page .cr-page-btn.is-active {
  color: #1d4ed8;
  background: #eff6ff;
  border-color: #93c5fd;
  font-weight: 700;
}

.cfr-page .cfr-preset-banner {
  margin-bottom: 14px;
  padding: 12px 16px;
  font-size: 14px;
  color: #334155;
  background: #f8fafc;
  border-color: #e2e8f0;
}

@media (max-width: 900px) {
  .consent-logs-page .filter-row-1 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .consent-logs-page .filter-row-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .consent-logs-page .analytics-upsell-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .compliance-report-standalone .cr-head-actions {
    width: 100%;
  }

  .product-hub-page:has(.compliance-auto-runs) .scan-auto-grid {
    grid-template-columns: 1fr;
  }

  .cfr-page .cfr-top {
    flex-direction: column;
  }

  .cfr-page .cfr-actions {
    width: 100%;
  }
}

@media (max-width: 640px) {
  .consent-logs-page .filter-row-1,
  .consent-logs-page .filter-row-2,
  .consent-logs-page .filter-row-2--dsar {
    grid-template-columns: 1fr;
  }

  .consent-logs-page .analytics-upsell-summary {
    grid-template-columns: 1fr;
  }

  .consent-logs-page .analytics-upsell-filters .field,
  .consent-logs-page .analytics-upsell-filters > .btn-outlined {
    flex: 1 1 100%;
    width: 100%;
  }

  .consent-logs-page .consent-logs-site-row > .btn-outlined {
    margin-left: 0;
    width: 100%;
  }

  .consent-logs-page .consent-logs-site-hint {
    flex: 1 1 100%;
  }

  .compliance-report-inner {
    padding: 20px 16px 32px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   GOVERNANCE — Privacy Requests · Script Control · White Label
   Shared visual language (+2px typography, unified cards/forms/tables)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Sidebar — GOVERNANCE section label */
.app-sidebar-section:has(nav[aria-label="Governance"]) .nav-section-label {
  letter-spacing: 0.1em;
  font-size: 12px;
  font-weight: 700;
  color: rgba(248, 250, 252, 0.55);
}

.app-shell-dark .app-sidebar-section:has(nav[aria-label="Governance"]) .nav-section-label {
  color: rgba(248, 250, 252, 0.55);
}

/* Shared page shell */
.governance-page {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: var(--ds-page-max);
  font-size: 18px;
  line-height: 1.55;
  color: var(--ds-color-neutral);
}

.governance-page .page-shell__header {
  margin-bottom: 4px;
}

.governance-page .page-shell__header h1 {
  margin: 0;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: #0f172a;
}

.governance-page .page-shell__intro {
  margin: 8px 0 20px;
  max-width: 720px;
  font-size: 17px;
  line-height: 1.6;
  color: #3668e9;
}

/* Panels / cards */
.governance-page .enterprise-panel,
.governance-page .script-control-page > .card,
.script-control-page.governance-page > .card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 22px 24px;
  margin-top: 0;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
  transition: box-shadow 0.15s ease;
}

.governance-page .enterprise-panel:hover,
.script-control-page.governance-page > .card:hover {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 2px 12px rgba(15, 23, 42, 0.08);
}

.governance-page .enterprise-panel__title,
.script-control-page.governance-page > .card > h3 {
  margin: 0 0 8px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
  color: #0f172a;
}

.governance-page .enterprise-panel__intro,
.governance-page .enterprise-panel__muted,
.script-control-page.governance-page .card p {
  margin: 0 0 10px;
  font-size: 16px;
  line-height: 1.55;
  color: #3668e9;
}

.governance-page .enterprise-panel__error,
.governance-page .error {
  margin: 0 0 12px;
  padding: 12px 14px;
  font-size: 16px;
  line-height: 1.5;
  color: #b91c1c;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 10px;
}

/* Form fields */
.governance-page label,
.governance-page .field label,
.governance-page .field > span.websites-site-label {
  display: flex;
  flex-direction: column;
  gap: 9px;
  margin-bottom: 6px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #3668e9;
}

.governance-page input[type="text"],
.governance-page input[type="url"],
.governance-page input[type="color"],
.governance-page select,
.governance-page textarea,
.governance-page .field input,
.governance-page .field select,
.governance-page .privacy-requests-form label select,
.governance-page .privacy-requests-form label input,
.governance-page .privacy-requests-form label textarea {
  box-sizing: border-box;
  width: 100%;
  min-height: 44px;
  padding: 0 14px;
  font-family: var(--ds-font-family);
  font-size: 17px;
  line-height: 1.4;
  color: #0f172a;
  background-color: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.governance-page textarea,
.governance-page .privacy-requests-form label textarea {
  min-height: 88px;
  padding: 12px 14px;
  resize: vertical;
}

.governance-page:not(.script-control-page) select,
.governance-page .privacy-requests-form label select {
  appearance: none;
  cursor: pointer;
  padding-right: 36px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
}

.governance-page input:focus,
.governance-page select:focus,
.governance-page textarea:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.governance-page input::placeholder,
.governance-page textarea::placeholder {
  color: #94a3b8;
  font-size: 17px;
}

/* Buttons */
.governance-page .btn,
.governance-page button.btn {
  min-height: 44px;
  padding: 0 18px;
  font-family: var(--ds-font-family);
  font-size: 17px;
  font-weight: 600;
  line-height: 1.2;
  border-radius: 10px;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.governance-page .btn.primary,
.governance-page .btn:not(.secondary):not(.danger):not(.btn--sm) {
  color: #fff;
  background: #0f172a;
  border: none;
}

.governance-page .btn.primary:hover:not(:disabled),
.governance-page .btn:not(.secondary):not(.danger):not(.btn--sm):hover:not(:disabled) {
  background: #1e293b;
}

.governance-page .btn.secondary,
.governance-page .btn.btn--sm.secondary {
  color: #374151;
  background: #fff;
  border: 1px solid #e2e8f0;
}

.governance-page .btn.secondary:hover:not(:disabled) {
  color: #6366f1;
  border-color: #a5b4fc;
  background: #f8fafc;
}

.governance-page .btn.danger {
  color: #fff;
  background: #dc2626;
  border: none;
}

.governance-page .btn.danger:hover:not(:disabled) {
  background: #b91c1c;
}

.governance-page .btn--sm {
  min-height: 38px;
  padding: 0 14px;
  font-size: 15px;
}

.governance-page .btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

/* ─── Privacy Requests ─── */
.privacy-requests-page.governance-page .privacy-requests-form__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 18px;
  margin-top: 16px;
}

.privacy-requests-page.governance-page .privacy-requests-form__notes {
  margin-top: 16px;
}

.privacy-requests-page.governance-page .privacy-requests-form .btn.primary {
  margin-top: 18px;
}

/* Select fields — custom chevron (hide native arrow) */
.privacy-requests-page.governance-page .privacy-requests-form label select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  min-height: 46px;
  padding: 11px 44px 11px 14px;
  font-weight: 500;
  cursor: pointer;
  background-color: #fff;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #f8fafc 0%, #f8fafc 40px, transparent 40px);
  background-repeat: no-repeat, no-repeat;
  background-position: right 14px center, center;
  background-size: 18px 18px, 100% 100%;
  border: 1.5px solid #cbd5e1;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.privacy-requests-page.governance-page .privacy-requests-form label select::-ms-expand {
  display: none;
}

.privacy-requests-page.governance-page .privacy-requests-form label select:hover {
  border-color: #94a3b8;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #f1f5f9 0%, #f1f5f9 40px, transparent 40px);
}

.privacy-requests-page.governance-page .privacy-requests-form label select:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow:
    0 0 0 3px rgba(99, 102, 241, 0.15),
    0 1px 2px rgba(15, 23, 42, 0.05);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #eef2ff 0%, #eef2ff 40px, transparent 40px);
}

/* Text inputs and textarea — no dropdown chevron */
.privacy-requests-page.governance-page .privacy-requests-form label input {
  appearance: none;
  -webkit-appearance: none;
  min-height: 46px;
  padding: 11px 14px;
  font-weight: 500;
  background: #fff;
  border: 1.5px solid #cbd5e1;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.privacy-requests-page.governance-page .privacy-requests-form label textarea {
  min-height: 88px;
  padding: 12px 14px;
  font-weight: 500;
  background: #fff;
  border: 1.5px solid #cbd5e1;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  resize: vertical;
}

.privacy-requests-page.governance-page .privacy-requests-form label input:focus,
.privacy-requests-page.governance-page .privacy-requests-form label textarea:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow:
    0 0 0 3px rgba(99, 102, 241, 0.15),
    0 1px 2px rgba(15, 23, 42, 0.05);
}

.privacy-requests-page.governance-page .privacy-requests-list {
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.privacy-requests-page.governance-page .privacy-requests-list > li {
  padding: 16px 0;
  border-top: 1px solid #eaeaea;
}

.privacy-requests-page.governance-page .privacy-requests-list > li:first-child {
  border-top: none;
  padding-top: 8px;
}

.privacy-requests-page.governance-page .privacy-requests-list__head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}

.privacy-requests-page.governance-page .privacy-requests-list__head strong {
  font-size: 17px;
  font-weight: 700;
  color: #0f172a;
}

.privacy-requests-page.governance-page .privacy-requests-list__status {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 999px;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #475569;
}

.privacy-requests-page.governance-page .privacy-requests-list__status--pending {
  color: #b45309;
  background: #fffbeb;
  border-color: #fde68a;
}

.privacy-requests-page.governance-page .privacy-requests-list__status--completed,
.privacy-requests-page.governance-page .privacy-requests-list__status--done {
  color: #047857;
  background: #ecfdf5;
  border-color: #a7f3d0;
}

.privacy-requests-page.governance-page .privacy-requests-list__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}

.privacy-requests-page.governance-page .cs-inline-loading {
  font-size: 16px;
  color: #3668e9;
}

/* ─── Script Control ─── */
.script-control-page.governance-page {
  gap: 0;
}

/* Website property field */
.script-control-page.governance-page > .field:first-of-type {
  max-width: none !important;
  width: 100%;
  padding: 20px 22px;
  margin: 0;
  border: 1px solid #c7d2fe;
  border-radius: 14px;
}

.script-control-page.governance-page > .field:first-of-type > div:first-of-type {
  margin-top: 0 !important;
  padding: 14px 16px;
  font-size: 17px !important;
  font-weight: 600 !important;
  line-height: 1.45;
  color: #312e81 !important;
  word-break: break-all;
  background: linear-gradient(180deg, #fff 0%, #f5f3ff 100%);
  border: 1.5px solid #a5b4fc;
  border-radius: 10px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 1px 3px rgba(99, 102, 241, 0.12);
}

.script-control-page.governance-page > .field:first-of-type > div:last-of-type {
  font-size: 16px !important;
}

/* Stats row — equal-width cards */
.script-control-page.governance-page > .row:first-of-type {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 4px !important;
  margin-bottom: 4px !important;
}

.script-control-page.governance-page > .row:first-of-type > .card {
  display: grid;
  grid-template-columns: 1fr 48px;
  grid-template-rows: auto auto;
  column-gap: 12px;
  row-gap: 10px;
  align-items: start;
  min-width: 0;
  min-height: 112px;
  margin: 0 !important;
  padding: 18px 20px 20px;
  text-align: left;
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
  border: 1px solid #e2e8f0 !important;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.04);
}

.script-control-page.governance-page > .row:first-of-type > .card::after {
  content: "";
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center;
  justify-self: end;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 22px 22px;
}

.script-control-page.governance-page > .row:first-of-type > .card:nth-child(1) {
  border-top: 3px solid #6366f1 !important;
  background: linear-gradient(180deg, #eef2ff 0%, #fff 100%);
}

.script-control-page.governance-page > .row:first-of-type > .card:nth-child(1)::after {
  background-color: #e0e7ff;
  border: 1px solid #c7d2fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10'/%3E%3Cpath d='m4.9 4.9 14.2 14.2'/%3E%3C/svg%3E");
}

.script-control-page.governance-page > .row:first-of-type > .card:nth-child(2) {
  border-top: 3px solid #10b981 !important;
  background: linear-gradient(180deg, #ecfdf5 0%, #fff 100%);
}

.script-control-page.governance-page > .row:first-of-type > .card:nth-child(2)::after {
  background-color: #d1fae5;
  border: 1px solid #a7f3d0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%2310b981' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

.script-control-page.governance-page > .row:first-of-type > .card:nth-child(3) {
  border-top: 3px solid #f59e0b !important;
  background: linear-gradient(180deg, #fffbeb 0%, #fff 100%);
}

.script-control-page.governance-page > .row:first-of-type > .card:nth-child(3)::after {
  background-color: #fef3c7;
  border: 1px solid #fde68a;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23f59e0b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}

.script-control-page.governance-page > .row:first-of-type > .card strong {
  display: inline-flex !important;
  align-items: center;
  align-self: flex-start;
  grid-column: 1;
  grid-row: 1;
  margin: 0;
  padding: 8px 14px !important;
  min-height: 36px;
  box-sizing: border-box;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: 0;
  text-transform: none !important;
  line-height: 1.25;
  border-radius: 8px;
  border: 1.5px solid transparent;
}

.script-control-page.governance-page > .row:first-of-type > .card:nth-child(1) strong {
  color: #3730a3 !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
  box-shadow: 0 1px 3px rgba(99, 102, 241, 0.18);
}

.script-control-page.governance-page > .row:first-of-type > .card:nth-child(2) strong {
  color: #047857 !important;
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
  box-shadow: 0 1px 3px rgba(16, 185, 129, 0.18);
}

.script-control-page.governance-page > .row:first-of-type > .card:nth-child(3) strong {
  color: #92400e !important;
  background: #fef3c7 !important;
  border-color: #fcd34d !important;
  box-shadow: 0 1px 3px rgba(245, 158, 11, 0.2);
}

.script-control-page.governance-page > .row:first-of-type > .card > div {
  grid-column: 1;
  grid-row: 2;
  margin-top: 0 !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  color: #0f172a !important;
  font-variant-numeric: tabular-nums;
}

.script-control-page.governance-page > .row:first-of-type > .card:nth-child(1) > div {
  color: #312e81 !important;
}

.script-control-page.governance-page > .row:first-of-type > .card:nth-child(2) > div {
  color: #065f46 !important;
}

.script-control-page.governance-page > .row:first-of-type > .card:nth-child(3) > div {
  color: #92400e !important;
}

/* Content cards */
.script-control-page.governance-page > .card {
  margin-top: 20px !important;
  padding: 22px 24px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.script-control-page.governance-page > .card > h3 {
  margin: 0 0 14px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
}

.script-control-page.governance-page > .card > p {
  margin: 0 0 16px;
  font-size: 16px;
  line-height: 1.6;
  color: #3668e9;
}

.script-control-page.governance-page .card code {
  padding: 2px 6px;
  font-size: 15px;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

/* Debug checkbox only — not form field labels */
.script-control-page.governance-page .card > label {
  display: flex;
  align-items: center;
  flex-direction: row;
  gap: 10px;
  margin-top: 4px;
  font-size: 16px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  color: #374151;

}

.script-control-page.governance-page .card > label input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-height: 18px;
  accent-color: #6366f1;
}

/* Manual override form grid */
.script-control-page.governance-page > .card .row {
  display: grid !important;
  grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr));
  gap: 14px 16px !important;
  align-items: end;
  flex-wrap: unset !important;
  margin: 0;
}

.script-control-page.governance-page > .card .row > .field,
.script-control-page.governance-page > .card > .field {
  display: flex !important;
  flex-direction: column;
  gap: 8px;
  min-width: 0 !important;
  flex: unset !important;
  width: 100%;
  max-width: none;
  margin: 0 !important;
}

.script-control-page.governance-page > .card > .field {
  margin-top: 16px !important;
}

.script-control-page.governance-page > .card .field label {
  display: block !important;
  flex-direction: unset !important;
  gap: 0 !important;
  margin: 0 0 0 !important;
  padding: 0;
  font-size: 14px !important;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #3668e9;
  line-height: 1.3;
}

/* Highlighted inputs */
.script-control-page.governance-page > .card .field input[type="text"],
.script-control-page.governance-page > .card .field input:not([type]) {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  box-sizing: border-box;
  width: 100%;
  min-height: 46px;
  height: 46px;
  margin: 0;
  padding: 0 14px !important;
  font-size: 16px !important;
  font-weight: 500;
  line-height: 1.4;
  color: #0f172a;
  background-color: #fff !important;
  background-image: none !important;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.script-control-page.governance-page > .card .field select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  box-sizing: border-box;
  width: 100%;
  min-height: 46px;
  height: 46px;
  margin: 0;
  padding: 0 38px 0 14px !important;
  font-size: 16px !important;
  font-weight: 500;
  line-height: 1.4;
  color: #0f172a;
  cursor: pointer;
  background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 18px 18px !important;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.script-control-page.governance-page > .card .field select::-ms-expand {
  display: none;
}

.script-control-page.governance-page > .card .field input:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow:
    0 0 0 3px rgba(99, 102, 241, 0.15),
    0 1px 2px rgba(15, 23, 42, 0.05);
}

.script-control-page.governance-page > .card .field select:hover {
  border-color: #94a3b8;
  background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
}

.script-control-page.governance-page > .card .field select:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow:
    0 0 0 3px rgba(99, 102, 241, 0.15),
    0 1px 2px rgba(15, 23, 42, 0.05);
  background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
}

.script-control-page.governance-page > .card > .btn {
  margin-top: 18px;
}

.script-control-page.governance-page table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  font-size: 16px;
}

.script-control-page.governance-page table thead th {
  padding: 12px 14px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: left;
  color: #3668e9;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.script-control-page.governance-page table tbody td {
  padding: 14px;
  font-size: 16px;
  color: #374151;
  border-bottom: 1px solid #eaeaea;
  vertical-align: top;
}

.script-control-page.governance-page table tbody tr:hover td {
  background: #f8fafc;
}

.script-control-page.governance-page table tbody td code {
  font-size: 14px;
  word-break: break-all;
}

/* Recent Script Events — status icons */
.script-control-page.governance-page td.sc-event-status {
  vertical-align: middle;
}

.script-control-page.governance-page .sc-event-status__text {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
}

.script-control-page.governance-page .sc-event-status__text::before {
  content: "";
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
}

.script-control-page.governance-page .sc-event-status--blocked .sc-event-status__text::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m4.9 4.9 14.2 14.2'/%3E%3C/svg%3E");
}

.script-control-page.governance-page .sc-event-status--executed .sc-event-status__text::before,
.script-control-page.governance-page .sc-event-status--allowed .sc-event-status__text::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23166534' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpath d='m9 11 3 3L22 4'/%3E%3C/svg%3E");
}

.script-control-page.governance-page .sc-event-status--missed .sc-event-status__text::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}

.script-control-page.governance-page .sc-event-status--detected .sc-event-status__text::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%230369a1' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E");
}

.script-control-page.governance-page .sc-event-status:not(.sc-event-status--blocked):not(.sc-event-status--executed):not(.sc-event-status--allowed):not(.sc-event-status--missed):not(.sc-event-status--detected) .sc-event-status__text::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%233668e9' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E");
}

/* ─── White Label (Governance) ─── */
.governance-white-label-page.governance-page {
  gap: 0;
}

.governance-white-label-page .product-hub-hero__eyebrow {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.governance-white-label-page .product-hub-hero__title {
  font-size: clamp(26px, 2.2vw, 38px);
}

.governance-white-label-page .product-hub-hero__subtitle {
  font-size: 18px;
  line-height: 1.65;
}

.governance-white-label-page .product-hub-stat-grid {
  gap: 16px;
}

.governance-white-label-page .product-hub-stat-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  min-height: 112px;
  padding: 18px 20px 20px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.governance-white-label-page .product-hub-stat-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

.governance-white-label-page .product-hub-stat-card__label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.2;
}

.governance-white-label-page .product-hub-stat-card__label::before {
  content: "";
  display: inline-block;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  border-radius: 8px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

.governance-white-label-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label {
  color: #2562ff;
}

.governance-white-label-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label::before {
  background-color: #eef2ff;
  border: 1px solid #c7d2fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.586 2.586A2 2 0 0 0 11.172 2H4a2 2 0 0 0-2 2v7.172a2 2 0 0 0 .586 1.414l8.704 8.704a2.426 2.426 0 0 0 3.42 0l6.58-6.58a2.426 2.426 0 0 0 0-3.42z'/%3E%3Ccircle cx='7.5' cy='7.5' r='.5' fill='%232562ff'/%3E%3C/svg%3E");
}

.governance-white-label-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label {
  color: #7c3aed;
}

.governance-white-label-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label::before {
  background-color: #ede9fe;
  border: 1px solid #ddd6fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='13.5' cy='6.5' r='.5' fill='%237c3aed'/%3E%3Ccircle cx='17.5' cy='10.5' r='.5' fill='%237c3aed'/%3E%3Ccircle cx='8.5' cy='7.5' r='.5' fill='%237c3aed'/%3E%3Ccircle cx='6.5' cy='12.5' r='.5' fill='%237c3aed'/%3E%3Cpath d='M12 2C6.5 2 2 6.5 2 12s4.5 10 10 10c.926 0 1.648-.746 1.648-1.688 0-.437-.18-.835-.437-1.125-.29-.289-.438-.652-.438-1.125a1.64 1.64 0 0 1 1.668-1.668h1.996c3.051 0 5.555-2.503 5.555-5.554C21.965 6.012 17.461 2 12 2z'/%3E%3C/svg%3E");
}

.governance-white-label-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label {
  color: #047857;
}

.governance-white-label-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label::before {
  background-color: #d1fae5;
  border: 1px solid #a7f3d0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

.governance-white-label-page .product-hub-stat-card--info:nth-child(3) .product-hub-stat-card__label {
  color: #0369a1;
}

.governance-white-label-page .product-hub-stat-card--info:nth-child(3) .product-hub-stat-card__label::before {
  background-color: #e0f2fe;
  border-color: #bae6fd;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.governance-white-label-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label {
  color: #b45309;
}

.governance-white-label-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label::before {
  background-color: #fef3c7;
  border: 1px solid #fde68a;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11.562 3.266a1 1 0 0 1 .876 0L21 8.12l-8.562 4.854a1 1 0 0 1-.876 0L3 8.12z'/%3E%3Cpath d='M3 8.12v7.76l8.562 4.854a1 1 0 0 0 .876 0L21 15.88V8.12'/%3E%3Cpath d='M12 13.004V22'/%3E%3C/svg%3E");
}

.governance-white-label-page .product-hub-stat-card__value,
.governance-white-label-page .product-hub-stat-card strong {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: #0f172a;
}

.governance-white-label-page .product-hub-stat-card__helper {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: #3668e9;
}

/* White Label — normalize pending KPI card spacing & font sizes */
.governance-white-label-page .product-hub-stat-card {
  gap: 6px;
}

.governance-white-label-page .product-hub-stat-card .cs-kpi-metric--card {
  gap: 6px;
  padding: 0;
  min-height: 0;
}

.governance-white-label-page .product-hub-stat-card .cs-kpi-metric__icon-wrap {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  margin-bottom: 2px;
}

.governance-white-label-page .product-hub-stat-card .cs-kpi-metric__chip {
  font-size: 11px;
  padding: 3px 10px;
}

.governance-white-label-page .product-hub-stat-card .cs-kpi-metric__subtitle {
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
}

.governance-white-label-page .product-hub-stat-card .cs-kpi-metric__desc {
  font-size: 13px;
  line-height: 1.45;
  max-width: none;
}

.governance-white-label-page .product-hub-config-card {
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  align-self: center;
  padding: 24px 26px;
  background: linear-gradient(180deg, #fbfbff 0%, #f5f6ff 100%);
  border: 1.5px solid #6366f1;
  border-radius: 16px;
  box-shadow:
    0 0 0 4px rgba(99, 102, 241, 0.1),
    0 8px 24px rgba(79, 70, 229, 0.12);
}

.governance-white-label-page .product-hub-config-card .field {
  margin-bottom: 16px;
}

.governance-white-label-page .product-hub-config-card .field label {
  margin-bottom: 8px;
  font-size: 14px;
}

.governance-white-label-page .product-hub-toggle-row {
  margin: 18px 0;
  padding: 14px 16px;
  font-size: 14px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  flex-direction: row;
}

.governance-white-label-page .product-hub-panel-note {
  font-size: 16px;
  line-height: 1.6;
  color: #3668e9;
}

.governance-white-label-page .product-hub-panel-note a {
  font-size: 16px;
  font-weight: 600;
}

.governance-white-label-page .product-hub-empty-state__title {
  font-size: 19px;
}

.governance-white-label-page .product-hub-empty-state__desc {
  font-size: 17px;
}

/* Responsive */
@media (max-width: 900px) {
  .privacy-requests-page.governance-page .privacy-requests-form__grid {
    grid-template-columns: 1fr;
  }

  .script-control-page.governance-page > .row:first-of-type {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .script-control-page.governance-page > .card .row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .governance-page .page-shell__header h1 {
    font-size: 24px;
  }

  .governance-page .page-shell__intro {
    font-size: 16px;
  }

  .governance-page .enterprise-panel,
  .script-control-page.governance-page > .card {
    padding: 18px 16px;
  }

  .script-control-page.governance-page > .row:first-of-type {
    grid-template-columns: 1fr;
  }

  .script-control-page.governance-page > .card .row {
    grid-template-columns: 1fr;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   REPORTS & HELP CENTER — Compliance Reports · View Report · Policy Tools
   · Getting Started · Implementation · Certifications & Trust
   Shared visual language (+2px typography, unified cards/forms/tables)
   ═══════════════════════════════════════════════════════════════════════════ */

/* Sidebar — section labels (+2px) */
.app-sidebar-section:has(nav[aria-label="Reports"]) .nav-section-label,
.app-sidebar-section:has(nav[aria-label="Legal and policy tools"]) .nav-section-label,
.app-sidebar-section:has(nav[aria-label="Help Center"]) .nav-section-label {
  letter-spacing: 0.1em;
  font-size: 12px;
  font-weight: 700;
  color: rgba(248, 250, 252, 0.55);
}

.app-shell-dark .app-sidebar-section:has(nav[aria-label="Reports"]) .nav-section-label,
.app-shell-dark .app-sidebar-section:has(nav[aria-label="Legal and policy tools"]) .nav-section-label,
.app-shell-dark .app-sidebar-section:has(nav[aria-label="Help Center"]) .nav-section-label {
  color: rgba(248, 250, 252, 0.55);
}

/* Shared hub shells */
.reports-hub-page,
.help-hub-page {
  display: flex;
  flex-direction: column;
  max-width: var(--ds-page-max, none);
  font-size: 18px;
  line-height: 1.55;
  color: var(--ds-color-neutral, #334155);
}

/* ─── Product hub hero (Help + Policy) ─── */
.help-hub-page .product-hub-hero,
.reports-hub-page.policy-generator-page .product-hub-hero,
.help-hub-page.impl-center-page .product-hub-hero {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.help-hub-page .product-hub-hero__eyebrow,
.reports-hub-page.policy-generator-page .product-hub-hero__eyebrow,
.help-hub-page.impl-center-page .product-hub-hero__eyebrow {
  margin-bottom: 8px;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.help-hub-page .product-hub-hero__title,
.reports-hub-page.policy-generator-page .product-hub-hero__title,
.help-hub-page.impl-center-page .product-hub-hero__title {
  margin: 0;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: #0f172a;
}

.help-hub-page .product-hub-hero__subtitle,
.reports-hub-page.policy-generator-page .product-hub-hero__subtitle,
.help-hub-page.impl-center-page .product-hub-hero__subtitle {
  margin-top: 10px;
  max-width: 720px;
  font-size: 16px;
  line-height: 1.6;
  color: #3668e9;
}

.help-hub-page .product-hub-stat-grid,
.reports-hub-page.policy-generator-page .product-hub-stat-grid {
  gap: 16px;
}

.help-hub-page .product-hub-stat-card,
.reports-hub-page.policy-generator-page .product-hub-stat-card {
  min-height: 100px;
  padding: 20px 22px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.help-hub-page .product-hub-stat-card {
  word-wrap: break-word;
}
.help-hub-page .product-hub-stat-card:hover,
.reports-hub-page.policy-generator-page .product-hub-stat-card:hover {
  border-color: #cbd5e1;
  box-shadow: 0 2px 12px rgba(15, 23, 42, 0.08);
}

.help-hub-page .product-hub-stat-card__label,
.reports-hub-page.policy-generator-page .product-hub-stat-card__label {
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3668e9;
}

.help-hub-page .product-hub-stat-card__value,
.help-hub-page .product-hub-stat-card strong,
.reports-hub-page.policy-generator-page .product-hub-stat-card__value,
.reports-hub-page.policy-generator-page .product-hub-stat-card strong {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #0f172a;
}

.help-hub-page .product-hub-stat-card__helper,
.reports-hub-page.policy-generator-page .product-hub-stat-card__helper {
  margin-top: 9px;
  font-size: 15px;
  line-height: 1.5;
  color: #3668e9;
}

.help-hub-page .product-hub-panel-note,
.reports-hub-page.policy-generator-page .product-hub-panel-note {
  margin: 16px 0 0 0;
  padding: 14px 16px;
  font-size: 16px;
  line-height: 1.6;
  color: #3668e9;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}

.help-hub-page .product-hub-panel-note strong,
.reports-hub-page.policy-generator-page .product-hub-panel-note strong {
  color: #334155;
  font-weight: 600;
}

.help-hub-page .product-hub-panel-note code,
.reports-hub-page.policy-generator-page .product-hub-panel-note code {
  font-size: 15px;
  padding: 2px 6px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

/* Privacy Policy Generator — stat card icons & label highlights */
.reports-hub-page.policy-generator-page .product-hub-stat-card {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto auto;
  column-gap: 12px;
  row-gap: 8px;
  align-items: center;
  min-height: 108px;
}

.reports-hub-page.policy-generator-page .product-hub-stat-card__icon {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background-color: #f1f5f9;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  grid-column: 1;
  grid-row: 1;
  align-self: center;
}

.reports-hub-page.policy-generator-page .product-hub-stat-card__label {
  grid-column: 2;
  grid-row: 1;
  margin-bottom: 0;
  display: inline-flex;
}

.reports-hub-page.policy-generator-page .product-hub-stat-card__value,
.reports-hub-page.policy-generator-page .product-hub-stat-card strong {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
}

.reports-hub-page.policy-generator-page .product-hub-stat-card__helper {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: 0;
}

.reports-hub-page.policy-generator-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label {
  color: #b45309;
}

.reports-hub-page.policy-generator-page .product-hub-stat-card__icon--cookie {
  background-color: rgba(245, 158, 11, 0.14);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2a10 10 0 1 0 10 10 4 4 0 0 1-5-5 4 4 0 0 1-5-5'/%3E%3Cpath d='M8.5 8.5v.01M16 15.5v.01M12 12v.01M7 8v.01M17 16v.01'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label {
  color: #2562ff;
}

.reports-hub-page.policy-generator-page .product-hub-stat-card__icon--privacy {
  background-color: rgba(99, 102, 241, 0.14);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4M10 9H8M16 13H8M16 17H8'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label {
  color: #0369a1;
}

.reports-hub-page.policy-generator-page .product-hub-stat-card__icon--region {
  background-color: rgba(2, 132, 199, 0.14);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label {
  color: #047857;
}

.reports-hub-page.policy-generator-page .product-hub-stat-card__icon--scan-sync {
  background-color: rgba(22, 163, 74, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .product-hub-stat-card--warn .product-hub-stat-card__label {
  color: #b45309;
}

.reports-hub-page.policy-generator-page .product-hub-stat-card--warn .product-hub-stat-card__icon--scan-sync {
  background-color: rgba(245, 158, 11, 0.14);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .product-hub-stat-card--success .product-hub-stat-card__icon--scan-sync {
  background-color: rgba(22, 163, 74, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

/* ─── Help Center (Getting Started · Browse Documentation) ─── */
.help-hub-page.hc-premium-page .product-hub-hero__actions .hc-hero-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  padding-left: 18px;
  padding-right: 20px;
  font-size: 16px;
  font-weight: 600;
}

.help-hub-page.hc-premium-page .product-hub-hero__actions .hc-hero-btn::before {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
}

.help-hub-page.hc-premium-page .product-hub-hero__actions .hc-hero-btn--docs::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 7v14'/%3E%3Cpath d='M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z'/%3E%3C/svg%3E");
}

.help-hub-page.hc-premium-page .product-hub-hero__actions .hc-hero-btn--start::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z'/%3E%3Cpath d='m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2z'/%3E%3Cpath d='M9 12H4s.55-3.03 2-4c1.62-1.08 5 0 5 0'/%3E%3Cpath d='M12 15v5s3.03-.55 4-2c1.08-1.62 0-5 0-5'/%3E%3C/svg%3E");
}

.help-hub-page.hc-premium-page .hc-docs-unavailable-banner {
  padding: 14px 18px;
  font-size: 16px;
  line-height: 1.55;
  color: #92400e;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 12px;
}

.help-hub-page.hc-premium-page .hc-section {
  margin-top: 17px;
}

.help-hub-page.hc-premium-page .hc-section-head {
  margin: 6px 0 14px;
}

.help-hub-page.hc-premium-page .hc-section-head__title {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.3;
  color: #0f172a;
}

.help-hub-page.hc-premium-page .hc-section-head__sub {
  margin: 8px 0 0;
  font-size: 15px;
  line-height: 1.55;
  color: #3668e9;
}

.help-hub-page.hc-premium-page .hc-guide-grid {
  gap: 14px;
}

.help-hub-page.hc-premium-page .hc-guide-card {
  padding: 16px 20px 18px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.help-hub-page.hc-premium-page .hc-guide-card:hover {
  border-color: #cbd5e1;
  transform: translateY(-2px);
  box-shadow: 0 10px 32px rgba(15, 23, 42, 0.08);
}

.help-hub-page.hc-premium-page .hc-guide-card__title {
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
}

.help-hub-page.hc-premium-page .hc-guide-card__desc {
  font-size: 15px;
  line-height: 1.55;
  color: #3668e9;
}

.help-hub-page.hc-premium-page .hc-guide-card__cta {
  font-size: 15px;
  font-weight: 600;
  color: #4f46e5;
}

.help-hub-page.hc-premium-page .hc-workflow-grid {
  gap: 16px;
}

.help-hub-page.hc-premium-page .hc-workflow-card {
  padding: 18px 24px 25px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.help-hub-page.hc-premium-page .hc-workflow-card:hover {
  border-color: rgba(37, 99, 235, 0.28);
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(15, 23, 42, 0.08);
}

.help-hub-page.hc-premium-page .hc-workflow-card__title {
  margin: 0;
  font-size: 19px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.3;
  color: #0f172a;
}

.help-hub-page.hc-premium-page .hc-workflow-card__desc {
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
  color: #3668e9;
}

.help-hub-page.hc-premium-page .hc-feature-list {
  gap: 8px;
}

.help-hub-page.hc-premium-page .hc-feature-list li {
  font-size: 15px;
  line-height: 1.5;
  color: #334155;
  font-weight: 500;
}

/* Fix corrupted ✓ glyph (shows as âœ) in bundled CSS — use SVG checkmark */
.help-hub-page .hc-feature-list li::before {
  content: "" !important;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  font-size: 0 !important;
  font-weight: 400 !important;
  color: transparent !important;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2310b981' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") no-repeat center / 14px 14px;
}

.help-hub-page.hc-premium-page .hc-workflow-card__actions .btn,
.help-hub-page.hc-premium-page .hc-workflow-card__actions a.btn {
  min-height: 46px;
  font-size: 16px;
}

/* Support & escalation cards — highlighted with icons */
.help-hub-page.hc-premium-page #support .help-support-grid {
  gap: 16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.help-hub-page.hc-premium-page .help-support-card {
  padding: 20px 22px 22px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 1px 3px rgba(15, 23, 42, 0.06);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.help-hub-page.hc-premium-page .help-support-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(15, 23, 42, 0.08);
}

.help-hub-page.hc-premium-page .help-support-card--docs {
  background: linear-gradient(180deg, rgba(79, 70, 229, 0.06) 0%, #fff 42%);
  border-color: rgba(79, 70, 229, 0.18);
}

.help-hub-page.hc-premium-page .help-support-card--docs:hover {
  border-color: rgba(79, 70, 229, 0.32);
}

.help-hub-page.hc-premium-page .help-support-card--billing {
  background: linear-gradient(180deg, rgba(16, 185, 129, 0.07) 0%, #fff 42%);
  border-color: rgba(16, 185, 129, 0.2);
}

.help-hub-page.hc-premium-page .help-support-card--billing:hover {
  border-color: rgba(16, 185, 129, 0.34);
}

.help-hub-page.hc-premium-page .help-support-card--enterprise {
  background: linear-gradient(180deg, rgba(124, 58, 237, 0.07) 0%, #fff 42%);
  border-color: rgba(124, 58, 237, 0.2);
}

.help-hub-page.hc-premium-page .help-support-card--enterprise:hover {
  border-color: rgba(124, 58, 237, 0.34);
}

.help-hub-page.hc-premium-page .help-support-card__title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: #0f172a;
}

.help-hub-page.hc-premium-page .help-support-card__title::before {
  content: "";
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px 20px;
}

.help-hub-page.hc-premium-page .help-support-card--docs .help-support-card__title::before {
  background-color: rgba(79, 70, 229, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4M10 9H8M16 13H8M16 17H8'/%3E%3C/svg%3E");
}

.help-hub-page.hc-premium-page .help-support-card--billing .help-support-card__title::before {
  background-color: rgba(16, 185, 129, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23059669' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='14' x='2' y='5' rx='2'/%3E%3Cpath d='M2 10h20'/%3E%3C/svg%3E");
}

.help-hub-page.hc-premium-page .help-support-card--enterprise .help-support-card__title::before {
  background-color: rgba(124, 58, 237, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z'/%3E%3Cpath d='M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2'/%3E%3Cpath d='M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M10 6h4M10 10h4M10 14h4M10 18h4'/%3E%3C/svg%3E");
}

.help-hub-page.hc-premium-page .help-support-card p {
  margin: 14px 0 0;
  font-size: 16px;
  line-height: 1.6;
  color: #475569;
}

.help-hub-page.hc-premium-page .help-support-card p a {
  font-weight: 600;
  color: #4f46e5;
  text-decoration: none;
}

.help-hub-page.hc-premium-page .help-support-card p a:hover {
  text-decoration: underline;
}

@media (max-width: 960px) {
  .help-hub-page.hc-premium-page #support .help-support-grid {
    grid-template-columns: 1fr;
  }
}

/* Trust cards (Certifications & Help Center) */
.help-hub-page .hc-trust-grid {
  gap: 14px;
}

.help-hub-page .hc-trust-card {
  padding: 16px 22px 22px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.help-hub-page .hc-trust-card:hover {
  border-color: #cbd5e1;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06);
}

.help-hub-page .hc-trust-card__title {
  margin: 0 0 7px;
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
}

.help-hub-page .hc-trust-card__desc {
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
  color: #3668e9;
}

/* Certifications & Trust — stat card label icons */
.help-hub-page.certifications-trust-page .product-hub-stat-card {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto auto;
  column-gap: 12px;
  row-gap: 8px;
  align-items: center;
  min-height: 108px;
}

.help-hub-page.certifications-trust-page .product-hub-stat-card__icon {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background-color: #f1f5f9;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  grid-column: 1;
  grid-row: 1;
  align-self: center;
}

.help-hub-page.certifications-trust-page .product-hub-stat-card__label {
  grid-column: 2;
  grid-row: 1;
  margin-bottom: 0;
  display: inline-flex;
}

.help-hub-page.certifications-trust-page .product-hub-stat-card__value,
.help-hub-page.certifications-trust-page .product-hub-stat-card strong {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
}

.help-hub-page.certifications-trust-page .product-hub-stat-card__helper {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: 0;
}

.help-hub-page.certifications-trust-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label {
  color: #047857;
}

.help-hub-page.certifications-trust-page .product-hub-stat-card__icon--core-runtime {
  background-color: rgba(22, 163, 74, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

.help-hub-page.certifications-trust-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label {
  color: #0369a1;
}

.help-hub-page.certifications-trust-page .product-hub-stat-card__icon--program-extensions {
  background-color: rgba(2, 132, 199, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83Z'/%3E%3Cpath d='m22 17.65-9.17 4.16a2 2 0 0 1-1.66 0L2 17.65'/%3E%3Cpath d='m22 12.65-9.17 4.16a2 2 0 0 1-1.66 0L2 12.65'/%3E%3C/svg%3E");
}

.help-hub-page.certifications-trust-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label {
  color: #2562ff;
}

.help-hub-page.certifications-trust-page .product-hub-stat-card__icon--active-property {
  background-color: rgba(79, 70, 229, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E");
}

.help-hub-page.certifications-trust-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label {
  color: #6d28d9;
}

.help-hub-page.certifications-trust-page .product-hub-stat-card__icon--enterprise-programs {
  background-color: rgba(124, 58, 237, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z'/%3E%3Cpath d='M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2'/%3E%3Cpath d='M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M10 6h4M10 10h4M10 14h4M10 18h4'/%3E%3C/svg%3E");
}

/* ─── Implementation Center ─── */
.help-hub-page.impl-center-page {
  gap: 0;
}

.help-hub-page.impl-center-page .product-hub-hero {
  margin-bottom: 0;
  padding: 22px 24px !important;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, rgba(255, 255, 255, 1) 48%, rgba(13, 148, 136, 0.04) 100%) !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06) !important;
}

.help-hub-page.impl-center-page .product-hub-hero__eyebrow {
  color: #4f46e5;
}

.help-hub-page.impl-center-page .product-hub-hero__main {
  align-items: flex-end;
  gap: 20px;
}

.help-hub-page.impl-center-page .product-hub-hero__actions {
  margin-top: 0;
  flex-shrink: 0;
}

.help-hub-page.impl-center-page .product-hub-hero__actions .contextual-help-link {
  font-size: 16px;
  font-weight: 600;
  color: #3668e9;
  white-space: nowrap;
}

.help-hub-page.impl-center-page .product-hub-hero__actions .contextual-help-link:hover {
  color: #4f46e5;
}

/* Implementation Center — stat cards with tinted backgrounds & right icons */
.help-hub-page.impl-center-page .product-hub-stat-grid {
  gap: 16px;
}

.help-hub-page.impl-center-page .product-hub-stat-card {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto auto;
  column-gap: 12px;
  row-gap: 8px;
  align-items: center;
  min-height: 112px;
  padding: 18px 20px 20px;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.help-hub-page.impl-center-page .product-hub-stat-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

.help-hub-page.impl-center-page .product-hub-stat-card__icon {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
}

.help-hub-page.impl-center-page .product-hub-stat-card__label {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  display: inline-flex;
  align-items: center;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.2;
}

.help-hub-page.impl-center-page .product-hub-stat-card__value,
.help-hub-page.impl-center-page .product-hub-stat-card strong {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: #0f172a;
  word-break: break-word;
}

.help-hub-page.impl-center-page .product-hub-stat-card__helper {
  grid-column: 1 / -1;
  grid-row: 3;
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
  color: #3668e9;
}

/* Card 1 — Script Installed */

.help-hub-page.impl-center-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label {
  color: #047857;
}

.help-hub-page.impl-center-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__icon--script-installed {
  background-color: #d1fae5;
  border: 1px solid #a7f3d0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%2310b981' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='16 18 22 12 16 6'/%3E%3Cpolyline points='8 6 2 12 8 18'/%3E%3C/svg%3E");
}


.help-hub-page.impl-center-page .product-hub-stat-card:nth-child(1).product-hub-stat-card--warn .product-hub-stat-card__label {
  color: #b45309;
}

.help-hub-page.impl-center-page .product-hub-stat-card:nth-child(1).product-hub-stat-card--warn .product-hub-stat-card__icon--script-installed {
  background-color: #fef3c7;
  border-color: #fde68a;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23f59e0b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='16 18 22 12 16 6'/%3E%3Cpolyline points='8 6 2 12 8 18'/%3E%3C/svg%3E");
}

/* Card 2 — Environment */
.help-hub-page.impl-center-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label {
  color: #0369a1;
}

.help-hub-page.impl-center-page .product-hub-stat-card__icon--environment {
  background-color: #bae6fd;
  border: 1px solid #7dd3fc;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='8' x='2' y='2' rx='2' ry='2'/%3E%3Crect width='20' height='8' x='2' y='14' rx='2' ry='2'/%3E%3Cpath d='M6 6h.01M6 18h.01'/%3E%3C/svg%3E");
}

/* Card 3 — Active Domain */

.help-hub-page.impl-center-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label {
  color: #2562ff;
}

.help-hub-page.impl-center-page .product-hub-stat-card__icon--active-domain {
  background-color: #e0e7ff;
  border: 1px solid #c7d2fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E");
}

/* Card 4 — API Status */
.help-hub-page.impl-center-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label {
  color: #047857;
}

.help-hub-page.impl-center-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__icon--api-status {
  background-color: #d1fae5;
  border: 1px solid #a7f3d0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%2310b981' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z'/%3E%3Cpath d='m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2z'/%3E%3C/svg%3E");
}

.help-hub-page.impl-center-page .product-hub-stat-card:nth-child(4).product-hub-stat-card--warn {
  border-top-color: #f59e0b;
  background: linear-gradient(180deg, #fffbeb 0%, #fff 100%);
}

.help-hub-page.impl-center-page .product-hub-stat-card:nth-child(4).product-hub-stat-card--warn .product-hub-stat-card__label {
  color: #b45309;
}

.help-hub-page.impl-center-page .product-hub-stat-card:nth-child(4).product-hub-stat-card--warn .product-hub-stat-card__icon--api-status {
  background-color: #fef3c7;
  border-color: #fde68a;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23f59e0b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 16.5c-1.5 1.26-2 5-2 5s3.74-.5 5-2c.71-.84.7-2.13-.09-2.91a2.18 2.18 0 0 0-2.91-.09z'/%3E%3Cpath d='m12 15-3-3a22 22 0 0 1 2-3.95A12.88 12.88 0 0 1 22 2c0 2.72-.78 7.5-6 11a22.35 22.35 0 0 1-4 2z'/%3E%3C/svg%3E");
}

.help-hub-page.impl-center-page .product-hub-section {
  overflow: hidden;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  margin-bottom: 0;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.help-hub-page.impl-center-page .product-hub-section__head {
  padding: 17px 24px 18px;
  background: #f8fafc;
}

.help-hub-page.impl-center-page .product-hub-section__title {
  font-size: 20px;
  font-weight: 700;
  color: #0f172a;
}

.help-hub-page.impl-center-page .product-hub-section__chevron {
  width: 22px;
  height: 22px;
  color: #94a3b8;
}

.help-hub-page.impl-center-page .product-hub-section.is-open .product-hub-section__chevron,
.help-hub-page.impl-center-page .product-hub-section__head:hover .product-hub-section__chevron {
  color: #4f46e5;
}

.help-hub-page.impl-center-page .product-hub-section__badge {
  font-size: 13px;
  font-weight: 600;
  padding: 5px 10px;
  border-radius: 999px;
}

.help-hub-page.impl-center-page .product-hub-section__body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 20px 24px 24px;
  font-size: 16px;
  line-height: 1.6;
  color: #334155;
}

.help-hub-page.impl-center-page .product-hub-section__body > * {
  margin: 0 !important;
}

/* Info notes — highlighted cards */
.help-hub-page.impl-center-page .product-hub-section__body .product-hub-panel-note {
  margin: 0;
  padding: 14px 18px;
  font-size: 16px;
  line-height: 1.8;
  color: #475569;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.help-hub-page.impl-center-page .product-hub-section__body .product-hub-panel-note strong {
  color: #0f172a;
  font-weight: 600;
}

.help-hub-page.impl-center-page .product-hub-section__body .product-hub-panel-note code {
  font-size: 14px;
  padding: 2px 7px;
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 6px;
}

/* Property row — highlighted */
.help-hub-page.impl-center-page .impl-property-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 16px;
  padding: 14px 18px;
  margin: 0;
  background: linear-gradient(180deg, #eef2ff 0%, #f8fafc 100%);
  border: 1px solid #c7d2fe;
  border-radius: 12px;
}

.help-hub-page.impl-center-page .impl-property-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6366f1;
}

.help-hub-page.impl-center-page .impl-property-value {
  font-size: 15px;
  font-weight: 600;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  color: #2562ff;
  word-break: break-all;
}

.help-hub-page.impl-center-page .impl-property-hint {
  flex: 1 1 100%;
  font-size: 15px;
  line-height: 1.5;
  color: #3668e9;
}

.help-hub-page.impl-center-page .impl-property-row .impl-property-hint {
  flex: 1 1 auto;
  min-width: 200px;
}

/* Environment row — aligned grid + highlighted */
.help-hub-page.impl-center-page .impl-env-row {
  display: grid;
  grid-template-columns: minmax(160px, auto) minmax(180px, 220px) 1fr;
  align-items: center;
  gap: 10px 16px;
  padding: 14px 18px;
  background: linear-gradient(180deg, #f0f9ff 0%, #f8fafc 100%);
  border: 1px solid #bae6fd;
  border-radius: 12px;
}

.help-hub-page.impl-center-page .impl-env-row .field-label {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #0369a1;
  line-height: 1.3;
}

.help-hub-page.impl-center-page .impl-env-row .cs-select {
  width: 100%;
  min-height: 44px;
  padding: 0 38px 0 14px;
  font-size: 16px;
  font-weight: 500;
  color: #0f172a;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233668e9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 16px 16px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  appearance: none;
  -webkit-appearance: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.help-hub-page.impl-center-page .impl-env-row .cs-select::-ms-expand {
  display: none;
}

.help-hub-page.impl-center-page .impl-env-row .cs-select:hover {
  border-color: #94a3b8;
}

.help-hub-page.impl-center-page .impl-env-row .cs-select:focus {
  outline: none;
  border-color: #0284c7;
  box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.15);
}

.help-hub-page.impl-center-page .impl-env-row .impl-property-hint {
  font-size: 15px;
  line-height: 1.5;
  color: #3668e9;
}

/* Install snippet field */
.help-hub-page.impl-center-page .product-hub-section__body > .field {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.help-hub-page.impl-center-page .product-hub-section__body > .field .field-label {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #3668e9;
}

.help-hub-page.impl-center-page .impl-code-block {
  width: 100%;
}

.help-hub-page.impl-center-page .impl-code-block textarea {
  display: block;
  width: 100%;
  min-height: 96px;
  max-height: 280px;
  padding: 16px 18px;
  font-size: 14px;
  line-height: 1.6;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  color: #a5f3fc;
  background: #0f172a;
  border: 1px solid #1e293b;
  border-radius: 12px;
  resize: vertical;
  box-sizing: border-box;
}

.help-hub-page.impl-center-page .impl-bullet-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
  padding: 14px 18px;
  list-style: none;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}

.help-hub-page.impl-center-page .impl-bullet-list li {
  position: relative;
  padding-left: 26px;
  font-size: 16px;
  line-height: 1.6;
  color: #475569;
}

.help-hub-page.impl-center-page .impl-bullet-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2310b981' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") no-repeat center / 14px 14px;
}

.help-hub-page.impl-center-page .impl-bullet-list li code {
  font-size: 14px;
  padding: 2px 7px;
  color: #2562ff;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

.help-hub-page.impl-center-page .impl-bullet-list li a {
  font-weight: 600;
  color: #4f46e5;
  text-decoration: none;
}

.help-hub-page.impl-center-page .impl-bullet-list li a:hover {
  text-decoration: underline;
}

@media (max-width: 768px) {
  .help-hub-page.impl-center-page .impl-env-row {
    grid-template-columns: 1fr;
  }

  .help-hub-page.impl-center-page .impl-property-row .impl-property-hint {
    flex-basis: 100%;
  }
}

.help-hub-page.impl-center-page .enterprise-panel,
.help-hub-page.impl-center-page .site-api-key-panel {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 14px 21px 22px;
  margin: 0;
  background: linear-gradient(180deg, #eef2ff 0%, #fff 100%);
  border: 1px solid #c7d2fe;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.help-hub-page.impl-center-page .enterprise-panel__title {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
}

.help-hub-page.impl-center-page .enterprise-panel__intro {
  margin: 4px 0 14px;
  font-size: 16px;
  line-height: 1.6;
  color: #3668e9;
}

.consent-premium-nav-grid.impl-integrations-grid {
  padding-top: 0 !important;
}
/* API key meta — aligned rows */
.help-hub-page.impl-center-page .site-api-key-panel__meta {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
  padding: 14px 18px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.help-hub-page.impl-center-page .site-api-key-panel__row {
  display: grid;
  grid-template-columns: minmax(120px, 150px) 1fr;
  align-items: baseline;
  gap: 8px 16px;
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
}

.help-hub-page.impl-center-page .site-api-key-panel__label {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3668e9;
  min-width: 0;
}

.help-hub-page.impl-center-page .site-api-key-panel__value,
.help-hub-page.impl-center-page .site-api-key-panel__row code {
  font-size: 15px;
  font-weight: 600;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  color: #2562ff;
  word-break: break-all;
}

.help-hub-page.impl-center-page .site-api-key-panel__row > span:not(.site-api-key-panel__label) {
  font-size: 15px;
  color: #334155;
}

.help-hub-page.impl-center-page .site-api-key-panel__meta .enterprise-panel__muted {
  margin: 0;
  padding-top: 4px;
  font-size: 15px;
  line-height: 1.6;
  color: #3668e9;
  border-top: 1px solid #eaeaea;
}

.help-hub-page.impl-center-page .site-api-key-panel__reveal {
  margin: 15px 0 0 0;
  padding: 14px 18px;
  background: linear-gradient(180deg, #fffbeb 0%, #fff 100%);
  border: 1px solid #fde68a;
  border-radius: 12px;
}

.help-hub-page.impl-center-page .site-api-key-panel__warn {
  margin: 0 0 10px;
  font-size: 15px;
  line-height: 1.5;
  color: #92400e;
}

.help-hub-page.impl-center-page .site-api-key-panel__full {
  display: block;
  margin: 0 0 12px;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.6;
  color: #0f172a;
  background: #fff;
  border: 1px solid #fde68a;
  border-radius: 10px;
  word-break: break-all;
}

.help-hub-page.impl-center-page .site-api-key-panel__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0;
}

/* API key action buttons — tinted with icons */
.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--copy,
.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--dismiss,
.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--rotate {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  margin: 0 !important;
  padding: 0 18px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.2;
  border-radius: 12px !important;
  border-style: solid !important;
  border-width: 1.5px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--copy::after,
.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--dismiss::after,
.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--rotate::after {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--copy {
  color: #047857 !important;
  background: #ecfdf5 !important;
  border-color: #a7f3d0 !important;
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--copy::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2' ry='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E");
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--copy:hover {
  color: #065f46 !important;
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.12);
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--copy.is-copied {
  color: #047857 !important;
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--copy.is-copied::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--dismiss {
  color: #475569 !important;
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--dismiss::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E");
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--dismiss:hover {
  color: #334155 !important;
  background: #f1f5f9 !important;
  border-color: #94a3b8 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--rotate {
  color: #2562ff !important;
  background: #eef2ff !important;
  border-color: #c7d2fe !important;
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--rotate::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--rotate:hover:not(:disabled) {
  color: #3730a3 !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(79, 70, 229, 0.12);
}

.help-hub-page.impl-center-page .site-api-key-panel .impl-api-key-btn--rotate:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
}

.help-hub-page.impl-center-page .site-api-key-panel__actions .enterprise-panel__muted {
  font-size: 15px;
  line-height: 1.5;
  color: #3668e9;
}

.help-hub-page.impl-center-page .site-api-key-panel .enterprise-panel__error {
  margin: 0;
  padding: 12px 14px;
  font-size: 15px;
  line-height: 1.5;
  color: #b91c1c;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 10px;
}

.help-hub-page.impl-center-page .site-api-key-panel .cs-inline-loading {
  margin: 0;
  font-size: 15px;
  color: #3668e9;
}

@media (max-width: 640px) {
  .help-hub-page.impl-center-page .site-api-key-panel__row {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

.help-hub-page.impl-center-page .cs-readiness-badge {
  font-size: 14px;
  padding: 6px 14px;
}

.help-hub-page.impl-center-page .consent-premium-nav-grid {
  gap: 14px;
}

.help-hub-page.impl-center-page .consent-premium-nav-card {
  padding: 18px 20px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.help-hub-page.impl-center-page .consent-premium-nav-card:hover {
  border-color: #cbd5e1;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.help-hub-page.impl-center-page .consent-premium-nav-card__title {
  font-size: 17px;
  font-weight: 700;
  color: #0f172a;
}

.help-hub-page.impl-center-page .consent-premium-nav-card__desc {
  font-size: 15px;
  line-height: 1.55;
  color: #3668e9;
}

.help-hub-page.impl-center-page .consent-premium-nav-card__cta {
  font-size: 15px;
  font-weight: 600;
}

.help-hub-page.impl-center-page .btn,
.help-hub-page.impl-center-page .btn-rotate {
  min-height: 46px;
  font-size: 16px;
}

.help-hub-page.impl-center-page .cs-input,
.help-hub-page.impl-center-page .cs-select {
  min-height: 46px;
  font-size: 16px;
}

/* ─── Policy Tools ─── */
.reports-hub-page.policy-generator-page .hc-policy-cards {
  gap: 14px;
  margin-bottom: 0;
}

.reports-hub-page.policy-generator-page .hc-policy-type-card {
  padding: 18px 21px 16px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.reports-hub-page.policy-generator-page .hc-policy-type-card:hover {
  border-color: #cbd5e1;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06);
}

.reports-hub-page.policy-generator-page .hc-policy-type-card strong {
  margin-bottom: 6px;
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
}

.reports-hub-page.policy-generator-page .hc-policy-type-card span {
  font-size: 15px;
  line-height: 1.5;
  color: #3668e9;
}

.reports-hub-page.policy-generator-page .policy-gen-toolbar.card {
  padding: 20px 22px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  margin-bottom: 0;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.reports-hub-page.policy-generator-page .policy-gen-toolbar-row {
  gap: 16px 22px;
}

.reports-hub-page.policy-generator-page .field.policy-gen-field label,
.reports-hub-page.policy-generator-page .policy-gen-field > span {
  margin-bottom: 4px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #3668e9;
}

.reports-hub-page.policy-generator-page .policy-gen-field .cs-input,
.reports-hub-page.policy-generator-page .policy-gen-field .cs-select {
  min-height: 46px;
  font-size: 16px;
}

.reports-hub-page.policy-generator-page .policy-gen-actions .btn {
  min-height: 46px;
  font-size: 16px;
}

.reports-hub-page.policy-generator-page .policy-outdated-badge {
  padding: 5px 14px;
  font-size: 13px;
}

.reports-hub-page.policy-generator-page .policy-gen-meta {
  font-size: 15px;
}

.reports-hub-page.policy-generator-page .policy-gen-loading {
  font-size: 16px;
}

.reports-hub-page.policy-generator-page .policy-gen-error {
  font-size: 16px;
}

.reports-hub-page.policy-generator-page .policy-gen-empty {
  padding: 48px 20px;
  font-size: 16px;
  line-height: 1.55;
  text-align: center;
}

.reports-hub-page.policy-generator-page .policy-gen-output.card {
  padding: 0 !important;
  text-align: left;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow: 0 4px 24px rgba(15, 23, 42, 0.06);
}

/* Preview tabs — flush to content, no dead space below bar */
.reports-hub-page.policy-generator-page .policy-gen-tabs {
  display: flex;
  gap: 0;
  margin: 0;
  padding: 0 !important;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.reports-hub-page.policy-generator-page .policy-gen-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 12px 18px !important;
  font-size: 16px !important;
  font-weight: 600;
  color: #3668e9;
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
}

.reports-hub-page.policy-generator-page .policy-gen-tab::before {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  opacity: 0.75;
}

.reports-hub-page.policy-generator-page .policy-gen-tab--cookie::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2a10 10 0 1 0 10 10 4 4 0 0 1-5-5 4 4 0 0 1-5-5'/%3E%3Cpath d='M8.5 8.5v.01M16 15.5v.01M12 12v.01M7 8v.01M17 16v.01'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .policy-gen-tab--privacy::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4M10 9H8M16 13H8M16 17H8'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .policy-gen-tab.is-active {
  color: #0f172a;
  background: #fff;
  border-bottom-color: #6366f1;
}

.reports-hub-page.policy-generator-page .policy-gen-tab--cookie.is-active {
  color: #b45309;
  border-bottom-color: #d97706;
}

.reports-hub-page.policy-generator-page .policy-gen-tab--cookie.is-active::before,
.reports-hub-page.policy-generator-page .policy-gen-tab--privacy.is-active::before {
  opacity: 1;
}

.reports-hub-page.policy-generator-page .policy-gen-tab--privacy.is-active {
  color: #2562ff;
  border-bottom-color: #6366f1;
}

/* Policy preview — full width, no side gutters */
.reports-hub-page.policy-generator-page .policy-doc-shell {
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  text-align: left;
  background: #fff;
}

.reports-hub-page.policy-generator-page .policy-doc-iframe {
  display: block;
  width: 100%;
  min-height: 240px;
  height: auto;
  margin: 0;
  padding: 0;
  border: none;
  background: #fff;
  vertical-align: top;
  overflow: hidden;
}

/* Policy type cards — titled highlights with icons */
.reports-hub-page.policy-generator-page .hc-policy-type-card strong {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.25;
}

.reports-hub-page.policy-generator-page .hc-policy-type-card strong::before {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
}
.reports-hub-page.policy-generator-page .hc-policy-type-card--cookie strong::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2a10 10 0 1 0 10 10 4 4 0 0 1-5-5 4 4 0 0 1-5-5'/%3E%3Cpath d='M8.5 8.5v.01M16 15.5v.01M12 12v.01M7 8v.01M17 16v.01'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .hc-policy-type-card--privacy strong::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4M10 9H8M16 13H8M16 17H8'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .hc-policy-type-card--regional strong::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E");
}

/* Website field highlight */
.reports-hub-page.policy-generator-page .policy-gen-toolbar-row > .policy-gen-field:first-child {
  flex: 1 1 100%;
  padding: 16px 18px;
  border: 1px solid #c7d2fe;
  border-radius: 8px;
}

.reports-hub-page.policy-generator-page .policy-gen-toolbar-row > .policy-gen-field:first-child .websites-site-label {
  color: #2562ff;
}

.reports-hub-page.policy-generator-page .policy-gen-toolbar-row > .policy-gen-field:first-child .websites-site-label::before {
  content: "";
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E") center / 16px no-repeat;
}

.reports-hub-page.policy-generator-page .policy-gen-toolbar-row > .policy-gen-field:first-child > div:first-of-type {
  margin-top: 0 !important;
  padding: 12px 14px;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.45;
  color: #312e81 !important;
  word-break: break-all;
  background: linear-gradient(180deg, #fff 0%, #f5f3ff 100%);
  border: 1.5px solid #a5b4fc;
  border-radius: 10px;
}

.reports-hub-page.policy-generator-page .policy-gen-toolbar-row > .policy-gen-field:first-child > div:last-of-type {
  margin-top: 8px !important;
  font-size: 16px !important;
  color: #3668e9 !important;
}

/* Region & language selects — single right chevron */
.reports-hub-page.policy-generator-page .policy-gen-field select {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  box-sizing: border-box;
  width: 100%;
  min-height: 46px;
  height: 46px;
  padding: 0 38px 0 14px !important;
  font-size: 16px !important;
  font-weight: 500;
  line-height: 1.4;
  color: #0f172a;
  cursor: pointer;
  background-color: #fff !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 18px 18px !important;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.reports-hub-page.policy-generator-page .policy-gen-field select::-ms-expand {
  display: none;
}

.reports-hub-page.policy-generator-page .policy-gen-field select:hover {
  border-color: #94a3b8;
}

.reports-hub-page.policy-generator-page .policy-gen-field select:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

/* Action buttons — light tints + right icons */
.reports-hub-page.policy-generator-page .policy-gen-actions {
  gap: 10px;
  margin-top: 18px;
}

.reports-hub-page.policy-generator-page .policy-gen-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 46px;
  padding: 0 16px 0 18px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.2;
  border-radius: 12px !important;
  border-width: 1.5px !important;
  border-style: solid !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.12s ease;
}

.reports-hub-page.policy-generator-page .policy-gen-btn::after {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 18px;
}

.reports-hub-page.policy-generator-page .policy-gen-btn:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 2px 8px rgba(15, 23, 42, 0.08);
}

.reports-hub-page.policy-generator-page .policy-gen-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
}

.reports-hub-page.policy-generator-page .policy-gen-btn--generate {
  color: #2562ff !important;
  background: #eef2ff !important;
  border-color: #c7d2fe !important;
}

.reports-hub-page.policy-generator-page .policy-gen-btn--generate::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A6 6 0 0 0 6 8c0 1 .2 2.2 1.5 3.5.7.7 1.3 1.5 1.5 2.5'/%3E%3Cpath d='M9 18h6'/%3E%3Cpath d='M10 22h4'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .policy-gen-btn--generate:hover:not(:disabled) {
  color: #3730a3 !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
}

.reports-hub-page.policy-generator-page .policy-gen-btn--pdf {
  color: #b91c1c !important;
  background: #fef2f2 !important;
  border-color: #fecaca !important;
}

.reports-hub-page.policy-generator-page .policy-gen-btn--pdf::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V3'/%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .policy-gen-btn--pdf:hover:not(:disabled) {
  color: #991b1b !important;
  background: #fee2e2 !important;
  border-color: #fca5a5 !important;
}

.reports-hub-page.policy-generator-page .policy-gen-btn--copy {
  color: #1d4ed8 !important;
  background: #eff6ff !important;
  border-color: #bfdbfe !important;
}

.reports-hub-page.policy-generator-page .policy-gen-btn--copy::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%231d4ed8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2' ry='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .policy-gen-btn--copy:hover:not(:disabled) {
  color: #1e40af !important;
  background: #dbeafe !important;
  border-color: #93c5fd !important;
}

.reports-hub-page.policy-generator-page .policy-gen-btn--publish {
  color: #047857 !important;
  background: #ecfdf5 !important;
  border-color: #a7f3d0 !important;
}

.reports-hub-page.policy-generator-page .policy-gen-btn--publish::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v12'/%3E%3Cpath d='m17 8-5-5-5 5'/%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3C/svg%3E");
}

.reports-hub-page.policy-generator-page .policy-gen-btn--publish:hover:not(:disabled) {
  color: #065f46 !important;
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
}

/* Last generated timestamp */
.reports-hub-page.policy-generator-page .policy-gen-meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding: 10px 14px;
  font-size: 15px;
  font-weight: 500;
  color: #475569;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
}

.reports-hub-page.policy-generator-page .policy-gen-meta::before {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%233668e9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E") center / 18px no-repeat;
}

/* ─── Compliance Reports ─── */
.compliance-report-standalone.reports-hub-page .cr-breadcrumb {
  font-size: 15px;
}

.compliance-report-standalone.reports-hub-page .cr-page-title {
  gap: 14px;
  margin-top: 10px;
  font-size: clamp(26px, 2.2vw, 34px);
}

.compliance-report-standalone.reports-hub-page .cr-page-title::before {
  width: 44px;
  height: 44px;
}
.compliance-report-standalone.reports-hub-page .cr-stat-sub {
  font-size: 16px;
}
.compliance-report-standalone.reports-hub-page .cr-stat-tip {
  font-size: 14px;
}
.compliance-report-standalone.reports-hub-page .cr-stat-tip {
  margin-bottom: 6px;
}
.compliance-report-standalone.reports-hub-page .cr-stat-card {
  padding: 20px 22px;
}

.compliance-report-standalone.reports-hub-page .cr-chart-card-title {
  font-size: 17px;
}

.compliance-report-standalone.reports-hub-page .cr-chart-card-sub {
  font-size: 15px;
}

.compliance-report-standalone.reports-hub-page .cr-history-title {
  font-size: 20px;
}

.compliance-report-standalone.reports-hub-page .cr-history-head {
  padding: 18px 22px;
}

.compliance-report-standalone.reports-hub-page .history-toolbar {
  padding: 16px 22px;
  gap: 14px 16px;
}

.compliance-report-standalone.reports-hub-page .cr-filter,
.compliance-report-standalone.reports-hub-page .cr-ctrl-input,
.compliance-report-standalone.reports-hub-page .history-toolbar .cr-filter {
  min-height: 46px;
  padding: 12px 16px;
}

.compliance-report-standalone.reports-hub-page .cr-mini-btn,
.compliance-report-standalone.reports-hub-page a.cr-mini-btn {
  min-height: 38px;
}

.compliance-report-standalone.reports-hub-page .cr-table {
  font-size: 16px;
}

.compliance-report-standalone.reports-hub-page .cr-table thead th {
  padding: 14px 18px;
  font-size: 14px;
}

.compliance-report-standalone.reports-hub-page .cr-table tbody td {
  padding: 14px 18px;
  font-size: 16px;
}

.compliance-report-standalone.reports-hub-page .cr-empty-title {
  font-size: 20px;
}

.compliance-report-standalone.reports-hub-page .cr-link {
  font-size: 16px;
}

.compliance-report-standalone.reports-hub-page .cr-error {
  font-size: 16px;
}

.compliance-report-standalone.reports-hub-page .cr-legend-cell {
  font-size: 15px;
}

.compliance-report-standalone.reports-hub-page .cr-pagination {
  gap: 14px;
  padding: 0px 30px 0;
}

.compliance-report-standalone.reports-hub-page .cr-page-btn {
  min-height: 38px;
  min-width: 38px;
  font-size: 15px;
}

.compliance-report-standalone.reports-hub-page .cr-acc-body-inner {
  padding: 0 22px 22px;
}

/* ─── View Report (Full Compliance) ─── */
.cfr-page.reports-hub-page {
  padding: 28px 24px 52px;
}

.cfr-page.reports-hub-page .cfr-breadcrumb {
  font-size: 15px;
}
.cfr-page.reports-hub-page {
  padding: 0;
  background-color: transparent;
}
.cfr-page.reports-hub-page .cfr-title {
  gap: 14px;
  font-size: clamp(26px, 2.2vw, 34px);
}

.cfr-page.reports-hub-page .cfr-title::before {
  width: 44px;
  height: 44px;
}

.cfr-page.reports-hub-page .cfr-meta {
  font-size: 16px;
}

.cfr-page.reports-hub-page .cfr-card {
  padding: 18px 20px;
}

.cfr-page.reports-hub-page .cfr-card-value {
  font-size: 1.45rem;
}

.cfr-page.reports-hub-page .cfr-card-label {
  font-size: 13px;
}

.cfr-page.reports-hub-page .cfr-toolbar {
  padding: 16px 18px;
  gap: 14px;
}

.cfr-page.reports-hub-page .cfr-search,
.cfr-page.reports-hub-page .cfr-select,
.cfr-page.reports-hub-page .cr-filter {
  min-height: 46px;
  font-size: 16px;
}

.cfr-page.reports-hub-page .cfr-toggle {
  min-height: 42px;
  padding: 9px 16px;
  font-size: 15px;
}

.cfr-page.reports-hub-page .btn.secondary,
.cfr-page.reports-hub-page .cfr-preset-clear,
.cfr-page.reports-hub-page .cfr-filter-toggle {
  min-height: 46px;
  font-size: 16px;
}

.cfr-page.reports-hub-page .cfr-table {
  font-size: 16px;
}

.cfr-page.reports-hub-page .cfr-table thead th {
  padding: 14px 18px;
  font-size: 14px;
}

.cfr-page.reports-hub-page .cfr-table tbody td {
  padding: 14px 18px;
  font-size: 16px;
}

.cfr-page.reports-hub-page .cfr-group-row td {
  padding: 14px 18px;
  font-size: 15px;
}

.cfr-page.reports-hub-page .cfr-url {
  font-size: 14px;
}

.cfr-page.reports-hub-page .cfr-cat-pill,
.cfr-page.reports-hub-page .cfr-risk {
  font-size: 13px;
  padding: 4px 10px;
}

.cfr-page.reports-hub-page .cr-page-btn {
  min-height: 38px;
  min-width: 38px;
  font-size: 15px;
}

.cfr-page.reports-hub-page .cfr-preset-banner {
  padding: 14px 18px;
  font-size: 16px;
}

.cfr-page.reports-hub-page .cr-pagination {
  gap: 14px;
  padding: 14px 0;
}

/* Shared buttons within hub pages */
.help-hub-page .btn,
.reports-hub-page .btn {
    min-height: 38px;
    font-size: 15px;
}

.help-hub-page .btn.secondary,
.reports-hub-page .btn.secondary {
  font-size: 16px;
}

.help-hub-page .field label,
.reports-hub-page .field label {
  font-size: 14px;
}

.help-hub-page .cs-input,
.help-hub-page .cs-select,
.reports-hub-page .cs-input,
.reports-hub-page .cs-select {
  min-height: 46px;
  font-size: 16px;
}

/* Responsive */
@media (max-width: 900px) {
  .help-hub-page.hc-premium-page .hc-guide-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .help-hub-page.impl-center-page .consent-premium-nav-grid {
    grid-template-columns: 1fr;
  }

  .cfr-page.reports-hub-page .cfr-top {
    flex-direction: column;
  }
}

@media (max-width: 640px) {
  .help-hub-page .product-hub-hero__title,
  .reports-hub-page.policy-generator-page .product-hub-hero__title,
  .help-hub-page.impl-center-page .product-hub-hero__title {
    font-size: 24px;
  }

  .help-hub-page .product-hub-hero__subtitle,
  .reports-hub-page.policy-generator-page .product-hub-hero__subtitle,
  .help-hub-page.impl-center-page .product-hub-hero__subtitle {
    font-size: 16px;
  }

  .compliance-report-standalone.reports-hub-page .compliance-report-inner,
  .cfr-page.reports-hub-page {
    padding: 22px 16px 36px;
  }

  .help-hub-page.hc-premium-page .hc-guide-grid,
  .help-hub-page.hc-premium-page .hc-workflow-grid,
  .help-hub-page .hc-trust-grid {
    grid-template-columns: 1fr;
  }

  .reports-hub-page.policy-generator-page .hc-policy-cards {
    grid-template-columns: 1fr;
  }

  .help-hub-page.impl-center-page .enterprise-panel,
  .help-hub-page.impl-center-page .site-api-key-panel,
  .reports-hub-page.policy-generator-page .policy-gen-toolbar.card {
    padding: 18px 16px;
  }
}

/* ─── Full Compliance Report — header actions & meta polish ─── */
.cfr-page.reports-hub-page .cfr-breadcrumb-bar {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin: 0 0 12px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;
  color: #3668e9;
}

.cfr-page.reports-hub-page .cfr-breadcrumb-bar::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233668e9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z'/%3E%3Cpolyline points='9 22 9 12 15 12 15 22'/%3E%3C/svg%3E") center / 16px no-repeat;
}

.cfr-page.reports-hub-page .cfr-breadcrumb-bar a {
  color: #2563eb;
  font-weight: 600;
  text-decoration: none;
  transition: color 0.15s ease;
}

.cfr-page.reports-hub-page .cfr-breadcrumb-bar a:hover {
  color: #1d4ed8;
  text-decoration: underline;
}

.cfr-page.reports-hub-page .cfr-breadcrumb-bar span {
  color: #334155;
  font-weight: 600;
}

.cfr-page.reports-hub-page .cfr-meta-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 4px;
  max-width: 100%;
  margin-top: 12px;
  padding: 12px 16px;
  font-size: 16px;
  line-height: 1.55;
  color: #334155;
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.04);
}

.cfr-page.reports-hub-page .cfr-meta-bar::before {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-right: 6px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E") center / 18px no-repeat;
}

.cfr-page.reports-hub-page .cfr-meta-bar strong {
  color: #3668e9;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.cfr-page.reports-hub-page .cfr-actions {
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.cfr-page.reports-hub-page .cfr-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 46px;
  padding: 0 16px 0 18px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  border-radius: 12px;
  border-width: 1.5px;
  border-style: solid;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.12s ease;
}

.cfr-page.reports-hub-page .cfr-action-btn::after {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 18px;
}

.cfr-page.reports-hub-page .cfr-action-btn:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 2px 8px rgba(15, 23, 42, 0.08);
}

.cfr-page.reports-hub-page .cfr-action-btn:active:not(:disabled) {
  transform: translateY(0);
}

.cfr-page.reports-hub-page .cfr-action-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.cfr-page.reports-hub-page .cfr-action-btn--csv {
  color: #047857;
  background: #ecfdf5;
  border-color: #6ee7b7;
}

.cfr-page.reports-hub-page .cfr-action-btn--csv::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Cpath d='M3 9h18M3 15h18M9 3v18M15 3v18'/%3E%3C/svg%3E");
}

.cfr-page.reports-hub-page .cfr-action-btn--csv:hover:not(:disabled) {
  color: #065f46;
  background: #d1fae5;
  border-color: #34d399;
}

.cfr-page.reports-hub-page .cfr-action-btn--pdf {
  color: #b91c1c;
  background: #fef2f2;
  border-color: #fecaca;
}

.cfr-page.reports-hub-page .cfr-action-btn--pdf::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4M10 9H8M16 13H8M16 17H8'/%3E%3C/svg%3E");
}

.cfr-page.reports-hub-page .cfr-action-btn--pdf:hover:not(:disabled) {
  color: #991b1b;
  background: #fee2e2;
  border-color: #fca5a5;
}

.cfr-page.reports-hub-page .cfr-action-btn--back {
  color: #1d4ed8;
  background: #eff6ff;
  border-color: #bfdbfe;
  text-decoration: none;
}

.cfr-page.reports-hub-page .cfr-action-btn--back::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%231d4ed8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 19-7-7 7-7'/%3E%3Cpath d='M19 12H5'/%3E%3C/svg%3E");
}

.cfr-page.reports-hub-page .cfr-action-btn--back:hover {
  color: #1e40af;
  background: #dbeafe;
  border-color: #93c5fd;
}

.cfr-page.reports-hub-page .cfr-pagination .cr-pagination-meta,
.cfr-page.reports-hub-page .cfr-pagination-range {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  color: #1e40af;
  white-space: nowrap;
  background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
  border: 1px solid #bfdbfe;
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.cfr-page.reports-hub-page .cfr-pagination .cr-pagination-meta::before,
.cfr-page.reports-hub-page .cfr-pagination-range::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231d4ed8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18'/%3E%3Cpath d='m19 9-5 5-4-4-3 3'/%3E%3C/svg%3E") center / 16px no-repeat;
}

.cfr-page.reports-hub-page .cfr-pagination .cr-pagination-right {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

/* Toolbar — Filters toggle */
.cfr-page.reports-hub-page .cfr-filter-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-shrink: 0;
  min-height: 46px;
  padding: 0 16px 0 18px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  color: #6d28d9;
  background: linear-gradient(180deg, #f5f3ff 0%, #ede9fe 100%);
  border: 1.5px solid #c4b5fd;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  cursor: pointer;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.12s ease;
}

.cfr-page.reports-hub-page .cfr-filter-toggle::after {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3'/%3E%3C/svg%3E") center / 18px no-repeat;
}

.cfr-page.reports-hub-page .cfr-filter-toggle:hover {
  color: #5b21b6;
  background: linear-gradient(180deg, #ede9fe 0%, #ddd6fe 100%);
  border-color: #a78bfa;
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 2px 8px rgba(124, 58, 237, 0.15);
}

.cfr-page.reports-hub-page .cfr-filter-toggle[aria-expanded="true"] {
  color: #fff;
  background: linear-gradient(180deg, #8b5cf6 0%, #7c3aed 100%);
  border-color: #6d28d9;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.2),
    0 2px 10px rgba(124, 58, 237, 0.35);
}

.cfr-page.reports-hub-page .cfr-filter-toggle[aria-expanded="true"]::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='22 3 2 3 10 12.46 10 19 14 21 14 12.46 22 3'/%3E%3C/svg%3E");
}

.cfr-page.reports-hub-page .cfr-filter-toggle:focus-visible {
  outline: none;
  box-shadow:
    0 0 0 3px rgba(124, 58, 237, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.85);
}

.cfr-page.reports-hub-page .cfr-toolbar-row1 {
  align-items: stretch;
  gap: 12px;
}

.cfr-page.reports-hub-page .cfr-toolbar-row1 .cfr-search {
  flex: 1;
  min-width: 0;
}

/* Category summary stat cards — icons & tinted backgrounds */
.cfr-page.reports-hub-page .cfr-cards {
  gap: 14px;
  margin-bottom: 22px;
}

.cfr-page.reports-hub-page .cfr-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  min-height: 96px;
  padding: 18px 56px 18px 20px;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.04);
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.15s ease;
}

.cfr-page.reports-hub-page .cfr-card::after {
  content: "";
  position: absolute;
  top: 14px;
  right: 14px;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}

.cfr-page.reports-hub-page .cfr-card--clickable:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.1);
}

.cfr-page.reports-hub-page .cfr-card-value {
  font-size: 1.55rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}

.cfr-page.reports-hub-page .cfr-card-label {
  margin-top: 0;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.cfr-page.reports-hub-page .cfr-card--total {
  border-color: #c7d2fe;
}

.cfr-page.reports-hub-page .cfr-card--total::after {
  background-color: rgba(99, 102, 241, 0.14);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12.83 2.18a2 2 0 0 0-1.66 0L2.6 6.08a1 1 0 0 0 0 1.83l8.58 3.91a2 2 0 0 0 1.66 0l8.58-3.9a1 1 0 0 0 0-1.83Z'/%3E%3Cpath d='m22 12.65-9.17 4.16a2 2 0 0 1-1.66 0L2 12.65'/%3E%3Cpath d='m22 17.65-9.17 4.16a2 2 0 0 1-1.66 0L2 17.65'/%3E%3C/svg%3E");
}

.cfr-page.reports-hub-page .cfr-card--total .cfr-card-value {
  color: #312e81;
}

.cfr-page.reports-hub-page .cfr-card--total .cfr-card-label {
  color: #6366f1;
}

.cfr-page.reports-hub-page .cfr-card--analytics {
  border-color: #fde68a;
}

.cfr-page.reports-hub-page .cfr-card--analytics::after {
  background-color: rgba(245, 158, 11, 0.14);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18'/%3E%3Cpath d='M18 17V9'/%3E%3Cpath d='M13 17V5'/%3E%3Cpath d='M8 17v-3'/%3E%3C/svg%3E");
}

.cfr-page.reports-hub-page .cfr-card--analytics .cfr-card-value {
  color: #b45309;
}

.cfr-page.reports-hub-page .cfr-card--analytics .cfr-card-label {
  color: #d97706;
}

.cfr-page.reports-hub-page .cfr-card--marketing {
  border-color: #fecaca;
}

.cfr-page.reports-hub-page .cfr-card--marketing::after {
  background-color: rgba(239, 68, 68, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23dc2626' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 11 18-5v12L3 13v-2z'/%3E%3Cpath d='M11.6 16.8a3 3 0 1 1-5.8-1.6'/%3E%3C/svg%3E");
}

.cfr-page.reports-hub-page .cfr-card--marketing .cfr-card-value {
  color: #b91c1c;
}

.cfr-page.reports-hub-page .cfr-card--marketing .cfr-card-label {
  color: #dc2626;
}

.cfr-page.reports-hub-page .cfr-card--preferences {
  border-color: #e9d5ff;
}

.cfr-page.reports-hub-page .cfr-card--preferences::after {
  background-color: rgba(168, 85, 247, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%239333ea' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='4' x2='4' y1='21' y2='14'/%3E%3Cline x1='4' x2='4' y1='10' y2='3'/%3E%3Cline x1='12' x2='12' y1='21' y2='12'/%3E%3Cline x1='12' x2='12' y1='8' y2='3'/%3E%3Cline x1='20' x2='20' y1='21' y2='16'/%3E%3Cline x1='20' x2='20' y1='12' y2='3'/%3E%3Cline x1='2' x2='6' y1='14' y2='14'/%3E%3Cline x1='10' x2='14' y1='8' y2='8'/%3E%3Cline x1='18' x2='22' y1='16' y2='16'/%3E%3C/svg%3E");
}

.cfr-page.reports-hub-page .cfr-card--preferences .cfr-card-value {
  color: #6b21a8;
}

.cfr-page.reports-hub-page .cfr-card--preferences .cfr-card-label {
  color: #9333ea;
}

.cfr-page.reports-hub-page .cfr-card--necessary {
  border-color: #bbf7d0;
}

.cfr-page.reports-hub-page .cfr-card--necessary::after {
  background-color: rgba(34, 197, 94, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

.cfr-page.reports-hub-page .cfr-card--necessary .cfr-card-value {
  color: #15803d;
}

.cfr-page.reports-hub-page .cfr-card--necessary .cfr-card-label {
  color: #16a34a;
}

.cfr-page.reports-hub-page .cfr-card--unclassified {
  border-color: #e2e8f0;
}

.cfr-page.reports-hub-page .cfr-card--unclassified::after {
  background-color: rgba(100, 116, 139, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%233668e9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}

.cfr-page.reports-hub-page .cfr-card--unclassified .cfr-card-value {
  color: #475569;
}

.cfr-page.reports-hub-page .cfr-card--unclassified .cfr-card-label {
  color: #3668e9;
}

@media (max-width: 900px) {
  .cfr-page.reports-hub-page .cfr-actions {
    justify-content: flex-start;
    width: 100%;
  }

  .cfr-page.reports-hub-page .cfr-action-btn {
    flex: 1 1 auto;
    min-width: 160px;
  }
}

@media (max-width: 640px) {
  .cfr-page.reports-hub-page .cfr-breadcrumb-bar {
    border-radius: 12px;
  }

  .cfr-page.reports-hub-page .cfr-meta-bar {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }

  .cfr-page.reports-hub-page .cfr-action-btn {
    width: 100%;
    min-width: 0;
  }

  .cfr-page.reports-hub-page .cfr-pagination .cr-pagination-meta,
  .cfr-page.reports-hub-page .cfr-pagination-range {
    width: 100%;
    justify-content: center;
    white-space: normal;
    text-align: center;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   SCHEDULED REPORTS — stat cards & schedule panel highlights
   ═══════════════════════════════════════════════════════════════════════════ */

.scheduled-reports-page .product-hub-stat-grid {
  gap: 16px;
}

.scheduled-reports-page .product-hub-stat-card {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto auto;
  column-gap: 12px;
  row-gap: 8px;
  align-items: center;
  min-height: 108px;
  padding: 20px 22px;
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.scheduled-reports-page .product-hub-stat-card:hover {
  border-color: #cbd5e1;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
  transform: translateY(-1px);
}

.scheduled-reports-page .product-hub-stat-card__icon {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background-color: #f1f5f9;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
  grid-column: 1;
  grid-row: 1;
  align-self: center;
}

.scheduled-reports-page .product-hub-stat-card__label {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  display: flex;
  align-items: center;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.2;
}

.scheduled-reports-page .product-hub-stat-card__value,
.scheduled-reports-page .product-hub-stat-card strong {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: #0f172a;
}

.scheduled-reports-page .product-hub-stat-card__helper {
  grid-column: 1 / -1;
  grid-row: 3;
  margin: 0;
  font-size: 15px;
  line-height: 1.5;
  color: #3668e9;
}

/* Stat card accents */

.scheduled-reports-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label {
  color: #0e7490;
}

.scheduled-reports-page .product-hub-stat-card__icon--delivery {
  background-color: rgba(8, 145, 178, 0.14);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%230891b2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='16' x='2' y='4' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E");
}


.scheduled-reports-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label {
  color: #4f46e5;
}

.scheduled-reports-page .product-hub-stat-card__icon--report-types {
  background-color: rgba(99, 102, 241, 0.14);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4M10 9H8M16 13H8M16 17H8'/%3E%3C/svg%3E");
}

.scheduled-reports-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label {
  color: #15803d;
}

.scheduled-reports-page .product-hub-stat-card--warn {
  border-top-color: #f59e0b;
  background: linear-gradient(180deg, #fffbeb 0%, #fff 100%);
}

.scheduled-reports-page .product-hub-stat-card--warn .product-hub-stat-card__label {
  color: #d97706;
}

.scheduled-reports-page .product-hub-stat-card__icon--plan {
  background-color: rgba(22, 163, 74, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2316a34a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

.scheduled-reports-page .product-hub-stat-card--warn .product-hub-stat-card__icon--plan {
  background-color: rgba(245, 158, 11, 0.14);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10'/%3E%3Cpath d='M12 8v4M12 16h.01'/%3E%3C/svg%3E");
}

.scheduled-reports-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label {
  color: #6d28d9;
}

.scheduled-reports-page .product-hub-stat-card__icon--property {
  background-color: rgba(124, 58, 237, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 4.993-5.539 10.193-7.399 11.799a1 1 0 0 1-1.202 0C9.539 20.193 4 14.993 4 10a8 8 0 0 1 16 0'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
}

/* Main schedule panel */
.product-hub-page.scheduled-reports-page .prem-history-card.scan-automation-card {
  padding: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid #bae6fd;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 4px 24px rgba(8, 145, 178, 0.1);
}

.product-hub-page.scheduled-reports-page .prem-history-card__head.cc-section-head {
  margin: 0;
  padding: 18px 24px;
  background: linear-gradient(180deg, #ecfeff 0%, #f0fdfa 100%);
  border-bottom: 1px solid #bae6fd;
}

.product-hub-page.scheduled-reports-page .prem-history-card__title {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: capitalize;
  color: #0e7490;
  display: flex;
  align-items: center;
}

.product-hub-page.scheduled-reports-page .prem-history-card__title::before {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background-color: rgba(8, 145, 178, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%230891b2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E");
  border-color: #a5f3fc;
}

.scheduled-reports-page .prem-history-card.scan-automation-card .cr-table-empty,
.scheduled-reports-page .prem-history-card.scan-automation-card .cs-inline-loading.cr-table-empty {
  margin: 20px 24px 0;
  padding: 18px 20px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.55;
  color: #475569;
  text-align: center;
  background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
  border: 1.5px dashed #cbd5e1;
  border-radius: 12px;
}

.scheduled-reports-page .prem-history-card.scan-automation-card .scan-auto-toggles {
  margin: 16px 24px 0;
  padding: 0;
}

.scheduled-reports-page .prem-history-card.scan-automation-card form.scan-auto-grid {
  margin: 16px 24px 24px;
  padding: 20px 22px;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.scheduled-reports-page .scan-auto-field > span {
  margin-bottom: 8px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #3668e9;
}

/* Select fields — custom chevron (hide native arrow) */
.product-hub-page.scheduled-reports-page .scan-auto-field select.cr-filter {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 100%;
  min-height: 46px;
  padding: 11px 44px 11px 14px;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
  color: #0f172a;
  cursor: pointer;
  background-color: #fff;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #f8fafc 0%, #f8fafc 40px, transparent 40px);
  background-repeat: no-repeat, no-repeat;
  background-position: right 14px center, center;
  background-size: 18px 18px, 100% 100%;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.product-hub-page.scheduled-reports-page .scan-auto-field select.cr-filter::-ms-expand {
  display: none;
}

.product-hub-page.scheduled-reports-page .scan-auto-field select.cr-filter:hover {
  border-color: #94a3b8;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #f1f5f9 0%, #f1f5f9 40px, transparent 40px);
}

.product-hub-page.scheduled-reports-page .scan-auto-field select.cr-filter:focus {
  outline: none;
  border-color: #0891b2;
  box-shadow:
    0 0 0 3px rgba(8, 145, 178, 0.18),
    0 1px 2px rgba(15, 23, 42, 0.05);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%230891b2' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #ecfeff 0%, #ecfeff 40px, transparent 40px);
}

/* Email/text inputs — no dropdown chevron */
.product-hub-page.scheduled-reports-page .scan-auto-field input.cr-filter {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  min-height: 46px;
  padding: 11px 14px;
  font-size: 16px;
  font-weight: 500;
  color: #0f172a;
  background: #fff;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
}

.product-hub-page.scheduled-reports-page .scan-auto-field input.cr-filter:focus {
  outline: none;
  border-color: #0891b2;
  box-shadow:
    0 0 0 3px rgba(8, 145, 178, 0.18),
    0 1px 2px rgba(15, 23, 42, 0.05);
}

.scheduled-reports-page .scan-auto-actions {
  grid-column: 1 / -1;
  justify-content: flex-end;
  margin-top: 0;
}

.product-hub-page.scheduled-reports-page .btn-p {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 46px;
  padding: 0 20px 0 22px;
  font-size: 16px;
  font-weight: 700;
  color: #0e7490;
  background: linear-gradient(180deg, #ecfeff 0%, #cffafe 100%);
  border: 1.5px solid #67e8f9;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.85);
  cursor: pointer;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.12s ease;
}

.product-hub-page.scheduled-reports-page .btn-p::after {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%230e7490' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E") center / 18px no-repeat;
}

.product-hub-page.scheduled-reports-page .btn-p:hover:not(:disabled) {
  color: #155e75;
  background: linear-gradient(180deg, #cffafe 0%, #a5f3fc 100%);
  border-color: #22d3ee;
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 4px 14px rgba(8, 145, 178, 0.2);
}

.product-hub-page.scheduled-reports-page .btn-p:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
}

.scheduled-reports-page .compliance-auto-runs > li,
.scheduled-reports-page .scan-auto-toggles > li {
  font-size: 16px;
  padding: 14px 16px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}

@media (max-width: 640px) {
  .scheduled-reports-page .product-hub-stat-card {
    min-height: 0;
  }

  .scheduled-reports-page .prem-history-card.scan-automation-card form.scan-auto-grid {
    margin: 16px;
    padding: 16px;
  }

  .scheduled-reports-page .scan-auto-actions {
    justify-content: stretch;
  }

  .product-hub-page.scheduled-reports-page .btn-p {
    width: 100%;
  }
}

/* ═══════════════════════════════════════════════════════════════════════════
   ENTERPRISE SAAS — AI · Management · Settings (target pages only)
   Unified with Help Center / Implementation Center visual language
   ═══════════════════════════════════════════════════════════════════════════ */

/* ─── Shared page shells ─── */
.ai-assist-page,
.ai-assistant-page,
.ai-review-page,
.ai-usage-page,
.ai-set-page,
.mod-page,
.translations-page.translations-page--workflow,
.product-hub-page.agency-hub-page,
.product-hub-page.system-health-hub-page,
.system-settings-page,
.acc-page,
.security-settings-page,
.bill-page {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--ds-page-max, 1760px);
  margin: 0 auto;
  padding: 0;
  font-family: var(--ds-font-family);
  font-size: var(--ds-font-size-md);
  line-height: 1.55;
  color: var(--ds-color-neutral);
}

/* ─── Hub pages: Agency & System Health ─── */
.product-hub-page.agency-hub-page,
.product-hub-page.system-health-hub-page {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding:0;
}

.product-hub-page.agency-hub-page .product-hub-hero,
.product-hub-page.system-health-hub-page .product-hub-hero {
  margin-bottom: 0;
  padding: 22px 24px !important;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, #fff 48%, rgba(13, 148, 136, 0.04) 100%) !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06) !important;
}

.product-hub-page.agency-hub-page .product-hub-hero__eyebrow,
.product-hub-page.system-health-hub-page .product-hub-hero__eyebrow {
  margin-bottom: 8px;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #4f46e5;
}

.product-hub-page.agency-hub-page .product-hub-hero__title,
.product-hub-page.system-health-hub-page .product-hub-hero__title {
  margin: 0;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
  color: #0f172a;
}

.product-hub-page.agency-hub-page .product-hub-hero__subtitle,
.product-hub-page.system-health-hub-page .product-hub-hero__subtitle {
  margin-top: 10px;
  max-width: 720px;
  font-size: 16px;
  line-height: 1.6;
  color: #3668e9;
}

.product-hub-page.agency-hub-page .product-hub-stat-grid,
.product-hub-page.system-health-hub-page .product-hub-stat-grid {
  gap: 16px;
}

.product-hub-page.agency-hub-page .product-hub-stat-card,
.product-hub-page.system-health-hub-page .product-hub-stat-card {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto auto;
  column-gap: 9px;
  row-gap: 8px;
  align-items: start;
  min-height: 112px;
  padding: 18px 20px 20px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.product-hub-page.agency-hub-page .product-hub-stat-card:hover,
.product-hub-page.system-health-hub-page .product-hub-stat-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

.product-hub-page.agency-hub-page .product-hub-stat-card__icon,
.product-hub-page.system-health-hub-page .product-hub-stat-card__icon {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
}

.product-hub-page.agency-hub-page .product-hub-stat-card__label,
.product-hub-page.system-health-hub-page .product-hub-stat-card__label {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  display: inline-flex;
  align-items: center;
  align-self: center;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.2;
}

.product-hub-page.agency-hub-page .product-hub-stat-card__value,
.product-hub-page.agency-hub-page .product-hub-stat-card strong,
.product-hub-page.system-health-hub-page .product-hub-stat-card__value,
.product-hub-page.system-health-hub-page .product-hub-stat-card strong {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: #0f172a;
}

.product-hub-page.agency-hub-page .product-hub-stat-card__helper,
.product-hub-page.system-health-hub-page .product-hub-stat-card__helper {
  grid-column: 1 / -1;
  grid-row: 3;
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
  color: #3668e9;
}

/* Agency stat icons */
.product-hub-page.agency-hub-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label {
  color: #0369a1;
}

.product-hub-page.agency-hub-page .product-hub-stat-card__icon--clients {
  background-color: #e0f2fe;
  border: 1px solid #bae6fd;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
}

.product-hub-page.agency-hub-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label {
  color: #2562ff;
}

.product-hub-page.agency-hub-page .product-hub-stat-card__icon--sites {
  background-color: #e0e7ff;
  border: 1px solid #c7d2fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E");
}

.product-hub-page.agency-hub-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label {
  color: #047857;
}

.product-hub-page.agency-hub-page .product-hub-stat-card__icon--team {
  background-color: #d1fae5;
  border: 1px solid #a7f3d0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%2310b981' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
}

.product-hub-page.agency-hub-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label {
  color: #6d28d9;
}

.product-hub-page.agency-hub-page .product-hub-stat-card__icon--billing {
  background-color: #ede9fe;
  border: 1px solid #ddd6fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='14' x='2' y='5' rx='2'/%3E%3Cline x1='2' x2='22' y1='10' y2='10'/%3E%3C/svg%3E");
}

/* Hub sections — Agency */
.product-hub-page.agency-hub-page .product-hub-section,
.product-hub-page.agency-hub-page .product-hub-config-card {
  overflow: hidden;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.product-hub-page.agency-hub-page .product-hub-section__head {
  padding: 17px 24px 18px;
  background: #f8fafc;
}

.product-hub-page.agency-hub-page .product-hub-section__title {
  font-size: 20px;
  font-weight: 700;
  color: #0f172a;
}

.product-hub-page.agency-hub-page .product-hub-section__body {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 20px 24px 24px;
  font-size: 16px;
  line-height: 1.6;
  color: #334155;
}

.product-hub-page.agency-hub-page .product-hub-link-grid {
  gap: 16px;
}

.product-hub-page.agency-hub-page .product-hub-link-card,
.product-hub-page.agency-hub-page .product-hub-config-card {
  padding: 20px 24px;
}

/* Agency — config card headers: icon + title list row */
.product-hub-page.agency-hub-page .product-hub-config-card {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 14px;
  row-gap: 16px;
  align-items: start;
}

.product-hub-page.agency-hub-page .product-hub-config-card > svg {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  flex-shrink: 0;
  width: 44px !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 11px;
  box-sizing: border-box;
  border-radius: 12px;
  opacity: 1 !important;
  stroke: currentColor;
}

.product-hub-page.agency-hub-page .product-hub-config-card > h3 {
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  margin: 0 !important;
  padding: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.25;
  color: #0f172a;
  background: none;
  border: none;
  border-radius: 0;
}

.product-hub-page.agency-hub-page .product-hub-config-card > p,
.product-hub-page.agency-hub-page .product-hub-config-card > ul,
.product-hub-page.agency-hub-page .product-hub-config-card > form {
  grid-column: 1 / -1;
}

.product-hub-page.agency-hub-page .product-hub-config-card > p {
  margin-bottom: 0;
}

.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(1) > h3 {
  color: #0369a1;
}

.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(2) > h3 {
  color: #2562ff;
}

.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(3) > h3 {
  color: #047857;
}

.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(4) > h3 {
  color: #6d28d9;
}

.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(1) > svg {
  color: #0284c7;
  background: #e0f2fe;
  border: 1px solid #bae6fd;
}

.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(2) > svg {
  color: #6366f1;
  background: #e0e7ff;
  border: 1px solid #c7d2fe;
}

.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(3) > svg {
  color: #10b981;
  background: #d1fae5;
  border: 1px solid #a7f3d0;
}

.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(4) > svg {
  color: #7c3aed;
  background: #ede9fe;
  border: 1px solid #ddd6fe;
}

/* Agency — link client form row */
.product-hub-page.agency-hub-page .product-hub-config-card form {
  display: flex;
  flex-wrap: wrap;
  gap: 10px !important;
  align-items: center;
  margin-top: 4px;
  padding: 14px 16px;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.product-hub-page.agency-hub-page .product-hub-config-card form .cr-filter {
  flex: 1 1 200px !important;
  min-width: 200px !important;
  margin: 0;
  padding: 10px 14px;
  font-size: 15px;
  border-radius: 10px;
  border: 1px solid #cbd5e1;
  background-color: #fff;
}

.product-hub-page.agency-hub-page .product-hub-config-card form .cr-filter:focus {
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
  outline: none;
}

.product-hub-page.agency-hub-page .product-hub-config-card form .btn.secondary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  font-size: 14px;
  font-weight: 600;
  color: #2562ff !important;
  background-color: #eef2ff !important;
  border: 1px solid #c7d2fe !important;
  border-radius: 10px;
  box-shadow: none;
}

.product-hub-page.agency-hub-page .product-hub-config-card form .btn.secondary:hover:not(:disabled) {
  color: #3730a3 !important;
  background-color: #e0e7ff !important;
  border-color: #a5b4fc !important;
}

.product-hub-page.agency-hub-page .product-hub-config-card form .btn.secondary::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Agency — connected site links */
.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(2) ul {
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
}

.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(2) ul li {
  margin: 0;
  padding: 0;
}

.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(2) ul li a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  color: #2562ff;
  text-decoration: none;
  background: linear-gradient(180deg, #eef2ff 0%, #fff 100%);
  border: 1px solid #c7d2fe;
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  word-break: break-all;
}

.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(2) ul li a::before {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E") center/contain no-repeat;
}

.product-hub-page.agency-hub-page .product-hub-link-grid > .product-hub-config-card:nth-child(2) ul li a:hover {
  color: #3730a3;
  border-color: #a5b4fc;
  background: #e0e7ff;
}

/* System Health — infrastructure cards */
.product-hub-page.system-health-hub-page .system-health-infra {
  margin-top: 0;
}

.product-hub-page.system-health-hub-page .system-health-section-title {
  margin: 0 0 16px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #3668e9;
}

.product-hub-page.system-health-hub-page .system-health-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  margin-top: 12px;
  align-items: stretch;
}

.product-hub-page.system-health-hub-page .system-health-card {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: 100%;
  margin: 0;
  padding: 20px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.product-hub-page.system-health-hub-page .system-health-card:hover {
  border-color: #cbd5e1;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.product-hub-page.system-health-hub-page .system-health-card__head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 10px;
  margin: 0;
}

.product-hub-page.system-health-hub-page .system-health-card__head svg {
  grid-column: 1;
  flex-shrink: 0;
  color: #6366f1;
}

.product-hub-page.system-health-hub-page .system-health-card__head h3 {
  grid-column: 2;
  margin: 0;
  min-width: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
}

.product-hub-page.system-health-hub-page .system-health-card__head .system-health-status {
  grid-column: 3;
  justify-self: end;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  font-size: 0;
  line-height: 1;
  border-radius: 999px;
  border: 1px solid transparent;
  white-space: nowrap;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.product-hub-page.system-health-hub-page .system-health-card__head .system-health-status::before {
  content: "";
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}

.product-hub-page.system-health-hub-page .system-health-card__head .system-health-status::after {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1.2;
}

.product-hub-page.system-health-hub-page .system-health-card__head .system-health-status--healthy {
  background: #ecfdf5;
  border-color: #a7f3d0;
}

.product-hub-page.system-health-hub-page .system-health-card__head .system-health-status--healthy::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

.product-hub-page.system-health-hub-page .system-health-card__head .system-health-status--healthy::after {
  content: attr(title);
  color: #047857;
}

.product-hub-page.system-health-hub-page .system-health-card__head .system-health-status--warning {
  background: #fffbeb;
  border-color: #fde68a;
}

.product-hub-page.system-health-hub-page .system-health-card__head .system-health-status--warning::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3z'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}

.product-hub-page.system-health-hub-page .system-health-card__head .system-health-status--warning::after {
  content: attr(title);
  color: #b45309;
}

.product-hub-page.system-health-hub-page .system-health-card__head .system-health-status--failed {
  background: #fef2f2;
  border-color: #fecaca;
}

.product-hub-page.system-health-hub-page .system-health-card__head .system-health-status--failed::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m15 9-6 6'/%3E%3Cpath d='m9 9 6 6'/%3E%3C/svg%3E");
}

.product-hub-page.system-health-hub-page .system-health-card__head .system-health-status--failed::after {
  content: attr(title);
  color: #b91c1c;
}

.product-hub-page.system-health-hub-page .system-health-card__meta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  max-width: 100%;
  margin: 0;
  padding: 6px 10px;
  font-size: 13px;
  line-height: 1.4;
  color: #3668e9;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}

.product-hub-page.system-health-hub-page .system-health-card__meta::before {
  content: "";
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 6v6l4 2'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.product-hub-page.system-health-hub-page .system-health-card__detail {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: #475569;
}

.product-hub-page.system-health-hub-page .system-health-card__section {
  margin: 0;
  padding-top: 4px;
}

.product-hub-page.system-health-hub-page .system-health-card__section h4 {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 8px;
  padding: 4px 10px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3668e9;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
}

.product-hub-page.system-health-hub-page .system-health-card__section h4::before {
  content: "";
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%233668e9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
}

.product-hub-page.system-health-hub-page .system-health-resolution {
  margin: 0;
  padding-left: 20px;
  font-size: 14px;
  line-height: 1.5;
  color: #475569;
}

.product-hub-page.system-health-hub-page .system-health-resolution li + li {
  margin-top: 6px;
}

.product-hub-page.system-health-hub-page .system-health-card__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  padding: 8px 14px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  color: #2562ff;
  text-decoration: none;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 10px;
  align-self: flex-start;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.12s ease;
}

.product-hub-page.system-health-hub-page .system-health-card__link:hover {
  color: #3730a3;
  background: #e0e7ff;
  border-color: #a5b4fc;
  transform: translateY(-1px);
}

.product-hub-page.system-health-hub-page .system-health-card__link svg {
  flex-shrink: 0;
  color: currentColor;
}

@media (max-width: 1280px) {
  .product-hub-page.system-health-hub-page .system-health-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 960px) {
  .product-hub-page.system-health-hub-page .system-health-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .product-hub-page.system-health-hub-page .system-health-grid {
    grid-template-columns: 1fr;
  }

  .product-hub-page.system-health-hub-page .system-health-card__head {
    grid-template-columns: auto 1fr;
  }

  .product-hub-page.system-health-hub-page .system-health-card__head .system-health-status {
    grid-column: 1 / -1;
    justify-self: start;
  }
}

.product-hub-page.system-health-hub-page .product-hub-panel-note {
  padding: 14px 18px;
  font-size: 15px;
  line-height: 1.55;
  color: #475569;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}

/* ─── AI Assist — layout rhythm (aligned with Consent Setup) ─── */
.ai-assist-page,
.ai-assistant-page {
  --ds-font-size-xs: 15px;
  --ds-font-size-sm: 17px;
  --ds-font-size-md: 18px;
  --ds-font-size-lg: 20px;
  --ds-font-size-xl: 26px;
  --ds-font-size-2xl: 32px;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0 !important;
  font-size: 18px;
}

.ai-assist-page .ai-head-top,
.ai-assistant-page .ai-head-top {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  margin-bottom: 30px;
  gap: var(--ds-space-lg);
  padding: 16px 22px;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, #fff 48%, rgba(13, 148, 136, 0.04) 100%);
  border: 1px solid #e2e8f0;
  border-radius: var(--ds-radius-lg);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.ai-assist-page .ai-head-top > div[role="tablist"],
.ai-assistant-page .ai-head-top > div[role="tablist"] {
  align-self: flex-end;
  margin-top: 4px;
  margin-bottom: 0;
}

.ai-assist-page .ai-breadcrumb,
.ai-assistant-page .ai-breadcrumb {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #4f46e5;
}

.ai-assist-page .ai-title-row,
.ai-assistant-page .ai-title-row {
  margin-top: 0;
}

.ai-assist-page .ai-title-combined,
.ai-assistant-page .ai-title-combined {
  margin: 0;
  font-size: clamp(28px, 2.2vw, 34px);
  font-weight: var(--ds-font-weight-bold);
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0f172a;
}

/* Single title like Modules / Consent Setup — hide brand prefix */
.ai-assist-page .ai-title-brand,
.ai-assistant-page .ai-title-brand {
  display: none;
}

.ai-assist-page .ai-title-accent,
.ai-assistant-page .ai-title-accent {
  color: #0f172a;
}

.ai-assist-page .ai-sub-row,
.ai-assistant-page .ai-sub-row {
  margin-top: 10px;
  gap: var(--ds-space-md);
  font-size: var(--ds-font-size-md);
  line-height: 1.6;
  color: var(--ds-color-muted);
}

.ai-assist-page .ai-gemini-badge,
.ai-assistant-page .ai-gemini-badge {
  font-size: 12px;
  font-weight: 700;
}
.ai-assist-page .ai-gemini-badge svg {
  width: 16px;
  height: 16px;
}
.ai-assist-page .ai-dot-sep,
.ai-assistant-page .ai-dot-sep {
  color: #cbd5e1;
}

.ai-assist-page .ai-status-text,
.ai-assistant-page .ai-status-text {
  color: var(--ds-color-muted);
}

.ai-assist-page .ai-segment,
.ai-assistant-page .ai-segment {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 10px;
  border-radius: 10px;
  background-color: #fff;
  padding: 7px;
}

.ai-assist-page .ai-segment-btn,
.ai-assistant-page .ai-segment-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 44px;
  padding: 10px 16px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  border-style: solid;
  border-width: 1.5px;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition:
    color 0.15s ease,
    background-color 0.15s ease,
    border-color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.ai-assist-page .ai-segment-btn::after,
.ai-assistant-page .ai-segment-btn::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

/* Interactive tab */
.ai-assist-page .ai-segment-btn:nth-child(1),
.ai-assistant-page .ai-segment-btn:nth-child(1) {
  color: #2562ff;
  background: #eef2ff;
  border-color: #c7d2fe;
}

.ai-assist-page .ai-segment-btn:nth-child(1)::after,
.ai-assistant-page .ai-segment-btn:nth-child(1)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-segment-btn:nth-child(1).is-active,
.ai-assistant-page .ai-segment-btn:nth-child(1).is-active {
  color: #3730a3;
  background: #e0e7ff;
  border-color: #a5b4fc;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 2px 8px rgba(99, 102, 241, 0.14);
}

.ai-assist-page .ai-segment-btn:nth-child(1).is-active::after,
.ai-assistant-page .ai-segment-btn:nth-child(1).is-active::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233730a3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-segment-btn:nth-child(1):hover,
.ai-assistant-page .ai-segment-btn:nth-child(1):hover {
  transform: translateY(-1px);
  background: #e0e7ff;
  border-color: #a5b4fc;
}

/* Automations tab */
.ai-assist-page .ai-segment-btn:nth-child(2),
.ai-assistant-page .ai-segment-btn:nth-child(2) {
  color: #b45309;
  background: #fffbeb;
  border-color: #fde68a;
}

.ai-assist-page .ai-segment-btn:nth-child(2)::after,
.ai-assistant-page .ai-segment-btn:nth-child(2)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-segment-btn:nth-child(2).is-active,
.ai-assistant-page .ai-segment-btn:nth-child(2).is-active {
  color: #92400e;
  background: #fef3c7;
  border-color: #fcd34d;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 2px 8px rgba(245, 158, 11, 0.14);
}

.ai-assist-page .ai-segment-btn:nth-child(2).is-active::after,
.ai-assistant-page .ai-segment-btn:nth-child(2).is-active::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2392400e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-segment-btn:nth-child(2):hover,
.ai-assistant-page .ai-segment-btn:nth-child(2):hover {
  transform: translateY(-1px);
  background: #fef3c7;
  border-color: #fcd34d;
}

.ai-assist-page .ai-segment-btn:focus-visible,
.ai-assistant-page .ai-segment-btn:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.2);
}

.ai-assist-page .ai-callout-warn,
.ai-assistant-page .ai-callout-warn {
  margin: 0;
  padding: var(--ds-space-lg) var(--ds-space-xl);
  font-size: var(--ds-font-size-sm);
  line-height: 1.55;
}

.ai-assist-page .ai-dashboard,
.ai-assistant-page .ai-dashboard {
  gap: var(--ds-section-gap) !important;
  margin-top: 0 !important;
}

.ai-assist-page .ai-section-head,
.ai-assistant-page .ai-section-head {
  margin-bottom: var(--ds-space-lg);
}

.ai-assist-page .ai-section-head--hero,
.ai-assistant-page .ai-section-head--hero {
  margin-bottom: var(--ds-space-md);
}

.ai-assist-page .ai-section-title,
.ai-assistant-page .ai-section-title {
  margin: 0;
  font-size: var(--ds-font-size-xl);
  font-weight: var(--ds-font-weight-bold);
  letter-spacing: -0.02em;
  line-height: 1.25;
  text-transform: none;
  color: var(--ds-color-neutral);
}

.ai-assist-page .ai-section-sub,
.ai-assistant-page .ai-section-sub {
  margin: 6px 0 0;
  max-width: 62ch;
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-color-muted);
}

/* ─── AI Assistant — light premium hero ─── */
.ai-assist-page .ai-hero,
.ai-assistant-page .ai-hero {
  margin-top: 0 !important;
  padding: 22px 24px !important;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, #fff 48%, rgba(13, 148, 136, 0.04) 100%) !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: var(--ds-radius-lg) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06) !important;
}

.ai-assist-page .ai-hero:after,
.ai-assistant-page .ai-hero:after {
  display: none;
}

.ai-assist-page .ai-hero-inner,
.ai-assistant-page .ai-hero-inner {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  column-gap: 14px;
  row-gap: var(--ds-space-lg);
}

.ai-assist-page .ai-hero-bot,
.ai-assistant-page .ai-hero-bot {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: 0;
  color: #4f46e5;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 12px;
}

.ai-assist-page .ai-hero-bot svg,
.ai-assistant-page .ai-hero-bot svg {
  width: 22px;
  height: 22px;
}

.ai-assist-page .ai-hero-headline,
.ai-assistant-page .ai-hero-headline {
  grid-column: 2;
  grid-row: 1;
  margin: 0 !important;
  color: #0f172a !important;
  font-size: var(--ds-font-size-xl) !important;
  font-weight: var(--ds-font-weight-bold) !important;
  line-height: 1.25 !important;
}

.ai-assist-page .ai-hero-form,
.ai-assistant-page .ai-hero-form {
  grid-column: 1 / -1;
  grid-row: 2;
  margin-top: 0;
  gap: var(--ds-space-md);
}

.ai-assist-page .ai-hero-inner > .ai-quick-actions,
.ai-assistant-page .ai-hero-inner > .ai-quick-actions,
.ai-assist-page .ai-hero-inner > .ai-hero-reply,
.ai-assistant-page .ai-hero-inner > .ai-hero-reply,
.ai-assist-page .ai-hero-inner > .ai-hero-output-actions,
.ai-assistant-page .ai-hero-inner > .ai-hero-output-actions,
.ai-assist-page .ai-hero-inner > .ai-suggestions,
.ai-assistant-page .ai-hero-inner > .ai-suggestions {
  grid-column: 1 / -1;
  margin-top: 0;
}

.ai-assist-page .ai-hero-input,
.ai-assistant-page .ai-hero-input {
  height: 48px;
  min-height: 48px;
  padding: 0 var(--ds-space-lg);
  font-size: var(--ds-font-size-sm);
  color: #0f172a !important;
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: var(--ds-radius-md);
}

.ai-assist-page .ai-hero-input::placeholder,
.ai-assistant-page .ai-hero-input::placeholder {
  color: #94a3b8 !important;
}

.ai-assist-page .ai-quick-actions,
.ai-assistant-page .ai-quick-actions {
  margin-top: var(--ds-space-lg);
  gap: 10px;
}

.ai-assist-page .ai-hero-reply,
.ai-assistant-page .ai-hero-reply {
  margin-top: var(--ds-space-lg);
  padding: 14px 16px;
  font-size: var(--ds-font-size-sm);
  line-height: 1.6;
  color: #334155 !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: var(--ds-radius-md);
}

.ai-assist-page .ai-hero-output-actions,
.ai-assistant-page .ai-hero-output-actions {
  margin-top: var(--ds-space-md);
  gap: 10px;
}

.ai-assist-page .ai-suggestions,
.ai-assistant-page .ai-suggestions {
  margin-top: var(--ds-space-lg);
  gap: 10px;
  align-items: center;
}

.ai-assist-page .ai-suggestions-label,
.ai-assistant-page .ai-suggestions-label {
  margin-right: 4px;
  font-size: 14px;
  font-weight: var(--ds-font-weight-bold);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3668e9 !important;
}

.ai-assist-page .ai-tools-grid,
.ai-assistant-page .ai-tools-grid {
  gap: var(--ds-space-lg);
}

.ai-assist-page .ai-tool-card,
.ai-assistant-page .ai-tool-card {
  display: flex;
  align-items: start;
  position: relative;
  column-gap: 0;
  row-gap: 0;
  padding: 20px 22px 22px;
  border-radius: var(--ds-radius-lg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 1px 3px rgba(15, 23, 42, 0.06);
}
.ai-tool-body {
  flex: 1;
  min-width: 100%;
}
.ai-assist-page .ai-tool-icon-wrap,
.ai-assistant-page .ai-tool-icon-wrap {
  align-self: start;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  margin-bottom: 14px;
  justify-content: center;
}

.ai-assist-page .ai-tool-icon-wrap svg,
.ai-assistant-page .ai-tool-icon-wrap svg {
  width: 22px;
  height: 22px;
}

.ai-assist-page .ai-tool-body,
.ai-assistant-page .ai-tool-body {
  display: contents;
}

.ai-assist-page .ai-tool-head,
.ai-assistant-page .ai-tool-head {
  grid-column: 2;
  grid-row: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 0;
  width: 100%;
}

.ai-assist-page .ai-tool-title,
.ai-assistant-page .ai-tool-title {
  flex: 1;
  min-width: 0;
  margin: 0;
  font-size: 18px;
  font-weight: var(--ds-font-weight-bold);
  line-height: 1.25;
}

.ai-assist-page .ai-tool-badge,
.ai-assistant-page .ai-tool-badge {
  flex-shrink: 0;
  margin-left: auto;
  font-size: 13px;
  padding: 5px 10px;    
  position: absolute;
  top: 27px;
  right: 22px;
}

.ai-assist-page .ai-tool-desc,
.ai-assistant-page .ai-tool-desc {
  margin: var(--ds-space-xs) 0 0;
  font-size: 16px;
  line-height: 1.6;
  color: var(--ds-color-muted);
}

.ai-assist-page .ai-tool-panel,
.ai-assistant-page .ai-tool-panel {
  margin-top: var(--ds-space-lg);
  padding-top: var(--ds-space-lg);
  gap: var(--ds-space-md);
  width: 100%;
}

/* Tinted tool icons — match Modules cards */
.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(1) .ai-tool-icon-wrap,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(1) .ai-tool-icon-wrap {
  background: #e0e7ff;
  border-color: #c7d2fe;
  color: #2562ff;
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(2) .ai-tool-icon-wrap,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(2) .ai-tool-icon-wrap {
  background: #d1fae5;
  border-color: #a7f3d0;
  color: #059669;
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(3) .ai-tool-icon-wrap,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(3) .ai-tool-icon-wrap {
  background: #eef2ff;
  border-color: #c7d2fe;
  color: #4f46e5;
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(4) .ai-tool-icon-wrap,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(4) .ai-tool-icon-wrap {
  background: #fff1f2;
  border-color: #fecaca;
  color: #dc2626;
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(5) .ai-tool-icon-wrap,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(5) .ai-tool-icon-wrap {
  background: #f0f9ff;
  border-color: #bae6fd;
  color: #0284c7;
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(6) .ai-tool-icon-wrap,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(6) .ai-tool-icon-wrap {
  background: #fffbeb;
  border-color: #fde68a;
  color: #d97706;
}

.ai-assist-page .ai-tool-panel .cs-field,
.ai-assistant-page .ai-tool-panel .cs-field {
  margin-bottom: var(--ds-space-md);
}

.ai-assist-page .ai-tool-panel .cs-field-label,
.ai-assistant-page .ai-tool-panel .cs-field-label {
  font-size: 15px;
  font-weight: var(--ds-font-weight-medium);
  margin-bottom: var(--ds-space-xs);
  color: #0f172a;
}

/* AI Assist — tool panel selects (Tone, Region, etc.) */
.ai-assist-page .ai-tool-panel .cs-field select,
.ai-assist-page .ai-tool-panel .cs-field select.ds-select,
.ai-assistant-page .ai-tool-panel .cs-field select,
.ai-assistant-page .ai-tool-panel .cs-field select.ds-select {
  width: 100%;
  min-height: 46px;
  padding: 11px 44px 11px 14px;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.4;
  color: #0f172a;
  cursor: pointer;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  background-color: #fff !important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #f8fafc 0%, #f8fafc 40px, transparent 40px) !important;
  background-repeat: no-repeat, no-repeat !important;
  background-position: right 14px center, center !important;
  background-size: 18px 18px, 100% 100% !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ai-assist-page .ai-tool-panel .cs-field select::-ms-expand,
.ai-assistant-page .ai-tool-panel .cs-field select::-ms-expand {
  display: none;
}

.ai-assist-page .ai-tool-panel .cs-field select:hover,
.ai-assist-page .ai-tool-panel .cs-field select.ds-select:hover,
.ai-assistant-page .ai-tool-panel .cs-field select:hover,
.ai-assistant-page .ai-tool-panel .cs-field select.ds-select:hover {
  border-color: #94a3b8;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #f1f5f9 0%, #f1f5f9 40px, transparent 40px) !important;
}

.ai-assist-page .ai-tool-panel .cs-field select:focus,
.ai-assist-page .ai-tool-panel .cs-field select.ds-select:focus,
.ai-assistant-page .ai-tool-panel .cs-field select:focus,
.ai-assistant-page .ai-tool-panel .cs-field select.ds-select:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow:
    0 0 0 3px rgba(99, 102, 241, 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.05);
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #eef2ff 0%, #eef2ff 40px, transparent 40px) !important;
}

.ai-assist-page .ai-tool-panel .cs-field input,
.ai-assist-page .ai-tool-panel .cs-field input.ds-input,
.ai-assist-page .ai-tool-panel .cs-field textarea,
.ai-assistant-page .ai-tool-panel .cs-field input,
.ai-assistant-page .ai-tool-panel .cs-field input.ds-input,
.ai-assistant-page .ai-tool-panel .cs-field textarea {
  width: 100%;
  min-height: 46px;
  padding: 11px 14px;
  font-size: 17px;
  font-weight: 500;
  color: #0f172a;
  background-color: #fff;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.05);
}

.ai-assist-page .ai-tool-panel .cs-field input:hover,
.ai-assist-page .ai-tool-panel .cs-field textarea:hover,
.ai-assistant-page .ai-tool-panel .cs-field input:hover,
.ai-assistant-page .ai-tool-panel .cs-field textarea:hover {
  border-color: #94a3b8;
}

.ai-assist-page .ai-tool-panel .cs-field input:focus,
.ai-assist-page .ai-tool-panel .cs-field textarea:focus,
.ai-assistant-page .ai-tool-panel .cs-field input:focus,
.ai-assistant-page .ai-tool-panel .cs-field textarea:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.ai-assist-page .ai-threads-head,
.ai-assistant-page .ai-threads-head {
  margin: 0;
  gap: var(--ds-space-lg);
}

.ai-assist-page .ai-threads-title,
.ai-assistant-page .ai-threads-title {
  font-size: 14px;
  font-weight: var(--ds-font-weight-semibold);
  letter-spacing: 0.08em;
}

.ai-assist-page .ai-clear-history,
.ai-assistant-page .ai-clear-history {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #dc2626;
  background: #fff1f2;
  border: 1px solid #fecaca;
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition:
    color 0.15s ease,
    background-color 0.15s ease,
    border-color 0.15s ease;
}

.ai-assist-page .ai-clear-history::before,
.ai-assistant-page .ai-clear-history::before {
  content: "";
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23dc2626' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6'/%3E%3Cpath d='M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2'/%3E%3Cline x1='10' x2='10' y1='11' y2='17'/%3E%3Cline x1='14' x2='14' y1='11' y2='17'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.ai-assist-page .ai-clear-history:hover,
.ai-assistant-page .ai-clear-history:hover {
  color: #b91c1c;
  background: #ffe4e6;
  border-color: #fca5a5;
  text-decoration: none;
}

.ai-assist-page .ai-clear-history:hover::before,
.ai-assistant-page .ai-clear-history:hover::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6'/%3E%3Cpath d='M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2'/%3E%3Cline x1='10' x2='10' y1='11' y2='17'/%3E%3Cline x1='14' x2='14' y1='11' y2='17'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-threads-card,
.ai-assistant-page .ai-threads-card {
  margin-top: var(--ds-space-md);
  border-radius: var(--ds-radius-lg);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.ai-assist-page .ai-thread-row,
.ai-assistant-page .ai-thread-row {
  min-height: 60px;
  padding: 0 var(--ds-space-lg);
}

.ai-assist-page .ai-thread-title,
.ai-assistant-page .ai-thread-title {
  font-size: var(--ds-font-size-sm);
  font-weight: var(--ds-font-weight-semibold);
}

.ai-assist-page .ai-thread-time,
.ai-assistant-page .ai-thread-time {
  font-size: 13px;
}

.ai-assist-page .ai-threads-empty,
.ai-assistant-page .ai-threads-empty {
  padding: var(--ds-space-2xl) var(--ds-space-xl);
  font-size: var(--ds-font-size-sm);
  line-height: 1.55;
}

/* AI Assist — tinted action buttons with right icons */
.ai-assist-page .ai-quick-action,
.ai-assistant-page .ai-quick-action,
.ai-assist-page .ai-suggestion-pill,
.ai-assistant-page .ai-suggestion-pill,
.ai-assist-page .ai-hero-output-actions .btn,
.ai-assistant-page .ai-hero-output-actions .btn,
.ai-assist-page .ai-tool-panel .btn-primary,
.ai-assistant-page .ai-tool-panel .btn-primary,
.ai-assist-page .ai-tool-panel .btn-ghost,
.ai-assistant-page .ai-tool-panel .btn-ghost,
.ai-assist-page .ai-tool-route-btn,
.ai-assistant-page .ai-tool-route-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 40px;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  border-style: solid;
  border-width: 1.5px;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.ai-assist-page .ai-quick-action::after,
.ai-assistant-page .ai-quick-action::after,
.ai-assist-page .ai-suggestion-pill::after,
.ai-assistant-page .ai-suggestion-pill::after,
.ai-assist-page .ai-hero-output-actions .btn::after,
.ai-assistant-page .ai-hero-output-actions .btn::after,
.ai-assist-page .ai-tool-panel .btn-primary::after,
.ai-assistant-page .ai-tool-panel .btn-primary::after,
.ai-assist-page .ai-tool-panel .btn-ghost::after,
.ai-assistant-page .ai-tool-panel .btn-ghost::after,
.ai-assist-page .ai-tool-route-btn::after,
.ai-assistant-page .ai-tool-route-btn::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin-left: 2px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

/* Quick prompts */
.ai-assist-page .ai-quick-actions .ai-quick-action:nth-child(1),
.ai-assistant-page .ai-quick-actions .ai-quick-action:nth-child(1) {
  color: #047857 !important;
  background: #ecfdf5 !important;
  border-color: #a7f3d0 !important;
}

.ai-assist-page .ai-quick-actions .ai-quick-action:nth-child(1)::after,
.ai-assistant-page .ai-quick-actions .ai-quick-action:nth-child(1)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Cpath d='M15 2H9a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h6a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1Z'/%3E%3Cpath d='M12 11h4'/%3E%3Cpath d='M12 16h4'/%3E%3Cpath d='M8 11h.01'/%3E%3Cpath d='M8 16h.01'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-quick-actions .ai-quick-action:nth-child(2),
.ai-assistant-page .ai-quick-actions .ai-quick-action:nth-child(2) {
  color: #2562ff !important;
  background: #eef2ff !important;
  border-color: #c7d2fe !important;
}

.ai-assist-page .ai-quick-actions .ai-quick-action:nth-child(2)::after,
.ai-assistant-page .ai-quick-actions .ai-quick-action:nth-child(2)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-quick-actions .ai-quick-action:nth-child(3),
.ai-assistant-page .ai-quick-actions .ai-quick-action:nth-child(3) {
  color: #b45309 !important;
  background: #fffbeb !important;
  border-color: #fde68a !important;
}

.ai-assist-page .ai-quick-actions .ai-quick-action:nth-child(3)::after,
.ai-assistant-page .ai-quick-actions .ai-quick-action:nth-child(3)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 11 3 3L22 4'/%3E%3Cpath d='M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-quick-action:hover,
.ai-assistant-page .ai-quick-action:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

.ai-assist-page .ai-quick-actions .ai-quick-action:nth-child(1):hover,
.ai-assistant-page .ai-quick-actions .ai-quick-action:nth-child(1):hover {
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
}

.ai-assist-page .ai-quick-actions .ai-quick-action:nth-child(2):hover,
.ai-assistant-page .ai-quick-actions .ai-quick-action:nth-child(2):hover {
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
}

.ai-assist-page .ai-quick-actions .ai-quick-action:nth-child(3):hover,
.ai-assistant-page .ai-quick-actions .ai-quick-action:nth-child(3):hover {
  background: #fef3c7 !important;
  border-color: #fcd34d !important;
}

/* Suggested prompts */
.ai-assist-page .ai-suggestions .ai-suggestion-pill:nth-child(2),
.ai-assistant-page .ai-suggestions .ai-suggestion-pill:nth-child(2) {
  color: #7c3aed !important;
  background: #faf5ff !important;
  border-color: #e9d5ff !important;
}

.ai-assist-page .ai-suggestions .ai-suggestion-pill:nth-child(2)::after,
.ai-assistant-page .ai-suggestions .ai-suggestion-pill:nth-child(2)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15 4 1 1 2.5-2.5a2.12 2.12 0 0 1 3 3L18 8l-1 1'/%3E%3Cpath d='m14.5 4.5 4 4'/%3E%3Cpath d='m9.5 9.5-5 5a2.12 2.12 0 0 0 3 3l5-5'/%3E%3Cpath d='m5 15 1 1'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-suggestions .ai-suggestion-pill:nth-child(3),
.ai-assistant-page .ai-suggestions .ai-suggestion-pill:nth-child(3) {
  color: #dc2626 !important;
  background: #fff1f2 !important;
  border-color: #fecaca !important;
}

.ai-assist-page .ai-suggestions .ai-suggestion-pill:nth-child(3)::after,
.ai-assistant-page .ai-suggestions .ai-suggestion-pill:nth-child(3)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23dc2626' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'/%3E%3Cpath d='M12 8v4'/%3E%3Cpath d='M12 16h.01'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-suggestions .ai-suggestion-pill:nth-child(4),
.ai-assistant-page .ai-suggestions .ai-suggestion-pill:nth-child(4) {
  color: #0369a1 !important;
  background: #f0f9ff !important;
  border-color: #bae6fd !important;
}

.ai-assist-page .ai-suggestions .ai-suggestion-pill:nth-child(4)::after,
.ai-assistant-page .ai-suggestions .ai-suggestion-pill:nth-child(4)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230369a1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3Cpath d='M12 18v-6'/%3E%3Cpath d='m9 15 3 3 3-3'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-suggestion-pill:hover,
.ai-assistant-page .ai-suggestion-pill:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

/* Hero reply actions */
.ai-assist-page .ai-hero-output-actions .btn.secondary,
.ai-assistant-page .ai-hero-output-actions .btn.secondary {
  color: #047857 !important;
  background: #ecfdf5 !important;
  border-color: #a7f3d0 !important;
}

.ai-assist-page .ai-hero-output-actions .btn.secondary::after,
.ai-assistant-page .ai-hero-output-actions .btn.secondary::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2' ry='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-hero-output-actions .btn:not(.secondary),
.ai-assistant-page .ai-hero-output-actions .btn:not(.secondary) {
  color: #2562ff !important;
  background: #eef2ff !important;
  border-color: #c7d2fe !important;
}

.ai-assist-page .ai-hero-output-actions .btn:not(.secondary)::after,
.ai-assistant-page .ai-hero-output-actions .btn:not(.secondary)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-hero-output-actions .btn:hover:not(:disabled),
.ai-assistant-page .ai-hero-output-actions .btn:hover:not(:disabled) {
  transform: translateY(-1px);
}

/* Tool card actions */
.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(1) .btn-primary,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(1) .btn-primary {
  color: #7c3aed !important;
  background: #faf5ff !important;
  border-color: #e9d5ff !important;
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(1) .btn-primary::after,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(1) .btn-primary::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3-1.912 5.813a2 2 0 0 1-1.275 1.275L3 12l5.813 1.912a2 2 0 0 1 1.275 1.275L12 21l1.912-5.813a2 2 0 0 1 1.275-1.275L21 12l-5.813-1.912a2 2 0 0 1-1.275-1.275L12 3Z'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(2) .btn-primary,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(2) .btn-primary {
  color: #047857 !important;
  background: #ecfdf5 !important;
  border-color: #a7f3d0 !important;
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(2) .btn-primary::after,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(2) .btn-primary::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(3) .btn-primary,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(3) .btn-primary {
  color: #2562ff !important;
  background: #eef2ff !important;
  border-color: #c7d2fe !important;
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(3) .btn-primary::after,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(3) .btn-primary::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3Cpath d='M10 9H8'/%3E%3Cpath d='M16 13H8'/%3E%3Cpath d='M16 17H8'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(4) .btn-ghost,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(4) .btn-ghost {
  color: #dc2626 !important;
  background: #fff1f2 !important;
  border-color: #fecaca !important;
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(4) .btn-ghost::after,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(4) .btn-ghost::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23dc2626' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(5) .ai-tool-route-btn,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(5) .ai-tool-route-btn {
  color: #0369a1 !important;
  background: #f0f9ff !important;
  border: 1.5px solid #bae6fd !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(5) .ai-tool-route-btn::after,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(5) .ai-tool-route-btn::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230369a1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(6) .ai-tool-route-btn,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(6) .ai-tool-route-btn {
  color: #b45309 !important;
  background: #fffbeb !important;
  border: 1.5px solid #fde68a !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.ai-assist-page .ai-tools-grid .ai-tool-card:nth-child(6) .ai-tool-route-btn::after,
.ai-assistant-page .ai-tools-grid .ai-tool-card:nth-child(6) .ai-tool-route-btn::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 8 6 6'/%3E%3Cpath d='m4 14 6-6 2-3'/%3E%3Cpath d='M2 5h12'/%3E%3Cpath d='M7 2h1'/%3E%3Cpath d='m22 22-5-10-5 10'/%3E%3Cpath d='M14 18h6'/%3E%3C/svg%3E");
}

.ai-assist-page .ai-tool-panel .btn-primary:hover:not(:disabled),
.ai-assistant-page .ai-tool-panel .btn-primary:hover:not(:disabled),
.ai-assist-page .ai-tool-panel .btn-ghost:hover:not(:disabled),
.ai-assistant-page .ai-tool-panel .btn-ghost:hover:not(:disabled),
.ai-assist-page .ai-tool-route-btn:hover,
.ai-assistant-page .ai-tool-route-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
  color: inherit !important;
}

.ai-assist-page .ai-tool-route-btn,
.ai-assistant-page .ai-tool-route-btn {
  width: 100%;
  min-height: 44px;
  text-decoration: none !important;
}

.ai-assist-page .ai-hero-send,
.ai-assistant-page .ai-hero-send {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  height: 48px;
  min-height: 48px;
  font-weight: var(--ds-font-weight-bold);
  color: #fff !important;
  background: #6366f1 !important;
  border: none !important;
  border-radius: var(--ds-radius-md);
  box-shadow: 0 1px 3px rgba(99, 102, 241, 0.35);
  padding: 0 26px;
}

.ai-assist-page .ai-hero-send::after,
.ai-assistant-page .ai-hero-send::after {
  content: "";
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m22 2-7 20-4-9-9-4Z'/%3E%3Cpath d='M22 2 11 13'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.ai-assist-page .ai-hero-send:has(.ai-hero-send-spinner)::after,
.ai-assistant-page .ai-hero-send:has(.ai-hero-send-spinner)::after {
  display: none;
}

.ai-assist-page .ai-hero-send:hover:not(:disabled),
.ai-assistant-page .ai-hero-send:hover:not(:disabled) {
  background: #4f46e5 !important;
  box-shadow: 0 4px 14px rgba(99, 102, 241, 0.35);
}

/* AI Assist — tool panel + utility buttons with icons */
.ai-assist-page .ai-tool-panel .btn-primary.btn-block,
.ai-assist-page .ai-tool-panel .btn-ghost.btn-block,
.ai-assistant-page .ai-tool-panel .btn-primary.btn-block,
.ai-assistant-page .ai-tool-panel .btn-ghost.btn-block {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  font-size: 15px;
  font-weight: 600;
}

.ai-assist-page .ai-tool-panel .btn-primary.btn-block::after,
.ai-assistant-page .ai-tool-panel .btn-primary.btn-block::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3-1.912 5.813a2 2 0 0 1-1.275 1.275L3 12l5.813 1.912a2 2 0 0 1 1.275 1.275L12 21l1.912-5.813a2 2 0 0 1 1.275-1.275L21 12l-5.813-1.912a2 2 0 0 1-1.275-1.275L12 3Z'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.ai-assist-page .ai-tool-panel .btn-ghost.btn-block::after,
.ai-assistant-page .ai-tool-panel .btn-ghost.btn-block::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'/%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.ai-assist-page .ai-load-more,
.ai-assistant-page .ai-load-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  justify-content: center;
  font-size: 16px;
  font-weight: 600;
}

.ai-assist-page .ai-load-more::after,
.ai-assistant-page .ai-load-more::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

/* AI Assist — Compliance Automations panel */
.ai-assist-page .prem-history-card,
.ai-assistant-page .prem-history-card {
  margin-top: 24px;
  padding: 22px 24px 24px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.ai-assist-page .prem-history-card__head.cc-section-head,
.ai-assistant-page .prem-history-card__head.cc-section-head {
  margin-bottom: 14px;
}

.ai-assist-page .prem-history-card__title,
.ai-assistant-page .prem-history-card__title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1.3;
}

.ai-assist-page .prem-history-card__title::before,
.ai-assistant-page .prem-history-card__title::before {
  content: "";
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z'/%3E%3C/svg%3E") center / 20px 20px no-repeat;
}

.ai-assist-page .prem-history-card > .scan-auto-hint,
.ai-assistant-page .prem-history-card > .scan-auto-hint {
  margin: 0 0 18px !important;
  padding: 12px 14px;
  font-size: 16px;
  line-height: 1.55;
  color: #475569;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border: 1px solid #e2e8f0;
  border-radius: 10px;
}

.ai-assist-page .scan-auto-block h4,
.ai-assistant-page .scan-auto-block h4 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
  border-radius: 0 8px 8px 0;
}

.ai-assist-page .scan-auto-block h4 svg,
.ai-assistant-page .scan-auto-block h4 svg {
  flex-shrink: 0;
  color: #6366f1;
}

.ai-assist-page .scan-auto-hint,
.ai-assistant-page .scan-auto-hint {
  margin: 0 0 12px;
  font-size: 16px;
  line-height: 1.55;
  color: #3668e9;
}

.ai-assist-page .compliance-auto-templates,
.ai-assistant-page .compliance-auto-templates {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 10px;
}

.ai-assist-page .compliance-auto-templates .btn.secondary,
.ai-assistant-page .compliance-auto-templates .btn.secondary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 8px 14px;
  font-size: 15px;
  font-weight: 600;
  color: #2562ff !important;
  background: #eef2ff !important;
  border: 1px solid #c7d2fe !important;
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.ai-assist-page .compliance-auto-templates .btn.secondary::before,
.ai-assistant-page .compliance-auto-templates .btn.secondary::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

.ai-assist-page .compliance-auto-templates .btn.secondary:nth-child(1)::before,
.ai-assistant-page .compliance-auto-templates .btn.secondary:nth-child(1)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 2v4'/%3E%3Cpath d='M16 2v4'/%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M3 10h18'/%3E%3C/svg%3E");
}

.ai-assist-page .compliance-auto-templates .btn.secondary:nth-child(2)::before,
.ai-assistant-page .compliance-auto-templates .btn.secondary:nth-child(2)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230369a1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='4' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3Cpath d='M8 14h.01M12 14h.01M16 14h.01M8 18h.01M12 18h.01M16 18h.01'/%3E%3C/svg%3E");
}

.ai-assist-page .compliance-auto-templates .btn.secondary:nth-child(3)::before,
.ai-assistant-page .compliance-auto-templates .btn.secondary:nth-child(3)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.ai-assist-page .compliance-auto-templates .btn.secondary:nth-child(4)::before,
.ai-assistant-page .compliance-auto-templates .btn.secondary:nth-child(4)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 3h5v5'/%3E%3Cpath d='M8 3H3v5'/%3E%3Cpath d='M12 22v-8.3a4 4 0 0 0-1.172-2.872L3 3'/%3E%3Cpath d='m15 9 6-6'/%3E%3C/svg%3E");
}

.ai-assist-page .compliance-auto-templates .btn.secondary:nth-child(5)::before,
.ai-assistant-page .compliance-auto-templates .btn.secondary:nth-child(5)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3v18'/%3E%3Cpath d='M3 12h18'/%3E%3Cpath d='m16 8 4-4'/%3E%3Cpath d='m20 4-4 4'/%3E%3C/svg%3E");
}

.ai-assist-page .compliance-auto-templates .btn.secondary:nth-child(6)::before,
.ai-assistant-page .compliance-auto-templates .btn.secondary:nth-child(6)::before,
.ai-assist-page .compliance-auto-templates .btn.secondary:nth-child(n + 6)::before,
.ai-assistant-page .compliance-auto-templates .btn.secondary:nth-child(n + 6)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23dc2626' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18'/%3E%3Cpath d='m19 9-5 5-4-4-3 3'/%3E%3C/svg%3E");
}

.ai-assist-page .compliance-auto-templates .btn.secondary:hover:not(:disabled),
.ai-assistant-page .compliance-auto-templates .btn.secondary:hover:not(:disabled) {
  color: #3730a3 !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
  transform: translateY(-1px);
}

.ai-assist-page .compliance-auto-rules,
.ai-assistant-page .compliance-auto-rules {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ai-assist-page .compliance-auto-rule,
.ai-assistant-page .compliance-auto-rule {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding: 14px 16px;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  border-bottom: 1px solid #e2e8f0;
}

.ai-assist-page .compliance-auto-rule strong,
.ai-assistant-page .compliance-auto-rule strong {
  display: block;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.35;
  color: #0f172a;
}

.ai-assist-page .compliance-auto-rule__meta,
.ai-assistant-page .compliance-auto-rule__meta {
  margin-top: 6px;
  font-size: 15px;
  line-height: 1.5;
  color: #3668e9;
}

.ai-assist-page .compliance-auto-rule__meta code,
.ai-assistant-page .compliance-auto-rule__meta code {
  display: inline-block;
  margin: 0 2px;
  padding: 2px 8px;
  font-size: 14px;
  font-weight: 600;
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 6px;
}

.ai-assist-page .compliance-auto-rule .btn-icon,
.ai-assistant-page .compliance-auto-rule .btn-icon {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  color: #dc2626;
  background: #fff1f2;
  border: 1px solid #fecaca;
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease;
}

.ai-assist-page .compliance-auto-rule .btn-icon:hover:not(:disabled),
.ai-assistant-page .compliance-auto-rule .btn-icon:hover:not(:disabled) {
  color: #b91c1c;
  background: #ffe4e6;
  border-color: #fca5a5;
  transform: translateY(-1px);
}

.ai-assist-page .compliance-automation-panel form.scan-auto-grid,
.ai-assistant-page .compliance-automation-panel form.scan-auto-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 14px 16px;
  margin-top: 4px;
  padding: 16px 18px;
  background: linear-gradient(180deg, #fffbeb 0%, #fff 100%);
  border: 1px solid #fde68a;
  border-radius: 14px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.ai-assist-page .compliance-automation-panel form.scan-auto-grid > h4,
.ai-assistant-page .compliance-automation-panel form.scan-auto-grid > h4 {
  grid-column: 1 / -1;
  margin-bottom: 0;
  margin-top: 0;
  color: #92400e;
  background: #fef3c7;
  padding: 10px 14px 8px;
  border-radius: 8px;
}

.ai-assist-page .compliance-automation-panel .scan-auto-field,
.ai-assistant-page .compliance-automation-panel .scan-auto-field {
  gap: 6px;
  margin-bottom: 0;
  font-size: 15px;
  color: #475569;
}

.ai-assist-page .compliance-automation-panel .scan-auto-field > span,
.ai-assistant-page .compliance-automation-panel .scan-auto-field > span {
  font-size: 15px;
  font-weight: 600;
  color: #334155;
}

.ai-assist-page .compliance-automation-panel .scan-auto-field .cr-filter,
.ai-assistant-page .compliance-automation-panel .scan-auto-field .cr-filter {
  min-height: 44px;
  padding: 10px 14px;
  font-size: 16px;
  border-radius: 10px;
  border: 1px solid #cbd5e1;
  background-color: #fff;
}

.ai-assist-page .compliance-automation-panel .scan-auto-field select.cr-filter,
.ai-assistant-page .compliance-automation-panel .scan-auto-field select.cr-filter {
  padding-right: 44px;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"),
    linear-gradient(to left, #f8fafc 0%, #f8fafc 40px, transparent 40px) !important;
  background-repeat: no-repeat, no-repeat !important;
  background-position: right 14px center, center !important;
  background-size: 18px 18px, 100% 100% !important;
}

.ai-assist-page .compliance-automation-panel .scan-auto-field:has(.scan-auto-toggles),
.ai-assistant-page .compliance-automation-panel .scan-auto-field:has(.scan-auto-toggles) {
  grid-column: 1 / -1;
}

.ai-assist-page .compliance-automation-panel .scan-auto-field .cr-filter:focus,
.ai-assistant-page .compliance-automation-panel .scan-auto-field .cr-filter:focus {
  outline: none;
  border-color: #f59e0b;
  box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.15);
}

.ai-assist-page .compliance-automation-panel .scan-auto-toggles,
.ai-assistant-page .compliance-automation-panel .scan-auto-toggles {
  margin: 0;
  padding: 0;
  list-style: none;
}

.ai-assist-page .compliance-automation-panel .scan-auto-toggles li,
.ai-assistant-page .compliance-automation-panel .scan-auto-toggles li {
  margin-bottom: 8px;
  font-size: 16px;
  line-height: 1.45;
  color: #334155;
}

.ai-assist-page .compliance-automation-panel .scan-auto-toggles li label,
.ai-assistant-page .compliance-automation-panel .scan-auto-toggles li label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}

.ai-assist-page .compliance-automation-panel .scan-auto-actions,
.ai-assistant-page .compliance-automation-panel .scan-auto-actions {
  grid-column: 1 / -1;
  justify-content: flex-start;
  margin-top: 4px;
}

.ai-assist-page .compliance-automation-panel .scan-auto-actions .btn-p,
.ai-assistant-page .compliance-automation-panel .scan-auto-actions .btn-p {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  padding: 0 22px;
  font-size: 17px;
  font-weight: 700;
  color: #fff !important;
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%) !important;
  border: none !important;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.28);
}

.ai-assist-page .compliance-automation-panel .scan-auto-actions .btn-p::after,
.ai-assistant-page .compliance-automation-panel .scan-auto-actions .btn-p::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14'/%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.ai-assist-page .compliance-automation-panel .scan-auto-actions .btn-p:hover:not(:disabled),
.ai-assistant-page .compliance-automation-panel .scan-auto-actions .btn-p:hover:not(:disabled) {
  background: linear-gradient(135deg, #4f46e5 0%, #2562ff 100%) !important;
  box-shadow: 0 4px 14px rgba(99, 102, 241, 0.35);
  transform: translateY(-1px);
}

.ai-assist-page .compliance-auto-runs,
.ai-assistant-page .compliance-auto-runs {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 15px;
  color: #475569;
}

.ai-assist-page .compliance-auto-run,
.ai-assistant-page .compliance-auto-run {
  padding: 12px 14px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  border-bottom: none;
}

.ai-assist-page .compliance-auto-run .scan-auto-badge,
.ai-assistant-page .compliance-auto-run .scan-auto-badge {
  font-size: 13px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
}

.ai-assist-page .cr-table-empty,
.ai-assistant-page .cr-table-empty {
  font-size: 16px;
  line-height: 1.55;
  color: #3668e9;
}


/* ─── AI Review Queue ─── */
.ai-review-page {
  display: flex;
  flex-direction: column;
  gap: var(--ds-space-xl);
}

.ai-review-page > div:first-child {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end !important;
  justify-content: space-between;
  gap: var(--ds-space-lg);
  padding: var(--ds-space-xl) var(--ds-space-2xl);
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, #fff 48%, rgba(13, 148, 136, 0.04) 100%);
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.ai-review-page > div:first-child > div:last-child {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-left: auto;
  flex-shrink: 0;
}

.ai-review-page h2 {
  margin: 0 0 6px !important;
  font-size: clamp(24px, 2.2vw, 30px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0f172a;
}

.ai-review-page > div:first-child > div:first-child p,
.ai-review-page > p[style*="color"] {
  margin: 0 !important;
  font-size: 16px;
  line-height: 1.6;
  color: #3668e9 !important;
}

.ai-review-page .field {
  max-width: none !important;
  flex-direction: row;
}

.ai-review-page .websites-site-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  margin: 0 0 0;
  padding: 6px 12px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
}

.ai-review-page .websites-site-label::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.ai-review-page .field > .websites-site-label + div {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 0 !important;
  padding: 5px 12px;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.45;
  color: #312e81 !important;
  word-break: break-all;
  background: #fff;
  border: 1px solid #e0e7ff;
  border-radius: 10px;
}

.ai-review-page .field > .websites-site-label + div::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.ai-review-page .field > .websites-site-label + div + div {
  margin-top: 8px !important;
  font-size: 14px !important;
  color: #3668e9 !important;
}

.ai-review-page .card {
  padding: var(--ds-space-xl) var(--ds-space-2xl) !important;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.ai-review-page div[style*="320px 1fr"] > .card:first-child > strong {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 4px;
  padding: 6px 12px;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
  color: #7c3aed;
  background: #f5f3ff;
  border: 1px solid #ddd6fe;
  border-radius: 10px;
}

.ai-review-page div[style*="320px 1fr"] > .card:first-child > strong::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 6h13'/%3E%3Cpath d='M8 12h13'/%3E%3Cpath d='M8 18h13'/%3E%3Cpath d='M3 6h.01'/%3E%3Cpath d='M3 12h.01'/%3E%3Cpath d='M3 18h.01'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.ai-review-page > div:first-child > div:last-child .btn.secondary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 16px;
  font-size: 15px;
  font-weight: 600;
  border-radius: 10px;
  text-decoration: none;
  box-shadow: none;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

.ai-review-page > div:first-child > div:last-child .btn.secondary::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background-position: center;
  background-size: 16px 16px;
  background-repeat: no-repeat;
}

.ai-review-page > div:first-child > div:last-child .btn.secondary:nth-child(1) {
  color: #0369a1 !important;
  background: #f0f9ff !important;
  border: 1px solid #bae6fd !important;
}

.ai-review-page > div:first-child > div:last-child .btn.secondary:nth-child(1):hover {
  color: #075985 !important;
  background: #e0f2fe !important;
  border-color: #7dd3fc !important;
  transform: translateY(-1px);
}

.ai-review-page > div:first-child > div:last-child .btn.secondary:nth-child(1)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230369a1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18'/%3E%3Cpath d='M18 17V9'/%3E%3Cpath d='M13 17V5'/%3E%3Cpath d='M8 17v-3'/%3E%3C/svg%3E");
}

.ai-review-page > div:first-child > div:last-child .btn.secondary:nth-child(2) {
  color: #047857 !important;
  background: #ecfdf5 !important;
  border: 1px solid #a7f3d0 !important;
}

.ai-review-page > div:first-child > div:last-child .btn.secondary:nth-child(2):hover {
  color: #065f46 !important;
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
  transform: translateY(-1px);
}

.ai-review-page > div:first-child > div:last-child .btn.secondary:nth-child(2)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3Cpath d='M11 8v6'/%3E%3Cpath d='M8 11h6'/%3E%3C/svg%3E");
}

.ai-review-page .btn.secondary {
  min-height: 40px;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 10px;
}

.ai-review-page .error {
  padding: 12px 16px;
  font-size: 14px;
  border-radius: 10px;
}

/* ─── AI Usage (Intelligence Usage) — spacing + typography (+2px) ─── */
.ai-usage-page {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 0 !important;
}

.ai-usage-page > * + * {
  margin-top: 0 !important;
}

.ai-usage-page .ai-usage-head {
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0;
  padding: 22px 24px;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, #fff 48%, rgba(13, 148, 136, 0.04) 100%);
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.ai-usage-page .ai-usage-breadcrumb {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #4f46e5;
}

.ai-usage-page .ai-usage-title,
.ai-set-page .ai-set-title {
  margin: 0;
  font-size: clamp(28px, 2.2vw, 34px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0f172a;
}

.ai-usage-page .ai-usage-title-dark,
.ai-usage-page .ai-usage-title-purple {
  color: #0f172a;
}

.ai-usage-page .ai-usage-sub {
  margin-top: 10px;
  font-size: 16px;
  line-height: 1.55;
  color: #3668e9;
}

.ai-usage-page .ai-usage-head-actions {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

.ai-usage-page .ai-usage-select-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.ai-usage-page .ai-usage-select {
  appearance: none;
  -webkit-appearance: none;
  min-height: 42px;
  min-width: 168px;
  padding: 0 40px 0 14px;
  font-size: 15px;
  font-weight: 600;
  color: #312e81;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 10px;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.ai-usage-page .ai-usage-select:hover {
  background: #e0e7ff;
  border-color: #a5b4fc;
}

.ai-usage-page .ai-usage-select:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.18);
}

.ai-usage-page .ai-usage-chevron {
  display: none;
}

.ai-usage-page .ai-usage-select-wrap::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  width: 16px;
  height: 16px;
  transform: translateY(-50%);
  pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.ai-usage-page .ai-usage-refresh {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 10px;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.ai-usage-page .ai-usage-refresh:hover:not(:disabled) {
  background: #e0e7ff;
  border-color: #a5b4fc;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.15);
}

.ai-usage-page .ai-usage-refresh:focus-visible {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.18);
}

.ai-usage-page .ai-usage-refresh:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

.ai-usage-page .ai-usage-refresh svg {
  width: 18px;
  height: 18px;
  stroke: #2562ff;
}

.ai-usage-page .ai-usage-stats {
  gap: 16px;
  margin-top: 0;
}

.ai-usage-page .ai-usage-stat-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  min-height: 104px;
  height: auto;
  padding: 18px 20px;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.04);
}

.ai-usage-page .ai-usage-stat-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.ai-usage-page .ai-usage-stat-label::before {
  content: "";
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background-position: center;
  background-size: 16px 16px;
  background-repeat: no-repeat;
}

.ai-usage-page .ai-usage-stat-card:nth-child(1) .ai-usage-stat-label {
  color: #2562ff;
}

.ai-usage-page .ai-usage-stat-card:nth-child(1) .ai-usage-stat-label::before {
  background-color: #eef2ff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='8' x='2' y='2' rx='2' ry='2'/%3E%3Crect width='20' height='8' x='2' y='14' rx='2' ry='2'/%3E%3Cpath d='M6 6h.01M6 18h.01'/%3E%3C/svg%3E");
}

.ai-usage-page .ai-usage-stat-card:nth-child(2) .ai-usage-stat-label {
  color: #6d28d9;
}

.ai-usage-page .ai-usage-stat-card:nth-child(2) .ai-usage-stat-label::before {
  background-color: #f5f3ff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15.5 7.5 2.3 2.3a1 1 0 0 0 1.4 0l2.1-2.1a1 1 0 0 0 0-1.4L19 4'/%3E%3Cpath d='m21 2-9.6 9.6'/%3E%3Ccircle cx='7.5' cy='15.5' r='5.5'/%3E%3C/svg%3E");
}

.ai-usage-page .ai-usage-stat-card:nth-child(3) .ai-usage-stat-label {
  color: #0369a1;
}

.ai-usage-page .ai-usage-stat-card:nth-child(3) .ai-usage-stat-label::before {
  background-color: #f0f9ff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230369a1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z'/%3E%3C/svg%3E");
}

.ai-usage-page .ai-usage-stat-card:nth-child(4) .ai-usage-stat-label {
  color: #047857;
}

.ai-usage-page .ai-usage-stat-card:nth-child(4) .ai-usage-stat-label::before {
  background-color: #ecfdf5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21.801 10A10 10 0 1 1 17 3.335'/%3E%3Cpath d='m9 11 2 2 4-4'/%3E%3C/svg%3E");
}

.ai-usage-page .ai-usage-stat-card:nth-child(5) .ai-usage-stat-label {
  color: #b45309;
}

.ai-usage-page .ai-usage-stat-card:nth-child(5) .ai-usage-stat-label::before {
  background-color: #fffbeb;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' x2='12' y1='2' y2='22'/%3E%3Cpath d='M17 5H9.5a3.5 3.5 0 0 0 0 7h5a3.5 3.5 0 0 1 0 7H6'/%3E%3C/svg%3E");
}

.ai-usage-page .ai-usage-stat-value {
  align-self: flex-start;
  width: 100%;
  margin-top: 10px;
  margin-bottom: 9px;
  font-size: 30px;
  line-height: 1.1;
  text-align: left;
}

.ai-usage-page .ai-usage-stat-sub {
  align-self: flex-start;
  margin-top: 8px;
  font-size: 14px;
  text-align: left;
}

.ai-usage-page .ai-usage-stat-sub--muted,
.ai-usage-page .ai-usage-stat-sub--green-cap {
  align-self: flex-start;
  font-size: 12px;
  line-height: 1.35;
  text-align: left;
}

.ai-usage-page .ai-usage-chart-card {
  margin-top: 0;
  padding: 22px 24px;
}

.ai-usage-page .ai-usage-chart-head {
  gap: 12px;
  margin-bottom: 14px;
}

.ai-usage-page .ai-usage-chart-title,
.ai-usage-page .ai-usage-panel-label {
  margin-bottom: 16px;
  font-size: 15px;
  line-height: 1.3;
}

.ai-usage-page .ai-usage-legend-item {
  font-size: 14px;
}

.ai-usage-page .ai-usage-legend-note {
  font-size: 15px;
}

.ai-usage-page .ai-usage-chart-empty-title {
  font-size: 16px;
}

.ai-usage-page .ai-usage-chart-empty-sub {
  font-size: 14px;
}

.ai-usage-page .ai-usage-bottom {
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  align-items: stretch;
  gap: 16px;
  margin-top: 0;
}

.ai-usage-page .ai-usage-panel {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 100%;
  padding: 22px 24px;
  box-sizing: border-box;
}

.ai-usage-page .ai-usage-panel-label {
  flex-shrink: 0;
  margin-bottom: 14px;
}

.ai-usage-page .ai-usage-feature-row {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 12px;
  row-gap: 8px;
  padding: 14px 0;
  border-bottom: 1px solid #eaeaea;
}

.ai-usage-page .ai-usage-feature-row:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.ai-usage-page .ai-usage-feature-icon {
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: center;
  width: 40px;
  height: 40px;
  line-height: 43px;
}

.ai-usage-page .ai-usage-feature-mid {
  display: contents;
}

.ai-usage-page .ai-usage-feature-name {
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  min-width: 0;
  font-size: 16px;
  line-height: 1.3;
}

.ai-usage-page .ai-usage-feature-bar-track {
  grid-column: 2;
  grid-row: 2;
  align-self: center;
  width: 100%;
  margin-top: 0;
  height: 6px;
  border-radius: 999px;
}

.ai-usage-page .ai-usage-feature-bar-fill {
  border-radius: 999px;
}

.ai-usage-page .ai-usage-feature-right {
  grid-column: 3;
  grid-row: 1 / 3;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: center;
  gap: 2px;
  align-self: center;
  min-width: 104px;
  padding-left: 12px;
  text-align: right;
}

.ai-usage-page .ai-usage-feature-right > div:first-child {
  display: inline-flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 4px;
  white-space: nowrap;
}

.ai-usage-page .ai-usage-feature-tokens {
  font-size: 16px;
  line-height: 1.2;
}

.ai-usage-page .ai-usage-feature-suffix {
  font-size: 13px;
  color: #3668e9;
}

.ai-usage-page .ai-usage-feature-pct {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 4px;
  padding: 3px 10px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
}

.ai-usage-page .ai-usage-empty-panel {
  font-size: 16px;
}

.ai-usage-page .ai-usage-quota-head {
  align-items: center;
  gap: 12px;
}

.ai-usage-page .ai-usage-quota-title {
  font-size: 15px;
  line-height: 1.35;
}

.ai-usage-page .ai-usage-quota-nums {
  font-size: 16px;
  line-height: 1.2;
  white-space: nowrap;
}

.ai-usage-page .ai-usage-quota-reset {
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.35;
}

.ai-usage-page .ai-usage-quota-track {
  margin-top: 12px;
  height: 8px;
}

.ai-usage-page .ai-usage-quota-byok-note {
  margin-top: 12px;
  font-size: 15px;
  line-height: 1.5;
}

.ai-usage-page .ai-usage-warn-title {
  font-size: 14px;
}

.ai-usage-page .ai-usage-warn-text {
  font-size: 14px;
}

.ai-usage-page .ai-usage-upgrade-btn {
  min-height: 36px;
  font-size: 14px;
}

.ai-usage-page .ai-usage-divider {
  margin: 16px 0;
}

.ai-usage-page .ai-usage-rate-label {
  font-size: 13px;
}

.ai-usage-page .ai-usage-rate-values {
  margin-top: 8px;
  font-size: 16px;
}

.ai-usage-page .ai-usage-loading,
.ai-usage-page .ai-usage-error {
  font-size: 16px;
}

@media (max-width: 1024px) {
  .ai-usage-page .ai-usage-head {
    flex-direction: column;
    align-items: stretch;
  }

  .ai-usage-page .ai-usage-head-actions {
    margin-left: 0;
    justify-content: flex-end;
    width: 100%;
  }

  .ai-usage-page .ai-usage-bottom {
    grid-template-columns: 1fr;
  }

  .ai-usage-page .ai-usage-panel {
    min-height: 0;
  }
}

@media (max-width: 560px) {
  .ai-usage-page .ai-usage-feature-row {
    grid-template-columns: 36px minmax(0, 1fr) auto;
    column-gap: 10px;
    row-gap: 8px;
  }

  .ai-usage-page .ai-usage-feature-icon {
    width: 36px;
    height: 36px;
  }

  .ai-usage-page .ai-usage-feature-bar-track {
    grid-column: 2 / -1;
  }

  .ai-usage-page .ai-usage-feature-right {
    min-width: 88px;
    padding-left: 8px;
  }
}

.ai-set-page .ai-set-input {
  min-height: 44px;
  border-radius: 10px;
}

.ai-set-page .ai-set-switch {
  border-radius: 999px;
}

/* ─── AI Settings (Intelligence Settings) — hero header like Usage ─── */
.ai-set-page {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 0 !important;
}

.ai-set-page > * + * {
  margin-top: 0 !important;
}

.ai-set-page .ai-set-head {
  align-items: end;
  justify-content: space-between;
  gap: 16px;
  margin: 0;
  padding: 22px 24px;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, #fff 48%, rgba(13, 148, 136, 0.04) 100%);
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.ai-set-page .ai-set-breadcrumb {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #4f46e5;
}

.ai-set-page .ai-set-title {
  margin: 0 !important;
}

.ai-set-page .ai-set-title-dark,
.ai-set-page .ai-set-title-purple {
  color: #0f172a !important;
}

.ai-set-page .ai-set-sub {
  margin-top: 10px !important;
  font-size: 16px;
  line-height: 1.55;
  color: #3668e9;
}

.ai-set-page .ai-set-sub .contextual-help-link {
  font-weight: 600;
  color: #2562ff;
  text-decoration: none;
}

.ai-set-page .ai-set-sub .contextual-help-link:hover {
  color: #3730a3;
  text-decoration: underline;
}

.ai-set-page .ai-set-stagger-right {
  flex-shrink: 0;
  margin-left: auto;
}

.ai-set-page .ai-set-save {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  height: auto;
  padding: 0 20px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0;
  color: #fff !important;
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%) !important;
  border: none !important;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.28);
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.ai-set-page .ai-set-save:hover:not(:disabled) {
  background: linear-gradient(135deg, #4f46e5 0%, #2562ff 100%) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(99, 102, 241, 0.35);
}

.ai-set-page .ai-set-save:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.ai-set-page .ai-set-save svg {
  width: 18px;
  height: 18px;
}
@media (max-width: 1024px) {
  .ai-set-page .ai-set-head {
    flex-direction: column;
    align-items: stretch;
  }

  .ai-set-page .ai-set-stagger-right {
    margin-left: 0;
    display: flex;
    width: 100%;
  }
}

/* ─── AI Settings — cards & form controls (red-marked areas) ─── */
.ai-set-page .ai-set-grid {
  gap: 20px;
  margin-top: 0 !important;
}

.ai-set-page .ai-set-grid > div {
  display: flex;
  flex-direction: column;
  gap: 20px;
  min-width: 0;
}

.ai-set-page .ai-set-grid > div .ai-set-mt {
  margin-top: 0 !important;
}

.ai-set-page .ai-set-card,
.ai-set-page .ai-set-card.ai-set-card--tight {
  padding: 22px 24px !important;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.ai-set-page .ai-set-panel-head,
.ai-set-page .ai-set-panel-head.ai-set-panel-head--sm {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}

.ai-set-page .ai-set-panel-ico,
.ai-set-page .ai-set-panel-ico.ai-set-panel-ico--sm {
  grid-column: 1;
  grid-row: 1;
  width: 44px !important;
  height: 44px !important;
  border-radius: 12px;
  border: 1px solid #e0e7ff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.ai-set-page .ai-set-panel-ico.ai-set-panel-ico--sm {
  width: 40px !important;
  height: 40px !important;
}

.ai-set-page .ai-set-panel-ico svg {
  width: 20px !important;
  height: 20px !important;
}

.ai-set-page .ai-set-panel-title {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.3;
  color: #0f172a;
}

.ai-set-page .ai-set-model-grid {
  gap: 20px;
  align-items: start;
}

.ai-set-page .ai-set-field-label,
.ai-set-page .ai-set-dt-label {
  gap: 6px;
  margin: 0 0 4px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #3f4956;
}

.ai-set-page .ai-set-field-label[style*="marginTop"] {
  margin-top: 16px !important;
}

.ai-set-page .ai-set-sub-label {
  margin: 0 0 10px !important;
  font-size: 13px;
  line-height: 1.45;
  color: #758396;
}

.ai-set-page .ai-set-hint {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-left: 4px;
  font-size: 11px;
  font-weight: 700;
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
}

.ai-set-page .ai-set-select-wrap {
  position: relative;
  display: block;
  width: 100%;
}

.ai-set-page .ai-set-select,
.ai-set-page .ai-set-input {
  box-sizing: border-box;
  width: 100%;
  min-height: 46px;
  height: auto;
  padding: 0 14px;
  font-size: 16px;
  font-weight: 500;
  color: #0f172a;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ai-set-page .ai-set-select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 40px;
  cursor: pointer;
}

.ai-set-page .ai-set-select:hover,
.ai-set-page .ai-set-input:hover:not(:disabled) {
  border-color: #c7d2fe;
}

.ai-set-page .ai-set-select:focus,
.ai-set-page .ai-set-input:focus {
  border-color: #6366f1;
  outline: none;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.ai-set-page .ai-set-chevron {
  display: none;
}

.ai-set-page .ai-set-select-wrap::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  width: 16px;
  height: 16px;
  transform: translateY(-50%);
  pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.ai-set-page .ai-set-divider {
  margin: 18px 0;
}

.ai-set-page .ai-set-divider.ai-set-divider--sm {
  margin: 14px 0;
}

.ai-set-page .ai-set-temp-row {
  gap: 14px;
  margin-top: 10px;
  align-items: center;
}

.ai-set-page .ai-set-temp-val {
  min-width: 40px;
  font-size: 18px;
  font-weight: 700;
  color: #2562ff;
}

.ai-set-page .ai-set-row {
  align-items: flex-start;
  gap: 14px;
  padding: 16px 0;
}
.ai-set-page .ai-set-row:first-child {
  padding-top: 0 !important;
}
.ai-set-page .ai-set-row-title {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.35;
  color: #0f172a;
}

.ai-set-page .ai-set-row-desc {
  max-width: none;
  margin-top: 4px;
  font-size: 14px;
  line-height: 1.5;
  color: #3668e9;
  margin-bottom: 0;
}

.ai-set-page .ai-set-switch {
  margin-top: 2px;
}

.ai-set-page .ai-set-quote {
  margin: 0;
  padding: 14px 16px;
  font-size: 15px;
  line-height: 1.55;
  color: #475569;
  background: #f8fafc;
  border-left: 3px solid #6366f1;
  border-radius: 0 10px 10px 0;
}

.ai-set-page .ai-set-callout {
  margin: 12px 0 0 !important;
  padding: 12px 14px;
  font-size: 15px;
  line-height: 1.5;
  color: #1e40af;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
}

.ai-set-page .ai-set-callout code {
  font-size: 14px;
  font-weight: 600;
  color: #1d4ed8;
}

.ai-set-page .ai-set-card > div:has(> .ai-set-input) {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.ai-set-page .ai-set-card > div:has(> .ai-set-input) .ai-set-input {
  flex: 1 1 220px;
  min-width: 0;
  width: auto;
}

.ai-set-page .ai-set-inline-actions {
  gap: 10px;
  margin-top: 12px;
  align-items: center;
}

.ai-set-page .ai-set-btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  height: auto;
  padding: 0 16px;
  font-size: 15px;
  font-weight: 600;
  border-radius: 10px;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.ai-set-page .ai-set-btn-ghost::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background-position: center;
  background-size: 16px 16px;
  background-repeat: no-repeat;
}

.ai-set-page .ai-set-card > div:has(> .ai-set-input) .ai-set-btn-ghost {
  flex-shrink: 0;
  color: #2562ff !important;
  background: #eef2ff !important;
  border: 1px solid #c7d2fe !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.ai-set-page .ai-set-card > div:has(> .ai-set-input) .ai-set-input + .ai-set-btn-ghost::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.ai-set-page .ai-set-card > div:has(> .ai-set-input) .ai-set-btn-ghost:hover:not(:disabled) {
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.15);
}

.ai-set-page .ai-set-inline-actions .ai-set-btn-ghost {
  color: #047857 !important;
  background: #ecfdf5 !important;
  border: 1px solid #a7f3d0 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.ai-set-page .ai-set-inline-actions .ai-set-btn-ghost::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22v-5'/%3E%3Cpath d='M9 17h6'/%3E%3Cpath d='M8 12a4 4 0 0 1 4-4h1a3 3 0 0 1 0 6H9a2 2 0 0 0-2 2v1'/%3E%3Cpath d='m7 17-2 2'/%3E%3Cpath d='M8 7 6 5'/%3E%3Cpath d='m17 17 2 2'/%3E%3Cpath d='m18 7 2-2'/%3E%3C/svg%3E");
}

.ai-set-page .ai-set-inline-actions .ai-set-btn-ghost:hover:not(:disabled) {
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(5, 150, 105, 0.15);
}

.ai-set-page .ai-set-api-block {
  margin-top: 12px;
}

.ai-set-page .ai-set-status {
  margin-top: 12px;
  font-size: 16px;
  line-height: 1.5;
  margin-bottom: 0;
}

.ai-set-page .ai-set-upsell {
  margin-top: 0 !important;
  padding: 22px 24px;
  border-radius: 16px;
}

.ai-set-page .ai-set-upsell h3 {
  margin-top: 10px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
}

.ai-set-page .ai-set-upsell p {
  margin-top: 8px;
  font-size: 15px;
  line-height: 1.55;
}

.ai-set-page .ai-set-upsell-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  min-height: 40px;
  height: auto;
  margin-top: 16px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 700;
  color: #2562ff !important;
  background: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.65) !important;
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.14);
  text-decoration: none;
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.ai-set-page .ai-set-upsell-cta::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7.9 20A9 9 0 1 0 4 16.1L2 22Z'/%3E%3Cpath d='M8 12h8'/%3E%3Cpath d='M12 8v8'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.ai-set-page .ai-set-upsell-cta:hover {
  background: #f5f3ff !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.18);
}

@media (max-width: 720px) {
  .ai-set-page .ai-set-model-grid {
    gap: 16px;
  }

  .ai-set-page .ai-set-card > div:has(> .ai-set-input) .ai-set-input {
    flex: 1 1 100%;
  }
}

/* ─── Modules (Integrations) — premium hub layout ─── */
.mod-page header.mod-stagger {
  margin-top: 0;
  padding: 22px 24px;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, #fff 48%, rgba(13, 148, 136, 0.04) 100%);
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.mod-page .mod-breadcrumb {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #4f46e5;
}

.mod-page .mod-title {
  margin: 0;
  font-size: clamp(26px, 2.2vw, 32px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0f172a;
}

.mod-page .mod-subtitle {
  margin: 10px 0 0;
  font-size: 16px;
  line-height: 1.6;
  color: #3668e9;
  display: flex;
  justify-content: space-between;
}

.mod-page .mod-subtitle .contextual-help-link {
  font-size: 16px;
  font-weight: 600;
  color: #4f46e5;
  text-decoration: none;
}

.mod-page .mod-subtitle .contextual-help-link:hover {
  color: #2562ff;
  text-decoration: underline;
}

/* Status note + Active Site ID — highlighted panel */
.mod-page .mod-status-msg {
  margin: 24px 0 0;
  font-size: 16px;
  font-weight: 500;
  color: #92400e;
}

.mod-page .mod-site-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 24px;
  padding: 18px 22px;
  background: linear-gradient(180deg, #eef2ff 0%, #fff 100%);
  border: 1px solid #c7d2fe;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.mod-page .mod-status-msg + .mod-site-banner {
  margin: 24px 0 21px;
  padding: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.55;
  color: #92400e;
  border: none;
  background: none;
  box-shadow: none;
}

.mod-page .mod-site-banner-left {
  flex: 1;
  min-width: 0;
  align-items: center;
  gap: 14px;
  padding: 12px 16px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.mod-page .mod-globe-wrap {
  width: 40px;
  height: 40px;
  color: #2562ff;
  background: #e0e7ff;
  border: 1px solid #c7d2fe;
  border-radius: 10px;
}

.mod-page .mod-globe-wrap svg {
  width: 20px;
  height: 20px;
}

.mod-page .mod-site-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3668e9;
}

.mod-page .mod-site-value {
  margin-top: 4px;
  font-size: 16px;
  font-weight: 600;
  color: #2562ff;
}

.mod-page .mod-copy-id-btn {
  min-height: 46px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 600;
  color: #047857;
  background: #ecfdf5;
  border: 1.5px solid #a7f3d0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.mod-page .mod-copy-id-btn:hover:not(:disabled) {
  color: #065f46;
  background: #d1fae5;
  border-color: #6ee7b7;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.15);
}

.mod-page .mod-copy-id-btn svg {
  width: 18px;
  height: 18px;
  color: #047857;
}

/* Module cards */
.mod-page .mod-grid {
  gap: 16px;
  margin-top: 24px;
}

.mod-page .mod-card {
  padding: 22px 24px 24px;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.mod-page .mod-card:hover {
  transform: translateY(-1px);
  border-color: #cbd5e1;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

.mod-page .mod-card-head {
  align-items: flex-start;
  gap: 16px;
  padding-bottom: 4px;
}

.mod-page .mod-card-head-left {
  align-items: center;
  gap: 14px;
}

.mod-page .mod-icon-box {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  color: #4f46e5;
}

.mod-page .mod-icon-box svg {
  width: 22px;
  height: 22px;
}

.mod-page .mod-grid .mod-card:nth-child(1) .mod-icon-box {
  background: #e0e7ff;
  border-color: #c7d2fe;
  color: #2562ff;
}

.mod-page .mod-grid .mod-card:nth-child(2) .mod-icon-box {
  background: #dbeafe;
  border-color: #bfdbfe;
  color: #2563eb;
}

.mod-page .mod-grid .mod-card:nth-child(3) .mod-icon-box {
  background: #fce7f3;
  border-color: #fbcfe8;
  color: #db2777;
}

.mod-page .mod-grid .mod-card:nth-child(4) .mod-icon-box {
  background: #d1fae5;
  border-color: #a7f3d0;
  color: #059669;
}

.mod-page .mod-grid .mod-card:nth-child(5) .mod-icon-box {
  background: #fef3c7;
  border-color: #fde68a;
  color: #d97706;
}

.mod-page .mod-grid .mod-card:nth-child(6) .mod-icon-box {
  background: #ede9fe;
  border-color: #ddd6fe;
  color: #7c3aed;
}

.mod-page .mod-card-name {
  margin: 0 0 3px 0;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.25;
  color: #0f172a;
}

.mod-page .mod-card-type {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  color: #6366f1;
}

.mod-page .mod-grid .mod-card:nth-child(2) .mod-card-type {
  color: #2563eb;
}

.mod-page .mod-card-head .cs-readiness-badge {
  flex-shrink: 0;
  font-size: 14px;
  font-weight: 600;
  padding: 5px 13px;
  border-radius: 999px;
}

.mod-page .mod-card-badges .cs-readiness-badge {
  font-size: 13px;
  padding: 5px 13px;
}

/* Configure / secondary actions */
.mod-page .mod-btn-secondary {
  min-height: 46px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 600;
  color: #2562ff;
  background: #eef2ff;
  border: 1.5px solid #c7d2fe;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.mod-page .mod-btn-secondary:hover {
  color: #3730a3;
  background: #e0e7ff;
  border-color: #a5b4fc;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.12);
}

.mod-page .mod-btn-secondary svg {
  width: 16px;
  height: 16px;
  color: #2562ff;
}

.mod-page .mod-btn-primary {
  min-height: 46px;
  font-size: 15px;
  font-weight: 600;
  border-radius: 12px;
}

/* Integration guides CTA — highlighted footer banner */
.mod-page .mod-footer-link {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 14px;
  width: 100%;
  margin-top: 32px;
  padding: 11px 12px;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.4;
  text-transform: none;
  color: #334155;
  text-decoration: none;
  background: linear-gradient(135deg, #eef2ff 0%, #fff 52%, #f0fdfa 100%);
  border: 1px solid #c7d2fe;
  border-radius: 14px;
}

.mod-page .mod-footer-link > svg:first-child {
  flex-shrink: 0;
  box-sizing: content-box;
  width: 18px;
  height: 18px;
  padding: 9px;
  color: #4f46e5;
  background: #fff;
  border: 1px solid #c7d2fe;
  border-radius: 10px;
}

.mod-page .mod-footer-link > svg:last-child {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-left: auto;
  color: #6366f1;
  transition: transform 0.15s ease, color 0.15s ease;
}

.mod-page .mod-footer-link:hover {
  color: #2562ff;
  border-color: #a5b4fc;
  background: linear-gradient(135deg, #e0e7ff 0%, #fff 52%, #ecfdf5 100%);
  transform: translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 4px 16px rgba(99, 102, 241, 0.12);
}

.mod-page .mod-footer-link:hover > svg:first-child {
  color: #2562ff;
  border-color: #a5b4fc;
  background: #eef2ff;
}

.mod-page .mod-footer-link:hover > svg:last-child {
  color: #2562ff;
  transform: translateX(3px);
}

.mod-page .mod-footer-link:focus-visible {
  outline: none;
  border-color: #6366f1;
  box-shadow:
    0 0 0 3px rgba(99, 102, 241, 0.2),
    0 4px 16px rgba(99, 102, 241, 0.1);
}

/* ─── Translations workflow ─── */
.translations-page.translations-page--workflow .translations-header h1,
.translations-page.translations-page--workflow .page-shell__header h1,
.translations-page.translations-page--workflow .tx-header__title {
  font-size: clamp(28px, 2.2vw, 34px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0f172a;
}

.translations-page.translations-page--workflow .tx-header {
  margin-bottom: 20px;
  padding: 22px 24px;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.translations-page.translations-page--workflow .tx-header__top {
  align-items: center;
  gap: 16px;
  margin-bottom: 18px;
}

.translations-page.translations-page--workflow .tx-header__property {
  padding: 8px 12px;
  font-size: 14px;
  font-weight: 600;
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 10px;
  word-break: break-all;
}

.translations-page.translations-page--workflow .tx-header__controls {
  display: grid;
  grid-template-columns: minmax(120px, auto) minmax(200px, 280px) auto;
  grid-template-rows: auto auto;
  column-gap: 20px;
  row-gap: 8px;
  align-items: center;
}

.translations-page.translations-page--workflow .tx-header__field {
  display: contents;
}

.translations-page.translations-page--workflow .tx-header__field:nth-child(1) .tx-header__label {
  grid-column: 1;
  grid-row: 1;
}

.translations-page.translations-page--workflow .tx-header__field:nth-child(1) .tx-header__value {
  grid-column: 1;
  grid-row: 2;
}

.translations-page.translations-page--workflow .tx-header__field:nth-child(2) .tx-header__label {
  grid-column: 2;
  grid-row: 1;
}

.translations-page.translations-page--workflow .tx-header__field:nth-child(2) .tx-header__select {
  grid-column: 2;
  grid-row: 2;
}

.translations-page.translations-page--workflow .tx-header__generate {
  grid-column: 3;
  grid-row: 2;
  align-self: center;
  justify-self: start;
}

.translations-page.translations-page--workflow .tx-header__label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 20px;
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.2;
  color: #3668e9;
}

.translations-page.translations-page--workflow .tx-header__value {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 44px;
  margin: 0;
  padding: 0 14px;
  font-size: 17px;
  font-weight: 600;
  color: #0f172a;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
}

.translations-page.translations-page--workflow .tx-header__select,
.translations-page.translations-page--workflow .tx-header__field:nth-child(2) .cs-select {
  width: 100%;
  min-height: 44px;
  margin: 0;
  font-size: 16px;
}

.translations-page.translations-page--workflow .tx-header__generate {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 0 18px;
  font-size: 16px;
  font-weight: 600;
  color: #fff !important;
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%) !important;
  border: none !important;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.28);
  white-space: nowrap;
}

.translations-page.translations-page--workflow .tx-header__generate::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 8 6 6'/%3E%3Cpath d='m4 14 6-6 2-3'/%3E%3Cpath d='M2 5h12'/%3E%3Cpath d='M7 2h1'/%3E%3Cpath d='m22 22-5-10-5 10'/%3E%3Cpath d='M14 18h6'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.translations-page.translations-page--workflow .tx-header__generate:hover:not(:disabled) {
  background: linear-gradient(135deg, #4f46e5 0%, #2562ff 100%) !important;
  box-shadow: 0 4px 14px rgba(99, 102, 241, 0.35);
  transform: translateY(-1px);
}

.translations-page.translations-page--workflow .tx-step {
  margin-bottom: 18px;
  padding: 20px 22px;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.translations-page.translations-page--workflow .tx-step__head {
  gap: 12px;
  margin-bottom: 16px;
}

.translations-page.translations-page--workflow .tx-step__badge {
  padding: 5px 10px;
  font-size: 12px;
}

.translations-page.translations-page--workflow .tx-step__title {
  font-size: 18px;
}

.translations-page.translations-page--workflow .tx-status-row {
  gap: 14px;
}

.translations-page.translations-page--workflow .tx-status-item {
  gap: 8px;
  padding: 14px 16px;
}

.translations-page.translations-page--workflow .tx-status-item__label {
  font-size: 15px;
}

.translations-page.translations-page--workflow .tx-status-item__value {
  font-size: 16px;
}

.translations-page.translations-page--workflow .tx-status-pill {
  padding: 4px 16px;
  font-size: 15px;
}

.translations-page.translations-page--workflow .tx-editor {
  border-radius: 12px;
}

.translations-page.translations-page--workflow .tx-editor__head,
.translations-page.translations-page--workflow .tx-editor__row {
  grid-template-columns: minmax(72px, 96px) minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px 16px;
  align-items: start;
  padding: 12px 16px;
}

.translations-page.translations-page--workflow .tx-editor__head {
  font-size: 13px;
  padding: 12px 16px;
}

.translations-page.translations-page--workflow .tx-editor__key {
  padding-top: 8px;
  font-size: 13px;
  word-break: break-word;
}

.translations-page.translations-page--workflow .tx-editor__source {
  padding-top: 6px;
  font-size: 15px;
  line-height: 1.55;
}

.translations-page.translations-page--workflow .tx-editor__input {
  min-height: 44px;
  padding: 10px 12px;
  font-size: 15px;
  line-height: 1.55;
  border-radius: 10px;
}

.translations-page.translations-page--workflow .tx-editor__body {
  max-height: 460px;
}

.translations-page.translations-page--workflow .tx-empty-hint,
.translations-page.translations-page--workflow .tx-drawer-note,
.translations-page.translations-page--workflow .tx-quota-line {
  font-size: 15px;
  line-height: 1.55;
}

.translations-page.translations-page--workflow .tx-preview-frame {
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  overflow: hidden;
  background: #f8fafc;
}

.translations-page.translations-page--workflow .tx-preview-frame .banner-preview-premium {
  min-height: 420px;
  background: #fff;
}

.translations-page.translations-page--workflow .tx-preview-frame .banner-preview-premium-head.preview-topbar {
  display: grid;
  grid-template-columns: minmax(72px, auto) 1fr auto;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  height: 52px;
  margin: 0;
  padding: 0 16px;
  flex-wrap: nowrap;
  background: #0f172a;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-topbar-left,
.translations-page.translations-page--workflow .tx-preview-frame .preview-topbar-center,
.translations-page.translations-page--workflow .tx-preview-frame .preview-topbar-right {
  display: flex;
  align-items: center;
  min-width: 0;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-topbar-left {
  justify-content: flex-start;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-topbar-center {
  justify-content: center;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-topbar-right {
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-browser-dots {
  display: flex;
  align-items: center;
  gap: 6px;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  opacity: 0.85;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-dot:first-child {
  background: #ef4444;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-dot:nth-child(2) {
  background: #f59e0b;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-dot:nth-child(3) {
  background: #22c55e;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-live-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: min(100%, 420px);
  min-height: 34px;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
  text-transform: none;
  color: #e2e8f0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 999px;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-live-label svg {
  flex-shrink: 0;
  color: #a5b4fc;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-bg-mode-btns {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 3px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-bg-mode-btn {
  min-height: 30px;
  padding: 5px 12px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.72);
  background: transparent;
  border: none;
  border-radius: 7px;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-bg-mode-btn.is-active {
  color: #fff;
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.35);
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-bg-mode-btn:hover:not(:disabled):not(.is-active) {
  color: #fff;
  background: rgba(255, 255, 255, 0.1);
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-bg-mode-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-device-btns {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 10px;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-device-btn,
.translations-page.translations-page--workflow .tx-preview-frame .banner-preview-device.preview-device-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  min-width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0;
  margin: 0;
  font-size: 0;
  color: rgba(255, 255, 255, 0.72);
  background: transparent;
  border: none;
  border-radius: 7px;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-device-btn svg,
.translations-page.translations-page--workflow .tx-preview-frame .banner-preview-device.preview-device-btn svg {
  width: 16px;
  height: 16px;
  color: currentColor;
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-device-btn.is-active,
.translations-page.translations-page--workflow .tx-preview-frame .preview-device-btn.active,
.translations-page.translations-page--workflow .tx-preview-frame .banner-preview-device.preview-device-btn.is-active,
.translations-page.translations-page--workflow .tx-preview-frame .banner-preview-device.preview-device-btn.active {
  color: #fff;
  background: rgba(99, 102, 241, 0.28);
  box-shadow: inset 0 0 0 1px rgba(165, 180, 252, 0.45);
}

.translations-page.translations-page--workflow .tx-preview-frame .preview-device-btn:hover:not(.is-active):not(.active),
.translations-page.translations-page--workflow .tx-preview-frame .banner-preview-device.preview-device-btn:hover:not(.is-active):not(.active) {
  color: #fff;
  background: rgba(255, 255, 255, 0.1);
}

.translations-page.translations-page--workflow .tx-preview-frame .banner-preview-premium-foot,
.translations-page.translations-page--workflow .tx-preview-frame .preview-footnote {
  padding: 12px 16px;
  font-size: 14px;
  line-height: 1.55;
  color: #3668e9;
  background: #f8fafc;
  border-top: 1px solid #e2e8f0;
}

.translations-page.translations-page--workflow .tx-publish-bar {
  gap: 12px;
  margin-bottom: 18px;
  padding: 16px 18px;
  border-radius: 14px;
}

.translations-page.translations-page--workflow .tx-publish-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  min-width: 200px;
  padding: 0 20px;
  font-size: 16px;
  font-weight: 700;
  color: #fff !important;
  background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
  border: none !important;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(5, 150, 105, 0.25);
}

.translations-page.translations-page--workflow .tx-publish-btn::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.translations-page.translations-page--workflow .tx-publish-btn:hover:not(:disabled) {
  background: linear-gradient(135deg, #047857 0%, #065f46 100%) !important;
  transform: translateY(-1px);
}

.translations-page.translations-page--workflow .tx-publish-bar .btn-outlined {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 46px;
  padding: 0 18px;
  font-size: 16px;
  font-weight: 600;
  border-radius: 12px;
}

.translations-page.translations-page--workflow .tx-publish-bar .btn-outlined:not(:last-child) {
  color: #b45309 !important;
  background: #fffbeb !important;
  border: 1.5px solid #fde68a !important;
}

.translations-page.translations-page--workflow .tx-publish-bar .btn-outlined:not(:last-child)::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6'/%3E%3Cpath d='M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.translations-page.translations-page--workflow .tx-publish-bar .btn-outlined:last-child {
  color: #0369a1 !important;
  background: #f0f9ff !important;
  border: 1.5px solid #bae6fd !important;
}

.translations-page.translations-page--workflow .tx-publish-bar .btn-outlined:last-child::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230369a1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.translations-page.translations-page--workflow .tx-drawers {
  gap: 12px;
}

.translations-page.translations-page--workflow .tx-drawer {
  border-radius: 14px;
}

.translations-page.translations-page--workflow .tx-drawer__summary {
  gap: 12px;
  padding: 14px 18px;
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  transition: background-color 0.15s ease;
}

.translations-page.translations-page--workflow .tx-drawer__summary:hover {
  background: #f8fafc;
}

.translations-page.translations-page--workflow .tx-drawer__summary::before {
  content: "";
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  margin: 0;
  border-radius: 8px;
  border: 1px solid #c7d2fe;
  background-color: #eef2ff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%234f46e5' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px 14px;
  transform: none;
  transition:
    transform 0.2s ease,
    background-color 0.15s ease,
    border-color 0.15s ease;
}

.translations-page.translations-page--workflow .tx-drawer[open] .tx-drawer__summary::before {
  transform: rotate(90deg);
  background-color: #e0e7ff;
  border-color: #a5b4fc;
}

.translations-page.translations-page--workflow .tx-drawer__summary:hover::before {
  background-color: #e0e7ff;
  border-color: #a5b4fc;
}

.translations-page.translations-page--workflow .tx-drawer__body {
  padding: 4px 18px 18px;
}

.translations-page.translations-page--workflow .tx-settings-grid {
  gap: 16px;
  padding-top: 14px;
}

.translations-page.translations-page--workflow .tx-settings-grid .field {
  margin: 0;
}

.translations-page.translations-page--workflow .tx-settings-grid .field-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3668e9;
}

.translations-page.translations-page--workflow .tx-checkbox {
  gap: 10px;
  margin-top: 4px;
  font-size: 15px;
  line-height: 1.5;
}

.translations-page.translations-page--workflow .tx-published-tags {
  gap: 10px;
  margin-top: 14px;
}

.translations-page.translations-page--workflow .translations-locale-tag {
  padding: 6px 12px;
  font-size: 14px;
}

.translations-page.translations-page--workflow .tx-verify-list {
  margin: 14px 0 0;
  font-size: 15px;
}

.translations-page.translations-page--workflow .tx-verify-list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 6px 0;
  line-height: 1.5;
}
.translations-page.translations-page--workflow .tx-verify-list li:first-child {
  padding-top: 0;
}
.translations-page.translations-page--workflow .tx-jobs-table {
  font-size: 15px;
}

.translations-page.translations-page--workflow .tx-jobs-table th {
  font-size: 13px;
  padding: 12px 16px;
}

.translations-page.translations-page--workflow .tx-jobs-table td {
  padding: 12px 16px;
  vertical-align: middle;
}

.translations-page.translations-page--workflow .tx-job-pill {
  padding: 4px 10px;
  font-size: 13px;
}

.translations-page.translations-page--workflow .tx-job-actions {
  gap: 8px;
}

.translations-page.translations-page--workflow .tx-job-actions .btn,
.translations-page.translations-page--workflow .tx-job-actions .btn.secondary,
.translations-page.translations-page--workflow .tx-locale-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 6px 12px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 10px;
}

.translations-page.translations-page--workflow .tx-inline-actions .btn-outlined {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 14px;
  font-size: 15px;
  font-weight: 600;
  border-radius: 10px;
}

.translations-page.translations-page--workflow .tx-inline-actions .btn-outlined:nth-child(1)::after {
  content: "";
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.translations-page.translations-page--workflow .tx-help-links {
  margin: 14px 0 0;
  padding-left: 0;
  list-style: none;
  font-size: 15px;
}

.translations-page.translations-page--workflow .tx-help-links li {
  margin-bottom: 8px;
}

.translations-page.translations-page--workflow .tx-help-links li:empty,
.translations-page.translations-page--workflow .tx-help-links li:not(:has(a)) {
  display: none;
}

.translations-page.translations-page--workflow .tx-help-links .inline-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  font-size: 15px;
  font-weight: 600;
  color: #2562ff;
  text-decoration: none;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 10px;
}

.translations-page.translations-page--workflow .tx-help-links .inline-link::after {
  content: "";
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6'/%3E%3Cpath d='M10 14 21 3'/%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.translations-page.translations-page--workflow .tx-help-links .inline-link:hover {
  color: #3730a3;
  background: #e0e7ff;
  border-color: #a5b4fc;
}

.translations-page.translations-page--workflow .product-hub-troubleshooting__list strong {
  font-size: 16px;
}

.translations-page.translations-page--workflow .product-hub-troubleshooting__list span {
  font-size: 15px;
  line-height: 1.6;
}

.translations-page.translations-page--workflow .translations-alert-success,
.translations-page.translations-page--workflow .tx-alert,
.translations-page.translations-page--workflow .error {
  font-size: 15px;
  line-height: 1.55;
}

.translations-page.translations-page--workflow .enterprise-panel,
.translations-page.translations-page--workflow .tx-workflow-card,
.translations-page.translations-page--workflow .product-hub-section {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.translations-page.translations-page--workflow table,
.translations-page.translations-page--workflow .tx-jobs-table {
  font-size: 17px;
}

.translations-page.translations-page--workflow table th,
.translations-page.translations-page--workflow .tx-jobs-table th {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3668e9;
  background: #f8fafc;
}

.translations-page.translations-page--workflow table tbody tr:hover,
.translations-page.translations-page--workflow .tx-jobs-table tbody tr:hover {
  background: #f8fafc;
}

.translations-page.translations-page--workflow input:not([type="checkbox"]):not([type="radio"]),
.translations-page.translations-page--workflow select,
.translations-page.translations-page--workflow textarea {
  font-size: 17px;
}

@media (max-width: 768px) {
  .translations-page.translations-page--workflow .tx-header__controls {
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }

  .translations-page.translations-page--workflow .tx-header__field {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  .translations-page.translations-page--workflow .tx-header__field:nth-child(1) .tx-header__label,
  .translations-page.translations-page--workflow .tx-header__field:nth-child(1) .tx-header__value,
  .translations-page.translations-page--workflow .tx-header__field:nth-child(2) .tx-header__label,
  .translations-page.translations-page--workflow .tx-header__field:nth-child(2) .tx-header__select,
  .translations-page.translations-page--workflow .tx-header__generate {
    grid-column: auto;
    grid-row: auto;
  }

  .translations-page.translations-page--workflow .tx-header__generate {
    width: 100%;
    justify-self: stretch;
  }

  .translations-page.translations-page--workflow .tx-editor__head,
  .translations-page.translations-page--workflow .tx-editor__row {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .translations-page.translations-page--workflow .tx-editor__key {
    padding-top: 0;
  }

  .translations-page.translations-page--workflow .tx-header__field--grow {
    max-width: none;
  }

  .translations-page.translations-page--workflow .tx-preview-frame .banner-preview-premium-head.preview-topbar {
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    height: auto;
    min-height: 52px;
    padding: 10px 12px;
    gap: 10px;
  }

  .translations-page.translations-page--workflow .tx-preview-frame .preview-topbar-center {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-content: flex-start;
  }

  .translations-page.translations-page--workflow .tx-preview-frame .preview-topbar-right {
    grid-column: 2;
    grid-row: 1;
    justify-content: flex-end;
  }

  .translations-page.translations-page--workflow .tx-preview-frame .preview-live-label {
    max-width: 100%;
  }
}

/* ─── Settings hub · General · Workspace · Team ─── */
.system-settings-page {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 0 !important;
}

.system-settings-page > * + *,
.app-container > .system-settings-page > * + *,
.main-container > .system-settings-page > * + * {
  margin-top: 0 !important;
}

.system-settings-page .sys-settings-header {
  align-items: end;
  gap: 16px;
  margin: 0;
  padding: 22px 24px;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, #fff 48%, rgba(13, 148, 136, 0.04) 100%);
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.system-settings-page .sys-settings-breadcrumb {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #4f46e5;
}

.system-settings-page .sys-settings-title {
  margin: 0;
  font-size: clamp(28px, 2.2vw, 34px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0f172a;
}

.system-settings-page .sys-settings-subtitle {
  margin-top: 10px;
  font-size: 16px;
  line-height: 1.55;
  color: #3668e9;
}

.system-settings-page .sys-settings-signout {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 0;
  margin-left: auto;
  padding: 0 14px;
  min-height: 40px;
  font-size: 14px;
  font-weight: 600;
  color: #b91c1c !important;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 10px;
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.system-settings-page .sys-settings-signout:hover {
  color: #991b1b !important;
  background: #fee2e2;
  border-color: #fca5a5;
  text-decoration: none;
  transform: translateY(-1px);
}

.system-settings-page .sys-settings-nav-grid {
  gap: 16px;
  margin-top: 0;
}

.system-settings-page .sys-settings-nav-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  padding: 20px 22px;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.system-settings-page .sys-settings-nav-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(99, 102, 241, 0.1);
}

.system-settings-page .sys-settings-nav-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
}

.system-settings-page .sys-settings-nav-card-title {
  margin-top: 14px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
}

.system-settings-page .sys-settings-nav-card-desc {
  margin-top: 6px;
  font-size: 16px;
  line-height: 1.45;
  color: #3668e9;
}

.system-settings-page .sys-settings-section {
  margin-top: 0;
}

.system-settings-page .sys-settings-section-head {
  align-items: center;
  gap: 12px;
  margin: 0 0 12px;
}

.system-settings-page .sys-settings-section-head-title {
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #0f172a;
}

.system-settings-page .sys-settings-section-head-sub {
  margin: 0;
  font-size: 15px;
  line-height: 1.45;
  color: #3668e9;
}

.system-settings-page .sys-settings-section-ico {
  width: 18px;
  height: 18px;
}

.system-settings-page .sys-settings-card {
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
  overflow: hidden;
}

.system-settings-page .sys-settings-row {
  align-items: center;
  gap: 16px;
  padding: 16px 24px;
  border-bottom-color: #eaeaea;
}

.system-settings-page .sys-settings-row-left {
  flex: 1;
  min-width: 0;
}

.system-settings-page .sys-settings-row:has(.sys-settings-row-left .sys-settings-modal-input) {
  align-items: flex-end;
  gap: 12px;
  padding-top: 18px;
  padding-bottom: 18px;
}

.system-settings-page .sys-settings-row-left:has(.sys-settings-modal-input) {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.system-settings-page .sys-settings-row-left:has(.sys-settings-modal-input) .sys-settings-row-title {
  margin: 0;
  line-height: 1.3;
}

.system-settings-page .sys-settings-row .sys-settings-modal-input {
  width: 100%;
  max-width: none;
  margin: 0 !important;
  min-height: 46px;
  height: 46px;
  box-sizing: border-box;
}

.system-settings-page .sys-settings-row:has(.sys-settings-row-left .sys-settings-modal-input) .sys-settings-btn-outline {
  flex-shrink: 0;
  align-self: flex-end;
  min-width: 112px;
  min-height: 46px;
  height: 46px;
  padding: 0 18px;
  font-size: 15px;
}

.system-settings-page .sys-settings-row:has(.sys-settings-row-left .sys-settings-modal-input) .sys-settings-btn-outline::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z'/%3E%3Cpolyline points='17 21 17 13 7 13 7 21'/%3E%3Cpolyline points='7 3 7 8 15 8'/%3E%3C/svg%3E");
}

/* Workspace page — highlighted values (red-marked only) */
.system-settings-page--workspace .sys-settings-card--workspace > .sys-settings-row:first-child .sys-settings-row-desc {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  max-width: 100%;
  margin-top: 6px;
  padding: 8px 12px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  color: #2562ff;
  word-break: break-all;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.system-settings-page--workspace .sys-settings-card--workspace > .sys-settings-row:nth-child(2) .sys-settings-row-left > .sys-settings-row-desc:first-of-type {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  margin-top: 6px;
  padding: 8px 12px;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
  color: #0369a1;
  background: #e0f2fe;
  border: 1px solid #bae6fd;
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.system-settings-page--workspace .sys-settings-card--workspace > .sys-settings-row:nth-child(2) .sys-settings-row-left > .sys-settings-row-desc:nth-of-type(2) {
  margin-top: 8px !important;
  padding: 6px 12px;
  font-size: 14px !important;
  font-weight: 500;
  line-height: 1.45;
  color: #92400e;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 10px;
  display: inline-block;
}

.system-settings-page--workspace .sys-settings-card--team > .sys-settings-section-head .sys-settings-section-head-sub {
  display: inline-flex;
  align-items: center;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 600;
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.system-settings-page--workspace .sys-settings-card--team table tbody td:first-child > div:nth-child(2) {
  display: inline-flex;
  align-items: center;
  margin-top: 6px;
  padding: 4px 10px;
  font-size: 13px !important;
  font-weight: 500;
  line-height: 1.35;
  color: #475569 !important;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
}

.system-settings-page--workspace .sys-settings-card--team table tbody td:nth-child(3) {
  width: auto;
  max-width: max-content;
  padding: 6px 12px !important;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #047857 !important;
  background: #ecfdf5 !important;
  border: 1px solid #a7f3d0 !important;
  border-radius: 999px;
  align-self: center;
  justify-self: start;
}

/* Workspace — team members header + table */
.system-settings-page .sys-settings-card--team > .sys-settings-section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  margin: 0 0 14px !important;
  padding: 18px 20px 0;
}

.system-settings-page .sys-settings-card--team > .sys-settings-section-head .sys-settings-section-head-main {
  flex: 0 1 auto;
  min-width: 0;
  margin: 0;
}

.system-settings-page .sys-settings-card--team > .sys-settings-section-head .sys-settings-section-head-title {
  margin: 0;
  font-size: 13px !important;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3668e9;
  line-height: 1.2;
}

.system-settings-page .sys-settings-card--team > .sys-settings-section-head .sys-settings-section-head-sub {
  flex: 0 0 auto;
  margin: 0 !important;
  max-width: none;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  color: #3668e9;
  text-align: right;
  white-space: nowrap;
}

.system-settings-page .sys-settings-card--team > div:has(> table) {
  margin: 0 20px 16px !important;
  overflow-x: auto;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.system-settings-page .sys-settings-card--team table {
  width: 100%;
  min-width: 640px;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 15px;
}

.system-settings-page .sys-settings-card--team table thead tr,
.system-settings-page .sys-settings-card--team table tbody tr {
  display: grid;
  grid-template-columns: minmax(180px, 1.45fr) minmax(88px, 0.75fr) minmax(80px, 0.7fr) minmax(120px, 1fr) minmax(128px, 1.1fr);
  align-items: center;
}

.system-settings-page .sys-settings-card--team table thead th {
  padding: 12px 16px !important;
  font-size: 12px !important;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: left;
  color: #3668e9 !important;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.system-settings-page .sys-settings-card--team table tbody td {
  padding: 14px 16px !important;
  border-top: 1px solid #f1f5f9 !important;
  vertical-align: middle;
  color: #334155;
  font-size: 15px;
  line-height: 1.35;
}

.system-settings-page .sys-settings-card--team table tbody tr:first-child td {
  border-top: none !important;
}

.system-settings-page .sys-settings-card--team table tbody td:first-child > div:first-child {
  font-size: 15px;
  font-weight: 600;
  color: #0f172a;
  line-height: 1.3;
}

.system-settings-page .sys-settings-card--team table tbody td:first-child > div:nth-child(2) {
  margin-top: 4px;
  font-size: 13px !important;
  color: #3668e9 !important;
  line-height: 1.35;
}

.system-settings-page .sys-settings-card--team table tbody td:nth-child(3) {
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.04em;
  color: #047857;
}

.system-settings-page .sys-settings-card--team table tbody td:last-child > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.system-settings-page .sys-settings-card--team table .sys-settings-btn-outline {
  min-height: 34px;
  height: 34px;
  padding: 0 12px !important;
  font-size: 13px !important;
}

/* Workspace — team email delivery + invite stack */
.system-settings-page .sys-settings-card--team .sys-settings-row.sys-settings-row--email {
  display: block;
  margin: 0 20px 0 !important;
  padding: 0 !important;
  border-bottom: none !important;
}

.system-settings-page .sys-settings-card--team .sys-settings-email-panel {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  padding: 16px 18px 14px;
  border: 1px solid #c7d2fe;
  border-bottom: 1px dashed #dbeafe;
  border-radius: 12px 12px 0 0;
  background: linear-gradient(135deg, #eef2ff 0%, #f8fafc 52%, #fff 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.system-settings-page .sys-settings-card--team .sys-settings-email-panel > .sys-settings-row-title {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3668e9;
}

.system-settings-page .sys-settings-card--team .sys-settings-email-summary {
  margin: 0;
  padding: 12px 14px;
}

.system-settings-page .sys-settings-card--team .sys-settings-email-summary__title {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.3;
}

.system-settings-page .sys-settings-card--team .sys-settings-email-summary__message {
  margin: 6px 0 0;
  font-size: 15px;
  line-height: 1.45;
}

.system-settings-page .sys-settings-card--team .sys-settings-email-test-form {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 12px;
  margin: 0;
  width: 100%;
}

.system-settings-page .sys-settings-card--team .sys-settings-email-test-form .sys-settings-modal-input {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  max-width: none;
  margin: 0 !important;
  height: 46px;
  min-height: 46px;
  font-size: 15px;
}

.system-settings-page .sys-settings-card--team .sys-settings-email-test-form .sys-settings-btn-outline {
  flex-shrink: 0;
  min-width: 168px;
  min-height: 46px;
  height: 46px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
}

.system-settings-page .sys-settings-card--team .sys-settings-email-test-form .sys-settings-btn-outline::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='16' x='2' y='4' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E");
}

.system-settings-page .sys-settings-card--team .sys-settings-email-tech {
  margin-top: 2px;
}

/* Workspace — team invite panel */
.system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  margin: 0 20px 20px;
  padding: 14px 18px 16px;
  border: 1px solid #c7d2fe !important;
  border-top: none !important;
  border-radius: 0 0 12px 12px;
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 2px 10px rgba(99, 102, 241, 0.08);
}

.system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) > div:first-child {
  flex: 1 1 240px;
  min-width: 0;
}

.system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) > div:nth-child(2) {
  flex: 0 0 152px;
  min-width: 136px;
}

.system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) label.sys-settings-row-title {
  display: block;
  margin: 0 0 8px !important;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3668e9;
}

.system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) .sys-settings-modal-input {
  width: 100%;
  margin: 0 !important;
  font-size: 15px;
}

.system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) select.sys-settings-modal-input {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 40px;
  color: #312e81;
  font-weight: 600;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-position: right 14px center;
  background-size: 16px 16px;
  background-repeat: no-repeat;
  cursor: pointer;
}

.system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) select.sys-settings-modal-input:hover {
  border-color: #c7d2fe;
}

.system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) select.sys-settings-modal-input:focus {
  border-color: #6366f1;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) .sys-settings-btn-outline {
  flex-shrink: 0;
  align-self: flex-end;
  min-width: 148px;
  min-height: 46px;
  height: 46px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 700;
  color: #047857 !important;
  background: #ecfdf5 !important;
  border: 1px solid #a7f3d0 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) .sys-settings-btn-outline::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m22 2-7 20-4-9-9-4Z'/%3E%3Cpath d='M22 2 11 13'/%3E%3C/svg%3E");
}

.system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) .sys-settings-btn-outline:hover:not(:disabled) {
  color: #065f46 !important;
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(5, 150, 105, 0.15);
}

.system-settings-page .sys-settings-row-title {
  font-size: 16px;
  font-weight: 600;
  color: #0f172a;
}

.system-settings-page .sys-settings-row-desc {
  margin-top: 4px;
  font-size: 15px;
  line-height: 1.45;
  color: #3668e9;
}

.system-settings-page .sys-settings-btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  height: auto;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: #2562ff !important;
  background: #eef2ff !important;
  border: 1px solid #c7d2fe !important;
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.system-settings-page .sys-settings-btn-outline::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.system-settings-page .sys-settings-btn-outline:hover:not(:disabled) {
  color: #3730a3 !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.15);
}

.system-settings-page .sys-settings-btn-terminate {
  min-height: 42px;
  padding: 0 18px;
  font-size: 14px;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(239, 68, 68, 0.2);
}

.system-settings-page .sys-settings-btn-terminate:hover {
  box-shadow: 0 4px 14px rgba(239, 68, 68, 0.28);
}

.system-settings-page .sys-settings-email-summary {
  padding: 14px 16px;
  border-radius: 12px;
}

.system-settings-page .sys-settings-email-summary__title {
  font-size: 16px;
}

.system-settings-page .sys-settings-email-summary__message {
  font-size: 14px;
}

.system-settings-page .sys-settings-residency-notice,
.system-settings-page .sys-settings-residency-warning {
  font-size: 14px;
  line-height: 1.5;
  border-radius: 12px;
}

.system-settings-page .sys-settings-residency-badge {
  font-size: 11px;
}

.system-settings-page .sys-settings-modal-input,
.system-settings-page input[type="text"],
.system-settings-page input[type="email"] {
  min-height: 46px;
  padding: 0 14px;
  font-size: 15px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.system-settings-page .sys-settings-modal-input:focus,
.system-settings-page input[type="text"]:focus,
.system-settings-page input[type="email"]:focus {
  border-color: #6366f1;
  outline: none;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

.system-settings-page .sys-settings-modal h2 {
  font-size: 20px;
}

.system-settings-page .sys-settings-modal p {
  font-size: 15px;
}

.system-settings-page .sys-settings-modal-cancel {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 600;
  color: #475569;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
}

.system-settings-page .sys-settings-modal-confirm {
  min-height: 40px;
  padding: 0 18px;
  font-size: 14px;
  border-radius: 10px;
}

.system-settings-page .sys-settings-modal-confirm--primary {
  color: #fff;
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.28);
}

.system-settings-page--general .sys-settings-section--team .sys-settings-card {
  margin-top: 0;
}

@media (max-width: 640px) {
  .system-settings-page .sys-settings-row:has(.sys-settings-row-left .sys-settings-modal-input) {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .system-settings-page .sys-settings-row:has(.sys-settings-row-left .sys-settings-modal-input) .sys-settings-btn-outline {
    align-self: stretch;
    width: 100%;
    min-width: 0;
  }

  .system-settings-page .sys-settings-card--team > .sys-settings-section-head {
    padding: 16px 16px 0;
  }

  .system-settings-page .sys-settings-card--team > .sys-settings-section-head .sys-settings-section-head-sub {
    flex-basis: 100%;
    text-align: left;
    white-space: normal;
  }

  .system-settings-page .sys-settings-card--team > div:has(> table) {
    margin: 0 16px 14px !important;
  }

  .system-settings-page .sys-settings-card--team .sys-settings-row.sys-settings-row--email {
    margin: 0 16px 0 !important;
  }

  .system-settings-page .sys-settings-card--team .sys-settings-email-test-form {
    flex-direction: column;
    align-items: stretch;
  }

  .system-settings-page .sys-settings-card--team .sys-settings-email-test-form .sys-settings-btn-outline {
    width: 100%;
    min-width: 0;
  }

  .system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) {
    margin: 0 16px 16px;
    flex-direction: column;
    align-items: stretch;
  }
  .system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) > div:first-child,
  .system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) > div:nth-child(2) {
    flex: 1 1 auto !important;
    width: 100%;
    min-width: 0;
  }

  .system-settings-page .sys-settings-card--team form.sys-settings-row:has(#team-invite-email) .sys-settings-btn-outline {
    width: 100%;
    min-width: 0;
  }
}

@media (max-width: 768px) {
  .system-settings-page .sys-settings-header {
    flex-direction: column;
    align-items: stretch;
  }

  .system-settings-page .sys-settings-signout {
    margin-left: 0;
    align-self: flex-start;
  }
}

/* ─── Account & Security ─── */
.acc-page,
.security-settings-page .acc-page {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: none;
  padding: 0 !important;
}

.acc-page > * + *,
.security-settings-page > * + *,
.app-container > .acc-page > * + *,
.app-container > .security-settings-page > * + *,
.main-container > .acc-page > * + *,
.main-container > .security-settings-page > * + * {
  margin-top: 0 !important;
}

.security-settings-page {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 0 !important;
}

.acc-page .acc-head {
  align-items: end;
  gap: 16px;
  margin: 0;
  padding: 22px 24px;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, #fff 48%, rgba(13, 148, 136, 0.04) 100%);
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.acc-page .acc-breadcrumb {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #4f46e5;
}

.acc-page .acc-title,
.security-settings-page .acc-title {
  margin: 0;
  font-size: clamp(28px, 2.2vw, 34px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0f172a;
}

.acc-page .acc-sub {
  margin-top: 10px;
  font-size: 16px;
  line-height: 1.55;
  color: #3668e9;
}

.acc-page .acc-save {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  height: auto;
  margin-left: auto;
  padding: 0 20px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0;
  color: #fff !important;
  background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%) !important;
  border: none !important;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.28);
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.acc-page .acc-save:hover:not(:disabled) {
  background: linear-gradient(135deg, #4f46e5 0%, #2562ff 100%) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(99, 102, 241, 0.35);
}

.acc-page .acc-grid {
  gap: 20px;
  margin-top: 0;
}

.acc-page .acc-card,
.security-settings-page .acc-card {
  padding: 22px 24px;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.acc-page .acc-profile-card {
  border-radius: 16px;
  overflow: hidden;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.acc-page .acc-form-pad {
  padding: 22px 24px;
}

.acc-page .acc-field-label {
  margin-bottom: 8px;
  font-size: 14px;
}

.acc-page .acc-input,
.acc-page .acc-select,
.acc-page .acc-pwd-input {
  min-height: 46px;
  font-size: 15px;
  border-radius: 10px;
}

.acc-page .acc-input-wrap .acc-input {
  padding-left: 44px;
  padding-right: 14px;
}

.acc-page .acc-input-wrap--lock .acc-input {
  padding-right: 44px;
}

.acc-page .acc-select-wrap:has(.acc-input-icon) .acc-select {
  padding-left: 44px;
  padding-right: 48px;
}

.acc-page .acc-select-wrap:not(:has(.acc-input-icon)) .acc-select {
  padding-left: 14px;
  padding-right: 40px;
}

.acc-page .acc-pwd-input,
.acc-page .acc-modal-form .acc-input {
  padding: 0 14px;
}

.acc-page .acc-input-icon {
  left: 13px;
  width: 20px;
  height: 20px;
}

.acc-page .acc-input-icon svg {
  width: 18px;
  height: 18px;
}

.acc-page .acc-input-lock {
  right: 13px;
}

.acc-page .acc-select-wrap {
  position: relative;
}

.acc-page .acc-select-chev {
  display: none;
}

.acc-page .acc-select-wrap::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  width: 16px;
  height: 16px;
  transform: translateY(-50%);
  pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.acc-page .acc-name {
  font-size: 24px;
}

.acc-page .acc-user-id {
  font-size: 13px;
}

.acc-page .acc-edit-photo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 600;
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 10px;
}

.acc-page .acc-edit-photo:hover {
  background: #e0e7ff;
  border-color: #a5b4fc;
}

.acc-page .acc-panel-head {
  gap: 12px;
  margin-bottom: 18px;
}

.acc-page .acc-panel-ico,
.security-settings-page .acc-panel-ico {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}

.acc-page .acc-panel-title {
  font-size: 14px;
}

.acc-page .acc-sec-row {
  align-items: center;
  gap: 16px;
  padding: 16px 0;
}

.acc-page .acc-sec-title {
  font-size: 16px;
}

.acc-page .acc-sec-desc {
  font-size: 14px;
}

.acc-page .acc-sec-ico {
  width: 40px;
  height: 40px;
  border-radius: 10px;
}

.acc-page .acc-btn-outline {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  height: auto;
  padding: 0 14px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  color: #2562ff !important;
  background: #eef2ff !important;
  border: 1px solid #c7d2fe !important;
  border-radius: 10px;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}

.acc-page .acc-btn-outline::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.acc-page .acc-btn-outline:hover:not(:disabled) {
  color: #3730a3 !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
  transform: translateY(-1px);
}

.acc-page .acc-btn-outline--danger {
  color: #b91c1c !important;
  background: #fef2f2 !important;
  border-color: #fecaca !important;
}

.acc-page .acc-btn-outline--danger::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6'/%3E%3Cpath d='M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2'/%3E%3C/svg%3E");
}

.acc-page .acc-btn-outline--danger:hover:not(:disabled) {
  color: #991b1b !important;
  background: #fee2e2 !important;
  border-color: #fca5a5 !important;
}

.acc-page .acc-btn-purple {
  min-height: 46px;
  font-size: 15px;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.25);
}

.acc-page .acc-pill {
  font-size: 11px;
  padding: 4px 10px;
}

.acc-page .acc-notice-title {
  font-size: 13px;
}

.acc-page .acc-notice-body {
  font-size: 14px;
}

.acc-page .acc-pwd-title {
  font-size: 13px;
}

.acc-page .acc-logs-label {
  font-size: 12px;
}

.acc-page .acc-logs-stat-value {
  font-size: 24px;
}

.acc-page .acc-logs-stat-label {
  font-size: 12px;
}

.acc-page .acc-logs-chip {
  font-size: 13px;
  padding: 7px 14px;
}

.acc-page .acc-log-title {
  font-size: 14px;
}

.acc-page .acc-security-extensions {
  margin-top: 0;
  gap: 20px;
}

.acc-page .acc-footer {
  margin-top: 0;
  padding-top: 16px;
}

@media (max-width: 768px) {
  .acc-page .acc-head {
    flex-direction: column;
    align-items: stretch;
  }
  .acc-page .acc-save {
    margin-left: 0;
    width: 100%;
  }
}

/* Security Settings — grid alignment, spacing & typography */
.security-settings-page .acc-breadcrumb {
  font-size: 14px;
}

.security-settings-page .acc-head a.acc-save {
  gap: 8px;
  text-decoration: none;
}

.security-settings-page .acc-head a.acc-save::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.security-settings-page .acc-grid--security {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  align-items: stretch;
}

.security-settings-page .acc-grid--security > div {
  display: flex;
  flex-direction: column;
  gap: 24px;
  min-width: 0;
}

.security-settings-page .acc-grid--security > div > .acc-mt,
.security-settings-page .acc-grid--security > div > .acc-mt-sm,
.security-settings-page .acc-grid--security > div > section {
  margin-top: 0 !important;
}

.security-settings-page .acc-grid--security .acc-card,
.security-settings-page .acc-grid--security .acc-pwd-card,
.security-settings-page .acc-grid--security .acc-logs-card,
.security-settings-page .acc-grid--security .acc-logout-card {
  padding: 24px;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: #fff;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.security-settings-page .acc-card > #change-email.acc-form-divider {
  display: none;
}

.security-settings-page .acc-card > div > h3.acc-field-label {
  margin: 0 0 10px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #0f172a;
}

.security-settings-page .acc-card > div > p {
  margin: 0 0 16px;
  font-size: 14px !important;
  line-height: 1.5;
  color: #3668e9;
}

.security-settings-page .acc-form-grid {
  gap: 16px 18px;
}

.security-settings-page .acc-field-label {
  margin-bottom: 8px;
  font-size: 14px;
}

.security-settings-page .acc-input,
.security-settings-page .acc-pwd-input,
.security-settings-page .acc-select {
  min-height: 46px;
  font-size: 16px;
}

.security-settings-page .acc-form-grid > div > .acc-field-label + .acc-input,
.security-settings-page .acc-form-grid > div > .acc-field-label + .acc-input-wrap {
  margin-top: 0;
}

.security-settings-page .acc-form-grid .acc-edit-photo {
  min-height: 42px;
  margin-top: 4px;
  font-size: 15px;
  margin-bottom: 0;
}

.security-settings-page .acc-form-grid span[role="status"] {
  font-size: 15px !important;
}

.security-settings-page .acc-pwd-title {
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #0f172a;
}

.security-settings-page .acc-pwd-card form {
  display: flex;
  flex-direction: column;
}

.security-settings-page .acc-pwd-card .password-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0 0 16px;
}

.security-settings-page .acc-pwd-card .password-field:last-of-type {
  margin-bottom: 20px;
}

.security-settings-page .acc-pwd-card .auth-field-header {
  margin: 0;
}

.security-settings-page .acc-pwd-card .password-field .auth-field-label {
  display: block;
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
  text-transform: none;
  color: #475569;
}

.security-settings-page .acc-pwd-card .acc-pwd-field-inner,
.security-settings-page .acc-pwd-card .password-field__wrap {
  margin: 0 !important;
}

.security-settings-page .acc-pwd-card .password-field__wrap .acc-pwd-input,
.security-settings-page .acc-pwd-card .password-field__wrap .auth-input {
  width: 100%;
  min-height: 46px;
  padding: 0 4.75rem 0 14px;
  font-size: 16px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background: #fff;
}

.security-settings-page .acc-pwd-card .password-field__toggle {
  right: 12px;
  padding: 0.25rem 0.5rem;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  color: #3668e9;
}

.security-settings-page .acc-pwd-card .password-field__toggle:hover {
  color: #334155;
}

.security-settings-page .acc-pwd-card .password-field__meter {
  align-items: center;
  gap: 8px;
  margin: 2px 0 0;
}

.security-settings-page .acc-pwd-card .password-field__hint,
.security-settings-page .acc-pwd-card .password-field__caps {
  margin: 2px 0 0;
  font-size: 14px;
  line-height: 1.45;
  color: #3668e9;
}

.security-settings-page .acc-pwd-card .password-field__caps {
  color: #b45309;
}

.security-settings-page .acc-pwd-card .password-field__strength-label {
  font-size: 14px;
  color: #3668e9;
}

.security-settings-page .acc-pwd-card .acc-pwd-err {
  margin: 0 0 12px;
  font-size: 14px;
  line-height: 1.45;
}

.security-settings-page .acc-btn-purple {
  margin-top: 0;
  min-height: 46px;
  font-size: 16px;
}

/* Two-factor setup modal — aligned spacing, +2px type, inline actions */
.security-settings-page .acc-modal,
.acc-page .acc-modal {
  box-sizing: border-box;
  padding: 24px;
}

.security-settings-page .acc-modal h3,
.acc-page .acc-modal h3 {
  margin: 0 0 10px;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f172a;
}

.security-settings-page .acc-modal-desc,
.acc-page .acc-modal-desc {
  margin: 0 0 10px;
  font-size: 16px;
  line-height: 1.5;
  color: #3668e9;
}

.security-settings-page .acc-modal-qr,
.acc-page .acc-modal-qr {
  max-width: 200px;
  margin: 0 auto 10px;
  display: block;
}

.security-settings-page .acc-modal-secret,
.acc-page .acc-modal-secret {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0 0 18px;
}

.security-settings-page .acc-modal-secret-label,
.acc-page .acc-modal-secret-label {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  color: #475569;
}

.security-settings-page .acc-modal-secret-box,
.acc-page .acc-modal-secret-box {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 7px 7px 11px;
  border: 1.5px solid #c7d2fe;
  border-radius: 12px;
  background: linear-gradient(180deg, #f5f3ff 0%, #eef2ff 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 1px 2px rgba(99, 102, 241, 0.08);
}

.security-settings-page .acc-modal-secret-value,
.acc-page .acc-modal-secret-value {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  font-size: 12px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.04em;
  color: #312e81;
  word-break: break-all;
}

.security-settings-page .acc-modal-secret-copy,
.acc-page .acc-modal-secret-copy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex: 0 0 auto;
  min-height: 38px;
  margin: 0;
  padding: 0 12px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  color: #2562ff;
  background: #fff;
  border: 1.5px solid #c7d2fe;
  border-radius: 10px;
  cursor: pointer;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.security-settings-page .acc-modal-secret-copy::before,
.acc-page .acc-modal-secret-copy::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2' ry='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.security-settings-page .acc-modal-secret-copy:hover,
.acc-page .acc-modal-secret-copy:hover {
  color: #3730a3;
  background: #eef2ff;
  border-color: #a5b4fc;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.12);
}

.security-settings-page .acc-modal-secret-copy.is-copied,
.acc-page .acc-modal-secret-copy.is-copied {
  color: #047857;
  background: #ecfdf5;
  border-color: #a7f3d0;
}

.security-settings-page .acc-modal-secret-copy.is-copied::before,
.acc-page .acc-modal-secret-copy.is-copied::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

.security-settings-page .acc-modal-form label,
.acc-page .acc-modal-form label {
  margin-bottom: 8px;
  font-size: 16px;
  font-weight: 600;
  color: #334155;
}

.security-settings-page .acc-modal-form .acc-input,
.acc-page .acc-modal-form .acc-input {
  box-sizing: border-box;
  width: 100%;
  margin-bottom: 14px;
  padding: 11px 14px;
  font-size: 16px;
  line-height: 1.4;
  border-radius: 10px;
}

.security-settings-page .acc-modal-actions,
.acc-page .acc-modal-actions {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 12px;
  margin-top: 0;
}

.security-settings-page .acc-modal-actions .acc-btn-purple,
.acc-page .acc-modal-actions .acc-btn-purple {
  flex: 1 1 0;
  width: auto;
  min-width: 0;
  margin-top: 0;
  min-height: 46px;
  height: auto;
  padding: 0 16px;
  font-size: 16px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
}

.security-settings-page .acc-modal-actions .acc-btn-outline,
.acc-page .acc-modal-actions .acc-btn-outline {
  flex: 1 1 0;
  width: auto;
  min-width: 0;
  min-height: 46px;
  height: auto;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 10px;
}

.security-settings-page .acc-panel-head {
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.security-settings-page .acc-panel-title {
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #0f172a;
}

.security-settings-page .acc-sec-row {
  align-items: center;
  gap: 16px;
  padding: 18px 0;
}

.security-settings-page .acc-sec-left {
  align-items: center;
  gap: 14px;
}

.security-settings-page .acc-sec-ico {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 10px;
}

.security-settings-page .acc-sec-ico--twofa,
.acc-page .acc-sec-ico--twofa {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #dc2626;
}

.security-settings-page .acc-sec-ico--twofa svg,
.acc-page .acc-sec-ico--twofa svg {
  width: 18px;
  height: 18px;
}

.security-settings-page .acc-sec-title {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
}

.security-settings-page .acc-sec-desc {
  margin-top: 4px;
  font-size: 15px;
  line-height: 1.45;
  margin-bottom: 0;
}

.security-settings-page .acc-sec-right {
  gap: 10px;
}

.security-settings-page .acc-pill {
  font-size: 12px;
  padding: 4px 10px;
}

.security-settings-page .acc-btn-outline {
  min-height: 35px;
  padding: 0 14px;
}

.security-settings-page .acc-session-list {
  margin: 12px 0 8px;
  padding: 0 0 8px;
  border-bottom: 1px solid #f1f5f9;
}

.security-settings-page .acc-session-row {
  align-items: center;
  gap: 12px;
  padding: 12px 0;
}
.security-settings-page .acc-session-row:first-child {
  border-top: none;
}
.security-settings-page .acc-session-ua {
  font-size: 14px;
  line-height: 1.4;
}

.security-settings-page .acc-session-meta {
  margin-top: 4px;
  font-size: 14px;
}

.security-settings-page .acc-logs-head {
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 16px;
}

.security-settings-page .acc-logs-label {
  display: block;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #0f172a;
}

.security-settings-page .acc-logs-sub {
  margin-top: 6px;
  font-size: 15px;
  line-height: 1.5;
  color: #3668e9;
}

.security-settings-page .acc-logs-meta {
  font-size: 14px;
}

.security-settings-page .acc-logs-stat-grid {
  gap: 12px;
  margin: 16px 0 18px;
}

.security-settings-page .acc-logs-stat {
  padding: 5px 14px 12px;
}

.security-settings-page .acc-logs-stat-value {
  font-size: 26px;
}

.security-settings-page .acc-logs-stat-label {
  margin-top: 6px;
}

.security-settings-page .acc-logs-toolbar {
  gap: 12px;
  margin-bottom: 16px;
}

.security-settings-page .acc-logs-chip {
  font-size: 14px;
  padding: 8px 14px;
}

.security-settings-page .acc-logs-table-head {
  font-size: 12px;
  padding: 12px 14px;
}

.security-settings-page .acc-log-row--table {
  padding: 12px 14px;
}

.security-settings-page .acc-log-title {
  font-size: 15px;
}

.security-settings-page .acc-log-cell--meta,
.security-settings-page .acc-log-sub {
  font-size: 14px;
}

.security-settings-page .acc-log-cell--time {
  font-size: 13px;
}

.security-settings-page .acc-logout-text {
  margin: 0 0 16px;
  font-size: 15px;
  line-height: 1.5;
}

.security-settings-page .acc-security-extensions {
  gap: 24px;
  margin-top: 0;
  overflow: visible;
}


/* Property API keys — match Implementation reference */
.security-settings-page .acc-card:has(.site-api-key-panel) {
  padding: 24px;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: #fff;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.security-settings-page .acc-card:has(.site-api-key-panel) .acc-panel-head {
  margin-bottom: 4px;
}

.security-settings-page .acc-card:has(.site-api-key-panel) > .acc-sec-desc {
  margin: 0 0 18px !important;
  font-size: 15px;
  line-height: 1.5;
  color: #3668e9;
}

.security-settings-page .site-api-key-panel {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 14px 21px 22px;
  background: linear-gradient(180deg, #eef2ff 0%, #fff 100%);
  border: 1px solid #c7d2fe;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.security-settings-page .site-api-key-panel .enterprise-panel__title {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
}

.security-settings-page .site-api-key-panel .enterprise-panel__intro {
  margin: 4px 0 14px;
  font-size: 16px;
  line-height: 1.6;
  color: #3668e9;
}

.security-settings-page .site-api-key-panel__meta {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
  padding: 14px 18px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.security-settings-page .site-api-key-panel__row {
  display: grid;
  grid-template-columns: minmax(120px, 150px) 1fr;
  align-items: baseline;
  gap: 8px 16px;
  margin: 0;
  font-size: 16px;
  line-height: 1.5;
}

.security-settings-page .site-api-key-panel__label {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3668e9;
  min-width: 0;
}

.security-settings-page .site-api-key-panel__value,
.security-settings-page .site-api-key-panel__row code {
  font-size: 15px;
  font-weight: 600;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  color: #2562ff;
  word-break: break-all;
}

.security-settings-page .site-api-key-panel__row > span:not(.site-api-key-panel__label) {
  font-size: 15px;
  color: #334155;
}

.security-settings-page .site-api-key-panel__meta .enterprise-panel__muted {
  margin: 0;
  padding-top: 4px;
  font-size: 15px;
  line-height: 1.6;
  color: #3668e9;
  border-top: 1px solid #eaeaea;
}

.security-settings-page .site-api-key-panel__reveal {
  margin: 15px 0 0;
  padding: 14px 18px;
  background: linear-gradient(180deg, #fffbeb 0%, #fff 100%);
  border: 1px solid #fde68a;
  border-radius: 12px;
}

.security-settings-page .site-api-key-panel__warn {
  margin: 0 0 10px;
  font-size: 15px;
  line-height: 1.5;
  color: #92400e;
}

.security-settings-page .site-api-key-panel__full {
  display: block;
  margin: 0 0 12px;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.6;
  color: #0f172a;
  background: #fff;
  border: 1px solid #fde68a;
  border-radius: 10px;
  word-break: break-all;
}

.security-settings-page .site-api-key-panel__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0;
}

.security-settings-page .site-api-key-panel__meta + .site-api-key-panel__actions,
.security-settings-page .site-api-key-panel__reveal + .site-api-key-panel__actions {
  margin-top: 16px;
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--copy,
.security-settings-page .site-api-key-panel .impl-api-key-btn--dismiss,
.security-settings-page .site-api-key-panel .impl-api-key-btn--rotate {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 46px;
  margin: 0 !important;
  padding: 0 18px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.2;
  border-radius: 12px !important;
  border-style: solid !important;
  border-width: 1.5px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--copy::after,
.security-settings-page .site-api-key-panel .impl-api-key-btn--dismiss::after,
.security-settings-page .site-api-key-panel .impl-api-key-btn--rotate::after {
  content: "";
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--copy {
  color: #047857 !important;
  background: #ecfdf5 !important;
  border-color: #a7f3d0 !important;
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--copy::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2' ry='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E");
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--copy:hover {
  color: #065f46 !important;
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.12);
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--copy.is-copied {
  color: #047857 !important;
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--copy.is-copied::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--dismiss {
  color: #475569 !important;
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--dismiss::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E");
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--dismiss:hover {
  color: #334155 !important;
  background: #f1f5f9 !important;
  border-color: #94a3b8 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08);
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--rotate {
  color: #2562ff !important;
  background: #eef2ff !important;
  border-color: #c7d2fe !important;
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--rotate::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--rotate:hover:not(:disabled) {
  color: #3730a3 !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(79, 70, 229, 0.12);
}

.security-settings-page .site-api-key-panel .impl-api-key-btn--rotate:disabled {
  opacity: 0.55;
  cursor: not-allowed;
  transform: none;
}

.security-settings-page .site-api-key-panel__actions .enterprise-panel__muted {
  font-size: 15px;
  line-height: 1.5;
  color: #3668e9;
}

.security-settings-page .site-api-key-panel .enterprise-panel__error {
  margin: 0 0 12px;
  padding: 12px 14px;
  font-size: 15px;
  line-height: 1.5;
  color: #b91c1c;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 10px;
}

.security-settings-page .site-api-key-panel .cs-inline-loading {
  margin: 0 0 12px;
  font-size: 15px;
  color: #3668e9;
}

@media (max-width: 640px) {
  .security-settings-page .site-api-key-panel__row {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

/* Workspace audit log — alignment & spacing */
.security-settings-page .acc-card:has(.workspace-audit-panel) {
  padding: 0;
  overflow: visible;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: #fff;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.security-settings-page .acc-card:has(.workspace-audit-panel) .workspace-audit-panel {
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}

.security-settings-page .workspace-audit-panel .enterprise-panel__head {
  margin: 0;
  padding: 20px 24px;
  border-bottom: 1px solid #f1f5f9;
}

.security-settings-page .workspace-audit-panel .enterprise-panel__title {
  margin: 0 0 8px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #0f172a;
  line-height: 1.3;
}

.security-settings-page .workspace-audit-panel .enterprise-panel__intro {
  margin: 0;
  max-width: none;
  font-size: 15px;
  line-height: 1.55;
  color: #3668e9;
}

.security-settings-page .workspace-audit-panel .enterprise-panel__intro a {
  color: #4f46e5;
  font-weight: 600;
  text-decoration: none;
}

.security-settings-page .workspace-audit-panel .enterprise-panel__intro a:hover {
  text-decoration: underline;
}

.security-settings-page .workspace-audit-panel .enterprise-panel__error,
.security-settings-page .workspace-audit-panel .enterprise-panel__muted,
.security-settings-page .workspace-audit-panel .cs-inline-loading {
  margin: 0;
  padding: 14px 24px;
  font-size: 15px;
  line-height: 1.5;
}

.security-settings-page .workspace-audit-panel .enterprise-panel__error {
  color: #b91c1c;
  background: #fef2f2;
  border-bottom: 1px solid #fecaca;
}

.security-settings-page .workspace-audit-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.security-settings-page .workspace-audit-list li {
  display: grid;
  grid-template-columns: 34px 1fr;
  grid-template-rows: auto auto;
  align-items: start;
  gap: 4px 14px;
  margin: 0;
  padding: 14px 24px;
  border-top: 1px solid #eaeaea;
}

.security-settings-page .workspace-audit-list li::before {
  content: "";
  grid-row: 1 / span 2;
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background-color: #f1f5f9;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

.security-settings-page .workspace-audit-list li:first-child {
  border-top: none;
}

.security-settings-page .workspace-audit-list li:last-child {
  padding-bottom: 18px;
}

.security-settings-page .workspace-audit-list__title {
  grid-column: 2;
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.35;
  color: #0f172a;
}

.security-settings-page .workspace-audit-list__meta {
  grid-column: 2;
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
  color: #3668e9;
  word-break: break-word;
}

.security-settings-page .workspace-audit-list__meta time {
  color: #3668e9;
  white-space: nowrap;
}

.security-settings-page .workspace-audit-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin: 0;
  padding: 16px 24px 20px;
  border-top: 1px solid #f1f5f9;
}

.security-settings-page .workspace-audit-pagination .enterprise-panel__muted {
  flex: 0 0 auto;
  order: 0;
  min-width: 96px;
  margin: 0;
  padding: 0 4px;
  font-size: 14px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  text-align: center;
  color: #3668e9;
}

.security-settings-page .workspace-audit-pagination .btn.secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  order: 0;
  min-width: 112px;
  min-height: 38px;
  padding: 0 16px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  color: #2562ff !important;
  background: #eef2ff !important;
  border: 1px solid #c7d2fe !important;
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease;
}

.security-settings-page .workspace-audit-pagination .btn.secondary:first-child {
  order: -1;
}

.security-settings-page .workspace-audit-pagination .btn.secondary:last-child {
  order: 1;
}

.security-settings-page .workspace-audit-pagination .btn.secondary:first-child::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m15 18-6-6 6-6'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.security-settings-page .workspace-audit-pagination .btn.secondary:last-child::after {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.security-settings-page .workspace-audit-pagination .btn.secondary:hover:not(:disabled) {
  color: #3730a3 !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
  transform: translateY(-1px);
}

.security-settings-page .workspace-audit-pagination .btn.secondary:disabled {
  color: #94a3b8 !important;
  background: #f8fafc !important;
  border-color: #e2e8f0 !important;
  opacity: 1;
  cursor: not-allowed;
  transform: none;
}

.security-settings-page .workspace-audit-pagination .btn.secondary:disabled:first-child::before,
.security-settings-page .workspace-audit-pagination .btn.secondary:disabled:last-child::after {
  opacity: 0.45;
}

@media (max-width: 640px) {
  .security-settings-page .workspace-audit-list li {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 14px 20px;
  }

  .security-settings-page .workspace-audit-list li::before {
    display: none;
  }

  .security-settings-page .workspace-audit-list__title,
  .security-settings-page .workspace-audit-list__meta {
    grid-column: 1;
  }
}

/* Account Preferences — typography (+2px) & red-marked highlights */
.acc-page:has(.acc-profile-card) .acc-breadcrumb {
  font-size: 14px;
}
.acc-page:has(.acc-profile-card) .acc-save {
  font-size: 16px;
}

.acc-page:has(.acc-profile-card) .acc-field-label {
  font-size: 14px;
}

.acc-page:has(.acc-profile-card) .acc-input,
.acc-page:has(.acc-profile-card) .acc-select {
  font-size: 16px;
}

.acc-page:has(.acc-profile-card) .acc-name {
  font-size: 26px;
}

.acc-page:has(.acc-profile-card) .acc-avatar-initials {
  font-size: 30px;
}

.acc-page:has(.acc-profile-card) .acc-user-id {
  font-size: 13px;
}

.acc-page:has(.acc-profile-card) .acc-badge-active {
  font-size: 12px;
}

.acc-page:has(.acc-profile-card) .acc-edit-photo {
  font-size: 16px;
}

.acc-page:has(.acc-profile-card) .acc-notice-title {
  font-size: 15px;
}

.acc-page:has(.acc-profile-card) .acc-notice-body {
  font-size: 16px;
}

.acc-page:has(.acc-profile-card) .acc-btn-outline {
  font-size: 15px;
}

.acc-page:has(.acc-profile-card) .acc-footer-left,
.acc-page:has(.acc-profile-card) .acc-footer-links {
  font-size: 14px;
}

.acc-page:has(.acc-profile-card) label[for="acc-newsletter"] span {
  font-size: 15px !important;
}

.acc-page:has(.acc-profile-card) .acc-input-wrap + p {
  font-size: 14px !important;
}

/* Profile header — avatar, name, user id, active badge */
.acc-page:has(.acc-profile-card) .acc-profile-left {
  padding: 10px 14px 12px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 6px 18px rgba(15, 23, 42, 0.14);
}

.acc-page:has(.acc-profile-card) .acc-avatar {
  box-shadow:
    0 0 0 3px #fff,
    0 0 0 5px rgba(99, 102, 241, 0.45),
    0 6px 16px rgba(79, 70, 229, 0.35);
}

.acc-page:has(.acc-profile-card) .acc-name {
  color: #312e81;
}

.acc-page:has(.acc-profile-card) .acc-user-id {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  font-weight: 600;
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 999px;
}

.acc-page:has(.acc-profile-card) .acc-badge-active {
  padding: 4px 10px;
  font-size: 12px;
  letter-spacing: 0.05em;
  color: #047857;
  background: #ecfdf5;
  border-color: #6ee7b7;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

/* Edit Profile Photo */
.acc-page:has(.acc-profile-card) .acc-edit-photo {
  min-height: 42px;
  padding: 0 18px;
  color: #312e81 !important;
  background: #fff !important;
  border: 2px solid #a5b4fc !important;
  border-radius: 12px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 4px 14px rgba(99, 102, 241, 0.22);
}

.acc-page:has(.acc-profile-card) .acc-edit-photo::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3z'/%3E%3Ccircle cx='12' cy='13' r='3'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.acc-page:has(.acc-profile-card) .acc-edit-photo:hover {
  background: #eef2ff !important;
  border-color: #6366f1 !important;
  box-shadow: 0 6px 18px rgba(99, 102, 241, 0.28);
}

/* Form fields — full name, email, role, country */
.acc-page:has(.acc-profile-card) .acc-form-grid .acc-input-wrap .acc-input {
  padding-left: 41px;
}

.acc-page:has(.acc-profile-card) .acc-form-grid .acc-input-wrap--lock .acc-input {
  padding-right: 41px;
}

.acc-page:has(.acc-profile-card) .acc-form-grid .acc-select-wrap .acc-select {
  padding-left: 41px;
  padding-right: 52px;
}

.acc-page:has(.acc-profile-card) .acc-form-grid .acc-input-icon {
  left: 14px;
}

.acc-page:has(.acc-profile-card) .acc-form-grid .acc-input,
.acc-page:has(.acc-profile-card) .acc-form-grid .acc-select {
  font-weight: 600;
  color: #312e81;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.acc-page:has(.acc-profile-card) .acc-form-grid .acc-input:disabled {
  color: #2562ff;
  background: #eef2ff;
  opacity: 1;
}

.acc-page:has(.acc-profile-card) .acc-form-grid .acc-input:focus,
.acc-page:has(.acc-profile-card) .acc-form-grid .acc-select:focus {
  border-color: #6366f1;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 0 0 3px rgba(99, 102, 241, 0.18);
}

.acc-page:has(.acc-profile-card) .acc-form-grid .acc-select-wrap::after {
  right: 10px;
  width: 28px;
  height: 28px;
  padding: 6px;
  box-sizing: border-box;
  border-radius: 8px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / 16px 16px no-repeat,
    #e0e7ff;
  border: 1px solid #a5b4fc;
}

/* Security settings sidebar card */
.acc-page:has(.acc-profile-card) .acc-notice-card {
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  padding: 22px 20px;
  background: linear-gradient(145deg, #eef2ff 0%, #fff 42%, #f0fdfa 100%);
  border: 2px solid #a5b4fc;
  border-radius: 16px;
}

.acc-page:has(.acc-profile-card) .acc-notice-card .acc-notice-title {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0;
  color: #312e81;
}

.acc-page:has(.acc-profile-card) .acc-notice-card .acc-notice-title::before {
  content: "";
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background-color: #eef2ff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3l7 4v5c0 5-3.2 8.8-7 10-3.8-1.2-7-5-7-10V7l7-4z'/%3E%3C/svg%3E");
  background-position: center;
  background-size: 18px 18px;
  background-repeat: no-repeat;
  border: 1px solid #c7d2fe;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.acc-page:has(.acc-profile-card) .acc-notice-card .acc-notice-body {
  color: #475569;
  padding: 0;
  margin-top: 10px;
  margin-bottom: 8px;
}

.acc-page:has(.acc-profile-card) .acc-notice-card a.acc-btn-outline {
  font-size: 0;
  gap: 8px;
  margin-top: 14px !important;
  min-height: 42px;
  padding: 0 18px;
  font-weight: 700;
  color: #312e81 !important;
  background: #fff !important;
  border: 1px solid #818cf8 !important;
}

.acc-page:has(.acc-profile-card) .acc-notice-card a.acc-btn-outline::before {
  content: "Open Security";
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  color: #312e81;
  padding-left: 22px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='10' width='14' height='11' rx='2'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") left center / 16px 16px no-repeat;
}

.acc-page:has(.acc-profile-card) .acc-notice-card a.acc-btn-outline::after {
  width: 16px;
  height: 16px;
  background-size: 16px 16px;
}

.acc-page:has(.acc-profile-card) .acc-notice-card a.acc-btn-outline:hover:not(:disabled) {
  background: #eef2ff !important;
  border-color: #6366f1 !important;
}

.acc-page:has(.acc-profile-card) .acc-notice-card a.acc-btn-outline:hover:not(:disabled)::before {
  color: #3730a3;
}

/* ─── Billing ─── */
.bill-page {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: none;
  padding: 0 !important;
}

.bill-page .bill-head {
  align-items: end;
  gap: 16px;
  margin: 0;
  padding: 22px 24px;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.06) 0%, #fff 48%, rgba(13, 148, 136, 0.04) 100%);
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.bill-page .bill-breadcrumb {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #4f46e5;
}

.bill-page .bill-title {
  margin: 0;
  font-size: clamp(28px, 2.2vw, 34px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0f172a;
}

.bill-page .bill-subtitle {
  margin-top: 10px;
  font-size: 16px;
  line-height: 1.55;
  color: #3668e9;
}

.bill-page .bill-head-actions {
  margin-left: auto;
}

.bill-page .bill-btn-portal,
.bill-page .bill-btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  height: auto;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 600;
  border-radius: 10px;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.bill-page .bill-btn-portal {
  color: #2562ff !important;
  background: #eef2ff !important;
  border: 1px solid #c7d2fe !important;
}

.bill-page .bill-btn-portal::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h6v6'/%3E%3Cpath d='M10 14 21 3'/%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.bill-page .bill-btn-portal:hover:not(:disabled) {
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.15);
}

.bill-page .bill-btn-secondary {
  color: #334155 !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
}

.bill-page .bill-btn-secondary::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8'/%3E%3Cpath d='M21 3v5h-5'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.bill-page .bill-btn-secondary:hover:not(:disabled) {
  background: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
}

.bill-page .bill-status-grid,
.bill-page .product-hub-stat-grid.bill-status-grid {
  margin-top: 0;
  gap: 16px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.bill-page .product-hub-stat-grid--usage.bill-usage-grid {
  margin-top: 0;
  gap: 16px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1024px) {
  .bill-page .product-hub-stat-grid.bill-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .bill-page .product-hub-stat-grid.bill-status-grid,
  .bill-page .product-hub-stat-grid--usage.bill-usage-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .bill-page .product-hub-stat-grid--usage.bill-usage-grid {
    grid-template-columns: 1fr;
  }
}

/* Billing metrics — product-hub stat cards */
.bill-page .product-hub-stat-card.bill-status-card,
.bill-page .product-hub-stat-card.bill-usage-card {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto auto;
  column-gap: 12px;
  row-gap: 8px;
  align-items: center;
  min-height: 112px;
  height: auto;
  padding: 18px 20px 20px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 2px rgba(15, 23, 42, 0.04);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.bill-page .product-hub-stat-card.bill-status-card:hover,
.bill-page .product-hub-stat-card.bill-usage-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
}

.bill-page .product-hub-stat-card .product-hub-stat-card__icon {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 18px 18px;
}

.bill-page .product-hub-stat-card .product-hub-stat-card__label,
.bill-page .product-hub-stat-card .bill-label,
.bill-page .product-hub-stat-card .bill-usage-label {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  display: inline-flex;
  align-items: center;
  align-self: center;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.2;
  color: #3668e9;
}

.bill-page .product-hub-stat-card .product-hub-stat-card__value,
.bill-page .product-hub-stat-card .bill-status-value,
.bill-page .product-hub-stat-card .bill-usage-val {
  grid-column: 1 / -1;
  grid-row: 2;
  margin: 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: #0f172a;
}

.bill-page .product-hub-stat-card .product-hub-stat-card__helper,
.bill-page .product-hub-stat-card .bill-status-sub {
  grid-column: 1 / -1;
  grid-row: 3;
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1.45;
  color: #3668e9;
}

.bill-page .product-hub-stat-card .bill-status-value--plan {
  color: #4f46e5;
}

.bill-page .product-hub-stat-card .bill-status-value--green {
  color: #059669;
}

.bill-page .product-hub-stat-card .bill-status-value--warn {
  color: #d97706;
}

.bill-page .product-hub-stat-card .bill-status-value--danger {
  color: #dc2626;
}

.bill-page .product-hub-stat-card .bill-status-value--muted {
  color: #94a3b8;
}

.bill-page .product-hub-stat-card .bill-seats-num {
  color: #4f46e5;
}

.bill-page .product-hub-stat-card .bill-provider-pill {
  font-size: 10px;
}

/* Billing stat card icons */
.bill-page .product-hub-stat-card__icon--plan {
  background-color: #ede9fe;
  border: 1px solid #ddd6fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%237c3aed' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='14' x='2' y='5' rx='2'/%3E%3Cline x1='2' x2='22' y1='10' y2='10'/%3E%3C/svg%3E");
}

.bill-page .product-hub-stat-card:nth-child(1) .product-hub-stat-card__label {
  color: #6d28d9;
}

.bill-page .product-hub-stat-card__icon--status {
  background-color: #e0f2fe;
  border: 1px solid #bae6fd;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%230284c7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpath d='m9 11 3 3L22 4'/%3E%3C/svg%3E");
}

.bill-page .product-hub-stat-card:nth-child(2) .product-hub-stat-card__label {
  color: #0369a1;
}

.bill-page .product-hub-stat-card__icon--trial {
  background-color: #fef3c7;
  border: 1px solid #fde68a;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23d97706' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E");
}

.bill-page .product-hub-stat-card:nth-child(3) .product-hub-stat-card__label {
  color: #b45309;
}

.bill-page .product-hub-stat-card__icon--seats {
  background-color: #e0e7ff;
  border: 1px solid #c7d2fe;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236366f1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='4'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.87'/%3E%3Cpath d='M16 3.13a4 4 0 0 1 0 7.75'/%3E%3C/svg%3E");
}

.bill-page .product-hub-stat-card:nth-child(4) .product-hub-stat-card__label {
  color: #2562ff;
}

/* Billing usage cards */
.bill-page .product-hub-stat-card--usage.bill-usage-card {
  grid-template-columns: auto 1fr auto;
  grid-template-rows: auto auto;
  column-gap: 12px;
  row-gap: 14px;
  align-items: center;
  min-height: 108px;
  padding: 18px 20px 16px;
}

.bill-page .product-hub-stat-card--usage .product-hub-stat-card__icon.bill-usage-icon {
  grid-column: 1;
  grid-row: 1;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  border: none;
}

.bill-page .product-hub-stat-card--usage .bill-usage-icon svg {
  width: 18px;
  height: 18px;
}

.bill-page .product-hub-stat-card--usage .product-hub-stat-card__label {
  grid-column: 2;
  grid-row: 1;
}

.bill-page .product-hub-stat-card--usage .product-hub-stat-card__value {
  grid-column: 3;
  grid-row: 1;
  justify-self: end;
  font-size: 17px;
  font-weight: 700;
}

.bill-page .product-hub-stat-card--usage .bill-usage-val .bill-muted {
  color: #94a3b8;
  font-weight: 500;
}

.bill-page .product-hub-stat-card--usage .bill-usage-track {
  grid-column: 1 / -1;
  grid-row: 2;
  margin-top: 0;
  height: 6px;
  background: #e8ebed;
  border-radius: 999px;
  overflow: hidden;
}

.bill-page .product-hub-stat-card--usage .bill-usage-fill {
  border-radius: 999px;
  min-width: 2px;
  transition: width 0.35s ease;
}

.bill-page .product-hub-stat-card--usage .bill-usage-icon--ai {
  color: #fff;
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
}

.bill-page .product-hub-stat-card--usage:nth-child(1) .product-hub-stat-card__label {
  color: #6366f1;
}

.bill-page .product-hub-stat-card--usage .bill-usage-icon--scan {
  color: #fff;
  background: linear-gradient(135deg, #f59e0b, #f97316);
}

.bill-page .product-hub-stat-card--usage:nth-child(2) .product-hub-stat-card__label {
  color: #d97706;
}

.bill-page .product-hub-stat-card--usage .bill-usage-icon--export {
  color: #fff;
  background: linear-gradient(135deg, #22c55e, #16a34a);
}

.bill-page .product-hub-stat-card--usage:nth-child(3) .product-hub-stat-card__label {
  color: #059669;
}

.bill-page .product-hub-stat-card--usage .bill-usage-fill--ai {
  background: linear-gradient(90deg, #6366f1, #8b5cf6);
}

.bill-page .product-hub-stat-card--usage .bill-usage-fill--scan {
  background: linear-gradient(90deg, #f59e0b, #f97316);
}

.bill-page .product-hub-stat-card--usage .bill-usage-fill--export {
  background: linear-gradient(90deg, #22c55e, #16a34a);
}

.bill-page .bill-plan-card,
.bill-page .bill-invoices-card,
.bill-page .bill-panel {
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

/* ─── Billing plan cards — clean full-width grid (+2px type) ─── */
.bill-page .bill-plans-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: 16px;
  width: 100%;
  margin: 0;
  box-sizing: border-box;
}

.bill-page .bill-plan-card {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  min-height: 100%;
  height: 100%;
  margin: 0;
  padding: 25px 27px 24px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
}

.bill-page .bill-plan-card--has-badge {
  padding-top: 24px;
}

.bill-page .bill-plan-card--popular {
  border-color: #c7d2fe;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 0 0 1px rgba(99, 102, 241, 0.08),
    0 8px 24px rgba(99, 102, 241, 0.08);
}

.bill-page .bill-plan-card--enterprise {
  background: linear-gradient(180deg, #f5f3ff 0%, #fff 128px);
  border-color: #a5b4fc;
}

.bill-page .bill-plan-badge {
  top: -15px;
  padding: 5px 17px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.2;
  border-radius: 999px;
}

.bill-page .bill-plan-name {
  margin: 0;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: #0f172a;
}

.bill-page .bill-plan-desc {
  margin: 8px 0 0;
  min-height: 44px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
  color: #3668e9;
}
.bill-page .bill-plan-card:has(.bill-plan-desc) .bill-plan-price-row {
  margin-top: 6px;
}

.bill-page .bill-plan-price-row {
  display: flex;
  align-items: flex-end;
  gap: 4px;
  min-height: 46px;
}

.bill-page .bill-plan-price {
  font-size: 40px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.03em;
  color: #0f172a;
}

.bill-page .bill-plan-suffix {
  margin-bottom: 6px;
  font-size: 17px;
  font-weight: 500;
  color: #94a3b8;
}

.bill-page .bill-plan-divider {
  height: 1px;
  margin: 16px 0;
  background: #e2e8f0;
  flex-shrink: 0;
}

.bill-page .bill-plan-features-lead {
  margin: 0 0 12px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--ds-color-neutral);
}

.bill-page .bill-plan-features {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
}

.bill-page .bill-plan-card--enterprise .bill-plan-features {
  gap: 8px;
}

.bill-page .bill-feature-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.45;
  color: #374151;
}

.bill-page .bill-plan-card--enterprise .bill-feature-row {
  font-size: 15px;
  line-height: 1.4;
  gap: 8px;
}

.bill-page .bill-check {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-top: 1px;
  border-radius: 999px;
  color: var(--accent-purple);
  background: #e9efff;
}

.bill-page .bill-check svg {
  width: 14px;
  height: 14px;
}

.bill-page .bill-plan-spacer {
  flex: 1 1 auto;
  min-height: 16px;
  width: 100%;
}

.bill-page .bill-plan-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-sizing: border-box;
  flex-shrink: 0;
  width: 100%;
  min-height: 48px;
  height: 48px;
  margin-top: 16px;
  padding: 0 18px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  border-radius: 10px;
  border: none;
  cursor: pointer;
  transition:
    background 0.15s ease,
    opacity 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.bill-page .bill-plan-cta::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

.bill-page .bill-plan-cta--current {
  color: #3668e9;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  cursor: default;
}

.bill-page .bill-plan-cta--current::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233668e9' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

.bill-page .bill-plan-cta--gradient {
  color: #fff;
  background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.28);
}

.bill-page .bill-plan-cta--gradient::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 7-7 7 7'/%3E%3Cpath d='M12 19V5'/%3E%3C/svg%3E");
}

.bill-page .bill-plan-cta--gradient:hover:not(:disabled) {
  opacity: 1;
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(99, 102, 241, 0.36);
}

.bill-page .bill-plan-cta--dark,
.bill-page a.bill-plan-cta--dark {
  color: #fff;
  background: #0f172a;
}

.bill-page .bill-plan-cta--enterprise,
.bill-page a.bill-plan-cta--enterprise {
  color: #fff;
  background: linear-gradient(135deg, #312e81 0%, #1e1b4b 100%);
  box-shadow: 0 2px 8px rgba(49, 46, 129, 0.28);
}

.bill-page .bill-plan-cta--enterprise::after,
.bill-page a.bill-plan-cta--enterprise::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='16' x='2' y='4' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E");
}

.bill-page .bill-plan-cta--dark:not(.bill-plan-cta--enterprise)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.bill-page .bill-plan-cta--dark:hover:not(:disabled),
.bill-page a.bill-plan-cta--dark:hover {
  background: #1e293b;
  transform: translateY(-1px);
}

.bill-page .bill-plan-cta--enterprise:hover:not(:disabled),
.bill-page a.bill-plan-cta--enterprise:hover {
  background: linear-gradient(135deg, #3730a3 0%, #312e81 100%);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(49, 46, 129, 0.34);
}

.bill-page .bill-plan-cta:disabled {
  opacity: 0.72;
  cursor: not-allowed;
  transform: none;
}

@media (max-width: 1024px) {
  .bill-page .bill-plans-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px;
  }

  .bill-page .bill-plan-card--enterprise {
    grid-column: 1 / -1;
  }

  .bill-page .bill-plan-card:not(:has(.bill-plan-desc)) .bill-plan-price-row {
    margin-top: 12px;
  }
}

@media (max-width: 640px) {
  .bill-page .bill-plans-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 30px;
  }

  .bill-page .bill-plan-card {
    padding: 20px 20px 20px;
  }

  .bill-page .bill-plan-card--enterprise {
    grid-column: auto;
  }

  .bill-page .bill-plan-price {
    font-size: 34px;
  }
}

.bill-page .bill-section-label {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--ds-color-neutral);
  line-height: 1.2;
}

.bill-page .bill-plans-intro {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 16px;
  margin: 24px 0 15px;
  padding: 14px 18px 14px 22px;
  background: linear-gradient(135deg, #eef2ff 0%, #fff 52%, #ecfdf5 100%);
  border: 1px solid #c7d2fe;
  border-radius: 12px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 1px 3px rgba(99, 102, 241, 0.08);
}

.bill-page .bill-plans-intro .bill-section-label {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.bill-page .bill-plans-intro__badge {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.bill-page .bill-plans-intro .cs-readiness-badge {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.25;
  padding: 6px 14px;
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.bill-page .bill-plans-intro .cs-readiness-badge--success {
  color: #047857;
  background: #ecfdf5;
  border: 1px solid #6ee7b7;
}

.bill-page .bill-plans-intro .cs-readiness-badge--warn {
  color: #b45309;
  background: #fffbeb;
  border: 1px solid #fcd34d;
}

.bill-page .bill-plans-intro .cs-readiness-badge--info {
  color: #1d4ed8;
  background: #eff6ff;
  border: 1px solid #93c5fd;
}

.bill-page .bill-plans-intro .cs-readiness-badge--muted {
  color: #475569;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}

@media (max-width: 640px) {
  .bill-page .bill-plans-intro {
    flex-direction: column;
    align-items: flex-start;
    padding: 12px 14px;
  }
}

.bill-page .bill-chip {
  font-size: 14px;
  padding: 9px 16px;
}

/* ─── Billing bottom grid — invoices, alerts & support ─── */
.bill-page .bill-bottom-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.75fr) minmax(0, 1fr);
  align-items: start;
  gap: 20px;
  margin-top: 0;
}

.bill-page .bill-stack {
  display: flex;
  flex-direction: column;
  gap: 16px;
  min-width: 0;
}

.bill-page .bill-invoices-card {
  overflow: hidden;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 72px);
  border: 1px solid #c7d2fe;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 1px 3px rgba(99, 102, 241, 0.08);
}

.bill-page .bill-invoices-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 22px 13px 24px;
  border-bottom: 1px solid #e2e8f0;
  background: #fff;
}

.bill-page .bill-invoices-title,
.bill-page .bill-panel-title {
  margin: 0;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  line-height: 1.2;
  color: #262626;
}

.bill-page .bill-panel {
  padding: 20px 22px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 1px 3px rgba(15, 23, 42, 0.06);
}

.bill-page .bill-panel--alerts {
  background: linear-gradient(180deg, #fffbeb 0%, #fff 88px);
  border-color: #fde68a;
}

.bill-page .bill-panel--support {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 14px;
  padding: 22px 20px;
  background: linear-gradient(180deg, #ecfdf5 0%, #fff 72px);
  border-color: #a7f3d0;
}

.bill-page .bill-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}

.bill-page .bill-table thead th {
  padding: 12px 22px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: left;
  color: #3668e9;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.bill-page .bill-table tbody td {
  height: auto;
  min-height: 52px;
  padding: 14px 22px;
  vertical-align: middle;
  border-bottom: 1px solid #f1f5f9;
  color: #334155;
  font-size: 15px;
}

.bill-page .bill-table tbody tr:hover td {
  background: #f8fafc;
}

.bill-page .bill-empty-row {
  padding: 28px 22px !important;
  text-align: center;
  color: #3668e9;
  font-size: 14px;
  line-height: 1.55;
  background: #fff;
}

.bill-page .bill-alerts-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 18px 8px 10px;
  gap: 0;
}

.bill-page .bill-alerts-empty-icon {
  width: 44px;
  height: 44px;
  color: #fbbf24;
  opacity: 1;
}

.bill-page .bill-alerts-empty-title {
  margin: 14px 0 0;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.3;
  color: #0f172a;
}

.bill-page .bill-alerts-empty-sub {
  margin: 8px 0 0;
  max-width: 28ch;
  font-size: 15px;
  line-height: 1.5;
  color: #3668e9;
}

.bill-page .bill-support-text {
  margin: 0;
  max-width: 30ch;
  font-size: 15px;
  line-height: 1.55;
  color: #475569;
}

.bill-page .bill-download-all,
.bill-page .bill-support-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 36px;
  padding: 0 14px 0 16px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1;
  border-radius: 999px;
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.bill-page .bill-download-all {
  color: #2562ff;
  background: #eef2ff;
  border-color: #c7d2fe;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.bill-page .bill-download-all::after {
  content: "";
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='7 10 12 15 17 10'/%3E%3Cline x1='12' x2='12' y1='15' y2='3'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.bill-page .bill-download-all:hover:not(:disabled) {
  color: #3730a3;
  background: #e0e7ff;
  border-color: #a5b4fc;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.16);
  text-decoration: none;
}

.bill-page .bill-support-btn {
  width: 100%;
  max-width: 260px;
  margin-top: 0;
  color: #047857;
  background: #ecfdf5;
  border-color: #a7f3d0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.bill-page .bill-support-btn::after {
  content: "";
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' x2='21' y1='14' y2='3'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.bill-page .bill-support-btn:hover {
  color: #065f46;
  background: #d1fae5;
  border-color: #6ee7b7;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.14);
  text-decoration: none;
}

.bill-page .bill-alert-row {
  margin-top: 12px;
  font-size: 13px;
  line-height: 1.45;
}

@media (max-width: 1024px) {
  .bill-page .bill-bottom-grid {
    grid-template-columns: 1fr;
  }
}

.bill-page .bill-footer {
  margin-top: 0;
  padding-top: 16px;
}

@media (max-width: 768px) {
  .bill-page .bill-head {
    flex-direction: column;
    align-items: stretch;
  }

  .bill-page .bill-head-actions {
    margin-left: 0;
    width: 100%;
    justify-content: flex-start;
  }
}

/* ─── System Health (settings) — rhythm + actions ─── */
.product-hub-page.system-health-hub-page > * + *,
.app-container > .product-hub-page.system-health-hub-page > * + * {
  margin-top: 0 !important;
}

.product-hub-page.system-health-hub-page {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.product-hub-page.system-health-hub-page .product-hub-hero__title {
  font-size: clamp(28px, 2.2vw, 34px);
}

.product-hub-page.system-health-hub-page .product-hub-hero__subtitle {
  font-size: 17px;
}

.product-hub-page.system-health-hub-page .system-health-section-title {
  margin: 0 0 12px;
  font-size: 14px;
}

.product-hub-page.system-health-hub-page .product-hub-hero__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 0;
}

.product-hub-page.system-health-hub-page .product-hub-hero__actions .btn.secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  border-radius: 10px;
  border-style: solid;
  border-width: 1px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease,
    transform 0.12s ease,
    box-shadow 0.15s ease;
}

.product-hub-page.system-health-hub-page .product-hub-hero__actions .btn.secondary::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

.product-hub-page.system-health-hub-page .product-hub-hero__actions button.btn.secondary {
  color: #047857 !important;
  background: #ecfdf5 !important;
  border-color: #a7f3d0 !important;
}

.product-hub-page.system-health-hub-page .product-hub-hero__actions button.btn.secondary::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

.product-hub-page.system-health-hub-page .product-hub-hero__actions button.btn.secondary:hover:not(:disabled) {
  color: #065f46 !important;
  background: #d1fae5 !important;
  border-color: #6ee7b7 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.14);
}

.product-hub-page.system-health-hub-page .product-hub-hero__actions button.btn.secondary:disabled {
  opacity: 0.65;
  cursor: not-allowed;
  transform: none;
}

.product-hub-page.system-health-hub-page .product-hub-hero__actions a.btn.secondary {
  color: #2562ff !important;
  background: #eef2ff !important;
  border-color: #c7d2fe !important;
}

.product-hub-page.system-health-hub-page .product-hub-hero__actions a.btn.secondary::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z'/%3E%3C/svg%3E");
}

.product-hub-page.system-health-hub-page .product-hub-hero__actions a.btn.secondary:hover {
  color: #3730a3 !important;
  background: #e0e7ff !important;
  border-color: #a5b4fc !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(99, 102, 241, 0.18);
}

/* System Health — overall status, infrastructure & summary highlights */
.product-hub-page.system-health-hub-page > .product-hub-stat-card {
  padding: 22px 24px;
  border: 1px solid #c7d2fe;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .product-hub-stat-card__label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 700;
  margin-bottom: 8px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 8px;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .product-hub-stat-card__label::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-4l-3 9L9 3l-3 9H2'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .system-health-status {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px 14px;
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  border-radius: 999px;
  border: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .system-health-status::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .system-health-status::after {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1.2;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .system-health-status--healthy {
  background: #ecfdf5;
  border-color: #a7f3d0;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .system-health-status--healthy::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .system-health-status--healthy::after {
  content: "Healthy";
  color: #047857;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .system-health-status--warning {
  background: #fffbeb;
  border-color: #fde68a;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .system-health-status--warning::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3z'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .system-health-status--warning::after {
  content: "Warning";
  color: #b45309;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .system-health-status--failed {
  background: #fef2f2;
  border-color: #fecaca;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .system-health-status--failed::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m15 9-6 6'/%3E%3Cpath d='m9 9 6 6'/%3E%3C/svg%3E");
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .system-health-status--failed::after {
  content: "Failed";
  color: #b91c1c;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .product-hub-stat-card__helper {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  width: 100%;
  margin-top: 4px;
  padding: 10px 14px;
  font-size: 16px;
  line-height: 1.5;
  color: #475569;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .product-hub-stat-card__helper::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 2a14.5 14.5 0 0 0 0 20 14.5 14.5 0 0 0 0-20'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .product-hub-stat-card__helper strong {
  color: #312e81;
  font-weight: 600;
  word-break: break-all;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .product-hub-stat-card__helper strong:has(+ .product-hub-stat-card__last-check)::after {
  content: "·";
  margin: 0 10px;
  color: #cbd5e1;
  font-weight: 400;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .product-hub-stat-card__last-check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  line-height: 1.5;
  color: #3668e9;
}

.product-hub-page.system-health-hub-page > .product-hub-stat-card .product-hub-stat-card__last-check::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%230891b2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpolyline points='12 6 12 12 16 14'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.product-hub-page.system-health-hub-page .system-health-infra {
  padding: 20px 24px;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.95),
    0 1px 3px rgba(15, 23, 42, 0.05);
}

.product-hub-page.system-health-hub-page .system-health-section-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #0f172a;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 8px;
}

.product-hub-page.system-health-hub-page .system-health-section-title::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='2' width='20' height='8' rx='2'/%3E%3Crect x='2' y='14' width='20' height='8' rx='2'/%3E%3Cpath d='M6 6h.01M6 18h.01'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.product-hub-page.system-health-hub-page .system-health-infra__list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.product-hub-page.system-health-hub-page .system-health-infra__list li {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 42px;
  padding: 8px 14px;
  font-size: 14px;
  color: #334155;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.product-hub-page.system-health-hub-page .system-health-infra__list li > span:first-child {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  color: #0f172a;
}

.product-hub-page.system-health-hub-page .system-health-infra__list li:nth-child(1) > span:first-child::before {
  content: "";
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%233668e9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='5' rx='9' ry='3'/%3E%3Cpath d='M3 5v14c0 1.66 4 3 9 3s9-1.34 9-3V5'/%3E%3Cpath d='M3 12c0 1.66 4 3 9 3s9-1.34 9-3'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.product-hub-page.system-health-hub-page .system-health-infra__list li:nth-child(2) > span:first-child::before {
  content: "";
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%233668e9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.product-hub-page.system-health-hub-page .system-health-infra__list li:nth-child(3) > span:first-child::before {
  content: "";
  width: 14px;
  height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%233668e9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2v4'/%3E%3Cpath d='m4.93 4.93 2.83 2.83'/%3E%3Cpath d='M2 12h4'/%3E%3Cpath d='m4.93 19.07 2.83-2.83'/%3E%3Cpath d='M12 18v4'/%3E%3Cpath d='m19.07 19.07-2.83-2.83'/%3E%3Cpath d='M18 12h4'/%3E%3Cpath d='m19.07 4.93-2.83 2.83'/%3E%3C/svg%3E") center / 14px 14px no-repeat;
}

.product-hub-page.system-health-hub-page .system-health-infra__ok,
.product-hub-page.system-health-hub-page .system-health-infra__warn,
.product-hub-page.system-health-hub-page .system-health-infra__bad,
.product-hub-page.system-health-hub-page .system-health-infra__list li > span:last-child:not([class*="system-health-infra__"]) {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  border-radius: 999px;
  border: 1px solid transparent;
  white-space: nowrap;
}

.product-hub-page.system-health-hub-page .system-health-infra__ok {
  color: #047857;
  background: #ecfdf5;
  border-color: #a7f3d0;
}

.product-hub-page.system-health-hub-page .system-health-infra__ok::before {
  content: "";
  width: 12px;
  height: 12px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
}

.product-hub-page.system-health-hub-page .system-health-infra__warn {
  color: #b45309;
  background: #fffbeb;
  border-color: #fde68a;
}

.product-hub-page.system-health-hub-page .system-health-infra__warn::before {
  content: "";
  width: 12px;
  height: 12px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
}

.product-hub-page.system-health-hub-page .system-health-infra__bad {
  color: #b91c1c;
  background: #fef2f2;
  border-color: #fecaca;
}

.product-hub-page.system-health-hub-page .system-health-infra__bad::before {
  content: "";
  width: 12px;
  height: 12px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E") center / 12px 12px no-repeat;
}

.product-hub-page.system-health-hub-page .system-health-infra__list li > span:last-child:not([class*="system-health-infra__"]) {
  color: #3668e9;
  background: #f8fafc;
  border-color: #e2e8f0;
  text-transform: none;
  font-weight: 600;
  letter-spacing: 0;
}

.product-hub-page.system-health-hub-page p.product-hub-panel-note:not(:has(a)):not(.cs-inline-loading) {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  width: fit-content;
  max-width: 100%;
  margin: 0;
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.45;
  color: #475569;
  background: linear-gradient(90deg, #ecfdf5 0%, #fffbeb 50%, #fef2f2 100%);
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.product-hub-page.system-health-hub-page .system-health-summary__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.45;
}

.product-hub-page.system-health-hub-page .system-health-summary__item:not(:last-child)::after {
  content: "·";
  margin-left: 10px;
  color: #cbd5e1;
  font-weight: 400;
}

.product-hub-page.system-health-hub-page .system-health-summary__item::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

.product-hub-page.system-health-hub-page .system-health-summary__item--healthy {
  color: #047857;
}

.product-hub-page.system-health-hub-page .system-health-summary__item--healthy::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

.product-hub-page.system-health-hub-page .system-health-summary__item--warning {
  color: #b45309;
}

.product-hub-page.system-health-hub-page .system-health-summary__item--warning::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3z'/%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E");
}

.product-hub-page.system-health-hub-page .system-health-summary__item--failed {
  color: #b91c1c;
}

.product-hub-page.system-health-hub-page .system-health-summary__item--failed::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m15 9-6 6'/%3E%3Cpath d='m9 9 6 6'/%3E%3C/svg%3E");
}

.product-hub-page.system-health-hub-page p.product-hub-panel-note:not(:has(a)):not(.cs-inline-loading):not(.system-health-summary)::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18'/%3E%3Cpath d='M7 16l4-5 4 3 5-7'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.product-hub-page.system-health-hub-page .product-hub-stat-card__label {
  font-size: 14px;
}

.product-hub-page.system-health-hub-page .product-hub-stat-card__value,
.product-hub-page.system-health-hub-page .product-hub-stat-card strong {
  font-size: 18px;
}

.product-hub-page.system-health-hub-page .product-hub-stat-card__helper {
  font-size: 16px;
}

/* ─── Shared forms & tables (target pages) ─── */
.system-settings-page input:not([type="checkbox"]):not([type="radio"]),
.system-settings-page select,
.system-settings-page textarea,
.acc-page input:not([type="checkbox"]):not([type="radio"]),
.acc-page select,
.acc-page textarea,
.security-settings-page input:not([type="checkbox"]):not([type="radio"]),
.security-settings-page select,
.security-settings-page textarea,
.bill-page input:not([type="checkbox"]):not([type="radio"]),
.bill-page select,
.bill-page textarea,
.product-hub-page.system-health-hub-page input:not([type="checkbox"]):not([type="radio"]),
.product-hub-page.system-health-hub-page select,
.product-hub-page.system-health-hub-page textarea {
  min-height: 46px;
  padding: 10px 14px;
  font-size: 15px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background-color: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ai-assist-page input:not([type="checkbox"]):not([type="radio"]),
.ai-assist-page select,
.ai-assist-page textarea,
.ai-review-page input:not([type="checkbox"]):not([type="radio"]),
.ai-review-page select,
.ai-review-page textarea,
.ai-usage-page input:not([type="checkbox"]):not([type="radio"]),
.ai-usage-page select,
.ai-usage-page textarea,
.ai-set-page input:not([type="checkbox"]):not([type="radio"]),
.ai-set-page select,
.ai-set-page textarea,
.mod-page input:not([type="checkbox"]):not([type="radio"]),
.mod-page select,
.mod-page textarea,
.translations-page input:not([type="checkbox"]):not([type="radio"]),
.translations-page select,
.translations-page textarea,
.product-hub-page.agency-hub-page input:not([type="checkbox"]):not([type="radio"]),
.product-hub-page.agency-hub-page select,
.product-hub-page.agency-hub-page textarea {
  min-height: 44px;
  padding: 10px 14px;
  font-size: 15px;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  background-color: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ai-assist-page select,
.ai-review-page select,
.ai-usage-page select,
.ai-set-page select,
.mod-page select,
.translations-page select,
.system-settings-page select,
.acc-page select,
.security-settings-page select,
.bill-page select,
.product-hub-page.agency-hub-page select {
  appearance: none;
  padding-right: 40px;
  background-image:
    linear-gradient(45deg, transparent 50%, #3668e9 50%),
    linear-gradient(135deg, #3668e9 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% + 2px),
    calc(100% - 12px) calc(50% + 2px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

.ai-assist-page input:focus,
.ai-assist-page select:focus,
.ai-assist-page textarea:focus,
.ai-review-page input:focus,
.ai-review-page select:focus,
.ai-review-page textarea:focus,
.ai-usage-page input:focus,
.ai-usage-page select:focus,
.ai-usage-page textarea:focus,
.ai-set-page input:focus,
.ai-set-page select:focus,
.ai-set-page textarea:focus,
.mod-page input:focus,
.mod-page select:focus,
.mod-page textarea:focus,
.translations-page input:focus,
.translations-page select:focus,
.translations-page textarea:focus,
.system-settings-page input:focus,
.system-settings-page select:focus,
.system-settings-page textarea:focus,
.acc-page input:focus,
.acc-page select:focus,
.acc-page textarea:focus,
.security-settings-page input:focus,
.security-settings-page select:focus,
.security-settings-page textarea:focus,
.bill-page input:focus,
.bill-page select:focus,
.bill-page textarea:focus,
.product-hub-page.agency-hub-page input:focus,
.product-hub-page.agency-hub-page select:focus,
.product-hub-page.agency-hub-page textarea:focus {
  border-color: #6366f1;
  outline: none;
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.15);
}

/* Shared table polish */
.ai-review-page table,
.ai-usage-page table,
.mod-page table,
.translations-page table,
.system-settings-page table,
.acc-page table,
.bill-page table,
.product-hub-page.agency-hub-page table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 15px;
}

.ai-review-page table th,
.ai-usage-page table th,
.mod-page table th,
.translations-page table th,
.acc-page table th,
.bill-page table th,
.product-hub-page.agency-hub-page table th {
  padding: 12px 16px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: left;
  color: #3668e9;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.ai-review-page table td,
.ai-usage-page table td,
.mod-page table td,
.translations-page table td,
.acc-page table td,
.bill-page table td,
.product-hub-page.agency-hub-page table td {
  padding: 14px 16px;
  border-bottom: 1px solid #eaeaea;
  color: #334155;
  vertical-align: middle;
}

.ai-review-page table tbody tr:hover td,
.ai-usage-page table tbody tr:hover td,
.mod-page table tbody tr:hover td,
.translations-page table tbody tr:hover td,
.acc-page table tbody tr:hover td,
.bill-page table tbody tr:hover td,
.product-hub-page.agency-hub-page table tbody tr:hover td {
  background: #f8fafc;
}

/* Security Settings — reinforce input sizing after shared form rules */
.security-settings-page .acc-input,
.security-settings-page .acc-pwd-input,
.security-settings-page .acc-select,
.security-settings-page .password-field__wrap .acc-input,
.security-settings-page .password-field__wrap .acc-pwd-input {
  font-size: 16px;
}

.security-settings-page .password-field__wrap .acc-input,
.security-settings-page .password-field__wrap .acc-pwd-input {
  padding-right: 4.5rem;
}

/* ─── Left sidebar — spacing, typography & submenu alignment ─── */
.app-shell-dark .cmp-sidebar.sidebar,
.app-shell-dark .app-sidebar {
  --sidebar-pad-x: 12px;
  --sidebar-icon-size: 16px;
  --sidebar-icon-gap: 12px;
  --sidebar-item-height: 36px;
  --sidebar-sub-height: 32px;
}

.app-shell-dark .cmp-sidebar-logo.logo-area {
  gap: 10px;
  padding: 14px var(--sidebar-pad-x) 20px;
  margin-bottom: 0;
}
.app-shell-dark.sidebar-collapsed .cmp-sidebar-logo.logo-area {
  justify-content: center;
}
.app-shell-dark .cmp-logo-text.logo-text {
  font-size: 17px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.app-shell-dark .cmp-sidebar-scroll.sidebar-nav {
  padding-bottom: 8px;
}

.app-shell-dark .app-sidebar-section {
  margin-bottom: 0;
}

.app-shell-dark .app-sidebar-section-label.nav-section-label {
  margin: 0;
  padding: 20px var(--sidebar-pad-x) 6px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
  color: rgba(248, 250, 252, 0.42);
}

.app-shell-dark .app-sidebar-section:first-child .app-sidebar-section-label.nav-section-label {
  padding-top: 4px;
}

.app-shell-dark .app-sidebar-links {
  gap: 2px;
  padding: 0 var(--sidebar-pad-x);
}

.app-shell-dark .app-sidebar-link.nav-item,
.app-shell-dark a.app-sidebar-link.nav-item,
.app-shell-dark span.app-sidebar-link.nav-item,
.app-shell-dark .hc-sidebar-group__parent.app-sidebar-link,
.app-shell-dark a.hc-sidebar-group__parent {
  display: flex;
  align-items: center;
  gap: var(--sidebar-icon-gap);
  height: var(--sidebar-item-height);
  min-height: var(--sidebar-item-height);
  margin: 1px 0;
  padding: 0 10px;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.25;
  border-radius: 8px;
  border-left: 3px solid transparent;
}

.app-shell-dark .app-sidebar-link.nav-item .nav-icon,
.app-shell-dark .app-sidebar-link.nav-item svg.nav-icon,
.app-shell-dark .hc-sidebar-group__parent .nav-icon,
.app-shell-dark .hc-sidebar-group__parent svg.nav-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 1;
  display: block;
}

.app-shell-dark .app-sidebar-link .nav-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-shell-dark .hc-sidebar-group {
  gap: 2px;
}

.app-shell-dark .hc-sidebar-group__parent {
  padding-right: 4px;
}

.app-shell-dark .hc-sidebar-group__chevron-btn {
  width: 24px;
  height: 24px;
  margin-left: auto;
  padding: 0;
  flex-shrink: 0;
  border-radius: 6px;
}

.app-shell-dark .hc-sidebar-group__chevron {
  width: 14px;
  height: 14px;
}

.app-shell-dark .hc-sidebar-group__children {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 2px 0 4px calc(10px + var(--sidebar-icon-size) / 2);
  padding: 2px 0 4px 12px;
  border-left: 1px solid rgba(255, 255, 255, 0.12);
}

.app-shell-dark .hc-sidebar-sublink {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: var(--sidebar-sub-height);
  height: var(--sidebar-sub-height);
  padding: 0 10px;
  font-size: 13px;
  font-weight: 450;
  line-height: 1.25;
  border-radius: 8px;
}

.app-shell-dark .hc-sidebar-sublink__icon,
.app-shell-dark .hc-sidebar-sublink svg.hc-sidebar-sublink__icon {
  width: var(--sidebar-icon-size);
  height: var(--sidebar-icon-size);
  flex-shrink: 0;
  opacity: 0.8;
}

.app-shell-dark .hc-sidebar-sublink__text,
.app-shell-dark .hc-sidebar-sublink > span:not(.hc-sidebar-sublink__icon) {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-shell-dark .hc-sidebar-sublink.is-active {
  font-weight: 500;
}

.app-shell-dark .hc-sidebar-sublink__badge {
  font-size: 9px;
  padding: 2px 5px;
}

.app-shell-dark .cmp-sidebar-profile.user-profile {
  padding: 12px var(--sidebar-pad-x) 6px;
  margin-top: auto;
}
.app-shell-dark.sidebar-collapsed .cmp-sidebar-profile.user-profile {
  justify-content: center;
}
.app-shell-dark .cmp-profile-name.user-name {
  font-size: 13px;
  font-weight: 600;
  line-height: 1.25;
}

.app-shell-dark .cmp-profile-plan.user-plan,
.app-shell-dark .cmp-profile-plan.user-plan.is-free {
  margin-top: 3px;
  padding: 2px 7px;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.3;
}

.app-shell-dark .cmp-collapse-toggle.sidebar-collapse-btn {
  width: 36px;
  height: 36px;
  margin: 6px 10px 0px auto;
  transition: all .3s;
}
.app-shell-dark.sidebar-collapsed .cmp-collapse-toggle.sidebar-collapse-btn {
  margin: 6px auto 0px auto;
  transition: all .3s;
}
/* Collapsed sidebar — preserve icon-only alignment */
.sidebar-collapsed.app-shell-dark .app-sidebar-link.nav-item, .sidebar-collapsed.app-shell-dark .hc-sidebar-group__parent.app-sidebar-link {
  width: 100%;
  min-width: 100%;
  height: auto;
  min-height: 64px;
  margin: 3px auto;
  padding: 0;
  align-items: center;
  justify-content: center;
  gap: 0;
  font-size: 12px;
  display: block;
  vertical-align: middle;
  padding: 10px;
  text-align: center;
}
.sidebar-collapsed.app-shell-dark .hc-sidebar-group__chevron-btn {
  display: none;
}

.app-shell-dark.sidebar-collapsed .app-sidebar-links {
  padding: 0;
}
.sidebar-collapsed.app-shell-dark .app-sidebar-link.nav-item .nav-icon, .sidebar-collapsed.app-shell-dark .app-sidebar-link.nav-item svg.nav-icon, .sidebar-collapsed.app-shell-dark .hc-sidebar-group__parent .nav-icon, .sidebar-collapsed.app-shell-dark .hc-sidebar-group__parent svg.nav-icon {
  width: 20px;
  height: 20px;
  margin: 0 auto 7px;
}
@media (max-width: 1024px) {
  .app-shell-dark .app-sidebar-section-label.nav-section-label {
    padding-top: 16px;
  }
}

/* Consent Setup hero — saved badge + discard (wins over chunk CSS / .btn.secondary) */
.consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label {
  display: inline-flex !important;
  align-items: center;
  gap: 4px;
  margin-right: 4px;
  padding: 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  border-radius: 10px;
}

.consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label::before,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

.consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label.is-saved,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label.is-saved {
  color: #047857 !important;
}

.consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label.is-saved::before,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label.is-saved::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}

.consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label.is-unsaved,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label.is-unsaved {
  color: #b45309 !important;
}

.consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label.is-unsaved::before,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-unsaved-label.is-unsaved::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b45309' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 8v4'/%3E%3Cpath d='M12 16h.01'/%3E%3C/svg%3E");
}

.consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn--discard,
.consent-setup-shell .consent-setup-header.product-hub-hero .btn.consent-setup-btn--discard,
.consent-setup-shell .consent-setup-header.product-hub-hero .btn.secondary.consent-setup-btn--discard,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn--discard,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .btn.consent-setup-btn--discard,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .btn.secondary.consent-setup-btn--discard {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
  border-radius: 10px !important;
  color: #b91c1c !important;
  background: #fef2f2 !important;
  border: 1.5px solid #fecaca !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
  transform: none;
}

.consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn--discard::before,
.consent-setup-shell .consent-setup-header.product-hub-hero .btn.consent-setup-btn--discard::before,
.consent-setup-shell .consent-setup-header.product-hub-hero .btn.secondary.consent-setup-btn--discard::before,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn--discard::before,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .btn.consent-setup-btn--discard::before,
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .btn.secondary.consent-setup-btn--discard::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6'/%3E%3Cpath d='M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

.consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn--discard:hover:not(:disabled),
.consent-setup-shell .consent-setup-header.product-hub-hero .btn.consent-setup-btn--discard:hover:not(:disabled),
.consent-setup-shell .consent-setup-header.product-hub-hero .btn.secondary.consent-setup-btn--discard:hover:not(:disabled),
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn--discard:hover:not(:disabled),
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .btn.consent-setup-btn--discard:hover:not(:disabled),
.app-container .consent-setup-shell .consent-setup-header.product-hub-hero .btn.secondary.consent-setup-btn--discard:hover:not(:disabled) {
  color: #991b1b !important;
  background: #fee2e2 !important;
  border-color: #fca5a5 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(239, 68, 68, 0.15) !important;
}

/* ── Change Detection dashboard (monitoring) vs Scheduled Scans (automation) ── */
.prem-scanner-root .cd-dashboard {
  display: flex;
  flex-direction: column;
  gap: var(--ds-space-6, 24px);
  padding: var(--ds-space-6, 24px);
}

.prem-scanner-root .cd-dashboard__header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--ds-space-4, 16px);
}

.prem-scanner-root .cd-dashboard__title {
  margin: 0;
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--ds-text-primary, #0f172a);
}

.prem-scanner-root .cd-dashboard__desc {
  margin: 6px 0 0;
  max-width: 62ch;
  color: #666666;
  font-size: 0.95rem;
  line-height: 1.5;
}

.prem-scanner-root .cd-dashboard__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.prem-scanner-root .cd-dashboard__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px;
  border: 1px solid var(--ds-border-subtle, #e2e8f0);
  border-radius: 14px;
  background: linear-gradient(180deg, #fafbfc 0%, #fff 100%);
}

.prem-scanner-root .cd-filter-bar {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 4px;
  border-radius: 999px;
  background: #f1f5f9;
}

.prem-scanner-root .cd-filter-bar__btn {
  border: 0;
  background: transparent;
  color: #475569;
  font-size: 0.875rem;
  font-weight: 600;
  padding: 8px 14px;
  border-radius: 999px;
  cursor: pointer;
}

.prem-scanner-root .cd-filter-bar__btn--active {
  background: #fff;
  color: #0f172a;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
}

.prem-scanner-root .cd-compare-select {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 240px;
}

.prem-scanner-root .cd-compare-select__label {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #3668e9;
}

.prem-scanner-root .cd-compare-select__input {
  box-sizing: border-box;
  width: 100%;
  min-width: 240px;
  min-height: 44px;
  padding: 11px 36px 11px 14px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.3;
  color: #0f172a;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  border: 1.5px solid #cbd5e1;
  border-radius: 10px;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.prem-scanner-root .cd-compare-select__input::-ms-expand {
  display: none;
}

.prem-scanner-root .cd-compare-select__input:hover {
  border-color: #94a3b8;
  box-shadow: 0 2px 4px rgba(15, 23, 42, 0.06);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .cd-compare-select__input:focus {
  outline: none;
  border-color: #2563eb;
  box-shadow:
    0 0 0 3px rgba(37, 99, 235, 0.18),
    0 1px 2px rgba(15, 23, 42, 0.05);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.prem-scanner-root .cd-summary-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 16px;
}
.prem-scanner-root .cd-summary-card {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 18px 20px;
  background: #fff;
}

.prem-scanner-root .cd-summary-card--hero {
  background: linear-gradient(135deg, #f8fafc 0%, #eef2ff 100%);
  border-color: #c7d2fe;
}

.prem-scanner-root .cd-summary-card__title {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #3668e9;
}

.prem-scanner-root .cd-summary-card__text {
  margin: 0;
  color: #334155;
  line-height: 1.55;
}

.prem-scanner-root .cd-summary-card__score {
  margin: 0;
  font-size: 1.75rem;
  font-weight: 800;
  letter-spacing: -0.03em;
}

.prem-scanner-root .cd-summary-card__delta {
  margin: 6px 0 0;
  font-size: 0.875rem;
  color: #3668e9;
}

.prem-scanner-root .cd-summary-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 8px;
  margin: 16px 0 0;
  padding: 0;
  list-style: none;
}

.prem-scanner-root .cd-summary-stats li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 12px 5px 5px;
  font-size: 13px;
  font-weight: 500;
  color: #475569;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.prem-scanner-root .cd-summary-stats li::before {
  content: "";
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.06);
}

.prem-scanner-root .cd-summary-stats li:nth-child(1)::before {
  background-color: #ecfdf5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2315803d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2a10 10 0 1 0 10 10 4 4 0 0 1-5-5 4 4 0 0 1-5-5'/%3E%3Cpath d='M8.5 8.5v.01'/%3E%3Cpath d='M16 15.5v.01'/%3E%3Cpath d='M12 12v.01'/%3E%3Cpath d='M7 8v4'/%3E%3Cpath d='M17 8v4'/%3E%3C/svg%3E");
}

.prem-scanner-root .cd-summary-stats li:nth-child(2)::before {
  background-color: #fef2f2;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2a10 10 0 1 0 10 10 4 4 0 0 1-5-5 4 4 0 0 1-5-5'/%3E%3Cpath d='M8.5 8.5v.01'/%3E%3Cpath d='M16 15.5v.01'/%3E%3Cpath d='M12 12v.01'/%3E%3Cpath d='M9 12h6'/%3E%3C/svg%3E");
}

.prem-scanner-root .cd-summary-stats li:nth-child(3)::before {
  background-color: #ecfdf5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2315803d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19.07 4.93A10 10 0 0 0 6.99 3.34'/%3E%3Cpath d='M4 6h.01'/%3E%3Cpath d='M2.29 9.62A10 10 0 1 0 21.31 8.35'/%3E%3Cpath d='M12 12v4'/%3E%3Cpath d='M8 8v4'/%3E%3Cpath d='M16 8v4'/%3E%3C/svg%3E");
}

.prem-scanner-root .cd-summary-stats li:nth-child(4)::before {
  background-color: #fef2f2;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b91c1c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19.07 4.93A10 10 0 0 0 6.99 3.34'/%3E%3Cpath d='M4 6h.01'/%3E%3Cpath d='M2.29 9.62A10 10 0 1 0 21.31 8.35'/%3E%3Cpath d='M9 12h6'/%3E%3C/svg%3E");
}

/* Change Detection — action button icons */
.prem-scanner-root .cd-dashboard__export,
.prem-scanner-root .cd-dashboard__refresh {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: none;
}

/* Minimal highlighted backgrounds */
.prem-scanner-root .cd-dashboard__export {
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
}

.prem-scanner-root .cd-dashboard__export:hover:not(:disabled) {
  color: #3730a3;
  background: #e0e7ff;
  border-color: #a5b4fc;
}

.prem-scanner-root .cd-dashboard__refresh {
  color: #047857;
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
}

.prem-scanner-root .cd-dashboard__refresh:hover:not(:disabled) {
  color: #065f46;
  background: #d1fae5;
  border-color: #6ee7b7;
}

.prem-scanner-root .cd-dashboard__export::before,
.prem-scanner-root .cd-dashboard__refresh::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px 16px;
}

.prem-scanner-root .cd-dashboard__export::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V3'/%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
}

.prem-scanner-root .cd-dashboard__refresh::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23047857' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

.prem-scanner-root .cd-dashboard__export:hover:not(:disabled)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233730a3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V3'/%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
}

.prem-scanner-root .cd-dashboard__refresh:hover:not(:disabled)::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23065f46' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3Cpath d='M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16'/%3E%3Cpath d='M16 16h5v5'/%3E%3C/svg%3E");
}

.prem-scanner-root .cd-diff--added { color: #15803d; font-weight: 700; }
.prem-scanner-root .cd-diff--removed { color: #b91c1c; font-weight: 700; }
.prem-scanner-root .cd-diff--modified { color: #b45309; font-weight: 700; }

.prem-scanner-root .cd-sections {
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.prem-scanner-root .cd-section {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 16px 18px;
  background: #fff;
}

.prem-scanner-root .cd-section--muted {
  background: #f8fafc;
}

.prem-scanner-root .cd-section__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.prem-scanner-root .cd-section__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
}

.prem-scanner-root .cd-section__count {
  font-size: 0.8rem;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  background: #f1f5f9;
}

.prem-scanner-root .cd-section__note {
  margin: 0;
  color: #3668e9;
  font-size: 0.9rem;
  line-height: 1.5;
}

.prem-scanner-root .cd-section__cards {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.prem-scanner-root .cd-change-card {
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
}
.prem-scanner-root .cd-change-card__summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  cursor: pointer;
  list-style: none;
}

.prem-scanner-root .cd-change-card__summary::-webkit-details-marker { display: none; }

.prem-scanner-root .cd-change-card__badge {
  font-size: 0.7rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 4px 8px;
  border-radius: 999px;
}

.prem-scanner-root .cd-change-card__badge--added { background: #dcfce7; color: #166534; }
.prem-scanner-root .cd-change-card__badge--removed { background: #fee2e2; color: #991b1b; }
.prem-scanner-root .cd-change-card__badge--modified { background: #fef3c7; color: #92400e; }

.prem-scanner-root .cd-change-card__label {
  flex: 1;
  font-size: 0.9rem;
  color: #334155;
  word-break: break-word;
}

.prem-scanner-root .cd-change-card__body {
  padding: 0 14px 12px 14px;
  font-size: 0.85rem;
  color: #3668e9;
}

.prem-scanner-root .cd-change-card__pre {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-size: 0.8rem;
}

.prem-scanner-root .cd-empty-state {
  text-align: center;
  padding: 48px 24px;
  border: 1px dashed #cbd5e1;
  border-radius: 18px;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
}

.prem-scanner-root .cd-empty-state__icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 16px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 1.5rem;
  font-weight: 800;
  color: #15803d;
  background: #dcfce7;
}

.prem-scanner-root .cd-empty-state__title {
  margin: 0 0 8px;
  font-size: 1.15rem;
  font-weight: 700;
}

.prem-scanner-root .cd-empty-state__text {
  margin: 0 auto;
  max-width: 48ch;
  color: #3668e9;
  line-height: 1.55;
}

.prem-scanner-root .cd-timeline {
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 18px 20px;
  background: #fff;
}

.prem-scanner-root .cd-timeline__title {
  margin: 0 0 14px;
  font-size: 1rem;
  font-weight: 700;
}

.prem-scanner-root .cd-timeline__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.prem-scanner-root .cd-timeline__item {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid #f1f5f9;
}

.prem-scanner-root .cd-timeline__time {
  font-size: 0.85rem;
  color: #3668e9;
}

.prem-scanner-root .cd-timeline__meta {
  color: #3668e9;
  font-size: 0.85rem;
}

.prem-scanner-root .cd-dashboard__error,
.prem-scanner-root .cd-dashboard__gate {
  margin: 0;
  padding: 12px 14px;
  border-radius: 10px;
}

.prem-scanner-root .cd-dashboard__error {
  background: #fef2f2;
  color: #991b1b;
}

.prem-scanner-root .cd-dashboard__gate {
  background: #f8fafc;
  color: #475569;
}

.prem-scanner-root .cd-dashboard__gate-mark {
  display: inline;
  padding: 2px 8px;
  font-weight: 700;
  color: #2562ff;
  background: #eef2ff;
  border: 1px solid #c7d2fe;
  border-radius: 6px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.prem-scanner-root .scan-auto-monitor[aria-label="Automated monitoring"] .scan-auto-monitor__title {
  letter-spacing: -0.02em;
}

/* ─── Onboarding wizard — 4-phase premium UX ─── */
.onboarding-wizard-modal--phased {
  width: min(100%, 460px);
  max-height: min(92vh, 640px);
  padding: 32px 32px 28px;
}

.onboarding-wizard-modal--phased .onboarding-wizard-modal__brand {
  margin-bottom: 28px;
}

.onboarding-wizard-modal__phases {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0;
  margin: 0 0 12px;
  padding: 0 4px;
}

.onboarding-wizard-modal__phase {
  position: relative;
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.onboarding-wizard-modal__phase-line {
  position: absolute;
  top: 11px;
  right: 50%;
  left: -50%;
  z-index: 0;
  height: 2px;
  background: #e2e8f0;
}

.onboarding-wizard-modal__phase-line--done {
  background: linear-gradient(90deg, #22c55e, #16a34a);
}

.onboarding-wizard-modal__phase-dot {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border: 2px solid #e2e8f0;
  border-radius: 999px;
  background: #fff;
  color: #fff;
  transition: border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
}

.onboarding-wizard-modal__phase--done .onboarding-wizard-modal__phase-dot {
  border-color: #22c55e;
  background: #22c55e;
}

.onboarding-wizard-modal__phase--current .onboarding-wizard-modal__phase-dot {
  border-color: #2562ff;
  background: #2562ff;
  box-shadow: 0 0 0 4px rgba(37, 98, 255, 0.15);
  animation: onboarding-phase-pulse 2s ease-in-out infinite;
}

.onboarding-wizard-modal__phase--upcoming .onboarding-wizard-modal__phase-dot {
  border-color: #e2e8f0;
  background: #f8fafc;
}

.onboarding-wizard-modal__phase-label {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-align: center;
  color: #94a3b8;
  line-height: 1.2;
}

.onboarding-wizard-modal__phase--done .onboarding-wizard-modal__phase-label,
.onboarding-wizard-modal__phase--current .onboarding-wizard-modal__phase-label {
  color: #0f172a;
}

.onboarding-wizard-modal__progress-track--thin {
  height: 3px;
  margin-bottom: 28px;
}

.onboarding-wizard-modal--phased .onboarding-wizard-modal__body {
  padding: 4px 0 8px;
  text-align: left;
}

.onboarding-wizard-modal--phased .onboarding-wizard-modal__title {
  margin: 0 0 10px;
  font-size: 1.65rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
  color: #0f172a;
}

.onboarding-wizard-modal--phased .onboarding-wizard-modal__desc {
  margin: 0 0 16px;
  font-size: 0.98rem;
  line-height: 1.55;
  color: #3668e9;
}

.onboarding-wizard-modal__estimate {
  margin: 0 0 8px;
  font-size: 0.82rem;
  color: #94a3b8;
}

.onboarding-wizard-modal__estimate span {
  font-weight: 600;
  color: #3668e9;
}

.onboarding-wizard-modal__milestone {
  margin: 0 0 20px;
  padding: 10px 14px;
  border-radius: 10px;
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  font-size: 0.88rem;
  font-weight: 600;
  color: #15803d;
  animation: onboarding-milestone-in 0.35s ease-out;
}

.onboarding-wizard-modal__milestone span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.onboarding-wizard-modal--phased .onboarding-wizard-modal__actions {
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  margin-top: 24px;
}

.onboarding-wizard-modal--phased .onboarding-wizard-modal__cta {
  width: 100%;
  min-height: 46px;
  font-size: 0.95rem;
  font-weight: 600;
}

.onboarding-wizard-modal--phased .onboarding-wizard-modal__secondary {
  width: 100%;
  min-height: 40px;
}

.onboarding-wizard-modal--phased .onboarding-wizard-modal__success-icon {
  margin: 0 auto 20px;
  width: 56px;
  height: 56px;
  color: #2562ff;
  background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
  border-radius: 16px;
}

.onboarding-wizard-modal__success-checklist--phased {
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.onboarding-wizard-modal__success-checklist--phased li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  font-size: 0.9rem;
  color: #334155;
}

.onboarding-wizard-modal__success-checklist--phased li:before {
  display: none;
}

/* Hide legacy 8-step numbered rail when phased modal is active */
.onboarding-wizard-modal--phased .onboarding-wizard-modal__steps {
  display: none !important;
}

@keyframes onboarding-phase-pulse {
  0%, 100% { box-shadow: 0 0 0 4px rgba(37, 98, 255, 0.12); }
  50% { box-shadow: 0 0 0 7px rgba(37, 98, 255, 0.08); }
}

@keyframes onboarding-milestone-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (width <= 480px) {
  .onboarding-wizard-modal--phased {
    padding: 24px 20px 20px;
  }

  .onboarding-wizard-modal__phase-label {
    font-size: 10px;
  }
}

/* ─── Empty states — premium contextual UX ─── */
.cs-empty-state {
  text-align: center;
}

.cs-empty-state--chart {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 220px;
  margin: 0;
  border-style: dashed;
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
}

.cs-empty-state--table {
  min-height: 0;
  padding: 28px 20px;
  border: none;
  background: transparent;
}

.cs-empty-state--success {
  background: linear-gradient(180deg, #f0fdf4 0%, #fff 100%);
  border-color: #bbf7d0;
}

.cs-empty-state--success .cs-empty-state__icon,
.cs-empty-state--success .product-hub-empty-state__icon {
  background: #dcfce7;
  color: #16a34a;
}

.cs-empty-state--metric {
  padding: 20px 16px;
  min-height: 0;
}

.cs-empty-state--compact {
  padding: 24px 16px;
}

.cs-empty-state__title,
.product-hub-empty-state__title.cs-empty-state__title {
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: #0f172a;
}

.cs-empty-state__desc,
.product-hub-empty-state__desc.cs-empty-state__desc {
  max-width: 36ch;
  margin-left: auto;
  margin-right: auto;
  font-size: 0.92rem;
  line-height: 1.55;
  color: #3668e9;
}

.cs-empty-chart .product-hub-empty-state__icon::after {
  content: none;
}

.cs-pending-metric {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  align-items: flex-start;
}

.cs-pending-metric__label {
  font-size: 0.92em;
  font-weight: 600;
  color: #94a3b8;
  letter-spacing: 0.01em;
}

.cs-pending-metric__hint {
  font-size: 0.78em;
  color: #cbd5e1;
}

/* ─── KPI metric visual states (pending / processing / disabled / success) ─── */
.cs-kpi-metric {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  min-height: 72px;
}

.cs-kpi-metric--card {
  padding: 2px 0 4px;
}

.cs-kpi-metric--inline {
  gap: 6px;
  min-height: 0;
  width: 100%;
}

.cs-kpi-metric--chip-only {
  min-height: 0;
}

.cs-kpi-metric__icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: #f1f5f9;
  color: #3668e9;
}

.cs-kpi-metric--pending .cs-kpi-metric__icon-wrap {
  background: #eff6ff;
  color: #2563eb;
}

.cs-kpi-metric--processing .cs-kpi-metric__icon-wrap {
  background: #f5f3ff;
  color: #7c3aed;
}

.cs-kpi-metric--disabled .cs-kpi-metric__icon-wrap {
  background: #f8fafc;
  color: #94a3b8;
}

.cs-kpi-metric--success .cs-kpi-metric__icon-wrap {
  background: #f0fdf4;
  color: #16a34a;
}

.cs-kpi-metric__pulse {
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #7c3aed;
  box-shadow: 0 0 0 0 rgb(124 58 237 / 45%);
  animation: cs-kpi-pulse 1.8s ease-out infinite;
}

@keyframes cs-kpi-pulse {
  0% {
    transform: scale(0.92);
    box-shadow: 0 0 0 0 rgb(124 58 237 / 45%);
  }

  70% {
    transform: scale(1);
    box-shadow: 0 0 0 10px rgb(124 58 237 / 0%);
  }

  100% {
    transform: scale(0.92);
    box-shadow: 0 0 0 0 rgb(124 58 237 / 0%);
  }
}

.cs-kpi-metric__chip {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.2;
  border: 1px solid transparent;
}

.cs-kpi-metric__chip--pending {
  color: #1d4ed8;
  background: #eff6ff;
  border-color: #bfdbfe;
}

.cs-kpi-metric__chip--processing {
  color: #6d28d9;
  background: #f5f3ff;
  border-color: #ddd6fe;
}

.cs-kpi-metric__chip--disabled {
  color: #3668e9;
  background: #f8fafc;
  border-color: #e2e8f0;
}

.cs-kpi-metric__chip--success {
  color: #15803d;
  background: #f0fdf4;
  border-color: #bbf7d0;
}

.cs-kpi-metric__chip--attention {
  color: #c2410c;
  background: #fff7ed;
  border-color: #fed7aa;
}

.cs-kpi-metric__chip--failure {
  color: #b91c1c;
  background: #fef2f2;
  border-color: #fecaca;
}

.cs-kpi-metric__label {
  font-size: 0.82rem;
  font-weight: 600;
  color: #0f172a;
  letter-spacing: -0.01em;
}

.cs-kpi-metric__subtitle {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.cs-kpi-metric__desc {
  margin: 0;
  font-size: 15px;
  line-height: 1.45;
  color: #666;
}

.cs-kpi-metric__action {
  margin-top: 2px;
}

.cs-kpi-metric__value--success {
  font: inherit;
}

.cs-kpi-metric--overlay.cr-stat-value {
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}

/* Compliance report stat cards with pending metrics */
.compliance-report-standalone .cr-stat-card:has(.cs-kpi-metric--pending),
.compliance-report-standalone .cr-stat-card:has(.cs-kpi-metric--processing),
.compliance-report-standalone .cr-stat-card:has(.cs-kpi-metric--disabled) {
  justify-content: flex-start;
}

.compliance-report-standalone .cr-stat-card .cs-kpi-metric--card {
  min-height: 88px;
}

/* Dashboard KPI cards */
.dash-kpi-value .cs-kpi-metric--inline {
  padding-top: 2px;
}

.dash-kpi-value .cs-kpi-metric__desc {
  max-width: none;
}

.dash-kpi-value:has(.cs-kpi-metric--inline) {
  min-height: 84px;
}

/* Premium stat cards */
.prem-stat-card .cs-kpi-metric__chip {
  margin-top: 6px;
}

.prem-stat-card .product-hub-stat-card__value.cs-kpi-metric--inline,
.product-hub-stat-card__value .cs-kpi-metric--inline {
  align-items: flex-start;
}

.product-hub-stat-card__value:has(.cs-kpi-metric) {
  font-size: inherit;
  font-weight: inherit;
}

.cr-table-empty.cs-empty-table-cell {
  padding: 40px 24px !important;
  text-align: center;
  font-size: 0.92rem;
  line-height: 1.55;
  color: #3668e9;
  background: #f8fafc;
}

.cr-table-empty.cs-empty-table-cell::before {
  content: '📄';
  display: block;
  margin: 0 auto 10px;
  font-size: 1.75rem;
  line-height: 1;
  opacity: 0.85;
}

.cs-empty-inline {
  display: block;
  padding: 16px 0;
  font-size: 0.92rem;
  line-height: 1.55;
  color: #3668e9;
}

.dash-empty-state,
.dash-empty-state-illustration + h4 {
  text-align: center;
}

.dash-empty-state-illustration {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin: 0 auto 12px;
  border-radius: 14px;
  background: color-mix(in srgb, var(--ds-color-shell-accent, #2562ff) 10%, transparent);
  font-size: 1.5rem;
}

.card .recharts-responsive-container:empty,
.prem-chart-panel .recharts-wrapper:empty {
  min-height: 200px;
}

/* Chart panels without data — keep height, show subtle backdrop */
.prem-chart-panel,
.dash-chart-card {
  min-height: 220px;
}

.prem-chart-panel .cs-empty-chart,
.dash-chart-card .cs-empty-chart {
  min-height: 200px;
}

.cfr-empty {
  padding: 32px 20px;
  text-align: center;
  font-size: 0.92rem;
  line-height: 1.55;
  color: #3668e9;
  background: #f8fafc;
  border-radius: 12px;
}

.ai-assistant-empty.cs-empty-state--success {
  padding: 20px 16px;
  margin: 12px 0;
  border-radius: 12px;
  font-weight: 600;
  color: #15803d;
  text-align: center;
}



/* Custom Responsive Styles */
@media screen and (max-width: 1540px) {
  .app-shell-dark .cmp-topbar {
    height: 50px;
    min-height: 50px;
    padding: 0 17px;
  }
  .app-shell-dark .app-top-search-wrap {
    width: 188px;
    padding: 4px 9px;
    gap: 4px;
  }
  .app-icon-btn {
    width: 40px;
    height: 40px;
    line-height: 40px;
  }
  .app-icon-btn svg {
    width: 17px;
    height: 17px;
  }
  .app-top-search {
    min-width: 141px;
    font-size: 11px;
}
  .cmp-avatar, .cmp-top-avatar, .cmp-avatar.user-avatar {
    width: 30px;
    height: 30px;
  }
  .app-shell-dark .app-breadcrumb-wrap {
    font-size: 12px;
  }
  .cmp-live-label {
    font-size: 10px;
  }
  .app-shell-dark .app-site-switcher-inline {
    padding: 2px 8px !important;
    font-size: 11px !important;
    margin-left: 3px;
  }
  .cmp-topbar-left {
    gap: 7px;
  }
  .cmp-view-report--sm {
    gap: 6px;
    min-height: 27px;
    padding: 0 9px;
    font-size: 11px;
  }
  .app-topbar-view-report svg {
    width: 13px;
  }
  .app-container .consent-setup-shell .consent-setup-btn, .app-container .consent-setup-shell .btn.consent-setup-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 0 13px;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
    border-radius: 10px;
    cursor: pointer;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, transform 0.12s ease, box-shadow 0.15s ease;
  }
}

@media screen and (max-width: 1280px) and (min-width: 768px){
    .dash-cookie-summary-row, .dash-cookie-cat-row {
      font-size: 13px;
  }
  .websites-page-shell .websites-summary-label {
    font-size: 12px;
  }
    .dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__subtitle, .websites-page-shell .websites-header.product-hub-hero .product-hub-hero__subtitle, .app-container .consent-setup-shell .consent-setup-header.product-hub-hero .product-hub-hero__subtitle {
      font-size: 14px;
    }
    .dash-section-title {
      font-size: 16px;
  }
  .app-container > .product-hub-page > * + *.product-hub-link-grid {
      margin-top: 20px;
  }
    .dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__actions .btn, .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn--discard, .consent-setup-shell .consent-setup-header.product-hub-hero .btn.consent-setup-btn--discard, .consent-setup-shell .consent-setup-header.product-hub-hero .btn.secondary.consent-setup-btn--discard, .app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn--discard, .app-container .consent-setup-shell .consent-setup-header.product-hub-hero .btn.consent-setup-btn--discard, .app-container .consent-setup-shell .consent-setup-header.product-hub-hero .btn.secondary.consent-setup-btn--discard, .app-container .consent-setup-shell .consent-setup-header.product-hub-hero .consent-setup-btn.primary {
      min-height: 34px;
      padding: 0 12px;
      font-size: 13px;
    }
    .dash-quick-action-label {
      font-size: 16px;
  }
    .dash-quick-action-hint {
      font-size: 12px;
  }
    .dash-theme-cmp .dash-kpi-card, .dash-theme-cmp .dash-chart-card, .dash-theme-cmp .dash-recommend-card, .dash-theme-cmp .dash-quick-action-card, .dash-theme-cmp .dash-cookie-summary-left, .dash-theme-cmp .dash-consent-empty-card, .dash-cookie-summary-right, .cc-scan-coverage section.card, .websites-summary-tile, .consent-logs-page .analytics-upsell-summary > div {
        padding: 17px;
    }
    .dash-score-ring {
      top: 42px;
      right: 10px;
  }
  .dash-kpi-value {
    font-size: 28px;
  }
    .dash-theme-cmp .dash-kpi-label {
      font-size: 11px;
    }
    .dash-consent-logs-view-all {
      padding: 5px 12px;
      font-size: 10px;
  }
  .app-content-footer {
    padding: 10px 0 0;
}
.product-hub-config-card__subsection h4 {
  margin: 0 0 var(--ds-space-sm);
}
.product-hub-troubleshooting__list li {
  border-bottom: 1px solid #eaeaea;
  padding: 8px 0;
}
}
@media screen and (max-width: 1280px) {
  .dash-page-head, .settings-page-head, .cmp-page-head, .cr-page-head, .prem-page-head, .ds-page-header, .websites-page-head, .bill-head {
    margin-bottom: 30px;
}
  .app-shell-dark .app-top-search-wrap {
    width: 160px;
  }
  .prem-stat-label,
  .prem-stat-badge,
  .prem-banner__title {
    font-size: 12px;
}
body:not(.cookieshift-landing) .page-discoverability__link:has(+ .page-discoverability__link)::after {
  margin: 0 8px !important;
}
body:not(.cookieshift-landing) .page-discoverability__link,
body:not(.cookieshift-landing) .page-discoverability .contextual-help-link,
.prem-banner__sub, .prem-scanner-root .cc-hist-table {
  font-size: 13px;
}
.prem-scanner-root .cc-hist-actions a.bv, .prem-scanner-root .cc-hist-actions button.bv, .prem-scanner-root .prem-hist-actions a.bv, .prem-scanner-root .prem-hist-actions button.bv {
  min-height: 31px;
  padding: 5px 14px;
}
.prem-scanner-root .cc-pagination-row-count {
  font-size: 13px;
}
.prem-scanner-root .cc-pagination-page-size {
  min-width: 112px;
  min-height: 35px;
  padding: 5px 34px 4px 14px;
  font-size: 13px;
}
.prem-scanner-root .cc-pagination-meta-bar {
  gap: 10px;
  padding: 8px 8px 8px 14px;
}
.prem-scanner-root .btn--cc-view-report,
.prem-btn {
  font-size: 12px;
  padding: 4px 14px;
  min-height: 35px;
} 
.prem-scanner-root .history-toolbar {
  margin: 0 0 10px;
  padding: 6px;  
}
.prem-scanner-root .cr-search, .prem-scanner-root .cr-filter {
  font-size: 13px;
  padding: 7px 8px; 
}
.prem-scanner-root .cr-search {
  padding-left: 34px;
}
.prem-scanner-root .prem-history-card__title {
  font-size: 1rem;
}
.prem-scanner-root [class*="btn--cc-"]::after {
  width: 13px;
  height: 13px;
}
.page-discoverability__label {
  font-size: 14px;
}
.page-discoverability {
  padding: var(--ds-space-md) var(--ds-space-lg);
}
.prem-banners-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.prem-stat-badge {
  padding: 2px 13px;
}
  .app-top-search {
    min-width: 120px;
  }
  .cmp-topbar-left {
    gap: 6px;
  } 
  .product-hub-stat-card, .prem-stat-card  {
      padding: var(--ds-space-lg) var(--ds-space-lg);
  }
  .prem-stats-grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 10px;
  }
  .cc-ctrl-actions {
    justify-content: flex-end;
}
  .prem-stat-value,
  .prem-stat-value--risk {
    font-size: 22px;
}
  .app-container > .product-hub-page > * + *.product-hub-link-grid {
      margin-top: 20px;
  }
  .consent-premium-panel {
    padding: 16px 22px 22px;
  }
  .product-hub-section__head {
    padding: var(--ds-space-lg) var(--ds-space-xl);
  }
  .consent-premium-stack {
    gap: 20px;
}
.product-hub-section__body>:first-child {
  padding-top: 16px;
}
.product-hub-section__body {
    padding: 0 var(--ds-space-xl) var(--ds-space-xl);
  }
  .dash-theme-cmp .dash-card-subtitle {
    margin-bottom: 0;
  }
  .prem-scanner-root .cc-hist-table td {
    padding: 10px;
  }
  .prem-scanner-root .cc-history-table-shell {
    overflow-x: auto;
  }
  .cmp-page-actions, .dash-page-actions, .ds-page-actions, .cr-page-actions, .product-hub-inline-actions, .product-hub-hero__actions, .form-actions, .card-actions {
    margin-top: 0;
}
.bill-page .bill-head-actions {
  margin-left: 0;
}
}
@media screen and (max-width: 1100px) {
  .system-settings-page input:not([type="checkbox"]):not([type="radio"]), .system-settings-page select, .system-settings-page textarea, .acc-page input:not([type="checkbox"]):not([type="radio"]), .acc-page select, .acc-page textarea, .security-settings-page input:not([type="checkbox"]):not([type="radio"]), .security-settings-page select, .security-settings-page textarea, .bill-page input:not([type="checkbox"]):not([type="radio"]), .bill-page select, .bill-page textarea, .product-hub-page.system-health-hub-page input:not([type="checkbox"]):not([type="radio"]), .product-hub-page.system-health-hub-page select, .product-hub-page.system-health-hub-page textarea {
    min-height: 40px;
    padding: 6px 14px;
    font-size: 14px;
}
.ai-review-page > div:first-child {
  flex-direction: column;
  align-items: start !important;
}
.ai-review-page > div:first-child > div:last-child {
  justify-content: start;
  margin-left: 0;
}
.prem-scanner-root .scan-auto-monitor__stat {
  padding: 15px 15px;
}

.prem-scanner-root .cd-summary-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.prem-scanner-root .cd-summary-grid .cd-summary-card.cd-summary-card--hero {
  grid-column: 1 / -1;
}
  .security-settings-page .acc-sec-row {
    padding: 12px 0;
    flex-direction: column;
    gap: 0;
    align-items: start;
}
.prem-scanner-root .scan-auto-monitor__toggle-row {
  display: flex;
  flex-direction: column;
}
.prem-scanner-root .scan-auto-monitor__switch,
.prem-scanner-root .scan-auto-monitor__toggle-row,
.prem-scanner-root .scan-auto-monitor__card--alerts .scan-auto-monitor__toggle-row {
  align-items: start;
  align-self: start;
}
.security-settings-page .acc-sec-row:first-child {
  padding-top: 0 !important;
}
  .security-settings-page .acc-sec-left {
    gap: 12px;
    margin-bottom: 13px;
  }
  .security-settings-page .acc-session-ua, .security-settings-page .acc-session-meta {
    font-size: 12px;
}
.security-settings-page .acc-panel-head {
  margin-bottom: 3px;
}
.security-settings-page .acc-field-label {
  margin-bottom: 8px;
  font-size: 12px;
}
  .acc-page .acc-btn-outline {
    font-size: 11px;
  }
  .security-settings-page .acc-btn-outline {
    min-height: 30px;
    padding: 0 12px;
  }
  .acc-page .acc-btn-outline::after {
    width: 12px;
    height: 12px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232562ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E") center / 11px 11px no-repeat;
  }
  .acc-logs-filter-group {
    gap: 6px;
  }
  .acc-logs-table {
    overflow-x: auto;
  }
  .security-settings-page .acc-logs-chip {
    font-size: 12px;
    padding: 4px 13px;
  }
  .security-settings-page .acc-log-title,
  .security-settings-page .acc-log-cell--meta,
  .security-settings-page .acc-log-sub {
    font-size: 13px;
  }
  .security-settings-page .acc-logs-meta {
    font-size: 12px;
  }
  .security-settings-page .acc-log-cell--time {
    font-size: 11px;
  }
  .security-settings-page .acc-logs-stat-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .cfr-page.reports-hub-page {
      display: block;
  }
  .cfr-page .cfr-toggle-group {
    margin-left: 0;
  }
  .cfr-page.reports-hub-page .cfr-search, .cfr-page.reports-hub-page .cfr-select, .cfr-page.reports-hub-page .cr-filter {
    flex: 1;
  }
  .cfr-toolbar-row2 {
    display: flex;
  }
  .script-control-page.governance-page td.sc-event-status {
    vertical-align: 0;
}
.sys-settings-nav-grid--general {
  grid-template-columns: repeat(2, 1fr);
}
}

@media screen and (max-width: 1024px){
  .app-container > * + *:not(.app-content-footer), .app-container > .dash-page > * + *, .app-container > .settings-page-premium > * + *, .app-container > .product-hub-page > * + *, .app-container > .consent-premium-page > * + *, .app-container > .hc-premium-page > * + *, .app-container > .ds-page > * + *, .app-container > .system-settings-page > * + *, .app-container > .cr-page > * + *, .app-container > .prem-scanner-root > * + *, .app-container > .policy-generator-page > * + *, .app-container > .ai-assistant-page > * + *, .app-container > .ai-assist-page > * + *, .app-container > .ai-review-page > * + *, .app-container > .ai-usage-page > * + *, .app-container > .ai-set-page > * + *, .app-container > .mod-page > * + *, .app-container > .translations-page > * + *, .app-container > .acc-page > * + *, .app-container > .security-settings-page > * + *, .product-hub-page > * + *, .consent-premium-page > * + *, .hc-premium-page > * + *, .ds-page > * + *, .cr-page > * + *, .prem-scanner-root > * + *, .settings-page-premium > * + *, .main-container > .dash-page > * + *, .main-container > .settings-page-premium > * + *, .main-container > .product-hub-page > * + *, .main-container > .consent-premium-page > * + *, .main-container > .hc-premium-page > * + *, .main-container > .ds-page > * + *, .main-container > .cr-page > * + *, .main-container > .policy-generator-page > * + *, .main-container > .ai-assistant-page > * + *, .main-container > .ai-assist-page > * + *, .main-container > .ai-review-page > * + *, .main-container > .ai-usage-page > * + *, .main-container > .ai-set-page > * + *, .main-container > .mod-page > * + *, .main-container > .translations-page > * + *, .main-container > .acc-page > * + *, .main-container > .security-settings-page > * + *, .main-container > .websites-page-shell > * + * {
    margin-top: 20px;
}
.prem-scanner-root .cc-tab {
  padding: 6px 11px;
  font-size: 12px;
  min-height: 35px;
}
.prem-banners-row {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
  body:not(.cookieshift-landing) .page-discoverability .contextual-help-link {
    margin-left: 0;
    padding-left: 0;
    align-items: start;
    flex: 0 0 100%;
  }
  .consent-logs-page .analytics-upsell-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .ai-set-grid {
    grid-template-columns: 1fr;
}
.ai-set-page .ai-set-card, .ai-set-page .ai-set-card.ai-set-card--tight {
  padding: 17px 17px !important;
}
.ai-set-page .ai-set-stagger-right {
  justify-content: start;
}
  .scan-auto-monitor__header-actions {
    align-items: start;
  }
  .prem-scanner-root .cc-inventory-toolbar__actions {
    align-items: start;
    justify-content: start;
  }
  .prem-scanner-root .scan-auto-monitor__header {
    gap: 5px;
  }
  .consent-logs-page .analytics-upsell-summary > div {
    padding: 17px 17px;
}
.consent-logs-page .consent-logs-site-hint {
  flex: 1 1 auto;
}
.consent-logs-page .consent-logs-site-row {
  align-items: start;
  flex-direction: column;
  gap: 5px 16px;
}
.consent-logs-page .consent-logs-site-row > .btn-outlined {
  margin-left: 0;
  padding: 0 16px;
  font-size: 13px;
  min-height: 35px;
  margin-top: 6px;
}
.help-hub-page.impl-center-page .product-hub-stat-grid {
  grid-template-columns: repeat(2, 1fr);
}
.app-container > .ai-review-page > * + * {
  grid-template-columns: repeat(1, minmax(130px, 1fr)) !important;
}
.system-settings-page .sys-settings-btn-terminate {
  justify-content: center;
}
    .security-settings-page .site-api-key-panel,
    .product-hub-page.system-health-hub-page .system-health-card,
    .product-hub-page.system-health-hub-page > .product-hub-stat-card,
    .product-hub-page.system-health-hub-page .system-health-infra,
    .dash-cookie-summary-right, .cc-scan-coverage section.card,
    .prem-chart-card {
      padding: 17px;
    }
    .product-hub-stat-grid {
      grid-template-columns: repeat(3, minmax(120px, 1fr)) !important;
  }
  .prem-stats-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .prem-scanner-root .cc-inventory-toolbar__desc {
    margin: 10px 0 6px !important;
}
  .cc-ctrl-actions {
    justify-content: start;
}
.pagination, .cr-page-numbers, .table-pagination {
  gap: var(--ds-space-xs);
}
}
@media screen and (max-width: 767px){
  .prem-scanner-root .cc-category-chart {
    width: 100%;
    height: 330px;
    min-height: 330px;
  }
}
@media screen and (max-width: 1280px) and (min-width: 991px){
  .websites-summary-bar {
    grid-template-columns: repeat(4,minmax(0,1fr))
  }
}
@media screen and (max-width: 1024px) and (min-width: 580px){
  
.security-settings-page .acc-grid--security {
  grid-template-columns: 1fr;
}
  .app-content-footer {
    padding: 0;
    justify-content: center;
    text-align: center;
  }
  .websites-summary-bar {
    grid-template-columns: repeat(2,minmax(0,1fr))
  }
  .websites-page-shell .websites-summary-label {
    font-size: 12px;
}
.consent-logs-page .filter-row-1 {
  grid-template-columns: repeat(3, minmax(130px, 1fr));
}
}
@media screen and (max-width: 767px){
  .ai-review-page .field {
    flex-direction: column;
  }
  .ai-review-page .field > .websites-site-label + div + div {
    margin-top: 0px !important;
  }
  .ai-review-page {
    gap: 0;
  }
  .ai-review-page .card {
    padding: var(--ds-space-lg) var(--ds-space-lg) !important;
  }
}
@media screen and (max-width: 640px) and (min-width: 320px){
  .dash-theme-cmp .dash-quick-actions-section {
    margin-top: 0;
  }
  .ai-tools-grid {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}
.scanner-onboarding__url-row {
  max-width: 100%;
}
.mod-page .mod-subtitle,
.system-settings-page .sys-settings-section-head,
.system-settings-page .sys-settings-row,
.bill-page .bill-invoices-head,
.prem-chart-card__head {
  display: flex;
  justify-content: start;
  flex-direction: column;
}
.system-settings-page .sys-settings-card--team > .sys-settings-section-head,
.system-settings-page .sys-settings-row, .bill-page .bill-invoices-head,
.prem-chart-card__head {
  align-items: start;
}
.system-settings-page .sys-settings-section-head {
  gap: 0;
  align-items: start;
}
.mod-page .mod-card {
  padding: 16px 17px 17px;
  min-width: 100%;
}
.product-hub-stat-grid {
  grid-template-columns: repeat(2, minmax(120px, 1fr)) !important;
}
.cc-stats-grid, .cc-ctrl-grid {
  grid-template-columns: repeat(1, 1fr) !important;
}
.prem-stats-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media screen and (max-width: 580px) and (min-width: 320px){
  .dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__actions .btn {
    min-height: 34px;
    padding: 0 12px;
    font-size: 12px;
  }
  .security-settings-page .acc-grid--security {
    grid-template-columns: 1fr;
}
  .dash-theme-cmp .dash-page-head.product-hub-hero .product-hub-hero__subtitle, .websites-page-shell .websites-header.product-hub-hero .product-hub-hero__subtitle, .app-container .consent-setup-shell .consent-setup-header.product-hub-hero .product-hub-hero__subtitle {
      font-size: 14px;
  }
  .dash-theme-cmp .dash-recommend-card .dash-section-title {
    padding-right: 0;
    margin-bottom: 9px;
  }
  .dash-recommend-viewall {
    font-size: 14px;
    vertical-align: 0;
    margin-bottom: 14px;
    display: block;
  }
  .dash-section-title {
    margin-bottom: 12px;
    font-size: 16px;
    font-weight: 700;
  }
  .dash-consent-logs-view-all {
    font-size: 12px;
    position: relative;
    top: auto;
    right: auto;
    padding: 5px 18px;
    margin-bottom: 14px;
}
  .dash-cookie-summary-row, .dash-cookie-cat-row {
      font-size: 13px;
  }
  .dash-cookie-summary-row, .dash-cookie-cat-row,
  .dash-cookie-summary-row span,
  .dash-cookie-summary-row strong {
    display: block;
  }
  .dash-consent-table th, .dash-consent-table td {
    padding: 9px 14px;
    font-size: 12px;
  }
  .app-content-footer {
    padding: 0;
    justify-content: center;
    text-align: center;
  }
  .websites-summary-bar {
    grid-template-columns: repeat(1,minmax(0,1fr))
  }
  .cmp-page-actions, .dash-page-actions, .ds-page-actions, .cr-page-actions, .product-hub-inline-actions, .product-hub-hero__actions, .form-actions, .card-actions {
    margin-top: 0;
    align-items: start;
    justify-content: start;
}

.help-hub-page.impl-center-page .product-hub-stat-grid {
  grid-template-columns: repeat(1, 1fr);
}
.prem-chart-card {
  min-width: 100%;
}
.prem-donut-legend {
  display: block;
  margin-top: -17px;
}
}
@media screen and (max-width: 480px){
  .product-hub-stat-grid {
    grid-template-columns: repeat(1, minmax(120px, 1fr)) !important;
  }
.prem-stats-grid {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
}
/* Table pagination (shared log tables) */
.cr-table-pagination {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 12px 0 0;
}

.cr-table-pagination .cr-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.cr-table-pagination .cr-pagination-meta {
  margin: 0;
}

.cr-table-pagination__size {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 0 auto;
  font-size: 13px;
  color: #3668e9;
}

.cr-table-pagination__size-label {
  white-space: nowrap;
}

.cr-pagination-mobile-meta {
  display: none;
  margin: 0;
  font-size: 13px;
  color: #3668e9;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .cr-page-numbers--desktop {
    display: none;
  }

  .cr-pagination-mobile-meta {
    display: block;
  }

  .cr-pagination-left {
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
  }

  .cr-table-pagination__toolbar {
    justify-content: stretch;
  }

  .cr-table-pagination__size {
    width: 100%;
    justify-content: space-between;
  }
}

/* Cookie compliance — Run your first scan launch card (reference layout, CSS only) */
.prem-scanner-root .scanner-onboarding__hero,
.prem-scanner-root .scanner-onboarding__url-card,
.prem-scanner-root .scanner-onboarding__url-card + .scanner-onboarding__progress.card[role="status"],
.prem-scanner-root .scanner-onboarding__actions {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #fff;
  border-left: 1px solid #e8ecf1;
  border-right: 1px solid #e8ecf1;
}
.prem-scanner-root .scanner-onboarding__hero {
  margin-bottom: 0;
  padding: 36px 48px 18px;
  text-align: center;
  border-bottom: none;
  border-radius: 16px 16px 0 0;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.05);
}

.prem-scanner-root .scanner-onboarding__hero > *,
.prem-scanner-root .scanner-onboarding__url-card > *,
.prem-scanner-root .scanner-onboarding__url-card + .scanner-onboarding__progress.card[role="status"] > *,
.prem-scanner-root .scanner-onboarding__actions > * {
  position: relative;
  z-index: 1;
}

.prem-scanner-root .scanner-onboarding__hero .scanner-onboarding__icon {
  width: 64px;
  height: 64px;
  margin-bottom: 16px;
  color: #2563eb;
  background: rgba(37, 99, 235, 0.08);
  border-radius: 14px;
  box-shadow: none;
}
.prem-scanner-root .scanner-onboarding__url-card {
  margin: 0;
  padding: 0 40px 24px;
  text-align: center;
  border-top: none;
  border-bottom: none;
  border-radius: 0;
  box-shadow: none;
}
.prem-scanner-root .scanner-onboarding__url-card .scanner-onboarding__url-icon {
  color: #2563eb;
  flex-shrink: 0;
}

.prem-scanner-root .scanner-onboarding__url-card .scanner-onboarding__url-value {
  font-size: 17px;
  font-weight: 600;
  line-height: 1.45;
  color: #0f172a;
  word-break: break-all;
}

.prem-scanner-root .scanner-onboarding__url-card + .scanner-onboarding__progress.card[role="status"] {
  display: block !important;
  margin: 0 40px 20px;
  padding: 20px 22px;
  background: linear-gradient(180deg, #ecfdf5 0%, #f8fafc 100%);
  border: 1px solid #6ee7b7;
  border-left: 4px solid #0d9488;
  border-radius: 12px;
  box-shadow:
    0 1px 3px rgba(13, 148, 136, 0.12),
    0 0 0 1px rgba(13, 148, 136, 0.06);
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] > div:first-of-type {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 14px !important;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] > div:first-of-type svg {
  flex-shrink: 0;
  color: #2563eb;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] > div:first-of-type strong {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  color: #0f766e;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] > div:first-of-type p {
  margin: 0 !important;
  font-size: 14px !important;
  line-height: 1.45;
  color: #047857;
  opacity: 1 !important;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] > div:nth-of-type(2) {
  margin-bottom: 14px !important;
  padding: 12px 14px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid #a7f3d0;
  border-radius: 10px;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] > div:nth-of-type(2) > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px !important;
  font-size: 14px !important;
  font-weight: 600;
  color: #115e59;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] > div:nth-of-type(2) > div:first-child span {
  font-size: 14px !important;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] > div:nth-of-type(2) > div:last-child {
  height: 6px !important;
  background: #d1fae5 !important;
  border-radius: 999px !important;
  overflow: hidden;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] > div:nth-of-type(2) > div:last-child > div {
  height: 100% !important;
  min-width: 2px;
  background: #0d685d !important;
  border-radius: 999px !important;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] div[style*="flex-wrap"] {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px !important;
  margin: 0 0 12px !important;
  padding: 10px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px solid #a7f3d0;
  border-radius: 10px;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] div[style*="flex-wrap"] > div {
  flex: none !important;
  min-width: 0 !important;
  padding: 10px 6px !important;
  border-radius: 10px !important;
  background: #fff !important;
  border: 1px solid #99f6e4;
  box-shadow: 0 1px 2px rgba(13, 148, 136, 0.08);
  text-align: center;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] div[style*="flex-wrap"] > div > div[style*="font-size: 15px"],
.prem-scanner-root .scanner-onboarding__progress.card[role="status"] div[style*="flex-wrap"] > div > div[style*="font-size:15px"] {
  font-size: 18px !important;
  font-weight: 700;
  color: #0f766e;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] div[style*="flex-wrap"] > div > div[style*="font-size: 10px"],
.prem-scanner-root .scanner-onboarding__progress.card[role="status"] div[style*="flex-wrap"] > div > div[style*="font-size:10px"] {
  margin-top: 4px;
  font-size: 11px !important;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #047857;
  opacity: 1 !important;
}

.prem-scanner-root .scanner-onboarding__progress.card[role="status"] > p[style*="opacity"] {
  margin: 0 !important;
  padding: 8px 10px;
  font-size: 14px !important;
  font-style: italic;
  color: #047857;
  background: rgba(255, 255, 255, 0.6);
  border: 1px dashed #6ee7b7;
  border-radius: 8px;
  opacity: 1 !important;
}

.prem-scanner-root .scanner-onboarding__actions {
  padding: 0 40px 32px;
  border-radius: 0 0 16px 16px;
}

.prem-scanner-root .scanner-onboarding__url-card + .scanner-onboarding__progress.card[role="status"] + .scanner-onboarding__actions {
  padding-top: 0;
}

@media (max-width: 720px) {
  .prem-scanner-root .scanner-onboarding__progress.card[role="status"] div[style*="flex-wrap"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .prem-scanner-root .scanner-onboarding__hero {
    padding: 28px 20px 18px;
  }

  .prem-scanner-root .scanner-onboarding__url-card,
  .prem-scanner-root .scanner-onboarding__actions {
    padding-left: 20px;
    padding-right: 20px;
  }

  .prem-scanner-root .scanner-onboarding__url-card + .scanner-onboarding__progress.card[role="status"] {
    margin-left: 20px;
    margin-right: 20px;
  }

  .prem-scanner-root .scanner-onboarding__actions {
    flex-direction: column;
  }

  .prem-scanner-root .scanner-onboarding__actions .scanner-onboarding__btn {
    width: 100%;
  }
}

/* Cookie compliance — onboarding scan buttons (reference layout, CSS only) */
.prem-scanner-root .scanner-onboarding__actions .scanner-onboarding__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 152px;
  padding: 13px 24px;
  font-size: 16px;
  font-weight: 600;
  border-radius: 10px;
}
.prem-scanner-root .scanner-onboarding__actions .scanner-onboarding__btn::after {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  margin-left: 2px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.prem-scanner-root .scanner-onboarding__actions .scanner-onboarding__btn:not(.secondary) > svg {
  display: none;
}

.prem-scanner-root .scanner-onboarding__actions .scanner-onboarding__btn:not(.secondary)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 7V5a2 2 0 0 1 2-2h2'/%3E%3Cpath d='M17 3h2a2 2 0 0 1 2 2v2'/%3E%3Cpath d='M21 17v2a2 2 0 0 1-2 2h-2'/%3E%3Cpath d='M7 21H5a2 2 0 0 1-2-2v-2'/%3E%3Cpath d='M7 12h10'/%3E%3C/svg%3E");
}

.prem-scanner-root .scanner-onboarding__actions .scanner-onboarding__btn.secondary::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%230f766e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3-1.9 5.8a2 2 0 0 1-1.3 1.3L3 12l5.8 1.9a2 2 0 0 1 1.3 1.3L12 21l1.9-5.8a2 2 0 0 1 1.3-1.3L21 12l-5.8-1.9a2 2 0 0 1-1.3-1.3Z'/%3E%3C/svg%3E");
}

.prem-scanner-root .scanner-onboarding__actions .scanner-onboarding__btn.secondary:hover:not(:disabled)::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23115e59' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 3-1.9 5.8a2 2 0 0 1-1.3 1.3L3 12l5.8 1.9a2 2 0 0 1 1.3 1.3L12 21l1.9-5.8a2 2 0 0 1 1.3-1.3L21 12l-5.8-1.9a2 2 0 0 1-1.3-1.3Z'/%3E%3C/svg%3E");
}

.prem-scanner-root .scanner-onboarding__progress:not([role="status"]) p {
  font-size: 16px;
}
.prem-scanner-root .scanner-onboarding__results-list p {
  font-size: 15px;
}

.prem-scanner-root .cs-scan-onboard-how-collapsible > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  user-select: none;
  color: #2562ff;
}

.prem-scanner-root .cs-scan-onboard-how-collapsible > summary::-webkit-details-marker {
  display: none;
}

.prem-scanner-root .cs-scan-onboard-how-collapsible > summary::marker {
  content: "";
}

.prem-scanner-root .cs-scan-onboard-how-collapsible__label {
  flex: 1 1 auto;
  min-width: 0;
}

.prem-scanner-root .cs-scan-onboard-how-collapsible__chevron {
  flex-shrink: 0;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease, border-color 0.15s ease;
}

.prem-scanner-root .cs-scan-onboard-how-collapsible__chevron::before {
  content: "";
  width: 7px;
  height: 7px;
  border-right: 2px solid #2562ff;
  border-bottom: 2px solid #2562ff;
  transform: rotate(45deg);
  margin-top: -2px;
  transition: transform 0.2s ease;
}

.prem-scanner-root .cs-scan-onboard-how-collapsible[open] .cs-scan-onboard-how-collapsible__chevron::before {
  transform: rotate(-135deg);
  margin-top: 2px;
}

.prem-scanner-root .cs-scan-onboard-how-collapsible > summary:hover .cs-scan-onboard-how-collapsible__chevron {
  background: #d1fae5;
  border-color: #6ee7b7;
}

.prem-scanner-root .cs-scan-onboard-how-collapsible > summary:not(:has(.cs-scan-onboard-how-collapsible__chevron))::after {
  content: "";
  flex-shrink: 0;
  width: 7px;
  height: 7px;
  border-right: 2px solid #0f766e;
  border-bottom: 2px solid #0f766e;
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}

.prem-scanner-root .cs-scan-onboard-how-collapsible[open] > summary:not(:has(.cs-scan-onboard-how-collapsible__chevron))::after {
  transform: rotate(-135deg);
}

.prem-scanner-root .cs-scan-onboard-how-collapsible .cs-scan-onboard-steps,
.prem-scanner-root .cs-scan-onboard-how-collapsible .cs-scan-onboard-steps li {
  font-size: calc(0.88rem + 2px);
}

.prem-scanner-root .cs-scan-onboard-how-collapsible .cs-scan-onboard-note {
  font-size: calc(0.88rem + 2px);
}

/* Cookie compliance — onboarding copy highlights */
.prem-scanner-root .cs-scan-onboard-highlight {
  display: inline;
  font-weight: 600;
  color: #262626;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.prem-scanner-root .cs-scan-onboard-highlight--duration {
  color: #92400e;
}

.prem-scanner-root .cs-scan-progress-stats__label {
  font-size: calc(0.72rem + 2px);
}

.prem-scanner-root .cs-scan-progress-stats__value {
  font-size: calc(1.25rem + 2px);
}

.prem-scanner-root .cs-scan-progress-stats__hint {
  font-size: calc(0.75rem + 2px);
}

/* ─── Widget resilience (per-widget error boundaries) ─── */
.cs-widget-boundary-host {
  display: contents;
}

.cs-widget-fallback,
.cs-widget-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 140px;
  padding: 20px 16px;
  border: 1px dashed #dbe3ef;
  border-radius: 14px;
  background: linear-gradient(180deg, #fafbfd 0%, #f5f8fc 100%);
  text-align: center;
}

.cs-widget-fallback--compact,
.cs-widget-loading--compact {
  min-height: 96px;
  padding: 14px 12px;
}

.cs-widget-fallback__title,
.cs-widget-loading__label {
  margin: 0;
  color: #334155;
  font-size: 0.92rem;
  font-weight: 600;
}

.cs-widget-fallback__message,
.cs-widget-fallback__ref {
  margin: 0;
  color: #64748b;
  font-size: 0.84rem;
  line-height: 1.45;
}

.cs-widget-fallback__retry {
  margin-top: 4px;
}

.cs-widget-loading__spinner {
  width: 22px;
  height: 22px;
  border: 2px solid #dbeafe;
  border-top-color: #2563eb;
  border-radius: 50%;
  animation: cs-widget-spin 0.8s linear infinite;
}

@keyframes cs-widget-spin {
  to {
    transform: rotate(360deg);
  }
}

.dash-chart-card .cs-widget-fallback,
.dash-chart-card .cs-widget-loading {
  min-height: 180px;
}