@font-face {
	font-family: museo;
	src:
		url("/ServiciosPI/javax.faces.resource/font/MuseoSans-300.woff.xhtml");
}

* {
	font-family: museo;
	font-size: 14px;
	font-weight: 400;
}

html, body {
	height: 100% !important;
}

.height100 {
	height: 100vh !important;
}

body {
	margin: 0 !important;
}

.centered {
	text-align: center;
	margin: 0 auto;
}

.maxHeight400 {
	max-height: 400px;
	overflow-y: scroll;
}

.width98 {
	width: 98% !important;
}

.tableCentered {
	margin: 10px auto !important;
}

.boldText {
	font-weight: bold !important;
}

.ui-wizard-step-title {
	border-radius: 10px 10px 0 0 !important;
	background-color: #313945 !important;
	color: white !important;
	padding-right: 15px !important;
	padding-left: 15px !important;
}

.ui-wizard-step-titles .ui-state-highlight {
	background-color: #2399e5 !important;
}

.width300 {
	width: 300px !important;
}

.textCentered {
	text-align: center !important;
}

.marginLeft10px {
	margin-left: 10px !important;
}

.widthAuto {
	width: auto !important;
}

.margin0Auto {
	margin: 0 auto;
}

.minWidth250px {
	min-width: 250px !important;
}

.minWidth350px {
	min-width: 350px !important;
}

.minWidth100px {
	min-width: 150px !important;
}

.minWidth200px {
	min-width: 200px !important;
}

.minWidth50px {
	min-width: 50px !important;
}

.minWidthUnset {
	min-width: unset !important;
}

.borderedGray {
	border: 1px solid #d6d6d6;
	border-radius: 0 5px 5px 0;
}

.ui-message-error-content div, .ui-message-error {
	color: #b94a48 !important;
	background-color: #f2dede !important;
	border-color: #eed3d7 !important;
}

.customRadio {
	padding: 0 !important;
	text-align: center;
	width: 100% !important;
}

.customRadio tbody tr td div {
	margin: 0 !important;
}

.width100 {
	width: 100% !important;
}

.ui-fileupload-buttonbar {
	text-align: center;
	padding: .1em;
}

.cancelButton {
	background: #D32F2F !important;
	color: #ffffff !important;
	border: 1px solid #D32F2F !important;
}

.customBtnPadding {
	padding: 0 2px 0 2px;
}

.boldTextSpan span {
	font-weight: bold;
}

.prettyBorder {
	border: 1px solid #d5d5d5 !important;
	border-radius: 5px !important;
}

.marginTop10pxCentered {
	margin: 10px auto !important;
}

.width98 {
	width: 98% !important;
}

.padding5px {
	padding: 5px !important;
}

legend {
	background: -webkit-linear-gradient(top, #f6f7f9 0, #ebedf0 100%)
		!important;
}

.textRight {
	text-align: right !important;
}

.margin10pxAuto {
	margin: 10px auto !important;
}

.margin20pxAuto {
	margin: 20px auto !important;
}

.labelVerticalMiddle {
	display: flex;
	align-items: center;
}

.padding0 {
	padding: 0 !important;
}

.marginTop10px {
	margin-top: 10px !important;
}

.marginTop20px {
	margin-top: 10px !important;
}

.ui-inputgroup span, .ui-inputgroup span label {
	font-weight: bold !important;
	text-align: justify !important;
}

legend {
	font-weight: bold !important;
}

.select-inputgroup {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
	border-top: 0 !important;
	border-bottom: 0 !important;
}

.redText {
	color: red !important;
}

.greenText {
	color: #008000 !important;
}

.borderTop {
	border-top: 1px solid black;
}

.marginBottom10px {
	margin-bottom: 10px;
}

.h3, h3 {
	font-size: 1.75rem;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
	margin-bottom: .5rem;
	font-weight: 500;
	line-height: 1.2;
}

.borderBottom {
	border-bottom: 1px solid black;
}

.totalField {
	background-color: #f0f2f4 !important;
	font-weight: bold;
	padding: 0 !important;
}

.totalField label {
	padding-top: 5px;
	font-size: 14px !important;
}

.textLeft {
	text-align: left !important;
}

.paddingBottomCell {
	padding: 10px !important;
}

.width100px {
	width: 100px !important;
}

#pnlCreditCard {
	width: 100%;
}

