/* ═══════════════════════════════════════════════════════════════
   Customer Velocity 360 — Partner Pages (atq-partner.css)
   Design tokens + component styles for /partner/* route tree.
   Uses --ptr-* namespace. Inherits --cv-* shared tokens.
   ═══════════════════════════════════════════════════════════════ */

/* ── Partner Design Tokens ── */
:root {
  --ptr-accent:       #7c3aed;
  --ptr-accent-hover: #6d28d9;
  --ptr-accent-soft:  rgba(124, 58, 237, 0.08);
  --ptr-accent-ring:  rgba(124, 58, 237, 0.18);
  --ptr-surface:      var(--cv-bg-surface);
  --ptr-bg:           var(--cv-bg-primary);
  --ptr-text:         var(--cv-text-primary);
  --ptr-text-muted:   var(--cv-text-muted);
  --ptr-border:       var(--cv-border-default);
  --ptr-radius:       var(--cv-radius-md);
  --ptr-ease:         var(--cv-ease-spring);
  --ptr-gradient:     linear-gradient(135deg, #7c3aed, #2563eb);
  --ptr-gradient-soft:linear-gradient(135deg, rgba(124,58,237,0.06), rgba(37,99,235,0.06));

  /* Status Colors (extends --cv-color-*) */
  --ptr-status-open:      #2563eb;
  --ptr-status-progress:  #d97706;
  --ptr-status-hold:      #dc2626;
  --ptr-status-resolved:  #059669;
  --ptr-status-cancelled: #6b7280;

  /* Priority Colors */
  --ptr-priority-critical: #dc2626;
  --ptr-priority-high:     #ea580c;
  --ptr-priority-normal:   #2563eb;
  --ptr-priority-low:      #6b7280;
}

html[data-theme="dark"] {
  --ptr-accent:       #a78bfa;
  --ptr-accent-hover: #8b5cf6;
  --ptr-accent-soft:  rgba(167, 139, 250, 0.10);
  --ptr-accent-ring:  rgba(167, 139, 250, 0.25);
  --ptr-gradient:     linear-gradient(135deg, #a78bfa, #60a5fa);
  --ptr-gradient-soft:linear-gradient(135deg, rgba(167,139,250,0.08), rgba(96,165,250,0.08));

  --ptr-status-open:      #60a5fa;
  --ptr-status-progress:  #fbbf24;
  --ptr-status-hold:      #f87171;
  --ptr-status-resolved:  #34d399;
  --ptr-status-cancelled: #9ca3af;

  --ptr-priority-critical: #f87171;
  --ptr-priority-high:     #fb923c;
  --ptr-priority-normal:   #60a5fa;
  --ptr-priority-low:      #9ca3af;
}

/* ── FOUC Prevention ── */
.page-header, .page-heading, .breadcrumb { display: none !important; }
body:has(.ptr-page) .wrapper-body { max-width: 100% !important; }
body:has(.ptr-page) .wrapper-body > .container {
  max-width: 100% !important; width: 100% !important;
  padding-left: 0 !important; padding-right: 0 !important;
}
body:has(.ptr-page) .wrapper-body .row { margin: 0 !important; }
body:has(.ptr-page) .wrapper-body .col-lg-12,
body:has(.ptr-page) .wrapper-body .col-md-12 { padding: 0 !important; }

/* ════════════════════════════════════════════════════════════
   NAVBAR — Partner Mode Badge + Divider
   ════════════════════════════════════════════════════════════ */

.ptr-badge-partner {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 12px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #fff;
  background: var(--ptr-gradient);
  border-radius: var(--cv-radius-pill);
  white-space: nowrap;
  line-height: 1;
  vertical-align: middle;
}

.ptr-mode-indicator {
  display: flex !important;
  align-items: center !important;
  padding: 0 8px !important;
}

.ptr-nav-divider {
  display: flex !important;
  align-items: center !important;
  padding: 0 4px !important;
}
.ptr-divider-line {
  display: block;
  width: 1px;
  height: 20px;
  background: rgba(255, 255, 255, 0.2);
}

.ptr-nav-item > a {
  font-weight: 600 !important;
}

/* ════════════════════════════════════════════════════════════
   PAGE WRAPPER
   ════════════════════════════════════════════════════════════ */

.ptr-page {
  font-family: var(--cv-font-family);
  color: var(--ptr-text);
  background: var(--ptr-bg);
  min-height: 100vh;
}

/* ════════════════════════════════════════════════════════════
   HERO
   ════════════════════════════════════════════════════════════ */

.ptr-hero {
  position: relative;
  overflow: hidden;
  background: var(--cv-brand-surface);
  padding: 48px 0 36px;
}
.ptr-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 50% at 20% 50%, rgba(124, 58, 237, 0.15) 0%, transparent 70%),
    radial-gradient(ellipse 40% 60% at 80% 30%, rgba(37, 99, 235, 0.12) 0%, transparent 70%);
  pointer-events: none;
}
html[data-theme="dark"] .ptr-hero::before {
  background:
    radial-gradient(ellipse 60% 50% at 20% 50%, rgba(167, 139, 250, 0.10) 0%, transparent 70%),
    radial-gradient(ellipse 40% 60% at 80% 30%, rgba(96, 165, 250, 0.08) 0%, transparent 70%);
}
.ptr-hero-inner {
  position: relative;
  z-index: 1;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--cv-space-lg);
}
.ptr-hero-top {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 8px;
}
.ptr-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 14px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
  background: var(--ptr-gradient);
  border-radius: var(--cv-radius-pill);
}
.ptr-hero h1 {
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  font-weight: 700;
  color: #fff;
  margin: 0 0 6px;
  line-height: 1.2;
}
.ptr-hero-subtitle {
  font-size: 0.95rem;
  color: rgba(255, 255, 255, 0.65);
  margin: 0;
}
.ptr-hero-meta {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-top: 12px;
  flex-wrap: wrap;
}
.ptr-hero-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.82rem;
  color: rgba(255, 255, 255, 0.5);
}
.ptr-hero-meta-item svg {
  width: 14px;
  height: 14px;
  opacity: 0.7;
}

