/* =============================================================================
   hBook FlexSearch — flexsearch.css
   Typography: Mulish (headings/labels/button), Karla (body/inputs)
   Brand color: #9C130F
   All selectors prefixed .hbfs- to avoid conflicts with hBook's .hb- classes.
   ============================================================================= */

/* ---- Tokens — scoped only, zero global footprint -------------------------- */
.hbfs-wrapper,
.pika-single {
    --hbfs-primary:      #9C130F;
    --hbfs-primary-dark: #7d0f0c;
    --hbfs-primary-text: #ffffff;
    --hbfs-primary-tint: rgba(156,19,15,.10);
    --hbfs-card-bg:      #ffffff;
    --hbfs-card-border:  #e0e0e0;
    --hbfs-surface:      #f8f8f8;
    --hbfs-text:         #1a1a1a;
    --hbfs-text-muted:   #888888;
    --hbfs-input-border: #c8c8c8;
    --hbfs-input-h:      50px;
    --hbfs-unavail:      #d1d5db;
    --hbfs-warn:         #c05a00;
    --hbfs-radius:       2px;
    --hbfs-shadow:       0 2px 8px rgba(0,0,0,.07);
    --hbfs-shadow-lg:    0 8px 28px rgba(0,0,0,.13);
    --hbfs-transition:   0.2s ease;
    --hbfs-font-head:    'Mulish', sans-serif;
    --hbfs-font-body:    'Karla', sans-serif;

    font-family: var(--hbfs-font-body);
    font-size: 16px;
    color: var(--hbfs-text);
    box-sizing: border-box;
}

*, *::before, *::after {
    box-sizing: inherit;
}

/* Screen-reader only (accessible hidden labels) */
.hbfs-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

/* ---- Search bar ------------------------------------------------------------ */
.hbfs-search-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 8px;
    background: #ffffff;
    border: 1px solid var(--hbfs-card-border);
    border-radius: var(--hbfs-radius);
    padding: 16px 20px;
    box-shadow: var(--hbfs-shadow);
}

