/* theme-rtpgroup.css - RTP GROUP AUSTRALIA brand layer.
   Loads AFTER platform.css. This file is the equivalent of the source site's custom-CSS slots
   (configCSS + theme-layout-*), rewritten for the RTP GROUP palette. Layout comes from platform.css. */

:root {
  --rtp-ink: #062b12;        /* darkest text on light */
  --rtp-deep: #03150a;       /* header/footer base */
  --rtp-forest: #0b2d16;
  --rtp-green: #0f7a2e;      /* headings on light */
  --rtp-green-mid: #14a33b;
  --rtp-neon: #4cf232;       /* accent / highlights (from the joystick R logo) */
  --rtp-gold: #f5c400;       /* accent 2 (from the logo) */
  --rtp-gold-light: #ffe37a;
  --rtp-cream: #f3f6f3;      /* page ground */
  --rtp-white: #ffffff;
}

/* ---------- shell ---------- */
body { background: #000; }

#header {
  background-color: var(--rtp-deep);
  background-image: linear-gradient(180deg, #0f3a1c 0%, #03150a 100%);
  box-shadow: inset 0 -1px 0 rgba(76, 242, 50, .35);
  color: #fff;
}
#header .logo { height: 60px; margin: 3px auto; padding: 0; display: block; }
#header .link { color: var(--rtp-gold); }

#marquee {
  background-color: var(--rtp-neon);
  background-image: linear-gradient(90deg, #4cf232 0%, #b9f542 50%, #f5c400 100%);
  color: var(--rtp-ink);
  font-weight: 700;
}

#content {
  background-color: #e9efe9;
  background-image: url(../assets/rtpgroup/brand/watermark.jpg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  color: #000;
}

#footer {
  background-color: var(--rtp-deep);
  background-image: linear-gradient(180deg, #0f3a1c 0%, #03150a 100%);
  box-shadow: 0 -1px 5px #000, 0 -1px 0 rgba(245, 196, 0, .35);
  color: #000;
}
/* the source paints its three tabs with label-bearing images; we use icon images + a real text label */
body.C #footer a {
  color: transparent;
  background: url(../assets/rtpgroup/icons/nav-home.svg) center 5px / auto 56% no-repeat !important;
}
body.C #footer a:nth-child(2) { background-image: url(../assets/rtpgroup/icons/nav-history.svg) !important; }
body.C #footer a:nth-child(3) { background-image: url(../assets/rtpgroup/brand/rtp-r-joystick.gif) !important; background-size: auto 66% !important; background-position: center 2px !important; }
body.C #footer a:nth-child(4) { background-image: url(../assets/rtpgroup/icons/nav-livechat.svg) !important; }
body.C #footer a:nth-child(5) { background-image: url(../assets/rtpgroup/icons/nav-settings.svg) !important; }
body.C #footer a::after {
  content: attr(data-label);
  position: absolute; left: 0; right: 0; bottom: 3px;
  font: 700 9px/1 Arial, Helvetica, sans-serif;
  letter-spacing: .4px; text-transform: uppercase; color: #fff;
}
body.C #footer a.selected::after { color: var(--rtp-neon); }
body.C #footer a .badge { background: var(--rtp-gold); color: var(--rtp-ink); margin: 3px -40px; }
/* keep the source's popout + shine on the middle (Casinos) tab - rules live in platform.css */

/* ---------- home columns (2 / 3 column desktop tables) ---------- */
#home .box-3-1, #home .box-3-3, #home .box-2-2 { background: rgba(6, 43, 18, .28); }
#home .box-3-1 { border-right: 1px solid rgba(76, 242, 50, .35); }
#home .box-3-3 { border-left: 1px solid rgba(76, 242, 50, .35); }
#home .footer p { color: var(--rtp-ink); }

/* hide the platform's login / balance / referral buttons exactly like the source's configCSS */
a.btn.refer, a.btn.primary.downline, a.btn.danger.copy, a.btn.warning.more { display: none !important; }
#home-balance > .A .pinfo .links, #home-balance > .A .pbalance { display: none; }
#history, #settings { display: none !important; }

/* ---------- casinos ---------- */
#promotion .packet-group { box-shadow: 0 0 4px rgba(6, 43, 18, .9); }
#promotion .packet-title { color: var(--rtp-ink); }
/* the source lets flex squeeze the tiles so the 4th one is clipped on phones; we let them wrap instead */
#promotion .packet { flex: 0 0 auto; }

/* ---------- live chat ---------- */
#chatroom .message .name { color: var(--rtp-green); }
#chatroom .message .message-wrapper { background: rgba(6, 43, 18, .12); color: #000; }
#chatroom .chat-tools .tool { color: var(--rtp-green-mid); }
#chatroom .chat-tools .tool.file { color: var(--rtp-gold); }
#chatroom .chat-tools textarea { background: rgba(6, 43, 18, .55); }
#chatroom .message .text a { color: var(--rtp-green); font-weight: 700; }

