/* /Modules/EventoCompra/Components/AsientosSeleccionados.razor.rz.scp.css */
.asientos-seleccionados-container[b-oqc3v1h89i] {
    background-color: #f8f9fa;
    border-radius: 8px;
    padding: 20px;
    margin: 20px 0;
    border: 1px solid #dee2e6;
}

.asientos-seleccionados-title[b-oqc3v1h89i] {
    color: #495057;
    font-weight: 600;
    margin-bottom: 15px;
    border-bottom: 2px solid #007bff;
    padding-bottom: 10px;
}

.asiento-item[b-oqc3v1h89i] {
    background-color: white;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 12px;
    margin-bottom: 8px;
    transition: all 0.2s ease;
}

.asiento-item:hover[b-oqc3v1h89i] {
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.1);
    border-color: #007bff;
}

.asiento-icon[b-oqc3v1h89i] {
    color: #007bff;
    margin-right: 8px;
}

.asiento-nombre[b-oqc3v1h89i] {
    font-weight: 600;
    color: #212529;
}

.asiento-sector[b-oqc3v1h89i] {
    color: #6c757d;
    font-size: 0.9em;
}

.asiento-precio[b-oqc3v1h89i] {
    font-weight: 700;
    color: #28a745;
}

.btn-eliminar-asiento[b-oqc3v1h89i] {
    background-color: #dc3545;
    border-color: #dc3545;
    color: white;
    font-size: 0.8em;
    padding: 4px 8px;
    transition: all 0.2s ease;
}

.btn-eliminar-asiento:hover[b-oqc3v1h89i] {
    background-color: #c82333;
    border-color: #bd2130;
    transform: scale(1.05);
}

.resumen-card[b-oqc3v1h89i] {
    background: linear-gradient(135deg, #007bff, #0056b3);
    color: white;
    border-radius: 8px;
    padding: 15px;
    box-shadow: 0 4px 12px rgba(0, 123, 255, 0.2);
}

.resumen-title[b-oqc3v1h89i] {
    font-weight: 600;
    margin-bottom: 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    padding-bottom: 8px;
}

.resumen-item[b-oqc3v1h89i] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 5px;
    font-size: 0.9em;
}

.resumen-total[b-oqc3v1h89i] {
    font-weight: 700;
    font-size: 1.1em;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
}

.alert-info[b-oqc3v1h89i] {
    background-color: #d1ecf1;
    border-color: #bee5eb;
    color: #0c5460;
    border-radius: 6px;
    padding: 15px;
    text-align: center;
}

.alert-info i[b-oqc3v1h89i] {
    color: #17a2b8;
    margin-right: 8px;
}

.table-container[b-oqc3v1h89i] {
    background-color: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.table-header[b-oqc3v1h89i] {
    background-color: #007bff;
    color: white;
    font-weight: 600;
}

.table-row[b-oqc3v1h89i] {
    border-bottom: 1px solid #dee2e6;
}

.table-row:last-child[b-oqc3v1h89i] {
    border-bottom: none;
}

.table-cell[b-oqc3v1h89i] {
    padding: 12px;
    vertical-align: middle;
} 
/* /Modules/EventoCompra/Components/Confirmacion.razor.rz.scp.css */
.Validacion-check[b-x5obu9fb1v] {
    color: red;
}
/* /Modules/EventoCompra/Components/ContenedorEventoCompra.razor.rz.scp.css */
.temporizador[b-vmiwczb67t] {
    border-top: 1px solid black;
}

.row[b-vmiwczb67t] {
    padding-top: 20px;
}
/* /Modules/EventoCompra/Components/DatosCompraItem.razor.rz.scp.css */
.fo.form-floating[b-0fulsgbdev] {
    position: relative;
}

.form-floating input[b-0fulsgbdev] {
    padding-top: 1.5rem; /* Asegúrate de que el padding sea suficiente para el label flotante */
}

.form-floating label[b-0fulsgbdev] {
    position: absolute;
    top: 0;
    left: 0;
    padding: 0.75rem;
    pointer-events: none; /* El label no debe interferir con el input */
    transition: all 0.2s ease-in-out; /* Transición suave para el label */
}

.form-floating input:focus ~ label[b-0fulsgbdev],
.form-floating input:not(:placeholder-shown) ~ label[b-0fulsgbdev] {
    top: -0.75rem; /* Ajusta la posición del label cuando el input está en foco o tiene texto */
    left: 0;
    font-size: 0.75rem;
    color: #6c757d; /* Color del label cuando el input está en foco */
}

.form-floating > .form-control:focus[b-0fulsgbdev], .form-floating > .form-control:not(:placeholder-shown)[b-0fulsgbdev], .form-floating > .form-control-plaintext:focus[b-0fulsgbdev], .form-floating > .form-control-plaintext:not(:placeholder-shown)[b-0fulsgbdev] {
     padding-top: 0px !important; 
     padding-bottom: 0px !important; 
}

/* ========================================
   OPTIMIZACIONES MÓVILES PARA DATOS DE COMPRA
   ======================================== */
@media (max-width: 48rem) {
    /* Contenedor de ticket */
    .d-inline.p-2[b-0fulsgbdev] {
        padding: 0.5rem 0.75rem !important;
        font-size: 0.875rem !important;
        border-radius: 0.375rem !important;
    }
    
    /* Separador */
    div[style*="border-bottom: 1px solid #000"][b-0fulsgbdev] {
        margin-bottom: 1.5rem !important;
    }
    
    /* Título del ticket */
    div[style*="font-weight: 700"][b-0fulsgbdev] {
        margin-bottom: 1rem !important;
        padding: 0 0.5rem !important;
    }
    
    /* Columnas del formulario */
    .col-lg-6[b-0fulsgbdev] {
        padding: 0 0.5rem !important;
        margin-bottom: 1rem !important;
    }
    
    /* Campos de formulario */
    .form-floating[b-0fulsgbdev] {
        margin-bottom: 1rem !important;
    }
    
    .form-floating input[b-0fulsgbdev] {
        padding: 1rem 0.75rem !important;
        font-size: 1rem !important;
        min-height: 3rem !important;
        border-radius: 0.5rem !important;
    }
    
    .form-floating label[b-0fulsgbdev] {
        padding: 0.75rem !important;
        font-size: 0.875rem !important;
    }
    
    /* Labels personalizados */
    .label-container[b-0fulsgbdev] {
        margin-bottom: 0.5rem !important;
    }
    
    .label-text[b-0fulsgbdev] {
        font-size: 0.875rem !important;
        font-weight: 600 !important;
    }
    
    /* Mensajes de error */
    .invalid-feedback[b-0fulsgbdev] {
        font-size: 0.75rem !important;
        margin-top: 0.25rem !important;
    }
    
    /* Botones de acción */
    .btn[b-0fulsgbdev] {
        min-height: 3rem !important;
        font-size: 0.875rem !important;
        border-radius: 0.5rem !important;
        padding: 0.75rem 1rem !important;
    }
    
    /* Espaciado entre secciones */
    .mb-5[b-0fulsgbdev] {
        margin-bottom: 1.5rem !important;
    }
    
    /* Mejorar legibilidad de inputs */
    .form-control[b-0fulsgbdev] {
        border: 1px solid #ced4da !important;
        transition: all 0.2s ease !important;
    }
    
    .form-control:focus[b-0fulsgbdev] {
        border-color: #ffcc03 !important;
        box-shadow: 0 0 0 0.125rem rgba(255, 204, 3, 0.25) !important;
    }
    
    /* Sombras más sutiles */
    .shadow-sm[b-0fulsgbdev] {
        box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
    }
}

/* ========================================
   PANTALLAS MUY PEQUEÑAS
   ======================================== */
@media (max-width: 20rem) {
    .col-lg-6[b-0fulsgbdev] {
        padding: 0 0.25rem !important;
    }
    
    .form-floating input[b-0fulsgbdev] {
        padding: 0.875rem 0.5rem !important;
        font-size: 0.875rem !important;
    }
    
    .label-text[b-0fulsgbdev] {
        font-size: 0.8rem !important;
    }
    
    .d-inline.p-2[b-0fulsgbdev] {
        padding: 0.375rem 0.5rem !important;
        font-size: 0.8rem !important;
    }
}

/* ========================================
   ORIENTACIÓN LANDSCAPE
   ======================================== */
@media (max-width: 48rem) and (orientation: landscape) {
    .col-lg-6[b-0fulsgbdev] {
        margin-bottom: 0.75rem !important;
    }
    
    .form-floating[b-0fulsgbdev] {
        margin-bottom: 0.75rem !important;
    }
    
    .mb-5[b-0fulsgbdev] {
        margin-bottom: 1rem !important;
    }
}
/* /Modules/EventoCompra/Components/ErrorCompra.razor.rz.scp.css */
.error-compra-container[b-ntai0ns89e] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 2rem;
}

.error-compra-card[b-ntai0ns89e] {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    padding: 3rem;
    text-align: center;
    max-width: 500px;
    width: 100%;
}

.error-icon[b-ntai0ns89e] {
    margin-bottom: 1.5rem;
}

.error-icon i[b-ntai0ns89e] {
    font-size: 4rem;
    color: #dc3545;
}

.error-title[b-ntai0ns89e] {
    color: #dc3545;
    font-size: 1.75rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.error-message[b-ntai0ns89e] {
    color: #6c757d;
    font-size: 1.1rem;
    margin-bottom: 1rem;
    line-height: 1.5;
}

.error-help[b-ntai0ns89e] {
    color: #6c757d;
    font-size: 0.95rem;
    margin-bottom: 2rem;
    line-height: 1.4;
    font-style: italic;
}

.error-actions[b-ntai0ns89e] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

.error-actions .btn[b-ntai0ns89e] {
    min-width: 120px;
    padding: 0.75rem 1.5rem;
    font-weight: 500;
}

@media (max-width: 576px) {
    .error-compra-container[b-ntai0ns89e] {
        padding: 1rem;
    }
    
    .error-compra-card[b-ntai0ns89e] {
        padding: 2rem 1.5rem;
    }
    
    .error-actions[b-ntai0ns89e] {
        flex-direction: column;
        align-items: center;
    }
    
    .error-actions .btn[b-ntai0ns89e] {
        width: 100%;
        max-width: 200px;
    }
} 
/* /Modules/EventoCompra/Components/ExtraSeleccion.razor.rz.scp.css */
/* Contenedor principal del componente */
.ticket-extra-container[b-itnu8tn8yp] {
    background-color: #f8f9fa;
    border-radius: 12px;
    padding: 20px;
    margin-bottom: 20px;
    border: 1px solid #dee2e6;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

/* Header del ticket */
.ticket-header[b-itnu8tn8yp] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.ticket-price[b-itnu8tn8yp] {
    font-weight: 700;
    color: #000;
    font-size: 1.1rem;
    margin-left: auto;
}

.ticket-details[b-itnu8tn8yp] {
    margin-bottom: 20px;
}

/* Sección de extras seleccionados - más compacta */
.extras-seleccionados-section[b-itnu8tn8yp] {
    margin-top: 10px;
    margin-bottom: 15px;
    padding: 10px;
    background-color: rgba(255, 204, 3, 0.1);
    border-radius: 6px;
    border: 1px solid rgba(255, 204, 3, 0.3);
}

.extras-seleccionados-title[b-itnu8tn8yp] {
    color: #000;
    font-weight: 600;
    margin-bottom: 8px;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.extras-seleccionados-list[b-itnu8tn8yp] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.extra-seleccionado-item[b-itnu8tn8yp] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 10px;
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 4px;
    border: 1px solid rgba(255, 204, 3, 0.2);
    transition: all 0.2s ease;
}

.extra-seleccionado-item:hover[b-itnu8tn8yp] {
    background-color: rgba(255, 255, 255, 0.95);
    border-color: rgba(255, 204, 3, 0.4);
}

.extra-seleccionado-info[b-itnu8tn8yp] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1;
}

.extra-seleccionado-nombre[b-itnu8tn8yp] {
    font-weight: 600;
    color: #000;
    font-size: 0.85rem;
}

.extra-seleccionado-cantidad[b-itnu8tn8yp] {
    color: #6c757d;
    font-size: 0.75rem;
    background-color: rgba(108, 117, 125, 0.1);
    padding: 1px 4px;
    border-radius: 3px;
}

.extra-seleccionado-precio[b-itnu8tn8yp] {
    font-weight: 700;
    color: #000;
    font-size: 0.85rem;
    margin-right: 6px;
}

/* Sección de extras */
.extras-section[b-itnu8tn8yp] {
    margin-top: 20px;
}

.extras-title[b-itnu8tn8yp] {
    color: #495057;
    font-weight: 600;
    margin-bottom: 5px;
}

.extras-count[b-itnu8tn8yp] {
    color: #6c757d;
    font-size: 0.9rem;
    margin-bottom: 15px;
}

/* Grid de extras - una columna para ocupar menos espacio */
.extras-grid[b-itnu8tn8yp] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Tarjeta de extra - diseño más compacto en fila */
.extra-card[b-itnu8tn8yp] {
    background: white;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    padding: 12px;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
    min-height: 60px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.extra-card:hover[b-itnu8tn8yp] {
    border-color: #ffcc03;
    box-shadow: 0 2px 8px rgba(255, 204, 3, 0.2);
    transform: translateY(-1px);
}

.extra-card.selected[b-itnu8tn8yp] {
    border-color: #ffcc03;
    background-color: rgba(255, 204, 3, 0.05);
    box-shadow: 0 2px 6px rgba(255, 204, 3, 0.15);
}

.extra-card.disabled[b-itnu8tn8yp] {
    opacity: 0.6;
    cursor: not-allowed;
    background-color: #f8f9fa;
    box-shadow: none;
}

.extra-card.disabled:hover[b-itnu8tn8yp] {
    transform: none;
    box-shadow: none;
    border-color: #e9ecef;
}

/* Icono del extra - más pequeño para diseño compacto */
.extra-icon[b-itnu8tn8yp] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ffcc03, #ffcc03);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.extra-icon i[b-itnu8tn8yp] {
    font-size: 1.2rem;
    color: #212529;
}

/* Contenido del extra */
.extra-content[b-itnu8tn8yp] {
    flex: 1;
    min-width: 0;
}

.extra-name[b-itnu8tn8yp] {
    font-weight: 600;
    color: #212529;
    margin-bottom: 3px;
    font-size: 0.95rem;
}

.extra-description[b-itnu8tn8yp] {
    color: #6c757d;
    font-size: 0.8rem;
    margin-bottom: 4px;
    line-height: 1.3;
}

.extra-price[b-itnu8tn8yp] {
    font-weight: 700;
    color: #000;
    font-size: 1rem;
}

/* Acciones del extra */
.extra-actions[b-itnu8tn8yp] {
    flex-shrink: 0;
}

/* Controles de cantidad */
.quantity-controls[b-itnu8tn8yp] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f8f9fa;
    border-radius: 6px;
    padding: 5px;
}

.quantity-controls .btn[b-itnu8tn8yp] {
    width: 30px;
    height: 30px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    font-size: 0.8rem;
}

.quantity-display[b-itnu8tn8yp] {
    min-width: 30px;
    text-align: center;
    font-weight: 600;
    color: #495057;
}

/* Mensaje cuando no hay extras */
.no-extras-message[b-itnu8tn8yp] {
    text-align: center;
    padding: 40px 20px;
    color: #6c757d;
}

.no-extras-message i[b-itnu8tn8yp] {
    font-size: 3rem;
    margin-bottom: 15px;
    color: #dee2e6;
}

.no-extras-message p[b-itnu8tn8yp] {
    font-size: 1.1rem;
    margin: 0;
}

/* Mensaje cuando no hay datos */
.no-data-message[b-itnu8tn8yp] {
    text-align: center;
    padding: 60px 20px;
    color: #6c757d;
}

.no-data-message i[b-itnu8tn8yp] {
    font-size: 4rem;
    margin-bottom: 20px;
    color: #ffcc03;
}

.no-data-message p[b-itnu8tn8yp] {
    font-size: 1.2rem;
    margin: 0;
}

