:root {
	
	@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600;700;900&display=swap');
	
	--main-blue-body: #3D6AFB;
	--main-blue-border:#0539E5;
	
	--placeholder-grey:#313030;
	
	--text-grey: #656565;
	
	/*### COLORES DE ANA*/
	
	--azul-1: #3D6BFA;		/*primary*/
	--azul-2: #CFE5FF;		/*secondary*/
	--azul-1-dark: #2E51BF;			/*dark primary*/
	--azul-2-dark: #84BBFF;		/*dark secondary*/
	
/* 	--gris-hover: #F3F7FC;	light */
	--gris-hover: rgba(51, 120, 204, 0.06);
	--dark:#12263F;
	--gris-generico: #5A6778;
	--gray-generico: #5A6778;	/*info*/
	--gray-300: #E4EBF6;
	--gray-600:#95AAC9;
	--gray:700:#6E84A3;
	--gray-900: #283E59;
	
	--blanco: #FFFFFF;
	--dashkit-bg:#F9FBFD;
	
	--success:#2C630B;
	--danger:#BD0000;
	--warning:#FFC107;
	
	--light-orange:#FFD3B8;
	--light-green:#C3F6EF;
	--light-red:#FFCDCD;
	
	
	/*### MEDIDAS ANA ###*/
	--border-radius: 0.25rem;
	
	--boton-ppal-w: 13.125rem;

}

body{
	/* font-size:0.8rem; */ 
    font-family: 'Source Sans Pro', sans-serif;
	color: var(--text-grey);
	background-color: #F9FBFD;
}

.divAdvOp{
	padding-top:1rem;
}



#bodyNavbar{
	margin-top: 0.5rem;
}

.navbar{
	background-color: var(--dashkit-bg) !important;
}

#bottom-nav{
	position: sticky;
	border: solid 1px;
	background-color: var(--blanco);
	border-color: rgba(0,0,0,0.2);
	border-radius:0.25rem;
}

/* ############## NAVBAR DE EDIT FORMS ############## */
.pdflex-container{
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: flex-start;
    align-content: center;
    width: 100%;
    margin: none auto;
    gap: 1rem;
    z-index:0;
    background-color: var(--blanco);
    align-items: center;
    padding:1rem 0;
}
.pdtitle-box{
	display:flex;
	flex-direction:column;
    text-align: left;
    margin:none;
}
.pd-t65 {
	flex-grow: 1;
	flex-basis: 65%;
}

.pdc1{
    order:1;
    flex-grow: 1;
}
.pdc2 {
    order:2;
    flex-grow: 1;
}

.pdc3 {
    order:3;
    flex-grow: 1;
}

.pdc4 {
    order:4;
    flex-grow: 1;
    justify-content:flex-end;
}
.pdc5 {
    order:5;
    flex-grow: 1;
    justify-content:flex-end;    
}
.pdc6 {
    order:6;
    flex-grow: 1;
    justify-content:flex-end;
    
}

/* ############## TABLES ############## */

table{
	color: var(--text-grey) !important;
}

thead{
	font-weight: bolder;
}

thead th{
	background-color: var(--dashkit-bg);
    font-weight: 600;
    letter-spacing: .08em;
}

tbody, td, tfoot, th, thead, tr{
	border-color: #dee2e6 !important;
}


/* ############## BUTTONS ############## */

.button-ppal{
	background-color: var(--azul-1);
	color: var(--blanco);
	border-radius:var(--border-radius);
	border-color:var(--azul-1);
	width: var(--boton-ppal-w);
}

.button-ppal:hover,.button-ppal:active,.button-ppal:focus{
	background-color: var(--azul-1-dark);
	border-color: var(--azul-1-dark);
	color: var(--blanco);
}

.button-scndry{
	background-color: var(--azul-2);
	color: var(--gray-900);
	border-radius:var(--border-radius);
	width: var(--boton-ppal-w);
}

.button-scndry:hover,.button-scndry:active,.button-scndry:focus{
	background-color: var(--azul-2-dark);
	color: var(--gray-900);
}

