@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=Plus+Jakarta+Sans:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,600;0,700;1,600&display=swap');

:root {
  --color-brand-primary: #5c3a21;
  --color-brand-dark: #372113;
  --color-brand-accent: #c07d38;
  --color-brand-cream: #fbf8f4;
  --color-brand-sand: #f0e6d8;
  --color-brand-tan: #dbc8b2;
}

html {
  scroll-behavior: smooth;
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

h1, h2, h3, .font-heading {
  font-family: 'Outfit', sans-serif;
}

.font-serif-title {
  font-family: 'Playfair Display', Georgia, serif;
}

/* Pulsing WhatsApp button */
.whatsapp-pulse {
  box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.65);
  animation: pulse-green 2.2s infinite;
}

@keyframes pulse-green {
  0% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
  }
  70% {
    box-shadow: 0 0 0 16px rgba(37, 211, 102, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0);
  }
}

/* Soft Badge glow */
.badge-soft-brown {
  background-color: rgba(92, 58, 33, 0.08);
  color: #5c3a21;
  border: 1px solid rgba(92, 58, 33, 0.2);
}

/* Lightbox Modal */
.lightbox-modal {
  transition: opacity 0.3s ease, visibility 0.3s ease;
  padding-top: max(3.75rem, env(safe-area-inset-top, 3.75rem));
  padding-bottom: max(2.5rem, env(safe-area-inset-bottom, 2.5rem));
  -webkit-overflow-scrolling: touch;
}

.lightbox-modal.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.lightbox-modal:not(.active) {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

/* Lightbox Image Zoom Transition */
#lightbox-img {
  cursor: zoom-in;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
  transform-origin: center center;
}

#lightbox-img.cursor-zoom-out {
  cursor: zoom-out !important;
}

/* Smooth Gallery Transitions */
.gallery-card {
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease;
}

.gallery-card:hover {
  transform: translateY(-4px);
}

.gallery-card img {
  transition: transform 0.5s ease;
}

.gallery-card:hover img {
  transform: scale(1.04);
}

/* Hero Overlay Gradient */
.hero-gradient {
  background: linear-gradient(180deg, rgba(30, 18, 10, 0.75) 0%, rgba(45, 27, 16, 0.6) 50%, rgba(20, 12, 6, 0.9) 100%);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #f1ede6;
}
::-webkit-scrollbar-thumb {
  background: #b89b82;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #5c3a21;
}

/* Tab indicator highlight */
.tab-active {
  background-color: #5c3a21 !important;
  color: #ffffff !important;
  border-color: #5c3a21 !important;
}

/* Dark Mode Enhancements */
.dark body {
  background-color: #12100e;
  color: #e7e2dc;
}

.dark ::-webkit-scrollbar-track {
  background: #1a1613;
}

.dark ::-webkit-scrollbar-thumb {
  background: #4a3627;
}

.dark ::-webkit-scrollbar-thumb:hover {
  background: #c07d38;
}

.dark .tab-active {
  background-color: #c07d38 !important;
  color: #ffffff !important;
  border-color: #c07d38 !important;
}

.dark .badge-soft-brown {
  background-color: rgba(192, 125, 56, 0.18);
  color: #f1b785;
  border: 1px solid rgba(192, 125, 56, 0.35);
}

/* Mobile & iOS Date Input Enhancements */
input[type="date"] {
  min-height: 48px;
  line-height: 1.3;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

input[type="date"]::-webkit-date-and-time-value {
  text-align: left;
  min-height: 1.3em;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: 0.75;
  padding: 4px;
  margin-left: 6px;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

input[type="date"]::-webkit-calendar-picker-indicator:hover {
  opacity: 1;
  transform: scale(1.1);
}

.dark input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(0.85);
}