/* ---------- attention tags on partner tiles (Grand Opening / Hot / New) ---------- */
.rtp-badge {
  position: absolute; top: 4px; left: 4px; z-index: 4;
  padding: 2px 6px; border-radius: 999px;
  font: 900 7px/1.25 "Montserrat", Arial, Helvetica, sans-serif;
  letter-spacing: .04em; text-transform: uppercase; white-space: nowrap;
  color: var(--rtp-ink); box-shadow: 0 1px 3px rgba(0, 0, 0, .55);
  pointer-events: none; overflow: hidden; transform-origin: left center;
}
.rtp-badge--grand {
  background: linear-gradient(90deg, #ffe37a 0%, #f5c400 55%, #ffe37a 100%);
  animation: rtp-badge-pulse 1.1s ease-in-out infinite alternate;
}
.rtp-badge--grand::after {
  content: ""; position: absolute; top: 0; left: -60%; width: 40%; height: 100%;
  background: linear-gradient(120deg, transparent 0%, rgba(255, 255, 255, .9) 50%, transparent 100%);
  transform: skewX(-25deg); animation: rtp-badge-shine 1.6s linear infinite;
}
.rtp-badge--hot {
  background: linear-gradient(180deg, #ff8a3d 0%, #e0331c 100%); color: #fff;
  animation: rtp-badge-flicker .9s ease-in-out infinite alternate;
}
.rtp-badge--new { background: var(--rtp-neon); animation: rtp-badge-blink 1.4s steps(2, start) infinite; }

/* the newly-opened RTPW33D tile also breathes a gold/neon glow */
#promotion .packet.rtp-tile--grand { border-color: var(--rtp-gold); animation: rtp-tile-glow 1.6s ease-in-out infinite alternate; }
.rtp-reco__tile { position: relative; }
.rtp-reco__tile--grand { border-color: var(--rtp-gold) !important; animation: rtp-tile-glow 1.6s ease-in-out infinite alternate; }
.rtp-reco__tile .rtp-badge { top: .5cqw; left: .5cqw; font-size: 1.15cqw; padding: .3cqw .9cqw; }

@keyframes rtp-tile-glow {
  from { box-shadow: 0 0 0 0 rgba(245, 196, 0, 0); }
  to   { box-shadow: 0 0 10px 2px rgba(245, 196, 0, .85), 0 0 18px 4px rgba(76, 242, 50, .45); }
}
@keyframes rtp-badge-pulse  { from { transform: scale(1); } to { transform: scale(1.14); } }
@keyframes rtp-badge-shine  { 0% { left: -60%; } 100% { left: 130%; } }
@keyframes rtp-badge-flicker { from { filter: brightness(1); } to { filter: brightness(1.4); } }
@keyframes rtp-badge-blink  { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) {
  .rtp-badge, .rtp-badge--grand::after, .rtp-tile--grand, .rtp-reco__tile--grand { animation: none; }
}

/* on the 85px casino tiles the Grand Opening tag becomes a full-width gold header strip (a pill would be clipped) */
#promotion .rtp-tile .rtp-badge--grand {
  left: 0; right: 0; top: 0; border-radius: 0; text-align: center; padding: 3px 0;
  animation: rtp-badge-flicker .9s ease-in-out infinite alternate;
}

/* ---------- partner popup (#promotion-popup inside #popupwindow, same geometry as the source) ---------- */
#promotion-popup { border-color: var(--rtp-green); text-transform: none; }
#promotion-popup .title { color: var(--rtp-green); border-color: var(--rtp-green); font-family: "Montserrat", Arial, Helvetica, sans-serif; font-size: 16px; }
#promotion-popup .rtp-pop__note { margin-top: 6px; font-size: 13px; color: #444; }
#promotion-popup img.rtp-pop__banner { width: 100%; margin-top: 10px; border-radius: 8px; display: block; }
#promotion-popup img.rtp-pop__banner--logo { width: 220px; max-width: 60%; margin: 10px auto 0; border-radius: 12px; }
#promotion-popup .rtp-pop__table { width: 100%; margin: 10px auto 0; border-collapse: separate; border-spacing: 0; border: 1.5px solid #1e6b32; border-radius: 10px; overflow: hidden; background: #062b12; font-size: 12px; }
#promotion-popup .rtp-pop__table td { border: 1.5px solid #041f0d; padding: 6px; color: #fff; letter-spacing: .6px; }
#promotion-popup .rtp-pop__tick { width: 28px; text-align: center; color: var(--rtp-neon); font-weight: 700; }
#promotion-popup .rtp-pop__star { width: 28px; text-align: center; color: var(--rtp-gold); }
#promotion-popup .rtp-pop__table a { color: var(--rtp-neon); text-decoration: underline; }
#promotion-popup img.rtp-pop__promo { width: auto; max-width: 100%; margin: 10px auto 0; display: block; }
#promotion-popup .btns .btn { text-decoration: none; box-sizing: border-box; }
#promotion-popup .btns .btn.claim { background: linear-gradient(#2fd45a, #0f7a2e); border-color: #0b5a22; color: #fff; }
#promotion-popup .btns .btn.claim:hover { filter: brightness(1.08); }
@media (max-width: 500px) { #promotion-popup { padding: 12px; } #promotion-popup .btns .btn { width: 100px; } #promotion-popup .btns .btn:last-child { width: calc(100% - 110px); } }
#promotion-popup .rtp-pop__cap { margin: 14px 0 0; font: 800 10px/1.2 "Montserrat", Arial, Helvetica, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--rtp-green); text-align: center; }
#promotion-popup .rtp-pop__promo-wrap { margin-top: 6px; }
#promotion-popup img.rtp-pop__promo { border: 1px solid #e3e8e3; border-radius: 6px; }
