/* ===========================================================
   TORTE DELLE NONNE — tema "quaderno di famiglia"
   Palette: crema, cotto, verde salvia, oro antico
=========================================================== */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,600;0,700;1,600&family=Caveat:wght@600;700&family=Nunito:wght@400;600;700;800&display=swap');

:root{
  --crema:      #fbf3e6;
  --crema-2:    #f4e6cf;
  --carta:      #fffaf1;
  --cotto:      #b5502f;
  --cotto-dark: #8c3c22;
  --salvia:     #6f8a5e;
  --salvia-dark:#4f6642;
  --oro:        #c9942e;
  --testo:      #3f3226;
  --testo-lieve:#7a6a58;
  --bordo:      #e4d2ab;
  --ombra:      0 10px 30px rgba(90,60,20,.12);
  --radius:     18px;
  font-size: 16px;
}

*{box-sizing:border-box}
body{
  margin:0;
  font-family:'Nunito',sans-serif;
  color:var(--testo);
  background:var(--crema)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60'%3E%3Ccircle cx='2' cy='2' r='1' fill='%23e4d2ab' opacity='.5'/%3E%3C/svg%3E");
  line-height:1.6;
}
h1,h2,h3,.font-script{font-family:'Playfair Display',serif}
.script{font-family:'Caveat',cursive}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:1180px;margin:0 auto;padding:0 20px}

/* NOTA: lo stile di HEADER (banner, navbar, riga azioni), FOOTER e del
   pulsante "librone-bar" ora vive inline dentro cassetto/header.php e
   cassetto/footer.php (non più qui), apposta per evitare disallineamenti
   quando questo file e i due .php vengono caricati/aggiornati in momenti
   diversi. Se in futuro vuoi spostarlo di nuovo qui, ricordati di
   rimuovere i blocchi <style> corrispondenti da header.php/footer.php. */

/* ── Hero ──────────────────────────────────────────────── */
.hero{
  text-align:center;padding:54px 20px 30px;position:relative;
}
.hero h2{font-size:2.6rem;margin:0 0 8px;color:var(--cotto-dark)}
.hero .script{font-size:2rem;color:var(--salvia-dark);display:block;margin-top:-6px}
.hero p{max-width:640px;margin:14px auto 0;color:var(--testo-lieve);font-size:1.05rem}

/* ── Filtri (categoria / ingrediente / anno / ricerca) ───── */
.filtri{
  background:var(--carta);border:1px solid var(--bordo);border-radius:var(--radius);
  padding:22px;margin:30px 0;box-shadow:var(--ombra);
}
.filtri form{display:grid;grid-template-columns:2fr 1fr 1fr 1fr auto;gap:12px;align-items:end}
.filtri label{display:block;font-size:.78rem;font-weight:800;color:var(--cotto-dark);text-transform:uppercase;letter-spacing:.4px;margin-bottom:5px}
.filtri select,.filtri input[type=text]{
  width:100%;padding:10px 12px;border-radius:10px;border:1.5px solid var(--bordo);
  background:#fff;font-family:inherit;font-size:.95rem;
}
.filtri button{
  padding:11px 20px;border:0;border-radius:10px;background:var(--cotto);color:#fff;font-weight:800;
  cursor:pointer;box-shadow:0 4px 0 var(--cotto-dark);
}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.chip{
  padding:5px 13px;border-radius:999px;background:var(--crema-2);border:1px solid var(--bordo);
  font-size:.82rem;font-weight:700;color:var(--cotto-dark);display:inline-flex;gap:6px;align-items:center;
}
.chip a{color:var(--cotto)}

@media(max-width:900px){.filtri form{grid-template-columns:1fr 1fr}}

/* ── Griglia ricette ──────────────────────────────────────── */
.grid-torte{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:26px;margin:30px 0 50px}
.card-torta{
  background:var(--carta);border-radius:var(--radius);overflow:hidden;border:1px solid var(--bordo);
  box-shadow:var(--ombra);transition:transform .25s, box-shadow .25s;position:relative;
}
.card-torta:hover{transform:translateY(-6px);box-shadow:0 18px 34px rgba(90,60,20,.18)}
.card-torta .thumb{aspect-ratio:4/3;background:var(--crema-2) center/cover no-repeat;position:relative}
.card-torta .thumb .badge-anno{
  position:absolute;top:10px;right:10px;background:rgba(63,50,38,.78);color:#fff;
  font-size:.72rem;font-weight:800;padding:4px 10px;border-radius:999px;
}
.card-torta .badge-cat{
  position:absolute;top:10px;left:10px;background:var(--salvia);color:#fff;
  font-size:.72rem;font-weight:800;padding:4px 10px;border-radius:999px;
}
.card-torta .body{padding:16px 18px 20px}
.card-torta h3{margin:0 0 6px;font-size:1.22rem;color:var(--cotto-dark);line-height:1.25}
.card-torta .nonna{font-size:.85rem;color:var(--salvia-dark);font-weight:700;margin-bottom:8px}
.card-torta p{margin:0;font-size:.88rem;color:var(--testo-lieve)}
.card-torta .meta{display:flex;gap:12px;margin-top:12px;font-size:.78rem;color:var(--testo-lieve)}

