/* Tema SBD (Solutions By Design) - consola de administracion de Keycloak.
   Reskin soportado oficialmente via el mecanismo de temas: masthead con el azul de marca
   (#325FB5), logo real via properties.logo (ver theme.properties), favicon real.
   El layout/estructura de la consola (React compilado) no es re-skinable sin forkear el
   codigo fuente de Keycloak - fuera de alcance. Esto cubre lo que Keycloak SI soporta:
   masthead, logo, favicon y colores de acento. */

@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700&display=swap");

:root {
  --sbd-blue: #325fb5;
  --sbd-blue-dark: #274a8f;
  --sbd-green: #70b82f;
  --sbd-font: "Roboto", "Segoe UI", -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
}

/* Roboto en toda la consola. La app React del admin console usa PatternFly, que fuerza su
   propia font-family en varios componentes; se sobreescribe con !important donde hace falta
   ademas de heredarla desde el body/root. */
html, body, #app {
  font-family: var(--sbd-font) !important;
}

.pf-v5-c-masthead,
.pf-v5-c-nav,
.pf-v5-c-page,
.pf-v5-c-button,
.pf-v5-c-form-control,
.pf-v5-c-table,
.pf-v5-c-card,
.pf-v5-c-title,
.pf-v5-c-tabs {
  font-family: var(--sbd-font) !important;
}

/* Masthead superior: azul de marca en vez del dark-100 default. Texto ya viene claro por
   diseno de PatternFly para masthead oscuro, se mantiene legible. */
.pf-v5-c-masthead {
  --pf-v5-c-masthead--BackgroundColor: var(--sbd-blue) !important;
}

/* Barra de acento verde debajo del masthead, eco del emblema de marca. */
.pf-v5-c-masthead::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--sbd-green), var(--sbd-blue));
}

/* Botones primarios y enlaces con el azul de marca. */
.pf-v5-c-button.pf-m-primary {
  background-color: var(--sbd-blue) !important;
}

.pf-v5-c-button.pf-m-primary:hover,
.pf-v5-c-button.pf-m-primary:focus {
  background-color: var(--sbd-blue-dark) !important;
}
