/* Site logo: same aspect as source (~1274×495); cap display (theme sets a wide calc() width — override here) */
header .top-nav .navbar-top .web-logo img.wedzaar-site-logo {
    display: block;
    width: auto;
    max-width: min(148px, 42vw);
    max-height: 48px;
    height: auto;
    object-fit: contain;
    object-position: left center;
}

footer .main-footer .footer-logo .theme-logo a img.wedzaar-site-logo {
    display: block;
    width: auto;
    max-width: min(168px, 55vw);
    max-height: 52px;
    height: auto;
    object-fit: contain;
    object-position: left center;
}

@media (min-width: 768px) {
    header .top-nav .navbar-top .web-logo img.wedzaar-site-logo {
        max-width: 156px;
        max-height: 52px;
    }

    footer .main-footer .footer-logo .theme-logo a img.wedzaar-site-logo {
        max-width: 175px;
        max-height: 56px;
    }
}

/* Screen-reader-only (matches Bootstrap .visually-hidden if helpers bundle omitted) */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Home hero LCP: reserve space (CLS) + cover image without relying on jQuery bg conversion. */
.home-section .home-lcp-hero-root {
    position: relative;
    background-color: #ececec;
}

.home-section .home-lcp-hero-root .home-lcp-hero-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* Side hero cards: same stable box as LCP (no jQuery .bg-img hide/show CLS). */
.home-section .home-side-hero-root {
    position: relative;
    background-color: #ececec;
}

.home-section .home-side-hero-root .home-side-hero-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* Sub-hero titles use h2 for outline; keep visual scale closer to former h3 */
.home-section .home-hero-side-title {
    font-size: calc(16px + (22 - 16) * ((100vw - 320px) / (1920 - 320)));
    line-height: 1.35;
    margin: 0;
}

/* Tagline under h1: reserve line box to reduce font-swap CLS */
.home-section .home-hero-tagline {
    min-height: 1.35em;
}

/* Header chrome: reserve icon box before Feather injects SVG */
header .navbar-top .delivery-icon {
    min-width: 2rem;
    min-height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

header .navbar-top button.search-box {
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    color: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Phone strip in header: match former h5/h6 scale when using spans */
header .top-nav .navbar-top .delivery-login-box .delivery-detail > .fw-semibold {
    font-size: inherit;
    line-height: 1.2;
}

/* Footer promo strip: titles are styled text, not document headings (avoids h3→h5 skips) */
footer .service-contain .service-box .service-detail .wedzaar-service-line {
    font-weight: 500;
    color: #222;
    margin: 0;
    font-size: inherit;
}

header .header-nav .header-nav-left .category-dropdown .category-title .wedzaar-panel-title {
    color: var(--theme-color);
    font-weight: 600;
    font-size: 1.25rem;
}

footer .sub-footer .social-link > p.text-content {
    margin-right: 10px;
    margin-bottom: 0;
}

[dir="rtl"] footer .sub-footer .social-link > p.text-content {
    margin-right: 0;
    margin-left: 10px;
}

footer .main-footer .footer-contact ul li .footer-number .contact-number > p.fw-semibold {
    margin-top: 6px;
    font-weight: 600;
    color: #222;
}

/* Mobile tab bar: stronger label contrast on theme-colored bar */
@media (max-width: 767px) {
    .mobile-menu ul li a span {
        color: #fff;
        font-weight: 600;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    }
}

/* Home category slider: correct heading order (h2 section → h3 cards) while matching theme typography */
.category-section-3 .category-box-list .category-name .wedzaar-category-title {
    font-weight: 600;
    margin: 0;
    font-size: inherit;
    line-height: inherit;
    transition: all 0.3s ease-in-out;
}

.category-section-3 .category-box-list .category-name .wedzaar-category-count {
    margin: 5px 0 0;
    color: #4a5568;
    font-size: inherit;
    line-height: inherit;
    transition: all 0.3s ease-in-out;
}

.category-section-3 .category-box-list:hover .category-name .wedzaar-category-title {
    font-weight: 700;
    color: var(--theme-color);
}

.category-section-3 .category-box-list:hover .category-name .wedzaar-category-count {
    color: #222;
}

/* First section below hero: “Book By Categories” — smaller than default theme h2 */
/* .category-section-3 .title .wedzaar-home-section-heading {
    font-size: clamp(1.05rem, 0.35vw + 1rem, 1.35rem);
    font-weight: 600;
    line-height: 1.3;
} */

/* -------------------------------------------------------------------------
   Wedzaar — stacking / overlap fixes
   The bundled theme uses very low z-index (2–9) on header chrome, offcanvas,
   and the mobile tab bar, so hero CTAs, blog cards, and transforms can paint
   above menus. Align layers with Bootstrap-like values.
   ------------------------------------------------------------------------- */

/* header .top-nav.top-header,
header.active .sticky-header {
    z-index: 1030;
} */

/* All Categories panel — keep scrollable; on desktop don’t cover the full hero */
/* @media (min-width: 768px) {
    header .header-nav .header-nav-left .category-dropdown {
        max-height: min(70vh, 520px);
        overflow-y: auto;
        overflow-x: hidden;
        z-index: 1020;
    }
} */

/* @media (max-width: 767px) {
    .category-dropdown {
        overflow-y: auto;
        z-index: 1060;
    }
} */

/* Primary mobile nav (Bootstrap offcanvas) + backdrop — above page content */
/* header .offcanvas-backdrop {
    z-index: 1040 !important;
}

@media (max-width: 1199px) {
    header .navbar-expand-xl .offcanvas,
    header .offcanvas:not(.offcanvas-end):not(.offcanvas-bottom) {
        z-index: 1055 !important;
    }
} */

/* Fixed bottom tab bar — above in-flow content, below open offcanvas/modals */
/* .mobile-menu {
    z-index: 1020 !important;
} */

/* Prevent page copy from sitting under the fixed bar (iOS safe area) */
@media (max-width: 767px) {
    body {
        padding-bottom: calc(4.75rem + env(safe-area-inset-bottom, 0px));
    }
}

/* Blog: keep featured card in a predictable stacking context (mobile compositor glitches) */
.wedzaar-blog-page .wedzaar-blog-featured {
    isolation: isolate;
    position: relative;
    z-index: 0;
}
.avatar-xs {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    object-fit: cover;
}

.avatar-sm {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
}

.avatar-md {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
}

.avatar-lg {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    object-fit: cover;
}