/* ============================================================================
   AbuJudom UI Enhancements (May 2026 - r3 / final polish)
   Standalone, additive stylesheet. Does NOT override existing classes.
   All custom classes are prefixed with "aj-" to avoid conflicts.

   What's inside:
     1. CSS variables + dark-mode tokens
     2. Dark mode (opt-in via body.aj-dark)
     3. Header dark-mode toggle (in identity color, lives inside .main-header)
        + legacy floating fallback (only used if header is absent)
     4. Scroll-reveal animations (.aj-reveal*)
     5. Modern card hover (.aj-card-hover)
     6. Sticky shrinking header + header polish (hover lift, nav underline)
     7. Footer polish (brand-color accent line, social-icon hover)
     8. Loading skeletons
     9. Reading progress bar
    10. Infinite-scroll UI (sentinel, "Load more" button, end-of-results)
    11. Print + accessibility
   ============================================================================ */

:root {
    --aj-primary: #b7cd27;
    --aj-primary-dark: #a7bd1b;
    --aj-primary-soft: rgba(183, 205, 39, 0.12);
    --aj-bg: #ffffff;
    --aj-bg-soft: #f7f8fa;
    --aj-bg-card: #ffffff;
    --aj-text: #878c9f;
    --aj-text-muted: #6b7280;
    --aj-border: #e5e7eb;
    --aj-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
    --aj-shadow-hover: 0 12px 28px rgba(15, 23, 42, 0.14);
    --aj-radius: 10px;
    --aj-transition: 280ms cubic-bezier(.2, .8, .2, 1);
}

/* ---------- 1. DARK MODE (opt-in) ---------- */
body.aj-dark {
    --aj-bg: #878c9f;
    --aj-bg-soft: #1e293b;
    --aj-bg-card: #1e293b;
    --aj-text: #e5e7eb;
    --aj-text-muted: #94a3b8;
    --aj-border: #334155;
    --aj-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
    --aj-shadow-hover: 0 12px 28px rgba(0, 0, 0, 0.6);
    background: var(--aj-bg);
    color: var(--aj-text);
}

body.aj-dark .gray-bg,
body.aj-dark .listing-item,
body.aj-dark .geodir-category-listing,
body.aj-dark .box-widget,
body.aj-dark .main-header,
body.aj-dark .geodir-category-content,
body.aj-dark footer,
body.aj-dark .sub-footer {
    background-color: var(--aj-bg-card) !important;
    color: var(--aj-text) !important;
    border-color: var(--aj-border) !important;
}

body.aj-dark .list-single-main-item_content p,
body.aj-dark .geodir-category-content h3,
body.aj-dark .geodir-category-content_price,
body.aj-dark h1, body.aj-dark h2, body.aj-dark h3,
body.aj-dark h4, body.aj-dark h5, body.aj-dark h6 {
    color: var(--aj-text) !important;
}

body.aj-dark a:not(.color-bg):not(.btn) { color: #cee552; }

body.aj-dark .main-search-input,
body.aj-dark input[type="text"],
body.aj-dark input[type="email"],
body.aj-dark input[type="search"],
body.aj-dark input[type="number"],
body.aj-dark select,
body.aj-dark textarea {
    background: var(--aj-bg-soft) !important;
    color: var(--aj-text) !important;
    border-color: var(--aj-border) !important;
}

body, body * {
    transition: background-color var(--aj-transition), color var(--aj-transition), border-color var(--aj-transition);
}

/* ---------- 2/3. DARK-MODE TOGGLE IN HEADER (identity color) ----------
   The toggle is injected by abujudom-enhancements.js as a sibling of the
   existing .header-opt_btn (language globe). It re-uses the same look so it
   matches the brand identity perfectly, and uses the brand color for the icon. */
.aj-header-toggle {
    /* mimic the header opt buttons */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    margin: 0 4px;
    border: none;
    background: transparent;
    cursor: pointer;
    color: var(--aj-primary);     /* identity color */
    position: relative;
    border-radius: 50%;
    transition: transform var(--aj-transition), background var(--aj-transition), color var(--aj-transition), box-shadow var(--aj-transition);
}
.aj-header-toggle:hover {
    background: var(--aj-primary-soft);
    color: var(--aj-primary-dark);
    transform: translateY(-2px);
    box-shadow: 0 6px 14px rgba(183, 205, 39, 0.25);
}
.aj-header-toggle:focus-visible {
    outline: 2px solid var(--aj-primary);
    outline-offset: 2px;
}
.aj-header-toggle svg { width: 22px; height: 22px; }

/* Tooltip (uses microtip pattern already in the site) */
.aj-header-toggle::after {
    content: attr(data-tooltip);
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, 6px);
    background: rgba(15, 23, 42, 0.92);
    color: #fff;
    font-size: 11px;
    line-height: 1;
    padding: 6px 8px;
    border-radius: 4px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity 180ms ease;
    z-index: 9001;
}
.aj-header-toggle:hover::after { opacity: 1; }

body.aj-dark .aj-header-toggle { color: #cee552; }
body.aj-dark .aj-header-toggle:hover {
    background: rgba(206, 229, 82, 0.16);
    box-shadow: 0 6px 14px rgba(206, 229, 82, 0.25);
}

/* Legacy floating toggle: kept ONLY as fallback if the header is missing
   (e.g. dashboard pages with their own layout). */
.aj-theme-toggle {
    position: fixed;
    bottom: 24px;
    left: 24px;
    z-index: 9998;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--aj-primary);
    color: #ffffff;
    border: none;
    box-shadow: var(--aj-shadow-hover);
    cursor: pointer;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform var(--aj-transition), background var(--aj-transition);
}
.aj-theme-toggle:hover { transform: scale(1.1) rotate(15deg); background: var(--aj-primary-dark); }
.aj-theme-toggle:focus-visible { outline: 3px solid #cee552; outline-offset: 2px; }
html[dir="rtl"] .aj-theme-toggle { left: auto; right: 24px; }

/* ---------- 4. SCROLL-REVEAL ---------- */
.aj-reveal,
.aj-reveal-up,
.aj-reveal-zoom,
.aj-reveal-left,
.aj-reveal-right {
    opacity: 0;
    transition: opacity 700ms cubic-bezier(.2, .8, .2, 1), transform 700ms cubic-bezier(.2, .8, .2, 1);
    will-change: opacity, transform;
}
.aj-reveal-up    { transform: translateY(32px); }
.aj-reveal-zoom  { transform: scale(0.94); }
.aj-reveal-left  { transform: translateX(-32px); }
.aj-reveal-right { transform: translateX(32px); }

.aj-reveal.aj-revealed,
.aj-reveal-up.aj-revealed,
.aj-reveal-zoom.aj-revealed,
.aj-reveal-left.aj-revealed,
.aj-reveal-right.aj-revealed {
    opacity: 1;
    transform: none;
}

@media (prefers-reduced-motion: reduce) {
    .aj-reveal, .aj-reveal-up, .aj-reveal-zoom, .aj-reveal-left, .aj-reveal-right {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}

/* ---------- 5. MODERN CARD HOVER ---------- */
.aj-card-hover {
    transition: transform var(--aj-transition), box-shadow var(--aj-transition);
    will-change: transform;
}
.aj-card-hover:hover {
    transform: translateY(-6px);
    box-shadow: var(--aj-shadow-hover);
}
.aj-card-hover img {
    transition: transform 600ms cubic-bezier(.2, .8, .2, 1);
    will-change: transform;
}
.aj-card-hover:hover img { transform: scale(1.06); }

/* ---------- 6. STICKY SHRINKING HEADER + HEADER POLISH ---------- */
header.main-header.aj-sticky-header {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9000;
    transition: padding var(--aj-transition), background var(--aj-transition), box-shadow var(--aj-transition);
}
header.main-header.aj-sticky-header.aj-shrunk {
    padding-top: 6px;
    padding-bottom: 6px;
    background: rgba(255, 255, 255, 0.96);
    -webkit-backdrop-filter: saturate(180%) blur(16px);
    backdrop-filter: saturate(180%) blur(16px);
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.08);
    border-bottom: 1px solid var(--aj-primary-soft);
}
header.main-header.aj-sticky-header.aj-shrunk .logo-holder img {
    transform: scale(0.85);
    transition: transform var(--aj-transition);
}
body.aj-dark header.main-header.aj-sticky-header.aj-shrunk {
    background: rgba(15, 23, 42, 0.92);
    border-bottom-color: rgba(206, 229, 82, 0.2);
}

body.aj-sticky-active { padding-top: 80px; }

/* Header opt-button hover lift (matches new toggle) */
header.main-header .header-opt_btn,
header.main-header .cart-btn {
    transition: transform var(--aj-transition), background var(--aj-transition), box-shadow var(--aj-transition);
}
header.main-header .header-opt_btn:hover,
header.main-header .cart-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.10);
}

/* Animated nav underline (only desktop) */
@media (min-width: 992px) {
    header.main-header .nav-holder.main-menu nav > ul > li > a {
        position: relative;
        transition: color var(--aj-transition);
    }
    header.main-header .nav-holder.main-menu nav > ul > li > a::after {
        content: "";
        position: absolute;
        bottom: -4px;
        left: 50%;
        width: 0;
        height: 2px;
        background: var(--aj-primary);
        border-radius: 2px;
        transition: width var(--aj-transition), left var(--aj-transition);
    }
    header.main-header .nav-holder.main-menu nav > ul > li:hover > a::after,
    header.main-header .nav-holder.main-menu nav > ul > li.act-link > a::after {
        width: 70%;
        left: 15%;
    }
}

/* ---------- 7. FOOTER POLISH ---------- */
footer.main-footer {
    position: relative;
    background: #f8fafc !important;
    color: #334155 !important;
}
footer.main-footer .footer-inner {
    background: transparent !important;
}
footer.main-footer .sub-footer {
    background: #eef2f7 !important;
    color: #878c9f !important;
}
footer.main-footer .sub-footer .copyright {
    color: #878c9f !important;
}
footer.main-footer h2,
footer.main-footer h3,
footer.main-footer h4 {
    color: #1e293b !important;
    font-weight: 700;
    letter-spacing: -0.2px;
}
footer.main-footer .footer-list li a,
footer.main-footer .footer-contacts li a,
footer.main-footer .footer-contacts li span,
footer.main-footer p,
footer.main-footer .fw_hours span,
footer.main-footer .fw_hours strong {
    color: #334155 !important;
}
footer.main-footer .footer-list li a:hover {
    color: var(--aj-primary) !important;
}
footer.main-footer::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, transparent, var(--aj-primary) 15%, #cee552 50%, var(--aj-primary) 85%, transparent);
    opacity: 1;
}

footer.main-footer .footer-social ul li a {
    transition: transform var(--aj-transition), color var(--aj-transition), box-shadow var(--aj-transition), background var(--aj-transition);
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, 0.14);
    color: #1e293b !important;
    font-size: 15px;
}
footer.main-footer .footer-social ul li a i,
.aj-footer-feature-icons a i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
footer.main-footer .footer-social ul li a .aj-social-svg {
    width: 16px;
    height: 16px;
    display: block;
    object-fit: contain;
    filter: brightness(0) saturate(100%);
}
footer.main-footer .footer-social ul li a:hover .aj-social-svg {
    filter: none;
}
/* The icon-font fallback letters used to be a safety net when Font Awesome
   failed to load. We now ship FA 5.15.4 Free locally (woff2 + woff + ttf),
   so the fallback letters should NEVER appear. Keep the rule with !important
   to defeat any legacy script that might unhide them. */
.aj-icon-fallback {
    display: none !important;
    visibility: hidden !important;
}
footer.main-footer .footer-social ul li a:hover {
    transform: translateY(-3px) scale(1.05);
    color: #ffffff !important;
    background: var(--aj-primary);
    box-shadow: 0 6px 14px rgba(183, 205, 39, 0.25);
}
footer.main-footer .footer-social ul li a i {
    font-family: "Font Awesome 5 Brands", "Font Awesome 6 Brands", "Font Awesome 5 Pro", "Font Awesome 5 Free", "FontAwesome" !important;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
}

/* Extra footer quick icons (small service shortcuts) */
.aj-footer-feature-icons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 14px;
}
.aj-footer-feature-icons a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: rgba(183, 205, 39, 0.18);
    border: 1px solid rgba(183, 205, 39, 0.45);
    color: #1e293b !important;
    font-size: 16px;
    line-height: 1;
    transition: transform 180ms ease, background 180ms ease, color 180ms ease;
}
.aj-footer-feature-icons a i,
.aj-footer-feature-icons a i.fas,
.aj-footer-feature-icons a i.fa {
    font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    font-style: normal !important;
    color: inherit !important;
    line-height: 1 !important;
    display: inline-block !important;
    -webkit-font-smoothing: antialiased;
}
.aj-footer-feature-icons a:hover {
    transform: translateY(-2px);
    background: var(--aj-primary);
    color: #878c9f !important;
}

footer.main-footer .footer-list li a {
    position: relative;
    transition: padding var(--aj-transition), color var(--aj-transition);
}
footer.main-footer .footer-list li a:hover {
    padding-left: 8px;
    color: var(--aj-primary) !important;
}
html[dir="rtl"] footer.main-footer .footer-list li a:hover {
    padding-left: 0;
    padding-right: 8px;
}
footer.main-footer .footer-list li a::before {
    content: "";
    position: absolute;
    left: -2px;
    top: 50%;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--aj-primary);
    transform: translateY(-50%) scale(0);
    transition: transform var(--aj-transition);
}
footer.main-footer .footer-list li a:hover::before { transform: translateY(-50%) scale(1); }
html[dir="rtl"] footer.main-footer .footer-list li a::before { left: auto; right: -2px; }

footer.main-footer .api-btn {
    transition: transform var(--aj-transition), box-shadow var(--aj-transition), filter var(--aj-transition);
}
footer.main-footer .api-btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.05);
    box-shadow: 0 8px 18px rgba(183, 205, 39, 0.30);
}

.sub-footer.gray-bg {
    border-top: 1px solid var(--aj-border);
}

/* ---------- 8. LOADING SKELETONS ---------- */
.aj-skeleton {
    background: linear-gradient(90deg, var(--aj-bg-soft) 25%, var(--aj-border) 50%, var(--aj-bg-soft) 75%);
    background-size: 200% 100%;
    animation: aj-skeleton-shimmer 1.4s ease-in-out infinite;
    border-radius: 6px;
    color: transparent !important;
    pointer-events: none;
}
@keyframes aj-skeleton-shimmer {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
.aj-skeleton-card { height: 320px; border-radius: var(--aj-radius); }

/* ---------- 9. READING PROGRESS BAR ---------- */
.aj-progress {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--aj-primary), #cee552);
    z-index: 10000;
    transition: width 80ms linear;
    width: 0;
}

/* ---------- 10. INFINITE-SCROLL / LOAD-MORE UI ---------- */
.aj-loadmore-wrap {
    width: 100%;
    text-align: center;
    padding: 24px 16px 40px;
    margin-top: 12px;
    clear: both;
}
.aj-loadmore-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 28px;
    border: none;
    border-radius: 999px;
    background: var(--aj-primary);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 6px 16px rgba(183, 205, 39, 0.25);
    transition: transform var(--aj-transition), background var(--aj-transition), box-shadow var(--aj-transition);
}
.aj-loadmore-btn:hover:not(:disabled) {
    transform: translateY(-2px);
    background: var(--aj-primary-dark);
    box-shadow: 0 10px 22px rgba(183, 205, 39, 0.35);
}
.aj-loadmore-btn:disabled { opacity: 0.55; cursor: default; }
.aj-loadmore-btn .aj-spinner {
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255,255,255,0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: aj-spin 750ms linear infinite;
    display: none;
}
.aj-loadmore-btn.aj-loading .aj-spinner { display: inline-block; }
@keyframes aj-spin { to { transform: rotate(360deg); } }

.aj-loadmore-end {
    display: block;
    margin-top: 8px;
    color: var(--aj-text-muted);
    font-size: 13px;
}

/* New items fade/slide in when appended */
.aj-newly-loaded {
    animation: aj-fade-up 600ms cubic-bezier(.2, .8, .2, 1) both;
}
@keyframes aj-fade-up {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: none; }
}

/* Hide the original PagedList pager once we hijack pagination */
.listing-item-container.aj-infinite + .pagination,
.listing-item-container.aj-infinite .pagination,
.aj-infinite-host .pagination {
    display: none !important;
}

/* ---------- 11. LANGUAGE PICKER POLISH ----------
   Adds a small "EN" / "AR" badge on the existing globe button, and
   polishes the language modal. */
.aj-lang-badge {
    position: absolute;
    bottom: -4px;
    right: -6px;
    background: var(--aj-primary);
    color: #878c9f;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    padding: 2px 5px;
    border-radius: 8px;
    letter-spacing: 0.4px;
    box-shadow: 0 2px 4px rgba(183, 205, 39, 0.45), 0 0 0 2px rgba(255, 255, 255, 0.95);
    pointer-events: none;
    z-index: 5;
    font-family: 'Jost', 'Tajawal', 'Cairo', sans-serif;
    text-transform: uppercase;
}
html[dir="rtl"] .aj-lang-badge { right: auto; left: -6px; }
header.main-header .header-opt_btn { position: relative; overflow: visible !important; }
header.main-header .header-opt { overflow: visible !important; }

/* Polish the existing language modal (.header-opt-modal .lang-item) */
.header-opt-modal {
    transition: opacity var(--aj-transition), transform var(--aj-transition);
}
.header-opt-modal:not(.novis_header-mod) {
    animation: aj-modal-pop 240ms cubic-bezier(.2, .8, .2, 1) both;
}
@keyframes aj-modal-pop {
    from { opacity: 0; transform: translateY(-8px) scale(.96); }
    to   { opacity: 1; transform: none; }
}
.header-opt-modal .lang-item h4 {
    color: var(--aj-text);
    font-weight: 600;
}
.header-opt-modal .lang-item h4 span {
    color: var(--aj-primary);
    margin-left: 6px;
}
html[dir="rtl"] .header-opt-modal .lang-item h4 span { margin-left: 0; margin-right: 6px; }

.header-opt-modal .header-opt-modal-list ul li a {
    display: flex !important;
    align-items: center;
    gap: 10px;
    padding: 10px 14px !important;
    margin: 4px 0;
    border-radius: 8px;
    border: 1px solid transparent;
    transition: background var(--aj-transition), border-color var(--aj-transition), color var(--aj-transition), transform var(--aj-transition);
}
.header-opt-modal .header-opt-modal-list ul li a::before {
    content: attr(data-lantext);
    display: inline-block;
    min-width: 28px;
    padding: 3px 6px;
    border-radius: 6px;
    background: var(--aj-bg-soft);
    color: var(--aj-text-muted);
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    letter-spacing: 0.5px;
    transition: background var(--aj-transition), color var(--aj-transition);
}
.header-opt-modal .header-opt-modal-list ul li a:not([data-lantext])::before {
    content: "AR";
    background: var(--aj-bg-soft);
    color: var(--aj-text-muted);
}
.header-opt-modal .header-opt-modal-list ul li a:hover {
    background: var(--aj-primary-soft);
    border-color: var(--aj-primary);
    transform: translateX(2px);
}
html[dir="rtl"] .header-opt-modal .header-opt-modal-list ul li a:hover { transform: translateX(-2px); }
.header-opt-modal .header-opt-modal-list ul li a.current-lan {
    background: var(--aj-primary);
    color: #fff !important;
    border-color: var(--aj-primary);
    box-shadow: 0 4px 10px rgba(183, 205, 39, 0.3);
}
.header-opt-modal .header-opt-modal-list ul li a.current-lan::before {
    background: rgba(255,255,255,0.2);
    color: #fff;
}

/* ---------- 12. EVALUATION CTA POLISH ("rate your property" feel) ----------
   The header has an "Evaluation" link going to evaluation.abujudom.com.
   Make it look like a polished rating CTA: gradient background, star icon,
   subtle pulse to draw the eye. */
header.main-header .add-list[href*="evaluation"] {
    position: relative;
    background: linear-gradient(135deg, var(--aj-primary) 0%, #cee552 60%, var(--aj-primary) 100%) !important;
    background-size: 200% 100%;
    animation: aj-eval-shine 6s ease-in-out infinite;
    border: none;
    box-shadow: 0 6px 16px rgba(183, 205, 39, 0.25);
    overflow: hidden;
    transition: transform var(--aj-transition), box-shadow var(--aj-transition);
}
header.main-header .add-list[href*="evaluation"]::before {
    content: "\2605";   /* unicode star */
    display: inline-block;
    margin-right: 6px;
    color: #ffffff;
    font-size: 15px;
    text-shadow: 0 0 6px rgba(255, 255, 255, 0.7);
    animation: aj-star-twinkle 2.4s ease-in-out infinite;
}
html[dir="rtl"] header.main-header .add-list[href*="evaluation"]::before { margin-right: 0; margin-left: 6px; }
header.main-header .add-list[href*="evaluation"]:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 10px 22px rgba(183, 205, 39, 0.4);
}
@keyframes aj-eval-shine {
    0%, 100% { background-position: 0% 50%; }
    50%      { background-position: 100% 50%; }
}
@keyframes aj-star-twinkle {
    0%, 100% { transform: scale(1)   rotate(0deg);  opacity: 1;   }
    50%      { transform: scale(1.2) rotate(15deg); opacity: 0.85; }
}

/* ---------- 13. RATING COMPONENT POLISH ----------
   Existing rating widgets:
     - .listing-rating  (display, gold stars from FA)
     - .leave-rating    (radio inputs styled as stars for review form)
     - .card-popup-rainingvis_bg (5-star backdrop) */
.listing-rating i,
.card-popup-rainingvis_bg span:before {
    background: linear-gradient(135deg, #facc15, #f59e0b);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #facc15;
    filter: drop-shadow(0 1px 1px rgba(0,0,0,0.08));
    transition: transform 240ms cubic-bezier(.2, .8, .2, 1);
}
.listing-rating:hover i {
    transform: scale(1.1);
}

/* The interactive .leave-rating uses input[type=radio] + label.fa-star */
.leave-rating {
    display: inline-flex;
    flex-direction: row-reverse;   /* radios are 1..5; reverse so hover fills left */
    gap: 4px;
}
.leave-rating label {
    cursor: pointer;
    font-size: 22px !important;
    color: #d1d5db;
    transition: color 180ms ease, transform 180ms ease, text-shadow 180ms ease;
}
.leave-rating label:hover,
.leave-rating label:hover ~ label,
.leave-rating input[type="radio"]:checked ~ label {
    color: #facc15 !important;
    text-shadow: 0 0 8px rgba(250, 204, 21, 0.5);
    transform: scale(1.12);
}
.leave-rating input[type="radio"]:focus-visible + label {
    outline: 2px solid var(--aj-primary);
    outline-offset: 2px;
    border-radius: 4px;
}

/* Rating count text gets a subtle highlight */
.count-radio-wrapper #count-checked-radio {
    display: inline-block;
    padding: 4px 10px;
    background: var(--aj-primary-soft);
    color: var(--aj-primary-dark);
    border-radius: 999px;
    font-weight: 600;
    font-size: 12px;
}

/* ---------- 14. MASONRY LAYOUT (listings) ----------
   Activated when .listing-item-container.aj-masonry is present.
   Masonry.js handles the JS positioning; we just give it a clean canvas. */
.listing-item-container.aj-masonry {
    /* Masonry sets inline width/position on each item, so make the
       container a plain block. The classes below remove float-based
       layout that conflicts with absolute positioning. */
    float: none;
    width: 100%;
    position: relative;
    min-height: 320px;
}
.listing-item-container.aj-masonry .listing-item {
    width: calc(50% - 12px);   /* 2-column default */
    margin-bottom: 24px;
    float: none;               /* Masonry uses absolute positioning */
    box-sizing: border-box;
}
@media (max-width: 768px) {
    .listing-item-container.aj-masonry .listing-item { width: 100%; }
}

/* Subtle reveal once Masonry has measured items (prevents flash of
   unstyled stacked items). aj-masonry-ready is set by our JS after init. */
.listing-item-container.aj-masonry:not(.aj-masonry-ready) .listing-item {
    opacity: 0;
}
.listing-item-container.aj-masonry.aj-masonry-ready .listing-item {
    opacity: 1;
    transition: opacity 400ms ease;
}

/* ---------- 15. TAJAWAL FONT (Arabic) ----------
   Apply Tajawal in Arabic via natural CSS inheritance from <body>. We DO
   NOT use the universal `body *` selector here because that would force
   Tajawal onto every <i> icon tag (Font Awesome, LightGallery, Google
   Places, etc.) and break their glyphs into white squares.

   Form controls (input, button, select, textarea) don't inherit
   font-family by default, so we target them explicitly. */
html[lang^="ar"] body,
html[dir="rtl"] body {
    font-family: 'Tajawal', 'Cairo', system-ui, -apple-system, "Segoe UI", Tahoma, sans-serif !important;
    font-weight: 400 !important;
}
html[lang^="ar"] input,
html[lang^="ar"] textarea,
html[lang^="ar"] select,
html[lang^="ar"] button,
html[lang^="ar"] optgroup,
html[lang^="ar"] option,
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select,
html[dir="rtl"] button,
html[dir="rtl"] optgroup,
html[dir="rtl"] option {
    font-family: 'Tajawal', 'Cairo', system-ui, -apple-system, "Segoe UI", Tahoma, sans-serif !important;
}
/* Belt + suspenders: explicitly preserve icon-font families in Arabic
   contexts in case a legacy parent rule cascades unexpectedly. */
html[lang^="ar"] body i.fa, html[lang^="ar"] body i.fas, html[lang^="ar"] body i.far,
html[lang^="ar"] body i.fal,
html[dir="rtl"] body i.fa, html[dir="rtl"] body i.fas, html[dir="rtl"] body i.far,
html[dir="rtl"] body i.fal,
html[lang^="ar"] body .fa::before,
html[lang^="ar"] body .fas::before,
html[lang^="ar"] body .far::before,
html[lang^="ar"] body .fal::before,
html[dir="rtl"] body .fa::before,
html[dir="rtl"] body .fas::before,
html[dir="rtl"] body .far::before,
html[dir="rtl"] body .fal::before {
    font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free", "FontAwesome" !important;
}
html[lang^="ar"] body i.fab,
html[dir="rtl"] body i.fab,
html[lang^="ar"] body .fab::before,
html[dir="rtl"] body .fab::before {
    font-family: "Font Awesome 5 Brands", "Font Awesome 6 Brands", "FontAwesome" !important;
}
/* Keep LightGallery icon fonts intact globally */
.lg-icon,
.lg-icon::before,
.lg-icon::after,
.lg-close::before,
.lg-close::after,
.lg-toolbar .lg-icon,
.lg-toolbar .lg-icon::before,
.lg-toolbar .lg-icon::after {
    font-family: 'lg' !important;
}
/* Prev/next arrows use FontAwesome arrows, not lg font */
.lg-prev::after,
.lg-next::before,
.lg-actions .lg-prev::after,
.lg-actions .lg-next::before {
    font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    font-size: 22px !important;
    color: #ffffff !important;
    display: inline-block !important;
}
/* Hard fallback so icons always render. The site ships FA 5.15.4 Free
   webfonts under the family name "Font Awesome 5 Pro" (the @font-face
   in plugins.css uses that legacy name, but the actual glyph data is the
   Free set we shipped). Put the registered name FIRST so the browser
   immediately resolves it and never paints empty boxes. */
i.fa, i.fas, .fa::before, .fas::before {
    font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
}
i.far, .far::before,
i.fal, .fal::before {
    font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 400 !important;
}
i.fab, .fab::before {
    font-family: "Font Awesome 5 Brands", "Font Awesome 6 Brands", "FontAwesome" !important;
    font-weight: 400 !important;
}

/* ============================================================================
   PHASE 3 (May 2026) - Homepage polish, standard language picker, brand
   loader, logo shadow, 3x3 grid, modern section treatments.
   ============================================================================ */

/* ---------- 16. LOGO SHADOW (header) ---------- */
header.main-header .logo-holder img {
    filter:
        drop-shadow(0 2px 4px rgba(0, 0, 0, 0.18))
        drop-shadow(0 6px 14px rgba(183, 205, 39, 0.18));
    transition: filter var(--aj-transition), transform var(--aj-transition);
}
header.main-header .logo-holder img:hover {
    transform: translateY(-1px) scale(1.03);
    filter:
        drop-shadow(0 4px 8px rgba(0, 0, 0, 0.22))
        drop-shadow(0 10px 20px rgba(183, 205, 39, 0.28));
}
body.aj-dark header.main-header .logo-holder img {
    filter:
        drop-shadow(0 2px 4px rgba(0, 0, 0, 0.5))
        drop-shadow(0 6px 14px rgba(206, 229, 82, 0.25));
}

