/* ScanExpert backoffice — meniul de rând și ferestrele.
 *
 * Desprins din ui-tables.css la plafonul de 600 de linii, pe cusătura pe care
 * fișierul o avea deja ca titlu de secțiune: până aici e LISTA (bara, tabelul,
 * etichetele, subsolul), de aici încolo e ce se DESCHIDE peste ea. Nimic nu s-a
 * schimbat în mutare în afară de blocul de la sfârșit.
 *
 * SE ÎNCARCĂ DUPĂ FOILE KITULUI COMUN (`/assets/ui-kit/*`), și ordinea e
 * load-bearing: ultimul bloc de aici corectează componente DEFINITE de kit
 * (`.action-menu`, `.se-select-trigger`) la aceeași specificitate, deci ar
 * pierde dacă foaia ar sta înaintea lor. Vezi layout.html.
 *
 * Aceleași reguli de autorat ca în ui.css: numai tokeni canonici; escape-urile
 * (--ui-shadow-*, --ui-overlay) sunt declarate acolo. */

/* ---- meniul de rând (kebab) + confirmarea ----------------------------------------------
 * `.row-menu` / `.row-menu-item` sunt ale acestei console și rămân aici: prototipul
 * Centralei nu le are deloc, deci nu sunt componenta convergentă. Meniul de acțiuni pe
 * care designul l-a făcut identic în amândouă e `.action-menu*` + `.row-actions-btn`, și
 * el stă în kitul comun (`/assets/ui-kit/se-row-menu.css`). */

.row-menu {
  position: fixed;
  background: var(--se-color-bg-surface);
  border-radius: var(--se-radius-md);
  box-shadow: var(--ui-shadow-float);
  padding: 6px;
  z-index: 30;
  min-width: 180px;
}

.row-menu.hidden {
  display: none;
}

.row-menu-item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: var(--se-space-8);
  border: none;
  background: none;
  padding: 10px var(--se-space-12);
  border-radius: var(--se-radius-md);
  color: var(--se-color-text-title);
  font-size: var(--se-type-bodyreg-size);
  font-weight: 400;
  text-align: left;
}

/* Griul rămâne: `.row-menu` e alb, deci starea se vede. Se adaugă culoarea. */
.row-menu-item:hover:not(:disabled) {
  background: var(--se-color-bg-console);
  border: none;
  color: var(--se-color-text-title);
}

.row-menu-item .ph {
  font-size: 18px;
  color: var(--se-color-primary-60);
}

.row-menu-item.danger {
  color: var(--se-color-badge-red-600);
}

.row-menu-item.danger .ph {
  color: var(--se-color-badge-red-600);
}

/* Hover-ul de mai sus mută numai fundalul, deci roșul rândului venea din regula
 * de deasupra lui. Se rescrie aici, pe tenta lui de badge — aceeași pereche pe
 * care o poartă `.tag-alert`, deci roșul nu-și schimbă nuanța sub cursor: 5.13:1. */
.row-menu-item.danger:hover:not(:disabled) {
  background: var(--se-color-badge-red-100);
  color: var(--se-color-badge-red-600);
}

.row-menu-item.danger:hover:not(:disabled) .ph {
  color: var(--se-color-badge-red-600);
}

.confirm-modal-overlay {
  position: fixed;
  inset: 0;
  background: var(--ui-overlay);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 500;
}

.confirm-modal-overlay.hidden {
  display: none;
}

.confirm-modal-card {
  /* Positioned, so a close button in the corner is in the CARD'''s corner.
   * `.confirm-close` is absolute, and until this line only `.confirm-ask` was a
   * containing block for it — every other window that grew one (Adaugă în listă,
   * Adaugă utilizator) had its „×" fly to the top-right of the viewport. */
  position: relative;
  width: 380px;
  background: var(--se-color-bg-surface);
  border-radius: var(--se-radius-lg);
  padding: var(--se-space-24);
  box-shadow: var(--ui-shadow-float);
}

.confirm-modal-card.wide {
  width: 440px;
}

.confirm-modal-card h3 {
  font-size: var(--se-type-bodylgmed-size);
  font-weight: 500;
  color: var(--se-color-text-title);
  margin: 0 0 var(--se-space-8);
}

.confirm-modal-card p {
  font-size: var(--se-type-bodyreg-size);
  line-height: var(--se-type-bodyreg-line);
  color: var(--se-color-text-description);
  margin: 0 0 var(--se-space-20);
}

.confirm-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--se-space-12);
}

