/* Gestionale Gommisti — foglio di stile condiviso (sito pubblico + app) */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,wght@0,600;0,700;0,900&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{
  --bg:#FAFAF8; --surface:#FFFFFF; --border:#E6E4DC;
  --text:#1A1A17; --text-soft:#6E6D66; --text-mute:#9B9A91;
  --sidebar:#1C1C1A; --sidebar-text:#A9A89F; --sidebar-active:#FFFFFF;
  --accent:#C2571F; --accent-dark:#9A4315; --accent-soft:#F7E8DD;
  --highlight:#F2B705; --highlight-soft:#FCF0C4;
  --success:#2F7D52; --success-soft:#E4F1E9;
  --warning:#B8841F; --warning-soft:#FBF0DC;
  --danger:#C44536; --danger-soft:#FBE6E2;
  --info:#2B6CB0; --info-soft:#E4ECF7;
  --radius:12px;
}

*{ box-sizing:border-box; }
html,body{ margin:0; }
body{
  font-family:'Manrope', system-ui, sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.4;
}
a{ color:inherit; text-decoration:none; }
h1,h2,h3{ font-family:'Fraunces', serif; margin:0 0 .4em; }
p{ margin:0 0 1em; }
table{ border-collapse:collapse; width:100%; }
th{ text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-mute); font-weight:700; padding:10px 14px; border-bottom:1px solid var(--border); }
td{ padding:12px 14px; font-size:13.5px; border-bottom:1px solid var(--border); vertical-align:middle; }
label{ font-size:12.5px; font-weight:700; color:var(--text-soft); display:block; margin-bottom:6px; }
input, select, textarea{
  font-family:inherit; font-size:14px; padding:11px 13px; border-radius:9px;
  border:1px solid var(--border); background:#fff; width:100%;
}
textarea{ resize:vertical; }

.card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); }
.table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.table-wrap table{ min-width:560px; }