/* ---- Fields ---------------------------------------------------------------- */
.hbfs-field {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* Date range wrapper — flex item in search-bar, calendar anchors here */
.hbfs-field-dates {
    position: relative;
    display: flex;
    flex: 1;
    align-items: stretch;
    gap: 8px;
    min-width: 0;
}

/* Date fields grow equally */
.hbfs-field-ci,
.hbfs-field-co {
    flex: 1;
    min-width: 140px;
}

/* Arrow between dates */
.hbfs-date-sep {
    color: var(--hbfs-text-muted);
    font-size: 16px;
    align-self: center;
    padding: 0 2px;
    flex-shrink: 0;
    margin-top: 2px;
}

/* People select */
.hbfs-field-people {
    flex: 0 0 auto;
    min-width: 160px;
}

/* Submit */
.hbfs-field-submit {
    flex-shrink: 0;
}

/* ---- Input / Select base --------------------------------------------------- */
.hbfs-input {
    height: var(--hbfs-input-h);
    width: 100%;
    border: 1px solid var(--hbfs-input-border);
    border-radius: var(--hbfs-radius);
    padding: 0 16px;
    font-family: var(--hbfs-font-body);
    font-size: 16px;
    font-weight: 300;
    color: var(--hbfs-text);
    background: #ffffff;
    outline: none;
    transition: border-color var(--hbfs-transition), box-shadow var(--hbfs-transition);
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

/* Native arrow for selects */
.hbfs-input[type="text"],
.hbfs-input:not(select) {
    -webkit-appearance: none;
    appearance: none;
}

select.hbfs-input {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23888' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    padding-right: 36px;
    cursor: pointer;
}

.hbfs-input:focus,
.hbfs-input:focus-visible {
    border-color: var(--hbfs-primary);
    box-shadow: 0 0 0 3px var(--hbfs-primary-tint);
}

/* Placeholder text */
.hbfs-input::placeholder {
    color: var(--hbfs-text-muted);
    font-weight: 300;
}

/* ---- Search button --------------------------------------------------------- */
.hbfs-search-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: var(--hbfs-input-h);
    padding: 0 36px;
    background: var(--hbfs-primary) !important;
    color: var(--hbfs-primary-text) !important;
    border: none !important;
    border-radius: var(--hbfs-radius);
    font-family: var(--hbfs-font-head);
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    cursor: pointer;
    white-space: nowrap;
    transition: background var(--hbfs-transition), box-shadow var(--hbfs-transition),
                transform var(--hbfs-transition);
    box-shadow: 0 2px 8px rgba(156,19,15,.25);
}

.hbfs-search-btn:hover:not(:disabled) {
    background: var(--hbfs-primary-dark);
    box-shadow: 0 4px 14px rgba(156,19,15,.35);
}

.hbfs-search-btn:active:not(:disabled) {
    transform: scale(.98);
    box-shadow: none;
}

.hbfs-search-btn:disabled {
    opacity: .65;
    cursor: not-allowed;
}

/* Spinner inside button */
.hbfs-search-btn-spinner {
    display: none;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255,255,255,.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: hbfs-spin .7s linear infinite;
    flex-shrink: 0;
}

.hbfs-wrapper.hbfs-searching .hbfs-search-btn-spinner {
    display: inline-block;
}
.hbfs-wrapper.hbfs-searching .hbfs-search-btn-text {
    display: none;
}

/* Checkout field highlight when waiting for end-date pick */
.hbfs-picking-end .hbfs-field-co .hbfs-input {
    border-color: var(--hbfs-primary) !important;
    box-shadow: 0 0 0 3px var(--hbfs-primary-tint) !important;
    animation: hbfs-pulse-border 1.2s ease-in-out infinite;
}

@keyframes hbfs-pulse-border {
    0%, 100% { box-shadow: 0 0 0 3px var(--hbfs-primary-tint); }
    50%       { box-shadow: 0 0 0 5px rgba(156,19,15,.18); }
}

/* ---- Clear / back bar ------------------------------------------------------ */
.hbfs-clear-bar {
    display: none;
    align-items: center;
    gap: 16px;
    margin-top: 10px;
    flex-wrap: wrap;
}

.hbfs-wrapper.hbfs-active-search .hbfs-clear-bar {
    display: flex;
}

.hbfs-clear-btn {
    display: inline-block !important;
    background: var(--hbfs-primary) !important;
    border: none !important;
    color: #fff !important;
    font-family: var(--hbfs-font-body) !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    padding: 9px 18px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    transition: background var(--hbfs-transition) !important;
    box-shadow: none !important;
}

.hbfs-clear-btn:hover {
    background: var(--hbfs-primary-dark) !important;
    color: #fff !important;
    text-decoration: none !important;
}

.hbfs-active-summary {
    font-size: 14px;
    font-family: var(--hbfs-font-body);
    color: var(--hbfs-text-muted);
}

/* ---- Page-content hiding --------------------------------------------------- */
.hbfs-page-hidden {
    opacity: 0 !important;
    pointer-events: none !important;
    max-height: 0 !important;
    overflow: hidden !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    transition: opacity .3s ease, max-height .4s ease !important;
}

/* ---- Results area ---------------------------------------------------------- */
.hbfs-results-area {
    margin-top: 28px;
}

/* Loading */
.hbfs-loading {
    display: none;
    flex-direction: column;
    align-items: center;
    padding: 48px 0;
    gap: 16px;
    color: var(--hbfs-text-muted);
    font-family: var(--hbfs-font-body);
}

.hbfs-wrapper.hbfs-searching .hbfs-loading {
    display: flex;
}

.hbfs-loading-spinner {
    width: 40px;
    height: 40px;
    border: 3px solid var(--hbfs-card-border);
    border-top-color: var(--hbfs-primary);
    border-radius: 50%;
    animation: hbfs-spin .8s linear infinite;
}

/* Results header */
.hbfs-results-header {
    font-family: var(--hbfs-font-body);
    font-size: 15px;
    font-weight: 400;
    color: var(--hbfs-text-muted);
    margin-bottom: 18px;
}

/* ---- Card grid ------------------------------------------------------------- */
.hbfs-results-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

/* ---- Larger + partial subsections ------------------------------------------ */
.hbfs-larger-section,
.hbfs-partial-section {
    grid-column: 1 / -1;
    margin-top: 32px;
    padding-top: 28px;
    border-top: 2px solid var(--hbfs-card-border);
}
.hbfs-larger-heading,
.hbfs-partial-heading {
    font-family: var(--hbfs-font-head);
    font-size: 15px;
    font-weight: 700;
    color: var(--hbfs-text-muted);
    text-transform: uppercase;
    letter-spacing: .06em;
    margin: 0 0 20px;
}
.hbfs-larger-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

/* ---- Camper card ----------------------------------------------------------- */
.hbfs-card {
    background: var(--hbfs-card-bg);
    border: 1px solid var(--hbfs-card-border);
    border-radius: var(--hbfs-radius);
    overflow: hidden;
    box-shadow: var(--hbfs-shadow);
    display: flex;
    flex-direction: column;
    transition: transform var(--hbfs-transition), box-shadow var(--hbfs-transition);
    animation: hbfs-fade-up .3s ease both;
}

.hbfs-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--hbfs-shadow-lg);
}

