/* ================================================================
   MAHALASA BULLION — Image-Based Navy/Gold Theme
   All backgrounds use images from /mahalasa/ folder
   ================================================================ */

:root {
    --mb-gold: #d4a827;
    --mb-gold-light: #f0c96a;
    --mb-gold-border: #c9a227;
    --mb-white: #ffffff;
    --mb-dark-text: #1a0a00;
    --mb-text-dim: #c8c8e8;
}

/* Header Logo: img/logo/LOGO.png */
.mb-logo-header {
    width: 100%;
    max-width: 420px;
    height: auto;
    display: block;
    margin: 0 auto;
    padding: 6px 10px;
    filter: drop-shadow(0 2px 8px rgba(212, 168, 39, 0.35));
}

@media (max-width: 600px) {
    .mb-logo-header {
        max-width: 260px;
        padding: 4px 8px;
    }
}

/* Remove the old scroll-logo and theme-img so they don't conflict */
.scroll-logo {
    display: none !important;
}

/* ── Page Background: BG.png ── */
html,
body,
.body {
    background-image: url("../mahalasa/BG.png") !important;
    background-color: #07074a !important;
    background-size: cover !important;
    background-attachment: fixed !important;
    background-repeat: no-repeat !important;
    background-position: center top !important;
    color: var(--mb-white) !important;
}

/* All sections transparent so BG.png shows through */
html .body .section,
.section,
section.section,
.live-rates-page,
.live-rates-page .main,
.live-rates-page .live-rates-container,
.live-rates-page .live-rates-board,
.live-rates-page .live-rates-table-shell,
.live-rates-section,
.live-rates-section .section,
.divBg,
.gold-trend,
.swiper-container,
.swiper-wrapper,
.swiper-slide {
    background: transparent !important;
    background-image: none !important;
    background-color: transparent !important;
}

/* ── Header: Header.png ── */
#header .header-body,
.headImg,
.header-body {
    background-image: url("../mahalasa/Header.png") !important;
    background-color: #050535 !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    border-bottom: 2px solid var(--mb-gold-border) !important;
}

#header .header-top {
    background: transparent !important;
    border-bottom: 1px solid var(--mb-gold-border) !important;
}

/* ── Navigation bar: Box1.png ── */
.naviRow {
    background-image: url("../mahalasa/Box1.png") !important;
    background-color: transparent !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    border-color: var(--mb-gold-border) !important;
}

.naviRow a,
.naviRow nav ul li a {
    color: var(--mb-dark-text) !important;
    font-weight: 700 !important;
}

.naviRow a:hover {
    color: #3a1500 !important;
    background: transparent !important;
}

/* ── Welcome Banner: Box3.png ── */
.mb-welcome-banner {
    background-image: url("../mahalasa/Box3.png") !important;
    background-color: transparent !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    text-align: center !important;
    padding: 11px 0 !important;
    letter-spacing: 3px !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    color: var(--mb-dark-text) !important;
    text-transform: uppercase !important;
    margin: 3px 0 !important;
    border: none !important;
}

/* Strock.png — thin gold separator */
.mb-strock {
    width: 100%;
    height: auto;
    display: block;
    line-height: 0;
}

/* ── Marquee: Box1.png ── */
.marquee {
    background-image: url("../mahalasa/Box1.png") !important;
    background-color: transparent !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    color: var(--mb-dark-text) !important;
    border: none !important;
}

.marquee p,
.marquee span {
    color: var(--mb-dark-text) !important;
}

/* ── Swiper tabs ── */
.live-rates-page .swiper-pagination1.swiper-pagination-clickable .swiper-pagination-bullet {
    background: transparent !important;
    color: var(--mb-gold-light) !important;
    border-bottom: 2px solid transparent;
}

.live-rates-page .swiper-pagination1.swiper-pagination-clickable .swiper-pagination-bullet-active {
    background-image: url("../mahalasa/Box3.png") !important;
    background-size: 100% 100% !important;
    color: var(--mb-dark-text) !important;
    font-weight: 700 !important;
    border-bottom: none !important;
}

/* ============================================================
   COMEX BOXES — Box2.png
   (GOLD COMEX / SILVER COMEX / INR SPOT)
   in #gvData_top3 → table.table1001 → td.scriptname_bg → table.goldd
   ============================================================ */

/* Outer wrapper cell: transparent, no border */
#gvData_top3 td.scriptname_bg,
#gvData_top3 .table1001 td.scriptname_bg {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 4px 3px !important;
    border-radius: 0 !important;
}

/* The COMEX card: Box2.png as background */
#gvData_top3 table.goldd {
    background-image: url("../mahalasa/Box2.png") !important;
    background-color: transparent !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

/* All rows and cells inside COMEX boxes: transparent */
#gvData_top3 table.goldd tr,
#gvData_top3 table.goldd td {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

