/* ============================================================================
 * G-Procure  shared/modulio-antraste.css   (v1.0, 2026-09-25)
 * ----------------------------------------------------------------------------
 * Modulio antraštė (tamsi --gradient-dark juosta su ikonos plytele, grupės eilute ir
 * modulio pavadinimu), kalbos jungiklis ir skirtukų juosta - VIENAS failas moduliams,
 * kurie naudoja .app-header / .brand-* / .lang-toggle / .tabbar / .tab:
 * PP-tiekejams, PP-esg, PP-carbon (index.html ir epd.html). Iki 2026-09-25 tos pačios
 * taisyklės buvo nukopijuotos keturiose vietose, todėl taisymas pasiekdavo tik vieną.
 *
 * KONTRASTAS. Grupės eilutė (.brand-group) ant gradiento buvo smaragdas-50: gyvai
 * išmatuota blogiausiame teksto taške 3,2-4,1:1 telefone ir 4,0:1 PP-carbon kompiuteryje.
 * Dabar - green-15 (>= 5,36:1 bet kurioje gradiento vietoje). Smaragdas-50 lieka ikonoje.
 *
 * PLANŠETĖ IR TELEFONAS (<= 900 px, iki 2026-09-25 - <= 640 px): antraštė nelimpa, skirtukų
 * juosta limpa prie pat viršaus. Iki šiol PP-esg telefone aukštesnė antraštė uždengdavo
 * prilipusią skirtukų juostą, o PP-carbon juosta likdavo 71 px žemiau viršaus: modulio lūžio
 * taisyklė stovėjo PRIEŠ bazinę ir neveikė. Modulio juostos, limpančios po antrašte (top 79 px),
 * iki 900 px turi limpti prie viršaus (top 0).
 *
 * NAUDOJIMAS: <link rel="stylesheet" href="../shared/modulio-antraste.css"> iškart po
 * epso-g.css ir PRIEŠ modulio <style>: modulio taisyklės (savi lūžio taškai, išskirtiniai
 * valdikliai) šias papildo ir, esant tam pačiam selektoriui, perrašo.
 * Savo .brand-group ir .btn-header modulyje nerašyk - shared/testai.html tai tikrina.
 *
 * NUO 2026-09-25 - VISI MODULIAI (Q1 „bendras apvalkalas“): ta pati juosta visur, kad
 * modulio pavadinimas, kalba, veiksmai ir skirtukai būtų toje pačioje vietoje. Ikona - ta
 * pati kaip modulio kortelėje portale, grupės eilutė - „G-Procure · <portalo kategorija>“.
 * Antraštėje tik pavadinimas ir veiksmai; aprašymai ir įžangos - turinyje po ja, todėl
 * aukštis visur vienodas ir skirtukų juosta limpa tiesiai po antrašte.
 *   .brand-module gali būti <h1>, kai antraštė yra puslapio pavadinimas.
 *   .header-right - veiksmai: .btn-header (a ar button; --pagr - pagrindinis veiksmas,
 *   --ikona - antraeilis: iki 1320 px tik ikona), būsenos žyma .header-zyma (tuščia nerodoma),
 *   .lang-toggle; .header-right--glaustai - telefone mygtukai be teksto (tekstas lieka
 *   ekrano skaitytuvui).
 * ==========================================================================*/

/* Antraštė */
.app-header{background:var(--gradient-dark);color:var(--color-white);position:sticky;top:0;z-index:40}
.header-inner{max-width:var(--container-max);margin:0 auto;padding:var(--space-2) var(--space-3);display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}
.brand{display:flex;align-items:center;gap:var(--space-2);min-width:0}
.brand-logo{width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.brand-logo svg{width:22px;height:22px}
.brand-text{display:flex;flex-direction:column;min-width:0}
/* Eilučių aukštis nurodytas, kad antraštė visur būtų 79 px nepriklausomai nuo modulio body line-height
   (skirtukų ir įrankių juostos limpa tiesiai po ja). */
.brand-group{font-size:12px;line-height:1.5;letter-spacing:.14em;text-transform:uppercase;color:var(--color-green-15);font-weight:700}
.brand-module{font-size:19px;line-height:1.5;font-weight:800;white-space:nowrap;margin:0;color:var(--color-white)}

/* Dešinė pusė: veiksmai, būsenos žyma, kalba */
.header-right{display:flex;align-items:center;gap:var(--space-1);flex-wrap:wrap;justify-content:flex-end}
.btn-header{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;color:var(--color-white);background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);padding:8px 14px;border-radius:999px;font-family:inherit;font-size:13px;font-weight:700;line-height:inherit;cursor:pointer;text-decoration:none;transition:var(--transition-fast)}
.btn-header:hover{background:rgba(255,255,255,.22);text-decoration:none}
.btn-header:focus-visible{outline:2px solid var(--color-white);outline-offset:2px}
.btn-header svg{width:16px;height:16px;flex-shrink:0}
.btn-header--pagr{background:var(--color-white);color:var(--color-graphite);border-color:var(--color-white)}
.btn-header--pagr:hover{background:var(--color-green-5)}
.btn-header:disabled{opacity:.55;cursor:not-allowed}
.header-zyma{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--color-white);background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);padding:5px 12px;border-radius:999px;white-space:nowrap}
.header-zyma:empty{display:none}
/* Antraeilis veiksmas, kai veiksmų daug: iki 1320 px (įprastas nešiojamas kompiuteris) - tik ikona, kad
   antraštė liktų vienos eilutės. Tekstas slepiamas tik akims: ekrano skaitytuvas jį skaito, title - paaiškina. */
