/* LOOVIE FRONTEND LUXURY NAVBAR + DARK MODE V5C
   Fix:
   1) Hover/active menu pada hero top tidak menutupi teks.
   2) Underline menu dibuat konsisten.
   3) Icon night mode terlihat pada hero top.
   4) Toggle dark mode diterapkan lebih luas ke frontend.
*/

/* =========================
   HERO TOP NAVBAR CONTRAST
   ========================= */

/* Saat homepage mentok atas: jangan pakai pill putih/pink pada menu,
   karena membuat teks tidak terbaca. */
body.loovie-luxury-v5.lv5-home-page .loovie-navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .nav-link,
body.loovie-luxury-v5.lv5-home-page nav.navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .nav-link {
    color: rgba(255,255,255,.88) !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    text-shadow: 0 1px 10px rgba(0,0,0,.16);
    padding-bottom: .72rem !important;
}

/* Hover dan active dibuat gold/white, bukan background terang */
body.loovie-luxury-v5.lv5-home-page .loovie-navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .nav-link:hover,
body.loovie-luxury-v5.lv5-home-page .loovie-navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .nav-link.active,
body.loovie-luxury-v5.lv5-home-page nav.navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .nav-link:hover,
body.loovie-luxury-v5.lv5-home-page nav.navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .nav-link.active {
    color: #E4C476 !important;
    background: transparent !important;
}

/* Jika ada class menu aktif yang membuat pill dari CSS lama, netralkan */
body.loovie-luxury-v5.lv5-home-page .loovie-navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .navbar-nav .active > .nav-link,
body.loovie-luxury-v5.lv5-home-page .loovie-navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .nav-item.active > .nav-link {
    color: #E4C476 !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Underline menu dibuat konsisten: satu model saja */
body.loovie-luxury-v5 .loovie-navbar .nav-link::after,
body.loovie-luxury-v5 nav.navbar .nav-link::after {
    content: "" !important;
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    bottom: .38rem !important;
    width: 0 !important;
    height: 2px !important;
    transform: translateX(-50%) !important;
    border-radius: 999px !important;
    background: #C5973A !important;
    opacity: 1 !important;
    transition: width .25s ease, opacity .25s ease !important;
}

/* Hover/active underline */
body.loovie-luxury-v5 .loovie-navbar .nav-link:hover::after,
body.loovie-luxury-v5 .loovie-navbar .nav-link.active::after,
body.loovie-luxury-v5 .loovie-navbar .navbar-nav .active > .nav-link::after,
body.loovie-luxury-v5 nav.navbar .nav-link:hover::after,
body.loovie-luxury-v5 nav.navbar .nav-link.active::after,
body.loovie-luxury-v5 nav.navbar .navbar-nav .active > .nav-link::after {
    width: calc(100% - 1.45rem) !important;
}

/* Hilangkan border/garis bawah model lama pada pill */
body.loovie-luxury-v5 .loovie-navbar .nav-link,
body.loovie-luxury-v5 nav.navbar .nav-link {
    border-bottom: 0 !important;
}

/* Saat navbar solid, aktif boleh pakai pill soft tapi teks tetap jelas */
body.loovie-luxury-v5 .loovie-navbar.scrolled .nav-link.active,
body.loovie-luxury-v5 .loovie-navbar.lv5-scrolled .nav-link.active,
body.loovie-luxury-v5 .loovie-navbar.lv5-force-solid .nav-link.active,
body.loovie-luxury-v5 nav.navbar.scrolled .nav-link.active,
body.loovie-luxury-v5 nav.navbar.lv5-scrolled .nav-link.active,
body.loovie-luxury-v5 nav.navbar.lv5-force-solid .nav-link.active,
body.loovie-luxury-v5.lv5-inner-page .loovie-navbar .nav-link.active,
body.loovie-luxury-v5.lv5-inner-page nav.navbar .nav-link.active {
    color: #1D2D48 !important;
    background: rgba(197,151,58,.10) !important;
    border-radius: 999px !important;
}

/* =========================
   THEME TOGGLE VISIBILITY
   ========================= */
body.loovie-luxury-v5.lv5-home-page .loovie-navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .theme-toggle,
body.loovie-luxury-v5.lv5-home-page nav.navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .theme-toggle,
body.loovie-luxury-v5.lv5-home-page .loovie-navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) [id*="theme" i],
body.loovie-luxury-v5.lv5-home-page nav.navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) [id*="theme" i] {
    color: rgba(255,255,255,.96) !important;
    border-color: rgba(255,255,255,.36) !important;
    background: rgba(255,255,255,.08) !important;
    opacity: 1 !important;
}

