/*
 Theme Name:   My Listing Child
 Theme URI:    http://mylisting.27collective.net/my-city/
 Description:  MyListing Child Theme
 Author:       Admin
 Author URI:   https://127.0.01/
 Template:     my-listing
 Version:      1.1
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:         one-column, two-columns, three-columns, left-sidebar, right-sidebar, grid-layout, custom-menu, custom-logo, featured-images, footer-widgets, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready
 Text Domain:  my-listing-child
*/

/* ==========================================================================
   EXPLORE & SIDEBAR TAXONOMY CARDS – Ultimate 2-Column Grid Layout
   ========================================================================== */

/* Container padding & clearance for 83px fixed bottom navbar */
html body #explore-taxonomy-tab,
html body .c27-explore-categories,
html body .finder-search,
html body .finder-search .listing-cat-tab,
html body .finder-listings {
    padding: 0 6px 110px 6px !important;
}

/* Force elements with display:none in style attribute to stay hidden */
html body #explore-taxonomy-tab div.loader-bg[style*="display: none"],
html body #explore-taxonomy-tab div.loader-bg[style*="display:none"],
html body .c27-explore-categories div.loader-bg[style*="display: none"],
html body .c27-explore-categories div.loader-bg[style*="display:none"],
html body .finder-search div.loader-bg[style*="display: none"],
html body .finder-search div.loader-bg[style*="display:none"],
html body #explore-taxonomy-tab [style*="display: none"],
html body #explore-taxonomy-tab [style*="display:none"],
html body .c27-explore-categories [style*="display: none"],
html body .c27-explore-categories [style*="display:none"],
html body .finder-search [style*="display: none"],
html body .finder-search [style*="display:none"],
.loader-bg.loader-hidden {
    display: none !important;
}

/* Ensure outer wrapper containers span full width */
html body #explore-taxonomy-tab > div,
html body #explore-taxonomy-tab > div > span,
html body .c27-explore-categories > div,
html body .c27-explore-categories > div > span,
html body .finder-search .listing-cat-tab > div,
html body .finder-search .listing-cat-tab > div > span {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Fix fc-search container in active term to fit Search, Back, and Close buttons side-by-side */
html body #explore-taxonomy-tab .active-term .form-group.fc-search,
html body .c27-explore-categories .active-term .form-group.fc-search,
html body .finder-search .active-term .form-group.fc-search {
    display: flex !important;
    flex-direction: row-reverse !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    margin-bottom: 15px !important;
    width: 100% !important;
}

/* Search button inside active-term header */
html body #explore-taxonomy-tab .active-term .form-group.fc-search .c27-explore-search-button,
html body .c27-explore-categories .active-term .form-group.fc-search .c27-explore-search-button,
html body .finder-search .active-term .form-group.fc-search .c27-explore-search-button {
    flex: 1 1 auto !important;
    width: auto !important;
    margin: 0 !important;
}

/* Back button inside active-term header (e.g. Back from Coimbatore / Washermenpet) */
html body #explore-taxonomy-tab .active-term .taxonomy-back-btn,
html body .c27-explore-categories .active-term .taxonomy-back-btn,
html body .finder-search .active-term .taxonomy-back-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 auto !important;
    width: auto !important;
    padding: 10px 16px !important;
    margin: 0 !important;
    background: #f4f4f8 !important;
    color: #333447 !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    text-decoration: none !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Top-level Back to filters button (when activeTermId === 0) */
html body #explore-taxonomy-tab .taxonomy-back-btn:not(.active-term .taxonomy-back-btn),
html body .c27-explore-categories .taxonomy-back-btn:not(.active-term .taxonomy-back-btn),
html body .finder-search .taxonomy-back-btn:not(.active-term .taxonomy-back-btn) {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: 11px 16px !important;
    margin-bottom: 12px !important;
    background: #f4f4f8 !important;
    color: #333447 !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    text-decoration: none !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08) !important;
    opacity: 1 !important;
    visibility: visible !important;
    clear: both !important;
}

/* 2-Column Grid Layout ONLY for real listing-cat cards (excluding loaders) */
html body #explore-taxonomy-tab .listing-cat:not(.listing-cat-loading),
html body #c27-explore-listings .c27-explore-categories .listing-cat:not(.listing-cat-loading),
html body .finder-search .c27-explore-categories .listing-cat:not(.listing-cat-loading),
html body .finder-search .listing-cat:not(.listing-cat-loading),
html body .finder-search .listing-cat-tab .listing-cat:not(.listing-cat-loading),
html body .c27-explore-categories .listing-cat:not(.listing-cat-loading) {
    width: calc(50% - 6px) !important;
    min-width: calc(50% - 6px) !important;
    max-width: calc(50% - 6px) !important;
    height: 100px !important;
    min-height: 100px !important;
    margin: 0 3px 8px 3px !important;
    float: left !important;
    box-sizing: border-box !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    position: relative !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15) !important;
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.2s ease !important;
    background-color: #2b2c3a !important;
}

