:root {
  --color-principal: #009999;
  --color-principal-fosc: rgb(1, 134, 134);
  --color-principal-clar: rgba(4, 122, 124, 0.65);
  --sauquia-gradient: linear-gradient(45deg, rgba(0, 0, 0, 1) 0%, hsl(181deg 94% 20%) 0%, rgba(0, 153, 153, 1) 100%);
  --transicio: 200ms;
}

/* custom scrollbar */
/* width */
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #7fc5c5;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #036163;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* RESPONSIVE THINGS  */
/* ELEMENTOS DEL MENU */

/* Oculta por defecto icono de menu (lo controlamos con media*/
.toggle-icon {
  display: none;
}

#navbar_new {
  padding: 5px 0px;
  margin-bottom: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 0px 0px 10px 10px;
  user-select: none;
}

.menu_usuari_escritorio {
  display: contents;
}

/* Popup modal para mobil, al hacer click en el avatar o nombre del user logueado */
/* Fondo del modal */
.modalPopup {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999;
  font-family: "Roboto";

}

/* Contenido */
.modalPopup_content {
  background: white;
  width: 90%;
  max-width: 320px;
  border-radius: 10px 0px 10px 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
  overflow: hidden;
  animation: fadeIn 0.3s ease;
}

/* Cabecera */
.modalPopup_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: var(--sauquia-gradient);
  padding: 12px 16px;
  border-bottom: 1px solid #ddd;
  cursor: default;
}

.modalPopup_header h2 {
  margin: 0;
  font-weight: 200;
  font-size: 24px;
  margin-left: 10px;
  color: #efefef;
}

.color_icona {

  color: var(--color-principal)
}

/* Cierre */
.close_btn {
  font-size: 20px;
  cursor: pointer;
  color: #efefef;
  transition: color 0.2s;
}

/* Cuerpo */
.modalPopup_body {
  display: flex;
  flex-direction: column;
  padding: 16px;
  gap: 12px;
}

.modalPopup_body a {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: #333;
  font-size: 15px;
  padding: 10px;
  border-radius: 8px;
  transition: background 0.2s;
}

.modalPopup_body a:hover {
  background: #f0f0f0;
}

/* Oculto */
.modalPopup.oculto {
  display: none;
}

/* Animación */
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: scale(0.95);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* Version mobil */

@media (max-width: 767px) {

  /* Ocultamos todo lo que tenga clase escritorio */
  .escritorio {
    display: none !important;
  }

  #mainMenu_login {
    margin: 30px auto !important;
  }

  #avatar_nav {
    display: none !important;
  }

  #layout_new {
    width: 100% !important;
    margin-left: 0px !important;

  }

  #navbar_new {
    border-radius: 0px 0px 0px 0px !important;
    margin-bottom: 0px !important;
  }

  #menu {
    height: auto !important;
  }

  #menu_fons {
    display: none;
  }

  #menu_fons.menu_visible {
    display: block;
  }

  #menu_entorn {
    padding-left: 0px !important;
  }

  #menu_usuari {
    margin-right: 0px !important;
  }

  #menu_elements {
    padding: 15px 10px 25px 15px !important;
  }

  #agrupador_menu_wraper {
    height: calc(100% - 38px) !important;
  }

  #wraper {
    border-radius: 0px 0px 0px 0px !important;
    padding: 0px 0px 20px 0px !important;
  }

  #content {
    padding: 5px 0px 0px 0px !important;
  }

  #contingutHeader {
    flex-direction: column !important;
    align-items: normal !important;
  }

  #menu_fons {
    border-radius: 0px 0px 0px 0px !important;
    width: 100% !important;
    transition: width 0.3s ease, opacity 0.3s ease;
  }

  #titolHeader {
    line-height: 20px !important;
    margin-left: 5px !important;
  }

  a.textTitol {
    font-size: 23px !important;
  }

  #butActions {
    justify-content: flex-end !important;
    padding-top: 10px !important;
    line-height: 40px !important;
  }

  #textEpisodi {
    font-size: 23px !important;
    font-weight: 400;
  }
}

/* Versión escritorio */
@media (min-width: 768px) {

  /* Ocultamos todo lo que tenga clase mobile */
  .movil {
    display: none !important;
  }

  #menu {
    height: auto !important;
  }

  #user_modal {
    display: none !important;
  }
}

/*
COLOURPICKER
*/
#jquery-colour-picker {
  width: 360px;
}

.SumoUnder {
  height: 76%;
}

#colourpickerimg {
  margin-bottom: 12px;
  margin-left: 5px;
}

#np {
  margin-left: 57px;
  width: auto;
  height: auto;
  margin-top: -24px;

}

.icon_helper {
  margin-left: 3px;
  width: auto;
  height: auto;
}

.column_flex {
  display: flex;
}

.ocultar {
  display: none !important;
}

textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
  border-radius: 5px;
}

select:focus {
  border-color: var(--color-principal-fosc);
  outline: 0;
  outline: thin dotted \9;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px var(--color-principal-fosc);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px var(--color-principal-fosc);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px var(--color-principal-fosc);
  border-radius: 5px;
}

button:active {
  outline: none;
  border: none;
}

#alert_hr {
  border-color: #828282;
  margin-top: -6px;
}

#layout_new {
  height: 100%;
  width: calc(100% - 10px);
  margin-left: 5px;
  position: fixed;

}

.layout_sidepanel {
  margin: revert !important;
  width: 100% !important;
  overflow: auto;
}

.layout_popup {
  margin: revert !important;
  width: 100% !important;
  overflow: auto;
}

#alert_title {
  font-weight: 500;
  font-size: large;
}

#alert_img {
  position: absolute;
  display: none;
  height: 64px;
  width: 64px;
  margin-left: -62px;
  margin-top: -66px;
  -webkit-box-shadow: 0px 0px 44px 3px rgb(255, 255, 255);
  -moz-box-shadow: 0px 0px 44px 3px rgb(255, 255, 255);
  box-shadow: 0px 0px 44px 3px rgb(255, 255, 255);
  border-radius: 100px;
}

.hide {
  display: none;
}

/* AQUI CONTROLEM EL MENU */

.full_page {
  height: 100%;
}

/*colapsed*/

.full_page_menu_c .sidebar {
  width: 48px !important;
  transition: var(--transicio);
}

.full_page_menu_c .icona_menu_e_c:before {
  content: "\f105";
}

.full_page_menu_c .icona_menu_e_c {
  margin-top: 1px;
  margin-left: 1px;
}

.full_page_menu_c .fa-submenu {
  padding-right: 0px
}

.full_page_menu_c #alert_num {
  position: relative;
  top: -30px;
  left: 12px;
}

.full_page_menu_c .nom_item {
  display: none;
}

.full_page_menu_c b.caret {
  display: none;
}

.full_page_menu_c .usr_show {
  display: none;
}

.full_page_menu_c .dropdown-menu {
  min-width: fit-content;
  margin-left: -4px;
}

.full_page_menu_c #avatar_nav_small {
  display: initial;
}

.full_page_menu_c .noline {
  display: none;
}

.full_page_menu_c .entorn {
  display: none;
}

.full_page_menu_c .colapse-expand-menu {
  left: 12px;
  transition: var(--transicio);
}

.full_page_menu_c #wraper {
  left: 40px;
  transition: var(--transicio);
}

.full_page_menu_c .usr_show {
  display: none;
}

/* expanded*/

.full_page_menu_e #avatar_nav_small {
  display: none;
}

.full_page_menu_e .fa-submenu {
  padding-right: 4px
}

.full_page_menu_e .sidebar {
  transition: var(--transicio);
}

.full_page_menu_e .icona_menu_e_c {
  margin-top: 1px;
  margin-left: -1px;
}

.full_page_menu_e .colapse-expand-menu {
  left: 183px;
}

.full_page_menu_e .icona_menu_e_c:before {
  content: "\f104";
  transition: var(--transicio);
}

.full_page_menu_e .sidebar {
  width: 215px;
  transition: var(--transicio);
}

.full_page_menu_e #wraper {
  left: 215px;
  transition: var(--transicio);
}

/* expanded hover */

.full_page_menu_eh .fa-submenu {
  padding-right: 4px
}

.full_page_menu_eh #avatar_nav_small {
  display: none;
  transition: var(--transicio);
}

.full_page_menu_eh .icona_menu_e_c:before {
  content: "\f105";
  transition: var(--transicio);
}

.full_page_menu_eh .icona_menu_e_c {
  margin-top: 1px;
  margin-left: 1px;
}

.full_page_menu_eh .colapse-expand-menu {
  left: 12px;
  transition: var(--transicio);
}

.full_page_menu_eh .sidebar {
  width: 215px;
  transition: var(--transicio);
}

.full_page_menu_eh #wraper {
  left: 215px;
  transition: var(--transicio);
}

/* fi control menu */

.c-e-menu {
  position: absolute;
  top: 8px;
  background: var(--menu-high);
  text-align: center;
  width: 23px;
  height: 23px;
  border-radius: 35px;
}

#v_d {
  background-color: #01969642;
  color: #005151;
  text-align: center;
  border-radius: 45px;
  padding: 10px 10px;
  display: inline-table;
  width: 40px;
  margin-right: 10px;
}

