@font-face{font-family:"Cormorant";src:url(/static/fonts/cormorant.woff2) format("woff2");font-weight:300 700;font-style:normal;font-display:swap}
@font-face{font-family:"Cormorant";src:url(/static/fonts/cormorant-italic.woff2) format("woff2");font-weight:300 700;font-style:italic;font-display:swap}
:root{
  --bg:#faf7f4; --card:#ffffff; --text:#1d1d1f; --muted:#86868b; --line:#e5e5ea; --fill:#f2f2f7;
  --accent:#a8505b; --accent-soft:#f6e9e7; --accent-press:#8f4450; --sage:#7d9479; --sage-soft:#eef2ec; --serif:"Cormorant","Cormorant Garamond",Georgia,serif;
  --blue:#0a84ff; --purple:#af52de; --orange:#ff9500; --green:#28a745; --red:#ff3b30; --gray:#8e8e93;
  --radius:18px; --radius-sm:12px;
  --shadow:0 1px 2px rgba(0,0,0,.04),0 4px 18px rgba(0,0,0,.04);
  --safe-b:env(safe-area-inset-bottom,0px); --safe-t:env(safe-area-inset-top,0px);
  color-scheme:light dark;
}
@media (prefers-color-scheme:dark){
  :root{--bg:#000;--card:#1c1c1e;--text:#f5f5f7;--muted:#98989d;--line:#38383a;--fill:#2c2c2e;
    --accent:#d98e96;--accent-soft:#3a2224;--accent-press:#e6a6ad;--sage:#a3b89f;--sage-soft:#232a22;--shadow:none}
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--bg);color:var(--text)}
body{font:16px/1.45 -apple-system,BlinkMacSystemFont,"SF Pro Text","Inter","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-font-smoothing:antialiased;letter-spacing:-.01em}
h1,h2,h3{margin:0;letter-spacing:-.025em}
h1{font-size:34px;font-weight:700;line-height:1.1}
h1,h2,.serif{font-family:var(--serif);font-weight:600;letter-spacing:.005em}
h1{font-size:38px;line-height:1.05}
.tagline{font-family:var(--serif);font-style:italic;font-weight:500;font-size:19px;color:var(--sage);margin-top:6px}
h2{font-size:22px;font-weight:700}
h3{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.12em;color:var(--sage);margin:28px 16px 8px}
a{color:var(--accent);text-decoration:none}
button{font:inherit;color:inherit}
.muted{color:var(--muted)}
.small{font-size:13px}
.center{text-align:center}
.hidden{display:none!important}

/* ---------- cards & lists */
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.list{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.row{display:flex;align-items:center;gap:12px;padding:13px 16px;min-height:50px;position:relative;width:100%;
  background:none;border:0;text-align:left;cursor:pointer;color:var(--text)}
.row+.row::before{content:"";position:absolute;top:0;left:16px;right:0;height:1px;background:var(--line);transform:scaleY(.6)}
.row:active{background:var(--fill)}
.row .grow{flex:1;min-width:0}
.row .title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .sub{font-size:14px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .end{color:var(--muted);font-size:15px;text-align:right;flex-shrink:0}
.chev{width:8px;height:14px;flex-shrink:0;opacity:.35}
.kv{display:flex;justify-content:space-between;gap:16px;padding:12px 16px;position:relative}
.kv+.kv::before{content:"";position:absolute;top:0;left:16px;right:0;height:1px;background:var(--line);transform:scaleY(.6)}
.kv .k{color:var(--muted);flex-shrink:0}
.kv .v{text-align:right;white-space:pre-wrap;word-break:break-word}
.block{padding:14px 16px;white-space:pre-wrap;word-break:break-word}
.block .k{color:var(--muted);font-size:13px;margin-bottom:2px}

/* ---------- buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:980px;
  padding:13px 22px;font-weight:600;font-size:16px;background:var(--accent);color:#fff;cursor:pointer;
  transition:transform .12s,background .15s,opacity .15s;text-decoration:none;min-height:48px}
.btn:active{transform:scale(.97);background:var(--accent-press)}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn.block-btn{width:100%}
.btn.secondary{background:var(--accent-soft);color:var(--accent)}
.btn.gray{background:var(--fill);color:var(--text)}
.btn.green{background:#25d366;color:#fff}
.btn.danger{background:transparent;color:var(--red)}
.btn.small{padding:8px 14px;font-size:14px;min-height:36px}
.btn svg{width:20px;height:20px}
.linkbtn{background:none;border:0;color:var(--accent);font-weight:500;cursor:pointer;padding:6px}

/* ---------- forms */
label.field{display:block;padding:12px 16px;position:relative}
label.field+label.field::before,.field-sep::before{content:"";position:absolute;top:0;left:16px;right:0;height:1px;background:var(--line);transform:scaleY(.6)}
label.field>span{display:block;font-size:13px;color:var(--muted);margin-bottom:3px}
label.field>span b{color:var(--accent);font-weight:600}
input,textarea,select{width:100%;font:inherit;color:var(--text);background:transparent;border:0;outline:0;padding:2px 0;
  -webkit-appearance:none;appearance:none;border-radius:0}
input[type=date],input[type=time]{min-height:26px}
textarea{resize:vertical;min-height:74px;line-height:1.4}
select{background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2386868b' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right center;padding-right:20px}
::placeholder{color:var(--muted);opacity:.7}
.input-box{background:var(--fill);border-radius:var(--radius-sm);padding:12px 14px}
.seg{display:flex;background:var(--fill);border-radius:10px;padding:2px;gap:2px}
.seg button,.seg label{flex:1;border:0;background:transparent;padding:7px 8px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;text-align:center;color:var(--text);white-space:nowrap}
.seg .on,.seg input:checked+span{background:var(--card);box-shadow:0 1px 3px rgba(0,0,0,.12)}
.seg input{display:none}
.seg label span{display:block;padding:0;border-radius:8px}
.seg label{padding:0}
.seg label span{padding:7px 8px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip-opt{border:1px solid var(--line);background:var(--card);border-radius:980px;padding:7px 14px;font-size:14px;cursor:pointer}
.chip-opt.on{background:var(--accent);border-color:var(--accent);color:#fff}

/* ---------- badges */
.badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;padding:3px 9px;border-radius:980px;white-space:nowrap}
.badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.st-nouvelle{color:var(--blue);background:color-mix(in srgb,var(--blue) 12%,transparent)}
.st-confirmee{color:var(--purple);background:color-mix(in srgb,var(--purple) 12%,transparent)}
.st-preparation{color:var(--orange);background:color-mix(in srgb,var(--orange) 14%,transparent)}
.st-prete{color:var(--green);background:color-mix(in srgb,var(--green) 13%,transparent)}
.st-livree{color:var(--gray);background:color-mix(in srgb,var(--gray) 14%,transparent)}
.st-annulee{color:var(--red);background:color-mix(in srgb,var(--red) 12%,transparent)}
.pay-impaye{color:var(--red)} .pay-acompte{color:var(--orange)} .pay-paye{color:var(--green)} .pay-sans_prix{color:var(--muted)}
.dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}

/* ---------- toast / sheet */
.toast{position:fixed;left:50%;bottom:calc(96px + var(--safe-b));transform:translateX(-50%) translateY(20px);opacity:0;
  background:rgba(30,30,32,.92);color:#fff;padding:12px 18px;border-radius:14px;font-size:15px;font-weight:500;z-index:200;
  transition:all .25s;pointer-events:none;backdrop-filter:blur(10px);max-width:90vw;text-align:center}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.sheet-bg{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:100;opacity:0;transition:opacity .25s}
.sheet-bg.show{opacity:1}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:101;background:var(--bg);border-radius:22px 22px 0 0;
  padding:8px 16px calc(20px + var(--safe-b));max-height:92vh;overflow:auto;transform:translateY(100%);transition:transform .3s cubic-bezier(.2,.9,.3,1)}
.sheet.show{transform:none}
.sheet .grab{width:36px;height:5px;border-radius:3px;background:var(--line);margin:0 auto 12px}
.sheet h2{margin:4px 4px 16px}
@media (min-width:700px){.sheet{left:50%;width:520px;margin-left:-260px;bottom:auto;top:50%;border-radius:22px;transform:translateY(-40%) scale(.96);opacity:0}
  .sheet.show{transform:translateY(-50%);opacity:1}}

/* ---------- photos */
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px}
.photo{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--fill)}
.photo img{width:100%;height:100%;object-fit:cover;display:block;cursor:zoom-in}
.photo .x{position:absolute;top:5px;right:5px;width:24px;height:24px;border-radius:50%;border:0;background:rgba(0,0,0,.55);color:#fff;font-size:15px;line-height:24px;cursor:pointer;padding:0}
.photo.add{display:flex;flex-direction:column;align-items:center;justify-content:center;border:1.5px dashed var(--line);background:transparent;color:var(--muted);cursor:pointer;font-size:13px;gap:4px}
.photo.add svg{width:26px;height:26px}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:300;display:flex;align-items:center;justify-content:center;cursor:zoom-out}
.lightbox img{max-width:96vw;max-height:92vh;border-radius:8px}

.spinner{width:22px;height:22px;border:2.5px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.fade-in{animation:fade .3s ease}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}