/* ════════════════════════════════════════════════════════════
   KPI CARDS
   ════════════════════════════════════════════════════════════ */

.ptr-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--cv-space-md);
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--cv-space-lg);
}

.ptr-kpi-card {
  background: var(--ptr-surface);
  border: 1px solid var(--ptr-border);
  border-radius: var(--ptr-radius);
  padding: 20px;
  position: relative;
  overflow: hidden;
  transition: transform 300ms var(--ptr-ease), box-shadow 300ms var(--ptr-ease);
}
.ptr-kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--cv-shadow-md);
}
.ptr-kpi-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--ptr-gradient);
  opacity: 0;
  transition: opacity 300ms var(--ptr-ease);
}
.ptr-kpi-card:hover::before {
  opacity: 1;
}
.ptr-kpi-label {
  font-size: 0.78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ptr-text-muted);
  margin: 0 0 8px;
}
.ptr-kpi-value {
  font-size: 2rem;
  font-weight: 700;
  color: var(--ptr-text);
  line-height: 1;
  margin: 0;
  font-variant-numeric: tabular-nums;
}
.ptr-kpi-value[data-countup] {
  opacity: 0;
  transform: translateY(6px);
}
.ptr-kpi-value.ptr-counted {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 400ms var(--ptr-ease), transform 400ms var(--ptr-ease);
}
.ptr-kpi-trend {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.75rem;
  font-weight: 600;
  margin-top: 8px;
}
.ptr-kpi-trend--up { color: var(--cv-color-danger); }
.ptr-kpi-trend--down { color: var(--cv-color-success); }

/* Colored top-bar variants */
.ptr-kpi-card--open::before    { background: var(--ptr-status-open);     opacity: 1; }
.ptr-kpi-card--progress::before{ background: var(--ptr-status-progress); opacity: 1; }
.ptr-kpi-card--hold::before    { background: var(--ptr-status-hold);     opacity: 1; }
.ptr-kpi-card--resolved::before{ background: var(--ptr-status-resolved); opacity: 1; }
.ptr-kpi-card--accent::before  { background: var(--ptr-gradient);        opacity: 1; }

/* ── Account Number Pill ── */
.ptr-acct-pill {
  display: inline-block;
  font-size: 0.42em;
  font-weight: 600;
  background: rgba(255,255,255,0.18);
  color: rgba(255,255,255,0.92);
  padding: 4px 14px;
  border-radius: 20px;
  vertical-align: middle;
  letter-spacing: 0.5px;
  border: 1px solid rgba(255,255,255,0.22);
  backdrop-filter: blur(4px);
}

/* ── KPI Grouped Layout (Account Detail) ── */
.ptr-kpi-section {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 var(--cv-space-lg);
}
.ptr-kpi-groups {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--cv-space-md);
}
.ptr-kpi-group {
  background: var(--ptr-surface);
  border: 1px solid var(--ptr-border);
  border-radius: var(--ptr-radius);
  overflow: hidden;
  position: relative;
  transition: transform 300ms var(--ptr-ease), box-shadow 300ms var(--ptr-ease);
}
.ptr-kpi-group::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  border-radius: var(--ptr-radius) var(--ptr-radius) 0 0;
}
.ptr-kpi-group:hover {
  transform: translateY(-2px);
  box-shadow: var(--cv-shadow-md);
}
.ptr-kpi-group-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 20px 12px;
  border-bottom: 1px solid var(--ptr-border);
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ptr-text-muted);
}
.ptr-kpi-group-header svg {
  flex-shrink: 0;
}