/* ---- fereastra de ÎNTREBARE (`.confirm-ask`) --------------------------------------------
 * Modificator, nu o a doua bază: `.confirm-modal-card` desenează și formularul de program
 * din Setări (settings/panel.html, `schedule-form`), care nu e o acțiune ireversibilă și
 * n-are ce căuta nici cu ilustrație, nici cu butoane egale. Designul își numește singur
 * modificatorul așa (index.html L305-325), și tot el spune de ce: „Ferestrele care conțin
 * un formular rămân cum erau — acolo textul aliniat la stânga se citește mai bine."
 *
 * Ce adaugă: închiderea în colț, ilustrația în cerc, textul centrat și, jos, despărțite
 * printr-o linie, două butoane de lățime EGALĂ. Le deschide `se-confirm.js`, din
 * `htmx:confirm` — până la el fiecare acțiune distructivă scotea popup-ul sistemului de
 * operare, cu alt font, alte butoane și un titlu care spunea numele gazdei. */

.confirm-ask {
  text-align: center;
  /* Bara de butoane își aduce propriul padding și se lipește de marginea de jos a
   * cardului, ca linia despărțitoare să meargă dintr-un capăt în celălalt. */
  padding-bottom: 0;
}

/* Un `<button>` gol e pictat navy-plin de regula generică din ui-forms.css. Perechea
 * fundal+culoare se scrie aici întreagă, ca „×" să nu depindă de cât cântărește
 * regula aceea — cât a cântărit (0,2,1), „×" dispărea pe navy sub cursor. */
.confirm-close {
  position: absolute;
  top: var(--se-space-8);
  right: var(--se-space-8);
  width: var(--se-size-hit-target);
  height: var(--se-size-hit-target);
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: none;
  border-radius: 50%;
  color: var(--se-color-text-title);
  padding: 0;
}

.confirm-close .ph {
  font-size: var(--se-size-icon-nav);
}

.confirm-close:hover:not(:disabled) {
  background: var(--se-color-bg-console);
  color: var(--se-color-text-title);
}

.confirm-close:active:not(:disabled) {
  background: var(--se-color-border-default);
  color: var(--se-color-text-title);
}

.confirm-close:focus-visible {
  outline: 2px solid var(--se-color-primary-60);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--se-color-focus-ring);
}

/* Cercul cu glifa. 96/48 sunt mărimile din design; nu sunt trepte ale scalei de
 * spațiere, fiindcă nu spațiază nimic — sunt dimensiunile unui singur semn desenat. */
.confirm-ill {
  width: 96px;
  height: 96px;
  margin: var(--se-space-8) auto var(--se-space-20);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--se-color-secondary-20);
  color: var(--se-color-secondary-60);
}

.confirm-ill .ph {
  font-size: 48px;
}

.confirm-ask h3 {
  font-size: var(--se-type-titlelgsb-size);
  line-height: var(--se-type-titlelgsb-line);
  font-weight: var(--se-type-titlelgsb-weight);
  margin: 0 0 var(--se-space-8);
}

.confirm-ask p {
  margin: 0 0 var(--se-space-24);
}

/* Bara de butoane a ferestrei: banda ei e ce o desparte de întrebare, nu o linie
 * de sus. Marginea negativă o duce la pereții cardului, ca banda să meargă
 * dintr-un capăt în celălalt și să prindă colțurile de jos ale cardului. */
.confirm-ask .confirm-modal-actions {
  margin: 0 calc(-1 * var(--se-space-24));
  padding: var(--se-space-16) var(--se-space-24);
  background: var(--se-color-bg-console);
  border-bottom-left-radius: var(--se-radius-lg);
  border-bottom-right-radius: var(--se-radius-lg);
  gap: var(--se-space-16);
}

/* Egale, și de aceeași lățime oricât de lung ar fi numele acțiunii: designul le dă
 * amândurora aceeași greutate anume, ca „Anulează" să nu fie opțiunea mică. */
.confirm-ask .confirm-modal-actions button {
  flex: 1 1 0;
  min-width: 0;
}

/* ---- kitul comun, în limba acestei console ---------------------------------
 * Kitul e ÎMPĂRȚIT CU RECEPȚIA, iar „fără chenare" e hotărârea acestei console,
 * nu a familiei: corecția se scrie aici, exact ca lățimea pastilei de perioadă
 * într-o bară de unelte (ui-tables.css, `.table-toolbar .cal-field`) — o consolă
 * își desenează suprafețele, kitul îi dă componenta.
 *
 * Amândouă păstrează conturul SCRIS, transparent: `.se-select-trigger` își spune
 * starea de hover și de focus pe `border-color` (se-select.css), iar un
 * `border: none` ar desființa-o. */
.action-menu {
  border-color: transparent;
}

.se-select-trigger {
  background: var(--se-color-fill-neutral);
  border-color: transparent;
}

/* Starea dezactivată a kitului își desenează conturul pe nume; peste ea trebuie
 * scrisă anume, altfel e singurul control din consolă care rămâne cu ramă. Lista
 * deschisă (`.se-select-menu`) n-are nevoie de nimic — kitul o desenează deja
 * fără chenar, doar cu umbra ei. */
.se-select.is-disabled .se-select-trigger {
  border-color: transparent;
}