@import "https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css";
@import url("../fonts2/Montserrat.css");
@import url("../fonts6/roboto.css");

@font-face {
    font-family: "Popinse";
    src: url(../fonts1/poppins-v20-latin-regular.ttf);
}

table.Trending_Table_Root {
    font-family: "Open Sans", sans-serif !important;
    /* font-family: 'Montserrat' !important;  */
}
.heading {
    color: #cc9b4f !important;
}
.tt_333 {
    /* border:1px solid #fff; */
    /* border-radius: 10px; */
    /* border-collapse: separate;
    border-spacing: 0px;
    margin-bottom: 8px; */
}
.TDBG {
    background-image: url(../img/appimages/Box4.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}
.TDBG1 {
    background-image: url(../img/appimages/Box5.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.naviRow {
    /* box-shadow: 0px 1px 0px 0px #c9a155, 1px -1px 0px 0px #c9a155, 0px -1px 0px 0px #c9a155, -1px 0px 0px 0px #c9a155; */
    /* background-image: url(../img/appimages/Box_01.png);
     background-size: 100% 100%;
     background-repeat: no-repeat; */
    /* border-image: linear-gradient(to bottom, #C29125,#B68012, #CC9B4F,#F8DE7A,#FDEC98,#FDEC98, #FDEB95, #EFD06B, #D3A93F) 1; */
    background: #fff;
    background-image: linear-gradient(to bottom, #c29125, #b68012, #cc9b4f, #f8de7a, #fdec98, #fdec98, #fdeb95, #efd06b, #d3a93f);
    border-top: 2px solid;
    border-bottom: 2px solid;
    /* background-image: linear-gradient(to bottom, #C29125,#B68012, #CC9B4F,#F8DE7A,#FDEC98,#FDEC98, #FDEB95, #EFD06B, #D3A93F); */
    /* background: #000; */
    /* background-image: linear-gradient(to bottom, #C29125,#B68012, #CC9B4F,#F8DE7A,#FDEC98,#FDEC98, #FDEB95, #EFD06B, #D3A93F); */
}

/* Swiper */
.swiper-pagination1.swiper-pagination-clickable .swiper-pagination-bullet-active {
    /* font-weight: bold; */
    /* font-weight: bold; */
    /* background: #000!important; */
    font-weight: 600;
    background-image: linear-gradient(to bottom, #262626, #262626) !important;
    color: #fff !important;

    /* border-bottom: 2px solid #fff; */
}
.swiper-pagination1.swiper-pagination-clickable .swiper-pagination-bullet {
    /* background-color: #; */
    /* background-color: #eea125; */
    /* border-radius: 10px; */
    /* margin: 0 3px; */
    box-sizing: border-box;
    color: #000;
    cursor: pointer;
    /* font-size: 1.6rem; */
    font-size: 1rem;
    font-weight: normal;
    opacity: 1;
    height: 32.5px;
    width: 33.33%;
    margin: 1% 0%;
    /* width: 50%; */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    transition: font-weight 0.22s ease;
    font-weight: 500;
    /* border: 0.5px solid #e8c660 !important; */
    background-image: linear-gradient(to bottom, #c29125, #b68012, #cc9b4f, #f8de7a, #fdec98, #fdec98, #fdeb95, #efd06b, #d3a93f);
}

@media screen and (max-width: 500px) {
    .swiper-pagination1.swiper-pagination-clickable .swiper-pagination-bullet {
        font-size: 0.7rem !important;
        /* border-bottom: 1px solid #4b4a4a; */
    }
}

/* Add here all your CSS customizations */
.header-container.container .pb-4,
.header-container.container .py-4 {
    padding-bottom: 0.5rem !important;
    padding-top: 0.5rem !important;
}

span.align-items-center.font-weight-semibold img {
    max-width: 160px;
    width: 100%;
}

.modal-content {
    background: #fff;
    border: 1px solid rgba(203, 142, 42, 0.18);
    border-radius: 20px;
    box-shadow: 0 28px 60px rgba(1, 29, 40, 0.28);
    overflow: hidden;
}

.close {
    color: #232325;
    text-shadow: none;
    opacity: 1;
}
.close:focus,
.close:hover {
    color: #232325;
    text-decoration: none;
    opacity: 1;
}

.theme-modal {
    padding-right: 0 !important;
}

.theme-modal .modal-dialog {
    width: calc(100% - 32px);
    max-width: 640px;
    margin: 7vh auto;
}

.theme-modal .modal-content {
    background: linear-gradient(180deg, #fffaf0 0%, #ffffff 100%);
}

.theme-modal .modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 1rem 1.25rem;
    border-bottom: 0;
    background: linear-gradient(135deg, #011d28 0%, #cb8e2a 100%);
}

.theme-modal .modal-title {
    margin: 0;
    color: #fff;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.theme-modal .close {
    width: 42px;
    height: 42px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
    font-size: 1.9rem;
    font-weight: 400;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition:
        background-color 0.2s ease,
        transform 0.2s ease;
}

.theme-modal .close:hover,
.theme-modal .close:focus {
    background: rgba(255, 255, 255, 0.28);
    color: #fff;
    transform: rotate(90deg);
}

.theme-modal .close span {
    display: block;
    line-height: 1;
}

.theme-modal .modal-body {
    padding: 1.5rem;
    background: transparent;
    color: #1f2933;
    font-size: 1rem;
    line-height: 1.7;
}

.theme-modal .modal-body p:last-child {
    margin-bottom: 0;
}

.modal-backdrop.in {
    opacity: 0.6;
}

@media (max-width: 575.98px) {
    .theme-modal .modal-dialog {
        width: calc(100% - 20px);
        margin: 4vh auto;
    }

    .theme-modal .modal-header {
        padding: 0.9rem 1rem;
    }

    .theme-modal .modal-title {
        font-size: 0.95rem;
    }

    .theme-modal .close {
        width: 38px;
        height: 38px;
        font-size: 1.6rem;
    }

    .theme-modal .modal-body {
        padding: 1.2rem;
    }
}
button:focus {
    outline: 1px dotted;
    outline: none;
}

/* Start Marquee 2 */
.news {
    background: #ecaf4c;
    padding: 1px;
    margin-top: 6px;
    margin-bottom: 10px;
    border: 1px solid #ecaf4c;
}
.onlinetrading {
    margin-top: 8px;
}
.news_head h4 {
    text-align: center;
    font-weight: bold;
    font-size: 19px;
    color: #000;
}
.news_content {
    background-image: url(../img/newsbg.jpg);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.comm_bg {
    /* background: #dfdfdf; */
}
.enquiry h3 {
    color: #000;
    font-weight: bold;
    margin-left: 7%;
}
.contact h3 {
    color: #000;
    font-weight: 600;
}
.info p {
    text-align: center;
    color: #999;
    text-transform: none;
    font-weight: 600;
    font-size: 15px;
    margin-top: 2px;
}
.collapse.in {
    display: block;
    visibility: visible;
}
.info i {
    color: #f6aa93;
}
form h1 {
    font-size: 18px;
    background: #f6aa93 none repeat scroll 0% 0%;
    color: rgb(255, 255, 255);
    padding: 22px 25px;
    border-radius: 5px 5px 0px 0px;
    margin: auto;
    text-shadow: none;
    text-align: left;
}

/* End Marquee 2 */

.color-white {
    color: #fff !important;
}
.color-black {
    color: #000 !important;
}

.font-weight-semiboldd {
    font-weight: 500;
}

.whitee-border-font {
    transform-origin: 50% 50% 0px;
    -webkit-text-stroke: 1px #fff;
}

span#date_time,
span#date_time_us,
span#date_time_eng {
    /* font-weight: 600 !important; */ /* display: inline-block; */
    font-weight: 400;
    font-size: 14px;
    color: #fff;
    margin: 5px; /* margin: 15px 0 0 0; */
    vertical-align: -2px;
}

.heading_underline {
    font-weight: 300;
    display: inline-block;
    padding-bottom: 10px;
    position: relative;
}
.heading_underline:before {
    content: "";
    position: absolute;
    width: 40%;
    height: 1px;
    bottom: 0;
    left: 30%;
    border-bottom: 2px solid;
}

@media (max-width: 500px) {
    .boxImg {
        max-width: 25px;
    }
    .boxImg1 {
        max-height: 25px;
    }
    .price-info {
        margin-right: 27.5px !important;
        color: #fff;
    }
    #DateAndtime {
        font-size: 0.9rem;
    }
    .Delete_Ac {
        /* position: fixed;
        right: 30px;
        top: 160px;
        z-index: 999; */
        padding: 5px;
        /* border: 1px solid #fff;
        background: #000; 
        border-radius: 10px; */
    }
    .Delete_Ac a {
        font-size: 14px;
    }

    td.bg_white {
        background: linear-gradient(to right, #000, #000);
        box-shadow: 0px 1px 2px 0px #353131;
    }
    /* .min_h{
        padding-top: 10%;
        height: 50px;

    } */

    .Trending_Table_Child1 {
        /* margin-top: -13.5%; */
    }

    .bgblue {
        padding-top: 3px;
        /* background:#0d1539; */
    }
    /* table.table1001 td:nth-child(2) table {
        border-radius: 5px;
    } */
    .table1001 {
        width: 100%;
        line-height: 30px;
        /* background-image: url(../img/appimages/Box.png);
    background-size: 100% 100%;
    background-repeat: no-repeat; */
        padding: 10px 0;
    }
    .table1001 td {
        width: 25%;
        font-weight: 600;
    }
    table.table1001 tr td {
        padding: 0px 6px !important;
    }

    .table1002 {
        width: 100%;
        line-height: 30px;
        margin-top: 10px;
        background-color: #cc9b4f;
        border-spacing: 4px 5px;
        /* padding: 8px 10px; */
        border-collapse: separate;
    }
    .table1002 td {
        width: 50%;
        font-weight: 600;
    }
    table.table1002 tr td {
        padding: 3px 4px !important;
    }
    .newFont {
        font-size: 12px;
    }

    table.goldd tr:nth-child(1) td {
        /* border-bottom: 1px solid #e0b034; */
        /* font-weight: 600;
        background: #bc9c3f;
        color: #000 !important;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px; */
        /* background-image: linear-gradient(to bottom, #C29125,#B68012, #CC9B4F,#F8DE7A,#FDEC98,#FDEC98, #FDEB95, #EFD06B, #D3A93F); */
        /* border-radius: 5px; */
        line-height: 1.6;
        font-size: 13px;
        font-weight: 600;
        /* padding: 4px 0 0; */
        /* background-image: url(../img/appimages/Strock.png);
        background-size: 80% 3%;
        background-position: center bottom;
        background-repeat: no-repeat; */
        color: #000 !important;
        padding-top: 5px !important;
        /* line-height: 1.3; */
        /* font-family: 'Montserrat' !important;  */
    }
    table.goldd tr:nth-child(2) td {
        line-height: 2;
        font-size: 11px;
        /* padding: 4px 0 0; */
        /* padding-top: 5px !important; */
    }
    table.goldd tr:nth-child(3) td {
        line-height: 1.6;
        /* padding: 0!Important; */
        /* padding: 4px 0 0; */
        padding-bottom: 5px !important;
    }
    table.table1001 td:nth-child(1) table.goldd {
        /* border-bottom-right-radius: 10px !Important; */
    }

    table.table1001 td:nth-child(3) table.goldd {
        /* border-bottom-left-radius: 0px !Important; */
    }

    table.goldd tr td {
        text-align: center !important;
        line-height: 1;
    }
    table.goldd1 tr:nth-child(1) td {
        line-height: 1.3;
        font-size: 15px !important;
        /* background-image: linear-gradient(to bottom, #C29125,#B68012, #CC9B4F,#F8DE7A,#FDEC98,#FDEC98, #FDEB95, #EFD06B, #D3A93F); */
    }

    table.goldd1 tr:nth-child(2) td {
        line-height: 1.6;
        /* margin-top: 10px!important; */
    }
    table.goldd1 tr:nth-child(3) td {
        line-height: 1;
    }
    table.goldd1 tr:nth-child(4) td {
        line-height: 2.6;
    }

    table.goldd {
        /* box-shadow: 0px 1px 0px 0px #c9a155,1px -1px 0px 0px #c9a155, 0px -1px 0px 0px #c9a155, -1px 0px 0px 0px #c9a155; */
        /* border-top-left-radius: 5px;
    border-top-right-radius: 5px; */
        /* background-image: url(../img/appimages/Box_02.png);
    background-size: 100% 100%;
    background-repeat: no-repeat; */
        /* border-radius: 5px; */
        overflow: hidden;
        /* background: #fff; */
        /* background-image: linear-gradient(to bottom, #FAE875, #AD8430); */
        /* border-collapse: separate; */
        /* border-spacing: 0px 4px!important; */
        /* background-image: url(../img/appimages/Box_02.png);
    background-size: 100% 100%;
    background-repeat: no-repeat; */
    }

    table.goldd1 {
        /* border-top-left-radius: 5px;
    border-top-right-radius: 5px; */
        /* background-image: url(../img/appimages/Box_02.png);
    background-size: 100% 100%;
    background-repeat: no-repeat; */
        line-height: 2;
        /* border-radius: 5px; */
        overflow: hidden;
        /* background: #fff; */
    }

    table.goldd2 {
        background: url(../img/swastik/Silver.png);
        background-size: 100% 100%;
        background-repeat: no-repeat;
        line-height: 1.6;
    }

    table.goldd3 {
        background: url(../img/swastik/Inr.png);
        background-size: 100% 100%;
        background-repeat: no-repeat;
        line-height: 1.6;
    }
    table {
        /* margin-bottom: 0px;
    border-collapse: separate; */
        /* border-spacing: 0 7px; */
    }
    .headertable1 {
        /*background:#e4a40a;
	color:#2a1a0d;*/
        /*background-image: linear-gradient(to right, #646ffc, #726bfc, #8664fc, #8e62fd, #9372f0);*/
        /*background: #696969;*/
        color: #fff;
        background: #000;
        line-height: 0.5;
    }
    .headertable1 th {
        text-align: center;
    }
    .ratevalue1 {
        text-align: left;
    }
    table#liveratetable_2 .table1,
    table#liveratetable_3 .table1 {
        background: #fff;
    }

    table#liveratetable_2 .table1 td.ratevalue1,
    table#liveratetable_3 .table1 td.ratevalue1 {
        color: #000 !important;
        font-weight: 400;
        padding: 10px 5px !important;
    }
    .ratevalue4,
    .ratevalue3 {
        font-weight: 400;
    }

    .buylive {
        background: url(../img/swastik/Buy.png);
        background-size: 100% 100%;
        background-repeat: no-repeat;
        line-height: 1.6;
    }
    table.Trending_Table_Root tr td {
        /* padding: 0px 3px; */
        /* font-size: 14px; */
    }
    /* table#gold{ */
    /* background:#ffd438; */
    /* } */
    /* table#silver{ */
    /* background:#ffd438 */
    /* ; */
    /* } */
    /* table#inr{ */
    /* background:#ffd438; */
    /* } */
    .col-md-8.col-xs-12.div_spott {
        padding-right: 5px;
        padding-left: 5px;
    }

    .top6span {
        font-size: 22px;
        font-weight: 500 !important;
        padding: 1px 5px 1px !important;
        /* padding: 3px; */
        /* font-size: 22px; */
    }
    .top4span {
        font-size: 15px;
        font-weight: 700 !important;
        /* padding: 3px; */
        /* font-size: 22px; */
    }
    .top2span {
        font-size: 11px;
        font-weight: 600 !important;
    }
    .sell {
        font-size: 12.5px !important;
        font-size: 600;
        color: #fff;
    }
    .imgWidth {
        width: 50%;
    }

    .LogoImgWidth {
        width: 60%;
        /* max-height: 90px; */
        margin-left: 0%;
        padding: 20px 10px;
    }
    .LogoImgWidth1 {
        width: 76%;
        /* max-height: 90px; */
        margin-left: 12%;
        padding: 20px 0px;
    }

    .desktop-show {
        display: initial;
    }
    .mobile-hide {
        display: none;
    }

    .after1_black:after {
        content: "";
        position: absolute;
        left: 2%;
        top: 10px;
        height: 40px;
        width: 33%;
        border-right: 1px solid #000;
    }

    .after2_black:after {
        content: "";
        position: absolute;
        left: 0%;
        top: 10px;
        height: 40px;
        width: 66%;
        border-right: 1px solid #000;
    }

    table.Trending_Table_Root tr {
        /* padding: 5px 3px !important; */
        /* font-size: 20px; */
        /* font-weight: 600; */
    }
    .HL_img {
        width: 15px;
        margin-right: 5px;
    }
    .imgbnk {
        width: 100%;
    }
    /* .{
        padding-top: 65px;
    } */
    .span2 {
        /* padding: 0px 5px 2px; */
        font-size: 18px;
        font-weight: 600;
    }
    .span3 {
        /* padding: 3px 0px; */
        font-size: 11px;
        font-weight: 600;
    }
    table.tt_33 {
        /* margin-top: 10px; */
        /* background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.72)), url(../img/logo/logo7.jpeg) top no-repeat;
     background-size: 90%; */
    }

    .col-md-8.col-xs-12.offset-md-2.div_spott {
        padding-left: 5px;
        padding-right: 5px;
    }

    .heading {
        /* background-image: url(../img/appimages/Box_07.png);
        background-size: 100% 100%;
        background-repeat: no-repeat; */
        /* background-image: linear-gradient(to bottom,#B88214, #C29125, #CC9B4F,#F8DE7A,#FDEC98,#FDEC98, #FDEB95, #EFD06B, #D3A93F); */
        font-weight: 400;
        font-size: 15px !important;
        margin-bottom: 5px;
        margin-top: 8px;
        /* padding: 5px 0; */
        line-height: 1.6;
        background: #262626;
        /* border-radius: 5px; */
    }
    .mjdma {
        background-image: linear-gradient(to bottom, #c29125, #b68012, #cc9b4f, #f8de7a, #fdec98, #fdec98, #fdeb95, #efd06b, #d3a93f);
        font-weight: 400;
        font-size: 14px !important;
        padding: 5px 0 5px 10px !important;
    }

    .bog_Gc1 {
        font-size: 12px !important;
        font-weight: 400 !important;
    }
    span.top5sell {
        font-size: 14px !important;
        font-weight: 600 !important;
        /* padding: 1px 5px 1px!important; */
    }
    span.top25span {
        font-size: 16px;
        font-weight: 500;
        padding: 1px 8px 1px !important;
    }
    span.top5span {
        font-size: 18px;
        font-weight: 400;
        /* padding: 1px 10px 1px!important; */
        border-radius: 4px;
    }
    .topMar {
        margin-bottom: 4%;
        font-size: 15px;
    }
    .goldd1Buysell {
        font-size: 13px;
        color: #000;
    }

    span.bloc_GS {
        font-size: 9px;
        line-height: 1.6;
    }

    .liverates_sec {
        /*background: #101010;*/
        background: url(../img/bg/5.png) center;
    }

    .main_logoo {
        width: 90%; /*border-radius:15px;*/
    }

    html.svg.history.video.supports.boxshadow.csstransforms3d.csstransitions.webkit.chrome.linux.js.mobile.touch.sticky-header-enabled.sticky-header-active img.main_logoo {
        max-height: 60px;
        display: none;
    }

    .hide-Mobile {
        display: none;
    }

    .page-header {
        background-color: #f1f3f7;
        margin: 0 0 50px 0;
        min-height: 50px; /* padding: 55px 0; */ /* padding: 170px 0 55px 0; */ /* padding: 275px 0 55px 0; */
        padding: 55px 0 55px 0;
        position: relative;
        text-align: center;
    }

    .logo_img {
        /*width:71%;*/
        height: auto !important;
    }

    .pad-5px-tb {
        /*padding: 2px 0 0 !Important;*/
    }
}

@media (min-width: 501px) {
    .boxImg {
        max-width: 40px;
    }
    .boxImg1 {
        max-height: 33px;
    }
    .price-info {
        margin-right: 27.5px !important;
        color: #fff;
    }
    #DateAndtime {
        font-size: 1.2rem;
    }
    table.goldd tr:nth-child(1) td {
        padding-top: 5px !important;
    }
    table.goldd tr:nth-child(2) td {
        line-height: 2;
        /* padding-top: 5px !important; */
        font-size: 15px;
    }
    table.goldd tr:nth-child(3) td {
        line-height: 1.6;
        padding-bottom: 5px !important;
    }
    .Delete_Ac {
        /* position: fixed;
        right: 85px;
        top: 78px;
        z-index: 999; */
        padding: 0px 20px;
        /* border: 1px solid #fff;
        background: #000; */
        /* border-radius: 5px;  */
    }
    table.goldd tr:nth-child(1) td {
        /* border-bottom: 1px solid #e0b034; */
        /* font-weight: 600;
    background: #bc9c3f;
    color: #000 !important;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px; */
        /* background-image: linear-gradient(to bottom, #F6DB77, #E2BE56, #D0A53B ); */
        /* background-image: linear-gradient(to bottom, #C29125,#B68012, #CC9B4F,#F8DE7A,#FDEC98,#FDEC98, #FDEB95, #EFD06B, #D3A93F); */
        /* border-radius: 5px; */
        line-height: 1.3;
        font-size: 16px !important;
        /* background-image: url(../img/appimages/Strock.png);
        background-size: 70% 3%;
        background-position: center bottom;
        background-repeat: no-repeat; */
        color: #000 !important;
        /* font-family: 'Montserrat' !important;  */
    }
    table.table1001 td:nth-child(1) table.goldd {
        /* border-bottom-right-radius: 10px !Important; */
    }

    table.table1001 td:nth-child(3) table.goldd {
        /* border-bottom-left-radius: 0px !Important; */
    }

    .social_icons img {
        width: 100px;
        /* padding: 1px; */
        border-radius: 5px;
        /* height: 40px; */
        /* background-color: #ECAF4C; */
        transition: 0.5s;
        background-image: linear-gradient(to bottom, #c29125, #b68012, #cc9b4f, #f8de7a, #fdec98, #fdec98, #fdeb95, #efd06b, #d3a93f);
    }
    .social_icons img:hover {
        background-position: right center;
        background-image: linear-gradient(to right, #e6c35d 0%, #cc9b4f 51%, #e6c35d 100%);
    }

    table.goldd tr td {
        text-align: center !important;
        /* padding: 10px !important; */
    }
    table.goldd1 tr td {
        text-align: center !important;
        padding: 10px !important;
    }

    .imgbnk {
        width: 100%;
    }
    /* .{
    padding-top: 100px;
} */

    .bgblue {
        padding-top: 8px;
        /* background:#fff; */
    }
    /* table.table1001 td:nth-child(2) table {
        border-radius: 5px;
    } */
    .table1001 {
        width: 100%;
        line-height: 1.4;
        background-repeat: no-repeat;
    }
    .table1001 td {
        width: 24%;
        font-weight: 700 !important;
    }
    table.table1001 tr td {
        padding: 0px 8px !important;
    }
    .table1002 {
        width: 100%;
        line-height: 1.4;
        margin-top: 10px;
        background-color: #cc9b4f;
        border-spacing: 4px 5px;
        /* padding: 8px 10px; */
        border-collapse: separate;
    }
    .table1002 td {
        width: 50%;
        font-weight: 600 !important;
    }
    table.table1002 tr td {
        padding: 3px 3px !important;
    }
    table.goldd tr:nth-child(1) td {
        /* border-bottom: 1px solid #e0b034; */
        /* font-weight: 600;
        background: #bc9c3f;
        color: #000 !important;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px; */
    }
    table.goldd tr td {
        /* border-radius:10px;
        padding:10px !important; */
    }
    table.goldd {
        /* box-shadow: 0px 2px 0px 0px #c9a155, 1px -1px 0px 0px #c9a155, 0px -1px 0px 0px #c9a155, -1px 0px 0px 0px #c9a155; */
        /* border-radius: 7px; */
        /* background-image: linear-gradient(to bottom,#FBEE7D, #A07527); */
        /* border-collapse: separate; */
        /* border-spacing: 5px 0px; */
        /* background-image: url(../img/appimages/Box_02.png);
    background-size: 100% 100%;
    background-repeat: no-repeat; */
        /* border-radius: 5px; */
        overflow: hidden;
        /* background: #fff; */
    }

    table.goldd1 {
        /* border-top-left-radius: 5px;
        border-top-right-radius: 5px; */
        /* background-image: url(../img/appimages/Box_02.png);
        background-size: 100% 100%;
        background-repeat: no-repeat; */
        /* border-radius: 5px; */
        overflow: hidden;
        /* background-color: #fff; */
        /* line-height: 1.6; */
    }
    table.goldd1 tr:nth-child(1) td {
        line-height: 1.3;
        font-size: 18px !important;
        /* background-image: linear-gradient(to bottom, #C29125,#B68012, #CC9B4F,#F8DE7A,#FDEC98,#FDEC98, #FDEB95, #EFD06B, #D3A93F); */
    }
    table.goldd1 tr:nth-child(2) td {
        line-height: 1.3;
        /* margin-top: 10px!important; */
    }
    table.goldd1 tr:nth-child(3) td {
        line-height: 1.3;
    }
    table.goldd1 tr:nth-child(4) td {
        line-height: 2.6;
    }
    table.goldd2 {
        background: url(../img/swastik/Silver.png);
        background-size: 100% 100%;
        background-repeat: no-repeat;
        line-height: 1.6;
    }

    table.goldd3 {
        background: url(../img/swastik/Inr.png);
        background-size: 100% 100%;
        background-repeat: no-repeat;
        line-height: 1.6;
    }
    table {
        /* margin-bottom: 0px; */
        /* border-collapse: separate; */
        /* border-spacing: 0 7px; */
    }

    .headertable1 {
        /*background:#e4a40a;
        color:#2a1a0d;*/
        /*background-image: linear-gradient(to right, #646ffc, #726bfc, #8664fc, #8e62fd, #9372f0);*/
        /*background: #696969;*/
        color: #fff;
        background: #000;

        line-height: 2;
    }
    .headertable1 th {
        text-align: center;
    }
    .ratevalue1 {
        text-align: left;
        font-size: 18px;
        font-weight: 400;
    }

    table#liveratetable_2 .table1,
    table#liveratetable_3 .table1 {
        background: #fff;
    }

    table#liveratetable_2 .table1 td.ratevalue1,
    table#liveratetable_3 .table1 td.ratevalue1 {
        color: #000 !important;
        font-weight: 400;
        font-size: 18px;
        /* padding: 10px 5px !important; */
    }
    .ratevalue4,
    .ratevalue3 {
        font-weight: 400;
        font-size: 22px;
        /* padding: 10px 5px !important; */
    }
    .toptable_ratesFont {
        font-weight: 400;
        font-size: 32px !important;
    }
    .buylive {
        background: url(../img/swastik/Buy.png);
        background-size: 100% 100%;
        background-repeat: no-repeat;
        line-height: 1.6;
    }
    .newFont {
        font-size: 15px;
    }

    table.res_mob_font_width1 {
        /* background-image: url(../img/appimages/Strock.png);
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 100% 3%; */
        /* border-image: linear-gradient(to bottom, #C29125,#B68012, #CC9B4F,#F8DE7A,#FDEC98,#FDEC98, #FDEB95, #EFD06B, #D3A93F) 1!important; */
        /* border-top: 1.5px solid; */
        /* border-bottom: 1.5px solid;
    border-right: 1.5px solid;
    border-left: 1.5px solid; */
        /* border-bottom: 3px solid transparent;
    border-image: linear-gradient(to bottom, #C29125,#B68012, #CC9B4F,#F8DE7A,#FDEC98,#FDEC98, #FDEB95, #EFD06B, #D3A93F) 1; */
        /* padding: 7px 0; */
        background-image: url(../img/appimages/Strock.png);
        background-size: 100% 1%;
        background-repeat: no-repeat;
        background-position: center bottom;
        border-collapse: separate;
        line-height: 1.3;
    }
    .HL_img {
        width: 20px;
        margin-right: 5px;
        vertical-align: top !important;
    }
    .table1001 {
    }
    .desktop-show {
        display: none;
    }
    .mobile-hide {
        display: initial;
    }

    .after1_black:after {
        content: "";
        position: absolute;
        top: 16px;
        height: 50px;
        width: 33%;
        /* border-right: 2px solid #e3c070; */
    }

    .after2_black:after {
        content: "";
        position: absolute;
        left: 0%;
        top: 16px;
        height: 50px;
        width: 66%;
        /* border-right: 2px solid #e3c070; */
    }

    table.Trending_Table_Root tr td {
        /* padding: 2px 3px; */
        /* font-size: 18px; */
        /* font-weight: 400; */
    }

    .span2 {
        /* padding: 0px 5px 2px; */
        font-size: 25px;
        font-weight: 600;
    }
    .span3 {
        /* padding: 3px 0px; */
        font-size: 13px;
        font-weight: 600;
    }
    .vis {
        /* display: none; */
        display: block;
    }

    .heading {
        /* background-image: url(../img/appimages/Box_07.png);
        background-size: 100% 100%;
        background-repeat: no-repeat; */
        /* background-image: linear-gradient(to bottom,#B88214, #C29125, #CC9B4F,#F8DE7A,#FDEC98,#FDEC98, #FDEB95, #EFD06B, #D3A93F); */
        font-weight: 400;
        font-size: 18px !important;
        /* border-radius: 5px; */
        margin-bottom: 5px;
        margin-top: 10px;
        line-height: 1.6;
        background: #262626;
        /* padding: 8px 0!important; */
    }
    .mjdma {
        background-image: linear-gradient(to bottom, #c29125, #b68012, #cc9b4f, #f8de7a, #fdec98, #fdec98, #fdeb95, #efd06b, #d3a93f);
        font-weight: 400;
        font-size: 15px !important;
        padding: 5px 0 5px 10px !important;
    }
    .bog_Gc1 {
        font-size: 13px !important;
        font-weight: 400 !important;
    }
    span.top5sell {
        font-size: 16px !important;
        font-weight: 600 !important;
        /* padding: 1px 5px 1px!important; */
    }
    .goldd1Buysell {
        font-size: 18px;
        color: #000;
    }

    span.top25span {
        font-size: 22px;
        font-weight: 500;
        padding: 1px 10px 1px !important;
    }
    span.top5span {
        font-size: 26px;
        font-weight: 400;
        /* padding: 1px 15px 1px!important; */
        border-radius: 4px;
    }
    .topMar {
        margin-bottom: 2%;
        font-size: 18px;
        /* padding: 10px; */
    }
    .top6span {
        font-size: 26px;
        font-weight: 600 !important;
        padding: 1px 15px 1px !important;
        /* padding: 3px; */
        /* font-size: 22px; */
    }
    .top4span {
        font-size: 16px;
        font-weight: 600 !important;
        /* padding: 3px; */
        /* font-size: 22px; */
    }
    .top2span {
        font-size: 12px;
        font-weight: 600 !important;
    }

    .sell {
        font-size: 14px !important;
        font-size: 600 !important;
        color: #fff;
    }
    .imgWidth {
        width: 25%;
    }
    .LogoImgWidth {
        display: none;
        width: 56%;
        /* max-height: 90px; */
        margin-left: 22%;
        padding: 10px 10px;
    }
    .LogoImgWidth1 {
        width: 60%; /* max-height: 90px; */
        margin-left: 20%;
        padding: 20px 0px;
    }
    span.bloc_GS {
        font-size: 12px;
        font-weight: 600;
    }

    span.bloc {
        font-size: 14px !important;
    }
    table.tt_33 {
        /* margin-top: 8px; */
        /* background: linear-gradient(rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.72)), url(../img/logo/logo7.jpeg) top no-repeat;
     background-size: 55%; */
    }

    .main_logoo {
        /*max-height:95px;*/
        max-height: 150px; /*border-radius:15px;*/
    }

    html.svg.history.video.supports.boxshadow.csstransforms3d.csstransitions.webkit.chrome.win.js.sticky-header-enabled.sticky-header-active .pad-5px-tb {
        display: none;
    }

    .liverates_sec {
        /*background: #101010;*/
        background: url(../img/bg/5.png) center;
    }
}

@media (min-width: 1601px) {
    table.goldd tr:nth-child(1) td {
        font-size: 20px !important;
    }
    table.table1001 tr td {
        padding: 0px 0px 0 !important;
    }
    table.table1002 tr td {
        padding: 7px 6px 0 !important;
    }
    span.top5span {
        font-size: 38px !important;
    }
    span.bloc_GS {
        font-size: 14px !important;
        font-weight: 600;
    }
    .sell {
        font-size: 16px !important;
    }
}

@media (min-width: 901px) and(max-width: 1600px) {
    .heading {
        /* background-image: url(../img/appimages/Box_07.png);
        background-size: 100% 100%;
        background-repeat: no-repeat; */
        /* background-image: linear-gradient(to bottom,#B88214, #C29125, #CC9B4F,#F8DE7A,#FDEC98,#FDEC98, #FDEB95, #EFD06B, #D3A93F); */
        font-weight: 400;
        font-size: 16px !important;
        background: #262626;
    }
    .bog_Gc1 {
        font-size: 14px !important;
        font-weight: 500 !important;
    }
    span.bloc_GS {
        font-size: 14px !important;
        font-weight: 600;
    }
    span.top25span {
        font-size: 26px;
        font-weight: 500;
        padding: 1px 10px 1px !important;
    }
    span.top5span {
        font-size: 28px;
        font-weight: 400;
        /* padding: 2px 15px 2px!important; */
        border-radius: 4px;
    }
    .top6span {
        font-size: 30px;
        font-weight: 600 !important;
        padding: 1px 15px 1px !important;
        /* padding: 3px; */
        /* font-size: 22px; */
    }
    .sell {
        font-size: 15px !important;
        font-size: 600 !important;
        color: #fff;
    }
    td.bg_white {
        background: linear-gradient(to right, #000, #000);
        box-shadow: 0px 1px 2px 0px #353131;
    }
    /* .min_h{
        background: repeating-linear-gradient(#74ABDD, #74ABDD 49.9%, #498DCB 50.1%, #498DCB 100%);
        padding-top: 10%;
    } */
    .Trending_Table_Child1 {
        /* margin-top: -10%; */
    }
    #stablelogo {
        padding: 25px 0;
    }

    #iconimage img {
        /* min-width: 300px !important; */
        /* min-height: 100px !important; */
        /* margin-left: 25px; */
    }
    .mar_gin {
        margin-top: 5%;
    }
}

@media (max-width: 900px) {
    #stablelogo {
        padding: 10px 0;
    }

    #header > .header-body {
        top: -194px !important;
    }

    .big_ps_as {
        width: 50% !important;
        display: initial !important;
    }

    .mob-none {
        display: none !important;
    }
    .social_icons {
        text-align: center !important;

        /* border-top: 1px solid; */
        padding-top: 10px;
    }
    .social_icons img {
        width: 80px;
    }
    td.bg_white {
        background: linear-gradient(to right, #000, #000);
        box-shadow: 0px 1px 2px 0px #353131;
    }
    .min_h {
        height: 50px;
        /* margin: 0px; */
    }

    .mar_gin {
        margin-top: 10%;
    }
    .Trending_Table_Child1 {
        /* margin-top: -16%; */
    }

    #iconimage img {
        /* min-width: 300px !important; */
        /* min-height: 50px !important; */
        /* margin-left: 20px !important; */
    }

    html.sticky-header-active .scroll-logo {
        display: initial !important;
    }
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Header logo alignment override */
#iconimage {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

#iconimage > span {
    display: flex !important;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 0;
}

#iconimage .LogoImgWidth1 {
    display: block;
    width: min(100%, 260px);
    max-width: 100%;
    max-height: 86px;
    height: auto;
    margin: 0 auto !important;
    padding: 0;
}

@media (max-width: 900px) {
    #iconimage .LogoImgWidth1 {
        width: min(78%, 250px);
        max-height: 76px;
        padding: 0;
    }
}

/* ================================================
   GLOBAL DARK THEME - site-wide
   Navy background  |  Gold  #CC9B4F
   ================================================ */

/* Body */
html,
body,
.body {
    background-color: #ffffff !important;
    background-image: none !important;
    color: #111111;
}

/* ---- HEADER ---- */
#header,
#header .header-body,
#header .header-top,
#header .header-top-container,
#header .header-conta30\.iner,
#header .header-row,
#header .header-column,
#header .header-nav,
#header .header-nav-main,
#header .header-nav-main nav,
#header #mainNav,
#header #navhead,
#header .nav,
#header .nav > li,
#header .nav > li > a,
#header .dropdown,
#header .dropdown-item,
#header .btn,
#header #Lb3,
#header #Lb4,
.header-body,
.header-top {
    background-color: transparent !important;
    background-image: none !important;
}

#header,
#header .naviRow,
#header .header-nav,
#header .header-nav-main,
#header .nav,
#header .nav > li,
#header .nav > li > a,
#header .dropdown-item,
#header .dropdown-toggle,
#header #mainNav a,
#header #showlogin a,
#header #Lb1,
#header #Lb2,
#header #Lb3,
#header #Lb4,
#header #Lb4 a,
#header .btn {
    color: #ffffff !important;
}
#header #mainNav li:has(> a[href="Calculator.html"]) {
    display: none !important;
}
.header-top {
    border-bottom: 1px solid rgba(204, 155, 79, 0.45) !important;
}
.headImg,
.header-row.headImg {
    background-color: transparent !important;
    background-image: none !important;
}

