/* ==========================================================================
   Global Layout Fixes for Promo Strip Positioning
   ========================================================================== */

/* Ensure body and html have no top margins that could affect promo strip */
body {
  margin-top: 0 !important;
}

html {
  margin-top: 0 !important;
}

/* Ensure the promo strip is truly at the top on mobile */
@media (max-width: 768px) {
  body {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  
  /* Remove any theme-specific top spacing */
  #ajax-content-wrap {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  
  /* Fix the header-outer top positioning that creates the gap */
  #header-outer {
    top: 0 !important;
  }
  
  /* Ensure the global section before header has no margins */
  .nectar-global-section.nectar_hook_before_secondary_header {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }
  
  /* If promo strip is the first child, ensure no gap */
  body > *:first-child.ul-promo-strip,
  #ajax-content-wrap > *:first-child.ul-promo-strip {
    margin-top: 0 !important;
  }
}

/* === START OF EXISTING STYLES === */

/* === Testimonial Slider Accent Colors === */

/*
=============================================
  UNIFORM LINK CUSTOM COMPONENTS
=============================================
*/

/* === Note: All button styles are now managed in buttons.css === */

/*
=============================================
  SALIENT THEME COMPONENT OVERRIDES
=============================================
*/

/* === Nectar Elements === */
.nectar-fancy-box,
.nectar-cta,
.nectar-split-heading,
.nectar-highlighted-text,
.nectar-icon-list,
.nectar-progress-bar,
.nectar-milestone,
.nectar-flip-box,
.nectar-post-grid,
.nectar-slider-wrap,
.nectar-video-box {
  font-family: var(--font-family-base);
}

/* === Milestone Subject Styling === */
.nectar-milestone .subject,
.nectar-milestone .milestone-subject,
.milestone-wrap .subject {
  font-family: var(--font-family-base);
  font-weight: 700;
  color: var(--neutral-1000);
  font-size: 2.125rem;
  line-height: 1.4;
  margin-top: 0;
}

/* === Milestone Number Spacing === */
.nectar-milestone .number {
  margin-bottom: 0 !important;
}

/* === Fancy Boxes === */
.nectar-fancy-box[data-color="accent-color"]:after,
.nectar-fancy-box[data-style="color_box_hover"][data-color="accent-color"] .box-bg:after {
  background-color: var(--ul-blue-200);
}

/* === Video Elements === */
.nectar-video-box[data-color="default-accent-color"] .nectar_video_lightbox,
.nectar_video_lightbox.nectar-button[data-color="default-accent-color"] {
  background-color: var(--ul-blue-200);
}

/* === Animated Elements === */
.nectar-animated-title[data-color="eaccent-color"] .nectar-animated-title-inner:after,
.divider-small-border[data-color="accent-color"],
.divider-border[data-color="accent-color"] {
  background-color: var(--ul-blue-200);
}

/* === Testimonials === */
.testimonial_slider[data-rating-color="accent-color"] .star-rating .filled:before,
.testimonial_slider[data-style="multiple_visible"][data-color*="accent-color"] .flickity-page-dots .dot.is-selected:before,
.testimonial_slider[data-style="multiple_visible"][data-color*="accent-color"] blockquote.is-selected p {
  background-color: var(--ul-blue-200);
  color: var(--ul-blue-200);
}

/* === Flickity Controls === */
.nectar-flickity[data-control-color="accent-color"] .flickity-page-dots .dot:before,
.nectar-flickity[data-controls*="arrows_overlaid"][data-control-color="accent-color"] .flickity-prev-next-button:hover:before {
  background-color: var(--ul-blue-200);
}

/* === Fancy Unordered Lists === */
.nectar-fancy-ul {
  font-size: 1.1rem;
  line-height: 1.6;
  margin-bottom: 1.5em;
  color: var(--black-100);
}

/* Ensure all text within fancy unordered lists is black */
.nectar-fancy-ul ul,
.nectar-fancy-ul ul li,
.nectar-fancy-ul ul li span,
.nectar-fancy-ul ul li a {
  color: var(--black-100) !important;
}

/* Keep icons in their intended color (accent color) */
.nectar-fancy-ul ul li i,
.nectar-fancy-ul ul li i.icon-default-style,
.nectar-fancy-ul ul li i.accent-color {
  color: var(--ul-red-200) !important;
}


/*
=============================================
  PROMO STRIP COMPONENT
=============================================
*/

.ul-promo-strip {
  background: var(--ul-red-200);
  color: var(--neutral-100);
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  padding: 12px 0;
  font-family: var(--font-family-base);
  margin-top: 0 !important; /* Ensure no top margin */
  position: relative;
  z-index: 100;
}

/* Remove any potential gaps from WordPress admin bar or theme spacing */
body:not(.admin-bar) .ul-promo-strip {
  margin-top: 0 !important;
}

/* Handle logged-in admin bar spacing */
.admin-bar .ul-promo-strip {
  margin-top: 0 !important;
}

/* Mobile-specific fixes for gap issues */
@media (max-width: 768px) {
  .ul-promo-strip {
    margin-top: 0 !important;
    padding-top: 12px !important;
  }
  
  /* Ensure first element after body has no margin */
  body > .ul-promo-strip,
  body > .container > .ul-promo-strip,
  body > .row > .ul-promo-strip,
  #ajax-content-wrap > .ul-promo-strip {
    margin-top: 0 !important;
  }
  
  /* Handle WordPress admin bar on mobile (usually hidden but just in case) */
  .admin-bar .ul-promo-strip {
    margin-top: 0 !important;
  }
}

.ul-promo-item i {
  color: #fff;
  font-size: 13px;
  margin-right: 6px;
  margin-top: 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  height: 1em;
  vertical-align: top;
}
.ul-promo-strip a {
  color: var(--neutral-100);
  text-decoration: none;
  transition: all 0.3s ease;
}

