/* Paleta de colores */
:root {
  /* Se va a dejar de usar esta paleta en pos de utilizar la de bootstrap */
  --primary-color: var(--bs-primary);
  --on-primary-color: #ffffff;
  --primary-container-color: #d1ebca;
  --on-primary-container-color: #153812;
  --secondary-color: #6a6d86;
  --on-secondary-color: #ffffff;
  --secondary-container-color: #bfd0c0;
  --on-secondary-container-color: #0c2a0b;
  --tertiary-color: #064142;
  --on-tertiary-color: #eeeeee;
  --tertiary-container-color: #dfe6ee;
  --on-tertiary-container-color: #1b2f35;
  --surface: #f5f5f5;
  --surface-bright: #ffffff;
  --surface-container-lowest: #fcfcfc;
  --surface-container-low: #dbe0ea;
  --surface-container: #697486;
  --surface-container-high: #5e6a7d;
  --surface-container-highest: #5a6677;
  --on-surface: #4a4a4a;
  --on-surface-variant: #f6f9ff;
  --outline: #b6bdcc;
  --outline-variant: #4b556a;

  /* Global */
  --font-family: "Lato", sans-serif;
  --body-bg-color: var(--surface);
  --scroll-bar-color: #97a2b4 #121315;

  /* Navigation bar Nivel 0 (menú principal) */
  --menu0-bg-color: ;
  --menu0-tab-font-color: var(--primary-color);
  --menu0-tab-bg-hover-color: var(--surface-container-low);
  --menu0-tab-font-hover-color: var(--primary-color);
  --menu0-tab-bg-active-color: var(--primary-color);
  --menu0-tab-font-active-color: var(--on-primary-color);

  /* Navigation bar Nivel 1 (submenú) */
  --submenu1-bg-color: var(--surface-container-high);
  --submenu1-border-bottom-color: var(--outline-variant);
  --submenu1-pill-font-color: var(--on-secondary-color);
  --submenu1-pill-bg-hover-color: var(--surface-container);
  --submenu1-pill-font-hover-color: var(--on-primary-color);
  --submenu1-pill-bg-active-color: var(--primary-color);
  --submenu1-pill-font-active-color: var(--on-primary-color);

  /* Navigation bar Nivel 2 (submenú) */
  --submenu2-bg-color: var(--surface-container-highest);
  --submenu2-border-bottom-color: var(--outline-variant);
  --submenu2-pill-font-color: var(--on-secondary-color);
  --submenu2-pill-bg-hover-color: var(--surface-container);
  --submenu2-pill-font-hover-color: var(--on-primary-color);
  --submenu2-pill-bg-active-color: var(--primary-color);
  --submenu2-pill-font-active-color: var(--on-primary-color);

  /* Administration */
  --adm-body-bg-color: var(--surface-bright);
  --adm-content-header-bg-color: var(--surface-container);
  --adm-content-header-font-color: var(--on-secondary-color);
  --adm-content-header-help-font-color: var(--on-tertiary-color);
  --adm-content-header-link-color: var(--on-surface-variant);
  --adm-content-header-link-hover-color: var(--tertiary-container-color);

  /* Context Menu (Menú izq.) */
  --actions-menu-bg-color: var(--tertiary-container-color);
  --actions-menu-border-bottom: var(--outline);
  --actions-menu-font-color: var(--on-tertiary-container-color);
  --actions-menu-title-font-color: var(--primary-color);
  --actions-menu-link-color: var(--on-tertiary-container-color);

  /* Forms */
  --forms-title-text-color: #4a5061;
  --forms-label-text-color: #656d84;

  /* Table */
  --table-bg-color: var(--surface-bright);
  --table-caption-bg-color: ;
  --table-caption-font-color: var(--primary-color);
  --table-head-bg-color: var(--primary-color);
  --table-head-font-color: var(--on-primary-color);
  --table-footer-font-color: var(--secondary-color);
  --table-footer-select-font-color: var(--secondary-color);
  --table-actions-icon-color: var(--primary-color);
  --table-actions-icon-hover-color: var(--secondary-color);
  --table-delete-btn-color: #dd5555;
  --table-select-bg-color: #ffffff;

  /* Active Filters */
  --active-filter-bg-color: #ffffff;
  --active-filter-font-color: #4387d5;

  /* Matriz de talento */
  --talent-matrix-text-primary: var(--on-primary-color);
  --talent-matrix-icon: var(--on-primary-color);
  --talent-matrix-icon-hover: var(--on-primary-color);

  --talent-matrix-box-text-color: var(--primary-color);

  --talent-matrix-edit-text: var(--talent-matrix-text-primary);
  --talent-matrix-edit-bg: var(--talent-matrix-box-text-color);

  --talent-matrix-low-level: #ffeded;
  --talent-matrix-improve-level: #fff5e8;
  --talent-matrix-average-level: #fffde6;
  --talent-matrix-high-average-level: #f2ffe9;
  --talent-matrix-high-level: #deffeb;

  --talent-matrix-low-level-active: #370000;
  --talent-matrix-improve-level-active: #351f01;
  --talent-matrix-average-level-active: #2d2902;
  --talent-matrix-high-average-level-active: #142f01;
  --talent-matrix-high-level-active: #003724;

  --talent-matrix-potential-label-level: var(--surface-container-lowest);
  --talent-matrix-performance-label-level: var(--surface-container-lowest);

  /* Matriz listado de participantes */
  --talent-matrix-box-border: #b6bec6;

  /* Matriz participante detail/update */
  --talent-matrix-selected-text-color: var(--talent-matrix-text-primary);
  --talent-matrix-selected-bg-color: var(--surface-container-high);

  --talent-matrix-save-btn-bg-color: var(--surface-container-high);
  --talent-matrix-save-btn-hover-text-color: var(--surface-container-high);
  --talent-matrix-save-btn-hover-bg-color: var(--on-primary-color);

  --sgd-color-estado-no-aplica: var(--bs-secondary);
  --sgd-color-estado-borrador: #7ee1e1;
  --sgd-color-estado-nuevo: #f0ad4e;
  --sgd-color-estado-validado: #5cb85c;
  --sgd-color-estado-finalizado: #5bc0de;
  --sgd-color-estado-incompleto: #eb859a;

  --sgd-color-estado-potencial-no-aplica: var(--bs-secondary);
  --sgd-color-estado-potencial-evaluado: #5cb85c;
  --sgd-color-estado-potencial-no_evaluado: #eb859a;
  --sgd-color-estado-potencial-finalizado: #5bc0de;
  --sgd-color-estado-potencial-incompleto: #eb859a;
}