/* Resumen de compra - Actualizado: 2024-12-19 */
.resumen-compra[b-itnu8tn8yp] {
    background: linear-gradient(135deg, #ffcc03, #ffcc03) !important;
    color: #000 !important;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 4px 20px rgba(255, 204, 3, 0.3) !important;
    position: sticky;
    top: 20px;
    border: 2px solid #000 !important;
}

/* Nueva clase para evitar conflictos */
.resumen-compra-dorado[b-itnu8tn8yp] {
    background: linear-gradient(135deg, #ffcc03, #ffcc03) !important;
    color: #000 !important;
    border-radius: 12px;
    padding: 25px;
    box-shadow: 0 4px 20px rgba(255, 204, 3, 0.3) !important;
    position: sticky;
    top: 20px;
    border: 2px solid #000 !important;
}

.resumen-title[b-itnu8tn8yp] {
    font-weight: 600;
    margin-bottom: 5px;
    font-size: 1.3rem;
}

.resumen-subtitle[b-itnu8tn8yp] {
    color: rgba(0, 0, 0, 0.7);
    font-size: 0.9rem;
    margin-bottom: 20px;
    font-weight: 500;
}

/* Tickets en resumen */
.resumen-tickets[b-itnu8tn8yp] {
    margin-bottom: 20px;
}

.resumen-ticket[b-itnu8tn8yp] {
    background: rgba(255, 204, 3, 0.2);
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.ticket-info[b-itnu8tn8yp] {
    flex: 1;
    width: 100%;
}

.ticket-name[b-itnu8tn8yp] {
    font-weight: 600;
    margin-bottom: 3px;
    color: #000;
}

.ticket-details[b-itnu8tn8yp] {
    font-size: 0.85rem;
    color: rgba(0, 0, 0, 0.7);
    margin-bottom: 8px;
}

.ticket-price-bottom[b-itnu8tn8yp] {
    font-weight: 700;
    color: #000;
    font-size: 1rem;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(0, 0, 0, 0.15);
    text-align: right;
}

/* Extras en resumen - dentro del ticket */
.extras-resumen-dentro-ticket[b-itnu8tn8yp] {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.extra-resumen-item-dentro[b-itnu8tn8yp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 0;
    font-size: 0.8rem;
    color: rgba(0, 0, 0, 0.8);
    margin-bottom: 2px;
}

.extra-name-dentro[b-itnu8tn8yp] {
    flex: 1;
    font-weight: 500;
}

.extra-quantity-dentro[b-itnu8tn8yp] {
    margin: 0 8px;
    color: rgba(0, 0, 0, 0.6);
    font-size: 0.75rem;
}

.extra-price-dentro[b-itnu8tn8yp] {
    font-weight: 600;
    color: #000;
}

/* Extras en resumen - versión anterior (mantener por compatibilidad) */
.extras-resumen[b-itnu8tn8yp] {
    margin-left: 15px;
    margin-bottom: 10px;
}

.extra-resumen-item[b-itnu8tn8yp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.9);
}

.extra-name[b-itnu8tn8yp] {
    flex: 1;
}

.extra-quantity[b-itnu8tn8yp] {
    margin: 0 10px;
    color: rgba(255, 255, 255, 0.7);
}

.extra-price[b-itnu8tn8yp] {
    font-weight: 600;
}

/* Total del resumen */
.resumen-total[b-itnu8tn8yp] {
    border-top: 2px solid rgba(0, 0, 0, 0.3);
    padding-top: 15px;
}

.total-line[b-itnu8tn8yp] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
    font-size: 0.9rem;
}

.total-final[b-itnu8tn8yp] {
    display: flex;
    justify-content: space-between;
    font-weight: 700;
    font-size: 1.1rem;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
}

/* Responsive Design */
@media (max-width: 768px) {
    .extra-card[b-itnu8tn8yp] {
        flex-direction: column;
        text-align: center;
        gap: 8px;
        padding: 10px;
    }
    
    .extra-content[b-itnu8tn8yp] {
        order: 2;
    }
    
    .extra-actions[b-itnu8tn8yp] {
        order: 3;
    }
    
    .ticket-header[b-itnu8tn8yp] {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }
    
    .ticket-price[b-itnu8tn8yp] {
        margin-left: 0;
    }
    
    .resumen-compra[b-itnu8tn8yp],
    .resumen-compra-dorado[b-itnu8tn8yp] {
        position: static;
        margin-top: 20px;
    }
    
    .extra-seleccionado-item[b-itnu8tn8yp] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
    }
    
    .extra-seleccionado-info[b-itnu8tn8yp] {
        width: 100%;
        justify-content: space-between;
    }
    
    .extra-seleccionado-precio[b-itnu8tn8yp] {
        margin-right: 0;
        margin-bottom: 5px;
    }
    
    .extra-resumen-item-dentro[b-itnu8tn8yp] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
    
    .extra-name-dentro[b-itnu8tn8yp] {
        width: 100%;
    }
    
    .extra-quantity-dentro[b-itnu8tn8yp] {
        margin: 0;
    }
}

@media (max-width: 576px) {
    .ticket-extra-container[b-itnu8tn8yp] {
        padding: 15px;
    }
    
    .extra-card[b-itnu8tn8yp] {
        padding: 12px;
    }
    
    .extra-icon[b-itnu8tn8yp] {
        width: 35px;
        height: 35px;
    }
    
    .extra-icon i[b-itnu8tn8yp] {
        font-size: 1rem;
    }
    
    .resumen-compra[b-itnu8tn8yp],
    .resumen-compra-dorado[b-itnu8tn8yp] {
        padding: 20px;
    }
    
    .quantity-controls .btn[b-itnu8tn8yp] {
        width: 25px;
        height: 25px;
        font-size: 0.7rem;
    }
    
    .quantity-display[b-itnu8tn8yp] {
        min-width: 25px;
        font-size: 0.9rem;
    }
}

/* Animaciones */
@keyframes fadeIn-b-itnu8tn8yp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.extra-card[b-itnu8tn8yp] {
    animation: fadeIn-b-itnu8tn8yp 0.3s ease-out;
}

/* Estados de carga */
.loading-spinner[b-itnu8tn8yp] {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px;
}

.loading-spinner i[b-itnu8tn8yp] {
    font-size: 2rem;
    color: #ffcc03;
    animation: spin-b-itnu8tn8yp 1s linear infinite;
}

@keyframes spin-b-itnu8tn8yp {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Mejoras de accesibilidad */
.extra-card:focus-within[b-itnu8tn8yp] {
    outline: 2px solid #ffcc03;
    outline-offset: 2px;
}

.btn:focus[b-itnu8tn8yp] {
    box-shadow: 0 0 0 0.2rem rgba(255, 204, 3, 0.25);
}

/* Indicadores de disponibilidad */
.extra-card[b-itnu8tn8yp]::before {
    content: '';
    position: absolute;
    top: 10px;
    right: 10px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #ffcc03;
}

.extra-card.disabled[b-itnu8tn8yp]::before {
    background-color: #6c757d;
}

.extra-card.selected[b-itnu8tn8yp]::before {
    background-color: #ffcc03;
}

/* Estilos para extras incluidos automáticamente - Color más neutro que combine con el resumen */
.extra-incluido[b-itnu8tn8yp] {
    background-color: rgba(70, 130, 180, 0.1) !important;
    border-color: rgba(70, 130, 180, 0.3) !important;
    position: relative;
}

.extra-incluido[b-itnu8tn8yp]::after {
    content: 'INCLUIDO';
    position: absolute;
    top: 5px;
    right: 5px;
    background-color: #4682b4;
    color: white;
    font-size: 0.6rem;
    font-weight: bold;
    padding: 2px 6px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.extra-incluido .extra-seleccionado-nombre[b-itnu8tn8yp] {
    color: #4682b4 !important;
    font-weight: 700;
}

.extra-incluido .badge[b-itnu8tn8yp] {
    background-color: #4682b4 !important;
    color: white !important;
    font-size: 0.6rem;
    padding: 2px 6px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-left: 8px;
}

/* Nueva clase para color de extras incluidos - más acorde con el resumen */
.extras-incluidos-color[b-itnu8tn8yp] {
    color: #000 !important;
}

/* Badge para extras incluidos - color más neutro */
.badge-included[b-itnu8tn8yp] {
    background-color: #ffb300 !important;
    color: #000 !important;
    font-size: 0.7rem;
    padding: 2px 6px;
    border-radius: 3px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    font-weight: 700;
}

/* Estilos para el resumen de extras incluidos */
.extra-incluido-resumen[b-itnu8tn8yp] {
    background-color: rgba(255, 179, 0, 0.15);
    border-radius: 4px;
    padding: 4px 8px;
    margin: 2px 0;
}

.extra-incluido-resumen .extra-name-dentro[b-itnu8tn8yp] {
    color: #000 !important;
    font-weight: 600;
}

.extra-incluido-resumen .badge[b-itnu8tn8yp] {
    background-color: #ffb300 !important;
    color: #000 !important;
    font-size: 0.5rem;
    padding: 1px 4px;
    border-radius: 2px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-left: 4px;
    font-weight: 700;
}

/* Icono de candado para extras incluidos */
.extra-incluido .fa-lock[b-itnu8tn8yp] {
    color: #ffb300;
    font-size: 0.8rem;
}

/* Hover effects para extras incluidos */
.extra-incluido:hover[b-itnu8tn8yp] {
    background-color: rgba(255, 179, 0, 0.2) !important;
    border-color: rgba(255, 179, 0, 0.4) !important;
}

/* Sección de información de extras incluidos */
.extras-incluidos-info[b-itnu8tn8yp] {
    background-color: rgba(255, 179, 0, 0.1);
    border: 1px solid rgba(255, 179, 0, 0.3);
    border-radius: 8px;
    padding: 15px;
    margin-top: 15px;
}

.extras-incluidos-list[b-itnu8tn8yp] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 10px;
}

.extra-incluido-info[b-itnu8tn8yp] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background-color: rgba(255, 179, 0, 0.15);
    border-radius: 6px;
    border-left: 3px solid #ffb300;
}

.extra-incluido-nombre[b-itnu8tn8yp] {
    flex: 1;
    font-weight: 600;
    color: #000;
}

.extra-incluido-cantidad[b-itnu8tn8yp] {
    background-color: rgba(255, 179, 0, 0.25);
    color: #000;
    padding: 2px 6px;
    border-radius: 3px;
    font-size: 0.8rem;
    font-weight: 600;
}

.extra-incluido-precio[b-itnu8tn8yp] {
    font-weight: 700;
    color: #000;
}

/* Mejoras para badges */
.badge-sm[b-itnu8tn8yp] {
    font-size: 0.7rem;
    padding: 2px 6px;
}

/* Mejoras para el título de extras seleccionados */
.extras-seleccionados-title[b-itnu8tn8yp] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* Estilos para alertas de disponibilidad */
.text-warning[b-itnu8tn8yp] {
    color: #ffc107 !important;
}

/* Mejoras para iconos */
.fa-gift[b-itnu8tn8yp] {
    color: #ffb300;
}

.fa-check-circle[b-itnu8tn8yp] {
    color: #ffb300;
}

/* ========================================
   DISEÑO MÓVIL PARA SELECCIÓN DE EXTRAS
   ======================================== */
@media (max-width: 48rem) {
    /* Contenedor principal de selección de extras móvil */
    .mobile-extras-selection[b-itnu8tn8yp] {
        display: block !important;
        padding: 0 0.75rem !important;
        margin-bottom: 2rem !important;
    }
    
    /* Ocultar vista desktop en móvil */
    .d-none.d-md-block[b-itnu8tn8yp] {
        display: none !important;
    }
    
    /* Contenedor de selección de extras */
    .extras-selection-container[b-itnu8tn8yp] {
        padding: 0 !important;
        margin-bottom: 2rem !important;
    }
    
    /* Título principal */
    .extras-selection-title[b-itnu8tn8yp] {
        font-size: 1.25rem !important;
        font-weight: 700 !important;
        color: #2c3e50 !important;
        margin: 1.5rem 0 0.5rem 0 !important;
        text-align: center !important;
        line-height: 1.3 !important;
    }
    
    /* Subtítulo */
    .extras-selection-subtitle[b-itnu8tn8yp] {
        font-size: 0.9rem !important;
        color: #6c757d !important;
        text-align: center !important;
        margin-bottom: 1.5rem !important;
        line-height: 1.4 !important;
    }
    
    /* Contenedor de tarjetas de extras */
    .extras-cards-container[b-itnu8tn8yp] {
        display: flex !important;
        flex-direction: column !important;
        gap: 1.5rem !important;
        margin-top: 1rem !important;
    }
    
    /* Tarjeta individual de ticket con extras */
    .extras-ticket-card[b-itnu8tn8yp] {
        background: #ffffff !important;
        border: 1px solid #e1e8ed !important;
        border-radius: 12px !important;
        padding: 1.25rem !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
        transition: all 0.3s ease !important;
        position: relative !important;
        overflow: hidden !important;
    }
    
    .extras-ticket-card:hover[b-itnu8tn8yp] {
        box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12) !important;
        transform: translateY(-2px) !important;
    }
    
    /* Header de la tarjeta de ticket */
    .extras-ticket-header[b-itnu8tn8yp] {
        display: flex !important;
        flex-direction: column !important;
        gap: 0.5rem !important;
        margin-bottom: 1.25rem !important;
        padding-bottom: 1rem !important;
        border-bottom: 1px solid #e9ecef !important;
    }
    
    .ticket-badge[b-itnu8tn8yp] {
        background-color: #ffcc03 !important;
        color: #000 !important;
        padding: 0.375rem 0.75rem !important;
        border-radius: 0.375rem !important;
        font-size: 0.75rem !important;
        font-weight: 700 !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
        align-self: flex-start !important;
    }
    
    .ticket-location[b-itnu8tn8yp] {
        font-size: 1.125rem !important;
        font-weight: 600 !important;
        color: #2c3e50 !important;
        margin: 0 !important;
    }
    
    .ticket-price[b-itnu8tn8yp] {
        font-size: 1.25rem !important;
        font-weight: 800 !important;
        color: #000 !important;
        margin: 0 !important;
    }
    
    /* Sección de extras incluidos */
    .extras-included-section[b-itnu8tn8yp] {
        margin-bottom: 1.25rem !important;
        padding: 1rem !important;
        background: rgba(255, 179, 0, 0.1) !important;
        border: 1px solid rgba(255, 179, 0, 0.3) !important;
        border-radius: 8px !important;
    }
    
    .extras-included-title[b-itnu8tn8yp] {
        font-size: 0.9rem !important;
        font-weight: 600 !important;
        color: #000 !important;
        margin-bottom: 0.75rem !important;
        display: flex !important;
        align-items: center !important;
        gap: 0.5rem !important;
    }
    
    .extras-included-list[b-itnu8tn8yp] {
        display: flex !important;
        flex-direction: column !important;
        gap: 0.5rem !important;
    }
    
    .extra-included-item[b-itnu8tn8yp] {
        display: flex !important;
        align-items: center !important;
        gap: 0.75rem !important;
        padding: 0.5rem !important;
        background: rgba(255, 179, 0, 0.15) !important;
        border-radius: 6px !important;
        border-left: 3px solid #ffb300 !important;
    }
    
    .extra-included-item i[b-itnu8tn8yp] {
        color: #ffb300 !important;
        font-size: 0.9rem !important;
    }
    
    .extra-included-name[b-itnu8tn8yp] {
        flex: 1 !important;
        font-weight: 600 !important;
        color: #000 !important;
        font-size: 0.85rem !important;
    }
    
    .extra-included-quantity[b-itnu8tn8yp] {
        background: rgba(255, 179, 0, 0.25) !important;
        color: #000 !important;
        padding: 0.125rem 0.375rem !important;
        border-radius: 3px !important;
        font-size: 0.75rem !important;
        font-weight: 600 !important;
    }
    
    /* Sección de extras seleccionados */
    .extras-selected-section[b-itnu8tn8yp] {
        margin-bottom: 1.25rem !important;
        padding: 1rem !important;
        background: rgba(255, 204, 3, 0.05) !important;
        border: 1px solid rgba(255, 204, 3, 0.2) !important;
        border-radius: 8px !important;
    }
    
    .extras-selected-title[b-itnu8tn8yp] {
        font-size: 0.9rem !important;
        font-weight: 600 !important;
        color: #000 !important;
        margin-bottom: 0.75rem !important;
        display: flex !important;
        align-items: center !important;
        gap: 0.5rem !important;
        flex-wrap: wrap !important;
    }
    
    .extras-selected-list[b-itnu8tn8yp] {
        display: flex !important;
        flex-direction: column !important;
        gap: 0.5rem !important;
    }
    
    .extra-selected-item[b-itnu8tn8yp] {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 0.75rem !important;
        background: rgba(255, 255, 255, 0.8) !important;
        border-radius: 6px !important;
        border: 1px solid rgba(255, 204, 3, 0.2) !important;
        transition: all 0.2s ease !important;
    }
    
    .extra-selected-item:hover[b-itnu8tn8yp] {
        background: rgba(255, 255, 255, 0.95) !important;
        border-color: rgba(255, 204, 3, 0.4) !important;
    }
    
    .extra-selected-info[b-itnu8tn8yp] {
        display: flex !important;
        align-items: center !important;
        gap: 0.5rem !important;
        flex: 1 !important;
    }
    
    .extra-selected-name[b-itnu8tn8yp] {
        font-weight: 600 !important;
        color: #000 !important;
        font-size: 0.85rem !important;
    }
    
    .extra-selected-quantity[b-itnu8tn8yp] {
        color: #6c757d !important;
        font-size: 0.75rem !important;
        background: rgba(108, 117, 125, 0.1) !important;
        padding: 0.125rem 0.375rem !important;
        border-radius: 3px !important;
    }
    
    .extra-selected-price[b-itnu8tn8yp] {
        font-weight: 700 !important;
        color: #000 !important;
        font-size: 0.85rem !important;
        margin-right: 0.5rem !important;
    }
    
    /* Sección de extras disponibles */
    .extras-available-section[b-itnu8tn8yp] {
        margin-bottom: 1.25rem !important;
    }
    
    .extras-available-title[b-itnu8tn8yp] {
        font-size: 0.9rem !important;
        font-weight: 600 !important;
        color: #495057 !important;
        margin-bottom: 0.75rem !important;
    }
    
    .extras-available-list[b-itnu8tn8yp] {
        display: flex !important;
        flex-direction: column !important;
        gap: 0.75rem !important;
    }
    
    /* Tarjeta de extra disponible */
    .extra-available-card[b-itnu8tn8yp] {
        background: white !important;
        border: 1px solid #e9ecef !important;
        border-radius: 8px !important;
        padding: 1rem !important;
        transition: all 0.3s ease !important;
        display: flex !important;
        align-items: center !important;
        gap: 0.75rem !important;
        position: relative !important;
        min-height: 60px !important;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
    }
    
    .extra-available-card:hover[b-itnu8tn8yp] {
        border-color: #ffcc03 !important;
        box-shadow: 0 2px 8px rgba(255, 204, 3, 0.2) !important;
        transform: translateY(-1px) !important;
    }
    
    .extra-available-card.selected[b-itnu8tn8yp] {
        border-color: #ffcc03 !important;
        background-color: rgba(255, 204, 3, 0.05) !important;
        box-shadow: 0 2px 6px rgba(255, 204, 3, 0.15) !important;
    }
    
    .extra-available-card.disabled[b-itnu8tn8yp] {
        opacity: 0.6 !important;
        cursor: not-allowed !important;
        background-color: #f8f9fa !important;
        box-shadow: none !important;
    }
    
    /* Icono del extra disponible */
    .extra-available-icon[b-itnu8tn8yp] {
        width: 35px !important;
        height: 35px !important;
        border-radius: 50% !important;
        background: linear-gradient(135deg, #ffcc03, #ffcc03) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-shrink: 0 !important;
    }
    
    .extra-available-icon i[b-itnu8tn8yp] {
        font-size: 1rem !important;
        color: #212529 !important;
    }
    
    /* Contenido del extra disponible */
    .extra-available-content[b-itnu8tn8yp] {
        flex: 1 !important;
        min-width: 0 !important;
    }
    
    .extra-available-name[b-itnu8tn8yp] {
        font-weight: 600 !important;
        color: #212529 !important;
        margin-bottom: 0.25rem !important;
        font-size: 0.9rem !important;
    }
    
    .extra-available-description[b-itnu8tn8yp] {
        color: #6c757d !important;
        font-size: 0.75rem !important;
        margin-bottom: 0.25rem !important;
        line-height: 1.3 !important;
    }
    
    .extra-available-price[b-itnu8tn8yp] {
        font-weight: 700 !important;
        color: #000 !important;
        font-size: 0.9rem !important;
    }
    
    /* Acciones del extra disponible */
    .extra-available-actions[b-itnu8tn8yp] {
        flex-shrink: 0 !important;
    }
    
    /* Controles de cantidad móviles */
    .quantity-controls-mobile[b-itnu8tn8yp] {
        display: flex !important;
        align-items: center !important;
        gap: 0.5rem !important;
        background: #f8f9fa !important;
        border-radius: 6px !important;
        padding: 0.25rem !important;
    }
    
    .quantity-controls-mobile .btn[b-itnu8tn8yp] {
        width: 25px !important;
        height: 25px !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 4px !important;
        font-size: 0.7rem !important;
    }
    
    .quantity-display-mobile[b-itnu8tn8yp] {
        min-width: 25px !important;
        text-align: center !important;
        font-weight: 600 !important;
        color: #495057 !important;
        font-size: 0.8rem !important;
    }
    
    /* Mensaje cuando no hay extras */
    .no-extras-message-mobile[b-itnu8tn8yp] {
        text-align: center !important;
        padding: 2rem 1rem !important;
        color: #6c757d !important;
    }
    
    .no-extras-message-mobile i[b-itnu8tn8yp] {
        font-size: 2rem !important;
        margin-bottom: 0.75rem !important;
        color: #dee2e6 !important;
    }
    
    .no-extras-message-mobile p[b-itnu8tn8yp] {
        font-size: 0.9rem !important;
        margin: 0 !important;
    }
    
    /* Resumen móvil */
    .extras-summary-mobile[b-itnu8tn8yp] {
        background: linear-gradient(135deg, #ffcc03, #ffcc03) !important;
        color: #000 !important;
        border-radius: 12px !important;
        padding: 1.5rem !important;
        box-shadow: 0 4px 20px rgba(255, 204, 3, 0.3) !important;
        border: 2px solid #000 !important;
        margin-top: 1.5rem !important;
    }
    
    .summary-title[b-itnu8tn8yp] {
        font-weight: 600 !important;
        margin-bottom: 1rem !important;
        font-size: 1.1rem !important;
        text-align: center !important;
    }
    
    .summary-tickets[b-itnu8tn8yp] {
        margin-bottom: 1rem !important;
    }
    
    .summary-ticket[b-itnu8tn8yp] {
        background: rgba(255, 204, 3, 0.2) !important;
        border-radius: 8px !important;
        padding: 1rem !important;
        margin-bottom: 0.75rem !important;
    }
    
    .summary-ticket-info[b-itnu8tn8yp] {
        display: flex !important;
        flex-direction: column !important;
        gap: 0.5rem !important;
    }
    
    .summary-ticket-name[b-itnu8tn8yp] {
        font-weight: 600 !important;
        font-size: 0.9rem !important;
        color: #000 !important;
    }
    
    .summary-ticket-price[b-itnu8tn8yp] {
        font-weight: 700 !important;
        color: #000 !important;
        font-size: 1rem !important;
        margin-top: 0.75rem !important;
        padding-top: 0.75rem !important;
        border-top: 1px solid rgba(0, 0, 0, 0.15) !important;
        text-align: right !important;
    }
    
    .summary-extras[b-itnu8tn8yp] {
        margin-top: 0.5rem !important;
        padding-top: 0.5rem !important;
        border-top: 1px solid rgba(0, 0, 0, 0.1) !important;
    }
    
    .summary-extra[b-itnu8tn8yp] {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 0.25rem 0 !important;
        font-size: 0.8rem !important;
        color: rgba(0, 0, 0, 0.8) !important;
        margin-bottom: 0.25rem !important;
    }
    
    .summary-extra-included[b-itnu8tn8yp] {
        background: rgba(255, 179, 0, 0.15) !important;
        border-radius: 4px !important;
        padding: 0.25rem 0.5rem !important;
        margin: 0.125rem 0 !important;
    }
    
    .summary-extra-name[b-itnu8tn8yp] {
        flex: 1 !important;
        font-weight: 500 !important;
        display: flex !important;
        align-items: center !important;
        gap: 0.25rem !important;
    }
    
    .summary-extra-quantity[b-itnu8tn8yp] {
        margin: 0 0.5rem !important;
        color: rgba(0, 0, 0, 0.6) !important;
        font-size: 0.75rem !important;
    }
    
    .summary-extra-price[b-itnu8tn8yp] {
        font-weight: 600 !important;
        color: #000 !important;
    }
    
    .summary-total[b-itnu8tn8yp] {
        border-top: 2px solid rgba(0, 0, 0, 0.3) !important;
        padding-top: 1rem !important;
    }
    
    .summary-line[b-itnu8tn8yp] {
        display: flex !important;
        justify-content: space-between !important;
        margin-bottom: 0.5rem !important;
        font-size: 0.85rem !important;
    }
    
    .summary-final[b-itnu8tn8yp] {
        display: flex !important;
        justify-content: space-between !important;
        font-weight: 700 !important;
        font-size: 1rem !important;
        margin-top: 0.75rem !important;
        padding-top: 0.75rem !important;
        border-top: 1px solid rgba(255, 255, 255, 0.3) !important;
    }
    
    /* Mejoras de accesibilidad */
    .extra-available-card:focus-within[b-itnu8tn8yp] {
        outline: 2px solid #ffcc03 !important;
        outline-offset: 2px !important;
    }
    
    .btn:focus[b-itnu8tn8yp] {
        box-shadow: 0 0 0 0.2rem rgba(255, 204, 3, 0.25) !important;
    }
    
    /* Efectos de toque para móvil */
    .btn:active[b-itnu8tn8yp] {
        transform: scale(0.95) !important;
    }
    
    /* Mejorar legibilidad en pantallas pequeñas */
    @media (max-width: 20rem) {
        .extras-ticket-card[b-itnu8tn8yp] {
            padding: 1rem !important;
        }
        
        .ticket-location[b-itnu8tn8yp] {
            font-size: 1rem !important;
        }
        
        .ticket-price[b-itnu8tn8yp] {
            font-size: 1.125rem !important;
        }
        
        .quantity-controls-mobile .btn[b-itnu8tn8yp] {
            width: 22px !important;
            height: 22px !important;
            font-size: 0.65rem !important;
        }
        
        .quantity-display-mobile[b-itnu8tn8yp] {
            min-width: 22px !important;
            font-size: 0.75rem !important;
        }
    }
    
    /* Orientación landscape */
    @media (max-width: 48rem) and (orientation: landscape) {
        .extras-cards-container[b-itnu8tn8yp] {
            gap: 1rem !important;
        }
        
        .extras-ticket-card[b-itnu8tn8yp] {
            padding: 1rem !important;
        }
        
        .extras-selection-title[b-itnu8tn8yp] {
            margin: 1rem 0 0.5rem 0 !important;
        }
    }
}

/* Responsive para extras incluidos */
@media (max-width: 768px) {
    .extra-incluido[b-itnu8tn8yp]::after {
        position: static;
        display: inline-block;
        margin-left: 8px;
        margin-top: 4px;
    }
    
    .extra-incluido-resumen[b-itnu8tn8yp] {
        padding: 6px 8px;
    }
    
    .extras-incluidos-info[b-itnu8tn8yp] {
        padding: 12px;
    }
    
    .extra-incluido-info[b-itnu8tn8yp] {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }
    
    .extra-incluido-nombre[b-itnu8tn8yp] {
        width: 100%;
    }
    
    .extras-seleccionados-title[b-itnu8tn8yp] {
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
    }
}

/* Estilos para información de grupos */
.group-info-mobile[b-itnu8tn8yp] {
    background-color: rgba(0, 123, 255, 0.1);
    border: 1px solid rgba(0, 123, 255, 0.3);
    border-radius: 6px;
    padding: 8px 12px;
    margin: 10px 0;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: #0056b3;
}

.group-info-mobile i[b-itnu8tn8yp] {
    color: #0056b3;
    font-size: 0.9rem;
}

.group-info-desktop[b-itnu8tn8yp] {
    background-color: rgba(0, 123, 255, 0.1);
    border: 1px solid rgba(0, 123, 255, 0.3);
    border-radius: 6px;
    padding: 10px 15px;
    margin: 10px 0;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 0.9rem;
    color: #0056b3;
    font-weight: 500;
}

.group-info-desktop i[b-itnu8tn8yp] {
    color: #0056b3;
    font-size: 1rem;
}
/* /Modules/EventoCompra/Components/StepProgressBar.razor.rz.scp.css */
.step-progress-container[b-r7zluy0nb3] {
    width: 100%;
    padding: 1.5rem 1rem;
    margin-bottom: 2rem;
}

.step-progress-bar[b-r7zluy0nb3] {
    display: flex;
    align-items: stretch;
    position: relative;
    width: 100%;
    background: transparent;
    border-radius: 2rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    min-height: 3rem;
}

.step-item[b-r7zluy0nb3] {
    flex: 1;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    background: #e8e8e8;
    transition: all 0.3s ease;
}

.step-item.completado[b-r7zluy0nb3] {
    background: #4a4a4a;
}

.step-item.actual[b-r7zluy0nb3] {
    background: #ffcc03;
}

.step-item.futuro[b-r7zluy0nb3] {
    background: #e8e8e8;
}

/* Chevron (flecha) a la derecha de cada paso - solo el triángulo */
.step-item:not(:last-child)[b-r7zluy0nb3]::after {
    content: '';
    position: absolute;
    right: -1.49rem;
    top: 0;
    bottom: 0;
    width: 1.5rem;
    height: 100%;
    background: inherit;
    clip-path: polygon(0 0, 100% 50%, 0 100%);
    z-index: 3;
    transition: all 0.3s ease;
    /* Solo mostrar el triángulo, no la base */
    margin-left: 0;
}

/* Chevron gris para pasos completados - debe ser del mismo color que el fondo */
.step-item.completado:not(:last-child)[b-r7zluy0nb3]::after {
    background: #4a4a4a !important;
    z-index: 4;
}

/* Chevron amarillo para paso actual - debe ser del mismo color que el fondo */
.step-item.actual:not(:last-child)[b-r7zluy0nb3]::after {
    background: #ffcc03 !important;
    z-index: 3;
}

/* Chevron gris claro para pasos futuros - debe ser del mismo color que el fondo */
.step-item.futuro:not(:last-child)[b-r7zluy0nb3]::after {
    background: #e8e8e8 !important;
    z-index: 3;
}

/* Separador visible para pasos completados - crea división clara entre pasos completados */
.step-item.completado:not(:last-child)[b-r7zluy0nb3]::before {
    content: '';
    position: absolute;
    right: -1.5rem;
    top: 0;
    bottom: 0;
    width: 0.1rem;
    background: #ffffff;
    z-index: 5;
    /* Línea vertical blanca fina que separa los pasos completados */
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    margin-left: 0;
    opacity: 0.5;
}

/* Ocultar el separador si el siguiente paso es el actual */
.step-item.completado:has(+ .step-item.actual)[b-r7zluy0nb3]::before {
    display: none;
}

.step-content[b-r7zluy0nb3] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    position: relative;
    z-index: 3;
    width: 100%;
    padding: 0.5rem 1rem;
}

.step-label[b-r7zluy0nb3] {
    font-size: clamp(0.7rem, 1.8vw, 0.85rem);
    font-weight: 700;
    color: #000;
    text-align: center;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    transition: all 0.3s ease;
    position: relative;
}

.step-item.actual .step-label[b-r7zluy0nb3] {
    color: #000;
    font-weight: 700;
}

.step-item.completado .step-label[b-r7zluy0nb3] {
    color: #ffffff;
    font-weight: 700;
}

.step-item.futuro .step-label[b-r7zluy0nb3] {
    color: #4a4a4a;
    opacity: 1;
    font-weight: 700;
}

/* Primer elemento con borde redondeado izquierdo */
.step-item:first-child[b-r7zluy0nb3] {
    border-radius: 2rem 0 0 2rem;
}

/* Último elemento con borde redondeado derecho */
.step-item:last-child[b-r7zluy0nb3] {
    border-radius: 0 2rem 2rem 0;
}

/* Responsive para móvil */
@media (max-width: 48rem) {
    .step-progress-container[b-r7zluy0nb3] {
        padding: 0.75rem 0.25rem;
        margin-bottom: 1rem;
    }
    
    .step-progress-bar[b-r7zluy0nb3] {
        min-height: 2.5rem;
        border-radius: 1.25rem;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
        overflow: visible;
    }
    
    .step-item[b-r7zluy0nb3] {
        min-width: 0;
        flex: 1 1 0;
        overflow: visible;
        position: relative;
    }
    
    .step-content[b-r7zluy0nb3] {
        padding: 0.375rem 0.125rem;
        width: 100%;
        overflow: hidden;
        box-sizing: border-box;
    }
    
    .step-label[b-r7zluy0nb3] {
        font-size: clamp(0.5rem, 1.5vw, 0.6rem);
        letter-spacing: 0.01em;
        padding: 0.125rem 0.125rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
        display: block;
        box-sizing: border-box;
    }
    
    /* Ajustar chevrons en móvil - más pequeños y mejor posicionados para evitar solapamiento */
    .step-item:not(:last-child)[b-r7zluy0nb3]::after {
        right: -0.65rem;
        width: 0.7rem;
        z-index: 3;
    }
    
    .step-item.completado:not(:last-child)[b-r7zluy0nb3]::after {
        right: -0.65rem;
        width: 0.7rem;
        z-index: 4;
    }
    
    .step-item.actual:not(:last-child)[b-r7zluy0nb3]::after {
        right: -0.65rem;
        width: 0.7rem;
        z-index: 3;
    }
    
    .step-item.futuro:not(:last-child)[b-r7zluy0nb3]::after {
        right: -0.65rem;
        width: 0.7rem;
        z-index: 3;
    }
    
    /* Separador más fino en móvil y mejor posicionado */
    .step-item.completado:not(:last-child)[b-r7zluy0nb3]::before {
        right: -0.65rem;
        width: 0.05rem;
        z-index: 5;
    }
    
    /* Ajustar bordes redondeados en móvil */
    .step-item:first-child[b-r7zluy0nb3] {
        border-radius: 1.25rem 0 0 1.25rem;
    }
    
    .step-item:last-child[b-r7zluy0nb3] {
        border-radius: 0 1.25rem 1.25rem 0;
    }
}

/* Animación para el paso actual */
@keyframes pulse-b-r7zluy0nb3 {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.05);
    }
}

