*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;background:#F7F8FA;color:#1A2332;min-height:100vh}
/* ── QR MODE: applicato prima del primo paint dal <script> in <head> ── */
html.qr-mode #mc-back-btn,
html.qr-mode #mc-clienti-btn,
html.qr-mode #mc-qr-btn{display:none!important}
html.qr-mode #mc-allergen-btn{display:flex!important}
html.qr-mode header,
html.qr-mode #mobile-nav{display:none!important}
:root{
  /* === ToStart brand palette (Figma source of truth) === */
  --teal:#008081;--teal-dark:#0A5859;--teal-light:#FFFAE0;
  --yellow:#DEDC00;--yellow-bright:#F2F014;
  --purple:#4B305F;--purple-light:#EED8FF;
  --maroon:#6A0D2C;--maroon-bg:#FFEEE7;
  --orange:#FE5910;--orange-light:#FFEEE7;
  --green:#3A920E;--red:#D50000;--red-light:#FEF2F2;
  --white:#FFFEFC;--bg:#FCF8FF;
  --text:#181414;--text-sec:#5C5845;--border:#CBCACA;
  --shadow:0 2px 8px rgba(74,48,95,0.08);--shadow-lg:0 8px 24px rgba(74,48,95,0.12);
  --r:14px;--rs:10px
}
.screen{display:none}.screen.active{display:block}
/* Anti-flash: nasconde header + mobile-nav di DEFAULT.
   Vengono rivelati solo quando body.app-ready è presente (settato da navigate dopo login).
   Risolve il flash di "Dashboard / Analytics / Sala / Recensioni / Fornitori..." all'apertura del PWA
   o tra le transizioni di login. */
