/* =====================================================
   TicketsFest.EU v10.0.6 — Mobile full-bleed viewport fix
   Purpose: remove the white side gutters/stripes on iPhone/Android created by
   global mobile padding on site wrappers. Keep only inner content gutters.
   ===================================================== */

@media (max-width: 767px) {
  html,
  body {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
  }

  #page,
  .site,
  .site-content,
  .site-main,
  .content-area,
  main,
  .tfe-page-wrapper,
  .tfe-events-page,
  .tfe-premium-page,
  .tfe-unified-page,
  .tfe-legacy-template-clean,
  .tfe-about-wrap,
  .tfe-legal-page,
  .tfe-tours-page,
  .tfe-artists-page,
  .tfe-contact-page {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }

  /* Full-bleed dark sections: the background must reach the phone edges. */
  body.home .tfe-hero-banner-section,
  body.page-template-page-home-dots .tfe-hero-banner-section,
  body:not(.home):not(.page-template-page-home-dots) .tfe-hero,
  body:not(.home):not(.page-template-page-home-dots) .tfe-page-hero,
  body:not(.home):not(.page-template-page-home-dots) .tfe-premium-hero,
  body:not(.home):not(.page-template-page-home-dots) .tfe-events-hero,
  body:not(.home):not(.page-template-page-home-dots) .tfe-legal-hero {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  /* Home banner: full dark shell, but the actual image keeps a clean inner gutter. */
  body.home .tfe-hero-banner-section,
  body.page-template-page-home-dots .tfe-hero-banner-section {
    padding-top: calc(118px + env(safe-area-inset-top, 0px)) !important;
    padding-bottom: 30px !important;
    border-radius: 0 0 28px 28px !important;
    background:
      radial-gradient(circle at 18% 12%, rgba(37,99,235,.16), transparent 34%),
      radial-gradient(circle at 88% 26%, rgba(236,72,153,.10), transparent 30%),
      linear-gradient(180deg, #0b1224 0%, #0f172a 100%) !important;
  }

  body.home .tfe-hero-banner-section .tfe-container,
  body.page-template-page-home-dots .tfe-hero-banner-section .tfe-container,
  body:not(.home):not(.page-template-page-home-dots) .tfe-hero > .tfe-container,
  body:not(.home):not(.page-template-page-home-dots) .tfe-page-hero > .tfe-container,
  body:not(.home):not(.page-template-page-home-dots) .tfe-premium-hero > .tfe-container,
  body:not(.home):not(.page-template-page-home-dots) .tfe-events-hero > .tfe-container,
  body:not(.home):not(.page-template-page-home-dots) .tfe-legal-hero > .tfe-container {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: calc(16px + env(safe-area-inset-left, 0px)) !important;
    padding-right: calc(16px + env(safe-area-inset-right, 0px)) !important;
    box-sizing: border-box !important;
  }

  body.home .tfe-hero-banner-section .tfe-banners-wrap,
  body.page-template-page-home-dots .tfe-hero-banner-section .tfe-banners-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    border-radius: 24px !important;
    overflow: hidden !important;
  }

  body.home .tfe-hero-banner-section .tftb-banners,
  body.home .tfe-hero-banner-section .tftb-track,
  body.home .tfe-hero-banner-section .tftb-slide,
  body.home .tfe-hero-banner-section .tftb-slide-inner,
  body.page-template-page-home-dots .tfe-hero-banner-section .tftb-banners,
  body.page-template-page-home-dots .tfe-hero-banner-section .tftb-track,
  body.page-template-page-home-dots .tfe-hero-banner-section .tftb-slide,
  body.page-template-page-home-dots .tfe-hero-banner-section .tftb-slide-inner {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  body.home .tfe-hero-banner-section .tftb-slide-inner,
  body.page-template-page-home-dots .tfe-hero-banner-section .tftb-slide-inner {
    aspect-ratio: 1600 / 791 !important;
    height: auto !important;
  }

  /* Regular content still needs readable inner gutters, not wrapper gutters. */
  .tfe-container,
  .tf-container,
  .ticketsfest-container,
  .tfe-events-archive-section,
  .tfe-events-featured-section,
  .tfe-events-seo-block,
  .tfe-events-faq,
  .tfe-single-layout,
  .tfe-tour-wrap,
  .tfe-performer-wrap,
  .tfe-single-wrap,
  .tfe-legal-content,
  .tfe-contact-wrap,
  .tfe-about-content {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: calc(16px + env(safe-area-inset-left, 0px)) !important;
    padding-right: calc(16px + env(safe-area-inset-right, 0px)) !important;
    box-sizing: border-box !important;
  }

  /* Avoid 100vw breakout bugs on iOS Safari where 100vw can include browser chrome/scrollbar. */
  [style*="100vw"],
  .tfe-full-bleed,
  .tfe-bleed {
    max-width: 100% !important;
  }
}

@media (max-width: 375px) {
  body.home .tfe-hero-banner-section .tfe-container,
  body.page-template-page-home-dots .tfe-hero-banner-section .tfe-container,
  .tfe-container,
  .tf-container,
  .ticketsfest-container,
  .tfe-events-archive-section,
  .tfe-events-featured-section,
  .tfe-events-seo-block,
  .tfe-events-faq,
  .tfe-single-layout,
  .tfe-tour-wrap,
  .tfe-performer-wrap,
  .tfe-single-wrap {
    padding-left: calc(14px + env(safe-area-inset-left, 0px)) !important;
    padding-right: calc(14px + env(safe-area-inset-right, 0px)) !important;
  }
}
