/* =========================================================
   ABOUT / ESSENCE PAGE (matches your Blade markup)
   Scope: .inner-page .ess-*
   Put at the END of about.css (after theme css)
========================================================= */

/* ---- tokens ---- */
:root{
  --pageW: 1420px;
  --sideW: 300px;
  --gap: 22px;
  --topNavH: 90px;         /* tavo fixed navigation height */
  --topOff: 110px;         /* sticky top offset (nav + mažas tarpas) */

  --paper: #efebe2;
  --paper2:#f7f4ee;
  --ink:  #3a342b;
  --muted:#6f6763;

  --gold:#ebba6d;
  --gold2:#d49600;
  --gold3:#b88432;

  --line: rgba(124,107,78,.25);
  --card: rgba(255,255,255,.78);
  --card2:rgba(255,255,255,.62);
  --shadow: 0 14px 38px rgba(0,0,0,.12);
  --shadow2:0 10px 28px rgba(0,0,0,.10);
  --r: 16px;
}

/* ---- fix: tavo global theme yra white text, perrašom tik šitam puslapiui ---- */
.inner-page{
  background: var(--paper);
  color: var(--ink);
}

/* breadcrumbs turi likti skaitomi */
.inner-page .breadcrumbs{
  color: var(--muted);
  font-size: 14px;
  padding: 16px 0 0;
}
.inner-page .breadcrumbs a{ color: var(--gold3); }
.inner-page .breadcrumbs a:hover{ color: var(--gold2); }

/* content-area width (pas tave jau yra, bet stabilizuojam) */
.inner-page .content-area{
  max-width: var(--pageW);
}

/* ---- header (jei vėliau įdėsi title/desc) ---- */
.inner-page .ess-header{
  padding: 18px 0 10px;
}
.inner-page .ess-header h1{
  margin: 0 0 8px;
  font-family:"Angelus Medieval", serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.02em;
  font-size: 52px;
  line-height:1.05;
  color:#6f6551;
}
.inner-page .ess-header p{
  margin:0;
  font-size:18px;
  line-height:1.5;
  color: var(--muted);
  max-width: 980px;
}

/* ---- sticky offset realiai nuo nav ---- */
@media (min-width: 1051px){
  :root{ --topOff: calc(var(--topNavH) + 20px); }
}

/* ---- sections: kad anchor jump nepasislėptų po fixed nav ---- */
.inner-page .ess-section{
  padding: 10px 0 8px;
  scroll-margin-top: calc(var(--topOff) + 10px);
}

/* ---- layout ---- */
.inner-page .ess-layout{
  display:grid;
  grid-template-columns: var(--sideW) minmax(0,1fr);
  gap: var(--gap);
  align-items:start;
  padding: 10px 0 30px;
}

/* ---- sidebar ---- */
.inner-page .ess-sidebar{
  position: sticky;
  top: var(--topOff);
  height: calc(100vh - (var(--topOff) + 18px));
  overflow: auto;
  padding-right: 4px;
}

/* scrollbar */
.inner-page .ess-sidebar::-webkit-scrollbar{ width: 8px; }
.inner-page .ess-sidebar::-webkit-scrollbar-track{
  background: rgba(124,107,78,.10);
  border-radius: 999px;
}
.inner-page .ess-sidebar::-webkit-scrollbar-thumb{
  background: rgba(124,107,78,.35);
  border-radius: 999px;
}

/* sidebar box */
.inner-page .ess-sidebox{
  border-radius: var(--r);
  background: linear-gradient(180deg, var(--card), var(--card2));
  border: 1px solid var(--line);
  box-shadow: var(--shadow2);
  padding: 14px;
}

.inner-page .ess-sidebox__title{
  font-family:"Angelus Medieval", serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.02em;
  color:#6f6551;
  font-size: 18px;
  margin: 2px 0 10px;
}

.inner-page .ess-group{ margin-top: 12px; }
.inner-page .ess-group__title{
  font-size: 12px;
  color: rgba(111,103,99,.95);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin: 12px 0 6px;
}

