@import "tailwindcss";

@source "./index.html";
@source "./Beer-glass.html";
@source "./glass-cups.html";

@theme {
  --color-brand: #064bd8;
  --color-brand-dark: #063caa;
  --color-ink: #101828;
  --color-muted: #667085;
  --color-soft: #f3f7ff;
}

@layer base {
  html {
    scroll-behavior: smooth;
  }

  body {
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    @apply text-base leading-7 antialiased;
  }
}

@layer components {
  .section {
    @apply py-16 md:py-24;
  }

  .container-page {
    @apply mx-auto w-full max-w-7xl px-4 sm:px-6 lg:px-8;
  }

  .section-title {
    @apply text-3xl font-black leading-tight tracking-tight text-ink md:text-4xl;
  }

  .section-kicker {
    @apply mb-3 text-xs font-bold uppercase tracking-[0.16em] text-brand md:text-sm;
  }

  .btn-primary {
    @apply inline-flex items-center justify-center gap-2 rounded-md bg-brand px-6 py-3 text-[15px] font-bold text-white shadow-sm transition hover:bg-brand-dark;
  }

  .btn-secondary {
    @apply inline-flex items-center justify-center gap-2 rounded-md border border-brand/20 bg-white px-6 py-3 text-[15px] font-bold text-brand transition hover:border-brand hover:bg-soft;
  }

  .btn-whatsapp,
  .whatsapp-btn {
    @apply inline-flex items-center justify-center gap-2 rounded-md bg-[#42b72a] px-5 py-3 text-[15px] font-bold text-white transition hover:bg-[#319a20];
  }

  .card {
    @apply rounded-lg border border-slate-200 bg-white shadow-sm;
  }

  .field {
    @apply w-full rounded-md border border-slate-200 bg-white px-4 py-3 text-base text-ink outline-none transition placeholder:text-slate-400 focus:border-brand focus:ring-4 focus:ring-brand/10;
  }

  .module-cta {
    @apply mt-10 flex flex-col items-center justify-center gap-3 sm:flex-row;
  }

  .product-card {
    @apply flex h-full flex-col overflow-hidden rounded-lg border border-slate-200 bg-white shadow-sm;
  }

  .product-body {
    @apply flex flex-1 flex-col p-5;
  }

  .product-actions {
    @apply mt-auto grid gap-3 pt-5;
  }
}