/* ==========================================================================
   Typewriter Minimalist Theme for Zensical (wiki.andypanix.com)
   Due varianti, stessa identità:
   - chiaro  ("carta"):         carta avorio, inchiostro nero, nastro rosso
   - scuro   ("carta carbone"): carbone caldo, inchiostro avorio, nastro rosso tenue
   I selettori combinano scheme + primary=custom per avere specificità
   superiore ai default di palette.css (che il body sovrascrive su :root).
   ========================================================================== */

:root {
  --font-typewriter: "JetBrains Mono", monospace;
  --font-serif: "Newsreader", "Charter", "Lora", serif;
}

/* ---------- Tema chiaro: carta ---------- */
[data-md-color-scheme="default"][data-md-color-primary="custom"] {
  --tw-paper: #f8f5ee;
  --tw-paper-2: #f0ebdf;   /* superfici rialzate: codice, hover */
  --tw-ink: #1f1d1a;
  --tw-ink-soft: #57534b;
  --tw-ink-faint: #8a8579;
  --tw-rule: #e2dccd;
  --tw-ribbon: #a3302a;    /* rosso nastro macchina da scrivere */

  --md-default-bg-color: var(--tw-paper);
  --md-default-bg-color--light: rgba(248, 245, 238, 0.7);
  --md-default-bg-color--lighter: rgba(248, 245, 238, 0.3);
  --md-default-bg-color--lightest: rgba(248, 245, 238, 0.12);
  --md-default-fg-color: var(--tw-ink);
  --md-default-fg-color--light: var(--tw-ink-soft);
  --md-default-fg-color--lighter: var(--tw-ink-faint);
  --md-default-fg-color--lightest: rgba(31, 29, 26, 0.08);
  --md-typeset-color: var(--tw-ink);
  --md-typeset-a-color: var(--tw-ink);
  --md-code-bg-color: var(--tw-paper-2);
  --md-code-fg-color: #2a2824;
  --md-typeset-mark-color: rgba(163, 48, 42, 0.14);
  --md-typeset-table-color: var(--tw-rule);
}

/* ---------- Tema scuro: carta carbone ---------- */
[data-md-color-scheme="slate"][data-md-color-primary="custom"] {
  --tw-paper: #1a1917;
  --tw-paper-2: #24221f;
  --tw-ink: #e8e3d6;
  --tw-ink-soft: #aaa497;
  --tw-ink-faint: #7a7569;
  --tw-rule: #33302b;
  --tw-ribbon: #e07a6e;

  --md-default-bg-color: var(--tw-paper);
  --md-default-bg-color--light: rgba(26, 25, 23, 0.7);
  --md-default-bg-color--lighter: rgba(26, 25, 23, 0.3);
  --md-default-bg-color--lightest: rgba(26, 25, 23, 0.12);
  --md-default-fg-color: var(--tw-ink);
  --md-default-fg-color--light: var(--tw-ink-soft);
  --md-default-fg-color--lighter: var(--tw-ink-faint);
  --md-default-fg-color--lightest: rgba(232, 227, 214, 0.08);
  --md-typeset-color: var(--tw-ink);
  --md-typeset-a-color: var(--tw-ink);
  --md-code-bg-color: var(--tw-paper-2);
  --md-code-fg-color: #ddd7c8;
  --md-typeset-mark-color: rgba(224, 122, 110, 0.22);
  --md-typeset-table-color: var(--tw-rule);
}

/* ---------- Variabili comuni a entrambi i temi ---------- */
[data-md-color-primary="custom"] {
  --md-primary-fg-color: var(--tw-paper);        /* sfondo header */
  --md-primary-fg-color--light: var(--tw-paper-2);
  --md-primary-fg-color--dark: var(--tw-paper);
  --md-primary-bg-color: var(--tw-ink);          /* testo header */
  --md-primary-bg-color--light: var(--tw-ink-soft);
  --md-accent-fg-color: var(--tw-ribbon);        /* hover link, focus */
  --md-accent-fg-color--transparent: color-mix(in srgb, var(--tw-ribbon) 10%, transparent);
  --md-accent-bg-color: var(--tw-paper);
  --md-footer-bg-color: var(--tw-paper);
  --md-footer-bg-color--dark: var(--tw-paper);
  --md-footer-fg-color: var(--tw-ink-soft);
  --md-footer-fg-color--light: var(--tw-ink-faint);
  --md-border-color: var(--tw-rule);
}

