
body 
{
	margin: 0%;
}
#root {
	width: 100%;
	height: 100vh; 
}


/*
HEADER ----------------------------------------------- */
@font-face {
    font-family: "Quicksand";
    src: url("/assets/Quicksand-VariableFont_wght.ttf");
    
}

#header {
	margin:1%;
	height: 5%;
    font-family: 'Quicksand', sans-serif;
    font-size: 130%;
    font-weight: bold;
    text-indent: 60px;
    background-image: url("/assets/Logo CTN.png");
    background-repeat: no-repeat;
}




/*
BODY-------------------------------------------------- */
#body {
	display:flex;
	flex-direction: column;
	/* width: 100%; */
	height: 90%;
	max-height: 90%;
	margin:1%;
}

/* TABS
------------------------------------------------------ */
#tabs-parent{
	height:100%;
	max-height:100%;
    border-left: 1 px solid #d6d6d6;
}

.custom-tabs {
    border-top-left-radius: 3px;
    background-color:  #4C4039;
    padding: 0px 24px;
    border-bottom: 1px solid #d6d6d6;
}
.custom-tab {
    color:#00a7e2;
   /* border-top-left-radius: 0px;
    border-top-right-radius: 0px;*/
    border-top: 0px solid transparent !important;
    border-left: 0px solid transparent !important;
    border-right: 0px solid transparent !important;
    border-bottom: 2px solid lightgrey !important;
    /*background-color: #00a7e2;*/
        padding: 12px !important;
    font-family: "Quicksand", "system-ui";
    display: flex !important;
    align-items: center;
    justify-content: center;
}
.custom-tab--selected {
    color: black;
    font-weight: bold;
    box-shadow: 1px 1px 0px white;
    border-left: 0px solid lightgrey !important;
    border-right: 0px solid lightgrey !important;
    border-top: 0px solid #e36209 !important; /* Borde de la pestaña seleccionada */
   	
   
    }

.tab-content {
	height:90%;
	max-height: 90%
    
}
.custom-tab-container {
	height: 5%
    
}
/* TAB BUSQUEDAS
------------------------------------------------------ */
#tab-busqueda {
	width: 100%;
	height: 100%;
   
   color: grey;
  
}
#tab-red {

   color: grey;
 }

/* Busqueda */
#busqueda {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	align-items: center;
	height: 5%;
	width: 50%;
    margin: 1% 1% 1% 0%;
    
    
      
}
#cuadro-busqueda {
	border-radius: 5px;
     border: 1px solid lightgrey;
    width:70%;
	height:90%;
	margin: 0% 2% 0% 0%;
}
#boton-busqueda {
	width: 5%;
    height:90%;
    margin-left: 1%;
    border-radius: 5px;
     border: 1px solid lightgrey;
    background-color: white;
    color: rgba(0, 0, 0, 0.0);
    background-image: url("/assets/lupa.png");
    background-repeat: no-repeat;
     background-position: center;
     background-size: cover; 
    
}

#boton-busqueda:hover {
background: #efefef;
 background-image: url("/assets/lupa.png");
    background-repeat: no-repeat;
     background-position: center;
     background-size: cover; 

}


#div-filtro-numero-papers {
	display: flex;
	justify-content: left;
	align-items: center;
    font-family: "Quicksand", "system-ui";
	max-width: 30%;
	width: 30%;
	margin: 1% 1% 1% 5%
}
#filtro-numero-papers {
	max-width: 20%;
	width: 20%;
	margin: 1% 0% 1% 2%;
    
    
}

#numero-papers {
font-family: "Quicksand", "system-ui";
font-weight: bold;
    border-style: none;
     }

#text-numero-papers {
	width: 80%;
}

#content-tab-busqueda {
	display: flex;
	flex-direction: row;
	height: 100%;
	width: 100%;
}
/* Filtros */
#div-filtros {
	height:100%;
	max-height:100%;
	width: 30%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: left;
	margin: 1%  0% 0% 0%;
   border-radius: 5px;
    border: 2px solid lightgrey;
}