@media (max-width:1320px){
  .btn-header--ikona span{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  .btn-header--ikona{padding:8px 10px}
}
/* Kai veiksmai vis tiek netelpa vienoje eilutėje (būsenos žyma, vardas, kalba), shared/modulio-antraste.js
   mygtukui su ikona palieka tik ikoną - pirma antraeiliams, tada kitiems (2026-09-29). Tekstas - ekrano skaitytuvui. */
.btn-header.gp-antr-be-teksto > span{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.btn-header.gp-antr-be-teksto{padding:8px 10px}
.app-header.gp-antr-matuoja .btn-header{transition:none!important}
/* Virš 900 px antraštė visada vienos eilutės: veiksmai nesitraukia ir nelūžta (jų tekstą prireikus slepia
   modulio-antraste.js), o jei ir be teksto netelpa - pavadinimas trumpinamas daugtaškiu (visas lieka ekrano
   skaitytuvui ir lango pavadinime). Iki 2026-09-29 lūždavo veiksmai - lipni antraštė uždengdavo skirtukus. */
@media not all and (max-width:900px){
  .header-right{flex-shrink:0}
  .brand-module{overflow:hidden;text-overflow:ellipsis}
  .brand-group{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}   /* grupės eilutė nelūžta į antrą eilutę (2026-09-29) */
}

/* Kalbos jungiklis antraštėje */
.lang-toggle{display:flex;background:rgba(255,255,255,.1);border-radius:999px;padding:3px}
/* Neaktyvi kalba - baltu tekstu: 70 % baltumo šviesiausiame gradiento taške davė tik 4,1-4,3:1 (išmatuota 2026-09-25) */
.lang-toggle button{color:var(--color-white);background:none;border:0;padding:5px 12px;border-radius:999px;font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:var(--transition-fast)}
.lang-toggle button.active{background:var(--color-white);color:var(--color-graphite)}

/* Skirtukų juosta po antrašte */
.tabbar{background:var(--color-white);border-bottom:1px solid var(--color-graphite-15);position:sticky;top:71px;z-index:30}
.tabbar-inner{max-width:var(--container-max);margin:0 auto;padding:0 var(--space-3);display:flex;gap:4px;overflow-x:auto}
.tab{display:flex;align-items:center;gap:8px;padding:14px 16px;font-family:inherit;font-size:14px;font-weight:700;color:var(--color-graphite-50-strong);background:none;border:0;border-bottom:3px solid transparent;white-space:nowrap;cursor:pointer;text-decoration:none;transition:var(--transition-fast)}
.tab svg{width:18px;height:18px}
.tab:hover{color:var(--color-graphite)}
.tab.active{color:var(--color-emerald-strong);border-bottom-color:var(--color-emerald)}

/* Planšetė ir telefonas (<= 900 px, kaip PP-carbon): antraštė slenka kartu su puslapiu, skirtukai lieka prie
   viršaus. Siaurame ekrane antraštė gali lūžti į dvi eilutes - lipni ji uždengtų skirtukus (2026-09-25 išmatuota:
   PP-plan 900 px - 115 px antraštė, skirtukai limpa ties 71 px). */
@media (max-width:900px){
  .app-header{position:static}
  .tabbar{top:0}
  /* Kai pavadinimas ir veiksmai netelpa vienoje eilutėje, veiksmai pereina į antrą (kaip PP-carbon),
     o ne suspaudžia pavadinimą - iki 2026-09-25 PP-esg grupės eilutė lūždavo į tris („G- / PROCURE“). */
  .header-inner{flex-wrap:wrap}
  .brand{flex:1 1 220px}
  .header-right{flex:1 1 auto}
  .brand-module{white-space:normal}
}
@media (max-width:640px){
  /* Daug veiksmų: modulis prideda .header-right--glaustai - telefone mygtukai tampa ikonomis.
     Tekstas slepiamas tik akims, ekrano skaitytuvas jį skaito (display:none jį atimtų). */
  .header-right--glaustai .btn-header span{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  .header-right--glaustai .btn-header{padding:8px 10px}
}

/* Spausdinant antraštė ir skirtukai nereikalingi - dokumentas turi savo pavadinimą */
@media print{
  .app-header,.tabbar{display:none !important}
}
