<template>
  <div class="inpipe-card card-with-accent">
    <div class="card-inner">
      <slot></slot>
    </div>
  </div>
</template>

<script setup>
  defineProps({
    title: {
      type: String,
      default: ''
    }
  });
  </script>

<style scoped>
.inpipe-card {
  background-color: #ffffff; 
  border-radius: 0.5rem;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  position: relative;
  margin-bottom: 1rem;
}

.inpipe-card:hover {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.card-inner {
  padding: 0rem;
}
</style>