#header,
#header .header-body,
#header .header-top,
#header .header-row,
#header .header-column,
#header .header-nav,
#header .header-nav-main {
    min-height: 0 !important;
}

#header .header-top,
#header .header-top-container,
#header .header-row.headImg,
#header .header-row.headImg .container,
#header .header-row.headImg .row {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#header .naviRow {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#header #mainNav > li > a,
#header #mainNav > li > .dropdown-item,
#header .header-nav-main nav > ul > li > a {
    padding: 5px 8px !important;
    line-height: 1.1 !important;
    font-size: 13px !important;
}

#header #openaccountbtn a,
#header #Lb4 a,
#header a#Lb3 {
    padding: 5px 10px !important;
    line-height: 1 !important;
    font-size: 12px !important;
}

#header .header-btn-collapse-nav {
    padding: 6px 8px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* Header date/time text */
span#date_time,
span#date_time_us,
span#date_time_eng {
    color: #cc9b4f !important;
}

/* naviRow borders � keep gold */
#header .naviRow,
.naviRow {
    background: linear-gradient(90deg, #03130b 0%, #0c3320 50%, #03130b 100%) !important;
    border-top: 1px solid #cc9b4f;
    border-bottom: 1px solid #cc9b4f;
}

/* Dropdown menus (Booking Desk sub-menu) */
.dropdown-menu {
    background-color: #000000 !important;
    background-image: none !important;
    border: 1px solid #cc9b4f !important;
}
.dropdown-menu .dropdown-item {
    color: #fff !important;
    background-color: transparent;
}
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus {
    background-color: transparent !important;
    background-image: none !important;
    color: #ffffff !important;
}

/* Mobile nav collapse panel — themed dark green/gold dropdown instead of
   transparent (needs #header prefix to out-specificity the earlier
   "#header .header-nav-main nav { background: transparent }" HEADER rule). */
@media (max-width: 991px) {
    #header .header-nav-main nav,
    .header-nav-main nav {
        background: linear-gradient(180deg, #03130b 0%, #0c3320 100%) !important;
        border-top: 1px solid #cc9b4f;
    }
    .header-nav-main nav > ul > li > a {
        border-bottom-color: #1e3b1e !important;
        color: #cc9b4f !important;
    }
    #header .header-nav-main nav > ul > li > a:hover,
    .header-nav-main nav > ul > li > a:hover {
        background-color: rgba(204, 155, 79, 0.12) !important;
        background-image: none !important;
        color: #ffffff !important;
    }
}

#header a:hover,
#header a:focus,
#header .btn:hover,
#header .btn:focus,
#header .dropdown-menu li,
#header .dropdown-menu a,
#header .dropdown-menu a:hover,
#header .dropdown-menu a:focus {
    background-color: transparent !important;
    background-image: none !important;
}

#header #openaccountbtn a,
#header #Lb4 a,
#header a#Lb3 {
    background: linear-gradient(180deg, #fff77a 0%, #d8ad3e 48%, #9f681b 100%) !important;
    border: 1px solid rgba(255, 241, 145, 0.85) !important;
    color: #06122b !important;
    box-shadow: 0 0 14px rgba(204, 155, 79, 0.28);
}

#header #openaccountbtn a:hover,
#header #openaccountbtn a:focus,
#header #Lb4 a:hover,
#header #Lb4 a:focus,
#header a#Lb3:hover,
#header a#Lb3:focus {
    background: linear-gradient(180deg, #ffe978 0%, #c9972e 52%, #75470e 100%) !important;
    color: #ffffff !important;
}

/* Hamburger & close icon lines */
.header-btn-collapse-nav .hamburguer span {
    background-color: #cc9b4f !important;
}
.header-btn-collapse-nav .close span {
    background-color: #cc9b4f !important;
}

/* ---- MAIN CONTENT ---- */
.main {
    background-color: transparent !important;
    background-image: none !important;
}

/* Page sections should show the global background image */
section.section,
.main section.section,
.bg-light-5 {
    background-color: transparent !important;
    background-image: none !important;
    color: #e0e0e0;
}

/* Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #cc9b4f;
}

/* Body text */
p {
    color: #e0e0e0;
}

/* Contact_Details.html booking-desk cards: even card height, and text color
   corrected — the base theme's ".css_bkdesk p" rule sets white text (meant
   for a dark card), but these cards render on a plain white background here,
   which made "SHREE BALAJI GOLD", the office address, "Quick Call" and
   "What's App" labels all invisible. */
.css_bkdesk {
    min-height: 261px;
}
.css_bkdesk p {
    color: #000000 !important;
}

/* Content links (not nav, not buttons) */
.main a:not(.btn):not(.nav-link),
#footer a:not(.btn) {
    color: #cc9b4f;
}
.main a:not(.btn):not(.nav-link):hover,
#footer a:not(.btn):hover {
    color: #ffffff;
}

