/*
 * CRM Énergie — thème custom
 * Injecté par nginx (sub_filter) dans le HTML servi par Twenty.
 * Surcharge les variables CSS --t-* de Twenty + quelques sélecteurs ciblés.
 *
 * Esprit : bleu énergie (style EDF / Engie / Octopus) sur fond clair,
 * bordures arrondies, ombres subtiles, typographie un peu plus pro.
 */

/* ─── Palette CRM Énergie ──────────────────────────────────────────── */
:root {
  /* Bleu primaire : profond, sérieux, secteur énergie */
  --crm-blue-50:  #EBF2FB;
  --crm-blue-100: #D2E0F4;
  --crm-blue-200: #A0BFE5;
  --crm-blue-300: #6E9ED6;
  --crm-blue-400: #4985C8;
  --crm-blue-500: #2E6FB8;
  --crm-blue-600: #1E5FB8;   /* couleur principale */
  --crm-blue-700: #154A94;
  --crm-blue-800: #0E3870;
  --crm-blue-900: #08254D;

  /* Accent énergie : un orange chaleureux pour les alertes positives */
  --crm-accent-orange: #F08D2C;

  /* Vert pour les succès */
  --crm-green: #22A06B;
}

/* ─── Surcharge variables Twenty ───────────────────────────────────── */
:root,
html.light,
html.dark {
  /* Couleur principale utilisée partout : boutons, links, focus, chips */
  --t-color-blue: var(--crm-blue-600) !important;
  --t-accent-secondary: var(--crm-blue-500) !important;
}

/* ─── Rayon de bordure global plus prononcé (look moderne) ────────── */
html {
  --t-border-radius-xs: 4px;
  --t-border-radius-sm: 6px;
  --t-border-radius-md: 8px;
  --t-border-radius-lg: 12px;
}

/* ─── Typographie : Inter est déjà chargé par Twenty, on l'utilise
       avec un letter-spacing légèrement resserré pour un look pro ──── */
body, * {
  letter-spacing: -0.005em;
}

/* Titres : un peu plus de poids pour la hiérarchie */
h1, h2, h3, [class*="Title"] {
  letter-spacing: -0.02em;
  font-weight: 600;
}

/* ─── Boutons primaires : ombre douce + transition fluide ─────────── */
button[class*="Primary"],
button.btn-primary,
.btn-primary,
button[type="submit"] {
  box-shadow: 0 1px 3px rgba(30, 95, 184, 0.18), 0 1px 2px rgba(0, 0, 0, 0.04);
  transition: box-shadow 0.18s ease, transform 0.18s ease;
}

button[class*="Primary"]:hover,
button.btn-primary:hover,
.btn-primary:hover,
button[type="submit"]:hover {
  box-shadow: 0 4px 8px rgba(30, 95, 184, 0.24), 0 2px 4px rgba(0, 0, 0, 0.06);
  transform: translateY(-1px);
}

/* ─── Sidebar : touche de gradient subtil bleu pâle ───────────────── */
nav[class*="Sidebar"],
aside[class*="Sidebar"],
[class*="NavigationDrawer"] {
  background: linear-gradient(180deg,
              var(--t-background-secondary) 0%,
              color-mix(in srgb, var(--crm-blue-50) 50%, var(--t-background-secondary)) 100%);
}

/* Item actif dans la sidebar : highlight bleu plus visible */
[class*="NavigationDrawer"] [aria-current="page"],
[class*="NavigationDrawer"] [class*="Selected"] {
  background-color: var(--crm-blue-100) !important;
  color: var(--crm-blue-800) !important;
  border-left: 3px solid var(--crm-blue-600) !important;
}

/* ─── Cards / fiches : ombre subtile pour plus de profondeur ──────── */
[class*="Card"],
[class*="RecordPreview"],
[class*="ShowPage"] {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
}

/* ─── Tableaux : entêtes plus contrastées ─────────────────────────── */
[class*="RecordTable"] thead,
[class*="RecordTable"] [role="rowheader"] {
  background-color: var(--crm-blue-50) !important;
  font-weight: 600 !important;
  color: var(--crm-blue-800) !important;
}

/* ─── Chips de statut : padding plus aéré ─────────────────────────── */
[class*="Chip"],
[class*="Tag"] {
  font-weight: 500;
  letter-spacing: 0;
}

/* ─── Page de login : un peu de relief ────────────────────────────── */
[class*="SignInUp"],
[class*="LoginPage"] {
  background: linear-gradient(135deg,
              var(--crm-blue-50) 0%,
              var(--t-background-primary) 50%,
              var(--crm-blue-50) 100%);
}

/* ─── Inputs : focus plus visible (accessibilité) ─────────────────── */
input:focus,
textarea:focus,
select:focus,
[class*="Input"]:focus-within {
  outline: none !important;
  border-color: var(--crm-blue-500) !important;
  box-shadow: 0 0 0 3px rgba(30, 95, 184, 0.15) !important;
}

/* ─── Liens : couleur primaire + sous-soulignement au hover ───────── */
a[href]:not([class*="NavigationDrawer"] *):not([role="button"]) {
  color: var(--crm-blue-600);
  text-decoration: none;
  transition: color 0.15s ease;
}
a[href]:not([class*="NavigationDrawer"] *):not([role="button"]):hover {
  color: var(--crm-blue-800);
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ─── Scrollbar légère et discrète ────────────────────────────────── */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-thumb {
  background-color: var(--t-border-color-medium);
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background-color: var(--crm-blue-400);
}
::-webkit-scrollbar-track {
  background-color: transparent;
}