
/* =====================================================
   KCO WIKI — OBSIDIAN PUBLISH
   Kompetenční centrum pro odolnost | UCEEB ČVUT

   Typografie: Literata
   Primární modrá KCO: #002cba
   Světlý režim: bílá, černé písmo, modré odkazy
   Tmavý režim: antracit, jemně bílé písmo
   Logo: automatický negativ v tmavém režimu
   ===================================================== */


/* 01 — PÍSMO
   ----------------------------------------------------- */

@import url("https://fonts.googleapis.com/css2?family=Literata:opsz,wght@7..72,400;7..72,500;7..72,600;7..72,700&display=swap");


/* 02 — SPOLEČNÁ NASTAVENÍ
   ----------------------------------------------------- */

body {
  --kco-blue: #002cba;

  --font-text-theme: "Literata", Georgia, serif;
  --font-interface-theme: "Literata", Georgia, serif;

  --font-text: "Literata", Georgia, serif;
  --font-interface: "Literata", Georgia, serif;

  --file-line-width: 800px;

  font-family: "Literata", Georgia, serif;
}


/* 03 — SVĚTLÝ REŽIM
   ----------------------------------------------------- */

body.theme-light,
.theme-light {
  /* Pozadí */
  --kco-bg: #ffffff;
  --kco-bg-soft: #f7f7f7;

  /* Text */
  --kco-text: #191919;
  --kco-heading: #171717;
  --kco-muted: #686868;

  /* Oddělovače */
  --kco-border: #e5e5e5;
  --kco-hover: #f2f2f2;
  --kco-selection: #e8ecfa;

  /* Odkazy */
  --kco-link: #002cba;
  --kco-link-hover: #001e82;
  --kco-link-underline: #9aaceb;

  /* Proměnné Obsidian Publish */
  --background-primary: var(--kco-bg);
  --background-secondary: var(--kco-bg);
  --background-secondary-alt: var(--kco-bg-soft);

  --text-normal: var(--kco-text);
  --text-muted: var(--kco-muted);
  --text-faint: var(--kco-muted);
  --text-accent: var(--kco-text);

  --link-color: var(--kco-link);
  --link-color-hover: var(--kco-link-hover);
  --link-external-color: var(--kco-link);

  --h1-color: var(--kco-heading);
  --h2-color: var(--kco-heading);
  --h3-color: var(--kco-heading);
  --h4-color: var(--kco-heading);
  --h5-color: var(--kco-heading);
  --h6-color: var(--kco-heading);

  --background-modifier-border: var(--kco-border);
  --background-modifier-hover: var(--kco-hover);
}


/* 04 — TMAVÝ REŽIM: SOFT NEUTRAL
   ----------------------------------------------------- */

body.theme-dark,
.theme-dark {
  /* Jemné antracitové pozadí */
  --kco-bg: #25272b;
  --kco-bg-soft: #303238;

  /* Jemně bílé písmo bez fialového nádechu */
  --kco-text: #dededb;
  --kco-heading: #eaeae6;
  --kco-muted: #a9aaa8;

  /* Nenápadné oddělovače */
  --kco-border: #414348;
  --kco-hover: #34363b;
  --kco-selection: #414857;

  /* Světlejší modrá pro čitelnost */
  --kco-link: #a9bce9;
  --kco-link-hover: #c6d3f3;
  --kco-link-underline: #758bb8;

  /* Proměnné Obsidian Publish */
  --background-primary: var(--kco-bg);
  --background-secondary: var(--kco-bg);
  --background-secondary-alt: var(--kco-bg-soft);

  --text-normal: var(--kco-text);
  --text-muted: var(--kco-muted);
  --text-faint: var(--kco-muted);
  --text-accent: var(--kco-text);

  --link-color: var(--kco-link);
  --link-color-hover: var(--kco-link-hover);
  --link-external-color: var(--kco-link);

  --h1-color: var(--kco-heading);
  --h2-color: var(--kco-heading);
  --h3-color: var(--kco-heading);
  --h4-color: var(--kco-heading);
  --h5-color: var(--kco-heading);
  --h6-color: var(--kco-heading);

  --background-modifier-border: var(--kco-border);
  --background-modifier-hover: var(--kco-hover);
}


/* 05 — HLAVNÍ ROZLOŽENÍ
   ----------------------------------------------------- */

.published-container {
  font-family: "Literata", Georgia, serif;
  color: var(--kco-text);
  background-color: var(--kco-bg);
}

.published-container .site-body-center-column {
  background-color: var(--kco-bg);
}