#v_u {
  background-color: #cf464642;
  color: #cf4646;
  text-align: center;
  border-radius: 45px;
  padding: 10px 10px;
  display: inline-table;
  width: 40px;
  margin-right: 10px;
}

#v_t {
  background-color: #0f4ed542;
  color: #0f4ed5;
  text-align: center;
  border-radius: 45px;
  padding: 10px 10px;
  display: inline-table;
  width: 40px;
  margin-right: 10px;
}

#text_v {
  font-size: 1.1rem;
  margin-right: 22px;
}

#imatge_usuari {
  width: 50px;
  border-radius: 150px;
}

#id_e_c {
  color: white;
}

.color_blanc {
  color: white;
}

.color_black {
  color: #717171;
}

button:focus {
  outline: 0;
}

.tab-content {
  overflow: inherit;
}

.btn:active {
  outline: none;
  border: none;
}

.btn:focus {
  outline: 0;
}

/* EASY PIE CHART */

#missatgeErrorFiltre {
  margin-top: 12px;
  margin-bottom: -6px;
  text-align: center;
}

.btn_filtre {
  border-color: transparent;
  cursor: pointer;
  margin-top: -10px;
  background: white;
}

#nodata {
  text-align: center;
  font-size: x-large;
  font-weight: 300;
  /*    margin-top: 43px;*/
  padding: 30px 0px 40px 0px;
  background: #f3f3f3;
  border-radius: 9px;
}

.filter_title_dates {
  color: gray;
  font-size: smaller;
}

.chart {
  position: relative;
  display: inline-block;
  width: 150px;
  height: 150px;
  margin-top: 50px;
  margin-bottom: 50px;
  text-align: center;
  margin-right: 22px;
  font-weight: bold;
}

.chart canvas {
  position: absolute;
  top: 0;
  left: 0;
}

.percent {
  display: inline-block;
  line-height: 160px;
  z-index: 2;
}

.percent:after {
  content: '%';
  margin-left: 0.1em;
  font-size: .8em;
}

/* FREEOW TEXTS */

#free_blau {
  font-weight: 400;
  color: rgb(87, 148, 218);
  font-size: 17px;
  line-height: 16px;
}

#blau {
  font-weight: 400;
  color: rgb(87, 148, 218);
  font-size: 17px;
  line-height: 16px;
}

#error {
  font-weight: 400;
  color: #F44336;
  font-size: 17px;
  line-height: 16px;
}

#bullet {
  margin-left: 51px;
}

.error_mr {
  background-color: #fbdbdb !important;
}

#timesheet_img {
  width: 100%;

}

#timesheet_p {
  border-radius: 0px 0px 0px 0px;
  width: 39px;
  text-align: right;
  padding-right: 10px;
  font-weight: normal;
  font-size: 18px;
  position: absolute;
  top: 9px;
}

#timesheet_p_m {
  border-radius: 0px 0px 0px 0px;
  width: 39px;
  text-align: right;
  padding-right: 10px;
  font-weight: normal;
  font-size: 18px;
  position: absolute;
  top: 9px;
}

#text_dia_o {
  position: absolute;
  top: 32px;
  padding: 20px 7px 13px 10px;
  width: 400px;
  -webkit-filter: blur(60px);
  filter: blur(60px);
}

#text_dia {
  position: absolute;
  top: 32px;
  padding: 20px 7px 13px 10px;
  width: 544px;
  background-color: rgba(255, 255, 255, 0.55);
}

#text_dia_dialog {
  position: absolute;
  top: 32px;
  padding: 20px 7px 13px 10px;
  width: 400px;
  max-height: 82px;
  background-color: rgba(255, 255, 255, 0.55);
}

#timesheet_p_d {

  line-height: 28px;
  padding-right: 10px;
  padding-left: 10px;
  color: rgb(66, 60, 60);
  font-weight: 300;
  font-size: 24px;
  top: 29px;
  text-align: left;
}

#timesheet_p_d_titol {

  padding-left: 10px;
  color: rgb(53, 51, 51);
  font-weight: 300;
  font-size: 20px;
  width: 520px;
  margin-top: 21px;
  text-align: left;
  line-height: 30px;
}

#free_strong {
  font-weight: 400;
  font-size: 16px;
  line-height: 16px;
}

/* BARRA NAVEGACIO */

#avatar_nav {
  width: 120px;
  margin-top: -7px;
  margin-bottom: 7px;
  border-radius: 100px;
  box-shadow: 0px 0px 8px rgb(0 0 0 / 53%);

}

#avatar_nav_small {
  width: 40px;
  margin-top: 40px;
  margin-left: -9px;
  border-radius: 50px;
  margin-bottom: 10px;
  box-shadow: 0px 0px 8px rgb(0 0 0 / 53%);
}

#idioma {
  border-radius: 20px;
  margin-top: -2px;
  margin-right: 2px;
}

.entorn {
  display: block;
  text-decoration: none;
  text-align: center;
  padding: 10px 20px 10px;
  font-size: 20px;
  font-weight: 400;
  color: #ffffff;
  text-shadow: 0 0px 0 rgb(255 255 255 / 0%);
  cursor: default;
}

/* ESTATS DE VALIDACIÓ VISUAL */

/* Error Crític (Vermell) */
.field-error select,
.field-error .SumoSelect>.CaptionCont {
  border: 1px solid #ff00004d !important;
  background: #ffdada !important;
  border-radius: 5px;
}

/* Pendent/Informatiu (Blau) */
.field-warning select,
.field-warning .SumoSelect>.CaptionCont {
  border: 1px solid #31708f4d !important;
  background: #d9edf7 !important;
  border-radius: 5px;
}

/* Loader Overlay */
#custom-blocking-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 1);
  z-index: 9999;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* Forcem que els camps de data de control no es vegin mai */
#field_cont_data_i,
#field_cont_data_f {
  display: none !important;
}

/* Millora visual per a la injecció del període al label */
.info-fechas-calculadas {
  font-weight: normal !important;
  color: #888 !important;
  font-size: 0.9em;
  margin-left: 8px;
}

.msg-no-results {
  color: #a94442;
  background: #f2dede;
  padding: 12px;
  border-radius: 4px;
  margin: 10px 0;
  font-size: 13px;
  /* Un poco más grande para legibilidad */
  border: 1px solid #ebccd1;
  max-width: 235px;

  /* Nueva lógica de posición */
  display: flex;
  flex-direction: column;
  /* Texto arriba, botón abajo */
  gap: 5px;
  /* Espacio entre el texto y el botón */

  /* Alinea el botón a la derecha */
}

/* FONTS */

/*@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-Regular-webfont.eot');
    src: url('fonts/roboto/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-Regular-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-Regular-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-Regular-webfont.svg#RobotoRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-Italic-webfont.eot');
    src: url('fonts/roboto/Roboto-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-Italic-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-Italic-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-Italic-webfont.svg#RobotoItalic') format('svg');
    font-weight: normal;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-Bold-webfont.eot');
    src: url('fonts/roboto/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-Bold-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-Bold-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-Bold-webfont.svg#RobotoBold') format('svg');
    font-weight: bold;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-BoldItalic-webfont.eot');
    src: url('fonts/roboto/Roboto-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-BoldItalic-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-BoldItalic-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-BoldItalic-webfont.svg#RobotoBoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-Thin-webfont.eot');
    src: url('fonts/roboto/Roboto-Thin-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-Thin-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-Thin-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-Thin-webfont.svg#RobotoThin') format('svg');
    font-weight: 200;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-ThinItalic-webfont.eot');
    src: url('fonts/roboto/Roboto-ThinItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-ThinItalic-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-ThinItalic-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-ThinItalic-webfont.svg#RobotoThinItalic') format('svg'); (under the Apache Software License). 
    font-weight: 200;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto Light';
    src: url('fonts/roboto/Roboto-Light-webfont.eot');
    src: url('fonts/roboto/Roboto-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-Light-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-Light-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-Light-webfont.svg#RobotoLight') format('svg');
    font-weight: 100;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-LightItalic-webfont.eot');
    src: url('fonts/roboto/Roboto-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-LightItalic-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-LightItalic-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-LightItalic-webfont.svg#RobotoLightItalic') format('svg');
    font-weight: 100;
    font-style: italic;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-Medium-webfont.eot');
    src: url('fonts/roboto/Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-Medium-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-Medium-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-Medium-webfont.svg#RobotoMedium') format('svg');
    font-weight: 300;
    font-style: normal;
}
 
@font-face {
    font-family: 'Roboto';
    src: url('fonts/roboto/Roboto-MediumItalic-webfont.eot');
    src: url('fonts/roboto/Roboto-MediumItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/roboto/Roboto-MediumItalic-webfont.woff') format('woff'),
         url('fonts/roboto/Roboto-MediumItalic-webfont.ttf') format('truetype'),
         url('fonts/roboto/Roboto-MediumItalic-webfont.svg#RobotoMediumItalic') format('svg');
    font-weight: 300;
    font-style: italic;
}*/

/***************
     Informe
***************/
#imatge_informe {
  float: left;
  height: 62px;
  width: 62px;
  margin-top: -2px;
}

