/* =====================================================
   SLBCloud - Thème Custom WHMCS
   Design: Dark Pro / Premium
   ===================================================== */

/* --- Variables & Google Fonts --- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  --slb-bg: #0d1117;
  --slb-surface: #161b22;
  --slb-surface2: #1c2333;
  --slb-border: rgba(99, 140, 255, 0.15);
  --slb-primary: #3b82f6;
  --slb-primary-h: #2563eb;
  --slb-accent: #06b6d4;
  --slb-text: #e6edf3;
  --slb-muted: #8b949e;
  --slb-success: #238636;
  --slb-warning: #9e6a03;
  --slb-danger: #b91c1c;
  --slb-radius: 12px;
  --slb-radius-sm: 8px;
  --slb-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
  --slb-shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.4);
  --slb-glass-bg: rgba(22, 27, 34, 0.65);
  --slb-blur: 10px;
  --slb-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --slb-accent-glow: rgba(6, 182, 212, 0.15);
}

/* --- Base --- */
html,
body {
  background-color: var(--slb-bg) !important;
  color: var(--slb-text) !important;
  font-family: 'Inter', sans-serif !important;
  font-feature-settings: "cv02", "cv03", "cv04", "cv11";
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
}

/* --- Interactive Elements & Transitions --- */
a,
button,
.btn,
.nav-link,
.card,
.tile {
  transition: var(--slb-transition) !important;
}

/* --- Glassmorphism & Premium Cards --- */
.card,
.list-group-item,
.sidebar .list-group-item {
  background-color: var(--slb-glass-bg) !important;
  backdrop-filter: blur(var(--slb-blur));
  -webkit-backdrop-filter: blur(var(--slb-blur));
  border: 1px solid var(--slb-border) !important;
  border-radius: var(--slb-radius) !important;
  box-shadow: var(--slb-shadow-sm);
}

.card:hover {
  transform: translateY(-4px);
  box-shadow: var(--slb-shadow);
  border-color: rgba(6, 182, 212, 0.4) !important;
}

.card-header {
  background-color: rgba(255, 255, 255, 0.03) !important;
  border-bottom: 1px solid var(--slb-border) !important;
  font-weight: 600;
  letter-spacing: 0.02em;
}

/* --- Navigation & Header --- */
.header {
  background-color: var(--slb-bg);
  border-bottom: 1px solid var(--slb-border);
}

.navbar-light {
  background-color: var(--slb-glass-bg) !important;
  backdrop-filter: blur(var(--slb-blur));
  -webkit-backdrop-filter: blur(var(--slb-blur));
}

.main-navbar-wrapper {
  background-color: var(--slb-surface2) !important;
  border-bottom: 1px solid var(--slb-border);
}

/* --- Navbar / Header --- */
.navbar-header {
  background: var(--slb-surface) !important;
  border-bottom: 1px solid var(--slb-border) !important;
  box-shadow: var(--slb-shadow-sm) !important;
  padding: 0 !important;
}

.navbar-header .navbar-brand img {
  filter: brightness(1.1);
}

.navbar-header .navbar-nav>li>a,
.navbar-header .navbar-nav>li>.nav-link,
.navbar-header ul.nav li a {
  color: var(--slb-text) !important;
  font-weight: 500 !important;
  font-size: 0.875rem !important;
  letter-spacing: 0.01em;
  transition: color 0.2s ease, background 0.2s ease !important;
  border-radius: var(--slb-radius-sm) !important;
}

.navbar-header .navbar-nav>li>a:hover,
.navbar-header ul.nav li a:hover {
  color: var(--slb-primary) !important;
  background: rgba(59, 130, 246, 0.08) !important;
  text-decoration: none !important;
}

.navbar-header .dropdown-menu {
  background: var(--slb-surface2) !important;
  border: 1px solid var(--slb-border) !important;
  border-radius: var(--slb-radius) !important;
  box-shadow: var(--slb-shadow) !important;
  margin-top: 4px !important;
}

.navbar-header .dropdown-menu li a,
.navbar-header .dropdown-menu .dropdown-item {
  color: var(--slb-text) !important;
  padding: 8px 18px !important;
  font-size: 0.85rem !important;
  border-radius: 0 !important;
  transition: background 0.15s, color 0.15s !important;
}

.navbar-header .dropdown-menu li a:hover,
.navbar-header .dropdown-menu .dropdown-item:hover {
  background: rgba(59, 130, 246, 0.12) !important;
  color: var(--slb-primary) !important;
}

.navbar-header .dropdown-divider {
  border-color: var(--slb-border) !important;
}

/* Badge panier */
.navbar-header .badge {
  background: var(--slb-primary) !important;
  color: #fff !important;
}