.dropdown-nbg{
	background-color: transparent;
	border-color: var(--gray-300);
	color: var(--gray-generico);
}

.dropdown-nbg:hover{
	background-color: var(--gris-hover);
	border-color: var(--gray-300);
	color: var(--azul-1);
}

.dropdown-nbg.show{
	background-color: var(--gris-hover);
	border-color: var(--gray-300);
	color: var(--azul-1);
}

.dropdown-nbg.active{
	background-color: var(--gris-hover);
	border-color: var(--gray-300);
}

#dropdown-toggle-menu{
	font-weight: 600;
}

/*Para cambiar la flechita de los dropdown*/
.dropdown-toggle[data-bs-toggle=dropdown]:after, .dropdown-toggle[data-bs-toggle=collapse]:after  {
	border: none;
	font-family: 'Font Awesome 7 Pro';
	font-weight: 900;
	content: "\f107";
	vertical-align: 0;
}

.dropdown-toggle[data-bs-toggle=dropdown][aria-expanded=true]:after,.dropdown-toggle[data-bs-toggle=collapse][aria-expanded=true]:after {
	transform: rotate(-180deg);
}

/*Para cambiar la flechita de los dropup*/
.dropup .dropdown-toggle::after {
  border: none;
  font-family: 'Font Awesome 7 Pro';
  font-weight: 900;
  content: "\f106";
  vertical-align: 0;
}


.nav-link{
	height:2rem;
	padding:0.5rem 0.75rem !important;
	border-radius: 4px;
	margin: 0 0.5rem;
}

.nav-link.p-0{
	padding: 0 !important;
	margin-top: 0.5em !important;
	height: 2.5em !important;
	color: var(--gray-600) !important;
}

.nav-link.p-0.active{
	color:var(--azul-1) !important;
	background-color: transparent !important;
    border-color: transparent transparent #2c7be5 !important;
}

.nav-item.m-0:hover{
	background-color: var(--gris-hover);
    color: var(--azul-1) !important;
}

.nav-link:hover{
	background-color: var(--gris-hover);
	color:var(--azul-1) !important;
}
.nav-item.m-0:hover .nav-link {
	background-color: transparent !important;
}

.floating-buttons input,.floating-buttons a{
	margin:0 0.5rem;
}
#bodyNavbar .nav-link {
	line-height: 1rem;
	margin: 0;
}


/* ############## CODEMIRROR ############## */
.CodeMirror {
	margin-top: 1%;
	margin-bottom:1%;
	font-size: 15px;
	border-width: 1px;
	border-color: rgba(0,0,0,0.2);
	border-style: solid;
	min-height: 4.5rem;
}

.cm-s-firebug.CodeMirror {
	font-family: monospace;
	font-size: 11px;
	line-height: 1.2;
	cursor: text;
}

.cm-s-firebug .linehighlighting {
	background-color: lightgoldenrodyellow;
}

.cm-s-firebug .CodeMirror-activeline-background {
	background: #00FFFF;
}

 .CodeMirror-foldmarker {    
    font-family: arial;
  }
 .CodeMirror-foldgutter {
    width: .7em;
  }
  .CodeMirror-foldgutter-open,
  .CodeMirror-foldgutter-folded {
    color: #555;
    cursor: pointer;
  }
  .CodeMirror-foldgutter-open:after {
    content: "\25BE";
  }
  .CodeMirror-foldgutter-folded:after {
    content: "\25B8";
  }

/* ### tema Ana ###*/


.fo-title {
	font-size:1.35rem;
	line-height:1.35rem!important;
}

.fo-subtitle {
	font-size:1.10rem;
	line-height:1.10rem!important;
}

/* poddera command link default */
.pdcl{
	text-decoration: none!important;
	color: var(--text-grey);
}

pdcl:hover{
	text-decoration: underline!important;
}