/* ---- FOOTER ---- */
#footer {
    background-color: transparent !important;
    background-image: none !important;
    border-top: 2px solid #cc9b4f;
}
#footer > section.section {
    background-color: transparent !important;
    background-image: none !important;
}

/* Footer icon colours */
#footer .icon-box-icon i {
    color: #cc9b4f !important;
}
#footer .icon-box-info-title h3 {
    color: #cc9b4f !important;
}
#footer .icon-box-info p {
    color: #cc9b4f !important;
}
#footer .icon-box-info a {
    color: #cc9b4f !important;
}
#footer .icon-box-info a:hover {
    color: #ffffff !important;
}

/* Footer copyright bar */
.footer-copyright {
    background-color: transparent !important;
    background-image: none !important;
    border-top: 1px solid #1e3b1e;
}
.footer-copyright p,
.footer-copyright span {
    color: #888888 !important;
}

/* ---- FORM ELEMENTS (site-wide dark theme) ---- */

/* Labels � visible on dark backgrounds */
label,
.form-group label {
    color: #cc9b4f !important;
}

/* Input / textarea / select */
.form-control {
    background-color: #1b2e1b !important;
    color: #e0e0e0 !important;
    border: 1px solid #3a5a3a !important;
}
.form-control::placeholder {
    color: #888888 !important;
    opacity: 1;
}
.form-control:focus {
    background-color: #1e341e !important;
    border-color: #cc9b4f !important;
    box-shadow: 0 0 0 0.2rem rgba(221, 184, 80, 0.25) !important;
    color: #ffffff !important;
}

