/* macOS-izu ELONEZET (gyemantt 2026-10-07, TG 7172: "a design alapvetoen maradjon,
   de vigyel bele egy kis macOS designt, mutass otletet"). CSAK ?macos=1 eseten
   toltodik be (ui.js), az eles lapot nem erinti. Minden szabaly a
   html.macos osztaly alatt el, igy a ki/bekapcsolas egy osztaly. */

/* 1) Fejlec: "vibrancy" -- attetszobb, erosebb blur + szinteltes, mint a macOS menusor */
html.macos .nav{background:rgba(249,250,243,.62)!important;
  backdrop-filter:saturate(180%) blur(22px);-webkit-backdrop-filter:saturate(180%) blur(22px)}
html.macos[data-theme="dark"] .nav{background:rgba(14,21,18,.6)!important}

/* 2) Kepernyokepek macOS-ablakkeretben: cimsor a harom "kozlekedesi lampa" ponttal */
html.macos .shot{position:relative;padding-top:30px;border-radius:12px;
  box-shadow:0 22px 50px rgba(0,0,0,.28),0 0 0 .5px rgba(0,0,0,.25)}
html.macos .shot::before{content:"";position:absolute;inset:0 0 auto 0;height:30px;
  background:linear-gradient(#ECECEC,#DCDCDC);border-bottom:1px solid rgba(0,0,0,.12)}
html.macos[data-theme="dark"] .shot::before{background:linear-gradient(#3A3A3C,#2C2C2E);border-bottom-color:rgba(0,0,0,.5)}
html.macos .shot::after{content:"";position:absolute;top:10px;left:12px;width:12px;height:12px;border-radius:50%;
  background:#FF5F57;box-shadow:20px 0 0 #FEBC2E,40px 0 0 #28C840}

/* 3) Elo kartyak es az elo doboz: macOS-widget -- 18 px sarok, hajszalvonal, puha arnyek */
html.macos .live,html.macos #felugyelet .card{border-radius:18px;
  backdrop-filter:saturate(160%) blur(20px);-webkit-backdrop-filter:saturate(160%) blur(20px);
  box-shadow:inset 0 0 0 .5px rgba(255,255,255,.18),0 18px 40px rgba(0,0,0,.25)}
html.macos .stat{border-radius:12px}

/* 4) Szegmentalt vezerlo (macOS segmented control): a szolgaltatas-almenu es a nyelvvalaszto
   egy szurke savban, az aktiv elem "kiemelt" lapka */
html.macos .subnav-in{gap:2px}
html.macos .subnav-in{background:transparent}
html.macos .subnav a{border:0;border-radius:7px;padding:5px 14px;background:rgba(120,120,128,.14);color:inherit;opacity:.9}
html.macos .subnav a:first-child{border-radius:8px 4px 4px 8px}
html.macos .subnav a:last-child{border-radius:4px 8px 8px 4px}
html.macos .subnav a[aria-current="page"],html.macos .subnav a:hover{background:#fff;color:#1d1d1f;opacity:1;
  box-shadow:0 1px 3px rgba(0,0,0,.18),0 0 0 .5px rgba(0,0,0,.06)}
html.macos[data-theme="dark"] .subnav a{background:rgba(118,118,128,.24);color:#ECF2E8}
html.macos[data-theme="dark"] .subnav a[aria-current="page"],html.macos[data-theme="dark"] .subnav a:hover{background:#636366;color:#fff}
html.macos .lang{background:rgba(120,120,128,.14);border:0;padding:2px;border-radius:9px}
html.macos .lang button{border-radius:7px}
html.macos .lang button[aria-pressed="true"]{background:#fff;color:#1d1d1f;box-shadow:0 1px 3px rgba(0,0,0,.18)}
html.macos[data-theme="dark"] .lang button[aria-pressed="true"]{background:#636366;color:#fff}

/* 5) Gombok: a brand-szin marad, de macOS-os finom fenyreflex es nyomott allapot */
html.macos .btn{box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 1px 2px rgba(0,0,0,.2);transition:transform .08s,filter .15s}
html.macos .btn:active{transform:scale(.97);filter:brightness(.95)}

/* 6) Dock: alul kozepen gyors-muveletek, hoverre a macOS-dock nagyito effektusaval */
.zw-dock{display:none}
html.macos .zw-dock{display:flex;position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom,0px));
  transform:translateX(-50%);z-index:60;gap:10px;padding:8px 12px;border-radius:20px;align-items:flex-end;
  background:rgba(255,255,255,.42);backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px);
  box-shadow:inset 0 0 0 .5px rgba(255,255,255,.5),0 12px 36px rgba(0,0,0,.28)}
html.macos[data-theme="dark"] .zw-dock{background:rgba(40,44,42,.5);box-shadow:inset 0 0 0 .5px rgba(255,255,255,.15),0 12px 36px rgba(0,0,0,.5)}
html.macos .zw-dock a,html.macos .zw-dock button{position:relative;width:46px;height:46px;border-radius:12px;border:0;cursor:pointer;
  display:grid;place-items:center;font-size:22px;text-decoration:none;color:#fff;
  transition:transform .18s cubic-bezier(.2,.8,.3,1.4),margin .18s;transform-origin:bottom center}
html.macos .zw-dock a:hover,html.macos .zw-dock button:hover{transform:scale(1.35);margin:0 8px}
html.macos .zw-dock a:hover+*,html.macos .zw-dock button:hover+*{transform:scale(1.12)}
html.macos .zw-dock span.tip{position:absolute;bottom:58px;left:50%;transform:translateX(-50%);white-space:nowrap;
  font:500 12px/1 Inter,system-ui,sans-serif;color:#1d1d1f;background:rgba(255,255,255,.9);padding:5px 9px;border-radius:6px;
  opacity:0;pointer-events:none;transition:opacity .12s;box-shadow:0 2px 8px rgba(0,0,0,.2)}
html.macos .zw-dock a:hover span.tip,html.macos .zw-dock button:hover span.tip{opacity:1}
/* macOS app-ikon lapkak: squircle (~22,5% sarok), atlos szinatmenet, felso fenyfolt,
   hajszalkeret es puha arnyek -- mint a Big Sur utani Dock-ikonok. */
html.macos .zw-dock a,html.macos .zw-dock button{border-radius:22.5%;
  box-shadow:inset 0 0 0 .5px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.45),0 2px 5px rgba(0,0,0,.28);overflow:visible}
html.macos .zw-dock a::before,html.macos .zw-dock button::before{content:"";position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.32),rgba(255,255,255,0) 52%);pointer-events:none}
html.macos .zw-dock svg{position:relative;filter:drop-shadow(0 1px 1px rgba(0,0,0,.25))}
/* Lapka-szinek a ZOLDEN palettabol (gyemantt 2026-10-07, TG 7192: "illeszkedjenek jobban
   a weblaphoz"): brand-zold, mely-zold, lime, napsarga, ventilator-kek, grafit, zsalya. */
html.macos .zw-dock .k1{background:linear-gradient(180deg,#F4BE55,#E39F10)}
html.macos .zw-dock .k2{background:linear-gradient(180deg,#2A8A74,#176859)}
html.macos .zw-dock .k3{background:linear-gradient(180deg,#4E9BDB,#267CC5)}
html.macos .zw-dock .k5{background:linear-gradient(180deg,#E6FFA3,#CEFF63)}
html.macos .zw-dock .k6{background:linear-gradient(180deg,#1E7A66,#0F4C41)}
html.macos .zw-dock .k7{background:linear-gradient(180deg,#3A4440,#141C18)}
html.macos .zw-dock .k8{background:linear-gradient(180deg,#3FB98A,#1C8A62)}
html.macos .zw-dock .k4{background:linear-gradient(180deg,#9DB3A6,#62806F)}
/* Dock-elvalaszto, mint a macOS Dock alkalmazas/mappa hatara */
html.macos .zw-dock .sep{align-self:stretch;width:1px;margin:4px 2px;background:rgba(0,0,0,.18)}
html.macos[data-theme="dark"] .zw-dock .sep{background:rgba(255,255,255,.22)}
/* Nyelv-valaszto: kis felugro menu a dock folott */
html.macos .zw-langpop{position:fixed;z-index:70;display:flex;flex-direction:column;min-width:150px;padding:5px;
  border-radius:10px;background:rgba(246,246,246,.9);backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px);
  box-shadow:0 0 0 .5px rgba(0,0,0,.2),0 10px 30px rgba(0,0,0,.3)}
html.macos .zw-langpop[hidden]{display:none!important}
html.macos .zw-langpop button{all:unset;cursor:pointer;padding:6px 10px;border-radius:6px;font:500 13px Inter,system-ui,sans-serif;color:#1d1d1f}
html.macos .zw-langpop button:hover{background:#0A7AFF;color:#fff}
html.macos[data-theme="dark"] .zw-langpop{background:rgba(44,44,46,.92)}
html.macos[data-theme="dark"] .zw-langpop button{color:#f2f2f7}
/* A fejlecbol a dockba koltozott elemek (TG 7187) macOS-modban rejtve */
html.macos .nav-tools .lang,html.macos #chat-open,html.macos #theme-btn,
html.macos .nav-links a[href$="#gyik"],html.macos .subnav{display:none!important}
html.macos body{padding-bottom:84px}
@media (max-width:680px){ html.macos .zw-dock{gap:5px;padding:6px 8px;max-width:calc(100vw - 16px)} html.macos .zw-dock a,html.macos .zw-dock button{width:34px;height:34px} html.macos .zw-dock svg{width:20px;height:20px} html.macos .zw-langpop{right:8px} }
html.macos .zw-dock:has(.zw-langpop:not([hidden])) .tip{opacity:0!important}
/* A jel toltse ki majdnem a teljes lapkat (gyemantt 2026-10-07, TG 7196): ~86% */
html.macos .zw-dock svg{width:86%!important;height:86%!important}
/* ZOLDEN fooldal-ikon (a Dock elejen, mint a Finder) es Aktualis (gyemantt 2026-10-07, TG 7211/7213) */
html.macos .zw-dock .k0{background:linear-gradient(180deg,#25302B,#0E1512)}
html.macos .zw-dock .k0 img{position:relative;width:68%;height:68%;object-fit:contain}
html.macos .zw-dock .k9{background:linear-gradient(180deg,#3FA6B8,#1B6475)}
/* TELEFON (<=680 px, gyemantt 2026-10-07, TG 7231): a dock jobb oldalt FUGGOLEGESEN,
   nagyobb (44 px) ujjal kezelheto ikonokkal. Hover-nagyitas nincs (erintokepernyon
   zavaro); HUZASRA az ujj alatti ikon felirata latszik, KOPPINTASRA a link nyilik (ui.js, TG 7236). */
@media (max-width:680px){
  html.macos body{padding-bottom:0}
  html.macos .zw-dock{left:auto;right:calc(6px + env(safe-area-inset-right,0px));top:0;bottom:0;margin:auto 0;height:max-content;
    transform:none;flex-direction:column;align-items:center;gap:7px;padding:7px 6px;border-radius:18px;
    max-height:calc(100dvh - 90px);overflow:visible;touch-action:none;
    /* attetszo (TG 7236): a lap a teljes szelessegben latszik mogotte */
    background:rgba(255,255,255,.16);box-shadow:inset 0 0 0 .5px rgba(255,255,255,.3),0 8px 24px rgba(0,0,0,.18)}
  html.macos[data-theme="dark"] .zw-dock{background:rgba(20,28,24,.22)}
  html.macos .zw-dock a,html.macos .zw-dock button{opacity:.86}
  html.macos .zw-dock .armed{opacity:1}
  html.macos .zw-dock::-webkit-scrollbar{display:none}
  html.macos .zw-dock a,html.macos .zw-dock button{width:44px;height:44px;flex:none;border-radius:11px}
  html.macos .zw-dock a:hover,html.macos .zw-dock button:hover,html.macos .zw-dock a:hover+*,html.macos .zw-dock button:hover+*{transform:none;margin:0}
  html.macos .zw-dock .sep{align-self:center;width:30px;height:1px;margin:1px 0}
  html.macos .zw-dock span.tip{display:none}
  html.macos .zw-dock .armed{outline:2px solid #CEFF63;outline-offset:2px}
  html.macos .zw-langpop{bottom:auto}
}
.zw-tipbubble{position:fixed;z-index:70;max-width:60vw;padding:7px 11px;border-radius:9px;
  font:600 14px/1.25 Inter,system-ui,sans-serif;color:#1d1d1f;background:rgba(255,255,255,.95);
  box-shadow:0 0 0 .5px rgba(0,0,0,.2),0 8px 24px rgba(0,0,0,.3);pointer-events:none}
.zw-tipbubble[hidden]{display:none!important}
/* LIQUID GLASS dock (gyemantt 2026-10-07, TG 7238): asztalon es telefonon egyforman.
   Szinte atlatszo, erosen fenyes uveg: atlos fenyatmenet, felso spekularis csik,
   vekony fenyes perem, enyhe szin-telites a mogotte levo tartalombol. A korabbi
   tejuveg-szinezes helyett. */
html.macos .zw-dock,html.macos[data-theme="dark"] .zw-dock{
  background:linear-gradient(135deg,rgba(255,255,255,.20) 0%,rgba(255,255,255,.06) 45%,rgba(255,255,255,.12) 100%);
  backdrop-filter:blur(12px) saturate(200%) brightness(1.06);-webkit-backdrop-filter:blur(12px) saturate(200%) brightness(1.06);
  border:1px solid rgba(255,255,255,.38);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.65),inset 0 -1px 1px rgba(255,255,255,.15),
    inset 0 0 18px rgba(255,255,255,.08),0 12px 34px rgba(0,0,0,.28)}
html.macos .zw-dock::before{content:"";position:absolute;inset:1px 10% auto 10%;height:42%;border-radius:999px 999px 40% 40%;
  background:linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,0));pointer-events:none;filter:blur(.5px)}
@media (max-width:680px){
  html.macos .zw-dock::before{inset:10% auto 10% 1px;width:42%;height:auto;border-radius:999px 40% 40% 999px;
    background:linear-gradient(90deg,rgba(255,255,255,.3),rgba(255,255,255,0))}
}
html.macos .zw-langpop{background:linear-gradient(135deg,rgba(255,255,255,.75),rgba(255,255,255,.55));
  backdrop-filter:blur(16px) saturate(200%);-webkit-backdrop-filter:blur(16px) saturate(200%);border:1px solid rgba(255,255,255,.6)}
html.macos[data-theme="dark"] .zw-langpop{background:linear-gradient(135deg,rgba(60,66,64,.75),rgba(30,34,32,.6));border-color:rgba(255,255,255,.18)}
/* MEG ATLATSZOBB (gyemantt 2026-10-07, TG 7244): a dock-uveg alig szinezett, kisebb blur;
   az ikon-lapkak 70%-ban attetszok, az ujj/eger alatt teljesen kitoltenek. */
html.macos .zw-dock,html.macos[data-theme="dark"] .zw-dock{
  background:linear-gradient(135deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,.02) 50%,rgba(255,255,255,.06) 100%);
  backdrop-filter:blur(6px) saturate(180%);-webkit-backdrop-filter:blur(6px) saturate(180%);
  border-color:rgba(255,255,255,.30)}
html.macos .zw-dock::before{opacity:.6}
html.macos .zw-dock a,html.macos .zw-dock button{opacity:.7;transition:opacity .15s,transform .18s cubic-bezier(.2,.8,.3,1.4),margin .18s}
html.macos .zw-dock a:hover,html.macos .zw-dock button:hover,html.macos .zw-dock .armed{opacity:1}