/* Clear floats after cards */
html body #explore-taxonomy-tab::after,
html body .c27-explore-categories::after,
html body #explore-taxonomy-tab div::after,
html body .c27-explore-categories div::after,
html body #explore-taxonomy-tab span::after,
html body .c27-explore-categories span::after {
    content: "" !important;
    display: table !important;
    clear: both !important;
}

/* Active / press animation */
html body #explore-taxonomy-tab .listing-cat:active,
html body .c27-explore-categories .listing-cat:active,
html body .finder-search .listing-cat:active {
    transform: scale(0.96) !important;
}

/* Background image & fallback */
html body #explore-taxonomy-tab .listing-cat .lc-background,
html body .c27-explore-categories .listing-cat .lc-background,
html body .finder-search .listing-cat .lc-background {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-size: cover !important;
    background-position: center !important;
    background-color: #2d2e3e !important;
    transition: transform 0.3s ease !important;
}

html body #explore-taxonomy-tab .listing-cat:hover .lc-background,
html body .c27-explore-categories .listing-cat:hover .lc-background {
    transform: scale(1.05) !important;
}

/* Dark gradient overlay for text legibility */
html body #explore-taxonomy-tab .listing-cat .overlay,
html body .c27-explore-categories .listing-cat .overlay,
html body .finder-search .listing-cat .overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 0.65 !important;
    background: linear-gradient(
        180deg,
        rgba(15, 15, 25, 0.2) 0%,
        rgba(10, 10, 20, 0.88) 100%
    ) !important;
    z-index: 1 !important;
}

/* Bookmark / category icon styling */
html body #explore-taxonomy-tab .listing-cat .lc-icon,
html body .c27-explore-categories .listing-cat .lc-icon,
html body .finder-search .listing-cat .lc-icon {
    position: absolute !important;
    top: 8px !important;
    left: 10px !important;
    right: auto !important;
    width: auto !important;
    height: auto !important;
    text-align: left !important;
    transform: none !important;
    z-index: 2 !important;
}

html body #explore-taxonomy-tab .listing-cat .lc-icon i,
html body .c27-explore-categories .listing-cat .lc-icon i,
html body .finder-search .listing-cat .lc-icon i {
    font-size: 18px !important;
    color: rgba(255, 255, 255, 0.85) !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.6) !important;
}

html body #explore-taxonomy-tab .listing-cat .lc-icon img,
html body .c27-explore-categories .listing-cat .lc-icon img,
html body .finder-search .listing-cat .lc-icon img {
    width: 20px !important;
    height: 20px !important;
    object-fit: contain !important;
}

/* Info container: Title & Listing count */
html body #explore-taxonomy-tab .listing-cat .lc-info,
html body .c27-explore-categories .listing-cat .lc-info,
html body .finder-search .listing-cat .lc-info {
    position: absolute !important;
    bottom: 8px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    padding: 0 10px !important;
    text-align: left !important;
    z-index: 2 !important;
    pointer-events: none !important;
}

/* Card title */
html body #explore-taxonomy-tab .listing-cat .lc-info h4,
html body .c27-explore-categories .listing-cat .lc-info h4,
html body .finder-search .listing-cat .lc-info h4 {
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    margin: 0 0 2px 0 !important;
    color: #ffffff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    word-break: break-word !important;
}