/* ############## MINIATURAS ############## */
.thumbnail-container {
  width: -webkit-fill-available;
  height: calc(1200px * 0.10);
  display: inline-block;
  overflow: hidden;
  position: relative;
  padding: 1rem;
  z-index: 1;
  pointer-events: none;  
  display: flex;
}

.thumbnail-container img{
	justify-self: center;
    align-self: center;
    width: 100%;
    height: 100%;
}

.thumbnail-container::before {
  position: absolute;
  left: calc(40%);
  top: calc(50%);
  opacity: 0.2;
  display: block;
  -ms-zoom: 2;
  -o-transform: scale(2);
  -moz-transform: scale(2);
  -webkit-transform: scale(2);
 
}

.thumbnail-container-variant{
	height: 11.5rem; 
	border-bottom: var(--dashkit-bg) solid 0.25rem;
	background-color: var(--dashkit-bg);
}

.thumbnail-container-webpart{
	height: 20rem; 
}

.thumbnail iframe {
  width: 400%;
  height: 600%;
  opacity: 0;
  transition: all 300ms ease-in-out;
}

.thumbnail {
  position: relative;
  -ms-zoom: 0.25;
  -moz-transform: scale(0.25);
  -moz-transform-origin: 0 0;
  -o-transform: scale(0.25);
  -o-transform-origin: 0 0;
  -webkit-transform: scale(0.25);
  -webkit-transform-origin: 0 0;
}

.thumbnail-variant {
	-ms-zoom: 0.31 !important;
	-moz-transform: scale(0.31) !important;
	-o-transform: scale(0.31) !important;
	-webkit-transform: scale(0.31) !important;
}

.thumbnail-webpart {
	-ms-zoom: 0.46 !important;
	-moz-transform: scale(0.46) !important;
	-o-transform: scale(0.46) !important;
	-webkit-transform: scale(0.46) !important;
}

.thumbnail:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.thumbnail-body{
	height: 12.75rem;
	border-top: var(--dashkit-bg) solid 0.25rem;
}

/* ############## NAVBAR ############## */

/* misc nes 20220107 */
input[type=checkbox] {
	transform: scale(1.5);
	margin-right:0.5em;
}


/* Marcado de elemento en listas CRUD*/
.rf-bg-green {
	background: #f8fbf6 none repeat scroll 0 0;
	color: #30491d !important;
	font-weight: bold;
}


/* Tipos de texto Ana */ 
.titulo_ficha{
    font-size: 1.625rem;
    line-height: 1.9375rem;
}
.titulo_capital{
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1rem;
}
.txt_2{
    font-size: 1.375rem;
    line-height: 2rem;
}
.txt_3{
    font-size: 1.125rem; 
    line-height: 1.5rem;
}
.txt_4{
    font-size: 1rem; 
    line-height: 1.25rem;
}
.p1{
    font-size: 1rem; 
    line-height: 1.5rem;
}.p1.semibold{
    font-size: 1rem; 
    font-weight: 600;
    line-height: 1.5rem;
}
.p2{
    font-size: 0.8125rem; 
    line-height: 1rem;
}
.p2.semibold{
    font-size: 0.8125rem; 
    font-weight: 600;
    line-height: 1rem;
}
.p3{
    font-size: 0.75rem; 
    line-height: 1rem;
}


/* Boton clear filters */
.clear-filters{
	background-color: var(--blanco);
	border-color: var(--light-red);
	color: var(--gray-generico);
	white-space: nowrap;
	/* ver que tamaños van aqui - con Ana*/
	padding:0.25em;
	font-size:0.8em;
}

.clear-filters:hover{
	background-color: var(--gris-hover);
	border-color: var(--light-red);
	color: var(--danger);
}


/* Colores para texto */
.gray-text{
	color: var(--text-grey);	
}
.gray-900-text{
	color: var(--gray-900);
}

.gray-700-text{
	color: var(--gray-700);
}

.gray-600-text{
	color: var(--gray-600);
}

.gray-gen-text{
	color: var(--gray-generico);
}

.danger-text{
	color: var(--danger);
}