#filtre_informe {
  float: right;
  height: 64px;
  margin-right: 14px;
  margin-top: -8px;
  border-radius: 100px;
}

#titol_informe {
  color: #000000;
  font-size: 35px;
  font-weight: initial;
  margin-top: 19px;
}

#subtitol_informe {
  color: #475D8C;
  font-size: 21px;
  font-weight: 300;
  font-style: italic;
  float: left;
}

#titol_contingut {
  color: #494848;
  font-size: 22px;
  font-weight: 400;
  float: left;
  margin-right: 19px;
}

.extra_filtre {
  font-size: 14px;
  font-style: italic;
}

.round_100 {
  border-radius: 100px;
}

#label_content {
  margin-top: 28px;
}

label {
  width: max-content;
  /* display: flex; */
  /* ANGEL - es treu degut a que dona problemes en els popups i checkboxes */
}

#contenidor {
  padding-left: 47px;
}

#contenidor_separador {
  margin-top: -3px;
  margin-left: 31px;
  clear: both;
}

#info_label_contingut {
  height: 24px;
  float: left;
  margin-right: 6px;
  margin-top: -3px;
}

#filtres_grafic {
  height: 24px;
  float: right;
  margin-top: -30px;
}

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

#input_div_checkbox {
  margin-left: 21px;
  margin-top: 6px;
  margin-bottom: 6px;
  min-width: 110px;
}

#label_switch {
  color: rgb(76, 76, 76);
}

.switch,
.switch * {
  -webkit-user-select: none;
  -moz-user-select: none;
  -khtml-user-select: none;
  -ms-user-select: none;
}

.switch label {
  cursor: pointer;
}

.switch label input[type=checkbox] {
  opacity: 0;
  display: none;
  width: 0;
  height: 0;
}





.switch label .lever {
  content: "";
  display: inline-block;
  position: relative;
  width: 40px;
  height: 15px;
  background-color: #818181;
  border-radius: 15px;
  margin-right: 10px;
  transition: background 0.3s ease;
  vertical-align: middle;
  margin: 0 16px;
}

.switch label .lever:after {
  content: "";
  position: absolute;
  display: inline-block;
  width: 21px;
  height: 21px;
  background-color: #F1F1F1;
  border-radius: 21px;
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4);
  left: -5px;
  top: -3px;
  transition: left 0.3s ease, background 0.3s ease, box-shadow 0.1s ease;
}

input[type=checkbox]:checked:not(:disabled)~.lever:active:after {
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(38, 166, 154, 0.1);
}

input[type=checkbox]:not(:disabled)~.lever:active:after {
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.08);
}

.switch label input[type=checkbox]:checked+.lever:after {
  left: 24px;
}

.switch input[type=checkbox][disabled]+.lever {
  cursor: default;
}

.switch label input[type=checkbox][disabled]+.lever:after,
.switch label input[type=checkbox][disabled]:checked+.lever:after {
  background-color: #BDBDBD;
}

form {
  margin: 0 0 50px !important;
}

/*
BOTONS DEL HEADER
*/

.fileupload-buttonbar {
  width: 200px;
}

.fileinput-button {
  clear: both;
  margin-top: 1px;
  margin-right: -8px;
}

.centrat {
  vertical-align: -webkit-baseline-middle;
}

#excel {
  margin-right: 4px;
}

#T {
  padding: 4px 15px 4px 15px;
}

#T:hover {
  padding: 4px 15px 4px 15px;
  background-color: #009688;
}

#T:hover>abbr>.noLink2 {
  color: white !important;
}

#T:hover>abbr>a>button .noLink2 {
  color: white !important;
}

#T:hover>abbr>a>button>i {
  color: white !important;
}

.override_width {
  width: auto !important;
}

.agr_icon {
  width: 43px;
}

.text_boto {
  height: 100%;
  display: inline-block;
  vertical-align: middle;
  margin-top: -6px;
}

.text_boto_a {
  margin-left: 3px;
}

.text_boto_gd {
  margin-left: 0px !important;
}

.text_boto_disabled {
  color: #e2e2e4;
}

#accions {
  text-align: left;
}

#noLink2 {
  color: rgb(7, 50, 105);
  ;
  text-decoration: none;
}

.link_error {
  background-color: #f3a9a8;
  color: #750402 !important;
  padding: 7px 20px;
  border-radius: 30px;
  margin: 67px;
}

#botoFileUpload {
  border: 0px;
  margin-right: 5px;

  cursor: pointer;
}

#my-tab-content {
  margin-top: -30px;
}

#wraper {

  /* padding: 0px 30px 20px 30px; */
  border-radius: 0px 10px 10px 0px;
  margin: 0 auto;
  padding: 0px 10px 20px 10px;
  /*	right: 0;
	left: 0;
  top: 0;*/
  background-color: #ffffff;
  /*    position: absolute;
    left: 200px;*/
  /*position: fixed;
	z-index:1;*/
}

#menu {
  margin: 0 auto;
  height: 100% !important;
  background-image: linear-gradient(to bottom, #1B2A50, #000000);
  background-repeat: repeat-x;
  border-color: #02003C;
}

#menu_container {
  height: 100% !important;
}

.menu-items {
  height: calc(100% - 13.7rem);
  overflow-y: auto;
  overflow-x: hidden;
  position: relative;
  left: 0px;
  float: left;
  width: inherit;
}

#salt {
  clear: both;
}

#legend {
  width: initial;
  margin-bottom: -3px;
  font-size: 13px;
  border-radius: 5px;
  border: 0;
  padding-right: 10px;
  padding-left: 8px;
}

#O {
  display: none;
}

.agrupador {
  padding: 5px 10px 5px 10px;
  border: solid 1px #CED4E2;
  background-color: rgba(206, 212, 226, 0.21);
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  float: left;
  margin: 5px;
}

.titol_agr {
  font-size: 12px;
  color: tomato;
  font-weight: 300;
}

#agrupadorDUMMY {
  padding: 5px 10px 5px 10px;
  border: solid 1px #CED4E2;
  background-color: rgba(206, 212, 226, 0.21);
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  margin: 25px 5px 5px 5px;
}

#field {
  border: solid 1px rgba(0, 69, 104, 0);
  background-color: rgba(0, 69, 104, 0);
  float: left;
  margin: 0px 5px 0px 5px;
}

#F11,
#F12,
#F13,
#F14,
#F21,
#F22,
#F23,
#F24,
#F31,
#F32,
#F33,
#F34,
#F41,
#F42,
#F43,
#F44 {
  padding: 5px 10px 5px 10px;
  border: solid 1px #CED4E2;
  background-color: rgba(206, 212, 226, 0.21);
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  float: left;
  margin: 5px;
}

#infoIcon {
  margin-left: 7px;
  color: #5b656773;
}

.label_en_linea_camp {
  float: left;
  width: 200px;
  margin-top: 5px;
  /*    margin-left: 15px;*/
}

.label_ocult_camp {
  display: none;
}

#icona {
  margin-left: -10px;
  margin-top: 3px;
  margin-right: 4px;
}

#label {
  margin-top: 5px;
  width: 150px;
  float: left;
}

#labelAmpliat {
  margin-top: 5px;
}

#labelE {
  margin-top: 5px;
  width: 90px;
  float: left;
}

#datepi {
  text-align: center;
}

#formDeleteDialog {
  margin-top: 20px;
  width: 800px;
}

#layout_delete {
  display: inline-flex;
  padding: 30px;
  margin-left: 15px;
  width: 600px;
}

#text_delete {
  margin-left: 17px;
  font-size: 22px;
  font-weight: 300;
  float: left;
  line-height: 32px;
}

.alertes {
  position: fixed;
  left: 90px;
  bottom: 73px;
  cursor: pointer;
  z-index: 9999;
}

.alerta_level_low {
  width: 14px;
  height: 14px;
  background: #1a9223;
  border-radius: 20px;
  position: relative;
  display: inline-table;
  top: 2px;
  left: -10px;
}

.alerta_level_medium {
  background: #ffa500;
  width: 14px;
  height: 14px;
  border-radius: 20px;
  position: relative;
  top: 2px;
  display: inline-table;
  left: -10px;
}

.alerta_level_high {
  background: #ff0018;
  width: 14px;
  height: 14px;
  border-radius: 20px;
  position: relative;
  top: 2px;
  display: inline-table;
  left: -10px;
}

.alerta_separador {
  margin: 10px 0px;
  width: 300px;
  margin-left: -25px;
}

.no_pointer {
  cursor: default;
}

.link_id {
  cursor: pointer;
}

#alert_popup {
  background-color: white;
  z-index: 999999;
  border-radius: 5px;
  position: fixed;
  width: 300px;
  margin-top: 16px;
  padding-bottom: 10px;
  -webkit-box-shadow: 3px 3px 15px -2px rgb(143 143 143);
  -moz-box-shadow: 3px 3px 15px -2px rgba(143, 143, 143, 1);
  box-shadow: 3px 3px 15px -2px rgb(2 2 2);
}

#alert_list {
  list-style: none;
  margin-top: 10px;
  color: #00000099;
  font-size: 14px;
}

#alerta_img {
  color: white;
}

