/* Carte editor (guest-facing menu) — Bistrot des Copains only. See
   dashboard-bistrot-menu.js and #panel-carte in manager-dashboard.html. */
.bmenu-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.bmenu-search{flex:1;min-width:200px;padding:9px 13px;border-radius:9px;border:1px solid var(--border);font-size:.84rem;font-family:inherit;background:var(--card)}
.bmenu-search:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-lt)}
.bmenu-stat{font-size:.78rem;color:var(--muted);white-space:nowrap}
.bmenu-cat{border:1px solid var(--border);border-radius:12px;margin-bottom:10px;overflow:hidden}
.bmenu-cat-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;cursor:pointer;user-select:none;background:var(--card)}
.bmenu-cat-head:hover{background:rgba(0,0,0,.02)}
.bmenu-cat-title{font-size:.86rem;font-weight:700}
.bmenu-cat-count{font-size:.7rem;color:var(--dim);background:var(--bg);border-radius:999px;padding:2px 8px;margin-left:8px}
.bmenu-chevron{font-size:.68rem;color:var(--dim);transition:transform .18s ease}
.bmenu-cat.open .bmenu-chevron{transform:rotate(90deg)}
.bmenu-cat-body{display:none;border-top:1px solid var(--border)}
.bmenu-cat.open .bmenu-cat-body{display:block}

/* Compact read-only row */
.bmenu-row{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid var(--border)}
.bmenu-row:last-child{border-bottom:none}
.bmenu-row.sold-out .bmenu-name-display{color:var(--dim);text-decoration:line-through}
.bmenu-row-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.bmenu-name-display{font-size:.85rem;font-weight:600;overflow-wrap:anywhere}
.bmenu-desc-display{font-size:.76rem;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bmenu-status{width:64px;font-size:.64rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--green);text-align:center;flex-shrink:0;padding:4px 0;border-radius:999px;border:1px solid transparent;background:rgba(74,143,92,.12);cursor:pointer;transition:background-color .15s ease,transform .1s ease}
.bmenu-status:hover{background:rgba(74,143,92,.22)}
.bmenu-status:active{transform:scale(.95)}
.bmenu-row.sold-out .bmenu-status{color:var(--red);background:rgba(201,119,43,.12)}
.bmenu-row.sold-out .bmenu-status:hover{background:rgba(201,119,43,.22)}
.bmenu-price-display{width:80px;font-size:.83rem;font-weight:600;text-align:right;flex-shrink:0;font-variant-numeric:tabular-nums}
.bmenu-edit-btn{white-space:nowrap;padding:7px 14px !important;font-size:.74rem !important;flex-shrink:0}
.bmenu-add-btn-row{display:block;width:100%;padding:12px 16px;background:none;border:none;border-top:1px dashed var(--border);color:var(--blue);font-size:.8rem;font-weight:600;text-align:left;cursor:pointer;font-family:inherit}
.bmenu-add-btn-row:hover{background:var(--blue-lt)}

.bmenu-photo-wrap{position:relative;width:40px;height:40px;flex-shrink:0;border-radius:8px;overflow:hidden;background:var(--bg);display:flex;align-items:center;justify-content:center}
.bmenu-photo-thumb{width:100%;height:100%;object-fit:cover;display:block}
.bmenu-photo-placeholder{font-size:.95rem;opacity:.35}

.bmenu-toggle{position:relative;width:36px;height:20px;flex-shrink:0;display:inline-block}
.bmenu-toggle input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
/* pointer-events:none is load-bearing: this track sits on top of the real
   checkbox (same absolute inset:0 box, painted later = higher in the
   stack), so without it every click lands on the track instead of the
   input and the checkbox can never actually toggle — found 2026-09-15
   when a user reported the switch not moving at all on click. */
.bmenu-toggle-track{position:absolute;inset:0;background:var(--green);border-radius:999px;transition:background .18s;pointer-events:none}
.bmenu-toggle-track::after{content:'';position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:999px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:transform .18s}
.bmenu-toggle input:checked + .bmenu-toggle-track{background:var(--red)}
.bmenu-toggle input:checked + .bmenu-toggle-track::after{transform:translateX(16px)}
/* Reversed semantics for straightforward on/off switches (e.g. "afficher le
   bandeau") — the default .bmenu-toggle above means "closed"/checked=red,
   which reads backwards for "activate this": unchecked here is neutral
   gray, checked (=on) is green, matching normal on/off convention. Added
   2026-09-15 after a user saved a promo intending to turn it on, but the
   green-when-off/red-when-on coloring led them to leave it unchecked. */
.bmenu-toggle-onoff .bmenu-toggle-track{background:var(--border)}
.bmenu-toggle-onoff input:checked + .bmenu-toggle-track{background:var(--green)}

/* Edit drawer (#bmenu-drawer) — extends the dashboard's shared .edit-drawer/.form-field */
.bmenu-drawer-photo-wrap{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.bmenu-drawer-photo{width:64px;height:64px;border-radius:10px;overflow:hidden;background:var(--bg);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.bmenu-drawer-photo img{width:100%;height:100%;object-fit:cover}
.bmenu-drawer-photo .bmenu-photo-placeholder{font-size:1.4rem}
.bmenu-allergen-list{display:flex;flex-wrap:wrap;gap:6px}
.bmenu-allergen-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:999px;border:1px solid var(--border);font-size:.72rem;cursor:pointer;background:var(--card);user-select:none}
.bmenu-allergen-chip:has(input:checked){background:var(--blue-lt);border-color:var(--blue);color:var(--blue-dk)}
.bmenu-allergen-chip input{margin:0}

/* Infos pratiques */
.bmenu-info-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.bmenu-info-row label{flex:1;min-width:200px;display:flex;flex-direction:column;gap:5px;font-size:.74rem;color:var(--muted);font-weight:600}
.bmenu-info-input{padding:9px 12px;border-radius:8px;border:1px solid var(--border);font-size:.85rem;font-family:inherit;background:var(--card);color:var(--text)}
.bmenu-info-input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-lt)}
.bmenu-hours-grid{display:flex;flex-direction:column;gap:8px}
.bmenu-hours-row{display:flex;align-items:center;gap:10px}
.bmenu-hours-day{width:80px;flex-shrink:0;font-size:.78rem;font-weight:600}
.bmenu-hours-closed-label{font-size:.68rem;color:var(--dim);width:36px;flex-shrink:0}
.bmenu-hours-input{flex:1;min-width:0;padding:7px 10px;border-radius:7px;border:1px solid var(--border);font-size:.8rem;font-family:inherit;background:var(--card);color:var(--text)}
.bmenu-hours-input:disabled{background:var(--bg);color:var(--dim)}
.bmenu-hours-input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px var(--blue-lt)}

@media (max-width:640px){
  .bmenu-status,.bmenu-desc-display{display:none}
  .bmenu-price-display{width:60px}
}
