/* Stocks — Split Zone */

.stk-split-wrap {
    width: 100%;
    height: 100%;
    position: relative;
    font-family: Roboto, sans-serif;
    container-type: size;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stk-split-wrap .stk-split-card {
    width: 80cqw;
    height: 80cqh;
    display: flex;
    flex-direction: column;
    gap: 1.5cqmin;
    direction: ltr;
}

.stk-split-wrap .stk-split-header {
    background: var(--text);
    border-radius: 2.5cqmin;
    color: var(--bg);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 2cqmin 3cqmin;
}

.stk-split-wrap .stk-split-symbol {
    font-family: Montserrat, sans-serif;
    font-size: 7cqmin !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
}

.stk-split-wrap .stk-split-name {
    font-size: 3cqmin !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    opacity: 0.5;
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
}

.stk-split-wrap .stk-split-price-wrap {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.stk-split-wrap .stk-split-price {
    font-family: Montserrat, sans-serif;
    font-size: 10cqmin !important;
    font-weight: 300 !important;
    line-height: 1 !important;
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
}

.stk-split-wrap .stk-split-change {
    display: inline-flex;
    align-items: center;
    gap: 0.5cqmin;
    margin-top: 0.8cqmin;
    color: #fff;
    padding: 0.5cqmin 1.5cqmin;
    border-radius: 5cqmin;
    font-size: 2.5cqmin !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
}

.stk-split-wrap .stk-split-chart {
    border-radius: 2.5cqmin;
    overflow: hidden;
    color: var(--bg);
    background: linear-gradient(135deg, var(--text), var(--accent));
    position: relative;
    flex: 1;
    padding: 2cqmin;
}

.stk-split-wrap .stk-split-chart-label {
    position: absolute;
    top: 2cqmin;
    right: 2cqmin;
    font-size: 1.5cqmin !important;
    opacity: 0.3;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
}

.stk-split-wrap .stk-split-chart-svg {
    position: absolute;
    inset: 2cqmin;
}

.stk-split-wrap .stk-split-chart-svg svg {
    width: 100%;
    height: 100%;
}

.stk-split-wrap .stk-split-stats {
    background: var(--text);
    border-radius: 2.5cqmin;
    color: var(--bg);
    overflow: hidden;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    padding: 2cqmin 0;
}

.stk-split-wrap .stk-split-stat {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.stk-split-wrap .stk-split-stat-icon {
    font-size: 2.5cqmin !important;
    opacity: 0.5;
    color: var(--bg);
    margin-bottom: 0.4cqmin;
}

.stk-split-wrap .stk-split-stat-val {
    font-family: Montserrat, sans-serif;
    font-size: 3.5cqmin !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    color: var(--bg);
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
}

.stk-split-wrap .stk-split-stat-label {
    font-size: 1.8cqmin !important;
    opacity: 0.4;
    color: var(--bg);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-top: 0.3cqmin;
    -webkit-text-stroke: 0 !important;
    text-shadow: none !important;
}