.ul-promo-strip a:hover {
  text-decoration: none;
  opacity: 0.9;
}

.ul-promo-strip a:hover span {
  text-decoration: underline;
}

.ul-promo-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}

.ul-promo-left {
  flex-shrink: 0;
}

.ul-promo-link {
  display: inline-block;
}

.ul-promo-right {
  display: flex;
  align-items: center;
  gap: 20px;
}

.ul-promo-item {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--neutral-100);
}

.ul-icon {
  font-size: 13px;
  line-height: 1;
  color: var(--neutral-100);
}

.ul-promo-sep {
  opacity: 0.5;
  color: var(--neutral-100);
}

@media (max-width: 768px) {
  .ul-promo-inner {
    flex-direction: column;
    text-align: center;
    gap: 12px;
    padding: 0 15px;
  }
  .ul-promo-right {
    justify-content: center;
    flex-wrap: wrap;
    gap: 15px;
  }
  .ul-promo-item {
    gap: 6px;
  }
}


/*
=============================================
  SP-WCSP CATEGORY SLIDER (WooCommerce Category Slider Pro)
=============================================
*/

/* Category details container - ensure it's the positioning context */
.sp-wcsp-cat-details {
  position: relative;
  overflow: visible !important; /* Allow text overlay to show - CRITICAL for absolute positioned text */
  /* Remove extra bottom padding to prevent label being pushed down */
  padding-bottom: 0;
}

/* Image thumbnail container - make this the positioning context for the text */
.sp-wcsp-cat-item-thumb-content {
  position: relative !important; /* Ensure this is the positioning parent for absolute children */
  overflow: visible !important; /* Allow text overlay to extend beyond if needed */
}

/* Spacing handled via Swiper JS override to avoid layout shifts */

/* Category title container - absolute positioning anchored to image container */
.sp-wcsp-cat-name {
  position: absolute !important; /* Absolute positioning to overlay on image */
  bottom: 15px !important;       /* Offset from bottom to position text higher on tile */
  left: 0 !important;            /* Anchor to left edge */
  right: 0 !important;           /* Allow full width */
  z-index: 10 !important;        /* Ensure it's above image */
  width: 100%;
  padding: 8px 28px 8px 20px; /* Extra right padding for scaled button */
  overflow: visible !important; /* Critical: allow button scaling */
  pointer-events: none; /* Allow clicks to pass through to links */
}

/* Re-enable pointer events for the actual link */
.sp-wcsp-cat-name a {
  pointer-events: auto;
}

/* Category title link - Figma flexbox layout */
.sp-wcsp-cat-name a {
  /* Flexbox layout with center alignment */
  display: flex !important;
  align-items: center !important; /* Center align text and button */
  justify-content: space-between !important;
  gap: clamp(12px, 4vw, 20px) !important; /* Increased gap for rectangular button */
  text-align: left !important; /* Force left alignment for all text content */
  width: 100% !important;
  min-height: 44px !important;
  padding: 8px 0 !important;
  
  /* Typography matching Figma design */
  font-family: 'Stolzl', var(--font-family-base), sans-serif !important;
  font-size: clamp(1rem, 2.8vw, 1.375rem) !important; /* Slightly reduced: 16px - 22px */
  font-weight: 400 !important; /* Book weight like Figma */
  line-height: 1.2 !important; /* Better for multi-line readability */
  letter-spacing: -0.55px !important; /* Exact Figma tracking */
  color: var(--neutral-100) !important;
  text-decoration: none !important;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.4) !important;
  
  /* Allow text to wrap naturally with left alignment */
  white-space: normal !important;
  word-wrap: break-word !important;
  overflow-wrap: break-word !important;
  text-align: left !important;
  
  /* Transitions */
  transition: all 0.3s ease !important;
}





/* Red rectangular arrow button - right side flex item */
.sp-wcsp-cat-name a::after {
  content: '';
  
  /* Flex item - stays on right with justify-between */
  flex-shrink: 0 !important;
  align-self: center !important; /* Center align button with text */
  
  /* SVG background button */
  background-image: url('/wp-content/themes/salient-child/assets/red-rect-abut-arrow.svg');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  
  /* Rectangular sizing matching Figma SVG proportions (51x30 ratio) */
  width: 51px;
  height: 30px;
  
  /* Effects */
  transition: all 0.3s ease;
  z-index: 3;
  opacity: 1;
}

/* Hover effects for the category item - change to black background with white arrow */
.sp-wcsp-cat-details:hover .sp-wcsp-cat-name a::after {
  transform: scale(1.05); /* Reduced scale to prevent clipping */
  background-image: url('/wp-content/themes/salient-child/assets/red-rect-abut-arrow-black.svg');
}

/* Enhanced hover effect for title */
.sp-wcsp-cat-details:hover .sp-wcsp-cat-name a {
  transform: translateY(-1px);
  text-shadow: 0 3px 8px rgba(0, 0, 0, 0.5);
}

/* Large desktop optimization */
@media (min-width: 1400px) {
  .sp-wcsp-cat-name {
    bottom: 20px !important;     /* Position higher on large screens */
    padding: 10px 30px 10px 22px !important;
  }
  
  .sp-wcsp-cat-name a {
    font-size: 1.375rem !important;
    gap: 22px !important;
  }
  
  .sp-wcsp-cat-name a::after {
    width: 56px;
    height: 33px;
    flex-shrink: 0 !important; /* Prevent button from shrinking */
  }
}

/* Ultra-large desktop optimization - prevent text overflow on very large screens */
@media (min-width: 1600px) {
  .sp-wcsp-cat-name {
    bottom: 25px !important;     /* Even higher positioning for ultra-wide */
    max-width: 100% !important;
    padding: 12px 32px 12px 24px !important;
  }
  
  .sp-wcsp-cat-name a {
    font-size: clamp(1.125rem, 1.8vw, 1.5rem) !important; /* Fluid sizing with upper limit */
  }
  
  .sp-wcsp-cat-name a::after {
    width: 58px;
    height: 34px;
    flex-shrink: 0 !important;
  }
}

