*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --green:#1D9E75;--green-light:#E1F5EE;--green-dark:#0F6E56;
  --purple:#534AB7;--purple-light:#EEEDFE;
  --coral:#D85A30;--amber:#BA7517;--amber-light:#FAEEDA;
  --gray-50:#F7F6F2;--gray-100:#EDECEA;--gray-200:#D3D1C7;
  --gray-300:#B4B2A9;--gray-400:#888780;--gray-600:#5F5E5A;--gray-900:#111110;
  --white:#FFFFFF;
  --r-sm:8px;--r-md:12px;--r-lg:16px;--r-xl:24px;
  --sidebar-w:220px;--shopping-w:360px;--nav-h:72px;
}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:var(--gray-50);color:var(--gray-900);min-height:100dvh}

/* ─── DESKTOP GRID ───────────────────────────────────────── */
@media(min-width:768px){
  body{display:grid;grid-template-columns:var(--sidebar-w) 1fr var(--shopping-w);grid-template-rows:100dvh;overflow:hidden}
  #app{display:contents!important}
  #login-page{grid-column:1/-1;grid-row:1;z-index:999}
  .bottom-nav{display:none!important}
  #sidebar{display:flex!important}
  #desktop-shopping{display:flex!important;flex-direction:column;grid-column:3;grid-row:1;overflow:hidden}
  .page{padding-bottom:0!important}
  #page-piano,#page-ricette,#page-ingredienti,#page-impostazioni{grid-column:2;grid-row:1;overflow-y:auto}
  #page-spesa{display:none!important}
  .cal-header{justify-content:flex-start}
  .cal-header-title{order:2!important;flex-basis:auto!important;margin-left:14px}
  .cal-header-actions{order:3!important;margin-left:auto}
  .ev-nutrition-panel{display:block!important;width:260px;max-height:85dvh;overflow-y:auto;background:var(--white);border-radius:var(--r-xl);padding:18px;margin-left:16px;align-self:center;box-shadow:0 20px 60px rgba(0,0,0,.25)}
}
@media(max-width:767px){
  body{max-width:430px;margin:0 auto;display:block}
  #sidebar,
  .page{padding-bottom:calc(var(--nav-h) + 24px)}
}

/* ─── SIDEBAR ────────────────────────────────────────────── */
#sidebar{display:none;grid-column:1;grid-row:1;flex-direction:column;background:var(--white);border-right:0.5px solid var(--gray-100);padding:24px 0;overflow-y:auto}
.sidebar-logo{padding:0 20px 24px;display:flex;align-items:center;gap:10px}
.sidebar-logo-icon{width:36px;height:36px;background:var(--green-light);border-radius:10px;display:flex;align-items:center;justify-content:center}
.sidebar-logo-text{font-size:15px;font-weight:700}
.sidebar-section{padding:0 12px;margin-bottom:4px}
.sidebar-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--gray-400);padding:0 8px;margin-bottom:6px}
.sidebar-item{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:var(--r-sm);font-size:14px;font-weight:500;color:var(--gray-600);cursor:pointer;transition:all .15s}
.sidebar-item:hover{background:var(--gray-50);color:var(--gray-900)}
.sidebar-item.active{background:var(--green-light);color:var(--green-dark)}
.sidebar-item svg{width:18px;height:18px;flex-shrink:0}
.sidebar-bottom{margin-top:auto;padding:12px}

/* ─── DESKTOP SHOPPING PANEL ─────────────────────────────── */
#desktop-shopping{display:none;grid-column:3;grid-row:1;flex-direction:column;background:var(--white);border-left:0.5px solid var(--gray-100);overflow:hidden}
.dsp-header{padding:10px 12px;border-bottom:0.5px solid var(--gray-100);flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:6px}
.dsp-header h2{font-size:14px;font-weight:700;margin:0;flex-shrink:0;white-space:nowrap}
.dsp-body{flex:1;overflow-y:auto;overflow-x:hidden;padding-bottom:16px;min-height:0}

