html {
    width: 100vw !important;
}

:root {
    --gold-primary: #d4af37;
    --gold-light: #f3e5ab;
    --velvet-green: #90a955; /* Soft pastel green */
    --velvet-green-soft: #a3b18a;
    --velvet-dark: #3a5a40; /* For text contrast */
    --ivory-base: #fdfbf7;
    --butter-yellow: #fefae0; /* Softer butter yellow */
    --glass-bg: rgba(253, 251, 247, 0.65);
    --glass-border: rgba(163, 177, 138, 0.4);
}

body {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    background: radial-gradient(circle at 50% 0%, var(--butter-yellow) 0%, var(--ivory-base) 40%, #e9f5db 100%) !important;
    color: var(--velvet-dark) !important;
    padding: 0 !important;
    width: 100% !important;
    overflow-x: hidden !important;
}

p, span, div, h1, h2, h3, h4, h5, h6, small, label {
    color: var(--velvet-dark);
}

.text-theme-auto,
html[data-bs-theme="dark"] .text-theme-auto,
html[data-bs-theme="light"] .text-theme-auto {
    color: var(--velvet-dark) !important;
}

.text-secondary {
    color: var(--velvet-green-soft) !important;
}

.btn-gmaps {
    background-color: var(--velvet-green) !important;
    color: #ffffff !important;
    border: 2px solid var(--ivory-base) !important;
    font-weight: 600 !important;
    border-radius: 50px !important;
    box-shadow: 0 8px 15px rgba(144, 169, 85, 0.3) !important;
    transition: all 0.3s ease !important;
}

.btn-gmaps * {
    color: #ffffff !important;
}

.btn-gmaps:hover {
    background-color: var(--velvet-dark) !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 25px rgba(58, 90, 64, 0.35) !important;
}

.glass-card {
    background: var(--glass-bg) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border: 1px solid var(--glass-border) !important;
    border-radius: 20px !important;
    box-shadow: 0 15px 35px 0 rgba(144, 169, 85, 0.1) !important;
}

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

.text-velvet {
    color: var(--velvet-dark) !important;
}

.bg-velvet {
    background-color: var(--velvet-green) !important;
    color: #ffffff !important;
}

/* Dark Mode Overrides untuk Tema Romantis Velvet */
html[data-bs-theme="dark"] body {
    background: radial-gradient(circle at 50% 0%, #1a2e22 0%, #0d1b12 50%, #050d08 100%) !important;
    color: #e9f5db !important;
}

html[data-bs-theme="dark"] p, 
html[data-bs-theme="dark"] span, 
html[data-bs-theme="dark"] div, 
html[data-bs-theme="dark"] h1, 
html[data-bs-theme="dark"] h2, 
html[data-bs-theme="dark"] h3, 
html[data-bs-theme="dark"] h4, 
html[data-bs-theme="dark"] h5, 
html[data-bs-theme="dark"] h6, 
html[data-bs-theme="dark"] small, 
html[data-bs-theme="dark"] label {
    color: #e9f5db !important;
}

html[data-bs-theme="dark"] .glass-card {
    background: rgba(20, 38, 27, 0.75) !important;
    border: 1px solid rgba(214, 186, 92, 0.3) !important;
    box-shadow: 0 15px 35px 0 rgba(0, 0, 0, 0.4) !important;
}

html[data-bs-theme="dark"] .text-velvet {
    color: #e9f5db !important;
}

html[data-bs-theme="dark"] .text-gold {
    color: #f3e5ab !important;
}

html[data-bs-theme="dark"] .btn-gmaps {
    background-color: #3a5a40 !important;
    border-color: #f3e5ab !important;
}

.page-link {
    backdrop-filter: blur(12px);
    transition: all 0.3s ease;
    font-weight: 600;
}

.page-item.disabled .page-link {
    background-color: var(--bs-pagination-disabled-bg);
}

i {
    width: auto !important;
}

svg {
    border-radius: unset;
}

svg>path {
    transition: color 350ms ease;
}

.navbar,
html[data-bs-theme="dark"] .navbar,
html[data-bs-theme="light"] .navbar {
    background-color: rgba(144, 169, 85, 0.85) !important; /* Hijau Velvet Pastel Soft */
    backdrop-filter: blur(12px) !important;
    border-top: 1px solid rgba(254, 250, 224, 0.5) !important;
    box-shadow: 0 -4px 20px rgba(144, 169, 85, 0.2) !important;
}

.nav-link {
    color: rgba(255, 255, 255, 0.85) !important;
    transition: all 0.2s ease;
}

.nav-link:hover,
.nav-link.active {
    color: #fefae0 !important;
    transform: translateY(-2px);
}

.nav-link i {
    color: inherit !important;
}

/* Custom Pagination Style */
.pagination {
    --bs-pagination-padding-x: 1.2rem;
    --bs-pagination-padding-y: 0.5rem;
    --bs-pagination-color: var(--velvet-dark);
    --bs-pagination-bg: rgba(253, 251, 247, 0.7);
    --bs-pagination-border-width: 1px;
    --bs-pagination-border-color: rgba(144, 169, 85, 0.4);
    --bs-pagination-border-radius: 20px;
    --bs-pagination-hover-color: var(--ivory-base);
    --bs-pagination-hover-bg: var(--velvet-green-soft);
    --bs-pagination-hover-border-color: var(--velvet-green);
    --bs-pagination-focus-color: var(--velvet-dark);
    --bs-pagination-focus-bg: var(--butter-yellow);
    --bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(144, 169, 85, 0.25);
    --bs-pagination-active-color: #ffffff;
    --bs-pagination-active-bg: var(--velvet-green);
    --bs-pagination-active-border-color: var(--velvet-green);
    --bs-pagination-disabled-color: rgba(58, 90, 64, 0.4);
    --bs-pagination-disabled-bg: rgba(253, 251, 247, 0.4);
    --bs-pagination-disabled-border-color: rgba(163, 177, 138, 0.2);
}

html[data-bs-theme="dark"] .btn-outline-auto {
    color: var(--bs-light);
    border-color: var(--bs-border-color);
}

html[data-bs-theme="light"] .btn-outline-auto {
    color: var(--bs-dark);
    border-color: var(--bs-border-color);
}

html[data-bs-theme="dark"] .bg-overlay-auto {
    background-color: rgba(0, 0, 0, 0.45);
}

html[data-bs-theme="light"] .bg-overlay-auto {
    background-color: rgba(255, 255, 255, 0.45);
}

.slide-desktop-active {
    transition: opacity 1.5s ease-in-out;
}