/* RAJAGACOR — Elegant casino gold & black theme (visual only) */
@import url("https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700;800&family=Cormorant+Garamond:ital,wght@0,500;0,600;0,700;1,500&family=Outfit:wght@300;400;500;600;700&display=swap");

#html-body.casino-luxury {
  --base-bg: 11, 10, 8;
  --base-color: 246, 238, 216;
  --gold: #d4af37;
  --gold-soft: #e8d48b;
  --gold-bright: #f6e7a3;
  --gold-deep: #8a6a1f;
  --gold-line: rgba(212, 175, 55, 0.45);
  --ink: #070705;
  --void: #0b0a08;
  --panel: #12100b;
  --panel-2: #1a160e;
  --ivory: #f6eed8;
  --muted: #cbb892;
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
  --font-display: "Cinzel", "Times New Roman", serif;
  --font-serif: "Cormorant Garamond", Georgia, serif;
  --font-ui: "Outfit", "Segoe UI", sans-serif;
}

#html-body.casino-luxury,
#html-body.casino-luxury body,
body.casino-luxury {
  background:
    radial-gradient(1200px 600px at 50% -10%, rgba(212, 175, 55, 0.16), transparent 55%),
    radial-gradient(800px 400px at 100% 20%, rgba(138, 106, 31, 0.12), transparent 50%),
    linear-gradient(180deg, #0d0b08 0%, #070705 40%, #0a0906 100%) !important;
  color: var(--ivory) !important;
  font-family: var(--font-ui) !important;
  min-height: 100vh;
}

#html-body.casino-luxury .page-wrapper,
#html-body.casino-luxury.catalog-product-view .page-wrapper,
#html-body.casino-luxury.catalog-product-view .page-main,
#html-body.casino-luxury.catalog-product-view .column.main,
#html-body.casino-luxury .nav-sections,
#html-body.casino-luxury .sections.nav-sections,
#html-body.casino-luxury .page-header .header.content,
#html-body.casino-luxury .page-header .panel.wrapper,
#html-body.casino-luxury .minicart-wrapper .block-minicart,
#html-body.casino-luxury .customer-menu,
#html-body.casino-luxury .block-search .control,
#html-body.casino-luxury #klevuSearchingArea,
#html-body.casino-luxury .klevu-fluid,
#html-body.casino-luxury [ku-container] {
  background: transparent !important;
  background-color: transparent !important;
}

#html-body.casino-luxury .page-wrapper {
  position: relative;
  z-index: 1;
}

#html-body.casino-luxury .minicart-wrapper .block-minicart,
#html-body.casino-luxury .customer-menu,
#html-body.casino-luxury #klevuSearchingArea,
#html-body.casino-luxury .klevu-fluid {
  background: #14110b !important;
  border: 1px solid var(--gold-line);
  color: var(--ivory) !important;
}

#html-body.casino-luxury a {
  color: var(--gold-soft);
}

#html-body.casino-luxury a:hover {
  color: var(--gold-bright);
}

/* Header */
#html-body.casino-luxury .page-header,
#html-body.casino-luxury .panel.wrapper,
#html-body.casino-luxury .panel.header,
#html-body.casino-luxury .header.content,
#html-body.casino-luxury .kanmo-middle-header,
#html-body.casino-luxury .navigation-wrapper {
  background: #0a0907 !important;
  color: var(--ivory) !important;
}

#html-body.casino-luxury .panel.header {
  background:
    linear-gradient(90deg, #1a1408, #0c0a07 40%, #1c160a) !important;
  border-bottom: 1px solid var(--gold-line);
}

#html-body.casino-luxury .header.content {
  border-bottom: 1px solid rgba(212, 175, 55, 0.28);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.35);
}

#html-body.casino-luxury .header_panel_info a,
#html-body.casino-luxury .header_panel_info li,
#html-body.casino-luxury .switcher-label,
#html-body.casino-luxury .switcher-trigger,
#html-body.casino-luxury .view-mothercare_website_bahasa span {
  color: var(--gold-soft) !important;
}

#html-body.casino-luxury .header_panel_info a {
  font-family: var(--font-display);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 12px;
}

#html-body.casino-luxury .logo img {
  filter: none;
}

#html-body.casino-luxury .navigation,
#html-body.casino-luxury .ves-megamenu,
#html-body.casino-luxury .nav-item > a,
#html-body.casino-luxury .nav-anchor,
#html-body.casino-luxury .nav-anchor span {
  color: var(--ivory) !important;
  background: transparent !important;
}