#alert_num {
  background: #dc0505;
  position: relative;
  width: 19px;
  height: 16px;
  border-radius: 34px;
  font-size: 12px;
  color: white;
  top: -7px;
  left: -11px;
  text-align: center;
  padding-top: 2px;
  line-height: normal;
}

#iniepi {
  width: 90px;
  float: left;
  margin-right: 12px;
}

#iniepiDiv {
  float: left;
}

#ordact {
  width: 19px;
}

#ordmat {
  width: 19px;
}

#obsact {
  width: 291px;
  height: 85px;
  resize: none;
}

#finepi {
  width: 90px;
}

#finepiDiv {
  float: right;
}

#eventContent {
  overflow: hidden;
  display: flex;
  flex-direction: row;
}

#calendarButton,
#calendarButtonAdmisio {
  width: 122px;
  text-align: left;
  margin: 5px;
}

#tooltip {
  width: inherit;
  margin-top: 6px;
  margin-bottom: 7px;
}

.calendar_text_header {
  color: #525252;
  text-align: left;
  margin-left: 5px;
}

.calendar_text_info {
  color: white;
  text-align: left;
  margin-left: 5px;
}

#img_day_mode {
  height: 16px;
  margin-bottom: 3px;
  margin-right: 6px;
}

#calendar {
  box-shadow: none;
  padding-top: 10px;
}

#eventInfo {
  font-size: 15px;
  margin-top: 15px;
  padding-right: 76px;
  border-right: 4px dotted var(--color-principal);
  background-color: var(--color-principal);
  margin: -39px 30px -7px -13px;
  padding: 51px;
  height: 213px;
  color: white;
  border-radius: 0px 0px 0px 5px;
}

#eventLinks {
  display: flex;
  flex-wrap: nowrap;
  flex-direction: column;
  max-width: 588px;
}

.cal_link {
  text-decoration: none !important;
}

.cal_link:focus {
  text-decoration: none;
  outline: 0px;
}

#dadesRegistre {
  width: 100%;
  margin-top: 20px;
}

#dadesPacient1 {
  width: 390px;
  padding: 5px;
  float: left;
}

#dadesPacient2 {
  width: 370px;
  padding: 5px 5px 5px 25px;
}

#dadesEpisodi1 {
  width: 330px;
  padding: 5px;
  float: left;
}

#dadesEpisodi2 {
  width: 310px;
  height: 143px;
  padding: 5px 5px 5px 25px;
}

#dadesInterv1 {
  float: left;
  margin-right: 30px;
}

#dadesMesMat1,
#dadesMesAct1 {
  float: left;
}

#dadesActuacio {
  width: 275px;
  padding: 5px;
  float: left;
}

#dadesActuacio11 {
  float: left;
  margin-right: 13px;
}

#dadesMaterial1 {
  margin-right: 15px;
  float: left;
}

#dadesMaterial2 {
  float: left;
  margin-left: 55px;
}

#dadesActuacio2 {
  margin-left: 51px;
}

#dadesObservacions {
  width: 310px;
  height: 143px;
  padding: 5px 5px 5px 25px;
}

#textPacient1 {
  width: 390px;
  padding: 5px;
  float: left;
}

#textPacient2 {
  width: 370px;
  padding: 5px 5px 5px 25px;
}

#textPacient3 {
  width: 375px;
  padding-left: 25px;
  float: left;
}

#fons {
  height: 100% !important;
  /*width: 1230px;*/
  background-color: #ffffff;
  /*	margin: 0 auto;*/
  margin: 0px !important;
  z-index: 9 !important;
  -moz-box-shadow: 1px 1px 172px #dbdbdb;
  -webkit-box-shadow: 1px 1px 172px #dbdbdb;
  box-shadow: none !important;
}

#mainMenu {
  width: 215px;
  z-index: 100;
  box-shadow: 0px 0px 17px 3px rgba(51, 51, 51, 0.73);
  background: var(--sauquia-gradient);

}

#mainMenu_login {

  width: max-content;
  padding: 20px 36px;
  margin: 20px;
  border-radius: 71px;
  height: 62px;
  z-index: 100;
  background: var(--sauquia-gradient);
  background-image: linear-gradient(to bottom, #1B2A50, #000000);
  background-repeat: repeat-x;
  border-color: #02003C;
}

#content {
  /*padding-top: 10px;	Separació del Menu i el Contingut*/
  width: 100%;
  min-width: 30%;
  /*      overflow-x: scroll;*/
}

#iniInforme {
  background-color: rgba(78, 114, 148, 0.18);
}

#finInforme {
  background-color: rgba(78, 114, 148, 0.37);
}

body {
  height: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  font-family: 'Roboto';
  overflow: hidden;
}

html {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
}

#footer {
  text-align: center;
  background: black;
  box-shadow: 0px 0px 17px 3px rgba(51, 51, 51, 0.73);
  position: fixed;
  color: #bbbbbb;
}

#footer_text {
  margin-top: 10px;
}

#radiobutton {
  padding-left: 10px;
  padding-bottom: 12px;
}

#stockmat,
#stockmatFind,
#deftip,
#actppal {
  text-align: center;
  vertical-align: text-top;
  margin-top: 3px;
  width: 79px;
  float: right;
}

#actppalc {
  margin-top: 3px;
  width: 250px;
}

#colact {
  width: 45px;
  margin-left: 155px;
}

#stock,
#stockCompra,
#stockmin,
#stockBuy,
#stockRecompte,
#stockNew,
#stockFind,
#stockminFind {
  text-align: center;
  vertical-align: text-top;
  margin-top: 3px;
  width: 65px;
  float: right;
}

#noData {
  text-align: center;
}

.petit {
  width: 26px;
}

#botonera {
  width: 189px;
  float: right;
  height: 55px;
  padding-top: 19px;
}

#botonerafitxers {
  width: 189px;
  float: right;
  height: 55px;
  padding-top: 19px;
}

#loginError {
  margin-right: 20px;
  margin-top: 20px;
  width: 100%;
  margin-bottom: 10px;
}


.errorMSG {
  text-align: center;
  margin-bottom: 0px;
}

.descripcio_fact {
  width: 42%;
}

#missatgeErrorExtra {
  text-align: center;
}

#missatgeErrorDel {
  text-align: center;
}

#msgErrorFieldset {
  clear: both;
}

#msgErrorFieldsetExtra {
  clear: both;

}

#btnLogin {
  margin-top: 25px;
}

.field_changed {
  animation: color-change 2s;
}

@keyframes color-change {
  0% {
    background-color: #ff000000;
  }

  50% {
    background-color: #ff000047;
  }

  60% {
    background-color: #ff000000;
  }

  70% {
    background-color: #ff000047;
  }

  100% {
    background-color: #ff000000;
  }
}


#formLogin {
  max-width: 320px;
  width: 90%;
  padding: 40px 30px;
  background: rgb(255 255 255);
  border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 22px;
  margin: 40px auto !important;
  -webkit-box-shadow: 7px 11px 39px -18px rgb(0 0 0);
  -moz-box-shadow: 7px 11px 39px -18px rgb(0 0 0);
  box-shadow: 7px 11px 39px -18px rgb(0 0 0);
}

.ui-widget-content {
  overflow: visible !important;
}

#detall {
  margin-left: 20px;
  font-weight: 300;
}

#detall2 {
  margin-left: 20px;
  color: chartreuse;
  font-weight: 300;
}

#detall_ko {
  margin-left: 20px;
  color: #ff00c6;
  font-weight: 400;
}

#detall_ko_nomargin {
  color: #ff3232;
  font-weight: 400;
}

#detall_ok {
  margin-left: 20px;
  color: chartreuse;
  font-weight: 300;
}

#detall_ok_nomargin {
  color: chartreuse;
  font-weight: 300;
}

#titol {
  float: left;
  height: 110px;
}

#resetFiltre {
  position: relative;
  left: -20px;
  top: -10px;
  cursor: pointer;
}

.resetFiltre_no_results {
  position: unset !important;
  background-color: #ff20465c;
  color: white;
  width: 236px;
  margin: auto;
  margin-top: 22px;
  border-radius: 50px;
  padding-top: 8px;
  padding-bottom: 8px;
}

#resetOrdenar {
  position: relative;
  left: -20px;
  top: -10px;
  cursor: pointer;
}

.easy_ordenar {
  cursor: pointer;
}

#div_f {
  border-bottom: 0;
  width: 41px;
  display: flex;
  align-items: center;
}

#progressbar {
  margin-top: 13px;
  margin-left: -484%;
}

#antpac {
  width: 356px;
  height: 90px;
  resize: none;
}

#actuacio {
  text-align: center;
  width: 290px;
}

#alepac {
  width: 356px;
  height: 20px;
  resize: none;
}

#observ {
  width: 356px;
  height: 80px;
  resize: none;
}

#obsint {
  width: 270px;
  height: 90px;
  resize: none;
}

#codmat,
#codmatCompra,
#codmatRecompte,
#codmatFind,
#codtip {
  width: 70%;
  text-align: center;
}

#nommat,
#nommatCompra,
#nommatRecompte,
#nommatFind,
#nomtip {
  width: 360px;
}

#matText {
  float: left;
  margin-top: 7px;
}

#compac {
  width: 356px;
  height: 80px;
  resize: none;
}

