/* =============================================================================
 * The "Buy me a Lambo" product page — AutoScout spec blocks
 * -----------------------------------------------------------------------------
 * Transported VERBATIM from themes/solutech/css/single.css lines 6151-6309
 * (every rule from "AutoScout Lambo Block Styles" through "Force Expandable
 * Content Visibility"). Re-hosted here for the same reason the fonts were:
 * solutech is no longer the active theme, so its stylesheet is never enqueued
 * and dies with the theme.
 *
 * Product 6883's post_content carries the AutoScout markup verbatim inside a
 * [vc_column_text]. Without these rules the spec grid rendered as a flat column
 * of unstyled text, and the section icons — which have no intrinsic size —
 * painted at ~340px because nothing constrained them.
 *
 * The class names are AutoScout's own CSS-module hashes
 * (VehicleOverview_itemContainer__XSLWi and friends). They look fragile and are
 * not: they are frozen in the stored post_content, so they can only change if
 * that content is rewritten.
 *
 * Taken as one contiguous region rather than rule-by-rule on purpose — an
 * earlier pass copied only the parts that looked relevant and missed the
 * DetailsSectionTitle icon sizing, which is exactly the rule that keeps those
 * icons at 24px.
 * ========================================================================== */

/* AutoScout Lambo Block Styles */
.StageArea_overviewContainer__UyZ9n {
    background: transparent;
    margin-top: 30px;
    margin-bottom: 30px;
}
.VehicleOverview_containerMoreThanFourItems__691k2 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    row-gap: 40px;
    column-gap: 24px;
}
@media (max-width: 1200px) {
    .VehicleOverview_containerMoreThanFourItems__691k2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 575px) {
    .VehicleOverview_containerMoreThanFourItems__691k2 {
        grid-template-columns: minmax(0, 1fr);
    }
}
.VehicleOverview_itemContainer__XSLWi {
    display: flex;
    flex-direction: row;
    align-items: start;
    border: none;
    text-align: left;
    padding: 0;
    min-width: 0;
}
.VehicleOverview_iconContainer__UyGyr {
    margin: 0 16px 0 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    opacity: 1;
}
.VehicleOverview_iconContainer__UyGyr svg {
    width: 24px;
    height: 24px;
    fill: currentColor;
    color: #333;
}
.VehicleOverview_itemContainer__XSLWi > div:nth-child(2) {
    display: flex;
    flex-direction: column;
}
.VehicleOverview_itemTitle__S2_lb {
    font-size: 16px;
    font-weight: 400;
    color: #676767;
    margin: 0;
    line-height: 24px;
    text-transform: none;
    letter-spacing: normal;
}
.VehicleOverview_itemText__AI4dA {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin: 0;
    line-height: 24px;
}

/* AutoScout Details Blocks */
.StageArea_details_injected {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 30px;
}
.StageArea_details_injected [class*="DetailsSection_detailsSection"] {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 24px;
}
.StageArea_details_injected [class*="DetailsSection_titleSection"] {
  grid-column: span 12 / span 12;
}
@media (min-width: 992px) {
  .StageArea_details_injected [class*="DetailsSection_titleSection"] {
    grid-column: span 4 / span 4;
  }
}

.StageArea_details_injected [class*="DetailsSection_childrenSection"] {
  grid-column: span 12 / span 12;
}
@media (min-width: 992px) {
  .StageArea_details_injected [class*="DetailsSection_childrenSection"] {
    grid-column: span 8 / span 8;
    position: relative;
    top: -3px;
  }
}
.StageArea_details_injected [class*="DetailsSection_container"] {
  border-top: 1px solid #dcdcdc;
  padding-top: 20px;
}


.StageArea_details_injected [class*="DataGrid_defaultDl"] {
  display: grid;
  grid-template-columns: 51.5% 1fr;
  gap: 10px;
  margin: 0;
  padding: 0;
}
.StageArea_details_injected dt {
  font-weight: normal;
  color: #666;
}
.StageArea_details_injected dd {
  font-weight: 500;
  color: #333;
  margin: 0;
}

/* Icon adjustments for Details Section */
.StageArea_details_injected [class*="DetailsSectionTitle_container"] {
  display: flex;
  align-items: start;
  gap: 12px;
}
.StageArea_details_injected [class*="DetailsSectionTitle_container"] svg {
  width: 24px;
  height: 24px;
  fill: currentColor;
  flex-shrink: 0;
  /* Nudged down to sit on the heading's optical baseline; the container is
   * `align-items: start`, which lines the icon up with the line box rather
   * than with the glyphs ( owner, 2026-09-16 ). */
  position: relative;
  top: 3px;
}
/* The `.vnm-product .vnm-product__body` prefix is load-bearing, not decoration.
 * vnm-product.css:75 sizes the product SUMMARY title with
 * `.vnm-product .vnm-product__body h2 { font-size: 23px }`, which also catches
 * these seven spec headings — it is both more specific (0,3,1) and enqueued
 * after this file. solutech's original `font-size: inherit` here has therefore
 * been inert since the transport; the 23px on screen was always that rule.
 * Matching its prefix and keeping the attribute selector gives 0,4,1, so the
 * 18px the owner asked for ( 2026-09-16 ) wins without an `!important`. */
.vnm-product .vnm-product__body .StageArea_details_injected h2[class*="DetailsSectionTitle_text"] {
  margin: 0;
  font-size: 18px;
  font-weight: bold;
  color: inherit;
}

/* Fix SVG sizes in Details DataGrid */
.StageArea_details_injected [class*="DataGrid_defaultDtStyle"] svg,
.StageArea_details_injected [class*="DataGrid_fontBold"] svg {
  width: 24px;
  height: 24px;
  fill: currentColor;
}

/* Force Expandable Content Visibility natively in CSS */
.StageArea_details_injected [class*="ExpandableDetailsSection_childContainer"] {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.DetailsSectionTitle_container__Sr9hK p:empty { display: none !important; margin: 0; padding: 0; opacity: 0; height: 0; }
.DetailsSectionTitle_container__Sr9hK > p:empty { display: none !important; }


