/* =========================================================
   Haşere Market - Product Description Component System
   File: hm-product.css
   Version: 1.0 pilot-fix
   Scope: AKINSOFT "Açıklamalar" content area only
   ========================================================= */

.hm-product {
  --hm-green-900:#174f37;
  --hm-green-800:#1d6545;
  --hm-green-700:#247a53;
  --hm-green-100:#eaf6ef;
  --hm-green-050:#f4faf6;
  --hm-orange-700:#b95f17;
  --hm-orange-050:#fff8f1;
  --hm-ink:#1f2c27;
  --hm-muted:#66736d;
  --hm-border:#dfe8e2;
  --hm-surface:#fff;
  --hm-surface-soft:#f7faf8;
  --hm-shadow:0 3px 12px rgba(24,78,54,.05);
  --hm-radius:12px;
  --hm-gap:10px;
  --hm-pad:12px;

  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  color:var(--hm-ink);
  font:400 14px/1.48 Arial,Helvetica,sans-serif;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

.hm-product,
.hm-product * { box-sizing:border-box; }

.hm-product section,
.hm-product article,
.hm-product aside,
.hm-product figure,
.hm-product details,
.hm-product div {
  min-width:0;
}

.hm-product section,
.hm-product article,
.hm-product aside {
  float:none !important;
  clear:none !important;
  max-width:none !important;
}

.hm-product img { max-width:100%; height:auto; }
.hm-product a { color:var(--hm-green-800); text-underline-offset:2px; }
.hm-product a:hover { color:var(--hm-green-900); }
.hm-product :focus-visible { outline:2px solid var(--hm-green-700); outline-offset:2px; }

.hm-product h2,
.hm-product h3,
.hm-product p,
.hm-product ul,
.hm-product ol,
.hm-product dl,
.hm-product figure { margin-top:0; }

.hm-product h2 {
  margin:0 0 6px;
  color:var(--hm-green-900);
  font-size:18px;
  line-height:1.25;
  font-weight:700;
}

.hm-product h3 {
  margin:0 0 5px;
  color:var(--hm-ink);
  font-size:15px;
  line-height:1.3;
  font-weight:700;
}

.hm-product p { margin:0 0 7px; }
.hm-product p:last-child,
.hm-product ul:last-child,
.hm-product ol:last-child { margin-bottom:0; }

.hm-product ul,
.hm-product ol { margin:0 0 7px; padding-left:18px; }
.hm-product li + li { margin-top:3px; }

.hm-product__section {
  width:100% !important;
  margin:10px 0 0 !important;
  padding:0 !important;
}

.hm-product__section:first-child { margin-top:0 !important; }

.hm-product__grid-2,
.hm-product__grid-3,
.hm-product__grid-4,
.hm-product__fit,
.hm-product__compare {
  width:100% !important;
  display:grid !important;
  gap:var(--hm-gap) !important;
  align-items:start !important;
  justify-items:stretch !important;
  justify-content:stretch !important;
}

.hm-product__grid-2,
.hm-product__fit,
.hm-product__compare { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }

.hm-product__grid-3 { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }

.hm-product__grid-4 { grid-template-columns:repeat(4,minmax(0,1fr)) !important; }

.hm-product__card,
.hm-product__fit-card,
.hm-product__decision-card,
.hm-product__compare-card,
.hm-product__evidence,
.hm-product__expert-note {
  width:100% !important;
  margin:0 !important;
  padding:var(--hm-pad) !important;
  border:1px solid var(--hm-border);
  border-radius:var(--hm-radius);
  background:var(--hm-surface);
  box-shadow:var(--hm-shadow);
}

.hm-product__card--soft { background:var(--hm-surface-soft); }
.hm-product__card--green,
.hm-product__expert-note { background:linear-gradient(135deg,var(--hm-green-050),#fff); }
.hm-product__card--orange { background:linear-gradient(135deg,var(--hm-orange-050),#fff); }

.hm-product__heading {
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
  width:100% !important;
  margin:0 0 7px !important;
}

.hm-product__heading > h2,
.hm-product__heading > h3 { margin:0 !important; }

.hm-product__heading-icon,
.hm-product__icon {
  width:28px !important;
  height:28px !important;
  flex:0 0 28px !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
}

.hm-product__heading-icon img,
.hm-product__icon img {
  width:28px !important;
  height:28px !important;
  object-fit:contain;
}

.hm-product__eyebrow {
  display:block;
  margin:0 0 2px;
  color:var(--hm-green-700);
  font-size:12px;
  line-height:1.2;
  font-weight:700;
}

.hm-product__chips {
  display:flex !important;
  flex-wrap:wrap !important;
  gap:5px !important;
  width:100% !important;
}

.hm-product__chip {
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:3px 8px;
  border:1px solid #d8e9df;
  border-radius:999px;
  background:var(--hm-green-050);
  color:var(--hm-green-900);
  font-size:11.5px;
  line-height:1.2;
  font-weight:700;
  white-space:nowrap;
}

.hm-product__chip--orange {
  border-color:#f0dac7;
  background:var(--hm-orange-050);
  color:var(--hm-orange-700);
}

/* 30 saniye */
.hm-product__quick {
  width:100% !important;
  margin:0 !important;
  padding:11px 12px !important;
  border:1px solid #d6e8dc;
  border-radius:var(--hm-radius);
  background:linear-gradient(90deg,#eef8f2 0%,#fbfdfb 100%);
}

.hm-product__quick-head {
  display:flex !important;
  align-items:center !important;
  gap:8px !important;
  margin:0 0 7px !important;
}

.hm-product__quick-head img {
  width:32px !important;
  height:32px !important;
  flex:0 0 32px !important;
  object-fit:contain;
}

.hm-product__quick-head h2 { margin:0 !important; }

.hm-product__quick-grid {
  width:100% !important;
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:8px !important;
  margin:8px 0 0 !important;
  padding:0 !important;
  overflow:visible !important;
}

.hm-product__quick-item {
  width:100% !important;
  margin:0 !important;
  padding:7px 9px !important;
  border-left:2px solid #cfe6d7;
}

.hm-product__quick-item strong {
  display:block;
  margin:0 0 2px;
  color:var(--hm-green-900);
  font-size:12.5px;
}

.hm-product__quick-item span {
  display:block;
  color:var(--hm-muted);
  font-size:11.5px;
  line-height:1.35;
}

/* uygun / başka çözüm */
.hm-product__fit-card--yes {
  border-color:#d6e8dc;
  background:var(--hm-green-050);
}

.hm-product__fit-card--other {
  border-color:#efd8c5;
  background:var(--hm-orange-050);
}

.hm-product__fit-list {
  display:grid;
  gap:4px;
  margin:0;
  padding:0;
  list-style:none;
}

.hm-product__fit-list li {
  position:relative;
  margin:0;
  padding-left:19px;
}

.hm-product__fit-list li::before {
  content:"✓";
  position:absolute;
  left:0;
  top:0;
  color:var(--hm-green-700);
  font-weight:800;
}

.hm-product__fit-card--other .hm-product__fit-list li::before {
  content:"→";
  color:var(--hm-orange-700);
}

/* karar kartları */
.hm-product__decision-card { box-shadow:none; }

.hm-product__decision-items {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  margin-top:7px;
}

.hm-product__decision-item {
  padding:6px 4px;
  border:1px solid #e5ebe7;
  border-radius:8px;
  background:#fbfdfc;
  text-align:center;
}

.hm-product__decision-item img {
  width:30px !important;
  height:30px !important;
  margin:0 auto 3px;
  object-fit:contain;
}

.hm-product__decision-item strong,
.hm-product__decision-item span {
  display:block;
  font-size:11px;
  line-height:1.25;
}

/* karşılaştırma */
.hm-product__compare-card { box-shadow:none; }

.hm-product__compare-card.is-recommended {
  border-color:#9fcab0;
  box-shadow:0 0 0 1px rgba(36,122,83,.06);
}

.hm-product__compare-badge {
  display:inline-flex;
  margin:0 0 5px;
  padding:3px 7px;
  border-radius:999px;
  background:var(--hm-green-100);
  color:var(--hm-green-900);
  font-size:10.5px;
  font-weight:700;
}

/* resmî / saha */
.hm-product__evidence { box-shadow:none; }
.hm-product__evidence--official { border-top:3px solid #d97b2b; }
.hm-product__evidence--field { border-top:3px solid var(--hm-green-700); }

.hm-product__evidence-label {
  display:block;
  margin:0 0 5px;
  color:var(--hm-muted);
  font-size:11px;
  font-weight:700;
}

.hm-product__pest-list {
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin:7px 0 0;
  padding:0;
  list-style:none;
}

.hm-product__pest-list li {
  display:inline-flex;
  align-items:center;
  gap:4px;
  margin:0;
  padding:4px 7px;
  border:1px solid #e3eae6;
  border-radius:999px;
  background:#fbfdfc;
  font-size:11px;
}

/* tablo */
.hm-product__table-wrap {
  width:100% !important;
  overflow-x:auto;
  margin:0;
  border:1px solid var(--hm-border);
  border-radius:9px;
  background:#fff;
}

.hm-product__table {
  width:100% !important;
  min-width:0 !important;
  border-collapse:collapse;
  table-layout:fixed;
  font-size:12px;
}

.hm-product__table th,
.hm-product__table td {
  padding:6px 7px;
  border-bottom:1px solid var(--hm-border);
  text-align:left;
  vertical-align:top;
  word-break:normal;
}

.hm-product__table th {
  background:var(--hm-green-050);
  color:var(--hm-green-900);
  font-weight:700;
}

.hm-product__table tr:last-child td { border-bottom:0; }

.hm-product__note-line {
  margin-top:6px;
  padding:7px 8px;
  border-radius:8px;
  background:var(--hm-green-050);
  color:var(--hm-muted);
  font-size:11.5px;
}

/* adımlar */
.hm-product__steps {
  display:grid;
  gap:7px;
  margin:0;
  padding:0;
  list-style:none;
  counter-reset:hm-step;
}

.hm-product__steps li {
  position:relative;
  min-height:30px;
  margin:0;
  padding-left:38px;
}

.hm-product__steps li::before {
  counter-increment:hm-step;
  content:counter(hm-step);
  position:absolute;
  left:0;
  top:0;
  width:27px;
  height:27px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:var(--hm-green-800);
  color:#fff;
  font-size:11px;
  font-weight:800;
}

.hm-product__steps strong {
  display:block;
  margin:0 0 1px;
  color:var(--hm-green-900);
  font-size:12.5px;
}

/* video */
.hm-product__video {
  width:100% !important;
  overflow:hidden;
  border:1px solid var(--hm-border);
  border-radius:var(--hm-radius);
  background:#fff;
}

.hm-product__video-frame {
  width:100% !important;
  aspect-ratio:16/9;
  min-height:0 !important;
  background:#eef3f0;
}

.hm-product__video-frame iframe {
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  border:0 !important;
}

.hm-product__video-copy { padding:8px 10px 10px; }

/* ilgili / alternatif: masaüstünde kompakt grid */
.hm-product__rail-shell { width:100% !important; min-width:0; }

.hm-product__rail {
  width:100% !important;
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  grid-auto-flow:row !important;
  gap:8px !important;
  overflow:visible !important;
  padding:0 !important;
}

.hm-product__product-card {
  width:100% !important;
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:52px minmax(0,1fr) !important;
  grid-template-rows:auto 1fr;
  column-gap:8px;
  row-gap:2px;
  align-items:start;
  margin:0 !important;
  padding:8px !important;
  border:1px solid var(--hm-border);
  border-radius:9px;
  background:#fff;
  text-decoration:none;
}

.hm-product__product-card img {
  grid-row:1 / span 2;
  width:48px !important;
  height:48px !important;
  margin:0 !important;
  object-fit:contain !important;
}

.hm-product__product-card strong {
  display:block;
  margin:0;
  color:var(--hm-green-900);
  font-size:12px;
  line-height:1.25;
}

.hm-product__product-card span {
  display:block;
  color:var(--hm-muted);
  font-size:11px;
  line-height:1.35;
}

.hm-product__rail-controls { display:none !important; }

/* linkler */
.hm-product__links,
.hm-product__docs {
  width:100% !important;
  display:grid !important;
  gap:6px !important;
}

.hm-product__link-card,
.hm-product__doc {
  width:100% !important;
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:28px minmax(0,1fr) 16px !important;
  align-items:center !important;
  gap:7px !important;
  margin:0 !important;
  padding:7px 9px !important;
  border:1px solid var(--hm-border);
  border-radius:8px;
  background:#fff;
  text-decoration:none;
}

.hm-product__link-card img {
  width:26px !important;
  height:26px !important;
  object-fit:contain;
}

.hm-product__link-copy,
.hm-product__link-copy strong,
.hm-product__link-copy span {
  min-width:0;
}

.hm-product__link-copy strong {
  display:block;
  color:var(--hm-green-900);
  font-size:12px;
  line-height:1.25;
}

.hm-product__link-copy span {
  display:block;
  margin-top:1px;
  color:var(--hm-muted);
  font-size:11px;
  line-height:1.3;
}

/* SSS */
.hm-product__faq {
  width:100% !important;
  display:grid !important;
  gap:5px !important;
}

.hm-product__faq details {
  width:100% !important;
  margin:0 !important;
  border:1px solid var(--hm-border);
  border-radius:8px;
  background:#fff;
  overflow:hidden;
}

.hm-product__faq summary {
  position:relative;
  padding:8px 32px 8px 9px;
  cursor:pointer;
  color:var(--hm-ink);
  font-size:12px;
  font-weight:700;
  list-style:none;
}

.hm-product__faq summary::-webkit-details-marker { display:none; }

.hm-product__faq summary::after {
  content:"+";
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  color:var(--hm-green-700);
  font-size:17px;
  font-weight:500;
}

.hm-product__faq details[open] summary::after { content:"–"; }

.hm-product__faq-answer {
  padding:0 9px 9px;
  color:var(--hm-muted);
  font-size:12px;
}

/* not / buton */
.hm-product__expert-note blockquote { margin:0; padding:0; border:0; font-style:normal; }

.hm-product__button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  margin-top:5px;
  padding:6px 10px;
  border:1px solid var(--hm-green-700);
  border-radius:8px;
  background:#fff;
  color:var(--hm-green-800);
  font-size:11.5px;
  font-weight:700;
  text-decoration:none;
}

.hm-product__muted {
  color:var(--hm-muted);
  font-size:11.5px;
}

/* tablet */
@media (max-width:980px) {
  .hm-product__quick-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .hm-product__grid-3 { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}

/* mobil */
@media (max-width:700px) {
  .hm-product {
    font-size:13.5px;
    line-height:1.45;
    --hm-gap:8px;
    --hm-pad:10px;
  }

  .hm-product h2 { font-size:16px; }
  .hm-product h3 { font-size:14px; }

  .hm-product__grid-2,
  .hm-product__grid-3,
  .hm-product__grid-4,
  .hm-product__fit,
  .hm-product__compare {
    grid-template-columns:1fr !important;
  }

  .hm-product__quick-grid {
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
  }

  .hm-product__quick-item { padding:6px 7px !important; }

  .hm-product__rail {
    display:grid !important;
    grid-auto-flow:column !important;
    grid-template-columns:none !important;
    grid-auto-columns:minmax(240px,82%) !important;
    overflow-x:auto !important;
    scroll-snap-type:x proximity;
    padding-bottom:4px !important;
  }

  .hm-product__rail > * { scroll-snap-align:start; }

  .hm-product__rail-controls {
    display:flex !important;
    gap:4px;
    margin-left:auto;
  }

  .hm-product__rail-btn {
    width:28px;
    height:28px;
    border:1px solid var(--hm-border);
    border-radius:7px;
    background:#fff;
    color:var(--hm-green-800);
  }

  .hm-product__table {
    min-width:480px !important;
    table-layout:auto;
  }
}

@media (max-width:430px) {
  .hm-product__quick-grid { grid-template-columns:1fr !important; }
  .hm-product__chip { white-space:normal; }
}
