/*
 * Thème orange ENA pour Chatwoot
 * Dégradé principal : #FFB000 -> #F97316 -> #F4511E
 */

:root {
  --ena-orange-light: #ffb000;
  --ena-orange-main: #f97316;
  --ena-orange-dark: #f4511e;
  --ena-orange-pale: #fff7ed;
  --ena-orange-soft: #ffedd5;
  --ena-orange-border: #fdba74;
  --ena-orange-gradient:
    linear-gradient(
      135deg,
      #ffb000 0%,
      #f97316 52%,
      #f4511e 100%
    );
}

/* Boutons principaux et éléments interactifs bleus */
button[class*="bg-blue-"],
button[class*="bg-woot"],
button[class*="bg-n-brand"],
button[class*="bg-primary"],
a[class*="bg-blue-"],
a[class*="bg-woot"],
a[class*="bg-n-brand"],
a[class*="bg-primary"],
[role="button"][class*="bg-blue-"],
[role="button"][class*="bg-woot"],
[role="button"][class*="bg-n-brand"],
[role="button"][class*="bg-primary"] {
  background-color: var(--ena-orange-main) !important;
  background-image: var(--ena-orange-gradient) !important;
  border-color: var(--ena-orange-main) !important;
  color: #ffffff !important;
  box-shadow: 0 6px 18px rgba(244, 81, 30, 0.22) !important;
}

/* Variantes Chatwoot les plus courantes */
.bg-woot-500,
.bg-woot-600,
.bg-blue-500,
.bg-blue-600,
.bg-blue-700,
.bg-n-brand,
.bg-n-brand-strong,
.bg-primary,
.button--primary,
.woot-button--primary {
  background-color: var(--ena-orange-main) !important;
  background-image: var(--ena-orange-gradient) !important;
  border-color: var(--ena-orange-main) !important;
  color: #ffffff !important;
}

/* Survol des boutons */
button[class*="bg-blue-"]:hover,
button[class*="bg-woot"]:hover,
button[class*="bg-n-brand"]:hover,
a[class*="bg-blue-"]:hover,
a[class*="bg-woot"]:hover,
a[class*="bg-n-brand"]:hover,
[role="button"][class*="bg-blue-"]:hover,
[role="button"][class*="bg-woot"]:hover,
[role="button"][class*="bg-n-brand"]:hover {
  background-image:
    linear-gradient(
      135deg,
      #f59e0b 0%,
      #ea580c 55%,
      #dc3b1f 100%
    ) !important;
  filter: brightness(1.02);
}

/* Fonds bleus légers */
.bg-blue-50,
.bg-blue-100,
.bg-woot-50,
.bg-woot-100,
[class~="bg-n-brand-subtle"] {
  background-image: none !important;
  background-color: var(--ena-orange-pale) !important;
}

/* Textes et icônes bleus */
[class*="text-blue-"],
[class*="text-woot"],
[class*="text-n-brand"],
[class*="text-primary"],
.text-woot-500,
.text-blue-500,
.text-blue-600,
.text-blue-700 {
  color: var(--ena-orange-main) !important;
}

/* Bordures */
[class*="border-blue-"],
[class*="border-woot"],
[class*="border-n-brand"],
[class*="border-primary"] {
  border-color: var(--ena-orange-border) !important;
}

/* Anneaux de focus */
[class*="ring-blue-"],
[class*="ring-woot"],
[class*="ring-n-brand"],
[class*="ring-primary"],
input:focus,
textarea:focus,
select:focus {
  --tw-ring-color: rgba(249, 115, 22, 0.42) !important;
  border-color: var(--ena-orange-main) !important;
}

/* Liens Chatwoot explicitement marqués en bleu */
a[class*="text-blue-"],
a[class*="text-woot"],
a[class*="text-n-brand"] {
  color: var(--ena-orange-main) !important;
}

a[class*="text-blue-"]:hover,
a[class*="text-woot"]:hover,
a[class*="text-n-brand"]:hover {
  color: var(--ena-orange-dark) !important;
}

/* Onglets et éléments sélectionnés */
[aria-current="page"][class*="blue"],
[aria-selected="true"][class*="blue"],
[data-state="active"][class*="blue"],
[aria-current="page"][class*="brand"],
[aria-selected="true"][class*="brand"] {
  background-color: var(--ena-orange-main) !important;
  background-image: var(--ena-orange-gradient) !important;
  border-color: var(--ena-orange-main) !important;
}

/* Icônes SVG contenant encore les anciennes couleurs */
svg [fill="#2781f6"],
svg [fill="#2781F6"],
svg [fill="#1f93ff"],
svg [fill="#1F93FF"],
svg [fill="#3b9eff"],
svg [fill="#3B9EFF"] {
  fill: var(--ena-orange-main) !important;
}

svg [stroke="#2781f6"],
svg [stroke="#2781F6"],
svg [stroke="#1f93ff"],
svg [stroke="#1F93FF"],
svg [stroke="#3b9eff"],
svg [stroke="#3B9EFF"] {
  stroke: var(--ena-orange-main) !important;
}

/* Sélection de texte et barres de progression */
::selection {
  color: #ffffff;
  background: var(--ena-orange-main);
}

progress {
  accent-color: var(--ena-orange-main);
}

input[type="checkbox"],
input[type="radio"],
input[type="range"] {
  accent-color: var(--ena-orange-main);
}