#html-body.casino-luxury .nav-item > a:hover,
#html-body.casino-luxury .nav-item:hover > a,
#html-body.casino-luxury .nav-anchor:hover span {
  color: var(--gold-bright) !important;
}

#html-body.casino-luxury .submenu,
#html-body.casino-luxury .dropdown-menu,
#html-body.casino-luxury .megamenu-content,
#html-body.casino-luxury .nav-dropdown,
#html-body.casino-luxury .ui-dialog {
  background: #14110b !important;
  color: var(--ivory) !important;
  border-color: var(--gold-line) !important;
}

#html-body.casino-luxury .action.nav-toggle:before,
#html-body.casino-luxury .action.nav-toggle span:before,
#html-body.casino-luxury .action.nav-toggle span:after {
  background: var(--gold) !important;
}

/* Search / account */
#html-body.casino-luxury .block-search,
#html-body.casino-luxury .minicart-wrapper,
#html-body.casino-luxury .kanmo-search-button-mc,
#html-body.casino-luxury input,
#html-body.casino-luxury select,
#html-body.casino-luxury textarea {
  background-color: #16130c !important;
  color: var(--ivory) !important;
  border-color: var(--gold-line) !important;
}

#html-body.casino-luxury input::placeholder {
  color: var(--muted) !important;
}

/* Main product stage */
#html-body.casino-luxury .page-main,
#html-body.casino-luxury .columns,
#html-body.casino-luxury .column.main,
#html-body.casino-luxury .product-info-wrapper,
#html-body.casino-luxury .product-info-main,
#html-body.casino-luxury .product-info,
#html-body.casino-luxury .product-config {
  background: transparent !important;
  color: var(--ivory) !important;
}

#html-body.casino-luxury .product-info-wrapper {
  padding: 18px 0 10px;
}

#html-body.casino-luxury .product-info-main,
#html-body.casino-luxury .product.media {
  background:
    linear-gradient(180deg, rgba(212, 175, 55, 0.07), transparent 30%),
    #100e0a !important;
  border: 1px solid var(--gold-line);
  border-radius: 20px;
  padding: 18px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
}

#html-body.casino-luxury .page-title,
#html-body.casino-luxury .page-title .base,
#html-body.casino-luxury h1.page-title {
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em;
  line-height: 1.25 !important;
  background: linear-gradient(180deg, #fff6c8 0%, #d4af37 48%, #8a6a1f 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
  filter: none;
}

#html-body.casino-luxury .price,
#html-body.casino-luxury .price-wrapper,
#html-body.casino-luxury .price-label,
#html-body.casino-luxury .normal-price {
  color: var(--gold-bright) !important;
  font-family: var(--font-display) !important;
}

#html-body.casino-luxury .price {
  font-size: 1.35em;
  text-shadow: none;
}

#html-body.casino-luxury .kc-cashback,
#html-body.casino-luxury .kredivo-label,
#html-body.casino-luxury .available-block {
  background: linear-gradient(180deg, #1b160d, #110e09) !important;
  border: 1px solid var(--gold-line) !important;
  border-radius: 14px !important;
  color: var(--muted) !important;
  box-shadow: var(--shadow);
  padding: 12px 16px;
}

#html-body.casino-luxury .kc-points-lable,
#html-body.casino-luxury .avail-text,
#html-body.casino-luxury .home,
#html-body.casino-luxury .store {
  color: var(--ivory) !important;
}

#html-body.casino-luxury .highlight-box {
  margin-top: 18px;
  padding: 22px 24px;
  background:
    linear-gradient(180deg, rgba(212, 175, 55, 0.08), transparent 28%),
    linear-gradient(180deg, #16130c, #100e0a);
  border: 1px solid var(--gold-line);
  border-radius: 18px;
  box-shadow: inset 0 0 0 1px rgba(255, 230, 160, 0.04), var(--shadow);
  color: #efe6cc !important;
}

#html-body.casino-luxury .highlight-box p {
  color: #efe6cc !important;
  font-family: var(--font-serif) !important;
  font-size: 18px;
  line-height: 1.7;
}

#html-body.casino-luxury .highlight-box a,
#html-body.casino-luxury a[style*="color: orange"] {
  color: var(--gold-bright) !important;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid rgba(212, 175, 55, 0.4);
}

/* Gallery as gold frame */
#html-body.casino-luxury .product.media,
#html-body.casino-luxury .breeze-gallery,
#html-body.casino-luxury .main-image-wrapper,
#html-body.casino-luxury .stage {
  background: #0e0c08 !important;
  border-radius: 18px;
}