/* ─── PAGES ──────────────────────────────────────────────── */
.page{display:none;flex-direction:column;min-height:100dvh}
.page.active{display:flex}
.page-header{position:sticky;top:0;z-index:10;background:var(--white);border-bottom:0.5px solid var(--gray-100);padding:14px 16px 10px;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:60px}
.cal-header-toggle{order:1}
.cal-header-actions{order:2}
.cal-header-title{order:3;flex-basis:100%}
.page-content{flex:1;padding:12px 0}

/* ─── BOTTOM NAV ─────────────────────────────────────────── */
.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:430px;height:var(--nav-h);background:var(--white);border-top:0.5px solid var(--gray-100);z-index:100;padding-bottom:env(safe-area-inset-bottom,8px);display:flex}
.nav-item{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:10px;color:var(--gray-400);cursor:pointer;-webkit-tap-highlight-color:transparent;text-decoration:none;transition:color .15s}
.nav-item.active{color:var(--green)}
.nav-item svg{width:22px;height:22px}

/* ─── CARDS ──────────────────────────────────────────────── */
.card{background:var(--white);border:0.5px solid var(--gray-100);border-radius:var(--r-md);margin:0 12px 8px;overflow:hidden;touch-action:manipulation}
.card-row{padding:12px 14px;display:flex;align-items:center;gap:12px;border-bottom:0.5px solid var(--gray-50);cursor:pointer}
.card-row:last-child{border-bottom:none}

/* ─── BUTTONS ────────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 18px;border-radius:var(--r-sm);font-size:14px;font-weight:500;cursor:pointer;border:none;-webkit-tap-highlight-color:transparent;transition:opacity .15s,transform .1s}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--green);color:var(--white)}
.btn-danger{background:#E24B4A;color:var(--white)}
.btn-ghost{background:transparent;color:var(--gray-600);border:0.5px solid var(--gray-200)}
.btn-icon{width:36px;height:36px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;background:transparent;transition:opacity .15s}
.btn-icon:active{opacity:.7}
.btn-fab{width:44px;height:44px;border-radius:50%;background:var(--green);color:var(--white);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;flex-shrink:0}

/* ─── FORMS ──────────────────────────────────────────────── */
.form-group{margin-bottom:14px}
.form-label{display:block;font-size:11px;font-weight:600;color:var(--gray-600);margin-bottom:5px;text-transform:uppercase;letter-spacing:.04em}
.form-input,.form-select,.form-textarea{width:100%;padding:10px 12px;border:0.5px solid var(--gray-200);border-radius:var(--r-sm);font-size:15px;background:var(--white);color:var(--gray-900);outline:none;transition:border-color .15s;appearance:none;-webkit-appearance:none}
.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--green)}
.form-select:disabled{opacity:.55;cursor:not-allowed;background:var(--gray-100)}
.form-textarea{min-height:80px;resize:vertical}
.search-wrapper{position:relative}
.search-wrapper svg{position:absolute;left:10px;top:50%;transform:translateY(-50%);pointer-events:none}
.search-input{padding-left:36px!important}
.searchable-select{position:relative}
.searchable-select .dropdown{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--white);border:0.5px solid var(--gray-200);border-radius:var(--r-sm);max-height:200px;overflow-y:auto;z-index:200;display:none;box-shadow:0 4px 16px rgba(0,0,0,.08)}
.searchable-select .dropdown.open{display:block}
.dropdown-item{padding:10px 12px;font-size:14px;cursor:pointer;border-bottom:0.5px solid var(--gray-50)}
.dropdown-item:hover{background:var(--gray-50)}
.dropdown-item:last-child{border-bottom:none}

