/* ===== فلتر الغرف (شريط بحث) ===== */
.rf {
    --rf-brand: #d39834;
    --rf-brand-dark: #b07a1f;
    --rf-brand-soft: rgba(211, 152, 52, .12);
    --rf-text: #1e1e1e;
    --rf-muted: #6b6b6b;
    margin: 2rem 0;
}

.rf-bar {
    display: flex;
    align-items: stretch;
    gap: 3px;
    padding: 3px;
    background: var(--rf-brand);
    border-radius: 8px;
    box-shadow: 0 6px 20px rgba(211, 152, 52, .25);
}

.rf-seg {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 6px 12px;
    background: #fff;
    border-radius: 6px;
    cursor: pointer;
    color: var(--rf-text);
}

.rf-seg--category { flex-grow: 1; }
.rf-seg--date { flex-grow: 1.4; min-width: max-content; }

/* حقل flatpickr الداخلي: مخفي، التقويم يفتح من الخانة نفسها */
.rf-seg--date #rf-date-picker {
    position: absolute;
    width: 0;
    height: 0;
    padding: 0;
    border: 0;
    opacity: 0;
    pointer-events: none;
}

.rf-seg--date .rf-seg-value {
    overflow: visible;
    text-overflow: clip;
}
.rf-seg--guests { padding: 0; }

.rf-seg:hover,
.rf-seg:focus-within {
    box-shadow: inset 0 0 0 2px var(--rf-brand-dark);
}

.rf-seg-trigger {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 12px;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: start;
    cursor: pointer;
}

.rf-seg-icon {
    font-size: 1.15rem;
    color: var(--rf-brand-dark);
    flex-shrink: 0;
}

.rf-seg-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.rf-seg-label {
    font-size: .72rem;
    color: var(--rf-muted);
    line-height: 1.2;
}

