/* Compact rates layout, fixed navigation and the page-load gold sweep. */
html.gold-liverates-root {
    scroll-padding-top: calc(var(--liverates-header-height, 0px) + 16px);
}

body.page-liverates #header {
    position: relative;
    z-index: 1030;
    min-height: 0 !important;
}

body.page-liverates #header > .header-body {
    position: relative !important;
    top: 0 !important;
    margin: 0;
    background: #000 !important;
    transition: none;
}

body.page-liverates #header.gold-fixed-header {
    height: var(--liverates-header-height) !important;
}

body.page-liverates #header.gold-fixed-header > .header-body {
    position: fixed !important;
    inset: 0 0 auto;
    width: 100%;
    max-height: 100vh;
    max-height: 100svh;
    overflow-y: auto;
    overscroll-behavior: contain;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .45);
}

body.page-liverates .main [id] {
    scroll-margin-top: 16px;
}

/* Keep full product names and prices on one line. Long feeds scroll locally. */
body.page-liverates .rate-table-scroll {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--gold-line) #080808;
}

body.page-liverates .Trending_Table_Root {
    table-layout: fixed;
}

body.page-liverates :is(.heading, .res_mob_font_width, .res_mob_font_width1, .res_mob_font_width2) {
    border-spacing: 0;
}

body.page-liverates :is(.heading td, .heading th, .buy_sell_label, .top55span, .top5span,
    .sell, .top66span, .silver-coin-booking, .GoldRtae2 td) {
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
}

body.page-liverates .buy_sell_label {
    padding: 0 !important;
}

body.page-liverates #gvData_silvercoins {
    table-layout: auto;
}

body.page-liverates #header #iconimage .LogoImgWidth1 {
    width: 150px;
}

body.page-liverates #header .headImg {
    padding: 4px 0;
}

@media (min-width: 992px) {
    body.page-liverates #header .header-nav-main nav > ul > li > a {
        min-height: 44px;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
        font-size: 12px;
    }

    body.page-liverates #header .naviRow a.btn {
        padding-top: 8px;
        padding-bottom: 8px;
    }
}

.gold-rate-sweep {
    position: fixed;
    inset: var(--liverates-header-height, 0px) 0 0;
    z-index: 1029;
    overflow: hidden;
    pointer-events: none;
    contain: paint;
}

.gold-rate-sweep::before {
    content: '';
    position: absolute;
    top: -45%;
    left: 0;
    width: clamp(100px, 18vw, 260px);
    height: 190%;
    background: linear-gradient(90deg,
        transparent 0%, rgba(230, 199, 107, .03) 20%,
        rgba(230, 199, 107, .18) 58%, rgba(230, 199, 107, .5) 73%,
        #fff0b0 76%, #fff9e4 77%, rgba(230, 199, 107, .2) 79%,
        transparent 84%);
    clip-path: polygon(0 0, 78% 0, 100% 50%, 78% 100%, 0 100%, 18% 50%);
    opacity: 0;
    transform: translateX(-200%) skewX(-22deg);
    animation: gold-rate-blade 720ms cubic-bezier(.22, .61, .36, 1) both;
}

@keyframes gold-rate-blade {
    0% { opacity: 0; transform: translateX(-200%) skewX(-22deg); }
    12% { opacity: 1; }
    78% { opacity: .85; }
    100% { opacity: 0; transform: translateX(calc(100vw + 200%)) skewX(-22deg); }
}

@media (max-width: 991px) {
    /* Logo and menu share one short app-style bar. */
    body.page-liverates #header .headImg > .container > .row {
        margin: 0;
        min-height: 76px;
    }

    body.page-liverates #header .headImg .row > .col-md-3:first-child {
        display: none;
    }

    body.page-liverates #header #iconimage {
        flex: 0 0 100%;
        max-width: 100%;
        padding: 0 60px;
    }

    body.page-liverates #header #iconimage .LogoImgWidth1 {
        width: 110px;
    }

    body.page-liverates #header .naviRow {
        position: static;
        min-height: 0;
        border-top: 0;
    }

    body.page-liverates #header .naviRow > .container {
        position: static;
    }

    body.page-liverates #header .header-btn-collapse-nav {
        position: absolute;
        top: 20px;
        right: 12px;
        width: 44px;
        height: 44px;
        margin: 0 !important;
        padding: 8px;
    }

    body.page-liverates #header .header-nav-main nav > ul > li > a {
        min-height: 44px;
    }

    body.page-liverates #header.gold-fixed-header > .header-body {
        max-height: calc(100vh - 72px);
        max-height: calc(100svh - 72px);
        overflow: visible;
    }

    body.page-liverates #header .header-nav-main nav {
        max-height: max(100px, calc(100vh - var(--liverates-header-height, 86px) - 88px));
        max-height: max(100px, calc(100svh - var(--liverates-header-height, 86px) - 88px));
        overflow-y: auto;
    }

    body.page-liverates .main > .section {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    body.page-liverates #my-tab > .swiper-pagination1 {
        margin-bottom: 10px !important;
    }

    body.page-liverates #my-tab > .swiper-pagination1 .swiper-pagination-bullet {
        display: flex;
        align-items: center;
        justify-content: center;
        white-space: nowrap;
        min-height: 44px;
        padding: 10px 2px;
        font-size: clamp(10px, 2.8vw, 12px) !important;
    }

    body.page-liverates .Trending_Table_Root > tbody > tr:nth-child(2) > td {
        padding-top: 12px !important;
    }

    body.page-liverates .table1001 {
        border-spacing: 3px 0;
    }

    body.page-liverates table.goldd tr:first-child td {
        white-space: nowrap;
        font-size: clamp(11px, 3vw, 14px);
        padding: 6px 2px !important;
    }

    body.page-liverates .top5span {
        font-size: clamp(18px, 5.2vw, 24px) !important;
        padding: 4px 2px !important;
        line-height: 1.25 !important;
    }

    body.page-liverates .GoldRtae2 td {
        padding: 0 1px 6px !important;
    }

    body.page-liverates :is(.bloc_GS, .bloc_GS1) {
        font-size: clamp(8px, 2.15vw, 11px) !important;
        margin: 0;
    }

    body.page-liverates .heading td,
    body.page-liverates #gvData_silvercoins th {
        padding: 8px 6px !important;
    }

    body.page-liverates .heading span,
    body.page-liverates .heading th {
        font-size: 12px !important;
    }

    body.page-liverates :is(.res_mob_font_width, .res_mob_font_width1, .res_mob_font_width2) > tbody > tr > td {
        padding: 8px 6px !important;
        vertical-align: middle;
    }

    body.page-liverates .rate-table-scroll :is(.tt_33, .heading, .res_mob_font_width, .res_mob_font_width1, .res_mob_font_width2) {
        margin: 0;
    }

    body.page-liverates .res_mob_font_width > tbody > tr > td:first-child {
        width: 50% !important;
        padding-left: 6px !important;
    }

    body.page-liverates .buy_sell_label,
    body.page-liverates #gvData_coins .buy_sell_label {
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    body.page-liverates .top55span {
        font-size: 18px !important;
        padding: 2px 1px !important;
        line-height: 1.25 !important;
    }

    body.page-liverates :is(.sell, .top66span) {
        font: 400 10px/1.4 Arial, sans-serif !important;
        padding-top: 2px;
    }

    body.page-liverates #gvData_silvercoins td {
        padding: 10px 6px;
        font-size: 13px;
    }

    body.page-liverates .silver-coins-panel {
        padding: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gold-rate-sweep { display: none; }
    .gold-rate-sweep::before { animation: none; }
}