/* Select dropdowns */
select.form-control option {
    background-color: #111e11;
    color: #e0e0e0;
}

/* ---- CONTACT FORM SECTION (contact-us.html) ---- */
/* The contact section already has a black background;
   override the inline color:#000 on its headings/paragraphs */
.bg-light-5 h2,
.bg-light-5 h3,
.bg-light-5 p.lead {
    color: #e0e0e0 !important;
}

/* ---- DOWNLOAD PAGE LINKS ---- */
.main .fa-download {
    color: #cc9b4f !important;
}

/* ---- PAGE BANNER HEADERS (section.page-header) ---- */
/* Keep text readable on the gold gradient CTAs */
.page-header h1 {
    color: #000 !important;
}

/* ---- TABLES  (general dark styling) ---- */
.main
    table:not(.Trending_Table_Root):not(.table1001):not(.goldd):not(.res_mob_font_width):not(.heading):not(.bnkdetails):not(.rateTable):not(.table_answer):not(.goldd1):not(.goldd2):not(.goldd3):not(
        .tt_333
    ) {
    color: #e0e0e0;
}

/* ---- MESSAGE TABLE (Message.html) ---- */
#gvData_Newss,
table.tablestyle {
    color: #e0e0e0 !important;
    background-color: transparent;
}

/* ---- PRIVACY POLICY / DISCLAIMER TEXT ---- */
.main .container p,
.main .container li,
.main .container span:not([style]) {
    color: #e0e0e0;
}

