/*
 Theme Name: Simcha Center Theme
 Theme URI: https://thesimchacenter.com/
 Description: Custom theme for Simcha Center directory
 Author: Simcha Center
 Author URI: https://thesimchacenter.com/
 Template: listingpro
 Version: 1.0.3
 Text Domain: simchacenter-theme
*/

/* CLS FIXES (2026-02-20)
   -------------------------------------------------------------------------- */

/* 1. GALLERY SLIDER: Surgical CLS Fix (No Design Changes) 
   -------------------------------------------------------------------------- */

/* Reserve height to prevent layout jump, but don't force it with !important on everything */
.single-page-slider-container,
.app-view-new-gallery-title {
    min-height: 400px;
    position: relative;
}

@media (max-width: 767px) {

    .single-page-slider-container,
    .app-view-new-gallery-title {
        min-height: 250px;
    }
}

/* Hide extra slides before Slick initializes to prevent the "stacking" effect */
.listing-slide:not(.slick-initialized) .slide:not(:first-child),
.listing-slide-style4:not(.slick-initialized) .slide:not(:first-child),
.app-view-gallery:not(.slick-initialized) .slide-img:not(:first-child) {
    display: none !important;
}

/* DOTS FIX: Absolute positioning prevents dots from pushing content down when they wrap */
.lp-listing-slider .slick-dots,
.listing-slide-style4 .slick-dots,
.app-view-gallery .slick-dots {
    position: absolute !important;
    bottom: 10px !important;
    left: 0;
    right: 0;
    z-index: 10;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
    text-align: center;
}

/* IMAGE FIX: Use cover to fill the area as before (no black bars) */
.listing-slide .slide img,
.listing-slide-style4 .slide img,
.app-view-gallery .slide-img img {
    width: 100% !important;
    height: 400px !important;
    object-fit: cover !important;
}

@media (max-width: 767px) {

    .listing-slide .slide img,
    .listing-slide-style4 .slide img,
    .app-view-gallery .slide-img img {
        height: 250px !important;
    }
}

/* 2. MAP CONTAINER: Reserve space to prevent layout jump on Google Maps load 
   CLS reduction from 0.7+ to ~0.1 */
@media (min-width: 992px) {

    /* Target the sidebar container in various ListingPro styles */
    .post-with-map-container-right,
    .sidebar-post-classic .widget-classic-box .post-author-box {
        min-height: 500px;
        display: flex;
        flex-direction: column;
    }

    #singlepostmap {
        height: 100% !important;
        min-height: 480px;
    }
}

@media (max-width: 991px) {
    #singlepostmap {
        min-height: 300px !important;
    }
}

/* 3. COMMUNITY HIGHLIGHTS (Лампочка) — Mobile Adaptation
   -------------------------------------------------------------------------- */

/* Base: ensure the block has proper spacing inside mobile listing */
.listing-app-view .classic-post-detail-contant,
.listing-app-view .lp-community-highlights-container,
.listing-app-view .lp-founder-remark-container {
    margin: 0 15px 25px;
    padding: 0;
}

.listing-app-view .lp-community-highlights-header .lp-h4 {
    font-size: 16px;
    margin: 0 0 5px;
}

.listing-app-view .lp-community-highlights-body {
    padding: 12px 15px !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

.listing-app-view .lp-community-highlights-content {
    font-size: 14px !important;
    line-height: 1.7 !important;
}

.listing-app-view .lp-community-highlights-content p:last-child {
    margin-bottom: 0;
}

/* 4. ARCHIVE CARDS — V6 16:9 FIX
   Parent theme sets height:217px on thumbnail images → crops our 16:9 V6 cards.
   Override: force 16:9 container, let image fill naturally.
   -------------------------------------------------------------------------- */

/* Container: enforce 16:9 aspect ratio */
.classic-view-grid-thumbnail {
    aspect-ratio: 16 / 9 !important;
    overflow: hidden;
    border-radius: 5px;
}

/* Image: fill the 16:9 container, override parent's fixed 217px height */
.classic-view-grid-container .classic-view-grid-thumbnail img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    aspect-ratio: 16 / 9;
}

/* Hover zoom: keep parent behavior but within 16:9 bounds */
.classic-view-grid-container:hover .classic-view-grid-thumbnail img {
    transform: scale(1.05);
}

