:root{
  --bg-main:#f4f1ec;
  --bg-panel:#fbf9f6;
  --bg-header:#eee7de;
  --bg-time:#e3ddd4;
  --row-even:#ffffff;
  --row-odd:#f2ebe1;

  --border:#c8bfb5;
  --border-soft:#d4c9be;

  --text-main:#2f2b27;
  --text-soft:#8c857d;

  --accent:#c7a56a;
  --accent-dark:#b89458;
  --accent-soft:#efe3cc;

  --radius-lg:22px;
  --radius-md:14px;
  --radius-sm:10px;

  --shadow-soft:0 8px 24px rgba(0,0,0,0.05);
  --shadow-card:0 10px 30px rgba(0,0,0,0.07);

  --header-h:82px;
}

html,
body{
  height:100%;
  margin:0;
  overflow:hidden;
}

*{
  box-sizing:border-box;
  margin:0;
  padding:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

body{
  background:
    linear-gradient(180deg, #f6f2ed 0%, #f2ede7 100%);
  color:var(--text-main);
}

/* ================= GENERALI ================= */

button{
  border:none;
  background:#f3eee7;
  color:var(--text-main);
  padding:10px 14px;
  border-radius:12px;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:background .15s ease, transform .12s ease, box-shadow .15s ease;
  box-shadow:0 2px 8px rgba(0,0,0,0.03);
}

button:hover{
  background:#e8e1d8;
  box-shadow:0 4px 12px rgba(0,0,0,0.05);
}

button:active{
  transform:translateY(1px);
}

input,
select,
textarea{
  width:100%;
  border:1px solid var(--border);
  background:#fff;
  color:var(--text-main);
  border-radius:12px;
  padding:10px 12px;
  font-size:14px;
  outline:none;
}

input:focus,
select:focus,
textarea:focus{
  border-color:#cdbda7;
  box-shadow:0 0 0 3px rgba(199,165,106,.10);
}

textarea{
  resize:vertical;
  min-height:96px;
}

/* ================= HEADER ================= */

.main-header{
  position:sticky;
  top:0;
  z-index:100;
  height:var(--header-h);

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;

  padding:14px 26px;

  background:rgba(251,249,246,0.88);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border-soft);
  box-shadow:0 4px 18px rgba(0,0,0,0.04);
}

.header-left,
.header-center,
.header-right{
  display:flex;
  align-items:center;
  gap:10px;
}

.header-center{
  flex:1;
  justify-content:center;
}

.header-right{
  justify-content:flex-end;
}

.header-right button{
  white-space:nowrap;
}

.header-overflow-btn{
  width:40px;
  min-width:40px;
  padding:0;
  font-size:20px;
  line-height:1;
  letter-spacing:1px;
}

.header-logo{
  height:42px;
  object-fit:contain;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,0.03));
}

#location-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:36px;
  padding:0 14px;
  margin:0;
  border:1px solid var(--border-soft);
  border-radius:12px;
  background:#fff;
  color:var(--text-main);
  font-size:14px;
  font-weight:600;
  letter-spacing:.2px;
  white-space:nowrap;
  line-height:1;
  cursor:pointer;
  user-select:none;
  transition:background .15s ease, border-color .15s ease, box-shadow .15s ease;
  box-shadow:0 1px 2px rgba(0,0,0,0.03);
}
#location-badge:hover{
  background:var(--accent-soft);
  border-color:var(--accent);
}
#location-badge:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}
.location-badge-name{
  max-width:240px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.location-badge-caret{
  font-size:12px;
  color:var(--text-soft);
  line-height:1;
}

.arrow-btn{
  width:36px;
  min-width:36px;
  height:36px;
  padding:0;
  border-radius:12px;
  font-size:18px;
  line-height:1;
}

.today-btn{
  height:36px;
  padding:0 14px;
  border-radius:12px;
  font-size:13px;
  font-weight:700;
  letter-spacing:.4px;
  line-height:1;
  background:var(--accent-soft, #fce8d8);
  color:var(--accent-dark, #8a4a1e);
}

#day-selector{
  width:144px;
  text-align:center;
  background:#fffdfb;
}

.search-input-field{
  width:260px;
  background:#fffdfb;
}

/* ================= HOME / PLANNER ================= */

#planner{
  position:absolute;
  top:calc(var(--header-h) + var(--urgent-h, 0px));
  left:0;
  right:0;
  bottom:0;
  padding:22px 20px 20px;
  background:transparent;
  overflow:hidden;
}

#planner-scroll{
  width:100%;
  height:100%;
  overflow-x: hidden;
  overflow-y: auto;
  background:linear-gradient(180deg,#f0ebe4,#ece4db);
  border:1px solid var(--border-soft);
  border-radius:24px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    0 10px 30px rgba(0,0,0,0.04);
  position:relative;
  overscroll-behavior: none;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* Overlay sticky: NON PIÙ USATO — sostituito da CSS Grid sticky nativo */
#sticky-overlay{
  display:none !important;
}

/* ================= CSS GRID STICKY CELLS ================= */

/* Corner: ORARIO — sticky sia in alto che a sinistra */
.sticky-corner-cell{
  position:sticky;
  top:0;
  left:0;
  z-index:90;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:700;
  color:#3c3834;
  background:var(--bg-time);
  border-right:1px solid var(--border);
  border-bottom:1px solid var(--border);
  white-space:nowrap;
}

/* Header servizi: sticky solo in alto */
.sticky-header-cell{
  position:sticky;
  top:0;
  z-index:80;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:700;
  color:#3c3834;
  background:var(--bg-header);
  border-right:1px solid var(--border);
  border-bottom:1px solid var(--border);
  white-space:nowrap;
  cursor:pointer;
}

.sticky-header-cell:hover{
  background:#e5ddd2;
}

/* Colonna ore: sticky solo a sinistra — z-index sopra gli eventi (z-index:60) */
.sticky-time-cell{
  position:sticky;
  left:0;
  z-index:70;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:600;
  color:#6f6963;
  border-right:1px solid var(--border);
  border-bottom:1px solid var(--border-soft);
  border-top:1px solid transparent;
  background:var(--bg-time);
}

/* Grid cell */
.grid-cell{
  position:relative;
  border-right:1px solid var(--border-soft);
  border-bottom:1px solid var(--border-soft);
  border-top:1px solid transparent;
  transition:background .15s ease;
}

/* Orario fantasma in ogni cella */
.grid-cell::before{
  content:attr(data-time);
  position:absolute;
  top:3px;
  left:6px;
  font-size:10px;
  font-weight:500;
  color:rgba(0,0,0,0.32);
  pointer-events:none;
  letter-spacing:0.2px;
}

.grid-cell.out-of-shift::before{
  opacity:0.5;
}

/* Events layer: assoluto sopra la griglia */
#events-layer{
  pointer-events:none;
}

#planner-grid{
  position:relative;
  min-width:max-content;
  background:#fff;
  border-radius:22px;
  /* Non usare overflow:hidden qui — rompe position:sticky dei figli */
  /* Fix rendering su display retina durante scroll veloce */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* ================= HEADER CELLS ================= */

/* Column headers: ora gestiti da .sticky-corner-cell e .sticky-header-cell */

/* ================= TIME CELLS ================= */

/* Time cells: ora gestiti da .sticky-time-cell */

/* ================= GRID CELLS ================= */

/* Le grid-cell ora usano gli stili da .grid-cell definiti nella sezione sticky */

.grid-cell:hover{
  background:#f2ebe3 !important;
}

.row-even{
  background:var(--row-even);
}

.row-odd{
  background:var(--row-odd);
}

/* ================= EVENTI ================= */


