/* ============================================================
   EINKAUF-DASHBOARD – Ergänzungen zu assets/dashboard-bausteine.css
   ============================================================ */
.ekd-zahl { display: inline-block; min-width: 22px; padding: 0 7px; margin-left: 4px; border-radius: 10px; font-size: 12px; line-height: 20px;
  text-align: center; background: color-mix(in srgb, var(--accent-dark) 14%, transparent); color: var(--accent-dark); }
.ekd-zahl.is-rot { background: color-mix(in srgb, var(--danger) 14%, transparent); color: var(--danger); }
.ekd-datum { width: 38px; flex: none; display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 3px 0; border-radius: 8px; background: color-mix(in srgb, var(--accent-dark) 12%, transparent); color: var(--accent-dark); line-height: 1.1; }
.ekd-datum b { font-size: 16px; }
.ekd-datum small { font-size: 10px; text-transform: uppercase; }
.ekd-datum.is-rot { background: color-mix(in srgb, var(--danger) 12%, transparent); color: var(--danger); }
.ekd-wert { display: flex; flex-direction: column; margin-bottom: 14px; }
.ekd-wert b { font-size: 30px; font-variant-numeric: tabular-nums; color: var(--ink); }
.ekd-wert span { font-size: 12px; color: var(--ink-soft); }
.ekd-lager { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 8px; }
.ekd-lager a { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--paper); text-decoration: none; color: var(--ink); }
.ekd-lager a:hover { border-color: var(--accent-dark); }
.ekd-lager b { font-size: 20px; font-variant-numeric: tabular-nums; }
.ekd-lager small { font-size: 12px; color: var(--ink-soft); }
.ekd-lager a.is-rot b { color: var(--danger); }
.ekd-lager a.is-warn b { color: var(--pal-kupfer-dunkel, #b0612b); }
.ekd-spur { display: block; height: 6px; margin-top: 4px; border-radius: 4px; background: var(--surface); overflow: hidden; }
.ekd-spur > span { display: block; height: 100%; background: var(--accent-dark); }
@media (max-width: 700px) { .ekd-lager { grid-template-columns: 1fr 1fr; } }