/* Subtitle / Listing count */
html body #explore-taxonomy-tab .listing-cat .lc-info h6,
html body .c27-explore-categories .listing-cat .lc-info h6,
html body .finder-search .listing-cat .lc-info h6 {
    font-size: 10px !important;
    font-weight: 500 !important;
    margin: 0 !important;
    color: rgba(255, 255, 255, 0.8) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
    text-transform: capitalize !important;
}

/* Active selected card styling */
html body #explore-taxonomy-tab .listing-cat.active .overlay,
html body .c27-explore-categories .listing-cat.active .overlay,
html body .finder-search .listing-cat.active .overlay {
    background: linear-gradient(
        180deg,
        rgba(124, 77, 255, 0.4) 0%,
        rgba(88, 48, 180, 0.95) 100%
    ) !important;
    opacity: 0.95 !important;
}

html body #explore-taxonomy-tab .listing-cat.active,
html body .c27-explore-categories .listing-cat.active {
    box-shadow: 0 0 0 2px #7c4dff, 0 4px 12px rgba(124, 77, 255, 0.4) !important;
}

/* Browse sub-categories header */
html body #explore-taxonomy-tab h4.browse-subcategories,
html body .c27-explore-categories h4.browse-subcategories {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #444558 !important;
    margin: 6px 0 10px 0 !important;
    display: flex !important;
    align-items: center !important;
    clear: both !important;
}

html body #explore-taxonomy-tab h4.browse-subcategories i,
html body .c27-explore-categories h4.browse-subcategories i {
    margin-right: 6px !important;
    font-size: 15px !important;
}

/* Load More Container & Button 100% Full Width Styling with clearance */
html body #explore-taxonomy-tab a.buttons.button-2:not(.c27-explore-search-button),
html body .c27-explore-categories a.buttons.button-2:not(.c27-explore-search-button),
html body .finder-search a.buttons.button-2:not(.c27-explore-search-button),
html body #explore-taxonomy-tab a.button-2:not(.c27-explore-search-button),
html body .c27-explore-categories a.button-2:not(.c27-explore-search-button),
html body .finder-search a.button-2:not(.c27-explore-search-button),
html body #explore-taxonomy-tab div[key*="load-more"],
html body .c27-explore-categories div[key*="load-more"],
html body .finder-search div[key*="load-more"],
html body #explore-taxonomy-tab div > a.button-2:not(.c27-explore-search-button),
html body .c27-explore-categories div > a.button-2:not(.c27-explore-search-button),
html body .finder-search div > a.button-2:not(.c27-explore-search-button) {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    clear: both !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 12px 20px !important;
    margin: 20px 0 35px 0 !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-align: center !important;
    box-sizing: border-box !important;
    background-color: #7c4dff !important;
    color: #ffffff !important;
}

/* Clear Filters Buttons Styling */
html body .explore-head-top-filters {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

html body a.reset-head-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    padding: 6px 14px !important;
    border-radius: 6px !important;
    background: #f4f0ff !important;
    color: #7c4dff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 1px 3px rgba(124, 77, 255, 0.12) !important;
}

html body a.reset-head-btn:hover {
    background: #e9e0ff !important;
    color: #5d25e6 !important;
    transform: translateY(-1px) !important;
}

html body a.fl-head-clear-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    margin-left: auto !important;
    padding: 5px 14px !important;
    border-radius: 6px !important;
    background: #f4f0ff !important;
    color: #7c4dff !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 1px 3px rgba(124, 77, 255, 0.12) !important;
}

html body a.fl-head-clear-btn:hover {
    background: #e9e0ff !important;
    color: #5d25e6 !important;
    transform: translateY(-1px) !important;
}

html body a.reset-head-btn span {
    font-size: 13px !important;
    display: inline-block !important;
    width: auto !important;
    color: #7c4dff !important;
}

html body a.fl-head-clear-btn span {
    font-size: 12px !important;
    display: inline-block !important;
    width: auto !important;
    color: #7c4dff !important;
}

html body .explore-desktop-head {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
}