#html-body.casino-luxury .main-image-wrapper {
  border: 1px solid var(--gold-line);
  box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.12), 0 20px 50px rgba(0, 0, 0, 0.4);
  overflow: hidden;
}

#html-body.casino-luxury .thumbnails .item,
#html-body.casino-luxury .slide-image-container {
  border: 1px solid var(--gold-line) !important;
  background: #14110b !important;
  border-radius: 8px;
}

#html-body.casino-luxury .thumbnails .item.active {
  box-shadow: 0 0 0 2px var(--gold);
}

/* Buttons */
#html-body.casino-luxury .action.primary,
#html-body.casino-luxury #product-addtocart-button,
#html-body.casino-luxury button.action.primary.tocart {
  background: linear-gradient(180deg, #f3e2a0 0%, #d4af37 48%, #8a6a1f 100%) !important;
  color: #1a1408 !important;
  border: 1px solid #f6e7a3 !important;
  border-radius: 999px !important;
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  box-shadow: 0 8px 24px rgba(212, 175, 55, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

#html-body.casino-luxury .action.primary:hover,
#html-body.casino-luxury #product-addtocart-button:hover {
  filter: none;
  transform: none;
}

#html-body.casino-luxury .action.towishlist,
#html-body.casino-luxury #giftreg-message-pdp a,
#html-body.casino-luxury #giftreg-message-pdp a.notlogingift {
  background: transparent !important;
  color: var(--gold-bright) !important;
  border: 1px solid var(--gold) !important;
  border-radius: 999px !important;
  font-family: var(--font-display) !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

#html-body.casino-luxury .action.towishlist:hover,
#html-body.casino-luxury #giftreg-message-pdp a:hover {
  background: rgba(212, 175, 55, 0.12) !important;
  color: #fff6c8 !important;
}

#html-body.casino-luxury .box-tocart .label,
#html-body.casino-luxury .sharing-buttons label,
#html-body.casino-luxury .field.qty .label span {
  color: var(--muted) !important;
}

#html-body.casino-luxury .qty,
#html-body.casino-luxury select.qty {
  background: #16130c !important;
  color: var(--ivory) !important;
  border: 1px solid var(--gold-line) !important;
  border-radius: 10px !important;
}

/* Schedule / RTP */
#html-body.casino-luxury .jadwal-title-box {
  max-width: 920px;
  margin: 48px auto 28px;
  padding: 22px 36px;
  text-align: center;
  background:
    linear-gradient(180deg, rgba(243, 226, 160, 0.12), transparent 40%),
    linear-gradient(135deg, #1b160d 0%, #0b0a07 52%, #2a210f 100%) !important;
  border-radius: 18px !important;
  border: 1px solid var(--gold) !important;
  box-shadow: none !important;
  overflow: hidden;
  position: relative;
}

#html-body.casino-luxury .jadwal-title-box h2 {
  margin: 0;
  font-family: var(--font-display) !important;
  font-size: clamp(26px, 4vw, 40px) !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  color: var(--gold-bright) !important;
  text-shadow: none !important;
}

#html-body.casino-luxury .live-result-bar {
  max-width: 1100px;
  margin: 24px auto 48px;
}

#html-body.casino-luxury .result-item {
  background: linear-gradient(120deg, #1c170e, #0e0c08 55%, #241c10) !important;
  color: var(--ivory) !important;
  padding: 18px 26px;
  margin: 12px 0;
  border-radius: 16px !important;
  border: 1px solid var(--gold-line) !important;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px;
  box-shadow: none !important;
  transition: none;
}

#html-body.casino-luxury .icon {
  background: linear-gradient(180deg, #f3e2a0, #d4af37) !important;
  color: #1a1408 !important;
  padding: 8px 16px;
  border-radius: 999px;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.08em;
}

#html-body.casino-luxury .market {
  flex: 1;
  font-family: var(--font-display);
  font-size: clamp(18px, 2.4vw, 24px);
  font-weight: 700;
  color: var(--ivory) !important;
  text-shadow: none !important;
}

#html-body.casino-luxury .timer {
  font-family: var(--font-display);
  font-size: clamp(28px, 4vw, 40px);
  font-weight: 700;
  color: var(--gold-bright) !important;
  text-shadow: none !important;
  min-width: 180px;
  text-align: right;
}

#html-body.casino-luxury .info {
  flex-basis: 100%;
  font-size: 14px;
  color: var(--muted) !important;
  opacity: 1;
  letter-spacing: 0.04em;
}