/* --- Breadcrumb --- */
.breadcrumb-bar,
.client-navigation {
  background: var(--slb-surface) !important;
  border-bottom: 1px solid var(--slb-border) !important;
  padding: 8px 0 !important;
}

.breadcrumb {
  background: transparent !important;
  margin: 0 !important;
  padding: 4px 0 !important;
}

.breadcrumb-item a {
  color: var(--slb-accent) !important;
  font-size: 0.82rem !important;
}

.breadcrumb-item.active {
  color: var(--slb-muted) !important;
  font-size: 0.82rem !important;
}

.breadcrumb-item+.breadcrumb-item::before {
  color: var(--slb-muted) !important;
}

/* --- Main Content Area --- */
.container-body,
#main-body,
.content-panel {
  background: var(--slb-bg) !important;
}

/* --- Cards --- */
.card {
  background: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
  border-radius: var(--slb-radius) !important;
  box-shadow: var(--slb-shadow-sm) !important;
  color: var(--slb-text) !important;
  transition: box-shadow 0.2s ease, transform 0.2s ease !important;
}

.card:hover {
  box-shadow: 0 6px 30px rgba(59, 130, 246, 0.1) !important;
}

.card-header {
  background: var(--slb-surface2) !important;
  border-bottom: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
  font-weight: 600 !important;
  border-radius: var(--slb-radius) var(--slb-radius) 0 0 !important;
  padding: 14px 20px !important;
}

.card-body {
  padding: 20px !important;
}

.card-footer {
  background: var(--slb-surface2) !important;
  border-top: 1px solid var(--slb-border) !important;
  border-radius: 0 0 var(--slb-radius) var(--slb-radius) !important;
}

/* --- Panels (WHMCS style) --- */
.panel {
  background: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
  border-radius: var(--slb-radius) !important;
  box-shadow: var(--slb-shadow-sm) !important;
}

.panel-heading,
.panel-default>.panel-heading {
  background: var(--slb-surface2) !important;
  border-bottom: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
  border-radius: var(--slb-radius) var(--slb-radius) 0 0 !important;
}

.panel-body {
  background: var(--slb-surface) !important;
  color: var(--slb-text) !important;
}

/* --- Sidebar --- */
.sidebar .list-group-item,
.sidebar-nav .nav-item a,
.side-nav li a {
  background: var(--slb-surface) !important;
  color: var(--slb-text) !important;
  border: none !important;
  border-bottom: 1px solid var(--slb-border) !important;
  padding: 10px 16px !important;
  font-size: 0.875rem !important;
  transition: all 0.15s ease !important;
}

.sidebar .list-group-item:hover,
.sidebar-nav .nav-item a:hover,
.side-nav li a:hover {
  background: rgba(59, 130, 246, 0.1) !important;
  color: var(--slb-primary) !important;
  padding-left: 22px !important;
}

.sidebar .list-group-item.active,
.side-nav li.active a,
.sidebar .list-group-item.active:hover {
  background: var(--slb-primary) !important;
  color: #fff !important;
  border-color: var(--slb-primary) !important;
}

/* --- Buttons --- */
.btn-primary,
.btn-success.btn-primary {
  background: linear-gradient(135deg, var(--slb-primary), var(--slb-accent)) !important;
  border: none !important;
  border-radius: var(--slb-radius-sm) !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 2px 12px rgba(59, 130, 246, 0.35) !important;
  padding: 8px 20px !important;
  color: #fff !important;
}

.btn-primary:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 20px rgba(59, 130, 246, 0.5) !important;
  background: linear-gradient(135deg, var(--slb-primary-h), #0891b2) !important;
}

.btn-default {
  background: var(--slb-surface2) !important;
  border: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
  border-radius: var(--slb-radius-sm) !important;
  font-weight: 500 !important;
  transition: all 0.2s ease !important;
}

.btn-default:hover {
  background: var(--slb-surface) !important;
  border-color: var(--slb-primary) !important;
  color: var(--slb-primary) !important;
}

.btn-danger {
  background: var(--slb-danger) !important;
  border: none !important;
  border-radius: var(--slb-radius-sm) !important;
  color: #fff !important;
}

.btn-success {
  background: var(--slb-success) !important;
  border: none !important;
  border-radius: var(--slb-radius-sm) !important;
  color: #fff !important;
}

.btn-sm {
  padding: 5px 12px !important;
  font-size: 0.8rem !important;
}

/* --- Tables --- */
.table {
  color: var(--slb-text) !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
}

.table th {
  background: var(--slb-surface2) !important;
  color: var(--slb-muted) !important;
  font-weight: 600 !important;
  font-size: 0.75rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.07em !important;
  border-bottom: 1px solid var(--slb-border) !important;
  border-top: none !important;
  padding: 12px 16px !important;
}

.table td {
  border-top: 1px solid var(--slb-border) !important;
  padding: 12px 16px !important;
  vertical-align: middle !important;
  color: var(--slb-text) !important;
}

