/*
Theme Name: Listeo Child
Theme URI: http://listeo.pro
Author: Purethemes
Author URI: http://purethemes.net
Description: Listeo Child Theme
Version: 1.0
Template: listeo
Text Domain: listeo-child
*/

@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 300;
    src: url('./fonts/Poppins-Light.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    src: url('./fonts/Poppins-Regular.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    src: url('./fonts/Poppins-Medium.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    src: url('./fonts/Poppins-SemiBold.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    src: url('./fonts/Poppins-Bold.ttf') format('truetype');
    font-display: swap;
}

/* Enforce Poppins font-family site-wide (size/weight/color remain flexible) */
/* NOTE: span, div, a are EXCLUDED to prevent breaking icon fonts */
body,
h1, h2, h3, h4, h5, h6,
p,
input, textarea, select, button,
label, .button,
.main-menu ul li a,
.elementor-widget,
.elementor-heading-title,
.elementor-widget-text-editor p,
.listing-item-content h3,
.listing-item-content .listing-title {
  font-family: "Poppins", sans-serif;
}

/* NOTE: Removed "font-family: inherit !important" protection rule - it was
   causing icons to inherit Poppins from parent elements and break */

/* Ensure Font Awesome icons use their proper font */
.fa, .fab, .far, .fas, .fal, .fad, .fat,
i[class^="fa-"], i[class*=" fa-"],
[class^="icon-"], [class*=" icon-"] {
  font-family: "Font Awesome 5 Free", "Font Awesome 5 Brands", "Font Awesome 5 Pro", "FontAwesome", "fontello" !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: inline-block;
  font-style: normal !important;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
}

/* Simple Line Icons - Listeo dashboard menu */
[class^="sl "], [class*=" sl-"], .sl,
i[class^="sl-"], i[class*=" sl-"] {
  font-family: "Simple-Line-Icons", "simple-line-icons" !important;
}

/* Elementor icons - editor controls and widgets */
.eicon, [class^="eicon-"], [class*=" eicon-"] {
  font-family: "eicons" !important;
}

/* Fix for solid icons */
.fas, .fa-solid {
  font-weight: 900 !important;
}

/* Fix for regular icons */
.far, .fa-regular {
  font-weight: 400 !important;
}

/* Fix for light icons */
.fal, .fa-light {
  font-weight: 300 !important;
}

/* Fix for brand icons */
.fab, .fa-brands {
  font-weight: 400 !important;
}

/* Airbnb / Bookd Style Customizations */

/* Hide Date Field from Homepage Search Form */
.main-search-input-item.date-range {
    display: none !important;
}

/* FLEXBOX LAYOUT FIX - Works WITH Bootstrap .row */
#listeo-listings-container.row {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-left: -15px !important;
    margin-right: -15px !important;
}

/* Fix Bootstrap columns to have equal height */
#listeo-listings-container > .col-lg-4,
#listeo-listings-container > .col-md-6,
#listeo-listings-container > .col-lg-6 {
    display: flex !important;
    flex-direction: column !important;
    padding: 15px !important;
    margin-bottom: 30px !important;
}

/* Force 3 cards per row on explore page */
#listeo-listings-container > .col-lg-6 {
    flex: 0 0 33.333333% !important;
    max-width: 33.333333% !important;
}

/* Responsive: 2 per row on medium screens */
@media (max-width: 991px) {
    #listeo-listings-container > .col-lg-6,
    #listeo-listings-container > .col-lg-4 {
        flex: 0 0 50% !important;
        max-width: 50% !important;
    }
}

/* Responsive: 1 per row on mobile */
@media (max-width: 767px) {
    #listeo-listings-container > .col-lg-6,
    #listeo-listings-container > .col-lg-4,
    #listeo-listings-container > .col-md-6 {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}

/* Make the anchor fill the column height */
.listing-item-container.airbnb-style {
    box-shadow: none !important;
    background: transparent !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

.listing-item-container.airbnb-style .listing-item {
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08); /* Subtler shadow */
    background: #FFFDF2 !important; /* MILD YELLOWISH SHADE (Cream) */
    border: none !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    height: 100% !important;
    min-height: 370px !important; /* Minimum height as requested */
    display: flex !important;
    flex-direction: column !important;
}

.listing-item-container.airbnb-style .listing-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 15px rgba(0,0,0,0.1);
}

