/* ==========================================================================
   events.save-europe-act.eu: Gancio im Stil des Apex-Anmeldebildschirms
   ==========================================================================
   Ansage Cedric, 31.08.2026: "kannst du nicht was drueber bauen die seite
   events.save-europe-act.eu css anpassen?"

   ES BRAUCHT KEINEN AUFSATZ. Gancio kennt eine Einstellung 'custom_css'
   (am 31.08.2026 im ausgelieferten Buendel nachgesehen, /home/node/.nuxt/
   dist/server/admin.js). Sie wird in die Seite geschrieben und braucht
   keinen Neustart. Gesetzt wird sie so:

       sudo docker cp lab/brand/gancio-custom.css \
            sealab-gancio-1:/tmp/gancio.css
       sudo docker exec sealab-gancio-1 sh -c \
            'gancio settings set custom_css "$(cat /tmp/gancio.css)"'

   Zurueck geht es mit einem leeren Wert.

   DIE FARBEN SIND DIE DES ANMELDEBILDSCHIRMS, nicht neu erfunden: sie
   stehen in verwaltung/static/sea.css unter 'body.mystisch'. Wer sie dort
   aendert, aendert sie hier mit der Hand nach: die beiden Dateien liegen auf
   verschiedenen Maschinen und in verschiedenen Anwendungen, eine gemeinsame
   Quelle gaebe es nur um den Preis eines Bauschritts.

   GANCIO IST VUETIFY 2. Deshalb die vielen !important: die Klassen des
   Designsystems tragen ihre Farben inline im Buendel, und ein hoeflicher
   Selektor verliert gegen sie. Getroffen wird bewusst nur Farbe, Schrift
   und Kante, NIE Groesse oder Anordnung: alles andere waere ein Umbau, den
   die naechste Gancio-Fassung still zerlegt.
   ========================================================================== */

/* --- Die Hausschrift ---------------------------------------------------
   Sie liegt auf DEMSELBEN Host (Caddy reicht /brand/* aus lab/brand aus),
   also kein CORS und kein zweiter Ursprung. Die Datei ist eine variable
   Schrift, ein Schnitt deckt 200 bis 800 ab. */
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('/brand/schrift/PlusJakartaSans.woff2') format('woff2');
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

/* --- Grund und Schrift -------------------------------------------------- */
.v-application {
  background: #04070d !important;
  color: #e8eef8 !important;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif !important;
}

.v-application .v-main,
.v-application .v-main__wrap {
  background: transparent !important;
}

/* --- Flaechen: Karten, Leisten, Fusszeile ------------------------------- */
.v-application .theme--dark.v-sheet,
.v-application .theme--dark.v-card,
.v-application .theme--dark.v-toolbar,
.v-application .theme--dark.v-app-bar,
.v-application .theme--dark.v-footer,
.v-application .theme--dark.v-list,
.v-application .theme--dark.v-menu__content {
  background: #0a1018 !important;
  color: #e8eef8 !important;
  border-color: #1a2433 !important;
}

.v-application .v-card,
.v-application .v-sheet--outlined {
  border: 1px solid #1a2433 !important;
  border-radius: 12px !important;
}

/* --- Der Akzent: Gancios Orange faellt, Teal kommt ---------------------- */
.v-application .primary--text,
.v-application a,
.v-application .v-btn--text .v-btn__content,
.v-application .v-icon.primary--text {
  color: #6fdccb !important;
  caret-color: #6fdccb !important;
}

.v-application .primary,
.v-application .v-btn.primary,
.v-application .v-progress-circular__overlay,
.v-application .v-tabs-slider {
  background-color: #1b8074 !important;
  border-color: #1b8074 !important;
  color: #ffffff !important;
}

/* Der Schriftzug oben: er traegt Gancios Orange als eigene Regel. */
.v-application h1,
.v-application .display-1,
.v-application .display-2 {
  color: #e8eef8 !important;
  font-weight: 700 !important;
  letter-spacing: -.01em !important;
}

/* --- Der Kalender: heute, ausgewaehlt, Tage mit Termin ------------------ */
.v-application .v-date-picker-table .v-btn.v-btn--active,
.v-application .v-date-picker-table .v-btn--outlined {
  background-color: #1b8074 !important;
  border-color: #6fdccb !important;
  color: #ffffff !important;
}

.v-application .v-date-picker-table th,
.v-application .v-date-picker-header {
  color: #6fdccb !important;
}

/* --- Eingabefelder ------------------------------------------------------ */
.v-application .theme--dark.v-text-field > .v-input__control > .v-input__slot,
.v-application .theme--dark.v-input input {
  background: #0d141e !important;
  color: #e8eef8 !important;
}

.v-application .theme--dark.v-text-field > .v-input__control
  > .v-input__slot::before {
  border-color: #1a2433 !important;
}

.v-application .v-label,
.v-application input::placeholder {
  color: #4a5769 !important;
}

/* --- Nebensaechliches leiser: Fusszeile, Fassungsnummer ----------------- */
.v-application .v-footer,
.v-application .v-footer a {
  color: #4a5769 !important;
  border-top: 1px solid #1a2433 !important;
}

/* --- Der dunkle Hintergrund hinter dem Kopf ----------------------------
   Gancio legt dort ein eigenes Bild ab. Es passt nicht zu uns und ist
   ausserdem so dunkel, dass es nur als Grauschleier wirkt. Weg damit und
   stattdessen derselbe Schimmer wie auf der Anmeldeseite: zwei sehr weiche
   Farbschleier, kein Bild, keine Ladezeit. */
/* NUR IM KOPF, und das ist wichtig: '.v-image__image' ist Vuetifys
   ALLGEMEINE Bildklasse. Ohne den Kopf davor traefe die Regel auch die
   Titelbilder der Termine und ersetzte sie durch diesen Verlauf. Beim
   ersten Anlauf am 31.08.2026 stand sie ungebunden da. */
.v-application header .v-image__image,
.v-application header .v-responsive__content {
  background-image:
    radial-gradient(60% 80% at 20% 0%, rgba(34, 160, 148, .22), transparent 70%),
    radial-gradient(50% 70% at 80% 10%, rgba(38, 70, 140, .20), transparent 70%)
    !important;
  filter: none !important;
  opacity: 1 !important;
}