/**
 * Reservas Terra Quechua — Tema del formulario público (frontend)
 * Tipografía nueva + refinamiento visual. Sin tocar el bundle compilado:
 * todo se acota al contenedor .frontend-reservation-view.
 *
 * @author Equipo Terra Quechua
 */

.frontend-reservation-view {
    --rtq-primary: #0F4C81;   /* Azul aventura */
    --rtq-accent:  #17A2B8;   /* Aqua */
    --rtq-navy:    #0B1F33;
    --rtq-ink:     #1f2d3d;
    --rtq-muted:   #64748b;
    --rtq-line:    #e6ebf1;
    --rtq-font-head: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --rtq-font-body: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* ====== Tipografía base ====== */
.frontend-reservation-view,
.frontend-reservation-view p,
.frontend-reservation-view span,
.frontend-reservation-view div,
.frontend-reservation-view label,
.frontend-reservation-view li,
.frontend-reservation-view td,
.frontend-reservation-view th,
.frontend-reservation-view a,
.frontend-reservation-view input,
.frontend-reservation-view select,
.frontend-reservation-view textarea,
.frontend-reservation-view button {
    font-family: var(--rtq-font-body) !important;
}

/* Proteger iconos (FontAwesome / Element Plus) */
.frontend-reservation-view i,
.frontend-reservation-view [class*="fa-"],
.frontend-reservation-view .el-icon,
.frontend-reservation-view .el-icon * {
    font-family: inherit !important;
}
.frontend-reservation-view [class^="fa"],
.frontend-reservation-view [class*=" fa-"] {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
}

.frontend-reservation-view {
    background: linear-gradient(180deg, #f4f7fb 0%, #eaf0f6 100%);
    color: var(--rtq-ink);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* ====== Títulos en Poppins ====== */
.frontend-reservation-view h1,
.frontend-reservation-view h2,
.frontend-reservation-view h3,
.frontend-reservation-view h4,
.frontend-reservation-view .book__header-title,
.frontend-reservation-view .summary-amount,
.frontend-reservation-view .price-value,
.frontend-reservation-view .breakdown-total,
.frontend-reservation-view .subtotal-amount {
    font-family: var(--rtq-font-head) !important;
    letter-spacing: -0.01em;
    color: var(--rtq-navy);
}

/* Encabezados de sección (Tour Information / Passenger Information) */
.frontend-reservation-view .card-header-modern {
    opacity: 1;
}
.frontend-reservation-view .card-header-modern h2,
.frontend-reservation-view .card-header-modern h3 {
    font-weight: 700;
}

/* ====== Etiquetas de formulario ====== */
.frontend-reservation-view .form-label-modern {
    color: var(--rtq-navy);
    font-weight: 600;
    font-size: 12px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin-bottom: 7px;
}

/* ====== Tarjetas: más aire, esquinas suaves y sombra en capas ====== */
.frontend-reservation-view .card-modern,
.frontend-reservation-view .professional-card,
.frontend-reservation-view .passenger-card-modern,
.frontend-reservation-view .passenger-card,
.frontend-reservation-view .summary-card,
.frontend-reservation-view .modern-summary-card,
.frontend-reservation-view .booking-summary-card,
.frontend-reservation-view .payment-summary-card,
.frontend-reservation-view .method-card,
.frontend-reservation-view .service-card,
.frontend-reservation-view .confirmation-card {
    border-radius: 16px !important;
    border: 1px solid var(--rtq-line) !important;
    box-shadow: 0 10px 30px rgba(11, 31, 51, 0.06), 0 2px 6px rgba(11, 31, 51, 0.04) !important;
}

/* ====== Inputs / selects / textareas (Element Plus + nativos) ====== */
.frontend-reservation-view .el-input__wrapper,
.frontend-reservation-view .el-select__wrapper,
.frontend-reservation-view .el-textarea__inner {
    border-radius: 10px !important;
    box-shadow: inset 0 0 0 1px var(--rtq-line) !important;
    background: #fff !important;
    transition: box-shadow 0.18s ease;
    padding-top: 3px;
    padding-bottom: 3px;
}
.frontend-reservation-view .el-input__wrapper:hover,
.frontend-reservation-view .el-select__wrapper:hover,
.frontend-reservation-view .el-textarea__inner:hover {
    box-shadow: inset 0 0 0 1px var(--rtq-accent) !important;
}
.frontend-reservation-view .el-input.is-focus .el-input__wrapper,
.frontend-reservation-view .el-input__wrapper.is-focus,
.frontend-reservation-view .el-select__wrapper.is-focused,
.frontend-reservation-view .el-textarea__inner:focus {
    box-shadow: inset 0 0 0 2px var(--rtq-primary), 0 0 0 4px rgba(15, 76, 129, 0.12) !important;
}

/* Inputs nativos, por si algún campo no es Element Plus */
.frontend-reservation-view input:not([type="checkbox"]):not([type="radio"]):not(.el-input__inner),
.frontend-reservation-view textarea:not(.el-textarea__inner) {
    border-radius: 10px;
    border: 1px solid var(--rtq-line);
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}
.frontend-reservation-view input:not([type="checkbox"]):not([type="radio"]):not(.el-input__inner):focus,
.frontend-reservation-view textarea:not(.el-textarea__inner):focus {
    border-color: var(--rtq-primary);
    box-shadow: 0 0 0 4px rgba(15, 76, 129, 0.12);
    outline: none;
}

/* ====== Botones primarios (siguiente / pagar) ====== */
.frontend-reservation-view .el-button--primary,
.frontend-reservation-view .book__pay,
.frontend-reservation-view .book__footer .el-button--primary {
    background-image: linear-gradient(120deg, var(--rtq-primary) 0%, var(--rtq-accent) 100%) !important;
    background-color: var(--rtq-primary) !important;
    border: none !important;
    border-radius: 12px !important;
    font-family: var(--rtq-font-head) !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em;
    box-shadow: 0 8px 20px rgba(15, 76, 129, 0.25);
    transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
}
.frontend-reservation-view .el-button--primary:hover,
.frontend-reservation-view .book__pay:hover {
    transform: translateY(-1px);
    filter: saturate(1.05);
    box-shadow: 0 12px 26px rgba(15, 76, 129, 0.32) !important;
}

/* Botones secundarios */
.frontend-reservation-view .el-button:not(.el-button--primary) {
    border-radius: 12px !important;
    border-color: var(--rtq-line) !important;
    color: var(--rtq-navy) !important;
    font-weight: 600 !important;
}

/* ====== Panel de resumen (Booking Summary) ====== */
.frontend-reservation-view .summary-amount,
.frontend-reservation-view .price-value,
.frontend-reservation-view .breakdown-total {
    color: var(--rtq-primary) !important;
    font-weight: 800 !important;
}
.frontend-reservation-view .price-label,
.frontend-reservation-view .subtotal-label,
.frontend-reservation-view .summary-badge {
    color: var(--rtq-muted);
    letter-spacing: 0.04em;
}

/* ====== Stepper superior ====== */
.frontend-reservation-view .step-circle,
.frontend-reservation-view .el-step__icon,
.frontend-reservation-view .step-label,
.frontend-reservation-view .modern-stepper {
    font-family: var(--rtq-font-head) !important;
}
.frontend-reservation-view .step-circle {
    font-weight: 700;
}

/* Chips / badges de garantía */
.frontend-reservation-view .guarantee-item,
.frontend-reservation-view .summary-guarantee {
    border-radius: 10px;
}