.error-input{
	background: #f7bbf5 !important;
	color: #FFFFFF !important; 
}
.hvr-shrink{
	cursor: pointer;
}

#btn-menu, #btn-menu-config {
	cursor: pointer;
}

#menu-mobile {
    background-color: var(--color-terciario);
    z-index: 2;
    border-right: 5px solid var(--color-texto-1);
}

#menu-mobile li, #menu-mobile-config li{
	border-color: linear-gradient(90deg, rgba(119,74,27,1) 0%, rgba(200,162,79,1) 50%, rgba(119,74,27,1) 100%);
}

#menu-mobile a:hover, #menu-mobile-config a:hover{
	color: #FFFFFF !important;
}

#menu-mobile-config {
    background-color: var(--color-texto-1);
    z-index: 2;
    border-right: 5px solid var(--color-terciario);
}

.selection-panel-activo {
	color: var(--color-terciario) !important;
	border-bottom: 1px solid var(--color-terciario);
}

.selection-panel div{
	cursor: pointer;
}

table thead tr th, table tfoot tr th {
	font-family: 'Gill Sans Bold Final';
	color: var(--color-texto-1);
}

*[readonly=readonly] {
    background-color: #e9ecef;
    opacity: 1;
}

.encabezado-tabla{
    background: rgb(119, 72, 28);
    color: rgb(255, 255, 255);
    font-size: 13px;
}

/*************

Modificacaciones sobre EVENTOS

*************/

.header-prod{
	background-color: #C8A24F;
	background-image: url('../images/up-arrow.png?ver=2');
	background-repeat: no-repeat;
    background-position: 98% 50%;
    color: #FFF;
    font-size: 15px;
    padding: 5px;
    cursor: pointer;
}

/*************

Modificacaciones sobre estilos de vue

*************/

.el-date-editor.el-input{
	width: 100% !important ;
}

.color-dorado, .el-input__inner, .el-range-input{
	color: var(--color-primario) !important;
}

/*************

Estilos para intl-tel-input

*************/

/* Asegurar que el contenedor del input tenga width 100% */
.iti {
	width: 100%;
	display: block;
}

/* Hacer que el input ocupe todo el ancho dentro del contenedor */
.iti__tel-input {
	width: 100%;
	padding-left: 52px !important;
	border: 1px solid #c8a24f !important;
	border-radius: 5px !important;
	height: calc(1.5em + 0.75rem + 2px);
	font-size: 1rem;
	line-height: 1.5;
}

/* Estilos para el selector de país */
.iti__country-list {
	box-shadow: 0 2px 8px rgba(119, 74, 27, 0.2);
	border: 1px solid #c8a24f;
	border-radius: 5px;
	max-height: 200px;
	overflow-y: auto;
}

.iti__country-list .iti__country:hover {
	background-color: rgba(200, 162, 79, 0.1);
}

.iti__country-list .iti__country.iti__highlight {
	background-color: rgba(200, 162, 79, 0.2);
}

/* Estilos para el código de país separado */
.iti__selected-flag {
	padding: 0 8px 0 8px;
}

.iti__selected-dial-code {
	color: rgb(119, 74, 27);
	font-weight: 500;
	margin-left: 6px;
}

/* Validación visual */
.iti__tel-input.is-valid {
	border-color: #28a745 !important;
}

.iti__tel-input.is-invalid {
	border-color: #dc3545 !important;
}

/* Focus state */
.iti__tel-input:focus {
	border-color: #c8a24f !important;
	outline: 0;
	box-shadow: 0 0 0 0.2rem rgba(200, 162, 79, 0.25);
}

/* Ajustes responsive */
@media (max-width: 768px) {
	.iti__tel-input {
		font-size: 16px; /* Previene zoom en iOS */
	}
}