/* Paginile adăugate pentru paritatea cu handover-ul: Listă de așteptare,
   Medici trimițători, Notificări, Audit acces.

   FIȘIER PROPRIU, nu o secțiune în styles-pages.css, fiindcă acela trecuse de
   plafonul de 600 de rânduri odată cu ele. Legătura din index.html stă IMEDIAT
   după styles-pages.css: ordinea legăturilor E ordinea cascadei (LAYOUT.md §0),
   iar regulile de aici se sprijină pe vocabularul tabular definit acolo
   (.table-scroll, .data-table, .col-status, .col-kebab) și trebuie să poată
   adăuga peste el, nu dedesubt.

   DOCUL DE MESAJE A STAT AICI ȘI NU MAI STĂ: portarea ferestrei l-a dus peste
   același plafon, deci a plecat în `styles-inbox.css`, legat imediat după fișierul
   ăsta ca să-și păstreze exact locul în cascadă. Docul nu e o pagină de paritate —
   e un component care trăiește în afara paginilor.

   Ce e aici e strict ce nu exista: coloana de cifre, golul roșu al câmpurilor
   obligatorii, șirul de numărători, bara de filtre, rândul de notificare și
   vocabularul paginii de audit. */

/* Coloanele de cifre se citesc pe verticală, deci aliniate la dreapta și cu
   cifre de lățime fixă — la fel ca `.wl-num` din back-office. */
.data-table .col-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* CELE CINCI CÂMPURI OBLIGATORII (`ASTEPTARE_OBLIGATORII`): golul lor NU e o
   liniuță, ci o sarcină de lucru scrisă cu roșu. Roșul e al paletei de STARE,
   care e singurul loc unde consola cheltuie roșu (LAYOUT.md §3), iar cuvântul e
   purtătorul — nu culoarea singură. */
.cell-missing {
  color: var(--se-color-alert-red-600);
  font-weight: var(--se-type-captionmed-weight);
  white-space: nowrap;
}

/* O intrare care a ieșit de pe listă rămâne pe ecran — „au făcut-o în altă
   parte" e răspunsul la o întrebare pe care cineva o va pune — dar se retrage
   vizual, ca lista să se citească pe cele vii. */
.wait-closed td {
  color: var(--se-color-text-muted);
}
.wait-closed td .badge,
.wait-closed td .cell-sub {
  color: inherit;
}

.wait-counts {
  display: flex;
  flex-wrap: wrap;
  gap: var(--se-space-12);
  margin-bottom: var(--se-space-12);
}
.wait-count {
  display: inline-flex;
  align-items: center;
  gap: var(--se-space-8);
  color: var(--se-color-text-description);
  font-size: var(--se-type-captionreg-size);
  line-height: var(--se-type-captionreg-line);
  font-variant-numeric: tabular-nums;
}

.wait-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--se-space-8);
  margin-bottom: var(--se-space-12);
}
.wait-search {
  flex: 1 1 240px;
  min-width: 200px;
  padding: 0 var(--se-space-16);
  min-height: var(--se-size-control);
  border: 1px solid var(--se-color-border-default);
  border-radius: var(--se-radius-pill);
  background: var(--se-color-bg-surface);
  color: var(--se-color-text-title);
}
.wait-search:focus {
  outline: none;
  border-color: var(--se-color-secondary-60);
}

/* Un buton cu iconiță lângă text în antetul unui card. `.btn-primary` nu e
   inline-flex, deci fără asta iconița stă pe linia de bază a textului. */
.btn-inline {
  display: inline-flex;
  align-items: center;
  gap: var(--se-space-8);
}
.btn-inline .ph {
  width: var(--se-size-icon-functional);
  height: var(--se-size-icon-functional);
}

/* „Medicul nu e în registru? Adaugă-l" — o comutare, nu o acțiune: text, nu
   pastilă, ca să nu concureze cu Adaugă pe listă. */
.btn-link {
  background: none;
  border: none;
  padding: 0;
  margin-top: var(--se-space-4);
  color: var(--se-color-primary-60);
  text-align: left;
  text-decoration: underline;
  font-size: var(--se-type-captionreg-size);
  line-height: var(--se-type-captionreg-line);
}
.btn-link:hover {
  color: var(--se-color-primary-40);
}

.wait-newdoctor {
  display: flex;
  flex-direction: column;
  gap: var(--se-space-8);
  margin-top: var(--se-space-8);
  padding: var(--se-space-12);
  border: 1px solid var(--se-color-border-default);
  border-radius: var(--se-radius-md);
  background: var(--se-color-bg-console);
}
.wait-newdoctor.hidden {
  display: none;
}

