/* Bouchon — reservations.
   Deux surfaces : la page publique (sobre, mobile d'abord) et le back-office
   (dense, lisible d'un coup d'oeil sur l'iPad du bar, en service, de nuit). */

:root{
  --paper:#F7F6F3; --raised:#fff; --ink:#14161A; --muted:#565B65; --faint:#8A8F99;
  --rule:#E1DFDA; --wine:#7A2233; --wine-soft:#F3E7E9;
  --ok:#2F6B4F; --warn:#8A6A16; --tg:#2AABEE;
  --f:"Archivo",-apple-system,"Segoe UI",sans-serif;
  --fkm:"Noto Sans Khmer","Archivo",sans-serif;
}
@media (prefers-color-scheme:dark){
  :root{
    --paper:#131419; --raised:#1B1D23; --ink:#ECEAE6; --muted:#A2A8B3; --faint:#767C87;
    --rule:#2C2F37; --wine:#E48294; --wine-soft:#2A1A1E; --ok:#6BBF95; --warn:#D4A73C;
  }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--f);font-size:16px;line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
:lang(km),html[lang="km"] body{font-family:var(--fkm)}
a{color:var(--wine)}
button,input,select,textarea{font:inherit;color:inherit}

/* ------------------------------------------------------------- public */
.pub{max-width:30rem;margin:0 auto;padding:2rem 1.1rem 4rem}
.pub-head{text-align:center;margin-bottom:1.6rem}
.brand{
  font-size:.72rem;letter-spacing:.19em;text-transform:uppercase;
  color:var(--wine);margin:0 0 1rem;font-weight:600;
}
.pub-head h1{font-size:1.75rem;font-weight:700;letter-spacing:-.02em;margin:0 0 .35rem;text-wrap:balance}
.when{margin:.2rem 0;color:var(--ink);font-weight:600;font-size:.95rem}
.blurb{margin:.5rem 0 0;color:var(--muted);font-size:.92rem}
.lang{margin:1rem 0 0;font-size:.78rem;color:var(--faint)}
.lang a{text-decoration:none}

.card{
  background:var(--raised);border:1px solid var(--rule);border-radius:10px;
  padding:1.2rem;display:flex;flex-direction:column;gap:.95rem;
}
label{display:flex;flex-direction:column;gap:.32rem;font-size:.78rem;
  letter-spacing:.04em;text-transform:uppercase;color:var(--muted);font-weight:600}
input,select,textarea{
  padding:.68rem .7rem;border:1px solid var(--rule);border-radius:7px;
  background:var(--paper);font-size:1rem;text-transform:none;letter-spacing:0;
  font-weight:400;color:var(--ink);width:100%;
}
input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible{
  outline:2px solid var(--wine);outline-offset:2px}
.locked{opacity:.65}
.pair{display:flex;gap:.6rem}
.pair > *{flex:1;min-width:0}
label .pair{margin:0}
fieldset{border:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.5rem}
legend{font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;
  color:var(--muted);font-weight:600;padding:0}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(4.6rem,1fr));gap:.45rem}
