
:root{
  --ow-pri:#16687c;
  --ow-ink:#0f172a;
  --ow-muted:#64748b;
  --ow-bg:#f6f8fb;
  --ow-card:#ffffff;
  --ow-border:#e5e7eb;
  --ow-radius:16px;
  --ow-shadow:0 14px 40px rgba(2,8,23,.10);
}

/* Background */
body{
  background: var(--ow-bg);
  color: var(--ow-ink);
}

/* Sidebar */
.sidebar{
  border-right: 1px solid var(--ow-border);
  background: #fff;
}
.sidebar .app-name-link{
  font-weight: 800;
  letter-spacing: .2px;
}
.sidebar .app-name-link img{
  height: 26px;
  vertical-align: middle;
  margin-right: .5rem;
}

/* Top navbar */
.app-nav{
  border-bottom: 1px solid var(--ow-border);
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(8px);
}
.app-nav a{
  font-weight: 700;
}

/* Links & accents */
.markdown-section a{
  color: var(--ow-pri);
  font-weight: 650;
}
.markdown-section a:hover{ text-decoration: underline; }

/* Headings */
.markdown-section h1,
.markdown-section h2,
.markdown-section h3{
  letter-spacing: -0.02em;
}

/* Content container "card" feel */
.content{
  padding-top: 1.2rem;
}
.markdown-section{
  max-width: 980px;
  padding: 2rem 2.2rem;
  background: var(--ow-card);
  border: 1px solid var(--ow-border);
  border-radius: var(--ow-radius);
  box-shadow: var(--ow-shadow);
}

/* Cover page */
section.cover{
  background:
    radial-gradient(1200px 600px at 20% 20%, rgba(22,104,124,.18), transparent 60%),
    radial-gradient(900px 500px at 80% 0%, rgba(22,104,124,.10), transparent 55%),
    linear-gradient(180deg, #ffffff, #f6f8fb);
}
section.cover .cover-main>p:last-child a{
  border-radius: 999px;
  border: 1px solid rgba(22,104,124,.25);
  background: var(--ow-pri);
  color: #fff !important;
  font-weight: 800;
}
section.cover .cover-main>p:last-child a:last-child{
  background: #fff;
  color: var(--ow-pri) !important;
}

/* Code */
pre, code{
  border-radius: 12px;
}
pre{
  border: 1px solid var(--ow-border);
}

/* Blockquotes */
.markdown-section blockquote{
  border-left: 4px solid var(--ow-pri);
  background: rgba(22,104,124,.06);
  border-radius: 12px;
}

/* Mobile */
@media (max-width: 768px){
  .markdown-section{
    padding: 1.4rem 1.2rem;
    border-radius: 14px;
  }
}
/* Sidebar: amélioration du rendu des <details> */
.sidebar details {
  margin: .35rem 0 .6rem;
  padding: .25rem .5rem;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.03);
}

.sidebar details[open] {
  background: rgba(15, 23, 42, 0.05);
}

.sidebar details > summary {
  cursor: pointer;
  list-style: none;
  font-weight: 700;
  font-size: 14px;
  padding: .35rem .4rem;
  border-radius: 10px;
  display: flex;
  align-items: center;
  gap: .45rem;
  user-select: none;
}

.sidebar details > summary::-webkit-details-marker { display: none; }

.sidebar details > summary::before {
  content: "▸";
  font-size: 14px;
  opacity: .7;
  transition: transform .15s ease;
  display: inline-block;
}

.sidebar details[open] > summary::before {
  transform: rotate(90deg);
}

.sidebar details ul {
  margin: .35rem 0 .25rem .9rem !important;
  padding-left: .55rem !important;
  border-left: 1px solid rgba(15, 23, 42, 0.12);
}

.sidebar details li a {
  font-size: 13px;
  padding: .2rem 0 !important;
  display: inline-block;
  opacity: .92;
}

.sidebar details li a:hover { opacity: 1; }

/* Active link : plus visible */
.sidebar ul li.active > a {
  font-weight: 700;
}