#textprogressbar {
  margin-left: -275%;
  margin-top: -40px;
}

#noResults {
  text-align: center;
}

#centrat {
  text-align: center;
}

.centrat {
  text-align: center;
}

#datepickerdummy {
  visibility: hidden;
}

/*
	DEFINIM ELS ESTILS DELS ESTATS DELS EPISODIS, pe.
*/

#color {
  text-align: center;
  border-radius: 30px;
  height: 30px;
  width: 30px;
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.43);
}

#P {

  text-align: center;
  border: solid 1px rgba(172, 192, 218, 1);
  color: rgba(41, 92, 158, 1);
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  background-color: rgba(146, 175, 206, 0.15);
}

#C {
  text-align: center;
  border: solid 1px rgba(238, 211, 71, 1);
  color: rgba(121, 116, 13, 1);
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  background-color: rgba(255, 226, 16, 0.2);
}

#R {
  text-align: center;
  border: solid 1px rgba(182, 206, 168, 1);
  color: rgba(46, 116, 7, 1);
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  background-color: rgba(100, 151, 34, 0.15);
}

#A {
  text-align: center;
  border: solid 1px rgba(223, 175, 175, 1);
  color: rgba(168, 64, 64, 1);
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  background-color: rgba(219, 105, 105, 0.15);
}

.color_estat {
  height: 10px;
  width: 10px;
  position: relative;
  top: 17px;
}

.color_estat_d {
  height: 10px;
  width: 10px;
  float: left;
  margin: 5px 10px 0px 0px;
}

.estat_titol {
  position: relative;
  top: 2px;
  left: 20px;
}

.estat_titol_d {
  float: left;
}

.icon_prioritat {
  height: 17px;
  width: 17px;
  border-radius: 20px;
  border: 1px solid white;
  vertical-align: middle;
}

.observacions_pat {
  font-size: 18px;
  font-weight: 300;
  color: #cdd1d1;
  font-style: italic;
  position: absolute;
}

.image_obs {
  width: 17px;
  height: 17px;
  border: 1px solid white;
  vertical-align: middle;
  border-radius: 20px;
}

.zoom-in-zoom-out {
  animation: zoom-in-zoom-out 2s ease-out;
  overflow: visible;
}

@keyframes zoom-in-zoom-out {
  0% {
    transform: translateX(0)
  }

  25% {
    transform: translateX(5px)
  }

  50% {
    transform: translateX(-5px)
  }

  75% {
    transform: translateX(5px)
  }

  100% {
    transform: translateX(0)
  }
}

.ui-dialog .ui-dialog-title {
  line-height: initial;
}

#PW {
  background-color: #FFD100;
}

#OW {
  background-color: #69696b;
}

#CW {
  background-color: #5240FB;
}

#RW {
  background-color: #56AD56;
}

#AW,
#NW {
  background-color: #B71010;
}

#PWT {
  text-align: center;
  border: solid 1px rgba(22, 107, 218, 1);
  color: rgba(255, 255, 255, 1);
  border-radius: 11px;
  background-color: rgba(79, 131, 209, 1);
  width: 115px;
  margin-right: -3px;
  border-top-left-radius: 190px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 67px;
  border-bottom-left-radius: 44px;
  box-shadow: 0px 0px 16px #000000;
}

#CWT {
  text-align: center;
  border: solid 1px rgba(212, 179, 8, 1);
  color: rgba(65, 65, 65, 1);
  border-radius: 11px;
  background-color: rgba(250, 223, 28, 1);
  width: 115px;
  margin-right: -3px;
  border-top-left-radius: 190px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 67px;
  border-bottom-left-radius: 44px;
  box-shadow: 0px 0px 16px #000000;
}

#RWT {
  text-align: center;
  border: solid 1px rgba(70, 111, 46, 1);
  color: rgba(255, 255, 255, 1);
  border-radius: 11px;
  background-color: rgba(100, 151, 34, 1);
  width: 115px;
  margin-right: -3px;
  border-top-left-radius: 190px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 67px;
  border-bottom-left-radius: 44px;
  box-shadow: 0px 0px 16px #000000;
}

#AWT {
  text-align: center;
  border: solid 1px rgba(202, 24, 24, 1);
  color: rgba(255, 255, 255, 1);
  border-radius: 11px;
  background-color: rgba(219, 105, 105, 1);
  width: 115px;
  margin-right: -3px;
  border-top-left-radius: 190px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 67px;
  border-bottom-left-radius: 44px;
  box-shadow: 0px 0px 16px #000000;
}

#PWTS {
  margin-left: -1px;
  background-color: rgba(79, 131, 209, 1);
  width: 7px;
  height: 1003px;
}

#CWTS {
  margin-left: -1px;
  background-color: rgba(250, 223, 28, 1);
  width: 7px;
  height: 1003px;
}

#RWTS {
  margin-left: -1px;
  background-color: rgba(100, 151, 34, 1);
  width: 7px;
  height: 1003px;
}

#AWTS {
  margin-left: -1px;
  background-color: rgba(219, 105, 105, 1);
  width: 7px;
  height: 1003px;
}

#Pendent {
  text-align: center;
  border: solid 1px rgba(172, 192, 218, 1);
  color: rgba(41, 92, 158, 1);
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  background-color: rgba(146, 175, 206, 0.15);
}

#Realitzada {
  text-align: center;
  border: solid 1px rgba(182, 206, 168, 1);
  color: rgba(46, 116, 7, 1);
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  background-color: rgba(100, 151, 34, 0.15);
}

#Anulada {
  text-align: center;
  border: solid 1px rgba(223, 175, 175, 1);
  color: rgba(168, 64, 64, 1);
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  border-radius: 11px;
  background-color: rgba(219, 105, 105, 0.15);
}

.table th,
.table td {
  vertical-align: middle;
}

#agrupador_menu_wraper {
  height: calc(100% - 50px);
}

// GTI Time

#paleta_table {
  width: 100%;
  height: 900px;
  background-color: rgba(176, 169, 255, 0.16);
  border-left: rgb(90, 90, 158);
  border-left-width: 6px;
  border-left-style: solid;
}

#TE_td1 {
  color: rgb(71, 69, 98);
  font-weight: initial;
  font-size: 16px;
}

#TEM_td1 {
  color: rgb(71, 69, 98);
  font-weight: initial;
  font-size: 16px;
  height: 17px;
  word-wrap: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  margin-left: 5px;
}

#TE_td2 {
  background: white;
  color: black;
  text-align: center;
}

#TE_p_td2 {
  position: absolute;
  top: 64px;
  left: 61px;
}

#td1 {
  width: 140px;
  color: black;
  text-align: center;
}

#td2 {
  width: 290px;
  color: black;
}

#td1w {
  width: 13px;
  color: black;
}

#td2w {
  width: 200px;
  color: black;
}

#td3 {
  width: 210px;
  color: black;
}

#td4 {
  width: 290px;
  color: black;
}

#td5 {}

#marge {
  position: absolute;
}

#marge2 {
  margin-left: 83px;
  display: inline-block;
}

#linia {
  float: left;
  border-right: 1px ridge rgba(157, 148, 255, 0.15);
  height: 159px;
  width: 0;
  margin-right: 34px;
  -moz-box-shadow: 2px 3px 16px #000000;
  -webkit-box-shadow: 0px 1px -4px #000000;
  box-shadow: 1px 3px 2px rgba(0, 106, 221, 0.13);
}

/*
	AQUI DEFINIM ELS ESTILS DE LES COLUMNES
*/
#HC {
  text-align: center;
  width: 15%;
}

#ordre {
  text-align: center;
  width: 8%;
}

#confirmat {
  text-align: center;
  width: 40px;
}

.ordmat {
  text-align: center;
  width: 25px;
}

#estat_small {
  text-align: center;
  width: 12%;
}

#doctor {
  width: 20%;
}

#matcss {
  vertical-align: middle;
}

#chckbox {
  padding-top: 15px;
}

#cita {
  text-align: center;
  width: 180px;
}

#estat {
  width: 100px;
  text-align: center;
  padding-right: 75px;
}

#accio1 {
  text-align: center;

}

#col {
  width: 1px;
}

#accio2 {
  text-align: center;
  width: 10%;
}

#accio2Doc {
  text-align: right;
  width: 112px;
  padding-left: 25px;
}

#accio3 {
  text-align: center;
  width: 12%;
}

#accio4 {
  text-align: center;
  width: 18%;
}



#idabbr {
  border-bottom: 0;
}

#gestioRegistres {
  z-index: 1;
  /*border: 10px solid rgba(0,0,0,0.20);
  background: red;*/
}

#icona_boto {
  margin-top: 7px;
}

.icon_white {
  color: #009688 !important;
  margin-right: 8px;
  float: right;
}

.table-hover tbody tr:hover td,
.table-hover tbody tr:hover th {
  background-color: #00968826 !important;
}

#llistat {
  z-index: 2;
}

#llistat .centerBTN {
  text-align: center;
  min-width: 120px;
  max-width: 355px;
  width: auto;
}

#llistat .centrat_200 {
  text-align: center;
  display: block;
  width: 200px;
}

#llistat .centrat {
  text-align: center;
  min-width: 120px;
  max-width: 200px;
  width: 15%;
}

