/* ============================================================
   PRO THEME OVERRIDES (load AFTER assets/css/style.css)
   Objectif: look moderne & pro sans casser PHP/JS
   ============================================================ */

/* ============== 1) Design tokens ============== */
:root{
  --bg: #f6f8fc;
  --card: #ffffff;
  --ink: #0f172a;
  --text: #1f2937;
  --muted: #64748b;
  --line: #e5e7eb;

  --brand: #1e6bb8;        /* bleu pro */
  --brand-2: #0e3b64;      /* bleu profond */
  --success: #16a34a;
  --warning: #f59e0b;
  --danger: #ef4444;

  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 18px;

  --shadow-sm: 0 10px 22px rgba(16,24,40,.06);
  --shadow-md: 0 18px 46px rgba(16,24,40,.12);
}

/* ============== 2) Base & typography ============== */
html, body{
  height:100%;
}
body{
  font-family: "Roboto", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  font-size: .92rem;
  color: var(--text);
  background:
    radial-gradient(1200px 520px at 10% -15%, rgba(30,107,184,.10), transparent 55%),
    radial-gradient(900px 420px at 95% 0%, rgba(245,158,11,.08), transparent 55%),
    var(--bg);
}
a{ color: var(--brand); }
a:hover{ color: #155a9b; }

/* ============== 3) Modern visible scrollbar (global) ============== */
*{ scrollbar-width: thin; scrollbar-color: rgba(30,107,184,.55) rgba(15,23,42,.10); }
*::-webkit-scrollbar{ width: 10px; height: 10px; }
*::-webkit-scrollbar-track{ background: rgba(15,23,42,.08); border-radius: 999px; }
*::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, rgba(30,107,184,.55), rgba(14,59,100,.55));
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.60);
}
*::-webkit-scrollbar-thumb:hover{
  background: linear-gradient(180deg, rgba(30,107,184,.80), rgba(14,59,100,.80));
}

/* SlimScroll containers (tu avais une préférence) */
.sidebar-inner.slimscroll,
.msg-list-scroll,
.drop-scroll,
.modal .modal-body{
  overflow:auto !important;
}

/* ============== 4) Layout fixes (header/sidebar/page) ============== */
.header-outer{
  height:70px;
  background: transparent; /* plus clean */
}
.header{
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(229,231,235,.9);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-sm);
  right: 10px;
}
.sidebar{
  background: rgba(255,255,255,.95);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(229,231,235,.9);
  border-radius: var(--r-lg);
  box-shadow: var(--shadow-sm);
}
.sidebar .header-left{
  background: rgba(255,255,255,.95);
  border-bottom: 1px solid rgba(229,231,235,.9);
  border-radius: var(--r-lg) var(--r-lg) 0 0;
}
.page-wrapper{
  padding-left:250px;
}
.page-wrapper > .content{
  padding: 26px 12px 10px 18px;
}

/* ============== 5) Page header (breadcrumb + title) ============== */
.page-header{
  border: 1px solid rgba(229,231,235,.9);
  border-radius: var(--r-lg);
  background: linear-gradient(135deg, var(--brand-2), var(--brand));
  box-shadow: 0 16px 34px rgba(14,59,100,.18);
  color:#fff;
}
.page-header h5{
  font-weight: 900;
  letter-spacing: .2px;
  color:#fff;
}
.page-header .breadcrumb{
  background: transparent !important;
  border-radius: 999px !important;
}
.page-header .breadcrumb-item a{ color: rgba(255,255,255,.92); }
.page-header .breadcrumb-item span{
  color: #fff;
  text-decoration: none;
  font-weight: 700;
}

/* ============== 6) Cards / boxes ============== */
.card,
.card-box,
.profile-widget{
  border-radius: var(--r-lg) !important;
  border: 1px solid rgba(229,231,235,.95) !important;
  box-shadow: var(--shadow-sm) !important;
}
.card-header{
  padding: 16px 18px;
}
.card-title{
  font-weight: 800;
  color: var(--ink);
}

/* ============== 7) Tables ============== */
.table{
  border: 1px solid rgba(229,231,235,.95);
}
.table .thead-light th{
  background: #f1f5f9 !important;
  color: #334155 !important;
  border-color: rgba(229,231,235,.95) !important;
  font-weight: 800;
}
.table-striped>tbody>tr:nth-of-type(2n+1){
  background-color:#f8fafc !important;
}

