/* ===========================================================
   KOBALT DARK THEME — Full rewrite
   - Palette sombre, contrastes, accessibilité
   - Navbar sticky, dropdowns dark
   - Cards, tables, Grid.js, forms, charts
   =========================================================== */

/* === Palette & tokens === */
:root{
  --k-bg:#ffffff;          /* fond global */
  --k-text:#242424;        /* texte principal */
  --k-emph:#d95462;        /* accent / liens */
  --k-cta:#db5461;         /* boutons primaires */
  --k-muted:#444444;       /* texte secondaire */

  --k-nav:#131a20cc;       /* navbar translucide */
  --k-card:#FAFAFA;        /* fond cartes */
  --k-border:#e8ecf0;      /* bordures */
  --k-input:#12171c;       /* inputs */
  --k-input-border:#2a333b;

  --shadow-sm: 0 6px 18px rgba(0,0,0,.30);
  --shadow-md: 0 14px 30px rgba(0,0,0,.40);
  --shadow-lg: 0 20px 48px rgba(0,0,0,.50);

  --focus-ring: 0 0 0 .2rem rgba(217,84,98,.35);
}

/* === Global === */
html,body{height:100%}
body{
  background:var(--k-bg)!important;
  color:var(--k-text)!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{ color:var(--k-emph); text-decoration:none; }
a:hover{ opacity:.9; }
.muted{ color:var(--k-muted)!important; }
.text-kobalt{ color:var(--k-emph)!important; }

.brand-logo{ height:42px }

/* === Layout spacing pour navbar sticky === */
.kobalt-main{ padding-top: 10px; }

/* === Cards === */
.card-kobalt{
  background:var(--k-card);
  color:var(--k-text);
  border:1px solid var(--k-border);
  border-radius:16px;
  box-shadow:var(--shadow-sm);
}
.card-kobalt .card-header{
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
  border-bottom:1px solid var(--k-border);
}
.card-kobalt:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-lg);
  transition:transform .2s ease, box-shadow .2s ease;
}

