/* Sir Barber — gestionale in stile Google Calendar.
   Pulito e ordinato: superfici bianche, righe grigie sottili, testo 14px, un solo colore d'accento (smeraldo scuro del negozio).
   Roberto = blu, Mattia = arancione (colori modificabili in Impostazioni). */

body.admin {
  --g-line: #dadce0;
  --g-line-soft: #ebedef;
  --g-text: #1f1f1f;
  --g-muted: #5f6368;
  --g-hover: #f1f3f4;
  --g-accent: #1e7a4a;
  --g-accent-ink: #0d5a33;
  --g-accent-soft: #e3f3e9;
  --g-red: #d93025;
  --g-shadow: 0 1px 2px rgba(60, 64, 67, .3), 0 1px 3px 1px rgba(60, 64, 67, .15);
  --g-shadow-lg: 0 4px 8px 3px rgba(60, 64, 67, .15), 0 1px 3px rgba(60, 64, 67, .3);
  --hour: 56px;
  font-family: "Google Sans", Roboto, system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px; line-height: 1.43; color: var(--g-text); background: #fff;
}
body.admin :focus-visible { outline: 2px solid var(--g-accent); outline-offset: 2px; box-shadow: none; border-radius: 4px; }

/* ---------- icone (SVG inserite da admin.js) ---------- */
[data-icon] svg { width: 20px; height: 20px; fill: currentColor; display: block; flex: none; }