.hbfs-card:active {
    transform: translateY(-1px);
}

.hbfs-card-thumb-wrap {
    position: relative;
}
.hbfs-urgency-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: var(--hbfs-primary);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    font-family: var(--hbfs-font-head);
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: 4px 9px;
    border-radius: 4px;
    pointer-events: none;
    z-index: 1;
}
.hbfs-card-thumb {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
    background: var(--hbfs-surface);
}

.hbfs-card-thumb-placeholder {
    width: 100%;
    aspect-ratio: 16 / 9;
    background: linear-gradient(135deg, var(--hbfs-surface) 0%, var(--hbfs-card-border) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--hbfs-text-muted);
    font-size: 40px;
}

.hbfs-card-body {
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}

.hbfs-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.hbfs-card-title {
    font-family: var(--hbfs-font-head);
    font-size: 18px;
    font-weight: 600;
    color: var(--hbfs-text);
    margin: 0;
    line-height: 1.3;
}

.hbfs-capacity-badge {
    background: var(--hbfs-surface);
    border: 1px solid var(--hbfs-card-border);
    border-radius: 20px;
    padding: 3px 10px;
    font-family: var(--hbfs-font-body);
    font-size: 12px;
    font-weight: 400;
    color: var(--hbfs-text-muted);
    white-space: nowrap;
    flex-shrink: 0;
}

.hbfs-card-desc {
    font-family: var(--hbfs-font-body);
    font-size: 14px;
    font-weight: 300;
    color: var(--hbfs-text-muted);
    line-height: 1.6;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.hbfs-card-price {
    font-family: var(--hbfs-font-head);
    font-size: 22px;
    font-weight: 700;
    color: var(--hbfs-text);
    margin-top: 4px;
}

.hbfs-card-price-caption {
    font-family: var(--hbfs-font-body);
    font-size: 13px;
    font-weight: 300;
    color: var(--hbfs-text-muted);
    margin-left: 4px;
}

.hbfs-card-actions {
    display: flex;
    gap: 10px;
    margin-top: 10px;
    flex-wrap: wrap;
}

/* Book now */
.hbfs-btn-book {
    flex: 1;
    min-width: 110px;
    background: var(--hbfs-primary);
    color: var(--hbfs-primary-text) !important;
    border: none;
    border-radius: var(--hbfs-radius);
    padding: 12px 20px;
    font-family: var(--hbfs-font-head);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    cursor: pointer;
    text-align: center;
    transition: background var(--hbfs-transition), box-shadow var(--hbfs-transition);
    text-decoration: none;
    display: inline-block;
}

.hbfs-btn-book:hover {
    background: var(--hbfs-primary-dark);
    color: var(--hbfs-primary-text);
    text-decoration: none;
    box-shadow: 0 3px 10px rgba(156,19,15,.28);
}

/* Read more */
.hbfs-btn-more {
    flex: 1;
    min-width: 110px;
    background: transparent;
    color: var(--hbfs-primary);
    border: 1px solid var(--hbfs-primary);
    border-radius: var(--hbfs-radius);
    padding: 11px 20px;
    font-family: var(--hbfs-font-body);
    font-size: 14px;
    font-weight: 400;
    cursor: pointer;
    text-align: center;
    transition: background var(--hbfs-transition), color var(--hbfs-transition);
    text-decoration: none;
    display: inline-block;
}

.hbfs-btn-more:hover {
    background: var(--hbfs-primary);
    color: var(--hbfs-primary-text);
    text-decoration: none;
}

/* ---- No results ------------------------------------------------------------ */
.hbfs-no-results {
    display: none;
    flex-direction: column;
    gap: 32px;
}

.hbfs-no-results-msg {
    font-family: var(--hbfs-font-body);
    font-size: 17px;
    font-weight: 400;
    color: var(--hbfs-text);
    text-align: center;
    line-height: 1.6;
    background: #fff3f3;
    border: 1px solid rgba(156,19,15,.2);
    border-radius: var(--hbfs-radius);
    padding: 24px 28px;
}
.hbfs-no-results-msg strong {
    font-size: 19px;
    font-weight: 700;
    color: var(--hbfs-primary);
    display: block;
    margin-bottom: 6px;
}
.hbfs-no-results-icon {
    font-size: 28px;
    display: block;
    margin-bottom: 8px;
}
.hbfs-no-results-dates {
    font-size: 15px;
    color: var(--hbfs-text-muted);
    font-weight: 500;
}

/* ---- Fallback groups ------------------------------------------------------- */
.hbfs-fallback-group {
    border: 1px solid var(--hbfs-card-border);
    border-radius: var(--hbfs-radius);
    overflow: hidden;
    background: var(--hbfs-surface);
}

.hbfs-fallback-label {
    font-family: var(--hbfs-font-head);
    color: var(--hbfs-text);
    background: var(--hbfs-surface);
    padding: 14px 18px;
    border-bottom: 1px solid var(--hbfs-card-border);
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.hbfs-fallback-label-top {
    display: flex;
    align-items: center;
    gap: 8px;
}
.hbfs-fallback-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--hbfs-text);
}
.hbfs-fallback-dates {
    font-size: 14px;
    font-weight: 600;
    color: var(--hbfs-primary);
    letter-spacing: .01em;
}

