/* pressure-monitor.css — Dashboard PressureMonitor (Legacy, bleibt verfuegbar)

   Quelle: extrahiert aus dashboard.css ("PressureMonitor"-Block aus dem
   Legacy-Sammelblock). Inhalt 1:1.

   Konsumenten: web/js/domain/dashboard/pressure-monitor.js — SLA-Druck-
   Monitor mit Sektionen (overdue/warning/success) und Karten-Items.

   Tone via data-tone="overdue|warning|success|info" am .pm-item gesetzt.
   ========================================================================== */

.dash-pressure { display: flex; flex-direction: column; gap: var(--space-3, 12px); }
.pm-section { display: flex; flex-direction: column; gap: var(--space-2, 8px); }
.pm-section-head { display: inline-flex; align-items: center; gap: var(--space-2, 8px); font-size: var(--fs-caption, 13px); }
.pm-section-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; background: var(--color-text-muted); }
.pm-section-dot--overdue { background: var(--status-danger-fg); }
.pm-section-dot--warning { background: var(--status-warning-fg); }
.pm-section-dot--success { background: var(--status-success-fg); }
.pm-section-title { font-weight: var(--fw-semibold, 600); color: var(--color-text-primary); }
.pm-section-count { color: var(--color-text-muted); font-variant-numeric: tabular-nums; }
/* ANF-DB4 SLA-Druck-Monitor Karten an Workspace-Card-Pattern
 angeglichen — eigener Border, dezenter Shadow, Hover-Lift, linke Akzent-
 Border in Tone-Farbe (analog kpi-card--<tone>). Items wirken jetzt wie
 echte Karten statt nur graue Felder. */
.dash-pressure .pm-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--space-3, 12px);
  align-items: center;
  padding: var(--space-2-5) var(--space-3);
  border-radius: var(--radius-md);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--color-border);
  cursor: pointer;
  text-align: left;
  font-family: inherit;
  color: inherit;
  transition: border-color var(--duration-snappy) var(--ease-soft), box-shadow var(--duration-snappy) var(--ease-soft), transform var(--duration-snappy) var(--ease-soft), background var(--duration-snappy) var(--ease-soft);
  box-sizing: border-box;
}
.dash-pressure .pm-item:focus-visible {
  outline: 2px solid var(--lod-turquoise);
  outline-offset: -2px;
}
.dash-pressure .pm-item:hover {
  background: var(--color-surface);
  box-shadow: 0 2px 10px color-mix(in srgb, var(--lod-darkblue-900) 8%, transparent);
  transform: translateY(-1px);
  border-color: var(--lod-darkblue-300);
}
.dash-pressure .pm-item:active { transform: translateY(0); }
/* Tone-Akzent — folgt der Section (overdue/warning/success), wird als
   data-Attribut vom pressure-monitor-Modul gesetzt. */
.dash-pressure .pm-item[data-tone="overdue"] { border-left-color: var(--status-danger-fg); }
.dash-pressure .pm-item[data-tone="warning"] { border-left-color: var(--status-warning-fg); }
.dash-pressure .pm-item[data-tone="success"] { border-left-color: var(--status-success-fg); }
.dash-pressure .pm-item[data-tone="info"]    { border-left-color: var(--brand-default); }
.pm-item-text { display: flex; flex-direction: column; gap: var(--space-xxs); min-width: 0; }
.pm-item-title { font-size: var(--fs-caption, 13px); font-weight: var(--fw-semibold, 600); color: var(--color-text-primary); }
.pm-item-badges { display: inline-flex; gap: var(--space-1, 4px); flex-wrap: wrap; }
.pm-item-meta { font-size: var(--font-size-xs, 12px); color: var(--color-text-muted); display: inline-flex; align-items: center; flex-wrap: wrap; gap: var(--space-1-5); }
.pm-meta-avatar { display: inline-flex; align-items: center; flex-shrink: 0; }
.pm-meta-avatar img,
.pm-meta-avatar .avatar { width: 16px !important; height: 16px !important; border-radius: 50%; }
.pm-meta-name { font-weight: 500; color: var(--lod-darkblue); }
.pm-meta-sep { color: var(--lod-gray-400); }
.pm-meta-tasks { display: inline-flex; align-items: center; gap: 3px; font-variant-numeric: tabular-nums; }
.pm-meta-tasks img { opacity: 0.6; }
.pm-badge { display: inline-block; padding: var(--space-px) var(--space-2, 8px); border-radius: var(--radius-circular); font-size: var(--font-size-xs, 12px); background: var(--color-surface); border: 1px solid var(--color-border); color: var(--color-text-secondary); }
.pm-badge--overdue { background: var(--status-danger-bg); color: var(--status-danger-fg); border-color: transparent; }
.pm-badge--warning { background: var(--status-warning-bg); color: var(--status-warning-fg); border-color: transparent; }
.pm-badge--info { background: var(--status-info-bg); color: var(--status-info-fg); border-color: transparent; }
.pm-item-value { font-size: var(--fs-caption, 13px); font-weight: var(--fw-semibold, 600); font-variant-numeric: tabular-nums; }
.pm-item-value--overdue { color: var(--status-danger-fg); }
.pm-item-value--warning { color: var(--status-warning-fg); }