.appointment-item{
  position:absolute;
  background:linear-gradient(180deg,#ffffff,#fbfaf8);
  border-left:4px solid var(--accent);
  border-radius:10px;
  padding:6px 8px;
  box-shadow:
    0 2px 6px rgba(0,0,0,0.04),
    0 8px 18px rgba(0,0,0,0.06);
  cursor:pointer;
  transition:transform .12s ease, box-shadow .12s ease, opacity .12s ease;
  z-index:60;
  overflow:hidden;
  /* Safari: impedisce allo scroll di intercettare i touch prima del JS */
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
}

/* Durante il drag disabilitiamo la transition per risposta immediata */
.appointment-item.dragging{
  transition: none !important;
}

/* Durante il drag: blocca selezione testo su tutto il documento */
body.dragging,
body.dragging * {
  -webkit-user-select: none !important;
  user-select: none !important;
  cursor: grabbing !important;
}
.appointment-item:hover{
  transform:translateY(-1px);
  box-shadow:
    0 4px 10px rgba(0,0,0,0.06),
    0 10px 20px rgba(0,0,0,0.08);
}

.event-header{
  display:flex;
  align-items:baseline;
  gap:5px;
  margin-bottom:1px;
  min-width:0;
}
.event-time{
  flex:0 0 auto;
  font-size:10.5px;
  font-weight:700;
  color:var(--text-soft);
  letter-spacing:0.3px;
  opacity:0.75;
}
.event-header .event-name{
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.event-name{
  font-weight:700;
  font-size:12px;
  margin-bottom:1px;
  color:#36312d;
  line-height:1.3;
}

.event-phone{
  font-size:12px;
  color:#777068;
}

.event-count{
  font-size:12px;
  color:#9d968d;
  margin-top:4px;
}

.event-notes{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:11px;
  font-weight:600;
  font-style:italic;
  color:#7a2e22;
  background:#f4c9bd;
  background-image:linear-gradient(180deg,#f6d0c5 0%,#efbeae 100%);
  padding:4px 7px;
  margin-top:5px;
  border-radius:5px;
  line-height:1.25;
  white-space:pre-wrap;
  box-shadow:0 1px 2px rgba(122,46,34,0.12), inset 0 1px 0 rgba(255,255,255,0.4);
  letter-spacing:0.1px;
}

.event-has-notes{
  position:absolute;
  bottom:14px;
  right:10px;
  font-size:12px;
  color:var(--accent);
  opacity:0.7;
  pointer-events:none;
}

/* Celle fuori turno — scuritimento visibile */
.grid-cell.out-of-shift{
  background:rgba(0,0,0,0.10) !important;
}

.row-even.out-of-shift{
  background:rgba(0,0,0,0.09) !important;
}

.row-odd.out-of-shift{
  background:rgba(0,0,0,0.13) !important;
}

/* Modalità incolla: cursore crosshair sulle celle vuote */
body.paste-mode .grid-cell{
  cursor: cell;
}

body.paste-mode .grid-cell:hover{
  background: rgba(199,165,106,.18) !important;
}

/* ================= MODAL ================= */

.modal,
.overlay-modal{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.25);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:200;
}

.modal-box-content{
  background:rgba(255,255,255,0.96);
  backdrop-filter:blur(14px);
  border-radius:18px;
  padding:26px;
  width:360px;
  display:flex;
  flex-direction:column;
  gap:12px;
  box-shadow:0 20px 60px rgba(0,0,0,0.18);
  border:1px solid rgba(232,226,219,0.9);
}

.modal-footer{
  display:flex;
  gap:8px;
  margin-top:10px;
}

.modal-footer button{
  flex:1;
}

/* ================= TOAST ================= */

.toast{
  position:fixed;
  bottom:30px;
  left:50%;
  transform:translateX(-50%);
  background:#2f2b27;
  color:#fff;
  padding:12px 18px;
  border-radius:12px;
  font-size:13px;
  opacity:0;
  pointer-events:none;
  transition:.3s;
  z-index:300;
  box-shadow:0 10px 24px rgba(0,0,0,0.15);
}

.toast.show{
  opacity:1;
}

/* ================= LOCK SCREEN ================= */

.lock-screen{
  position:fixed;
  inset:0;
  background:rgba(244,241,236,0.92);
  backdrop-filter:blur(10px);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:9999;
}

.lock-box{
  width:360px;
  background:linear-gradient(180deg,#fbf9f6,#f3eee7);
  border:1px solid var(--border-soft);
  border-radius:22px;
  padding:30px 28px;
  box-shadow:0 10px 30px rgba(0,0,0,0.07);
  display:flex;
  flex-direction:column;
  gap:14px;
  align-items:center;
}

.lock-logo{
  width:150px;
  height:auto;
  margin-bottom:6px;
}

.lock-subtitle{
  font-size:13px;
  color:var(--text-soft);
  margin-top:-4px;
  margin-bottom:4px;
  letter-spacing:.4px;
}

.lock-box input{
  width:100%;
  border:1px solid var(--border);
  background:#fff;
  color:var(--text-main);
  border-radius:12px;
  padding:12px 14px;
  font-size:14px;
  text-align:center;
}

.lock-box button{
  width:100%;
  background:var(--accent);
  color:#fff;
  border:none;
  border-radius:12px;
  padding:12px 14px;
  font-size:14px;
  font-weight:700;
}

.lock-box button:hover{
  background:var(--accent-dark);
  transform:translateY(-1px);
}

/* ================= SCROLLBAR ================= */

::-webkit-scrollbar{
  width:10px;
  height:10px;
}

::-webkit-scrollbar-thumb{
  background:#d5cec6;
  border-radius:999px;
}

::-webkit-scrollbar-thumb:hover{
  background:#c7bfb6;
}

::-webkit-scrollbar-track{
  background:#eee8e1;
}

/* ================= RESPONSIVE ================= */

/* =================================================
   RESPONSIVE — breakpoint unici e ordinati
   1280  desktop medio
   1100  laptop 13", iPad Pro landscape
    960  iPad landscape
    820  tablet portrait / iPad mini
    560  smartphone grande
    420  smartphone piccolo
================================================= */

/* ── 1280: desktop medio ── */
@media (max-width: 1280px){
  .search-input-field{ width:220px; }
}

/* ── 1100: laptop 13" / iPad Pro landscape ── */
@media (max-width: 1100px){
  .main-header{
    padding:12px 16px;
    gap:10px;
  }
  .header-logo{ height:34px; }
  .search-input-field{ width:160px; }
  #day-selector{ width:128px; }
  .header-right{ gap:6px; }
  .header-right button{
    font-size:13px;
    padding:0 10px;
    min-height:44px;
  }
  #location-badge{ height:34px; padding:0 12px; font-size:13px; }
  .location-badge-name{ max-width:180px; }
  #planner{ padding:16px; }
  .lock-box{ width:min(360px, calc(100vw - 32px)); }
}

/* ── 960: iPad landscape ── */
@media (max-width: 960px){
  .search-input-field{ width:140px; }
  .header-right button{
    font-size:12px;
    padding:0 8px;
  }
  #day-selector{ width:118px; }
}

/* ── 820: tablet portrait / iPad mini ── */
@media (max-width: 820px){
  :root{ --header-h:auto; }

  /* Su mobile header non è sticky a altezza fissa: banner nel flusso normale */
  .urgent-notes-alert{ position:static; top:auto; }
  #planner{ top:auto; }

  html, body{ overflow:auto; }
  body{ overflow-x:hidden; }

  .main-header{
    position:relative;
    height:auto;
    padding:12px 14px;
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }
  .header-left,
  .header-center,
  .header-right{ width:100%; }
  .header-left{ justify-content:center; }
  .header-center{
    flex:none;
    justify-content:center;
    flex-wrap:wrap;
    gap:8px;
  }
  .header-right{
    justify-content:center;
    flex-wrap:wrap;
    gap:8px;
  }
  .header-logo{ height:38px; }
  #day-selector{ width:150px; max-width:100%; }
  .search-input-field{ width:100%; max-width:400px; }
  .header-right button{
    font-size:14px;
    padding:0 12px;
    min-height:44px;
  }

  #planner{
    position:relative;
    top:auto; left:auto; right:auto; bottom:auto;
    height:calc(100svh - var(--header-measured, 180px) - 28px);
    min-height:400px;
    padding:12px;
  }
  #planner-scroll{ border-radius:18px; }

  .event-modal-box{
    width:min(96vw, 640px);
    padding:20px;
  }
  .lock-box{
    width:min(360px, calc(100vw - 24px));
    padding:24px 20px;
    border-radius:18px;
  }
  .lock-logo{ width:130px; }
}

/* ── 560: smartphone grande ── */
@media (max-width: 560px){
  .main-header{ padding:10px 10px; }
  .header-center{ gap:6px; }
  .arrow-btn{ width:34px; min-width:34px; height:34px; }
  .today-btn{ height:34px; padding:0 10px; font-size:12px; }
  #day-selector{ width:100%; max-width:none; }
  .search-input-field{ width:100%; max-width:none; }

  #planner{
    padding:8px;
    height:calc(100svh - var(--header-measured, 200px) - 16px);
  }
  #planner-scroll{ border-radius:14px; }

  .event-modal-box{
    width:calc(100vw - 12px);
    padding:16px;
    border-radius:16px;
  }
  .event-modal-actions{ flex-wrap:wrap; gap:8px; }
  .event-modal-actions button{
    flex:1 1 calc(50% - 4px);
    min-width:calc(50% - 4px);
  }

  .lock-box{
    width:calc(100vw - 20px);
    padding:20px 16px;
    border-radius:16px;
  }
  .lock-logo{ width:110px; }

  .toast{
    width:calc(100vw - 24px);
    left:12px; right:12px;
    transform:none;
    text-align:center;
  }
}

/* ── 420: smartphone piccolo ── */
@media (max-width: 420px){
  .header-right{
    flex-direction:column;
    align-items:stretch;
  }
  .header-right button{ width:100%; }
  .header-center{
    flex-direction:column;
    align-items:stretch;
  }
  .header-center .arrow-btn{ align-self:center; }
  .header-center .today-btn{ align-self:center; }

  #planner{
    height:calc(100svh - var(--header-measured, 260px) - 12px);
  }

  .event-name{ font-size:12px; }
  .event-phone, .event-count{ font-size:12px; }

  .event-modal-actions button{
    flex:1 1 100%;
    min-width:100%;
  }
}




/* ================= SCRITTURA CON PENNA ================= */

.event-tools{
  display:flex;
  justify-content:flex-end;
  margin-top:-4px;
  margin-bottom:4px;
}

.pen-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  background:var(--accent-soft, #efe3cc);
  color:var(--text-main);
  border:1px solid var(--border);
  font-weight:700;
}

.pen-btn:hover{
  background:#e8dcc3;
}

.handwriting-box{
  width:min(92vw, 560px);
}

.handwriting-input{
  min-height:220px;
  font-size:22px;
  line-height:1.45;
  padding:18px;
  border-radius:14px;
  background:#fffdfb;
}

#handwriting-target{
  background:#fffdfb;
}

@media (max-width: 768px){
  .handwriting-box{
    width:92vw;
    padding:20px;
  }

  .handwriting-input{
    min-height:180px;
    font-size:20px;
  }
}

