/* ============================================
   NutriPlan v5 — Expert Nutrition Dashboard
   Premium, spacious, professional design
   ============================================ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
    --bg:#f5f4f0;--bg-card:#fff;--bg-sidebar:#0f0f1e;--bg-sidebar-hover:#191932;
    --bg-input:#f8f7f3;--border:#ddd9d0;--text:#1a1a1a;--text-sec:#6e6e6e;--text-light:#acacac;
    --accent:#4f46e5;--accent-light:#eeeafd;--accent-dark:#3730a3;--accent-glow:rgba(79,70,229,.12);
    --prot:#dc2651;--prot-light:#fce4ea;--gluc:#d97706;--gluc-light:#fef3c7;
    --lip:#0d9488;--lip-light:#d1fae5;
    --success:#16a34a;--success-bg:#dcfce7;--warn:#d97706;--warn-bg:#fef3c7;
    --danger:#dc2626;--danger-bg:#fee2e2;
    --sidebar-w:240px;--rad:12px;--rad-sm:8px;
    --shadow:0 1px 3px rgba(0,0,0,.03),0 4px 14px rgba(0,0,0,.04);
    --shadow-lg:0 8px 32px rgba(0,0,0,.1);
    --f-display:'Cormorant Garamond',Georgia,serif;
    --f-body:'DM Sans',system-ui,sans-serif;
    --f-mono:'JetBrains Mono',monospace;
    --day-lun:#4f46e5;--day-mar:#dc2651;--day-mer:#d97706;--day-jeu:#0d9488;
    --day-ven:#7c3aed;--day-sam:#0284c7;--day-dim:#e11d48;
    --meal-pdj:#b45309;--meal-pdj-bg:#fffbf0;--meal-pdj-border:#fcd9a0;
    --meal-dej:#1d4ed8;--meal-dej-bg:#f0f4ff;--meal-dej-border:#a5b4fc;
    --meal-din:#6d28d9;--meal-din-bg:#f5f0ff;--meal-din-border:#c4b5fd;
    --meal-c1:#15803d;--meal-c1-bg:#f0fdf4;--meal-c1-border:#86efac;
    --meal-c2:#be185d;--meal-c2-bg:#fff1f5;--meal-c2-border:#f9a8d4;
    --meal-c3:#0e7490;--meal-c3-bg:#f0fdfa;--meal-c3-border:#67e8f9;
}
html{font-size:14px}
body{font-family:var(--f-body);background:var(--bg);color:var(--text);display:flex;height:100vh;overflow:hidden}
::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}

/* ================================================
   SIDEBAR — Premium navigation
   ================================================ */