.slot input{position:absolute;opacity:0;pointer-events:none}
.slot{
  display:block;text-align:center;padding:.6rem .2rem;border:1px solid var(--rule);
  border-radius:7px;cursor:pointer;font-size:.95rem;background:var(--paper);
  text-transform:none;letter-spacing:0;color:var(--ink);position:relative;
}
.slot:has(input:checked){background:var(--wine);border-color:var(--wine);color:#fff;font-weight:600}
.slot.out{opacity:.32;cursor:not-allowed;text-decoration:line-through}
button{
  padding:.8rem 1rem;border:none;border-radius:7px;background:var(--wine);color:#fff;
  font-weight:600;font-size:1rem;cursor:pointer;
}
button[disabled]{opacity:.4;cursor:not-allowed}
.err{background:var(--wine-soft);color:var(--wine);padding:.7rem .9rem;
  border-radius:7px;margin:0 0 1rem;font-size:.9rem}
.empty{color:var(--faint);font-size:.9rem;margin:.2rem 0}

.recap{text-align:center;gap:.3rem}
.recap .ev{margin:0;color:var(--wine);font-weight:600;font-size:.85rem;
  text-transform:uppercase;letter-spacing:.1em}
.recap .big{margin:0;font-size:1.5rem;font-weight:700;letter-spacing:-.02em}
.recap .sub{margin:0;color:var(--muted);font-size:.92rem}
.tg{margin-top:.9rem;text-align:center;gap:.85rem}
.tg p{margin:0;font-size:.9rem;color:var(--muted)}
.tg-btn{
  display:block;padding:.85rem;border-radius:7px;background:var(--tg);color:#fff;
  text-decoration:none;font-weight:600;
}

/* -------------------------------------------------------- back-office */
body.admin{background:var(--paper)}
.bar{
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.7rem 1rem;border-bottom:1px solid var(--rule);background:var(--raised);
  position:sticky;top:0;z-index:5;flex-wrap:wrap;
}
.nav{display:flex;align-items:center;gap:.5rem}
.arrow{
  text-decoration:none;font-size:1.4rem;line-height:1;padding:.2rem .6rem;
  border:1px solid var(--rule);border-radius:7px;color:var(--muted);
}
.dayname strong{display:block;font-size:1.05rem;text-transform:capitalize}
.dayname span{font-size:.8rem;color:var(--faint)}
.right{display:flex;gap:.5rem;align-items:center}
.ghost{
  padding:.5rem .8rem;border:1px solid var(--rule);border-radius:7px;
  background:transparent;color:var(--muted);text-decoration:none;font-size:.85rem;
  font-weight:600;cursor:pointer;
}
.primary{padding:.5rem .9rem;font-size:.85rem}

.sheet{padding:.6rem 1rem 5rem;display:flex;flex-direction:column;gap:.4rem;
  max-width:60rem;margin:0 auto}
.resa{
  display:grid;grid-template-columns:3.6rem 1fr auto auto;gap:.7rem;align-items:center;
  background:var(--raised);border:1px solid var(--rule);border-radius:9px;padding:.7rem .8rem;
}
.resa .time{font-size:1.05rem;font-weight:700;font-variant-numeric:tabular-nums}
.who{min-width:0}
.nm{margin:0;font-weight:600;font-size:1rem;display:flex;flex-wrap:wrap;
  gap:.35rem;align-items:center}
.meta{margin:.15rem 0 0;font-size:.82rem;color:var(--muted);
  display:flex;gap:.6rem;flex-wrap:wrap}
.meta .cov{font-weight:600;color:var(--ink)}
.meta a{text-decoration:none}
.meta .src{color:var(--faint);text-transform:capitalize}
.note{margin:.25rem 0 0;font-size:.84rem;color:var(--warn)}
.pill{
  font-size:.66rem;font-weight:600;padding:.12rem .42rem;border-radius:4px;
  text-transform:uppercase;letter-spacing:.05em;
}
.pill.reg{background:var(--wine-soft);color:var(--wine)}
.pill.ev{background:var(--wine);color:#fff}
.pill.tg{background:var(--tg);color:#fff}
.pill.perm{background:var(--wine-soft);color:var(--wine)}
.tbl input{width:6.4rem;padding:.4rem;text-align:center;font-size:.9rem}
.acts{display:flex;gap:.3rem}
.a{width:2.3rem;height:2.3rem;padding:0;border-radius:7px;font-size:1rem;
  background:transparent;border:1px solid var(--rule);color:var(--muted)}
.a.ok:hover{background:var(--ok);border-color:var(--ok);color:#fff}
.a.ns:hover,.a.can:hover{background:var(--wine);border-color:var(--wine);color:#fff}
.resa.s-seated{border-left:3px solid var(--ok)}
.resa.s-cancelled,.resa.s-no_show{opacity:.45}
.resa.s-cancelled .nm,.resa.s-no_show .nm{text-decoration:line-through}
.resa.s-pending{border-left:3px solid var(--warn)}

dialog{border:none;border-radius:12px;padding:0;background:transparent;max-width:34rem;width:92vw}
dialog::backdrop{background:rgba(0,0,0,.45)}
dialog h2{margin:0;font-size:1.1rem}
menu{display:flex;gap:.6rem;justify-content:flex-end;margin:.3rem 0 0;padding:0}

.events{padding:1rem;max-width:52rem;margin:0 auto;display:flex;
  flex-direction:column;gap:.7rem}
.ev-card{
  display:grid;grid-template-columns:1fr auto auto;gap:1rem;align-items:center;
  background:var(--raised);border:1px solid var(--rule);border-radius:9px;padding:.9rem 1rem;
}
.ev-card.off{opacity:.5}
.ev-card h3{margin:0 0 .2rem;font-size:1.05rem}
.rhythm{margin:0;font-size:.85rem;color:var(--muted);display:flex;
  gap:.4rem;align-items:center;flex-wrap:wrap}
.link{margin:.45rem 0 0;display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.link code{font-size:.8rem;background:var(--paper);padding:.25rem .45rem;
  border-radius:5px;border:1px solid var(--rule)}
.copy{padding:.25rem .5rem;font-size:.72rem;background:transparent;
  border:1px solid var(--rule);color:var(--muted);border-radius:5px}
.copy.done{color:var(--ok);border-color:var(--ok)}
.next{margin:.35rem 0 0;font-size:.8rem;color:var(--wine);font-weight:600}
.ev-stats{text-align:right;line-height:1.15}
.ev-stats .n{display:block;font-size:1.5rem;font-weight:700;font-variant-numeric:tabular-nums}
.ev-stats .n2{display:block;font-size:1.05rem;font-weight:600;margin-top:.3rem;color:var(--muted)}
.ev-stats .l{display:block;font-size:.64rem;text-transform:uppercase;
  letter-spacing:.09em;color:var(--faint)}
.new-ev{margin-top:1rem}
.new-ev h2{margin:0;font-size:1rem}

@media (max-width:620px){
  .resa{grid-template-columns:3rem 1fr;row-gap:.5rem}
  .tbl,.acts{grid-column:2}
  .acts{justify-self:end;margin-top:-2.4rem}
  .ev-card{grid-template-columns:1fr;gap:.6rem}
  .ev-stats{text-align:left;display:flex;gap:.5rem;align-items:baseline}
}

/* ------------------------------------------------------- fiche client */
.clients{padding:1rem;max-width:52rem;margin:0 auto}
.search{display:flex;gap:.5rem;margin-bottom:1rem}
.search input{flex:1}
.clist{display:flex;flex-direction:column;gap:1px;background:var(--rule);
  border:1px solid var(--rule);border-radius:9px;overflow:hidden}
.crow{
  display:grid;grid-template-columns:1fr 10rem 6.5rem;gap:1rem;align-items:center;
  background:var(--raised);padding:.65rem .9rem;text-decoration:none;color:var(--ink);
}
.crow:hover{background:var(--paper)}
.cn{font-weight:600;display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.cm{font-size:.85rem;color:var(--muted);font-variant-numeric:tabular-nums}
.cl{font-size:.8rem;color:var(--faint);text-align:right;font-variant-numeric:tabular-nums}
.warn-txt{color:var(--warn);font-style:normal;font-size:.8rem}

.cfile{padding:1rem;max-width:56rem;margin:0 auto;
  display:grid;grid-template-columns:1fr 17rem;gap:1rem;align-items:start}
.cfile h2{margin:0;font-size:.95rem}
.cfile .hist{grid-column:1/-1}
.check{flex-direction:row;align-items:center;gap:.5rem;text-transform:none;
  letter-spacing:0;font-size:.9rem;font-weight:400;color:var(--ink)}
.check input{width:auto}
.side .hint{font-size:.84rem;color:var(--muted);margin:.4rem 0 0}
.side .linked{margin:.3rem 0 0;color:var(--ok);font-weight:600;font-size:.9rem}
.side .alert{margin:.7rem 0 0;font-size:.82rem;color:var(--warn);
  padding:.5rem .6rem;border-radius:6px;border-left:2px solid var(--warn)}
.hist{background:var(--raised);border:1px solid var(--rule);border-radius:10px;padding:1.1rem}
.hlist{display:flex;flex-direction:column;margin-top:.6rem}
.hrow{
  display:grid;grid-template-columns:6.5rem 4rem 5rem 1fr 6rem;gap:.6rem;
  padding:.45rem 0;border-top:1px solid var(--rule);font-size:.87rem;
  text-decoration:none;color:var(--ink);align-items:center;
}
.hrow:hover{background:var(--paper)}
.hd,.ht{font-variant-numeric:tabular-nums}
.hc{color:var(--muted)}
.he{color:var(--wine);font-size:.8rem}
.hs{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;
  color:var(--faint);text-align:right}
.hrow.s-cancelled,.hrow.s-no_show{opacity:.45}
.hrow.s-seated .hs{color:var(--ok)}
@media (max-width:760px){
  .cfile{grid-template-columns:1fr}
  .crow{grid-template-columns:1fr auto;row-gap:.2rem}
  .cl{grid-column:2;text-align:right}
  .hrow{grid-template-columns:6.5rem 4rem 1fr;row-gap:.15rem}
  .he,.hs{grid-column:3;text-align:right}
}

/* ------------------------------------------------------------ connexion */
.login{max-width:22rem}
.note-login{text-align:center;font-size:.8rem;color:var(--faint);margin-top:1rem}