.markdown-preview-view {
  font-family: "Literata", Georgia, serif;
  color: var(--kco-text);
  --file-line-width: 800px;
}

.markdown-preview-view p,
.markdown-preview-view li {
  font-size: 0.98rem;
  line-height: 1.85;
  color: var(--kco-text);
}

.markdown-preview-view p {
  margin-bottom: 1.2em;
}

.markdown-preview-view strong {
  font-weight: 700;
  color: var(--kco-heading);
}


/* 06 — NADPISY
   ----------------------------------------------------- */

.published-container .markdown-preview-view h1,
.published-container .markdown-preview-view h2,
.published-container .markdown-preview-view h3,
.published-container .markdown-preview-view h4,
.published-container .markdown-preview-view h5,
.published-container .markdown-preview-view h6 {
  font-family: "Literata", Georgia, serif;
  color: var(--kco-heading) !important;
}

.markdown-preview-view h1 {
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.035em;
  margin-bottom: 1.1rem;
}

.markdown-preview-view h2 {
  font-size: 1.65rem;
  font-weight: 700;
  line-height: 1.35;
  margin-top: 2.4rem;
  margin-bottom: 1rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid var(--kco-border);
}

.markdown-preview-view h3 {
  font-size: 1.22rem;
  font-weight: 700;
  line-height: 1.45;
  margin-top: 1.9rem;
}

.markdown-preview-view h4 {
  font-size: 1.05rem;
  font-weight: 700;
  margin-top: 1.5rem;
}

/* Titulek stránky generovaný Obsidian Publish */

.published-container .page-header,
.published-container .page-header h1 {
  font-family: "Literata", Georgia, serif;
  color: var(--kco-heading) !important;
  font-weight: 700;
}


/* 07 — ODKAZY
   ----------------------------------------------------- */

.published-container .markdown-preview-view a,
.published-container .markdown-preview-view a.internal-link,
.published-container .markdown-preview-view a.external-link {
  color: var(--kco-link);
  text-decoration: underline;
  text-decoration-color: var(--kco-link-underline);
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;

  transition:
    color 0.2s ease,
    text-decoration-color 0.2s ease;
}

.published-container .markdown-preview-view a:hover {
  color: var(--kco-link-hover);
  text-decoration-color: var(--kco-link-hover);
}

.published-container
.markdown-preview-view a.internal-link.is-unresolved {
  color: var(--kco-muted);
  text-decoration-style: dotted;
}


/* 08 — LEVÁ NAVIGACE
   ----------------------------------------------------- */

.site-body-left-column {
  background-color: var(--kco-bg);
  border-right: 1px solid var(--kco-border);
}

.site-body-left-column-site-name {
  font-family: "Literata", Georgia, serif;
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--kco-heading) !important;
}

.site-body-left-column .tree-item {
  font-family: "Literata", Georgia, serif;
  font-size: 0.84rem;
}

.site-body-left-column .tree-item-self {
  border-radius: 5px;
  transition: background-color 0.2s ease;
}

.site-body-left-column .tree-item-self:hover {
  background-color: var(--kco-hover);
}

.site-body-left-column .tree-item-self.is-active {
  background-color: var(--kco-bg-soft);
  border-left: 2px solid var(--kco-muted);
  font-weight: 700;
}

.site-body-left-column .tree-item-inner {
  color: var(--kco-text);
}

.site-body-left-column .tree-item-self.mod-collapsible {
  color: var(--kco-text);
}


/* 09 — PRAVÝ PANEL A GRAF
   ----------------------------------------------------- */

.site-body-right-column {
  background-color: var(--kco-bg);
  border-left: 1px solid var(--kco-border);
}

.site-body-right-column .tree-item {
  font-family: "Literata", Georgia, serif;
  font-size: 0.82rem;
}

.site-body-right-column .tree-item-self.is-active {
  color: var(--kco-heading);
}

.site-body-right-column .tree-item-inner {
  color: var(--kco-muted);
}

.graph-view-container {
  border-color: var(--kco-border);
  background-color: var(--kco-bg);
}


/* 10 — CITACE
   ----------------------------------------------------- */

.markdown-preview-view blockquote {
  background-color: var(--kco-bg-soft);
  border-left: 3px solid var(--kco-muted);
  border-radius: 0 6px 6px 0;
  padding: 16px 22px;
  margin: 1.6rem 0;
  color: var(--kco-text);
}

.markdown-preview-view blockquote p {
  margin: 0.35rem 0;
}


/* 11 — INFORMAČNÍ BLOKY / CALLOUTS
   ----------------------------------------------------- */

