.title {
    @apply text-h-sm md:text-h-lg font-semibold;
}

/* beri ruang dari footer */
.voucher-section {
    @apply w-full pb-6 md:pb-8;
}

/* biar card bisa full-width tanpa ada gutter ekstra */
.voucher-section :global(.swiper-slide) {
    @apply flex items-start px-0 md:px-0;
}

.voucher-card {
    /* FULL width (hapus md:w-11/12), tetap horizontal & kompak */
    @apply w-full rounded-xl border border-gray-200 shadow-md
         p-4 flex items-start gap-x-4 bg-white;
}

.voucher-image {
    /* gambar kecil & stabil */
    @apply bg-gray-100 rounded-lg w-3/12 md:w-2/12 h-auto object-contain object-center;
}

.voucher-content {
    /* penting: min-w-0 supaya teks bisa wrap/ellipsis dan card memanjang mulus */
    @apply flex-1 min-w-0 flex flex-col justify-between;
}

.voucher-title {
    @apply font-medium text-body-1 leading-6 line-clamp-2 mb-1;
}
.voucher-desc {
    @apply text-gray-800 text-caption-1 line-clamp-1;
}

.voucher-bottom {
    /* biar rapih di semua ukuran layar */
    @apply flex flex-col sm:flex-row justify-between items-start sm:items-center 
         gap-2 sm:gap-3 mt-3;
}

.voucher-code-desc {
    @apply text-gray-500 text-caption-1;
}
.voucher-code {
    @apply text-red-700 font-medium;
}

/* tombol tetap kecil, tapi lebar penuh di mobile; tidak keluar dari card */
.voucher-copy {
    @apply bg-gray-200 hover:bg-danger-500 text-danger-500 hover:text-white transition-colors
         rounded-lg flex items-center justify-center px-5 py-1.5 text-sm whitespace-nowrap
         w-full md:w-auto;
}