#llistat .ample_25p {

  width: 25%;
}

#llistat .centrat_min {
  text-align: center;
  min-width: 85px;
}

.centrat_magic {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: center;
}

#llistat .centrat_50 {
  text-align: center;
  width: 50px;
}

#llistat .centrat_100 {
  text-align: center;
  width: 100px;
}

#llistat .maxwidth_200 {
  max-width: 200px;
}

#llistat .centrat_150 {
  text-align: center;
  width: 150px;
}

#llistat .right_100 {
  text-align: right;
  width: 100px;
}

#llistat .right_150 {
  text-align: right;
  width: 150px;
}

#llistat .w250 {
  width: 250px;
}

#llistat .grid {
  min-width: 30px;
  text-align: center;
}

#llistat .right {
  text-align: right;
}

#llistatTable {
  /*width: 960px;*/
}

/* Suggestions */
#suggestions {
  display: none;
  position: absolute;
  border: 1px solid #d4d4d4;
  border-bottom: none;
  width: max-content;
  z-index: 99;
  top: 100%;
  left: 0;
  right: 0;
}

#suggestions div {
  padding: 3px 10px 3px 10px;
  cursor: pointer;
  background-color: #fff;
  border-bottom: 1px solid #d4d4d4;
}

#suggestions div:hover {
  background-color: #e9e9e9;
}

#loading {

  position: fixed;
  width: -webkit-fill-available;
  /*  width: 960px;*/
  z-index: 5;
  /*border: 1px solid rgba(0,0,0,0.20);*/
  background-color: rgba(255, 255, 255, 100);

  display: table;

}

#loaderGlobal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(40 170 157);
  /* Fondo blanco semi-transparente */
  z-index: 9999;
  color: #8b8b8b;
  font-size: 24px;
  text-align: center;
  transition: opacity 0.5s ease;
}

#loaderContent {
  display: inline-block;
  /* Para asegurar que la imagen ocupe todo el ancho */
  max-width: 80%;
  max-height: 80%;
  transform: translateY(25%);

}

#loader {
  position: absolute;
  background: #ffffff;
  top: 0px;
  left: -216px;
  width: -webkit-fill-available;
  height: 100%;
  overflow: hidden;
  padding-top: 84px;
  text-align: center;
  z-index: 9999999;
}

#loader_img {
  width: auto;
  margin-left: -236px;
}

#loader_popup {
  width: -webkit-fill-available;
  height: -webkit-fill-available;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hide_loader_popup {
  display: none !important;
}

#loaderIMG {
  background-image: url("../images/loaders/rotellina.gif");
  background-repeat: no-repeat;
  background-size: cover;
  width: 24px;
  height: 24px;
}

#loadingText {
  color: #808080;
}

#loadingImg {
  /*s'ha de treure la part html de hispac.js i posar-la al id loading*/
  display: table-cell;
  vertical-align: middle;
  text-align: center;

  position: relative;
}

#noLink {
  color: #000000;
  text-decoration: none;
  font-weight: bold;
}
#noLinks {
    color: #000000;
    text-decoration: none;
    font-weight: bold;
}

.textBlau {
  color: rgb(7, 50, 105);
  font-weight: bold;

}

#textEpisodi {
  font-size: 59%;
  color: rgb(3, 115, 143);
  font-family: 'Roboto';
  font-size: 30px;
  font-weight: 400;
}

#textNumReg {
  font-size: 47%;
  font-style: italic;
  color: rgb(153, 153, 153);

  font-family: 'Roboto';
  font-size: initial !important;
  font-weight: 300;
}

/* SIDEPANEL IFRAME TEST */

#miPanel {
  width: 0;
  transition: 0.5s;
  /* Animación */
  z-index: 99;
  display: none;
  margin: 0px 0px 0px 5px;
  background-color: white;
  border-radius: 10px;
}

#miPanel iframe {
  width: 100%;
  height: calc(100% - 26px);
  background: white;
  border-radius: 10px;
}

#miPanel.panel-open {
  /*    width: 300px; /* O el ancho que prefieras */
  display: inline-flex;
}

.icones_sidepanel {
  font-size: 12px;
}

.resize-handle {
  width: 5px;
  height: 100%;
  position: absolute;
  cursor: col-resize;
  z-index: 2;
  margin-left: -5px;
}

#sidepanel_bar {
  width: -webkit-fill-available;
  height: 20px;
  background: none !important;
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-direction: row;
}


/* POPUP IFRAME TEST */
#miPopup {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgb(0, 0, 0);
  background-color: rgba(0, 0, 0, 0.4);
  padding-top: 60px;
  z-index: 9000;
}

#contenidoPopup {
  background-color: #fefefe;
  margin: 1% auto;
  padding: 0px;
  width: 80%;
  height: 78%;
  border-radius: 15px;
  box-shadow: 0px 0px 36px #4D4D4D;
}

#popup_bar {
  width: -webkit-fill-available;
  height: 50px;
  background: var(--sauquia-gradient);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-direction: row;
}

#contingutHeader {
  width: 100%;
  background: white;
  z-index: 95;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  padding: 0px 0px 5px 0px;
  align-items: center;
}

#gestioContingut {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-items: flex-start;
  height: 1023px;
  align-content: flex-start;
  width: -webkit-fill-available;
}

.barra_separadora_header {
  border-bottom: 1px solid #01959661;
  margin-bottom: 5px;
}

.linea_bottom_header {
  position: absolute;
  border-bottom: 2px solid var(--color-principal);
  /* top: 65px; */
  height: 0px;
  width: -webkit-fill-available;
}

#llistatHead {
  position: sticky;
  z-index: 9;
  /* Just below the contingutHeader */
  background-color: white;
  /* Optional: for better visibility */
  top: 0px;
  /*    border-bottom: 1px solid var(--color-principal);*/

  /*    box-shadow: 0px 22px 27px -15px rgba(51, 51, 51, 0.73);*/
}

/* CONTROLEM ELS REGISTRES */
#contingutRegistres {
  overflow: auto;
  /* Setegem per js l'alçada del contenidor i l'scroll el volem en aquest contenidor. */
  padding-right: 10px;
  height: 100%;
  position: relative;
}

.tr_header {
  width: 100%;
  height: 19px;
  display: flex;
  position: sticky;
  top: 110px;
  z-index: 9;
  background: var(--color-principal);
}

#titolHeader {
  line-height: 40px;
}

#butActions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  height: min-content;
}

#wrapPaginacio {
  padding-top: 1px;
  margin-bottom: -20px;
}

#selectorNumRegistres {
  float: left;
  padding: 20px 10px 0px 0px;
}

#paginacio {
  text-align: center;
}

.pagination {
  margin: 10px 0px 5px 0px !important;
}

#numregistreslabel {
  float: left;
}

#numregistres {
  float: left;
}

#findRegistre {
  margin-left: 4px;
}

#ajaxLoaderSmall {}

#ajaxLoader {

  /*margin-top:10px;
	width:94%;
	height:auto;
	border: 1px solid rgba(0,0,0,0.20);
	border-radius: 4px;*/

  /*padding: 4px;
	outline: none;
	background: #FFF;*/
  text-align: center;
  clear: both;
  font-size: 16px;

}

.ajaxLoaderG {
  display: flex;
  justify-content: center;
  padding: 5px 0px 0px 0px;
}

#ajaxLoader img {
  vertical-align: middle;
}

#loaderText {
  text-align: left;
  margin-left: 15px !important;
  margin-top: 3px;
  clear: initial;
}

#missatgeError {
  text-align: center;
  padding: 5px 0px 5px 0px;
  margin: -30px 0px 40px 0px !important;
  font-size: 16px;
  font-weight: 500;
}

/* CLASSES GENERALS BOTONS*/
.updateMultiRegistres {
  margin-bottom: 0px !important;
  position: fixed;
  right: 47px;
  bottom: 17px;
}

.icona_ajuda_old {
  position: absolute;
  margin-top: 7px;
  margin-left: -21px;
  color: #d5d5d5;
}

/*.icona_ajuda {
    position: relative;
    top: -5px;
    right: 26px;
    color: #d5d5d5;
    background-color: #f7f7f7;
    padding: 5px 5px 7px 4px;
    border-radius: 0px 5px 5px 0px;
}*/

.icona_ajuda {
  position: absolute;
  margin-top: 1px;
  margin-left: -22px;
  color: #d5d5d5;
  background-color: #f7f7f7;
  padding: 5px 5px 6px 4px;
  border-radius: 0px 5px 5px 0px;
}

.icona_ajuda_multi {
  position: absolute;
  margin-top: 1px;
  margin-left: -21px;
  color: #d5d5d5;
  background-color: #f7f7f7;
  padding: 5px 5px 8px 4px;
  border-radius: 0px 5px 5px 0px;
}

.icona_ajuda_buscar {
  position: relative;
  top: -4px;
  right: 26px;
  color: #d5d5d5;
  background-color: #f7f7f7;
  padding: 5px 5px 6px 4px;
  border-radius: 0px 5px 5px 0px;
}

.input_ajuda {
  padding-right: 26px !important;
  /*      border-radius: 0px 5px 5px 0px !important;*/
}