.hbfs-fallback-tag {
    background: var(--hbfs-warn);
    color: #fff;
    border-radius: 3px;
    padding: 1px 7px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.hbfs-tag-match {
    background: #47a035; /* green — signals "fits your group" */
}

.hbfs-fallback-cards {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 16px;
    background: #fafafa;
}

.hbfs-fallback-cards .hbfs-card {
    border-radius: var(--hbfs-radius);
    border: 1px solid var(--hbfs-card-border);
    box-shadow: 0 1px 4px rgba(0,0,0,.06);
    animation: none;
}

.hbfs-fallback-cards .hbfs-card:hover {
    transform: none;
    background: var(--hbfs-card-bg);
    box-shadow: inset 3px 0 0 var(--hbfs-primary);
}

/* ---- Pikaday overrides ----------------------------------------------------- */

/* Container */
.pika-single {
    font-family: var(--hbfs-font-body) !important;
    border: 1px solid var(--hbfs-card-border) !important;
    border-radius: var(--hbfs-radius) !important;
    box-shadow: var(--hbfs-shadow-lg) !important;
    /* Twin months side-by-side */
    white-space: nowrap !important;
    width: auto !important;
    /* Float above page content */
    position: absolute !important;
    z-index: 9999 !important;
}

/* --- Isolate Pikaday from site's reset.css button + table styles --- */
.pika-single table    { border: none !important; border-collapse: collapse !important;
                        margin: 0 !important; background: transparent !important; }
.pika-single thead,
.pika-single tbody,
.pika-single tr       { border: none !important; background: transparent !important; }
.pika-single td,
.pika-single th       { border: none !important; padding: 0 !important;
                        background: transparent !important; }
.pika-single button   { border: none !important; background: transparent !important;
                        padding: 0 !important; margin: 0 !important;
                        box-shadow: none !important; outline: none !important;
                        font: inherit !important; cursor: pointer !important; }

/* Contextual instruction text injected at top of calendar popup */
.hbfs-cal-title {
    text-align: center;
    font-family: var(--hbfs-font-head);
    font-size: 15px;
    font-weight: 600;
    color: var(--hbfs-text);
    padding: 12px 20px 10px;
    border-bottom: 1px solid var(--hbfs-card-border);
    margin-bottom: 4px;
    white-space: normal;
}

/* Twin-month layout — each lendar wider for readability */
.pika-single .pika-lendar {
    display: inline-block !important;
    float: none !important;
    vertical-align: top !important;
    white-space: normal !important;
    width: 320px !important;
    padding: 14px 18px !important;
}

/* Separator between twin calendar months */
.pika-single .pika-lendar + .pika-lendar {
    border-left: 1px solid var(--hbfs-card-border) !important;
}

/* Month/year title */
.pika-single .pika-title .pika-label {
    font-family: var(--hbfs-font-head) !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    color: var(--hbfs-text) !important;
}

/* Weekday header row */
.pika-single .pika-table th abbr {
    font-family: var(--hbfs-font-head) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--hbfs-text-muted) !important;
    text-decoration: none !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
    cursor: default !important;
}

