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

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

/* Base styles and variables - menggunakan palet baru */
:root {
  --color-primary: var(--tw-colors-bali-primary);
  --color-secondary: var(--tw-colors-bali-secondary);
  --color-accent: var(--tw-colors-bali-accent);
  --color-dark: var(--tw-colors-bali-dark);
  --color-light: var(--tw-colors-bali-light);
  --color-text-dark: var(--tw-colors-bali-text-dark);
  --color-text-light: var(--tw-colors-bali-text-light);
}

html {
  font-size: 16px;
  /* Base font size, lebih standar */
  scroll-behavior: smooth;
  overflow-x: hidden;
  /* Mencegah horizontal scroll yang tidak diinginkan */
}

body {
  font-family: theme('fontFamily.body');
  /* Default font untuk body */
  color: var(--color-text-dark);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* Custom Button Class - menggunakan palet baru */
.btn-primary {
  @apply bg-bali-primary text-bali-text-light py-3 px-8 rounded-full inline-block font-semibold text-lg transition-all duration-300 ease-in-out shadow-lg hover:bg-opacity-90 hover:scale-[1.02];
}

.btn-secondary {
  @apply border-2 border-bali-accent text-bali-accent bg-transparent py-3 px-8 rounded-full inline-block font-semibold text-lg transition-all duration-300 ease-in-out hover:bg-bali-accent hover:text-bali-dark;
}

/* Scrollbar styling for a polished look */
::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  background: var(--color-secondary);
}

::-webkit-scrollbar-thumb {
  background: var(--color-primary);
  border-radius: 6px;
  border: 3px solid var(--color-secondary);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-dark);
}