/* Public UI only. Staff and print layouts do not opt into .aradi-ui.
   Component selectors exclude Leaflet descendants, including plugin controls. */
.aradi-ui {
  --aradi-font-sans: "IBM Plex Sans Arabic", "Noto Sans Arabic", "Segoe UI", Tahoma, Arial, sans-serif;
  --aradi-primary: #174c3c;
  --aradi-primary-hover: #103b2e;
  --aradi-background: #f7f8f5;
  --aradi-surface: #fff;
  --aradi-text: #1d2925;
  --aradi-muted: #63716b;
  --aradi-border: #dce2dc;
  --aradi-accent: #cc9461;
  --aradi-primary-soft: #eaf1ed;
  --aradi-focus: #174c3c;
  --aradi-space-1: 0.25rem;
  --aradi-space-2: 0.5rem;
  --aradi-space-3: 0.75rem;
  --aradi-space-4: 1rem;
  --aradi-space-5: 1.5rem;
  --aradi-space-6: 2rem;
  --aradi-space-7: 3rem;
  --aradi-radius-sm: 0.375rem;
  --aradi-radius-control: 0.625rem;
  --aradi-radius-card: 0.75rem;
  --aradi-shadow: 0 2px 8px rgb(29 41 37 / 5%);
  --aradi-text-small: 0.875rem;
  --aradi-text-body: 1rem;
  --aradi-text-price: 1.25rem;
  --bs-body-font-family: var(--aradi-font-sans);
  --bs-body-color: var(--aradi-text);
  --bs-body-bg: var(--aradi-background);
  --bs-primary: var(--aradi-primary);
  --bs-primary-rgb: 23, 76, 60;
  --bs-success-rgb: 23, 76, 60;
  --bs-secondary-rgb: 99, 113, 107;
  --bs-link-color: var(--aradi-primary);
  --bs-link-hover-color: var(--aradi-primary-hover);
  --bs-border-color: var(--aradi-border);
  --bs-border-radius: var(--aradi-radius-control);
  --bs-border-radius-lg: var(--aradi-radius-card);
  color: var(--aradi-text);
  background-color: var(--aradi-background);
  font-family: var(--aradi-font-sans);
  font-size: var(--aradi-text-body);
  font-weight: 400;
  line-height: 1.75;
}