/* ─── PILLS ──────────────────────────────────────────────── */
.pill{display:inline-block;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:500;white-space:nowrap}
.pill-pranzo{background:var(--green-light);color:var(--green-dark)}
.pill-cena{background:var(--purple-light);color:var(--purple)}
.pill-colazione{background:var(--amber-light);color:var(--amber)}
.pill-secondacolazione{background:#FFF3CD;color:#856404}
.pill-spuntino{background:var(--gray-100);color:var(--gray-600)}

/* ─── MEAL TYPE CHIPS (selettore tipo pasto nel form ricetta) ─────────── */
.meal-type-chip{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;font-size:13px;font-weight:600;cursor:pointer;border:1.5px solid var(--gray-200);color:var(--gray-400);background:transparent;transition:all .15s ease;user-select:none}
.meal-type-chip input{position:absolute;opacity:0;pointer-events:none}
.meal-type-chip:hover{border-color:var(--gray-300)}
.meal-type-chip .mtc-dot{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.5}
.meal-type-chip.selected .mtc-dot{opacity:1}
.meal-type-chip.mt-colazione.selected{background:var(--amber-light);color:var(--amber);border-color:var(--amber-light)}
.meal-type-chip.mt-secondacolazione.selected{background:#FFF3CD;color:#856404;border-color:#FFF3CD}
.meal-type-chip.mt-pranzo.selected{background:var(--green-light);color:var(--green-dark);border-color:var(--green-light)}
.meal-type-chip.mt-spuntino.selected{background:var(--gray-100);color:var(--gray-900);border-color:var(--gray-300)}
.meal-type-chip.mt-cena.selected{background:var(--purple-light);color:var(--purple);border-color:var(--purple-light)}
:root.dark .meal-type-chip.mt-secondacolazione.selected{background:#4a3a10;color:#e0c068}
.member-avatar{width:22px;height:22px;border-radius:50%;font-size:9px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}

/* ─── SECTION LABELS ─────────────────────────────────────── */
.section-label{padding:10px 14px 4px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--gray-400)}
.section-label.green{color:var(--green)}
.section-label.coral{color:var(--coral)}

/* ─── MODAL ──────────────────────────────────────────────── */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:500;display:none;align-items:flex-end;justify-content:center}
.modal-overlay.open{display:flex}
.modal-sheet{background:var(--white);border-radius:var(--r-xl) var(--r-xl) 0 0;width:100%;max-width:500px;max-height:92dvh;overflow-y:auto;padding:8px 16px 32px;animation:slideUp .25s ease}
@keyframes slideUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.modal-handle{width:36px;height:4px;background:var(--gray-200);border-radius:999px;margin:8px auto 16px}
.modal-title{font-size:17px;font-weight:600;margin-bottom:16px}

/* ─── CALENDAR TOGGLE ────────────────────────────────────── */
.view-toggle{display:flex;background:var(--gray-100);border-radius:var(--r-sm);padding:3px;gap:2px}
.view-toggle-btn{padding:5px 12px;border-radius:6px;font-size:12px;font-weight:500;cursor:pointer;border:none;background:transparent;color:var(--gray-600);transition:all .15s;-webkit-tap-highlight-color:transparent}
.view-toggle-btn.active{background:var(--white);color:var(--gray-900);box-shadow:0 1px 3px rgba(0,0,0,.1)}

/* ─── WEEK LIST VIEW (drag & drop) ──────────────────────── */
.week-day-section{margin-bottom:2px}
.week-day-header{display:flex;align-items:center;gap:8px;padding:10px 14px 6px;background:var(--gray-50);position:sticky;top:106px;z-index:5;border-bottom:0.5px solid var(--gray-100)}
.week-day-header.today .week-day-name,.week-day-header.today .week-day-date{color:var(--green)}
.week-day-name{font-size:13px;font-weight:700;min-width:80px}
.week-day-date{font-size:12px;color:var(--gray-400)}
.week-add-day-btn{background:none;border:none;cursor:pointer;color:var(--gray-300);display:flex;align-items:center;padding:4px;border-radius:var(--r-sm);-webkit-tap-highlight-color:transparent;transition:color .15s;margin-left:auto}
.week-add-day-btn:hover{color:var(--green)}
.day-advice-btn{background:none;border:none;padding:2px;cursor:pointer;display:inline-flex;align-items:center;-webkit-tap-highlight-color:transparent;flex-shrink:0}
.wgh-daynum-row{display:flex;align-items:center;justify-content:center;gap:2px}
.day-advice-btn-grid{position:relative;top:-1px}
.week-day-meals{padding:6px 12px 4px;min-height:44px;transition:background .15s;border-radius:var(--r-sm)}
.week-day-meals.drag-over{background:var(--green-light);outline:2px dashed var(--green);outline-offset:-2px}
.week-day-empty{padding:10px 14px;font-size:13px;color:var(--gray-300);cursor:pointer;-webkit-tap-highlight-color:transparent}
.week-day-empty:hover{color:var(--green)}
.week-meal-card{background:var(--white);border:0.5px solid var(--gray-100);border-radius:var(--r-md);padding:10px 12px;margin-bottom:6px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;-webkit-tap-highlight-color:transparent;transition:opacity .15s;user-select:none}
.week-meal-card:active{opacity:.8}
.week-meal-card[draggable=true]{cursor:grab}
.week-meal-card-left{display:flex;flex-direction:column;gap:5px;flex:1;min-width:0}
.week-meal-name{font-size:14px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ─── WEEK GRID VIEW (Google Calendar style) ─────────────── */
.week-grid-header{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:0.5px solid var(--gray-100);padding:8px 12px 6px;gap:2px}
.wgh-cell{text-align:center}
.wgh-dayname{font-size:10px;color:var(--gray-400);margin-bottom:4px}
.wgh-daynum{width:30px;height:30px;border-radius:50%;font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center;margin:0 auto;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .15s}
.wgh-daynum.today{background:var(--green);color:#fff}
.wgh-daynum.selected{background:var(--green-light);color:var(--green-dark)}
.week-grid-body{padding:6px 12px 8px;display:flex;flex-direction:column;gap:3px}
.wgb-row{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.wgb-cell{min-height:40px}
.wgb-event{padding:4px 5px;border-radius:6px;font-size:9px;font-weight:500;cursor:pointer;line-height:1.3;-webkit-tap-highlight-color:transparent;border:none;text-align:left;width:100%;overflow:hidden;word-break:break-word;min-height:40px;transition:opacity .15s}
.wgb-event:active{opacity:.8}
.wgb-empty{background:transparent;border:0.5px dashed var(--gray-200);border-radius:6px;font-size:16px;color:var(--gray-200);cursor:pointer;display:flex;align-items:center;justify-content:center;min-height:40px;width:100%;-webkit-tap-highlight-color:transparent;transition:border-color .15s,color .15s}
.wgb-empty:hover{border-color:var(--green);color:var(--green)}
.wgb-meal-label{font-size:8px;opacity:.65;margin-bottom:1px}
.wgb-bonus-empty{border-color:#F6CFB5;color:#D98959;background:var(--green-light)}
.wgb-bonus-empty:hover{border-color:#A34719;color:#A34719}
.wgb-calories-row{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-top:3px}
.wgb-calories-cell{min-height:34px;background:var(--green-light);border-radius:6px;padding:7px 6px;overflow-x:auto}
.wgb-calories-values{font-size:11px;line-height:1.3;color:var(--green-dark);font-weight:700;display:flex;flex-wrap:wrap;align-items:baseline;gap:0 5px}
.week-bonus-add{width:100%;border:0.5px dashed #F3B38A;border-radius:var(--r-sm);background:#FFF6F0;color:#A34719;padding:7px 10px;font-size:12px;font-weight:600;cursor:pointer;margin-top:2px}
.week-day-calories{font-size:12px;font-weight:600;color:var(--green-dark);padding:8px 2px 3px;display:flex;flex-wrap:wrap;align-items:baseline;gap:0 6px}
.dc-member{white-space:nowrap}
.wgb-calories-values .dc-member:not(:last-child)::after,.week-day-calories .dc-member:not(:last-child)::after{content:'·';margin-left:5px;opacity:.5;font-weight:400}
@media(max-width:767px){
  .wgb-calories-values,.week-day-calories{flex-direction:column;align-items:flex-start;gap:1px}
  .wgb-calories-values .dc-member:not(:last-child)::after,.week-day-calories .dc-member:not(:last-child)::after{content:none}
}
.wgb-calories-cell.calorie-warning{background:var(--amber-light)}
.wgb-calories-cell.calorie-warning .wgb-calories-values{color:var(--amber)}
.wgb-calories-cell.calorie-danger{background:#FCEBEB}
.wgb-calories-cell.calorie-danger .wgb-calories-values{color:#A32D2D}
.week-day-calories.calorie-warning{color:var(--amber)}
.week-day-calories.calorie-danger{color:#A32D2D}

/* ─── SHOPPING ───────────────────────────────────────────── */
.shop-date-range{display:flex;gap:6px;align-items:center;padding:0 12px 10px}
.date-pill{flex:1;background:var(--white);border:0.5px solid var(--gray-200);border-radius:var(--r-sm);padding:8px 10px;font-size:13px;text-align:center;color:var(--gray-900)}
.shop-item{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--gray-100);transition:background .1s}
.shop-item:last-child{border-bottom:none}
.check-circle{width:22px;height:22px;border-radius:50%;border:1.5px solid var(--gray-200);flex-shrink:0;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;-webkit-tap-highlight-color:transparent}
.check-circle.checked{background:var(--green);border-color:var(--green)}
.check-circle.future-icon{border-color:var(--coral)}
.shop-item-name{font-size:14px;font-weight:500;flex:1}
.shop-item-sub{font-size:11px;color:var(--gray-400);margin-top:2px}
.shop-item-right{text-align:right;flex-shrink:0}
.shop-item-qty{font-size:13px;color:var(--gray-600);font-weight:500}
.shop-item-buy{font-size:11px;color:var(--coral);font-weight:600;margin-top:1px}
.shop-item.checked-item .shop-item-name{text-decoration:line-through;color:var(--gray-400)}
.manual-input{caret-color:var(--green)}
.manual-input:focus{outline:none!important;border-color:transparent!important;box-shadow:none!important}

/* ─── FILTER CHIPS ───────────────────────────────────────── */
.filter-chips{display:flex;gap:6px;padding:0 12px 10px;overflow-x:auto;scrollbar-width:none}
.filter-chips::-webkit-scrollbar{display:none}
.chip{padding:5px 12px;border-radius:999px;font-size:12px;font-weight:500;cursor:pointer;white-space:nowrap;background:var(--white);color:var(--gray-600);border:0.5px solid var(--gray-200);-webkit-tap-highlight-color:transparent;transition:all .15s}
.chip.active{background:var(--green);color:var(--white);border-color:var(--green)}

/* ─── INGREDIENT ROW ─────────────────────────────────────── */
.nutrient-badge{display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--white);border-radius:var(--r-sm);padding:7px 10px;font-size:12px}
.ev-nutrition-panel{display:none}
.ev-panel-arrow{color:var(--gray-400);margin:0 3px;font-weight:400}
.advice-star{font-size:12px}
.nutrient-badge-label{color:var(--gray-600)}
.nutrient-badge-value{font-weight:600;color:var(--green-dark)}
.nutrient-badge-target{font-weight:500;color:var(--gray-400)}
.nutrient-badge-asterisk{color:var(--gray-400);font-weight:400}
.nutrient-badge.nutrient-warning .nutrient-badge-value{color:var(--amber)}
.nutrient-badge.nutrient-danger .nutrient-badge-value{color:#A32D2D}
.day-meal-row{background:var(--gray-50);border-radius:var(--r-sm);padding:9px 10px;margin-bottom:6px}

.accordion{border:0;border-radius:var(--r-md);overflow:hidden;background:var(--gray-50)}
.accordion-summary{list-style:none;cursor:pointer;padding:12px 14px;font-size:13px;font-weight:600;color:var(--gray-900);display:flex;align-items:center;justify-content:space-between;gap:8px;-webkit-tap-highlight-color:transparent;user-select:none}
.accordion-summary::-webkit-details-marker{display:none}
.accordion-chevron{width:22px;height:22px;border-radius:50%;background:var(--white);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .18s ease}
.accordion-chevron svg{transition:transform .18s ease}
.accordion[open] .accordion-chevron svg{transform:rotate(180deg)}
.accordion-body{padding:2px 14px 14px}

.ing-row{background:var(--gray-50);border-radius:var(--r-sm);padding:10px;margin-bottom:8px}
.ing-row-top{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.ing-row-quantities{display:flex;gap:6px;flex-wrap:wrap}
.qty-field{display:flex;align-items:center;gap:4px;flex:1;min-width:80px}
.qty-input{width:70px;padding:7px 8px;font-size:13px}
.qty-calories{white-space:nowrap}

/* ─── TOAST ──────────────────────────────────────────────── */
.toast{position:fixed;bottom:calc(var(--nav-h) + 12px);left:50%;transform:translateX(-50%) translateY(20px);background:var(--gray-900);color:var(--white);padding:10px 18px;border-radius:var(--r-md);font-size:13px;opacity:0;transition:all .2s;z-index:1000;white-space:nowrap;pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
@media(min-width:768px){.toast{bottom:24px}}

/* ─── LOGIN ──────────────────────────────────────────────── */
#login-page{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 24px;background:var(--white)}
.login-logo{width:64px;height:64px;background:var(--green-light);border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;margin-bottom:24px}
.login-title{font-size:24px;font-weight:700;margin-bottom:6px;text-align:center}
.login-sub{font-size:14px;color:var(--gray-400);margin-bottom:32px;text-align:center}
.login-form{width:100%;max-width:360px}
.remember-row{display:flex;align-items:center;gap:8px;margin:12px 0 20px;font-size:14px;color:var(--gray-600);cursor:pointer}

/* ─── UTILS ──────────────────────────────────────────────── */
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;text-align:center;gap:12px}
.flex{display:flex}.items-center{align-items:center}.justify-between{justify-content:space-between}
.gap-2{gap:8px}.mt-1{margin-top:4px}.mt-2{margin-top:8px}
.text-xs{font-size:11px}.text-muted{color:var(--gray-400)}.text-green{color:var(--green)}.text-coral{color:var(--coral)}
.fw-500{font-weight:500}.w-full{width:100%}.px-3{padding-left:12px;padding-right:12px}
.color-option{cursor:pointer;transition:transform .1s;-webkit-tap-highlight-color:transparent}
.color-option:active{transform:scale(.9)}

/* ─── DARK MODE ──────────────────────────────────────────── */
:root.dark {
  --green:#1D9E75;--green-light:#0a3d2e;--green-dark:#4ecba0;
  --purple:#7b72dd;--purple-light:#2a2560;
  --coral:#e8714a;--amber:#d4903a;--amber-light:#3d2a0a;
  --gray-50:#1a1a1a;--gray-100:#242424;--gray-200:#333333;
  --gray-300:#555555;--gray-400:#888888;--gray-600:#b0b0b0;--gray-900:#f0f0f0;
  --white:#1e1e1e;
}
:root.dark body { background:var(--gray-50); color:var(--gray-900); }
:root.dark .page-header,
:root.dark .bottom-nav,
:root.dark #sidebar,
:root.dark #desktop-shopping,
:root.dark .modal-sheet { background:#1e1e1e; border-color:#333; }
:root.dark .ev-nutrition-panel { background:#1e1e1e; }
:root.dark .card { background:#242424; border-color:#333; }
:root.dark .card-row { border-color:#2e2e2e; }
:root.dark .form-input,
:root.dark .form-select,
:root.dark .form-textarea { background:#2a2a2a; border-color:#444; color:var(--gray-900); }
:root.dark .btn-ghost { border-color:#444; color:var(--gray-600); }
:root.dark .btn-icon { background:#2a2a2a!important; }
:root.dark .view-toggle { background:#2a2a2a; }
:root.dark .view-toggle-btn.active { background:#3a3a3a; color:var(--gray-900); }
:root.dark .chip { background:#2a2a2a; border-color:#444; color:var(--gray-600); }
:root.dark .chip.active { background:var(--green); color:#fff; border-color:var(--green); }
:root.dark .dropdown { background:#2a2a2a; border-color:#444; }
:root.dark .dropdown-item { border-color:#333; color:var(--gray-900); }
:root.dark .dropdown-item:hover { background:#333; }
:root.dark .week-day-header { background:#252525; border-color:#333; }
:root.dark .week-meal-card { background:#242424; border-color:#333; }
:root.dark .ing-row { background:#252525; }
:root.dark .wgb-empty { border-color:#444; color:#555; }
:root.dark .wgb-empty:hover { border-color:var(--green); color:var(--green); }
:root.dark .sidebar-item:hover { background:#2a2a2a; }
:root.dark .sidebar-item.active { background:#0a3d2e; color:var(--green-dark); }
:root.dark .login-page-bg { background:#1e1e1e; }
:root.dark #login-page { background:#1e1e1e; }
:root.dark .toast { background:#f0f0f0; color:#111; }
:root.dark .dsp-header { border-color:#333; }

/* ─── TOGGLE SWITCH ──────────────────────────────────────── */
.toggle-switch { position:relative; display:inline-block; width:44px; height:26px; }
.toggle-switch input { opacity:0; width:0; height:0; }
.toggle-track { position:absolute; inset:0; background:var(--gray-200); border-radius:999px; cursor:pointer; transition:background .2s; }
.toggle-switch input:checked + .toggle-track { background:var(--green); }
.toggle-thumb { position:absolute; top:3px; left:3px; width:20px; height:20px; background:#fff; border-radius:50%; transition:transform .2s; box-shadow:0 1px 3px rgba(0,0,0,.2); }
.toggle-switch input:checked + .toggle-track .toggle-thumb { transform:translateX(18px); }

/* ─── GRID DRAG & DROP ───────────────────────────────────── */
.wgb-event[draggable=true] { cursor:grab; touch-action:none; }
.wgb-event[draggable=true]:active { cursor:grabbing; }
.wgb-event.drag-over { opacity:.6; }
.wgb-empty.drag-over { border-color:var(--green)!important; background:var(--green-light)!important; color:var(--green)!important; }
.wgb-cell-stack{display:flex;flex-direction:column;gap:3px}
.wgb-cell-stack.drag-over{background:var(--green-light);border-radius:6px}
.wgb-add-more{min-height:20px;font-size:12px;opacity:.6}

/* ─── NICE CHECKBOX (Da scongelare, Ingrediente, ecc.) ─────────────────── */
.nice-checkbox{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;color:var(--gray-600);user-select:none}
.nice-checkbox input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.nc-box{width:19px;height:19px;border-radius:6px;border:1.6px solid var(--gray-300);display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--white);transition:background .15s ease,border-color .15s ease}
.nc-box svg{opacity:0;transform:scale(.5);transition:all .15s ease}
.nice-checkbox input:checked + .nc-box{background:var(--green);border-color:var(--green)}
.nice-checkbox input:checked + .nc-box svg{opacity:1;transform:scale(1)}
.nice-checkbox.nc-purple input:checked + .nc-box{background:var(--purple);border-color:var(--purple)}
.nice-checkbox.nc-amber input:checked + .nc-box{background:var(--amber);border-color:var(--amber)}
.nice-checkbox input:focus-visible + .nc-box{outline:2px solid var(--purple-light);outline-offset:2px}
.nice-checkbox:hover .nc-box{border-color:var(--gray-400)}

/* ─── TOGGLE SWITCH (sostituisce i checkbox per le opzioni booleane "importanti") ─── */
.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0}
.toggle-row .tr-label{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--gray-900);font-weight:500}
.toggle-row .tr-label svg{flex-shrink:0;color:var(--gray-500)}
.toggle-row .tr-sub{display:block;font-size:11px;font-weight:400;color:var(--gray-400);margin-top:1px}
.toggle-switch{position:relative;display:inline-block;width:42px;height:25px;flex-shrink:0}
.toggle-switch input{position:absolute;opacity:0;width:0;height:0}
.toggle-switch .ts-track{position:absolute;inset:0;background:var(--gray-200);border-radius:999px;transition:background .15s ease;cursor:pointer}
.toggle-switch .ts-track::before{content:'';position:absolute;width:19px;height:19px;left:3px;top:3px;background:var(--white);border-radius:50%;transition:transform .15s ease;box-shadow:0 1px 2px rgba(0,0,0,.15)}
.toggle-switch input:checked + .ts-track{background:var(--green)}
.toggle-switch input:checked + .ts-track::before{transform:translateX(17px)}
.toggle-switch.ts-purple input:checked + .ts-track{background:var(--purple)}
.toggle-switch input:focus-visible + .ts-track{outline:2px solid var(--purple-light);outline-offset:2px}

/* ─── SELETTORE TIPO RICETTA (Classica / Preparazione) ─────────────────── */
.type-choice{display:flex;gap:6px;margin-bottom:16px}
.type-choice-card{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:5px;padding:12px 6px;border-radius:var(--r-md);border:1.6px solid var(--gray-200);background:var(--white);cursor:pointer;transition:all .15s ease;text-align:center}
.type-choice-card svg{color:var(--gray-400);transition:color .15s ease}
.type-choice-card .tc-title{font-size:12px;font-weight:600;color:var(--gray-900)}
.type-choice-card .tc-sub{font-size:9.5px;color:var(--gray-400);line-height:1.25}
.type-choice-card.selected{border-color:var(--purple);background:var(--purple-light)}
.type-choice-card.selected svg{color:var(--purple)}
:root.dark .type-choice-card{background:var(--gray-50)}

/* ─── TOUCH DRAG GHOST ───────────────────────────────────── */
#drag-ghost {
  border-radius: var(--r-md);
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
  transform: scale(1.04) rotate(1deg);
  will-change: transform;
}

/* ─── INGREDIENT TOOLTIP ─────────────────────────────────── */
#ing-tooltip {
  animation: fadeInTip .15s ease;
}
@keyframes fadeInTip {
  from { opacity:0; transform:translateY(4px); }
  to   { opacity:1; transform:translateY(0); }
}
:root.dark #ing-tooltip {
  background: var(--gray-100);
  color: var(--gray-900);
}

.shop-item:hover{background:var(--gray-50)}
:root.dark .shop-item:hover{background:#2a2a2a}
.week-meal-card[draggable=true],.wgb-event[draggable=true]{-webkit-touch-callout:none;}
/* ─── DARK MODE FIXES ────────────────────────────────────── */
/* Shop item divider in dark mode */
:root.dark .shop-item { border-bottom-color: #3a3a3a; }
/* "Oggi" button text in dark mode */
:root.dark .btn-icon[onclick*="goToday"] { color: var(--gray-900) !important; }
/* Generic btn-icon in dark mode bg fix */
:root.dark .btn-icon { background: var(--gray-100) !important; color: var(--gray-900); }
/* Eccezione: i pulsanti "duplica" restano viola anche in dark mode */
:root.dark #rec-duplicate-btn, :root.dark #ev-duplicate-recipe-btn { background: var(--purple-light) !important; }

.dsp-header .date-pill{flex:none;width:90px;font-size:11px;padding:5px 6px}