.table-striped tbody tr:nth-of-type(odd) {
  background: rgba(255, 255, 255, 0.02) !important;
}

.table-hover tbody tr:hover,
.table-hover tbody tr:hover>td,
.table-hover tbody tr:hover>th {
  background-color: rgba(59, 130, 246, 0.15) !important;
  color: #fff !important;
}

.table-hover tbody tr:hover a:not(.btn) {
  color: var(--slb-accent) !important;
}

.table-bordered {
  border: 1px solid var(--slb-border) !important;
}

.table-bordered th,
.table-bordered td {
  border: 1px solid var(--slb-border) !important;
}

/* --- Forms --- */
.form-control {
  background: var(--slb-surface2) !important;
  border: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
  border-radius: var(--slb-radius-sm) !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
  padding: 8px 14px !important;
}

.form-control:focus {
  background: var(--slb-surface2) !important;
  border-color: var(--slb-primary) !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15) !important;
  color: var(--slb-text) !important;
  outline: none !important;
}

.form-control::placeholder {
  color: var(--slb-muted) !important;
}

.form-group label {
  color: var(--slb-muted) !important;
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  margin-bottom: 6px !important;
  letter-spacing: 0.01em;
}

select.form-control option {
  background: var(--slb-surface2) !important;
}

/* --- Alerts --- */
.alert {
  border-radius: var(--slb-radius) !important;
  border: none !important;
  border-left: 4px solid !important;
  font-size: 0.875rem !important;
}

.alert-success {
  background: rgba(35, 134, 54, 0.12) !important;
  border-left-color: #3fb950 !important;
  color: #3fb950 !important;
}

.alert-danger,
.alert-error {
  background: rgba(185, 28, 28, 0.12) !important;
  border-left-color: #f85149 !important;
  color: #f85149 !important;
}

.alert-warning {
  background: rgba(158, 106, 3, 0.12) !important;
  border-left-color: #e3b341 !important;
  color: #e3b341 !important;
}

.alert-info {
  background: rgba(6, 182, 212, 0.1) !important;
  border-left-color: var(--slb-accent) !important;
  color: var(--slb-accent) !important;
}