/* ---------- 17. STANDARD LANGUAGE PICKER ----------
   Replaces the broken header-opt-modal popup.
   The JS injects .aj-lang-dropdown inside the .header-opt_btn so it's
   anchored to the globe; click outside / ESC closes it. */
header.main-header .header-opt_btn {
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
}
header.main-header,
header.main-header .nav-holder,
header.main-header .main-menu,
header.main-header .logo-holder {
    overflow: visible !important;
}
.aj-lang-dropdown {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    min-width: 156px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.18), 0 2px 6px rgba(15, 23, 42, 0.08);
    padding: 8px;
    z-index: 100050;
    transform-origin: top right;
    animation: aj-lang-pop 200ms cubic-bezier(.2, .8, .2, 1) both;
    border: 1px solid var(--aj-border);
}
html[dir="rtl"] .aj-lang-dropdown { right: auto; left: 0; transform-origin: top left; }

.aj-lang-dropdown[hidden] { display: none !important; }

@keyframes aj-lang-pop {
    from { opacity: 0; transform: translateY(-6px) scale(.96); }
    to   { opacity: 1; transform: none; }
}

.aj-lang-dropdown::before {
    content: "";
    position: absolute;
    top: -6px;
    right: 18px;
    width: 12px;
    height: 12px;
    background: #ffffff;
    border-left: 1px solid var(--aj-border);
    border-top: 1px solid var(--aj-border);
    transform: rotate(45deg);
}
html[dir="rtl"] .aj-lang-dropdown::before { right: auto; left: 18px; }

.aj-lang-dropdown a {
    display: flex !important;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 8px;
    color: var(--aj-text);
    text-decoration: none;
    font-weight: 500;
    font-size: 13px;
    transition: background var(--aj-transition), color var(--aj-transition), transform var(--aj-transition);
}
.aj-lang-dropdown a:hover {
    background: var(--aj-primary-soft);
    color: var(--aj-primary-dark);
    transform: none;
}
html[dir="rtl"] .aj-lang-dropdown a:hover { transform: none; }

.aj-lang-dropdown a.is-current {
    background: var(--aj-primary);
    color: #ffffff;
    box-shadow: 0 4px 10px rgba(183, 205, 39, 0.3);
}
.aj-lang-dropdown a.is-current:hover {
    background: var(--aj-primary-dark);
    color: #ffffff;
}

.aj-lang-dropdown .aj-lang-code {
    display: inline-block;
    min-width: 32px;
    padding: 4px 6px;
    border-radius: 6px;
    background: var(--aj-bg-soft);
    color: var(--aj-text-muted);
    font-size: 11px;
    font-weight: 700;
    text-align: center;
    letter-spacing: 0.5px;
    transition: background var(--aj-transition), color var(--aj-transition);
}
.aj-lang-dropdown a.is-current .aj-lang-code {
    background: rgba(255, 255, 255, 0.22);
    color: #ffffff;
}
.aj-lang-dropdown .aj-lang-name { flex: 1; }
.aj-lang-dropdown .aj-lang-flag { font-size: 16px; line-height: 1; }

body.aj-dark .aj-lang-dropdown {
    background: var(--aj-bg-card);
    border-color: var(--aj-border);
}
body.aj-dark .aj-lang-dropdown::before { background: var(--aj-bg-card); }

/* The legacy header-opt-modal is hidden once our standard dropdown is active.
   Belt + suspenders: also hide its inner pieces and visibility. */
body.aj-lang-std-active .header-opt-modal,
body.aj-lang-std-active .header-opt-modal-container,
body.aj-lang-std-active .header-opt-modal-item,
body.aj-lang-std-active .header-opt-modal-list {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* ---------- 18. HOMEPAGE 3x3 CARD GRID (Isotope-compatible) ----------
   The container .grid-item-holder.gallery-items.gisp is initialized by
   Isotope which sets position:absolute + top/left on each .gallery-item.
   So we MUST NOT use CSS Grid here. Instead we just give every item
   ~33.33% width and let Isotope arrange them in 3 columns full-width. */
section .grid-item-holder.gallery-items.gisp {
    width: 100%;
    margin: 0 0 30px;
    position: relative;
}
section .grid-item-holder.gallery-items.gisp > .gallery-item {
    width: calc(33.3333% - 16px) !important;
    margin: 8px !important;
    padding: 0 !important;
    box-sizing: border-box;
}
@media (max-width: 992px) {
    section .grid-item-holder.gallery-items.gisp > .gallery-item {
        width: calc(50% - 12px) !important;
        margin: 6px !important;
    }
}
@media (max-width: 600px) {
    section .grid-item-holder.gallery-items.gisp > .gallery-item {
        width: 100% !important;
        margin: 0 0 14px !important;
    }
}

/* ============================================================
   PROPERTY CARD - MODERN, CLEAN, PROFESSIONAL
   Replaces the legacy boxy/gray look with an editorial real-estate
   feel: white card, soft shadow, big image with rounded top, refined
   chips, brand-color price, subtle icon row, lift on hover.
   ============================================================ */

/* Card shell */
.gallery-item .listing-item,
section .listing-item {
    background: transparent;
}
.gallery-item .geodir-category-listing,
.listing-item .geodir-category-listing {
    background: #ffffff !important;
    border-radius: 16px !important;
    overflow: hidden;
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.04),
        0 6px 18px rgba(15, 23, 42, 0.06);
    border: 1px solid rgba(15, 23, 42, 0.04);
    transition:
        transform 360ms cubic-bezier(.2, .8, .2, 1),
        box-shadow 360ms cubic-bezier(.2, .8, .2, 1);
    height: 100%;
    display: flex;
    flex-direction: column;
}
.gallery-item:hover .geodir-category-listing,
.listing-item:hover .geodir-category-listing {
    transform: translateY(-4px);
    box-shadow:
        0 4px 10px rgba(15, 23, 42, 0.06),
        0 18px 40px rgba(15, 23, 42, 0.10);
    border-color: rgba(183, 205, 39, 0.30);
}

/* Image area - full bleed top, no gray */
.gallery-item .geodir-category-img,
.listing-item .geodir-category-img {
    position: relative;
    overflow: hidden;
    border-radius: 0 !important;
    /* Soft warm cream while loading - never the harsh gray */
    background: linear-gradient(135deg, #fafbf5 0%, #f6f8eb 100%);
    aspect-ratio: 4 / 3;
    margin: 0 !important;
}
.gallery-item .geodir-category-img > a,
.gallery-item .geodir-category-img .geodir-category-img_item,
.listing-item .geodir-category-img > a,
.listing-item .geodir-category-img .geodir-category-img_item {
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.gallery-item .geodir-category-img img,
.listing-item .geodir-category-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block;
    transition: transform 700ms cubic-bezier(.2, .8, .2, 1);
    will-change: transform;
}
.gallery-item:hover .geodir-category-img img,
.listing-item:hover .geodir-category-img img { transform: scale(1.06); }

/* Soft gradient overlay at the bottom of the image so the white
   location text reads cleanly without darkening the whole image */
.gallery-item .geodir-category-img > .overlay,
.listing-item .geodir-category-img > .overlay,
.gallery-item .geodir-category-img a > .overlay,
.listing-item .geodir-category-img a > .overlay {
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(180deg,
        transparent 0%,
        transparent 55%,
        rgba(15, 23, 42, 0.35) 100%) !important;
    opacity: 1 !important;
    pointer-events: none;
}
/* Legacy theme sets .geodir-category-img:hover .overlay { opacity:.4 } which
   produces an unwanted gray wash on hover. Keep card hover clean. */
.gallery-item .geodir-category-img:hover .overlay,
.listing-item .geodir-category-img:hover .overlay,
.gallery-item .geodir-category-img_item:hover .overlay,
.listing-item .geodir-category-img_item:hover .overlay {
    opacity: 1 !important;
}

/* -------- List View enhancement (/Property when one-col-grid selected) -----
   The legacy script toggles .has_one_column on each .listing-item.
   We turn that state into a modern horizontal card layout. */
.listing-item.has_one_column {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 0 16px !important;
    background: transparent !important;
    border: 0 !important;
}
.listing-item.has_one_column .geodir-category-listing {
    display: grid !important;
    grid-template-columns: minmax(300px, 38%) 1fr;
    gap: 0;
    border-radius: 16px !important;
}
.listing-item.has_one_column .geodir-category-img {
    aspect-ratio: auto;
    min-height: 245px;
    height: 100%;
}
.listing-item.has_one_column .geodir-category-content {
    padding: 20px 24px !important;
}
.listing-item.has_one_column .geodir-category-content .title-sin_item,
.listing-item.has_one_column .geodir-category-content h2.title-sin_item {
    font-size: 19px !important;
    margin-bottom: 12px !important;
}
.listing-item.has_one_column .geodir-category-content_price {
    font-size: 21px !important;
    margin-bottom: 16px !important;
}
.listing-item.has_one_column .geodir-category-content-details {
    margin-top: auto !important;
    padding-top: 14px !important;
}

/* Keep action buttons on image corners in list mode too */
.listing-item.has_one_column .geodir_save-btn { bottom: 56px !important; top: auto !important; }
.listing-item.has_one_column .compare-btn     { bottom: 12px !important; top: auto !important; }

@media (max-width: 992px) {
    .listing-item.has_one_column .geodir-category-listing {
        grid-template-columns: 1fr;
    }
    .listing-item.has_one_column .geodir-category-img {
        min-height: 220px;
    }
    .listing-item.has_one_column .geodir-category-content {
        padding: 16px 18px !important;
    }
}

/* Unified list-view support for pages that toggle container class instead
   of legacy .has_one_column on each card */
.listing-item-container.aj-list-view .listing-item {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 0 16px !important;
}
.listing-item-container.aj-list-view .listing-item .geodir-category-listing {
    display: grid !important;
    grid-template-columns: minmax(300px, 38%) 1fr;
    gap: 0 !important;
    border-radius: 16px !important;
}
.listing-item-container.aj-list-view .listing-item .geodir-category-img {
    min-height: 245px !important;
    height: 100% !important;
    width: 100% !important;
    float: none !important;
}
.listing-item-container.aj-list-view .listing-item .geodir-category-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}
.listing-item-container.aj-list-view .listing-item .geodir-category-content {
    padding: 20px 24px !important;
    width: 100% !important;
    float: none !important;
}
@media (max-width: 992px) {
    .listing-item-container.aj-list-view .listing-item .geodir-category-listing {
        grid-template-columns: 1fr !important;
    }
    .listing-item-container.aj-list-view .listing-item .geodir-category-img {
        min-height: 220px !important;
    }
    .listing-item-container.aj-list-view .listing-item .geodir-category-content {
        padding: 16px 18px !important;
    }
}

/* Location pill at bottom-left of the image */
.gallery-item .geodir-category-location,
.listing-item .geodir-category-location {
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 12px;
    z-index: 3;
    color: #ffffff !important;
    font-size: 12.5px;
    font-weight: 500;
    letter-spacing: 0.2px;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}
.gallery-item .geodir-category-location b,
.listing-item .geodir-category-location b {
    font-weight: 500 !important;
    color: #ffffff !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.gallery-item .geodir-category-location i,
.listing-item .geodir-category-location i {
    color: var(--aj-primary, #b7cd27);
}

/* Category chips - top-left, modern pill style */
.gallery-item .list-single-opt_header_cat,
.listing-item .list-single-opt_header_cat {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 4;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.gallery-item .list-single-opt_header_cat li,
.listing-item .list-single-opt_header_cat li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
}
.gallery-item .list-single-opt_header_cat li a.cat-opt,
.listing-item .list-single-opt_header_cat li a.cat-opt {
    display: inline-block;
    padding: 5px 12px !important;
    border-radius: 999px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    color: #ffffff !important;
    background: rgba(15, 23, 42, 0.40) !important;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.26) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
    line-height: 1.2;
    height: auto !important;
    margin: 0 !important;
}
.gallery-item .list-single-opt_header_cat li a.cat-opt.color-bg,
.listing-item .list-single-opt_header_cat li a.cat-opt.color-bg {
    background: rgba(183, 205, 39, 0.74) !important;
    border-color: rgba(206, 229, 82, 0.82) !important;
}
.gallery-item .list-single-opt_header_cat li a.cat-opt.blue-bg,
.listing-item .list-single-opt_header_cat li a.cat-opt.blue-bg {
    background: rgba(15, 23, 42, 0.48) !important;
}

/* Save / Compare round buttons - top-right */
.gallery-item .geodir_save-btn,
.gallery-item .compare-btn,
.listing-item .geodir_save-btn,
.listing-item .compare-btn,
.gallery-item form > .geodir_save-btn,
.gallery-item form > .compare-btn {
    position: absolute !important;
    z-index: 4;
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.92) !important;
    color: #878c9f !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.10);
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    transition: transform 220ms ease, background 220ms ease, color 220ms ease;
    border: none !important;
}
.gallery-item .geodir_save-btn,
.listing-item .geodir_save-btn,
.gallery-item form .geodir_save-btn { top: auto !important; bottom: 56px !important; right: 12px !important; left: auto !important; }
.gallery-item .compare-btn,
.listing-item .compare-btn,
.gallery-item form .compare-btn       { top: auto !important; bottom: 12px !important; right: 12px !important; left: auto !important; }
html[dir="rtl"] .gallery-item .geodir_save-btn,
html[dir="rtl"] .listing-item .geodir_save-btn,
html[dir="rtl"] .gallery-item form .geodir_save-btn { right: auto !important; left: 12px !important; }
html[dir="rtl"] .gallery-item .compare-btn,
html[dir="rtl"] .listing-item .compare-btn,
html[dir="rtl"] .gallery-item form .compare-btn   { left: 12px !important; right: auto !important; }

.gallery-item .geodir_save-btn:hover,
.listing-item .geodir_save-btn:hover {
    background: #ffffff !important;
    color: #ef4444 !important;
    transform: scale(1.08);
}
.gallery-item .compare-btn:hover,
.listing-item .compare-btn:hover {
    background: #ffffff !important;
    color: var(--aj-primary, #b7cd27) !important;
    transform: scale(1.08);
}
.gallery-item .geodir_save-btn span,
.gallery-item .compare-btn span,
.listing-item .geodir_save-btn span,
.listing-item .compare-btn span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.gallery-item .geodir_save-btn i,
.gallery-item .compare-btn i,
.listing-item .geodir_save-btn i,
.listing-item .compare-btn i {
    font-size: 14px;
}

/* Content area - clean typography */
.gallery-item .geodir-category-content,
.listing-item .geodir-category-content {
    background: #ffffff !important;
    padding: 18px 20px 20px !important;
    border-top: none !important;
    flex: 1;
    display: flex;
    flex-direction: column;
}
.gallery-item .geodir-category-content .title-sin_item,
.listing-item .geodir-category-content .title-sin_item,
.gallery-item .geodir-category-content h2.title-sin_item,
.listing-item .geodir-category-content h2.title-sin_item {
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    margin: 0 0 10px !important;
    color: #878c9f !important;
    /* clamp to 2 lines so card heights match */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.7em;
}
.gallery-item .geodir-category-content .title-sin_item a,
.listing-item .geodir-category-content .title-sin_item a {
    color: #878c9f !important;
    text-decoration: none;
    transition: color 200ms ease;
}
.gallery-item .geodir-category-content .title-sin_item a:hover,
.listing-item .geodir-category-content .title-sin_item a:hover {
    color: var(--aj-primary-dark, #a7bd1b) !important;
}

/* Price - prominent, brand color, restrained */
.gallery-item .geodir-category-content_price,
.listing-item .geodir-category-content_price {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: var(--aj-primary-dark, #a7bd1b) !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    line-height: 1.2;
    letter-spacing: 0.2px;
}
.gallery-item .geodir-category-content_price a,
.listing-item .geodir-category-content_price a {
    color: var(--aj-primary-dark, #a7bd1b) !important;
    text-decoration: none;
}

/* Beds / Baths / Area - subtle icon row with thin top divider */
.gallery-item .geodir-category-content-details,
.listing-item .geodir-category-content-details {
    margin-top: auto !important;
    padding-top: 12px !important;
    border-top: 1px solid #f1f3f5 !important;
}
.gallery-item .geodir-category-content-details ul,
.listing-item .geodir-category-content-details ul {
    display: flex !important;
    align-items: center;
    gap: 18px;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
}
.gallery-item .geodir-category-content-details li,
.listing-item .geodir-category-content-details li {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    color: #64748b !important;
    font-size: 13px !important;
    font-weight: 500;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
}
.gallery-item .geodir-category-content-details i,
.listing-item .geodir-category-content-details i {
    color: var(--aj-primary, #b7cd27) !important;
    font-size: 15px !important;
}
.gallery-item .geodir-category-content-details span,
.listing-item .geodir-category-content-details span {
    color: #334155 !important;
    font-weight: 600;
}

/* Older browsers without aspect-ratio: padding-top fallback */
@supports not (aspect-ratio: 1) {
    .gallery-item .geodir-category-img,
    .listing-item .geodir-category-img {
        height: 0;
        padding-top: 75%; /* 4:3 */
    }
    .gallery-item .geodir-category-img > a,
    .listing-item .geodir-category-img > a { position: absolute; inset: 0; }
}

/* Dark mode support */
body.aj-dark .gallery-item .geodir-category-listing,
body.aj-dark .listing-item .geodir-category-listing {
    background: var(--aj-bg-card, #1e293b) !important;
    border-color: rgba(255, 255, 255, 0.06);
}
body.aj-dark .gallery-item .geodir-category-content,
body.aj-dark .listing-item .geodir-category-content {
    background: var(--aj-bg-card, #1e293b) !important;
}
body.aj-dark .gallery-item .geodir-category-content .title-sin_item a,
body.aj-dark .listing-item .geodir-category-content .title-sin_item a {
    color: #f1f5f9 !important;
}
body.aj-dark .gallery-item .geodir-category-content-details,
body.aj-dark .listing-item .geodir-category-content-details {
    border-top-color: rgba(255, 255, 255, 0.06) !important;
}
body.aj-dark .gallery-item .geodir-category-content-details li,
body.aj-dark .listing-item .geodir-category-content-details li { color: #94a3b8 !important; }
body.aj-dark .gallery-item .geodir-category-content-details span,
body.aj-dark .listing-item .geodir-category-content-details span { color: #e2e8f0 !important; }

/* Full-width, prominent "View All Properties" CTA */
.aj-view-all-wrap {
    display: block;
    width: 100%;
    max-width: 520px;       /* compact: not stretched edge-to-edge */
    margin: 18px auto 4px;
    padding: 0;
    text-align: center;
}
.aj-view-all-wrap .aj-view-all-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 44px;
    padding: 11px 24px !important;
    margin: 0 !important;
    float: none !important;
    border-radius: 10px !important;
    background: linear-gradient(135deg, var(--aj-primary) 0%, #cee552 50%, var(--aj-primary) 100%) !important;
    background-size: 200% 100% !important;
    color: #ffffff !important;
    font-size: 14.5px;
    font-weight: 600;
    letter-spacing: 0.2px;
    text-transform: none;
    box-shadow: 0 6px 16px rgba(183, 205, 39, 0.22);
    border: none !important;
    transition: transform var(--aj-transition), box-shadow var(--aj-transition), background-position var(--aj-transition);
    position: relative;
    overflow: hidden;
}
.aj-view-all-wrap .aj-view-all-btn:hover {
    transform: translateY(-2px);
    background-position: 100% 0 !important;
    box-shadow: 0 16px 36px rgba(183, 205, 39, 0.40);
}
.aj-view-all-wrap .aj-view-all-btn:active { transform: translateY(0); }

.aj-view-all-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.22);
    transition: transform var(--aj-transition), background var(--aj-transition);
    font-size: 14px;
    line-height: 1;
}
.aj-view-all-wrap .aj-view-all-btn:hover .aj-view-all-arrow {
    background: rgba(255, 255, 255, 0.4);
    transform: translateX(4px);
}
html[dir="rtl"] .aj-view-all-arrow { transform: rotate(180deg); }
html[dir="rtl"] .aj-view-all-wrap .aj-view-all-btn:hover .aj-view-all-arrow {
    transform: rotate(180deg) translateX(4px);
}

/* ---------- 19. SECTION TITLES POLISH (inspired by tenderglobal.com) ---------- */
.section-title {
    margin-bottom: 28px;
}
.section-title h1,
.section-title h2 {
    position: relative;
    display: inline-block;
    padding-bottom: 14px;
    margin-bottom: 8px;
    font-weight: 700;
    color: #144273;
    letter-spacing: -0.2px;
    line-height: 1.25;
}
.section-title h1::after,
.section-title h2::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 56px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--aj-primary), #cee552);
}
.section-title.st-center h1::after,
.section-title.st-center h2::after {
    left: 50%;
    transform: translateX(-50%);
}
html[dir="rtl"] .section-title h1::after,
html[dir="rtl"] .section-title h2::after { left: auto; right: 0; }
html[dir="rtl"] .section-title.st-center h1::after,
html[dir="rtl"] .section-title.st-center h2::after { right: 50%; transform: translateX(50%); }

.section-title h3 {
    color: var(--aj-text-muted);
    font-weight: 400;
    margin-top: 6px;
}

body.aj-dark .section-title h1,
body.aj-dark .section-title h2 { color: #f1f5f9; }

/* ---------- 20. ABOUT SECTION POLISH ---------- */
.about-wrap .about-img {
    position: relative;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 24px 48px rgba(15, 23, 42, 0.12);
    transition: transform var(--aj-transition), box-shadow var(--aj-transition);
}
.about-wrap .about-img:hover {
    transform: translateY(-4px);
    box-shadow: 0 30px 60px rgba(15, 23, 42, 0.18);
}
.about-wrap .about-img img {
    border-radius: 18px;
    transition: transform 600ms cubic-bezier(.2, .8, .2, 1);
}
.about-wrap .about-img:hover img { transform: scale(1.03); }

/* Floating logo badge inside the about image */
.about-wrap .about-img-hotifer {
    position: absolute;
    right: 20px;
    bottom: 20px;
    background: rgba(255, 255, 255, 0.95);
    padding: 14px 20px;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.18);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}
html[dir="rtl"] .about-wrap .about-img-hotifer { right: auto; left: 20px; }

.about-wrap .about-title h2 {
    font-size: 30px;
    font-weight: 700;
    color: #144273;
    margin-bottom: 14px;
    line-height: 1.25;
}
.about-wrap .about-title p {
    font-size: 15px;
    color: var(--aj-text-muted);
    line-height: 1.7;
}

/* ---------- 21. PROPERTY-TYPE CAROUSEL POLISH (Explore Realestate Types) ---------- */
.half-carousel-wrap {
    border-radius: 18px;
    overflow: hidden;
}
.half-carousel-item {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    transition: transform var(--aj-transition);
}
.half-carousel-item:hover { transform: translateY(-4px); }
.half-carousel-item .bg {
    transition: transform 800ms cubic-bezier(.2, .8, .2, 1), filter 600ms ease;
    filter: saturate(1.05);
}
.half-carousel-item:hover .bg { transform: scale(1.06); filter: saturate(1.15); }
.half-carousel-item::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,0.55) 100%);
    pointer-events: none;
    z-index: 1;
}
.half-carousel-item .half-carousel-content {
    position: absolute;
    bottom: 18px;
    left: 18px;
    right: 18px;
    z-index: 2;
}
.half-carousel-item .half-carousel-content h3 a {
    color: #fff;
    font-weight: 700;
    text-shadow: 0 2px 6px rgba(0,0,0,0.4);
}
.half-carousel-item .hc-counter {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 600;
    margin-bottom: 6px;
    box-shadow: 0 4px 12px rgba(183, 205, 39, 0.4);
}

.half-carousel-title.color-bg {
    border-radius: 0 18px 18px 0;
    background: linear-gradient(135deg, var(--aj-primary), #cee552, var(--aj-primary)) !important;
    background-size: 200% 100% !important;
    animation: aj-shine 8s ease-in-out infinite;
}
html[dir="rtl"] .half-carousel-title.color-bg { border-radius: 18px 0 0 18px; }
@keyframes aj-shine {
    0%, 100% { background-position: 0% 50%; }
    50%      { background-position: 100% 50%; }
}

/* ---------- 22. AGENT CARDS POLISH ---------- */
section#Agent .listing-item {
    border-radius: 16px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08);
    transition: transform var(--aj-transition), box-shadow var(--aj-transition);
}
section#Agent .listing-item:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
}
section#Agent .geodir-category-img.agent_card { padding: 8px; }
section#Agent .geodir-category-img.agent_card img {
    border-radius: 12px;
    transition: transform 600ms cubic-bezier(.2, .8, .2, 1), filter 300ms ease;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}
section#Agent .listing-item:hover .geodir-category-img.agent_card img {
    transform: scale(1.04);
    filter: saturate(1.08);
}
section#Agent .agent_card-title {
    padding: 6px 12px 14px;
    text-align: center;
}
section#Agent .agent_card-title h3 a {
    color: #144273;
    font-weight: 700;
    font-size: 16px;
}
section#Agent .agent_card-title h4 a {
    color: var(--aj-text-muted);
    font-weight: 500;
    font-size: 13px;
}

body.aj-dark section#Agent .listing-item { background: var(--aj-bg-card); }
body.aj-dark section#Agent .agent_card-title h3 a { color: #f1f5f9; }

/* ---------- 23. APPRAISAL CTA SECTION POLISH ---------- */
.single-par2 {
    position: relative;
}
.single-par2 .bg-wrap.bg-parallax-wrap-gradien::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        radial-gradient(circle at 30% 30%, rgba(183, 205, 39, 0.25), transparent 45%),
        linear-gradient(180deg, rgba(15, 23, 42, 0.55), rgba(15, 23, 42, 0.75));
    z-index: 1;
}
.single-par2 .container { position: relative; z-index: 3; }
.single-par2 .section-title h2 span {
    color: #ffffff;
    font-size: 36px;
    font-weight: 800;
    text-shadow: 0 2px 8px rgba(0,0,0,0.4);
}
.single-par2 .section-title h3 {
    color: #f1f5f9;
    font-weight: 400;
    font-size: 16px;
    margin-bottom: 22px;
    text-shadow: 0 1px 4px rgba(0,0,0,0.3);
}
.single-par2 .btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 32px !important;
    font-size: 15px;
    font-weight: 600;
    border-radius: 999px !important;
    background: linear-gradient(135deg, var(--aj-primary), #cee552) !important;
    box-shadow: 0 10px 26px rgba(183, 205, 39, 0.45);
    transition: transform var(--aj-transition), box-shadow var(--aj-transition);
}
.single-par2 .btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 36px rgba(183, 205, 39, 0.55);
}

/* ---------- 24. TESTIMONIALS POLISH ---------- */
.testimonials-slider .text-carousel-item {
    background: #ffffff;
    border-radius: 16px;
    padding: 32px 28px 26px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
    position: relative;
    transition: transform var(--aj-transition), box-shadow var(--aj-transition);
    margin: 12px;
}
.testimonials-slider .text-carousel-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14);
}
.testimonials-slider .text-carousel-item::before {
    content: "\201C";   /* opening quote mark */
    position: absolute;
    top: 6px;
    right: 18px;
    font-family: Georgia, serif;
    font-size: 80px;
    line-height: 1;
    color: var(--aj-primary-soft);
    font-weight: 700;
    pointer-events: none;
}
html[dir="rtl"] .testimonials-slider .text-carousel-item::before { right: auto; left: 18px; }
.testimonials-slider .popup-avatar img {
    border-radius: 50%;
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.15);
    border: 3px solid #ffffff;
    width: 76px !important;
    height: 76px !important;
    object-fit: cover;
}
.testimonials-slider .review-owner {
    margin-top: 10px;
    font-weight: 700;
    color: #144273;
    font-size: 15px;
}
body.aj-dark .testimonials-slider .text-carousel-item { background: var(--aj-bg-card); }
body.aj-dark .testimonials-slider .review-owner { color: #f1f5f9; }

/* ---------- 25. CREATIVE LOADER (light, modern, FAST) ----------
   Light cream background with the brand olive green.
   Total wall time before the site fades it out: ~1.0-1.2s.
   Hidden on subsequent navigations in the same tab session. */
.loader-wrap.aj-brand-loader {
    background:
        radial-gradient(circle at 30% 30%, rgba(183, 205, 39, 0.10), transparent 55%),
        radial-gradient(circle at 70% 70%, rgba(183, 205, 39, 0.06), transparent 60%),
        #fafbf5 !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: fixed;
    inset: 0;
    overflow: hidden;
    z-index: 99999;
}
/* Explicit hidden state so JS can take it out of the flow.
   Using a class beats inline style precedence vs. legacy theme rules. */
.loader-wrap.aj-brand-loader.aj-loader-hidden,
.loader-wrap.aj-brand-loader[hidden] {
    display: none !important;
    pointer-events: none !important;
}
.loader-wrap.aj-brand-loader .loader-inner { display: none !important; }

/* Soft white shapes (parallax-style) - simple, calm, no spinning.
   They sit BEHIND the logo / texts (z-index 0) so the brand stays focused. */
.aj-loader-shape {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
    opacity: 0;
    animation: aj-loader-shape-in 380ms 60ms ease-out forwards;
}
.aj-loader-shape-1 {
    top: -140px;
    right: -120px;
    width: 360px;
    height: 360px;
    background: radial-gradient(circle, #ffffff 0%, rgba(255, 255, 255, 0.6) 45%, transparent 75%);
    box-shadow: 0 0 60px rgba(183, 205, 39, 0.10);
}
.aj-loader-shape-2 {
    bottom: -120px;
    left: -100px;
    width: 320px;
    height: 320px;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.85) 0%, rgba(255, 255, 255, 0.45) 50%, transparent 75%);
}
.aj-loader-shape-3 {
    top: 50%;
    left: 50%;
    width: 480px;
    height: 480px;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, transparent 55%, rgba(255, 255, 255, 0.55) 60%, transparent 65%);
    border-radius: 50%;
    animation-delay: 120ms;
}
@keyframes aj-loader-shape-in {
    from { opacity: 0; transform: translate(0, 12px) scale(0.96); }
    to   { opacity: 1; transform: translate(0, 0)     scale(1);    }
}
.aj-loader-shape-3 {
    animation-name: aj-loader-shape-in-center;
}
@keyframes aj-loader-shape-in-center {
    from { opacity: 0; transform: translate(-50%, -50%) scale(0.92); }
    to   { opacity: 1; transform: translate(-50%, -50%) scale(1);    }
}
/* Mirror RTL so shapes still feel balanced */
html[dir="rtl"] .aj-loader-shape-1 { right: auto; left: -120px; }
html[dir="rtl"] .aj-loader-shape-2 { left: auto;  right: -100px; }
/* Make sure all loader content sits above the shapes */
.loader-wrap.aj-brand-loader > .aj-brand-loader-stage,
.loader-wrap.aj-brand-loader > .aj-brand-loader-name,
.loader-wrap.aj-brand-loader > .aj-brand-loader-since,
.loader-wrap.aj-brand-loader > .aj-brand-loader-bar {
    position: relative;
    z-index: 1;
}

