/*
 * paebiru.css
 * ---------------------------------------------------------------------------
 * Customização tipográfica e visual do mdBook do PAEBIRU.
 *
 * Fonte canônica: Iosevka Nerd Font (variante "Extended") nos pesos
 * 300 (Light) / 400 (Regular) / 500 (Medium), em estilos normal e
 * itálico. Carrega via CDN (jsDelivr) com URLs absolutas — sem hashing
 * local, sem `node_modules`, sem dependência do mdbook reescrever paths.
 *
 * Variante "Extended" preserva a identidade visual original (largura
 * expandida ~1.25×) e os glifos Nerd Font (ícones Powerline, NF Symbols
 * etc.) ficam disponíveis para uso futuro em terminais/UI do mdBook.
 *
 * Textura de fundo: papiro antropofágico (`docs/src/brand/wallpapers/paebiru-papiro.jpg`),
 * servido a partir de `docs/book/brand/wallpapers/`. A folha é copiada
 * para `docs/book/theme/paebiru-<hash>.css`, então o caminho relativo
 * a partir daqui é `../brand/wallpapers/...`.
 *
 * Fallback de soberania: se o jsDelivr estiver inacessível, baixe os TTFs
 * direto do repo upstream (`Iosevka-NerdFont/Iosevka/tree/main/Iosevka`),
 * coloque-os em `docs/theme/fonts/` e troque a URL `src` pelo caminho
 * relativo `url('fonts/IosevkaNerdFont-Extended.ttf')` (e variantes). Os
 * TTFs da Iosevka upstream também estão espelhados em TUNA/NJU via
 * mirror de GitHub-release (apenas para a Iosevka "pura", sem a camada
 * Nerd Font).
 *
 * Variáveis redefinidas:
 *   --mono-font   → Iosevka (também para a UI monoespaçada)
 *   font-family (body) → Iosevka com fallback Open Sans
 * ---------------------------------------------------------------------------
 */

@font-face {
    font-family: "Iosevka";
    font-style: normal;
    font-weight: 300;
    font-stretch: 125%;
    font-display: swap;
    src: url("https://cdn.jsdelivr.net/gh/Iosevka-NerdFont/Iosevka@main/Iosevka/IosevkaNerdFont-ExtendedLight.ttf")
        format("truetype");
}

@font-face {
    font-family: "Iosevka";
    font-style: italic;
    font-weight: 300;
    font-stretch: 125%;
    font-display: swap;
    src: url("https://cdn.jsdelivr.net/gh/Iosevka-NerdFont/Iosevka@main/Iosevka/IosevkaNerdFont-ExtendedLightItalic.ttf")
        format("truetype");
}

@font-face {
    font-family: "Iosevka";
    font-style: normal;
    font-weight: 400;
    font-stretch: 125%;
    font-display: swap;
    src: url("https://cdn.jsdelivr.net/gh/Iosevka-NerdFont/Iosevka@main/Iosevka/IosevkaNerdFont-Extended.ttf")
        format("truetype");
}

@font-face {
    font-family: "Iosevka";
    font-style: italic;
    font-weight: 400;
    font-stretch: 125%;
    font-display: swap;
    src: url("https://cdn.jsdelivr.net/gh/Iosevka-NerdFont/Iosevka@main/Iosevka/IosevkaNerdFont-ExtendedItalic.ttf")
        format("truetype");
}

@font-face {
    font-family: "Iosevka";
    font-style: normal;
    font-weight: 500;
    font-stretch: 125%;
    font-display: swap;
    src: url("https://cdn.jsdelivr.net/gh/Iosevka-NerdFont/Iosevka@main/Iosevka/IosevkaNerdFont-ExtendedMedium.ttf")
        format("truetype");
}

@font-face {
    font-family: "Iosevka";
    font-style: italic;
    font-weight: 500;
    font-stretch: 125%;
    font-display: swap;
    src: url("https://cdn.jsdelivr.net/gh/Iosevka-NerdFont/Iosevka@main/Iosevka/IosevkaNerdFont-ExtendedMediumItalic.ttf")
        format("truetype");
}

:root {
    /* Sobrescreve --mono-font definido em variables.css */
    --mono-font:
        "Iosevka", "Source Code Pro", Consolas, "Ubuntu Mono", Menlo,
        "DejaVu Sans Mono", monospace, monospace;
    --code-font-size: 0.95em; /* Iosevka é mais densa que Source Code Pro */
}