header{display:none}
#mobile-nav{display:none}
body.app-ready header{display:flex}
body.app-ready #mobile-nav{display:flex}
/* Anche durante il PIN login (cambio profilo): nasconde tutto fino a navigate() finale */
body.logging-in .screen, body.logging-in header, body.logging-in #mobile-nav{display:none!important}
/* ── ONBOARDING & LOGIN ── */
#screen-onboarding,#screen-login,#screen-restaurant-picker,#screen-location-picker{position:fixed;inset:0;z-index:9999;background:linear-gradient(135deg,#4B305F 0%,#2C1A3A 100%);display:none;align-items:center;justify-content:center;overflow-y:auto}
#screen-onboarding.active,#screen-login.active,#screen-restaurant-picker.active,#screen-location-picker.active{display:flex}
.rp-card{background:#fff;border-radius:24px;padding:40px;max-width:420px;width:90%;box-shadow:0 20px 60px rgba(0,0,0,.2);text-align:center}
.loc-card{background:#fff;border-radius:16px;padding:20px;border:2px solid var(--border);cursor:pointer;text-align:center;transition:.2s}
.loc-card:hover{border-color:var(--teal);background:var(--teal-light);transform:translateY(-2px)}
.ob-card{background:#fff;border-radius:24px;padding:40px;max-width:480px;width:90%;box-shadow:0 20px 60px rgba(0,0,0,.2)}
.ob-logo{text-align:center;margin-bottom:24px}
.ob-logo .ob-icon{font-size:56px;display:block;margin-bottom:8px}
.ob-logo .ob-title{font-size:28px;font-weight:900;color:var(--teal)}
.ob-step{display:none}.ob-step.active{display:block}
.ob-step-label{font-size:12px;font-weight:700;color:var(--text-sec);letter-spacing:1px;text-transform:uppercase;margin-bottom:6px}
.ob-heading{font-size:22px;font-weight:800;color:#1A2332;margin-bottom:6px}
.ob-sub{font-size:14px;color:var(--text-sec);margin-bottom:24px}
.ob-dots{display:flex;gap:6px;justify-content:center;margin-top:20px}
.ob-dot{width:8px;height:8px;border-radius:50%;background:#E5E7EB;transition:.2s}
.ob-dot.active{background:var(--teal);width:24px;border-radius:4px}
/* Login */
.login-wrap{text-align:center;max-width:600px;width:90%}
.login-title{font-size:36px;font-weight:900;color:#fff;margin-bottom:6px}
.login-sub{font-size:16px;color:rgba(255,255,255,.7);margin-bottom:32px}
.staff-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:16px;margin-bottom:24px}
.staff-card-login{background:rgba(255,255,255,.15);border:2px solid rgba(255,255,255,.2);border-radius:16px;padding:20px 12px;cursor:pointer;text-align:center;transition:.2s;backdrop-filter:blur(10px)}
.staff-card-login:hover{background:rgba(255,255,255,.25);transform:translateY(-2px)}
.staff-avatar-big{font-size:36px;margin-bottom:8px}
.staff-name-login{font-size:14px;font-weight:700;color:#fff}
.staff-role-login{font-size:11px;color:rgba(255,255,255,.6);margin-top:2px}
/* PIN */
.pin-dots{display:flex;gap:12px;justify-content:center;margin:20px 0}
.pin-dot{width:16px;height:16px;border-radius:50%;background:#E5E7EB;transition:.2s}
.pin-dot.filled{background:var(--teal)}
.pin-pad{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:260px;margin:0 auto}
.pin-btn{height:56px;border-radius:12px;border:1.5px solid var(--border);background:#fff;font-size:20px;font-weight:700;cursor:pointer;transition:.15s;font-family:inherit}
.pin-btn:hover{background:var(--teal-light);border-color:var(--teal)}
.pin-btn.del{font-size:16px;color:var(--text-sec)}
/* Kitchen */
.kitchen-order-card{background:#fff;border-radius:16px;padding:20px;border:2px solid var(--border);transition:.3s}
.kitchen-order-card.all-ready{border-color:var(--green);background:#F0FDF4}
.kitchen-item-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}
.kitchen-item-row:last-child{border-bottom:none}
.kitchen-item-name{flex:1;font-size:14px;font-weight:600}
.kitchen-qty-badge{background:var(--teal-light);color:var(--teal);font-weight:800;padding:2px 10px;border-radius:20px;font-size:13px}
.kitchen-ready-btn{padding:6px 16px;border-radius:8px;border:none;font-weight:700;font-size:13px;cursor:pointer;transition:.15s;font-family:inherit}
.kitchen-ready-btn.pending{background:var(--bg);color:var(--text-sec);border:1.5px solid var(--border)}
.kitchen-ready-btn.ready{background:#D1FAE5;color:#065F46}
/* ── MOBILE ── */
@media(max-width:768px){
  /* Header */
  header{height:56px}
  .header-inner{padding:0 14px}
  nav{display:none!important}
  .logo-text{font-size:20px}
  .header-right .user-name,.header-right .user-role{display:none}
  .user-avatar{width:36px;height:36px;font-size:18px}

  /* Layout */
  .container{padding:0 12px}
  .page{padding:12px 0 100px}

  /* Page header */
  .page-header{flex-direction:column;align-items:flex-start;gap:10px}
  .page-header > div:last-child{width:100%;display:flex;flex-wrap:wrap;gap:8px}
  .page-header .btn{flex:1;min-width:0;justify-content:center;font-size:13px;padding:10px 12px}
  .page-title{font-size:22px!important}

  /* Prevent iOS font zoom on inputs */
  input,select,textarea{font-size:16px!important}

  /* Touch targets ≥ 44px */
  .btn{min-height:44px}
  .btn-sm{min-height:38px}
  .pin-btn{height:60px}
  .add-btn,.sub-btn{width:40px;height:40px}
  .kitchen-ready-btn{padding:10px 18px;min-height:42px}
  .mobile-nav-item{min-height:52px}

  /* Grids → 2 cols max on mobile */
  .stat-cards,.stats-grid{grid-template-columns:repeat(2,1fr)!important}
  .sala-stats{grid-template-columns:repeat(2,1fr)!important}
  .staff-stats{grid-template-columns:repeat(2,1fr)!important}
  .products-grid{grid-template-columns:repeat(2,1fr)!important}
  .success-actions{grid-template-columns:repeat(2,1fr)!important}
  .tables-grid{grid-template-columns:repeat(3,1fr)!important;gap:10px!important}
  .sala-grid{grid-template-columns:repeat(3,1fr)!important}

  /* Single column on mobile */
  .widgets-row{grid-template-columns:1fr!important}
  .menu-mgmt-grid{grid-template-columns:1fr!important}
  .staff-grid{grid-template-columns:1fr!important}
  .staff-grid-inner{grid-template-columns:repeat(2,1fr)!important}
  .widget-card{flex:0 0 100%!important}
  #menu-cliente-grid{grid-template-columns:1fr!important}
  .ordine-stats{grid-template-columns:repeat(2,1fr)!important;gap:10px!important}

  /* Feedback hero → stack */
  .feedback-hero{flex-direction:column!important;gap:20px!important;padding:20px!important}
  .feedback-platforms{flex-wrap:wrap!important;gap:8px!important}

  /* Tabs → scrollable horizontal */
  .page-tabs{overflow-x:auto!important;width:100%!important;-webkit-overflow-scrolling:touch}
  .cat-tabs{flex-wrap:nowrap!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch;padding-bottom:4px}

  /* Search row */
  .search-row{flex-direction:column!important;gap:8px!important}
  .search-row .btn{width:100%;justify-content:center}

  /* Modal → bottom sheet */
  .modal{border-radius:20px 20px 0 0!important;position:fixed!important;bottom:0!important;left:0!important;right:0!important;max-width:100%!important;max-height:90vh!important;overflow-y:auto!important;margin:0!important}
  .modal-overlay{align-items:flex-end!important}

  /* Cart bar safe area */
  .cart-bar{padding-bottom:calc(16px + env(safe-area-inset-bottom))!important}

  /* Dish/product cards */
  .dish-img{height:100px}
  .dish-body{padding:12px}

  /* Staff card compact */
  .staff-card{padding:14px}
  .staff-avatar{width:40px;height:40px;font-size:18px}

  /* Menu items */
  .mc-card .mc-photo,.mc-photo-fallback{height:150px}
  .menu-item-actions{gap:8px}

  /* Sala numbers */
  .sala-nums{gap:16px}
  .sala-num .n{font-size:28px}

  /* Legend wrap */
  .sala-legend{flex-wrap:wrap;gap:10px}

  /* Kitchen */
  .kitchen-order-card{padding:14px}

  /* Success screen */
  .success-mascot{font-size:72px}
  .success-title{font-size:22px}

  /* Ratings big number */
  .rating-num{font-size:48px}

  /* Dashboard bottom grid: 2 col → 1 col */
  .dash-bottom-grid{grid-template-columns:1fr!important}

  /* Prevent horizontal overflow from any stray wide element */
  body,#app,.container,.page{overflow-x:hidden;max-width:100vw}

  /* bottom nav */
  #mobile-nav{display:flex}

  /* ── Prenotazioni mobile ── */
  .pren-subtitle-hide{display:none}
  .pren-page-header{gap:8px}
  .pren-nav-row{width:100%;display:flex;align-items:center;gap:6px;flex-wrap:nowrap}
  .pren-week-label{flex:1;font-weight:700;font-size:13px;text-align:center;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .pren-nav-btn{padding:10px 14px!important;min-width:40px;font-size:18px;flex-shrink:0}
  .pren-add-btn{flex:1;font-size:13px!important;padding:10px 10px!important;justify-content:center;white-space:nowrap}
  .pren-link-btn{padding:10px 14px!important;min-width:40px;flex-shrink:0}
  .pren-toolbar{flex-direction:column!important;gap:8px!important;align-items:stretch!important}
  .pren-view-btns{display:flex;gap:6px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px}
  .pren-view-btns .btn{flex-shrink:0;font-size:12px!important;padding:8px 10px!important}
  .pren-jump-input{width:100%!important;font-size:16px!important}
  /* Week calendar: horizontal scroll on mobile so days are readable */
  .pren-calendar-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch}
  .pren-week-inner{min-width:560px}
  .pren-stats-grid{grid-template-columns:repeat(2,1fr)!important}
  /* Day view cards: stack actions below on mobile */
  .pren-day-card{flex-wrap:wrap!important}
  .pren-day-actions{display:flex;gap:6px;width:100%;justify-content:flex-end;margin-top:6px}
}
@media(min-width:769px){#mobile-nav{display:none}}

/* ── DDT MODAL: ottimizzata per mobile ── */
@media(max-width:640px){
  #modal-ddt-real .modal{
    width:100%!important;max-width:100%!important;
    height:100vh!important;max-height:100vh!important;
    border-radius:0!important;padding:18px 14px!important;
    overflow-y:auto;
  }
  #modal-ddt-real .modal-title{font-size:18px}
  #modal-ddt-real .modal-subtitle{font-size:12px;line-height:1.4}
  #ddt-r-step1 > div{grid-template-columns:1fr!important}
  #ddt-r-step1 button,#ddt-r-step1 label{padding:22px 14px!important;font-size:14px!important}
  #ddt-r-step1 .form-input,#ddt-r-step2 .form-input{font-size:16px!important;padding:11px 12px!important}
  #ddt-r-rows{max-height:48vh!important}
  #ddt-r-step2 > div:last-child{position:sticky;bottom:0;background:#fff;padding:10px 0;margin:0!important;border-top:1px solid var(--border)}
}
/* Card-style rows: niente tabella su mobile */
.ddt-row-card{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--border);border-radius:10px;margin-bottom:8px;background:#fff}
.ddt-row-card .row-top{display:flex;gap:6px;align-items:center}
.ddt-row-card .row-name{flex:1}
.ddt-row-card .row-num{display:grid;grid-template-columns:1fr 1fr;gap:6px}

/* Dashboard bottom grid base */
.dash-bottom-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}

/* ── Prenotazioni layout ── */
.pren-nav-row{display:flex;align-items:center;gap:10px}
.pren-week-label{font-weight:700;font-size:15px;min-width:200px;text-align:center}
.pren-nav-btn{padding:8px 14px}
.pren-add-btn{}
.pren-link-btn{}
.pren-toolbar{display:flex;gap:8px;margin-bottom:20px;align-items:center}
.pren-view-btns{display:flex;gap:8px}
.pren-jump-input{width:160px;font-size:13px}
.pren-calendar-wrap{background:#fff;border-radius:16px;box-shadow:0 2px 12px rgba(0,0,0,.07);overflow:hidden}
.pren-stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-top:20px}
.pren-week-inner{} /* min-width applied on mobile only */

/* ── ADMIN PANEL ── */
#screen-admin.active{display:flex!important}
/* ── CONSOLE ADMIN — palette brand (purple bg + yellow accent) ── */
.adm-kpi{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:14px;padding:18px 20px;display:flex;flex-direction:column;gap:4px;backdrop-filter:blur(8px);transition:.18s}
.adm-kpi:hover{border-color:var(--yellow);transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.18)}
.adm-kpi-icon{font-size:22px;margin-bottom:4px}
.adm-kpi-val{font-size:28px;font-weight:900;color:#fff;letter-spacing:-.5px}
.adm-kpi-label{font-size:11px;color:rgba(255,255,255,.7);font-weight:600;text-transform:uppercase;letter-spacing:.5px}
.adm-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:14px;padding:22px;backdrop-filter:blur(8px)}
.adm-card-title{font-size:12px;font-weight:800;color:var(--yellow);margin-bottom:14px;letter-spacing:.8px;text-transform:uppercase}
.adm-rest-row{border-bottom:1px solid rgba(255,255,255,.08);transition:.15s;cursor:pointer}
.adm-rest-row:hover{background:rgba(222,220,0,.08)}
.adm-rest-row td{padding:13px 12px;color:rgba(255,255,255,.88);vertical-align:middle}
.adm-rest-name{font-weight:800;color:#fff;font-size:14px}
.adm-rest-slug{font-size:11px;color:var(--yellow);font-family:'SF Mono',Menlo,Consolas,monospace;font-weight:600}
.adm-badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:700;letter-spacing:.3px}
.adm-badge-green{background:rgba(52,211,153,.18);color:#86efac;border:1px solid rgba(52,211,153,.35)}
.adm-badge-red{background:rgba(248,113,113,.18);color:#fca5a5;border:1px solid rgba(248,113,113,.35)}
.adm-badge-amber{background:rgba(251,191,36,.2);color:#fde68a;border:1px solid rgba(251,191,36,.4)}
.adm-badge-blue{background:rgba(96,165,250,.18);color:#bfdbfe;border:1px solid rgba(96,165,250,.35)}
.adm-badge-gray{background:rgba(255,255,255,.1);color:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.2)}
.adm-tab{background:none;border:none;border-bottom:3px solid transparent;padding:14px 18px;font-size:13px;font-weight:700;color:rgba(255,255,255,.6);cursor:pointer;font-family:inherit;white-space:nowrap;transition:.15s;letter-spacing:.2px}
.adm-tab:hover{color:#fff;background:rgba(255,255,255,.04)}
.adm-tab.active{color:var(--yellow);border-bottom-color:var(--yellow)}
.adm-action-btn{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);color:#fff;border-radius:8px;padding:6px 12px;font-size:12px;cursor:pointer;font-family:inherit;transition:.15s;font-weight:700}
.adm-action-btn:hover{background:var(--yellow);color:var(--purple);border-color:var(--yellow)}
.adm-action-btn.primary{background:var(--yellow);color:var(--purple);border-color:var(--yellow)}
.adm-action-btn.primary:hover{background:#F2F014;border-color:#F2F014}
.adm-type-bar{display:flex;align-items:center;gap:10px;font-size:13px;color:rgba(255,255,255,.85)}
.adm-type-track{flex:1;height:6px;background:rgba(255,255,255,.12);border-radius:3px;overflow:hidden}
.adm-type-fill{height:100%;background:linear-gradient(90deg,var(--yellow) 0%,#F2F014 100%);border-radius:3px}
/* Input/select/textarea dentro la console */
#screen-admin input,#screen-admin textarea,#screen-admin select{background:rgba(0,0,0,.25)!important;border:1px solid rgba(255,255,255,.18)!important;color:#fff!important;border-radius:10px;padding:9px 12px;font-size:13px;font-family:inherit;outline:none;transition:.15s}
#screen-admin input:focus,#screen-admin textarea:focus,#screen-admin select:focus{border-color:var(--yellow)!important;box-shadow:0 0 0 3px rgba(222,220,0,.15)}
#screen-admin input::placeholder,#screen-admin textarea::placeholder{color:rgba(255,255,255,.4)}
#screen-admin select option{background:var(--purple);color:#fff}
#screen-admin table th{color:rgba(255,255,255,.6)!important;font-weight:700;letter-spacing:.3px;text-transform:uppercase;font-size:11px}
#screen-admin table tr{border-bottom-color:rgba(255,255,255,.08)!important}
@media(max-width:768px){
  #screen-admin .adm-kpi-grid-override,
  #admin-kpi-grid{grid-template-columns:repeat(2,1fr)!important}
  #screen-admin>div:last-child>div:nth-child(2){grid-template-columns:1fr!important}
}
#mobile-nav{position:fixed;bottom:0;left:0;right:0;z-index:200;background:#fff;border-top:1px solid var(--border);padding:6px 4px env(safe-area-inset-bottom);gap:0}
.mobile-nav-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;border:none;background:none;cursor:pointer;font-family:inherit;color:var(--text-sec);font-size:10px;font-weight:600;transition:.15s}
.mobile-nav-item.active{color:var(--teal)}
.mobile-nav-item .mn-icon{font-size:20px;line-height:1}

/* ── Mobile "Altro" bottom sheet ── */
#mobile-more-overlay{display:none;position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.45);align-items:flex-end;animation:mmFade .2s ease}
#mobile-more-overlay.active{display:flex}
@keyframes mmFade{from{opacity:0}to{opacity:1}}
#mobile-more-sheet{width:100%;background:#fff;border-radius:22px 22px 0 0;padding:10px 18px calc(20px + env(safe-area-inset-bottom));max-height:82vh;overflow-y:auto;animation:mmSlide .25s cubic-bezier(.2,.8,.2,1)}
@keyframes mmSlide{from{transform:translateY(100%)}to{transform:translateY(0)}}
.mm-handle{width:40px;height:4px;border-radius:3px;background:var(--border);margin:4px auto 12px}
.mm-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.mm-header span{font-size:17px;font-weight:800}
.mm-close{background:#f3f4f6;border:none;width:34px;height:34px;border-radius:50%;font-size:15px;cursor:pointer;color:var(--text-sec)}
.mm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:16px}
.mm-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:16px 6px;border:1px solid var(--border);border-radius:14px;background:#fff;cursor:pointer;font-family:inherit;font-size:12px;font-weight:600;color:var(--text);transition:.15s;min-height:78px}
.mm-tile:active{background:var(--teal-light);border-color:var(--teal)}
.mm-tile.active{background:var(--teal-light);border-color:var(--teal);color:var(--teal)}
.mm-tile .mm-ic{font-size:24px;line-height:1}
.mm-actions{display:flex;gap:10px;border-top:1px solid var(--border);padding-top:14px}
.mm-action{flex:1;padding:13px;border-radius:12px;border:1px solid var(--border);background:#fff;font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;color:var(--text)}
.mm-action.mm-logout{color:var(--red);border-color:var(--red)}

.container{max-width:1400px;margin:0 auto;padding:0 24px}
header{background:var(--white);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100;height:64px;display:flex;align-items:center}
.header-inner{max-width:1400px;margin:0 auto;padding:0 24px;display:flex;align-items:center;width:100%;gap:8px}
.logo{display:flex;align-items:center;gap:6px;margin-right:28px;cursor:pointer;text-decoration:none}
.logo-text{font-size:24px;font-weight:800;color:var(--teal);letter-spacing:-0.5px}
nav{display:flex;gap:4px;flex:1}
.nav-item{display:flex;align-items:center;gap:7px;padding:8px 15px;border-radius:var(--rs);font-size:14px;font-weight:500;color:var(--text-sec);cursor:pointer;border:none;background:none;transition:.15s;font-family:inherit;position:relative}
.nav-item:hover{background:var(--bg);color:var(--text)}
.nav-item.active{background:var(--teal);color:var(--white)}
.nav-badge{position:absolute;top:4px;right:4px;background:var(--red);color:#fff;border-radius:50%;width:16px;height:16px;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center}
.header-right{display:flex;align-items:center;gap:12px;margin-left:auto}
.notif-btn{position:relative;background:none;border:none;cursor:pointer;font-size:20px;padding:6px;border-radius:8px}
.notif-btn:hover{background:var(--bg)}
.notif-dot{position:absolute;top:4px;right:4px;width:8px;height:8px;background:var(--red);border-radius:50%;border:2px solid #fff}
.header-user{display:flex;align-items:center;gap:10px;cursor:pointer;padding:6px 10px;border-radius:var(--rs);transition:.15s}
.header-user:hover{background:var(--bg)}
.user-name{font-size:14px;font-weight:600}
.user-role{font-size:12px;color:var(--teal);font-weight:600}
.user-avatar{width:36px;height:36px;border-radius:50%;background:#E8D5C4;display:flex;align-items:center;justify-content:center;font-size:18px}
.page{padding:32px 0 80px}
.page-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:24px}
.page-title{font-size:28px;font-weight:700}
.page-subtitle{font-size:14px;color:var(--text-sec);margin-top:4px}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:var(--rs);font-size:14px;font-weight:600;cursor:pointer;border:none;transition:.15s;font-family:inherit}
.btn-primary{background:var(--teal);color:var(--white)}.btn-primary:hover{background:var(--teal-dark)}
.btn-secondary{background:var(--white);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover{background:var(--bg)}
.btn-outline{background:transparent;color:var(--text);border:1px solid var(--border)}.btn-outline:hover{background:var(--bg)}
.btn-danger{background:var(--maroon);color:var(--white)}.btn-sm{padding:7px 14px;font-size:13px}
.btn-icon{width:36px;height:36px;padding:0;justify-content:center;font-size:16px}
.alert-banner{display:flex;align-items:center;justify-content:space-between;background:var(--maroon-bg);border:1px solid #FECACA;border-radius:var(--r);padding:14px 20px;margin-bottom:24px}
.alert-text{font-size:14px;color:var(--maroon);display:flex;align-items:center;gap:8px}
.card{background:var(--white);border-radius:var(--r);box-shadow:var(--shadow);padding:20px;border:1px solid var(--border)}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.stat-card{background:var(--white);border-radius:var(--r);box-shadow:var(--shadow);padding:20px;border:1px solid var(--border)}
.stat-label{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--teal);font-weight:500;margin-bottom:12px}
.stat-value{font-size:28px;font-weight:700;margin-bottom:4px}
.stat-change{font-size:13px;color:var(--green)}
.stat-sep{margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}
.stat-row{display:flex;justify-content:space-between;font-size:13px;margin-bottom:4px}
.num-green{color:var(--green);font-weight:700}.num-red{color:var(--red);font-weight:700}.num-orange{color:var(--orange);font-weight:700}
.sala-nums{display:flex;gap:32px;margin:8px 0 16px}
.sala-num .n{font-size:36px;font-weight:700}.sala-num .n.free{color:var(--teal)}.sala-num .n.wait{color:var(--red)}
.sala-num .l{font-size:12px;color:var(--text-sec)}
.dot-row{display:flex;justify-content:space-between;font-size:13px;margin-bottom:6px}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}
.widgets-row{display:grid;grid-template-columns:280px 1fr 1fr;gap:16px;margin-bottom:24px}
.ai-card{background:var(--teal);color:var(--white);border-radius:var(--r);padding:24px;display:flex;flex-direction:column;justify-content:space-between}
.ai-card h3{font-size:20px;font-weight:700;margin-bottom:8px}
.ai-card p{font-size:13px;opacity:.85;margin-bottom:24px}
.chart-card{background:var(--white);border-radius:var(--r);padding:20px;border:1px solid var(--border);box-shadow:var(--shadow)}
.chart-title{font-size:13px;color:var(--teal);font-weight:500;margin-bottom:16px}
.chart-svg{width:100%;height:120px}
.mascot{position:fixed;bottom:24px;right:24px;font-size:44px;cursor:pointer;z-index:50;transition:transform .2s;filter:drop-shadow(0 4px 8px rgba(0,0,0,.15))}
.mascot:hover{transform:scale(1.1) rotate(-5deg)}
.page-tabs{display:flex;gap:4px;background:var(--bg);padding:4px;border-radius:var(--rs);width:fit-content;margin-bottom:24px}
.tab-btn{padding:8px 20px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;border:none;background:none;color:var(--text-sec);transition:.15s;font-family:inherit}
.tab-btn.active{background:var(--white);color:var(--teal);font-weight:600;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.tab-content{display:none}.tab-content.active{display:block}
.sala-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:32px}
.sala-stat{background:var(--white);border-radius:var(--r);border:1px solid var(--border);padding:16px 20px}
.sala-stat-label{font-size:12px;color:var(--text-sec);margin-bottom:4px}
.sala-stat-value{font-size:28px;font-weight:700}
.tables-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:24px}
.table-btn{aspect-ratio:1;border-radius:var(--r);border:2px dashed var(--border);background:var(--white);cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;transition:.15s;font-family:inherit}
.table-btn:hover{transform:scale(1.04);box-shadow:0 4px 12px rgba(0,0,0,.1)}
.table-btn.occupied{background:var(--teal);border-color:var(--teal);color:var(--white);border-style:solid}
.table-btn.reserved{background:#7B2D3D;border-color:#7B2D3D;color:var(--white);border-style:solid}
.table-btn.waiting{background:#F59E0B;border-color:#F59E0B;color:var(--white);border-style:solid}
.table-num{font-size:18px;font-weight:700}.table-info{font-size:11px;opacity:.8}
.sala-legend{display:flex;gap:24px;font-size:12px;color:var(--text-sec)}
.legend-item{display:flex;align-items:center;gap:6px}
.legend-dot{width:12px;height:12px;border-radius:3px}
.search-row{display:flex;gap:12px;margin-bottom:24px;align-items:center}
.search-input{flex:1;display:flex;align-items:center;gap:10px;background:var(--white);border:1px solid var(--border);border-radius:var(--rs);padding:10px 16px}
.search-input input{border:none;outline:none;flex:1;font-size:14px;font-family:inherit;background:transparent}
.section-title{display:flex;align-items:center;gap:8px;font-size:16px;font-weight:600;margin-bottom:16px}
.section-count{background:var(--bg);padding:2px 8px;border-radius:20px;font-size:12px;color:var(--text-sec)}
.products-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:32px}
.product-card{background:var(--red-light);border-radius:var(--r);border:1px solid #FCA5A5;padding:16px}
.product-card.warn{background:var(--orange-light);border-color:#FCD34D}
.product-card.ok{background:#F0FDF4;border-color:#86EFAC}
.product-card-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}
.product-name{font-size:15px;font-weight:600}.product-cat{font-size:12px;color:var(--text-sec)}
.product-stats{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}
.ps-row{display:flex;justify-content:space-between;font-size:13px}
.ps-row .l{color:var(--text-sec)}.ps-row .v{font-weight:600}
.product-sup{font-size:12px;color:var(--text-sec);margin-bottom:12px}
.mag-ai-card{background:var(--teal);border-radius:var(--r);padding:20px;color:var(--white);display:flex;flex-direction:column;justify-content:space-between;min-height:200px}
.mag-ai-card h3{font-size:18px;font-weight:700;margin-bottom:8px}
.mag-ai-card p{font-size:13px;opacity:.85;margin-bottom:20px}
.cat-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.cat-btn{padding:6px 16px;border-radius:20px;font-size:13px;font-weight:500;cursor:pointer;border:1px solid var(--border);background:var(--white);color:var(--text);transition:.15s;font-family:inherit}
.cat-btn.active{background:var(--teal);border-color:var(--teal);color:var(--white)}
.menu-list{display:flex;flex-direction:column;gap:1px;background:var(--border);border-radius:var(--r);overflow:hidden;margin-bottom:100px}
.menu-item{background:var(--white);padding:16px 20px;display:flex;align-items:center;justify-content:space-between;transition:.1s}
.menu-item.hidden{display:none}
.menu-item-info{flex:1}
.menu-item-name{font-size:15px;font-weight:500}
.menu-item-cat{font-size:12px;color:var(--text-sec)}
.menu-item-price{font-size:15px;font-weight:600;margin-top:4px}
.menu-item-actions{display:flex;align-items:center;gap:12px}
.info-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:var(--rs);border:1px solid var(--border);background:var(--white);font-size:13px;cursor:pointer;color:var(--text-sec);font-family:inherit;transition:.1s}
.info-btn:hover{background:var(--bg)}
.qty-ctrl{display:flex;align-items:center;gap:8px}
.qty-num{font-size:15px;font-weight:700;min-width:20px;text-align:center;color:var(--teal)}
.add-btn,.sub-btn{width:32px;height:32px;border-radius:6px;border:none;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-weight:300;line-height:1;font-family:inherit;transition:.1s}
.add-btn{background:var(--teal);color:var(--white)}.add-btn:hover{background:var(--teal-dark)}
.sub-btn{background:var(--bg);color:var(--text);border:1px solid var(--border)}.sub-btn:hover{background:var(--border)}
.cart-bar{position:fixed;bottom:0;left:0;right:0;background:var(--white);border-top:2px solid var(--teal);padding:16px 24px;display:none;z-index:90;align-items:center;justify-content:space-between;box-shadow:0 -4px 16px rgba(0,0,0,.08)}
.cart-bar.visible{display:flex}
.cart-info{font-size:14px;color:var(--text-sec)}.cart-info strong{color:var(--text);font-size:16px}
.cart-total{font-size:22px;font-weight:700;color:var(--teal);margin:0 24px}
.back-header{display:flex;align-items:center;gap:12px;margin-bottom:24px}
.back-btn{background:none;border:1px solid var(--border);border-radius:var(--rs);width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:18px;font-family:inherit;transition:.1s}
.back-btn:hover{background:var(--bg)}
.ordine-title{font-size:24px;font-weight:700}
.ai-badge{background:var(--teal-light);color:var(--teal);padding:4px 10px;border-radius:20px;font-size:12px;font-weight:600}
.ordine-subtitle{font-size:13px;color:var(--text-sec)}
.ordine-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:32px;padding:20px;background:var(--white);border-radius:var(--r);border:1px solid var(--border)}
.ordine-stat{display:flex;align-items:center;gap:12px}
.ordine-stat-icon{font-size:22px}
.ordine-stat-label{font-size:12px;color:var(--text-sec)}
.ordine-stat-value{font-size:18px;font-weight:700}
.dist-section{background:var(--white);border-radius:var(--r);border:1px solid var(--border);overflow:hidden}
.dist-header{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;font-size:14px}
.dist-name{font-weight:600}.dist-date{color:var(--text-sec);font-size:13px}
.dist-total{font-size:16px;font-weight:700;text-align:right}
.order-item{padding:14px 20px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}
.order-item:last-child{border-bottom:none}
.order-item-name{font-size:14px;font-weight:500}
.order-item-detail{font-size:12px;color:var(--text-sec);margin-top:2px}
.stock-badge{font-size:11px;padding:2px 8px;border-radius:20px;background:var(--red-light);color:var(--red);font-weight:500;margin-left:6px}
.order-item-price .price{font-size:14px;font-weight:600;text-align:right}
.order-item-price .unit{font-size:12px;color:var(--text-sec);text-align:right}
.ordine-footer{margin-top:24px;display:flex;justify-content:flex-end;gap:12px}
.success-screen{text-align:center;padding:40px 20px}
.success-mascot{font-size:100px;display:block;margin-bottom:24px}
.success-title{font-size:28px;font-weight:700;color:var(--teal);margin-bottom:8px}
.success-subtitle{font-size:14px;color:var(--text-sec);margin-bottom:40px}
.success-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:900px;margin:0 auto}
.success-action-btn{display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px;background:var(--white);border:1px solid var(--border);border-radius:var(--r);cursor:pointer;font-size:13px;font-weight:500;transition:.15s;font-family:inherit}
.success-action-btn:hover{background:var(--teal-light);border-color:var(--teal);color:var(--teal)}
.success-action-btn .icon{font-size:24px}
/* STAFF */
.staff-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.staff-stat{background:var(--white);border-radius:var(--r);border:1px solid var(--border);padding:16px 20px;text-align:center}
.staff-stat-icon{font-size:28px;margin-bottom:8px}
.staff-stat-label{font-size:12px;color:var(--text-sec);margin-bottom:4px}
.staff-stat-value{font-size:28px;font-weight:700}
.staff-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.staff-card{background:var(--white);border-radius:var(--r);border:1px solid var(--border);padding:20px;display:flex;gap:16px;align-items:flex-start;transition:.15s;cursor:pointer}
.staff-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.08);border-color:var(--teal)}
.staff-avatar{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0}
.staff-info{flex:1}
.staff-name{font-size:15px;font-weight:600;margin-bottom:2px}
.staff-role{font-size:13px;color:var(--text-sec);margin-bottom:8px}
.staff-shift{font-size:12px;background:var(--teal-light);color:var(--teal);padding:3px 8px;border-radius:20px;display:inline-block;margin-bottom:6px}
.staff-status{display:flex;align-items:center;gap:6px;font-size:12px}
.status-dot{width:8px;height:8px;border-radius:50%}
.status-dot.present{background:var(--green)}.status-dot.off{background:var(--text-sec)}.status-dot.late{background:var(--orange)}
/* MENU MANAGEMENT */
.menu-mgmt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.dish-card{background:var(--white);border-radius:var(--r);border:1px solid var(--border);overflow:hidden;transition:.15s}
.dish-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.08)}
.dish-img{height:140px;background:linear-gradient(135deg,var(--teal-light),var(--bg));display:flex;align-items:center;justify-content:center;font-size:48px}
.dish-body{padding:16px}
.dish-name{font-size:15px;font-weight:600;margin-bottom:4px}
.dish-cat-badge{font-size:11px;background:var(--teal-light);color:var(--teal);padding:2px 8px;border-radius:20px;display:inline-block;margin-bottom:8px}
.dish-price{font-size:18px;font-weight:700;color:var(--teal);margin-bottom:12px}
.dish-actions{display:flex;gap:8px}
.toggle-switch{position:relative;width:40px;height:22px;cursor:pointer;margin-left:auto}
.toggle-switch input{opacity:0;width:0;height:0}
.toggle-slider{position:absolute;inset:0;background:#ccc;border-radius:22px;transition:.3s}
.toggle-slider:before{content:"";position:absolute;height:16px;width:16px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.3s}
input:checked+.toggle-slider{background:var(--teal)}
input:checked+.toggle-slider:before{transform:translateX(18px)}
/* FEEDBACK */
.feedback-hero{background:var(--white);border-radius:var(--r);border:1px solid var(--border);padding:32px;margin-bottom:24px;display:flex;align-items:center;gap:48px}
.feedback-rating-big{text-align:center}
.rating-num{font-size:64px;font-weight:800;color:var(--teal);line-height:1}
.rating-stars{font-size:24px;margin:8px 0}
.rating-count{font-size:13px;color:var(--text-sec)}
.feedback-breakdown{flex:1}
.rating-bar-row{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.rating-bar-label{font-size:13px;width:32px}
.rating-bar-track{flex:1;height:8px;background:var(--bg);border-radius:4px;overflow:hidden}
.rating-bar-fill{height:100%;background:var(--teal);border-radius:4px}
.rating-bar-count{font-size:13px;color:var(--text-sec);width:24px;text-align:right}
.feedback-platforms{display:flex;gap:16px}
.platform-chip{padding:8px 16px;border-radius:var(--rs);border:1px solid var(--border);font-size:13px;font-weight:500;display:flex;align-items:center;gap:8px;cursor:pointer;transition:.1s;background:var(--white)}
.platform-chip.active{border-color:var(--teal);color:var(--teal);background:var(--teal-light)}
.review-list{display:flex;flex-direction:column;gap:12px}
.review-card{background:var(--white);border-radius:var(--r);border:1px solid var(--border);padding:20px}
.review-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.reviewer-info{display:flex;align-items:center;gap:12px}
.reviewer-avatar{width:40px;height:40px;border-radius:50%;background:var(--teal-light);display:flex;align-items:center;justify-content:center;font-size:18px}
.reviewer-name{font-size:14px;font-weight:600}
.reviewer-date{font-size:12px;color:var(--text-sec)}
.review-stars{font-size:16px}
.review-text{font-size:14px;color:var(--text);line-height:1.6;margin-bottom:12px}
.review-platform{font-size:11px;color:var(--text-sec);padding:2px 8px;border:1px solid var(--border);border-radius:20px;display:inline-block}
.review-reply{background:var(--teal-light);border-radius:var(--rs);padding:12px;margin-top:10px;font-size:13px;color:var(--teal-dark);border-left:3px solid var(--teal)}
/* MODAL */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:200;display:none;align-items:center;justify-content:center;padding:24px}
.modal-overlay.open{display:flex}
.modal{background:var(--white);border-radius:var(--r);padding:32px;max-width:480px;width:100%;max-height:80vh;overflow-y:auto;position:relative}
.modal-title{font-size:20px;font-weight:700;margin-bottom:4px}
.modal-subtitle{font-size:13px;color:var(--text-sec);margin-bottom:24px}
.modal-close{position:absolute;top:16px;right:16px;background:none;border:none;font-size:20px;cursor:pointer;padding:4px;border-radius:6px}
.modal-close:hover{background:var(--bg)}
.form-group{margin-bottom:16px}
.form-label{font-size:13px;font-weight:500;margin-bottom:6px;display:block}
.form-input{width:100%;padding:10px 14px;border:1px solid var(--border);border-radius:var(--rs);font-size:14px;font-family:inherit;outline:none;transition:.1s}
.form-input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(46,140,132,.1)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.allergen-list{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.allergen-tag{padding:6px 12px;border-radius:20px;font-size:12px;font-weight:500;display:flex;align-items:center;gap:6px}
.allergen-tag.has{background:#FEF2F2;color:#DC2626;border:1px solid #FCA5A5}
.allergen-tag.none{background:var(--teal-light);color:var(--teal);border:1px solid #A7F3D0}
/* NOTIF PANEL */
.notif-panel{position:fixed;top:64px;right:0;width:360px;height:calc(100vh - 64px);background:var(--white);border-left:1px solid var(--border);z-index:150;transform:translateX(100%);transition:.25s;box-shadow:-4px 0 16px rgba(0,0,0,.08)}
.notif-panel.open{transform:none}
.notif-panel-header{padding:20px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}
.notif-panel-title{font-size:16px;font-weight:600}
.notif-item{padding:16px 20px;border-bottom:1px solid var(--border);cursor:pointer;transition:.1s;display:flex;gap:12px;align-items:flex-start}
.notif-item:hover{background:var(--bg)}
.notif-item.unread{background:#EAF5F4}
.notif-icon{font-size:20px;flex-shrink:0;margin-top:2px}
.notif-body-text{font-size:13px;line-height:1.5;color:var(--text)}
.notif-time{font-size:11px;color:var(--text-sec);margin-top:4px}
/* RIEPILOGO TAVOLO */
.riepilogo-items{background:var(--white);border-radius:var(--r);border:1px solid var(--border);overflow:hidden;margin-bottom:24px}
.riep-item{padding:14px 20px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}
.riep-item:last-child{border-bottom:none}
.riep-item-left{display:flex;align-items:center;gap:12px}
.riep-qty{width:28px;height:28px;background:var(--teal);color:#fff;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;flex-shrink:0}
.riep-name{font-size:14px;font-weight:500}
.riep-price{font-size:14px;font-weight:600}
.riep-total-row{padding:16px 20px;background:var(--teal-light);display:flex;justify-content:space-between;align-items:center;border-radius:0 0 var(--r) var(--r)}
.riep-total-label{font-size:14px;font-weight:500;color:var(--teal-dark)}
.riep-total-val{font-size:22px;font-weight:800;color:var(--teal)}
/* GESTIONE TAB */
.gestione-table{width:100%;border-collapse:collapse;background:var(--white);border-radius:var(--r);overflow:hidden;border:1px solid var(--border)}
.gestione-table th{background:var(--bg);padding:12px 16px;text-align:left;font-size:12px;font-weight:600;color:var(--text-sec);border-bottom:1px solid var(--border)}
.gestione-table td{padding:12px 16px;font-size:13px;border-bottom:1px solid var(--border)}
.gestione-table tr:last-child td{border-bottom:none}
.gestione-table tr:hover td{background:var(--teal-light)}
.badge{padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600}
.badge-green{background:#D1FAE5;color:#065F46}
.badge-red{background:#FEE2E2;color:#991B1B}
.badge-orange{background:#FEF3C7;color:#92400E}
/* ATTREZZATURE */
.attr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.attr-card{background:var(--white);border-radius:var(--r);border:1px solid var(--border);padding:20px}
.attr-icon{font-size:32px;margin-bottom:12px}
.attr-name{font-size:15px;font-weight:600;margin-bottom:4px}
.attr-detail{font-size:12px;color:var(--text-sec);margin-bottom:12px}
.attr-status{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:500}
@media(max-width:900px){.stats-grid{grid-template-columns:repeat(2,1fr)}.widgets-row{grid-template-columns:1fr}.tables-grid{grid-template-columns:repeat(3,1fr)}.products-grid{grid-template-columns:repeat(2,1fr)}.success-actions{grid-template-columns:repeat(2,1fr)}.staff-grid{grid-template-columns:repeat(2,1fr)}.menu-mgmt-grid{grid-template-columns:repeat(2,1fr)}.attr-grid{grid-template-columns:repeat(2,1fr)}}

/* DDT */
.ddt-upload-area{border:2px dashed var(--border);border-radius:var(--r);padding:60px;text-align:center;cursor:pointer;transition:.2s;background:var(--white)}
.ddt-upload-area:hover{border-color:var(--teal);background:var(--teal-light)}
.ddt-upload-area.dragover{border-color:var(--teal);background:var(--teal-light)}
.ddt-result{background:var(--white);border-radius:var(--r);border:1px solid var(--border);overflow:hidden;margin-bottom:24px}
.ddt-result-header{padding:16px 20px;border-bottom:1px solid var(--border);background:var(--teal-light);display:flex;justify-content:space-between;align-items:center}
.ddt-row{padding:12px 20px;border-bottom:1px solid var(--border);display:grid;grid-template-columns:1fr 120px 100px 100px 36px;align-items:center;gap:12px;font-size:14px}
.ddt-row:last-child{border-bottom:none}
.ddt-row.header{background:var(--bg);font-size:11px;font-weight:600;color:var(--text-sec);letter-spacing:.5px;padding:10px 20px}
.ddt-input{border:1px solid var(--border);border-radius:6px;padding:4px 8px;font-size:13px;font-family:inherit;width:100%;outline:none}
.ddt-input:focus{border-color:var(--teal)}

/* RICETTARIO */
.ing-row{border-bottom:1px solid var(--border);display:grid;grid-template-columns:28px 1fr 90px 80px 100px 28px;align-items:center;gap:8px;padding:10px 0}
.ing-row:last-child{border-bottom:none}
.ing-check{width:16px;height:16px;accent-color:var(--teal);cursor:pointer}
.ing-name{font-size:14px;font-weight:500}
.ing-scorta{display:inline-block;font-size:10px;background:#FEF3C7;color:#92400E;padding:1px 6px;border-radius:10px;margin-top:2px}
.ing-qty{width:70px;border:1px solid var(--border);border-radius:6px;padding:5px 8px;font-size:13px;font-family:inherit;outline:none;text-align:center}
.ing-qty:focus{border-color:var(--teal)}
.ing-unit{border:1px solid var(--border);border-radius:6px;padding:5px 8px;font-size:13px;font-family:inherit;outline:none;width:70px;cursor:pointer}
.ing-cost{font-size:13px;text-align:right;color:var(--text-sec)}
.ing-cost strong{display:block;font-size:14px;color:var(--text);font-weight:600}

@keyframes scanLine { 0%,100%{top:20%;opacity:.8} 50%{top:75%;opacity:1} }
@keyframes fadeIn { from{opacity:0;transform:scale(.95)} to{opacity:1;transform:scale(1)} }
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }
.pinned-chart-widget{background:var(--white);border-radius:var(--r);border:1px solid var(--border);padding:16px;position:relative;animation:fadeIn .3s ease}
.pinned-chart-widget .pin-close{position:absolute;top:8px;right:8px;background:none;border:none;cursor:pointer;color:var(--text-sec);font-size:14px;opacity:.5}
.pinned-chart-widget .pin-close:hover{opacity:1}

/* WIDGET SYSTEM */
.widget-card{background:var(--white);border-radius:var(--r);border:1px solid var(--border);padding:18px;position:relative;transition:box-shadow .2s,border-color .2s,transform .15s;animation:fadeIn .25s ease}
.widget-card:hover{box-shadow:0 4px 16px rgba(0,0,0,.08)}
/* Edit mode */
.widget-card.edit-mode{border:2px dashed var(--teal);cursor:grab}
.widget-card.edit-mode:active{cursor:grabbing}
.widget-card.dragging{opacity:.3;transform:scale(.96)}
.widget-card.drag-over{border:2px solid var(--yellow)!important;background:var(--orange-light);transform:scale(1.02);box-shadow:0 6px 24px rgba(212,232,71,.35)}
.widget-edit-bar{display:flex;align-items:center;gap:6px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--border);transition:opacity .15s}
.widget-card:hover .widget-edit-bar{opacity:1!important;pointer-events:auto!important}
.widget-drag-handle{font-size:20px;color:var(--text-sec);cursor:grab;user-select:none;flex-shrink:0;line-height:1}
.widget-drag-handle:active{cursor:grabbing}
.widget-edit-name{font-size:13px;font-weight:600;color:var(--text);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Size + close buttons (only in edit mode) */
.wt-btn{background:var(--bg);border:1px solid var(--border);border-radius:4px;padding:3px 8px;font-size:11px;cursor:pointer;font-family:inherit;font-weight:700;color:var(--text-sec);transition:.1s}
.wt-btn:hover{background:var(--teal);color:#fff;border-color:var(--teal)}
.wt-btn.active{background:var(--teal);color:#fff;border-color:var(--teal)}
.wt-close{background:none;border:1px solid transparent;border-radius:4px;cursor:pointer;color:var(--text-sec);font-size:15px;padding:3px 6px;line-height:1;transition:.1s}
.wt-close:hover{color:var(--red);border-color:var(--red);background:var(--red-light)}
.widget-title{font-size:13px;font-weight:600;color:var(--teal);margin-bottom:12px;display:flex;align-items:center;gap:6px}
/* Edit mode overlay banner */
#edit-mode-banner{display:none;background:var(--teal);color:#fff;text-align:center;padding:10px 16px;font-size:13px;font-weight:600;border-radius:var(--r);margin-bottom:16px;gap:12px;align-items:center;justify-content:center}
#edit-mode-banner.visible{display:flex}
/* Widget picker */
.widget-picker-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-height:480px;overflow-y:auto;padding:4px}
.widget-option{border:2px solid var(--border);border-radius:var(--r);padding:16px;cursor:pointer;transition:.15s;background:var(--white)}
.widget-option:hover{border-color:var(--teal);background:var(--teal-light)}
.widget-option.added{border-color:var(--green);background:#F0FDF4;cursor:default}
.wo-icon{font-size:28px;margin-bottom:8px}
.wo-name{font-size:13px;font-weight:700;margin-bottom:4px}
.wo-desc{font-size:11px;color:var(--text-sec);line-height:1.4}
/* Widget content */
.mini-bar-row{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.mini-bar{flex:1;height:6px;background:var(--bg);border-radius:3px;overflow:hidden}
.mini-bar-fill{height:100%;background:var(--teal);border-radius:3px}
.reservation-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--border);font-size:13px}
.reservation-row:last-child{border-bottom:none}
.goal-ring{width:80px;height:80px}

/* MENU CLIENTI */
.mc-card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 2px 12px rgba(0,0,0,.07);transition:transform .2s,box-shadow .2s;cursor:default}
.mc-card:hover{transform:translateY(-3px);box-shadow:0 8px 28px rgba(0,0,0,.12)}
.mc-photo{width:100%;height:200px;object-fit:cover;display:block}
.mc-photo-fallback{width:100%;height:200px;background:var(--teal-light);display:flex;align-items:center;justify-content:center;font-size:56px}
.mc-body{padding:16px 18px 18px}
.mc-badges{display:flex;gap:6px;margin-bottom:10px;flex-wrap:wrap}
.mc-badge{font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;letter-spacing:.3px}
.mc-name{font-size:18px;font-weight:800;color:#1A2332;margin-bottom:6px;line-height:1.2}
.mc-desc{font-size:13px;color:#6B7280;line-height:1.65;margin-bottom:14px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.mc-allergens{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:14px}
.mc-allergen{font-size:11px;font-weight:600;padding:3px 8px;border-radius:6px;white-space:nowrap}
.mc-footer{display:flex;justify-content:space-between;align-items:center;padding-top:12px;border-top:1px solid #F3F4F6}
.mc-price{font-size:22px;font-weight:900;color:var(--teal)}
.mc-cat-tabs{display:flex;gap:8px;padding:14px 20px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;background:#fff;border-bottom:1px solid #F3F4F6;position:sticky;top:64px;z-index:9}
.mc-cat-tabs::-webkit-scrollbar{display:none}
.mc-cat-btn{padding:8px 18px;border-radius:30px;border:1.5px solid #E5E7EB;background:#fff;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:.15s;font-family:inherit;color:#6B7280}
.mc-cat-btn.active,.mc-cat-btn:hover{background:var(--teal);color:#fff;border-color:var(--teal)}
.mc-search-wrap{position:sticky;top:0;z-index:10;background:#fff;border-bottom:1px solid #F3F4F6;padding:12px 20px}


/* ── PRINT / RECEIPT ── */
@media print {
  header, #mobile-nav, .back-btn, .btn, nav, #edit-mode-banner,
  #screen-sala, #screen-staff, #screen-menupage, #screen-analytics,
  #screen-magazzino, #screen-feedback, #screen-clienti,
  #screen-dashboard, #screen-cucina-live, .modal-overlay:not(#modal-ricevuta) { display:none!important }
  body, html { background:#fff!important }
  .receipt-print { display:block!important; font-family:'Courier New',monospace; max-width:300px; margin:0 auto; font-size:12px }
  #ricevuta-content { display:block!important; padding:0!important }
}
.receipt-print { display:none }

/* ═══ BRAND PASS: stile Figma applicato globalmente ════════════════════════ */

/* Header app viola brand */
header { background: var(--purple) !important; border-bottom: none; box-shadow: 0 2px 8px rgba(74,48,95,0.15); }
header .logo-text, header .nav-item { color: rgba(255,255,255,0.92) !important; }
header .nav-item:hover { background: rgba(255,255,255,0.1) !important; color: #fff !important; }
header .nav-item.active { background: var(--yellow) !important; color: var(--purple) !important; font-weight: 700; }
header .notif-btn, header .header-user, header #btn-logout { color: #fff !important; border-color: rgba(255,255,255,0.3) !important; }
header .notif-btn:hover, header .header-user:hover { background: rgba(255,255,255,0.1) !important; }

/* Bottoni primary = giallo brand con testo nero (look Figma) */
.btn-primary { background: var(--yellow) !important; color: var(--purple) !important; font-weight: 700 !important; border: none; }
.btn-primary:hover { background: var(--yellow-bright) !important; }

/* Card più soft + shadow viola */
.card, .stat, .sala-num, .ai-card, .chart, .page-tabs {
  border-radius: var(--r) !important;
  box-shadow: var(--shadow);
}

/* Tab attiva = giallo */
.tab-btn.active { background: var(--yellow) !important; color: var(--purple) !important; font-weight: 700 !important; }

/* Mobile nav attiva */
.mobile-nav-item.active { color: var(--purple) !important; }
.mobile-nav-item.active .mn-icon { background: var(--yellow); color: var(--purple); border-radius: 50%; }

/* Stat numbers in teal brand */
.stat-label { color: var(--teal) !important; }

/* AI card: gradiente brand */
.ai-card { background: linear-gradient(135deg, var(--purple) 0%, var(--teal) 100%) !important; }

/* Page tabs background warm-cream */
.page-tabs { background: var(--bg) !important; }

/* Body background warm pastel */
body { background: var(--bg) !important; }

/* Toast notifiche brand */
.toast { background: var(--purple) !important; color: var(--yellow) !important; border-left: 4px solid var(--yellow) !important; }

/* Form input focus brand */
.form-input:focus, input:focus, select:focus, textarea:focus {
  border-color: var(--teal) !important;
  box-shadow: 0 0 0 3px rgba(0,128,129,0.12) !important;
  outline: none;
}

/* Login screen: gradiente brand */
#screen-login .login-wrap { background: linear-gradient(160deg, #6B4583 0%, #4B305F 50%, #2C1A3A 100%) !important; border-radius: 24px; padding: 32px 24px; box-shadow: 0 20px 60px rgba(0,0,0,0.35); }

/* ═══ LOGIN SCREEN — full purple, no green leftover ═══════════════════════ */
#screen-login .pin-dot.filled { background: var(--yellow) !important; }
#screen-login .pin-btn { background: rgba(255,255,255,0.95); color: var(--purple); border: none; }
#screen-login .pin-btn:hover { background: var(--yellow) !important; border-color: var(--yellow) !important; color: var(--purple) !important; }
#screen-login .ob-dot.active { background: var(--yellow); }
#screen-login .login-sub { color: rgba(255,255,255,0.85); }
#screen-login .staff-name-login { color: #fff; }
#screen-login .staff-role-login { color: rgba(255,255,255,0.75); }
#screen-login .staff-card-login:hover { background: rgba(222,220,0,0.18) !important; border-color: var(--yellow) !important; }

/* ── GESTIONE / ADMIN tabs ───────────────────────────────────── */
.gest-tab{background:none;border:none;border-bottom:3px solid transparent;padding:10px 16px;font-size:14px;font-weight:600;color:var(--text-sec);cursor:pointer;font-family:inherit;border-radius:8px 8px 0 0;transition:all .15s}
.gest-tab:hover{color:var(--text);background:var(--bg)}
.gest-tab.active{color:var(--purple);border-bottom-color:var(--yellow);background:var(--purple-light)}
.gest-section{background:var(--white);border:1px solid var(--border);border-radius:var(--r);padding:20px;margin-bottom:16px}
.gest-section h3{font-size:15px;font-weight:800;margin:0 0 14px;color:var(--text)}
.gest-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}
.gest-row:last-child{border-bottom:none}
.gest-evt{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border:1px solid var(--border);border-radius:12px;margin-bottom:8px;background:var(--bg)}

/* ════════════════════════════════════════════════════════════════════════════
   MOBILE — passata generale (hardening telefono). Solo override entro @media.
   ════════════════════════════════════════════════════════════════════════════ */
@media(max-width:600px){
  /* ── Editor ricetta / food cost: 5 colonne fisse → compatte ma allineate ── */
  #menu-edit-recipe div[style*="grid-template-columns"]{grid-template-columns:1fr 56px 46px 62px 24px!important;gap:4px!important}
  #menu-edit-recipe input{padding:8px 6px!important;font-size:14px!important}
  /* Tabella ingredienti del ricettario: scorrevole se serve */
  #ingredienti-tbody{font-size:13px}
  .ing-qty,.ing-unit{min-width:0}

  /* ── Tab Gestione/Admin: scroll orizzontale, niente wrap caotico ── */
  #gestione-tabs,#screen-admin .adm-tab,div[id$="-tabs"].page-tabs{flex-wrap:nowrap!important;overflow-x:auto;-webkit-overflow-scrolling:touch}
  #gestione-tabs::-webkit-scrollbar,.page-tabs::-webkit-scrollbar{display:none}
  .gest-tab,.adm-tab{flex:0 0 auto;padding:11px 13px!important;font-size:13px!important}

  /* ── Righe gestione (label + controllo): impilate ── */
  .gest-row{flex-direction:column;align-items:stretch;gap:8px;text-align:left}
  .gest-row > *:last-child{align-self:flex-start}
  .gest-section{padding:16px}

  /* ── Card piatti/bevande/prodotti: azioni a tutta larghezza ── */
  .dish-actions{flex-wrap:wrap;gap:8px}
  .dish-actions .btn{flex:1 1 auto;min-width:120px;justify-content:center}

  /* ── Recap economico / stat grids: 1 colonna ── */
  #recap-economico,.cost-recap-grid{grid-template-columns:1fr!important}

  /* ── Console admin: usabile (non bella) su telefono ── */
  #admin-kpi-grid{grid-template-columns:repeat(2,1fr)!important}
  #screen-admin .adm-card{padding:16px!important}
  #screen-admin table{font-size:12px}
  #screen-admin .adm-card div[style*="overflow-x"]{overflow-x:auto;-webkit-overflow-scrolling:touch}
  #screen-admin table th,#screen-admin table td{white-space:nowrap}

  /* ── Tabelle generiche: scroll orizzontale invece di rompere il layout ── */
  .gestione-table{display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}

  /* ── Modali nuove: a tutta larghezza, scroll interno ── */
  #modal-add-ingrediente .modal,#modal-offerta-picker .modal,#modal-reset-password .modal,
  #modal-add-bevanda .modal,#modal-edit-product .modal,#modal-edit-cost .modal{
    max-width:100%!important;width:100%!important;border-radius:18px 18px 0 0!important;
    max-height:92vh;overflow-y:auto;
  }
  #modal-add-ingrediente .modal [style*="grid-template-columns:1fr 1fr"]{grid-template-columns:1fr!important}

  /* ── Timbratura: card e pulsante grandi e comodi ── */
  #timbratura-card{padding:18px!important}
  #timbratura-btn{width:100%!important;min-height:50px;font-size:15px;margin-top:10px}
  #timbratura-card > div{flex-direction:column;align-items:stretch!important}

  /* ── Picker offerta: righe comode ── */
  #offerta-picker-body button{min-height:40px}
}

/* Telefoni molto stretti (≤360px): ulteriore compressione editor ricetta */
@media(max-width:360px){
  #menu-edit-recipe div[style*="grid-template-columns"]{grid-template-columns:1fr 48px 40px 54px 20px!important}
}
