/* =========================================================
   LISAVARUSTUS — full-width cards, 2 columns, blue + markers
   ========================================================= */

[id^="block_list_left_"] {
  --oneauto-blue: #0057ff;
  --oneauto-gap: 56px;
  --oneauto-plus-space: 18px;
}

/* ================= TEXT BLOCKS ================= */

[id^="block_list_left_"].block-type-text .pf-body > p {
  column-count: 2;
  column-gap: var(--oneauto-gap);
  margin: 0 !important;
}

[id^="block_list_left_"].block-type-text .pf-body > p:empty {
  display: none !important;
}

[id^="block_list_left_"].block-type-text .pf-body > p > div {
  break-inside: avoid;
  position: relative;
  padding-left: var(--oneauto-plus-space);
  margin: 0 !important;
  line-height: 1.55;
}

[id^="block_list_left_"].block-type-text .pf-body > p > div::before {
  content: "+";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--oneauto-blue);
  font-weight: 700;
}

/* ================= TABLE BLOCKS ================= */
/* Exclude Rattad */
[id^="block_list_left_"].block-type-table:not(#block_list_left_15) .extra-details {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

[id^="block_list_left_"].block-type-table:not(#block_list_left_15) .extra-details > li {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* =========================================================
   TABLE TYPE A:
   Simple label/value rows, e.g. Lähituled — Halogeen
   Only applies when item-property has ONE value
   ========================================================= */

[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):not(:has(.item-property > div:nth-child(2))) {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  column-gap: var(--oneauto-gap) !important;
  align-items: center !important;
}

[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):not(:has(.item-property > div:nth-child(2))) .item-attr,
[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):not(:has(.item-property > div:nth-child(2))) .item-property > div {
  display: block !important;
  margin: 0 !important;
  padding-left: var(--oneauto-plus-space) !important;
  line-height: 1.40 !important;
  font-weight: 400 !important;
  text-align: left !important;
  white-space: normal !important;
}

[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):not(:has(.item-property > div:nth-child(2))) .item-property {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  text-align: left !important;
}

/* No + for simple label/value rows */
[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):not(:has(.item-property > div:nth-child(2))) .item-attr::before,
[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):not(:has(.item-property > div:nth-child(2))) .item-property > div::before {
  content: none !important;
}

/* =========================================================
   TABLE TYPE B:
   Heading + multi-value list, e.g. Istmed:
   Juhiistme lisad → Elektriline iste, Peatugi, etc.
   ========================================================= */

[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):has(.item-property > div:nth-child(2)) {
  display: block !important;
  margin: 14px 0 0 0 !important;
  padding: 18px 0 0 0 !important;
  border-top: 1px solid #d6d6d6 !important;
}

[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):has(.item-property > div:nth-child(2)):first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}

[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):has(.item-property > div:nth-child(2)) .item-attr {
  display: block !important;
  margin: 0 0 8px 0 !important;
  padding: 0 !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
  text-align: left !important;
}

[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):has(.item-property > div:nth-child(2)) .item-property {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  column-count: 2 !important;
  column-gap: var(--oneauto-gap) !important;
  text-align: left !important;
}

[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):has(.item-property > div:nth-child(2)) .item-property > div {
  break-inside: avoid;
  display: block !important;
  position: relative;
  width: 100% !important;
  margin: 0 !important;
  padding-left: var(--oneauto-plus-space) !important;
  line-height: 1.40 !important;
  text-align: left !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

/* + for multi-value rows */
[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):has(.item-property > div:nth-child(2)) .item-property > div::before {
  content: "+";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--oneauto-blue);
  font-weight: 700;
}

/* No + before heading */
[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li:has(.item-attr:not(:empty)):has(.item-property > div:nth-child(2)) .item-attr::before {
  content: none !important;
}

/* =========================================================
   TABLE TYPE C:
   Empty label row = normal feature list, e.g. Tuled lower list
   ========================================================= */

[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li .item-attr:empty {
  display: none !important;
}

[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li .item-attr:empty + .item-property {
  display: block !important;
  width: 100% !important;
  margin: 14px 0 0 0 !important;
  padding: 18px 0 0 0 !important;
  border-top: 1px solid #d6d6d6 !important;
  column-count: 2 !important;
  column-gap: var(--oneauto-gap) !important;
  text-align: left !important;
}

[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li .item-attr:empty + .item-property > div {
  break-inside: avoid;
  position: relative;
  padding-left: var(--oneauto-plus-space) !important;
  margin: 0 !important;
  line-height: 1.40 !important;
  text-align: left !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

[id^="block_list_left_"].block-type-table:not(#block_list_left_15)
.extra-details > li .item-attr:empty + .item-property > div::before {
  content: "+";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--oneauto-blue);
  font-weight: 700;
}

/* ================= MOBILE ================= */

@media (max-width: 768px) {
  [id^="block_list_left_"].block-type-text .pf-body > p,
  [id^="block_list_left_"].block-type-table:not(#block_list_left_15)
  .extra-details > li .item-attr:empty + .item-property,
  [id^="block_list_left_"].block-type-table:not(#block_list_left_15)
  .extra-details > li:has(.item-attr:not(:empty)):has(.item-property > div:nth-child(2)) .item-property {
    column-count: 1 !important;
  }

  [id^="block_list_left_"].block-type-table:not(#block_list_left_15)
  .extra-details > li:has(.item-attr:not(:empty)):not(:has(.item-property > div:nth-child(2))) {
    column-gap: 24px !important;
  }
}

/* Mobile fix for Istmed-style multi-value table rows */
@media (max-width: 768px) {
  [id^="block_list_left_"].block-type-table:not(#block_list_left_15)
  .extra-details > li:has(.item-attr:not(:empty)):has(.item-property > div:nth-child(2)) .item-property > div::before {
    position: static !important;
    display: inline-block !important;
    width: 18px !important;
    min-width: 18px !important;
    color: var(--oneauto-blue) !important;
    font-weight: 700 !important;
    content: "+" !important;
  }

  [id^="block_list_left_"].block-type-table:not(#block_list_left_15)
  .extra-details > li:has(.item-attr:not(:empty)):has(.item-property > div:nth-child(2)) .item-property > div {
    padding-left: 0 !important;
    text-indent: 0 !important;
  }
}