:root {
  --navy: #07182f;
  --navy-2: #0b2344;
  --blue: #0b5ed7;
  --cyan: #0dcaf0;
  --green: #00a86b;
  --orange: #ff9f1c;
  --purple: #6f42c1;
  --red: #dc3545;
  --bg: #f3f6fb;
  --text: #1d2939;
  --muted: #667085;
  --border: #e5e7eb;
  --white: #ffffff;
  --shadow: 0 12px 35px rgba(16, 24, 40, .08);
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  font-family: "Segoe UI", Arial, sans-serif;
  color: var(--text);
}

a {
  text-decoration: none;
}

.login-page {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at top left, #0dcaf0, transparent 30%),
    linear-gradient(135deg, #07182f 20%, #0b5ed7 60%, #00a86b);
}

.login-box {
  width: 440px;
  background: rgba(255, 255, 255, .96);
  border-radius: 30px;
  padding: 38px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .35);
}

.login-logo {
  width: 74px;
  height: 74px;
  border-radius: 22px;
  background: linear-gradient(135deg, var(--blue), var(--green));
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 24px;
  margin: auto;
}

.login-box h1 {
  text-align: center;
  font-weight: 900;
  margin-top: 18px;
  color: var(--navy);
}

.login-box p {
  text-align: center;
  color: var(--muted);
}

.btn-premium {
  background: linear-gradient(135deg, var(--blue), var(--green));
  color: white;
  border: 0;
  border-radius: 12px;
  padding: 10px 18px;
  font-weight: 700;
}

.btn-premium:hover {
  color: white;
  filter: brightness(.95);
}

.app-shell {
  display: flex;
  min-height: 100vh;
}

/* =========================================================
   SIDEBAR
========================================================= */

.sidebar {
    position: fixed;
    top: 0;
    left: 0;
    width: 280px;
    height: 100vh;
    overflow-y: auto;
    background: linear-gradient(180deg, var(--navy), var(--navy-2));
    color: white;
    padding: 24px;
    z-index: 1000;
}

.brand {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 30px;
}

.brand-icon {
    width: 54px;
    height: 54px;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--cyan), var(--green));
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 20px;
    font-weight: bold;
    color: white;
}

.brand h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 800;
}

.brand small {
    color: #c9d3e8;
}

.sidebar nav {
    margin-top: 20px;
}

.sidebar nav a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    margin-bottom: 8px;
    border-radius: 14px;
    color: #eef3ff;
    font-weight: 600;
    transition: .25s;
}

.sidebar nav a:hover {
    background: rgba(255,255,255,.10);
    transform: translateX(4px);
}

.sidebar nav a.active {
    background: linear-gradient(135deg,var(--blue),var(--green));
    color: white;
}

/* =========================================================
   MAIN
========================================================= */

.main{
    margin-left:280px;
    width:calc(100% - 280px);
    padding:30px;
}

/* =========================================================
   TOPBAR
========================================================= */

.topbar{
    height:72px;
    background:white;
    border-radius:20px;
    box-shadow:var(--shadow);

    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:0 24px;
    margin-bottom:25px;
}

.topbar b{
    display:block;
    font-size:17px;
}

.topbar span{
    color:var(--muted);
    font-size:13px;
}

/* =========================================================
   TITRES
========================================================= */

.page-title{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:25px;
}

.page-title h1{
    margin:0;
    font-size:34px;
    font-weight:900;
    color:var(--navy);
}

.page-title p{
    margin-top:6px;
    color:var(--muted);
}

/* =========================================================
   KPI
========================================================= */

.kpi-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:18px;
}

/*=====================================================
 KPI PREMIUM
======================================================*/

.kpi-grid{

    display:grid;

    grid-template-columns:repeat(5,1fr);

    gap:18px;

    margin-top:18px;

}

.kpi{

    position:relative;

    overflow:hidden;

    color:white;

    border-radius:22px;

    padding:18px 22px;

    min-height:145px;

    box-shadow:0 15px 35px rgba(0,0,0,.12);

    transition:.35s;

    cursor:pointer;

}

