/*
 * Cimigo account console over keycloak.v3 (PatternFly 5). Values from the Cimigo design system
 * (new-design-system, packages/core/.generated/tokens.css and the design spec), as in the login theme.
 * Masthead: Cimigo navy (blue-950) with the logo on a white plate; the active navigation item is marked with Cimigo
 * lime, the accent the system reserves for indicators, which reads on the dark sidebar.
 */

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('../fonts/inter-latin-wght-normal.woff2') format('woff2-variations');
  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;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('../fonts/inter-latin-ext-wght-normal.woff2') format('woff2-variations');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
    U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
    U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('../fonts/inter-vietnamese-wght-normal.woff2') format('woff2-variations');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1,
    U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329,
    U+1EA0-1EF9, U+20AB;
}

:root {
  --cimigo-primary: oklch(0.4926 0.1323 255.13);
  --cimigo-primary-hover: oklch(0.4000 0.1125 255.13);
  --cimigo-navy: #021F42;           /* blue-950 */
  --cimigo-lime: #B5DC10;           /* Cimigo Lime, accent only, never text on light */
  --cimigo-border-control: oklch(0.6400 0.0120 255.00);
  --cimigo-focus-ring: oklch(0.6400 0.1012 255.13);
  --cimigo-font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --pf-v5-global--FontFamily--text: var(--cimigo-font);
  --pf-v5-global--FontFamily--heading: var(--cimigo-font);
  --pf-v5-global--primary-color--100: var(--cimigo-primary);
  --pf-v5-global--primary-color--200: var(--cimigo-primary-hover);
  --pf-v5-global--link--Color: var(--cimigo-primary);
  --pf-v5-global--link--Color--hover: var(--cimigo-primary-hover);
  --pf-v5-global--BorderRadius--sm: 0.5rem;
}
.pf-v5-theme-dark {
  --cimigo-primary: oklch(0.7400 0.0785 255.13);
  --cimigo-primary-hover: oklch(0.8300 0.0564 255.13);
  --cimigo-border-control: oklch(0.5600 0.0108 255.00);
  --cimigo-focus-ring: oklch(0.7400 0.0785 255.13);
  --pf-v5-global--primary-color--100: var(--cimigo-primary);
  --pf-v5-global--primary-color--200: var(--cimigo-primary-hover);
  --pf-v5-global--link--Color: var(--cimigo-primary);
  --pf-v5-global--link--Color--hover: var(--cimigo-primary-hover);
}

body, .pf-v5-c-page {
  font-family: var(--cimigo-font);
}

/* Masthead: Cimigo navy, the logo on a white plate so its blue reads. */
.pf-v5-c-masthead {
  --pf-v5-c-masthead--BackgroundColor: var(--cimigo-navy);
  background-color: var(--cimigo-navy);
}
/* In dark mode the toolbar inside the masthead paints its own ground; let the navy show through. */
.pf-v5-c-masthead .pf-v5-c-masthead__content,
.pf-v5-c-masthead .pf-v5-c-toolbar,
.pf-v5-c-masthead .pf-v5-c-toolbar__content {
  --pf-v5-c-toolbar--BackgroundColor: transparent;
  --pf-v5-c-toolbar__content--BackgroundColor: transparent;
  background-color: transparent;
}
.pf-v5-c-masthead .pf-v5-c-brand,
.pf-v5-c-masthead__brand img {
  background: #FFFFFF;
  border-radius: 6px;
  padding: 4px 10px;
  height: 36px;
  box-sizing: border-box;
}

/* Navigation: the active item carries a lime marker. */
.pf-v5-c-nav__link.pf-m-current::after,
.pf-v5-c-nav__link.pf-m-current:hover::after {
  --pf-v5-c-nav__link--after--BorderColor: var(--cimigo-lime);
  border-color: var(--cimigo-lime);
}

/* Buttons and controls: the design system's Button and Input at size md (radius 8px, weight 500). */
.pf-v5-c-button {
  border-radius: 0.5rem;
  font-weight: 500;
}
.pf-v5-c-button::after { border-radius: 0.5rem; }
.pf-v5-c-button.pf-m-primary {
  --pf-v5-c-button--m-primary--BackgroundColor: var(--cimigo-primary);
  --pf-v5-c-button--m-primary--hover--BackgroundColor: var(--cimigo-primary-hover);
  --pf-v5-c-button--m-primary--focus--BackgroundColor: var(--cimigo-primary-hover);
}
.pf-v5-c-form-control {
  border-radius: 0.5rem;
  --pf-v5-c-form-control--before--BorderColor: var(--cimigo-border-control);
  --pf-v5-c-form-control--after--BorderColor: transparent;
}
.pf-v5-c-form-control::before { border: 1px solid var(--pf-v5-c-form-control--before--BorderColor); border-radius: 0.5rem; }
.pf-v5-c-form-control::after { border: 0; }
.pf-v5-c-form-control:focus-within {
  outline: 2px solid var(--cimigo-focus-ring);
  outline-offset: 2px;
}
.pf-v5-c-button:focus-visible {
  outline: 2px solid var(--cimigo-focus-ring);
  outline-offset: 2px;
}