.aradi-ui :where(h1, h2, h3, h4, h5, h6):not(:where(.leaflet-container *)) {
  color: inherit;
  font-family: var(--aradi-font-sans);
  font-weight: 600;
  line-height: 1.45;
}
.aradi-ui :where(h1):not(:where(.leaflet-container *)) { font-size: clamp(1.75rem, 1.4rem + 1vw, 2.5rem); }
.aradi-ui :where(h2):not(:where(.leaflet-container *)) { font-size: clamp(1.5rem, 1.25rem + 0.7vw, 2rem); }
.aradi-ui :where(h3):not(:where(.leaflet-container *)) { font-size: 1.375rem; }
.aradi-ui :where(h4):not(:where(.leaflet-container *)) { font-size: 1.25rem; }
.aradi-ui :where(h5):not(:where(.leaflet-container *)) { font-size: 1.125rem; }
.aradi-ui :where(h6):not(:where(.leaflet-container *)) { font-size: 1rem; }
.aradi-ui :where(small, .small):not(:where(.leaflet-container *)) { font-size: var(--aradi-text-small); }
.aradi-ui :where(.text-muted):not(:where(.leaflet-container *)) { color: var(--aradi-muted) !important; }
.aradi-ui :where(.form-label, .col-form-label):not(:where(.leaflet-container *)) { font-weight: 500; }
.aradi-ui :where(.form-text):not(:where(.leaflet-container *)) { color: var(--aradi-muted); line-height: 1.6; }
.aradi-ui :where(.latest-card-price, .featured-land-card__price, .pricing-card-title):not(:where(.leaflet-container *)) {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.aradi-ui .aradi-price { font-size: var(--aradi-text-price); font-weight: 600; font-variant-numeric: tabular-nums; }
/* Isolate explicit identifiers, never reverse whole Arabic labels or currency phrases. */
.aradi-ui :where(bdi, .aradi-number) { unicode-bidi: isolate; font-variant-numeric: tabular-nums; }
.aradi-ui :where(.aradi-ltr, input[type="tel"], input[type="email"], input[type="url"]) {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: start;
}
.aradi-ui .font-monospace:not(:where(.leaflet-container *)) { direction: ltr; unicode-bidi: isolate; display: inline-block; }

.aradi-ui :where(a):not(:where(.leaflet-container *)) { text-underline-offset: 0.2em; }
.aradi-ui :where(a, button, input, select, textarea, [tabindex]):not(:where(.leaflet-container *)):focus-visible {
  outline: 2px solid var(--aradi-focus);
  outline-offset: 3px;
}
.aradi-ui :where(.btn):not(:where(.leaflet-container *)) {
  --bs-btn-font-family: var(--aradi-font-sans);
  --bs-btn-font-weight: 500;
  --bs-btn-line-height: 1.5;
  --bs-btn-border-radius: var(--aradi-radius-control);
  --bs-btn-padding-x: var(--aradi-space-4);
  --bs-btn-padding-y: var(--aradi-space-2);
  --bs-btn-focus-shadow-rgb: 23, 76, 60;
  min-block-size: 44px;
  align-content: center;
  transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease;
}
.aradi-ui :where(.btn-primary, .btn-success):not(:where(.leaflet-container *)) {
  --bs-btn-bg: var(--aradi-primary);
  --bs-btn-border-color: var(--aradi-primary);
  --bs-btn-hover-bg: var(--aradi-primary-hover);
  --bs-btn-hover-border-color: var(--aradi-primary-hover);
  --bs-btn-active-bg: var(--aradi-primary-hover);
  --bs-btn-active-border-color: var(--aradi-primary-hover);
  --bs-btn-disabled-bg: var(--aradi-primary);
  --bs-btn-disabled-border-color: var(--aradi-primary);
}
.aradi-ui :where(.btn-outline-primary, .btn-outline-success):not(:where(.leaflet-container *)) {
  --bs-btn-color: var(--aradi-primary);
  --bs-btn-border-color: var(--aradi-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--aradi-primary);
  --bs-btn-hover-border-color: var(--aradi-primary);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--aradi-primary-hover);
  --bs-btn-active-border-color: var(--aradi-primary-hover);
  --bs-btn-disabled-color: var(--aradi-primary);
  --bs-btn-disabled-border-color: var(--aradi-primary);
}
.aradi-ui :where(.btn-secondary):not(:where(.leaflet-container *)) {
  --bs-btn-bg: var(--aradi-muted);
  --bs-btn-border-color: var(--aradi-muted);
  --bs-btn-hover-bg: #4d5c54;
  --bs-btn-hover-border-color: #4d5c54;
  --bs-btn-active-bg: #3d4b43;
  --bs-btn-active-border-color: #3d4b43;
}
.aradi-ui :where(.btn-outline-secondary):not(:where(.leaflet-container *)) {
  --bs-btn-color: var(--aradi-muted);
  --bs-btn-border-color: var(--aradi-border);
  --bs-btn-hover-color: var(--aradi-text);
  --bs-btn-hover-bg: var(--aradi-primary-soft);
  --bs-btn-hover-border-color: var(--aradi-muted);
  --bs-btn-active-color: var(--aradi-text);
  --bs-btn-active-bg: var(--aradi-primary-soft);
  --bs-btn-active-border-color: var(--aradi-muted);
}
.aradi-ui :where(.btn:disabled, .btn.disabled):not(:where(.leaflet-container *)) { opacity: 0.55; }

.aradi-ui :where(.form-control, .form-select):not(:where(.leaflet-container *)) {
  min-block-size: 44px;
  border-color: var(--aradi-border);
  border-radius: var(--aradi-radius-control);
  background-color: var(--aradi-surface);
  color: var(--aradi-text);
  font-family: var(--aradi-font-sans);
  font-size: 1rem;
  line-height: 1.6;
  padding-block: var(--aradi-space-2);
}
.aradi-ui :where(.form-control, .form-select):not(:where(.leaflet-container *, :disabled, .is-valid, .is-invalid, .was-validated *)):hover { border-color: var(--aradi-muted); }
.aradi-ui :where(.form-control, .form-select):not(:where(.leaflet-container *)):focus {
  border-color: var(--aradi-primary);
  box-shadow: 0 0 0 3px rgb(23 76 60 / 14%);
}
.aradi-ui :where(.form-control, .form-select):not(:where(.leaflet-container *)):disabled {
  background-color: #eef1ec;
  color: var(--aradi-muted);
  opacity: 1;
}
.aradi-ui :where(.form-control):not(:where(.leaflet-container *))::placeholder { color: var(--aradi-muted); opacity: 1; }
.aradi-ui :where(.form-check-input):not(:where(.leaflet-container *)):checked { background-color: var(--aradi-primary); border-color: var(--aradi-primary); }
.aradi-ui :where(.form-check-input):not(:where(.leaflet-container *)):focus { border-color: var(--aradi-primary); box-shadow: 0 0 0 3px rgb(23 76 60 / 14%); }
.aradi-ui :where(.form-check-label):not(:where(.leaflet-container *)) { padding-block: var(--aradi-space-2); cursor: pointer; }

