/* ULTRAMed Medical responsive patch — limited to the theme's existing UI classes. */
html { overflow-x: clip; }
body { min-width: 0; overflow-wrap: normal; }
.container { width: 100%; min-width: 0; }
img, svg, video, iframe { max-width: 100%; }
.nav-inner > *, .hero .container > *, .catalog-layout > *, .rfq-layout > *,
.um-product-layout > *, .products-grid > *, .category-grid > *, .footer-grid > * { min-width: 0; }
.product-card h3, .product-detail h1, .um-product-main h1,
.um-product-facts, .rfq-line-title, .um-rfq-products, .um-rfq-contact,
.um-breadcrumb, .meta-line { overflow-wrap: anywhere; }
.header-search input, .field input, .field select, .field textarea,
.um-quote-page input, .um-quote-page select, .um-quote-page textarea { min-width: 0; max-width: 100%; }
.product-img img, .um-gallery-main img { width: auto; height: auto; object-fit: contain; }
.topbar .container { flex-wrap: wrap; row-gap: 3px; }
.topbar .container > span { min-width: 0; overflow-wrap: anywhere; }

/* Preserve desktop layout and prevent intermediate-width header collisions. */
@media (max-width: 1050px) {
  .nav-inner { flex-wrap: wrap; gap: 12px; padding-block: 10px; }
  .header-search { order: 3; flex: 1 0 100%; width: 100%; max-width: none; }
  .header-actions { margin-inline-start: auto; }
  .primary-nav .container { gap: clamp(10px, 1.4vw, 20px); }
  .banner > * { min-width: 0; }
}
@media (max-width: 900px) {
  /* Existing theme hides the catalog category filter entirely at tablet widths. */
  .catalog-layout { grid-template-columns: minmax(0,1fr); gap: 16px; }
  .catalog-layout .filters { display: block; max-height: 240px; overflow-y: auto; }
  .catalog-layout .filters a { line-height: 1.5; }
  .products-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rfq-layout { grid-template-columns: minmax(0, 1fr); }
  .product-detail { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
  .container { padding-inline: clamp(12px, 3vw, 18px); }
  .nav-inner { min-height: 0; gap: 10px; padding-block: 11px; }
  .nav-inner .logo { flex: 0 1 auto; max-width: calc(100% - 130px); font-size: 21px; }
  .nav-inner .logo small { font-size: 8px; letter-spacing: 2px; }
  .nav-inner .logo-mark { flex: none; }
  .header-actions { gap: 9px; flex: 0 0 auto; white-space: nowrap; }
  .header-search { order: 3; flex-basis: 100%; margin: 0; }
  .header-search input { font-size: 16px; }
  .header-search button { min-width: 45px; min-height: 46px; }
  .umr-menu-toggle { display: inline-flex; width: 44px; height: 44px; flex: 0 0 44px;
    align-items: center; justify-content: center; border: 1px solid #bfd7f0; border-radius: 8px;
    background: #f3f9ff; color: #092747; padding: 8px; cursor: pointer; }
  .umr-menu-toggle:focus-visible, .primary-nav a:focus-visible { outline: 3px solid #00a4b7; outline-offset: 2px; }
  .umr-hamburger { display: grid; gap: 5px; width: 21px; }
  .umr-hamburger span { display: block; height: 2px; width: 100%; border-radius: 2px; background: currentColor; }
  .primary-nav { position: relative; z-index: 10; }
  /* With JavaScript disabled, retain the theme's original scrollable navigation. */
  body.umr-mobile-nav-ready .primary-nav .container { display: none; }
  body.umr-mobile-nav-ready .primary-nav.umr-nav-open .container { display: flex;
    flex-direction: column; align-items: stretch; gap: 0; padding-block: 7px; overflow-x: visible;
    overflow-y: auto; max-height: min(70vh, 470px); white-space: normal; }
  body.umr-mobile-nav-ready .primary-nav.umr-nav-open a { display: block; padding: 11px 8px;
    border-block-end: 1px solid #e7eff8; min-height: 44px; font-size: 14px; }
  .hero .container { grid-template-columns: minmax(0,1fr); min-height: auto; padding-block: 25px 8px; gap: 4px; }
  .hero h1 { font-size: clamp(25px, 7vw, 33px); line-height: 1.4; }
  .hero p { margin: 12px 0; }
  .hero-art { height: clamp(145px, 45vw, 225px); width: 100%; max-width: 380px; margin-inline: auto; }
  .hero-actions { gap: 9px; margin-block: 17px; }
  .hero-actions .btn { flex: 1 1 135px; text-align: center; min-height: 44px; }
  .value-row { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; padding-block: 15px; }
  .value { padding: 8px 4px; border-inline-end: 0; border-bottom: 1px solid #e5eef9; }
  .section { padding-block: 26px; }
  .section-head { gap: 12px; flex-wrap: wrap; }
  .section h2, .page-head h1 { font-size: clamp(21px, 5.5vw, 27px); }
  .category-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
  .category { font-size: 13px; padding-bottom: 12px; overflow-wrap: anywhere; }
  .category-visual { height: 100px; }
  .category-visual svg { height: 70px; }
  .products-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 11px; }
  .product-card { padding: 10px; }
  .product-card h3 { font-size: 13px; line-height: 1.55; min-height: 0; }
  .product-img { height: 145px; }
  .product-img img { max-height: 138px; }
  .product-card .btn { font-size: 12px; line-height: 1.5; min-height: 44px; white-space: normal; }
  .catalog-layout { gap: 14px; }
  .catalog-layout .filters { max-height: 205px; padding: 12px; }
  .page-head { padding-block: 24px; }
  .pagination { flex-wrap: wrap; }
  .um-product-layout { grid-template-columns: minmax(0,1fr); gap: 18px; }
  .um-gallery-main { min-height: 230px; }
  .um-product-main h1 { font-size: clamp(21px, 5.7vw, 26px); }
  .um-product-tabs { overflow-x: auto; max-width: 100%; }
  .um-product-tab-panels, .um-quick-panel { max-width: 100%; }
  .um-product-tabs [role=tab] { min-height: 44px; }
  .rfq-layout { grid-template-columns: minmax(0,1fr); gap: 14px; }
  .panel { padding: 16px 13px; }
  .um-rfq-steps { max-width: 100%; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
  .um-rfq-products .rfq-line { gap: 9px; flex-wrap: wrap; }
  .um-rfq-products .rfq-line-title { flex: 1 1 145px; }
  .um-rfq-products .rfq-line input[type=number] { width: 68px; }
  .um-rfq-products .btn, .um-rfq-contact .btn { min-height: 44px; }
  .banner { padding: 19px; }
  .banner .btn { width: 100%; margin-top: 13px; }
  .footer { margin-top: 28px; }
  .footer-grid { grid-template-columns: minmax(0,1fr); gap: 18px; }
  .footer-grid > div:first-child { grid-column: auto; }
  .footer a { overflow-wrap: anywhere; }
}
@media (max-width: 420px) {
  .nav-inner .logo { font-size: 17px; max-width: calc(100% - 124px); letter-spacing: -0.8px; }
  .nav-inner .logo-mark { width: 27px; height: 27px; border-width: 6px; }
  .nav-inner .logo small { font-size: 7px; letter-spacing: 1.5px; }
  .header-actions { gap: 6px; }
  .header-actions .mini-link { font-size: 12px; }
  .umr-menu-toggle { width: 40px; height: 40px; flex-basis: 40px; }
  .topbar .container { justify-content: center; text-align: center; gap: 1px 9px; }
  .topbar .container > span { flex: 1 1 100%; }
  .products-grid { grid-template-columns: minmax(0, 1fr); }
  .product-img { height: 190px; }
  .product-img img { max-height: 182px; }
  .product-card { padding: 12px; }
  .product-card h3 { font-size: 14px; }
  .value-row { gap: 6px; }
  .category-visual { height: 87px; }
  .um-qty-action { flex-wrap: wrap; }
  .um-qty-action .btn { min-width: 0; width: 100%; }
}
@media (min-width: 768px) {
  .umr-menu-toggle { display: none !important; }
}

/* ==============================================================
 * v1.1 — iOS Safari RTL horizontal overflow correction
 * Only constrains the ULTRAMed theme; no changes to product data.
 * This is intentionally appended after v1.0 rules.
 * ============================================================ */
@media screen and (max-width: 767px) {
  /* iOS Safari may still pan the document when only 'clip' is used on html.
   * Hidden on both root and body is more compatible with older WebKit. */
  html {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }
  body {
    width: 100%;
    max-width: 100%;
    min-width: 0 !important;
    margin-inline: 0;
    overflow-x: hidden !important;
  }
  .topbar, header, .primary-nav, .hero, .page-head, .section,
  .footer, main, .um-product-wrap, .um-quote-page {
    box-sizing: border-box;
    min-width: 0 !important;
    max-width: 100%;
  }
  /* Contain intrinsic sizes without pushing an RTL grid past the viewport. */
  .container, .nav-inner, .topbar .container, .primary-nav .container,
  .hero .container, .catalog-layout, .products-grid, .category-grid,
  .value-row, .rfq-layout, .um-product-layout, .footer-grid {
    box-sizing: border-box;
    min-width: 0 !important;
    width: 100%;
    max-width: 100%;
  }
  .container > *, .nav-inner > *, .hero .container > *,
  .catalog-layout > *, .rfq-layout > *, .um-product-layout > *,
  .footer-grid > * {
    min-width: 0 !important;
    max-width: 100%;
  }
  .nav-inner {
    flex-wrap: wrap !important;
    justify-content: space-between;
    align-items: center;
  }
  .nav-inner .logo {
    width: auto;
    flex: 0 1 auto;
    max-width: calc(100% - 122px);
    min-width: 0;
  }
  .nav-inner .logo > span:last-child {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .nav-inner .header-actions {
    flex: 0 0 auto;
    max-width: 122px;
    min-width: 0;
  }
  .nav-inner .header-search {
    /* Override theme's min-width:100% flex item, which can enlarge the row
     * in Safari when combined with padding and its inner input. */
    box-sizing: border-box;
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    order: 3;
    margin: 0;
    overflow: hidden;
  }
  .nav-inner .header-search input:not([type="hidden"]) {
    box-sizing: border-box;
    flex: 1 1 0%;
    width: 0 !important;
    min-width: 0 !important;
  }
  .nav-inner .header-search button {
    flex: 0 0 46px;
    width: 46px;
    padding-inline: 0;
  }
  .primary-nav .container {
    box-sizing: border-box;
  }
  .hero {
    overflow-x: hidden;
  }
  .hero .container {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px;
  }
  .hero .container > div, .hero h1, .hero p,
  .eyebrow, .hero-actions, .hero-art {
    box-sizing: border-box;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .hero h1 {
    width: auto;
    font-size: clamp(24px, 6.9vw, 32px);
    line-height: 1.4;
    white-space: normal !important;
    overflow-wrap: break-word;
  }
  .hero p, .eyebrow {
    overflow-wrap: anywhere;
    white-space: normal;
  }
  .hero-actions {
    display: flex;
    flex-wrap: wrap;
  }
  .hero-actions .btn {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
  }
  .hero-art {
    overflow: hidden;
  }
  .hero-art svg {
    display: block;
    width: 100%;
    max-width: 100%;
    height: 100%;
  }
  .value-row, .products-grid, .category-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .value-row > *, .products-grid > *, .category-grid > *,
  .product-card, .category, .panel {
    box-sizing: border-box;
    min-width: 0 !important;
    max-width: 100%;
  }
  .product-card h3, .category, .product-card small,
  .um-product-main h1, .um-quick-panel, .um-rfq-products, .rfq-line-title {
    overflow-wrap: anywhere;
    word-break: normal;
  }
  .rfq-line { max-width: 100%; flex-wrap: wrap; }
  .field, .field input, .field textarea, .field select {
    box-sizing: border-box;
    max-width: 100%;
    min-width: 0;
  }
  .footer-grid { grid-template-columns: minmax(0,1fr); }
}

@media screen and (max-width: 420px) {
  .nav-inner .logo { max-width: calc(100% - 116px); }
  .nav-inner .header-actions { max-width: 116px; gap: 4px; }
  .products-grid { grid-template-columns: minmax(0, 1fr); }
  .hero-actions .btn { flex: 1 1 100%; }
}
