/* =============================================================================
   HotelSystem WebApp — colori di ogni hotel
   -----------------------------------------------------------------------------
   Dopo l'accesso <html data-hotel="..."> prende il codice dell'hotel scelto
   (config.json, "alberghi") e qui sotto cambiano le variabili della palette:
   menu a sinistra, pulsanti, titoli, evidenze, planning. Così si vede sempre in
   quale hotel si sta lavorando. La maschera di accesso (scelta dell'hotel)
   resta con i colori DicoHotels di app.css.

   Per ogni hotel, partendo dal colore di base:
     --oro             colore di base (bordi attivi, evidenze, linea in alto)
     --oro-chiaro      più chiaro: nome HotelSystem nel menu, testi su fondo scuro
     --oro-pallido     tinta pallidissima: testi del menu, riquadri leggeri
     --borgogna-scuro  scuro: fondo del menu e del planning
     --borgogna        intermedio: pulsanti principali, titoli, voce attiva
                       (abbastanza scuro da reggere il testo bianco)
     --crema --avorio --bordo  fondo della pagina e righe, appena colorati
   Per cambiare un hotel basta toccare il suo blocco.
   ============================================================================= */

/* Hotel Royal Terme — base #b49013 (oro) */
html[data-hotel="ROYAL"] {
  --oro: #b49013;
  --oro-chiaro: #e3c55a;
  --oro-pallido: #f6ecc6;
  --borgogna-scuro: #3d3007;
  --borgogna: #6e5a0c;
  --crema: #fbf8ef;
  --avorio: #f3ecd6;
  --bordo: #ddd2b0;
  --hotel-tinta: rgba(180, 144, 19, .16);
}

/* Hotel San Giovanni Terme — base #468d71 (verde) */
html[data-hotel="SANGIOVANNI"] {
  --oro: #468d71;
  --oro-chiaro: #8fd1b5;
  --oro-pallido: #e2f2eb;
  --borgogna-scuro: #1d3c30;
  --borgogna: #2f6650;
  --crema: #f4f9f6;
  --avorio: #e3efe9;
  --bordo: #c6dcd1;
  --hotel-tinta: rgba(70, 141, 113, .16);
}

/* Hotel Parco Aurora — base #68d3e8 (azzurro) */
html[data-hotel="AURORA"] {
  --oro: #68d3e8;
  --oro-chiaro: #a8e8f4;
  --oro-pallido: #e0f6fb;
  --borgogna-scuro: #0f4450;
  --borgogna: #1c6f80;
  --crema: #f3fafc;
  --avorio: #e0f3f7;
  --bordo: #c3e3ea;
  --hotel-tinta: rgba(104, 211, 232, .2);
}

/* La Villarosa — base #f58ae1 (rosa) */
html[data-hotel="VILLAROSA"] {
  --oro: #f58ae1;
  --oro-chiaro: #fbc0ef;
  --oro-pallido: #fde6f8;
  --borgogna-scuro: #5a1650;
  --borgogna: #8e2a7d;
  --crema: #fdf5fb;
  --avorio: #f8e3f3;
  --bordo: #ecc9e5;
  --hotel-tinta: rgba(245, 138, 225, .2);
}

/* ---- dettagli che in app.css hanno l'oro DicoHotels scritto in chiaro ---- */
html[data-hotel] .rail { border-top: 6px solid var(--oro); }
html[data-hotel] .marchio { border-bottom-color: color-mix(in srgb, var(--oro) 45%, transparent); }
html[data-hotel] .area { border-bottom-color: color-mix(in srgb, var(--oro) 22%, transparent); }
html[data-hotel] .area-titolo:hover { background: color-mix(in srgb, var(--borgogna) 60%, transparent); }
html[data-hotel] .btn-esci { border-color: color-mix(in srgb, var(--oro) 55%, transparent); color: var(--oro-pallido); }
html[data-hotel] .btn-esci:hover { background: color-mix(in srgb, var(--oro) 18%, transparent); }
html[data-hotel] .pl-angolo, html[data-hotel] .pl-camere { border-right-color: color-mix(in srgb, var(--oro) 40%, transparent); }
html[data-hotel] .pl-cam { border-bottom-color: color-mix(in srgb, var(--oro) 20%, transparent); }
html[data-hotel] .pl-col.oggi { background: var(--hotel-tinta); }

/* nome dell'hotel nel menu: in evidenza, con il pallino del suo colore */
html[data-hotel] .marchio-hotel {
  display: flex; align-items: center; gap: 7px;
  font-size: 14px; font-weight: 600; color: var(--oro-chiaro); margin-top: 6px;
}
html[data-hotel] .marchio-hotel::before {
  content: ""; width: 10px; height: 10px; border-radius: 50%; flex: none;
  background: var(--oro); box-shadow: 0 0 0 2px color-mix(in srgb, var(--oro-pallido) 40%, transparent);
}

/* ---- credits ---- */
.credits { font-size: 11.5px; line-height: 1.4; color: var(--testo-muted); text-align: center; }
.credits b { font-weight: 600; }
.rail .credits {
  margin: 22px 22px 0; padding-top: 14px; text-align: left;
  border-top: 1px solid color-mix(in srgb, var(--oro) 30%, transparent);
  color: color-mix(in srgb, var(--oro-pallido) 70%, transparent);
}
.login-box .credits { margin-top: 4px; }