/* ====== Enlever TOUT soulignement dans le dashboard ====== */
.af-topbar a, .af-topbar a:visited, .af-topbar a:hover,
.af-regie a,  .af-regie a:visited,  .af-regie a:hover,
.af-action,   .af-action:visited,   .af-action:hover {
  text-decoration: none !important;
}

/* ====== Topbar ====== */
.af-topbar{
  height:56px;background:#1f61ff;color:#fff;border-radius:12px;
  display:flex;align-items:center;padding:0 18px;font-weight:600;margin-bottom:18px;
  position:relative;
}
.af-topbar .af-topbar-right{margin-left:auto;opacity:.95}

/* Hamburger (injecté en JS) */
.af-hamburger{
  display:none; /* visible en <=768px */
  width:40px;height:40px;border:0;background:transparent;cursor:pointer;margin-right:8px;
}
.af-hamburger span{display:block;width:22px;height:2px;background:#fff;margin:5px 0;border-radius:2px}

/* ====== Layout ====== */
.af-regie{display:flex;gap:24px}

/* ====== Sidebar ====== */
.af-sidebar{
  width:260px;background:#fff;border:1px solid #e8e8ef;border-radius:12px;padding:16px
}
.af-brand{font-weight:700;font-size:20px;margin-bottom:12px}
.af-sidebar ul{list-style:none;margin:0;padding:0}
.af-sidebar li{display:flex;gap:10px;align-items:center;padding:12px 12px;border-radius:10px}
.af-sidebar li.active,.af-sidebar li:hover{background:#f2f5ff}
.af-ico{width:18px;height:18px;border-radius:4px;background:#e9edff}
.af-sidebar a{color:#1a1a1a}

/* Overlay pour le menu mobile */
.af-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.35);
  opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:998;
}
.af-nav-open .af-overlay{opacity:1;pointer-events:auto}

/* ====== Main ====== */
.af-main{flex:1}
.af-main h1{font-size:40px;margin:0 0 8px}
.af-sub{color:#657089;margin:0 0 24px;font-size:20px}

/* ====== Cards ====== */
.af-cards{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:10px 0 24px
}
.af-card{
  background:#fff;border:1px solid #e8e8ef;border-radius:14px;padding:20px;
  box-shadow:0 2px 6px rgba(0,0,0,.03)
}
.af-card-number{font-size:36px;font-weight:800;margin-bottom:6px}
.af-card-label{color:#657089;font-size:14px}
.af-card-trend{color:#2db46b;font-size:12px;margin-top:8px}

/* ====== Actions ====== */
.af-actions{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px
}
.af-action{
  display:block;text-align:center;padding:26px;border:1px dashed #d6d9e6;border-radius:14px;
  background:#fff;color:#1a1a1a;font-weight:600
}
.af-action:hover{border-style:solid}

/* ====== Table ====== */
.af-scroll{width:100%;overflow-x:auto}
.af-table{
  min-width:640px;width:100%;border-collapse:separate;border-spacing:0;margin-top:10px;
  background:#fff;border:1px solid #e8e8ef;border-radius:12px;overflow:hidden
}
.af-table th,.af-table td{padding:12px 14px;border-bottom:1px solid #f0f1f6;text-align:left;font-size:14px;white-space:nowrap}
.af-table thead th{background:#f7f8fe;font-weight:700}
.af-table tr:last-child td{border-bottom:0}
.af-pagination{margin:16px 0}
.af-pagination .page-numbers{
  display:inline-block;padding:6px 10px;border:1px solid #e0e3ee;border-radius:8px;margin-right:6px;text-decoration:none
}
.af-pagination .current{background:#1f61ff;color:#fff;border-color:#1f61ff}

/* ====== Responsive ====== */
/* <= 1024px : 2 colonnes pour cards & actions, sidebar plus compacte */
@media (max-width: 1024px){
  .af-sidebar{width:220px}
  .af-cards{grid-template-columns:repeat(2,1fr)}
  .af-actions{grid-template-columns:repeat(2,1fr)}
  .af-main h1{font-size:34px}
}

/* <= 768px : hamburger + sidebar en slide-in + tout en 2 colonnes */
@media (max-width: 768px){
  .af-hamburger{display:inline-block}
  .af-regie{flex-direction:column}

  /* Sidebar cachée par défaut et en slide-in */
  .af-sidebar{
    position:fixed;top:0;left:-100%;height:100vh;width:85%;max-width:320px;
    border-radius:0;border-right:1px solid #e8e8ef;z-index:999;overflow:auto;
    transition:left .2s ease;padding:16px;background:#fff;
  }
  .af-nav-open .af-sidebar{left:0}

  .af-cards{grid-template-columns:repeat(2,1fr)}
  .af-actions{grid-template-columns:repeat(2,1fr)}
  .af-main h1{font-size:30px}
}

/* <= 480px : tout en 1 colonne */
@media (max-width: 480px){
  .af-cards{grid-template-columns:1fr}
  .af-actions{grid-template-columns:1fr}
  .af-main h1{font-size:26px}
}