@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+Georgian:wght@500;600&display=swap");
/* ჭკუის კოლოფი — საჯარო დოკუმენტაცია. 2026-10-07: მთავარი გვერდის ცა (ვარსკვლავები, შუქი, სერიფის სათაური, nh-card). */
:root{
  /* owner 2026-10-04: ბანერის ფერები, ყველგან მუქი ნაგულისხმევად */
  --bg:#0A1428; --panel:#0F1C34; --fg:#E2DED6; --muted:#8B9DB6;
  --accent:#F16CA4; --accent-strong:#EBB65C; --border:#1F2D48;
  --code-bg:#16243F; --pre-bg:#07101F; --pre-fg:#E2DED6;
  --note-bg:#16243F; --note-bd:#2C3B58;
  --warn-bg:rgba(235,182,92,.10); --warn-bd:#EBB65C;
  --ok-bg:rgba(169,187,210,.10); --ok-bd:#A9BBD2;
  --chip-get:#A9BBD2; --chip-post:#F16CA4; --chip-patch:#EBB65C;
  --shadow:0 1px 3px rgba(0,0,0,.4);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth; scroll-padding-top:76px}
body{
  margin:0; color:var(--fg);
  background:
    radial-gradient(closest-side, rgba(196,48,110,.42), transparent) top -260px right -240px / 900px 760px no-repeat fixed,
    url(/assets/night/stars.svg) center top / cover no-repeat fixed,
    var(--bg);
  font-family:"FiraGO","Noto Sans Georgian","BPG Glaho","Sylfaen",-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
  font-size:16px; line-height:1.7;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}