/* --- Badges / Labels Status --- */
.label-success,
.status-active,
span.label-success {
  background: linear-gradient(90deg, #166534, #166534) !important;
  color: #4ade80 !important;
  border: 1px solid rgba(74, 222, 128, 0.3) !important;
  border-radius: 20px !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  padding: 3px 10px !important;
  letter-spacing: 0.03em;
}

.label-danger,
.status-suspended,
span.label-danger {
  background: rgba(185, 28, 28, 0.15) !important;
  color: #f87171 !important;
  border: 1px solid rgba(248, 113, 113, 0.3) !important;
  border-radius: 20px !important;
  font-size: 0.72rem !important;
  padding: 3px 10px !important;
}

.label-warning,
.status-pending,
span.label-warning {
  background: rgba(158, 106, 3, 0.15) !important;
  color: #fbbf24 !important;
  border: 1px solid rgba(251, 191, 36, 0.3) !important;
  border-radius: 20px !important;
  font-size: 0.72rem !important;
  padding: 3px 10px !important;
}

/* --- Tabs --- */
.nav-tabs {
  border-bottom: 1px solid var(--slb-border) !important;
}

.nav-tabs .nav-link,
.nav-tabs .nav-item .nav-link {
  color: var(--slb-muted) !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  font-weight: 500 !important;
  padding: 10px 18px !important;
  transition: all 0.2s !important;
  font-size: 0.875rem !important;
}

.nav-tabs .nav-link:hover {
  color: var(--slb-text) !important;
  border-bottom-color: var(--slb-primary) !important;
  background: transparent !important;
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.active .nav-link {
  color: var(--slb-primary) !important;
  border-bottom: 2px solid var(--slb-primary) !important;
  background: transparent !important;
  font-weight: 600 !important;
}

.tab-content {
  background: var(--slb-surface) !important;
  color: var(--slb-text) !important;
}

/* --- Product status icons --- */
.product-status-active .fa-circle {
  color: #166534 !important;
}

.product-icon .fa-stack {
  filter: drop-shadow(0 0 8px rgba(59, 130, 246, 0.4));
}

/* --- Titles / Headings --- */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  color: var(--slb-text) !important;
  font-weight: 600 !important;
}

/* --- Links --- */
a {
  color: var(--slb-accent) !important;
  transition: color 0.2s !important;
}

a:hover {
  color: var(--slb-primary) !important;
  text-decoration: none !important;
}

/* --- List groups --- */
.list-group-item {
  background: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
}

/* --- Modal --- */
.modal-content {
  background: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
  border-radius: var(--slb-radius) !important;
  box-shadow: var(--slb-shadow) !important;
  color: var(--slb-text) !important;
}

.modal-header {
  background: var(--slb-surface2) !important;
  border-bottom: 1px solid var(--slb-border) !important;
  border-radius: var(--slb-radius) var(--slb-radius) 0 0 !important;
}

.modal-title {
  color: var(--slb-text) !important;
  font-weight: 600 !important;
}

.modal-footer {
  background: var(--slb-surface2) !important;
  border-top: 1px solid var(--slb-border) !important;
}

.close {
  color: var(--slb-muted) !important;
  text-shadow: none !important;
  opacity: 0.7;
}

.close:hover {
  color: var(--slb-text) !important;
  opacity: 1;
}

/* --- Pagination --- */
.pagination .page-item .page-link,
.pagination>li>a {
  background: var(--slb-surface2) !important;
  border: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
  border-radius: var(--slb-radius-sm) !important;
  margin: 0 2px !important;
  transition: all 0.15s !important;
}

.pagination>li>a:hover,
.pagination .page-item .page-link:hover {
  background: var(--slb-primary) !important;
  border-color: var(--slb-primary) !important;
  color: #fff !important;
}

.pagination>li.active>a,
.pagination .page-item.active .page-link {
  background: var(--slb-primary) !important;
  border-color: var(--slb-primary) !important;
  color: #fff !important;
  font-weight: 600 !important;
}

/* --- Footer --- */
footer,
.footer {
  background: var(--slb-surface) !important;
  border-top: 1px solid var(--slb-border) !important;
  color: var(--slb-muted) !important;
  font-size: 0.82rem !important;
}

footer a {
  color: var(--slb-muted) !important;
}

footer a:hover {
  color: var(--slb-primary) !important;
}

/* --- Input group --- */
.input-group-text {
  background: var(--slb-surface2) !important;
  border: 1px solid var(--slb-border) !important;
  color: var(--slb-muted) !important;
}

/* --- Well / Info boxes --- */
.well {
  background: var(--slb-surface2) !important;
  border: 1px solid var(--slb-border) !important;
  border-radius: var(--slb-radius) !important;
  box-shadow: none !important;
  color: var(--slb-text) !important;
}

/* --- Dropdown general --- */
.dropdown-menu {
  background: var(--slb-surface2) !important;
  border: 1px solid var(--slb-border) !important;
  border-radius: var(--slb-radius) !important;
  box-shadow: var(--slb-shadow) !important;
}

.dropdown-item {
  color: var(--slb-text) !important;
  transition: background 0.15s, color 0.15s !important;
}

.dropdown-item:hover {
  background: rgba(59, 130, 246, 0.1) !important;
  color: var(--slb-primary) !important;
}

.dropdown-divider {
  border-color: var(--slb-border) !important;
}

/* --- Custom: Active services item on homepage --- */
.service-status-icon .fa-stack-2x {
  color: var(--slb-surface2) !important;
}

/* --- Scrollbar custom --- */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: var(--slb-bg);
}

::-webkit-scrollbar-thumb {
  background: rgba(99, 140, 255, 0.3);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--slb-primary);
}

/* --- Misc text --- */
.text-muted {
  color: var(--slb-muted) !important;
}

small,
.small {
  color: var(--slb-muted) !important;
}

hr {
  border-color: var(--slb-border) !important;
}

/* --- Product details page specific --- */
.product-details-tab-container {
  border: 1px solid var(--slb-border) !important;
  border-top: none !important;
  border-radius: 0 0 var(--slb-radius) var(--slb-radius) !important;
}

.responsive-tabs-sm-connector .channel {
  background: var(--slb-border) !important;
}

/* --- Checklist / Feature rows --- */
.row.product-actions-wrapper .btn {
  margin-bottom: 8px !important;
}

/* --- Highlighted glow on primary action --- */
.btn-primary {
  position: relative;
  overflow: hidden;
}

.btn-primary::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(45deg, transparent 40%, rgba(255, 255, 255, 0.1) 50%, transparent 60%);
  opacity: 0;
  transition: opacity 0.3s;
}

.btn-primary:hover::after {
  opacity: 1;
}