/* 5. ARCHIVE LAYOUT ALIGNMENT
   Align H1, description, and filter bar with the left/right edges of the card grid.
   Cards sit inside col-md-6 with 15px padding; match that for the header blocks.
   -------------------------------------------------------------------------- */

/* H1 block: removed override so it stays in its natural place (Bootstrap col-md-12 handles its 15px padding) */

/* Description block: indent left and right to exactly match the title and cards */
.post-with-map-container>.lp_term_archive_description.top-description {
    padding-left: 15px;
    padding-right: 15px;
}

/* Fine-tune vertical gap between description and filters (not too big, not too small) */
.post-with-map-container>.margin-bottom-20.margin-top-30 {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

/* 6. MOBILE 2-COLUMN ARCHIVE GRID — V6 16:9 FIX
   Template: mobile/listing-loop-app-view.php (parent theme)
   Problem: parent theme sets a square/tall container for .show-img → our 16:9 V6 cards
   get cropped left+right ("et Bagels" instead of "Sweet Bagels").
   Fix: enforce 16:9 on the thumbnail container inside .lp-grid-app-view cards.
   -------------------------------------------------------------------------- */

/* The thumbnail wrapper inside each 2-column card */
.lp-grid-app-view .lp-grid-box-thumb .show-img {
    aspect-ratio: 16 / 9 !important;
    overflow: hidden;
    width: 100%;
    display: block;
    border-radius: 5px 5px 0 0;
}

/* The image itself: fill the 16:9 box, no distortion, centered crop */
.lp-grid-app-view .lp-grid-box-thumb .show-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block;
}

/* Prevent the parent theme from overriding with a fixed height */
.lp-grid-app-view .lp-grid-box-thumb {
    overflow: hidden;
}

/* 7. CARD UI FIXES — OVERLAY, BOOKMARK, DESKTOP ICONS
   -------------------------------------------------------------------------- */

/* 7a. MOBILE — Remove dark overlay (rgba 0.5) from mobile 2-col archive cards.
        Parent rule: .listing-app-view .grid_view .lp-grid-box-thumb div a:before
        Our V6 cards already have built-in gradient — double overlay is redundant. */
.listing-app-view .grid_view .lp-grid-box-thumb div a:before {
    background: transparent !important;
    display: none !important;
}

/* 7b. MOBILE — Move bookmark (fav) icon from top-RIGHT to top-LEFT.
        Parent: right: 13px → we override to left: 8px.
        Left side is clean and sits above the listing name, not on the medallion. */
.listing-app-view .grid_view .lp-grid-box-thumb .lp-add-to-fav {
    right: auto !important;
    left: 8px !important;
    top: 8px !important;
}

/* 7c. DESKTOP — Move heart + eye icons (.classic-view-grid-saved-options) from
        top-RIGHT (overlaps gold medallion) to top-LEFT (clean space, above title).
        Parent: top: 14px; right: 14px; → we mirror to left: 14px. */
.classic-view-grid-saved-options {
    right: auto !important;
    left: 14px !important;
}

/* 7d. DESKTOP GRID FLOAT FIX — Prevent masonry gaps 
   When listings have varying text heights, standard Bootstrap float grids
   leave empty slots (snagging). Using flexbox ensures neat rows. */
#content-grids.lp-list-page-grid {
    display: flex;
    flex-wrap: wrap;
}

#content-grids.lp-list-page-grid::before,
#content-grids.lp-list-page-grid::after {
    display: none !important;
}

#content-grids.lp-list-page-grid>.lp-grid-box-contianer {
    float: none !important;
    display: flex;
}

#content-grids.lp-list-page-grid>.lp-grid-box-contianer>.lp-grid-box {
    width: 100%;
}


/* 8. SIDEBAR WIDTH FIX — Prevent sidebar collapse/expand
   Root cause: .widget-classic-box has float:left (single-classic.css:696)
   without width → shrink-to-fit behaviour makes sidebar jump.
   Fix: force full width + word-break for long URLs/emails.
   Fixed: 2026-04-12 (Antigravity). Restored: 2026-04-19.
   -------------------------------------------------------------------------- */
.sidebar-post-classic .widget-classic-box {
    width: 100% !important;
}

