:root{
  --bg:#0c0b09;--surface:#1a1814;--panel:#2a2720;--border:#3d3a30;--border2:#5c5849;
  --accent:#2d5a3d;--ag:rgba(45,90,61,0.15);
  --blue:#6a9ab8;--green:#4e9c69;--yellow:#d4a843;--red:#8b4a2e;--purple:#a8c5d4;
  --text:#f2ede5;--muted:#857f6e;--muted2:#a89f8c;--carabiner:#d4a843;
}
*{margin:0;padding:0;box-sizing:border-box;}
body{background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;min-height:100vh;overflow-x:hidden;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");}
::-webkit-scrollbar{width:5px;}::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px;}

/* PAGE SYSTEM */
.page{display:none;min-height:100vh;}
.page.active{display:block;}
#page-login.active{display:grid;grid-template-columns:1fr 1fr;}

/* TOPBAR */
.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;border-bottom:1px solid var(--border);background:rgba(15,15,15,0.95);backdrop-filter:blur(12px);position:sticky;top:0;z-index:50;gap:8px;}
.topbar-l{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.logo{font-family:'Syne',sans-serif;font-weight:800;font-size:1rem;letter-spacing:3px;color:var(--accent);}
.logo span{color:var(--text);}
.role-tag{font-size:0.62rem;padding:2px 8px;border-radius:10px;text-transform:uppercase;letter-spacing:1px;background:var(--ag);color:var(--accent);border:1px solid rgba(232,82,10,0.3);white-space:nowrap;}
.role-tag.emp{background:rgba(74,158,255,0.1);color:var(--blue);border-color:rgba(74,158,255,0.25);}
.topbar-r{display:flex;align-items:center;gap:5px;flex-wrap:wrap;justify-content:flex-end;}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:6px;font-family:'Epilogue',sans-serif;font-size:0.78rem;font-weight:600;padding:7px 14px;border-radius:6px;border:none;cursor:pointer;transition:all 0.15s;text-transform:uppercase;letter-spacing:0.8px;}
.btn-primary{background:var(--accent);color:white;}.btn-primary:hover{background:#cc4709;}
.btn-ghost{background:none;border:1px solid var(--border2);color:var(--muted2);}.btn-ghost:hover{border-color:#555;color:var(--text);}
.btn-green{background:rgba(62,207,142,0.12);border:1px solid rgba(62,207,142,0.3);color:var(--green);}.btn-green:hover{background:rgba(62,207,142,0.22);}
.btn-yellow{background:rgba(240,180,41,0.1);border:1px solid rgba(240,180,41,0.3);color:var(--yellow);}.btn-yellow:hover{background:rgba(240,180,41,0.2);}
.btn-red{background:rgba(229,83,83,0.1);border:1px solid rgba(229,83,83,0.3);color:var(--red);}.btn-red:hover{background:rgba(229,83,83,0.2);}
.btn-sm{padding:5px 11px;font-size:0.7rem;}

/* BADGES */
.badge{font-size:0.63rem;padding:0 8px;height:24px;border-radius:4px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;display:inline-flex;align-items:center;gap:4px;}
.b-ok{background:rgba(62,207,142,0.12);color:var(--green);border:1px solid rgba(62,207,142,0.25);}
.b-warn{background:rgba(240,180,41,0.1);color:var(--yellow);border:1px solid rgba(240,180,41,0.25);}
.b-emp{background:rgba(74,158,255,0.1);color:var(--blue);border:1px solid rgba(74,158,255,0.25);}
.b-crit{background:rgba(232,82,10,0.15);color:#e8956a;border:1px solid rgba(232,82,10,0.4);}
.b-pend{background:rgba(167,139,250,0.1);color:var(--purple);border:1px solid rgba(167,139,250,0.25);}
.b-grey{background:rgba(100,100,100,0.1);color:var(--muted2);border:1px solid var(--border2);}
.b-ref{background:rgba(232,82,10,0.15);color:var(--accent);border:1px solid rgba(232,82,10,0.3);}
.b-ls{background:rgba(74,158,255,0.1);color:var(--blue);border:1px solid rgba(74,158,255,0.25);}

/* CONTENT */
.content{padding:24px 28px;}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:22px;}
.sc{background:var(--surface);border:1px solid var(--border);border-radius:9px;padding:14px 16px;position:relative;overflow:hidden;}
.sc::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;}
.sc.o::after{background:var(--accent);}.sc.b::after{background:var(--blue);}.sc.g::after{background:var(--green);}.sc.y::after{background:var(--yellow);}.sc.r::after{background:var(--red);}
.sc-num{font-family:'Syne',sans-serif;font-size:1.8rem;font-weight:800;}
.sc-lbl{font-size:0.68rem;color:var(--muted2);text-transform:uppercase;letter-spacing:1px;margin-top:2px;}
.sc-icon{position:absolute;top:12px;right:12px;font-size:1.3rem;opacity:0.18;}
.section-hd{font-family:'Syne',sans-serif;font-size:1rem;font-weight:700;margin-bottom:16px;display:flex;align-items:center;gap:10px;}
.section-hd::after{content:'';flex:1;height:1px;background:var(--border);}

/* FILTER TABS */
.filter-tabs{display:flex;gap:5px;margin-bottom:14px;flex-wrap:wrap;}
.ftab{background:var(--panel);border:1px solid var(--border);color:var(--muted2);font-size:0.7rem;padding:5px 12px;border-radius:18px;cursor:pointer;transition:all 0.15s;font-family:'Epilogue',sans-serif;text-transform:uppercase;letter-spacing:1px;}
.ftab:hover{color:var(--text);}
.ftab.active{background:var(--accent);border-color:var(--accent);color:white;}
.search-wrap{position:relative;flex:1;}
.search-wrap::before{content:'🔍';position:absolute;left:10px;top:50%;transform:translateY(-50%);font-size:0.75rem;pointer-events:none;}
.s-input{width:100%;background:var(--panel);border:1px solid var(--border);color:var(--text);font-family:'Epilogue',sans-serif;font-size:0.83rem;padding:8px 12px 8px 32px;border-radius:7px;outline:none;transition:border-color 0.2s;}
.s-input:focus{border-color:var(--accent);}
.search-row{display:flex;gap:9px;margin-bottom:16px;}

/* OVERLAYS / MODALS */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,0.85);backdrop-filter:blur(5px);z-index:200;display:none;align-items:center;justify-content:center;padding:14px;}
.overlay.open{display:flex;}
.modal{background:#1a1a1a;border:1px solid var(--border);border-radius:13px;width:100%;max-width:490px;overflow:hidden;animation:up .22s ease;max-height:90vh;display:flex;flex-direction:column;}
@keyframes up{from{transform:translateY(18px);opacity:0}to{transform:translateY(0);opacity:1}}
.modal-hd{background:var(--panel);padding:16px 22px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border);flex-shrink:0;}
.modal-hd h3{font-family:'Syne',sans-serif;font-size:1rem;font-weight:700;}
.modal-x{background:none;border:none;color:var(--muted2);font-size:1rem;cursor:pointer;width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;}
.modal-x:hover{background:var(--border);color:var(--text);}
.modal-body{padding:20px;overflow-y:auto;}
.modal-ft{padding:13px 20px;border-top:1px solid var(--border);display:flex;gap:9px;justify-content:flex-end;flex-shrink:0;}

/* FIELDS */
.field{margin-bottom:13px;}
.field label{display:block;font-size:0.68rem;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted2);margin-bottom:5px;font-weight:500;}
.field label .req{color:var(--accent);}
.field input,.field select,.field textarea{width:100%;background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:'Epilogue',sans-serif;font-size:0.86rem;padding:8px 12px;border-radius:7px;outline:none;transition:border-color 0.2s;}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--accent);}
.field input::placeholder,.field textarea::placeholder{color:var(--muted);}
.field select option{background:var(--bg);}
.field textarea{resize:vertical;min-height:68px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:11px;align-items:end;}