/* ================= SCROLL PERFORMANCE ================= */
#planner-scroll{
  /* -webkit-overflow-scrolling: touch rimosso — causa moire su iOS moderno */
  scroll-behavior: auto;
}

.event-modal-box {
  width: min(92vw, 760px);
  max-height: 92svh;
  overflow-y: auto;
  padding: 24px;
  border-radius: 22px;
  background: #f7f3ed;
  -webkit-overflow-scrolling: touch;
}

.event-modal-title {
  margin: 0 0 18px;
  text-align: center;
  font-size: 24px;
  font-weight: 600;
  color: #3f3d46;
}

.event-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

.ev-suggestions {
  border: 1.5px solid #d8cfc2;
  border-radius: 14px;
  background: #fffdf9;
  max-height: 220px;
  overflow-y: auto;
  margin-top: -4px;
}

.ev-suggestions-header {
  font-size: 11px;
  font-weight: 700;
  color: #8a8275;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  padding: 8px 14px 4px;
}

.ev-suggestion-row {
  padding: 10px 14px;
  cursor: pointer;
  border-top: 1px solid #f0e9dc;
  display: flex;
  flex-direction: column;
  gap: 2px;
  transition: background 0.12s;
}

.ev-suggestion-row:first-of-type {
  border-top: none;
}

.ev-suggestion-row:hover,
.ev-suggestion-row:active {
  background: #f6efe0;
}

.ev-suggestion-name {
  font-size: 15px;
  font-weight: 600;
  color: #3f3d46;
}

.ev-suggestion-meta {
  font-size: 13px;
  color: #8a8275;
}

.ev-suggestion-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  background: #6b8e23;
  color: #fff;
  padding: 1px 6px;
  border-radius: 8px;
  margin-left: 6px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.ev-suggestion-badge-fuzzy {
  background: #c98a3a;
}

/* ANOMALIE MODAL */
.anomalies-tabs {
  display: flex;
  gap: 6px;
  border-bottom: 1px solid var(--border-soft, #e6dccb);
  padding: 12px 0 0;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.anomalies-tab {
  background: transparent;
  border: none;
  border-bottom: 3px solid transparent;
  padding: 10px 14px;
  font-size: 14px;
  color: #8a8275;
  cursor: pointer;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.anomalies-tab.active {
  color: #3f3d46;
  border-bottom-color: #6b8e23;
}

.anom-count {
  background: #e6dccb;
  color: #3f3d46;
  border-radius: 10px;
  padding: 1px 8px;
  font-size: 11px;
  font-weight: 700;
}

.anomalies-tab.active .anom-count {
  background: #6b8e23;
  color: #fff;
}

.anomalies-panel {
  max-height: 60vh;
  overflow-y: auto;
  overflow-x: hidden;
  width: 100%;
  box-sizing: border-box;
}

.anom-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  border: 1px solid #e6dccb;
  border-radius: 12px;
  margin-bottom: 8px;
  background: #fffdf9;
  box-sizing: border-box;
  width: 100%;
  overflow: hidden;
}

.anom-row-info {
  display: flex;
  flex-direction: column;
  gap: 3px;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
}

.anom-row-title {
  font-size: 15px;
  font-weight: 600;
  color: #3f3d46;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.anom-row-meta {
  font-size: 13px;
  color: #8a8275;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.anom-row-actions {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}

.anom-row-actions button {
  min-height: 36px;
  padding: 0 12px;
  border-radius: 10px;
  font-size: 13px;
}

.anom-empty {
  text-align: center;
  color: #8a8275;
  padding: 30px 10px;
  font-size: 14px;
}

.anom-group {
  border: 1px solid #e6dccb;
  border-radius: 12px;
  margin-bottom: 12px;
  padding: 12px 14px;
  background: #fffdf9;
  box-sizing: border-box;
  width: 100%;
  overflow: hidden;
}

.anom-group-header {
  font-size: 13px;
  color: #8a8275;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 8px;
  word-break: break-word;
}

.anom-group-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-top: 1px solid #f0e9dc;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

.anom-group-row:first-of-type {
  border-top: none;
}

.anom-group-row > label,
.anom-dup-label {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
}

.anom-group-row input[type="radio"] {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  accent-color: #6b8e23;
  cursor: pointer;
  margin: 0;
}

.anom-merge-actions {
  margin-top: 10px;
  display: flex;
  gap: 6px;
  justify-content: flex-end;
}

.anom-group-hint {
  font-size: 12px;
  color: #8a8275;
  margin-bottom: 10px;
  line-height: 1.4;
}

.anom-phone-picker {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #f0e9dc;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.anom-phone-picker-label {
  font-size: 11px;
  font-weight: 700;
  color: #c98a3a;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  width: 100%;
  margin-bottom: 2px;
}

.anom-phone-pick {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  font-size: 14px;
  color: #3f3d46;
  padding: 6px 10px;
  border: 1px solid #e6dccb;
  border-radius: 10px;
  background: #fffdf9;
}

.anom-phone-pick input[type="radio"] {
  width: 18px;
  height: 18px;
  accent-color: #6b8e23;
  margin: 0;
}

/* Forza l'overflow del modal-box quando usato per le anomalie */
#anomalies-modal .customers-modal-box {
  overflow-x: hidden;
}

.pencil-input,
.pencil-textarea {
  width: 100%;
  border: 1.5px solid #d8cfc2;
  border-radius: 16px;
  background: #fffdf9;
  color: #3f3d46;
  font-size: 18px;
  padding: 16px 18px;
  box-sizing: border-box;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}

.pencil-input {
  min-height: 58px;
}

.pencil-textarea {
  grid-column: 1 / -1;
  min-height: 180px;
  resize: vertical;
  line-height: 1.45;
}

.pencil-input:focus,
.pencil-textarea:focus {
  border-color: #c7a56a;
  box-shadow: 0 0 0 4px rgba(199, 165, 106, 0.14);
}

.event-modal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin-top: 18px;
}

.event-modal-actions button {
  min-width: 120px;
  min-height: 52px;
  padding: 12px 18px;
  border: none;
  border-radius: 14px;
  background: #c7a56a;
  color: white;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
}

.event-modal-actions button:hover {
  opacity: 0.92;
}

@media (max-width: 768px) {
  .event-form-grid {
    grid-template-columns: 1fr;
  }

  .pencil-textarea {
    grid-column: auto;
  }

  .event-modal-box {
    width: 94vw;
    padding: 18px;
  }

  .pencil-input,
  .pencil-textarea {
    font-size: 17px;
  }
}
/* ================= HANDWRITING PAD ================= */

#hw-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.45);
  z-index: 1000;
  align-items: flex-end;
  justify-content: center;
  padding-bottom: env(safe-area-inset-bottom, 0px);
}

#hw-overlay.hw-visible {
  display: flex;
}

#hw-panel {
  width: min(99vw, 960px);
  background: linear-gradient(180deg, #fbf9f6, #f3eee7);
  border-radius: 22px 22px 0 0;
  border: 1px solid var(--border-soft);
  border-bottom: none;
  box-shadow: 0 -8px 32px rgba(0,0,0,0.15);
  display: flex;
  flex-direction: column;
  gap: 0;
  overflow: hidden;
  max-height: 82vh;
}

#hw-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px 14px;
  background: var(--bg-header);
  border-bottom: 1px solid var(--border-soft);
  flex-shrink: 0;
}

#hw-label {
  flex: 1;
  font-size: 16px;
  font-weight: 700;
  color: var(--text-main);
}

#hw-toolbar button {
  padding: 10px 20px;
  font-size: 15px;
  font-weight: 600;
  border-radius: 12px;
  min-height: 46px;
}

#hw-recognize-btn {
  background: var(--accent);
  color: #fff;
}

#hw-recognize-btn:hover {
  background: var(--accent-dark);
}

#hw-clear-btn {
  background: #f0e8de;
}

#hw-done-btn {
  background: #e8e1d8;
}

#hw-canvas {
  flex: 1;
  width: 100%;
  min-height: 380px;
  max-height: 60vh;
  background: #fffdf9;
  cursor: crosshair;
  touch-action: none;
  display: block;
}

#hw-preview {
  min-height: 44px;
  padding: 12px 20px;
  font-size: 16px;
  color: var(--text-soft);
  text-align: center;
  background: var(--bg-panel);
  border-top: 1px solid var(--border-soft);
  white-space: pre-wrap;
  flex-shrink: 0;
}

/* ---- bottone scrittura accanto ad ogni campo ---- */

.hw-input-wrap {
  position: relative;
  display: flex;
  align-items: stretch;
  gap: 8px;
}

.hw-input-wrap .pencil-input,
.hw-input-wrap .pencil-textarea {
  flex: 1;
  min-width: 0;
}

.hw-trigger-btn {
  flex-shrink: 0;
  width: 48px;
  min-height: 48px;
  padding: 0;
  font-size: 14px;
  border-radius: 12px;
  background: var(--accent-soft);
  border: 1.5px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: none;
  align-self: flex-start;
}

.hw-trigger-btn:hover {
  background: #e8dcc3;
}

@media (max-width: 768px) {
  #hw-canvas {
    min-height: 320px;
  }

  #hw-panel {
    border-radius: 18px 18px 0 0;
    max-height: 88vh;
  }
}
/* ================= DIALOG CUSTOM ================= */