.step-item.actual .step-label[b-r7zluy0nb3] {
    animation: pulse-b-r7zluy0nb3 2s ease-in-out infinite;
}

/* /Modules/EventoCompra/Components/TemporizadorCompra.razor.rz.scp.css */
#countdown[b-9tlt1oyqw5] {
    font-size: 30px;
    font-weight: 500;
    text-align: center;
    color: #fff;
    background-color: #333;
    padding: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

#countdown span[b-9tlt1oyqw5] {
display: inline-block;
margin: 0 10px;
}

#countdown span:first-child[b-9tlt1oyqw5] {
margin-left: 0;
}

#countdown span:last-child[b-9tlt1oyqw5] {
    margin-right: 0;
}

#countdown span[b-9tlt1oyqw5]:before,
#countdown span[b-9tlt1oyqw5]:after {
    content: ":";
    color: #fff;
}

#countdown span:last-child[b-9tlt1oyqw5]:before,
#countdown span:last-child[b-9tlt1oyqw5]:after {
    content: "";
}

#countdown span[b-9tlt1oyqw5]:before {
    margin-right: -5px;
}

#countdown span[b-9tlt1oyqw5]:after {
    margin-left: -5px;
}

.countdown-title[b-9tlt1oyqw5] {
    text-align: center;
    background-color: #ffcc03;
    font-weight: 700;
    padding: 5px;
}
/* /Modules/EventoCompra/Components/Wizard.razor.rz.scp.css */
/* Estilos para botones deshabilitados */
.btn:disabled[b-z1g23c46y3] {
    opacity: 0.4;
    cursor: not-allowed;
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: #ffffff !important;
    pointer-events: none;
}

.btn:disabled:hover[b-z1g23c46y3] {
    background-color: #6c757d !important;
    border-color: #6c757d !important;
    color: #ffffff !important;
    opacity: 0.4;
}

/* Estilo para botones deshabilitados específicamente en el wizard */
.btn-dark:disabled[b-z1g23c46y3] {
    background-color: #495057 !important;
    border-color: #495057 !important;
    color: #ffcc03 !important;
    opacity: 0.4;
    pointer-events: none;
}

.btn-dark:disabled:hover[b-z1g23c46y3] {
    background-color: #495057 !important;
    border-color: #495057 !important;
    color: #ffcc03 !important;
    opacity: 0.4;
}

/* Estilos para hacer los botones simétricos */
.d-grid.gap-2[b-z1g23c46y3] {
    min-width: 10rem; /* Ancho mínimo usando rem */
    max-width: 12rem; /* Ancho máximo usando rem */
    margin: 0; /* Sin margen para que el gap del contenedor padre maneje el espaciado */
}

.d-grid.gap-2 .btn[b-z1g23c46y3] {
    width: 100%;
    min-width: 10rem; /* Ancho mínimo usando rem */
    height: 2.75rem; /* Altura usando rem */
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem; /* Tamaño de fuente usando rem */
    font-weight: 500; /* Peso de fuente medio */
    border-radius: 0.375rem; /* Bordes redondeados usando rem */
    transition: all 0.2s ease; /* Transición suave para efectos hover */
}

.d-grid.gap-2 .btn:hover[b-z1g23c46y3] {
    transform: translateY(-0.0625rem); /* Efecto sutil usando rem */
    box-shadow: 0 0.125rem 0.5rem rgba(0,0,0,0.15); /* Sombra usando rem */
}

/* Responsive para tablets */
@media (max-width: 768px) {
    .justify-content-center[b-z1g23c46y3] {
        align-items: center !important;
        justify-content: center !important;
    }
    
    .d-grid.gap-2[b-z1g23c46y3] {
        min-width: 8rem;
        max-width: 10rem;
        margin: 0 0.25rem;
        display: flex;
        justify-content: center;
    }
    
    .d-grid.gap-2 .btn[b-z1g23c46y3] {
        min-width: 8rem;
        height: 2.5rem;
        font-size: 0.875rem;
    }
}