.sidebar-post-classic .widget-classic-box * {
    overflow-wrap: break-word;
    word-break: break-word;
}

/* 9. Fix Hebrew RTL rendering for browser - Added by Antigravity */
.hebrew-text,
[dir="rtl"] {
    direction: rtl !important;
    unicode-bidi: isolate;
    text-align: right;
    display: inline-block;
}

@media (max-width: 768px) {
    .listing-title-container {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
    }
}

/* 5. SC-COMMUNITY-INSIGHTS — New 3-block integrated Community Insights
   Replicates the original Лампочка styling from community-highlights.php
   -------------------------------------------------------------------------- */
.sc-community-insights {
    background: #fff;
    border: 1px solid #eee;
    border-left: 4px solid #d4943a;
    padding: 15px 20px;
    margin-top: 5px;
    margin-bottom: 15px;
    border-radius: 4px;
    color: #444;
    font-size: 15px;
    line-height: 1.8;
}

/* Mobile adaptation */
.listing-app-view .sc-community-insights {
    padding: 12px 15px;
    font-size: 14px;
    line-height: 1.7;
}

/* ── 3-Block Content Paragraph Spacing (Antigravity) ──────────────── */
/* Block 1: Description (post_content rendered by the_content()) */
.post-detail-content p {
    margin-bottom: 1em;
}

/* Block 2: Community Insights (Лампочка) */
.lp-community-highlights-content p {
    margin-bottom: 1em;
}

/* Block 3: Founder's Remark */
.lp-founder-remark-content p {
    margin-bottom: 1em;
}

/* Also handle the sc-community-insights div used by inline post_content blocks */
.sc-community-insights p {
    margin-bottom: 1em;
}

/* Remove margin from last paragraph so we don't get extra space at block end */
.post-detail-content p:last-child,
.lp-community-highlights-content p:last-child,
.lp-founder-remark-content p:last-child,
.sc-community-insights p:last-child {
    margin-bottom: 0;
}

/* 10. MULTI-RATING DROPDOWN — 5 Stars in a Row
   Parent theme sets width:165px which is too narrow when review-post
   enlarges stars to 27px. Widen and force horizontal layout.
   -------------------------------------------------------------------------- */

/* Desktop: widen the dropdown container */
.lp-multi-star-wrap {
    width: 280px !important;
    left: -200px !important;
}

/* Each rating field: label and stars side by side */
.lp-multi-star-wrap .lp-multi-star-field {
    display: flex !important;
    align-items: center;
    white-space: nowrap;
}

/* Label: fixed width, no shrink */
.lp-multi-star-wrap label {
    width: 90px !important;
    flex-shrink: 0;
    font-size: 12px;
}

/* Stars container: inline, no wrapping */
.lp-multi-star-wrap .lp-multi-star-field p {
    display: inline-flex !important;
    align-items: center;
    flex-wrap: nowrap;
    margin-bottom: 0;
}

/* Stars inside review-post: 5 in a row, slightly smaller */
.review-post .lp-multi-star-wrap i {
    font-size: 18px !important;
    width: 22px !important;
    height: 22px !important;
    line-height: 22px !important;
}

/* Mobile (app-view): same fix */
.listing-app-view2 .lp-multi-star-wrap {
    width: 280px !important;
    left: auto !important;
    right: 0;
}


/* 11. HEADER DESKTOP VERTICAL ALIGNMENT — margin-top:10px REMOVED by Claude 2026-04-22.
   Gemini added it for alignment but it pushed the search bar down after cache cleared. */

/* 12. V6 SMART CARDS - HOVER POP-OUT EXPERIMENT */
/* Отключаем дефолтный зум картинки вовнутрь (чтобы не обрезались края) */
.classic-view-grid-container:hover .classic-view-grid-thumbnail img {
    transform: scale(1) !important;
}

/* Готовим контейнер-визитку к плавному выпрыгиванию */
.classic-view-grid-container .classic-view-grid-thumbnail {
    transform-origin: bottom center;
    /* Якорь на нижней грани */
    transition: all 0.25s ease-in-out;
    position: relative;
    z-index: 1;
}

/* Сам эффект: прыжок вперед, убирание закруглений, глубокая тень */
.classic-view-grid-container:hover .classic-view-grid-thumbnail {
    transform: scale(1.08) !important;
    z-index: 100 !important;
    border-radius: 0 !important;
    overflow: visible !important;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2) !important;
}