/* Logo stage - centered, no ring (the logo IS the brand) */
.aj-brand-loader-stage {
    position: relative;
    width: 96px;
    height: 96px;
    margin-bottom: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* Larger stage variant used when the loader contains ONLY the logo */
.aj-brand-loader-stage-lg {
    width: auto;
    height: auto;
    max-width: 280px;
    margin-bottom: 18px;
}
.aj-brand-loader-stage-lg::before { display: none; }
.aj-brand-loader-logo-lg {
    width: 240px;
    max-width: 65vw;
    height: auto;
    animation: aj-loader-pulse 1100ms ease-in-out infinite;
}
.aj-brand-loader-stage::before {
    content: "";
    position: absolute;
    inset: -6px;
    border: 3px solid rgba(183, 205, 39, 0.18);
    border-top-color: var(--aj-primary);
    border-right-color: var(--aj-primary-dark);
    border-radius: 50%;
    animation: aj-loader-spin 700ms linear infinite;
}
@keyframes aj-loader-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

.aj-brand-loader-logo {
    width: 70px;
    height: auto;
    filter: drop-shadow(0 2px 6px rgba(15, 23, 42, 0.10));
    animation: aj-loader-pulse 1100ms ease-in-out infinite;
}
@keyframes aj-loader-pulse {
    0%, 100% { transform: scale(0.96); opacity: 0.92; }
    50%      { transform: scale(1.04); opacity: 1; }
}

/* ---- Brand name lines ---- */
.aj-brand-loader-name {
    color: #1f2a0f;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
    opacity: 0;
    animation: aj-loader-tagline 700ms 80ms ease-out forwards;
}
.aj-brand-loader-name-en {
    font-size: 16px;
    letter-spacing: 0.5px;
    margin-top: 4px;
}
.aj-brand-loader-name-ar {
    font-size: 17px;
    color: #2a3614;
    margin-top: 2px;
    margin-bottom: 8px;
    font-family: "Tajawal", "Cairo", sans-serif;
    animation-delay: 140ms;
}
/* In Arabic UI hide the EN name; in any other UI hide the AR name. */
html[lang^="ar"] .aj-brand-loader-name-en,
html[dir="rtl"]  .aj-brand-loader-name-en { display: none; }
html:not([lang^="ar"]):not([dir="rtl"]) .aj-brand-loader-name-ar { display: none; }

/* ---- "Since 1950" small chip ---- */
.aj-brand-loader-since {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--aj-primary-dark, #a7bd1b);
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 4px;
    margin: 4px 0 14px;
    opacity: 0;
    animation: aj-loader-tagline 700ms 220ms ease-out forwards;
}
.aj-since-line {
    width: 28px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--aj-primary, #b7cd27));
}
.aj-brand-loader-since .aj-since-line:last-child {
    background: linear-gradient(90deg, var(--aj-primary, #b7cd27), transparent);
}
.aj-brand-loader-since .aj-since-text {
    color: #5a6b1f;
}

/* Legacy single-line tagline (kept for back-compat) */
.aj-brand-loader-tagline {
    color: #5a6b1f;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 14px;
    opacity: 0;
    animation: aj-loader-tagline 700ms 100ms ease-out forwards;
}
@keyframes aj-loader-tagline {
    from { opacity: 0; transform: translateY(4px); }
    to   { opacity: 0.9; transform: translateY(0); }
}

.aj-brand-loader-bar {
    position: relative;
    width: 140px;
    height: 2px;
    background: rgba(183, 205, 39, 0.16);
    border-radius: 999px;
    overflow: hidden;
}
.aj-brand-loader-bar::before {
    content: "";
    position: absolute;
    top: 0;
    left: -40%;
    height: 100%;
    width: 40%;
    background: linear-gradient(90deg, transparent, var(--aj-primary), var(--aj-primary-dark), transparent);
    animation: aj-loader-bar 700ms cubic-bezier(.5, 0, .5, 1) infinite;
}
@keyframes aj-loader-bar {
    0%   { left: -40%; }
    100% { left: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .aj-brand-loader-stage::before,
    .aj-brand-loader-logo,
    .aj-brand-loader-tagline,
    .aj-brand-loader-name,
    .aj-brand-loader-since,
    .aj-brand-loader-bar::before {
        animation: none !important;
    }
    .aj-brand-loader-tagline,
    .aj-brand-loader-name,
    .aj-brand-loader-since { opacity: 1; }
}

/* ---------- 25b. FOOTER BRAND BLOCK ----------
   The new logo already contains the bilingual brand name + "EST 1950",
   so we just show the logo - light, no shadow, clean. */
.aj-footer-brand {
    display: inline-block;

    padding: 12px 16px;
    border: 0;
    border-radius: 12px;
    box-shadow: none;
    margin: 0 0 14px;
}
.aj-footer-brand img {
    max-width: 180px;
    width: 100%;
    height: auto;
    display: block;
    box-shadow: none !important;
    filter: none !important;
    opacity: 1;
}
footer.main-footer .footer-widget-logo.aj-footer-brand {
    margin-inline: auto 0;
}
html[dir="rtl"] footer.main-footer .footer-widget-logo.aj-footer-brand {
    margin-inline: 0 auto;
}

/* ---------- 25c. HEADER LOGO COMPACT (inline with nav) ---------- */
header.main-header .logo-holder {
    position: relative;
    z-index: 40;
    margin-top: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    top: 12px !important;
    height: auto !important;
}
header.main-header .logo-holder img {
    transition: transform 0.2s ease !important;
    filter: none !important;
    max-height: 48px !important;
    height: 48px !important;
    width: auto !important;
    display: block;
    background: transparent !important;
    padding: 0 !important;
    border-radius: 4px;
}
header.main-header .logo-holder a:hover img {
    transform: scale(1.04) !important;
    filter: none !important;
}
@media (max-width: 992px) {
    header.main-header .logo-holder {
        top: 10px !important;
    }
    header.main-header .logo-holder img { max-height: 42px !important; height: 42px !important; }
}
@media (max-width: 600px) {
    header.main-header .logo-holder {
        top: 8px !important;
    }
    header.main-header .logo-holder img { max-height: 36px !important; height: 36px !important; }
}

/* ---------- 25d. NAV "HOME" with leading icon ---------- */
.aj-nav-home {
    display: inline-flex !important;
    align-items: center;
    gap: 7px;
}
.aj-nav-icon {
    color: var(--aj-primary, #b7cd27);
    font-size: 0.95em;
    line-height: 1;
    transition: transform 200ms ease, color 200ms ease;
}
.aj-nav-home:hover .aj-nav-icon {
    color: var(--aj-primary-dark, #a7bd1b);
    transform: translateY(-1px);
}

/* ---------- 25f. PROPERTY LISTING - RESULTS HEADER ----------
   Clean modern label/count panel above the property grid on /Property. */
.aj-results-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    background: transparent;
    border: 0;
    border-bottom: 1px solid rgba(15, 23, 42, 0.10);
    border-radius: 0;
    padding: 0 0 14px;
    margin: 0 0 16px;
    box-shadow: none;
    flex-wrap: wrap;
}
/* ensure no duplicate legacy title strip is shown */
.aj-results-header + .list-main-wrap-header {
    display: none !important;
}
.aj-results-header-left { flex: 1 1 320px; min-width: 0; }
.aj-results-eyebrow {
    display: none;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: var(--aj-primary-dark, #a7bd1b);
    margin-bottom: 4px;
}
.aj-results-title {
    margin: 0 !important;
    font-size: 30px !important;
    font-weight: 700 !important;
    color: #878c9f !important;
    line-height: 1.25;
    letter-spacing: 0;
}
.aj-results-sub {
    margin: 4px 0 0 !important;
    color: #64748b;
    font-size: 13.5px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.aj-results-count strong {
    color: #878c9f;
    font-weight: 700;
    margin-right: 4px;
}
.aj-results-page { color: #94a3b8; }

.aj-results-viewtoggle ul {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
    border-radius: 10px;
    padding: 4px;
}
.aj-results-viewtoggle li { margin: 0 !important; padding: 0 !important; list-style: none; }
.aj-results-viewtoggle span {
    display: inline-flex;
    width: 36px;
    height: 32px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    cursor: pointer;
    color: #64748b;
    transition: background 200ms ease, color 200ms ease;
}


@media (max-width: 600px) {
    .aj-results-header { padding: 0 0 12px; }
    .aj-results-title { font-size: 24px !important; }
}

body.aj-dark .aj-results-header { background: transparent; border-color: rgba(255, 255, 255, 0.12); }
body.aj-dark .aj-results-title  { color: #f1f5f9 !important; }
body.aj-dark .aj-results-sub    { color: #94a3b8; }
body.aj-dark .aj-results-count strong { color: #e2e8f0; }
body.aj-dark .aj-results-viewtoggle ul { background: rgba(255, 255, 255, 0.05); }
body.aj-dark .aj-results-viewtoggle span.act-grid-opt { background: var(--aj-bg, #878c9f); }

/* ---------- 25g. HOMEPAGE APPRAISAL CTA ENHANCEMENT ----------
   Lift the existing .single-par2 "Real estate Appraising Services" section:
   bigger title, gold-stamp accent line, refined CTA, decorative numbers. */
.single-par2 .section-title { position: relative; z-index: 5; }
.single-par2 .section-title h2 {
    font-size: clamp(28px, 4vw, 44px) !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    color: #ffffff !important;
    margin-bottom: 10px !important;
    letter-spacing: -0.4px;
    text-shadow: 0 4px 24px rgba(0, 0, 0, 0.25);
}
.single-par2 .section-title h2 span {
    background: linear-gradient(120deg, #ffffff 0%, #cee552 60%, #ffffff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
            background-clip: text;
                    color: transparent;
}
.single-par2 .section-title h3 {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: rgba(255, 255, 255, 0.86) !important;
    margin: 0 auto 22px !important;
    max-width: 620px;
    line-height: 1.6 !important;
    letter-spacing: 0.2px;
}
/* Pre-title eyebrow injected via CSS pseudo so we don't change the markup */
.single-par2 .section-title::before {
    content: "EST 1950 \00B7 CERTIFIED APPRAISERS";
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 4px;
    color: #cee552;
    margin-bottom: 14px;
    padding: 6px 14px;
    background: rgba(183, 205, 39, 0.15);
    border: 1px solid rgba(183, 205, 39, 0.45);
    border-radius: 999px;
}
html[lang^="ar"] .single-par2 .section-title::before {
    content: "\062E\0628\0631\0627\0621 \0645\0639\062A\0645\062F\0648\0646  \00B7  \0645\0646\0630 1950";
    /* "خبراء معتمدون · منذ 1950" */
}

/* Refined CTA button - bigger, gradient, with arrow */
.single-par2 .section-title a.btn,
.single-par2 a.btn.color-bg {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    padding: 14px 32px !important;
    border-radius: 999px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: 0.4px;
    background: linear-gradient(135deg, var(--aj-primary, #b7cd27) 0%, #cee552 100%) !important;
    color: #878c9f !important;
    border: none !important;
    box-shadow:
        0 8px 22px rgba(183, 205, 39, 0.40),
        0 0 0 0 rgba(255, 255, 255, 0);
    transition: transform 250ms ease, box-shadow 250ms ease, background 250ms ease;
    position: relative;
    overflow: hidden;
}
.single-par2 .section-title a.btn::after,
.single-par2 a.btn.color-bg::after {
    content: "\2192";   /* → */
    font-size: 16px;
    transition: transform 250ms ease;
}
html[dir="rtl"] .single-par2 .section-title a.btn::after,
html[dir="rtl"] .single-par2 a.btn.color-bg::after { content: "\2190"; }
.single-par2 .section-title a.btn:hover,
.single-par2 a.btn.color-bg:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 30px rgba(183, 205, 39, 0.55);
    color: #878c9f !important;
}
.single-par2 .section-title a.btn:hover::after,
.single-par2 a.btn.color-bg:hover::after { transform: translateX(4px); }
html[dir="rtl"] .single-par2 .section-title a.btn:hover::after,
html[dir="rtl"] .single-par2 a.btn.color-bg:hover::after { transform: translateX(-4px); }

/* Add three "value props" beneath the CTA via CSS counter pseudo */
.single-par2 .section-title::after {
    content: "";
    display: block;
    height: 1px;
    width: 80px;
    margin: 18px auto 0;
    background: linear-gradient(90deg, transparent, rgba(206, 229, 82, 0.6), transparent);
}

/* ---------- 25e. HIDE ANY LEFTOVER THEME TOGGLE ----------
   Per request: dark/light mode toggle removed from the UI. */
.aj-theme-toggle,
.aj-header-toggle,
button.aj-theme-toggle,
button.aj-header-toggle {
    display: none !important;
}

/* ---------- 26. UNIVERSAL IMAGE FALLBACK ----------
   Applied to ALL <img> elements via JS.
   When an image 404s or its src is empty, we swap it with a clean
   light-gray placeholder. */
img.aj-img-fallback,
img[data-aj-fallback="1"] {
    background: #eef0f3 url("/Content/SiteEn/images/aj-placeholder.png") center / 50% no-repeat;
    object-fit: cover;
    color: transparent;
    min-height: 80px;
}
/* While an image is still loading, give it a soft grey background so we never
   see the broken-image icon flash, even before our JS attaches. */
img:not([src]),
img[src=""],
img[src*="undefined"],
img[src*="null"] {
    background: #eef0f3 url("/Content/SiteEn/images/aj-placeholder.png") center / 50% no-repeat;
    color: transparent;
    min-height: 80px;
}
/* Subtle fade-in when the real image swaps to placeholder */
img.aj-img-fallback {
    animation: aj-img-fade 320ms ease both;
}
@keyframes aj-img-fade {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* For CSS background-image hosts (e.g. .bg with data-bg) we add this class
   when the underlying URL fails. */
.aj-bg-fallback {
    background-image: url("/Content/SiteEn/images/aj-placeholder.png") !important;
    background-color: #eef0f3 !important;
    background-size: 240px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

/* When an <img> is currently showing the placeholder PNG itself
   (either set inline via onerror, or by aj-img-fallback JS), display it
   contained inside a light-gray frame instead of cover-cropping. This
   keeps the centered icon crisp and avoids ugly stretching across any
   card / hero / tile size. */
img[src$="/aj-placeholder.png"],
img.aj-img-fallback[src$="/aj-placeholder.png"] {
    object-fit: contain !important;
    background-color: #eef0f3 !important;
    background-image: none !important;
    padding: 0 !important;
}
img[src$="/aj-placeholder.png"]:hover,
img.aj-img-fallback[src$="/aj-placeholder.png"]:hover {
    background-color: #e6e9ee !important;
    transform: none !important;
}

/* ---------- 27a. HALF-CAROUSEL UNIFIED LOOK ----------
   All slides share one image (set via JS) + a brand-olive duotone overlay
   so the carousel reads as a cohesive family rather than a random grid. */
.aj-hc-wrap .half-carousel-item .bg-wrap.bg-parallax-wrap-gradien::after,
.aj-hc-wrap .half-carousel-item .bg-wrap.bg-parallax-wrap-gradien::before {
    /* keep existing dark-vignette overlay from theme */
}
.aj-hc-wrap .half-carousel-item .bg.aj-hc-unified {
    /* gentle zoom-in on hover for life */
    transition: transform 0.9s ease, filter 0.6s ease;
    filter: saturate(0.85) contrast(1.02);
}
.aj-hc-wrap .half-carousel-item:hover .bg.aj-hc-unified {
    transform: scale(1.06);
    filter: saturate(1.05) contrast(1.06);
}
/* The brand duotone: a translucent olive-green wash on every tile so
   different lighting in source images disappears and the row feels uniform. */
.aj-hc-wrap .half-carousel-item .bg-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(160deg,
            rgba(13, 28, 12, 0.55)   0%,
            rgba(36, 54, 14, 0.40)  45%,
            rgba(183, 205, 39, 0.28) 100%);
    z-index: 1;
    pointer-events: none;
    mix-blend-mode: multiply;
}
/* Make sure the title chip + counter stay fully readable above the wash */
.aj-hc-wrap .half-carousel-item .half-carousel-content {
    z-index: 3;
}
.aj-hc-wrap .half-carousel-item .hc-counter {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
}
/* Soft brand outline appears on hover */
.aj-hc-wrap .half-carousel-item {
    border-radius: 12px;
    overflow: hidden;
    transition: box-shadow 0.35s ease;
}
.aj-hc-wrap .half-carousel-item:hover {
    box-shadow: 0 16px 40px rgba(183, 205, 39, 0.28);
}

/* ---------- 27. PARALLAX SECTION DECORATIVE SHAPES ----------
   Adds floating brand-color geometric shapes to .single-par, .single-par2,
   and any element with .aj-parallax-shapes (we tag candidates from JS).
   All shapes are pointer-events:none so they don't interfere with clicks. */
.single-par2,
.single-par,
.parallax-section,
.aj-parallax-shapes {
    position: relative;
    overflow: hidden;
}

/* Big radial orb - top right */
.single-par2::before,
.single-par::before,
.aj-parallax-shapes::before {
    content: "";
    position: absolute;
    top: -120px;
    right: -120px;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    background:
        radial-gradient(circle, rgba(183, 205, 39, 0.30) 0%, rgba(183, 205, 39, 0.10) 45%, transparent 70%);
    z-index: 2;
    pointer-events: none;
    animation: aj-shape-float-a 14s ease-in-out infinite;
    filter: blur(2px);
}
html[dir="rtl"] .single-par2::before,
html[dir="rtl"] .single-par::before,
html[dir="rtl"] .aj-parallax-shapes::before {
    right: auto;
    left: -120px;
}

/* Hollow ring - bottom left */
.single-par2::after,
.single-par::after,
.aj-parallax-shapes::after {
    content: "";
    position: absolute;
    bottom: -100px;
    left: 6%;
    width: 260px;
    height: 260px;
    border: 2px solid rgba(183, 205, 39, 0.40);
    border-radius: 50%;
    z-index: 2;
    pointer-events: none;
    animation: aj-shape-float-b 18s ease-in-out infinite;
    background: radial-gradient(circle, transparent 62%, rgba(183, 205, 39, 0.05) 100%);
}
html[dir="rtl"] .single-par2::after,
html[dir="rtl"] .single-par::after,
html[dir="rtl"] .aj-parallax-shapes::after {
    left: auto;
    right: 6%;
}

/* Extra mid-band rotating diamonds + dot grid via inline SVG container */
.aj-parallax-deco {
    position: absolute;
    z-index: 2;
    pointer-events: none;
    color: rgba(183, 205, 39, 0.35);
}
.aj-parallax-deco-tl { top: 8%;  left: 6%;  width: 80px;  height: 80px; animation: aj-shape-spin 22s linear infinite; }
.aj-parallax-deco-br { bottom: 12%; right: 8%; width: 110px; height: 110px; animation: aj-shape-spin 28s linear infinite reverse; }
html[dir="rtl"] .aj-parallax-deco-tl { left: auto; right: 6%; }
html[dir="rtl"] .aj-parallax-deco-br { right: auto; left: 8%; }

@keyframes aj-shape-float-a {
    0%,   100% { transform: translate(0, 0)        scale(1);   }
    33%        { transform: translate(-22px, 18px) scale(1.06); }
    66%        { transform: translate(14px, -14px) scale(0.96); }
}
@keyframes aj-shape-float-b {
    0%,   100% { transform: translate(0, 0)        rotate(0deg);   }
    50%        { transform: translate(18px, -18px) rotate(35deg);  }
}
@keyframes aj-shape-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* Make sure the section contents render ABOVE the shapes */
.single-par2 .container,
.single-par .container,
.aj-parallax-shapes > .container {
    position: relative;
    z-index: 5;
}

/* The dark gradient overlay defined in section 23 must sit BELOW the shapes
   (z-index already 1 there, shapes are 2 - good). */

@media (prefers-reduced-motion: reduce) {
    .single-par2::before, .single-par2::after,
    .single-par::before,  .single-par::after,
    .aj-parallax-shapes::before, .aj-parallax-shapes::after,
    .aj-parallax-deco { animation: none !important; }
}

/* ---------- 28. PRINT + A11Y ---------- */
@media print {
    .main-header, footer, .header-modal, .scroll-nav-wrap, .listing-carousel-wrapper,
    .breadcrumbs, .aj-theme-toggle, .aj-header-toggle, .aj-progress,
    .aj-loadmore-wrap, .aj-lang-dropdown, .aj-view-all-wrap,
    .loader-wrap, .compare-top-btn, .like-btn, .share-holder { display: none !important; }
    body { background: #ffffff !important; color: #000000 !important; }
    .gallery-items { page-break-inside: avoid; }
    .list-single-main-wrapper { box-shadow: none !important; }
}

a:focus-visible, button:focus-visible, [role="button"]:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 3px solid var(--aj-primary);
    outline-offset: 2px;
    border-radius: 4px;
}

/* ============================================================================
   29. PROPERTY LISTING GRID (aj-listing-grid)
   ----------------------------------------------------------------------------
   Replaces the legacy vertical stack on /Property and similar listings with
   a proper responsive grid (CSS Grid).

   Equivalent of MUI <Grid container spacing={3}> with Card / CardMedia /
   CardContent layout, rendered with the existing .geodir-* markup so
   no controller/JS logic changes are required.

     - 1 column on mobile, 2 columns on tablet+ (>= 768px)
     - Equal-height cards (display: flex; height: 100%)
     - Pagination spans the whole row at the bottom
     - Image is a strict 4:3 CardMedia with object-fit: cover
     - Missing/broken image -> graceful fallback (no broken-image icon)
     - RTL-safe (mirrors content direction; nothing pinned with left/right
       inside the content area)
   ============================================================================ */

.listing-item-container.aj-listing-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    align-items: stretch;
    padding: 0 !important;
    margin: 0 0 24px !important;
    background: transparent !important;
    border: 0 !important;
}
@media (min-width: 768px) {
    .listing-item-container.aj-listing-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 28px;
    }
}
@media (min-width: 1400px) {
    .listing-item-container.aj-listing-grid {
        gap: 32px;
    }
}

/* Pagination row spans full width at the bottom of the grid */
.listing-item-container.aj-listing-grid > .pagination,
.listing-item-container.aj-listing-grid > nav,
.listing-item-container.aj-listing-grid > .PagedList-pager {
    grid-column: 1 / -1;
    justify-self: center;
    margin-top: 8px;
}

/* Each grid cell stretches; the inner article fills it -> equal heights */
.listing-item-container.aj-listing-grid > .listing-item {
    display: flex;
    width: 100% !important;
    height: 100%;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}
.listing-item-container.aj-listing-grid > .listing-item > .geodir-category-listing {
    display: flex !important;
    flex-direction: column;
    width: 100%;
    height: 100%;
    border-radius: var(--aj-radius, 12px);
    overflow: hidden;
    background: var(--aj-bg-card, #ffffff);
    box-shadow: var(--aj-shadow, 0 4px 12px rgba(15, 23, 42, 0.06));
    border: 1px solid var(--aj-border, #e5e7eb);
    transition: transform var(--aj-transition, 280ms ease),
                box-shadow var(--aj-transition, 280ms ease);
}
.listing-item-container.aj-listing-grid > .listing-item > .geodir-category-listing:hover {
    transform: translateY(-3px);
    box-shadow: var(--aj-shadow-hover, 0 12px 28px rgba(15, 23, 42, 0.14));
}

/* CardMedia (image area) - fixed 4:3 ratio, no inline height overrides */
.listing-item-container.aj-listing-grid .geodir-category-img {
    flex: 0 0 auto;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    position: relative;
}
.listing-item-container.aj-listing-grid .geodir-category-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block;
}

/* CardMedia fallback - shown when item.Image is null/empty OR onerror fires */
.listing-item-container.aj-listing-grid .geodir-category-img.aj-card-media--empty {
    background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
}
.listing-item-container.aj-listing-grid .geodir-category-img.aj-card-media--empty img {
    display: none !important;
}
.listing-item-container.aj-listing-grid .aj-card-media-fallback {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: rgba(15, 23, 42, 0.18);
    font-size: 64px;
    text-decoration: none;
}
.listing-item-container.aj-listing-grid .geodir-category-img:not(.aj-card-media--empty) .aj-card-media-fallback {
    display: none !important;
}

/* CardContent - flex column, pushes the bed/bath/area row to the bottom
   so titles of varying length never make cards uneven */
.listing-item-container.aj-listing-grid .geodir-category-content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    padding: 20px 22px !important;
    background: var(--aj-bg-card, #ffffff);
}
.listing-item-container.aj-listing-grid .geodir-category-content .title-sin_item {
    margin: 0 0 10px !important;
    min-height: 2.6em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.listing-item-container.aj-listing-grid .geodir-category-content .geodir-category-content_price {
    margin-bottom: 14px !important;
}
.listing-item-container.aj-listing-grid .geodir-category-content-details {
    margin-top: auto !important;
    padding-top: 14px !important;
    border-top: 1px solid var(--aj-border, #e5e7eb);
}

/* Location pill on the image - readable on both light + dark backgrounds */
.listing-item-container.aj-listing-grid .geodir-category-location b {
    color: #ffffff !important;
}

/* RTL support - the grid is symmetrical; we just normalise the content
   alignment, since some legacy inline styles assume LTR. */
html[dir="rtl"] .listing-item-container.aj-listing-grid .geodir-category-content,
[dir="rtl"] .listing-item-container.aj-listing-grid .geodir-category-content {
    text-align: right;
}
html[dir="rtl"] .listing-item-container.aj-listing-grid .geodir-category-content-details ul,
[dir="rtl"] .listing-item-container.aj-listing-grid .geodir-category-content-details ul {
    padding-right: 0;
}

/* List-view (one column) override stays compatible with this grid */
.listing-item-container.aj-listing-grid > .listing-item.has_one_column {
    grid-column: 1 / -1;
}

/* Smaller phones - tighten paddings */
@media (max-width: 480px) {
    .listing-item-container.aj-listing-grid {
        gap: 18px;
    }
    .listing-item-container.aj-listing-grid .geodir-category-content {
        padding: 16px 16px !important;
    }
}

/* Dark mode tokens already defined in section 1 cascade naturally */
body.aj-dark .listing-item-container.aj-listing-grid > .listing-item > .geodir-category-listing {
    background: var(--aj-bg-card) !important;
    border-color: rgba(255, 255, 255, 0.06);
}
body.aj-dark .listing-item-container.aj-listing-grid .geodir-category-content {
    background: var(--aj-bg-card) !important;
}
body.aj-dark .listing-item-container.aj-listing-grid .geodir-category-img.aj-card-media--empty {
    background: linear-gradient(135deg, #1e293b 0%, #878c9f 100%);
}
body.aj-dark .listing-item-container.aj-listing-grid .aj-card-media-fallback {
    color: rgba(241, 245, 249, 0.18);
}

/* ============================================================================
   30. SCROLL-NAV + SECONDARY-NAV restoration
   ----------------------------------------------------------------------------
   The legacy theme stylesheet hides BOTH panels with:
       @media (max-width: 1070px) { .scroll-nav, .secondary-nav { display:none } }
   That breakpoint is too aggressive (covers most laptops). We restore them
   from 768px upwards (tablet + desktop) and only hide them on real phones.

   Also: legacy CSS pins .scroll-nav-wrap / .scroll-nav with `left: 0`, which
   in RTL pages places the panel on the wrong side of the content column.
   We mirror the position in RTL.
   ============================================================================ */

/* Restore visibility on tablet/laptop (>= 768px). Phones still get them
   hidden by the legacy rule, which is the right behaviour. */
@media (min-width: 768px) {
    .scroll-nav,
    .secondary-nav {
        display: block !important;
    }
}

/* RTL mirror for the section scroll nav on /Property/Details
   (and any other page that uses .scroll-nav-wrap). */
html[dir="rtl"] .scroll-nav-wrap,
html[dir="rtl"] .scroll-nav,
[dir="rtl"] .scroll-nav-wrap,
[dir="rtl"] .scroll-nav {
    left: auto !important;
    right: 0 !important;
}
html[dir="rtl"] .scroll-nav li span,
[dir="rtl"] .scroll-nav li span {
    left: auto !important;
    right: 100%;
    border-radius: 4px 0 0 4px;
}

/* secondary-nav floats at the right edge in LTR. In RTL it should float
   at the left edge. The legacy CSS uses `right: -120px` (hidden) and
   `vis_secnav { right: 0 }` (visible). Mirror to left in RTL. */
html[dir="rtl"] .secondary-nav,
[dir="rtl"] .secondary-nav {
    right: auto !important;
    left: -120px !important;
    border-right: 1px solid #eee !important;
    border-left: none !important;
    border-radius: 0 6px 6px 0 !important;
}
html[dir="rtl"] .secondary-nav.vis_secnav,
[dir="rtl"] .secondary-nav.vis_secnav {
    right: auto !important;
    left: 0 !important;
}
html[dir="rtl"] .secondary-nav .tolt[data-microtip-position="left"],
[dir="rtl"] .secondary-nav .tolt[data-microtip-position="left"] {
    /* swap the microtip tooltip side so it doesn't render off-screen */
    direction: ltr;
}

/* Make the scroll-nav active (act-scrlink) item use the brand colour
   so it's clearly visible against the white panel. */
.scroll-nav li a.act-scrlink {
    background: var(--aj-primary, #b7cd27) !important;
    color: #ffffff !important;
}

/* Subtle hover for non-active items */
.scroll-nav li a:hover {
    color: var(--aj-primary, #b7cd27);
    background: rgba(183, 205, 39, 0.08);
}
.secondary-nav li a:hover {
    color: var(--aj-primary, #b7cd27);
    background: rgba(183, 205, 39, 0.08);
}

/* ============================================================================
   31. HEADER ICON SAFETY-NET
   ----------------------------------------------------------------------------
   The legacy markup uses `fal` (Pro Light) for the header icons (globe,
   bell, plus, random). Some FA builds don't ship Light, so they render as
   blank squares. Force these specific icons to use the FA Free Solid family
   which is always present, regardless of which class is on the element. */
header.main-header .header-opt_btn i,
header.main-header .cart-btn i,
header.main-header .add-list_wrap i,
header.main-header .show-reg-form i,
header.main-header .header-modal-top a i {
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free",
                 "Font Awesome 5 Pro", "FontAwesome", sans-serif !important;
    font-weight: 900 !important;
    color: inherit;
}

/* Make the globe + EN/AR badge feel like one unit */
header.main-header .header-opt_btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 60px;
    overflow: visible !important;
}
header.main-header .header-opt_btn > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
header.main-header .header-opt_btn > span > i {
    font-size: 18px;
    line-height: 1;
}

/* Tighten the EN/AR badge so it hugs the globe properly */
.aj-lang-badge {
    bottom: -5px !important;
    right: -2px !important;
    min-width: 22px;
    height: 16px;
    padding: 0 4px;
    line-height: 16px;
    font-size: 10px;
    font-weight: 700;
    border-radius: 8px;
    background: var(--aj-primary, #b7cd27) !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18);
    pointer-events: none;
}
html[dir="rtl"] .aj-lang-badge,
[dir="rtl"] .aj-lang-badge {
    right: auto !important;
    left: -2px !important;
}

/* Make the cart-btn (bell) counter pill smaller and less crowding */
header.main-header .cart-btn .cart-btn_counter {
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    line-height: 18px;
    font-size: 10px;
    font-weight: 700;
    border-radius: 9px;
    border: 2px solid #ffffff;
}

/* ============================================================================
   32. GLOBAL FAL (Pro Light) -> FA Free Solid mapping
   ----------------------------------------------------------------------------
   The codebase uses `<i class="fal fa-…">` (Pro Light) in 79+ places across
   18 view files (property cards bed/bath/cube/heart/compare, dashboard,
   blog, contact, etc.). Pro Light renders as invisible squares unless the
   FA Pro Light font loads correctly — which it doesn't on every browser.

   Glyph CODEPOINTS are identical between Light / Regular / Solid for every
   icon that exists in all three weights, so we can safely force Light
   markup to render with the Solid Free font without changing any markup.

   Any icon that is genuinely Pro-only (e.g. `fa-truck-couch`,
   `fa-home-lg-alt`, `fa-comment-alt-lines`) won't render with Free —
   those have already been swapped at the markup level for the header,
   property-details scroll-nav, and footer secondary-nav. Add more there
   when discovered.
   ============================================================================ */
i.fal,
.fal {
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free",
                 "Font Awesome 5 Pro", "FontAwesome", sans-serif !important;
    font-weight: 900 !important;
}
i.fal::before,
.fal::before {
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free",
                 "Font Awesome 5 Pro", "FontAwesome", sans-serif !important;
    font-weight: 900 !important;
}
/* `far` (Pro Regular) is also occasionally invisible on systems without
   FA Pro Regular. Promote to Solid Free as well. */
i.far,
.far {
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free",
                 "Font Awesome 5 Pro", "FontAwesome", sans-serif !important;
    font-weight: 900 !important;
}
i.far::before,
.far::before {
    font-family: "Font Awesome 5 Free", "Font Awesome 6 Free",
                 "Font Awesome 5 Pro", "FontAwesome", sans-serif !important;
    font-weight: 900 !important;
}

/* ---------- 22. HOMEPAGE SEARCH BAR (original theme colors) ---------- */
.aj-search-hero-wrap {
    max-width: 100%;
    width: 100%;
    background: #fff;
    position: relative;
    z-index: 2;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.08);
    padding-bottom: 20px;
}
body.aj-dark .aj-search-hero-wrap {
    background: #1e293b;
}

/* Hero title text overlay */
.hero-section {
    position: relative;
}
.aj-hero-title-wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: center;
    padding: 0 20px;
    pointer-events: none;
    width: 100%;
    max-width: 800px;
}
.aj-hero-title {
    color: #fff;
    font-size: clamp(28px, 4vw, 48px);
    font-weight: 800;
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.5);
    margin: 0 0 10px;
    letter-spacing: -0.5px;
    line-height: 1.2;
}
.aj-hero-subtitle {
    color: rgba(255, 255, 255, 0.92);
    font-size: clamp(14px, 2vw, 20px);
    font-weight: 500;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45);
    margin: 0;
    letter-spacing: 0.5px;
}

/* ---------- 23. SELECT2 WIDGET (consolidated from page-level styles) ---------- */
.select2 {
    background: #F5F7FB;
    float: left;
    width: 100%;
    color: #7d93b2;
    font-family: 'Jost', sans-serif;
    border: 1px solid #e5e7f2 !important;
}
.select2-container--default .select2-selection--single {
    background-color: #f5f7fb !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 48px !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 48px !important;
}

/* Homepage variant (taller) */
.aj-search-hero-wrap .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 58px !important;
}
.aj-search-hero-wrap .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 58px !important;
}

/* ---------- 24. PAGINATION (consolidated from page-level styles) ---------- */
.pagination {
    display: inline-flex;
}
.pagination .active a {
    background: var(--aj-primary);
    color: #fff;
    border-color: var(--aj-primary);
}
.pagination li a {
    transition: background var(--aj-transition), color var(--aj-transition), border-color var(--aj-transition);
}
.pagination li a:hover {
    background: var(--aj-primary-soft);
    border-color: var(--aj-primary);
    color: var(--aj-primary-dark);
}

/* ---------- 25. SEARCH TABS + COUNTRY FLAG ---------- */
.aj-search-tabs {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px 0;
    flex-wrap: wrap;
}
.aj-search-country-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #f0f4f8;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    padding: 6px 16px 6px 10px;
    color: #144273;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
}
.aj-flag {
    font-size: 22px;
    line-height: 1;
}
.aj-search-tab-slider {
    display: flex;
    gap: 4px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    flex: 1;
    padding-bottom: 2px;
}
.aj-search-tab-slider::-webkit-scrollbar { display: none; }
.aj-search-tab {
    display: inline-block;
    padding: 7px 18px;
    border-radius: 999px;
    color: #64748b;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
    text-decoration: none;
    border: 1px solid transparent;
    transition: all var(--aj-transition);
    cursor: pointer;
}
.aj-search-tab:hover {
    color: #144273;
    background: #f0f4f8;
    border-color: #e2e8f0;
}
.aj-search-tab--active,
.aj-search-tab--active:hover {
    background: var(--aj-primary) !important;
    color: #878c9f !important;
    border-color: var(--aj-primary) !important;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(183, 205, 39, 0.3);
}

/* RTL adjustments */
html[dir="rtl"] .aj-search-tabs {
    flex-direction: row-reverse;
}
html[dir="rtl"] .aj-search-tab-slider {
    flex-direction: row-reverse;
}

/* Mobile: stack vertically */
@media (max-width: 768px) {
    .aj-search-tabs {
        flex-direction: column;
        align-items: stretch;
    }
    .aj-search-country-pill {
        align-self: flex-start;
    }
    html[dir="rtl"] .aj-search-country-pill {
        align-self: flex-end;
    }
}

/* ---------- 26. PROPERTY PAGE MASONRY ---------- */
.aj-masonry-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}
.aj-masonry-grid .listing-item {
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
}
@media (max-width: 768px) {
    .aj-masonry-grid {
        grid-template-columns: 1fr;
    }
}
/* When the theme's list-view toggle adds .has_one_column to items,
   switch the CSS grid container to single-column layout */
.aj-masonry-grid:has(.listing-item.has_one_column) {
    grid-template-columns: 1fr !important;
}
/* Masonry items get staggered entrance animation */
.aj-masonry-grid .listing-item {
    animation: aj-fade-up 500ms cubic-bezier(.2, .8, .2, 1) both;
}
.aj-masonry-grid .listing-item:nth-child(2) { animation-delay: 60ms; }
.aj-masonry-grid .listing-item:nth-child(3) { animation-delay: 120ms; }
.aj-masonry-grid .listing-item:nth-child(4) { animation-delay: 180ms; }
.aj-masonry-grid .listing-item:nth-child(5) { animation-delay: 240ms; }
.aj-masonry-grid .listing-item:nth-child(6) { animation-delay: 300ms; }
.aj-masonry-grid .listing-item:nth-child(n+7) { animation-delay: 350ms; }

/* One-column (list) override for masonry grid */
.aj-masonry-grid.aj-list-view {
    grid-template-columns: 1fr !important;
    display: grid !important;
}
.aj-masonry-grid.aj-list-view .listing-item {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
}
.aj-masonry-grid.aj-list-view .listing-item .geodir-category-listing {
    display: flex;
    flex-direction: row;
    align-items: stretch;
}
.aj-masonry-grid.aj-list-view .listing-item .geodir-category-img {
    flex: 0 0 320px;
    max-width: 320px;
    min-height: 220px;
}
.aj-masonry-grid.aj-list-view .listing-item .geodir-category-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
@media (max-width: 768px) {
    .aj-masonry-grid.aj-list-view .listing-item .geodir-category-listing {
        flex-direction: column;
    }
    .aj-masonry-grid.aj-list-view .listing-item .geodir-category-img {
        flex: none;
        max-width: 100%;
    }
}

/* ---------- 27. BRAND HERITAGE SHOWCASE ---------- */
.aj-brand-showcase {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    padding: 30px 0;
}
.aj-brand-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transition: transform 0.35s ease, box-shadow 0.35s ease;
    text-align: center;
}
.aj-brand-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
}
.aj-brand-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    aspect-ratio: 1 / 1;
}
body.aj-dark .aj-brand-card {
    background: var(--aj-surface);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
}
@media (max-width: 768px) {
    .aj-brand-showcase {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .aj-brand-img {
        aspect-ratio: auto;
    }
}

/* ============================================================================
   28. BREADCRUMBS REMOVAL FROM HOMEPAGE
   ============================================================================ */
.breadcrumbs.fl-wrap:empty,
.breadcrumbs-fixed.fl-wrap:empty {
    display: none !important;
}

/* ============================================================================
   29. SECTION SPACING – REDUCE EXCESS VERTICAL PADDING
   ============================================================================ */
section.gray-bg.small-padding { padding: 48px 0 !important; }
section:not([class]):has(.about-wrap),
section.about-section { padding: 52px 0 !important; }
section#Agent { padding: 52px 0 !important; }
section.single-par2 { padding: 90px 0 !important; }
section.gray-bg:has(.testimonials-slider) { padding: 52px 0 !important; }
@supports not selector(:has(*)) {
    section.gray-bg { padding: 52px 0 !important; }
}

/* ============================================================================
   30. UNIFIED HERO + SEARCH SECTION  (May 2026)
   ============================================================================ */

/* ── Section shell ─────────────────────────────────────────────────────────── */

/* ── "Why Choose Our Properties" section enhancement ───────────────────────── */

/* Parent section – clean gradient */
section:has(.about-wrap) {
    position: relative;
    background:
        linear-gradient(
            180deg,
            #f9fafb 0%,
            #f3f4f6 50%,
            #eef0f3 100%
        );
    padding: 48px 0 56px !important;
    overflow: hidden;
}

/* Subtle grid texture */
section:has(.about-wrap)::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(0,0,0,0.02) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0,0,0,0.02) 1px, transparent 1px);
    background-size: 48px 48px;
    opacity: 0.5;
    pointer-events: none;
    z-index: 0;
}

/* Amman cityscape – covers full left half of section (RTL) */
section:has(.about-wrap)::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background-image: url('/Content/img/landing-petra.webp');
    background-size: cover;
    background-position: center center;
    opacity: 0.22;
    z-index: 0;
    pointer-events: none;
}

section:has(.about-wrap) .container {
    position: relative;
    z-index: 1;
}

/* Row – vertically center */
.about-wrap > .row {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap;
}

/* ── Text side – compact ───────────────────────────────────────────────────── */
.about-wrap .about-title h2 {
    color: #111827 !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    margin-bottom: 12px !important;
    line-height: 1.3 !important;
    font-family: 'Tajawal', system-ui, sans-serif;
}
.about-wrap .about-title p {
    color: #4b5563;
    font-size: 14px;
    line-height: 1.7;
    margin-bottom: 8px;
}

.about-wrap .services-opions {
    color: #374151;
    line-height: 1.65;
    font-size: 13.5px;
}
.about-wrap .services-opions h3,
.about-wrap .services-opions h4,
.about-wrap .services-opions strong,
.about-wrap .services-opions b {
    color: #878c9f;
    font-weight: 600;
    margin-top: 14px;
    margin-bottom: 4px;
    display: block;
    font-size: 14px;
}
.about-wrap .services-opions p {
    margin-bottom: 6px;
    line-height: 1.7;
}

/* ── Image column ──────────────────────────────────────────────────────────── */
.about-wrap > .row > .col-md-6 {
    position: relative;
    min-height: 320px;
}

/* Logo image */
.about-wrap .about-img {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border-radius: 0;
    padding: 16px;
    box-shadow: none;
    transition: transform 300ms ease;
    min-height: 320px;
    margin: auto 0;
}
.about-wrap .about-img:hover {
    transform: scale(1.02);
    box-shadow: none;
}

/* ── Vertical divider ──────────────────────────────────────────────────────── */
.about-wrap > .row > .col-md-1 {
    position: relative;
    display: flex !important;
    align-items: center;
    justify-content: center;
}
.about-wrap > .row > .col-md-1::after {
    content: '';
    display: block;
    width: 1px;
    height: 60%;
    min-height: 120px;
    background: linear-gradient(
        180deg,
        transparent 0%,
        rgba(0, 0, 0, 0.08) 30%,
        rgba(0, 0, 0, 0.08) 70%,
        transparent 100%
    );
    border-radius: 1px;
}

/* Mobile */
@media (max-width: 991px) {
    .about-wrap > .row > .col-md-1::after {
        display: none;
    }
    section:has(.about-wrap) {
        padding: 32px 0 40px !important;
    }
    .about-wrap > .row > .col-md-6 {
        min-height: 240px;
    }
}

/* ============================================================================
   37. DISCOVER AMMAN – Photo Grid Section
   ============================================================================ */

.aj-discover-amman {
    padding: 56px 0 64px;
    background: #ffffff;
}

.aj-discover-amman .section-title h2 {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #111827 !important;
    margin-bottom: 8px !important;
    font-family: 'Tajawal', system-ui, sans-serif;
}

.aj-discover-subtitle {
    color: #6b7280;
    font-size: 15px;
    text-align: center;
    margin-bottom: 32px;
    letter-spacing: 0.3px;
}

/* ── CSS Grid – 4 columns ─────────────────────────────────────────────────── */
.aj-amman-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: 220px;
    gap: 12px;
}

.aj-amman-wide {
    grid-column: span 2;
}

.aj-grid-featured {
    grid-column: span 2;
    grid-row: span 2;
}

.aj-grid-tall {
    grid-row: span 2;
}

.aj-amman-item {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    cursor: pointer;
}

.aj-amman-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 500ms ease;
}

.aj-amman-item:hover img {
    transform: scale(1.08);
}

/* Hover overlay */
.aj-amman-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        transparent 40%,
        rgba(0, 0, 0, 0.55) 100%
    );
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding: 16px;
    opacity: 0;
    transition: opacity 300ms ease;
}

.aj-amman-item:hover .aj-amman-overlay {
    opacity: 1;
}

.aj-amman-overlay span {
    color: #ffffff;
    font-size: 15px;
    font-weight: 600;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.3);
    letter-spacing: 0.3px;
    font-family: 'Tajawal', system-ui, sans-serif;
}

/* ── Full overlay with title + button (property type cards) ────────────────── */
.aj-amman-overlay--full {
    opacity: 1;
    background: linear-gradient(
        180deg,
        transparent 20%,
        rgba(0, 0, 0, 0.6) 100%
    );
    align-items: flex-end;
    justify-content: flex-end;
    padding: 20px;
}

.aj-amman-info {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: flex-end;
    text-align: right;
}

.aj-amman-title {
    color: #ffffff !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    margin: 0 !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
    line-height: 1.3;
    font-family: 'Tajawal', system-ui, sans-serif;
}

.aj-amman-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 16px;
    font-size: 13px;
    font-weight: 600;
    color: #ffffff !important;
    background: rgba(183, 205, 39, 0.85);
    border-radius: 8px;
    text-decoration: none !important;
    transition: all 250ms ease;
    width: fit-content;
    letter-spacing: 0.3px;
    font-family: 'Tajawal', system-ui, sans-serif;
}
.aj-amman-btn:hover {
    background: rgba(183, 205, 39, 1);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(183, 205, 39, 0.4);
}

/* Tablet */
@media (max-width: 991px) {
    .aj-amman-grid {
        grid-template-columns: repeat(3, 1fr);
        grid-auto-rows: 180px;
        gap: 10px;
    }
    .aj-amman-wide {
        grid-column: span 2;
    }
    .aj-grid-featured {
        grid-column: span 2;
        grid-row: span 2;
    }
    .aj-grid-tall {
        grid-row: span 2;
    }
}

/* Mobile */
@media (max-width: 640px) {
    .aj-amman-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-auto-rows: 150px;
        gap: 8px;
    }
    .aj-amman-wide {
        grid-column: span 2;
    }
    .aj-grid-featured {
        grid-column: span 2;
        grid-row: span 1;
    }
    .aj-grid-tall {
        grid-row: span 1;
    }
    .aj-discover-amman {
        padding: 40px 0 48px;
    }
    .aj-amman-overlay {
        opacity: 1;
    }
}