/* "uge" column header (first th in header row when showWeekNumber is true) */
.pika-single thead tr th:first-child {
    text-align: center !important;
    font-family: var(--hbfs-font-head) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--hbfs-text-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
    padding: 0 0 4px !important;
    opacity: .7 !important;
}
.pika-single thead tr th:first-child::after {
    content: 'uge';
}

/* Day buttons — bigger, square */
.pika-single .pika-button {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    color: #333 !important;
    padding: 11px 4px !important;
    font-size: 15px !important;
    border-radius: 2px !important;
    line-height: 1.3 !important;
    background: transparent !important;
    font-family: var(--hbfs-font-body) !important;
}
.pika-single .pika-button:hover {
    background: var(--hbfs-primary-tint) !important;
    color: var(--hbfs-primary) !important;
}

/* Nav arrows — filled dark-red circles with white chevron */
.pika-single .pika-prev,
.pika-single .pika-next {
    display: block !important;
    position: relative !important;
    width: 34px !important;
    height: 34px !important;
    overflow: hidden !important;
    text-indent: -9999em !important;
    cursor: pointer !important;
    opacity: 1 !important;
    background: var(--hbfs-primary) !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 50% !important;
    transition: background var(--hbfs-transition) !important;
}
.pika-single .pika-prev:hover,
.pika-single .pika-next:hover {
    background: var(--hbfs-primary-dark) !important;
    opacity: 1 !important;
}
.pika-single .pika-prev::after,
.pika-single .pika-next::after {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 8px !important;
    height: 8px !important;
    border-top: 2px solid #fff !important;
    border-right: 2px solid #fff !important;
    transform: translate(-50%,-50%) rotate(-135deg) !important;
}
.pika-single .pika-next::after {
    transform: translate(-50%,-50%) rotate(45deg) !important;
}

/* Selected / range endpoints — override the day-button base reset above */
.pika-single .is-selected .pika-button,
.pika-single .is-startrange .pika-button,
.pika-single .is-endrange .pika-button {
    background: var(--hbfs-primary) !important;
    color: #fff !important;
    border-radius: 3px !important;
}

.pika-single .is-startrange .pika-button {
    border-radius: 2px 0 0 2px !important;
}
.pika-single .is-endrange .pika-button {
    border-radius: 0 2px 2px 0 !important;
}

/* In-range days */
.pika-single .is-inrange .pika-button {
    background: var(--hbfs-primary-tint) !important;
    color: var(--hbfs-text) !important;
    border-radius: 0 !important;
}

/* Available dates — solid green, dark number */
.pika-single .pika-button.hbfs-available {
    background: #47a035 !important;
    color: #1a1a1a !important;
    font-weight: 600 !important;
}
.pika-single .pika-button.hbfs-available:hover {
    background: #3a8329 !important;
    color: #fff !important;
}
/* Selected / range endpoint takes priority over green background */
.pika-single .is-selected .pika-button.hbfs-available,
.pika-single .is-startrange .pika-button.hbfs-available,
.pika-single .is-endrange .pika-button.hbfs-available {
    background: var(--hbfs-primary) !important;
    color: #fff !important;
}

/* Fully booked dates — red warning */
.pika-single .pika-button.hbfs-unavail {
    background: #f8d7da !important;
    color: #9c130f !important;
    font-weight: 600 !important;
    cursor: default !important;
    pointer-events: none !important;
    opacity: 1 !important;
}

