/* Caisse BADSI — style dashboard doux (périwinkle + crème + pastels) */
:root{
  --bg:#a7a2f5;--side:#8e88ee;--cream:#fbf6f2;--panel:#fff;--panel2:#f2edfd;--line:#ece6f7;
  --text:#1c1a4b;--mute:#807da3;--accent:#7a5af0;--accent2:#6a4be3;--pink:#ff8fb4;--yellow:#ffc857;--green:#5bc48a;--blue:#6ea8ff;
  --ok:#2fa56b;--warn:#e89a10;--bad:#e5484d;
  --shadow:0 10px 28px rgba(106,90,205,.12);--shadow-s:0 4px 14px rgba(106,90,205,.10);
}
*{box-sizing:border-box}
html,body{margin:0}
body{min-height:100vh;padding:16px;background:linear-gradient(160deg,#b6b2fb 0%,#a29df4 100%) fixed;color:var(--text);
  font:15px/1.45 "Plus Jakarta Sans",Inter,"Segoe UI",system-ui,sans-serif}
a{color:var(--accent);text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;border-radius:999px;font-weight:700;background:var(--panel2);padding:10px 18px;transition:.15s}
button:hover{filter:brightness(1.05)}
button:active{transform:scale(.97)}
button:disabled{opacity:.45;cursor:not-allowed}
.btn-primary{background:linear-gradient(135deg,#8b6cf6,#6a4be3);color:#fff;box-shadow:0 8px 18px rgba(106,75,227,.32)}
.btn-ok{background:linear-gradient(135deg,#43c488,#2fa56b);color:#fff;box-shadow:0 8px 18px rgba(47,165,107,.28)}
.btn-bad{background:var(--bad);color:#fff}
.btn-ghost{background:#fff;border:1.5px solid var(--line);color:var(--text)}
input,select,textarea{background:#faf8ff;border:1.5px solid var(--line);border-radius:16px;padding:10px 14px;width:100%}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 4px rgba(122,90,240,.14)}
.mute{color:var(--mute)}
.ic{width:20px;height:20px;flex:none}
.err{color:var(--bad);font-size:13px;margin-top:6px}
.flash{background:#e8f8f0;border:1px solid #bfe9d3;padding:12px 16px;border-radius:16px;margin-bottom:14px}

/* ===== Structure ===== */
.app{display:grid;grid-template-columns:260px 1fr;gap:16px;height:calc(100vh - 32px)}
.side{background:linear-gradient(180deg,#9690f1,#867fea);border-radius:32px;padding:22px 16px 18px;display:flex;flex-direction:column;gap:14px;color:#fff;box-shadow:var(--shadow);overflow:auto}
.brand{text-align:center}
.logo{width:92px;height:92px;margin:0 auto 8px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 10px 22px rgba(60,50,160,.25),inset 0 -4px 8px #efe9ff}
.bname{font-size:22px;font-weight:800}
.bhi{opacity:.9;font-size:15px}
.menu{display:grid;gap:6px;margin-top:6px}
.menu a{display:flex;align-items:center;gap:14px;padding:13px 18px;border-radius:999px;color:#fff;font-weight:600;position:relative;transition:.15s}
.menu a:hover{background:rgba(255,255,255,.18)}
.menu a.on{background:#fff;color:var(--accent);box-shadow:0 8px 18px rgba(60,50,160,.22)}
.badge{margin-left:auto;background:var(--pink);color:#fff;font-size:12px;font-weight:800;min-width:24px;height:24px;border-radius:12px;display:grid;place-items:center;padding:0 7px}
.badge.ok{background:var(--green)}
.sidecard{margin-top:auto;background:linear-gradient(160deg,#ffd0dc,#ffc3b3);border-radius:24px;padding:18px;text-align:center;color:#4a2a4f;box-shadow:var(--shadow-s)}
.sc-t{font-weight:700;opacity:.8}
.sc-v{font-size:26px;font-weight:800;margin:2px 0}
.sc-s{font-size:13px;opacity:.8;margin-bottom:12px}
.sc-btn{display:inline-block;background:#ff7aa5;color:#fff;font-weight:700;padding:8px 20px;border-radius:999px;box-shadow:0 6px 14px rgba(255,122,165,.4)}
.side form{margin:0}
.logout{width:100%;display:flex;align-items:center;gap:12px;justify-content:center;background:rgba(255,255,255,.16);color:#fff}
.main{background:var(--cream);border-radius:32px;box-shadow:var(--shadow);display:flex;flex-direction:column;min-width:0;overflow:hidden}
.topbar{display:flex;align-items:center;gap:16px;padding:22px 30px 10px}
.topbar h1{margin:0;font-size:32px;font-weight:800;letter-spacing:-.02em}
.sp{flex:1}
.search{flex:1;max-width:440px;display:flex;align-items:center;gap:10px;background:#fff;border-radius:999px;padding:0 18px;box-shadow:var(--shadow-s);color:var(--mute)}
.search input{border:0;background:transparent;box-shadow:none!important;padding:12px 0}
.roundbtn{position:relative;width:46px;height:46px;border-radius:50%;background:#fff;display:grid;place-items:center;color:var(--accent);box-shadow:var(--shadow-s);flex:none}
.roundbtn.avatar{background:linear-gradient(135deg,#9a7cf8,#7a5af0);color:#fff}
.dot{position:absolute;top:-4px;right:-4px;background:var(--pink);color:#fff;font-style:normal;font-size:11px;font-weight:800;min-width:20px;height:20px;border-radius:10px;display:grid;place-items:center}
.content{flex:1;min-height:0;overflow:auto;padding:8px 30px 30px}
.solo{background:var(--cream);border-radius:32px;min-height:calc(100vh - 32px);box-shadow:var(--shadow);overflow:hidden}

/* ===== Cartes génériques ===== */
.card{background:var(--panel);border-radius:24px;padding:20px;box-shadow:var(--shadow-s),inset 0 2px 0 #fff;border:1px solid var(--line)}
.card h3{margin:0 0 12px;font-size:17px;font-weight:800}
.grid{display:grid;gap:16px}
.kpis{grid-template-columns:repeat(4,1fr)}
@media(max-width:1250px){.kpis{grid-template-columns:repeat(2,1fr)}}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:900px){.two{grid-template-columns:1fr}}
.pill{display:inline-block;background:var(--panel2);color:var(--accent);padding:5px 12px;border-radius:999px;font-size:13px;font-weight:700}
table.t{width:100%;border-collapse:collapse}
.t th,.t td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)}
.t th{color:var(--mute);font-weight:600;font-size:13px}

/* ===== Caisse ===== */
.pos{display:grid;grid-template-columns:1fr 350px;gap:20px;height:100%}
.pos-main{display:flex;flex-direction:column;min-width:0;min-height:0}
.bar{display:flex;gap:10px;padding:2px 0 14px;overflow-x:auto;scrollbar-width:none;flex:none}
.bar::-webkit-scrollbar{display:none}
.bar button{white-space:nowrap;background:#fff;border:1.5px solid var(--line);box-shadow:var(--shadow-s);padding:7px 16px}
.bar button.on{background:linear-gradient(135deg,#8b6cf6,#6a4be3);color:#fff;border-color:transparent}
.bar button.catbtn{background:color-mix(in srgb,var(--c) 16%,#fff);border:1.5px solid color-mix(in srgb,var(--c) 38%,#fff)}
.bar button.catbtn.on{background:var(--c);border-color:var(--c);color:#fff}
.bar #tableBtn{background:linear-gradient(135deg,#8b6cf6,#6a4be3);color:#fff;border:0}
.bar #payBtn{background:linear-gradient(135deg,#43c488,#2fa56b);color:#fff;border:0;margin-left:auto}
.products{flex:1;min-height:0;overflow:auto;padding:4px 4px 10px;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;align-content:start}
.prod{--c:#8b6cf6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:58px;padding:9px 10px;text-align:center;border-radius:16px;
  background:linear-gradient(160deg,color-mix(in srgb,var(--c) 20%,#fff),color-mix(in srgb,var(--c) 10%,#fff));
  border:1.5px solid color-mix(in srgb,var(--c) 22%,#fff);box-shadow:0 10px 22px color-mix(in srgb,var(--c) 18%,transparent),inset 0 2px 0 #fff;color:var(--text)}
.prod:hover{transform:translateY(-3px);filter:none;border-color:var(--c)}
.prod .n{font-weight:800}
.prod .p{font-weight:800;color:color-mix(in srgb,var(--c) 75%,#1c1a4b)}
.cart{background:#fff;border-radius:28px;box-shadow:var(--shadow),inset 0 2px 0 #fff;border:1px solid var(--line);display:flex;flex-direction:column;min-height:0;overflow:hidden}
.cart h2{margin:0;padding:18px 20px 8px;font-size:18px;font-weight:800;display:flex;justify-content:space-between;align-items:center}
.lines{flex:1;overflow:auto;padding:0 16px}
.line{display:flex;align-items:center;gap:10px;padding:11px 4px;border-bottom:1px solid var(--line)}
.line .nm{flex:1;min-width:0;font-weight:700}
.line .qty{display:flex;align-items:center;gap:8px}
.line .qty button{width:32px;height:32px;padding:0;border-radius:50%;background:var(--panel2);color:var(--accent);font-size:18px;line-height:1}
.cart-foot{padding:16px 20px 20px;display:grid;gap:12px;border-top:1px solid var(--line);background:linear-gradient(180deg,#fff,#faf7ff)}
.total{display:flex;justify-content:space-between;font-size:24px;font-weight:800}
#sendBtn{padding:16px;font-size:16px;border-radius:20px}
.modal{position:fixed;inset:0;background:rgba(40,30,110,.45);backdrop-filter:blur(3px);display:none;place-items:center;z-index:50;padding:16px}
.modal.open{display:grid}
.modal .box{background:var(--cream);border-radius:28px;padding:22px;max-width:780px;width:100%;max-height:88vh;overflow:auto;box-shadow:0 30px 70px rgba(30,20,100,.4)}
.tables{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px}
.tables button{background:#fff;border:1.5px solid var(--line);border-radius:18px;padding:14px 8px;box-shadow:var(--shadow-s)}
.tables button.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.open-order{display:grid;gap:10px;padding:16px;border-radius:20px;background:#fff;border:1px solid var(--line);margin-bottom:12px;box-shadow:var(--shadow-s)}
.open-order .row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
#notifs{position:fixed;top:24px;right:24px;display:grid;gap:10px;z-index:60;width:min(360px,calc(100vw - 32px))}
.notif{display:flex;justify-content:space-between;align-items:center;gap:12px;background:linear-gradient(135deg,#43c488,#2fa56b);color:#fff;padding:14px 16px;border-radius:20px;font-size:17px;box-shadow:0 12px 30px rgba(47,165,107,.4);animation:pop .3s}
.notif button{background:#fff;color:var(--ok);padding:7px 16px}
@keyframes pop{from{transform:translateX(30px);opacity:0}}
.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);background:var(--accent);color:#fff;padding:12px 22px;border-radius:999px;font-weight:700;z-index:99;opacity:0;pointer-events:none;transition:.25s;box-shadow:0 12px 28px rgba(106,75,227,.4)}
.toast.show{opacity:1}
.toast.bad{background:var(--bad)}

/* ===== Cuisine ===== */
.k-head{display:flex;gap:12px;align-items:center;padding:22px 30px 10px;flex-wrap:wrap}
.k-head h1{margin:0;font-size:30px;font-weight:800;letter-spacing:-.02em}
.k-board{padding:14px 30px 20px;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px;align-content:start}
.ticket-k{background:#fff;border:2px solid var(--line);border-radius:24px;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow)}
.ticket-k.late{border-color:#f6c768}
.ticket-k.vlate{border-color:#f08a8f}
.ticket-k.fresh{animation:flash 1.2s 2}
@keyframes flash{50%{box-shadow:0 0 0 6px rgba(122,90,240,.35)}}
.ticket-k header{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;background:linear-gradient(135deg,#efe9ff,#fde8f1)}
.ticket-k header b{font-size:22px}
.ticket-k ul{list-style:none;margin:0;padding:12px 18px;flex:1}
.ticket-k li{display:flex;gap:10px;padding:5px 0;font-size:18px;font-weight:600}
.ticket-k li b{color:var(--accent);min-width:30px}
.ticket-k .note{padding:0 18px 10px;color:var(--warn);font-weight:700}
.ticket-k button{border-radius:0;width:100%;padding:16px;font-size:16px}
.k-sub{padding:6px 30px;color:var(--mute);font-size:13px;text-transform:uppercase;letter-spacing:.08em;font-weight:700}
.done-row{display:flex;justify-content:space-between;align-items:center;padding:10px 30px;border-bottom:1px solid var(--line)}

/* ===== Tableau de bord ===== */
.hero{display:flex;align-items:center;gap:20px;border-radius:28px;padding:28px 32px;background:linear-gradient(120deg,#ffd9e6 0%,#fde6dc 45%,#e6dcff 100%);box-shadow:var(--shadow-s),inset 0 2px 0 #fff;overflow:hidden;position:relative}
.hero h2{margin:0;font-size:34px;line-height:1.1;font-weight:800;letter-spacing:-.02em}
.hero p{margin:10px 0 18px;color:#5b5880;max-width:380px}
.hero .art{margin-left:auto;font-size:84px;line-height:1;filter:drop-shadow(0 12px 14px rgba(120,80,160,.25));white-space:nowrap}
.hero .art small{font-size:46px}
.btn-hero{display:inline-flex;align-items:center;gap:10px;background:linear-gradient(135deg,#8b6cf6,#6a4be3);color:#fff;padding:14px 26px;border-radius:999px;font-weight:700;box-shadow:0 10px 22px rgba(106,75,227,.35)}
.kpi{border-radius:24px;padding:18px;box-shadow:var(--shadow-s),inset 0 2px 0 #fff;position:relative}
.kpi .ico{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;color:#fff;margin-bottom:12px;box-shadow:0 8px 14px rgba(0,0,0,.12)}
.kpi span.l{display:block;font-weight:600;color:#4f4c75}
.kpi b{display:block;font-size:30px;font-weight:800;letter-spacing:-.02em;margin:2px 0 4px}
.kpi .tr{font-size:13px;font-weight:700;color:var(--ok)}
.kpi .tr.neg{color:var(--bad)}
.kpi .tr em{font-style:normal;color:var(--mute);font-weight:500}
.c-blue{background:linear-gradient(160deg,#e3ecff,#d3e1ff)}.c-blue .ico{background:linear-gradient(135deg,#6ea8ff,#4a86f0)}
.c-pink{background:linear-gradient(160deg,#ffe4ed,#ffd3e2)}.c-pink .ico{background:linear-gradient(135deg,#ff8fb4,#f2638f)}
.c-yellow{background:linear-gradient(160deg,#fff3d1,#ffe9ae)}.c-yellow .ico{background:linear-gradient(135deg,#ffc857,#f5a623)}
.c-green{background:linear-gradient(160deg,#dff6e8,#cdf0dc)}.c-green .ico{background:linear-gradient(135deg,#5bc48a,#34a56a)}
.bars{display:flex;align-items:flex-end;gap:10px;height:200px;padding-top:10px}
.bars div{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;font-size:12px;color:var(--mute);font-weight:600;gap:4px}
.bars i{display:block;width:100%;max-width:38px;border-radius:10px 10px 4px 4px;min-height:4px;box-shadow:inset 0 2px 0 rgba(255,255,255,.5)}
.donut-wrap{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.donut{width:170px;height:170px;border-radius:50%;position:relative;flex:none;box-shadow:var(--shadow-s)}
.donut::after{content:"";position:absolute;inset:36px;border-radius:50%;background:#fff;box-shadow:inset 0 3px 8px rgba(100,80,200,.12)}
.legend{display:grid;gap:10px;flex:1;min-width:150px}
.legend div{display:flex;align-items:center;gap:10px;font-weight:600}
.legend i{width:12px;height:12px;border-radius:50%;flex:none}
.legend span:last-child{margin-left:auto;font-weight:800}
.list{display:grid;gap:12px}
.list .it{display:flex;align-items:center;gap:14px}
.rank{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:800;flex:none}
.it .nm{font-weight:700;line-height:1.2}
.it .sub{font-size:13px;color:var(--mute)}
.it .rt{margin-left:auto;text-align:right;font-weight:800}
.st{display:inline-block;padding:6px 14px;border-radius:999px;font-size:13px;font-weight:700;margin-left:auto}
.st.pending{background:#ffe9b8;color:#9a6200}.st.ready{background:#d6e6ff;color:#2a5fc4}.st.paid{background:#d4f2e1;color:#1f7a4c}
.promo{display:flex;align-items:center;gap:18px;border-radius:26px;padding:20px 26px;background:linear-gradient(120deg,#e2d9ff,#c9bcff);box-shadow:var(--shadow-s)}
.promo h3{margin:0;font-size:20px;font-weight:800}
.promo p{margin:2px 0 0;color:#5b5880}
.promo .big{font-size:44px}
.promo .btn-hero{margin-left:auto}
.datebar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.datebar h2{margin:0;font-size:20px;font-weight:800;text-transform:capitalize}
.dnav{width:38px;height:38px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:var(--shadow-s);color:var(--accent);font-weight:800}

/* ===== Admin ===== */
.admin-row{display:grid;grid-template-columns:1.6fr 1.1fr .8fr 1.1fr auto auto auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line)}
.admin-row form{display:contents}
.chk{display:flex;gap:6px;align-items:center;white-space:nowrap}
.chk input{width:auto}
@media(max-width:900px){.admin-row{grid-template-columns:1fr 1fr}}

/* ===== Connexion ===== */
.login{max-width:360px;margin:14vh auto;text-align:center;padding:30px;background:#fff;border-radius:28px;box-shadow:var(--shadow)}
.login h2{margin:0 0 6px;font-size:30px;font-weight:800;background:linear-gradient(135deg,#7a5af0,#ff8fb4);-webkit-background-clip:text;background-clip:text;color:transparent}
.login input{margin:14px 0 8px;text-align:center}

/* ===== Ticket imprimable ===== */
.receipt{width:300px;margin:20px auto;background:#fff;color:#000;padding:16px;font:13px/1.4 monospace}
.receipt h1{text-align:center;font-size:18px;margin:0}
.receipt table{width:100%;border-collapse:collapse}
.receipt td{padding:2px 0}
.receipt .r{text-align:right}
.receipt hr{border:0;border-top:1px dashed #000}
@media print{body{background:#fff;padding:0}.noprint{display:none}.receipt{margin:0}}

/* ===== Mobile / tablette ===== */
@media(max-width:1000px){
  body{padding:8px}
  .app{grid-template-columns:1fr;height:auto}
  .side{flex-direction:row;align-items:center;flex-wrap:wrap;padding:12px;border-radius:24px;gap:8px}
  .brand,.sidecard{display:none}
  .menu{display:flex;margin:0;flex-wrap:wrap}
  .menu a{padding:10px 16px}
  .side form{margin-left:auto}
  .main{min-height:80vh}
  .topbar{padding:16px 16px 6px;flex-wrap:wrap}.topbar h1{font-size:24px}
  .content{padding:8px 16px 20px;overflow:visible}
  .pos{grid-template-columns:1fr;height:auto}
  .hero .art{display:none}
}
.content:has(.pos){display:flex;flex-direction:column;overflow:hidden}
.content>.pos{flex:1;min-height:0}
@media(max-width:1000px){.content:has(.pos){overflow:visible}.content>.pos{flex:none}}

/* ===== Alertes commandes clients (caisse) ===== */
.notif.inc{background:linear-gradient(135deg,#8b6cf6,#6a4be3);box-shadow:0 12px 30px rgba(106,75,227,.45);align-items:flex-start;font-size:15px}
.inc-body{display:grid;gap:6px;width:100%}
.inc-body>b{font-size:17px}
.inc-items{opacity:.95}
.inc-act{display:flex;gap:8px;margin-top:4px}
.inc-act button{padding:8px 14px;font-size:14px}
.notif.inc .btn-ok{background:#fff;color:var(--ok);box-shadow:none}

/* ===== Menu client (QR) ===== */
body.cm{padding:0;background:linear-gradient(160deg,#f8f4ff,#fdeff8);min-height:100vh}
.cm-wrap{max-width:640px;margin:0 auto;padding:18px 16px 130px}
.cm-head{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.cm-head h1{margin:0 0 4px;font-size:28px;font-weight:800;letter-spacing:-.02em}
.cm-logo{width:56px;height:56px;border-radius:18px;background:linear-gradient(135deg,#9a7cf8,#7a5af0);display:grid;place-items:center;font-size:28px;box-shadow:var(--shadow-s)}
.cm-cats{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;position:sticky;top:0;z-index:5;padding:10px 0;background:linear-gradient(#f8f4ffee,#f8f4ffee);backdrop-filter:blur(8px)}
.cm-cats::-webkit-scrollbar{display:none}
.cm-cats a{white-space:nowrap;padding:9px 18px;border-radius:999px;font-weight:700;color:var(--text);background:color-mix(in srgb,var(--c) 18%,#fff);border:1.5px solid color-mix(in srgb,var(--c) 40%,#fff)}
.cm section{scroll-margin-top:64px;margin-top:10px}
.cm section h2{display:flex;align-items:center;gap:10px;font-size:20px;margin:18px 0 10px}
.cm section h2 i{width:12px;height:12px;border-radius:50%;background:var(--c)}
.cm-list{display:grid;gap:12px}
.cm-item{display:flex;align-items:center;gap:14px;background:#fff;border-radius:22px;padding:12px;border:1.5px solid color-mix(in srgb,var(--c) 18%,#fff);box-shadow:var(--shadow-s);transition:.15s}
.cm-item.sel{border-color:var(--c);background:color-mix(in srgb,var(--c) 7%,#fff)}
.cm-item img,.cm-noimg{width:76px;height:76px;border-radius:18px;object-fit:cover;flex:none;background:color-mix(in srgb,var(--c) 14%,#fff)}
.cm-info{flex:1;min-width:0;display:grid;gap:2px}
.cm-info b{font-size:16px}
.cm-info span{font-weight:800;color:color-mix(in srgb,var(--c) 75%,#1c1a4b)}
.cm-qty{display:flex;align-items:center;gap:10px}
.cm-qty button{width:38px;height:38px;padding:0;border-radius:50%;font-size:22px;line-height:1;background:var(--panel2);color:var(--accent)}
.cm-qty button.plus{background:var(--accent);color:#fff}
.cm-qty em{font-style:normal;font-weight:800;min-width:18px;text-align:center}
.cm-bar{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));max-width:616px;margin:0 auto;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border-radius:26px;padding:12px 14px 12px 22px;box-shadow:0 14px 40px rgba(106,75,227,.35);border:1px solid var(--line)}
.cm-bar[hidden]{display:none}
.cm-bar div{display:grid}
.cm-bar small{color:var(--mute);font-weight:600}
.cm-bar b{font-size:22px}
.cm-bar button{padding:14px 24px;font-size:15px}
.cm-sheet .line{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line)}
.cm .modal{align-items:end}
.cm .modal .box{border-radius:28px 28px 0 0;max-width:640px}
@media(min-width:700px){.cm .modal{align-items:center}.cm .modal .box{border-radius:28px}}

/* ===== Codes QR imprimables ===== */
.qr-intro{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.qr-intro p{flex:1;min-width:240px}
.qr-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px}
.qr-card{margin:0;background:#fff;border-radius:24px;padding:18px;text-align:center;box-shadow:var(--shadow-s);border:1px solid var(--line);break-inside:avoid}
.qr-svg svg{width:100%;height:auto;display:block}
.qr-card figcaption{display:grid;margin-top:8px}
.qr-card small{color:var(--mute)}
.qr-link{display:inline-block;margin-top:8px;font-size:13px;font-weight:700}
@media print{
  .side,.topbar,.noprint{display:none!important}
  body{background:#fff;padding:0}.app{display:block;height:auto}.main{box-shadow:none;border-radius:0;background:#fff}.content{overflow:visible;padding:0}
  .qr-grid{grid-template-columns:repeat(3,1fr)}.qr-card{box-shadow:none;border:1px solid #ccc}
}

/* Commande client reçue : carte sobre en haut de l'écran, reste affichée jusqu'à validation ou refus */
#notifs:has(.inc){left:50%;right:auto;transform:translateX(-50%);width:min(440px,calc(100vw - 32px));top:14px}
.notif.inc{display:block;padding:16px 18px;background:#fff;color:#1c1a4b;border:1px solid #e4defa;border-left:5px solid #8b6cf6;border-radius:18px;font-size:15px;box-shadow:0 18px 40px rgba(60,40,140,.22);animation:pop .3s,ringSoft 2.4s ease-in-out infinite}
.inc-head{display:flex;align-items:center;gap:12px}
.inc-ic{flex:none;width:40px;height:40px;border-radius:12px;background:#efeaff;display:grid;place-items:center;font-size:20px}
.inc-head b{display:block;font-size:18px;font-weight:800;line-height:1.2}
.inc-head small{color:#7a76a8;font-size:13px}
.inc-list{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:4px}
.inc-list li{display:flex;gap:8px;font-weight:600;font-size:15px}
.inc-list li i{font-style:normal;flex:none;min-width:26px;text-align:center;border-radius:8px;background:#efeaff;color:#6a4be3;font-weight:800;font-size:13px;padding:1px 0}
.inc-note{margin-top:8px;font-size:14px;color:#6a4be3}
.inc-act{display:flex;gap:8px;margin-top:14px}
.inc-act button{flex:none;padding:9px 18px;font-size:14px;border-radius:99px}
.notif.inc .btn-ok{background:linear-gradient(135deg,#43c488,#2fa56b);color:#fff;box-shadow:0 6px 14px rgba(47,165,107,.3)}
.notif.inc .btn-bad{background:#f3f1fb;color:#6a4be3;box-shadow:none}
@keyframes ringSoft{0%,100%{box-shadow:0 18px 40px rgba(60,40,140,.22),0 0 0 0 rgba(139,108,246,.45)}50%{box-shadow:0 18px 40px rgba(60,40,140,.22),0 0 0 9px rgba(139,108,246,0)}}

/* Demande de charbon : cartes en bas à droite, visibles sur la caisse et la cuisine jusqu'à « Fait » */
#reqs{position:fixed;right:20px;bottom:20px;z-index:70;display:grid;gap:10px;width:min(340px,calc(100vw - 32px))}
.req{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#fff;color:#1c1a4b;border:1px solid #ffd9a8;border-left:5px solid #f4a62a;border-radius:16px;box-shadow:0 16px 36px rgba(60,40,20,.25);animation:pop .3s}
.req-ic{flex:none;width:38px;height:38px;border-radius:11px;background:#fff1da;display:grid;place-items:center;font-size:19px}
.req-t{flex:1;min-width:0}.req-t b{display:block;font-size:17px;font-weight:800;line-height:1.2}.req-t small{color:#8a7a60;font-size:13px}
.req button{flex:none;padding:8px 16px;font-size:14px;border-radius:99px;background:linear-gradient(135deg,#43c488,#2fa56b);color:#fff}

/* Plus de colonne latérale : navigation dans le menu « Compte » */
.app{grid-template-columns:1fr}
.acct{position:relative;flex:none}
.acct-btn{position:relative;display:flex;align-items:center;gap:8px;height:46px;padding:0 18px 0 14px;border-radius:99px;background:linear-gradient(135deg,#9a7cf8,#7a5af0);color:#fff;font-weight:700;box-shadow:0 8px 18px rgba(106,75,227,.3)}
.acct-btn .ic{width:20px;height:20px}
.acct-btn .dot{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;border-radius:99px;background:#ff5d8f;color:#fff;font-size:12px;font-style:normal;font-weight:800;display:grid;place-items:center;padding:0 5px}
.acct-menu{position:absolute;right:0;top:calc(100% + 10px);z-index:50;width:250px;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 22px 50px rgba(60,40,140,.25);padding:8px;display:grid;gap:2px;animation:pop .18s}
.acct-menu[hidden]{display:none}
.acct-menu a,.acct-menu .out{display:flex;align-items:center;gap:12px;width:100%;padding:11px 14px;border-radius:13px;color:#1c1a4b;font-weight:700;font-size:15px;text-align:left;background:transparent;box-shadow:none;border:0}
.acct-menu a:hover,.acct-menu .out:hover{background:#f4f0ff;filter:none}
.acct-menu a.on{background:#efeaff;color:#6a4be3}
.acct-menu .ic{width:20px;height:20px;color:#7a5af0}
.acct-menu .badge{margin-left:auto}
.acct-menu form{margin:4px 0 0;padding-top:6px;border-top:1px solid var(--line)}
.acct-menu .out{color:#d6456f}.acct-menu .out .ic{color:#d6456f}
@media(max-width:700px){.acct-btn span{display:none}.acct-btn{padding:0 14px}}

/* Le titre de la page est le bouton du menu */
.acct-btn{font-size:20px;font-weight:800;height:50px;padding:0 18px 0 16px;letter-spacing:-.01em}
.acct-btn .chev{opacity:.85;margin-left:2px}
.acct-menu{right:auto;left:0}
@media(max-width:700px){.acct-btn span{display:inline;font-size:17px}.acct-btn{padding:0 14px 0 12px;height:44px}}

/* Fond de la page blanc, panneau périwinkle #b5b1fb (cartes, tuiles et fenêtres restent claires) */
body{background:#7254e8}
.main,.solo{background:#b5b1fb;box-shadow:none}
.datebar h2,.k-head h1,.done-row{color:var(--text)}
.datebar .mute,.k-head .mute,.k-sub,.done-row .mute,.k-board>.mute,.content>.mute{color:#4a4687}
.k-head,.done-row{border-color:rgba(37,36,114,.15)}

/* Barre de recherche étirée sur toute la largeur disponible */
.search{flex:1 1 0;min-width:0;max-width:none}
.search input{flex:1;min-width:0;width:auto}
.search+.sp{display:none}

/* Bandeau « Installer l'application » */
#pwa-bar{position:sticky;top:0;z-index:80;display:flex;align-items:center;gap:12px;margin:-16px -16px 14px;padding:10px 14px;background:#fff;color:#1c1a4b;box-shadow:0 6px 20px rgba(40,30,110,.25)}
#pwa-bar img{width:40px;height:40px;border-radius:10px;flex:none}
#pwa-bar .pwa-t{flex:1;min-width:0;line-height:1.25}
#pwa-bar .pwa-t b{display:block;font-size:15px}
#pwa-bar .pwa-t small{display:block;color:#6a678f;font-size:13px}
#pwa-bar .pwa-go{flex:none;padding:9px 18px;font-size:14px;color:#fff;background:linear-gradient(135deg,#8b6cf6,#6a4be3)}
#pwa-bar .pwa-x{flex:none;width:32px;height:32px;padding:0;border-radius:50%;background:#f1eefc;color:#6a4be3;font-size:20px;line-height:1}
@media(max-width:1000px){#pwa-bar{margin:-8px -8px 10px}}
@media print{#pwa-bar{display:none}}

/* Bouton « Activer les alertes » du menu */
.acct-menu .pushbtn{display:flex;align-items:center;gap:12px;width:100%;padding:11px 14px;border-radius:13px;color:#1c1a4b;font-weight:700;font-size:15px;text-align:left;background:transparent;box-shadow:none;margin-top:4px}
.acct-menu .pushbtn:hover{background:#f4f0ff;filter:none}
.acct-menu .pushbtn .ic{width:20px;height:20px;color:#7a5af0}
.acct-menu .pushbtn.on{color:#1f7a4c}.acct-menu .pushbtn.on .ic{color:#2fa56b}
.acct-menu .pushbtn:disabled{opacity:.6}