/* --- Smooth page transitions --- */
.tab-pane {
  animation: fadeIn 0.2s ease-in;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(4px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* --- Responsive Tabs look --- */
.responsive-tabs-sm .nav-link {
  font-size: 0.82rem !important;
}

/* =====================================================
   CORRECTIONS - Éléments restés blancs
   ===================================================== */

/* --- Body background --- */
body.primary-bg-color {
  background-color: var(--slb-bg) !important;
  color: var(--slb-text) !important;
}

/* --- Header principal (fond blanc → dark) --- */
header.header {
  background-color: var(--slb-surface) !important;
  border-bottom: 1px solid var(--slb-border) !important;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.4) !important;
}

/* Barre logo + recherche */
header.header .navbar,
header.header .navbar.navbar-light,
div.navbar.navbar-light {
  background-color: var(--slb-surface) !important;
  border-bottom: 1px solid var(--slb-border) !important;
}

/* Texte et liens de la navbar header */
header.header .navbar a,
header.header .navbar-nav a,
header.header .navbar-nav .nav-link {
  color: var(--slb-text) !important;
}

header.header .navbar-nav .nav-link:hover {
  color: var(--slb-primary) !important;
}

/* Barre de navigation principale */
header.header .main-navbar-wrapper {
  background-color: var(--slb-surface2) !important;
  border-top: 1px solid var(--slb-border) !important;
}

/* Topbar (barre tout en haut si connecté) */
header.header .topbar {
  background-color: #090d12 !important;
  border-bottom: 1px solid var(--slb-border) !important;
}

/* Barre de recherche dans le header */
header.header .search {
  background: var(--slb-surface2) !important;
  border: 1px solid var(--slb-border) !important;
  border-radius: var(--slb-radius-sm) !important;
}

header.header .search .btn,
header.header .search .form-control {
  background: transparent !important;
  color: var(--slb-text) !important;
  border: 0 !important;
}

header.header .search .btn {
  color: var(--slb-muted) !important;
}

header.header .search:focus-within {
  border-color: var(--slb-primary) !important;
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.15) !important;
}

/* Bouton panier (toolbar) */
header.header .toolbar .nav-link {
  border-color: var(--slb-border) !important;
  color: var(--slb-text) !important;
  background: var(--slb-surface2) !important;
}

header.header .toolbar .nav-link:hover {
  color: var(--slb-primary) !important;
  border-color: var(--slb-primary) !important;
}

/* Dropdown items actifs dans header */
header.header .dropdown-item.active,
header.header .dropdown-item:active {
  background-color: rgba(59, 130, 246, 0.12) !important;
  color: var(--slb-primary) !important;
}

/* --- Breadcrumb --- */
.master-breadcrumb {
  background-color: var(--slb-surface2) !important;
  border-bottom: 1px solid var(--slb-border) !important;
}

.master-breadcrumb .breadcrumb {
  background: transparent !important;
}

/* --- Main body section --- */
#main-body,
section#main-body {
  background-color: var(--slb-bg) !important;
  min-height: calc(100vh - 200px);
}

/* --- Store: product cards blancs --- */
.store-order-container {
  color: var(--slb-text) !important;
}

.store-order-container .card,
.store-order-container .panel {
  background: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
}

/* bg-white overrides utilisées dans la boutique */
.bg-white,
.tab-content.bg-white,
.store-domain-tab-content {
  background-color: var(--slb-surface2) !important;
  color: var(--slb-text) !important;
}

/* Tabs boutique */
.store-order-container .store-domain-tabs li a,
.store-domain-tabs .nav-link {
  color: var(--slb-muted) !important;
  background: transparent !important;
}

.store-order-container .store-domain-tabs li.active a,
.store-domain-tabs .nav-link.active {
  color: var(--slb-primary) !important;
  border-color: var(--slb-primary) !important;
}

/* --- Store: product listing (socialbee / order page) --- */
.product-list,
.package-list,
.socialbee-products {
  color: var(--slb-text) !important;
}

/* Chaque card produit dans la boutique */
.product-list .card,
div[class*="product"] .card,
div[class*="package"] .card {
  background: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
}

/* Descriptions produit (texte en blanc sur fond blanc) */
.product-list li,
.feature-list li,
.product-description,
.package-features li,
ul.features li {
  color: var(--slb-text) !important;
}

/* Prix dans la boutique */
.price,
.price-block,
.pricing,
.payment-term h4,
.store-order-container .payment-term h4 {
  color: var(--slb-text) !important;
}

/* Sélecteur billing cycle */
.store-order-container .payment-term select,
.custom-select {
  background-color: var(--slb-surface2) !important;
  color: var(--slb-text) !important;
  border-color: var(--slb-border) !important;
}

/* --- Product card accent colors --- */
.card-accent-blue,
.card-accent-green,
.card-accent-gold,
.card-accent-red {
  background-color: var(--slb-surface) !important;
  color: var(--slb-text) !important;
}

/* --- active-products-services-item --- */
.active-products-services-item {
  background: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
}

/* --- Sidebar panels --- */
.sidebar .panel,
.sidebar .list-group,
.sidebar .widget {
  background: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
}

.sidebar .panel-heading,
.sidebar h4,
.sidebar .widget-title {
  color: var(--slb-text) !important;
}

/* --- Client info sidebar --- */
.sidebar .client-info,
.sidebar address,
.sidebar p {
  color: var(--slb-text) !important;
}