.listing-item-container.airbnb-style .listing-item img {
    height: 220px !important; /* Taller image for 3-col */
    width: 100% !important;
    object-fit: cover !important;
    position: relative !important;
}

.listing-item-container.airbnb-style .listing-item-content {
    background: transparent !important; /* Use parent cream bg */
    padding: 15px 18px !important;
    position: relative !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    background-image: none !important;
    text-shadow: none !important;
    flex-grow: 1; /* Pushes footer to bottom */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Ensures equal spacing */
}

/* Force Dark Text Colors */
.listing-item-container.airbnb-style .listing-item-content h3,
.listing-item-container.airbnb-style .airbnb-title {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #222222 !important;
    margin-bottom: 5px !important;
    line-height: 1.4 !important;
    text-shadow: none !important;
}

.listing-item-container.airbnb-style .airbnb-price {
    font-size: 16px;
    font-weight: 700;
    color: #FF5A5F !important;
    margin-bottom: 4px;
    text-shadow: none !important;
}

.listing-item-container.airbnb-style .airbnb-location {
    display: block;
    color: #555555 !important;
    font-size: 14px;
    margin-bottom: 15px; /* More breathing room */
    text-shadow: none !important;
}

.listing-item-container.airbnb-style .airbnb-features {
    display: flex;
    gap: 15px;
    font-size: 13px;
    color: #333333 !important; /* FORCE DARK COLOR */
    margin-top: auto;
    border-top: 1px solid #EBE9DC; /* Subtle separator matching cream */
    padding-top: 12px;
    text-shadow: none !important;
}

.listing-item-container.airbnb-style .feature-item,
.listing-item-container.airbnb-style .airbnb-features span {
    color: #333333 !important; /* Explicitly target the span */
    display: inline-flex;
    align-items: center;
}

.airbnb-features .feature-item i {
    color: #2e86de; /* Blue for trust */
    margin-right: 5px;
}

.airbnb-features .feature-item i {
    color: #2e86de; /* Blue for trust */
    margin-right: 4px;
}

/* ==========================================================================
   MODERN BOOKING WIDGET STYLES
   ========================================================================== */

/* Booking Widget Container */
.listing-widget .widget-booking,
.widget_listeo_core_booking_widget {
    background: #FFFFFF !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
    padding: 24px !important;
    border: 1px solid #F0F0F0 !important;
}

/* Widget Title */
.widget_listeo_core_booking_widget h3.widget-title {
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #222222 !important;
    margin-bottom: 20px !important;
    padding-bottom: 15px !important;
    border-bottom: 2px solid #FFD54F !important;
}

/* Form Inputs */
#form-booking input[type="text"],
#form-booking input[type="email"],
#form-booking input[type="number"],
#form-booking select,
#form-booking .panel-dropdown > a {
    border-radius: 10px !important;
    border: 1.5px solid #E0E0E0 !important;
    padding: 14px 16px !important;
    font-size: 14px !important;
    background: #FAFAFA !important;
    transition: all 0.3s ease !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

#form-booking input:focus,
#form-booking select:focus {
    border-color: #FFD54F !important;
    background: #FFFFFF !important;
    box-shadow: 0 0 0 4px rgba(255, 213, 79, 0.15) !important;
    outline: none !important;
}

/* Date Picker Styling */
#form-booking #date-picker {
    background: #FFF8E1 !important;
    border-color: #FFD54F !important;
    font-weight: 600 !important;
}

/* Time Picker Row - Side by Side */
.spottle-time-row {
    display: flex !important;
    gap: 12px !important;
    margin-bottom: 15px !important;
}

.spottle-time-row .col-lg-6 {
    flex: 1 !important;
    padding: 0 !important;
}

/* Guest Input Styling */
#form-booking .panel-dropdown {
    margin-bottom: 15px !important;
}

#form-booking .panel-dropdown > a {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    text-decoration: none !important;
    color: #333333 !important;
}

#form-booking .panel-dropdown > a .qtyTotal {
    background: #FFD54F !important;
    color: #000000 !important;
    padding: 4px 10px !important;
    border-radius: 20px !important;
    font-weight: 700 !important;
    font-size: 12px !important;
}

