/* ── Reset & Base ─────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #f5f5f5; color: #333; line-height: 1.6; }
a { color: #667eea; text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; }

/* ── Header ───────────────────────────────────────────────────────────── */
.site-header { background: linear-gradient(135deg,#667eea 0%,#764ba2 100%); color: #fff; padding: 0 20px; box-shadow: 0 2px 8px rgba(0,0,0,.15); }
.site-header__inner { max-width: 1200px; margin: auto; display: flex; align-items: center; justify-content: space-between; height: 60px; flex-wrap: wrap; gap: 10px; }
.site-logo { color: #fff; font-size: 1.4rem; font-weight: 700; text-decoration: none; }
.site-nav { display: flex; gap: 16px; flex-wrap: wrap; }
.site-nav a { color: rgba(255,255,255,.9); font-size: .9rem; text-decoration: none; padding: 4px 0; border-bottom: 2px solid transparent; transition: border-color .2s; }
.site-nav a:hover { border-bottom-color: #fff; text-decoration: none; }

/* ── Main ─────────────────────────────────────────────────────────────── */
.site-main { max-width: 1200px; margin: 30px auto; padding: 0 20px; }

/* ── Footer ───────────────────────────────────────────────────────────── */
.site-footer { text-align: center; padding: 30px 20px; background: #fff; color: #888; font-size: .85rem; margin-top: 60px; border-top: 1px solid #eee; }

/* ── Grid ricette ─────────────────────────────────────────────────────── */
.ricette-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 24px; margin-top: 24px; }
.ricetta-card { background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.08); transition: transform .25s, box-shadow .25s; }
.ricetta-card:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.ricetta-card__img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.ricetta-card__img-placeholder { width: 100%; aspect-ratio: 16/9; background: linear-gradient(135deg,#e8eaf6,#c5cae9); display: flex; align-items: center; justify-content: center; font-size: 3rem; }
.ricetta-card__body { padding: 16px; }
.ricetta-card__title { font-size: 1.1rem; font-weight: 700; margin-bottom: 8px; color: #222; }
.ricetta-card__meta { font-size: .82rem; color: #777; display: flex; gap: 12px; flex-wrap: wrap; }
.ricetta-card__badge { background: #f0f4ff; color: #5c6bc0; padding: 2px 8px; border-radius: 20px; font-size: .78rem; }

/* ── Badge stato ───────────────────────────────────────────────────────── */
.badge-pending   { background: #fff3cd; color: #856404; padding: 2px 8px; border-radius: 20px; font-size: .78rem; }
.badge-published { background: #d4edda; color: #155724; padding: 2px 8px; border-radius: 20px; font-size: .78rem; }
.badge-draft     { background: #e2e3e5; color: #383d41; padding: 2px 8px; border-radius: 20px; font-size: .78rem; }

/* ── Pagina ricetta singola ────────────────────────────────────────────── */
.ricetta-single { max-width: 860px; margin: auto; }
.ricetta-single h1 { font-size: 2rem; margin-bottom: 20px; color: #222; }

/* ── Form login/registrazione ─────────────────────────────────────────── */
.auth-form { max-width: 440px; margin: 60px auto; background: #fff; padding: 36px; border-radius: 14px; box-shadow: 0 4px 20px rgba(0,0,0,.1); }
.auth-form h2 { margin-bottom: 24px; color: #667eea; }
.form-row { margin-bottom: 18px; }
.form-row label { display: block; font-weight: 600; margin-bottom: 6px; color: #444; font-size: .9rem; }
.form-row input, .form-row select, .form-row textarea {
    width: 100%; padding: 10px 12px; border: 2px solid #e0e0e0; border-radius: 8px;
    font-size: .95rem; transition: border-color .2s;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus { outline: none; border-color: #667eea; }
.btn { display: inline-block; padding: 11px 26px; border: none; border-radius: 8px; font-size: 1rem; font-weight: 600; cursor: pointer; transition: all .2s; text-decoration: none; }
.btn-primary { background: linear-gradient(135deg,#667eea 0%,#764ba2 100%); color: #fff; width: 100%; text-align: center; }
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 4px 16px rgba(102,126,234,.4); text-decoration: none; }
.btn-secondary { background: #6c757d; color: #fff; }
.btn-success  { background: #28a745; color: #fff; }
.btn-danger   { background: #dc3545; color: #fff; }
.btn-sm { padding: 6px 14px; font-size: .85rem; }

/* ── Alert messages ────────────────────────────────────────────────────── */
.alert { padding: 12px 16px; border-radius: 8px; margin-bottom: 16px; font-size: .93rem; }
.alert-success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.alert-error   { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
.alert-warning { background: #fff3cd; color: #856404; border: 1px solid #ffeeba; }
.alert-info    { background: #d1ecf1; color: #0c5460; border: 1px solid #bee5eb; }

/* ── Lightbox (del render ricetta) ────────────────────────────────────── */
.ricetta-icg-lightbox-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.85); z-index:9999; justify-content:center; align-items:center; }
.ricetta-icg-lightbox-overlay.active { display:flex; }
.ricetta-icg-lightbox-close { position:absolute; top:20px; right:30px; color:#fff; font-size:2.5rem; cursor:pointer; line-height:1; }
.ricetta-icg-lightbox-content { display:flex; align-items:center; justify-content:center; }

/* ── Paginazione ────────────────────────────────────────────────────────── */
.pagination { display:flex; gap:8px; justify-content:center; margin-top:32px; flex-wrap:wrap; }
.pagination a, .pagination span { padding:8px 14px; border:1px solid #ddd; border-radius:6px; color:#667eea; background:#fff; font-size:.9rem; }
.pagination .current { background:#667eea; color:#fff; border-color:#667eea; }
.pagination a:hover { background:#f0f4ff; text-decoration:none; }

/* ── Admin panel ─────────────────────────────────────────────────────────── */
.admin-table { width:100%; border-collapse:collapse; background:#fff; border-radius:10px; overflow:hidden; box-shadow:0 2px 8px rgba(0,0,0,.06); }
.admin-table th { background:#667eea; color:#fff; padding:12px 16px; text-align:left; font-size:.88rem; }
.admin-table td { padding:12px 16px; border-bottom:1px solid #f0f0f0; font-size:.9rem; vertical-align:middle; }
.admin-table tr:last-child td { border-bottom:none; }
.admin-table tr:hover td { background:#fafbff; }

/* ── Filtri ricerca ───────────────────────────────────────────────────── */
.filters-bar { display:flex; gap:12px; flex-wrap:wrap; align-items:center; margin-bottom:24px; background:#fff; padding:16px 20px; border-radius:10px; box-shadow:0 1px 4px rgba(0,0,0,.07); }
.filters-bar input, .filters-bar select { padding:8px 12px; border:2px solid #e0e0e0; border-radius:6px; font-size:.9rem; }
.filters-bar input:focus, .filters-bar select:focus { outline:none; border-color:#667eea; }

/* ── Form invio ricetta ───────────────────────────────────────────────── */
.icg-ricetta-form { max-width:800px; margin:40px auto; padding:30px; background:#fff; border-radius:15px; box-shadow:0 4px 20px rgba(0,0,0,.1); }
.icg-form-row { margin-bottom:25px; }
.icg-form-row label { display:block; margin-bottom:8px; font-weight:600; color:#333; }
.icg-form-row input[type=text], .icg-form-row input[type=number], .icg-form-row input[type=email], .icg-form-row select, .icg-form-row textarea { width:100%; padding:12px; border:2px solid #e0e0e0; border-radius:8px; font-size:15px; transition:border .3s; }
.icg-form-row input:focus, .icg-form-row select:focus, .icg-form-row textarea:focus { outline:none; border-color:#667eea; }
.sezione-ingredienti, .passo-blocco { background:#f9f9f9; padding:20px; border-radius:10px; margin-bottom:15px; position:relative; }
.ingrediente-row { display:flex; gap:10px; margin-bottom:8px; align-items:center; }
.ingrediente-row input { flex:1; }
.drag-handle, .drag-handle-small { cursor:move !important; color:#999; padding:5px; user-select:none; font-size:20px; }
.sortable-ghost { opacity:.4; background:#e3f2fd !important; border:2px dashed #667eea !important; }
.icg-form-success { background:#d4edda; color:#155724; padding:15px; border-radius:8px; border:1px solid #c3e6cb; margin-bottom:20px; }
.icg-error { background:#f8d7da; color:#721c24; padding:15px; border-radius:8px; border:1px solid #f5c6cb; margin-bottom:20px; }
.icg-form-message { padding:20px; border-radius:8px; margin-bottom:20px; }

@media (max-width:768px) {
    .icg-ricetta-form { padding:15px; margin:10px auto; }
    .sezione-ingredienti, .passo-blocco { padding:15px; }
    .drag-handle, .drag-handle-small { display:none !important; }
    .site-header__inner { height:auto; padding:10px 0; }
    .site-nav { gap:10px; }
    div[style*="grid-template-columns"] { grid-template-columns:1fr !important; }
    input[type=text], input[type=number], input[type=email], textarea, select { font-size:16px !important; }
}