/* --- Summary boxes (stats on homepage) --- */
.summary-block,
.stat-block,
.client-summary {
  background: var(--slb-surface2) !important;
  color: var(--slb-text) !important;
  border: 1px solid var(--slb-border) !important;
  border-radius: var(--slb-radius) !important;
}

/* Overflow: s'assurer que tous les p, span, small sont lisibles */
p,
span,
small,
li,
td,
th,
label,
div {
  color: inherit;
}

/* Fix: texte qui reste blanc sur fond blanc dans certains contextes */
.primary-content * {
  color: var(--slb-text);
}

/* Exceptions pour les liens et boutons colorés */
.primary-content a {
  color: var(--slb-accent) !important;
}

.primary-content a:hover {
  color: var(--slb-primary) !important;
}

.primary-content .btn-primary,
.primary-content .btn-primary *,
.primary-content .btn-success,
.primary-content .btn-success *,
.primary-content .btn-danger,
.primary-content .btn-danger * {
  color: #fff !important;
}

.primary-content .label-success,
.primary-content .label-danger,
.primary-content .label-warning {
  color: inherit !important;
}

/* =====================================================
   CORRECTION 2 - Boutique: cards produits fond blanc
   ===================================================== */

/* Cards produits dans la boutique catalogue (cart.php?gid=X) */
.store-promoted-product {
  color: var(--slb-text) !important;
}

.store-promoted-product .card,
.store-promoted-product>div {
  background: var(--slb-surface) !important;
  color: var(--slb-text) !important;
}

.store-promoted-product ul.features li {
  color: var(--slb-text) !important;
}

/* Promo containers */
.promo-container {
  background-color: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
}

.promo-container .header {
  background: var(--slb-surface2) !important;
  color: var(--slb-text) !important;
}

.promo-banner {
  background-color: var(--slb-surface) !important;
  color: var(--slb-text) !important;
  border: 1px solid var(--slb-border) !important;
}

/* Cards génériques non couvertes dans le contenu principal */
.card,
.card-body,
.card-default {
  background-color: var(--slb-surface) !important;
  color: var(--slb-text) !important;
}

/* Forcer le texte dans TOUTES les cards à être lisible */
.card h1,
.card h2,
.card h3,
.card h4,
.card h5,
.card h6,
.card p,
.card li,
.card span,
.card small,
.card label,
.card td,
.card th,
.card div {
  color: var(--slb-text) !important;
}

/* Exceptions: badges et boutons colorés dans les cards */
.card .btn-primary,
.card .btn-primary *,
.card .btn-success,
.card .btn-success *,
.card .btn-danger,
.card .btn-danger *,
.card .btn-warning,
.card .btn-warning * {
  color: #fff !important;
}

.card .label-success,
.card .badge-success,
.card .label-info,
.card .badge-info {
  color: #fff !important;
}

.card a {
  color: var(--slb-accent) !important;
}

.card a:hover {
  color: var(--slb-primary) !important;
}

/* Correction spécifique: text-muted dans les cards */
.card .text-muted {
  color: var(--slb-muted) !important;
}

/* Correction: description des produits (p dans les cards de la boutique) */
.store-order-container h2,
.store-order-container h3,
.store-order-container h4,
.store-order-container p,
.store-order-container li,
.store-order-container label,
.store-order-container span {
  color: var(--slb-text) !important;
}

/* markdown content dans les descriptions */
.markdown-content,
.markdown-content p,
.markdown-content li,
.markdown-content h1,
.markdown-content h2,
.markdown-content h3,
.markdown-content h4 {
  color: var(--slb-text) !important;
}

.markdown-content h1,
.markdown-content h2,
.markdown-content h3,
.markdown-content h4 {
  color: var(--slb-text) !important;
  border-color: var(--slb-border) !important;
}

/* md-preview in dark */
.md-editor>.btn-toolbar {
  background-color: var(--slb-surface2) !important;
  border-color: var(--slb-border) !important;
}

.md-editor>textarea.markdown-editor,
.md-editor>.md-preview {
  background-color: var(--slb-surface) !important;
  color: var(--slb-text) !important;
  border-color: var(--slb-border) !important;
}

/* =====================================================
   CORRECTION FINALE - Spécificité maximale pour les cards
   ===================================================== */

/* Override Bootstrap card white backgrounds avec spécificité maximale */
body .card,
body .card-body,
body .card-header,
body .card-footer,
body.primary-bg-color .card,
body.primary-bg-color .card-body {
  background-color: var(--slb-surface) !important;
  color: var(--slb-text) !important;
  border-color: var(--slb-border) !important;
}

/* Texte dans les cards — sélecteurs haute spécificité */
body .card h1,
body .card h2,
body .card h3,
body .card h4,
body .card h5,
body .card h6,
body .card p,
body .card li,
body .card span,
body .card small,
body .card label,
body .card div,
body .card td,
body .card th,
body .card .card-title,
body .card .card-text,
body .card .pricing-card-title {
  color: var(--slb-text) !important;
}