/* TOAST */
.toast{position:fixed;bottom:22px;right:22px;font-weight:600;font-size:0.8rem;padding:10px 18px;border-radius:8px;transform:translateY(60px);opacity:0;transition:all 0.3s cubic-bezier(0.34,1.56,0.64,1);z-index:999;pointer-events:none;}
.toast.show{transform:translateY(0);opacity:1;}
.toast.ok{background:var(--green);color:#0a0a0a;}.toast.warn{background:var(--yellow);color:#0a0a0a;}.toast.err{background:var(--red);color:white;}

/* CONFIRM */
.confirm-center{text-align:center;padding:10px 4px 4px;}
.confirm-icon{font-size:2.6rem;margin-bottom:10px;}
.confirm-icon svg{width:2.6rem;height:2.6rem;vertical-align:middle;}
.confirm-center h4{font-family:'Syne',sans-serif;font-size:1.05rem;margin-bottom:7px;}
.confirm-center p{font-size:0.8rem;color:var(--muted2);}

/* EMPTY */
.empty-state{text-align:center;padding:50px 20px;color:var(--muted2);}
.empty-state .ei{font-size:2.8rem;margin-bottom:10px;}
.empty-state h3{color:var(--text);margin-bottom:5px;}

/* ================================================
   LOGIN
================================================ */
.login-left{background:var(--surface);padding:48px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;}
.login-left::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 20% 80%,rgba(232,82,10,0.1) 0%,transparent 55%),radial-gradient(ellipse at 80% 10%,rgba(232,82,10,0.05) 0%,transparent 50%);pointer-events:none;}
.login-left>*{position:relative;z-index:1;}
.ll-logo{font-family:'Syne',sans-serif;font-weight:800;font-size:1.3rem;letter-spacing:4px;color:var(--accent);}
.ll-logo span{color:var(--text);}
.lf-mobile-logo{display:none;font-family:'Syne',sans-serif;font-weight:800;font-size:1.4rem;letter-spacing:4px;color:var(--accent);text-align:center;margin-bottom:24px;}
.lf-mobile-logo span{color:var(--text);}
.ll-dot{display:inline-block;width:8px;height:8px;background:var(--accent);border-radius:50%;margin-right:10px;animation:pulse 2s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.4;transform:scale(0.6);}}
.ll-hero h1{font-family:'Syne',sans-serif;font-weight:800;font-size:clamp(2.5rem,4vw,4rem);line-height:0.95;letter-spacing:-1px;margin-bottom:18px;}
.ll-hero h1 em{display:block;color:var(--accent);font-style:italic;font-family:'Epilogue',sans-serif;font-weight:300;font-size:0.6em;letter-spacing:2px;margin-bottom:4px;}
.ll-hero p{color:var(--muted2);font-size:0.88rem;line-height:1.7;max-width:320px;}
.ll-features{display:flex;flex-direction:column;gap:9px;margin-top:28px;}
.ll-feat{display:flex;align-items:center;gap:10px;padding:11px 14px;background:rgba(255,255,255,0.03);border:1px solid var(--border);border-radius:8px;font-size:0.8rem;}
.ll-feat-ic{width:30px;height:30px;border-radius:6px;background:var(--ag);border:1px solid rgba(232,82,10,0.2);display:flex;align-items:center;justify-content:center;font-size:0.9rem;flex-shrink:0;}
.ll-feat-txt{color:var(--muted2);}.ll-feat-txt strong{color:var(--text);display:block;margin-bottom:1px;}
.ll-footer{font-size:0.7rem;color:var(--muted);}
.login-right{display:flex;align-items:center;justify-content:center;padding:48px 50px;overflow-y:auto;}
.lf-wrap{width:100%;max-width:370px;}
.lf-tabs{display:flex;background:var(--panel);border:1px solid var(--border);border-radius:9px;padding:3px;margin-bottom:28px;}
.lf-tab{flex:1;text-align:center;padding:8px;border-radius:7px;font-size:0.78rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;cursor:pointer;transition:all 0.2s;color:var(--muted2);user-select:none;}
.lf-tab.active{background:var(--accent);color:white;}
.lf-view{display:none;}.lf-view.active{display:block;}
.lf-link{background:none;border:none;color:var(--muted2);font-size:0.78rem;cursor:pointer;text-decoration:underline;padding:0;font-family:inherit;}
.lf-link:hover{color:var(--text);}
.lf-title{font-family:'Syne',sans-serif;font-size:1.45rem;font-weight:800;margin-bottom:3px;}
.lf-sub{font-size:0.82rem;color:var(--muted2);margin-bottom:24px;line-height:1.5;}
.lf-alert{padding:10px 13px;border-radius:7px;font-size:0.8rem;margin-bottom:12px;display:none;}
.lf-alert.show{display:block;}
.lf-alert.err{background:rgba(229,83,83,0.1);border:1px solid rgba(229,83,83,0.3);color:#e87070;}
.lf-alert.ok{background:rgba(62,207,142,0.1);border:1px solid rgba(62,207,142,0.3);color:var(--green);}
.lf-inp-wrap{display:flex;align-items:center;background:var(--panel);border:1px solid var(--border);border-radius:7px;transition:border-color 0.2s;gap:8px;padding-left:12px;}
.lf-inp-wrap:focus-within{border-color:var(--accent);}
.lf-inp-icon{flex-shrink:0;display:flex;align-items:center;color:var(--muted2);font-size:0.88rem;pointer-events:none;}
.lf-inp{flex:1;width:100%;background:var(--bg) !important;border:none;color:var(--text) !important;font-family:'Epilogue',sans-serif;font-size:0.86rem;padding:10px 12px 10px 0;outline:none;-webkit-appearance:none;appearance:none;}
.lf-inp:focus{border-color:transparent;outline:none;}
.lf-inp::placeholder{color:var(--muted);}
.lf-inp:-webkit-autofill,.lf-inp:-webkit-autofill:hover,.lf-inp:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 1000px var(--bg) inset !important;-webkit-text-fill-color:var(--text) !important;caret-color:var(--text);}
.role-sel{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:5px;}
.role-opt{background:var(--panel);border:1px solid var(--border);border-radius:7px;padding:11px 9px;cursor:pointer;transition:all 0.2s;text-align:center;user-select:none;}
.role-opt:hover{border-color:var(--border2);}
.role-opt.selected{border-color:var(--accent);background:var(--ag);}
.role-opt input{display:none;}
.ro-icon{font-size:1.3rem;margin-bottom:4px;}
.ro-name{font-size:0.76rem;font-weight:600;display:block;}
.ro-desc{font-size:0.65rem;color:var(--muted2);display:block;margin-top:1px;}
.btn-submit{width:100%;background:var(--accent);border:none;color:white;font-family:'Syne',sans-serif;font-size:0.86rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:12px;border-radius:7px;cursor:pointer;margin-top:5px;transition:all 0.2s;}
.btn-submit:hover{background:#cc4709;transform:translateY(-1px);}
.demo-box{background:rgba(62,207,142,0.05);border:1px solid rgba(62,207,142,0.18);border-radius:7px;padding:11px 13px;margin-top:14px;}
.demo-ttl{font-size:0.68rem;text-transform:uppercase;letter-spacing:1px;color:var(--green);margin-bottom:7px;font-weight:600;}
.demo-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0;font-size:0.76rem;color:var(--muted2);border-bottom:1px solid rgba(255,255,255,0.04);}
.demo-row:last-child{border:none;}
.demo-row strong{color:var(--text);}
.demo-use{background:none;border:none;color:var(--muted);font-size:0.68rem;cursor:pointer;text-decoration:underline;}
.demo-use:hover{color:var(--text);}

/* ================================================
   CATALOGUE
================================================ */
.hero-zone{padding:16px 28px 18px;position:relative;overflow:hidden;border-bottom:1px solid var(--border);}
.hero-zone::before{content:'';position:absolute;right:-60px;top:-60px;width:360px;height:360px;background:radial-gradient(circle,rgba(232,82,10,0.07) 0%,transparent 70%);pointer-events:none;}
.hero-brand{display:none;font-family:'Syne',sans-serif;font-size:0.65rem;font-weight:700;letter-spacing:4px;color:var(--muted2);text-transform:uppercase;margin-bottom:8px;}
.hero-brand span{color:var(--accent);}
.hero-title{font-family:'Syne',sans-serif;font-weight:800;font-size:clamp(1rem,2.8vw,2rem);line-height:0.95;letter-spacing:-1px;}
.hero-title em{color:var(--accent);font-style:normal;}
.hero-sub{color:var(--muted2);margin-top:8px;font-size:0.88rem;max-width:400px;}
.hero-stats{display:flex;gap:30px;margin-top:10px;padding-top:10px;border-top:1px solid var(--border);}
.hs{text-align:center;}
.hs-num{font-family:'Syne',sans-serif;font-size:1.2rem;font-weight:800;color:var(--accent);display:block;}
.hs-lbl{font-size:0.7rem;color:var(--muted2);text-transform:uppercase;letter-spacing:1px;}