.dialog-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  backdrop-filter: blur(4px);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 10000;
  padding: 16px;
}

.dialog-overlay.open {
  display: flex;
}

.dialog-box {
  background: linear-gradient(180deg, #fbf9f6, #f3eee7);
  border: 1px solid var(--border-soft);
  border-radius: 20px;
  padding: 28px 26px 22px;
  width: min(400px, calc(100vw - 32px));
  box-shadow: 0 20px 60px rgba(0,0,0,0.18);
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.dialog-message {
  font-size: 16px;
  font-weight: 500;
  color: var(--text-main);
  text-align: center;
  line-height: 1.5;
  white-space: pre-wrap;
  margin: 0;
}

.dialog-input-wrap {
  width: 100%;
}

.dialog-input-wrap .pencil-input {
  font-size: 16px;
  text-align: center;
}

.dialog-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-top: 4px;
}

.dialog-buttons button {
  min-width: 110px;
  min-height: 48px;
  font-size: 15px;
  font-weight: 600;
  border-radius: 14px;
  flex: 1;
}

.dialog-btn-primary {
  background: var(--accent) !important;
  color: #fff !important;
}

.dialog-btn-primary:hover {
  background: var(--accent-dark) !important;
}

.dialog-btn-danger {
  background: #d94f3d !important;
  color: #fff !important;
}

.dialog-btn-danger:hover {
  background: #c0402f !important;
}

@media (max-width: 560px) {
  .dialog-box {
    padding: 22px 18px 18px;
    border-radius: 16px;
  }

  .dialog-buttons button {
    min-width: calc(50% - 5px);
  }
}

/* ================= LINEA ORA CORRENTE ================= */

#current-time-line {
  pointer-events: none;
}
/* ================= CLIENTI ================= */

.customers-modal-box {
  width: min(92vw, 680px);
  max-height: 88vh;
  overflow-y: auto;
  padding: 24px;
  border-radius: 22px;
  background: #f7f3ed;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.customers-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.customers-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-height: 55vh;
  overflow-y: auto;
}

.customer-row {
  background: #fff;
  border: 1px solid var(--border-soft);
  border-radius: 12px;
  padding: 12px 16px;
  cursor: pointer;
  transition: background .12s;
  display: flex;
  align-items: center;
  gap: 10px;
}

.customer-row:hover {
  background: #f0ebe3;
}

.customer-name {
  font-size: 15px;
  font-weight: 700;
  color: var(--text-main);
}

.customer-info {
  font-size: 12px;
  color: var(--text-soft);
  margin-top: 2px;
}

.customer-form {
  background: #fff;
  border: 1px solid var(--border-soft);
  border-radius: 16px;
  padding: 20px;
}

/* ================= AUTOCOMPLETE ================= */

.autocomplete-dropdown {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.autocomplete-item {
  padding: 10px 16px;
  cursor: pointer;
  border-bottom: 1px solid var(--border-soft);
  transition: background .1s;
}

.autocomplete-item:last-child {
  border-bottom: none;
}

.autocomplete-item.ac-active,
.autocomplete-item:hover {
  background: #f0ebe3;
}

.ac-name {
  font-size: 14px;
  font-weight: 600;
  color: #36312d;
}

.ac-info {
  font-size: 12px;
  color: #777068;
  margin-top: 1px;
}

@media (max-width: 768px) {
  .customers-modal-box {
    width: 94vw;
    padding: 18px;
  }

  .customers-header {
    flex-direction: column;
    align-items: stretch;
  }

  .customers-header input {
    width: 100% !important;
  }
}

/* ================= IMPOSTAZIONI COLONNA ================= */

.col-settings-box {
  width: min(96vw, 740px);
  padding: 28px 30px 22px;
  border-radius: 22px;
  background: #f7f3ed;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.col-settings-section {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.col-settings-label {
  font-size: 13px;
  font-weight: 700;
  color: var(--text-soft);
  text-transform: uppercase;
  letter-spacing: .5px;
}

.col-color-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.col-color-swatch {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 3px solid transparent;
  cursor: pointer;
  transition: transform .12s, border-color .12s;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

.col-color-swatch:hover {
  transform: scale(1.12);
}

.col-color-swatch.selected {
  border-color: #2f2b27;
  transform: scale(1.15);
}

.col-shift-row {
  display: flex;
  gap: 14px;
  align-items: flex-end;
  flex-wrap: wrap;
}

.col-shift-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.col-shift-label {
  font-size: 12px;
  font-weight: 600;
  color: var(--text-soft);
}

/* Tag servizio sulla card evento */
.event-duration-label {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-soft);
  margin-left: 5px;
  opacity: .8;
}

.event-service-tag {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  color: var(--accent-dark);
  background: var(--accent-soft);
  border-radius: 6px;
  padding: 2px 7px;
  margin-top: 3px;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Pulsante picker servizi nel modal evento */
.ev-services-btn {
  grid-column: 1 / -1;
  text-align: left !important;
  cursor: pointer;
  min-height: 58px;
  font-size: 16px;
  color: var(--text-soft);
  background: #fffdf9;
  border: 1.5px solid #d8cfc2;
  border-radius: 16px;
  padding: 16px 18px;
  transition: border-color .15s, background .15s;
}
.ev-services-btn:hover {
  border-color: var(--accent);
  background: #fffef9;
}


.event-service-tag2 {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  color: #1a6b6b;
  background: #d0eeee;
  border-radius: 6px;
  padding: 2px 7px;
  margin-top: 2px;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Badge categoria nella lista servizi */
.srv-cat-badge {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  border-radius: 6px;
  padding: 2px 8px;
  margin-left: auto;
  flex-shrink: 0;
}
.srv-cat-1 {
  color: var(--accent-dark);
  background: var(--accent-soft);
}
.srv-cat-2 {
  color: #1a6b6b;
  background: #d0eeee;
}

/* Picker servizi (overlay sopra modal evento) */
.srv-picker-item {
  display: inline-flex;
  align-items: center;
  padding: 10px 20px;
  border-radius: 999px;
  border: 1.5px solid var(--border-soft);
  background: var(--bg-main);
  cursor: pointer;
  font-size: 15px;
  font-weight: 500;
  color: var(--text-main);
  transition: border-color .12s, background .12s, color .12s;
  min-height: 44px;
}
.srv-picker-item:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
}
.srv-picker-selected {
  background: var(--accent-soft);
  border-color: var(--accent);
  color: var(--accent-dark);
  font-weight: 700;
}
.srv-picker-selected:hover { background: #e5d4b0; }
.srv-picker-sel-badge {
  font-size: 12px;
  font-weight: 600;
  background: rgba(255,255,255,.6);
  border-radius: 20px;
  padding: 3px 10px;
  color: inherit;
}

/* ── Modal servizi ── */

/* Contenitore unico: sezioni verticali una sotto l'altra */
.srv-two-cols {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 8px;
}

/* Una sezione per categoria */
.srv-col {
  border-bottom: 1px solid var(--border-soft);
}
.srv-col:last-child { border-bottom: none; }

/* Intestazione sezione: solo una striscia sottile con accent color laterale */
.srv-col-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 4px 8px;
  gap: 10px;
}

/* Accent color: solo un punto colorato + testo, niente background pieno */
.srv-col-header-1 .srv-col-title { color: var(--accent-dark); }
.srv-col-header-2 .srv-col-title { color: #1a7070; }
.srv-col-header-3 .srv-col-title { color: #7b3fa0; }
.srv-col-header-4 .srv-col-title { color: #a05020; }

/* Intestazione senza background pesante */
.srv-col-header-1,
.srv-col-header-2,
.srv-col-header-3,
.srv-col-header-4 {
  background: none;
}

.srv-col-title {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  border-radius: 8px;
  padding: 4px 8px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .05em;
  text-transform: uppercase;
  transition: background .12s;
  flex: 1;
}
.srv-col-title::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.srv-col-header-1 .srv-col-title::before { background: var(--accent); }
.srv-col-header-2 .srv-col-title::before { background: #3aadad; }
.srv-col-header-3 .srv-col-title::before { background: #b07ad0; }
.srv-col-header-4 .srv-col-title::before { background: #d08040; }

.srv-col-title:hover { background: #f0ebe3; }
.srv-col-title .srv-rename-hint {
  font-size: 12px;
  font-weight: 400;
  opacity: 0;
  transition: opacity .12s;
  margin-left: 4px;
}
.srv-col-title:hover .srv-rename-hint { opacity: .6; }

/* Pulsanti azione intestazione */
.srv-add-btn {
  background: none;
  border: 1.5px solid var(--border-soft);
  border-radius: 10px;
  padding: 5px 12px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  color: var(--text-soft);
  transition: border-color .12s, color .12s, background .12s;
  white-space: nowrap;
}
.srv-add-btn:hover {
  border-color: var(--accent);
  color: var(--accent-dark);
  background: var(--accent-soft);
}

/* Pulsante elimina lista: solo icona, discreta */
.srv-del-cat {
  border: none !important;
  padding: 5px 8px !important;
  color: var(--text-soft) !important;
  background: none !important;
  font-size: 14px !important;
  opacity: .4;
  transition: opacity .12s !important;
}
.srv-del-cat:hover {
  opacity: 1 !important;
  color: #c0392b !important;
  background: #fdecea !important;
}

/* Lista voci */
.srv-col-list {
  padding: 0 4px 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

/* Voce come chip/pill — non come riga intera */
.srv-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border-radius: 999px;
  background: var(--bg-main);
  border: 1.5px solid var(--border-soft);
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-main);
  transition: border-color .12s, background .12s;
}
.srv-item:hover {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.srv-item-name { font-weight: 500; }

.srv-item-edit {
  font-size: 12px;
  color: var(--text-soft);
  opacity: 0;
  transition: opacity .12s;
}
.srv-item:hover .srv-item-edit { opacity: .7; }

.srv-empty {
  font-size: 13px;
  color: var(--text-soft);
  padding: 4px 0 10px;
  font-style: italic;
}

/* Toggle "tecnologia" sui servizi (solo Rubano) */
.srv-item-tech-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;height:22px;
  border-radius:50%;
  background:rgba(0,0,0,0.04);
  border:1.5px solid var(--border-soft);
  font-size:12px;line-height:1;
  color:var(--text-soft);
  margin-left:2px;
  cursor:pointer;
  transition:all .12s ease;
}
.srv-item-tech-toggle:hover{
  background:rgba(0,0,0,0.08);
  color:var(--text-main);
}
.srv-item-tech-toggle.on{
  background:#fff2c4;
  border-color:#d8b13b;
  color:#7a5800;
  box-shadow:0 0 0 2px rgba(216,177,59,0.18);
}
.srv-item.is-tech{
  border-color:#d8b13b;
  background:#fff8e1;
}


@media (max-width: 560px) {
  .col-settings-box {
    width: calc(100vw - 16px);
    padding: 20px 14px;
    border-radius: 16px;
  }

  .col-shift-row {
    flex-direction: column;
    gap: 10px;
  }
}
/* ── Menu badge sede ── */
.loc-menu-item {
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-main);
  border-radius: 10px;
  cursor: pointer;
  transition: background .1s;
}
.loc-menu-item:hover { background: var(--accent-soft); }
.loc-menu-danger { color: #c0392b; }
.loc-menu-danger:hover { background: #fdecea; }
.loc-menu-sep {
  height: 1px;
  background: var(--border-soft);
  margin: 2px 0;
}

/* ================= DESKTOP SCROLL GRAB ================= */

/* Hint visivo: cursore grab quando Alt è premuto */
#planner-scroll {
  /* Il cursore grab viene applicato via JS durante il drag */
}

/* Scrollbar desktop: visibile e cliccabile */
@media (pointer: fine) {
  #planner-scroll {
    scrollbar-width: auto;         /* Firefox */
    scrollbar-color: #b8b0a6 #e4ddd6;
  }

  #planner-scroll::-webkit-scrollbar {
    width: 14px;
    height: 14px;                  /* scrollbar orizzontale più alta */
  }

  #planner-scroll::-webkit-scrollbar-thumb {
    background: #b8b0a6;
    border-radius: 999px;
    border: 3px solid transparent;
    background-clip: padding-box;
    min-width: 40px;               /* thumb non troppo piccolo */
  }

  #planner-scroll::-webkit-scrollbar-thumb:hover {
    background: #9e9690;
    border: 3px solid transparent;
    background-clip: padding-box;
  }

  #planner-scroll::-webkit-scrollbar-thumb:active {
    background: #857f7a;
  }

  #planner-scroll::-webkit-scrollbar-track {
    background: #e4ddd6;
    border-radius: 999px;
  }

  #planner-scroll::-webkit-scrollbar-corner {
    background: #e4ddd6;
  }

  /* Cursore grab su sfondo griglia per indicare che si può trascinare */
  #planner-scroll {
    cursor: grab;
  }
  #planner-scroll:active {
    cursor: grabbing;
  }
  /* Ma non sugli eventi — quelli hanno il loro cursore */
  #planner-scroll .appointment-item {
    cursor: grab;
  }
  #planner-scroll .grid-cell {
    cursor: crosshair;
  }

