/* BizBaby theme for the vendor daterangepicker popup.
   The vendor sheet is hard white; these token-based rules make the popup match
   the active skin (Porcelain light / Espresso dark). Mirrors the design-system
   rules in bb-components.css but unscoped, so any page that links this file gets
   a consistent, theme-aware picker. Load AFTER vendor/daterangepicker.css. */

.daterangepicker {
    background: var(--bb-surface, #fff) !important;
    border: 1px solid var(--bb-border, #ddd) !important;
    color: var(--bb-text, #212529) !important;
    font-family: var(--bb-font);
    border-radius: var(--bb-radius-m, 8px);
    box-shadow: 0 8px 28px rgba(0, 0, 0, .18);
    z-index: 3001;
}
.daterangepicker:before { border-bottom-color: var(--bb-border, #ccc); }
.daterangepicker:after { border-bottom-color: var(--bb-surface, #fff); }
.daterangepicker.drop-up:before { border-top-color: var(--bb-border, #ccc); }
.daterangepicker.drop-up:after { border-top-color: var(--bb-surface, #fff); }

.daterangepicker .calendar-table {
    background: var(--bb-surface, #fff) !important;
    border-color: var(--bb-surface, #fff) !important;
}
.daterangepicker .calendar-table th,
.daterangepicker .calendar-table td { color: var(--bb-text, #212529); }
.daterangepicker .calendar-table .next span,
.daterangepicker .calendar-table .prev span { border-color: var(--bb-text-2, #000); }

.daterangepicker td.off,
.daterangepicker td.off.in-range,
.daterangepicker td.off.start-date,
.daterangepicker td.off.end-date { background: transparent !important; color: var(--bb-text-3, #999) !important; }

.daterangepicker td.available:hover,
.daterangepicker th.available:hover { background-color: var(--bb-primary-soft, #eee) !important; color: var(--bb-primary, inherit); }
.daterangepicker td.in-range { background-color: var(--bb-primary-soft, #ebf4f8) !important; color: var(--bb-text, #000); }
.daterangepicker td.active,
.daterangepicker td.active:hover { background-color: var(--bb-primary, #357ebd) !important; color: #fff !important; }

.daterangepicker .drp-buttons { border-top: 1px solid var(--bb-border, #ddd); }
.daterangepicker .drp-buttons .cancelBtn,
.daterangepicker .drp-selected { color: var(--bb-text-2, #212529) !important; }
.daterangepicker .drp-buttons .applyBtn {
    background: var(--bb-primary, #d63d5b) !important;
    border-color: var(--bb-primary, #d63d5b) !important;
    color: #fff !important;
    border-radius: var(--bb-radius-s, 4px);
}

.daterangepicker select.hourselect,
.daterangepicker select.minuteselect,
.daterangepicker select.secondselect,
.daterangepicker select.ampmselect,
.daterangepicker select.monthselect,
.daterangepicker select.yearselect {
    background: var(--bb-select-bg, #fff); color: var(--bb-text, #212529);
    border: 1px solid var(--bb-border-input, #ccc); border-radius: var(--bb-radius-s, 4px);
}