/*
Theme Name: arz
Theme URI: +98 936 950 28 93
Author: سید نوید غفاریان نیا
Author URI: +98 936 950 28 93
Version: 1.0
*/

/* normalize/fonts/common به‌صورت جداگانه در header.php لینک می‌شوند
   (نه @import که دانلود سریالی و مسدودکننده ایجاد می‌کند) */

:root {
    --background-color-company: #20A89D;
    --background-color-link: #000;
    --background-color-link-pale: rgb(160, 160, 160);

    --background-color-bg: #f4f5f6;
    --background-color-box: #fff;

    --background-color-box-pale: #f0f3fa;
    --background-color-border: #f0f3fa;
    --background-color-text: #616e85; /*#7F7F84*/
    --background-color-read: #222222;
    --background-color-heading: #201e1f;
    --background-color-text-pale: #858ca2;
    --background-color-input: #171924;
    --background-color-down: #ea3943;
    --background-color-up: #1b9f77;
}

html {
    scroll-padding-top: 10rem !important;
}

.background-color-box {
    background: var(--background-color-box);
}

body {
    direction: rtl;
    font-family: IRANSans;
    background: var(--background-color-bg);
    font-size: 0.938rem;
    position: relative;
    overflow-x: hidden;
}

@media only screen and (max-width: 599px) {

    table,
    thead,
    th,
    td,
    tr {
        display: block;
    }
}

body.scroll {
    overflow: hidden;
}

.post-hero__overlay {
	width: 100%;
	height: 70%;
	background: linear-gradient(0deg,rgba(0,0,0,1) 10%,rgba(0,0,0,.01) 70%);
	position: absolute;
	right: 0;
	bottom: 0;
	border-radius: 12px;
}

@media only screen and (max-width: 599px) {
    .post-hero__overlay {
        display: none;   
    }
}

.i-mt-1 {
    margin-top: 1rem;
}

.i-mt-1-5 {
    margin-top: 1.5rem;
}

.home p {
    line-height: 28px;
}

.small {
    font-size: 0.813rem;
    color: var(--background-color-text);
}

.error-message {
    font-size: 0.813rem;
    text-align: center;
    color: var(--background-color-down);
}

.mask {
    z-index: 2;
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 100vh;
    background: rgba(14, 42, 71, .9);
    cursor: pointer;
    display: none;
}

.page-container {
    max-width: 900px;
    margin: 0 auto;
    position: relative;
}

a {
    cursor: pointer;
}

.items-center {
    align-items: center;
}

td .bullish,
td .bearish {
    direction: ltr;
}

.bullish {
    direction: ltr;
    display: inline-block;
    color: var(--background-color-up);
    fill: var(--background-color-up);
}

.bearish {
    direction: ltr;
    display: inline-block;
    color: var(--background-color-down);
    fill: var(--background-color-down);
}

.bullish svg,
.bearish svg,
.bg-bullish svg,
.bg-bearish svg {
    width: 8px;
    vertical-align: middle;
}

.bullish i,
.bearish i {
    font-size: 0.75rem;
}

.bg-bullish {
    background: var(--background-color-up);
    color: #fff;
    border-radius: 5px;
    padding: 0 .4rem;
    direction: ltr;
    fill: #fff;
}

.bg-bearish {
    background: var(--background-color-down);
    color: #fff;
    border-radius: 5px;
    padding: 0 .4rem;
    direction: ltr;
    fill: #fff;
}

.bg-bearish i,
.bg-bullish i {
    font-size: 0.75rem;
}

.bg-transparent {
    background: transparent !important;
}

.chart-positive {
    filter: hue-rotate(85deg) saturate(80%) brightness(0.85);
}

.chart-negative {
    filter: hue-rotate(300deg) saturate(210%) brightness(0.7) contrast(170%);
}

.button-cstm {
    display: block;
    padding: .6rem .8rem;
    background: var(--background-color-company) !important;
    color: #fff;
    border-radius: 10px;
    text-align: center;
}

.container {
    width: 1400px;
    margin: 0 auto;
}