html,
body {
    font-family: "Iosevka", "Open Sans", sans-serif;
    font-weight: 300; /* Light: variante canônica solicitada */
    font-stretch: 125%; /* Extended: largura expandida */
    font-feature-settings:
        "calt" 1,
        "liga" 1,
        "ss01" 1;
    font-variant-ligatures: common-ligatures contextual;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Reforço para código inline e blocos: a família monoespaçada da UI. */
code,
pre,
pre code,
kbd,
samp,
.var,
.typ,
.hl,
.mono {
    font-family: var(--mono-font);
    font-weight: 400;
    font-stretch: 125%;
}

/* Cabeçalhos mantêm peso levemente maior para hierarquia visual. */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Iosevka", "Open Sans", sans-serif;
    font-weight: 500;
    font-stretch: 125%;
    letter-spacing: 0.01em;
}

/* Papiro PAEBIRU — textura antropofágica de fundo
   -----------------------------------------------------------------------
   A imagem é aplicada em <body> com `background-attachment: fixed` para
   que a textura não role com o scroll, e `background-size` 720 px para
   gerar um mosaico discreto. As áreas opacas do tema (sidebar, menu-bar,
   .page/.content) são tornadas semi-transparentes via rgba() — isto
   preserva a hierarquia visual do mdBook enquanto deixa a textura
   transparecer, com sobreposição de cor mais clara nos temas light
   (rust, light) e mais escura nos dark (navy, coal, ayu).

   Soberania por design: a textura é servida localmente pelo GitHub
   Pages, sem dependência de CDN externo. */
html {
    background-color: var(--bg, #ffffff);
    background-image: url("../brand/wallpapers/paebiru-papiro.jpg");
    background-repeat: repeat;
    background-attachment: fixed;
    background-size: 720px auto;
    background-position: top center;
}

nav#mdbook-sidebar {
    background-color: rgba(255, 255, 255, 0.88) !important;
    backdrop-filter: blur(2px);
}

#mdbook-menu-bar {
    background-color: rgba(255, 255, 255, 0.5) !important;
    backdrop-filter: blur(2px);
    border: None;
}

.menu-title {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    line-height: 1;
}

.menu-version small {
    font-size: 0.4em;
    font-weight: 300;
    opacity: 0.75;
    display: block;
}

/* Camada semi-transparente sobre a área de conteúdo — light themes. */
.page,
.content,
main {
    background-color: rgba(255, 255, 255, 0.78) !important;
    backdrop-filter: blur(1.5px);
}

/* Dark themes — overlay mais carregado para preservar contraste do texto. */
html.coal,
html.navy,
html.ayu {
    background-color: var(--bg, #1a1c22);
}

html.coal nav#mdbook-sidebar,
html.coal #mdbook-menu-bar,
html.navy nav#mdbook-sidebar,
html.navy #mdbook-menu-bar,
html.ayu nav#mdbook-sidebar,
html.ayu #mdbook-menu-bar {
    background-color: rgba(26, 28, 34, 0.82) !important;
}

html.coal .page,
html.coal .content,
html.coal main,
html.navy .page,
html.navy .content,
html.navy main,
html.ayu .page,
html.ayu .content,
html.ayu main {
    background-color: rgba(26, 28, 34, 0.78) !important;
}

/* Defesa em profundidade: mesmo com `no-section-label = true` em
   book.toml, o mdBook continua emitindo o elemento `<strong
   aria-hidden="true">N.</strong>` no DOM da sidebar. Escondemos o
   strong e zeramos o margin-right que o tema padrão reserva entre o
   número e o título (caso contrário sobra um espaço em branco
   estranho à esquerda do título).

   Não afeta o "On this page" (TOC in-page) nem a numeração de seções
   dentro do corpo do documento — só a lista de capítulos. */
.chapter li.chapter-item a strong[aria-hidden="true"] {
    display: none;
}

/* Fallback para Safari e Firefox antigos sem `backdrop-filter`. */
@supports not (backdrop-filter: blur(2px)) {
    nav#mdbook-sidebar,
    #mdbook-menu-bar,
    .page,
    .content,
    main {
        backdrop-filter: none;
    }
    nav#mdbook-sidebar {
        background-color: rgba(255, 255, 255, 0.85) !important;
    }
    #mdbook-menu-bar {
        background-color: rgba(255, 255, 255, 0.95) !important;
    }
    .page,
    .content,
    main {
        background-color: rgba(255, 255, 255, 0.9) !important;
    }
    html.coal nav#mdbook-sidebar,
    html.coal #mdbook-menu-bar,
    html.navy nav#mdbook-sidebar,
    html.navy #mdbook-menu-bar,
    html.ayu nav#mdbook-sidebar,
    html.ayu #mdbook-menu-bar {
        background-color: rgba(26, 28, 34, 0.92) !important;
    }
    html.coal .page,
    html.coal .content,
    html.coal main,
    html.navy .page,
    html.navy .content,
    html.navy main,
    html.ayu .page,
    html.ayu .content,
    html.ayu main {
        background-color: rgba(26, 28, 34, 0.9) !important;
    }
}