/* ============================================================
   Cueilli Vendu · Design system
   Ton visuel : docs/maquette/{connexion,catalogue,resteavendre}.html
   Bascule desktop / mobile : 1140px (cadre de l'app et listes).
   ============================================================ */

:root{
  /* Verts */
  --vert-profond:#17472a;   --vert-primaire:#2f6d3f;  --vert-doux:#7ba05b;
  --vert-clair:#e3ebd8;     --vert-pale:#e6eedd;
  /* Dorés */
  --dore:#d9a441;           --dore-fonce:#8a6a14;     --dore-clair:#f1eecf;   --dore-pale:#f6ecd6;
  --jaune-clair:#f2d38a;
  /* Terracotta */
  --terra:#c8623a;          --terra-txt:#b04e28;      --terra-clair:#f6e3d3;   --rouge:#c8322b;
  /* Neutres */
  --fond:#faf9f5;           --section:#f4f2ec;        --surface:#fff;         --survol:#f6f2e9;
  --txt:#1b1f1a;            --txt-2:#6b7068;          --txt-3:#8d9189;        --txt-4:#9a9e96;
  --placeholder:#a9ab9f;    --track:#efeae0;          --th:#7a7d70;
  --bord-champ:#e0d9c8;     --bord-ligne:#efeae0;     --bord-entete:#e9e4d8;  --bord-seg:#e6e1d4;
  --bord:rgba(0,0,0,.08);   --bord-fort:rgba(0,0,0,.13);
  /* Rayons, ombres */
  --r-carte:18px; --r-chip:20px; --r-btn:12px; --r-champ:10px;
  --ombre:0 1px 3px rgba(60,45,15,.06);
  --ombre-menu:0 12px 32px rgba(40,30,10,.12);
  --halo:0 0 0 3px rgba(47,109,63,.12);
  /* Police unique de l'app (chargée par html_head()) */
  --police:'Geist',system-ui,-apple-system,'Segoe UI',sans-serif;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:var(--police);
  background:var(--fond); color:var(--txt);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
.num{font-variant-numeric:tabular-nums}
/* Les champs de formulaire n'héritent pas de la police par défaut. */
button,input,select,textarea{font-family:inherit}
input::placeholder{color:var(--placeholder)}

/* ------------------------------------------------------------
   Cadre de l'app : barre latérale (desktop) / bandeau + nav du bas (mobile)
   ------------------------------------------------------------ */
.app{display:flex;min-height:100vh}

.sidebar{width:272px;flex:none;background:var(--vert-profond);color:#fff;
  display:flex;flex-direction:column;gap:6px;padding:32px 20px;position:sticky;top:0;height:100vh}
.brand{display:flex;align-items:center;gap:10px;padding:0 10px 28px;min-width:0;
  font:600 16px var(--police);color:#fff}
.brand .logo{width:30px;height:30px;border-radius:9px;background:var(--vert-doux);flex:none;
  display:inline-flex;align-items:center;justify-content:center;color:#fff;font:700 14px var(--police)}
/* Logo dessiné (assets/icons/logo.svg) : pas de pastille, le dessin est posé sur le vert profond */
.brand img.logo-ico,.auth-brand img.logo-ico{background:none;border-radius:0;object-fit:contain}
.brand img.logo-ico{width:32px;height:32px}
.mhead .brand img.logo-ico{width:30px;height:30px}
.brand-nom{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-d{display:flex;flex-direction:column;gap:6px}
.nav-d a{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:10px;
  font:500 14px var(--police);color:rgba(255,255,255,.68);transition:background .15s,color .15s}
.nav-d a svg{width:18px;height:18px;flex:none}
.nav-d a:hover{color:#fff;background:rgba(255,255,255,.07)}
.nav-d a.on{background:rgba(255,255,255,.14);color:#fff;font-weight:600}
.sidebar .spacer{flex:1}

/* Utilisateur connecté (pied de barre latérale) */
.side-user{display:flex;align-items:center;gap:10px;padding:12px;border-radius:12px;background:rgba(255,255,255,.1)}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--vert-doux);flex:none;
  display:inline-flex;align-items:center;justify-content:center;font:600 13px var(--police);color:#fff}
.side-user-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.side-user-nom{font:600 13px var(--police);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side-logout{background:none;border:0;padding:0;text-align:left;cursor:pointer;
  font:400 12px var(--police);color:rgba(255,255,255,.6)}
.side-logout:hover{color:#fff}

/* Colonne principale */
.main{flex:1;min-width:0;display:flex;flex-direction:column}

/* Bandeau mobile (masqué sur desktop) */
.mhead{display:none;background:var(--vert-profond);color:#fff;position:sticky;top:0;z-index:20;
  padding:calc(12px + env(safe-area-inset-top)) 16px 10px}
.mhead-haut{display:flex;align-items:center;justify-content:space-between;gap:12px}
.mhead .brand{padding:0}
.mhead .brand .logo{width:28px;height:28px;border-radius:8px;font-size:13px}
.mhead-avatar{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.14);flex:none;
  display:flex;align-items:center;justify-content:center;font:600 13px var(--police);color:#fff}
/* Onglets du bandeau (mobile dans le navigateur) — Réglages = l'initiale à droite */
.mnav{display:flex;gap:4px;margin-top:10px}
.mnav a{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:7px;height:38px;padding:0 6px;
  border-radius:10px;font:500 14px var(--police);color:rgba(255,255,255,.72);white-space:nowrap}
.mnav a svg{width:18px;height:18px;flex:none}
.mnav a.on{background:rgba(255,255,255,.14);color:#fff;font-weight:600}

/* Contenu + en-tête de page (identique desktop / mobile) */
.content{flex:1;width:100%;max-width:1680px;margin:0 auto;padding:40px clamp(32px, 3vw, 64px);
  display:flex;flex-direction:column;gap:24px}
.page-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.page-titre{display:flex;flex-direction:column;gap:6px;min-width:0}
.eyebrow{font:500 14px var(--police);color:var(--txt-2)}
.page-retour{display:inline-flex;align-items:center;gap:6px;width:fit-content}
.page-retour:hover{color:var(--txt)}

/* Puce de date (en-tête) : l'input natif, transparent, couvre la puce */
.date-puce{position:relative;display:inline-flex;align-items:center;gap:10px;height:44px;padding:0 14px;cursor:pointer;
  background:#fff;border:1px solid var(--bord-champ);border-radius:var(--r-btn);font:500 14px var(--police);color:var(--txt)}
.date-puce svg{color:var(--vert-primaire);flex:none}
.date-puce:hover{border-color:#c9c1ad}
.date-puce:focus-within{border-color:var(--vert-primaire);box-shadow:var(--halo)}
.date-puce input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;border:0;padding:0}
.date-court{display:none}
.page-head h1{margin:0;font:600 30px/1.1 var(--police);color:var(--txt);letter-spacing:-.025em}
.page-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

/* Nav du bas (mobile) */
.bottomnav{display:none}

/* Select magasin — [ icône · libellé · chevron ] + menu */
.store-filter{position:relative;display:inline-block}
.store-trigger{display:inline-flex;align-items:center;gap:10px;min-width:250px;height:44px;padding:0 14px;
  background:#fff;border:1px solid var(--bord-champ);border-radius:var(--r-btn);
  font:500 14px var(--police);color:var(--txt);cursor:pointer;transition:border-color .15s}
.store-trigger:hover{border-color:#c9c1ad}
.store-trigger .store-ico{color:var(--vert-primaire);flex:none}
.store-trigger .lbl{flex:1;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.store-trigger .chev{color:var(--txt-2);flex:none;transition:transform .18s}
.store-filter:has(.store-menu.open) .chev{transform:rotate(180deg)}
.store-trigger.solo{cursor:default}
.store-trigger.solo:hover{border-color:var(--bord-champ)}
.store-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:100%;background:#fff;color:var(--txt);
  border:1px solid var(--bord-entete);border-radius:14px;box-shadow:var(--ombre-menu);
  display:none;z-index:40;white-space:nowrap;padding:6px;flex-direction:column;gap:2px}
.store-menu.open{display:flex}
.store-menu{max-width:calc(100vw - 16px)}
.store-menu.a-gauche{right:auto;left:0}   /* posé par placerMenu() (app.js) quand il déborderait à gauche */
.store-menu a{display:flex;align-items:center;height:42px;padding:0 10px;border-radius:10px;
  font:500 14px var(--police);color:var(--txt)}
.store-menu a:hover{background:var(--section)}
.store-menu a.on{font-weight:600;background:#eef4ea}

/* ------------------------------------------------------------
   Composants
   ------------------------------------------------------------ */
.card{background:var(--surface);border-radius:var(--r-carte);box-shadow:var(--ombre)}
.card.flush{overflow:hidden}

.chip{display:inline-flex;align-items:center;gap:5px;font:500 12px var(--police);
  padding:4px 10px;border-radius:var(--r-chip);white-space:nowrap}
.chip-legume{background:var(--vert-pale);color:var(--vert-primaire)}
.chip-fruit{background:var(--dore-pale);color:var(--dore-fonce)}

/* Piste de progression */
.trk{display:block;height:6px;background:var(--track);border-radius:6px;overflow:hidden;flex:1}
.fil{display:block;height:100%;border-radius:6px;transition:width .2s}

/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 18px;
  background:var(--vert-primaire);color:#fff;border:0;border-radius:var(--r-btn);
  font:600 14px var(--police);cursor:pointer;transition:background .15s;white-space:nowrap}
.btn:hover{background:var(--vert-profond)}
.btn.sm{height:38px;padding:0 14px;font-size:13.5px}
.btn.ghost{background:#fff;color:var(--txt);border:1px solid var(--bord-champ)}
.btn.ghost:hover{background:var(--survol)}
.btn.block{width:100%}
.btn svg{flex:none}
.btn .plus{font-weight:300;font-size:18px}

/* Interrupteur actif / inactif */
.toggle{width:44px;height:26px;border-radius:20px;background:#d9d3c4;position:relative;
  border:0;cursor:pointer;flex:none;transition:background .2s;padding:0}
.toggle .knob{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;
  background:#fff;transition:left .15s}
.toggle.on{background:var(--vert-primaire)}
.toggle.on .knob{left:21px}

/* Cartes KPI (en-tête) */

/* Recherche */
.search{display:flex;align-items:center;gap:10px;height:44px;padding:0 14px;background:#fff;
  border:1px solid var(--bord-champ);border-radius:var(--r-btn)}
.search:focus-within{border-color:var(--vert-primaire);box-shadow:var(--halo)}
.search input{border:0;background:none;outline:none;font:400 15px var(--police);color:var(--txt);width:100%;min-width:0}
.search-clear{flex:none;border:0;background:none;cursor:pointer;color:var(--txt-4);padding:0 2px;
  font:400 20px/1 var(--police);display:flex;align-items:center;transition:color .15s}
.search-clear:hover{color:var(--txt-2)}
.search-clear[hidden]{display:none}

/* Barre livraison : sélecteur de vue + actions */

/* Contrôle segmenté (filtres, Suivi / Journal, Manuel / Import) */
.segmented{display:inline-flex;background:#fff;border:1px solid var(--bord-seg);border-radius:var(--r-btn);padding:3px;gap:2px}
.segmented a{display:inline-flex;align-items:center;height:38px;padding:0 14px;border-radius:9px;
  font:500 14px var(--police);color:var(--txt-2);transition:background .15s,color .15s}
.segmented a:hover{color:var(--txt)}
.segmented a.on{background:var(--vert-pale);color:var(--vert-profond)}

/* Tableaux (grille) */
.tbl{width:100%}
.tbl .thead,.tbl .trow{display:grid;gap:16px;align-items:center}
.tbl .thead{padding:14px 24px;background:var(--section);border-bottom:1px solid var(--bord-entete)}
.tbl .trow{padding:14px 24px;border-top:1px solid var(--bord-ligne)}
.tbl .thead + .trow{border-top:0}
.tbl .trow.warn{background:#fbf4ec}
.th{font:600 12px var(--police);color:var(--th);letter-spacing:.06em;text-transform:uppercase}
.tbl .r{text-align:right}
.tbl .c{text-align:center}
.p-nom{font:500 15px var(--police);color:var(--txt)}
.p-unite{font-weight:400;font-size:14px;color:var(--txt-4)}
.dot{width:8px;height:8px;border-radius:50%;flex:none;display:inline-block}
.muted{color:var(--txt-2)}
.muted2{color:var(--txt-4)}

/* Zone de dépôt (import) */
.dropzone{border:2px dashed rgba(47,109,63,.35);border-radius:22px;background:#f4f5ef;
  padding:44px 60px;display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}
.dropzone .ico{width:70px;height:70px;border-radius:20px;background:var(--vert-clair);
  display:flex;align-items:center;justify-content:center}
.dropzone h3{margin:0;font:600 19px var(--police);color:var(--txt)}
.filecard{display:flex;align-items:center;gap:11px;background:#fff;border:1px solid var(--bord);
  border-radius:14px;padding:13px 16px}
.filecard .ext{width:36px;height:36px;border-radius:9px;background:var(--dore-clair);
  display:flex;align-items:center;justify-content:center;font:600 11px var(--police);color:var(--dore-fonce)}

/* Encadré note dorée */
.note{background:var(--dore-clair);border-radius:11px;padding:12px;
  font:400 12px/1.4 var(--police);color:var(--dore-fonce)}

/* Élément réservé au mobile (ex. « Se déconnecter » dans Réglages). Le !important bat un display inline. */
@media(min-width:1140px){ .only-mobile{display:none !important} }
.row{display:flex}
.between{justify-content:space-between}
.center{align-items:center}
.grow{flex:1}
.gap-s{gap:8px}.gap{gap:12px}
.wrap{flex-wrap:wrap}

/* ------------------------------------------------------------
   Bascule mobile (< 1140px)
   · dans le navigateur : navigation en haut, dans le bandeau (la barre du
     navigateur occupe déjà le bas de l'écran) ;
   · app installée sur l'écran d'accueil (display-mode: standalone) : plein
     écran, navigation en bas comme une app native.
   ------------------------------------------------------------ */
@media(max-width:1139px){
  .sidebar{display:none}
  .mhead{display:block}
  .content{padding:20px 16px calc(32px + env(safe-area-inset-bottom))}
  .page-head h1{font-size:28px}
}

@media(max-width:1139px) and (display-mode:standalone){
  .mnav{display:none}
  .content{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
  .bottomnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;
    height:calc(72px + env(safe-area-inset-bottom));padding:0 8px calc(8px + env(safe-area-inset-bottom));
    background:var(--vert-profond)}
  .bottomnav a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
    font:500 11px var(--police);color:rgba(255,255,255,.6)}
  .bottomnav a svg{width:22px;height:22px}
  .bottomnav a.on{color:#fff;font-weight:600}
}

/* Dialog (nouveau produit) */
dialog{border:0;border-radius:18px;padding:0;max-width:92vw;width:520px;
  box-shadow:0 30px 70px rgba(20,30,15,.28)}
dialog::backdrop{background:rgba(20,30,15,.35)}
/* Dialog ouverte : la page derrière ne défile plus (molette, doigt) et ne « fuit » pas
   en bout de liste ; scrollbar-gutter évite le saut de mise en page quand la barre disparaît. */
html{scrollbar-gutter:stable}
html:has(dialog[open]){overflow:hidden}
dialog,.pick-list{overscroll-behavior:contain}
.dlg-b{padding:22px}
.dlg-b h2{margin:0 0 16px;font:600 20px var(--police)}
.field{margin-bottom:13px}
.field label{display:block;font:500 13px var(--police);color:var(--txt);margin-bottom:7px}
.field input,.field select{width:100%;height:44px;border:1px solid var(--bord-champ);border-radius:var(--r-btn);
  padding:0 14px;font:400 15px var(--police);color:var(--txt);background:#fff}
.field input:focus,.field select:focus{outline:0;border-color:var(--vert-primaire);box-shadow:var(--halo)}
.dlg-actions{display:flex;gap:10px;margin-top:18px}

/* Sélecteur de produits (modale desktop / bottom sheet mobile) */
dialog.sheet{width:560px}
.sheet .sheet-b{display:flex;flex-direction:column;max-height:80vh}
.sheet-head{display:flex;align-items:center;justify-content:space-between;padding:20px 22px 12px}
.sheet-head h2{margin:0;font:600 20px var(--police)}
.sheet-x{border:0;background:none;cursor:pointer;font:400 26px/1 var(--police);color:var(--txt-3);padding:0 4px}
.pick-search{margin:0 22px 10px;border:1px solid var(--bord-fort);border-radius:11px;padding:11px 14px;
  font:400 14px var(--police);color:var(--txt);background:#fff}
.pick-search:focus{border-color:var(--vert-primaire);outline:none}
.pick-list{overflow-y:auto;padding:2px 12px 8px;flex:1}
.pick-item{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:11px;cursor:pointer}
.pick-item:hover{background:var(--section)}
.pick-item input{width:18px;height:18px;accent-color:var(--vert-primaire);cursor:pointer;flex:none}
.pick-nom{flex:1;font:600 14px var(--police);color:var(--txt)}
.pick-cat{font:400 12px var(--police);color:var(--txt-3)}
.pick-empty{padding:26px;text-align:center;color:var(--txt-3);font:400 14px var(--police)}
.sheet-foot{padding:12px 22px 18px;border-top:1px solid rgba(0,0,0,.06)}

@media(max-width:1139px){
  /* Bottom sheet collée en bas */
  dialog.sheet{width:100vw;max-width:100vw;position:fixed;left:0;right:0;bottom:0;top:auto;margin:0;
    border-radius:20px 20px 0 0}
  .sheet .sheet-b{max-height:85vh}
}

/* Étiquettes de statut et badge de semaine (navigation, listes) */
.wk-badge{flex:none;font:600 11px var(--police);color:var(--txt-2);background:var(--section);
  border-radius:6px;padding:2px 6px;letter-spacing:.02em}
.chip-encours{background:var(--vert-pale);color:var(--vert-primaire)}
.chip-avenir{background:#e6ecf5;color:#43618a}
.chip-historique{background:var(--section);color:var(--txt-2)}

/* Champs éditables inline (Mes produits) : texte, prix, select natif */
.cell-input{width:100%;height:40px;border:1px solid var(--bord-champ);border-radius:var(--r-champ);padding:0 12px;
  font:400 14px var(--police);color:var(--txt);background:#fff;transition:border-color .15s,box-shadow .15s}
.cell-input:hover{border-color:#cfc6b2}
.cell-input:focus{border-color:var(--vert-primaire);box-shadow:var(--halo);outline:none}
.cell-input.saved{border-color:var(--vert-doux);background:var(--vert-clair)}
select.cell-input{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:32px;font-weight:500;
  background:#fff no-repeat right 12px center/14px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7068' stroke-width='2.2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")}
select.cell-input.saved{background-color:var(--vert-clair)}
.cell-input.prix{text-align:right;font-weight:500;font-variant-numeric:tabular-nums}

/* ------------------------------------------------------------
   Notifications (toasts) — style A : par-dessus la page, jamais dans le flux.
   Succès sur vert profond, avertissement sur terracotta foncé (icône sur pastille dorée).
   Bas-droite en desktop ; en haut en mobile (le bas est pris par les boutons collés et la nav).
   Maquette : docs/propositions/notifications.html
   ------------------------------------------------------------ */
.toasts{position:fixed;z-index:200;right:24px;bottom:24px;display:flex;flex-direction:column;gap:10px;
  width:380px;max-width:calc(100vw - 32px);pointer-events:none}
.toast{pointer-events:auto;position:relative;display:flex;align-items:flex-start;gap:11px;touch-action:pan-y;
  padding:13px 14px 15px;border-radius:14px;background:var(--vert-profond);color:#fff;box-shadow:0 12px 32px rgba(23,71,42,.28);
  transition:transform 220ms var(--ease-out),opacity 220ms var(--ease-out)}
.toast.warn{background:#9c4422;box-shadow:0 12px 32px rgba(156,68,34,.3)}
.toast.entre{opacity:0;transform:translateY(14px) scale(.97)}
.toast.sort{opacity:0;transform:translateY(6px) scale(.98);transition-duration:150ms}
.toast-ico{flex:none;width:22px;height:22px;margin-top:1px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--vert-doux);color:#fff}
.toast.warn .toast-ico{background:var(--dore)}
.toast-msg{flex:1;min-width:0;font:500 13.5px/1.45 var(--police)}
.toast-x{flex:none;width:26px;height:26px;margin:-3px -4px -3px 0;border:0;border-radius:8px;background:none;cursor:pointer;
  font:400 18px/1 var(--police);color:rgba(255,255,255,.6);transition:background-color 150ms ease,color 150ms ease}
.toast-x:hover{background:rgba(255,255,255,.1);color:#fff}
.toast-x:active{transform:scale(.94)}
.toast-temps{position:absolute;left:14px;right:14px;bottom:5px;height:2px;border-radius:2px;overflow:hidden;background:rgba(255,255,255,.12)}
.toast-temps i{display:block;height:100%;background:rgba(255,255,255,.45);transform-origin:left;animation:toast-decompte linear forwards}
.toast:hover .toast-temps i,.toast.pause .toast-temps i{animation-play-state:paused}
@keyframes toast-decompte{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media(max-width:1139px){
  .toasts{top:calc(10px + env(safe-area-inset-top));bottom:auto;left:12px;right:12px;width:auto;max-width:none;flex-direction:column-reverse}
  .toast.entre{transform:translateY(-14px) scale(.97)}
  .toast.sort{transform:translateY(-6px) scale(.98)}
}
@media (prefers-reduced-motion:reduce){ .toast.entre,.toast.sort{transform:none} }

/* Message d'erreur dans un formulaire (ex. identifiants incorrects à la connexion) */
.flash{padding:12px 16px;border-radius:12px;font:500 13px var(--police);margin-bottom:4px}
.flash.ok{background:var(--vert-clair);color:#3f6b3a}
.flash.warn{background:var(--terra-clair);color:var(--terra-txt)}

/* ------------------------------------------------------------
   Réglages
   ------------------------------------------------------------ */
.reglages{display:flex;flex-direction:column;max-width:1100px}
/* Une section = titre + explication (gauche) | carte de réglages (droite) */
.regl-section{display:grid;grid-template-columns:minmax(200px,1fr) minmax(0,2fr);gap:32px;padding:28px 0;border-top:1px solid var(--bord-ligne)}
.regl-section:first-child{padding-top:4px;border-top:0}
.regl-intro h2{margin:0 0 6px;font:600 16px var(--police);color:var(--txt)}
.regl-intro p{margin:0;font:400 14px/1.55 var(--police);color:var(--txt-2)}
.regl-carte{padding:20px;align-self:start}
.regl-label{display:block;margin-bottom:7px;font:500 13px var(--police);color:var(--txt)}
.regl-ligne{display:flex;gap:10px}
.regl-ligne .cell-input,.regl-champ .cell-input{height:44px;border-radius:12px;font-size:15px}
.regl-ligne .cell-input{flex:1;min-width:0}
.regl-mdp{display:grid;grid-template-columns:1fr 1fr;gap:14px 12px}
.regl-plein{grid-column:1 / -1}
.regl-deconnexion{margin-top:16px;padding-top:16px;border-top:1px solid var(--bord-ligne)}
.regl-separe{margin-top:20px;padding-top:20px;border-top:1px solid var(--bord-ligne)}
.regl-valeur{font:600 16px var(--police);color:var(--txt)}
.regl-aide{margin:8px 0 0;font:400 13px/1.5 var(--police);color:var(--txt-2)}
/* Comptes (administrateur) */
.user-row.inactif .p-nom{color:var(--txt-3)}
.user-actions{display:flex;gap:8px;align-items:center;margin-left:auto;flex:none}
.chip-admin{background:var(--vert-pale);color:var(--vert-primaire);font-size:11.5px;vertical-align:1px}
.compte-ajout{margin-top:16px;padding-top:16px;border-top:1px solid var(--bord-ligne)}
.compte-ajout-titre{font:600 14px var(--police);color:var(--txt)}
.user-row{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--bord-ligne)}
.user-row:first-child{padding-top:0;border-top:0}
.user-nom{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.user-nom .muted2{font:400 12.5px var(--police)}
/* Magasins (Réglages) */
.mag-liste{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.mag-ligne{display:flex;align-items:center;gap:8px}
.mag-ligne.inactif .cell-input{color:var(--txt-4);background:var(--section)}
.mag-nom{flex:1;display:flex;gap:8px;min-width:0}
.mag-nom .cell-input{flex:1;min-width:0}
.mag-ajout{display:flex;gap:8px}
/* Suppression (magasin…) : bouton discret dans la liste, plein dans la confirmation */
.btn.ghost.danger{color:var(--terra-txt)}
.btn.btn-icone-sm{width:38px;padding:0;flex:none}   /* bouton icône seule (poubelle) */
.btn.ghost.danger:hover{background:var(--terra-clair);border-color:#ecc9b6}
.btn.ghost.danger:disabled{opacity:.4;cursor:not-allowed;background:#fff}
.btn.btn-danger{background:var(--terra)}
.btn.btn-danger:hover{background:var(--terra-txt)}
.btn.btn-danger:disabled{opacity:.45;cursor:not-allowed;background:var(--terra)}
.dlg-alerte{margin:0 0 14px;padding:12px 14px;border-radius:12px;background:var(--terra-clair);color:var(--terra-txt);
  font:400 13.5px/1.5 var(--police)}
.dlg-texte{margin:0 0 14px;font:400 14px/1.5 var(--police);color:var(--txt-2)}
.mag-ajout .cell-input{flex:1;min-width:0}
/* Clés d'accès (Réglages) : liste façon Comptes, ajout sous la liste */
.cle-liste{display:flex;flex-direction:column}
.cle-ligne{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--bord-ligne)}
.cle-ligne:first-child{padding-top:0;border-top:0}
.cle-ico{flex:none;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;
  background:var(--vert-pale);color:var(--vert-primaire)}
.cle-vide{margin:0}
.cle-ajout{margin-top:16px;padding-top:16px;border-top:1px solid var(--bord-ligne)}
.cle-ajout:empty{display:none}
.cle-ajout .regl-aide:first-child{margin-top:0}
/* E-mails (Réglages, administrateur) : mode d'envoi */
.mail-etat{margin:0 0 8px;padding:11px 13px;border-radius:12px;font:400 13.5px/1.5 var(--police);overflow-wrap:anywhere}
.mail-smtp{background:var(--vert-pale);color:var(--vert-profond)}
.mail-mail{background:var(--dore-clair);color:var(--dore-fonce)}
.mail-dossier{background:var(--section);color:var(--txt-2)}
.regl-intro code{font:500 13px var(--police);color:var(--txt)}
.regl-facultatif{font-weight:400;color:var(--txt-3)}
/* Proposition après une connexion par mot de passe */
.dlg-cle{width:420px}
.dlg-cle-ico{display:grid;place-items:center;width:48px;height:48px;margin-bottom:14px;border-radius:14px;
  background:var(--vert-pale);color:var(--vert-primaire)}
.dlg-cle .dlg-texte{margin:0}
.dlg-lien{display:block;margin:14px auto 0;padding:6px 8px;border:0;background:none;cursor:pointer;
  font:400 13px var(--police);color:var(--txt-3);text-decoration:underline;text-underline-offset:3px}
.installer-etapes{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font:400 14px/1.5 var(--police);color:var(--txt)}
@media(display-mode:standalone){ .carte-installer{display:none} }   /* déjà installée */
@media(max-width:1139px){
  .regl-section{grid-template-columns:minmax(0,1fr);gap:12px;padding:22px 0}
  .regl-carte{padding:16px}
  .regl-ligne .cell-input,.regl-champ .cell-input{font-size:16px}   /* pas de zoom iOS */
}
@media(max-width:600px){
  .regl-ligne{flex-direction:column}
  .regl-ligne .cell-input{flex:none}                 /* garde ses 44px en colonne */
  .mag-ligne{flex-wrap:wrap}
  .mag-nom{flex:1 1 100%}                            /* nom + Renommer, Désactiver dessous */
  .regl-mdp{grid-template-columns:1fr}
  .regl-mdp .btn{width:100%}
  /* Comptes : actions sous le compte, alignées sur le nom */
  .user-row{flex-wrap:wrap}
  .user-actions{width:calc(100% - 44px);margin-left:44px;flex-wrap:wrap}   /* 44 = avatar + gap */
}

/* ------------------------------------------------------------
   Page de connexion — maquette docs/maquette/connexion.html
   ≥ 860px : panneau vert (plafonné sur grand écran) + formulaire compact.
   < 860px : formulaire seul, logo carré au-dessus du titre, champs tactiles.
   ------------------------------------------------------------ */
.auth{--auth-txt:#1b1f1a;--auth-txt-2:#6b7068;--auth-bord:#e0d9c8;--auth-survol:#f6f2e9;
  --auth-halo:0 0 0 4px rgba(47,109,63,.12);
  display:flex;min-height:100vh;background:#fff}

.auth-aside{flex:0 0 clamp(420px, 50%, 760px);background:var(--vert-profond);color:#fff;
  display:flex;flex-direction:column;justify-content:space-between;
  padding:clamp(40px, 3vw, 56px) clamp(44px, 4vw, 72px)}
.auth-brand{display:flex;align-items:center;gap:12px;font:600 clamp(18px, 1vw, 20px) var(--police);color:#fff}
.auth-brand .logo{width:clamp(36px, 2.1vw, 42px);height:clamp(36px, 2.1vw, 42px);border-radius:11px;
  background:var(--vert-doux);color:#fff;display:inline-flex;align-items:center;justify-content:center;
  font:700 clamp(16px, .95vw, 19px) var(--police)}
.auth-pitch{display:flex;flex-direction:column;gap:16px;max-width:clamp(420px, 34vw, 600px)}
.auth-pitch h2{margin:0;font:600 clamp(40px, 3vw, 54px)/1.1 var(--police);letter-spacing:-.03em;text-wrap:pretty}
.auth-pitch p{margin:0;font:400 clamp(17px, 1.05vw, 19px)/1.5 var(--police);color:rgba(255,255,255,.75)}
.auth-copy{font:400 14px var(--police);color:rgba(255,255,255,.55)}

.auth-main{flex:1;display:flex;align-items:center;justify-content:center;padding:40px 28px;background:#fff}
.auth-form{width:100%;max-width:clamp(380px, 22vw, 420px);display:flex;flex-direction:column;gap:32px}
.auth-head{display:flex;flex-direction:column;gap:20px}
.auth-logo{display:none}
.auth-titre{display:flex;flex-direction:column;gap:8px}
.auth-form h1{margin:0;font:600 clamp(30px, 1.75vw, 34px)/1.1 var(--police);letter-spacing:-.025em;color:var(--auth-txt)}
.auth-sub{margin:0;font:400 clamp(16px, .9vw, 17px)/1.45 var(--police);color:var(--auth-txt-2)}
.auth-form .flash{margin:0}

.auth-champs{display:flex;flex-direction:column;gap:18px}
.auth-field{display:flex;flex-direction:column;gap:8px}
.auth-label{font:500 14px var(--police);color:var(--auth-txt)}
.auth-input{width:100%;height:44px;padding:0 16px;border:1px solid var(--auth-bord);border-radius:12px;
  background:#fff;font:400 15px var(--police);color:var(--auth-txt);transition:border-color .15s,box-shadow .15s}
.auth-input::placeholder{color:#9a9e96}
.auth-input:focus{outline:0;border-color:var(--vert-primaire);box-shadow:var(--auth-halo)}
.auth-pwd{position:relative}
.auth-pwd .auth-input{padding-right:84px}
.auth-show{position:absolute;right:5px;top:50%;transform:translateY(-50%);height:34px;padding:0 11px;
  border:0;border-radius:8px;background:none;cursor:pointer;font:500 14px var(--police);color:var(--auth-txt-2)}
.auth-show:hover{background:var(--auth-survol)}

.auth-check{display:flex;align-items:center;gap:10px;cursor:pointer;user-select:none;
  font:400 15px var(--police);color:var(--auth-txt)}
.auth-check input{appearance:none;-webkit-appearance:none;flex:none;width:22px;height:22px;margin:0;cursor:pointer;
  border:1.5px solid #cfc8b6;border-radius:7px;background:#fff center/13px no-repeat}
.auth-check input:checked{border-color:var(--vert-primaire);background-color:var(--vert-primaire);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E")}
.auth-check input:focus-visible{outline:0;box-shadow:var(--auth-halo)}

/* Installateur (install.php) : même gabarit que la connexion, formulaire plus large en sections */
.auth-form.install-form{max-width:clamp(440px, 30vw, 560px);gap:24px}
.install-sections{display:flex;flex-direction:column;gap:20px}
/* Une carte par section, numérotée */
.install-bloc{padding:22px;border:1px solid var(--auth-bord);border-radius:18px;background:var(--fond);display:flex;flex-direction:column;gap:14px}
.install-titre{display:flex;align-items:center;gap:10px;margin:0 0 2px;font:600 16px var(--police);color:var(--auth-txt)}
.install-num{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  background:var(--vert-primaire);color:var(--surface);font:600 13px var(--police)}
.install-bloc .auth-input,.install-bloc .install-tester{background:var(--surface)}
.install-legende{margin:0;font:400 13px var(--police);color:var(--auth-txt-2)}
/* Champ obligatoire : astérisque rouge après le libellé (devant dans la légende) */
.requis{color:var(--rouge);font-weight:600;margin-left:3px}
.install-legende .requis{margin:0 4px 0 0}
.install-aide,.install-texte{margin:0;font:400 13.5px/1.5 var(--police);color:var(--auth-txt-2)}
.install-grille{display:grid;grid-template-columns:1fr 1fr;gap:14px 12px}
.install-plein{grid-column:1 / -1}
.install-alerte{padding:12px 14px;border-radius:12px;background:var(--dore-clair);color:var(--dore-fonce);font:400 13.5px/1.5 var(--police)}
.install-config{width:100%;padding:12px 14px;border:1px solid var(--auth-bord);border-radius:12px;background:var(--section);
  font:400 12.5px/1.5 ui-monospace,Consolas,monospace;color:var(--txt);resize:vertical}
.install-lien{display:flex;align-items:center;justify-content:center;text-decoration:none}
.install-test{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.install-tester{height:40px;padding:0 16px;border:1px solid var(--auth-bord);border-radius:12px;background:#fff;cursor:pointer;
  font:600 14px var(--police);color:var(--txt);transition:transform 160ms var(--ease-out),background-color 150ms ease}
.install-tester:hover{background:var(--auth-survol)}
.install-tester:active{transform:scale(.97)}
.install-tester:disabled{opacity:.6;cursor:default}
.install-resultat{width:100%;padding:11px 13px;border-radius:12px;font:400 13.5px/1.5 var(--police)}
.install-resultat[hidden]{display:none}
.install-resultat.ok{background:var(--vert-pale);color:var(--vert-profond)}
.install-resultat.info{background:var(--dore-clair);color:var(--dore-fonce)}
.install-resultat.erreur{background:var(--terra-clair);color:var(--terra-txt)}
.auth-btn:disabled{opacity:.5;cursor:not-allowed}
/* Solidité du mot de passe (3 segments) et confirmation */
.mdp-force{display:flex;flex-direction:column;gap:6px;margin-top:2px;font:400 12.5px/1.4 var(--police);color:var(--auth-txt-2, var(--txt-2))}
.mdp-barre{display:flex;gap:4px}
.mdp-barre i{flex:1;height:4px;border-radius:3px;background:var(--track);transition:background-color 150ms ease}
.mdp-force.f0 .mdp-barre i:first-child{background:var(--terra)}
.mdp-force.f0 .mdp-lib{color:var(--terra-txt)}
.mdp-force.f1 .mdp-barre i:nth-child(-n+2){background:var(--dore)}
.mdp-force.f2 .mdp-barre i{background:var(--vert-primaire)}
.mdp-force.f2 .mdp-lib{color:var(--vert-primaire)}
.mdp-conf{min-height:18px;margin-top:2px;font:500 12.5px/1.4 var(--police)}
.mdp-conf.ok{color:var(--vert-primaire)}
.mdp-conf.ko{color:var(--terra-txt)}
.regl-champ .mdp-force,.regl-champ .mdp-conf,.field .mdp-force,.field .mdp-conf{margin-top:8px}
.auth-main:has(.install-form){align-items:flex-start;padding-top:56px;padding-bottom:56px}
.auth-btn{width:100%;height:46px;border:0;border-radius:12px;background:var(--vert-primaire);color:#fff;
  font:600 15px var(--police);cursor:pointer;transition:background .15s}
.auth-btn:hover{background:var(--vert-profond)}
/* Mot de passe oublié : lien au-dessus du champ, textes, retour */
.auth-label-ligne{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.auth-lien{font:500 13.5px var(--police);color:var(--vert-primaire);text-decoration:none}
.auth-lien:hover{text-decoration:underline;text-underline-offset:3px}
.auth-texte{margin:0;font:400 15px/1.55 var(--police);color:var(--auth-txt)}
.auth-note{margin:-14px 0 0;font:400 13.5px/1.5 var(--police);color:var(--auth-txt-2)}
.auth-texte + .auth-note{margin-top:-18px}
.auth-btn-lien{display:flex;align-items:center;justify-content:center;text-decoration:none}
.auth-retour{align-self:flex-start;margin-top:-12px;font:500 14px var(--police);color:var(--auth-txt-2);text-decoration:none}
.auth-retour:hover{color:var(--auth-txt)}
/* Connexion par clé d'accès (empreinte, visage) : « ou » + bouton secondaire, affichés par app.js */
.auth-cle{display:flex;flex-direction:column;gap:18px;margin-top:-12px}
.auth-cle[hidden]{display:none}
.auth-ou{display:flex;align-items:center;gap:12px;font:400 13px var(--police);color:var(--auth-txt-2)}
.auth-ou::before,.auth-ou::after{content:"";flex:1;height:1px;background:var(--auth-bord)}
.auth-btn-cle{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;height:46px;
  border:1px solid var(--auth-bord);border-radius:12px;background:#fff;cursor:pointer;
  font:600 15px var(--police);color:var(--auth-txt);transition:transform 160ms var(--ease-out),background-color 150ms ease}
.auth-btn-cle svg{color:var(--vert-primaire)}
.auth-btn-cle:active{transform:scale(.97)}
.auth-btn-cle:disabled{opacity:.6;cursor:default}
@media (hover:hover) and (pointer:fine){ .auth-btn-cle:hover{background:var(--auth-survol)} }

@media(max-width:859px){
  .auth-aside{display:none}
  .auth-logo{display:block;width:48px;height:48px}   /* icône d'app complète (cadre vert) : fond clair */
  .auth-form{max-width:380px}
  .auth-input{height:52px;font-size:16px}            /* 16px : pas de zoom auto d'iOS */
  .auth-pwd .auth-input{padding-right:90px}
  .auth-show{right:6px;height:40px;padding:0 12px}
  .auth-btn{height:54px;border-radius:14px;font-size:16px}
  .auth-btn-cle{height:54px;border-radius:14px;font-size:16px}
  .install-grille{grid-template-columns:1fr}
  .install-bloc{padding:18px 16px}
  .auth-main:has(.install-form){padding-top:32px}
}

/* ------------------------------------------------------------
   Mes produits — une ligne = rangée de tableau (desktop) ou carte (mobile)
   ------------------------------------------------------------ */
.prod-outils{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.prod-outils .search{flex:1 1 260px;max-width:420px}
.prod-filtres{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
/* Pastilles de filtre (Mes produits) : catégorie + statut en bascule, nombre sur chaque pastille */
.fchips{flex-wrap:nowrap;align-items:center;gap:6px;overflow-x:auto;scrollbar-width:none;min-width:0}
.fchips::-webkit-scrollbar{display:none}
.fchip{flex:none;display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border:1px solid var(--bord-champ);
  border-radius:999px;background:#fff;font:500 13.5px var(--police);color:var(--txt-2);white-space:nowrap;
  transition:background-color 150ms ease,color 150ms ease,border-color 150ms ease,transform 160ms var(--ease-out)}
.fchip:active{transform:scale(.97)}
.fchip .n{font:500 12px var(--police);color:var(--txt-4);font-variant-numeric:tabular-nums}
.fchip.on{background:var(--vert-pale);border-color:#cfe0c2;color:var(--vert-profond);font-weight:600}
.fchip.on .n{color:var(--vert-primaire)}
.fchip .x{margin-left:2px;font:400 15px/1 var(--police);color:var(--vert-primaire)}
@media (hover:hover) and (pointer:fine){ .fchip:not(.on):hover{background:var(--survol);color:var(--txt)} }
.fchips-sep{flex:none;width:1px;height:22px;margin:0 4px;background:var(--bord-champ)}
.prod-liste{background:#fff;border-radius:var(--r-carte);box-shadow:var(--ombre);overflow:hidden}
.prod-entete,.prod-ligne{display:grid;align-items:center;gap:14px;
  grid-template-columns:minmax(140px,1.5fr) 96px minmax(120px,1.4fr) 100px 130px 52px}
.prod-entete{padding:14px 24px;background:var(--section);border-bottom:1px solid var(--bord-entete)}
.prod-entete .r{text-align:right}
.prod-ligne{padding:12px 24px;border-top:1px solid var(--bord-ligne)}
.prod-entete + .prod-ligne{border-top:0}
.prod-nom{display:flex;align-items:center;gap:12px;min-width:0;font:500 15px var(--police);color:var(--txt)}
/* Nom éditable (autosave) : se lit comme du texte, le cadre n'apparaît qu'au survol / à l'édition */
.prod-ligne .prod-nom .prod-nom-in{flex:1;min-width:0;height:38px;margin-left:-10px;padding:0 10px;border-color:transparent;background:transparent;
  font:500 15px var(--police);color:var(--txt);text-overflow:ellipsis}
.prod-ligne .prod-nom .prod-nom-in:hover{border-color:var(--bord-champ)}
.prod-ligne .prod-nom .prod-nom-in:focus{border-color:var(--vert-primaire);background:#fff}
.prod-ligne .prod-nom .prod-nom-in:disabled{background:transparent;border-color:transparent}
.prod-cat{justify-self:start}
.prod-lbl{display:none}
.prod-actif{justify-self:end}
/* Produit désactivé : tout est estompé sauf la bascule ; champs verrouillés (disabled) */
.prod-ligne.is-inactif > :not(.prod-actif){opacity:.55}
.prod-ligne .cell-input:disabled{background:var(--section);border-color:transparent;color:var(--txt-2);
  cursor:not-allowed;-webkit-text-fill-color:var(--txt-2);opacity:1}
.prod-ligne .cell-input:disabled::placeholder{color:transparent;-webkit-text-fill-color:transparent}
.prod-vide{padding:40px 24px;text-align:center;font:400 15px var(--police);color:var(--txt-2)}

@media(max-width:1139px){
  .prod-filtres{margin-left:0}
  /* Pastilles : une rangée qui défile, bord à bord de l'écran */
  .fchips{flex:1 1 100%;margin:0 -16px;padding:0 16px}
  .prod-liste{background:none;box-shadow:none;border-radius:0;overflow:visible;display:flex;flex-direction:column;gap:10px}
  .prod-entete{display:none}
  .prod-ligne{display:flex;flex-wrap:wrap;align-items:center;gap:14px 10px;padding:16px;border:0;
    background:#fff;border-radius:16px;box-shadow:var(--ombre)}
  /* Ligne 1 : nom · catégorie · interrupteur ; ligne 2 : unité | prix ; ligne 3 : origine */
  .prod-nom{order:1;flex:1 1 calc(100% - 170px);font:600 16px var(--police)}
  .prod-ligne .prod-nom .prod-nom-in{height:40px;border-radius:10px;font:600 16px var(--police)}
  .prod-cat{order:2}
  .prod-actif{order:3}
  .prod-prix{order:4;flex:1 1 calc(50% - 5px)}
  .prod-unite{order:5;flex:1 1 calc(50% - 5px)}
  .prod-origine{order:6;flex:1 1 100%}
  .prod-unite,.prod-prix,.prod-origine{display:flex;flex-direction:column;gap:6px;min-width:0}
  .prod-lbl{display:block;font:500 12px var(--police);color:var(--txt-3)}
  .prod-ligne .cell-input{height:46px;border-radius:12px;font-size:16px}  /* 16px : pas de zoom iOS */
  .prod-ligne .toggle{width:48px;height:28px}
  .prod-ligne .toggle .knob{width:22px;height:22px}
  .prod-ligne .toggle.on .knob{left:23px}
  .prod-vide{background:#fff;border-radius:16px}
}

/* ------------------------------------------------------------
   Suivi (reste à vendre) — synthèse + lignes groupées par statut.
   Desktop : un tableau trié par statut ; mobile : un groupe titré par statut.
   La barre montre toujours le VENDU (écoulement), desktop comme mobile.
   ------------------------------------------------------------ */

.rv-liste{background:#fff;border-radius:var(--r-carte);box-shadow:var(--ombre);overflow:hidden}
.rv-entete,.rv-ligne{display:grid;align-items:center;gap:18px;
  grid-template-columns:minmax(150px,1.4fr) 200px 110px 90px minmax(140px,1fr) 90px}
.rv-entete{padding:14px 24px;background:var(--section);border-bottom:1px solid var(--bord-entete)}
.rv-entete .r,.rv-rest,.rv-ca,.rv-vl{text-align:right}
.rv-barre .fil{background:var(--vert-doux)}
.rv-vl{font:500 14px var(--police);color:var(--txt-2);white-space:nowrap}
.rv-rest .sur{display:none}               /* desktop : le livré est dans « Vendu / livré » */
.rv-ligne{padding:16px 24px;border-top:1px solid var(--bord-ligne)}
.rv-lignes .rv-ligne:first-child{border-top:0}
.rv-nom{min-width:0}
.rv-meta{display:block;margin-top:2px;font:400 12.5px var(--police);color:var(--txt-4)}
.rv-rest{font:600 16px var(--police);color:var(--txt);font-variant-numeric:tabular-nums;white-space:nowrap}
.rv-rest .sur{font-weight:400;color:var(--txt-4)}
.rv-statut{display:flex;align-items:center;gap:8px;font:500 14px var(--police)}
.rv-ca{font:600 14px var(--police);color:var(--txt);font-variant-numeric:tabular-nums}
.rv-vide{padding:40px 24px;text-align:center;font:400 15px var(--police);color:var(--txt-2)}

@media(max-width:1139px){
  .rv-liste{background:none;box-shadow:none;border-radius:0;overflow:visible}
  .rv-entete{display:none}
  .rv-lignes{padding:0 16px}
  .rv-vl{display:none}
  .rv-rest .sur{display:inline}
  /* Carte produit : nom + restant, barre, puis statut à gauche et CA à droite */
  .rv-ligne{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"nom rest" "bar bar" "statut ca";
    gap:8px 12px;padding:14px 0;border-top:1px solid var(--bord-ligne)}
  .rv-ligne:first-child{border-top:0}
  .rv-nom{grid-area:nom}
  .rv-nom .p-nom{font-size:16px}
  .rv-rest{grid-area:rest;font-size:18px}
  .rv-barre{grid-area:bar}
  .rv-statut{grid-area:statut;font-size:13px;gap:6px}
  .rv-ca{grid-area:ca;font-size:13px}
}

/* ------------------------------------------------------------
   Ventes du jour (saisie manuelle) — tableau desktop / cartes mobile.
   Barre : vendu avant (vert doux) + vendu aujourd'hui (vert), mise à jour en direct.
   ------------------------------------------------------------ */
/* Ligne de contexte « magasin › semaine › date » (même rangement que la ligne de Suivi/Journal) */
.ctx{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ctx .store-trigger{min-width:0}
.ctx-semaine{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 4px;font:600 15px var(--police);color:var(--txt)}
.ctx-semaine svg{color:var(--vert-primaire);flex:none}
.ctx-court{display:none}
.date-choix .date-chev{color:var(--txt-2);flex:none}
button.date-puce{font:500 14px var(--police)}
.date-ancre .sempick-item.saisi .snav-item-e{color:var(--vert-primaire)}   /* jour déjà saisi */
.date-ancre .wk-badge{min-width:50px;text-align:center}
/* Onglets Manuel | Import : le tableau n'a pas sa propre carte, l'import a un peu d'air */
.onglets-carte .vt-carte{background:none;box-shadow:none;border-radius:0}
.onglets-carte .vt-entete{background:none}
.vt-import{padding:28px 24px}
.vt-import-date{font:400 14px var(--police);color:var(--txt-2)}
.vt-import-date b{font-weight:600;color:var(--txt)}
.vt-import-apercu{display:flex;flex-direction:column;gap:16px}
.vt-carte{background:#fff;border-radius:var(--r-carte);box-shadow:var(--ombre);overflow:hidden}
.vt-entete,.vt-ligne{display:grid;align-items:center;gap:16px;
  grid-template-columns:minmax(150px,1.4fr) minmax(110px,1.2fr) 80px 116px 184px}
.vt-entete{padding:14px 24px;background:var(--section);border-bottom:1px solid var(--bord-entete)}
.vt-entete .r{text-align:right}
.vt-entete .c{text-align:center}
.vt-ligne{padding:12px 24px;border-top:1px solid var(--bord-ligne);transition:background .15s}
.vt-entete + .vt-ligne{border-top:0}
.vt-ligne.saisi{background:#fbfdf8}
.vt-nom{min-width:0}
.vt-meta{display:block;margin-top:2px;font:400 12.5px var(--police);color:var(--txt-4)}
.vt-semaine{display:flex;align-items:center;gap:12px;min-width:0}
.vt-barre{flex:1;display:flex;height:6px;border-radius:6px;background:var(--track);overflow:hidden}
.vt-avant{height:100%;background:var(--vert-doux)}
.vt-jour{height:100%;width:0;background:var(--vert-primaire);transition:width .15s}
.vt-cumul{min-width:56px;text-align:right;font:400 14px var(--police);color:var(--txt-2)}
.vt-rest{text-align:right;font:400 13px var(--police);color:var(--txt-2);white-space:nowrap}
.vt-rest b{font:600 16px var(--police);color:var(--txt)}
.vt-rest b.bas{color:var(--terra-txt)}
.vt-rest-lbl,.vt-rest-sur,.vt-eur{display:none}
.vt-prix{display:flex;align-items:center;justify-content:flex-end;gap:6px;cursor:text}
.vt-prix input{width:72px;height:40px;padding:0 10px;border:1px solid var(--bord-champ);border-radius:var(--r-champ);background:#fff;
  text-align:right;font:500 15px var(--police);color:var(--txt);font-variant-numeric:tabular-nums}
.vt-prix input:focus{outline:0;border-color:var(--vert-primaire);box-shadow:var(--halo)}
.vt-prix.modifie input{border-color:var(--dore);background:#fdf8ec}
.vt-prix-u{width:34px;font:400 12px var(--police);color:var(--txt-4);white-space:nowrap}
.vt-qte{justify-self:center;display:flex;align-items:center;gap:8px}
.vt-qte button{width:38px;height:38px;border:0;border-radius:50%;background:#f3efe6;cursor:pointer;
  font:400 20px/1 var(--police);color:var(--txt);display:flex;align-items:center;justify-content:center;transition:background .15s}
.vt-qte button:hover{background:#e9e3d6}
.vt-qte input{width:64px;height:40px;border:1px solid var(--bord-champ);border-radius:var(--r-champ);background:#fff;
  text-align:center;font:600 16px var(--police);color:var(--vert-primaire);font-variant-numeric:tabular-nums}
.vt-qte input::placeholder{color:var(--txt-4)}
.vt-qte input:focus{outline:0;border-color:var(--vert-primaire);box-shadow:var(--halo)}
.vt-pied{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px 24px;background:var(--section)}
.vt-resume{font:400 14px var(--police);color:var(--txt-2)}
.vt-resume-ca::before{content:" · "}
.vt-boutons{display:flex;gap:10px}
.vt-enregistrer:disabled{opacity:.45;cursor:default}
.vt-enregistrer:disabled:hover{background:var(--vert-primaire)}
.vt-court{display:none}

@media(max-width:1139px){
  .date-puce{height:40px;padding:0 12px;gap:8px}
  .page-actions{gap:8px}
  .page-actions .store-trigger{min-width:0;height:40px;padding:0 12px}   /* date + magasin sur une ligne */
  /* magasin + bouton (ex. « + Nouvelle ») sur une ligne : le magasin se tronque plutôt que de passer à la ligne */
  .page-actions{min-width:0;max-width:100%}
  .page-actions:has(> .btn),.page-actions:has(> .date-puce){flex-wrap:nowrap}
  .page-actions > .date-puce{flex:none;height:40px}
  .page-actions > .btn{flex:none;height:40px}
  /* Le magasin prend la place restante de la ligne et se tronque (jamais de débordement à droite) */
  .page-actions:has(.store-filter){flex:1 1 100%}
  .page-actions .store-filter{flex:1 1 auto;min-width:0}
  .page-actions .store-trigger{width:100%}
  .date-long{display:none}
  .date-court{display:inline}
  /* Contexte : magasin sur sa ligne, puis semaine | date côte à côte */
  .ctx{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
  .ctx > .store-filter{grid-column:1 / -1;min-width:0}
  .ctx .store-trigger{width:100%}
  .ctx .snav-sep{display:none}
  .ctx-semaine{padding:0 12px;font-size:14px;background:var(--section);border-radius:var(--r-btn);min-width:0}
  .ctx-long{display:none} .ctx-court{display:inline;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ctx .date-choix{height:44px;width:100%;justify-content:space-between}
  .ctx .date-ancre{min-width:0}
  .vt-carte{background:none;box-shadow:none;border-radius:0;overflow:visible}
  .vt-liste{display:flex;flex-direction:column;gap:0}
  .vt-entete{display:none}
  /* Une ligne par produit dans la carte à onglets (séparateurs, comme le Suivi) */
  .vt-ligne{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"nom rest" "semaine semaine" "prix qte";
    gap:12px 10px;padding:14px 16px;border:0;border-top:1px solid var(--bord-ligne);background:#fff}
  .vt-ligne.saisi{background:#fbfdf8}
  .vt-import{padding:22px 16px}
  .vt-nom{grid-area:nom}
  .vt-nom .p-nom{font-weight:600;font-size:16px}
  .vt-semaine{grid-area:semaine}
  .vt-barre{height:4px}
  .vt-cumul{display:none}
  .vt-rest{grid-area:rest;align-self:baseline}
  .vt-rest b{font-size:13px}
  .vt-rest-lbl,.vt-rest-sur{display:inline}
  .vt-prix{grid-area:prix;justify-self:start;height:44px;padding:0 10px 0 12px;gap:4px;
    border:1px solid var(--bord-champ);border-radius:12px;background:#fff}
  .vt-prix:focus-within{border-color:var(--vert-primaire);box-shadow:var(--halo)}
  .vt-prix input{width:52px;height:40px;padding:0;border:0;background:transparent;font-weight:600;font-size:16px}
  .vt-prix input:focus{box-shadow:none}
  .vt-prix.modifie{border-color:var(--dore);background:#fdf8ec}
  .vt-prix.modifie input{background:transparent}
  .vt-prix-u{width:auto;font-size:14px;color:var(--txt-2)}
  .vt-eur{display:inline}
  .vt-qte{grid-area:qte;gap:6px}
  .vt-qte button{width:44px;height:44px;font-size:22px}
  .vt-qte button[data-step="1"]{background:var(--vert-primaire);color:#fff}
  .vt-qte input{width:58px;height:44px;border-radius:12px;font-size:18px}

  /* Barre de synthèse collée en bas (au-dessus de la nav du bas dans l'app installée) */
  .vt-pied{position:fixed;left:0;right:0;bottom:0;z-index:25;flex-wrap:nowrap;gap:12px;
    padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #ece6d8}
  .vt-resume{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
  .vt-resume-n{font:600 15px var(--police);color:var(--txt)}
  .vt-resume-ca{font:400 13px var(--police);color:var(--txt-2)}
  .vt-resume-ca::before{content:none}
  .vt-effacer{display:none}
  .vt-enregistrer{height:52px;padding:0 22px;border-radius:14px;font-size:16px}
  .vt-long{display:none}
  .vt-court{display:inline}
  .content:has(.vt-pied){padding-bottom:calc(110px + env(safe-area-inset-bottom))}
}
@media(max-width:1139px) and (display-mode:standalone){
  .vt-pied{bottom:calc(72px + env(safe-area-inset-bottom));padding-bottom:12px}
  .content:has(.vt-pied){padding-bottom:calc(180px + env(safe-area-inset-bottom))}
}

/* ------------------------------------------------------------
   Mise en place d'une livraison — rangée de tableau (desktop) / carte (mobile)
   ------------------------------------------------------------ */
.liv-layout{display:flex;gap:16px;align-items:flex-start}
.liv-carte{flex:1;min-width:0;overflow:hidden}
.liv-recap{flex:0 0 300px;display:flex;flex-direction:column;gap:14px;position:sticky;top:24px}
.liv-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:16px 20px;border-bottom:1px solid var(--bord-ligne)}
.liv-toolbar-title{font:600 15px var(--police);color:var(--txt)}
.liv-gauche{flex:1;min-width:0;display:flex;flex-direction:column;gap:16px}
.liv-entete,.liv-row{display:grid;align-items:center;gap:12px;
  grid-template-columns:minmax(110px,1.1fr) minmax(80px,.9fr) 196px 150px 150px 56px}
.liv-entete{padding:14px 20px;background:var(--section)}   /* séparateur = bordure haute de la 1re ligne visible */
.liv-entete .c{text-align:center}
.liv-liste.is-empty .liv-entete{display:none}
.liv-row{padding:12px 20px;border-top:1px solid var(--bord-ligne)}
.liv-row:not(.is-selected){display:none !important}
.liv-c-nom{display:flex;align-items:center;gap:10px;min-width:0}
.liv-lbl{display:none}
.liv-pu{display:flex;align-items:center;gap:6px}
.liv-pu .prix{width:72px;flex:none}
.liv-pu select{flex:1;min-width:0}
.liv-eur{font:400 13px var(--police);color:var(--txt-4);white-space:nowrap}
.liv-c-qte{justify-self:center}
.liv-c-qte .vt-qte{gap:6px}
.liv-c-rm{justify-self:end}
.liv-vendu{font:400 12px var(--police);color:var(--txt-4);white-space:nowrap}
/* Reliquat repris : pastille éditable « ↺ [3] / 3 kg × » ; figé en modification */
.liv-c-rep{justify-self:center;min-width:0}
.liv-rep{display:inline-flex;align-items:center;gap:5px;height:38px;padding:0 4px 0 10px;border-radius:10px;
  background:#f2f7ec;border:1px solid #d6e5c8;font:400 12.5px var(--police);color:var(--vert-primaire);white-space:nowrap}
.liv-rep[hidden],.liv-rep-sans[hidden]{display:none}
.liv-rep input{width:44px;height:28px;border:0;border-radius:7px;background:#fff;text-align:center;
  font:600 14px var(--police);color:var(--vert-primaire)}
.liv-rep input:focus{outline:2px solid #cfe0c2}
.liv-rep button{width:24px;height:24px;border:0;border-radius:50%;background:none;cursor:pointer;color:var(--txt-3);font:400 16px/1 var(--police)}
.liv-rep button:hover{background:#e3ecd9}
.liv-rep-fixe{font:500 13px var(--police);color:var(--vert-primaire);white-space:nowrap}
.liv-rep-sans{color:var(--txt-4)}
/* Tableau des reliquats (sous la livraison) */
.liv-reliq{overflow:hidden}
.liv-reliq[hidden]{display:none}
.liv-reliq .liv-toolbar{background:#fbfaf6}
.liv-reliq-st{display:block;margin-top:3px;font:400 12.5px var(--police);color:var(--txt-3)}
.rq-ligne{display:grid;grid-template-columns:minmax(110px,1fr) 170px 100px auto;gap:12px;align-items:center;padding:12px 20px;border-top:1px solid var(--bord-ligne)}
.liv-reliq .liv-toolbar + .rq-ligne{border-top:0}
.rq-ligne[hidden]{display:none}
.rq-reste{font:400 13.5px var(--police);color:var(--txt-3)} .rq-reste b{font-weight:600;color:var(--txt)}
.rq-val{font:400 13px var(--police);color:var(--txt-3);text-align:right}
.rq-vide{padding:16px 20px;font:400 13.5px var(--police);color:var(--txt-3)}
.rq-perte{display:flex;justify-content:space-between;gap:12px;padding:12px 20px;border-top:1px solid var(--bord-ligne);
  background:#fdf6f1;font:400 13px var(--police);color:var(--terra-txt)}
.rq-perte[hidden],.rq-vide[hidden]{display:none}
.rq-perte b{font-weight:600}
.liv-recap-total b{font-size:16px}
.liv-recap-ligne[hidden]{display:none}
.liv-remove{width:30px;height:30px;border:0;border-radius:50%;cursor:pointer;background:var(--section);
  color:var(--txt-3);font:400 18px/1 var(--police);display:flex;align-items:center;justify-content:center;
  transition:background .15s,color .15s}
.liv-remove:hover{background:#f5dcd8;color:#c0392b}
/* État vide : point de départ (icône, titre, actions) ; la barre perd alors ses boutons en double */
.liv-empty{padding:48px 22px 52px;text-align:center;display:flex;flex-direction:column;align-items:center}
.liv-empty[hidden]{display:none}
.liv-empty-ico{width:56px;height:56px;border-radius:50%;background:var(--vert-pale);color:var(--vert-primaire);
  display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.liv-empty h3{margin:0 0 6px;font:600 17px var(--police);color:var(--txt)}
.liv-empty p{margin:0 0 20px;font:400 14px/1.55 var(--police);color:var(--txt-3)}
.liv-empty-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.liv-carte:has(.liv-liste.is-empty) .liv-toolbar .row{display:none}
.liv-aide{margin:-4px 0 0;text-align:center;font:400 12.5px/1.45 var(--police);color:var(--txt-3)}
.liv-aide[hidden]{display:none}
.liv-recap-carte{padding:20px}
.liv-recap-carte h2{margin:0 0 14px;font:600 15px var(--police)}
.liv-recap-ligne{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid var(--bord-ligne);
  font:400 14px var(--police);color:var(--txt-2)}
.liv-recap-ligne b{font-weight:600;color:var(--txt)}
.liv-semaine{display:flex;flex-direction:column;gap:7px;margin-bottom:14px}
.liv-lbl-semaine{font:500 13px var(--police);color:var(--txt)}
.liv-semaine .date-puce{width:100%}
.liv-note{margin-top:14px}
.liv-note:empty{display:none}
.liv-note.alerte{background:var(--terra-clair);color:var(--terra-txt)}
.liv-recap .btn:disabled{opacity:.45;cursor:default}

@media(max-width:1139px){
  .liv-layout{flex-direction:column;align-items:stretch}
  /* Ordre mobile : semaine + récap, produits, puis Valider en bas */
  .liv-recap{display:contents}
  .liv-gauche{display:contents}
  .liv-recap-carte{order:0}
  .liv-carte,.liv-reliq{order:1}
  .liv-recap > .btn{order:2;height:52px;border-radius:14px;font-size:16px}
  .liv-carte{background:none;box-shadow:none;border-radius:0;overflow:visible}
  .liv-toolbar{padding:0 0 12px;border:0}
  .liv-entete{display:none}
  .liv-liste{display:flex;flex-direction:column;gap:10px}
  .liv-row{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"nom rm" "origine origine" "pu pu" "qte qte" "rep rep";
    gap:12px 10px;padding:14px 14px 14px 16px;border:0;background:#fff;border-radius:16px;box-shadow:var(--ombre)}
  .liv-c-nom{grid-area:nom}
  .liv-c-nom .p-nom{font-weight:600;font-size:16px}
  .liv-c-origine{grid-area:origine}
  .liv-c-pu{grid-area:pu;min-width:0}
  .liv-c-qte{grid-area:qte;justify-self:stretch;flex-direction:row !important;align-items:center;justify-content:space-between}
  .liv-c-rm{grid-area:rm}
  .liv-c-rep{grid-area:rep;justify-self:stretch;display:flex;align-items:center;justify-content:space-between;gap:10px}
  .liv-c-rep.sans-rep,.liv-c-rep:has(> .liv-rep[hidden]):not(:has(.liv-rep-fixe)){display:none}
  .liv-reliq{border-radius:16px}
  .rq-ligne{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"nom act" "reste val";gap:6px 10px;padding:12px 16px}
  .rq-ligne > .liv-c-nom{grid-area:nom} .rq-ligne > .rq-reste{grid-area:reste} .rq-ligne > .rq-val{grid-area:val} .rq-ligne > .btn{grid-area:act}
  .liv-reliq .liv-toolbar{padding:14px 16px;flex-wrap:wrap}
  .liv-c-origine,.liv-c-pu,.liv-c-qte{display:flex;flex-direction:column;gap:6px}
  .liv-lbl{display:block;font:500 12px var(--police);color:var(--txt-3)}
  .liv-row .cell-input{height:44px;border-radius:12px;font-size:16px}
  .liv-pu .prix{width:84px}
  .liv-c-qte .vt-qte button[data-step="1"]{background:var(--vert-primaire);color:#fff}
  .liv-empty{background:#fff;border-radius:16px;box-shadow:var(--ombre);padding:32px 18px 22px}
  .liv-empty p br{display:none}
  .liv-empty-actions{flex-direction:column;align-self:stretch}
  .liv-empty-actions .btn{width:100%}
  .liv-recap > .liv-aide{order:3}
}

/* ------------------------------------------------------------
   Journal — matrice produit × jours, défilement horizontal + colonne Produit figée
   ------------------------------------------------------------ */
.jr-carte{overflow:hidden}
.jr-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.jr-table{min-width:600px}
.jr-ligne{display:grid;grid-template-columns:var(--jr-cols);gap:8px;align-items:center;padding:12px 20px;border-top:1px solid var(--bord-ligne)}
.jr-entete{padding:14px 20px;background:var(--section);border-top:0;border-bottom:1px solid var(--bord-entete)}
.jr-entete + .jr-ligne{border-top:0}
.jr-ligne .c{text-align:center}
.jr-ligne .r{text-align:right}
.jr-produit{position:sticky;left:0;z-index:1;min-width:0;background:inherit}
.jr-ligne:not(.jr-entete):not(.jr-pied){background:#fff}
.jr-val{font-weight:600}
.jr-futur{color:#c2c3b6}
.jr-auj{background:#eef4ea;border-radius:6px}
.jr-total{font:600 15px var(--police);color:var(--txt)}
.jr-ca{font:600 13px var(--police);color:var(--txt);white-space:nowrap}
.jr-pied{background:var(--section)}
.jr-ca-total{color:var(--dore-fonce)}
.jr-vide{padding:28px;text-align:center}
.jr-vide p{margin:0}
@media(max-width:1139px){
  .jr-ligne{padding:12px 14px}
  .jr-produit{box-shadow:8px 0 8px -8px rgba(60,45,15,.18)}
}

/* ------------------------------------------------------------
   Navigation entre livraisons : sélecteur + frise (docs/propositions/navigation-semaines.html, D)
   Changer de semaine se fait des dizaines de fois par jour : retours courts (≤ 200ms),
   ease-out marqué, aucune animation au clavier.
   ------------------------------------------------------------ */
:root{--ease-out:cubic-bezier(0.23,1,0.32,1);--ease-drawer:cubic-bezier(0.32,0.72,0,1)}
.snav{display:flex;flex-direction:column;gap:14px}   /* posé sur le fond de page, sans carte */
.snav-haut{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.snav-fleche{width:44px;height:44px;flex:none;display:flex;align-items:center;justify-content:center;
  border:1px solid var(--bord-champ);border-radius:12px;background:#fff;color:var(--txt);transition:transform 160ms var(--ease-out)}
a.snav-fleche:active{transform:scale(.94)}
.snav-fleche[aria-disabled]{opacity:.35}
.snav-ancre{position:relative;min-width:0}
.snav-btn{height:44px;max-width:100%;display:flex;align-items:center;gap:10px;padding:0 14px 0 16px;cursor:pointer;
  border:1px solid var(--bord-champ);border-radius:12px;background:#fff;font:600 16px var(--police);color:var(--txt);
  white-space:nowrap;transition:transform 160ms var(--ease-out)}
.snav-btn:active{transform:scale(.98)}
.snav-lib{overflow:hidden;text-overflow:ellipsis}
.snav-chev{flex:none;color:var(--txt-2);transition:transform 200ms var(--ease-out)}
.snav-btn[aria-expanded="true"] .snav-chev{transform:rotate(180deg)}
.snav-sep{color:var(--txt-4);font:400 20px/1 var(--police);margin:0 2px}
.snav-haut .store-trigger{min-width:0}
.snav-lib-court{display:none}
@media (hover:hover) and (pointer:fine){
  a.snav-fleche:hover,.snav-btn:hover{background:var(--survol)}
}
/* Liste complète : s'ouvre depuis le bouton (origine en haut à gauche), sortie plus rapide que l'entrée */
.snav-menu{position:absolute;top:calc(100% + 8px);left:0;z-index:40;width:360px;max-height:380px;overflow:auto;padding:6px;
  background:#fff;border:1px solid var(--bord-entete);border-radius:16px;box-shadow:var(--ombre-menu);
  transform-origin:top left;opacity:0;transform:scale(.96) translateY(-4px);pointer-events:none;visibility:hidden;
  transition:opacity 140ms var(--ease-out),transform 140ms var(--ease-out),visibility 0s linear 140ms}
.snav-menu.ouvert{opacity:1;transform:none;pointer-events:auto;visibility:visible;
  transition:opacity 200ms var(--ease-out),transform 200ms var(--ease-out),visibility 0s}
.snav-menu-titre{padding:8px 10px 6px;font:600 11px var(--police);color:var(--th);letter-spacing:.06em;text-transform:uppercase}
.snav-item{display:grid;grid-template-columns:auto 1fr auto;gap:4px 12px;align-items:center;padding:10px;border-radius:10px}
.snav-item:hover{background:var(--section)}
.snav-item.on{background:#eef4ea}
.snav-item-t{font:600 14px var(--police);color:var(--txt)}
.snav-item-e{font:400 13px var(--police);color:var(--txt-2)}
.snav-item-b{grid-column:2 / 4;height:4px;border-radius:4px;background:var(--track);overflow:hidden}
.snav-item-b i{display:block;height:100%;border-radius:4px}

/* Frise : tuiles de largeur égale, uniquement des tuiles entières (largeur posée par app.js) */
.frise{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:2px 0 4px;scrollbar-width:none}
.frise::-webkit-scrollbar{display:none}
.tuile,.tuile-trou-long{flex:0 0 var(--tuile-w,96px);min-width:0;scroll-snap-align:start;border-radius:14px}
.tuile{display:flex;flex-direction:column;gap:6px;padding:10px 12px;background:#fff;border:1px solid var(--bord-entete);
  box-shadow:0 1px 2px rgba(60,45,15,.05);transition:transform 160ms var(--ease-out),background-color 180ms ease,border-color 180ms ease}
.tuile:active{transform:scale(.96)}
.t-s{font:600 13px var(--police);color:var(--txt)}
.t-d{font:400 12px var(--police);color:var(--txt-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.t-p{font:600 12px var(--police);color:var(--txt-2)}
.t-b{height:4px;border-radius:4px;background:var(--track);overflow:hidden}
.t-b i{display:block;height:100%;border-radius:4px}
.tuile-encours{border:1.5px solid var(--vert-doux)}
.tuile-avenir{background:#f3f6fa;border:1px dashed #b9c6da;box-shadow:none}
.tuile-avenir .t-p{color:#43618a}
.tuile.on{background:var(--vert-profond);border-color:var(--vert-profond)}
.tuile.on .t-s,.tuile.on .t-d,.tuile.on .t-p{color:#fff}
.tuile.on .t-b{background:rgba(255,255,255,.2)}
/* Semaine sans livraison : case vide hachurée */
.tuile-trou,.tuile-trou-long{box-shadow:none;border:1px dashed #d6cfbd;background:repeating-linear-gradient(135deg,#faf8f3 0 7px,#f1ede3 7px 8px)}
.tuile-trou .t-s,.tuile-trou .t-d{color:var(--txt-4)}
.tuile-trou .t-p{margin-top:auto;color:var(--vert-primaire)}
.tuile-trou-long{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:8px;text-align:center;
  font:400 11px/1.3 var(--police);color:var(--txt-3)}
.tuile-trou-long b{font:600 12px var(--police);color:var(--txt-2)}
.t-points{font:600 16px var(--police);letter-spacing:.1em}
@media (hover:hover) and (pointer:fine){
  .tuile:not(.on):hover{border-color:var(--vert-doux)}
  .tuile-trou:hover{background:#fff}
}
/* ------------------------------------------------------------
   Carte de la livraison (inc/views/deliverycard.php) + menu « ⋯ » + onglets Suivi/Journal
   Maquette : docs/propositions/livraisons-entete.html
   ------------------------------------------------------------ */
.livc{padding:22px 24px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 32px;align-items:end}
.livc-chiffres{display:flex;align-items:flex-end;gap:12px 44px;flex-wrap:wrap;min-width:0}
.livc-ch{display:flex;flex-direction:column;gap:4px}
.livc-ch .l{font:500 13px var(--police);color:var(--txt-3)}
.livc-ch .v{font:600 22px/1.1 var(--police);letter-spacing:-.02em;color:var(--txt);white-space:nowrap}
.livc-ch .s{font:400 12.5px var(--police);color:var(--txt-3)}
.livc-principal .v{font-size:40px;letter-spacing:-.03em}
.livc-actions{display:flex;gap:8px;align-items:center}
.btn-icone{width:44px;padding:0}
.livc-avance{grid-column:1 / -1}
.livc-piste{height:8px;border-radius:6px;background:var(--track);overflow:hidden}
.livc-piste i{display:block;height:100%;background:var(--vert-primaire);border-radius:0 6px 6px 0}
.livc-avance-l{display:flex;justify-content:space-between;gap:4px 12px;flex-wrap:wrap;margin-top:8px;font:500 12.5px var(--police);color:var(--txt-2)}
.livc-note{margin:8px 0 0;font:400 12.5px var(--police);color:var(--dore-fonce)}

.menu-plus{position:relative}
.menu-plus-liste{position:absolute;right:0;top:calc(100% + 6px);z-index:40;min-width:220px;padding:6px;background:#fff;
  border:1px solid var(--bord-entete);border-radius:14px;box-shadow:var(--ombre-menu);
  transform-origin:top right;opacity:0;transform:scale(.97);visibility:hidden;pointer-events:none;
  transition:opacity 150ms var(--ease-out),transform 150ms var(--ease-out),visibility 0s linear 150ms}
.menu-plus.ouvert .menu-plus-liste{opacity:1;transform:none;visibility:visible;pointer-events:auto;
  transition:opacity 150ms var(--ease-out),transform 150ms var(--ease-out),visibility 0s}
.menu-plus-liste a,.menu-plus-liste button{display:flex;align-items:center;width:100%;height:42px;padding:0 12px;border:0;border-radius:10px;
  background:none;cursor:pointer;text-align:left;font:500 14px var(--police);color:var(--txt)}
.menu-plus-liste a:hover,.menu-plus-liste button:hover{background:var(--section)}
.menu-plus-liste .danger{color:var(--terra-txt)}
.menu-plus-liste hr{border:0;border-top:1px solid var(--bord-ligne);margin:4px 6px}

.onglets-carte{overflow:hidden}
.onglets{display:flex;gap:4px;padding:8px 14px 0;border-bottom:1px solid var(--bord-entete)}
.onglets a{display:flex;align-items:center;height:42px;padding:0 14px;margin-bottom:-1px;border-bottom:2px solid transparent;
  font:500 14px var(--police);color:var(--txt-2)}
.onglets a:hover{color:var(--txt)}
.onglets a.on{color:var(--txt);font-weight:600;border-bottom-color:var(--vert-primaire)}
/* Le contenu des onglets n'a pas sa propre carte : il est dans .onglets-carte */
.onglets-carte .rv-liste,.onglets-carte .card{background:none;box-shadow:none;border:0;border-radius:0}
.onglets-carte .rv-entete{background:none}

@media(max-width:1139px){
  .livc{grid-template-columns:minmax(0,1fr);padding:18px;gap:14px}
  .livc-chiffres{gap:12px 22px}
  .livc-principal{flex:1 1 100%}
  .livc-ch .v{font-size:18px}
  .livc-principal .v{font-size:36px}
  /* Actions collées en bas de l'écran ; le menu « ⋯ » s'ouvre vers le haut */
  .livc-actions{position:fixed;left:16px;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:25}
  .livc-actions > .btn{flex:1;height:54px;border-radius:16px;font-size:16px;box-shadow:0 8px 24px rgba(23,71,42,.25)}
  .livc-actions .btn-icone{width:54px;height:54px;border-radius:16px;box-shadow:0 8px 24px rgba(40,30,10,.12)}
  .menu-plus-liste{top:auto;bottom:calc(100% + 8px);transform-origin:bottom right}
  .content:has(.livc-actions){padding-bottom:calc(96px + env(safe-area-inset-bottom))}
  .onglets{padding:4px 8px 0}
  .onglets a{flex:1;justify-content:center}
}
@media(max-width:1139px) and (display-mode:standalone){
  .livc-actions{bottom:calc(84px + env(safe-area-inset-bottom))}
  .content:has(.livc-actions){padding-bottom:calc(160px + env(safe-area-inset-bottom))}
}

@media(max-width:1139px){
  .snav-haut{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:8px}
  .snav-btn{width:100%;justify-content:space-between;gap:8px;padding:0 10px 0 12px;font-size:15px}
  .snav-btn .wk-badge,.snav-btn .chip{display:none}   /* le statut est déjà sur la tuile choisie */
  /* magasin sur sa ligne puis ‹ semaine › ; sans flèches : magasin | semaine côte à côte */
  .snav-haut > .store-filter{grid-column:1 / -1;min-width:0}
  .snav-haut .store-trigger{width:100%;height:44px}
  .snav-sep{display:none}
  .snav-haut.sans-fleches{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .snav-haut.sans-fleches > .store-filter{grid-column:auto}
  .snav-lib-long{display:none} .snav-lib-court{display:inline}
  .lib-long{display:none}                 /* « + Nouvelle » dans l'en-tête mobile */
  /* Liste complète : panneau qui monte du bas, fond assombri */
  .snav-menu{position:fixed;left:0;right:0;top:auto;bottom:0;width:auto;max-height:70vh;border-radius:20px 20px 0 0;
    padding-bottom:calc(6px + env(safe-area-inset-bottom));transform-origin:bottom center;transform:translateY(100%);opacity:1;
    transition:transform 220ms var(--ease-drawer),visibility 0s linear 220ms}
  .snav-menu.ouvert{transform:none;box-shadow:0 0 0 100vmax rgba(20,30,15,.35),var(--ombre-menu);
    transition:transform 300ms var(--ease-drawer),visibility 0s}
}
@media (prefers-reduced-motion:reduce){
  .snav-menu,.snav-menu.ouvert,.tuile,.snav-fleche,.snav-btn{transition-property:opacity,visibility}
  .frise{scroll-behavior:auto}
}

/* Sélecteur de semaines (nouvelle livraison) : liste de semaines, pas de jours.
   Réutilise le popover / panneau mobile de la navigation (.snav-menu). */
.sempick-btn{width:100%;cursor:pointer;justify-content:flex-start}
.sempick-btn [data-semaine-lib]{flex:1;text-align:left}
.sempick-menu{left:auto;right:0;width:340px;transform-origin:top right}
.sempick-item{width:100%;border:0;background:none;cursor:pointer;text-align:left;font-family:inherit}
.sempick-item.courante .snav-item-e{color:var(--vert-primaire);font-weight:600}
.sempick-item.pris{opacity:.45;cursor:not-allowed}
.sempick-item.pris:hover{background:none}
.sempick-menu .snav-menu-titre{position:sticky;top:-6px;z-index:1;background:#fff;padding-top:10px}
@media(max-width:1139px){
  .sempick-menu{left:0;right:0;width:auto;transform-origin:bottom center}   /* panneau du bas, comme la frise */
}

/* ------------------------------------------------------------
   Tableau de bord (index.php) — proposition B, héros vert.
   Maquette : docs/propositions/tableau-de-bord.html ; graphiques dessinés par app.js ([data-tdb]).
   ------------------------------------------------------------ */
.tdb-filtres{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.tdb-filtres .segmented{max-width:100%;overflow-x:auto;scrollbar-width:none}
.tdb-filtres .segmented a{white-space:nowrap}
.tdb-filtres .lib-court{display:none}
.tdb{display:flex;flex-direction:column;gap:18px}
.tdb-haut{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:18px}
.tdb-heros{display:flex;flex-direction:column;padding:22px 24px 18px;border-radius:var(--r-carte);background:var(--vert-profond);color:#fff;min-width:0}
.tdb-heros-l{font:500 13px var(--police);color:rgba(255,255,255,.7)}
.tdb-heros-v{margin:10px 0;font:600 52px/1 var(--police);letter-spacing:-.035em;color:var(--jaune-clair)}
.tdb-delta{align-self:flex-start;display:inline-flex;padding:3px 10px;border-radius:20px;font:600 13px var(--police);background:rgba(255,255,255,.12);color:#fff}
.tdb-spark{margin-top:auto;padding-top:20px;height:68px}
.tdb-spark svg{display:block;overflow:visible}
.tdb-spark-l{display:flex;justify-content:space-between;margin-top:8px;font:500 12.5px var(--police);color:rgba(255,255,255,.7)}
.tdb-tuiles{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tdb-tuile{display:flex;flex-direction:column;gap:6px;padding:14px 16px;border:1px solid var(--bord-ligne);border-radius:16px;background:#fff;box-shadow:var(--ombre);min-width:0}
.tdb-tuile .l{font:500 12.5px var(--police);color:var(--txt-3)}
.tdb-tuile .v{font:600 24px/1.15 var(--police);letter-spacing:-.02em;color:var(--txt)}
.tdb-tuile .d{font:500 12px var(--police);color:var(--txt-2)}
.tdb-note{margin:-6px 0 0;font:400 12.5px var(--police);color:var(--txt-3)}
.tdb-graphes{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.tdb-carte{padding:20px 22px;min-width:0}
.tdb-carte-h{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}
.tdb-carte-h h2{margin:0;font:600 15px var(--police)}
.tdb-carte-h p{margin:3px 0 0;font:400 12.5px/1.4 var(--police);color:var(--txt-3)}
.tdb-vue{flex:none;height:28px;padding:0 10px;border:0;border-radius:8px;background:var(--section);cursor:pointer;font:500 12px var(--police);color:var(--txt-2);
  transition:transform 160ms var(--ease-out)}
.tdb-vue:active{transform:scale(.97)}
.tdb-legende{display:flex;flex-wrap:wrap;gap:6px 16px;margin:-2px 0 10px;font:500 12.5px var(--police);color:var(--txt-2)}
.tdb-legende span{display:inline-flex;align-items:center;gap:7px}
.cle-r{display:inline-block;width:10px;height:10px;border-radius:3px}
.tdb-chart{position:relative;width:100%}
.tdb-chart svg{display:block;overflow:visible}
.tdb-chart text{font-family:var(--police);font-size:11px;fill:var(--txt-3)}
.tdb-chart .lab{font-weight:600;font-size:12px;fill:var(--txt)}
.tdb-chart .hit{fill:transparent;outline:none}
.tdb-chart .hit:focus-visible{fill:rgba(47,109,63,.06)}
.tdb-chart .col{transition:opacity 150ms ease}
.tdb-chart.survol .col{opacity:.45}
.tdb-chart.survol .col.on{opacity:1}
.tdb-tvue{width:100%;border-collapse:collapse;font:400 13px var(--police)}
.tdb-tvue th{position:sticky;top:0;background:#fff;padding:8px 10px;border-bottom:1px solid var(--bord-entete);text-align:right;font:500 12px var(--police);color:var(--txt-3)}
.tdb-tvue td{padding:8px 10px;border-bottom:1px solid var(--bord-ligne);text-align:right;font-variant-numeric:tabular-nums}
.tdb-tvue th:first-child,.tdb-tvue td:first-child{text-align:left}
.tdb-defile{max-height:238px;overflow:auto}
/* Infobulle unique des graphiques */
.tdb-tt{position:fixed;z-index:150;left:0;top:0;min-width:150px;padding:10px 12px;border:1px solid var(--bord-entete);border-radius:12px;background:#fff;
  box-shadow:0 10px 28px rgba(40,30,10,.14);pointer-events:none;opacity:0;transform:scale(.97);transform-origin:bottom left;
  transition:opacity 125ms var(--ease-out),transform 125ms var(--ease-out)}
.tdb-tt.on{opacity:1;transform:none}
.tdb-tt.instant{transition-duration:0ms}
.tdb-tt-t{margin-bottom:6px;font:500 12px var(--police);color:var(--txt-3)}
.tdb-tt-r{display:flex;align-items:center;gap:8px;margin-top:3px;font:400 12.5px var(--police);color:var(--txt-2)}
.tdb-tt-r b{font:600 13.5px var(--police);color:var(--txt);font-variant-numeric:tabular-nums}
.tdb-tt-r .cle-l{flex:none;width:14px;height:2px;border-radius:1px}
/* Produits */
.tdb-ptab-scroll{overflow-x:auto}
.tdb-ptab{width:100%;border-collapse:collapse}
.tdb-ptab th{padding:0 10px 10px;border-bottom:1px solid var(--bord-entete);text-align:right;white-space:nowrap;font:500 12px var(--police);color:var(--txt-3)}
.tdb-ptab th button{padding:0;border:0;background:none;cursor:pointer;font:inherit;color:inherit}
.tdb-ptab th button[aria-sort]{color:var(--txt);font-weight:600}
.tdb-ptab td{padding:10px;border-bottom:1px solid var(--bord-ligne);text-align:right;white-space:nowrap;font:500 13.5px var(--police);vertical-align:middle}
.tdb-ptab th:first-child,.tdb-ptab td:first-child{padding-left:0;text-align:left}
.tdb-ptab tr:last-child td{border-bottom:0}
.p-nom-l{display:inline-flex;align-items:center;gap:8px;font-weight:600}
.tdb-taux{display:inline-flex;align-items:center;justify-content:flex-end;gap:10px}
.tdb-taux .trk{width:120px;height:8px;flex:none}
.tdb-taux b{width:44px;font-weight:600}
.tdb-insight{display:flex;align-items:center;gap:9px;margin-top:14px;padding:11px 13px;border-radius:11px;background:var(--dore-clair);font:400 12.5px/1.4 var(--police);color:#8a7320}
.tdb-insight i{flex:none;width:7px;height:7px;border-radius:50%;background:var(--dore)}
.tdb-vide{padding:36px 24px;text-align:center}
.tdb-vide h2{margin:0 0 6px;font:600 17px var(--police)}
.tdb-vide p,.tdb-vide-p{margin:0 0 16px;font:400 14px/1.5 var(--police);color:var(--txt-3)}
@media(max-width:1139px){
  .tdb-filtres .segmented{width:100%}
  .tdb-filtres .segmented a{flex:1 1 0;justify-content:center;padding:0 8px}
  .tdb-filtres .lib-long{display:none}
  .tdb-filtres .lib-court{display:inline}
  .tdb-haut,.tdb-graphes{grid-template-columns:minmax(0,1fr);gap:14px}
  .tdb{gap:14px}
  .tdb-heros{padding:18px}
  .tdb-heros-v{font-size:42px}
  .tdb-tuiles{gap:10px}
  .tdb-tuile{padding:12px 14px}
  .tdb-tuile .v{font-size:20px}
  .tdb-carte{padding:16px}
  .tdb-ptab .m-cache{display:none}
  .tdb-taux .trk{width:64px}
}