@media only screen and (max-width: 599px) {
    .container {
        width: 95%;
        max-width: 350px;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .container {
        width: 550px;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .container {
        width: 90%;
        max-width: 850px;
    }
}

.header-api-tools-cover {
    background: #fff;
    padding: .75rem 0;
    border-bottom: 1px solid var(--background-color-border);
}

@media only screen and (max-width: 1280px) {
    .header-api-tools-cover {
        display: none
    }
}

.header-api-tools {
    display: flex;
    font-size: 0.78rem;
    align-items: center;
    gap: 1.5rem;
}

.header-api-tools .header-api-tools__item {
    display: flex;
    align-items: center;
    gap: .3rem;
}

.header-api-tools .header-api-tools__key {
    color: var(--background-color-text);
}

.header-api-tools .header-api-tools__value {
    color: var(--background-color-heading);
}

.header-api-tools .header-api-tools__value-percentage {
    margin-right: .3rem;
}

.section {
    padding: 1rem 0;
}

.latest-articles .latest-articles-title {
    margin-bottom: 1.5rem;
}

.latest-articles .latest-articles-body {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(2, 1fr);
    align-items: start;
}

@media only screen and (max-width: 599px) {
    .latest-articles .latest-articles-body {
        grid-template-columns: unset;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .latest-articles .latest-articles-body {
        grid-template-columns: unset;
    }
}

.post-categories {
    backdrop-filter: blur(2px);
    border-radius: 10px;
}

.post-categories li {
    list-style: none;
}

.post-categories li a {
    color: #20A89D;
    font-size: 12px;
    background: #CDEFEB;
    padding: .2rem .7rem;
    border-radius: 16px;
    display: inline-block;
    margin-bottom: .5rem;
}

.coin .item .item-item-image {
    min-width: 260px;
    max-width: 260px;
}

@media only screen and (max-width: 599px) {
    .coin .item .item-item-image {
        max-width: 35%;
        min-width: 35%;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin .item .item-item-image {
        min-width: 200px;
        max-width: 200px;
    }
}

.popular-articles {
    position: sticky;
    top: 70px;
    padding: 1rem;
    background: #F6F9FB;
    border-radius: 10px;
    margin-top: 2.5rem;
}

@media only screen and (max-width: 599px) {
    .popular-articles {
        margin: 3rem 0;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .popular-articles {
        margin: 3rem 0;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .popular-articles {
        margin: 3rem 0;
    }
}

.popular-articles .popular-articles-title {
    margin-bottom: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.popular-articles .popular-articles-title a {
    color: #20A89D;
    font-size: 14px;
}

.popular-articles .popular-articles-body {
    display: grid;
    gap: 20px;
}

.popular-articles .popular-articles-item {
    position: relative;
    display: grid;
    align-items: start;
    gap: 10px;
}

@media only screen and (max-width: 599px) {
    .popular-articles .popular-articles-item {
        gap: 12px;
    }
}

.popular-articles .popular-articles-item-image {
    display: flex;
}

@media only screen and (max-width: 599px) {
    .popular-articles .popular-articles-item-image {
        max-width: 35%;
        min-width: 35%;
    }
}

.popular-articles .popular-articles-item-image img {
    border-radius: 5px;
}

.popular-articles .popular-articles-item-title {
    font-weight: 500;
    font-size: 0.8125rem;
    line-height: 26px;
}

.popular-articles .popular-articles-item-title a {
    display: inline-block;
    color: var(--background-color-heading);
}

.popular-articles .popular-articles-item-title a::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
}

.category-post .category-post__meta span,
.category-item-tools span,
.latest-articles-item .latest-articles-item-tools span {
    font-size: 11px;
    color: var(--background-color-text);
    display: flex;
    align-items: center;
    gap: .3rem;
}

.latest-articles-multi {
    display: grid;
    gap: 20px;
}

.latest-articles-multi .latest-articles-item-mini {
    position: relative;
    display: flex;
    border-radius: 10px;
}

@media only screen and (max-width: 599px) {
    .latest-articles-multi .latest-articles-item-mini {
        background: unset;
        gap: 12px;
    }
}

.latest-articles-multi .latest-articles-item-mini-image {
    min-width: 250px;
    max-width: 250px;
}

.latest-articles-multi .latest-articles-item-mini-title {
    font-size: 1rem;
    line-height: 26px;
}

.latest-articles-multi .latest-articles-item-mini-title a {
    color: var(--background-color-heading);
}

.latest-articles-multi .latest-articles-item-mini-title a::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
}

.latest-articles-item-mini-image img {
    border-radius: 10px;
    display: flex;
}

.latest-articles-item-mini-tools {
    display: flex;
    align-items: center;
    margin-top: 1rem;
}

.latest-articles-item-mini-tools span {
    font-size: 11px;
    color: var(--background-color-text);
    display: flex;
    align-items: center;
    gap: .3rem;
}

.latest-articles-item-mini-tools span:last-child::before {
    content: '';
    margin: 0 .5rem;
    width: 1px;
    height: 10px;
    background: var(--background-color-border);
}

.rating-flex {
    display: flex;
    gap: 20px;
}

@media only screen and (max-width: 599px) {
    .rating-flex {
        display: block;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .rating-flex {
        display: block;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .rating-flex {
        display: block;
    }
}

.rating-articles .rating-articles-title {
    margin-bottom: 1.5rem;
}

.rating-articles .rating-articles-body {
    background: var(--background-color-box);
    border: 1px solid var(--background-color-border);
    border-radius: 10px;
    padding: .5rem 1rem;
    display: grid;
    margin-bottom: 1rem;
}

.rating-articles .rating-articles-body-title {
    border-bottom: 2px solid var(--background-color-border);
    padding: 5px 0 10px 0;
}

.rating-articles .rating-articles-item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 15px;
    padding: .7rem 0;
    border-bottom: 1px solid var(--background-color-border);
}

@media only screen and (max-width: 599px) {
    .rating-articles .rating-articles-item {
        gap: 12px;
    }
}

.rating-articles .rating-articles-item:last-child {
    border: unset;
}

.rating-articles .rating-articles-item-image {
    max-width: 120px;
    min-width: 120px;
    display: flex;
}

@media only screen and (max-width: 599px) {
    .rating-articles .rating-articles-item-image {
        max-width: 35%;
        min-width: 35%;
    }
}

.rating-articles .rating-articles-item-image img {
    border-radius: 5px;
}

.rating-articles .rating-articles-item-title {
    font-size: .9rem;
    font-weight: 500;
    line-height: 26px;
}

@media only screen and (max-width: 599px) {
    .rating-articles .rating-articles-item-title {
        font-size: 0.8125rem;
    }
}

.rating-articles .rating-articles-item-title a {
    display: inline-block;
    color: var(--background-color-heading);
}

.rating-articles .rating-articles-item-title a::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
}

.sidebar-currencies .sidebar-currencies-title {
    margin-bottom: 1.5rem;
}

.sidebar-articles {
	width: 100%;
	padding: 24px;
	background-color: var(--background-color-box);
	border-radius: 12px;
}

.sidebar-articles .sidebar-articles-title {
    margin-bottom: 1.5rem;
}

.sidebar-articles .sidebar-articles-body {
    display: grid;
    gap: 20px;
}

.sidebar-articles .sidebar-articles-item {
    position: relative;
    display: flex;
    align-items: start;
    gap: 15px;
}

.sidebar-articles .sidebar-articles-item-image {
    max-width: 120px;
    min-width: 120px;
    display: flex;
}

@media only screen and (max-width: 599px) {
    .sidebar-articles .sidebar-articles-item-image {
        max-width: 35%;
        min-width: 35%;
    }
}

.sidebar-articles .sidebar-articles-item-image img {
    border-radius: 10px;
}

.sidebar-articles .sidebar-articles-item-title {
    font-weight: 500;
    font-size: 0.8125rem;
    line-height: 26px;
}

.sidebar-articles .sidebar-articles-item-title a {
    display: inline-block;
    color: var(--background-color-heading);
}

.sidebar-articles .sidebar-articles-item-title a::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
}

.related-posts {
    padding: 24px;
    background-color: var(--background-color-box);
    border-radius: 12px;
    margin-top: 16px;
}

.related-posts .related-posts__title {
    margin-bottom: 1.5rem;
}

.search-header {
    height: 180px;
    padding-top: 50px;
    z-index: 1;
    position: relative;
    margin-bottom: 2rem;
    background: #ededef;
}

.search-header-cover {
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(https://mag.arzwatch.ir/wp-content/uploads/2023/04/crypto-magazine-articles-academy-arzwatch-light-mode.jpg);
    background-attachment: scroll;
    background-position: center center;
}

.search-header-content {
    display: block;
    margin-bottom: 45px;
    text-align: center;
}

@media only screen and (max-width: 599px) {
    .search-title {
        font-size: 22px;
    }
}

.search-subtitle {
    display: block;
    margin-top: 10px;
}

.search-header-form {
    margin-bottom: 2rem;
}

.search-header-form .search-form {
    border-radius: 5px;
    width: 500px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    box-shadow: 0 0 40px #0000001f !important;
}

@media only screen and (max-width: 599px) {
    .search-header-form .search-form {
        width: 100%;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .search-header-form .search-form {
        width: 100%;
    }
}

.search-form .search-field {
    width: 100%;
    background: var(--background-color-bg);
    padding: 1.1rem;
    border-radius: 0 5px 5px 0;
}

@media only screen and (max-width: 599px) {
    .search-form .search-field {
        padding: .8rem;
    }
}

.search-submit {
    width: 80px;
    padding: 1.1rem 0;
    border-radius: 5px 0 0 5px;
}

@media only screen and (max-width: 599px) {
    .search-submit {
        padding: .8rem 0;
    }
}

/* currencies */
.fng-line {
    position: relative;
}

.fng-line .fng-line__value {
    top: 16px;
    position: absolute;
}

.fng-line .fng-line__circle {
    position: absolute;
    top: 6px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    border: unset;
    background: #000;
    border: 2px solid #fff;
}

.currencies-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 3rem 0px;
}

@media only screen and (max-width: 599px) {
    .currencies-header {
        display: block;
    }
}

.currencies-header .currencies-header__right {
    flex: 1;
}

@media only screen and (max-width: 599px) {
    .currencies-header .currencies-header__right {
        margin-bottom: 2rem;
        text-align: center;
    }
}

.currencies-header .currencies-header__title {
    font-size: 1.313rem;
    color: #131417;
}

@media only screen and (max-width: 599px) {
    .currencies-header .currencies-header__title {
        font-size: 18px;
    }
}

.currencies-header .currencies-header__subtitle {
    margin-top: .7rem;
    display: block;
    color: #131417;
    font-size: 0.875rem;
}

@media only screen and (max-width: 599px) {
    .currencies-header .currencies-header__subtitle {
        margin-top: .3rem;
        font-size: 0.75rem;
    }
}

.currencies-header .currencies-header__text {
    color: #131417;
}

.currencies-header .currencies-header__subtext {
    color: #131417;
    font-size: 0.875rem;
}

.currencies-header .currencies-header__img {
    width: 50px;
    height: 50px;
}

.currencies-header .currencies-header__left {
    display: flex;
    flex-wrap: wrap;
    justify-content: end;
    gap: 2rem;
    flex: 1;
}

@media only screen and (max-width: 599px) {
    .currencies-header .currencies-header__left {
        justify-content: center;
        gap: .7rem;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .currencies-header .currencies-header__left {
        gap: 1.25rem;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .currencies-header .currencies-header__left {
        gap: 1.5rem;
    }
}

.currencies-header .currencies-header__box {
    display: flex;
    gap: .5rem;
    align-items: center;
    min-width: 260px;
    background: var(--background-color-box);
    padding: .5rem .7rem;
    border-radius: 10px;
    border: 1px solid var(--background-color-border);
    width: 260px;
    height: 80px;
}

.highlights .table {
    background: var(--background-color-box);
}


.tables {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2rem;
}

.table {
    min-width: 0;
    padding: .7rem 1rem;
    border-radius: 10px;
    box-shadow: 0 4px 24px 0 rgba(88, 102, 126, .08), 0 1px 2px 0 rgba(88, 102, 126, .12);
}

.table .table__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.table .table__caption {
    display: block;
    text-align: right;
    color: #131417;
    padding: .1rem 0rem .7rem;
    font-size: 0.875rem;
    font-weight: 600;
}

.table-content__difference-price:not(.duration-24h),
.table__caption-num:not(.duration-24h),
.table-content__image img:not(.duration-24h){
    display: none;
}

.table .table__caption-price {
    font-weight: normal;
}

.table .table__caption-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.table .table__caption-content {
    display: flex;
    gap: .7rem;
    align-items: center;
    font-size: 16px;
}

.table .table__caption-image {
    width: 55px;
    height: 55px;
    display: flex;
}

.table .table-content__duration {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f8fbfd;
    padding: .1rem .5rem;
    border-radius: 10px;
    margin-bottom: 10px;
}

.table .table-content__duration-prev,
.table .table-content__duration-next {
    display: flex;
    cursor: pointer;
}

.table table {
    width: 100%;
}

.table .table__flex {
    display: grid;
    grid-template-columns: 256px 1fr;
    gap: 10px;
}

.table .table-content__image {
    background: #f8fbfd;
    padding: 12px;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
}

.table .table-content__difference {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 10px;
}

.table .table-content__difference-item {
    background: #f8fbfd;
    padding: 12px;
    border-radius: 10px;
    padding: 10px;
    text-align: center;
}
/* هایلایت‌ها در همه سایزها نمایش داده می‌شوند؛ گرید در عرض‌های کمتر پشته می‌شود
   (قبلاً زیر 1280px کل بخش display:none بود) */
@media only screen and (max-width: 1279px) {
    .tables {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1.25rem;
    }
}

@media only screen and (max-width: 767px) {
    .tables {
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
    }

    /* باکس نرخ لحظه‌ای تتر: نمودار تمام‌عرض، آمار بالاترین/پایین‌ترین کنار هم */
    .table .table__flex {
        grid-template-columns: minmax(0, 1fr);
    }

    /* ترس و طمع: دو سکشن کنار هم؛ آیتم‌های زمانی داخل سکشن دوم زیر هم می‌مانند */
    .table .table__flex--fng {
        grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    }
    .table .table-content__difference {
        flex-direction: row;
        gap: 10px;
    }
    .table .table-content__difference-item {
        flex: 1 1 0;
        min-width: 0;
    }
    .table .table__caption-wrapper {
        flex-wrap: wrap;
        gap: 6px;
    }
}

.table .table-content__difference-title {
    color: var(--background-color-text);
    font-size: 0.813rem;
    margin-bottom: .2rem;
}

.table .table-content__item {
    background: #f8fbfd;
    border-radius: 10px;
    padding: 12px;
}

.table .table__item {
    background: #f8fbfd;
    padding: 12px;
    border-radius: 10px;
    padding: 12px;
}

.table .table__section {
    background: #f8fbfd;
    padding: 12px;
    border-radius: 10px;
    justify-content: space-between;
    display: flex;
    flex-direction: column;
}

.table .table__items {
    display: flex;
    align-items: center;
    gap: 8px;
}

.table .table__items-descripton {
    margin-top: 8px;
}

.table .table__tr {
    display: flex;
    align-items: center;
    gap: 2rem;
    color: var(--background-color-heading);
    padding: .5rem 0;
    border-radius: 10px;
}

.table .table__image {
    width: 35px;
    height: 35px;
    border-radius: 100%;
}

.table .table__td,
.table .table__th {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex: max-content;
    text-align: center;
    color: var(--background-color-heading);
}

.table .table__small {
    color: var(--background-color-text);
    display: inline-block;
    white-space: nowrap;
}

.tables .table__td {
    text-align: left;
    flex: 1;
    font-size: 0.813rem;
}

.tables .table__td-link {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: var(--background-color-heading);
    width: 100%;
    min-width: 0;
}

.tables .table__td-name {
    text-align: right;
    flex: 2;
    min-width: 0; /* اجازه بده در فلکس کوچک‌تر از محتوا شود تا سه‌نقطه فعال شود */
    white-space: nowrap;
}

/* نام بلند ارز (مثل tokenized ETFها) به‌جای شکستن ساختار، سه‌نقطه می‌خورد.
   div نام داخل .table__td-link است، نه فرزند مستقیم .table__td-name */
.tables .table__td-link > div {
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    /* نام ارزها انگلیسی (LTR) است ولی کادر RTL؛ بدون این، مرورگر سه‌نقطه را از
       ابتدای نام می‌گذارد و نتیجه «...cture Framework» می‌شود.
       plaintext جهت را از خودِ متن تشخیص می‌دهد، پس برش از انتهای نام انجام می‌شود. */
    unicode-bidi: plaintext;
}

/* آیکون هرگز فشرده نشود؛ فضای باقی‌مانده مال نام است */
.tables .table__td-link > img {
    flex: 0 0 auto;
}

.tables .table__td-name small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    unicode-bidi: plaintext;
}

.tables .table__td-price {
    display: flex;
    justify-content: end;
    gap: .25rem;
    align-items: center;
    white-space: nowrap;
}

.tables .table__td div,
.tables .table__td-name div,
.tables .table__td span {
    width: 100%;
}

.table .table__tabs {
    display: inline-flex;
    align-items: center;
    background-color: #eff2f5;
    padding: 3px;
    border-radius: 8px;
}

.table .table__tabs li {
    list-style: none;
    cursor: pointer;
}

.table-content {
    display: none;
}

.table-content.active {
    display: table;
}

.table .table__tabs li div {
    padding: 5px 8px;
    display: flex;
    align-items: center;
    border-radius: 7px;
}

.table .table__tabs li.active div {
    background: #fff;
}

.other-data {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding: 2rem 0 2rem;
    flex-wrap: wrap;
}

@media only screen and (max-width: 599px) {
    .other-data {
        gap: .7rem;
        padding: 1rem 0 3.5rem;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .other-data {
        gap: 1.25rem;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .other-data {
        gap: 1.5rem;
    }
}

.other-data .other-data__item {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    flex: 1;
    background: var(--background-color-box);
    color: var(--background-color-heading);
    padding: .8rem 1.2rem;
    border-radius: 10px;
    font-size: 0.875rem;
    align-items: center;
}

@media only screen and (max-width: 599px) {
    .other-data .other-data__item {
        display: block;
    }
}

.other-data .other-data__item-price {
    text-align: left;
    display: grid;
    gap: .2rem;
}

@media only screen and (max-width: 599px) {
    .other-data .other-data__item-price {
        margin-top: .7rem;
    }
}

.other-data .other-data__item-price-t {
    display: flex;
    align-items: center;
    gap: .3rem;
    justify-content: end;
}

.other-data .other-data__item-name {
    white-space: nowrap;
}

.other-data .other-data__small {
    color: var(--background-color-text);
    display: inline-block;
}

.sidebar-currencies {
	width: 100%;
    padding: 24px;
    background-color: var(--background-color-box);
    border-radius: 12px;
    position: sticky;
    top: 95px;
}

.table-grid {
    width: 100%;
    display: block;
}

.sidebar-table {
    font-size: 0.813rem;
}

.table-grid .table-grid__caption {
    display: block;
    text-align: right;
    color: #131417;
    padding: 0 .7rem .4rem;
}

.table-grid .table-grid__thead {
    position: sticky;
    top: 0;
    background: var(--background-color-bg);
    z-index: 1;
}

.table-grid .table-grid__thead,
.table-grid .table-grid__tbody {
    display: grid;
    gap: .5rem;
}

@media only screen and (max-width: 599px) {
    .table-grid .table-grid__thead {
        display: none;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .table-grid .table-grid__thead {
        display: none;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .table-grid .table-grid__thead {
        display: none;
    }
}

@media only screen and (max-width: 599px) {
    .table-grid .table-grid__tbody {
        display: grid;
        gap: .7rem;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .table-grid .table-grid__tbody {
        display: grid;
        gap: 1.25rem;
        grid-template-columns: repeat(3, 1fr);
    }
}

.table-grid .table-grid__image {
    width: 45px;
}

@media only screen and (max-width: 599px) {
    .table-grid .table-grid__image {
        order: 1;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .table-grid .table-grid__image {
        order: 1;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .table-grid .table-grid__image {
        order: 1;
    }
}

.table-grid .table-grid__tr {
    display: grid;
    grid-template-columns: 25px 25px 150px 130px 110px 110px 110px 1fr 1fr 1fr;
    align-items: center;
    gap: 2.5rem;
    color: #fff;
    padding: .7rem 1rem;
    border-radius: 10px;
    font-size: 14px;
}

@media only screen and (max-width: 599px) {
    .table-grid .table-grid__tr {
        display: block;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .table-grid .table-grid__tr {
        display: block;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .table-grid .table-grid__tr {
        display: block;
    }
}

.table-grid.sidebar-table .table-grid__tr {
	grid-template-columns: 120px 100px 1fr;
	gap: 1.3rem;
	padding: .7rem 0;
}

.table-grid .table-grid__tr:nth-child(2n+1) {
    background: var(--background-color-box);
}

.table-grid .table-grid__svg {
    width: 12px;
    height: auto;
    fill: #131417;
}

.table-grid .table-grid__th {
    cursor: pointer;
    transition: .3s
}

.table-grid .table-grid__th.th_name {
    justify-content: start !important;
    width: 150px;
}

.table-grid .table-grid__th.th_price {
    width: 150px;
}

.table-grid .table-grid__th.active svg {
    transform: rotate(180deg);
}

.table-grid .table-grid__td,
.table-grid .table-grid__th {
    display: flex;
    align-items: center;
    flex: max-content;
    text-align: right;
    color: var(--background-color-heading);
}

.table-grid .table-grid__th {
    gap: .5rem;
}

.table-grid .table-grid__td {
    position: relative;
}

@media only screen and (max-width: 599px) {
    .table-grid .table-grid__td {
        border: none;
        border-bottom: 1px solid var(--background-color-border);
        position: relative;
        display: flex;
        justify-content: space-between;
        padding: .5rem 0;
        font-size: 0.875rem;
    }

    .table-grid .table-grid__td.table-count {
        display: none;
    }

    .table-grid .table-grid__td:last-child {
        border-bottom: unset;
    }

    .table-grid .table-grid__td:nth-of-type(2)::before {
        content: "نام ارز";
    }

    .table-grid .table-grid__td:nth-of-type(3)::before {
        content: "آخرین قیمت";
    }

    .table-grid .table-grid__td:nth-of-type(4)::before {
        content: "تغییرات - 1 ساعته";
    }

    .table-grid .table-grid__td:nth-of-type(5)::before {
        content: "تغییرات - 24 ساعته";
    }

    .table-grid .table-grid__td:nth-of-type(6)::before {
        content: "تغییرات - 7 روزه";
    }

    .table-grid .table-grid__td:nth-of-type(7)::before {
        content: "ارزش بازار";
    }
    
    .table-grid .table-grid__td:nth-of-type(8)::before {
        content: "معاملات روزانه";
    }

    .table-grid .table-grid__td:nth-of-type(9)::before {
        content: "نمودار هفتگی";
    }

    .table-grid .table-grid__td::before {
        width: 45%;
        white-space: nowrap;
        text-align: right;
        font-size: 0.813rem;
    }
    
    .sidebar-currencies .table-grid .table-grid__td:nth-of-type(1)::before {
        content: "نام ارز";
    }
    
    .sidebar-currencies .table-grid .table-grid__td:nth-of-type(2)::before {
        content: "آخرین قیمت";
    }
    
    .sidebar-currencies .table-grid .table-grid__td:nth-of-type(3)::before {
        content: "تغییرات - 24 ساعته";
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .table-grid .table-grid__td {
        border: none;
        border-bottom: 1px solid var(--background-color-border);
        position: relative;
        display: flex;
        justify-content: space-between;
        padding: .5rem 0;
        font-size: 0.875rem;
    }

    .table-grid .table-grid__td.table-count {
        display: none;
    }

    .table-grid .table-grid__td:last-child {
        border-bottom: unset;
    }

    .table-grid .table-grid__td:nth-of-type(2)::before {
        content: "نام ارز";
    }
    
    .table-grid .table-grid__td:nth-of-type(3)::before {
        content: "آخرین قیمت";
    }

    .table-grid .table-grid__td:nth-of-type(4)::before {
        content: "تغییرات - 1 ساعته";
    }

    .table-grid .table-grid__td:nth-of-type(5)::before {
        content: "تغییرات - 24 ساعته";
    }

    .table-grid .table-grid__td:nth-of-type(6)::before {
        content: "تغییرات - 7 روزه";
    }

    .table-grid .table-grid__td:nth-of-type(7)::before {
        content: "ارزش بازار";
    }

    .table-grid .table-grid__td:nth-of-type(8)::before {
        content: "نمودار هفتگی";
    }

    .table-grid .table-grid__td::before {
        width: 45%;
        white-space: nowrap;
        text-align: right;
        font-size: 0.813rem;
    }
    
    .sidebar-currencies .table-grid .table-grid__td:nth-of-type(1)::before {
        content: "نام ارز";
    }
    
    .sidebar-currencies .table-grid .table-grid__td:nth-of-type(2)::before {
        content: "آخرین قیمت";
    }
    
    .sidebar-currencies .table-grid .table-grid__td:nth-of-type(3)::before {
        content: "تغییرات - 24 ساعته";
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .table-grid .table-grid__td {
        border: none;
        border-bottom: 1px solid var(--background-color-border);
        position: relative;
        display: flex;
        justify-content: space-between;
        padding: .5rem 0;
        font-size: 0.875rem;
    }

    .table-grid .table-grid__td.table-count {
        display: none;
    }

    .table-grid .table-grid__td:last-child {
        border-bottom: unset;
    }

    .table-grid .table-grid__td:nth-of-type(2)::before {
        content: "نام ارز";
    }

    .table-grid .table-grid__td:nth-of-type(3)::before {
        content: "آخرین قیمت";
    }

    .table-grid .table-grid__td:nth-of-type(4)::before {
        content: "تغییرات - 1 ساعته";
    }

    .table-grid .table-grid__td:nth-of-type(5)::before {
        content: "تغییرات - 24 ساعته";
    }

    .table-grid .table-grid__td:nth-of-type(6)::before {
        content: "تغییرات - 7 روزه";
    }

    .table-grid .table-grid__td:nth-of-type(7)::before {
        content: "ارزش بازار";
    }

    .table-grid .table-grid__td:nth-of-type(8)::before {
        content: "نمودار هفتگی";
    }

    .table-grid .table-grid__td::before {
        width: 45%;
        white-space: nowrap;
        text-align: right;
        font-size: 0.813rem;
    }
    
    .sidebar-currencies .table-grid .table-grid__td:nth-of-type(1)::before {
        content: "نام ارز";
    }
    
    .sidebar-currencies .table-grid .table-grid__td:nth-of-type(2)::before {
        content: "آخرین قیمت";
    }
    
    .sidebar-currencies .table-grid .table-grid__td:nth-of-type(3)::before {
        content: "تغییرات - 24 ساعته";
    }
}

.table-grid .table-grid__td.table-count {
    font-weight: 600;
    color: var(--background-color-text);
}

@media only screen and (max-width: 599px) {
    .table-grid .table-grid__td.table-count {
        display: none;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .table-grid .table-grid__td.table-count {
        display: none;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .table-grid .table-grid__td.table-count {
        display: none;
    }
}

.table-grid .table-grid__td img {
    height: 45px;
    font-size: 0.75rem;
    display: flex;
    align-items: center;
}

.table-grid .table-grid__td-name img {
    height: 35px;
    width: auto;
    border-radius: 100%;
}

.table-grid .table-grid__td-link {
    color: var(--background-color-heading);
    width: 100%;
}

@media only screen and (max-width: 599px) {
    .table-grid .table-grid__td-link::after {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        pointer-events: auto;
        content: "";
        background-color: rgba(0, 0, 0, 0);
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .table-grid .table-grid__td-link::after {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        pointer-events: auto;
        content: "";
        background-color: rgba(0, 0, 0, 0);
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .table-grid .table-grid__td-link::after {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        pointer-events: auto;
        content: "";
        background-color: rgba(0, 0, 0, 0);
    }
}

.table-grid .table-grid__td div {
    width: 100%
}

@media only screen and (max-width: 999px) {
    .table-grid .table-grid__td div {
        text-align: left;
        gap: .5rem;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .table-grid .table-grid__td div {
        text-align: left;
        gap: .5rem;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .table-grid .table-grid__td div {
        text-align: left;
        gap: .5rem;
    }
}

.table-grid .table-grid__td-name {
    display: flex;
    align-items: center;
    gap: 1rem;
    text-align: right;
    width: 170px !important;
}

/* نام بلند ارز در جدول اصلی هم سه‌نقطه می‌خورد (ساختار را نمی‌ترکاند) */
.table-grid .table-grid__td-name > div {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.table-grid .table-grid__td-name > div small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media only screen and (max-width: 999px) {
    .table-grid .table-grid__td-name {
        width: 100% !important;
    }
}

.home-currencies .table-grid .table-grid__td-name {
    width: 100% !important;
}

.table-grid .table-grid__td-name small {
    display: block;
}

.table-grid .table-grid__td-price,
.table-grid .table-grid__td-market,
.table-grid .table-grid__td-volume {
    white-space: nowrap;
}

/*.table-grid .table-grid__td-price-dollar,*/
/*.table-grid .table-grid__td-market-dollar,*/
/*.table-grid .table-grid__td-volume-dollar {*/
/*    display: flex;*/
/*    align-items: center;*/
/*    gap: .3rem;*/
/*}*/

.table-grid .table-grid__small {
    display: inline-block;
    color: var(--background-color-text);
}

.search-table,
.dataTables_filter {
    padding: 3rem 0 1.5rem;
}

@media only screen and (max-width: 599px) {

    .search-table,
    .dataTables_filter {
        padding: 1rem 0 1.5rem;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {

    .search-table,
    .dataTables_filter {
        padding: 1rem 0 1.5rem;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {

    .search-table,
    .dataTables_filter {
        padding: 1rem 0 1.5rem;
    }
}

.search-table .search-table__input,
.dataTables_filter input {
    padding: 1rem;
    background: var(--background-color-box-pale);
    color: #131417;
    border-radius: 1rem;
    width: 260px;
    font-size: 0.813rem;
}

.currencies-title {
    margin-bottom: 1.5rem;
}

.currencies-content {
    position: relative;
}

.currencies-content a {
    color: var(--background-color-company);
}

.hideContent {
    max-height: 350px;
    overflow: hidden;
}

.showContent {
    height: auto;
}

.currencies-content.showContent::after {
    opacity: 0;
    pointer-events: none;
}

/* محو تدریجی انتهای متن.
   نکته: این محتوا داخل کارت سفید (--background-color-box) است، نه روی پس‌زمینهٔ صفحه.
   قبلاً گرادیانت به خاکستریِ پس‌زمینهٔ صفحه می‌رفت و یک لکهٔ کدر روی سفید می‌انداخت. */
.currencies-content::after {
    content: "";
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    height: 5.5em;
    background: linear-gradient(180deg,
            rgba(255, 255, 255, 0) 0%,
            rgba(255, 255, 255, .85) 55%,
            var(--background-color-box) 100%);
    transition: opacity .25s ease;
    pointer-events: none;
}

.currencies-content p,
.currencies-live-content p,
.page-content p,
.currencies-content ul,
.page-content ul,
.post-txt-single p,
.post .description p,
.page .page__content p,
.post-content p,
.post-content li {
    line-height: 31px;
    font-size: 0.938rem;
    margin-bottom: 1rem;
    color: var(--background-color-read);
}

@media only screen and (max-width: 599px) {

    .currencies-content p,
    .currencies-live-content p,
    .page-content p,
    .currencies-content ul,
    .page-content ul,
    .post-txt-single p,
    .post .description p,
    .page .page__content p,
    .post-content p {
        font-size: 0.875rem;
    }
}

.currencies-live {
    padding: 24px;
    background-color: var(--background-color-box);
    border-radius: 12px;
}

.currencies-live-content {
    margin-bottom: 2rem;
}

.post .description p {
    line-height: 30px;
}

.page-content a {
    color: var(--background-color-company);
}

.currencies-content ul,
.page-content ul,
.post-content ul,
.currencies-content ol,
.page-content ol,
.post-content ol {
    margin-bottom: 1rem;
}

.currencies-content h2,
.page-content h2,
.post-content h2,
.currencies-content h3,
.page-content h3,
.post-content h3,
.currencies-content h4,
.page-content h4,
.post-content h4,
.currencies-content h5,
.page-content h5,
.post-content h5,
.currencies-content h6,
.page-content h6,
.post-content h6 {
    color: var(--background-color-company);
    margin-bottom: .3rem;
}

.currencies-content h2,
.page-content h2 {
    font-size: 20px;
}

.page-content table {
    font-size: 0.875rem;
    color: var(--background-color-text);
}

.currencies-content h3 {
    font-size: 18px;
}

.show-more {
    display: flex;
    justify-content: center;
    padding: .75rem 0 0;
}

.show-more .show-more__click {
    color: var(--background-color-company);
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .5rem 1.25rem;
    border: 1px solid var(--background-color-border);
    border-radius: 999px;
    font-size: .875rem;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .2s ease, border-color .2s ease;
}

.show-more .show-more__click:hover {
    background-color: var(--background-color-box-pale);
    border-color: var(--background-color-company);
}

.show-more .show-more__click svg {
    fill: var(--background-color-company);
    width: 10px;
    transition: transform .25s ease;
}

/* وقتی متن باز است، فلش برعکس می‌شود */
.currencies-content.showContent + .show-more .show-more__click svg {
    transform: rotate(180deg);
}

/* currencies */

/* breadcrumb */
.breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
    padding: .5rem 0;
    margin-top: 1rem;
    border-radius: 8px;
    font-size: 0.938rem;
    line-height: 1.4;
    color: var(--background-color-text-pale);
}

.breadcrumb a {
    color: var(--background-color-text-pale);
    text-decoration: none;
    transition: color 0.15s;
}

.breadcrumb a:hover {
    color: var(--background-color-company);
}

/* current page (direct span child — not wrapped in <a>) */
.breadcrumb > span:last-child > span[itemprop="name"] {
    color: var(--background-color-heading);
    font-weight: 600;
}

/* coin-data */
.coin {
    display: grid;
    grid-template-columns: 2.8fr 1fr;
    gap: 1rem;
    padding: 1rem 0;
}

@media only screen and (max-width: 599px) {
    .coin {
        grid-template-columns: unset;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin {
        grid-template-columns: unset;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .coin {
        grid-template-columns: unset;
    }
}

.post-page {
    display: grid;
    grid-template-columns: 2.7fr 1fr;
    gap: 1rem;
    padding: 1rem 0;
}

@media only screen and (max-width: 599px) {
    .post-page {
        grid-template-columns: unset;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .post-page {
        grid-template-columns: unset;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .post-page {
        grid-template-columns: unset;
    }
}

.post-content {
    flex: 1;
    width: 100%;
    gap: 1rem;
    display: flex;
    flex-direction: column;
}

.coin-data {
    flex: 1;
    width: 100%;
    gap: 1rem;
    display: flex;
    flex-direction: column;
}

.coin-data .coin-data__details {
    padding: 24px;
    background-color: var(--background-color-box);
    border-radius: 12px;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__details {
        padding: 16px;
    }
}

.coin-data .coin-data__row1 {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: 3rem;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__row1 {
        display: block;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin-data .coin-data__row1 {
        display: block;
    }
}

.coin-data .coin-data__row1-right {
    display: grid;
    gap: 1rem;
    flex: 1;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__row1-right {
        gap: 1rem;
        display: grid;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin-data .coin-data__row1-right {
        gap: 1rem;
        display: grid;
    }
}

.coin-data .coin-data__row1-logo-price {
    display: flex;
    justify-content: space-between;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__row1-logo-price {
        display: grid;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin-data .coin-data__row1-logo-price {
        display: grid;
        gap: .5rem
    }
}

.coin-data .coin-data__row1-right>div:last-child {
    flex: 1;
}

.coin-data .coin-data__featured {
    display: flex;
    gap: 2rem;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__featured {
        gap: 1rem;
    }
}

.coin-data .coin-data__featured img {
    width: 80px;
    height: 80px;
    border-radius: 100%;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__featured img {
        width: 60px;
        height: 60px;
    }
}

.coin-data .coin-data__title {
    color: var(--background-color-heading);
    font-weight: 700;
    font-size: 2.125rem;
    height: 48px;
    overflow: hidden;
    max-width: 320px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__title {
        height: 35px;
        font-size: 25px;
        max-width: 185px;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin-data .coin-data__title {
        height: 35px;
        font-size: 25px;
    }
}

.coin-data .coin-data__stitle {
    color: var(--background-color-text);
    font-weight: 700;
    font-size: 23px;
    display: flex;
    align-items: center;
    gap: .5rem;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__stitle {
        font-size: 25px;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin-data .coin-data__stitle {
        font-size: 25px;
    }
}

.coin-data .coin-data__stitle-symbol {
    font-size: 1.5rem;
    line-height: 9px;
    background-color: var(--background-color-box-pale);
    border-radius: 4px;
    padding: 9px 8px;
    font-size: 0.813rem;
}

.coin-data .coin-data__stitle-title {
    overflow: hidden;
    max-width: 320px;
    white-space: nowrap;
    text-overflow: ellipsis;
    direction: ltr;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__stitle-title {
        max-width: 135px;
    }
}

.coin-data .coin-data__links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    color: var(--background-color-link-pale);
    margin-top: .5rem;
}

.coin-data .coin-data__links-link {
    font-size: 0.75rem;
    background: var(--background-color-box-pale);
    border-radius: 0.5rem;
}

.coin-data .coin-data__links-link:hover {
    background: #e9ecf2;
}

.coin-data .coin-data__links-link a {
    padding: .25rem 0.625rem;
}

.coin-data .coin-data__links-link,
.coin-data .coin-data__links-link a {
    color: var(--background-color-heading);
    display: flex;
    align-items: center;
    gap: .25rem;
}

.coin-data .coin-data__socials {
    font-size: 0.75rem;
    margin-top: 1.3rem;
}

.coin-data .coin-data__contracts {
    margin-top: 1rem;
    display: flex;
    align-items: stretch;
    gap: .2rem;
    position: relative;
}

.coin-data .coin-data__contracts-item,
.coin-data .coin-data__contracts-more-button {
    font-size: 0.75rem;
    padding: .3rem .4rem;
    background: var(--background-color-box);
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    gap: .3rem;
    direction: ltr;
    cursor: pointer;
    color: var(--background-color-text);
}

.coin-data .contracts-item-main,
.coin-data .coin-data__contracts-more-button {
    background: var(--background-color-box-pale);
}

@media only screen and (max-width: 599px) {

    .coin-data .coin-data__contracts-item,
    .coin-data .coin-data__contracts-more-button {
        font-size: 11px;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {

    .coin-data .coin-data__contracts-item,
    .coin-data .coin-data__contracts-more-button {
        font-size: 11px;
    }
}

.coin-data .coin-data__contracts-item-image {
    border-radius: 50px;
}

.coin-data .coin-data__contracts-item>* {
    pointer-events: none;
}

.coin-data .coin-data__contracts-more-button {
    padding-right: .5rem;
    padding-left: .5rem;
}

.coin-data .coin-data__contracts-more-item:not(.coin-data .coin-data__contracts-more-item:last-child) {
    margin-bottom: .5rem;
}

.coin-data .coin-data__contracts-item-more {
    position: absolute;
}

.coin-data .coin-data__contracts-item-name {
    color: var(--background-color-text);
}

.coin-data .coin-data__contracts-more-button svg,
.coin-data .coin-data__contracts-item-copy-icon svg {
    display: flex;
    width: 12px;
    fill: var(--background-color-text);
}

.coin-data .coin-data__contracts-item-copy-icon svg {
    display: none;
}

.coin-data .coin-data__contracts-item-copy-icon svg.active {
    display: block;
}

.coin-data__contracts-item-copy-contract {
    display: none;
}

.coin-data .coin-data__contracts-more {
    position: absolute;
    top: 32px;
    right: 0;
    display: grid;
    gap: .5rem;
    background: var(--background-color-box);
    border-radius: .5rem;
    padding: .2rem;
    display: none;
    box-shadow: 0 0px 70px 0 rgba(2, 2, 48, .2);
    max-height: 150px;
    overflow-y: auto;
    z-index: 1;
}

.coin-data .coin-data__contracts-item:hover {
    background: var(--background-color-box-pale);
}

.coin-data .coin-data__price-cover {
    display: flex;
    align-items: center;
    gap: .7rem;
}

.coin-data .coin-data__price-toman,
.coin-data .coin-data__price-dollar {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 700;
    color: var(--background-color-heading);
}

.coin-data .coin-data__price-dollar-num {
    font-size: 1.9rem;
}

.coin-data .coin-data__price-toman {
    color: var(--background-color-text);
    font-size: 1.4rem;
}

.coin-data .coin-data__price-symbol {
    font-size: 1rem;
}

.coin-data .coin-data__equivalent {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.938rem;
    color: var(--background-color-text);
    margin-bottom: 1rem;
}

.coin-data .coin-data__price-range {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--background-color-heading);
    font-size: 0.8rem;
}

.coin-data .coin-data__price-range small {
    color: var(--background-color-text);
    display: block;
    text-align: center;
}

.coin-data .coin-data__price-line {
    position: relative;
    width: 11rem;
    height: 0.375rem;
    border-radius: 0.375rem;
    background: var(--background-color-box-pale);
}

.coin-data .coin-data__price-line span {
    position: absolute;
    left: 0;
    top: 0;
    height: 0.375rem;
    background: var(--background-color-company);
    border-radius: 0.375rem;
}

.coin-data .coin-data__price-line span::after {
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    bottom: -10px;
    right: -3px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 8px solid var(--background-color-company);
    border-radius: 3px;
}

.coin-data .coin-data__row2 {
    display: flex;
    border-top-width: 1px;
    border-color: var(--background-color-border);
    border-style: solid;
    padding-top: 1rem;
    margin-top: 2rem;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__row2 {
        display: block;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin-data .coin-data__row2 {
        display: block;
    }
}

.coin-data .coin-data__row2-col {
    flex: 1;
    padding: 1rem 1rem 1rem 0rem;
    color: var(--background-color-heading);
    font-size: 0.938rem;
    border-left-width: 1px;
    border-color: var(--background-color-border);
    border-style: solid;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__row2-col {
        display: flex;
        justify-content: space-between;
        border-left-width: 0;
        border-bottom-width: 1px;
        padding: 1rem 0;
        font-size: 0.875rem;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin-data .coin-data__row2-col {
        display: flex;
        justify-content: space-between;
        border-left-width: 0;
        border-bottom-width: 1px;
        padding: 1rem 0;
    }
}

.coin-data .coin-data__row2-col:first-child {
    padding-right: 0;
}

.coin-data .coin-data__row2-col:last-child {
    border: unset;
    flex: 1.4;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__row2-col:last-child {
        display: block;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin-data .coin-data__row2-col:last-child {
        display: block;
    }
}

.coin-data .coin-data__row2-col-content {
    text-align: right;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__row2-col-content {
        text-align: left;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin-data .coin-data__row2-col-content {
        text-align: left;
    }
}

.coin-data .coin-data__row2-col-title {
    padding-bottom: .5rem;
    color: var(--background-color-text);
    font-size: 0.875rem;
    display: flex;
    align-items: center;
    gap: .2rem;
}

@media only screen and (max-width: 599px) {
    .coin-data .coin-data__row2-col-title {
        font-size: 0.813rem;
    }
}

.coin-data .coin-data__circulating-supply-line {
    position: relative;
    width: 100%;
    height: 0.375rem;
    background-color: var(--background-color-box-pale);
    border-radius: 0.375rem;
}

.coin-data .coin-data__circulating-supply-line span {
    position: absolute;
    left: 0;
    top: 0;
    height: 0.375rem;
    background: var(--background-color-company);
    border-radius: 0.375rem;
}

.coin-data .coin-data__circulating-supply-line span::after {
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    bottom: -10px;
    right: -3px;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 8px solid var(--background-color-company);
    border-radius: 3px;
}

.coin-data .coin-data__circulating-total-supplay,
.coin-data .coin-data__circulating-max-supplay {
    display: flex;
    justify-content: space-between;
    font-size: 0.875rem;
}

.coin-data .coin-data__circulating-max-supplay-title {
    color: var(--background-color-text);
    font-size: 0.813rem;
}

/* coin-data */

/*chart*/
.aw-modal-notif {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    background: rgba(0, 0, 0, .4);
    cursor: pointer;
}

#aw-click-capture {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10;
    background: rgba(0, 0, 0, .4);
    cursor: pointer;
    display: none;
}

#aw-modal {
    flex-direction: column;
    background-color: var(--background-color-box);
    border-radius: .7rem;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: calc(-70px + 100vh);
    width: calc(-70px + 100vw);
    display: none;
    z-index: 11;
}

.aw-modal .aw-modal__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.5rem;
}

@media only screen and (max-width: 599px) {
    .aw-modal .aw-modal__header {
        padding: 1rem;
        box-shadow: 0 0 2px #ccc;
    }
}

.aw-modal .aw-modal__header-close {
    cursor: pointer;
    display: flex;
    padding: .3rem;
    border-radius: 0.3rem;
}

.aw-modal .aw-modal__header-close:hover {
    background: var(--background-color-box-pale);
}

.aw-modal .aw-modal__header-title {
    font-weight: 500;
    font-size: 1.563rem;
}

@media only screen and (max-width: 599px) {
    .aw-modal .aw-modal__header-title {
        font-size: 1.25rem;
    }
}

.aw-modal .aw-modal__text {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
}

@media only screen and (max-width: 599px) {
    #aw-modal {
        height: 100vh;
        width: 100vw;
        border-radius: 0;
    }
}

#runScriptButton {
    display: flex;
    align-items: center;
    gap: .4rem;
    background: var(--background-color-box-pale);
    padding: .5rem .9rem;
    position: absolute;
    right: 12px;
    top: 12px;
    z-index: 1;
    border-radius: 0.5rem;
    font-size: 0.8em;
    color: var(--background-color-read);
    line-height: 20px;
    font-weight: 500;
}

#runScriptButton:hover {
    background: #e9ecf2;
}

#runScriptButton span {
    margin-top: .2rem;
}

@media only screen and (max-width: 599px) {
    #runScriptButton {
        background: var(--background-color-box);
        position: static;
        margin-bottom: .5rem;
    }
}

.professional-chart {
    height: 100%;
    padding: 0 1.5rem;
    flex: 1 1 0%;
}

@media only screen and (max-width: 599px) {
    .professional-chart {
        padding: 1rem;
    }
}

.custom-chart-wrapper {
    border-radius: 12px;
    overflow: hidden;
    position: relative;
}

.custom-chart-wrapper {
    height: 400px;
}

.custom-chart-wrapper .tradingview-widget-container,
.custom-chart-wrapper .tradingview-widget-container__widget,
.custom-chart-wrapper iframe {
    height: 100% !important;
    width: 100% !important;
}

@media screen and (max-width: 768px) {
    .custom-chart-wrapper {
        height: 320px;
    }
}

.tv-widget-chart {
    border: unset !important;
}

/*chart*/

/* coin-sidebar */
.side {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .side {
        display: grid;
        gap: 1.5rem;
        align-items: start;
        grid-template-areas: "b a" "b c";
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto 1fr;
    }
}

.side-single {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

@media only screen and (max-width: 599px) {
    .side-single {
        width: 100%;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .side-single {
        width: 100%;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .side-single {
        width: 100%;
    }
}

.sidebar {
    background-color: var(--background-color-box);
    width: 23rem;
    grid-area: b;
    padding: 24px;
    border-radius: 12px;
}

@media only screen and (max-width: 599px) {
    .sidebar {
        width: 100%;
        padding: 16px;
        order: 0;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .sidebar {
        width: 100%;
        padding: 1.5rem 1rem;
        order: 0;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .sidebar {
        width: 100%;
    }
}

.sidebar .sidebar__title {
    font-size: 1.063rem;
    margin-bottom: 1rem;
    color: var(--background-color-heading);
    overflow: hidden;
    max-width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.sidebar .sidebar__table {
    text-align: right;
    width: 100%;
    display: block
}

.sidebar .sidebar__table-caption {
    display: block;
    width: 100%;
    text-align: right;
    font-size: 0.8rem;
}

.sidebar .sidebar__table-tbody {
    width: 100%;
    display: block;
}

.sidebar .sidebar__table-tr {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom-width: 1px;
    border-style: solid;
    border-color: var(--background-color-border);
    font-size: 0.8rem;
    padding: .7rem 0;
}

.sidebar .sidebar__table-tr:last-child {
    border-bottom: unset;
}

.sidebar .sidebar__table-tr.sidebar_price th {
    overflow: hidden;
    max-width: 174px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.sidebar .sidebar__table-th {
    color: var(--background-color-text);
}

@media only screen and (max-width: 599px) {
    .sidebar .sidebar__table-th {
        font-size: 0.75rem;
    }
}

.sidebar .sidebar__table-td {
    color: var(--background-color-heading);
    font-weight: 700;
    font-size: 0.938rem;
    text-align: left;
}

@media only screen and (max-width: 599px) {
    .sidebar .sidebar__table-td {
        font-size: 0.875rem;
    }
}

.sidebar .sidebar__table-td small {
    font-weight: 500;
}

.sidebar .sidebar__table-td i {
    font-size: 0.75rem;
}

.sidebar .sidebar__table-mark {
    font-size: 11px;
    background: var(--background-color-box-pale);
    border-radius: 5px;
    padding: .1rem .3rem;
}

/* coin-sidebar */

/*calculator*/
.calculator {
    display: grid;
    gap: 1rem;
    background-color: var(--background-color-box);
    font-size: 0.875rem;
    width: 23rem;
    grid-area: a;
    padding: 24px;
    border-radius: 12px;
}

@media only screen and (max-width: 599px) {
    .calculator {
        width: 100%;
        padding: 16px;
        order: 1;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .calculator {
        width: 100%;
        order: 1;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .calculator {
        width: 100%;
        margin-bottom: 0;
    }
}

.calculator .calculator__title {
    font-size: 1.063rem;
    color: var(--background-color-heading);
    overflow: hidden;
    max-width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.calculator .calculator__cover {
    display: flex;
    align-items: center;
    background: var(--background-color-box-pale);
    border-radius: 10px;
    color: var(--background-color-heading);
    padding: 0 1rem;
    border: 2px solid var(--background-color-bg);
}

.calculator .calculator__cover {
    border: 2px solid #e3e3e3;
}

.calculator .calculator__cover span {
    display: flex;
    align-items: center;
    gap: .2rem;
    font-size: 0.813rem;
}

.calculator .calculator__label {
    color: var(--background-color-heading);
    margin-bottom: .3rem;
    display: inline-block;
    font-size: 0.813rem;
}

.calculator .calculator__input {
    width: 100%;
    background: transparent;
    padding: .7rem 0;
    color: var(--background-color-text);
}

.calculator .calculator__symbol {
    color: var(--background-color-text);
    width: max-content;
    direction: ltr;
    overflow: hidden;
    max-width: 85px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.calculator__currency-switcher {
    gap: 5px;
    flex-shrink: 0;
}

.calculator__currency-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0 2px;
    font-size: 0.813rem;
    color: var(--background-color-text);
    opacity: 0.4;
    transition: opacity 0.15s, color 0.15s;
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.2;
    white-space: nowrap;
}

.calculator__currency-btn.active {
    opacity: 1;
    color: var(--background-color-heading);
    font-weight: 600;
}

.calculator__currency-divider {
    opacity: 0.25;
    color: var(--background-color-text);
    font-size: 0.7em;
    flex-shrink: 0;
}

.click_capture-currencies {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9;
    background: rgba(0, 0, 0, .4);
    cursor: pointer;
    display: none;
}

.calculator-modal-cover {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100vh;
}

.calculator-modal {
    width: 22rem;
    border-radius: .7rem;
    background: var(--background-color-box);
    position: fixed;
    z-index: 10;
    display: none;
}

.calculator-modal .calculator-modal__header {
    position: sticky;
    top: 0;
    background: var(--background-color-box);
    padding: 1rem;
    border-radius: .7rem;
}

.calculator-modal .calculator-modal__header-title {
    text-align: center;
    padding: 0 0 1.3rem 0;
    color: var(--background-color-heading);
}

.calculator-modal .calculator-modal__header-title-close {
    right: 15px;
    position: absolute;
    cursor: pointer;
}

.calculator-modal .calculator-modal__header-search {
    display: flex;
    align-items: center;
    background: var(--background-color-box-pale);
    border-radius: 10px;
    color: var(--background-color-heading);
    padding: 0 1rem;
    border: 2px solid var(--background-color-bg);
}

.calculator-modal .calculator-modal__header-search {
    border: 2px solid #e8e8e8;
}

.calculator-modal .calculator-modal__header-search-input {
    width: 100%;
    background: transparent;
    padding: .6rem 0;
    color: var(--background-color-text);
    font-size: 0.813rem;
}

.calculator-modal .calculator-modal__body {
    padding: .5rem 0;
    max-height: 350px;
    overflow-y: auto;
}

@media only screen and (max-width: 599px) {
    .calculator-modal .calculator-modal__body {
        max-height: 230px;
    }
}

.fiat {
    display: none;
}

.calculator-modal .calculator-modal__body-item {
    display: flex;
    align-items: center;
    gap: .5rem;
    list-style: none;
    padding: .6rem;
    border-top: 1px solid var(--background-color-border);
    color: var(--background-color-heading);
    transition: .2s;
    cursor: pointer;
}

.calculator-modal .calculator-modal__body-item:first-child {
    border-top: unset;
}

.calculator-modal .calculator-modal__body-item:hover {
    background: var(--background-color-border);
}

.calculator-modal .calculator-modal__body-item span {
    pointer-events: none
}

.calculator-modal .calculator-modal__body-item-image {
    width: 32px;
    border-radius: 100%;
}

.calculator-page {
    padding-top: 2rem;
}

.calculator-page .calculator-page__title {
    text-align: center;
    font-size: 21px;
    margin-bottom: .6rem;
    color: var(--background-color-heading);
}

@media only screen and (max-width: 599px) {
    .calculator-page .calculator-page__title {
        font-size: 1.125rem;
    }
}

.calculator-page .calculator-page__cover {
    display: flex;
    justify-content: center;
}

.calculator-page .calculator {
    gap: unset;
    width: 30rem;
    padding: 2.5rem 3rem;
}

@media only screen and (max-width: 599px) {
    .calculator-page .calculator {
        padding: 1.5rem;
    }
}

.calculator-page .calculator .calculator__cover {
    padding-left: .3rem;
}

.calculator .calculator__svg-cover {
    display: flex;
    justify-content: center;
    padding-top: 1rem;
}

.calculator .calculator__svg {
    text-align: center;
    transform: rotate(90deg);
    width: max-content;
}

.calculator .calculator__svg svg {
    color: var(--background-color-link);
}

.calculator-page .calculator .calculator__button {
    align-items: center;
    background: var(--background-color-box);
    border-radius: 5px;
    padding: .2rem .5rem;
    justify-content: space-between;
    gap: .3rem;
    height: 35px;
    cursor: pointer;
    flex-shrink: 0;
}

.calculator .calculator__button-image img {
    width: 25px;
    border-radius: 100%;
}

.calculator .calculator__button svg {
    width: 11px;
    fill: var(--background-color-text-pale);
}

/*calculator*/

/* comment */
#comments {
    margin: unset !important;
}

.comment-box {
    padding: 24px;
    background-color: var(--background-color-box);
    width: 23rem;
    /*position: sticky;*/
    /*top: 90px;*/
    grid-area: c;
    border-radius: 12px;
}

@media only screen and (max-width: 599px) {
    .comment-box {
        width: 100%;
        order: 2;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .comment-box {
        width: 100%;
        order: 2;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .comment-box {
        width: 100%;
        margin-top: 0;
    }
}

.comment-box .comment-box__title {
	font-size: 1.063rem;
	margin-bottom: 1rem;
	color: var(--background-color-heading);
	overflow: hidden;
	max-width: 100%;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.comment-box #wpdcom .wpd-comment .wpd-comment-left {
    width: auto;
    margin-left: 10px;
}

.comment-box #wpdcom .wpd-form-head {
    display: none;
}

.comment-box #wpdcom .wpd-form .wpdiscuz-textarea-wrap textarea::placeholder {
    font-size: 0.75rem;
    opacity: 1;
}

.comment-box #wpdcom .wpd-form-col-left .wpd-field-group .wpd-field-group-title,
#wpdcom .wpd-form-col-right .wpd-field-group .wpd-field-group-title,
#wpdcom .wpd-form-col-full .wpd-field-group .wpd-field-group-title {
    color: var(--background-color-heading);
}

.comment-box #wpdcom .wpd-field-radio .wpd-field-label,
#wpdcom .wpd-field-checkbox .wpd-field-label {
    color: var(--background-color-text);
    line-height: unset;
}

.comment-box #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .wpd-textarea-wrap {
    flex-basis: unset;
    flex: 1;
}

.comment-box #wpdcom .wpd-form-foot {
    margin-right: 52px;
}

.comment-box #wpd-form-col-left {
    display: grid;
    gap: .5rem;
}

.comment-box #wpdcom .wpd-form-row .wpd-form-col-left {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: .5rem;
}

.comment-box #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .wpd-textarea-wrap textarea {
    box-shadow: unset;
}

.comment-box #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .wpd-textarea-wrap textarea,
.comment-box #wpdcom .wpd-form-row .wpdiscuz-item input[type="text"],
.comment-box #wpdcom .wpd-form-row .wpdiscuz-item input[type="email"] {
    background: var(--background-color-box-pale);
    border: 2px solid var(--background-color-bg) !important;
    border-radius: 5px;
    font-size: 0.75rem !important;
}

.comment-box #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .wpd-textarea-wrap textarea,
.comment-box #wpdcom .wpd-form-row .wpdiscuz-item input[type="text"],
.comment-box #wpdcom .wpd-form-row .wpdiscuz-item input[type="email"] {
    border: 2px solid #e3e3e3 !important;
}

.comment-box #wpdcom input:required {
    box-shadow: unset;
}

.comment-box #wpdcom .wpd-field-radio .wpd-item,
#wpdcom .wpd-field-checkbox .wpd-item {
    display: flex !important;
    align-items: center;
}

.comment-box #wpdcom .wpd-field-radio .wpd-item label.wpd-field-label {
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: .4rem;
    font-size: 0.75rem;
    text-align: center;
    border-radius: 5px;
}

.comment-box #wpdcom .wpd-field-radio .wpd-item label.wpd-field-label {
    border: 1px solid var(--background-color-border);
}

.comment-box #wpdcom .wpd-field-radio .wpd-item:first-child input:checked+label.wpd-field-label {
    background: var(--background-color-up);
    border-color: var(--background-color-up);
}

.comment-box #wpdcom .wpd-field-radio .wpd-item:last-child input:checked+label.wpd-field-label {
    background: var(--background-color-down);
    border-color: var(--background-color-down);
}

.comment-box #wpdcom .wpd-field-radio .wpd-item input:checked+label.wpd-field-label {
    color: #fff;
}

.comment-box #wpdcom .wpd-field-radio .wpd-item input:checked+label.wpd-field-label::after {
    color: #fff;
}

.comment-box #wpdcom .wpd-field-radio .wpd-item label.wpd-field-label::after {
    content: "\f0d8";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}

.comment-box #wpdcom .wpd-field-radio .wpd-item:first-child label.wpd-field-label::after {
    color: #77e1b5;
}

.comment-box #wpdcom .wpd-field-radio .wpd-item:last-child label.wpd-field-label::after {
    transform: rotate(180deg);
    color: #e57373;
}

.comment-box #wpdcom .wpd-field-radio .wpd-field,
#wpdcom .wpd-field-checkbox .wpd-field {
    margin: 0;
    visibility: hidden;
    width: 0;
}

.comment-box #wpdcom .wpd-item-wrap {
    display: flex;
}

.comment-box #wpdcom .wpd-form .wpdiscuz-textarea-wrap {
    padding-bottom: 5px;
}

.comment-box #wpdcom .wpd-form .wpdiscuz-textarea-wrap.wpd-txt .wpd-avatar {
    flex-basis: auto;
    margin-left: 10px;
}

.comment-box #wpdcom .wpd-form .wpd-avatar img,
#wpdcom .wpd-form .wpd-avatar img.avatar,
.comment-box #wpdcom .wpd-comment .wpd-avatar img,
#wpdcom .wpd-comment .wpd-avatar img.avatar {
    width: 43px !important;
    height: 43px !important;
    max-width: 43px !important;
    border: unset !important;
    background-color: transparent !important;
}

.comment-box #wpdcom.wpdiscuz_unauth .wc-field-submit {
    padding-top: unset;
}

.comment-box #wpdcom .wpd-second-button,
#wpdcom .wpd-prim-button {
    padding: 3px 10px !important;
    letter-spacing: 0 !important;
    font-size: 0.75rem !important;
}

.comment-box #wpdcom .wpd-second-button,
#wpdcom .wpd-prim-button {
    box-shadow: unset !important;
}

.comment-box #wpdcom .wpd-form-row .wpd-form-col-right,
.comment-box #wpdcom .wpd-form-row .wpd-form-col-left {
    width: 100%;
}

.comment-box #wpdcom .wpd-form-row .wpd-form-col-right {
    padding-top: 5px;
}

.comment-box #wpdcom .wpd-form-row .wpdiscuz-item {
    padding: 1px 0 5px 0;
}

#wpdcom .wpd-form-row .wpdiscuz-item input[type="email"],
#wpdcom .wpd-form-row .wpdiscuz-item input[type="url"],
#wpdcom .wpd-form-row .wpdiscuz-item input[type="color"],
#wpdcom .wpd-form-row .wpdiscuz-item input[type="date"],
#wpdcom .wpd-form-row .wpdiscuz-item input[type="datetime"],
#wpdcom .wpd-form-row .wpdiscuz-item input[type="datetime-local"],
#wpdcom .wpd-form-row .wpdiscuz-item input[type="month"],
#wpdcom .wpd-form-row .wpdiscuz-item input[type="number"],
#wpdcom .wpd-form-row .wpdiscuz-item input[type="time"],
#wpdcom textarea,
#wpdcom select {
    border: unset !important;
}

.comment-box #wpdcom .wpd-comment-text p {
    font-size: 0.813rem;
    margin-bottom: 10px;
}

.comment-box #wpdcom .wpd-comment-text p:last-child {
    margin-bottom: 10px;
}

.comment-box #wpdcom .wpd-comment-header .wpd-comment-author {
    font-size: 0.875rem;
}

.comment-box #wpdcom .wpd-comment-right .wpd-bottom-custom-fields {
    padding: 0;
    margin-top: 0;
}

.comment-box .wpd-custom-field {
    display: flex;
    align-items: center;
}

.comment-box .wpd-cf-label {
    width: auto;
    background: unset;
    border-left: 1px var(--background-color-border) solid;
    border-bottom: unset;
    padding: 0 0 0 .4rem;
    color: var(--background-color-text);
    font-size: 0.75rem;
}

.comment-box .wpd-cf-value {
    border-bottom: unset !important;
    color: var(--background-color-text);
    opacity: 1;
    font-size: 0.75rem;
    padding: 5px .4rem;
}

.comment-box #wpdcom .wpd-editor-char-counter {
    z-index: 8;
}

.comment-box #wpdcom .wpd-thread-head,
.comment-box #wpdcom .wpd-thread-head .wpd-thread-filter {
    flex-wrap: nowrap;
}

.comment-box #wpdcom .wpd-thread-head .wpd-thread-info {
    color: var(--background-color-heading);
}

.comment-box #wpdcom .wpd-thread-filter .wpdf-sorting {
    color: var(--background-color-text);
}

.comment-box #wpdcom .wpd-comment-text {
    color: var(--background-color-heading);
}