/* links */
.inner-page .ess-link{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(124,107,78,.22);
  background: rgba(255,255,255,.55);
  color: #5c5246;
  font-size: 13px;
  font-weight: 800;
  text-decoration:none;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
}

.inner-page .ess-link:hover{
  transform: translateY(-1px);
  border-color: rgba(212,150,0,.35);
  background: rgba(255,255,255,.70);
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
}

/* active state (uždėsi su JS: .is-active) */
.inner-page .ess-link.is-active{
  border-color: rgba(212,150,0,.45);
  background: linear-gradient(180deg, rgba(251,211,122,.55), rgba(255,255,255,.70));
  box-shadow: inset 0 0 0 1px rgba(235,186,109,.35);
}

/* ---- main content ---- */
.inner-page .ess-main{ min-width:0; }

/* headings inside content */
.inner-page .ess-main h2,
.inner-page .ess-main h3{
  font-family:"Angelus Medieval", serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.02em;
  color:#6f6551;
}

.inner-page .ess-main h2{
  font-size: 34px;
  line-height: 1.15;
  margin: 8px 0 12px;
}
.inner-page .ess-main h3{
  font-size: 26px;
  line-height: 1.2;
  margin: 16px 0 10px;
}

/* blocks */
.inner-page .ess-box,
.inner-page .ess-card{
  border-radius: var(--r);
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,255,255,.80), rgba(255,255,255,.62));
  box-shadow: var(--shadow);
  padding: 16px 18px;
  color: var(--ink);
}

.inner-page .ess-box{ margin: 12px 0 16px; }

.inner-page .ess-note{
  margin: 10px 0 16px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px dashed rgba(184,132,50,.45);
  background: rgba(251,211,122,.16);
  color: #52483f;
}

/* lists */
.inner-page .ess-list{ margin:0; padding-left:18px; }
.inner-page .ess-list li{ margin:7px 0; color: var(--ink); }
.inner-page .ess-mini{ margin:0; padding-left:18px; }
.inner-page .ess-mini li{ margin:6px 0; }

/* grid 2 cards */
.inner-page .ess-grid2{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 16px;
  margin: 12px 0 18px;
}
@media (max-width: 900px){
  .inner-page .ess-grid2{ grid-template-columns: 1fr; }
}
.inner-page .ess-card__title{
  font-weight: 900;
  color: #4a4036;
  margin-bottom: 8px;
}

/* tables (jei atsiras) */
.inner-page .ess-main table{
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 14px;
  overflow:hidden;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(124,107,78,.22);
  box-shadow: 0 12px 28px rgba(0,0,0,.08);
}
.inner-page .ess-main th,
.inner-page .ess-main td{
  padding: 12px 14px;
  text-align:left;
  font-size: 15px;
  color: #4b433a;
  border-bottom: 1px solid rgba(124,107,78,.18);
}
.inner-page .ess-main th{
  background: linear-gradient(180deg, rgba(251,211,122,.55), rgba(255,255,255,.50));
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: 12px;
}
.inner-page .ess-main tr:last-child td{ border-bottom:0; }

/* ---- MOBILE: sidebar above ---- */
@media (max-width: 1050px){
  .inner-page .ess-layout{ grid-template-columns: 1fr; }
  .inner-page .ess-sidebar{
    position: relative;
    top: 0;
    height: auto;
    overflow: visible;
    padding-right: 0;
    margin-bottom: 14px;
  }
  .inner-page .ess-header h1{ font-size: 40px; }
}
.ess-table.is-sticky{
  position: sticky;
  top: var(--topOff);
  z-index: 5;
  max-height: calc(100vh - (var(--topOff) + 20px));
  overflow: auto;
}

:root{
  --pageW: 1420px;     /* content-area max-width */
  --sideW: 280px;
  --gap: 20px;
  --topNavH: 90px;     /* tavo fixed navigation aukštis */
  --topOff: 110px;     /* jei reikia - kelk/mažink */
}