@media (max-width: 576px) {
    .d-grid.gap-2[b-z1g23c46y3] {
        min-width: 7rem;
        max-width: 8rem;
        margin: 0 0.125rem;
    }
    
    .d-grid.gap-2 .btn[b-z1g23c46y3] {
        min-width: 7rem;
        height: 2.25rem;
        font-size: 0.8rem;
    }
}

/* Mejorar el centrado y espaciado del contenedor principal */
.justify-content-center[b-z1g23c46y3] {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 1rem;
    width: 100% !important;
}

/* Asegurar que los botones estén centrados en móviles */
@media (max-width: 576px) {
    .justify-content-center[b-z1g23c46y3] {
        flex-direction: column;
        gap: 0.75rem;
        align-items: center !important;
        justify-content: center !important;
    }
    
    .d-grid.gap-2[b-z1g23c46y3] {
        margin: 0;
        width: 100%;
        max-width: 100%;
        display: flex;
        justify-content: center;
    }
    
    .d-grid.gap-2 .btn[b-z1g23c46y3] {
        width: 100%;
        max-width: 20rem;
    }
}

/* Estilos para los mensajes de ayuda */
.text-muted[b-z1g23c46y3] {
    font-size: 0.875rem;
    margin-top: 0.5rem;
    color: #6c757d !important;
    font-weight: 500;
}

.text-center[b-z1g23c46y3] {
    text-align: center;
}

/* Mejorar la apariencia de los campos con errores */
.form-control.is-invalid[b-z1g23c46y3] {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 0.125rem rgba(220, 53, 69, 0.25) !important;
}

.invalid-feedback[b-z1g23c46y3] {
    display: block;
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 0.25rem;
} 
/* /Modules/EventoDetalle/Components/Calendario.razor.rz.scp.css */
.calendar-container[b-2cc3eux4ko] {
    width: 100%;
    max-width: 37.5rem; /* 600px */
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    border: none;
    min-height: 25rem; /* 400px */
    overflow-x: hidden; /* Prevenir desbordamiento horizontal */
}

.calendar-loading[b-2cc3eux4ko] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3.75rem 1.25rem; /* 60px 20px */
    min-height: 25rem; /* 400px */
}

.calendar-loading .spinner-border[b-2cc3eux4ko] {
    width: 3rem;
    height: 3rem;
    border-width: 0.3em;
    margin-bottom: 1.25rem; /* 20px */
    color: #ffcc03;
}

.loading-text[b-2cc3eux4ko] {
    margin-top: 0.9375rem; /* 15px */
    color: #666;
    font-size: 1rem;
    font-weight: 500;
}

@media (max-width: 768px) {
    .calendar-loading[b-2cc3eux4ko] {
        padding: 40px 15px;
        min-height: 300px;
    }
    
    .calendar-loading .spinner-border[b-2cc3eux4ko] {
        width: 2.5rem;
        height: 2.5rem;
    }
    
    .loading-text[b-2cc3eux4ko] {
        font-size: 0.9rem;
    }
}

.calendar-header[b-2cc3eux4ko] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.75rem; /* 12px */
    padding-bottom: 0.75rem; /* 12px */
    border-bottom: 0.125rem solid #f5f5f5; /* 2px */
}

.calendar-header button[b-2cc3eux4ko] {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    padding: 0.625rem 1.25rem; /* 10px 20px */
    border-radius: 0.625rem; /* 10px */
    display: flex;
    align-items: center;
    gap: 0.5rem; /* 8px */
    font-weight: 600;
    font-size: 0.95rem;
    letter-spacing: 0.01875rem; /* 0.3px */
    border: 0.125rem solid transparent; /* 2px */
}

.calendar-header button:not(:disabled):hover[b-2cc3eux4ko] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0,0,0,0.15);
    background-color: #ffcc03;
    border-color: #ffcc03;
}

.calendar-header button:disabled[b-2cc3eux4ko] {
    opacity: 0.4;
    cursor: not-allowed;
    background-color: #f5f5f5;
    border-color: #e0e0e0;
    color: #999;
}

.calendar-header button:disabled:hover[b-2cc3eux4ko] {
    transform: none;
    box-shadow: none;
}

.calendar-month-year[b-2cc3eux4ko] {
    font-size: 1.4rem;
    font-weight: 700;
    color: #1a1a1a;
    text-transform: capitalize;
    letter-spacing: -0.5px;
}

.calendar-grid[b-2cc3eux4ko] {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 0.25rem; /* 4px */
    width: 100%;
    box-sizing: border-box;
}

.calendar-day-name[b-2cc3eux4ko], .calendar-day[b-2cc3eux4ko] {
    min-width: 0;
    max-width: 100%;
    text-align: center;
    padding: 0.625rem 0.25rem; /* 10px 4px */
    box-sizing: border-box;
    overflow: hidden;
    word-wrap: break-word;
}

.calendar-day-name[b-2cc3eux4ko] {
    background-color: black;
    color: white;
    font-weight: bold;
}

.calendar-day[b-2cc3eux4ko] {
    cursor: pointer;
    border: 0.125rem solid #e8e8e8; /* 2px */
    border-radius: 0.625rem; /* 10px */
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    font-weight: 500;
    font-size: 0.95rem;
    background: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 3.75rem; /* 60px */
    padding: 0.375rem 0.25rem; /* 6px 4px */
}

.calendar-day-number[b-2cc3eux4ko] {
    font-weight: 700;
    font-size: 1rem;
    line-height: 1.2;
}