.comment-box #wpdcom.wpd-layout-1 .wpd-comment .wpd-reply-to {
    border-right: 1px solid var(--background-color-border);
}

.comment-box .wpd-thread-list {
    max-height: 350px;
    overflow-y: scroll;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.comment-box .wpd-thread-list::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.comment-box .wpd-thread-list {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
}

.comment-box #wpdcom .wpd-thread-filter .wpdf-sorting {
    display: flex;
    align-items: center;
    justify-content: center;
}

.comment-box #comments #wpdcom span,
#respond #wpdcom span,
#wpdcom span {
    font-size: 0.75rem;
}

.comment-box #wpdcom .wpd-comment-header .wpd-comment-author,
#wpdcom .wpd-comment .wpd-reply-to a {
    color: var(--background-color-heading) !important;
}

.comment-box #wpdcom .wpd-up,
.comment-box #wpdcom .wpd-comment-footer .wpd-vote-up svg,
.comment-box #wpdcom .wpd-comment-footer .wpd-vote-down svg,
.comment-box #wpdcom .wpd-comment-footer .wpd-reply-button svg,
.comment-box #wpdcom .wpd-comment-footer .wpd-reply-button {
    color: var(--background-color-link-pale) !important;
}

.comment-box #wpdcom i {
    opacity: 1;
}

