/* ==========================================================================
   ESTILOS BASE (DISEÑO ORIGINAL)
   ========================================================================== */
   body {
    font-family: 'Montserrat', sans-serif !important;
    color: #333;
    margin: 0;
    padding: 0;
    background-color: #fff;
}

input, select, textarea, button {
    font-family: 'Montserrat', sans-serif !important;
}

.title-main, .section-form-title, h1, h2, h3 {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 500;
}

header.text-center {
    padding: 40px 20px;
}

.title-main {
    color: #444;
    font-size: 2rem;
    margin-bottom: 10px;
}

.subtitle {
    font-size: 0.9rem;
    color: #666;
    max-width: 800px;
    margin: 0 auto;
}

/* BANNER SECTION */
.banner-section {
    background: linear-gradient(90deg, 
        rgba(37, 128, 157, 0.1) 10.69%, 
        rgba(37, 128, 157, 1) 78.89%);
    min-height: 380px;
    display: flex;
    align-items: center;
    padding: 20px 0;
}

.badge-garantia {
    max-width: 320px;
}

/* BUSCADOR */
.buscador-wrapper {
    position: relative;
    max-width: 600px;
}

.buscador-input {
    background-color: #ffffff !important; 
    border: 2px solid #0087A9 !important; 
    border-radius: 50px !important;
    padding: 15px 20px 15px 75px !important; 
    height: 60px;
    font-size: 1.1rem;
    color: #333 !important;
}

.search-container {
    position: absolute;
    left: 25px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    pointer-events: none;
    z-index: 5;
}

.search-container .pi-search {
    color: #878784;
    font-size: 1.2rem;
}

.divider-line {
    width: 1px;
    height: 25px;
    background-color: #0087A9; 
    margin-left: 15px;
    opacity: 0.5;
}

/* FORMULARIO */
.section-form-title {
    color: #444;
    font-size: 2.2rem;
    margin-top: 50px;
}

.custom-form {
    max-width: 900px;
    margin: 0 auto;
}

.form-label {
    font-size: 0.95rem;
    color: #333;
}

.custom-input {
    border-radius: 25px !important;
    border: 1px solid #ced4da !important;
    padding: 12px 15px !important;
    background-color: #fff !important;
}

.btn-submit-final {
    background-color: #007D9F;
    color: white;
    border-radius: 25px;
    padding: 15px;
    font-weight: bold;
    font-size: 1.1rem;
    border: none;
    transition: background 0.3s;
}

.btn-submit-final:hover {
    background-color: #005f7a;
    color: white;
}

/* COLOR AZUL PARA EL ENLACE */
.text-link {
    color: #0082A7 !important;
    text-decoration: none;
    font-weight: 600;
}

.form-check-label {
    font-size: 0.82rem; 
    line-height: 1.4;
    color: #444;
}

/* ==========================================================================
   OVERRIDE PRIMEFACES
   ========================================================================== */

/* Focus Ring para inputs */
.ui-inputfield.ui-state-focus {
    border-color: #0087A9 !important;
    box-shadow: 0 0 0 0.25rem rgba(0, 135, 169, 0.25) !important;
    outline: 0 !important;
}

/* SelectOneMenu */
.custom-input-select.ui-selectonemenu {
    border-radius: 25px !important;
    border: 1px solid #ced4da !important;
    height: 48px !important;
    display: flex;
    align-items: center;
    background: white !important;
}

.custom-input-select.ui-selectonemenu.ui-state-focus {
    border-color: #0087A9 !important;
    box-shadow: 0 0 0 0.25rem rgba(0, 135, 169, 0.25) !important;
}

.ui-selectonemenu .ui-selectonemenu-label {
    padding: 8px 15px !important;
    font-size: 0.95rem;
    text-align: left;
}

.ui-selectonemenu .ui-selectonemenu-trigger {
    background: transparent !important;
    border: none !important;
    width: 35px !important;
}

/* Calendar */
.custom-calendar.ui-calendar {
    position: relative;
    display: block;
    width: 100%;
}

.custom-calendar .ui-inputfield {
    width: 100% !important;
    padding-right: 45px !important;
}

.custom-calendar .ui-datepicker-trigger.ui-button {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent !important;
    border: none !important;
    color: #333 !important;
    padding: 0 !important;
    pointer-events: none; 
}

/* Estilo para días deshabilitados (inferiores a 5 años) */
.ui-datepicker .ui-state-disabled {
    opacity: 0.3;
    background-color: #f8f9fa !important;
}

/* ==========================================================================
   SOLUCIÓN FINAL CHECKBOXES (IDÉNTICO AL ORIGINAL)
   ========================================================================== */