/* Boutons et links dans cards — ne pas écraser */
body .card a {
  color: var(--slb-accent) !important;
}

body .card a:hover {
  color: var(--slb-primary) !important;
}

body .card .btn-primary,
body .card .btn-primary * {
  color: #fff !important;
}

body .card .btn-success,
body .card .btn-success * {
  color: #fff !important;
}

body .card .btn-block {
  color: #fff !important;
}

body .card .btn-outline-primary {
  color: var(--slb-primary) !important;
  border-color: var(--slb-primary) !important;
}

body .card .btn-outline-primary:hover {
  color: #fff !important;
  background: var(--slb-primary) !important;
}

/* text-muted dans cards */
body .card .text-muted {
  color: var(--slb-muted) !important;
}

/* --- Boutique: la page cart.php de listing produits par catégorie --- */
/* Le HTML génère des .card.mb-3 avec .card-body.p-lg-4 */
body .card.mb-3 {
  background-color: var(--slb-surface) !important;
}

body .card.mb-3 .card-body {
  background-color: var(--slb-surface) !important;
  color: var(--slb-text) !important;
}

body .card.mb-3 .card-title {
  color: var(--slb-text) !important;
}

body .card.mb-3 p {
  color: var(--slb-text) !important;
}


/* =====================================================
   CORRECTION 3 - Standard Cart Order Form
   ===================================================== */

#order-standard_cart,
#order-standard_cart .cart-body,
#order-standard_cart .products {
  background-color: var(--slb-bg) !important;
  color: var(--slb-text) !important;
}

#order-standard_cart .products .product {
  background-color: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
}

#order-standard_cart .products .product header {
  background-color: var(--slb-surface2) !important;
  border-bottom: 1px solid var(--slb-border) !important;
}

#order-standard_cart .products .product header span {
  color: var(--slb-text) !important;
}

#order-standard_cart .products .product .product-desc,
#order-standard_cart .products .product .product-pricing,
#order-standard_cart .products .product footer {
  color: var(--slb-text) !important;
}

#order-standard_cart .products .product .price {
  color: var(--slb-accent) !important;
}

#order-standard_cart .products .product ul li {
  color: var(--slb-text) !important;
}

#order-standard_cart .products .product ul li .feature-value {
  color: #fff !important;
}

#order-standard_cart .products .product footer .btn-success {
  background: var(--slb-success) !important;
  border: none !important;
}

/* Sidebar in cart */
#order-standard_cart .cart-sidebar .list-group-item {
  background-color: var(--slb-surface) !important;
  color: var(--slb-text) !important;
  border-color: var(--slb-border) !important;
}

#order-standard_cart .cart-sidebar .list-group-item.active {
  background-color: var(--slb-primary) !important;
  color: #fff !important;
}

/* --- Product Configuration Page --- */
#order-standard_cart .product-info {
  background-color: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
}

#order-standard_cart .product-info .product-title {
  color: var(--slb-text) !important;
}

#order-standard_cart .field-container {
  background-color: transparent !important;
}

/* --- Mobile & Layout Refinements --- */
@media (max-width: 991px) {
  .table-list {
    border-spacing: 0 4px !important;
  }

  .table-list tbody tr td {
    padding: 1rem 0.5rem !important;
    font-size: 0.85rem !important;
  }

  .tiles .tile {
    margin-bottom: 1rem !important;
    padding: 1.2rem !important;
  }

  .tiles .tile .stat {
    font-size: 1.8rem !important;
  }

  .card-header {
    padding: 0.8rem 1rem !important;
    font-size: 0.95rem !important;
  }
}

/* --- Global Polish --- */
::selection {
  background: var(--slb-accent);
  color: #fff;
}

::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: var(--slb-bg);
}

::-webkit-scrollbar-thumb {
  background: var(--slb-border);
  border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--slb-muted);
}

/* Order Summary (sidebar) */
#orderSummary,
.order-summary {
  background-color: var(--slb-surface2) !important;
  border: 1px solid var(--slb-border) !important;
  color: var(--slb-text) !important;
}

#orderSummary h2,
.order-summary h2 {
  background-color: var(--slb-surface2) !important;
  color: var(--slb-text) !important;
  border-bottom: 1px solid var(--slb-border) !important;
}

#orderSummary .summary-container,
.summary-container {
  background-color: var(--slb-surface) !important;
  color: var(--slb-text) !important;
}

#orderSummary .product-name,
#orderSummary .product-group,
#orderSummary .amt,
#orderSummary .total-due-today span {
  color: var(--slb-text) !important;
}

#orderSummary .summary-totals,
#orderSummary .subtotal,
#orderSummary .bordered-totals {
  border-color: var(--slb-border) !important;
}

