/* ════════════════════════════════════════════════════════════════════════
   sh-list-polish.css — App-weite Listen-Konsistenz (alle Breiten). Additiv,
   kein Token-Eingriff, kein Backend/Restart. Lädt nach dem Theme.

   Ziel: 11 schlichte .table-Tabellen sehen aus wie die 112 .data-table-Listen,
   und die 128 schlichten „Keine …"-Leermeldungen wirken wie ein bewusster,
   ruhiger Leerzustand statt linksbündigem Kleingedruckten — systemisch per
   CSS statt 128 fragiler Einzel-Edits. (Friendly-Icons gibt es bewusst NICHT
   automatisch, da dieselbe Markup-Form auch für „Lade …"-Platzhalter genutzt
   wird — ein Briefkasten-Icon dort wäre falsch.)
   ════════════════════════════════════════════════════════════════════════ */

/* 1) Schlichte .table (ohne .data-table) an den .data-table-Look angleichen. */
.panel table.table:not(.data-table) { width: 100%; border-collapse: collapse; }
.panel table.table:not(.data-table) > thead > tr > th {
  text-align: left;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: var(--elmetic-text-soft, #6b7280);
  padding: 10px 14px;
  background: var(--elmetic-bg-soft, #f8fafc);
  border-bottom: 1px solid var(--elmetic-border, #e5e7eb);
}
.panel table.table:not(.data-table) > tbody > tr > td {
  padding: 11px 14px;
  font-size: 14px;
  border-bottom: 1px solid var(--elmetic-border-soft, #f0f2f5);
}
.panel table.table:not(.data-table) > tbody > tr { transition: background .1s; }
.panel table.table:not(.data-table) > tbody > tr:hover { background: var(--elmetic-surface, #f0efef); }

/* 2) Schlichte Leer-/Platzhalter-Zellen (colspan + .muted) als ruhiger,
      zentrierter Leerzustand — gilt für .data-table UND .table. */
.data-table td.muted[colspan],
.panel table.table td.muted[colspan] {
  text-align: center;
  padding: 30px 16px;
  color: var(--elmetic-text-soft, #6b7280);
  font-size: 13.5px;
  line-height: 1.5;
}

/* 3) Toolbars über Listen einheitlich ausrichten (Selects/Buttons gleiche Höhe). */
.filter-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* 4) Der schöne .sh-empty-state-Block (14 Stellen) bekommt etwas mehr Ruhe. */
.sh-empty-state { padding: 34px 18px; }

/* ════════════════════════════════════════════════════════════════════════
   Slice 3 — Odoo Form-Sheet-Feel auf Detailseiten.
   Nur detail-spezifische Feld-Container (.sales-grid/.sales-card/.form-grid),
   NICHT in Listen verwendet → kein Bleed auf Listenansichten. Rein additiv.
   Idee: Karten-/Feld-Titel werden zu ruhigen Uppercase-Labels, Werte gut
   lesbar — die typische Odoo-Form-Sheet-Hierarchie (Label oben, Wert darunter).
   ════════════════════════════════════════════════════════════════════════ */

/* Feld-Karten (Detail-Meta): ruhiger Rahmen statt Schatten, klare Radien. */
.sales-card {
  border: 1px solid var(--elmetic-border, #e8ebf0);
  border-radius: 10px;
  background: var(--elmetic-card, #fff);
  box-shadow: none;
}
/* Karten-Titel → Odoo-Feldlabel (klein, Uppercase, gedämpft). */
.sales-card h3 {
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 11px;
  font-weight: 700;
  font-style: normal;
  color: var(--elmetic-text-soft, #6b7280);
  margin: 0 0 6px;
}
.sales-card p { font-size: 14px; line-height: 1.45; }
.sales-card p strong { font-weight: 600; }

/* Kopf-Felder (.form-grid mit <p><span class="muted">Label</span><br>Wert) */
.form-grid > p { margin: 0 0 12px; font-size: 14px; line-height: 1.45; }
.form-grid > p > .muted,
.form-grid > p .muted:first-child {
  display: inline-block;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 11px;
  font-weight: 700;
  font-style: normal;
  color: var(--elmetic-text-soft, #6b7280);
  margin-bottom: 2px;
}

/* Detail-Karten-Grid etwas luftiger (Odoo-Sheet atmet mehr). */
.sales-grid { gap: 14px; }

/* ════════════════════════════════════════════════════════════════════════
   Per-Modul-Akzent — jedes Modul bekommt eine dezente eigene Farbe am
   Seiten-Header (Akzentbalken links). ELMETIC-Rot bleibt für Buttons/Aktionen.
   `data-sh-module` wird in navigate() aus getModuleKeyForView() gesetzt.
   ════════════════════════════════════════════════════════════════════════ */
body { --sh-module-accent: var(--elmetic-red, #e73d25); }
body[data-sh-module="quotes"]                                   { --sh-module-accent: #2563eb; }
body[data-sh-module="orders"]                                   { --sh-module-accent: #e73d25; }
body[data-sh-module="dispatch"],
body[data-sh-module="disposition"],
body[data-sh-module="appointments"],
body[data-sh-module="service"]                                  { --sh-module-accent: #0284c7; }
body[data-sh-module="invoices"],
body[data-sh-module="rechnungen"],
body[data-sh-module="finance"],
body[data-sh-module="receipt"]                                  { --sh-module-accent: #059669; }
body[data-sh-module="crm"]                                      { --sh-module-accent: #7c3aed; }
body[data-sh-module="customers"]                                { --sh-module-accent: #0891b2; }
body[data-sh-module="projects"]                                 { --sh-module-accent: #0d9488; }
body[data-sh-module="assets"]                                   { --sh-module-accent: #4f46e5; }
body[data-sh-module="purchasing"],
body[data-sh-module="inventory"],
body[data-sh-module="suppliers"],
body[data-sh-module="supplier_invoices"]                        { --sh-module-accent: #d97706; }
body[data-sh-module="support"]                                  { --sh-module-accent: #db2777; }
body[data-sh-module="time_tracking"],
body[data-sh-module="zeiterfassung"]                            { --sh-module-accent: #ca8a04; }
body[data-sh-module="documents"],
body[data-sh-module="reports"]                                  { --sh-module-accent: #64748b; }
body[data-sh-module="administration"],
body[data-sh-module="users"],
body[data-sh-module="operations"],
body[data-sh-module="settings"]                                 { --sh-module-accent: #475569; }
body[data-sh-module="builder_support"]                          { --sh-module-accent: #9333ea; }

/* Anwendung: kräftiger Modul-Akzent am Seiten-Header — dicker Balken + zarter
   Farb-Wash (color-mix; fällt graceful weg, falls nicht unterstützt). Buttons
   bleiben ELMETIC-rot. */
.page-header,
.sh-header {
  border-left: 6px solid var(--sh-module-accent, var(--elmetic-red, #e73d25));
  padding: 8px 14px 8px 16px;
  border-radius: 8px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--sh-module-accent, #e73d25) 14%, transparent), color-mix(in srgb, var(--sh-module-accent, #e73d25) 3%, transparent) 50%, transparent 78%);
}
.page-header h1,
.sh-header h1 { position: relative; }
/* Aktiver Sidebar-Nav-Eintrag bekommt die Modulfarbe als Indikator. */
.nav-item.active { box-shadow: inset 3px 0 0 0 var(--sh-module-accent, var(--elmetic-red, #e73d25)); }

/* „✨ KI"-Button im Seiten-Header — dezent in Modulfarbe, öffnet den Copilot.
   .btn.sh-ki-btn (0,2,0) schlägt die .btn.btn-ghost-Grundfarbe. */
.btn.sh-ki-btn { color: var(--sh-module-accent, var(--elmetic-red, #e73d25)); font-weight: 600; }
.btn.sh-ki-btn:hover { background: color-mix(in srgb, var(--sh-module-accent, #e73d25) 10%, transparent); }

/* ════════════════════════════════════════════════════════════════════════
   Kalender-Raster (Einsatz-Kalender) — echtes Monats-/Wochen-Grid statt Liste.
   Events + Heute-Rahmen nutzen die Per-Modul-Akzentfarbe (--sh-module-accent).
   ════════════════════════════════════════════════════════════════════════ */
.sh-cal-toolbar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.sh-cal-nav { display: flex; gap: 4px; }
.sh-cal-title { font-size: 16px; font-weight: 700; min-width: 180px; color: var(--elmetic-text, #111827); }
.sh-cal-controls { margin-left: auto; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.sh-cal__dows { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; margin-bottom: 6px; }
.sh-cal__dow { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; color: var(--elmetic-text-soft, #6b7280); padding-left: 6px; }
.sh-cal__cells { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.sh-cal__cell { background: var(--elmetic-card, #fff); border: 1px solid var(--elmetic-border, #e3e6ea); border-radius: 8px; padding: 6px; display: flex; flex-direction: column; gap: 4px; overflow: hidden; }
.sh-cal--month .sh-cal__cell { min-height: 104px; }
.sh-cal--week .sh-cal__cell { min-height: 340px; }
.sh-cal__cell.is-out { background: var(--elmetic-bg-soft, #f1f5f9); opacity: .55; }
.sh-cal__cell.is-today { border-color: var(--sh-module-accent, #e73d25); box-shadow: inset 0 0 0 1px var(--sh-module-accent, #e73d25); }
.sh-cal__num { font-size: 12px; font-weight: 600; color: var(--elmetic-text, #111827); }
.sh-cal__cell.is-today .sh-cal__num { color: var(--sh-module-accent, #e73d25); }
.sh-cal__evs { display: flex; flex-direction: column; gap: 3px; overflow: hidden; }
.sh-cal__ev { display: block; font-size: 11.5px; line-height: 1.3; padding: 2px 6px; border-radius: 5px; background: #eef4fb; color: var(--elmetic-text, #111827); border-left: 3px solid var(--sh-module-accent, #0284c7); text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sh-cal__ev:hover { filter: brightness(0.97); }
.sh-cal__ev-t { font-weight: 600; }
.sh-cal__more { font-size: 10.5px; color: var(--elmetic-text-soft, #6b7280); padding-left: 6px; }
.sh-cal-daylist { display: flex; flex-direction: column; gap: 8px; }
.sh-cal-daylist .sh-cal__ev { white-space: normal; padding: 8px 12px; font-size: 13.5px; }
.sh-cal-empty { padding: 28px 16px; text-align: center; color: var(--elmetic-text-soft, #6b7280); }
@media (max-width: 768px) {
  .sh-cal--month .sh-cal__cell { min-height: 62px; padding: 4px; }
  .sh-cal--month .sh-cal__ev { font-size: 0; padding: 3px; border-left-width: 0; border-radius: 50%; height: 6px; width: 6px; display: inline-block; }
  .sh-cal--month .sh-cal__ev-t { display: none; }
  .sh-cal--month .sh-cal__evs { flex-direction: row; flex-wrap: wrap; gap: 2px; }
  .sh-cal--week .sh-cal__cells { grid-template-columns: 1fr; }
  .sh-cal--week .sh-cal__cell { min-height: auto; }
  .sh-cal-title { min-width: 0; font-size: 15px; }
  .sh-cal-controls { margin-left: 0; width: 100%; }
}