/** Custom KubiXo CSS - Keycloak 26 */

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

/*************** Vars ***********************************************************************************/

:root {
  --keycloak-border-radius: 25px;
  --keycloak-primary-color: #00838f;
}

/*************** Body ***********************************************************************************/

body {
  font-family: 'Lexend', sans-serif;
}

/*************** Sidebar + main flex *********************************************************************/

.pf-v5-c-page__sidebar {
  grid-area: sidebar;
  width: 300px;
  background-color: var(--keycloak-primary-color);
  transition: width 0.3s ease;
}

.pf-v5-c-page__main {
  margin-left: 0;
  grid-area: main;
  display: flex;
  flex-direction: column;
  transition: margin-left 0.3s ease;
  background-color: white;
}

.pf-v5-c-page__sidebar.pf-m-collapsed {
  width: 60px;
}

/*************** Masthead ***********************************************************************/

.pf-v5-c-masthead {
  --pf-v5-c-masthead--BackgroundColor: var(--keycloak-primary-color);
}

/*
.pf-v5-c-masthead__brand {
  display: none;
}
*/

/*************** Buttons ***********************************************************************/

.pf-v5-c-button {
  --pf-v5-c-button--m-secondary--hover--after--BorderColor: var(--keycloak-primary-color);
}

.pf-v5-c-button.pf-m-primary {
  background-color: var(--keycloak-primary-color);
  border-radius: var(--keycloak-border-radius);
  padding: 15px;
}

.pf-v5-c-button.pf-m-secondary {
  --pf-v5-c-button--after--BorderColor: var(--keycloak-primary-color);
  color: var(--keycloak-primary-color);
  padding: 15px;
}


/*************** Menus ***********************************************************************/


.pf-v5-c-menu-toggle {
  --pf-v5-c-menu-toggle--hover--after--BorderBottomColor: var(--keycloak-primary-color);
}


.pf-v5-c-menu-toggle.pf-m-expanded {
  --pf-v5-c-menu-toggle--after--BorderBottomColor: var(--keycloak-primary-color);
}

/*************** Links ***********************************************************************/


.pf-v5-c-button.pf-m-link {
  color: var(--keycloak-primary-color);
}

.pf-v5-c-jump-links__item.pf-m-current>.pf-v5-c-jump-links__link {
  --pf-v5-c-jump-links__link--before--BorderColor: var(--keycloak-primary-color);
}


a {
  color: var(--keycloak-primary-color);
}

.pf-v5-c-content a {
  color: var(--keycloak-primary-color);
}

/*************** Switch ***********************************************************************/

.pf-v5-c-switch__input:checked~.pf-v5-c-switch__toggle {
  background-color: var(--keycloak-primary-color);
}

/*************** Tabs / menu *******************************************************************/

.pf-v5-c-tabs__item.pf-m-current {
  --pf-v5-c-tabs__link--after--BorderColor: var(--keycloak-primary-color) !important;
}

/*************** Forms ***********************************************************************/


.pf-v5-c-form-control {
  --pf-v5-c-form-control--hover--after--BorderBottomColor: var(--keycloak-primary-color);
  --pf-v5-c-form-control--focus--after--BorderBottomColor: var(--keycloak-primary-color);
  --pf-v5-c-form-control--m-expanded--after--BorderBottomColor: var(--keycloak-primary-color);
}