/* =====================================================
   FIX 1: SP Page Builder "Edit Page" button — push below
   the 140px header so it does not overlap the nav bar.
   ===================================================== */
#sp-page-builder .sp-pagebuilder-page-edit {
    top: 150px !important;
}

/* =====================================================
   FIX 2: Joomla admin "Edit Module" pencil icon inside
   .jn-user-menu sits in normal flow and pushes the
   JBDirectory content below the header. Pull it out of
   flow so it has zero effect on layout height.
   ===================================================== */
.jn-user-menu .sp-module {
    position: relative;
}

.jn-user-menu .btn.btn-link.jmodedit {
    position: absolute !important;
    top: -10px;
    left: -10px;
    z-index: 10002;
}

/* =====================================================
   FIX 3: Browser default 16px bottom margin on ul.user-menu
   inflates .jbd-mod-user beyond the 70px .jn-user-menu
   container, pushing Dashboard + Add Listing below the
   header. Zero it out.
   ===================================================== */
.jn-user-menu .jbd-user-menu .user-menu {
    margin-bottom: 0;
}

/* =====================================================
   FIX 4: Pin jn-user-menu to the far-right INSIDE the gray
   header bar, inline with the main nav.

   .sp-megamenu-wrapper is already display:flex; align-items:center;
   height:100% from the template. jn-user-menu is the first child
   in the DOM. margin-left:auto pushes it to the right edge of the
   flex row without needing order hacks. flex-shrink:0 prevents it
   from being squeezed when the nav items are wide.
   ===================================================== */
.sp-megamenu-wrapper .jn-user-menu {
    margin-left: auto;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    align-self: stretch;
}

/* Ensure the inner module wrapper doesn't introduce extra height */
.sp-megamenu-wrapper .jn-user-menu .sp-module,
.sp-megamenu-wrapper .jn-user-menu .sp-module-content {
    display: flex;
    align-items: center;
    height: 100%;
}

/* On mobile (<992px) stack normally — don't interfere with offcanvas */
@media (max-width: 991.98px) {
    .sp-megamenu-wrapper .jn-user-menu {
        margin-left: 0;
        align-self: auto;
    }
}

/* =====================================================
   JBDirectory — 16:9 image containers for signage
   Covers both layout types used on search/listing pages:
   - list view:  .item-image-cover  (list-style-1/2/3)
   - grid view:  .jitem-img-wrap    (list-grid-1/2/3)
   Loaded last — wins over all JBD stylesheets.
   ===================================================== */

/* LIST VIEW — item-image-cover */
#search-results .item-image-cover,
.jbd-container .result-item .item-image-cover,
.list-style-1 .item-image-cover,
.list-style-2 .item-image-cover,
.list-style-3 .item-image-cover {
    aspect-ratio: 16 / 9 !important;
    min-height: unset !important;
    height: auto !important;
    width: 100% !important;
    position: relative !important;
    overflow: hidden !important;
    display: block !important;
}

#search-results .item-image-cover img,
.jbd-container .result-item .item-image-cover img,
.list-style-1 .item-image-cover img,
.list-style-2 .item-image-cover img,
.list-style-3 .item-image-cover img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}

#search-results .item-image-cover a,
.jbd-container .result-item .item-image-cover a,
.list-style-1 .item-image-cover a,
.list-style-2 .item-image-cover a,
.list-style-3 .item-image-cover a {
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
}

/* GRID VIEW — jitem-img-wrap */
.jbd-grid-container .jitem-card .jitem-img-wrap,
.jbd-container .jitem-card .jitem-img-wrap {
    aspect-ratio: 16 / 9 !important;
    min-height: unset !important;
    height: auto !important;
    width: 100% !important;
    overflow: hidden !important;
    position: relative !important;
    display: block !important;
}

.jbd-grid-container .jitem-card .jitem-img-wrap > img,
.jbd-container .jitem-card .jitem-img-wrap > img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    margin: 0 !important;
}

.jbd-grid-container .jitem-card .jitem-img-wrap > a,
.jbd-container .jitem-card .jitem-img-wrap > a {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 2;
}

.jbd-grid-container .jitem-card .jitem-img-wrap .card-hoverable,
.jbd-container .jitem-card .jitem-img-wrap .card-hoverable {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

/* MENU-LOGIN-OVERLAP-FIX-START */

/* Step 1: Remove any negative margin causing overflow */
.sp-megamenu-parent {
    margin: 0 !important;
}

/* Step 2: Make the nav wrapper a proper flex container */
.sp-megamenu-wrapper {
    display: flex !important;
    align-items: center;
    flex-wrap: nowrap;
}

/* Step 3: Nav ul takes available space, sits first visually, items align left */
.sp-megamenu-wrapper > ul.sp-megamenu-parent {
    order: 0 !important;
    float: none !important;
    flex: 1 1 auto !important;
    min-width: 0;
    justify-content: flex-start;
}

/* Step 4: JBDirectory Login/Cart block sits second, never shrinks */
.sp-megamenu-wrapper .jn-user-menu {
    order: 1 !important;
    float: none !important;
    flex-shrink: 0 !important;
    margin-left: 15px !important;
}

/* Step 5: Anchor all mega-dropdowns to the LEFT of their parent menu item,
   overriding template.css which sets left:auto !important; right:0px */
.sp-megamenu-parent > li > .sp-dropdown.sp-dropdown-main {
    left: 0 !important;
    right: auto !important;
}

/* MENU-LOGIN-OVERLAP-FIX-END */
