/**
 * idf-date-picker — Styles fuer den eigenen Datums-Picker.
 * Popup wird per JS an document.body gehaengt und fixed positioniert.
 * Nutzt die Design-Tokens (:root aus design-tokens/idf-tokens.css).
 *
 * Audit L5/#201 (L-E8): --line/--mid-Fallbacks auf die exakten Token-Werte
 * normalisiert (Regel 17) + Phantom --bg-soft (nirgends definiert, Fallback
 * renderte immer) zu den Ist-Werten aufgeloest; alles render-identisch.
 */

.idf-dp-popup {
  position: fixed;
  z-index: 100000;                       /* ueber Listen/Modals */
  background: var(--white, #fff);
  border: 1px solid var(--line, #e5e5e5);
  border-radius: 10px;
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.18);
  padding: 10px;
  font-family: inherit;
  font-size: 13px;
  color: var(--ink, #111);
  user-select: none;
}

.idf-dp-nav {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
}
.idf-dp-nav button {
  font: inherit;
  border: 1px solid var(--line, #e5e5e5);
  background: var(--white, #fff);
  border-radius: 6px;
  padding: 4px 10px;
  cursor: pointer;
  color: var(--ink, #111);
  transition: background 120ms ease;
}
.idf-dp-nav button:hover { background: #f4f4f4; } /* kein Token-Aequivalent; Phantom --bg-soft aufgeloest, Audit L5/#201 */
.idf-dp-prev, .idf-dp-next { font-size: 17px; line-height: 1; padding: 2px 9px; }
.idf-dp-today { margin-left: auto; }     /* schiebt Heute + Kein-Datum + Vor nach rechts */

.idf-dp-months { display: flex; gap: 14px; }

.idf-dp-month-head {
  text-align: center;
  font-weight: 600;
  margin-bottom: 6px;
  white-space: nowrap;
}
.idf-dp-grid {
  display: grid;
  grid-template-columns: repeat(7, 28px);
  gap: 2px;
}
.idf-dp-dow {
  text-align: center;
  font-size: 11px;
  color: var(--mid, #555555);
  height: 20px;
  line-height: 20px;
}
.idf-dp-empty { height: 28px; }
.idf-dp-day {
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
  font: inherit;
  color: var(--ink, #111);
  transition: background 100ms ease;
}
.idf-dp-day:hover { background: #f0f0f0; } /* kein Token-Aequivalent; Phantom --bg-soft aufgeloest (2. Ist-Wert im File), Audit L5/#201 */
.idf-dp-day.is-today { box-shadow: inset 0 0 0 1.5px var(--accent, #167ea0); }
.idf-dp-day.is-selected,
.idf-dp-day.is-selected:hover {
  background: var(--primary, #c8134b);
  color: #fff;
  font-weight: 600;
}