.rf-seg-value,
.rf-select {
    font-size: .92rem;
    font-weight: 600;
    color: var(--rf-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5;
}

.rf-seg-value.is-placeholder {
    color: var(--rf-muted);
    font-weight: 400;
}

.rf-select {
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    outline: none;
}

.rf-caret {
    color: var(--rf-muted);
    font-size: .85rem;
    transition: transform .2s;
}

.rf-seg-trigger[aria-expanded="true"] .rf-caret,
.rf-extra-toggle[aria-expanded="true"] .rf-caret {
    transform: rotate(180deg);
}

.rf-clear {
    border: 0;
    background: #eee;
    color: var(--rf-muted);
    width: 22px;
    height: 22px;
    border-radius: 50%;
    line-height: 1;
    font-size: 1rem;
    flex-shrink: 0;
    cursor: pointer;
}

.rf-clear:hover { background: #e0e0e0; color: var(--rf-text); }

.rf-submit {
    flex: 0 0 auto;
    min-width: 100px;
    padding: 0 20px;
    border: 0;
    border-radius: 6px;
    background: var(--rf-text);
    color: #fff;
    font-size: 1rem;
    font-weight: 700;
    cursor: pointer;
    transition: background .15s;
}

.rf-submit:hover { background: #000; }

/* قائمة الأفراد */
.rf-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    inset-inline-start: 0;
    z-index: 30;
    width: 320px;
    padding: 16px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
    cursor: default;
}

.rf-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 14px;
    margin-bottom: 14px;
    border-bottom: 1px solid #eee;
}

.rf-row--stack {
    flex-direction: column;
    align-items: stretch;
}

.rf-row strong { display: block; color: var(--rf-text); }
.rf-row small { color: var(--rf-muted); }

.rf-stepper {
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 2px;
}

.rf-stepper span {
    min-width: 32px;
    text-align: center;
    font-weight: 700;
}

.rf-step {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: var(--rf-brand-dark);
    font-size: 1.3rem;
    line-height: 1;
    cursor: pointer;
}

.rf-step:hover { background: var(--rf-brand-soft); }
.rf-step:disabled { color: #ccc; background: transparent; cursor: not-allowed; }

.rf-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.rf-option { margin: 0; cursor: pointer; }
.rf-option input { display: none; }

.rf-option span {
    display: inline-block;
    padding: 6px 14px;
    border: 1px solid #ddd;
    border-radius: 20px;
    font-size: .9rem;
}

.rf-option input:checked + span {
    border-color: var(--rf-brand);
    background: var(--rf-brand-soft);
    color: var(--rf-brand-dark);
    font-weight: 600;
}

.rf-done {
    width: 100%;
    padding: 8px;
    border: 1px solid var(--rf-brand);
    border-radius: 6px;
    background: #fff;
    color: var(--rf-brand-dark);
    font-weight: 700;
    cursor: pointer;
}

.rf-done:hover { background: var(--rf-brand-soft); }

/* تقويم الفلتر */
.flatpickr-calendar.rf-calendar {
    width: auto !important;
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .18);
    padding: 12px 16px 16px;
    font-family: inherit;
}

.flatpickr-calendar.rf-calendar::before,
.flatpickr-calendar.rf-calendar::after { display: none; }

.rf-calendar .flatpickr-months { margin-bottom: 6px; }
.rf-calendar .flatpickr-months .flatpickr-month { height: 44px; }
.rf-calendar .flatpickr-current-month { font-size: 1.05rem; font-weight: 700; padding-top: 10px; }
.rf-calendar .flatpickr-current-month .numInputWrapper { width: 6ch; }
.rf-calendar .flatpickr-months .flatpickr-prev-month,
.rf-calendar .flatpickr-months .flatpickr-next-month { top: 12px; }
.rf-calendar .flatpickr-innerContainer { gap: 24px; }
.rf-calendar span.flatpickr-weekday { color: #6b6b6b; font-weight: 400; }

.rf-calendar .flatpickr-day {
    border-radius: 6px;
    font-weight: 700;
    color: #1e1e1e;
    height: 42px;
    line-height: 42px;
}

.rf-calendar .flatpickr-day.flatpickr-disabled,
.rf-calendar .flatpickr-day.prevMonthDay,
.rf-calendar .flatpickr-day.nextMonthDay {
    font-weight: 400;
    color: #c4c4c4;
}

.rf-calendar .flatpickr-day:hover { background: rgba(211, 152, 52, .15); border-color: transparent; }
.rf-calendar .flatpickr-day.today { border-color: transparent; color: #b07a1f; }

.rf-calendar .flatpickr-day.inRange,
.rf-calendar .flatpickr-day.inRange:hover {
    background: rgba(211, 152, 52, .15);
    border-color: transparent;
    box-shadow: -5px 0 0 rgba(211, 152, 52, .15), 5px 0 0 rgba(211, 152, 52, .15);
    border-radius: 0;
}

.rf-calendar .flatpickr-day.selected,
.rf-calendar .flatpickr-day.startRange,
.rf-calendar .flatpickr-day.endRange,
.rf-calendar .flatpickr-day.selected:hover,
.rf-calendar .flatpickr-day.startRange:hover,
.rf-calendar .flatpickr-day.endRange:hover {
    background: #d39834;
    border-color: #d39834;
    color: #fff;
    box-shadow: none;
}

.rf-calendar .flatpickr-day.endRange:not(.startRange) { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #d39834; }

/* خيارات التاريخ المرنة */
.rf-flex {
    margin-top: 12px;
    padding-top: 14px;
    border-top: 1px solid #eee;
    text-align: start;
}

.rf-flex-title {
    font-weight: 700;
    font-size: 1rem;
    color: #1e1e1e;
    margin-bottom: 10px;
}

.rf-flex-options {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.rf-flex-option {
    padding: 7px 16px;
    border: 1px solid #bbb;
    border-radius: 20px;
    background: #fff;
    color: #1e1e1e;
    font-size: .95rem;
    cursor: pointer;
    transition: border-color .15s, background .15s;
}

.rf-flex-option:hover { border-color: #d39834; }

.rf-flex-option.is-active {
    border-color: #d39834;
    background: rgba(211, 152, 52, .12);
    color: #b07a1f;
    font-weight: 700;
}

/* الفلاتر الإضافية */
.rf-extra-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
}

.rf-extra-toggle,
.rf-reset {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 0;
    border: 0;
    background: transparent;
    color: var(--rf-text);
    font-weight: 600;
    cursor: pointer;
}

.rf-reset { color: #c0392b; font-weight: 400; }
.rf-reset:hover { color: #962d22; }

.rf-extra {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 32px;
    margin-top: 12px;
    padding: 16px;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 10px;
}

.rf-extra[hidden] { display: none; }
.rf-extra-group--grow { flex: 1; }

.rf-extra-label {
    display: block;
    margin-bottom: 8px;
    color: var(--rf-brand-dark);
    font-weight: 600;
}

.rf-price {
    display: flex;
    align-items: center;
    gap: 8px;
}

.rf-input {
    width: 120px;
    padding: 7px 10px;
    border: 1px solid #ddd;
    border-radius: 6px;
}

.rf-input:focus { outline: none; border-color: var(--rf-brand); }
.rf-price-sep { color: var(--rf-muted); }

.rooms-filter-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.rooms-filter-tags input + label {
    margin: 0;
    padding: 6px 14px;
    border: 1px solid #d39834;
    border-radius: 20px;
    cursor: pointer;
    font-size: .9rem;
    user-select: none;
    color: #b07a1f;
}

.rooms-filter-tags input:checked + label {
    background: #d39834;
    color: #fff;
}

@media (max-width: 991.98px) {
    .rf-bar { flex-direction: column; }
    .rf-seg { flex: 1 1 auto; }
    .rf-submit { min-height: 42px; }
    .rf-seg--date { min-width: 0; }
    .rf-dropdown { width: 100%; }
}

/* ===== قسم الغرف ===== */
/* حاوية موحدة لشريط البحث وقسم الغرف ليكونا على نفس الخط */
.rooms-container,
.rooms-section {
    width: 100%;
    max-width: 1240px;
    margin-inline: auto;
    padding-inline: 16px;
}

.rooms-section {
    margin-block: 2rem;
}

.rooms-section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 1rem;
}

.rooms-section-head h2 {
    margin: 0;
    font-weight: 700;
    color: #1e1e1e;
}

.rooms-more {
    color: #d39834;
    font-weight: 600;
    white-space: nowrap;
}

.rooms-more:hover {
    color: #b07a1f;
}

.rooms-empty {
    text-align: center;
    padding: 1.5rem 0;
}

/* ===== بطاقة الغرفة ===== */
.room-card {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
    transition: box-shadow .2s ease;
}

.room-card:hover {
    box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
}

.room-card-img {
    position: relative;
    display: block;
    height: 200px;
    flex-shrink: 0;
    overflow: hidden;
    background: #f1ece4;
}

.room-card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.room-card-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 12px 14px 14px;
    color: inherit;
}

.room-card-body:hover {
    color: inherit;
}

.room-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
}

.room-status {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 3px;
    padding: 3px 9px;
    border-radius: 20px;
    font-size: .75rem;
    font-weight: 600;
    white-space: nowrap;
}

.room-status::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.room-status.is-available {
    background: rgba(40, 167, 69, .12);
    color: #1e7e34;
}

.room-status.is-booked {
    background: rgba(220, 53, 69, .12);
    color: #c82333;
}

.room-card-title {
    font-size: 1.2rem;
    font-weight: 700;
    color: #1e1e1e;
    margin: 0 0 2px;
}

.room-card-sub {
    font-size: .9rem;
    color: #6b6b6b;
    margin-bottom: 10px;
}

.room-card-badge {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.room-card-badge .score {
    min-width: 34px;
    height: 34px;
    padding: 0 6px;
    border-radius: 6px 6px 6px 0;
    background: #d39834;
    color: #fff;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.room-card-badge .label {
    font-size: .9rem;
    line-height: 1.3;
    color: #1e1e1e;
}

.room-card-badge .label small {
    display: block;
    color: #6b6b6b;
}

.room-tags .badge {
    background: rgba(211, 152, 52, .15);
    color: #b07a1f;
    font-weight: 500;
    margin: 0 0 4px 4px;
}

.room-card-price {
    margin-top: auto;
    padding-top: 12px;
    text-align: end;
    color: #6b6b6b;
    font-size: .9rem;
}

.room-card-price strong {
    font-size: 1.2rem;
    color: #1e1e1e;
    margin-inline-start: 4px;
}

/* ===== سلايدر الغرف (الصفحة الرئيسية) ===== */
.rooms-carousel {
    position: relative;
}

.rooms-carousel .owl-stage {
    display: flex;
    padding: 4px 0 12px;
}

.rooms-carousel .owl-item {
    display: flex;
}

.rooms-carousel > .owl-nav button.owl-prev,
.rooms-carousel > .owl-nav button.owl-next {
    position: absolute;
    top: 78px;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #fff !important;
    color: #1e1e1e !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    z-index: 2;
}

.rooms-carousel > .owl-nav button:hover {
    color: #d39834 !important;
}

.rooms-carousel > .owl-nav button.disabled {
    display: none;
}

.rooms-carousel[dir="rtl"] > .owl-nav .owl-prev { right: -22px; }
.rooms-carousel[dir="rtl"] > .owl-nav .owl-next { left: -22px; }
.rooms-carousel[dir="ltr"] > .owl-nav .owl-prev { left: -22px; }
.rooms-carousel[dir="ltr"] > .owl-nav .owl-next { right: -22px; }

/* ===== شبكة الغرف (صفحة كل الغرف) ===== */
.rooms-grid > div {
    margin-bottom: 24px;
}

@media (max-width: 767.98px) {
    .rooms-carousel > .owl-nav {
        display: none;
    }
}

@media (max-width: 575.98px) {
    .room-card-img {
        height: 170px;
    }
}