/* MOL-GOD unified accordion styling + chevron (v1.8.0-rc.2) */
/* Matches: details.molgod-acc, details[class*="molgod-"][class*="-accordion"], molgod-shortcode details */

.molgod-accordions details,
.molgod-shortcode details,
details.molgod-acc,
details[class*="molgod-"][class*="-accordion"],
details[class*="molgod-"][class*="-widget"],
details[class*="molgod-"][class*="-calculator"] {
  margin: 8px 0 !important;
  border: 1px solid #e6ebf2 !important;
  border-radius: 8px !important;
  background: #fff !important;
  overflow: hidden;
  transition: border-color .15s;
}
.molgod-accordions details:hover,
details.molgod-acc:hover,
details[class*="molgod-"][class*="-accordion"]:hover {
  border-color: #c8d2e0 !important;
}
.molgod-accordions details > summary,
details.molgod-acc > summary,
details[class*="molgod-"][class*="-accordion"] > summary,
details[class*="molgod-"][class*="-widget"] > summary,
details[class*="molgod-"][class*="-calculator"] > summary {
  cursor: pointer !important;
  padding: 14px 18px !important;
  list-style: none !important;
  font-weight: 600 !important;
  color: #e8722e !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  user-select: none !important;
  position: relative;
  padding-right: 36px !important;
}
.molgod-accordions details > summary::-webkit-details-marker,
details.molgod-acc > summary::-webkit-details-marker,
details[class*="molgod-"] > summary::-webkit-details-marker {
  display: none !important;
}
/* Chevron arrow via ::after — ONLY when summary doesn't already have inline SVG */
.molgod-accordions details > summary:not(:has(svg))::after,
details.molgod-acc > summary:not(:has(svg))::after,
details[class*="molgod-"][class*="-accordion"] > summary:not(:has(svg))::after,
details[class*="molgod-"][class*="-widget"] > summary:not(:has(svg))::after,
details[class*="molgod-"][class*="-calculator"] > summary:not(:has(svg))::after {
  content: "";
  width: 10px; height: 10px;
  border-right: 2px solid #8693a5;
  border-bottom: 2px solid #8693a5;
  transform: translateY(-50%) rotate(45deg);
  transition: transform .18s ease;
  position: absolute;
  right: 14px;
  top: 50%;
}
.molgod-accordions details[open] > summary:not(:has(svg))::after,
details.molgod-acc[open] > summary:not(:has(svg))::after,
details[class*="molgod-"][class*="-accordion"][open] > summary:not(:has(svg))::after,
details[class*="molgod-"][class*="-widget"][open] > summary:not(:has(svg))::after,
details[class*="molgod-"][class*="-calculator"][open] > summary:not(:has(svg))::after {
  transform: translateY(-50%) rotate(-135deg);
}
/* Rotate existing inline SVGs too */
details[open] > summary svg {
  transform: rotate(180deg);
}
details > summary svg {
  transition: transform .18s ease;
}

/* Accordion body padding */
.molgod-accordions details > *:not(summary),
details.molgod-acc > *:not(summary),
details[class*="molgod-"][class*="-accordion"] > *:not(summary),
details[class*="molgod-"][class*="-widget"] > *:not(summary),
details[class*="molgod-"][class*="-calculator"] > *:not(summary) {
  padding: 0 18px 14px 18px !important;
}

/* Trust badge — always at very bottom */
.molgod-trust-badge {
  margin-top: 24px !important;
  margin-bottom: 0 !important;
}

/* Hide MS uploader inline-style fallback (must be inside details body) */
.molgod-ms-uploader-standalone {
  display: none !important;
}

/* SSR prose block — hidden from regular users (content shown via lazy accordion instead).
 * Visible to: Common Crawl (no CSS), users with JS disabled (no-js class), print. */