/* ---------- pulsanti ---------- */
.g-btn, body.admin .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 36px; min-height: 36px; padding: 0 16px; border-radius: 18px; border: 1px solid var(--g-line);
  background: #fff; color: var(--g-text); font-weight: 500; font-size: 14px; line-height: 1; font-family: inherit; letter-spacing: .01em; cursor: pointer; text-decoration: none; white-space: nowrap;
}
.g-btn:hover, body.admin .btn:hover { background: var(--g-hover); }
.g-primary, body.admin .btn-green { background: var(--g-accent); border-color: var(--g-accent); color: #fff; }
.g-primary:hover, body.admin .btn-green:hover { background: var(--g-accent-ink); border-color: var(--g-accent-ink); box-shadow: var(--g-shadow); }
body.admin .btn-red { background: var(--g-red); border-color: var(--g-red); color: #fff; }
body.admin .btn-red:hover { background: #b3261e; }
body.admin .btn-black { background: #3c4043; border-color: #3c4043; color: #fff; }
body.admin .btn-black:hover { background: #202124; }
.g-text, body.admin .btn-link { border-color: transparent; background: transparent; color: var(--g-accent); text-decoration: none; padding: 0 12px; height: 36px; border-radius: 18px; font-weight: 500; }
.g-text:hover, body.admin .btn-link:hover { background: var(--g-accent-soft); color: var(--g-accent-ink); }
.g-outline { border-color: var(--g-line); }
body.admin .btn-small { height: 32px; min-height: 32px; padding: 0 14px; }
body.admin .btn-huge { height: 40px; min-height: 40px; font-size: 14px; padding: 0 24px; border-radius: 20px; }
body.admin .btn-block { display: flex; width: 100%; }
body.admin .btn-row { gap: 8px; }
.g-icon {
  width: 40px; height: 40px; min-width: 40px; border-radius: 50%; border: 0; background: transparent; color: var(--g-muted);
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;
}
.g-icon svg { width: 24px; height: 24px; }
.g-icon:hover { background: var(--g-hover); color: var(--g-text); }

/* segmentati (vista, barbiere, durata, stato…) */
.g-seg, body.admin .seg { display: inline-flex; border: 1px solid var(--g-line); border-radius: 18px; overflow: hidden; background: #fff; flex-wrap: nowrap; }
.g-seg button, body.admin .seg-btn {
  height: 34px; min-height: 34px; padding: 0 14px; border: 0; background: transparent; color: var(--g-text);
  font-weight: 500; font-size: 14px; line-height: 1; font-family: inherit; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
}
.g-seg button + button, body.admin .seg-btn + .seg-btn { border-left: 1px solid var(--g-line); }
.g-seg button:hover, body.admin .seg-btn:hover { background: var(--g-hover); }
.g-seg button[aria-pressed="true"], body.admin .seg-btn[aria-pressed="true"] { background: var(--g-accent-soft); color: var(--g-accent-ink); }
.g-seg button[aria-pressed="true"]::before, body.admin .seg-btn[aria-pressed="true"]::before { content: "✓"; font-weight: 700; }
body.admin .seg.big { display: flex; width: 100%; }
body.admin .seg.big .seg-btn { flex: 1; justify-content: center; height: 36px; font-size: 14px; }
body.admin .seg .lg { width: 10px; height: 10px; border-radius: 50%; margin: 0; }
.g-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.g-chips button { height: 32px; padding: 0 14px; border-radius: 8px; border: 1px solid var(--g-line); background: #fff; font-weight: 500; font-size: 14px; line-height: 1; font-family: inherit; cursor: pointer; color: var(--g-text); display: inline-flex; align-items: center; gap: 6px; }
.g-chips button:hover { background: var(--g-hover); }
.g-chips button[aria-pressed="true"] { background: var(--g-accent-soft); border-color: transparent; color: var(--g-accent-ink); }
.g-chips button[aria-pressed="true"]::before { content: "✓"; }

/* campi */
body.admin label, body.admin .label { font-size: 12px; font-weight: 500; color: var(--g-muted); margin: 0 0 4px; letter-spacing: .02em; }
body.admin .field { margin: 0 0 14px; }
body.admin .hint, .g-hint { font-size: 13px; color: var(--g-muted); margin: 4px 0 12px; }
body.admin input[type=text], body.admin input[type=email], body.admin input[type=tel], body.admin input[type=password], body.admin input[type=date],
body.admin input[type=time], body.admin input[type=number], body.admin input[type=search], body.admin select, body.admin textarea {
  min-height: 40px; height: 40px; padding: 8px 12px; font-size: 14px; line-height: 1.4; font-family: inherit; border: 1px solid #c4c7c5; border-radius: 4px; background: #fff; color: var(--g-text);
}
body.admin textarea { height: auto; min-height: 88px; }
body.admin input:hover, body.admin select:hover, body.admin textarea:hover { border-color: #747775; }
body.admin input:focus, body.admin select:focus, body.admin textarea:focus { border-color: var(--g-accent); box-shadow: inset 0 0 0 1px var(--g-accent); outline: none; }
body.admin .check { grid-template-columns: 22px 1fr; gap: 10px; font-size: 14px; margin: 0 0 12px; }
body.admin .check input { width: 18px; height: 18px; margin-top: 1px; }
body.admin .form-error { color: var(--g-red); font-weight: 500; font-size: 13px; margin: 0; }
body.admin .form-error:empty { display: none; }
body.admin hr { border: 0; border-top: 1px solid var(--g-line-soft); margin: 16px 0; }

/* avvisi: sobri ma ben visibili (icona + titolo + colore) */
body.admin .notice { grid-template-columns: auto 1fr; gap: 2px 12px; padding: 12px 16px; border-radius: 8px; border: 1px solid; border-left-width: 4px; margin: 0 0 12px; font-size: 14px; }
body.admin .notice .ico { font-size: 18px; grid-row: span 3; }
body.admin .notice strong.title { font-size: 14px; font-weight: 600; }
body.admin .notice .btn-row { margin-top: 8px; }
body.admin .notice.ok { background: #e6f4ea; color: #0d652d; border-color: #a8dab5; border-left-color: #1e8e3e; }
body.admin .notice.warn { background: #fef7e0; color: #7a4f01; border-color: #fbe2a2; border-left-color: #f9ab00; }
body.admin .notice.bad { background: #fce8e6; color: #a50e0e; border-color: #f6c5c0; border-left-color: var(--g-red); }
body.admin .notice.info { background: #f1f3f4; color: #3c4043; border-color: var(--g-line); border-left-color: #5f6368; }
body.admin .badge { padding: 2px 8px; font-size: 12px; font-weight: 500; border-width: 1px; border-radius: 6px; }
.toast { font-size: 14px; font-weight: 500; padding: 14px 20px; border-radius: 6px; border-left: 0; background: #323232; bottom: 24px; width: auto; max-width: min(560px, 100% - 24px); }
.toast.bad { background: #b3261e; }

/* ---------- accesso ---------- */
.login-page { min-height: 100vh; display: grid; place-items: center; padding: 16px; background: #f0f4f9; }
.login-card { width: min(420px, 100%); background: #fff; border-radius: 28px; padding: 36px 36px 28px; }
.login-logo { display: block; margin: 0 0 12px; }
.login-card h1 { font-size: 32px; font-weight: 400; margin: 0 0 4px; font-family: inherit; }
.login-sub { color: var(--g-muted); margin: 0 0 24px; }
.login-actions { display: flex; justify-content: flex-end; margin-top: 8px; }

/* ---------- struttura ---------- */
.g-app { display: flex; flex-direction: column; height: 100vh; height: 100dvh; }
.g-app[hidden] { display: none; }
.g-bar { display: flex; align-items: center; gap: 4px; height: 64px; padding: 8px 12px 8px 8px; border-bottom: 1px solid var(--g-line); background: #fff; flex: none; position: relative; z-index: 20; }
.g-brand { display: flex; align-items: center; gap: 8px; color: #3c4043; text-decoration: none; padding: 0 8px 0 4px; margin-right: 32px; }
.g-brand span { font-size: 22px; font-weight: 400; }
.g-cal-tools { display: flex; align-items: center; gap: 4px; min-width: 0; }
.g-cal-tools .g-btn { margin-right: 12px; }
.g-title { font-size: 22px; font-weight: 400; margin: 0 0 0 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: inherit; color: var(--g-text); letter-spacing: 0; }
#page-title { margin-left: 0; }
.g-bar-end { margin-left: auto; display: flex; align-items: center; gap: 12px; padding-left: 12px; }
.g-user { color: var(--g-muted); font-weight: 500; white-space: nowrap; }

.g-body { display: flex; flex: 1; min-height: 0; }
.g-side { width: 256px; flex: none; padding: 8px 8px 24px 8px; overflow-y: auto; background: #fff; }
.g-main { flex: 1; min-width: 0; overflow: auto; position: relative; }
.g-main:focus { outline: none; }

.g-create {
  display: inline-flex; align-items: center; gap: 12px; height: 56px; padding: 0 24px 0 16px; margin: 8px 0 16px 8px;
  border: 0; border-radius: 16px; background: #fff; box-shadow: var(--g-shadow); font-weight: 500; font-size: 14px; line-height: 1; font-family: inherit; color: #3c4043; cursor: pointer;
}
.g-create:hover { box-shadow: var(--g-shadow-lg); background: #f8fafd; }
.g-create svg { width: 28px; height: 28px; fill: var(--g-accent); }

/* mini calendario */
.mini { padding: 0 8px 0 16px; margin-bottom: 16px; }
.mini-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
.mini-head strong { font-size: 14px; font-weight: 500; padding-left: 4px; }
.mini-head .g-icon { width: 28px; height: 28px; min-width: 28px; }
.mini-head .g-icon svg { width: 18px; height: 18px; }
.mini-grid { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; }
.mini-grid .wd { font-size: 10px; font-weight: 500; color: var(--g-muted); height: 24px; line-height: 24px; }
.mini-grid button { width: 26px; height: 26px; margin: 1px auto; border-radius: 50%; border: 0; background: transparent; font-size: 11px; line-height: 26px; font-family: inherit; color: var(--g-text); cursor: pointer; padding: 0; }
.mini-grid button:hover { background: var(--g-hover); }
.mini-grid button.other { color: #9aa0a6; }
.mini-grid button.closed { color: #9aa0a6; }
.mini-grid button.sel { background: var(--g-accent-soft); color: var(--g-accent-ink); font-weight: 600; }
.mini-grid button.today { background: var(--g-accent); color: #fff; font-weight: 600; }

/* navigazione */
.g-nav { display: grid; gap: 0; margin: 0 0 16px; }
.g-nav a { display: flex; align-items: center; gap: 16px; height: 40px; padding: 0 16px 0 20px; border-radius: 20px; color: #3c4043; text-decoration: none; font-weight: 500; }
.g-nav a:hover { background: var(--g-hover); }
.g-nav a[aria-current="page"] { background: var(--g-accent-soft); color: var(--g-accent-ink); font-weight: 600; }
.g-nav a svg { fill: currentColor; opacity: .9; }
.g-count { margin-left: auto; background: var(--g-red); color: #fff; border-radius: 10px; min-width: 20px; height: 20px; padding: 0 6px; font-size: 12px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }

.g-cals { padding: 8px 8px 8px 20px; border-top: 1px solid var(--g-line-soft); }
.g-cals h2 { font-size: 14px; font-weight: 500; margin: 8px 0; font-family: inherit; letter-spacing: 0; }
.g-cals label { display: flex; align-items: center; gap: 12px; height: 32px; font-size: 14px; color: var(--g-text); font-weight: 400; margin: 0; cursor: pointer; }
.g-cals input { width: 18px; height: 18px; margin: 0; }
.g-legend { display: grid; gap: 6px; padding: 12px 8px 0 20px; color: var(--g-muted); font-size: 12px; }
.g-legend span { display: flex; align-items: center; gap: 10px; }
.lg { display: inline-block; width: 16px; height: 12px; border-radius: 3px; flex: none; }
.lg-pending { background: #fff; border: 1.5px dashed #5f6368; }
.lg-block { background: repeating-linear-gradient(135deg, #e8eaed 0 3px, #d2d5d9 3px 6px); }
.lg-google { background: #8ab4f8; box-shadow: inset 3px 0 0 #1a5bd6; }

.g-scrim { display: none; }
.g-side-mobile { display: none; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 8px 4px 20px; border-top: 1px solid var(--g-line-soft); }
.g-fab { display: none; }

/* pagine (richieste, clienti, orari…) */
.g-page { padding: 20px 24px 64px; max-width: 980px; }
.g-card, body.admin .card { background: #fff; border: 1px solid var(--g-line); border-radius: 8px; padding: 20px 24px; margin: 0 0 16px; }
.g-card h2, body.admin .h2-small { font-size: 16px; font-weight: 500; margin: 0 0 4px; font-family: inherit; letter-spacing: 0; }
.g-h2 { font-size: 16px; font-weight: 500; margin: 24px 0 12px; font-family: inherit; }
.g-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.grid-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0 16px; }

/* ---------- calendario ---------- */
.cal-panel { display: flex; flex-direction: column; height: 100%; }
#cal-notices:not(:empty) { padding: 12px 16px 0; }
#cal-notices .notice { margin-bottom: 8px; }
.cal { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.cal-head { display: grid; border-bottom: 1px solid var(--g-line); position: sticky; top: 0; z-index: 6; background: #fff; }
.cal-head .gut { border-right: 0; }
.cal-colhead { text-align: center; padding: 8px 4px 6px; border-left: 1px solid transparent; min-width: 0; }
.cal-colhead .ch-wd { display: block; font-size: 11px; font-weight: 500; color: var(--g-muted); text-transform: uppercase; letter-spacing: .08em; }
.cal-colhead .ch-num { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; font-size: 26px; color: #3c4043; margin-top: 2px; border: 0; background: transparent; cursor: pointer; font-family: inherit; }
.cal-colhead .ch-num:hover { background: var(--g-hover); }
.cal-colhead.today .ch-wd { color: var(--g-accent); }
.cal-colhead.today .ch-num { background: var(--g-accent); color: #fff; }
.cal-colhead.closed .ch-num { color: #9aa0a6; }
.cal-colhead .ch-note { display: block; font-size: 11px; color: var(--g-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-colhead .ch-barber { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; color: #3c4043; padding: 6px 0 4px; }
.cal-colhead .ch-barber i { width: 12px; height: 12px; border-radius: 50%; }
.cal-dayhead { display: flex; align-items: center; gap: 10px; padding: 8px 0 4px; }
.cal-dayhead .ch-num { width: 40px; height: 40px; font-size: 22px; }

.cal-scroll { flex: 1; min-height: 0; overflow: auto; }
.cal-inner { min-width: 100%; }
.cal-head .gut, .cal-times { position: sticky; left: 0; z-index: 5; background: #fff; }
.cal-times { z-index: 4; }
.cal-rows { display: grid; position: relative; }
.cal-times { position: relative; }
.cal-times span { position: absolute; right: 8px; transform: translateY(-50%); font-size: 10px; color: #70757a; letter-spacing: .02em; }
.cal-col {
  position: relative; border-left: 1px solid var(--g-line);
  background-image: linear-gradient(to bottom, var(--g-line) 1px, transparent 1px);
  background-size: 100% var(--hour);
}
.cal-col.closed-day { background-color: #f8f9fa; }
.cal-slot { position: absolute; left: 0; right: 0; border: 0; padding: 0; background: transparent; cursor: pointer; }
.cal-slot.closed { background: rgba(241, 243, 244, .75); }
.cal-slot:hover, .cal-slot:focus-visible { background: rgba(30, 122, 74, .08); outline: none; }
.cal-slot:focus-visible { box-shadow: inset 0 0 0 2px var(--g-accent); border-radius: 0; }
.cal-now { position: absolute; left: -1px; right: 0; height: 2px; background: #ea4335; z-index: 3; pointer-events: none; }
.cal-now.no-dot::before { content: none; }
.cal-now::before { content: ""; position: absolute; left: -6px; top: -5px; width: 12px; height: 12px; border-radius: 50%; background: #ea4335; }

.ev {
  position: absolute; z-index: 1; border-radius: 4px; padding: 2px 6px; overflow: hidden; text-align: left;
  font-size: 12px; line-height: 16px; font-family: inherit; cursor: pointer; border: 1px solid #fff; color: #fff;
  display: flex; flex-direction: column; justify-content: flex-start; min-width: 0;
}
.ev:hover { box-shadow: var(--g-shadow-lg); z-index: 2; }
.ev .ev-t { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev .ev-s { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; opacity: .92; }
.ev.short { flex-direction: row; gap: 0; align-items: center; }
.ev.short .ev-s::before { content: ", "; }
.ev.dark { color: #1f1f1f; }
.ev.pending { background: #fff !important; color: #1f1f1f; border: 1.5px dashed #5f6368; }
.ev.pending .ev-t::before { content: "? "; color: var(--g-red); font-weight: 700; }
.ev.block { background: repeating-linear-gradient(135deg, #eceef0 0 6px, #dfe2e5 6px 12px) !important; color: #3c4043; border-color: #fff; }
.ev.google { box-shadow: inset 4px 0 0 rgba(0, 0, 0, .28); }
.ev:focus-visible { outline: 2px solid #1f1f1f; outline-offset: 1px; z-index: 4; }

/* ---------- finestra ---------- */
.g-dialog { width: min(520px, 100% - 24px); max-height: calc(100% - 32px); padding: 0; border: 0; border-radius: 16px; box-shadow: 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12), 0 11px 15px -7px rgba(0, 0, 0, .2); color: var(--g-text); font-size: 14px; }
.g-dialog::backdrop { background: rgba(32, 33, 36, .4); }
.g-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 12px 0 24px; position: sticky; top: 0; background: #fff; z-index: 2; }
.g-dialog-head h2 { font-size: 22px; font-weight: 400; margin: 0; font-family: inherit; letter-spacing: 0; line-height: 1.3; }
.g-dialog-body { padding: 12px 24px 24px; }
.det-name { font-size: 18px; font-weight: 500; margin: 0 0 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.det-row { display: grid; grid-template-columns: 24px 1fr; gap: 12px; align-items: start; padding: 4px 0; color: #3c4043; }
.det-row svg { width: 20px; height: 20px; fill: var(--g-muted); margin-top: 1px; }
.two { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.durations { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.durations .seg-btn { border: 1px solid var(--g-line); border-radius: 8px; height: 32px; min-height: 32px; padding: 0 12px; }
.durations .seg-btn + .seg-btn { border-left: 1px solid var(--g-line); }
.durations input { width: 84px !important; height: 32px !important; min-height: 32px !important; padding: 4px 8px !important; }
.durations span { color: var(--g-muted); }
.actions-big { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 8px; }
.client-pick { display: grid; gap: 4px; max-height: 220px; overflow: auto; margin: -6px 0 12px; }
.client-pick .btn { justify-content: flex-start; border-radius: 8px; }

/* ---------- richieste ---------- */
.req-list { display: grid; gap: 12px; }
.req { background: #fff; border: 1px solid var(--g-line); border-left: 4px solid var(--g-line); border-radius: 8px; padding: 16px 20px; display: grid; gap: 6px; }
.req .r-top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.req .r-code { font-size: 12px; font-weight: 600; padding: 2px 8px; border-radius: 6px; background: var(--g-hover); }
.req .r-name { font-size: 16px; font-weight: 500; }
.req .r-when { font-size: 14px; font-weight: 500; color: #3c4043; }
.req .notice { margin: 4px 0; }
.req .actions-big { max-width: 360px; margin: 6px 0 0; }

/* ---------- clienti ---------- */
.cli-tools { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.g-search { flex: 1 1 320px; display: flex; align-items: center; gap: 8px; height: 44px; padding: 0 16px; background: #f1f3f4; border-radius: 22px; color: var(--g-muted); }
.g-search:focus-within { background: #fff; box-shadow: var(--g-shadow); }
.g-search input { border: 0 !important; background: transparent !important; box-shadow: none !important; height: 40px !important; padding: 0 !important; flex: 1; min-width: 0; }
.cli-list { border-top: 1px solid var(--g-line); }
.cli-row { display: grid; grid-template-columns: 1fr auto; gap: 2px 12px; align-items: center; width: 100%; padding: 12px 8px; border: 0; border-bottom: 1px solid var(--g-line-soft); background: #fff; font: inherit; text-align: left; cursor: pointer; color: inherit; }
.cli-row:hover { background: #f8f9fa; }
.cli-row .c-n { font-weight: 500; }
.cli-row .c-d { color: var(--g-muted); font-size: 13px; grid-column: 1; }
.st { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 6px; font-weight: 500; font-size: 12px; border: 1px solid; white-space: nowrap; }
.st-normale { background: #f1f3f4; border-color: #dadce0; color: #3c4043; }
.st-amico { background: #e6f4ea; border-color: #a8dab5; color: #0d652d; }
.st-cm { background: #fce8e6; border-color: #f6c5c0; color: #a50e0e; }
.hist { display: grid; gap: 0; border-top: 1px solid var(--g-line-soft); }
.hist div { padding: 8px 0; border-bottom: 1px solid var(--g-line-soft); }
body.admin .g-dialog h3 { font-size: 14px; font-weight: 500; margin: 0 0 8px; }

/* ---------- orari ---------- */
.week-rows { display: grid; gap: 0; margin: 8px 0; border-top: 1px solid var(--g-line-soft); }
.wr { display: grid; grid-template-columns: 120px auto repeat(3, minmax(100px, 140px)); gap: 12px; align-items: end; padding: 12px 0; border-bottom: 1px solid var(--g-line-soft); }
.wr .wr-day { font-weight: 500; align-self: center; }
.wr .field { margin: 0; }
.wr .seg { align-self: center; }
.wr.off .field { opacity: .4; }
.special-list { display: grid; gap: 0; margin-top: 16px; border-top: 1px solid var(--g-line-soft); }
.sp-item { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; padding: 10px 0; border-bottom: 1px solid var(--g-line-soft); }
.sp-item.open b::before { content: "● "; color: #1e8e3e; }
.sp-item.closed b::before { content: "● "; color: var(--g-red); }

/* ---------- impostazioni ---------- */
.set-table { width: 100%; border-collapse: collapse; }
.set-table th, .set-table td { padding: 8px; border-bottom: 1px solid var(--g-line-soft); text-align: left; vertical-align: middle; font-weight: 400; white-space: nowrap; }
.set-table thead th { font-size: 12px; font-weight: 500; color: var(--g-muted); }
.set-table input[type=number] { max-width: 88px; }
.set-table input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--g-accent); }
.table-wrap { overflow-x: auto; }
.color-in { width: 48px; height: 36px; padding: 2px; border: 1px solid var(--g-line); border-radius: 6px; background: #fff; }

/* ---------- telefono e tablet ---------- */
@media (max-width: 1000px) {
  .g-side { position: fixed; top: 64px; bottom: 0; left: 0; z-index: 30; box-shadow: var(--g-shadow-lg); transform: translateX(-105%); transition: transform .2s ease; }
  .g-side.open { transform: none; }
  .g-scrim:not([hidden]) { display: block; position: fixed; inset: 64px 0 0 0; background: rgba(32, 33, 36, .4); z-index: 25; }
  .g-fab { display: inline-flex; align-items: center; justify-content: center; position: fixed; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); width: 56px; height: 56px; border-radius: 16px; border: 0; background: #fff; box-shadow: var(--g-shadow-lg); z-index: 15; cursor: pointer; }
  .g-fab svg { width: 28px; height: 28px; fill: var(--g-accent); }
  .g-brand { margin-right: 8px; }
}
@media (max-width: 760px) {
  .g-brand span, .g-user { display: none; }
  .g-brand img { width: 32px; height: 32px; }
  .g-bar { gap: 0; padding-right: 4px; }
  .g-cal-tools .g-btn { margin-right: 4px; padding: 0 12px; }
  .g-cal-tools .g-icon { width: 34px; min-width: 34px; height: 34px; }
  .g-title { font-size: 17px; margin-left: 4px; }
  .g-bar-end { gap: 4px; padding-left: 4px; }
  .g-bar-end .g-text { padding: 0 8px; }
  .g-seg button { padding: 0 10px; }
  .g-seg button[aria-pressed="true"]::before { content: none; }
  .g-bar-end { display: none; }
  .g-side-mobile { display: flex; }
  .g-page { padding: 16px 16px 96px; }
  .g-card, body.admin .card { padding: 16px; }
  .cal-times span { font-size: 9px; right: 4px; }
  .wr { grid-template-columns: 1fr 1fr 1fr; }
  .wr .wr-day { grid-column: 1 / 2; }
  .wr .seg { grid-column: 2 / 4; justify-self: end; }
  .two { grid-template-columns: 1fr; }
  .g-dialog { width: 100%; max-width: 100%; max-height: 100%; height: 100%; border-radius: 0; }
}
@media (max-width: 400px) {
  .g-brand { display: none; }
}
@media (min-width: 1001px) { body.side-closed .g-side { display: none; } }
.g-banner { display: flex; align-items: center; gap: 12px; padding: 8px 16px; margin: 0 0 8px; border-radius: 8px; background: #fef7e0; color: #7a4f01; font-weight: 500; text-decoration: none; }
.g-banner svg { width: 20px; height: 20px; fill: #f29900; }
.g-banner:hover { background: #feefc3; }
.g-banner-go { margin-left: auto; color: var(--g-accent-ink); font-weight: 600; }

/* ---------- prodotti ---------- */
.prod-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 8px; border-bottom: 1px solid var(--g-line-soft); }
.prod-row:hover { background: #f8f9fa; }
.prod-main { display: flex; align-items: center; gap: 12px; border: 0; background: none; padding: 0; text-align: left; font: inherit; color: inherit; cursor: pointer; min-width: 0; }
.prod-main .c-n { font-weight: 500; }
.prod-main .c-d { color: var(--g-muted); font-size: 13px; }
.prod-thumb { width: 48px; height: 48px; border-radius: 8px; border: 1px solid var(--g-line); display: grid; place-items: center; overflow: hidden; flex: none; background: #fff; font-size: 22px; }
.prod-thumb img { width: 100%; height: 100%; object-fit: contain; }
.prod-price { white-space: nowrap; }
.prod-price s { color: var(--g-muted); }
.prod-flags { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.prod-flags button.badge { cursor: pointer; font-family: inherit; }
.prod-photo-row { display: flex; gap: 16px; align-items: center; margin-bottom: 16px; }
.prod-photo-edit { width: 112px; height: 112px; border-radius: 12px; border: 1px solid var(--g-line); display: grid; place-items: center; overflow: hidden; color: var(--g-muted); font-size: 12px; text-align: center; flex: none; }
.prod-photo-edit img { width: 100%; height: 100%; object-fit: contain; }
.cli-tools .g-btn { margin-left: auto; }
@media (max-width: 760px) { .prod-row { grid-template-columns: 1fr; } .prod-flags { justify-content: flex-start; } }

/* ---------- settimana: per ogni giorno una colonna per barbiere ---------- */
.cal-dayhead-w { display: flex; flex-direction: column; align-items: center; padding: 8px 4px 2px; border-left: 1px solid #c4c7c5; min-width: 0; }
.cal-dayhead-w .ch-wd { font-size: 11px; font-weight: 500; color: var(--g-muted); text-transform: uppercase; letter-spacing: .08em; }
.cal-dayhead-w .ch-num { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; font-size: 22px; color: #3c4043; border: 0; background: transparent; cursor: pointer; font-family: inherit; }
.cal-dayhead-w .ch-num:hover { background: var(--g-hover); }
.cal-dayhead-w.today .ch-wd { color: var(--g-accent); }
.cal-dayhead-w.today .ch-num { background: var(--g-accent); color: #fff; }
.cal-dayhead-w.closed { background: #f8f9fa; }
.cal-dayhead-w.closed .ch-num { color: #9aa0a6; }
.cal-dayhead-w .ch-note { font-size: 11px; color: var(--g-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.cal-barberhead { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 4px 4px 6px; font-size: 12px; font-weight: 500; color: #3c4043; min-width: 0; border-left: 1px dashed var(--g-line); }
.cal-barberhead.day-start { border-left: 1px solid #c4c7c5; }
.cal-barberhead i { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.cal-barberhead span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal.is-week .cal-col { border-left: 1px dashed var(--g-line); }
.cal.is-week .cal-col.day-start { border-left: 1px solid #c4c7c5; }
.cal.is-week .ev { padding: 3px 6px; }
.cal.is-week .ev.short { flex-direction: column; align-items: stretch; }
.cal.is-week .ev.short .ev-s::before { content: none; }
.cal.is-week .ev.short .ev-s { display: none; }
/* la colonna delle ore resta ferma quando la settimana scorre di lato */
.cal-head .gut, .cal-rows .cal-times { position: sticky; left: 0; background: #fff; }
.cal-rows .cal-times { z-index: 4; box-shadow: 1px 0 0 var(--g-line); }
.cal-head .gut { z-index: 7; }
.login-alt { text-align: center; margin: 12px 0 0; }
.login-actions { gap: 8px; }

/* ---------- Novità 22/10/2026 ---------- */
/* non si è presentato: rosso e barrato */
.ev.absent { background: #fde4e4 !important; color: #8a1414; border: 1.5px solid #c62828; }
.ev.absent .ev-t { text-decoration: line-through; }
.ev.absent .ev-t::before { content: "🚫 "; }
body.admin .btn-link.danger { color: var(--g-red); }
body.admin .btn-link.danger:hover { background: #fde4e4; color: #8a1414; }
/* festività nell'intestazione del calendario */
.ch-holiday { display: block; font-size: 11px; font-weight: 600; color: var(--g-red); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* avvisi dal sito */
.notice-item { padding: 10px 12px; border-bottom: 1px solid #e0e0e0; }
.notice-item.unread { background: #e8f0fe; font-weight: 600; }
.notice-item time { display: block; font-size: 12px; color: #5f6368; font-weight: 400; }
/* foto dei barbieri */
.barber-photo { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; border: 2px solid #e0e0e0; background: #fff; }
.margin-ok { color: #137333; font-weight: 600; }
/* messaggi con i clienti */
.chat-row { display: grid; gap: 2px; width: 100%; text-align: left; padding: 12px 14px; border: 0; border-bottom: 1px solid #e0e0e0; background: #fff; font: inherit; color: inherit; cursor: pointer; }
.chat-row:hover { background: #f1f3f4; }
.chat-row.unread { background: #e8f0fe; }
.chat-row.unread .c-n { font-weight: 700; }
.chat-row .g-count { margin-left: 8px; }
.chat-thread { display: grid; gap: 8px; max-height: 50vh; overflow: auto; margin: 10px 0; padding: 4px; }
.chat-thread .chat-msg { max-width: 85%; padding: 8px 12px; border-radius: 12px; background: #f1f3f4; }
.chat-thread .chat-msg.me { justify-self: end; background: #e6f4ea; }
.chat-thread .chat-msg p { margin: 4px 0; white-space: pre-wrap; }