.comment-box #wpdcom .wpd-reply.wpd_comment_level-2 {
    margin-right: 25px;
}

/* comment */

/* tooltipCoin bottom */
.tooltipCoin {
	position: relative;
	display: grid;
	color: var(--background-color-text);
}

.tooltipCoin .tooltiptext {
    visibility: hidden;
    width: 220px;
    background-color: var(--background-color-box);
    color: var(--background-color-text);
    padding: .5rem;
    border-radius: 6px;
    position: absolute;
    z-index: 1;
    top: 20px;
    right: 0px;
    font-size: 0.75rem;
    line-height: 20px;
    background-color: #fff;
    box-shadow: 0px 1px 2px rgba(128, 138, 157, .12), 0px 8px 32px rgba(128, 138, 157, .24);
    font-weight: normal;
}

@media only screen and (max-width: 599px) {
    .tooltipCoin .tooltiptext {
        width: 200px;
    }
}

.tooltipCoin .tooltiptext::after {
    content: " ";
    position: absolute;
    bottom: 100%;
    right: 3px;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent var(--background-color-box) transparent;
}

.tooltipCoin:hover .tooltiptext {
    visibility: visible;
}

/* .tooltipCoin bottom*/

/* .tooltipCoin top */
.tooltipCoin-top {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

.tooltipCoin-top .tooltiptext {
    visibility: hidden;
    width: 100px;
    background-color: black;
    color: var(--background-color-text);
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: 150%;
    left: 50%;
    margin-left: -60px;
    background-color: var(--background-color-box);
}

.tooltipCoin-top .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: var(--background-color-box) transparent transparent transparent;
}

.tooltipCoin-top:hover .tooltiptext {
    visibility: visible;
}

/* .tooltipCoin top */

/*heatmap*/
.heat-tooltip .heat-tooltip__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--background-color-box-pale);
    padding: 10px 15px;
    border-radius: 5px;
}

.heat-tooltip .heat-tooltip__header .bearish,
.heat-tooltip .heat-tooltip__header .bullish {
    direction: ltr;
}

.heat-tooltip .heat-tooltip__body {
    text-align: center;
    padding: 0 20px;
}

.heat-tooltip .heat-tooltip__body-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .2rem;
    margin-top: 1rem;
    margin-bottom: .4rem;
    font-size: 0.75rem;
}

.heat-tooltip .heat-tooltip__body-price,
.heat-tooltip .heat-tooltip__body-volume {
    color: var(--background-color-link);
    font-size: 1.125rem;
}

.heat-tooltip .heat-tooltip__mark {
    font-size: 11px;
    background: var(--background-color-box-pale);
    border-radius: 5px;
    padding: .1rem .3rem;
}

#my-treemap {
    width: 100%;
    height: 100%;
    direction: ltr;
}

.treemap-label {
    font-weight: bold;
}

#data-box {
    width: max-content;
    border: 1px solid #999;
    padding: 15px;
    color: var(--background-color-text);
    font-size: 0.875rem;
    position: absolute;
    background: var(--background-color-box);
    border-radius: 3px;
    display: none;
    border-radius: 10px;
}

.middle-div {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    display: grid;
}

.red-light {
    background-color: #de7875;
    color: white;
}

.red-normal {
    background-color: #ba4a45;
    color: white;
}

.red-dark {
    background-color: #9d2f29;
    color: white;
}

.gray {
    background-color: #888;
    color: white;
}

.green-light {
    background-color: #8cbf84;
    color: white;
}

.green-normal {
    background-color: #5c8456;
    color: white;
}

.green-dark {
    background-color: #315c32;
    color: white;
}

/*heatmap*/

/*glossary*/
.persian-alphabet {
    z-index: 2;
    position: sticky;
    padding: .3rem 1rem;
    background: var(--background-color-bg);
    top: 78px;
    border-radius: 10px;
    margin-bottom: 1rem;
}

@media only screen and (max-width: 599px) {
    .persian-alphabet {
        overflow-x: scroll;
        width: 250px;
        margin: 0 auto;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .persian-alphabet {
        overflow-x: scroll;
        width: 480px;
        margin: 0 auto;
    }
}

.persian-alphabet .persian-alphabet-list {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    font-weight: 500;
    flex-wrap: wrap;
    justify-content: center;
}

@media only screen and (max-width: 599px) {
    .persian-alphabet .persian-alphabet-list {
        justify-content: start;
        flex-wrap: nowrap;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .persian-alphabet .persian-alphabet-list {
        justify-content: start;
        flex-wrap: nowrap;
    }
}

.persian-alphabet .persian-alphabet-list li {
    list-style: none;
}

.persian-alphabet .persian-alphabet-list a {
    color: var(--background-color-heading);
}

.persian-alphabet .persian-alephabet-content h1,
.persian-alphabet .persian-alephabet-content h2,
.persian-alphabet .persian-alephabet-content h3,
.persian-alphabet .persian-alephabet-content h4,
.persian-alphabet .persian-alephabet-content h5,
.persian-alphabet .persian-alephabet-content h6 {
    border-top: 1px var(--bottom-border-style, solid) var(--bottom-border-color);
    padding-top: 2rem;
    margin-top: 2.5rem;
}

.persian-alphabet .persian-alephabet-content p strong {
    display: inline-block;
    margin-top: 2rem;
}

/*glossary*/

/*category*/
.category .category-title {
    margin-bottom: 1.5rem;
}

.category .category-body {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

@media only screen and (max-width: 599px) {
    .category .category-body {
        grid-template-columns: unset;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .category .category-body {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .category .category-body {
        grid-template-columns: repeat(3, 1fr);
    }
}

.category .category-item {
    position: relative;
    background: var(--background-color-box);
    border: 1px solid var(--background-color-border);
    border-radius: 10px;
}

@media only screen and (max-width: 599px) {
    .category .category-item {
        background: unset;
        gap: 12px;
        display: flex;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .category .category-item {
        gap: 1.2rem;
    }
}

@media only screen and (max-width: 599px) {
    .category .category-item-image {
        max-width: 35%;
        min-width: 35%;
    }
}

.category .category-item-image img {
    border-radius: 10px 10px 0 0;
    display: flex;
}

@media only screen and (max-width: 599px) {
    .category .category-item-image img {
        border-radius: 5px;
    }
}

.category .category-item-content {
    padding: .6rem 1rem;
}

@media only screen and (max-width: 599px) {
    .category .category-item-content {
        padding: 0;
    }
}

.category .category-item-title,
.category .category-item-description {
    margin-bottom: 1rem;
}

.category .category-item-title {
    font-size: 0.9rem;
    display: block;
    line-height: 26px;
    color: var(--background-color-heading);
}

@media only screen and (max-width: 599px) {
    .category .category-item-title {
        font-size: 0.8125rem;
        margin-bottom: .5rem;
    }
}

@media only screen and (max-width: 599px) {
    .category .category-item-description {
        display: none;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .category .category-item-description {
        display: none;
    }
}

.category .category-item-title a {
    color: var(--background-color-heading);
}

.category .category-item-title a::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
}

.category-item-tools {
    display: flex;
    align-items: center;
    margin-top: 1rem;
}

@media only screen and (max-width: 599px) {
    .category-item-tools {
        display: none;
    }
}

.category-item-tools span {
    position: relative;
}

.category-item-tools span:last-child::before {
    content: '';
    margin: 0 .5rem;
    width: 1px;
    height: 10px;
    background: var(--background-color-border);
}
/*category*/

/*header search*/
.search-box {
    background: var(--background-color-box-pale);
    border-radius: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 .7rem;
    position: relative;
    max-width: 243px;
}

@media only screen and (max-width: 599px) {
    .search-box {
        max-width: 100%;
        z-index: 3;
        position: absolute;
        left: 0;
        right: 0;
    }
}

.search-box .search-box__icon {
    min-width: 18px;
}

.search-box .search-box__input {
    padding: .7rem;
    background: transparent;
    width: 100%;
}

.search-box .search-box__slash {
    font-size: 0.875rem;
    background: rgb(231, 234, 240);
    width: 24px;
    text-align: center;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--background-color-text);
}

.search-box .search-box__clean {
    width: 24px;
    display: none;
    align-items: center;
    justify-content: center;
}

#search-open {
    position: absolute;
    right: 0;
    z-index: 1;
    min-width: 100%;
    border-radius: 10px;
    background: var(--background-color-box);
    box-shadow: 0 5px 10px rgba(29, 38, 45, .2);
    color: var(--background-color-text);
    padding: 10px;
    top: 65px;
    max-height: 250px;
    overflow-y: auto;
}

@media only screen and (max-width: 599px) {
    #search-open {
        top: 47px;
    }
}

.search-open-header span {
    font-size: 0.75rem;
    margin-bottom: .5rem;
    display: inline-block;
}

.search-open-body {
    display: grid;
    align-items: center;
    gap: .5rem;
    grid-template-columns: repeat(4, max-content);
}

#search-result li {
    list-style: none;
}

#search-result li a {
    height: 41px;
    padding: 5px 10px;
    border-radius: 10px;
    color: var(--background-color-text);
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: 0.813rem;
}

#search-result li a img {
    width: 25px;
    border-radius: 100%;
}