/* Tablet responsive adjustments */
@media (max-width: 768px) {
  .sp-wcsp-cat-name {
    bottom: 12px !important;     /* Slightly higher on tablet */
    padding: 6px 20px 6px 16px; /* Extra right padding for button scaling */
  }
  
  .sp-wcsp-cat-name a {
    min-height: 42px !important;
    padding: 6px 0 !important;
    gap: 14px !important;
    font-size: clamp(0.95rem, 2.5vw, 1.125rem) !important;
  }
  
  .sp-wcsp-cat-name a::after {
    width: 40px;
    height: 24px;
  }
}

/* Mobile responsive adjustments */
@media (max-width: 480px) {
  .sp-wcsp-cat-name {
    bottom: 10px !important;     /* Consistent offset on mobile */
    padding: 4px 16px 4px 12px; /* Extra right padding for button scaling */
  }
  
  .sp-wcsp-cat-name a {
    min-height: 38px !important;
    padding: 4px 0 !important;
    gap: 12px !important;
    font-size: clamp(0.85rem, 2vw, 1rem) !important;
  }
  
  .sp-wcsp-cat-name a::after {
    width: 36px;
    height: 21px;
  }
}

/* === Note: Button size variants handled in buttons.css === */

/*
=============================================
  GALLERY NAVIGATION CONTROLS - ABSOLUTE POSITIONING
=============================================
*/

/* Gallery with navigation controls */
.ul-gallery-nav {
  position: relative;
}

/* Style Flickity's buttons to match the working category navigation exactly */
.ul-gallery-nav .flickity-prev-next-button {
  position: absolute !important;
  bottom: -70px !important;
  width: 44px !important;
  height: 44px !important;
  background-color: #1F2937 !important; /* Dark background like working navigation */
  border: none !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important; /* Same transition as working navigation */
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15) !important;
  z-index: 10 !important;
  
  /* Hide all default content */
  font-size: 0 !important;
  text-indent: -9999px !important;
  overflow: hidden !important;
  
  /* Add the SVG chevron */
  background-image: url('data:image/svg+xml,<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.4411 23.938L20.3821 18.016L14.478 12.056C13.8951 11.467 13.898 10.518 14.487 9.935C14.779 9.645 15.161 9.5 15.543 9.5C15.929 9.5 16.315 9.648 16.608 9.944L23.565 16.966C24.147 17.554 24.145 18.5 23.559 19.084L16.559 26.062C15.974 26.647 15.022 26.646 14.438 26.059C13.853 25.472 13.8551 24.522 14.4411 23.938Z" fill="white"/></svg>') !important;
  background-size: 20px 20px !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}

/* Hide all Flickity's original content */
.ul-gallery-nav .flickity-prev-next-button * {
  display: none !important;
}

.ul-gallery-nav .flickity-prev-next-button:before,
.ul-gallery-nav .flickity-prev-next-button:after {
  display: none !important;
}

/* Position previous button - matches the gap from working navigation (20px + 44px + 20px = 84px from right) */
.ul-gallery-nav .flickity-prev-next-button.previous {
  right: 84px !important; /* 20px gap + 44px next button + 20px margin */
  transform: rotate(180deg) !important;
}

/* Position next button - matches working navigation (20px from right edge) */
.ul-gallery-nav .flickity-prev-next-button.next {
  right: 20px !important;
}

/* Hover effects - exactly like working navigation */
.ul-gallery-nav .flickity-prev-next-button:hover:not(:disabled) {
  background-color: #374151 !important; /* Same darker shade */
  transform: translateY(-2px) !important; /* Same lift effect */
  box-shadow: 0 6px 20px rgba(31, 41, 55, 0.4) !important;
}

.ul-gallery-nav .flickity-prev-next-button.previous:hover:not(:disabled) {
  transform: rotate(180deg) translateY(2px) !important; /* Maintain rotation + lift */
}

/* Disabled state - light background like working navigation */
.ul-gallery-nav .flickity-prev-next-button:disabled {
  background-color: #6B7280 !important; /* Light gray background */
  cursor: not-allowed !important;
  opacity: 0.6 !important;
}

.ul-gallery-nav .flickity-prev-next-button.previous:disabled {
  transform: rotate(180deg) !important;
}

.ul-gallery-nav .flickity-prev-next-button:disabled:hover {
  transform: none !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15) !important;
  background-color: #6B7280 !important;
}

.ul-gallery-nav .flickity-prev-next-button.previous:disabled:hover {
  transform: rotate(180deg) !important;
  background-color: #6B7280 !important;
}

/* Responsive adjustments - matching working navigation breakpoints */
@media (max-width: 768px) {
  .ul-gallery-nav .flickity-prev-next-button {
    width: 36px !important; /* Smaller on tablet */
    height: 36px !important;
    bottom: -60px !important;
    background-size: 16px 16px !important;
  }
  
  .ul-gallery-nav .flickity-prev-next-button.previous {
    right: 71px !important; /* Adjust for smaller buttons: 15px gap + 36px + 15px = 66px */
  }
  
  .ul-gallery-nav .flickity-prev-next-button.next {
    right: 15px !important;
  }
}

@media (max-width: 480px) {
  .ul-gallery-nav .flickity-prev-next-button {
    width: 32px !important; /* Smallest on mobile */
    height: 32px !important;
    bottom: -55px !important;
    background-size: 14px 14px !important;
  }
  
  .ul-gallery-nav .flickity-prev-next-button.previous {
    right: 62px !important; /* Adjust for smallest buttons: 10px gap + 32px + 10px */
  }
  
  .ul-gallery-nav .flickity-prev-next-button.next {
    right: 10px !important;
  }
}