/* Сбрасываем скругления самой картинке, чтобы она стала острой как визитка */
.classic-view-grid-container:hover .classic-view-grid-thumbnail img {
    border-radius: 0 !important;
}

/* FIX HOVER Z-INDEX ISSUE */
.classic-view-grid-container:hover,
.lp-grid-box-contianer:hover {
    z-index: 999 !important;
    position: relative;
}

/* Dead .wpcf7-form-old block removed by Claude 2026-04-22 (superseded by .wpcf7-form below) */

/* CONTACT FORM - BUSINESS CARD STYLE */
.wpcf7-form,
.elementor-widget-form .elementor-widget-container>.elementor-form {
    background: #ffffff !important;
    border: 2px solid #d69e2e !important;
    border-radius: 10px !important;
    padding: 30px 40px !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1) !important;
    max-width: 600px !important;
    margin: 0 auto 30px auto !important;
    position: relative !important;
    transition: box-shadow 0.3s ease !important;
}

.wpcf7-form:hover,
.elementor-widget-form .elementor-widget-container>.elementor-form:hover {
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15) !important;
}

/* Мобильная версия */
@media (max-width: 768px) {

    .wpcf7-form,
    .elementor-widget-form .elementor-widget-container>.elementor-form {
        padding: 20px 15px !important;
        border-width: 1px !important;
        border-radius: 8px !important;
    }
}

.elementor-widget-form .elementor-button[type="submit"],
.wpcf7-form .wpcf7-submit {
    margin-top: 15px !important;
}

/* 13. DECOUPLED AD ARCHITECTURE — Surgical CLS Fix (Architect directive 2026-05-04)
   Eliminates layout shifts by enforcing rigid container heights before ad load.
   -------------------------------------------------------------------------- */

/* Desktop: Standard Leaderboard (728x90) */
.sc-ad-container {
    min-height: 90px;
    overflow: hidden;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sc-ad-container img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

@media (max-width: 767px) {

    /* Mobile: Standard Square (300x250) */
    .sc-ad-container {
        min-height: 250px !important;
        max-height: 250px !important;
        overflow: hidden !important;
        margin: 10px 0 !important;
    }

    /* Force rigid height on the AdSense block itself */
    .sc-ad-container .adsbygoogle,
    #content-grids .adsbygoogle {
        height: 250px !important;
        min-height: 250px !important;
        max-height: 250px !important;
        overflow: hidden !important;
    }

    /* Specialized ad container (if used) */
    .promoted-listings-inline {
        align-self: flex-start !important;
        flex: 0 0 100% !important;
        max-height: 250px !important;
        overflow: hidden !important;
        margin: 10px 0 !important;
    }
}

/* Kill technical row-break divs */
.lp-ad-row-break {
    display: none !important;
}

/* 14. MOBILE LISTING — Tab Content Top Spacing
   The Description heading sticks to the tab bar (Description | Details).
   Add breathing room between tabs and content only on mobile app-view.
   -------------------------------------------------------------------------- */
.listing-app-view .listing-tabs.app-view .tab-content .tab-pane {}

/* 15. SELECT2 SEARCH FIELD STYLING SYNC (DESKTOP)
   Synchronize "Where" field styles with "What" field.
   -------------------------------------------------------------------------- */
/* Fix background, border, and height for the Where field ONLY ON HOME PAGE */
body.home .lp-search-bar .select2-container--default .select2-selection--single {
    background-color: #ffffff !important;
    border: none !important;
    border-radius: 0 4px 4px 0 !important;
    height: 100% !important;
    min-height: 46px !important;
    display: flex !important;
    align-items: center !important;
    box-shadow: none !important;
    outline: none !important;
}

/* Fix text alignment and color */
body.home .lp-search-bar .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #444 !important;
    padding-left: 15px !important;
    line-height: normal !important;
    width: 100%;
}

/* Remove the default Select2 dropdown arrow */
body.home .lp-search-bar .select2-container--default .select2-selection--single .select2-selection__arrow {
    display: none !important;
}

