/* Barengin global light/dark theme. Loaded from the shared header. */
:root {
  --bg-page: #f8fcfd;
  --bg-surface: #ffffff;
  --bg-surface-soft: #f1f8fa;
  --text-primary: #102f3a;
  --text-secondary: #526f78;
  --text-muted: #6d8790;
  --theme-border: #d6e6e9;
  --theme-shadow: 0 16px 38px rgba(16, 47, 58, .09);
}
html[data-theme="dark"] {
  color-scheme: dark;
  --bg-page: #090620;
  --bg-surface: #100c31;
  --bg-surface-soft: #15113e;
  --text-primary: #f6f4ff;
  --text-secondary: #c6c2eb;
  --text-muted: #a19ed0;
  --theme-border: #2b2765;
  --theme-shadow: 0 18px 42px rgba(0, 0, 0, .34);
  --ink: #f6f4ff;
  --ink-soft: #c6c2eb;
  --muted: #a19ed0;
  --paper: #090620;
  --mist: #0c092c;
  --sky: #130f40;
  --white: #100c31;
  --gray-50: #0c092c;
  --gray-100: #100c31;
  --gray-200: #2b2765;
  --gray-300: #3d3a7a;
  --gray-500: #a19ed0;
  --gray-600: #c6c2eb;
  --gray-700: #dddaf7;
  --gray-800: #f6f4ff;
  --gray-900: #ffffff;
}
html[data-theme="dark"] body { background: var(--bg-page) !important; color: var(--text-primary) !important; }
html[data-theme="dark"] nav.navbar#navbar { background: rgba(9, 6, 32, .96) !important; color: var(--text-primary) !important; border-bottom: 1px solid var(--theme-border) !important; box-shadow: 0 10px 30px rgba(0,0,0,.34) !important; }
html[data-theme="dark"] nav.navbar#navbar .nav-menu > .nav-link,
html[data-theme="dark"] nav.navbar#navbar .nav-user,
html[data-theme="dark"] nav.navbar#navbar .nav-toggle,
html[data-theme="dark"] nav.navbar#navbar .nav-btn-login { color: var(--text-primary) !important; }
html[data-theme="dark"] nav.navbar#navbar .nav-toggle,
html[data-theme="dark"] nav.navbar#navbar .nav-user { background: var(--bg-surface-soft) !important; border-color: var(--theme-border) !important; }
html[data-theme="dark"] nav.navbar#navbar .dropdown-menu,
html[data-theme="dark"] .mobile-drawer { background: #0c082a !important; color: var(--text-primary) !important; border-color: var(--theme-border) !important; }
html[data-theme="dark"] nav.navbar#navbar .dropdown-menu a,
html[data-theme="dark"] .mobile-drawer a { color: var(--text-secondary) !important; }
html[data-theme="dark"] nav.navbar#navbar .dropdown-menu a:hover,
html[data-theme="dark"] .mobile-drawer a:hover { color: #8ea5ff !important; background: #15113e !important; }
html[data-theme="dark"] main,
html[data-theme="dark"] section,
html[data-theme="dark"] .section,
html[data-theme="dark"] .scene--light,
html[data-theme="dark"] .scene--mist,
html[data-theme="dark"] .page-wrapper,
html[data-theme="dark"] .content-wrapper,
html[data-theme="dark"] .dashboard-main-wrapper { color: var(--text-primary); }
html[data-theme="dark"] .scene--light,
html[data-theme="dark"] .scene--mist,
html[data-theme="dark"] .section { background: var(--bg-page) !important; }
html[data-theme="dark"] .scene--mist { background: radial-gradient(circle at 16% 8%, rgba(42, 78, 220, .12), transparent 26rem), linear-gradient(160deg, #090620, #0f0b33 62%, #120f3c) !important; }
html[data-theme="dark"] .stats-grid .stat-card { background: #100c31 !important; border: 1px solid #2b2765 !important; }
html[data-theme="dark"] .stat-num, html[data-theme="dark"] .stat-value { color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; text-shadow: 0 1px 0 rgba(0,0,0,.25); }
html[data-theme="dark"] .stat-label { color: #c6c2eb !important; -webkit-text-fill-color: #c6c2eb !important; }
html[data-theme="dark"] .stats-grid .stat-card > i { color: #7895ff !important; }
html[data-theme="dark"] .step { background: #100c31 !important; border-color: #2b2765 !important; box-shadow: 0 14px 34px rgba(0,0,0,.28) !important; }
html[data-theme="dark"] .step h3 { color: #f7f7ff !important; -webkit-text-fill-color: #f7f7ff !important; }
html[data-theme="dark"] .step p { color: #c6c2eb !important; -webkit-text-fill-color: #c6c2eb !important; }
html[data-theme="dark"] .step::before { background: #15104b !important; color: #8ca4ff !important; border-color: #4b488f !important; }
html[data-theme="dark"] .steps-spine { background: #2b2765 !important; }
html[data-theme="dark"] .phone-shell { border-color: #494788 !important; box-shadow: 0 18px 44px rgba(0,0,0,.4) !important; }
html[data-theme="dark"] .stage, html[data-theme="dark"] .stage--top { background: radial-gradient(circle at 12% 8%, rgba(37, 78, 225, .16), transparent 28rem), linear-gradient(160deg, #090620 0%, #0f0b33 58%, #120f40 100%) !important; }
html[data-theme="dark"] .stage::before, html[data-theme="dark"] .stage::after { opacity: .22 !important; }
html[data-theme="dark"] .proof, html[data-theme="dark"] .talk, html[data-theme="dark"] .float-card { background: var(--bg-surface) !important; color: var(--text-primary) !important; border-color: var(--theme-border) !important; box-shadow: var(--theme-shadow) !important; }
html[data-theme="dark"] .bi-channel-section { background: var(--bg-page) !important; color: var(--text-primary) !important; }
html[data-theme="dark"] .bi-channel-shell { background: var(--bg-surface) !important; color: var(--text-primary) !important; border-color: #6f6baa !important; box-shadow: 8px 9px 0 #040115 !important; }
html[data-theme="dark"] .bi-channel-title, html[data-theme="dark"] .bi-channel-friday-copy strong, html[data-theme="dark"] .bi-channel-phone-meta strong { color: var(--text-primary) !important; }
html[data-theme="dark"] .bi-channel-desc, html[data-theme="dark"] .bi-channel-friday-copy p, html[data-theme="dark"] .bi-channel-note { color: var(--text-secondary) !important; }
html[data-theme="dark"] .bi-channel-topics li, html[data-theme="dark"] .bi-channel-phone-head, html[data-theme="dark"] .bi-channel-message, html[data-theme="dark"] .bi-channel-friday { background: var(--bg-surface-soft) !important; color: var(--text-secondary) !important; border-color: var(--theme-border) !important; }
html[data-theme="dark"] .social-connect-section { background: var(--bg-page) !important; }
html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] h3,
html[data-theme="dark"] h4, html[data-theme="dark"] h5, html[data-theme="dark"] h6,
html[data-theme="dark"] .title, html[data-theme="dark"] .hero-title,
html[data-theme="dark"] .product-name, html[data-theme="dark"] .cat-name { color: var(--text-primary) !important; }
html[data-theme="dark"] p, html[data-theme="dark"] .desc, html[data-theme="dark"] .lede,
html[data-theme="dark"] .stage-lede, html[data-theme="dark"] .text-muted,
html[data-theme="dark"] small, html[data-theme="dark"] .cat-count { color: var(--text-secondary) !important; }
html[data-theme="dark"] .card, html[data-theme="dark"] .product-card,
html[data-theme="dark"] .cat-card, html[data-theme="dark"] .gp-card,
html[data-theme="dark"] .live-box, html[data-theme="dark"] .order-card,
html[data-theme="dark"] .profile-card, html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .settings-card, html[data-theme="dark"] .empty-state,
html[data-theme="dark"] .modal-content { background: var(--bg-surface) !important; color: var(--text-primary) !important; border-color: var(--theme-border) !important; box-shadow: var(--theme-shadow) !important; }
html[data-theme="dark"] input, html[data-theme="dark"] select,
html[data-theme="dark"] textarea { background: #0c092c !important; color: var(--text-primary) !important; border-color: var(--theme-border) !important; }
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color: #8683b8 !important; }
html[data-theme="dark"] .card-header, html[data-theme="dark"] .card-body, html[data-theme="dark"] .auth-card, html[data-theme="dark"] .auth-panel { background: var(--bg-surface) !important; color: var(--text-primary) !important; border-color: var(--theme-border) !important; }
html[data-theme="dark"] .form-label, html[data-theme="dark"] label, html[data-theme="dark"] .field-hint, html[data-theme="dark"] .step-label { color: var(--text-secondary) !important; }
html[data-theme="dark"] .steps, html[data-theme="dark"] .info-box, html[data-theme="dark"] .alert { background: var(--bg-surface-soft) !important; color: var(--text-secondary) !important; border-color: var(--theme-border) !important; }
html[data-theme="dark"] .brand, html[data-theme="dark"] .brand b { color: var(--text-primary) !important; }
html[data-theme="dark"] .google-btn { background: #f5f5fa !important; color: #202124 !important; border-color: #8986a9 !important; }
html[data-theme="dark"] table, html[data-theme="dark"] th,
html[data-theme="dark"] td { color: var(--text-primary); border-color: var(--theme-border) !important; }
html[data-theme="dark"] thead, html[data-theme="dark"] th { background: #15113e !important; }
html[data-theme="dark"] .hero-title *, html[data-theme="dark"] .proof *,
html[data-theme="dark"] .talk * { color: inherit; }
html[data-theme="dark"] .btn-outline { color: var(--text-primary) !important; background: var(--bg-surface) !important; border-color: #6864aa !important; }
html[data-theme="dark"] a:not(.btn):not(.nav-btn-register):not(.buy-btn) { text-decoration-color: currentColor; }
html[data-theme="dark"] #kategori, html[data-theme="dark"] #produk, html[data-theme="dark"] #grup-patungan, html[data-theme="dark"] #live, html[data-theme="dark"] #cara-order { background: var(--bg-page) !important; color: var(--text-primary) !important; }
html[data-theme="dark"] .product-price, html[data-theme="dark"] .price, html[data-theme="dark"] .amount, html[data-theme="dark"] .value { color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; }
html[data-theme="dark"] .notice { background: var(--bg-surface) !important; color: var(--text-secondary) !important; border-color: var(--theme-border) !important; box-shadow: var(--theme-shadow) !important; }
html[data-theme="dark"] .notice strong, html[data-theme="dark"] .notice h2, html[data-theme="dark"] .notice h3 { color: var(--text-primary) !important; }
html[data-theme="dark"] .notice p, html[data-theme="dark"] .notice li { color: var(--text-secondary) !important; }
html[data-theme="dark"] .notice-links a { color: #8ea5ff !important; }
html[data-theme="dark"] .cta-box { background: radial-gradient(circle at 82% 18%, rgba(88, 114, 236, .14), transparent 34%), linear-gradient(145deg, #0f0a31, #120e4b) !important; border: 1px solid var(--theme-border) !important; box-shadow: var(--theme-shadow) !important; }
html[data-theme="dark"] .cta-box, html[data-theme="dark"] .cta-box h2, html[data-theme="dark"] .cta-box p { color: #f6f4ff !important; }
html[data-theme="dark"] .product-media, html[data-theme="dark"] .product-body { background: var(--bg-surface) !important; border-color: var(--theme-border) !important; }
html[data-theme="dark"] .cat-icon { box-shadow: 0 10px 22px rgba(31, 72, 236, .18) !important; }
html[data-theme="dark"] .section-title, html[data-theme="dark"] .section-subtitle, html[data-theme="dark"] .card-title, html[data-theme="dark"] .order-title { color: var(--text-primary) !important; }
html[data-theme="dark"] .section-header, html[data-theme="dark"] .table-container, html[data-theme="dark"] .chart-container, html[data-theme="dark"] .panel, html[data-theme="dark"] .box { background-color: var(--bg-surface) !important; color: var(--text-primary) !important; border-color: var(--theme-border) !important; }
html[data-theme="dark"] .label, html[data-theme="dark"] .meta, html[data-theme="dark"] .description, html[data-theme="dark"] .card-text, html[data-theme="dark"] .order-meta { color: var(--text-secondary) !important; }
html[data-theme="dark"] hr { border-color: var(--theme-border) !important; }
html[data-theme="dark"] .products-page { background: radial-gradient(circle at 12% 5%, rgba(30, 70, 250, .1), transparent 30rem), var(--bg-page) !important; color: var(--text-primary) !important; --pd-ink: #f6f4ff; --pd-muted: #b0add5; --pd-white: #100c31; --pd-line: #2b2765; }
html[data-theme="dark"] .product-card-modern { background: #100c31 !important; color: var(--text-primary) !important; border: 1px solid #373371 !important; box-shadow: 0 14px 32px rgba(0,0,0,.3) !important; }
html[data-theme="dark"] .product-card-modern::before { border-color: rgba(100, 132, 251, .2) !important; }
html[data-theme="dark"] .product-image-wrapper { background: linear-gradient(155deg, #110e45 0%, #100c31 64%, #16123b 100%) !important; border-bottom: 1px solid #2b2765 !important; }
html[data-theme="dark"] .product-image-wrapper::before { background: rgba(45, 85, 237, .1) !important; }
html[data-theme="dark"] .product-image-wrapper::after { background: rgba(0,0,0,.22) !important; }
html[data-theme="dark"] .product-content, html[data-theme="dark"] .product-footer { background: #100c31 !important; color: var(--text-primary) !important; }
html[data-theme="dark"] .product-name, html[data-theme="dark"] .product-name a { color: #f7f7ff !important; -webkit-text-fill-color: #f7f7ff !important; }
html[data-theme="dark"] .price-current { color: #7593ff !important; -webkit-text-fill-color: #7593ff !important; }
html[data-theme="dark"] .price-old { color: #908ebe !important; -webkit-text-fill-color: #908ebe !important; }
html[data-theme="dark"] .product-category-tag { color: #87a1ff !important; background: #111053 !important; border: 1px solid rgba(117, 147, 255, .15) !important; }
html[data-theme="dark"] .in-stock { color: #63e6b6 !important; background: rgba(31,190,132,.14) !important; }
html[data-theme="dark"] .out-of-stock { color: #ff9caf !important; background: rgba(251,85,119,.14) !important; }
html[data-theme="dark"] .pd-buy-btn { color: #fff !important; -webkit-text-fill-color: #fff !important; box-shadow: 0 10px 22px rgba(0, 25, 210, .25) !important; }
html[data-theme="dark"] .controls-bar, html[data-theme="dark"] .category-pill, html[data-theme="dark"] .pd-panel, html[data-theme="dark"] .pd-mini-stat { background: #100c31 !important; color: var(--text-primary) !important; border-color: #2b2765 !important; }
html[data-theme="dark"] .category-pill { color: #bab8e2 !important; }
html[data-theme="dark"] .category-pill.active { color: #fff !important; background: linear-gradient(135deg, #0d3ed8, #1710e2) !important; }
html.barengin-handset .products-grid { grid-template-columns: 1fr !important; gap: 14px !important; }
html.barengin-handset .product-card-modern { min-width: 0; }
html.barengin-handset .product-content { padding: 14px 13px 10px !important; }
html.barengin-handset .product-footer { padding: 10px 13px 14px !important; align-items: stretch !important; flex-direction: column !important; }
html.barengin-handset .pd-buy-btn { width: 100% !important; min-height: 44px; margin-left: 0 !important; }
@media (max-width: 430px) { html.barengin-handset .products-grid { grid-template-columns: 1fr !important; } }

.global-pull-lamp { position: fixed; z-index: 2147483000; top: var(--home-header-height, 62px); right: 18px; width: 58px; height: 142px; pointer-events: none; transform-origin: 50% 0; animation: globalLampSway 4.8s ease-in-out infinite; }
.global-pull-lamp__button { position: relative; width: 58px; height: 142px; display: flex; flex-direction: column; align-items: center; padding: 0; border: 0; background: transparent; color: #161f48; cursor: grab; touch-action: none; user-select: none; pointer-events: auto; }
.global-pull-lamp__button:active { cursor: grabbing; }
.global-pull-lamp__cord { position: relative; width: 3px; height: 70px; flex: 0 0 auto; background: #161f48; box-shadow: 1px 0 rgba(255,255,255,.3); transition: height .17s ease, transform .17s ease; }
.global-pull-lamp__button:not(.is-pulling) .global-pull-lamp__cord { transform-origin: 50% 0; animation: globalCordBreeze 3.2s ease-in-out infinite; }
.global-pull-lamp__knot { position: absolute; left: 50%; bottom: -10px; width: 20px; height: 20px; transform: translateX(-50%); border: 3px solid #161f48; border-radius: 50%; background: #f5c518; box-shadow: 3px 3px 0 rgba(22, 31, 72, .8); }
.global-pull-lamp__bulb { display: grid; place-items: center; width: 50px; height: 50px; margin-top: 12px; border: 3px solid #161f48; border-radius: 50% 50% 44% 44%; background: #fff3a5; color: #df9700; box-shadow: 5px 5px 0 #161f48, 0 0 28px rgba(245,197,24,.35); font-size: 1.25rem; transition: background .25s ease, color .25s ease, box-shadow .25s ease; }
.global-pull-lamp__button.is-pulling .global-pull-lamp__cord { height: 94px; transform: rotate(var(--pull-tilt, 0deg)); }
.global-pull-lamp__button.is-pulling .global-pull-lamp__knot { transform: translateX(-50%) scale(1.08); }
html[data-theme="dark"] .global-pull-lamp__button { color: #dfdbff; }
html[data-theme="dark"] .global-pull-lamp__cord { background: #a19ed0; }
html[data-theme="dark"] .global-pull-lamp__knot { border-color: #c8c6ec; background: #798fff; box-shadow: 3px 3px 0 #040115; }
html[data-theme="dark"] .global-pull-lamp__bulb { border-color: #c8c6ec; background: #19134b; color: #ffd76a; box-shadow: 5px 5px 0 #040115, 0 0 20px rgba(255,215,106,.12); }
@keyframes globalLampSway { 0%,100% { transform: rotate(-2.3deg); } 35% { transform: rotate(1.7deg); } 68% { transform: rotate(2.8deg); } }
@keyframes globalCordBreeze { 0%,100% { transform: rotate(-3.5deg) translateX(-1px); } 28% { transform: rotate(2deg) translateX(1px); } 62% { transform: rotate(4.5deg) translateX(2px); } }
@keyframes globalLampSettle { 0% { transform: rotate(0); } 25% { transform: rotate(6deg); } 55% { transform: rotate(-4deg); } 78% { transform: rotate(2deg); } 100% { transform: rotate(0); } }
.global-pull-lamp.just-pulled { animation: globalLampSettle .75s ease-out 1; }
@media (max-width: 760px) { .global-pull-lamp { right: 7px; width: 48px; height: 116px; } .global-pull-lamp__button { width: 48px; height: 116px; } .global-pull-lamp__cord { height: 53px; } .global-pull-lamp__bulb { width: 42px; height: 42px; font-size: 1rem; } .global-pull-lamp__button.is-pulling .global-pull-lamp__cord { height: 76px; } }
@media (prefers-reduced-motion: reduce) { .global-pull-lamp, .global-pull-lamp.just-pulled, .global-pull-lamp__cord { animation: none !important; } .global-pull-lamp__cord { transition: none; } }