/* Price Summary Box */
.booking-price-summary {
    background: linear-gradient(135deg, #FFF8E1 0%, #FFFDF2 100%) !important;
    border-radius: 12px !important;
    padding: 20px !important;
    margin-top: 20px !important;
    border: 2px solid #FFD54F !important;
    clear: both !important;
    width: 100% !important;
    display: block !important;
    position: relative !important;
}

.booking-price-summary .price-row {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 10px 0 !important;
    border-bottom: 1px dashed #E0D8B8 !important;
    font-size: 14px !important;
    color: #555555 !important;
}

.booking-price-summary .price-row:last-child {
    border-bottom: none !important;
}

.booking-price-summary .price-row strong {
    color: #222222 !important;
    font-weight: 600 !important;
}

.booking-price-summary .price-row.total {
    border-bottom: none !important;
    padding-top: 15px !important;
    margin-top: 10px !important;
    border-top: 2px solid #FFD54F !important;
}

.booking-price-summary .price-row.total span {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #222222 !important;
}

.booking-price-summary .price-row.total strong {
    font-size: 22px !important;
    font-weight: 800 !important;
    color: #FF5A5F !important;
}

/* Book Now Button */
#form-booking + a.button.book-now,
.listing-widget a.button.book-now {
    background: linear-gradient(135deg, #FFD54F 0%, #FFC107 100%) !important;
    color: #000000 !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 16px 24px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(255, 193, 7, 0.3) !important;
    width: 100% !important;
    margin-top: 15px !important;
    clear: both !important;
    display: block !important;
    text-align: center !important;
}

#form-booking + a.button.book-now:hover,
.listing-widget a.button.book-now:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(255, 193, 7, 0.4) !important;
}

/* Minimum Booking Notice */
.booking-min-notice {
    text-align: center !important;
    font-size: 12px !important;
    color: #888888 !important;
    margin-top: 10px !important;
    font-style: italic !important;
    display: block !important;
    clear: both !important;
}

/* Extra Services Badge */
#form-booking .booking-services .services-counter {
    background: #FF5A5F !important;
    color: #FFFFFF !important;
}

/* Clean up badges on image */
.listing-item-container.airbnb-style .listing-small-badges-container {
    top: 15px;
    right: 15px;
    left: auto;
}

/* Remove gradient overlay from image */
.listing-item-container.airbnb-style .listing-item::before,
.listing-item-container.airbnb-style .listing-item::after {
    display: none !important;
}

.listing-item-container.airbnb-style .like-icon {
    bottom: auto;
    top: 15px;
    right: 15px; /* Adjust if conflicts with badge */
    color: #fff;
    text-shadow: 0 1px 3px rgba(0,0,0,0.3);
    z-index: 20;
}
.listing-item-container.airbnb-style .like-icon.liked {
    background-color: transparent !important;
    color: #ff385c !important;
}

/* ==========================================================================
   SPOTTLE BOOKING WIDGET - MULTI-SELECT EXTRA SERVICES
   ========================================================================== */