/* ---- SEO utility ---- */
.seo-h1-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Bank_Details.html: dynamic panel populated by js/BankDetails.Chirayu.js
   via #gvDataBankDetails. Empty (no visible box) until the AJAX call fills
   it, so it never shows a bare border when there's nothing to display yet. */
.sbg-bank-details-panel {
    width: min(100%, 720px);
    margin: 0 auto 16px;
    color: #222222;
}

.sbg-bank-details-panel:empty {
    display: none;
}

.sbg-bank-details-panel .center-message {
    border: 1.5px solid var(--sbg-gold-border);
    border-radius: 10px;
    background: #ffffff;
    color: #222222;
    font-weight: 700;
    text-align: center;
    padding: 18px 12px;
}

/* Shree Balaji Gold website live-rate theme */
:root {
    --sbg-black: #000000;
    --sbg-green-dark: #021c11;
    --sbg-panel: rgba(3, 20, 12, 0.96);
    --sbg-gold: #f2c95e;
    --sbg-gold-soft: #f4cf6c;
    --sbg-gold-border: #b9872e;
    --sbg-line: rgba(177, 123, 42, 0.55);
}

html,
body,
.body {
    background-color: #ffffff !important;
    background-image: none !important;
    color: #111111;
}

body.sbg-live-rates-page.sbg-dark-mode,
body.sbg-live-rates-page.sbg-dark-mode .body {
    background-color: #000000 !important;
}

.mobile-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
}

.mobile-logo .theme-img,
.mobile-logo .sbg-logo-toggle {
    display: block;
    width: auto;
    max-width: min(360px, 72vw);
    max-height: 118px;
    object-fit: contain;
    cursor: pointer;
}

/* Matches the header's established gold-on-dark-green palette (same gold
   gradient as the LOGIN button, same border tone as the logo ring) instead
   of the previous plain white circle + mismatched dull-gold crescent. */
.sbg-theme-toggle {
    width: 42px;
    height: 42px;
    border: 1.5px solid rgba(255, 241, 145, 0.85);
    border-radius: 50%;
    background: linear-gradient(180deg, #0c3320 0%, #03130b 100%);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
    flex: 0 0 auto;
}

/* Actual sun/moon icon images (img/appimages/theme-sun.png and theme-moon.png,
   swapped by the existing data-day/data-night mechanism in the inline script)
   instead of a CSS-drawn shape — the earlier inset-shadow "crescent" attempt
   rendered as a broken, off-center blob rather than a clean icon. */
.sbg-theme-toggle-icon {
    width: 22px;
    height: 22px;
    display: block;
    object-fit: contain;
}

body.sbg-live-rates-page.sbg-dark-mode .sbg-theme-toggle {
    background: linear-gradient(180deg, #03130b 0%, #000000 100%);
}

body.sbg-live-rates-page.sbg-dark-mode .sbg-theme-toggle-icon {
    filter: drop-shadow(0 0 4px rgba(216, 173, 62, 0.45));
}

.live-rates-page .live-rates-container {
    max-width: 1180px;
    position: relative;
}

.live-rates-page .live-rates-board {
    float: none;
    max-width: 1080px;
    margin: 0 auto;
}

/* Anchored directly on body.sbg-live-rates-page .body (the true top of the
   page, before <header>) rather than relative to the header's own rendered
   height — a fixed clamp() offset can't reliably reach y:0 across every
   header height/breakpoint, but top:0 on a full-width absolute box anchored
   to the page's own top-left corner always does, and still scrolls away
   with the page (unlike position:fixed). */
body.sbg-live-rates-page .body {
    position: relative;
}

.curve-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    pointer-events: none;
}

.curve-bg::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: clamp(200px, 32vw, 208px);
    background-image: url("../img/appimages/Header.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    z-index: 0;
}

body.sbg-live-rates-page #footer {
    background-color: var(--sbg-green-dark) !important;
    background-image: none !important;
}