#search-result li a:hover {
    background: var(--background-color-box-pale);
}

.search-li .search-li__title {
    overflow: hidden;
    max-width: 195px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.search-open .search-open__item {
    position: relative;
    background: var(--background-color-box-pale);
    border-radius: 8px;
    width: 52px;
    height: 52px;
}

.search-open .search-open__link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: .4rem;
}

.search-open .search-open__img {
    width: 36px;
    height: 36px;
    border-radius: 100%;
}

.search-open .search-open__delete {
    position: absolute;
    top: -6px;
    right: -6px;
    width: 16px;
    height: 16px;
    border-radius: 100%;
    background: var(--background-color-text);
    color: var(--background-color-box);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    opacity: 0;
    transition: opacity .15s;
    z-index: 1;
}

.search-open .search-open__item:hover .search-open__delete {
    opacity: 1;
}

/*header search*/

/*currency switcher*/
.currency-switcher-wrap {
    display: flex;
    align-items: center;
}
.currency-switcher {
    position: relative;
}

/* Trigger button — shows active currency (flag + code + symbol) */
.currency-trigger {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border: 1px solid var(--background-color-border);
    border-radius: 8px;
    background: var(--background-color-box);
    color: var(--background-color-heading);
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    transition: border-color .15s;
    font-family: inherit;
}
.currency-trigger:hover {
    border-color: var(--background-color-company);
}
.currency-trigger__flag {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    object-fit: cover;
    flex: none;
}
.currency-trigger__symbol {
    color: var(--background-color-text-pale);
    font-weight: 400;
}
.currency-trigger__chevron {
    color: var(--background-color-text-pale);
}

/* Currency bar above the coin table */
.currency-bar {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 1rem;
    margin-bottom: 1rem;
    background: var(--background-color-box);
    border: 1px solid var(--background-color-border);
    border-radius: 12px;
}
.currency-bar__label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .875rem;
    font-weight: 700;
    color: var(--background-color-heading);
}
.currency-bar__label svg {
    color: var(--background-color-company);
}

/* ── Currency modal ─────────────────────────────────────────────────── */
.cur-modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}
.cur-modal[hidden] {
    display: none;
}
.cur-modal__overlay {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, .55);
    backdrop-filter: blur(2px);
}
.cur-modal__box {
    position: relative;
    width: 100%;
    max-width: 560px;
    max-height: 85vh;
    overflow-y: auto;
    background: var(--background-color-box);
    border-radius: 16px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .28);
    animation: curModalIn .18s ease-out;
}
@keyframes curModalIn {
    from { opacity: 0; transform: translateY(12px) scale(.98); }
    to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
    .cur-modal__box { animation: none; }
}
.cur-modal__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.1rem 1.4rem;
    border-bottom: 1px solid var(--background-color-border);
    position: sticky;
    top: 0;
    background: var(--background-color-box);
    border-radius: 16px 16px 0 0;
}
.cur-modal__title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 800;
    color: var(--background-color-heading);
}
.cur-modal__close {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 9px;
    background: var(--background-color-box-pale);
    color: var(--background-color-text);
    cursor: pointer;
    transition: background .15s, color .15s;
}
.cur-modal__close:hover {
    background: var(--background-color-down);
    color: #fff;
}
.cur-modal__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: .6rem;
    padding: 1.2rem 1.4rem 1.5rem;
}
.cur-modal__opt {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid var(--background-color-border);
    border-radius: 12px;
    background: var(--background-color-box);
    cursor: pointer;
    text-align: right;
    transition: border-color .15s, background .15s;
    font-family: inherit;
}
.cur-modal__opt:hover {
    border-color: var(--background-color-company);
    background: var(--background-color-box-pale);
}
.cur-modal__opt.active {
    border-color: var(--background-color-company);
    background: rgba(32, 168, 157, .1);
}
.cur-modal__flag {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    object-fit: cover;
    flex: none;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .06);
}
.cur-modal__opt-label {
    flex: 1 1 auto;
    min-width: 0;
    font-size: .8rem;
    font-weight: 700;
    color: var(--background-color-heading);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cur-modal__opt-code {
    font-size: .7rem;
    font-weight: 700;
    color: var(--background-color-text-pale);
}
.cur-modal__opt-symbol {
    display: none;
}
body.cur-modal-open {
    overflow: hidden;
}

@media only screen and (max-width: 640px) {
    .cur-modal__grid { grid-template-columns: repeat(2, 1fr); }
}
@media only screen and (max-width: 420px) {
    .cur-modal__grid { grid-template-columns: 1fr; }
}
/*currency switcher*/

/*home currencies*/
.home-currencies .home-currencies-title {
    margin-bottom: 1.5rem;
}

.home-currencies .table-grid .table-grid__thead {
    display: none;
}

.home-currencies .table-grid__tbody {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(4, 1fr);
}

@media only screen and (max-width: 599px) {
    .home-currencies .table-grid__tbody {
        overflow-x: scroll;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .home-currencies .table-grid__tbody {
        overflow-x: scroll;
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .home-currencies .table-grid__tbody {
        overflow-x: scroll;
    }
}

.home-currencies .table-grid .table-grid__tr {
    display: block;
    background: var(--background-color-box);
    border-radius: 10px;
}

.home-currencies .table-grid .table-grid__td {
    border: none;
    border-bottom: 1px solid var(--background-color-border);
    position: relative;
    display: flex;
    justify-content: space-between;
    padding: .5rem 0;
    font-size: 0.875rem;
}

.home-currencies .table-grid .table-grid__td:last-child {
    border-bottom: unset;
}

.home-currencies .table-grid .table-grid__td div {
    text-align: left;
    gap: .5rem;
}

.home-currencies .table-grid .table-grid__image {
    order: 1;
}

.home-currencies .table-grid .table-grid__td:nth-of-type(1)::before {
    content: "نام ارز";
}

.home-currencies .table-grid .table-grid__td::before {
    width: 45%;
    white-space: nowrap;
    text-align: right;
    font-size: 0.813rem;
}

.home-currencies .table-grid .table-grid__td-link::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    pointer-events: auto;
    content: "";
    background-color: rgba(0, 0, 0, 0);
}

.home-currencies .table-grid .table-grid__td:nth-of-type(1)::before {
    content: "نام ارز";
}

.home-currencies .table-grid .table-grid__td:nth-of-type(2)::before {
    content: "آخرین قیمت";
}

.home-currencies .table-grid .table-grid__td:nth-of-type(3)::before {
    content: "تغییرات - 1 ساعته";
}

.home-currencies .table-grid .table-grid__td:nth-of-type(4)::before {
    content: "تغییرات - 24 ساعته";
}

.home-currencies .table-grid .table-grid__td:nth-of-type(5)::before {
    content: "ارزش بازار";
}

.home-currencies .table-grid .table-grid__td:nth-of-type(6)::before {
    content: "معاملات روزانه";
}

.home-currencies .table-grid .table-grid__td:nth-of-type(7)::before {
    content: "نمودار هفتگی";
}

/*home currencies*/

.home-show-more {
    text-align: center;
    margin-top: 1.2rem;
}

.home-show-more a {
    display: inline-block;
    padding: .4rem .7rem;
    border-radius: 6px;
    background: #20A89D;
    color: #fff;
    font-size: 0.813rem;
}

/*pagination*/
.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .5rem;
    padding-top: 1.5rem;
    direction: ltr;
}

.page-numbers {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--background-color-heading);
    border-radius: 5px;
}

.page-numbers.current {
    background: var(--background-color-company);
    color: #fff;
}

.page-numbers:not(.current):hover {
    background: var(--background-color-box-pale);
}

.next.page-numbers,
.prev.page-numbers{
    font-size: 1.125rem;
    color: var(--background-color-heading);
}

/*pagination*/

/*story*/

.story-bg {
    background: var(--background-color-box);
    padding: 1.5rem 0;
    text-align: center;
}

.story-container {
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    gap: .7rem;
    overflow-x: auto;
}

.story {
    position: relative;
    border-radius: 50%;
    cursor: pointer;
    position: relative;
}

.story-title {
    margin-bottom: 1.5rem;
}