/* Enhanced pagination dots when navigation is enabled */
.ul-gallery-nav .flickity-page-dots {
  bottom: -45px;
}

.ul-gallery-nav .flickity-page-dots .dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.3);
  margin: 0 6px;
  transition: all 0.3s ease;
}

.ul-gallery-nav .flickity-page-dots .dot.is-selected {
  background: var(--ul-red-200);
  transform: scale(1.2);
}

.ul-gallery-nav .flickity-page-dots .dot:hover {
  background: var(--ul-red-100);
  transform: scale(1.1);
}

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  .ul-gallery-nav .flickity-prev-next-button,
  .ul-gallery-nav .flickity-page-dots .dot {
    transition: none;
  }

  .ul-gallery-nav .flickity-prev-next-button:hover {
    transform: none !important;
  }

  .ul-gallery-nav .flickity-page-dots .dot.is-selected,
  .ul-gallery-nav .flickity-page-dots .dot:hover {
    transform: none;
  }
}

/*
=============================================
  CUSTOMIZER INTEGRATION - COMPONENTS
=============================================
*/

/* WooCommerce Product Slider Pro - navigation button positioning */
#wpsp-slider-section-wrapper.wpsp-slider-section .wpsp-nav.swiper-button-prev,
#wpsp-slider-section-wrapper.wpsp-slider-section .wpsp-nav.swiper-button-next {
    top: 40% !important;
    right: 0 !important;
}

#wpsp-slider-section-wrapper.wpsp-slider-section .wpsp-nav.swiper-button-prev {
    left: 0 !important;
}

/* Product slider - product card styling */
.wpsp-slider-section.wpsp_custom #sp-woo-product-slider-pro1666.wpsp-product-section .wpsp-product .wpspro-product-data {
    background: var(--neutral-100);
    border-radius: 0.625rem; /* 10px */
}

/* Product slider - product image padding */
#wpsp-slider-section-wrapper.wpsp-slider-section .wpsp-product img.wpsp-product-img {
    padding: 0.625rem; /* 10px */
}

/* Category slider - category name styling */
.sp-wcsp-cat-name {
    padding: 0.5rem 1.25rem 0.5rem 1.25rem; /* 8px 20px 8px 20px */
}

.sp-wcsp-cat-name a {
    text-shadow: none !important;
}

.sp-wcsp-cat-name a::after {
    align-self: end !important;
}

/* Client logos - default padding */
.clients img {
    padding: 0.938rem; /* 15px */
}

/* Client logos - mobile padding */
@media (max-width: 640px) {
    .clients img {
        padding: 0.313rem; /* 5px */
    }
}

/*
=============================================
  B2B VARIATIONS NOTE
=============================================
*/

/* Hide B2B variations note */
.b2b-variations-note {
    display: none;
}

/*
=============================================
  BUTTON HOVER - BLACK BUTTON TO RED
=============================================
*/

/* Black button hover state - changes to red */
.ul-button.ul-button--black:hover {
    background-color: var(--ul-red-200) !important;
    border-color: var(--ul-red-200) !important;
    box-shadow: 0 0.375rem 1.25rem var(--ul-red-30) !important; /* 0 6px 20px */
}

/*
=============================================
  GALLERY ROUNDED IMAGES
=============================================
*/

/* Gallery with rounded images - 15px radius */
.ul-gallery-rounded img,
.ul-gallery-rounded .gallery-item img,
.ul-gallery-rounded .flickity-slider img,
.ul-gallery-rounded .swiper-slide img {
  border-radius: 15px !important;
  overflow: hidden;
}

/* Ensure the container also respects the rounding */
.ul-gallery-rounded .gallery-item,
.ul-gallery-rounded .flickity-cell,
.ul-gallery-rounded .swiper-slide {
  border-radius: 15px;
  overflow: hidden;
}

/*
=============================================
  NECTAR SLIDER TEXT SHADOWS
=============================================
*/

/* Enhanced text readability with clean drop shadows */
.nectar-slider-wrap .swiper-slide h1,
.nectar-slider-wrap .swiper-slide h2,
.nectar-slider-wrap .swiper-slide h3,
.nectar-slider-wrap .swiper-slide .content h1,
.nectar-slider-wrap .swiper-slide .content h2,
.nectar-slider-wrap .swiper-slide .content h3,
.nectar-slider-wrap .swiper-slide .hs-heading-el,
.nectar-slider-wrap .swiper-slide .ns-heading-el,
.nectar-slider-wrap .slide h1,
.nectar-slider-wrap .slide h2,
.nectar-slider-wrap .slide h3,
#slider-section h1,
#slider-section h2,
#slider-section h3,
#slider-section .hs-heading-el,
#slider-section .ns-heading-el {
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8), 0 1px 2px rgba(0, 0, 0, 0.9) !important;
}

/* Paragraph and span text shadows */
.nectar-slider-wrap .swiper-slide p,
.nectar-slider-wrap .swiper-slide .content p,
.nectar-slider-wrap .swiper-slide p span,
.nectar-slider-wrap .swiper-slide .content p span,
.nectar-slider-wrap .slide p,
#slider-section p,
#slider-section p span {
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.7), 0 1px 1px rgba(0, 0, 0, 0.8) !important;
}

/* Button text shadows */
.nectar-slider-wrap .swiper-slide a,
.nectar-slider-wrap .swiper-slide .nectar-button,
.nectar-slider-wrap .swiper-slide .buttons a,
.nectar-slider-wrap .slide a,
.nectar-slider-wrap .slide .nectar-button,
.nectar-slider-wrap .slide .buttons a,
#slider-section a,
#slider-section .nectar-button,
#slider-section .buttons a {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6) !important;
}

