/* Field / technician app — styles (W18 #22).
   Externalisé de tech_app.html : sous CSP stricte `style-src 'self'`, un bloc
   <style> en ligne est REFUSÉ par le navigateur (comme WorkOrders_LIVE.css l'a
   été en W11). Servi self-origin par le proxy. */
:root{ --bg:#0b1220; --panel:#131f36; --panel2:#1a2942; --line:#26375a; --ink:#eaf1fb; --mut:#93a3bd;
  --accent:#3b82f6; --good:#22c55e; --warn:#f59e0b; --bad:#ef4444; --orange:#fb923c; }
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:'Segoe UI',system-ui,Arial,sans-serif;font-size:16px}
.wrap{max-width:560px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column}
header{position:sticky;top:0;z-index:10;background:linear-gradient(180deg,#0b1220,rgba(11,18,32,.9));border-bottom:1px solid var(--line);padding:12px 16px;display:flex;align-items:center;gap:10px}
header h1{font-size:16px;margin:0;flex:1}
header .who{font-size:12px;color:var(--mut);text-align:right}
.btn{background:var(--panel);border:1px solid var(--line);color:var(--ink);border-radius:10px;padding:12px 14px;font-size:15px;cursor:pointer;width:100%}
.btn:active{transform:scale(.99)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.good{background:var(--good);border-color:var(--good);color:#04240f}
.btn.warn{background:var(--warn);border-color:var(--warn);color:#3a2600}
.btn.bad{background:var(--bad);border-color:var(--bad);color:#fff}
.btn.ghost{background:transparent}
.logout-btn{width:auto;padding:8px 10px}
.hidden{display:none}
code{background:#0b1220;border:1px solid var(--line);border-radius:6px;padding:1px 5px;font-size:13px}
.row{display:flex;gap:10px}
.content{flex:1;padding:14px}
input,select,textarea{width:100%;background:#0b1220;border:1px solid var(--line);color:var(--ink);border-radius:10px;padding:13px;font-size:16px;font-family:inherit}
label{font-size:13px;color:var(--mut);display:block;margin:12px 0 5px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:12px}
.job{cursor:pointer}
.job:active{background:var(--panel2)}
.pill{display:inline-block;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:700}
.muted{color:var(--mut)} .big{font-size:20px;font-weight:700}
.st{padding:3px 10px;border-radius:20px;font-size:12px;font-weight:700}
.sep{height:1px;background:var(--line);margin:12px 0}
.kv{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px dashed var(--line)}
.statusgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.techPhotos{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:6px}
.techPhoto{position:relative;display:inline-block}
.techPhoto img{width:72px;height:72px;object-fit:cover;border-radius:8px;border:1px solid var(--line);display:block}
.techPhoto .btn{position:absolute;top:-8px;right:-8px;width:auto;min-height:0;padding:0 7px;font-size:12px}
.techPhotoBtn{width:auto;display:inline-flex;align-items:center;cursor:pointer}
.techPhotoInput{display:none}
.empty{text-align:center;color:var(--mut);padding:40px 10px}
.toast{position:fixed;left:0;right:0;top:83.333vh;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none;z-index:50}
.toast div{background:var(--panel2);border:1px solid var(--line);border-left:4px solid var(--good);padding:12px 16px;border-radius:10px;max-width:90%;box-shadow:0 8px 24px rgba(0,0,0,.5)}
.toast div.warn{border-left-color:var(--warn);pointer-events:auto;cursor:pointer;display:flex;align-items:center;gap:8px;padding:0 0 0 16px;min-height:56px}
.toast .fermer{flex:none;width:56px;height:56px;background:transparent;border:0;color:var(--ink);font-size:26px;cursor:pointer}
a{color:#7dd3fc}