.wait-label {
  display: block;
  color: var(--se-color-text-muted);
  font-size: var(--se-type-captionreg-size);
  line-height: var(--se-type-captionreg-line);
  margin-bottom: 5px;
}
.wait-choices {
  display: flex;
  flex-direction: column;
  gap: var(--se-space-8);
}
.wait-choice {
  display: flex;
  align-items: flex-start;
  gap: var(--se-space-8);
  color: var(--se-color-text-title);
  font-size: var(--se-type-bodyreg-size);
  line-height: var(--se-type-bodyreg-line);
}
.wait-choice input {
  width: auto;
  min-height: 0;
  margin-top: 6px;
  flex: 0 0 auto;
}
.wait-choice .cell-sub {
  display: block;
  color: var(--se-color-text-description);
  font-size: var(--se-type-captionreg-size);
  line-height: var(--se-type-captionreg-line);
}

/* ---- Notificări ----------------------------------------------------------- */
.notif-main {
  display: flex;
  align-items: center;
  gap: var(--se-space-12);
  min-width: 0;
}
.notif-ic {
  width: var(--se-size-icon-functional);
  height: var(--se-size-icon-functional);
  color: var(--se-color-primary-60);
  flex: 0 0 auto;
}
.notif-at {
  flex: 0 0 auto;
  font-variant-numeric: tabular-nums;
}
/* Necitit poartă o bandă, nu o culoare de fundal: fundalul ar cheltui atenție pe
   fiecare rând nou, iar banda spune același lucru la marginea rândului. */
.notif-new {
  border-left: 3px solid var(--se-color-accent-pink);
}

/* Insigna din rail. Numără necitite pe BROWSERUL ăsta (vezi notificari.js), deci
   e o etichetă discretă, nu o alarmă: consola asta n-are alarme (LAYOUT.md §7). */
.nav-badge {
  margin-left: auto;
  min-width: 20px;
  padding: 0 6px;
  border-radius: var(--se-radius-pill);
  background: var(--se-color-accent-pink);
  color: var(--se-color-text-on-dark);
  font-size: var(--se-type-micromed-size);
  line-height: var(--se-type-micromed-line);
  font-weight: var(--se-type-micromed-weight);
  text-align: center;
  font-variant-numeric: tabular-nums;
  flex: 0 0 auto;
}
.sidebar.collapsed .nav-badge {
  display: none;
}

/* ---- Audit acces ----------------------------------------------------------
   Pagina n-are sursă (vezi page-audit.html), deci n-are tabel și n-are filtre.
   Ce are e vocabularul a ceea ce va arăta, în două blocuri care stau alături pe
   un ecran de pupitru și una sub alta pe unul îngust. */
.audit-vocab {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--se-space-16);
  margin-top: var(--se-space-16);
}
.audit-vocab > div {
  padding: var(--se-space-16);
  border: 1px solid var(--se-color-border-default);
  border-radius: var(--se-radius-md);
  background: var(--se-color-bg-console);
}
.audit-vocab h3 {
  margin: 0 0 var(--se-space-8);
  color: var(--se-color-text-title);
  font-size: var(--se-type-bodymed-size);
  line-height: var(--se-type-bodymed-line);
  font-weight: var(--se-type-bodymed-weight);
}
.audit-vocab p {
  margin: 0;
  color: var(--se-color-text-description);
  font-size: var(--se-type-bodyreg-size);
  line-height: var(--se-type-bodyreg-line);
}

/* ---- „Adaugă medic": formularul în stânga, ilustrația în dreapta ------------
   Forma prototipului la `page-medic-nou`, cu numele lui de clase, ca următorul
   export să fie diff-abil. E SINGURUL formular din prototip care o are —
   `page-asteptare-nou` și `page-programare-noua` sunt pe o coloană și acolo,
   deci celorlalte formulare din consolă nu le lipsește nimic.

   40 nu e pe scara de spațiere (se oprește la 28), deci se compune din tokeni.
   Fundalul e roz foarte pal: `--bg-illustration` din dialect.json, adică
   `color.bg.redLight` — nu o culoare nouă, ci a designului rezolvată prin hex. */
.patient-form-layout {
  display: flex;
  gap: calc(var(--se-space-20) * 2);
  align-items: flex-start;
}
.patient-form-fields {
  flex: 1 1 480px;
  min-width: 280px;
}
.patient-illustration {
  flex: 1 1 280px;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(var(--se-space-20) * 2);
  background: var(--se-color-bg-red-light);
  border-radius: var(--se-radius-xl);
}
.patient-illustration img {
  width: clamp(220px, 22vw, 420px);
  max-width: 100%;
  height: auto;
  display: block;
}
/* Sub 1100px ilustrația pleacă — pragul ȘI motivul sunt ale prototipului: „pe un
   ecran îngust ar fura toată lățimea formularului". Pe biroul de 1366 rămâne,
   fiindcă acolo câmpurile păstrează cele două coloane pe care `.prog-grid` le
   cere (`repeat(auto-fit, minmax(240px, 1fr))`); sub prag formularul ia toată
   lățimea în loc să se strângă sub o imagine. */
@media (max-width: 1099px) {
  .patient-form-layout {
    flex-direction: column;
  }
  .patient-illustration {
    display: none;
  }
}