body.loovie-luxury-v5.lv5-home-page .loovie-navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .theme-toggle svg,
body.loovie-luxury-v5.lv5-home-page nav.navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .theme-toggle svg,
body.loovie-luxury-v5.lv5-home-page .loovie-navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) [id*="theme" i] svg,
body.loovie-luxury-v5.lv5-home-page nav.navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) [id*="theme" i] svg {
    stroke: currentColor !important;
    fill: currentColor !important;
    opacity: 1 !important;
}

/* Untuk icon bulan yang berupa font/icon */
body.loovie-luxury-v5.lv5-home-page .loovie-navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .bi-moon,
body.loovie-luxury-v5.lv5-home-page .loovie-navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .bi-moon-stars,
body.loovie-luxury-v5.lv5-home-page .loovie-navbar:not(.scrolled):not(.lv5-scrolled):not(.lv5-force-solid) .fa-moon {
    color: rgba(255,255,255,.96) !important;
}

/* =========================
   DARK MODE BROAD FRONTEND
   ========================= */

html.dark,
html[data-bs-theme="dark"],
body.dark,
body[data-bs-theme="dark"] {
    color-scheme: dark;
}

/* Root variables for dark */
html.dark body.loovie-luxury-v5,
html[data-bs-theme="dark"] body.loovie-luxury-v5,
body.loovie-luxury-v5.dark,
body.loovie-luxury-v5[data-bs-theme="dark"] {
    --lv5-cream: #0D1421;
    --lv5-white: #162232;
    --lv5-navy: #0D1421;
    --lv5-navy-mid: #18263A;
    --lv5-gold: #C5973A;
    --lv5-gold-light: #E4C476;
    --lv5-gold-pale: #201B0D;
    --lv5-rose: #D08B95;
    --lv5-blush: #241827;
    --lv5-charcoal: #D0DCF0;
    --lv5-muted: #8FA5BF;
    --lv5-border: #1C2D42;

    background: #0D1421 !important;
    color: #D0DCF0 !important;
}

/* Navbar dark solid */
html.dark body.loovie-luxury-v5 .loovie-navbar.scrolled,
html.dark body.loovie-luxury-v5 .loovie-navbar.lv5-scrolled,
html.dark body.loovie-luxury-v5 .loovie-navbar.lv5-force-solid,
html.dark body.loovie-luxury-v5.lv5-inner-page .loovie-navbar,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-navbar.scrolled,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-navbar.lv5-scrolled,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-navbar.lv5-force-solid,
html[data-bs-theme="dark"] body.loovie-luxury-v5.lv5-inner-page .loovie-navbar {
    background: rgba(11,17,28,.97) !important;
    border-bottom-color: #1C2D42 !important;
    box-shadow: 0 1px 0 #1C2D42 !important;
}

html.dark body.loovie-luxury-v5 .loovie-navbar.scrolled .nav-link,
html.dark body.loovie-luxury-v5 .loovie-navbar.lv5-scrolled .nav-link,
html.dark body.loovie-luxury-v5 .loovie-navbar.lv5-force-solid .nav-link,
html.dark body.loovie-luxury-v5.lv5-inner-page .loovie-navbar .nav-link,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-navbar.scrolled .nav-link,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-navbar.lv5-scrolled .nav-link,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-navbar.lv5-force-solid .nav-link,
html[data-bs-theme="dark"] body.loovie-luxury-v5.lv5-inner-page .loovie-navbar .nav-link {
    color: rgba(208,220,240,.82) !important;
}

