/*
 Theme Name: Astra Child - Krishna IVF
 Theme URI: https://krishnaivf.com
 Description: Child theme for Krishna IVF website based on Astra parent theme
 Author: Krishna IVF
 Author URI: https://krishnaivf.com
 Template: astra
 Version: 1.0.0
*/

/* ================================================
   FIX 1 — FOOTER BULLET POINTS
   Issue: Child theme activation caused bullet 
   points to appear in footer widget lists
   Fix: Reset list styles for footer widget areas
   Updated: July 2026 — strengthened selectors
   ================================================ */

.site-primary-footer-wrap ul li,
.elementor-widget-icon-list .elementor-icon-list-items li,
footer ul li {
  list-style: none !important;
  list-style-type: none !important;
}

.site-primary-footer-wrap ul,
.elementor-widget-icon-list .elementor-icon-list-items,
footer ul {
  padding-left: 0 !important;
  margin-left: 0 !important;
  list-style: none !important;
}

.site-primary-footer-wrap li::before,
.elementor-widget-icon-list .elementor-icon-list-items li::before,
footer li::before {
  content: none !important;
  display: none !important;
}

.site-primary-footer-wrap li::marker,
.elementor-widget-icon-list .elementor-icon-list-items li::marker,
footer li::marker {
  content: none !important;
  display: none !important;
}



/* ================================================
   FIX 2 — HERO IMAGE ASPECT RATIO CLS FIX
   Issue: Hero image column collapses before image
   loads causing layout shift on desktop (CLS 1.0)
   Fix: Reserve correct proportional space using
   aspect-ratio matching intrinsic image dimensions
   Added: July 2026
   ================================================ */
   
   
.elementor-element-32b48ab .elementor-widget-image img {
  aspect-ratio: 640 / 685;
  width: 100%;
  height: auto;
}

.elementor-element-32b48ab .elementor-widget-wrap {
  min-height: 1px;
}


/* ================================================
   FIX 3 — BACKGROUND OVERLAY TRANSITION CLS FIX
   Issue: elementor-background-overlay animates on
   page load causing CLS score of 1.000 on desktop
   Fix: Set transition to none on normal state to
   prevent layout shift during page load
   Added: July 2026
   ================================================ */

.elementor-background-overlay {
  transition: none !important;
}


/* ================================================
   FIX 4 — OPEN SANS FONT METRIC OVERRIDE
   Issue: Fallback font has different metrics to
   Open Sans causing text reflow and CLS on load
   Fix: Match fallback font metrics to Open Sans
   to eliminate reflow when font switches
   Note: Three font version tested July 23 2026
   covering Open Sans, Sriracha and Poppins —
   no CLS improvement observed — reverted to
   single font version
   Added: July 22 2026
   Updated: July 23 2026
   To revert: Delete this block → save → purge cache
   ================================================ */

@font-face {
  font-family: "Open Sans";
  size-adjust: 100%;
  ascent-override: 106%;
  descent-override: 29%;
  line-gap-override: 0%;
  src: local("Arial");
}


/* ================================================
   FIX 5 — HEADER MIN HEIGHT CLS FIX
   Issue: Header collapses during load causing
   content reflow and CLS 0.998 on desktop
   Fix: Reserve minimum header height to prevent
   collapse before fonts and JS load
   Added: July 23 2026
   To revert: Delete this block → save → purge cache
   ================================================ */

.ast-custom-header {
  min-height: 80px;
}

/* ================================================
   FIX 6 — FOOTER H3 FONT SIZE CONTROL
   Issue: Footer "Krishna IVF Clinic" heading
   changed from H6 to H3 for accessibility
   and SEO heading hierarchy improvement
   H3 default size too large on desktop and mobile
   Fix: Reduce font size on all screens to match
   original appearance
   Location: Footer template elementor-1387
   Note: If HTML tag is changed in Elementor
   update the selector here to match
   Added: July 27 2026
   Updated: July 27 2026 — H4 to H3
   To revert: Delete this block → save → purge cache
   ================================================ */

.astra-advanced-hook-1387 h3 {
  font-size: 22px;
  margin-bottom: 5px;
}

@media (max-width: 767px) {
  .astra-advanced-hook-1387 h3 {
    font-size: 22px;
    margin-bottom: 5px;
  }
}


/* ================================================
   FIX 7 — SWIPER TOUCH TARGET SIZE
   Issue: Swiper navigation buttons and pagination
   bullets flagged as too small by PageSpeed
   Minimum touch target size is 24x24px
   Fix: Increase size to meet minimum touch target
   requirements per accessibility guidelines
   Added: July 27 2026
   Updated: July 28 2026 — bullet size increased
   to 24px to meet 24px minimum requirement
   To revert: Delete this block → save → purge cache
   ================================================ */

.swiper-pagination-bullet {
  width: 24px !important;
  height: 24px !important;
}
.swiper-button-next,
.swiper-button-prev,
.elementor-swiper-button-next,
.elementor-swiper-button-prev {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
}