/* colors.css */
:root {
  /* START AXXON Style */
  --background-primary: #09b0b6;
  --background-secondary: #2462b7;
  --background-page-link: #09b0b6 ;

  /* Footer Config */
  --background-fotter: #383943;
  --text-fotter: white;

  /* Navbar Config */
  --background-top-navbar: #01427a;
  --background-side-navbar: #021531;
  --text-navbar: white;
  --text-navbar-hover: #3e5cb2;

  /* Text Config */
  --text-primary: rgb(133 135 150);
  --text-title: #4d4d4d;
  --text-issirmax: #09b0b6;

  /* Catalogs config */
  --hover-cards: #2462b7;

  /* BTNS config */
  --btn-primary: #09b0b6;
  --btn-secondary: #383943;
  --btn-disabled : #818a9b;
  --btn-clean-filters: #383943;
  --btn-search-filters: #09b0b6;

  /* Input Config */
  --input-label-color: #858796;

  /* End AXXON Style */

  /* Login */
  --background-login: #5a5c69;
  --background-login-card: #383943;
  --color-input-login: #3a3b45;
}


#sidebarToggle::after {
  color: var(--text-issirmax);
}

.nav-background {
  background-color: var(--background-top-navbar) !important; /* Ensure this is applied */
}
.menu-color {
  background-color: var(--background-side-navbar) !important;
  color: var(--text-fotter) !important;
}

.footer-background {
  background-color: var(--background-fotter) !important;
}

.table-top-color {
  background-color: var(--background-primary) !important;
}

.show-container {
  width: 100% !important;
  border: solid 1px white !important;
  margin-top: 10px !important;
}

.btn-save-style {
  border-radius: 10px !important;
  background-color: var(--background-secondary) !important;
  color: white !important;
  border: none !important;
}

.btn-aling {
  text-align: right;
}

.btn-primary {
  border-color: var(--btn-primary) !important;
  background-color: var(--btn-primary) !important;
  border-radius: 18px !important;
  font-size: 15px;
  color: white !important;
  box-shadow: none !important;
}

.btn-secondary {
  border-color: var(--btn-secondary) !important;
  font-size: 15px;
  background-color: var(--btn-secondary) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  color: white !important;
}
.btn-disabled {
  border-color: var(--btn-disabled) !important;
  font-size: 15px;
  background-color: var(--btn-disabled) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
  color: white !important;
}

.btn-cancel-style {
  border-radius: 10px !important;
  background-color: var(--background-primary) !important;
  color: white !important;
  border: none !important;
}

.input-color {
  color: var(--input-label-color) !important;
}

.border_top {
  border-top-color: var(--background-primary) !important;
  border-top-width: medium !important;
}

.btn-round {
  background-color: var(--background-primary) !important;
  border-radius: 50px !important;
}

.btn-trash{
  background-color: var(--background-primary) !important;
  border-radius: 50px !important;
  border: none;
}

.input-holder {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #3d3d3d;
  background-color: #eeeeee;
  background-clip: padding-box;
  border: 2px solid #eeeeee;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0.35rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.input-holder:focus {
  border-color: #3f3f3f !important;
}

.btn-radius {
  border-radius: 10px !important;
}

.card-border-color {
  background-color: white !important;
}

.title {
  font-family: var(--bs-body-font-family) !important;
  color: var(--background-secondary) !important;
}

.title-forms {
  font-family: var(--bs-body-font-family) !important;
  color: var(--background-secondary) !important;
  font-weight: bold;
  font-size: 45px;
}

.margen {
  margin-top: 20px;
}

.report-table {
  border-radius: 7px;
  background-color: #4d4d4d !important;
}