/* Label row — dark text over the gold top portion of Box2 */
#gvData_top3 table.goldd .borderSpotRate td,
#gvData_top3 table.goldd td.sell {
    color: var(--mb-dark-text) !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Price value — white text over navy portion of Box2 */
#gvData_top3 table.goldd span.top5span {
    color: var(--mb-white) !important;
}

/* H/L text — gold */
#gvData_top3 table.goldd .bloc_GS,
#gvData_top3 table.goldd .bloc_GS1,
#gvData_top3 table.goldd .HighLowborder,
#gvData_top3 table.goldd .GoldRtae1,
#gvData_top3 table.goldd .GoldRtae3 {
    color: var(--mb-gold-light) !important;
}

/* ============================================================
   PRODUCTS HEADER — Box3.png
   table.heading inside #gvData
   ============================================================ */

#gvData table.heading,
.live-rates-page table.heading {
    background-image: url("../mahalasa/Box3.png") !important;
    background-color: transparent !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    border-radius: 6px !important;
    border: none !important;
    margin-bottom: 5px !important;
}

#gvData table.heading td,
.live-rates-page table.heading td {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    color: var(--mb-dark-text) !important;
    font-weight: 500 !important;
    letter-spacing: 0.4px !important;
    text-transform: uppercase !important;
    vertical-align: middle !important;
    line-height: 1.15 !important;
    padding: 5px 8px !important;
}

#gvData table.heading span,
.live-rates-page table.heading span {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    color: var(--mb-dark-text) !important;
    font-weight: 500 !important;
    letter-spacing: 0.4px !important;
    text-transform: uppercase !important;
    line-height: 1.15 !important;
}

#gvData table.heading td:first-child,
.live-rates-page table.heading td:first-child {
    width: 50% !important;
    text-align: left !important;
    padding-left: 18px !important;
}

#gvData table.heading td:first-child span,
.live-rates-page table.heading td:first-child span {
    display: block;
    text-align: left !important;
}

/* SELL-only header — second column takes remaining 50% */
#gvData table.heading td:nth-child(2),
.live-rates-page table.heading td:nth-child(2) {
    width: 50% !important;
    text-align: center !important;
}

#gvData table.heading td:nth-child(2) span,
.live-rates-page table.heading td:nth-child(2) span {
    display: block;
    text-align: center !important;
}

/* ============================================================
   PRODUCT ROWS — Box4.png
   table.res_mob_font_width  (uses ID #gvData for max specificity)
   ============================================================ */

/* ID-level specificity to beat all inline rules */
#gvData table.res_mob_font_width,
.live-rates-page table.res_mob_font_width {
    background-image: url("../mahalasa/Box4.png") !important;
    background-color: transparent !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 8px !important;
    margin-bottom: 6px !important;
    overflow: hidden !important;
}

#gvData table.res_mob_font_width tr,
#gvData table.res_mob_font_width td,
.live-rates-page table.res_mob_font_width tr,
.live-rates-page table.res_mob_font_width td {
    background-color: transparent !important;
    background-image: none !important;
}

#gvData table.res_mob_font_width td:first-child,
.live-rates-page table.res_mob_font_width td:first-child {
    width: 50% !important;
    text-align: left !important;
    padding-left: 18px !important;
    padding-right: 8px !important;
}

/* SELL-only layout — second column (sell price) takes remaining 50% */
#gvData table.res_mob_font_width td:nth-child(2),
.live-rates-page table.res_mob_font_width td:nth-child(2) {
    width: 50% !important;
    text-align: center !important;
    padding: 6px 8px !important;
}

/* .mb-sell-col — sell price column in product rows */
.mb-sell-col {
    vertical-align: middle !important;
}

.mb-sell-col .top3span {
    display: inline-block !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    min-width: 70px;
}

.mb-sell-col .bloc_GS1 {
    font-size: 11px !important;
    color: var(--mb-gold-light) !important;
    display: block !important;
    margin-top: 3px !important;
}

@media (min-width: 992px) {
    .mb-sell-col .top3span {
        font-size: 24px !important;
    }
}

/* Product name — white bold text over navy Box4 */
.live-rates-page .buy_sell_label,
.live-rates-page .buy_sell_label div {
    color: var(--mb-white) !important;
    font-weight: 500 !important;
    text-align: left !important;
}

#gvData .buy_sell_label div,
.live-rates-page #gvData .buy_sell_label div {
    display: block;
    text-align: left !important;
    line-height: 1.15 !important;
}

/* Price spans */
.live-rates-page .buy_sell_label1,
.live-rates-page span.top3span,
.live-rates-page span.bloc_GS1 {
    color: var(--mb-white) !important;
}

