/* ==========================================================================
   ZADS Academy (learn.zads.fr) — "Atelier" skin
   Ports the visual language of the main ZADS site (home_zads, theme
   "Atelier") onto the existing Grav / Learn2 documentation layout.

   This file is loaded last (see templates/partials/base.html.twig) so its
   rules win the cascade over css-compiled/theme.css and css/custom.css.
   It only restyles — no template structure, navigation, or page content
   is changed by this file.
   ========================================================================== */

:root{
  --ink:#1d1d1f;
  --ink-soft:#6e6e73;
  --line:#e5e5e5;
  --paper:#ffffff;
  --paper-alt:#f7f7f5;
  --accent:#2f6b4f;
  --accent-soft:#e7f0ea;
  --danger:#b3432f;
  --danger-soft:#fbeae6;
}

/* ---------- global type & body ---------- */
body{
  font-family:'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
}

h1, h2, h3, h4, h5, h6{
  font-family:'Fraunces', serif;
  font-weight:500;
  color:var(--ink);
  letter-spacing:-0.01em;
}

#body-inner h1{ text-align:left; letter-spacing:-0.02em; }

a{ color:var(--ink); }
a:hover{ color:var(--accent); }

/* ---------- sidebar / left nav ---------- */
#sidebar{
  background-color:var(--paper-alt);
  border-right:1px solid var(--line);
}
#sidebar a{ color:var(--ink-soft); font-family:'Inter', sans-serif; }
#sidebar a:hover{ color:var(--ink); }
#sidebar a.subtitle{ color:rgba(110,110,115,0.7); }
#sidebar hr{ border-bottom:1px solid var(--line); }

#sidebar h5.parent a{
  background:rgba(0,0,0,0.04);
  color:var(--ink) !important;
}
#sidebar h5.active a{
  background:var(--paper);
  color:var(--ink) !important;
}
#sidebar h5 i{ color:var(--ink-soft); }

#sidebar ul.topics > li.parent,
#sidebar ul.topics > li.active{
  background:rgba(0,0,0,0.04);
}
#sidebar ul li.active > a{
  background:var(--paper);
  color:var(--ink) !important;
  font-weight:500;
}
#sidebar ul li.visited > a .read-icon{ color:var(--accent); }
#sidebar ul.searched a{ color:var(--ink-soft); }
#sidebar ul.searched .search-match a{ color:var(--accent); }
#sidebar ul.searched .search-match a:hover{ color:var(--ink); }

/* ---------- header / logo block inside sidebar ---------- */
#header{
  background:var(--paper);
  border-bottom:1px solid var(--line);
  padding:1.25rem 1rem;
}
.zads-logo-header{
  color:var(--ink) !important;
  font-family:'Fraunces', serif;
  font-weight:500;
  font-size:1.15em;
}

/* ---------- search box ---------- */
.searchbox{
  background:var(--paper-alt);
  border:1px solid var(--line);
  border-radius:980px;
}
.searchbox label{ color:var(--ink-soft); }
.searchbox span{ color:var(--ink-soft); }
.searchbox span:hover{ color:var(--ink); }
.searchbox input{ color:var(--ink); }
.searchbox input::placeholder{ color:var(--ink-soft); opacity:1; }

/* ---------- main content area ---------- */
#body{ background:var(--paper); }
#body-inner{ color:var(--ink); }
#body-inner p, #body-inner li{ color:var(--ink-soft); line-height:1.7; }
#body-inner strong{ color:var(--ink); }
#body-inner a{ color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
#body-inner a:hover{ color:var(--ink); }
#body #breadcrumbs a{ color:var(--ink-soft); }
#body #breadcrumbs a:hover{ color:var(--ink); }

/* ---------- inline code & code blocks ---------- */
code{
  background:var(--paper-alt);
  color:var(--accent);
  border:1px solid var(--line);
  border-radius:4px;
}
pre{
  background:var(--paper-alt);
  border:1px solid var(--line);
  border-radius:8px;
}
pre code{
  color:var(--ink);
  background:transparent;
  border:none;
}
.copy-to-clipboard{
  background-color:var(--paper-alt);
  color:var(--ink-soft);
}
.copy-to-clipboard:hover{ background-color:var(--line); }

/* ---------- blockquotes / info-warning-note-tip boxes ---------- */
blockquote{ border-left-color:var(--line); }

/* level 1 (yellow -> accent-soft) */
blockquote > blockquote > p{
  border-top-color:var(--accent);
  background:var(--accent-soft);
  color:var(--ink);
}
/* level 2 (red/warning -> danger) */
blockquote > blockquote > blockquote > p{
  border-top-color:var(--danger);
  background:var(--danger-soft);
  color:var(--ink);
}
/* level 3 (blue/note -> ink-soft on paper-alt) */
blockquote > blockquote > blockquote > blockquote > p{
  border-top-color:var(--ink-soft);
  background:var(--paper-alt);
  color:var(--ink);
}
blockquote p:first-child:before,
blockquote p:first-child:after{ color:var(--ink); }

/* ---------- page title band ---------- */
.page-title{
  background:var(--accent-soft);
  color:var(--ink);
  border-radius:8px;
}

/* ---------- prev/next pagination ---------- */
#navigation .nav{ color:var(--ink-soft); }
#navigation .nav:hover{ color:var(--ink); }

/* ---------- top bar / breadcrumbs strip ---------- */
#top-bar{ background:var(--paper-alt); }

/* ---------- floating page TOC widget ---------- */
.page-toc{
  border:1px solid var(--line);
  background-color:rgba(255,255,255,0.94);
  border-radius:8px;
}
.more-section-link{
  background-color:var(--paper-alt);
  border-radius:8px;
}

/* ---------- tables ---------- */
#body-inner table{ border-collapse:collapse; }
#body-inner table th, #body-inner table td{
  border:1px solid var(--line);
  padding:8px 10px;
}
#body-inner table th{ background:var(--paper-alt); color:var(--ink); }

/* ---------- misc ---------- */
hr{ border-bottom:1px solid var(--line); }
.scrollbar-inner > .scroll-element .scroll-bar{ background-color:var(--line); }
.scrollbar-inner > .scroll-element:hover .scroll-bar,
.scrollbar-inner > .scroll-element.scroll-draggable .scroll-bar{ background-color:var(--ink-soft); }
#sidebar-toggle{ color:var(--ink); }