/* SWIQ — kit commun aux applications (back-office, agents, badge, accréditation, link) */
:root { --maroon:#8A1538; --green:#00853F; --gold:#FDEF42; --red:#E31B23; --night:#0E0E10; --sand:#F4EDE4; --white:#fff; --stone:#6B6460; --line:rgba(14,14,16,.08);
  --display:'Archivo Black','Archivo',system-ui,sans-serif; --head:'Archivo',system-ui,sans-serif; --body:'Inter',system-ui,sans-serif;
  --weave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cg fill='%23FFFFFF'%3E%3Cpath fill-rule='evenodd' d='M40 8L72 40L40 72L8 40Z M40 17L17 40L40 63L63 40Z'/%3E%3Cpath d='M40 32L48 40L40 48L32 40Z'/%3E%3Cpath d='M0 0h6L0 6Z M80 0v6L74 0Z M0 80v-6L6 80Z M80 80h-6L80 74Z'/%3E%3C/g%3E%3C/svg%3E"); }
*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; font:15px/1.5 var(--body); color:var(--night); background:var(--sand); -webkit-font-smoothing:antialiased; }
html[dir=rtl] body { font-family:'Cairo',var(--body); }
button,input,select,textarea { font:inherit; color:inherit; }
button { cursor:pointer; }
a { color:inherit; }
:focus-visible { outline:3px solid var(--gold); outline-offset:2px; }
.h1 { font:400 32px/1.1 var(--display); letter-spacing:-.02em; margin:0; }
.h2 { font:800 18px/1.25 var(--head); margin:0; }
.muted { color:var(--stone); }
.eyebrow { font:700 11px/1.3 var(--head); letter-spacing:.18em; text-transform:uppercase; color:var(--maroon); margin:0 0 6px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid transparent; border-radius:10px; padding:10px 16px; font:600 14px/1 var(--body); text-decoration:none; background:var(--maroon); color:#fff; white-space:nowrap; transition:filter .15s, transform .15s; }
.btn:hover { filter:brightness(1.08); } .btn:active { transform:translateY(1px); } .btn:disabled { opacity:.55; cursor:not-allowed; }
.btn--ghost { background:#fff; color:var(--night); border-color:rgba(14,14,16,.15); }
.btn--gold { background:var(--gold); color:var(--night); } .btn--green { background:var(--green); } .btn--red { background:var(--red); } .btn--night { background:var(--night); }
.btn--sm { padding:7px 11px; font-size:13px; border-radius:8px; } .btn--lg { padding:15px 22px; font-size:16px; border-radius:14px; } .btn--block { width:100%; }
.icon { width:18px; height:18px; flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.card { background:#fff; border-radius:18px; padding:22px; }
.chip { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; font:600 12px/1.3 var(--body); white-space:nowrap; }
.chip::before { content:''; width:7px; height:7px; border-radius:50%; background:currentColor; }
.chip--plain::before { display:none; }
.c-maroon { background:rgba(138,21,56,.12); color:var(--maroon); } .c-green { background:rgba(0,133,63,.12); color:var(--green); } .c-gold { background:rgba(253,239,66,.45); color:var(--night); }
.c-red { background:rgba(227,27,35,.12); color:var(--red); } .c-night { background:rgba(14,14,16,.1); color:var(--night); } .c-stone { background:rgba(107,100,96,.14); color:var(--stone); }
.bg-maroon { background:var(--maroon); color:#fff; } .bg-green { background:var(--green); color:#fff; } .bg-gold { background:var(--gold); color:var(--night); } .bg-red { background:var(--red); color:#fff; } .bg-night { background:var(--night); color:#fff; } .bg-stone { background:var(--stone); color:#fff; }
.field { display:grid; gap:6px; font-size:13px; font-weight:600; }
.input, .field input, .field select, .field textarea { width:100%; background:var(--sand); border:1.5px solid transparent; border-radius:10px; padding:11px 13px; font:400 14.5px var(--body); }
.field input:focus, .field select:focus, .field textarea:focus, .input:focus { outline:none; border-color:var(--maroon); background:#fff; }
.field.is-invalid input, .field.is-invalid select { border-color:var(--red); }
.toggle { position:relative; display:inline-block; vertical-align:middle; width:44px; height:26px; flex:0 0 auto; }
.toggle input { position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.toggle span { position:absolute; inset:0; border-radius:13px; background:#e4dcd2; transition:background .15s; pointer-events:none; }
.toggle span::after { content:''; position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#fff; transition:transform .15s; box-shadow:0 1px 3px rgba(0,0,0,.2); }
.toggle input:checked + span { background:var(--green); } .toggle input:checked + span::after { transform:translateX(18px); }
.zq { display:inline-grid; place-items:center; width:24px; height:24px; border-radius:6px; font:700 11px var(--head); background:var(--sand); color:var(--stone); opacity:.65; }
.zq.on { background:var(--night); color:#fff; opacity:1; }
.tri { height:4px; background:linear-gradient(90deg,var(--green) 33.3%,var(--gold) 33.3% 66.6%,var(--red) 66.6%); }
.toast { position:fixed; left:50%; bottom:24px; transform:translateX(-50%); background:var(--night); color:#fff; padding:12px 18px; border-radius:12px; font-weight:600; z-index:999; box-shadow:0 12px 30px rgba(0,0,0,.3); max-width:calc(100% - 32px); }
.toast--err { background:var(--red); } .toast--ok { background:var(--green); }
.weave-bg { position:relative; isolation:isolate; } .weave-bg::before { content:''; position:absolute; inset:0; z-index:-1; background-image:var(--weave); background-size:80px; opacity:.05; pointer-events:none; }
.empty { padding:40px; text-align:center; color:var(--stone); }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }