/**
 * rtl.css — RTL overrides for Arabic
 * Loaded only when dir="rtl" is active (Arabic language).
 * All values here OVERRIDE their LTR counterparts.
 */

/* ── Base direction ────────────────────────────────────────────────── */
body {
  font-family: 'Cairo', 'Segoe UI', sans-serif;
  text-align: right;
}

/* ── Navigation ────────────────────────────────────────────────────── */
.header-inner {
  flex-direction: row-reverse;
}
.nav-actions {
  flex-direction: row-reverse;
}
.lang-switcher {
  flex-direction: row-reverse;
}

/* ── Search card ───────────────────────────────────────────────────── */
.search-card-row {
  flex-direction: row-reverse;
}
.search-field {
  text-align: right;
}
.search-field input,
.search-field select {
  text-align: right;
  direction: rtl;
}
.search-field .field-icon {
  left: auto;
  right: 12px;
}
.search-field input {
  padding-left: 12px;
  padding-right: 36px;
}

/* ── Autocomplete dropdown ─────────────────────────────────────────── */
.autocomplete-list {
  text-align: right;
}
.autocomplete-item {
  flex-direction: row-reverse;
}

/* ── Date picker ───────────────────────────────────────────────────── */
.dp-header {
  flex-direction: row-reverse;
}
.dp-nav-prev {
  order: 1;
}
.dp-nav-next {
  order: -1;
}

/* ── Guests panel ──────────────────────────────────────────────────── */
.guests-panel {
  text-align: right;
}
.guests-row {
  flex-direction: row-reverse;
}
.guests-counter {
  flex-direction: row-reverse;
}

/* ── Results page ──────────────────────────────────────────────────── */
.results-layout {
  flex-direction: row-reverse;
}
.filters-sidebar {
  text-align: right;
}
.hotel-card-body {
  text-align: right;
}
.hotel-card-footer {
  flex-direction: row-reverse;
}
.hotel-card-price {
  text-align: left;
}
.hotel-badges {
  flex-direction: row-reverse;
}
.sort-bar {
  flex-direction: row-reverse;
}

/* ── Stars ─────────────────────────────────────────────────────────── */
.star-rating {
  flex-direction: row-reverse;
}

/* ── Hotel detail ──────────────────────────────────────────────────── */
.hotel-detail-layout {
  flex-direction: row-reverse;
}
.hotel-sidebar {
  text-align: right;
}
.amenity-grid {
  text-align: right;
}
.amenity-item {
  flex-direction: row-reverse;
}
.room-card {
  text-align: right;
}
.room-card-footer {
  flex-direction: row-reverse;
}
.room-price-block {
  text-align: left;
}

/* ── Modify search bar ─────────────────────────────────────────────── */
.modify-bar-inner {
  flex-direction: row-reverse;
}
.modify-bar-seg {
  text-align: right;
}

/* ── Checkout ──────────────────────────────────────────────────────── */
.co-layout {
  flex-direction: row-reverse;
}
.co-section-title {
  flex-direction: row-reverse;
}
.co-sub-title {
  flex-direction: row-reverse;
}
.co-name-row {
  flex-direction: row-reverse;
}
.co-label {
  text-align: right;
}
.co-input,
.co-select,
.co-textarea {
  text-align: right;
  direction: rtl;
}
.co-phone-row {
  flex-direction: row-reverse;
}
.co-promo-row {
  flex-direction: row-reverse;
}
.co-price-row {
  flex-direction: row-reverse;
}
.co-total-row {
  flex-direction: row-reverse;
}
.co-dates-row {
  flex-direction: row-reverse;
}
.co-date-block {
  text-align: right;
}
.co-trust {
  flex-direction: row-reverse;
}
.co-trust-item {
  flex-direction: row-reverse;
  gap: 5px;
}
.co-hotel-header {
  flex-direction: row-reverse;
}
.co-hotel-meta {
  text-align: right;
}
.co-summary-loc {
  flex-direction: row-reverse;
}
.co-mob-header {
  flex-direction: row-reverse;
}
.co-steps {
  flex-direction: row-reverse;
}

/* ── Countdown bar ─────────────────────────────────────────────────── */
.co-timer-bar-inner {
  flex-direction: row-reverse;
}

/* ── Confirmation page ─────────────────────────────────────────────── */
.confirm-header-green,
.confirm-header-amber,
.confirm-header-red {
  text-align: right;
}
.confirm-ref-section {
  text-align: right;
}
.confirm-ref-badge {
  flex-direction: row-reverse;
}
.booking-details-table td {
  text-align: right;
}
.confirm-actions {
  flex-direction: row-reverse;
}
.amber-info-box {
  text-align: right;
}

/* ── Footer ────────────────────────────────────────────────────────── */
.footer-inner {
  flex-direction: row-reverse;
}
.footer-col {
  text-align: right;
}
.footer-bottom-inner {
  flex-direction: row-reverse;
}
.footer-social {
  flex-direction: row-reverse;
}

/* ── Generic flex containers ───────────────────────────────────────── */
.breadcrumb {
  flex-direction: row-reverse;
}
.breadcrumb-sep {
  transform: scaleX(-1);
}

/* ── Modals ────────────────────────────────────────────────────────── */
.modal-header {
  flex-direction: row-reverse;
}
.modal-body {
  text-align: right;
}

/* ── Toasts ────────────────────────────────────────────────────────── */
#toast-container {
  left: 20px;
  right: auto;
}

/* ── Price display — numbers stay LTR even in RTL ──────────────────── */
.hotel-price,
.co-price-val,
.co-total-val,
.co-mob-total,
.co-pay-amount,
.room-price,
.deal-price {
  direction: ltr;
  unicode-bidi: embed;
}

/* ── Input placeholders ────────────────────────────────────────────── */
input::placeholder,
textarea::placeholder {
  text-align: right;
}

/* ── Dial code picker ──────────────────────────────────────────────── */
.co-dial-trigger {
  flex-direction: row-reverse;
}
.co-dial-panel {
  left: auto;
  right: 0;
  text-align: right;
}
.co-dial-list-item {
  flex-direction: row-reverse;
  text-align: right;
}