/* HALMEEL design tokens for every Keycloak theme (login, account, admin), taken from the
   website (app/globals.css, DM Sans). The font is served by Keycloak itself, like next/font
   does for the site, so no request goes to a third party. Copied into each theme's resources
   by infra/keycloak/Dockerfile. */

@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 100 1000;
  font-display: swap;
  src: url("../fonts/dm-sans-latin-ext.woff2") format("woff2");
  unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F,
    U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 100 1000;
  font-display: swap;
  src: url("../fonts/dm-sans-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
    U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  --hm-background: #f4f6f8;
  --hm-foreground: #333333;
  --hm-card: #ffffff;
  --hm-primary: #1d6fe0;
  --hm-primary-hover: #185ec0;
  --hm-navy: #163a66;
  --hm-navy-link: #1d4f91;
  --hm-yellow: #f6c445;
  --hm-muted: #eef2f6;
  --hm-muted-foreground: #5c6778;
  --hm-accent: #e7f0fb;
  --hm-border: #e1e7ef;
  --hm-input: #d5deea;
  --hm-header-border: #d7e2ef;
  --hm-destructive: #b42318;
  --hm-font: "DM Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  /* PatternFly 5, used by all Keycloak pages. */
  --pf-v5-global--FontFamily--text: var(--hm-font);
  --pf-v5-global--FontFamily--heading: var(--hm-font);
  --pf-v5-global--FontFamily--sans-serif: var(--hm-font);
  --pf-v5-global--primary-color--100: var(--hm-primary);
  --pf-v5-global--primary-color--200: var(--hm-primary-hover);
  --hm-link: var(--hm-primary);
  --pf-v5-global--link--Color: var(--hm-link);
  --pf-v5-global--link--Color--hover: var(--hm-primary-hover);
  --pf-v5-global--active-color--100: var(--hm-primary);
  --pf-v5-global--Color--100: var(--hm-foreground);
  --pf-v5-global--Color--200: var(--hm-muted-foreground);
  --pf-v5-global--BackgroundColor--100: var(--hm-card);
  --pf-v5-global--BackgroundColor--200: var(--hm-background);
  --pf-v5-global--BorderColor--100: var(--hm-input);
  --pf-v5-global--danger-color--100: var(--hm-destructive);
  --pf-v5-c-button--BorderRadius: 8px;
  --pf-v5-c-form-control--before--BorderColor: var(--hm-input);
  --pf-v5-c-form-control--after--BorderColor: var(--hm-input);
}

/* Dark theme: Keycloak adds this class when the device asks for dark mode. Same values as
   the website's dark theme (app/globals.css). */
html.pf-v5-theme-dark {
  --hm-background: #0b1220;
  --hm-foreground: #e6ebf1;
  --hm-card: #131d2b;
  --hm-primary: #2f7de8;
  --hm-primary-hover: #1d6fe0;
  --hm-navy: #d4e3f8;
  --hm-navy-link: #a9c7f2;
  --hm-muted: #1a2535;
  --hm-muted-foreground: #9aa6b6;
  --hm-accent: #17304f;
  --hm-border: #263448;
  --hm-input: #34465f;
  --hm-header-border: #263448;
  --hm-destructive: #f4a29a;
  --hm-link: #7fb0f7;
  color-scheme: dark;
}

body {
  font-family: var(--hm-font);
  color: var(--hm-foreground);
  -webkit-font-smoothing: antialiased;
}

.pf-v5-c-button.pf-m-primary {
  --pf-v5-c-button--m-primary--BackgroundColor: var(--hm-primary);
  --pf-v5-c-button--m-primary--hover--BackgroundColor: var(--hm-primary-hover);
  --pf-v5-c-button--m-primary--focus--BackgroundColor: var(--hm-primary-hover);
  --pf-v5-c-button--m-primary--active--BackgroundColor: var(--hm-primary-hover);
  font-weight: 700;
}

.pf-v5-c-form-control {
  border-radius: 6px;
}