body.sbg-live-rates-page .right-app-cover {
    background-color: var(--sbg-green-dark) !important;
    padding: 8px !important;
}

.main .section:first-child .container {
    max-width: 1180px;
}

.div-spott {
    width: 100%;
    max-width: 920px;
    padding: 18px 14px 0 !important;
    overflow: hidden;
    box-sizing: border-box;
}

#my-tab.div_spot {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box;
}

#my-tab,
#my-tab * {
    box-sizing: border-box;
}

#my-tab .swiper-wrapper,
#my-tab .swiper-slide {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
}

.divBg,
.swiper-pagination1 {
    display: none !important;
}

.sbg-rate-switch {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    align-items: center;
    width: 100%;
    margin: 0 auto 14px;
}

.sbg-tab-btn {
    min-height: 40px;
    border: 1.5px solid var(--sbg-gold-border);
    border-radius: 22px;
    color: var(--sbg-gold);
    font-weight: 700;
    white-space: nowrap;
    width: 100%;
    background: rgba(3, 20, 12, 0.95);
    font-size: 12px;
    letter-spacing: 0.6px;
    cursor: pointer;
}

.sbg-tab-btn.sbg-tab-active {
    background: linear-gradient(135deg, #f9e077 0%, #d89b28 50%, #9d6118 100%);
    color: #1a1000;
    border-color: #c8921e;
}

@media (max-width: 520px) {
    .sbg-rate-switch {
        grid-template-columns: repeat(3, 1fr);
    }
}

.Trending_Table_Root {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border: 0 !important;
    border-collapse: separate !important;
    background: transparent !important;
    margin: 0 auto;
}

.Trending_Table_Child1,
.Trending_Table_Child2,
#gvData,
#gvData_silver,
#gvData_Unfix,
#gvData_top3,
#gvData_top3_silver,
#gvData_top3_Unfix {
    background: transparent !important;
    color: #f7e9c6 !important;
}

/* ---- TOP SPOT RATE CARDS (theme.jpeg white stat-tile style) ---- */
/* Single definition point for #gvData_top3's table.table1001 / table.goldd
   tiles � nothing else in this file or in LiveRates.html's inline <style>
   targets these selectors, so there is no cascade fight to win with !important. */
#gvData_top3,
#gvData_top3_silver,
#gvData_top3_Unfix {
    border-collapse: separate;
    border-spacing: 0;
    border: 0;
    background: transparent;
    margin: 10px 0 14px;
}

/* theme.jpeg shows ONE continuous white stat card (not three separate boxes
   with gaps) with thin gold stroke lines dividing the GOLD / SILVER / COSTING
   columns. table.table1001 is that single card; the inner table.goldd cells
   are transparent so the white background is unbroken behind them. */
table.table1001 {
    width: 100%;
    table-layout: fixed;
    background: #ffffff;
    border: 1.5px solid var(--sbg-gold-border);
    border-radius: 14px;
    border-collapse: separate;
    border-spacing: 0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
    overflow: hidden;
}

table.table1001 > tbody > tr > td {
    padding: 0;
    vertical-align: top;
    border-right: 1px solid var(--sbg-gold-border);
}

table.table1001 > tbody > tr > td:last-child {
    border-right: 0;
}

/* height (not just min-height) is deliberate: GOLD/SILVER/INR each sit in
   their own independent table.goldd card, side by side as cells of the same
   table.table1001 row. If only min-height were set, a badged card (extra
   vertical padding from the pill) would grow taller than its unbadged
   neighbors, and since table cells in a row share the row's height, the
   shorter cards' content would get re-centered within that taller shared
   row — visibly shifting their "GOLD($)"/"SILVER($)"/"INR($)" labels
   relative to where they sat before. A fixed height keeps every card (and
   its label) the same regardless of which ones currently have a badge. */
table.goldd,
table.goldd1,
table.goldd2,
table.goldd3 {
    width: 100%;
    height: 104px;
    min-height: 104px;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: visible;
}

/* Fixed height on the row itself (not just the outer table.goldd) — without
   this, since neither table row has an explicit height, the browser was
   compressing this label row by a couple pixels to make room whenever the
   value row below needed more space for a badge's padding, visibly shifting
   the "GOLD($)"/"SILVER($)"/"INR($)" label upward on badged cards versus
   plain ones sitting right next to them. */
.top-rate-title-row,
.top-rate-title-row td {
    height: 44px;
}

.top-rate-title-row td {
    text-align: center;
    padding: 6px 4px 0;
}

.top-rate-title {
    display: block;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: break-word;
}

.top-rate-title .boxImg,
.top-rate-title .boxImg1 {
    width: 20px;
    height: 20px;
    object-fit: contain;
    flex: 0 0 auto;
}

.top5sell {
    /* !important needed: ".main .container span:not([style])" (privacy-policy
       body text rule) has higher specificity and would otherwise repaint this
       label gray, since this span carries no inline style attribute. */
    color: var(--sbg-gold-border) !important;
    font-weight: 700 !important;
    font-size: 12px;
    letter-spacing: 0.3px;
    text-transform: uppercase;
}

span.top5span {
    display: block;
    color: #1a1a1a;
    font-size: 26px;
    font-weight: 800;
    line-height: 1.25;
    padding: 0 4px;
}

/* Up/down badges for the #gvData_top3 stat tiles (GOLD/SILVER/INR), same
   treatment as the product table's span.top55span badges. LiveRates3.js
   sets style="color: green;..." / "color: red;..." / "color:#000;..." here
   (plain text color, no background) for these three states — [style*="green"]
   / [style*="red"] catches the up/down cases regardless of the space after
   the colon. font-size/line-height/display are deliberately NOT overridden
   here (only in the base rule above) so a badged tile renders at the exact
   same text size/height as a neutral one — this exact mismatch, in the
   equivalent product-table rule, previously threw off row alignment.
   Scoped to table.table1001 (the stat-tile row wrapper), NOT #gvData_top3 —
   the markup nests <table id="gvData_top3"><table class="table1001">
   directly with no <tr><td> in between, which is invalid HTML. Browsers
   foster-parent the inner table out during parsing, so #gvData_top3 ends up
   with zero real children and is never actually an ancestor of these spans;
   a selector anchored on it can never match. table.table1001's own <tr><td>
   nesting is valid, so it stays a real ancestor. */