/* === Buttons === */
.btn-kobalt{
  background:var(--k-cta);
  color:#fff;
  border:none;
  box-shadow:0 8px 20px rgba(219,84,97,.35);
}
.btn-kobalt:hover{ color:#fff; transform:translateY(-1px); box-shadow:0 12px 26px rgba(219,84,97,.45); }
.btn-logout{ background:transparent;border:1px solid #506070;color:#cfd6da }
.btn-logout:hover{ background:#2a333b;border-color:#2a333b;color:#fff }
.btn-outline-secondary{ border-color:#5a6a76;color:#d8e1e5 }
.btn-outline-secondary:hover{ background:#28323a;border-color:#6f808c;color:#fff }
.btn:focus-visible{ outline:none; box-shadow:var(--focus-ring)!important; }

/* === Forms === */
.form-control,.form-select{
  background:var(--k-input);
  border:1px solid var(--k-input-border);
  color:var(--k-text);
}
.form-control::placeholder{ color:#97a6ad; opacity:.85; }
.form-control:focus,.form-select:focus{
  background:var(--k-input);
  color:var(--k-text);
  border-color:var(--k-emph);
  box-shadow:var(--focus-ring);
}

/* === Navbar / Dropdown === */
.navbar-kobalt{
  background:var(--k-nav);
  backdrop-filter:saturate(140%) blur(6px);
  border-bottom:1px solid rgba(255,255,255,.06);
  box-shadow:0 10px 24px rgba(0,0,0,.38);
}
.navbar-kobalt .nav-link{ color:#e6ecee; }
.navbar-kobalt .nav-link:hover,
.navbar-kobalt .nav-link:focus{ color:#fff; }
.navbar-toggler{ border-color:#39424a; }
.navbar-toggler:focus{ box-shadow:none; }

.navbar-kobalt .dropdown-menu{
  background:#1a222a;
  border:1px solid #2b3540;
  color:var(--k-text);
  box-shadow:var(--shadow-md);
  margin-top:.55rem;
}
.navbar-kobalt .dropdown-item{ color:#dfe6ea; padding:.6rem 1rem; }
.navbar-kobalt .dropdown-item:hover{ background:#232e38; color:#fff; }

/* === Tabs === */
.nav-tabs{ border-bottom:1px solid var(--k-border); }
.nav-tabs .nav-link{
  color:#c6d3d9; border:none; border-bottom:2px solid transparent;
  padding:.6rem 1rem; background:transparent;
}
.nav-tabs .nav-link.active{
  color:#fff; border-bottom-color:var(--k-emph);
}
.sticky-tabs{ position:sticky; top:64px; z-index:1030;
  background:linear-gradient(#1e262d 70%, rgba(30,38,45,0));
  padding:.5rem 0 .25rem;
}

/* === Tables === */
.table{ color:#eaf1f3; }
.table thead{ background:#0f1418; color:#cfe3ea; }
.table-bordered{ border-color:#2b3640; }
.table-hover tbody tr:hover{ background:rgba(255,255,255,.045); }

/* === Grid.js === */
.gridjs-container{ color:var(--k-text); }
.gridjs-wrapper{
  background:var(--k-card)!important;
  border:1px solid var(--k-border)!important;
}
.gridjs-head{ background:#0f1418!important; }
.gridjs-th, .gridjs-td{ border-color:#2b3640!important; }
.gridjs-tr{ border-color:#2b3640!important; }
.gridjs-tr:hover .gridjs-td{ background:rgba(255,255,255,.03); }
.gridjs-input{
  background:var(--k-input)!important; border:1px solid var(--k-input-border)!important; color:var(--k-text)!important;
}
.gridjs-input:focus{ box-shadow:var(--focus-ring)!important; border-color:var(--k-emph)!important; }
.gridjs-pagination .gridjs-pages button{
  background:#0f1418; color:#cfe3ea; border-color:#2b3640;
}
.gridjs-pagination .gridjs-pages .gridjs-currentPage{
  background:var(--k-emph); border-color:transparent; color:#fff;
}

/* === Charts === */
.chart-wrapper{ position:relative; min-height:300px; width:100%; }
.canvas-dark{ background:transparent; }

/* === Stat cards === */
.stat{
  background:linear-gradient(180deg, #151b21, #12171c);
  border:1px solid var(--k-border);
  border-left:6px solid #3a4652;
  border-radius:12px; padding:1rem;
  box-shadow:var(--shadow-sm);
}
.border-left-success{ border-left-color:#198754; }
.border-left-danger{ border-left-color:#dc3545; }
.stat .value{ font-size:1.6rem; font-weight:800; }

/* === Badges status === */
.status-badge{ padding:.25rem .55rem; font-size:.8rem; font-weight:700; border-radius:.5rem; }
.status-200{ background:rgba(25,135,84,.14); color:#46d390; }
.status-3xx{ background:rgba(13,110,253,.18); color:#8fc3ff; }
.status-4xx,.status-5xx,.status-error{ background:rgba(220,53,69,.18); color:#ff9aa6; }

/* === Delta / helpers === */
.delta-up{ color:#46d390; font-weight:700; }
.delta-down{ color:#ff9aa6; font-weight:700; }
.delta-neutral{ color:#9fb0b8; font-weight:600; }
.truncate-url{ max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:inline-block; vertical-align:middle; }

/* === Focus visible (a11y) === */
a:focus-visible, button:focus-visible,
.form-select:focus-visible, .form-control:focus-visible{
  outline:none; box-shadow:var(--focus-ring); border-color:var(--k-emph);
}

/* === Animations === */
.fade-in{ animation:fadeIn .25s ease both; }
@keyframes fadeIn{ from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none} }


.badge-status {
  border-radius: 999px;
  font-weight: 600;
  font-size: 0.8rem;
  padding: 0.25rem 0.75rem;
  display: inline-block;
}

.badge-status-actif {
  background: #28a745;
  color: #fff;
}

.badge-status-standby {
  background: #ffc107;
  color: #1e262d;
}

.badge-status-churn {
  background: #dc3545;
  color: #fff;
}

.badge-status-litige {
  background: #fd7e14;
  color: #fff;
}


/* ============================================================
   BACKLINKS MANAGER — overrides Kobalt dark theme
   Toutes les règles sont scopées sous .kobalt-main pour
   avoir la priorité maximale sans toucher au reste du site.
   ============================================================ */

/* === Zone principale backlinks : texte sombre sur fond clair === */
.kobalt-main .container-fluid h2,
.kobalt-main .container-fluid h3,
.kobalt-main .container-fluid h4,
.kobalt-main .container-fluid h5,
.kobalt-main .container-fluid p,
.kobalt-main .container-fluid span,
.kobalt-main .container-fluid label,
.kobalt-main .container-fluid small,
.kobalt-main .container-fluid div {
  color: inherit;
}

/* Titre principal et sous-titre */
.kobalt-main h2.fw-bold { color: #1a2035 !important; }
.kobalt-main p.text-muted { color: #8a96b0 !important; }

/* Stats header */
#totalLinks, #totalClients { color: #db5461 !important; }
#totalLinks + div, #totalClients + div { color: #8a96b0 !important; }

/* === Nav pills backlinks (fond gris clair, pas noir) === */
.kobalt-main .nav {
  background: #f0f2f5 !important;
  border: none !important;
}
.kobalt-main .nav .nav-link {
  color: #6c757d !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.kobalt-main .nav .nav-link.active {
  background: #ffffff !important;
  color: #db5461 !important;
  box-shadow: 0 1px 6px rgba(0,0,0,.08) !important;
  border: none !important;
}
.kobalt-main .nav .nav-link:hover:not(.active) {
  background: #ffffff !important;
  color: #1a2035 !important;
}

/* === Toolbar === */
.bl-toolbar { background: transparent !important; }

/* Input recherche */
.bl-search-wrap input {
  background-color: #ffffff !important;
  color: #1a2035 !important;
  border: 1px solid #dee2e6 !important;
  box-shadow: none !important;
}
.bl-search-wrap input::placeholder { color: #adb5bd !important; }
.bl-search-wrap input:focus {
  border-color: #db5461 !important;
  box-shadow: 0 0 0 3px rgba(219,84,97,.12) !important;
}
.bl-search-wrap svg { color: #adb5bd !important; }

/* Select clients toolbar */
.bl-toolbar .form-select,
.bl-toolbar select.form-select {
  background-color: #ffffff !important;
  color: #1a2035 !important;
  border: 1px solid #dee2e6 !important;
}
.bl-toolbar .form-select option {
  background-color: #ffffff !important;
  color: #1a2035 !important;
}

/* Bouton analyser */
#analyzeBtn {
  background: rgba(219,84,97,.1) !important;
  color: #db5461 !important;
  border: 1px solid rgba(219,84,97,.3) !important;
}

/* === Tableau principal === */
.bl-table-wrap {
  background: #ffffff !important;
  border: 1px solid #dee2e6 !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.04) !important;
}
.bl-table { color: #1a2035 !important; }
.bl-table thead, .bl-table thead tr { background: #f8f9fa !important; }
.bl-table th { color: #8a96b0 !important; background: #f8f9fa !important; }
.bl-table td { color: #1a2035 !important; border-bottom: 1px solid #f0f2f5 !important; background: transparent !important; }
.bl-table tbody tr { background: #ffffff !important; }
.bl-table tbody tr:hover { background: rgba(219,84,97,.03) !important; }
.bl-table tbody tr:hover td { background: transparent !important; }

/* Badge client */
.bl-badge-client {
  background: rgba(219,84,97,.1) !important;
  color: #db5461 !important;
}
.bl-badge-client:hover { background: rgba(219,84,97,.2) !important; }

/* Texte ancre */
.bl-cell-ancre { color: #1a2035 !important; }

/* Liens dans le tableau */
.bl-cell-link a { color: #3b6ff0 !important; }
.bl-cell-link a:hover { color: #2a5bd0 !important; }

/* Date */
.bl-cell-date { color: #8a96b0 !important; }

/* Bouton supprimer */
.bl-del-btn { color: #c0c8d8 !important; background: none !important; }
.bl-del-btn:hover { color: #e0334c !important; background: rgba(224,51,76,.08) !important; }

/* === Empty state === */
.bl-empty { color: #8a96b0 !important; }

/* === Pagination === */
.bl-pagination-info { color: #8a96b0 !important; }
.bl-page-btn {
  background: #ffffff !important;
  color: #1a2035 !important;
  border: 1px solid #dee2e6 !important;
}
.bl-page-btn:hover { color: #db5461 !important; border-color: #db5461 !important; background: #ffffff !important; }
.bl-page-btn.active { background: rgba(219,84,97,.08) !important; color: #db5461 !important; border-color: #db5461 !important; }
.bl-page-btn:disabled { opacity: .35 !important; }

/* === Modal import === */
.bl-modal-overlay { background: rgba(0,0,0,.55) !important; }
.bl-modal {
  background: #ffffff !important;
  color: #1a2035 !important;
  box-shadow: 0 20px 60px rgba(0,0,0,.18) !important;
}
.bl-modal h5 { color: #1a2035 !important; }
.bl-modal p, .bl-modal .text-muted { color: #8a96b0 !important; }
.bl-drop-zone {
  background: #f8f9fa !important;
  border: 2px dashed #dee2e6 !important;
  color: #1a2035 !important;
}
.bl-drop-zone:hover, .bl-drop-zone.drag-over {
  border-color: #db5461 !important;
  background: rgba(219,84,97,.04) !important;
}
.bl-drop-zone div { color: #1a2035 !important; }
.bl-drop-zone div span, .bl-drop-zone .text-muted { color: #8a96b0 !important; }
.bl-file-selected { color: #17b26a !important; }

/* === Toast === */
.bl-toast {
  background: #ffffff !important;
  color: #1a2035 !important;
  border-color: #dee2e6 !important;
  border-left-color: #17b26a !important;
}
.bl-toast.error { border-left-color: #e0334c !important; }

/* === KPI cards (page analyse) === */
.bl-kpi {
  background: #ffffff !important;
  color: #1a2035 !important;
  border-color: #dee2e6 !important;
}
.bl-kpi-value { color: #db5461 !important; }
.bl-kpi-label { color: #8a96b0 !important; }

/* === Chart barres === */
.bl-chart-wrap { background: #ffffff !important; color: #1a2035 !important; border-color: #dee2e6 !important; }
.bl-bar-val, .bl-bar-label { color: #8a96b0 !important; }

/* === Section titles === */
.bl-section-title { color: #8a96b0 !important; }

/* === Selector client (page analyse) === */
.kobalt-main .form-select {
  background-color: #ffffff !important;
  color: #1a2035 !important;
  border-color: #dee2e6 !important;
}
.kobalt-main .form-select option {
  background-color: #ffffff !important;
  color: #1a2035 !important;
}
.kobalt-main .form-select:focus {
  border-color: #db5461 !important;
  box-shadow: 0 0 0 3px rgba(219,84,97,.12) !important;
}

/* Filtres date (page analyse) */
#filterType, #filterMonth, #filterYear {
  background-color: #ffffff !important;
  color: #1a2035 !important;
  border-color: #dee2e6 !important;
}

/* Badge count ancres */
.bl-badge-count {
  background: #db5461 !important;
  color: #ffffff !important;
}

/* Liens ancres tableau analyse */
.bl-cell-ancre.fw-bold,
.kobalt-main .bl-cell-ancre { color: #1a2035 !important; font-style: italic; }

/* Placeholder page vide */
.kobalt-main .card-kobalt h5 { color: #1a2035 !important; }
.kobalt-main .card-kobalt p.text-muted { color: #8a96b0 !important; }

/* Label filtre */
.kobalt-main label.text-muted { color: #8a96b0 !important; }

/* Bouton copier excel */
.kobalt-main button[onclick*="copyTable"] {
  background: rgba(23,178,106,.1) !important;
  color: #17b26a !important;
  border: 1px solid rgba(23,178,106,.2) !important;
}
#filterCount { color: #8a96b0 !important; }