/* Calc4Lab responsive layout safety layer
   Loaded after Bootstrap to prevent document-level horizontal overflow
   without changing canonical URLs, content hierarchy, or calculator logic. */

html {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden; /* fallback */
  overflow-x: clip;
}

body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden; /* fallback */
  overflow-x: clip;
}

/* Flex/grid children may otherwise keep their min-content width and push the viewport. */
main,
section,
article,
aside,
header,
footer,
nav,
.container,
.container-fluid,
.row > *,
.card,
.card-body,
.content-card,
.input-group,
.form-control,
.form-select,
.labuc-wrap,
.labuc-card,
.labuc-main,
.labuc-sidebar,
.labuc-content {
  min-width: 0;
}

img,
svg,
video,
canvas {
  max-width: 100%;
  height: auto;
}

iframe {
  max-width: 100%;
}

/* Long translated words, formulas and URLs must wrap instead of widening the page. */
.content-card,
.card-body,
.info-card,
.alert,
.breadcrumb,
.hero-section,
.labuc-card,
.labuc-result-row,
.labuc-related-link,
.labuc-note,
.labuc-example {
  overflow-wrap: anywhere;
  word-break: normal;
}

pre,
code,
.labuc-formula {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: pre-wrap;
}

.table-responsive {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* AdSense is asynchronous; a fixed-width creative must never enlarge the document. */
.c4l-ad-box,
.ad-wrapper,
.ad-container,
.ad-slot-wrap,
.ad-slot-inner,
.labuc-ad-wrap {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box;
  position: relative;
  z-index: 0;
  isolation: isolate;
  contain: layout paint;
}

.c4l-ad-unit,
.c4l-ad-box > ins.adsbygoogle,
.ad-wrapper ins.adsbygoogle,
.ad-container ins.adsbygoogle,
.ad-slot-inner ins.adsbygoogle,
.labuc-ad-wrap > ins.adsbygoogle {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box;
}

/* Do not let responsive form addons force the input group outside the card. */
.input-group > .form-control,
.input-group > .form-select {
  min-width: 0;
}

.input-group .ref-box,
.input-group-text {
  max-width: 100%;
  overflow-wrap: anywhere;
}

@media (max-width: 575.98px) {
  .content-card .card-body,
  .info-card {
    min-width: 0;
  }

  .input-group .ref-box {
    white-space: normal;
  }

  .breadcrumb {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  /* Keep the fixed mobile header within narrow viewports. */
  .navbar > .container {
    min-width: 0;
    gap: .25rem;
  }

  .navbar-brand {
    min-width: 0;
    margin-inline-end: .25rem;
  }

  .navbar-toggler {
    flex: 0 0 auto;
  }
}


/* Calculator action hardening: child spans never become a separate pointer target,
   and the action remains above any adjacent asynchronous ad stacking context. */
#calculateBtn {
  position: relative;
  z-index: 3;
  cursor: pointer;
  touch-action: manipulation;
}

#calculateBtn .button-text,
#calculateBtn .spinner-border {
  pointer-events: none;
}

/* The result itself is part of the interaction layer and must not be covered
   by the ad that follows it in the document. */
#result-area {
  position: relative;
  z-index: 2;
  isolation: isolate;
}