@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&family=Poppins:wght@300;400;500;600;700&display=swap");

:root {
  --color-primary: #ff6b35;
  --color-secondary: #8b0000;
}

body {
  font-family: "Poppins", sans-serif;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  scrollbar-width: none; /* Untuk Firefox */
}

body::-webkit-scrollbar {
  display: none; /* Untuk Chrome, Safari, Edge */
}

/* Spinner Container */
.spinner-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 1);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

/* Spinner */
.spinner {
  border: 8px solid var(--color-secondary);
  border-top: 8px solid var(--color-primary);
  border-radius: 50%;
  width: 60px;
  height: 60px;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.font-display {
  font-family: "Playfair Display", serif;
}

.bg-primary {
  background-color: var(--color-primary);
}

.bg-secondary {
  background-color: var(--color-secondary);
}

.text-primary {
  color: var(--color-primary);
}

.text-secondary {
  color: var(--color-secondary);
}

.btn-primary {
  background-color: var(--color-primary);
  transition: all 0.3s ease;
}

.btn-primary:hover {
  background-color: #ff5721;
  transform: translateY(-2px);
}

.border-red-500 {
  border-color: #ef4444 !important; /* Warna border merah */
}

.error-message {
  color: #ef4444; /* Warna teks merah */
  font-size: 0.875rem; /* Ukuran teks kecil */
  margin-top: 0.25rem; /* Jarak dari input */
}

label:hover .border-gray-300 {
  border-color: #3b82f6;
}
.peer:checked + .border-gray-300 {
  /* border-color: #3b82f6; */
  /* background: #3b82f6; */
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.5);
}

.peer-checked\:bg-maroon:checked {
  background-color: #800000;
}
.peer-checked\:text-white:checked {
  color: white;
}