.cat-tabs{display:flex;gap:6px;flex-wrap:wrap;padding:20px 28px 0;}
.cat-tab{background:var(--panel);border:1px solid var(--border);color:var(--muted2);font-family:'Epilogue',sans-serif;font-size:0.72rem;padding:5px 13px;border-radius:18px;cursor:pointer;transition:all 0.15s;text-transform:uppercase;letter-spacing:1px;}
.cat-tab:hover{color:var(--text);}
.cat-tab.active{background:var(--accent);border-color:var(--accent);color:white;}
.cat-search{padding:13px 28px 0;}

.eq-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(265px,1fr));gap:13px;padding:18px 28px 60px;}

/* EQUIPMENT CARD */
.eq-card{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:18px;transition:transform 0.15s,border-color 0.15s;position:relative;overflow:hidden;display:flex;flex-direction:column;will-change:transform;}
.eq-card:hover{transform:translateY(-2px);border-color:var(--border2);}
.eq-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform 0.25s;}
.eq-card:hover::before{transform:scaleX(1);}
.eq-card.busy{opacity:0.75;}
.eq-card.reserved{border-left:3px solid var(--yellow);}
.eq-card.emprunte{border-left:3px solid var(--red);}
.eq-hd{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px;}
.eq-ico{font-size:1.7rem;}
.eq-nm{font-weight:600;font-size:0.95rem;margin-bottom:2px;}
.eq-br{font-size:0.76rem;color:var(--muted2);margin-bottom:9px;}
.eq-specs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:10px;}
.eq-spec{background:rgba(255,255,255,0.05);border-radius:3px;padding:2px 7px;font-size:0.7rem;color:var(--muted2);}
.eq-who{font-size:0.75rem;color:var(--yellow);margin-bottom:2px;display:flex;align-items:center;gap:5px;}
.eq-who.emprunte-who{color:var(--red);}
.eq-retour{font-size:0.7rem;color:var(--muted2);margin-bottom:4px;}
.eq-jours{margin:8px 0 11px;margin-top:auto;}
.eq-jours-top{display:flex;justify-content:space-between;margin-bottom:4px;}
.eq-jours-lbl{font-size:0.65rem;color:var(--muted2);text-transform:uppercase;letter-spacing:0.8px;}
.eq-jours-val{font-size:0.72rem;font-weight:700;color:var(--accent);}
.eq-jours-bar{height:3px;background:var(--border);border-radius:2px;overflow:hidden;}
.eq-jours-fill{height:100%;background:linear-gradient(90deg,var(--accent),#ff8c42);border-radius:2px;transition:width 0.5s;}
.btn-res{width:100%;background:rgba(232,82,10,0.18);border:1px solid rgba(232,82,10,0.35);color:var(--accent);font-family:'Epilogue',sans-serif;font-size:0.8rem;font-weight:600;padding:9px;border-radius:6px;cursor:pointer;text-transform:uppercase;letter-spacing:1px;transition:background 0.15s;}
.btn-res:hover{background:rgba(232,82,10,0.32);}
.btn-res:disabled{background:var(--border);color:var(--muted);cursor:not-allowed;}
.btn-cancel-res{width:100%;background:none;border:1px solid rgba(229,83,83,0.35);color:var(--red);font-family:'Epilogue',sans-serif;font-size:0.78rem;font-weight:600;padding:7px;border-radius:6px;cursor:pointer;text-transform:uppercase;letter-spacing:1px;transition:all 0.15s;margin-top:6px;}
.btn-cancel-res:hover{background:rgba(229,83,83,0.1);}

/* VIEW TABS */
.view-tabs{display:flex;gap:4px;align-items:center;}
.d-none{display:none!important;}
.view-tab{background:none;border:1px solid transparent;color:var(--muted2);font-family:'Epilogue',sans-serif;font-size:0.75rem;padding:5px 14px;border-radius:4px;cursor:pointer;transition:all 0.15s;text-transform:uppercase;letter-spacing:1px;}
.view-tab:hover{color:var(--text);border-color:var(--border);}
.view-tab.active{background:var(--accent);color:white;border-color:var(--accent);}

/* MOTIF SELECTOR */
.motif-sel{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:5px;margin-bottom:9px;}
.motif-opt{display:flex;align-items:center;gap:8px;padding:10px 11px;background:rgba(255,255,255,0.03);border:1px solid var(--border);border-radius:7px;cursor:pointer;transition:all 0.15s;}
.motif-opt:hover{border-color:var(--border2);}
.motif-opt.selected{border-color:var(--accent);background:var(--ag);}
.motif-ico{font-size:1.25rem;flex-shrink:0;}
.motif-nm{display:block;font-size:0.8rem;font-weight:600;}
.motif-ds{display:block;font-size:0.66rem;color:var(--muted2);margin-top:1px;}
.motif-chk{margin-left:auto;color:var(--accent);font-size:0.78rem;opacity:0;transition:opacity 0.15s;}
.motif-opt.selected .motif-chk{opacity:1;}
.motif-info-box{display:flex;gap:8px;align-items:flex-start;background:rgba(201,162,39,0.07);border:1px solid rgba(201,162,39,0.22);border-radius:7px;padding:9px 11px;font-size:0.76rem;color:var(--carabiner);line-height:1.5;}

/* SUCCESS */
.success-body{text-align:center;padding:10px 4px;}
.success-icon{font-size:2.8rem;margin-bottom:10px;}
.success-code{display:inline-block;background:var(--ag);border:1px solid rgba(232,82,10,0.3);color:var(--accent);font-weight:600;padding:5px 16px;border-radius:18px;margin:10px 0;font-size:0.92rem;letter-spacing:2px;}

/* HISTORY */
.hist-list{display:flex;flex-direction:column;gap:9px;}
.hist-item{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:14px 16px;display:flex;gap:12px;align-items:center;transition:border-color 0.15s;}
.hist-item:hover{border-color:var(--border2);}
.hist-av{width:40px;height:40px;border-radius:50%;background:var(--surface);border:2px solid var(--border);display:flex;align-items:center;justify-content:center;font-size:1.05rem;flex-shrink:0;}
.hist-nm{font-weight:600;font-size:0.88rem;}
.hist-det{font-size:0.75rem;color:var(--muted2);margin-top:2px;}
.hist-motif{font-size:0.7rem;color:var(--carabiner);margin-top:2px;}
.hist-dates{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px;}
.hist-tag{background:rgba(255,255,255,0.05);border-radius:3px;padding:2px 6px;font-size:0.68rem;color:var(--muted2);}
.hist-meta{text-align:right;flex-shrink:0;}
.hist-id{font-size:0.65rem;color:var(--muted);font-family:monospace;margin-top:4px;}
.btn-cancel-hist{background:none;border:1px solid rgba(229,83,83,0.3);color:var(--red);font-family:'Epilogue',sans-serif;font-size:0.68rem;font-weight:600;padding:4px 10px;border-radius:5px;cursor:pointer;transition:all 0.15s;text-transform:uppercase;margin-top:6px;}
.btn-cancel-hist:hover{background:rgba(229,83,83,0.1);}

/* ================================================
   GÉRER PANEL (référent)
================================================ */
.gerer-tabs{display:flex;border-bottom:1px solid var(--border);background:var(--surface);position:sticky;top:57px;z-index:40;}
.gtab{flex:1;text-align:center;padding:12px 8px;font-size:0.78rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;cursor:pointer;transition:all 0.15s;color:var(--muted2);border-bottom:2px solid transparent;user-select:none;}
.gtab:hover{color:var(--text);}
.gtab.active{color:var(--accent);border-bottom-color:var(--accent);}
.gerer-view{display:none;}.gerer-view.active{display:block;}

/* TABLE */
.table-wrap{background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden;}.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}table{min-width:600px;}
.table-top{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--border);}
.table-top h3{font-family:'Syne',sans-serif;font-size:0.9rem;font-weight:700;}
.table-tools{display:flex;gap:7px;align-items:center;}
table{width:100%;border-collapse:collapse;}
thead tr{border-bottom:1px solid var(--border);background:var(--panel);}
th{text-align:left;padding:10px 14px;font-size:0.64rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);font-weight:500;}
td{padding:11px 14px;font-size:0.81rem;border-bottom:1px solid var(--border);vertical-align:middle;}
tbody tr:last-child td{border:none;}
tbody tr{transition:background 0.1s;}
tbody tr:hover{background:rgba(255,255,255,0.02);}
.td-name{font-weight:500;}
.td-sub{font-size:0.7rem;color:var(--muted2);margin-top:2px;}
.row-acts{display:flex;gap:4px;opacity:0;transition:opacity 0.1s;}
tbody tr:hover .row-acts{opacity:1;}
.ico-btn{background:none;border:1px solid var(--border2);color:var(--muted2);width:24px;height:24px;border-radius:4px;cursor:pointer;font-size:0.76rem;display:flex;align-items:center;justify-content:center;transition:all 0.1s;}
.ico-btn:hover{border-color:#555;color:var(--text);}
.ico-btn.del:hover{border-color:var(--red);color:var(--red);}

/* FORM */
.form-layout{display:grid;grid-template-columns:1fr 300px;gap:18px;align-items:start;}
.form-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden;margin-bottom:14px;}
.form-card-hd{padding:14px 20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:9px;}
.form-card-hd .fc-ic{width:30px;height:30px;border-radius:6px;background:var(--ag);border:1px solid rgba(232,82,10,0.2);display:flex;align-items:center;justify-content:center;font-size:0.95rem;}
.form-card-hd h3{font-family:'Syne',sans-serif;font-size:0.88rem;font-weight:700;}
.form-card-body{padding:18px;}
.fr2{display:grid;grid-template-columns:1fr 1fr;gap:11px;}

