.ibw-table-coins-main *,
.ibw-table-coins-main * ::before,
.ibw-table-coins-main * ::after {
    border-spacing: 0px;
    box-sizing: border-box;
}

.ibw-table-coins-main * a {
    text-decoration: none;
}

.ibw-table-coin {
    width: 100%;
    font-size: 14px;
    table-layout: auto;
    transform: translateZ(0px);

    border-collapse: separate;
    border-spacing: 0; line-height: 22px;}

tbody {
    outline-offset: -1px;
}

.ibw-table-coin th,
.ibw-table-coin td {
    border-bottom: 1px solid #f5f7fa !important;
    padding: 10px;
}

.ibw-table-coin td {
    border: none;
    border-bottom: 1px solid #f5f7fa;
    padding: 14px 0px;
    background-color: white;
    vertical-align: middle;
    text-align: right;
    white-space: nowrap;
    font-weight: 500;
}

.ibw-bold-text {
    color: var(--text-icon-fg-neutral-c, #525866);
    text-align: right;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    text-align: center;
    font-variation-settings: "wght" 500, "KSHD" 100;
}

.ibwSepratorLine {
    display: none;
    background: var(--Border-Neutral-B, #e1e4ea);
}

.ibw-green-percent-change {
    font-style: normal;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--text-icon-fg-success-c, #1fc16b);

    text-align: right;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    font-variation-settings: "wght" 500, "KSHD" 100;
    /*border-left: 1px solid #e1e4ea;*/
}

.ibw-red-percent-change {
    display: flex;
    justify-content: center;
    align-items: center;
    align-items: center;
    color: var(--text-icon-fg-error-c, #fb3748);
    text-align: right;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    font-variation-settings: "wght" 500, "KSHD" 100;
}

.ibw-silver-text {
    color: var(--text-icon-fg-neutral-c, #525866);
    text-align: center;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-variation-settings: "wght" 500, "KSHD" 100;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
}

.ibw-silver-text small {
    color: var(--text-icon-fg-neutral-e, #525866);
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    font-variation-settings: "wght" 500, "KSHD" 100;
    line-height: 20px;
}

.ibw-table-coin tr:not(:only-child):hover > td {
    background-color: rgb(248, 250, 253);
}

.ibw-table-coin tbody tr {
    contain-intrinsic-size: 60px;
}

.ibw-table-coin thead tr th:nth-child(2) {
    text-align: right;
}

.ibw-table-coin thead tr th,
.ibw-table-coin tbody tr td {
    text-align: center;
}

.ibw-table-coin thead tr th:nth-child(2) {
    text-align: right;
}

.ibw-coin-name-symbol {
    flex-direction: row;
    -moz-box-align: center;
    align-items: center;
}

.ibw-coin-name-symbol-main {
    display: flex;
    justify-content: flex-start;
    box-sizing: border-box;
    margin: 0px;
    padding-inline-start: 20px;
    -moz-box-align: center;
    align-items: center;
    overflow: hidden;
    gap: 8px;
}

.ibw-coin-name-symbol {
    box-sizing: border-box;
    margin: 0px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    overflow: hidden;
}

@media screen and (min-width: 768px) {
    .ibw-coin-name-symbol {
        flex-direction: column;
        -moz-box-align: center;
    }
}

.ibw-coin-name-symbol p {
    color: var(--text-icon-fg-neutral-c, #525866);
    text-align: right;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    white-space: initial;
    margin: 0px;
    padding: 0;
    font-variation-settings: "wght" 500, "KSHD" 100;
    margin-inline-start: 12px;
}

@media screen and (min-width: 768px) {
    .ibw-coin-name-symbol p {
        margin: 0px;
        line-height: 24px;
        text-overflow: ellipsis;
        overflow: hidden;
    }
}

.ibw-coin-name-symbol div {
    display: flex;
    flex-direction: row;
    -moz-box-align: center;
    align-items: center;
    margin: 0px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ibw-coin-symbol {
    color: var(--text-icon-fg-neutral-f, #99a0ae);
    text-align: right;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    font-variation-settings: "wght" 500, "KSHD" 100;
    margin: 0px;
    margin-inline-start: 6px;
}

.ibw-coin-img-name-symbol {
    box-sizing: border-box;
    margin: 0px;
    display: flex;
    align-items: center;
    -moz-box-align: center;
    align-items: center;
}

.ibw-coin-img-name-symbol a {
    padding: 0px 16px;
}

.ibwSepratorLineLeft {
    margin-right: auto;
    display: none;
}

.ibwHeaderTitle {
    display: flex;
    width: 100%;
    justify-content: center;
    cursor: pointer;
}

.ibwHeaderTitle svg,
.ibwHeaderTitle .ibw-sort-icon {
    flex-shrink: 0
}

.ibw-coin-logo {
    /* height: 24px !important; */
    /* width: 24px; */
    margin: 0 !important;
    border-radius: 12px;
    object-fit: cover;
}

.ibw-coin-logo--coin {
    max-width: 28px !important
}

.ibw-percent-change-svg-chart-green {
    filter: hue-rotate(85deg) saturate(80%) brightness(0.85);
}

.ibw-percent-change-svg-chart-red {
    filter: hue-rotate(300deg) saturate(210%) brightness(0.7) contrast(170%);
}

.ibw-mobile-rank-box {
    display: none !important;
    border-radius: 6px;
    padding: 0px 6px;
    font-size: 12px;
    background: rgb(239, 242, 245);
    margin-inline-start: 12px;
    color: rgb(88, 102, 126); line-height: 20px;}

@media (max-width: 780px) {
    .ibw-table-coin.ibw-table-coin thead tr th:nth-child(2),
    .ibw-table-coin.ibw-table-coin tbody tr td:nth-child(2) {
        /* position: sticky;
        right: 0;
        z-index: 1000;
        border-bottom: 1px solid #f5f7fa;
        box-shadow: -5px 0 5px rgba(0, 0, 0, 0.2); */
    }

    .ibw-table-coin.ibw-table-coin thead tr th:nth-child(2) {
        background: #185ADB;
    }

    .ibw-coin-name-symbol-main {
        gap: 8px;
        padding-inline-start: 0;
    }

    .ibw-coin-name-symbol {
        gap: 4px;
    }

    .ibw-coin-name-symbol p {
        text-align: center;
        margin-inline-start: 0 !important;
        font-size: 12px; line-height: 20px;}

    .ibw-table-coin thead {
        top: 0 !important;
    }

    .ibw-mobile-rank-symbol {
        display: flex;
        flex-direction: row;
        -moz-box-align: center;
        align-items: center;
    }

    .ibw-mobile-rank-box {
        display: none !important;
    }

    .ibw-coin-name-symbol div {
        white-space: initial;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 14px; line-height: 22px;}

    .ibw-table-coin tbody tr td:last-child,
    .ibw-table-coin thead tr th:last-child,
    .ibw-table-coin tbody tr td:nth-last-child(-n + 2),
    .ibw-table-coin thead tr th:nth-last-child(-n + 2) {
        display: none;
    }

    .ibw-pagination a:first-child,
    .ibw-pagination a:last-child {
        display: flex;
        align-items: center;
        gap: 4px;
    }

    .ibw-pagination a {
        font-size: 12px !important; line-height: 20px;}

    .ibw-pagination-text-next,
    .ibw-pagination-text-Previous {
        font-size: 12px !important; line-height: 20px;}

    .ibw-pagination strong {
        min-width: 26px !important;
        height: 26px !important;
    }
}

.ibw-pagination {
    display: flex;
    gap: 4px;
    height: 56px;
    justify-content: center;
    align-items: center;
    align-self: stretch;
    background: #fff;
    border-bottom-left-radius: var(--Radius-R6-12, 12px);
    border-bottom-right-radius: var(--Radius-R6-12, 12px);
    border-left: 1px solid var(--Border-Neutral-B, #e1e4ea);
    border-right: 1px solid var(--Border-Neutral-B, #e1e4ea);
    border-bottom: 1px solid var(--Border-Neutral-B, #e1e4ea);
}

.ibw-pagination a {
    text-decoration: none;
    display: flex;
    min-width: 32px;
    height: 32px;
    padding: var(--Spaces-S4-8, 8px);
    justify-content: center;
    align-items: center;
    gap: var(--Spaces-S6-12, 12px);
    color: var(--text-icon-fg-neutral-d, #525866);
    text-align: right;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F5-16, 16px);
    font-style: normal;
    font-weight: 400;
    font-variation-settings: "wght" 500, "KSHD" 100;
    line-height: 140%;
}

.ibwNumberCounter {
    color: var(--text-icon-fg-neutral-c, #525866);
    text-align: right;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    font-variation-settings: "wght" 500, "KSHD" 100;
}

.ibw-pagination a:hover {
    border-radius: 6px;
    background: var(--BG-Neutral-B, #f5f7fa);
}

.ibwModalSize {
    display: flex !important;
    width: 928px !important;
    height: 688px !important;
    flex-direction: column !important;
    align-items: flex-end;
    flex-shrink: 0;
}

.ibwCloseModal {
    border: none;
    background: none;
}

.ibwModalTitle {
    color: var(--text-icon-fg-neutral-b, #222530) !important;
    text-align: right;
    font-variation-settings: "wght" 500, "KSHD" 100 !important;
    font-family: var(--Typography-Font-family, "EstedadVF") !important;
    font-size: var(--Typography-Font-Size-F7-20, 20px);
    font-style: normal;
    font-weight: 400;
    line-height: 28px !important;
}

.ibw-pagination span {
    display: flex;
    width: 32px;
    height: 32px;
    padding: var(--Spaces-S4-8, 8px);
    justify-content: center;
    align-items: center;
    gap: var(--Spaces-S6-12, 12px);
    border-radius: 6px;
    background: var(--BG-Neutral-White, #fff);
    color: var(--text-icon-fg-neutral-f, #99a0ae);
    text-align: center;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F5-16, 16px);
    font-style: normal;
    font-weight: 400;
    font-variation-settings: "wght" 500, "KSHD" 100;
    line-height: 140%;
}

.ibw-pagination strong {
    display: flex;
    width: 32px;
    height: 32px;
    padding: var(--Spaces-S4-8, 8px);
    color: var(--text-icon-fg-neutral-white, #fff);
    text-align: right;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F5-16, 16px);
    font-style: normal;
    font-weight: 400;
    font-variation-settings: "wght" 500, "KSHD" 100;
    line-height: 140%;
    justify-content: center;
    align-items: center;
    -moz-box-pack: center;
    justify-content: center;
    -moz-box-align: center;
    align-items: center;
    border-radius: 6px;
    background: var(--BG-Brand-Blue-C---Main, #185adb);
    outline: 0px;
    cursor: pointer;
    user-select: none;
}

.ibw-pagination div {
    padding: 0.5em;
}

.ibw-pagination-text-next,
.ibw-pagination-text-Previous {
    border-radius: 6px;
    background: var(--BG-Neutral-White, #fff);
    display: flex;
    width: 32px;
    height: 32px;
    padding: var(--Spaces-S4-8, 8px);
    justify-content: center;
    align-items: center;
    gap: var(--Spaces-S6-12, 12px);
    vertical-align: middle;
    cursor: pointer;
}

.ibw-pagination-text-next {
    margin-inline-end: 5px;
}

.ibw-pagination-text-Previous {
    margin-inline-start: 5px;
}

.ibwTableOptions {
    display: flex;
    padding: var(--Spaces-S8-16, 16px) var(--Spaces-S10-20, 20px) var(--Spaces-S8-16, 16px) var(--Spaces-S8-16, 16px);
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: var(--Radius-R6-12, 12px);
    border: 1px solid var(--Border-Neutral-B, #e1e4ea);
    background: var(--BG-Neutral-White, #fff);
    margin-bottom: 16px;
}

.ibw-search-coin {
    position: relative;
    display: flex;
    height: 36px;
    padding: var(--Spaces-S4-8, 8px);
    justify-content: space-between;
    align-items: center;
    border-radius: var(--Radius-R4-8, 8px);
    border: 1px solid var(--Border-Neutral-C, #e1e4ea);
    background: var(--BG-Neutral-A, #f5f7fa);
}

.ibw-search-coin-modal {
    position: relative;
    width: 100%;
    display: flex;
    padding: var(--Spaces-S7-14, 14px) var(--Spaces-S8-16, 16px);
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: 8px;
    border: 1px solid var(--Border-Neutral-C, #e1e4ea);
    background: var(--BG-Neutral-A, #fff);
}

.ibw-modal__seprator {
    width: 100%;
    margin-top: 16px;
    margin-bottom: 16px;
    height: 1px;
    background: var(--Border-Neutral-C, #e1e4ea);
}

.ibwSearchInput:focus {
    border: none;
    outline: none;
}

.ibwCoinsTags {
    display: flex;
    align-items: center;
    gap: var(--Spaces-S11-24, 24px);
}

.ibwCoinsTags button {
    color: var(--text-icon-fg-neutral-e, #525866);
    text-align: right;
    border: none;
    white-space: nowrap;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F4-14, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    font-variation-settings: "wght" 500, "KSHD" 100;
    background-color: transparent;
}

.ibwCoinsTagActive {
    position: relative;
    color: var(--text-icon-fg-brand-blue-b-main, #185adb) !important;
    text-align: right;
    background-color: transparent;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F4-14, 14px);
    font-style: normal;
    transition: 0.3s all ease-in;
    font-weight: 400;
    font-variation-settings: "wght" 500, "KSHD" 100;
    line-height: 22px;
}

.ibwTagBorder::before {
    content: "";
    width: 100%;
    height: 2px;
    position: absolute;
    right: 0.5px;
    bottom: -23px;
    border-radius: 6px;
    background: var(--text-icon-fg-brand-blue-b-main, #185adb);
}

.ibw-modal-header-radius {
    padding: var(--Spaces-S11-24, 24px) !important;
    border-top-right-radius: 12px !important;
    border-top-left-radius: 12px !important;
}

.ibwSearchInput {
    border: none;
    background: transparent;
    overflow: hidden;
    color: var(--text-icon-fg-neutral-e, #525866);
    text-align: right;

    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F4-14, 14px);
    font-style: normal;
    font-weight: 400;
    font-feature-settings: "wght" 500;
    line-height: 22px;
}

.ibw-tags-dropdown-container {
    position: relative;
    display: inline-block;
    max-height: 40px;
}

.ibw-tags-dropdown-content {
    counter-reset: list-counter;
    display: flex;
    flex-direction: column;
    width: 100%;
    z-index: 1;
    padding: 0px !important;
    max-height: 408px;
    height: 408px;
    overflow-y: auto;
}

.ibw-tags-dropdown-content::-webkit-scrollbar {
    width: 0;
}

.ibw-list-sort {
    position: relative;
    display: flex;
    padding: var(--Spaces-S10-20, 20px) var(--Spaces-S11-24, 24px);
    align-items: center;
    gap: 16px;
    align-self: stretch;
    background: #fff;
    border-bottom: 1px solid #e1e4ea;
}

.ibwLinkWholeTag {
    position: absolute;
    z-index: 1000;
    width: 100%;
    height: 100%;
}

.ibw-list-sort:hover {
    color: var(--text-icon-fg-brand-blue-b-main, #185adb) !important;
    text-align: right;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F5-16, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    font-variation-settings: "wght" 500, "KSHD" 100;
}

.ibw-list-sort::before {
    counter-increment: list-counter;
    content: counter(list-counter) !important;
    display: flex;
    width: 32px;
    padding: 0px var(--Spaces-S8-16, 16px);
    justify-content: center;
    align-items: center;
    gap: var(--Spaces-S6-12, 12px);
    align-self: stretch;
    color: var(--text-icon-fg-neutral-d, #525866);
    text-align: right;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: 14px;
    font-style: normal;
    font-variation-settings: "wght" 500, "KSHD" 100;
    font-weight: 400;
    line-height: 22px;
}

.ibw-tags-dropdown-content a {
    text-decoration: none;
    color: var(--text-icon-fg-neutral-d, #525866);
    text-align: right;

    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F5-16, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: 26px;
    cursor: pointer;
    font-variation-settings: "wght" 500, "KSHD" 100;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.ibw-tags-dropdown-content a:hover {
    color: var(--text-icon-fg-brand-blue-b-main, #185adb);
}

#ibw-search-tags-input {
    width: 100%;
    color: var(--text-icon-fg-neutral-c, #525866);
    text-align: right;

    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F4-14, 14px);
    font-style: normal;
    font-weight: 400;
    font-variation-settings: "wght" 500, "KSHD" 100;
    line-height: 22px;
}

#ibw-tags-dropdown-button {
    cursor: pointer;
    -moz-box-align: center;
    -moz-box-pack: center;
    display: flex;
    padding: var(--Spaces-S4-8, 8px) var(--Spaces-S11-24, 24px);
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: var(--Radius-R3-6, 6px);
    border: 1px solid var(--Border-Neutral-C, #e1e4ea);
    background: var(--BG-Neutral-A, #f5f7fa);
    color: var(--text-icon-fg-neutral-d, #525866);
    white-space: nowrap;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F4-14, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    font-variation-settings: "wght" 500, "KSHD" 100;
}

@media only screen and (max-width: 600px) {
    .ibw-container-table {
        overflow: scroll;
    }

    .ibwCoinsTags {
        justify-content: flex-start;
    }

    .ibw-tags-dropdown-container,
    .ibw-search-coin {
        margin-left: 10px;
    }

    .ibw-coin-name-symbol p:not(:last-child) {
        margin-bottom: 0 !important;
    }
}

@media only screen and (max-width: 1400px) {
    .ibwTableOptions {
        width: 100%;
        overflow-x: scroll;
    }

    #ibw-coins-table-data {
        width: 100%;
        overflow: auto;
    }

    .ibw-coin-img-name-symbol a {
        padding: 0
    }
    .ibw-coin-name-symbol p {
        white-space: nowrap;
    }

}

@media (max-width: 768px) {
    #sortModal .modal-dialog {
        align-items: end;
        height: 100%;
    }
}

/* ─── Coin name truncation (single line + native tooltip on hover) ────── */
/* High specificity to override `.ibw-coin-name-symbol p { white-space: initial; }` */
.ibw-coin-name-symbol p.ibw-coin-name-text,
.ibw-coin-name-symbol .ibw-coin-name-text {
    display: block !important;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap !important;
    cursor: default;
}

/* ─── Buy/Sell CTA button (replaces old exchange-logos column) ─────────── */
a.ibw-coin-cta-btn,
.ibw-coin-cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 16px;
    background-color: #185adb;
    color: #ffffff !important;
    border: 1px solid #185adb;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 0.18s, transform 0.15s, box-shadow 0.18s;
}

a.ibw-coin-cta-btn:hover,
a.ibw-coin-cta-btn:focus,
a.ibw-coin-cta-btn:visited,
.ibw-coin-cta-btn:hover,
.ibw-coin-cta-btn:focus {
    background-color: #1b428d;
    color: #ffffff !important;
    text-decoration: none;
    box-shadow: 0 4px 14px rgba(24, 90, 219, 0.25);
    transform: translateY(-1px);
}

@media (max-width: 800px) {
    .ibw-coin-name-symbol p.ibw-coin-name-text,
    .ibw-coin-name-symbol .ibw-coin-name-text { max-width: 130px; }
    .ibw-coin-cta-btn { padding: 6px 12px; font-size: 12px; line-height: 20px;}
}
.ibw-btn-text-open { display: none; }

.crypto-page {
    display: flex;
    padding: var(--Spaces-S0-0, 0px);
    flex-direction: column;
    gap: var(--Spaces-S15-40, 40px);
    background: var(--BG-Neutral-White, #fff);
}

.ibw-coin-description .contentstyle {
    font-size: 18px;
    line-height: 30px;
    color: #0e121b;
    font-weight: 400;
    font-variation-settings: "wght" 400, "KSHD" 100;
    word-break: break-word;
}

.crypto-page__chart {
    display: flex;
    gap: 0 40px;
    padding-bottom: 40px
}

.crypto-page__chart-main {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 32px;
    min-width: 0;
}

.ibw-coin-price-percent-change img {
    display: none !important;
}

.crypto-page__chart-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 32px
}

.crypto-page__tab-header {
    display: flex;
    align-items: center;
    gap: 24px;
    border-bottom: 1px solid #e1e4ea;
    padding-bottom: 20px;
    overflow: auto;
}

.crypto-page__tab-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 !important;
    color: #525866;
    font-size: 16px;
    white-space: nowrap;
    flex-shrink: 0; line-height: 26px;}

.crypto-page__tab-item svg {
    width: 20px;
    height: 20px;
}

.crypto-page__change-table-container {
    border: 1px solid #e1e4ea;
    border-radius: 12px;
    overflow: hidden;
}

.crypto-page__change-table {
    width: 100%
}

.crypto-page__change-table tbody tr:nth-child(odd) {
    border: none;
    background-color: #fff !important;
}

.crypto-page__change-table tbody {
    background: #fff;
}

.crypto-page__change-table thead {
    background: #f5f7fa;
}

.crypto-page__change-table thead tr {
    color: #525866;
    font-size: 14px; line-height: 22px;}

.crypto-page__change-table thead th,
.crypto-page__change-table tbody td {
    text-align: center;
}

.crypto-page__change-table tbody tr,
.crypto-page__change-table tbody td {
    font-size: 14px !important; line-height: 22px;}

.ibwGreenPc {
    color: #04a448 !important
}

.ibwReadPc {
    color: #f5222d !important
}

.crypto-page__change-table thead th:after {
    content: unset !important;
}

.crypto-page__coin-price-table tbody tr td {
    padding: 20px 16px
}

.crypto-page__coin-price-table tbody tr td:first-child {
    padding-right: 0
}

.crypto-page__coin-price-table tbody tr td:last-child {
    padding-left: 0;
}

.crypto-page__coin-price-table tbody tr td:nth-last-child(2):after {
    content: unset !important;
}

.crypto-page__coin-price-table .ibwExchangeButton {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 12px
}

.crypto-page__coin-price-table .ibwExchangeButton button {
    border-radius: 8px;
    padding: 6px 8px;
    border: 1px solid #e1e4ea;
    color: #525866;
    font-size: 14px; line-height: 22px;}

.crypto-page__coin-price-table .ibwCustomLink {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #525866; line-height: 22px;}

.crypto-page__coin-price-table .ibwCustomLink img {
    width: 20px;
    height: 20px;
}

.crypto-page__coin-price-table thead th {
    color: #99a0ae;
    font-size: 14px;
    line-height: 22px;
    padding: 0 !important;
    padding-bottom: 20px !important
}

.crypto-page__coin-price-table {
    width: 100%;
}

.crypto-page__coin-price-table {
    width: 100%
}

.crypto-page__coin-price-table tbody tr:nth-child(odd), .crypto-page__coin-price-table tbody tr:nth-child(even) {
    border: none;
    border-top: 1px solid #f5f7fa;
    background-color: #fff !important;
}

.crypto-page__coin-price-table tbody tr:last-child {
    border-bottom: 1px solid #f5f7fa;

}

.crypto-page__coin-price-table tbody tr {
    border-top: 1px solid #f5f7fa
}

.crypto-page__coin-price-table tbody {
    background: #fff;
}

.crypto-page__coin-price-table thead {
    background: #fff;
}

.crypto-page__coin-price-table thead tr {
    color: #525866;
    font-size: 14px; line-height: 22px;}

.crypto-page__coin-price-table thead tr label {
    white-space: nowrap;
}

.crypto-page__coin-price-table tbody tr,
.crypto-page__coin-price-table tbody td {
    font-size: 14px !important; line-height: 22px;}

.crypto-page__chart-side {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 48px;
    flex-shrink: 0;
    width: 360px;
    padding-left: 40px;
    border-left: 1px solid #e1e4ea
}

.crypto-page__chart-sidetop {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--Spaces-S12-28, 28px);
    align-self: stretch;
}

.crypto-page__chart-sidetop-upper {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--Spaces-S13-32, 32px);
    align-self: stretch;
}

.crypto-page__chart-coin {
    display: flex;
    align-items: center;
    gap: 20px;
}

.crypto-page__chart-coin img {
    width: 60px;
    height: 60px;
    border-radius: 999px;
    background: url(<path-to-image>) lightgray 50% / cover no-repeat;
}

.crypto-page__chart-coin-about {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.crypto-page__chart-coin-about-head {
    display: flex;
    align-items: center;
    gap: var(--Spaces-S6-12, 12px);
}

.crypto-page__chart-coin-about-head span {
    color: #0e121b;
    text-align: right;
    font-size: 24px;
    font-style: normal;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
    line-height: 32px
}

.crypto-page__chart-coin-about-number {
    display: flex;
    padding: 4px 8px;
    justify-content: center;
    align-items: center;
    border-radius: 999px;
    background: #e1e4ea;
    color: #525866;

}

.crypto-page__chart-coin-about p {
    color: #525866;
    text-align: right;
    margin: 0;
    padding: 0;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px}

.crypto-page__chart-price {
    display: flex;
    flex-direction: column;
    gap: 12px;
    /*width: 100%*/
}

.crypto-page__chart-price > div:first-child {
    display: flex;
    align-items: center;
    gap: 16px
}

.crypto-page__chart-price > div > div {
    display: flex;
    padding: 4px 8px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: #e0faec;
    color: #1fc16b;
    font-size: 14px; line-height: 22px;}

.crypto-page__chart-price span {
    color: #0e121b;
    font-size: 24px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100; line-height: 32px;}

.crypto-page__chart-price-tag {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #525866;
    font-size: 16px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100; line-height: 26px;}

.crypto-page__button-right {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
    background-color: transparent;
    border: 1px solid #e1e4ea;
    border-radius: 0 12px 12px 0;
    color: #222530;
    font-size: 16px;
    line-height: 26px}

.crypto-chart-buttons {
    display: flex;
    align-items: flex-start;
    gap: var(--Spaces-S8-16, 16px);
    align-self: stretch;
}

.crypto-chart-buy {
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    padding: 14px;
    flex: 1 0 0;
    border-radius: 8px;
    background: #185adb;
    color: #fff !important;
    font-size: 14px; line-height: 22px;}

.crypto-chart-sell {
    display: flex;
    border: none;
    padding: 14px;
    justify-content: center;
    align-items: center;
    flex: 1 0 0;
    border-radius: 8px;
    background: #1fc16b;
    color: #fff !important;
    font-size: 14px; line-height: 22px;}

.crypto-page__chart-sidetop-lower {
    display: flex;
    width: 100%;
    flex-direction: column;
}

.crypto-page__chart-sidetop-lower-cell {
    padding: 16px 0;
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #f5f7fa;
    gap: 8px;
}

.crypto-page__chart-sidetop-lower-cell:first-child {
    padding-top: 0
}

.crypto-page__chart-sidetop-lower-cell:last-child {
    border-bottom: none
}

.crypto-page__chart-sidetop-lower-cell p {
    margin: 0;
    color: #525866;
    padding: 0 !important;
    font-size: 14px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100; line-height: 22px;}

.crypto-page__chart-sidetop-lower-cell div {
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
    display: flex;
    gap: 4px;
    align-items: center;
    color: #99a0ae;
    font-size: 14px; line-height: 22px;}

.crypto-page__chart-sidebottom-upper {
    display: flex;
    padding-top: 32px;
    flex-direction: column;
    align-items: start;
    gap: 20px;
    width: 100%
}

.crypto-page__chart-sidebottom-upper-data {
    display: flex;
    width: 100%;
    flex-direction: column;
}

.crypto-page__chart-sidebottom-upper-title {
    color: #0e121b !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    font-variation-settings: "wght" 500, "KSHD" 100 !important; line-height: 28px;}

.crypto-page__chart-sidebottom-upper-cell {
    padding: 16px 0;
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #f5f7fa;
    gap: 8px;
    align-self: stretch;
}

.crypto-page__chart-sidebottom-upper-cell:first-child {
    padding-top: 0
}

.crypto-page__chart-sidebottom-upper-cell:last-child {
    padding-bottom: 0;
    border-bottom: none
}

.crypto-page__chart-sidebottom-upper-cell p {
    color: #525866;
    margin: 0;
    padding: 0 !important;
    font-size: 14px;
    font-weight: 500 !important;
    font-variation-settings: "wght" 500, "KSHD" 100 !important; line-height: 22px;}

.crypto-page__chart-sidebottom-upper-cell .sidebarTag {
    display: flex;
    padding: 0 6px;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
    background: #f5f7fa;
    color: #525866;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
    line-height: 20px;
    transition: all .3s
}

.crypto-page__chart-sidebottom-upper-cell .sidebarTag:hover {
    background: #e1e4ea;
}

.crypto-page__social-media-conainer {
    display: flex;
    align-items: center;
    gap: 8px
}

.crypto-page__swap {
    display: flex;
    width: 100%;
    align-items: stretch;
}

.crypto-page__chart-sidebottom-lower {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.crypto-page-button-size {
    width: 100%;
}

.crypto-page-button-size .dropdown-toggle {
    padding: 16px 16px 16px 20px
}

.crypto-page-button-size .dropdown-toggle::after {
    content: unset;
}

.crypto-page__chart-view {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 80px;
}

.crypto-page__chart-view-title {
    display: flex;
    position: relative;
    padding-right: 20px;
    margin-bottom: 24px;
}

.crypto-page__chart-view-title span {
    color: #0e121b;
    font-size: 20px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100; line-height: 28px;}

.crypto-page__chart-view__bluereq {
    width: 4px;
    height: 16px;
    right: 0;
    top: 50%;
    position: absolute;
    transform: translateY(-50%);
    border-radius: 6px;
    background: #185adb;
}

.crypto-page__chart-trading {
    width: 100%;
    display: flex;
    height: 728px;
    padding: var(--Spaces-S6-12, 12px);
    flex-direction: column;

    gap: 8px;
}

.crypto-page__chart-trading-chart {
    width: 100%;
    height: 100%;
    padding: 12px;
    border-radius: 12px;
    border: 1px solid #e1e4ea;

}

.crypto-page__text {
    color: #525866;
    text-align: right;
    margin: 0;
    padding: 0 !important;
    font-size: 14px;
    line-height: 22px}

.crypto-page__list {
    display: flex;
    flex-direction: column;
    gap: var(--Spaces-S8-16, 16px);
    /* Prevent flex/grid children from blowing out the column width
       (e.g. the wallets carousel with 12 cards of 300px each). */
    min-width: 0;
    width: 100%;
    max-width: 100%;
}
.crypto-page,
.crypto-page > * {
    min-width: 0;
    max-width: 100%;
}

.crypto-page__list-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.crypto-page__card {
    display: flex;
    /*width: 318px;*/
    padding: var(--Spaces-S11-24, 24px);
    flex-direction: column;
    align-items: center;
    gap: var(--Spaces-S10-20, 20px);
    border-radius: var(--Radius-R6-12, 12px);
    border: 1px solid var(--Border-Neutral-B, #e1e4ea);
    background: var(--BG-Neutral-White, #fff);
}

.crypto-page__card-data {
    display: flex;
    flex-direction: column;
    width: 100%;
    align-items: flex-start;
    gap: var(--Spaces-S6-12, 12px);
    align-self: stretch;
}

.crypto-page__card-header {
    width: 100%;
    display: flex;
    padding-bottom: 4px;
    justify-content: flex-end;
    align-items: center;
}

.crypto-page__card-header a {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    text-align: right;
}

.crypto-page__card-header > img {
    width: 48px;
    height: 48px;
    border-radius: 50%;
}

.crypto-page__card-part {
    display: flex;
    width: 100%;
    gap: 20px;
    justify-content: space-between;
    align-items: center;
    gap: var(--Spaces-S4-8, 8px);
    align-self: stretch;
}

.crypto-page__card-data-text {
    color: var(--text-icon-fg-neutral-e, #525866);
    text-align: right;
    /* Body/B3 */
    width: 30%;
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F4-14, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: 22px; /* 142.857% */
}

.crypto-page__card-data-title-more {
    color: var(--text-icon-fg-neutral-e, #525866);
    text-align: right;
    /* Body/B3 */
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F4-14, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: 22px; /* 142.857% */
}

.crypto-page__card-data-progress {
    color: var(--text-icon-fg-neutral-e, #525866);
    text-align: right;
    display: flex;
    white-space: nowrap;
    align-items: center;
    width: 100%;
    gap: 8px;
    /* Body/B3 */
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F4-14, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: 22px; /* 142.857% */
}

.forex-faq {
    display: flex;
    max-width: 800px;
    margin: auto auto;
    padding: 80px 0;
    flex-direction: column;
    align-items: center;
    justify-items: center;
    gap: 32px;
}

.forex-faq__title {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    color: #0e121b;
    font-size: 32px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
    line-height: 40px
}

.forex-faq__q-each {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #222530;
    cursor: pointer;
    font-size: 16px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
    line-height: 26px}

.ibw-faq {
    padding: 24px 0;
}

.ibw-faq:not(:last-child) {
    border-bottom: 1px solid #e1e4ea;
}

.ibw-faq.open .forex-faq__q-each {
    margin-bottom: 8px
}

.forex-faq__q-each-answer {
    overflow: hidden;
    color: #525866;
    height: 0;
    /*transition: all 0.3s;*/
    font-size: 14px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
    line-height: 22px}

.ibw-faq-icon {
    font-size: 24px; line-height: 32px;}

.ibw-faq.open .forex-faq__q-each-answer {
    height: 100%
}

.forex-user-ex__title {
    display: flex;
    padding: var(--Spaces-S10-20, 20px);
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    border-radius: var(--Radius-R6-12, 12px);
    border: 1px solid var(--Border-Neutral-B, #e1e4ea);
    background: var(--BG-Neutral-White, #fff);
    margin-top: 54px;
}

.forex-user-ex__textarea-replay {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: flex-end;
    gap: var(--Spaces-S10-20, 20px);
    border-radius: 12px;
    background: var(--BG-Neutral-White, #fff);
}

.forex-user-ex__title-sort {
    display: flex;
    align-items: center;
    gap: var(--Spaces-S8-16, 16px);
}

.forex-user-ex__title-sort-divider {
    width: 1px;
    height: 20px;
    background: var(--Border-Neutral-C, #e1e4ea);
}

.forex-user-ex__title-sort-number {
    color: var(--text-icon-fg-neutral-e, #525866);
    text-align: right;

    /* Subtitle/S2 */
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F5-16, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: 26px; /* 125% */
}

.crypto-page__card-header-text {
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: space-between;
    gap: 4px;
    color: #525866;
}

.crypto-page__card-header-text p {
    color: var(--text-icon-fg-neutral-c, #525866);
    text-align: right;
    margin: 0;
    /* Headline/H7 */
    font-family: var(--Typography-Font-family, "EstedadVF");
    font-size: var(--Typography-Font-Size-F5-16, 16px);
    font-style: normal;
    font-weight: 400;
    line-height: 26px; /* 125% */
}

.crypto-page__card-header-text span {
    color: #525866;
    font-size: 14px;

    a {
        color: inherit;
    }
}

.crypto-page__card-divider {
    background: var(--Border-Neutral-B, #e1e4ea);
    width: 100%;
    height: 1px;
}

.crypto-page__content {
    border-radius: 12px;
    border: 1px solid #e1e4ea;
    background: #f5f7fa;
    padding: 24px 24px 48px;
    height: 1000px;
    overflow: hidden;
    position: relative;
    transition: all 0.3s
}

.crypto-page__content.no-toggle {
    height: auto;
    overflow: visible;
    padding-bottom: 24px;
}

.crypto-page__content.showContent {
    height: 100%;
}

.crypto-page__content .read-more-container {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    display: flex;
    align-items: end;
    justify-content: center;
    gap: 4px;
    min-height: 200px;
    padding-bottom: 10px;
    background: linear-gradient(0deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
}

.crypto-page__content .read-more-container button {
    display: flex;
    align-items: end;
    justify-content: center;
    gap: 4px;
}

.crypto-page__progress {
    width: 100%;
    height: 4px;
    flex-direction: row-reverse;
}

.crypto-page__progress {
    width: 100%;
    height: 4px;
}

.crypto-page__progress .progress-bar {
    border-radius: 6px;
}

.tab__price-list {
    width: fit-content;
    padding: 2px !important;
    border-radius: 8px;
    margin: 0 !important;
    background: #f5f7fa;
    border: 1px solid transparent;
    list-style-type: none !important;
    margin-bottom: 32px !important;
    gap: 2px;
    line-height: unset !important;
}

.tab__price-list li {
    padding: 0 !important;
    margin: 0 !important;
    line-height: unset !important;
}

.tab__price-list li button {
    color: #525866 !important;
    font-size: 14px !important;
    border-radius: 6px;
    border: 1px solid transparent !important;
    transition: all 0.3s;
    padding: 4px 8px;
    line-height: 22px;
}

.tab__price-list li button.active {
    background-color: #fff !important;
    color: #525866 !important;

}

.crypto-page__chart-sidebottom-upper-cell .single-page__sidebar__dropdown {
    position: relative;
}

.crypto-page__chart-sidebottom-upper-cell .single-page__sidebar__dropdown .dropdown-menu {
    position: absolute;
    padding: 0;
    margin: 0;
    top: 100%;
    background: transparent;
    box-shadow: none;
    border: none

    /*transform: translateY(10px);*/
}

.crypto-page__chart-sidebottom-upper-cell .single-page__sidebar__dropdown .dropdown-menu .dropdown-list {
    background: #fff;
    padding: 4px;
    padding-left: 4px !important;
    margin: 0;
    list-style-type: none;
    border-radius: 8px;
    border: 1px solid #e1e4ea;
}

.crypto-page__chart-sidebottom-upper-cell .single-page__sidebar__dropdown .dropdown-menu .dropdown-list li {
    text-align: left !important;
    /*padding: 0;*/
    margin-top: 0;
    border-radius: 6px;
    padding: 6px 8px;
    transition: all 0.3s;
}

.crypto-page__chart-sidebottom-upper-cell .single-page__sidebar__dropdown .dropdown-menu .dropdown-list li:hover {
    background: #f5f7fa;
}

.crypto-page__chart-sidebottom-upper-cell .single-page__sidebar__dropdown .dropdown-menu .dropdown-list li a {
    font-size: 14px;
    color: #525866;
    line-height: 22px;
    background: transparent !important;
}

.single-page__sidebar__dropdown .dropdown-toggle:after {
    content: unset;
}

.crypto-page__chart-sidebottom-upper-cell .sidebarTag.btn-show-more {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2px !important
}

.crypto-page__chart-sidebottom-upper-cell .sidebarTag .btn {
    padding: 0 !important;
    width: 100%;
    line-height: 100% !important;
    height: 100%;
}

.crypto-page__chart-sidebottom-upper-cell .sidebarTag.btn-show-more svg {
    width: 100%;
    height: 100%;
    color: inherit;
}

.tag-modal {

    background: rgba(15, 23, 42, 0.50);
    backdrop-filter: blur(12px);
}

.tag-modal p {
    padding: 0;
    margin: 0
}

.tag-modal .modal-body {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    padding: 24px !important
}

.tag-modal .modal-content .modal-header .btn-close {
    margin: 0;
    padding: 0
}

.tag-modal .modal-content {
    border-radius: 12px;
    border: none
}

.tag-modal .modal-content .modal-header {
    border-bottom: 1px solid #e1e4ea;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    padding: 24px !important
}

.tag-modal .tag-modal__tag {
    flex-shrink: 0;
    padding: 0 6px;
    border-radius: 8px;
    background: #f5f7fa;
    color: #525866;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
    line-height: 20px;
    transition: all .3s
}

.crypto_calculator {
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding-top: 8px
}

.crypto_calculator__title {
    margin: 0;
    padding: 0 !important;
    font-size: 20px !important;
    line-height: 28px !important;
    font-weight: 500 !important;
    font-variation-settings: "wght" 500, "KSHD" 100 !important;
}

.crypto_calculator__swap-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: relative;
}

.crypto-page__swap-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    display: flex;
    padding: 12px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid #e1e4ea;
    z-index: 3;
    box-shadow: 0 0 0 6px #fff;
}

.crypto_calculator__input-container {
    height: 100%;

}

.crypto_calculator__input-container input {
    box-shadow: none !important;
    outline: none !important;
    border: 1px solid #e1e4ea;
    border-radius: 12px 0 0 12px;
    height: 100%;
    direction: ltr;
    font-size: 16px;
    color: #222530;
    line-height: 26px}

.crypto_calculator .dropdown-menu {
    max-height: 220px !important;
    overflow: auto;
    list-style-type: none;
    scrollbar-color: transparent transparent;
    scrollbar-width: none;
    border: 1px solid #e1e4ea;
    padding: 0;
    margin: 0;
    border-radius: 12px;
}

.crypto_calculator .dropdown-menu .form-control {
    border: none;
    outline: none;
    box-shadow: none;
    border-radius: 0;
    direction: ltr;
    padding: 16px 16px;
    border-bottom: 1px solid #e1e4ea;
    color: #222530
}

.crypto_calculator .dropdown-menu .form-control::placeholder {
    color: #cacfd8
}

.crypto_calculator .dropdown-menu li {
    direction: ltr;
    padding: 0;
    margin: 0 0 4px;
    color: #525866;
    font-size: 16px;
    line-height: 26px}

.crypto_calculator .dropdown-menu li:first-child {
    margin: 0;
    padding: 0
}

.crypto_calculator .dropdown-menu li button {
    margin: 0;
    width: 100%;
    height: 100%;
    text-align: left;
    border-radius: 6px;
    padding: 8px 12px;
    transition: all 0.3s;
}

.crypto_calculator .dropdown-menu li button:hover,
.crypto_calculator .dropdown-menu li.active-currency button {
    background: #f5f7fa;
}

.crypto-page__dropdown-container {
    display: flex;
    align-items: center;
    gap: 8px
}

.crypto-page__dropdown-img {
    width: 16px !important;
    height: 16px !important;
}

.crypto-page__chart-sidetop-info {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 24px}

@media (max-width: 768px) {
    .crypto-page__chart {
        flex-direction: column;
    }

    .crypto-page__tab-header {
        overflow: auto;
        scrollbar-color: transparent transparent;
        scrollbar-width: none;
    }

    .crypto-page__tab-item {
        white-space: nowrap;
    }

    .crypto-page__chart-side {
        width: 100%;
        padding-left: unset;
        border-left: unset;
    }

    .crypto_calculator__input-container input {
        padding: 16px 16px 16px 20px
    }

    .crypto-page__button-right {
        height: 100%
    }

    .crypto-page__coin-price-table tbody tr {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
        padding: 20px 0
    }

    .crypto-page__coin-price-table tbody tr td:first-child {
        grid-area: 1 / 1 / 2 / 3;
    }

    .crypto-page__coin-price-table tbody tr td:last-child {
        grid-area: 4 / 1 / 5 / 3;
    }

    .crypto-page__coin-price-table tbody tr td:after {
        content: unset !important;
    }

    .crypto-page__coin-price-table .ibwExchangeButton {
        justify-content: start;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 16px
    }

    .crypto-page__coin-price-table thead {
        display: none;
    }

    .crypto-page__coin-price-table tbody tr td {
        padding: 0;

    }

    .crypto-page__coin-price-table tbody tr p {
        padding: 0 !important;
        font-size: 12px;
        color: #99a0ae;
        line-height: 20px;
    }

    .crypto-page__coin-price-table tbody tr td > div {
        display: flex;
        gap: 4px;
        font-size: 14px;
        line-height: 22px;
        margin-top: 4px
    }

    .crypto-page__chart-trading {
        height: 600px;
        padding: 0
    }

    .crypto-page__chart-trading.analysis {
        height: 1250px;
    }

    .crypto-page__list-grid {
        grid-template-columns: repeat(1, 1fr);
    }

    .crypto-page__chart-sidetop-upper {
        padding-top: 28px;
        border-top: 1px solid #e1e4ea;
        gap: 24px}

    .crypto-page__chart-coin-about-head span {
        font-size: 24px;
        line-height: 32px;
    }

    .crypto-page__chart-coin-about-number {
        font-size: 14px; line-height: 22px;}

    .crypto-page__chart-coin {
        gap: 16px
    }

    .crypto-page__chart-price {
        width: 100%;
        align-items: end
    }

    .crypto-page__chart-price > div:first-child {
        flex-direction: row-reverse;
    }

    .crypto-page__chart-price span {
        font-size: 24px;
        line-height: 32px;
    }

    .crypto-page__chart-price-tag {
        flex-direction: row-reverse;
    }

    .crypto-page__chart-sidebottom-upper {
        padding-top: 12px
    }

    .crypto-page__chart-sidebottom-upper-cell:first-child {
        padding-top: 0
    }

    .crypto-page__chart-sidetop {
        gap: 40px
    }

    .crypto_calculator {
        margin-top: 0 !important;
        padding-top: 24px !important;
        padding-bottom: 40px !important;

    }

    .crypto-page__coin-price-table .ibwCustomLink {
        display: flex;
        align-items: center;
    }

    .crypto-page__chart-view {
        gap: 40px
    }

    .crypto-page__chart-view-title {
        margin-bottom: 16px
    }

    .crypto-page__card-header-text {
        gap: 8px;
    }

    .crypto-page__card-header-text a {
        color: inherit !important;
        line-height: 26px;
        font-size: 16px
    }

    .crypto-page__card-header-text span {
        line-height: 22px;
        font-size: 14px
    }

    .crypto-page__change-table-container {
        overflow: auto;
        scrollbar-width: none;
        scrollbar-color: transparent transparent;
    }

    .forex-faq {
        gap: 24px;
        padding: 64px 0
    }

    .forex-faq__title {
        gap: 12px;
        margin-top: 0 !important;
        font-size: 20px !important; line-height: 28px;}

    .ibw-faq {
        padding: 20px 0;
    }

    .forex-faq__q-each {
        font-size: 14px;
        line-height: 22px}

    .ibw-faq.open .forex-faq__q-each-answer {
        font-size: 12px;
        line-height: 20px;
    }

    .crypto-page__chart-sidetop-lower {
        gap: 20px
    }

    .tag-modal .modal-dialog {
        height: 100%;
        margin: 0;
    }

    .tag-modal .modal-dialog .modal-content {
        position: absolute;
        width: 100%;
        bottom: 0;
        right: 0;
        border-radius: 12px 12px 0 0;
    }
}

@media (min-width: 769px) and (max-width: 1200px) {
    .crypto-page__chart {
        flex-direction: column;
    }

    .crypto-page__chart-side {
        width: 100%;
        border-left: unset;
        padding-left: unset;
        padding-bottom: 40px
    }

    .crypto-page__chart-sidetop-upper {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 32px 16px
    }

    .crypto-page__chart-sidetop-upper > div:first-child {
        grid-area: 1 / 1 / 2 / 2;
    }

    .crypto-page__chart-sidetop-upper > div:nth-child(2) {
        grid-area: 1 / 2 / 2 / 3;
    }

    .crypto-page__chart-sidetop-upper > div:nth-child(3) {
        grid-area: 2 / 1 / 3 / 3;
    }

    .crypto-page__chart-sidetop-upper > div:nth-child(4) {
        grid-area: 3 / 1 / 4 / 3;
    }

    .crypto-page__chart-sidetop-upper > div:nth-child(5) {
        grid-area: 4 / 1 / 5 / 3;
    }

    .crypto-page__chart-coin {
        justify-content: start;
    }

    .crypto-page__chart-coin-about {
        flex-grow: 1;
    }

    .crypto-page__chart-price {
        align-items: end;
    }

    .crypto-page__chart-sidetop {
        gap: 40px
    }

    .crypto-page__chart-sidetop-info {
        display: grid;
        gap: 40px;
        grid-template-columns: repeat(2, 1fr);
    }

    .crypto-page__chart-sidebottom-upper {
        padding-top: 0
    }

    .crypto-page__chart-sidetop-lower {
        gap: 20px
    }

    .crypto-page__tab-header {
        overflow: auto;
        scrollbar-color: transparent transparent;
        scrollbar-width: none;
    }

    .crypto-page__tab-item {
        white-space: nowrap;
    }

    .crypto-page__swap {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .crypto-page__change-table-container {
        overflow: auto;
        scrollbar-color: transparent transparent;
        scrollbar-width: none;
    }

    .crypto-page__coin-price-table {
        overflow: auto;
        scrollbar-color: transparent transparent;
        scrollbar-width: none;
    }

    .crypto-page__coin-price-table .ibwCustomLink > div:first-child {
        width: 20px;
    }

    .crypto-page__coin-price-table .ibwExchangeButton button {
        flex-shrink: 0;
        display: block
    }

    .crypto-page__list-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .crypto-page__chart-trading {
        height: 500px
    }

    .crypto-page__chart-trading.analysis {
        height: 1300px

    }

    .crypto-page__coin-price-table .ibwExchangeButton {
        margin-right: 20px;
    }
}

@media (min-width: 1201px) {
    .single-page__sidebar__dropdown:hover > .dropdown-menu {
        display: block;
    }

    .crypto-page__chart {
        align-items: flex-start;
    }

    .crypto-page__chart-side {
        position: sticky;
        top: 88px;
        align-self: flex-start;
        max-height: calc(100vh - 100px);
        overflow-y: auto;
        overflow-x: hidden;
        padding-bottom: 24px;
    }

    .crypto-page__chart-side::-webkit-scrollbar {
        width: 3px;
        height: 3px;
    }

    .crypto-page__chart-side::-webkit-scrollbar-thumb {
        background-color: rgba(148, 163, 184, 0.18);
        border-radius: 999px;
        transition: background-color 0.2s;
    }

    .crypto-page__chart-side:hover::-webkit-scrollbar-thumb,
    .crypto-page__chart-side::-webkit-scrollbar-thumb:hover {
        background-color: rgba(148, 163, 184, 0.5);
    }

    .crypto-page__chart-side::-webkit-scrollbar-track {
        background: transparent;
    }
}

/* ─── Community CTA (mirrors irb-forex-symbols design) ─────────────────── */
.ibw-community-cta-wrap {
    margin: 18px 0 24px;
}
.ibw-community-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 1.1rem 1.4rem;
    background: #fff;
    border: 1px solid #e1e4ea;
    border-right: 4px solid #185adb;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(32,113,240,.09);
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.18s, background 0.18s, transform 0.15s;
}
.ibw-community-cta:hover {
    background: #eff7ff;
    box-shadow: 0 6px 28px rgba(32,113,240,.16);
    transform: translateY(-1px);
    text-decoration: none;
    color: inherit;
}
.ibw-community-cta__body {
    display: flex;
    align-items: center;
    gap: 1rem;
    min-width: 0;
}
.ibw-community-cta__icon { flex-shrink: 0; }
.ibw-community-cta__body div {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.ibw-community-cta__body strong {
    font-size: 0.95rem;
    font-weight: 700;
    color: #0e121b;
    white-space: normal;
    line-height: 1.4;
}
.ibw-community-cta__body span {
    font-size: 0.8rem;
    color: #525866;
    line-height: 1.5;
}
.ibw-community-cta__action {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    padding: 0.5rem 1rem;
    background: #185adb;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #fff;
    white-space: nowrap;
    transition: background 0.15s;
}
.ibw-community-cta:hover .ibw-community-cta__action { background: #1a4ab3; }
@media (max-width: 600px) {
    .ibw-community-cta {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.85rem;
    }
    .ibw-community-cta__action { width: 100%; justify-content: center; }
}
@media (max-width: 500px) {
    .ibw-community-cta__body strong { font-size: 0.88rem; }
}

/* ─── News carousel (CSS scroll-snap; no JS library required) ───────── */
.ibw-news-section {
    margin: 32px 0;
    direction: rtl;
}
.ibw-news-section *,
.ibw-news-section *::before,
.ibw-news-section *::after { box-sizing: border-box; }

.ibw-news-section__header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}
.ibw-news-section__title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 16px;
    font-weight: 500;
    color: #222530;
    line-height: 1.5;
    letter-spacing: 0;
}
.ibw-news-section__bar {
    display: inline-block;
    width: 3px;
    height: 18px;
    border-radius: 999px;
    background: #185adb;
    flex-shrink: 0;
}
.ibw-news-section__more {
    margin-inline-start: auto;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #99a0ae;
    font-size: 12px;
    font-weight: 400;
    text-decoration: none;
    line-height: 1;
}
.ibw-news-section__more:hover {
    color: #185adb;
    text-decoration: none;
}
.ibw-news-section__more svg { display: inline-block; }

/* Viewport = position context for nav buttons */
.ibw-news-section__viewport {
    position: relative;
}

/* Horizontal scroll track */
.ibw-news-section__track {
    display: flex;
    flex-direction: row;
    gap: 16px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 4px 4px 12px;
    margin: -4px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
    cursor: grab;
}
.ibw-news-section__track::-webkit-scrollbar { display: none; }

/* Nav buttons */
.ibw-news-section__nav {
    position: absolute;
    top: 110px;                       /* roughly centered on the image area */
    z-index: 3;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #e1e4ea;
    background: #fff;
    color: #525866;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding: 0;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.10);
    transition: opacity .18s, background .18s, color .18s, transform .18s;
}
.ibw-news-section__nav:hover {
    background: #185adb;
    color: #fff;
    border-color: #185adb;
}
.ibw-news-section__nav--prev { right: -8px; }   /* RTL visual right */
.ibw-news-section__nav--next { left:  -8px; }   /* RTL visual left  */

@media (max-width: 768px) {
    .ibw-news-section__nav { display: none; }
    .ibw-news-section__track { padding-inline: 16px; margin-inline: -16px; }
}

/* ── Card ─────────────────────────────────────────────────────── */
.ibw-news-card {
    flex: 0 0 296px;
    max-width: 296px;
    background: #fff;
    border: 1px solid #e1e4ea;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    scroll-snap-align: start;
    transition: box-shadow .18s, transform .18s;
}
.ibw-news-card:hover {
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.08);
    transform: translateY(-2px);
}
.ibw-news-card__media-link {
    display: block;
    text-decoration: none;
}
.ibw-news-card__media {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #f5f7fa;
}
.ibw-news-card__media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
    display: block;
    transition: transform .35s;
}
.ibw-news-card:hover .ibw-news-card__media img { transform: scale(1.04); }
.ibw-news-card__badge {
    position: absolute;
    bottom: 10px;
    right: 10px;
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(4, 164, 72, 0.95);
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: 0;
}
.ibw-news-card__body {
    padding: 14px 14px 8px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}
/* High specificity to override theme h3 styles which often add borders/weights. */
.ibw-news-card .ibw-news-card__title,
.ibw-news-card__title {
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.7 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #222530;
    letter-spacing: 0;
}
.ibw-news-card__title a,
.ibw-news-card .ibw-news-card__title a {
    color: inherit !important;
    text-decoration: none !important;
    font-weight: inherit !important;
    background: none !important;
    border: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
}
.ibw-news-card__title a:hover { color: #185adb !important; }
.ibw-news-card__excerpt {
    font-size: 11.5px;
    color: #99a0ae;
    line-height: 1.75;
    font-weight: 400;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.ibw-news-card__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 16px 14px;
    margin-top: auto;
    border-top: 1px solid #f5f7fa;
}
.ibw-news-card__time {
    font-size: 12px;
    color: #99a0ae;
    font-weight: 400;
    white-space: nowrap; line-height: 20px;}
.ibw-news-card__cta {
    display: inline-flex;
    align-items: center;
    padding: 5px 12px;
    border: 1px solid #e1e4ea;
    border-radius: 6px;
    color: #525866;
    font-size: 11px;
    font-weight: 400;
    text-decoration: none;
    line-height: 1.4;
    transition: border-color .15s, color .15s, background .15s;
}
.ibw-news-card__cta:hover {
    border-color: #185adb;
    color: #185adb;
    text-decoration: none;
}

/* ─── Wallets Carousel (reuses news carousel mechanics) ────────────── */
.ibw-wallets-carousel {
    position: relative;
    direction: rtl;
    /* Parent (.crypto-page__list) is display:flex/column. Without min-width:0
       on the flex child, the inner track expands to fit its content (all
       cards) instead of overflowing internally — which kills the scroll. */
    min-width: 0;
    width: 100%;
    max-width: 100%;
}

/* Override the legacy grid styling for the wallets list so it scrolls
   horizontally like the news section. We keep the existing
   `.crypto-page__card` styling untouched. */
.ibw-wallets-carousel__track {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    grid-template-columns: none !important;
    /* Required so this nested flex container does not blow out its parent's
       width based on content size. Without this, overflow-x:auto has nothing
       to overflow against. */
    min-width: 0;
    width: 100%;
    max-width: 100%;
    gap: 16px;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 4px 4px 12px;
    margin: -4px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    overscroll-behavior-inline: contain;
    cursor: grab;
}
.ibw-wallets-carousel__track::-webkit-scrollbar { display: none; }
.ibw-wallets-carousel__track > .crypto-page__card {
    flex: 0 0 300px;
    max-width: 300px;
    min-width: 300px;
    margin: 0 !important;
    scroll-snap-align: start;
}

/* Position arrow buttons centered vertically on the wallets viewport */
.ibw-wallets-carousel .ibw-wallets-carousel__nav {
    top: 50%;
    transform: translateY(-50%);
}

@media (max-width: 768px) {
    .ibw-wallets-carousel__nav { display: none; }
    .ibw-wallets-carousel__track { padding-inline: 16px; margin-inline: -16px; }
    .ibw-wallets-carousel__track > .crypto-page__card {
        flex-basis: 260px;
        max-width: 260px;
        min-width: 260px;
    }
}

/* ── قواعدی که در نسخه‌ی قدیمی به‌صورت <style> اینلاین داخل تمپلیت بودند ──
   نه در فایل CSS. بدون این‌ها فاصله‌های سایدبار، کاروسل اخبار و کاروسل
   کیف‌پول و باکس انجمن هیچ استایلی نمی‌گیرند. عیناً از باندل زنده‌ی
   پروداکشن استخراج شده. */

.crypto-page__chart-price>div:first-child{display:flex;align-items:center;gap:16px}
.crypto-page__chart-price>div>div{display:flex;padding:4px 8px;justify-content:center;align-items:center;border-radius:8px;background:#e0faec;color:#1fc16b;font-size:14px; line-height: 22px;}
.crypto-page,.crypto-page>*{min-width:0;max-width:100%}
.crypto-page__card-header>img{width:48px;height:48px;border-radius:50%}
@media (max-width:768px){.crypto-page__chart{flex-direction:column}.crypto-page__tab-header{overflow:auto;scrollbar-color:#fff0 #fff0;scrollbar-width:none}.crypto-page__tab-item{white-space:nowrap}.crypto-page__chart-side{width:100%;padding-left:unset;border-left:unset}.crypto_calculator__input-container input{padding:16px 16px 16px 20px}.crypto-page__button-right{height:100%}.crypto-page__coin-price-table tbody tr{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;padding:20px 0}.crypto-page__coin-price-table tbody tr td:first-child{grid-area:1 / 1 / 2 / 3}.crypto-page__coin-price-table tbody tr td:last-child{grid-area:4 / 1 / 5 / 3}.crypto-page__coin-price-table tbody tr td:after{content:unset!important}.crypto-page__coin-price-table .ibwExchangeButton{justify-content:start;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.crypto-page__coin-price-table thead{display:none}.crypto-page__coin-price-table tbody tr td{padding:0}.crypto-page__coin-price-table tbody tr p{padding:0!important;font-size:12px;color:#99a0ae;line-height:20px}.crypto-page__coin-price-table tbody tr td>div{display:flex;gap:4px;font-size:14px;line-height:22px;margin-top:4px}.crypto-page__chart-trading{height:600px;padding:0}.crypto-page__chart-trading.analysis{height:1250px}.crypto-page__list-grid{grid-template-columns:repeat(1,1fr)}.crypto-page__chart-sidetop-upper{padding-top:28px;border-top:1px solid #e1e4ea;gap: 24px}.crypto-page__chart-coin-about-head span{font-size:24px;line-height:32px}.crypto-page__chart-coin-about-number{font-size:14px; line-height: 22px;}.crypto-page__chart-coin{gap:16px}.crypto-page__chart-price{width:100%;align-items:end}.crypto-page__chart-price>div:first-child{flex-direction:row-reverse}.crypto-page__chart-price span{font-size:24px;line-height:32px}.crypto-page__chart-price-tag{flex-direction:row-reverse}.crypto-page__chart-sidebottom-upper{padding-top:12px}.crypto-page__chart-sidebottom-upper-cell:first-child{padding-top:0}.crypto-page__chart-sidetop{gap:40px}.crypto_calculator{margin-top:0!important;padding-top:24px!important;padding-bottom:40px!important}.crypto-page__coin-price-table .ibwCustomLink{display:flex;align-items:center}.crypto-page__chart-view{gap:40px}.crypto-page__chart-view-title{margin-bottom:16px}.crypto-page__card-header-text{gap:8px}.crypto-page__card-header-text a{color:inherit!important;line-height:26px;font-size:16px}.crypto-page__card-header-text span{line-height:22px;font-size:14px}.crypto-page__change-table-container{overflow:auto;scrollbar-width:none;scrollbar-color:#fff0 #fff0}.forex-faq{gap: 24px;padding:64px 0}.forex-faq__title{gap:12px;margin-top:0!important;font-size:20px!important; line-height: 28px;}.ibw-faq{padding:20px 0}.forex-faq__q-each{font-size:14px;line-height:22px}.ibw-faq.open .forex-faq__q-each-answer{font-size:12px;line-height:20px}.crypto-page__chart-sidetop-lower{gap:20px}.tag-modal .modal-dialog{height:100%;margin:0}.tag-modal .modal-dialog .modal-content{position:absolute;width:100%;bottom:0;right:0;border-radius:12px 12px 0 0}}
@media (min-width:769px) and (max-width:1200px){.crypto-page__chart{flex-direction:column}.crypto-page__chart-side{width:100%;border-left:unset;padding-left:unset;padding-bottom:40px}.crypto-page__chart-sidetop-upper{display:grid;grid-template-columns:repeat(2,1fr);gap:32px 16px}.crypto-page__chart-sidetop-upper>div:first-child{grid-area:1 / 1 / 2 / 2}.crypto-page__chart-sidetop-upper>div:nth-child(2){grid-area:1 / 2 / 2 / 3}.crypto-page__chart-sidetop-upper>div:nth-child(3){grid-area:2 / 1 / 3 / 3}.crypto-page__chart-sidetop-upper>div:nth-child(4){grid-area:3 / 1 / 4 / 3}.crypto-page__chart-sidetop-upper>div:nth-child(5){grid-area:4 / 1 / 5 / 3}.crypto-page__chart-coin{justify-content:start}.crypto-page__chart-coin-about{flex-grow:1}.crypto-page__chart-price{align-items:end}.crypto-page__chart-sidetop{gap:40px}.crypto-page__chart-sidetop-info{display:grid;gap:40px;grid-template-columns:repeat(2,1fr)}.crypto-page__chart-sidebottom-upper{padding-top:0}.crypto-page__chart-sidetop-lower{gap:20px}.crypto-page__tab-header{overflow:auto;scrollbar-color:#fff0 #fff0;scrollbar-width:none}.crypto-page__tab-item{white-space:nowrap}.crypto-page__swap{display:grid;grid-template-columns:repeat(2,1fr)}.crypto-page__change-table-container{overflow:auto;scrollbar-color:#fff0 #fff0;scrollbar-width:none}.crypto-page__coin-price-table{overflow:auto;scrollbar-color:#fff0 #fff0;scrollbar-width:none}.crypto-page__coin-price-table .ibwCustomLink>div:first-child{width:20px}.crypto-page__coin-price-table .ibwExchangeButton button{flex-shrink:0;display:block}.crypto-page__list-grid{grid-template-columns:repeat(2,1fr)}.crypto-page__chart-trading{height:500px}.crypto-page__chart-trading.analysis{height:1300px}.crypto-page__coin-price-table .ibwExchangeButton{margin-right:20px}}
.ibw-community-cta-wrap{margin:18px 0 24px}
.ibw-news-section{margin:32px 0;direction:rtl}
.ibw-news-section__viewport{position:relative}
.ibw-news-section__nav--next{left:-8px}
.ibw-news-card{flex:0 0 296px;max-width:296px;background:#fff;border:1px solid #e1e4ea;border-radius:12px;overflow:hidden;display:flex;flex-direction:column;scroll-snap-align:start;transition:box-shadow .18s,transform .18s}
.ibw-news-card .ibw-news-card__title,.ibw-news-card__title{font-size:14px!important;font-weight:500!important;line-height:1.7!important;margin:0!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;text-shadow:none!important;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#222530;letter-spacing:0}
.ibw-wallets-carousel{position:relative;direction:rtl;min-width:0;width:100%;max-width:100%}
.ibw-wallets-carousel__track>.crypto-page__card{flex:0 0 300px;max-width:300px;min-width:300px;margin:0!important;scroll-snap-align:start}
.ibw-wallets-carousel .ibw-wallets-carousel__nav{top:50%;transform:translateY(-50%)}
@media (max-width:768px){.ibw-wallets-carousel__nav{display:none}.ibw-wallets-carousel__track{padding-inline:16px;margin-inline:-16px}.ibw-wallets-carousel__track>.crypto-page__card{flex-basis:260px;max-width:260px;min-width:260px}}

/* سایدبار چسبان دسکتاپ — بدون این، ستون راست با چارت اسکرول می‌شود */
@media (min-width:1201px){
    .single-page__sidebar__dropdown:hover > .dropdown-menu{display:block}
    .crypto-page__chart{align-items:flex-start}
    .crypto-page__chart-side{position:sticky;top:88px;align-self:flex-start;max-height:calc(100vh - 100px);overflow-y:auto;overflow-x:hidden;padding-bottom:24px}
    .crypto-page__chart-side::-webkit-scrollbar{width:3px;height:3px}
    .crypto-page__chart-side::-webkit-scrollbar-thumb{background-color:rgba(148,163,184,.18);border-radius: 999px;transition:background-color .2s}
    .crypto-page__chart-side:hover::-webkit-scrollbar-thumb,
    .crypto-page__chart-side::-webkit-scrollbar-thumb:hover{background-color:rgba(148,163,184,.5)}
    .crypto-page__chart-side::-webkit-scrollbar-track{background:transparent}
}

@media (max-width:768px){
    .ibw-news-section__nav{display:none}
    .ibw-news-section__track{padding-inline:16px;margin-inline:-16px}
}
@media (max-width:600px){
    .ibw-community-cta{flex-direction:column;align-items:flex-start;gap:.85rem}
    .ibw-community-cta__action{width:100%;justify-content:center}
}
@media (max-width:500px){
    .ibw-community-cta__body strong{font-size:.88rem}
}

/* ═══════════════════════════════════════════════════════════════════════════
   لایه‌ی پالایش دیزاین
   ───────────────────────────────────────────────────────────────────────────
   قواعد بالا از باندل پروداکشن آمده‌اند و دست‌نخورده می‌مانند تا مرجع باقی
   بمانند؛ این بخش فقط چیزهایی را عوض می‌کند که اودیت به‌عنوان مشکل نشان داد:
   ۳۸ خطای کنتراست، ۱۳ اندازه‌ی فونت، ۱۶ شعاع، ۱۶ مقدار فاصله، ۸۰ هدف لمسی
   زیر ۳۲px.

   ⚠ سلکتورها عمداً دوکلاسه‌اند. قاعده‌ی تم `.contentstyle thead` هم‌وزنِ
   `.crypto-page__x thead` است و ترتیبِ فایلِ ترکیبیِ لایت‌اسپید برنده را
   عوض می‌کند — همان تله‌ای که در irb-exchange هم بود.
   ═══════════════════════════════════════════════════════════════════════════ */

.crypto-page,
.ibw-table-coins-main {
    /* متن — خاکستریِ قبلی #99a0ae روی سفید ۲.۵۶:۱ بود و روی هر برچسب آمار
       می‌نشست. #525866 همان نقش را دارد ولی ۴.۷۶:۱ است. */
    --irbc-fg:        #0e121b;
    --irbc-fg-2:      #525866;
    --irbc-fg-3:      #525866;

    --irbc-line:      #e1e4ea;
    --irbc-line-soft: #f5f7fa;
    --irbc-surface-2: #f5f7fa;
    --irbc-brand:     #185adb;

    /* سبز برند (#1fc16b) روی تینت ۳.۰۹:۱ بود و روی دکمه ۳.۲۸:۱.
       این دو، همان سبز و قرمزند با روشناییِ قابل‌قبول. */
    --irbc-up:        #04a448;
    --irbc-up-bg:     #e0faec;
    --irbc-down:      #f5222d;
    --irbc-down-bg:   #ffebec;

    --irbc-r-xs: 6px;
    --irbc-r-sm: 8px;
    --irbc-r:    12px;
    --irbc-r-pill: 999px;
}

/* ── ۱. کنتراست ───────────────────────────────────────────────────────────
   هر جایی که #99a0ae متن بود. مقادیر با !important نوشته شده‌اند چون
   قواعد اصلی خودشان !important دارند. */
.crypto-page .crypto-page__chart-sidetop-lower-cell div,
.crypto-page .crypto-page__chart-sidebottom-upper-cell p,
.crypto-page .irbc-range__end-label,
.crypto-page .crypto-page__card-data-text,
.crypto-page .ibw-news-card__meta,
.crypto-page .crypto-page__chart-coin-about p {
    color: var(--irbc-fg-3) !important;
}

.crypto-page .ibwGreenPc { color: var(--irbc-up) !important }
.crypto-page .ibwReadPc  { color: var(--irbc-down) !important }

.crypto-page .crypto-page__chart-price > div > div {
    background: var(--irbc-up-bg);
    color: var(--irbc-up);
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
}
.crypto-page .crypto-page__chart-price > div > div.ibwReadPc {
    background: var(--irbc-down-bg);
}

/* ── ۲. سلسله‌مراتب سر صفحه ──────────────────────────────────────────────
   قیمت دلاری عدد اصلی است و قیمت تومانی — عددی که کاربر ایرانی واقعاً
   می‌خواند — به‌شکل زیرنویسِ کم‌رنگ درآمده بود. */
.crypto-page .crypto-page__chart-coin-about-head h1 {
    margin: 0;
    padding: 0;
    color: var(--irbc-fg);
    font-size: 24px;
    line-height: 32px;
    font-weight: 700;
    font-variation-settings: "wght" 700, "KSHD" 100;
}

.crypto-page .crypto-page__chart-price > div:first-child > span {
    font-size: 32px;
    line-height: 40px;
    font-weight: 700;
    font-variation-settings: "wght" 700, "KSHD" 100;
}

/* عنوان خودِ صفحه «قیمت … به تومان و دلار» است و مخاطب ایرانی به تومان
   می‌خرد — ولی عدد تومانی هم‌اندازه‌ی متن بدنه بود و مثل زیرنویس خوانده
   می‌شد. دلار سرتیتر می‌ماند (چارت و بازار جهانی به دلارند)، ولی تومان
   می‌آید در ردیفِ اول اهمیت. */
.crypto-page .crypto-page__chart-price-tag {
    color: var(--text-strong-950, #0e121b);
    font-size: 20px;
    line-height: 28px;
    font-weight: 600;
    font-variation-settings: "wght" 600, "KSHD" 100;
    gap: 8px;
    cursor: help;
}
.crypto-page .crypto-page__chart-price-tag svg { color: var(--irbc-fg-3); flex-shrink: 0 }

/* ── ۳. نوار بازه‌ی روز ───────────────────────────────────────────────────
   سه بلوک (دو ردیف برچسب/مقدار + یک range غیرفعال) شدند یک کامپوننت. */
.crypto-page .irbc-range {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}
.crypto-page .irbc-range__track {
    position: relative;
    height: 4px;
    border-radius: var(--irbc-r-pill);
    background: var(--irbc-line);
}
.crypto-page .irbc-range__mark {
    position: absolute;
    top: 50%;
    inset-inline-start: var(--irbc-pos, 50%);
    width: 3px;
    height: 12px;
    border-radius: var(--irbc-r-pill);
    background: var(--irbc-fg-2);
    transform: translate(50%, -50%);
}
.crypto-page .irbc-range__ends {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}
.crypto-page .irbc-range__end {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.crypto-page .irbc-range__end--high { text-align: left }
.crypto-page .irbc-range__end-label {
    color: var(--irbc-fg-3);
    font-size: 12px;
    line-height: 20px;
}
.crypto-page .irbc-range__end-value {
    color: var(--irbc-fg-2);
    font-size: 14px;
    line-height: 22px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
    direction: ltr;
    unicode-bidi: isolate;
}

/* ── ۴. دکمه‌ها و هدف‌های لمسی ────────────────────────────────────────────
   ۸۰ عنصر تعامل‌پذیر زیر ۳۲px بودند؛ کوچک‌ترین‌ها ۱۲×۲۰ و ۱۶×۱۶. */
.crypto-page .crypto-chart-buy,
.crypto-page .crypto-chart-sell,
.crypto-page .crypto-chart-buy.crypto-chart-buy,
.crypto-page .crypto-chart-sell.crypto-chart-sell {
    min-height: 44px;
    border-radius: var(--irbc-r-sm);
    font-size: 16px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
    transition: background-color .18s ease; line-height: 26px;}
.crypto-page .crypto-chart-sell { background: var(--irbc-up) }
.crypto-page .crypto-chart-buy:hover  { background: #1a4ab3 }
.crypto-page .crypto-chart-sell:hover { background: #0b4627 }

.crypto-page .crypto-page__chart-sidebottom-upper-cell .sidebarTag {
    min-height: 24px;
    padding: 2px 8px;
    border-radius: var(--irbc-r-pill);
    line-height: 18px;
}
.crypto-page .crypto-page__chart-sidebottom-upper-cell .sidebarTag.btn-show-more {
    width: 24px;
    height: 24px;
    padding: 4px !important;
}
/* دکمه‌ی «آدرس‌های بیشتر» ۱۲×۲۰ بود — کوچک‌ترین هدف صفحه. */
.crypto-page .single-page__sidebar__dropdown > .dropdown-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.crypto-page a:focus-visible,
.crypto-page button:focus-visible,
.crypto-page [tabindex]:focus-visible {
    outline: 2px solid var(--irbc-brand);
    outline-offset: 2px;
    border-radius: var(--irbc-r-xs);
}

/* ── ۵. جدول‌ها ───────────────────────────────────────────────────────────
   دو نوار آبیِ اشباع روی یک صفحه، سنگین‌ترین عنصر بصری بودند و با محتوا
   رقابت می‌کردند. سرِ خنثی، متنِ پررنگ. */
.crypto-page .crypto-page__change-table thead,
.crypto-page .ibwCompareTableContent thead,
.crypto-page .crypto-page__coin-price-table thead {
    background: var(--irbc-surface-2) !important;
}
.crypto-page .crypto-page__change-table thead tr,
.crypto-page .ibwCompareTableContent thead tr,
.crypto-page .crypto-page__coin-price-table thead tr,
.crypto-page .crypto-page__change-table thead th,
.crypto-page .ibwCompareTableContent thead th,
.crypto-page .crypto-page__coin-price-table thead th {
    color: var(--irbc-fg-3) !important;
    font-size: 14px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100; line-height: 22px;}
/* خط‌های عمودیِ جداکننده‌ی سرِ جدول در تمِ سایت؛ روی سرِ روشن دیده نمی‌شوند. */
.crypto-page thead th:not(:last-child):after,
.crypto-page thead td:not(:last-child):after { content: none !important }

.crypto-page .crypto-page__coin-price-table tbody tr { border-bottom: 1px solid var(--irbc-line-soft) }
.crypto-page .crypto-page__coin-price-table tbody tr:last-child { border-bottom: none }

/* ── ۶. عنوان بخش‌ها ──────────────────────────────────────────────────────
   یک اندازه و یک وزن برای همه، به‌جای سه شکل مختلف. */
.crypto-page .crypto-page__chart-view-title h2,
.crypto-page .ibw-news-section__title,
.crypto-page .forex-faq__title {
    margin: 0;
    padding: 0;
    color: var(--irbc-fg);
    font-size: 20px;
    line-height: 28px;
    font-weight: 700;
    font-variation-settings: "wght" 700, "KSHD" 100;
}

/* ── ۷. نوارهای امتیاز کیف پول ────────────────────────────────────────────
   قرمز روی «امتیاز ۱ از ۵» یعنی خطا، نه امتیاز کم. یک رنگ، پُریِ متفاوت. */
.crypto-page .crypto-page__progress { background: var(--irbc-line) }
.crypto-page .crypto-page__progress .progress-bar,
.crypto-page .crypto-page__progress .progress-bar.progressbar-low {
    background: var(--irbc-brand);
}

/* ── ۸. نوار پیمایش بخش‌ها ────────────────────────────────────────────────
   این‌ها تب نیستند و هیچ‌وقت نبودند: به بخشِ همان صفحه اسکرول می‌کنند.
   حالا حالت «بخش جاری» دارند تا رفتارشان با ظاهرشان بخواند. */
.crypto-page .crypto-page__tab-header {
    gap: 4px;
    padding-bottom: 12px;
}
.crypto-page .crypto-page__tab-item {
    padding: 8px 12px !important;
    min-height: 36px;
    border-radius: var(--irbc-r-sm);
    color: var(--irbc-fg-3);
    font-size: 14px;
    transition: background-color .18s ease, color .18s ease; line-height: 22px;}
.crypto-page .crypto-page__tab-item svg { width: 18px; height: 18px }
.crypto-page .crypto-page__tab-item:hover { background: var(--irbc-surface-2); color: var(--irbc-fg-2) }
.crypto-page .crypto-page__tab-item[aria-current="true"] {
    background: rgba(24, 90, 219, .08);
    color: var(--irbc-brand);
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
}

/* لنگرها زیر هدرِ چسبانِ تم نیفتند. */
.crypto-page [id] { scroll-margin-top: 96px }

@media (prefers-reduced-motion: reduce) {
    .crypto-page *,
    .crypto-page *::before,
    .crypto-page *::after { transition-duration: .01ms !important; animation-duration: .01ms !important }
}

/* ── ۹. کارت خبر و CTA ────────────────────────────────────────────────────
   بازمانده‌های اودیت کنتراست: تاریخ خبر ۱۰.۵px با #99a0ae (۲.۵۶:۱)، بج
   «خبر» ۱۰px سفید روی سبز ۹۵٪ (۳.۲۸:۱)، و دکمه‌ی کامیونیتی ۱۲.۸px روی
   #185adb (۴.۴۹:۱ — درست زیر آستانه). اندازه‌های کسری هم از همین‌جا می‌آمدند. */
.crypto-page .ibw-news-card__time,
.crypto-page .ibw-news-card__excerpt {
    color: var(--irbc-fg-3) !important;
    font-size: 12px !important;
    line-height: 20px !important;
}
.crypto-page .ibw-news-card__badge {
    background: var(--irbc-up);
    font-size: 12px;
    line-height: 20px;
    padding: 2px 10px;
}
.crypto-page .ibw-news-card .ibw-news-card__title,
.crypto-page .ibw-news-card__title {
    font-size: 14px !important;
    line-height: 22px !important;
}
.crypto-page .ibw-community-cta__action {
    background: #1a4ab3;
    font-size: 14px;
    min-height: 40px;
    border-radius: var(--irbc-r-sm); line-height: 22px;}
.crypto-page .ibw-community-cta:hover .ibw-community-cta__action { background: #1b428d }

/* ── ۱۰. هدف لمسی چیپ‌ها ──────────────────────────────────────────────────
   min-height روی خودِ چیپ کافی نبود: لینک داخلش ۱۸px می‌ماند و ناحیه‌ی
   کلیک همان لینک است، نه ظرف. */
.crypto-page .crypto-page__chart-sidebottom-upper-cell .sidebarTag > a,
.crypto-page .crypto-page__chart-sidebottom-upper-cell .sidebarTag > .btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 24px;
}

/* ── ۱۱. شعاع‌ها ───────────────────────────────────────────────────────────
   مقیاس چهار پله‌ای: ۶ (ریز)، ۱۰ (کنترل)، ۱۲ (کارت)، pill. مقادیر ۴/۸/۱۱px
   که از جاهای مختلف آمده بودند به نزدیک‌ترین پله می‌روند. */
.crypto-page .crypto-page__card,
.crypto-page .crypto-page__chart-analis,
.crypto-page .crypto-page__change-table-container,
.crypto-page .ibw-news-card { border-radius: var(--irbc-r) }

.crypto-page .crypto-page__chart-price > div > div,
.crypto-page .tab__price-list,
.crypto-page .tab__price-list li button,
.crypto-page .crypto-page__coin-price-table .ibwExchangeButton button { border-radius: var(--irbc-r-sm) }

/* ── ۱۲. نشتِ استایل نثرِ تم به اجزای رابط ────────────────────────────────
   کل صفحه داخل `.contentstyle` است، پس تم به هر <p> اندازه‌ی ۱۸px و به هر
   <h2> اندازه‌ی ۲۸px می‌دهد. نتیجه‌اش دو اشکالِ سلسله‌مراتبی بود:
     • مقدارهای آمار و زیرعنوان نماد ۱۸px می‌شدند (خارج از مقیاس)،
     • تیترهای داخلِ متن (۲۸px) از تیترِ خودِ بخش (۲۰px) بزرگ‌تر بودند.
   نثرِ واقعی — یعنی توضیحات ارز — همان ۱۶px بدنه‌ی تم را نگه می‌دارد. */
.crypto-page .crypto-page__chart-coin-about p {
    font-size: 14px !important;
    line-height: 22px !important;
}
.crypto-page .crypto-page__chart-sidetop-lower-cell p,
.crypto-page .crypto-page__chart-sidetop-lower-cell div,
.crypto-page .crypto-page__chart-sidebottom-upper-cell p {
    font-size: 14px !important;
    line-height: 22px !important;
}
.crypto-page .ibw-coin-description .contentstyle h2,
.crypto-page .ibw-coin-description .contentstyle h3 {
    font-size: 20px !important;
    line-height: 28px !important;
}

/* ── ۱۳. بازمانده‌های مقیاس و هدف لمسی ────────────────────────────────────
   ۱۱px و ۱۲.۸px و ۱۵.۲px از rem‌های خودِ این فایل می‌آمدند. */
.crypto-page .ibw-news-card__cta {
    font-size: 12px;
    min-height: 24px;
    display: inline-flex;
    align-items: center; line-height: 20px;}
.crypto-page .ibw-news-section__more {
    font-size: 14px;
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    gap: 4px; line-height: 22px;}
.crypto-page .ibw-community-cta__body strong { font-size: 16px; line-height: 26px;}
.crypto-page .ibw-community-cta__body span,
.crypto-page .ibw-community-cta__icon { font-size: 14px; line-height: 22px;}

/* دکمه‌ی «بیشتر» ۱۶px پهنا داشت. خودِ ظرف بزرگ شده بود ولی ناحیه‌ی کلیک
   همان لینک/دکمه‌ی داخلش است. */
.crypto-page .sidebarTag.btn-show-more,
.crypto-page .sidebarTag.btn-show-more > a,
.crypto-page .sidebarTag.btn-show-more > .btn {
    width: 24px !important;
    min-width: 24px;
    height: 24px !important;
}

/* ── ۱۴. ریتم عمودی ───────────────────────────────────────────────────────
   فاصله‌ی بخش‌های هم‌رده ۳۲، ۴۶، ۵۰، ۵۵ و ۶۴ پیکسل بود: ظرف‌ها `gap` فلکس
   دارند ولی هر بخش مارجین خودش را هم می‌آورد و دوتایی جمع می‌شوند. تنها
   منبعِ ریتم، `gap` ظرف است — مارجین‌های سرگردانِ فرزندانِ مستقیم صفر. */
.crypto-page .crypto-page__chart-main { gap: 48px }
.crypto-page .crypto-page__chart-main > * { margin-top: 0; margin-bottom: 0 }

.crypto-page .crypto-page__chart-content { gap: 32px }
.crypto-page .crypto-page__chart-content > * { margin-top: 0; margin-bottom: 0 }

/* ── ۱۵. «مشاهده بیشتر» ───────────────────────────────────────────────────
   دکمه شفاف بود و درست روی متنِ محوشده می‌نشست. */
.crypto-page .read-more-container .ibwReadMore {
    background: #fff;
    border: 1px solid var(--irbc-line);
    border-radius: var(--irbc-r-sm);
    min-height: 40px;
    padding: 8px 20px;
    color: var(--irbc-fg-2);
    font-size: 14px;
    transition: border-color .18s ease, color .18s ease; line-height: 22px;}
.crypto-page .read-more-container .ibwReadMore:hover {
    border-color: var(--irbc-brand);
    color: var(--irbc-brand);
}

/* قاب چارت — قبلاً استایل اینلاین بود (مارجین با gap ظرف جمع می‌شد) و سایه
   داشت، در حالی که کارت‌های این تم تخت‌اند. */
.crypto-page .ibw-bitycle-chart-prominent {
    background: #fff;
    border: 1px solid var(--irbc-line);
    border-radius: var(--irbc-r);
    overflow: hidden;
}
.crypto-page #bitycle-fc-widget { width: 100%; height: 550px }
@media (max-width: 768px) {
    .crypto-page #bitycle-fc-widget { height: 420px }
}

/* ── ۱۶. صفحه‌ی فهرست ارزها ───────────────────────────────────────────────
   همان اودیت روی `/coins/` : ۱۵۸ خطای کنتراست و ۴۰ هدف لمسی زیر ۲۴px.
   بیشترشان تکرارِ یک اشتباه در ۵۰ ردیف بودند — نماد ارز با #99a0ae (۲.۵۶:۱)
   و درصد تغییر با #1fc16b / #fb3748 (۳.۲۸ و ۳.۲۷). سرِ جدول هم برای هم‌خوانی
   با صفحه‌ی تکی خنثی می‌شود. */
.ibw-table-coins-main .ibw-green-percent-change,
.ibw-table-coins-main .ibwGreenPc { color: var(--irbc-up) !important }

.ibw-table-coins-main .ibw-red-percent-change,
.ibw-table-coins-main .ibwReadPc { color: var(--irbc-down) !important }

/* نماد ارز زیر نام، در هر یک از ۵۰ ردیف. */
.ibw-table-coins-main .ibw-coin-symbol { color: var(--irbc-fg-3) !important }

.ibw-table-coins-main thead { background: var(--irbc-surface-2) !important }
.ibw-table-coins-main thead tr,
.ibw-table-coins-main thead th {
    color: var(--irbc-fg-3) !important;
    font-size: 14px;
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100; line-height: 22px;}
.ibw-table-coins-main thead th:not(:last-child):after { content: none !important }

.ibw-table-coins-main .ibwCoinsTags a,
.ibw-table-coins-main .ibwCoinsTags button {
    min-height: 32px;
    display: inline-flex;
    align-items: center;
    border-radius: var(--irbc-r-sm);
}

.ibw-table-coins-main a:focus-visible,
.ibw-table-coins-main button:focus-visible {
    outline: 2px solid var(--irbc-brand);
    outline-offset: 2px;
    border-radius: var(--irbc-r-xs);
}

/* جداکننده‌ی «…» در صفحه‌بندی. */
.ibw-table-coins-main .ibw-pagination span { color: var(--irbc-fg-3) }

/* ستون چسبانِ «ارز دیجیتال» پس‌زمینه‌ی مستقل دارد (باید محتوای زیرش را بپوشاند)
   و با خنثی‌شدن بقیه‌ی سرِ جدول، تنها بلوک آبی باقی می‌ماند. */
.ibw-table-coins-main .ibw-table-coin.ibw-table-coin thead tr th:nth-child(2) {
    background: var(--irbc-surface-2);
}

/* ── ۱۷. راهنما (tooltip) ─────────────────────────────────────────────────
   حباب `position: fixed` است نه absolute: سایدبار در ≥۱۲۰۱px
   `overflow-y: auto` دارد و هر چیزِ absolute داخلش بریده می‌شود. مختصاتش را
   جاوااسکریپت هنگام باز شدن می‌گذارد. */
.crypto-page .irbc-tip,
.ibw-table-coins-main .irbc-tip {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    margin-inline-start: 4px;
}

.crypto-page .irbc-tip .irbc-tip__btn,
.ibw-table-coins-main .irbc-tip .irbc-tip__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--irbc-fg-3);
    cursor: help;
    border-radius: var(--irbc-r-pill);
    transition: color .18s ease, background-color .18s ease;
}
.crypto-page .irbc-tip__btn:hover,
.crypto-page .irbc-tip__btn:focus-visible,
.ibw-table-coins-main .irbc-tip__btn:hover,
.ibw-table-coins-main .irbc-tip__btn:focus-visible {
    color: var(--irbc-brand);
    background: rgba(24, 90, 219, .08);
}

.irbc-tip__bubble {
    position: fixed;
    z-index: 1080;
    max-width: 260px;
    padding: 8px 12px;
    border-radius: 8px;
    background: #0e121b;
    color: #fff;
    font-size: 12px;
    line-height: 20px;
    font-weight: 400;
    font-variation-settings: "wght" 400, "KSHD" 100;
    text-align: right;
    white-space: normal;
    box-shadow: 0 6px 20px rgba(15, 23, 42, .18);
    opacity: 0;
    visibility: hidden;
    transition: opacity .14s ease;
    pointer-events: none;
}
/* «قابل نگه‌داشتن با نشانگر» — شرط WCAG 1.4.13 است، پس وقتی باز است باید
   بشود نشانگر را داخلش برد بدون اینکه ببندد. */
.irbc-tip__bubble.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

/* پیکان */
.irbc-tip__bubble::after {
    content: "";
    position: absolute;
    inset-inline-start: var(--irbc-tip-arrow, 50%);
    width: 8px;
    height: 8px;
    background: inherit;
    transform: translateX(50%) rotate(45deg);
}
.irbc-tip__bubble[data-side="top"]::after { bottom: -4px }
.irbc-tip__bubble[data-side="bottom"]::after { top: -4px }

/* سرِ جدول: برچسب و دکمه باید یک خط بمانند. */
.crypto-page th .irbc-tip { margin-inline-start: 2px }
.crypto-page .ibwCompareTableThead th {
    white-space: nowrap;
}

/* آیتم دراپ‌داون ماشین‌حساب: نماد + نام فارسی، هر دو دیده‌شدنی. */
.crypto-page .crypto_calculator .dropdown-menu li[data-symbol] .btn {
    display: flex;
    align-items: baseline;
    gap: 8px;
    width: 100%;
    text-align: start;
}
.crypto-page .irbc-calc__sym {
    flex-shrink: 0;
    color: var(--irbc-fg-2);
    font-weight: 500;
    font-variation-settings: "wght" 500, "KSHD" 100;
}
.crypto-page .irbc-calc__fa {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: var(--irbc-fg-3);
    font-size: 12px; line-height: 20px;}

/* حالت «نرخ در دسترس نیست»: جمله در اندازه و رنگِ عددِ اصلی چاپ می‌شد، دو خط
   می‌شکست و جای تیتر قیمت را می‌گرفت. حالا یک یادداشت کوتاه است، نه یک خطا. */
.crypto-page .irb-coin-rate-stale {
    color: var(--irbc-fg-3);
    font-size: 12px;
    line-height: 20px;
    font-weight: 400;
    font-variation-settings: "wght" 400, "KSHD" 100;
    white-space: nowrap;
}

/* ── ۱۸. گاتر داخلی صفحه ──────────────────────────────────────────────────
   ظرف تم (`.container`, max-width 1440) فقط ۱۶px پدینگ دارد. صفحه‌ی اصلی این
   را حس نمی‌کند چون هر بلوکش یک کارتِ پدینگ‌دار است؛ صفحه‌ی کوین اما دو ستونِ
   بی‌قاب روی پس‌زمینه‌ی سفید است، پس متن مستقیم می‌رود روی لبه‌ی ظرف.
   بین ۱۴۵۶ تا ۱۴۷۲ پیکسل که ظرف به سقفش می‌رسد، حاشیه عملاً صفر می‌شود.
   یک گاتر از خودِ صفحه این را در همه‌ی عرض‌ها عمدی نشان می‌دهد. */
@media (min-width: 769px) {
    .crypto-page { padding-inline: 24px }
}
@media (min-width: 1201px) {
    .crypto-page { padding-inline: 40px }
}

/* ── ۱۹. ماشین‌حساب: دو نیمه‌ی یک کنترل ─────────────────────────────────────
   دکمه‌ی ارز و کادر عدد قرار است یک کنترلِ به‌هم‌چسبیده باشند (شعاعشان مکمل
   هم است) ولی ارتفاعشان یکی نبود: دکمه پدینگ عمودی ۱۶px داشت (۵۴px) و اینپوت
   پدینگ ۶px بوت‌استرپ (۴۲.۵px) — ۱۱.۵ پیکسل اختلاف که کادر عدد را کوتاه
   نشان می‌داد. یک ارتفاع برای هر دو، متن هم عمودی وسط. */
.crypto-page .crypto_calculator__swap-container .crypto-page__button-right,
.crypto-page .crypto_calculator__input-container,
.crypto-page .crypto_calculator__input-container input.form-control {
    height: 48px;
    min-height: 48px;
}
.crypto-page .crypto_calculator__swap-container .crypto-page__button-right {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0 16px;
}
.crypto-page .crypto_calculator__input-container input.form-control {
    padding: 0 16px;
    line-height: 46px;
}
/* دو نیمه یک بردر مشترک دارند؛ بدون این، خط وسط دوبل می‌شود. */
.crypto-page .crypto_calculator__input-container input.form-control {
    border-inline-start-width: 0;
}

/* ── ۲۰. فلش‌های اسلایدر ──────────────────────────────────────────────────
   دایره‌ی ۴۰px با سایه که ۸px بیرون از ریل آویزان بود و روی کارت‌ها می‌افتاد.
   مینیمال‌تر: ۳۲px، بدون سایه، بردر مویی، و داخل لبه‌ی ریل. */
.crypto-page .ibw-news-section__nav {
    width: 32px;
    height: 32px;
    border: 1px solid var(--irbc-line);
    background: #fff;
    color: var(--irbc-fg-3);
    box-shadow: none;
    transition: color .18s ease, border-color .18s ease;
}
.crypto-page .ibw-news-section__nav:hover {
    background: #fff;
    color: var(--irbc-brand);
    border-color: var(--irbc-brand);
}
.crypto-page .ibw-news-section__nav--prev { right: 0 }
.crypto-page .ibw-news-section__nav--next { left: 0 }
.crypto-page .ibw-news-section__nav svg { width: 14px; height: 14px }
/* `hidden` روی <button> را نمایشِ فلکسِ قاعده‌ی بالا خنثی می‌کند. */
.crypto-page .ibw-news-section__nav[hidden] { display: none !important }

/* ── ۲۱. سایدبارِ بریده ────────────────────────────────────────────────────
   قاعده‌ی `max-height: calc(100vh - 100px)` + `overflow-y: auto` روی ستون
   چسبان یعنی روی یک لپ‌تاپ معمولی ۱۳۵۰ پیکسل محتوا داخل ۸۰۰ پیکسل جا داده
   می‌شود — یعنی ۵۵۰ پیکسل (بلوک «اطلاعات»، تگ‌ها و کل ماشین‌حساب) پشت یک
   اسکرول‌بارِ تودرتو پنهان می‌ماند. در خروجی PDF هم همان‌جا قیچی می‌شود.
   چسبندگی را نگه می‌داریم — قیمت هنگام خواندن بالا می‌ماند — ولی سقف ارتفاع
   و اسکرول داخلی حذف می‌شود تا هیچ چیزی پنهان نشود. */
@media (min-width: 1201px) {
    .crypto-page .crypto-page__chart-side {
        /* ⚠ `top: 88px` عددِ ثابت بود و با ارتفاع واقعی هدر نمی‌خواند (با بنر
           تبلیغاتی ۱۳۶px است و با اسکرولِ رو به پایین صفر). همان متغیری را
           می‌گیریم که هدر خودش می‌نویسد. */
        top: calc(var(--topPositionNumber, 0px) + 16px);
        max-height: calc(100vh - var(--topPositionNumber, 0px) - 32px);
        overflow-y: auto;
        overflow-x: visible;

        /* اسکرول‌بار باید **دیده شود**. نسخه‌ی قبلی ۳ پیکسل با آلفای ۰.۱۸ بود،
           یعنی عملاً نامرئی — و چون محتوای سایدبار از ویوپورت بلندتر است،
           کاربر فکر می‌کرد ۵۰۰ پیکسل پایینی (تگ‌ها و ماشین‌حساب) اصلاً وجود
           ندارد. `stable` هم لازم است وگرنه ظاهرشدنش محتوا را جابه‌جا می‌کند. */
        /* ⚠ `scrollbar-width`/`scrollbar-color` عمداً اینجا **نیستند**: به‌محض
           ست‌شدن، کروم به مسیر استاندارد می‌رود و کل استایل `::-webkit-scrollbar`
           را نادیده می‌گیرد — یعنی اسکرول‌بارِ اورلیِ مک که در سکون محو است و
           عرضِ صفر می‌گیرد (اندازه‌گیری شد). آن‌وقت کاربر نمی‌فهمد ستون اسکرول
           دارد و ۵۰۰ پیکسل پایینی را ندیده می‌گیرد — همان باگی که این تغییر
           قرار است حلش کند. فایرفاکس اسکرول‌بار نازکِ خودش را می‌گذارد. */
        scrollbar-gutter: stable;
    }

    .crypto-page .crypto-page__chart-side::-webkit-scrollbar { width: 6px }
    .crypto-page .crypto-page__chart-side::-webkit-scrollbar-track { background: transparent }
    .crypto-page .crypto-page__chart-side::-webkit-scrollbar-thumb {
        background-color: var(--irbc-line, #e1e4ea);
        border-radius: 999px;
    }
    .crypto-page .crypto-page__chart-side:hover::-webkit-scrollbar-thumb,
    .crypto-page .crypto-page__chart-side::-webkit-scrollbar-thumb:hover {
        background-color: var(--irbc-fg-4, #99a0ae);
    }
}

/* ── ۲۲. سه چیزی که از پروداکشن ارث رسیده بود و مینیمال نبود ───────────────
   هر سه عمدی بودند، ولی کنار بقیه‌ی صفحه ناهمخوان: */

/* الف) بلوک نظرات ۸۰۰px وسط‌چین بود، در حالی که هر چیز دیگری روی این صفحه به
   ستون محتوا تراز است. یک جزیره‌ی وسط‌چین زیر یک صفحه‌ی تراز، شبکه را می‌شکند.
   حالا دقیقاً همان مرزهای `chart-main` را می‌گیرد، پس لبه‌ی ستون از بالای
   صفحه تا پایین یک خط ممتد است.

   قید اصلی در `irb-commentaz-public.css` روی سه کلاس است، داخل
   `@media (min-width: 992px)` — پس اورراید هم باید داخل همان بازه بنشیند.
   ۴۴۰ = عرض سایدبار (۳۶۰) + فاصله‌ی دو ستون (۴۰) + گاتر صفحه (۴۰). */
@media (min-width: 1201px) {
    body.irb-coin-page .forex-user-ex__title,
    body.irb-coin-page .forex-user-ex__textarea-replay,
    body.irb-coin-page .user-comment-section {
        /* پلاگین نظرات `width: 100%` می‌دهد؛ بدون auto، مارجین‌ها فقط بلوک را
           از ظرف بیرون هل می‌دهند به‌جای اینکه باریکش کنند. */
        width: auto;
        max-width: none;
        margin-inline: 440px 40px;
    }
}
@media (min-width: 992px) and (max-width: 1200px) {
    body.irb-coin-page .forex-user-ex__title,
    body.irb-coin-page .forex-user-ex__textarea-replay,
    body.irb-coin-page .user-comment-section {
        width: auto;
        max-width: none;
        margin-inline: 24px;
    }
}
/* ۸۰px فاصله‌ی قبل از بخش نظرات، ریتم صفحه ۴۸ است. */
body.irb-coin-page .forex-user-ex { padding-block: 48px }

/* ب) بخش توضیحات تنها بلوک تینت‌دار و قاب‌دارِ صفحه بود. روی سفید می‌نشیند
   مثل بقیه؛ جداکننده‌اش فاصله است نه قاب. گرادیانِ «مشاهده بیشتر» هم از قبل
   روی سفید حساب شده بود. */
.crypto-page .crypto-page__content {
    background: #fff;
    border: 0;
    border-radius: 0;
    padding: 0 0 48px;
}
.crypto-page .crypto-page__content.no-toggle { padding-bottom: 0 }

/* ═══════════════════════════════════════════════════════════════════════════
   دیزاین سیستم
   ───────────────────────────────────────────────────────────────────────────
   تم فعال توکن‌های دیزاین‌سیستم را دارد ولی به `.search-page` اسکوپشان کرده و
   `pages/search.css` روی صفحه‌ی ارز اصلاً لود نمی‌شود. پس مثل جعبه‌ی خلاصه‌ی
   AI، همان نام‌ها را با فالبک هگز اینجا تعریف می‌کنیم: اگر روزی تم آن‌ها را
   سراسری کرد، این صفحه خودبه‌خود از همان‌جا تغذیه می‌شود.

   مقادیر عیناً از `themes/iranbroker/assets/css/pages/search.css` آمده‌اند.

   ⚠ قاعده‌ی وضعیت‌ها: `-base` برای پُرکردن و نشانگر است، `-dark` برای **متن**.
   `--state-success-base` روی سفید ۲.۲:۱ و `--state-error-base` ۳.۷:۱ است —
   هر دو زیر آستانه. نسخه‌ی dark هر دو بالای ۹:۱ است.
   ═══════════════════════════════════════════════════════════════════════════ */

.crypto-page,
.ibw-table-coins-main {
    --text-strong-950:  #0e121b;
    --text-sub-600:     #525866;
    --text-soft-400:    #99a0ae;
    --text-disabled-300:#cacfd8;
    --bg-white-0:       #ffffff;
    --bg-weak-50:       #f5f7fa;
    --bg-primary-base:  #185adb;
    --bg-primary-dark:  #1a4ab3;
    --bg-primary-darker:#1b428d;
    --stroke-soft-200:  #e1e4ea;
    --state-success-base:    #1fc16b;
    --state-success-dark:    #0b4627;
    --state-success-lighter: #e0faec;
    --state-error-base:      #fb3748;
    --state-error-dark:      #681219;
    --state-error-lighter:   #ffebec;

    /* توکن‌های داخلی حالا فقط نام مستعارِ دیزاین‌سیستم‌اند، نه هگزِ اختراعی. */
    --irbc-fg:        var(--text-strong-950, #0e121b);
    --irbc-fg-2:      var(--text-sub-600, #525866);
    --irbc-fg-3:      var(--text-sub-600, #525866);
    --irbc-line:      var(--stroke-soft-200, #e1e4ea);
    --irbc-line-soft: var(--bg-weak-50, #f5f7fa);
    --irbc-surface-2: var(--bg-weak-50, #f5f7fa);
    --irbc-brand:     var(--bg-primary-base, #185adb);
    --irbc-up:        var(--secondary-color, #04a448);
    --irbc-up-bg:     var(--state-success-lighter, #e0faec);
    --irbc-down:      #f5222d;
    --irbc-down-bg:   var(--state-error-lighter, #ffebec);
}

/* ── رنگ‌های میراثی که در قواعدِ واردشده از پروداکشن هاردکد بودند ──────────
   به‌جای بازنویسی تک‌تکِ آن‌ها (۲۲ بار #e1e4ea، ۱۹ بار #525866 …) نقششان را
   یک‌جا به توکن دیزاین‌سیستم می‌دهیم. */
.crypto-page [class*="crypto-page"],
.crypto-page .ibwCompareTableContent,
.ibw-table-coins-main [class*="ibw-"] {
    border-color: var(--stroke-soft-200, #e1e4ea);
}

.crypto-page .crypto-page__card,
.crypto-page .ibw-news-card,
.crypto-page .ibw-bitycle-chart-prominent,
.crypto-page .crypto-page__change-table-container {
    border-color: var(--stroke-soft-200, #e1e4ea);
    background: var(--bg-white-0, #fff);
}

.crypto-page .crypto-page__chart-side { border-inline-start-color: var(--stroke-soft-200, #e1e4ea) }
.crypto-page .crypto-page__chart-sidetop-lower-cell,
.crypto-page .crypto-page__chart-sidebottom-upper-cell { border-bottom-color: var(--bg-weak-50, #f5f7fa) }

/* ── تایپوگرافی: جفت اندازه/ارتفاعِ خطِ دیزاین‌سیستم ────────────────────────
   body-s 12/20 · body-m 14/22 · body-l 16/26 · title-s 20/28 */
/* اندازه‌ی این عدد بالاتر تعیین شده (۲۰/۲۸)؛ قاعده‌ی ۱۶px حذف شد چون
   دیرتر می‌آمد و همان را می‌باخت. */
.crypto-page .crypto-page__chart-sidetop-lower-cell p,
.crypto-page .crypto-page__chart-sidetop-lower-cell div,
.crypto-page .crypto-page__chart-sidebottom-upper-cell p,
.crypto-page .crypto-page__chart-coin-about p { line-height: 22px !important }
.crypto-page .irbc-range__end-value { line-height: 22px }
.crypto-page .irbc-range__end-label,
.crypto-page .ibw-news-card__time,
.crypto-page .ibw-news-card__excerpt { line-height: 20px !important }
.crypto-page .crypto-page__chart-view-title h2,
.crypto-page .ibw-news-section__title,
.crypto-page .forex-faq__title { line-height: 28px }

/* ── کارت‌های این تم تخت‌اند (۷۹ عنصر بدون box-shadow) ─────────────────────
   سایه‌هایی که خودم اضافه کرده بودم برداشته می‌شوند؛ جای سایه را بردر می‌گیرد. */
.crypto-page .ibw-news-card,
.crypto-page .ibw-news-card:hover,
.crypto-page .ibw-community-cta,
.crypto-page .ibw-community-cta:hover,
.crypto-page .ibw-news-section__nav {
    box-shadow: none;
}
.crypto-page .ibw-news-card:hover { border-color: var(--bg-primary-base, #185adb) }
.crypto-page .ibw-community-cta { border: 1px solid var(--stroke-soft-200, #e1e4ea) }
.crypto-page .ibw-community-cta:hover { border-color: var(--bg-primary-base, #185adb) }

/* رنگِ پایه روی ریشه‌ی صفحه.
   بوت‌استرپِ تم روی هر h1..h6 می‌نویسد `color: var(--bs-heading-color)` و آن
   متغیر **تعریف نشده** است؛ یعنی اعلان نامعتبر می‌شود و `color` به `inherit`
   برمی‌گردد — که قاعده‌ی خودِ ما را هم دور می‌زند. وقتی ریشه رنگ درست را
   داشته باشد، همان inherit هم به توکن دیزاین‌سیستم می‌رسد. */
.crypto-page,
.ibw-table-coins-main {
    color: var(--text-strong-950, #0e121b);
}

/* ── ۲۳. آخرین ناهماهنگی‌های مقیاس تایپوگرافی ─────────────────────────────
   جفت‌های دیزاین‌سیستم: 12/20 · 14/22 · 16/26 · 18/30 · 20/28 · 24/32 · 32/40 */

/* پیش‌فرضِ نسبتی روی ریشه: هر متنی که جفت صریح ندارد به نسبتِ دیزاین‌سیستم
   می‌افتد (۱۴→۲۲، ۱۶→۲۶). قاعده‌ی قبلی `a { line-height: inherit }` بود که
   نتیجه‌ی معکوس داد — والدِ لینک خودش `normal` بود و لینک همان را ارث می‌برد. */
.crypto-page { line-height: 1.6 }

.crypto-page .crypto-page__chart-sidebottom-upper-cell .sidebarTag { line-height: 20px }
.crypto-page .crypto-page__chart-sidebottom-upper-title { font-size: 20px; line-height: 28px }

/* نثرِ مقاله: تم 18/34 می‌دهد، دیزاین‌سیستم body-xl را 18/30 تعریف کرده. */
.crypto-page .ibw-coin-description .contentstyle p,
.crypto-page .ibw-coin-description .contentstyle li,
.crypto-page .crypto-page__text { line-height: 30px }

/* ── ۲۴. صفحه‌ی فهرست: همان جفت‌های دیزاین‌سیستم ───────────────────────────
   دو قاعده از پیش، ۱۴px را با ۲۴px و با `1` جفت می‌کردند. */
.ibw-table-coins-main { line-height: 1.6 }

.ibw-table-coins-main .ibw-coin-name-symbol p,
.ibw-table-coins-main .ibw-coin-name-text { line-height: 22px }

.ibw-table-coins-main a.ibw-coin-cta-btn,
.ibw-table-coins-main .ibw-coin-cta-btn { line-height: 22px }

/* ── ۲۵. هدر صفحه (بردکرامب + تیتر) ───────────────────────────────────────
   کارت از تم می‌آید؛ اینجا فقط رنگ‌ها به توکن دیزاین‌سیستم می‌روند و تیتر
   روی مقیاس تایپوگرافی می‌نشیند. */
.new-header-design__breadcrump .breadcrumbs {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 14px;
    line-height: 22px;
    color: var(--text-sub-600, #525866);
}
.new-header-design__breadcrump .breadcrumbs a { color: var(--text-sub-600, #525866); transition: color .18s ease }
.new-header-design__breadcrump .breadcrumbs a:hover { color: var(--bg-primary-base, #185adb) }
.new-header-design__breadcrump .breadcrumbs [aria-current="page"] { color: var(--text-strong-950, #0e121b) }

/* ── ۲۶. بهبودهای تجربه‌ی کاربری ──────────────────────────────────────────*/

/* ب) توضیح کوتاه زیر عنوان بخش — برای ویجت‌هایی که خودشان فارسی نیستند. */
.crypto-page .irbc-section-note {
    margin: -8px 0 16px;
    color: var(--text-sub-600, #525866);
    font-size: 14px;
    line-height: 22px;
}

/* ج) حالت خالی. سکوت، کاربری را که برای مقایسه‌ی قیمت آمده سردرگم می‌کند. */
.crypto-page .irbc-empty {
    margin: 0;
    padding: 24px;
    border: 1px dashed var(--stroke-soft-200, #e1e4ea);
    border-radius: 12px;
    background: var(--bg-weak-50, #f5f7fa);
    color: var(--text-sub-600, #525866);
    font-size: 14px;
    line-height: 22px;
    text-align: center;
}

/* د) اسکلت چارت تا وقتی ویجت شخص‌ثالث بیاید. */
.crypto-page .irbc-chart-skeleton {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 100%;
    padding: 48px;
    color: var(--text-sub-600, #525866);
    font-size: 14px;
    line-height: 22px;
}
.crypto-page .irbc-chart-skeleton__bars {
    width: 100%;
    height: 60%;
    border-radius: 12px;
    background:
        repeating-linear-gradient(90deg,
            var(--bg-weak-50, #f5f7fa) 0 28px,
            transparent 28px 44px);
    -webkit-mask-image: linear-gradient(180deg, transparent, #000 40%);
            mask-image: linear-gradient(180deg, transparent, #000 40%);
    animation: irbc-pulse 1.6s ease-in-out infinite;
}
.crypto-page .irbc-chart-skeleton.is-failed {
    align-items: center;
    padding: 24px;
}
.crypto-page .irbc-chart-skeleton.is-failed .irbc-chart-skeleton__bars { display: none }

@keyframes irbc-pulse { 0%,100% { opacity: 1 } 50% { opacity: .45 } }
@media (prefers-reduced-motion: reduce) {
    .crypto-page .irbc-chart-skeleton__bars { animation: none }
}

/* واحد «تومان» نباید هم‌وزنِ خودِ عدد باشد. */
.crypto-page .crypto-page__chart-price-tag {
    display: flex;
    align-items: center;
    gap: 6px;
    direction: rtl;
}

/* ── ۲۷. پس‌زمینه‌ی صفحه ───────────────────────────────────────────────────
   تم روی body رنگ #f9fbff می‌گذارد. روی صفحات ارز سفیدِ خالص می‌خواهیم، پس
   فقط همان‌جا بازنویسی می‌شود — بقیه‌ی سایت دست‌نخورده می‌ماند. */
body.irb-coins-screen { background: var(--bg-white-0, #fff) }

/* ── ۲۸. اندازه‌ی آیکن‌ها ──────────────────────────────────────────────────
   قبلاً روی هر آیکن استایل اینلاین بود؛ روی ۲۱۶ آیکن حدود ۱۰KB از HTML هر
   بازدید. کلاس همان کار را می‌کند و یک‌بار در CSSِ کش‌شده می‌آید. */
.irbc-i { flex-shrink: 0 }
.irbc-i--12 { width: 12px; height: 12px }
.irbc-i--14 { width: 14px; height: 14px }
.irbc-i--16 { width: 16px; height: 16px }
.irbc-i--20 { width: 20px; height: 20px }
.irbc-i--24 { width: 24px; height: 24px }

/* ── ۲۹. بازگشت به چیدمان شناخته‌شده‌ی صفحه‌ی فعلی ─────────────────────────
   چند «بهبود» که خودم اضافه کرده بودم، جدول‌ها را از شکلی که کاربر می‌شناسد
   دور کرده بود. این بخش آن‌ها را به همان قرارداد برمی‌گرداند. */

/* الف) سرِ جدولِ قیمت صرافی‌ها سفید است، نه تینت‌دار.
   تینت فقط مال جدولِ تغییرات است (شش سلولِ کوچک که به قاب نیاز دارند).
   جدول قیمت بلند است و نوار خاکستریِ بالایش با ردیف‌ها رقابت می‌کرد. */
.crypto-page .ibwCompareTableContent thead,
.crypto-page .crypto-page__coin-price-table thead {
    background: #fff !important;
}
.crypto-page .ibwCompareTableContent thead th,
.crypto-page .crypto-page__coin-price-table thead th {
    padding: 0 0 20px !important;
    font-weight: 400;
    font-variation-settings: "wght" 400, "KSHD" 100;
}

/* ب) ردیف‌ها همگی سفیدند و فقط با یک خط از هم جدا می‌شوند. */
.crypto-page .crypto-page__coin-price-table tbody tr,
.crypto-page .crypto-page__coin-price-table tbody tr:nth-child(odd),
.crypto-page .crypto-page__coin-price-table tbody tr:nth-child(even) {
    background: #fff !important;
    border: none;
    border-top: 1px solid var(--irbc-line-soft);
}
.crypto-page .crypto-page__coin-price-table tbody tr:last-child {
    border-bottom: 1px solid var(--irbc-line-soft);
}
.crypto-page .crypto-page__coin-price-table tbody tr td {
    padding: 20px 16px;
}
.crypto-page .crypto-page__coin-price-table tbody tr td:first-child { padding-right: 0 }
.crypto-page .crypto-page__coin-price-table tbody tr td:last-child  { padding-left: 0 }

/* ج) نوار بزرگیِ تغییر حذف شد — قالب دیگر چاپش نمی‌کند. */
/* د) بخش سیگنال: ۷۲۸px برای چیدمانی بود که گیج‌ها زیر هم می‌نشستند. در عرض
   دسکتاپ هر سه گیج از قبل در یک ردیف‌اند و ۵۴۰px کامل جایشان می‌شود —
   اندازه‌گیری شد: زیر ۵۴۰ برچسبِ زیر گیج (Strong Buy / Buy / Sell) بریده
   می‌شود. ۱۸۸px کمتر، بدون از دست رفتن چیزی. */
/* ⚠ فقط دسکتاپ. زیر ۱۲۰۱px ویجت گیج‌ها را زیر هم می‌چیند و ۵۴۰px بدجور
   می‌بُردشان — اندازه‌گیری شد: روی ۳۷۵px ارتفاع واقعیِ محتوا ۱۰۹۶px است.
   بازه‌های موبایل و تبلت همان مقادیر قبلی (۱۲۵۰/۱۳۰۰) را نگه می‌دارند. */
@media (min-width: 1201px) {
    .crypto-page .crypto-page__chart-trading.analysis { height: 540px }
}

/* ── ۳۰. نوار پیمایش بخش‌ها می‌چسبد ───────────────────────────────────────
   صفحه بلند است (چارت، جدول صرافی‌ها، کیف‌پول‌ها، توضیحات، اخبار) و بدون
   چسبیدن، کاربر برای رفتن به بخش بعد باید تا بالا برگردد.

   `--topPositionNumber` را `megamenu.js` تم می‌نویسد و معنی‌اش «لبه‌ی پایین
   هدرِ دیده‌شده» است — با اسکرول به پایین هدر پنهان می‌شود و متغیر صفر
   می‌شود. چون هدر با `transform .3s` می‌لغزد، همین `transition` را می‌گیریم
   تا نوار هم‌زمان با آن حرکت کند؛ بدون آن، متغیر لحظه‌ای عوض می‌شود و یک
   پرشِ ۶۴ پیکسلی دیده می‌شود (همان درسِ ناوِ چسبان PDP نهادهای مالی).

   z-index زیر لایه‌ی مودال‌ها (۱۰۰۵۵) می‌ماند؛ این یک نوار محتواست نه اورلی. */
.crypto-page .crypto-page__tab-header {
    position: sticky;
    top: var(--topPositionNumber, 0px);
    z-index: 30;
    background: #fff;
    padding-top: 12px;
    margin-top: -12px;
    /* مرزِ پایین از قاعده‌ی پایه می‌آید (border-bottom)، پس وقتی می‌چسبد
       محتوا بی‌مرز از زیرش رد نمی‌شود و سایه‌ی اضافه لازم نیست.
       والدش `chart-main` است نه `chart-content` (دلیلش در قالب آمده). */
    transition: top .3s;
}

/* لنگرها باید زیر **هم** هدر و هم این نوار بیفتند، نه فقط هدر. عدد ثابت
   نمی‌شود داد: ارتفاع هدر با بنر تبلیغاتی فرق می‌کند و با اسکرول صفر می‌شود. */
.crypto-page .crypto-page__chart-main > .crypto-page__tab-header { margin-bottom: -16px }

.crypto-page [id] { scroll-margin-top: calc(var(--topPositionNumber, 0px) + 80px) }

@media (prefers-reduced-motion: reduce) {
    .crypto-page .crypto-page__tab-header { transition: none }
}

/* ── ۳۱. حالت درگِ اسلایدرها ──────────────────────────────────────────────
   حین درگ باید هم `scroll-behavior:smooth` خاموش شود (وگرنه هر نوشتن روی
   scrollLeft یک انیمیشن می‌سازد و حرکت عقب می‌ماند) و هم snap (وگرنه ریل
   به نزدیک‌ترین کارت می‌پرد و انگشت/موس را رها می‌کند). */
.crypto-page [data-news-track].is-dragging,
[data-news-track].is-dragging {
    scroll-behavior: auto !important;
    scroll-snap-type: none !important;
    cursor: grabbing;
    user-select: none;
}
[data-news-track].is-dragging * { pointer-events: none }

/* نشانگر فقط وقتی «قابل گرفتن» باشد که واقعاً چیزی برای اسکرول هست. */
[data-news-track] { cursor: grab }

/* ── ۳۲. نوار دسته‌بندی‌ها نباید از کادر بیرون بزند ───────────────────────
   قاعده‌ی سابق `display:flex; gap:24px` بود و هیچ گاردی نداشت — فقط چون
   فهرست تگ‌ها ثابت و کوتاه بود کار می‌کرد. وقتی فهرست را داده‌محور کردم،
   روی پروداکشن نوار ۱۸۲۸px شد، جعبه‌ی جستجو را از صفحه بیرون راند و کل
   سند ۵۹۲px سرریز افقی گرفت (در RTL به سمت چپ).

   فهرست دوباره ثابت شد، ولی گارد هم می‌ماند: هیچ داده‌ای نباید بتواند
   چیدمان را بشکند. `min-width:0` لازم است چون آیتم فلکس به‌طور پیش‌فرض
   کوچک‌تر از محتوایش نمی‌شود و همین باعث ترکیدن کادر می‌شد. */
.crypto-page .ibwTableOptions,
.ibw-table-coins-main .ibwTableOptions {
    min-width: 0;
}
.ibw-table-coins-main .ibwCoinsTags {
    min-width: 0;
    flex: 1 1 auto;
    overflow-x: auto;
    scrollbar-width: none;
}
.ibw-table-coins-main .ibwCoinsTags::-webkit-scrollbar { display: none }

/* جعبه‌ی جستجو و دکمه‌ی دراپ‌داون هرگز فشرده نشوند. */
.ibw-table-coins-main .ibw-search-coin,
.ibw-table-coins-main .ibw-tags-dropdown-container { flex-shrink: 0 }

/* ── ۳۳. کل ردیف جدول ارزها یک لینک است ───────────────────────────────────
   به‌جای هدایت با جاوااسکریپت، همان `<a>`ِ واقعیِ سلول نام با یک شبه‌عنصر
   روی کل ردیف کشیده می‌شود. یعنی میدل‌کلیک، «باز کردن در تب جدید»، نوار
   وضعیت مرورگر و فوکوس کیبورد همه بومی کار می‌کنند — چیزی که با
   `onclick` روی ردیف از دست می‌رفت. ضمناً بازسازیِ ای‌جکسیِ جدول هم
   نیازی به وصل‌کردن دوباره‌ی لیسنر ندارد، چون اصلاً لیسنری نیست. */
.ibw-table-coin tbody tr { position: relative }

/* ⚠ سلول نام باید `static` شود وگرنه جعبه‌ی دربرگیرنده‌ی شبه‌عنصر خودِ سلول
   می‌شود و لینک فقط همان‌جا کشیده می‌ماند. بررسی شد: هیچ فرزند absolute ای
   ندارد و برداشتن relative چیدمانش را عوض نمی‌کند. */
.ibw-table-coin tbody td:nth-child(2) { position: static }

.ibw-table-coin tbody td:nth-child(2) > .ibw-coin-img-name-symbol > a::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
}

/* دکمه‌ی خرید/فروش باید **روی** لینک ردیف بماند، وگرنه کلیکش به صفحه‌ی ارز
   می‌رود نه به صرافی. */
.ibw-table-coin tbody td .ibw-coin-cta-btn { position: relative; z-index: 2 }

.ibw-table-coin tbody tr:hover { background: var(--irbc-surface-2, #f5f7fa) }

/* ── ۳۴. جدول ارزها روی تبلت و موبایل ─────────────────────────────────────
   جدول ۱۰ ستونه ۹۵۵px عرض دارد و در ظرفِ ۳۴۳ پیکسلیِ موبایل فقط افقی
   اسکرول می‌شد: کاربر سه ستون می‌دید و بقیه پشت اسکرول پنهان بود. سیستم
   قبلی هم همین رفتار را داشت، پس اینجا واقعاً حل شده نه بازتولید.

   قاعده: در هر بازه، ستون‌های کم‌ارزش‌تر حذف می‌شوند تا بقیه بدون اسکرول جا
   شوند. ⚠ انتخاب با nth-child است، پس **افزودن ستون به قالب یعنی این
   شماره‌ها هم باید عوض شوند**. ترتیب فعلی:
   ۱ رتبه · ۲ ارز · ۳ قیمت دلاری · ۴ قیمت تومانی · ۵ معاملات روزانه ·
   ۶ حجم بازار · ۷ روزانه · ۸ هفتگی · ۹ نمودار · ۱۰ خرید/فروش */

/* تبلت: معاملات روزانه، حجم بازار و نمودار می‌روند (۷ ستون). */
@media (min-width: 769px) and (max-width: 1200px) {
    .ibw-table-coin colgroup { display: none }
    .ibw-table-coin { width: 100%; min-width: 0; table-layout: fixed }
    .ibw-table-coins-main .ibw-container-table { overflow-x: visible }

    .ibw-table-coin thead th:nth-child(5), .ibw-table-coin tbody td:nth-child(5),
    .ibw-table-coin thead th:nth-child(6), .ibw-table-coin tbody td:nth-child(6),
    .ibw-table-coin thead th:nth-child(9), .ibw-table-coin tbody td:nth-child(9) { display: none }

    .ibw-table-coin thead th:nth-child(1),  .ibw-table-coin tbody td:nth-child(1)  { width: 6% }
    .ibw-table-coin thead th:nth-child(2),  .ibw-table-coin tbody td:nth-child(2)  { width: 26% }
    .ibw-table-coin thead th:nth-child(3),  .ibw-table-coin tbody td:nth-child(3)  { width: 17% }
    .ibw-table-coin thead th:nth-child(4),  .ibw-table-coin tbody td:nth-child(4)  { width: 19% }
    .ibw-table-coin thead th:nth-child(7),  .ibw-table-coin tbody td:nth-child(7)  { width: 10% }
    .ibw-table-coin thead th:nth-child(8),  .ibw-table-coin tbody td:nth-child(8)  { width: 10% }
    .ibw-table-coin thead th:nth-child(10), .ibw-table-coin tbody td:nth-child(10) { width: 12% }

    .ibw-table-coin th, .ibw-table-coin td { padding-inline: 6px }
    .ibw-table-coin .ibw-coin-name-text { max-width: 100% }
}

/* موبایل: رتبه، معاملات، حجم و هفتگی می‌روند (۴ ستون). رتبه از بین نمی‌رود —
   همان جعبه‌ی کوچکی که کنار نماد است دوباره روشن می‌شود. */
@media (max-width: 768px) {
    .ibw-table-coin colgroup { display: none }
    .ibw-table-coin { width: 100%; min-width: 0; table-layout: fixed }
    .ibw-table-coins-main .ibw-container-table { overflow-x: visible }

    /* ⚠ قیمت دلاری هم روی موبایل می‌رود. اول هر دو ستون قیمت را نگه داشتم و
       ۳۶۰px را اندازه گرفتم: عدد تومانی (۱۴ رقم) در ۸۵ پیکسل جا نمی‌شد و یا
       روی ستون بغل می‌ریخت یا وسط رقم می‌شکست («۱۷,۹۸۹,۴۷ / ۲,۸۴۱») — هر دو
       از نبودنِ عدد بدترند. تومان می‌ماند چون برای این مخاطب عددِ عمل‌کردنی
       است؛ قیمت دلاری یک تپ دورتر، روی خودِ صفحه‌ی ارز است. */
    .ibw-table-coin thead th:nth-child(1), .ibw-table-coin tbody td:nth-child(1),
    .ibw-table-coin thead th:nth-child(3), .ibw-table-coin tbody td:nth-child(3),
    .ibw-table-coin thead th:nth-child(5), .ibw-table-coin tbody td:nth-child(5),
    .ibw-table-coin thead th:nth-child(6), .ibw-table-coin tbody td:nth-child(6),
    .ibw-table-coin thead th:nth-child(8), .ibw-table-coin tbody td:nth-child(8) { display: none }

    /* عرض‌ها روی ۳۶۰/۳۷۵/۳۹۰ اندازه‌گیری شده‌اند تا هیچ سلولی سرریز نکند. */
    .ibw-table-coin thead th:nth-child(2), .ibw-table-coin tbody td:nth-child(2) { width: 40% }
    .ibw-table-coin thead th:nth-child(4), .ibw-table-coin tbody td:nth-child(4) { width: 39% }
    .ibw-table-coin thead th:nth-child(7), .ibw-table-coin tbody td:nth-child(7) { width: 21% }

    /* ⚠ `.ibw-table-coin th/td` کافی نیست: پدینگ ۱۶ پیکسلی و فونت ۱۴ پیکسلیِ
       درصدها از قواعدی با ویژگی بیشتر می‌آیند و این را می‌بازند. اندازه‌گیری
       شد — سلول ۶۹ پیکسلی با ۳۲ پیکسل پدینگ فقط ۳۷ پیکسل جا داشت و «۱۹.۸۳%»
       سرریز می‌کرد. */
    .ibw-table-coin thead th, .ibw-table-coin tbody td { padding-inline: 4px; font-size: 11px }
    .ibw-table-coin .ibw-green-percent-change,
    .ibw-table-coin .ibw-red-percent-change { font-size: 11px; white-space: nowrap }

    /* با سه ستون، عدد کامل روی یک خط جا می‌شود — پس شکستن لازم نیست و
       نباید هم باشد: عددی که وسط رقم بشکند خوانده نمی‌شود. */
    .ibw-table-coin td .ibw-bold-text,
    .ibw-table-coin td .ibw-silver-text { font-size: 11px; white-space: nowrap }
    .ibw-table-coin tbody td:nth-child(7) > div { white-space: nowrap }

    /* سلول‌ها محتوایشان را نگه دارند، نه اینکه روی ستون بعدی بریزند. */
    .ibw-table-coin tbody td { overflow: hidden }
    .ibw-table-coin .ibw-coin-img-name-symbol { min-width: 0; overflow: hidden }
    .ibw-table-coin .ibw-coin-name-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    /* «تومان» در ستونی که تیترش «قیمت تومانی» است تکرار است و ۳۰px می‌خورد. */
    .ibw-table-coin td .ibw-silver-text small { display: none }
    .ibw-table-coin .ibw-coin-name-text { max-width: 100%; font-size: 12px }
    .ibw-table-coin .ibw-coin-logo--coin { width: 22px; height: 22px }
    /* ⚠ `!important` لازم است، نه سلیقه: قاعده‌ی پایه `display:none!important`
       دارد و important بر ویژگیِ بیشتر می‌چربد. بدون این، ستون `#` را حذف
       کرده‌ایم و رتبه هیچ‌جا دیده نمی‌شود. */
    .ibw-table-coin .ibw-mobile-rank-box { display: inline-flex !important }

    /* نوار بالای جدول: جستجو ۱۹۱px می‌گرفت و برای تگ‌ها ۱۰۵px می‌ماند —
       یعنی عملاً نامرئی. هرکدام یک ردیف کامل. */
    .ibw-table-coins-main .ibwTableOptions { flex-wrap: wrap; gap: 12px; align-items: stretch }
    .ibw-table-coins-main .ibwTableOptions .ibw-search-coin { order: -1; flex: 1 1 100%; width: 100% }
    .ibw-table-coins-main .ibwTableOptions .ibwCoinsTags { flex: 1 1 100%; width: 100% }
}