/* ── Ricetta singola ──────────────────────────────────────── */
.torta-hero{
  border-radius:var(--radius);overflow:hidden;box-shadow:var(--ombra);position:relative;
  aspect-ratio:16/7;background:var(--crema-2) center/cover no-repeat;margin:20px 0;
  border:4px solid var(--cotto-dark);box-sizing:border-box;
}

/* Altre foto caricate in galleria (oltre alla copertina), mostrate tutte */
.galleria-extra{margin:18px 0 0}
.galleria-extra-foto{display:flex;flex-wrap:wrap;gap:12px}
.foto-extra{
  width:130px;height:170px;object-fit:cover;display:block;
  border:4px solid var(--cotto-dark);border-radius:8px;box-shadow:var(--ombra);
}

/* Foto del manoscritto/testo originale: mostrate tutte insieme alla foto della ricetta */
.galleria-manoscritto{margin:18px 0 26px}
.galleria-manoscritto-titolo{color:var(--cotto-dark);font-size:1rem;margin:0 0 10px}
.galleria-manoscritto-foto{display:flex;flex-wrap:wrap;gap:12px}
.foto-manoscritto{
  width:130px;height:170px;object-fit:cover;display:block;
  border:4px solid var(--cotto-dark);border-radius:8px;box-shadow:var(--ombra);
}
.torta-header{margin-top:26px}
.torta-header .badges{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.torta-header h1{font-size:2.3rem;color:var(--cotto-dark);margin:0 0 6px}
.torta-header .sottotitolo{font-family:'Caveat',cursive;font-size:1.5rem;color:var(--salvia-dark)}
.aneddoto{
  background:linear-gradient(135deg,#fff8ea,#f8ecd2);border-left:5px solid var(--oro);
  border-radius:0 14px 14px 0;padding:18px 22px;margin:22px 0;font-style:italic;color:#5b4626;
  position:relative;
}
.aneddoto::before{content:'“';font-family:'Playfair Display',serif;font-size:3.2rem;color:var(--oro);
  position:absolute;top:-6px;left:10px;opacity:.5}
.aneddoto p{margin:0;padding-left:26px}

.info-strip{display:flex;flex-wrap:wrap;gap:14px;margin:20px 0}
.info-pill{background:var(--carta);border:1px solid var(--bordo);border-radius:12px;padding:10px 16px;text-align:center;min-width:92px}
.info-pill .val{font-weight:800;color:var(--cotto-dark);font-size:1.05rem}
.info-pill .lbl{font-size:.72rem;color:var(--testo-lieve);text-transform:uppercase}

.torta-corpo{display:grid;grid-template-columns:340px 1fr;gap:40px;margin:30px 0 60px}
@media(max-width:820px){.torta-corpo{grid-template-columns:1fr}}
.box-ingredienti{
  background:var(--carta);border:1px solid var(--bordo);border-radius:var(--radius);padding:22px;
  box-shadow:var(--ombra);height:fit-content;position:sticky;top:20px;
}
.box-ingredienti h3{margin-top:0;color:var(--cotto-dark)}
.box-ingredienti ul{list-style:none;margin:0;padding:0}
.box-ingredienti li{
  display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px dashed var(--bordo);font-size:.95rem;
}
.box-ingredienti li span.q{font-weight:700;color:var(--salvia-dark);text-align:right;max-width:56%;flex-shrink:0}
.riga-intestazione-lista{list-style:none;margin:14px -4px 6px;padding-bottom:4px;font-weight:800;color:var(--cotto-dark);border-bottom:1px dashed var(--bordo)}
.riga-intestazione-lista:first-child{margin-top:0}
.passo-intestazione{list-style:none;margin:20px 0 10px 58px;font-weight:700;font-size:.95rem;letter-spacing:.02em;text-transform:uppercase;color:var(--salvia-dark);border-bottom:1px solid var(--bordo);padding-bottom:5px}
.passo-intestazione:first-child{margin-top:0}

.passi{list-style:none;margin:0;padding:0;counter-reset:passo}
.passo{list-style:disc;margin:0 0 26px 20px;padding-left:2px}
.passo::marker{color:var(--cotto);font-size:1.1em}
.passo h4{margin:2px 0 6px;color:var(--cotto-dark)}
.passo img{border:4px solid var(--cotto-dark);border-radius:12px;margin-top:10px;box-shadow:var(--ombra)}

/* ── Layout "narrativo" (ricette da manoscritto senza lista ingredienti) ── */
.racconto-ricetta{
  background:var(--carta);border:1px solid var(--bordo);border-radius:var(--radius);
  padding:30px 34px;margin:26px 0 50px;box-shadow:var(--ombra);
}
.racconto-testo{
  font-size:1.05rem;line-height:1.9;color:var(--testo);
  font-family:'Playfair Display',serif;white-space:pre-wrap;
}
.racconto-testo::first-letter{font-size:2.6rem;font-weight:700;color:var(--cotto);float:left;line-height:1;margin-right:8px;margin-top:4px}

.azioni-torta{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0}
.btn{
  display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:999px;font-weight:800;
  border:0;cursor:pointer;font-size:.9rem;font-family:inherit;
}
.btn-primario{background:var(--cotto);color:#fff;box-shadow:0 4px 0 var(--cotto-dark)}
.btn-secondario{background:var(--salvia);color:#fff;box-shadow:0 4px 0 var(--salvia-dark)}
.btn-outline{background:#fff;color:var(--cotto-dark);border:2px solid var(--cotto)}
.btn:hover{filter:brightness(1.05);transform:translateY(1px)}

/* ── Form (invio ricetta / login) ─────────────────────────── */
.form-card{background:var(--carta);border:1px solid var(--bordo);border-radius:var(--radius);padding:34px;box-shadow:var(--ombra);max-width:820px;margin:30px auto}
.form-card h2{color:var(--cotto-dark);margin-top:0}
.campo{margin-bottom:18px}
.campo label{display:block;font-weight:800;font-size:.85rem;color:var(--cotto-dark);margin-bottom:6px}
.campo input,.campo select,.campo textarea{
  width:100%;padding:11px 13px;border-radius:10px;border:1.5px solid var(--bordo);font-family:inherit;font-size:.96rem;background:#fff;
}
.campo textarea{resize:vertical;min-height:90px}
.griglia-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:640px){.griglia-2{grid-template-columns:1fr}}
.riga-dinamica{display:flex;gap:8px;margin-bottom:8px}
.riga-dinamica input{flex:1}
.riga-dinamica button{background:#e7d3d3;border:0;border-radius:8px;padding:0 12px;cursor:pointer;color:#8a2f2f;font-weight:800}
.btn-aggiungi{background:var(--crema-2);border:1px dashed var(--oro);border-radius:10px;padding:9px 14px;font-weight:700;cursor:pointer;color:var(--cotto-dark)}

.alert{padding:14px 18px;border-radius:12px;margin-bottom:18px;font-weight:600}
.alert-ok{background:#e6f2df;color:#3c5c2c;border:1px solid #b9d6a5}
.alert-err{background:#fbe4e0;color:#8c3223;border:1px solid #eab3a6}

/* ── Sezioni "raggruppa per" homepage ─────────────────────── */
.gruppi{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:24px 0 40px}
.gruppo-card{
  background:var(--carta);border:1px solid var(--bordo);border-radius:14px;padding:18px;text-align:center;
  box-shadow:var(--ombra);font-weight:800;color:var(--cotto-dark);transition:.2s;
}
.gruppo-card:hover{background:var(--oro);color:#402a05}
.gruppo-card .emoji{font-size:1.8rem;display:block;margin-bottom:6px}
.gruppo-card small{display:block;font-weight:600;color:var(--testo-lieve);margin-top:4px}

.section-title{display:flex;align-items:center;gap:14px;margin:44px 0 6px}
.section-title h2{margin:0;color:var(--cotto-dark)}
.section-title::after{content:'';flex:1;height:2px;background:repeating-linear-gradient(90deg,var(--bordo) 0 8px, transparent 8px 16px)}

.pagina-torte{display:flex;justify-content:center;gap:8px;margin:20px 0 50px}
.pagina-torte a,.pagina-torte span{padding:9px 15px;border-radius:10px;background:var(--carta);border:1px solid var(--bordo);font-weight:700}
.pagina-torte a.attiva{background:var(--cotto);color:#fff}

/* ── Tabelle semplici (usate anche in profilo.php) ────────────────────── */
table.admin-table{width:100%;border-collapse:collapse;background:var(--carta);border-radius:12px;overflow:hidden;box-shadow:var(--ombra);margin:16px 0}
table.admin-table th,table.admin-table td{padding:11px 14px;border-bottom:1px solid var(--bordo);text-align:left;font-size:.9rem}
table.admin-table th{background:var(--crema-2);color:var(--cotto-dark)}
.badge-status{padding:3px 10px;border-radius:999px;font-size:.75rem;font-weight:800}
.badge-pending{background:#fdeccb;color:#8a5a00}
.badge-published{background:#dcf0d1;color:#2e5c22}
.badge-draft{background:#eee;color:#555}