.input_ajuda_buscar {
  padding-right: 26px !important;
  padding-left: 10px !important;
  width: 86px !important;
}

/*button.updateRegistre{
	width: 32px;
	height: 32px;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.43);
}
button.deleteRegistre{
	width: 32px;
	height: 32px;
	box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.43);
}*/
hr {
  border-top: 1px solid #01959661;
}

.pagination ul>li>a,
.pagination ul>li>span {

  border: none !important;
}

.pagination ul>li>a:hover,
.pagination ul>.active>a,
.pagination ul>.active>span,
.pagination ul>li>a:hover>i {
  background-color: #009688 !important;
  border-radius: 40px !important;
  color: white !important;
}

.pagination ul {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  border: none !important;
}

.btn_items {
  background-color: #f44336;
  position: relative;
  font-size: 11px;
  border-radius: 60px;
  padding: 3px 6px 2px 6px;
  width: auto;
  height: 12px;
  color: white;
  font-family: 'Roboto';
  font-weight: 300;
  text-align: center;
  left: -8px;
  top: -13px;
}

.preFiltreOn {
  color: white !important;
  background-color: #009688 !important;
  border: 1px #009688 solid !important;
}

.preFiltre {
  height: 24px;
  width: auto;
  text-align: left;
  color: #009688;
  border-radius: 20px;
  border: none;
  background-color: #ffffff;
  border: 1px #009688 solid;
  /*    margin-bottom: 7px;*/
  margin-left: 7px;
  padding-left: 10px;
  padding-right: 10px;
}

.accioSidepanel {

  text-align: center;
  color: #ffffff;
  border-radius: 20px;
  border: none;
  background-color: #009688;
  border: 1px #009688 solid;
  /* margin-bottom: 7px; */
  /* margin-left: 7px; */
  /* padding-left: 3px; */
  /* padding-right: 13px; */
  padding-top: 5px;
  padding-bottom: 3px;
}

.side-panel-actions {
  /*background-color: #00989826;*/
  border-radius: 0px 0px 8px 8px;
  padding-top: 10px;
  padding-bottom: 5px;
}

.centrar {
  text-align: center;
}

.btnSauquia {
  height: 24px;
  width: 38px;
  text-align: left;
  background: #ffffff00;
  border-radius: 5px;
  border: none;
  color: #009688;
}

.btnSauquia_mini {
  width: 38px;
  height: 20px;
  text-align: left;
  background: #ffffff00;
  border-radius: 5px;
  border: none;
  color: #009688;
}

.btnFiltreInformeP {
  margin-top: -3px;
}

.btnSauquiaLong {
  height: auto !important;
  text-align: center;
  background: #009688;
  border-radius: 5px !important;
  color: #ffffff !important;
  border: #009688 2px solid !important;
}

.btnSauquiaLong:hover {
  background-color: #008577;
  color: white;
}

.btnSauquiaLong:active {
  background-color: #036b6c;
  border: #009688 2px solid;
  color: white;
}

.btnSauquiaLong_e {
  height: auto !important;
  text-align: center;
  background: #8f5151;
  border-radius: 5px !important;
  color: #ffffff !important;
  border: #8f5151 2px solid !important;
}

.btnSauquiaLong_e:hover {
  background-color: #6c0303;
  color: white;
}

.btnSauquiaLong_e:active {
  background-color: #6c0303;
  border: #8f5151 2px solid;
  color: white;
}

.btn-ml {
  /*  margin-left: 25px;*/
}

.error {
  font-size: 0.8em;
}

a.noLinkw {
  color: rgb(255, 255, 255);
  text-decoration: none;
  /*	font-weight: bold;*/
}

a.noLink2 {
  color: rgb(7, 50, 105);
  text-decoration: none;
}

a.noLink100 {
  color: rgb(7, 50, 105);
  text-decoration: none;
  width: 100px;
}


a.textTitol {
  font-size: 83%;

  text-decoration: none;

  font-size: 35px;
  font-weight: initial;
}

.classeExtra {
  margin-left: 150px;
}

.textArea {
  /*width: 200px;*/
}

.mostra {
  display: table;
}

.flattern_class {
  margin-top: 6px;
}

#icona_AE {
  float: left;
  margin-right: 10px;
  width: 64px;
  height: 64px;
}

/* Checkboxes
   ========================================================================== */
.checkbox_c {
  display: flex;
  justify-content: center;
  margin-top: 4px;
}

.checkbox_dreta {
  display: flex;
  height: 39px;
}

#check_dreta {
  margin-top: 2px;
}

/* Remove default checkbox */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

[type="checkbox"] {
  /* checkbox aspect */
}

[type="checkbox"]+span:not(.lever) {
  position: relative;
  padding-left: 35px;
  cursor: pointer;
  display: inline-block;
  height: 16px;
  /* before 25*/
  line-height: 25px;
  font-size: 1rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

[type="checkbox"]+span:not(.lever):before,
[type="checkbox"]:not(.filled-in)+span:not(.lever):after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 18px;
  height: 18px;
  z-index: 0;
  border: 2px solid #5a5a5a;
  border-radius: 1px;
  margin-top: 3px;
  -webkit-transition: .2s;
  transition: .2s;
}

[type="checkbox"]:not(.filled-in)+span:not(.lever):after {
  border: 0;
  -webkit-transform: scale(0);
  transform: scale(0);
}

[type="checkbox"]:not(:checked):disabled+span:not(.lever):before {
  border: none;
  background-color: rgba(0, 0, 0, 0.42);
}

[type="checkbox"].tabbed:focus+span:not(.lever):after {
  -webkit-transform: scale(1);
  transform: scale(1);
  border: 0;
  border-radius: 50%;
  -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
  background-color: rgba(0, 0, 0, 0.1);
}

[type="checkbox"]:checked+span:not(.lever):before {
  top: -4px;
  left: -5px;
  width: 12px;
  height: 22px;
  border-top: 2px solid transparent;
  border-left: 2px solid transparent;
  border-right: 2px solid #26a69a;
  border-bottom: 2px solid #26a69a;
  -webkit-transform: rotate(40deg);
  transform: rotate(40deg);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
}

[type="checkbox"]:checked:disabled+span:before {
  border-right: 2px solid rgba(0, 0, 0, 0.42);
  border-bottom: 2px solid rgba(0, 0, 0, 0.42);
}

/* Indeterminate checkbox */
[type="checkbox"]:indeterminate+span:not(.lever):before {
  top: -11px;
  left: -12px;
  width: 10px;
  height: 22px;
  border-top: none;
  border-left: none;
  border-right: 2px solid #26a69a;
  border-bottom: none;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
}

[type="checkbox"]:indeterminate:disabled+span:not(.lever):before {
  border-right: 2px solid rgba(0, 0, 0, 0.42);
  background-color: transparent;
}

[type="checkbox"].filled-in+span:not(.lever):after {
  border-radius: 2px;
}

[type="checkbox"].filled-in+span:not(.lever):before,
[type="checkbox"].filled-in+span:not(.lever):after {
  content: '';
  left: 0;
  position: absolute;
  /* .1s delay is for check animation */
  -webkit-transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
  transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
  z-index: 1;
}

[type="checkbox"].filled-in:not(:checked)+span:not(.lever):before {
  width: 0;
  height: 0;
  border: 3px solid transparent;
  left: 6px;
  top: 10px;
  -webkit-transform: rotateZ(37deg);
  transform: rotateZ(37deg);
  -webkit-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
}

[type="checkbox"].filled-in:not(:checked)+span:not(.lever):after {
  height: 20px;
  width: 20px;
  background-color: transparent;
  border: 2px solid #5a5a5a;
  top: 0px;
  z-index: 0;
}

[type="checkbox"].filled-in:checked+span:not(.lever):before {
  top: 0;
  left: 1px;
  width: 6px;
  height: 12px;
  border-top: 2px solid transparent;
  border-left: 2px solid transparent;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  -webkit-transform: rotateZ(37deg);
  transform: rotateZ(37deg);
  -webkit-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
}

[type="checkbox"].filled-in:checked+span:not(.lever):after {
  top: 0;
  width: 20px;
  height: 20px;
  border: 2px solid #26a69a;
  background-color: #26a69a;
  z-index: 0;
}

[type="checkbox"].filled-in.tabbed:focus+span:not(.lever):after {
  border-radius: 2px;
  border-color: #5a5a5a;
  background-color: rgba(0, 0, 0, 0.1);
}

[type="checkbox"].filled-in.tabbed:checked:focus+span:not(.lever):after {
  border-radius: 2px;
  background-color: #26a69a;
  border-color: #26a69a;
}

[type="checkbox"].filled-in:disabled:not(:checked)+span:not(.lever):before {
  background-color: transparent;
  border: 2px solid transparent;
}

[type="checkbox"].filled-in:disabled:not(:checked)+span:not(.lever):after {
  border-color: transparent;
  background-color: #949494;
}

[type="checkbox"].filled-in:disabled:checked+span:not(.lever):before {
  background-color: transparent;
}

[type="checkbox"].filled-in:disabled:checked+span:not(.lever):after {
  background-color: #949494;
  border-color: #949494;
}

.d-none {
  display: none !important;
}

