/* Auftritt New Delhi Restaurant (newdelhi-admin.tuantrungngo.com), 06.11.2026.
   Wird nach styles.css geladen und stellt nur um, was die Marke trägt: Farben, das Logo, das Markenfeld der
   Anmeldung und die Hinweisleiste in der Vorschau (Reiter „Hinweis“). Werte von seiner fertigen Vorschau auf Entwurf 04
   „Feuer & Gewürz“ (homepage-heroes/clients/new-delhi-dresden, Datei 05-feuer.html): Nacht #120d0a und Tinte #1a130f
   (Flächen), Gold #d4922f (Akzente der Seite), dazu das Rot seines Schilds #e10008 (Logo, Knöpfe, Akzent). Sein Logo IST
   der Name (rotes Schild mit „NEW DELHI Restaurant“), deshalb steht der Name nicht noch einmal als Text daneben.
   Eingeklappte Seitenleiste: zeichen.png, das Schild auf rotem Grund (wie das App-Symbol). */

:root {
  /* Akzent: aktive Reiter, Verweise, Fokus, Schalter (etwas dunkler als das Schild, damit Schrift auf Weiß lesbar bleibt) */
  --brand-600: #c8000a;
  --brand-500: #e10008;
  --brand-50: #fdeced;
  /* dunkle Flächen: Knöpfe, Avatar, Speicherleiste, in den Brauntönen der Seite */
  --navy-950: #0d0907;
  --navy-900: #1a130f;
  --navy-800: #241a14;
  --navy-700: #2f231b;
  --navy-600: #3d2e24;
  --auftritt-rot: #e10008;
  --auftritt-gold: #d4922f;
  /* Hinweisleiste der Webseite: rot mit weißer Schrift wie sein Schild */
  --wh-leiste-grund: #e10008;
  --wh-leiste-text: #fff;
}
/* Im Dunkelmodus muss der Akzent hell sein, sonst verschwindet er auf dunklem Grund */
.dark {
  --brand-600: #ff6b63;
  --brand-500: #ff8f88;
  --brand-50: #3a1210;
}

/* ------------------------------------------------------- Seitenleiste
   Oben das Schild, darunter klein „Dashboard“. Eingeklappt nur das quadratische Zeichen. */
.marke { flex-direction: column; align-items: flex-start; gap: .375rem; }
.marke-bild { height: 2.25rem; width: auto; }
.marke-text .marke-name.auftritt-name { display: none; }
.marke-unter { padding-left: .125rem; letter-spacing: .02em; }
.seitenleiste.zu .marke-bild { display: none; }
.seitenleiste.zu .marke::before {
  content: ""; display: block; width: 2.25rem; height: 2.25rem; border-radius: .5rem;
  background: url("zeichen.png") center / cover no-repeat;
}

/* Logo in der Anmeldung und im Fenster „Eigenes Passwort wählen“: nur das Bild, der Name steht darin */
.hph-logo.auftritt-logo img { height: 3.25rem; width: auto; }
.hph-logo.auftritt-logo .auftritt-wortmarke,
.pw-logo .auftritt-wortmarke { display: none; }
.pw-logo img { height: 2rem; width: auto; }

/* Kacheln und Plaketten, die fest auf Indigo standen */
.t-indigo { background: #fdeced; color: #c8000a; }
.dark .t-indigo { background: rgb(225 0 8 / .2); color: #ff8f88; }
.dark .badge-indigo, .dark .s-geplant, .dark .wahl-knopf.wahl-projekt,
.dark .wahl-eintrag.gewaehlt, .dark .zeit-preset.aktiv { color: #ff8f88; }

/* ------------------------------------------------------- Anmeldung
   Markenfeld dunkel wie die Bühne seiner Seite (Glut vom Tandoor), oben ein roter Streifen, Akzente in Gold. */
.anmeldung-marke {
  color: #f6f0e7;
  border-top: 6px solid var(--auftritt-rot);
  background:
    radial-gradient(70% 55% at 100% 0%, rgb(212 146 47 / .22), transparent 70%),
    linear-gradient(180deg, #1a130f 0%, #120d0a 100%);
}
.anmeldung-oberzeile { color: #e8b25a; }
.anmeldung-titel { color: #f6f0e7; letter-spacing: -.01em; line-height: 1.12; }
.anmeldung-satz, .anmeldung-punkte { color: #d8cdbf; }
.anmeldung-punkte { border-top-color: rgb(255 255 255 / .12); }
.anmeldung-punkte svg { color: #e8b25a; }
.anmeldung-wabe { display: none; }
.anmeldung-formular h1 { color: var(--navy-900); }
.dark .anmeldung-formular h1 { color: #f6f0e7; }

@media (max-width: 760px) {
  .hph-logo.auftritt-logo img { height: 2.75rem; }
}