.story-thumbnail {
    background: rgb(255, 201, 0);
    background-image: linear-gradient(to right, #9137C4, #DE4772, #FFAD58);
    padding: 2px;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.story-thumbnail img {
    border-radius: 50%;
    border: 4px solid #fff;
    display: block;
    box-sizing: border-box;
    height: 100%;
    width: 100%;
    background-size: cover;
    background-position: center;
    object-fit: cover;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.story-modal {
    display: none;
    position: fixed;
    z-index: 10;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: rgba(0, 0, 0, 0.9);
}

/* این بخش اضافه شده است */
.story-modal-progress-box {
    background: rgb(221, 221, 221, 0.4);
    height: 2px;
    position: absolute;
    top: 5px;
    left: 7px;
    border-radius: 2px;
    right: 7px;
}

.story-modal-progress-bar {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 2px;
    background-color: #ddd;
    display: none;
    border-radius: 2px;
}

.story-modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 800px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.story-modal-content-box {
    width: 320px;
    position: relative;
}

#story-modal-image {
    width: 100%;
    height: auto;
    border-radius: 8px;
    pointer-events: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.story-close {
    color: #f1f1f1;
    font-size: 30px;
    font-weight: bold;
    position: absolute;
    top: 15px;
    right: 15px;
    cursor: pointer;
}

/*story*/

/*modal-notif*/
.modal-notif {
    padding: 1.5rem 2rem;
    background-color: var(--background-color-box);
    border-radius: .7rem;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 320px;
    z-index: 11;
}

.modal-notif .modal-notif__action {
    text-align: left;
    padding-top: 1rem;
}

.modal-notif .modal-notif__button {
    padding: .4rem 1rem;
    background: #20a89d;
    color: #fff;
    border-radius: 5px;
}

/*modal-notif*/

.category-list .category-list-item {
    position: relative;
}

.category-list .category-list-item img {
    display: flex;
}

.category-list .category-list-title {
    margin-bottom: 1.5rem;
}

.category-list .category-list-body {
    display: flex;
    gap: 1.5rem;
    justify-content: center;
}

.category-list .category-list-item-title {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    top: 0;
    height: 100%;
    color: #fff;
    font-size: 20px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 40%, #000 100%);
    border-radius: 10px;
    font-weight: 500;
}

.latest-articles .latest-articles-item {
    position: relative;
    background: var(--background-color-box);
    border: 1px solid var(--background-color-border);
    border-radius: 10px;
    height: 100%;
}

.latest-articles .latest-articles-item-image img {
    display: flex;
    border-radius: 10px 10px 0 0;
}

.latest-articles .latest-articles-item-content {
    padding: .7rem 1rem;
}

.latest-articles .latest-articles-item-title,
.latest-articles .latest-articles-item-des {
    margin-bottom: .5rem;
}

.latest-articles .latest-articles-item-title {
    font-size: 0.9rem;
}

.latest-articles .latest-articles-item-title a {
    display: block;
    line-height: 26px;
    color: var(--background-color-heading);
}

.latest-articles .latest-articles-item-title {
    font-size: 1.1rem;
}

@media only screen and (max-width: 599px) {
    .latest-articles .latest-articles-item-title {
        font-size: 0.9rem;
    }
}

.latest-articles .latest-articles-item-title a::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
}

.latest-articles .latest-articles-item-description {
    margin-bottom: 1rem;
    font-size: .9rem;
    color: var(--background-color-text);
}

@media only screen and (max-width: 599px) {
    .latest-articles .latest-articles-item-description {
        display: none;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .latest-articles .latest-articles-item-description {
        display: none;
    }
}

.latest-articles .latest-articles-item-mini-content {
    padding: 1rem 2rem 0;
}

.latest-articles .latest-articles-item-tools {
    display: flex;
    align-items: center;
    margin-top: 1rem;
}

.latest-articles .latest-articles-item-tools span {
    position: relative;
}

.latest-articles .latest-articles-item-tools span:last-child::before {
    content: '';
    margin: 0 .5rem;
    width: 1px;
    height: 10px;
    background: var(--background-color-border);
}

.dark-layer {
    width: 100%;
    height: 70%;
    background: linear-gradient(0deg,rgba(0,0,0,1) 10%,rgba(0,0,0,.01) 70%);
    position: absolute;
    right: 0;
    bottom: 0;
    border-radius: 12px;
}

.top-right-radius {
    border-top-right-radius: 12px;
}

.bottom-right-radius {
    border-bottom-right-radius: 12px;
}

.top-left-radius {
    border-top-left-radius: 12px;
}

.bottom-left-radius {
    border-bottom-left-radius: 12px;
}

.border-radius {
    border-radius: 12px;
}

.box img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: fill;
}

.tv-widget-chart--with-border {
    border: unset !important;
}

.related-posts .related-posts__list {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 1rem;
}

@media only screen and (max-width: 1099px) {
    .related-posts .related-posts__list {
        grid-template-columns: unset
    }
}

.related-posts .related-posts__item a {
    display: flex;
    align-items: center;
    background: #fff;
    border-radius: 12px;
    gap: 15px
}

.related-posts .related-posts__image {
	max-width: 120px;
    min-width: 120px;
}

@media only screen and (max-width: 599px) {
    .related-posts .related-posts__image {
        max-width: 35%;
        min-width: 35%;
    }
}

.related-posts .related-posts__image img {
    width: 100%;
    display: flex;
	object-fit: cover;
	border-radius: 10px;
}

.related-posts .related-posts__caption {
	flex: 1;
	color: var(--background-color-heading);
	white-space: normal;
	font-weight: 500;
	line-height: 26px;
	font-size: 0.8125rem;
}

/*post page*/
.post-page .post-content {
	padding: 24px;
	background-color: var(--background-color-box);
	border-radius: 12px;
}

@media only screen and (max-width: 599px) {
    .post-page .post-content {
        padding: 16px;
    }
}

.post-page .post-hero {
    position: relative;
}

.post-page .post-hero__body {
    position: absolute;
    bottom: 30px;
    right: 25px;
    left: 25px;
    color: #fff;
    z-index: 1;
    display: grid;
    gap: 10px;
    margin-top: 10px;
}

@media only screen and (max-width: 599px) {
    .post-page .post-hero__body {
        position: static;   
    }
}

.post-page .post-content img {
    border-radius: 12px;
    display: flex;
}

.post-page .post-content p,
.post-page .post-content li {
    text-align: justify;
}

.post-page .post-meta__category a {
	color: var(--background-color-heading);
	font-size: 12px;
	background: #CDEFEB;
	padding: .2rem .7rem;
	border-radius: 8px;
	position: relative;
	display: inline-flex;
	align-items: center;
}

.post-page .single-content-date {
    display: flex;
    justify-content: end;
    color: var(--background-color-text-pale);
    margin: 0 0 1rem 0;
    font-size: 0.813rem;
}

@media only screen and (max-width: 599px) {
    .post-page .single-content-date {
        margin: 1rem 0;
        font-size: 0.75rem;
    }
}

.post-page .post-title {
    font-size: 24px;
    color: var(--background-color-box);
}

@media only screen and (max-width: 599px) {
    .post-page .post-title {
        font-size: 1.2rem;
        color: var(--background-color-heading);
    }
}

.post-page .post-meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: #d7d7d7;
	font-size: 12px;
	gap: 2px;
}

@media only screen and (max-width: 599px) {
    .post-page .post-meta {
        flex-direction: column;
        align-items: start;
        color: #84919A;
    }
}

.post-page .post-meta__author {
    margin-bottom: 2px;
    font-weight: 500;
}

.post-page .post-meta__author a {
    color: #d7d7d7;
}

@media only screen and (max-width: 599px) {
    .post-page .post-meta__author a {
        color: #84919A;
    }  
}

.post-page .post-meta__reading-time {
    margin-right: auto;
    display: flex;
    gap: 7px;
    align-items: center;
}

@media only screen and (max-width: 599px) {
    .post-page .post-meta__reading-time {
        margin-right: unset;
    }
    
    .post-page .post-meta__reading-time svg {
        display: none
    }
}

/*category page*/
.category-archive {
	align-items: start;
	display: grid;
	grid-template-columns: 2.7fr 1fr;
	gap: 1rem;
	padding-top: 1rem;
}

@media only screen and (max-width: 599px) {
    .category-archive {
        grid-template-columns: unset
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .category-archive {
        grid-template-columns: unset
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .category-archive {
        grid-template-columns: unset
    }
}

.category-archive .category-archive__section {
    padding: 24px;
    background-color: var(--background-color-box);
    border-radius: 12px;
}

.category-archive .category-archive__title {
    margin-bottom: 1.5rem;
}

.category-archive .category-archive__posts {
    display: grid;
    gap: 30px;
}

.category-post {
    position: relative;
    display: flex;
    border-radius: 10px;
}

@media only screen and (max-width: 599px) {
    .category-post {
        flex-direction: column;
        background: unset;
        gap: 12px;
    }
}

.category-post .category-post__thumbnail {
    min-width: 310px;
    max-width: 310px;
}

@media only screen and (max-width: 599px) {
    .category-post .category-post__thumbnail {
        max-width: 100%;
        min-width: 100%;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .category-post .category-post__thumbnail {
        min-width: 200px;
        max-width: 200px;
    }
}

.category-post .category-post__thumbnail img {
    border-radius: 10px;
    display: flex;
}

@media only screen and (max-width: 599px) {
    .category-post .category-post__thumbnail img {
        border-radius: 5px;
    }
}

.category-post .category-post__content {
    padding: 0 2rem 0;
}

@media only screen and (max-width: 599px) {
    .category-post .category-post__content {
        padding: 0;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .category-post .category-post__content {
        padding: 0 1rem 0;
    }
}

.category-post .category-post__title,
.category-post .category-post__excerpt {
    margin-bottom: 1rem;
}

.category-post .category-post__excerpt p {
    font-size: .9rem;
    color: var(--background-color-text);
}

.category-post .category-post__title {
    font-size: 1rem;
    line-height: 26px;
}

@media only screen and (max-width: 599px) {
    .category-post .category-post__title {
        font-size: 0.8125rem;
        margin-bottom: .5rem;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .category-post .category-post__title {
        font-size: 0.9rem;
    }
}

@media only screen and (max-width: 599px) {
    .category-post .category-post__excerpt {
        display: none;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .category-post .category-post__excerpt {
        display: none;
    }
}

.category-post .category-post__title a {
    color: var(--background-color-heading);
}

.category-post .category-post__title a::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
}

.category-post .category-post__meta {
    display: flex;
    align-items: center;
    margin-top: 1rem;
}

@media only screen and (max-width: 599px) {
    .category-post .category-post__meta {
        display: none;
    }
}

.category-post .category-post__meta span {
    position: relative;
}

.category-post .category-post__meta span:last-child::before {
    content: '';
    margin: 0 .5rem;
    width: 1px;
    height: 10px;
    background: var(--background-color-border);
}

/*home post*/
.home-archive {
	align-items: start;
	display: grid;
	grid-template-columns: 2.7fr 1fr;
	gap: 1rem;
	padding-top: 1rem;
}

@media only screen and (max-width: 599px) {
    .home-archive {
        grid-template-columns: unset
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .home-archive {
        grid-template-columns: unset
    }
}

@media screen and (min-width: 1000px) and (max-width: 1279px) {
    .home-archive {
        grid-template-columns: unset
    }
}

.home-archive .home-archive__section {
    padding: 16px;
    background-color: var(--background-color-box);
    border-radius: 12px;
}

@media screen and (max-width: 768px) { 
    .home-archive .home-archive__section {
        padding: 12px;
    }
}

.home-archive .home-archive__title {
    margin-bottom: 1.5rem;
}

.home-archive .home-archive__posts {
    display: grid;
    gap: 30px;
}

.home-post {
    position: relative;
    display: flex;
    border-radius: 10px;
    align-items: center;
}

@media only screen and (max-width: 599px) {
    .home-post {
        flex-direction: column;
        background: unset;
        gap: .5rem;
    }
}

.home-post .home-post__thumbnail {
    min-width: 310px;
    max-width: 310px;
}

@media only screen and (max-width: 599px) {
    .home-post .home-post__thumbnail {
        max-width: 100%;
        min-width: 100%;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .home-post .home-post__thumbnail {
        min-width: 200px;
        max-width: 200px;
    }
}

.home-post .home-post__thumbnail img {
    border-radius: 12px;
    display: flex;
}

.home-post .home-post__content {
    padding: 0 2rem 0;
}

@media only screen and (max-width: 599px) {
    .home-post .home-post__content {
        padding: 0;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .home-post .home-post__content {
        padding: 0 1rem 0;
    }
}

.home-post .home-post__title,
.home-post .home-post__excerpt {
    margin-bottom: 1rem;
}

.home-post .home-post__excerpt p {
    font-size: .9rem;
    color: var(--background-color-text);
}

.home-post .home-post__title {
    font-size: 1rem;
    line-height: 26px;
}

@media only screen and (max-width: 599px) {
    .home-post .home-post__title {
        font-size: 0.938rem;
        margin-bottom: .5rem;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .home-post .home-post__title {
        font-size: 0.9rem;
    }
}

@media only screen and (max-width: 599px) {
    .home-post .home-post__excerpt {
        display: none;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .home-post .home-post__excerpt {
        display: none;
    }
}

.home-post .home-post__title a {
    color: var(--background-color-heading);
}

.home-post .home-post__title a::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 100%;
}

.home-post .home-post__meta {
    display: flex;
    align-items: center;
    margin-top: 1rem;
}

@media only screen and (max-width: 599px) {
    .home-post .home-post__meta {
        margin-top: .5rem;
    }
}

.home-post .home-post__meta span {
    position: relative;
    font-size: 11px;
    color: var(--background-color-text);
    display: flex;
    align-items: center;
    gap: .3rem;
}

.home-post .home-post__meta span:last-child::before {
    content: '';
    margin: 0 .5rem;
    width: 1px;
    height: 10px;
    background: var(--background-color-border);
}

/*coin post*/
.coin-archive {
    padding: 24px;
    background-color: var(--background-color-box);
    border-radius: 12px;
}

.coin-archive__title {
    margin-bottom: 1.5rem;
}

.coin-archive__posts {
    display: grid;
    gap: 30px;
}

.coin-post {
    position: relative;
    display: flex;
    border-radius: 10px;
}

@media only screen and (max-width: 599px) {
    .coin-post {
        flex-direction: column;
        background: unset;
        gap: 12px;
    }
}

.coin-post .coin-post__thumbnail {
    min-width: 200px;
    max-width: 200px;
}

@media only screen and (max-width: 599px) {
    .coin-post .coin-post__thumbnail {
        max-width: 100%;
        min-width: 100%;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin-post .coin-post__thumbnail {
        min-width: 200px;
        max-width: 200px;
    }
}

.coin-post .coin-post__thumbnail img {
    border-radius: 10px;
    display: flex;
}

@media only screen and (max-width: 599px) {
    .coin-post .coin-post__thumbnail img {
        border-radius: 5px;
    }
}

.coin-post .coin-post__title,
.coin-post .coin-post__excerpt {
    margin-bottom: 1rem;
}

.coin-post .coin-post__excerpt p {
    font-size: .9rem;
    color: var(--background-color-text);
}

.coin-post .coin-post__title {
    font-size: 1rem;
    line-height: 26px;
}

@media only screen and (max-width: 599px) {
    .coin-post .coin-post__title {
        font-size: 0.8125rem;
        margin-bottom: .5rem;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin-post .coin-post__title {
        font-size: 0.9rem;
    }
}

@media only screen and (max-width: 599px) {
    .coin-post .coin-post__excerpt {
        display: none;
    }
}

@media screen and (min-width: 600px) and (max-width: 999px) {
    .coin-post .coin-post__excerpt {
        display: none;
    }
}

.coin-post .coin-post__title a {
    color: var(--background-color-heading);
}

.coin-post .coin-post__meta {
    display: flex;
    align-items: center;
    margin-top: 1rem;
}

/* متای خبر (تاریخ/زمان مطالعه) در موبایل هم نمایش داده می‌شود */

.coin-post .coin-post__meta span {
    position: relative;
    font-size: 11px;
    color: var(--background-color-text);
    display: flex;
    align-items: center;
    gap: .3rem;
}

.coin-post .coin-post__meta span:last-child::before {
    content: '';
    margin: 0 .5rem;
    width: 1px;
    height: 10px;
    background: var(--background-color-border);
}

/*hero site*/
.hero {
  margin: 2rem 0;
}

.hero img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}

@media only screen and (max-width: 1279px) {
    .hero img {
        max-height: 230px;
    }
}

.hero__wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

.hero__main-post {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.hero__post {
    position: relative;
    background: linear-gradient(to bottom, #bbb, #333);
    border-radius: 1rem;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 100%;
}

.hero__post-content {
	position: absolute;
	bottom: 30px;
	right: 25px;
	left: 25px;
	color: #fff;
	z-index: 1;
	display: grid;
	gap: 10px;
	margin-top: 10px;
}

.hero__post-image {
    height: 100%;
}

.hero__post-title {
  margin-top: 1rem;
  font-size: 1.5rem;
}

@media screen and (max-width: 1279px) {
    .hero__post-title {
      font-size: 1rem;
    }
}

.hero a {
    color: var(--background-color-box);
}

.hero__post-meta {
  font-size: 0.9rem;
  margin-top: auto;
}

.hero__side-posts {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.hero__side-posts--mini {
  display: flex;
  gap: 1rem;
}

.hero__mini-post,
.hero__featured-post {
    position: relative;
    flex: 1;
    background: linear-gradient(to bottom, #bbb, #333);
    border-radius: 1rem;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.hero__featured-post-image img {
    max-height: 230px;
}

.hero__mini-post-content,
.hero__featured-post-content {
    position: absolute;
	bottom: 20px;
	right: 25px;
	left: 25px;
	color: #fff;
	z-index: 1;
	display: grid;
	gap: 10px;
	margin-top: 10px;
}

.hero__mini-post-title,
.hero__featured-post-title {
  margin-top: 1rem;
  font-size: 1rem;
}

.hero__mini-post-meta,
.hero__featured-post-meta {
  font-size: 0.85rem;
  margin-top: auto;
}

.hero__side-posts--featured {
  flex: 1;
}

@media (max-width: 1279px) {
  .hero__wrapper {
    flex-direction: column;
  }

  .hero__side-posts--mini {
    flex-direction: column;
  }
}

.hero__post-meta {
    display: flex;
    align-items: center;
    margin-top: .5rem;
}

@media only screen and (max-width: 599px) {
    .hero__post-meta {
        display: none;
    }
}

.hero__post-meta span {
    position: relative;
    font-size: 11px;
    color: var(--background-color-box);
    display: flex;
    align-items: center;
    gap: .3rem;
}

.hero__post-meta span:last-child::before {
    content: '';
    margin: 0 .5rem;
    width: 1px;
    height: 10px;
    background: var(--background-color-box);
}

/* =========================
   Comments
========================= */
.custom-comments-area {
    width: 100%;
}

.comments-list {
    max-height: 320px; 
    overflow-y: auto;
    margin-bottom: 24px;
}

.custom-comment-composer {
    width: 100%;
}

.custom-comment-form {
    margin: 0;
}

.custom-comment-form p {
    margin: 0;
}

.composer-shell {
    border: 1px solid #e1e6f0;
    border-radius: 18px;
    background: #fff;
    padding: 14px;
    overflow: hidden;
    transition: all 0.35s ease;
    box-sizing: border-box;
}

.custom-comment-composer:not(.is-open) .composer-shell {
    padding-bottom: 14px;
}

/* textarea */
.form-row-comment {
    margin: 0;
}

.form-row-comment textarea {
    width: 100%;
    max-height: 220px;
    resize: none;
    border: 0;
    background: transparent;
    outline: none;
    box-shadow: none;
    font-size: 0.875rem;
    line-height: 26px;
    color: var(--background-color-read);
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    display: block;
}

/* این بخش‌ها در حالت عادی مخفی باشند */
.custom-comment-composer .form-row-author,
.custom-comment-composer .form-row-sentiment,
.custom-comment-composer .composer-footer {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    margin-top: 0;
    pointer-events: none;
    transform: translateY(-6px);
    transition:
        max-height 0.35s ease,
        opacity 0.25s ease,
        margin-top 0.35s ease,
        transform 0.3s ease;
}

/* وقتی فرم باز شد */
.custom-comment-composer.is-open .form-row-author,
.custom-comment-composer.is-open .form-row-sentiment,
.custom-comment-composer.is-open .composer-footer {
    max-height: 120px;
    opacity: 1;
    margin-top: 12px;
    pointer-events: auto;
    transform: translateY(0);
}

.composer-extra-fields {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.form-row-author {
    margin: 0;
}

.composer-actions-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.form-row-author input {
    width: 100%;
    height: 44px;
    border-top: 1px solid #dbe2ee;
    background: #fff;
    font-size: 0.875rem;
    outline: none;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

/* sentiment */
.form-row-sentiment {
    margin: 0;
}

.sentiment-options {
    display: flex;
    flex-wrap: wrap;
}

.sentiment-pill {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 69px;
    height: 30px;
    border: 1px solid #dbe2ee;
    background: #f8faff;
    cursor: pointer;
    transition: all 0.2s ease;
}

.bullish-pill {
    border-radius: 0 10px 10px 0;
}

.bearish-pill {
    border-radius: 10px 0 0 10px;
}

.sentiment-pill input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.sentiment-pill span {
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: 0.8rem;
    font-weight: 400;
}

.sentiment-pill.bullish-pill:has(input:checked) {
    background-color: #1b9f7754;
    border-color: var(--background-color-up);
}

.sentiment-pill.bearish-pill:has(input:checked) {
    background-color: #ea39434a;
    border-color: var(--background-color-down);
}

/* selected state با JS class */
.sentiment-pill.is-selected {
    border-color: #5d73ff;
    background: rgba(93, 115, 255, 0.08);
}

/* submit */
.composer-footer {
    display: flex;
    justify-content: flex-start;
}

.custom-submit-btn {
    min-width: 95px;
    height: 30px;
    border: 0;
    border-radius: 10px;
    background: var(--background-color-company);
    color: #fff;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.25s ease;
}

/* submit */
.custom-submit-btn {
    min-width: 95px;
    height: 30px;
    border: 0;
    border-radius: 10px;
    background: var(--background-color-company);
    color: #fff;
    font-size: 0.8rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.25s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
}

.custom-submit-btn:disabled {
    opacity: 0.72;
    cursor: not-allowed;
}

.custom-submit-btn .btn-text {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.custom-submit-btn .btn-spinner {
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255,255,255,0.35);
    border-top-color: #fff;
    border-radius: 50%;
    display: none;
    animation: customCommentSpin 0.7s linear infinite;
}

.custom-submit-btn.is-loading .btn-spinner {
    display: inline-block;
}

@keyframes customCommentSpin {
    to {
        transform: rotate(360deg);
    }
}

.comment-toast {
    position: absolute;
    inset-inline-start: 0;
    bottom: -34px;
    font-size: 0.75rem;
    line-height: 1;
    color: #1f2937;
    background: rgba(17, 24, 39, 0.06);
    border: 1px solid rgba(17, 24, 39, 0.08);
    border-radius: 999px;
    padding: 8px 12px;
    opacity: 0;
    transform: translateY(6px);
    pointer-events: none;
    transition: opacity 0.22s ease, transform 0.22s ease;
    white-space: nowrap;
}

.custom-comment-composer {
    width: 100%;
    position: relative;
}

.comment-toast.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.comment-toast.success {
    color: #14532d;
    background: rgba(34, 197, 94, 0.08);
    border-color: rgba(34, 197, 94, 0.16);
}

.comment-toast.error {
    color: #7f1d1d;
    background: rgba(239, 68, 68, 0.08);
    border-color: rgba(239, 68, 68, 0.16);
}

.comment-toast.pending {
    color: #7c5a00;
    background: rgba(245, 158, 11, 0.10);
    border-color: rgba(245, 158, 11, 0.18);
}

@media (max-width: 767px) {
    .composer-shell {
        padding: 12px;
        border-radius: 16px;
    }

    .custom-submit-btn {
        width: 100%;
    }

    .composer-footer {
        justify-content: stretch;
    }
}

.comment-meta {
    display: flex;
    margin-block-end: 5px;
    gap: 2px;
    align-items: center;
}

.comment-sentiment {
    display: flex;
}

.comment-content {
    font-size: 0.813rem;
    color: var(--background-color-read);
    line-height: 26px;
    margin-block-end: 10px;
}



/* حذف دکمه X پیش‌فرض کروم/سافاری در فیلدهای جستجو (دکمه پاک‌کردن اختصاصی داریم) */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
    appearance: none;
    display: none;
}

/* ─── فید اخبار (آرشیو news — سبک سوشال) ─────────────────────────────────── */
.nf-wrap {
    max-width: 640px;
    margin: 1.75rem auto 3rem;
}
.nf-head {
    margin-bottom: 1.5rem;
    text-align: right;
}
.nf-head__title {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--background-color-heading);
    margin: 0 0 4px;
}
.nf-head__sub {
    font-size: .85rem;
    color: var(--background-color-text-pale);
    margin: 0;
}

.nf-feed {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.nf-card {
    background: var(--background-color-box);
    border: 1px solid var(--background-color-border);
    border-radius: 16px;
    padding: 1.1rem 1.25rem 0.9rem;
    transition: border-color .15s;
}
.nf-card:hover {
    border-color: var(--background-color-text-pale);
}

.nf-card__head {
    margin-bottom: .55rem;
}
.nf-card__time {
    display: block;
    font-size: .72rem;
    color: var(--background-color-text-pale);
}

.nf-card__title {
    margin: 0 0 .45rem;
    font-size: 1.02rem;
    font-weight: 800;
    line-height: 1.8;
}
.nf-card__title a { color: var(--background-color-heading); }
.nf-card__title a:hover { color: var(--background-color-company); }

.nf-card__excerpt {
    margin: 0 0 .8rem;
    font-size: .84rem;
    line-height: 1.9;
    color: var(--background-color-text);
}

.nf-card__media {
    display: block;
    border-radius: 12px;
    overflow: hidden;
    margin-bottom: .5rem;
    background: var(--background-color-box-pale);
}
.nf-card__media img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    transition: transform .25s;
}
.nf-card:hover .nf-card__media img { transform: scale(1.015); }

.nf-card__actions {
    display: flex;
    align-items: center;
    gap: 4px;
    padding-top: .35rem;
    border-top: 1px solid var(--background-color-border);
}
.nf-action {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 10px;
    border: none;
    border-radius: 9px;
    background: transparent;
    font-family: inherit;
    font-size: .76rem;
    font-weight: 700;
    color: var(--background-color-text-pale);
    cursor: pointer;
    transition: background .12s, color .12s;
}
.nf-action:hover {
    background: rgba(32, 168, 157, .08);
    color: var(--background-color-company);
}
.nf-share.is-copied { color: var(--background-color-up); }
.nf-action--more { margin-right: auto; }

.nf-more { text-align: center; margin-top: 1.25rem; }
.nf-more__btn {
    padding: 11px 30px;
    border: 1px solid var(--background-color-border);
    border-radius: 24px;
    background: var(--background-color-box);
    color: var(--background-color-heading);
    font-family: inherit;
    font-size: .875rem;
    font-weight: 800;
    cursor: pointer;
    transition: border-color .15s, color .15s;
}
.nf-more__btn:hover {
    border-color: var(--background-color-company);
    color: var(--background-color-company);
}
.nf-more__btn.is-loading { opacity: .6; cursor: wait; }

.nf-pagination { margin-top: 1.25rem; }
.nf-empty {
    text-align: center;
    color: var(--background-color-text-pale);
    padding: 3rem 0;
}

@media only screen and (max-width: 480px) {
    .nf-card { padding: .9rem .9rem .7rem; border-radius: 13px; }
    .nf-share__label { display: none; }
}

/* ─── مبدل حرفه‌ای ارز (صفحه ماشین‌حساب) ─────────────────────────────────── */
.calculator-page__subtitle {
    color: var(--background-color-text-pale);
    font-size: .9rem;
    margin: -0.25rem 0 1.5rem;
    text-align: center;
}
.cvt { max-width: 620px; margin: 0 auto 3rem; }
.cvt-card {
    background: var(--background-color-box);
    border: 1px solid var(--background-color-border);
    border-radius: 16px;
    padding: 1.5rem;
    display: flex;
    flex-direction: column;
    gap: .4rem;
}
.cvt-label {
    display: block;
    font-size: .78rem;
    color: var(--background-color-text-pale);
    margin-bottom: 6px;
}
.cvt-row {
    display: flex;
    gap: 10px;
    align-items: stretch;
}
.cvt-input {
    flex: 1 1 auto;
    min-width: 0;
    direction: ltr;
    text-align: left;
    padding: 10px 16px;
    border: 1px solid var(--background-color-border);
    border-radius: 12px;
    background: var(--background-color-box);
    color: var(--background-color-heading);
    font-family: inherit;
    font-size: 1.15rem;
    font-weight: 700;
    transition: border-color .15s, box-shadow .15s;
}
.cvt-input:focus {
    outline: none;
    border-color: var(--background-color-company);
    box-shadow: 0 0 0 3px rgba(32, 168, 157, .12);
}
.cvt-asset {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: none;
    min-width: 150px;
    padding: 6px 12px;
    border: 1px solid var(--background-color-border);
    border-radius: 12px;
    background: var(--background-color-box-pale);
    font-family: inherit;
    cursor: pointer;
    transition: border-color .15s;
    text-align: right;
}
.cvt-asset:hover { border-color: var(--background-color-company); }
.cvt-asset img { border-radius: 50%; flex: none; }
.cvt-flag { object-fit: cover; }
.cvt-asset__name {
    flex: 1 1 auto;
    min-width: 0;
    font-size: .82rem;
    font-weight: 700;
    color: var(--background-color-heading);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cvt-asset__name small {
    display: block;
    font-weight: 400;
    font-size: .68rem;
    color: var(--background-color-text-pale);
}
.cvt-asset__chev { color: var(--background-color-text-pale); flex: none; }
.cvt-swap {
    align-self: center;
    width: 42px;
    height: 42px;
    margin: .2rem 0;
    display: grid;
    place-items: center;
    border: 1px solid var(--background-color-border);
    border-radius: 50%;
    background: var(--background-color-box);
    color: var(--background-color-company);
    cursor: pointer;
    transition: transform .18s, border-color .15s;
}
.cvt-swap:hover {
    border-color: var(--background-color-company);
    transform: rotate(180deg);
}
.cvt-chips {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 1rem;
}
.cvt-chip {
    padding: 7px 14px;
    border: 1px solid var(--background-color-border);
    border-radius: 20px;
    background: var(--background-color-box);
    color: var(--background-color-text);
    font-family: inherit;
    font-size: .78rem;
    font-weight: 700;
    cursor: pointer;
    transition: border-color .15s, color .15s;
}
.cvt-chip:hover {
    border-color: var(--background-color-company);
    color: var(--background-color-company);
}
.cvt-fiats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 4px;
}
.cvt-noscript { text-align: center; color: var(--background-color-down); }
.calculator-page__content { max-width: 720px; margin: 0 auto; }

@media only screen and (max-width: 520px) {
    .cvt-row { flex-direction: column; }
    .cvt-asset { min-width: 0; }
    /* مودال به body اضافه می‌شود؛ سلکتور بدون پیشوند .cvt تا واقعا اعمال شود */
    .cvt-fiats,
    .pf-suggest { grid-template-columns: repeat(2, 1fr); }
}

/* ─── قالب برگه‌ها (درباره ما، قوانین، حریم خصوصی…) ───────────────────────── */
.page-view {
    max-width: 900px;      /* عرض مطالعه — متن حقوقی در ۱۴۰۰px خوانا نیست */
    /* فاصلهٔ بالا هم‌اندازهٔ .nf-wrap تا با بقیهٔ صفحات سایت یکدست بماند */
    margin: 1.75rem auto 3rem;
}

.page-hero {
    background-color: var(--background-color-box);
    border-radius: 12px;
    padding: 2rem 1.75rem 1.5rem;
    margin-bottom: 1rem;
    border-top: 3px solid var(--background-color-company);
}

.page-hero__title {
    font-size: 1.75rem;
    line-height: 1.6;
    color: var(--background-color-heading);
    margin: 0;
}

.page-hero__lead {
    margin: .875rem 0 0;
    font-size: 1rem;
    line-height: 2;
    color: var(--background-color-text);
}

.page-hero__meta {
    margin: 1.25rem 0 0;
    padding-top: 1rem;
    border-top: 1px solid var(--background-color-border);
    font-size: .8rem;
    color: var(--background-color-text-pale);
}

.page-view__thumbnail {
    margin-bottom: 1rem;
    border-radius: 12px;
    overflow: hidden;
}

.page-view__thumbnail img {
    display: block;
    width: 100%;
    height: auto;
}

.page-body {
    background-color: var(--background-color-box);
    border-radius: 12px;
    padding: 2rem 1.75rem;
}

/* ریتم عنوان‌ها: فاصلهٔ بیشتر بالای هر بخش تا ساختار متن حقوقی خوانا بماند */
.page-body .page-content h2 {
    margin-top: 2.25rem;
    padding-right: .75rem;
    border-right: 3px solid var(--background-color-company);
    line-height: 1.7;
}

.page-body .page-content h2:first-child {
    margin-top: 0;
}

.page-body .page-content h3 {
    margin-top: 1.5rem;
    font-size: 1.05rem;
}

.page-body .page-content li {
    line-height: 2.1;
    color: var(--background-color-read);
}

.page-body .page-content ul,
.page-body .page-content ol {
    padding-right: 1.25rem;
}

@media only screen and (max-width: 599px) {
    .page-hero,
    .page-body {
        padding: 1.5rem 1.125rem;
    }

    .page-hero__title {
        font-size: 1.375rem;
    }
}

/* ─── بردکرامب هم‌تراز با عرض محتوا ───────────────────────────────────────
   بردکرامب داخل همان کانتینر محتوا قرار گرفته (نه .container کامل) تا
   ابتدای آن دقیقاً با ابتدای متن یکی باشد. این‌ها فقط فاصلهٔ اضافی را می‌گیرند. */
.nf-wrap > .breadcrumb {
    margin-top: 0;
}

.page-view > .breadcrumb {
    margin-top: 0;
    margin-bottom: .5rem;
}

/* ─── راه دستی اتصال ربات در مودال هشدار ─────────────────────────────────── */
.al-cmd {
    display: block;
    margin: .5rem 0;
    padding: .5rem .75rem;
    background: var(--background-color-box-pale);
    border-radius: 8px;
    font-family: monospace;
    font-size: .8rem;
    direction: ltr;
    text-align: left;
    word-break: break-all;
}

.al-manual,
.al-copy {
    border: none;
    background: none;
    color: var(--background-color-text-pale);
    cursor: pointer;
    font-size: .78rem;
    text-decoration: underline;
    padding: 2px 4px;
}

.al-manual:hover,
.al-copy:hover {
    color: var(--background-color-company);
}

/* ─── سلسله‌مراتب عنوان‌ها در محتوای ارز ──────────────────────────────────
   قبلاً H2 و H3 هر دو فیروزه‌ای و تقریباً هم‌اندازه بودند؛ وقتی پشت‌سرهم
   می‌آمدند (مثل شروع بخش «سوالات متداول») مثل دو عنوان تکراری دیده می‌شدند.
   حالا H2 = عنوان بخش (فیروزه‌ای)، H3 = زیربخش/سؤال (تیره و کوچک‌تر). */
.currencies-content h2 {
    margin-top: 2.25rem;
    line-height: 1.7;
}

.currencies-content h2:first-child {
    margin-top: 0;
}

.currencies-content h3 {
    color: var(--background-color-heading);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.9;
    margin-top: 1.75rem;
}

/* وقتی H3 بلافاصله بعد از H2 می‌آید، فاصلهٔ کمتر تا به بخش بالا بچسبد */
.currencies-content h2 + h3 {
    margin-top: .85rem;
}

/* ─── صفحهٔ ۴۰۴ ───────────────────────────────────────────────────────────
   همهٔ رنگ‌ها و شعاع‌ها از توکن‌های سایت می‌آیند؛ نسخهٔ قبلی گرادیانت نارنجی و
   فونت لاتین داشت که در هویت بصری سایت وجود ندارند. */
.nf404 {
    max-width: 620px;
    margin: 3rem auto 4rem;
    padding: 2.5rem 1.75rem;
    background-color: var(--background-color-box);
    border-radius: 12px;
    border-top: 3px solid var(--background-color-company);
    text-align: center;
}

.nf404__code {
    margin: 0;
    font-size: 4.5rem;
    font-weight: 800;
    line-height: 1;
    color: var(--background-color-company);
    opacity: .18;
    letter-spacing: .05em;
}

.nf404__title {
    margin: -.5rem 0 0;
    font-size: 1.5rem;
    color: var(--background-color-heading);
}

.nf404__lead {
    margin: .875rem auto 0;
    max-width: 44ch;
    font-size: .938rem;
    line-height: 2;
    color: var(--background-color-text);
}

.nf404__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .625rem;
    margin-top: 1.75rem;
}

.nf404__btn {
    display: inline-flex;
    align-items: center;
    padding: .625rem 1.125rem;
    border: 1px solid var(--background-color-border);
    border-radius: 999px;
    font-size: .875rem;
    font-weight: 600;
    color: var(--background-color-heading);
    transition: border-color .2s ease, background-color .2s ease;
}

.nf404__btn:hover {
    border-color: var(--background-color-company);
    background-color: var(--background-color-box-pale);
}

.nf404__btn--primary {
    background-color: var(--background-color-company);
    border-color: var(--background-color-company);
    color: #fff;
}

.nf404__btn--primary:hover {
    background-color: var(--background-color-company);
    filter: brightness(1.08);
}

.nf404__coins {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--background-color-border);
}

.nf404__coins-label {
    display: block;
    font-size: .78rem;
    color: var(--background-color-text-pale);
    margin-bottom: .875rem;
}

.nf404__coins-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .5rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.nf404__coins-list a {
    display: inline-flex;
    align-items: center;
    gap: .375rem;
    padding: .375rem .75rem;
    background-color: var(--background-color-box-pale);
    border-radius: 999px;
    font-size: .82rem;
    color: var(--background-color-heading);
    transition: background-color .2s ease;
}

.nf404__coins-list a:hover {
    background-color: var(--background-color-border);
}

.nf404__coins-list img {
    border-radius: 50%;
}

@media only screen and (max-width: 599px) {
    .nf404 {
        padding: 2rem 1.125rem;
        margin: 1.75rem auto 3rem;
    }

    .nf404__code {
        font-size: 3.5rem;
    }

    .nf404__title {
        font-size: 1.25rem;
    }
}

/* ─── لینک درون‌متنی ارز در خبر ───────────────────────────────────────────
   عمداً کم‌رنگ‌تر از لینک معمولی: نباید متن خبر را شلوغ نشان دهد. */
.post-body .news-coin-link {
    color: var(--background-color-company);
    border-bottom: 1px dashed currentColor;
    text-decoration: none;
}

.post-body .news-coin-link:hover {
    border-bottom-style: solid;
}

/* ─── باکس دادهٔ ارزهای مرتبط با خبر ─────────────────────────────────────── */
.news-coins {
    margin: 2rem 0 0;
}

.news-coins__title {
    font-size: 1rem;
    color: var(--background-color-heading);
    margin: 0 0 .75rem;
}

.news-coins__grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
    gap: .75rem;
}

.news-coin {
    display: flex;
    align-items: center;
    gap: .625rem;
    padding: .875rem 1rem;
    background-color: var(--background-color-box);
    border: 1px solid var(--background-color-border);
    border-radius: 12px;
    color: var(--background-color-heading);
    transition: border-color .2s ease, transform .2s ease;
}

.news-coin:hover {
    border-color: var(--background-color-company);
    transform: translateY(-2px);
}

.news-coin__icon {
    flex: 0 0 auto;
    border-radius: 50%;
}

.news-coin__id {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1 1 auto;
}

.news-coin__name {
    font-size: .875rem;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    unicode-bidi: plaintext;
}

.news-coin__symbol {
    font-size: .72rem;
    color: var(--background-color-text-pale);
}

.news-coin__price {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex: 0 0 auto;
    text-align: left;
}

.news-coin__usd {
    font-size: .875rem;
    font-weight: 700;
}

.news-coin__toman {
    font-size: .72rem;
    color: var(--background-color-text);
}

/* ─── باکس هایلایت: رفع بیرون‌زدن ستون‌ها از کارت ─────────────────────────
   علت اصلی: .table__tr فاصلهٔ ۲rem بین ستون‌ها داشت. این مقدار برای جدول
   تمام‌عرض آرشیو مناسب است، ولی هر باکس هایلایت فقط یک‌سوم عرض دارد
   (~۴۱۳px فضای داخلی) و ۶۴px از آن صرف فاصله می‌شد — یعنی محتوا فشرده
   و بیرون‌زده می‌شد. این قوانین فقط داخل .tables اعمال می‌شوند. */
.tables .table__tr {
    gap: .5rem;
}

/* نسبت‌های اصلی طراحی (نام ۲ ، قیمت ۱ ، درصد ۱) حفظ می‌شود؛ فقط min-width
   اضافه می‌شود تا سلول‌ها بتوانند کوچک‌تر از محتوایشان شوند و سه‌نقطه فعال گردد. */
.tables .table__td {
    min-width: 0;
}

/* ─── ستون «ارزهای دیجیتال» در فوتر: دو ستونه تا ارتفاع کم شود ───────────── */
.footer-menus__box--coins ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 1.25rem;
}

.footer-menus__box--coins ul li a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100%;
}

/* ─── سلب مسئولیت فوتر (روی همه‌ی صفحات) ─────────────────────────────────── */
.footer-bottom__disclaimer {
    font-size: .75rem;
    line-height: 1.9;
    color: var(--background-color-text-pale);
    max-width: 900px;
    margin: .5rem auto .5rem;
    text-align: center;
}

/* ─── داده‌ی زنده داخل محتوای صفحه‌ی ارز ({{...}} placeholder) ───────────── */
.currencies-content .arz-live {
    font-weight: 800;
    color: var(--background-color-heading);
    direction: ltr;
    unicode-bidi: isolate;
}
.coin-content__updated {
    font-size: .78rem;
    color: var(--background-color-text-pale);
    margin-top: 1.25rem;
}

/* ─── حساب کاربری (ورود با تلگرام / پیامک) ──────────────────────────────── */
.au-body { text-align: center; }
.au-lede {
    margin: 0 0 1.4rem;
    font-size: .86rem;
    line-height: 2;
    color: var(--background-color-text);
}
.au-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 13px 18px;
    border: 1px solid var(--background-color-company);
    border-radius: 11px;
    background: var(--background-color-company);
    color: #fff;
    font-family: inherit;
    font-size: .92rem;
    font-weight: 800;
    cursor: pointer;
    transition: opacity .15s;
}
.au-btn:hover { opacity: .92; }
.au-btn:disabled { opacity: .6; cursor: wait; }
.au-btn--tg { background: #229ED9; border-color: #229ED9; }
.au-btn--ghost {
    background: var(--background-color-box);
    color: var(--background-color-heading);
    border-color: var(--background-color-border);
    margin-top: 10px;
}
.au-btn--ghost:hover { border-color: var(--background-color-company); color: var(--background-color-company); opacity: 1; }
.au-hint { margin: 8px 0 0; font-size: .74rem; color: var(--background-color-text-pale); }

.au-or {
    position: relative;
    margin: 1.5rem 0;
    text-align: center;
}
.au-or::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0; right: 0;
    height: 1px;
    background: var(--background-color-border);
}
.au-or span {
    position: relative;
    background: var(--background-color-box);
    padding: 0 14px;
    font-size: .76rem;
    color: var(--background-color-text-pale);
}

.au-sms { text-align: right; }
.au-phone, .au-code {
    width: 100%;
    box-sizing: border-box;
    padding: 12px 14px;
    border: 1px solid var(--background-color-border);
    border-radius: 10px;
    background: var(--background-color-box);
    color: var(--background-color-heading);
    font-family: inherit;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
}
.au-code { letter-spacing: .5rem; font-size: 1.3rem; }
.au-phone:focus, .au-code:focus {
    outline: none;
    border-color: var(--background-color-company);
    box-shadow: 0 0 0 3px rgba(32, 168, 157, .12);
}
.au-verify { margin-top: 14px; }
.au-resend {
    display: block;
    width: 100%;
    margin-top: 10px;
    border: none;
    background: none;
    font-family: inherit;
    font-size: .78rem;
    color: var(--background-color-text-pale);
    cursor: pointer;
}
.au-resend:disabled { cursor: default; opacity: .7; }
.au-error {
    margin: 1rem 0 0;
    padding: 9px 12px;
    border-radius: 9px;
    background: rgba(234, 57, 67, .08);
    color: var(--background-color-down);
    font-size: .8rem;
}

.au-wait { padding: 1.5rem 0; }
.au-wait p { margin: 0 0 6px; font-size: .9rem; color: var(--background-color-heading); }
.au-spinner {
    width: 38px; height: 38px;
    margin: 0 auto 1rem;
    border: 3px solid var(--background-color-border);
    border-top-color: var(--background-color-company);
    border-radius: 50%;
    animation: auSpin .8s linear infinite;
}
@keyframes auSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .au-spinner { animation-duration: 2.4s; } }
.au-check {
    width: 46px; height: 46px;
    margin: 0 auto 1rem;
    display: grid; place-items: center;
    border-radius: 50%;
    background: rgba(27, 159, 119, .12);
    color: var(--background-color-up);
    font-size: 1.5rem;
    font-weight: 800;
}
.au-relink {
    display: inline-block;
    margin-top: 10px;
    font-size: .78rem;
    color: var(--background-color-company);
}

/* بنر دعوت به ورود + نوار وضعیت حساب (بالای واچ‌لیست) */
.au-nag, .au-account {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 12px;
    margin: 1.5rem 0 -0.5rem;
    font-size: .82rem;
}
.au-nag {
    background: rgba(32, 168, 157, .07);
    border: 1px solid rgba(32, 168, 157, .2);
    color: var(--background-color-heading);
}
.au-nag__text { flex: 1 1 auto; min-width: 0; }
.au-nag__cta {
    border: none;
    background: var(--background-color-company);
    color: #fff;
    padding: 7px 16px;
    border-radius: 8px;
    font-family: inherit;
    font-size: .78rem;
    font-weight: 800;
    cursor: pointer;
}
.au-account {
    background: var(--background-color-box);
    border: 1px solid var(--background-color-border);
}
.au-account__name { font-weight: 800; color: var(--background-color-heading); }
.au-account__sync { flex: 1 1 auto; color: var(--background-color-up); font-size: .76rem; }
.au-logout {
    border: 1px solid var(--background-color-border);
    background: none;
    color: var(--background-color-text);
    padding: 6px 14px;
    border-radius: 8px;
    font-family: inherit;
    font-size: .76rem;
    cursor: pointer;
}
.au-logout:hover { border-color: var(--background-color-down); color: var(--background-color-down); }

/* ─── هشدار قیمت (زنگوله + مودال) ────────────────────────────────────────── */
.arz-bell {
    background: none;
    border: none;
    padding: 4px;
    margin-right: 4px;
    line-height: 0;
    cursor: pointer;
    color: var(--background-color-text-pale);
    vertical-align: middle;
    transition: color .15s, transform .12s;
}
.arz-bell:hover { color: var(--background-color-company); transform: scale(1.12); }
.arz-bell.is-on { color: var(--background-color-company); }
.arz-bell.is-on svg { fill: currentColor; }

/* فاصله عمودی بخش‌های مودال هشدار */
.al-body .pf-modal__section { margin-top: 0; }
.al-create { width: 100%; margin-top: 1.6rem; text-align: center; }
.al-mine { margin-top: 2rem !important; padding-top: 1.4rem; border-top: 1px solid var(--background-color-border); }
.al-status { margin-bottom: 1.4rem; }

/* دراپ‌داون کوچک (نسخه فشرده کامپوننت pf-dd واچ‌لیست) */
.pf-dd--sm .pf-dd__btn {
    min-width: 88px;
    max-width: 104px;
    padding: 10px 8px;
    gap: 4px;
    border-radius: 9px;
}
.pf-dd--sm .pf-dd__label { font-size: .8rem; font-weight: 700; }
.pf-dd--sm .pf-dd__menu { min-width: 140px; }
.pf-dd--sm .pf-dd__item { padding: 9px 12px; font-size: .82rem; }

/* منوی دراپ‌داونِ لبه چپ ردیف (تومان/دلار) به داخل باز شود تا از مودال بیرون نزند */
.al-row .al-dd:last-child .pf-dd__menu {
    right: auto;
    left: 0;
}
.al-body { overflow-x: hidden; }

/* اسلایدر درصدی زیر فیلد قیمت — استایل کامل سفارشی (بدون افکت hover مرورگر) */
.al-slider-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}
.al-slider {
    flex: 1 1 auto;
    min-width: 0;
    -webkit-appearance: none;
    appearance: none;
    height: 6px;
    border-radius: 3px;
    background: var(--background-color-box-pale);
    outline: none;
    cursor: pointer;
}
.al-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--background-color-company);
    border: none;
    cursor: pointer;
}
.al-slider::-moz-range-thumb {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--background-color-company);
    border: none;
    cursor: pointer;
}
.al-slider::-moz-range-track {
    height: 6px;
    border-radius: 3px;
    background: var(--background-color-box-pale);
}
.al-slider__val {
    flex: none;
    min-width: 44px;
    text-align: center;
    font-size: .78rem;
    font-weight: 800;
    color: var(--background-color-text-pale);
    background: var(--background-color-box-pale);
    border-radius: 8px;
    padding: 3px 6px;
    font-variant-numeric: tabular-nums;
}
.al-slider__val.is-up { color: var(--background-color-up); }
.al-slider__val.is-down { color: var(--background-color-down); }
.al-hint-slider { color: var(--background-color-text-pale); }

.al-row { display: flex; gap: 8px; }
.al-target {
    flex: 1 1 auto;
    min-width: 0;
    direction: ltr;
    text-align: left;
    padding: 10px 12px;
    border: 1px solid var(--background-color-border);
    border-radius: 9px;
    background: var(--background-color-box);
    color: var(--background-color-heading);
    font-family: inherit;
    font-size: .95rem;
    font-weight: 700;
}
.al-hint { margin: 6px 0 0; font-size: .78rem; color: var(--background-color-text-pale); }

.al-status {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    min-height: 42px; /* ارتفاع ثابت در هر سه حالت — بدون پرش layout */
    box-sizing: border-box;
    background: rgba(32, 168, 157, .08);
    border: 1px solid rgba(32, 168, 157, .25);
    border-radius: 10px;
    padding: 8px 14px;
    font-size: .8rem;
    color: var(--background-color-heading);
    margin-bottom: 1rem;
}
.al-status.is-loading {
    color: var(--background-color-text-pale);
    background: var(--background-color-box-pale);
    border-color: var(--background-color-border);
}
.al-connect {
    font-weight: 700;
    color: var(--background-color-company);
}
.al-recheck {
    border: none;
    background: var(--background-color-box-pale);
    border-radius: 7px;
    padding: 5px 10px;
    font-family: inherit;
    font-size: .72rem;
    color: var(--background-color-text);
    cursor: pointer;
}
.al-list { display: flex; flex-direction: column; gap: 6px; }
.al-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    background: var(--background-color-box-pale);
    border-radius: 9px;
    font-size: .8rem;
    color: var(--background-color-heading);
}
.al-item b { font-weight: 800; }
.al-badge { font-size: .66rem; font-weight: 700; padding: 2px 8px; border-radius: 10px; flex: none; }
.al-badge--active { background: rgba(27, 159, 119, .12); color: var(--background-color-up); }
.al-badge--pending { background: rgba(245, 166, 35, .15); color: #b47b10; }
.al-del {
    margin-right: auto;
    border: none;
    background: none;
    color: var(--background-color-text-pale);
    cursor: pointer;
    font-size: .8rem;
    padding: 4px 6px;
}
.al-del:hover { color: var(--background-color-down); }
.al-empty { font-size: .78rem; color: var(--background-color-text-pale); }

/* ─── دکمهٔ ستارهٔ واچ‌لیست ─────────────────────────────────────────────── */
.arz-star {
    background: none;
    border: none;
    line-height: 0;
    cursor: pointer;
    color: var(--background-color-text-pale);
    vertical-align: middle;
}
.arz-star svg {
    fill: none;
    stroke: currentColor;
    transition: fill .15s, stroke .15s, transform .12s, color .15s;
}
.arz-star:hover { color: #f5a623; }
.arz-star:hover svg { transform: scale(1.15); }
.arz-star.is-on { color: #f5a623; }
.arz-star.is-on svg { fill: #f5a623; stroke: #f5a623; }
.arz-star--lg { margin-right: 8px; }
.arz-star--lg svg { width: 22px; height: 22px; }

/* ─── پورتفولیو / واچ‌لیست ─────────────────────────────────────────────── */
.portfolio { margin: 1.5rem 0 3rem; }

.pf-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: 1.25rem;
}
.pf-head__right { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }

/* دراپ‌داون سفارشی پورتفولیو — دکمه + منوی هم‌استایل با سایت (نه دیفالت مرورگر) */
.pf-dd { position: relative; }
.pf-dd__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    min-width: 170px;
    max-width: 240px;
    background: var(--background-color-box);
    border: 1px solid var(--background-color-border);
    border-radius: 10px;
    font-family: inherit;
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s;
}
.pf-dd__btn:hover,
.pf-dd__btn[aria-expanded="true"] {
    border-color: var(--background-color-company);
    box-shadow: 0 0 0 3px rgba(32, 168, 157, .12);
}
.pf-dd__icon { color: var(--background-color-company); flex: none; }
.pf-dd__label {
    flex: 1 1 auto;
    min-width: 0;
    font-size: .9rem;
    font-weight: 800;
    color: var(--background-color-heading);
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pf-dd__chev { color: var(--background-color-text-pale); flex: none; transition: transform .15s; }
.pf-dd__btn[aria-expanded="true"] .pf-dd__chev { transform: rotate(180deg); }

.pf-dd__menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 500;
    min-width: 230px;
    padding: 6px;
    background: var(--background-color-box);
    border: 1px solid var(--background-color-border);
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .14);
}
.pf-dd__menu[hidden] { display: none; }
.pf-dd__item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 10px 12px;
    border: none;
    border-radius: 9px;
    background: transparent;
    font-family: inherit;
    font-size: .85rem;
    font-weight: 700;
    color: var(--background-color-heading);
    cursor: pointer;
    text-align: right;
    transition: background .12s;
}
.pf-dd__item:hover { background: var(--background-color-box-pale); }
.pf-dd__item.is-active { background: rgba(32, 168, 157, .1); color: var(--background-color-company); }
.pf-dd__item-name {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pf-dd__item small { color: var(--background-color-text-pale); flex: none; }
.pf-dd__item svg { flex: none; }
.pf-btn {
    padding: 8px 14px;
    border: 1px solid var(--background-color-border);
    border-radius: 8px;
    background: var(--background-color-box);
    color: var(--background-color-heading);
    font-family: inherit;
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
    transition: border-color .15s, background .15s;
}
.pf-btn:hover { border-color: var(--background-color-company); }
.pf-btn--add {
    background: var(--background-color-company);
    border-color: var(--background-color-company);
    color: #fff;
}
.pf-btn--add:hover { opacity: .92; }
.pf-icon-btn { padding: 8px 10px; }
.pf-icon-btn--danger:hover { border-color: var(--background-color-down); color: var(--background-color-down); }

.pf-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-bottom: 1.5rem;
}
.pf-sum-card {
    background: var(--background-color-box);
    border: 1px solid var(--background-color-border);
    border-radius: 12px;
    padding: 14px 18px;
}
.pf-sum-card__title { font-size: .78rem; color: var(--background-color-text-pale); margin-bottom: 6px; }
.pf-sum-card__main { font-size: 1.4rem; font-weight: 700; color: var(--background-color-heading); }
.pf-sum-card__sub { font-size: .78rem; color: var(--background-color-text); margin-top: 2px; }
.pf-up { color: var(--background-color-up); }
.pf-down { color: var(--background-color-down); }

.pf-table-wrap { overflow-x: auto; }
.pf-row__icon { border-radius: 50%; object-fit: cover; }
.pf-watch { font-size: .75rem; color: var(--background-color-text-pale); }
.pf-actions { white-space: nowrap; }
.pf-row-btn {
    border: none;
    background: var(--background-color-box-pale);
    color: var(--background-color-text);
    width: 30px; height: 30px;
    border-radius: 7px;
    cursor: pointer;
    margin-right: 4px;
    transition: background .15s, color .15s;
}
.pf-row-btn:hover { background: var(--background-color-company); color: #fff; }
.pf-row-btn--danger:hover { background: var(--background-color-down); }

.pf-empty {
    text-align: center;
    padding: 3rem 1rem;
    background: var(--background-color-box);
    border: 1px dashed var(--background-color-border);
    border-radius: 12px;
    color: var(--background-color-text);
}
.pf-empty p { margin-bottom: 1rem; }
.pf-updated { text-align: center; font-size: .75rem; color: var(--background-color-text-pale); margin-top: 1rem; }

/* مودال افزودن/ویرایش */
.pf-modal { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 1rem; }
.pf-modal__overlay { position: absolute; inset: 0; background: rgba(15,23,42,.55); backdrop-filter: blur(2px); }
.pf-modal__box {
    position: relative;
    width: 100%; max-width: 440px; max-height: 88vh; overflow-y: auto;
    background: var(--background-color-box);
    border-radius: 16px;
    box-shadow: 0 24px 60px rgba(0,0,0,.28);
}
.pf-modal__head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 1rem 1.3rem; border-bottom: 1px solid var(--background-color-border);
}
.pf-modal__head h3 { margin: 0; font-size: 1rem; font-weight: 800; color: var(--background-color-heading); }
.pf-modal__close {
    border: none; background: var(--background-color-box-pale); color: var(--background-color-text);
    width: 32px; height: 32px; border-radius: 8px; cursor: pointer;
}
.pf-modal__close:hover { background: var(--background-color-down); color: #fff; }
.pf-modal__body { padding: 1.2rem 1.3rem 1.4rem; }
.pf-label { display: block; font-size: .78rem; color: var(--background-color-text); margin: 10px 0 5px; }
.pf-search-input, .pf-f-amount, .pf-f-buy {
    width: 100%; box-sizing: border-box;
    padding: 10px 12px;
    border: 1px solid var(--background-color-border); border-radius: 9px;
    background: var(--background-color-box); color: var(--background-color-heading);
    font-family: inherit; font-size: .9rem;
}
.pf-search-results { margin-top: 6px; }
.pf-search-item {
    display: flex; align-items: center; justify-content: space-between;
    width: 100%; padding: 9px 12px; border: none; border-radius: 8px;
    background: transparent; cursor: pointer; font-family: inherit;
    color: var(--background-color-heading); font-size: .85rem;
}
.pf-search-item:hover { background: var(--background-color-box-pale); }
.pf-search-item small { color: var(--background-color-text-pale); }
.pf-search-empty { padding: 10px; color: var(--background-color-text-pale); font-size: .8rem; }
/* فاصله بین سکشن‌های مودال */
.pf-modal__section + .pf-modal__section { margin-top: 1.4rem; }
.pf-modal__section .pf-label:first-child { margin-top: 0; }

/* چیپ پیشنهادی انتخاب‌شده */
.pf-suggest-item.is-active {
    border-color: var(--background-color-company);
    background: rgba(32, 168, 157, .1);
    box-shadow: 0 0 0 2px rgba(32, 168, 157, .15);
}

.pf-picked--head {
    display: flex; align-items: center; gap: 8px;
    padding: 8px 10px; margin-bottom: 4px;
    background: var(--background-color-box-pale); border-radius: 10px;
    color: var(--background-color-heading);
}
.pf-picked--head small { color: var(--background-color-text-pale); }
.pf-save { width: 100%; margin-top: 1.3rem; text-align: center; }
.pf-save:disabled { opacity: .5; cursor: not-allowed; }
.pf-save--danger { background: var(--background-color-down); border-color: var(--background-color-down); }

/* شش رمزارز پیشنهادی مودال افزودن */
.pf-suggest {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-top: 4px;
}
.pf-suggest-item {
    display: flex; align-items: center; gap: 7px;
    padding: 8px 10px;
    border: 1px solid var(--background-color-border); border-radius: 10px;
    background: var(--background-color-box);
    font-family: inherit; font-size: .78rem; font-weight: 700;
    color: var(--background-color-heading);
    cursor: pointer;
    transition: border-color .15s, background .15s;
    min-width: 0;
}
.pf-suggest-item:hover { border-color: var(--background-color-company); background: var(--background-color-box-pale); }
.pf-suggest-item img { border-radius: 50%; flex: none; }
.pf-suggest-item span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pf-suggest-item small { color: var(--background-color-text-pale); margin-right: auto; }

/* مودال حذف پورتفولیو */
.pf-del-warn { text-align: center; padding: .5rem 0 0; }
.pf-del-warn__icon {
    width: 56px; height: 56px; margin: 0 auto 12px;
    display: grid; place-items: center;
    background: rgba(234, 57, 67, .1); color: var(--background-color-down);
    border-radius: 50%;
}
.pf-del-warn__icon svg { width: 24px; height: 24px; }
.pf-del-warn p { margin: 0 0 6px; color: var(--background-color-heading); font-size: .9rem; }
.pf-del-warn__sub { color: var(--background-color-text-pale) !important; font-size: .78rem !important; }

/* فلش درصد در جدول پورتفولیو */
.pf-arrow svg { width: 10px; height: 10px; }
.pf-actions .pf-row-btn svg { vertical-align: middle; }

/* قالب ستونی جدول واچ‌لیست — بدون ستون ستاره، با ستون اکشن در انتها
   (قالب پایه .table-grid برای ترتیب ستون‌های آرشیو تنظیم شده است) */
.table-grid.pf-table .table-grid__tr {
    grid-template-columns: 25px 150px 130px 110px 110px 110px 1fr 1fr 1fr 90px;
}

/* نوار «دارایی شما» زیر ردیف ارزهای دارای مقدار */
.table-grid.pf-table .table-grid__tr.pf-holding-row {
    display: block;
    padding: 0 1rem .4rem;
    margin-top: -6px;
}
.pf-holding-row td {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem 1.5rem;
    background: var(--background-color-box-pale);
    border-radius: 10px;
    padding: .55rem 1rem;
    font-size: .76rem;
    color: var(--background-color-text);
}
.pf-h-badge {
    background: var(--background-color-company);
    color: #fff;
    font-size: .68rem;
    font-weight: 800;
    padding: 3px 10px;
    border-radius: 12px;
    flex: none;
}
.pf-h-item b { color: var(--background-color-heading); font-weight: 800; }
.pf-h-item small { color: var(--background-color-text-pale); }
.pf-h-item.bullish b, .pf-h-item.bullish small { color: var(--background-color-up); }
.pf-h-item.bearish b, .pf-h-item.bearish small { color: var(--background-color-down); }

@media only screen and (max-width: 700px) {
    .pf-summary { grid-template-columns: 1fr; }
    .pf-head { flex-direction: column; align-items: stretch; }
    .pf-btn--add { width: 100%; }
}

/* ─── نوار شاخص‌های بازار (ترس‌وطمع / فصل آلت‌کوین / میانگین RSI) ────────── */
.indicators {
    display: grid;
    gap: 2rem;
    margin-bottom: 2rem;
}

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

.indicator {
    background: var(--background-color-box);
    border: 1px solid var(--background-color-border);
    border-radius: 12px;
    padding: 12px 16px;
}

.indicator__title {
    font-size: .75rem;
    color: var(--background-color-text-pale);
    margin-bottom: 4px;
}

.indicator__value {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 12px;
}

.indicator__value b {
    font-size: 1.35rem;
    font-weight: 800;
    color: var(--background-color-heading);
    line-height: 1;
}

.indicator__value small {
    font-size: .72rem;
    color: var(--background-color-text);
}

.indicator__of {
    color: var(--background-color-text-pale) !important;
    margin-right: -4px;
}

/* نوارها فیزیکی چپ→راست هستند (کم→زیاد)؛ direction:ltr تا نشانگر و برچسب‌ها هم‌راستا بمانند */
.indicator__bar {
    position: relative;
    height: 6px;
    border-radius: 3px;
    direction: ltr;
}

.indicator__bar i {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--background-color-box);
    border: 3px solid var(--background-color-heading);
    box-sizing: border-box;
}

.indicator__bar--fng {
    background: linear-gradient(to right, #f39e0d, #f3dc0d 35%, #86e671 65%, #16c784);
}

.indicator__bar--altseason {
    background: linear-gradient(to right, #f7931a 10%, #b98a84 50%, #3861fb 90%);
}

.indicator__bar--rsi {
    background: linear-gradient(to right, var(--background-color-up) 15%, #cfd6e4 45%, #cfd6e4 55%, var(--background-color-down) 85%);
}

.indicator__ends {
    display: flex;
    justify-content: space-between;
    direction: ltr;
    font-size: .68rem;
    color: var(--background-color-text-pale);
    margin-top: 6px;
}

@media only screen and (max-width: 900px) {
    .indicators--3,
    .indicators--2 {
        grid-template-columns: 1fr;
    }
}

/* ─── بخش بازار صفحه اصلی ─────────────────────────────────────────────── */
/* فاصله عمودی بخش بازار: ۳rem با هدر، ۲rem با جدول رمزارزها */
.highlights--home {
    margin-top: 3rem;
    margin-bottom: 2rem;
}

/* سه کارت هم‌ارتفاع (رشد/افت، تتر، اخبار فوری) در صفحه اصلی */
.tables--home {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: stretch;
}

.tables--home .table {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.tables--home .breaking-news {
    flex: 1 1 auto;
}

.breaking-news {
    list-style: none;
    margin: 0;
    padding: 0;
}

.breaking-news__item a {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: .5rem;
    padding: .55rem 0;
    border-bottom: 1px solid var(--background-color-border);
    color: var(--background-color-read);
    font-size: .813rem;
    line-height: 1.7;
}

.breaking-news__item:last-child a {
    border-bottom: none;
}

.breaking-news__item a:hover .breaking-news__title {
    color: var(--background-color-company);
}

.breaking-news__title {
    flex: 1 1 auto;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.breaking-news__time {
    color: var(--background-color-text-pale);
    white-space: nowrap;
}

.breaking-news__empty {
    color: var(--background-color-text-pale);
    font-size: .813rem;
    padding: .5rem 0;
}


@media only screen and (max-width: 1200px) {
    .tables--home {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media only screen and (max-width: 700px) {
    .tables--home {
        grid-template-columns: 1fr;
    }
}