:root{
  --navy:#0B2340;
  --navy-2:#123259;
  --navy-3:#1B4374;
  --gold:#D9A441;
  --gold-2:#F0C46A;
  --paper:#F6F4EE;
  --paper-2:#ffffff;
  --ink:#1C2530;
  --ink-soft:#5B6773;
  --line:#DDD6C6;
  --ok:#1F7A4D;
  --ok-bg:#E6F3EC;
  --warn:#B8791A;
  --warn-bg:#FBF0DD;
  --bad:#B23A2E;
  --bad-bg:#FBE9E6;
  --mono:'JetBrains Mono','SFMono-Regular',Consolas,monospace;
  --sans:'Inter',-apple-system,'Segoe UI',sans-serif;
}
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;700&display=swap');
*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:14px;}
#app{min-height:100vh;display:flex;flex-direction:column;}
button{font-family:var(--sans);cursor:pointer;}
input,select{font-family:var(--sans);}

.login-wrap{flex:1;display:flex;align-items:center;justify-content:center;background:
  radial-gradient(circle at 20% 15%, var(--navy-3) 0%, var(--navy) 45%, #081A30 100%);
  padding:24px;min-height:100vh;}
.login-card{background:var(--paper-2);width:380px;max-width:100%;border-radius:4px;padding:32px 28px 28px;
  box-shadow:0 30px 60px rgba(0,0,0,.35);border-top:4px solid var(--gold);position:relative;}
.login-brand{display:flex;align-items:center;gap:10px;margin-bottom:6px;}
.login-brand .mark{width:38px;height:38px;border-radius:8px;background:var(--navy);color:var(--gold);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;letter-spacing:.5px;}
.brand-logo-lg{height:44px;width:auto;max-width:220px;border-radius:6px;object-fit:contain;}
.brand-logo-sm{height:30px;width:auto;max-width:140px;border-radius:5px;object-fit:contain;margin-right:9px;}
.login-brand .name{font-weight:800;font-size:15px;letter-spacing:.5px;color:var(--navy);}
.login-brand .sub{font-size:11px;color:var(--ink-soft);letter-spacing:.5px;}
.login-title{font-size:12px;text-transform:uppercase;letter-spacing:1.5px;color:var(--ink-soft);margin:22px 0 14px;}
.field{margin-bottom:14px;}
.field label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--ink-soft);margin-bottom:5px;font-weight:600;}
.field select, .field input{width:100%;padding:10px 11px;border:1px solid var(--line);border-radius:3px;background:#FCFBF7;font-size:14px;color:var(--ink);}
.field select:focus, .field input:focus{outline:2px solid var(--navy-3);outline-offset:0;border-color:var(--navy-3);}
.btn{border:none;border-radius:3px;padding:10px 16px;font-weight:600;font-size:13px;letter-spacing:.2px;}
.btn-primary{background:var(--navy);color:#fff;width:100%;padding:12px;margin-top:6px;}
.btn-primary:hover{background:var(--navy-3);}
.btn-gold{background:var(--gold);color:var(--navy);}
.btn-gold:hover{background:var(--gold-2);}
.btn-outline{background:transparent;border:1px solid var(--line);color:var(--ink);}
.btn-outline:hover{border-color:var(--navy-3);color:var(--navy-3);}
.btn-danger{background:var(--bad-bg);color:var(--bad);border:1px solid #EFC7C1;}
.login-err{background:var(--bad-bg);color:var(--bad);font-size:12.5px;padding:9px 11px;border-radius:3px;margin-bottom:14px;}
.login-hint{margin-top:16px;font-size:11px;color:var(--ink-soft);text-align:center;line-height:1.5;}

.topbar{background:var(--navy);color:#fff;display:flex;align-items:center;padding:0 20px;height:56px;flex-shrink:0;
  box-shadow:0 2px 10px rgba(0,0,0,.15);position:sticky;top:0;z-index:20;}
.topbar .mark{width:30px;height:30px;border-radius:6px;background:var(--gold);color:var(--navy);display:flex;align-items:center;
  justify-content:center;font-weight:800;font-size:12px;margin-right:9px;}
.topbar .brand{font-weight:800;font-size:14px;letter-spacing:.3px;margin-right:4px;}
.topbar .brand-sub{font-size:10.5px;color:#9FB3CC;letter-spacing:.3px;margin-right:26px;}
.tabs{display:flex;gap:2px;flex:1;height:100%;overflow-x:auto;}
.tab{color:#B9C7DA;background:transparent;border:none;padding:0 15px;height:100%;font-size:12.5px;font-weight:600;
  letter-spacing:.2px;border-bottom:3px solid transparent;display:flex;align-items:center;white-space:nowrap;}
.tab:hover{color:#fff;}
.tab.active{color:#fff;border-bottom-color:var(--gold);}
.who{display:flex;align-items:center;gap:12px;flex-shrink:0;}
.who .name{font-size:12.5px;font-weight:600;}
.who .role{font-size:10px;color:var(--gold-2);text-transform:uppercase;letter-spacing:.6px;}
.who button{background:transparent;border:1px solid #2C4E77;color:#CFDCEB;border-radius:3px;padding:6px 11px;font-size:11.5px;}
.who button:hover{border-color:var(--gold);color:var(--gold-2);}

main{flex:1;padding:22px 26px 60px;max-width:1320px;width:100%;margin:0 auto;}
.pagehead{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:18px;flex-wrap:wrap;gap:10px;}
.pagehead h1{font-size:19px;margin:0;color:var(--navy);}
.pagehead .desc{font-size:12.5px;color:var(--ink-soft);margin-top:3px;}
.panel{background:var(--paper-2);border:1px solid var(--line);border-radius:5px;padding:20px;margin-bottom:18px;}
.panel h2{font-size:13px;text-transform:uppercase;letter-spacing:.8px;color:var(--navy);margin:0 0 16px;
  padding-bottom:10px;border-bottom:1px solid var(--line);}
.grid{display:grid;gap:12px;}
.grid-2{grid-template-columns:1fr 1fr;}
.grid-3{grid-template-columns:1fr 1fr 1fr;}
.grid-4{grid-template-columns:repeat(4,1fr);}
@media(max-width:780px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}}

table{width:100%;border-collapse:collapse;font-size:12.8px;}
th{text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--ink-soft);
  padding:8px 10px;border-bottom:2px solid var(--line);font-weight:700;white-space:nowrap;}
td{padding:9px 10px;border-bottom:1px solid #EFEBDF;vertical-align:middle;}
tr:hover td{background:#FBFAF5;}
.mono{font-family:var(--mono);}
.tablewrap{overflow-x:auto;}

.badge{display:inline-block;padding:3px 9px;border-radius:20px;font-size:10.5px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;}
.badge-wait{background:var(--warn-bg);color:var(--warn);}
.badge-paid{background:var(--ok-bg);color:var(--ok);}
.badge-void{background:var(--bad-bg);color:var(--bad);}
tr.row-void td{color:var(--bad);opacity:.85;}
tr.row-void{border-bottom:2px solid var(--bad);background:var(--bad-bg);}

.kpi{background:var(--paper-2);border:1px solid var(--line);border-left:4px solid var(--navy);border-radius:5px;padding:14px 16px;}
.kpi .lbl{font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--ink-soft);font-weight:700;}
.kpi .val{font-size:23px;font-weight:800;color:var(--navy);margin-top:5px;font-family:var(--mono);}
.kpi.gold{border-left-color:var(--gold);}
.kpi.ok{border-left-color:var(--ok);}
.kpi.bad{border-left-color:var(--bad);}

.empty{padding:30px;text-align:center;color:var(--ink-soft);font-size:13px;}
.toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px;}
.toolbar input,.toolbar select{padding:8px 10px;border:1px solid var(--line);border-radius:3px;font-size:12.5px;background:#FCFBF7;}
.spacer{flex:1;}
.small{font-size:11.5px;color:var(--ink-soft);}

.overlay{position:fixed;inset:0;background:rgba(11,35,64,.55);display:flex;align-items:flex-start;justify-content:center;
  padding:40px 16px;z-index:50;overflow-y:auto;}
.modal{background:var(--paper-2);width:520px;max-width:100%;border-radius:6px;padding:24px;box-shadow:0 30px 60px rgba(0,0,0,.4);}
.modal h3{margin:0 0 4px;color:var(--navy);font-size:16px;}
.modal .sub{font-size:12px;color:var(--ink-soft);margin-bottom:16px;}
.modal-actions{display:flex;gap:10px;margin-top:18px;justify-content:flex-end;}

.ticket{border:1.5px dashed var(--navy-3);border-radius:6px;padding:20px;background:
  repeating-linear-gradient(135deg, #fff 0 2px, #FBFAF5 2px 4px);position:relative;}
.ticket-head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:2px solid var(--navy);
  padding-bottom:10px;margin-bottom:12px;flex-wrap:nowrap;gap:8px;}
.ticket-head > div:first-child{min-width:0;}
.ticket-head .co{font-weight:800;color:var(--navy);font-size:15px;letter-spacing:.3px;overflow-wrap:break-word;}
.ticket-head .co-sub{font-size:10.5px;color:var(--ink-soft);}
.ticket-head .serial{font-family:var(--mono);font-weight:700;color:var(--gold);background:var(--navy);padding:5px 10px;border-radius:3px;font-size:13px;white-space:nowrap;flex-shrink:0;margin-left:10px;}
.ticket-logo{display:block;height:32px;width:auto;max-width:160px;object-fit:contain;margin-bottom:6px;}
.ticket-row{display:flex;justify-content:space-between;padding:5px 0;font-size:12.8px;border-bottom:1px dotted #E3DECF;}
.ticket-row .k{color:var(--ink-soft);}
.ticket-row .v{font-weight:600;font-family:var(--mono);}
.ticket-total{margin-top:12px;padding-top:10px;border-top:2px solid var(--navy);display:flex;justify-content:space-between;
  align-items:center;}
.ticket-total .k{font-weight:700;color:var(--navy);text-transform:uppercase;font-size:12px;letter-spacing:.4px;}
.ticket-total .v{font-family:var(--mono);font-weight:800;font-size:19px;color:var(--navy);}
.ticket-signature{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line);display:flex;justify-content:space-between;align-items:flex-end;gap:10px;}
.ticket-signature-name{font-size:15px;color:var(--navy);font-weight:700;font-style:italic;white-space:nowrap;}
.ticket-stamp{margin-top:12px;border:1px dashed var(--line);border-radius:4px;height:64px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;}
.ticket-stamp-label{font-size:10px;color:var(--ink-soft);text-transform:uppercase;letter-spacing:.6px;}

.note-box{background:#F0F6FB;border:1px solid #C9DEEF;border-radius:4px;padding:12px 14px;font-size:12px;color:#284A66;line-height:1.5;}
.warn-box{background:var(--warn-bg);border:1px solid #EAD3A0;border-radius:4px;padding:12px 14px;font-size:12px;color:var(--warn);line-height:1.5;}

.fiche-signature-name{font-style:italic;font-weight:700;color:var(--navy);}

.fiche-head{display:flex;align-items:center;gap:16px;border-bottom:2px solid var(--navy);padding-bottom:12px;margin-bottom:14px;}
.fiche-logo{height:48px;width:auto;max-width:170px;object-fit:contain;}
.fiche-title{flex:1;text-align:center;font-weight:800;font-size:16px;letter-spacing:.6px;color:var(--navy);}
.fiche-meta{width:100%;border-collapse:collapse;margin-bottom:14px;}
.fiche-meta td{border:1px solid var(--line);padding:6px 10px;font-size:12.5px;}
.fiche-meta .fk{background:#F6F4EE;font-weight:700;width:120px;color:var(--navy);}
.fiche-table{width:100%;border-collapse:collapse;margin-bottom:0;}
.fiche-table th{border:1px solid var(--line);background:#F6F4EE;color:var(--navy);font-size:10.5px;text-transform:uppercase;letter-spacing:.4px;padding:7px 8px;text-align:left;}
.fiche-table td{border:1px solid var(--line);padding:6px 8px;font-size:11.5px;}
.fiche-total{border:1px solid var(--line);border-top:none;background:#F6F4EE;padding:9px 10px;font-weight:800;color:var(--navy);font-size:12.5px;text-align:center;}
.fiche-sign{width:100%;border-collapse:collapse;margin-top:14px;}
.fiche-sign td{border:1px solid var(--line);padding:9px 10px;font-size:12.5px;}
.fiche-sign .fk{background:#F6F4EE;font-weight:700;width:120px;color:var(--navy);}

@media print{
  #printzoneFicheA4 .fiche-table th, #printzoneFicheA4Print .fiche-table th{ font-size:9.5px; }
  #printzoneFicheA4 .fiche-table td, #printzoneFicheA4Print .fiche-table td{ font-size:10.5px; }
  #printzoneFicheA4 .fiche-total, #printzoneFicheA4Print .fiche-total{ font-size:11.5px; }
  #printzoneFicheA4 img, #printzoneFicheA4Print img{ filter: grayscale(1) contrast(1.3); }
}

@media print{
  @page{ size: 80mm auto; margin: 1mm; }
  html, body{ width: 78mm; background:#fff; }
  body *{visibility:hidden;}
  #printzone,#printzone *{visibility:visible;}
  #printzone{
    position:absolute; top:0; left:0;
    width:78mm; margin:0; padding:0;
    box-shadow:none; border:none;
  }
  #printzone .no-print{ display:none !important; }
  #printzone h2{ display:none; }
  #printzone .note-box, #printzone .warn-box{
    background:none; border:none; padding:0 0 6px; font-size:11.5px; color:#000;
  }
  #printzone .ticket{
    max-width:none !important; width:100%;
    border:none; background:none; padding:0;
  }
  #printzone .ticket-head{ border-bottom:1.5px dashed #000; padding-bottom:7px; margin-bottom:9px; }
  #printzone .ticket-head .co{ font-size:16px; letter-spacing:.4px; }
  #printzone .ticket-head .co-sub{ font-size:10.5px; }
  #printzone .ticket-head .serial{ background:none; color:#000; border:1.5px solid #000; font-size:13.5px; padding:3px 8px; white-space:nowrap; flex-shrink:0; letter-spacing:.3px; }
  #printzone .ticket-logo{ height:32px; }
  #printzone .ticket-row{ font-size:13.5px; padding:5px 0; border-bottom:1px dotted #999; line-height:1.45; }
  #printzone .ticket-row .k{ color:#333; }
  #printzone .ticket-row .v{ color:#000; font-weight:700; }
  #printzone .ticket-total{ border-top:2px solid #000; margin-top:9px; padding-top:9px; }
  #printzone .ticket-total .k{ color:#000; font-size:13px; }
  #printzone .ticket-total .v{ font-size:21px; color:#000; }
  #printzone .ticket-signature{ margin-top:14px; padding-top:9px; border-top:1px dashed #000; }
  #printzone .ticket-signature .small{ font-size:10.5px; color:#333; }
  #printzone .ticket-signature-name{ font-size:16px; color:#000; }
  #printzone .ticket-stamp{ height:100px; border:1px dashed #000; margin-top:14px; }
  #printzone .ticket-stamp-label{ font-size:10px; color:#555; }
  #printzone img{ filter: grayscale(1) contrast(1.4); }
}
#printzoneA4Dup{ display:none; }
#printzoneFicheA4Print{ display:none; }
.a4-copy{padding:6mm 8mm;}
.a4-copy-label{text-align:center;font-size:11px;text-transform:uppercase;letter-spacing:1.2px;color:var(--ink-soft);margin-bottom:8px;font-weight:700;}
.a4-cutline{display:flex;align-items:center;justify-content:center;border-top:1px dashed #999;margin:5mm 0;position:relative;height:0;}
.a4-cutline span{background:#fff;padding:0 12px;font-size:10px;color:#999;position:relative;top:-8px;white-space:nowrap;}
@media print{
  #printzoneA4Dup{ font-size:12px; }
  #printzoneA4Dup .ticket{ max-width:160mm !important; margin:0 auto; border:1px solid #ccc; background:none; padding:11px 18px; }
  #printzoneA4Dup .ticket-head{ padding-bottom:5px; margin-bottom:6px; }
  #printzoneA4Dup .ticket-head .co{ font-size:14.5px; }
  #printzoneA4Dup .ticket-head .co-sub{ font-size:9px; }
  #printzoneA4Dup .ticket-head .serial{ font-size:11.5px; padding:2px 7px; }
  #printzoneA4Dup .ticket-logo{ height:28px; margin-bottom:0; }
  #printzoneA4Dup .ticket-row{ font-size:11px; padding:2.5px 0; line-height:1.2; }
  #printzoneA4Dup .ticket-total{ margin-top:5px; padding-top:5px; }
  #printzoneA4Dup .ticket-total .k{ font-size:10.5px; }
  #printzoneA4Dup .ticket-total .v{ font-size:16px; }
  #printzoneA4Dup .ticket-signature{ margin-top:6px; padding-top:5px; }
  #printzoneA4Dup .ticket-signature .small{ font-size:9px; }
  #printzoneA4Dup .ticket-signature-name{ font-size:12.5px; }
  #printzoneA4Dup .ticket-stamp{ height:36px; margin-top:6px; }
  #printzoneA4Dup .ticket-stamp-label{ font-size:8.5px; }
  #printzoneA4Dup .a4-copy{ page-break-inside:avoid; padding:3mm 6mm; }
  #printzoneA4Dup .a4-cutline{ page-break-inside:avoid; margin:3mm 0 !important; }
  #printzoneA4Dup img{ filter: grayscale(1) contrast(1.3); }
}
::-webkit-scrollbar{height:8px;width:8px;}
::-webkit-scrollbar-thumb{background:#CDBF9E;border-radius:4px;}
