/* sevenoaks.live — supplementary styles beyond Tailwind utilities
   Design language: theROM.com (cream / ink / pine / mustard) */

::selection {
  background: #3A7D44;
  color: #FAF4EA;
}

body {
  background-image:
    radial-gradient(circle at 1px 1px, rgba(34,28,22,0.06) 1px, transparent 0);
  background-size: 22px 22px;
}

.text-balance { text-wrap: balance; }

.star-rating {
  color: #D6A13C;
  letter-spacing: 1px;
}

.card-lift {
  transition: transform .25s ease, box-shadow .25s ease;
}
.card-lift:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 30px -12px rgba(34,28,22,0.25);
}

.underline-brick {
  background-image: linear-gradient(#3A7D44, #3A7D44);
  background-repeat: no-repeat;
  background-position: 0 88%;
  background-size: 100% 3px;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
.animate-fade-up {
  animation: fadeUp .6s ease both;
}

.icon-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* ---------- Leaflet on cream ---------- */
.leaflet-container { font-family: Karla, system-ui, sans-serif; background: #EFE7D8; }
.leaflet-popup-content-wrapper {
  background: #FFFFFF;
  color: #221C16;
  border-radius: 14px;
  border: 1px solid rgba(34,28,22,0.12);
  box-shadow: 0 18px 30px -12px rgba(34,28,22,0.25);
}
.leaflet-popup-tip { background: #FFFFFF; }
.leaflet-popup-content { margin: 14px 18px; }
.leaflet-popup-content b { display: block; font-family: Fraunces, serif; font-size: 15px; }
.leaflet-popup-content span { color: rgba(34,28,22,0.6); font-size: 13px; display: block; }
.leaflet-popup-content a { color: #3A7D44; font-size: 13px; font-weight: 600; }
.leaflet-popup-close-button { color: rgba(34,28,22,0.5) !important; }
.leaflet-bar a {
  background: #FFFFFF !important;
  color: #221C16 !important;
  border-color: rgba(34,28,22,0.12) !important;
}
.leaflet-control-attribution {
  background: rgba(250,244,234,0.8) !important;
  color: rgba(34,28,22,0.45) !important;
  font-size: 10px !important;
}
.leaflet-control-attribution a { color: rgba(34,28,22,0.45) !important; }
.marker-dot {
  width: 28px; height: 28px; border-radius: 9999px;
  background: #3A7D44; color: #FAF4EA;
  border: 2px solid #FAF4EA;
  box-shadow: 0 4px 10px rgba(34,28,22,0.3);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px;
}

/* Category chip icons sizing */
.icon-chip svg { width: 20px; height: 20px; }

/* ---------- Directory business markers ---------- */
.biz-marker {
  width: 16px; height: 16px; border-radius: 9999px;
  border: 2px solid #FAF4EA;
  box-shadow: 0 2px 8px rgba(34,28,22,0.35);
}