<template>
  <div class="widget-footer">
    <slot />
  </div>
</template>

<style scoped lang="scss">
  @import "~styles/_helpers";

  .widget-footer {
    background-color: $color-grey--lighter;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    position: relative;
    border-bottom-left-radius: $default-border-radius;
    border-bottom-right-radius: $default-border-radius;
    visibility: hidden;
    padding-inline: $small-spacing;

    @include desktop {
      visibility: visible;
    }

    /*
     * For IE10+
     */
    -ms-grid-row: 2;
  }
</style>
