/* ONGIT Experience v8.3 — accessibility, sticky navigation, Light Grey.
   Scoped additive rules; no route or auth rewriting. ONHOST V2 tokens. */
:root[data-og-palette="lightgrey"] {
  color-scheme: light;
  --og-bg:#ededef; --og-surface:#fafafb; --og-elevated:#f5f5f7;
  --og-input:#ffffff; --og-text:#292532; --og-muted:#655e6b;
  --og-border:#d9d3dd; --og-hover:#eae5ee; --og-code:#f5f3f7;
  --og-accent:#8e2365; --og-accent-soft:rgba(142,35,101,.11);
  --og-positive:#27765c;
  --color-body:#ededef; --color-box-body:#fafafb; --color-box-header:#f5f5f7;
  --color-secondary:#f5f5f7; --color-secondary-bg:#f5f5f7;
  --color-menu:#fafafb; --color-menu-accent:#eae5ee; --color-card:#fafafb;
  --color-input-background:#ffffff; --color-input-border:#d9d3dd;
  --color-secondary-border:#d9d3dd; --color-light-border:#d9d3dd;
  --color-text:#292532; --color-text-light:#655e6b;
  --color-hover:#eae5ee; --color-active:rgba(142,35,101,.11);
}
html[data-og-palette="lightgrey"],html[data-og-palette="lightgrey"] body{background:#ededef!important;color:#292532!important}
html[data-og-palette="lightgrey"] .ui.segment,html[data-og-palette="lightgrey"] .ui.table,html[data-og-palette="lightgrey"] .ui.card,html[data-og-palette="lightgrey"] .ui.menu:not(#navbar),html[data-og-palette="lightgrey"] .ui.popup {background:#fafafb!important;color:#292532!important;border-color:#d9d3dd!important}
html[data-og-palette="lightgrey"] .ui.table td,html[data-og-palette="lightgrey"] .ui.table th{color:#292532!important}
html[data-og-palette="lightgrey"] :is(.ui.form input,.ui.form select,.ui.form textarea,.ui.dropdown,.ui.selection.dropdown){background:#fff!important;color:#292532!important;border-color:#d9d3dd!important}
html[data-og-palette="lightgrey"] .ui.dropdown .menu,html[data-og-palette="lightgrey"] .ui.dropdown .menu .item{background:#fafafb!important;color:#292532!important}
html[data-og-palette="lightgrey"] :is(.ui.secondary.pointing.menu .item,.repository .ui.secondary.menu .item){color:#544f5d!important}
html[data-og-palette="lightgrey"] a:not(.og8-button):not(.ui.button):not(.item):not(.og83-language-item){text-decoration-thickness:1px}
/* Make the actual application navigation sticky without adding a second navigation. */
#navbar{position:sticky!important;top:0!important;z-index:1050!important;isolation:isolate}
#og8-landing #og8-public-header{position:sticky!important;top:0!important;z-index:1055!important;isolation:isolate}
#og8-landing .og8-mega{max-height:min(65vh,600px);overflow-y:auto;overscroll-behavior:contain}
#og8-landing.og83-pages-navigation{position:sticky!important;top:0!important;z-index:1055!important;overflow:visible!important;background:#100c18!important}
#og8-landing.og83-pages-navigation #og8-public-header{position:relative!important;top:auto!important}
#og8-landing.og83-pages-navigation .og8-header-inner{max-width:1320px}
@media(max-width:850px){#og8-landing #og8-public-header{top:0!important}}
/* Language menu: flag, name, compact scrollable list. */
#og8-landing .og8-language-list, #og-v73-lang .og-language-list{
  max-height:min(300px,55dvh)!important;min-width:195px!important;width:220px!important;
  overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain;
  scrollbar-width:thin;scrollbar-color:#6d5479 transparent;padding:7px!important;
}
#og8-landing .og8-language-list a,#og-v73-lang .og-language-item{
  display:flex!important;align-items:center!important;gap:10px!important;
  min-height:36px!important;line-height:1.35!important;white-space:normal!important;
}
.og83-flag{font-size:18px;line-height:1;flex:0 0 25px;text-align:center}
.og83-lang-name{min-width:0;flex:1}
#og-v73-lang .og-language-trigger{min-width:36px!important;min-height:36px!important}
#og8-landing .og8-language-list [aria-current="true"],#og-v73-lang .og-language-list [aria-current="true"]{font-weight:800;outline:1px solid #d38de3;outline-offset:-1px}
/* The appearance popover and the two adjacent controls; native <select> remains semantic. */
#ongit-theme-panel{width:min(475px,calc(100vw - 24px))!important;max-height:calc(100dvh - 80px);overflow-y:auto;overscroll-behavior:contain;padding:20px!important}
#ongit-theme-panel .og83-control-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:12px}
#ongit-theme-panel .og83-control-field{min-width:0;display:flex;flex-direction:column;gap:6px}
#ongit-theme-panel .og83-control-field label{margin:0!important;line-height:1.3;font-size:12px!important}
#ongit-theme-panel .og83-control-field select,
#ongit-theme-panel select{
  display:block!important;box-sizing:border-box!important;width:100%!important;min-width:0!important;
  min-height:41px!important;border:1px solid var(--og-border,#555)!important;
  border-radius:9px!important;background:var(--og-input,#1b1c20)!important;
  color:var(--og-text,#fff)!important;-webkit-text-fill-color:var(--og-text,#fff)!important;
  padding:9px 32px 9px 11px!important;opacity:1!important;appearance:auto!important;
  font:500 13px/1.4 system-ui,sans-serif!important;
}
#ongit-theme-panel select option{background:var(--og-surface,#24242b)!important;color:var(--og-text,#fff)!important}
#ongit-theme-panel select:focus-visible{outline:2px solid var(--og-accent,#e91e7a)!important;outline-offset:2px}
#ongit-theme-panel .og-palette-options{grid-template-columns:repeat(3,minmax(0,1fr))!important}
#ongit-theme-panel button.og-choice{font-size:12px!important;min-height:39px!important}
html[data-og-palette="lightgrey"] #ongit-theme-panel,
html[data-og-palette="lightgrey"] #ongit-theme-panel .og-choice{background:#fafafb!important;color:#292532!important;border-color:#d9d3dd!important}
html[data-og-palette="lightgrey"] #ongit-theme-panel select{background:#fff!important;color:#292532!important;-webkit-text-fill-color:#292532!important}
/* Real density controls for list views, forms and cards. */
:root{--og83-row-pad:10px;--og83-field-min:39px;--og83-card-pad:16px}
:root[data-og-density="compact"]{--og83-row-pad:5px;--og83-field-min:33px;--og83-card-pad:11px}
:root[data-og-density="comfortable"]{--og83-row-pad:16px;--og83-field-min:47px;--og83-card-pad:23px}
html[data-og-palette] .ui.table:not(.calendar) :is(td,th),html[data-og-palette] .repository .files-table :is(td,th){padding-block:var(--og83-row-pad)!important}
html[data-og-palette] .ui.form :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea),html[data-og-palette] .ui.selection.dropdown{min-height:var(--og83-field-min)!important}
html[data-og-palette] :is(.ui.card,.ui.segment):not(.piled):not(.basic){padding:var(--og83-card-pad)!important}
html[data-og-palette] :is(.ui.vertical.menu .item,.repository .file-view .lines-num,.repository .file-view .lines-code){line-height:calc(var(--og-row-height,38px)*.65)!important}
/* Font scaling: explicit sizes in Forgejo need targeting, not only a body-level variable. */
html[data-og-palette]{font-size:calc(16px * var(--og-font-scale,1))!important}
html[data-og-palette] :is(.ui.menu .item,.ui.table,.ui.segment,.ui.card,.ui.button,.ui.form input,.ui.form select,.ui.form textarea,.repository .files-table,.markup,.markdown,.comment-body){font-size:calc(14px * var(--og-font-scale,1))!important}
html[data-og-palette] :is(.ui.header,h2.ui.header){font-size:calc(21px * var(--og-font-scale,1))!important}
/* Marketing page stays intentionally branded dark even when the surrounding workspace is Light Grey. */
html[data-og-palette="lightgrey"] #og8-landing .og8-hero h1{color:#fff!important}
html[data-og-palette="lightgrey"] #og8-landing .og8-header{background:#100c18ed!important;color:#f5f0ff!important}
html[data-og-palette="lightgrey"] #og8-landing .og8-header a{color:#f5f0ff!important}
html[data-og-palette="lightgrey"] #og8-landing .og8-editor{color:#f6f3ff!important}
/* Static pages share the same navbar; the surrounding content can use Light Grey. */
html[data-og-palette="lightgrey"]:has(.og83-pages-navigation) body{background:#ededef!important;color:#292532!important}
html[data-og-palette="lightgrey"]:has(.og83-pages-navigation) :is(.hero p,.card p,.eyebrow){color:#655e6b!important}
html[data-og-palette="lightgrey"]:has(.og83-pages-navigation) :is(.card,.section-tail){background:#fafafb!important;color:#292532!important;border-color:#d9d3dd!important}
html[data-og-palette="lightgrey"]:has(.og83-pages-navigation) .card a{background:#8e2365;color:#fff!important}
@media(max-width:530px){#ongit-theme-panel{left:12px!important;right:12px!important;top:58px!important;width:auto!important}#ongit-theme-panel .og83-control-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}#ongit-theme-panel .og-palette-options{grid-template-columns:repeat(2,minmax(0,1fr))!important}#og8-landing .og8-language-list{right:0!important}}
@media(prefers-reduced-motion:reduce){#og8-landing .og8-header,#navbar{scroll-behavior:auto}}
/* Isolate static page palettes: v8.2 had hard-coded dark backgrounds and headings. */
html[data-og-palette="lightgrey"] body:has(.og83-pages-navigation){
 --bg:#ededef;--bg2:#f5f4f7;--surface:#fafafb;--line:#d9d3dd;
 --text:#292532;--muted:#625b69;--hot:#8e2365;--purple:#87316f;
 background:#ededef!important;color:#292532!important;
}
html[data-og-palette="lightgrey"] body:has(.og83-pages-navigation) .hero :is(h1,p){color:#292532!important}
html[data-og-palette="lightgrey"] body:has(.og83-pages-navigation) .hero .eyebrow{color:#76335c!important}
html[data-og-palette="lightgrey"] body:has(.og83-pages-navigation) .card :is(h2,h3){color:#292532!important}
html[data-og-palette="lightgrey"] body:has(.og83-pages-navigation) .card h3{color:#833160!important}
html[data-og-palette="lightgrey"] body:has(.og83-pages-navigation) .tag{background:#eadfeb!important;color:#6b335d!important;border-color:#cfbdd0!important}
html[data-og-palette="lightgrey"] body:has(.og83-pages-navigation) .section-tail a{color:#8e2365!important}
/* Override the v8 marketing-only `html:has(#og8-landing) body` rule by ID-level
   specificity, but only on the seven standalone information pages. */
html:is([data-og-palette="light"],[data-og-palette="lightgrey"]):has(#og8-landing.og83-pages-navigation),
html:is([data-og-palette="light"],[data-og-palette="lightgrey"]):has(#og8-landing.og83-pages-navigation) body,
html:is([data-og-palette="light"],[data-og-palette="lightgrey"]):has(#og8-landing.og83-pages-navigation) .full.height{
 background:#ededef!important;color:#292532!important;
}
html:is([data-og-palette="light"],[data-og-palette="lightgrey"]):has(#og8-landing.og83-pages-navigation) body{
 --bg:#ededef;--text:#292532;--muted:#625b69;--line:#d9d3dd;
}
html:is([data-og-palette="light"],[data-og-palette="lightgrey"]):has(#og8-landing.og83-pages-navigation) .hero :is(h1,p){color:#292532!important}
html:is([data-og-palette="light"],[data-og-palette="lightgrey"]):has(#og8-landing.og83-pages-navigation) :is(.card,.section-tail){background:#fafafb!important;border-color:#d9d3dd!important;color:#292532!important}
/* Density and font sizing on the standalone /developers, /pricing, ... pages. */
html:has(.og83-pages-navigation) body{font-size:calc(15px * var(--og-font-scale,1))!important}
html:has(.og83-pages-navigation) .card{padding:calc(var(--og83-card-pad) + 8px)!important}
html:has(.og83-pages-navigation) .card h2{font-size:calc(21px * var(--og-font-scale,1))!important}
html:has(.og83-pages-navigation) .card :is(h3,p,a){font-size:calc(13px * var(--og-font-scale,1))!important}
html:has(.og83-pages-navigation) .hero p{font-size:calc(18px * var(--og-font-scale,1))!important}