/* Footer */
#html-body.casino-luxury .page-footer,
#html-body.casino-luxury .footer-content-mckanmo-desktop,
#html-body.casino-luxury .pagebuilder-column,
#html-body.casino-luxury .footer-main-column-mc {
  background: #0a0907 !important;
  color: var(--muted) !important;
}

#html-body.casino-luxury .page-footer {
  border-top: 1px solid var(--gold-line);
}

#html-body.casino-luxury .page-footer h4,
#html-body.casino-luxury .heading-shop-with-us-kanmo-mc,
#html-body.casino-luxury .heading-need-help-kanmo-mc,
#html-body.casino-luxury .heading-download-apps-kanmo-mc {
  font-family: var(--font-display) !important;
  color: var(--gold-bright) !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#html-body.casino-luxury .page-footer a,
#html-body.casino-luxury .page-footer p {
  color: #e8dcb8 !important;
}

#html-body.casino-luxury .page-footer a:hover {
  color: var(--gold-bright) !important;
}

#html-body.casino-luxury .back-to-top {
  background: linear-gradient(180deg, #d4af37, #8a6a1f) !important;
  color: #1a1408 !important;
  border-radius: 999px;
}

/* Widgets / leftovers from Magento white UI */
#html-body.casino-luxury .block,
#html-body.casino-luxury .widget,
#html-body.casino-luxury .product.info.detailed,
#html-body.casino-luxury .page.messages,
#html-body.casino-luxury .breadcrumbs,
#html-body.casino-luxury .modal-inner-wrap,
#html-body.casino-luxury .modal-popup .modal-inner-wrap {
  background-color: transparent;
  color: var(--ivory);
}

#html-body.casino-luxury .modal-popup .modal-inner-wrap {
  background: #16130c !important;
  border: 1px solid var(--gold-line);
}

#html-body.casino-luxury .message.global.noscript,
#html-body.casino-luxury .message {
  background: #1a160e !important;
  color: var(--ivory) !important;
  border-color: var(--gold-line) !important;
}

#html-body.casino-luxury h2,
#html-body.casino-luxury h3,
#html-body.casino-luxury h4,
#html-body.casino-luxury h5,
#html-body.casino-luxury .block-title strong {
  font-family: var(--font-display);
  color: var(--gold-soft) !important;
}

#html-body.casino-luxury h5#content-baby,
#html-body.casino-luxury a.sizechart-link,
#html-body.casino-luxury [style*="#165c7d"] {
  color: var(--gold) !important;
}

/* Language switch */
#html-body.casino-luxury .slider {
  background-color: #3a3018 !important;
}

#html-body.casino-luxury .slider:before {
  background-color: var(--gold-bright) !important;
  color: #1a1408 !important;
}

#html-body.casino-luxury input:checked + .slider {
  background-color: #5c4a1c !important;
}

@media (max-width: 768px) {
  #html-body.casino-luxury .highlight-box {
    padding: 16px;
  }

  #html-body.casino-luxury .jadwal-title-box {
    margin: 28px 12px;
    padding: 16px 14px;
  }

  #html-body.casino-luxury .timer {
    text-align: left;
    min-width: 0;
  }

  #html-body.casino-luxury .result-item {
    padding: 14px 16px;
  }
}

/* Falling gold coins */
#coin-rain {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 3;
  perspective: 900px;
}

.falling-coin {
  position: absolute;
  top: -52px;
  border-radius: 50%;
  background: radial-gradient(circle at 32% 28%, #fff8d6 0%, #f6e7a3 16%, #e2bc4e 42%, #b8860b 70%, #6d5210 100%);
  box-shadow:
    inset 0 0 0 2px rgba(255, 236, 170, 0.6),
    inset 0 -7px 8px rgba(80, 50, 8, 0.38),
    0 8px 12px rgba(0, 0, 0, 0.28);
  animation-name: coin-fall;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  will-change: transform;
}

.falling-coin::before {
  content: "";
  position: absolute;
  inset: 18%;
  border-radius: 50%;
  border: 1px solid rgba(255, 236, 170, 0.75);
  box-shadow: inset 0 0 0 1px rgba(109, 82, 16, 0.4);
}

@keyframes coin-fall {
  0% {
    transform: translate3d(0, -14vh, 0) rotateY(0deg) rotate(0deg);
  }
  100% {
    transform: translate3d(var(--drift, 24px), 114vh, 0) rotateY(var(--spin, 640deg)) rotate(200deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  #coin-rain {
    display: none;
  }
}
