
:root{
 --bg:#0b1117;--panel:#121c25;--panel2:#17232e;--line:#2b3b48;
 --text:#f5f7f9;--muted:#9fb0bc;--green:#5ea927;--blue:#225fb4;
 --orange:#d86b20;--yellow:#ffc400;--red:#ad3b3b
}
*{box-sizing:border-box} body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,sans-serif}
header{position:sticky;top:0;z-index:10;height:58px;display:grid;grid-template-columns:52px 1fr 52px;align-items:center;background:#091016;border-bottom:1px solid var(--line);padding:0 8px}
.title{text-align:center;font-size:20px;font-weight:900}.title span{color:var(--green)}
.nav{border:0;background:transparent;color:white;font-size:26px}.hidden{visibility:hidden}
main{max-width:760px;margin:auto;padding:14px 14px 40px}
h2{margin:4px 0 12px}.muted{color:var(--muted);font-size:13px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:13px;padding:13px;margin-bottom:11px}
.homegrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.big{grid-column:1/-1;min-height:110px;background:var(--yellow);color:#111;border:0;border-radius:12px;font-size:20px;font-weight:900}
.tile{min-height:95px;background:var(--panel2);border:1px solid var(--line);border-radius:12px;color:#fff;font-weight:800}
.zone{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;background:var(--panel2);color:white;border:1px solid var(--line);border-radius:11px;padding:14px;margin:8px 0}
.zone strong{font-size:17px}.zone small{display:block;color:var(--muted);margin-top:3px}
.section{color:#69c7ef;font-size:12px;font-weight:900;margin:15px 0 7px}
.dest{background:#0f1820;border:1px solid var(--line);border-radius:12px;padding:11px;margin-bottom:11px}
.desthead{display:flex;justify-content:space-between;align-items:center}.desthead h3{margin:0 0 8px}
.row{display:grid;grid-template-columns:1fr auto auto;gap:7px;align-items:center;margin:7px 0}
.field{width:100%;background:#0a131a;color:white;border:1px solid var(--line);border-radius:8px;padding:10px}
.btn,.status,.comment,.plus{border:0;border-radius:8px;color:#fff;font-weight:800}
.btn{width:100%;padding:13px;margin-top:8px}.primary{background:var(--green)}.secondary{background:var(--blue)}.danger{background:var(--red)}
.status{min-height:40px;padding:0 10px;background:#33434f}.status.closed{background:var(--green)}
.comment{min-width:42px;min-height:40px;background:var(--orange)}
.plus{min-width:48px;min-height:44px;background:var(--blue);font-size:20px}
.counter{display:grid;grid-template-columns:1fr 82px 52px;gap:8px;align-items:end;margin:8px 0}
.counter label{font-size:12px;color:var(--muted);display:block;margin-bottom:4px}
.counter input{width:100%;text-align:center}
.twocol{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.checkline{display:flex;gap:9px;align-items:center}.checkline input{width:22px;height:22px}
.history{width:100%;background:var(--panel2);color:white;border:1px solid var(--line);border-radius:10px;padding:11px;margin:6px 0;text-align:left}
table{width:100%;border-collapse:collapse;font-size:13px}th,td{padding:8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}th{color:var(--muted);font-size:11px}
.scroll{overflow:auto}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:50;display:flex;align-items:flex-end}
.modalbox{width:100%;max-width:760px;margin:auto;background:#101922;border-radius:18px 18px 0 0;padding:15px;border:1px solid var(--line)}
#toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#1b2730;color:#fff;padding:10px 14px;border-radius:999px;opacity:0;pointer-events:none;transition:.2s;z-index:99}
#toast.show{opacity:1}
/* Beta 5 - lignes SMALL / NCY compactes */
.uldline{display:grid;grid-template-columns:minmax(105px,1.2fr) minmax(95px,1fr) 145px minmax(85px,.75fr) 70px 60px 46px 46px 46px;gap:7px;align-items:end;padding:10px 0;border-top:1px solid var(--line)}
.uldline:first-child{border-top:0}.uldfield label{display:block;color:var(--muted);font-size:10px;font-weight:800;margin:0 0 4px}.uldfield .field{padding:9px}.qtybox{display:grid;grid-template-columns:40px 48px 40px;gap:5px}.qtybox button{border:0;border-radius:8px;background:#263743;color:#fff;font-size:20px}.qtybox .plusmini{background:var(--green)}.tinycheck{display:flex;flex-direction:column;align-items:center;gap:5px;color:var(--muted);font-size:10px;font-weight:800}.tinycheck input{width:24px;height:24px}.trash{height:40px;border:0;border-radius:8px;background:#3a1e20;color:#ff6b6b;font-size:20px}.destdelete{border:0;background:transparent;color:#ff7373;font-size:18px;padding:6px}.commentmini{height:40px;border:0;border-radius:8px;background:var(--orange);color:white;font-size:17px}
@media(max-width:720px){.uldline{grid-template-columns:1fr 1fr 145px 90px;overflow-x:auto}.tinycheck,.trash,.commentmini{min-width:46px}.dest{overflow-x:auto}.uldline{min-width:735px}}
.historyrow{display:grid;grid-template-columns:1fr 48px;gap:7px;align-items:center}.historydelete{height:100%;min-height:58px;border:0;border-radius:10px;background:#3a1e20;color:#ff6b6b;font-size:20px}

/* Beta 6 — thème DHL / RCG + mode clair/sombre */
:root,[data-theme="dark"]{
 --bg:#0b1015;--panel:#121a21;--panel2:#18232c;--line:#34424d;
 --text:#f7f7f7;--muted:#aab5bd;--green:#2f9b45;--blue:#263746;
 --orange:#c98a00;--yellow:#ffcc00;--red:#d40511;
 --header:#ffcc00;--headerText:#151515;--input:#0c141a;
}
[data-theme="light"]{
 --bg:#f2f3f4;--panel:#ffffff;--panel2:#f7f7f7;--line:#d3d6d8;
 --text:#171717;--muted:#626a70;--green:#2f8f45;--blue:#e7e9eb;
 --orange:#c98500;--yellow:#ffcc00;--red:#d40511;
 --header:#ffcc00;--headerText:#151515;--input:#ffffff;
}
body{background:var(--bg);color:var(--text)}
header{height:64px;background:var(--header);color:var(--headerText);border-bottom:3px solid var(--red);grid-template-columns:52px 1fr auto}
.title{color:#171717;line-height:18px}.title span{color:var(--red)}.title small{display:block;font-size:8px;letter-spacing:1.2px;color:#5c1515}
.nav{color:var(--headerText)}.headright{display:flex;align-items:center}.themebtn{font-size:21px;width:42px}
.card,.dest{background:var(--panel);border-color:var(--line)}.zone,.tile,.history{background:var(--panel2);color:var(--text);border-color:var(--line)}
.field{background:var(--input);color:var(--text);border-color:var(--line)}
.big,.primary{background:var(--yellow);color:#111}.secondary{background:var(--yellow);color:#111}.danger{background:var(--red)}
.section{color:var(--red)}h2{border-left:5px solid var(--yellow);padding-left:9px}
.status.closed{background:var(--green);color:white}.comment,.commentmini{background:var(--yellow);color:#111}
.qtybox button,.calqty button{background:var(--panel2);color:var(--text);border:1px solid var(--line)}
.qtybox .plusmini,.calqty button:last-child{background:var(--yellow);color:#111}
.trash,.historydelete{background:rgba(212,5,17,.12);color:var(--red)}
.destdelete{color:var(--red)}
input[type="checkbox"]{accent-color:var(--red)}
/* CAL par ULD */
.caldesthead{display:flex;align-items:center;justify-content:space-between;gap:12px}.caladdtop{width:auto;min-width:105px;margin:0}
.caluld{padding:12px}.caluld.calclosed{border-color:var(--green)}
.caluldtop{display:grid;grid-template-columns:minmax(140px,1fr) 105px 46px 46px;gap:7px;align-items:end}
.calmetrics{display:grid;grid-template-columns:repeat(4,minmax(92px,1fr));gap:8px;margin-top:10px}
.calmetric,.calextra{background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:8px}
.calmetric label,.calextra label{display:block;font-size:10px;color:var(--muted);font-weight:800;margin-bottom:5px}
.calqty{display:grid;grid-template-columns:34px 1fr 34px;align-items:center;gap:4px}
.calqty button{height:34px;border-radius:7px;font-size:18px}.calqty span{text-align:center;font-size:18px;font-weight:900}
.calextra .field{padding:8px}.calclose{height:40px}.calcomment,.caltrash{height:40px}
@media(max-width:720px){.calmetrics{grid-template-columns:repeat(4,105px);min-width:450px}.caluld{overflow-x:auto}.caluldtop{min-width:430px}}

/* Beta 7 — CAL directement dans le volet destination */
.caldestinline{background:var(--panel);border:1px solid var(--line);border-radius:12px;margin:10px 0;overflow:hidden}
.caldestbar{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-left:5px solid var(--yellow)}
.caldestbar strong{font-size:18px}.caldestplus{border:0;border-radius:8px;background:var(--yellow);color:#111;font-weight:900;padding:10px 14px}
.caldestrows:empty{display:none}.caluldinline{padding:10px 12px;border-top:1px solid var(--line)}.caluldinline.calclosed{box-shadow:inset 4px 0 0 var(--green)}
.caluldinline .calmetrics{margin-top:8px}.caluldinline .calrow1{grid-template-columns:repeat(4,minmax(105px,1fr))}
.caluldinline .calrow2{grid-template-columns:105px minmax(145px,1.5fr) 105px minmax(125px,1fr) 105px minmax(145px,1.5fr)}
@media(max-width:720px){.caluldinline{overflow-x:auto}.caluldinline .caluldtop,.caluldinline .calrow1,.caluldinline .calrow2{min-width:700px}.caluldinline .calrow2{grid-template-columns:105px 150px 105px 130px 105px 150px}}

/* Beta 8 — RC25 + sous-zone VAN */
.subzone{margin:18px 0 10px;padding:10px;border:1px solid var(--line);border-radius:13px;background:var(--panel2)}
.subzonehead{display:flex;justify-content:space-between;align-items:center;border-left:5px solid var(--red);padding:7px 10px;margin-bottom:8px;background:var(--panel)}
.subzonehead strong{font-size:18px}

.desthead{background:var(--yellow)!important;color:#111!important;border-bottom:3px solid var(--red);padding:10px 12px;border-radius:9px 9px 0 0}.desthead h3{color:#111!important;font-size:22px}.uldline.locked{opacity:.68}.uldclose{min-width:46px;width:46px;padding:0;font-size:21px}.commentmini{min-width:46px;width:46px;padding:0}.dangerTile{border-color:var(--red)!important}
.summaryZone{background:var(--panel);border:1px solid var(--line);border-radius:11px;margin:12px 0;padding:9px}.summaryZone h3{background:var(--yellow);color:#111;border-left:5px solid var(--red);margin:-9px -9px 8px;padding:9px}.sumdest{color:var(--red);font-size:17px;margin-top:9px}.sumrow{padding:7px;border-bottom:1px solid var(--line)}
.endrow{display:grid;grid-template-columns:1fr 100px 2fr 45px;gap:7px;margin:7px 0}.remainrow{display:grid;grid-template-columns:1.2fr .7fr 70px 110px 2fr 45px;gap:7px;margin:7px 0}textarea.field{min-height:75px}
.doccat{margin:14px 0;border:1px solid var(--line);border-radius:11px;overflow:hidden}.doccat h3{margin:0;background:var(--yellow);color:#111;border-bottom:3px solid var(--red);padding:10px}.doclink{display:flex;padding:13px;gap:10px;color:var(--text);text-decoration:none;border-bottom:1px solid var(--line)}.doclink span{flex:1}.reopen{background:var(--yellow);border:0;border-radius:7px;padding:8px;font-weight:800}
/* BETA 10 — navigation terrain */
.quicknav{display:flex;gap:5px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;margin:-2px 0 14px;padding:4px 0 8px;position:sticky;top:64px;z-index:20;background:var(--bg)}.quicknav::-webkit-scrollbar{display:none}.quicknav button{flex:0 0 auto;min-width:88px;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--text);padding:7px 9px;font-weight:800}.quicknav button b{display:block;font-size:22px;line-height:24px}.quicknav button span{font-size:10px}.quicknav button.active{background:var(--yellow);color:#111;border-color:var(--yellow);box-shadow:inset 0 -3px 0 var(--red)}
.dashhead{display:flex;align-items:center;justify-content:space-between;gap:10px}.agentbadge{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--yellow);padding:9px 12px;border-radius:9px;font-weight:800}
.flightrow{display:grid;grid-template-columns:2fr 1fr 1fr 44px;gap:7px;margin:7px 0}.coverage{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}.coverage>div{background:var(--panel);border:1px solid var(--line);border-top:4px solid var(--yellow);border-radius:10px;padding:12px;text-align:center}.coverage b{display:block;font-size:24px}.coverage span{font-size:11px;color:var(--muted)}
.offcontrol{display:grid;grid-template-columns:minmax(140px,1.5fr) minmax(250px,2fr) 50px 72px 45px;gap:7px;align-items:center;background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--yellow);border-radius:10px;padding:8px;margin:8px 0}.conformBtns{display:grid;grid-template-columns:1fr 1fr;gap:5px}.conformBtns button,.choice button{border:1px solid var(--line);border-radius:8px;background:var(--panel2);color:var(--text);padding:10px;font-weight:800}.conformBtns .ok.sel{background:#1d7a46;color:#fff}.conformBtns .ko.sel{background:var(--red);color:#fff}.photo{border:1px solid var(--line);background:var(--panel2);color:var(--text);border-radius:8px;padding:10px 5px}.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;max-height:45vh;overflow:auto}.thumb{position:relative}.thumb img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px}.thumb button{position:absolute;right:4px;top:4px}
.radcard{background:var(--panel);border:1px solid var(--line);border-radius:12px;margin:12px 0;overflow:hidden}.radtitle{display:grid;grid-template-columns:auto minmax(160px,1fr) 45px;gap:8px;align-items:center;background:var(--yellow);color:#111;padding:9px;border-bottom:3px solid var(--red)}.step{display:grid;grid-template-columns:190px repeat(2,minmax(150px,1fr));gap:10px;align-items:end;padding:11px;border-bottom:1px solid var(--line)}.step>b{color:var(--red);align-self:center}.step label,.radfoot label{font-size:11px;font-weight:800}.choice{display:grid;grid-template-columns:1fr 1fr;gap:7px}.choice .sel{background:var(--yellow);color:#111;border-color:var(--yellow)}.driverfields{display:grid;grid-template-columns:1fr 1fr;gap:7px}.cage{grid-column:2/4}.radfoot{display:grid;grid-template-columns:1fr auto;gap:10px;padding:11px}.comment{border:1px solid var(--line);border-radius:8px;background:var(--panel2);color:var(--text);padding:10px}
.endchecks{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}.endchecks label{background:var(--panel);border:1px solid var(--line);border-top:4px solid var(--yellow);padding:14px;border-radius:10px;font-weight:800}.remaining input{min-width:110px}textarea.field{min-height:80px}
@media(max-width:700px){.quicknav{top:58px}.quicknav button{min-width:76px;padding:6px}.quicknav button b{font-size:19px}.dashhead{align-items:flex-start;flex-direction:column}.coverage{grid-template-columns:1fr 1fr}.coverage>div:last-child{grid-column:1/3}.flightrow{grid-template-columns:1.5fr .8fr .8fr 42px}.offcontrol{grid-template-columns:1fr 48px 62px 42px}.offcontrol .conformBtns{grid-column:1/5;grid-row:2}.step{grid-template-columns:1fr}.step>b{grid-column:1}.choice,.driverfields,.cage{grid-column:1}.radfoot{grid-template-columns:1fr}.endchecks{grid-template-columns:1fr}.homegrid{grid-template-columns:1fr 1fr}.big{grid-column:1/3}}

/* BETA 11 — CAL fermé : ligne compacte, verte, non modifiable */
.caluldinline.calclosedcompact{background:rgba(25,135,84,.12);border-top:2px solid var(--green);border-bottom:2px solid var(--green);padding:7px 10px;opacity:1}
.caluldinline.calclosedcompact .calmetrics{display:grid}
.caluldinline.calclosedcompact .caluldtop{margin:0}
.caluldinline.calclosedcompact .caluldtop:after{content:'FERMÉ';color:var(--green);font-weight:900;font-size:12px;align-self:center;justify-self:start}
.calmetric label,.calextra label{font-size:18px;color:var(--red);font-weight:900}
.caldestbar{background:var(--yellow);color:#111}
.caldestbar .muted{color:#111}
.caldestbar strong{color:#111}
.doclink{width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);font:inherit;text-align:left;cursor:pointer}
.radcard .step label{display:block}
.raduld{font-weight:900}

/* FIX 4 — CAL closed ULD: unmistakable compact green state */
.caluldinline.calclosedcompact{
 background:#b7e1cd !important;
 border:2px solid #4f9b62 !important;
 border-left:6px solid #2e7d32 !important;
 border-radius:8px !important;
 padding:7px 10px !important;
}
.caluldinline.calclosedcompact .calmetrics{gap:6px !important}
.caluldinline.calclosedcompact .calmetric{margin:0 !important}
.caluldinline.calclosedcompact .calqty button{display:none !important}
.caluldinline.calclosedcompact .calqty{font-weight:900 !important}