html.dark body.loovie-luxury-v5 .loovie-navbar.scrolled .loovie-brand,
html.dark body.loovie-luxury-v5 .loovie-navbar.lv5-scrolled .loovie-brand,
html.dark body.loovie-luxury-v5 .loovie-navbar.lv5-force-solid .loovie-brand,
html.dark body.loovie-luxury-v5.lv5-inner-page .loovie-navbar .loovie-brand,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-navbar.scrolled .loovie-brand,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-navbar.lv5-scrolled .loovie-brand,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-navbar.lv5-force-solid .loovie-brand,
html[data-bs-theme="dark"] body.loovie-luxury-v5.lv5-inner-page .loovie-navbar .loovie-brand {
    color: #D0DCF0 !important;
}

/* Logo image di dark solid dibuat putih agar tetap terlihat */
html.dark body.loovie-luxury-v5 .loovie-navbar.scrolled .loovie-brand img,
html.dark body.loovie-luxury-v5 .loovie-navbar.lv5-scrolled .loovie-brand img,
html.dark body.loovie-luxury-v5 .loovie-navbar.lv5-force-solid .loovie-brand img,
html.dark body.loovie-luxury-v5.lv5-inner-page .loovie-navbar .loovie-brand img,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-navbar.scrolled .loovie-brand img,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-navbar.lv5-scrolled .loovie-brand img,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-navbar.lv5-force-solid .loovie-brand img,
html[data-bs-theme="dark"] body.loovie-luxury-v5.lv5-inner-page .loovie-navbar .loovie-brand img {
    filter: brightness(0) invert(1) drop-shadow(0 8px 18px rgba(0,0,0,.35)) !important;
}

/* General sections */
html.dark body.loovie-luxury-v5 .lv5-categories,
html.dark body.loovie-luxury-v5 .products,
html.dark body.loovie-luxury-v5 .lv5-section,
html.dark body.loovie-luxury-v5 .loovie-soft-section-wrapper,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .lv5-categories,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .products,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .lv5-section,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-soft-section-wrapper {
    background: #0D1421 !important;
    color: #D0DCF0 !important;
}

html.dark body.loovie-luxury-v5 .lv5-section-title,
html.dark body.loovie-luxury-v5 .section-title,
html.dark body.loovie-luxury-v5 h1,
html.dark body.loovie-luxury-v5 h2,
html.dark body.loovie-luxury-v5 h3,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .lv5-section-title,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .section-title,
html[data-bs-theme="dark"] body.loovie-luxury-v5 h1,
html[data-bs-theme="dark"] body.loovie-luxury-v5 h2,
html[data-bs-theme="dark"] body.loovie-luxury-v5 h3 {
    color: #D0DCF0 !important;
}

html.dark body.loovie-luxury-v5 .lv5-section-sub,
html.dark body.loovie-luxury-v5 .text-muted,
html.dark body.loovie-luxury-v5 p,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .lv5-section-sub,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .text-muted,
html[data-bs-theme="dark"] body.loovie-luxury-v5 p {
    color: #8FA5BF !important;
}

/* Cards/forms/tables */
html.dark body.loovie-luxury-v5 .lv5-product-card,
html.dark body.loovie-luxury-v5 .loovie-card,
html.dark body.loovie-luxury-v5 .card,
html.dark body.loovie-luxury-v5 .accordion-item,
html.dark body.loovie-luxury-v5 .loovie-form-section,
html.dark body.loovie-luxury-v5 .loovie-summary-card,
html.dark body.loovie-luxury-v5 .loovie-rental-box,
html.dark body.loovie-luxury-v5 .loovie-cart-item,
html.dark body.loovie-luxury-v5 .modal-content,
html.dark body.loovie-luxury-v5 .dropdown-menu,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .lv5-product-card,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-card,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .card,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .accordion-item,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-form-section,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-summary-card,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-rental-box,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-cart-item,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .modal-content,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .dropdown-menu {
    background: #162232 !important;
    color: #D0DCF0 !important;
    border-color: #1C2D42 !important;
}