/* ── Cases — Blue ── */
.ptr-kpi-group--cases::before        { background: linear-gradient(90deg, #3b82f6, #60a5fa); }
.ptr-kpi-group--cases .ptr-kpi-group-header svg { color: #3b82f6; }
.ptr-kpi-group--cases .ptr-kpi-group-header span { color: #3b82f6; }

/* ── Delivery — Violet ── */
.ptr-kpi-group--delivery::before      { background: linear-gradient(90deg, #7c3aed, #a78bfa); }
.ptr-kpi-group--delivery .ptr-kpi-group-header svg { color: #7c3aed; }
.ptr-kpi-group--delivery .ptr-kpi-group-header span { color: #7c3aed; }

/* ── People — Teal ── */
.ptr-kpi-group--people::before        { background: linear-gradient(90deg, #0d9488, #2dd4bf); }
.ptr-kpi-group--people .ptr-kpi-group-header svg { color: #0d9488; }
.ptr-kpi-group--people .ptr-kpi-group-header span { color: #0d9488; }
.ptr-kpi-group-body {
  display: flex;
  gap: 0;
}
.ptr-kpi-item {
  flex: 1;
  padding: 20px;
  text-align: center;
  position: relative;
}
.ptr-kpi-item + .ptr-kpi-item {
  border-left: 1px solid var(--ptr-border);
}
.ptr-kpi-num {
  display: block;
  font-size: 2rem;
  font-weight: 700;
  color: var(--ptr-text);
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.ptr-kpi-num[data-countup] {
  opacity: 0;
  transform: translateY(6px);
}
.ptr-kpi-num.ptr-counted {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 400ms var(--ptr-ease), transform 400ms var(--ptr-ease);
}
.ptr-kpi-lbl {
  display: block;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ptr-text-muted);
  margin-top: 6px;
}
/* Number colors inherit group identity */
.ptr-kpi-group--cases .ptr-kpi-num     { color: #3b82f6; }
.ptr-kpi-group--delivery .ptr-kpi-num  { color: #7c3aed; }
.ptr-kpi-group--people .ptr-kpi-num    { color: #0d9488; }

/* Open shows as blue, resolved as green for semantic clarity */
.ptr-kpi-item--open .ptr-kpi-num       { color: var(--ptr-status-open); }
.ptr-kpi-item--resolved .ptr-kpi-num   { color: var(--ptr-status-resolved); }

/* ════════════════════════════════════════════════════════════
   CONTENT LAYOUT
   ════════════════════════════════════════════════════════════ */

.ptr-content {
  max-width: 1400px;
  margin: 0 auto;
  padding: var(--cv-space-xl) var(--cv-space-lg);
}
.ptr-content-split {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: var(--cv-space-xl);
  max-width: 1400px;
  margin: 0 auto;
  padding: var(--cv-space-xl) var(--cv-space-lg);
}
@media (max-width: 1024px) {
  .ptr-content-split {
    grid-template-columns: 1fr;
  }
}

/* ════════════════════════════════════════════════════════════
   SIDEBAR (Command Center)
   ════════════════════════════════════════════════════════════ */

.ptr-sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--cv-space-md);
}
.ptr-sidebar-card {
  background: var(--ptr-surface);
  border: 1px solid var(--ptr-border);
  border-radius: var(--ptr-radius);
  padding: 20px;
}
.ptr-sidebar-card h3 {
  font-size: 0.82rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ptr-text-muted);
  margin: 0 0 12px;
}
.ptr-sidebar-stat {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  border-bottom: 1px solid var(--cv-border-light);
}
.ptr-sidebar-stat:last-child { border-bottom: none; }
.ptr-sidebar-stat-label {
  font-size: 0.85rem;
  color: var(--ptr-text);
}
.ptr-sidebar-stat-value {
  font-size: 1rem;
  font-weight: 700;
  color: var(--ptr-text);
  font-variant-numeric: tabular-nums;
}

/* Quick Actions */
.ptr-quick-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ptr-quick-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--ptr-text);
  background: var(--ptr-accent-soft);
  border: 1px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  text-decoration: none;
  transition: background 200ms, border-color 200ms;
}
.ptr-quick-btn:hover {
  background: var(--ptr-accent-ring);
  border-color: var(--ptr-accent);
  color: var(--ptr-accent);
  text-decoration: none;
}
.ptr-quick-btn svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

/* ════════════════════════════════════════════════════════════
   SECTION HEADERS
   ════════════════════════════════════════════════════════════ */

.ptr-section-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--ptr-text);
  margin: 0 0 16px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.ptr-section-title svg {
  width: 20px;
  height: 20px;
  color: var(--ptr-accent);
}
.ptr-section-divider {
  width: 100%;
  height: 1px;
  background: var(--ptr-border);
  margin: var(--cv-space-xl) 0;
}

/* ════════════════════════════════════════════════════════════
   FILTER BAR
   ════════════════════════════════════════════════════════════ */

.ptr-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding: 12px 16px;
  background: var(--ptr-surface);
  border: 1px solid var(--ptr-border);
  border-radius: var(--ptr-radius);
  margin-bottom: var(--cv-space-lg);
}
.ptr-filter-bar label {
  font-size: 0.78rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--ptr-text-muted);
  margin: 0 4px 0 0;
  white-space: nowrap;
}
.ptr-filter-select {
  padding: 6px 12px;
  font-size: 0.85rem;
  border: 1px solid var(--ptr-border);
  border-radius: 8px;
  background: var(--ptr-surface);
  color: var(--ptr-text);
  min-width: 140px;
  cursor: pointer;
  transition: border-color 200ms;
}
.ptr-filter-select:focus {
  outline: none;
  border-color: var(--ptr-accent);
  box-shadow: 0 0 0 3px var(--ptr-accent-ring);
}
.ptr-filter-search {
  flex: 1;
  min-width: 200px;
  padding: 6px 12px 6px 32px;
  font-size: 0.85rem;
  border: 1px solid var(--ptr-border);
  border-radius: 8px;
  background: var(--ptr-surface) 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='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") no-repeat 10px center;
  color: var(--ptr-text);
  transition: border-color 200ms;
}
.ptr-filter-search:focus {
  outline: none;
  border-color: var(--ptr-accent);
  box-shadow: 0 0 0 3px var(--ptr-accent-ring);
}
.ptr-filter-count {
  font-size: 0.82rem;
  color: var(--ptr-text-muted);
  margin-left: auto;
  white-space: nowrap;
}

/* Active filter pills */
.ptr-filter-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.ptr-filter-pill {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  font-size: 0.75rem;
  font-weight: 600;
  background: var(--ptr-accent-soft);
  color: var(--ptr-accent);
  border-radius: var(--cv-radius-pill);
  border: none;
  cursor: pointer;
}
.ptr-filter-pill:hover {
  background: var(--ptr-accent-ring);
}
.ptr-filter-pill-x {
  font-size: 0.85rem;
  line-height: 1;
  margin-left: 2px;
}

/* ════════════════════════════════════════════════════════════
   DATA TABLE
   ════════════════════════════════════════════════════════════ */

.ptr-table-wrap {
  background: var(--ptr-surface);
  border: 1px solid var(--ptr-border);
  border-radius: var(--ptr-radius);
  overflow: hidden;
}
.ptr-data-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}
.ptr-data-table thead {
  background: var(--ptr-gradient-soft);
}
.ptr-data-table th {
  padding: 12px 16px;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ptr-text-muted);
  text-align: left;
  border-bottom: 1px solid var(--ptr-border);
  white-space: nowrap;
  user-select: none;
  cursor: pointer;
  position: relative;
}
.ptr-data-table th:hover {
  color: var(--ptr-accent);
}
.ptr-data-table th .ptr-sort-icon {
  display: inline-block;
  width: 12px;
  height: 12px;
  vertical-align: middle;
  margin-left: 4px;
  opacity: 0.3;
  transition: opacity 200ms;
}
.ptr-data-table th:hover .ptr-sort-icon,
.ptr-data-table th[data-sort-active] .ptr-sort-icon {
  opacity: 1;
}
.ptr-data-table td {
  padding: 10px 16px;
  color: var(--ptr-text);
  border-bottom: 1px solid var(--cv-border-light);
  vertical-align: middle;
}
.ptr-data-table tbody tr {
  transition: background 150ms;
}
.ptr-data-table tbody tr:hover {
  background: var(--ptr-accent-soft);
}
.ptr-data-table tbody tr:last-child td {
  border-bottom: none;
}
.ptr-data-table a.ptr-row-link {
  color: var(--ptr-accent);
  font-weight: 600;
  text-decoration: none;
}
.ptr-data-table a.ptr-row-link:hover {
  text-decoration: underline;
}

/* Empty State */
.ptr-empty {
  text-align: center;
  padding: 60px 20px;
  color: var(--ptr-text-muted);
}
.ptr-empty svg {
  width: 48px;
  height: 48px;
  margin-bottom: 12px;
  opacity: 0.4;
}
.ptr-empty h3 {
  font-size: 1.1rem;
  font-weight: 600;
  margin: 0 0 6px;
  color: var(--ptr-text);
}
.ptr-empty p {
  font-size: 0.88rem;
  margin: 0;
}

/* ════════════════════════════════════════════════════════════
   STATUS + PRIORITY BADGES
   ════════════════════════════════════════════════════════════ */

.ptr-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  font-size: 0.72rem;
  font-weight: 700;
  border-radius: var(--cv-radius-pill);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  white-space: nowrap;
}
.ptr-status-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}

/* Status variants */
.ptr-status--open     { background: rgba(37,99,235,0.08);  color: var(--ptr-status-open); }
.ptr-status--open .ptr-status-dot     { background: var(--ptr-status-open); }
.ptr-status--progress { background: rgba(217,119,6,0.08);  color: var(--ptr-status-progress); }
.ptr-status--progress .ptr-status-dot { background: var(--ptr-status-progress); }
.ptr-status--hold     { background: rgba(220,38,38,0.08);  color: var(--ptr-status-hold); }
.ptr-status--hold .ptr-status-dot     { background: var(--ptr-status-hold); }
.ptr-status--resolved { background: rgba(5,150,105,0.08);  color: var(--ptr-status-resolved); }
.ptr-status--resolved .ptr-status-dot { background: var(--ptr-status-resolved); }
.ptr-status--cancelled{ background: rgba(107,114,128,0.08);color: var(--ptr-status-cancelled); }
.ptr-status--cancelled .ptr-status-dot{ background: var(--ptr-status-cancelled); }

html[data-theme="dark"] .ptr-status--open     { background: rgba(96,165,250,0.12); }
html[data-theme="dark"] .ptr-status--progress { background: rgba(251,191,36,0.12); }
html[data-theme="dark"] .ptr-status--hold     { background: rgba(248,113,113,0.12); }
html[data-theme="dark"] .ptr-status--resolved { background: rgba(52,211,153,0.12); }
html[data-theme="dark"] .ptr-status--cancelled{ background: rgba(156,163,175,0.12); }

/* Priority badges */
.ptr-priority {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  white-space: nowrap;
}
.ptr-priority--critical { color: var(--ptr-priority-critical); }
.ptr-priority--high     { color: var(--ptr-priority-high); }
.ptr-priority--normal   { color: var(--ptr-priority-normal); }
.ptr-priority--low      { color: var(--ptr-priority-low); }
.ptr-priority-icon {
  width: 12px;
  height: 12px;
}

/* SLA badges */
.ptr-sla {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  font-size: 0.72rem;
  font-weight: 700;
  border-radius: var(--cv-radius-pill);
}
.ptr-sla--met     { background: rgba(5,150,105,0.08); color: var(--cv-color-success); }
.ptr-sla--breached{ background: rgba(220,38,38,0.08); color: var(--cv-color-danger); }
.ptr-sla--nearing { background: rgba(217,119,6,0.08); color: var(--cv-color-warning); }

/* ════════════════════════════════════════════════════════════
   ACCOUNT CARDS (Accounts page + Command Center)
   ════════════════════════════════════════════════════════════ */

.ptr-account-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: var(--cv-space-md);
}
.ptr-account-card {
  background: var(--ptr-surface);
  border: 1px solid var(--ptr-border);
  border-radius: var(--ptr-radius);
  padding: 20px;
  cursor: pointer;
  transition: transform 300ms var(--ptr-ease), box-shadow 300ms var(--ptr-ease), border-color 300ms;
  text-decoration: none;
  color: inherit;
  display: block;
}
.ptr-account-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--cv-shadow-md);
  border-color: var(--ptr-accent);
  text-decoration: none;
  color: inherit;
}
.ptr-account-card-name {
  font-size: 1rem;
  font-weight: 700;
  color: var(--ptr-text);
  margin: 0 0 4px;
}
.ptr-account-card-contact {
  font-size: 0.82rem;
  color: var(--ptr-text-muted);
  margin: 0 0 12px;
}
.ptr-account-card-metrics {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.ptr-account-metric {
  text-align: center;
  padding: 8px 4px;
  background: var(--ptr-gradient-soft);
  border-radius: 8px;
}
.ptr-account-metric-value {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--ptr-text);
  display: block;
}
.ptr-account-metric-label {
  font-size: 0.68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--ptr-text-muted);
}