/* 1) Desktop: meniu VISADA fiksuotas */
@media (min-width: 1051px){

  /* padarom, kad layout nebūtų grid (nes sidebar bus išimtas iš flow) */
  .ess-layout{
    position: relative;
    display: block !important;
  }

  /* fiksuojam sidebar prie viewport, bet sulygiuojam su content-area kaire */
  .ess-sidebar{
    position: fixed !important;
    top: var(--topOff) !important;

    /* content-area yra center, todėl pririšam prie jo kairės */
    left: calc(50% - (min(var(--pageW), (100vw - 60px)) / 2)) !important;

    width: var(--sideW) !important;
    height: calc(100vh - (var(--topOff) + 20px)) !important;
    overflow: auto !important;
    z-index: 50;
  }

  /* pastumiam turinį į dešinę, kad neužliptų ant meniu */
  .ess-main{
    margin-left: calc(var(--sideW) + var(--gap)) !important;
    min-width: 0;
  }
}

/* 2) Mobile: sidebar viršuje (nefiksuotas) */
@media (max-width: 1050px){
  .ess-layout{ display:block !important; }
  .ess-sidebar{
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    margin-bottom: 14px;
  }
  .ess-main{ margin-left: 0 !important; }
}

/* 3) Jeigu kažkur tema uždeda transform ir sticky/fixed glitchina – išjungiam */
.inner-page, .inner-page__content, .content-area, .ess-layout{
  transform: none !important;
  filter: none !important;
  perspective: none !important;
}

/* === Essence: dark text ONLY inside light cards/boxes === */
.inner-page .ess-box,
.inner-page .ess-card,
.inner-page .ess-note{
  color:#3b352f;
}

/* headings inside cards */
.inner-page .ess-box h2,
.inner-page .ess-box h3,
.inner-page .ess-card h2,
.inner-page .ess-card h3,
.inner-page .ess-card__title{
  color:#2f2a25;
}

/* lists inside cards */
.inner-page .ess-box .ess-list,
.inner-page .ess-card .ess-mini,
.inner-page .ess-note{
  color:#3b352f;
}

.inner-page .ess-box b,
.inner-page .ess-card b{
  color:#2f2a25;
}

/* links inside cards */
.inner-page .ess-box a,
.inner-page .ess-card a,
.inner-page .ess-note a{
  color:#6b4b1f;
}
.inner-page .ess-box a:hover,
.inner-page .ess-card a:hover,
.inner-page .ess-note a:hover{
  color:#8a5c22;
}
.inner-page .ess-box *,
.inner-page .ess-card *,
.inner-page .ess-note *{
  color: inherit;
}
/* ===== Sidebar accordion ===== */
.ess-acc{
  border: 0;
  margin: 10px 0;
}

.ess-acc__sum{
  list-style: none;
  cursor: pointer;
  user-select: none;

  display:flex;
  align-items:center;
  justify-content:space-between;

  padding: 10px 12px;
  border-radius: 12px;

  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: 12px;

  background: rgba(0,0,0,.10);
  border: 1px solid rgba(255,255,255,.10);
}

.ess-acc__sum:hover{
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.18);
}

/* nuimam default markerį */
.ess-acc__sum::-webkit-details-marker{ display:none; }
.ess-acc__sum::marker{ content:""; }

.ess-acc__chev{
  width: 10px;
  height: 10px;
  display:inline-block;
  border-right: 2px solid rgba(255,255,255,.75);
  border-bottom: 2px solid rgba(255,255,255,.75);
  transform: rotate(45deg);
  transition: transform .2s ease;
  opacity: .9;
  margin-left: 12px;
}

/* kai atidaryta - rodyklė aukštyn */
.ess-acc[open] .ess-acc__chev{
  transform: rotate(-135deg);
}

/* body */
.ess-acc__body{
  padding: 8px 6px 2px 6px;
}

/* top-level links (General/Locations/Updates) kad atrodytų kaip mygtukai */
.ess-link--top{
  margin-top: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: 12px;
}
/* active link */
#essToc .ess-link.is-active{
  color: #2f2a25;
  background: rgba(255,255,255,.55);
  border-color: rgba(0,0,0,.12);
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
}