.kpi:hover{

    transform:translateY(-6px);

    box-shadow:0 25px 45px rgba(0,0,0,.18);

}

.kpi::before{

    content:"";

    position:absolute;

    width:130px;

    height:130px;

    right:-35px;

    top:-35px;

    border-radius:50%;

    background:rgba(255,255,255,.10);

}

.kpi span{

    display:block;

    font-size:15px;

    opacity:.95;

    font-weight:600;

}

.kpi b{

    display:block;

    font-size:42px;

    margin-top:12px;

    margin-bottom:6px;

    font-weight:900;

    line-height:1;

}

.kpi small{

    display:block;

    font-size:13px;

    opacity:.90;

    line-height:1.45;

}

.kpi.blue{

    background:linear-gradient(135deg,#246BFD,#1248A5);

}

.kpi.cyan{

    background:linear-gradient(135deg,#20C6E8,#1496C8);

}

.kpi.orange{

    background:linear-gradient(135deg,#FF9F1C,#E67E00);

}

.kpi.purple{

    background:linear-gradient(135deg,#7B4BDB,#5A32A3);

}

.kpi.green{

    background:linear-gradient(135deg,#13B26B,#0C8750);

}

/* =========================================================
   PANELS
========================================================= */

.panel{
    background:white;
    border-radius:24px;
    padding:24px;
    margin-bottom:25px;
    box-shadow:var(--shadow);
}

.panel-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:20px;
}

.panel-header h3{
    margin:0;
    font-size:22px;
    font-weight:800;
    color:var(--navy);
}

.panel-header p{
    margin-top:4px;
    color:var(--muted);
    font-size:14px;
}

.panel-header a{
    font-weight:700;
}

/* =========================================================
   TABLEAUX
========================================================= */

.table {
  margin-bottom: 0;
}

.table thead th,
.table tr:first-child th {
  background: #f8fafc;
  color: var(--muted);
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .04em;
  border-bottom: 1px solid var(--border);
  padding: 14px;
}

.table td {
  padding: 14px;
  vertical-align: middle;
  border-color: #eef2f7;
}

.table tbody tr:hover {
  background: #f8fbff;
}

/* =========================================================
   FORMULAIRES
========================================================= */

label {
  font-weight: 700;
  color: var(--navy);
  margin-bottom: 6px;
}

.form-control,
.form-select {
  border-radius: 14px;
  border: 1px solid var(--border);
  padding: 11px 14px;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 4px rgba(11, 94, 215, .12);
}

/* =========================================================
   BADGES ET BOUTONS
========================================================= */

.badge {
  border-radius: 999px;
  padding: 8px 12px;
  font-weight: 700;
}

.btn {
  border-radius: 12px;
  font-weight: 700;
}

/* =========================================================
   STATISTIQUES AGENCES
========================================================= */

.agency-stat {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px dashed #e5e7eb;
  padding: 13px 0;
}

.agency-stat span {
  color: var(--text);
  font-weight: 600;
}

.agency-stat b {
  color: var(--blue);
  font-size: 20px;
}

/* =========================================================
   DOSSIER INCIDENT
========================================================= */

.incident-hero {
  background: linear-gradient(135deg, var(--navy), var(--blue));
  color: white;
  border-radius: 28px;
  padding: 30px;
  margin-bottom: 22px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: var(--shadow);
}

.incident-hero h1 {
  margin: 0;
  font-weight: 900;
  font-size: 34px;
}

.incident-hero p {
  margin: 6px 0 0;
  color: #dbeafe;
}

.status-pill {
  background: rgba(255,255,255,.16);
  padding: 13px 20px;
  border-radius: 999px;
  font-weight: 800;
}

/* =========================================================
   WORKFLOW
========================================================= */

.workflow-line {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 10px;
  margin-bottom: 24px;
}

.workflow-line div {
  background: white;
  border-radius: 18px;
  padding: 14px 10px;
  text-align: center;
  box-shadow: var(--shadow);
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}

.workflow-line div.active {
  background: #e7f1ff;
  color: var(--blue);
  border: 1px solid rgba(11,94,215,.25);
}

.workflow-line span {
  display: block;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #cbd5e1;
  margin: 0 auto 8px;
}

.workflow-line .active span {
  background: var(--blue);
  box-shadow: 0 0 0 6px rgba(11,94,215,.12);
}

/* =========================================================
   GRILLE INFO INCIDENT
========================================================= */

.info-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.info-grid p {
  background: #f8fafc;
  border: 1px solid #edf2f7;
  border-radius: 16px;
  padding: 13px;
  margin: 0;
}

.info-grid b {
  display: block;
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 4px;
}

.info-grid span {
  font-weight: 800;
  color: var(--navy);
}

/* =========================================================
   TIMELINE AUDIT
========================================================= */

.timeline {
  border-left: 3px solid var(--blue);
  padding-left: 18px;
}

.timeline-item {
  position: relative;
  background: #f8fafc;
  border-radius: 16px;
  padding: 14px;
  margin: 14px 0;
}

.timeline-item::before {
  content: "";
  position: absolute;
  left: -27px;
  top: 18px;
  width: 14px;
  height: 14px;
  background: var(--blue);
  border-radius: 50%;
  border: 3px solid white;
}

.timeline-item b {
  display: block;
  color: var(--navy);
}

.timeline-item small {
  display: block;
  color: var(--muted);
  margin-top: 3px;
}

/* =========================================================
   VALIDATIONS
========================================================= */

.validation-card {
  border: 1px solid var(--border);
  border-left: 5px solid var(--green);
  border-radius: 16px;
  padding: 14px;
  margin-bottom: 12px;
  background: #fbfdff;
}

.validation-card b {
  display: block;
  color: var(--navy);
}

.validation-card small {
  display: block;
  color: var(--muted);
  margin-top: 4px;
}

/* ==========================================================
   ALERTES
========================================================== */

.alert{
    border:none;
    border-radius:16px;
    padding:16px 20px;
    font-weight:600;
    margin-bottom:20px;
}

.alert-success{
    background:#e7f8ef;
    color:#0b7a4b;
}

.alert-danger{
    background:#fdecec;
    color:#b42318;
}

.alert-warning{
    background:#fff8e6;
    color:#b26a00;
}

.alert-info{
    background:#e8f4ff;
    color:#0b5ed7;
}

/* ==========================================================
   TOAST NOTIFICATION
========================================================== */

.toast-live{

    position:fixed;

    right:30px;

    bottom:30px;

    min-width:320px;

    background:linear-gradient(135deg,var(--navy),var(--blue));

    color:white;

    padding:18px 22px;

    border-radius:18px;

    box-shadow:0 20px 45px rgba(0,0,0,.25);

    display:none;

    z-index:99999;

    animation:slideUp .35s ease;

}

@keyframes slideUp{

    from{

        opacity:0;

        transform:translateY(30px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/* ==========================================================
   LOADING
========================================================== */

.loading{

    display:flex;

    justify-content:center;

    align-items:center;

    padding:50px;

}

.spinner{

    width:50px;

    height:50px;

    border-radius:50%;

    border:5px solid #dde7f4;

    border-top:5px solid var(--blue);

    animation:spin .8s linear infinite;

}

@keyframes spin{

    100%{

        transform:rotate(360deg);

    }

}

/* ==========================================================
   SCROLLBAR
========================================================== */

::-webkit-scrollbar{

    width:9px;

    height:9px;

}

::-webkit-scrollbar-track{

    background:#edf2f7;

}

::-webkit-scrollbar-thumb{

    background:linear-gradient(var(--blue),var(--green));

    border-radius:20px;

}

/* ==========================================================
   FOOTER
========================================================== */

.footer{

    margin-top:40px;

    text-align:center;

    color:var(--muted);

    font-size:13px;

}

/* ==========================================================
   ANIMATIONS
========================================================== */

.fade-in{

    animation:fadeIn .45s ease;

}

@keyframes fadeIn{

    from{

        opacity:0;

        transform:translateY(15px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

.zoom{

    transition:.25s;

}

.zoom:hover{

    transform:scale(1.03);

}

/* ==========================================================
   RESPONSIVE
========================================================== */

@media(max-width:1200px){

    .kpi-grid{

        grid-template-columns:repeat(3,1fr);

    }

}

@media(max-width:992px){

    .sidebar{

        position:relative;

        width:100%;

        height:auto;

    }

    .main{

        margin-left:0;

        width:100%;

    }

    .workflow-line{

        grid-template-columns:repeat(2,1fr);

    }

    .info-grid{

        grid-template-columns:1fr;

    }

}

@media(max-width:768px){

    .page-title{

        flex-direction:column;

        align-items:flex-start;

        gap:15px;

    }

    .topbar{

        flex-direction:column;

        height:auto;

        gap:12px;

        padding:18px;

    }

    .kpi-grid{

        grid-template-columns:1fr;

    }

    .panel{

        padding:18px;

    }

    .table{

        font-size:13px;

    }

}

@media(max-width:576px){

    .login-box{

        width:95%;

        padding:25px;

    }

}

/* ==========================================================
   IMPRESSION
========================================================== */

@media print{

    body{

        background:white;

    }

    .sidebar,
    .topbar,
    .btn,
    .toast-live{

        display:none !important;

    }

    .main{

        margin:0;

        width:100%;

        padding:0;

    }

    .panel{

        box-shadow:none;

        border:1px solid #ccc;

    }

}

/* ==========================================================
   FIN DU FICHIER
========================================================== */
/*=====================================================
UTILISATEURS
======================================================*/

.user-actions{

    display:flex;

    gap:6px;

    flex-wrap:wrap;

    align-items:center;

}

.user-actions form{

    margin:0;

}

.user-actions .btn{

    font-size:12px;

    padding:5px 10px;

}

.table td{

    vertical-align:middle;

}

.table img{

    border:2px solid #e7eef8;

}

.form-label{

    font-weight:600;

    margin-bottom:6px;

}

.form-control,
.form-select{

    height:45px;

    border-radius:12px;

}

.zoom{

    transition:.3s;

}

.zoom:hover{

    transform:translateY(-4px);

}
.tracking-step {
  background: #f8fafc;
  border-radius: 18px;
  padding: 16px 10px;
  border: 1px solid #edf2f7;
  min-height: 110px;
}

.tracking-circle {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  margin: 0 auto 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
}

.tracking-step.done {
  background: #eafaf3;
  border-color: #b7ebd0;
  color: #087443;
}

.tracking-step.done .tracking-circle {
  background: #00a86b;
  color: white;
}

.tracking-step.pending {
  color: #667085;
}

.tracking-step.pending .tracking-circle {
  background: #e5e7eb;
  color: #667085;
}
.agency-kpi-grid {
  gap: 14px;
  margin-top: 8px;
}

.agency-kpi-grid .kpi {
  min-height: 115px;
  padding: 15px 18px;
  border-radius: 18px;
}

.agency-kpi-grid .kpi span {
  font-size: 13px;
}

.agency-kpi-grid .kpi b {
  font-size: 34px;
  margin-top: 8px;
  margin-bottom: 4px;
}

.agency-kpi-grid .kpi small {
  font-size: 12px;
  line-height: 1.25;
}

.notification-badge{
    background:#e53935;
    color:#fff;
    border-radius:50%;
    min-width:22px;
    height:22px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:12px;
    font-weight:700;
    margin-left:auto;
}
/* =========================================================
   KPI ADMINISTRATEUR GÉNÉRAL
========================================================= */
.admin-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-top: 8px;
  margin-bottom: 16px;
}

.admin-kpi-grid .kpi {
  min-height: 108px;
  padding: 14px 15px;
  border-radius: 17px;
}

.admin-kpi-grid .kpi span {
  font-size: 12px;
  font-weight: 700;
}

.admin-kpi-grid .kpi b {
  font-size: 31px;
  line-height: 1;
  margin-top: 8px;
  margin-bottom: 5px;
}

.admin-kpi-grid .kpi small {
  font-size: 11px;
  line-height: 1.2;
  max-width: none;
}

@media (max-width: 1150px) {
  .admin-kpi-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 800px) {
  .admin-kpi-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 520px) {
  .admin-kpi-grid {
    grid-template-columns: 1fr;
  }
}
.supervision-compact {
  padding: 18px 22px;
  margin-bottom: 14px;
}

.supervision-compact h2,
.supervision-compact h3 {
  font-size: 24px;
  margin-bottom: 5px;
}

.supervision-compact p {
  margin-bottom: 0;
  font-size: 14px;
  line-height: 1.4;
}

.supervision-compact .form-control {
  height: 42px;
}

.supervision-compact .btn {
  min-height: 42px;
}
/* =========================================================
   EN-TÊTE COMPACT DU TABLEAU DE BORD
========================================================= */

.topbar-compact {
  height: 58px;
  min-height: 58px;
  margin-bottom: 14px;
  padding: 0 20px;
  border-radius: 16px;
}

.topbar-compact b {
  font-size: 15px;
}

.topbar-compact span {
  font-size: 12px;
}

.dashboard-header {
  background: transparent;
  margin-bottom: 14px;
}

.dashboard-header-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.dashboard-kicker {
  display: block;
  color: #0b5ed7;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin-bottom: 3px;
}

.dashboard-header h1 {
  margin: 0;
  color: var(--navy);
  font-size: 31px;
  line-height: 1.1;
  font-weight: 900;
}

.dashboard-header p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 14px;
}

.dashboard-header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}

.dashboard-header-actions .btn {
  min-height: 42px;
  padding: 9px 16px;
  border-radius: 12px;
}

/* Centre de supervision encore plus compact */

.supervision-compact {
  padding: 16px 20px;
  margin-bottom: 12px;
  border-radius: 20px;
}

.supervision-compact h2,
.supervision-compact h3 {
  margin: 0 0 4px;
  font-size: 22px;
}

.supervision-compact p {
  margin: 0;
  font-size: 13px;
  line-height: 1.35;
}

/* Cartes plus proches du panneau supérieur */

.admin-kpi-grid {
  margin-top: 0;
  margin-bottom: 14px;
}

@media (max-width: 800px) {
  .dashboard-header-main {
    align-items: flex-start;
    flex-direction: column;
  }

  .dashboard-header-actions {
    width: 100%;
  }

  .dashboard-header-actions .btn {
    flex: 1;
  }
}
/* =========================================================
   DASHBOARD V4
========================================================= */

.dashboard-v4-header {
  margin-bottom: 14px;
}

.dashboard-v4-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.dashboard-v4-kicker {
  display: block;
  color: var(--blue);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  margin-bottom: 3px;
}

.dashboard-v4-heading h1 {
  margin: 0;
  color: var(--navy);
  font-size: 31px;
  line-height: 1.05;
  font-weight: 900;
}

.dashboard-v4-heading p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 14px;
}

.dashboard-v4-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.dashboard-v4-search {
  display: flex;
  align-items: center;
  gap: 8px;
}

.dashboard-v4-search input {
  width: 225px;
  height: 42px;
  border-radius: 12px;
}

.dashboard-v4-actions .btn {
  min-height: 42px;
  white-space: nowrap;
  border-radius: 12px;
}

.dashboard-v4-kpis {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.dashboard-v4-kpi {
  min-height: 92px;
  padding: 14px 16px;
  border-radius: 18px;
  color: white;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: var(--shadow);
  transition: 0.2s ease;
  overflow: hidden;
  position: relative;
}

.dashboard-v4-kpi:hover {
  color: white;
  transform: translateY(-3px);
}

.dashboard-v4-kpi::after {
  content: '';
  position: absolute;
  width: 85px;
  height: 85px;
  right: -20px;
  top: -30px;
  border-radius: 50%;
  background: rgba(255,255,255,.12);
}

.dashboard-v4-kpi div {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.dashboard-v4-kpi span {
  font-size: 13px;
  font-weight: 800;
}

.dashboard-v4-kpi strong {
  font-size: 30px;
  line-height: 1;
}

.dashboard-v4-kpi small {
  font-size: 11px;
  opacity: 0.9;
}

.kpi-total {
  background: linear-gradient(135deg, #0b5ed7, #063b8a);
}

.kpi-new {
  background: linear-gradient(135deg, #0dcaf0, #087990);
}

.kpi-rsi {
  background: linear-gradient(135deg, #ff9f1c, #d35400);
}

.kpi-dg {
  background: linear-gradient(135deg, #6f42c1, #3d1c78);
}

.kpi-closed {
  background: linear-gradient(135deg, #00a86b, #05603a);
}

.dashboard-v4-panel {
  height: 100%;
  padding: 20px;
  border-radius: 22px;
}

.dashboard-v4-panel-header {
  margin-bottom: 14px;
}

.dashboard-v4-panel-header h3 {
  margin-bottom: 2px;
  font-size: 19px;
}

.dashboard-v4-panel-header p {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.dashboard-v4-table th {
  font-size: 11px;
  text-transform: uppercase;
  color: var(--muted);
}

.dashboard-v4-table td {
  font-size: 13px;
}

.dashboard-v4-title {
  display: block;
  max-width: 230px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.dashboard-v4-status-list {
  display: flex;
  flex-direction: column;
}

.dashboard-v4-status-item,
.dashboard-v4-agency-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 11px 0;
  border-bottom: 1px solid #edf2f7;
  color: var(--text);
  text-decoration: none;
}

.dashboard-v4-status-item:last-child,
.dashboard-v4-agency-item:last-child {
  border-bottom: 0;
}

.dashboard-v4-status-item:hover {
  color: var(--blue);
}

.dashboard-v4-status-item strong,
.dashboard-v4-agency-item strong {
  color: var(--blue);
  font-size: 17px;
}

.dashboard-v4-chart {
  position: relative;
  height: 260px;
}

.dashboard-v4-chart-small {
  height: 190px;
}

.dashboard-v4-indicator {
  background: #edf6ff;
  color: var(--blue);
  padding: 7px 11px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}

.dashboard-v4-priority-summary {
  margin-top: 12px;
}

.dashboard-v4-priority-summary > div {
  display: grid;
  grid-template-columns: 12px 1fr auto;
  align-items: center;
  gap: 8px;
  padding: 7px 0;
  font-size: 12px;
}

.priority-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
}

.priority-dot.critical {
  background: #dc3545;
}

.priority-dot.high {
  background: #ff9f1c;
}

.priority-dot.normal {
  background: #0b5ed7;
}

.priority-dot.low {
  background: #00a86b;
}

.dashboard-v4-empty {
  min-height: 150px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  color: var(--muted);
}

.dashboard-v4-empty > span {
  font-size: 28px;
}

.dashboard-v4-empty strong,
.dashboard-v4-empty small {
  display: block;
}

@media (max-width: 1200px) {
  .dashboard-v4-kpis {
    grid-template-columns: repeat(3, 1fr);
  }

  .dashboard-v4-heading {
    align-items: flex-start;
  }

  .dashboard-v4-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
  }
}

@media (max-width: 850px) {
  .dashboard-v4-heading {
    flex-direction: column;
  }

  .dashboard-v4-actions,
  .dashboard-v4-search {
    width: 100%;
  }

  .dashboard-v4-search input {
    flex: 1;
    width: auto;
  }

  .dashboard-v4-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 520px) {
  .dashboard-v4-kpis {
    grid-template-columns: 1fr;
  }

  .dashboard-v4-search {
    flex-direction: column;
  }

  .dashboard-v4-search input,
  .dashboard-v4-search button,
  .dashboard-v4-actions > a {
    width: 100%;
  }
}
/* DOSSIER INCIDENT V5 COMPACT */
.incident-v5-header{background:linear-gradient(135deg,#07182f,#0b5ed7);color:#fff;border-radius:22px;padding:18px 22px;margin-bottom:10px;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:space-between;gap:18px}
.incident-v5-kicker{display:block;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.8px;color:#9bdcf0;margin-bottom:3px}
.incident-v5-header h1{margin:0;font-size:28px;font-weight:900}
.incident-v5-header p{margin:4px 0 0;color:#dbeafe;font-size:14px}
.incident-v5-header-actions{display:flex;align-items:center;gap:10px}
.incident-v5-status{background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:8px 13px;font-size:12px;font-weight:800}
.incident-v5-meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.incident-v5-meta span{background:#fff;border:1px solid #e8edf4;border-radius:999px;padding:7px 11px;font-size:11px;box-shadow:var(--shadow)}
.incident-v5-progress{padding:15px 18px;border-radius:20px;margin-bottom:14px}
.incident-v5-progress .progress-bar{background:linear-gradient(90deg,#0b5ed7,#00a86b)}
.sla-success,.sla-danger{border-radius:999px;padding:6px 10px;font-size:11px;font-weight:800}.sla-success{background:#e7f8ef;color:#087443}.sla-danger{background:#fff0f0;color:#c92a2a}
.incident-v5-steps{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}
.incident-v5-steps>div{text-align:center;color:#98a2b3}
.incident-v5-steps span{width:26px;height:26px;margin:0 auto 5px;border-radius:50%;background:#eef2f6;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:900}
.incident-v5-steps small{display:block;font-size:9px;line-height:1.15}
.incident-v5-steps .done{color:#087443}.incident-v5-steps .done span{background:#dff7e9;color:#087443}.incident-v5-steps .current span{background:#0b5ed7;color:#fff;box-shadow:0 0 0 4px #e7f1ff}
.incident-v5-card,.incident-v5-side-card{padding:18px;border-radius:20px;margin-bottom:14px}
.incident-v5-section-title{margin-bottom:13px}.incident-v5-section-title h3{margin:0;font-size:18px}
.incident-v5-summary-grid,.incident-v5-treatment-grid,.incident-v5-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.incident-v5-summary-grid>div,.incident-v5-treatment-grid>div,.incident-v5-metrics>div{background:#f8fafc;border:1px solid #eef2f6;border-radius:13px;padding:11px}
.incident-v5-summary-grid small,.incident-v5-treatment-grid small,.incident-v5-metrics small,.incident-v5-description small{display:block;color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.35px;margin-bottom:4px}
.incident-v5-summary-grid strong,.incident-v5-metrics strong{font-size:13px}
.incident-v5-treatment-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.incident-v5-treatment-grid .full{grid-column:1/-1}.incident-v5-treatment-grid p{margin:0;font-size:13px;line-height:1.45}
.incident-v5-description{margin-top:11px;background:#f8fafc;border-radius:13px;padding:12px}.incident-v5-description.secondary{background:#fff8e8}.incident-v5-description p{margin:0;font-size:13px;line-height:1.5}
.incident-v5-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.incident-v5-tabs button{border:0;background:#f1f4f8;color:#667085;border-radius:999px;padding:7px 11px;font-size:11px;font-weight:800}
.incident-v5-tabs button.active{background:#0b5ed7;color:#fff}
.incident-v5-tab-content{display:none}.incident-v5-tab-content.active{display:block}
.incident-v5-note{border:1px solid #eef2f6;border-radius:13px;padding:11px;margin-bottom:8px}.incident-v5-note div{display:flex;justify-content:space-between;gap:12px}.incident-v5-note strong{font-size:12px}.incident-v5-note small{color:var(--muted);font-size:10px}.incident-v5-note p{margin:7px 0 0;font-size:12px}
.incident-v5-file{display:flex;align-items:center;gap:10px;border-bottom:1px solid #eef2f6;padding:9px 0}.incident-v5-file:last-child{border-bottom:0}.incident-v5-file strong,.incident-v5-file small{display:block}.incident-v5-file strong{font-size:12px}.incident-v5-file small{color:var(--muted);font-size:10px}
.incident-v5-side-card textarea{font-size:12px}.incident-v5-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:1000px){.incident-v5-steps{grid-template-columns:repeat(4,1fr)}.incident-v5-summary-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.incident-v5-header{align-items:flex-start;flex-direction:column}.incident-v5-header-actions{width:100%;justify-content:space-between}.incident-v5-steps{grid-template-columns:repeat(2,1fr)}.incident-v5-summary-grid,.incident-v5-treatment-grid,.incident-v5-metrics{grid-template-columns:1fr}.incident-v5-treatment-grid .full{grid-column:auto}}
/* =========================================================
   PIÈCES JOINTES
========================================================= */

.attachment-list {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.attachment-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 14px;
  background: #f8fafc;
  border: 1px solid #e9eef5;
  border-radius: 14px;
}

.attachment-file {
  display: flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
}

.attachment-icon {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  border-radius: 12px;
  background: #eaf2ff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 19px;
}

.attachment-info {
  min-width: 0;
}

.attachment-info strong,
.attachment-info small {
  display: block;
}

.attachment-info strong {
  max-width: 410px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 13px;
}

.attachment-info small {
  margin-top: 3px;
  color: #667085;
  font-size: 10px;
}

.attachment-actions {
  display: flex;
  align-items: center;
  gap: 7px;
  flex-shrink: 0;
}

.attachment-empty {
  min-height: 110px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  color: #667085;
}

.attachment-empty > span {
  font-size: 30px;
}

.attachment-empty strong,
.attachment-empty small {
  display: block;
}

@media (max-width: 680px) {
  .attachment-item {
    align-items: flex-start;
    flex-direction: column;
  }

  .attachment-actions {
    width: 100%;
  }

  .attachment-actions .btn {
    flex: 1;
  }

  .attachment-info strong {
    max-width: 230px;
  }
}
/* Affichage des onglets du dossier incident */

.incident-v5-tab-content {
  display: none;
  width: 100%;
  padding-top: 8px;
}

.incident-v5-tab-content.active {
  display: block !important;
}

.attachment-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}

.attachment-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  width: 100%;
  padding: 12px 14px;
  background: #f8fafc;
  border: 1px solid #e4e9f1;
  border-radius: 14px;
}

.attachment-file {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.attachment-info strong,
.attachment-info small {
  display: block;
}

.attachment-info small {
  color: #667085;
  margin-top: 3px;
}

.attachment-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}
/* Audit 3.1 : contenu lisible et affichage mobile */
textarea.form-control{height:auto;min-height:90px}.incident-v5-steps{grid-template-columns:repeat(8,minmax(0,1fr))}.incident-v5-description p,.incident-v5-note p,.incident-v5-treatment-grid p{white-space:pre-wrap;overflow-wrap:anywhere}.login-box{max-width:95vw}.table-responsive{overflow-x:auto}
@media(max-width:992px){.app-shell{flex-direction:column}.sidebar{position:relative;width:100%;height:auto}.main{width:100%;margin-left:0;padding:16px}.sidebar nav{display:flex;flex-wrap:wrap;gap:6px}.sidebar nav a{padding:8px;margin:0;font-size:12px}.brand{margin-bottom:12px}}
@media(max-width:650px){.incident-v5-steps{grid-template-columns:repeat(2,1fr)}.toast-live{min-width:0;left:12px;right:12px}.topbar-actions{display:flex;flex-wrap:wrap;gap:8px}}