/* A vendégek táblázata és a napló szűrői.
   Betöltés: lib/v2/web/layout.js — a lapok közös fejlécéből. */

/* --- Vendégek --- */

/* Napló: szűrőcsíkok és kereső. */
.chg-tools { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:8px; }
.chg-tools input[type=search] { width:auto; min-width:260px; flex:1; padding:5px 9px; font-size:var(--betu-urlap); }
.chg-filters { display:flex; gap:5px; align-items:center; flex-wrap:wrap; margin-bottom:6px; }
.chg-label { font-size:var(--betu-jelolo); text-transform:uppercase; letter-spacing:.05em;
  color:var(--szin-szoveg-halvany); font-weight:700; min-width:54px; }
.chg-chip { font-size:var(--betu-kicsi); padding:2px 9px; border-radius:var(--ker-teljes); text-decoration:none;
  color:var(--szin-szoveg-kozep); background:var(--szin-hatter-kiemelt); border:1px solid transparent; }
.chg-chip:hover { background:var(--szin-keret-halk); color:var(--szin-szoveg); }
.chg-chip.is-on { background:var(--szin-szoveg); color:var(--szin-lap); }

.gu-tools { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:10px; }
.gu-tools .actions { display:flex; gap:5px; flex-wrap:wrap; }
.gu-tools input[type=search] { width:auto; min-width:230px; flex:1; padding:5px 9px; font-size:var(--betu-urlap); }
/* Rögzített oszlopszélesség: a tartalom hossza ne mozgassa a rácsot, és
   a két blokk egyforma széles maradjon. */
.gu-table { font-size:var(--betu-alap); table-layout:fixed; width:100%; min-width:1080px; }
.gu-table td { vertical-align:top; padding:6px 10px; }
/* A fejléc KÖZÉPEN áll az oszlopa fölött, az adat viszont balra igazított:
   a felirat így az oszlopot nevezi meg, az értékek pedig egy vonalban
   indulnak, ahogy olvasni kell őket. */
.gu-table th { font-size:var(--betu-apro); text-transform:uppercase; letter-spacing:.05em;
  white-space:nowrap; text-align:center; padding:5px 10px; }
.gu-table thead th:first-child { text-align:left; }
.gu-subhead th { font-weight:600; color:var(--szin-szoveg-halvany); }
.gu-mid { text-align:center; }
.gu-wish { color:var(--szin-kivansag); }
.gu-name { font-weight:600; font-size:var(--betu-alap); }
.gu-sub { color:var(--szin-szoveg-halk); font-size:var(--betu-kicsi); line-height:1.35; }
/* A forduló neve azonosító: nem vágjuk 10 karakterre, csak a cella
   széléig - a levágott szöveg buborékja itt nem segítene, mert a
   napi nézetre mutató hivatkozás úgyis mellette áll. */
.gu-run { max-width:180px; }
/* A DÖNTÉS SZERKESZTŐJE a vendégek lapján.
 *
 * Ugyanaz a fogaskerék és ugyanaz az űrlap, mint a napi nézetben - csak a
 * buborék nem lebeg. A táblázat vízszintesen görgethető dobozban ül, egy
 * kilógó buborékot pedig az levágna; ezért itt a szerkesztő a cellán BELÜL
 * nyílik le, és a sor magassága nő meg helyette.
 */
.gu-edit > .pax-edit-body { position:static; margin-top:6px; min-width:0;
  box-shadow:none; border-top:1px dashed var(--szin-keret); border-radius:0; padding:8px 0 0; }
.gu-plan { position:relative; }
.gu-date { color:var(--szin-szoveg-halvany); font-size:var(--betu-jelolo); }
.gu-jump { color:var(--szin-szoveg); font-weight:600; text-decoration:none;
  border-bottom:1px dotted var(--szin-szoveg-halvany); }
.gu-jump:hover { color:var(--szin-hivatkozas); border-bottom-style:solid; }
.gu-company { color:var(--szin-szoveg-halk); font-style:italic; font-size:var(--betu-kicsi); line-height:1.3; }
.gu-src { font-variant-numeric:tabular-nums; cursor:pointer;
  border-bottom:1px dotted var(--szin-szoveg-halvany); }