/* active accordion header */
#essToc .ess-acc.is-active > .ess-acc__sum{
  background: rgba(255,255,255,.40);
  border-color: rgba(0,0,0,.14);
  color:#2f2a25;
}

/* chevron tamsesnis kai active */
#essToc .ess-acc.is-active .ess-acc__chev{
  border-right-color: rgba(0,0,0,.55);
  border-bottom-color: rgba(0,0,0,.55);
}

/* ===== TOC (Contents) – brown/gold theme, no grey ===== */
#essToc{
  --toc-brown: #6f6551;   /* pagr. ruda */
  --toc-gold:  #ca8a2f;   /* auksinis */
  --toc-gold2: #d6a24a;   /* hover */
  --toc-bg:    #ffffff;
  --toc-line:  rgba(111,101,81,.22);
  --toc-soft:  rgba(111,101,81,.08);
}

/* bendras “pills” stilius visiems mygtukams linkams */
#essToc .ess-link,
#essToc .ess-acc__sum{
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:100%;
  min-height:42px;
  padding:10px 14px;
  border-radius:12px;

  background: var(--toc-bg);
  border:1px solid var(--toc-line);
  color: var(--toc-brown);

  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:12px;

  box-shadow: 0 6px 18px rgba(0,0,0,.06);
}

/* nuimame default grey/highlight */
#essToc .ess-acc__sum{
  list-style:none;
  cursor:pointer;
  user-select:none;
}
#essToc .ess-acc__sum::-webkit-details-marker{ display:none; }

/* hover */
#essToc .ess-link:hover,
#essToc .ess-acc__sum:hover{
  border-color: rgba(202,138,47,.45);
  background: rgba(202,138,47,.08);
  color: #5c5341;
}

/* active link */
#essToc .ess-link.is-active{
  background: linear-gradient(180deg, rgba(202,138,47,.22), rgba(202,138,47,.10));
  border-color: rgba(202,138,47,.65);
  color: #4d402f;
  box-shadow: 0 10px 22px rgba(202,138,47,.14);
}

/* active accordion header (Items/Skills kai viduje active) */
#essToc .ess-acc.is-active > .ess-acc__sum{
  background: linear-gradient(180deg, rgba(202,138,47,.22), rgba(202,138,47,.10));
  border-color: rgba(202,138,47,.65);
  color:#4d402f;
}

/* accordion body */
#essToc .ess-acc__body{
  padding:10px 10px 2px;
  margin-top:8px;
  border-radius:12px;
  border:1px dashed rgba(111,101,81,.25);
  background: rgba(111,101,81,.04);
}

/* mažesni vidiniai linkai */
#essToc .ess-acc__body .ess-link{
  text-transform:none;
  letter-spacing:0;
  font-size:13px;
  font-weight:700;
  min-height:38px;
  box-shadow:none;
  background: rgba(255,255,255,.85);
}

/* chevron (rodyklė) */
#essToc .ess-acc__chev{
  width:10px; height:10px;
  margin-left:12px;
  border-right:2px solid rgba(111,101,81,.55);
  border-bottom:2px solid rgba(111,101,81,.55);
  transform: rotate(45deg);
  transition: transform .18s ease, border-color .18s ease;
}
#essToc details[open] > .ess-acc__sum .ess-acc__chev{
  transform: rotate(-135deg);
}
#essToc .ess-acc.is-active .ess-acc__chev{
  border-right-color: rgba(202,138,47,.85);
  border-bottom-color: rgba(202,138,47,.85);
}

/* detalės tarpai */
#essToc .ess-acc{ margin:10px 0; }
#essToc .ess-link--top{ margin:10px 0; }