/* Header e footer "su carta": nessuna barra colorata, solo una riga */
.md-header,
.md-footer,
.md-footer-meta {
  background-color: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
}
.md-header {
  box-shadow: none;
  border-bottom: 1px solid var(--md-border-color);
}

/* Titoli in inchiostro (palette.css li forza a bianco nel tema scuro) */
[data-md-color-primary="custom"] .md-header__title,
[data-md-color-primary="custom"] .md-typeset h1,
[data-md-color-primary="custom"] .md-typeset h2,
[data-md-color-primary="custom"] .md-typeset h3,
[data-md-color-primary="custom"] .md-typeset h4,
[data-md-color-primary="custom"] .md-typeset h5,
[data-md-color-primary="custom"] .md-typeset h6 {
  color: var(--md-default-fg-color);
}

/* Link: inchiostro sottolineato, nastro rosso al passaggio */
.md-typeset a {
  text-decoration: underline;
  text-decoration-color: var(--md-border-color);
  text-underline-offset: 0.18em;
  transition: color 0.15s, text-decoration-color 0.15s;
}
.md-typeset a:hover,
.md-typeset a:focus {
  color: var(--md-accent-fg-color);
  text-decoration-color: currentColor;
}

/* Navigazione laterale: voce attiva in inchiostro pieno, niente tinta blu */
.md-nav__link--active,
.md-nav__item .md-nav__link--active {
  color: var(--md-default-fg-color);
  font-weight: 700;
  background-color: var(--md-code-bg-color);
}
.md-nav__link:hover,
.md-nav__link:focus {
  color: var(--md-accent-fg-color);
}

/* Campo di ricerca e toggle del tema in tinta carta */
.md-search__form {
  background-color: var(--md-code-bg-color);
}
.md-header__option .md-icon,
.md-header__button.md-icon {
  color: var(--md-default-fg-color);
}

::selection {
  background-color: var(--md-typeset-mark-color);
}

/* Tipografia Principale.
   max-width su .md-content__inner (non su .md-typeset) per non annullare
   i margini laterali di Zensical: su mobile il testo toccava i bordi. */
.md-content__inner {
  max-width: 700px;
}

.md-typeset {
  font-family: var(--font-serif);
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--md-default-fg-color);
}

/* Intestazioni e Metadati in Monospace Typewriter */
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-header,
.md-nav,
.md-footer {
  font-family: var(--font-typewriter);
  letter-spacing: -0.02em;
}

.md-typeset h1 {
  font-size: 1.85rem;
  font-weight: 600;
  border-bottom: 1px solid var(--md-border-color);
  padding-bottom: 0.4rem;
  margin-top: 1.2rem;
}

/* 4-Level Breadcrumb Styling */
.md-path {
  font-family: var(--font-typewriter);
  font-size: 0.8rem;
  color: var(--md-default-fg-color--light);
  margin-bottom: 1.2rem;
}

/* Homepage 7-Card Grid */
.wiki-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.25rem;
  margin-top: 2rem;
}

.wiki-card {
  display: block;
  padding: 1.25rem 1.4rem;
  background: var(--md-default-bg-color);
  border: 1px solid var(--md-border-color);
  border-radius: 3px;
  text-decoration: none !important;
  transition: border-color 0.2s, transform 0.15s;
}

.wiki-card:hover {
  border-color: var(--md-default-fg-color);
  transform: translateY(-2px);
}

.wiki-card__title {
  font-family: var(--font-typewriter);
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 0.35rem;
  color: var(--md-default-fg-color);
}

.wiki-card__desc {
  font-size: 0.9rem;
  color: var(--md-default-fg-color--light);
  line-height: 1.45;
  margin-bottom: 0.75rem;
}

.wiki-card__meta {
  font-family: var(--font-typewriter);
  font-size: 0.75rem;
  color: var(--md-default-fg-color--light);
}

/* Footnotes e Badge di Provenienza */
.footnote {
  border-top: 1px solid var(--md-border-color);
  margin-top: 3rem;
  padding-top: 1.2rem;
  font-size: 0.88rem;
  color: var(--md-default-fg-color--light);
}