/* ============================================================================
   HERO + SEARCH CARD  (premium polish – May 2026)
   ============================================================================ */

.aj-hero-search-section {
    position: relative;
    min-height: 70vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 24px 100px;
    overflow: hidden;
}

.aj-hero-bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center center;
    z-index: 0;
}

.aj-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        transparent 0%,
        rgba(0, 0, 0, 0.08) 30%,
        rgba(0, 0, 0, 0.22) 60%,
        rgba(0, 0, 0, 0.35) 80%,
        rgba(0, 0, 0, 0.45) 100%
    );
    z-index: 1;
}

.aj-hero-content {
    position: relative;
    z-index: 2;
    text-align: center;
    margin-bottom: 32px;
}

.aj-hero-title {
    color: #ffffff;
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 700;
    margin: 0 0 8px;
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.35);
    font-family: 'Tajawal', system-ui, sans-serif;
}

.aj-hero-subtitle {
    color: rgba(255, 255, 255, 0.88);
    font-size: clamp(14px, 1.8vw, 18px);
    font-weight: 400;
    margin: 0;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.25);
}

/* Search card */
.aj-hero-search-card {
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: 1140px;
    margin: 0 auto;
    background: #ffffff;
    border-radius: 18px;
    padding: 16px 20px 12px;
    box-shadow:
        0 4px 16px rgba(0, 0, 0, 0.08),
        0 12px 40px rgba(0, 0, 0, 0.06);
}

.aj-srow {
    display: flex;
    align-items: stretch;
    gap: 8px;
    width: 100%;
}

.aj-sfield {
    flex: 1;
    min-width: 0;
    position: relative;
    background: #f7f8fa;
    border: 1px solid #e8eaef;
    border-radius: 10px;
    display: flex;
    align-items: center;
    height: 44px;
    transition: border-color 200ms ease, box-shadow 200ms ease;
}