/* Fix: light text labels on config page */
#order-standard_cart label {
  color: var(--slb-text) !important;
}

/* Alert at the bottom of the config page */
#order-standard_cart .alert-warning.info-text-sm {
  background-color: var(--slb-surface2) !important;
  border-color: var(--slb-border) !important;
  color: var(--slb-text) !important;
}

/* --- Dashboard Tiles --- */
.tiles .tile {
  background-color: var(--slb-surface2) !important;
  border-color: var(--slb-border) !important;
  color: var(--slb-text) !important;
}

.tiles .tile:hover {
  background-color: var(--slb-surface) !important;
}

/* --- Enhanced Statistics Tiles --- */
.tiles .tile {
  background-color: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
  border-radius: var(--slb-radius) !important;
  padding: 1.8rem 1.5rem !important;
  transition: var(--slb-transition);
  position: relative;
  overflow: hidden;
  display: flex !important;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.tiles .tile:hover {
  transform: translateY(-8px) scale(1.02);
  background-color: var(--slb-surface2) !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.6);
  border-color: var(--slb-accent) !important;
}

.tiles .tile .icon {
  font-size: 2.2rem !important;
  margin-bottom: 0.8rem !important;
  color: var(--slb-accent) !important;
  transition: var(--slb-transition);
}

.tiles .tile:hover .icon {
  transform: scale(1.2) rotate(5deg);
  text-shadow: 0 0 15px var(--slb-accent-glow);
}

.tiles .tile .stat {
  font-weight: 800 !important;
  font-size: 2.4rem !important;
  color: #fff !important;
  margin-bottom: 0 !important;
}

.tiles .tile .title {
  font-weight: 500 !important;
  font-size: 0.9rem !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--slb-muted) !important;
}

/* Home panels additional fixes */
/* --- Home Panels Premium Glassmorphism --- */
.client-home-cards .card {
  background-color: var(--slb-glass-bg) !important;
  backdrop-filter: blur(var(--slb-blur));
  -webkit-backdrop-filter: blur(var(--slb-blur));
  border: 1px solid var(--slb-border) !important;
  border-radius: var(--slb-radius) !important;
  box-shadow: var(--slb-shadow-sm);
}

.client-home-cards .card-header {
  background-color: rgba(255, 255, 255, 0.04) !important;
  border-bottom: 1px solid var(--slb-border) !important;
  color: #fff !important;
}

/* --- Product Icon & Details Page --- */
.product-details .product-icon,
div.product-details div.product-icon {
  background-color: var(--slb-surface2) !important;
  color: var(--slb-text) !important;
  border: 1px solid var(--slb-border) !important;
}

.product-details .product-status-text {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.product-details-tab-container {
  background-color: var(--slb-surface) !important;
  border: 1px solid var(--slb-border) !important;
  border-top: none !important;
}

/* --- Premium Status Badges --- */
.label.status,
.badge.status,
#tableServicesList .status {
  padding: 0.5em 1em !important;
  font-weight: 600 !important;
  border-radius: 50px !important;
  text-transform: uppercase !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.05em !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.15) !important;
  border: none !important;
}

.status-active,
.status-paid,
.badge-success {
  background: linear-gradient(135deg, #238636 0%, #2ea043 100%) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(35, 134, 54, 0.25) !important;
}

.status-pending,
.status-unpaid,
.badge-warning {
  background: linear-gradient(135deg, #9e6a03 0%, #d29922 100%) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(158, 106, 3, 0.25) !important;
}

.status-cancelled,
.status-terminated,
.badge-danger {
  background: linear-gradient(135deg, #b91c1c 0%, #f85149 100%) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(185, 28, 28, 0.25) !important;
}

/* --- Enhanced Table Layout --- */
.table-list {
  border-collapse: separate !important;
  border-spacing: 0 10px !important;
  background: transparent !important;
}

.table-list tbody tr {
  background-color: var(--slb-surface) !important;
  transition: var(--slb-transition) !important;
  box-shadow: var(--slb-shadow-sm) !important;
}

.table-list tbody tr td {
  padding: 1.4rem 1rem !important;
  border: none !important;
  background-color: var(--slb-surface) !important;
}

.table-list tbody tr td:first-child {
  border-radius: var(--slb-radius) 0 0 var(--slb-radius) !important;
}

.table-list tbody tr td:last-child {
  border-radius: 0 var(--slb-radius) var(--slb-radius) 0 !important;
}

.table-list tbody tr:hover {
  transform: scale(1.01) translateY(-2px);
  z-index: 10;
}

.table-list tbody tr:hover td {
  background-color: var(--slb-surface2) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

/* --- LOGO FIX --- */
.logo-img,
.navbar-brand img {
  mix-blend-mode: multiply !important;
  background-color: transparent !important;
}