/* Arrière-plan général */
.date-picker-wrapper {
    background-color: #1b1b1b !important;
    color: #eee !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6) !important;
    border-radius: 8px !important;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif !important;
}

/* Bordures des mois */
.date-picker-wrapper .month-wrapper table {
    background: transparent !important;
    border-collapse: separate !important;
    border-spacing: 4px !important;
}

/* Jours */
.date-picker-wrapper .day {
    background-color: transparent !important;
    color: #eee !important;
    border-radius: 4px !important;
    transition: background-color 0.2s !important, color 0.2s !important;
    position: relative !important;
    font-family: "Barlow" !important;
}

/* Jours valides */
.date-picker-wrapper .day.valid {
    cursor: pointer !important;
}

.date-picker-wrapper .day.valid:hover,
.date-picker-wrapper .day.hovering {
    background-color: #AA8453 !important;
    color: #1b1b1b !important;
}

/* Jours sélectionnés */
.date-picker-wrapper .day.checked,
.date-picker-wrapper .day.first-date-selected,
.date-picker-wrapper .day.last-date-selected {
    background-color: #AA8453 !important;
    color: #1b1b1b !important;
    font-weight: bold !important;
}

/* Spécifique bloc Jet Forms → couleur secondaire */
.wp-block-jet-forms-check-in-out div.date-picker-wrapper .first-date-selected,
.wp-block-jet-forms-check-in-out div.date-picker-wrapper .last-date-selected {
    background-color: #79572B !important;
}

/* Jour actuel */
.date-picker-wrapper .day.real-today {
    border: 1px solid #AA8453 !important;
    background-color: transparent !important;
    color: #AA8453 !important;
}

/* Header mois */
.date-picker-wrapper .caption .month-name {
    color: #AA8453 !important;
    font-weight: bold !important;
}

/* Flèches navigation */
.date-picker-wrapper .caption .prev,
.date-picker-wrapper .caption .next {
    color: #AA8453 !important;
    transition: color 0.2s !important;
}

.date-picker-wrapper .caption .prev:hover,
.date-picker-wrapper .caption .next:hover {
    color: #fff !important;
}

/* Jours des semaines */
.date-picker-wrapper .week-name th {
    color: #79572B !important;
}

/* Top bar */
.date-picker-wrapper .drp_top-bar {
    background: #1b1b1b !important;
    border-bottom: 1px solid #79572B !important;
    color: #AA8453 !important;
}

/* Boutons */
.date-picker-wrapper .apply-btn {
    background-color: #AA8453 !important;
    border: none !important;
    color: #1b1b1b !important;
    padding: 6px 12px !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    font-weight: bold !important;
    transition: background-color 0.2s !important, color 0.2s !important;
}

.date-picker-wrapper .apply-btn:hover:not(.disabled) {
    background-color: #79572B !important;
    color: #fff !important;
}

.date-picker-wrapper .apply-btn.disabled {
    background-color: #333 !important;
    color: #666 !important;
    cursor: not-allowed !important;
}

/* Selects - fond couleur primaire et texte blanc */
.date-picker-wrapper .select-wrapper {
    background: #AA8453 !important;
    border: 1px solid #AA8453 !important;
    border-radius: 4px !important;
    padding: 2px 8px !important;
    color: #fff !important;
}

.date-picker-wrapper .select-wrapper select {
    color: #fff !important;
}

/* Tooltip */
.date-picker-wrapper .tooltip {
    background: #333 !important;
    color: #AA8453 !important;
    border: 1px solid #79572B !important;
    border-radius: 4px !important;
    padding: 4px 8px !important;
}

/* Modernisation du date-range-length-tip */
.date-picker-wrapper .date-range-length-tip {
    background: #2a2a2a !important;
    color: #fff !important;
    border: 1px solid #79572B !important;
    border-radius: 6px !important;
    padding: 8px 12px !important;
    font-size: 13px !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.5) !important;
    text-align: center !important;
    opacity: 0.95 !important;
}

/* Cache le .gap:before */
.date-picker-wrapper .gap:before {
    display: none !important;
}

/* Suppression du background blanc par défaut */
.date-picker-wrapper *,
.date-picker-wrapper *::before,
.date-picker-wrapper *::after {
    background: transparent !important;
}

/* Focus accessibles */
.date-picker-wrapper .day.valid:focus {
    outline: 2px solid #AA8453 !important;
    outline-offset: 2px !important;
}

/* Footer */
.date-picker-wrapper .footer {
    color: #79572B !important;
    text-align: center !important;
    font-size: 11px !important;
}

/* Golden heart shapes for unavailable dates */
.date-picker-wrapper .ui-datepicker-unselectable,
.date-picker-wrapper .ui-datepicker-disabled,
.date-picker-wrapper td.ui-datepicker-unselectable,
.date-picker-wrapper td.ui-datepicker-disabled,
.date-picker-wrapper .day.disabled {
    position: relative !important;
}

.date-picker-wrapper .ui-datepicker-unselectable .ui-state-default,
.date-picker-wrapper .ui-datepicker-disabled .ui-state-default,
.date-picker-wrapper .day.disabled {
    position: relative !important;
}

.date-picker-wrapper .ui-datepicker-unselectable .ui-state-default::before,
.date-picker-wrapper .ui-datepicker-disabled .ui-state-default::before,
.date-picker-wrapper .day.disabled::before {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 16px !important;
    height: 16px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath fill='%23AA8453' d='M12,21.35L10.55,20.03C5.4,15.36 2,12.27 2,8.5 2,5.41 4.42,3 7.5,3C9.24,3 10.91,3.81 12,5.08C13.09,3.81 14.76,3 16.5,3C19.58,3 22,5.41 22,8.5C22,12.27 18.6,15.36 13.45,20.03L12,21.35Z'/%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    z-index: 10 !important;
    opacity: 0.8 !important;
    transition: opacity 0.3s ease !important;
}

/* Hover effect for heart on unavailable dates */
.date-picker-wrapper .ui-datepicker-unselectable .ui-state-default:hover::before,
.date-picker-wrapper .ui-datepicker-disabled .ui-state-default:hover::before,
.date-picker-wrapper .day.disabled:hover::before {
    opacity: 1 !important;
    transform: translate(-50%, -50%) scale(1.1) !important;
}

/* Ensure text is still visible behind heart */
.date-picker-wrapper .ui-datepicker-unselectable .ui-state-default,
.date-picker-wrapper .ui-datepicker-disabled .ui-state-default,
.date-picker-wrapper .day.disabled {
    color: #666 !important;
    background-color: rgba(51, 51, 51, 0.3) !important;
}

/* For date range picker compatibility */
.date-picker-wrapper .day.invalid::before {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 16px !important;
    height: 16px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath fill='%23AA8453' d='M12,21.35L10.55,20.03C5.4,15.36 2,12.27 2,8.5 2,5.41 4.42,3 7.5,3C9.24,3 10.91,3.81 12,5.08C13.09,3.81 14.76,3 16.5,3C19.58,3 22,5.41 22,8.5C22,12.27 18.6,15.36 13.45,20.03L12,21.35Z'/%3E%3C/svg%3E") !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    z-index: 10 !important;
    opacity: 0.5 !important;
    transition: opacity 0.3s ease, transform 0.3s ease !important;
}