/* ------- header ------- */
header.site{
  position:sticky; top:0; z-index:50;
  background:rgba(10,20,40,.82);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.hwrap{max-width:1160px; margin:0 auto; padding:10px 20px; display:flex; align-items:center; gap:18px; flex-wrap:wrap}
.brand{font-weight:800; font-size:17px; color:var(--fg); white-space:nowrap}
.brand:hover{text-decoration:none}
.brand span{color:var(--accent); font-weight:600}
header.site nav{display:flex; gap:4px; flex-wrap:wrap; overflow-x:auto}
header.site nav a{
  padding:6px 11px; border-radius:9px; color:var(--fg);
  font-size:14px; font-weight:600; white-space:nowrap;
}
header.site nav a:hover{background:var(--code-bg); text-decoration:none}
header.site nav a.active{background:var(--accent); color:#fff}
header.site nav a.ext{color:var(--muted); font-weight:500}

/* ------- layout ------- */
.page{max-width:1160px; margin:0 auto; padding:34px 20px 80px; display:flex; gap:44px; align-items:flex-start}
article{min-width:0; max-width:800px; flex:1}
aside#toc{
  position:sticky; top:84px; width:250px; flex:none;
  font-size:13.5px; line-height:1.55;
  border-left:2px solid var(--border); padding-left:16px;
  max-height:calc(100vh - 110px); overflow-y:auto;
}
aside#toc b{display:block; margin-bottom:8px; color:var(--muted); font-size:12px; text-transform:uppercase; letter-spacing:.06em}
aside#toc a{display:block; color:var(--muted); padding:3px 0}
aside#toc a.h3{padding-left:14px; font-size:12.5px}
aside#toc a:hover{color:var(--accent); text-decoration:none}
@media (max-width:1023px){ aside#toc{display:none} }

/* ------- typography ------- */
h1{font-family:"Noto Serif Georgian",Sylfaen,Georgia,serif; font-weight:500; font-size:2.1em; line-height:1.2; margin:0 0 .5em}
html[lang="en"] h1{font-family:"Noto Serif Display",Georgia,serif}
.lede{font-size:1.1em; color:var(--muted); margin:0 0 1.6em}
h2{font-size:1.42em; line-height:1.3; margin:2em 0 .6em; padding-bottom:.25em; border-bottom:1px solid var(--border)}
h3{font-size:1.13em; margin:1.7em 0 .5em}
h4{font-size:1em; margin:1.4em 0 .4em; color:var(--muted)}
p{margin:.7em 0}
ul,ol{padding-left:1.4em; margin:.7em 0}
li{margin:.3em 0}
hr{border:none; border-top:1px solid var(--border); margin:2.4em 0}
h2 a.anchor,h3 a.anchor{opacity:0; margin-left:8px; font-weight:400; font-size:.8em}
h2:hover a.anchor,h3:hover a.anchor{opacity:.7}

/* ------- code ------- */
code{
  font-family:ui-monospace,"Cascadia Mono","SF Mono",Consolas,monospace;
  font-size:.88em; background:var(--code-bg);
  padding:.15em .42em; border-radius:5px; word-break:break-word;
}
pre{
  position:relative; background:var(--pre-bg); color:var(--pre-fg);
  border-radius:10px; padding:15px 17px; overflow-x:auto;
  font-size:.86em; line-height:1.55; margin:1em 0;
}
pre code{background:transparent; padding:0; color:inherit; word-break:normal}
pre .copybtn{
  position:absolute; top:8px; right:8px;
  background:rgba(255,255,255,.12); color:#cfe1ef; border:none;
  border-radius:7px; padding:4px 10px; font-size:12px; cursor:pointer;
  font-family:inherit;
}
pre .copybtn:hover{background:rgba(255,255,255,.22)}

/* ------- tables ------- */
.tablewrap{overflow-x:auto; margin:1em 0}
table{border-collapse:collapse; width:100%; font-size:.92em; line-height:1.5}
th,td{border:1px solid var(--border); padding:8px 12px; text-align:left; vertical-align:top}
th{background:var(--code-bg); font-weight:700}

/* ------- callouts ------- */
.note,.warn,.ok{
  border-radius:10px; padding:12px 16px; margin:1.1em 0;
  border:1px solid; font-size:.95em;
}
.note{background:var(--note-bg); border-color:var(--note-bd)}
.warn{background:var(--warn-bg); border-color:var(--warn-bd)}
.ok{background:var(--ok-bg); border-color:var(--ok-bd)}
.note>p:first-child,.warn>p:first-child,.ok>p:first-child{margin-top:0}
.note>p:last-child,.warn>p:last-child,.ok>p:last-child{margin-bottom:0}

/* ------- endpoint blocks ------- */
.endpoint{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  background:var(--code-bg); border:1px solid var(--border);
  border-radius:10px; padding:9px 13px; margin:1.2em 0 .6em;
  font-family:ui-monospace,"Cascadia Mono",Consolas,monospace; font-size:.9em;
}
.chip{
  font-weight:800; font-size:.78em; letter-spacing:.04em;
  color:#fff; border-radius:6px; padding:2px 9px;
  font-family:"FiraGO","Noto Sans Georgian",system-ui,sans-serif;
}
.chip.get{background:var(--chip-get)}
.chip.post{background:var(--chip-post)}
.chip.patch{background:var(--chip-patch)}

/* ------- cards (hub) ------- */
.cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; margin:1.4em 0}
.card{
  display:block; background:rgba(15,28,52,.72); border:1px solid #2C3B58;
  border-radius:8px; padding:20px; color:var(--fg); box-shadow:none;
  transition:transform .12s ease, border-color .12s ease;
}
.card:hover{transform:translateY(-2px); border-color:var(--accent-strong); background:var(--panel); text-decoration:none}
.card .ic{font-size:26px; display:block; margin-bottom:8px}
.card b{font-size:16.5px; display:block; margin-bottom:6px}
.card p{margin:0; font-size:13.5px; color:var(--muted)}
.card .go{display:inline-block; margin-top:10px; color:var(--accent); font-weight:700; font-size:13.5px}

/* ------- quick links / faq ------- */
.qlinks{display:flex; flex-wrap:wrap; gap:8px; margin:.8em 0}
.qlinks a{
  background:var(--panel); border:1px solid var(--border); border-radius:999px;
  padding:6px 14px; font-size:13.5px; font-weight:600;
}
.qlinks a:hover{border-color:var(--accent); text-decoration:none}
details.faq{
  background:var(--panel); border:1px solid var(--border);
  border-radius:12px; padding:4px 18px; margin:10px 0;
}
details.faq summary{
  cursor:pointer; font-weight:700; padding:10px 0; list-style:none;
  display:flex; justify-content:space-between; align-items:center; gap:12px;
}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+"; color:var(--accent); font-size:20px; font-weight:600; flex:none}
details.faq[open] summary::after{content:"–"}
details.faq>div{padding:0 0 12px; color:var(--fg)}

/* ------- footer ------- */
footer.site{border-top:1px solid var(--border); background:var(--panel)}
footer.site .fwrap{
  max-width:1160px; margin:0 auto; padding:26px 20px;
  display:flex; flex-wrap:wrap; gap:10px 28px; align-items:center;
  font-size:13.5px; color:var(--muted);
}
footer.site a{color:var(--muted); text-decoration:underline}
footer.site a:hover{color:var(--accent)}

@media (max-width:640px){
  body{font-size:15px}
  .page{padding:24px 14px 60px}
  h1{font-size:1.55em}
}
