/* Foaia de stil a așezării la mese (app/consola/asezare.html), scoasă din
   pagină într-un fișier: politica de conținut (app/_headers, tools/csp.js)
   ajunge la „style-src 'self'” numai fără blocuri <style> și fără style="…"
   în pagini. Ce stătea în style="…" are regula lui la capăt. */
/* Numai ce ține de pagina asta. Restul e în stil.css, una pentru toată consola. */

/* ---------- aranjarea, proprie paginii ----------
   Asta e o pagină de lucru, nu una care se derulează: ține tot ecranul, cu
   planșa întinsă între bara de sus și marginea de jos. De aceea html, body și
   main nu iau regulile obișnuite din stil.css — le-ar face o coloană îngustă
   în mijloc, cu planșa strivită. */
html,body{height:100%}
body{display:flex;flex-direction:column;overflow:hidden}
main{max-width:none;margin:0;padding:0;flex:1;display:flex;min-height:0}

button,input,select{font:inherit;color:inherit}
header a{color:var(--ink-3);text-decoration:none;font-size:13px;font-weight:600;white-space:nowrap}
header a:hover{color:var(--ink)}
select,input[type=search]{padding:7px 10px;border:1px solid var(--line-2);border-radius:8px;background:var(--ground)}
#stare{font-size:12.5px;color:var(--ink-3);min-width:120px;text-align:right}
#stare.ok{color:var(--ok)}
#stare.err{color:var(--flag)}
aside{width:330px;flex:0 0 330px;background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0}
.cap{padding:14px 16px 10px;border-bottom:1px solid var(--line)}
.cap h2{font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin:0 0 9px}
.cap input,.cap select{width:100%;margin-bottom:8px}
.rezumat{font-family:"Karla",system-ui,sans-serif;font-size:14px;color:var(--ink-2);line-height:1.5}
.rezumat b{color:var(--ink);font-family:"Karla",system-ui,sans-serif;font-weight:700}
.lista{flex:1;overflow-y:auto;padding:8px}
.inv{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:9px 11px;border-radius:9px;border:1px solid transparent}
.inv:hover{background:var(--surface-2)}
/* Pe accent, cerneala lui (--accent-ink), nu fondul: fondul deschis pe auriul
   luminos ieșea la 3,5:1, iar grupul, stins cu opacitate, și mai jos.
   Alegerea se spune cu aria-pressed: rândul e un buton care rămâne apăsat,
   nu o opțiune dintr-o listă (aria-selected pe un buton nu-l citea nimeni). */
.inv[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.inv[aria-pressed="true"] .grup{color:var(--accent-ink)}
.inv .nm{flex:1;min-width:0}
.inv .nm b{display:block;font-weight:600;font-size:13.5px;line-height:1.3;word-break:break-word}
.inv .grup{font-size:11.5px;color:var(--ink-3);font-weight:500}
.inv .pers{flex:0 0 auto;min-width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--surface-2);font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums}
.inv[aria-pressed="true"] .pers{background:var(--pe-ales-stins)}
.inapoi{display:block;width:calc(100% - 16px);margin:8px;padding:9px;border-radius:9px;background:var(--surface-2);font-weight:600;font-size:13px;color:var(--ink-2)}
.planse{flex:1;min-width:0;position:relative;background:var(--ground);overflow:hidden}
svg{display:block;width:100%;height:100%}
.fixture{fill:var(--surface-2);stroke:var(--line-2);stroke-width:1}
.flabel{fill:var(--ink-3);font-size:10px;font-weight:700;letter-spacing:.08em;text-anchor:middle}
.masa{cursor:pointer}
.masa .forma{fill:var(--surface-2);stroke:var(--line-2);stroke-width:1.5}
.masa.are .forma{fill:var(--accent-soft);stroke:var(--accent);stroke-width:2}
.masa.plina .forma{fill:var(--accent);stroke:var(--accent)}
.masa.peste .forma{fill:var(--flag-soft);stroke:var(--flag);stroke-width:2.5}
.masa.tinta .forma{stroke:var(--accent);stroke-width:4}
.masa:hover .forma{stroke-width:3}
.masa .nr{fill:var(--ink);font-size:15px;font-weight:700;text-anchor:middle;dominant-baseline:central;pointer-events:none}
.masa.plina .nr,.masa.plina .cap2{fill:var(--accent-ink)}
.masa .cap2{fill:var(--ink-3);font-size:9px;font-weight:600;text-anchor:middle;pointer-events:none}
/* Caseta de peste plan, cu o salvare care n-a mers: în stil.css, una
   pentru sală și așezare. */
/* Lupa planului: „−”, „+” și „Tot”, în colț, peste plan. Planul se mărește și
   din două degete sau cu rotița și Ctrl; mărit, se plimbă trăgând. Pe un
   ecran de atins, butoanele cresc cât degetul. */