#pnlCreditCard tbody tr {
	border: 0 !important;
}

#pnlCreditCard tbody tr td {
	padding: 0 !important;
}

.padding10px {
	padding: 10px !important;
}

#pnlCreditCard tbody tr td div.ui-inputgroup {
	margin-top: 5px !important;
	border-radius: 0px 5px 5px 0px;
}

.displayTable {
	display: table;
	width: 100%;
}

.displayTableCellMiddle {
	display: table-cell;
	vertical-align: middle;
}

.height40pxContentVerticalMiddle {
	height: 40px !important;
}

.height40pxContentVerticalMiddle * {
	line-height: 40px;
	vertical-align: middle;
}

.alignTop {
	vertical-align: top !important;
}

.heightFlex {
	flex: 1;
}

#pnlCreditCard thead tr td {
	border: none !important;
}

.padding15LeftRight {
	padding-left: 15px;
	padding-right: 15px;
}

.styleButton {
	border: 1px solid #1f89ce;
	color: #fff;
	background: #2399e5;
	padding: 10px;
	border-radius: 5px;
}

.styleButtonPadding5 {
	border: 1px solid #1f89ce;
	color: #fff;
	background: #2399e5;
	padding: 5px;
	border-radius: 5px;
}

.width200px li input {
	width: 200px !important;
}

.lowerCaseTransformChips li input {
	text-transform: lowercase !important;
}

.width100px {
	width: 100px !important;
}

.paddingRight20px {
	padding-right: 20px !important;
}

.imgResponsive {
	max-height: 275px;
	width: auto;
}

.marginRight5px {
	margin-right: 5px;
}

@media only screen and (max-width:640px) {
	.minWidth250px {
		min-width: 20px !important;
	}
}

.text-servicio {
	font-weight: bold;
	font-size: medium !important;
	color: #111c4e !important;
}

.highlighted {
	background: #f8ff00;
}

.displayBlock {
	display: block;
}

.blackBackground {
	background: black;
}

.ui-button-success {
	background: #689F38 !important;
	color: #ffffff !important;
	border: 1px solid #689F38 !important;
}

.ui-button-danger {
	background: #D32F2F !important;
	color: #ffffff !important;
	border: 1px solid #D32F2F !important;
}

.ui-button-secondary {
	background: #607D8B !important;
	color: #ffffff !important;
	border: 1px solid #607D8B !important;
}

.disableRowExpedienteOL {
	background-color: #B9B8B8 !important;
}

.disabled {
	opacity: 0.5;
	/* Reduce la opacidad para indicar que la fila está deshabilitada */
	pointer-events: none; /* Evita la interacción con la fila */
	cursor: not-allowed;
	background: #B9B8B8;
	/* Muestra el cursor "no permitido" al pasar sobre la fila */
}

.my-row-hover .ui-datatable .ui-datatable-data tr.ui-state-hover {
	color: white !important;
	background-color: #186BA0 !important;
}

.center-datatable {
	display: flex;
	justify-content: center;
	align-items: center;
}

.customButon {
	display: block;
	text-decoration: none !important;
}

@media (max-width: 768px) {
	.header-advertencia {
        /* Cambiamos la dirección a columna para apilarlos */
        flex-direction: column-reverse; 
        align-items: center; /* Centramos todo verticalmente */
        justify-content: center;
        height: auto; /* Quitamos la altura mínima fija */
        padding-top: 15px;
    }

    .titulo-advertencia-container {
        /* Desactivamos el posicionamiento absoluto */
        position: static;
        transform: none;
        width: auto;
        margin-top: 10px; /* Espacio entre el logo y el título */
    }
    
    .icono-warning {
        /* Reducimos un poco el icono en móvil */
        max-width: 60px;
    }

    .logo-cnr-container {
        /* Al usar column-reverse, el logo queda arriba automáticamente */
        margin-bottom: 5px;
    }
}


@media ( max-width : 640px) {
	.datatable-mobile-hidden {
		display: none;
	}
	.toggle-button {
		display: block; /* Muestra el botón   */
	}
}

@media ( min-width : 641px) {
	.toggle-button {
		display: none; /* Oculta el botón en dimensiones mayores */
	}
}