.py-22 {
    padding-bottom: .4rem;
    padding-top: .4rem;
}
.raffle-footer {
    background: #111827; /* Un gris muy oscuro, casi negro */
    color: #ffffff;
    border-top: 1px solid rgba(255,255,255,0.1);
}

.raffle-footer .payment-badges .badge {
    font-weight: 500;
    font-size: 0.75rem;
    display: flex;
    align-items: center;
    gap: 5px;
}

.footer-links a:hover {
    color: #ffffff !important;
    text-decoration: underline !important;
}
.fs {
    padding-left: 0;
    max-width: 34%;
    margin-left: -1%;
}

/* Ajuste para que el footer no tape el bot贸n flotante en m贸viles si tuvieras uno */
@media (max-width: 768px) {
    .raffle-footer {
        padding-bottom: 20px;
    }
}





/* Inputs con estilo moderno */
.bg-light { background-color: #f8f9fa !important; }
.form-control:focus {
    background-color: #fff !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.1) !important;
}
.form-control {
    background-color: rgb(39 116 198 / 18%) !important;
}

/* Ajuste del Calendario Inline */
.flatpickr-calendar.inline {
    width: 100% !important;
    max-width: 100% !important;
    border: none !important;
    box-shadow: none !important;
}

.flatpickr-day.selected {
    background: #007bff !important;
    border-color: #007bff !important;
    border-radius: 50% !important;
}

.flatpickr-day:hover {
    background: #54a6f7 !important;
    border-radius: 50% !important;
    color:#ffffff !important;
}

.flatpickr-months .flatpickr-month {
    background: transparent !important;
}

/* Label de archivo moderno */
.custom-file-label::after {
    content: "Subir" !important;
    background-color: #007bff !important;
    color: white !important;
    border: none !important;
}
/* Contenedor principal del calendario inline */
.flatpickr-calendar.inline {
    border: none !important;
    box-shadow: none !important; /* Eliminamos sombras para que se integre al card */
    background-color: transparent !important;
    width: 100% !important;
    max-width: 315px;
    margin: 0 auto;
}

/* Encabezado: Mes y Año */
.flatpickr-current-month {
    font-weight: 700 !important;
    font-size: 1.1rem !important;
    color: #334155 !important; /* Slate 700 */
}

/* Días de la semana (lu, ma, mi...) */
span.flatpickr-weekday {
    color: #64748b !important; /* Slate 500 */
    font-weight: 600 !important;
    text-transform: lowercase;
}

/* Día seleccionado (El toque de diseño) */
.flatpickr-day.selected, 
.flatpickr-day.selected:hover {
    background: #007bff !important; /* Bootstrap Primary Blue */
    border-color: #007bff !important;
    color: #fff !important;
    border-radius: 50% !important;
    box-shadow: 0 4px 6px -1px rgba(0, 123, 255, 0.4);
}

/* Día actual (Hoy) */
.flatpickr-day.today {
    border-color: #007bff !important;
    color: #007bff !important;
}

/* Días deshabilitados (Domingos o fechas pasadas) */
.flatpickr-day.flatpickr-disabled, 
.flatpickr-day.flatpickr-disabled:hover {
    color: #cbd5e1 !important;
    background: transparent !important;
}

/* Flechas de navegación */
.flatpickr-prev-month svg, 
.flatpickr-next-month svg {
    fill: #64748b !important;
}
/* Ocultar los radio originales y estilizar labels como botones */
.custom-btn-radio {
    cursor: pointer;
    transition: all 0.3s ease;
    border: 2px solid #dee2e6;
    background: white;
}

input[name="amount"] {
    display: none;
}

/* Ajuste Sliders */
.range-precision-container {
    position: relative;
    padding: 10px 5px;
}

.precision-slider {
    -webkit-appearance: none;
    width: 100%;
    height: 7px;
    background: #e9ecef;
    border-radius: 5px;
}

.precision-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 20px;
    height: 20px;
    background: #0d6efd;
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    cursor: pointer;
}

.marks-container {
    position: relative;
    width: 100%;
    height: 25px;
    margin-top: 15px;
}

.mark-item, .mark-selector {
    position: absolute;
    transform: translateX(-50%);
    font-size: 12px;
    font-weight: 600;
    color: #adb5bd;
    cursor: pointer;
}

.mark-item.active, .mark-selector.active {
    color: #0d6efd;
    font-weight: 800;
}

.shadow-inner { box-shadow: inset 0 2px 4px rgba(0,0,0,0.03); }
.btn-outline-primary:active, .btn-outline-primary:focus, .btn-outline-primary.active {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;
}
.btn-check:checked + .custom-btn-radio {
    color: #fff;
    background-color: #007bff;
    border-color: #007bff;   
}
#prize_label, #num_label {
    color: #fff;
}

/* Centrar el calendario y quitar bordes internos innecesarios */
#calendar-inline-container .flatpickr-calendar.inline {
    border: none;
    box-shadow: none;
    margin: 0 auto;
    background: #fff;
}

/* Ajuste de los días de la semana */
.flatpickr-weekday {
    color: #4a5568 !important;
    font-weight: 600 !important;
}

/* Estilo para el día seleccionado (Azul como su interfaz) */
.flatpickr-day.selected {
    background: #007bff !important;
    border-color: #007bff !important;
    color: white !important;
    border-radius: 5px;
}

/* Estilo para días deshabilitados (Domingos en Quiniela) */
.flatpickr-day.flatpickr-disabled {
    color: #e2e8f0 !important;
    cursor: not-allowed;
}

/* Encabezado del mes */
.flatpickr-month {
    margin-bottom: 10px;
}

/* Clase para resaltar domingos en modo Quiniela */
.flatpickr-day.flatpickr-disabled.sunday-red {
    background: #cc0000 !important;
    border-color: #ff4d4d !important;
    color: white !important;
    border-radius: 50% !important;
    cursor: not-allowed !important;
    opacity: 0.8;
}

.flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled.sunday-red:hover {
    color: white !important;
    background: #cc0000 !important;
    border-color: #ff4d4d !important;
}

.flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled {
    border:none !important;
}

.flatpickr-day.flatpickr-disabled, .flatpickr-day.flatpickr-disabled:hover {
    color: #cbd5e1 !important;
    background: #32373c91 !important;
}

.flatpickr-day {
    background: #32373c;
    color: #ffffff;
}

.flatpickr-day.nextMonthDay {
    background: #32373c;
    color: #ffffff;
}

.flatpickr-day.prevMonthDay {
    background: #32373c;
    color: #ffffff;
}