/* ============== 8) Forms (inputs/select) ============== */
label{
  text-transform: none !important;   /* stop “CAPS everywhere” */
  font-weight: 800;
  color: #334155;
}
.form-control{
  border-radius: var(--r-md) !important;
  border: 1px solid #e2e8f0 !important;
  height: 46px;
  padding: .72rem .92rem;
  box-shadow: none !important;
}
.form-control:focus{
  border-color: rgba(30,107,184,.35) !important;
  box-shadow: 0 0 0 .22rem rgba(30,107,184,.12) !important;
}
textarea.form-control{ height:auto; }

.select2-container .select2-selection--single{
  border-radius: var(--r-md) !important;
  border: 1px solid #e2e8f0 !important;
  height: 46px !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
  line-height: 44px !important;
  padding-left: 14px !important;
  color: #334155 !important;
}
.select2-container--default .select2-results__option--highlighted[aria-selected]{
  background-color: rgba(30,107,184,.12) !important;
  color: var(--ink) !important;
}

/* ============== 9) Buttons (neutral + brand) ============== */
.btn{
  border-radius: var(--r-md) !important;
  font-weight: 800 !important;
  box-shadow: none !important;
}
.btn-primary,
.bg-primary,
.badge-primary{
  background-color: var(--brand) !important;
  border-color: var(--brand) !important;
}
.btn-primary:hover,
.btn-primary:focus{
  background-color: #155a9b !important;
  border-color: #155a9b !important;
}
.btn-danger{
  background: var(--danger) !important;
  border-color: var(--danger) !important;
}
.btn-success{
  background: var(--success) !important;
  border-color: var(--success) !important;
}
.btn-warning{
  background: var(--warning) !important;
  border-color: var(--warning) !important;
}

/* Tu avais un gradient “btn-search” très flashy, on le rend plus pro */
.btn-search{
  color:#fff !important;
  background: linear-gradient(135deg, var(--brand-2) 0%, var(--brand) 100%) !important;
  border: 1px solid transparent !important;
}
.btn-search:hover,
.btn-search:focus{
  background: linear-gradient(135deg, var(--brand) 0%, var(--brand-2) 100%) !important;
}

/* ============== 10) Sidebar menu ============== */
.sidebar-menu li a{
  text-transform:none !important;           /* stop all caps */
  font-weight: 700;
  border-top: 1px solid rgba(229,231,235,.75);
}
.sidebar-menu li a:hover{
  color: var(--brand) !important;
}
.sidebar-menu li.active a,
.sidebar-menu li.submenu a.active.subdrop{
  color:#fff !important;
  background: linear-gradient(135deg, var(--brand-2) 0%, var(--brand) 100%) !important;
  border-radius: var(--r-md) !important;
}

/* ============== 11) Modals (pro look) ============== */
.modal-content{
  border-radius: var(--r-lg) !important;
  border: 1px solid rgba(229,231,235,.95) !important;
  box-shadow: var(--shadow-md) !important;
}
.modal-header{
  border-bottom: 0 !important;
  background: linear-gradient(135deg, var(--brand-2), var(--brand)) !important;
  color:#fff !important;
}
.modal-header .close{
  color:#fff !important;
  opacity: 1 !important;
}
.modal-footer{
  background: #f8fafc !important;
  border-top: 1px solid rgba(229,231,235,.9) !important;
}

/* ============== 12) Badges (less neon) ============== */
.badge-success-border{ border-color: var(--success) !important; color: var(--success) !important; }
.badge-danger-border{ border-color: var(--danger) !important; color: var(--danger) !important; }
.badge-warning-border{ border-color: var(--warning) !important; color: var(--warning) !important; }

/* ============== 13) Small cleanups ============== */
.page-title{
  color:#fff !important;
  border-left: 0 !important; /* ton ancien gradient-left n’est pas pro */
  padding-left: 0 !important;
}
.dropdown-menu{
  border-radius: var(--r-md) !important;
  border: 1px solid rgba(229,231,235,.95) !important;
  box-shadow: var(--shadow-sm) !important;
}