.clip { cursor:pointer; border-bottom:1px dotted var(--szin-szoveg-halvany); }
/* After Sessions: nem hiány és nem hiba - a konferencia végéig maradó
   utas válasza. Semleges jelölés, magyarázattal. */
.gu-as { display:inline-block; font-size:var(--betu-jelolo); font-weight:700; letter-spacing:.04em;
  background:var(--szin-as-lap); color:var(--szin-as-szoveg); border-radius:var(--ker-apro); padding:1px 5px; cursor:help; }
/* A két utazás külön blokk: az érkezés forrása és döntése tartozik össze,
   a távozásé szintén. A vonal a blokkok között húzódik, nem oszloponként. */
/* A blokk első cellája ne tapadjon az elválasztó vonalra: ugyanakkora
   hézag maradjon előtte, mint amennyi az előző cella után van. */
.gu-blk { border-left:2px solid var(--szin-keret); padding-left:12px; }
.gu-table td, .gu-table th { padding-right:12px; }
.gu-blk-head { text-align:center; background:var(--szin-hatter-kiemelt); }
/* Lezárt forduló, illetve lezárt + kiküldött értesítés - ugyanaz a két
   árnyalat, mint a napi nézet utaslistáin. */
.gu-locked { background:var(--szin-jovahagyva); }
.gu-sent { background:var(--szin-ertesitve); }
/* Hiányzó adat: a tervezés ezen fog elakadni, tehát látszania kell. */
.gu-missing { color:var(--szin-figyelem); background:var(--szin-hiany-lap); border-radius:var(--ker-apro); padding:0 3px; }
.gu-group td { background:var(--szin-valaszto); font-weight:700; font-size:var(--betu-kicsi);
  text-transform:uppercase; letter-spacing:.04em; color:var(--szin-szoveg-kozep); }

/* === EGY VENDÉG = KÉT SOR ==================================================
 *
 * Az érkezés és a távozás egymás ALATT fut, ugyanazon oszlopok mentén.
 * Korábban a kettő egymás mellett állt, két külön oszlopkészlettel; így a
 * szem folyton váltogatott, és ugyanaz a fejléc kétszer szerepelt.
 * Egymás alatt egy oszlop mindkét irányra ugyanazt jelenti, ezért a FORRÁS
 * és a DÖNTÉS egy-egy összefüggő, végigfutó sávot alkot.
 */

/* A vendég blokkjának teteje: itt kezdődik egy új ember. Az irány váltását
   halványabb vonal jelzi - így a szem előbb a vendégeket találja meg, és
   csak azon belül az érkezést/távozást. */
.gu-irany-start > td { border-top:1px solid var(--szin-keret-halk); }
.gu-start > td { border-top:2px solid var(--szin-keret); }
.gu-who { min-width:0; }

/* === AZ ADAT ÉLETÚTJA SORONKÉNT ===========================================
 *
 * Egy irányon belül minden állapot külön sor, mindig ugyanabban a
 * sorrendben. Ettől az azonos típusú adat végig egy vonalon áll: a "döntés"
 * vonalat lefelé pásztázva a pontok a bántatlan mezők, minden más a mi
 * kezünk nyoma. A sorok közti határ nincs kihúzva - egy irány egy blokk.
 */
.gu-line > td { border-bottom:0; padding-top:2px; padding-bottom:2px; }
.gu-line-forras > td { padding-top:6px; }
.gu-allapot { font-size:var(--betu-jelolo); text-transform:uppercase; letter-spacing:.05em;
  color:var(--szin-szoveg-halvany); font-weight:700; white-space:nowrap; }
.gu-line-dontes .gu-allapot { color:var(--szin-szoveg-kozep); }
/* A jóváhagyásra váró sor MAGA a jelzés: csak akkor van ott, ha van mire
   várni. Ezért kap saját alapot és hangsúlyos címkét. */