.input-select {
  display: block;
  width: 100%;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  -moz-padding-start: calc(0.75rem - 3px);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #3d3d3d;
  background-color: #eeeeee;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%235a5c69' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
  border: 1px solid #d1d3e2;
  border-radius: 0.35rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.input-select:focus {
  border-color: #3f3f3f !important;
}

input {
  color: #3d3d3d !important;
  /* background-color: #eeeeee !important; */
  background-clip: padding-box !important;
  border: 2px solid #eeeeee !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  border-radius: 0.35rem !important;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

input:focus {
  border-color: #3f3f3f !important;
  border-color: none !important;
  outline: none !important;
  box-shadow: none !important;
}

select {
  color: #3d3d3d !important;
  /* background-color: #eeeeee !important; */
  background-repeat: no-repeat !important;
  background-position: right 0.75rem center !important;
  background-size: 16px 12px !important;
  border: 2px solid #eeeeee !important;
  border-radius: 0.35rem !important;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
}

select:focus {
  border-color: #3f3f3f !important;
  border-color: none !important;
  outline: none !important;
  box-shadow: none !important;
}

.form-check-input:checked {
  background-color: var(--background-primary) !important;
  border-color: var(--background-primary) !important;
}


.nav-table {
  color: #3d3d3d !important;
  background-color: #eeeeee !important;
}

.btn-dowloand {
  width: 200px !important;
  height: 40px !important;
  border-radius: 10px !important;
  background-color: var(--background-secondary) !important;
  color: white !important;
  margin-top: 20px !important;
}

.btn-padding{
  padding: 4px !important;
}

.catalogos_cards:hover{
  color:var(--hover-cards)
}

.background-container{
  background-color: #f8f9fc !important;
}

.horario-head{
  background-color: var(--background-primary) !important;
  color: white !important;
}

.card-style{
  background-color: var(--background-primary);
  color: white;
}

.text-title{
  color: var(--text-title) !important;
}

.text{
  color: var(--text-primary) !important;
}

.select2-selection {
  display: block !important;
  width: 100% !important;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem !important;
  -moz-padding-start: calc(0.75rem - 3px) !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  color: #3d3d3d !important;
  /* background-color: #eeeeee !important; */
  background-repeat: no-repeat !important;
  background-position: right 0.75rem center !important;
  background-size: 16px 12px !important;
  /* border: 1px solid #d1d3e2 !important; */
  border-radius: 0.35rem !important;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
}

.select2-selection:focus {
  border-color: #3f3f3f !important;
}

td, th {
  color:  #4d4d4d!important;
}

.borde-verde-superior{
  border-top: 3px solid var(--background-secondary) !important;
}

/* HOMOLOGATE STYLES */
#nav_left.sidebar.toggled a > svg {
  font-size: 1.1rem !important;
}

@media (min-width: 768px) {
  #nav_left.sidebar.toggled a.navbar-brand {
    margin-right: .39rem !important;
  }
}

@media (max-width: 767px) {
  #nav_left.sidebar a.navbar-brand {
    margin-right: 0 !important;
  }

}

a.navbar-brand{
  margin-top: 2.4rem !important;
}

.btn_filtrar {
  border-radius: 20px;
  margin: 2px;
  color: rgb(255,255,255) !important;
  border-width: 0px;
  background: var(--btn-search-filters);
}

.btn_borrar_filtros {
  margin: 2px;
  border-radius: 20px;
  border-width: 0px;
  border: var(--btn-clean-filters) !important;
  background-color: var(--btn-clean-filters) !important;
  box-shadow: none !important;
  color: rgb(255,255,255) !important
}

@media (min-width: 300px) and (max-width: 575px) {
  /* FILTERS BUTTONS */
  #filter_actions {
    display: grid;
  }

  .btn_filtrar {
    order:1;
    width: 100%;
  }

  .btn_borrar_filtros {
    order:2;
    width: 100%;
  }
}

.btn_rounded {
  border-radius: 18px !important;
}

.card_rounded {
  border-radius: 10px !important;
}

.table > thead {
  vertical-align: middle !important;
}

.font_volver {
  font-size: 21px !important;
}

.small_form {
  max-width: 900px;
  margin-right: auto !important;
  margin-left: auto !important;
}

@media (min-width: 300px) and (max-width: 767px) {
  .container-fluid {
    width: 100% !important;
  }

  #btn_actions {
    display: grid;
  }

  #btn_actions > .btn-primary {
    order:1;
    width: 100%;
    margin-bottom: 0.4rem;
  }

  #btn_actions > .btn_mostaza {
    order:2;
    width: 100%;
  }

  #btn_actions > .btn-secondary{
    order:3;
    margin-top: 0.4rem;
    width: 100%;
  }

  .card-sm-body {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

}

.form_check_center {
  min-height: 1.7rem !important;
}

.margin_bottom_btn {
  margin-bottom: 0.4rem !important;
}

.page-link {
  color: var(--background-page-link) !important;
}

.page-link, .page-link:focus, .page-link:active {
  outline: none !important;
  -moz-outline-style: none !important;
  box-shadow: none !important;
}

td {
  word-break: break-word;
}

.table-bordered>:not(caption)>* {
  border-width: 1px;
}

