/* LUG Healthcare - responsive overrides for the public pages.
   The page regions are generated with inline styles, so these rules match on the
   style attribute and need !important to win. Loaded by the Public Header region. */

/* Hamburger menu button: hidden on desktop */
.lug-burger { display: none; }
.lug-nav .lug-nav-m { display: none; }   /* distributor link: top bar on desktop, menu on mobile */
.lug-prod-img { min-height: 360px; }   /* product image card: at least this tall, otherwise as tall as the spec table */

/* Home FAQ */
.lug-faq { border-bottom: 1px solid #ece9e2; }
.lug-faq summary { cursor: pointer; list-style: none; position: relative; padding: 20px 44px 20px 0;
                   font-size: 19px; font-weight: 600; color: #1f2d3a; }
.lug-faq summary::-webkit-details-marker { display: none; }
.lug-faq summary::after { content: "+"; position: absolute; right: 8px; top: 14px; font-size: 28px; color: #4a7c59; }
.lug-faq[open] summary::after { content: "\2212"; }
.lug-faq p { margin: 0 0 20px; color: #4a5560; font-size: 16px; line-height: 1.7; }

.lug-nav a:hover { color: #4a7c59 !important; }
.lug-topbar a:hover { text-decoration: underline !important; }
.lug-wa:hover { filter: brightness(1.05); }

/* Six nav items: tighten before the hamburger takes over */
@media (max-width: 1280px) {
  .lug-nav { gap: 26px !important; }
  .lug-nav a { font-size: 16px !important; }
  .lug-nav a:last-child { padding: 10px 22px !important; }
  .lug-header, .lug-topbar { padding-left: 30px !important; padding-right: 30px !important; }
}

@media (max-width: 1024px) {
  /* Header: logo + hamburger, menu drops down as a column (6 links don't fit below 1024px) */
  .lug-header { flex-wrap: wrap; padding: 12px 20px !important; }
  .lug-header img { height: 44px !important; }
  .lug-burger {
    display: block; cursor: pointer; font-size: 28px; line-height: 1; background: #fff;
    padding: 6px 10px; color: #1f2d3a; border: 1px solid #ece9e2; border-radius: 8px;
  }
  .lug-nav {
    display: none !important; width: 100%;
    flex-direction: column; align-items: stretch !important; gap: 0 !important;
    padding-top: 10px;
  }
  .lug-header.lug-open .lug-nav { display: flex !important; }
  .lug-nav .lug-nav-m { display: block; }
  .lug-nav a { padding: 12px 4px !important; border-top: 1px solid #f0eee8; font-size: 17px !important; }
  .lug-nav a:last-child { margin-top: 10px; text-align: center; border-top: 0; }

  [style*="repeat(6, 1fr)"] { grid-template-columns: repeat(3, 1fr) !important; }
  [style*="gap:55px"] { gap: 28px !important; }
}

@media (max-width: 768px) {
  html, body { overflow-x: hidden; }
  .t-Body-content img { max-width: 100%; }

  .lug-prod-img { min-height: 300px; }
  .lug-faq summary { font-size: 17px; }

  /* Top bar: phone / WhatsApp / distributor only */
  .lug-topbar { justify-content: center !important; padding: 6px 12px !important; font-size: 13px !important; }
  .lug-topbar-note, .lug-topbar-dist { display: none; }
  .lug-topbar a { white-space: nowrap; }
  .lug-topbar > span { gap: 16px !important; }
  /* Floating WhatsApp: icon only */
  .lug-wa { padding: 13px !important; right: 14px !important; bottom: 14px !important; }
  .lug-wa-text { display: none; }

  /* Side padding: 50-80px -> 20px */
  [style*="px 60px"], [style*="px 80px"],
  [style*="padding:50px 50px"], [style*="padding:45px 50px"], [style*="padding:30px 35px"] {
    padding-left: 20px !important; padding-right: 20px !important;
  }
  [style*="padding:70px 60px"], [style*="padding:80px 60px"], [style*="padding:60px 60px"] {
    padding-top: 40px !important; padding-bottom: 40px !important;
  }

  /* Headings */
  [style*="font-size:48px"] { font-size: 30px !important; }
  [style*="font-size:42px"] { font-size: 28px !important; }
  [style*="font-size:36px"] { font-size: 26px !important; }
  [style*="font-size:32px"] { font-size: 24px !important; }
  [style*="margin:0 0 60px 0"], [style*="margin:0 auto 60px auto"] { margin-bottom: 30px !important; }

  /* Grids collapse to one column; product tiles to two */
  [style*="grid-template-columns"] { grid-template-columns: 1fr !important; gap: 20px !important; }
  [style*="repeat(6, 1fr)"] { grid-template-columns: repeat(2, 1fr) !important; gap: 12px !important; }
  [style*="border-right:1px solid rgba(31,45,58,.2)"] { border-right: 0 !important; }

  /* Fixed-width cards and columns */
  [style*="width:320px"], [style*="width:340px"] { width: 100% !important; max-width: 380px; }
  [style*="min-width:280px"], [style*="min-width:300px"], [style*="min-width:180px"] {
    min-width: 0 !important; flex-basis: 100% !important;
  }
  [style*="gap:40px"], [style*="gap:50px"] { gap: 24px !important; }
  td[style*="width:240px"] { width: 40% !important; }

  /* Home hero slider: image on top, text panel below, no decorative chevrons */
  #hero-slider { min-height: 0 !important; gap: 0 !important; }
  #hero-slider > div:first-child { min-height: 220px; }
  #hero-slider > div:nth-child(2) { min-height: 360px !important; padding: 24px 20px !important; }
  #hero-slider .slide-text { top: 24px !important; left: 20px !important; right: 20px !important; bottom: 48px !important; }
  #hero-slider [style*="border-left:120px"], #hero-slider [style*="border-left:90px"],
  #hero-slider [style*="clip-path"] { display: none !important; }
}