/* ================================================================
   Carnetia — thème « terminal / parchemin »
   Tokens repris du design system Claude Design (Carnet Hebdo).
   Chargé APRÈS daisyui.min.css : re-style les composants DaisyUI
   utilisés dans les templates, sans réécrire le markup.
   ================================================================ */
@import url("fonts.9a834b2c0b3c.css");

:root {
  --bg:#120C04; --surf1:#1F1709; --surf2:#191106;
  --card-grad:linear-gradient(180deg,#1F1709,#191106);
  --ink:#F0DDB6; --ink2:#cdb892; --muted:#bca680; --body:#ddc9a2;
  --label:#FFB838; --sepia:#9C7C46; --faint:#7A613A;
  --amber:#FFB838; --amber-deep:#B5722A; --cyan:#49C9C0;
  --line:rgba(255,184,56,.16); --line2:rgba(255,184,56,.34); --line-soft:rgba(255,184,56,.1);
  --btn-fill:#FFB838; --btn-ink:#16100a; --btn-hover:#FFD78A;
  --btn-ghost-ink:#FFB838; --btn-ghost-bg:rgba(255,184,56,.04);
  --logo-ink:#F0DDB6; --logo-ia:#FFB838; --term-bg:#0c0802;
  --card-shadow:0 0 30px rgba(255,184,56,.08); --btn-glow:0 0 22px rgba(255,184,56,.4);
  --field-bg:rgba(10,7,2,.55);
  --field-shadow:0 0 0 1px rgba(0,0,0,.4) inset,0 0 40px rgba(255,184,56,.08);
  --h-glow:0 0 30px rgba(255,184,56,.18); --logo-glow:0 0 14px rgba(255,184,56,.45);
  --danger:#E7645A; --success:#7FCf7A;
  --grain-blend:overlay; --grain-op:.05;
}

:root[data-theme="light"] {
  --bg:#ECE3CD; --surf1:#FBF6E9; --surf2:#F5EDD8;
  --card-grad:linear-gradient(180deg,#FBF6E9,#F5EDD8);
  --ink:#241906; --ink2:#5C4A28; --muted:#6B5732; --body:#4A3A1C;
  --label:#C2740E; --sepia:#8A6A2E; --faint:#9A7E48;
  --amber:#E8920C; --amber-deep:#B5722A; --cyan:#1E8A82;
  --line:rgba(160,110,30,.22); --line2:rgba(181,114,42,.4); --line-soft:rgba(160,110,30,.14);
  --btn-fill:#FFB838; --btn-ink:#1c1206; --btn-hover:#E8920C;
  --btn-ghost-ink:#9a5e09; --btn-ghost-bg:rgba(255,184,56,.12);
  --logo-ink:#241906; --logo-ia:#C2740E; --term-bg:#16100A;
  --card-shadow:0 12px 30px rgba(120,85,25,.12); --btn-glow:0 8px 22px rgba(216,134,12,.32);
  --field-bg:rgba(255,251,240,.7); --field-shadow:0 8px 24px rgba(120,85,25,.1);
  --danger:#B4443A; --success:#4E8A47;
  --h-glow:none; --logo-glow:none;
  --grain-blend:multiply; --grain-op:.05;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
[x-cloak] { display: none !important; }
/* Fond racine = fond de l'app (sinon le thème « dark » natif de DaisyUI
   laisse apparaître un bleu-gris en haut/bas de page lors de l'overscroll). */
html, :root { background-color: var(--bg) !important; }

body {
  margin: 0;
  background: var(--bg) !important;
  color: var(--ink);
  font-family: 'Chakra Petch', system-ui, sans-serif;
  font-weight: 300;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  transition: background .35s ease, color .35s ease;
}
a { color: inherit; text-decoration: none; }
::selection { background: #FFB838; color: #1c1206; }

/* --- Atmosphère : grain + scanlines --- */
body::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 60;
  opacity: var(--grain-op); mix-blend-mode: var(--grain-blend);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
:root:not([data-theme="light"]) body::after {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 59; opacity: .4;
  background: repeating-linear-gradient(to bottom, rgba(0,0,0,0) 0 2px, rgba(0,0,0,.16) 2px 3px);
}

/* ================= Surfaces / utilities DaisyUI ================= */
.bg-base-100 { background-color: var(--surf2) !important; }
.bg-base-200 { background-color: var(--bg) !important; }
.bg-base-300 { background-color: var(--surf1) !important; }
.bg-primary  { background: radial-gradient(120% 140% at 50% 0%, rgba(255,184,56,.14), var(--surf1) 70%) !important; }
.text-primary-content { color: var(--ink) !important; }
.text-error { color: var(--danger) !important; }
.opacity-90 { opacity: 1 !important; }
.shadow, .shadow-sm { box-shadow: var(--card-shadow) !important; }

.link, a.link { color: var(--label); }
.link-hover:hover { color: var(--btn-hover); }

/* ================= Cartes ================= */
.card {
  background: var(--card-grad) !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  box-shadow: var(--card-shadow) !important;
}
.card.border-base-300 { border-color: var(--line) !important; }
.card-title { color: var(--ink); font-weight: 600; letter-spacing: -.01em; }
/* Un peu plus d'air dans les cartes ; davantage sur grand écran.
   Sélecteur `.card > .card-body` = spécificité supérieure aux utilitaires p-*. */
.card > .card-body { padding: 1.15rem; gap: .6rem; }
@media (min-width: 1280px) {
  .card > .card-body { padding: 1.5rem; gap: .7rem; }
}

/* Carte « mise en avant » (édition en cours) */
.card.bg-primary { border-color: var(--line2) !important; }
.card.bg-primary .btn { background: var(--btn-fill) !important; color: var(--btn-ink) !important; border: 0 !important; }

/* ================= Boutons ================= */
.btn {
  font-family: 'Share Tech Mono', ui-monospace, monospace !important;
  font-weight: 400 !important;
  letter-spacing: .1em; text-transform: uppercase;
  border-radius: 3px !important;
  border: 1px solid var(--line2) !important;
  background: transparent !important;
  color: var(--ink) !important;
  min-height: 0 !important; height: auto !important;
  padding: 11px 20px !important;   /* padding vertical rendu à la main (height:auto) */
  line-height: 1.1 !important;
  transition: .18s;
}
.btn-sm { padding: 8px 15px !important; font-size: 12px !important; }
.btn-xs { padding: 5px 11px !important; font-size: 11px !important; }
.btn-lg { padding: 15px 26px !important; font-size: 15px !important; }
.btn.btn-block, .btn.w-full { justify-content: center; }
.btn:hover { border-color: var(--line2) !important; box-shadow: var(--btn-glow); }
.btn-primary {
  background: var(--btn-fill) !important; color: var(--btn-ink) !important; border-color: transparent !important;
}
.btn-primary:hover { background: var(--btn-hover) !important; box-shadow: var(--btn-glow); }
.btn-secondary {
  background: var(--btn-ghost-bg) !important; color: var(--label) !important; border-color: var(--line2) !important;
}
.btn-secondary:hover { background: var(--btn-fill) !important; color: var(--btn-ink) !important; box-shadow: var(--btn-glow); }
.btn-outline { background: transparent !important; color: var(--label) !important; border-color: var(--line2) !important; }
.btn-outline:hover { background: var(--btn-fill) !important; color: var(--btn-ink) !important; }
.btn-ghost { border-color: transparent !important; color: var(--sepia) !important; background: transparent !important; }
.btn-ghost:hover { color: var(--label) !important; background: var(--line-soft) !important; box-shadow: none; }
.btn-success, .btn-success.btn-disabled {
  background: rgba(127,207,122,.12) !important; color: var(--success) !important; border-color: rgba(127,207,122,.4) !important;
}
.btn-disabled, .btn[disabled] { opacity: .55; }
.btn-active { background: var(--btn-ghost-bg) !important; color: var(--label) !important; border-color: var(--line2) !important; }

/* ================= Champs ================= */
.input, .textarea, .select {
  background: var(--field-bg) !important;
  color: var(--ink) !important;
  border: 1px solid var(--line2) !important;
  border-radius: 3px !important;
  font-family: 'Chakra Petch', system-ui, sans-serif;
}
.input:focus, .textarea:focus, .select:focus,
.input:focus-within, .textarea:focus-within, .select:focus-within {
  outline: none !important; border-color: var(--amber) !important;
  box-shadow: 0 0 0 1px rgba(0,0,0,.4) inset, 0 0 24px rgba(255,184,56,.12) !important;
}
.input::placeholder, .textarea::placeholder { color: var(--faint); }
/* champs courts « terminaux » en mono */
.input-sm { font-family: 'Share Tech Mono', ui-monospace, monospace; letter-spacing: .02em; }
.select { color: var(--ink) !important; }
.select option { background: var(--surf1); color: var(--ink); }

/* ================= Badges ================= */
.badge {
  font-family: 'Share Tech Mono', ui-monospace, monospace;
  font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
  border-radius: 2px !important;
  border: 1px solid var(--line) !important;
  background: transparent !important; color: var(--sepia) !important;
  padding: 3px 9px; height: auto;
}
.badge-neutral { background: var(--surf1) !important; color: var(--ink2) !important; border-color: var(--line) !important; }
.badge-outline { background: transparent !important; color: var(--sepia) !important; }
.badge-ghost   { background: transparent !important; color: var(--faint) !important; }
.badge-info    { color: var(--cyan) !important; border-color: rgba(73,201,192,.4) !important; }
.badge-success { color: var(--success) !important; border-color: rgba(127,207,122,.4) !important; }
.badge-error   { color: var(--danger) !important; border-color: rgba(231,100,90,.45) !important; }

/* ================= Alertes ================= */
.alert { border-radius: 4px !important; border: 1px solid var(--line2) !important; }
.alert-success { background: rgba(127,207,122,.1) !important; color: var(--success) !important; border-color: rgba(127,207,122,.4) !important; }
.alert-error   { background: rgba(231,100,90,.1) !important; color: var(--danger) !important; border-color: rgba(231,100,90,.45) !important; }

/* ================= Menu / dropdown ================= */
.dropdown-content, .menu {
  background: var(--surf1) !important; border: 1px solid var(--line2) !important; border-radius: 4px !important;
}
.menu li > *:hover { background: var(--line-soft) !important; color: var(--label) !important; }
.menu li > .active { background: var(--btn-ghost-bg) !important; color: var(--label) !important; }

/* ================= Join (segments) ================= */
.join .btn { border-radius: 0 !important; }
.join .join-item:first-child { border-top-left-radius: 3px !important; border-bottom-left-radius: 3px !important; }
.join .join-item:last-child { border-top-right-radius: 3px !important; border-bottom-right-radius: 3px !important; }

/* ================= Table ================= */
.table { color: var(--ink); }
.table th { font-family: 'Share Tech Mono', ui-monospace, monospace; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--sepia); }
.table td, .table th { border-color: var(--line) !important; }
.table tbody tr:hover { background: var(--line-soft) !important; }

/* ================= Spinner ================= */
.loading { color: var(--label); }
/* L'indicateur HTMX ne doit pas réserver d'espace quand il est inactif
   (sinon un « blanc » apparaît à gauche du libellé du bouton). */
.htmx-indicator { display: none !important; }
.htmx-indicator.htmx-request,
.htmx-request .htmx-indicator { display: inline-block !important; margin-right: .4rem; }

/* ================= Prose (aperçu Markdown rendu) ================= */
.prose { color: var(--ink2); line-height: 1.7; }
.prose > :first-child { margin-top: 0; }
.prose h1, .prose h2, .prose h3, .prose h4 {
  color: var(--ink); font-weight: 600; line-height: 1.25;
  margin: 1.4em 0 .5em;
}
.prose h1 { font-size: 1.7em; }
.prose h2 { font-size: 1.35em; }
.prose h3 { font-size: 1.15em; }
.prose p { margin: .8em 0; }
.prose a { color: var(--label); text-decoration: underline; text-underline-offset: 2px; }
.prose strong { color: var(--ink); font-weight: 600; }
.prose em { font-style: italic; }
.prose ul, .prose ol { margin: .8em 0; padding-left: 1.5em; }
.prose ul { list-style: disc; }
.prose ol { list-style: decimal; }
.prose li { margin: .3em 0; }
.prose blockquote {
  border-left: 3px solid var(--line2); margin: 1em 0; padding: .2em 1em;
  color: var(--muted); font-style: italic;
}
.prose code {
  font-family: 'Share Tech Mono', ui-monospace, monospace; font-size: .9em;
  background: var(--surf1); padding: .1em .4em; border-radius: 3px; color: var(--label);
}
.prose pre {
  background: var(--term-bg); border: 1px solid var(--line); border-radius: 5px;
  padding: 1em; overflow-x: auto; margin: 1em 0;
}
.prose pre code { background: none; padding: 0; color: var(--ink2); }
.prose hr { border: none; border-top: 1px solid var(--line); margin: 1.5em 0; }
.prose h1, .prose h2 { padding-bottom: .3em; border-bottom: 1px solid var(--line-soft); }

/* ================= Éléments propres à Carnetia ================= */
.navbar {
  background: transparent !important;
  border-bottom: 1px solid var(--line);
  box-shadow: none !important;
}
.term-label {
  font-family: 'Share Tech Mono', ui-monospace, monospace;
  font-size: 12px; letter-spacing: .18em; text-transform: uppercase; color: var(--label);
}
.term-muted {
  font-family: 'Share Tech Mono', ui-monospace, monospace;
  font-size: 12px; letter-spacing: .06em; color: var(--faint);
}
h1, h2, h3 { font-family: 'Chakra Petch', system-ui, sans-serif; }
.page-title { font-weight: 600; letter-spacing: -.01em; color: var(--ink); text-shadow: var(--h-glow); }

.logo {
  font-family: 'Share Tech Mono', ui-monospace, monospace;
  font-size: 22px; letter-spacing: .04em; color: var(--logo-ink); text-shadow: var(--logo-glow);
}
.logo b { color: var(--amber-deep); font-weight: 400; }
.logo i { color: var(--logo-ia); font-style: normal; }

.nav-link {
  font-family: 'Share Tech Mono', ui-monospace, monospace;
  font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--sepia);
  transition: .18s;
}
.nav-link:hover { color: var(--label); }
.nav-link.active { color: var(--label); }

.theme-toggle {
  display: flex; align-items: center; justify-content: center; width: 38px; height: 38px;
  color: var(--sepia); border: 1px solid var(--line); background: transparent;
  border-radius: 2px; cursor: pointer; transition: .18s;
}
.theme-toggle:hover { color: var(--label); border-color: var(--line2); }

/* petite pastille repère (marqueur d'item, façon liste d'éditions) */
.amber-dot {
  display: inline-block; width: 9px; height: 9px; background: var(--amber);
  box-shadow: 0 0 10px rgba(255,184,56,.7);
}