/* ЕДИНЫЙ СТИЛЬ — оба крестика FA6 Solid (Единственный источник истины) */
.lp-search-bar .select2-container--default .select2-selection--single {
    position: relative !important;
}
.lp-search-bar i.cross-search-q,
.lp-search-bar .select2-container--default .select2-selection--single .select2-selection__clear {
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    font-style: normal !important;
    font-variant: normal !important;
    text-rendering: auto !important;
    font-size: 14px !important;
    color: #14233A !important;
    opacity: 0.7;
    transition: all 0.2s ease-in-out;
    line-height: 1 !important;
    cursor: pointer !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.lp-search-bar i.cross-search-q:hover,
.lp-search-bar .select2-container--default .select2-selection--single .select2-selection__clear:hover {
    color: #D69E2E !important;
    opacity: 1;
}
.lp-search-bar .select2-container--default .select2-selection--single .select2-selection__clear {
    position: absolute !important;
    right: 8px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    height: auto !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    float: none !important;
    z-index: 99 !important;
}
.lp-search-bar .select2-container--default .select2-selection--single .select2-selection__clear::before {
    content: "\f057" !important;
}

/* Fix wrapper to prevent jumping or weird borders */
body.home .lp-search-bar .select2-container {
    width: 100% !important;
    border: none !important;
    outline: none !important;
}

/* Fix dropdown list styles */
.select2-dropdown {
    border: 1px solid #e5e5e5 !important;
    border-radius: 0 0 4px 4px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
    margin-top: 0 !important;
    /* Prevent it from shifting up */
}

/* Style the Select2 options to look like ListingPro's native chosen */
.select2-results__option {
    padding: 10px 15px !important;
    font-size: 14px !important;
    color: #444 !important;
    border-bottom: 1px solid #f9f9f9 !important;
}

.select2-results__option--highlighted[aria-selected] {
    background-color: #f5f5f5 !important;
    color: #444 !important;
}

/* Format hyphens for sub-locations nicely */
.select2-results__option[aria-selected="true"] {
    background-color: #eaf3fb !important;
}

/* 16. DYNAMIC SPLIT MENU (HEADER STYLE 9)
   -------------------------------------------------------------------------- */
@media (min-width: 1024px) {
    body.home .lp-header-full-width .lp-menu-bar .row {
        display: flex !important;
        align-items: center !important;
    }

    body.home .simchacenter-right-menu {
        float: left !important;
        display: inline-block !important;
        margin-right: 20px !important;
    }

    body.home .simchacenter-right-menu .lp-menu {
        display: block !important;
    }

    body.home .lp-menu-container,
    body.home .header-right-panel {
        display: flex !important;
        align-items: center !important;
        padding-top: 0 !important;
        margin-top: 0 !important;
    }
}

/* MAGNETIC MENU DIRECTIVE (Added 14.05.2026) */
@media (min-width: 1024px) {
    /* Left Menu: Push to the right, towards the logo */
    body.home .col-md-5.lp-menu-container:not(.pull-right) {
        justify-content: flex-end !important;
        padding-right: 40px !important; /* Gap before logo */
    }
    
    body.home .col-md-5.lp-menu-container:not(.pull-right) .left-section-menu-outer {
        margin-left: auto !important; /* Force to the right edge */
        width: 100% !important;
        display: block !important;
    }

    /* Target the top-level UL to align its LI children to the right */
    body.home .col-md-5.lp-menu-container:not(.pull-right) .lp-menu.menu ul:not(.sub-menu) {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: flex-end !important;
        width: 100% !important;
    }

    /* Disable float on the top-level LI items so flexbox can control their alignment */
    body.home .col-md-5.lp-menu-container:not(.pull-right) .lp-menu.menu ul:not(.sub-menu) > li {
        float: none !important;
    }

    /* Right Menu Container: Pull to the left, towards the logo */
    body.home .header-right-panel .lp-menu-container {
        justify-content: flex-start !important;
        padding-left: 40px !important; /* Gap after logo */
    }
    
    body.home .header-right-panel .simchacenter-right-menu {
        margin-right: auto !important; /* Force to the left edge */
        float: left !important;
    }
}

body.home .header-right-panel .pull-right {
    float: none !important;
    display: flex !important;
    align-items: center !important;
}

/* Fix for logo vertical alignment */
body.home .lp-logo-st {
    margin: 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 80px !important;
}

body.home .lp-logo-st img {
    max-height: 50px !important;
    width: auto !important;
}