/*
*	ESTE ARCHIVO FUE CREADO PARA INCORPORAR ESTILOS PERSONALIZADOS 
*	SE DEBEN INCORPORAR REGLAS DE ESTILO GENERALES DEL APP
*/

@font-face {
    font-family: "NunitoSans";
    src: url("/CQCR_SistemaTramitesWEB/javax.faces.resource/fonts/NunitoSans/NunitoSans-Light.ttf.xhtml") format("truetype");
    font-weight: lighter;
}

@font-face {
    font-family: "NunitoSans";
    src: url("/CQCR_SistemaTramitesWEB/javax.faces.resource/fonts/NunitoSans/NunitoSans-Regular.ttf.xhtml") format("truetype");
    font-weight: normal;
}

@font-face {
    font-family: "NunitoSans";
    src: url("/CQCR_SistemaTramitesWEB/javax.faces.resource/fonts/NunitoSans/NunitoSans-ExtraLight.ttf.xhtml") format("truetype");
    font-weight: 100;
}

@font-face {
    font-family: "NunitoSans";
    src: url("/CQCR_SistemaTramitesWEB/javax.faces.resource/fonts/NunitoSans/NunitoSans-ExtraLight.ttf.xhtml") format("truetype");
    font-weight: 200;
}

@font-face {
    font-family: "NunitoSans";
    src: url("/CQCR_SistemaTramitesWEB/javax.faces.resource/fonts/NunitoSans/NunitoSans-Light.ttf.xhtml") format("truetype");
    font-weight: 300;
}

@font-face {
    font-family: "NunitoSans";
    src: url("/CQCR_SistemaTramitesWEB/javax.faces.resource/fonts/NunitoSans/NunitoSans-Regular.ttf.xhtml")  format("truetype");
    font-weight: 400;
}

@font-face {
    font-family: "NunitoSans";
    src: url("/CQCR_SistemaTramitesWEB/javax.faces.resource/fonts/NunitoSans/NunitoSans-SemiBold.ttf.xhtml") format("truetype");
    font-weight: 500;
}

@font-face {
    font-family: "NunitoSans";
    src: url("/CQCR_SistemaTramitesWEB/javax.faces.resource/fonts/NunitoSans/NunitoSans-Bold.ttf.xhtml") format("truetype");
    font-weight: 600;
}

@font-face {
    font-family: "NunitoSans";
    src: url("/CQCR_SistemaTramitesWEB/javax.faces.resource/fonts/NunitoSans/NunitoSans-Bold.ttf.xhtml") format("truetype");
    font-weight: 700;
}

@font-face {
    font-family: "NunitoSans";
    src: url("/CQCR_SistemaTramitesWEB/javax.faces.resource/fonts/NunitoSans/NunitoSans-ExtraBold.ttf.xhtml") format("truetype");
    font-weight: 800;
}

@font-face {
    font-family: "NunitoSans";
    src: url("/CQCR_SistemaTramitesWEB/javax.faces.resource/fonts/NunitoSans/NunitoSans-ExtraBold.ttf.xhtml") format("truetype");
    font-weight: 900;
}

/*
xl-width: 1200px;
lg-width: 992px;
md-width: 768px;
sm-width: 576px;
*/

html,body{
	font-family: "NunitoSans", sans-serif;
	font-size: 16px;
	color: var(--gris-texto);
	background: var(--gris-fondos);
	min-height: 100vh;
}
@media (max-width: 576px) { /* sm-width */
	html, body{
		font-size: 14px;
	}
}


.box-container{
	background: var(--white);
	border-radius: 4px;
	padding: 2rem;
	margin-top: 3rem;
    margin-bottom: 3rem;
}

.box-container-secondary{
	background: var(--gris-fondos);
	border-radius: 4px;
	padding: 0.7rem;
	margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}
.box-container-borded{
	background: var(--white);
	border: 1px solid var(--gris-inactivo);
	border-radius: 4px;
	padding: 1rem 2rem;
	margin-top: 1rem;
    margin-bottom: 1rem;
}
.box-texto-largo{
	max-height: 200px;
	overflow-y: scroll; 
}


/* ===================================== */
/* == ESTILOS DE ETIQUERAS DE ESTADOS == */
/* ===================================== */
.etiqueta-estado{
	border-radius: 4px;
	padding: 0.3rem 0.7rem;
	font-weight: 700;
}
.etiqueta-gris{
	background: var(--gris-fondos);
	color: var(--gris);
}
.etiqueta-verde{
	background: rgba(141, 198, 63, 0.2);
	color: var(--verde);
}
.etiqueta-naranja{
	background: rgba(223, 144, 61, 0.2);
	color: var(--naranja);
}
.etiqueta-cyan{
	background: rgba(53, 191, 204, 0.2);
	color: var(--cyan);
}


/* ANCHOR */
.no-decoration > a,
a.no-decoration{
	text-decoration: none;
}


/* TOOLTIP */
.tooltip-base.ui-tooltip{
	max-width: 500px;
}
.tooltip-base.ui-tooltip .ui-tooltip-text{
	background: var(--gris);
}
.tooltip-right.ui-tooltip.ui-tooltip-right .ui-tooltip-arrow {
    border-right-color: var(--gris);
}
.tooltip-right.ui-tooltip.ui-tooltip-left .ui-tooltip-arrow {
    border-left-color: var(--gris);
}
.tooltip-right.ui-tooltip.ui-tooltip-top .ui-tooltip-arrow {
    border-top-color: var(--gris);
}
.tooltip-right.ui-tooltip.ui-tooltip-bottom .ui-tooltip-arrow {
    border-bottom-color: var(--gris);
}