/* ═══════════════════════════════════════════════════════════════════
   SOTRAFO VTC — Système de thèmes multi-styles v2
   5 thèmes : dark-industrial (défaut), midnight-blue, savane, clair, neon
═══════════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@400;500;600;700&family=Inter:wght@300;400;500;600&family=IBM+Plex+Mono:wght@400;600&family=Outfit:wght@300;400;500;600;700&family=Syne:wght@400;600;700;800&display=swap');

/* ─── THÈME 1 : Dark Industrial (défaut) ─────────────────────────── */
:root,[data-theme="dark-industrial"]{--primary:#0a2463;--primary-light:#1e3a8a;--accent:#1a6fc4;--accent-bright:#3b9ede;--silver:#8a9bb0;--silver-light:#c5cfe0;--dark:#0d1b2a;--dark-card:#111f30;--darker:#080f1a;--text:#e8edf5;--text-muted:#7a8fa8;--success:#10b981;--warning:#f59e0b;--danger:#ef4444;--info:#3b82f6;--border:rgba(255,255,255,0.07);--shadow:0 4px 24px rgba(0,0,0,0.4);--radius:12px;--font-main:'Inter',sans-serif;--font-title:'Rajdhani',sans-serif;--font-mono:'IBM Plex Mono',monospace;--sidebar-bg:linear-gradient(180deg,#0d1b2a 0%,#080f1a 100%);--topbar-bg:#0d1b2a;--body-bg:#080f1a;--input-bg:rgba(255,255,255,0.05);--hover-bg:rgba(255,255,255,0.05);--active-bg:rgba(59,158,222,0.1);--active-border:#3b9ede;--nav-text:#8a9bb0;}

/* ─── THÈME 2 : Midnight Blue ─────────────────────────────────────── */
[data-theme="midnight-blue"]{--primary:#0f172a;--primary-light:#1e293b;--accent:#6366f1;--accent-bright:#818cf8;--silver:#94a3b8;--silver-light:#cbd5e1;--dark:#0f172a;--dark-card:#1e293b;--darker:#0a0f1e;--text:#f1f5f9;--text-muted:#64748b;--success:#22c55e;--warning:#eab308;--danger:#f43f5e;--info:#38bdf8;--border:rgba(99,102,241,0.15);--shadow:0 4px 32px rgba(99,102,241,0.15);--radius:16px;--font-main:'Outfit',sans-serif;--font-title:'Syne',sans-serif;--font-mono:'IBM Plex Mono',monospace;--sidebar-bg:linear-gradient(180deg,#0f172a 0%,#0a0f1e 100%);--topbar-bg:#0f172a;--body-bg:#0a0f1e;--input-bg:rgba(99,102,241,0.08);--hover-bg:rgba(99,102,241,0.08);--active-bg:rgba(99,102,241,0.15);--active-border:#818cf8;--nav-text:#64748b;}

/* ─── THÈME 3 : Savane ────────────────────────────────────────────── */
[data-theme="savane"]{--primary:#1c1008;--primary-light:#2d1f0e;--accent:#c97d2e;--accent-bright:#e09444;--silver:#a08060;--silver-light:#d4b896;--dark:#1c1008;--dark-card:#251608;--darker:#120b04;--text:#f5e6d0;--text-muted:#9a7850;--success:#4caf76;--warning:#e6a020;--danger:#d94f4f;--info:#5ba4c8;--border:rgba(201,125,46,0.15);--shadow:0 4px 24px rgba(0,0,0,0.5);--radius:10px;--font-main:'Outfit',sans-serif;--font-title:'Syne',sans-serif;--font-mono:'IBM Plex Mono',monospace;--sidebar-bg:linear-gradient(180deg,#1c1008 0%,#120b04 100%);--topbar-bg:#1c1008;--body-bg:#120b04;--input-bg:rgba(201,125,46,0.08);--hover-bg:rgba(201,125,46,0.08);--active-bg:rgba(201,125,46,0.15);--active-border:#e09444;--nav-text:#9a7850;}

/* ─── THÈME 4 : Clair Pro ─────────────────────────────────────────── */
[data-theme="clair"]{--primary:#1e3a8a;--primary-light:#2563eb;--accent:#2563eb;--accent-bright:#3b82f6;--silver:#6b7280;--silver-light:#9ca3af;--dark:#ffffff;--dark-card:#f8fafc;--darker:#f1f5f9;--text:#0f172a;--text-muted:#6b7280;--success:#059669;--warning:#d97706;--danger:#dc2626;--info:#0284c7;--border:rgba(0,0,0,0.08);--shadow:0 2px 16px rgba(0,0,0,0.08);--radius:12px;--font-main:'Inter',sans-serif;--font-title:'Syne',sans-serif;--font-mono:'IBM Plex Mono',monospace;--sidebar-bg:linear-gradient(180deg,#1e3a8a 0%,#1e40af 100%);--topbar-bg:#ffffff;--body-bg:#f1f5f9;--input-bg:#ffffff;--hover-bg:rgba(37,99,235,0.05);--active-bg:rgba(37,99,235,0.1);--active-border:#3b82f6;--nav-text:rgba(255,255,255,0.65);}

/* ─── THÈME 5 : Neon Night ────────────────────────────────────────── */
[data-theme="neon"]{--primary:#0d0d0d;--primary-light:#1a1a1a;--accent:#00ff88;--accent-bright:#39ff14;--silver:#666;--silver-light:#999;--dark:#0d0d0d;--dark-card:#141414;--darker:#080808;--text:#e0e0e0;--text-muted:#555;--success:#00ff88;--warning:#ffcc00;--danger:#ff2244;--info:#00ccff;--border:rgba(0,255,136,0.12);--shadow:0 0 24px rgba(0,255,136,0.08);--radius:8px;--font-main:'IBM Plex Mono',monospace;--font-title:'Syne',sans-serif;--font-mono:'IBM Plex Mono',monospace;--sidebar-bg:linear-gradient(180deg,#0d0d0d 0%,#080808 100%);--topbar-bg:#0d0d0d;--body-bg:#080808;--input-bg:rgba(0,255,136,0.04);--hover-bg:rgba(0,255,136,0.05);--active-bg:rgba(0,255,136,0.1);--active-border:#00ff88;--nav-text:#444;}

/* ═══════════════════════════════════════════════════════════════════ */
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:var(--font-main);background:var(--body-bg);color:var(--text);min-height:100vh;font-size:14px;transition:background 0.3s,color 0.3s;}

/* Sidebar */
.sidebar{position:fixed;left:0;top:0;bottom:0;width:260px;background:var(--sidebar-bg);border-right:1px solid var(--border);z-index:1000;display:flex;flex-direction:column;overflow-y:auto;}
.sidebar-logo{padding:24px 20px;border-bottom:1px solid var(--border);}
.logo-text{font-family:var(--font-title);font-size:26px;font-weight:700;color:var(--text);letter-spacing:1px;}
[data-theme="clair"] .logo-text,[data-theme="clair"] .nav-item,.sidebar .nav-item{transition:color 0.2s;}
[data-theme="clair"] .logo-text{color:#fff;}
[data-theme="clair"] .logo-sub{color:rgba(255,255,255,0.6);}
.logo-text span{color:var(--accent-bright);}
[data-theme="neon"] .logo-text span{text-shadow:0 0 10px var(--accent);}
.logo-sub{font-size:10px;color:var(--text-muted);letter-spacing:3px;text-transform:uppercase;margin-top:2px;}
.sidebar-nav{padding:16px 0;flex:1;}
.nav-section{padding:8px 20px 4px;font-size:10px;font-weight:600;color:var(--text-muted);letter-spacing:2px;text-transform:uppercase;}
[data-theme="clair"] .nav-section{color:rgba(255,255,255,0.4);}
.nav-item{display:flex;align-items:center;gap:10px;padding:11px 20px;color:var(--nav-text);text-decoration:none;transition:all 0.2s;font-size:14px;border-left:3px solid transparent;margin:1px 0;}
.nav-item:hover{color:var(--text);background:var(--hover-bg);border-left-color:var(--accent);}
[data-theme="clair"] .nav-item:hover{color:#fff;background:rgba(255,255,255,0.1);}
.nav-item.active{color:var(--accent-bright);background:var(--active-bg);border-left-color:var(--active-border);}
[data-theme="clair"] .nav-item.active{color:#fff;background:rgba(255,255,255,0.15);}
[data-theme="neon"] .nav-item.active{text-shadow:0 0 8px var(--accent);}
.nav-item i{width:18px;text-align:center;font-size:15px;}

/* Theme picker */
.theme-picker{padding:12px 16px;border-top:1px solid var(--border);}
.theme-picker-label{font-size:10px;color:var(--text-muted);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:8px;display:block;}
[data-theme="clair"] .theme-picker-label{color:rgba(255,255,255,0.5);}
.theme-dots{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.theme-dot{width:24px;height:24px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:transform 0.2s,border-color 0.2s;position:relative;}
.theme-dot:hover{transform:scale(1.2);}
.theme-dot.active{border-color:white;transform:scale(1.15);}
.theme-dot[data-t="dark-industrial"]{background:linear-gradient(135deg,#0a2463,#3b9ede);}
.theme-dot[data-t="midnight-blue"]{background:linear-gradient(135deg,#0f172a,#818cf8);}
.theme-dot[data-t="savane"]{background:linear-gradient(135deg,#1c1008,#e09444);}
.theme-dot[data-t="clair"]{background:linear-gradient(135deg,#1e3a8a,#93c5fd);}
.theme-dot[data-t="neon"]{background:linear-gradient(135deg,#080808,#00ff88);}
.theme-dot::after{content:attr(data-name);position:absolute;bottom:30px;left:50%;transform:translateX(-50%);background:rgba(0,0,0,0.85);color:#fff;font-size:10px;padding:3px 7px;border-radius:4px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity 0.2s;}
.theme-dot:hover::after{opacity:1;}

/* Main */
.main{margin-left:260px;min-height:100vh;display:flex;flex-direction:column;}
.topbar{height:64px;background:var(--topbar-bg);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 28px;position:sticky;top:0;z-index:100;}
[data-theme="clair"] .topbar{box-shadow:0 1px 8px rgba(0,0,0,0.08);}
.page-title{font-family:var(--font-title);font-size:22px;font-weight:600;color:var(--text);}
.topbar-actions,.topbar-right{display:flex;align-items:center;gap:16px;}
.content{padding:28px;flex:1;}

/* Cards */
.card{background:var(--dark-card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:background 0.3s,border-color 0.3s;}
[data-theme="clair"] .card{box-shadow:var(--shadow);}
.card-header{padding:18px 24px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:12px;}
.card-title{font-family:var(--font-title);font-size:17px;font-weight:600;color:var(--text);}
.card-body{padding:24px;}

/* Stat cards */
.stat-card{background:var(--dark-card);border:1px solid var(--border);border-radius:var(--radius);padding:22px 24px;display:flex;align-items:center;gap:18px;transition:transform 0.2s,border-color 0.2s;}
.stat-card:hover{transform:translateY(-2px);border-color:var(--accent);}
[data-theme="clair"] .stat-card{box-shadow:var(--shadow);}
.stat-icon{width:52px;height:52px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;}
.stat-icon.blue{background:rgba(26,111,196,0.2);color:var(--accent-bright);}
.stat-icon.green{background:rgba(16,185,129,0.2);color:var(--success);}
.stat-icon.orange{background:rgba(245,158,11,0.2);color:var(--warning);}
.stat-icon.red{background:rgba(239,68,68,0.2);color:var(--danger);}
.stat-icon.silver{background:rgba(138,155,176,0.2);color:var(--silver);}
.stat-icon.purple{background:rgba(139,92,246,0.2);color:#a78bfa;}
.stat-value{font-family:var(--font-title);font-size:32px;font-weight:700;color:var(--text);line-height:1;}
.stat-label{font-size:12px;color:var(--text-muted);margin-top:4px;}
.stat-sub{font-size:11px;color:var(--text-muted);margin-top:2px;}

/* Tables */
.table-wrap{overflow-x:auto;}
table{width:100%;border-collapse:collapse;}
th{padding:11px 16px;text-align:left;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);background:rgba(255,255,255,0.02);border-bottom:1px solid var(--border);white-space:nowrap;}
[data-theme="clair"] th{background:#f8fafc;}
td{padding:13px 16px;font-size:13px;border-bottom:1px solid var(--border);color:var(--text);}
tr:last-child td{border-bottom:none;}
tr:hover td{background:var(--hover-bg);}

/* Badges */
.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;white-space:nowrap;}
.badge-success{background:rgba(16,185,129,0.15);color:var(--success);}
.badge-warning{background:rgba(245,158,11,0.15);color:var(--warning);}
.badge-danger{background:rgba(239,68,68,0.15);color:var(--danger);}
.badge-info{background:rgba(59,130,246,0.15);color:var(--info);}
.badge-secondary{background:rgba(255,255,255,0.06);color:var(--text-muted);}
.badge-primary{background:rgba(26,111,196,0.2);color:var(--accent-bright);}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:7px;padding:9px 18px;border-radius:8px;font-size:13px;font-weight:600;text-decoration:none;cursor:pointer;transition:all 0.2s;border:none;font-family:var(--font-main);white-space:nowrap;}
.btn-primary{background:var(--accent);color:white;}
.btn-primary:hover{opacity:0.9;transform:translateY(-1px);}
[data-theme="neon"] .btn-primary{box-shadow:0 0 12px rgba(0,255,136,0.3);color:#000;}
.btn-secondary{background:var(--dark-card);color:var(--text);border:1px solid var(--border);}
[data-theme="clair"] .btn-secondary{background:white;border-color:#e2e8f0;}
.btn-secondary:hover{border-color:var(--accent);color:var(--accent-bright);}
.btn-success{background:var(--success);color:white;}
.btn-danger{background:var(--danger);color:white;}
.btn-warning{background:var(--warning);color:#1a1a1a;}
.btn-sm{padding:6px 12px;font-size:12px;}
.btn-lg{padding:12px 24px;font-size:15px;}

/* Forms */
.form-group{margin-bottom:18px;}
.form-label{display:block;font-size:12px;font-weight:600;color:var(--text-muted);margin-bottom:6px;text-transform:uppercase;letter-spacing:0.5px;}
.form-control{width:100%;padding:10px 14px;background:var(--input-bg);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:14px;transition:border-color 0.2s,box-shadow 0.2s;font-family:var(--font-main);}
.form-control:focus{outline:none;border-color:var(--accent);background:var(--active-bg);}
[data-theme="clair"] .form-control{background:white;border-color:#e2e8f0;color:#0f172a;}
[data-theme="clair"] .form-control:focus{box-shadow:0 0 0 3px rgba(37,99,235,0.1);}
select.form-control option{background:var(--dark);color:var(--text);}
[data-theme="clair"] select.form-control option{background:white;color:#0f172a;}
.form-row{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.form-row-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}

/* Grid */
.grid{display:grid;gap:20px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}

/* Alerts */
.alert{display:flex;align-items:flex-start;gap:12px;padding:14px 18px;border-radius:10px;margin-bottom:12px;font-size:13px;}
.alert-warning{background:rgba(245,158,11,0.12);border:1px solid rgba(245,158,11,0.3);color:#fbbf24;}
.alert-danger{background:rgba(239,68,68,0.12);border:1px solid rgba(239,68,68,0.3);color:#f87171;}
.alert-success{background:rgba(16,185,129,0.12);border:1px solid rgba(16,185,129,0.3);color:#34d399;}
.alert-info{background:rgba(59,130,246,0.12);border:1px solid rgba(59,130,246,0.3);color:#60a5fa;}

/* Messages */
.messages-container{position:fixed;top:80px;right:24px;z-index:9999;width:360px;}
.message{padding:14px 18px;border-radius:10px;margin-bottom:8px;font-size:13px;display:flex;align-items:center;gap:10px;animation:slideIn 0.3s ease;box-shadow:var(--shadow);}
.message-success{background:#065f46;border:1px solid #059669;color:#6ee7b7;}
.message-error{background:#7f1d1d;border:1px solid #dc2626;color:#fca5a5;}
.message-warning{background:#78350f;border:1px solid #d97706;color:#fcd34d;}
[data-theme="clair"] .message-success{background:#d1fae5;border-color:#059669;color:#065f46;}
[data-theme="clair"] .message-error{background:#fee2e2;border-color:#dc2626;color:#991b1b;}
@keyframes slideIn{from{transform:translateX(100%);opacity:0;}to{transform:translateX(0);opacity:1;}}

/* Misc */
.status-dot{width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:6px;}
.status-dot.green{background:var(--success);box-shadow:0 0 6px var(--success);}
.status-dot.orange{background:var(--warning);}
.status-dot.red{background:var(--danger);}
.status-dot.gray{background:var(--silver);}
.status-dot.blue{background:var(--accent-bright);}
.avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--accent));display:flex;align-items:center;justify-content:center;font-family:var(--font-title);font-weight:700;font-size:14px;color:white;flex-shrink:0;}
.search-bar{display:flex;align-items:center;gap:8px;background:var(--input-bg);border:1px solid var(--border);border-radius:8px;padding:7px 14px;width:280px;}
.search-bar input{background:none;border:none;color:var(--text);font-size:13px;flex:1;outline:none;font-family:var(--font-main);}
.search-bar i{color:var(--text-muted);}
[data-theme="clair"] .search-bar input{color:#0f172a;}
.pagination{display:flex;align-items:center;gap:6px;padding:16px 24px;border-top:1px solid var(--border);}
.page-link{padding:6px 12px;border-radius:6px;background:var(--dark-card);color:var(--silver);text-decoration:none;font-size:13px;border:1px solid var(--border);transition:all 0.2s;}
.page-link:hover,.page-link.active{background:var(--accent);color:white;border-color:var(--accent);}
.progress{height:6px;background:rgba(255,255,255,0.08);border-radius:3px;overflow:hidden;}
.progress-bar{height:100%;border-radius:3px;background:linear-gradient(90deg,var(--accent),var(--accent-bright));transition:width 0.5s ease;}
[data-theme="neon"] .progress-bar{box-shadow:0 0 8px var(--accent);}
.vehicle-card{background:var(--dark-card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;transition:all 0.2s;cursor:pointer;}
.vehicle-card:hover{border-color:var(--accent);transform:translateY(-3px);}
[data-theme="neon"] .vehicle-card:hover{box-shadow:0 0 20px rgba(0,255,136,0.1);}
.vehicle-card-header{padding:20px;background:linear-gradient(135deg,var(--primary) 0%,var(--dark) 100%);display:flex;align-items:center;justify-content:space-between;}
[data-theme="clair"] .vehicle-card-header{background:linear-gradient(135deg,#1e3a8a,#2563eb);}
.vehicle-card-body{padding:18px;}
.vehicle-plate{font-family:var(--font-mono);font-size:16px;font-weight:600;background:rgba(255,255,255,0.15);padding:4px 12px;border-radius:6px;}
.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;}
.section-title{font-family:var(--font-title);font-size:20px;font-weight:700;color:var(--text);}
.filter-bar{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap;}
.filter-bar select{background:var(--input-bg);border:1px solid var(--border);border-radius:8px;color:var(--text);padding:8px 12px;font-size:13px;outline:none;}
[data-theme="clair"] .filter-bar select{background:white;color:#0f172a;}
.auth-wrapper{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--body-bg);}
.auth-card{width:420px;background:var(--dark-card);border:1px solid var(--border);border-radius:20px;padding:48px 40px;}
[data-theme="clair"] .auth-card{box-shadow:0 8px 40px rgba(0,0,0,0.12);}
.info-row{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border);}
.info-row:last-child{border-bottom:none;}
.info-label{color:var(--text-muted);font-size:13px;}
.info-value{color:var(--text);font-weight:500;}
.divider{height:1px;background:var(--border);margin:20px 0;}
.text-muted{color:var(--text-muted);}.text-success{color:var(--success);}.text-warning{color:var(--warning);}.text-danger{color:var(--danger);}.text-info{color:var(--accent-bright);}
.text-right{text-align:right;}.text-center{text-align:center;}
.fw-bold{font-weight:700;}.fw-semi{font-weight:600;}
.d-flex{display:flex;}.align-center{align-items:center;}
.gap-8{gap:8px;}.gap-12{gap:12px;}
.mb-4{margin-bottom:4px;}.mb-8{margin-bottom:8px;}.mb-16{margin-bottom:16px;}.mb-24{margin-bottom:24px;}.mt-16{margin-top:16px;}.mt-24{margin-top:24px;}
.font-mono{font-family:var(--font-mono);}.rajdhani{font-family:var(--font-title);}
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-track{background:var(--body-bg);}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1);border-radius:3px;}
[data-theme="clair"] ::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.15);}
@media(max-width:1200px){.grid-4{grid-template-columns:repeat(2,1fr);}}
@media(max-width:768px){.sidebar{transform:translateX(-100%);}.main{margin-left:0;}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}.form-row,.form-row-3{grid-template-columns:1fr;}.search-bar{width:200px;}}