table.table1001 span.top5span[style*="green"] {
    background: #16a34a !important;
    color: #ffffff !important;
    width: fit-content;
    margin: 0 auto;
    padding: 2px 14px !important;
    border-radius: 999px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

table.table1001 span.top5span[style*="red"] {
    background: #dc2626 !important;
    color: #ffffff !important;
    width: fit-content;
    margin: 0 auto;
    padding: 2px 14px !important;
    border-radius: 999px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
}

.GoldRtae2 td {
    text-align: center;
    padding: 2px 4px 10px;
}

span.bloc_GS {
    font-size: 10px;
    line-height: 1.2;
}

.marquee {
    background-color: #d8a12b !important;
    background-image: linear-gradient(90deg, #f9df70 0%, #d8a12b 45%, #9d6118 100%) !important;
    color: #000000 !important;
    border: 1px solid #f3cf63 !important;
    overflow: hidden;
    padding: 2px 0;
    font-size: 14px;
    font-weight: 600;
    margin: 5px 0;
}

.marquee p,
.marquee a,
.marquee span,
.marquee div {
    color: #000000 !important;
}

body.sbg-live-rates-page .right-app-cover {
    width: 100%;
    float: none;
    padding: 0 8px;
    box-shadow: 1px 1px 5px 0 #000;
    border-radius: 10px;
    background: transparent;
}

body.sbg-live-rates-page .right-app-details {
    border-radius: 10px;
    margin: 5px 0 6px;
    border: 4px groove #fff;
}

body.sbg-live-rates-page .app-available,
body.sbg-live-rates-page .adrs {
    padding: 4px 0;
}

body.sbg-live-rates-page .adrs {
    border-top: 1px solid #cc9b4f;
    margin-top: 6px;
}

body.sbg-live-rates-page .booking {
    color: #ffffff;
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 8px;
}

body.sbg-live-rates-page .right-app-details h4 {
    font-size: 18px;
    line-height: 1.2;
    margin-bottom: 4px;
    padding: 4px 0 !important;
}

body.sbg-live-rates-page .anroid-app-cover,
body.sbg-live-rates-page .ios-app-cover {
    display: inline-block;
    width: 48%;
    text-align: center;
}

@media (max-width: 520px) {
    .mobile-logo {
        gap: 6px;
    }

    .mobile-logo .theme-img,
    .mobile-logo .sbg-logo-toggle {
        max-width: min(238px, calc(100vw - 126px));
        max-height: 92px;
    }

    .sbg-theme-toggle {
        width: 34px;
        height: 34px;
    }

    .curve-bg {
        height: 64px;
    }

    .curve-bg::before {
        width: 126%;
        height: 175px;
        top: -76px;
    }

    .main .section:first-child .row {
        margin-left: 0;
        margin-right: 0;
    }

    .div-spott {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    table.table1001 {
        width: 100% !important;
        max-width: 100% !important;
        border-spacing: 4px 0 !important;
        display: block !important;
    }

    table.table1001 > tbody {
        display: block !important;
        width: 100% !important;
    }

    table.table1001 > tbody > tr {
        display: flex !important;
        width: 100% !important;
        gap: 4px;
    }

    table.table1001 > tbody > tr > td {
        display: block !important;
        flex: 1 1 0 !important;
        width: auto !important;
        max-width: none !important;
    }

    table.goldd,
    table.goldd1,
    table.goldd2,
    table.goldd3 {
        height: 112px !important;
        min-height: 112px !important;
        max-height: 112px !important;
    }

    .table1001 table tr:nth-child(1) td {
        height: 36px !important;
        padding: 6px 3px 2px !important;
    }

    .table1001 table tr:nth-child(2) td {
        height: 36px !important;
        padding: 2px 3px !important;
    }

    .table1001 table tr:nth-child(3) td {
        height: 40px !important;
        padding: 2px 3px 8px !important;
    }

    .top-rate-title {
        max-width: 100%;
        gap: 3px;
        overflow: hidden;
    }

    .top-rate-title .boxImg,
    .top-rate-title .boxImg1 {
        width: 16px;
        height: 16px;
    }

    span.top5span {
        font-size: 15px;
    }

    .top5sell {
        font-size: 10px;
    }

    span.buy_sell_label,
    span.sell {
        font-size: 9px !important;
    }

    span.bloc_GS {
        font-size: 9px;
    }

    .GoldRtae2 td {
        white-space: nowrap;
    }

    table.heading > tbody > tr,
    table.res_mob_font_width > tbody > tr {
        display: grid !important;
        grid-template-columns: 40% 30% 30%;
        width: 100% !important;
        align-items: center;
    }

    table.heading > tbody > tr > td,
    table.res_mob_font_width > tbody > tr > td {
        display: block !important;
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden;
    }

    table.heading td:first-child,
    table.res_mob_font_width td:first-child {
        width: 40% !important;
    }

    table.heading td:nth-child(2),
    table.heading td:nth-child(3),
    table.res_mob_font_width td:nth-child(2),
    table.res_mob_font_width td:nth-child(3) {
        width: 30% !important;
    }

    table.res_mob_font_width .top55span {
        display: inline-block !important;
        max-width: 100% !important;
        font-size: 15px !important;
        line-height: 1.15 !important;
        padding: 0 !important;
        white-space: nowrap;
    }

    table.res_mob_font_width span.sell {
        display: block !important;
        font-size: 9px !important;
        line-height: 1.2 !important;
        white-space: normal;
    }

    html body .main #my-tab table.res_mob_font_width td span.top55span {
        display: inline-block !important;
        max-width: 100% !important;
        font-size: 12px !important;
        line-height: 1 !important;
        padding: 0 !important;
        letter-spacing: 0 !important;
        white-space: nowrap !important;
    }

    .sbg-tab-btn {
        font-size: 11px;
        letter-spacing: 0;
    }

    table.heading > tbody > tr > td:first-child {
        overflow: visible;
    }

    table.heading td span {
        font-size: 12px;
    }

    table.res_mob_font_width > tbody > tr > td {
        padding: 7px 5px;
    }

    span.buy_sell_label {
        font-size: 12px;
    }

    span.top55span {
        font-size: 13px;
    }

    span.sell {
        font-size: 9px;
    }
}

@media (max-width: 767px) {
    .main .section:first-child .container,
    .col-lg-9.col-md-12.col-xs-12.div-spott,
    .div-spott,
    .col-md-8.col-xs-12.div_spott,
    .col-md-8.col-xs-12.offset-md-2.div_spott {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 6px !important;
        padding-right: 6px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    #my-tab .swiper-wrapper,
    #my-tab .swiper-slide,
    #my-tab .swiper-slideTrending {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    /* This media-query override block was removed entirely (not just fixed)
       — #my-tab, .sbg-rate-switch, .Trending_Table_Root, table.table1001,
       #gvData/#gvData_silver/#gvData_Unfix and their tt_333/res_mob_font_width
       descendants all already get a correct, container-relative width: 100%
       from their base (non-media-query) rules elsewhere in this file, which
       apply at every screen size including under 767px, so no separate
       override is needed here at all. */
}

/* Up/down badges — single definitive rule. LiveRates3.js emits three
   variants for a top55span value: no background (default, color:#000, set
   in the JS itself), "background:green; color:#FFF" (up), or
   "background-color:green;color:#FFF" (up, alternate syntax used in other
   handler functions) — same for red/down. Matching on [style*="green"] /
   [style*="red"] catches both syntax variants (earlier attempts here only
   matched [style*="color:green"/"color:red"], which happens to catch the
   "background-color:" form via substring but silently misses the
   "background:" form, so roughly half of all up/down cells never got
   badged). Default/no-change values are untouched here and stay black. */
/* font-size/line-height intentionally NOT set here (only in the shared base
   rule above) — this used to set its own clamp(13px,2.35vw,20px)/line-height:1
   which didn't match the base rule's fixed 22px/1.08, so a badged cell's
   text rendered at a different size/height than the plain cell next to it in
   the same row, pushing that cell's "L -"/"H -" line out of alignment with
   its neighbor. min-height keeps the pill itself a consistent size too. */
html body .main #my-tab #gvData table.res_mob_font_width td span.top55span[style*="green"],
html body .main #my-tab #gvData_silver table.res_mob_font_width td span.top55span[style*="green"],
html body .main #my-tab #gvData_Unfix table.res_mob_font_width td span.top55span[style*="green"] {
    background: #16a34a !important;
    color: #ffffff !important;
    display: inline-block !important;
    min-height: 1.08em !important;
    padding: 2px 10px !important;
    border-radius: 999px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) !important;
}

html body .main #my-tab #gvData table.res_mob_font_width td span.top55span[style*="red"],
html body .main #my-tab #gvData_silver table.res_mob_font_width td span.top55span[style*="red"],
html body .main #my-tab #gvData_Unfix table.res_mob_font_width td span.top55span[style*="red"] {
    background: #dc2626 !important;
    color: #ffffff !important;
    display: inline-block !important;
    min-height: 1.08em !important;
    padding: 2px 10px !important;
    border-radius: 999px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) !important;
}

/* Defensive: keep every value+L/H cell in a row the same height regardless
   of whether that particular cell is badged or plain, so rows never wobble
   between columns. */
body.sbg-live-rates-page #my-tab #gvData table.res_mob_font_width td,
body.sbg-live-rates-page #my-tab #gvData_silver table.res_mob_font_width td,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.res_mob_font_width td {
    min-height: 56px !important;
}

/* ---- THEME.JPEG MAIN RATE TABLE: #gvData GENERATED MARKUP ---- */
body.sbg-live-rates-page #my-tab #gvData,
body.sbg-live-rates-page #my-tab #gvData_silver,
body.sbg-live-rates-page #my-tab #gvData_Unfix {
    width: 100% !important;
    max-width: 100% !important;
    /* margin: 14px auto 16px !important; */
    border: 1.5px solid #d8c6a1 !important;
    border-radius: 13px !important;
    background: #ffffff !important;
    color: #111111 !important;
    overflow: hidden !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    box-shadow: none !important;
}

body.sbg-live-rates-page #my-tab #gvData table,
body.sbg-live-rates-page #my-tab #gvData_silver table,
body.sbg-live-rates-page #my-tab #gvData_Unfix table {
    box-sizing: border-box !important;
}

body.sbg-live-rates-page #my-tab #gvData table.heading,
body.sbg-live-rates-page #my-tab #gvData_silver table.heading,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading {
    width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    border-collapse: collapse !important;
    background: #003b2a !important;
    background-image: none !important;
    overflow: hidden !important;
}

body.sbg-live-rates-page #my-tab #gvData table.heading td,
body.sbg-live-rates-page #my-tab #gvData_silver table.heading td,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading td {
    height: 46px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    vertical-align: middle !important;
    border: 0 !important;
    background: transparent !important;
}

body.sbg-live-rates-page #my-tab #gvData table.heading td:first-child,
body.sbg-live-rates-page #my-tab #gvData_silver table.heading td:first-child,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading td:first-child {
    padding-left: 4.5% !important;
}

body.sbg-live-rates-page #my-tab #gvData table.heading td span,
body.sbg-live-rates-page #my-tab #gvData_silver table.heading td span,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading td span {
    color: #d8b35a !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
}

body.sbg-live-rates-page #my-tab #gvData table.tt_333,
body.sbg-live-rates-page #my-tab #gvData_silver table.tt_333,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.tt_333 {
    width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    background: #ffffff !important;
    background-image: none !important;
    color: #111111 !important;
    box-shadow: none !important;
}

body.sbg-live-rates-page #my-tab #gvData table.tt_333 > tbody > tr > td,
body.sbg-live-rates-page #my-tab #gvData_silver table.tt_333 > tbody > tr > td,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.tt_333 > tbody > tr > td {
    padding: 0 !important;
    background: #ffffff !important;
    border: 0 !important;
}

body.sbg-live-rates-page #my-tab #gvData table.res_mob_font_width,
body.sbg-live-rates-page #my-tab #gvData_silver table.res_mob_font_width,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.res_mob_font_width {
    width: 100% !important;
    margin: 0 !important;
    border: 0 !important;
    border-bottom: 1px solid #ddd4c5 !important;
    border-collapse: collapse !important;
    background: #ffffff !important;
    background-image: none !important;
    cursor: pointer;
}

body.sbg-live-rates-page #my-tab #gvData table.res_mob_font_width:last-child,
body.sbg-live-rates-page #my-tab #gvData_silver table.res_mob_font_width:last-child,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.res_mob_font_width:last-child {
    border-bottom: 0 !important;
}

body.sbg-live-rates-page #my-tab #gvData table.res_mob_font_width tr,
body.sbg-live-rates-page #my-tab #gvData_silver table.res_mob_font_width tr,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.res_mob_font_width tr {
    background: #ffffff !important;
}

body.sbg-live-rates-page #my-tab #gvData table.res_mob_font_width td,
body.sbg-live-rates-page #my-tab #gvData_silver table.res_mob_font_width td,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.res_mob_font_width td {
    height: 56px !important;
    padding: 4px 8px !important;
    vertical-align: middle !important;
    background: #ffffff !important;
    background-image: none !important;
    border: 0 !important;
    color: #111111 !important;
    line-height: 1.15 !important;
}

body.sbg-live-rates-page #my-tab #gvData table.res_mob_font_width td:first-child,
body.sbg-live-rates-page #my-tab #gvData_silver table.res_mob_font_width td:first-child,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.res_mob_font_width td:first-child {
    padding-left: 4.5% !important;
}