.icon-picker{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin-top:4px;}
.ico-opt{background:var(--panel);border:1px solid var(--border);border-radius:5px;height:34px;display:flex;align-items:center;justify-content:center;font-size:1.05rem;cursor:pointer;transition:all 0.1s;}
.ico-opt:hover{border-color:var(--border2);}
.ico-opt.sel{border-color:var(--accent);background:var(--ag);}

.prev-card{background:var(--panel);border:1px solid var(--border);border-radius:9px;padding:16px;}
.prev-hd{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:9px;}
.prev-ico{font-size:1.7rem;}
.prev-nm{font-weight:600;font-size:0.92rem;}
.prev-br{font-size:0.72rem;color:var(--muted2);margin-top:2px;}
.prev-specs{display:flex;gap:4px;flex-wrap:wrap;margin:7px 0;}
.prev-spec{background:rgba(255,255,255,0.05);border-radius:3px;padding:2px 6px;font-size:0.68rem;color:var(--muted2);}

/* RESERVATIONS (referent) */
.res-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:13px;padding:0 0 60px;}
.res-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden;transition:border-color 0.15s,transform 0.15s;display:flex;flex-direction:column;}
.res-card:hover{transform:translateY(-2px);border-color:var(--border2);}
.res-card.late{border-left:3px solid var(--red);}
.res-card.today-card{border-left:3px solid var(--yellow);}
.res-top{display:flex;justify-content:space-between;align-items:flex-start;padding:16px 16px 0;margin-bottom:8px;}
.res-av{width:38px;height:38px;border-radius:50%;background:var(--panel);border:2px solid var(--border);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.res-info{flex:1;min-width:0;}
.res-row1{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.res-nm{display:block;font-size:0.92rem;padding:0 16px 3px;}
.res-code{font-size:0.65rem;color:var(--muted);font-family:monospace;background:var(--panel);padding:2px 5px;border-radius:3px;}
.res-det{font-size:0.76rem;color:var(--muted2);padding:0 16px 3px;}
.res-motif{font-size:0.7rem;color:var(--carabiner);padding:0 16px 3px;}
.res-dates{font-size:0.7rem;color:var(--muted);padding:0 16px 8px;}
.res-acts{display:flex;gap:6px;flex-wrap:wrap;padding:10px 16px 14px;margin-top:auto;}
.res-photos{display:flex;gap:8px;padding:0 16px 10px;flex-wrap:wrap;}
.photo-slot{text-align:center;}
.ph-thumb{width:72px;height:58px;border-radius:5px;object-fit:cover;border:1px solid var(--border);cursor:pointer;transition:border-color 0.15s;}
.ph-thumb:hover{border-color:var(--accent);}
.ph-lbl{font-size:0.6rem;color:var(--muted2);margin-top:2px;text-transform:uppercase;letter-spacing:0.8px;}
.res-prog{display:flex;align-items:center;padding:10px 16px;background:rgba(0,0,0,0.15);border-top:1px solid var(--border);gap:6px;}
.prog-step{display:flex;flex-direction:column;align-items:center;gap:2px;flex:1;}
.prog-dot{width:8px;height:8px;border-radius:50%;border:2px solid var(--border2);}
.prog-dot.done{background:var(--green);border-color:var(--green);}
.prog-dot.curr{background:var(--accent);border-color:var(--accent);box-shadow:0 0 4px rgba(232,82,10,0.5);}
.prog-lbl{font-size:0.58rem;color:var(--muted);text-transform:uppercase;letter-spacing:0.8px;}
.prog-line{flex:1;height:1px;background:var(--border2);}
.prog-line.done{background:var(--green);}

/* MEMBRES */
.members-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:11px;}
.mc{background:var(--surface);border:1px solid var(--border);border-radius:10px;padding:16px;transition:all 0.15s;}
.mc:hover{border-color:var(--border2);transform:translateY(-1px);}
.mc.is-ref{border-left:3px solid var(--accent);}
.mc.is-pend{border-left:3px solid var(--yellow);}
.mc-top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:11px;}
.mc-av{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.95rem;font-weight:700;font-family:'Syne',sans-serif;flex-shrink:0;}
.mc-av.ref-av{background:linear-gradient(135deg,var(--accent),#ff8c42);color:white;}
.mc-av.emp-av{background:linear-gradient(135deg,#1a3a5c,#2d6a9f);color:#7ec8ff;}
.mc-av.pend-av{background:linear-gradient(135deg,#3a2e0a,#7a5f10);color:var(--yellow);}
.mc-bgs{display:flex;flex-direction:column;align-items:flex-end;gap:4px;}
.mc-nm{font-weight:600;font-size:0.9rem;}
.mc-em{font-size:0.73rem;color:var(--muted2);margin-top:2px;}
.mc-tel{font-size:0.7rem;color:var(--muted);}
.mc-stats{display:flex;gap:8px;margin:10px 0;}
.mc-st{flex:1;background:rgba(255,255,255,0.03);border-radius:5px;padding:6px 8px;text-align:center;}
.mc-st-n{font-family:'Syne',sans-serif;font-size:1.1rem;font-weight:700;}
.mc-st-l{font-size:0.58rem;color:var(--muted2);text-transform:uppercase;letter-spacing:0.8px;}
.mc-acts{display:flex;gap:5px;flex-wrap:wrap;}
.mc-btn{flex:1;background:none;border:1px solid var(--border2);color:var(--muted2);font-family:'Epilogue',sans-serif;font-size:0.68rem;font-weight:600;padding:5px 8px;border-radius:5px;cursor:pointer;transition:all 0.1s;text-transform:uppercase;letter-spacing:0.8px;text-align:center;min-width:68px;}
.mc-btn:hover{border-color:#555;color:var(--text);}
.mc-btn.promote{border-color:rgba(232,82,10,0.35);color:var(--accent);}.mc-btn.promote:hover{background:var(--ag);}
.mc-btn.demote{border-color:rgba(74,158,255,0.25);color:var(--blue);}.mc-btn.demote:hover{background:rgba(74,158,255,0.07);}
.mc-btn.approve{border-color:rgba(62,207,142,0.3);color:var(--green);}.mc-btn.approve:hover{background:rgba(62,207,142,0.07);}
.mc-btn.reject{border-color:rgba(229,83,83,0.25);color:var(--red);}.mc-btn.reject:hover{background:rgba(229,83,83,0.07);}
.mc-since{font-size:0.65rem;color:var(--muted);margin-top:7px;text-align:right;}
.pend-banner{background:rgba(240,180,41,0.05);border:1px solid rgba(240,180,41,0.22);border-radius:8px;padding:12px 14px;margin-bottom:18px;display:flex;align-items:center;gap:10px;}
.pend-banner p{flex:1;font-size:0.8rem;}.pend-banner strong{color:var(--yellow);}

/* VALIDATION MODALS */
.val-info{background:rgba(255,255,255,0.03);border:1px solid var(--border);border-radius:7px;padding:11px 13px;margin-bottom:14px;}
.vi-row{display:flex;justify-content:space-between;padding:4px 0;font-size:0.79rem;border-bottom:1px solid var(--border);}
.vi-row:last-child{border:none;}
.vi-lbl{color:var(--muted2);}
.vi-val{font-weight:500;}
.capture-zone{border:2px dashed var(--border2);border-radius:8px;overflow:hidden;position:relative;background:var(--panel);min-height:160px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:8px;cursor:pointer;transition:all 0.2s;}
.capture-zone:hover{border-color:var(--accent);background:rgba(232,82,10,0.03);}
.capture-zone input{position:absolute;inset:0;opacity:0;cursor:pointer;}
.capture-zone.has-img{padding:0;}
.capture-zone img{width:100%;max-height:200px;object-fit:cover;display:none;}
.capture-zone.has-img img{display:block;}
.capture-zone.has-img .cap-placeholder{display:none;}
.cap-placeholder{text-align:center;pointer-events:none;}
.cap-ico{font-size:2.1rem;margin-bottom:6px;}
.cap-txt{font-size:0.78rem;color:var(--muted2);}.cap-txt strong{color:var(--accent);}

/* PHOTO VIEWER */
.photo-viewer{position:fixed;inset:0;background:rgba(0,0,0,0.96);z-index:300;display:none;align-items:center;justify-content:center;}
.photo-viewer.open{display:flex;}
.photo-viewer img{max-width:90vw;max-height:85vh;border-radius:7px;object-fit:contain;}
.pv-close{position:absolute;top:16px;right:16px;background:rgba(255,255,255,0.1);border:none;color:white;width:36px;height:36px;border-radius:50%;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.pv-lbl{position:absolute;bottom:16px;color:rgba(255,255,255,0.45);font-size:0.72rem;text-transform:uppercase;letter-spacing:1px;}

@media(max-width:820px){
  #page-login.active{grid-template-columns:1fr;}
  .login-left{display:none;}
  .form-layout{grid-template-columns:1fr;}
  .stats-row{grid-template-columns:repeat(2,1fr);}
  .eq-grid{padding:14px;}
  .cat-tabs,.cat-search,.hero-zone,.content{padding-left:16px;padding-right:16px;}
}
@media(hover:none){
  .row-acts{opacity:1;}
}
@media(max-width:600px){
  .hero-brand{display:block;}
  .lf-mobile-logo{display:block;}
  .topbar{flex-direction:column;align-items:center;padding:8px 12px;gap:6px;}
  .topbar-l{justify-content:center;width:100%;}
  .topbar-r{justify-content:center;width:100%;gap:4px;flex-wrap:wrap;}
  .view-tabs{justify-content:center;gap:3px;}
  .view-tab{padding:6px 10px;font-size:0.7rem;letter-spacing:0;}
  .btn-sm{padding:6px 10px;font-size:0.7rem;}
  .role-tag{display:none;}
  .gerer-tabs .gtab{font-size:0.7rem;padding:10px 4px;}
  table{font-size:0.75rem;}
  th,td{padding:8px 8px;}
  .cal-cell{min-height:52px;padding:2px;}
  .cal-pill{font-size:0.58rem;padding:1px 3px;}
  .cal-nav-title{font-size:0.88rem;}
  .cal-dow{font-size:0.62rem;padding:6px 2px;}
  .field-row .field label{font-size:0.6rem;letter-spacing:0.5px;white-space:nowrap;}
  .stats-row{grid-template-columns:repeat(4,1fr);gap:5px;}
  .sc{padding:9px 6px;}
  .sc-num{font-size:1.2rem !important;}
  .sc-lbl{font-size:0.55rem;letter-spacing:0.5px;}
  .sc-icon{font-size:0.9rem;top:7px;right:7px;}
}

/* CALENDRIER */
.cal-nav{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border);}
.cal-nav-title{font-weight:700;font-size:1rem;color:var(--text);}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);border-left:1px solid var(--border);border-top:1px solid var(--border);}
.cal-dow{background:var(--bg);font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;color:var(--muted2);padding:8px 4px;text-align:center;border-right:1px solid var(--border);border-bottom:1px solid var(--border);}
.cal-cell{min-height:80px;padding:4px;border-right:1px solid var(--border);border-bottom:1px solid var(--border);vertical-align:top;background:var(--surface);}
.cal-cell.other-month{background:var(--bg);opacity:0.5;}
.cal-cell.today .cal-date{background:var(--accent);color:#fff;border-radius:50%;}
.cal-date{font-size:0.75rem;font-weight:600;margin-bottom:3px;width:22px;height:22px;display:flex;align-items:center;justify-content:center;}
.cal-pill{font-size:0.65rem;padding:2px 5px;border-radius:3px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:default;line-height:1.4;}
.cal-pill.reserve{background:#fef3c7;color:#92400e;}
.cal-pill.emprunte{background:#dbeafe;color:#1e40af;}
.cal-pill.retour-attente{background:#fed7aa;color:#9a3412;}
.cal-pill.retourne{background:#d1fae5;color:#065f46;}
.cal-legend{display:flex;gap:12px;flex-wrap:wrap;padding:12px 16px;border-top:1px solid var(--border);font-size:0.72rem;}
.cal-legend span{display:flex;align-items:center;gap:5px;}
.cal-legend .dot{width:10px;height:10px;border-radius:2px;flex-shrink:0;}

/* PLANNING GANTT */
.plan-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:8px;margin-top:8px;-webkit-overflow-scrolling:touch;}
.plan-table{border-collapse:collapse;font-size:0.72rem;min-width:100%;}
.plan-mat-hd{background:var(--surface);min-width:100px;max-width:120px;width:110px;padding:6px 8px;text-align:left;font-weight:700;border-bottom:2px solid var(--border);border-right:2px solid var(--border);}
.plan-day-hd{min-width:32px;width:32px;text-align:center;padding:4px 2px;font-weight:700;border-bottom:2px solid var(--border);border-right:1px solid var(--border);background:var(--surface);line-height:1.2;}
.plan-day-hd .plan-dow{font-size:0.58rem;font-weight:400;color:var(--muted2);display:block;}
.plan-day-hd.weekend{background:rgba(255,255,255,0.025);}
.plan-day-hd.plan-today{background:#1e3d28;color:#5aad74;border-bottom-color:#2d6640;}
.plan-mat-cell{background:var(--bg);min-width:100px;max-width:120px;width:110px;padding:4px 8px;font-size:0.68rem;font-weight:500;border-bottom:1px solid var(--border);border-right:2px solid var(--border);line-height:1.3;}
.plan-mat-specs{display:flex;flex-wrap:wrap;gap:2px;margin-top:2px;}
.plan-cell{min-width:32px;width:32px;padding:3px 4px;border-bottom:1px solid var(--border);border-right:1px solid var(--border);overflow:hidden;cursor:default;vertical-align:middle;position:relative;}
.plan-cell.weekend{background:rgba(255,255,255,0.04);}
.plan-cell.free{cursor:pointer;text-align:center;}
.plan-cell.free::after{content:'+';display:block;font-size:0.85rem;font-weight:400;color:#3d7a52;opacity:0.28;line-height:1.6;pointer-events:none;}
.plan-cell.free:hover{background:rgba(45,90,61,0.15);}
.plan-cell.free:hover::after{opacity:0.7;}
.plan-acts{display:flex;gap:2px;margin-top:2px;}
.plan-act-btn{border:none;background:rgba(0,0,0,0.28);border-radius:3px;font-size:0.72rem;padding:1px 4px;cursor:pointer;line-height:1.5;color:rgba(255,255,255,0.9);}
.plan-act-btn:hover{background:rgba(0,0,0,0.5);color:#fff;}
.plan-act-cancel{position:absolute;bottom:2px;right:2px;margin-top:0;}
.plan-cell.plan-today{background:rgba(30,80,45,0.32);border-right-color:rgba(45,102,64,0.5);}
.plan-cell.en-attente{background:rgba(168,139,250,0.18);color:#c4b5fd;box-shadow:inset 0 0 0 1px rgba(168,139,250,0.55);}
.plan-cell.reserve{background:rgba(253,224,71,0.18);color:#fde047;box-shadow:inset 0 0 0 1px rgba(253,224,71,0.55);}
.plan-cell.emprunte{background:rgba(234,88,12,0.2);color:#fb923c;box-shadow:inset 0 0 0 1px rgba(234,88,12,0.55);}
.plan-cell.retour-attente{background:rgba(251,146,60,0.18);color:#fb923c;box-shadow:inset 0 0 0 1px rgba(251,146,60,0.55);}
.plan-cell.retourne{background:rgba(74,222,128,0.15);color:#4ade80;box-shadow:inset 0 0 0 1px rgba(74,222,128,0.55);}
.plan-cell-name{font-weight:700;font-size:0.68rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.plan-cell-motif{font-size:0.58rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0.8;margin-top:1px;}
.plan-cat-row td{background:var(--bg);border-bottom:1px solid var(--border);padding:0;}
.plan-cat-label{position:sticky;left:0;z-index:2;background:var(--bg);width:110px;min-width:110px;padding:5px 10px;color:var(--muted2);font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;border-right:2px solid var(--border);}
.plan-cat-label > div{display:flex;align-items:center;gap:6px;}
.plan-cat-label{color:#3d7a52;border-bottom-color:rgba(61,122,82,0.3);}

/* CASIERS */
.casier-toolbar{display:flex;align-items:center;gap:8px;padding:16px 16px 0;flex-wrap:wrap;}
.casier-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:14px;padding:16px;}
.casier-card{background:var(--surface);border:1px solid var(--border);border-radius:10px;overflow:hidden;}
.casier-card-hd{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;background:rgba(232,82,10,0.07);border-bottom:1px solid var(--border);gap:8px;}
.casier-num{font-weight:800;font-size:0.95rem;font-family:'Syne',sans-serif;flex:1;}
.casier-code-row{display:flex;align-items:center;gap:5px;}
.casier-code-inp{width:54px;text-align:center;font-size:0.9rem;font-weight:700;letter-spacing:3px;background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:5px;padding:4px 5px;font-family:monospace;}
.casier-items{padding:8px 12px;display:flex;flex-direction:column;gap:3px;min-height:32px;}
.casier-item{font-size:0.76rem;padding:3px 0;display:flex;align-items:center;gap:6px;border-bottom:1px solid rgba(255,255,255,0.04);}
.casier-item:last-child{border-bottom:none;}
.casier-empty{font-size:0.74rem;color:var(--muted2);font-style:italic;padding:4px 0;}
.casier-group-hd{font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.6px;padding:4px 0 3px;border-bottom:1px solid var(--border);margin-bottom:3px;}
.casier-add-form{display:flex;gap:6px;align-items:flex-end;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:10px;flex-wrap:wrap;}
.casier-add-form .field{margin:0;flex:1;min-width:80px;}
.casier-add-form label{font-size:0.7rem;margin-bottom:3px;display:block;}

/* TYPE CADENAS */
.lock-type-sel{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:4px;}
.lock-type-opt{display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 5px;background:rgba(255,255,255,0.03);border:1px solid var(--border);border-radius:7px;cursor:pointer;transition:all 0.15s;text-align:center;user-select:none;}
.lock-type-opt:hover{border-color:var(--border2);}
.lock-type-opt.selected{border-color:#3d7a52;background:rgba(45,90,61,0.15);}
.lock-type-opt input{display:none;}
.lock-type-ic{font-size:1.1rem;}
.lock-type-nm{font-size:0.68rem;font-weight:600;display:block;}
.lock-type-ds{font-size:0.58rem;color:var(--muted2);}
.casier-type-badge{font-size:0.6rem;padding:2px 7px;border-radius:10px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;white-space:nowrap;}
.ctb-manuel{background:rgba(212,168,67,0.12);color:var(--yellow);border:1px solid rgba(212,168,67,0.3);}
.ctb-electronique{background:rgba(74,158,255,0.1);color:var(--blue);border:1px solid rgba(74,158,255,0.25);}
.ctb-cle{background:rgba(168,139,250,0.1);color:var(--purple);border:1px solid rgba(168,139,250,0.25);}

/* ================================================
   THÈME & OVERRIDES
================================================ */

/* Display → Bebas Neue */
.logo,.lf-title,.ll-hero h1,.hero-title,.modal-hd h3,.section-hd,.sc-num,.table-top h3,.gtab,
.btn-submit,.casier-num,.mc-st-n,.form-card-hd h3,.success-title,.cal-nav-title,.btn-res,
.hs-num { font-family:'Bebas Neue',sans-serif !important; letter-spacing:0.05em; }

/* Serif → DM Serif Display */
.eq-nm,.hist-nm,.res-nm,.mc-nm,.confirm-center h4,.prev-nm,
.td-name { font-family:'DM Serif Display',serif !important; font-weight:normal; }

/* Logo */
.logo { color:#f2ede5 !important; font-size:1.5rem; letter-spacing:0.12em; }
.logo span { color:#4e9c69 !important; }
.ll-logo { color:#f2ede5 !important; }
.ll-logo span { color:#4e9c69 !important; }

/* Hero zone */
.hero-title { font-size:clamp(2.2rem,4vw,4.5rem) !important; line-height:0.92 !important; letter-spacing:0.03em !important; }
.hero-title em { color:#d4a843 !important; font-style:normal !important; font-family:'DM Serif Display',serif !important; font-size:0.55em !important; display:block !important; line-height:1.4 !important; }
.hero-eyebrow { font-size:0.62rem; letter-spacing:0.2em; text-transform:uppercase; color:#4e9c69; display:flex; align-items:center; gap:8px; }
.hero-eyebrow::before { content:'▲'; font-size:0.5rem; }

/* Hero stats */
.hero-stats { background:#1a1814; border:1px solid #3d3a30; border-radius:10px; overflow:hidden; padding:0 !important; border-top:1px solid #3d3a30 !important; display:flex; gap:0; margin-top:14px; width:fit-content; }
.hs { padding:8px 20px !important; border-right:1px solid #3d3a30; text-align:center; }
.hs:last-child { border-right:none; }
.hs-num { color:#d4a843 !important; font-size:1.5rem !important; }
.hs-lbl { font-size:0.55rem; text-transform:uppercase; letter-spacing:0.06em; color:#857f6e; line-height:1.2; }

/* Section hd */
.section-hd::before { content:'▲'; font-size:0.58rem; color:#4e9c69; font-family:sans-serif !important; }
.section-hd::after { background:#3d3a30; }

/* Tabs */
.cat-tab { border-radius:4px !important; font-weight:600; letter-spacing:0.1em; }
.ftab { border-radius:4px !important; }
.cat-tab.active { background:#2d5a3d; border-color:#2d5a3d; color:#f0ece4; }
.ftab.active { background:#2d5a3d; border-color:#2d5a3d; color:#f0ece4; border-radius:4px !important; }
.view-tab.active { background:#2d5a3d; border-color:#2d5a3d; color:#f0ece4; border-radius:5px; }
.lf-tab.active { background:#2d5a3d; color:#f0ece4; box-shadow:0 2px 8px rgba(45,90,61,0.4); border-radius:6px; }
.gtab.active { color:#4e9c69; border-bottom-color:#2d5a3d; }

/* Bouton principal */
.btn-primary { background:#2d5a3d; color:#f0ece4; }
.btn-primary:hover { background:#3d7a52; box-shadow:0 4px 12px rgba(45,90,61,0.3); }
.btn-submit { font-family:'Bebas Neue',sans-serif !important; font-size:1.1rem; letter-spacing:0.15em; background:#2d5a3d; color:#f0ece4; border-radius:7px; }
.btn-submit:hover { background:#3d7a52; transform:translateY(-1px); box-shadow:0 6px 20px rgba(45,90,61,0.35); }
.btn-submit::after { content:''; }

/* Btn réserver */
.btn-res { background:#2d5a3d !important; border:none !important; color:#f0ece4 !important; font-family:'Bebas Neue',sans-serif !important; font-size:1rem !important; letter-spacing:0.12em !important; border-radius:6px; }
.btn-res:hover { background:#3d7a52 !important; box-shadow:0 4px 12px rgba(45,90,61,0.35); }
.btn-res:disabled { background:#3d3a30 !important; color:#857f6e !important; cursor:not-allowed; box-shadow:none; }

/* Cards équipement */
.eq-card { border-radius:10px; border-color:#2a2720; transition:transform 0.15s,border-color 0.15s,box-shadow 0.25s; }
.eq-card::before { background:linear-gradient(135deg,rgba(255,255,255,0.02) 0%,transparent 50%) !important; transform:scaleX(1) !important; height:100% !important; top:0; pointer-events:none; }
.eq-card:hover { box-shadow:0 12px 32px rgba(0,0,0,0.35),inset 0 2px 0 #3d7a52; border-color:#3d3a30; }
.eq-ico { color:#4e9c69; }
.eq-ico svg { pointer-events:none; overflow:visible; }
.eq-jours-fill { background:linear-gradient(90deg,#2d5a3d,#d4a843); }
.eq-jours-val { color:#d4a843; }

/* Login */
.login-left::before { background:radial-gradient(ellipse at 30% 0%,rgba(45,90,61,0.25) 0%,transparent 55%),radial-gradient(ellipse at 80% 100%,rgba(106,154,184,0.12) 0%,transparent 50%); }
.ll-hero h1 { font-size:clamp(3.5rem,6vw,5.5rem) !important; line-height:0.92 !important; letter-spacing:0.03em !important; }
.ll-hero h1 em { color:#d4a843 !important; font-family:'DM Serif Display',serif !important; font-size:0.52em !important; font-style:italic !important; font-weight:normal !important; display:block; letter-spacing:0.02em; line-height:1.4; }
.ll-eyebrow { font-size:0.65rem; letter-spacing:0.2em; text-transform:uppercase; color:#4e9c69; margin-bottom:16px; display:flex; align-items:center; gap:8px; }
.ll-eyebrow::before { content:''; width:24px; height:1px; background:#4e9c69; }
.ll-feat { border:1px solid rgba(255,255,255,0.06); background:rgba(255,255,255,0.025); }
.ll-feat:hover { border-color:rgba(77,156,105,0.3); }
.ll-feat-ic { background:rgba(45,90,61,0.4); border:1px solid rgba(77,156,105,0.25); }
.ll-footer::before { content:'▲'; font-size:0.55rem; color:#2d5a3d; margin-right:6px; }

/* Inputs focus */
.field input:focus,.field select:focus,.field textarea:focus,
.s-input:focus,.lf-inp:focus { border-color:transparent; outline:none; }
.lf-inp-wrap:focus-within { border-color:#3d7a52; box-shadow:0 0 0 3px rgba(45,90,61,0.15); }
.role-opt.selected { border-color:#3d7a52; background:rgba(45,90,61,0.15); }
.motif-opt.selected { border-color:#3d7a52; background:rgba(45,90,61,0.15); }
.motif-chk { color:#4e9c69; }
.motif-info-box { background:rgba(212,168,67,0.07); border-color:rgba(212,168,67,0.22); color:#d4a843; }

/* Badges & tags */
.b-ref { background:rgba(45,90,61,0.25); color:#4e9c69; border-color:rgba(45,90,61,0.4); }
.role-tag { background:rgba(45,90,61,0.25); color:#4e9c69; border-color:rgba(45,90,61,0.4); border-radius:4px; }
.role-tag.emp { background:rgba(106,154,184,0.15); color:#c8dde8; border-color:rgba(106,154,184,0.25); }

/* Stats cards */
.sc { border-radius:8px; }
.sc-num { font-size:2rem !important; }

/* Tableaux */
thead tr { background:#2a2720; }
tbody tr:hover { background:rgba(255,255,255,0.015); }

/* Form */
.fc-ic { background:rgba(45,90,61,0.25); border-color:rgba(45,90,61,0.35); }
.ico-opt.sel { border-color:#3d7a52; background:rgba(45,90,61,0.2); }

/* Membres */
.mc-av.ref-av { background:linear-gradient(135deg,#2d5a3d,#4e9c69); color:#f0ece4; }
.mc-av.emp-av { background:linear-gradient(135deg,#1a2e3a,#2d4d6a); color:#c8dde8; }
.mc-av.pend-av { background:linear-gradient(135deg,#3a2e0a,#6a5010); color:#d4a843; }
.mc.is-ref { border-left-color:#4e9c69; }
.mc-btn.promote { border-color:rgba(45,90,61,0.4); color:#4e9c69; }
.mc-btn.promote:hover { background:rgba(45,90,61,0.12); }

/* Progress */
.prog-dot.done { background:#4e9c69; border-color:#4e9c69; }
.prog-dot.curr { background:#d4a843; border-color:#d4a843; box-shadow:0 0 5px rgba(212,168,67,0.5); }
.prog-line.done { background:#2d5a3d; }

/* Réservations */
.res-motif { color:#d4a843; }
.res-card.late { border-left-color:#c0613a; }
.res-card.today-card { border-left-color:#d4a843; }
.ph-thumb:hover { border-color:#3d7a52; }
.cal-cell.today .cal-date { background:#2d5a3d; }

/* Success */
.success-code { background:rgba(45,90,61,0.2); border-color:rgba(45,90,61,0.4); color:#4e9c69; font-family:'Bebas Neue',sans-serif !important; letter-spacing:0.15em; border-radius:4px; }

/* Capture / Photo */
.capture-zone:hover { border-color:#4e9c69; background:rgba(45,90,61,0.05); }
.cap-txt strong { color:#4e9c69; }

/* Casier */
.casier-card-hd { background:rgba(45,90,61,0.08); }
.casier-num { font-size:1rem !important; }

/* Toast */
.toast.ok { background:#2d5a3d; color:#f0ece4; box-shadow:0 6px 20px rgba(45,90,61,0.4); }

/* Pend banner */
.pend-banner { background:rgba(212,168,67,0.06); border-color:rgba(212,168,67,0.22); }
.pend-banner strong { color:#d4a843; }

/* Scrollbar */
::-webkit-scrollbar-thumb { background:#5c5849; }

.theme-icon-btn { background:none; border:none; color:var(--muted2); cursor:pointer; padding:3px; line-height:1; display:flex; align-items:center; transition:color 0.2s; }
.theme-icon-btn:hover { color:var(--text); }

/* Mode fond clair */
body.theme-light {
  --bg:#f5f0e8;--surface:#ede8dc;--panel:#e4ddd0;--border:#cbc5b5;--border2:#b0a998;
  --text:#2a251e;--muted:#8a8070;--muted2:#6e6860;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.028'/%3E%3C/svg%3E");
}
body.theme-light .hs-num { color:#2d5a3d !important; }
body.theme-light .hero-stats { background:var(--panel) !important; border-color:var(--border) !important; }
body.theme-light .hs { border-right-color:var(--border) !important; }
body.theme-light .logo { color:#2a251e !important; }
body.theme-light .topbar { background:rgba(245,240,232,0.96); }
body.theme-light .overlay { background:rgba(0,0,0,0.55); }
body.theme-light .modal { background:var(--surface); }
body.theme-light .modal-hd { background:var(--panel); }
body.theme-light .val-info { background:rgba(0,0,0,0.04); }
body.theme-light .field input,body.theme-light .field select,body.theme-light .field textarea { background:var(--bg); }
body.theme-light .capture-zone { background:var(--panel); }
body.theme-light .plan-cell.en-attente { background:rgba(109,40,217,0.1);color:#6d28d9;box-shadow:inset 0 0 0 1px rgba(109,40,217,0.35); }
body.theme-light .plan-cell.reserve { background:rgba(180,130,0,0.14);color:#7a5800;box-shadow:inset 0 0 0 1px rgba(180,130,0,0.45); }
body.theme-light .plan-cell.emprunte { background:rgba(160,55,15,0.14);color:#7a2808;box-shadow:inset 0 0 0 1px rgba(160,55,15,0.45); }
body.theme-light .plan-cell.retour-attente { background:rgba(150,100,10,0.14);color:#6a4a08;box-shadow:inset 0 0 0 1px rgba(150,100,10,0.45); }
body.theme-light .plan-cell.retourne { background:rgba(20,90,45,0.12);color:#1a4a28;box-shadow:inset 0 0 0 1px rgba(20,90,45,0.38); }
body.theme-light .eq-card { border-color:var(--border); }
body.theme-light .eq-card:hover { border-color:var(--border2); box-shadow:0 6px 18px rgba(0,0,0,0.1),inset 0 2px 0 #3d7a52; }
body.theme-light .eq-spec,.theme-light .prev-spec { background:rgba(0,0,0,0.06); }
body.theme-light thead tr { background:#e4ddd0; }
body.theme-light tbody tr:hover { background:rgba(0,0,0,0.025); }
body.theme-light .plan-mat-cell { background:var(--bg); }
body.theme-light .plan-day-hd.plan-today { background:#c8dfc8; color:#2d5a3d; border-bottom-color:#8ab89a; }
body.theme-light .plan-cell.plan-today { background:#eaf5ea; border-right-color:rgba(45,90,61,0.14); }
body.theme-light .plan-day-hd.weekend { background:rgba(180,145,60,0.13); }
body.theme-light .plan-cell.weekend { background:rgba(180,145,60,0.06); }
body.theme-light .cal-cell { background:var(--surface); }
body.theme-light .cal-cell.other-month { background:var(--bg); }
body.theme-light .cal-dow { background:var(--bg); }
body.theme-light ::-webkit-scrollbar-thumb { background:#b0a998; }

/* ================================================
   CLASSES ISSUES DES STYLES INLINE
================================================ */

/* Alignement vertical des icônes SVG */
.icon-va{vertical-align:-1px}
.icon-va2{vertical-align:-2px}

/* Bouton historique : relatif pour le badge */
#vt-historique{position:relative}

/* Badge "réservations en attente" */
#res-pending-badge{position:absolute;top:4px;right:4px;background:var(--red);color:white;font-size:0.58rem;font-weight:700;border-radius:50%;width:15px;height:15px;display:none;align-items:center;justify-content:center;line-height:1}

/* Vue planning : padding réduit */
#cv-planning .content{padding-top:12px}

/* Toolbars flex */
.toolbar-end{display:flex;justify-content:flex-end;margin-bottom:16px}
.toolbar-end-gap{display:flex;justify-content:flex-end;gap:8px;margin-bottom:12px}

/* Recherche/filtre dans le tableau admin */
.search-wrap-sm{width:160px}
.s-input-cat{width:120px;padding-left:8px}

/* Largeurs des colonnes tableau */
.th-desig{min-width:220px}
.th-icon-col{width:52px}
.th-act{width:70px}

/* Section-hd sans marge (dans toolbar) */
.section-hd-flat{margin:0;flex:1}

/* Bouton fantôme avec fond panel */
.btn-panel{background:var(--panel);border:1px solid var(--border)}

/* Largeurs des modals */
#modal-mat-form .modal{max-width:680px}
#modal-reserve .modal{max-width:460px}
#modal-success .modal,#modal-specs .modal{max-width:380px}
#modal-confirm .modal{max-width:350px}
#modal-mat-photo .modal{max-width:420px}
#modal-photo-hist .modal{max-width:580px}
#modal-code-confirm .modal{max-width:360px}
#modal-famille .modal{max-width:700px}
#modal-casier-add .modal,#modal-casier-settings .modal{max-width:400px}

/* Overrides de modal-body */
#modal-mat-form .modal-body{overflow-y:auto}
#modal-photo-hist .modal-body{max-height:70vh;overflow-y:auto;display:flex;flex-direction:column;gap:16px;padding-top:4px}
#modal-famille .modal-body{max-height:75vh;overflow-y:auto;padding-top:8px}
#modal-code-confirm .modal-body{text-align:center;padding:20px 24px}
#modal-mat-photo .modal-body{text-align:center;padding:12px}

/* Variantes de modal-ft */
.modal-ft-center{justify-content:center}
.modal-ft-spread{justify-content:space-between}
.modal-ft-gap{gap:10px}

/* Aperçu photo dans le formulaire */
#fm-photo-preview{margin-bottom:8px}
.photo-preview-img{max-height:130px;border-radius:6px;border:1px solid var(--border);display:block}
.photo-input{font-size:0.8rem;color:var(--muted2)}

/* Liste des specs dans le formulaire */
#specs-list{display:flex;flex-direction:column;gap:8px;margin-bottom:10px}

/* Ligne de spec (générée par JS) */
.spec-row{display:flex;gap:7px;align-items:center}
.spec-input{flex:1;background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:Epilogue,sans-serif;font-size:0.82rem;padding:7px 10px;border-radius:6px;outline:none}
.spec-del-btn{background:none;border:1px solid var(--border);color:var(--muted);width:26px;height:26px;border-radius:4px;cursor:pointer}
.spec-del-btn:hover{color:var(--red)}

/* Hint sous un champ */
.field-hint{font-size:0.68rem;color:var(--muted2);margin-top:3px}

/* Textarea motif */
.note-textarea{width:100%;background:var(--bg);border:1px solid var(--border);color:var(--text);font-family:Epilogue,sans-serif;font-size:0.83rem;padding:8px 11px;border-radius:6px;outline:none;resize:vertical;transition:border-color 0.2s}

/* Modal succès — textes */
.success-title{font-family:'Syne',sans-serif;font-size:1.2rem;font-weight:800;margin-bottom:5px}
.success-motif{font-size:0.78rem;color:var(--carabiner);margin:7px 0 10px;font-style:italic}
.success-msg{font-size:0.78rem;color:var(--muted2)}

/* Panneau vert (section code casier) */
.panel-green{display:none;margin-bottom:12px;background:rgba(45,90,61,0.07);border:1px solid rgba(45,90,61,0.3);border-radius:8px;padding:12px 14px}

/* Label du code casier */
.code-section-lbl{font-size:0.75rem;color:var(--muted2);margin-bottom:8px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px}

/* Rangée d'affichage du code */
.code-display-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

/* Cellule code */
.code-cell-lbl{font-size:0.65rem;color:var(--muted2);margin-bottom:2px}
.code-val-green{font-family:monospace;font-size:1.3rem;font-weight:800;color:var(--green);letter-spacing:4px}
.code-val-yellow{font-family:monospace;font-size:1.3rem;font-weight:800;color:var(--yellow);letter-spacing:4px}
.code-arrow{font-size:1.2rem;color:var(--muted2)}

/* Code électronique */
.elec-code-lbl{font-size:0.7rem;color:var(--muted2);margin-bottom:6px}
.elec-code-val{font-family:monospace;font-size:1.5rem;font-weight:800;color:var(--blue);letter-spacing:5px}
.elec-code-note{font-size:0.68rem;color:var(--muted2);margin-top:5px}

/* Texte clé */
.cle-code-txt{display:none;font-size:0.84rem;color:var(--yellow);line-height:1.5}

/* Panneau orange (checkup) */
.panel-orange{display:none;margin-top:12px;background:rgba(232,82,10,0.06);border:1px solid rgba(232,82,10,0.2);border-radius:8px;padding:12px 14px}

/* Contenu checkup */
.checkup-hd{font-weight:700;font-size:0.82rem;margin-bottom:8px}
.checkup-q{font-size:0.8rem;margin-bottom:6px}
.checkup-btns{display:flex;gap:8px;align-items:center}
.checkup-cu-note{font-size:0.68rem;color:var(--muted2);display:none}
.btn-cu-oui{background:rgba(62,207,142,0.15);border:1px solid rgba(62,207,142,0.4);color:var(--green)}
.btn-cu-non{background:rgba(229,83,83,0.1);border:1px solid rgba(229,83,83,0.3);color:var(--red)}

/* Photo de référence (modal retour) */
.ref-photo-lbl{font-size:0.76rem;color:var(--muted2);margin-bottom:4px;display:block}
.ref-photo-img{width:100%;border-radius:8px;border:1px solid var(--border);max-height:200px;object-fit:cover}

/* Affichage du code casier (modal confirmation) */
.locker-code-display{font-family:monospace;font-size:2.2rem;font-weight:800;letter-spacing:8px;color:var(--accent);background:var(--panel);border:2px solid var(--accent);border-radius:10px;padding:14px 0;margin-bottom:20px}

/* Modal photo article */
#mmp-img{max-width:100%;border-radius:8px;border:1px solid var(--border)}
.mmp-marque{margin-top:8px;font-size:0.8rem;color:var(--muted2)}
.mmp-specs{margin-top:6px;display:flex;flex-wrap:wrap;gap:4px;justify-content:center}

/* Grille photo de famille */
#famille-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}

/* Inputs du formulaire nouveau casier */
.nc-numero-input{letter-spacing:2px}
.nc-code-input{letter-spacing:4px;font-family:monospace;width:100px}

/* Sections du modal réglages casier */
.cs-divider{border-top:1px solid var(--border);margin:14px 0 12px}
.cs-section-field{margin:0}
.casier-code-edit-row{display:flex;gap:8px;align-items:center;margin-top:4px}
.casier-code-edit{width:90px;letter-spacing:4px;font-family:monospace;background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:7px;padding:8px 10px;font-size:1.1rem;text-align:center;outline:none}

/* Panneau bleu (cadenas électronique) */
.panel-blue{background:rgba(74,158,255,0.06);border:1px solid rgba(74,158,255,0.2);border-radius:8px;padding:13px 14px}
.panel-blue-title{font-size:0.8rem;font-weight:600;color:var(--blue);margin-bottom:6px}
.panel-blue-body{font-size:0.78rem;color:var(--muted2);line-height:1.65}

/* Texte section clé */
.cs-cle-txt{font-size:0.8rem;color:var(--muted2)}

/* Éléments générés par JS dans valInfo() */
.vi-val-specs{display:flex;flex-wrap:wrap;gap:3px}
.vi-val-accent{color:var(--carabiner)}
.vi-val-mono{font-family:monospace}
.vi-casier-bold{font-weight:700}
.vi-casier-code{font-family:monospace;font-size:0.85rem;color:var(--muted2);margin-left:8px}
.eq-spec-sm{font-size:0.65rem}

/* Photo de référence : marge */
#return-ref-photo{margin-bottom:12px}

/* Code confirm — texte d'instruction */
#modal-code-confirm .modal-body p{color:var(--muted2);font-size:0.85rem;margin:0 0 16px}