/* Mobile responsive text shadow adjustments */
/* Breakpoints: Mobile 0-640px | Tablet 768-1023px | Desktop 1024px+ */
@media (max-width: 640px) /* Mobile breakpoint - standardised */ {
  /* Enhanced text readability on mobile with stronger shadows */
  .nectar-slider-wrap .swiper-slide h1,
  .nectar-slider-wrap .swiper-slide h2,
  .nectar-slider-wrap .swiper-slide h3,
  .nectar-slider-wrap .swiper-slide .content h1,
  .nectar-slider-wrap .swiper-slide .content h2,
  .nectar-slider-wrap .swiper-slide .content h3,
  .nectar-slider-wrap .swiper-slide .hs-heading-el,
  .nectar-slider-wrap .swiper-slide .ns-heading-el,
  #slider-section h1,
  #slider-section h2,
  #slider-section h3,
  #slider-section .hs-heading-el,
  #slider-section .ns-heading-el {
    text-shadow: 0 3px 8px rgba(0, 0, 0, 0.9), 0 1px 3px rgba(0, 0, 0, 1) !important;
  }
  
  .nectar-slider-wrap .swiper-slide p,
  .nectar-slider-wrap .swiper-slide .content p,
  .nectar-slider-wrap .swiper-slide p span,
  .nectar-slider-wrap .swiper-slide .content p span,
  #slider-section p,
  #slider-section p span {
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.8), 0 1px 2px rgba(0, 0, 0, 0.9) !important;
  }
}

/*
=============================================
  NECTAR POST GRID - BLOG CARDS REDESIGN
=============================================
*/

/* Blog cards styling */

/* RESPONSIVE BLOG CARDS - Desktop 3 columns, Mobile carousel */
.ul-blog-cards-grey,
body .ul-blog-cards-grey,
html body .ul-blog-cards-grey,
body .nectar-post-grid.ul-blog-cards-grey,
html body .nectar-post-grid.ul-blog-cards-grey,
body .nectar-post-grid[data-columns].ul-blog-cards-grey,
html body .nectar-post-grid[data-columns].ul-blog-cards-grey,
body .nectar-post-grid[data-columns][data-grid-spacing].ul-blog-cards-grey,
html body .nectar-post-grid[data-columns][data-grid-spacing].ul-blog-cards-grey,
body .nectar-post-grid[data-columns="1"].ul-blog-cards-grey,
html body .nectar-post-grid[data-columns="1"].ul-blog-cards-grey,
body .nectar-post-grid[data-columns="2"].ul-blog-cards-grey,
html body .nectar-post-grid[data-columns="2"].ul-blog-cards-grey,
body .nectar-post-grid[data-columns="3"].ul-blog-cards-grey,
html body .nectar-post-grid[data-columns="3"].ul-blog-cards-grey,
.nectar-post-grid-wrap .nectar-post-grid.ul-blog-cards-grey,
body .nectar-post-grid-wrap .nectar-post-grid.ul-blog-cards-grey,
html body .nectar-post-grid-wrap .nectar-post-grid.ul-blog-cards-grey {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  background: transparent !important; /* Transparent container background */
  
  /* Use margin instead of gap for better browser support */
  margin: -10px !important; /* Negative margin to offset item margins (20px total gaps) */
  
  /* Align items properly */
  align-items: stretch !important;
  justify-content: flex-start !important;
  align-content: flex-start !important;
  
  /* Reset positioning */
  position: relative !important;
  float: none !important;
  clear: both !important;
}

/* Individual post grid item - DESKTOP: 3 columns with margins */
.ul-blog-cards-grey .nectar-post-grid-item,
body .ul-blog-cards-grey .nectar-post-grid-item,
html body .ul-blog-cards-grey .nectar-post-grid-item,
body .nectar-post-grid.ul-blog-cards-grey .nectar-post-grid-item,
html body .nectar-post-grid.ul-blog-cards-grey .nectar-post-grid-item,
body .nectar-post-grid[data-columns].ul-blog-cards-grey .nectar-post-grid-item,
html body .nectar-post-grid[data-columns].ul-blog-cards-grey .nectar-post-grid-item,
body .nectar-post-grid[data-columns][data-grid-spacing].ul-blog-cards-grey .nectar-post-grid-item,
html body .nectar-post-grid[data-columns][data-grid-spacing].ul-blog-cards-grey .nectar-post-grid-item,
body .nectar-post-grid[data-columns="1"].ul-blog-cards-grey .nectar-post-grid-item,
html body .nectar-post-grid[data-columns="1"].ul-blog-cards-grey .nectar-post-grid-item,
body .nectar-post-grid[data-columns="2"].ul-blog-cards-grey .nectar-post-grid-item,
html body .nectar-post-grid[data-columns="2"].ul-blog-cards-grey .nectar-post-grid-item,
body .nectar-post-grid[data-columns="3"].ul-blog-cards-grey .nectar-post-grid-item,
html body .nectar-post-grid[data-columns="3"].ul-blog-cards-grey .nectar-post-grid-item {
  background: #f8f8f8 !important; /* Light grey card background */
  border-radius: 15px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.3s ease !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  
  /* DESKTOP: 3 columns with 20px gaps using margins (10px each side) */
  width: calc(33.333% - 20px) !important;
  min-width: calc(33.333% - 20px) !important;
  max-width: calc(33.333% - 20px) !important;
  height: auto !important;
  flex: 0 0 calc(33.333% - 20px) !important;
  
  /* 10px margin on all sides creates 20px gaps between cards */
  margin: 10px !important;
  padding-bottom: 0 !important;
  float: none !important;
  clear: none !important;
}

html body .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .nectar-post-grid-item:hover,
html body .nectar-post-grid.ul-blog-cards-grey .nectar-post-grid-item:hover,
html body .ul-blog-cards-grey .nectar-post-grid-item:hover,
html body .ul-blog-cards-grey .nectar-post-grid-item.card-hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12) !important;
}