/* ════════════════════════════════════════════════════════════
   CONTEXT BANNER (Detail pages with partner role)
   ════════════════════════════════════════════════════════════ */

.ptr-context-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 20px;
  background: var(--ptr-accent-soft);
  border-left: 3px solid var(--ptr-accent);
  border-radius: 0 var(--cv-radius-sm) var(--cv-radius-sm) 0;
  margin-bottom: var(--cv-space-md);
}
.ptr-context-banner svg {
  width: 18px;
  height: 18px;
  color: var(--ptr-accent);
  flex-shrink: 0;
}
.ptr-context-banner-text {
  font-size: 0.85rem;
  color: var(--ptr-text);
}
.ptr-context-banner-text strong {
  font-weight: 700;
}
.ptr-context-banner-link {
  margin-left: auto;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--ptr-accent);
  text-decoration: none;
  white-space: nowrap;
}
.ptr-context-banner-link:hover {
  text-decoration: underline;
}

/* ════════════════════════════════════════════════════════════
   ACTIVITY FEED (Command Center recent activity)
   ════════════════════════════════════════════════════════════ */

.ptr-activity-list {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.ptr-activity-item {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: 12px;
  align-items: start;
  padding: 12px 0;
  border-bottom: 1px solid var(--cv-border-light);
}
.ptr-activity-item:last-child { border-bottom: none; }
.ptr-activity-icon {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.ptr-activity-icon--case {
  background: rgba(37, 99, 235, 0.08);
  color: var(--ptr-status-open);
}
.ptr-activity-icon--project {
  background: rgba(124, 58, 237, 0.08);
  color: var(--ptr-accent);
}
.ptr-activity-icon--engagement {
  background: rgba(5, 150, 105, 0.08);
  color: var(--cv-color-success);
}
.ptr-activity-icon svg {
  width: 16px;
  height: 16px;
}
.ptr-activity-body {
  min-width: 0;
}
.ptr-activity-title {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--ptr-text);
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ptr-activity-title a {
  color: inherit;
  text-decoration: none;
}
.ptr-activity-title a:hover {
  color: var(--ptr-accent);
}
.ptr-activity-meta {
  font-size: 0.78rem;
  color: var(--ptr-text-muted);
  margin-top: 2px;
}
.ptr-activity-time {
  font-size: 0.75rem;
  color: var(--ptr-text-muted);
  white-space: nowrap;
}

/* ════════════════════════════════════════════════════════════
   TABS (Detail views / Account detail)
   ════════════════════════════════════════════════════════════ */

.ptr-tabs {
  display: flex;
  gap: 0;
  border-bottom: 2px solid var(--ptr-border);
  margin-bottom: var(--cv-space-lg);
}
.ptr-tab {
  padding: 10px 20px;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--ptr-text-muted);
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -2px;
  cursor: pointer;
  transition: color 200ms, border-color 200ms;
  white-space: nowrap;
}
.ptr-tab:hover {
  color: var(--ptr-accent);
}
.ptr-tab.ptr-tab--active {
  color: var(--ptr-accent);
  border-bottom-color: var(--ptr-accent);
}
.ptr-tab-content {
  display: none;
}
.ptr-tab-content.ptr-tab-content--active {
  display: block;
}

/* ════════════════════════════════════════════════════════════
   PAGINATION
   ════════════════════════════════════════════════════════════ */

.ptr-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  padding: 16px;
}
.ptr-page-btn {
  padding: 6px 12px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--ptr-text);
  background: var(--ptr-surface);
  border: 1px solid var(--ptr-border);
  border-radius: 8px;
  cursor: pointer;
  transition: background 150ms, border-color 150ms;
}
.ptr-page-btn:hover {
  background: var(--ptr-accent-soft);
  border-color: var(--ptr-accent);
  color: var(--ptr-accent);
}
.ptr-page-btn.ptr-page-btn--active {
  background: var(--ptr-accent);
  border-color: var(--ptr-accent);
  color: #fff;
}
.ptr-page-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

