/*
  Charte de marque (centralisee) - MedXPERT
  Palette: Cyan / Teal (alignee sur les logos)
  Couleurs extraites: #29B6F6 (cyan) -> #009688 (teal)
*/

:root {
  /* Couleurs de base */
  --mx-bg: #ffffff;
  --mx-surface: #ffffff;
  --mx-surface-muted: #f0f9ff;
  --mx-border: #e0f2fe;

  /* Texte */
  --mx-text: #0f172a;
  --mx-text-strong: #0c1929;
  --mx-text-muted: #475569;
  --mx-text-subtle: #64748b;

  /* Primaire: Cyan -> Teal (degrade des logos) */
  --mx-primary: #00acc1;
  --mx-primary-strong: #00838f;
  --mx-primary-stronger: #006064;
  --mx-primary-soft: #e0f7fa;

  /* RGB pour box-shadow avec opacite */
  --mx-primary-rgb: 0, 172, 193;

  /* Footer */
  --mx-footer-bg: #0c1929;
}

/* Override box-shadow colors */
.btn-demo {
  box-shadow: 0 4px 12px rgba(var(--mx-primary-rgb), 0.3);
}

.btn-demo:hover {
  box-shadow: 0 6px 20px rgba(var(--mx-primary-rgb), 0.4);
}

.btn-primary {
  box-shadow: 0 4px 12px rgba(var(--mx-primary-rgb), 0.3);
}

.btn-primary:hover {
  box-shadow: 0 6px 20px rgba(var(--mx-primary-rgb), 0.4);
}

.hero-badge {
  box-shadow: 0 4px 12px rgba(var(--mx-primary-rgb), 0.3);
}

.btn-submit {
  box-shadow: 0 4px 12px rgba(var(--mx-primary-rgb), 0.3);
}

.btn-submit:hover {
  box-shadow: 0 6px 20px rgba(var(--mx-primary-rgb), 0.4);
}

/* Focus states */
input:focus,
textarea:focus,
select:focus {
  border-color: var(--mx-primary);
  box-shadow: 0 0 0 3px rgba(var(--mx-primary-rgb), 0.1);
}