/* Enhanced clickable card styling */
.ul-blog-cards-grey .nectar-post-grid-item[data-card-enhanced="true"] {
  cursor: pointer !important;
}

/* Remove focus outlines inside blog cards (no blue ring on focus/hover) */
.ul-blog-cards-grey .nectar-post-grid-item[data-card-enhanced="true"]:focus,
.ul-blog-cards-grey .nectar-post-grid-item[data-card-enhanced="true"]:focus-within,
.ul-blog-cards-grey .nectar-post-grid-item a:focus,
.ul-blog-cards-grey .nectar-post-grid-item a:focus-visible,
.ul-blog-cards-grey .nectar-post-grid-item .content:focus,
.ul-blog-cards-grey .nectar-post-grid-item .content:focus-within {
  outline: none !important;
  box-shadow: none !important;
}

/* Inner container fix */
html body .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .nectar-post-grid-item .inner,
html body .nectar-post-grid.ul-blog-cards-grey .nectar-post-grid-item .inner,
html body .ul-blog-cards-grey .nectar-post-grid-item .inner {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  position: relative !important;
}

/* Image area styling - increased height */
html body .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .nectar-post-grid-item-bg-wrap,
html body .nectar-post-grid.ul-blog-cards-grey .nectar-post-grid-item-bg-wrap,
html body .ul-blog-cards-grey .nectar-post-grid-item-bg-wrap {
  position: relative !important;
  border-radius: 15px 15px 0 0 !important;
  overflow: hidden !important;
  height: 300px !important;
  flex-shrink: 0 !important;
}

.nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .nectar-post-grid-item-bg-wrap-inner {
  height: 100% !important;
}

.nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .nectar-post-grid-item-bg {
  width: 100% !important;
  height: 100% !important;
  position: relative !important;
}

.nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .nectar-post-grid-item-bg img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 0 !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
}

/* Remove the dark overlay */
.nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .bg-overlay {
  display: none !important;
}

/* Category tag styling - positioned over image using negative positioning */
html body .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .meta-category,
html body .nectar-post-grid.ul-blog-cards-grey .meta-category,
html body .ul-blog-cards-grey .meta-category {
  position: absolute !important;
  top: -285px !important; /* Move up into the image area (300px image height - 15px from top) */
  left: 15px !important;
  z-index: 30 !important;
  margin: 0 !important;
}

/* Category tag styling - over image */
html body .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .meta-category a,
html body .nectar-post-grid.ul-blog-cards-grey .meta-category a,
html body .ul-blog-cards-grey .meta-category a {
  background: rgba(0, 0, 0, 0.8) !important;
  color: #ffffff !important;
  padding: 8px 12px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  border-radius: 4px !important;
  text-decoration: none !important;
  border: none !important;
  font-family: var(--font-family-base) !important;
  display: inline-block !important;
}

/* Hide "Uncategorized" category tag - not useful for users */
html body .nectar-post-grid .meta-category a[href*="/uncategorized"],
html body .nectar-post-grid .meta-category a[href*="/uncategorised"],
html body .ul-blog-cards-grey .meta-category a[href*="/uncategorized"],
html body .ul-blog-cards-grey .meta-category a[href*="/uncategorised"] {
  display: none !important;
}

/* Removed TAG / prefix - just show the category name */

/* 
==================================================
  FLEXBOX ALIGNMENT FIX FOR BLOG CARDS
==================================================
  
  ISSUE: Salient theme has built-in CSS rule that sets:
  .nectar-post-grid[data-text-layout*="all_bottom_left"] .content {
    justify-content: flex-end; // This pushes content to BOTTOM
  }
  
  SOLUTION: Override with more specific selectors to keep content at TOP:
  - justify-content: flex-start (keeps content at top)
  - align-items: flex-start (aligns items to start)
  - Proper spacing for orange arrow button pseudo element
  
================================================== 
*/

/* Content area - positioned below image, fix visibility and TOP alignment */
html body .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .content,
html body .nectar-post-grid.ul-blog-cards-grey .content,
html body .ul-blog-cards-grey .content {
  position: relative !important;
  background: #f8f8f8 !important; /* Light grey content background */
  padding: 25px 20px 20px 20px !important; /* Add extra top padding for arrow breathing room */
  border-radius: 0 0 15px 15px !important;
  flex-grow: 1 !important;
  z-index: 10 !important;
  display: flex !important;
  flex-direction: column !important;
  /* CRITICAL: Override Salient's flex-end to keep text at TOP */
  justify-content: flex-start !important;
  align-items: flex-start !important;
}

/* Item main content area - simple vertical layout, TOP aligned */
.nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .item-main {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important; /* Increased from 12px for better spacing between title and excerpt */
  flex-grow: 1 !important;
  position: relative !important;
  /* CRITICAL: Ensure content stays at TOP */
  justify-content: flex-start !important;
  align-items: flex-start !important;
  align-content: flex-start !important;
}

/* Title - simple block layout, reserve adequate space for orange arrow button */
.nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .post-heading,
html body .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .post-heading,
html body .nectar-post-grid.ul-blog-cards-grey .post-heading,
html body .ul-blog-cards-grey .post-heading {
  margin: 0 0 8px 0 !important; /* Add bottom margin for better spacing */
  padding-right: 80px !important; /* Reduced from 120px for better proportion */
  position: relative !important;
  max-width: 100% !important; /* Override Salient's 75% limit */
  /* Ensure text stays aligned to start */
  align-self: flex-start !important;
}

/* Blog card title styling - dark text with line clamping */
html body .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .post-heading span,
html body .nectar-post-grid.ul-blog-cards-grey .post-heading span,
html body .ul-blog-cards-grey .post-heading span {
  color: var(--neutral-1000) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  font-family: var(--font-family-base) !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  opacity: 1 !important;
  visibility: visible !important;
  max-width: 100% !important;
}