.ui-selectbooleancheckbox.ui-chkbox {
    margin-right: 10px;
    vertical-align: middle;
    display: inline-block;
}

/* El cuadro base */
.ui-selectbooleancheckbox.ui-chkbox .ui-chkbox-box {
    width: 18px !important;
    height: 18px !important;
    border: 2px solid #ced4da !important;
    border-radius: 4px !important;
    background: #fff !important;
    transition: all 0.2s;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Cuando está marcado: Fondo Azul */
.ui-selectbooleancheckbox.ui-chkbox .ui-chkbox-box.ui-state-active {
    background-color: #007D9F !important;
    border-color: #007D9F !important;
}

/* El icono del check: Blanco y visible */
.ui-selectbooleancheckbox.ui-chkbox .ui-chkbox-box .ui-chkbox-icon {
    color: #fff !important;
    font-size: 12px !important;
    font-weight: bold !important;
    display: block !important;
    margin: 0 !important;
    left: auto !important;
    top: auto !important;
}

/* Efecto hover suave */
.ui-selectbooleancheckbox.ui-chkbox .ui-chkbox-box.ui-state-hover {
    border-color: #007D9F !important;
}

/* Foco */
.ui-selectbooleancheckbox.ui-chkbox .ui-chkbox-box.ui-state-focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 125, 159, 0.25) !important;
}

/* ==========================================================================
   BOTÓN FINAL (ESTILO CÁPSULA TURQUESA)
   ========================================================================== */
   .btn-submit-final.ui-button {
    background-color: #0082A7 !important; /* El color exacto del diseño */
    border: none !important;
    border-radius: 50px !important; /* Forma de cápsula completa */
    padding: 12px 40px !important; /* Más aire a los lados */
    color: white !important;
    font-weight: 600 !important;
    font-size: 1.1rem !important;
    transition: background 0.3s ease, transform 0.2s ease !important;
    box-shadow: none !important;
    min-width: 300px; /* Para que tenga presencia como en la imagen */
}

.btn-submit-final.ui-button:hover {
    background-color: #006b8a !important; /* Un tono más oscuro para el feedback visual */
    transform: translateY(-1px); /* Efecto sutil de levante */
}

.btn-submit-final.ui-button:active {
    transform: translateY(0px);
}

/* Quitar el icono que a veces PrimeFaces mete por defecto */
.btn-submit-final.ui-button .ui-button-icon-left {
    display: none !important;
}

/* Centrar el texto correctamente */
.btn-submit-final.ui-button .ui-button-text {
    padding: 0 !important;
    display: inline-block;
}

/* ==========================================================================
   NUEVO BUSCADOR CON BOTÓN INTEGRADO
   ========================================================================== */

   .buscador-wrapper {
    position: relative;
    max-width: 650px; /* Un poco más ancho para que quepa bien el texto y botón */
    margin-top: 20px;
}

.buscador-input {
    background-color: #ffffff !important; 
    border: 2px solid #ffffff !important; /* Borde blanco para que se pierda con el fondo si es necesario, o usa #0087A9 */
    border-radius: 50px !important;
    padding: 15px 120px 15px 75px !important; /* 75px izquierda para icono, 120px derecha para botón */
    height: 60px !important;
    font-size: 1.1rem;
    color: #333 !important;
    width: 100%;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1); /* Sombra suave para resaltar */
}

/* El botón "Validar" dentro del buscador */
.btn-validar-inline.ui-button {
    position: absolute;
    right: 5px; /* Margen interno respecto al borde derecho */
    top: 5px;   /* Margen interno respecto al borde superior */
    bottom: 5px; /* Margen interno respecto al borde inferior */
    background-color: #0082A7 !important;
    border: none !important;
    border-radius: 50px !important; /* Forma de cápsula */
    padding: 0 30px !important;
    color: white !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    z-index: 10;
    height: calc(100% - 10px) !important; /* Se ajusta automáticamente al alto del input */
}

.btn-validar-inline.ui-button:hover {
    background-color: #006b8a !important;
}

/* Ajuste del contenedor de la lupa */
.search-container {
    position: absolute;
    left: 25px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    pointer-events: none;
    z-index: 5;
}

.search-container .pi-search {
    color: #0087A9; /* Color turquesa para la lupa */
    font-size: 1.3rem;
}

.divider-line {
    width: 1px;
    height: 25px;
    background-color: #0087A9; 
    margin-left: 15px;
    opacity: 0.4;
}

/* Asegurar que el focus no rompa el diseño */
.buscador-input:focus {
    border: 2px solid #0087A9 !important;
    outline: none !important;
    box-shadow: 0 0 0 0.25rem rgba(0, 135, 169, 0.2) !important;
}