:root{
  --bg-main:#1a0e0e;
  --bg-card:#730707;
  --bg-soft:#3b1818;

  --gold:#d4af37;
  --gold-dark:#b8962d;

  --red:#b3002d;
  --red-light:#d3243b;

  --text-main:#ffffff;
  --text-soft:#f2dada;
}

/* Body */




body{
  background: url('/video/assets/img/gold-bg.jpg');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  color: var(--text-main);
  font-family: 'Prompt','Kanit',sans-serif;
}


/* Navbar */
.navbar{
  background:#0b0505;
  border-bottom:1px solid rgba(212,175,55,.4);
}

/* Card */
.card{
  background:var(--bg-card);
  border: 1px solid rgba(212, 175, 55, .4);
  border-radius: 6px;
  box-shadow:0 6px 25px rgba(0,0,0,.5);
}

/* Buttons */
.btn-primary{
  background:linear-gradient(135deg,var(--gold),var(--gold-dark));
  border:none;
  border-radius: 6px;
  color:#000;
  font-weight:600;
}

.btn-primary:hover{
  background:linear-gradient(135deg,#ffd14a,var(--gold));
}

/* Nav Pills */
.nav-pills .nav-link{
  background:#2a1313;
  color:#fff;
  border-radius: 10px;
  border:1px solid transparent;
}

.nav-pills .nav-link.active{
  background:linear-gradient(135deg,var(--gold),var(--gold-dark));
  color:#000;
  font-weight:600;
}

/* Form */
.form-control{
  background:#140808;
  border:1px solid rgba(212,175,55,.4);
  border-radius: 4px;
  color:#fff;
}

.form-control:focus{
  border-color:var(--gold);
  box-shadow:0 0 10px rgba(212,175,55,.6);
}

/* Text */
.text-muted{
  color:var(--text-soft)!important;
}

/* Video */
video{
  width:100%;
  border-radius: 4px;
}

/* Wheel Box */
.wheel-box{
  background:var(--bg-soft);
  border-radius: 10px;
  padding:16px;
  text-align:center;
  border:1px solid rgba(212,175,55,.3);
}

/* Bottom Nav */
.bottom-nav{
  position:fixed;
  bottom:0;
  left:0;
  right:0;
  background:#0b0505;
  border-top:1px solid rgba(212,175,55,.4);
}

.bottom-nav a{
  color:var(--text-soft);
  text-decoration:none;
  font-size:14px;
}

.bottom-nav a.active{
  color:var(--gold);
}



/* Buttons */
.btn-primary{
  background:linear-gradient(135deg,#ffda7e,#b89627);
  border:none;
  border-radius: 6px;
  color:#000;
  font-weight:600;
}
.btn-primary:hover{
  background:linear-gradient(135deg,#ffe9a9,#d4af37);
}

.btn-danger{
  background:linear-gradient(135deg,#ff4d4d,#b00000);
  border:none;
  border-radius: 6px;
}

/* Soft Gold Button */
.btn-gold{
  background:linear-gradient(135deg,#ffd778,#b89627);
  border:none;
  border-radius: 6px;
  padding:10px 18px;
  color:#000;
  font-weight:600;
}
.btn-gold:hover{
  filter:brightness(1.2);
}