.molgod-ssr-overview {
  display: none;
}
.no-js .molgod-ssr-overview {
  display: block;
  margin: 0 0 1.5rem;
  padding: 1.2rem 1.5rem;
  background: #f9f9f9;
  border-left: 4px solid #0073aa;
  border-radius: 4px;
}
@media print {
  .molgod-ssr-overview {
    display: block !important;
  }
}
.molgod-ssr-content p { margin: 0 0 .85rem; line-height: 1.65; }
.molgod-ssr-content p:last-child { margin-bottom: 0; }

/* 2026-06-21 (UX): Wizualizator molekuly 3D owiniety w <details class="molgod-acc molgod-visualizer-acc"> (commit D2).
   Globalna regula '.molgod-acc > *:not(summary)' wcina kazde dziecko o 18px po bokach -> hero widget przestal
   wypelniac kolumne (operator: ma wypelniac kolumne jak przed owinieciem, akordeon zostaje).
   GENERYCZNE (kazdy produkt, nie per-molekula): zdejmij padding boczny i wymus pelna szerokosc widgetu
   tylko dla tego jednego akordeonu (wyzsza specyficznosc .molgod-acc.molgod-visualizer-acc bije regule bazowa). */
/* Pelna szerokosc: wizualizator owiniety w <details> siedzial w prawej kolumnie (~610px),
   beside floated gallery. clear:both zrzuca go pod galerię i rozciaga na pelna szerokosc
   div.product (1080px) -> render molekuly jak przed owinieciem w akordeon. Headless proof:
   610px@x650 -> 1080px@x180, figure 576 -> 1046. GENERYCZNE (kazdy produkt). */
details.molgod-acc.molgod-visualizer-acc {
  clear: both !important;
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}
/* Naglowek: summary mial justify-content:space-between -> pomaranczowy tytul wpychany w prawo i
   nachodzil na badge ID (position:absolute mu-plugin). flex-start trzyma emoji+tytul po lewej,
   badge zostaje po prawej (bez kolizji). Headless proof: tytul x 1048 -> 244. */
details.molgod-acc.molgod-visualizer-acc > summary {
  justify-content: flex-start !important;
}
details.molgod-acc.molgod-visualizer-acc > *:not(summary) {
  padding: 0 !important;
}
details.molgod-visualizer-acc .mol-god-woo-wrapper,
details.molgod-visualizer-acc .molgod-widget {
  width: 100% !important;
  max-width: none !important;
}

/* 2026-06-21 (operator): "BADANIA NAUKOWE" (.molgod-research-section) jako KAFELKI (grid) zamiast
   pionowej listy. CSS-only (generator class-research-section-generator.php jest HARD -> nie ruszamy).
   Naglowek pelna szerokosc, karty w responsywnych kolumnach. GENERYCZNE (kazdy produkt). */
.molgod-research-section {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
  gap: 12px !important;
  align-items: start !important;
}
.molgod-research-section > .molgod-research-heading {
  grid-column: 1 / -1 !important;
  margin-bottom: 2px !important;
}
.molgod-research-section > .molgod-research-card {
  margin-bottom: 0 !important;
}
@media (max-width: 600px) {
  .molgod-research-section { grid-template-columns: 1fr !important; }
}

/* 2026-06-21 (operator: "chce widziec ID, koniec i kropka"): znies FIX-A z accordion-id-badge.js
   ('.molgod-acc-id{display:none!important}' + '.molgod-id-tag{display:none!important}' wstrzykiwane JS-em,
   audyt 2026-06-15 "hide leaked ID token"). Decyzja operatora NADPISUJE ten audyt. Wyzsza specyficznosc
   (body .klasa = 0,1,1 > .klasa = 0,1,0) bije regule niezaleznie od kolejnosci. Server-side spany ID
   widoczne+kopiowalne (user-select:all juz inline) dla WSZYSTKICH, bez mu-plugina, zero kosztu perf. */
body .molgod-acc-id,
body .molgod-id-tag {
  display: inline-block !important;
}