#gvData .buy_sell_label1,
#gvData td[id$="SELL3"],
.live-rates-page #gvData .buy_sell_label1,
.live-rates-page #gvData td[id$="SELL3"] {
    text-align: center !important;
}

#gvData .top3span,
#gvData .bloc_GS1,
.live-rates-page #gvData .top3span,
.live-rates-page #gvData .bloc_GS1 {
    display: block;
    text-align: center !important;
    line-height: 1.15 !important;
}

.live-rates-page .headingsell {
    color: var(--mb-gold-light) !important;
    font-weight: 500 !important;
    text-align: center !important;
}

/* ============================================================
   FUTURE BOXES — Box5.png
   (GOLD FUTURE / SILVER FUTURE)
   in #gvData → table.table1001 → td.scriptname_bg → table.goldd
   ============================================================ */

/* Outer wrapper cell: transparent, no border */
#gvData td.scriptname_bg {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 5px 4px !important;
    border-radius: 0 !important;
    text-align: center !important;
}

/* The FUTURE card: Box5.png as background */
#gvData table.goldd {
    background-image: url("../mahalasa/Box5.png") !important;
    background-color: transparent !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 10px !important;
    overflow: hidden !important;
}

/* All rows and cells inside FUTURE boxes: transparent */
#gvData table.goldd tr,
#gvData table.goldd td {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

/* Label row — dark text over gold top of Box5 */
#gvData table.goldd .borderSpotRate td,
#gvData table.goldd td.sell {
    color: var(--mb-dark-text) !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* BID/ASK headings — white over navy */
#gvData table.goldd .headingsell {
    color: var(--mb-white) !important;
    font-weight: 700 !important;
}

/* Price value */
#gvData table.goldd span.top5span {
    color: var(--mb-white) !important;
}

/* H/L text */
#gvData table.goldd .bloc_GS,
#gvData table.goldd .bloc_GS1,
#gvData table.goldd .HighLowborder {
    color: var(--mb-gold-light) !important;
}

/* ── General table wrapper transparency ── */
.live-rates-page .table1001,
.live-rates-page .table1002,
.live-rates-page .tt_33 {
    background: transparent !important;
    background-image: none !important;
}

.live-rates-page .Trending_Table_Root,
.live-rates-page .Trending_Table_Child1,
.live-rates-page .Trending_Table_Child2 {
    background: transparent !important;
    background-image: none !important;
}

/* ── Global text ── */
html a {
    color: var(--mb-gold-light) !important;
}
html a:hover {
    color: var(--mb-gold) !important;
    background: transparent !important;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--mb-gold-light) !important;
}
p,
span,
li,
label {
    color: var(--mb-white);
}

/* ── Hamburger button: Box1.png ── */
.header-btn-collapse-nav {
    /* background-image: url('../mahalasa/Box1.png') !important; */
    background-color: transparent !important;
    background-size: 100% 100% !important;
    border: none !important;
}
.header-btn-collapse-nav span {
    background: var(--mb-dark-text) !important;
}

/* ── Login button: Box3.png ── */
#Lb3,
#Lb4,
a.btn.btn-5 {
    background-image: url("../mahalasa/Box3.png") !important;
    background-color: transparent !important;
    background-size: 100% 100% !important;
    color: var(--mb-dark-text) !important;
    border: none !important;
    font-weight: 700 !important;
}

/* ── App contact section ── */
.right-app-cover {
    background-image: url("../mahalasa/Box4.png") !important;
    background-color: transparent !important;
    background-size: 100% 100% !important;
    border: none !important;
    box-shadow: none !important;
}
.right-app-details {
    border-color: var(--mb-gold-border) !important;
}
.adrs {
    border-top-color: var(--mb-gold-border) !important;
}
.app-available h4,
.adrs h4 {
    color: var(--mb-gold-light) !important;
}
.adrs p,
.adrs span,
.adrs a,
.booking {
    color: var(--mb-text-dim) !important;
}

/* ── Open account CTA ── */
.open-account-cta {
    background-image: url("../mahalasa/Header.png") !important;
    background-size: cover !important;
    background-position: center !important;
    border-top: 2px solid var(--mb-gold-border) !important;
    border-bottom: 2px solid var(--mb-gold-border) !important;
}
.open-account-cta h1,
.open-account-cta h2 {
    color: var(--mb-gold-light) !important;
}
.open-account-cta #openaccount {
    background-image: url("../mahalasa/Box3.png") !important;
    background-size: 100% 100% !important;
    background-color: transparent !important;
    color: var(--mb-dark-text) !important;
    border: none !important;
    font-weight: 700 !important;
}

/* ── Gold trend section ── */
.gold-trend h1,
.gold-trend * {
    color: var(--mb-gold-light) !important;
}
.heading_underline {
    color: var(--mb-gold-light) !important;
}

/* ── Footer ── */
/* (footer reverted — no overrides) */