:root {
    --primary:#1f6b4f;
    --primary-dark:#163f32;
    --primary-soft:#e7f3ed;
    --accent:#cde97b;
    --highlight:#f28b6d;
    --surface:#fff;
    --background:#f8f7f2;
    --text:#19322a;
    --muted:#6b7e77;
    --danger:#a23b3b;
    --success:#216e49;
    --border:#dfe8e3;
    --shadow:0 12px 32px rgba(22,63,50,.09);
    --radius:20px;
}
html[data-theme="turquoise"] {
    --primary:#147d82; --primary-dark:#0d4f55; --primary-soft:#ddf4f1;
    --accent:#a8ede2; --highlight:#f5bc73; --background:#f1f9f8;
    --text:#173638; --muted:#627d7c; --border:#d6e9e7;
}
html[data-theme="rose"] {
    --primary:#a95773; --primary-dark:#67364a; --primary-soft:#fbe8ee;
    --accent:#f6c7d7; --highlight:#e9a37f; --background:#fff7f8;
    --text:#442c35; --muted:#836b74; --border:#eedde3;
}
html[data-theme="latte"] {
    --primary:#7a5843; --primary-dark:#49372c; --primary-soft:#eee1cf;
    --accent:#e8c999; --highlight:#bd7f5d; --background:#f8f2e8;
    --text:#3f3128; --muted:#7f7066; --border:#e5d8c7;
}
html[data-theme="lavender"] {
    --primary:#6f62a5; --primary-dark:#453b72; --primary-soft:#ebe7f7;
    --accent:#d9d0fa; --highlight:#d991a7; --background:#f7f5fc;
    --text:#332f49; --muted:#77718d; --border:#e1ddef;
}
* { box-sizing:border-box; }
html { min-height:100%; background:var(--background); }
body {
    margin:0;
    min-height:100vh;
    color:var(--text);
    background:var(--background);
    font:15px/1.48 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
}
a { color:var(--primary-dark); }
.app-icon {
    width:22px; height:22px; display:block; fill:none; stroke:currentColor;
    stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;
}
.app-header {
    position:sticky; top:0; z-index:40; color:#fff;
    background:linear-gradient(135deg,var(--primary-dark),var(--primary));
    box-shadow:0 6px 24px color-mix(in srgb,var(--primary-dark) 25%,transparent);
}
.app-topbar {
    width:min(100%,1180px); min-height:68px; margin:auto; padding:10px 18px;
    display:flex; align-items:center; gap:14px;
}
.app-brand {
    display:flex; align-items:center; gap:10px; color:#fff; font-size:1.2rem;
    font-weight:850; letter-spacing:-.03em; text-decoration:none;
}
.app-brand-mark {
    width:38px; height:38px; display:grid; place-items:center; color:var(--primary-dark);
    background:var(--accent); border-radius:13px; font-weight:900;
}
.desktop-nav { display:flex; align-items:center; gap:4px; margin-left:22px; }
.desktop-nav a {
    padding:9px 12px; color:rgba(255,255,255,.76); border-radius:11px;
    text-decoration:none; font-weight:700;
}
.desktop-nav a:hover,.desktop-nav a.active { color:#fff; background:rgba(255,255,255,.13); }
.top-actions { margin-left:auto; display:flex; align-items:center; gap:8px; }
.top-icon,.top-avatar {
    width:42px; height:42px; display:grid; place-items:center; padding:0;
    color:#fff; background:rgba(255,255,255,.12); border:0; border-radius:14px;
    cursor:pointer; text-decoration:none;
}
.top-avatar { color:var(--primary-dark); background:var(--accent); font-weight:900; }
.more-menu { position:relative; }
.more-menu summary { list-style:none; }
.more-menu summary::-webkit-details-marker { display:none; }
.more-panel {
    position:absolute; top:50px; right:0; width:min(290px,calc(100vw - 24px)); padding:10px;
    color:var(--text); background:var(--surface); border:1px solid var(--border);
    border-radius:16px; box-shadow:var(--shadow);
}
.more-panel a,.more-panel button {
    width:100%; display:flex; align-items:center; gap:9px; padding:10px;
    color:var(--text); background:transparent; border:0; border-radius:10px;
    text-decoration:none; text-align:left; font-weight:700;
}
.more-panel a:hover,.more-panel button:hover { background:var(--primary-soft); }
.more-panel form { margin:0; }
.more-panel .app-install-actions {
    margin:.35rem 0; padding:.35rem 0;
    border-top:1px solid var(--border); border-bottom:1px solid var(--border);
}
.more-panel .app-install-actions button.is-ready::after {
    content:"Prêt"; margin-left:auto; padding:.15rem .4rem;
    color:var(--success); background:color-mix(in srgb,var(--success) 12%,transparent);
    border-radius:999px; font-size:.72rem;
}
.more-panel .app-install-actions button:disabled { opacity:.65; cursor:default; }
.pwa-install-dialog {
    width:min(92vw,520px); padding:0; color:var(--text); background:var(--surface);
    border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow);
}
.pwa-install-dialog::backdrop { background:rgba(18,35,29,.55); }
.pwa-install-dialog-content { padding:1.25rem; }
.pwa-install-dialog h2 { margin-top:0; }
.pwa-install-dialog button { width:100%; margin-top:.35rem; }
.app-main {
    width:min(100%,1180px); margin:0 auto; padding:24px 18px 112px;
}
h1,h2,h3 { line-height:1.18; letter-spacing:-.025em; }
h1 { font-size:clamp(1.7rem,4vw,2.35rem); margin-top:.15rem; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1rem; }
.card {
    background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
    padding:1.15rem; box-shadow:var(--shadow);
}
.muted { color:var(--muted); }
form { display:grid; gap:.8rem; }
label { display:grid; gap:.35rem; font-weight:680; }
fieldset { border:1px solid var(--border); border-radius:14px; padding:1rem; }
legend { padding:0 .4rem; font-weight:800; }
input,select,textarea,button { font:inherit; }
input,select,textarea {
    width:100%; min-height:44px; padding:.67rem .78rem; color:var(--text);
    background:var(--surface); border:1px solid color-mix(in srgb,var(--muted) 48%,var(--border));
    border-radius:11px;
}
input:focus,select:focus,textarea:focus {
    outline:3px solid color-mix(in srgb,var(--primary) 20%,transparent);
    border-color:var(--primary);
}
textarea { min-height:100px; resize:vertical; }
button,.button {
    display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
    min-height:42px; padding:.7rem 1rem; color:#fff; background:var(--primary);
    border:0; border-radius:11px; font-weight:780; cursor:pointer; text-decoration:none;
    box-shadow:0 7px 16px color-mix(in srgb,var(--primary) 18%,transparent);
}
button:hover,.button:hover { background:var(--primary-dark); }
.secondary { color:var(--primary-dark); background:var(--primary-soft); box-shadow:none; }
.secondary:hover { color:#fff; background:var(--primary); }
.danger { background:var(--danger); }
.danger:hover { background:#7f2929; }
.link-button { min-height:0; padding:0; color:var(--primary-dark); background:none; box-shadow:none; }
.inline { display:flex; gap:.75rem; align-items:center; flex-wrap:wrap; }
.flash {
    margin-bottom:1rem; padding:.85rem 1rem; background:var(--surface);
    border:1px solid var(--border); border-left:5px solid var(--primary); border-radius:11px;
}
.flash-error { border-left-color:var(--danger); }
.flash-success { border-left-color:var(--success); }
details > summary { cursor:pointer; }
table { width:100%; border-collapse:collapse; }
th,td { padding:.7rem; border-bottom:1px solid var(--border); text-align:left; }
th { color:var(--muted); font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; }
.table-wrap { overflow-x:auto; border-radius:14px; }
.metric { margin:.2rem 0; font-size:1.8rem; font-weight:850; letter-spacing:-.04em; }
.app-bottom-nav {
    position:fixed; z-index:45; left:50%; bottom:max(10px,env(safe-area-inset-bottom));
    transform:translateX(-50%); width:min(calc(100% - 20px),620px); min-height:70px;
    padding:7px 8px; display:grid; grid-template-columns:repeat(5,1fr); align-items:center;
    background:color-mix(in srgb,var(--surface) 94%,transparent); border:1px solid var(--border);
    border-radius:23px; box-shadow:0 18px 45px rgba(22,63,50,.2); backdrop-filter:blur(14px);
}
.bottom-nav-item {
    min-height:54px; display:flex; flex-direction:column; align-items:center; justify-content:center;
    gap:3px; color:var(--muted); border-radius:16px; font-size:.66rem; font-weight:760;
    text-decoration:none;
}
.bottom-nav-item.active { color:var(--primary); background:var(--primary-soft); }
.bottom-nav-item.add {
    width:54px; height:54px; min-height:54px; justify-self:center; color:#fff;
    background:var(--primary); border-radius:18px; box-shadow:0 8px 18px color-mix(in srgb,var(--primary) 30%,transparent);
    transform:translateY(-12px);
}
.bottom-nav-item.add span { display:none; }
.theme-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(145px,1fr)); gap:.75rem; }
.theme-choice {
    position:relative; display:flex; align-items:center; gap:.65rem; min-height:62px;
    padding:.7rem; border:2px solid var(--border); border-radius:14px; cursor:pointer;
}
.theme-choice:has(input:checked) { border-color:var(--primary); background:var(--primary-soft); }
.theme-choice input { width:auto; min-height:0; }
.theme-dots { display:flex; gap:3px; }
.theme-dots i { width:15px; height:15px; display:block; border-radius:50%; }
.dashboard-welcome { display:flex; justify-content:space-between; align-items:end; gap:1rem; margin-bottom:1rem; }
.dashboard-welcome h1 { margin-bottom:.25rem; }
.dashboard-welcome p { margin:.1rem 0; }
.calorie-hero {
    color:#fff; background:linear-gradient(145deg,var(--primary-dark),var(--primary)); border:0;
}
.calorie-hero .muted { color:rgba(255,255,255,.74); }
.calorie-hero a { color:var(--accent); }
.calorie-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:.75rem; margin:1rem 0; }
.calorie-stat { padding:.8rem; background:rgba(255,255,255,.1); border-radius:14px; }
.calorie-stat span { display:block; color:rgba(255,255,255,.68); font-size:.75rem; }
.calorie-stat strong { font-size:1.35rem; }
.feature-card { border:2px solid color-mix(in srgb,var(--highlight) 55%,var(--border)); }
.planning-tool-accordion,.planning-day-accordion {
    margin-top:1rem; padding:0; overflow:hidden;
}
.planning-tool-accordion > summary,.planning-day-accordion > summary,.planning-meal-accordion > summary {
    display:flex; align-items:center; justify-content:space-between; gap:.75rem;
    padding:1rem 1.1rem; cursor:pointer; list-style:none;
}
.planning-tool-accordion > summary::-webkit-details-marker,
.planning-day-accordion > summary::-webkit-details-marker,
.planning-meal-accordion > summary::-webkit-details-marker { display:none; }
.planning-tool-accordion > summary::after,.planning-day-accordion > summary::after {
    content:"›"; flex:0 0 auto; color:var(--primary); font-size:1.8rem; line-height:1;
    transform:rotate(90deg); transition:transform .18s ease;
}
.planning-tool-accordion[open] > summary::after,.planning-day-accordion[open] > summary::after {
    transform:rotate(-90deg);
}
.planning-tool-accordion > summary strong,.planning-day-accordion > summary strong {
    display:block; font-size:1.08rem;
}
.planning-tool-accordion > summary small,.planning-day-accordion > summary small,
.planning-meal-summary small {
    display:block; margin-top:.2rem; color:var(--muted); font-size:.78rem; font-weight:600;
}
.planning-day-date { color:var(--muted); font-weight:650; }
.planning-accordion-content { padding:0 1rem 1rem; border-top:1px solid var(--border); }
.planning-day-actions { display:flex; justify-content:flex-end; padding:.75rem 0; }
.planning-day-actions form { margin:0; }
.planning-meal-list { display:grid; gap:.6rem; }
.planning-meal-accordion {
    overflow:hidden; background:color-mix(in srgb,var(--primary-soft) 42%,var(--surface));
    border:1px solid var(--border); border-radius:14px;
}
.planning-meal-accordion > summary { min-height:64px; }
.planning-meal-accordion > summary::after {
    content:"+"; flex:0 0 auto; width:26px; height:26px; display:grid; place-items:center;
    color:var(--primary); background:var(--surface); border-radius:50%; font-weight:900;
}
.planning-meal-accordion[open] > summary::after { content:"−"; }
.planning-meal-summary { min-width:0; flex:1; }
.planning-meal-summary small {
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.planning-kcal {
    flex:0 0 auto; padding:.25rem .48rem; color:var(--primary-dark);
    background:var(--primary-soft); border-radius:999px; font-size:.75rem; font-weight:800;
}
.planning-meal-editor { padding:.9rem; background:var(--surface); border-top:1px solid var(--border); }
@media (max-width:820px) {
    .desktop-nav { display:none; }
    .app-main { max-width:650px; padding:18px 12px 106px; }
    .app-topbar { min-height:62px; padding-inline:14px; }
    .app-brand-mark { width:35px; height:35px; }
    .card { padding:1rem; border-radius:18px; }
    .calorie-summary { grid-template-columns:1fr 1fr; }
    .grid { grid-template-columns:1fr; }
    .planning-days { scrollbar-width:thin; }
    .planning-tool-accordion > summary,.planning-day-accordion > summary { padding:.9rem; }
    .planning-accordion-content { padding:0 .75rem .75rem; }
    .planning-meal-editor { padding:.75rem; }
}
@media (max-width:430px) {
    .top-actions > a:first-child { display:none; }
    .calorie-summary { grid-template-columns:1fr; }
    button,.button { width:100%; }
    .inline button,.inline .button { width:auto; flex:1 1 auto; }
    .bottom-nav-item { font-size:.62rem; }
}
