/* Base layout styles for WC_Netto_Archive_Widget.
   Keep specificity low so Elementor control styles can override on the frontend. */

.wc-netto-archive-grid{
  display:grid;
  gap:20px;
}

.wc-netto-archive-list{
  display:flex;
  flex-direction:column;
  gap:20px;
}

.wc-netto-archive-list .wc-product{
  display:flex;
  gap:20px;
  width:100%;
  align-items:flex-start !important;
}

.wc-product-media{
  flex:0 0 220px;
  width:220px;
}

.wc-product-img{
  aspect-ratio:1/1;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.wc-product-img img{
  max-width:100%;
  max-height:100%;
  height:auto;
  width:auto;
  display:block;
}

.wc-actions{
  margin-top:10px;
}

.wc-netto-archive-list .wc-actions{
  display:flex;
  width:100%;
  align-items:center;
}

.wc-pagination{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:10px;
  padding:10px 0;
  margin-top:20px;
}

.wc-pagination a,
.wc-pagination span{
  display:inline-block;
  min-width:32px;
  text-align:center;
}

@media (max-width: 767px){
  .wc-pagination a,
  .wc-pagination span{
    min-width:28px;
  }
}


.wc-netto-archive-list .wc-product-content{
  /* Ensure the content column truly fills the remaining width,
     so actions alignment (left/center/right) is relative to the whole card width. */
  flex:1 1 0;
  width:0;
  min-width:0;
  display:flex;
  flex-direction:column;
  /* Content Y offset slider (Elementor control) applies transform here. */
}

.wc-netto-archive-list .wc-actions{
  width:100%;
  /* Push actions to the bottom of the content column by default */
  margin-top:auto;
}

.wc-netto-archive-list .wc-cart-icon{
  float:none;
}


.wc-product-short-description{
  margin-top:10px;
}

.wc-product-short-description p{
  margin:0;
}


.wc-netto-archive-list .wc-product{
  position:relative;
}

.wc-netto-archive-list .wc-product-separator{
  display:block;
  width:100%;
  box-sizing:border-box;
  border-top:0 !important;
  border-left:0 !important;
  border-right:0 !important;
  border-bottom:1px solid transparent;
  flex:0 0 auto;
  pointer-events:none;
}