/* Mesalist - App CSS */
* { margin:0; padding:0; box-sizing:border-box }
body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif; background:#f8fafc; color:#1f2937; line-height:1.5 }
a { color:#047857; text-decoration-thickness: .08em; text-underline-offset: .18em }
:root { --green:#047857; --green2:#065f46; --dark:#0f172a }

/* Topbar */
.topbar { background:var(--dark); color:#fff; padding-bottom:10px }
.topbar-row { display:flex; justify-content:space-between; align-items:center; padding:12px 20px 6px }
.brand { color:#fff; font-weight:900; font-size:22px; text-decoration:none; letter-spacing:-.04em }
.topnav { display:flex; align-items:center; gap:6px; padding:0 20px; overflow-x:auto; white-space:nowrap; -webkit-overflow-scrolling:touch; scrollbar-width:none }
.topnav::-webkit-scrollbar { display:none }
.topnav a { color:#e2e8f0; text-decoration:none; font-size:14px; font-weight:600; padding:7px 12px; border-radius:99px; flex-shrink:0 }
.topnav a:hover { color:#fff; background:rgba(255,255,255,.08) }

.container { max-width:1100px; margin:0 auto; padding:0 20px }
.main { padding:28px 20px 60px; min-height:70vh }
.footer { border-top:1px solid #e5e7eb; padding:20px; text-align:center; color:#4b5563; font-size:13px }

h1 { font-size:28px; letter-spacing:-.04em; margin-bottom:16px }
h2 { font-size:21px; letter-spacing:-.03em }
.muted { color:#6b7280 }
.small { font-size:12px }
.back { display:inline-block; color:#6b7280; text-decoration:none; font-size:14px; margin-bottom:10px }
.back:hover { color:var(--green) }

/* Form */
.form-group { margin-bottom:16px }
label { display:block; margin-bottom:6px; font-weight:600; font-size:13px }
input, textarea, select { width:100%; padding:10px 12px; border:1px solid #d1d5db; border-radius:8px; font-size:14px; font-family:inherit; background:#fff }
input:focus, textarea:focus, select:focus { outline:none; border-color:var(--green); box-shadow:0 0 0 3px rgba(16,185,129,.12) }
input[type=file] { padding:8px; background:#f9fafb }
.two-col { display:grid; grid-template-columns:1fr 1fr; gap:16px }
@media (max-width:640px){ .two-col { grid-template-columns:1fr } }

/* Bottoni */
.btn { display:inline-block; padding:10px 18px; background:var(--green); color:#fff !important; border:none; border-radius:99px; font-size:14px; font-weight:600; cursor:pointer; text-decoration:none; font-family:inherit }
.btn:hover { background:var(--green2) }
.btn-secondary { background:#e5e7eb; color:#111827 !important }
.btn-secondary:hover { background:#e2e6ec }
.btn-danger { background:#ef4444 }
.btn-danger:hover { background:#dc2626 }
.btn-sm { padding:6px 12px; font-size:12px }
.btn-block { display:block; width:100% }
.btn-white { background:#fff; color:var(--dark) !important }

/* Card */
.card { background:#fff; border:1px solid #e5e7eb; border-radius:16px; padding:22px; margin-bottom:18px }
.card-summary { cursor:pointer; font-weight:700; font-size:16px }
.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:18px; margin-bottom:20px }

/* Alert */
.alert { padding:12px 16px; border-radius:10px; margin-bottom:16px; font-size:14px }
.alert-success { background:#dcfce7; color:#166534; border:1px solid #86efac }
.alert-error { background:#fee2e2; color:#991b1b; border:1px solid #fca5a5 }

/* Auth */
.auth-body { background:linear-gradient(135deg,#0f172a,#1e3a5f); min-height:100vh; display:flex; align-items:center }
.auth { width:100%; max-width:420px; margin:0 auto; padding:20px }
.auth .panel { background:#fff; padding:36px; border-radius:16px; box-shadow:0 20px 50px rgba(0,0,0,.35) }
.auth h1 { font-size:22px; text-align:center; margin-bottom:22px }
.auth-link { text-align:center; margin-top:16px; font-size:14px }

/* Dashboard */
.plan-banner { background:linear-gradient(135deg,var(--dark),#1e3a5f); color:#fff; padding:22px 26px; border-radius:16px; margin-bottom:26px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px }
.plan-banner.premium { background:linear-gradient(135deg,#5b21b6,#7c3aed) }
.plan-badge { display:inline-block; background:rgba(255,255,255,.18); padding:4px 12px; border-radius:99px; font-size:12px; font-weight:700; margin-top:6px }
.section-head { display:flex; justify-content:space-between; align-items:center; margin:22px 0 16px; flex-wrap:wrap; gap:12px }
.empty { text-align:center; padding:50px 20px; color:#6b7280; background:#fff; border:1px dashed #d1d5db; border-radius:16px; margin-bottom:18px }

/* Ristorante card */
.rest-card { padding:0; overflow:hidden }
.rest-cover { width:100%; height:150px; object-fit:cover; display:block }
.rest-cover-empty { display:flex; align-items:center; justify-content:center; font-size:44px; background:#eef1f5; color:#9ca3af }
.rest-body { padding:16px 18px 18px }
.card-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px }

/* Categorie/piatti editor */
.inline-form { display:flex; gap:10px; margin-bottom:18px; flex-wrap:wrap }
.inline-form input { flex:1; min-width:200px }
.cat-card { padding:16px }
.cat-head { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:10px; flex-wrap:wrap }
.cat-rename { display:flex; gap:8px; flex:1; min-width:220px }
.cat-name-input { font-weight:700; font-size:16px }
.cat-actions { display:flex; gap:6px }
.dish-row { display:flex; gap:12px; align-items:center; padding:10px; border-top:1px solid #f1f5f9 }
.dish-off { opacity:.55 }
.dish-thumb { width:54px; height:54px; border-radius:10px; object-fit:cover; flex-shrink:0 }
.dish-thumb-empty { display:flex; align-items:center; justify-content:center; background:#eef1f5; font-size:20px }
.dish-info { flex:1; min-width:0 }
.dish-price { color:var(--green); font-weight:800; margin-left:6px }
.badge-off { background:#fee2e2; color:#991b1b; font-size:11px; padding:2px 8px; border-radius:99px; margin-left:6px }
.dish-actions { display:flex; gap:6px; flex-shrink:0 }
.thumb-preview { display:block; margin-top:8px; max-height:90px; border-radius:8px }

/* Prezzi */
.price-card { text-align:center }
.price-card h3 { font-size:18px }
.price-big { font-size:34px; font-weight:800; letter-spacing:-.04em; margin:8px 0 }
.price-list { list-style:none; text-align:left; margin:16px 0; line-height:2.1; font-size:14px }
.price-featured { border:2px solid var(--green); position:relative }
.badge-current { display:inline-block; background:#dcfce7; color:#166534; font-weight:700; font-size:12px; padding:6px 14px; border-radius:99px }

/* Patch v8: nessuno scroll laterale e grafici responsive */
html, body { max-width:100%; overflow-x:hidden; }
.container, .main, .card, .grid, .footer, .topbar { max-width:100%; }
img, table, canvas, svg, video { max-width:100%; }
.stats-chart { display:grid; grid-template-columns:repeat(14,minmax(0,1fr)); align-items:end; gap:2px; height:160px; padding-top:10px; width:100%; overflow:hidden; }
.stats-col { min-width:0; display:flex; flex-direction:column; align-items:center; gap:4px; }
.stats-date { font-size:9px; line-height:1; white-space:nowrap; letter-spacing:-.04em; }
.stats-count { font-size:10px; line-height:1; min-height:10px; }
@media (max-width:420px){
  .main { padding-left:14px; padding-right:14px; }
  .card { padding:18px; border-radius:14px; }
  .stats-chart { gap:1px; }
  .stats-date { font-size:8px; }
}


/* Accessibility patch: stronger contrast and visible link names */
:focus-visible{outline:3px solid #f59e0b;outline-offset:3px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #f59e0b;outline-offset:3px}
.muted,.back,.empty,.small{color:#4b5563}
.card a:not(.btn),.footer a,.auth-link a{color:#047857;text-decoration:underline;text-underline-offset:.18em}
input::placeholder,textarea::placeholder{color:#4b5563;opacity:1}
.btn{background:#047857;color:#fff!important}
.btn:hover{background:#065f46}