/* ================= NOTE PER OGGI ================= */

.daily-notes-trigger{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 14px;
  background:linear-gradient(135deg,#3D8BD8 0%,#2F6FB6 100%);
  color:#fff;
  border-radius:999px;
  font-size:13px;
  font-weight:600;
  letter-spacing:.01em;
  box-shadow:0 4px 14px rgba(45,108,180,0.28);
}
.daily-notes-trigger:hover{
  background:linear-gradient(135deg,#4894E0 0%,#3478C2 100%);
  box-shadow:0 6px 18px rgba(45,108,180,0.34);
}
.daily-notes-trigger.has-notes{
  background:linear-gradient(135deg,#2F6FB6 0%,#225392 100%);
  box-shadow:0 4px 16px rgba(45,108,180,0.42), inset 0 0 0 2px rgba(255,255,255,0.4);
}
.daily-notes-trigger-label{
  white-space:nowrap;
}

.daily-notes-box{
  width:min(94vw, 760px);
  max-height:92vh;
  overflow-y:auto;
  padding:0;
  background:linear-gradient(180deg,#2E72BD 0%,#2563A2 100%);
  border:1px solid #1f5694;
  border-radius:24px;
  box-shadow:0 30px 80px rgba(20,55,100,0.45);
  color:#fff;
}

.daily-notes-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:26px 32px 18px;
  border-bottom:1px solid rgba(255,255,255,0.22);
}
.daily-notes-eyebrow{
  font-size:12px;
  font-weight:700;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.82);
}
.daily-notes-title{
  margin:6px 0 0;
  font-size:24px;
  font-weight:700;
  color:#fff;
  letter-spacing:.01em;
}
.daily-notes-close-btn{
  width:42px;height:42px;
  padding:0;
  border-radius:50%;
  background:rgba(255,255,255,0.14);
  color:#fff;
  font-size:24px;
  line-height:1;
  box-shadow:none;
}
.daily-notes-close-btn:hover{
  background:rgba(255,255,255,0.24);
}

.daily-notes-body{
  display:flex;
  flex-direction:column;
  gap:18px;
  padding:24px 32px 8px;
}

.daily-notes-list{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.daily-notes-row{
  display:grid;
  grid-template-columns:72px 1fr auto auto 36px;
  grid-template-areas:
    "label input bell done remove"
    ".     meta  meta meta   meta";
  gap:10px 14px;
  align-items:center;
  padding:6px;
  border-radius:16px;
  transition:background .2s, box-shadow .2s;
}
.daily-notes-row-label{ grid-area:label; }
.daily-notes-input{ grid-area:input; }
.daily-notes-bell-btn{ grid-area:bell; }
.daily-notes-done-btn{ grid-area:done; }
.daily-notes-done-label{ grid-area:meta; }
.daily-notes-remove-btn{ grid-area:remove; }

/* Riga urgente: cornice/sfondo rosso */
.daily-notes-row.is-urgent{
  background:rgba(231,76,60,0.18);
  box-shadow:inset 0 0 0 1.5px rgba(255,120,110,0.75);
}
/* Riga svolta: sbiadita ma leggibile (niente barratura) */
.daily-notes-row.is-done{
  opacity:.68;
}
.daily-notes-row.is-done .daily-notes-input{
  background:rgba(255,255,255,0.82);
  color:#3a4658;
}

/* Campanellino urgenza */
.daily-notes-bell-btn{
  width:40px;height:40px;
  padding:0;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,0.14);
  border:1px solid rgba(255,255,255,0.28);
  color:rgba(255,255,255,0.78);
  line-height:0;
  cursor:pointer;
  box-shadow:none;
  transition:transform .15s, background .2s, color .2s;
}
.daily-notes-bell-btn:hover{ background:rgba(255,255,255,0.26); color:#fff; transform:scale(1.08); }
.daily-notes-bell-btn.active{
  background:#e74c3c;
  border-color:#ff8a7a;
  color:#fff;
  box-shadow:0 0 0 3px rgba(231,76,60,0.35);
  animation:bell-swing 1.2s ease-in-out infinite;
}
@keyframes bell-swing{
  0%,100%{ transform:rotate(0deg); }
  20%{ transform:rotate(14deg); }
  40%{ transform:rotate(-12deg); }
  60%{ transform:rotate(8deg); }
  80%{ transform:rotate(-5deg); }
}

/* Bottone "Fatto" */
.daily-notes-done-btn{
  padding:9px 16px;
  border-radius:12px;
  background:#2ecc71;
  color:#0b2a16;
  font-size:13.5px;
  font-weight:700;
  letter-spacing:.02em;
  cursor:pointer;
  border:none;
  box-shadow:0 3px 10px rgba(0,0,0,0.18);
  white-space:nowrap;
}
.daily-notes-done-btn:hover{ background:#3fe084; }

/* Etichetta "Svolta da Nome Cognome" */
.daily-notes-done-label{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:13px;
  font-weight:600;
  color:#d6ffe2;
  padding-left:2px;
}
.daily-notes-done-label svg{ flex:none; }
.daily-notes-remove-btn{
  width:36px;height:36px;
  padding:0;
  border-radius:50%;
  background:rgba(255,255,255,0.14);
  color:#fff;
  font-size:22px;
  line-height:1;
  border:1px solid rgba(255,255,255,0.22);
  box-shadow:none;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.daily-notes-remove-btn:hover{
  background:rgba(255,90,90,0.85);
  border-color:rgba(255,255,255,0.4);
}
.daily-notes-add-btn{
  margin-top:18px;
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:12px 20px;
  background:rgba(255,255,255,0.14);
  color:#fff;
  border:1px dashed rgba(255,255,255,0.55);
  border-radius:14px;
  font-size:14.5px;
  font-weight:600;
  letter-spacing:.02em;
  cursor:pointer;
  box-shadow:none;
}
.daily-notes-add-btn:hover{
  background:rgba(255,255,255,0.22);
  border-color:rgba(255,255,255,0.85);
}
.daily-notes-add-plus{
  font-size:20px;
  line-height:1;
  font-weight:700;
}
.daily-notes-row-label{
  font-size:13.5px;
  font-weight:700;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.92);
}
.daily-notes-input{
  width:100%;
  background:rgba(255,255,255,0.96);
  color:#1b2533;
  border:1px solid rgba(255,255,255,0.3);
  border-radius:14px;
  padding:18px 20px;
  font-size:17px;
  font-weight:500;
  min-height:60px;
}
.daily-notes-input:focus{
  outline:none;
  border-color:#ffd966;
  box-shadow:0 0 0 3px rgba(255,217,102,0.35);
  background:#fff;
}

.daily-notes-actions{
  display:flex;
  gap:12px;
  justify-content:flex-end;
  padding:18px 32px 26px;
  border-top:1px solid rgba(255,255,255,0.22);
  margin-top:14px;
}
.daily-notes-btn-ghost{
  background:rgba(255,255,255,0.12);
  color:#fff;
  border:1px solid rgba(255,255,255,0.28);
  font-weight:600;
  padding:12px 22px;
  border-radius:14px;
  font-size:15px;
  box-shadow:none;
}
.daily-notes-btn-ghost:hover{
  background:rgba(255,255,255,0.2);
}
.daily-notes-btn-primary{
  background:#ffd966;
  color:#1b2533;
  font-weight:700;
  padding:12px 28px;
  border-radius:14px;
  font-size:15px;
  box-shadow:0 4px 12px rgba(0,0,0,0.16);
}
.daily-notes-btn-primary:hover{
  background:#ffe082;
}

/* ===== Lampeggio lento del bottone "note per oggi" (giorno con urgenza) ===== */
.daily-notes-trigger.note-urgent-blink{
  animation:note-btn-blink 1.8s ease-in-out infinite;
}
@keyframes note-btn-blink{
  0%,100%{
    background:linear-gradient(135deg,#3D8BD8 0%,#2F6FB6 100%);
    box-shadow:0 4px 14px rgba(45,108,180,0.28);
  }
  50%{
    background:linear-gradient(135deg,#e74c3c 0%,#c0392b 100%);
    box-shadow:0 0 0 4px rgba(231,76,60,0.35), 0 6px 20px rgba(231,76,60,0.5);
  }
}

/* ===== Banner alert note urgenti (globale, sopra l'agenda) ===== */
.urgent-notes-alert{
  display:none;
  position:fixed;
  top:var(--header-h);
  left:0;
  right:0;
  z-index:150;
  align-items:center;
  gap:10px;
  padding:12px 20px;
  background:linear-gradient(135deg,#e74c3c 0%,#c0392b 100%);
  color:#fff;
  font-size:15px;
  font-weight:700;
  letter-spacing:.01em;
  box-shadow:0 4px 14px rgba(192,57,43,0.4);
  animation:urgent-banner-pulse 1.8s ease-in-out infinite;
}
.urgent-notes-alert.show{ display:flex; }
.urgent-notes-alert-icon{
  display:inline-flex;
  align-items:center;
  line-height:0;
}
.urgent-notes-alert-text{
  display:inline-flex;
  flex-wrap:wrap;
  align-items:center;
  gap:2px;
}
.urgent-notes-alert-day{
  background:rgba(255,255,255,0.2);
  color:#fff;
  border:1px solid rgba(255,255,255,0.55);
  border-radius:8px;
  padding:3px 10px;
  margin:0 2px;
  font-weight:700;
  font-size:14px;
  cursor:pointer;
  box-shadow:none;
}
.urgent-notes-alert-day:hover{ background:rgba(255,255,255,0.34); }
@keyframes urgent-banner-pulse{
  0%,100%{ filter:brightness(1); }
  50%{ filter:brightness(1.16); }
}

/* ===== Form "Fatto" (operatore) ===== */
.note-done-box{
  width:min(94vw, 460px);
  padding:0;
  background:linear-gradient(180deg,#2E72BD 0%,#2563A2 100%);
  border:1px solid #1f5694;
  border-radius:24px;
  box-shadow:0 30px 80px rgba(20,55,100,0.45);
  color:#fff;
}
.note-done-body{
  display:flex;
  flex-direction:column;
  gap:16px;
  padding:24px 32px 8px;
}
.note-done-nota{
  background:rgba(255,255,255,0.14);
  border:1px solid rgba(255,255,255,0.24);
  border-radius:12px;
  padding:12px 14px;
  font-size:14.5px;
  font-weight:600;
  color:#eaf3ff;
}
.note-done-field{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.note-done-field > span{
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.85);
}
.note-done-field input{
  width:100%;
  background:rgba(255,255,255,0.96);
  color:#1b2533;
  border:1px solid rgba(255,255,255,0.3);
  border-radius:12px;
  padding:13px 16px;
  font-size:16px;
  font-weight:500;
}
.note-done-field input:focus{
  outline:none;
  border-color:#ffd966;
  box-shadow:0 0 0 3px rgba(255,217,102,0.35);
  background:#fff;
}

@media (max-width: 640px){
  .daily-notes-row{
    grid-template-columns:1fr auto auto 36px;
    grid-template-areas:
      "label  label  label  remove"
      "input  input  input  input"
      "bell   done   meta   meta";
    gap:8px;
  }
  .urgent-notes-alert{ font-size:13.5px; padding:10px 14px; }
  .daily-notes-header,
  .daily-notes-body,
  .daily-notes-actions,
  .note-done-body{
    padding-left:20px;padding-right:20px;
  }
  .daily-notes-trigger-label{
    font-size:12.5px;
  }
  .daily-notes-input{
    font-size:16px;
    padding:14px 16px;
    min-height:54px;
  }
}
}
/* ================= HOME / SELEZIONE MODULO ================= */
.home-screen{
  position:fixed;
  inset:0;
  background:rgba(244,241,236,0.96);
  backdrop-filter:blur(10px);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:32px 20px;
  overflow-y:auto;
  z-index:9990;
}
.home-inner{
  width:100%;
  max-width:760px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:26px;
}
.home-logo{
  width:240px;
  max-width:64vw;
  height:auto;
}
.home-crm-btn{
  min-width:200px;
  padding:13px 40px;
  background:linear-gradient(135deg,var(--accent) 0%,var(--accent-dark) 100%);
  color:#fff;
  border:none;
  border-radius:16px;
  font-size:24px;
  font-weight:800;
  letter-spacing:.12em;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(199,165,106,0.38);
  transition:transform .15s, box-shadow .2s;
}
.home-crm-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(199,165,106,0.48);
}
.home-columns{
  width:100%;
  display:flex;
  gap:20px;
  align-items:stretch;
}
.home-col{
  flex:1 1 0;
  display:flex;
  flex-direction:column;
  gap:14px;
  background:linear-gradient(180deg,var(--bg-panel),#f3eee7);
  border:1px solid var(--border-soft);
  border-radius:20px;
  padding:22px 20px;
  box-shadow:0 8px 24px rgba(0,0,0,0.06);
}
.home-col-title{
  text-align:center;
  font-size:13px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--accent-dark);
  padding-bottom:6px;
  border-bottom:1px solid var(--border-soft);
}
.home-tile{
  width:100%;
  padding:18px 16px;
  background:#fff;
  color:var(--text-main);
  border:1px solid var(--border-soft);
  border-radius:14px;
  font-size:16px;
  font-weight:600;
  cursor:pointer;
  transition:transform .12s, border-color .2s, background .2s, box-shadow .2s;
}
.home-tile:hover{
  transform:translateY(-2px);
  background:var(--accent-soft);
  border-color:var(--accent);
  box-shadow:0 6px 16px rgba(199,165,106,0.28);
}

/* Titolo modulo nel lock screen + ritorno alla home */
.lock-title{
  font-size:17px;
  font-weight:700;
  color:var(--text-main);
  text-align:center;
}
.lock-back-btn{
  background:transparent !important;
  color:var(--text-soft) !important;
  border:none !important;
  font-weight:600 !important;
  padding:4px !important;
  font-size:13px !important;
}
.lock-back-btn:hover{
  color:var(--accent-dark) !important;
  transform:none !important;
}

/* Placeholder "modulo in arrivo" */
.module-placeholder{
  position:fixed;
  inset:0;
  background:rgba(244,241,236,0.96);
  backdrop-filter:blur(10px);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  text-align:center;
  padding:24px;
  z-index:9990;
}
.module-placeholder h2{
  margin:6px 0 0;
  font-size:26px;
  font-weight:800;
  color:var(--text-main);
}
.module-placeholder p{
  margin:0;
  font-size:15px;
  color:var(--text-soft);
}
.module-placeholder .home-back-btn{
  margin-top:10px;
  padding:12px 24px;
  background:var(--accent);
  color:#fff;
  border:none;
  border-radius:14px;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
}
.module-placeholder .home-back-btn:hover{ background:var(--accent-dark); }

@media (max-width: 680px){
  .home-columns{ flex-direction:column; }
  .home-crm-btn{ font-size:21px; }
  .home-logo{ width:180px; }
}

/* ================= GESTIONALE CLIENTI ================= */
.gest-screen{
  position:fixed;
  inset:0;
  background:var(--bg-main);
  display:flex;
  flex-direction:column;
  z-index:9980;
}
.gest-header{
  display:flex;
  align-items:center;
  gap:16px;
  padding:14px 22px;
  background:var(--bg-panel);
  border-bottom:1px solid var(--border-soft);
}
.gest-logo{ height:42px; width:auto; }
.gest-title{
  font-size:18px;
  font-weight:700;
  color:var(--text-main);
}
.gest-back{
  margin-left:auto;
  background:rgba(0,0,0,0.04);
  color:var(--text-main);
  border:1px solid var(--border-soft);
  border-radius:12px;
  padding:9px 16px;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
}
.gest-back:hover{ background:var(--accent-soft); border-color:var(--accent); }
.gest-toolbar{
  display:flex;
  gap:12px;
  padding:16px 22px;
  align-items:center;
}
.gest-search{
  flex:1;
  border:1px solid var(--border);
  background:#fff;
  border-radius:12px;
  padding:12px 16px;
  font-size:15px;
  color:var(--text-main);
}
.gest-search:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(199,165,106,0.2); }
.gest-add-btn{
  background:var(--accent);
  color:#fff;
  border:none;
  border-radius:12px;
  padding:12px 20px;
  font-size:14px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}
.gest-add-btn:hover{ background:var(--accent-dark); }
.gest-list{
  flex:1;
  overflow-y:auto;
  padding:0 22px 22px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.gest-empty{ text-align:center; color:var(--text-soft); padding:30px; font-size:14px; }
.gest-row{
  background:#fff;
  border:1px solid var(--border-soft);
  border-radius:12px;
  padding:14px 16px;
  cursor:pointer;
  transition:border-color .15s, box-shadow .15s, transform .1s;
}
.gest-row:hover{ border-color:var(--accent); box-shadow:0 4px 12px rgba(199,165,106,0.18); transform:translateY(-1px); }
.gest-row-name{ font-size:16px; font-weight:600; color:var(--text-main); }
.gest-row-info{ font-size:13px; color:var(--text-soft); margin-top:2px; }

/* Scheda cliente */
.gest-client-box{
  width:min(96vw, 720px);
  max-height:92vh;
  overflow-y:auto;
  background:var(--bg-panel);
  border:1px solid var(--border-soft);
  border-radius:22px;
  padding:0;
}
.gest-client-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:22px 26px 14px;
  border-bottom:1px solid var(--border-soft);
  position:sticky;
  top:0;
  background:var(--bg-panel);
  z-index:2;
}
.gest-client-title{ margin:0; font-size:22px; font-weight:700; color:var(--text-main); }
.gest-client-header .daily-notes-close-btn{ background:rgba(0,0,0,0.05); color:var(--text-main); }
.gest-client-header .daily-notes-close-btn:hover{ background:rgba(0,0,0,0.1); }
.gest-client-body{ padding:18px 26px 26px; display:flex; flex-direction:column; gap:22px; }
.gest-section{ display:flex; flex-direction:column; gap:12px; }
.gest-section-title{
  font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent-dark);
}
.gest-section-measure{
  background:#fff; border:1px solid var(--border-soft); border-radius:16px; padding:18px;
}
.gest-form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.gest-field{ display:flex; flex-direction:column; gap:5px; }
.gest-field-wide{ grid-column:1 / -1; }
.gest-field > span{ font-size:12px; font-weight:600; color:var(--text-soft); }
.gest-field input{
  border:1px solid var(--border); background:#fff; border-radius:10px;
  padding:10px 12px; font-size:15px; color:var(--text-main);
}
.gest-field input:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(199,165,106,0.18); }
.gest-section-actions{ display:flex; justify-content:flex-end; gap:10px; }
.gest-btn-primary{
  background:var(--accent); color:#fff; border:none; border-radius:12px;
  padding:11px 22px; font-size:14px; font-weight:700; cursor:pointer;
}
.gest-btn-primary:hover{ background:var(--accent-dark); }
.gest-btn-ghost{
  background:rgba(0,0,0,0.04); color:var(--text-main); border:1px solid var(--border-soft);
  border-radius:12px; padding:10px 16px; font-size:14px; font-weight:600; cursor:pointer;
}
.gest-btn-ghost:hover{ background:var(--accent-soft); border-color:var(--accent); }
.gest-btn-link{
  background:none; border:none; color:var(--accent-dark); font-weight:600;
  font-size:13px; cursor:pointer; padding:4px 6px;
}
.gest-btn-link:hover{ text-decoration:underline; }
.gest-danger{ color:#c0392b; }

.gest-measure-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.gest-measure-rows{ display:flex; flex-direction:column; gap:8px; }
.gest-measure-row{ display:grid; grid-template-columns:1fr 130px 36px; gap:8px; align-items:center; }
.gest-measure-row select, .gest-measure-row input{
  border:1px solid var(--border); background:#fff; border-radius:10px;
  padding:9px 11px; font-size:14px; color:var(--text-main);
}
.gest-row-x{
  width:36px; height:36px; flex:none; padding:0;
  display:flex; align-items:center; justify-content:center;
  border-radius:8px; border:1px solid var(--border-soft);
  background:#fff; color:#c0392b; font-size:18px; cursor:pointer; line-height:1;
}
.gest-row-x:hover{ background:#fdecec; }
.gest-measure-controls{ display:flex; gap:14px; align-items:center; }
.gest-photo-row{ display:flex; align-items:center; gap:12px; }
.gest-photo-label{ cursor:pointer; }
.gest-photo-name{ font-size:13px; color:var(--text-soft); }

/* Storico */
.gest-history{ display:flex; flex-direction:column; gap:10px; }
.gest-hist-card{
  background:#fff; border:1px solid var(--border-soft); border-radius:12px; padding:12px 14px;
}
.gest-hist-top{ display:flex; align-items:center; gap:10px; }
.gest-hist-date{ font-size:13px; font-weight:700; color:var(--text-main); }
.gest-sede-chip{
  font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  background:var(--accent-soft); color:var(--accent-dark);
  border-radius:20px; padding:3px 10px;
}
.gest-hist-del{
  margin-left:auto; width:28px; height:28px; flex:none; padding:0;
  display:flex; align-items:center; justify-content:center;
  border-radius:7px; border:none;
  background:transparent; color:var(--text-soft); font-size:18px; cursor:pointer; line-height:1;
}
.gest-hist-del:hover{ background:#fdecec; color:#c0392b; }
.gest-hist-vals{ display:flex; flex-wrap:wrap; gap:8px 16px; margin-top:8px; }
.gest-val{ font-size:14px; color:var(--text-main); }
.gest-val b{ color:var(--text-soft); font-weight:600; font-size:12px; text-transform:uppercase; letter-spacing:.04em; margin-right:4px; }
.gest-hist-actions{ margin-top:8px; }

/* Tipi di misura */
.gest-types-box{ width:min(94vw, 460px); background:var(--bg-panel); border:1px solid var(--border-soft); border-radius:22px; padding:0; }
.gest-types-body{ padding:18px 24px 24px; display:flex; flex-direction:column; gap:12px; }
.gest-types-hint{ margin:0; font-size:13px; color:var(--text-soft); }
.gest-types-list{ display:flex; flex-direction:column; gap:8px; max-height:46vh; overflow-y:auto; }
.gest-type-row{ display:flex; align-items:center; gap:8px; }
.gest-types-input{ flex:1; border:1px solid var(--border); background:#fff; border-radius:10px; padding:9px 12px; font-size:14px; color:var(--text-main); }
.gest-types-add{ display:flex; gap:8px; border-top:1px solid var(--border-soft); padding-top:12px; }

/* Visualizza foto */
#gest-photo-modal{ background:rgba(0,0,0,0.8); }
.gest-photo-viewer{ position:relative; max-width:94vw; max-height:90vh; }
.gest-photo-viewer img{ max-width:94vw; max-height:90vh; border-radius:12px; display:block; }
.gest-photo-close{ position:absolute; top:-14px; right:-14px; background:#fff !important; color:#222 !important; }

@media (max-width: 680px){
  .gest-form-grid, .gest-measure-grid{ grid-template-columns:1fr; }
  .gest-toolbar{ flex-direction:column; align-items:stretch; }
  .gest-title{ font-size:15px; }
}

/* Le modali del gestionale devono stare SOPRA la schermata gestionale (z-index 9980) */
#gest-client-modal, #gest-types-modal{ z-index:9995; }
#gest-photo-modal{ z-index:9996; }

/* Unità di misura nei tipi + note misurazione */
.gest-types-unit{
  width:104px; flex:none;
  border:1px solid var(--border); background:#fff; border-radius:10px;
  padding:9px 8px; font-size:14px; color:var(--text-main);
}
.gest-note-field textarea{
  border:1px solid var(--border); background:#fff; border-radius:10px;
  padding:10px 12px; font-size:15px; color:var(--text-main);
  resize:vertical; font-family:inherit; min-height:46px;
}
.gest-note-field textarea:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(199,165,106,0.18); }
.gest-hist-note{ margin-top:8px; font-size:13px; color:var(--text-soft); font-style:italic; }

/* ================= VENDITE (sistema a monete) ================= */
.ev-sale-btn{
  color:var(--accent-dark);
  font-weight:600;
}
.ev-sale-btn:hover{ background:var(--accent-soft); }

.sale-box{ max-width:520px; width:92vw; max-height:85vh; overflow-y:auto; padding:24px 26px; background:#f7f3ed; border-radius:22px; box-shadow:0 30px 80px rgba(20,30,50,0.3); }
.sale-list{ display:flex; flex-direction:column; gap:8px; }
.sale-item{
  display:flex; align-items:center; gap:12px; width:100%;
  background:#fff; border:1px solid var(--border-soft); border-radius:12px;
  padding:13px 15px; cursor:pointer; text-align:left;
  transition:border-color .12s, box-shadow .12s, transform .1s;
}
.sale-item:hover{ border-color:var(--accent); box-shadow:0 4px 12px rgba(199,165,106,0.18); transform:translateY(-1px); }
.sale-dot{ width:14px; height:14px; border-radius:50%; flex:none; box-shadow:inset 0 0 0 1px rgba(0,0,0,0.08); }
.sale-item-label{ flex:1; font-size:15px; font-weight:600; color:var(--text-main); }
.sale-item-pts{
  flex:none; font-size:14px; font-weight:800; color:var(--accent-dark);
  background:var(--accent-soft); border-radius:20px; padding:3px 12px;
}

.sale-form-box{ max-width:440px; width:92vw; padding:24px 26px; background:#f7f3ed; border-radius:22px; box-shadow:0 30px 80px rgba(20,30,50,0.3); }
.sale-form-pts{ font-size:15px; font-weight:800; color:var(--accent-dark); background:var(--accent-soft); border-radius:20px; padding:2px 10px; margin-left:6px; }
.sale-form-body{ display:flex; flex-direction:column; gap:14px; }
.sale-form-cliente{ font-size:14px; color:var(--text-soft); }
.sale-fld{ display:flex; flex-direction:column; gap:6px; }
.sale-fld > span{ font-size:12px; font-weight:600; color:var(--text-soft); }
.sale-split-toggle{ display:flex; align-items:center; gap:9px; font-size:14px; color:var(--text-main); cursor:pointer; }
.sale-split-toggle input{ width:18px; height:18px; }

/* ================= EVENTO SVOLTO ================= */
/* Evento confermato (cliente presentato): card rossa, contenuto leggibile. */
.appointment-item.svolto{
  background:linear-gradient(180deg,#e74c3c,#d23b2c) !important;
  border-color:#b83227 !important;
  border-left-color:#8e2820 !important;
}
.appointment-item.svolto .event-time,
.appointment-item.svolto .event-name,
.appointment-item.svolto .event-phone,
.appointment-item.svolto .event-notes,
.appointment-item.svolto .event-duration-label{ color:#fff !important; }
.appointment-item.svolto .event-service-tag{ background:rgba(255,255,255,0.22) !important; color:#fff !important; border-color:rgba(255,255,255,0.35) !important; }

/* Tasto "Svolto" nel modal evento */
.ev-svolto-btn{ background:#2ecc71 !important; color:#0b2a16 !important; font-weight:700; }
.ev-svolto-btn:hover{ background:#3fe084 !important; }
.ev-svolto-btn.is-done{ background:#e74c3c !important; color:#fff !important; }
.ev-svolto-btn.is-done:hover{ background:#ef6353 !important; }

/* ===== Fix scroll orizzontale interno modali (mobile) — agenda esclusa ===== */
.gest-measure-row{ grid-template-columns:minmax(0,1fr) 130px 36px; }
.gest-measure-row select, .gest-measure-row input{ min-width:0; }
.gest-client-box, .gest-types-box, .sale-box, .sale-form-box{ overflow-x:hidden; }
@media (max-width: 700px){
  .gest-measure-row{ grid-template-columns:minmax(0,1fr) 84px 34px; gap:6px; }
  .gest-client-box, .gest-types-box, .note-done-box, .sale-box, .sale-form-box, .daily-notes-box{ max-width:96vw; }
  .gest-type-row{ flex-wrap:wrap; }
  .gest-types-unit{ width:88px; }
}

/* ================= AGENDA CELLULARE ================= */
.home-mobile-btn{
  margin-top:2px; width:100%; max-width:560px; padding:15px 20px; align-self:center;
  background:#fff; color:var(--text-main); border:1px solid var(--border-soft);
  border-radius:16px; font-size:16px; font-weight:600; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:transform .12s, border-color .2s, background .2s, box-shadow .2s;
}
.home-mobile-btn:hover{ transform:translateY(-2px); background:var(--accent-soft); border-color:var(--accent); box-shadow:0 6px 16px rgba(199,165,106,.28); }

#mobile-agenda{ display:none; }
body.ma-on{ overflow:hidden; }
body.ma-on .main-header, body.ma-on #planner{ display:none !important; }
body.ma-on #mobile-agenda{
  display:flex; flex-direction:column; position:fixed; inset:0; z-index:60;
  background:var(--bg-main); -webkit-user-select:none; user-select:none;
}
#ma-banner{ flex:none; }
#ma-banner #urgent-notes-alert{ margin:0; border-radius:0; }
#ma-body{ flex:1; display:flex; flex-direction:column; min-height:0; }
.ma-notes{ display:flex; align-items:center; justify-content:center; gap:8px; margin:6px 14px 0; padding:11px; background:#fff; border:1px solid var(--border-soft); border-radius:12px; font-size:14.5px; font-weight:600; color:var(--text-main); cursor:pointer; }
.ma-notes:active{ background:var(--accent-soft); }
body.ma-on #daily-notes-modal, body.ma-on #note-done-modal{ z-index:130; }
@media(max-width:640px){ body.ma-on #daily-notes-modal .modal-box, body.ma-on #note-done-modal .modal-box{ width:calc(100vw - 20px); max-width:none; max-height:92vh; } }
.ma-top{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 14px; background:var(--bg-panel); border-bottom:1px solid var(--border-soft); }
.ma-top .ma-sede{ font-size:16px; font-weight:700; color:var(--text-main); flex:1; text-align:center; }
.ma-back, .ma-today{ background:rgba(0,0,0,.04); border:1px solid var(--border-soft); border-radius:10px; padding:9px 13px; font-size:14px; font-weight:600; color:var(--text-main); cursor:pointer; flex:none; }
.ma-today{ background:var(--accent); color:#fff; border-color:var(--accent); }
.ma-daybar{ display:flex; align-items:center; gap:10px; padding:10px 14px 6px; }
.ma-day-label{ flex:1; text-align:center; font-size:15px; font-weight:650; color:var(--text-main); position:relative; cursor:pointer; }
.ma-day-label input[type=date]{ position:absolute; inset:0; opacity:0; width:100%; height:100%; border:0; }
.ma-arrow{ width:44px; height:44px; border-radius:12px; border:1px solid var(--border-soft); background:#fff; font-size:22px; line-height:1; color:var(--text-main); cursor:pointer; flex:none; }
.ma-arrow:active{ background:var(--accent-soft); }
.ma-colbar{ display:flex; align-items:center; gap:10px; margin:4px 14px 0; padding:9px 12px; background:#fff; border:2px solid var(--accent); border-radius:14px; }
.ma-col-name{ flex:1; text-align:center; font-size:18px; font-weight:800; letter-spacing:.02em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ma-dots{ display:flex; gap:6px; justify-content:center; padding:9px 12px 4px; flex-wrap:wrap; }
.ma-dots span{ width:7px; height:7px; border-radius:50%; background:var(--border); transition:width .2s,background .2s; }
.ma-dots span.on{ background:var(--accent); width:20px; border-radius:999px; }
.ma-scroll{ flex:1; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; padding:4px 10px 40px; }
.ma-grid{ position:relative; }
.ma-slot{ position:absolute; left:0; right:0; border-top:1px solid var(--border-soft); }
.ma-slot.hour{ border-top-color:var(--border); }
.ma-slot .ma-time{ position:absolute; top:1px; left:4px; font-size:11px; color:var(--text-soft); font-variant-numeric:tabular-nums; }
.ma-event{ position:absolute; left:50px; right:6px; background:#fff; border:1px solid var(--border); border-left:4px solid var(--accent); border-radius:10px; padding:6px 10px; box-shadow:0 2px 6px rgba(0,0,0,.07); overflow:hidden; }
.ma-event.svolto{ opacity:.5; }
.ma-ev-h{ display:flex; gap:7px; align-items:baseline; }
.ma-ev-t{ font-size:11.5px; font-weight:700; color:var(--accent-dark); font-variant-numeric:tabular-nums; flex:none; }
.ma-ev-n{ font-size:14px; font-weight:650; color:var(--text-main); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ma-ev-p{ font-size:12px; color:var(--text-soft); margin-top:1px; }
.ma-ev-s{ font-size:11.5px; color:var(--accent-dark); margin-top:2px; }
.ma-noenc{ padding:60px 24px; text-align:center; color:var(--text-soft); }
body.ma-on #event-modal{ z-index:120; }
@media(max-width:640px){
  body.ma-on #event-modal .modal-box{ width:calc(100vw - 20px); max-width:none; max-height:92vh; overflow:auto; }
}

/* Modulo disattivato da autorizzazioni.js */
.modulo-off{ opacity:.5; cursor:not-allowed; }
.modulo-off:hover{ transform:none !important; box-shadow:none !important; border-color:var(--border-soft) !important; background:#fff !important; filter:none !important; }
.home-crm-btn.modulo-off:hover{ background:linear-gradient(135deg,var(--accent) 0%,var(--accent-dark) 100%) !important; }