/* Past dates — gray, no action possible */
.pika-single .pika-button.hbfs-past {
    background: #e4e4e4 !important;
    color: #b0b0b0 !important;
    cursor: default !important;
    pointer-events: none !important;
    opacity: 1 !important;
}

/* Selected / range endpoints ALWAYS override availability coloring — placed last so !important wins */
/* body prefix adds element specificity (0,0,3,1) to beat any theme rules at (0,0,3,0) */
body .pika-single .is-selected .pika-button,
body .pika-single .is-startrange .pika-button,
body .pika-single .is-endrange .pika-button,
.pika-single .is-selected .pika-button,
.pika-single .is-startrange .pika-button,
.pika-single .is-endrange .pika-button {
    background: var(--hbfs-primary) !important;
    color: #fff !important;
    cursor: pointer !important;
    pointer-events: auto !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

/* Today */
.pika-single .is-today .pika-button {
    color: var(--hbfs-primary) !important;
    font-weight: 700 !important;
}

/* Week number column — match day-button height and centering */
.pika-single .pika-week {
    font-size: 11px !important;
    font-weight: 600 !important;
    font-family: var(--hbfs-font-head) !important;
    color: var(--hbfs-text-muted) !important;
    opacity: .65 !important;
    text-align: center !important;
    vertical-align: middle !important;
    /* Same padding as .pika-button so the cell height matches */
    padding: 9px 4px !important;
    cursor: default !important;
    white-space: nowrap !important;
}

/* ---- Animations ------------------------------------------------------------ */
@keyframes hbfs-spin {
    to { transform: rotate(360deg); }
}

@keyframes hbfs-fade-up {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

.hbfs-card:nth-child(1)  { animation-delay:   0ms; }
.hbfs-card:nth-child(2)  { animation-delay:  60ms; }
.hbfs-card:nth-child(3)  { animation-delay: 120ms; }
.hbfs-card:nth-child(4)  { animation-delay: 180ms; }
.hbfs-card:nth-child(5)  { animation-delay: 240ms; }
.hbfs-card:nth-child(6)  { animation-delay: 300ms; }
.hbfs-card:nth-child(7)  { animation-delay: 360ms; }
.hbfs-card:nth-child(8)  { animation-delay: 420ms; }
.hbfs-card:nth-child(9)  { animation-delay: 480ms; }

/* =============================================================================
   RESPONSIVE BREAKPOINTS
   ============================================================================= */

/* ---- Tablet: 600px – 1024px ----------------------------------------------- */
@media (min-width: 600px) {

    .hbfs-search-bar {
        flex-wrap: nowrap;
        gap: 10px;
    }

    .hbfs-field-ci,
    .hbfs-field-co {
        flex: 1;
    }

    .hbfs-field-people {
        flex: 0 0 180px;
    }

    .hbfs-field-submit {
        flex-shrink: 0;
    }

    .hbfs-results-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .hbfs-larger-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .hbfs-fallback-cards {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ---- Desktop: ≥1025px ------------------------------------------------------ */
@media (min-width: 1025px) {

    .hbfs-search-bar {
        flex-wrap: nowrap;
        gap: 12px;
    }

    .hbfs-field-ci,
    .hbfs-field-co {
        flex: 1;
        min-width: 160px;
    }

    .hbfs-field-people {
        flex: 0 0 200px;
    }

    .hbfs-results-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .hbfs-larger-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .hbfs-fallback-cards {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* ---- Mobile: < 600px ------------------------------------------------------- */
@media (max-width: 599px) {

    .hbfs-search-bar {
        flex-direction: column;
        gap: 10px;
    }

    .hbfs-field-dates {
        flex-direction: column;
        gap: 10px;
    }

    .hbfs-date-sep {
        display: none;
    }

    .hbfs-field-ci,
    .hbfs-field-co,
    .hbfs-field-people,
    .hbfs-field-submit {
        width: 100%;
    }

    .hbfs-input {
        width: 100%;
    }

    .hbfs-search-btn {
        width: 100%;
        font-size: 16px;
    }

    .hbfs-card-actions {
        flex-direction: column;
    }

    .hbfs-btn-book,
    .hbfs-btn-more {
        width: 100%;
        text-align: center;
    }
}