/* Stiluri proprii, peste tema Vuexy. Se incarca in toate paginile din layout_head. */

/* Clearance-ul navbar-ului FIX (3.5rem) il punem din CSS, nu-l lasam pe seama JS-ului
   Vuexy: pe pagini grele (diagrama), JS-ul aplica padding-ul tarziu, iar cateva cadre
   se picteaza cu tot continutul URCAT sub meniu, apoi „sare" in jos. Cu regula asta,
   spatiul e corect din primul cadru (la fel ca pe paginile usoare, ex. tarife). */
.layout-navbar-fixed:not(.layout-navbar-hidden) .layout-page { padding-block-start: 3.5rem !important; }

/* Banda de metrici: un singur card, segmente despartite de linii fine */
.strip-metrici .metrica {
  padding: 1.5rem 1.75rem;
}
.strip-metrici .eticheta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--bs-secondary-color);
  margin-bottom: 0.75rem;
}
.strip-metrici .eticheta .ic {
  font-size: 1.125rem;
  width: 1.125rem;
  height: 1.125rem;
  color: var(--bs-secondary-color);
  opacity: 0.55;
  flex-shrink: 0;
}
.strip-metrici .valoare {
  font-size: 1.875rem;
  font-weight: 600;
  line-height: 1.15;
  color: var(--bs-heading-color);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.strip-metrici .valoare .separator {
  font-weight: 300;
  color: var(--bs-secondary-color);
  opacity: 0.45;
  font-size: 1.5rem;
  padding: 0 0.375rem;
}
.strip-metrici .detaliu {
  font-size: 0.8125rem;
  color: var(--bs-secondary-color);
  margin-top: 0.5rem;
}

/* Avatarele nu se deformeaza in containere flex (cercul ramane cerc) */
.avatar {
  flex-shrink: 0;
}

/* Selector multiplu cu cautare si bife — pentru liste care pot creste
   (hoteluri, servicii...). Buton care rezuma selectia + panou cu filtru. */
.selector-multiplu .camp-selector {
  cursor: pointer;
}
.selector-multiplu-meniu {
  /* latimea urmareste selectorul, dar NICIODATA mai lata de 22rem —
     in celule/tabele late meniul nu se mai intinde cat pagina */
  width: 100%;
  min-width: 14rem;
  max-width: 22rem;
  padding: 0;
  overflow: hidden;
}

/* combobox pentru numele grupului: input + sugestii (grupurile care au mai
   fost), in stilul selectoarelor cu cautare ale aplicatiei */
.combo-grup { position: relative; }
.combo-grup .combo-lista {
  position: absolute; top: calc(100% + 0.25rem); left: 0; right: 0; z-index: 20;
  background: var(--bs-paper-bg);
  border: 1px solid var(--bs-border-color); border-radius: 0.5rem;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
  padding: 0.25rem; max-height: 15rem; overflow-y: auto;
}
.combo-grup .combo-optiune {
  display: flex; align-items: center; gap: 0.5rem; width: 100%;
  padding: 0.5rem 0.6rem; border: 0; border-radius: 0.4rem;
  background: transparent; text-align: left; color: var(--bs-body-color);
  font-size: 0.88rem; cursor: pointer;
}
.combo-grup .combo-optiune:hover { background: rgba(var(--lux-accent-rgb), 0.12); }
.combo-grup .combo-optiune .icon-base { color: var(--lux-accent); flex-shrink: 0; }

/* selectoarele folosite inline (in tabele, bare de actiuni): latime stransa */
.latime-select {
  min-width: 14rem;
  max-width: 18rem;
  flex: 0 0 auto;
}
.latime-select .selector-cautare {
  width: 100%;
}
.selector-multiplu-meniu .cautare {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.625rem 0.875rem;
  border-bottom: 1px solid var(--bs-border-color);
}
.selector-multiplu-meniu .cautare .icon-base {
  font-size: 1rem;
  width: 1rem;
  height: 1rem;
  color: var(--bs-secondary-color);
  flex-shrink: 0;
}
.selector-multiplu-meniu .cautare input {
  border: 0;
  outline: 0;
  background: transparent;
  width: 100%;
  font-size: 0.875rem;
  color: var(--bs-body-color);
}
.selector-multiplu-meniu .lista {
  max-height: 14rem;
  overflow-y: auto;
  padding: 0.375rem;
}
.selector-multiplu-meniu .element-optiune {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  width: 100%;
  padding: 0.5rem 0.625rem;
  /* butoanele isi aduc chenarul implicit al browserului — il scoatem */
  border: 0;
  background: transparent;
  border-radius: 0.4375rem;
  font-size: 0.875rem;
  color: var(--bs-body-color);
  text-align: left;
  cursor: pointer;
  margin: 0;
}
.selector-multiplu-meniu .element-optiune:hover {
  background: var(--bs-tertiary-bg);
}
.selector-multiplu-meniu .fara-rezultate {
  padding: 0.75rem 0.875rem;
  font-size: 0.85rem;
  color: color-mix(in srgb, var(--bs-body-color) 72%, transparent);
}

/* Select cu cautare, alegere unica (Ui::selectCautare) — reia stilurile de mai sus */
.selector-cautare .camp-selector {
  cursor: pointer;
}
.selector-cautare .optiune-select {
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
.selector-cautare .optiune-select.activa {
  font-weight: 500;
  color: var(--bs-heading-color);
}
.selector-cautare .optiune-select .bifa {
  font-size: 1rem;
  width: 1rem;
  height: 1rem;
  color: var(--bs-primary);
  flex-shrink: 0;
}

/* Filtrele de deasupra tabelelor: aer si sub ele, nu lipite de tabel */
.filtre-tabel {
  padding-bottom: 1.25rem !important;
  border-bottom: 1px solid var(--bs-border-color);
}

/* Filtre in ACORDEON: cand sunt multe, stau pliate intr-un card cu antet
   „Filtre" pe care il deschide utilizatorul (badge = cate sunt active). */
.filtre-card .filtre-antet {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1rem 1.25rem;
  background: transparent;
  border: 0;
  color: inherit;
  cursor: pointer;
}
.filtre-card .filtre-titlu {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 600;
}
.filtre-card .filtre-titlu > .ti { color: var(--lux-accent); font-size: 1.1rem; }
.filtre-card .filtre-chevron { color: var(--bs-secondary-color); transition: transform 0.2s; }
.filtre-card.deschis .filtre-chevron { transform: rotate(180deg); }
.filtre-card .filtre-corp { display: none; border-top: 1px solid var(--bs-border-color); }
.filtre-card.deschis .filtre-corp {
  display: block;
  animation: filtreIntra 0.2s ease;
}
.filtre-card.deschis .filtre-corp .filtre-tabel { border-bottom: 0; padding-top: 1.25rem !important; }
@keyframes filtreIntra {
  from { opacity: 0; transform: translateY(-0.25rem); }
  to { opacity: 1; transform: none; }
}

/* Iconita din titlul cardurilor: plata, gri, discreta, inainte de titlu */
.card-header .ic-titlu {
  font-size: 1.0625rem;
  width: 1.0625rem;
  height: 1.0625rem;
  color: var(--bs-secondary-color);
  opacity: 0.7;
  margin-right: 0.5rem;
  vertical-align: -0.15em;
}

/* Butoanele din bara de sus: familie unitara cu selectorul de hotel */
.buton-bara {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.5rem;
  color: var(--bs-secondary-color);
  padding: 0;
  transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}
.buton-bara .icon-base {
  font-size: 1.125rem;
  width: 1.125rem;
  height: 1.125rem;
}
.buton-bara:hover,
.nav-item.show .buton-bara,
.nav-item.dropdown.show .buton-bara {
  border-color: var(--bs-primary);
  background: var(--bs-primary-bg-subtle);
  color: var(--bs-primary);
}
.buton-bara.accent {
  color: var(--bs-primary);
  border-color: var(--bs-primary-border-subtle, var(--bs-primary));
}
.buton-bara.accent:hover {
  background: var(--bs-primary-bg-subtle);
  border-color: var(--bs-primary);
}
.buton-bara .punct-notificari {
  position: absolute;
  top: -0.35rem;
  right: -0.4rem;
  min-width: 1.1rem;
  height: 1.1rem;
  padding: 0 0.3rem;
  border-radius: 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--bs-danger);
  color: #fff;
  font-size: 0.64rem;
  font-weight: 700;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  box-shadow: 0 0 0 2px var(--bs-body-bg);
}
.buton-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.5rem;
  background: var(--bs-primary-bg-subtle);
  color: var(--bs-primary);
  font-size: 0.8125rem;
  font-weight: 600;
  transition: border-color 0.15s ease;
}
.buton-avatar:hover,
.nav-item.show .buton-avatar {
  border-color: var(--bs-primary);
  color: var(--bs-primary);
}

/* Selectorul de hotel din bara de sus: buton compact cu chenar fin + panou cu cautare */
.selector-hotel .buton-hotel {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.5rem;
  height: 2.25rem;
  padding: 0 0.75rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--bs-heading-color);
  line-height: 1;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
.selector-hotel .buton-hotel:hover,
.selector-hotel.show .buton-hotel {
  border-color: var(--bs-primary);
  background: var(--bs-primary-bg-subtle);
}
.selector-hotel .buton-hotel .ic {
  font-size: 1rem;
  width: 1rem;
  height: 1rem;
  color: var(--bs-secondary-color);
}
.selector-hotel .buton-hotel .sageata {
  font-size: 0.875rem;
  width: 0.875rem;
  height: 0.875rem;
  color: var(--bs-secondary-color);
  opacity: 0.7;
}
.selector-hotel-meniu {
  width: 17rem;
  padding: 0;
  overflow: hidden;
}
.selector-hotel-meniu .cautare {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid var(--bs-border-color);
}
.selector-hotel-meniu .cautare .icon-base {
  font-size: 1rem;
  width: 1rem;
  height: 1rem;
  color: var(--bs-secondary-color);
  flex-shrink: 0;
}
.selector-hotel-meniu .cautare input {
  border: 0;
  outline: 0;
  background: transparent;
  width: 100%;
  font-size: 0.875rem;
  color: var(--bs-body-color);
}
.selector-hotel-meniu .cautare input::placeholder {
  color: var(--bs-secondary-color);
  opacity: 0.7;
}
.selector-hotel-meniu .lista {
  max-height: 16rem;
  overflow-y: auto;
  padding: 0.375rem;
}
.selector-hotel-meniu .element-hotel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  width: 100%;
  border: 0;
  background: transparent;
  padding: 0.5625rem 0.75rem;
  border-radius: 0.4375rem;
  font-size: 0.875rem;
  color: var(--bs-body-color);
  text-align: left;
  cursor: pointer;
}
.selector-hotel-meniu .element-hotel:hover {
  background: var(--bs-tertiary-bg);
}
.selector-hotel-meniu .element-hotel.activ {
  font-weight: 500;
  color: var(--bs-heading-color);
}
.selector-hotel-meniu .element-hotel .bifa {
  font-size: 1rem;
  width: 1rem;
  height: 1rem;
  color: var(--bs-primary);
  flex-shrink: 0;
}
.selector-hotel-meniu .fara-rezultate {
  padding: 0.875rem 1rem;
  font-size: 0.85rem;
  color: color-mix(in srgb, var(--bs-body-color) 72%, transparent);
}

/* Continut derulabil in card: inaltime fixa, restul se deruleaza (nu creste pagina) */
.derulabil {
  max-height: 26rem;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(var(--lux-accent-rgb), 0.55) transparent;
}
.derulabil::-webkit-scrollbar {
  width: 6px;
}
.derulabil::-webkit-scrollbar-thumb {
  background: rgba(var(--lux-accent-rgb), 0.55);
  border-radius: 3px;
}
.derulabil::-webkit-scrollbar-track {
  background: transparent;
}

/* despartitoare: o linie sub, o linie la stanga, in functie de asezare */
@media (max-width: 575.98px) {
  .strip-metrici .metrica + .metrica {
    border-top: 1px solid var(--bs-border-color);
  }
  /* regula mobilului: butoanele de actiune pe toata latimea, nimic partial —
     antetul paginilor de administrare, filtrele si actiunile din fise */
  #continut-dinamic > .d-flex.justify-content-between.flex-wrap > .btn {
    width: 100%;
  }
  .filtre-tabel .d-flex.gap-2 { flex-wrap: wrap; }
  .filtre-tabel .d-flex.gap-2 > .btn,
  .filtre-tabel .d-flex.gap-2 > a.btn { flex: 1 1 calc(50% - 0.5rem); }
  .fisa-client .d-flex.gap-2.flex-wrap > .btn { flex: 1 1 100%; }
  .fisa-client .d-flex.gap-2.flex-wrap > form { width: 100%; }
  .fisa-client .latime-select { flex: 1 1 auto; }
  /* modalele pe telefon: mai putin aer pe laterale, campurile primesc loc —
     valabil pentru TOATE modalele aplicatiei; variabila tine sincron si
     barele care se intind pana la margini (calculate din acelasi padding) */
  .modal { --bs-modal-padding: 0.6rem; }
  .modal .modal-header,
  .modal .modal-body,
  .modal .modal-footer { padding-inline: 0.6rem; }
  .modal .modal-body .row { --bs-gutter-x: 0.6rem; }
  /* modalul foloseste aproape toata latimea ecranului pe telefon (margini mici) */
  #modal-detalii .modal-dialog,
  #modal-camera .modal-dialog { margin-inline: 0.4rem; }
  /* cardurile de sumar: unul pe rand (latime intreaga) ca valorile sa incapa
     mereu pe un singur rand, nu infasurate ca la coloane inguste */
  #det-continut.lista-valori { grid-template-columns: 1fr; }

  /* REGULA DE AUR pe telefon (peste tot, modal sau pagina): orice rand care
     tine campuri de formular isi pune campurile pe LATIME INTREAGA — niciun
     input aruncat pe un sfert de ecran. Grupare premium: stivuite, egale. */
  .row:has(.form-control, .form-select, textarea, .selector-cautare, .selector-multiplu, .segment-alegere) > [class*="col-"] {
    flex: 0 0 100%;
    max-width: 100%;
  }
  /* randurile input + buton (CUI+ANAF, cameră+Alocă) se stivuiesc pe verticala,
     fiecare pe latime intreaga — acelasi tratament ca .rand-input-buton, dar
     automat oriunde apare tiparul (nu mai trebuie tinut minte clasa) */
  .d-flex:has(> .form-control, > .selector-cautare):not(.grup-interval):not(.navigator-zi):not(.segment-alegere):not(.cautare) {
    flex-direction: column;
    align-items: stretch;
  }
  .d-flex:has(> .form-control, > .selector-cautare):not(.grup-interval):not(.navigator-zi):not(.cautare) > .form-control,
  .d-flex:has(> .form-control, > .selector-cautare):not(.grup-interval):not(.navigator-zi):not(.cautare) > .btn,
  .d-flex:has(> .form-control, > .selector-cautare):not(.grup-interval):not(.navigator-zi):not(.cautare) > .selector-cautare {
    width: 100%;
    flex: 1 1 auto;
  }
}
@media (min-width: 576px) and (max-width: 1199.98px) {
  .strip-metrici .metrica:nth-child(even) {
    border-left: 1px solid var(--bs-border-color);
  }
  .strip-metrici .metrica:nth-child(n+3) {
    border-top: 1px solid var(--bs-border-color);
  }
}
@media (min-width: 1200px) {
  .strip-metrici .metrica + .metrica {
    border-left: 1px solid var(--bs-border-color);
  }
}

/* ------------------------------- grila de tarife (tarife.php)
   Design premium, ton de aplicatie hoteliera de lux: tipografie ingrijita,
   accente discrete auriu-sampanie, cifre tabulare, separatoare fine. */
:root {
  --accent-lux: var(--lux-accent);
}

.bloc-tip {
  overflow: hidden;
  border: 1px solid var(--bs-border-color);
}
.antet-tip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.1rem 1.5rem;
  border-bottom: 1px solid var(--bs-border-color);
  background: linear-gradient(180deg, color-mix(in srgb, var(--accent-lux) 4%, transparent), transparent);
}
.eticheta-tip {
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.legaturi-tip {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}
.legatura-tip {
  border: 0;
  background: none;
  padding: 0.15rem 0.1rem;
  font-size: 0.8125rem;
  letter-spacing: 0.06em;
  color: var(--accent-lux);
  border-bottom: 1px solid transparent;
  transition: border-color 0.15s;
}
.legatura-tip:hover {
  border-bottom-color: var(--accent-lux);
}
.separator-legaturi {
  color: var(--bs-secondary-color);
  font-size: 0.7rem;
}

.grila-tarife {
  overflow-x: auto;
}
.grila-tarife table {
  min-width: 980px;
  font-variant-numeric: tabular-nums;
}
.grila-tarife th,
.grila-tarife td {
  white-space: nowrap;
  min-width: 4.5rem;
  padding-top: 0.55rem;
  padding-bottom: 0.55rem;
  border-color: color-mix(in srgb, var(--bs-border-color) 55%, transparent);
}
.grila-tarife thead th {
  font-size: 0.75rem;
  letter-spacing: 0.05em;
  border-bottom: 1px solid var(--bs-border-color);
}
.grila-tarife .celula-eticheta {
  position: sticky;
  left: 0;
  z-index: 2;
  background: var(--bs-card-bg);
  min-width: 14rem;
  max-width: 16rem;
  white-space: normal;
  text-align: left;
  box-shadow: inset -1px 0 0 var(--bs-border-color);
}
.grila-tarife .zi-weekend {
  background: color-mix(in srgb, var(--accent-lux) 6%, transparent);
}
.grila-tarife .rand-disponibilitate td:not(.celula-eticheta) {
  font-weight: 600;
}
.grila-tarife .celula-actiune {
  cursor: pointer;
  transition: background 0.12s;
}
.grila-tarife .celula-actiune:hover {
  background: color-mix(in srgb, var(--accent-lux) 16%, transparent);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent-lux) 45%, transparent);
}
.grila-tarife .celula-derivata {
  color: var(--bs-secondary-color);
  font-style: italic;
}
.grila-tarife .celula-inchisa {
  background: color-mix(in srgb, var(--bs-danger) 22%, transparent) !important;
  color: var(--bs-danger);
  font-weight: 600;
}
.grila-tarife .celula-marcata {
  position: relative;
}
.grila-tarife .celula-marcata::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  border-style: solid;
  border-width: 0 0.5rem 0.5rem 0;
  border-color: transparent var(--bs-danger) transparent transparent;
}

.comutator-plan {
  border: 0;
  background: none;
  padding: 0 0.25rem 0 0;
  color: var(--bs-secondary-color);
  vertical-align: -2px;
}
.comutator-plan i {
  transition: transform 0.15s;
}
.comutator-plan.deschis i {
  transform: rotate(90deg);
}
.subrand-plan td {
  background: color-mix(in srgb, var(--bs-body-bg) 45%, transparent);
  font-size: 0.8125rem;
}
.subrand-eticheta {
  padding-left: 2.1rem !important;
  color: var(--bs-secondary-color);
}

.insigna-ocupare {
  display: inline-block;
  min-width: 3.1rem;
  padding: 0.14rem 0.4rem;
  border-radius: 2rem;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.02em;
}
.insigna-ocupare.ocupare-mica { background: color-mix(in srgb, var(--bs-success) 16%, transparent); color: var(--bs-success); }
.insigna-ocupare.ocupare-medie { background: color-mix(in srgb, var(--bs-warning) 16%, transparent); color: var(--bs-warning); }
.insigna-ocupare.ocupare-mare { background: color-mix(in srgb, var(--bs-danger) 16%, transparent); color: var(--bs-danger); }

.zi-bifabila.active {
  background: var(--bs-primary);
  border-color: var(--bs-primary);
  color: #fff;
}
/* scurtaturile de zile din modalele de tarife (Toate / Lu - Vi / Sa + Du) */
.scurtaturi-zile { display: inline-flex; gap: 0.75rem; }

/* selectia prin tragere pe grila de tarife: intervalul tras se aprinde auriu */
.tabla-tarife .celula-actiune { user-select: none; }
.tabla-tarife .celula-selectata { background: color-mix(in srgb, var(--lux-accent) 28%, transparent) !important; }

/* tragerea pe calendar: schita arata ca o REZERVARE adevarata — aceeasi bara
   si aceeasi geometrie (incepe la jumatatea zilei de sosire), doar ca e gri
   hasurata cu chenar intrerupt, iar la mijloc scrie cate nopti ai tras */
@keyframes schita-apare {
  from { opacity: 0; }
  to { opacity: 1; }
}
.tabel-diagrama td.celula-libera { user-select: none; }
/* cat timp desenezi, nu se selecteaza NIMIC in toata tabla (nici numele de pe bare) */
.panou-diagrama.trage-schita,
.panou-diagrama.trage-schita * { user-select: none !important; }
.bara-rezervare.bara-schita {
  left: 50%;
  /* latimea vine din JS, in pixeli, din latimea REALA a celulei (cu borduri) —
     inmultirea cu latimea de continut pierdea ~3px pe noapte si schita iesea
     vizibil mai scurta decat o bara adevarata */
  justify-content: center;
  /* creste lin cand tragi peste zile noi si apare cu o respiratie scurta */
  transition: width 0.18s ease;
  animation: schita-apare 0.16s ease;
  background: repeating-linear-gradient(135deg,
    color-mix(in srgb, var(--bs-secondary-color) 24%, transparent) 0 6px,
    color-mix(in srgb, var(--bs-secondary-color) 10%, transparent) 6px 12px);
  border: 1.5px dashed color-mix(in srgb, var(--lux-accent) 60%, transparent);
  color: var(--bs-heading-color);
  text-shadow: 0 1px 2px var(--bs-paper-bg);
  box-shadow: none;
  pointer-events: none;
  z-index: 3;
}

/* unde se vinde planul: pastile discrete pe randul lui din grila */
.vanzare-plan { display: inline-flex; gap: 0.25rem; margin-left: 0.4rem; vertical-align: middle; }
.pastila-vanzare {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 1.05rem; height: 1.05rem; padding: 0 0.2rem; border-radius: 0.35rem;
  font-size: 0.6rem; font-weight: 700; letter-spacing: 0.02em;
  background: color-mix(in srgb, var(--lux-accent) 16%, transparent);
  color: var(--lux-accent-inchis);
}
.pastila-vanzare.online { background: color-mix(in srgb, #4f9dad 18%, transparent); color: #4f9dad; }
.pastila-vanzare .icon-base { font-size: 0.72rem; width: 0.72rem; height: 0.72rem; }
.vanzare-plan .monograma-canal { min-width: 1.05rem; height: 1.05rem; font-size: 0.55rem; }

/* alegerea canalelor din formularul planului */
.lista-canale-plan {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem 1.5rem;
}
.lista-canale-plan .form-check-label { display: inline-flex; align-items: center; gap: 0.4rem; }
.lista-canale-plan .monograma-canal { min-width: 1.15rem; height: 1.15rem; font-size: 0.58rem; }
@media (max-width: 575.98px) { .lista-canale-plan { grid-template-columns: 1fr; } }

/* coloanele de selectie multipla din modale (Camere / Planuri Tarifare) */
.coloana-selectie {
  border: 1px solid var(--bs-border-color);
  border-radius: 0.5rem;
  overflow: hidden;
}
.cap-selectie {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.6rem 0.9rem;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--bs-border-color);
  background: color-mix(in srgb, var(--accent-lux) 5%, transparent);
}
.cap-selectie .selecteaza-tot {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
  color: var(--bs-secondary-color);
  margin: 0;
}
.lista-selectie {
  max-height: 13rem;
  overflow-y: auto;
  padding: 0.35rem 0;
}
.rand-selectie {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  padding: 0.35rem 0.9rem;
  margin: 0;
  font-size: 0.875rem;
  cursor: pointer;
}
.rand-selectie:hover {
  background: color-mix(in srgb, var(--accent-lux) 10%, transparent);
}
.rand-extra {
  padding: 0.45rem 0;
  border-top: 1px dashed var(--bs-border-color);
}

/* istoric actiuni in panou: umple exact cardul (aceeasi inaltime cu vecinii) */
.derulabil.umple-card {
  max-height: none;
  flex: 1 1 0;
  min-height: 0;
}
.rand-istoric {
  padding: 0.55rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--bs-border-color) 55%, transparent);
}
.rand-istoric:last-child {
  border-bottom: 0;
}
.rand-istoric .detalii-istoric {
  line-height: 1.45;
}
.rand-istoric .meta-istoric {
  font-size: 0.72rem;
  letter-spacing: 0.02em;
  margin-top: 0.15rem;
}

/* ------------------------------- panoul (panou.php), ton hotelier de lux */
.antet-panou-zi {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
}
.sprinceana-lux {
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--accent-lux);
  margin-bottom: 0.35rem;
}
.salut-panou {
  font-size: 1.65rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}
.navigator-zi {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}
.navigator-zi .camp-zi {
  min-width: 10.5rem;
  font-variant-numeric: tabular-nums;
}

