/* ===================================================================
   SONA RUPA theme overlay
   Loaded AFTER theme.css / theme-elements.css / skin css / custom.css
   on every page so the legacy Bootstrap template reads as one product
   with Liverates.html (gold/cream card system) without rewriting the
   underlying page markup or JS hooks.
   =================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&family=Playfair+Display:wght@700;800&display=swap');

:root{
  --sr-gold-dark:#7d5f14;
  --sr-gold-mid:#c9a227;
  --sr-gold-light:#e2c477;
  --sr-gold-text:#b5871e;
  --sr-cream:#faf5ea;
  --sr-card:#fffdf8;
  --sr-ink:#1c1c1c;
  --sr-green:#2e8b3d;
  --sr-red:#d33a2c;
}

html, body{
  background-color: var(--sr-cream) !important;
  font-family:'Poppins', sans-serif !important;
  color: var(--sr-ink);
}

/* ---------- Headings / brand type ---------- */
h1, h2, h3, h4, h5, h6,
.headingTop,
#logoimage,
.section-title{
  font-family:'Poppins', sans-serif !important;
  font-weight:700 !important;
}

/* ---------- Header ---------- */
#header,
#header .header-body{
  background-color: var(--sr-card) !important;
  box-shadow:0 6px 18px rgba(150,110,20,0.10);
}
#header .header-top{
  background-color:#111 !important;
}
#header .headImg{
  background-color:#f0c274 !important;
}

/* ---------- Shared branded header for public and /www pages ---------- */
body.sr-brand-header #header,
body.sr-brand-header #header .header-body{
  background:#f8f1e2 !important;
}
body.sr-brand-header #header .headImg{
  background:
    radial-gradient(circle at 22% 12%, rgba(255,255,255,0.92), transparent 32%),
    linear-gradient(120deg,#fffdf8 0%,#f8edda 58%,#eed18b 100%) !important;
  border-bottom:1px solid rgba(125,95,20,0.18);
  box-shadow:0 5px 16px rgba(28,28,28,0.08);
}
body.sr-www-page #header .headImg{
  background:
    radial-gradient(circle at 18% 20%, rgba(255,255,255,0.42), transparent 28%),
    linear-gradient(110deg,#6e4e0d 0%,#b8891d 42%,#e8cf8e 72%,#8a6a17 100%) !important;
  border-bottom:1px solid rgba(110,78,13,0.32);
}
body.sr-brand-header #header .naviRow{
  background:#fffdf8 !important;
  min-height:40px;
}
body.sr-brand-header #header .mobile-logo{
  width:min(100%, 860px);
  min-height:88px;
  margin:0 auto;
  padding:0 24px;
  gap:18px;
}
body.sr-brand-header #header .mobile-logo > img:first-child{
  flex:0 0 auto;
  width:80px;
  height:80px;
  object-fit:contain;
  cursor:default;
}
body.sr-brand-header .sr-brand-wordmark{
  display:inline-flex;
  align-items:baseline;
  gap:0;
  color:#17130c !important;
  font-family:'Poppins',sans-serif !important;
  font-size:clamp(1.8rem,3.4vw,2.8rem);
  font-weight:600;
  line-height:1;
  letter-spacing:0.025em;
  white-space:nowrap;
}
body.sr-brand-header .sr-brand-wordmark > span{
  color:#17130c !important;
}
body.sr-brand-header .sr-brand-wordmark > strong{
  color:var(--sr-gold-text) !important;
  font-weight:700;
}
body.sr-brand-header.sr-dark-mode #header,
body.sr-brand-header.sr-dark-mode #header .header-body,
body.sr-brand-header.sr-dark-mode #header .headImg,
body.sr-brand-header.sr-dark-mode #header .naviRow{
  background:#17130f !important;
}
body.sr-brand-header.sr-dark-mode .sr-brand-wordmark > span{
  color:#fffdf8 !important;
}

@media (max-width:991px){
  body.sr-brand-header #header .mobile-logo > img:first-child{
    width:76px;
    height:76px;
  }
  body.sr-brand-header .sr-brand-wordmark{
    font-size:clamp(1.35rem,6.2vw,2rem);
    letter-spacing:0.015em;
  }
}

@media (max-width:360px){
  body.sr-brand-header #header .mobile-logo > img:first-child{
    width:68px;
    height:68px;
  }
  body.sr-brand-header .sr-brand-wordmark{
    font-size:1.25rem;
  }
}
#header .headImg #iconimage{
  float:none !important;
  margin:0 auto !important;
  text-align:center !important;
}
#header .header-nav-main nav > ul.nav > li > a{
  color:var(--sr-ink) !important;
  font-weight:600;
  letter-spacing:0.5px;
}
body.sr-brand-header.sr-dark-mode #header .header-nav-main nav > ul.nav > li > a{
  color:#fffdf8 !important;
}
#header .header-nav-main nav > ul.nav > li > a:hover,
#header .header-nav-main nav > ul.nav > li.active > a{
  color: var(--sr-gold-text) !important;
}
body.sr-brand-header #header .naviRow .header-btn-collapse-nav{
  margin:7px 0;
}
@media (min-width:992px){
  body.sr-brand-header #header .naviRow .header-nav-main nav > ul.nav > li > a{
    padding-top:6px !important;
    padding-bottom:6px !important;
  }
}
#header .btn-5,
.btn-5{
  background-image: linear-gradient(90deg, var(--sr-gold-dark), var(--sr-gold-mid) 60%, var(--sr-gold-light)) !important;
  color:#fff !important;
  border:none !important;
}

/* ---------- Buttons / links / accents (site-wide) ---------- */
.btn-primary,
.btn.btn-primary,
a.btn-primary{
  background-image: linear-gradient(90deg, var(--sr-gold-dark), var(--sr-gold-mid) 60%, var(--sr-gold-light)) !important;
  border-color: var(--sr-gold-mid) !important;
  color:#fff !important;
}
a:not(.btn){
  color: var(--sr-gold-text);
}
a:not(.btn):hover{
  color: var(--sr-gold-dark);
}
::selection{
  background: var(--sr-gold-light);
}

/* ---------- Cards / boxes / tables ---------- */
.box-content,
.iconbox,
.card,
.panel{
  background-color: var(--sr-card) !important;
  border-radius:14px !important;
}
table thead th,
.table thead th,
th.label,
.rate-table thead th{
  background:linear-gradient(90deg,var(--sr-gold-dark),var(--sr-gold-mid) 60%,var(--sr-gold-light)) !important;
  color:#fff !important;
}
table td.value,
.value{
  font-weight:700;
}

/* ---------- Marquee / ticker bar ---------- */
.header-top-marquee,
.app-ticker-two,
.marquee-wrap,
marquee{
  background:#111 !important;
  color: var(--sr-gold-text) !important;
}

/* ---------- Footer ---------- */
footer#footer{
  background-color:#171310 !important;
  color:#e8dcc0;
}
footer#footer .icon-box-icon i{
  color: var(--sr-gold-mid) !important;
}
footer#footer a{
  color:#e8dcc0;
}
footer#footer a:hover{
  color: var(--sr-gold-light);
}
.footer-copyright{
  background-color:#0e0c0a !important;
}

/* ---------- Up / down rate accents ---------- */
.text-success, .up, .rate-up{ color: var(--sr-green) !important; }
.text-danger, .down, .rate-down{ color: var(--sr-red) !important; }