/* 1) Cargar Montserrat desde Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap');

/* 2) Forzar que TODO use Montserrat */
/* Evitamos icon fonts (fa, material-icons, etc.) para no romper iconos */
html, body,
body *:not(i):not(.fa):not([class*="icon"]):not([class*="Icon"]) {
  font-family: 'Montserrat', Arial, sans-serif !important;
}

/* 3) Controles de formulario heredan la fuente */
button, input, select, textarea {
  font-family: inherit !important;
}

/* 4) Refuerzos típicos (por si hay estilos muy específicos en el theme) */
h1, h2, h3, h4, h5, h6,
p, a, li, span, strong, em, small, label,
.nav, .menu, .btn, .button, .site-title, .heading, .title {
  font-family: 'Montserrat', Arial, sans-serif !important;
}

/* 5) Tu área de reservas (por si la app inyecta su propio CSS fuerte) */
html body #events,
html body #eventForm,
html body #timeline-container,
html body .timeline {
  font-family: 'Montserrat', Arial, sans-serif !important;

}

/* TÍTULOS DE EVENTOS */
html body #events h3 {
    font-size: 1.4rem !important;
    color: #B08E6B !important;
    margin-bottom: 0.5em !important;
    font-weight: 600 !important;
}

/* DURACIÓN DEL EVENTO */
html body #events p.duration,
html body #events div.duration {
    font-size: 0.9rem !important;
    color: #E8C39E !important;
    font-style: italic !important;
    margin: 0.3em 0 !important;
}

/* DESCRIPCIÓN DEL EVENTO */
html body #events p.description,
html body #events div.description {
    font-size: 1rem !important;
    color: #B08E6B !important;
    line-height: 1.5 !important;
}

/* EVENTO SELECCIONADO */
html body #events .selectedEvent {
    background-color: #F5E1CE !important;
    border: 2px solid #B08E6B !important;
    border-radius: 6px !important;
    padding: 10px !important;
}

/* BOTÓN RESERVAR */
html body #events input.reserve_time_btn {
    background: #B08E6B !important;
    color: #F0EDE7 !important;
    padding: 8px 14px !important;
    border: none !important;
    border-radius: 5px !important;
    cursor: pointer !important;
    transition: background 0.3s !important;
}
html body #events input.reserve_time_btn:hover {
    background: #E8C39E !important;
    color: #B08E6B !important;
}

/* BOTÓN SELECCIONAR OTRO */
html body #events input.select_another_btn {
    background: #E3DAC9 !important;
    color: #B08E6B !important;
    padding: 8px 14px !important;
    border: none !important;
    border-radius: 5px !important;
    cursor: pointer !important;
    transition: background 0.3s !important;
}
html body #events input.select_another_btn:hover {
    background: #E8C39E !important;
    color: #F0EDE7 !important;
}

/* TÍTULOS DE FORMULARIOS */
html body #eventForm #start_date-block-container h3,
html body #eventForm #timeline-container h3 {
    font-size: 1.2rem !important;
    color: #B08E6B !important;
    border-bottom: 1px solid #E3DAC9 !important;
    padding-bottom: 5px !important;
    margin-bottom: 10px !important;
}

/* BOTÓN GUARDAR */
html body #eventForm #save_button {
    background: #B08E6B !important;
    color: #F0EDE7 !important;
    padding: 10px 18px !important;
    border: none !important;
    border-radius: 5px !important;
    font-size: 1rem !important;
    cursor: pointer !important;
    transition: background 0.3s !important;
}
html body #eventForm #save_button:hover {
    background: #E8C39E !important;
    color: #B08E6B !important;
}

/* ESTILO WIDGETS */
html body div.ui-widget-content {
    background: #F5E1CE !important;
    border: 1px solid #E3DAC9 !important;
    border-radius: 4px !important;
}
html body div.ui-widget-header {
    background: #B08E6B !important;
    color: #F0EDE7 !important;
    padding: 6px 10px !important;
    border-radius: 4px 4px 0 0 !important;
    font-weight: bold !important;
}

/* TABLA DE LA LÍNEA DE TIEMPO */
html body #timeline-container table.timeline {
    width: 100% !important;
    border-collapse: collapse !important;
}
html body .timeline td {
    padding: 6px !important;
    text-align: center !important;
    border: 1px solid #E3DAC9 !important;
    font-size: 0.9rem !important;
}

/* HORAS BLOQUEADAS */
html body .timeline td.not_worked_time {
    background: #E3DAC9 !important;
    color: #B08E6B !important;
}

/* HORAS LIBRES */
html body .timeline td.free_time {
    background: #E8C39E !important;
    color: #B08E6B !important;
    cursor: pointer !important;
}
html body .timeline td.free_time:hover {
    background: #B08E6B !important;
    color: #F0EDE7 !important;
}

/* HORA SELECCIONADA */
html body .timeline td.selected_time {
    background: #B08E6B !important;
    color: #F0EDE7 !important;
    font-weight: bold !important;
}

/* HORAS RESERVADAS */
html body .timeline td.reserved_time {
    background: #B08E6B !important;
    color: #F0EDE7 !important;
}

/* PANTALLA DE CARGA */
html body div#loading {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(240, 237, 231, 0.9) !important;
    z-index: 9999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1.2rem !important;
    color: #B08E6B !important;
}

/* FORMULARIO DE FECHA */
html body #start_date-block-container .zend_form dt,
html body #start_date-block-container .zend_form dt b,
html body #start_date-block-container .zend_form dd label {
    font-size: 0.95rem !important;
    color: #B08E6B !important;
    margin-bottom: 4px !important;
    display: inline-block !important;
}