.asterisc_oblig {
  color: #e92626;
  margin-left: 2px;
}

/* ESTILS ADDICIONALS per als camps_objectes */
.ia_ample_hores {
  text-align: center;
  margin-right: -4px;
  width: 200px;
}

.ia_ample_medicacio {
  width: 230px;
  /*float: unset;*/
  margin-top: -1px;
  margin-left: 20px;

}

.ia_ample_medicacio_text {
  width: 218px;
  /*float: unset;*/
  margin-top: -1px;
  margin-left: 20px;

}

.ia_ample_serum_text {
  width: 218px;
  /*float: unset;*/
  margin-top: -1px;
  margin-left: 20px;
  margin-right: 83px;

}

.ia_ample_minuts {
  width: 35px;
  text-align: center;
  margin-right: -4px;
}

.ia_ample_dosis {
  width: 54px;
  text-align: center;
  margin-right: 5px;
}

.ia_marge_top {
  margin-top: 25px;
}

.ia_marge_left {
  margin-left: 7px;
}

.ia_marge_left_end {
  margin-left: 5px;
}

.ia_marge_left_hh_mm {
  margin-left: 352px;
}

.ia_marge_top_min_hores {
  margin-top: -9px;
}

.ia_color_columna {
  background-color: #0099990f !important;
}

.ia_margin_right_data {
  margin-right: 140px;
}

/* new side menu */
.noline {
  border: none !important;
  width: 100% !important
}

ul.navbar-nav {
  margin: 0px !important;
}

.center_user {
  text-align: center;
  background: linear-gradient(19deg, var(--menu-high) 58%, rgb(255 255 255 / 0%) 59%);
}

.navbar-scroll {}

.navbar .nav {
  width: 100%;
}

.navbar .nav>li>.dropdown-menu:after {
  display: none !important;
}

.navbar .nav>li>.dropdown-menu:before {
  display: none !important;
}

#usuari_nav {
  text-align: center;
  width: 210px;
}

body,
html {
  height: 100%;
}

/* remove outer padding */
.main .row {
  padding: 0px;
  margin: 0px;
}

/*Remove rounded coners*/

nav.sidebar.navbar {
  border-radius: 0px;
}

nav.sidebar,
.main {
  -webkit-transition: margin 200ms ease-out;
  -moz-transition: margin 200ms ease-out;
  -o-transition: margin 200ms ease-out;
  transition: margin 200ms ease-out;
  /*      position: fixed;*/
  left: 0;
}

/* Add gap to nav and right windows.*/
.main {
  padding: 5px 5px 0 5px;
}

/* .....NavBar: Icon only with coloring/layout.....*/
ul.usuari_nav {
  /*height: 143px;*/
}

b.caret_user {
  margin-top: 28px;
}

button .caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 6px;
  vertical-align: middle;
  border-top: 4px solid #ffffff;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
  content: "";
}

nav.sidebar {
  margin-left: 0px;
  float: none;
  height: 100%;
}

/*adds border top to first nav box */
nav.sidebar .navbar-nav>li:first-child {
  border-top: 1px #e5e5e5 solid;
}

/*adds border to bottom nav boxes*/
nav.sidebar .navbar-nav>li {
  border-bottom: 1px #e5e5e5 solid;
}

/*Center Brand*/
nav.sidebar.navbar.sidebar>.container .navbar-brand,
.navbar>.container-fluid .navbar-brand {
  margin-left: 0px;
}

/*Center Brand*/
nav.sidebar .navbar-brand,
nav.sidebar .navbar-header {
  text-align: center;
  width: 100%;
  margin-left: 0px;
}

/*Center Icons*/
nav.sidebar a {
  padding-right: 13px;
}

/* Colors/style dropdown box*/
nav.sidebar .navbar-nav .open .dropdown-menu {
  position: static;
  float: none;
  width: auto;
  margin-top: 0;
  background-color: rgb(0 0 0 / 32%) !important;
  border-radius: unset;
  border: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.dropdown-menu {
  display: block;
  transition: max-height 500ms;
  max-height: 0px;
  visibility: hidden;
}

.open>.dropdown-menu {
  display: block;
  max-height: 700px;
  visibility: visible;
  overflow: hidden;
}

/*allows nav box to use 100% width*/
nav.sidebar .navbar-collapse,
nav.sidebar .container-fluid {
  padding: 0 0px 0 0px;
}

/*colors dropdown box text */
.navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
  color: #ffffff;
}

/*gives sidebar width/height*/


/*give sidebar 100% width;*/
nav.sidebar li {
  width: 100%;
}

nav.sidebar .navbar-nav .open .dropdown-menu>li>a:hover,
nav.sidebar .navbar-nav .open .dropdown-menu>li>a:focus {
  color: #CCC;
  background-color: transparent;
}

nav:hover .forAnimate {
  opacity: 1;
}

section {
  padding-left: 15px;
}

/* CSS DASHBOARDS */
.fa-petit {
  font-size: 13px;
}

.botons_accio_dashboard {
  width: max-content;
  isplay: flex;
  align-items: center;
}

#dashboardContainer {
  position: fixed;
  width: -webkit-fill-available;
  height: -webkit-fill-available;
  margin-top: 64px;
  margin-right: 15px;
  background: #e5efee7d;
  overflow: auto;
}

#titolDashboard:hover #modifyDashboard {
  display: inline !important;
}

.dashboard {
  position: relative;
  background-color: #fff;
  /* Fondo por defecto */
  border-radius: 5px;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
}

.moveButton {
  position: absolute;
  top: 5px;
  right: 5px;
  z-index: 10;
}

#headerDashboard {
  width: 100%;
  float: left;
  position: sticky;
  top: 0px;
  background: white;
  z-index: 95;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.container_d {
  box-sizing: border-box;
  /* Asegura que el padding y el borde se incluyan en el ancho/altura total */
  position: absolute;
  /*    border: 1px solid gray;*/
  border-radius: 5px;
  background-color: white;
  box-shadow: 0px 0px 8px rgb(0 0 0 / 29%);
  margin: 15px;
}

.containerTitle {
  /* Estilos para el título aquí */
  background-color: #009999;
  color: white;
  padding-left: 19px;
  border-radius: 13px 0px 0px 50px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
}

/* CLASSES MISSATGES DE TEXT */
.error_text {
  color: #b50404;
  font-weight: 600;
}

/*
 ==== Layouting ====
*/

.layout {
  display: flex;
}

.layout.vertical {
  flex-direction: column;
}

.layout.horizontal {
  flex-direction: row;
}

.layout.with-gap {
  gap: var(--separador-main);
}

.layout.with-big-gap {
  gap: 24px;
}

.layout.gap {
  gap: var(--separador-main);
}

.layout.big-gap {
  gap: 24px;
}

.layout.horizontal.reverse {
  flex-direction: row-reverse;
}

.layout.vertical.reverse {
  flex-direction: column-reverse;
}

.layout>.main {
  flex: 1;
}

.layout.horizontal>.main {
  min-width: 0;
}

.layout.vertical>.main {
  min-height: 0;
}

.layout>.master {
  flex: 0.25;
}

.layout>.detail {
  flex: 0.75;
}

.layout>.c-small {
  flex: 0.20;
}

.layout>.c-middle {
  flex: 0.40;
}

.layout.horizontal.left {
  justify-content: flex-start;
}

.layout.horizontal.center {
  justify-content: center;
}

.layout.horizontal.right {
  justify-content: flex-end;
}

.layout.horizontal.top {
  align-items: flex-start;
}

.layout.horizontal.middle {
  align-items: center;
}

.layout.horizontal.bottom {
  align-items: flex-end;
}

.layout.vertical.left {
  align-items: flex-start;
}

.layout.vertical.center {
  align-items: center;
}

.layout.vertical.right {
  align-items: flex-end;
}

.layout.vertical.top {
  justify-content: flex-start;
}

.layout.vertical.middle {
  justify-content: center;
}

.layout.vertical.bottom {
  justify-content: flex-end;
}

.scroll {
  overflow-y: auto;
}

/* ESTIL PER DESHABILITAR CAMPS EN L'EDICIÓ */
.deshabilitar_camp {
  pointer-events: none;
  opacity: 0.6;
  border-color: #b3b3b3 !important;
  background-color: #eeeeee !important;
}

/* ESTILS PER AL POPUP D'ALERTES DESPRÉS DEL LOGIN */
#alertPopupDialog .alert-popup-content {
  padding: 0;
  margin: 0;
  list-style: none;
  max-height: 400px;
  overflow-y: auto;
}

#alertPopupDialog .alert-popup-content li {
  margin-bottom: 10px;
  padding: 12px 15px;
  border-left: 4px solid #f39c12;
  background-color: #fff3cd;
  color: #856404;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.2s;
}

#alertPopupDialog .alert-popup-content li:hover {
  background-color: #ffe8a1;
}

#alertPopupDialog .alert-popup-content li:last-child {
  margin-bottom: 0;
}

#alertPopupDialog .alerta_separador {
  margin: 15px 0;
  border: 0;
  border-top: 1px solid #ddd;
}

#alertPopupDialog .no_pointer {
  cursor: default !important;
}

#alertPopupDialog .no_pointer:hover {
  background-color: #fff3cd !important;
}