/* Excerpt styling - full width below title with proper arrow spacing */
.nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .nectar-post-grid-item__excerpt-wrap,
html body .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .nectar-post-grid-item__excerpt-wrap,
html body .nectar-post-grid.ul-blog-cards-grey .nectar-post-grid-item__excerpt-wrap,
html body .ul-blog-cards-grey .nectar-post-grid-item__excerpt-wrap {
  width: 100% !important;
  align-self: flex-start !important;
  margin-top: 10px !important; /* Add top margin to create space from title */
}

/* Blog card excerpt styling - dark text */
html body .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .meta-excerpt,
html body .nectar-post-grid.ul-blog-cards-grey .meta-excerpt,
html body .ul-blog-cards-grey .meta-excerpt {
  color: #4a4a4a !important; /* Dark grey text */
  font-size: 14px !important;
  line-height: 1.5 !important;
  font-family: var(--font-family-base) !important;
  margin: 0 !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Rectangular red arrow button (SVG) - positioned at top-right of card content */
html body .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .content::after,
html body .nectar-post-grid.ul-blog-cards-grey .content::after,
html body .ul-blog-cards-grey .content::after {
  content: "" !important;
  position: absolute !important;
  top: 25px !important;
  right: 25px !important;
  width: 51px !important;
  height: 30px !important;
  background-image: url('/wp-content/themes/salient-child/assets/red-rect-abut-arrow.svg') !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  border-radius: 0 !important;
  display: block !important;
  transition: transform 0.3s ease !important;
  cursor: pointer;
  z-index: 15 !important;
}

html body .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .nectar-post-grid-item:hover .content::after,
html body .nectar-post-grid.ul-blog-cards-grey .nectar-post-grid-item:hover .content::after,
html body .ul-blog-cards-grey .nectar-post-grid-item:hover .content::after {
  transform: scale(1.05) !important;
}

/* Ensure image links work properly by not interfering with existing structure */
html body .nectar-post-grid.ul-blog-cards-grey .post-featured-img,
html body .ul-blog-cards-grey .post-featured-img {
  position: relative !important; /* Ensure images are properly positioned */
}

/* Update z-index for category and arrow to work properly */
html body .nectar-post-grid.ul-blog-cards-grey .meta-category,
html body .ul-blog-cards-grey .meta-category {
  z-index: 10 !important; /* Above image but not blocking other links */
}

html body .nectar-post-grid.ul-blog-cards-grey .content::after,
html body .ul-blog-cards-grey .content::after {
  z-index: 5 !important; /* Above content but below category */
  pointer-events: none !important; /* Let clicks pass through */
}

/* Override Salient's mobile width rule that forces 100% width */
@media only screen and (max-width: 690px) {
  html body .nectar-post-grid[data-columns][data-grid-spacing].ul-blog-cards-grey .nectar-post-grid-item,
  html body .nectar-post-grid.ul-blog-cards-grey .nectar-post-grid-item {
    width: 100% !important; /* Keep full width within grid cell, not forcing single column */
    padding-bottom: 0 !important; /* Remove Salient's 75% padding */
  }
}

/* TABLET: 2 columns */
@media (max-width: 1024px) and (min-width: 768px) /* Tablet+ breakpoint - standardized */ {
  .ul-blog-cards-grey .nectar-post-grid-item,
  body .ul-blog-cards-grey .nectar-post-grid-item,
  html body .ul-blog-cards-grey .nectar-post-grid-item,
  body .nectar-post-grid.ul-blog-cards-grey .nectar-post-grid-item,
  html body .nectar-post-grid.ul-blog-cards-grey .nectar-post-grid-item,
  body .nectar-post-grid[data-columns].ul-blog-cards-grey .nectar-post-grid-item,
  html body .nectar-post-grid[data-columns].ul-blog-cards-grey .nectar-post-grid-item,
  body .nectar-post-grid[data-columns][data-grid-spacing].ul-blog-cards-grey .nectar-post-grid-item,
  html body .nectar-post-grid[data-columns][data-grid-spacing].ul-blog-cards-grey .nectar-post-grid-item {
    /* TABLET: 2 columns with 20px gaps using margins (10px each side) */
    width: calc(50% - 20px) !important;
    min-width: calc(50% - 20px) !important;
    max-width: calc(50% - 20px) !important;
    flex: 0 0 calc(50% - 20px) !important;
    margin: 10px !important; /* 20px gaps */
  }
}

/* MOBILE CAROUSEL: Horizontal scroll with peek-through */
@media (max-width: 768px) {
  /* Container becomes horizontal scrolling carousel */
  .ul-blog-cards-grey,
  body .ul-blog-cards-grey,
  html body .ul-blog-cards-grey,
  body .nectar-post-grid.ul-blog-cards-grey,
  html body .nectar-post-grid.ul-blog-cards-grey,
  body .nectar-post-grid[data-columns].ul-blog-cards-grey,
  html body .nectar-post-grid[data-columns].ul-blog-cards-grey,
  body .nectar-post-grid[data-columns][data-grid-spacing].ul-blog-cards-grey,
  html body .nectar-post-grid[data-columns][data-grid-spacing].ul-blog-cards-grey {
    flex-wrap: nowrap !important; /* No wrapping - horizontal scroll */
    overflow-x: auto !important;
    overflow-y: hidden !important;
    margin: 0 !important; /* Reset negative margin for mobile */
    padding: 0 20px !important; /* Side padding for peek effect */
    -webkit-overflow-scrolling: touch !important; /* Smooth iOS scrolling */
    scroll-behavior: smooth !important;
    scroll-snap-type: x mandatory !important; /* Snap to cards */
  }
  
  /* Individual cards in mobile carousel */
  .ul-blog-cards-grey .nectar-post-grid-item,
  body .ul-blog-cards-grey .nectar-post-grid-item,
  html body .ul-blog-cards-grey .nectar-post-grid-item,
  body .nectar-post-grid.ul-blog-cards-grey .nectar-post-grid-item,
  html body .nectar-post-grid.ul-blog-cards-grey .nectar-post-grid-item,
  body .nectar-post-grid[data-columns].ul-blog-cards-grey .nectar-post-grid-item,
  html body .nectar-post-grid[data-columns].ul-blog-cards-grey .nectar-post-grid-item,
  body .nectar-post-grid[data-columns][data-grid-spacing].ul-blog-cards-grey .nectar-post-grid-item,
  html body .nectar-post-grid[data-columns][data-grid-spacing].ul-blog-cards-grey .nectar-post-grid-item {
    width: 80% !important; /* Main card takes 80% width - slightly reduced */
    min-width: 80% !important;
    max-width: 80% !important;
    flex: 0 0 80% !important;
    margin: 0 10px !important; /* 20px gap between cards on mobile */
    scroll-snap-align: center !important; /* Snap to center */
  }
  
  /* Hide scrollbar but keep functionality */
  .ul-blog-cards-grey::-webkit-scrollbar,
  body .ul-blog-cards-grey::-webkit-scrollbar,
  html body .ul-blog-cards-grey::-webkit-scrollbar {
    display: none !important;
  }
  
  .ul-blog-cards-grey,
  body .ul-blog-cards-grey,
  html body .ul-blog-cards-grey {
    -ms-overflow-style: none !important; /* IE and Edge */
    scrollbar-width: none !important; /* Firefox */
  }
}

/* Reduce vertical spacing on blog cards section for larger screens */
/* Target the row that contains the blog cards wrapper */
.wpb_row .nectar-post-grid-wrap.ul-blog-cards-grey,
.vc_row .nectar-post-grid-wrap.ul-blog-cards-grey {
  margin-top: -20px !important;
  margin-bottom: -20px !important;
}

/* On larger screens, reduce even more */
@media (min-width: 1000px) {
  .wpb_row .nectar-post-grid-wrap.ul-blog-cards-grey,
  .vc_row .nectar-post-grid-wrap.ul-blog-cards-grey {
    margin-top: -32px !important;
    margin-bottom: -32px !important;
  }
}

@media (min-width: 1400px) {
  .wpb_row .nectar-post-grid-wrap.ul-blog-cards-grey,
  .vc_row .nectar-post-grid-wrap.ul-blog-cards-grey {
    margin-top: -40px !important;
    margin-bottom: -40px !important;
  }
}

/* Legacy responsive adjustments for existing selectors */
@media (max-width: 1024px) {
  .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .nectar-post-grid-item-bg-wrap {
    height: 200px !important;
  }
  
  /* Adjust category position for mobile image size */
  .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .meta-category {
    top: -185px !important; /* 200px image height - 15px */
  }
  
  .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .content {
    padding: 20px 15px 15px 15px !important; /* Maintain extra top padding on tablet */
  }
  
  .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .post-heading span {
    font-size: 16px !important;
  }
  
  .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .meta-excerpt {
    font-size: 13px !important;
  }
  
  .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .content::after {
    width: 40px !important; /* Tablet size for rectangular SVG */
    height: 24px !important;
    top: 20px !important; /* Adjust for new padding */
    right: 20px !important; /* Maintain spacing consistency */
  }
  
  .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .post-heading {
    padding-right: 50px !important; /* Adjust for smaller button */
  }
}

@media (max-width: 480px) {
  .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .nectar-post-grid-item-bg-wrap {
    height: 180px !important;
  }
  
  /* Adjust category position for smallest image size */
  .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .meta-category {
    top: -165px !important; /* 180px image height - 15px */
  }
  
  .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .content::after {
    width: 36px !important; /* Mobile size for rectangular SVG */
    height: 21px !important;
    top: 20px !important; /* Adjust for new padding */
    right: 20px !important; /* Maintain spacing consistency */
  }
  
  .nectar-post-grid[data-text-layout="all_bottom_left_shadow"] .post-heading {
    padding-right: 45px !important; /* Adjust for smallest button */
  }
}



/*
=============================================
  FLICKITY GALLERY SPACING FIXES
=============================================
*/

/* Reduce excessive default margins on Flickity galleries */
.nectar-flickity:not(.masonry) .flickity-viewport {
  margin: 30px 0 !important; /* Reduced from default 80px */
}

/* Specific adjustments for different gallery types */
.wpb_gallery_slidesflickity_static_height_style .nectar-flickity:not(.masonry) .flickity-viewport {
  margin: 25px 0 !important; /* Reduced from default 40px */
}

.nectar-flickity[data-controls*="arrows_overlaid"]:not(.masonry) .flickity-viewport {
  margin: 30px 0 !important; /* Reduced from default 50px */
}

/* Carousel spacing adjustments */
.nectar-flickity.nectar-carousel.nectar-carousel:not(.masonry) .flickity-viewport {
  margin: 40px 0 !important; /* Reduced from default 90px */
}

/* Mobile responsive adjustments */
@media screen and (max-width: 768px) {
  .nectar-flickity:not(.masonry) .flickity-viewport {
    margin: 20px 0 !important;
  }
  
  .nectar-flickity.nectar-carousel.nectar-carousel:not(.masonry) .flickity-viewport {
    margin: 25px 0 !important;
  }
}

@media screen and (max-width: 480px) {
  .nectar-flickity:not(.masonry) .flickity-viewport {
    margin: 15px 0 !important;
  }
  
  .nectar-flickity.nectar-carousel.nectar-carousel:not(.masonry) .flickity-viewport {
    margin: 20px 0 !important;
  }
}

/*
=============================================
  WOOCOMMERCE CATEGORY SLIDER GUARD
  Hide empty category sliders to prevent layout issues
=============================================
*/

/* Hide empty category sliders that have been marked by the guard script */
.woo-cat-slider--empty {
  display: none !important;
}
