:root{
    --navy:#185FA5;
    --dark:#0C447C;
    --sidebar:#12203A;
    --sidebar-text:#AEB8C9;
    --teal:#0F6E56;
    --light-teal:#E1F5EE;
    --coral:#993C1D;
    --light-coral:#FAECE7;
    --amber:#854F0B;
    --light-amber:#FAEEDA;
    --gray:#5F5E5A;
    --light-gray:#F1EFE8;
    --border:#D3D1C7;
    --dark-text:#2C2C2A;
    --light-blue:#E6F1FB;
    --bg:#F7F7F5;
}

*{box-sizing:border-box;}
body{
    margin:0;
    font-family:-apple-system,"Segoe UI",Arial,sans-serif;
    background:var(--bg);
    color:var(--dark-text);
}
a{color:inherit;}

/* ===== Layout ===== */
.admin-layout{display:flex;min-height:100vh;}

.sidebar{
    width:240px;
    flex-shrink:0;
    background:var(--sidebar);
    color:var(--sidebar-text);
    display:flex;
    flex-direction:column;
    padding:20px 0;
    position:sticky;
    top:0;
    height:100vh;
    overflow-y:auto;
}
.sidebar .brand{display:flex;align-items:center;gap:10px;padding:0 20px 20px;position:relative;flex-shrink:0;}
.sidebar .brand span{font-weight:700;color:#fff;font-size:15px;}

.sidebar nav{display:flex;flex-direction:column;gap:2px;padding:0 10px;flex-shrink:0;}
.sidebar nav a{
    display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;font-size:13.5px;
    color:var(--sidebar-text);text-decoration:none;
}
.sidebar nav a:hover{background:rgba(255,255,255,.06);color:#fff;}
.sidebar nav a.active{background:var(--navy);color:#fff;font-weight:600;}

.main{flex:1;min-width:0;display:flex;flex-direction:column;}

.topbar{
    height:64px;background:#fff;border-bottom:1px solid var(--border);
    display:flex;align-items:center;justify-content:space-between;padding:0 28px;flex-shrink:0;
}
.topbar h1{font-size:19px;color:var(--dark);margin:0;font-weight:700;}
.topbar p{font-size:12px;color:var(--gray);margin:2px 0 0;}
.topbar .admin-user{font-size:13px;font-weight:700;color:var(--dark-text);}

.content{padding:26px 28px;}

/* ===== Grids & cards ===== */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:22px;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:22px;}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:22px;}
.grid-2-1{display:grid;grid-template-columns:2.2fr 1fr;gap:14px;margin-bottom:22px;}

.card{background:#fff;border:1px solid var(--border);border-radius:10px;padding:18px;}
.card h3{font-size:13.5px;font-weight:700;color:var(--dark-text);margin:0 0 14px;}

.kpi-card .label{font-size:12px;color:var(--gray);}
.kpi-card .value{font-size:25px;font-weight:700;color:var(--dark-text);margin:6px 0 4px;}
.kpi-card .delta{font-size:11.5px;font-weight:700;color:var(--teal);}
.kpi-card .delta.negative{color:var(--coral);}

/* ===== Tables ===== */
table.admin-table{width:100%;border-collapse:collapse;font-size:13px;}
table.admin-table th{background:var(--light-blue);color:var(--dark);text-align:left;padding:9px 12px;font-size:12px;font-weight:700;}
table.admin-table td{padding:10px 12px;border-top:1px solid var(--border);}
table.admin-table tr:first-child td{border-top:none;}
.table-card{overflow-x:auto;}
.table-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;}

/* ===== Badges ===== */
.badge{display:inline-block;padding:3px 9px;border-radius:6px;font-size:11px;font-weight:700;white-space:nowrap;}
.badge-blue{background:var(--light-blue);color:var(--navy);}
.badge-teal{background:var(--light-teal);color:var(--teal);}
.badge-coral{background:var(--light-coral);color:var(--coral);}
.badge-amber{background:var(--light-amber);color:var(--amber);}
.badge-gray{background:var(--light-gray);color:var(--gray);}

/* ===== Buttons ===== */
.btn{
    display:inline-flex;align-items:center;justify-content:center;gap:6px;
    padding:9px 16px;border-radius:8px;font-size:13px;font-weight:700;
    text-decoration:none;cursor:pointer;border:1px solid var(--border);
    background:#fff;color:var(--dark-text);
}
.btn:hover{background:var(--light-gray);}
.btn-primary{background:var(--navy);border-color:var(--navy);color:#fff;}
.btn-primary:hover{background:var(--dark);}
.btn-danger{border-color:var(--coral);color:var(--coral);background:#fff;}
.btn-danger:hover{background:var(--light-coral);}
.btn-sm{padding:5px 11px;font-size:12px;}
.btn-block{width:100%;}

/* ===== Tabs / segmented control ===== */
.tabs{display:inline-flex;background:var(--light-gray);padding:3px;border-radius:8px;margin-bottom:16px;}
.tabs a{padding:7px 16px;border-radius:6px;font-size:13px;color:var(--gray);text-decoration:none;}
.tabs a.active{background:#fff;color:var(--dark-text);font-weight:700;}

.filter-tabs{display:flex;gap:8px;margin-bottom:18px;flex-wrap:wrap;}
.filter-tabs a{padding:7px 14px;border-radius:8px;font-size:13px;color:var(--gray);text-decoration:none;border:1px solid transparent;}
.filter-tabs a.active{background:var(--light-blue);color:var(--dark);font-weight:700;}
.filter-tabs a:not(.active){border-color:var(--border);}

/* ===== Forms ===== */
.form-group{margin-bottom:16px;}
.form-group label{display:block;font-size:12.5px;color:var(--gray);margin-bottom:6px;font-weight:600;}
.form-control{
    width:100%;padding:9px 12px;border:1px solid var(--border);border-radius:8px;
    font-size:13.5px;color:var(--dark-text);background:#fff;font-family:inherit;
}
.form-control:focus{outline:none;border-color:var(--navy);}
.form-row{display:flex;gap:14px;}
.form-row .form-group{flex:1;}

/* ===== Misc ===== */
.section-title{font-size:22px;font-weight:700;color:var(--dark);margin:0 0 4px;}
.section-subtitle{font-size:13px;color:var(--gray);margin:0 0 20px;}
.avatar-circle{
    width:34px;height:34px;border-radius:50%;background:var(--light-blue);color:var(--navy);
    display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0;
}
.list-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--border);}
.list-row:first-child{border-top:none;}
.progress-bar{height:8px;background:#EDEDEA;border-radius:4px;overflow:hidden;}
.progress-bar > span{display:block;height:100%;background:var(--navy);}
.empty-state{padding:40px 20px;text-align:center;color:var(--gray);font-size:13.5px;}
.chart-wrap{position:relative;}
.checkbox-row{display:flex;align-items:center;gap:8px;padding:10px 0;border-top:1px solid var(--border);}
.checkbox-row:first-child{border-top:none;}

/* ===== Pages d'authentification (Breeze sans Vite) ===== */
.auth-page{
    min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
    padding:24px;position:relative;overflow:hidden;
    background:
        repeating-linear-gradient(120deg, rgba(255,255,255,0.045) 0px, rgba(255,255,255,0.045) 2px, transparent 2px, transparent 34px),
        linear-gradient(135deg, var(--sidebar) 0%, var(--navy) 60%, var(--dark) 100%);
}
.auth-logo{
    width:60px;height:60px;border-radius:16px;background:rgba(255,255,255,0.12);color:#fff;
    display:flex;align-items:center;justify-content:center;font-weight:700;font-size:26px;margin-bottom:16px;
    border:1px solid rgba(255,255,255,0.25);position:relative;z-index:1;
}
.auth-brand{color:#fff;font-size:19px;font-weight:700;margin:0;position:relative;z-index:1;}
.auth-brand-subtitle{color:rgba(255,255,255,0.65);font-size:13px;margin:4px 0 24px;position:relative;z-index:1;}
.auth-card{
    width:100%;max-width:400px;background:#fff;border:1px solid var(--border);
    border-radius:12px;padding:32px;position:relative;z-index:1;
    box-shadow:0 20px 50px rgba(12,68,124,0.25);
}
.auth-card h1, .auth-card h2{font-size:16px;font-weight:700;color:var(--dark);margin:0 0 16px;}
.auth-card label{display:block;font-size:12.5px;color:var(--gray);margin-bottom:6px;font-weight:600;}
.auth-card input[type=text],
.auth-card input[type=email],
.auth-card input[type=password]{
    width:100%;padding:9px 12px;border:1px solid var(--border);border-radius:8px;
    font-size:13.5px;color:var(--dark-text);margin-bottom:16px;font-family:inherit;
}
.auth-card input:focus{outline:none;border-color:var(--navy);}
.auth-card button[type=submit]{
    display:inline-flex;align-items:center;justify-content:center;
    padding:9px 18px;border-radius:8px;font-size:13px;font-weight:700;
    background:var(--navy);color:#fff;border:none;cursor:pointer;width:100%;
}
.auth-card button[type=submit]:hover{background:var(--dark);}
.auth-card a{color:var(--navy);font-size:13px;text-decoration:none;}
.auth-card a:hover{text-decoration:underline;}
.auth-card .text-red-600, .auth-card .text-sm.text-red-600{color:var(--coral);font-size:12px;margin-top:-10px;margin-bottom:14px;display:block;}
.auth-card .text-green-600{color:var(--teal);font-size:12.5px;margin-bottom:16px;display:block;}

/* ===== Icônes & navigation ===== */
.nav-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:18px;}
.nav-text{white-space:nowrap;overflow:hidden;}

/* ===== Logo (image) dans la sidebar ===== */
.brand-logo-img{
    width:34px;height:34px;border-radius:8px;object-fit:cover;flex-shrink:0;
}

/* ===== Bouton réduire le menu — ancré en bas de la sidebar ===== */
.sidebar-collapse-btn{
    display:flex;align-items:center;gap:10px;margin:auto 10px 16px;padding:10px 12px;
    background:transparent;border:1px solid rgba(255,255,255,.12);border-radius:8px;
    color:var(--sidebar-text);font-size:13px;cursor:pointer;font-family:inherit;flex-shrink:0;
}
.sidebar-collapse-btn:hover{background:rgba(255,255,255,.06);color:#fff;}

/* ===== Sidebar réduite (icônes seules) ===== */
.admin-layout.sidebar-collapsed .sidebar{width:68px;}
.admin-layout.sidebar-collapsed .brand-text,
.admin-layout.sidebar-collapsed .nav-text{display:none;}
.admin-layout.sidebar-collapsed .brand{justify-content:center;padding:0 0 20px;}
.admin-layout.sidebar-collapsed .brand-logo-img{margin:0 auto;}
.admin-layout.sidebar-collapsed nav a{justify-content:center;padding:12px 0;}
.admin-layout.sidebar-collapsed .sidebar-collapse-btn{justify-content:center;}
.admin-layout.sidebar-collapsed .sidebar-collapse-btn svg{transform:rotate(180deg);}

/* ===== Topbar : icônes, notifications, déconnexion ===== */
.topbar-left{display:flex;align-items:center;gap:14px;}
.topbar-right{display:flex;align-items:center;gap:6px;}
.icon-btn{
    display:flex;align-items:center;justify-content:center;width:38px;height:38px;
    border-radius:8px;border:1px solid transparent;background:transparent;color:var(--gray);
    cursor:pointer;position:relative;flex-shrink:0;
}
.icon-btn:hover{background:var(--light-gray);color:var(--dark-text);}
.mobile-menu-btn{display:none;}

.notif-wrap{position:relative;}
.notif-badge{
    position:absolute;top:4px;right:4px;min-width:16px;height:16px;padding:0 3px;border-radius:8px;
    background:var(--coral);color:#fff;font-size:9.5px;font-weight:700;
    display:flex;align-items:center;justify-content:center;line-height:1;
}
.notif-dropdown{
    display:none;position:absolute;top:46px;right:0;width:300px;max-height:360px;overflow-y:auto;
    background:#fff;border:1px solid var(--border);border-radius:10px;
    box-shadow:0 12px 30px rgba(0,0,0,0.12);z-index:60;
}
.notif-dropdown.show{display:block;}
.notif-dropdown-head{padding:12px 14px;font-size:12.5px;font-weight:700;color:var(--dark-text);border-bottom:1px solid var(--border);}
.notif-item{padding:10px 14px;border-top:1px solid var(--border);}
.notif-item:first-of-type{border-top:none;}
.notif-text{font-size:12.5px;color:var(--dark-text);}
.notif-date{font-size:11px;color:var(--gray);margin-top:2px;}
.notif-empty{padding:20px 14px;font-size:12.5px;color:var(--gray);text-align:center;}

/* ===== Overlay mobile ===== */
.sidebar-overlay{display:none;}

/* ===== Responsive ===== */
@media (max-width: 880px){
    .sidebar{
        position:fixed;top:0;left:0;height:100vh;z-index:70;
        transform:translateX(-100%);transition:transform .2s ease;
    }
    .admin-layout.mobile-sidebar-open .sidebar{transform:translateX(0);}
    .admin-layout.mobile-sidebar-open .sidebar-overlay{
        display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.4);z-index:60;
    }
    .admin-layout.sidebar-collapsed .sidebar{width:240px;} /* le mode réduit n'a pas de sens sur mobile */
    .admin-layout.sidebar-collapsed .brand-text,
    .admin-layout.sidebar-collapsed .nav-text{display:inline;}
    .admin-layout.sidebar-collapsed .brand{justify-content:flex-start;padding:0 20px 20px;}
    .admin-layout.sidebar-collapsed .brand-logo-img{margin:0;}
    .admin-layout.sidebar-collapsed nav a{justify-content:flex-start;padding:10px 12px;}
    .sidebar-collapse-btn{display:none;}
    .mobile-menu-btn{display:flex;}
    .topbar{padding:0 16px;}
    .content{padding:18px 16px;}
    .admin-user{display:none;}
    .grid-2-1, .grid-2, .grid-3{grid-template-columns:1fr;}
    .notif-dropdown{width:260px;right:-40px;}
}

@media (max-width: 480px){
    .topbar h1{font-size:16px;}
    .topbar p{display:none;}
    .kpi-card .value{font-size:20px;}
}

/* ===== Notifications cliquables ===== */
.notif-item{display:block;text-decoration:none;}
.notif-item:hover{background:var(--light-gray);}

/* ===== Notifications cliquables (lu / non-lu) ===== */
.notif-item{display:block;text-decoration:none;}
.notif-item:hover{background:var(--light-gray);}

/* ===== Pagination (remplace la vue Tailwind par défaut de Laravel) ===== */
.pagination-nav{
    display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;
    gap:12px;font-size:12.5px;color:var(--gray);
}
.pagination-links{display:flex;gap:4px;flex-wrap:wrap;}
.page-link{
    display:inline-flex;align-items:center;justify-content:center;
    min-width:32px;height:32px;padding:0 10px;border-radius:6px;
    border:1px solid var(--border);background:#fff;color:var(--dark-text);
    font-size:12.5px;text-decoration:none;line-height:1;
}
.page-link:hover{background:var(--light-gray);}
.page-link.active{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:700;}
.page-link.disabled{color:var(--border);background:#fff;cursor:default;}
@media (max-width: 560px){
    .pagination-info{display:none;}
    .pagination-nav{justify-content:center;}
}