body.sbg-live-rates-page #my-tab #gvData span.buy_sell_label,
body.sbg-live-rates-page #my-tab #gvData_silver span.buy_sell_label,
body.sbg-live-rates-page #my-tab #gvData_Unfix span.buy_sell_label {
    display: inline-block !important;
    max-width: 100% !important;
    color: #071411 !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
    white-space: normal !important;
}

/* Sizing only — color/background for the default vs up/down badge states is
   defined once, correctly, in the consolidated block further down. This
   used to also force color:#087020 (green) as the default for every value
   regardless of state, which was the actual "text is green, not black" bug:
   js/LiveRates3.js already sets color:#000 inline for the no-change case,
   but this rule's !important silently overrode it everywhere. */
body.sbg-live-rates-page #my-tab #gvData span.top55span,
body.sbg-live-rates-page #my-tab #gvData_silver span.top55span,
body.sbg-live-rates-page #my-tab #gvData_Unfix span.top55span {
    display: inline-block !important;
    min-width: 0 !important;
    max-width: 100% !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
}

body.sbg-live-rates-page #my-tab #gvData span.sell,
body.sbg-live-rates-page #my-tab #gvData_silver span.sell,
body.sbg-live-rates-page #my-tab #gvData_Unfix span.sell {
    display: block !important;
    margin: 4px 0 0 !important;
    padding: 0 !important;
    color: #111111 !important;
    background: transparent !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.05 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
}

@media (max-width: 767px) {
    /* width was calc(100vw - 18px) — same viewport-relative bug as the other
       spot already fixed in this file (ignores the actual padded container,
       overflows on some breakpoints). Container-relative 100% is correct and
       consistent with every other rule touching this element. */
    body.sbg-live-rates-page #my-tab #gvData,
    body.sbg-live-rates-page #my-tab #gvData_silver,
    body.sbg-live-rates-page #my-tab #gvData_Unfix {
        width: 100% !important;
        max-width: 100% !important;
        /* margin-top: 14px !important; */
        border-radius: 10px !important;
    }

    body.sbg-live-rates-page #my-tab #gvData table.heading td,
    body.sbg-live-rates-page #my-tab #gvData_silver table.heading td,
    body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading td {
        height: 34px !important;
    }

    body.sbg-live-rates-page #my-tab #gvData table.heading td span,
    body.sbg-live-rates-page #my-tab #gvData_silver table.heading td span,
    body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading td span {
        font-size: 12px !important;
    }

    body.sbg-live-rates-page #my-tab #gvData table.res_mob_font_width td,
    body.sbg-live-rates-page #my-tab #gvData_silver table.res_mob_font_width td,
    body.sbg-live-rates-page #my-tab #gvData_Unfix table.res_mob_font_width td {
        height: 40px !important;
        padding: 3px 5px !important;
    }

    body.sbg-live-rates-page #my-tab #gvData span.buy_sell_label,
    body.sbg-live-rates-page #my-tab #gvData_silver span.buy_sell_label,
    body.sbg-live-rates-page #my-tab #gvData_Unfix span.buy_sell_label {
        font-size: 12px !important;
        line-height: 1.05 !important;
    }

    body.sbg-live-rates-page #my-tab #gvData span.top55span,
    body.sbg-live-rates-page #my-tab #gvData_silver span.top55span,
    body.sbg-live-rates-page #my-tab #gvData_Unfix span.top55span {
        font-size: 12px !important;
        line-height: 1.05 !important;
    }

    body.sbg-live-rates-page #my-tab #gvData span.sell,
    body.sbg-live-rates-page #my-tab #gvData_silver span.sell,
    body.sbg-live-rates-page #my-tab #gvData_Unfix span.sell {
        margin-top: 3px !important;
        font-size: 9px !important;
        line-height: 1 !important;
    }
}

/* (Removed: a previous "final cleanup" pass here explicitly stripped the
   badge background back to transparent and used colored text instead, which
   directly undid the badge treatment below and — combined with its buggy
   [style*="color:red"/"color:green"] detector only matching half of
   LiveRates3.js's inline-style variants — produced an inconsistent mix of
   plain green/red text on some cells and white-on-color badges on others.
   Badges for the up/down state are defined once, correctly, below.) */

/* Mobile fit adjustment for long buy/sell values in 25% columns. */
@media (max-width: 767px) {
    html body.sbg-live-rates-page .main #my-tab #gvData table.res_mob_font_width td span.top55span,
    html body.sbg-live-rates-page .main #my-tab #gvData_silver table.res_mob_font_width td span.top55span,
    html body.sbg-live-rates-page .main #my-tab #gvData_Unfix table.res_mob_font_width td span.top55span {
        font-size: 10.5px !important;
        max-width: 100% !important;
    }

    html body.sbg-live-rates-page .main #my-tab #gvData span.buy_sell_label,
    html body.sbg-live-rates-page .main #my-tab #gvData_silver span.buy_sell_label,
    html body.sbg-live-rates-page .main #my-tab #gvData_Unfix span.buy_sell_label {
        font-size: 11px !important;
    }
}

/* gvData section spacing/borders: each heading + tt_333 is one clean card. */
body.sbg-live-rates-page #my-tab #gvData,
body.sbg-live-rates-page #my-tab #gvData_silver,
body.sbg-live-rates-page #my-tab #gvData_Unfix {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    overflow: visible !important;
    box-shadow: none !important;
}

body.sbg-live-rates-page #my-tab #gvData table.heading,
body.sbg-live-rates-page #my-tab #gvData_silver table.heading,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading {
    margin: 0 !important;
    border: 1.5px solid #d8c6a1 !important;
    border-bottom: 0 !important;
    border-radius: 13px 13px 0 0 !important;
    overflow: hidden !important;
}

body.sbg-live-rates-page #my-tab #gvData table.heading:not(:first-child),
body.sbg-live-rates-page #my-tab #gvData_silver table.heading:not(:first-child),
body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading:not(:first-child) {
    margin-top: 14px !important;
}

body.sbg-live-rates-page #my-tab #gvData table.heading + table.tt_333,
body.sbg-live-rates-page #my-tab #gvData_silver table.heading + table.tt_333,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading + table.tt_333 {
    border: 1.5px solid #d8c6a1 !important;
    border-top: 0 !important;
    border-radius: 0 0 13px 13px !important;
    overflow: hidden !important;
    background: #ffffff !important;
}

body.sbg-live-rates-page #my-tab #gvData table.tt_333 table.res_mob_font_width:last-child,
body.sbg-live-rates-page #my-tab #gvData_silver table.tt_333 table.res_mob_font_width:last-child,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.tt_333 table.res_mob_font_width:last-child {
    border-bottom: 0 !important;
}

@media (max-width: 767px) {
    body.sbg-live-rates-page #my-tab #gvData table.heading,
    body.sbg-live-rates-page #my-tab #gvData_silver table.heading,
    body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading {
        border-radius: 8px 8px 0 0 !important;
    }

    body.sbg-live-rates-page #my-tab #gvData table.heading + table.tt_333,
    body.sbg-live-rates-page #my-tab #gvData_silver table.heading + table.tt_333,
    body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading + table.tt_333 {
        border-radius: 0 0 8px 8px !important;
    }

    body.sbg-live-rates-page #my-tab #gvData table.heading:not(:first-child),
    body.sbg-live-rates-page #my-tab #gvData_silver table.heading:not(:first-child),
    body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading:not(:first-child) {
        margin-top: 12px !important;
    }
}

/* Final table card borders: visible left/right borders + rounded corners for PRODUCTS and FUTURE sections. */
body.sbg-live-rates-page #my-tab #gvData table.heading,
body.sbg-live-rates-page #my-tab #gvData_silver table.heading,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-top: 1.5px solid #d8c6a1 !important;
    border-right: 1.5px solid #d8c6a1 !important;
    border-bottom: 0 !important;
    border-left: 1.5px solid #d8c6a1 !important;
    border-radius: 13px 13px 0 0 !important;
    overflow: hidden !important;
}

body.sbg-live-rates-page #my-tab #gvData table.heading + table.tt_333,
body.sbg-live-rates-page #my-tab #gvData_silver table.heading + table.tt_333,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading + table.tt_333 {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-top: 0 !important;
    border-right: 1.5px solid #d8c6a1 !important;
    border-bottom: 1.5px solid #d8c6a1 !important;
    border-left: 1.5px solid #d8c6a1 !important;
    border-radius: 0 0 13px 13px !important;
    overflow: hidden !important;
}

body.sbg-live-rates-page #my-tab #gvData table.heading td:first-child,
body.sbg-live-rates-page #my-tab #gvData_silver table.heading td:first-child,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading td:first-child {
    border-top-left-radius: 12px !important;
}

body.sbg-live-rates-page #my-tab #gvData table.heading td:last-child,
body.sbg-live-rates-page #my-tab #gvData_silver table.heading td:last-child,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading td:last-child {
    border-top-right-radius: 12px !important;
}

body.sbg-live-rates-page #my-tab #gvData table.heading + table.tt_333 > tbody > tr > td,
body.sbg-live-rates-page #my-tab #gvData_silver table.heading + table.tt_333 > tbody > tr > td,
body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading + table.tt_333 > tbody > tr > td {
    border-radius: 0 0 12px 12px !important;
    overflow: hidden !important;
}

@media (max-width: 767px) {
    body.sbg-live-rates-page #my-tab #gvData table.heading,
    body.sbg-live-rates-page #my-tab #gvData_silver table.heading,
    body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading {
        border-radius: 9px 9px 0 0 !important;
    }

    body.sbg-live-rates-page #my-tab #gvData table.heading + table.tt_333,
    body.sbg-live-rates-page #my-tab #gvData_silver table.heading + table.tt_333,
    body.sbg-live-rates-page #my-tab #gvData_Unfix table.heading + table.tt_333 {
        border-radius: 0 0 9px 9px !important;
    }
}