/* ==================================================
   MOBILE RESET LAYER - BALANCED VERSION
   Purpose: Fix overflow without breaking design
   Author: Nadlan / Noam Web-Build
================================================== */

@media (max-width: 768px) {
  
  /* ---------- OVERFLOW PREVENTION ---------- */
  
  /* מונע גלילה אופקית */
  html {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }
  
  body {
    overflow-x: hidden !important;
    max-width: 100vw !important;
    position: relative !important;
  }
  
  /* ---------- HEADER ---------- */
  
  header,
  .site-header,
  .nbt-header {
    position: relative !important;
    width: 100% !important;
    max-width: 100vw !important;
  }

  /* ---------- MAIN LAYOUT ---------- */

  .nbt-main-layout,
  .nbt-leftmedia-wrapper {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    max-width: 100vw !important;
    height: auto !important;
    min-height: unset !important;
    max-height: none !important;
  }

  /* ---------- LEFT MEDIA (IMAGE / VIDEO) ---------- */

  .nbt-leftmedia,
  .nbt-leftmedia-inner {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: unset !important;
  }

  /* מעלה את התמונה/וידאו למעלה */
  .nbt-leftmedia {
    order: -1;
    margin-bottom: 24px;
  }

  /* ביטול sticky במובייל */
  .nbt-leftmedia,
  .nbt-leftmedia * {
    position: relative !important;
  }

  /* ---------- CONTENT AREA ---------- */

  .nbt-content,
  .content-inner,
  .nbt-main-inner {
    width: 100% !important;
    max-width: 100vw !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* ---------- GRID / CLAMP OVERRIDE ---------- */

  .nbt-grid-layout,
  .nbt-clamp-layout {
    display: block !important;
    grid-template-columns: none !important;
  }

  /* ---------- SAFETY: VH FIX ---------- */

  .nbt-section,
  .nbt-hero,
  .nbt-main {
    min-height: unset !important;
    height: auto !important;
  }
}

/* ==================================================
   ELEMENTOR MOBILE FIX - BALANCED APPROACH
================================================== */
@media (max-width: 768px) {

  /* Container ראשי */
  .elementor,
  .elementor-inner,
  .elementor-section-wrap {
    max-width: 100vw !important;
    overflow-x: hidden !important;
  }

  /* Sections - רק width, לא padding */
  .elementor-section {
    width: 100% !important;
    max-width: 100vw !important;
    margin-inline-start: 0 !important;
    margin-inline-end: 0 !important;
  }

  /* Container - עם padding סביר */
  .elementor-container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Columns */
  .elementor-column {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Widget Wrap - לא נוגעים בpadding פנימי */
  .elementor-widget-wrap {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Widget Container - רק width */
  .elementor-widget-container {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* כותרות - רק תיקון width, לא גודל גופן */
  .elementor-heading-title {
    width: 100% !important;
    max-width: 100% !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }

  /* Text Editor */
  .elementor-widget-text-editor,
  .elementor-text-editor {
    width: 100% !important;
    max-width: 100% !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }

  /* Buttons - לא נוגעים בעיצוב, רק width */
  .elementor-button-wrapper {
    width: 100% !important;
    max-width: 100% !important;
  }
  
  .elementor-button {
    max-width: 100% !important;
  }

  /* RTL ספציפי */
  html[dir="rtl"] .elementor * {
    left: auto !important;
    right: auto !important;
  }

  /* ביטול Stretch Section */
  .elementor-section.elementor-section-stretched {
    width: 100% !important;
    max-width: 100vw !important;
    left: 0 !important;
    right: 0 !important;
  }

  /* תיקון Inner Section */
  .elementor-inner-section {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ==================================================
   ELEMENTOR COLUMNS WIDTH FIX
================================================== */
@media (max-width: 768px) {
  
  .elementor-column-gap-default > .elementor-column > .elementor-element-populated {
    padding: 10px !important;
  }
  
  .elementor-column-gap-narrow > .elementor-column > .elementor-element-populated {
    padding: 5px !important;
  }
  
  .elementor-column-gap-wide > .elementor-column > .elementor-element-populated {
    padding: 20px !important;
  }
}

/* ==================================================
   SPECIFIC ELEMENT WIDTH CONTROL
================================================== */
@media (max-width: 768px) {
  
  img {
    max-width: 100% !important;
    height: auto !important;
  }
  
  video,
  iframe {
    max-width: 100% !important;
    height: auto !important;
  }
  
  svg {
    max-width: 100% !important;
    height: auto !important;
  }
  
  table {
    max-width: 100% !important;
    overflow-x: auto !important;
    display: block !important;
  }
  
  pre,
  code {
    max-width: 100% !important;
    overflow-x: auto !important;
    word-wrap: break-word !important;
  }
}

/* ==================================================
   PREVENT NEGATIVE MARGINS
================================================== */
@media (max-width: 768px) {
  
  .elementor-section,
  .elementor-column,
  .elementor-widget {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  .elementor-section {
    margin-top: inherit;
    margin-bottom: inherit;
  }
}

/* ==================================================
   LAST RESORT - ABSOLUTE PREVENTION
================================================== */
@media (max-width: 768px) {
  
  .elementor-section,
  .elementor-container {
    overflow-x: hidden !important;
  }
  
  #page,
  #content,
  .site,
  .site-content {
    overflow-x: hidden !important;
    max-width: 100vw !important;
  }
}

/* ==================================================
   ELEMENTOR CENTERED ELEMENTS - MOBILE RTL FIX
================================================== */
@media (max-width: 768px) {

  .elementor-widget-button,
  .elementor-widget-heading,
  .elementor-widget-wrap {
    overflow: hidden !important;
  }

  .elementor-widget-button .elementor-button {
    max-width: 100% !important;
    width: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;
  }

  .elementor-heading-title {
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;
    word-break: break-word;
  }

  .elementor-inner-section,
  .elementor-inner-section .elementor-column {
    max-width: 100% !important;
    margin-inline-start: 0 !important;
    margin-inline-end: 0 !important;
  }

  .elementor-section,
  .elementor-column,
  .elementor-widget {
    min-width: 0 !important;
  }
}

/* ==================================================
   FIX: Stick content to image/video in mobile
   הצמדת התוכן לתמונה/וידאו במובייל
================================================== */
@media (max-width: 1023px) {
  
  /* ביטול ה-padding שיוצר רווח גדול */
  .site-content.nbt-leftimg-layout-clamp.nbt-leftimg-reserve .nbt-main-inner,
  .site-content.nbt-leftimg-reserve .nbt-main-inner,
  .content-inner.nbt-main-inner,
  .nbt-main-inner {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  
  /* padding רק לתוכן הפנימי */
  .nbt-main-content {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

/* ==================================================
   MOBILE BORDER FOR LEFT MEDIA - WITH FRAME WRAPPER
   מסגרת למובייל וטאבלט - דרך nbt-leftmedia-frame
================================================== */
@media (max-width: 1024px) {

  /* ביטול מסגרת מכל ה-containers */
  main,
  main.site-content,
  .site-content,
  .nbt-main-bg,
  .nbt-main-bg-left,
  .nbt-main-bg-left.has-video,
  .nbt-leftmedia,
  .nbt-leftmedia-wrapper,
  .nbt-leftmedia-inner {
    border: none !important;
    border-width: 0 !important;
    border-style: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  
  /* ביטול ::before/::after pseudo-elements */
  .nbt-main-bg-left::before,
  .nbt-main-bg-left::after {
    display: none !important;
    content: none !important;
  }

  /* מסגרת על ה-frame wrapper */
  .nbt-leftmedia-frame {
    border: var(--nbt-lm-border-w, 0) solid var(--nbt-lm-border-c, transparent) !important;
    border-radius: var(--nbt-lm-border-r, 0) !important;
    box-sizing: border-box !important;
    display: inline-block !important;
    overflow: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  
  /* הוידאו/תמונה ממלאים את ה-frame */
  .nbt-leftmedia-frame video,
  .nbt-leftmedia-frame img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    border: none !important;
    border-radius: 0 !important;
  }
  
  /* גיבוי: אם אין frame, מסגרת ישירות על המדיה */
  .nbt-main-bg-left:not(:has(.nbt-leftmedia-frame)) video.nbt-main-bg-video,
  .nbt-main-bg-left:not(:has(.nbt-leftmedia-frame)) > video,
  .nbt-main-bg-left:not(:has(.nbt-leftmedia-frame)) > img {
    border: var(--nbt-lm-border-w, 0) solid var(--nbt-lm-border-c, transparent) !important;
    border-radius: var(--nbt-lm-border-r, 0) !important;
    box-sizing: border-box !important;
  }
  
  /* ביטול מסגרת מ-icons קטנים */
  img[width="16"],
  img[width="24"],
  img[width="32"],
  img[height="16"],
  img[height="24"],
  img[height="32"],
  img.emoji,
  img[class*="icon"],
  img[class*="logo"],
  .elementor img[class*="icon"] {
    border: none !important;
    border-radius: 0 !important;
  }
}