/* 
  TitikTemu Compiled CSS
  Normally generated by Tailwind, but provided here as a production-ready base.
*/

:root {
  --cream: #F5ECD7;
  --cream-dark: #EAD9B8;
  --green: #2D6A4F;
  --green-light: #52B788;
  --green-pale: #D8F3DC;
  --pink: #FF2D78;
  --pink-light: #FFB3CC;
  --brown: #6B4226;
  --gold: #C9A84C;
  --white: #FEFEFE;
}

body {
  background-color: var(--cream);
  font-family: 'Plus Jakarta Sans', sans-serif;
  color: var(--brown);
}

.font-display { font-family: 'Playfair Display', serif; }
.font-accent { font-family: 'Caveat', cursive; }

/* Custom Classes */
.btn-pink {
  background-color: var(--pink);
  color: var(--white);
  padding: 0.5rem 1.5rem;
  border-radius: 9999px;
  font-weight: 700;
  transition: all 0.2s;
}

.btn-pink:hover {
  opacity: 0.9;
  transform: scale(1.05);
}

.card-hover {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-hover:hover {
  transform: translateY(-4px);
  border-left: 4px solid var(--green);
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
}

.batik-pattern {
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 0l30 30-30 30L0 30z' fill='%23EAD9B8' fill-opacity='0.4' fill-rule='evenodd'/%3E%3C/svg%3E");
  background-repeat: repeat;
}

/* Scrollbar Hide for horizontal categories */
.scrollbar-hide::-webkit-scrollbar {
  display: none;
}
.scrollbar-hide {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Map Popups */
.leaflet-popup-content-wrapper {
  background-color: var(--cream) !important;
  color: var(--brown) !important;
}

.custom-cluster-icon div {
  background-color: var(--green);
  color: var(--white);
  border: 2px solid var(--cream);
}
