/*
Theme Name: West End | Child Theme
Theme URI: http://www.elegantthemes.com/gallery/extra/
Template: Extra
Author: Kaleidoscope Coast
Author URI: http://www.elegantthemes.com
Description: Extra
Version: 4.27.4.1757275498
Updated: 2025-09-07 13:04:58

*/
/* ========== CORE MOBILE HARDENING ========== */
html, body { max-width: 100%; overflow-x: hidden; }
img, iframe, video { max-width: 100%; height: auto; }
.et_pb_row, .et_pb_column, .et_pb_module { word-wrap: break-word; }

/* Long tables (posts/widgets) scroll instead of blowing layout */
.et_pb_text table, .tribe-common table {
  display: block;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* ========== EVENTS CALENDAR SAFETY ========== */
.tribe-common, .tribe-events { word-break: break-word; }
.tribe-events .tribe-events-c-view { overflow-x: hidden; }

/* Homepage: hide Week view on phones; keep Upcoming List instead */
@media (max-width: 980px){
  .home .tribe-events-view--week,
  .home .tribe-events .tribe-events-c-view--week {
    display: none !important;
  }
}

/* ========== MOBILE MENU USABILITY ========== */
.et_mobile_menu { max-height: 75vh; overflow-y: auto; }
.et_header_style_left #logo { max-height: 48px !important; }

@media (max-width: 980px){
  .et_pb_column { margin-bottom: 24px; }

  /* Prevent header/menu from overlapping content on mobile */
  #main-header, #main-header-wrapper { position: relative !important; }
  html { margin-top: 0 !important; }

  /* Ensure mobile menu displays properly */
  .et_mobile_menu { display: block !important; }
  #et-navigation { display: block !important; }
}

/* ========== GENERIC AD SLOTS (QUADS/AdSense/Containers) ========== */
/* Visibility & responsiveness only; does not target AdsPro specifically */
.ad-slot,
.adsbygoogle,
.quads-location,
.quads-ad,
.adpro-container {
  display: block;
  max-width: 100% !important;
  overflow: hidden;
}
.ad-slot img,
.quads-ad img,
.adpro-container img {
  max-width: 100% !important;
  height: auto !important;
}

/* Optional: reserve space to reduce CLS on phones for generic ad areas */
@media (max-width: 980px){
  .ad-slot, .quads-ad, .adpro-container { min-height: 260px; }
}

/* ========== ADS PRO: GLOBAL SAFETY ========== */
/* Keep ad images visible and responsive; avoid aggressive resets */
.bsaProAds img {
  display: block !important;
  max-width: 100% !important;
  height: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* ===== HEADER LEADERBOARD FULL-BLEED (space id=4) ===== */
/* Kill Divi/Extra padding around the slot */
.header-adbar,
.header-adbar .et_pb_module,
.header-adbar .et_pb_code_inner,
.header-adbar .et_pb_row,
.header-adbar .et_pb_column {
  padding:0 !important; margin:0 !important; border:0 !important;
}

/* Ensure the AdsPro container has no width cap */
.header-adbar .bsaProAds[data-space="4"],
.header-adbar .bsaProAds[data-space="4"] .bsaProItem,
.header-adbar .bsaProAds[data-space="4"] .bsaProItemInner {
  box-sizing:border-box !important;
  width:100% !important; max-width:none !important;
  padding:0 !important; margin:0 !important; border:0 !important;
  float:none !important; display:block !important;
  overflow:visible !important;
}

/* Nuke any inline width coming from the skin (e.g., 728px) */
.header-adbar .bsaProAds[data-space="4"] [style*="width:728px"],
.header-adbar .bsaProAds[data-space="4"] [style*="width: 728px"],
.header-adbar .bsaProAds[data-space="4"] [style*="max-width:728px"],
.header-adbar .bsaProAds[data-space="4"] [style*="max-width: 728px"] {
  width:100% !important; max-width:none !important;
}

/* Our wrapper for image or HTML-type creatives */
.header-adbar .bsaProAds[data-space="4"] .kc-leader {
  width:100% !important;
  height:100px !important;       /* set the bar height you want */
  line-height:0 !important;
  overflow:hidden !important;
}

/* Make link and image fill the bar */
.header-adbar .bsaProAds[data-space="4"] .kc-leader > a {
  display:block !important; width:100% !important; height:100% !important;
}
.header-adbar .bsaProAds[data-space="4"] .kc-leader img {
  display:block !important; width:100% !important; height:100% !important;
  max-width:none !important; object-fit:cover !important; /* use contain if you prefer no crop */
}

/* Fallback: if you used Image-type (no .kc-leader) */
.header-adbar .bsaProAds[data-space="4"] a { display:block !important; width:100% !important; }
.header-adbar .bsaProAds[data-space="4"] img {
  display:block !important; width:100% !important; height:100px !important;
  max-width:none !important; object-fit:cover !important;
}

/* Optional: if the gray bar is a row with inner padding, zero just that row */
.header-adbar .et_pb_row { width:100% !important; max-width:none !important; }
/* ===== FOOTER LEADERBOARD FULL-BLEED (space id=5) ===== */
/* Kill Divi/Extra padding around the slot */
.footer-adbar,
.footer-adbar .et_pb_module,
.footer-adbar .et_pb_code_inner,
.footer-adbar .et_pb_row,
.footer-adbar .et_pb_column {
  padding:0 !important; margin:0 !important; border:0 !important;
}

/* Ensure the AdsPro container has no width cap */
.footer-adbar .bsaProAds[data-space="5"],
.footer-adbar .bsaProAds[data-space="5"] .bsaProItem,
.footer-adbar .bsaProAds[data-space="5"] .bsaProItemInner {
  box-sizing:border-box !important;
  width:100% !important; max-width:none !important;
  padding:0 !important; margin:0 !important; border:0 !important;
  float:none !important; display:block !important;
  overflow:visible !important;
}

/* Preferred: keep correct 728:90 proportion with auto height (no crop) */
.footer-adbar .bsaProAds[data-space="5"] .kc-leader {
  width:100% !important;
  aspect-ratio:728 / 90;     /* scales height automatically with width */
  line-height:0 !important;
  overflow:hidden !important;
}
.footer-adbar .bsaProAds[data-space="5"] .kc-leader > a {
  display:block !important; width:100% !important; height:100% !important;
}
.footer-adbar .bsaProAds[data-space="5"] .kc-leader img {
  display:block !important;
  width:100% !important; height:100% !important;
  max-width:none !important; object-fit:contain !important; /* change to 'cover' for edge-to-edge crop */
}

/* Fallback for Image-type ads (no .kc-leader) */
.footer-adbar .bsaProAds[data-space="5"] a { display:block !important; width:100% !important; }
.footer-adbar .bsaProAds[data-space="5"] img {
  display:block !important; width:100% !important; height:auto !important;
  max-width:none !important;
}

/* ===== IN-CALENDAR LEADERBOARD FULL-BLEED (space id=6) ===== */
.calendar-adbar,
.calendar-adbar .et_pb_module,
.calendar-adbar .et_pb_code_inner,
.calendar-adbar .et_pb_row,
.calendar-adbar .et_pb_column {
  padding:0 !important; margin:0 !important; border:0 !important;
}

/* Container unlock */
.calendar-adbar .bsaProAds[data-space="6"],
.calendar-adbar .bsaProAds[data-space="6"] .bsaProItem,
.calendar-adbar .bsaProAds[data-space="6"] .bsaProItemInner {
  box-sizing:border-box !important;
  width:100% !important; max-width:none !important;
  padding:0 !important; margin:0 !important; border:0 !important;
  float:none !important; display:block !important;
  overflow:visible !important;
}

/* Use proportionate height by default to avoid layout jump inside event views */
.calendar-adbar .bsaProAds[data-space="6"] .kc-leader {
  width:100% !important;
  aspect-ratio:728 / 90;     /* keeps 728:90; looks great in event layouts */
  line-height:0 !important;
  overflow:hidden !important;
}
.calendar-adbar .bsaProAds[data-space="6"] .kc-leader > a {
  display:block !important; width:100% !important; height:100% !important;
}
.calendar-adbar .bsaProAds[data-space="6"] .kc-leader img {
  display:block !important;
  width:100% !important; height:100% !important;
  max-width:none !important; object-fit:contain !important; /* 'cover' if you want edge-to-edge */
}

/* Fallback for Image-type ads */
.calendar-adbar .bsaProAds[data-space="6"] a { display:block !important; width:100% !important; }
.calendar-adbar .bsaProAds[data-space="6"] img {
  display:block !important; width:100% !important; height:auto !important;
  max-width:none !important;
}