html.dark body.loovie-luxury-v5 .lv5-prod-name,
html.dark body.loovie-luxury-v5 .lv5-prod-price,
html.dark body.loovie-luxury-v5 .loovie-price,
html.dark body.loovie-luxury-v5 .loovie-price-lg,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .lv5-prod-name,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .lv5-prod-price,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-price,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-price-lg {
    color: #E4C476 !important;
}

html.dark body.loovie-luxury-v5 .lv5-prod-cat,
html.dark body.loovie-luxury-v5 .lv5-prod-color,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .lv5-prod-cat,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .lv5-prod-color {
    color: #8FA5BF !important;
}

/* Inputs */
html.dark body.loovie-luxury-v5 .form-control,
html.dark body.loovie-luxury-v5 .form-select,
html.dark body.loovie-luxury-v5 input,
html.dark body.loovie-luxury-v5 textarea,
html.dark body.loovie-luxury-v5 select,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .form-control,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .form-select,
html[data-bs-theme="dark"] body.loovie-luxury-v5 input,
html[data-bs-theme="dark"] body.loovie-luxury-v5 textarea,
html[data-bs-theme="dark"] body.loovie-luxury-v5 select {
    background-color: #111B2A !important;
    color: #D0DCF0 !important;
    border-color: #263A55 !important;
}

html.dark body.loovie-luxury-v5 .form-control::placeholder,
html.dark body.loovie-luxury-v5 input::placeholder,
html.dark body.loovie-luxury-v5 textarea::placeholder,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .form-control::placeholder,
html[data-bs-theme="dark"] body.loovie-luxury-v5 input::placeholder,
html[data-bs-theme="dark"] body.loovie-luxury-v5 textarea::placeholder {
    color: #6E86A2 !important;
}

html.dark body.loovie-luxury-v5 label,
html.dark body.loovie-luxury-v5 .form-label,
html[data-bs-theme="dark"] body.loovie-luxury-v5 label,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .form-label {
    color: #D0DCF0 !important;
}

/* Alerts */
html.dark body.loovie-luxury-v5 .alert-info,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .alert-info {
    background: rgba(61, 176, 206, .13) !important;
    color: #B9ECF7 !important;
    border-color: rgba(61,176,206,.25) !important;
}

html.dark body.loovie-luxury-v5 .alert-warning,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .alert-warning {
    background: rgba(197,151,58,.13) !important;
    color: #E4C476 !important;
    border-color: rgba(197,151,58,.25) !important;
}

/* Customer/sidebar */
html.dark body.loovie-luxury-v5 .loovie-customer-sidebar,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-customer-sidebar {
    background: #0A101B !important;
}

html.dark body.loovie-luxury-v5 .loovie-dashboard-body,
html.dark body.loovie-luxury-v5 .loovie-dashboard-content,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-dashboard-body,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-dashboard-content {
    background: #0D1421 !important;
}

/* Buttons in dark */
html.dark body.loovie-luxury-v5 .btn-loovie-outline,
html.dark body.loovie-luxury-v5 .btn-outline-primary,
html.dark body.loovie-luxury-v5 .btn-outline-secondary,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .btn-loovie-outline,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .btn-outline-primary,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .btn-outline-secondary {
    color: #D0DCF0 !important;
    border-color: #263A55 !important;
    background: transparent !important;
}

/* Footer remains luxury dark */
html.dark body.loovie-luxury-v5 footer,
html.dark body.loovie-luxury-v5 .loovie-footer,
html[data-bs-theme="dark"] body.loovie-luxury-v5 footer,
html[data-bs-theme="dark"] body.loovie-luxury-v5 .loovie-footer {
    background: #07090F !important;
    color: rgba(208,220,240,.70) !important;
}

/* Dark mode transition */
html.lv5-theme-transition body.loovie-luxury-v5,
html.lv5-theme-transition body.loovie-luxury-v5 *,
html.lv5-theme-transition body.loovie-luxury-v5 *::before,
html.lv5-theme-transition body.loovie-luxury-v5 *::after {
    transition: background-color .25s ease, background .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease, filter .25s ease !important;
}