/* ==========================================================================
   Villa-Fassung des Kalenders
   --------------------------------------------------------------------------
   Angelegt 10.09.2026, Sitzung 0e1164b4.

   kalender.css stammt unveraendert aus der Praxis Ragnitz. Diese Datei
   laedt DANACH und passt ihn an die Villa an. Sie wird nicht mit dem
   Original vermischt, damit eine spaetere neue Fassung von dort einfach
   darueber kopiert werden kann.

   ⚠️ WAS DIESE DATEI WIRKLICH TUT, gemessen und korrigiert
   Ein Erkundungsbericht behauptete, ohne diesen Block sei der Kalender
   "farblos, und zwar ohne Fehlermeldung". Das ist NICHT wahr. Gemessen am
   10.09.2026: kalender.css benutzt vierzehn fremde Variablen, aber
   ALLE 86 Verwendungen tragen einen Rueckfallwert, Form var(--forest,
   #2A4A38). Null Verwendungen ohne. Ohne diese Datei waere der Kalender
   also nicht farblos, sondern vollstaendig GRUEN, in den Farben der
   Praxis Ragnitz, mitten in Eriks burgundfarbenem Panel.
   Diese Datei macht ihn burgund. Sie rettet ihn nicht vor Farblosigkeit.

   ⚠️ WARUM NICHT :root
   Die vierzehn Namen sind sehr allgemein: --text, --white, --line, --gold.
   Global gesetzt wuerden sie jede kuenftige fremde Regel im Panel treffen,
   die zufaellig denselben Namen benutzt. Gemessen benutzt sie heute
   niemand ausser kalender.css selbst, aber das kann sich aendern. Deshalb
   gelten sie nur auf den drei Wurzeln des Kalenders. CSS-Variablen
   vererben sich nach unten, das genuegt.

   Die drei Wurzeln, gemessen in kalender.js:
     .kal-modal        Zeile 146, haengt an document.body
     .kal-fahne        Zeile 632, haengt an document.body
     .kal-feld-huelle  Zeile 913, umschliesst jedes Datumsfeld
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Die vierzehn Variablen. Ragnitz ist gruen und creme, die Villa ist
   burgund und gold. Es sind also KEINE uebernommenen Werte, sondern eine
   Abbildung auf die Marke. Die Namen sind vorgegeben, sie stehen so in
   kalender.css und duerfen nicht umbenannt werden.
   -------------------------------------------------------------------------- */
.kal-modal,
.kal-fahne,
.kal-feld-huelle {
  --cream:       #F8F2E4;   /* Grundton der Flaeche      (vr-creme)        */
  --cream-soft:  #EFE6D2;   /* leicht abgesetzt          (vr-creme-tief)   */
  --ease:        cubic-bezier(0.22, 1, 0.36, 1);
  --forest:      #6E1A24;   /* Hauptfarbe, war gruen     (vr-burgund)      */
  --forest-ink:  #4A0E18;   /* dunkelste Fassung         (vr-burgund-tief) */
  --gold:        #B8924A;   /* Akzent                    (vr-gold)         */
  --line:        #E8DDC4;   /* feine Linie               (vr-linie-soft)   */
  --line-strong: #C9B998;   /* kraeftige Linie           (vr-linie)        */
  --muted:       #6B5E50;   /* Nebentext                 (vr-text-muted)   */
  --muted-light: #8A7C6E;   /* noch leiser, abgeleitet                     */
  --sage:        #B8924A;   /* Auswahlfarbe, war salbei  (vr-gold)         */
  --sage-mist:   #F0E4CC;   /* Zeitraumflaeche, hell                       */
  --text:        #1A1410;   /* Fliesstext                (vr-anthrazit)    */
  --white:       #FBF7EE;   /* Blattfarbe                (vr-papier)       */
}

/* --------------------------------------------------------------------------
   2. Ebene. kalender.css setzt 9995 mit der Begruendung, das liege bei
   Ragnitz ueber allem. Im Villa-Panel stimmt das nicht: live-notify.css
   Zeile 89 haelt 100001. Der Kalender laege darunter, also unsichtbar
   hinter der Live-Meldung.
   -------------------------------------------------------------------------- */
.kal-modal {
  z-index: 100050;
}

/* --------------------------------------------------------------------------
   3. Dunkelfassung. Gemessen: kalender.css hat null Treffer fuer
   prefers-color-scheme und data-theme, bei vier Treffern fuer
   prefers-reduced-motion als Gegenprobe. Die Suche greift also, es gibt
   dort wirklich keine dunkle Regel. Das Panel schaltet aber ueber
   html[data-theme="dark"] um, siehe assets/js/dark-mode.js.
   Ohne diesen Block bliebe der Kalender hell in einem dunklen Panel.
   Die Werte folgen demo-patches.css ab Zeile 519.
   -------------------------------------------------------------------------- */
html[data-theme="dark"] .kal-modal,
html[data-theme="dark"] .kal-fahne,
html[data-theme="dark"] .kal-feld-huelle {
  --cream:       #2A2520;
  --cream-soft:  #241F1B;
  --forest:      #C4707C;   /* burgund aufgehellt, sonst unlesbar auf dunkel */
  --forest-ink:  #8E2A36;
  --gold:        #D4B070;
  --line:        #3A332C;
  --line-strong: #4A4035;
  --muted:       #B5A895;
  --muted-light: #9A8D7C;
  --sage:        #D4B070;
  --sage-mist:   #3A322A;
  --text:        #F5EFE0;
  --white:       #1F1A15;
}

/* --------------------------------------------------------------------------
   4. Feldhuelle im Panel. Gemessen: das Datumsfeld hat in den Stildateien
   des Panels fast keine eigene Regel. Der Kalender schiebt es aber in
   .kal-feld-huelle, die dadurch ohne Masse dastuende.
   -------------------------------------------------------------------------- */
.adm-field .kal-feld-huelle {
  display: block;
  width: 100%;
}

.adm-field .kal-feld-huelle input[type="date"] {
  width: 100%;
}

/* 44 Pixel sind Pflicht, nicht Geschmack: darunter trifft den Knopf auf
   dem Handy niemand zuverlaessig. */
.adm-field .kal-feld-knopf {
  min-width: 44px;
  min-height: 44px;
}