/* ════════════════════════════════════════════════════════════
   SCROLL REVEAL ANIMATION
   ════════════════════════════════════════════════════════════ */

.ptr-reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 600ms var(--ptr-ease), transform 600ms var(--ptr-ease);
}
.ptr-reveal.ptr-visible {
  opacity: 1;
  transform: translateY(0);
}
.ptr-reveal-delay-1 { transition-delay: 100ms; }
.ptr-reveal-delay-2 { transition-delay: 200ms; }
.ptr-reveal-delay-3 { transition-delay: 300ms; }
.ptr-reveal-delay-4 { transition-delay: 400ms; }

/* ════════════════════════════════════════════════════════════
   LOADING SKELETON
   ════════════════════════════════════════════════════════════ */

.ptr-skeleton {
  background: linear-gradient(90deg, var(--ptr-border) 25%, transparent 50%, var(--ptr-border) 75%);
  background-size: 200% 100%;
  animation: ptrShimmer 1.5s infinite;
  border-radius: 6px;
}
@keyframes ptrShimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ════════════════════════════════════════════════════════════
   ACCOUNT DETAIL — Back Link, KPIs, Tabs, Contacts, Progress
   ════════════════════════════════════════════════════════════ */

.ptr-hero-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(255,255,255,.65);
  font-size: .85rem;
  font-weight: 500;
  text-decoration: none;
  transition: color .2s;
}
.ptr-hero-back:hover { color: #fff; text-decoration: none; }

.ptr-acct-kpis { grid-template-columns: repeat(6, 1fr); }

.ptr-tab-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 10px;
  background: var(--ptr-border);
  font-size: .72rem;
  font-weight: 600;
  color: var(--ptr-text-muted);
  margin-left: 6px;
}
.ptr-tab--active .ptr-tab-count {
  background: var(--ptr-accent);
  color: #fff;
}

