/*
Theme Name: Nettl Divi Child
Theme URI: https://www.nettl.com/uk/
Description: Bespoke child theme for Divi
Author: Nettl
Author URI: https://www.nettl.com/uk/
Template: Divi
*/

.ra-class {
	border: 1px solid red;
}
/* 1. Zorg dat elke grid-kaart zich als kolom gedraagt en gelijkmatig kan rekken */
.grid-posts .dmach-grid-item {
  height: 100%;
}

.grid-posts .dmach-grid-item .grid-item-cont {
  height: 100%;
}

.grid-posts .dmach-grid-item .et_pb_row {
  height: 100%;
}

.grid-posts .dmach-grid-item .et_pb_column.et_pb_column_4_4 {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* 2. Afbeeldingvlak: vaste hoogte + schalen op basis van hoogte */
/* Wrapper: vaste hoogte, centreren en croppen */
.grid-posts .dmach-grid-item .et_pb_db_shop_thumbnail {
  height: 260px;              /* kies jouw gewenste kaart-hoogte */
  overflow: hidden;           /* alles buiten de container afkappen */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Afbeelding: schaalt op basis van hoogte */
.grid-posts .dmach-grid-item .et_pb_db_shop_thumbnail img {
  height: 100% !important;    /* override HTML-attribute + evt. Divi CSS */
  width: auto !important;     /* verhouding bewaren, niet oprekken */
  max-width: none;
  object-fit: cover;          /* extra veiligheid als er toch width:100% komt */
  display: block;
}


/* 3. Titel: vaste min-hoogte zodat alles mooi uitlijnt */
.grid-posts .dmach-grid-item .de_title_module.product_title {
  line-height: 1.3;
  display: flex;
  align-items: flex-start;
}

/* 4. Shortcode-blok (hoogte/diameter) gewoon z’n ding laten doen, 
   maar je kunt hier wat marge zetten als je wilt */
.grid-posts .dmach-grid-item .dimensions {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}

/* 5. Korte omschrijving: vult de “vrije” ruimte in de kaart op */
.grid-posts .dmach-grid-item .et_pb_db_short_desc {
  flex-grow: 1;                  /* duwt prijs/knop naar beneden */
  display: flex;
}

.grid-posts .dmach-grid-item .et_pb_db_short_desc .et_pb_module_inner {
  display: flex;
}

.grid-posts .dmach-grid-item .woocommerce-product-details__short-description {
  min-height: 4.8em;             /* ~3 regels tekst */
}

/* 6. Onderkant (prijs, ATC, button) netjes gegroepeerd houden */
.grid-posts .dmach-grid-item .et_pb_db_price,
.grid-posts .dmach-grid-item .et_pb_db_atc,
.grid-posts .dmach-grid-item .et_pb_db_shop_button {
  margin-top: 0;                 /* rare extra marges weghalen */
}