.aj-sfield:hover { border-color: #d1d5db; }
.aj-sfield:focus-within {
    border-color: var(--aj-primary, #b7cd27);
    box-shadow: 0 0 0 3px rgba(183, 205, 39, 0.12);
}
.aj-sfield--text { flex: 1.3; }

.aj-sicon {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #9ca3af;
    font-size: 14px;
    pointer-events: none;
    z-index: 1;
}

.aj-sinput {
    width: 100%;
    height: 100%;
    border: none !important;
    background: transparent !important;
    padding: 0 12px 0 12px !important;
    padding-right: 36px !important;
    font-size: 15px !important;
    font-weight: 400;
    color: #878c9f !important;
    outline: none !important;
    box-shadow: none !important;
    font-family: 'Tajawal', system-ui, sans-serif;
}

.aj-sinput::placeholder { color: #6b7280 !important; opacity: 1; }

.aj-sselect,
.aj-sfield select,
.aj-sfield .chosen-container,
.aj-sfield .chosen-container .chosen-single {
    width: 100% !important;
    height: 100% !important;
    border: none !important;
    background: transparent !important;
    padding: 0 12px !important;
    font-size: 15px !important;
    color: #878c9f !important;
    outline: none !important;
    box-shadow: none !important;
    cursor: pointer;
    display: flex !important;
    align-items: center;
    font-family: 'Tajawal', system-ui, sans-serif;
}

.aj-sfield .chosen-container .chosen-single span {
    font-size: 15px !important;
    line-height: 44px !important;
}

.aj-sbtn {
    flex-shrink: 0;
    min-width: 140px;
    height: 44px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 24px;
    font-size: 15px !important;
    font-weight: 600 !important;
    border: none !important;
    border-radius: 10px !important;
    cursor: pointer;
    white-space: nowrap;
    transition: all 200ms ease !important;
    box-shadow: 0 2px 8px rgba(183, 205, 39, 0.25);
    font-family: 'Tajawal', system-ui, sans-serif;
}
.aj-sbtn:hover {
    filter: brightness(0.92);
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(183, 205, 39, 0.35);
}
.aj-sbtn i { font-size: 14px; }

.aj-slinks {
    display: flex;
    gap: 16px;
    justify-content: center;
    padding-top: 10px;
}
.aj-slinks a {
    font-size: 13px;
    color: #6b7280;
    text-decoration: none;
    transition: color 200ms ease;
    font-weight: 500;
}
.aj-slinks a:hover { color: var(--aj-primary, #8ba61e); }

@media (max-width: 991px) {
    .aj-srow { flex-wrap: wrap; gap: 8px; }
    .aj-sfield { flex: 1 1 calc(50% - 4px); }
    .aj-sfield--text { flex: 1 1 100%; }
    .aj-sbtn { flex: 1 1 100%; min-width: unset; }
    .aj-hero-search-card { max-width: 600px; }
}
@media (max-width: 640px) {
    .aj-hero-search-section { min-height: 260px; padding-bottom: 50px; }
    .aj-sfield { flex: 1 1 100%; }
    .aj-hero-search-card { padding: 14px 14px 12px; border-radius: 14px; }
}

/* Hide slider pager/arrows – single static banner */
.aj-hero-search-section .slideshow-container,
.aj-hero-search-section .slide-progress-wrap,
.aj-hero-search-section .sp-buttons,
.aj-hero-search-section .sp-arrows,
.aj-hero-search-section .sp-previous-arrow,
.aj-hero-search-section .sp-next-arrow,
.aj-hero-search-section .pager,
.aj-hero-search-section .slider-pager,
.aj-hero-search-section .swiper-pagination,
.aj-hero-search-section .swiper-button-prev,
.aj-hero-search-section .swiper-button-next,
.aj-hero-search-section .slick-dots,
.aj-hero-search-section .slick-prev,
.aj-hero-search-section .slick-next,
.aj-hero-search-section .lc-wbtn {
    display: none !important;
}

/* Latest Properties – title + filters on same baseline */
.gray-bg.small-padding > .container > .row {
    display: flex !important;
    align-items: flex-end !important;
    flex-wrap: wrap;
    margin-bottom: 10px;
}
.gray-bg.small-padding .section-title {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}
.gray-bg.small-padding .section-title h1,
.gray-bg.small-padding .section-title h2 {
    margin-bottom: 0 !important;
}
.gray-bg.small-padding .listing-filters.gallery-filters {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.aj-hero-search-section {
    position: relative;
    width: 100%;
    min-height: 70vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    padding-bottom: 60px;
    overflow: visible;
    padding-top: 0 !important;
    background: transparent;
    float: none;
}

/* ── Background image ───────────────────────────────────────────────────────── */
.aj-hero-bg {
    position: absolute;
    inset: 0;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    z-index: 0;
    /* Brand-tinted fallback so the hero never looks blank if banner.jpg is
       missing or 404s in production (May 2026 fix). The inline-style
       background-image overrides this when the asset is present. */
    background-color: #0f172a;
}

/* Dark gradient overlay – transparent at top, darkest at bottom.
   Sits between background image and slide text for readability.
   ONLY applied to the hero/slider section (.aj-hero-overlay). */
.aj-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        transparent 0%,
        rgba(0, 0, 0, 0.08) 30%,
        rgba(0, 0, 0, 0.22) 60%,
        rgba(0, 0, 0, 0.35) 80%,
        rgba(0, 0, 0, 0.45) 100%
    );
    z-index: 1;
}

/* ── Title block – visible always so the hero is readable even if the
       background image is missing/blocked in production (May 2026 fix). ── */
.aj-hero-content {
    position: relative;
    z-index: 2;
    text-align: center;
    padding: 80px 24px 24px;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 860px;
}

.aj-hero-content .aj-hero-title {
    color: #ffffff;
    font-size: clamp(26px, 4vw, 52px);
    font-weight: 800;
    line-height: 1.15;
    margin: 0 0 14px;
    letter-spacing: -0.5px;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.55);
}

.aj-hero-content .aj-hero-subtitle {
    color: rgba(255, 255, 255, 0.90);
    font-size: clamp(13px, 1.7vw, 20px);
    font-weight: 500;
    margin: 0;
    letter-spacing: 0.4px;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.45);
}

/* ── Search card ────────────────────────────────────────────────────────────── */
.aj-hero-search-card {
    position: relative;
    z-index: 10;
    width: calc(100% - 48px);
    max-width: 900px;
    background: #ffffff;
    border-radius: 16px;
    box-shadow:
        0 4px 12px rgba(15, 23, 42, 0.08),
        0 12px 32px rgba(15, 23, 42, 0.12),
        0 24px 48px rgba(15, 23, 42, 0.06);
    padding: 24px 28px 20px;
    margin-top: auto;
    transform: translateY(50%);
}

/* ── Search row (CSS grid) ──────────────────────────────────────────────────── */
.aj-srow {
    display: grid;
    grid-template-columns: repeat(4, 1fr) auto;
    grid-template-rows: auto auto;
    gap: 0;
    border: 1px solid #e8ecf2;
    border-radius: 12px;
    overflow: hidden;
    background: #f9fafb;
}

.aj-sfield {
    position: relative;
    background: #ffffff;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #f0f2f7;
    border-left: 1px solid #f0f2f7;
    min-height: 48px;
    transition: background 200ms ease;
}
.aj-sfield:hover {
    background: #fafbfd;
}

.aj-sfield--text {
    grid-column: 1 / -1;
    grid-row: 1;
    border-left: none;
}

.aj-sfield:not(.aj-sfield--text) {
    grid-row: 2;
    border-bottom: none;
}
.aj-sfield:not(.aj-sfield--text):last-of-type {
    border-left: none;
}

/* RTL: flip left borders to right (AR is default RTL) */
html[dir="rtl"] .aj-sfield {
    border-left: none;
    border-right: 1px solid #f0f2f7;
}
html[dir="rtl"] .aj-sfield--text { border-right: none; }
html[dir="rtl"] .aj-sfield:not(.aj-sfield--text):first-of-type { border-right: none; }

/* Search icon */
.aj-sicon {
    position: absolute;
    color: var(--aj-primary, #b7cd27);
    font-size: 14px;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    z-index: 1;
}

/* Text input */
.aj-sinput {
    width: 100%;
    height: 48px;
    border: none !important;
    background: transparent !important;
    padding: 0 36px 0 14px !important;
    font-size: 13.5px;
    color: #878c9f;
    outline: none;
    font-family: inherit;
    text-align: right;
}

/* Native <select> */
.aj-sselect {
    width: 100% !important;
    height: 48px !important;
    border: none !important;
    background: transparent !important;
    padding: 0 12px !important;
    font-size: 13px !important;
    color: #878c9f !important;
    outline: none;
    cursor: pointer;
    font-family: inherit;
    -webkit-appearance: none;
    appearance: none;
    text-align: right;
}

/* Select2 overrides */
.aj-hero-search-card .select2-container { width: 100% !important; }
.aj-hero-search-card .select2-container--default .select2-selection--single {
    height: 48px !important;
    border: none !important;
    background: transparent !important;
    border-radius: 0 !important;
    display: flex !important;
    align-items: center;
}
.aj-hero-search-card .select2-container--default
    .select2-selection--single .select2-selection__rendered {
    line-height: 48px !important;
    padding-right: 12px !important;
    padding-left: 28px !important;
    color: #878c9f !important;
    font-size: 13px !important;
    text-align: right !important;
}
.aj-hero-search-card .select2-container--default
    .select2-selection--single .select2-selection__arrow {
    height: 48px !important;
    left: 6px !important;
    right: auto !important;
}

/* Search button */
.aj-sbtn {
    grid-row: 2;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 100%;
    min-height: 48px;
    padding: 0 32px;
    border: none;
    border-radius: 0 0 0 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    letter-spacing: 0.3px;
    transition: background 200ms ease, box-shadow 200ms ease, transform 200ms ease;
    color: #ffffff;
}
.aj-sbtn:hover {
    background: #9aad1f !important;
    box-shadow: 0 4px 16px rgba(154, 173, 31, 0.4);
    transform: translateY(-1px);
}

/* Quick-links row */
.aj-slinks {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-top: 12px;
    padding: 0 4px;
    flex-wrap: wrap;
    flex-direction: row-reverse;
}
.aj-slinks a {
    font-size: 13px;
    font-weight: 500;
    color: #878c9f;
    text-decoration: none;
    transition: color 180ms ease;
}
.aj-slinks a:hover { color: var(--aj-primary-dark, #a7bd1b); }

/* Space compensation */
.aj-hero-search-section + section,
.aj-hero-search-section + .section,
.aj-hero-search-section + * {
    margin-top: 80px;
}
.aj-hero-search-section::after { display: none !important; }

/* ── Responsive ──────────────────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .aj-srow {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto auto auto;
    }
    .aj-sfield--text { grid-column: 1 / -1; }
    .aj-sfield:not(.aj-sfield--text) {
        grid-row: auto;
        border-bottom: 1px solid #eef0f5;
    }
    .aj-sbtn {
        grid-column: 1 / -1;
        grid-row: auto;
        border-radius: 0 0 10px 10px;
        min-height: 46px;
    }
    .aj-hero-search-card {
        width: calc(100% - 32px);
        padding: 16px 16px 14px;
    }
}

@media (max-width: 640px) {
    .aj-hero-search-section {
        min-height: 360px;
        padding-bottom: 72px;
    }
    .aj-hero-content { padding: 60px 16px 20px; }
    .aj-srow { grid-template-columns: 1fr; }
    .aj-sfield--text { grid-column: 1; }
    .aj-sfield:not(.aj-sfield--text) {
        grid-row: auto;
        border-left: none;
    }
    html[dir="rtl"] .aj-sfield:not(.aj-sfield--text) { border-right: none; }
    .aj-sbtn {
        grid-column: 1;
        border-radius: 0 0 12px 12px;
    }
    .aj-hero-search-card {
        width: calc(100% - 24px);
        padding: 14px 14px 12px;
        border-radius: 12px;
    }
    .aj-hero-search-section + * { margin-top: 72px; }
}

@media (max-width: 400px) {
    .aj-hero-content .aj-hero-title { font-size: 22px; }
    .aj-hero-content .aj-hero-subtitle { font-size: 13px; }
}

/* Dark mode */
body.aj-dark .aj-hero-search-card {
    background: var(--aj-bg-card, #1e293b);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}
body.aj-dark .aj-srow { background: rgba(255, 255, 255, 0.05); border-color: rgba(255,255,255,0.08); }
body.aj-dark .aj-sfield { background: var(--aj-bg-card, #1e293b); border-color: rgba(255,255,255,0.06); }
body.aj-dark .aj-sinput,
body.aj-dark .aj-sselect { color: var(--aj-text, #e5e7eb) !important; }
body.aj-dark .aj-slinks a { color: var(--aj-text-muted, #94a3b8); }

/* ============================================================================
   31. NAVBAR / HEADER POLISH
   ============================================================================ */

/* ── Header base alignment ─────────────────────────────────────────────────── */
header.main-header {
    display: flex !important;
    align-items: center !important;
    padding: 0 24px !important;
    min-height: 56px;
    height: 56px;
    gap: 10px;
}

/* ── Logo – prominent but balanced ─────────────────────────────────────────── */
header.main-header .logo-holder {
    position: relative !important;
    top: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}
header.main-header .logo-holder img {
    max-height: 46px !important;
    height: 46px !important;
    width: auto !important;
    padding: 4px 8px !important;
    background: rgba(255, 255, 255, 0.85) !important;
    border-radius: 8px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06) !important;
    display: block;
    transition: transform 200ms ease, box-shadow 200ms ease !important;
}
header.main-header .logo-holder a:hover img {
    transform: scale(1.03) !important;
    box-shadow:
        0 2px 6px rgba(0, 0, 0, 0.1),
        0 6px 20px rgba(0, 0, 0, 0.06) !important;
}
body.aj-dark header.main-header .logo-holder img {
    background: rgba(30, 41, 59, 0.9) !important;
}

/* ── Nav menu – takes remaining space, centers items ───────────────────────── */
/*header.main-header .nav-holder.main-menu {
    flex: 1;
    display: flex !important;
    align-items: center;
    justify-content: center;*/
}
header.main-header .nav-holder.main-menu nav > ul {
    display: flex !important;
    align-items: center;
    gap: 2px;
}

/* ── Menu items – polished, vertically centered ────────────────────────────── */
header.main-header .nav-holder.main-menu nav > ul > li > a {
    padding: 6px 14px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    border-radius: 6px;
    transition: background 200ms ease, color 200ms ease !important;
    font-family: 'Tajawal', 'Jost', system-ui, sans-serif;
    position: relative;
}
header.main-header .nav-holder.main-menu nav > ul > li > a:hover {
    background: rgba(0, 0, 0, 0.04) !important;
    color: var(--aj-primary, #8ba61e) !important;
}
/* Active page highlight */
header.main-header .nav-holder.main-menu nav > ul > li.current-menu-item > a,
header.main-header .nav-holder.main-menu nav > ul > li > a.aj-nav-home {
    color: var(--aj-primary, #8ba61e) !important;
    font-weight: 600 !important;
}

/* ── Dropdown caret – bigger, vertically centered, better spacing ──────────── */
header.main-header .nav-holder.main-menu nav > ul > li > a .fa-caret-down,
header.main-header .nav-holder.main-menu nav > ul > li > a .fa-angle-down {
    font-size: 13px !important;
    margin-inline-start: 4px;
    opacity: 0.6;
    transition: transform 200ms ease, opacity 200ms ease;
    line-height: 1;
    vertical-align: middle;
}
header.main-header .nav-holder.main-menu nav > ul > li:hover > a .fa-caret-down,
header.main-header .nav-holder.main-menu nav > ul > li:hover > a .fa-angle-down {
    opacity: 1;
    transform: rotate(180deg);
}

/* ── "Add Property" primary CTA button ─────────────────────────────────────── */
header.main-header .add-list_wrap {
    display: flex !important;
    align-items: center;
    flex-shrink: 0;
}
.aj-add-btn {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    padding: 7px 18px !important;
    background: var(--aj-primary, #b7cd27) !important;
    color: #1a2e05 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    border-radius: 8px !important;
    border: none !important;
    white-space: nowrap;
    line-height: 1.4;
    text-decoration: none !important;
    box-shadow: 0 2px 8px rgba(183, 205, 39, 0.25);
    transition: all 200ms ease !important;
    cursor: pointer;
    font-family: 'Tajawal', system-ui, sans-serif;
}
.aj-add-btn:hover {
    background: #a5b825 !important;
    box-shadow: 0 4px 14px rgba(183, 205, 39, 0.35);
    transform: translateY(-1px);
}
.aj-add-btn i { font-size: 12px; font-weight: 400; }

/* ── Language toggle pill ──────────────────────────────────────────────────── */
.aj-lang-toggle {
    display: inline-flex;
    align-items: center;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 3px;
    gap: 2px;
    flex-shrink: 0;
}
.aj-lang-opt {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 14px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-decoration: none !important;
    color: #64748b;
    background: transparent;
    transition: all 200ms ease;
    cursor: pointer;
    line-height: 1;
    white-space: nowrap;
    font-family: 'Jost', 'Tajawal', 'Inter', system-ui, sans-serif;
}
.aj-lang-opt:hover { color: #1e293b; background: rgba(255, 255, 255, 0.8); }
.aj-lang-opt--active,
.aj-lang-opt--active:hover {
    background: var(--aj-primary, #b7cd27) !important;
    color: #878c9f !important;
    box-shadow: 0 2px 6px rgba(183, 205, 39, 0.3);
    pointer-events: none;
}
body.aj-dark .aj-lang-toggle { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.1); }
body.aj-dark .aj-lang-opt { color: #94a3b8; }
body.aj-dark .aj-lang-opt:hover { color: #e2e8f0; background: rgba(255, 255, 255, 0.08); }
body.aj-dark .aj-lang-opt--active,
body.aj-dark .aj-lang-opt--active:hover { background: var(--aj-primary, #b7cd27) !important; color: #878c9f !important; }

/* ── Sign-in / Dashboard alignment ─────────────────────────────────────────── */
header.main-header .show-reg-form { display: flex; align-items: center; flex-shrink: 0; }
header.main-header .show-reg-form a {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 500;
}
header.main-header .cart-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-shrink: 0;
}

/* Hide old globe button and modal */
header.main-header .header-opt_btn,
header.main-header .header-opt,
.header-opt-modal { display: none !important; }

/* ── Responsive ────────────────────────────────────────────────────────────── */
@media (max-width: 992px) {
    header.main-header { padding: 0 14px !important; min-height: 54px; height: auto; }
    header.main-header .logo-holder img { max-height: 42px !important; height: 42px !important; }
    header.main-header .nav-holder.main-menu nav > ul > li > a { padding: 6px 10px !important; font-size: 13px !important; }
    .aj-add-btn span { display: none; }
    .aj-add-btn { padding: 7px 12px !important; }
    .aj-lang-toggle { order: 10; }
}
@media (max-width: 600px) {
    header.main-header { padding: 0 10px !important; min-height: 50px; gap: 6px; }
    header.main-header .logo-holder img { max-height: 38px !important; height: 38px !important; padding: 4px 8px !important; }
    .aj-lang-opt { padding: 4px 10px; font-size: 11px; }
}

/* Hero responsive */
@media (max-width: 640px) {
    .aj-hero-search-section {
        min-height: 260px;
        padding-bottom: 50px;
    }
}
















/* ============================================================================
   32. PROPERTY CARDS – IMAGE RATIO + HIERARCHY
   ============================================================================ */
.geodir-category-img img[style*="height:252px"],
.geodir-category-img img[style*="height: 252px"],
.gallery-item .geodir-category-img img,
.listing-item .geodir-category-img img {
    height: 100% !important;
    width: 100% !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center !important;
}

/* ============================================================================
   33. VIEW ALL BUTTON
   ============================================================================ */
.aj-view-all-wrap {
    margin-top: 12px !important;
    margin-bottom: 0 !important;
}

/* ============================================================================
   34. CATEGORY LISTING-FILTERS
   ============================================================================ */
section.gray-bg.small-padding .listing-filters.gallery-filters {
    display: flex !important;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-start;
    align-items: center;
    margin: 0 !important;
    padding: 0 !important;
}
section.gray-bg.small-padding .listing-filters .gallery-filter { margin: 0 !important; }
section.gray-bg.small-padding .row { align-items: center; }
section.gray-bg.small-padding .section-title { margin-bottom: 0 !important; }

/* RTL title alignment */
html[dir="rtl"] .section-title h1,
html[dir="rtl"] .section-title h2 {
    text-align: right !important;
}
html[dir="rtl"] .section-title h1::after,
html[dir="rtl"] .section-title h2::after {
    left: auto !important;
    right: 0 !important;
}

/* ============================================================================
   36. VALUATION CTA SECTION POLISH
   ============================================================================ */

/* Remove hard green bottom border line */
.hidden-section.single-par2 {
    border: none !important;
    border-bottom: none !important;
    outline: none !important;
}
.hidden-section.single-par2::after,
.hidden-section.single-par2::before {
    display: none !important;
}

/* More breathing space */
.hidden-section.single-par2 {
    padding: 80px 0 !important;
    min-height: 360px;
    display: flex;
    align-items: center;
}

/* Soften the overlay – lighter on left (RTL) so house image shows */
.hidden-section.single-par2 .bg-wrap.bg-parallax-wrap-gradien::after,
.hidden-section.single-par2 > .bg-wrap::after {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    background: linear-gradient(
        270deg,
        rgba(0, 0, 0, 0.55) 0%,
        rgba(0, 0, 0, 0.40) 50%,
        rgba(0, 0, 0, 0.25) 100%
    ) !important;
    z-index: 1 !important;
    pointer-events: none;
}
.hidden-section.single-par2 .bg-wrap.bg-parallax-wrap-gradien {
    position: absolute;
    inset: 0;
}
.hidden-section.single-par2 .bg-wrap .bg {
    background-size: cover !important;
    background-position: center center !important;
}

.hidden-section.single-par2 > .container {
    position: relative;
    z-index: 2;
}

/* ── Title + subtitle ──────────────────────────────────────────────────────── */
.hidden-section.single-par2 .section-title.center-align {
    text-align: center;
    max-width: 700px;
    margin: 0 auto;
}
.hidden-section.single-par2 .section-title h2 {
    color: #ffffff !important;
    font-size: clamp(24px, 3.5vw, 38px) !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4) !important;
    margin-bottom: 12px !important;
    font-family: 'Tajawal', system-ui, sans-serif;
}
.hidden-section.single-par2 .section-title h2 span {
    color: inherit !important;
}
.hidden-section.single-par2 .section-title h3 {
    color: rgba(255, 255, 255, 0.88) !important;
    font-size: clamp(14px, 1.8vw, 18px) !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.3) !important;
    margin-bottom: 28px !important;
}

/* ── CTA button ────────────────────────────────────────────────────────────── */
.hidden-section.single-par2 .section-title .btn.color-bg {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 32px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border-radius: 10px !important;
    margin-top: 8px !important;
    text-decoration: none !important;
    letter-spacing: 0.3px;
    transition: all 250ms ease !important;
    box-shadow: 0 4px 16px rgba(183, 205, 39, 0.3);
}
.hidden-section.single-par2 .section-title .btn.color-bg:hover {
    background: #9aad1f !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 24px rgba(154, 173, 31, 0.45);
}

/* ── Hide noisy decorative elements ────────────────────────────────────────── */
.hidden-section.single-par2 .mrb_dec,
.hidden-section.single-par2 .mrb_dec3,
.hidden-section.single-par2 .pwh_bg,
.hidden-section.single-par2 .section-dec,
.hidden-section.single-par2 .circle-wrap,
.hidden-section.single-par2 .dec-circle {
    display: none !important;
    opacity: 0 !important;
}

/* Remove green border/line */
.hidden-section.single-par2,
.hidden-section.single-par2 * {
    border-top-color: transparent !important;
    border-bottom-color: transparent !important;
}
.hidden-section.single-par2 .btn {
    border-color: transparent !important;
}

/* ── Mobile ────────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .hidden-section.single-par2 {
        padding: 56px 16px !important;
        min-height: 280px;
    }
    .hidden-section.single-par2 .section-title h2 {
        font-size: 22px !important;
    }
    .hidden-section.single-par2 .section-title h3 {
        font-size: 14px !important;
        margin-bottom: 20px !important;
    }
    .hidden-section.single-par2 .section-title .btn.color-bg {
        padding: 10px 24px !important;
        font-size: 14px !important;
    }
}

/* ============================================================================
   35. NAVBAR / HEADER POLISH  (May 2026 – final)
   ============================================================================ */

/* ── Header base alignment ─────────────────────────────────────────────────── */
header.main-header {
    display: flex !important;
    align-items: center !important;
    padding: 0 24px !important;
    min-height: 56px;
    height: 56px;
    gap: 10px;
    flex-direction: row-reverse;
}

/* ── Logo – oversized premium card ─────────────────────────────────────────── */
header.main-header .logo-holder {
    position: relative !important;
    top: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    z-index: 100;
    align-self: flex-start;
}

header.main-header .logo-holder a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 90px;
    height: 100px;
    background: #ffffff;
    border-radius: 0 0 14px 14px;
    box-shadow:
        0 4px 12px rgba(0, 0, 0, 0.08),
        0 8px 24px rgba(0, 0, 0, 0.05);
    padding: 10px;
    transition: box-shadow 300ms ease, transform 300ms ease;
}

header.main-header .logo-holder a:hover {
    box-shadow:
        0 6px 16px rgba(0, 0, 0, 0.1),
        0 12px 32px rgba(0, 0, 0, 0.07);
    transform: translateY(2px);
}

header.main-header .logo-holder img {
    max-height: 70px !important;
    height: auto !important;
    width: auto !important;
    max-width: 70px !important;
    padding: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    display: block;
    object-fit: contain;
}

body.aj-dark header.main-header .logo-holder a {
    background: rgba(30, 41, 59, 0.95);
}

/* ── Nav menu ──────────────────────────────────────────────────────────────── */
header.main-header .nav-holder.main-menu {
    flex: 1;
    display: flex !important;
    align-items: center;
    justify-content: center;
}
header.main-header .nav-holder.main-menu nav > ul {
    display: flex !important;
    align-items: center;
    gap: 2px;
}

/* ── Menu items ────────────────────────────────────────────────────────────── */
header.main-header .nav-holder.main-menu nav > ul > li > a {
    padding: 6px 14px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    border-radius: 6px;
    transition: background 200ms ease, color 200ms ease !important;
    font-family: 'Tajawal', 'Jost', system-ui, sans-serif;
    position: relative;
}
header.main-header .nav-holder.main-menu nav > ul > li > a:hover {
    background: rgba(0, 0, 0, 0.04) !important;
    color: var(--aj-primary, #8ba61e) !important;
}
header.main-header .nav-holder.main-menu nav > ul > li.current-menu-item > a,
header.main-header .nav-holder.main-menu nav > ul > li > a.aj-nav-home {
    color: var(--aj-primary, #8ba61e) !important;
    font-weight: 600 !important;
}

/* ── Dropdown caret ────────────────────────────────────────────────────────── */
header.main-header .nav-holder.main-menu nav > ul > li > a .fa-caret-down,
header.main-header .nav-holder.main-menu nav > ul > li > a .fa-angle-down {
    font-size: 13px !important;
    margin-inline-start: 4px;
    opacity: 0.6;
    transition: transform 200ms ease, opacity 200ms ease;
    line-height: 1;
    vertical-align: middle;
}
header.main-header .nav-holder.main-menu nav > ul > li:hover > a .fa-caret-down,
header.main-header .nav-holder.main-menu nav > ul > li:hover > a .fa-angle-down {
    opacity: 1;
    transform: rotate(180deg);
}

/* ── "Add Property" CTA ────────────────────────────────────────────────────── */
header.main-header .add-list_wrap {
    display: flex !important;
    align-items: center;
    flex-shrink: 0;
}
.aj-add-btn {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    padding: 7px 18px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    letter-spacing: 0.3px;
    white-space: nowrap;
    font-family: 'Tajawal', system-ui, sans-serif;
    transition: background 200ms ease, box-shadow 200ms ease, transform 200ms ease !important;
}
.aj-add-btn:hover {
    filter: brightness(1.08);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(183, 205, 39, 0.3);
}

/* ── Language toggle pill ──────────────────────────────────────────────────── */
.aj-lang-toggle {
    display: inline-flex;
    align-items: center;
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid #e0e3ea;
    background: #f4f5f7;
    flex-shrink: 0;
}
.aj-lang-opt {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 12px;
    font-size: 11.5px;
    font-weight: 600;
    text-decoration: none;
    color: #6b7280;
    transition: all 200ms ease;
    letter-spacing: 0.5px;
    line-height: 1.4;
}
.aj-lang-opt--active {
    background: var(--aj-primary, #b7cd27);
    color: #ffffff !important;
    border-radius: 20px;
    box-shadow: 0 1px 4px rgba(183, 205, 39, 0.3);
}

/* ── Mobile logo ───────────────────────────────────────────────────────────── */
@media (max-width: 991px) {
    header.main-header .logo-holder a {
        width: 64px;
        height: 72px;
        border-radius: 0 0 10px 10px;
        padding: 6px;
    }
    header.main-header .logo-holder img {
        max-height: 50px !important;
        max-width: 50px !important;
    }
}

/* ============================================================================
   35. PROPERTY FILTER BAR - ONE-LINE SEARCH (.aj-fbar)
   ----------------------------------------------------------------------------
   Compact horizontal search row used at the top of /Property.
   DOM order: Category - RealestateType - City - Neighberhood - Search button.
   In LTR this reads left-to-right; with dir="rtl" flexbox reverses the visual
   order so the same DOM produces the requested RTL layout naturally.
   ============================================================================ */
.aj-fbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
    width: 100%;
    margin: 0 0 22px;
    padding: 10px 12px;
    background: #ffffff;
    border: 1px solid var(--aj-border, #e5e7eb);
    border-radius: 12px;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.05);
}
.aj-fbar__field {
    flex: 1 1 0;
    min-width: 0;
    position: relative;
}
.aj-fbar__btn {
    flex: 0 0 auto;
    min-width: 130px;
    height: 44px;
    padding: 0 22px;
    border: 0;
    border-radius: 10px;
    background: var(--aj-primary, #b7cd27);
    color: #ffffff;
    font-weight: 700;
    font-size: 14px;
    letter-spacing: 0.3px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    box-shadow: 0 4px 12px rgba(183, 205, 39, 0.30);
    transition: background 200ms ease, box-shadow 200ms ease, transform 200ms ease;
    white-space: nowrap;
}
.aj-fbar__btn:hover,
.aj-fbar__btn:focus-visible {
    background: var(--aj-primary-dark, #a7bd1b);
    box-shadow: 0 6px 18px rgba(183, 205, 39, 0.45);
    transform: translateY(-1px);
    color: #ffffff;
    outline: none;
}
.aj-fbar__btn:active { transform: translateY(0); }
.aj-fbar__btn i { font-size: 13px; }

/* Native <select> baseline (when chosen / select2 haven't initialised yet). */
.aj-fbar select.aj-fbar__select {
    width: 100% !important;
    height: 44px;
    padding: 0 12px;
    border: 1px solid var(--aj-border, #e5e7eb);
    border-radius: 10px;
    background: #ffffff;
    color: var(--aj-text, #878c9f);
    font-size: 14px;
    line-height: 1.2;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.aj-fbar select.aj-fbar__select:focus {
    outline: none;
    border-color: var(--aj-primary, #b7cd27);
    box-shadow: 0 0 0 3px var(--aj-primary-soft, rgba(183, 205, 39, 0.20));
}

/* Chosen.js single-select widget overrides (full width inside flex item) */
.aj-fbar .chosen-container,
.aj-fbar .chosen-container-single {
    width: 100% !important;
    min-width: 0 !important;
    font-size: 14px;
}
.aj-fbar .chosen-container-single .chosen-single {
    height: 44px !important;
    line-height: 42px !important;
    padding: 0 32px 0 14px;
    border: 1px solid var(--aj-border, #e5e7eb) !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    box-shadow: none !important;
    color: var(--aj-text, #878c9f);
}
.aj-fbar .chosen-container-active.chosen-with-drop .chosen-single,
.aj-fbar .chosen-container-active .chosen-single {
    border-color: var(--aj-primary, #b7cd27) !important;
    box-shadow: 0 0 0 3px var(--aj-primary-soft, rgba(183, 205, 39, 0.20)) !important;
}
.aj-fbar .chosen-container-single .chosen-single div {
    top: 0;
    height: 44px;
    width: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.aj-fbar .chosen-container-single .chosen-single div b {
    background-position: 0 12px;
}
.aj-fbar .chosen-container .chosen-drop {
    border: 1px solid var(--aj-border, #e5e7eb);
    border-radius: 10px;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);
    margin-top: 4px;
}
.aj-fbar .chosen-container .chosen-results li.highlighted {
    background: var(--aj-primary, #b7cd27);
    color: #ffffff;
}

/* Select2 widget overrides */
.aj-fbar .select2-container,
.aj-fbar .select2 {
    width: 100% !important;
    min-width: 0 !important;
}
.aj-fbar .select2-container .select2-selection--single {
    height: 44px !important;
    border: 1px solid var(--aj-border, #e5e7eb) !important;
    border-radius: 10px !important;
    background: #ffffff !important;
}
.aj-fbar .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 42px !important;
    padding: 0 32px 0 14px;
    color: var(--aj-text, #878c9f);
}
.aj-fbar .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 42px !important;
    top: 1px;
}
.aj-fbar .select2-container--default.select2-container--open .select2-selection--single,
.aj-fbar .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--aj-primary, #b7cd27) !important;
    box-shadow: 0 0 0 3px var(--aj-primary-soft, rgba(183, 205, 39, 0.20)) !important;
}

/* RTL: chosen / select2 widgets put the caret on the opposite side */
html[dir="rtl"] .aj-fbar .chosen-container-single .chosen-single,
[dir="rtl"]     .aj-fbar .chosen-container-single .chosen-single {
    padding: 0 14px 0 32px;
}
html[dir="rtl"] .aj-fbar .chosen-container-single .chosen-single div,
[dir="rtl"]     .aj-fbar .chosen-container-single .chosen-single div {
    right: auto;
    left: 4px;
}
html[dir="rtl"] .aj-fbar .select2-container--default .select2-selection--single .select2-selection__rendered,
[dir="rtl"]     .aj-fbar .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 0 14px 0 32px;
    text-align: right;
}
html[dir="rtl"] .aj-fbar .select2-container--default .select2-selection--single .select2-selection__arrow,
[dir="rtl"]     .aj-fbar .select2-container--default .select2-selection--single .select2-selection__arrow {
    right: auto;
    left: 6px;
}

/* Tablet: keep one row but allow a tighter scale */
@media (max-width: 991px) {
    .aj-fbar { gap: 6px; padding: 8px 10px; }
    .aj-fbar__btn { min-width: 110px; padding: 0 16px; }
}

/* Mobile: stack vertically; each control fills the row */
@media (max-width: 767px) {
    .aj-fbar {
        flex-wrap: wrap;
        gap: 8px;
        padding: 12px;
    }
    .aj-fbar__field {
        flex: 1 1 100%;
        min-width: 100%;
    }
    .aj-fbar__btn {
        flex: 1 1 100%;
        width: 100%;
        min-width: 0;
    }
}

/* Dark mode token alignment */
body.aj-dark .aj-fbar {
    background: var(--aj-bg-card, #1e293b);
    border-color: var(--aj-border, #334155);
}
body.aj-dark .aj-fbar select.aj-fbar__select,
body.aj-dark .aj-fbar .chosen-container-single .chosen-single,
body.aj-dark .aj-fbar .select2-container .select2-selection--single {
    background: var(--aj-bg-soft, #1e293b) !important;
    border-color: var(--aj-border, #334155) !important;
    color: var(--aj-text, #e5e7eb) !important;
}

/* ============================================================================
   36. PROPERTY CARD UNIFIED (home only)  — May 2026
   ----------------------------------------------------------------------------
   Polished property-listing card for the home page latest-properties grid
   (Default/Index.cshtml). All selectors are scoped under .aj-home-section so
   these rules NEVER apply to the /Property listings grid, which keeps its
   original pre-unification visual.
   ============================================================================ */

/* Shared card shell - subtle elevation + lift on hover */
.aj-home-section .geodir-category-listing.aj-card {
    background: #ffffff;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06);
    transition: transform 240ms ease, box-shadow 240ms ease;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.aj-home-section .geodir-category-listing.aj-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.10);
}

/* Image media: locked aspect ratio, cover fit, smooth zoom on hover */
.aj-home-section .geodir-category-listing.aj-card .geodir-category-img {
    position: relative;
    aspect-ratio: 16 / 11;
    overflow: hidden;
    background: #f1f5f9;
    flex: 0 0 auto;
}
.aj-home-section .geodir-category-listing.aj-card .geodir-category-img > .geodir-category-img_item {
    display: block;
    width: 100%;
    height: 100%;
}
.aj-home-section .geodir-category-listing.aj-card .geodir-category-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    display: block;
    transition: transform 600ms ease;
}
.aj-home-section .geodir-category-listing.aj-card:hover .geodir-category-img img {
    transform: scale(1.04);
}

/* Empty / fallback media state */
.aj-home-section .geodir-category-listing.aj-card .geodir-category-img.aj-card-media--empty {
    background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
}
.aj-home-section .geodir-category-listing.aj-card .geodir-category-img.aj-card-media--empty img {
    display: none !important;
}
.aj-home-section .geodir-category-listing.aj-card .aj-card-media-fallback {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: rgba(15, 23, 42, 0.18);
    font-size: 64px;
    text-decoration: none;
}
.aj-home-section .geodir-category-listing.aj-card .geodir-category-img:not(.aj-card-media--empty) .aj-card-media-fallback {
    display: none !important;
}

/* Location pill on the image (white text on overlay) */
.aj-home-section .geodir-category-listing.aj-card .geodir-category-location b {
    color: #ffffff !important;
}

/* Content area: even spacing, push details row to the bottom */
.aj-home-section .geodir-category-listing.aj-card .geodir-category-content {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    padding: 18px 20px !important;
    background: #ffffff;
}
.aj-home-section .geodir-category-listing.aj-card .geodir-category-content .title-sin_item {
    margin: 0 0 10px !important;
    min-height: 2.6em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.aj-home-section .geodir-category-listing.aj-card .geodir-category-content_price {
    margin-bottom: 12px !important;
}
.aj-home-section .geodir-category-listing.aj-card .geodir-category-content-details {
    margin-top: auto !important;
    padding-top: 12px !important;
    border-top: 1px solid #e5e7eb;
}

/* RTL content alignment */
html[dir="rtl"] .aj-home-section .geodir-category-listing.aj-card .geodir-category-content,
[dir="rtl"]     .aj-home-section .geodir-category-listing.aj-card .geodir-category-content {
    text-align: right;
}
html[dir="rtl"] .aj-home-section .geodir-category-listing.aj-card .geodir-category-content-details ul,
[dir="rtl"]     .aj-home-section .geodir-category-listing.aj-card .geodir-category-content-details ul {
    padding-right: 0;
}

/* Smaller phones - tighten paddings */
@media (max-width: 480px) {
    .aj-home-section .geodir-category-listing.aj-card .geodir-category-content {
        padding: 14px 16px !important;
    }
}

/* Dark-mode parity */
body.aj-dark .aj-home-section .geodir-category-listing.aj-card,
body.aj-dark .aj-home-section .geodir-category-listing.aj-card .geodir-category-content {
    background: var(--aj-bg-card, #1e293b) !important;
}
body.aj-dark .aj-home-section .geodir-category-listing.aj-card .geodir-category-content-details {
    border-top-color: rgba(255, 255, 255, 0.06);
}
body.aj-dark .aj-home-section .geodir-category-listing.aj-card .geodir-category-img.aj-card-media--empty {
    background: linear-gradient(135deg, #1e293b 0%, #878c9f 100%);
}
body.aj-dark .aj-home-section .geodir-category-listing.aj-card .aj-card-media-fallback {
    color: rgba(241, 245, 249, 0.18);
}

/* ----------------------------------------------------------------------------
   Home compact filter bar (.aj-fbar--home) - sits directly under the banner.
   Reuses the base .aj-fbar layout from section 35; just tweaks the wrapper
   spacing and a soft drop-shadow so it visually attaches to the hero.
   ---------------------------------------------------------------------------- */
.aj-home-fbar-wrap {
    position: relative;
    z-index: 5;
    margin: 0;
}
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home {
    margin-top: -28px;
    margin-bottom: 18px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.10);
}

/* Trim the now-redundant bottom padding on the hero (the old in-hero search
   card used to sit there; without it the gap is visually too large). */
.aj-hero-search-section {
    padding-bottom: 48px;
}

@media (max-width: 991px) {
    .aj-home-fbar-wrap .aj-fbar.aj-fbar--home {
        margin-top: -20px;
    }
}
@media (max-width: 767px) {
    .aj-home-fbar-wrap .aj-fbar.aj-fbar--home {
        margin-top: 0;
        margin-bottom: 14px;
        box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
    }
    .aj-hero-search-section {
        padding-bottom: 24px;
    }
}

/* ============================================================================
   37. HOME RHYTHM (spacing + separators)
   ----------------------------------------------------------------------------
   Premium vertical rhythm for the home page: comfortable padding between every
   major home section + a clean hairline-and-pill separator at each boundary.
   The "Why Choose" section keeps its own dedicated separator from
   abujudom-home-why.css; .aj-why is intentionally NOT marked .aj-home-section
   so this ruleset never double-applies to it.
   ============================================================================ */

.aj-home-section {
    position: relative;
    border-block-start: 1px solid var(--aj-border, rgba(15, 23, 42, 0.08));
}

.aj-home-section::before {
    content: "";
    position: absolute;
    inset-block-start: 0;
    inset-inline: 0;
    width: 56px;
    height: 4px;
    margin-inline: auto;
    border-radius: 999px;
    background: var(--aj-primary, #b7cd27);
    transform: translateY(-50%);
    pointer-events: none;
    z-index: 3;
}

.aj-home-section.gray-bg.small-padding,
.aj-home-section.gray-bg:not(.small-padding),
.aj-home-section.aj-discover-amman,
section#Agent.aj-home-section {
    padding-block: clamp(56px, 7vw, 96px) !important;
}

.aj-home-section .section-title.st-center {
    margin-block-end: clamp(20px, 2.4vw, 32px);
}

.aj-home-fbar-wrap {
    padding-block: 0 clamp(20px, 4vw, 36px);
}

.aj-home-fbar-wrap .aj-fbar.aj-fbar--home {
    background: #ffffff;
    border-radius: var(--aj-radius, 14px);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
    padding: clamp(10px, 1.4vw, 14px);
}

@media (max-width: 600px) {
    .aj-home-section.gray-bg.small-padding,
    .aj-home-section.gray-bg:not(.small-padding),
    .aj-home-section.aj-discover-amman,
    section#Agent.aj-home-section {
        padding-block: clamp(40px, 8vw, 56px) !important;
    }
    .aj-home-section::before {
        width: 48px;
        height: 3px;
    }
    .aj-home-fbar-wrap {
        padding-block: 0 24px;
    }
}

/* ============================================================================
   38. FOOTER (logo + city silhouette)  -- May 2026
   Decorative skyline silhouette behind .main-footer + sized footer brand mark.
   ============================================================================ */
.main-footer {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

.main-footer::before {
    content: "";
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    height: clamp(120px, 14vw, 220px);
    background: url("/Content/SiteAr/images/city-bg.png") center bottom / contain no-repeat;
    opacity: 0.10;
    filter: brightness(1.2) saturate(0.7);
    pointer-events: none;
    z-index: 0;
}

.main-footer > * {
    position: relative;
    z-index: 1;
}

.aj-footer-brand .aj-footer-logo,
.aj-footer-logo {
    display: block;
    max-width: 180px;
    height: auto;
    width: auto;
    margin-block-end: 16px;
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.25));
    transition: transform var(--aj-transition);
}

.aj-footer-brand .aj-footer-logo:hover,
.aj-footer-logo:hover {
    transform: translateY(-2px);
}

@media (max-width: 600px) {
    .aj-footer-brand .aj-footer-logo,
    .aj-footer-logo {
        max-width: 140px;
    }
    .main-footer::before {
        height: clamp(90px, 22vw, 160px);
        opacity: 0.06;
    }
}

/* ============================================================================
   39. LIST CARD POLISH (May 2026 - trimmed r58)
   ----------------------------------------------------------------------------
   Safe cosmetic-only enhancements for /Property and /Project list pages.
   Scoped to #aj-property-grid and #aj-project-grid only so home cards
   (Default/Index.cshtml) and the details views are never affected.

   The prior Section 39 attempted a full layout rewrite (aspect-ratio image,
   flex content column, absolute-positioned location strip, pinned
   save/compare buttons) that fought with the CSS-Grid masonry layout from
   Section 26 and forced the listing into a single full-width column. This
   r58 version keeps ONLY the low-risk styling so the existing masonry /
   CSS-grid layout continues to render correctly:
     - Card border-radius + soft shadow + hover lift
     - Status pill (.blue-bg) + Type pill (.color-bg) brand colours
     - Save / Compare circular dark button visuals (no positioning overrides)
     - Location strip + price + stats row colour tints (no layout overrides)
   Bilingual + RTL parity is preserved because nothing in this section uses
   physical left/right offsets to position anything.
   ============================================================================ */

#aj-property-grid .listing-item .geodir-category-listing,
#aj-project-grid  .listing-item .geodir-category-listing {
    background: #ffffff !important;
    border-radius: 14px !important;
    border: 1px solid rgba(15, 23, 42, 0.06) !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06) !important;
    overflow: hidden;
    transition: transform 280ms ease, box-shadow 280ms ease, border-color 280ms ease !important;
}
#aj-property-grid .listing-item:hover .geodir-category-listing,
#aj-project-grid  .listing-item:hover .geodir-category-listing {
    transform: translateY(-3px);
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.10) !important;
    border-color: rgba(183, 205, 39, 0.30) !important;
}

/* Status pill (.blue-bg) + Type pill (.color-bg) brand colours */
#aj-property-grid .listing-item .list-single-opt_header_cat li a.cat-opt.blue-bg,
#aj-project-grid  .listing-item .list-single-opt_header_cat li a.cat-opt.blue-bg {
    background: #878c9f !important;
    color: #ffffff !important;
}
#aj-property-grid .listing-item .list-single-opt_header_cat li a.cat-opt.color-bg,
#aj-project-grid  .listing-item .list-single-opt_header_cat li a.cat-opt.color-bg {
    background: var(--aj-primary, #b7cd27) !important;
    color: #ffffff !important;
}

/* Save + Compare circular dark button visuals - visuals only, no position */
#aj-property-grid .listing-item .geodir_save-btn,
#aj-property-grid .listing-item .compare-btn,
#aj-project-grid  .listing-item .geodir_save-btn,
#aj-project-grid  .listing-item .compare-btn {
    background: #878c9f !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
    transition: transform 220ms ease, background 220ms ease !important;
}
#aj-property-grid .listing-item .geodir_save-btn:hover,
#aj-project-grid  .listing-item .geodir_save-btn:hover {
    background: #ef4444 !important;
    color: #ffffff !important;
    transform: scale(1.08);
}
#aj-property-grid .listing-item .compare-btn:hover,
#aj-project-grid  .listing-item .compare-btn:hover {
    background: var(--aj-primary, #b7cd27) !important;
    color: #ffffff !important;
    transform: scale(1.08);
}
#aj-property-grid .listing-item .geodir_save-btn i,
#aj-property-grid .listing-item .compare-btn i,
#aj-project-grid  .listing-item .geodir_save-btn i,
#aj-project-grid  .listing-item .compare-btn i {
    color: #ffffff !important;
}

/* Location strip - colour tint only, leave position to theme + Section 26 */
#aj-property-grid .listing-item .geodir-category-location b,
#aj-project-grid  .listing-item .geodir-category-location b {
    color: #ffffff !important;
}
#aj-property-grid .listing-item .geodir-category-location i,
#aj-project-grid  .listing-item .geodir-category-location i {
    color: var(--aj-primary, #b7cd27) !important;
}

/* Price tint - brand olive/lime */
#aj-property-grid .listing-item .geodir-category-content_price,
#aj-project-grid  .listing-item .geodir-category-content_price {
    color: var(--aj-primary, #b7cd27) !important;
}
#aj-property-grid .listing-item .geodir-category-content_price a,
#aj-project-grid  .listing-item .geodir-category-content_price a {
    color: var(--aj-primary, #b7cd27) !important;
}

/* Stats row icon tint - colour only, no layout */
#aj-property-grid .listing-item .geodir-category-content-details i,
#aj-project-grid  .listing-item .geodir-category-content-details i {
    color: var(--aj-primary, #b7cd27) !important;
}

/* Dark-mode parity - card surface only */
body.aj-dark #aj-property-grid .listing-item .geodir-category-listing,
body.aj-dark #aj-project-grid  .listing-item .geodir-category-listing {
    background: var(--aj-bg-card, #1e293b) !important;
    border-color: rgba(255, 255, 255, 0.06) !important;
}

/* ============================================================================
   40. HOME POLISH (search bar contrast + section-head band)  -- May 2026
   ----------------------------------------------------------------------------
   Two CSS-only refinements scoped to the home page (Default/Index.cshtml):

     A. Dark, readable compact search bar (.aj-fbar.aj-fbar--home).
        Section 35 set a white surface; section 36/37 nudged it. Here we
        tighten the selector with .aj-home-fbar-wrap so we beat both without
        leaning on !important except where chosen.js / select2 plugin styles
        already use it.

     B. Unified "section head" band on the Latest Properties section
        (<section class="aj-home-section gray-bg small-padding">) -- title
        and category filter buttons share one balanced row, then a hairline +
        brand-olive pill divider sits between the head and the cards grid.

   No --aj-navy token exists in the codebase (verified); we use #0e2340 with
   a documented fallback. All spacing uses logical properties so RTL works
   without dir-specific overrides.
   ============================================================================ */

/* -------------------------------------------------------------------- 40.A */
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home {
    background: var(--aj-navy, #0e2340);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--aj-radius, 14px);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.18);
    padding: clamp(10px, 1.4vw, 14px);
}

.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .aj-fbar__field + .aj-fbar__field {
    border-inline-start: 1px solid rgba(255, 255, 255, 0.12);
}

.aj-home-fbar-wrap .aj-fbar.aj-fbar--home select.aj-fbar__select {
    background: transparent;
    border-color: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    font-weight: 500;
}
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home select.aj-fbar__select::placeholder {
    color: rgba(255, 255, 255, 0.78);
    font-weight: 500;
}

.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .chosen-container-single .chosen-single {
    background: transparent !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
    font-weight: 500;
}
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .chosen-container-single .chosen-default,
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .chosen-container-single .chosen-default span {
    color: rgba(255, 255, 255, 0.78) !important;
    font-weight: 500;
}
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .chosen-container-single .chosen-single span {
    color: #ffffff;
    opacity: 1;
}
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .chosen-container-single .chosen-single div b {
    border-top-color: rgba(255, 255, 255, 0.85);
    filter: brightness(0) invert(1) opacity(0.85);
}
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .chosen-container-active.chosen-with-drop .chosen-single,
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .chosen-container-active .chosen-single {
    border-color: var(--aj-primary, #b7cd27) !important;
    box-shadow: 0 0 0 2px var(--aj-primary, #b7cd27) !important;
    outline: 2px solid var(--aj-primary, #b7cd27);
    outline-offset: 2px;
}

.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .select2-container .select2-selection--single {
    background: transparent !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
}
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .select2-container--default .select2-selection--single .select2-selection__rendered {
   
    font-weight: 500;
}
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: rgba(255, 255, 255, 0.78) !important;
    font-weight: 500;
}
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-top-color: rgba(255, 255, 255, 0.85) !important;
}
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .select2-container--default.select2-container--open .select2-selection--single,
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .select2-container--default.select2-container--focus .select2-selection--single {
    border-color: var(--aj-primary, #b7cd27) !important;
    box-shadow: 0 0 0 2px var(--aj-primary, #b7cd27) !important;
    outline: 2px solid var(--aj-primary, #b7cd27);
    outline-offset: 2px;
}

.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .aj-fbar__btn {
    background: var(--aj-primary, #b7cd27);
    color: #ffffff;
    font-weight: 700;
    letter-spacing: 0.4px;
}
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .aj-fbar__btn:hover,
.aj-home-fbar-wrap .aj-fbar.aj-fbar--home .aj-fbar__btn:focus-visible {
    background: var(--aj-primary-dark, #a7bd1b);
    color: #ffffff;
}

@media (max-width: 600px) {
    .aj-home-fbar-wrap .aj-fbar.aj-fbar--home {
        padding: 10px;
    }
    .aj-home-fbar-wrap .aj-fbar.aj-fbar--home .aj-fbar__field + .aj-fbar__field {
        border-inline-start: 0;
    }
}

/* -------------------------------------------------------------------- 40.B */


.aj-home-section.aj-latest-properties-section.gray-bg.small-padding {
    padding-block: clamp(40px, 4.8vw, 56px) !important;
}

.aj-home-section.aj-latest-properties-section.gray-bg.small-padding > .container > .aj-latest-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    padding-block-end: clamp(14px, 1.8vw, 22px);
    margin-block-end: 0;
    position: relative;
}

.aj-home-section.aj-latest-properties-section.gray-bg.small-padding > .container > .aj-latest-head::after {
    content: "";
    position: absolute;
    inset-inline: 0;
    inset-block-end: 0;
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(15, 23, 42, 0.10), transparent);
    pointer-events: none;
}

.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .aj-latest-title-col {
    flex: 0 0 auto;
    max-width: 100%;
}
.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .aj-latest-tabs-col {
    flex: 1 1 0;
    max-width: 100%;
    display: flex;
    justify-content: flex-start;
}
html[dir="ltr"] .aj-home-section.aj-latest-properties-section.gray-bg.small-padding .aj-latest-tabs-col {
    justify-content: flex-end;
}

/* Desktop/tablet wide: keep title + tabs on one premium row. */
@media (min-width: 992px) {
    .aj-home-section.aj-latest-properties-section.gray-bg.small-padding > .container > .aj-latest-head {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        justify-content: space-between;
        gap: clamp(14px, 2vw, 28px);
    }
    .aj-home-section.aj-latest-properties-section.gray-bg.small-padding .aj-latest-title-col {
        flex: 0 0 auto;
        max-width: none;
        width: auto;
        float: none !important;
    }
    .aj-home-section.aj-latest-properties-section.gray-bg.small-padding .aj-latest-tabs-col {
        flex: 1 1 auto;
        max-width: none;
        width: auto;
        min-width: 0;
        float: none !important;
        margin-inline-start: auto;
    }
}

.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .aj-latest-title {
    margin: 0 !important;
    padding: 0 !important;
}

.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .section-title h1,
.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .section-title h2 {
    padding-block-end: 12px;
    margin-block-end: 0;
}
.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .section-title h1::after,
.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .section-title h2::after {
    height: 4px;
    width: 56px;
    border-radius: 999px;
    background: var(--aj-primary, #b7cd27);
}

.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .listing-filters.gallery-filters {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 10px;
    align-items: center;
    width: 100%;
    float: none !important;
    border: 0;
    border-radius: 0;
    overflow: visible;
    margin: 0 !important;
    padding: 0 !important;
}

/* RTL: anchor tabs to visual left edge on desktop width. */
@media (min-width: 992px) {
    html[dir="rtl"] .aj-home-section.aj-latest-properties-section.gray-bg.small-padding .aj-latest-tabs-col {
        flex: 1 1 auto !important;
        width: auto !important;
        max-width: none !important;
        float: none !important;
        display: flex !important;
        margin-inline-start: auto !important;
    }
    html[dir="rtl"] .aj-home-section.aj-latest-properties-section.gray-bg.small-padding .listing-filters.gallery-filters {
        width: 100% !important;
        text-align: left !important;
        justify-content: flex-end !important;
    }
}

.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .listing-filters .gallery-filter {
    display: inline-flex;
    float: none !important;
    align-items: center;
    height: 32px;
    padding-inline: 14px;
    border-radius: 999px;
    background: #ffffff;
    border: 1px solid var(--aj-border, #e5e7eb);
    color: var(--aj-text, #878c9f);
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    transition: background var(--aj-transition, 200ms ease),
                border-color var(--aj-transition, 200ms ease),
                color var(--aj-transition, 200ms ease),
                box-shadow var(--aj-transition, 200ms ease);
}
.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .listing-filters .gallery-filter:hover,
.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .listing-filters .gallery-filter:focus-visible {
    background: var(--aj-primary-soft, rgba(183, 205, 39, 0.12));
    border-color: var(--aj-primary, #b7cd27);
    color: var(--aj-primary-dark, #a7bd1b);
    outline: none;
}
.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .listing-filters .gallery-filter.gallery-filter-active {
    background: var(--aj-primary, #b7cd27);
    border-color: var(--aj-primary, #b7cd27);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(183, 205, 39, 0.30);
}
.aj-home-section.aj-latest-properties-section.gray-bg.small-padding .listing-filters .gallery-filter span {
    color: inherit;
    font-weight: inherit;
}

.aj-home-section.aj-latest-properties-section.gray-bg.small-padding > .container > .grid-item-holder {
    margin-block-start: clamp(10px, 1.6vw, 16px);
}

.aj-home-section.aj-latest-properties-section.gray-bg.small-padding > .container > .grid-item-holder::before {
    display: none;
}

@media (max-width: 600px) {
    .aj-home-section.aj-latest-properties-section.gray-bg.small-padding {
        padding-block: clamp(30px, 6vw, 40px) !important;
    }
    .aj-home-section.aj-latest-properties-section.gray-bg.small-padding > .container > .aj-latest-head {
        gap: 10px;
        padding-block-end: 16px;
    }
    .aj-home-section.aj-latest-properties-section.gray-bg.small-padding .section-title h1,
    .aj-home-section.aj-latest-properties-section.gray-bg.small-padding .section-title h2 {
        padding-block-end: 10px;
    }
    .aj-home-section.aj-latest-properties-section.gray-bg.small-padding .listing-filters.gallery-filters {
        gap: 8px;
    }
    .aj-home-section.aj-latest-properties-section.gray-bg.small-padding .listing-filters .gallery-filter {
        height: 30px;
        padding-inline: 12px;
        font-size: 12px;
    }
    .aj-home-section.aj-latest-properties-section.gray-bg.small-padding > .container > .grid-item-holder {
        margin-block-start: 8px;
    }
}

body.aj-dark .aj-home-section.aj-latest-properties-section.gray-bg.small-padding > .container > .aj-latest-head::after {
    background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.08), transparent);
}
body.aj-dark .aj-home-section.aj-latest-properties-section.gray-bg.small-padding .listing-filters .gallery-filter {
    background: var(--aj-bg-card, #1e293b);
    border-color: var(--aj-border, #334155);
    color: var(--aj-text, #e5e7eb);
}

/* ============================================================================
   41. SINCE 1950 BADGES (home + footer)  -- May 2026
   ----------------------------------------------------------------------------
   Heritage tagline pills used in two prominent places:

     A. Home hero – under the brand title, inside .aj-hero-content.
        Premium pill with brand-olive accent line on the inline-start side,
        white surface, thin --aj-border, brand-olive icon, dark text.

     B. Footer – directly under the brand logo (.aj-footer-brand). The
        footer surface is light (#f8fafc, set in section 7), so we mirror
        the home badge treatment for cleanest contrast and brand cohesion.

   All spacing uses logical properties so RTL parity is automatic.
   ============================================================================ */

.aj-since-badge,
.aj-footer-since {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding-block: 6px;
    padding-inline: 16px 14px;
    border-radius: 999px;
    background: #ffffff;
    color: var(--aj-text, #878c9f);
    border: 1px solid var(--aj-border, #e5e7eb);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    line-height: 1;
    position: relative;
    max-width: 100%;
}

.aj-since-badge::before,
.aj-footer-since::before {
    content: "";
    position: absolute;
    inset-block: 5px;
    inset-inline-start: 5px;
    width: 3px;
    border-radius: 999px;
    background: var(--aj-primary, #b7cd27);
}

.aj-since-badge i,
.aj-footer-since i {
    color: var(--aj-primary, #b7cd27);
    font-size: 14px;
    line-height: 1;
}

.aj-since-badge__year,
.aj-footer-since__year {
    color: var(--aj-text, #878c9f);
}

.aj-since-badge__sep,
.aj-footer-since__sep {
    color: var(--aj-text-muted, #6b7280);
}

.aj-since-badge__copy,
.aj-footer-since__copy {
    color: var(--aj-text-muted, #6b7280);
    text-transform: none;
    font-weight: 500;
    letter-spacing: 0;
}

.aj-since-badge {
    margin-block: clamp(6px, 1.4vw, 14px);
}

.aj-footer-since {
    margin-block-start: 12px;
}

.aj-hero-content .aj-since-badge {
    background: rgba(255, 255, 255, 0.94);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

@media (max-width: 600px) {
    .aj-since-badge,
    .aj-footer-since {
        font-size: 11px;
        padding-inline: 14px 12px;
        gap: 6px;
    }
    .aj-since-badge__copy,
    .aj-footer-since__copy {
        display: none;
    }
}

body.aj-dark .aj-since-badge,
body.aj-dark .aj-footer-since {
    background: var(--aj-bg-card, #1e293b);
    color: var(--aj-text, #e5e7eb);
    border-color: var(--aj-border, #334155);
}
body.aj-dark .aj-since-badge__year,
body.aj-dark .aj-footer-since__year {
    color: var(--aj-text, #e5e7eb);
}
body.aj-dark .aj-since-badge__copy,
body.aj-dark .aj-footer-since__copy,
body.aj-dark .aj-since-badge__sep,
body.aj-dark .aj-footer-since__sep {
    color: var(--aj-text-muted, #94a3b8);
}

/* ============================================================================
   42. POLISH PASS - 3-col list, mobile fbar, slider track  -- May 2026
   ----------------------------------------------------------------------------
   CSS-only refinements requested after r58:

     A. /Property and /Project listing grids (#aj-property-grid,
        #aj-project-grid) render 3 cards per row on >= 1200px, 2 on tablet,
        1 on phone. Home masonry is left untouched.

     B. Compact home search bar (.aj-fbar.aj-fbar--home) on phones (<= 600px)
        becomes a 2x2 grid with the Search button as a full-width row, so
        the bar no longer dominates the viewport on mobile.

     C. Slick slider pagination dots (.slick-dots) are restyled into clean
        brand pills that are 100% visible (the legacy default barely showed).
        Slick is loaded via plugins.js so this applies wherever a Slick
        carousel renders on the home page (hero + sub-carousels).

   All spacing uses logical properties so RTL parity is automatic.
   ============================================================================ */

/* -------------------------------------------------------------------- 42.A */
.listing-item-container#aj-property-grid,
.listing-item-container#aj-project-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.listing-item-container#aj-property-grid > .listing-item,
.listing-item-container#aj-project-grid  > .listing-item {
    width: auto !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 !important;
}

.listing-item-container#aj-property-grid > .pagination,
.listing-item-container#aj-project-grid  > .pagination {
    grid-column: 1 / -1;
}

@media (max-width: 1199px) {
    .listing-item-container#aj-property-grid,
    .listing-item-container#aj-project-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
    }
}

@media (max-width: 767px) {
    .listing-item-container#aj-property-grid,
    .listing-item-container#aj-project-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

.listing-item-container#aj-property-grid.aj-list-view,
.listing-item-container#aj-project-grid.aj-list-view {
    grid-template-columns: 1fr !important;
    gap: 16px;
}

/* -------------------------------------------------------------------- 42.B */
@media (max-width: 600px) {
    .aj-home-fbar-wrap {
        padding-block: 0 16px;
    }
    .aj-home-fbar-wrap .aj-fbar.aj-fbar--home {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        padding: 8px;
        margin-block-end: 10px;
    }
    .aj-home-fbar-wrap .aj-fbar.aj-fbar--home .aj-fbar__field {
        flex: unset;
        min-width: 0;
        width: auto;
    }
    .aj-home-fbar-wrap .aj-fbar.aj-fbar--home .aj-fbar__btn {
        grid-column: 1 / -1;
        width: 100%;
        height: 40px;
        min-width: 0;
    }
    .aj-home-fbar-wrap .aj-fbar.aj-fbar--home select.aj-fbar__select,
    .aj-home-fbar-wrap .aj-fbar.aj-fbar--home .chosen-container-single .chosen-single,
    .aj-home-fbar-wrap .aj-fbar.aj-fbar--home .select2-container .select2-selection--single {
        height: 38px !important;
        line-height: 36px !important;
        font-size: 13px;
    }
    .aj-home-fbar-wrap .aj-fbar.aj-fbar--home .chosen-container-single .chosen-single {
        padding-inline: 12px 28px;
    }
}

/* -------------------------------------------------------------------- 42.C */
.slick-slider .slick-dots,
.slick-dots {
    position: relative;
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding-block: 16px 4px;
    overflow: visible;
    bottom: auto;
}

.slick-dots li {
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
}

.slick-dots li button {
    width: 24px;
    height: 4px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: var(--aj-border, #e5e7eb) !important;
    opacity: 0.85;
    cursor: pointer;
    text-indent: -9999px;
    overflow: hidden;
    transition: var(--aj-transition, 200ms ease);
    box-shadow: none;
}

.slick-dots li button:before {
    content: "";
    color: transparent;
    opacity: 0;
}

.slick-dots li button:hover,
.slick-dots li button:focus-visible {
    background: var(--aj-primary-dark, #a7bd1b) !important;
    opacity: 1;
    outline: none;
}

.slick-dots li.slick-active button {
    width: 32px;
    background: var(--aj-primary, #b7cd27) !important;
    opacity: 1;
    box-shadow: 0 2px 8px rgba(183, 205, 39, 0.40);
}

.listing-carousel-wrapper,
.testimonials-slider,
.text-carousel,
.slick-slider {
    padding-block-end: 12px;
}

.listing-carousel .slick-dots {
    bottom: auto;
    margin-block-start: 12px;
}

.slick-prev,
.slick-next,
.slick-arrow {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.55);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #ffffff;
    transition: var(--aj-transition, 200ms ease);
    z-index: 4;
}

.slick-prev:hover,
.slick-next:hover,
.slick-arrow:hover,
.slick-prev:focus-visible,
.slick-next:focus-visible,
.slick-arrow:focus-visible {
    background: var(--aj-primary, #b7cd27);
    border-color: var(--aj-primary, #b7cd27);
    color: #ffffff;
    outline: none;
}

.slick-prev:before,
.slick-next:before,
.slick-arrow:before {
    color: inherit;
    opacity: 1;
    font-size: 14px;
}

body.aj-dark .slick-dots li button {
    background: rgba(255, 255, 255, 0.18) !important;
}
body.aj-dark .slick-dots li.slick-active button {
    background: var(--aj-primary, #b7cd27) !important;
}

/* ============================================================================
   43. LISTING FILTER BAR — dark navy parity with home  -- May 2026
   ============================================================================ */
.aj-fbar:not(.aj-fbar--home) {
    background: var(--aj-navy, #0e2340);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: var(--aj-radius, 14px);
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.18);
    padding: clamp(10px, 1.4vw, 14px);
}

.aj-fbar:not(.aj-fbar--home) .aj-fbar__field label,
.aj-fbar:not(.aj-fbar--home) .chosen-container-single .chosen-single span,
.aj-fbar:not(.aj-fbar--home) .select2-selection__placeholder,
.aj-fbar:not(.aj-fbar--home) .select2-selection__rendered {
    color: rgba(255, 255, 255, 0.92) !important;
    font-weight: 500;
}

.aj-fbar:not(.aj-fbar--home) .chosen-container-single .chosen-single,
.aj-fbar:not(.aj-fbar--home) .select2-container--default .select2-selection {
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
}

.aj-fbar:not(.aj-fbar--home) .chosen-container-single .chosen-single div b {
    filter: brightness(0) invert(1) opacity(0.85);
}
.aj-fbar:not(.aj-fbar--home) .select2-selection__arrow b {
    border-top-color: rgba(255, 255, 255, 0.85) !important;
}

.aj-fbar:not(.aj-fbar--home) .chosen-container-active.chosen-with-drop .chosen-single,
.aj-fbar:not(.aj-fbar--home) .chosen-container-active .chosen-single,
.aj-fbar:not(.aj-fbar--home) .select2-container--open .select2-selection,
.aj-fbar:not(.aj-fbar--home) .select2-container--focus .select2-selection {
    border-color: var(--aj-primary, #b7cd27) !important;
    box-shadow: 0 0 0 2px var(--aj-primary, #b7cd27) !important;
}

.aj-fbar:not(.aj-fbar--home) .aj-fbar__btn {
    background: var(--aj-primary, #b7cd27);
    color: #ffffff;
    font-weight: 700;
    letter-spacing: 0.4px;
}
.aj-fbar:not(.aj-fbar--home) .aj-fbar__btn:hover,
.aj-fbar:not(.aj-fbar--home) .aj-fbar__btn:focus-visible {
    background: var(--aj-primary-dark, #a7bd1b);
    color: #ffffff;
}

/* ============================================================================
   44. MUTED TEXT + ICON COLOR — #878c9f
   ============================================================================ */
:root {
    --aj-text-muted: #878c9f;
    --aj-icon-muted: #878c9f;
}

body.aj-dark {
    --aj-text-muted: #c2c8d6;
    --aj-icon-muted: #c2c8d6;
}

.geodir-category-content p,
.geodir-category-content_loc,
.geodir-category-content-details li span,
.geodir-category-location b,
.aj-results-sub,
.aj-results-page,
.aj-discover-amman p,
.aj-why__head .aj-why__lede,
.aj-why-card p,
.aj-stat-tile__label,
.aj-step-card p,
.aj-pillar-card p,
.section-title h4,
.section-title p,
.about-content p,
.about-content li,
.contact-content p,
.contact-content li,
.contact-info p,
.list-single-content p,
.list-single-stats li,
.fl-wrap p:not(.aj-results-title):not(.text-brand),
.footer-widget-list a,
.footer-info-widget p,
.footer-widget li {
    color: var(--aj-text-muted, #878c9f) !important;
}

.geodir-category-content-details li i,
.list-single-stats li i,
.geodir-category-content-details i,
.list-single-content i:not(.color-bg):not(.brand-icon),
.contact-info-item i,
.contact-info i,
.footer-contacts-widget i,
.footer-widget i:not(.brand-icon),
.aj-meta i,
.aj-stats i,
.aj-results-eyebrow i,
.aj-card-meta i,
.fl-wrap-section .section-title i {
    color: var(--aj-icon-muted, #878c9f) !important;
}

.breadcrumbs li,
.breadcrumbs li a:not(:hover):not(:focus),
.aj-breadcrumb a:not(:hover):not(:focus) {
    color: var(--aj-text-muted, #878c9f) !important;
}

.listsearch-input-item label,
.aj-fbar:not([class*="--home"]):not([class*="--listing"]) .aj-fbar__field label {
    color: var(--aj-text-muted, #878c9f);
}

/* ============================================================================
   45. LISTING FILTER BAR — readable dropdown text
   ============================================================================ */
.aj-fbar:not(.aj-fbar--home) .chosen-container-single .chosen-single,
.aj-fbar:not(.aj-fbar--home) .select2-container--default .select2-selection {
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    color: #878c9f !important;
}

.aj-fbar:not(.aj-fbar--home) .chosen-container-single .chosen-single span,
.aj-fbar:not(.aj-fbar--home) .select2-selection__rendered,
.aj-fbar:not(.aj-fbar--home) .select2-selection__placeholder {
    color: #878c9f !important;
    font-weight: 500;
}

.aj-fbar:not(.aj-fbar--home) .chosen-container-single.chosen-default .chosen-single span,
.aj-fbar:not(.aj-fbar--home) .select2-selection__placeholder {
    color: #878c9f !important;
}

.aj-fbar:not(.aj-fbar--home) .chosen-container-single .chosen-single div b {
    filter: none !important;
    border-top-color: #6b7280 !important;
}
.aj-fbar:not(.aj-fbar--home) .select2-selection__arrow b {
    border-top-color: #6b7280 !important;
}

.aj-fbar:not(.aj-fbar--home) .chosen-container-active.chosen-with-drop .chosen-single,
.aj-fbar:not(.aj-fbar--home) .chosen-container-active .chosen-single,
.aj-fbar:not(.aj-fbar--home) .select2-container--open .select2-selection,
.aj-fbar:not(.aj-fbar--home) .select2-container--focus .select2-selection {
    border-color: var(--aj-primary, #b7cd27) !important;
    box-shadow: 0 0 0 2px var(--aj-primary, #b7cd27) !important;
}

/* ============================================================================
   46. PAGE HERO + ADVANCED FILTERS
   ============================================================================ */
.aj-page-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding-block: clamp(56px, 9vw, 120px);
    background:
        radial-gradient(circle at 12% 35%, rgba(183, 205, 39, 0.18), transparent 55%),
        radial-gradient(circle at 88% 65%, rgba(20, 66, 115, 0.10), transparent 60%),
        linear-gradient(180deg, #f3f6e8 0%, #eef2dc 100%);
    border-block-end: 1px solid rgba(15, 23, 42, 0.06);
}
.aj-page-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("/Content/SiteAr/images/city-bg.png") center bottom / cover no-repeat;
    opacity: 0.10;
    filter: brightness(1.4) saturate(0.7);
    pointer-events: none;
    z-index: 0;
}
.aj-page-hero > .container { position: relative; z-index: 1; }
.aj-page-hero__title {
    margin: 0;
    color: #878c9f;
    font-size: clamp(1.6rem, 3vw, 2.2rem);
    font-weight: 700;
    letter-spacing: 0.2px;
    line-height: 1.2;
    text-align: end;
}
.aj-page-hero__title::after {
    content: "";
    display: block;
    width: 56px;
    height: 4px;
    border-radius: 999px;
    background: var(--aj-primary, #b7cd27);
    margin-block-start: 14px;
    margin-inline-start: auto;
    margin-inline-end: 0;
}
.aj-page-hero__sub {
    margin: 12px 0 0;
    color: var(--aj-text-muted, #878c9f);
    font-size: 14px;
    text-align: end;
    max-width: 680px;
    margin-inline-start: auto;
}
html[dir="ltr"] .aj-page-hero__title,
html[dir="ltr"] .aj-page-hero__sub { text-align: start; }
html[dir="ltr"] .aj-page-hero__title::after { margin-inline-start: 0; margin-inline-end: auto; }
@media (max-width: 600px) {
    .aj-page-hero { padding-block: clamp(40px, 12vw, 64px); }
}

.aj-fbar__advanced-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-block-start: 12px;
    padding-block: 8px;
    padding-inline: 14px;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.92);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background var(--aj-transition, 200ms ease), border-color var(--aj-transition, 200ms ease);
}
.aj-fbar__advanced-toggle:hover {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.32);
}
.aj-fbar__advanced-toggle .aj-fbar__chevron {
    transition: transform 250ms ease;
    margin-inline-start: auto;
}
.aj-fbar__advanced-toggle[aria-expanded="true"] .aj-fbar__chevron {
    transform: rotate(180deg);
}

.aj-advanced-filters {
    margin-block-start: 16px;
    padding: clamp(14px, 2vw, 18px);
    background: #ffffff;
    border-radius: var(--aj-radius, 14px);
    border: 1px solid var(--aj-border, #e5e7eb);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
    animation: aj-advanced-in 250ms ease both;
}
.aj-advanced-filters[hidden] { display: none !important; }
.aj-advanced-filters__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 14px;
}
.aj-advanced-filters__field { display: flex; flex-direction: column; gap: 6px; }
.aj-advanced-filters__field label {
    font-size: 12px;
    font-weight: 600;
    color: var(--aj-text-muted, #878c9f);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.aj-advanced-filters__field input,
.aj-advanced-filters__field select {
    height: 42px;
    padding-inline: 12px;
    border-radius: 10px;
    border: 1px solid var(--aj-border, #e5e7eb);
    color: #878c9f;
    font-size: 14px;
    background: #fafafa;
    box-sizing: border-box;
}
/* Normalize Chosen plugin containers to match input height */
.aj-advanced-filters__field .chosen-container,
.aj-advanced-filters__field .chosen-container .chosen-single,
.aj-advanced-filters__field .chosen-container-single .chosen-single {
    height: 42px !important;
    line-height: 42px !important;
    border-radius: 10px !important;
    border: 1px solid var(--aj-border, #e5e7eb) !important;
    background: #fafafa !important;
    font-size: 14px !important;
    box-shadow: none !important;
    padding-inline: 12px !important;
    box-sizing: border-box !important;
}
.aj-advanced-filters__field .chosen-container-single .chosen-single span {
    line-height: 40px !important;
}
.aj-advanced-filters__field .chosen-container-single .chosen-single div {
    top: 0 !important;
    height: 42px !important;
    display: flex; align-items: center;
}
.aj-advanced-filters__field input:focus,
.aj-advanced-filters__field select:focus {
    outline: 2px solid var(--aj-primary, #b7cd27);
    outline-offset: 2px;
    border-color: var(--aj-primary, #b7cd27);
    background: #ffffff;
}
.aj-advanced-filters__reset {
    justify-content: flex-end;
    align-items: flex-end;
}
.aj-advanced-filters .aj-fbar__reset {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    padding: 0;
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.04);
    color: var(--aj-text-muted, #878c9f);
    font-size: 0; /* hide text */
    font-weight: 600;
    text-decoration: none;
    transition: background 250ms ease, color 250ms ease, transform 250ms ease;
}
/* Show sync icon via ::before */
.aj-advanced-filters .aj-fbar__reset::before {
    content: "\f2f1"; /* fa-sync-alt */
    font-family: "Font Awesome 5 Pro", "Font Awesome 5 Free", "FontAwesome";
    font-weight: 900;
    font-size: 15px;
    color: inherit;
    -webkit-font-smoothing: antialiased;
}
.aj-advanced-filters .aj-fbar__reset:hover {
    background: rgba(220, 38, 38, 0.08);
    color: #dc2626;
    transform: rotate(-180deg);
}
@keyframes aj-advanced-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
@media (max-width: 600px) {
    .aj-advanced-filters__grid { grid-template-columns: 1fr 1fr; gap: 10px; }
}

/* ============================================================================
   47. ADVANCED FILTERS — full-width below bar
   ============================================================================ */
.aj-fbar {
    flex-wrap: wrap !important;
}
.aj-fbar > .aj-advanced-filters {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-block-start: 16px;
    align-self: stretch;
}
.aj-fbar__advanced-toggle {
    flex: 0 0 auto;
}
.aj-advanced-filters__grid {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
}
@media (min-width: 1200px) {
    .aj-advanced-filters__grid {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 991px) {
    .aj-advanced-filters__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}
@media (max-width: 600px) {
    .aj-advanced-filters__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* ============================================================================
   48. EMPTY STATE — premium "No Results" experience
   ============================================================================ */
.aj-empty-state {
    width: 100%;
    max-width: 620px;
    margin: 48px auto 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    animation: aj-empty-fade-in 700ms cubic-bezier(.2, .8, .2, 1) both;
}
@keyframes aj-empty-fade-in {
    from { opacity: 0; transform: translateY(24px); }
    to   { opacity: 1; transform: none; }
}

/* ---------- Illustration ---------- */
.aj-empty-state__illustration {
    width: 260px;
    height: auto;
    margin-bottom: 28px;
}
.aj-empty-svg {
    width: 100%;
    height: auto;
    display: block;
}

/* Gentle float animation on the magnifying glass */
.aj-empty-magnifier {
    animation: aj-magnifier-float 3s ease-in-out infinite;
    transform-origin: center center;
}
@keyframes aj-magnifier-float {
    0%, 100% { transform: translate(0, 0) rotate(0deg); }
    50%      { transform: translate(-4px, -6px) rotate(-3deg); }
}

/* Subtle pulse on the house roof */
.aj-empty-roof {
    animation: aj-roof-pulse 4s ease-in-out infinite;
}
@keyframes aj-roof-pulse {
    0%, 100% { stroke-opacity: 1; }
    50%      { stroke-opacity: 0.5; }
}

/* Ground subtle breathing */
.aj-empty-ground {
    animation: aj-ground-breathe 4s ease-in-out infinite;
}
@keyframes aj-ground-breathe {
    0%, 100% { rx: 120; }
    50%      { rx: 125; }
}

/* ---------- Title + Subtitle ---------- */
.aj-empty-state__title {
    font-size: 26px;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 12px;
    letter-spacing: -0.3px;
    line-height: 1.3;
}
.aj-empty-state__subtitle {
    font-size: 15px;
    color: #64748b;
    line-height: 1.65;
    margin: 0 0 28px;
    max-width: 500px;
}

/* ---------- Tips ---------- */
.aj-empty-state__tips {
    background: rgba(183, 205, 39, 0.07);
    border: 1px solid rgba(183, 205, 39, 0.2);
    border-radius: 14px;
    padding: 18px 24px;
    margin-bottom: 28px;
    text-align: left;
    width: 100%;
    max-width: 460px;
}
html[dir="rtl"] .aj-empty-state__tips { text-align: right; }

.aj-empty-state__tips-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 700;
    color: var(--aj-primary-dark, #a7bd1b);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 10px;
}
.aj-empty-state__tips-label i {
    font-size: 15px;
    color: var(--aj-primary, #b7cd27);
}
.aj-empty-state__tips ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.aj-empty-state__tips ul li {
    position: relative;
    padding-left: 18px;
    padding-inline-start: 18px;
    padding-inline-end: 0;
    font-size: 13.5px;
    color: #475569;
    line-height: 1.7;
    margin-bottom: 2px;
}
.aj-empty-state__tips ul li::before {
    content: "";
    position: absolute;
    left: 0;
    inset-inline-start: 0;
    top: 10px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--aj-primary, #b7cd27);
    opacity: 0.6;
}

/* ---------- Browse All Button ---------- */
.aj-empty-state__browse-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 32px;
    border-radius: 999px;
    background: var(--aj-primary, #b7cd27);
    color: #fff !important;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    border: none;
    cursor: pointer;
    box-shadow: 0 6px 18px rgba(183, 205, 39, 0.25);
    transition: transform 280ms cubic-bezier(.2, .8, .2, 1),
                background 280ms ease,
                box-shadow 280ms ease;
}
.aj-empty-state__browse-btn:hover {
    transform: translateY(-2px);
    background: var(--aj-primary-dark, #a7bd1b);
    box-shadow: 0 10px 24px rgba(183, 205, 39, 0.35);
    color: #fff !important;
    text-decoration: none;
}
.aj-empty-state__browse-btn i {
    font-size: 15px;
}

/* ---------- Divider ---------- */
.aj-empty-state__divider {
    display: flex;
    align-items: center;
    width: 100%;
    max-width: 400px;
    margin: 28px 0;
    gap: 16px;
}
.aj-empty-state__divider::before,
.aj-empty-state__divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, transparent, #d1d5db 50%, transparent);
}
.aj-empty-state__divider span {
    font-size: 13px;
    font-weight: 600;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* ---------- Contact Card ---------- */
.aj-empty-state__contact-card {
    width: 100%;
    max-width: 540px;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 18px;
    padding: 28px 32px 32px;
    box-shadow: 0 8px 32px rgba(15, 23, 42, 0.06),
                0 2px 8px rgba(15, 23, 42, 0.03);
    animation: aj-empty-card-in 700ms 200ms cubic-bezier(.2, .8, .2, 1) both;
}
@keyframes aj-empty-card-in {
    from { opacity: 0; transform: translateY(16px) scale(0.98); }
    to   { opacity: 1; transform: none; }
}

.aj-empty-state__contact-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    text-align: left;
}
html[dir="rtl"] .aj-empty-state__contact-header { text-align: right; }

.aj-empty-state__contact-icon {
    flex-shrink: 0;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: linear-gradient(135deg, rgba(183, 205, 39, 0.15), rgba(183, 205, 39, 0.06));
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: var(--aj-primary, #b7cd27);
}

.aj-empty-state__contact-header h4 {
    font-size: 17px;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 3px;
    line-height: 1.3;
}
.aj-empty-state__contact-header p {
    font-size: 13px;
    color: #64748b;
    margin: 0;
    line-height: 1.4;
}

/* ---------- Form ---------- */
.aj-empty-state__form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-bottom: 18px;
}

.aj-empty-state__input-group {
    position: relative;
    display: flex;
    align-items: center;
}
.aj-empty-state__input-group > i {
    position: absolute;
    left: 14px;
    inset-inline-start: 14px;
    font-size: 14px;
    color: #94a3b8;
    pointer-events: none;
    z-index: 2;
    transition: color 200ms ease;
}
.aj-empty-state__input-group input {
    width: 100%;
    padding: 13px 14px 13px 42px;
    padding-inline-start: 42px;
    border: 1.5px solid #e5e7eb;
    border-radius: 12px;
    font-size: 14px;
    color: #1e293b;
    background: #f8fafc;
    outline: none;
    transition: border-color 250ms ease, box-shadow 250ms ease, background 250ms ease;
}
.aj-empty-state__input-group input::placeholder {
    color: #94a3b8;
    font-weight: 400;
}
.aj-empty-state__input-group input:focus {
    border-color: var(--aj-primary, #b7cd27);
    box-shadow: 0 0 0 3px rgba(183, 205, 39, 0.12);
    background: #fff;
}
.aj-empty-state__input-group:focus-within > i {
    color: var(--aj-primary, #b7cd27);
}

.aj-empty-state__submit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 14px 24px;
    border: none;
    border-radius: 12px;
    background: linear-gradient(135deg, #1e293b, #334155);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.12);
    transition: transform 280ms cubic-bezier(.2, .8, .2, 1),
                box-shadow 280ms ease,
                background 280ms ease;
}
.aj-empty-state__submit-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
    background: linear-gradient(135deg, #0f172a, #1e293b);
}
.aj-empty-state__submit-btn i {
    font-size: 14px;
    transition: transform 280ms ease;
}
.aj-empty-state__submit-btn:hover i {
    transform: translateX(3px) translateY(-2px);
}
html[dir="rtl"] .aj-empty-state__submit-btn:hover i {
    transform: translateX(-3px) translateY(-2px);
}

/* ---------- Responsive ---------- */
@media (max-width: 600px) {
    .aj-empty-state {
        margin: 32px auto 24px;
        padding: 0 8px;
    }
    .aj-empty-state__illustration { width: 200px; }
    .aj-empty-state__title { font-size: 22px; }
    .aj-empty-state__subtitle { font-size: 14px; }
    .aj-empty-state__form-row { grid-template-columns: 1fr; }
    .aj-empty-state__contact-card { padding: 22px 18px 26px; }
    .aj-empty-state__tips { padding: 14px 16px; }
}

/* ---------- Dark mode support ---------- */
body.aj-dark .aj-empty-state__title { color: #e5e7eb; }
body.aj-dark .aj-empty-state__subtitle { color: #94a3b8; }
body.aj-dark .aj-empty-state__tips {
    background: rgba(183, 205, 39, 0.06);
    border-color: rgba(183, 205, 39, 0.15);
}
body.aj-dark .aj-empty-state__tips ul li { color: #94a3b8; }
body.aj-dark .aj-empty-state__contact-card {
    background: #1e293b;
    border-color: rgba(255, 255, 255, 0.06);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
}
body.aj-dark .aj-empty-state__contact-header h4 { color: #e5e7eb; }
body.aj-dark .aj-empty-state__contact-header p { color: #94a3b8; }
body.aj-dark .aj-empty-state__input-group input {
    background: #0f172a;
    border-color: #334155;
    color: #e5e7eb;
}
body.aj-dark .aj-empty-state__input-group input::placeholder { color: #64748b; }
body.aj-dark .aj-empty-state__divider span { color: #64748b; }
body.aj-dark .aj-empty-state__divider::before,
body.aj-dark .aj-empty-state__divider::after {
    background: linear-gradient(90deg, transparent, #334155 50%, transparent);
}
body.aj-dark .aj-empty-house { fill: #334155; stroke: #475569; }
body.aj-dark .aj-empty-ground { fill: #1e293b; }

/* ============================================================================
   Results header – light background bar
   ============================================================================ */
.list-main-wrap-header.fl-wrap.fixed-listing-header {
    background: #f4f6f8;
    border-bottom: 1px solid rgba(0,0,0,0.06);
    padding: 10px 6px;
    margin-bottom: 0;
}

/* ============================================================================
   Details page – fix sidebar dropping below main content (RTL)
   ============================================================================ */
@media (min-width: 992px) {
    .gray-bg.small-padding > .container > .row {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: flex-start !important;
    }
    .gray-bg.small-padding > .container > .row > .col-md-8,
    .gray-bg.small-padding > .container > .row > .col-md-4 {
        float: none !important;
    }
    .gray-bg.small-padding > .container > .row > .col-md-8 {
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
    }
    .gray-bg.small-padding > .container > .row > .col-md-4 {
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
    .gray-bg.small-padding > .container > .row > .limit-box,
    .gray-bg.small-padding > .container > .row > .listing-carousel-wrapper {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* ============================================================================
   LightGallery – Premium Lightbox Modal Polish
   ============================================================================ */
.lg-backdrop {
    background: rgba(10, 15, 25, 0.72) !important;
    -webkit-backdrop-filter: blur(6px) !important;
    backdrop-filter: blur(6px) !important;
}
.lg-outer { z-index: 10060 !important; }
.lg-outer .lg-inner { padding: 20px; }
.lg-outer .lg-image {
    border-radius: 12px !important;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35), 0 4px 16px rgba(0, 0, 0, 0.2) !important;
    max-height: 85vh !important;
    object-fit: contain;
}
.lg-outer .lg-item { display: flex; align-items: center; justify-content: center; }
.lg-toolbar .lg-close {
    width: 44px !important; height: 44px !important; border-radius: 12px !important;
    background: rgba(255,255,255,0.12) !important; -webkit-backdrop-filter: blur(10px) !important; backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255,255,255,0.15) !important; margin: 12px !important;
    transition: background 200ms ease, transform 200ms ease !important;
}
.lg-toolbar .lg-close:hover { background: rgba(255,255,255,0.22) !important; transform: scale(1.05) !important; }
.lg-toolbar { background: transparent !important; padding: 8px !important; }
.lg-toolbar .lg-icon {
    width: 40px !important; height: 40px !important; border-radius: 10px !important;
    background: rgba(255,255,255,0.10) !important; -webkit-backdrop-filter: blur(10px) !important; backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255,255,255,0.12) !important; color: rgba(255,255,255,0.85) !important;
    margin: 0 4px !important; transition: background 200ms ease !important;
}
.lg-toolbar .lg-icon:hover { background: rgba(255,255,255,0.20) !important; color: #fff !important; }
.lg-actions .lg-prev, .lg-actions .lg-next {
    width: 48px !important; height: 48px !important; border-radius: 14px !important;
    background: rgba(255,255,255,0.12) !important; -webkit-backdrop-filter: blur(10px) !important; backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    transition: background 200ms ease, transform 200ms ease !important;
}
.lg-actions .lg-prev:hover, .lg-actions .lg-next:hover { background: rgba(255,255,255,0.22) !important; transform: scale(1.05) !important; }
.lg-counter {
    background: rgba(255,255,255,0.10) !important; -webkit-backdrop-filter: blur(10px) !important; backdrop-filter: blur(10px) !important;
    border-radius: 8px !important; padding: 6px 14px !important; font-size: 13px !important;
    color: rgba(255,255,255,0.8) !important; border: 1px solid rgba(255,255,255,0.12) !important;
}
.lg-sub-html { background: linear-gradient(transparent, rgba(0,0,0,0.5)) !important; padding: 16px 24px !important; }

/* Nav scroll alignment */
header.main-header.vis_secnav .aj-nav-eval__label { font-size: 8.5px !important; margin-bottom: 0 !important; }
header.main-header.vis_secnav .aj-nav-eval { gap: 0 !important; padding-top: 2px !important; padding-bottom: 2px !important; }

/* LISTING PAGE REFINEMENTS */
html body header.main-header .logo-holder .aj-logo-card { margin-bottom: -30px !important; }
html header.main-header .logo-holder .aj-logo-card img {
    height: 80px !important; max-height: 80px !important; width: 80px !important; max-width: 80px !important;
}
.breadcrumbs.fw-breadcrumbs.sp-brd { padding: 10px 0 !important; margin-bottom: 0 !important; }
.aj-fbar { margin-bottom: 16px !important; padding: 8px 10px !important; gap: 6px !important; border-radius: 14px !important; }
.aj-fbar__btn { height: 40px !important; min-width: 120px !important; border-radius: 10px !important; font-size: 13.5px !important; }
.aj-fbar select.aj-fbar__select,
.aj-fbar .chosen-container-single .chosen-single,
.aj-fbar .select2-container .select2-selection--single { height: 40px !important; line-height: 40px !important; }
.aj-results-header {
    display: flex !important; align-items: center !important; justify-content: space-between !important;
    padding: 10px 16px !important; margin: 0 0 16px !important; background: #f4f6f8 !important;
    border: 1px solid rgba(15,23,42,0.06) !important; border-radius: 12px !important;
    flex-wrap: nowrap !important;
}
.aj-results-sub { margin: 0 !important; font-size: 13px !important; }
.aj-results-count strong { color: #1e293b !important; font-weight: 700 !important; }
.aj-results-viewtoggle ul { background: #fff !important; border-radius: 10px !important; padding: 3px !important; box-shadow: 0 1px 4px rgba(15,23,42,0.06) !important; }
.aj-results-viewtoggle span { width: 34px !important; height: 30px !important; border-radius: 8px !important; }
.aj-results-viewtoggle span.act-grid-opt { background: var(--aj-primary, #b7cd27) !important; color: #fff !important; }

/* LOGIN / REGISTER — Premium split-card layout (AR) */
.main-register-wrap {
    min-height: 100vh !important; display: flex !important; align-items: center !important;
    justify-content: center !important; padding: 40px 20px !important; position: relative !important;
    background-size: cover !important; background-position: center !important;
    background-repeat: no-repeat !important; background-attachment: fixed !important;
}
.main-register-wrap.aj-page-login { background-image: url('/Content/img/loginbg.jpg') !important; }
.main-register-wrap.aj-page-register { background-image: url('/Content/img/amman.jpg') !important; }
.main-register-wrap:not(.aj-page-login):not(.aj-page-register) {
    background: linear-gradient(135deg, #f0f2f5 0%, #e8eaed 50%, #f4f6f8 100%) !important;
}
.main-register-wrap .reg-overlay {
    display: block !important; position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
    background: rgba(15, 23, 42, 0.55) !important; z-index: 0 !important;
}
.main-register-wrap .main-register-holder {
    position: relative !important; z-index: 1 !important; display: flex !important; max-width: 860px !important;
    width: 100% !important; min-height: 480px !important; background: #fff !important;
    border-radius: 24px !important; box-shadow: 0 20px 60px rgba(15,23,42,0.08), 0 8px 24px rgba(15,23,42,0.04) !important;
    border: 1px solid rgba(0,0,0,0.04) !important; overflow: hidden !important; margin: 0 auto !important;
    float: none !important; top: auto !important; left: auto !important; right: auto !important;
}
.main-register-wrap .main-register-wrapper { display: flex !important; width: 100% !important; float: none !important; margin-bottom: 0 !important; min-height: 480px !important; }
.main-register-wrap .main-register-header {
    flex: 0 0 280px !important; width: 280px !important; height: auto !important;
    display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important;
    background: linear-gradient(150deg, rgba(233, 236, 242, 0.96) 0%, rgba(222, 226, 234, 0.96) 100%) !important;
    background-image: linear-gradient(150deg, rgba(233, 236, 242, 0.96) 0%, rgba(222, 226, 234, 0.96) 100%), url('/Content/img/logo.png') !important;
    background-repeat: no-repeat !important;
    background-size: cover, min(230px, 78%) !important;
    background-position: center, center !important;
    padding: 32px 24px !important; position: relative !important;
    top: auto !important; left: auto !important; right: auto !important; overflow: hidden !important;
}
.main-register-wrap .main-register-header .main-register-logo,
.main-register-holder .main-register-header .main-register-logo,
.main-register-holder .main-register-logo {
    position: relative !important; z-index: 2 !important; float: none !important; width: auto !important;
    top: 0 !important; bottom: auto !important; left: auto !important; right: auto !important;
    margin-top: 0 !important; margin-bottom: 0 !important;
}
/* Gray shape behind the logo — like production */
.main-register-wrap .main-register-header .main-register-logo::before {
    content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 150px; height: 150px; border-radius: 50%;
    background: rgba(0, 0, 0, 0.02); z-index: -1; pointer-events: none;
}
.main-register-wrap .main-register-header .main-register-logo img { height: 100px !important; width: auto !important; max-width: 160px !important; object-fit: contain !important; filter: drop-shadow(0 4px 12px rgba(0,0,0,0.06)) !important; position: relative; z-index: 1; opacity: 0 !important; }
.main-register-wrap .main-register-header .main-register-bg {
    display: block !important; position: absolute !important; bottom: 0 !important;
    width: 100% !important; height: 200px !important; z-index: 0 !important; opacity: 0.18 !important;
}
.main-register-wrap .main-register-header .mrb_dec,
.main-register-wrap .main-register-header .mrb_dec2 {
    display: block !important; position: absolute !important; z-index: 0 !important;
    opacity: 0.07 !important; background: rgba(140, 160, 60, 0.3) !important; border-radius: 50% !important;
}
.main-register-wrap .main-register-header .mrb_pin {
    display: block !important; position: absolute !important; z-index: 0 !important;
    background: rgba(140, 160, 60, 0.25) !important;
}
.main-register-wrap .main-register { flex: 1 1 0 !important; display: flex !important; flex-direction: column !important; justify-content: center !important; padding: 32px 36px !important; min-height: 0 !important; float: none !important; width: auto !important; }
.main-register-wrap .main-register > .custom-form:first-child { display: flex !important; gap: 0 !important; margin-bottom: 24px !important; border-radius: 12px !important; overflow: hidden !important; border: 1.5px solid rgba(0,0,0,0.08) !important; padding: 0 !important; }
.main-register-wrap .main-register > .custom-form:first-child .log_btn { flex: 1 !important; height: 42px !important; border: none !important; border-radius: 0 !important; font-size: 14px !important; font-weight: 600 !important; cursor: pointer !important; margin: 0 !important; padding: 0 16px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; }
.main-register-wrap .main-register > .custom-form:first-child .log_btn:not(.color-bg) { background: #f8fafc !important; color: #64748b !important; }
.main-register-wrap .main-register > .custom-form:first-child .log_btn.color-bg { background: var(--aj-primary, #b7cd27) !important; color: #fff !important; box-shadow: none !important; }
.main-register-holder .tabs-container { width: 100% !important; padding: 0 !important; float: none !important; margin-top: 0 !important; }
.main-register-holder .tabs-container .custom-form { padding: 0 !important; width: 100% !important; float: none !important; }
.main-register-holder .tabs-container .tab, .main-register-holder .tabs-container .tab-content, .main-register-holder .tabs-container .first-tab { width: 100% !important; padding: 0 !important; }
.main-register-holder .main-register .custom-form { padding: 0 !important; width: 100% !important; float: none !important; }
.main-register-holder .main-register form { width: 100% !important; float: none !important; }
.main-register-holder .main-register *, .main-register-holder .main-register .fl-wrap { float: none !important; }
.main-register-holder .tabs-menu { padding: 0 !important; margin: 0 !important; }
.main-register-wrap .custom-form label { display: block !important; position: relative !important; font-size: 13px !important; font-weight: 600 !important; color: #374151 !important; margin-bottom: 0 !important; padding: 0 !important; z-index: 10 !important; text-align: right !important; }
.main-register-wrap .custom-form label .dec-icon { position: absolute !important; top: 100% !important; right: 0 !important; left: auto !important; width: 44px !important; height: 44px !important; line-height: 44px !important; margin-top: 4px !important; color: #94a3b8 !important; font-size: 14px !important; text-align: center !important; border-left: 1px solid #e5e7f2 !important; border-right: none !important; z-index: 11 !important; }
.main-register-wrap .custom-form input[type="text"], .main-register-wrap .custom-form input[type="email"], .main-register-wrap .custom-form input[type="password"], .main-register-wrap .custom-form input[type="tel"] { width: 100% !important; height: 44px !important; border-radius: 10px !important; border: 1.5px solid #e2e5ea !important; padding: 0 50px 0 14px !important; font-size: 14px !important; background: #f8fafc !important; margin-bottom: 12px !important; box-sizing: border-box !important; text-align: right !important; }
.main-register-wrap .custom-form input:focus { border-color: var(--aj-primary, #b7cd27) !important; box-shadow: 0 0 0 3px rgba(183,205,39,0.12) !important; background: #fff !important; }
.main-register-wrap .pass-input-wrap { position: relative !important; float: none !important; width: 100% !important; }
.main-register-wrap .pass-input-wrap.fl-wrap { float: none !important; width: 100% !important; }
.main-register-wrap .pass-input-wrap .eye { position: absolute !important; top: 36px !important; inset-inline-end: 14px !important; cursor: pointer !important; color: #94a3b8 !important; z-index: 2 !important; }
.main-register-wrap .lost_password { margin-bottom: 10px !important; }
.main-register-wrap .lost_password a { font-size: 13px !important; color: var(--aj-primary-dark, #6b7a3a) !important; font-weight: 500 !important; }
.main-register-wrap .filter-tags, .main-register-wrap .filter-tags.ft-list { display: flex !important; align-items: flex-start !important; gap: 8px !important; margin-bottom: 12px !important; }
.main-register-wrap .filter-tags input[type="checkbox"] { flex-shrink: 0 !important; margin-top: 3px !important; width: 16px !important; height: 16px !important; accent-color: var(--aj-primary, #b7cd27) !important; }
.main-register-wrap .filter-tags label { font-size: 12px !important; font-weight: 500 !important; color: #64748b !important; margin-bottom: 0 !important; }
.main-register-wrap .filter-tags label a { color: var(--aj-primary-dark, #6b7a3a) !important; font-weight: 600 !important; }
.main-register-wrap .custom-form .log_btn.color-bg[type="submit"], .main-register-wrap .custom-form button[type="submit"].log_btn { height: 46px !important; width: 100% !important; border-radius: 12px !important; font-size: 15px !important; font-weight: 600 !important; background: linear-gradient(135deg, #1e293b, #334155) !important; border: none !important; color: #fff !important; cursor: pointer !important; box-shadow: 0 4px 14px rgba(15,23,42,0.12) !important; margin-top: 6px !important; display: flex !important; align-items: center !important; justify-content: center !important; }
.main-register-wrap .custom-form .log_btn.color-bg[type="submit"]:hover, .main-register-wrap .custom-form button[type="submit"].log_btn:hover { transform: translateY(-1px) !important; box-shadow: 0 6px 20px rgba(15,23,42,0.18) !important; }
.main-register-wrap .errorLogin { color: #dc2626 !important; font-size: 12px !important; margin-top: -8px !important; margin-bottom: 8px !important; }
.main-register-wrap .alert-danger { border-radius: 10px !important; background: #fef2f2 !important; color: #991b1b !important; padding: 12px 16px !important; }
@media (max-width: 768px) {
    .main-register-wrap { padding: 20px 12px !important; }
    .main-register-wrap .main-register-holder { flex-direction: column !important; max-width: 420px !important; min-height: 0 !important; }
    .main-register-wrap .main-register-wrapper { flex-direction: column !important; min-height: 0 !important; }
    .main-register-wrap .main-register-header { flex: 0 0 auto !important; width: 100% !important; padding: 24px 20px !important; }
    .main-register-wrap .main-register-header .main-register-logo img { height: 70px !important; }
    .main-register-wrap .main-register { padding: 24px 20px !important; }
}
@media (max-width: 991px) {
    .main-register-wrap { background-attachment: scroll !important; padding: 20px 12px !important; }
    .main-register-wrap .main-register-holder { flex-direction: column !important; max-width: 460px !important; min-height: 0 !important; }
    .main-register-wrap .main-register-wrapper { flex-direction: column !important; min-height: 0 !important; }
    .main-register-wrap .main-register-header {
        flex: 0 0 auto !important;
        width: 100% !important;
        min-height: 220px !important;
        padding: 24px 20px !important;
        background-size: cover, min(220px, 72%) !important;
    }
    .main-register-wrap .main-register { padding: 24px 20px !important; }
}
@media (max-width: 480px) {
    .main-register-wrap .main-register-holder { border-radius: 16px !important; }
    .main-register-wrap .main-register { padding: 20px 16px !important; }
    .main-register-wrap .main-register-header .main-register-logo img { height: 56px !important; }
}


/* ============================================================================
   Global UI/UX foundation (May 2026 go-live baseline)
   - Cross-platform focus visibility
   - Better mobile tap targets
   - Consistent card/form rhythm
   ============================================================================ */

body {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1 { font-size: clamp(1.4rem, 1rem + 1.4vw, 2.1rem); line-height: 1.35; font-weight: 700; }
h2 { font-size: clamp(1.15rem, 0.9rem + 0.8vw, 1.65rem); line-height: 1.35; font-weight: 600; }
h3 { font-size: clamp(1rem, 0.85rem + 0.5vw, 1.25rem); line-height: 1.4; font-weight: 600; }
p, li { line-height: 1.75; }

a,
button,
input,
select,
textarea,
[role="button"] {
    -webkit-tap-highlight-color: transparent;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid rgba(183, 205, 39, 0.55) !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 1px rgba(15, 23, 42, 0.2) !important;
}

.geodir-category-listing,
.listing-item,
.dashboard-content .geodir-category-listing,
.main-register-holder,
.aj-results-header {
    border-radius: 14px !important;
}

.dashboard-content .geodir-category-listing,
.listing-item .geodir-category-listing {
    transition: transform 220ms ease, box-shadow 220ms ease !important;
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
textarea,
select,
.chosen-container-single .chosen-single,
.select2-container .select2-selection--single {
    border-radius: 10px !important;
}

@media (max-width: 991px) {
    button,
    .log_btn,
    .btn,
    .aj-fbar__btn,
    .add-list,
    .aj-add-btn,
    .nav-button,
    .show-reg-form a,
    .cart-btn,
    .aj-search-trigger {
        min-height: 44px !important;
    }

    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="tel"],
    input[type="number"],
    select,
    textarea {
        min-height: 44px !important;
        font-size: 16px !important; /* avoids iOS zoom-in */
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ============================================================================
   Phase 2 UI polish (May 2026)
   - Hero readability + CTA hierarchy
   - Property card rhythm and metadata clarity
   - Button state consistency and mobile comfort
   ============================================================================ */

.aj-hero-overlay {
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.10) 0%, rgba(15, 23, 42, 0.35) 100%) !important;
}

.aj-hero-content {
    position: relative;
    z-index: 2;
    max-width: min(860px, 92vw);
    margin-inline: auto;
}

.aj-hero-content .aj-hero-title {
    color: #ffffff !important;
    letter-spacing: 0.2px;
    line-height: 1.16 !important;
    margin-bottom: 12px !important;
    text-shadow: 0 3px 14px rgba(2, 6, 23, 0.45);
}

.aj-hero-content .aj-hero-subtitle {
    color: rgba(255, 255, 255, 0.94) !important;
    max-width: 64ch;
    margin-inline: auto;
    line-height: 1.65 !important;
    text-shadow: 0 2px 10px rgba(2, 6, 23, 0.4);
}

.btn,
.aj-fbar__btn,
.aj-view-all-wrap .aj-view-all-btn,
.single-par2 .section-title a.btn,
.single-par2 a.btn.color-bg {
    border-radius: 12px !important;
    min-height: 44px;
    font-weight: 600;
    letter-spacing: 0.15px;
    transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease, color 180ms ease, border-color 180ms ease;
}

.btn:hover,
.aj-fbar__btn:hover,
.aj-view-all-wrap .aj-view-all-btn:hover,
.single-par2 .section-title a.btn:hover,
.single-par2 a.btn.color-bg:hover {
    transform: translateY(-1px);
}

.btn:focus-visible,
.aj-fbar__btn:focus-visible,
.aj-view-all-wrap .aj-view-all-btn:focus-visible {
    outline: 3px solid rgba(183, 205, 39, 0.62) !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.22) !important;
}

.btn:disabled,
.btn[aria-disabled="true"],
.aj-fbar__btn:disabled,
.aj-fbar__btn[aria-disabled="true"] {
    opacity: 0.56 !important;
    filter: saturate(0.7);
    cursor: not-allowed !important;
    transform: none !important;
    box-shadow: none !important;
}

.gallery-item .geodir-category-listing,
.listing-item .geodir-category-listing {
    border-radius: 16px !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05), 0 10px 28px rgba(15, 23, 42, 0.07);
    transition: transform 260ms cubic-bezier(.2, .8, .2, 1), box-shadow 260ms cubic-bezier(.2, .8, .2, 1), border-color 220ms ease;
}

.gallery-item:hover .geodir-category-listing,
.listing-item:hover .geodir-category-listing {
    transform: translateY(-4px);
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08), 0 18px 40px rgba(15, 23, 42, 0.12);
}

.gallery-item .geodir-category-content,
.listing-item .geodir-category-content {
    padding: 20px 20px 18px !important;
    gap: 4px;
}

.gallery-item .geodir-category-content .title-sin_item,
.listing-item .geodir-category-content .title-sin_item,
.gallery-item .geodir-category-content h2.title-sin_item,
.listing-item .geodir-category-content h2.title-sin_item {
    font-size: 15.5px !important;
    line-height: 1.45 !important;
    margin-bottom: 10px !important;
    color: #1f2937 !important;
    overflow-wrap: anywhere;
}

.gallery-item .geodir-category-content .title-sin_item a,
.listing-item .geodir-category-content .title-sin_item a {
    color: #1f2937 !important;
}

body.aj-dark .gallery-item .geodir-category-content .title-sin_item a,
body.aj-dark .listing-item .geodir-category-content .title-sin_item a {
    color: #f1f5f9 !important;
}

.gallery-item .geodir-category-content_price,
.listing-item .geodir-category-content_price {
    margin-bottom: 12px !important;
}

.gallery-item .geodir-category-content-details ul,
.listing-item .geodir-category-content-details ul {
    gap: 14px;
    flex-wrap: wrap;
}

.gallery-item .geodir-category-content-details li,
.listing-item .geodir-category-content-details li {
    font-size: 13.5px !important;
    line-height: 1.35;
}

.gallery-item .geodir-category-location,
.listing-item .geodir-category-location {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-inline-end: 12px;
}

@media (max-width: 991px) {
    .aj-hero-content .aj-hero-title {
        line-height: 1.2 !important;
    }

    .aj-hero-content .aj-hero-subtitle {
        max-width: 90%;
    }

    .gallery-item .geodir-category-content,
    .listing-item .geodir-category-content,
    .listing-item.has_one_column .geodir-category-content,
    .listing-item-container.aj-list-view .listing-item .geodir-category-content {
        padding: 16px 16px 15px !important;
    }

    .gallery-item .geodir_save-btn,
    .gallery-item .compare-btn,
    .listing-item .geodir_save-btn,
    .listing-item .compare-btn {
        width: 40px !important;
        height: 40px !important;
    }
}

@media (max-width: 600px) {
    .btn,
    .aj-fbar__btn,
    .aj-view-all-wrap .aj-view-all-btn {
        width: 100%;
    }

    .gallery-item .geodir-category-content-details ul,
    .listing-item .geodir-category-content-details ul {
        gap: 10px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gallery-item .geodir-category-listing,
    .listing-item .geodir-category-listing,
    .gallery-item .geodir-category-img img,
    .listing-item .geodir-category-img img,
    .btn,
    .aj-fbar__btn,
    .aj-view-all-wrap .aj-view-all-btn {
        transition: none !important;
        transform: none !important;
    }
}

/* ============================================================================
   49. FOOTER UI/UX FIXES — layout, responsiveness, bottom bar, FABs
   (May 2026)
   ============================================================================ */

/* ---------- 49a. FOOTER LAYOUT ALIGNMENT ---------- */
footer.main-footer .footer-inner > .container > .row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}
footer.main-footer .footer-inner > .container > .row > [class*="col-"] {
    display: flex;
    flex-direction: column;
}
footer.main-footer .footer-widget {
    flex: 1;
}

/* ---------- 49b. TYPOGRAPHY HIERARCHY ---------- */
footer.main-footer .footer-widget-title h2 {
    font-size: 16px;
    font-weight: 700;
    color: #1e293b !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--aj-primary, #b7cd27);
    display: inline-block;
}
footer.main-footer .footer-widget-title h4 {
    font-size: 16px;
    font-weight: 700;
    color: #1e293b !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--aj-primary, #b7cd27);
    display: inline-block;
}
footer.main-footer .footer-list li {
    margin-bottom: 8px;
}
footer.main-footer .footer-list li a {
    font-size: 14px;
    line-height: 1.6;
    color: #475569 !important;
}
footer.main-footer .footer-list li a:hover {
    color: var(--aj-primary, #b7cd27) !important;
}
footer.main-footer .footer-contacts li {
    margin-bottom: 10px;
    line-height: 1.5;
}
footer.main-footer .footer-contacts li span {
    font-size: 13px;
    color: #64748b !important;
    display: block;
    margin-bottom: 2px;
}
footer.main-footer .footer-contacts li span i {
    color: var(--aj-primary, #b7cd27) !important;
    margin-inline-end: 6px;
    width: 16px;
    text-align: center;
}
footer.main-footer .footer-contacts li a {
    font-size: 14px;
    font-weight: 600;
    color: #1e293b !important;
    word-break: break-word;
}
footer.main-footer .footer-contacts li a:hover {
    color: var(--aj-primary, #b7cd27) !important;
}
footer.main-footer .fw_hours {
    margin-top: 8px;
}
footer.main-footer .fw_hours span {
    font-size: 13.5px;
    color: #64748b !important;
}
footer.main-footer .fw_hours strong {
    color: #1e293b !important;
    font-weight: 600;
}

/* ---------- 49c. CONTACT SECTION ALIGNMENT ---------- */
footer.main-footer .footer-social {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid rgba(15, 23, 42, 0.08);
}
footer.main-footer .footer-social .footer-widget-title p {
    font-size: 13.5px;
    color: #475569 !important;
    margin-bottom: 12px;
    line-height: 1.6;
}
footer.main-footer .footer-social .footer-widget-title p i {
    color: var(--aj-primary, #b7cd27) !important;
    margin-inline-end: 6px;
}
footer.main-footer .footer-social .footer-widget-title p a {
    color: #1e293b !important;
    font-weight: 500;
}
footer.main-footer .footer-social .footer-widget-title p a:hover {
    color: var(--aj-primary, #b7cd27) !important;
}
footer.main-footer .footer-social .footer-widget-title h2 {
    font-size: 15px;
    margin-bottom: 14px;
    padding-bottom: 0;
    border-bottom: none;
}
footer.main-footer .footer-social ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    list-style: none;
    padding: 0;
    margin: 0;
}

/* ---------- 49d. SUBSCRIPTION COLUMN ---------- */
footer.main-footer .footer-widget .api-links {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 16px;
}
footer.main-footer .footer-widget .api-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
    padding: 10px 20px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
}
footer.main-footer .footer-widget > p {
    font-size: 14px;
    line-height: 1.65;
    color: #475569 !important;
}

/* ---------- 49e. SUB-FOOTER (BOTTOM BAR) ---------- */
.sub-footer.gray-bg {
    background: #eef2f7 !important;
}
.sub-footer.gray-bg .container {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding-block: 14px;
}
.sub-footer .copyright {
    font-size: 13px;
    color: #64748b !important;
    margin: 0;
    line-height: 1.5;
}
.sub-footer .floatRight {
    float: none !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
}
.sub-footer .floatRight img {
    height: 28px;
    width: auto;
    opacity: 0.7;
    transition: opacity var(--aj-transition);
}
.sub-footer .floatRight img:hover {
    opacity: 1;
}

/* ---------- 49f. FLOATING ACTION BUTTONS (secondary-nav) ---------- */
.secondary-nav {
    right: 20px !important;
    bottom: 100px !important;
    z-index: 50;
}
.secondary-nav ul {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 0;
    margin: 0;
    list-style: none;
}
.secondary-nav ul li a {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 46px !important;
    height: 46px !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.10),
                0 1px 4px rgba(15, 23, 42, 0.06) !important;
    color: #334155 !important;
    font-size: 17px;
    transition: transform 200ms ease, box-shadow 200ms ease,
                background 200ms ease, color 200ms ease !important;
}
.secondary-nav ul li a:hover {
    transform: translateY(-2px) !important;
    background: var(--aj-primary, #b7cd27) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 20px rgba(183, 205, 39, 0.30),
                0 2px 6px rgba(183, 205, 39, 0.15) !important;
    border-color: var(--aj-primary, #b7cd27) !important;
}
html[dir="rtl"] .secondary-nav {
    right: auto !important;
    left: 20px !important;
}

.to-top.color-bg {
    right: 20px !important;
    bottom: 46px !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 12px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 14px rgba(183, 205, 39, 0.25) !important;
    z-index: 50;
}
html[dir="rtl"] .to-top.color-bg {
    right: auto !important;
    left: 20px !important;
}

/* ---------- 49g. MOBILE RESPONSIVE ---------- */
@media (max-width: 991px) {
    footer.main-footer .footer-inner {
        padding-block: 40px 20px;
    }
    footer.main-footer .footer-inner > .container > .row > [class*="col-"] {
        flex: 0 0 50%;
        max-width: 50%;
        margin-bottom: 28px;
    }
}
@media (max-width: 767px) {
    footer.main-footer .footer-inner > .container > .row > [class*="col-"] {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 24px;
    }
    footer.main-footer .footer-inner > .container > .row > [class*="col-"]:last-child {
        margin-bottom: 0;
    }
    footer.main-footer .footer-widget-title h2,
    footer.main-footer .footer-widget-title h4 {
        margin-bottom: 12px;
        padding-bottom: 8px;
    }
    footer.main-footer .footer-social ul {
        justify-content: center;
    }
    footer.main-footer .footer-social {
        text-align: center;
    }
    footer.main-footer .footer-social .footer-widget-title p {
        text-align: center;
    }
    footer.main-footer .footer-social .footer-widget-title h2 {
        display: block;
        text-align: center;
    }

    .sub-footer.gray-bg .container {
        justify-content: center;
        text-align: center;
    }

    .secondary-nav {
        right: 12px !important;
        bottom: 80px !important;
    }
    html[dir="rtl"] .secondary-nav {
        left: 12px !important;
    }
    .secondary-nav ul li a {
        width: 42px !important;
        height: 42px !important;
        font-size: 15px;
    }
    .to-top.color-bg {
        right: 12px !important;
        bottom: 28px !important;
        width: 40px !important;
        height: 40px !important;
    }
    html[dir="rtl"] .to-top.color-bg {
        left: 12px !important;
    }
}
@media (max-width: 480px) {
    footer.main-footer .footer-inner {
        padding-block: 30px 16px;
    }
    footer.main-footer .footer-widget .api-links {
        flex-direction: row;
        flex-wrap: wrap;
    }
    footer.main-footer .footer-contacts li a {
        font-size: 13px;
    }
}

/* ---------- 49h. FAB footer-overlap guard ---------- */
@media (max-width: 767px) {
    footer.main-footer {
        padding-bottom: 0;
        margin-bottom: 0;
    }
    .secondary-nav,
    .to-top.color-bg {
        position: fixed !important;
    }
}

/* ---------- 49i. DARK MODE FOOTER FIXES ---------- */
body.aj-dark footer.main-footer .footer-widget-title h2,
body.aj-dark footer.main-footer .footer-widget-title h4 {
    color: #e5e7eb !important;
    border-bottom-color: var(--aj-primary, #b7cd27);
}
body.aj-dark footer.main-footer .footer-list li a,
body.aj-dark footer.main-footer .footer-contacts li a {
    color: #cbd5e1 !important;
}
body.aj-dark footer.main-footer .footer-contacts li span,
body.aj-dark footer.main-footer .fw_hours span {
    color: #94a3b8 !important;
}
body.aj-dark footer.main-footer .footer-social {
    border-top-color: rgba(255, 255, 255, 0.08);
}
body.aj-dark .sub-footer.gray-bg {
    background: var(--aj-bg-card, #1e293b) !important;
}
body.aj-dark .sub-footer .copyright {
    color: #94a3b8 !important;
}
body.aj-dark .secondary-nav ul li a {
    background: var(--aj-bg-card, #1e293b) !important;
    color: #e5e7eb !important;
    border-color: var(--aj-border, #334155) !important;
}

/* ============================================================================
   Z-INDEX NORMALIZATION & MOBILE SCROLL FIX — May 2026 hotfix
   ============================================================================ */
html body header.main-header {
    z-index: 9000 !important;
    position: relative !important;
}
html body header.main-header.aj-sticky-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
}
.aj-hero-search-section,
.hero-section {
    z-index: 1 !important;
    position: relative;
}
.aj-hero-search-card {
    z-index: 3 !important;
}

@media (max-width: 991px) {
    html, body {
        overflow-x: hidden !important;
    }
}