.sidebar{
    width:var(--sidebar-w);background:var(--bg-sidebar);
    display:flex;flex-direction:column;
    position:fixed;top:0;left:0;height:100vh;z-index:100;
    padding:0;
    border-right:1px solid rgba(255,255,255,.04);
}
.sidebar-brand{
    display:flex;align-items:center;gap:14px;
    padding:22px 20px 18px;
    border-bottom:1px solid rgba(255,255,255,.06);
}
.brand-logo{flex-shrink:0}
.brand-text{display:flex;flex-direction:column}
.sidebar-brand h1{
    font-family:var(--f-display);font-size:1.65rem;font-weight:700;
    color:#fff;letter-spacing:-.02em;line-height:1;
}
.brand-tagline{
    font-size:.68rem;font-weight:500;color:rgba(255,255,255,.35);
    text-transform:uppercase;letter-spacing:.12em;margin-top:4px;
}
.sidebar-section-label{
    font-size:.62rem;font-weight:700;color:rgba(255,255,255,.2);
    text-transform:uppercase;letter-spacing:.14em;
    padding:18px 22px 8px;
}
.sidebar-nav{display:flex;flex-direction:column;gap:2px;padding:0 12px}
.nav-btn{
    display:flex;align-items:center;gap:12px;
    padding:12px 14px;border:0;background:0 0;
    color:rgba(220,220,240,.55);font-family:var(--f-body);
    font-size:.9rem;font-weight:500;border-radius:var(--rad-sm);
    cursor:pointer;transition:all .2s;text-align:left;width:100%;
    position:relative;
}
.nav-btn .nav-label{flex:1}
.nav-btn:hover{background:var(--bg-sidebar-hover);color:rgba(255,255,255,.9)}
.nav-btn.active{
    background:linear-gradient(135deg,var(--accent),#6366f1);
    color:#fff;font-weight:600;
    box-shadow:0 4px 16px rgba(79,70,229,.4);
}
.nav-btn.active svg{stroke:#fff}
.sidebar-footer{padding:12px 12px 16px}
.sidebar-data-actions{display:flex;gap:6px;margin-bottom:6px}
.sidebar-action-btn{
    flex:1;display:flex;align-items:center;justify-content:center;gap:6px;
    padding:9px 6px;border:1px solid rgba(255,255,255,.07);border-radius:var(--rad-sm);
    background:rgba(255,255,255,.03);color:rgba(200,200,220,.45);
    font-family:var(--f-body);font-size:.72rem;font-weight:600;cursor:pointer;transition:.15s;
}
.sidebar-action-btn:hover{background:rgba(255,255,255,.08);color:rgba(255,255,255,.8);border-color:rgba(255,255,255,.12)}
.version-tag{font-size:.62rem;color:rgba(255,255,255,.12);font-family:var(--f-mono);text-align:center}

/* ================================================
   MAIN CONTENT
   ================================================ */
.main-content{margin-left:var(--sidebar-w);flex:1;height:100vh;display:flex;flex-direction:column;overflow:hidden}
.view{display:none;height:100%}.view.active{display:flex;flex-direction:column;animation:fadeIn .25s ease}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

/* ================================================
   TOPBAR — Big, breathing, with week number
   ================================================ */
.planner-topbar{
    display:flex;flex-direction:column;
    padding:16px 28px 12px;
    background:var(--bg-card);border-bottom:1px solid var(--border);
    flex-shrink:0;gap:12px;
}
.topbar-left{display:flex;align-items:center;gap:12px}
.week-arrow{
    width:42px;height:42px;border:1.5px solid var(--border);border-radius:var(--rad-sm);
    background:var(--bg-card);cursor:pointer;display:grid;place-items:center;
    color:var(--text);transition:all .15s;
}
.week-arrow:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-light);transform:scale(1.05)}
.week-display{text-align:center;min-width:340px;display:flex;flex-direction:column;align-items:center;gap:2px}
.week-number{
    display:inline-flex;align-items:center;justify-content:center;
    font-family:var(--f-mono);font-size:.72rem;font-weight:700;
    color:var(--accent);background:var(--accent-light);
    padding:3px 12px;border-radius:20px;letter-spacing:.04em;
    border:1px solid rgba(79,70,229,.15);
}
.week-day-full{
    display:block;font-family:var(--f-display);font-size:2.6rem;
    font-weight:700;color:var(--text);line-height:1;letter-spacing:-.03em;
    margin-top:2px;
}
.week-dates{display:block;font-size:.88rem;color:var(--text-sec);font-weight:500;margin-top:2px}
.btn-today{
    padding:10px 18px;border:1.5px solid var(--accent);border-radius:var(--rad-sm);
    background:linear-gradient(135deg,var(--accent-light),#e0e7ff);color:var(--accent);font-family:var(--f-body);
    font-size:.85rem;font-weight:700;cursor:pointer;transition:.18s;
    display:flex;align-items:center;gap:7px;
}
.btn-today::before{content:'📅';font-size:.9rem}
.btn-today:hover{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 3px 12px rgba(79,70,229,.3);transform:translateY(-1px)}
.btn-print{
    padding:10px 16px;border:1.5px solid var(--accent);border-radius:var(--rad-sm);
    background:var(--accent-light);color:var(--accent);font-family:var(--f-body);
    font-size:.82rem;font-weight:700;cursor:pointer;transition:.15s;
    display:flex;align-items:center;gap:7px;
}
.btn-print:hover{background:var(--accent);color:#fff}
.mini-calendar-wrapper{position:relative}
.calendar-toggle{width:42px;height:42px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:var(--bg-card);cursor:pointer;display:grid;place-items:center;color:var(--text);transition:.15s}
.calendar-toggle:hover{border-color:var(--accent);color:var(--accent)}
.mini-calendar{display:none;position:absolute;top:50px;right:0;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rad);padding:20px;box-shadow:var(--shadow-lg);z-index:50;width:340px}
.mini-calendar.open{display:block}
.mini-cal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;font-weight:700;font-size:1.15rem;font-family:var(--f-display)}
.mini-cal-arrow{width:34px;height:34px;border:0;background:var(--bg-input);border-radius:var(--rad-sm);cursor:pointer;font-size:1.3rem;color:var(--text);display:grid;place-items:center}
.mini-cal-arrow:hover{background:var(--accent-light);color:var(--accent)}
.mini-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.mini-cal-grid .cal-day-label{font-size:.72rem;font-weight:700;color:var(--text-light);text-transform:uppercase;padding:6px 0}
.mini-cal-grid .cal-day{font-size:.92rem;padding:9px 0;border-radius:var(--rad-sm);cursor:pointer;transition:.12s;font-weight:500}
.mini-cal-grid .cal-day:hover{background:var(--accent-light)}
.mini-cal-grid .cal-day.other-month{color:var(--text-light)}
.mini-cal-grid .cal-day.today{background:var(--accent);color:#fff;font-weight:700}
.mini-cal-grid .cal-day.selected-week{background:var(--accent-light);color:var(--accent);font-weight:600}

/* View Toggle */
.view-toggle{display:flex;border:1.5px solid var(--border);border-radius:var(--rad-sm);overflow:hidden;margin-left:8px}
.vtg-btn{display:flex;align-items:center;gap:6px;padding:8px 16px;border:0;background:var(--bg-card);color:var(--text-sec);font-family:var(--f-body);font-size:.82rem;font-weight:600;cursor:pointer;transition:.15s;white-space:nowrap}
.vtg-btn:first-child{border-right:1px solid var(--border)}
.vtg-btn:hover{background:var(--bg-input)}
.vtg-btn.active{background:var(--accent);color:#fff}
.vtg-btn.active svg{stroke:#fff}

/* ================================================
   DAY TABS — Full names, colorful, breathing
   ================================================ */
.day-tabs{display:flex;gap:6px}
.day-tab{
    flex:1;padding:12px 6px;border:2px solid transparent;border-radius:var(--rad);
    background:var(--bg-input);cursor:pointer;text-align:center;transition:all .2s;
}
.day-tab:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,.06)}
.day-tab.active{color:#fff;transform:translateY(-2px);box-shadow:0 5px 20px rgba(0,0,0,.14)}
.day-tab .day-name{font-weight:800;font-size:.82rem;text-transform:uppercase;letter-spacing:.03em;display:block}
.day-tab .day-date{font-size:.75rem;font-weight:500;opacity:.6;display:block;margin-top:3px}
.day-tab.active .day-name,.day-tab.active .day-date{color:#fff;opacity:1}
.day-tab[data-day="0"]{border-color:var(--day-lun)}.day-tab[data-day="0"].active{background:var(--day-lun)}
.day-tab[data-day="1"]{border-color:var(--day-mar)}.day-tab[data-day="1"].active{background:var(--day-mar)}
.day-tab[data-day="2"]{border-color:var(--day-mer)}.day-tab[data-day="2"].active{background:var(--day-mer)}
.day-tab[data-day="3"]{border-color:var(--day-jeu)}.day-tab[data-day="3"].active{background:var(--day-jeu)}
.day-tab[data-day="4"]{border-color:var(--day-ven)}.day-tab[data-day="4"].active{background:var(--day-ven)}
.day-tab[data-day="5"]{border-color:var(--day-sam)}.day-tab[data-day="5"].active{background:var(--day-sam)}
.day-tab[data-day="6"]{border-color:var(--day-dim)}.day-tab[data-day="6"].active{background:var(--day-dim)}

/* ================================================
   DASHBOARD LAYOUT
   ================================================ */
.planner-dashboard{flex:1;display:grid;grid-template-columns:1fr 290px;overflow:hidden;min-height:0}

/* Meals Grid */
.meals-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:1fr .5fr;gap:10px;padding:14px 14px 14px 24px;overflow:hidden;min-height:0}

/* ================================================
   MEAL TILES — Spacious, expert aesthetic
   ================================================ */
.meal-tile{
    border-radius:var(--rad);display:flex;flex-direction:column;
    overflow:hidden;transition:box-shadow .2s,transform .15s;min-height:0;
    border:2px solid var(--border);background:var(--bg-card);
}
.meal-tile:hover{transform:translateY(-1px);box-shadow:var(--shadow-lg)}
.meal-tile[data-meal="petit-dejeuner"]{border-color:var(--meal-pdj-border);background:var(--meal-pdj-bg)}
.meal-tile[data-meal="dejeuner"]{border-color:var(--meal-dej-border);background:var(--meal-dej-bg)}
.meal-tile[data-meal="diner"]{border-color:var(--meal-din-border);background:var(--meal-din-bg)}
.meal-tile[data-meal="collation-1"]{border-color:var(--meal-c1-border);background:var(--meal-c1-bg)}
.meal-tile[data-meal="collation-2"]{border-color:var(--meal-c2-border);background:var(--meal-c2-bg)}
.meal-tile[data-meal="collation-3"]{border-color:var(--meal-c3-border);background:var(--meal-c3-bg)}

.meal-tile-header{
    display:flex;align-items:center;justify-content:space-between;
    padding:12px 16px;flex-shrink:0;border-bottom:1px solid rgba(0,0,0,.05);
}
.meal-tile-left{display:flex;align-items:center;gap:10px}
.meal-tile-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex-shrink:0}
.meal-tile-icon svg{width:18px;height:18px}
.meal-tile-header h4{font-size:1.05rem;font-weight:800;letter-spacing:-.01em}

/* Icon backgrounds */
.meal-tile[data-meal="petit-dejeuner"] .meal-tile-icon{background:rgba(180,83,9,.12);color:var(--meal-pdj)}
.meal-tile[data-meal="dejeuner"] .meal-tile-icon{background:rgba(29,78,216,.1);color:var(--meal-dej)}
.meal-tile[data-meal="diner"] .meal-tile-icon{background:rgba(109,40,217,.1);color:var(--meal-din)}
.meal-tile[data-meal="collation-1"] .meal-tile-icon{background:rgba(21,128,61,.1);color:var(--meal-c1)}
.meal-tile[data-meal="collation-2"] .meal-tile-icon{background:rgba(190,24,93,.08);color:var(--meal-c2)}
.meal-tile[data-meal="collation-3"] .meal-tile-icon{background:rgba(14,116,144,.1);color:var(--meal-c3)}

/* Title colors */
.meal-tile[data-meal="petit-dejeuner"] h4{color:var(--meal-pdj)}
.meal-tile[data-meal="dejeuner"] h4{color:var(--meal-dej)}
.meal-tile[data-meal="diner"] h4{color:var(--meal-din)}
.meal-tile[data-meal="collation-1"] h4{color:var(--meal-c1)}
.meal-tile[data-meal="collation-2"] h4{color:var(--meal-c2)}
.meal-tile[data-meal="collation-3"] h4{color:var(--meal-c3)}

/* Collation sizing */
.meal-tile.is-collation .meal-tile-header h4{font-size:.88rem}
.meal-tile.is-collation .meal-tile-icon{width:28px;height:28px}
.meal-tile.is-collation .meal-tile-icon svg{width:14px;height:14px}
.meal-tile.is-collation .meal-tile-header{padding:8px 14px}

.meal-tile-kcal{
    font-family:var(--f-mono);font-size:1.05rem;font-weight:800;
    color:var(--accent);background:rgba(79,70,229,.08);
    padding:5px 14px;border-radius:var(--rad-sm);
}
.meal-tile.is-collation .meal-tile-kcal{font-size:.88rem;padding:4px 10px}

.meal-tile-body{flex:1;overflow-y:auto;padding:6px 16px;min-height:0}
.meal-tile.is-collation .meal-tile-body{padding:4px 12px}

/* Food items */
.meal-tile-food{
    display:flex;align-items:center;gap:6px;padding:5px 8px;margin:3px 0;
    border-radius:6px;font-size:.88rem;background:rgba(255,255,255,.7);
    border:1px solid rgba(0,0,0,.04);cursor:grab;transition:.12s;
}
.meal-tile-food:active{cursor:grabbing}
.meal-tile-food.dragging{opacity:.3}
.meal-tile-food.drag-over{border:2px dashed var(--accent);background:var(--accent-light)}
.meal-tile.is-collation .meal-tile-food{font-size:.8rem;padding:4px 6px;margin:2px 0}
.meal-tile-food:hover{background:rgba(255,255,255,.95);box-shadow:0 1px 4px rgba(0,0,0,.04)}

.mtf-emoji{font-size:1.05rem;flex-shrink:0;width:22px;text-align:center}
.meal-tile.is-collation .mtf-emoji{font-size:.9rem;width:18px}
.mtf-name{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1;color:var(--text)}
.mtf-qty{
    font-family:var(--f-mono);font-size:.78rem;color:var(--text-sec);flex-shrink:0;
    background:var(--bg-input);padding:2px 7px;border-radius:4px;cursor:pointer;
    border:1px solid transparent;transition:.15s;
}
.mtf-qty:hover{border-color:var(--accent);background:var(--accent-light)}
.mtf-qty-input{width:52px;padding:2px 5px;border:1.5px solid var(--accent);border-radius:4px;font-family:var(--f-mono);font-size:.78rem;text-align:center;background:#fff;outline:none}
.mtf-macros{display:flex;gap:4px;font-family:var(--f-mono);font-size:.72rem;font-weight:600;flex-shrink:0;margin-left:auto;padding-left:6px}
.mtf-macros .mp{color:#fff;background:var(--prot);padding:2px 5px;border-radius:4px}
.mtf-macros .mg{color:#fff;background:var(--gluc);padding:2px 5px;border-radius:4px}
.mtf-macros .ml{color:#fff;background:var(--lip);padding:2px 5px;border-radius:4px}
.mtf-remove{width:22px;height:22px;border:0;background:0 0;color:var(--text-light);cursor:pointer;border-radius:5px;display:grid;place-items:center;flex-shrink:0;transition:.12s}
.mtf-remove:hover{background:var(--danger-bg);color:var(--danger)}
.meal-tile-empty{color:var(--text-light);font-size:.85rem;text-align:center;padding:10px 0;font-style:italic}
.meal-tile.is-collation .meal-tile-empty{font-size:.78rem;padding:5px 0}

/* Footer */
.meal-tile-footer{
    padding:8px 16px;border-top:1px solid rgba(0,0,0,.05);flex-shrink:0;
    display:flex;align-items:center;justify-content:space-between;gap:6px;
}
.meal-tile.is-collation .meal-tile-footer{padding:6px 12px}
.meal-tile-macros-bar{display:flex;gap:10px;font-family:var(--f-mono);font-size:.92rem;font-weight:700;flex-wrap:wrap}
.meal-tile.is-collation .meal-tile-macros-bar{font-size:.78rem;gap:7px}
.macro-p{color:var(--prot)}.macro-g{color:var(--gluc)}.macro-l{color:var(--lip)}
.meal-tile-actions{display:flex;gap:5px}
.btn-tile-action{padding:5px 10px;border:1.5px solid var(--border);border-radius:6px;background:rgba(255,255,255,.6);color:var(--text-sec);font-family:var(--f-body);font-size:.72rem;font-weight:600;cursor:pointer;transition:.15s;display:flex;align-items:center;gap:4px}
.btn-tile-action:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-light)}
.btn-tile-action.has-recipe{border-color:var(--success);color:var(--success);background:var(--success-bg)}
.btn-open-drawer{padding:5px 12px;border:1.5px solid var(--accent);border-radius:6px;background:rgba(255,255,255,.6);color:var(--accent);font-family:var(--f-body);font-size:.75rem;font-weight:700;cursor:pointer;transition:.15s;display:flex;align-items:center;gap:5px}
.btn-open-drawer:hover{background:var(--accent);color:#fff}

/* Drop zone */
.meal-tile-body.drop-active{background:rgba(79,70,229,.04);outline:2px dashed var(--accent);outline-offset:-2px;border-radius:6px}

/* ================================================
   DAILY SIDEBAR — Expert bilan, premium feel
   ================================================ */
.daily-sidebar{
    background:linear-gradient(180deg,#fff 0%,#f8f6ff 100%);
    border-left:1px solid var(--border);padding:24px 22px;
    display:flex;flex-direction:column;align-items:center;gap:16px;overflow-y:auto;
}
.ds-header{
    display:flex;align-items:center;gap:10px;width:100%;
    padding-bottom:14px;border-bottom:2px solid var(--accent);
}
.ds-header svg{color:var(--accent);flex-shrink:0}
.ds-header span{font-size:.82rem;font-weight:800;letter-spacing:.12em;color:var(--accent)}

.ring-macro{position:relative;width:150px;height:150px;margin:8px 0}
.ring-svg{width:100%;height:100%;transform:rotate(-90deg)}
.ring-bg{fill:none;stroke:var(--bg-input);stroke-width:8}
.ring-fill{fill:none;stroke:var(--accent);stroke-width:8;stroke-linecap:round;stroke-dasharray:263.9;stroke-dashoffset:263.9;transition:stroke-dashoffset .6s ease}
.ring-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ring-val{font-family:var(--f-mono);font-size:2rem;font-weight:700;color:var(--text);line-height:1}
.ring-unit{font-size:.82rem;color:var(--text-sec);font-weight:600;margin-top:4px}

.macro-status-tag{
    display:inline-flex;padding:5px 14px;border-radius:20px;
    font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
}
.macro-status-tag.small{font-size:.65rem;padding:3px 10px}

.sidebar-macros{width:100%;display:flex;flex-direction:column;gap:20px;margin-top:10px}
.sidebar-macro-row{display:flex;flex-direction:column;gap:6px}
.sm-color-bar{width:100%;height:3px;border-radius:2px;opacity:.7}
.prot-bar{background:var(--prot)}.gluc-bar{background:var(--gluc)}.lip-bar{background:var(--lip)}
.sm-info{display:flex;justify-content:space-between;align-items:center}
.sm-label{font-size:.82rem;font-weight:800;letter-spacing:.08em;color:var(--text-sec)}
.sm-val{font-family:var(--f-mono);font-size:1.15rem;font-weight:700;color:var(--text)}
.sm-progress{height:10px;background:var(--bg-input);border-radius:5px;overflow:hidden}
.sm-bar-fill{height:100%;border-radius:5px;transition:width .4s;width:0}
.sm-bar-fill.prot{background:linear-gradient(90deg,var(--prot),#f472b6)}
.sm-bar-fill.gluc{background:linear-gradient(90deg,var(--gluc),#fbbf24)}
.sm-bar-fill.lip{background:linear-gradient(90deg,var(--lip),#34d399)}

/* ================================================
   WEEKLY VIEW
   ================================================ */
.weekly-view{flex:1;overflow:hidden;min-height:0;padding:8px 12px 10px 18px;display:flex;flex-direction:column}
.weekly-grid{display:grid;grid-template-columns:140px repeat(7,1fr);grid-template-rows:auto repeat(3,1.2fr) repeat(3,.6fr) auto;gap:1px;flex:1;border:1.5px solid var(--border);border-radius:var(--rad);overflow:hidden;background:var(--border)}
.wg-corner,.wg-day-header,.wg-meal-label,.wg-cell,.wg-sum-label,.wg-sum-cell{background:var(--bg-card);overflow:hidden}
.wg-corner{padding:10px 8px;display:grid;place-items:center;font-size:.78rem;font-weight:800;color:var(--text-light);text-transform:uppercase;letter-spacing:.06em;background:var(--bg-input)}
.wg-day-header{padding:10px 6px;text-align:center;background:var(--bg-card)}
.wg-day-header .wdh-name{font-weight:800;font-size:.95rem;text-transform:uppercase;letter-spacing:.04em;display:block}
.wg-day-header .wdh-date{font-size:.78rem;color:var(--text-sec);display:block;margin-top:2px}
.wg-day-header .wdh-kcal{font-family:var(--f-mono);font-size:.78rem;font-weight:700;color:var(--accent);margin-top:5px;background:var(--accent-light);padding:3px 10px;border-radius:5px;display:inline-block}
.wg-day-header[data-di="0"]{box-shadow:inset 0 -3px 0 var(--day-lun)}.wg-day-header[data-di="1"]{box-shadow:inset 0 -3px 0 var(--day-mar)}
.wg-day-header[data-di="2"]{box-shadow:inset 0 -3px 0 var(--day-mer)}.wg-day-header[data-di="3"]{box-shadow:inset 0 -3px 0 var(--day-jeu)}
.wg-day-header[data-di="4"]{box-shadow:inset 0 -3px 0 var(--day-ven)}.wg-day-header[data-di="5"]{box-shadow:inset 0 -3px 0 var(--day-sam)}
.wg-day-header[data-di="6"]{box-shadow:inset 0 -3px 0 var(--day-dim)}
.wg-meal-label{padding:10px 12px;display:flex;align-items:center;gap:7px;font-size:.85rem;font-weight:700;color:var(--text-sec);background:var(--bg-input);line-height:1.2}
.wg-meal-label svg{width:16px;height:16px;flex-shrink:0}
.wg-cell{padding:6px 8px;overflow-y:auto;transition:background .12s}
.wg-cell:hover{background:#fafaf7}.wg-cell.drop-active{background:rgba(79,70,229,.08)!important;outline:2px dashed var(--accent);outline-offset:-2px}
.wg-cell-food{display:flex;align-items:center;gap:4px;font-size:.82rem;padding:3px 6px;margin-bottom:3px;border-radius:4px;background:rgba(79,70,229,.03);border:1px solid rgba(79,70,229,.06);cursor:grab;transition:.1s}
.wg-cell-food:hover{background:rgba(79,70,229,.07)}.wg-cell-food.dragging{opacity:.3}
.wg-cell-food .wcf-emoji{font-size:.95rem;flex-shrink:0;width:18px;text-align:center}
.wg-cell-food .wcf-name{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0;color:var(--text)}
.wg-cell-food .wcf-qty{font-family:var(--f-mono);font-size:.72rem;color:var(--text-light);flex-shrink:0;background:var(--bg-input);padding:1px 5px;border-radius:3px}
.wg-cell-total{font-family:var(--f-mono);font-size:.72rem;margin-top:4px;padding-top:4px;border-top:1px dashed var(--border);display:flex;gap:8px}
.wg-cell-total .wct-p{color:var(--prot);font-weight:700}.wg-cell-total .wct-g{color:var(--gluc);font-weight:700}.wg-cell-total .wct-l{color:var(--lip);font-weight:700}
.wg-cell-empty{color:var(--text-light);font-size:.78rem;font-style:italic;padding:8px 2px;text-align:center}
.wg-sum-label{background:var(--accent-light);padding:10px 12px;font-size:.9rem;font-weight:800;color:var(--accent);display:flex;align-items:center}
.wg-sum-cell{background:var(--accent-light);padding:8px 6px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}
.wg-sum-cell .wsc-kcal{font-family:var(--f-mono);font-size:1.05rem;font-weight:700;color:var(--accent);line-height:1}
.wg-sum-cell .wsc-macros{font-family:var(--f-mono);font-size:.72rem;display:flex;justify-content:center;gap:6px;margin-top:4px;font-weight:700}
.wg-sum-cell .wsc-macros .wsc-p{color:var(--prot)}.wg-sum-cell .wsc-macros .wsc-g{color:var(--gluc)}.wg-sum-cell .wsc-macros .wsc-l{color:var(--lip)}

/* ================================================
   DRAWER
   ================================================ */
.drawer-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);backdrop-filter:blur(4px);z-index:150}.drawer-overlay.open{display:block}
.drawer{position:fixed;top:0;right:-460px;width:420px;height:100vh;background:var(--bg-card);box-shadow:-4px 0 40px rgba(0,0,0,.12);z-index:160;display:flex;flex-direction:column;transition:right .3s cubic-bezier(.4,0,.2,1)}.drawer.open{right:0}
.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border);flex-shrink:0}.drawer-header h3{font-size:1.15rem;font-weight:700}
.drawer-close{width:36px;height:36px;border:1px solid var(--border);background:var(--bg-card);border-radius:var(--rad-sm);cursor:pointer;display:grid;place-items:center;color:var(--text-sec);transition:.15s}.drawer-close:hover{border-color:var(--danger);color:var(--danger);background:var(--danger-bg)}
.drawer-body{padding:22px 24px;display:flex;flex-direction:column;gap:16px;flex-shrink:0}
.drawer-search-wrap,.drawer-qty-wrap{display:flex;flex-direction:column;gap:7px;position:relative}
.drawer-search-wrap label,.drawer-qty-wrap label{font-size:.78rem;font-weight:700;color:var(--text-sec);text-transform:uppercase;letter-spacing:.04em}
.drawer-search-input,.drawer-qty-input{width:100%;padding:13px 16px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:var(--bg-input);font-family:var(--f-body);font-size:1rem;color:var(--text);transition:.2s}
.drawer-search-input:focus,.drawer-qty-input:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
.drawer-qty-input{font-family:var(--f-mono);font-size:1.05rem}
.drawer-add-btn{width:100%;justify-content:center;padding:14px 20px;font-size:.95rem}
.drawer-foods-list{flex:1;overflow-y:auto;padding:18px 24px;border-top:1px solid var(--border);min-height:0}
.drawer-foods-list h4{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text-light);margin-bottom:14px}
.drawer-food-row{display:flex;align-items:center;padding:12px 14px;background:var(--bg-input);border-radius:var(--rad-sm);margin-bottom:7px;font-size:.9rem}
.dfr-name{font-weight:700;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dfr-qty{font-family:var(--f-mono);font-size:.82rem;color:var(--text-sec);margin:0 12px}
.dfr-kcal{font-family:var(--f-mono);font-size:.82rem;font-weight:700;color:var(--accent);margin-right:10px}
.dfr-remove{width:28px;height:28px;border:0;background:0 0;color:var(--text-light);cursor:pointer;border-radius:6px;display:grid;place-items:center;transition:.12s}.dfr-remove:hover{background:var(--danger-bg);color:var(--danger)}

/* Food dropdown */
.food-dropdown{display:none;position:absolute;top:100%;left:0;right:0;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rad-sm);box-shadow:var(--shadow-lg);max-height:220px;overflow-y:auto;z-index:999;margin-top:5px}
.food-dropdown.open{display:block}
.food-dropdown-item{padding:12px 16px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;font-size:.92rem;transition:background .1s;border-bottom:1px solid var(--bg-input)}.food-dropdown-item:last-child{border-bottom:0}
.food-dropdown-item:hover{background:var(--accent-light)}
.food-dropdown-item .fd-name{font-weight:700;display:flex;align-items:center;gap:8px}
.food-dropdown-item .fd-macros{font-size:.78rem;font-family:var(--f-mono);color:var(--text-sec)}
.food-per-gram-info{margin-top:8px;font-size:.82rem;color:var(--text-sec);font-family:var(--f-mono);padding:10px 14px;background:var(--accent-light);border-radius:var(--rad-sm);display:none}.food-per-gram-info.visible{display:block}

/* Recipe Modal */
/* recipe modal styles moved to RTE section below */

/* ================================================
   DATABASE VIEW — Redesigned
   ================================================ */
#view-database,#view-objectives,#view-shopping{overflow-y:auto;padding:32px 40px 60px}
.view-header{margin-bottom:28px}.view-header h2{font-family:var(--f-display);font-size:2.6rem;font-weight:700;margin-bottom:6px}.view-subtitle{color:var(--text-sec);font-size:1rem}
.db-view-header{display:flex;justify-content:space-between;align-items:flex-start}
.db-stats{display:flex;gap:14px}
.db-stat-item{display:flex;flex-direction:column;align-items:center;background:var(--accent-light);padding:12px 24px;border-radius:var(--rad);border:1.5px solid rgba(79,70,229,.15)}
.db-stat-val{font-family:var(--f-mono);font-size:1.8rem;font-weight:700;color:var(--accent);line-height:1}.db-stat-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--accent);margin-top:3px}
.btn-reset-db{display:flex;align-items:center;gap:6px;padding:10px 16px;border:1.5px solid var(--danger);border-radius:var(--rad-sm);background:var(--danger-bg);color:var(--danger);font-family:var(--f-body);font-size:.78rem;font-weight:700;cursor:pointer;transition:.15s;white-space:nowrap}
.btn-reset-db:hover{background:var(--danger);color:#fff;box-shadow:0 2px 10px rgba(220,38,38,.3)}
.db-form-card{background:var(--bg-card);border:2px solid var(--border);border-radius:var(--rad);padding:0;box-shadow:var(--shadow);margin-bottom:22px;overflow:hidden}
.db-form-header-bar{background:linear-gradient(135deg,var(--accent),#6366f1);padding:18px 30px;color:#fff}
.db-form-header-bar h3{font-size:1.2rem;font-weight:800;display:flex;align-items:center;gap:10px;color:#fff;margin:0}
.db-form-header-bar h3 svg{stroke:#fff}
.db-form{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:26px 30px}
.db-form .form-group.span2{grid-column:span 2}.db-form .form-group.span4{grid-column:span 4}
.form-group label{display:block;font-size:.85rem;font-weight:700;color:var(--text-sec);margin-bottom:7px;text-transform:uppercase;letter-spacing:.03em}
.form-group input,.form-group select{width:100%;padding:12px 16px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:var(--bg-input);font-family:var(--f-body);font-size:1rem;color:var(--text);transition:.2s}
.form-group select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%236e6e6e' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.form-group input:focus,.form-group select:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
.macro-input{border-radius:var(--rad-sm);padding:6px;background:var(--bg-input)}
.prot-input{background:var(--prot-light)}.prot-input label{color:var(--prot)}
.gluc-input{background:var(--gluc-light)}.gluc-input label{color:var(--gluc)}
.lip-input{background:var(--lip-light)}.lip-input label{color:var(--lip)}
.kcal-input{background:var(--accent-light)}.kcal-input label{color:var(--accent)}
.macro-input input{background:#fff}
.auto-calc-hint{font-size:.75rem;color:var(--text-light);margin-top:5px;display:block}
.form-actions{grid-column:1/-1;display:flex;gap:12px;margin-top:6px}
.btn-save-food{padding:14px 30px;font-size:1rem;border-radius:var(--rad);background:linear-gradient(135deg,var(--accent),#6366f1);box-shadow:0 4px 16px rgba(79,70,229,.3);transition:all .2s}
.btn-save-food:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(79,70,229,.4)}

/* Emoji Picker */
.emoji-picker-trigger{display:flex;align-items:center;gap:12px;padding:12px 16px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:var(--bg-input);cursor:pointer;transition:.15s}
.emoji-picker-trigger:hover{border-color:var(--accent);background:var(--accent-light)}
.emoji-preview{font-size:1.8rem;line-height:1}.emoji-label{font-size:.88rem;color:var(--text-sec);flex:1}
.emoji-picker-dropdown{display:none;position:absolute;top:100%;left:0;right:0;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--rad-sm);box-shadow:var(--shadow-lg);z-index:50;padding:14px;max-height:220px;overflow-y:auto;margin-top:5px}
.emoji-picker-dropdown.open{display:block}
.emoji-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:5px}
.emoji-option{font-size:1.4rem;padding:7px;border-radius:var(--rad-sm);cursor:pointer;text-align:center;transition:.1s;border:0;background:0 0}
.emoji-option:hover{background:var(--accent-light);transform:scale(1.15)}

/* ─── Filter bar ─── */
.db-filter-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:20px;flex-wrap:wrap}
.db-category-filters{display:flex;gap:8px;flex-wrap:wrap;flex:1}
.cat-filter-btn{
    display:flex;align-items:center;gap:6px;
    padding:8px 14px;border:1.5px solid var(--border);border-radius:20px;
    background:var(--bg-card);color:var(--text-sec);
    font-family:var(--f-body);font-size:.82rem;font-weight:600;
    cursor:pointer;transition:all .18s;white-space:nowrap;
}
.cat-filter-btn:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-light);transform:translateY(-1px)}
.cat-filter-btn.active{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 3px 12px rgba(79,70,229,.3);transform:translateY(-1px)}
.cfb-emoji{font-size:1rem}
.cfb-label{font-weight:700}
.cfb-count{font-size:.72rem;font-weight:800;background:rgba(255,255,255,.25);padding:1px 7px;border-radius:10px;min-width:22px;text-align:center}
.cat-filter-btn:not(.active) .cfb-count{background:var(--bg-input);color:var(--text-sec)}
.db-search-wrap{display:flex;align-items:center;gap:10px;padding:10px 18px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:var(--bg-input);width:300px;flex-shrink:0}
.db-search-wrap:focus-within{border-color:var(--accent)}
.db-search-wrap svg{color:var(--text-light)}.db-search-wrap input{border:0;background:0 0;font-family:var(--f-body);font-size:.95rem;color:var(--text);width:100%;outline:0}

/* ─── Food Cards Grid — new design ─── */
.db-cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px}

.food-card{
    border-radius:16px;border:2px solid transparent;
    box-shadow:0 2px 8px rgba(0,0,0,.05);
    transition:transform .22s cubic-bezier(.34,1.4,.64,1),box-shadow .2s ease;
    position:relative;overflow:hidden;
    cursor:default;
}
.food-card:hover{transform:translateY(-4px);box-shadow:0 10px 28px rgba(0,0,0,.12)}

/* Colored left strip */
.fc-cat-strip{position:absolute;top:0;left:0;width:6px;height:100%;border-radius:16px 0 0 16px}

.fc-body{padding:16px 18px 16px 24px}

.fc-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:14px}
.fc-identity{display:flex;align-items:center;gap:12px;flex:1;min-width:0}
.fc-emoji-big{font-size:2.2rem;flex-shrink:0;line-height:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.12))}
.fc-name-wrap{display:flex;flex-direction:column;gap:5px;min-width:0}
.fc-name{font-size:1.1rem;font-weight:800;color:var(--text);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:-.01em}
.fc-cat-chip{
    display:inline-flex;align-items:center;gap:4px;
    font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
    padding:3px 10px;border-radius:12px;border:1px solid;
    white-space:nowrap;width:fit-content;
}

.fc-actions{display:flex;gap:6px;flex-shrink:0}
.fc-btn-edit,.fc-btn-del{
    width:36px;height:36px;border-radius:10px;border:1.5px solid;
    display:grid;place-items:center;cursor:pointer;transition:all .15s;background:rgba(255,255,255,.7);
}
.fc-btn-edit{border-color:rgba(79,70,229,.2);color:var(--accent)}.fc-btn-edit:hover{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 3px 10px rgba(79,70,229,.3);transform:scale(1.1)}
.fc-btn-del{border-color:rgba(220,38,38,.2);color:var(--danger)}.fc-btn-del:hover{background:var(--danger);color:#fff;border-color:var(--danger);box-shadow:0 3px 10px rgba(220,38,38,.25);transform:scale(1.1)}

/* ─── Macro blocks inside card ─── */
.fc-macros-grid{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:8px;align-items:end}

.fc-macro-block{display:flex;flex-direction:column;gap:4px;padding:10px 10px 8px;border-radius:10px}
.fc-prot{background:var(--prot-light)}.fc-gluc{background:var(--gluc-light)}.fc-lip{background:var(--lip-light)}

.fc-macro-bar-wrap{height:4px;border-radius:2px;background:rgba(0,0,0,.08);overflow:hidden;margin-bottom:4px}
.fc-macro-bar{height:100%;border-radius:2px;transition:width .4s ease}

.fc-macro-val{font-family:var(--f-mono);font-size:1.3rem;font-weight:800;line-height:1;display:flex;align-items:baseline;gap:1px}
.fc-macro-val small{font-size:.72rem;font-weight:600;opacity:.7}
.fc-prot .fc-macro-val{color:var(--prot)}
.fc-gluc .fc-macro-val{color:var(--gluc)}
.fc-lip .fc-macro-val{color:var(--lip)}
.fc-macro-lbl{font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;opacity:.65}

.fc-kcal-blk{display:flex;align-items:center;justify-content:center;padding:0 6px}
.fc-kcal-ring{
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    width:74px;height:74px;border-radius:50%;
    background:linear-gradient(135deg,var(--accent-light),#e0e7ff);
    border:2px solid rgba(79,70,229,.2);
    box-shadow:0 2px 8px rgba(79,70,229,.1);
}
.fc-kcal-val{font-family:var(--f-mono);font-size:1.25rem;font-weight:800;color:var(--accent);line-height:1}
.fc-kcal-unit{font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--accent);opacity:.65}

.empty-state{text-align:center;padding:60px 20px;color:var(--text-light)}.empty-state svg{margin-bottom:14px}
.empty-state p{font-weight:600;font-size:1.05rem;color:var(--text-sec);margin-bottom:6px}.empty-state span{font-size:.9rem}

/* ================================================
   MACRO TOPS BAR — Airy colorful animated cards
   ================================================ */
.macro-tops-bar{
    display:flex;gap:12px;padding:12px 24px 14px;
    background:linear-gradient(135deg,#f8f7ff 0%,#f0f4ff 40%,#f8f7f3 100%);
    border-bottom:1px solid var(--border);
    flex-shrink:0;position:relative;z-index:40;overflow:visible;
}
.mt-group{
    flex:1;position:relative;
    border-radius:16px;
    box-shadow:0 2px 10px rgba(0,0,0,.06),0 1px 3px rgba(0,0,0,.04);
    transition:transform .22s cubic-bezier(.34,1.56,.64,1),box-shadow .22s ease;
    overflow:visible;
}
.mt-group:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.1)}
.mt-prot{background:linear-gradient(145deg,#fff5f7 0%,#fce8ee 100%);border:1.5px solid rgba(220,38,81,.18)}
.mt-gluc{background:linear-gradient(145deg,#fffcf0 0%,#fef3c7 100%);border:1.5px solid rgba(217,119,6,.18)}
.mt-lip{background:linear-gradient(145deg,#f0fdfb 0%,#d1fae5 100%);border:1.5px solid rgba(13,148,136,.18)}
.mt-kcal{background:linear-gradient(145deg,#f5f3ff 0%,#ede9fe 100%);border:1.5px solid rgba(79,70,229,.18)}
.mt-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 16px;border:0;background:transparent;cursor:pointer;transition:background .15s;text-align:left;font-family:var(--f-body);border-radius:16px}
.mt-trigger:hover{background:rgba(255,255,255,.55)}
.mt-group.open .mt-trigger{background:rgba(255,255,255,.7);border-radius:16px 16px 0 0}
.mt-trigger-info{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.mt-label{font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.12em;display:block}
.mt-prot .mt-label{color:var(--prot)}.mt-gluc .mt-label{color:var(--gluc)}.mt-lip .mt-label{color:var(--lip)}.mt-kcal .mt-label{color:var(--accent)}
.mt-trigger-name{font-size:.8rem;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mt-trigger-right{display:flex;align-items:center;gap:8px;flex-shrink:0}
.mt-top-badge{font-family:var(--f-mono);font-size:.75rem;font-weight:800;padding:4px 10px;border-radius:20px;white-space:nowrap}
.mt-prot .mt-top-badge{background:rgba(220,38,81,.12);color:var(--prot)}
.mt-gluc .mt-top-badge{background:rgba(217,119,6,.12);color:var(--gluc)}
.mt-lip .mt-top-badge{background:rgba(13,148,136,.12);color:var(--lip)}
.mt-kcal .mt-top-badge{background:rgba(79,70,229,.12);color:var(--accent)}
.mt-chevron{color:var(--text-light);transition:transform .2s;flex-shrink:0}
.mt-group.open .mt-chevron{transform:rotate(180deg)}
.mt-dropdown{display:none;position:absolute;top:calc(100% - 2px);left:0;right:0;background:#fff;border:1.5px solid rgba(0,0,0,.1);border-radius:0 0 14px 14px;box-shadow:0 10px 30px rgba(0,0,0,.12);z-index:50;overflow:hidden}
.mt-group.open .mt-dropdown{display:block;animation:mtDropIn .18s cubic-bezier(.34,1.3,.64,1)}
@keyframes mtDropIn{from{opacity:0;transform:translateY(-6px) scaleY(.97)}to{opacity:1;transform:translateY(0) scaleY(1)}}
.mt-dropdown-inner{max-height:260px;overflow-y:auto}
.mt-dropdown-inner::-webkit-scrollbar{width:4px}
.mt-dropdown-inner::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.mt-item{display:flex;align-items:center;gap:8px;padding:9px 14px;font-size:.82rem;cursor:grab;transition:background .1s;border-bottom:1px solid #f5f5f5;user-select:none}
.mt-item:last-child{border-bottom:none}
.mt-item:hover{background:#f9f8ff}
.mt-item:active{cursor:grabbing}
.mt-drag-icon{color:var(--text-light);flex-shrink:0;opacity:.35;transition:opacity .15s}
.mt-item:hover .mt-drag-icon{opacity:.9}
.mt-prot .mt-item:hover{background:#fff5f7}.mt-prot .mt-item:hover .mt-drag-icon{color:var(--prot)}
.mt-gluc .mt-item:hover{background:#fffcf0}.mt-gluc .mt-item:hover .mt-drag-icon{color:var(--gluc)}
.mt-lip .mt-item:hover{background:#f0fdfb}.mt-lip .mt-item:hover .mt-drag-icon{color:var(--lip)}
.mt-kcal .mt-item:hover{background:#f5f3ff}.mt-kcal .mt-item:hover .mt-drag-icon{color:var(--accent)}
.mt-item-emoji{font-size:1rem;flex-shrink:0;width:20px;text-align:center}
.mt-item-name{flex:1;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.mt-item-val{font-family:var(--f-mono);font-size:.75rem;font-weight:700;flex-shrink:0;padding:2px 9px;border-radius:12px}
.mt-prot .mt-item-val{background:rgba(220,38,81,.1);color:var(--prot)}
.mt-gluc .mt-item-val{background:rgba(217,119,6,.1);color:var(--gluc)}
.mt-lip .mt-item-val{background:rgba(13,148,136,.1);color:var(--lip)}
.mt-kcal .mt-item-val{background:rgba(79,70,229,.1);color:var(--accent)}
.mt-item-dragging{opacity:.3;cursor:grabbing}
.mt-empty{font-size:.8rem;color:var(--text-light);font-style:italic;padding:12px 16px;display:block}

/* ================================================
   BTN RECETTES + RECIPES PANEL
   ================================================ */
.btn-recipes-toggle{padding:10px 16px;border:1.5px solid #a78bfa;border-radius:var(--rad-sm);background:linear-gradient(135deg,#f5f3ff,#ede9fe);color:#7c3aed;font-family:var(--f-body);font-size:.82rem;font-weight:700;cursor:pointer;transition:all .18s;display:flex;align-items:center;gap:7px}
.btn-recipes-toggle:hover,.btn-recipes-toggle.active{background:linear-gradient(135deg,#7c3aed,#6d28d9);color:#fff;border-color:#6d28d9;box-shadow:0 3px 14px rgba(124,58,237,.35)}
.recipes-panel{background:linear-gradient(135deg,#faf9ff,#f3f0ff);border-bottom:2px solid #e0d9ff;padding:12px 24px 14px;flex-shrink:0;animation:rpSlideDown .22s ease}
@keyframes rpSlideDown{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.rp-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.rp-header-left{display:flex;align-items:center;gap:8px;font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#6d28d9}
.rp-header-left svg{stroke:#6d28d9}
.btn-new-recipe{display:flex;align-items:center;gap:6px;padding:7px 16px;border:1.5px solid #7c3aed;border-radius:20px;background:#fff;color:#7c3aed;font-family:var(--f-body);font-size:.8rem;font-weight:700;cursor:pointer;transition:.15s}
.btn-new-recipe:hover{background:#7c3aed;color:#fff}
.rp-cards{display:flex;gap:12px;overflow-x:auto;padding-bottom:4px}
.rp-cards::-webkit-scrollbar{height:4px}
.rp-cards::-webkit-scrollbar-thumb{background:#c4b5fd;border-radius:2px}
.rp-card{flex-shrink:0;min-width:200px;max-width:240px;background:#fff;border:1.5px solid #c4b5fd;border-radius:14px;padding:12px 14px;cursor:grab;transition:transform .2s cubic-bezier(.34,1.4,.64,1),box-shadow .2s;user-select:none}
.rp-card:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(124,58,237,.2);border-color:#7c3aed}
.rp-card:active{cursor:grabbing}
.rp-card-top{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.rp-card-emoji{font-size:1.4rem;flex-shrink:0}
.rp-card-name{font-weight:700;font-size:.88rem;color:var(--text);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rp-card-actions{display:flex;gap:4px;flex-shrink:0;opacity:0;transition:.15s}
.rp-card:hover .rp-card-actions{opacity:1}
.rp-edit,.rp-del{width:24px;height:24px;border:0;border-radius:6px;background:transparent;cursor:pointer;display:grid;place-items:center;transition:.12s}
.rp-edit{color:var(--text-sec)}.rp-edit:hover{background:var(--accent-light);color:var(--accent)}
.rp-del{color:var(--text-sec)}.rp-del:hover{background:var(--danger-bg);color:var(--danger)}
.rp-card-macros{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:6px}
.rp-m-p{font-size:.72rem;font-weight:700;padding:2px 7px;border-radius:10px;background:var(--prot-light);color:var(--prot)}
.rp-m-g{font-size:.72rem;font-weight:700;padding:2px 7px;border-radius:10px;background:var(--gluc-light);color:var(--gluc)}
.rp-m-l{font-size:.72rem;font-weight:700;padding:2px 7px;border-radius:10px;background:var(--lip-light);color:var(--lip)}
.rp-m-k{font-size:.72rem;font-weight:700;padding:2px 7px;border-radius:10px;background:var(--accent-light);color:var(--accent)}
.rp-drag-hint{font-size:.68rem;color:#a78bfa;font-weight:600;letter-spacing:.02em}
.rp-dragging{opacity:.35}
.rp-empty{display:flex;align-items:center;gap:10px;color:var(--text-light);font-size:.88rem;font-style:italic;padding:8px 0}

/* ================================================
   MEAL RECIPE CARD
   ================================================ */
.meal-recipe-card{background:linear-gradient(135deg,#f5f3ff,#ede9fe);border:1.5px solid #c4b5fd;border-radius:10px;padding:7px 10px;margin:3px 0;cursor:grab;transition:.15s;user-select:none}
.meal-recipe-card:hover{background:linear-gradient(135deg,#ede9fe,#ddd6fe);box-shadow:0 2px 8px rgba(124,58,237,.2)}
.meal-recipe-card.dragging{opacity:.3}
.mrc-top{display:flex;align-items:center;gap:6px;margin-bottom:5px}
.mrc-emoji{font-size:1rem;flex-shrink:0}
.mrc-name{font-weight:700;font-size:.82rem;color:#5b21b6;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mrc-actions{display:flex;gap:3px;flex-shrink:0;opacity:0;transition:.12s}
.meal-recipe-card:hover .mrc-actions{opacity:1}
.mrc-view,.mrc-remove{width:20px;height:20px;border:0;background:transparent;cursor:pointer;border-radius:5px;display:grid;place-items:center;transition:.12s}
.mrc-view{color:#7c3aed}.mrc-view:hover{background:#ede9fe}
.mrc-remove{color:var(--text-light)}.mrc-remove:hover{background:var(--danger-bg);color:var(--danger)}
.mrc-macros{display:flex;gap:4px;flex-wrap:wrap}
.mrc-macros .mp{font-size:.68rem;font-weight:700;padding:1px 6px;border-radius:8px;background:rgba(220,38,81,.12);color:var(--prot)}
.mrc-macros .mg{font-size:.68rem;font-weight:700;padding:1px 6px;border-radius:8px;background:rgba(217,119,6,.12);color:var(--gluc)}
.mrc-macros .ml{font-size:.68rem;font-weight:700;padding:1px 6px;border-radius:8px;background:rgba(13,148,136,.12);color:var(--lip)}
.mrc-kcal{font-size:.68rem;font-weight:700;padding:1px 6px;border-radius:8px;background:rgba(79,70,229,.1);color:var(--accent);font-family:var(--f-mono)}

/* ================================================
   RECIPE BUILDER MODAL
   ================================================ */
.rb-overlay{display:none;position:fixed;inset:0;background:rgba(10,5,30,.55);backdrop-filter:blur(6px);z-index:300;place-items:center}
.rb-overlay.open{display:grid;animation:fadeIn .2s ease}
.rb-modal{background:var(--bg-card);border-radius:20px;width:min(950px,96vw);max-height:92vh;display:flex;flex-direction:column;box-shadow:0 24px 60px rgba(0,0,0,.22);overflow:hidden;animation:modalIn .25s cubic-bezier(.34,1.2,.64,1)}
.rb-header{display:flex;align-items:center;gap:14px;padding:16px 24px;background:linear-gradient(135deg,#4f46e5,#7c3aed);flex-shrink:0}
.rb-emoji-display{font-size:2rem;width:50px;height:50px;border-radius:12px;background:rgba(255,255,255,.2);border:2px solid rgba(255,255,255,.3);cursor:pointer;transition:.2s;display:grid;place-items:center;flex-shrink:0}
.rb-emoji-display:hover{background:rgba(255,255,255,.35);transform:scale(1.08)}
.rb-name-input{flex:1;padding:12px 18px;border:2px solid rgba(255,255,255,.3);border-radius:12px;background:rgba(255,255,255,.15);color:#fff;font-family:var(--f-display);font-size:1.4rem;font-weight:700;outline:none;transition:.2s}
.rb-name-input::placeholder{color:rgba(255,255,255,.5)}
.rb-name-input:focus{border-color:rgba(255,255,255,.7);background:rgba(255,255,255,.22)}
.rb-close{width:40px;height:40px;border:2px solid rgba(255,255,255,.3);border-radius:10px;background:rgba(255,255,255,.1);color:#fff;cursor:pointer;display:grid;place-items:center;flex-shrink:0;transition:.15s}
.rb-close:hover{background:rgba(255,255,255,.25)}
.rb-body{display:grid;grid-template-columns:1fr 280px;flex:1;overflow:hidden}
.rb-left{display:flex;flex-direction:column;padding:20px 22px;overflow-y:auto;border-right:1px solid var(--border);gap:0}
.rb-left::-webkit-scrollbar{width:4px}
.rb-left::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.rb-right{padding:20px 22px;background:var(--bg-input);display:flex;flex-direction:column;gap:14px;overflow-y:auto}
.rb-section-title{display:flex;align-items:center;gap:8px;font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--text-sec);margin-bottom:12px}
.rb-steps-title{margin-top:16px;padding-top:16px;border-top:1px solid var(--border)}
.rb-search-row{display:flex;gap:8px;align-items:center;margin-bottom:8px}
.rb-search-wrap{flex:1;position:relative;display:flex;align-items:center;gap:8px;padding:10px 14px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:#fff;transition:.15s}
.rb-search-wrap:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
.rb-search-wrap svg{color:var(--text-light);flex-shrink:0}
.rb-search-wrap input{border:0;background:0 0;font-family:var(--f-body);font-size:.92rem;color:var(--text);width:100%;outline:0}
.rb-search-wrap .food-dropdown{top:calc(100% + 4px);left:0;right:0}
.rb-qty-input{width:85px;padding:10px 12px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:#fff;font-family:var(--f-mono);font-size:.95rem;outline:0;transition:.15s;flex-shrink:0}
.rb-qty-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
.rb-add-btn{display:flex;align-items:center;gap:6px;padding:10px 16px;border:0;background:var(--accent);color:#fff;border-radius:var(--rad-sm);font-family:var(--f-body);font-size:.85rem;font-weight:700;cursor:pointer;transition:.15s;flex-shrink:0}
.rb-add-btn:hover{background:var(--accent-dark)}
.rb-ing-list{flex:0 0 auto;max-height:220px;overflow-y:auto;margin-top:8px}
.rb-ing-list::-webkit-scrollbar{width:4px}
.rb-ing-list::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.rb-ing-empty{color:var(--text-light);font-size:.85rem;font-style:italic;text-align:center;padding:14px}
.rb-ing-row{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:var(--rad-sm);margin-bottom:4px;background:var(--bg-card);border:1px solid var(--border);transition:.12s}
.rb-ing-row:hover{border-color:var(--accent-light)}
.rb-ing-emoji{font-size:1rem;flex-shrink:0;width:22px;text-align:center}
.rb-ing-name{font-weight:600;font-size:.85rem;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rb-ing-qty{font-family:var(--f-mono);font-size:.78rem;font-weight:700;color:var(--text-sec);flex-shrink:0;background:var(--bg-input);padding:2px 7px;border-radius:6px}
.rb-ing-macros{display:flex;gap:4px;flex-shrink:0}
.rb-m-p{font-size:.66rem;font-weight:700;padding:1px 5px;border-radius:6px;background:var(--prot-light);color:var(--prot)}
.rb-m-g{font-size:.66rem;font-weight:700;padding:1px 5px;border-radius:6px;background:var(--gluc-light);color:var(--gluc)}
.rb-m-l{font-size:.66rem;font-weight:700;padding:1px 5px;border-radius:6px;background:var(--lip-light);color:var(--lip)}
.rb-m-k{font-size:.66rem;font-weight:700;padding:1px 5px;border-radius:6px;background:var(--accent-light);color:var(--accent);font-family:var(--f-mono)}
.rb-ing-del{width:26px;height:26px;border:0;background:0 0;color:var(--text-light);cursor:pointer;border-radius:6px;display:grid;place-items:center;flex-shrink:0;transition:.12s}
.rb-ing-del:hover{background:var(--danger-bg);color:var(--danger)}

/* Steps toolbar */
.rb-steps-toolbar{display:flex;align-items:center;gap:3px;flex-wrap:wrap;padding:8px 10px;background:var(--bg-input);border:1.5px solid var(--border);border-radius:var(--rad-sm) var(--rad-sm) 0 0;border-bottom:0;margin-top:12px}
.rte-rb-btn{width:32px;height:32px;border:1.5px solid transparent;border-radius:6px;background:transparent;cursor:pointer;display:grid;place-items:center;color:var(--text);transition:.12s;flex-shrink:0}
.rte-rb-btn:hover{background:var(--bg-card);border-color:var(--border);color:var(--accent)}
.rte-rb-btn.active{background:var(--accent-light);border-color:var(--accent);color:var(--accent)}
.rte-rb-btn svg{pointer-events:none}
.rb-steps-editor{
    min-height:120px;max-height:200px;
    padding:12px 14px;border:1.5px solid var(--border);border-radius:0 0 var(--rad-sm) var(--rad-sm);
    background:#fff;font-family:var(--f-body);font-size:.92rem;line-height:1.7;
    color:var(--text);outline:none;overflow-y:auto;
}
.rb-steps-editor:empty::before{content:attr(data-placeholder);color:var(--text-light);font-style:italic;pointer-events:none}
.rb-steps-editor:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
.rb-steps-editor ol,.rb-steps-editor ul{padding-left:1.5em}
.rb-steps-editor li{margin-bottom:.3em}

/* Totals right panel */
.rb-totals-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rb-total{border-radius:14px;padding:14px 10px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:5px;transition:transform .2s}
.rb-total:hover{transform:scale(1.04)}
.rb-t-prot{background:var(--prot-light);border:1.5px solid rgba(220,38,81,.15)}
.rb-t-gluc{background:var(--gluc-light);border:1.5px solid rgba(217,119,6,.15)}
.rb-t-lip{background:var(--lip-light);border:1.5px solid rgba(13,148,136,.15)}
.rb-t-kcal{background:var(--accent-light);border:1.5px solid rgba(79,70,229,.15)}
.rb-tot-val{font-family:var(--f-mono);font-size:1.3rem;font-weight:800;line-height:1}
.rb-t-prot .rb-tot-val{color:var(--prot)}.rb-t-gluc .rb-tot-val{color:var(--gluc)}
.rb-t-lip .rb-tot-val{color:var(--lip)}.rb-t-kcal .rb-tot-val{color:var(--accent)}
.rb-total label{font-size:.63rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;opacity:.6}
.rb-hint{font-size:.78rem;color:var(--text-sec);line-height:1.5;padding:12px;background:var(--bg-card);border-radius:var(--rad-sm);border:1px solid var(--border)}
.rb-hint strong{color:var(--accent)}
.rb-footer{display:flex;justify-content:flex-end;gap:10px;padding:14px 24px;border-top:1px solid var(--border);flex-shrink:0;background:var(--bg-input)}
.rb-save-btn{background:linear-gradient(135deg,#4f46e5,#7c3aed);box-shadow:0 4px 14px rgba(79,70,229,.35)}
.rb-save-btn:hover{box-shadow:0 6px 20px rgba(79,70,229,.45);transform:translateY(-1px)}



/* ================================================
   OBJECTIVES
   ================================================ */
.obj-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.obj-card{background:var(--bg-card);border:2px solid var(--border);border-radius:var(--rad);padding:26px;box-shadow:var(--shadow);overflow:hidden}
.obj-card-header{display:flex;align-items:center;gap:12px;margin-bottom:22px;padding-bottom:16px;border-bottom:2px solid var(--bg-input)}
.obj-card-header svg{color:var(--accent)}.obj-card-header h3{font-size:1.15rem;font-weight:800}
.obj-form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.obj-group{display:flex;flex-direction:column;gap:6px;padding:12px;border-radius:var(--rad-sm)}
.kcal-obj{background:var(--accent-light)}.prot-obj{background:var(--prot-light)}.gluc-obj{background:var(--gluc-light)}.lip-obj{background:var(--lip-light)}
.obj-group label{font-size:.85rem;font-weight:700;color:var(--text-sec)}
.obj-group input{padding:12px 14px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:#fff;font-family:var(--f-mono);font-size:1.05rem;color:var(--text)}
.obj-group input:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
.btn-save-obj{width:100%;justify-content:center;margin-top:16px;padding:14px;font-size:1rem;border-radius:var(--rad);background:linear-gradient(135deg,var(--accent),#6366f1);box-shadow:0 4px 16px rgba(79,70,229,.3);transition:all .2s}
.btn-save-obj:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(79,70,229,.4)}
.obj-gauges-card{grid-column:2;grid-row:1/3}
.gauges-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.gauge-item{position:relative;display:flex;align-items:center;justify-content:center}
.gauge-item canvas{display:block}
.gauge-label{position:absolute;text-align:center;display:flex;flex-direction:column;align-items:center}
.gauge-val{font-family:var(--f-mono);font-size:1.3rem;font-weight:700;line-height:1}.gauge-unit{font-size:.75rem;font-weight:700;text-transform:uppercase;color:var(--text-sec);margin-top:3px}
.obj-bmi-card{grid-column:1}
.bmi-form{display:flex;gap:14px;align-items:flex-end;margin-bottom:18px}
.bmi-field{display:flex;flex-direction:column;gap:5px;flex:1}
.bmi-field label{font-size:.82rem;font-weight:700;color:var(--text-sec)}
.bmi-field input{padding:12px 14px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:var(--bg-input);font-family:var(--f-mono);font-size:1rem}
.bmi-field input:focus{outline:0;border-color:var(--accent)}
.bmi-result{text-align:center;padding:18px;border-radius:var(--rad);background:var(--bg-input)}
.bmi-score{font-family:var(--f-mono);font-size:2.8rem;font-weight:700;line-height:1;margin-bottom:6px}
.bmi-category{font-size:.95rem;font-weight:700;margin-bottom:16px}
.bmi-bar-wrap{width:100%}.bmi-bar{height:14px;border-radius:7px;background:linear-gradient(90deg,#3b82f6 0%,#22c55e 25%,#eab308 55%,#f97316 75%,#ef4444 100%);position:relative}
.bmi-marker{width:4px;height:22px;background:var(--text);border-radius:2px;position:absolute;top:-4px;transition:left .4s}
.bmi-bar-labels{display:flex;justify-content:space-between;font-size:.7rem;color:var(--text-light);margin-top:5px;font-family:var(--f-mono)}
.weight-input-row{display:flex;gap:10px;margin-bottom:16px}
.weight-input-row input{flex:1;padding:12px 14px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:var(--bg-input);font-family:var(--f-mono);font-size:.95rem}
.weight-input-row input:focus{outline:0;border-color:var(--accent)}
.weight-history{max-height:200px;overflow-y:auto}
.weight-entry{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-radius:var(--rad-sm);margin-bottom:5px;font-size:.88rem;background:var(--bg-input)}
.weight-entry .we-date{color:var(--text-sec);font-size:.82rem}.weight-entry .we-val{font-family:var(--f-mono);font-weight:700;color:var(--accent)}
.weight-entry .we-diff{font-family:var(--f-mono);font-size:.78rem;font-weight:600}
.we-diff.positive{color:var(--danger)}.we-diff.negative{color:var(--success)}
.weight-entry .we-del{width:24px;height:24px;border:0;background:0 0;color:var(--text-light);cursor:pointer;border-radius:5px;display:grid;place-items:center}.weight-entry .we-del:hover{color:var(--danger);background:var(--danger-bg)}

/* Converter */
.obj-converter-card{grid-column:1/-1;background:linear-gradient(135deg,#f8f7ff 0%,#eef5fd 50%,#edf7ee 100%);border:2px solid #c7d2fe}
.converter-header svg{color:var(--accent)}
.conv-ingredient-row{margin-bottom:18px}
.conv-ingredient-row label{display:block;font-size:.82rem;font-weight:700;color:var(--text-sec);text-transform:uppercase;letter-spacing:.04em;margin-bottom:7px}
.conv-ingredient-row select{width:100%;padding:12px 16px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:#fff;font-family:var(--f-body);font-size:.95rem;color:var(--text);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%236e6e6e' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.conv-ingredient-row select:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
.conv-row{display:flex;align-items:flex-end;gap:12px;margin-bottom:18px}
.conv-field{flex:1}.conv-field label{display:block;font-size:.78rem;font-weight:700;color:var(--text-sec);text-transform:uppercase;letter-spacing:.04em;margin-bottom:7px}
.conv-input-group{display:flex;gap:7px}
.conv-input-group input{flex:1;padding:12px 14px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:#fff;font-family:var(--f-mono);font-size:1.05rem;color:var(--text);transition:.2s}
.conv-input-group input:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}
.conv-input-group input[readonly]{background:var(--accent-light);color:var(--accent);font-weight:700;border-color:rgba(79,70,229,.2)}
.conv-input-group select{width:140px;padding:12px 10px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:#fff;font-family:var(--f-body);font-size:.85rem;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%236e6e6e' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.conv-swap-btn{width:44px;height:44px;border:2px solid var(--accent);border-radius:50%;background:var(--bg-card);color:var(--accent);cursor:pointer;display:grid;place-items:center;flex-shrink:0;transition:.2s}
.conv-swap-btn:hover{background:var(--accent);color:#fff;transform:rotate(180deg);box-shadow:0 2px 12px rgba(79,70,229,.3)}
.conv-btn{width:100%;justify-content:center;padding:14px;font-size:1rem;border-radius:var(--rad);background:linear-gradient(135deg,#0ea5e9,#6366f1);box-shadow:0 4px 16px rgba(99,102,241,.3);transition:all .2s;border:0;color:#fff;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:10px;font-family:var(--f-body)}
.conv-btn:hover{transform:translateY(-1px);box-shadow:0 6px 22px rgba(99,102,241,.4)}
.conv-ref{margin-top:16px;padding:14px 18px;background:rgba(255,255,255,.7);border-radius:var(--rad-sm);border:1px solid var(--border);font-size:.88rem;color:var(--text-sec);line-height:1.6;display:none}
.conv-ref.visible{display:block}.conv-ref strong{color:var(--text);font-weight:700}

/* ================================================
   SHOPPING LIST
   ================================================ */
.shop-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;flex-wrap:wrap;gap:14px}
.shop-week-selector{display:flex;align-items:center;gap:12px}
.shop-arrow{width:40px;height:40px;border:1.5px solid var(--border);border-radius:var(--rad-sm);background:var(--bg-card);cursor:pointer;display:grid;place-items:center;color:var(--text);transition:.15s}
.shop-arrow:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-light)}
.shop-week-label{font-family:var(--f-display);font-size:1.4rem;font-weight:700;min-width:300px;text-align:center}
.shop-actions{display:flex;gap:10px}
.shop-archive-tabs{display:flex;gap:6px;margin-bottom:18px;overflow-x:auto;padding-bottom:5px;flex-wrap:wrap}
.shop-archive-tab{padding:8px 18px;border:1.5px solid var(--border);border-radius:20px;background:var(--bg-card);color:var(--text-sec);font-family:var(--f-body);font-size:.82rem;font-weight:600;cursor:pointer;transition:.15s;white-space:nowrap;display:flex;align-items:center;gap:8px}
.shop-archive-tab:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-light)}
.shop-archive-tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.shop-archive-tab .sat-count{background:rgba(255,255,255,.25);padding:2px 8px;border-radius:10px;font-size:.72rem}
.shop-archive-tab .sat-del{width:20px;height:20px;border:0;background:0 0;color:inherit;cursor:pointer;border-radius:50%;display:grid;place-items:center;opacity:.5;font-size:1rem;line-height:1}.shop-archive-tab .sat-del:hover{opacity:1}
.shop-empty{text-align:center;padding:70px 20px;color:var(--text-light)}.shop-empty svg{margin-bottom:16px}.shop-empty p{font-weight:600;font-size:1.1rem;color:var(--text-sec);margin-bottom:6px}.shop-empty span{font-size:.92rem}
.shop-category{margin-bottom:18px}
.shop-cat-header{display:flex;align-items:center;gap:10px;padding:12px 18px;background:var(--bg-input);border-radius:var(--rad-sm);margin-bottom:8px;cursor:pointer;transition:.15s}
.shop-cat-header:hover{background:var(--accent-light)}.shop-cat-emoji{font-size:1.3rem}.shop-cat-name{font-size:1rem;font-weight:700;flex:1}
.shop-cat-count{font-size:.78rem;font-weight:700;color:var(--text-light);background:var(--bg-card);padding:3px 12px;border-radius:10px}
.shop-items{display:flex;flex-direction:column;gap:5px;padding-left:10px}
.shop-item{display:flex;align-items:center;gap:12px;padding:12px 18px;background:var(--bg-card);border:1.5px solid var(--border);border-radius:var(--rad-sm);transition:all .15s}
.shop-item:hover{border-color:var(--accent-light);box-shadow:var(--shadow)}.shop-item.checked{opacity:.4;text-decoration:line-through}
.shop-item.checked .si-check{background:var(--success);border-color:var(--success);color:#fff}
.si-check{width:26px;height:26px;border:2px solid var(--border);border-radius:7px;background:var(--bg-card);cursor:pointer;display:grid;place-items:center;flex-shrink:0;transition:.15s;color:transparent;font-size:.85rem}
.si-check:hover{border-color:var(--accent);background:var(--accent-light)}
.si-emoji{font-size:1.2rem;flex-shrink:0}.si-name{font-size:1rem;font-weight:600;flex:1}
.si-qty{font-family:var(--f-mono);font-size:1rem;font-weight:700;color:var(--accent);background:var(--accent-light);padding:5px 14px;border-radius:var(--rad-sm);flex-shrink:0}
.si-details{font-size:.78rem;color:var(--text-sec);flex-shrink:0;margin-left:6px}
.shop-summary{display:flex;gap:18px;padding:16px 22px;background:linear-gradient(135deg,var(--accent-light),#eef5fd);border:1.5px solid rgba(79,70,229,.15);border-radius:var(--rad);margin-bottom:22px}
.shop-sum-item{display:flex;flex-direction:column;align-items:center;flex:1}
.shop-sum-val{font-family:var(--f-mono);font-size:1.4rem;font-weight:700;line-height:1}
.shop-sum-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-sec);margin-top:4px}
.ssi-total .shop-sum-val{color:var(--accent)}.ssi-checked .shop-sum-val{color:var(--success)}.ssi-remaining .shop-sum-val{color:var(--warn)}

/* ================================================
   SHARED UI
   ================================================ */
.btn-primary{padding:12px 22px;border:0;background:var(--accent);color:#fff;border-radius:var(--rad-sm);cursor:pointer;font-family:var(--f-body);font-size:.92rem;font-weight:600;display:flex;align-items:center;gap:8px;transition:.2s}.btn-primary:hover{background:var(--accent-dark)}
.btn-secondary{padding:12px 22px;border:1.5px solid var(--border);background:var(--bg-card);color:var(--text);border-radius:var(--rad-sm);cursor:pointer;font-family:var(--f-body);font-size:.92rem;font-weight:600;transition:.2s}.btn-secondary:hover{border-color:var(--text-light)}
.btn-danger{padding:12px 22px;border:0;background:var(--danger);color:#fff;border-radius:var(--rad-sm);cursor:pointer;font-family:var(--f-body);font-size:.92rem;font-weight:600}.btn-danger:hover{background:#b91c1c}
.obj-info-card{background:var(--accent-light);border-color:transparent}.obj-info-card h3{color:var(--accent-dark);font-size:1rem;font-weight:700;margin-bottom:14px}
.obj-info-card p{color:var(--text-sec);font-size:.9rem;margin-bottom:14px;line-height:1.5}
.obj-info-card ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.obj-info-card li{display:flex;align-items:center;gap:10px;font-size:.9rem}
.status-tag{display:inline-flex;padding:4px 12px;border-radius:20px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.status-tag.under{background:var(--warn-bg);color:var(--warn)}.status-tag.ok{background:var(--success-bg);color:var(--success)}.status-tag.over{background:var(--danger-bg);color:var(--danger)}
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);backdrop-filter:blur(4px);z-index:200;place-items:center}.modal-overlay.open{display:grid}
.modal{background:var(--bg-card);border-radius:var(--rad);padding:28px;max-width:400px;width:90%;box-shadow:var(--shadow-lg);animation:modalIn .2s ease}
@keyframes modalIn{from{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}
.modal h3{font-size:1.1rem;font-weight:700;margin-bottom:10px}.modal p{color:var(--text-sec);font-size:.92rem;margin-bottom:20px;line-height:1.5}.modal-actions{display:flex;justify-content:flex-end;gap:10px}
.toast-container{position:fixed;bottom:24px;right:24px;z-index:300;display:flex;flex-direction:column;gap:7px}
.toast{padding:12px 20px;border-radius:var(--rad-sm);font-size:.85rem;font-weight:600;color:#fff;background:var(--text);box-shadow:var(--shadow-lg);animation:toastIn .3s ease,toastOut .3s ease 2.7s forwards;max-width:360px}
.toast.success{background:var(--success)}.toast.error{background:var(--danger)}
@keyframes toastIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@keyframes toastOut{from{opacity:1}to{opacity:0;transform:translateY(-6px)}}

/* ================================================
   RICH TEXT EDITOR — Recipe / Notes Modal
   ================================================ */
.recipe-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);backdrop-filter:blur(5px);z-index:200;place-items:center}
.recipe-overlay.open{display:grid}

.recipe-modal{
    background:var(--bg-card);border-radius:var(--rad);
    width:min(700px,95vw);max-height:90vh;
    display:flex;flex-direction:column;
    box-shadow:var(--shadow-lg);animation:modalIn .2s ease;overflow:hidden
}
.recipe-modal-header{
    display:flex;align-items:center;justify-content:space-between;
    padding:18px 22px;border-bottom:1px solid var(--border);flex-shrink:0
}
.recipe-modal-header h3{font-size:1.05rem;font-weight:700;font-family:var(--f-display);font-size:1.35rem}

/* Toolbar */
.rte-toolbar{
    display:flex;align-items:center;gap:4px;flex-wrap:wrap;
    padding:10px 16px;background:var(--bg-input);
    border-bottom:1px solid var(--border);flex-shrink:0;
}
.rte-btn{
    width:34px;height:34px;border:1.5px solid transparent;border-radius:7px;
    background:transparent;cursor:pointer;display:grid;place-items:center;
    color:var(--text);transition:.15s;flex-shrink:0;
}
.rte-btn svg{pointer-events:none}
.rte-btn:hover{background:var(--bg-card);border-color:var(--border);color:var(--accent)}
.rte-btn.active{background:var(--accent-light);border-color:var(--accent);color:var(--accent)}

.rte-sep{width:1px;height:24px;background:var(--border);margin:0 4px;flex-shrink:0}

.rte-hilite-group{display:flex;align-items:center;gap:5px}
.rte-hilite-label{font-size:.7rem;font-weight:700;color:var(--text-sec);text-transform:uppercase;letter-spacing:.05em;margin-right:2px}
.rte-hilite-btn{
    width:22px;height:22px;border-radius:5px;border:2px solid rgba(0,0,0,.12);
    cursor:pointer;transition:.15s;flex-shrink:0;
}
.rte-hilite-btn:hover{transform:scale(1.2);border-color:var(--text)}
.rte-hilite-clear{
    background:#fff!important;border:1.5px solid var(--border)!important;
    font-size:.75rem;color:var(--text-sec);display:grid;place-items:center;
}
.rte-hilite-clear:hover{background:var(--danger-bg)!important;color:var(--danger);border-color:var(--danger)!important}

.rte-select{
    padding:6px 10px;border:1.5px solid var(--border);border-radius:7px;
    background:var(--bg-card);font-family:var(--f-body);font-size:.78rem;
    color:var(--text);cursor:pointer;transition:.15s;
    appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%236e6e6e' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");
    background-repeat:no-repeat;background-position:right 8px center;padding-right:26px;
    max-width:130px;
}
.rte-select:hover,.rte-select:focus{border-color:var(--accent);outline:none}

/* Editor area */
.rte-editor{
    flex:1;min-height:220px;max-height:420px;
    padding:18px 22px;overflow-y:auto;
    font-family:var(--f-body);font-size:.95rem;line-height:1.7;
    color:var(--text);outline:none;
    background:#fff;
}
.rte-editor:empty::before{
    content:attr(data-placeholder);
    color:var(--text-light);font-style:italic;pointer-events:none;
}
.rte-editor:focus{background:var(--bg-card)}
.rte-editor b,.rte-editor strong{font-weight:700}
.rte-editor i,.rte-editor em{font-style:italic}
.rte-editor u{text-decoration:underline}
.rte-editor s{text-decoration:line-through}
.rte-editor p{margin:0 0 .4em}

.recipe-modal-footer{
    display:flex;justify-content:flex-end;gap:10px;
    padding:14px 22px;border-top:1px solid var(--border);flex-shrink:0;background:var(--bg-input)
}
/* ================================================
   MACRO TOPS BAR — Custom draggable dropdowns
   ================================================ */
.macro-tops-bar{
    display:grid;grid-template-columns:repeat(4,1fr);
    background:var(--bg-card);border-bottom:2px solid var(--border);
    flex-shrink:0;position:relative;z-index:40;
}
.mt-group{position:relative;border-right:1px solid var(--border)}
.mt-group:last-child{border-right:none}
.mt-trigger{
    width:100%;display:flex;align-items:center;justify-content:space-between;
    gap:10px;padding:9px 16px;border:0;background:transparent;
    cursor:pointer;transition:background .15s;text-align:left;font-family:var(--f-body);
}
.mt-trigger:hover,.mt-group.open .mt-trigger{background:var(--bg-input)}
.mt-trigger-info{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.mt-label{font-size:.62rem;font-weight:800;text-transform:uppercase;letter-spacing:.1em;display:block}
.mt-prot .mt-label{color:var(--prot)}
.mt-gluc .mt-label{color:var(--gluc)}
.mt-lip .mt-label{color:var(--lip)}
.mt-kcal .mt-label{color:var(--accent)}
.mt-trigger-name{font-size:.78rem;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mt-trigger-right{display:flex;align-items:center;gap:7px;flex-shrink:0}
.mt-top-badge{font-family:var(--f-mono);font-size:.72rem;font-weight:700;padding:3px 9px;border-radius:20px;white-space:nowrap}
.mt-prot .mt-top-badge{background:var(--prot-light);color:var(--prot)}
.mt-gluc .mt-top-badge{background:var(--gluc-light);color:var(--gluc)}
.mt-lip .mt-top-badge{background:var(--lip-light);color:var(--lip)}
.mt-kcal .mt-top-badge{background:var(--accent-light);color:var(--accent)}
.mt-chevron{color:var(--text-light);transition:transform .2s;flex-shrink:0}
.mt-group.open .mt-chevron{transform:rotate(180deg)}
.mt-dropdown{
    display:none;position:absolute;top:100%;left:0;right:0;
    background:var(--bg-card);border:1.5px solid var(--border);border-top:none;
    border-radius:0 0 var(--rad-sm) var(--rad-sm);
    box-shadow:0 8px 28px rgba(0,0,0,.12);z-index:50;
}
.mt-group.open .mt-dropdown{display:block;animation:mtDropIn .15s ease}
@keyframes mtDropIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.mt-dropdown-inner{max-height:280px;overflow-y:auto}
.mt-dropdown-inner::-webkit-scrollbar{width:4px}
.mt-dropdown-inner::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.mt-item{
    display:flex;align-items:center;gap:8px;padding:8px 14px;
    font-size:.82rem;cursor:grab;transition:background .1s;
    border-bottom:1px solid var(--bg-input);user-select:none;
}
.mt-item:last-child{border-bottom:none}
.mt-item:hover{background:var(--bg-input)}
.mt-item:active{cursor:grabbing}
.mt-drag-icon{color:var(--text-light);flex-shrink:0;opacity:.4;transition:opacity .15s}
.mt-item:hover .mt-drag-icon{opacity:1}
.mt-prot .mt-item:hover .mt-drag-icon{color:var(--prot)}
.mt-gluc .mt-item:hover .mt-drag-icon{color:var(--gluc)}
.mt-lip .mt-item:hover .mt-drag-icon{color:var(--lip)}
.mt-kcal .mt-item:hover .mt-drag-icon{color:var(--accent)}
.mt-item-emoji{font-size:1rem;flex-shrink:0;width:20px;text-align:center}
.mt-item-name{flex:1;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.mt-item-val{font-family:var(--f-mono);font-size:.75rem;font-weight:700;flex-shrink:0;padding:2px 8px;border-radius:12px}
.mt-prot .mt-item-val{background:var(--prot-light);color:var(--prot)}
.mt-gluc .mt-item-val{background:var(--gluc-light);color:var(--gluc)}
.mt-lip .mt-item-val{background:var(--lip-light);color:var(--lip)}
.mt-kcal .mt-item-val{background:var(--accent-light);color:var(--accent)}
.mt-item-dragging{opacity:.35;cursor:grabbing}
.mt-empty{font-size:.8rem;color:var(--text-light);font-style:italic;padding:10px 16px;display:block}


/* ================================================
   PENCIL / NOTE SAVE GLOW ANIMATION
   ================================================ */
@keyframes pencilPulse{
    0%  {box-shadow:0 0 0 0 rgba(22,163,74,.6);border-color:var(--success);color:var(--success);background:var(--success-bg);transform:scale(1)}
    15% {box-shadow:0 0 0 6px rgba(22,163,74,.3),0 0 18px rgba(22,163,74,.4);border-color:var(--success);background:var(--success-bg);transform:scale(1.12)}
    30% {box-shadow:0 0 0 2px rgba(22,163,74,.15),0 0 8px rgba(22,163,74,.2);transform:scale(1)}
    50% {box-shadow:0 0 0 8px rgba(22,163,74,.25),0 0 24px rgba(22,163,74,.35);background:var(--success-bg);transform:scale(1.08)}
    70% {box-shadow:0 0 0 3px rgba(22,163,74,.12),0 0 10px rgba(22,163,74,.18);transform:scale(1)}
    85% {box-shadow:0 0 0 5px rgba(22,163,74,.18),0 0 16px rgba(22,163,74,.25);transform:scale(1.05)}
    100%{box-shadow:0 0 0 0 rgba(22,163,74,0);border-color:var(--success);color:var(--success);background:var(--success-bg);transform:scale(1)}
}
.btn-tile-action.pencil-saved{
    animation:pencilPulse 3s ease-in-out forwards;
    border-color:var(--success)!important;
    color:var(--success)!important;
    background:var(--success-bg)!important;
}
#printContainer{display:none}
@media print{body *{visibility:hidden}#printContainer,#printContainer *{visibility:visible}
#printContainer{display:block!important;position:fixed;top:0;left:0;width:297mm;height:210mm;padding:8mm;font-family:'DM Sans',sans-serif;font-size:10pt;color:#1a1a1a;background:#fff}
@page{size:A4 landscape;margin:0}
.print-header{display:flex;justify-content:space-between;align-items:center;border-bottom:2.5pt solid #1a1a1a;padding-bottom:6px;margin-bottom:10px}
.print-header h1{font-family:'Cormorant Garamond',serif;font-size:18pt;font-weight:700}.print-header .print-date{font-size:12pt;font-weight:600}
.print-meals{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.print-meal{border:1.5pt solid #ccc;border-radius:6px;padding:8px}.print-meal h3{font-size:10pt;font-weight:700;border-bottom:1pt solid #ddd;padding-bottom:4px;margin-bottom:6px}
.print-food{display:flex;justify-content:space-between;font-size:8pt;padding:2px 0;border-bottom:1pt solid #f0f0f0}.print-food:last-child{border-bottom:0}
.print-food .pf-name{font-weight:600}.print-food .pf-macros{font-family:'JetBrains Mono',monospace;font-size:7.5pt;color:#555}
.print-recipe{font-size:7.5pt;color:#555;font-style:italic;margin-top:4px;padding-top:4px;border-top:1pt dashed #ddd}
.print-bilan{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;border-top:2.5pt solid #1a1a1a;padding-top:8px}
.print-bilan-item{text-align:center}.print-bilan-item .pbi-val{font-family:'JetBrains Mono',monospace;font-size:14pt;font-weight:700}
.print-bilan-item .pbi-label{font-size:8pt;text-transform:uppercase;letter-spacing:.05em;color:#777}.print-bilan-item .pbi-obj{font-size:7pt;color:#999}
.pw-table{width:100%;border-collapse:collapse;table-layout:fixed}
.pw-table th,.pw-table td{border:1pt solid #ccc;padding:4px 5px;vertical-align:top}
.pw-table thead th{background:#f0f0f0;font-size:8pt;font-weight:700;text-align:center;padding:6px 4px}
.pw-table thead th small{font-weight:400;color:#777}.pw-th-meal{width:80px;text-align:left}
.pw-meal-name{font-size:7.5pt;font-weight:700;background:#f8f8f5;width:80px;white-space:nowrap}
.pw-cell{font-size:7pt;line-height:1.3}.pw-cell em{color:#bbb}
.pw-food{margin-bottom:2px;padding-bottom:2px;border-bottom:.5pt solid #eee}.pw-food:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.pw-food small{color:#777;font-family:'JetBrains Mono',monospace;font-size:6pt}
.pw-total-row td{background:#eceafd;font-size:7.5pt}
.pw-total-cell{text-align:center}.pw-total-cell strong{font-family:'JetBrains Mono',monospace;font-size:8pt;color:#4f46e5}.pw-total-cell small{font-size:6pt}
}

/* ================================================
   SORTABLEJS
   ================================================ */
.sortable-ghost{opacity:.25;background:var(--accent-light)!important;border:2px dashed var(--accent)!important;border-radius:8px}
.sortable-chosen{box-shadow:0 4px 20px rgba(79,70,229,.35)!important;z-index:99}

/* ================================================
   MOBILE ELEMENTS — hidden on desktop
   ================================================ */
.mobile-header{display:none}
.mobile-bottom-nav{display:none}
.mobile-bilan{display:none}

/* ================================================
   RESPONSIVE TABLETTE (≤ 1024px)
   ================================================ */
@media(max-width:1024px){
    :root{--sidebar-w:210px}
    .meals-grid{grid-template-columns:repeat(2,1fr)}
    .planner-dashboard{grid-template-columns:1fr 260px}
    .obj-grid{grid-template-columns:1fr}
    .obj-gauges-card{grid-column:1;grid-row:auto}
    .gauges-grid{grid-template-columns:repeat(4,1fr)}
    .rb-body{grid-template-columns:1fr 240px}
    .db-cards-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
}

/* ================================================
   RESPONSIVE MOBILE (≤ 768px) — Motorola 390px
   ================================================ */
@media(max-width:768px){

/* ── Base ── */
html{font-size:15px}
body{
    display:flex;flex-direction:column;
    height:100%;min-height:100vh;
    overflow:hidden;
}

/* ── Cacher la sidebar desktop ── */
.sidebar{display:none !important}

/* ── Main content full width ── */
.main-content{
    margin-left:0 !important;
    width:100%;
    height:100%;
    display:flex;flex-direction:column;
    overflow:hidden;
    /* Espace pour header mobile + bilan + bottom nav */
    padding-top:56px;
    padding-bottom:116px;
}

/* ── Mobile Header (topbar) ── */
.mobile-header{
    display:flex !important;
    position:fixed;top:0;left:0;right:0;z-index:150;
    height:56px;
    background:var(--bg-card);
    border-bottom:1px solid var(--border);
    align-items:center;justify-content:space-between;
    padding:0 12px;
    box-shadow:0 2px 8px rgba(0,0,0,.06);
}
.mh-left{display:flex;align-items:center;gap:8px;flex:1}
.mh-right{display:flex;align-items:center;gap:6px}
.mh-arrow{
    width:40px;height:40px;border:1.5px solid var(--border);
    border-radius:10px;background:var(--bg-card);
    display:grid;place-items:center;cursor:pointer;
    color:var(--text);transition:.15s;flex-shrink:0;
}
.mh-arrow:active{background:var(--accent-light);border-color:var(--accent)}
.mh-week{display:flex;flex-direction:column;align-items:center;gap:1px;flex:1;text-align:center}
.mh-day{font-size:1rem;font-weight:800;color:var(--text);line-height:1}
.mh-date{font-size:.75rem;color:var(--text-sec);font-weight:500}
.mh-btn{
    height:36px;padding:0 12px;
    border:1.5px solid var(--border);border-radius:20px;
    background:var(--bg-input);color:var(--text);
    font-family:var(--f-body);font-size:.8rem;font-weight:700;
    cursor:pointer;transition:.15s;white-space:nowrap;
}
.mh-btn:active{background:var(--accent-light);border-color:var(--accent);color:var(--accent)}
.mh-cal,.mh-rec{
    width:40px;height:40px;padding:0;
    display:grid;place-items:center;border-radius:10px;
}
.mh-rec.active{background:linear-gradient(135deg,#7c3aed,#6d28d9);border-color:#6d28d9;color:#fff}
.mh-rec.active svg{stroke:#fff}

/* ── Cacher la topbar desktop sur mobile ── */
.planner-topbar{display:none !important}

/* ── Day tabs ── */
.day-tabs{
    display:flex !important;
    gap:6px;
    padding:8px 12px 6px;
    overflow-x:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;flex-shrink:0;
    background:var(--bg-card);
    border-bottom:1px solid var(--border);
}
.day-tabs::-webkit-scrollbar{display:none}
.day-tab{
    flex:0 0 auto;
    padding:8px 10px;min-width:54px;
    border-radius:10px;
}
.day-tab .day-name{font-size:.72rem;font-weight:800}
.day-tab .day-date{font-size:.65rem}

/* ── Macro tops bar ── */
.macro-tops-bar{
    display:flex !important;
    flex-wrap:nowrap;
    overflow-x:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    gap:8px;padding:8px 12px 10px;
    flex-shrink:0;
    background:linear-gradient(135deg,#f8f7ff,#f0f4ff);
    border-bottom:1px solid var(--border);
}
.macro-tops-bar::-webkit-scrollbar{display:none}
.mt-group{flex:0 0 148px}
.mt-trigger{padding:8px 12px}
.mt-trigger-name{font-size:.72rem}
.mt-top-badge{font-size:.68rem;padding:2px 7px}

/* ── Recipes panel ── */
.recipes-panel{padding:8px 12px 10px;flex-shrink:0}
.rp-cards{gap:8px}
.rp-card{min-width:160px;max-width:185px;padding:10px 12px}
.rp-card-name{font-size:.82rem}

/* ── Planner dashboard ── */
.planner-dashboard{
    display:flex !important;flex-direction:column !important;
    flex:1;overflow:hidden;min-height:0;
}

/* ── Meals grid — colonne unique scrollable ── */
.meals-grid{
    display:flex !important;flex-direction:column !important;
    gap:10px;padding:10px 12px 8px;
    overflow-y:auto;-webkit-overflow-scrolling:touch;
    flex:1;min-height:0;
}

/* ── Meal tiles compactes ── */
.meal-tile{border-radius:14px}
.meal-tile-header{padding:12px 14px}
.meal-tile-header h4{font-size:1rem;font-weight:800}
.meal-tile-kcal{font-size:.9rem;padding:4px 10px}
.meal-tile-body{padding:6px 12px;max-height:none}
.meal-tile-footer{padding:8px 14px}
.meal-tile-macros-bar{font-size:.8rem;gap:8px}
.meal-tile.is-collation .meal-tile-header{padding:10px 14px}

/* ── Aliments dans les repas ── */
.meal-tile-food{
    padding:8px 10px;margin:3px 0;
    font-size:.88rem;border-radius:8px;
}
.mtf-emoji{width:24px;font-size:1.1rem}
.mtf-name{font-size:.88rem}
.mtf-qty{font-size:.8rem;padding:3px 8px}
.mtf-macros{display:none} /* masqué sur mobile — trop serré */
.mtf-remove{width:28px;height:28px}
.btn-open-drawer{
    padding:8px 14px;font-size:.82rem;
    min-height:36px;
}
.btn-tile-action{width:36px;height:36px;padding:0;display:grid;place-items:center}

/* ── Cacher le bilan journalier desktop ── */
.daily-sidebar{display:none !important}

/* ── Mobile Bilan strip — barre en bas ── */
.mobile-bilan{
    display:flex !important;
    position:fixed;
    bottom:64px;left:0;right:0;z-index:140;
    height:52px;
    background:var(--bg-sidebar);
    align-items:center;justify-content:center;gap:0;
    border-top:1px solid rgba(255,255,255,.08);
    padding:0 16px;
}
.mb-item{
    display:flex;flex-direction:column;align-items:center;
    gap:1px;flex:1;
}
.mb-val{
    font-family:var(--f-mono);font-size:.92rem;font-weight:800;
    color:#fff;line-height:1;
}
.mb-lbl{font-size:.58rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;opacity:.45;color:#fff}
.mb-sep{width:1px;height:28px;background:rgba(255,255,255,.1);flex-shrink:0;margin:0 8px}
.mb-prot .mb-val{color:#f87171}
.mb-gluc .mb-val{color:#fbbf24}
.mb-lip .mb-val{color:#34d399}

/* ── Bottom nav ── */
.mobile-bottom-nav{
    display:flex !important;
    position:fixed;bottom:0;left:0;right:0;z-index:150;
    height:64px;
    background:var(--bg-sidebar);
    border-top:1px solid rgba(255,255,255,.06);
    padding-bottom:env(safe-area-inset-bottom,0px);
}
.mbn-btn{
    flex:1;display:flex;flex-direction:column;
    align-items:center;justify-content:center;
    gap:4px;border:0;background:transparent;
    color:rgba(200,200,230,.4);
    font-family:var(--f-body);font-size:.6rem;font-weight:700;
    text-transform:uppercase;letter-spacing:.04em;
    cursor:pointer;transition:all .15s;
    min-height:44px;
}
.mbn-btn svg{width:22px;height:22px}
.mbn-btn.active{color:#818cf8}
.mbn-btn.active svg{filter:drop-shadow(0 0 6px rgba(129,140,248,.7))}
.mbn-btn:active{transform:scale(.9)}

/* ── Vue hebdomadaire ── */
.weekly-view{
    flex:1;overflow:auto;
    -webkit-overflow-scrolling:touch;
}
.weekly-grid{min-width:680px}

/* ── Drawer ── */
.food-drawer,.drawer{
    top:auto !important;bottom:0 !important;
    right:0 !important;
    width:100% !important;
    height:88vh !important;
    border-radius:20px 20px 0 0 !important;
    transform:none !important;
}
.drawer-overlay.open~.food-drawer,
.drawer.open{bottom:0 !important}

/* ── Modals ── */
.modal{width:92vw;padding:22px 18px;border-radius:16px}
.modal h3{font-size:1.1rem}
.modal p{font-size:.95rem}
.modal-actions{gap:8px}
.btn-secondary,.btn-danger,.btn-primary{
    padding:12px 18px;font-size:.9rem;min-height:44px;
}

/* ── Recipe notes modal ── */
.recipe-overlay{align-items:flex-end}
.recipe-modal{
    width:100% !important;max-width:100% !important;
    max-height:94vh;
    border-radius:20px 20px 0 0 !important;
}
.rte-toolbar{gap:3px;padding:8px 10px}
.rte-btn{width:36px;height:36px}

/* ── Recipe builder modal ── */
.rb-overlay{align-items:flex-end}
.rb-modal{
    width:100% !important;max-width:100% !important;
    max-height:96vh;
    border-radius:20px 20px 0 0 !important;
}
.rb-body{
    grid-template-columns:1fr !important;
    overflow-y:auto;
}
.rb-left{border-right:none;border-bottom:1px solid var(--border);max-height:none}
.rb-right{background:transparent;padding-top:14px}
.rb-totals-grid{grid-template-columns:repeat(4,1fr);gap:8px}
.rb-total{padding:10px 8px}
.rb-tot-val{font-size:1.1rem}
.rb-header{padding:14px 16px}
.rb-name-input{font-size:1.15rem}
.rb-steps-editor{min-height:80px;max-height:140px}
.rb-footer{padding:10px 16px}
.rb-search-row{flex-wrap:wrap;gap:8px}
.rb-search-wrap{width:100%;flex-basis:100%}
.rb-qty-input{width:90px}

/* ── Base de données ── */
#view-database{padding:16px 12px 80px !important}
.view-header{margin-bottom:16px}
.view-header h2{font-size:1.6rem}
.db-view-header{flex-direction:column;gap:12px;align-items:flex-start}
.db-stats{gap:10px;width:100%}
.db-stat-item{flex:1;padding:10px 14px}
.db-stat-val{font-size:1.4rem}
.db-form-card{margin-bottom:14px}
.db-form{grid-template-columns:1fr 1fr;gap:12px;padding:14px}
.db-form .form-group.span2{grid-column:span 1}
.db-form .form-group.span4{grid-column:span 2}
.db-filter-bar{flex-direction:column;gap:10px;margin-bottom:14px}
.db-category-filters{gap:6px;width:100%}
.cat-filter-btn{padding:8px 12px;font-size:.8rem}
.cfb-label{display:none} /* Sur très petit écran, juste emoji + count */
.db-search-wrap{width:100%}
.db-cards-grid{grid-template-columns:1fr;gap:12px}
.fc-macros-grid{grid-template-columns:1fr 1fr 1fr auto}
.fc-emoji-big{font-size:1.8rem}
.fc-name{font-size:1rem}
.fc-btn-edit,.fc-btn-del{width:40px;height:40px}

/* ── Objectifs ── */
#view-objectives{padding:16px 12px 80px !important}
.obj-grid{grid-template-columns:1fr;gap:12px}
.obj-gauges-card{grid-column:1;grid-row:auto}
.gauges-grid{grid-template-columns:repeat(2,1fr);gap:14px}
.obj-form{grid-template-columns:1fr 1fr}

/* ── Liste de courses ── */
#view-shopping{padding:16px 12px 80px !important}
.shop-toolbar{flex-direction:column;gap:10px}
.shop-week-selector{width:100%;justify-content:space-between}
.shop-week-label{font-size:1rem;flex:1;text-align:center;min-width:0}
.shop-actions{width:100%;gap:8px}
.shop-actions .btn-primary,.shop-actions .btn-secondary{flex:1;justify-content:center}

/* ── Mini calendrier ── */
.mini-calendar{
    width:calc(100vw - 24px) !important;
    right:0 !important;left:0 !important;
    margin:0 12px;
    max-width:360px;
}

/* ── Toasts ── */
.toast-container{
    bottom:136px !important;
    right:12px;left:12px;
}
.toast{max-width:100%;text-align:center}

} /* fin @media 768px */

/* ================================================
   TRÈS PETIT (≤ 360px — petits Androids)
   ================================================ */
@media(max-width:360px){
    html{font-size:13px}
    .mt-group{flex:0 0 130px}
    .day-tab{min-width:46px;padding:7px 6px}
    .db-form{grid-template-columns:1fr}
    .db-form .form-group.span2,.db-form .form-group.span4{grid-column:span 1}
    .rb-totals-grid{grid-template-columns:1fr 1fr;gap:6px}
    .fc-macros-grid{grid-template-columns:1fr 1fr}
    .fc-kcal-blk{grid-column:span 2;display:flex;justify-content:center}
}