.gu-line-varakozo > td { background:var(--szin-hiany-lap); padding-bottom:6px; }
.gu-line-varakozo .gu-allapot { color:var(--szin-veszely-sotet); }
.gu-line-dontes > td:last-child { padding-bottom:6px; }
/* Változatlan mező: pont. Nem üres - az azt jelentené, nincs adat. */
.gu-same { color:var(--szin-szoveg-halvany); cursor:help; }

/* Az irány cellája: a nyíl és a szó együtt mondja meg, melyik sorban járunk.
   SZÍNT SZÁNDÉKOSAN NEM KAP. Ezen a lapon a szín egyetlen dolgot jelent: az
   importtól való eltérést. Ha az irány is színezve lenne, két színrendszert
   kellene egyszerre olvasni, és a lényeg veszne el a díszítésben. */
.gu-dir-cell { white-space:nowrap; }
.gu-dir { display:inline-block; font-size:var(--betu-jelolo); font-weight:700;
  text-transform:uppercase; letter-spacing:.04em; border-radius:var(--ker-apro);
  padding:1px 6px; background:var(--szin-hatter-kiemelt); color:var(--szin-szoveg-kozep); }
.gu-dir-arrival { background:var(--szin-hatter-kiemelt); }
.gu-dir-departure { background:var(--szin-valaszto); }

/* A DÖNTÉS SÁVJA végig egy tónussal fut, hogy a két rész ránézésre
   elkülönüljön - nem oszloponként, hanem sávként. */
.gu-dontes { background:var(--szin-hatter-halk); }
.gu-dontes-head { background:var(--szin-keret-halk); }

/* === VÁLTOZÁS AZ IMPORTHOZ KÉPEST =========================================
 *
 * Háromféle állapot, három szín. A jelölés a MEZŐN van, nem a soron: így
 * nemcsak az látszik, hogy valami elmozdult, hanem az is, hogy MI.
 *
 *   mienk   - mi írtuk át; a szinkron nem nyúl hozzá többé. Tudni kell róla,
 *             de nem teendő: kék.
 *   forras  - a táblázat azóta mást mond, és az még jóváhagyásra vár. A
 *             tervünk elavult adaton állhat: ez a hangos eset, borostyán.
 *   utkozes - kézzel átírt mezőre érkezett új forrásérték: piros.
 */
.gu-chg { border-left:3px solid transparent; padding-left:6px; margin-left:-9px; border-radius:var(--ker-apro); }
.gu-chg-mienk { border-left-color:var(--szin-hivatkozas); background:var(--szin-as-lap); }
.gu-chg-forras { border-left-color:var(--szin-figyelem); background:var(--szin-hiany-lap); }
.gu-chg-utkozes { border-left-color:var(--szin-veszely); background:var(--szin-veszely-halk); }
.gu-chg-was { margin-top:1px; }
.gu-chg-new { color:var(--szin-veszely-sotet); font-weight:600; text-decoration:none;
  border-bottom:1px dotted currentColor; }
.gu-chg-new:hover { border-bottom-style:solid; }

/* Amit nem mutat külön oszlop (fő, megjegyzés, kért idő), az az irány
   mellett kap egy apró címkét - így semmi nem tűnik el szó nélkül. */
.gu-chg-tag { display:inline-block; margin-left:4px; font-size:var(--betu-jelolo);
  border-radius:var(--ker-apro); padding:0 4px; border-left:3px solid transparent; cursor:help; }

/* A jelmagyarázat ugyanazokkal a színekkel, hogy egyszer kelljen megtanulni. */
.gu-legend { display:flex; gap:14px; flex-wrap:wrap; align-items:center; }
.gu-chg-key { font-weight:700; border-left:3px solid transparent; padding:1px 6px;
  border-radius:var(--ker-apro); }

.gu-only-diff { display:inline-flex; align-items:center; gap:5px; margin:0;
  font-size:var(--betu-alap); font-weight:600; color:var(--szin-szoveg-kozep);
  text-transform:none; letter-spacing:0; white-space:nowrap; }
.gu-only-diff input { width:auto; }