.callout {
  --callout-color: 120, 120, 120;

  background-color: var(--kco-bg-soft);
  border: 1px solid var(--kco-border);
  border-left: 3px solid var(--kco-muted);
  border-radius: 6px;
}

.callout-title {
  color: var(--kco-heading);
  font-weight: 700;
}

.callout-content {
  color: var(--kco-text);
}


/* 12 — SEZNAMY
   ----------------------------------------------------- */

.markdown-preview-view ul,
.markdown-preview-view ol {
  padding-left: 1.6rem;
}

.markdown-preview-view li {
  padding-left: 0.15rem;
  margin-bottom: 0.35rem;
}

.markdown-preview-view li::marker {
  color: var(--kco-muted);
}


/* 13 — TABULKY
   ----------------------------------------------------- */

.markdown-preview-view table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5rem 0;
  font-size: 0.9rem;
}

.markdown-preview-view th {
  background-color: var(--kco-bg-soft);
  color: var(--kco-heading);
  font-weight: 700;
}

.markdown-preview-view th,
.markdown-preview-view td {
  border: 1px solid var(--kco-border);
  padding: 12px 14px;
  text-align: left;
  color: var(--kco-text);
}

.markdown-preview-view tr:nth-child(even) {
  background-color: var(--kco-bg-soft);
}


/* 14 — KÓD A ODDĚLOVAČE
   ----------------------------------------------------- */

.markdown-preview-view hr {
  border: none;
  border-top: 1px solid var(--kco-border);
  margin: 2.5rem 0;
}

.markdown-preview-view code {
  background-color: var(--kco-bg-soft);
  color: var(--kco-text);
  border-radius: 4px;
  padding: 2px 5px;
}

.markdown-preview-view pre {
  background-color: var(--kco-bg-soft);
  border: 1px solid var(--kco-border);
  border-radius: 6px;
}

.markdown-preview-view pre code {
  background: transparent;
}

.markdown-preview-view ::selection {
  background-color: var(--kco-selection);
  color: var(--kco-heading);
}


/* 15 — VYHLEDÁVÁNÍ
   ----------------------------------------------------- */

.site-body-left-column input {
  font-family: "Literata", Georgia, serif;
  color: var(--kco-text);
  background-color: var(--kco-bg);
  border-color: var(--kco-border);
}

.site-body-left-column input::placeholder {
  color: var(--kco-muted);
}

.site-body-left-column input:focus {
  border-color: var(--kco-muted);
  box-shadow: none;
}


/* 16 — OVLÁDACÍ PRVKY
   ----------------------------------------------------- */

.published-container button {
  font-family: "Literata", Georgia, serif;
}

.published-container .clickable-icon {
  color: var(--kco-muted);
}

.published-container .clickable-icon:hover {
  color: var(--kco-heading);
  background-color: var(--kco-hover);
}


/* 17 — AUTOMATICKÝ NEGATIV LOGA KCO
   -----------------------------------------------------

   Přesný HTML selektor podle vašeho screenshotu:

   <a class="site-body-left-column-site-logo">
     <img src=".../uceeb%20black%202.png">
   </a>

   V tmavém režimu se logo automaticky
   převede na bílou variantu.

   Funguje pro jednobarevné černé logo
   s průhledným pozadím.
   ----------------------------------------------------- */

/* Výchozí logo */
.site-body-left-column-site-logo img {
  filter: none;
  transition: filter 0.2s ease;
}

/* Automaticky po přepnutí na tmavý režim */
.theme-dark .site-body-left-column-site-logo img {
  filter: brightness(0) invert(1);
}

/* Návrat k původnímu logu */
.theme-light .site-body-left-column-site-logo img {
  filter: none;
}


/* 18 — MOBILNÍ ZOBRAZENÍ
   ----------------------------------------------------- */

@media (max-width: 768px) {

  .markdown-preview-view h1 {
    font-size: 1.9rem;
  }

  .markdown-preview-view h2 {
    font-size: 1.4rem;
  }

  .markdown-preview-view h3 {
    font-size: 1.15rem;
  }

  .markdown-preview-view p,
  .markdown-preview-view li {
    font-size: 0.95rem;
    line-height: 1.75;
  }

  .site-body-left-column-site-name {
    font-size: 1.15rem;
  }
}


/* 19 — OMEZENÍ ANIMACÍ
   ----------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {

  .published-container *,
  .published-container *::before,
  .published-container *::after {
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}


/* Levá navigace – hranaté položky bez zaoblení */

.site-body-left-column .tree-item-self,
.site-body-left-column .tree-item-self.is-active,
.site-body-left-column .tree-item-self:hover {
  border-radius: 0 !important;
}

