/* Segnalazione errore: link + modale sulla ricetta. Include gli stili del form
   (condivisi con la home) così la modale è completa anche senza home.css. */

/* --- Link "Segnala un errore" sotto gli ingredienti --- */
.report-link{margin:.9rem 0 .2rem}
.report-open{background:none;border:0;padding:0;cursor:pointer;font-family:var(--mono,ui-monospace,monospace);font-size:12px;letter-spacing:.06em;color:rgba(243,234,220,.5);border-bottom:1px solid transparent}
.report-open:hover{color:var(--ottone,#d9a441);border-bottom-color:var(--ottone,#d9a441)}

/* --- Modale (<dialog>) --- */
.report-modal{border:none;padding:0;background:transparent;max-width:520px;width:calc(100% - 2rem);color:var(--carta,#f3eadc)}
.report-modal::backdrop{background:rgba(6,9,14,.72);backdrop-filter:blur(3px)}
.report-modal-box{position:relative;background:var(--bg-a,#12140c);border:1px solid rgba(243,234,220,.14);border-radius:16px;padding:1.7rem 1.5rem 1.7rem;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.report-close{position:absolute;top:.6rem;right:.7rem;width:34px;height:34px;border:0;background:none;color:rgba(243,234,220,.5);font-size:1.8rem;line-height:1;cursor:pointer;border-radius:8px}
.report-close:hover{color:var(--carta,#f3eadc)}
.report-modal h2{font-family:var(--display,Georgia,serif);font-weight:700;margin:0 0 .35rem;font-size:1.45rem}
.report-modal-intro{margin:0 0 1.1rem;font-size:.92rem;color:rgba(243,234,220,.7);line-height:1.5}
.report-result{margin:0 0 1rem;padding:.85rem 1rem;border-radius:10px;font-size:.95rem;line-height:1.5}
.report-ok{background:rgba(120,180,90,.14);border:1px solid rgba(120,180,90,.4);color:#cfe6bd}
.report-err{background:rgba(210,70,70,.14);border:1px solid rgba(210,70,70,.4);color:#f0c4c4}

/* --- Form (copia condivisa con home.css, per la modale) --- */
.segnala-form{display:flex; flex-direction:column; gap:1.05rem}
.sf-hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0}
.sf-grid{display:grid; grid-template-columns:1fr 1fr; gap:1rem}
@media (max-width:560px){.sf-grid{grid-template-columns:1fr}}
.sf-field{display:flex; flex-direction:column; gap:.45rem}
.sf-field span{font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:rgba(243,234,220,.55)}
.sf-field input, .sf-field textarea{box-sizing:border-box; width:100%; padding:.7rem .8rem; border:1px solid rgba(243,234,220,.2); border-radius:10px; background:rgba(243,234,220,.04); color:var(--carta,#f3eadc); font-family:inherit; font-size:1rem}
.sf-field textarea{resize:vertical}
.sf-field input::placeholder, .sf-field textarea::placeholder{color:rgba(243,234,220,.35)}
.sf-field input:focus, .sf-field textarea:focus{outline:none; border-color:var(--ottone); background:rgba(243,234,220,.08)}
.sf-btn{align-self:flex-start; padding:.75rem 1.4rem; border:0; border-radius:10px; background:var(--ottone,#d9a441); color:#11140c; font-weight:600; font-size:1rem; cursor:pointer; transition:filter .18s, transform .18s}
.sf-btn:hover{filter:brightness(1.08); transform:translateY(-1px)}
.sf-btn:disabled{opacity:.6; cursor:default; transform:none}
.gc{display:flex; align-items:flex-start; gap:.85rem; cursor:pointer; margin:.2rem 0}
.gc-glass{position:relative; flex:none; width:38px; height:44px; margin-top:-3px}
.gc-input{position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; z-index:2}
.gc-glass svg{position:absolute; inset:0; width:100%; height:100%; pointer-events:none; overflow:visible}
.gc-wall{fill:none; stroke:rgba(243,234,220,.42); stroke-width:1.6; transition:stroke .3s}
.gc-rim{stroke:rgba(243,234,220,.55); stroke-width:1.9; stroke-linecap:round; transition:stroke .3s}
.gc-fill{transform:translateY(32px); transition:transform .55s cubic-bezier(.22,.68,.32,1)}
.gc-input:checked ~ svg .gc-fill{transform:translateY(0)}
.gc-input:checked ~ svg .gc-wall{stroke:rgba(201,162,74,.85)}
.gc-input:checked ~ svg .gc-rim{stroke:var(--ottone)}
.gc-input:focus-visible ~ svg .gc-wall{stroke:var(--ottone)}
.gc-input:focus-visible ~ svg{filter:drop-shadow(0 0 3px rgba(201,162,74,.7))}
.gc-text{font-size:.9rem; line-height:1.5; color:rgba(243,234,220,.72)}
.gc-text a{color:var(--ottone); text-decoration:underline; text-underline-offset:2px}
@media (prefers-reduced-motion:reduce){.gc-fill{transition:none}}