/* to hide buttons - id: edit button / image */
.hEBch {
  display: none;
}
   
/* show hidden button in a child element*/ 
.show-edit-btn:hover > .hEBch {
  display: block;
}

/* Boton añadir */
.add_btn{
	background-color: var(--blanco);
	border-color: var(--gray-300);
	color: var(--gray-generico);
	font-size:0.8em;
	border-radius: 50%;
	padding: 0.75em;
	padding-top: 0.5em;
	padding-bottom: 0.25em;
}

.add_btn:hover{
	background-color: var(--gris-hover);
	border-color: var(--azul-1);
}

#status-dropdown{
	border:1px solid transparent; 
	margin-top:-.35rem;
	padding: 0.3em 0.7em;
	color: var(--gray-900);
}
#status-dropdown:hover{
	color: var(--azul-1);
}

.border-transparent{
	border-color: transparent !important;
}

.rounded-border{
	border-radius: .5rem;
}

/* Fake table para diseño de forms */
.fake-table-head {
	background-color: var(--dashkit-bg);
	text-transform: uppercase;
	font-size: .7rem;
	font-weight: 600;
	color: var(--gray-800);
	border-top-left-radius: .5rem;
	border-top-right-radius: .5rem;
}
.fake-table-row {
	border-top: 1px solid;
	border-top-color: var(--gray-300);
	transition: background-color .5s
}
.fake-table-row.active {
	background-color: var(--dashkit-bg);
}

/* Estilo para boton de edicion de campo de formulario */
.form-field-button:hover{
	background-color: var(--gris-hover);
	border-radius: .5rem;
	width: fit-content;
	max-width: 100%;
}
.form-field-button i{
	visibility: hidden;
}
.form-field-button:hover i{
	visibility: visible;
}

/* Medidas botones circulares*/
.circular-button{
	height: 1.9375rem;
	width: 1.9375rem;
	border-radius: 50%;
	display: inline-block;
	line-height: 1.9375rem;
	text-align: center;
}

.circular-button i{
	height: 0.75rem;
	width: 0.75rem;
}

.add-field-circular{
	color: var(--blanco);
	background-color: var(--azul-1);
}
.add-field-circular:hover{
	color: var(--blanco) !important;
	background-color: var(--azul-1-dark);
}

.go-top-circular{
	color: var(--gray-900);
	background-color: var(--azul-2);
}
.go-top-circular:hover{
	color: var(--gray-900) !important;
	background-color: var(--azul-2-dark);
}

.fixed-circular-buttons{
	position: fixed;
	bottom: 10%;
	right: 8%;
}

/**/
.generic-hover:hover{
	background-color: var(--gris-hover);
	color: var(--azul-1);
}

.btn-white{
	color: var(--text-grey);
}
.btn-white.active{
	color: var(--blanco);
	background-color: var(--azul-1);
	border-color: transparent;
}
.btn-transparent{
	color: var(--text-grey);
	background-color: transparent;
}


.pagination-button{
	color: var(--text-grey);
	padding: .5rem .3rem;
	height: 1.5rem;
}

.small-icon{
	font-size: .7rem;
	line-height: inherit;
}

.ffu-button{
	padding: .65rem .75rem;
}

@font-face {
  font-family: 'password';
  font-style: normal;
  font-weight: 400;
  src: url(https://jsbin-user-assets.s3.amazonaws.com/rafaelcastrocouto/password.ttf);
}

.no-autocomplete-pass {
  font-family: 'password' !important;
}

.form-kind-badge {
	background: var(--azul-1);
	font-weight: bold;
	line-height: 1.45rem;
	color: white;
}

.datepicker {
	padding-right: 2rem !important;
}

.datepicker-icon {
	position: absolute;
	right: .6rem;
}

.alert-warning {
	background-color: #fff6df;
	color: var(--text-grey);
}
.alert-danger {
	background-color: #ffd0d0;
	color: var(--text-grey);
}

.w-fit {
	width: fit-content !important;
}