#div-boton-filtro {
	padding-top: 1%;
    padding-left: 1%
   
}

#boton-filtro {
 border-radius: 5px;
    border: 1px solid lightgrey;
    font-family: "Quicksand", "system-ui";
font-weight: bold;
 }

 #boton-filtro:hover {
 background: #d4d4d4;
  }
  
 
#div-filtro-fecha {
	width:100%;
	max-width:100%;
	height:45%;
	max-height: 45%;
   margin-top: 1%; 
/*  border-radius: 5px;
    border: 1px solid lightgrey;*/
}
#histo-fechas-papers {
	padding: 0px 25px 0px;
	max-height: 75%;
	height: 75%;
}
#RangeSlider-fecha {
	padding: 0% 0% 0% 0%
}

#div-filtro-citas {
	width: 100%;
	max-width:100%;
	height: 45%;
	max-height: 45%;
}
#histo-citas-papers {
	padding: 0px 25px 0px;
	max-height: 75%;
	height: 75%;
}
#RangeSlider-citas {
	padding: 0% 0% 0% 0% 
}

#filtro-log-op {
 font-family: "Quicksand", "system-ui";
font-weight: bold;
 }


/* Tabla */ 
#col-tabla {
	display: flex;
	flex-direction: column;
	width: 100%;
	max-height: 65%;
	margin: 1% 1% 1% 3%;
}
/* .dash-table-container {
	/* carballo 
	width: 60vw !important;
} */

#div-tabla-resultados {
	/* max-height: 45%; */
	position: relative;
	width: 100%;
	margin: 1% 1% 1% 1%;
	padding: 0% 0% 0% 0%;
    text-align: left;
}
#div-filtros-tabla {
	min-width: 30%;
	margin: 1% 1% 1% 1%;
	
}



td.dash-delete-cell  {
  display: table-cell;
}
td.dash-select-cell  {
  display: table-cell;
}


td.dash-cell.column-0 {
  
  display: table-row;
  text-align:left;
	max-width: 60vw !important;
  }
  
 /* #p{
	 white-space:nowrap;
overflow:hidden;
	 text-overflow: ellipsis !important;
 } */


td.dash-cell.column-1 {
  display: table-row;
  text-align:left;
  
}

td.dash-cell.column-2 {
  display: table-row;
  text-align:left;

 
}

td.dash-cell.column-3 {
  display: table-row;
  text-align:left;

 
}
td.dash-cell.column-4 {
  display: table-row;
  text-align:left;

 
}
td.dash-cell.column-5 {
  display: table-row;
  text-align:left;

 
}

#export-data-btn{
border-radius: 5px;
    border: 1px solid lightgrey;
    font-family: "Quicksand", "system-ui";
font-weight: bold;

 }
  #export-data-btn:hover {
 background: #d4d4d4;
  }
  
 #column-header-name {
 font-family: "SourceSans3", "system-ui"; }

/* 
TAB RED --------------------------------------- */
@font-face {
    font-family: "SourceSans3";
    src: url("/assets/SourceSans3-VariableFont_wght.ttf");
    }

#div-red {
	display: flex;
	flex-direction: row;
	height: 100%;
	width: 100%;
	margin: 1% 0% 1% 0%
	/* max-height:70%; */
}

#div-red-left-col {
margin: 1% 1% 5% 1%;
	width:10%;
	height: 85%;
	min-height:85%;
	display: flex;
	flex-direction: column;
	justify-content: left;
	      border-radius: 5px;
    border: 1px solid lightgrey;
padding: 10px;
	
}
#div-tipo-red {
	display: flex;
	flex-direction: column;
    font-family: "SourceSans3", "system-ui";
    font-size:small;
    height:20%;
}
#boton-red{
border-radius: 5px;
    border: 1px solid lightgrey;
    font-family: "SourceSans3", "system-ui";
    padding: 5px 1px 5px 1px;