.calendar-day-price[b-2cc3eux4ko] {
    white-space: normal;
    font-size: 0.65rem;
    word-break: break-word;
    overflow-wrap: break-word;
    font-weight: 600;
    color: #28a745;
    margin-top: 0.125rem; /* 2px */
    line-height: 1;
    text-align: center;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

    .calendar-day.other-month[b-2cc3eux4ko] {
        color: #ccc;
        background-color: #f9f9f9;
    }

    .calendar-day.event-day[b-2cc3eux4ko] {
        background: linear-gradient(135deg, #ffcc03 0%, #ffd93f 100%);
        border-color: #ffcc03;
        font-weight: 700;
        color: #000;
        box-shadow: 0 2px 8px rgba(255,204,3,0.3);
    }

    .calendar-day.event-day:hover[b-2cc3eux4ko] {
        background: linear-gradient(135deg, #ffd93f 0%, #ffe866 100%);
        transform: translateY(-2px) scale(1.03);
        box-shadow: 0 4px 12px rgba(255,204,3,0.4);
    }

    .calendar-day.disabled-day[b-2cc3eux4ko] {
        background-color: #f8f9fa;
        color: #6c757d;
        cursor: not-allowed;
        opacity: 0.7;
        border-color: #dee2e6;
        position: relative;
    }

    .calendar-day.disabled-day[b-2cc3eux4ko]::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 2px;
        height: 2px;
        background-color: #dc3545;
        border-radius: 50%;
        transform: translate(-50%, -50%);
    }

    .calendar-day.disabled-day:hover[b-2cc3eux4ko] {
        background-color: #f8f9fa;
        cursor: not-allowed;
        transform: none;
    }

    /* Estilo específico para eventos que ya pasaron */
    .calendar-day.event-day.disabled-day[b-2cc3eux4ko] {
        background-color: #f8d7da;
        color: #721c24;
        border-color: #f5c6cb;
        text-decoration: line-through;
    }

    .calendar-day.event-day.disabled-day[b-2cc3eux4ko]::after {
        content: '✗';
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-color: transparent;
        color: #dc3545;
        font-size: 12px;
        font-weight: bold;
    }

    /* Estilo para eventos pasados */
    .calendar-day.event-day.past-event[b-2cc3eux4ko] {
        background-color: #f8d7da;
        color: #721c24;
        border-color: #f5c6cb;
        text-decoration: line-through;
    }

    .calendar-day.event-day.past-event[b-2cc3eux4ko]::after {
        content: '✗';
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-color: transparent;
        color: #dc3545;
        font-size: 12px;
        font-weight: bold;
    }

    /* Estilo para días agotados */
    .calendar-day.event-day.agotado-day[b-2cc3eux4ko] {
        background-color: #fff3cd;
        color: #856404;
        border-color: #ffc107;
        position: relative;
    }

    .calendar-day.event-day.agotado-day:hover[b-2cc3eux4ko] {
        background-color: #fff3cd;
        transform: none;
        cursor: not-allowed;
    }

    .agotado-badge[b-2cc3eux4ko] {
        display: block;
        position: relative;
        margin-top: 0.125rem; /* 2px - mismo que calendar-day-price */
        font-size: 0.65rem; /* Mismo tamaño que calendar-day-price */
        font-weight: 600; /* Mismo peso que calendar-day-price */
        color: #856404;
        background-color: rgba(255, 193, 7, 0.25);
        padding: 0.0625rem 0.1875rem; /* 1px 3px */
        border-radius: 0.125rem; /* 2px */
        white-space: normal;
        line-height: 1;
        text-align: center;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        overflow-wrap: break-word;
        word-break: break-word;
    }

    .calendar-day:hover:not(.disabled-day)[b-2cc3eux4ko] {
        background-color: #f0f0f0;
        transform: scale(1.02);
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    }

    .calendar-day:active:not(.disabled-day)[b-2cc3eux4ko] {
        transform: scale(0.98);
    }

/* Estilos para tooltips */
.calendar-day[title]:hover[b-2cc3eux4ko]::before {
    content: attr(title);
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background-color: #333;
    color: white;
    padding: 5px 8px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    z-index: 1000;
    margin-bottom: 5px;
}

.calendar-day[title]:hover[b-2cc3eux4ko]::after {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 5px solid transparent;
    border-top-color: #333;
    margin-bottom: -5px;
}

.event-details[b-2cc3eux4ko] {
    margin-top: 20px;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #fafafa;
}

@media (max-width: 48rem) { /* 768px */
    .calendar-container[b-2cc3eux4ko] {
        padding: 0.5rem 0.5rem; /* 8px - más compacto */
        border-radius: 0.625rem; /* 10px */
        margin: 0;
        width: 100%;
        max-width: 100%;
        overflow-x: hidden; /* Asegurar que no haya desbordamiento horizontal */
        box-sizing: border-box;
    }
    
    .calendar-header[b-2cc3eux4ko] {
        margin-bottom: 0.5rem; /* 8px - reducido */
        padding-bottom: 0.5rem; /* 8px - reducido */
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    
    .calendar-month-year[b-2cc3eux4ko] {
        font-size: clamp(1rem, 4vw, 1.1rem);
        flex: 1 1 100%;
        text-align: center;
        order: 3;
    }
    
    .calendar-header button[b-2cc3eux4ko] {
        padding: 0.5rem 0.75rem; /* 8px 12px - más compacto */
        font-size: clamp(0.75rem, 3vw, 0.85rem);
        flex: 0 0 auto;
        min-width: 0;
    }
    
    .calendar-grid[b-2cc3eux4ko] {
        gap: 0.25rem; /* 4px */
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        grid-template-columns: repeat(7, minmax(0, 1fr)); /* Asegurar que las columnas se ajusten */
    }
    
    .calendar-day-name[b-2cc3eux4ko] {
        padding: 0.5rem 0.125rem; /* 8px 2px - más compacto verticalmente */
        font-size: clamp(0.7rem, 2.5vw, 0.75rem);
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
    }
    
    .calendar-day[b-2cc3eux4ko] {
        padding: 0.375rem 0.125rem; /* 6px 2px - más compacto */
        font-size: clamp(0.8rem, 3vw, 0.85rem);
        border-radius: 0.5rem; /* 8px */
        min-height: clamp(3.75rem, 12vw, 4.5rem); /* 60px - 72px - más alto para mejor uso del espacio */
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
        /* Usar aspect-ratio solo si es necesario, pero permitir que crezca verticalmente */
    }
    
    .calendar-day-number[b-2cc3eux4ko] {
        font-size: clamp(0.9rem, 3.5vw, 1rem);
        line-height: 1.1;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    
    .calendar-day-price[b-2cc3eux4ko] {
        font-size: clamp(0.5rem, 2vw, 0.6rem);
        margin-top: 0.125rem; /* 2px */
        line-height: 1.1;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        word-break: break-word;
        overflow-wrap: break-word;
        hyphens: auto;
    }
    
    .agotado-badge[b-2cc3eux4ko] {
        font-size: clamp(0.5rem, 2vw, 0.6rem); /* Mismo tamaño que calendar-day-price en móvil */
        margin-top: 0.125rem; /* 2px - mismo que calendar-day-price */
        padding: 0.125rem 0.25rem; /* 2px 4px */
        line-height: 1.1;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        word-break: break-word;
        overflow-wrap: break-word;
        white-space: normal;
    }
    
    .calendar-day-name[b-2cc3eux4ko], .calendar-day[b-2cc3eux4ko] {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
    }
}
/* /Modules/EventoDetalle/Components/Funciones.razor.rz.scp.css */
/* Contenedor del selector de funciones - Diseño moderno */
.funciones-selector-container[b-a0mf4w9uia] {
    position: relative;
    height: auto;
    display: block;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Contenedor de botones de funciones mejorado */
.contenedor-botones-funciones[b-a0mf4w9uia] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 20px;
}

/* Botón de función mejorado - Sin efecto hover molesto */
.btn-funcion-selector[b-a0mf4w9uia] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 16px 20px;
    font-size: 15px;
    background: #ffffff;
    border: 2px solid #e8e8e8;
    border-radius: 10px;
    color: #1a1a1a;
    cursor: pointer;
    transition: none;
    text-align: left;
    position: relative;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}

.btn-funcion-selector:hover:not([disabled]):not(.seleccionada)[b-a0mf4w9uia] {
    /* Sin cambios en hover - como pidió el usuario */
}

.btn-funcion-selector.seleccionada[b-a0mf4w9uia] {
    background: linear-gradient(135deg, #ffcc03 0%, #ffd93f 100%);
    border-color: #ffcc03;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(255,204,3,0.3);
    color: #000;
}

.btn-funcion-selector.seleccionada:hover[b-a0mf4w9uia] {
    background: linear-gradient(135deg, #ffcc03 0%, #ffd93f 100%);
    box-shadow: 0 4px 12px rgba(255,204,3,0.3);
}

.btn-funcion-selector:focus[b-a0mf4w9uia] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(255,204,3,0.3);
}

/* Contenido de la función */
.funcion-content[b-a0mf4w9uia] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
}

.funcion-dia-hora[b-a0mf4w9uia] {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.funcion-dia[b-a0mf4w9uia] {
    font-size: 20px;
    font-weight: 800;
    color: #1a1a1a;
    letter-spacing: -0.5px;
    line-height: 1.2;
}

.funcion-mes[b-a0mf4w9uia] {
    font-size: 17px;
    font-weight: 600;
    color: #666;
    letter-spacing: 0.3px;
}

.btn-funcion-selector.seleccionada .funcion-mes[b-a0mf4w9uia] {
    color: #000;
    font-weight: 700;
}

.funcion-hora[b-a0mf4w9uia] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    color: #555;
    font-weight: 600;
    margin-top: 4px;
}

.btn-funcion-selector.seleccionada .funcion-hora[b-a0mf4w9uia] {
    color: #000;
    font-weight: 700;
}

.funcion-hora i[b-a0mf4w9uia] {
    font-size: 14px;
}

/* Check mark cuando está seleccionada */
.check-mark[b-a0mf4w9uia] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background-color: rgba(0,0,0,0.1);
    border-radius: 50%;
    margin-left: 12px;
}

.check-mark i[b-a0mf4w9uia] {
    font-size: 20px;
    color: #000;
}

/* Estilo para el botón deshabilitado */
.btn-funcion-selector[disabled][b-a0mf4w9uia],
.btn-funcion-selector.no-disponible[b-a0mf4w9uia] {
    background-color: #F4F4F4;
    cursor: not-allowed;
    color: #9E9E9E;
    border-color: #E0E0E0;
    opacity: 0.6;
}

.btn-funcion-selector[disabled]:hover[b-a0mf4w9uia],
.btn-funcion-selector.no-disponible:hover[b-a0mf4w9uia] {
    transform: none;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    border-color: #E0E0E0;
    background-color: #F4F4F4;
}

/* Bloque informativo para función única - No es botón, es información */
.funcion-informativa-unica[b-a0mf4w9uia] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 24px;
    background: linear-gradient(135deg, #fffef5 0%, #ffffff 100%);
    border: 2px solid #ffcc03;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(255,204,3,0.15);
    animation: fadeInSlide-b-a0mf4w9uia 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.funcion-informativa-icono[b-a0mf4w9uia] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    background: linear-gradient(135deg, #ffcc03 0%, #ffd93f 100%);
    border-radius: 12px;
    flex-shrink: 0;
    box-shadow: 0 4px 12px rgba(255,204,3,0.3);
}

.funcion-informativa-icono i[b-a0mf4w9uia] {
    font-size: 28px;
    color: #000;
}

.funcion-informativa-contenido[b-a0mf4w9uia] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.funcion-informativa-titulo[b-a0mf4w9uia] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.funcion-informativa-fecha[b-a0mf4w9uia] {
    font-size: 1.3rem;
    font-weight: 800;
    color: #1a1a1a;
    letter-spacing: -0.3px;
    line-height: 1.3;
}

.funcion-informativa-badge[b-a0mf4w9uia] {
    display: inline-block;
    padding: 4px 12px;
    background: #ffcc03;
    color: #000;
    font-size: 0.75rem;
    font-weight: 700;
    border-radius: 6px;
    width: fit-content;
    letter-spacing: 0.3px;
}

@keyframes fadeInSlide-b-a0mf4w9uia {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Mensaje cuando no hay funciones - Más claro y útil */
.sin-funciones-mensaje[b-a0mf4w9uia] {
    padding: 50px 30px;
    text-align: center;
    background: linear-gradient(135deg, #fffef5 0%, #ffffff 100%);
    border: 3px dashed #ffcc03;
    border-radius: 12px;
    color: #333;
}

.sin-funciones-mensaje i[b-a0mf4w9uia] {
    font-size: 48px;
    color: #ffcc03;
    margin-bottom: 16px;
    display: block;
}

.sin-funciones-mensaje p[b-a0mf4w9uia] {
    margin: 8px 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: #1a1a1a;
}

.sin-funciones-mensaje .mensaje-secundario[b-a0mf4w9uia] {
    font-size: 0.95rem;
    font-weight: 500;
    color: #666;
    margin-top: 8px;
}

/* Botón sticky de compra - Moderno y siempre visible */
.boton-compra-sticky[b-a0mf4w9uia] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, #ffffff 100%);
    padding: 20px 0;
    box-shadow: 0 -8px 32px rgba(0,0,0,0.2);
    z-index: 9999;
    border-top: 4px solid #ffcc03;
    backdrop-filter: blur(10px);
}

.boton-compra-fixed[b-a0mf4w9uia] {
    width: 100%;
    max-width: 500px;
    padding: 20px 40px;
    font-size: 18px;
    font-weight: 800;
    border-radius: 12px;
    background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
    color: #fff;
    border: none;
    box-shadow: 0 6px 20px rgba(0,0,0,0.3);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-size: 16px;
    position: relative;
    overflow: hidden;
}

.boton-compra-fixed[b-a0mf4w9uia]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(255,204,3,0.3);
    transform: translate(-50%, -50%);
    transition: width 0.6s, height 0.6s;
}

.boton-compra-fixed:hover:not([disabled])[b-a0mf4w9uia]::before {
    width: 300px;
    height: 300px;
}

.boton-compra-fixed:hover:not([disabled])[b-a0mf4w9uia] {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.4);
    background: linear-gradient(135deg, #2a2a2a 0%, #1a1a1a 100%);
}

.boton-compra-fixed:active:not([disabled])[b-a0mf4w9uia] {
    transform: translateY(-1px);
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

.boton-compra-fixed[disabled][b-a0mf4w9uia] {
    cursor: not-allowed;
    opacity: 0.4;
    background: #999;
    pointer-events: auto;
    transform: none;
}

.boton-compra-fixed i[b-a0mf4w9uia] {
    margin-right: 10px;
    font-size: 18px;
}

/* Responsive - Optimizado para móvil */
@media (max-width: 768px) {
    .funciones-selector-container[b-a0mf4w9uia] {
        width: 100%;
    }
    
    .btn-funcion-selector[b-a0mf4w9uia] {
        padding: 14px 16px;
        font-size: 14px;
        border-radius: 8px;
    }
    
    .funcion-content[b-a0mf4w9uia] {
        gap: 4px;
    }
    
    .funcion-dia[b-a0mf4w9uia] {
        font-size: 18px;
    }
    
    .funcion-mes[b-a0mf4w9uia] {
        font-size: 14px;
    }
    
    .funcion-hora[b-a0mf4w9uia] {
        font-size: 14px;
        margin-top: 2px;
    }
    
    .funcion-hora i[b-a0mf4w9uia] {
        font-size: 12px;
    }
    
    .check-mark[b-a0mf4w9uia] {
        width: 28px;
        height: 28px;
        margin-left: 8px;
    }
    
    .check-mark i[b-a0mf4w9uia] {
        font-size: 18px;
    }
    
    /* Bloque informativo único en móvil */
    .funcion-informativa-unica[b-a0mf4w9uia] {
        padding: 16px;
        gap: 12px;
        border-radius: 10px;
    }
    
    .funcion-informativa-icono[b-a0mf4w9uia] {
        width: 48px;
        height: 48px;
        border-radius: 10px;
    }
    
    .funcion-informativa-icono i[b-a0mf4w9uia] {
        font-size: 24px;
    }
    
    .funcion-informativa-fecha[b-a0mf4w9uia] {
        font-size: 1.1rem;
    }
    
    .funcion-informativa-badge[b-a0mf4w9uia] {
        font-size: 0.7rem;
        padding: 3px 10px;
    }
    
    .sin-funciones-mensaje[b-a0mf4w9uia] {
        padding: 30px 20px;
    }
    
    .sin-funciones-mensaje i[b-a0mf4w9uia] {
        font-size: 36px;
        margin-bottom: 12px;
    }
    
    .sin-funciones-mensaje p[b-a0mf4w9uia] {
        font-size: 1rem;
    }
    
    .sin-funciones-mensaje .mensaje-secundario[b-a0mf4w9uia] {
        font-size: 0.85rem;
    }
}
/* /Modules/EventoDetalle/Components/ModalFechaSeleccionada.razor.rz.scp.css */
/* Bloquear scroll del body cuando el modal está abierto */
body.modal-open[b-818tiz3zuh],
html.modal-open[b-818tiz3zuh] {
    overflow: hidden !important;
    position: fixed !important;
    width: 100% !important;
    height: 100% !important;
}

body.modal-open[b-818tiz3zuh] {
    left: 0;
    right: 0;
}

.modal-overlay[b-818tiz3zuh] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    padding: 1.25rem; /* 20px */
    animation: fadeIn-b-818tiz3zuh 0.3s ease;
    overflow-y: auto;
    overflow-x: hidden;
}

@keyframes fadeIn-b-818tiz3zuh {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.modal-content[b-818tiz3zuh] {
    background: white;
    border-radius: 1rem; /* 16px */
    max-width: 37.5rem; /* 600px */
    width: 100%;
    max-height: 90vh;
    overflow-y: auto;
    box-shadow: 0 0.625rem 2.5rem rgba(0, 0, 0, 0.3); /* 10px 40px */
    animation: slideUp-b-818tiz3zuh 0.3s ease;
    display: flex;
    flex-direction: column;
}

@keyframes slideUp-b-818tiz3zuh {
    from {
        transform: translateY(3.125rem); /* 50px */
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.modal-header[b-818tiz3zuh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.25rem 1.5rem; /* 20px 24px */
    border-bottom: 0.125rem solid #f0f0f0; /* 2px */
    background: linear-gradient(135deg, #ffcc03 0%, #ffd93f 100%);
    border-radius: 0;
    /* El header no debe tener border-radius porque el modal ya lo tiene */
}

.modal-titulo[b-818tiz3zuh] {
    margin: 0;
    font-size: clamp(1.1rem, 4vw, 1.4rem);
    font-weight: 700;
    color: #000;
    display: flex;
    align-items: center;
    gap: 0.625rem; /* 10px */
}

.modal-titulo i[b-818tiz3zuh] {
    font-size: clamp(1rem, 3.5vw, 1.3rem);
}

.modal-close-btn[b-818tiz3zuh] {
    background: none;
    border: none;
    font-size: clamp(1.2rem, 4vw, 1.5rem);
    color: #000;
    cursor: pointer;
    padding: 0.3125rem 0.625rem; /* 5px 10px */
    border-radius: 0.5rem; /* 8px */
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-close-btn:hover[b-818tiz3zuh] {
    background-color: rgba(0, 0, 0, 0.1);
    transform: scale(1.1);
}

.modal-body[b-818tiz3zuh] {
    padding: 1.5rem; /* 24px */
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    /* Asegurar que el body tenga scroll suave en móviles */
    -webkit-overflow-scrolling: touch;
    /* Prevenir overflow horizontal */
    box-sizing: border-box;
    max-width: 100%;
}

.modal-fecha-info[b-818tiz3zuh] {
    display: flex;
    align-items: center;
    gap: 0.625rem; /* 10px */
    padding: 0.75rem 1rem; /* 12px 16px */
    background: #f8f9fa;
    border-radius: 0.625rem; /* 10px */
    margin-bottom: 1.25rem; /* 20px */
    font-size: clamp(1rem, 3.5vw, 1.1rem);
    font-weight: 600;
    color: #333;
}

.modal-fecha-info i[b-818tiz3zuh] {
    color: #ffcc03;
    font-size: clamp(1rem, 3.5vw, 1.2rem);
}

.modal-funciones-lista[b-818tiz3zuh] {
    margin-bottom: 1.5rem; /* 24px */
}

.modal-funcion-item[b-818tiz3zuh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.875rem 1rem; /* 14px 16px */
    background: #f8f9fa;
    border-radius: 0.625rem; /* 10px */
    margin-bottom: 0.625rem; /* 10px */
    border-left: 0.25rem solid #ffcc03; /* 4px */
    transition: all 0.2s;
}

.modal-funcion-item:hover[b-818tiz3zuh] {
    background: #f0f0f0;
    transform: translateX(0.3125rem); /* 5px */
}

.modal-funcion-horario[b-818tiz3zuh] {
    display: flex;
    align-items: center;
    gap: 0.625rem; /* 10px */
    font-weight: 600;
    font-size: clamp(0.9rem, 3vw, 1rem);
    color: #333;
}

.modal-funcion-horario i[b-818tiz3zuh] {
    color: #ffcc03;
}

.modal-funcion-precio[b-818tiz3zuh] {
    font-weight: 700;
    color: #28a745;
    font-size: 1rem;
}

.modal-precios-detalle[b-818tiz3zuh] {
    margin-top: 1.5rem; /* 24px */
    padding-top: 1.5rem; /* 24px */
    border-top: 0.125rem solid #f0f0f0; /* 2px */
}

.modal-precios-titulo[b-818tiz3zuh] {
    font-size: clamp(1rem, 3.5vw, 1.2rem);
    font-weight: 700;
    margin-bottom: 1rem; /* 16px */
    color: #333;
    display: flex;
    align-items: center;
    gap: 0.625rem; /* 10px */
}

.modal-precios-titulo i[b-818tiz3zuh] {
    color: #ffcc03;
}

.modal-sectores-lista[b-818tiz3zuh] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.modal-sector-item[b-818tiz3zuh] {
    border: 2px solid #e8e8e8;
    border-radius: 10px;
    padding: 16px;
    background: #fff;
}

.modal-sector-header[b-818tiz3zuh] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
}

.modal-sector-indicador[b-818tiz3zuh] {
    width: 20px;
    height: 20px;
    border-radius: 4px;
    background-color: var(--sector-color, #ffcc03);
}

.modal-sector-nombre[b-818tiz3zuh] {
    font-weight: 700;
    font-size: 0.95rem;
    color: #333;
}

.modal-sector-precios[b-818tiz3zuh] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-left: 30px;
}

.modal-entrada-item[b-818tiz3zuh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    position: relative;
}

.modal-entrada-nombre[b-818tiz3zuh] {
    font-size: 0.9rem;
    color: #666;
    flex: 1;
}

.modal-entrada-precio-container[b-818tiz3zuh] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.modal-entrada-precio[b-818tiz3zuh] {
    font-weight: 700;
    color: #28a745;
    font-size: 0.95rem;
}

.modal-entrada-info-btn[b-818tiz3zuh] {
    background: none;
    border: none;
    color: #6c757d;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
}

.modal-entrada-info-btn:hover[b-818tiz3zuh] {
    background-color: #f0f0f0;
    color: #ffcc03;
}

.modal-entrada-info-btn.activo[b-818tiz3zuh] {
    color: #ffcc03;
    background-color: #fff9e6;
}

.modal-entrada-capacidad[b-818tiz3zuh] {
    margin-top: 8px;
    padding: 8px 12px;
    background: #f8f9fa;
    border-radius: 6px;
    font-size: 0.85rem;
    color: #666;
    border-left: 3px solid #ffcc03;
}

.modal-entrada-capacidad strong[b-818tiz3zuh] {
    color: #333;
}

.modal-sin-funciones[b-818tiz3zuh] {
    text-align: center;
    padding: 40px 20px;
    color: #666;
}

.modal-sin-funciones i[b-818tiz3zuh] {
    font-size: 3rem;
    color: #ccc;
    margin-bottom: 16px;
}

.modal-sin-funciones p[b-818tiz3zuh] {
    font-size: 1.1rem;
    margin: 0;
}

.modal-footer[b-818tiz3zuh] {
    display: flex;
    gap: 12px;
    padding: 20px 24px;
    border-top: 2px solid #f0f0f0;
    background: #f8f9fa;
    border-radius: 0;
    /* El footer no debe tener border-radius porque el modal ya lo tiene */
}

.btn-modal-cancelar[b-818tiz3zuh],
.btn-modal-continuar[b-818tiz3zuh] {
    flex: 1;
    padding: 0.875rem 1.5rem; /* 14px 24px */
    border: none;
    border-radius: 0.625rem; /* 10px */
    font-weight: 600;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.3s;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem; /* 8px */
    height: 2.75rem; /* 44px - altura fija exacta para ambos */
    line-height: 1.2; /* Line-height consistente */
    white-space: nowrap; /* Evitar que el texto se divida en múltiples líneas */
    box-sizing: border-box;
    overflow: hidden; /* Evitar que el contenido desborde */
    text-overflow: ellipsis; /* Si el texto es muy largo, mostrar ... */
}

.btn-modal-cancelar[b-818tiz3zuh] {
    background: #6c757d;
    color: white;
}

.btn-modal-cancelar:hover[b-818tiz3zuh] {
    background: #5a6268;
    transform: translateY(-2px);
    box-shadow: 0 0.25rem 0.75rem rgba(108, 117, 125, 0.3); /* 4px 12px */
}

.btn-modal-continuar[b-818tiz3zuh] {
    background: linear-gradient(135deg, #ffcc03 0%, #ffd93f 100%);
    color: #000;
    font-weight: 600; /* Igual que el botón cancelar */
}

.btn-modal-continuar:hover[b-818tiz3zuh] {
    background: linear-gradient(135deg, #ffd93f 0%, #ffe866 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(255, 204, 3, 0.4);
}

.btn-modal-continuar:active[b-818tiz3zuh],
.btn-modal-cancelar:active[b-818tiz3zuh] {
    transform: translateY(0);
}

@media (max-width: 48rem) { /* 768px */
    .modal-overlay[b-818tiz3zuh] {
        padding: 0;
        padding-bottom: env(safe-area-inset-bottom, 0);
        align-items: flex-end;
        justify-content: center;
        /* Asegurar que el overlay cubra toda la pantalla */
        bottom: 0;
        top: 0;
        left: 0;
        right: 0;
        /* Prevenir scroll horizontal */
        overflow-x: hidden;
        overflow-y: hidden;
    }

    .modal-content[b-818tiz3zuh] {
        /* Altura máxima que deja espacio arriba para la barra de estado */
        max-height: calc(100vh - max(4rem, calc(env(safe-area-inset-top, 0px) + 2rem)) - env(safe-area-inset-bottom, 0px));
        border-radius: 1rem 1rem 0 0; /* 16px */
        /* Ancho con márgenes laterales */
        width: calc(100% - 2rem);
        max-width: 37.5rem; /* 600px - mismo que desktop */
        margin: 0 auto;
        margin-top: max(4rem, calc(env(safe-area-inset-top, 0px) + 2rem));
        margin-bottom: env(safe-area-inset-bottom, 0px);
        overflow-y: auto;
        overflow-x: hidden;
        -webkit-overflow-scrolling: touch;
        /* Asegurar que el scroll funcione bien en ambos sistemas */
        overscroll-behavior: contain;
        /* Prevenir que el contenido cause overflow horizontal */
        box-sizing: border-box;
        /* Asegurar que el modal se ajuste correctamente */
        flex-shrink: 0;
    }

    .modal-header[b-818tiz3zuh] {
        padding: 1rem 1rem 0.75rem 1rem; /* 16px arriba, 12px abajo, 16px laterales */
        /* Padding superior adicional para iPhone y Android - asegurar que el header no se corte */
        padding-top: max(1.25rem, calc(1rem + env(safe-area-inset-top, 0px) * 0.3));
        border-radius: 0;
        min-height: auto;
        /* El header no debe tener border-radius porque el modal ya lo tiene */
        position: sticky;
        top: 0;
        z-index: 10;
        background: linear-gradient(135deg, #ffcc03 0%, #ffd93f 100%);
    }

    .modal-titulo[b-818tiz3zuh] {
        font-size: clamp(0.9rem, 3.5vw, 1rem);
        gap: 0.375rem; /* 6px */
    }

    .modal-titulo i[b-818tiz3zuh] {
        font-size: clamp(0.9rem, 3.5vw, 1rem);
    }

    .modal-close-btn[b-818tiz3zuh] {
        font-size: clamp(1rem, 3.5vw, 1.2rem);
        padding: 0.25rem 0.5rem; /* 4px 8px */
    }

    .modal-body[b-818tiz3zuh] {
        padding: 1rem; /* 16px */
    }

    .modal-fecha-info[b-818tiz3zuh] {
        padding: 0.625rem 0.75rem; /* 10px 12px */
        font-size: clamp(0.85rem, 3vw, 0.95rem);
        margin-bottom: 1rem; /* 16px */
    }

    .modal-fecha-info i[b-818tiz3zuh] {
        font-size: clamp(0.9rem, 3.5vw, 1rem);
    }

    .modal-funciones-lista[b-818tiz3zuh] {
        margin-bottom: 1.25rem; /* 20px */
    }

    .modal-funcion-item[b-818tiz3zuh] {
        padding: 0.75rem; /* 12px */
        margin-bottom: 0.5rem; /* 8px */
    }

    .modal-funcion-horario[b-818tiz3zuh] {
        font-size: clamp(0.85rem, 3vw, 0.9rem);
        gap: 0.5rem; /* 8px */
    }

    .modal-funcion-precio[b-818tiz3zuh] {
        font-size: clamp(0.85rem, 3vw, 0.9rem);
    }

    .modal-precios-detalle[b-818tiz3zuh] {
        margin-top: 1.25rem; /* 20px */
        padding-top: 1.25rem; /* 20px */
    }

    .modal-precios-titulo[b-818tiz3zuh] {
        font-size: clamp(0.9rem, 3.5vw, 1rem);
        margin-bottom: 0.75rem; /* 12px */
        gap: 0.5rem; /* 8px */
    }

    .modal-precios-titulo i[b-818tiz3zuh] {
        font-size: clamp(0.9rem, 3.5vw, 1rem);
    }

    .modal-sector-item[b-818tiz3zuh] {
        padding: 0.75rem; /* 12px */
    }

    .modal-sector-header[b-818tiz3zuh] {
        margin-bottom: 0.625rem; /* 10px */
    }

    .modal-sector-nombre[b-818tiz3zuh] {
        font-size: clamp(0.8rem, 2.5vw, 0.85rem);
    }

    .modal-sector-precios[b-818tiz3zuh] {
        padding-left: 1.5625rem; /* 25px */
        gap: 0.375rem; /* 6px */
    }

    .modal-entrada-item[b-818tiz3zuh] {
        padding: 0.375rem 0; /* 6px 0 */
        flex-wrap: wrap;
    }

    .modal-entrada-nombre[b-818tiz3zuh] {
        font-size: clamp(0.8rem, 2.5vw, 0.85rem);
        width: 100%;
        margin-bottom: 0.25rem; /* 4px */
    }

    .modal-entrada-precio-container[b-818tiz3zuh] {
        width: 100%;
        justify-content: space-between;
    }

    .modal-entrada-precio[b-818tiz3zuh] {
        font-size: clamp(0.85rem, 3vw, 0.9rem);
    }

    .modal-entrada-info-btn[b-818tiz3zuh] {
        font-size: clamp(0.75rem, 2.5vw, 0.8rem);
        padding: 0.1875rem 0.375rem; /* 3px 6px */
    }

    .modal-entrada-capacidad[b-818tiz3zuh] {
        margin-top: 0.375rem; /* 6px */
        padding: 0.375rem 0.625rem; /* 6px 10px */
        font-size: clamp(0.75rem, 2.5vw, 0.8rem);
        width: 100%;
    }

    .modal-footer[b-818tiz3zuh] {
        flex-direction: column;
        padding: 0.75rem 1rem; /* 12px 16px */
        padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px)); /* 12px */
        gap: 0.625rem; /* 10px */
        /* Asegurar que el footer no quede oculto por la barra de navegación */
        position: relative;
    }

    .btn-modal-cancelar[b-818tiz3zuh],
    .btn-modal-continuar[b-818tiz3zuh] {
        width: 100%;
        padding: 0.75rem 1.25rem; /* 12px 20px */
        font-size: clamp(0.9rem, 3vw, 0.95rem);
        /* Asegurar que los botones sean tocables */
        min-height: clamp(2.5rem, 8vw, 2.75rem); /* 40px - 44px */
    }
}

/* /Modules/EventoDetalle/Components/Sector.razor.rz.scp.css */
/* Contenedor de tarifas mejorado - Diseño moderno */
.sector-precios-container[b-va68ofq4ld] {
    padding: 0px 20px;
}

.tarifas-titulo[b-va68ofq4ld] {
    margin-bottom: 12px;
}

.tarifas-titulo h4[b-va68ofq4ld] {
    font-size: 1rem;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 4px;
    letter-spacing: -0.3px;
    line-height: 1.2;
}

.tarifas-titulo h4 i[b-va68ofq4ld] {
    display: none; /* Ocultamos iconos que sugieran interacción */
}

.tarifas-subtitulo[b-va68ofq4ld] {
    font-size: 0.85rem;
    color: #666;
    margin: 0;
    font-weight: 400;
}

/* Lista de tarifas - Compacta e informativa */
.tarifas-lista[b-va68ofq4ld] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 12px;
}

/* Tarjeta de sector - Diseño informativo NO interactivo - Más compacta */
.tarifa-sector-card[b-va68ofq4ld] {
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-left: 4px solid var(--sector-color, #ffcc03);
    border-radius: 6px;
    padding: 10px 12px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
    cursor: default;
}

.tarifa-sector-header[b-va68ofq4ld] {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px solid #e8e8e8;
}

.tarifa-sector-indicador[b-va68ofq4ld] {
    width: 12px;
    height: 12px;
    background-color: var(--sector-color, #ffcc03);
    border-radius: 2px;
    flex-shrink: 0;
}

.tarifa-sector-nombre[b-va68ofq4ld] {
    font-size: 1rem;
    font-weight: 700;
    color: #1a1a1a;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Lista de tipos de entrada - Más compacta */
.tarifa-tipos-lista[b-va68ofq4ld] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.tarifa-tipo-item[b-va68ofq4ld] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 8px;
    background: #fafafa;
    border-radius: 4px;
    cursor: default;
}

.tarifa-tipo-nombre[b-va68ofq4ld] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    color: #333;
    flex: 1;
}

.tarifa-tipo-nombre i[b-va68ofq4ld] {
    display: none;
}

.tarifa-tipo-precio-container[b-va68ofq4ld] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.tarifa-tipo-precio[b-va68ofq4ld] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1a1a1a;
    white-space: nowrap;
    letter-spacing: -0.3px;
}

/* Botón de información adicional */
.tarifa-info-btn[b-va68ofq4ld] {
    background: transparent;
    border: none;
    color: #ffcc03;
    cursor: pointer;
    padding: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    transition: all 0.2s ease;
    font-size: 14px;
}

.tarifa-info-btn:hover[b-va68ofq4ld] {
    background: rgba(255, 204, 3, 0.1);
    transform: scale(1.1);
}

.tarifa-info-btn:active[b-va68ofq4ld] {
    transform: scale(0.95);
}

.tarifa-info-btn.activo[b-va68ofq4ld] {
    background: rgba(255, 204, 3, 0.15);
    color: #ff9900;
}

/* Detalle de información expandible */
.tarifa-info-detalle[b-va68ofq4ld] {
    margin-top: 4px;
    margin-bottom: 4px;
    padding: 8px 12px;
    background: #fffef5;
    border: 1px solid #ffcc03;
    border-radius: 4px;
    animation: slideDown-b-va68ofq4ld 0.3s ease-out;
}

@keyframes slideDown-b-va68ofq4ld {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.tarifa-info-contenido[b-va68ofq4ld] {
    font-size: 0.8rem;
    color: #333;
    line-height: 1.5;
}

.tarifa-info-contenido p[b-va68ofq4ld] {
    margin: 4px 0;
}

.tarifa-info-contenido strong[b-va68ofq4ld] {
    color: #1a1a1a;
    font-weight: 600;
}

/* Footer de información */
.tarifas-info-footer[b-va68ofq4ld] {
    margin-bottom: 25px;
    padding-top: 15px;
    border-top: 1px solid #e0e0e0;
}

.tarifas-info-texto[b-va68ofq4ld] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9rem;
    color: #666;
    margin: 0;
}

.tarifas-info-texto i[b-va68ofq4ld] {
    color: #ffcc03;
}

/* Sección de descuentos */
.descuentos-seccion[b-va68ofq4ld] {
    background: #fffef5;
    border: 2px solid #ffcc03;
    border-radius: 8px;
    padding: 18px;
}

.descuentos-titulo[b-va68ofq4ld] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.1rem;
    font-weight: 700;
    color: #000;
    margin-bottom: 12px;
}

.descuentos-titulo i[b-va68ofq4ld] {
    color: #ffcc03;
    font-size: 20px;
}

.descuentos-lista[b-va68ofq4ld] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.descuento-item[b-va68ofq4ld] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.95rem;
    color: #333;
    padding: 8px 0;
}

.descuento-item i[b-va68ofq4ld] {
    color: #ffcc03;
    font-size: 16px;
}

/* Mensaje cuando no hay tarifas - Más claro y útil */
.sin-tarifas-mensaje[b-va68ofq4ld] {
    text-align: center;
    padding: 50px 30px;
    background: linear-gradient(135deg, #fffef5 0%, #ffffff 100%);
    border: 3px dashed #ffcc03;
    border-radius: 12px;
    color: #333;
}

.sin-tarifas-mensaje i[b-va68ofq4ld] {
    font-size: 48px;
    color: #ffcc03;
    margin-bottom: 16px;
    display: block;
}

.sin-tarifas-mensaje p[b-va68ofq4ld] {
    margin: 8px 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: #1a1a1a;
}

.sin-tarifas-mensaje .mensaje-secundario[b-va68ofq4ld] {
    font-size: 0.95rem;
    font-weight: 500;
    color: #666;
    margin-top: 8px;
}

/* Responsive - Optimizado para móvil - Ultra compacto e informativo */
@media (max-width: 768px) {
    .sector-precios-container[b-va68ofq4ld] {
        padding: 0px 4px;
        margin-bottom: 12px;
    }
    
    .tarifas-titulo[b-va68ofq4ld] {
        margin-bottom: 12px;
    }
    
    .tarifas-titulo h4[b-va68ofq4ld] {
        font-size: 1rem;
        margin-bottom: 4px;
    }
    
    .tarifas-subtitulo[b-va68ofq4ld] {
        font-size: 0.75rem;
        display: none; /* Ocultamos el subtítulo en móvil para ahorrar espacio */
    }
    
    .tarifas-lista[b-va68ofq4ld] {
        gap: 10px;
        margin-bottom: 12px;
    }
    
    .tarifa-sector-card[b-va68ofq4ld] {
        padding: 12px;
        border-radius: 6px;
        border-left-width: 3px;
        box-shadow: 0 1px 2px rgba(0,0,0,0.03);
    }
    
    .tarifa-sector-header[b-va68ofq4ld] {
        margin-bottom: 8px;
        padding-bottom: 8px;
        gap: 6px;
    }
    
    .tarifa-sector-indicador[b-va68ofq4ld] {
        width: 10px;
        height: 10px;
    }
    
    .tarifa-sector-nombre[b-va68ofq4ld] {
        font-size: 0.85rem;
        letter-spacing: 0.3px;
    }
    
    .tarifa-tipos-lista[b-va68ofq4ld] {
        gap: 6px;
    }
    
    .tarifa-tipo-item[b-va68ofq4ld] {
        padding: 8px 10px;
        border-radius: 4px;
        flex-wrap: nowrap;
        gap: 6px;
    }
    
    .tarifa-tipo-nombre[b-va68ofq4ld] {
        font-size: 0.85rem;
        gap: 6px;
        flex: 1;
        min-width: 0;
    }
    
    .tarifa-tipo-nombre span[b-va68ofq4ld] {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    
    .tarifa-tipo-precio[b-va68ofq4ld] {
        font-size: 0.95rem;
        white-space: nowrap;
        flex-shrink: 0;
    }
    
    .tarifas-info-footer[b-va68ofq4ld] {
        margin-bottom: 12px;
        padding-top: 8px;
        display: none; /* Ocultamos info footer en móvil */
    }
    
    .descuentos-seccion[b-va68ofq4ld] {
        padding: 10px;
        border-radius: 6px;
        display: none; /* Ocultamos descuentos en móvil para ahorrar espacio */
    }
    
    .sin-tarifas-mensaje[b-va68ofq4ld] {
        padding: 20px 15px;
        border-radius: 8px;
    }
    
    .sin-tarifas-mensaje i[b-va68ofq4ld] {
        font-size: 28px;
        margin-bottom: 8px;
    }
    
    .sin-tarifas-mensaje p[b-va68ofq4ld] {
        font-size: 0.9rem;
    }
    
    .sin-tarifas-mensaje .mensaje-secundario[b-va68ofq4ld] {
        font-size: 0.8rem;
    }
}
/* /Modules/EventoDetalle/Pages/EventoDetallePage.razor.rz.scp.css */
/* Estilos modernos para mejorar la usabilidad y estética del proceso de venta */

.evento-detalle-container[b-o3jeb9i2nb] {
    margin-top: 10px;
    margin-bottom: 120px; /* Espacio para el botón sticky */
    padding-bottom: 20px;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden; /* Prevenir desbordamiento horizontal */
}

/* Instrucción principal - Compacta */
.instruccion-principal[b-o3jeb9i2nb] {
    background: linear-gradient(135deg, #ffcc03 0%, #ffd93f 100%);
    border-radius: 8px;
    padding: 12px 18px;
    margin-bottom: 16px;
    box-shadow: 0 2px 8px rgba(255,204,3,0.2);
}

.instruccion-contenido[b-o3jeb9i2nb] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.instruccion-icono[b-o3jeb9i2nb] {
    font-size: 22px;
    color: #000;
    flex-shrink: 0;
}

.instruccion-texto[b-o3jeb9i2nb] {
    flex: 1;
}

.instruccion-titulo[b-o3jeb9i2nb] {
    font-size: 1rem;
    font-weight: 700;
    color: #000;
    margin: 0;
    letter-spacing: -0.2px;
    line-height: 1.2;
}

.instruccion-descripcion[b-o3jeb9i2nb] {
    display: none; /* Ocultamos para reducir espacio */
}

/* Ayuda visual para el usuario - Compacta */
.ayuda-visual[b-o3jeb9i2nb] {
    background: #fffef5;
    border: 2px solid #ffcc03;
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.ayuda-visual i[b-o3jeb9i2nb] {
    font-size: 20px;
    color: #ffcc03;
    flex-shrink: 0;
}

.ayuda-visual p[b-o3jeb9i2nb] {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: #1a1a1a;
}

.fecha-destacada[b-o3jeb9i2nb] {
    color: #ffcc03;
    font-weight: 800;
    background: #000;
    padding: 2px 8px;
    border-radius: 4px;
}

@keyframes pulse-b-o3jeb9i2nb {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.02);
    }
}

/* Mejoras al paso container */
.paso-activo[b-o3jeb9i2nb] {
    border: 2px solid #ffcc03;
    box-shadow: 0 8px 32px rgba(255,204,3,0.2);
}

.paso-header[b-o3jeb9i2nb] {
    margin-bottom: 16px !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.paso-texto[b-o3jeb9i2nb] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.paso-texto strong[b-o3jeb9i2nb] {
    font-size: 1.2rem;
    color: #1a1a1a;
    line-height: 1.3;
    display: flex;
    align-items: center;
    gap: 8px;
}

.paso-texto strong[b-o3jeb9i2nb]::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    background: #ffcc03;
    border-radius: 50%;
}

.paso-subtitulo[b-o3jeb9i2nb] {
    font-size: 0.85rem;
    color: #666;
    font-weight: 500;
    margin-top: 2px;
}

/* Banner de confirmación de fecha seleccionada - Ultra compacto */
.fecha-seleccionada-banner[b-o3jeb9i2nb] {
    background: linear-gradient(135deg, #ffcc03 0%, #ffd93f 100%);
    color: #000;
    padding: 8px 0;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
    animation: slideDown-b-o3jeb9i2nb 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    position: sticky;
    top: 200px;
    z-index: 99;
    backdrop-filter: blur(10px);
}

@keyframes slideDown-b-o3jeb9i2nb {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fecha-seleccionada-banner .paso-indicator[b-o3jeb9i2nb] {
    font-weight: 700;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    font-size: 0.75rem;
}

.fecha-seleccionada-banner .fecha-display[b-o3jeb9i2nb] {
    color: #000;
    font-weight: 600;
    margin-left: 8px;
    font-size: 0.85rem;
    letter-spacing: 0.2px;
}

/* Contenedor de pasos - Diseño compacto */
.paso-container[b-o3jeb9i2nb] {
    background: #fff;
    padding: 18px 20px;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    margin-bottom: 16px;
    margin-top: 0 !important;
    border: 1px solid rgba(0,0,0,0.05);
    transition: box-shadow 0.2s ease;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
}

.paso-container:hover[b-o3jeb9i2nb] {
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}

.paso-titulo[b-o3jeb9i2nb] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    margin-top: 0 !important;
    padding-top: 0 !important;
    font-size: 1.1rem;
    font-weight: 700;
    color: #1a1a1a;
    letter-spacing: -0.3px;
    line-height: 1.3;
}

.paso-numero[b-o3jeb9i2nb] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: linear-gradient(135deg, #ffcc03 0%, #ffd93f 100%);
    color: #000;
    border-radius: 10px;
    font-weight: 800;
    font-size: 1.3rem;
    box-shadow: 0 3px 10px rgba(255,204,3,0.35);
    flex-shrink: 0;
}

.paso-contenido[b-o3jeb9i2nb] {
    animation: fadeInSlideUp-b-o3jeb9i2nb 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes fadeIn-b-o3jeb9i2nb {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInSlideUp-b-o3jeb9i2nb {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Sidebar de información del evento - Oculto para evitar solapamientos */
.evento-info-sidebar[b-o3jeb9i2nb] {
    display: none !important; /* Ocultamos completamente para evitar solapamientos */
}

/* Información adicional - Mejor separación visual */
.info-adicional[b-o3jeb9i2nb] {
    margin-top: 50px;
    padding-top: 30px;
    border-top: 2px solid #e8e8e8;
}

/* Botón sticky de compra - Siempre visible */
.boton-compra-sticky[b-o3jeb9i2nb] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, #ffffff 100%);
    padding: 20px 0;
    box-shadow: 0 -8px 32px rgba(0,0,0,0.2);
    z-index: 9999;
    border-top: 4px solid #ffcc03;
    backdrop-filter: blur(10px);
}

.boton-compra-fixed[b-o3jeb9i2nb] {
    width: 100%;
    max-width: 500px;
    padding: 20px 40px;
    font-size: 18px;
    font-weight: 800;
    border-radius: 12px;
    background: linear-gradient(135deg, #1a1a1a 0%, #2a2a2a 100%);
    color: #fff;
    border: none;
    box-shadow: 0 6px 20px rgba(0,0,0,0.3);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-size: 16px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.boton-compra-fixed[b-o3jeb9i2nb]::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 0;
    height: 0;
    border-radius: 50%;
    background: rgba(255,204,3,0.3);
    transform: translate(-50%, -50%);
    transition: width 0.6s, height 0.6s;
}

.boton-compra-fixed:hover:not([disabled])[b-o3jeb9i2nb]::before {
    width: 300px;
    height: 300px;
}

.boton-compra-fixed:hover:not([disabled])[b-o3jeb9i2nb] {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.4);
    background: linear-gradient(135deg, #2a2a2a 0%, #1a1a1a 100%);
}

.boton-compra-fixed:active:not([disabled])[b-o3jeb9i2nb] {
    transform: translateY(-1px);
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

.boton-compra-fixed[disabled][b-o3jeb9i2nb] {
    cursor: not-allowed;
    opacity: 0.4;
    background: #999;
    pointer-events: auto;
    transform: none;
}

.boton-compra-fixed i[b-o3jeb9i2nb] {
    margin-right: 10px;
    font-size: 18px;
}

/* Paso 3 destacado - Mejor jerarquía visual */
.paso-3-destacado[b-o3jeb9i2nb] {
    border: 2px solid #ffcc03;
    box-shadow: 0 4px 20px rgba(255,204,3,0.15);
}

.paso-3-header[b-o3jeb9i2nb] {
    margin-bottom: 16px !important;
}

.paso-3-titulo[b-o3jeb9i2nb] {
    font-size: 1.1rem;
    margin-bottom: 14px !important;
}

.paso-3-numero[b-o3jeb9i2nb] {
    width: 44px;
    height: 44px;
    font-size: 1.3rem;
    box-shadow: 0 3px 10px rgba(255,204,3,0.35);
}

.paso-texto strong i[b-o3jeb9i2nb] {
    font-size: 1rem;
    margin-right: 6px;
    color: #ffcc03;
}

/* Responsive - Ajustes optimizados para móvil */
@media (max-width: 768px) {
    .evento-detalle-container[b-o3jeb9i2nb] {
        margin-top: 5px;
        margin-bottom: 100px;
        padding-bottom: 15px;
    }
    
    .fecha-seleccionada-banner[b-o3jeb9i2nb] {
        top: 150px;
        padding: 8px 0;
    }
    
    .fecha-seleccionada-banner .paso-indicator[b-o3jeb9i2nb] {
        font-size: 0.7rem;
    }
    
    .fecha-seleccionada-banner .fecha-display[b-o3jeb9i2nb] {
        font-size: 0.75rem;
        margin-left: 6px;
    }
    
    .fecha-seleccionada-banner .col-md-6[b-o3jeb9i2nb] {
        padding: 0 10px;
    }
    
    .fecha-seleccionada-banner .col-md-6.text-end[b-o3jeb9i2nb] {
        text-align: left !important;
        margin-top: 4px;
    }
    
    .evento-info-sidebar[b-o3jeb9i2nb] {
        display: none;
    }
    
    .paso-container[b-o3jeb9i2nb] {
        padding: 0.75rem 1rem; /* 12px 16px - más compacto */
        border-radius: 0.625rem; /* 10px */
        margin-bottom: 0.875rem; /* 14px */
        overflow-x: hidden; /* Prevenir desbordamiento horizontal */
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
    }
    
    .paso-header[b-o3jeb9i2nb] {
        margin-bottom: 12px;
    }
    
    .paso-titulo[b-o3jeb9i2nb] {
        font-size: 1.1rem;
        gap: 10px;
        margin-bottom: 14px;
        flex-wrap: wrap;
    }
    
    .paso-numero[b-o3jeb9i2nb] {
        width: 36px;
        height: 36px;
        font-size: 1.1rem;
        border-radius: 8px;
    }
    
    .paso-texto strong[b-o3jeb9i2nb] {
        font-size: 1rem;
    }
    
    .paso-subtitulo[b-o3jeb9i2nb] {
        font-size: 0.8rem;
    }
    
    .paso-3-numero[b-o3jeb9i2nb] {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }
    
    /* Paso 3 más compacto en móvil */
    .paso-3-destacado[b-o3jeb9i2nb] {
        padding: 14px;
    }
    
    .paso-3-header[b-o3jeb9i2nb] {
        margin-bottom: 12px;
    }
    
    .paso-3-titulo[b-o3jeb9i2nb] {
        font-size: 1.05rem;
    }
    
    /* Ocultar plano en móvil para ahorrar espacio */
    .plano-movil[b-o3jeb9i2nb] {
        display: none;
    }
    
    .ayuda-visual[b-o3jeb9i2nb] {
        padding: 10px 12px;
        margin-bottom: 12px;
        gap: 8px;
    }
    
    .ayuda-visual i[b-o3jeb9i2nb] {
        font-size: 18px;
    }
    
    .ayuda-visual p[b-o3jeb9i2nb] {
        font-size: 0.85rem;
    }
    
    .boton-compra-sticky[b-o3jeb9i2nb] {
        padding: 12px 0;
    }
    
    .boton-compra-fixed[b-o3jeb9i2nb] {
        padding: 14px 24px;
        font-size: 14px;
        max-width: 100%;
        letter-spacing: 0.3px;
    }
    
    .boton-compra-fixed i[b-o3jeb9i2nb] {
        font-size: 16px;
        margin-right: 8px;
    }
    
    .info-adicional[b-o3jeb9i2nb] {
        margin-top: 30px;
        padding-top: 20px;
    }
    
    /* Layout móvil - funciones y precios en columna */
    .paso-contenido .row[b-o3jeb9i2nb] {
        margin: 0;
    }
    
    .paso-contenido .col-lg-5[b-o3jeb9i2nb],
    .paso-contenido .col-lg-7[b-o3jeb9i2nb] {
        padding-left: 0;
        padding-right: 0;
        margin-bottom: 16px;
    }
    
    .plano-movil[b-o3jeb9i2nb] {
        margin-bottom: 20px;
        padding: 0 15px !important;
    }
    
    .plano-movil img[b-o3jeb9i2nb] {
        border-radius: 8px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    }
}

/* Alineación de columnas - Desktop */
@media (min-width: 992px) {
    .paso-contenido .row[b-o3jeb9i2nb] {
        align-items: flex-start;
        display: flex;
        flex-wrap: wrap;
        margin-left: -15px;
        margin-right: -15px;
    }
    
    .paso-contenido .col-lg-5[b-o3jeb9i2nb],
    .paso-contenido .col-lg-7[b-o3jeb9i2nb] {
        padding-left: 15px;
        padding-right: 15px;
        display: flex;
        flex-direction: column;
        margin-bottom: 0 !important;
        align-items: stretch;
    }
    
    /* Eliminar márgenes del wrapper de funciones - completamente limpio */
    .paso-contenido .col-lg-5 .funciones-selector-container[b-o3jeb9i2nb] {
        margin: 0 !important;
        padding: 0 !important;
        height: auto;
        width: 100%;
    }
    
    /* Asegurar que ambos pasos estén alineados arriba - mismo padding exacto */
    .paso-contenido .col-lg-5 .paso-container[b-o3jeb9i2nb] {
        margin-top: 0 !important;
        margin-bottom: 16px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-top: 18px !important;
        padding-bottom: 18px !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    
    /* Paso 3 - Ajuste para alineación perfecta con Paso 2 usando valores relativos */
    .paso-contenido .col-lg-7 .paso-container[b-o3jeb9i2nb] {
        margin-top: 0 !important;
        margin-bottom: 1rem !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-top: 1.125rem !important;
        padding-bottom: 1.125rem !important;
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important;
    }
    
    /* Ajustar el padding-top relativo de la columna del Paso 3 para alinear las líneas amarillas */
    .paso-contenido .col-lg-7[b-o3jeb9i2nb] {
        padding-top: 1.26rem;
    }
    
    /* Asegurar que el wrapper de funciones no tenga padding extra */
    .paso-contenido .col-lg-5 .funciones-selector-container[b-o3jeb9i2nb] {
        padding-top: 0;
    }
    
    /* Alinear los headers de los pasos - mismo padding y margin exacto */
    .paso-contenido .col-lg-5 .paso-header[b-o3jeb9i2nb],
    .paso-contenido .col-lg-7 .paso-header[b-o3jeb9i2nb],
    .paso-contenido .col-lg-7 .paso-3-header[b-o3jeb9i2nb] {
        margin: 0 0 16px 0 !important;
        padding: 0 !important;
    }
    
    /* Alinear los títulos de los pasos - mismo margin exacto */
    .paso-contenido .col-lg-5 .paso-titulo[b-o3jeb9i2nb],
    .paso-contenido .col-lg-7 .paso-titulo[b-o3jeb9i2nb],
    .paso-contenido .col-lg-7 .paso-3-titulo[b-o3jeb9i2nb] {
        margin: 0 0 14px 0 !important;
        padding: 0 !important;
        font-size: 1.1rem !important;
    }
    
    /* Asegurar que los números de paso estén alineados verticalmente en la misma posición */
    .paso-contenido .col-lg-5 .paso-numero[b-o3jeb9i2nb],
    .paso-contenido .col-lg-7 .paso-numero[b-o3jeb9i2nb],
    .paso-contenido .col-lg-7 .paso-3-numero[b-o3jeb9i2nb] {
        vertical-align: top;
        margin: 0 !important;
        padding: 0 !important;
        width: 44px !important;
        height: 44px !important;
        font-size: 1.3rem !important;
    }
}

/* /Modules/PagoPendiente/Components/PagoError.razor.rz.scp.css */
.tarjeta-contenedor[b-tuo0yhum7u] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    width: 100%;
    padding: 1.25rem;
}

@media (max-width: 768px) {
    .tarjeta-contenedor[b-tuo0yhum7u] {
        padding: 0.625rem;
        height: 100vh;
    }
}

.tarjeta[b-tuo0yhum7u] {
    width: 35rem;
    background-color: #ffcc03;
    border-radius: 0.9375rem;
}

@media (max-width: 600px) {
    .tarjeta[b-tuo0yhum7u] {
        width: 25rem;
    }
}

@media (max-width: 430px) {
    .tarjeta[b-tuo0yhum7u] {
        width: 19rem;
    }
}

.confirmacionPago[b-tuo0yhum7u] {
    text-align: center;
    padding: 1.875rem;
    color: black;
    font-size: 2em;
    font-weight: 700;
}

@media (max-width: 768px) {
    .confirmacionPago[b-tuo0yhum7u] {
        font-size: 1.5em;
        padding: 1.25rem;
    }
}

    .confirmacionPago img[b-tuo0yhum7u] {
        height: auto;
        width: 8.5625rem;
    }

@media (max-width: 768px) {
    .confirmacionPago img[b-tuo0yhum7u] {
        width: 6.25rem;
    }
}

.icono-error-container[b-tuo0yhum7u] {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 1rem;
    width: 100%;
}

.icono-error[b-tuo0yhum7u] {
    width: 3.4375rem;
    height: 3.4375rem;
    display: block;
    margin: 0 auto;
}

@media (max-width: 768px) {
    .icono-error[b-tuo0yhum7u] {
        width: 2.8125rem;
        height: 2.8125rem;
    }
}

.card-body[b-tuo0yhum7u] {
    text-align: center;
    margin-bottom: 0.9375rem;
    color: black;
    padding: 1.875rem;
}

@media (max-width: 768px) {
    .card-body[b-tuo0yhum7u] {
        padding: 1.25rem;
    }
}

    .card-body card-title[b-tuo0yhum7u] {
        color: #05F24C;
        font-size: x-large;
    }

@media (max-width: 768px) {
    .card-body card-title[b-tuo0yhum7u] {
        font-size: large;
    }
}
/* /Modules/PagoPendiente/Components/PagoExitoso.razor.rz.scp.css */
.tarjeta-contenedor[b-ddhtfcweay] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    width: 100%;
    padding: 1.25rem;
}

@media (max-width: 768px) {
    .tarjeta-contenedor[b-ddhtfcweay] {
        padding: 0.625rem;
        height: 100vh;
    }
}

.tarjeta[b-ddhtfcweay] {
    width: 35rem;
    background-color: #ffcc03;
    border-radius: 0.9375rem;
}

@media (max-width: 600px) {
    .tarjeta[b-ddhtfcweay] {
        width: 25rem;
    }
}

@media (max-width: 430px) {
    .tarjeta[b-ddhtfcweay] {
        width: 19rem;
    }
}

.confirmacionPago[b-ddhtfcweay] {
    text-align: center;
    padding: 1.875rem;
    color: black;
    font-size: 2em;
    font-weight: 700;
}

@media (max-width: 768px) {
    .confirmacionPago[b-ddhtfcweay] {
        font-size: 1.5em;
        padding: 1.25rem;
    }
}

    .confirmacionPago img[b-ddhtfcweay] {
        height: auto;
        width: 8.5625rem;
    }

@media (max-width: 768px) {
    .confirmacionPago img[b-ddhtfcweay] {
        width: 6.25rem;
    }
}

.icono-tilde-container[b-ddhtfcweay] {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 1rem;
    width: 100%;
}

.icono-tilde[b-ddhtfcweay] {
    width: 3.4375rem;
    height: 3.4375rem;
    display: block;
    margin: 0 auto;
}

@media (max-width: 768px) {
    .icono-tilde[b-ddhtfcweay] {
        width: 2.8125rem;
        height: 2.8125rem;
    }
}

.card-body[b-ddhtfcweay] {
    text-align: center;
    margin-bottom: 0.9375rem;
    color: black;
    padding: 1.875rem;
}

@media (max-width: 768px) {
    .card-body[b-ddhtfcweay] {
        padding: 1.25rem;
    }
}

    .card-body card-title[b-ddhtfcweay] {
        color: #05F24C;
        font-size: x-large;
    }

@media (max-width: 768px) {
    .card-body card-title[b-ddhtfcweay] {
        font-size: large;
    }
}
/* /Modules/PagoPendiente/Pages/PagoPendientePage.razor.rz.scp.css */
.tarjeta-contenedor[b-3i7aqhzypw] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    width: 100%;
    padding: 1.25rem;
}

@media (max-width: 768px) {
    .tarjeta-contenedor[b-3i7aqhzypw] {
        padding: 0.625rem;
        height: 100vh;
    }
}

.card[b-3i7aqhzypw] {
    width: 35rem;
    background-color: #ffcc03;
    border-radius: 0.9375rem;
    margin: 0 auto;
}

@media (max-width: 600px) {
    .card[b-3i7aqhzypw] {
        width: 25rem;
    }
}

@media (max-width: 430px) {
    .card[b-3i7aqhzypw] {
        width: 19rem;
    }
}

.procesandoPago[b-3i7aqhzypw] {
    text-align: center;
    padding: 1.875rem;
    color: black;
    font-size: 2em;
    font-weight: 700;
}

@media (max-width: 768px) {
    .procesandoPago[b-3i7aqhzypw] {
        font-size: 1.5em;
        padding: 1.25rem;
    }
}

    .procesandoPago img[b-3i7aqhzypw] {
        height: auto;
        width: 8.5625rem;
    }

@media (max-width: 768px) {
    .procesandoPago img[b-3i7aqhzypw] {
        width: 6.25rem;
    }
}

.spinner-container[b-3i7aqhzypw] {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 1rem;
    width: 100%;
}

.spinner-grow[b-3i7aqhzypw] {
    color: black;
    width: 3.4375rem;
    height: 3.4375rem;
}

@media (max-width: 768px) {
    .spinner-grow[b-3i7aqhzypw] {
        width: 2.8125rem;
        height: 2.8125rem;
    }
}

.card-body[b-3i7aqhzypw] {
    text-align: center;
    margin-bottom: 0.9375rem;
    color: black;
    padding: 1.875rem;
}

@media (max-width: 768px) {
    .card-body[b-3i7aqhzypw] {
        padding: 1.25rem;
    }
}

.card-title[b-3i7aqhzypw] {
    color: black;
    font-size: x-large;
}

@media (max-width: 768px) {
    .card-title[b-3i7aqhzypw] {
        font-size: large;
    }
}

.card-text span[b-3i7aqhzypw] {
    color: black;
    font-weight: 500;
    font-size: 1.125rem;
}

@media (max-width: 768px) {
    .card-text span[b-3i7aqhzypw] {
        font-size: 1rem;
    }
}
/* /Modules/Principal/Components/DestacadoItem.razor.rz.scp.css */
.boton-destacado[b-catg5ue4oy] {
    background: #ffcc03;
    border: none;
    padding: 0;
    cursor: pointer;
}

/* Optimización para elementos destacados más compactos y minimalistas */
.ovrly01[b-catg5ue4oy] {
    border-radius: 6px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
    transition: all 0.2s ease-in-out;
    overflow: hidden;
}

.ovrly01:hover[b-catg5ue4oy] {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

.ovrly01 img[b-catg5ue4oy] {
    border-radius: 6px;
    object-fit: cover;
    width: 100%;
    height: 100%;
    transition: transform 0.3s ease;
}

.ovrly01:hover img[b-catg5ue4oy] {
    transform: scale(1.05);
}

/* Reducir el tamaño del botón para elementos más pequeños */
.ovrly01 .buttons .fa[b-catg5ue4oy] {
    width: 30px;
    height: 30px;
    line-height: 30px;
    font-size: 12px;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.ovrly01:hover .buttons .fa[b-catg5ue4oy] {
    opacity: 1;
}

/* Hacer el overlay más sutil */
.ovrly01 .ovrlyT[b-catg5ue4oy],
.ovrly01 .ovrlyB[b-catg5ue4oy] {
    background: rgba(0, 0, 0, 0.15);
}
/* /Modules/Principal/Components/EnCartelera.razor.rz.scp.css */
.cmpt[b-3rzdbwc0xx] {
    font-weight: 600;
    padding: 1rem;
    background-color: #ffcc03;
    color: #212529;
}
.cmptItem[b-3rzdbwc0xx] {
    background-color: black;
    padding: 15px;
    height: 90%;
}
/* /Modules/Principal/Components/EnCartelerasItem.razor.rz.scp.css */
.cptn01[b-gi4npk4k1j] {
    height: 120px;
    width: auto;
    margin-bottom: 15px;
    border: 1px solid #fff;
}
.cptn[b-gi4npk4k1j] {
    background-color: black;
}
.boton-cartelera[b-gi4npk4k1j] {
    background: none;
    border-color: #ffcc03;
    color: #ffcc03;
    padding: 0;
    cursor: pointer;
}
/* /Modules/Principal/Components/FiltrarEvento.razor.rz.scp.css */
/* Contenedor principal del filtro */
.filter-container[b-9sobqjt86e] {
    background-color: #ffffff;
    padding: 1rem 1.25rem;
    border-radius: 0.5rem;
    box-shadow: 0 0.125rem 0.5rem rgba(0,0,0,0.08);
    margin: 1rem 0;
    border: 1px solid #e9ecef;
}

/* Filtro principal */
.main-filter[b-9sobqjt86e] {
    display: flex;
    gap: 1rem;
    align-items: center;
    margin-bottom: 1rem;
}

/* Contenedor del input de búsqueda principal */
.search-input-wrapper[b-9sobqjt86e] {
    flex: 1;
    position: relative;
    display: flex;
    align-items: center;
}

/* Input de búsqueda principal */
.main-search-input[b-9sobqjt86e] {
    width: 100%;
    padding: 1.125rem 3.125rem 1.125rem 1.25rem;
    border: 2px solid #e9ecef;
    border-radius: 0.625rem;
    font-size: 1rem;
    background-color: white;
    transition: all 0.3s ease;
    box-sizing: border-box;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.05);
}

.main-search-input:focus[b-9sobqjt86e] {
    outline: none;
    border-color: #ffcc03;
    box-shadow: 0 0 0 0.1875rem rgba(255, 204, 3, 0.1), 0 0.25rem 0.5rem rgba(0,0,0,0.1);
}

/* Botón de búsqueda */
.search-btn[b-9sobqjt86e] {
    position: absolute;
    right: 0.625rem;
    background: none;
    border: none;
    font-size: 1.125rem;
    cursor: pointer;
    padding: 0.5rem;
    border-radius: 0.375rem;
    transition: background-color 0.2s ease;
}

.search-btn:hover[b-9sobqjt86e] {
    background-color: #f8f9fa;
}

/* Botón para expandir/contraer filtros */
.expand-filters-btn[b-9sobqjt86e] {
    padding: 0.75rem 1.125rem;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 0.5rem;
    color: #495057;
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
    font-weight: 500;
}

.expand-filters-btn:hover[b-9sobqjt86e] {
    background-color: #e9ecef;
    border-color: #adb5bd;
    transform: translateY(-0.0625rem);
}

/* Filtros adicionales */
.additional-filters[b-9sobqjt86e] {
    border-top: 1px solid #e9ecef;
    padding-top: 1.25rem;
    animation: slideDown-b-9sobqjt86e 0.4s ease-out;
}

@keyframes slideDown-b-9sobqjt86e {
    from {
        opacity: 0;
        transform: translateY(-0.9375rem);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Fila de filtros */
.filters-row[b-9sobqjt86e] {
    display: flex;
    gap: 1rem;
    align-items: flex-end;
    flex-wrap: wrap;
}

/* Campo de filtro individual */
.filter-field[b-9sobqjt86e] {
    flex: 1;
    min-width: 12.5rem;
    position: relative;
}

/* Etiqueta del filtro */
.filter-label[b-9sobqjt86e] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.03125rem;
    display: block;
}

/* Contenedor del input */
.input-wrapper[b-9sobqjt86e] {
    position: relative;
    display: flex;
    align-items: center;
}

/* Input de filtro */
.filter-input[b-9sobqjt86e] {
    width: 100%;
    padding: 0.75rem 2.1875rem 0.75rem 0.9375rem;
    border: 1px solid #ced4da;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    background-color: white;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.filter-input:focus[b-9sobqjt86e] {
    outline: none;
    border-color: #ffcc03;
    box-shadow: 0 0 0 0.125rem rgba(255, 204, 3, 0.1);
}

.filter-input:disabled[b-9sobqjt86e] {
    background-color: #f8f9fa;
    color: #6c757d;
    cursor: not-allowed;
}

/* Input de fecha específico */
.date-input[b-9sobqjt86e] {
    padding-right: 2.1875rem;
}

/* Icono del input */
.input-icon[b-9sobqjt86e] {
    position: absolute;
    right: 0.625rem;
    color: #6c757d;
    font-size: 0.75rem;
    pointer-events: none;
}

/* Lista desplegable */
.dropdown-list[b-9sobqjt86e] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    border: 1px solid #ced4da;
    border-top: none;
    border-radius: 0 0 0.375rem 0.375rem;
    max-height: 12.5rem;
    overflow-y: auto;
    z-index: 1000;
    box-shadow: 0 0.25rem 0.5rem rgba(0,0,0,0.1);
    margin: 0;
    padding: 0;
    list-style: none;
}

.dropdown-list li[b-9sobqjt86e] {
    padding: 0.625rem 0.9375rem;
    cursor: pointer;
    border-bottom: 1px solid #f8f9fa;
    font-size: 0.875rem;
    transition: background-color 0.2s ease;
}

.dropdown-list li:last-child[b-9sobqjt86e] {
    border-bottom: none;
}

.dropdown-list li:hover[b-9sobqjt86e] {
    background-color: #f8f9fa;
}

/* Mensaje de error */
.error-message[b-9sobqjt86e] {
    color: #dc3545;
    font-size: 0.75rem;
    margin-top: 0.3125rem;
    padding: 0.3125rem 0.625rem;
    background-color: #f8d7da;
    border-radius: 0.25rem;
}

/* Botón de limpiar */
.clear-btn[b-9sobqjt86e] {
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    background-color: #f8f9fa;
    border: 1px solid #dee2e6;
    border-radius: 50%;
    color: #6c757d;
    font-size: 1rem;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.clear-btn:hover[b-9sobqjt86e] {
    background-color: #e9ecef;
    color: #dc3545;
    border-color: #dc3545;
    transform: scale(1.05);
}

/* Responsive - Mejoras para móvil */
@media (max-width: 48rem) {
    .filter-container[b-9sobqjt86e] {
        padding: 0.875rem 0.5rem;
        margin: 0.75rem 0;
    }
    
    .main-filter[b-9sobqjt86e] {
        flex-direction: column;
        gap: 0.75rem;
        align-items: stretch;
    }
    
    .search-input-wrapper[b-9sobqjt86e] {
        order: 1;
    }
    
    .expand-filters-btn[b-9sobqjt86e] {
        order: 2;
        width: 100%;
        padding: 0.875rem;
        font-size: 0.875rem;
    }
    
    .additional-filters[b-9sobqjt86e] {
        padding-top: 1rem;
    }
    
    .filters-row[b-9sobqjt86e] {
        flex-direction: column;
        gap: 0.75rem;
        width: 100%;
    }
    
    .filter-field[b-9sobqjt86e] {
        min-width: auto;
        width: 100%;
        flex: 1 1 100%;
    }
    
    .filter-label[b-9sobqjt86e] {
        font-size: 0.6875rem;
        margin-bottom: 0.375rem;
    }
    
    .filter-input[b-9sobqjt86e] {
        padding: 0.875rem 2.5rem 0.875rem 0.75rem;
        font-size: 1rem;
        width: 100%;
        box-sizing: border-box;
        margin: 0;
    }
    
    .main-search-input[b-9sobqjt86e] {
        padding: 1rem 3rem 1rem 0.75rem;
        font-size: 1rem;
        margin: 0;
    }
    
    .dropdown-list[b-9sobqjt86e] {
        max-height: 10rem;
        width: 100%;
    }
    
    .dropdown-list li[b-9sobqjt86e] {
        padding: 0.875rem 1rem;
        font-size: 1rem;
    }
    
    .clear-btn[b-9sobqjt86e] {
        width: 3rem;
        height: 3rem;
        font-size: 1.125rem;
    }
    
    /* Asegurar que los inputs ocupen todo el ancho */
    .input-wrapper[b-9sobqjt86e] {
        width: 100%;
        margin: 0;
    }
    
    .filter-field[b-9sobqjt86e] {
        margin: 0;
        padding: 0;
    }
    
    /* Asegurar que el DateEdit ocupe todo el ancho */
    [b-9sobqjt86e] .date-input {
        width: 100% !important;
        margin: 0 !important;
    }
    
    [b-9sobqjt86e] .date-input .b-date-edit {
        width: 100% !important;
        padding: 0.875rem 2.5rem 0.875rem 0.75rem !important;
        font-size: 1rem !important;
        margin: 0 !important;
    }
}

/* Responsive para tablets */
@media (min-width: 48.0625rem) and (max-width: 64rem) {
    .filter-container[b-9sobqjt86e] {
        padding: 1rem 1.125rem;
    }
    
    .filters-row[b-9sobqjt86e] {
        gap: 0.75rem;
    }
    
    .filter-field[b-9sobqjt86e] {
        min-width: 10rem;
    }
}

/* Espaciado adicional para la nueva ubicación */
.filter-container[b-9sobqjt86e] {
    margin: 1.5625rem 0;
}

@media (max-width: 48rem) {
    .filter-container[b-9sobqjt86e] {
        margin: 1.25rem 0;
    }
}

/* Estilos para el DateEdit de Blazorise */
[b-9sobqjt86e] .date-input {
    padding-right: 2.1875rem !important;
}

[b-9sobqjt86e] .date-input .b-date-edit {
    border: 1px solid #ced4da !important;
    border-radius: 0.375rem !important;
    height: auto !important;
}

[b-9sobqjt86e] .date-input .b-date-edit:focus {
    border-color: #ffcc03 !important;
    box-shadow: 0 0 0 0.125rem rgba(255, 204, 3, 0.1) !important;
}

/* Mejoras específicas para móvil en DateEdit */
@media (max-width: 48rem) {
    [b-9sobqjt86e] .date-input .b-date-edit {
        padding: 0.875rem 2.5rem 0.875rem 0.75rem !important;
        font-size: 1rem !important;
        margin: 0 !important;
    }
}
/* /Shared/Components/Footer.razor.rz.scp.css */
.footer-container[b-m0slofknsk] {
    background-color: black;
    padding: 3rem 1.25rem;
    color: #fff;
    width: 100%;
}

.footer-content[b-m0slofknsk] {
    max-width: 1200px;
    margin: 0 auto;
}

.footer-grid[b-m0slofknsk] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 2rem;
    align-items: start;
    margin-bottom: 2rem;
}

.footer-logo-section[b-m0slofknsk] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.footer-logo[b-m0slofknsk] {
    max-width: 200px;
    height: auto;
    margin-bottom: 1rem;
}

.footer-section[b-m0slofknsk] {
    display: flex;
    flex-direction: column;
}

.footer-section h5[b-m0slofknsk] {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: #fff;
}

.footer-nav[b-m0slofknsk] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-nav-item[b-m0slofknsk] {
    margin-bottom: 0.5rem;
}

.footer-nav-link[b-m0slofknsk] {
    color: #ffd700;
    text-decoration: none;
    font-size: 0.9rem;
    transition: color 0.3s ease;
}

.footer-nav-link:hover[b-m0slofknsk] {
    color: #fff;
    text-decoration: none;
}

/* Sección de información de contacto */
.footer-contact-section[b-m0slofknsk] {
    border-top: 1px solid #333;
    padding-top: 2rem;
    margin-top: 1rem;
}

.contact-info[b-m0slofknsk] {
    display: flex;
    justify-content: center;
    gap: 3rem;
    flex-wrap: wrap;
}

.contact-item[b-m0slofknsk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
}

.contact-icon[b-m0slofknsk] {
    color: #ffd700;
    font-size: 1.1rem;
}

.contact-label[b-m0slofknsk] {
    color: #fff;
    font-weight: 500;
}

.contact-link[b-m0slofknsk] {
    color: #ffd700;
    text-decoration: underline;
    transition: color 0.3s ease;
}

.contact-link:hover[b-m0slofknsk] {
    color: #fff;
}

.contact-text[b-m0slofknsk] {
    color: #fff;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .footer-container[b-m0slofknsk] {
        padding: 2rem 1rem;
    }
    
    .footer-grid[b-m0slofknsk] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        text-align: center;
        margin-bottom: 1.5rem;
    }
    
    .footer-logo-section[b-m0slofknsk] {
        align-items: center;
        order: -1;
    }
    
    .footer-logo[b-m0slofknsk] {
        max-width: 150px;
    }
    
    .footer-section h5[b-m0slofknsk] {
        font-size: 1.1rem;
        margin-bottom: 0.75rem;
    }
    
    .footer-nav-link[b-m0slofknsk] {
        font-size: 0.85rem;
    }
    
    .footer-contact-section[b-m0slofknsk] {
        padding-top: 1.5rem;
        margin-top: 0.5rem;
    }
    
    .contact-info[b-m0slofknsk] {
        flex-direction: column;
        gap: 1rem;
        text-align: center;
    }
    
    .contact-item[b-m0slofknsk] {
        justify-content: center;
        font-size: 0.85rem;
    }
}

@media (max-width: 480px) {
    .footer-container[b-m0slofknsk] {
        padding: 1.5rem 0.75rem;
    }
    
    .footer-grid[b-m0slofknsk] {
        gap: 1rem;
        margin-bottom: 1rem;
    }
    
    .footer-logo[b-m0slofknsk] {
        max-width: 120px;
    }
    
    .footer-section h5[b-m0slofknsk] {
        font-size: 1rem;
    }
    
    .footer-nav-link[b-m0slofknsk] {
        font-size: 0.8rem;
    }
    
    .footer-contact-section[b-m0slofknsk] {
        padding-top: 1rem;
    }
    
    .contact-info[b-m0slofknsk] {
        gap: 0.75rem;
    }
    
    .contact-item[b-m0slofknsk] {
        font-size: 0.8rem;
    }
    
    .contact-icon[b-m0slofknsk] {
        font-size: 1rem;
    }
}
/* /Shared/Components/NavMenu.razor.rz.scp.css */
.navbar-logo[b-kn7f5j609m] {
    display: inline-block;
    vertical-align: middle;
    width: 180px;
    padding: 20px;
}

    .navbar-logo img[b-kn7f5j609m] {
        display: block;
        width: 100%;
        height: auto;
    }

.dropdown-menu[b-kn7f5j609m] {
    position: absolute;
    inset: 0px auto auto 0px;
    margin: 0px;
    transform: translate(0px, 40px);
}

.lisesion[b-kn7f5j609m] {
    padding: 10px;
    border-bottom: 1px solid #ffcc03;
    font-size: 14px;
    margin-left: 0px !important;
}

    .lisesion:hover[b-kn7f5j609m] {
        background-color: #ffcc03;
    }

    .lisesion.active[b-kn7f5j609m] {
        background-color: #ffcc03;
    }

button[b-kn7f5j609m] {
    text-decoration: none;
    font-size: 12px;
    width: 100%;
    padding: 5px;
}

/* Mobile Header Styles */
.mobile-header[b-kn7f5j609m] {
    background-color: #fff;
    padding: 0.75rem 1rem;
    position: relative;
    border-bottom: 1px solid #e9ecef;
}

.mobile-header-content[b-kn7f5j609m] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.mobile-logo[b-kn7f5j609m] {
    flex: 1;
}

.mobile-logo-img[b-kn7f5j609m] {
    max-height: 2.5rem;
    width: auto;
}

.mobile-menu-toggle[b-kn7f5j609m] {
    display: flex;
    align-items: center;
}

.hamburger-btn[b-kn7f5j609m] {
    background: none;
    border: none;
    padding: 0.5rem;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.hamburger-line[b-kn7f5j609m] {
    width: 1.5rem;
    height: 0.125rem;
    background-color: #333;
    transition: all 0.3s ease;
}

/* Mobile Menu Dropdown */
.mobile-menu[b-kn7f5j609m] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background-color: #fff;
    box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1);
    z-index: 1000;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.mobile-menu-open[b-kn7f5j609m] {
    max-height: 20rem;
}

.mobile-menu-header[b-kn7f5j609m] {
    background-color: #f8f9fa;
    padding: 1rem;
    border-bottom: 1px solid #e9ecef;
}

.mobile-user-info[b-kn7f5j609m] {
    text-align: center;
}

.mobile-user-greeting[b-kn7f5j609m] {
    color: #333;
    font-weight: 600;
    font-size: 0.9rem;
}

.mobile-menu-items[b-kn7f5j609m] {
    padding: 0;
}

.mobile-menu-item[b-kn7f5j609m] {
    border-bottom: 1px solid #e9ecef;
}

.mobile-menu-item:last-child[b-kn7f5j609m] {
    border-bottom: none;
}

.mobile-menu-btn[b-kn7f5j609m] {
    width: 100%;
    padding: 1rem;
    background: none;
    border: none;
    text-align: center;
    color: #333;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.mobile-menu-btn:hover[b-kn7f5j609m] {
    background-color: #f8f9fa;
}

.mobile-menu-btn:active[b-kn7f5j609m] {
    background-color: #e9ecef;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .mobile-header[b-kn7f5j609m] {
        padding: 0.5rem 0.75rem;
    }
    
    .mobile-logo-img[b-kn7f5j609m] {
        max-height: 2rem;
    }
    
    .hamburger-line[b-kn7f5j609m] {
        width: 1.25rem;
        height: 0.1rem;
    }
}

@media (max-width: 480px) {
    .mobile-header[b-kn7f5j609m] {
        padding: 0.5rem;
    }
    
    .mobile-logo-img[b-kn7f5j609m] {
        max-height: 1.75rem;
    }
    
    .mobile-menu-btn[b-kn7f5j609m] {
        padding: 0.875rem;
        font-size: 0.85rem;
    }
}
/* /Shared/Components/Paginacion.razor.rz.scp.css */
.page-item.active a[b-pxnggiv1cx] {
    background-color: black !important;
    color: #ffcc03 !important;
}

/* /Shared/Components/TabCategoria.razor.rz.scp.css */
.barra-navegacion[b-55kwcohixk] {
    background-color: #fff;
}

.lista-categorias[b-55kwcohixk] {
    margin-left: auto;
}

.categoria-inicial[b-55kwcohixk] {
    margin-right: 20px;
}

.categoria[b-55kwcohixk] {
    margin-right: 10px;
}

/* Estilos para el logo de CashTicket en la barra de navegación */
.navbar-brand img[b-55kwcohixk] {
    transition: all 0.3s ease;
    max-height: 40px;
    object-fit: contain;
}

.navbar-brand:hover img[b-55kwcohixk] {
    transform: scale(1.05);
}

/* Responsive para el logo */
@media (max-width: 768px) {
    .navbar-brand img[b-55kwcohixk] {
        max-height: 35px;
    }
}

@media (max-width: 576px) {
    .navbar-brand img[b-55kwcohixk] {
        max-height: 30px;
    }
}
/* /Shared/Layouts/GreyLayout.razor.rz.scp.css */
.grey-layout[b-ajmp3huifz] {
    background-color: rgb(234, 234, 234);
}
/* /Shared/Layouts/MainLayout.razor.rz.scp.css */
.page[b-izapkf38wv] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-izapkf38wv] {
    flex: 1;
}

.sidebar[b-izapkf38wv] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-izapkf38wv] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

.top-row[b-izapkf38wv]  a, .top-row[b-izapkf38wv]  .btn-link {
    white-space: nowrap;
    margin-left: 1.5rem;
    text-decoration: none;
}

.top-row[b-izapkf38wv]  a:hover, .top-row[b-izapkf38wv]  .btn-link:hover {
    text-decoration: underline;
}

.top-row[b-izapkf38wv]  a:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 640.98px) {
    .top-row:not(.auth)[b-izapkf38wv] {
        display: none;
    }

    .top-row.auth[b-izapkf38wv] {
        justify-content: space-between;
    }

    .top-row[b-izapkf38wv]  a, .top-row[b-izapkf38wv]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-izapkf38wv] {
        flex-direction: row;
    }

    .sidebar[b-izapkf38wv] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-izapkf38wv] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-izapkf38wv]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-izapkf38wv], article[b-izapkf38wv] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}
/* /Shared/Layouts/WhiteLayout.razor.rz.scp.css */
.white-layout[b-m8ghnddmc5] {
    background-color: white;
}