/* ============================================
   Cerium Pass - Branding overrides (v3)
   ============================================ */

/* ---- Fuente Encode Sans variable ---- */
@font-face {
  font-family: 'Encode Sans';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/cerium/fonts/EncodeSans-Regular.ttf') format('truetype-variations');
}

/* ---- Redefinir variables Tailwind de marca a rojo Cerium ---- */
:root,
.dark {
  --color-brand-50:  #fdecee;
  --color-brand-100: #fbd0d6;
  --color-brand-200: #f5a3ad;
  --color-brand-300: #ef7585;
  --color-brand-400: #d94458;
  --color-brand-500: #aa182c;  /* rojo Cerium principal */
  --color-brand-600: #8c1424;
  --color-brand-700: #6f1019;
  --color-brand-800: #520c13;
  --color-brand-900: #36080d;
}

/* ---- Override de estilos inline con #dc4a22 ---- */
[style*="dc4a22"],
[style*="220, 74, 34"],
[style*="rgb(220, 74, 34)"] {
  background-color: #aa182c !important;
  border-color: #aa182c !important;
  --tw-ring-color: #aa182c !important;
  --button-shadow-color: #aa182c !important;
  --tw-gradient-from: #aa182c !important;
}

[style*="dc4a22"]:hover,
[style*="220, 74, 34"]:hover {
  background-color: #8c1424 !important;
  border-color: #8c1424 !important;
}

/* ---- Fuente Encode Sans en toda la app ---- */
html, body, button, input, select, textarea {
  font-family: 'Encode Sans', 'Helvetica Neue', Arial, sans-serif !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Encode Sans', 'Helvetica Neue', Arial, sans-serif !important;
  font-weight: 600 !important;
}

/* ---- Versión footer: que no parezca enlace destacado ---- */
a[href*="github"],
a[href*="commit"] {
  color: inherit !important;
  opacity: 0.6;
}

/* ---- Aquí añadiremos el selector para ocultar Generate Password
       cuando me pases el HTML del item del menú ---- */

/* ---- Ocultar opción "Generate Password" del menú split button ---- */
button[data-testid="split-button-option-generate-password"] {
  display: none !important;
}

/* ---- Convertir split button en botón simple ----
   Ocultamos la flecha del desplegable y el menú colgante,
   y redondeamos el botón principal por la derecha. */

/* 1. Ocultar la flechita del desplegable */
button[data-testid="split-button-dropdown-toggle"] {
  display: none !important;
}

/* 2. Ocultar el menú colgante (por si quedara visible al hacer clic en otro sitio) */
[id="split-button-dropdown"],
[aria-controls="split-button-dropdown"] + div,
[data-testid="split-button-dropdown"] {
  display: none !important;
}

/* 3. Redondear el botón principal por la derecha (ahora que no hay flecha al lado) */
button[type="submit"][style*="dc4a22"],
button[type="submit"][style*="220, 74, 34"],
button[type="submit"][style*="aa182c"],
button[type="submit"][style*="170, 24, 44"] {
  border-top-right-radius: 0.5rem !important;
  border-bottom-right-radius: 0.5rem !important;
}