margin-bottom: 10px;
 }
 
  #boton-red:hover {
 background: #d4d4d4;
  }
 
 #boton-add-node{
border-radius: 5px;
    border: 1px solid lightgrey;
    font-family: "SourceSans3", "system-ui";
    padding: 5px 1px 5px 1px;
 }
 
 #boton-add-node:hover {
 background: #d4d4d4;
  }
   
#red-relaciones {
	position: relative;
	width: 60%;
	max-width:60%;
	height:100%;
	max-height:100%;
}

#div-red-right-col {
	display: flex;
	flex-direction: column;
	margin: 2% 0% 0% 1%;
	min-width: 29%;
	max-width: 29%;
	height: 100%;
}
#div-download-cyto{
	display:flex;
	height:10%;
	width:75%
}
#download-btn{
	max-width: 60%;
	height:40px;
    border-radius: 5px;
    border: 1px solid lightgrey;
    font-family: "SourceSans3", "system-ui";

}

 #download-btn:hover {
 background: #d4d4d4;
  }
#dropdown-type-image-cyto {
	width:30%;
	height: 40px;
	margin:0% 1% 0% 5%;
    font-family: "SourceSans3", "system-ui";
     
}
div.Select-control {
height: 40px; 
}

div.Select-value{
font-family: "SourceSans3", "system-ui";
 }

#div-info-nodo {
	display:flex;
	flex-direction: column;
	max-height: 80%;
}
#row1-nodo {
	height: 8%;
	overflow-y: ellipsis;
    font-family: "SourceSans3", "system-ui";
    font-size:small;
    font-weight:bold;
}
#row2-nodo {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	height: 8%;
    font-family: "SourceSans3", "system-ui";
    font-size:small;
}
#row3-nodo {
	max-height: 84%;
	overflow-y: scroll;
    font-family: "SourceSans3", "system-ui";
    font-size:small;
}
#row1-nodo p{
white-space:nowrap;
overflow:hidden;
text-overflow: ellipsis;
 }
#div-layout-red p {
font-family: "SourceSans3", "system-ui";
    font-size:small;
    text-align:center;
 }

 #div-tipo-red p {

    text-align:center;
 }
/*
FOOTER ------------------------------------- */
/* #footer {     M ANG
	height: 5%;
    background-color: blue;
    position: relative;
	top: 65%;
} */

#footer {
	position:relative;
	display:flex;
	flex-direction:row; 
	/*justify-content: space-between;*/
	align-content: flex-start;
	height: 5%;
	max-height:5%;
	left: 0;
	top: 65%;
	width:98%;
	max-width:98%;
	margin-top: 1%;
	padding: 1% 1% 1% 1%;
	background-color: #00a7e1;
}
#div-eu-logo {
	display:flex;
	align-items: center;
	justify-content:center;
	width:8%;
	padding: 0% 0% 0% 1%;
}
#div-regmur-logo{
	display:flex;
	align-items: center;
	justify-content:center;
	min-height:100%;
	max-height:100%;
	width:8%;
	padding: 0% 1% 0% 1%;
}
#div-info-logo{
	display:flex;
	align-items: center;
	justify-content:center;
	width:4%;
	padding: 0% 1% 0% 2%;
}
#div-ris3mur-logo{
	display:flex;
	align-items: center;
	justify-content:center;
	width: 6%;
	padding: 0% 2% 0% 1%;
}

#div-eu-text{
	display:flex;
	align-items: center;
	justify-content: center;
	align-content: center;

}
#eu-logo-text{
	text-align:justify;
	font-size: 12px
}
#div-text {
	display:flex;
	align-items: center;
	justify-content: center;
	align-content: center;
	font-size: 12px;
	max-width:30%;
	padding: 0 2% 0% 1%
}
#div-ss{
	display:flex;
	flex-direction: row;
	align-items:center;
	width:12%;
	padding:0 0% 0% 4%;
	font-size: 12px;
}

#div-ss-logo{
	width:100%;
	padding:0 0% 0% 2%
}