.ptr-cell-title {
  max-width: 300px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ── Contact cards ── */
.ptr-contact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: var(--cv-space-md);
  padding: var(--cv-space-md) 0;
}
.ptr-contact-card {
  display: flex;
  gap: 14px;
  padding: var(--cv-space-md);
  background: var(--ptr-card);
  border: 1px solid var(--ptr-border);
  border-radius: var(--ptr-radius);
  transition: border-color .2s, box-shadow .2s;
}
.ptr-contact-card:hover {
  border-color: var(--ptr-accent);
  box-shadow: 0 2px 8px rgba(59,130,246,.08);
}
.ptr-contact-avatar {
  flex-shrink: 0;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--ptr-accent), #818cf8);
  color: #fff;
  font-size: .9rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ptr-contact-info { min-width: 0; }
.ptr-contact-name {
  margin: 0;
  font-size: .9rem;
  font-weight: 600;
  color: var(--ptr-text);
}
.ptr-contact-role {
  margin: 2px 0 6px;
  font-size: .78rem;
  color: var(--ptr-text-muted);
}
.ptr-contact-detail {
  margin: 3px 0 0;
  font-size: .78rem;
  color: var(--ptr-text-muted);
  display: flex;
  align-items: center;
  gap: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ptr-contact-detail svg { flex-shrink: 0; opacity: .6; }

/* ── Account card header + badge ── */
.ptr-account-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
.ptr-account-card-badge {
  flex-shrink: 0;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: .7rem;
  font-weight: 600;
  background: rgba(239,68,68,.12);
  color: #ef4444;
  white-space: nowrap;
}

/* ── Progress bars (Projects) ── */
.ptr-progress-bar {
  display: inline-block;
  width: 80px;
  height: 6px;
  background: var(--ptr-border);
  border-radius: 3px;
  overflow: hidden;
  vertical-align: middle;
}
.ptr-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--ptr-accent), #22c55e);
  border-radius: 3px;
  transition: width .6s ease;
}
.ptr-progress-label {
  font-size: .75rem;
  font-weight: 600;
  color: var(--ptr-text-muted);
  margin-left: 6px;
  vertical-align: middle;
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {
  .ptr-hero { padding: 32px 0 24px; }
  .ptr-hero h1 { font-size: 1.4rem; }
  .ptr-kpi-grid { grid-template-columns: repeat(2, 1fr); }
  .ptr-kpi-groups { grid-template-columns: 1fr; }
  .ptr-kpi-section { padding-left: var(--cv-space-md); padding-right: var(--cv-space-md); }
  .ptr-content, .ptr-content-split, .ptr-kpi-grid {
    padding-left: var(--cv-space-md);
    padding-right: var(--cv-space-md);
  }
  .ptr-filter-bar { flex-direction: column; align-items: stretch; }
  .ptr-filter-select { width: 100%; }
  .ptr-filter-search { min-width: unset; }
  .ptr-data-table { font-size: 0.8rem; }
  .ptr-data-table th, .ptr-data-table td { padding: 8px 10px; }
  .ptr-account-grid { grid-template-columns: 1fr; }
  .ptr-account-card-metrics { grid-template-columns: repeat(3, 1fr); }
  .ptr-contact-grid { grid-template-columns: 1fr; }
  .ptr-tabs { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .ptr-activity-item { grid-template-columns: auto 1fr; }
  .ptr-activity-time { grid-column: 2; }
}

@media (max-width: 480px) {
  .ptr-kpi-grid { grid-template-columns: 1fr; }
  .ptr-hero-meta { flex-direction: column; gap: 8px; }
  .ptr-pagination { flex-wrap: wrap; }
}

/* ════════════════════════════════════════════════════════════
   DARK MODE — Enhanced backgrounds & surfaces
   All backgrounds use !important to beat the atq-core nuclear
   rule that forces transparent on all div/span/section elements.
   ════════════════════════════════════════════════════════════ */

/* Page wrapper — subtle radial glow instead of flat black */
html[data-theme="dark"] .ptr-page {
  background:
    radial-gradient(ellipse 80% 60% at 50% 0%, rgba(167,139,250,0.04) 0%, transparent 60%),
    var(--cv-bg-primary) !important;
}

/* Hero — deeper brand surface with tinted glow */
html[data-theme="dark"] .ptr-hero {
  background: var(--cv-brand-surface) !important;
}

/* Hero badge */
html[data-theme="dark"] .ptr-hero-badge {
  background: var(--ptr-gradient) !important;
}

/* Hero inner — keep transparent so hero gradient shows through */
html[data-theme="dark"] .ptr-hero-inner {
  background: transparent !important;
}

/* Hero top row, meta, titles */
html[data-theme="dark"] .ptr-hero-top,
html[data-theme="dark"] .ptr-hero h1,
html[data-theme="dark"] .ptr-hero-meta {
  background: transparent !important;
}

/* Account pill on hero */
html[data-theme="dark"] .ptr-acct-pill {
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(255,255,255,0.18);
}

/* ── KPI Cards ── */
html[data-theme="dark"] .ptr-kpi-card {
  background: var(--cv-bg-raised) !important;
  border-color: #333;
}
html[data-theme="dark"] .ptr-kpi-card::before {
  opacity: 1;
}

/* ── KPI Grouped Layout ── */
html[data-theme="dark"] .ptr-kpi-group {
  background: var(--cv-bg-raised) !important;
  border-color: #333;
}
html[data-theme="dark"] .ptr-kpi-group::before {
  opacity: 1;
}
html[data-theme="dark"] .ptr-kpi-group-header {
  background: transparent !important;
  border-color: #333;
}

/* Dark group identities — lighter gradient bars + adjusted icon/label colors */
html[data-theme="dark"] .ptr-kpi-group--cases::before         { background: linear-gradient(90deg, #60a5fa, #93c5fd) !important; }
html[data-theme="dark"] .ptr-kpi-group--cases .ptr-kpi-group-header svg,
html[data-theme="dark"] .ptr-kpi-group--cases .ptr-kpi-group-header span { color: #60a5fa; }

html[data-theme="dark"] .ptr-kpi-group--delivery::before      { background: linear-gradient(90deg, #a78bfa, #c4b5fd) !important; }
html[data-theme="dark"] .ptr-kpi-group--delivery .ptr-kpi-group-header svg,
html[data-theme="dark"] .ptr-kpi-group--delivery .ptr-kpi-group-header span { color: #a78bfa; }

html[data-theme="dark"] .ptr-kpi-group--people::before        { background: linear-gradient(90deg, #2dd4bf, #5eead4) !important; }
html[data-theme="dark"] .ptr-kpi-group--people .ptr-kpi-group-header svg,
html[data-theme="dark"] .ptr-kpi-group--people .ptr-kpi-group-header span { color: #2dd4bf; }

/* Dark number colors */
html[data-theme="dark"] .ptr-kpi-group--cases .ptr-kpi-num    { color: #60a5fa !important; }
html[data-theme="dark"] .ptr-kpi-group--delivery .ptr-kpi-num { color: #a78bfa !important; }
html[data-theme="dark"] .ptr-kpi-group--people .ptr-kpi-num   { color: #2dd4bf !important; }
html[data-theme="dark"] .ptr-kpi-item--open .ptr-kpi-num      { color: #60a5fa !important; }
html[data-theme="dark"] .ptr-kpi-item--resolved .ptr-kpi-num  { color: #34d399 !important; }

html[data-theme="dark"] .ptr-kpi-group-body {
  background: transparent !important;
}
html[data-theme="dark"] .ptr-kpi-item {
  background: transparent !important;
}
html[data-theme="dark"] .ptr-kpi-section {
  background: transparent !important;
}
html[data-theme="dark"] .ptr-kpi-groups {
  background: transparent !important;
}
html[data-theme="dark"] .ptr-kpi-num,
html[data-theme="dark"] .ptr-kpi-lbl,
html[data-theme="dark"] .ptr-kpi-label,
html[data-theme="dark"] .ptr-kpi-value {
  background: transparent !important;
}

/* ── Account Cards (list page) ── */
html[data-theme="dark"] .ptr-account-card {
  background: var(--cv-bg-raised) !important;
  border-color: #333;
}
html[data-theme="dark"] .ptr-account-card:hover {
  border-color: var(--ptr-accent);
  box-shadow: 0 4px 20px rgba(167,139,250,0.10);
}
html[data-theme="dark"] .ptr-account-card-header {
  background: transparent !important;
}
html[data-theme="dark"] .ptr-account-card-name,
html[data-theme="dark"] .ptr-account-card-contact {
  background: transparent !important;
}
html[data-theme="dark"] .ptr-account-card-metrics {
  background: transparent !important;
}
html[data-theme="dark"] .ptr-account-metric {
  background: rgba(167,139,250,0.06) !important;
}
html[data-theme="dark"] .ptr-account-metric-value,
html[data-theme="dark"] .ptr-account-metric-label {
  background: transparent !important;
}
html[data-theme="dark"] .ptr-account-card-badge {
  background: rgba(248,113,113,0.15) !important;
}
html[data-theme="dark"] .ptr-account-grid {
  background: transparent !important;
}

/* ── Data Table ── */
html[data-theme="dark"] .ptr-table-wrap {
  background: var(--cv-bg-raised) !important;
  border-color: #333;
}
html[data-theme="dark"] .ptr-data-table thead {
  background: rgba(167,139,250,0.06) !important;
}
html[data-theme="dark"] .ptr-data-table th {
  background: transparent !important;
  border-color: #333;
}
html[data-theme="dark"] .ptr-data-table td {
  background: transparent !important;
  border-color: #262626;
}
html[data-theme="dark"] .ptr-data-table tbody tr:hover td {
  background: rgba(167,139,250,0.04) !important;
}

/* ── Filter Bar ── */
html[data-theme="dark"] .ptr-filter-bar {
  background: var(--cv-bg-raised) !important;
  border-color: #333;
}
html[data-theme="dark"] .ptr-filter-select,
html[data-theme="dark"] .ptr-filter-search {
  background: var(--cv-bg-surface) !important;
  border-color: #404040;
  color: var(--cv-text-primary);
}
html[data-theme="dark"] .ptr-filter-pill {
  background: rgba(167,139,250,0.12) !important;
}
html[data-theme="dark"] .ptr-filter-count {
  background: transparent !important;
}

/* ── Status badges — boost opacity for dark ── */
html[data-theme="dark"] .ptr-status--open      { background: rgba(96,165,250,0.15) !important;  }
html[data-theme="dark"] .ptr-status--progress   { background: rgba(251,191,36,0.15) !important;  }
html[data-theme="dark"] .ptr-status--hold       { background: rgba(248,113,113,0.15) !important; }
html[data-theme="dark"] .ptr-status--resolved   { background: rgba(52,211,153,0.15) !important;  }
html[data-theme="dark"] .ptr-status--cancelled  { background: rgba(156,163,175,0.15) !important; }

/* Status dots */
html[data-theme="dark"] .ptr-status-dot {
  background: currentColor !important;
  box-shadow: 0 0 4px currentColor;
}

/* ── Activity Icons ── */
html[data-theme="dark"] .ptr-activity-icon--case {
  background: rgba(96,165,250,0.12) !important;
}
html[data-theme="dark"] .ptr-activity-icon--project {
  background: rgba(167,139,250,0.12) !important;
}
html[data-theme="dark"] .ptr-activity-icon--engagement {
  background: rgba(52,211,153,0.12) !important;
}

/* ── Sidebar ── */
html[data-theme="dark"] .ptr-sidebar-card {
  background: var(--cv-bg-raised) !important;
  border-color: #333;
}
html[data-theme="dark"] .ptr-quick-btn {
  background: rgba(167,139,250,0.08) !important;
}
html[data-theme="dark"] .ptr-quick-btn:hover {
  background: rgba(167,139,250,0.15) !important;
}

/* ── Tabs ── */
html[data-theme="dark"] .ptr-tabs {
  border-color: #333;
}
html[data-theme="dark"] .ptr-tab-count {
  background: #333 !important;
}
html[data-theme="dark"] .ptr-tab--active .ptr-tab-count {
  background: var(--ptr-accent) !important;
}
html[data-theme="dark"] .ptr-tab-content {
  background: transparent !important;
}

/* ── Contact Cards ── */
html[data-theme="dark"] .ptr-contact-card {
  background: var(--cv-bg-raised) !important;
  border-color: #333;
}
html[data-theme="dark"] .ptr-contact-card:hover {
  border-color: var(--ptr-accent);
  box-shadow: 0 2px 12px rgba(167,139,250,0.08);
}
html[data-theme="dark"] .ptr-contact-avatar {
  background: linear-gradient(135deg, var(--ptr-accent), #818cf8) !important;
}
html[data-theme="dark"] .ptr-contact-info,
html[data-theme="dark"] .ptr-contact-name,
html[data-theme="dark"] .ptr-contact-role,
html[data-theme="dark"] .ptr-contact-detail {
  background: transparent !important;
}
html[data-theme="dark"] .ptr-contact-grid {
  background: transparent !important;
}

/* ── Context Banner ── */
html[data-theme="dark"] .ptr-context-banner {
  background: rgba(167,139,250,0.08) !important;
  border-left-color: var(--ptr-accent);
}

/* ── Pagination ── */
html[data-theme="dark"] .ptr-page-btn {
  background: var(--cv-bg-raised) !important;
  border-color: #333;
}
html[data-theme="dark"] .ptr-page-btn:hover {
  background: rgba(167,139,250,0.10) !important;
  border-color: var(--ptr-accent);
}
html[data-theme="dark"] .ptr-page-btn.ptr-page-btn--active {
  background: var(--ptr-accent) !important;
  border-color: var(--ptr-accent);
}
html[data-theme="dark"] .ptr-pagination {
  background: transparent !important;
}

/* ── Progress Bars ── */
html[data-theme="dark"] .ptr-progress-bar {
  background: #333 !important;
}
html[data-theme="dark"] .ptr-progress-fill {
  background: linear-gradient(90deg, var(--ptr-accent), #22c55e) !important;
}

/* ── SLA dark ── */
html[data-theme="dark"] .ptr-sla--met      { background: rgba(52,211,153,0.12) !important; }
html[data-theme="dark"] .ptr-sla--breached  { background: rgba(248,113,113,0.12) !important; }
html[data-theme="dark"] .ptr-sla--nearing   { background: rgba(251,191,36,0.12) !important; }

/* ── Skeleton dark ── */
html[data-theme="dark"] .ptr-skeleton {
  background: linear-gradient(90deg, #333 25%, #404040 50%, #333 75%) !important;
  background-size: 200% 100%;
}

/* ── Content wrappers — transparent so page gradient shows ── */
html[data-theme="dark"] .ptr-content,
html[data-theme="dark"] .ptr-content-split,
html[data-theme="dark"] .ptr-sidebar {
  background: transparent !important;
}

/* ── Back link, hero sub-elements ── */
html[data-theme="dark"] .ptr-hero-back {
  background: transparent !important;
}

/* ── Section titles ── */
html[data-theme="dark"] .ptr-section-title {
  background: transparent !important;
}

/* ── Cell title spans ── */
html[data-theme="dark"] .ptr-cell-title {
  background: transparent !important;
}