.lupa{position:absolute;right:14px;bottom:12px;z-index:4;display:flex;align-items:center;gap:6px;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:5px 7px}
.lupa button{min-width:30px;height:30px;border:1px solid var(--line-2);border-radius:6px;background:var(--ground);font-weight:700;line-height:1}
.lupa button:hover{border-color:var(--ink-3)}
.lupa button.lat{padding:0 10px;font-size:12px;font-weight:600}
@media (pointer:coarse){ .lupa button{min-width:44px;height:44px;font-size:18px} }
.planse.marit svg{cursor:grab}
.ajutor{position:absolute;left:14px;bottom:12px;font-size:12px;color:var(--ink-3);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:8px 12px;font-family:"Karla",system-ui,sans-serif;max-width:34ch;line-height:1.5}

/* ---------- invitatul, îndreptat de mână ----------
   Fiecare rând din panou are alături creionul lui: rândul însuși așază sau
   scoate de la masă, ca până acum, iar creionul deschide fișa. Pe ecran de
   atins, creionul crește la 44 de pixeli, cât un deget. */
.cap-sus{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}
.cap-sus h2{margin:0}
.rand{display:flex;align-items:center;gap:2px}
.rand > .inv{flex:1;width:auto;min-width:0}
.schimba{flex:0 0 auto;width:34px;height:34px;border-radius:9px;display:grid;place-items:center;color:var(--ink-3)}
.schimba:hover{background:var(--surface-2);color:var(--ink)}
@media (pointer:coarse){.schimba{width:44px;height:44px}}
.altii{margin:14px 3px 4px;font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
#fisaInvitat{
  width:min(480px, calc(100vw - 32px));max-height:calc(100vh - 32px);overflow:auto;
  padding:20px 20px 16px;border:1.5px solid var(--line-2);border-radius:var(--raza);
  background:var(--surface);color:var(--ink);box-shadow:var(--umbra);
}
#fisaInvitat::backdrop{background:var(--val-asezare)}
#fisaInvitat h3{font-family:"Bodoni Moda",Georgia,serif;font-weight:400;font-size:21px;margin:0 0 4px}
#fisaStare{font-size:12.5px;color:var(--ink-2);margin:0 0 14px;line-height:1.5}
#fisaCampuri{border:0;padding:0;margin:0;min-width:0}
#fisaInvitat .doua{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
#fisaInvitat textarea{resize:vertical;min-height:72px}
.corecturi-miri{margin:2px 0 12px;padding:12px 14px;border-radius:var(--raza-mica);background:var(--flag-soft);border:1.5px solid var(--flag)}
.corecturi-miri > b{display:block;font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--flag);margin-bottom:6px}
.cor + .cor{margin-top:10px}
.cor p{margin:0 0 6px;overflow-wrap:anywhere;line-height:1.45}
.cor small{color:var(--ink-2)}
.raspunde{display:flex;gap:8px;flex-wrap:wrap}
.raspunde input{flex:1;min-width:0;padding:7px 10px;border:1px solid var(--line-2);border-radius:8px;background:var(--ground)}
.inchisa{margin:0;font-size:12.5px;font-weight:700;color:var(--ink)}
#fisaMesaj{margin:0 0 4px}
.fisa-butoane{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px}
.fisa-butoane .spatiu{flex:1}
/* pe telefon, „Salvează” pe tot rândul, deasupra; celelalte două sub el */
@media (max-width:480px){
  .fisa-butoane{display:grid;grid-template-columns:1fr 1fr}
  .fisa-butoane .spatiu{display:none}
  .fisa-butoane .primary{grid-column:1 / -1;order:-1;height:44px}
}
/* pe telefon: nu mai e o pagină pe toată înălțimea, ci una care derulează —
   panoul întreg deasupra, planșa sub el, și loc sub toate pentru bara de
   jos. Cu totul pe un ecran, capul cu butoanele lui înghițea planșa, iar
   bara acoperea ce rămânea. Ajutorul de la tastatură nu are rost fără tastatură. */
@media (max-width:760px){
  html,body{height:auto;overflow:visible}
  body{display:block}
  main{display:block;min-height:0}
  aside{width:auto;flex:none;max-height:none;overflow:visible;border-right:0;border-bottom:1px solid var(--line)}
  /* Planul încape în lățimea ecranului, cu toate mesele deodată, ca să se
     vadă unde mai e loc. Până acum era mai lat decât ecranul (760 px) și se
     derula în două direcții: pe telefon se vedeau mesele 1 și 2 și
     „INTRAR…”. Masa căutată se aduce aproape cu lupa, ca la ușă. Cât e
     întreg, un deget derulează pagina; mărit, degetul plimbă planul. */
  .planse{height:62vh;min-height:360px;overflow:hidden;touch-action:pan-y}
  .planse.marit{touch-action:none}
  .planse svg{width:100%;height:100%}
  .ajutor{display:none}
}

/* „Peste capacitate”, în rezumatul mesei deschise. Stătea în style="…", în
   HTML-ul făcut de asezare.js; politica de conținut de la capăt nu mai ia
   stiluri scrise în pagină. */
.peste-capacitate{color:var(--flag)}
