/* ===========================
   Antimatter Oriental – 3 columns + robust TOC (fixed on desktop)
   =========================== */

:root {
  /* výška pevné hlavičky */
  /* --header-offset: 112px;*/
  /* --header-offset: 90px;*/
  /* šířky sloupců */
  --left-col: 320px;
  --right-col: 320px;
  /* mezera mezi sloupci */
  
  /* --gap: 24px; */
  --gap: 6px;
  /* vnější bezpečný offset od pravého okraje viewportu (pro fixed) */
  /*--edge-pad: 24px;*/
}

/* --- Grid layout (desktop default) --- */
.o3c-container {
  display: grid;
  grid-template-columns: var(--left-col) 1fr var(--right-col);
  gap: var(--gap);
  align-items: start;
  overflow: visible;
}

.o3c-left  { min-width: calc(var(--left-col) - 40px); }
.o3c-main  { min-width: 0; }
.o3c-right {
  position: relative;      /* necháme sloupec existovat, ale obsah v něm bude fixed */
  align-self: start;
  overflow: visible;
}

/* --- TOC --- */
.o3c-toc { margin: 0; padding: 0; list-style: none; }
.o3c-toc h4 { margin-top: 0; }

/* Desktop: TOC přichytit k viewportu */
@media (min-width: 1025px) {
  .o3c-toc-wrapper {
    position: fixed !important;
    top: var(--header-offset);
    /* Připíchnout k pravému okraji viewportu s bezpečnou mezerou */
    /* right: max(env(safe-area-inset-right), var(--edge-pad)); */
    width: var(--right-col);
    max-height: calc(100vh - var(--header-offset) - var(--edge-pad));
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding-right: 8px; /* místo pro scrollbar */
    box-sizing: border-box;
  }
}

/* Tablet/Mobile: TOC normálně v toku (žádné fixed) */
@media (max-width: 1024px) {
  .o3c-toc-wrapper {
    position: static !important;
    top: auto;
    width: auto;
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }

  /* 2 sloupce: obsah + TOC (volitelně) */
  .o3c-container {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  /* Pokud chceš TOC stále vpravo na tablet, odkomentuj a uprav:
  .o3c-container { grid-template-columns: 1fr 260px; }
  .o3c-right { grid-column: 2; }
  */
}

/* Kotvy: ať hlavička nezakrývá nadpisy po kliknutí z TOC */
html { scroll-behavior: smooth; }
.o3c-main h1,
.o3c-main h2,
.o3c-main h3,
.o3c-main h4,
.o3c-main h5,
.o3c-main h6 {
  scroll-margin-top: var(--header-offset);
}

/* Decentní styly pro TOC odkazy */
.o3c-toc a { text-decoration: none; }
.o3c-toc a:hover { text-decoration: underline; }
.o3c-toc a.active { font-weight: 600; }

/* Blog list drobnosti (ponechávám jak byly) */
.o3c-blog-list { display: grid; gap: 16px; }
.o3c-blog-item h2 { margin: 0 0 6px; font-size: 1.25rem; line-height: 1.3; }
.o3c-blog-summary { color: #333; }


/* Výchozí (desktop) může zůstat 7rem) */

/* Na menších displejích menší padding */
@media (max-width: 1200px) {
  #body,
  #header,
  #footer,
  .fullwidth #header,
  .fullwidth #breadcrumbs,
  .fullwidth .blog-header,
  .fullwidth .blog-content-item,
  .fullwidth .content-wrapper,
  .fullwidth ul.pagination,
  .fullwidth #body > .modular-row,
  .padding-horiz {
    padding-left: 3rem;
    padding-right: 3rem;
  }
}

@media (max-width: 768px) {
  #body,
  #header,
  #footer,
  .fullwidth #header,
  .fullwidth #breadcrumbs,
  .fullwidth .blog-header,
  .fullwidth .blog-content-item,
  .fullwidth .content-wrapper,
  .fullwidth ul.pagination,
  .fullwidth #body > .modular-row,
  .padding-horiz {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}




/* Navíc musíš přebít i #body */
#body {
  background: transparent !important;
}
/* zrušení bílého podkladu slidebars */
#sb-site,
.sb-site-container {
  background: transparent !important;
}

/* nastavení pozadí na body */
body {
  background: url('/user/themes/antimatter-oriental/images/background.png') no-repeat center top fixed !important;
  background-size: cover !important;
}

/* --- zvýraznění boxů obsahu --- */
.o3c-container {
  /* mezery, ať je to oddělené od okrajů */
  padding: 16px;
}

.o3c-main,
.o3c-toc,
.o3c-left {
  background: rgba(240, 240, 240, 0.92); /* světle šedé s lehkou průhledností */
  border-radius: 20px;                     /* zaoblené rohy */
  padding: 12px;                          /* vnitřní odsazení pro text */
  box-shadow: 0 2px 8px rgba(0,0,0,0.08); /* jemný stín, aby to vystoupilo */
  line-height: 1.2;
}

/* zruší defaultní odsazení */
.o3c-tree ul {
  margin-left: 0 !important;
  padding-left: 0rem !important; /* zmenšíš podle potřeby, třeba i 0.5rem */
}

/* li položky budou blíž k levému okraji */
.o3c-tree li {
  margin-left: -25px !important;
  padding-left: 0rem !important;
}

.o3c-toc ul {
  margin-left: 0 !important;
  padding-left: 1rem !important; /* zmenšíš podle potřeby, třeba i 0.5rem */
}

/* li položky budou blíž k levému okraji */
.o3c-toc li {
  margin-left: 0px !important;
  padding-left: 0rem !important;
}


#body {
	padding-top: 80px;
}

hr {
  border: none !important;
  margin: 0 !important;
}


/* Levý klik navigace - left-blog-menu.html.twig */
/* Levý klik navigace - left-blog-menu.html.twig */
.o3c-tree li.is-active > a {
  font-weight: bold;
  background: rgba(0,0,0,0.08);
  border-radius: 4px;
}

.o3c-tree li.is-active > a {
  display: inline-block;      /* udělá z <a> box */
  padding: 1px 60px;           /* trochu prostoru kolem textu */
  font-weight: bold;
  background: rgba(0,0,0,0.08);
  border-radius: 6px;         /* klidně zvětši třeba na 6–8px */
  text-decoration: none;
}

.article-meta {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1rem;
  font-style: italic;
}
.article-author { color: #444; }
.article-date   { color: #666; }

#footer {
  position: fixed;
}