.antet-card-lux {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid color-mix(in srgb, var(--bs-border-color) 55%, transparent);
  background: linear-gradient(180deg, color-mix(in srgb, var(--accent-lux) 4%, transparent), transparent);
}
.titlu-card-lux {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.titlu-card-lux .icon-base {
  color: var(--accent-lux);
  font-size: 1.05rem;
}

.lista-valori .rand-valoare {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.55rem 0;
  border-bottom: 1px solid color-mix(in srgb, var(--bs-border-color) 45%, transparent);
}
.lista-valori .rand-valoare:last-child {
  border-bottom: 0;
}
.lista-valori .rand-valoare.total {
  border-top: 1px solid var(--bs-border-color);
  font-weight: 600;
}
.lista-valori .cifra {
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}
.legatura-card {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin-top: 0.6rem;
  font-size: 0.8125rem;
  color: var(--accent-lux);
}
.legatura-card:hover {
  color: var(--accent-lux);
  text-decoration: underline;
}

.tabel-disponibilitate th,
.tabel-disponibilitate td {
  font-variant-numeric: tabular-nums;
}
.tabel-disponibilitate .celula-eticheta {
  min-width: 9rem;
  max-width: 11rem;
}

/* mobil: navigatorul de zi pe toata latimea, metrici mai compacte */
@media (max-width: 767.98px) {
  .antet-panou-zi {
    align-items: stretch;
    flex-direction: column;
  }
  .navigator-zi {
    width: 100%;
  }
  .navigator-zi form {
    flex: 1 1 auto;
  }
  .navigator-zi .camp-data-lux {
    width: 100%;
    min-width: 0;
  }
  .salut-panou {
    font-size: 1.35rem;
  }
  .strip-metrici .metrica {
    padding: 0.9rem 1rem;
  }
  .strip-metrici .valoare {
    font-size: 1.35rem;
  }
  .strip-metrici .eticheta {
    font-size: 0.7rem;
  }
  .tabel-disponibilitate .celula-eticheta {
    min-width: 7.5rem;
  }
}

/* ================================================================== TEMA LUX
   Accentul auriu-sampanie devine culoarea PRIMARA a intregii aplicatii
   (butoane, meniu, formulare, linkuri, paginatie, bife) — ton de aplicatie
   hoteliera de lux. REGULA: paginile noi folosesc componentele standard
   (btn-primary etc.) si primesc tema automat; nu se introduc culori noi. */
:root,
[data-bs-theme="dark"],
[data-bs-theme="light"] {
  /* ACCENTUL comutabil (paleta din bara de sus, pms-accent). Implicit: auriu.
     Orice nuanta primara vine DOAR din variabilele astea. */
  --lux-accent: #c9a96a;
  --lux-accent-rgb: 201, 169, 106;
  --lux-accent-deschis: #d9bc82;
  --lux-accent-deschis-rgb: 217, 188, 130;
  --lux-grad-sus: #d3ae6e;
  --lux-grad-jos: #b8914d;
  --lux-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23c9a96a' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z'/%3E%3Cpath d='M16 3v4'/%3E%3Cpath d='M8 3v4'/%3E%3Cpath d='M4 11h16'/%3E%3Cpath d='M11 15h1'/%3E%3Cpath d='M12 15v3'/%3E%3C/svg%3E");
  --lux-icon-sageata: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23c9a96a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --lux-icon-intrebare: var(--lux-icon-intrebare);
  --bs-primary: var(--lux-accent);
  --bs-primary-rgb: var(--lux-accent-rgb);
  --bs-link-color: var(--lux-accent);
  --bs-link-color-rgb: var(--lux-accent-rgb);
  --bs-link-hover-color: var(--lux-accent-deschis);
  --bs-link-hover-color-rgb: var(--lux-accent-deschis-rgb);
  --bs-primary-bg-subtle: rgba(var(--lux-accent-rgb), 0.16);
  --bs-primary-border-subtle: rgba(var(--lux-accent-rgb), 0.45);
  /* paleta semantica RAFINATA (lux): aceleasi semnificatii, nuante din
     aceeasi lume cu auriul — smarald / claret / chihlimbar / petrol.
     REGULA: nicio culoare semantica nu se scrie ca hex crud in pagini;
     totul prin variabilele astea. */
  --bs-success: #4aa577;
  --bs-success-rgb: 74, 165, 119;
  --bs-danger: #c05a5f;
  --bs-danger-rgb: 192, 90, 95;
  --bs-warning: #d9a05b;
  --bs-warning-rgb: 217, 160, 91;
  --bs-info: #4f9dad;
  --bs-info-rgb: 79, 157, 173;
  --bs-success-bg-subtle: rgba(74, 165, 119, 0.16);
  --bs-danger-bg-subtle: rgba(192, 90, 95, 0.16);
  --bs-warning-bg-subtle: rgba(217, 160, 91, 0.16);
  --bs-info-bg-subtle: rgba(79, 157, 173, 0.16);
  --bs-success-border-subtle: rgba(74, 165, 119, 0.4);
  --bs-danger-border-subtle: rgba(192, 90, 95, 0.4);
  --bs-warning-border-subtle: rgba(217, 160, 91, 0.4);
  --bs-info-border-subtle: rgba(79, 157, 173, 0.4);
  /* codurile (SGL-STD, EXC...) — roz atenuat, nu neonul Vuexy */
  --bs-code-color: #cd8a8e;
  /* suprafetele aurii: degrade usor adancit + text IVORY cald (nu negru) —
     tratamentul marilor branduri de lux; umbra de text da adancime */
  --lux-auriu-suprafata: linear-gradient(180deg, var(--lux-grad-sus) 0%, var(--lux-grad-jos) 100%);
  --lux-pe-auriu: color-mix(in srgb, #fff 93%, var(--lux-accent));
  --lux-umbra-text: 0 1px 1px color-mix(in srgb, var(--lux-accent) 25%, rgba(0, 0, 0, 0.5));
  --lux-inchis: #26211a;
  /* nuante DERIVATE automat din accent (hover/apasat/tema luminoasa) —
     se recalculeaza singure la schimbarea paletei */
  --lux-grad-sus-activ: color-mix(in srgb, var(--lux-grad-sus) 86%, #fff);
  --lux-grad-jos-activ: color-mix(in srgb, var(--lux-grad-jos) 88%, #fff);
  --lux-accent-inchis: color-mix(in srgb, var(--lux-accent) 74%, #221d12);
  /* emblema (arcada): degradeul ei urmeaza culoarea aleasa */
  --lux-marca-sus: color-mix(in srgb, var(--lux-accent) 70%, #fff);
  --lux-marca-jos: color-mix(in srgb, var(--lux-accent) 84%, #000);
}

/* liniile grilei din calendar — contrast bun pe ambele teme (personalul
   lucreaza ore intregi pe tabla; chenarul general e prea sters pentru asta) */
:root,
[data-bs-theme="dark"] {
  --lux-grila: rgba(255, 255, 255, 0.2);
  --lux-grila-slaba: rgba(255, 255, 255, 0.13);
  --lux-zebra: rgba(255, 255, 255, 0.055);
}
[data-bs-theme="light"] {
  --lux-grila: rgba(23, 26, 40, 0.2);
  --lux-grila-slaba: rgba(23, 26, 40, 0.12);
  --lux-zebra: rgba(23, 26, 40, 0.05);
}


/* paletele accentului — comutabile din bara de sus (pms-accent); auriul e
   implicit, fara atribut. O paleta = doar culoarea de baza: nuanta deschisa,
   capetele degradeului, hoverul, apasatul, varianta pentru tema luminoasa si
   textul de pe accent se calculeaza SINGURE (color-mix). Lista in Core\Tema. */
:root[data-accent="platina"] {
  --lux-accent: #a3aec2;
  --lux-accent-rgb: 163, 174, 194;
  --lux-accent-deschis: color-mix(in srgb, var(--lux-accent) 76%, #fff);
  --lux-accent-deschis-rgb: var(--lux-accent-rgb);
  --lux-grad-sus: color-mix(in srgb, var(--lux-accent) 92%, #fff);
  --lux-grad-jos: color-mix(in srgb, var(--lux-accent) 86%, #000);
  --lux-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23a3aec2' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z'/%3E%3Cpath d='M16 3v4'/%3E%3Cpath d='M8 3v4'/%3E%3Cpath d='M4 11h16'/%3E%3Cpath d='M11 15h1'/%3E%3Cpath d='M12 15v3'/%3E%3C/svg%3E");
  --lux-icon-sageata: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23a3aec2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --lux-icon-intrebare: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3aec2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8a3.5 3 0 0 1 3.5 -3h1a3.5 3 0 0 1 3.5 3a3 3 0 0 1 -2 3a3 4 0 0 0 -2 4'/%3E%3Cpath d='M12 19l0 .01'/%3E%3C/svg%3E");
}
:root[data-accent="smarald"] {
  --lux-accent: #5ea287;
  --lux-accent-rgb: 94, 162, 135;
  --lux-accent-deschis: color-mix(in srgb, var(--lux-accent) 76%, #fff);
  --lux-accent-deschis-rgb: var(--lux-accent-rgb);
  --lux-grad-sus: color-mix(in srgb, var(--lux-accent) 92%, #fff);
  --lux-grad-jos: color-mix(in srgb, var(--lux-accent) 86%, #000);
  --lux-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%235ea287' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z'/%3E%3Cpath d='M16 3v4'/%3E%3Cpath d='M8 3v4'/%3E%3Cpath d='M4 11h16'/%3E%3Cpath d='M11 15h1'/%3E%3Cpath d='M12 15v3'/%3E%3C/svg%3E");
  --lux-icon-sageata: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%235ea287' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --lux-icon-intrebare: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235ea287' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8a3.5 3 0 0 1 3.5 -3h1a3.5 3 0 0 1 3.5 3a3 3 0 0 1 -2 3a3 4 0 0 0 -2 4'/%3E%3Cpath d='M12 19l0 .01'/%3E%3C/svg%3E");
}
:root[data-accent="petrol"] {
  --lux-accent: #4f9dad;
  --lux-accent-rgb: 79, 157, 173;
  --lux-accent-deschis: color-mix(in srgb, var(--lux-accent) 76%, #fff);
  --lux-accent-deschis-rgb: var(--lux-accent-rgb);
  --lux-grad-sus: color-mix(in srgb, var(--lux-accent) 92%, #fff);
  --lux-grad-jos: color-mix(in srgb, var(--lux-accent) 86%, #000);
  --lux-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%234f9dad' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z'/%3E%3Cpath d='M16 3v4'/%3E%3Cpath d='M8 3v4'/%3E%3Cpath d='M4 11h16'/%3E%3Cpath d='M11 15h1'/%3E%3Cpath d='M12 15v3'/%3E%3C/svg%3E");
  --lux-icon-sageata: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%234f9dad' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --lux-icon-intrebare: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234f9dad' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8a3.5 3 0 0 1 3.5 -3h1a3.5 3 0 0 1 3.5 3a3 3 0 0 1 -2 3a3 4 0 0 0 -2 4'/%3E%3Cpath d='M12 19l0 .01'/%3E%3C/svg%3E");
}
:root[data-accent="azur"] {
  --lux-accent: #4f95dd;
  --lux-accent-rgb: 79, 149, 221;
  --lux-accent-deschis: color-mix(in srgb, var(--lux-accent) 76%, #fff);
  --lux-accent-deschis-rgb: var(--lux-accent-rgb);
  --lux-grad-sus: color-mix(in srgb, var(--lux-accent) 92%, #fff);
  --lux-grad-jos: color-mix(in srgb, var(--lux-accent) 86%, #000);
  --lux-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%234f95dd' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z'/%3E%3Cpath d='M16 3v4'/%3E%3Cpath d='M8 3v4'/%3E%3Cpath d='M4 11h16'/%3E%3Cpath d='M11 15h1'/%3E%3Cpath d='M12 15v3'/%3E%3C/svg%3E");
  --lux-icon-sageata: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%234f95dd' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --lux-icon-intrebare: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234f95dd' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8a3.5 3 0 0 1 3.5 -3h1a3.5 3 0 0 1 3.5 3a3 3 0 0 1 -2 3a3 4 0 0 0 -2 4'/%3E%3Cpath d='M12 19l0 .01'/%3E%3C/svg%3E");
}
:root[data-accent="safir"] {
  --lux-accent: #6d84c8;
  --lux-accent-rgb: 109, 132, 200;
  --lux-accent-deschis: color-mix(in srgb, var(--lux-accent) 76%, #fff);
  --lux-accent-deschis-rgb: var(--lux-accent-rgb);
  --lux-grad-sus: color-mix(in srgb, var(--lux-accent) 92%, #fff);
  --lux-grad-jos: color-mix(in srgb, var(--lux-accent) 86%, #000);
  --lux-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%236d84c8' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z'/%3E%3Cpath d='M16 3v4'/%3E%3Cpath d='M8 3v4'/%3E%3Cpath d='M4 11h16'/%3E%3Cpath d='M11 15h1'/%3E%3Cpath d='M12 15v3'/%3E%3C/svg%3E");
  --lux-icon-sageata: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%236d84c8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --lux-icon-intrebare: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236d84c8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8a3.5 3 0 0 1 3.5 -3h1a3.5 3 0 0 1 3.5 3a3 3 0 0 1 -2 3a3 4 0 0 0 -2 4'/%3E%3Cpath d='M12 19l0 .01'/%3E%3C/svg%3E");
}
:root[data-accent="rosu"] {
  --lux-accent: #d8232a;
  --lux-accent-rgb: 216, 35, 42;
  --lux-accent-deschis: color-mix(in srgb, var(--lux-accent) 76%, #fff);
  --lux-accent-deschis-rgb: var(--lux-accent-rgb);
  --lux-grad-sus: color-mix(in srgb, var(--lux-accent) 92%, #fff);
  --lux-grad-jos: color-mix(in srgb, var(--lux-accent) 86%, #000);
  --lux-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23d8232a' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z'/%3E%3Cpath d='M16 3v4'/%3E%3Cpath d='M8 3v4'/%3E%3Cpath d='M4 11h16'/%3E%3Cpath d='M11 15h1'/%3E%3Cpath d='M12 15v3'/%3E%3C/svg%3E");
  --lux-icon-sageata: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23d8232a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --lux-icon-intrebare: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d8232a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8a3.5 3 0 0 1 3.5 -3h1a3.5 3 0 0 1 3.5 3a3 3 0 0 1 -2 3a3 4 0 0 0 -2 4'/%3E%3Cpath d='M12 19l0 .01'/%3E%3C/svg%3E");
}
:root[data-accent="ametist"] {
  --lux-accent: #9481bd;
  --lux-accent-rgb: 148, 129, 189;
  --lux-accent-deschis: color-mix(in srgb, var(--lux-accent) 76%, #fff);
  --lux-accent-deschis-rgb: var(--lux-accent-rgb);
  --lux-grad-sus: color-mix(in srgb, var(--lux-accent) 92%, #fff);
  --lux-grad-jos: color-mix(in srgb, var(--lux-accent) 86%, #000);
  --lux-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%239481bd' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z'/%3E%3Cpath d='M16 3v4'/%3E%3Cpath d='M8 3v4'/%3E%3Cpath d='M4 11h16'/%3E%3Cpath d='M11 15h1'/%3E%3Cpath d='M12 15v3'/%3E%3C/svg%3E");
  --lux-icon-sageata: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%239481bd' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --lux-icon-intrebare: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239481bd' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8a3.5 3 0 0 1 3.5 -3h1a3.5 3 0 0 1 3.5 3a3 3 0 0 1 -2 3a3 4 0 0 0 -2 4'/%3E%3Cpath d='M12 19l0 .01'/%3E%3C/svg%3E");
}
:root[data-accent="rubin"] {
  --lux-accent: #bd6b74;
  --lux-accent-rgb: 189, 107, 116;
  --lux-accent-deschis: color-mix(in srgb, var(--lux-accent) 76%, #fff);
  --lux-accent-deschis-rgb: var(--lux-accent-rgb);
  --lux-grad-sus: color-mix(in srgb, var(--lux-accent) 92%, #fff);
  --lux-grad-jos: color-mix(in srgb, var(--lux-accent) 86%, #000);
  --lux-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23bd6b74' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z'/%3E%3Cpath d='M16 3v4'/%3E%3Cpath d='M8 3v4'/%3E%3Cpath d='M4 11h16'/%3E%3Cpath d='M11 15h1'/%3E%3Cpath d='M12 15v3'/%3E%3C/svg%3E");
  --lux-icon-sageata: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23bd6b74' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --lux-icon-intrebare: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23bd6b74' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8a3.5 3 0 0 1 3.5 -3h1a3.5 3 0 0 1 3.5 3a3 3 0 0 1 -2 3a3 4 0 0 0 -2 4'/%3E%3Cpath d='M12 19l0 .01'/%3E%3C/svg%3E");
}
:root[data-accent="aramiu"] {
  --lux-accent: #c08a6d;
  --lux-accent-rgb: 192, 138, 109;
  --lux-accent-deschis: color-mix(in srgb, var(--lux-accent) 76%, #fff);
  --lux-accent-deschis-rgb: var(--lux-accent-rgb);
  --lux-grad-sus: color-mix(in srgb, var(--lux-accent) 92%, #fff);
  --lux-grad-jos: color-mix(in srgb, var(--lux-accent) 86%, #000);
  --lux-icon-calendar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23c08a6d' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z'/%3E%3Cpath d='M16 3v4'/%3E%3Cpath d='M8 3v4'/%3E%3Cpath d='M4 11h16'/%3E%3Cpath d='M11 15h1'/%3E%3Cpath d='M12 15v3'/%3E%3C/svg%3E");
  --lux-icon-sageata: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23c08a6d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  --lux-icon-intrebare: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c08a6d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8a3.5 3 0 0 1 3.5 -3h1a3.5 3 0 0 1 3.5 3a3 3 0 0 1 -2 3a3 4 0 0 0 -2 4'/%3E%3Cpath d='M12 19l0 .01'/%3E%3C/svg%3E");
}

/* ---------------------------------------------- tabla de tarife (aceeasi
   constructie ca in calendarul rezervarilor: antet inghetat, benzi pe tip de
   camera, coloana din stanga inghetata; doar coloana de etichete e mai lata,
   fiindca poarta numele planurilor si sub-randurile lor) */
.tabla-tarife .panou-diagrama .tabel-diagrama {
  width: max(100%, calc(15rem + var(--numar-zile, 15) * 5rem));
}
.tabla-tarife .panou-diagrama .col-camere {
  width: 15rem;
}
.tabla-tarife .celula-eticheta {
  position: sticky;
  left: 0;
  z-index: 4;
  background-color: var(--bs-paper-bg) !important;
  padding: 0 0.8rem;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: inset -1px 0 0 var(--bs-border-color);
  font-size: 0.8125rem;
}
.tabla-tarife td,
.tabla-tarife th.cap-zi {
  height: 2.5rem;
  font-variant-numeric: tabular-nums;
}
.tabla-tarife .celula-actiune {
  cursor: pointer;
  transition: background 0.12s;
}
.tabla-tarife .celula-actiune:hover {
  background: rgba(var(--lux-accent-rgb), 0.16);
  box-shadow: inset 0 0 0 1px rgba(var(--lux-accent-rgb), 0.45);
}
.tabla-tarife .rand-disponibilitate td:not(.celula-eticheta),
.tabla-tarife .rand-ocupare td:not(.celula-eticheta) {
  font-weight: 600;
}
.tabla-tarife .subrand-eticheta {
  padding-left: 2.1rem;
  color: var(--bs-secondary-color);
}
/* banda tipului de camera poarta si scurtaturile lui */
.tabla-tarife .banda-sectiune {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-right: 0.9rem;
}
.tabla-tarife .banda-sectiune .capacitate-tip {
  margin-left: 0.5rem;
  text-transform: none;
  letter-spacing: 0;
  color: var(--bs-secondary-color);
  font-weight: 400;
}
.tabla-tarife .actiuni-banda {
  position: sticky;
  right: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.85rem;
  flex-shrink: 0;
}
/* pe ecrane mici: coloana de etichete mai ingusta, iar scurtaturile tipului
   NU mai sunt lipite in dreapta (se suprapuneau peste denumire) — raman la
   capatul benzii, unde ajungi deruland */
@media (max-width: 767.98px) {
  .tabla-tarife .panou-diagrama .tabel-diagrama {
    width: max(100%, calc(9.5rem + var(--numar-zile, 15) * 5rem));
  }
  .tabla-tarife .panou-diagrama .col-camere {
    width: 9.5rem;
  }
  .tabla-tarife .celula-eticheta {
    font-size: 0.75rem;
    padding: 0 0.5rem;
  }
  .tabla-tarife .banda-sectiune .capacitate-tip {
    display: none;
  }
  .tabla-tarife .actiuni-banda {
    position: static;
    gap: 0.6rem;
    font-size: 0.75rem;
  }
  .tabla-tarife .subrand-eticheta {
    padding-left: 1.4rem;
  }
}

/* mostrele din legenda tarifelor *//* mostrele din legenda tarifelor */
.mostra-inchisa { background: color-mix(in srgb, var(--bs-danger) 55%, var(--bs-paper-bg)); }
.mostra-marcata { background: color-mix(in srgb, var(--bs-warning) 55%, var(--bs-paper-bg)); }
.mostra-derivata { background: color-mix(in srgb, var(--bs-info) 40%, var(--bs-paper-bg)); }
.mostra-libera { background: color-mix(in srgb, var(--bs-secondary-color) 25%, var(--bs-paper-bg)); }
.mostra-ocupare-mica { background: color-mix(in srgb, var(--bs-success) 55%, var(--bs-paper-bg)); }
.mostra-ocupare-medie { background: color-mix(in srgb, var(--bs-warning) 55%, var(--bs-paper-bg)); }
.mostra-ocupare-mare { background: color-mix(in srgb, var(--bs-danger) 55%, var(--bs-paper-bg)); }

/* meniul de palete: doua coloane, ca o paleta de culori.
   .show din Bootstrap impune display:block cu specificitate mai mare — de
   aceea regula e scrisa pe .dropdown-menu.meniu-palete.show */
.dropdown-menu.meniu-palete.show {
  display: grid;
}
.meniu-palete {
  grid-template-columns: 1fr 1fr;
  gap: 0.1rem;
  min-width: 19rem;
  padding: 0.35rem;
}
.meniu-palete .dropdown-item {
  border-radius: 0.45rem;
}
.meniu-palete .dropdown-item.aleasa {
  background: rgba(var(--lux-accent-rgb), 0.14);
  color: var(--lux-accent);
  font-weight: 600;
}
.meniu-palete .dropdown-item.aleasa /* bifa patrata din selectul cu alegere multipla */
.selector-multiplu .optiune-multipla {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}
.selector-multiplu .patrat-bifa {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.05rem;
  height: 1.05rem;
  flex-shrink: 0;
  border: 1px solid color-mix(in srgb, var(--bs-secondary-color) 55%, transparent);
  border-radius: 0.3rem;
  color: transparent;
  font-size: 0.7rem;
  transition: background 0.12s, border-color 0.12s, color 0.12s;
}
.selector-multiplu .optiune-multipla.activa .patrat-bifa {
  background: var(--lux-auriu-suprafata);
  border-color: var(--lux-grad-jos);
  color: var(--lux-pe-auriu);
}

.punct-accent {
  box-shadow: 0 0 0 2px var(--bs-paper-bg), 0 0 0 3.5px var(--pa);
}

/* marca in meniul lateral (mobil/tableta): micsorata ca sa INCAPA intreaga,
   nu taiata — emblema + "HOTELUL MEU" pe un singur rand */
@media (max-width: 1199.98px) {
  .layout-menu .app-brand-link {
    gap: 0.5rem;
    min-width: 0;
  }
  .layout-menu .app-brand-logo svg {
    width: 26px;
    height: 26px;
  }
  .layout-menu .marca-lux {
    font-size: 0.95rem;
    letter-spacing: 0.1em;
  }
  .layout-menu .marca-spatiu {
    width: 0.42em;
  }
}

/* coltul tablei: butonul de filtre (in locul denumirii hotelului) */
.buton-filtru {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.3rem 0.6rem;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.35);
  border-radius: 0.5rem;
  background: transparent;
  color: var(--lux-accent);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  transition: background 0.15s, color 0.15s;
}
.buton-filtru:hover {
  background: rgba(var(--lux-accent-rgb), 0.12);
}
.buton-filtru .icon-base {
  font-size: 0.95rem;
}
/* filtre puse: butonul se aprinde (iconul + textul devin aurii) — fara punct */
.buton-filtru.are-filtre {
  background: var(--lux-auriu-suprafata);
  border-color: var(--lux-grad-jos);
  color: var(--lux-pe-auriu);
  text-shadow: var(--lux-umbra-text);
}
.panou-filtre {
  position: absolute;
  top: calc(var(--cap-diagrama, 3.6rem) + 0.75rem);
  left: 0.75rem;
  z-index: 60;
  width: min(19rem, calc(100vw - 3rem));
  /* panoul NU iese din tabla: se opreste la marginea ei si primeste scroll
     propriu — pe telefon tot filtrul se vede fara sa parasesti tabelul */
  max-height: calc(100% - var(--cap-diagrama, 3.6rem) - 1.75rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 1rem 1.1rem 1.1rem;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.32);
  border-radius: 1.1rem;
  background: color-mix(in srgb, var(--bs-paper-bg) 88%, transparent);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.5);
  opacity: 0;
  transform: translateY(-0.4rem) scale(0.96);
  transform-origin: top left;
  pointer-events: none;
  transition: opacity 0.18s, transform 0.2s cubic-bezier(0.34, 1.4, 0.5, 1);
}
.panou-filtre.deschis {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}
.panou-filtre .actiuni-filtre {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-top: 1rem;
}

/* ------------------------------------------- curatenie + minibar pe camera
   Frunza de langa numarul camerei arata starea dintr-o privire: verde =
   curata (sau verificata), portocaliu = murdara, gri = mentenanta. */
.celula-camera .frunza-curatenie {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.35rem;
  height: 1.35rem;
  margin-right: 0.3rem;
  padding: 0;
  border: 0;
  border-radius: 0.4rem;
  background: transparent;
  font-size: 0.95rem;
  line-height: 1;
  vertical-align: -0.2em;
  transition: background 0.15s, transform 0.15s;
}
.celula-camera .frunza-curatenie:hover {
  background: rgba(var(--lux-accent-rgb), 0.14);
  transform: scale(1.12);
}
.frunza-curatenie.frunza-success { color: var(--bs-success); }
.frunza-curatenie.frunza-warning { color: var(--bs-warning); }
.frunza-curatenie.frunza-secondary { color: var(--bs-secondary-color); }
.celula-camera .numar-camera {
  vertical-align: middle;
}

/* fisa camerei */
.antet-camera {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}
.taburi-camera {
  margin-bottom: 1.25rem;
}
.stari-curatenie {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));
  gap: 0.6rem;
}
.stare-curatenie {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.35rem;
  padding: 0.85rem 0.5rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.75rem;
  background: transparent;
  color: var(--bs-secondary-color);
  font-size: 0.8125rem;
  font-weight: 600;
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.stare-curatenie .icon-base {
  font-size: 1.35rem;
}
.stare-curatenie:hover {
  border-color: rgba(var(--lux-accent-rgb), 0.5);
  background: rgba(var(--lux-accent-rgb), 0.06);
}
.stare-curatenie.stare-success .icon-base { color: var(--bs-success); }
.stare-curatenie.stare-warning .icon-base { color: var(--bs-warning); }
.stare-curatenie.stare-secondary .icon-base { color: var(--bs-secondary-color); }
.stare-curatenie.aleasa {
  border-color: var(--lux-accent);
  background: rgba(var(--lux-accent-rgb), 0.14);
  color: var(--bs-heading-color);
  box-shadow: inset 0 0 0 1px rgba(var(--lux-accent-rgb), 0.4);
}
.nota-regula {
  margin: 0.85rem 0 0;
  font-size: 0.8125rem;
}
.gol-istoric {
  padding: 1.25rem;
  border: 1px dashed var(--bs-border-color);
  border-radius: 0.75rem;
  color: var(--bs-secondary-color);
  font-size: 0.8125rem;
  text-align: center;
}

/* minibar */
.antet-minibar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 0.85rem;
  font-size: 0.8125rem;
}
.inventar-minibar {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.produs-minibar {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 0.85rem;
  padding: 0.55rem 0.75rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.6rem;
}
.produs-minibar.lipsa {
  border-color: color-mix(in srgb, var(--bs-warning) 45%, transparent);
  background: color-mix(in srgb, var(--bs-warning) 7%, transparent);
}
.produs-minibar .nume {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}
.produs-minibar .nume > span:first-child {
  font-weight: 600;
  font-size: 0.875rem;
}
.produs-minibar .pret {
  font-size: 0.75rem;
  color: var(--bs-secondary-color);
}
.produs-minibar .stoc {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.produs-minibar .stoc .cifra {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--bs-heading-color);
}
.produs-minibar .buton-consum {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  white-space: nowrap;
}
.produs-minibar .buton-consum span {
  font-size: 0.75rem;
  letter-spacing: 0.02em;
}
@media (max-width: 575.98px) {
  .produs-minibar .buton-consum span { display: none; }
}
.produs-minibar .stoc .din {
  font-size: 0.75rem;
  color: var(--bs-secondary-color);
  margin-left: 0.15rem;
}

/* acordeonul pe ani (istoric) — deschis pe anul curent, cu scroll propriu */
.acordeon-ani details {
  border: 1px solid var(--bs-border-color);
  border-radius: 0.75rem;
  margin-bottom: 0.5rem;
  overflow: hidden;
}
.acordeon-ani summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.65rem 0.9rem;
  cursor: pointer;
  list-style: none;
  background: rgba(var(--lux-accent-rgb), 0.05);
  font-size: 0.8125rem;
}
.acordeon-ani summary::-webkit-details-marker { display: none; }
.acordeon-ani summary::before {
  content: '';
  width: 0.5rem;
  height: 0.5rem;
  border-right: 1.5px solid var(--lux-accent);
  border-bottom: 1.5px solid var(--lux-accent);
  transform: rotate(-45deg);
  transition: transform 0.2s;
  flex-shrink: 0;
}
.acordeon-ani details[open] summary::before {
  transform: rotate(45deg);
}
.acordeon-ani summary .an {
  margin-right: auto;
  font-weight: 600;
  letter-spacing: 0.08em;
  color: var(--lux-accent);
  font-variant-numeric: tabular-nums;
}
.acordeon-ani summary .numar {
  color: var(--bs-secondary-color);
  font-variant-numeric: tabular-nums;
}
.acordeon-ani .continut-an {
  max-height: 17rem;
  overflow-y: auto;
  padding: 0.35rem 0.5rem;
}
.rand-istoric {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding: 0.5rem 0.4rem;
  border-bottom: 1px solid color-mix(in srgb, var(--bs-border-color) 45%, transparent);
}
.rand-istoric:last-child { border-bottom: 0; }
.rand-istoric .bulina {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.6rem;
  height: 1.6rem;
  border-radius: 0.5rem;
  flex-shrink: 0;
  font-size: 0.85rem;
}
.rand-istoric .detaliu {
  min-width: 0;
  flex: 1 1 auto;
}
.rand-istoric .titlu {
  font-size: 0.8125rem;
  color: var(--bs-heading-color);
}
.rand-istoric .sub {
  font-size: 0.75rem;
  color: var(--bs-secondary-color);
}
.rand-istoric .moment {
  flex-shrink: 0;
  text-align: right;
  font-size: 0.75rem;
  color: var(--bs-secondary-color);
  font-variant-numeric: tabular-nums;
}
.rand-istoric .moment small {
  display: block;
  opacity: 0.75;
}

/* punctele colorate din meniul de alegere a accentului */
.punct-accent {
  display: inline-block;
  width: 0.85rem;
  height: 0.85rem;
  margin-right: 0.55rem;
  border-radius: 50%;
  background: var(--pa);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18), 0 1px 2px rgba(0, 0, 0, 0.3);
  vertical-align: -0.1em;
}

/* butoane */
.btn-primary {
  background: var(--lux-auriu-suprafata) !important;
  border-color: var(--lux-grad-jos) !important;
  color: var(--lux-pe-auriu) !important;
  text-shadow: var(--lux-umbra-text);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--lux-accent-rgb), 0.35) !important;
}
.btn-primary .icon-base {
  color: var(--lux-pe-auriu) !important;
  filter: drop-shadow(0 1px 1px rgba(74, 52, 10, 0.3));
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-primary:first-child:active {
  background: linear-gradient(180deg, var(--lux-grad-sus-activ) 0%, var(--lux-grad-jos-activ) 100%) !important;
  border-color: var(--lux-grad-jos-activ) !important;
  color: var(--lux-pe-auriu) !important;
}
.btn-primary:disabled,
.btn-primary.disabled {
  background: rgba(var(--lux-accent-rgb), 0.45) !important;
  border-color: transparent !important;
  color: rgba(255, 250, 240, 0.65) !important;
  text-shadow: none;
}
.btn-outline-primary {
  border-color: var(--lux-accent) !important;
  color: var(--lux-accent) !important;
}
.btn-outline-primary:hover,
.btn-outline-primary:active,
.btn-outline-primary.active {
  background-color: rgba(var(--lux-accent-rgb), 0.16) !important;
  border-color: var(--lux-accent) !important;
  color: var(--lux-accent-deschis) !important;
}
.btn-text-primary {
  color: var(--lux-accent) !important;
}
.btn-text-primary:hover {
  background-color: rgba(var(--lux-accent-rgb), 0.12) !important;
  color: var(--lux-accent-deschis) !important;
}
.btn-label-primary {
  background-color: rgba(var(--lux-accent-rgb), 0.16) !important;
  color: var(--lux-accent) !important;
  border-color: transparent !important;
}
.btn-label-primary:hover,
.btn-label-primary:active {
  background: var(--lux-auriu-suprafata) !important;
  color: var(--lux-pe-auriu) !important;
  text-shadow: var(--lux-umbra-text);
}

/* fundaluri, texte, insigne */
.bg-primary { background-color: var(--lux-accent) !important; }
.text-primary { color: var(--lux-accent) !important; }
.border-primary { border-color: var(--lux-accent) !important; }
.bg-label-primary {
  background-color: rgba(var(--lux-accent-rgb), 0.16) !important;
  color: var(--lux-accent) !important;
}

/* meniul orizontal + navbar */
.menu-horizontal .menu-inner > .menu-item.active > .menu-link,
.menu-vertical .menu-inner > .menu-item.active > .menu-link {
  background: var(--lux-auriu-suprafata) !important;
  color: var(--lux-pe-auriu) !important;
  text-shadow: var(--lux-umbra-text);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--lux-accent-rgb), 0.35) !important;
}
.menu-horizontal .menu-inner > .menu-item.active > .menu-link .menu-icon,
.menu-vertical .menu-inner > .menu-item.active > .menu-link .menu-icon,
.menu-item.active:not(.open) > .menu-link.menu-toggle::after {
  color: var(--lux-pe-auriu) !important;
}
/* intrarea activa din submeniu: acelasi tratament ca in bara (fundal plin +
   text ivoriu). Varianta veche — accent pe accent transparent — era ilizibila
   la orice paleta. */
.menu-sub .menu-item.active > .menu-link,
.menu-sub .menu-item.active > .menu-link:hover {
  background: var(--lux-auriu-suprafata) !important;
  color: var(--lux-pe-auriu) !important;
  text-shadow: var(--lux-umbra-text);
}
.menu-sub .menu-item.active > .menu-link::before,
.menu-sub .menu-item.active > .menu-link .menu-icon,
.menu-sub .menu-item.active > .menu-link div {
  color: var(--lux-pe-auriu) !important;
  border-color: var(--lux-pe-auriu) !important;
}

/* formulare: focus, bife, comutatoare, selectii */
.form-control:focus,
.form-select:focus,
.camp-selector:focus,
.selector-cautare .camp-selector[aria-expanded="true"] {
  border-color: var(--lux-accent) !important;
  box-shadow: 0 0 0.25rem 0.05rem rgba(var(--lux-accent-rgb), 0.18) !important;
}
.form-check-input:checked,
.form-check-input[type="checkbox"]:indeterminate {
  background-color: var(--lux-accent) !important;
  border-color: var(--lux-accent) !important;
}
.form-check-input:focus {
  border-color: var(--lux-accent) !important;
  box-shadow: 0 0 0.25rem 0.05rem rgba(var(--lux-accent-rgb), 0.18) !important;
}
.form-switch .form-check-input:checked {
  background-color: var(--lux-accent) !important;
}
::selection {
  background: rgba(var(--lux-accent-rgb), 0.35);
}

/* paginatie, dropdownuri, taburi */
.page-item.active .page-link,
.pagination .page-link.active {
  background: var(--lux-auriu-suprafata) !important;
  border-color: var(--lux-grad-jos) !important;
  color: var(--lux-pe-auriu) !important;
  text-shadow: var(--lux-umbra-text);
  box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--lux-accent-rgb), 0.35) !important;
}
.page-link:hover {
  color: var(--lux-accent) !important;
}
.dropdown-item.active,
.dropdown-item:active {
  background-color: rgba(var(--lux-accent-rgb), 0.16) !important;
  color: var(--lux-accent) !important;
}
.nav-pills .nav-link.active,
.nav-tabs .nav-link.active {
  color: var(--lux-accent) !important;
}
.nav-tabs .nav-link.active {
  border-bottom-color: var(--lux-accent) !important;
}

/* componentele proprii care foloseau violetul */
.selector-cautare .element-optiune.activa,
.selector-multiplu .element-optiune:hover,
.selector-cautare .element-optiune:hover {
  background: rgba(var(--lux-accent-rgb), 0.12);
}
.selector-cautare .bifa {
  color: var(--lux-accent);
}
.zi-bifabila.active {
  background: var(--lux-auriu-suprafata) !important;
  border-color: var(--lux-grad-jos) !important;
  color: var(--lux-pe-auriu) !important;
  text-shadow: var(--lux-umbra-text);
}
.grila-tarife .celula-pret:hover,
.grila-tarife .celula-actiune:hover {
  background: rgba(var(--lux-accent-rgb), 0.16);
}

/* spinner, progres, alte accente */
.spinner-border.text-primary { color: var(--lux-accent) !important; }
.progress-bar { background: var(--lux-auriu-suprafata); color: var(--lux-pe-auriu); }

/* pe tema deschisa, auriul usor inchis pentru contrast pe alb */
[data-bs-theme="light"] .text-primary,
[data-bs-theme="light"] .btn-outline-primary,
[data-bs-theme="light"] .btn-text-primary,
[data-bs-theme="light"] .legatura-tip,
[data-bs-theme="light"] .legatura-card,
[data-bs-theme="light"] .sprinceana-lux {
  color: var(--lux-accent-inchis) !important;
}
[data-bs-theme="light"] .bg-label-primary {
  background-color: color-mix(in srgb, var(--lux-accent-inchis) 14%, transparent) !important;
  color: var(--lux-accent-inchis) !important;
}

/* ------------------------------------------------- calendarul lux (flatpickr)
   Acelasi datepicker premium in TOATA aplicatia: campul afisat primeste
   iconita aurie de calendar, calendarul deschis e pe tema noastra. */
/* pana cand flatpickr converteste inputul (ruleaza din footer, dar Chrome apuca sa
   picteze partea de sus a paginii inainte), ascundem inputul NATIV de data ca sa nu
   clipeasca varianta nestilizata a browserului. Dupa conversie el devine type=hidden
   si se arata altInput-ul .camp-data-lux. */
.navigator-zi input[type="date"]:not(.flatpickr-input) { opacity: 0; }

.camp-data-lux {
  padding-right: 2.4rem !important;
  background-color: var(--bs-paper-bg) !important;
  background-image: var(--lux-icon-calendar);
  background-repeat: no-repeat;
  background-position: right 0.8rem center;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.35) !important;
  border-radius: 0.5rem;
  color: var(--bs-heading-color) !important;
  font-weight: 500;
  letter-spacing: 0.01em;
  cursor: pointer;
  font-variant-numeric: tabular-nums;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 1px 3px rgba(0, 0, 0, 0.18);
  transition: border-color 0.15s, box-shadow 0.15s;
}
.camp-data-lux:hover {
  border-color: rgba(var(--lux-accent-rgb), 0.6) !important;
}
.camp-data-lux:focus,
.camp-data-lux.active {
  border-color: var(--lux-accent) !important;
  box-shadow: 0 0 0.3rem 0.08rem rgba(var(--lux-accent-rgb), 0.22) !important;
}

.flatpickr-calendar {
  /* ATENTIE: --bs-card-bg exista doar in .card; popupul sta pe body, deci
     folosim --bs-paper-bg (definita global) — altfel iese transparent.
     z-index peste modalele Bootstrap (1055) — altfel calendarul se deschide
     IN SPATELE modalului si pare ca nu merge */
  z-index: 1090 !important;
  background: var(--bs-paper-bg) !important;
  border: 1px solid var(--bs-border-color) !important;
  border-radius: 0.75rem !important;
  box-shadow: 0 0.75rem 2.5rem rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(var(--lux-accent-rgb), 0.08) !important;
  padding: 0.65rem 0.75rem 0.8rem;
  /* latime FIXA (incape si "Septembrie 2026") + 6 randuri rezervate:
     dimensiunea nu se mai schimba cand navighezi intre luni */
  width: 20.5rem !important;
}
.flatpickr-calendar .flatpickr-innerContainer,
.flatpickr-calendar .flatpickr-rContainer,
.flatpickr-calendar .flatpickr-weekdays,
.flatpickr-calendar .flatpickr-days {
  width: 100% !important;
  max-width: none !important;
}
.flatpickr-calendar .flatpickr-days {
  display: flex;
  justify-content: center;
}
.flatpickr-calendar .dayContainer {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 15.2rem;
  align-content: flex-start;
  justify-content: flex-start;
}
/* coloane exacte de 1/7: zilele stau mereu sub LU..DU, iar randul
   incomplet incepe de la stanga, nu sare in mijloc */
.flatpickr-calendar .flatpickr-day {
  flex: 0 0 14.2857% !important;
  width: 14.2857% !important;
  max-width: 14.2857% !important;
  margin: 0 !important;
}
.flatpickr-calendar span.flatpickr-weekday {
  flex: 0 0 14.2857% !important;
  width: 14.2857% !important;
  max-width: 14.2857% !important;
  margin: 0 !important;
  text-align: center;
}
.flatpickr-calendar .flatpickr-weekdaycontainer {
  width: 100% !important;
}
.flatpickr-calendar::before,
.flatpickr-calendar::after {
  display: none; /* fara sageata — pluteste curat, ca la aplicatiile mari */
}

/* butonul "Astăzi" din calendar (adaugat global in initDatepickere) */
.flatpickr-bara-azi {
  margin-top: 0.55rem;
  padding-top: 0.55rem;
  border-top: 1px solid color-mix(in srgb, var(--bs-border-color) 55%, transparent);
}
.flatpickr-buton-azi {
  display: block;
  width: 100%;
  border: 0;
  background: transparent;
  padding: 0.45rem 0;
  border-radius: 0.5rem;
  color: var(--lux-accent);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  transition: background 0.15s, color 0.15s;
}
.flatpickr-buton-azi:hover {
  background: rgba(var(--lux-accent-rgb), 0.14);
  color: var(--lux-accent-deschis);
}
span.flatpickr-weekday {
  color: var(--lux-accent) !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.flatpickr-day {
  color: var(--bs-body-color) !important;
  border-radius: 0.5rem !important;
  font-variant-numeric: tabular-nums;
  border: 1px solid transparent !important;
  line-height: 2.4rem;
  height: 2.5rem;
  transition: background 0.12s, color 0.12s;
}
.flatpickr-day:hover,
.flatpickr-day:focus {
  background: rgba(var(--lux-accent-rgb), 0.16) !important;
  color: var(--bs-heading-color) !important;
}
.flatpickr-day.today {
  border-color: rgba(var(--lux-accent-rgb), 0.6) !important;
}
.flatpickr-day.today:hover {
  background: rgba(var(--lux-accent-rgb), 0.16) !important;
  color: var(--bs-heading-color) !important;
}
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected:hover {
  background: var(--lux-auriu-suprafata) !important;
  border-color: var(--lux-grad-jos) !important;
  color: var(--lux-pe-auriu) !important;
  text-shadow: var(--lux-umbra-text);
  font-weight: 600;
  box-shadow: 0 0.2rem 0.6rem rgba(var(--lux-accent-rgb), 0.35);
}
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover,
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
  color: color-mix(in srgb, var(--bs-body-color) 32%, transparent) !important;
}
.flatpickr-day.inRange {
  background: rgba(var(--lux-accent-rgb), 0.12) !important;
  box-shadow: none !important;
  border-color: transparent !important;
}
/* sagetile de an: doua chevron-uri aurii, redesenate (cele din Vuexy se
   suprapuneau si aratau ca un x); apar la hover, langa an */
/* ------------------------------------------------- marca lux (logo + wordmark)
   Emblema (arcada cu diamant) e in partials/logo.php; acelasi vector e si
   faviconul (img/favicon/favicon.svg, fundal transparent). Wordmarkul:
   serifa Cormorant Garamond, majuscule spatiate — ton Ritz/Waldorf. */
.marca-lux {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 600;
  font-size: 1.16rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--bs-heading-color);
  line-height: 1;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  transform: translateY(1px); /* aliniere optica cu emblema */
}
/* spatiul dintre cuvinte: doar aer, fara linie — HOTELUL MEU, ton Marriott */
.marca-spatiu {
  display: inline-block;
  width: 0.5em;
}
/* denumirea hotelului langa emblema: incape oricat de lunga ar fi —
   se taie elegant cu puncte de suspensie, numele intreg sta in title */
.app-brand-link { min-width: 0; }
.marca-hotel {
  display: block;
  max-width: 17rem;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: 0.12em;
}
@media (max-width: 1399.98px) { .marca-hotel { max-width: 12rem; } }
@media (max-width: 1199.98px) {
  /* in sertarul de meniu (mobil/tableta) numele umple spatiul ramas */
  .layout-menu .marca-hotel { max-width: 100%; flex: 1 1 auto; }
}
.app-brand-logo svg {
  display: block;
}
.marca-lux-mare {
  font-size: 1.55rem;
  letter-spacing: 0.24em;
}
.authentication-wrapper .app-brand-logo svg {
  width: 52px;
  height: 52px;
}
.authentication-wrapper .app-brand {
  flex-direction: column;
  gap: 0.9rem;
}

/* --------------------------------------------- navigatorul de zi (pastila)
   Un singur control segmentat premium: [Astăzi][‹][data][›] — „Astăzi" e
   MEREU vizibil (nu sare layoutul): stins ca indicator cand esti pe azi,
   auriu plin cand esti pe alta zi. */
.navigator-zi {
  display: inline-flex;
  align-items: stretch;
  /* aceeasi inaltime cu butoanele btn-primary de langa (masurat: 38px) */
  height: 2.375rem;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.35);
  border-radius: 0.55rem;
  background: var(--bs-paper-bg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 1px 3px rgba(0, 0, 0, 0.18);
  overflow: hidden;
  gap: 0;
}
.navigator-zi .segment-nav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.8rem;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: var(--lux-accent);
  border-right: 1px solid rgba(var(--lux-accent-rgb), 0.22);
  transition: background 0.15s, color 0.15s;
  white-space: nowrap;
}
/* grupul de interval (7/15/30 zile): aceeasi pastila ca navigatorul,
   segmentul activ pe auriul butoanelor primare */
.grup-interval {
  display: inline-flex;
  align-items: stretch;
  height: 2.375rem;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.35);
  border-radius: 0.55rem;
  background: var(--bs-paper-bg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 1px 3px rgba(0, 0, 0, 0.18);
  overflow: hidden;
}
.grup-interval .segment-interval {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 0.85rem;
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--lux-accent);
  white-space: nowrap;
  transition: background 0.15s, color 0.15s;
}
.grup-interval .segment-interval + .segment-interval {
  border-left: 1px solid rgba(var(--lux-accent-rgb), 0.22);
}
.grup-interval .segment-interval:hover {
  background: rgba(var(--lux-accent-rgb), 0.12);
  color: var(--lux-accent-deschis);
}
.grup-interval .segment-interval.activ {
  background: linear-gradient(180deg, var(--lux-grad-sus), var(--lux-grad-jos));
  color: var(--lux-pe-auriu);
  text-shadow: var(--lux-umbra-text);
}
.navigator-zi .segment-nav:hover {
  background: rgba(var(--lux-accent-rgb), 0.12);
  color: var(--lux-accent-deschis);
}
.navigator-zi .segment-sageata {
  padding: 0 0.55rem;
}
.navigator-zi .segment-sageata .icon-base {
  font-size: 1rem;
  width: 1rem;
  height: 1rem;
}
.navigator-zi form {
  display: flex;
  align-items: stretch;
  margin: 0;
}
.navigator-zi .camp-data-lux {
  border: 0 !important;
  border-right: 1px solid rgba(var(--lux-accent-rgb), 0.22) !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  box-shadow: none !important;
  height: 100% !important;
  min-height: 0 !important;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 10.2rem;
}
.navigator-zi > .segment-nav:last-child {
  border-right: 0 !important;
}
.navigator-zi form {
  flex: 1 1 auto;
}
.navigator-zi .camp-data-lux {
  width: 100%;
  text-align: center;
  background-position: right 0.7rem center;
}

/* pe desktop, in panou, pastila are exact latimea cardului Istoric actiuni
   (coloana din dreapta, col-xxl-3 cu jgheabul g-6) */
@media (min-width: 1400px) {
  .antet-panou-zi .navigator-zi {
    width: calc(25% - 1.125rem);
    min-width: 19rem;
  }
}

/* ------------------------------------ selecturile, TOATE, pe tema lux
   (native form-select, selectoarele proprii cu cautare, meniurile dropdown) —
   REGULA: orice select/dropdown viitor mosteneste automat tratamentul asta. */
.form-select {
  background-image: var(--lux-icon-sageata) !important;
  background-size: 1.05rem;
}
.form-select:hover,
.camp-selector:hover {
  border-color: rgba(var(--lux-accent-rgb), 0.55) !important;
}
.form-select option:checked {
  background: rgba(var(--lux-accent-rgb), 0.22);
  color: var(--lux-accent-deschis);
}
.dropdown-menu {
  border: 1px solid var(--bs-border-color);
  box-shadow: 0 0.5rem 1.75rem rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(var(--lux-accent-rgb), 0.06);
}
.dropdown-item:hover,
.dropdown-item:focus {
  background-color: rgba(var(--lux-accent-rgb), 0.12) !important;
  color: var(--lux-accent-deschis) !important;
}
.dropdown-item:hover .icon-base,
.dropdown-item:focus .icon-base {
  color: var(--lux-accent-deschis) !important;
}
.dropdown-item.text-danger:hover,
.dropdown-item.text-danger:focus {
  background-color: rgba(192, 90, 95, 0.12) !important;
  color: var(--bs-danger) !important;
}
.dropdown-item.text-danger:hover .icon-base {
  color: var(--bs-danger) !important;
}
.selector-multiplu-meniu .element-optiune:hover,
.selector-hotel-meniu .element-hotel:hover,
.selector-cautare .element-optiune:hover {
  background: rgba(var(--lux-accent-rgb), 0.12) !important;
}
.selector-cautare .optiune-select.activa,
.selector-hotel-meniu .element-hotel.activ {
  color: var(--lux-accent-deschis) !important;
}
.selector-multiplu-meniu .cautare,
.selector-hotel-meniu .cautare {
  background: linear-gradient(180deg, rgba(var(--lux-accent-rgb), 0.05), transparent);
}

/* ------------------------- antetul calendarului, redesenat:
   [«][‹]   August 2026   [›][»]  — dublu-chevron = an, chevron = luna;
   patru butoane identice, aurii; anul ramane editabil prin tastare */
.flatpickr-calendar .flatpickr-months {
  position: relative;
  display: flex;
  align-items: center;
  height: 2.85rem;
  margin-bottom: 0.5rem;
  padding: 0 0 0.5rem;
  border-bottom: 1px solid color-mix(in srgb, var(--bs-border-color) 55%, transparent);
}
.flatpickr-calendar .flatpickr-month {
  position: static !important;
  display: flex;
  align-items: center;
  width: 100%;
  height: auto !important;
  overflow: visible;
  color: var(--bs-heading-color) !important;
  fill: var(--bs-heading-color) !important;
}
.flatpickr-calendar .flatpickr-current-month {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.34rem;
  line-height: 1 !important;
  width: 100% !important;
  height: auto !important;
  padding: 0 4.6rem !important;
  font-size: 0.98rem !important;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: none;
  white-space: nowrap;
}
.flatpickr-calendar .flatpickr-current-month .cur-month {
  margin: 0 !important;
  font-size: inherit !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  display: inline-block;
}
.flatpickr-calendar .flatpickr-current-month .numInputWrapper {
  display: inline-flex !important;
  align-items: center !important;
  position: static !important;
  width: 3rem !important;
  padding: 0 !important;
  background: transparent !important;
  line-height: 1 !important;
}
.flatpickr-calendar .flatpickr-current-month .numInputWrapper span {
  display: none !important;
}
.flatpickr-calendar .flatpickr-current-month input.cur-year {
  padding: 0 !important;
  margin: 0 !important;
  height: auto !important;
  font-size: inherit !important;
  font-weight: 600 !important;
  font-variant-numeric: tabular-nums;
  line-height: 1 !important;
  display: block !important;
  color: var(--lux-accent) !important;
  cursor: text !important;
}

/* cele 4 butoane de navigare: aceeasi forma, acelasi auriu */
.flatpickr-calendar .flatpickr-prev-month,
.flatpickr-calendar .flatpickr-next-month,
.flatpickr-calendar .buton-an {
  position: absolute !important;
  top: 0.1rem !important;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.9rem;
  height: 1.9rem;
  padding: 0 !important;
  border: 0;
  border-radius: 0.5rem;
  background: transparent;
  color: var(--lux-accent) !important;
  fill: var(--lux-accent) !important;
  cursor: pointer;
  transition: background 0.15s;
}
.flatpickr-calendar .buton-an.an-inapoi { left: 0.1rem; }
.flatpickr-calendar .flatpickr-prev-month { left: 2.15rem !important; right: auto !important; }
.flatpickr-calendar .flatpickr-next-month { right: 2.15rem !important; left: auto !important; }
.flatpickr-calendar .buton-an.an-inainte { right: 0.1rem; }
.flatpickr-calendar .flatpickr-prev-month:hover,
.flatpickr-calendar .flatpickr-next-month:hover,
.flatpickr-calendar .buton-an:hover {
  background: rgba(var(--lux-accent-rgb), 0.14);
}
.flatpickr-calendar .flatpickr-prev-month svg,
.flatpickr-calendar .flatpickr-next-month svg,
.flatpickr-calendar .buton-an svg {
  width: 0.95rem;
  height: 0.95rem;
  display: block;
  fill: none !important;
  stroke: var(--lux-accent);
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.flatpickr-calendar .flatpickr-prev-month:hover svg,
.flatpickr-calendar .flatpickr-next-month:hover svg,
.flatpickr-calendar .buton-an:hover svg {
  stroke: var(--lux-accent-deschis);
}

/* -------------------- intrarile din Istoric actiuni (panou), grupate atent */
.intrare-istoric {
  position: relative;
  padding: 0.55rem 0 0.9rem 2.75rem;
}
/* firul de timeline: porneste de sub medalion si coboara pana la urmatorul */
.intrare-istoric::before {
  content: '';
  position: absolute;
  left: calc(1rem - 1px);
  top: 2.85rem;
  bottom: -0.65rem;
  width: 2px;
  border-radius: 2px;
  background: linear-gradient(180deg, rgba(var(--lux-accent-rgb), 0.4), rgba(var(--lux-accent-rgb), 0.12));
}
.intrare-istoric:last-child::before {
  display: none;
}
.cap-intrare {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
}
.medalion-istoric {
  position: absolute;
  left: 0;
  top: 0.55rem;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 0.55rem;
  background: rgba(var(--lux-accent-rgb), 0.14);
  border: 1px solid rgba(var(--lux-accent-rgb), 0.3);
  color: var(--lux-accent);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.06em;
}
.titlu-intrare {
  min-width: 0;
  flex: 1;
}
.actiune-intrare {
  display: block;
  font-size: 0.855rem;
  font-weight: 600;
  color: var(--bs-heading-color);
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.autor-intrare {
  display: block;
  font-size: 0.74rem;
  color: var(--bs-secondary-color);
  letter-spacing: 0.03em;
}
.ora-intrare {
  flex-shrink: 0;
  align-self: flex-start;
  font-size: 0.74rem;
  color: var(--bs-secondary-color);
  font-variant-numeric: tabular-nums;
}
.corp-intrare {
  margin: 0.45rem 0 0;
}
.rand-detaliu {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.14rem 0;
  font-size: 0.78rem;
}
.eticheta-detaliu {
  color: var(--bs-secondary-color);
  flex-shrink: 0;
}
.valoare-detaliu {
  color: var(--bs-heading-color);
  font-weight: 500;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.nota-detaliu {
  padding: 0.14rem 0;
  font-size: 0.78rem;
  color: var(--bs-secondary-color);
  line-height: 1.45;
}
.subsol-intrare {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin: 0.4rem 0 0;
  font-size: 0.7rem;
  color: var(--bs-secondary-color);
  letter-spacing: 0.03em;
}
.cod-intrare {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--bs-font-monospace, monospace);
  font-size: 0.68rem;
  opacity: 0.85;
}
.numar-intrare {
  margin-left: auto;
  flex-shrink: 0;
  font-variant-numeric: tabular-nums;
}

/* ------------------- scrollbaruri aurii PESTE TOT (REGULA: nicio bara gri)
   Se aplica global: pagina, tabele cu scroll, selectoare, dropdownuri,
   meniuri — orice element care deruleaza, acum si in viitor. */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(var(--lux-accent-rgb), 0.55) transparent;
}
*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
*::-webkit-scrollbar-track {
  background: transparent;
}
*::-webkit-scrollbar-corner {
  background: transparent;
}
*::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(211, 174, 110, 0.75), rgba(184, 145, 77, 0.75));
  border-radius: 4px;
}
*::-webkit-scrollbar-thumb:horizontal {
  background: linear-gradient(90deg, rgba(211, 174, 110, 0.75), rgba(184, 145, 77, 0.75));
}
*::-webkit-scrollbar-thumb:hover {
  background: var(--lux-accent);
}
/* perfect-scrollbar (meniul Vuexy) pe aceeasi paleta */
.ps__thumb-y,
.ps__thumb-x {
  background-color: rgba(var(--lux-accent-rgb), 0.65) !important;
}
.ps__rail-y:hover > .ps__thumb-y,
.ps__rail-x:hover > .ps__thumb-x,
.ps--clicking .ps__thumb-y,
.ps--clicking .ps__thumb-x {
  background-color: var(--lux-accent) !important;
}
.ps__rail-y:hover,
.ps__rail-x:hover,
.ps--clicking .ps__rail-y,
.ps--clicking .ps__rail-x {
  background-color: rgba(var(--lux-accent-rgb), 0.08) !important;
}

/* filtrul pe utilizator din titlul Istoric actiuni + nuantele medalioanelor */
.filtru-istoric {
  min-width: 0;
  flex: 1;
}
.buton-filtru-istoric {
  border: 0;
  background: transparent;
  padding: 0;
  max-width: 100%;
  cursor: pointer;
}
.buton-filtru-istoric .sageata-filtru {
  font-size: 0.85rem !important;
  color: var(--bs-secondary-color);
  flex-shrink: 0;
}
.filtru-istoric .selector-multiplu-meniu {
  min-width: 15rem;
}
.filtru-istoric .element-optiune {
  text-decoration: none;
}
.medalion-istoric.nuanta-success { background: rgba(74, 165, 119, 0.14); border-color: rgba(74, 165, 119, 0.3); color: var(--bs-success); }
.medalion-istoric.nuanta-info { background: rgba(79, 157, 173, 0.13); border-color: rgba(79, 157, 173, 0.3); color: var(--bs-info); }
.medalion-istoric.nuanta-warning { background: rgba(217, 160, 91, 0.14); border-color: rgba(217, 160, 91, 0.3); color: var(--bs-warning); }
.medalion-istoric.nuanta-danger { background: rgba(192, 90, 95, 0.14); border-color: rgba(192, 90, 95, 0.3); color: var(--bs-danger); }
.medalion-istoric.nuanta-primary { background: rgba(var(--lux-accent-rgb), 0.14); border-color: rgba(var(--lux-accent-rgb), 0.3); color: var(--lux-accent); }
.medalion-istoric.nuanta-secondary { background: color-mix(in srgb, var(--bs-secondary-color) 12%, transparent); border-color: color-mix(in srgb, var(--bs-secondary-color) 28%, transparent); color: var(--bs-secondary-color); }
.valoare-detaliu .valoare-veche {
  color: var(--bs-secondary-color);
  font-weight: 400;
}
.valoare-detaliu strong {
  font-weight: 600;
  color: var(--bs-heading-color);
}
.legatura-entitate {
  color: var(--lux-accent) !important;
  font-weight: 600;
}
.legatura-entitate:hover {
  text-decoration: underline;
}

/* taburile din clopotel (Task-uri / Channel Manager) */
.taburi-notificari {
  border-bottom: 0;
  gap: 0.25rem;
}
.taburi-notificari .nav-link {
  padding: 0.45rem 0.8rem;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--bs-secondary-color);
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
}
.taburi-notificari .nav-link.active {
  color: var(--lux-accent) !important;
  border-bottom-color: var(--lux-accent) !important;
  background: transparent !important;
}
.contor-tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.05rem;
  height: 1.05rem;
  padding: 0 0.28rem;
  margin-left: 0.25rem;
  border-radius: 1rem;
  /* aceeasi culoare ca badge-ul rosu de pe clopotel (sus) */
  background: var(--bs-danger);
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

/* ================================================= MODALELE, pe tema lux
   X-ul sta IN modal (nu pe muchie), titlul pe culoarea de contrast, antet cu
   tenta aurie fina, colturi generoase, umbra adanca. Global, orice modal. */
.modal-content {
  background: var(--bs-paper-bg);
  border: 1px solid var(--bs-border-color);
  border-radius: 0.9rem;
  box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(var(--lux-accent-rgb), 0.07);
}
.modal-header {
  padding: 1.15rem 1.4rem 0.95rem;
  border-bottom: 1px solid color-mix(in srgb, var(--bs-border-color) 60%, transparent);
  background: linear-gradient(180deg, rgba(var(--lux-accent-rgb), 0.05), transparent);
  border-top-left-radius: 0.9rem;
  border-top-right-radius: 0.9rem;
}
.modal-title {
  color: var(--bs-heading-color) !important;
  font-weight: 600;
  letter-spacing: 0.01em;
}
.modal .btn-close,
.modal .modal-header .btn-close {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  margin: -0.2rem -0.2rem -0.2rem auto !important;
  width: 2.05rem;
  height: 2.05rem;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: transparent !important;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.5rem;
  box-shadow: none !important;
  transition: border-color 0.15s, background-color 0.15s;
}
.modal .btn-close::before {
  background-color: var(--bs-secondary-color);
}
.modal .btn-close:hover,
.modal .btn-close:focus {
  background-color: rgba(var(--lux-accent-rgb), 0.12) !important;
  border-color: rgba(var(--lux-accent-rgb), 0.55);
  transform: none !important;
}
.modal .btn-close:hover::before {
  background-color: var(--lux-accent);
}
.modal .modal-footer,
.modal-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
  padding: 1.1rem 1.4rem !important;
  border-top: 1px solid color-mix(in srgb, var(--bs-border-color) 60%, transparent);
}
.modal .modal-footer > *,
.modal-footer > * {
  margin: 0 !important;
}
.modal-backdrop {
  background-color: #0d0e19;
}
.modal-backdrop.show {
  opacity: 0.6;
}

/* ============================================ SWEETALERT, pe tema lux
   Acelasi limbaj ca modalul: BRAU sus (banda aurie cu linia despartitoare,
   medalionul sta in ea), corp compact cu totul centrat, butoane aurii. */
div:where(.swal2-container) div:where(.swal2-popup),
.swal2-popup {
  position: relative;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  background: var(--bs-paper-bg) !important;
  color: var(--bs-body-color) !important;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.9rem !important;
  box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(var(--lux-accent-rgb), 0.07) !important;
  padding: 1.5rem 1.5rem 0 !important;
  width: 23rem !important;
  overflow: hidden;
}
.swal2-title {
  color: var(--bs-heading-color) !important;
  font-size: 1.02rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
  text-align: center !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100%;
}
.swal2-icon + .swal2-title,
.swal2-title {
  order: 0;
}
.swal2-html-container {
  color: var(--bs-secondary-color) !important;
  font-size: 0.87rem !important;
  line-height: 1.5;
  text-align: center !important;
  margin: 0.45rem 0 0 !important;
  padding: 0 !important;
  width: 100%;
}
/* braul: banda aurie JOS, cu linia despartitoare deasupra butoanelor */
.swal2-actions {
  width: calc(100% + 3rem) !important;
  margin: 1.2rem -1.5rem 0 !important;
  padding: 0.95rem 1.5rem;
  gap: 0.65rem;
  justify-content: center !important;
  border-top: 1px solid color-mix(in srgb, var(--bs-border-color) 70%, transparent);
  background: linear-gradient(180deg, rgba(var(--lux-accent-rgb), 0.07), rgba(var(--lux-accent-rgb), 0.16));
}
/* toasturile fara butoane isi pastreaza doar aerul de jos */
.swal2-popup:not(:has(.swal2-actions:not([style*='display: none']))) {
  padding-bottom: 1.35rem !important;
}
button:where(.swal2-styled):where(.swal2-confirm),
.swal2-styled.swal2-confirm {
  background: var(--lux-auriu-suprafata) !important;
  border: 1px solid var(--lux-grad-jos) !important;
  color: var(--lux-pe-auriu) !important;
  text-shadow: var(--lux-umbra-text);
  border-radius: 0.5rem !important;
  padding: 0.5rem 1.25rem !important;
  font-weight: 600;
  margin: 0 !important;
  box-shadow: 0 0.125rem 0.375rem 0 rgba(var(--lux-accent-rgb), 0.35) !important;
}
button:where(.swal2-styled):where(.swal2-confirm):hover,
.swal2-styled.swal2-confirm:hover {
  background: linear-gradient(180deg, var(--lux-grad-sus-activ) 0%, var(--lux-grad-jos-activ) 100%) !important;
}
/* butonul „Închide" din modale: acelasi tratament ca „Renunță" din
   confirmari — contur limpede si text luminos, ca sa se vada si pe intunecat
   (varianta doar-text se pierdea in fundal) */
/* fereastra de configurare a canalelor (ecran incorporat al furnizorului) */
.cadru-canale {
  width: 100%;
  height: min(78vh, 46rem);
  border: 0;
  display: block;
  background: #fff;
}
.incarcare-canale {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 12rem;
  color: var(--bs-secondary-color);
  font-size: 0.875rem;
}

.modal-footer .btn-text-secondary,
.modal-footer [data-bs-dismiss="modal"].btn-text-secondary {
  background: color-mix(in srgb, var(--bs-secondary-color) 20%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--bs-secondary-color) 55%, transparent) !important;
  color: var(--bs-heading-color) !important;
  font-weight: 600;
}
.modal-footer .btn-text-secondary:hover,
.modal-footer [data-bs-dismiss="modal"].btn-text-secondary:hover {
  background: color-mix(in srgb, var(--bs-secondary-color) 34%, transparent) !important;
  border-color: color-mix(in srgb, var(--bs-secondary-color) 75%, transparent) !important;
  color: var(--bs-heading-color) !important;
}

/* butonul de renuntare: contur limpede + text luminos. Varianta veche se
   pierdea pe fundalul inchis al ferestrei — si pentru ca tintea clasa
   .swal2-styled, pe care butoanele NU o au: noi le dam stiluri proprii
   (buttonsStyling: false), deci se coloreaza dupa .swal2-cancel + .btn */
.swal2-popup .swal2-cancel,
button:where(.swal2-styled):where(.swal2-cancel),
.swal2-styled.swal2-cancel {
  background: color-mix(in srgb, var(--bs-secondary-color) 20%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--bs-secondary-color) 55%, transparent) !important;
  color: var(--bs-heading-color) !important;
  border-radius: 0.5rem !important;
  padding: 0.5rem 1.25rem !important;
  font-weight: 600;
  margin: 0 !important;
}
.swal2-popup .swal2-cancel:hover,
button:where(.swal2-styled):where(.swal2-cancel):hover,
.swal2-styled.swal2-cancel:hover {
  background: color-mix(in srgb, var(--bs-secondary-color) 34%, transparent) !important;
  border-color: color-mix(in srgb, var(--bs-secondary-color) 75%, transparent) !important;
}
.swal2-styled:focus,
.swal2-styled.swal2-confirm:focus {
  box-shadow: 0 0 0.3rem 0.08rem rgba(var(--lux-accent-rgb), 0.25) !important;
}
/* medalionul static, sus, in fluxul normal */
.swal2-icon {
  position: relative !important;
  width: 2.6rem !important;
  height: 2.6rem !important;
  margin: 0.1rem auto 0.75rem !important;
  border-width: 1px !important;
  border-style: solid !important;
  border-radius: 0.65rem !important;
  animation: none !important;
  background-color: var(--bs-paper-bg) !important;
  box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.25);
}
.swal2-icon .swal2-icon-content,
.swal2-icon .swal2-success-ring,
.swal2-icon .swal2-success-fix,
.swal2-icon [class^='swal2-success-line'],
.swal2-icon [class^='swal2-success-circular'],
.swal2-icon .swal2-x-mark {
  display: none !important;
}
.swal2-icon::after {
  content: '';
  position: absolute;
  inset: 0;
  margin: auto;
  width: 1.35rem;
  height: 1.35rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.swal2-icon.swal2-question { border-color: rgba(var(--lux-accent-rgb), 0.5) !important; }
.swal2-icon.swal2-question::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9a96a' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 8a3.5 3 0 0 1 3.5 -3h1a3.5 3 0 0 1 3.5 3a3 3 0 0 1 -2 3a3 4 0 0 0 -2 4'/%3E%3Cpath d='M12 19l0 .01'/%3E%3C/svg%3E");
}
.swal2-icon.swal2-warning { border-color: rgba(217, 160, 91, 0.5) !important; }
.swal2-icon.swal2-warning::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d9a05b' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 9v4'/%3E%3Cpath d='M10.363 3.591l-8.106 13.534a1.914 1.914 0 0 0 1.636 2.871h16.214a1.914 1.914 0 0 0 1.636 -2.87l-8.106 -13.536a1.914 1.914 0 0 0 -3.274 0z'/%3E%3Cpath d='M12 16h.01'/%3E%3C/svg%3E");
}
.swal2-icon.swal2-success { border-color: rgba(74, 165, 119, 0.5) !important; }
.swal2-icon.swal2-success::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234aa577' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5l10 -10'/%3E%3C/svg%3E");
}
.swal2-icon.swal2-error { border-color: rgba(192, 90, 95, 0.5) !important; }
.swal2-icon.swal2-error::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c05a5f' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6l-12 12'/%3E%3Cpath d='M6 6l12 12'/%3E%3C/svg%3E");
}
.swal2-icon.swal2-info { border-color: rgba(79, 157, 173, 0.5) !important; }
.swal2-icon.swal2-info::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234f9dad' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 9h.01'/%3E%3Cpath d='M11 12h1v4h1'/%3E%3Cpath d='M12 3a9 9 0 1 0 0 18a9 9 0 0 0 0 -18z'/%3E%3C/svg%3E");
}
.swal2-timer-progress-bar {
  background: rgba(var(--lux-accent-rgb), 0.6) !important;
}
.swal2-container.swal2-backdrop-show {
  background: rgba(13, 14, 25, 0.6) !important;
}

/* ------------------- controale pe acelasi rand = ACEEASI inaltime (REGULA)
   Selecturile, inputurile, datepickerul si butoanele de langa ele au toate
   inaltimea standard — variantele -sm/-lg nu se amesteca pe acelasi rand. */
.selector-cautare .camp-selector,
.selector-multiplu .camp-selector {
  min-height: calc(1.5em + 0.9375rem + calc(var(--bs-border-width) * 2));
  display: flex;
  align-items: center;
}
/* sageata selecturilor: lipita corect de marginea dreapta, nu spre mijloc */
.form-select,
.selector-cautare .camp-selector,
.selector-multiplu .camp-selector {
  background-position: right 0.8rem center !important;
  padding-right: 2.4rem !important;
}

/* ---------------------------------------------------- toasturile lux
   Mesajele trecatoare apar jos-dreapta (jos pe mobil), se inchid singure
   dupa timpul de citire; bara de scurgere aurie pe marginea de SUS, X ca la
   modal; la hover scurgerea se opreste. */
.zona-toasturi {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 1400;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  width: 26rem;
  max-width: calc(100vw - 2.5rem);
}
.toast-lux {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem 2.7rem 1rem 1rem;
  background: var(--bs-paper-bg);
  border: 1px solid var(--bs-border-color);
  border-radius: 0.8rem;
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(var(--lux-accent-rgb), 0.07);
  overflow: hidden;
  animation: toast-intrare 0.25s ease;
}
.toast-lux.toast-iesire {
  animation: toast-iesire 0.22s ease forwards;
}
@keyframes toast-intrare {
  from { opacity: 0; transform: translateY(0.6rem); }
}
@keyframes toast-iesire {
  to { opacity: 0; transform: translateY(0.4rem); }
}
.medalion-toast {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 0.55rem;
  border: 1px solid;
}
.medalion-toast.nuanta-success { background: rgba(74, 165, 119, 0.14); border-color: rgba(74, 165, 119, 0.3); color: var(--bs-success); }
.medalion-toast.nuanta-danger { background: rgba(192, 90, 95, 0.14); border-color: rgba(192, 90, 95, 0.3); color: var(--bs-danger); }
.medalion-toast.nuanta-warning { background: rgba(217, 160, 91, 0.14); border-color: rgba(217, 160, 91, 0.3); color: var(--bs-warning); }
.medalion-toast.nuanta-info { background: rgba(79, 157, 173, 0.13); border-color: rgba(79, 157, 173, 0.3); color: var(--bs-info); }
.continut-toast {
  min-width: 0;
  flex: 1;
  font-size: 0.855rem;
  color: var(--bs-body-color);
  line-height: 1.5;
}
/* toast scurt (o linie): medalion centrat cu textul — regula implicita de mai sus.
   toast cu TITLU (avertismente lungi, ex. acoperirea preturilor): medalionul sta
   SUS, langa titlu, nu plutind in mijlocul blocului inalt */
/* toastul cu titlu: continutul incepe de sus (titlul e primul lucru) */
.toast-lux.toast-cu-titlu { align-items: flex-start; }
/* titlul = HEADER diferentiat ca la Swal: mai mare, bold, separat de continut
   printr-o linie. Iconul sta IN titlu, centrat vertical cu textul. */
.continut-toast .alert-heading {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--bs-heading-color);
  margin: 0 0 0.7rem;
  padding-bottom: 0.7rem;
  border-bottom: 1px solid var(--bs-border-color);
}
.continut-toast .alert-heading .medalion-toast { margin: 0; }
/* tabelul dintr-un toast = tabel ADEVARAT, nu texte aruncate: cap cu linie,
   randuri despartite subtil, coloane cu spatiu egal */
.continut-toast .table {
  margin-bottom: 0.4rem;
  width: auto;
  border-collapse: collapse;
}
.continut-toast .table th {
  padding: 0.15rem 1rem 0.35rem 0.6rem;
  font-size: 0.7rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--bs-secondary-color);
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--bs-border-color);
  text-align: left;
  white-space: nowrap;
}
.continut-toast .table td {
  padding: 0.4rem 1rem 0.4rem 0.6rem;
  font-size: 0.82rem;
  color: var(--bs-body-color);
  background: transparent;
  border: 0;
  border-bottom: 1px solid color-mix(in srgb, var(--bs-border-color) 55%, transparent);
  vertical-align: middle;
  white-space: nowrap;
}
/* ultima coloana (butonul) se lipeste la dreapta, restul primesc tot spatiul */
.continut-toast .table th:last-child,
.continut-toast .table td:last-child { padding-right: 0; text-align: right; }
.continut-toast .table tr:last-child td { border-bottom: 0; }
.continut-toast .table th:first-child,
.continut-toast .table td:first-child { padding-left: 0; }
.inchide-toast {
  position: absolute;
  top: 0.6rem;
  right: 0.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.8rem;
  height: 1.8rem;
  padding: 0;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.45rem;
  background: transparent;
  color: var(--bs-secondary-color);
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.inchide-toast:hover {
  background: rgba(var(--lux-accent-rgb), 0.12);
  border-color: rgba(var(--lux-accent-rgb), 0.55);
  color: var(--lux-accent);
}
.toast-progres {
  position: absolute;
  top: 0;
  left: 0;
  height: 3px;
  width: 100%;
  background: linear-gradient(90deg, var(--lux-grad-sus), var(--lux-grad-jos));
  border-radius: 0 2px 2px 0;
  animation-name: toast-scurgere;
  animation-timing-function: linear;
  animation-fill-mode: forwards;
}
.toast-lux:hover .toast-progres {
  animation-play-state: paused;
}
@keyframes toast-scurgere {
  from { width: 100%; }
  to { width: 0; }
}
@media (max-width: 575.98px) {
  .zona-toasturi {
    right: 0.75rem;
    left: 0.75rem;
    bottom: 0.75rem;
    width: auto;
    max-width: none;
  }
  .toast-lux {
    padding: 0.85rem 2.5rem 0.85rem 0.85rem;
  }
}

/* ------------------- notificarile necitite: evidentiere eleganta + marcare */
.dropdown-notifications-item.necitita {
  background: linear-gradient(90deg, rgba(var(--lux-accent-rgb), 0.09), rgba(var(--lux-accent-rgb), 0.02));
  box-shadow: inset 2px 0 0 var(--lux-accent);
}
.dropdown-notifications-item.marked-as-read h6,
.dropdown-notifications-item.marked-as-read .text-body {
  color: var(--bs-secondary-color) !important;
  font-weight: 400;
}
.punct-nou {
  display: inline-block;
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 50%;
  background: var(--lux-accent);
  box-shadow: 0 0 0.35rem rgba(var(--lux-accent-rgb), 0.7);
  margin-right: 0.4rem;
  vertical-align: 0.12rem;
}
.marcheaza-citita {
  position: relative;
  z-index: 2;
  flex-shrink: 0;
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.7rem;
  height: 1.7rem;
  padding: 0;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.45rem;
  background: var(--bs-paper-bg);
  color: var(--bs-secondary-color);
  transition: border-color 0.15s, background 0.15s, color 0.15s;
}
.marcheaza-citita:hover {
  background: rgba(var(--lux-accent-rgb), 0.14);
  border-color: rgba(var(--lux-accent-rgb), 0.55);
  color: var(--lux-accent);
}

/* ------------------------------------ diagrama camerelor (diagrama.php)
   O singura tabla, ca la marile PMS-uri: antetul de zile INGHETAT sus,
   coloana camerelor INGHETATA in stanga, scroll in ambele directii in
   interiorul cardului; barele incep de la pranzul zilei de sosire si se
   termina la pranzul zilei de plecare (stilul hotelier clasic). */
/* antetul calendarului/tarifelor: căutarea (unde există) la stânga, controalele
   la dreapta — pe un singur rând, simplu, fără titlu/efecte. */
.antet-diagrama {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
}
/* tabla scrolleaza DOAR intern (fara scroll de pagina) — inaltimea o pune
   initTablaLux (viewport - pozitia tablei - aer). */
#continut-dinamic:has(> .antet-diagrama) > .card.bloc-tip { margin-bottom: 0 !important; }
.card.bloc-tip {
  position: relative;
}
/* ————— totaluri în calendar/tarife: la FINALUL tablei (nu sticky), după scroll ————— */
.tabel-totaluri { border-top: 2px solid var(--bs-border-color); }
.rand-total-diag td { height: 2.75rem; } /* aceeasi inaltime ca randurile camerelor */
.rand-total-diag .celula-camera {
  font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em;
  font-size: 0.64rem; color: var(--lux-accent); white-space: nowrap;
}
.rand-total-diag .celula-camera .icon-base { color: var(--lux-accent); }
/* valorile din totaluri: centrate în celulă, mici și discrete */
.rand-total-diag .celula-total-val { text-align: center; vertical-align: middle; font-weight: 600; font-size: 0.78rem; }
.rand-total-diag .insigna-ocupare { font-size: 0.68rem; padding: 0.1rem 0.4rem; }
.rand-total-diag.rand-total-nealocate .celula-camera,
.rand-total-diag.rand-total-nealocate .celula-camera .icon-base { color: var(--bs-warning); }
.rand-total-diag .celula-total-text {
  padding: 0.4rem 0.7rem; font-size: 0.8rem; font-weight: 600; color: var(--bs-warning); text-align: left;
}

.panou-diagrama {
  overflow: auto;
  /* orizontal ramane inchis (fara "inapoi" din gestul de swipe), dar VERTICAL
     scrollul se transmite paginii cand tabla a ajuns sus/jos — altfel pe
     telefon ramai prins in tabel si nu mai poti urca/cobori pe pagina */
  overscroll-behavior-x: contain;
  overscroll-behavior-y: auto;
}
/* ————— INALTIMEA TABLEI: PURA CSS, prin FLEXBOX (fara JS, fara recalcul dupa reload) —————
   #continut-dinamic devine o coloana flex de inaltime FIXA = viewport minus chrome-ul
   fix de sus (navbar 3.5rem + padding container 5.3rem pt. meniu) si cel de jos (1.5rem).
   Antetul isi ia inaltimea naturala; cardul cu tabla umple restul (flex:1). Asa tabla
   are dimensiunea corecta din PRIMUL cadru; daca antetul se infasoara, tabla se
   micsoreaza singura -> pagina NU depaseste niciodata viewportul (fara scrollbar). */
#continut-dinamic:has(> .antet-diagrama) {
  display: flex;
  flex-direction: column;
  block-size: calc(100vh - 10.3rem);
}
/* ————— LOADING la prima incarcare / refresh: acopera TOT ecranul (fixed, fara goluri)
   cat se aseaza layout-ul, apoi dispare cu fade. Se ascunde robust din JS prin setTimeout
   (merge si in tab de fundal, spre deosebire de requestAnimationFrame) + la focus + la
   load; iar ca plasa de siguranta o animatie CSS o stinge singura la 3s. Nu apare la
   navigarea „fara refresh" (JS scoate elementul din continutul adus prin fetch). */
.masca-tabla {
  position: fixed;
  inset: 0;
  z-index: 1035; /* peste continut, sub modale (1050+) */
  display: grid;
  place-items: center;
  background: var(--bs-body-bg);
  transition: opacity 0.35s ease, visibility 0s linear 0.35s;
  animation: masca-fallback 0.01s linear 3s forwards;
}
.masca-tabla.gata {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
@keyframes masca-fallback { to { opacity: 0; visibility: hidden; } }
.spinner-tabla {
  inline-size: 2.4rem;
  block-size: 2.4rem;
  border: 3px solid rgba(var(--lux-accent-rgb), 0.22);
  border-top-color: var(--lux-accent);
  border-radius: 50%;
  animation: spinner-tabla-rot 0.7s linear infinite;
}
@keyframes spinner-tabla-rot { to { transform: rotate(360deg); } }
#continut-dinamic:has(> .antet-diagrama) > .card.bloc-tip {
  flex: 1 1 auto;
  min-block-size: 0; /* altfel flex-item-ul nu se micsoreaza sub continut */
  display: flex;
  flex-direction: column;
  margin-block-end: 0 !important;
}
#continut-dinamic:has(> .antet-diagrama) .panou-diagrama {
  flex: 1 1 auto;
  min-block-size: 0;
  max-block-size: none;
}
/* pe mobil nu exista bara de meniu orizontal (e „hamburger"), deci chrome-ul de sus
   e mai mic: navbar 3.5rem + padding container 1.5rem */
@media (max-width: 767.98px) {
  #continut-dinamic:has(> .antet-diagrama) { block-size: calc(100vh - 6.5rem); }
}
/* doua tabele cu acelasi colgroup + table-layout fixed = coloane identice;
   antetul e tabel separat, STICKY CA BLOC (celulele sticky de tabel se
   picteaza gresit in Chromium — banda transparenta la granita cu barele) */
.tabel-diagrama {
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  width: max(100%, calc(7.5rem + var(--numar-zile, 7) * var(--latime-zi, 4.6rem)));
}
.tabel-diagrama .col-camere {
  width: 7.5rem;
}
/* grila: linii CITETE (personalul lucreaza toata ziua pe tabla asta) —
   culori proprii pe tema, nu chenarul general care e prea sters; verticalele
   putin mai stinse decat orizontalele, ca randul de camera sa ramana firul
   principal al ochiului */
.tabel-diagrama th,
.tabel-diagrama td {
  border-bottom: 1px solid var(--lux-grila);
  border-right: 1px solid var(--lux-grila-slaba);
}
/* invelisul antetului: DIV sticky cu fundal solid — fundalurile celulelor de
   tabel se picteaza in alta faza si Chromium lasa barele sa se vada prin
   ultimii pixeli; fundalul de bloc al divului acopera corect */
.cap-diagrama {
  position: sticky;
  top: 0;
  z-index: 6;
  /* ACEEASI formula ca tabelele (nu latime masurata de JS, care ramanea invechita
     la restrangerea unui tip -> capul nu se mai potrivea cu zilele). Astfel capul,
     banda si corpul au mereu exact aceleasi coloane, indiferent de scrollbar. */
  width: max(100%, calc(7.5rem + var(--numar-zile, 7) * var(--latime-zi, 4.6rem)));
  background-color: var(--bs-paper-bg);
  /* fara padding-bottom opac (facea un gol vizibil intre antet si banda de
     tip); un chenar jos subtil delimiteaza antetul, iar banda se lipeste de el */
  box-shadow: 0 1px 0 0 var(--bs-border-color);
}
.tabel-diagrama thead th {
  /* fundal SOLID obligatoriu — tentele (weekend/azi) doar ca strat peste,
     altfel randurile se vad prin antetul inghetat la scroll */
  background-color: var(--bs-paper-bg) !important;
  text-align: center;
  padding: 0.5rem 0.4rem;
  border-bottom: 1px solid var(--bs-border-color);
  overflow: hidden;
}
.tabel-diagrama thead .cap-zi .nume-zi {
  display: block;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bs-secondary-color);
}
/* eticheta zilei pe TREPTE, dupa cat de late sunt coloanele (dupa interval):
   implicit scurt (Lu); 30 zile = coloane inguste -> o litera; 7 zile pe desktop
   = coloane late -> nume complet. Coloanele se string ca sa incapa toate 30 fara scroll. */
.nume-zi .zi-litera,
.nume-zi .zi-lung { display: none; }
.nume-zi .zi-scurt { display: inline; }
.interval-30 .nume-zi .zi-scurt { display: none; }
.interval-30 .nume-zi .zi-litera { display: inline; }
.interval-30 .cap-zi { letter-spacing: 0.02em; }
@media (min-width: 992px) {
  .interval-7 .nume-zi .zi-scurt { display: none; }
  .interval-7 .nume-zi .zi-lung { display: inline; }
}
.tabel-diagrama thead .cap-zi .numar-zi {
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--bs-heading-color);
  font-variant-numeric: tabular-nums;
  margin-right: 0.2rem;
}
.tabel-diagrama thead .cap-zi .luna-zi {
  font-size: 0.72rem;
  color: var(--bs-secondary-color);
}
.tabel-diagrama thead .cap-zi.zi-azi {
  box-shadow: inset 0 -2px 0 var(--lux-accent);
  background-image: linear-gradient(rgba(var(--lux-accent-rgb), 0.08), rgba(var(--lux-accent-rgb), 0.08));
}
.tabel-diagrama thead .cap-zi.zi-azi .numar-zi {
  color: var(--lux-accent);
}
/* coltul + coloana camerelor: inghetate in stanga */
.tabel-diagrama .colt-diagrama {
  position: sticky;
  left: 0;
  z-index: 7;
  background: var(--bs-paper-bg);
  overflow: hidden;
}
/* CELULA din colt E butonul de filtre (th-ul insusi, nu buton in celula):
   hoverul si starea activa acopera toata celula, pe orice inaltime are randul */
th.colt-diagrama.buton-filtru {
  display: table-cell; /* baza .buton-filtru e inline-flex (pastila) — aici e celula */
  padding: 0.4rem 0.5rem;
  border-top: 0;
  border-left: 0;
  border-right: 1px solid var(--lux-grila-slaba);
  border-bottom: 1px solid var(--lux-grila);
  border-radius: 0;
  background: var(--bs-paper-bg);
  color: var(--bs-secondary-color);
  text-align: center;
  vertical-align: middle;
  cursor: pointer;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  user-select: none;
  transition: color 0.15s;
}
th.colt-diagrama.buton-filtru .icon-base {
  font-size: 0.95rem;
  vertical-align: -0.18em;
  margin-right: 0.35rem;
}
th.colt-diagrama.buton-filtru:hover {
  background-image: linear-gradient(rgba(var(--lux-accent-rgb), 0.12), rgba(var(--lux-accent-rgb), 0.12));
  color: var(--lux-accent);
}
/* filtre ACTIVE: iconul (si textul) aurii + tenta discreta — nu pastila plina */
th.colt-diagrama.buton-filtru.are-filtre {
  background-image: linear-gradient(rgba(var(--lux-accent-rgb), 0.1), rgba(var(--lux-accent-rgb), 0.1));
  border-color: var(--bs-border-color);
  color: var(--lux-accent);
  text-shadow: none;
}
th.colt-diagrama.buton-filtru:focus-visible { outline: 2px solid var(--lux-accent); outline-offset: -2px; }
.tabel-diagrama .celula-camera {
  position: sticky;
  left: 0;
  z-index: 4;
  background-color: var(--bs-paper-bg) !important;
  /* spatii stranse si FARA puncte de suspensie: numarul + frunza + becul de
     mentenanta trebuie sa incapa mereu (ellipsis taia becul in „…") */
  padding: 0 0.55rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  box-shadow: inset -1px 0 0 var(--bs-border-color);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
}
/* banda pe tip de camera — DIV sticky sub antetul de zile (--cap-diagrama =
   inaltimea masurata a antetului). Fundal SOLID, tenta aurie doar ca strat
   peste. Se baga 8px SUB antet (Chromium isi picteaza fundalul antetului cu
   cativa px mai scurt decat inaltimea lui) — suprapunerea acopera golul, iar
   padding-ul de sus compenseaza ca textul sa ramana la locul lui */
.banda-sectiune {
  position: sticky;
  top: var(--cap-diagrama, 3.6rem);
  left: 0;
  z-index: 5;
  width: max(100%, calc(7.5rem + var(--numar-zile, 7) * var(--latime-zi, 4.6rem)));
  background-color: var(--bs-paper-bg);
  background-image: linear-gradient(rgba(var(--lux-accent-rgb), 0.09), rgba(var(--lux-accent-rgb), 0.09));
  border: 2px solid color-mix(in srgb, var(--lux-accent) 38%, transparent);
}
/* benzile inchise una sub alta: chenarul dintre ele ramane O linie, nu doua */
.banda-sectiune.tip-restrans + .tabel-corp-diagrama + .banda-sectiune { border-top: 0; }
.banda-sectiune .eticheta-banda {
  display: inline-flex;
  align-items: center;
  position: sticky;
  left: 0;
  width: max-content;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--lux-accent);
  padding: 0.45rem 0.8rem;
}
/* randurile de camere */
.rand-camera td,
.rand-nealocate td {
  height: 2.75rem;
}
.rand-camera:hover .celula-camera {
  color: var(--lux-accent);
}
.tabel-diagrama .celula-libera {
  cursor: pointer;
  min-width: 4.6rem;
  transition: background 0.12s;
}
.tabel-diagrama .celula-libera:hover {
  background: rgba(var(--lux-accent-rgb), 0.14);
  box-shadow: inset 0 0 0 1px rgba(var(--lux-accent-rgb), 0.4);
}
/* cat desenezi schita, celula de sub mouse nu se mai aprinde — se vede
   doar bara hasurata, ca la o rezervare adevarata */
.panou-diagrama.trage-schita .celula-libera:hover {
  background: transparent;
  box-shadow: none;
}
/* randuri alternate — reperul pe orizontala (weekendurile nu se mai scot in
   relief). Ca STRAT peste fundal, ca sa nu strice coloana de camere inghetata,
   care are nevoie de fundal opac. */
.tabel-corp-diagrama tbody tr:nth-child(odd) td {
  background-image: linear-gradient(var(--lux-zebra), var(--lux-zebra));
}
.tabel-diagrama td.zi-azi {
  background: rgba(var(--lux-accent-rgb), 0.07);
}
/* weekend colorat (Val 2, paritate PynBooking): coloana de sambata + duminica
   primeste o tenta neutra discreta — nu aurie, ca sa nu se confunde cu „azi" */
.tabel-diagrama td.zi-weekend,
.tabel-diagrama thead .cap-zi.zi-weekend,
.rand-disponibilitate .celula-disp.zi-weekend {
  background-image: linear-gradient(
    color-mix(in srgb, var(--bs-body-color) 9%, transparent),
    color-mix(in srgb, var(--bs-body-color) 9%, transparent));
}
.tabel-diagrama thead .cap-zi.zi-weekend .nume-zi {
  color: var(--bs-heading-color);
}
.tabel-diagrama .celula-rezervare {
  padding: 0;
  overflow: visible;
}
/* ancora barei: div in celula, NU td poziționat (vezi nota din diagrama.php) */
.suport-bara {
  position: relative;
  height: 100%;
}
.nealocate-eticheta {
  color: var(--bs-warning) !important;
  font-size: 0.72rem !important;
  font-weight: 600;
}
/* bara de rezervare: pastila plina, decalata cu o jumatate de zi (check-in
   la pranz » check-out la pranz), cum deseneaza marile PMS-uri.
   --nopti = cate celule acopera td-ul; bara e scoasa din flux (absolute, ca sa
   nu latesca coloanele) si decalata cu o JUMATATE DE CELULA, deci capatul cade
   la mijlocul zilei de plecare si jumatatea ei ramane libera pentru click,
   oricat de lunga e rezervarea. */
.bara-rezervare {
  position: absolute;
  top: 50%;
  left: calc(100% / (var(--nopti, 1) * 2));
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: 0.3rem;
  width: calc(100% - 0.4rem);
  height: 2.15rem;
  padding: 0 0.55rem;
  border: 0;
  /* colturi ca la butoane, nu pastila — bara se citeste mai bine si se
     aliniaza vizual cu restul aplicatiei */
  border-radius: 0.5rem;
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  overflow: hidden;
  z-index: 2;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  transition: filter 0.12s, box-shadow 0.12s;
}
.bara-rezervare.continuare {
  left: 0;
  width: calc(100% + 100% / (var(--nopti, 1) * 2) - 0.4rem);
  border-top-left-radius: 0.15rem;
  border-bottom-left-radius: 0.15rem;
}
.bara-rezervare.continua-dupa {
  width: calc(100% - 100% / (var(--nopti, 1) * 2));
  border-top-right-radius: 0.15rem;
  border-bottom-right-radius: 0.15rem;
}
/* ciotul de PLECARE pe prima coloana: cineva care pleaca / a plecat chiar in
   ziua din capul tabelului -> jumatatea din stanga a celulei. FORMA = capat de
   plecare: TAIAT la stanga (vine de dinainte, din afara ecranului) si ROTUNJIT
   la dreapta (check-out la mijlocul zilei), exact ca o continuare care se
   incheie — nu ca un inceput. */
.bara-rezervare.doar-plecare {
  left: 0;
  width: calc(100% / (var(--nopti, 1) * 2) - 0.25rem);
  border-top-left-radius: 0.15rem;
  border-bottom-left-radius: 0.15rem;
  opacity: 0.9;
}
.bara-rezervare.doar-plecare .nume-bara { font-size: 0.72rem; }
.bara-rezervare.continuare.continua-dupa {
  left: 0;
  width: 100%;
}
.bara-rezervare:hover {
  filter: brightness(1.12);
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.45);
  z-index: 3;
}
.bara-rezervare .nume-bara {
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
}
/* iconitele de stare din coada barei (bagaj/iesire/plic/pat) — impinse la
   dreapta, nu se micsoreaza; numele se trunchiaza in locul lor pe bare scurte */
.bara-rezervare .iconite-bara {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.22rem;
  flex-shrink: 0;
}
.bara-rezervare .iconite-bara .icon-base {
  font-size: 0.9rem;
  width: 0.9rem;
  height: 0.9rem;
  opacity: 0.92;
}
/* paleta starilor (tonuri stinse, in tonul temei aurii): cerere rosu,
   confirmata verde smarald, sosire azi verde iarba, cazat turcoaz, plecare
   azi albastru, checkout gri, protocol chihlimbar, blocata mov. Aceleasi
   fundaluri le poarta si mostrele din legenda. */
.bara-rezervare.stare-ceruta,
.legenda-diagrama .mostra.stare-ceruta {
  background: linear-gradient(180deg, #c2606a, #a3454f);
}
.bara-rezervare.stare-confirmata,
.legenda-diagrama .mostra.stare-confirmata {
  background: linear-gradient(180deg, #58a183, #3f7f63);
}
.bara-rezervare.stare-sosire-azi,
.legenda-diagrama .mostra.stare-sosire-azi {
  background: linear-gradient(180deg, #74b25e, #558e41);
}
.bara-rezervare.stare-incasa,
.legenda-diagrama .mostra.stare-incasa {
  background: linear-gradient(180deg, #4aa9ad, #35878d);
}
.bara-rezervare.stare-plecare-azi,
.legenda-diagrama .mostra.stare-plecare-azi {
  background: linear-gradient(180deg, #5b87c5, #40669f);
}
.bara-rezervare.stare-plecata,
.legenda-diagrama .mostra.stare-plecata {
  background: color-mix(in srgb, var(--bs-secondary-color) 55%, var(--bs-paper-bg));
}
.bara-rezervare.stare-protocol,
.legenda-diagrama .mostra.stare-protocol {
  background: linear-gradient(180deg, #d5904f, #b26f33);
}
.bara-rezervare.stare-blocata,
.legenda-diagrama .mostra.stare-blocata {
  background: linear-gradient(180deg, #8d76b8, #6d5794);
}
.bara-rezervare.stare-ceruta { color: #ffeef0; text-shadow: 0 1px 1px rgba(80, 10, 20, 0.35); }
.bara-rezervare.stare-confirmata { color: #f0fbf6; text-shadow: 0 1px 1px rgba(0, 55, 35, 0.35); }
.bara-rezervare.stare-sosire-azi { color: #f4ffee; text-shadow: 0 1px 1px rgba(25, 60, 10, 0.35); }
.bara-rezervare.stare-incasa { color: #eefcfd; text-shadow: 0 1px 1px rgba(0, 50, 55, 0.35); }
.bara-rezervare.stare-plecare-azi { color: #eef4ff; text-shadow: 0 1px 1px rgba(10, 30, 65, 0.35); }
/* pe gri, numele trebuie sa se citeasca la fel de bine ca pe celelalte */
.bara-rezervare.stare-plecata {
  color: var(--bs-heading-color);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.25);
}
.bara-rezervare.stare-protocol { color: #fff3e6; text-shadow: 0 1px 1px rgba(75, 40, 5, 0.35); }
.bara-rezervare.stare-blocata { color: #f4f0ff; text-shadow: 0 1px 1px rgba(35, 20, 60, 0.35); }
.monograma-canal {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.15rem;
  height: 1.15rem;
  padding: 0 0.2rem;
  border-radius: 0.3rem;
  background: var(--brand-fundal, #4f9dad);
  color: var(--brand-text, #ffffff);
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}
.legenda-diagrama {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 1.15rem;
  font-size: 0.8125rem;
  color: var(--bs-secondary-color);
}
.legenda-diagrama .grup-legenda {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 1.15rem;
}
.legenda-diagrama .element-legenda {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  line-height: 1;
}
.legenda-diagrama .despartitor-legenda {
  width: 1px;
  height: 1rem;
  background: color-mix(in srgb, var(--bs-border-color) 70%, transparent);
}
.legenda-diagrama .mostra {
  display: inline-block;
  width: 1.15rem;
  height: 1.15rem;
  border-radius: 0.3rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
.legenda-monograma {
  background: var(--brand-fundal) !important;
  color: var(--brand-text) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
.monograma-canal {
  line-height: 1;
  padding-top: 0.05rem;
}
/* emblema aplicatiei in monograma (rezervari facute direct) */
.monograma-canal svg {
  width: 0.72rem;
  height: 0.72rem;
  display: block;
}
/* iconitele din monograma (lacatul camerei blocate...) raman PATRATE:
   fara dimensiune fixa, fontul de iconite latea pastila inegal */
.monograma-canal .icon-base {
  font-size: 0.72rem;
  width: 0.72rem;
  height: 0.72rem;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
/* insula legendei: buton de informatii langa comenzi, panoul se desface ca o
   insula plutitoare (translucida, blur, pop scurt) — tabla ramane inalta */
.insula-legenda {
  position: relative;
}
.insula-legenda .buton-legenda {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.375rem;
  height: 2.375rem;
  padding: 0;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.35);
  border-radius: 0.55rem;
  background: var(--bs-paper-bg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 1px 3px rgba(0, 0, 0, 0.18);
  color: var(--lux-accent);
  font-size: 1.1rem;
  transition: background 0.15s, color 0.15s;
}
.insula-legenda .buton-legenda:hover {
  background: rgba(var(--lux-accent-rgb), 0.12);
  color: var(--lux-accent-deschis);
}
.insula-legenda.deschisa .buton-legenda {
  background: linear-gradient(180deg, var(--lux-grad-sus), var(--lux-grad-jos));
  color: var(--lux-pe-auriu);
}
.insula-legenda .panou-legenda {
  position: absolute;
  top: calc(100% + 0.6rem);
  right: 0;
  z-index: 60;
  width: min(23rem, calc(100vw - 2.5rem));
  padding: 1rem 1.1rem 1.15rem;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.32);
  border-radius: 1.1rem;
  background: color-mix(in srgb, var(--bs-paper-bg) 86%, transparent);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(var(--lux-accent-rgb), 0.06);
  opacity: 0;
  transform: translateY(-0.4rem) scale(0.94);
  transform-origin: top right;
  pointer-events: none;
  transition: opacity 0.2s, transform 0.22s cubic-bezier(0.34, 1.4, 0.5, 1);
  /* INCHIS: max-height 0 + overflow hidden ca panoul (position:absolute) sa NU
     intinda scroll-ul paginii sub viewport pe ecrane scunde (altfel aparea scrollbar) */
  max-block-size: 0;
  overflow: hidden;
}
.insula-legenda.deschisa .panou-legenda {
  opacity: 1;
  transform: none;
  pointer-events: auto;
  /* DESCHIS: inalt cat trebuie, dar niciodata peste ecran (scrolleaza intern) */
  max-block-size: min(80vh, 40rem);
  overflow-y: auto;
}
/* in insula, legenda sta pe DOUA COLOANE aliniate (in rand simplu, cu
   etichete de latimi diferite, aratau imprastiate) */
.insula-legenda .grup-legenda {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem 0.9rem;
  width: 100%;
}
.insula-legenda .element-legenda {
  gap: 0.5rem;
  min-width: 0;
}
.insula-legenda .element-legenda .mostra,
.insula-legenda .element-legenda .monograma-canal {
  flex-shrink: 0;
}
/* mostra fara semn: rezervarile facute la receptie nu poarta nicio iconita */
.monograma-canal.fara-semn {
  background: transparent !important;
  border: 1px dashed color-mix(in srgb, var(--bs-secondary-color) 55%, transparent);
  box-shadow: none;
}
/* pe mobil butonul „info" e in DREAPTA randului (dupa clopotel + rearanjare), deci
   panoul se desface spre STANGA (ancorat de dreapta) ca sa NU iasa din ecran. Latimea
   e limitata la ecran, iar daca legenda e mai inalta decat ecranul, scrolleaza intern. */
@media (max-width: 767.98px) {
  .insula-legenda .panou-legenda {
    right: 0;
    left: auto;
    transform-origin: top right;
    width: min(23rem, calc(100vw - 1.2rem));
  }
}

/* mobil: celule mai inguste, coloana camerelor compacta (inaltimea tablei o da
   flexbox-ul de mai sus, nu o inaltime fixa aici) */
@media (max-width: 767.98px) {
  .tabel-diagrama {
    width: max(100%, calc(4.6rem + var(--numar-zile, 7) * 3.4rem));
  }
  .tabel-diagrama .col-camere {
    width: 4.6rem;
  }
  .tabel-diagrama thead th {
    padding: 0.4rem 0.2rem;
  }
  .tabel-diagrama .celula-camera,
  .tabel-diagrama .colt-diagrama {
    padding: 0 0.5rem;
    font-size: 0.78rem;
  }
  .rand-camera td,
  .rand-nealocate td {
    height: 2.5rem;
  }
  .bara-rezervare {
    height: 1.95rem;
    font-size: 0.68rem;
    padding: 0 0.4rem;
  }
  /* "Nealocate" incape in coloana ingusta: fara iconita, corp mai mic */
  .nealocate-eticheta {
    font-size: 0.62rem !important;
    letter-spacing: 0;
  }
  .nealocate-eticheta .icon-base {
    display: none;
  }
  /* banda cu tipul camerei: mai vizibila pe ecran mic */
  .banda-sectiune {
    background-image: linear-gradient(rgba(var(--lux-accent-rgb), 0.13), rgba(var(--lux-accent-rgb), 0.13));
  }
  .banda-sectiune .eticheta-banda {
    font-size: 0.78rem;
    padding: 0.5rem 0.75rem;
    letter-spacing: 0.09em;
    position: static; /* eticheta tipului nu se mai ingheata la stanga pe mobil */
  }
  /* pe mobil prima coloana (Filtre + numarul camerei + totalurile de jos) NU se
     ingheata la scrolul orizontal — se deruleaza odata cu tot tabelul */
  .tabel-diagrama .colt-diagrama,
  .tabel-diagrama .celula-camera {
    position: static;
  }
  /* randurile de totaluri de jos: pe mobil doar iconita, fara text */
  .rand-total-diag .celula-camera .et-total { display: none; }
  .rand-total-diag .celula-camera .icon-base { margin: 0 !important; }
  .rand-total-diag .celula-camera { text-align: center; }
}

/* butonul de restabilire din Istoric actiuni */
.buton-restabilire {
  display: inline-flex;
  align-items: center;
  padding: 0.1rem 0.45rem;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.45);
  border-radius: 0.4rem;
  background: rgba(var(--lux-accent-rgb), 0.1);
  color: var(--lux-accent);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  transition: background 0.15s;
}
.buton-restabilire:hover {
  background: rgba(var(--lux-accent-rgb), 0.2);
}

/* ============================================================
   Autentificare (login, parola uitata, parola noua)
   Ecranul de intrare e prima impresie: fundal propriu — bolta
   intunecata cu o lumina calda coborata de sus, in accentul
   ales — fara decoratiunile implicite ale temei. Cardul poarta
   firul auriu sus si o umbra adanca; totul prin variabile
   --lux-*, deci urmeaza orice paleta si ambele teme.
   ============================================================ */
body.pagina-autentificare {
  background:
    radial-gradient(1300px 640px at 50% -18%, rgba(var(--lux-accent-rgb), 0.17), transparent 62%),
    radial-gradient(900px 520px at 88% 112%, rgba(var(--lux-accent-rgb), 0.08), transparent 55%),
    radial-gradient(1600px 900px at 50% 50%, transparent 55%, rgba(0, 0, 0, 0.3) 100%),
    var(--bs-body-bg);
  background-attachment: fixed;
}
/* decoratiunile temei (cardurile plutitoare din spate) nu au ce cauta aici */
body.pagina-autentificare .authentication-inner::before,
body.pagina-autentificare .authentication-inner::after {
  display: none;
}
body.pagina-autentificare .authentication-wrapper .card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.24);
  border-radius: 1rem;
  box-shadow:
    0 30px 70px rgba(0, 0, 0, 0.45),
    0 0 80px rgba(var(--lux-accent-rgb), 0.07);
}
body.pagina-autentificare .authentication-wrapper .card::before {
  content: '';
  position: absolute;
  inset-inline: 0;
  inset-block-start: 0;
  block-size: 3px;
  background: linear-gradient(90deg, transparent, var(--lux-grad-sus), var(--lux-grad-jos), transparent);
}
body.pagina-autentificare .authentication-wrapper .card .card-body {
  padding: 2.75rem 2.5rem;
}
body.pagina-autentificare .form-control:focus {
  border-color: rgba(var(--lux-accent-rgb), 0.65);
  box-shadow: 0 0 0 0.2rem rgba(var(--lux-accent-rgb), 0.15);
}
/* legatura „Ti-ai uitat-o?" sta pe randul etichetei si ii preia marimea */
body.pagina-autentificare form .d-flex .form-label + a {
  font-size: 0.8125rem;
  line-height: 1.4;
}
/* widgetul anti-robot: invizibil pentru oameni; cand totusi apare
   (vizitator suspect), sta pe latimea formularului, cu aer dedesubt */
body.pagina-autentificare .cf-turnstile {
  width: 100%;
}
body.pagina-autentificare .cf-turnstile:not(:empty) {
  margin-block-end: 1.5rem;
}

/* ============================================================
   Ochiul de vazut parola — GLOBAL, oriunde exista camp de parola:
   casuta lui e un patrat fix, iar ochiul sta exact in mijloc
   (fara paddingul asimetric al temei).
   ============================================================ */
.form-password-toggle .input-group-text {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 2.9rem;
  min-inline-size: 2.9rem;
  padding: 0;
}
.form-password-toggle .input-group-text .icon-base {
  display: block;
  line-height: 1;
  margin: 0;
}

/* ============================================================
   Contul meu — o singura coloana, aerisita, pe modelul paginilor
   de cont ale marilor lanturi: profil sus, apoi parola,
   dispozitivele de incredere si activitatea, fiecare cu titlu
   cu bula de iconita si randuri curate.
   ============================================================ */
.cont-profil {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}
.cont-avatar {
  inline-size: 3.5rem;
  block-size: 3.5rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  font-weight: 600;
  color: #1e2130;
  background: linear-gradient(135deg, var(--lux-grad-sus), var(--lux-grad-jos));
  flex-shrink: 0;
}
.cont-profil-date {
  flex: 1 1 auto;
  min-inline-size: 0;
}
.cont-profil-rol {
  text-align: end;
  flex-shrink: 0;
}
.cont-titlu-sectiune {
  display: flex;
  align-items: center;
  gap: 0.9rem;
}
.bula-actiune {
  inline-size: 2.4rem;
  block-size: 2.4rem;
  border-radius: 0.6rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.bula-actiune .icon-base { font-size: 1.25rem; }
.bula-primary   { background: rgba(var(--lux-accent-rgb), 0.14); color: var(--lux-accent); }
.bula-info      { background: rgba(var(--bs-info-rgb), 0.14); color: var(--bs-info); }
.bula-success   { background: rgba(var(--bs-success-rgb), 0.14); color: var(--bs-success); }
.bula-warning   { background: rgba(var(--bs-warning-rgb), 0.14); color: var(--bs-warning); }
.bula-danger    { background: rgba(var(--bs-danger-rgb), 0.14); color: var(--bs-danger); }
.bula-secondary { background: rgba(var(--bs-secondary-rgb), 0.14); color: var(--bs-secondary); }
.cont-rand {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding-block: 0.85rem;
}
.cont-rand + .cont-rand {
  border-block-start: 1px solid var(--bs-border-color);
}
.cont-rand-text {
  flex: 1 1 auto;
  min-inline-size: 0;
}
@media (max-width: 575.98px) {
  .cont-profil { flex-wrap: wrap; }
  .cont-profil-rol { text-align: start; }
}

/* steagul tarii pe randurile de activitate/dispozitive (sprite-ul intl-tel-input) */
.steag-tara {
  display: inline-block;
  vertical-align: -2px;
  margin-inline-end: 0.35rem;
  border-radius: 2px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);
}

/* continutul taburilor respira sub bara de taburi */
.card-body.continut-taburi {
  padding-block-start: 2.25rem;
}
/* widgetul de telefon (intl-tel-input) ocupa randul lui, ca orice form-control */
.iti {
  display: block;
  inline-size: 100%;
}

/* dropdownul de tari al telefonului urmeaza tema aplicatiei */
.iti__dropdown-content {
  background: var(--bs-paper-bg, var(--bs-body-bg));
  color: var(--bs-body-color);
  border: 1px solid var(--bs-border-color);
  border-radius: 0.5rem;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
}
.iti__country-list .iti__country.iti__highlight,
.iti__country-list .iti__country:hover {
  background: rgba(var(--lux-accent-rgb), 0.14);
}
.iti__search-input {
  background: transparent;
  color: var(--bs-body-color);
  border: 0;
  /* NU atinge padding-left/right — acolo sta lupa (stanga) si golirea (dreapta) */
  padding-block: 0.6rem;
  outline: none;
}
.iti__search-icon-svg { stroke: var(--bs-secondary-color); }
.iti__dial-code { color: var(--bs-secondary-color); }
.iti__divider { border-color: var(--bs-border-color); }

/* primul element din fiecare tab respira fata de bara de taburi */
.continut-taburi .tab-pane > :first-child {
  margin-block-start: 1rem;
}

/* ============================================================
   Notificari grupate pe zi (Astazi / Ieri / ...), ca la marile
   aplicatii: antet de grup discret, sticky sub tab, uppercase.
   ============================================================ */
.antet-grup-notif {
  position: sticky;
  top: 0;
  z-index: 3;
  padding: 0.5rem 1.15rem 0.35rem;
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--bs-secondary-color);
  background: linear-gradient(var(--bs-paper-bg), var(--bs-paper-bg) 70%, transparent);
  list-style: none;
}
/* notificarile ca niste CARDURI (in stilul „Mesaje de azi"): bordura rotunjita,
   fundal subtil, spatiate, hover auriu — nu list-group plat cu linii */
.lista-notificari {
  padding: 0.45rem 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  border: 0;
}
.lista-notificari .dropdown-notifications-item {
  padding: 0.65rem 0.7rem !important;
  border: 1px solid var(--bs-border-color) !important;
  border-radius: 0.6rem;
  background: var(--bs-body-bg);
  transition: border-color 0.15s, background 0.15s, transform 0.1s;
}
.lista-notificari .dropdown-notifications-item:hover {
  border-color: rgba(var(--lux-accent-rgb), 0.6) !important;
  background: rgba(var(--lux-accent-rgb), 0.05) !important;
}
.lista-notificari .dropdown-notifications-item:active { transform: scale(0.99); }
/* necitita: fundal usor auriu (evidentiere premium, FARA dunga in stanga) */
.lista-notificari .dropdown-notifications-item.necitita {
  background: color-mix(in srgb, var(--lux-accent) 6%, transparent);
  border-color: rgba(var(--lux-accent-rgb), 0.4) !important;
}
/* antetul de grup (Azi / Ieri...) fara fundal de card, doar eticheta.
   Fundal OPAC (nu transparent): fiind sticky la top:0, cu fundal transparent
   notificarile treceau pe sub el si „se urcau peste" la scroll. Fundalul plin
   al meniului le ascunde curat. Marginile negative acopera si padding-ul listei. */
.lista-notificari .antet-grup-notif {
  padding: 0.5rem 0.5rem 0.4rem;
  margin: 0 -0.5rem;
  background: var(--bs-paper-bg, var(--bs-body-bg));
}

/* Ierarhie vizuala pe randul de notificare, ca la marile aplicatii:
   1. titlul — cel mai luminos si semibold (heading);
   2. textul — mediu (body);
   3. ora — cea mai stearsa si mica (tertiary). */
.lista-notificari .dropdown-notifications-item h6 {
  color: var(--bs-heading-color);
  font-weight: 600;
  font-size: 0.82rem;
  margin-bottom: 0.15rem;
}
.lista-notificari .dropdown-notifications-item .text-body {
  color: var(--bs-body-color) !important;
  font-weight: 400;
  font-size: 0.795rem;
  line-height: 1.45;
}
.lista-notificari .dropdown-notifications-item .text-body-secondary {
  color: var(--bs-tertiary-color);
  font-size: 0.72rem;
  letter-spacing: 0.01em;
}
/* citita: se estompeaza tot randul, dar ierarhia ramane */
.lista-notificari .dropdown-notifications-item.marked-as-read h6 {
  color: var(--bs-secondary-color) !important;
  font-weight: 500;
}

/* ============================================================
   Diagrama pe mobil: bara de sus pe toata latimea (butoanele
   impreuna fac 100%, nu aruncate), filtrele doar iconita (nu
   incape cuvantul), coloana camerelor destul de lata cat sa se
   vada numarul intreg si sa se poata apasa frunza.
   ============================================================ */
@media (max-width: 767.98px) {
  .antet-diagrama { gap: 0.6rem; }
  /* controalele devin `display:contents`: copiii lor (clopotel, rearanjare, info,
     7/15/30, navigator, Rezervare noua) intra DIRECT in randul antetului, ca sa pot
     pune cele 3 iconite pe ACELASI rand cu „Caută" (in dreapta ei), iar restul dedesubt */
  .antet-diagrama > .d-flex.flex-wrap {
    display: contents !important; /* bate .d-flex{display:flex!important} din Bootstrap */
  }
  /* rand 1: Cauta (creste) + clopotel + rearanjare + info (mici, in dreapta ei) */
  .antet-diagrama .cautare-calendar {
    order: -4;
    flex: 1 1 8rem;
    min-width: 8rem;
    max-width: none;
  }
  .antet-diagrama .buton-mesaje-azi,
  .antet-diagrama .buton-rearanjare,
  .antet-diagrama .insula-legenda {
    flex: 0 0 auto;
  }
  /* randurile de dedesubt: 7/15/30 pe tot randul, navigatorul pe tot randul,
     Rezervare noua la final (order 0 -> vin dupa cele de mai sus) */
  .antet-diagrama .grup-interval {
    order: 0;
    display: flex;
    width: 100%;
  }
  .antet-diagrama .grup-interval .segment-interval {
    flex: 1;
    text-align: center;
  }
  .antet-diagrama .navigator-zi {
    order: 0;
    width: 100%;
  }
  .antet-diagrama .btn-primary {
    order: 0;
    flex: 1 1 auto;
    justify-content: center;
  }

  /* pe mobile textul „Filtre" din celula-buton, mai mic ca sa incapa */
  th.colt-diagrama.buton-filtru span { font-size: 0.62rem; }

  /* coloana camerelor mai lata: numarul se vede intreg, frunza ramane apasabila.
     Capul si banda folosesc ACEEASI formula ca tabelul, ca zilele din cap sa
     coincida cu cele de la camere (altfel se desincronizau pe mobile). */
  .tabel-diagrama .col-camere {
    width: 6rem;
  }
  /* pe telefon oricum derulezi orizontal: zilele primesc loc adevarat
     (5rem in loc de 3.3) si numele intreg al zilei, sa incapa tot */
  .tabel-diagrama,
  .cap-diagrama,
  .banda-sectiune {
    width: max(100%, calc(6rem + var(--numar-zile, 7) * 5rem));
  }
  .tabel-diagrama .nume-zi .zi-scurt,
  .tabel-diagrama .nume-zi .zi-litera { display: none; }
  .tabel-diagrama .nume-zi .zi-lung { display: inline; font-size: 0.6rem; letter-spacing: 0.03em; }
  /* pe mobile totul din celula camerei INCAPE (numar + frunza + bec):
     spatii mai mici, insigne putin mai mici si FARA puncte de suspensie */
  .tabel-diagrama .celula-camera {
    padding: 0 0.35rem;
    text-overflow: clip;
  }
  .celula-camera .numar-camera {
    white-space: nowrap;
    margin-right: 0.3rem;
  }
  .celula-camera .frunza-curatenie {
    width: 1.2rem;
    height: 1.2rem;
    margin-right: 0.2rem;
    font-size: 0.85rem;
  }
  .celula-camera .insigna-problema {
    width: 1.2rem;
    height: 1.2rem;
  }
  .celula-camera .insigna-problema .icon-base {
    font-size: 1rem;
  }
}

/* alocare inteligenta: variantele de eliberare printr-o mutare (fisa rezervare) */
.varianta-mutare {
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: 0.75rem 0.9rem;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.3);
  border-radius: 0.6rem;
  background: rgba(var(--lux-accent-rgb), 0.06);
}
.varianta-mutare + .varianta-mutare {
  margin-top: 0.6rem;
}
.varianta-mutare .varianta-text {
  flex: 1;
  min-width: 0;
  font-size: 0.85rem;
  line-height: 1.45;
  color: var(--bs-body-color);
}

/* rezervarea evidentiata din notificarea de canal: palpaie de 3 ori */
@keyframes palpaie-bara {
  0%, 100% { box-shadow: 0 0 0 0 rgba(var(--lux-accent-rgb), 0); }
  50%      { box-shadow: 0 0 0 3px var(--lux-accent), 0 0 14px 2px rgba(var(--lux-accent-rgb), 0.6); }
}
.bara-rezervare.palpaie {
  /* lent si linistit, de 4 ori — sa ai timp sa o gasesti cu ochii */
  animation: palpaie-bara 1.1s ease-in-out 4;
  position: relative;
  z-index: 3;
}

/* grupe restrangibile pe tip de camera (esential la 150 camere) */
/* submeniurile au iconita pe fiecare intrare: cercurile puse de tema inaintea
   linkurilor (nivelul 2 le pastra) sunt zgomot — le scoatem peste tot */
#layout-menu .menu-sub .menu-link::before { display: none !important; }
#layout-menu.menu-horizontal .menu-sub .menu-item .menu-link { padding-inline-start: 1rem; }

.banda-restrangibila { cursor: pointer; user-select: none; }
.banda-restrangibila:focus-visible { outline: 2px solid var(--lux-accent); outline-offset: -2px; }
/* ochiul (stil Stripe): verde = tip vizibil, roșu tăiat = tip ascuns */
.ochi-tip {
  margin-inline-end: 0.4rem;
  display: inline-flex; align-items: center;
  flex-shrink: 0;
  transition: transform 0.15s ease;
}
.ochi-tip .icon-base { font-size: 1rem; }
.ochi-tip .ochi-vizibil { color: var(--bs-success); }
.ochi-tip .ochi-ascuns { color: var(--bs-danger); display: none; }
.banda-sectiune.tip-restrans .ochi-tip .ochi-vizibil { display: none; }
.banda-sectiune.tip-restrans .ochi-tip .ochi-ascuns { display: inline-flex; }
.banda-restrangibila:hover .ochi-tip { transform: scale(1.12); }
/* restrangerea tabelului de camere: efect lin (Apple-like) prin max-height +
   opacity, nu display:none (care ar fi instant). overflow:hidden clampeaza. */
.tabel-corp-diagrama {
  max-height: 120rem;
  overflow: hidden;
  transition: max-height 0.5s cubic-bezier(0.33, 1, 0.68, 1),
              opacity 0.35s ease, transform 0.4s cubic-bezier(0.33, 1, 0.68, 1);
  transform-origin: top;
}
.banda-sectiune.tip-restrans + .tabel-corp-diagrama {
  max-height: 0;
  opacity: 0;
  transform: translateY(-0.35rem);
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .tabel-corp-diagrama { transition: none; }
}
.numar-tip {
  margin-inline-start: 0.55rem;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: var(--bs-secondary-color);
}

/* rand de subtotal disponibilitate per tip (nr. camere libere pe zi = ce trimitem la canale) */
.rand-disponibilitate td {
  height: 1.85rem;
  background: rgba(var(--bs-success-rgb), 0.06);
  border-bottom: 1px solid var(--bs-border-color);
  text-align: center;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  font-size: 0.8rem;
  color: var(--bs-success);
}
.rand-disponibilitate .eticheta-disp {
  text-align: left;
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bs-secondary-color);
  background: rgba(var(--bs-success-rgb), 0.06);
}
.rand-disponibilitate .celula-disp.disp-zero { color: var(--bs-danger); }
/* ziua curenta: doar tenta coloanei (din td.zi-azi), FARA chenar in plus pe
   celula „Libere" — arata ca un border dublu/mai gros altfel */

/* cautare in calendar: caseta + dropdown de rezultate */
.cautare-calendar {
  position: relative;
  max-width: 22rem;
}
.cautare-calendar > .icon-base {
  position: absolute;
  left: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--bs-secondary-color);
  font-size: 1.05rem;
  pointer-events: none;
}
.cautare-calendar input {
  width: 100%;
  height: 2.375rem;
  padding: 0 0.9rem 0 2.35rem;
  /* aceeasi pastila ca navigatorul de data (nu transparenta pe fundalul paginii) */
  border: 1px solid rgba(var(--lux-accent-rgb), 0.35);
  border-radius: 0.55rem;
  background: var(--bs-paper-bg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 1px 3px rgba(0, 0, 0, 0.18);
  color: var(--bs-body-color);
  font-size: 0.875rem;
  outline: none;
  transition: border-color 0.15s;
}
.cautare-calendar input:focus {
  border-color: rgba(var(--lux-accent-rgb), 0.6);
  box-shadow: 0 0 0 0.2rem rgba(var(--lux-accent-rgb), 0.12);
}
.rezultate-cautare {
  display: none;
  position: absolute;
  z-index: 30;
  top: calc(100% + 0.35rem);
  left: 0;
  right: 0;
  background: var(--bs-paper-bg);
  border: 1px solid var(--bs-border-color);
  border-radius: 0.6rem;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
  overflow: hidden;
  max-height: 20rem;
  overflow-y: auto;
}
.rezultate-cautare.deschis { display: block; }
.rezultat-cautare {
  display: block;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 0.55rem 0.9rem;
  cursor: pointer;
}
.rezultat-cautare + .rezultat-cautare { border-top: 1px solid var(--bs-border-color); }
.rezultat-cautare:hover { background: rgba(var(--lux-accent-rgb), 0.1); }
.rezultat-cautare .rez-nume { display: block; font-weight: 600; font-size: 0.85rem; color: var(--bs-heading-color); }
.rezultat-cautare .rez-detaliu { display: block; font-size: 0.75rem; color: var(--bs-secondary-color); }
.rezultat-gol { padding: 1rem; text-align: center; font-size: 0.85rem; color: var(--bs-secondary-color); }

/* tooltip la hover pe barele din calendar — card de detalii fara click */
.tooltip-rezervare {
  position: fixed;
  z-index: 1080;
  min-width: 14rem;
  max-width: 20rem;
  padding: 0.7rem 0.85rem;
  border-radius: 0.6rem;
  background: var(--bs-paper-bg);
  border: 1px solid var(--bs-border-color);
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.45);
  opacity: 0;
  transform: translateY(4px);
  pointer-events: none;
  transition: opacity 0.12s ease, transform 0.12s ease;
}
.tooltip-rezervare.vizibil { opacity: 1; transform: none; }
.tooltip-rezervare .tt-cap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  margin-bottom: 0.45rem;
}
.tooltip-rezervare .tt-nume {
  font-weight: 700;
  font-size: 0.9rem;
  color: var(--bs-heading-color);
}
.tooltip-rezervare .tt-stare {
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  padding: 0.14rem 0.5rem;
  border-radius: 1rem;
  white-space: nowrap;
  background: rgba(var(--lux-accent-rgb), 0.16);
  color: var(--lux-accent-deschis);
}
.tooltip-rezervare .tt-rand {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  font-size: 0.78rem;
  padding: 0.12rem 0;
}
.tooltip-rezervare .tt-et { color: var(--bs-secondary-color); }
.tooltip-rezervare .tt-val { color: var(--bs-body-color); font-weight: 500; text-align: right; }
.tooltip-rezervare .tt-obs {
  margin-top: 0.4rem;
  padding-top: 0.4rem;
  border-top: 1px solid var(--bs-border-color);
  font-size: 0.76rem;
  color: var(--bs-secondary-color);
  font-style: italic;
}

/* clopotelul „Mesaje de azi" — buton doar-iconita cu insigna rosie, apare/dispare */
.buton-mesaje-azi {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.375rem;
  height: 2.375rem;
  padding: 0;
  border: 1px solid rgba(var(--bs-danger-rgb), 0.4);
  border-radius: 0.55rem;
  background: var(--bs-paper-bg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 1px 3px rgba(0, 0, 0, 0.18);
  color: var(--bs-danger);
  font-size: 1.1rem;
  cursor: pointer;
  transition: background 0.18s, box-shadow 0.18s;
}
.buton-mesaje-azi:hover { background: rgba(var(--bs-danger-rgb), 0.1); }
/* ordinea ceruta la stanga lui „7 zile": notificari, rearanjeaza, info */
.antet-diagrama .buton-mesaje-azi { order: -3; }
.antet-diagrama .buton-rearanjare { order: -2; }
.antet-diagrama .insula-legenda { order: -1; }
.insigna-mesaje-azi {
  position: absolute;
  top: -0.35rem;
  inset-inline-end: -0.35rem;
  min-width: 1.05rem;
  height: 1.05rem;
  padding: 0 0.28rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 1rem;
  background: var(--bs-danger);
  color: #fff;
  font-size: 0.64rem;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 0 0 2px var(--bs-paper-bg);
}

/* panoul-notificari cu mesajele de azi (pozitionat din JS sub buton) */
.panou-mesaje-azi {
  position: fixed;
  z-index: 1080;
  display: none;
  flex-direction: column;
  max-height: min(70vh, 32rem);
  background: var(--bs-paper-bg);
  border: 1px solid var(--bs-border-color);
  border-radius: 0.85rem;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
  overflow: hidden;
  transform-origin: top right;
  animation: pma-deschide 0.2s cubic-bezier(0.33, 1, 0.68, 1);
}
.panou-mesaje-azi.deschis { display: flex; }
@keyframes pma-deschide { from { opacity: 0; transform: translateY(-0.4rem) scale(0.98); } to { opacity: 1; transform: none; } }
.pma-cap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.7rem 0.9rem;
  border-bottom: 1px solid var(--bs-border-color);
  flex: 0 0 auto;
}
.pma-titlu { font-weight: 700; font-size: 0.85rem; color: var(--bs-heading-color); display: inline-flex; align-items: center; }
.pma-titlu .icon-base { color: var(--bs-danger); }
.pma-inchide {
  border: 0; background: transparent; color: var(--bs-secondary-color);
  width: 1.6rem; height: 1.6rem; border-radius: 0.4rem; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background 0.15s, color 0.15s;
}
.pma-inchide:hover { background: var(--bs-secondary-bg); color: var(--bs-body-color); }
.pma-lista { overflow-y: auto; padding: 0.4rem; display: flex; flex-direction: column; gap: 0.35rem; }
.pma-item {
  display: block; width: 100%; text-align: start;
  padding: 0.6rem 0.7rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.6rem;
  background: var(--bs-body-bg);
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s, transform 0.1s;
}
.pma-item:hover {
  border-color: rgba(var(--lux-accent-rgb), 0.6);
  background: rgba(var(--lux-accent-rgb), 0.05);
}
.pma-item:active { transform: scale(0.99); }
.pma-item-cap { display: flex; align-items: center; justify-content: space-between; margin-bottom: 0.25rem; }
.pma-camera { font-weight: 700; font-size: 0.76rem; color: var(--lux-accent); display: inline-flex; align-items: center; }
.pma-moment {
  font-size: 0.6rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em;
  padding: 0.1rem 0.4rem; border-radius: 1rem;
}
.pma-moment-sosire { background: rgba(var(--bs-success-rgb), 0.14); color: var(--bs-success); }
.pma-moment-plecare { background: rgba(var(--bs-warning-rgb), 0.16); color: var(--bs-warning); }
.pma-moment-sejur { background: rgba(var(--bs-info-rgb), 0.14); color: var(--bs-info); }
.pma-nume { font-weight: 600; font-size: 0.8rem; color: var(--bs-heading-color); margin-bottom: 0.15rem; }
.pma-text {
  font-size: 0.78rem; color: var(--bs-body-color); line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.pma-subsol {
  display: flex; align-items: center; justify-content: space-between;
  margin-top: 0.4rem; font-size: 0.68rem; color: var(--bs-secondary-color);
}
.pma-autor { display: inline-flex; align-items: center; font-weight: 500; }
.pma-gol {
  display: flex; flex-direction: column; align-items: center; gap: 0.5rem;
  padding: 2rem 1rem; color: var(--bs-secondary-color); font-size: 0.82rem; text-align: center;
}
.pma-gol .icon-base { font-size: 1.8rem; opacity: 0.5; }

/* mod „Rearanjează" (drag & drop rezervari) — buton doar-iconita ca „info" */
.buton-rearanjare {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.375rem;
  height: 2.375rem;
  padding: 0;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.35);
  border-radius: 0.55rem;
  background: var(--bs-paper-bg);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03), 0 1px 3px rgba(0, 0, 0, 0.18);
  color: var(--lux-accent);
  font-size: 1.1rem;
  cursor: pointer;
  transition: background 0.18s, color 0.18s, box-shadow 0.18s;
}
.buton-rearanjare:hover {
  background: rgba(var(--lux-accent-rgb), 0.1);
}
.buton-rearanjare.activ {
  background: linear-gradient(180deg, var(--lux-grad-sus), var(--lux-grad-jos));
  color: var(--lux-pe-auriu);
  box-shadow: inset 0 0 0 1px rgba(var(--lux-accent-rgb), 0.5);
}
.panou-diagrama.mod-drag .bara-rezervare {
  cursor: grab;
}
.panou-diagrama.mod-drag .bara-rezervare:active { cursor: grabbing; }
.bara-rezervare.se-trage { opacity: 0.45; filter: grayscale(0.3); }
/* randul-tinta cat treci deasupra cu o rezervare in mana */
.rand-camera.tinta-drop td {
  background-image: linear-gradient(
    rgba(var(--lux-accent-rgb), 0.18), rgba(var(--lux-accent-rgb), 0.18)) !important;
  box-shadow: inset 0 0 0 1px rgba(var(--lux-accent-rgb), 0.55);
}
.rand-camera.tinta-drop .celula-camera { color: var(--lux-accent); }

/* firul de mesaje/note pe rezervare: carduri ordonate — autorul la stanga,
   ora la dreapta, bifa de citire la capat; necititele au dunga aurie */
.zona-mesaje { border-top: 1px solid var(--bs-border-color); padding-top: 1rem; }
.lista-mesaje { display: flex; flex-direction: column; gap: 0.6rem; max-height: 16rem; overflow-y: auto; }
.mesaj-nota {
  background: color-mix(in srgb, var(--bs-body-color) 4%, transparent);
  border: 1px solid var(--bs-border-color);
  border-radius: 0.55rem;
  padding: 0.6rem 0.8rem;
}
.mesaj-antet {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin-bottom: 0.3rem;
}
.mesaj-autor {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
  font-size: 0.8rem;
  color: var(--bs-heading-color);
}
.mesaj-cand {
  font-size: 0.72rem;
  color: var(--bs-secondary-color);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.mesaj-text { font-size: 0.84rem; line-height: 1.5; color: var(--bs-body-color); white-space: pre-wrap; word-break: break-word; }
.mesaj-gol { font-size: 0.85rem; color: color-mix(in srgb, var(--bs-body-color) 72%, transparent); font-style: italic; padding: 0.45rem 0; }

/* FOLIO: nota de cont a sejurului (tabul din fereastra rezervarii) */
.folio-sold {
  padding: 0.85rem 1rem;
  border-radius: 0.7rem;
  margin-bottom: 1rem;
  border: 1px solid var(--bs-border-color);
}
.folio-sold.datorie {
  background: rgba(var(--bs-danger-rgb), 0.08);
  border-color: rgba(var(--bs-danger-rgb), 0.35);
}
.folio-sold.achitat {
  background: rgba(var(--bs-success-rgb), 0.08);
  border-color: rgba(var(--bs-success-rgb), 0.35);
}
.folio-sold .fs-detalii {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  font-size: 0.78rem;
  color: var(--bs-secondary-color);
  margin-bottom: 0.35rem;
}
.folio-sold .fs-principal {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
}
.folio-sold .fs-eticheta { font-weight: 700; font-size: 0.95rem; }
.folio-sold.datorie .fs-eticheta, .folio-sold.datorie .fs-suma { color: var(--bs-danger); }
.folio-sold.achitat .fs-eticheta, .folio-sold.achitat .icon-base { color: var(--bs-success); }
.folio-sold .fs-suma { font-size: 1.35rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.folio-sold.achitat .icon-base { font-size: 1.4rem; align-self: center; }
.folio-avertisment {
  padding: 0.5rem 0.75rem;
  margin-bottom: 0.75rem;
  border-radius: 0.5rem;
  background: rgba(var(--bs-warning-rgb), 0.12);
  border: 1px solid rgba(var(--bs-warning-rgb), 0.35);
  color: var(--bs-warning);
  font-size: 0.8rem;
}
.folio-titlu-sectiune {
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--lux-accent);
  margin: 0.9rem 0 0.35rem;
}
.folio-gol { font-size: 0.8rem; color: var(--bs-secondary-color); font-style: italic; padding: 0.15rem 0; }
.folio-linie {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.4rem 0.1rem;
  border-bottom: 1px solid var(--bs-border-color);
}
.folio-linie:last-child { border-bottom: 0; }
.folio-linie .fl-text { flex: 1; min-width: 0; }
.folio-linie .fl-descriere { display: block; font-size: 0.85rem; font-weight: 500; color: var(--bs-body-color); }
.folio-linie .fl-detaliu { display: block; font-size: 0.73rem; color: var(--bs-secondary-color); }
.folio-linie .fl-suma { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.folio-linie.anulata .fl-descriere, .folio-linie.anulata .fl-suma { text-decoration: line-through; opacity: 0.55; }
.fl-anuleaza {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.6rem;
  height: 1.6rem;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 50%;
  background: rgba(var(--bs-danger-rgb), 0.1);
  color: var(--bs-danger);
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.15s, border-color 0.15s;
}
.fl-anuleaza:hover { background: rgba(var(--bs-danger-rgb), 0.2); border-color: rgba(var(--bs-danger-rgb), 0.5); }
.fl-anuleaza .icon-base { font-size: 0.85rem; }
/* actiunile folio: TOATE pe un rand, latime egala (nu stivuite - mancau tabla) */
.folio-actiuni {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  margin-top: 0.9rem;
}
.folio-actiuni .btn {
  flex: 1;
  min-width: 0;
  padding-left: 0.4rem;
  padding-right: 0.4rem;
  white-space: nowrap;
}

/* panoul de grup din modalul de detalii */
.det-grup {
  margin-top: 0.85rem;
  padding: 0.7rem 0.85rem;
  border-radius: 0.6rem;
  background: rgba(var(--lux-accent-rgb), 0.08);
  border: 1px solid rgba(var(--lux-accent-rgb), 0.25);
}
.det-grup .grup-antet { font-size: 0.85rem; color: var(--bs-heading-color); display: flex; align-items: center; }
.det-grup .grup-antet .icon-base { color: var(--lux-accent); }
.det-grup .grup-actiuni { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.6rem; }
/* iconita de grup pe bara, in tonul celorlalte iconite */
.bara-rezervare .iconite-bara .tabler-users { opacity: 0.95; }

/* meniu contextual la click pe rezervare (optiuni ca la PynBooking) */
.meniu-rezervare {
  position: fixed;
  z-index: 1090;
  min-width: 12.5rem;
  max-width: 16rem;
  padding: 0.35rem;
  border-radius: 0.7rem;
  background: var(--bs-paper-bg);
  border: 1px solid var(--bs-border-color);
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.5);
  opacity: 0;
  transform: translateY(4px) scale(0.98);
  transform-origin: top left;
  pointer-events: none;
  transition: opacity 0.12s ease, transform 0.12s ease;
}
.meniu-rezervare.deschis { opacity: 1; transform: none; pointer-events: auto; }
.meniu-rezervare .meniu-cap {
  padding: 0.4rem 0.6rem 0.5rem;
  font-weight: 700;
  font-size: 0.8rem;
  color: var(--bs-heading-color);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-bottom: 1px solid var(--bs-border-color);
  margin-bottom: 0.25rem;
}
.meniu-rezervare .meniu-item {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  width: 100%;
  padding: 0.5rem 0.6rem;
  border: 0;
  background: transparent;
  border-radius: 0.45rem;
  color: var(--bs-body-color);
  font-size: 0.85rem;
  text-align: left;
  cursor: pointer;
}
.meniu-rezervare .meniu-item .icon-base { font-size: 1.05rem; color: var(--lux-accent); flex-shrink: 0; }
.meniu-rezervare .meniu-item:hover { background: rgba(var(--lux-accent-rgb), 0.12); }
.meniu-rezervare .meniu-item.cu-separator {
  margin-top: 0.25rem;
  border-top: 1px solid var(--bs-border-color);
  padding-top: 0.6rem;
}
/* actiune distructiva (Anuleaza/Deblocheaza): buton VIZIBIL cu fundal rosu subtil
   + text rosu deschis, nu doar text pe fundalul meniului (se pierdea) */
.meniu-rezervare .meniu-item.periculos {
  background: rgba(var(--bs-danger-rgb), 0.14);
  color: color-mix(in srgb, var(--bs-danger) 78%, #fff);
  font-weight: 600;
}
.meniu-rezervare .meniu-item.periculos .icon-base {
  color: color-mix(in srgb, var(--bs-danger) 78%, #fff);
}
.meniu-rezervare .meniu-item.periculos:hover {
  background: rgba(var(--bs-danger-rgb), 0.24);
}
@media (max-width: 767.98px) {
  .meniu-rezervare { min-width: 14rem; }
  .meniu-rezervare .meniu-item { padding: 0.7rem 0.7rem; font-size: 0.92rem; }
}

/* insigna de mentenanta din dreptul camerei: aceeasi marime ca frunza de
   curatenie si palpaie mereu (rosie si cu inel cand e urgenta) */
/* DOAR glifa becului, identica ca gabarit si aliniere cu frunza — niciun
   fundal, niciun chenar, in nicio stare (nici hover, nici focus) */
.insigna-problema {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.35rem;
  height: 1.35rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent !important;
  -webkit-appearance: none;
  appearance: none;
  color: var(--bs-warning);
  cursor: pointer;
  flex-shrink: 0;
  vertical-align: -0.2em;
  animation: puls-soft 2.6s ease-in-out infinite;
}
.insigna-problema:focus,
.insigna-problema:focus-visible { outline: 0; box-shadow: none; }
/* glifa becului e desenata mai mica decat frunza la acelasi font-size,
   asa ca primeste un corp mai mare ca sa arate egale vizual */
.insigna-problema .icon-base { font-size: 1.3rem; }
.insigna-problema:hover {
  transform: scale(1.15);
  animation: none;
  opacity: 1;
}
.insigna-problema.urgenta {
  color: var(--bs-danger);
  animation: puls-soft 2.6s ease-in-out infinite, puls-problema 1.6s ease-in-out infinite;
}
/* urgentele stralucesc pe FORMA becului (drop-shadow urmeaza glifa),
   nu cu inel box-shadow — ala desena un patrat cu colturi rotunde */
@keyframes puls-problema {
  0%, 100% { filter: drop-shadow(0 0 0 rgba(var(--bs-danger-rgb), 0)); }
  50%      { filter: drop-shadow(0 0 5px rgba(var(--bs-danger-rgb), 0.9)); }
}
/* ordinea in celula: numarul, apoi frunza, apoi mentenanta */
.celula-camera .numar-camera { margin-right: 0.35rem; }
/* frunza palpaie usor cand starea NU e verde (murdara, mentenanta) */
.celula-camera .frunza-curatenie.frunza-warning,
.celula-camera .frunza-curatenie.frunza-secondary {
  animation: puls-soft 2.8s ease-in-out infinite;
}

/* ————— UN SINGUR indicator de stare cameră (curățenie + probleme) —————
   folosit și în calendar, și în drawerul „Mută în altă cameră" (aceleași culori) */
.stare-camera {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.35rem; height: 1.35rem; margin-right: 0.3rem; padding: 0;
  border: 0; border-radius: 0.4rem; background: transparent;
  line-height: 1; vertical-align: -0.2em; cursor: pointer; flex-shrink: 0;
  transition: background 0.15s, transform 0.15s;
}
.celula-camera .stare-camera:hover { background: rgba(var(--lux-accent-rgb), 0.14); transform: scale(1.12); animation: none; }
/* în drawer indicatorul e doar informativ (nu se apasă separat) */
.camera-muta .stare-camera { cursor: inherit; pointer-events: none; margin-right: 0; }
.stare-camera.stare-success { color: var(--bs-success); }      /* curat = verde */
.stare-camera.stare-warning { color: var(--bs-warning); }      /* de curățat = portocaliu */
.stare-camera.stare-secondary { color: var(--bs-secondary-color); } /* mentenanță = gri */
.stare-camera.stare-danger { color: var(--bs-danger); }        /* problemă = roșu */
.stare-camera .icon-base { font-size: 0.95rem; }
/* glifa becului e mai mică la același font-size — corp mai mare ca să pară egal */
.stare-camera.stare-danger .icon-base { font-size: 1.15rem; }
.stare-camera.pulseaza { animation: puls-soft 2.6s ease-in-out infinite; }
.stare-camera.stare-danger.pulseaza { animation: puls-soft 2.6s ease-in-out infinite, puls-problema 1.6s ease-in-out infinite; }
.celula-camera .frunza-curatenie:hover { animation: none; opacity: 1; }

/* fisa camerei — tabul Probleme/mentenanta */
.adauga-problema .rand-adauga-problema {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-top: 0.6rem;
}
.problema-card {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.65rem 0.8rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.6rem;
  background: color-mix(in srgb, var(--bs-body-color) 4%, transparent);
}
.problema-card + .problema-card { margin-top: 0.5rem; }
.problema-card.urgenta { border-color: rgba(var(--bs-danger-rgb), 0.45); background: rgba(var(--bs-danger-rgb), 0.07); }
.problema-card.rezolvata { opacity: 0.72; }
.problema-card .problema-corp { flex: 1; min-width: 0; }
.problema-card .problema-text { font-size: 0.86rem; color: var(--bs-body-color); }
.problema-card.rezolvata .problema-text { text-decoration: line-through; }
.problema-card .problema-sub { font-size: 0.74rem; color: var(--bs-secondary-color); margin-top: 0.15rem; }
.problema-card .eticheta-urgent {
  display: inline-block;
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding: 0.05rem 0.4rem;
  border-radius: 1rem;
  background: var(--bs-danger);
  color: #fff;
  margin-right: 0.35rem;
  vertical-align: 0.05em;
}
.taburi-camera .contor-tab.urgent { background: var(--bs-danger); }

/* drawer de mutare (separat de fereastra de vizualizare) */
.drawer-muta { width: min(24rem, 92vw); }
.drawer-muta .muta-rezumat {
  padding: 0.7rem 0.85rem;
  border-radius: 0.6rem;
  background: rgba(var(--lux-accent-rgb), 0.08);
  border: 1px solid rgba(var(--lux-accent-rgb), 0.25);
}
.drawer-muta .muta-rezumat .mr-nume { font-weight: 700; color: var(--bs-heading-color); }
.drawer-muta .muta-rezumat .mr-sub { font-size: 0.8rem; color: var(--bs-secondary-color); margin-top: 0.1rem; }
.drawer-muta .muta-avertisment {
  margin-top: 0.6rem;
  padding: 0.55rem 0.7rem;
  border-radius: 0.5rem;
  background: rgba(var(--bs-warning-rgb), 0.12);
  border: 1px solid rgba(var(--bs-warning-rgb), 0.35);
  color: var(--bs-warning);
  font-size: 0.8rem;
}
.lista-camere-muta {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(4.6rem, 1fr));
  gap: 0.5rem;
  margin-top: 0.5rem;
}
.camera-muta {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 0.55rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.55rem;
  background: var(--bs-body-bg);
  cursor: pointer;
  transition: border-color 0.12s, background 0.12s;
}
.camera-muta:hover { border-color: rgba(var(--lux-accent-rgb), 0.5); }
.camera-muta.aleasa {
  border-color: var(--lux-accent);
  background: rgba(var(--lux-accent-rgb), 0.14);
  box-shadow: inset 0 0 0 1px var(--lux-accent);
}
.camera-muta .cm-nr { font-weight: 600; font-variant-numeric: tabular-nums; }
.camera-muta .pastila-curatenie {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.15rem;
  height: 1.15rem;
  border-radius: 50%;
  flex-shrink: 0;
}
.camera-muta .pastila-curatenie .icon-base { font-size: 0.75rem; }
.camera-muta .pastila-curatenie.frunza-success { background: rgba(var(--bs-success-rgb), 0.2); color: var(--bs-success); }
.camera-muta .pastila-curatenie.frunza-warning { background: rgba(var(--bs-warning-rgb), 0.2); color: var(--bs-warning); }
.camera-muta .pastila-curatenie.frunza-secondary { background: rgba(var(--bs-secondary-rgb), 0.2); color: var(--bs-secondary-color); }
.muta-gol { padding: 1rem; text-align: center; color: var(--bs-secondary-color); font-size: 0.85rem; }
.actiuni-muta { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 1.25rem; }

/* fereastra rezervarii pe taburi (Rezervare editabil / Mesaje / Istoric) */
.banner-ota {
  display: flex; align-items: flex-start; gap: 0.3rem;
  padding: 0.7rem 0.85rem; margin-bottom: 1rem;
  border-radius: 0.6rem;
  background: rgba(var(--bs-info-rgb), 0.12);
  border: 1px solid rgba(var(--bs-info-rgb), 0.35);
  font-size: 0.82rem; line-height: 1.45;
}
.banner-ota .icon-base { color: var(--bs-info); font-size: 1.2rem; flex-shrink: 0; margin-top: 0.05rem; }
.form-rezervare .form-control:disabled,
.form-rezervare .form-select:disabled { opacity: 0.55; cursor: not-allowed; }
.rand-istoric-rez { padding: 0.55rem 0; border-bottom: 1px solid var(--bs-border-color); }
.rand-istoric-rez:last-child { border-bottom: 0; }
.rand-istoric-rez .ir-cap { display: flex; justify-content: space-between; gap: 0.75rem; }
.rand-istoric-rez .ir-tip { font-weight: 600; font-size: 0.84rem; color: var(--bs-heading-color); }
.rand-istoric-rez .ir-cand { font-size: 0.74rem; color: var(--bs-secondary-color); white-space: nowrap; }
.rand-istoric-rez .ir-det { font-size: 0.8rem; color: var(--bs-body-color); white-space: pre-wrap; margin-top: 0.1rem; }
.rand-istoric-rez .ir-autor { font-size: 0.72rem; color: var(--bs-secondary-color); margin-top: 0.1rem; }

/* sageti de continuare: rezervarea iese din fereastra vizibila (incepe inainte
   / se termina dupa) — capatul taiat primeste o sageata, ca la marile PMS */
.bara-rezervare.continuare::before,
.bara-rezervare.continua-dupa::after {
  font-family: inherit;
  font-size: 0.72rem;
  font-weight: 800;
  opacity: 0.85;
  flex-shrink: 0;
  line-height: 1;
}
.bara-rezervare.continuare::before { content: '◀'; margin-right: 0.15rem; }
.bara-rezervare.continua-dupa::after { content: '▶'; margin-left: 0.15rem; }

/* TABURI in ferestre (REGULA, vezi CONVENTII): randul de taburi e o BANDA
   proprie (fundal usor diferit, intinsa pe toata latimea ferestrei), activ =
   auriu cu subliniere, inactive sterse. Banda ramane LIPITA sus la scroll. */
.taburi-rezervare,
.taburi-camera {
  position: sticky;
  top: 0;
  z-index: 6;
  gap: 0.15rem;
  margin-inline: calc(-1 * var(--bs-modal-padding, 1.5rem));
  padding-inline: var(--bs-modal-padding, 1.5rem);
  padding-top: 0.35rem;
  background-color: var(--bs-paper-bg);
  background-image: linear-gradient(
    color-mix(in srgb, var(--bs-body-color) 5%, transparent),
    color-mix(in srgb, var(--bs-body-color) 5%, transparent));
  border-bottom: 1px solid var(--bs-border-color);
}
.taburi-rezervare .nav-link,
.taburi-camera .nav-link {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0;
  padding: 0.55rem 0.95rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--bs-secondary-color);
}
.taburi-rezervare .nav-link:hover,
.taburi-camera .nav-link:hover { color: var(--bs-heading-color); }
.taburi-rezervare .nav-link.active,
.taburi-camera .nav-link.active {
  color: var(--lux-accent) !important;
  border-bottom-color: var(--lux-accent) !important;
}
#modal-detalii .tab-content { padding-top: 1rem; }
/* stripul de sumar (Stare/Camera/Total/Total de plata/Canal): carduri cu icon,
   latime 100% impreuna (grid egal), premium */
#det-continut.lista-valori {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
  gap: 0.5rem;
}
.card-sumar {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.6rem 0.75rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.6rem;
  background: color-mix(in srgb, var(--bs-body-color) 4%, transparent);
  min-width: 0;
}
.card-sumar .cs-icon {
  font-size: 1.35rem;
  color: var(--lux-accent);
  flex-shrink: 0;
}
.card-sumar .cs-text { display: flex; flex-direction: column; gap: 0.05rem; min-width: 0; }
.card-sumar .cs-eticheta {
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bs-secondary-color);
}
.card-sumar .cs-valoare {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--bs-heading-color);
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
/* cardul „Total de plata": culoarea urmeaza soldul (rosu datorie / verde achitat) */
.card-sumar.sold-datorie { border-color: color-mix(in srgb, var(--bs-danger) 55%, var(--bs-border-color)); }
.card-sumar.sold-datorie .cs-icon,
.card-sumar.sold-datorie .cs-valoare { color: var(--bs-danger); }
.card-sumar.sold-achitat { border-color: color-mix(in srgb, var(--bs-success) 55%, var(--bs-border-color)); }
.card-sumar.sold-achitat .cs-icon,
.card-sumar.sold-achitat .cs-valoare { color: var(--bs-success); }
.card-sumar.sold-credit { border-color: color-mix(in srgb, var(--lux-accent) 55%, var(--bs-border-color)); }
.card-sumar.sold-credit .cs-icon,
.card-sumar.sold-credit .cs-valoare { color: var(--lux-accent); }

/* segment de alegere (cetatenie): doua optiuni ca butoane grupate, cat un
   input de inalt, cu icon; alternativa premium la radio-uri */
.segment-alegere {
  display: flex;
  width: 100%;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.5rem;
  overflow: hidden;
  min-height: calc(1.5em + 0.9375rem + calc(var(--bs-border-width) * 2));
}
.segment-alegere .btn-check { position: absolute; clip: rect(0,0,0,0); pointer-events: none; }
.segment-alegere .segment-optiune {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  margin: 0;
  padding: 0.4rem 0.5rem;
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--bs-secondary-color);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.segment-alegere .segment-optiune + .btn-check + .segment-optiune,
.segment-alegere .btn-check + .segment-optiune {
  border-left: 1px solid var(--bs-border-color);
}
.segment-alegere .segment-optiune .icon-base { font-size: 1.05rem; }
.segment-alegere .segment-optiune:hover { color: var(--bs-heading-color); }
/* activ: umplere aurie plina, fara chenar inset (chenarul inset nu urma
   colturile rotunjite ale segmentului si parea „mancat" la colturi) */
.segment-alegere .btn-check:checked + .segment-optiune {
  background: rgba(var(--lux-accent-rgb), 0.18);
  color: var(--lux-accent);
  font-weight: 600;
}
.segment-alegere .btn-check:focus-visible + .segment-optiune { outline: 2px solid var(--lux-accent); outline-offset: -2px; }
/* taburile Mesaje si Istoric respira: continutul nu se lipeste de banda */
#tab-mesaje .lista-mesaje { min-height: 3rem; }
#tab-istoric { padding-bottom: 0.5rem; }

/* plicul palpaie soft cand rezervarea are mesaje pe fir */
@keyframes puls-soft { 0%, 100% { opacity: 0.95; } 50% { opacity: 0.3; } }
.iconite-bara .puls-soft { animation: puls-soft 2.4s ease-in-out infinite; }

/* membrii grupului in panoul de grup: fiecare camera cu numele ei */
.det-grup .grup-membri { margin-top: 0.55rem; display: flex; flex-direction: column; gap: 0.25rem; }
.det-grup .grup-membru {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 0.3rem 0.5rem;
  border-radius: 0.4rem;
  font-size: 0.82rem;
}
.det-grup .grup-membru.curent { background: rgba(var(--lux-accent-rgb), 0.12); }
.det-grup .gm-camera {
  min-width: 4.2rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: var(--lux-accent);
}
.det-grup .gm-nume { flex: 1; color: var(--bs-body-color); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.det-grup .gm-badge {
  font-size: 0.62rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em;
  padding: 0.1rem 0.45rem; border-radius: 1rem;
  background: rgba(var(--lux-accent-rgb), 0.2); color: var(--lux-accent-deschis);
}

/* banda de taburi se lipeste de linia titlului la scroll: modal-body fara
   padding sus (golul de padding lasa continutul scrolat sa se vada deasupra
   benzii); spatierea revine prin marginea primului element de sub banda */
#modal-detalii .modal-body,
#modal-camera #continut-camera.modal-body { padding-top: 0; }
#modal-detalii .banner-ota { margin-top: var(--bs-modal-padding, 1.5rem); }
#modal-camera .antet-camera { margin-top: var(--bs-modal-padding, 1.5rem); }

/* mesaje necitite: usor evidentiate prin fundal (stil aplicatie, FARA dunga
   colorata in stanga); necititul se vede si din bifa de citire + pinul de pe tab */
.mesaj-nota.necitita {
  background: color-mix(in srgb, var(--lux-accent) 6%, transparent);
}
.mesaj-citeste {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border: 0;
  border-radius: 50%;
  background: rgba(var(--lux-accent-rgb), 0.15);
  color: var(--lux-accent);
  cursor: pointer;
  flex-shrink: 0;
}
.mesaj-citeste:hover { background: rgba(var(--lux-accent-rgb), 0.3); }
.mesaj-citeste .icon-base { font-size: 0.85rem; }


/* zona de scriere a notei: butonul se intinde exact cat textarea */
.adauga-mesaj { display: flex; flex-direction: column; }
.adauga-mesaj .form-control { width: 100%; }

/* profilul oaspetelui in fereastra rezervarii */
.det-profil {
  margin-bottom: 1rem;
  padding: 0.6rem 0.8rem;
  border-radius: 0.55rem;
  background: rgba(var(--lux-accent-rgb), 0.07);
  border: 1px solid rgba(var(--lux-accent-rgb), 0.22);
}
.det-profil .profil-antet { font-size: 0.84rem; font-weight: 600; color: var(--bs-heading-color); }
.det-profil .profil-antet .icon-base { color: var(--lux-accent); }
.det-profil .profil-sejur { font-size: 0.78rem; color: var(--bs-secondary-color); margin-top: 0.15rem; font-variant-numeric: tabular-nums; }

/* folio: credit disponibil (plata in avans, card de vacanta) */
.folio-sold.credit {
  background: rgba(var(--bs-info-rgb), 0.08);
  border-color: rgba(var(--bs-info-rgb), 0.35);
}
.folio-sold.credit .fs-eticheta, .folio-sold.credit .fs-suma { color: var(--bs-info); }

@media (max-width: 767.98px) {
  /* REGULA DE AUR pe mobile: butoanele subsolului umplu latimea INTREAGA,
     cate DOUA pe rand, egale; cel ramas singur se intinde pe tot randul —
     nimic inegal, nimic aruncat (Inchide ramane ultimul) */
  .modal-footer {
    flex-wrap: wrap;
    gap: 0.5rem;
  }
  .modal-footer .btn {
    flex: 1 1 calc(50% - 0.5rem);
    min-width: calc(50% - 0.5rem);
    margin: 0;
    justify-content: center;
    text-align: center;
  }
  /* REGULA DE AUR (formulare): pe mobil orice rand input+buton se stivuieste,
     butonul trece pe latimea intreaga dedesubt - nimic aruncat pe langa */
  .rand-input-buton {
    flex-direction: column;
    align-items: stretch;
  }
  .rand-input-buton > .btn,
  .rand-input-buton > .form-control,
  .rand-input-buton > .selector-cautare {
    width: 100%;
    flex: 1 1 auto;
  }
  /* actiunile folio raman pe UN rand (concise), doar mai stranse */
  .folio-actiuni .btn { padding-left: 0.25rem; padding-right: 0.25rem; font-size: 0.82rem; }
  .folio-actiuni .btn .icon-base { margin-right: 0.2rem !important; }
  /* randul de taburi nu mai iese din ecran: deruleaza orizontal */
  .taburi-rezervare,
  .taburi-camera {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .taburi-rezervare::-webkit-scrollbar,
  .taburi-camera::-webkit-scrollbar { display: none; }
  .taburi-rezervare .nav-link,
  .taburi-camera .nav-link { white-space: nowrap; }
}

/* dialogurile Swal cu campuri: aceleasi stiluri ca formularele aplicatiei */
.swal2-popup .swal2-input,
.swal2-popup .swal2-select,
.swal2-popup .swal2-textarea {
  width: calc(100% - 2rem);
  margin: 0.4rem 1rem;
  padding: 0.5rem 0.9rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.5rem;
  background: var(--bs-body-bg);
  color: var(--bs-body-color);
  font-size: 0.9rem;
  box-shadow: none;
}
.swal2-popup .swal2-select { appearance: auto; height: 2.5rem; }
.swal2-popup .swal2-input:focus,
.swal2-popup .swal2-select:focus,
.swal2-popup .swal2-textarea:focus {
  border-color: rgba(var(--lux-accent-rgb), 0.6);
  box-shadow: 0 0 0 0.2rem rgba(var(--lux-accent-rgb), 0.12);
  outline: 0;
}

/* ratingul cu stele al oaspetelui (fidelitate + volum) */
.det-profil .stele-profil { display: inline-flex; gap: 0.1rem; margin-right: 0.6rem; vertical-align: -0.15em; }
.det-profil .stele-profil .icon-base { font-size: 0.95rem; color: var(--lux-accent); }
.det-profil .stele-profil .tabler-star { opacity: 0.35; }

/* selecturile din ferestrele Swal: aceeasi piesa ca in restul aplicatiei
   (sageata la dreapta + cautare), nu selectul brut al browserului.
   REGULA: aceeasi latime si aceeasi inaltime ca .swal2-input de deasupra /
   dedesubt (un camp pe rand = toate campurile perfect aliniate). */
.swal2-popup .selector-swal {
  width: calc(100% - 2rem);
  margin: 0.4rem 1rem;
  text-align: left;
}
.swal2-popup .selector-swal .camp-selector {
  width: 100%;
  min-height: 0;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  border-radius: 0.5rem;
  font-size: 0.9rem;
}
.swal2-popup .swal2-html-container {
  overflow: visible; /* meniul selectorului nu se taie la marginea ferestrei */
}
.swal2-popup .selector-swal .dropdown-menu {
  z-index: 1080;
}

/* banda cu oaspetele din tabul Rezervare: INFORMATIE, nu camp de formular
   (numele si telefonul se editeaza in fisa persoanei) */
.info-persoana {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.7rem 0.9rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.625rem;
  background: color-mix(in srgb, var(--bs-paper-bg) 55%, transparent);
}
.info-persoana .ip-icon {
  font-size: 1.4rem;
  color: var(--lux-accent);
  flex-shrink: 0;
}
.info-persoana .ip-text {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}
.info-persoana .ip-nume {
  font-weight: 600;
  color: var(--bs-heading-color);
  overflow-wrap: anywhere;
}
.info-persoana .ip-telefon {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.82rem;
  color: var(--bs-secondary-color);
}
.info-persoana .ip-telefon:hover { color: var(--lux-accent); }
.info-persoana .ip-fisa { margin-left: auto; flex-shrink: 0; }
@media (max-width: 575.98px) {
  .info-persoana { flex-wrap: wrap; }
  .info-persoana .ip-fisa { margin-left: 0; width: 100%; }
}

/* logo-ul canalului, lipit de denumire in bannerul OTA */
.banner-ota .canal-ota { white-space: nowrap; }
.banner-ota .canal-ota .icon-base {
  font-size: 1.05rem;
  vertical-align: -0.2em;
  margin-right: 0.3rem;
}

/* nota de cont TABELARA: text la stanga, sume aliniate la dreapta pe o
   singura coloana, benzi de sectiune cu subtotal - se citeste ca un extras */
.tabel-folio {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 0.75rem;
}
.tabel-folio td { vertical-align: top; }
.tabel-folio .tf-sectiune td {
  padding: 0.85rem 0.5rem 0.35rem;
  border-bottom: 1px solid var(--bs-border-color);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--lux-accent);
}
.tabel-folio .tf-rand td {
  padding: 0.5rem;
  border-bottom: 1px solid color-mix(in srgb, var(--bs-border-color) 55%, transparent);
}
.tabel-folio .tf-descriere { display: block; color: var(--bs-heading-color); }
.tabel-folio .tf-detaliu { display: block; font-size: 0.78rem; color: var(--bs-secondary-color); }
.tabel-folio .tf-suma {
  text-align: right;
  white-space: nowrap;
  width: 1%;
  font-variant-numeric: tabular-nums;
  font-weight: 500;
}
.tabel-folio .tf-sectiune .tf-suma { color: var(--bs-secondary-color); font-weight: 600; }
.tabel-folio .tf-rand.plata .tf-suma { color: var(--bs-success); }
.tabel-folio .tf-actiune { width: 2rem; text-align: right; padding-right: 0.15rem; }
.tabel-folio .tf-rand.anulata .tf-descriere,
.tabel-folio .tf-rand.anulata .tf-suma { text-decoration: line-through; opacity: 0.55; }
.tabel-folio .tf-gol td {
  padding: 0.45rem 0.5rem 0.6rem;
  font-size: 0.8rem;
  color: var(--bs-secondary-color);
}

/* butonul de actiune al TABULUI sta lipit de marginea de jos cat derulezi
   continutul - nu-l mai confunzi cu actiunile rezervarii din subsolul
   ferestrei (Confirma rezervarea etc.) */
.modal .actiuni-tab-lipite {
  position: sticky;
  /* FLUSH pe marginea modalului: bara se lipeste de subsolul ferestrei si se
     intinde pana la marginile ei (mananca paddingul modal-body pe orizontala
     si pe verticala) — arata ca o piesa a modalului, nu un element plutitor
     printre care se vede continutul */
  bottom: calc(-1 * var(--bs-modal-padding, 1.5rem));
  z-index: 5;
  margin-top: 0.35rem;
  margin-left: calc(-1 * var(--bs-modal-padding, 1.5rem));
  margin-right: calc(-1 * var(--bs-modal-padding, 1.5rem));
  padding: 0.85rem var(--bs-modal-padding, 1.5rem);
  background: var(--bs-modal-bg, var(--bs-paper-bg));
  border-top: 1px solid var(--bs-border-color);
}

/* meniul selectoarelor e intotdeauna OPAC - nimic nu se vede prin el
   (fundalul fortat aici acopera si cazul in care variabila temei nu se
   rezolva in contextul popupului, cum patea flatpickr pe body) */
.selector-cautare .selector-multiplu-meniu,
.selector-multiplu .selector-multiplu-meniu {
  background-color: var(--bs-paper-bg, #2f3349) !important;
  opacity: 1 !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* ---- semnele de pe rezervari, comutabile din legenda (insula de info) ----
   activ = colorat pe culoarea semnului; inactiv = monocolor, sters, taiat */
.panou-legenda .mic-nota { font-size: 0.75rem; line-height: 1.35; }
.semne-legenda { display: flex; flex-direction: column; gap: 0.35rem; }
.semn-comuta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: none;
  border: 0;
  padding: 0.15rem 0.1rem;
  font: inherit;
  font-size: 0.82rem;
  color: var(--bs-body-color);
  cursor: pointer;
  text-align: left;
  transition: color 0.15s;
}
.semn-comuta .mostra-semn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.55rem;
  height: 1.55rem;
  flex-shrink: 0;
  border-radius: 0.45rem;
  background: color-mix(in srgb, var(--bs-body-color) 8%, transparent);
  color: var(--bs-secondary-color);
  transition: background 0.15s, color 0.15s;
}
.semn-comuta .mostra-semn .icon-base { font-size: 1rem; }
/* ACTIV: pastila colorata pe culoarea semnului */
.semn-comuta.activ.semn-info    .mostra-semn { color: var(--bs-info);    background: rgba(var(--bs-info-rgb), 0.16); }
.semn-comuta.activ.semn-success .mostra-semn { color: var(--bs-success); background: rgba(var(--bs-success-rgb), 0.16); }
.semn-comuta.activ.semn-warning .mostra-semn { color: var(--bs-warning); background: rgba(var(--bs-warning-rgb), 0.16); }
.semn-comuta.activ.semn-primary .mostra-semn { color: var(--bs-primary); background: rgba(var(--bs-primary-rgb), 0.16); }
.semn-comuta.activ.semn-accent  .mostra-semn { color: var(--lux-accent); background: rgba(var(--lux-accent-rgb), 0.16); }
.semn-comuta.activ.semn-secondary .mostra-semn { color: var(--bs-secondary, #8592a3); background: color-mix(in srgb, var(--bs-body-color) 16%, transparent); }
.semn-comuta.activ.semn-danger  .mostra-semn { color: var(--bs-danger);  background: rgba(var(--bs-danger-rgb), 0.16); }
/* iconița de mesaje necitite = ROȘIE (atrage atenția), cu halou pentru contrast pe orice bară */
.bara-rezervare .iconite-bara .semn-mesaj { color: #ff4d4f; opacity: 1; filter: drop-shadow(0 0 1px rgba(0, 0, 0, 0.55)); }
/* INACTIV: monocolor, sters, eticheta taiata */
.semn-comuta.inactiv { color: var(--bs-secondary-color); text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--bs-secondary-color) 55%, transparent); }
.semn-comuta.inactiv .mostra-semn {
  color: var(--bs-secondary-color);
  background: color-mix(in srgb, var(--bs-body-color) 8%, transparent);
  opacity: 0.5;
  filter: grayscale(1); /* desaturează gold/culoarea semnului -> monocolor real */
}
.semn-comuta:hover { color: var(--bs-heading-color); }

/* ascunderea efectiva a semnelor de pe TOATE barele (clasa pe body, pe cont) */
.ascunde-semn-grup .iconite-bara .semn-grup,
.ascunde-semn-sosire .iconite-bara .semn-sosire,
.ascunde-semn-plecare .iconite-bara .semn-plecare,
.ascunde-semn-mesaj .iconite-bara .semn-mesaj,
.ascunde-semn-observatii .iconite-bara .semn-observatii,
.ascunde-semn-cazat .iconite-bara .semn-cazat { display: none !important; }

/* canalul in tooltip si in cardul de sumar: insigna colorata a brandului
   (aceeasi monograma ca in legenda/pe bare), nu iconita aurie a aplicatiei */
.tt-rand .tt-val.tt-canal { display: inline-flex; align-items: center; gap: 0.4rem; }
.card-sumar .cs-badge { display: inline-flex; align-items: center; flex-shrink: 0; }
.card-sumar .cs-badge .monograma-canal { min-width: 1.35rem; height: 1.35rem; font-size: 0.62rem; }
.card-sumar .cs-badge .monograma-canal svg { width: 0.95rem; height: 0.95rem; }

/* canalul sub titlul modalului (insigna colorata + nume), scos din strip */
.modal-header .det-titlu-zona { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }
.det-titlu-canal { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 0.82rem; color: var(--bs-secondary-color); }
.det-titlu-canal .monograma-canal { min-width: 1.15rem; height: 1.15rem; }

/* butonul „Grup" din banda cu oaspetele: LIPIT de „Fișa persoanei" (perechea
   de actiuni sta impreuna in dreapta, nu aruncata la mijloc) */
.info-persoana .ip-grup { margin-left: auto; flex-shrink: 0; }
.info-persoana .ip-grup:not(.d-none) + .ip-fisa { margin-left: 0; }

/* tabul GRUP: lista rezervarilor grupului cu actiuni */
.grup-antet-tab { font-size: 0.95rem; margin-bottom: 0.75rem; color: var(--bs-heading-color); }
.grup-antet-tab .icon-base { color: var(--lux-accent); vertical-align: -0.15em; }
.grup-lista { display: flex; flex-direction: column; gap: 0.5rem; }
/* fiecare rand: informatiile sus, apoi butoanele pe UN rand propriu, la fel
   pentru toti (indiferent daca sunt 2 sau 3) — consecvent, nu odata langa,
   odata dedesubt */
.grup-rand {
  display: flex; flex-direction: column; align-items: stretch; gap: 0.6rem;
  padding: 0.65rem 0.85rem; border: 1px solid var(--bs-border-color); border-radius: 0.6rem;
  background: color-mix(in srgb, var(--bs-body-color) 3%, transparent);
}
.grup-rand.curent { border-color: rgba(var(--lux-accent-rgb), 0.5); background: rgba(var(--lux-accent-rgb), 0.07); }
.grup-rand .gr-info { display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
.grup-rand .gr-camera { font-weight: 700; color: var(--bs-heading-color); }
.grup-rand .gr-camera .icon-base { color: var(--lux-accent); vertical-align: -0.12em; }
.grup-rand .gr-nume { font-size: 0.9rem; color: var(--bs-body-color); overflow-wrap: anywhere; }
.grup-rand .gr-sub { font-size: 0.76rem; color: var(--bs-secondary-color); }
.grup-rand .gr-actiuni { display: flex; gap: 0.4rem; align-items: stretch; }
.grup-rand .gr-actiuni .btn { flex: 1 1 0; }
.grup-rand .gm-badge {
  flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center;
  font-size: 0.7rem; font-weight: 700; color: var(--lux-accent);
  background: rgba(var(--lux-accent-rgb), 0.14); padding: 0.2rem 0.55rem; border-radius: 0.4rem;
}
@media (max-width: 575.98px) {
  .grup-rand .gr-actiuni { flex-wrap: wrap; }
  .grup-rand .gr-actiuni .btn, .grup-rand .gm-badge { flex: 1 1 calc(50% - 0.4rem); }
}

/* administrare grup: creionul de redenumire (antet + pe fiecare membru) */
.grup-antet-tab { display: flex; align-items: center; gap: 0.3rem; flex-wrap: wrap; }
.grup-antet-tab .grup-redenumeste { padding: 0.1rem 0.35rem; }
.grup-antet-tab .grup-redenumeste .icon-base { font-size: 0.85rem; }
.btn-redenumire-membru {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.35rem; height: 1.35rem; padding: 0; border: 0; border-radius: 0.35rem;
  background: transparent; color: var(--bs-secondary-color); cursor: pointer;
  vertical-align: -0.15em;
}
.btn-redenumire-membru:hover { color: var(--lux-accent); background: rgba(var(--lux-accent-rgb), 0.12); }
.btn-redenumire-membru .icon-base { font-size: 0.8rem; }
/* mobil: si butonul Grup din banda intra pe latime intreaga, ca Fisa persoanei */
@media (max-width: 575.98px) {
  .info-persoana .ip-grup { margin-left: 0; width: 100%; }
}

/* invelis transparent pt subsolul contextual: copiii raman itemi flex directi */
.modal-footer .continut-direct { display: contents; }

/* randul de actiuni din tabul Grup: TOATE piesele la aceeasi inaltime —
   eticheta „aceasta" se intinde cat butoanele de langa ea */
.grup-rand .gr-actiuni { align-items: stretch; }
.grup-rand .gr-actiuni .gm-badge { display: inline-flex; align-items: center; }

/* ============================== WIZARDUL de rezervare noua ==============================
   Firul pasilor sub titlu + carduri mari pentru tip + rooming list + rezumat */
/* progresul: numele pasului + o linie fina aurie care se umple, sub titlu */
.wiz-progres { display: flex; flex-direction: column; gap: 0.3rem; margin-top: 0.25rem; min-width: 11rem; }
.wiz-progres .wp-text { font-size: 0.78rem; color: var(--bs-secondary-color); letter-spacing: 0.02em; }
.wiz-progres .wp-bara {
  height: 3px; border-radius: 2px; overflow: hidden;
  background: color-mix(in srgb, var(--bs-border-color) 70%, transparent);
}
.wiz-progres .wp-bara i {
  display: block; height: 100%; width: 25%;
  background: linear-gradient(90deg, var(--lux-accent), color-mix(in srgb, var(--lux-accent) 70%, #fff));
  border-radius: 2px; transition: width 0.25s ease;
}

/* cardurile de tip (pasul 1): 2x2, mari, cu icon si descriere */
.tipuri-rezervare { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem; }
.card-tip {
  display: flex; flex-direction: column; align-items: center; gap: 0.3rem;
  padding: 1rem 1.1rem; text-align: center;
  border: 1px solid var(--bs-border-color); border-radius: 0.75rem;
  background: color-mix(in srgb, var(--bs-body-color) 3%, transparent);
  cursor: pointer; transition: border-color 0.15s, background 0.15s, transform 0.1s;
}
.card-tip:hover { border-color: rgba(var(--lux-accent-rgb), 0.5); }
.card-tip.aleasa {
  border-color: var(--lux-accent);
  background: rgba(var(--lux-accent-rgb), 0.08);
  box-shadow: 0 0 0 1px var(--lux-accent);
}
.card-tip .icon-base { font-size: 1.5rem; color: var(--lux-accent); }
.card-tip .ct-titlu { font-weight: 700; color: var(--bs-heading-color); }
.card-tip .ct-desc { font-size: 0.78rem; color: var(--bs-secondary-color); line-height: 1.35; }
@media (max-width: 575.98px) { .tipuri-rezervare { grid-template-columns: 1fr; } }

/* rooming list (pasul 3): un rand pe camera, nume+prenume optionale */
#rez-membri { display: flex; flex-direction: column; gap: 0.5rem; }
/* cartile camerelor din rooming: cine sta, cati sunt, ce reducere are camera */
.camera-grup {
  display: flex; flex-direction: column; gap: 0.5rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.6rem;
  padding: 0.6rem 0.75rem;
}
.camera-grup + .camera-grup { margin-top: 0.6rem; }
.camera-grup:first-child {
  border-color: color-mix(in srgb, var(--lux-accent) 40%, transparent);
  background: color-mix(in srgb, var(--lux-accent) 6%, transparent);
}
.camera-grup .cg-antet {
  display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem;
  margin-bottom: 0.5rem; flex-wrap: wrap;
}
.camera-grup .cg-titlu { font-size: 0.82rem; font-weight: 600; }
.camera-grup .cg-alte-date {
  border: 0; background: transparent; padding: 0;
  font-size: 0.76rem; font-weight: 500; color: var(--lux-accent-inchis);
  text-decoration: underline; text-underline-offset: 2px; cursor: pointer;
}
.camera-grup .cg-alte-date:hover { color: var(--lux-accent); }
.camera-grup .cg-date { margin-top: 0.5rem; }
.camera-grup .cg-camp-data {
  flex: 1; display: flex; flex-direction: column; gap: 0.2rem;
  font-size: 0.74rem; color: var(--bs-secondary-color);
}
.camera-grup .cg-nota { font-size: 0.76rem; color: var(--bs-secondary-color); }
.camera-grup .cg-rand { display: flex; gap: 0.5rem; }
.camera-grup .cg-rand + .cg-rand { margin-top: 0; } /* spațierea o dă acum gap-ul cardului */
.camera-grup .cg-rand .form-control { flex: 1; min-width: 0; }
.camera-grup .cg-rand-selecturi > * { flex: 1; min-width: 0; }
@media (max-width: 575.98px) {
  .camera-grup .cg-rand { flex-wrap: wrap; }
  .camera-grup .cg-rand .form-control { flex: 1 1 100%; }
  .camera-grup .cg-rand-selecturi > * { flex: 1 1 100%; }
}

/* camerele grupului, pe tipuri: stepper premium + planul tipului dedesubt */
.lista-tipuri-grup { display: flex; flex-direction: column; gap: 0.6rem; }
.rand-tip-grup {
  border: 1px solid var(--bs-border-color);
  border-radius: 0.6rem;
  padding: 0.55rem 0.75rem;
}
.rand-tip-grup .rtg-cap { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.rand-tip-grup .rtg-nume { font-weight: 600; }
.rand-tip-grup .rtg-disponibil { display: block; font-weight: 400; font-size: 0.72rem; color: var(--bs-success); }
.rand-tip-grup .rtg-disponibil.epuizat { color: var(--bs-secondary-color); }
.rand-tip-grup .rtg-buton:disabled { opacity: 0.4; cursor: not-allowed; }
.rand-tip-grup .rtg-stepper { display: inline-flex; align-items: center; gap: 0.65rem; }
.rand-tip-grup .rtg-buton {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.9rem; height: 1.9rem;
  border: 1px solid color-mix(in srgb, var(--lux-accent) 45%, transparent);
  border-radius: 50%;
  background: transparent;
  color: var(--lux-accent-inchis);
  transition: background 0.12s;
}
.rand-tip-grup .rtg-buton:hover { background: color-mix(in srgb, var(--lux-accent) 14%, transparent); }
.rand-tip-grup .rtg-numar {
  min-width: 1.4rem; text-align: center;
  font-size: 1.05rem; font-weight: 700; font-variant-numeric: tabular-nums;
}
.rand-tip-grup .rtg-plan { margin-top: 0.55rem; max-width: 22rem; }

/* rezumatul din pasul final */
.rezumat-rezervare {
  padding: 0.85rem 1rem; border: 1px solid rgba(var(--lux-accent-rgb), 0.35);
  border-radius: 0.6rem; background: rgba(var(--lux-accent-rgb), 0.06);
}
.rezumat-rezervare .rr-linie { font-size: 0.88rem; padding: 0.15rem 0; }

/* reducerea din randul de membru (rooming list): selector compact */

/* estimarea tarifului din wizard: totalul mare, notele discrete */
/* caseta de pret: structura STABILA ca sa nu „sara" la fiecare recalcul —
   randul principal are inaltime constanta (noptile stanga, totalul dreapta),
   notele vin dedesubt fara sa clatine randul de sus */
.tarif-estimat {
  display: flex; flex-direction: column; gap: 0.2rem;
  padding: 0.7rem 0.9rem; border-radius: 0.6rem;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.35);
  background: rgba(var(--lux-accent-rgb), 0.06);
}
/* la grup, totalul stă „în față" (sticky sus) cât ajustezi camerele */
.tarif-estimat.tarif-grup-sticky {
  position: sticky; top: -0.25rem; z-index: 4;
  background: color-mix(in srgb, var(--bs-paper-bg) 80%, rgba(var(--lux-accent-rgb), 0.14));
  box-shadow: 0 0.35rem 0.9rem rgba(0, 0, 0, 0.18);
}
/* câmpul de tarif din cardul camerei de grup se așează lângă selectoare */
.camera-grup .cg-rand-selecturi .cg-pret { flex: 1 1 0; min-width: 8rem; }
/* contactul pe card: telefon și email exact 50/50 (intl-tel-input umple celula lui) */
.camera-grup .cg-rand-contact { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.camera-grup .cg-rand-contact > .iti,
.camera-grup .cg-rand-contact > .form-control { width: 100%; min-width: 0; }
@media (max-width: 575.98px) { .camera-grup .cg-rand-contact { grid-template-columns: 1fr; } }
/* rândul de plan pe cardul camerei: etichetă mică deasupra + selector pe toată lățimea */
.camera-grup .cg-rand-plan { flex-direction: column; align-items: stretch; gap: 0.2rem; }
.camera-grup .cg-rand-plan .cg-plan-eticheta { font-size: 0.72rem; font-weight: 600; color: var(--bs-secondary-color); }
.camera-grup .cg-rand-plan .selector-cautare { width: 100%; }
@media (max-width: 575.98px) { .camera-grup .cg-rand-selecturi .cg-pret { flex: 1 1 100%; } }
.tarif-estimat .te-principal {
  display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem;
  min-height: 1.6rem;
}
.tarif-estimat .te-nopti { font-size: 0.82rem; color: var(--bs-secondary-color); }
.tarif-estimat .te-total { font-size: 1.2rem; font-weight: 700; color: var(--bs-heading-color); font-variant-numeric: tabular-nums; white-space: nowrap; }
.tarif-estimat .te-gol { font-size: 0.82rem; color: var(--bs-secondary-color); font-style: italic; }
.tarif-estimat .te-nota { font-size: 0.78rem; color: var(--bs-secondary-color); }
.tarif-estimat .te-avertisment { font-size: 0.78rem; color: var(--bs-warning); font-weight: 600; }

/* pastila mica de culoare (surse rezervari, categorii): un cerc colorat */
.pastila-culoare {
  display: inline-block; flex-shrink: 0;
  width: 0.9rem; height: 0.9rem; border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.15);
}

/* Carduri de statistica (KPI) — număr mare, etichetă, notă discretă, medalion auriu.
   Model reutilizabil pentru orice pagină de administrare (oaspeți, companii...). */
.card-statistica .card-body { padding: 1.15rem 1.25rem; }
.card-statistica .stat-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.5rem; height: 2.5rem; margin-bottom: 0.7rem;
  border-radius: 0.65rem; font-size: 1.3rem;
  color: var(--lux-accent);
  background: rgba(var(--lux-accent-rgb), 0.12);
  border: 1px solid rgba(var(--lux-accent-rgb), 0.22);
}
.card-statistica .stat-cifra {
  font-size: 1.75rem; font-weight: 700; line-height: 1.1; letter-spacing: -0.02em;
}
.card-statistica .stat-eticheta { font-weight: 600; margin-top: 0.1rem; }
.card-statistica .stat-nota { font-size: 0.78rem; line-height: 1.35; color: var(--bs-secondary-color); margin-top: 0.15rem; }
/* varianta „evidențiată" pentru indicatorul-cheie (ex. rata de revenire) */
.card-statistica.stat-evidenta {
  background: linear-gradient(180deg, color-mix(in srgb, var(--lux-accent) 10%, var(--bs-paper-bg)), var(--bs-paper-bg));
  border-color: rgba(var(--lux-accent-rgb), 0.35);
}
.card-statistica.stat-evidenta .stat-icon {
  color: var(--lux-pe-auriu);
  background: linear-gradient(180deg, var(--lux-grad-sus), var(--lux-grad-jos));
  border-color: transparent;
}

/* Galeria de imagini a tipului de camera (modal): grila de miniaturi cu X */
.galerie-tip { display: grid; grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); gap: 0.75rem; }
.galerie-celula { position: relative; border-radius: 0.5rem; overflow: hidden; border: 1px solid var(--bs-border-color); }
.galerie-celula img { display: block; width: 100%; height: 6.5rem; object-fit: cover; }
.galerie-sterge {
  position: absolute; top: 0.3rem; right: 0.3rem;
  width: 1.6rem; height: 1.6rem; padding: 0; border: 0; border-radius: 50%;
  background: rgba(0, 0, 0, 0.55); color: #fff;
  display: flex; align-items: center; justify-content: center;
}
.galerie-sterge:hover { background: var(--bs-danger); }

/* GRILA ORARA a salilor de evenimente: o banda pe sala, blocuri pozitionate
   dupa ora — suprapunerile si golurile se vad dintr-o privire. */
/* GRILA ORARA a salilor — acelasi limbaj vizual ca diagrama: antet de ore cu
   numar mare + sufix mic, coloana salilor inghetata in stanga, linii de grila
   discrete, barele ca in calendar (rotunjite, cu umbra, luminate la hover),
   ora curenta marcata in antet + linia „acum" peste benzi */
.panza-sali {
  border: 1px solid var(--bs-border-color);
  border-radius: 0.75rem;
  overflow-x: auto;
  background: var(--bs-paper-bg);
}
.tabel-sali {
  width: 100%;
  min-width: 54rem;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
}
.tabel-sali th.colt-sali {
  width: 11rem;
  padding: 0.55rem 0.75rem;
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bs-secondary-color);
  text-align: start;
  position: sticky;
  left: 0;
  z-index: 3;
  background: var(--bs-paper-bg);
  border-right: 1px solid var(--lux-grila);
  border-bottom: 1px solid var(--lux-grila);
}
.tabel-sali th.cap-ora {
  padding: 0.45rem 0;
  text-align: center;
  border-left: 1px solid var(--lux-grila-slaba);
  border-bottom: 1px solid var(--lux-grila);
  background: var(--bs-paper-bg);
  overflow: hidden;
}
.tabel-sali .numar-ora {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--bs-heading-color);
  font-variant-numeric: tabular-nums;
}
.tabel-sali .sufix-ora {
  font-size: 0.66rem;
  color: var(--bs-secondary-color);
}
.tabel-sali th.cap-ora.ora-acum {
  box-shadow: inset 0 -2px 0 var(--lux-accent);
  background-image: linear-gradient(rgba(var(--lux-accent-rgb), 0.08), rgba(var(--lux-accent-rgb), 0.08));
}
.tabel-sali th.cap-ora.ora-acum .numar-ora { color: var(--lux-accent); }
.tabel-sali th.nume-sala {
  padding: 0.5rem 0.75rem;
  position: sticky;
  left: 0;
  z-index: 2;
  background: var(--bs-paper-bg);
  border-right: 1px solid var(--lux-grila);
  border-bottom: 1px solid var(--lux-grila-slaba);
  text-align: start;
  font-weight: 600;
  font-size: 0.85rem;
}
.tabel-sali th.nume-sala { display: table-cell; }
.tabel-sali .nume-sala > .pastila-culoare { vertical-align: 0.15rem; margin-right: 0.45rem; }
.tabel-sali .text-sala {
  display: inline-block;
  vertical-align: middle;
  max-width: calc(100% - 1.3rem);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tabel-sali .text-sala small { font-weight: 400; }
.tabel-sali td.banda-sala {
  position: relative;
  height: 3.4rem;
  border-bottom: 1px solid var(--lux-grila-slaba);
  /* linia fiecarei ore sta la INCEPUTUL felii — exact sub bordura din antet,
     altfel grila benzii era decalata cu ~1px fata de orele de sus */
  background: repeating-linear-gradient(90deg,
    var(--lux-grila-slaba) 0 1px,
    transparent 1px calc(100% / var(--ore-grila, 16)));
}
/* orele in care sala e INCHISA (in afara programului ei): hasura discreta,
   ca zonele indisponibile din marile calendare */
.zona-inchisa {
  position: absolute;
  top: 0;
  bottom: 0;
  background: repeating-linear-gradient(135deg,
    color-mix(in srgb, var(--bs-secondary-color) 16%, transparent) 0 5px,
    transparent 5px 10px);
  pointer-events: auto;
  z-index: 0;
}
.tabel-sali tr:last-child td.banda-sala,
.tabel-sali tr:last-child th.nume-sala { border-bottom: 0; }
.linie-acum {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: var(--lux-accent);
  opacity: 0.75;
  z-index: 1;
  pointer-events: none;
}
.bara-sala {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: 0.4rem;
  height: 2.15rem;
  padding: 0 0.55rem;
  border: 0;
  border-radius: 0.5rem;
  background: var(--lux-accent);
  color: var(--lux-pe-auriu);
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  overflow: hidden;
  z-index: 2;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  transition: filter 0.12s, box-shadow 0.12s;
  cursor: pointer;
}
.bara-sala:hover {
  filter: brightness(1.12);
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.45);
  z-index: 3;
}
.bara-sala .nume-bara {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
}
.bara-sala .ore-bara {
  flex-shrink: 0;
  font-size: 0.68rem;
  font-weight: 500;
  opacity: 0.85;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.bara-sala.este-optiune {
  opacity: 0.72;
  border: 1px dashed rgba(0, 0, 0, 0.4);
}
@media (max-width: 575.98px) {
  .tabel-sali { min-width: 46rem; }
  .tabel-sali th.colt-sali, .tabel-sali th.nume-sala { width: 7rem; }
  .bara-sala .ore-bara { display: none; }
}

/* Selecturile cu cautare stau pe UN singur rand: eticheta aleasa nu rupe
   butonul pe doua randuri — se taie elegant cu „..." (textul complet e in lista). */
.selector-cautare .camp-selector { overflow: hidden; }
.selector-cautare .eticheta-curenta {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Inputurile text/numar/data urca la INALTIMEA STANDARD a randului (aceeasi cu
   selecturile si datepickerele — regula „controale pe acelasi rand"); erau cu
   2px mai scunde. Variantele -sm/-lg raman neatinse. */
input.form-control:not(.form-control-sm):not(.form-control-lg) {
  min-height: calc(1.5em + 0.9375rem + calc(var(--bs-border-width) * 2));
}

/* Inputul de CULOARE: aceeasi inaltime ca restul inputurilor/selecturilor si
   latime completa; mostra de culoare rotunjita, nu „lungita" pe verticala. */
input[type="color"].form-control-color {
  width: 100%;
  height: calc(1.5em + 0.9375rem + calc(var(--bs-border-width) * 2));
  min-height: 0;
  padding: 0.35rem 0.45rem;
}
input[type="color"].form-control-color::-webkit-color-swatch-wrapper { padding: 0; }
input[type="color"].form-control-color::-webkit-color-swatch {
  border: 0;
  border-radius: 0.3rem;
  height: 100%;
}
input[type="color"].form-control-color::-moz-color-swatch {
  border: 0;
  border-radius: 0.3rem;
}

/* eveniment local pe capul zilei din grila de tarife: punct colorat + tooltip.
   Reper de revenue management — targ/concert in oras = cerere mare. */
.cap-zi { position: relative; }
.cap-zi .punct-eveniment {
  position: absolute;
  top: 0.3rem;
  right: 0.3rem;
  width: 0.45rem;
  height: 0.45rem;
  border-radius: 50%;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--bs-paper-bg) 80%, transparent);
}
.cap-zi .punct-eveniment.impact-ridicat { background: var(--bs-danger); }
.cap-zi .punct-eveniment.impact-mediu { background: var(--bs-warning); }
.cap-zi .punct-eveniment.impact-scazut { background: var(--bs-secondary-color); }
.cap-zi.zi-eveniment .numar-zi { text-decoration: underline dotted 1px; text-underline-offset: 3px; }

/* segment compact (ex. % / lei) pentru tabele dense de suplimente */
.segment-alegere.segment-mic { min-height: 0; }
.segment-alegere.segment-mic .segment-optiune {
  padding: 0.2rem 0.5rem;
  font-size: 0.8rem;
  min-width: 2.1rem;
}

/* subgrup in tabelele mici (etichete de sectiune: Cameră / Adulți / Copii) */
.tabel-istoric .tabel-subgrup td { border-bottom: 0; padding-top: 0.6rem; padding-bottom: 0.15rem; }

/* numarul de telefon din tabel = apel direct (tel:) */
.link-telefon { color: inherit; text-decoration: none; }
.link-telefon:hover { color: var(--lux-accent); }
.link-telefon .ti { color: var(--bs-secondary-color); }
.link-telefon:hover .ti { color: var(--lux-accent); }

/* stelele de fidelitate (pagina Oaspeți) */
.stele-fidelitate { white-space: nowrap; color: var(--lux-accent); }
.stele-fidelitate .ti-star { color: var(--bs-secondary-color); opacity: 0.5; }

/* legenda stelelor din insula de info */
.legenda-fidelitate { display: flex; flex-direction: column; gap: 0.4rem; }
.legenda-fidelitate .rand-legenda {
  display: flex; align-items: center; gap: 0.6rem;
  font-size: 0.85rem; white-space: nowrap;
}
.legenda-fidelitate .stele-fidelitate { flex: 0 0 auto; min-width: 5.5rem; }

/* FISA de oaspete (acordeon): bloc cu aer, detalii aliniate etichetă/valoare —
   nu texte lipite de margine. Pe mobil eticheta sta deasupra valorii. */
.fisa-oaspete > td { padding: 0; border-top: 0; }
.fisa-oaspete-continut {
  padding: 1.25rem 1.5rem 1.4rem;
  background: color-mix(in srgb, var(--lux-accent) 4%, transparent);
  border-top: 1px solid color-mix(in srgb, var(--lux-accent) 22%, transparent);
}
.fisa-sectiuni {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 1.25rem 2.5rem; margin-bottom: 1.4rem;
}
.fisa-bloc { min-width: 0; }
.fisa-detalii { display: flex; flex-direction: column; gap: 0.55rem; }
.fisa-rand { display: flex; gap: 1rem; align-items: baseline; font-size: 0.88rem; }
.fisa-rand .fisa-eticheta { flex: 0 0 8rem; color: var(--bs-secondary-color); }
.fisa-rand .fisa-valoare { flex: 1; min-width: 0; color: var(--bs-body-color); overflow-wrap: anywhere; }
.fisa-oaspete-continut .tabel-istoric th {
  font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em;
  font-weight: 600; color: var(--bs-secondary-color);
}
@media (max-width: 767.98px) {
  .fisa-sectiuni { grid-template-columns: 1fr; gap: 1.15rem; }
  .fisa-oaspete-continut { padding: 1rem 0.9rem 1.1rem; }
  .fisa-rand { flex-direction: column; gap: 0.1rem; }
  .fisa-rand .fisa-eticheta { flex: none; font-size: 0.78rem; }
}

/* Verificarea in doi pasi (Contul meu): panou cu bula de stare, pasii de
   configurare numerotati cu cerc auriu si codul QR pe fundal alb obligatoriu
   (se scaneaza corect si pe tema inchisa) */
.panou-2fa {
  border: 1px solid var(--bs-border-color);
  border-radius: 0.75rem;
  padding: 0.5rem 1.25rem;
}
.panou-2fa .cont-rand { padding-block: 1rem; }
.panou-2fa > .cont-rand + .actiune-2fa {
  border-block-start: 1px solid var(--bs-border-color);
  padding-block: 1rem;
}
.actiune-2fa {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0;
}
.camp-cod-2fa {
  inline-size: 7.5rem;
  text-align: center;
  letter-spacing: 0.35em;
  font-variant-numeric: tabular-nums;
}
.camp-cod-2fa::placeholder { letter-spacing: 0.35em; }
.config-2fa {
  display: flex;
  gap: 1.75rem;
  align-items: flex-start;
  padding-block: 1.25rem;
  border-block-start: 1px solid var(--bs-border-color);
}
.qr-totp {
  background: #fff;
  border-radius: 0.75rem;
  padding: 0.6rem;
  inline-size: 190px;
  block-size: 190px;
  flex-shrink: 0;
  box-shadow: 0 0 0 1px var(--bs-border-color);
}
.qr-totp svg { display: block; width: 100%; height: 100%; }
.pasi-2fa {
  list-style: none;
  counter-reset: pas;
  margin: 0;
  padding: 0;
  flex: 1 1 auto;
  min-inline-size: 0;
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
}
.pasi-2fa > li {
  counter-increment: pas;
  position: relative;
  padding-inline-start: 2.6rem;
}
.pasi-2fa > li::before {
  content: counter(pas);
  position: absolute;
  inset-inline-start: 0;
  inset-block-start: 0;
  inline-size: 1.85rem;
  block-size: 1.85rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 0.85rem;
  background: rgba(var(--lux-accent-rgb), 0.14);
  color: var(--lux-accent);
}
.cheie-2fa {
  display: inline-block;
  padding: 0.35rem 0.65rem;
  border-radius: 0.5rem;
  background: var(--bs-body-bg);
  border: 1px solid var(--bs-border-color);
  letter-spacing: 0.08em;
}
.subsol-2fa {
  border-block-start: 1px solid var(--bs-border-color);
  padding-block: 0.6rem;
  margin: 0;
}
@media (max-width: 575.98px) {
  .panou-2fa .cont-rand { flex-wrap: wrap; }
  .panou-2fa .cont-rand .actiune-2fa { flex: 1 1 100%; }
  .panou-2fa .cont-rand .actiune-2fa .btn { flex: 1 1 auto; }
  .config-2fa { flex-direction: column; align-items: center; }
  .pasi-2fa { align-self: stretch; }
  .actiune-2fa { flex-wrap: wrap; }
  .actiune-2fa .btn { flex: 1 1 auto; }
}

/* pe barele scurte (sub 2 ore) numele are prioritate — ora e in tooltip */
.bara-sala.bara-scurta .ore-bara { display: none; }

/* bara de sus a graficului de sali: navigatorul de zi + filtrul de sala,
   legate de grila ca la calendar; sectiuni aerisite, lista separata sub */
.bara-grila-sali {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  padding: 1.5rem 1.5rem 0.5rem;
}
.filtru-sala-grila { margin-left: auto; min-width: 15rem; }
.filtru-sala-grila form { margin: 0; }
.sectiune-grila-sali { padding: 0.75rem 1.5rem 1.75rem; }
.antet-lista-sali {
  padding: 1.25rem 1.5rem 0.75rem;
  border-top: 1px solid var(--bs-border-color);
}
/* segmentul „Astăzi": stins ca reper cand esti deja pe azi */
.navigator-zi .segment-nav.este-azi {
  color: var(--bs-secondary-color);
  pointer-events: none;
}
@media (max-width: 575.98px) {
  .bara-grila-sali { padding: 1rem 1rem 0.5rem; }
  .filtru-sala-grila { margin-left: 0; flex: 1 1 100%; min-width: 0; }
  .sectiune-grila-sali { padding: 0.5rem 1rem 1.25rem; }
  .antet-lista-sali { padding: 1rem 1rem 0.5rem; }
}

/* numarul de camere al grupului sta pe randul lui, sub nume (nu dupa bulina) */
.grup-antet-tab .grup-antet-sub {
  flex-basis: 100%;
  font-size: 0.76rem;
  font-weight: 400;
  color: var(--bs-secondary-color);
  margin-top: 0.05rem;
}

/* Panourile de setari de tiparire (Setari → Facturare): sectiuni cu chenar si
   titlu-sprinceana; modelele de factura ca la Oblio — schite cu descriere,
   cel ales cu chenar auriu; logoul cu PREVIZUALIZARE VIE pe un mock de antet */
.panou-setare {
  border: 1px solid var(--bs-border-color);
  border-radius: 0.75rem;
  padding: 1.25rem;
}
.panou-setare .ps-titlu {
  display: flex; align-items: center; gap: 0.5rem;
  font-size: 0.8rem; font-weight: 600;
  letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--bs-heading-color);
  margin-bottom: 1rem;
}
.panou-setare .ps-titlu .icon-base { color: var(--lux-accent); font-size: 1.1rem; }
.modele-factura {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem;
  max-width: 640px;
  margin-inline: auto;
}
.model-factura { cursor: pointer; text-align: center; margin: 0; min-width: 0; }
.model-factura .mf-schita {
  display: flex; flex-direction: column; gap: 7px;
  width: 100%; aspect-ratio: 4 / 5; padding: 12px 10px;
  border: 2px solid var(--bs-border-color); border-radius: 0.6rem;
  background: #fdfdfb; transition: border-color 0.15s, box-shadow 0.15s;
}
.model-factura:hover .mf-schita { border-color: rgba(var(--lux-accent-rgb), 0.5); }
.model-factura:has(.btn-check:checked) .mf-schita {
  border-color: var(--lux-accent);
  box-shadow: 0 0 0 3px rgba(var(--lux-accent-rgb), 0.18);
}
.model-factura .mf-nume { display: block; margin-top: 0.5rem; font-size: 0.85rem; font-weight: 600; }
.model-factura:has(.btn-check:checked) .mf-nume { color: var(--lux-accent); }
.model-factura .mf-desc {
  display: block; margin-top: 0.15rem;
  font-size: 0.72rem; line-height: 1.35;
  color: var(--bs-secondary-color);
}
/* mock-ul de antet pe care logoul isi arata marimea REALA, viu, din slider */
.previzualizare-logo {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  background: #fdfdfb; border: 1px solid var(--bs-border-color);
  border-radius: 0.6rem; padding: 1rem 1.1rem; min-height: 10.5rem;
}
.previzualizare-logo img { max-width: 60%; object-fit: contain; transition: height 0.1s; }
.previzualizare-logo .pl-monograma {
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  border: 3px solid #c9a96a; border-radius: 50%; color: #c9a96a;
  font-family: Georgia, serif; font-weight: 700; line-height: 1;
  transition: height 0.1s, width 0.1s;
}
.previzualizare-logo .pl-linii { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; flex: 1; }
.previzualizare-logo .pl-linii span { height: 8px; border-radius: 2px; background: #e3ddd0; }
.previzualizare-logo .pl-linii span:first-child { width: 70%; background: #d0c7b2; }
.previzualizare-logo .pl-linii span:last-child { width: 50%; }
/* alegerea e-Factura: doua randuri-carte, cel ales cu chenar auriu */
.optiune-radio {
  display: flex; align-items: flex-start; gap: 0.75rem;
  border: 1px solid var(--bs-border-color); border-radius: 0.6rem;
  padding: 0.85rem 1rem; margin: 0 0 0.75rem; cursor: pointer;
  transition: border-color 0.15s, background 0.15s;
}
.optiune-radio:last-child { margin-bottom: 0; }
.optiune-radio:hover { border-color: rgba(var(--lux-accent-rgb), 0.5); }
.optiune-radio:has(input:checked) {
  border-color: var(--lux-accent);
  background: rgba(var(--lux-accent-rgb), 0.06);
}
.optiune-radio input { margin-top: 0.2rem; flex-shrink: 0; }
.optiune-radio .or-titlu { display: block; font-weight: 600; font-size: 0.9rem; color: var(--bs-heading-color); }
.optiune-radio .or-desc { display: block; font-size: 0.78rem; color: var(--bs-secondary-color); margin-top: 0.15rem; }
@media (max-width: 575.98px) {
  .panou-setare { padding: 1rem; }
  .modele-factura { gap: 0.6rem; max-width: none; }
  .model-factura .mf-desc { display: none; }
  .previzualizare-logo { min-height: 8rem; }
}
.mf-antet { height: 12px; border-radius: 3px; background: #d8d2c4; }
.mf-blocuri { display: flex; gap: 6px; }
.mf-blocuri span { flex: 1; height: 26px; border: 1px solid #ddd; border-radius: 4px; background: #fff; }
.mf-linii { display: flex; flex-direction: column; gap: 5px; margin-top: 2px; }
.mf-linii span { height: 7px; border-radius: 2px; background: #e8e4da; }
.mf-clasic .mf-antet { background: transparent; border-bottom: 2px solid #444; border-radius: 0; }
.mf-modern .mf-antet { background: #c9a96a; }
.mf-modern .mf-blocuri span { background: #f5efe3; border: 0; }
.mf-modern .mf-linii span:first-child { background: #3a3a3a; }
.mf-compact .mf-antet { height: 8px; }
.mf-compact .mf-blocuri span { height: 18px; }
.mf-compact .mf-linii span { height: 5px; }
.mf-compact .mf-linii { gap: 3px; }

/* Subsolul cardurilor: butoanele respira fata de linia de deasupra, exact ca
   in subsolul modalurilor (nu lipite de border-top) */
/* subsolul de card cu buton: padding aerisit, inclusiv SUS. Tema Vuexy pune
   `.card .card-body + .card-footer { padding-block-start: 0 }` (mai specific) —
   il batem cu aceeasi specificitate (app.css se incarca dupa vendor) */
.card > .card-footer,
.card .card-body + .card-footer,
.card .card-header + .card-footer {
  padding: 1.5rem;
}

/* Randul unui document in registrul de facturi: bula de tip + serie/numar cu
   badge-ul separat, nu inghesuite in acelasi text */
.rand-document { display: flex; align-items: center; gap: 0.75rem; }
.rand-document .rd-text { min-width: 0; }
.rand-document .rd-titlu { display: flex; align-items: center; gap: 0.5rem; font-weight: 600; }
.rand-document small { display: block; }

/* ============ FOLIO reorganizat: categorii ca CARTI distincte ============ */
.folio-grupuri { display: flex; flex-direction: column; gap: 0.75rem; margin-bottom: 1rem; }
.folio-grup {
  border: 1px solid var(--bs-border-color);
  border-radius: 0.65rem;
  overflow: hidden;
  background: color-mix(in srgb, var(--bs-paper-bg) 40%, transparent);
}
.folio-grup .fg-cap {
  display: flex; align-items: center; justify-content: space-between; gap: 0.75rem;
  padding: 0.6rem 0.85rem;
  background: color-mix(in srgb, var(--lux-accent-rgb, 201 169 106) 8%, transparent);
  background: rgba(var(--lux-accent-rgb), 0.07);
  border-bottom: 1px solid var(--bs-border-color);
}
.folio-grup .fg-titlu {
  display: inline-flex; align-items: center; gap: 0.45rem;
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase;
  color: var(--lux-accent);
}
.folio-grup .fg-titlu .icon-base { font-size: 1rem; }
.folio-grup .fg-subtotal { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--bs-heading-color); }
.folio-grup.este-plati .fg-cap { background: rgba(var(--bs-success-rgb), 0.08); border-bottom-color: rgba(var(--bs-success-rgb), 0.25); }
.folio-grup.este-plati .fg-titlu { color: var(--bs-success); }
.folio-grup .fg-gol { padding: 0.75rem 0.85rem; font-size: 0.85rem; color: color-mix(in srgb, var(--bs-body-color) 72%, transparent); }
.folio-grup .fg-linii { display: flex; flex-direction: column; }
.fg-linie {
  display: flex; align-items: flex-start; gap: 0.5rem;
  padding: 0.6rem 0.85rem;
}
.fg-linie + .fg-linie { border-top: 1px solid color-mix(in srgb, var(--bs-border-color) 55%, transparent); }
.fg-linie .fgl-text { flex: 1 1 auto; min-width: 0; }
.fg-linie .fgl-descriere { display: block; color: var(--bs-heading-color); font-weight: 500; }
.fg-linie .fgl-detaliu { display: block; font-size: 0.76rem; color: var(--bs-secondary-color); margin-top: 0.1rem; }
.fg-linie .fgl-suma { flex-shrink: 0; font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; }
.fg-linie.plata .fgl-suma { color: var(--bs-success); }
.fg-linie .fgl-loc { flex-shrink: 0; width: 1.6rem; }
.fg-linie .fl-anuleaza { flex-shrink: 0; }
.fg-linie.anulata .fgl-descriere, .fg-linie.anulata .fgl-suma { text-decoration: line-through; opacity: 0.55; }

/* ============ ACORDEON: documentele emise pe sejur ============ */
.folio-documente { border: 1px solid var(--bs-border-color); border-radius: 0.65rem; overflow: hidden; margin-bottom: 0.5rem; }
.folio-documente .fd-toggle {
  display: flex; align-items: center; gap: 0.5rem; width: 100%;
  padding: 0.7rem 0.85rem; border: 0; background: transparent;
  color: var(--bs-heading-color); font-weight: 600; font-size: 0.9rem; cursor: pointer;
}
.folio-documente .fd-toggle .icon-base:first-child { color: var(--lux-accent); }
.folio-documente .fd-numar {
  display: inline-flex; align-items: center; justify-content: center; min-width: 1.4rem; height: 1.4rem;
  padding: 0 0.4rem; border-radius: 1rem; font-size: 0.75rem;
  background: rgba(var(--lux-accent-rgb), 0.16); color: var(--lux-accent);
}
.folio-documente .fd-sageata { margin-left: auto; transition: transform 0.18s; }
.folio-documente.deschis .fd-sageata { transform: rotate(180deg); }
.folio-documente .fd-continut { display: none; border-top: 1px solid var(--bs-border-color); }
.folio-documente.deschis .fd-continut { display: block; }
.fd-rand {
  display: flex; align-items: center; gap: 1rem;
  padding: 0.7rem 0.85rem;
}
.fd-rand + .fd-rand { border-top: 1px solid color-mix(in srgb, var(--bs-border-color) 55%, transparent); }
.fd-rand .fd-info { flex: 1 1 auto; min-width: 0; }
.fd-rand .fd-titlu { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; font-weight: 600; font-size: 0.88rem; }
.fd-rand .fd-tip {
  display: inline-flex; align-items: center;
  padding: 0.1rem 0.45rem; border-radius: 0.35rem;
  font-size: 0.68rem; font-weight: 700; letter-spacing: 0.02em; text-transform: uppercase;
}
.fd-rand .fd-stare { font-size: 0.78rem; font-weight: 500; }
.fd-rand .fd-sub { display: block; font-size: 0.75rem; color: var(--bs-secondary-color); margin-top: 0.1rem; }
.fd-rand .fd-dreapta { display: flex; align-items: center; gap: 0.85rem; flex-shrink: 0; }
.fd-rand .fd-total { font-variant-numeric: tabular-nums; font-weight: 700; white-space: nowrap; }
.fd-rand .fd-actiuni { display: inline-flex; gap: 0.35rem; }
/* butoanele-icon din rand (Tiparire / XML): CHIP vizibil, patrat rotunjit */
.fd-actiune {
  display: inline-flex; align-items: center; justify-content: center;
  inline-size: 2.1rem; block-size: 2.1rem;
  border: 1px solid var(--bs-border-color); border-radius: 0.5rem;
  background: color-mix(in srgb, var(--bs-body-color) 5%, transparent);
  color: var(--bs-body-color); cursor: pointer;
  transition: border-color 0.14s, background 0.14s, color 0.14s;
}
.fd-actiune:hover { border-color: var(--lux-accent); color: var(--lux-accent); background: rgba(var(--lux-accent-rgb), 0.1); }
.fd-actiune .icon-base { font-size: 1.05rem; }
@media (max-width: 575.98px) {
  .fd-rand { flex-wrap: wrap; }
  .fd-rand .fd-dreapta { width: 100%; justify-content: space-between; margin-top: 0.25rem; padding-top: 0.55rem; border-top: 1px dashed color-mix(in srgb, var(--bs-border-color) 45%, transparent); }
}

/* ==== Istoric trimiteri (dialog Swal): cine, cui și când a trimis documentul ==== */
.istoric-trimiteri { display: flex; flex-direction: column; gap: 0.35rem; margin-top: 0.25rem; }
.istoric-trimiteri .it-rand {
  display: flex; align-items: center; gap: 0.65rem;
  padding: 0.55rem 0.7rem; border-radius: 0.5rem;
  border: 1px solid var(--bs-border-color);
  background: color-mix(in srgb, var(--bs-body-color) 4%, transparent);
}
.istoric-trimiteri .it-rand .icon-base { font-size: 1.15rem; flex-shrink: 0; }
.istoric-trimiteri .it-mij { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.istoric-trimiteri .it-email { font-weight: 600; font-size: 0.88rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.istoric-trimiteri .it-meta { font-size: 0.75rem; color: var(--bs-secondary-color); }
.istoric-trimiteri .it-cand { font-size: 0.78rem; color: var(--bs-secondary-color); font-variant-numeric: tabular-nums; white-space: nowrap; flex-shrink: 0; }

/* ==== ICON-BUTOANE de acțiune vizibile (nu fantome) — global ====
   Butoanele icon-only cu variantă „text" (fără fundal) erau invizibile pe tema
   închisă; primesc un fundal subtil + hover clar, ca să se vadă că sunt butoane.
   Se aplică la butoanele de acțiune din rânduri (grupuri, liste), NU la
   dropdown-toggle (meniul cu 3 puncte ramane discret). */
.btn.btn-icon.btn-text-secondary:not(.dropdown-toggle),
.btn.btn-icon.btn-text-primary:not(.dropdown-toggle),
.btn.btn-icon.btn-text-danger:not(.dropdown-toggle),
.btn.btn-icon.btn-text-success:not(.dropdown-toggle) {
  inline-size: 2.3rem !important;
  block-size: 2.3rem !important;
  padding: 0 !important;
  border: 1px solid var(--bs-border-color);
  background: color-mix(in srgb, var(--bs-body-color) 6%, transparent);
  border-radius: 0.5rem;
  transition: border-color 0.14s, background 0.14s, color 0.14s;
}
.btn.btn-icon.btn-text-secondary:not(.dropdown-toggle) .icon-base,
.btn.btn-icon.btn-text-primary:not(.dropdown-toggle) .icon-base,
.btn.btn-icon.btn-text-danger:not(.dropdown-toggle) .icon-base,
.btn.btn-icon.btn-text-success:not(.dropdown-toggle) .icon-base {
  opacity: 1;
  font-size: 1.2rem !important;
  inline-size: 1.2rem !important;
  block-size: 1.2rem !important;
}
.btn.btn-icon.btn-text-secondary:not(.dropdown-toggle):hover { border-color: var(--lux-accent); color: var(--lux-accent); background: rgba(var(--lux-accent-rgb), 0.12); }
.btn.btn-icon.btn-text-primary:not(.dropdown-toggle):hover { border-color: var(--lux-accent); color: var(--lux-accent); background: rgba(var(--lux-accent-rgb), 0.12); }
.btn.btn-icon.btn-text-danger:not(.dropdown-toggle):hover { border-color: var(--bs-danger); color: var(--bs-danger); background: rgba(var(--bs-danger-rgb), 0.12); }
.btn.btn-icon.btn-text-success:not(.dropdown-toggle):hover { border-color: var(--bs-success); color: var(--bs-success); background: rgba(var(--bs-success-rgb), 0.12); }
/* iconita mica de chevron din aceste butoane sa nu ramana minuscula */
.btn.btn-icon:not(.dropdown-toggle) .icon-base.icon-14px { font-size: 1.1rem !important; inline-size: 1.1rem !important; block-size: 1.1rem !important; }

/* checkbox „Emite bonul fiscal" din dialogul de incasare */
.sw-bon-optiune {
  display: flex; align-items: flex-start; gap: 0.6rem;
  width: calc(100% - 2rem); margin: 0.6rem 1rem 0.2rem;
  padding: 0.7rem 0.85rem; border: 1px solid var(--bs-border-color); border-radius: 0.5rem;
  text-align: left; cursor: pointer;
}
.sw-bon-optiune input { margin-top: 0.15rem; flex-shrink: 0; }
.sw-bon-optiune .swb-titlu { display: block; font-weight: 600; font-size: 0.88rem; color: var(--bs-heading-color); }
.sw-bon-optiune .swb-nota { display: block; font-size: 0.76rem; color: var(--bs-secondary-color); margin-top: 0.1rem; }

/* FIX transparenta: meniul selectorului din Swal (si dropdownurile din folio)
   au fundal SOLID si stau peste tot ce urmeaza in fereastra */
.swal2-popup { overflow: visible !important; }
/* meniul selectorului din Swal: suprafata ELEVATA, mai deschisa decat fereastra
   (ca sa nu se confunde cu modalul intunecat din spate) + chenar auriu si umbra
   puternica; totul OPAC, nimic transparent */
.swal2-popup .selector-swal .dropdown-menu,
.swal2-popup .selector-multiplu-meniu,
.swal2-popup .selector-multiplu-meniu .lista,
.swal2-popup .selector-multiplu-meniu .cautare {
  z-index: 2000;
  background-color: color-mix(in srgb, var(--bs-paper-bg) 82%, #fff) !important;
  opacity: 1 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.swal2-popup .selector-multiplu-meniu {
  overflow: visible;
  border: 1.5px solid rgba(var(--lux-accent-rgb), 0.55);
  border-radius: 0.6rem;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.6);
}
.swal2-popup .selector-multiplu-meniu .cautare { border-radius: 0.6rem 0.6rem 0 0; }
.swal2-popup .selector-multiplu-meniu .lista { border-radius: 0 0 0.6rem 0.6rem; }
/* dropdownul deschis trece PESTE butoanele ferestrei (altfel „Adaugă/Renunță"
   se pictau peste optiuni); html-container ridicat deasupra actiunilor */
.swal2-popup .swal2-html-container { position: relative; z-index: 3; }
.swal2-popup .swal2-actions { position: relative; z-index: 1; }

/* Linii de folio FACTURATE (blocate): marcaj „facturat" + lacatel, fara anulare */
/* sumele liniilor și subtotalul din antet stau în ACEEAȘI coloană, aliniate la
   dreapta; subtotalul primește la dreapta lățimea coloanei de acțiuni (1.6rem +
   gap 0.5rem) ca să cadă exact peste sumele liniilor */
.fg-linie .fgl-suma { min-width: 6rem; text-align: right; }
.folio-grup .fg-cap .fg-subtotal { min-width: 6rem; text-align: right; margin-right: 2.1rem; }
.fg-linie .fgl-lacat {
  flex-shrink: 0; width: 1.6rem;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--bs-secondary-color);
}
.fg-linie .fgl-lacat .icon-base { font-size: 0.95rem; }

/* butoanele din acordeonul de documente: vizibile (cu etichetă), nu iconițe pierdute */
.fd-rand .fd-actiuni .fd-btn { font-size: 0.76rem; padding: 0.25rem 0.55rem; }
.fd-rand .fd-actiuni .fd-btn .icon-base { font-size: 0.9rem; }
@media (max-width: 575.98px) {
  .fd-rand .fd-actiuni .fd-btn { padding: 0.25rem 0.45rem; }
}

/* CAMP CU UNITATE: input + segment (lei/%) pe ACEEASI linie, ACEEASI inaltime.
   Ramane inline si pe mobil (valoarea si unitatea ei sunt o pereche naturala,
   nu se despart). Segmentul „compact" se stramteaza la continut, nu ocupa 1/2. */
.camp-unitate { display: flex; align-items: stretch; gap: 0.5rem; }
.camp-unitate > .form-control { flex: 1 1 auto; min-width: 0; }
.camp-unitate > .segment-alegere.segment-compact {
  flex: 0 0 auto;
  width: auto;
}
.segment-alegere.segment-compact .segment-optiune {
  flex: 0 0 auto;
  padding-inline: 1rem;
  min-width: 3rem;
}

/* sufixul-text al unui camp cu unitate (ex. „zile înainte de sosire") — aceeasi
   inaltime ca inputul, aliniat pe linie, ca partea din dreapta a unui input-group */
.camp-unitate > .sufix-camp {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  padding-inline: 0.85rem;
  border: 1px solid var(--bs-border-color);
  border-radius: 0.5rem;
  background: var(--bs-paper-bg);
  color: var(--bs-secondary-color);
  font-size: 0.85rem;
  white-space: nowrap;
}
.camp-anulare .camp-unitate { max-width: 22rem; }

/* ============ TOGGLE-BUTON (chip cu bifă), global — stil Stripe ============
   Comutatoarele sunt BUTOANE apăsabile pe rând întreg: cerc de bifă la stânga
   (CENTRAT vertical) + etichetă. OPRIT = chip conturat, cerc gol; PORNIT =
   chenar+fundal auriu, cerc auriu cu bifă albă, text accent. Reset COMPLET al
   componentei Vuexy (label fără padding de 3rem, slider fără poziționare
   absolută), ca sa nu ramana bulina lipita sus sau latimi inegale. */
.switch {
  display: flex !important;
  align-items: center;
  gap: 0.65rem;
  width: 100%;
  padding: 0.6rem 0.85rem;
  border: 1.5px solid var(--bs-border-color);
  border-radius: 0.6rem;
  background: transparent;
  cursor: pointer;
  position: relative;
  min-height: 0;
  user-select: none;
  transition: border-color 0.16s, background 0.16s;
}
.switch:hover { border-color: rgba(var(--lux-accent-rgb), 0.5); }
.switch:has(.switch-input:checked) {
  border-color: var(--lux-accent);
  background: rgba(var(--lux-accent-rgb), 0.1);
}
.switch:has(.switch-input:focus-visible) { box-shadow: 0 0 0 0.2rem rgba(var(--lux-accent-rgb), 0.18); }
.switch:has(.switch-input:disabled) { opacity: 0.55; cursor: not-allowed; }
/* cercul de bifă (fostul slider) — flex item static, centrat de container */
.switch .switch-toggle-slider {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  margin: 0 !important;
  inline-size: 1.4rem !important;
  block-size: 1.4rem !important;
  line-height: 1 !important;
  border-radius: 50% !important;
  border: 2px solid var(--bs-secondary-color);
  background: transparent;
  box-shadow: none !important;
  overflow: visible !important;
  flex-shrink: 0;
  transition: border-color 0.16s, background 0.16s;
}
.switch .switch-input:checked ~ .switch-toggle-slider {
  border-color: var(--lux-accent);
  background-color: var(--lux-accent);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M5 12l5 5l10 -10'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.85rem;
}
.switch .switch-toggle-slider::after,
.switch .switch-toggle-slider .icon-base,
.switch .switch-toggle-slider .switch-on,
.switch .switch-toggle-slider .switch-off { content: none !important; display: none !important; }
/* eticheta: fara padding-ul de 3rem al Vuexy, aliniata langa cerc */
.switch .switch-input ~ .switch-label,
.switch .switch-label {
  padding: 0 !important;
  margin: 0 !important;
  inset: auto !important;
  position: static !important;
  font-size: 0.9rem;
  line-height: 1.3;
  font-weight: 500;
  color: var(--bs-body-color);
  transition: color 0.16s;
}
.switch:has(.switch-input:checked) .switch-label {
  color: var(--lux-accent-deschis, var(--lux-accent));
  font-weight: 600;
}

/* Etichetele de formular au ACEEASI inaltime peste tot (block), ca sa NU mai
   difere cand una are `d-block` (segmente/culori) si alta nu (inputuri) — altfel
   controlul de sub segment sta cu ~1-2px mai sus decat inputul de langa el. */
.form-label { display: block; }

/* ==== SOLDURI / CONTURI DE CASA (solduri.php) ==== */
/* grila de carduri-sumar (KPI pe lista, banda pe fisa) — acelasi .card-sumar ca in modalul rezervarii */
.grila-sumar {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
  gap: 0.5rem;
}
/* bifa de selectie pe liniile folio-ului de cont */
.fg-linie .bifa-linie { margin-top: 0.15rem; flex-shrink: 0; cursor: pointer; }
/* bara contextuala de selectie (stil Gmail): apare cand bifezi linii */
.bara-selectie {
  position: sticky; bottom: 0.5rem; z-index: 5;
  display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; flex-wrap: wrap;
  margin: 0 1.5rem 0.75rem;
  padding: 0.65rem 1rem;
  border: 1.5px solid var(--lux-accent);
  border-radius: 0.65rem;
  background: color-mix(in srgb, var(--bs-paper-bg) 88%, var(--lux-accent) 12%);
  box-shadow: 0 0.35rem 1rem rgba(0, 0, 0, 0.35);
}
.bara-selectie .bs-text { font-size: 0.9rem; }
.bara-selectie .bs-actiuni { display: flex; gap: 0.5rem; flex-wrap: wrap; }
@media (max-width: 575.98px) {
  .bara-selectie { margin: 0 0.75rem 0.75rem; }
  .bara-selectie .bs-actiuni { width: 100%; }
  .bara-selectie .bs-actiuni .btn { flex: 1 1 auto; }
}
/* ————— Taxe locale: simulator + lista de scutiri ————— */
.grila-sumar-taxe { display: flex; flex-direction: column; gap: 0.6rem; }
.taxa-rand {
  border: 1px solid var(--bs-border-color); border-radius: 0.6rem;
  padding: 0.6rem 0.8rem;
  background: color-mix(in srgb, var(--bs-paper-bg) 90%, transparent);
}
.taxa-rand .tr-cap { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.taxa-rand .tr-val { font-weight: 600; white-space: nowrap; tabular-nums: normal; font-variant-numeric: tabular-nums; }
.taxa-sumar {
  margin-top: 0.35rem;
  border: 1.5px solid var(--lux-accent); border-radius: 0.65rem;
  padding: 0.7rem 0.9rem;
  background: color-mix(in srgb, var(--bs-paper-bg) 88%, var(--lux-accent) 12%);
}
.taxa-sumar .ts-rand { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; font-size: 0.9rem; padding: 0.12rem 0; }
.taxa-sumar .ts-total { border-top: 1px solid color-mix(in srgb, var(--lux-accent) 40%, transparent); margin-top: 0.35rem; padding-top: 0.4rem; font-size: 1rem; }
.rand-scutire {
  display: flex; align-items: center; justify-content: space-between; gap: 0.75rem;
  border: 1px solid var(--bs-border-color); border-radius: 0.55rem;
  padding: 0.5rem 0.35rem 0.5rem 0.8rem; margin-bottom: 0.5rem;
}
.rand-scutire .rs-actiuni { display: flex; gap: 0.15rem; flex-shrink: 0; }
.icon-xs { font-size: 0.85rem; vertical-align: -0.05rem; }

/* autocomplete-ul de client din modalul contului */
.lista-autocomplet {
  margin-top: 0.35rem;
  border: 1px solid var(--bs-border-color); border-radius: 0.5rem;
  background: color-mix(in srgb, var(--bs-paper-bg) 82%, white 18%);
  max-height: 14rem; overflow-y: auto;
}
.lista-autocomplet .la-rand {
  display: flex; justify-content: space-between; align-items: center; gap: 0.75rem;
  width: 100%; padding: 0.55rem 0.8rem;
  border: 0; background: transparent; color: var(--bs-body-color);
  text-align: left; cursor: pointer;
}
.lista-autocomplet .la-rand:hover { background: rgba(var(--lux-accent-rgb), 0.12); }
.lista-autocomplet .la-rand + .la-rand { border-top: 1px solid color-mix(in srgb, var(--bs-border-color) 55%, transparent); }
.lista-autocomplet .la-rand small { color: var(--bs-secondary-color); flex-shrink: 0; }
.lista-autocomplet .la-gol {
  display: flex; align-items: flex-start; gap: 0.5rem;
  padding: 0.7rem 0.85rem; color: var(--bs-body-color); font-size: 0.88rem;
  background: rgba(var(--lux-accent-rgb), 0.06);
}
.lista-autocomplet .la-gol .icon-base { color: var(--lux-accent); font-size: 1.05rem; flex-shrink: 0; margin-top: 0.05rem; }
.lista-autocomplet .la-gol a { color: var(--lux-accent); font-weight: 600; text-decoration: underline; }
/* pickerul de oaspeți din rezervarea nouă (single ȘI fiecare cameră din grup) */
#rez-oaspete-lista.lista-autocomplet,
.membru-lista.lista-autocomplet {
  background: var(--bs-paper-bg);
  border-color: color-mix(in srgb, var(--lux-accent) 40%, var(--bs-border-color));
  box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.18);
}
.lista-autocomplet .autocomplet-titlu {
  padding: 0.45rem 0.8rem 0.3rem; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.08em;
  text-transform: uppercase; color: var(--lux-accent);
  border-bottom: 1px solid color-mix(in srgb, var(--bs-border-color) 60%, transparent);
}
.lista-autocomplet .autocomplet-rand {
  display: flex; flex-direction: column; gap: 0.12rem; width: 100%;
  padding: 0.55rem 0.8rem; border: 0; background: transparent;
  text-align: left; cursor: pointer;
}
.lista-autocomplet .autocomplet-rand:hover { background: rgba(var(--lux-accent-rgb), 0.14); }
.lista-autocomplet .autocomplet-rand + .autocomplet-rand { border-top: 1px solid color-mix(in srgb, var(--bs-border-color) 55%, transparent); }
.autocomplet-rand .ar-nume { display: inline-flex; align-items: center; gap: 0.4rem; font-weight: 600; color: var(--bs-heading-color); }
.autocomplet-rand .ar-nume .icon-base { color: var(--lux-accent); }
.autocomplet-rand .ar-detaliu { font-size: 0.8rem; color: var(--bs-body-color); opacity: 0.75; }
.lista-autocomplet .autocomplet-rand.autocomplet-nou { flex-direction: row; align-items: center; gap: 0.45rem; color: var(--lux-accent); font-weight: 600; }
/* chip „legat de fișa X" / „persoană nouă" — pe toată lățimea, cu acțiunea la dreapta */
.oaspete-chip {
  display: flex; width: 100%; align-items: center; gap: 0.5rem; margin-top: 0.45rem;
  padding: 0.5rem 0.75rem; border-radius: 0.5rem;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.4);
  background: rgba(var(--lux-accent-rgb), 0.08); font-size: 0.85rem;
}
.oaspete-chip > span { flex: 1 1 auto; min-width: 0; }
.oaspete-chip .icon-base { color: var(--lux-accent); flex-shrink: 0; }
.oaspete-chip-schimba { margin-left: auto; flex-shrink: 0; border: 0; background: transparent; color: var(--lux-accent); font-weight: 600; cursor: pointer; text-decoration: underline; }
/* câmpurile automate (CNP / telefon / email) scoase discret în evidență */
.camp-automatizat { border-color: rgba(var(--lux-accent-rgb), 0.55); background: rgba(var(--lux-accent-rgb), 0.04); }
.camp-automatizat:focus { border-color: var(--lux-accent); box-shadow: 0 0 0 0.15rem rgba(var(--lux-accent-rgb), 0.15); }
/* subsolul fisei de cont pe mobil: butoanele se stivuiesc la latime intreaga
   (REGULA DE AUR a footerelor, ca la modale) */
@media (max-width: 575.98px) {
  #cont-actiuni .btn, #cont-actiuni .dropdown { width: 100%; }
  #cont-actiuni .dropdown .btn { width: 100%; }
}

/* ==== MANUALUL DE UTILIZARE (manual.php) ==== */
.manual-cuprins { position: sticky; top: 5rem; }
.manual-cuprins .nav-link { color: var(--bs-body-color); border-radius: 0.4rem; font-size: 0.88rem; }
.manual-cuprins .nav-link:hover { background: rgba(var(--lux-accent-rgb), 0.1); }
.manual-cuprins .nav-link.active { background: rgba(var(--lux-accent-rgb), 0.16); color: var(--lux-accent); font-weight: 600; }
.manual-continut .titlu-capitol {
  color: var(--lux-accent);
  border-bottom: 1px solid var(--bs-border-color);
  padding-bottom: 0.6rem; margin-bottom: 1.1rem;
}
.manual-continut h6 { margin-top: 1.25rem; }
.manual-continut ol li, .manual-continut ul li { margin-bottom: 0.3rem; }
.manual-continut .manual-tabel td:first-child { white-space: nowrap; color: var(--lux-accent); }
.manual-continut .manual-tabel td { vertical-align: top; }
.manual-continut .nota-manual {
  border: 1px solid var(--bs-border-color);
  background: rgba(var(--lux-accent-rgb), 0.07);
  padding: 0.6rem 0.9rem; border-radius: 0.5rem;
  font-size: 0.88rem;
}
/* capitolele sa nu se ascunda sub bara fixa la saritura pe ancora */
.sectiune-manual { scroll-margin-top: 5.5rem; }
@media print {
  .manual-cuprins, .layout-navbar, .layout-menu, .btn { display: none !important; }
  .manual-pagina .col-lg-9 { width: 100% !important; }
  .sectiune-manual { break-inside: avoid; border: none; box-shadow: none; }
}

/* ==== RAPOARTE — rândul de total din tabele (tfoot) ==== */
.table tfoot .rand-total th {
  border-top: 2px solid var(--lux-accent);
  background: rgba(var(--lux-accent-rgb), 0.06);
  font-weight: 700;
  color: var(--bs-heading-color);
  padding-top: 0.7rem; padding-bottom: 0.7rem;
}

/* ==== Borderou — defalcarea pe cote TVA (panou lateral) ==== */
.defalcare-cota { padding: 0.6rem 0; border-bottom: 1px solid color-mix(in srgb, var(--bs-border-color) 55%, transparent); }
.defalcare-cota:last-child { border-bottom: 0; }
.defalcare-cota .dc-cap { display: flex; justify-content: space-between; align-items: baseline; font-weight: 600; }
.defalcare-cota .dc-baza { font-size: 0.8rem; color: color-mix(in srgb, var(--bs-body-color) 72%, transparent); margin-top: 0.1rem; }
.defalcare-cota.total { border-top: 2px solid var(--lux-accent); margin-top: 0.35rem; padding-top: 0.7rem; }
.defalcare-cota.total .dc-cap { color: var(--lux-accent); }

/* ==== Fișa client — lista conturilor firmei (panou lateral) ==== */
.cont-rand {
  display: flex; justify-content: space-between; align-items: center; gap: 0.75rem;
  padding: 0.6rem 0; border-bottom: 1px solid color-mix(in srgb, var(--bs-border-color) 55%, transparent);
  color: var(--bs-body-color); text-decoration: none;
}
.cont-rand:last-child { border-bottom: 0; }
.cont-rand:not(.total):hover .cr-nume { color: var(--lux-accent); }
.cont-rand .cr-sold { font-weight: 600; white-space: nowrap; }
.cont-rand.total { border-top: 2px solid var(--lux-accent); margin-top: 0.25rem; padding-top: 0.7rem; font-weight: 700; }

/* ==== Borderou detaliat (stil Opera): tabel lat cu blocuri de coloane ==== */
.table-borderou { font-size: 0.82rem; white-space: nowrap; }
.table-borderou th, .table-borderou td { padding: 0.5rem 0.6rem; }
.table-borderou thead th { vertical-align: middle; }
.table-borderou .bloc-cote { background: rgba(var(--lux-accent-rgb), 0.05); }
.table-borderou .bloc-plati { background: color-mix(in srgb, var(--bs-success) 8%, transparent); }
.table-borderou thead th.bloc-cote, .table-borderou thead th.bloc-plati { text-align: center; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.03em; }
.table-borderou .lnk-doc { border: 0; background: transparent; color: var(--lux-accent); font-weight: 600; padding: 0; cursor: pointer; }
.table-borderou .lnk-doc:hover { text-decoration: underline; }

/* ==== Registru de casă (registru_casa.php) ==== */
.rand-anulat td { opacity: 0.55; }
.rand-anulat td:not(:last-child) { text-decoration: line-through; }
/* operațiunea de casă e acum modal Bootstrap normal (row/col + form-control) —
   „suma în litere" e evidențiată discret */
#modal-operatiune #op-litere { font-style: italic; color: var(--lux-accent); background: rgba(var(--lux-accent-rgb), 0.05); }

/* ==== HINT — nota de ajutor reutilizabilă (stil „Total sejur"): cutie discretă
   cu accent auriu + iconiță. Se folosește ORIUNDE e nevoie de o notă/explicație
   (modaluri, dialoguri, sub câmpuri) — NU stiluri inline ad-hoc. ==== */
.hint {
  display: flex; align-items: center; gap: 0.6rem;
  padding: 0.7rem 0.9rem; border-radius: 0.6rem;
  border: 1px solid rgba(var(--lux-accent-rgb), 0.3);
  background: rgba(var(--lux-accent-rgb), 0.06);
  font-size: 0.85rem; line-height: 1.5; color: var(--bs-body-color);
  text-align: left;
}
.hint > .icon-base { color: var(--lux-accent); font-size: 1.2rem; flex-shrink: 0; }
.hint.hint-atentie { border-color: rgba(var(--bs-warning-rgb), 0.4); background: rgba(var(--bs-warning-rgb), 0.08); }
.hint.hint-atentie > .icon-base { color: var(--bs-warning); }
.hint a { color: var(--lux-accent); font-weight: 600; }
/* în dialogurile SweetAlert nota stă lipită de titlu, cu spațiu dedesubt */
.swal2-popup .hint { margin-bottom: 0.6rem; }

/* iconița mare din stările goale (empty state), în locul style-ului inline */
.icon-stare-goala { display: block; margin: 0 auto 0.5rem; font-size: 2rem; color: var(--bs-secondary-color); }
.icon-stare-goala.mare { font-size: 2.6rem; color: var(--lux-accent); margin-bottom: 0.75rem; }

/* titlul „Notificări" cu clopotel, in stilul „Mesaje de azi" */
.titlu-notificari { display: inline-flex; align-items: center; font-weight: 700; color: var(--bs-heading-color); }
.titlu-notificari .icon-base { color: var(--lux-accent); }

/* ————— Temă + Culoare, UNIFICATE intr-un singur panou (stil „ambient BMW") ————— */
.panou-aspect { min-width: 17rem; padding: 0.85rem; }
.panou-aspect .aspect-sectiune + .aspect-sectiune { margin-top: 0.9rem; }
.panou-aspect .aspect-titlu {
  font-size: 0.62rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.09em;
  color: var(--bs-secondary-color); margin-bottom: 0.5rem;
}
/* toggle Luminos / Intunecat — segmentat, cu pastila activa evidentiata */
.comutator-lumina {
  display: grid; grid-template-columns: 1fr 1fr; gap: 0.3rem;
  padding: 0.25rem; border-radius: 0.6rem;
  background: color-mix(in srgb, var(--bs-body-color) 10%, var(--bs-paper-bg));
}
.comutator-lumina .lumina-opt {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.4rem;
  padding: 0.45rem 0.5rem; border: 0; border-radius: 0.45rem;
  background: transparent;
  color: var(--bs-body-color); /* si optiunea inactiva ramane clar vizibila, si pe dark */
  font-size: 0.8rem; font-weight: 600; cursor: pointer;
  transition: background 0.15s, color 0.15s, box-shadow 0.15s;
}
.comutator-lumina .lumina-opt:hover { color: var(--bs-heading-color); }
.comutator-lumina .lumina-opt.activ {
  background: var(--bs-paper-bg); color: var(--bs-heading-color);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}
.comutator-lumina .lumina-opt.activ .icon-base { color: var(--lux-accent); }
/* culorile ambientale — orbi luminosi pe un fundal subtil, ca luminile ambientale */
.grila-culori {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.7rem 0.3rem;
  padding: 0.95rem 0.6rem; border-radius: 0.7rem;
  background: radial-gradient(circle at 50% -10%,
    color-mix(in srgb, var(--bs-body-color) 9%, var(--bs-paper-bg)), var(--bs-paper-bg) 75%);
}
.grila-culori .orb-culoare {
  display: flex; flex-direction: column; align-items: center; gap: 0.35rem;
  border: 0; background: transparent; cursor: pointer; padding: 0.15rem 0;
}
.grila-culori .orb-glow {
  inline-size: 1.85rem; block-size: 1.85rem; border-radius: 50%;
  background: radial-gradient(circle at 34% 28%, color-mix(in srgb, var(--pa) 55%, #fff), var(--pa) 72%);
  box-shadow: inset 0 -2px 3px rgba(0, 0, 0, 0.22), inset 0 2px 3px rgba(255, 255, 255, 0.28);
  transition: transform 0.15s, box-shadow 0.2s;
}
.grila-culori .orb-culoare:hover .orb-glow {
  transform: scale(1.12);
  box-shadow: 0 0 0.5rem -0.05rem color-mix(in srgb, var(--pa) 45%, transparent),
              inset 0 -2px 3px rgba(0, 0, 0, 0.22), inset 0 2px 3px rgba(255, 255, 255, 0.3);
}
.grila-culori .orb-nume { font-size: 0.6rem; color: var(--bs-secondary-color); letter-spacing: 0.02em; }
/* selectata: inel curat (fara ceata) */
.grila-culori .orb-culoare.aleasa .orb-glow {
  box-shadow: 0 0 0 2px var(--bs-paper-bg), 0 0 0 3.5px var(--pa),
              inset 0 -2px 3px rgba(0, 0, 0, 0.22), inset 0 2px 3px rgba(255, 255, 255, 0.3);
}
.grila-culori .orb-culoare.aleasa .orb-nume { color: var(--bs-heading-color); font-weight: 600; }

/* ————— TABURI (peste TOATA aplicatia): control SEGMENTAT premium, in stilul „un buton
   comun cu mai multe optiuni" (Apple), nu linii abia vizibile. Se aplica la taburile
   de pagina, la cele din capul cardului si la cele standalone; EXCLUDE doar taburile
   din ferestrele de rezervare/camera si notificarile (au context propriu). ————— */
.nav-tabs:not(.taburi-rezervare):not(.taburi-camera):not(.taburi-notificari) {
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 0.25rem;
  padding: 0.3rem;
  margin: 0 0 1.25rem;
  border: 0 !important;
  border-radius: 0.75rem;
  background: color-mix(in srgb, var(--bs-body-color) 8%, var(--bs-paper-bg));
  max-inline-size: 100%;
  overflow-x: auto;
  scrollbar-width: none;
  vertical-align: middle;
}
.nav-tabs:not(.taburi-rezervare):not(.taburi-camera):not(.taburi-notificari)::-webkit-scrollbar { display: none; }
.nav-tabs:not(.taburi-rezervare):not(.taburi-camera):not(.taburi-notificari) .nav-item { margin-block-end: 0; }
.nav-tabs:not(.taburi-rezervare):not(.taburi-camera):not(.taburi-notificari) .nav-link {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  border: 0 !important;
  border-radius: 0.55rem;
  padding: 0.5rem 1rem;
  margin: 0;
  color: var(--bs-secondary-color);
  font-weight: 600;
  font-size: 0.85rem;
  background: transparent;
  isolation: isolate;
  transition: background 0.15s, color 0.15s, box-shadow 0.15s;
}
.nav-tabs:not(.taburi-rezervare):not(.taburi-camera):not(.taburi-notificari) .nav-link:hover {
  color: var(--bs-heading-color);
  background: color-mix(in srgb, var(--bs-body-color) 5%, transparent);
}
.nav-tabs:not(.taburi-rezervare):not(.taburi-camera):not(.taburi-notificari) .nav-link.active {
  color: var(--bs-heading-color);
  background: var(--bs-paper-bg);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16), inset 0 0 0 1px color-mix(in srgb, var(--bs-border-color) 60%, transparent);
}
.nav-tabs:not(.taburi-rezervare):not(.taburi-camera):not(.taburi-notificari) .nav-link.active .icon-base { color: var(--lux-accent); }
/* taburile din CAPUL cardului: fara margine suplimentara jos (altfel se caseaza un gol
   mare intre ele si continut), iar capul de card se strange in jurul controlului. */
.card-header-tabs.nav-tabs:not(.taburi-rezervare):not(.taburi-camera):not(.taburi-notificari) {
  margin: 0;
}
.card-header:has(> .nav-tabs.card-header-tabs) {
  padding-block: 0.7rem 0; /* fara padding jos: controlul segmentat sta lipit de continut */
  border-block-end: 0;
}
/* prima sectiune de dupa taburi (filtre) nu mai lasa gol mare: fara marginea de sus
   si cu padding de sus mic — se lipeste frumos sub selectorul de taburi */
.continut-taburi > .tab-pane > .filtre-tabel:first-child,
.continut-taburi > .tab-pane > .card-body:first-child {
  margin-block-start: 0 !important;
  padding-block-start: 1rem !important;
}

/* ————— PANOU stil „marile lanturi": banda de 6 KPI compacta + totul incape pe UN
   ecran (fara scroll de pagina) pe desktop; istoricul si disponibilitatea
   scrolleaza intern daca nu au loc. ————— */
.strip-metrici-6 .metrica { padding: 0.95rem 1.1rem; }
.strip-metrici-6 .valoare { font-size: 1.45rem; }
.strip-metrici-6 .valoare .separator { font-size: 1rem; padding: 0 0.25rem; }
.strip-metrici-6 .eticheta { margin-bottom: 0.3rem; font-size: 0.72rem; }
.strip-metrici-6 .detaliu { margin-top: 0.25rem; font-size: 0.72rem; line-height: 1.35; } /* fara ellipsis: textul e scurt si incape */
.strip-metrici-6 .valoare .separator { padding: 0 0.2rem 0 0.35rem; } /* „345 lei", nu „345lei" */
/* panoul: randuri de valori si antete de card mai stranse (mai multa informatie pe ecran) */
#continut-dinamic:has(> .antet-panou-zi) .lista-valori .rand-valoare { padding: 0.3rem 0; }
#continut-dinamic:has(> .antet-panou-zi) .antet-card-lux { padding-block: 0.45rem; }
/* antetul de salut, mai compact (panoul trebuie sa incapa pe un ecran) */
.antet-panou-zi .salut-panou { margin-bottom: 0 !important; font-size: 1.15rem; }
.antet-panou-zi .sprinceana-lux { margin-bottom: 0.1rem; }
.antet-panou-zi p { font-size: 0.8rem; }
#continut-dinamic:has(> .antet-panou-zi) .tabel-disponibilitate td,
#continut-dinamic:has(> .antet-panou-zi) .tabel-disponibilitate th { padding-block: 0.35rem; }
/* pe desktop (coloanele stau alaturi) pagina se incadreaza EXACT in viewport:
   ultimul rand (disponibilitate + housekeeping) si istoricul preiau restul si
   scrolleaza intern la nevoie — pagina insasi nu are scroll */
@media (min-width: 1400px) {
  #continut-dinamic:has(> .antet-panou-zi) {
    display: flex;
    flex-direction: column;
    block-size: calc(100vh - 10.3rem);
  }
  /* nowrap: cu wrap (implicit la .row) inaltimea LINIEI flex e data de continut si
     colurile nu se mai comprima la inaltimea containerului — de-aia depasea pagina */
  #continut-dinamic:has(> .antet-panou-zi) > .row.g-4 { flex: 1 1 auto; min-block-size: 0; flex-wrap: nowrap; }
  #continut-dinamic:has(> .antet-panou-zi) > .row.g-4 > .col-12.col-xxl-9 {
    display: flex; flex-direction: column; min-block-size: 0;
  }
  #continut-dinamic:has(> .antet-panou-zi) .col-12.col-xxl-9 > .row:last-child {
    flex: 1 1 auto; min-block-size: 0; flex-wrap: nowrap;
  }
  #continut-dinamic:has(> .antet-panou-zi) .col-12.col-xxl-9 > .row:last-child .card {
    display: flex; flex-direction: column; min-block-size: 0; overflow: hidden;
  }
  #continut-dinamic:has(> .antet-panou-zi) .col-12.col-xxl-9 > .row:last-child .grila-tarife {
    flex: 1 1 auto; min-block-size: 0; overflow: auto;
  }
  #continut-dinamic:has(> .antet-panou-zi) > .row.g-4 > .col-12.col-xxl-3 {
    display: flex; flex-direction: column; min-block-size: 0;
  }
  #continut-dinamic:has(> .antet-panou-zi) .card-istoric { flex: 1 1 auto; min-block-size: 0; }
}

/* dialogul mic al aplicatiei (dialogLux) — formulare scurte, peste orice modal */
.dialog-lux-dialog { max-width: 26rem; }
.dialog-lux-dialog .modal-body > .form-control,
.dialog-lux-dialog .modal-body > .selector-cautare { margin-block-end: 0.75rem; }
.dialog-lux-dialog .modal-body .hint { margin-block-end: 0.85rem; }
#dialog-lux-eroare { color: var(--bs-danger); font-size: 0.8rem; }

/* pastila „Deschisă acum" din tabul Grup (rezervarea pe care o privesti) */
.grup-rand .gm-badge {
  gap: 0.4rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-size: 0.62rem;
  background: rgba(var(--lux-accent-rgb), 0.1);
  box-shadow: inset 0 0 0 1px rgba(var(--lux-accent-rgb), 0.35);
}
.gm-punct {
  inline-size: 0.42rem;
  block-size: 0.42rem;
  border-radius: 50%;
  background: var(--lux-accent);
  box-shadow: 0 0 0.35rem rgba(var(--lux-accent-rgb), 0.7);
  animation: gm-punct-puls 2s ease-in-out infinite;
}
@keyframes gm-punct-puls {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.45; }
}
@media (prefers-reduced-motion: reduce) { .gm-punct { animation: none; } }

/* dialogul „Factura pe grup": bifele de componente pe un rand, etichete de grupa */
.sw-eticheta-grupa {
  font-size: 0.62rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em;
  color: var(--bs-secondary-color); margin: 0.6rem 0 0.25rem; text-align: start;
}
.sw-comp-rand { display: flex; gap: 0.4rem; }
.sw-comp-rand .sw-comp-inline { flex: 1 1 0; margin: 0; }

/* butonul „imparte linia" (foarfeca), langa X-ul de anulare */
.fl-imparte { margin-inline-end: 0.15rem; }

/* bifele din dialoguri si optiuni: aurii, nu albastrul implicit al browserului */
.sw-bon-optiune input[type="checkbox"],
.dialog-lux-dialog input[type="checkbox"],
.acordeon-cam input[type="checkbox"] {
  accent-color: var(--lux-accent);
  inline-size: 1.05rem;
  block-size: 1.05rem;
}

/* acordeonul „Factura pe grup": o cutie per camera, cu reperele facturabile inauntru */
.acordeon-cam {
  border: 1px solid var(--bs-border-color);
  border-radius: 0.6rem;
  margin-block-end: 0.45rem;
  background: var(--bs-body-bg);
  overflow: hidden;
}
.acordeon-cam summary {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.55rem 0.7rem;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.acordeon-cam summary::-webkit-details-marker { display: none; }
.acordeon-cam summary .ac-sageata { transition: transform 0.2s; color: var(--bs-secondary-color); }
.acordeon-cam[open] summary .ac-sageata { transform: rotate(90deg); }
.acordeon-cam .ac-titlu { font-weight: 600; font-size: 0.82rem; color: var(--bs-heading-color); flex: 1; text-align: start; }
.acordeon-cam .ac-suma { font-weight: 700; font-size: 0.8rem; color: var(--lux-accent); font-variant-numeric: tabular-nums; }
.acordeon-cam .ac-repere { border-top: 1px solid var(--bs-border-color); padding: 0.35rem 0.7rem 0.5rem; }
.acordeon-cam .ac-reper {
  display: flex; align-items: center; gap: 0.5rem;
  padding: 0.3rem 0; cursor: pointer;
}
.acordeon-cam .ac-reper + .ac-reper { border-top: 1px dashed color-mix(in srgb, var(--bs-border-color) 55%, transparent); }
.acordeon-cam .ac-reper .ar-et { flex: 1; font-size: 0.8rem; color: var(--bs-body-color); text-align: start; }
.acordeon-cam .ac-reper .ar-suma { font-size: 0.78rem; font-weight: 600; font-variant-numeric: tabular-nums; }

/* clopotelul „Mesaje de azi": iconita Tabler bell-ringing-2 e desenata inclinat
   (clopot care suna) — intentionat. Ii dam si miscarea: o leganare scurta,
   discreta, la cateva secunde. */
.buton-mesaje-azi > i {
  display: inline-block;
  transform-origin: 50% 15%;
  animation: clopot-leagana 3.2s ease-in-out infinite;
}
@keyframes clopot-leagana {
  0%, 72%, 100% { transform: rotate(0); }
  78% { transform: rotate(12deg); }
  84% { transform: rotate(-10deg); }
  90% { transform: rotate(6deg); }
  96% { transform: rotate(-3deg); }
}
@media (prefers-reduced-motion: reduce) {
  .buton-mesaje-azi > i { animation: none; }
}

/* butonul de optiuni ⋮ de pe liniile folio: vizibil, pe aceeasi linie cu suma */
.fgl-meniu { display: inline-flex; flex-shrink: 0; }
.fgl-meniu > .btn {
  inline-size: 1.7rem;
  block-size: 1.7rem;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-block-start: -0.22rem; /* randul e align-items flex-start: centram pe primul rand de text */
  border: 1px solid color-mix(in srgb, var(--bs-border-color) 85%, transparent);
  border-radius: 0.45rem;
  color: var(--bs-body-color);
  background: var(--bs-body-bg);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}
.fgl-meniu > .btn .icon-base { font-size: 1.1rem; }
.fgl-meniu > .btn:hover, .fgl-meniu > .btn.show {
  color: var(--lux-accent);
  border-color: rgba(var(--lux-accent-rgb), 0.55);
  background: rgba(var(--lux-accent-rgb), 0.08);
}