@import 'antd/dist/reset.css'; 
/* @import 'antd/dist/antd.css';  */

@tailwind base;
@tailwind components;
@tailwind utilities;

html {
  font-size: 12px; /* Ubah ke 10px sebagai ukuran dasar */
}

body {
  font-size: 1.2rem; /* 1.6rem = 16px (karena root 10px) */
  /* font-family: 'DM Sans', sans-serif; */
  font-family: var(--font-dm-sans), sans-serif;
}

.background-body {
  /* position: fixed; */
  /* width: 100vw;
  height: 100vh; */
  /* background-image: url('/bg/doodle-big-out.webp'); */
  background-color: #F2F6D0;
}

/* Untuk mobile */
@media (max-width: 768px) {
  .background-top {
    aspect-ratio: 1/1; /* Jadi persegi di mobile */
  }
}

.card {
  border-radius: 8px;
  /* background-color: rgb(255, 255, 255); */
  padding: 1rem;
  transition: all 0.3s ease;
  max-width: 100%;
}

.card-head {
  /* border-radius: 8px; */
  background-color:#443627;
  color: white;
  padding: 1rem;
  transition: all 0.3s ease;
  max-width: 100%;
}

.card-shadow {
  border-radius: 8px;
  box-shadow: 0 4px 6px rgba(46, 45, 45, 0.1);
  background-color: rgb(255, 255, 255);
  padding: 1rem;
  transition: all 0.3s ease;
  max-width: 100%;
}

.bg-header-custom {
  background-color: #443627;
  padding-bottom: 120px;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}