.aradi-ui :where(.card):not(:where(.leaflet-container *)) {
  --bs-card-border-color: var(--aradi-border);
  --bs-card-border-radius: var(--aradi-radius-card);
  --bs-card-inner-border-radius: calc(var(--aradi-radius-card) - 1px);
  --bs-card-cap-bg: var(--aradi-background);
  --bs-card-spacer-x: var(--aradi-space-5);
  --bs-card-spacer-y: var(--aradi-space-5);
  background-color: var(--aradi-surface);
  border-radius: var(--aradi-radius-card) !important;
  box-shadow: none;
}
.aradi-ui :where(.card.shadow, .card.shadow-sm, .card.shadow-lg):not(:where(.leaflet-container *)) { box-shadow: var(--aradi-shadow) !important; }
.aradi-ui .card-container .card:not(:where(.leaflet-container *)):hover { box-shadow: var(--aradi-shadow); }
.aradi-ui :where(.badge):not(:where(.leaflet-container *)) {
  --bs-badge-font-size: 0.75rem;
  --bs-badge-font-weight: 500;
  --bs-badge-border-radius: var(--aradi-radius-sm);
  --bs-badge-padding-x: var(--aradi-space-2);
  --bs-badge-padding-y: var(--aradi-space-1);
  line-height: 1.5;
}
.aradi-ui :where(.modal-content):not(:where(.leaflet-container *)) {
  --bs-modal-border-color: var(--aradi-border);
  --bs-modal-border-radius: var(--aradi-radius-card);
  --bs-modal-padding: var(--aradi-space-5);
  --bs-modal-header-padding: var(--aradi-space-4) var(--aradi-space-5);
}
.aradi-ui :where(.nav-pills):not(:where(.leaflet-container *)) {
  --bs-nav-pills-link-active-bg: var(--aradi-primary);
  --bs-nav-pills-border-radius: var(--aradi-radius-control);
}
.aradi-ui :where(.navbar):not(:where(.leaflet-container *)) {
  --bs-navbar-color: var(--aradi-muted);
  --bs-navbar-hover-color: var(--aradi-primary);
  --bs-navbar-active-color: var(--aradi-primary);
  padding-block: var(--aradi-space-3);
}
.aradi-ui :where(.nav-link, .navbar-toggler, .btn-close):not(:where(.leaflet-container *)) { min-block-size: 44px; }
.aradi-ui :where(.navbar-toggler, .btn-close):not(:where(.leaflet-container *)) { min-inline-size: 44px; }
.aradi-ui :where(.nav-link):not(:where(.leaflet-container *)) { align-content: center; }

@media (max-width: 575.98px) {
  .aradi-ui { --aradi-space-5: 1rem; --aradi-space-7: 2rem; }
  .aradi-ui :where(.btn-sm):not(:where(.leaflet-container *)) { min-block-size: 44px; padding-block: var(--aradi-space-2); }
  .aradi-ui :where(.card-body, .modal-body):not(:where(.leaflet-container *)) { overflow-wrap: anywhere; }
}
@media (prefers-reduced-motion: reduce) {
  .aradi-ui :where(.btn):not(:where(.leaflet-container *)) { transition: none; }
}

/* Bootstrap 5.2 compiles text-bg colours as literals rather than variables. */
.aradi-ui :where(.text-bg-primary, .text-bg-success):not(:where(.leaflet-container *)) {
  color: #fff !important;
  background-color: var(--aradi-primary) !important;
}