.dropdown-item.active, .dropdown-item:active {
  color: #000;
  text-decoration: none;
  background-color: #eaecf4;
}

.bg-guinda {
  background-color: var(--background-primary) !important;
}

.card_link {
  text-decoration: none;
  color: inherit;
}

.catalogo_link .card-title {
  pointer-events: none;
}

td {
  vertical-align: middle;
}

table.table-bordered tbody :has(.form-control),
table.table-bordered tbody :has(.form-select) {
  margin-bottom : 0 !important;
}


.overlay-spinner {
  background-color:#EFEFEF;
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 1000;
  top: 0px;
  left: 0px;
  opacity: .5;
  filter: alpha(opacity=50);
  display: none;
  visibility: hidden;
  color: var(--background-primary) !important;

}

.border_radius {
  border-radius: 5px !important;
}

.sidebar-dark .nav-item .nav-link {
  color: var(--text-navbar) !important;
}

.sidebar-dark .nav-item .nav-link.hover {
  color: var(--text-navbar-hover) !important;
}

@media (min-width: 360px) and (max-width: 575px) {
  .padding-padre {
    padding-left: 1px !important;
    padding-right: 1px !important;
  }
}

.btn_guardar_size {
  width: 7rem;
  height: 2.4rem;
}

@media (min-width: 360px) and (max-width: 400px) {
  .btn_movil_view_size {
    width: 100%;
  }
}

/* FOR RESPONSIVE SELECT2 */
.select2 {
  width: 100% !important;
}

/* Login */
.bg-login {
  background-color: var(--background-login);
}
.bg-login-card {
  background-color: var(--background-login-card);
}


.btn-login{
  background-color:var(--btn-primary) !important;
  border-color:var(--btn-primary) !important;
  color: #ffffff;
}

.btn-discord{
  background-color:#4752c4 !important;
  border-color:#4752c4 !important;
  color: #ffffff;
}

.input-login {
  background-color: var(--color-input-login) !important;
  color: white !important;
  border : 1px solid #9e9fa7 !important;
}

.input-border {
  border-radius: 10rem !important;
}

input.input-login:-webkit-autofill, 
input.input-login:-webkit-autofill:hover, 
input.input-login:-webkit-autofill:focus, 
input.input-login:-webkit-autofill:active {
  -webkit-background-clip: text;
  box-shadow: 0 0 0px 1000px var(--color-input-login) inset !important;
  -webkit-text-fill-color: #ffffff !important;
  transition: background-color 5000s ease-in-out 0s;
}

/* Botones de Vista personalizados en Calendar/*/
.vista-button {
  flex: 1;
  border-radius: 0px !important;
  text-align: center;
  padding: 0.45rem 0.75rem;
  font-weight: 600;
  font-size: 0.95rem;
  background-color: transparent;
  color: var(--text-title);
  box-shadow: none !important;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
  border-color: var(--btn-secondary);
  white-space: nowrap;
}

/* Botón izquierdo redondeado */
.vista-button:first-of-type {
  border-top-left-radius: 0.35rem !important;
  border-bottom-left-radius: 0.35rem !important;
}

/* Botón derecho redondeado */
.vista-button:last-of-type {
  border-top-right-radius: 0.35rem !important;
  border-bottom-right-radius: 0.35rem !important;
}

/* Borde y color por tipo */
.vista-button.estimado {
  color: var(--hover-cards);
  border: 1px solid var(--hover-cards);
}

.vista-button.logeado {
  color: var(--btn-primary);
  border: 1px solid var(--btn-primary);
  margin-left: -1px;
}

.vista-button.ambos {
  color: var(--btn-secondary);
  border: 1px solid var(--btn-secondary);
  margin-left: -1px;
}

/* Rellenar color al seleccionar */
.btn-check:checked + .vista-button.estimado {
  background-color: var(--hover-cards);
  color: white;
}

.btn-check:checked + .vista-button.logeado {
  background-color: var(--btn-primary);
  color: white;
}

.btn-check:checked + .vista-button.ambos {
  background-color: var(--btn-secondary);
  color: white;
}
/* Quitar borde al hacer clic */
.vista-button:focus {
  outline: none !important;
  box-shadow: none !important;
}


.no-underline {
  text-decoration: none;
}


.historic-button-color {
  color: #abadbe
}


.btn-group .btn-check:checked + .vista-button,
.btn-group .btn-check:not(:checked) + .vista-button {
    cursor: pointer;
}