/* ===== Wiki in-page search (Ctrl+F style) ===== */
.ess-search{
  margin: 8px 0 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(111,101,81,.18);
}
.ess-search__inp{
  width: 100%;
  height: 40px;
  border-radius: 12px;
  border: 1px solid rgba(111,101,81,.22);
  background: rgba(255,255,255,.92);
  padding: 0 12px;
  outline: none;
  color: #4d402f;
  font-weight: 700;
}
.ess-search__inp:focus{
  border-color: rgba(202,138,47,.60);
  box-shadow: 0 0 0 3px rgba(202,138,47,.20);
}
.ess-search__row{
  display:flex;
  gap: 8px;
  align-items:center;
  margin-top: 8px;
}
.ess-search__btn{
  width: 40px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(111,101,81,.22);
  background: rgba(255,255,255,.92);
  cursor: pointer;
  font-weight: 900;
  color: #6f6551;
}
.ess-search__btn:hover{
  border-color: rgba(202,138,47,.45);
  background: rgba(202,138,47,.08);
  color: #4d402f;
}
.ess-search__btn--x{ margin-left: auto; }
.ess-search__count{
  font-size: 12px;
  font-weight: 800;
  color: #6f6551;
  min-width: 54px;
  text-align: center;
}

/* highlights */
.ess-hit{
  padding: 0 2px;
  border-radius: 4px;
  background: rgba(202,138,47,.25);
  box-shadow: inset 0 0 0 1px rgba(202,138,47,.25);
}
.ess-hit.is-current{
  background: rgba(202,138,47,.55);
  box-shadow: inset 0 0 0 2px rgba(202,138,47,.40);
}
/* FIX: force dark text inside info/cards (theme overrides white) */
.inner-page .ess-box,
.inner-page .ess-card,
.inner-page .ess-note{
  color: #3b352f !important;
}

.inner-page .ess-box *,
.inner-page .ess-card *,
.inner-page .ess-note *{
  color: #3b352f !important;
}

/* bold dar tamsiau */
.inner-page .ess-box b,
.inner-page .ess-card b{
  color: #2f2a25 !important;
}
.ess-p{margin:0 0 12px;line-height:1.6;opacity:.92}
.ess-box .ess-p:last-of-type{margin-bottom:14px}
.ess-box .ess-p b{font-weight:700}

.ess-subbox{padding:14px 16px;border:1px solid rgba(0,0,0,.08);border-radius:14px;background:rgba(255,255,255,.65)}
.ess-subbox + .ess-subbox{margin-top:12px}
.ess-subbox .ess-p:last-of-type{margin-bottom:0}

.ess-soon{padding:14px 16px;border:1px dashed rgba(0,0,0,.18);border-radius:14px;background:rgba(255,255,255,.55)}
.ess-soon__title{font-weight:800;letter-spacing:.2px;margin:0 0 4px}
.ess-soon__text{opacity:.85;line-height:1.55}

.ess-tablewrap { width: 100%; }
.ess-table {
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
  border-radius: 14px;
}
.ess-table th, .ess-table td {
  padding: 12px 14px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  text-align: left;
}
.ess-table thead th {
  font-weight: 700;
  background: rgba(255,255,255,.06);
}
.ess-table tbody tr:hover {
  background: rgba(255,255,255,.04);
}
.ess-note {
  margin-top: 10px;
  opacity: .8;
  font-size: 14px;
}
.ess-grid2{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:16px;
}
@media (max-width: 900px){
  .ess-grid2{ grid-template-columns: 1fr; }
}

.ess-card{
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  border-radius: 14px;
  padding: 14px 14px 12px;
}

.ess-card__title{
  font-weight: 800;
  margin: 0 0 10px;
}

.ess-list{
  margin: 0;
  padding-left: 18px;
}
.ess-list li{ margin: 6px 0; }

.ess-divider{
  height:1px;
  background: rgba(255,255,255,.08);
  margin: 18px 0;
}

.ess-mutedbox{
  border: 1px dashed rgba(255,255,255,.14);
  background: rgba(255,255,255,.02);
  border-radius: 14px;
  padding: 12px 14px;
}

.ess-mutedbox__title{
  font-weight: 800;
  margin: 0 0 8px;
  opacity: .9;
}

.ess-list--inline{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  padding-left: 0;
  list-style: none;
}
.ess-list--inline li{
  margin: 0;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
}

