/* Widget placeholders */
:root {
  --card-height: 452px;
  --card-fullwidth-height: 160px;
  --gap: 1.5rem;
}

.placeholder--card:empty {
  height: var(--card-height);
}

.placeholder--card-fullwidth:empty {
  height: var(--card-height);
}

.placeholder--card-boxed:empty {
  height: 472px;
}

.placeholder--card-single-review:empty {
  height: 500px;
}

.placeholder--card-filter:empty {
  --limit: 1;
  height: calc((var(--card-fullwidth-height) * var(--limit)) + ((var(--limit) - 1) * var(--gap)));
}

[data-shortcode='widget-video']:empty {
  flex: 0 1 auto;
  width: 24rem;
  aspect-ratio: 16 / 9;
}

[data-shortcode='widget-overview']:empty {
  height: 222px;
}

[data-shortcode='widget-pros-cons']:empty {
  height: 216px;
}

[data-shortcode='widget-icons']:empty {
  height: 398px;
}

@media screen and (min-width: 640px) {
  .placeholder--card-filter:empty {
    --limit: 1;
    height: calc((var(--card-fullwidth-height) * var(--limit)) + ((var(--limit) % 2) * var(--gap)));
    /* margin for filter and show more button */
    margin: 58px 0 76px;     
  }

  .placeholder--card-single-review:empty {
    height: 415px;
  }

  [data-shortcode='widget-overview']:empty {
    height: 496px;
  }

  [data-shortcode='widget-pros-cons']:empty {
    height: 176px;
  }
  
  [data-shortcode='widget-icons']:empty {
    height: 270px;
  }
}

@media screen and (min-width: 1024px) {
  .placeholder--card:empty {
    height: var(--card-height);
    /* margin for show more button */
    margin: 0 0 64px; 
  }

  .placeholder--card-fullwidth:empty {
    --limit: 1;
    height: calc((var(--card-fullwidth-height) * var(--limit)) + ((var(--limit) - 1) * var(--gap)));
    /* margin for show more button */
    margin: 0 0 64px; 
  }

  .placeholder--card-filter:empty {
    --limit: 1;
    height: calc((var(--card-fullwidth-height) * var(--limit)) + ((var(--limit) - 1) * var(--gap)));
  }

  .placeholder--card-single-review:empty {
    height: 208px;
  }

  [data-shortcode='widget-overview']:empty {
    height: 300px;
  }

  [data-shortcode='widget-pros-cons']:empty {
    height: 136px;
  }
  
  [data-shortcode='widget-icons']:empty {
    height: 342px;
  }
}