/* Section labels */
.spottle-section-label {
    display: block !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    color: #333333 !important;
    margin-bottom: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

/* Time field labels */
.spottle-time-label {
    display: block !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #888888 !important;
    margin-bottom: 6px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

/* Time fields row - 50/50 layout */
.spottle-time-row {
    display: flex !important;
    gap: 12px !important;
    margin-bottom: 15px !important;
    clear: both !important;
}

.spottle-time-row .spottle-time-field {
    flex: 1 !important;
    width: 50% !important;
    float: none !important;
    margin-right: 0 !important;
    padding: 0 !important;
}

/* Extra Services container */
.spottle-services-container {
    clear: both !important;
    padding-top: 15px !important;
    margin-top: 15px !important;
    border-top: 1px solid #EEEEEE !important;
}

/* ==========================================================================
   SPOTTLE BOOKING WIDGET - PACKAGE SELECTOR
   ========================================================================== */

/* Package container */
.spottle-package-container {
    clear: both !important;
    padding: 15px 0 !important;
    margin-bottom: 10px !important;
}

.spottle-package-options {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

/* Individual package option (radio style) */
.spottle-package-option {
    display: flex !important;
    align-items: center !important;
    padding: 16px 18px !important;
    background: #F8F8F8 !important;
    border: 2px solid #E0E0E0 !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    position: relative !important;
}

.spottle-package-option:hover {
    background: #FFF8E1 !important;
    border-color: #FFD54F !important;
}

.spottle-package-option.selected {
    background: linear-gradient(135deg, #FFF8E1 0%, #FFFDF2 100%) !important;
    border-color: #FFD54F !important;
    box-shadow: 0 2px 8px rgba(255, 193, 7, 0.2) !important;
}

/* Hide the actual radio button */
.spottle-package-option input[type="radio"] {
    position: absolute !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
}

/* Package content */
.spottle-package-option .package-content {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    gap: 12px !important;
}

/* Radio indicator (checkmark style) */
.package-check {
    width: 24px !important;
    height: 24px !important;
    border: 2px solid #CCCCCC !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    background: #FFFFFF !important;
    transition: all 0.2s ease !important;
}

.package-check svg {
    opacity: 0 !important;
    color: #FFFFFF !important;
    transition: opacity 0.2s ease !important;
}

.spottle-package-option.selected .package-check {
    background: #FFD54F !important;
    border-color: #FFD54F !important;
}

.spottle-package-option.selected .package-check svg {
    opacity: 1 !important;
    color: #000000 !important;
}

.spottle-package-option .package-name {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #333333 !important;
    flex-grow: 1 !important;
}

.spottle-package-option .package-price {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #4CAF50 !important;
}

.spottle-package-option[data-type="hourly"] .package-price {
    color: #FF9800 !important;
}

/* Package Dropdown Styling */
.spottle-package-dropdown {
    width: 100% !important;
    padding: 12px 40px 12px 14px !important;
    border: 1.5px solid #E0E0E0 !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 500 !important;
    background-color: #FAFAFA !important;
    transition: all 0.3s ease !important;
    cursor: pointer !important;
    color: #333333 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath fill='%23666' d='M7 10L2 5h10z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 14px !important;
    line-height: 1.5 !important;
}

.spottle-package-dropdown:hover {
    border-color: #FFD54F !important;
    background-color: #FFF8E1 !important;
}

.spottle-package-dropdown:focus {
    border-color: #FFD54F !important;
    background-color: #FFFFFF !important;
    box-shadow: 0 0 0 4px rgba(255, 213, 79, 0.15) !important;
    outline: none !important;
}

/* Base pricing info when no packages exist */
.spottle-base-pricing-info {
    padding: 14px 16px !important;
    background: #FFF8E1 !important;
    border: 1.5px solid #FFD54F !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #333333 !important;
}

.spottle-base-pricing-info p {
    margin: 0 !important;
    padding: 0 !important;
}

.spottle-service-pills {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
}

/* Individual service pill (checkbox style) */
.spottle-service-pill {
    display: flex !important;
    align-items: center !important;
    padding: 14px 16px !important;
    background: #F8F8F8 !important;
    border: 2px solid #E0E0E0 !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    position: relative !important;
}

.spottle-service-pill:hover {
    background: #FFF8E1 !important;
    border-color: #FFD54F !important;
}

.spottle-service-pill.selected {
    background: #E8F5E9 !important;
    border-color: #4CAF50 !important;
}

/* Hide the actual checkbox */
.spottle-service-checkbox {
    position: absolute !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
}

/* Pill content */
.spottle-service-pill .pill-content {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    gap: 12px !important;
}

/* Checkbox indicator */
.pill-check {
    width: 24px !important;
    height: 24px !important;
    border: 2px solid #CCCCCC !important;
    border-radius: 6px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    background: #FFFFFF !important;
    transition: all 0.2s ease !important;
}

.pill-check svg {
    opacity: 0 !important;
    color: #FFFFFF !important;
    fill: #FFFFFF !important;
    stroke: #FFFFFF !important;
    transition: opacity 0.2s ease !important;
    width: 18px !important;
    height: 18px !important;
}

.spottle-service-pill.selected .pill-check {
    background: #4CAF50 !important;
    border-color: #4CAF50 !important;
}

.spottle-service-pill.selected .pill-check svg {
    opacity: 1 !important;
    color: #FFFFFF !important;
    fill: none !important;
    stroke: #FFFFFF !important;
}

.spottle-service-pill .pill-name {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #333333 !important;
    flex-grow: 1 !important;
}

.spottle-service-pill .pill-price {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #4CAF50 !important;
}

/* Guest input container */
.spottle-guest-container {
    clear: both !important;
    padding-top: 15px !important;
    margin-top: 15px !important;
    border-top: 1px solid #EEEEEE !important;
}

/* Guest input - remove spinners */
.spottle-guest-input {
    width: 100% !important;
    padding: 14px 16px !important;
    border: 1.5px solid #E0E0E0 !important;
    border-radius: 10px !important;
    font-size: 14px !important;
    font-family: 'Poppins', sans-serif !important;
    background: #FAFAFA !important;
    transition: all 0.3s ease !important;
    -moz-appearance: textfield !important;
    appearance: textfield !important;
}

.spottle-guest-input::-webkit-outer-spin-button,
.spottle-guest-input::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

.spottle-guest-input:focus {
    border-color: #FFD54F !important;
    background: #FFFFFF !important;
    box-shadow: 0 0 0 4px rgba(255, 213, 79, 0.15) !important;
    outline: none !important;
}

/* Price Summary Box */
.spottle-price-box {
    background: linear-gradient(135deg, #FFFDF2 0%, #FFF8E1 100%) !important;
    border: 2px solid #FFD54F !important;
    border-radius: 12px !important;
    padding: 16px 20px !important;
    margin-top: 15px !important;
    clear: both !important;
    width: 100% !important;
    display: block !important;
}

.spottle-price-box .price-line {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 8px 0 !important;
    font-size: 14px !important;
    color: #555555 !important;
}

.spottle-price-box .price-line strong {
    color: #222222 !important;
    font-weight: 600 !important;
}

/* Service lines in price breakdown */
.spottle-price-box .service-line {
    background: rgba(76, 175, 80, 0.08) !important;
    margin: 4px -10px !important;
    padding: 8px 10px !important;
    border-radius: 6px !important;
}

.spottle-price-box .service-line strong {
    color: #4CAF50 !important;
}

.spottle-price-box .price-total {
    border-top: 2px solid #FFD54F !important;
    margin-top: 10px !important;
    padding-top: 12px !important;
}

.spottle-price-box .price-total span {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #222222 !important;
}

.spottle-price-box .price-total strong {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #FF5A5F !important;
}

/* Hide old elements */
.booking-estimated-cost,
.booking-estimated-discount-cost,
.booking-services {
    display: none !important;
}

/* Coupon button fix */
.listeo-booking-widget-apply_new_coupon {
    background: #333333 !important;
    color: #FFFFFF !important;
    border-radius: 8px !important;
    padding: 10px 20px !important;
    font-weight: 600 !important;
}

.listeo-booking-widget-apply_new_coupon:hover {
    background: #555555 !important;
}

/* Clear floats */
.spottle-services-container::before {
    content: "" !important;
    display: table !important;
    clear: both !important;
}

/* ============================================
   CAROUSEL CARDS - Airbnb Style (Match Explore Page)
   ============================================ */

/* Carousel Container */
.simple-slick-carousel,
.simple-fw-slick-carousel {
    margin: 0 -10px !important;
}

/* Carousel Item Wrapper */
.fw-carousel-item {
    padding: 0 10px !important;
}

/* Carousel Card - Apply Airbnb Style */
.simple-slick-carousel .listing-item-container.compact,
.simple-fw-slick-carousel .listing-item-container.compact {
    box-shadow: none !important;
    background: transparent !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

.simple-slick-carousel .listing-item-container.compact .listing-item,
.simple-fw-slick-carousel .listing-item-container.compact .listing-item {
    border-radius: 12px !important;
    overflow: hidden !important;
    position: relative !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08) !important;
    background: #FFFDF2 !important; /* Match explore page cream color */
    border: none !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    height: 100% !important;
    min-height: 340px !important;
    display: flex !important;
    flex-direction: column !important;
}

.simple-slick-carousel .listing-item-container.compact .listing-item:hover,
.simple-fw-slick-carousel .listing-item-container.compact .listing-item:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 20px rgba(0,0,0,0.12) !important;
}

/* Image Styling */
.simple-slick-carousel .listing-item-container.compact .listing-item img,
.simple-fw-slick-carousel .listing-item-container.compact .listing-item img {
    height: 200px !important;
    width: 100% !important;
    object-fit: cover !important;
    position: relative !important;
    border-radius: 12px 12px 0 0 !important;
}

/* Content Area - Move BELOW image, not overlay */
.simple-slick-carousel .listing-item-container.compact .listing-item-content,
.simple-fw-slick-carousel .listing-item-container.compact .listing-item-content {
    background: transparent !important;
    padding: 15px 18px !important;
    position: relative !important;
    bottom: auto !important;
    left: auto !important;
    width: 100% !important;
    background-image: none !important;
    text-shadow: none !important;
    flex-grow: 1 !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Title - Dark Text */
.simple-slick-carousel .listing-item-container.compact .listing-item-content h3,
.simple-fw-slick-carousel .listing-item-container.compact .listing-item-content h3 {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #222222 !important;
    margin-bottom: 6px !important;
    line-height: 1.4 !important;
    text-shadow: none !important;
    white-space: normal !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
}

/* Address/Location - Gray text */
.simple-slick-carousel .listing-item-container.compact .listing-item-content span,
.simple-fw-slick-carousel .listing-item-container.compact .listing-item-content span {
    font-size: 13px !important;
    color: #717171 !important;
    text-shadow: none !important;
}

/* Hide the badge container on image - pricing is now in content area as text */
.simple-slick-carousel .listing-item-container.compact .listing-small-badges-container,
.simple-fw-slick-carousel .listing-item-container.compact .listing-small-badges-container,
.fw-carousel-item .listing-small-badges-container {
    display: none !important;
}

/* Hide "Now Open/Closed" badges in carousel */
.simple-slick-carousel .listing-item-container.compact .listing-badge,
.simple-fw-slick-carousel .listing-item-container.compact .listing-badge {
    display: none !important;
}


/* Wishlist Heart Icon */
.simple-slick-carousel .listing-item-container.compact .like-icon,
.simple-fw-slick-carousel .listing-item-container.compact .like-icon {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    z-index: 3 !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border-radius: 50% !important;
    width: 32px !important;
    height: 32px !important;
}

/* Rating badge */
.simple-slick-carousel .listing-item-container.compact .numerical-rating,
.simple-fw-slick-carousel .listing-item-container.compact .numerical-rating {
    position: absolute !important;
    bottom: 10px !important;
    right: 10px !important;
}

/* CRITICAL: Remove the dark gradient overlay from compact carousel cards */
.simple-slick-carousel .listing-item-container.compact::before,
.simple-fw-slick-carousel .listing-item-container.compact::before,
.fw-carousel-item .listing-item-container.compact::before,
.fw-carousel-item .listing-item-container::before {
    display: none !important;
    background: none !important;
    background-image: none !important;
    opacity: 0 !important;
}

/* Also remove any gradient backgrounds on the listing-item itself */
.simple-slick-carousel .listing-item-container.compact .listing-item::before,
.simple-fw-slick-carousel .listing-item-container.compact .listing-item::before,
.fw-carousel-item .listing-item-container .listing-item::before,
.fw-carousel-item .listing-item::before {
    display: none !important;
    background: none !important;
    background-image: none !important;
}

/* ============================================
   CAROUSEL - Pricing at Bottom & Visible Navigation
   ============================================ */

/* Move pricing badge to the content area at bottom */
.fw-carousel-item .listing-small-badges-container {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin-top: auto !important;
    padding-top: 10px !important;
    order: 10 !important;
}

/* Style the pricing badge in content area */
.fw-carousel-item .listing-small-badge.pricing-badge {
    background: #FF5A5F !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
    padding: 6px 12px !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    box-shadow: none !important;
    display: inline-block !important;
}

.fw-carousel-item .listing-small-badge.pricing-badge i {
    margin-right: 4px !important;
}

/* Hide featured badge in carousel (keep only price) */
.fw-carousel-item .listing-small-badge.featured-badge {
    display: none !important;
}

/* Style the cloned pricing badge at bottom of content */
.carousel-price-bottom {
    background: #FF5A5F !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
    padding: 8px 14px !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    display: inline-block !important;
    margin-top: 10px !important;
}

.carousel-price-bottom i {
    margin-right: 5px !important;
}


/* ============================================
   CAROUSEL NAVIGATION DOTS - Clearly Visible
   ============================================ */

/* Navigation dots container */
.simple-slick-carousel .slick-dots,
.simple-fw-slick-carousel .slick-dots {
    display: flex !important;
    justify-content: center !important;
    gap: 10px !important;
}

/* Slider controls positioning */
.slider-controls {
    margin-bottom: 0 !important;
}

.slider-controls-container {
    bottom: -50px !important;
    position: relative !important; /* Ensure bottom property works if not already absolute/relative */
}

/* Individual dots */
.simple-slick-carousel .slick-dots li button,
.simple-fw-slick-carousel .slick-dots li button {
    width: 12px !important;
    height: 12px !important;
    border-radius: 50% !important;
    background: #CCCCCC !important;
    opacity: 1 !important;
    padding: 0 !important;
}

.simple-slick-carousel .slick-dots li button::before,
.simple-fw-slick-carousel .slick-dots li button::before {
    display: none !important;
}

/* Active dot */
.simple-slick-carousel .slick-dots li.slick-active button,
.simple-fw-slick-carousel .slick-dots li.slick-active button {
    background: #222222 !important;
    transform: scale(1.2) !important;
}

/* Arrow buttons (prev/next) */
.simple-slick-carousel .slick-prev,
.simple-slick-carousel .slick-next,
.simple-fw-slick-carousel .slick-prev,
.simple-fw-slick-carousel .slick-next {
    width: 44px !important;
    height: 44px !important;
    background: #FFFFFF !important;
    border: 1px solid #DDDDDD !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
    z-index: 10 !important;
    opacity: 1 !important;
}

.simple-slick-carousel .slick-prev:hover,
.simple-slick-carousel .slick-next:hover,
.simple-fw-slick-carousel .slick-prev:hover,
.simple-fw-slick-carousel .slick-next:hover {
    background: #F7F7F7 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
}

.simple-slick-carousel .slick-prev::before,
.simple-slick-carousel .slick-next::before,
.simple-fw-slick-carousel .slick-prev::before,
.simple-fw-slick-carousel .slick-next::before {
    color: #222222 !important;
    font-size: 20px !important;
    opacity: 1 !important;
}

/* Extra spacing for carousel section */
.simple-slick-carousel,
.simple-fw-slick-carousel {
    margin-bottom: 50px !important;
}

/* Elementor section adjustment to prevent carousel dots being hidden */
.elementor-1523 .elementor-element.elementor-element-31fad76b {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}

/* ==========================================================================
   PHASE 1 QUICK FIXES - Website Audit (January 2026)
   ========================================================================== */

/* 1. HIDE "Flexible" and "Instant Reply" tags from ALL listing cards */
.airbnb-features,
.listing-item-content .airbnb-features,
.listing-item .airbnb-features,
div.airbnb-features {
    display: none !important;
    visibility: hidden !important;
}

/* 2. FLOATING WHATSAPP ICON - Fixed bottom-right corner */
.widget_media_image a[href*="whatsapp"],
.widget_media_image a[href*="wa.me"] {
    position: fixed !important;
    bottom: 20px !important;
    right: 20px !important;
    z-index: 99999 !important;
    background: #25D366 !important;
    border-radius: 50% !important;
    padding: 12px !important;
    box-shadow: 0 4px 15px rgba(37, 211, 102, 0.4) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.widget_media_image a[href*="whatsapp"]:hover,
.widget_media_image a[href*="wa.me"]:hover {
    transform: scale(1.1) !important;
    box-shadow: 0 6px 20px rgba(37, 211, 102, 0.5) !important;
}

.widget_media_image a[href*="whatsapp"] img,
.widget_media_image a[href*="wa.me"] img {
    width: 45px !important;
    height: 45px !important;
    display: block !important;
}

/* 3. Adjust Back to Top button position to not overlap with WhatsApp */
#backtotop {
    right: 90px !important;
}

/* 4. Typography Cleanup - Removed hardcoded font sizes to allow Elementor widget control */
/* Font sizes are now controlled at widget/element level in Elementor */
/* Only font-family is enforced globally */

/* ============================================================================ */
/* HOST DASHBOARD - ADD LISTING PAGE FIXES */
/* ============================================================================ */

/* Fix tippy tooltip icons (the yellow ? circles next to labels) */
.tippy-box,
[data-tippy-root],
.tippy-content,
.dashboard-list-box .tooltip,
.tooltip-icon,
[data-tip-content]::before {
  font-family: inherit !important;
}

/* Fix TinyMCE editor toolbar icons - WordPress uses tinymce font */
.mce-ico,
.mce-ico::before,
[class*="mce-i-"],
[class*="mce-i-"]::before,
.mce-btn i,
.mce-btn i::before,
.mce-toolbar .mce-btn button i,
.mce-toolbar .mce-btn button i::before,
.mce-widget button i,
.wp-editor-tools button i {
  font-family: "tinymce", "tinymce-small" !important;
  font-style: normal !important;
  font-weight: normal !important;
  speak: none !important;
}

/* Fix yellow "Add Item" buttons - style them properly */
.add-repeatable-list-item,
.dashboard-list-box a.button.add-repeatable-list-item,
a.button.add-repeatable-list-item {
  background-color: #333 !important;
  color: #fff !important;
  border: none !important;
}

.add-repeatable-list-item:hover {
  background-color: #555 !important;
  color: #fff !important;
}

/* Style venue packages Add Item button specifically */
.spottle_venue_packages_metabox .add-repeatable-list-item,
#_venue_packages_repeat a.button,
.cmb-add-group-row {
  background-color: #333 !important;
  color: #fff !important;
  border: none !important;
}

/* Fix dashboard form icons that use Font Awesome */
.dashboard-list-box label::after,
.submit-page label::after,
.add-listing-section label::after {
  font-family: "Font Awesome 5 Free", "FontAwesome" !important;
}

/* ============================================================================ */
/* ADD LISTING FORM - HIDE UNWANTED ELEMENTS */
/* ============================================================================ */

/* Hide the map on Add Listing form */
.submit-page #listeo-leaflet-map,
.submit-page .listeo-leaflet-map-container,
.submit-page .map-container,
.submit-page .listing-map,
.add-listing-section #listeo-leaflet-map,
.add-listing-section .leaflet-container,
.dashboard-content #listeo-leaflet-map {
  display: none !important;
}

/* Hide Zip Code field */
.submit-page .fieldset-_zip,
.submit-page .fieldset-zip,
.submit-page [data-field="_zip"],
.submit-page [data-field="zip"],
.add-listing-section .fieldset-_zip {
  display: none !important;
}

/* Also hide by label text (backup) */
.submit-page label[for="_zip"],
.submit-page label[for="zip"] {
  display: none !important;
}

/* Hide the parent row that contains the hidden fields */
.submit-page .row > .col-md-3:has(input[name="_zip"]),
.submit-page .row > .col-md-4:has(input[name="zip"]) {
  display: none !important;
}

/* ============================================================================ */
/* AMENITIES SECTION STYLING - Simple & Clean */
/* ============================================================================ */

/* Ensure checkbox labels align properly with checkboxes */
.submit-page .checkboxes label,
.add-listing-section .checkboxes label,
.dashboard-list-box .checkboxes label {
  display: inline-flex;
  align-items: center;
  margin-right: 15px;
  margin-bottom: 10px;
}

/* Proper checkbox alignment */
.submit-page .checkboxes input[type="checkbox"],
.add-listing-section .checkboxes input[type="checkbox"] {
  margin-right: 6px;
  vertical-align: middle;
}

/* Ensure the section title matches other sections */
.add-listing-headline h3 {
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  color: #333;
}

/* ============================================================================ */
/* ELEMENTOR DYNAMIC LIST STYLING */
/* ============================================================================ */

/* Style for multi-line custom fields converted to lists */
.spottle-dynamic-list {
  list-style-type: none !important;
  padding: 0 !important;
  margin: 15px 0 !important;
}

.spottle-dynamic-list li {
  position: relative;
  padding-left: 20px !important;
  margin-bottom: 8px !important;
  line-height: 1.6 !important;
  color: #666;
}

.spottle-dynamic-list li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: #ff4747; /* Spottle Brand Color */
  font-weight: bold;
}