.chip{ display:inline-flex; align-items:center; padding:4px 10px; border-radius:999px; font-size:11.5px; font-weight:700; white-space:nowrap; }
.chip-success{ background:var(--success-soft); color:var(--success); }
.chip-warning{ background:var(--warning-soft); color:var(--warning); }
.chip-danger{ background:var(--danger-soft); color:var(--danger); }
.chip-info{ background:var(--info-soft); color:var(--info); }
.chip-muted{ background:#EFEEE9; color:var(--text-mute); }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; border:none; border-radius:10px; padding:11px 18px; font-size:14px; font-weight:700; font-family:inherit; cursor:pointer; }
.btn-primary{ background:var(--accent); color:#fff; }
.btn-dark{ background:#1C1C1A; color:#fff; }
.btn-ghost{ background:transparent; color:var(--text); border:1.5px solid var(--border); }
.btn-sm{ padding:7px 12px; font-size:12.5px; }
.btn-danger{ background:var(--danger); color:#fff; }
.btn-link-danger{ background:none; border:none; padding:0; font:inherit; font-weight:700; font-size:13px; color:var(--danger); cursor:pointer; }
.btn-link-danger:hover{ text-decoration:underline; }

.flash{ border-radius:10px; padding:12px 16px; font-size:13.5px; font-weight:600; margin-bottom:18px; }
.flash-success{ background:var(--success-soft); color:var(--success); }
.flash-error{ background:var(--danger-soft); color:var(--danger); }

.kpi-grid{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:16px; }
@media (max-width:820px){ .kpi-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:480px){ .kpi-grid{ grid-template-columns:1fr; } }
.kpi{ padding:18px 20px; }
.kpi-label{ font-size:12px; color:var(--text-mute); font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.kpi-value{ font-size:28px; font-weight:800; margin-top:8px; }

/* --- Shell dell'app riservata (sidebar + contenuto) --------------------- */
.shell{ display:flex; min-height:100vh; width:100%; flex-wrap:wrap; }
.sidebar{
  width:252px; min-width:252px; background:var(--sidebar); color:var(--sidebar-text);
  display:flex; flex-direction:column; padding:26px 18px; gap:28px;
}
.sidebar .brand{ display:flex; align-items:center; gap:10px; padding:0 6px; }
.sidebar .brand span{ font-weight:800; font-size:17px; color:#fff; letter-spacing:-0.01em; }
.sidebar nav{ display:flex; flex-direction:column; gap:3px; }
.navlink{ display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:8px; font-size:14px; font-weight:600; color:var(--sidebar-text); }
.navlink.active{ background:rgba(255,255,255,.08); color:#fff; }
.sidebar .profile{ margin-top:auto; display:flex; flex-direction:column; gap:14px; border-top:1px solid #333; padding-top:16px; }
.sidebar .profile .row{ display:flex; align-items:center; gap:10px; }
.avatar{ width:34px; height:34px; border-radius:50%; background:#E8821B; display:flex; align-items:center; justify-content:center; font-weight:800; color:#1C1C1A; font-size:13px; flex-shrink:0; }
.content{ flex:999 1 560px; min-width:0; padding:36px 44px; display:flex; flex-direction:column; gap:22px; }

@media (max-width:900px){
  .sidebar{ width:100%; min-width:0; flex-direction:row; align-items:center; padding:14px 18px; gap:14px; }
  .sidebar nav{ flex-direction:row; overflow-x:auto; gap:6px; }
  .sidebar .profile{ display:none; }
  .navlink{ padding:8px 10px; font-size:13px; white-space:nowrap; }
  .content{ padding:20px 18px; }
}

.page-head{ display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.page-head h1{ font-size:22px; font-weight:800; font-family:'Manrope',sans-serif; }
.page-head .sub{ font-size:14px; color:var(--text-soft); margin-top:2px; }

.tabs{ display:flex; gap:4px; background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:4px; width:fit-content; }
.tabs a, .tabs button{ border:none; background:transparent; border-radius:8px; padding:9px 16px; font-size:13.5px; font-weight:700; color:var(--text-soft); }
.tabs a.active, .tabs button.active{ background:#1C1C1A; color:#fff; }

.form-grid{ display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:14px; }
@media (max-width:560px){ .form-grid{ grid-template-columns:1fr; } }

/* --- Calendario appuntamenti: viste settimana / mese ---------------------- */
.cal-week-grid{ display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:10px; align-items:start; }
.cal-week-day{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column; min-height:220px; }
.cal-week-day.today{ border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); }
.cal-week-day-head{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:10px 6px; border-bottom:1px solid var(--border); font-size:11px; font-weight:700; color:var(--text-soft); text-transform:uppercase; letter-spacing:.04em; }
.cal-week-day.today .cal-week-day-head{ color:var(--accent); background:var(--accent-soft); }
.cal-week-day-body{ padding:8px; display:flex; flex-direction:column; gap:6px; flex:1; }
.cal-day-num{ font-size:15px; font-weight:800; color:var(--text); font-family:'Manrope',sans-serif; }
.cal-week-day.today .cal-day-num{ color:var(--accent); }
.cal-empty{ font-size:12px; color:var(--text-mute); text-align:center; padding:10px 0; }

.cal-appt{ display:flex; flex-direction:column; gap:1px; background:var(--bg); border-left:3px solid var(--text-mute); border-radius:6px; padding:6px 8px; font-size:12px; }
.cal-appt-ora{ font-weight:800; font-size:11.5px; }
.cal-appt-chi{ color:var(--text-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cal-appt-compact{ padding:3px 6px; }
.cal-appt[draggable="true"]{ cursor:grab; }
.cal-appt[draggable="true"]:active{ cursor:grabbing; }
.cal-appt.cal-dragging{ opacity:.4; }

.cal-month-head-row{ display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:8px; text-align:center; font-size:11px; font-weight:700; color:var(--text-mute); text-transform:uppercase; letter-spacing:.04em; padding:0 2px; }
.cal-month-grid{ display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:8px; }
.cal-month-day{ background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:8px; min-height:108px; display:flex; flex-direction:column; gap:4px; transition:background-color .1s, border-color .1s; }
.cal-month-day.outside{ background:#F4F3EF; }
.cal-month-day.outside .cal-day-num{ color:var(--text-mute); }
.cal-month-day.today{ border-color:var(--accent); box-shadow:0 0 0 1px var(--accent); }
.cal-month-more{ font-size:11px; color:var(--text-soft); font-weight:700; }

.cal-week-day-body.cal-drop-target, .cal-month-day.cal-drop-target{ background:var(--accent-soft); border-color:var(--accent); box-shadow:inset 0 0 0 1.5px var(--accent); border-radius:8px; }

@media (max-width:900px){
  .cal-week-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .cal-month-head-row{ display:none; }
  .cal-month-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}

/* --- Sito pubblico ------------------------------------------------------- */
.site-wrap{ max-width:1180px; margin:0 auto; padding:0 32px; }
.eyebrow{ display:inline-flex; align-items:center; gap:8px; background:var(--highlight-soft); color:#8A6A05; border-radius:999px; padding:6px 14px; font-size:12.5px; font-weight:800; letter-spacing:.02em; text-transform:uppercase; }
.feat-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(260px,1fr)); gap:20px; }
.price-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(290px,1fr)); gap:20px; }
.step-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(220px,1fr)); gap:28px; }