/* =========================================================
   TAHLIL.CLUB MARKET TERMINAL
   ========================================================= */

.tc-market-page {
    background:
        radial-gradient(
            circle at 50% -10%,
            rgba(226,184,92,.08),
            transparent 35%
        ),
        var(--bg);
}


.tc-market-main {
    min-height: 100vh;
}


.tc-market-hero {
    padding:
        clamp(105px, 11vw, 150px)
        0
        26px;
}


.tc-market-heading {
    text-align: center;
    max-width: 760px;
    margin: 0 auto;
}


.tc-market-heading h1 {
    margin:
        14px
        0
        12px;

    font-size:
        clamp(
            34px,
            5vw,
            62px
        );

    line-height: 1.15;

    letter-spacing: -.04em;
}


.tc-market-heading p {
    max-width: 680px;
    margin: 0 auto;

    color: var(--muted);

    line-height: 2;

    font-size:
        clamp(
            14px,
            1.4vw,
            17px
        );
}


.tc-terminal-section {
    padding:
        18px
        0
        100px;
}


.tc-terminal {

    position: relative;
    overflow: hidden;

    border:
        1px
        solid
        rgba(226,184,92,.16);

    border-radius: 28px;

    background:
        linear-gradient(
            145deg,
            rgba(18,23,32,.96),
            rgba(8,11,16,.98)
        );

    box-shadow:
        0 35px 100px rgba(0,0,0,.46),
        inset 0 1px 0 rgba(255,255,255,.035);

}


.tc-terminal::before {

    content: "";

    position: absolute;

    inset:
        0
        8%
        auto;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(246,215,143,.75),
            transparent
        );

}


.tc-terminal-top {

    min-height: 70px;

    display: flex;
    justify-content: space-between;
    align-items: center;

    gap: 20px;

    padding:
        13px
        18px;

    border-bottom:
        1px
        solid
        var(--line);

}


.tc-market-tabs {

    display: flex;

    gap: 6px;

    padding: 5px;

    border:
        1px
        solid
        rgba(255,255,255,.06);

    border-radius: 15px;

    background:
        rgba(255,255,255,.025);

}


.tc-market-tab {

    appearance: none;

    border: 0;

    border-radius: 11px;

    padding:
        10px
        20px;

    display: flex;
    align-items: center;
    gap: 8px;

    background: transparent;

    color: var(--muted);

    cursor: pointer;

    font: inherit;

    transition:
        .2s ease;

}


.tc-market-tab:hover {
    color: var(--text);
}


.tc-market-tab.active {

    color:
        #17120a;

    background:
        linear-gradient(
            135deg,
            var(--gold-2),
            var(--gold)
        );

    box-shadow:
        0 8px 25px
        rgba(226,184,92,.15);

}


.tc-tab-dot {

    width: 6px;
    height: 6px;

    border-radius: 50%;

    background:
        currentColor;

    opacity: .8;

}


.tc-terminal-actions {

    display: flex;

    align-items: center;

    gap: 10px;

}


.tc-live-badge {

    display: flex;

    align-items: center;

    gap: 8px;

    padding:
        8px
        12px;

    border:
        1px
        solid
        rgba(50,213,131,.16);

    border-radius: 999px;

    color:
        #8ce9b8;

    background:
        rgba(50,213,131,.055);

    direction: ltr;

    font-size: 11px;

    letter-spacing: .08em;

}


.tc-live-badge span {

    width: 7px;
    height: 7px;

    border-radius: 50%;

    background:
        var(--success);

    box-shadow:
        0 0 0 5px
        rgba(50,213,131,.09);

    animation:
        tc-market-pulse
        2s
        infinite;

}


@keyframes tc-market-pulse {

    50% {
        box-shadow:
            0 0 0 9px
            rgba(50,213,131,0);
    }

}


.tc-icon-button {

    width: 39px;
    height: 39px;

    border:
        1px
        solid
        rgba(255,255,255,.08);

    border-radius: 12px;

    color: var(--text);

    background:
        rgba(255,255,255,.03);

    cursor: pointer;

    font-size: 21px;

    transition:
        .2s ease;

}


.tc-icon-button:hover {

    border-color:
        rgba(226,184,92,.32);

    color:
        var(--gold-2);

    background:
        rgba(226,184,92,.06);

}


.tc-symbol-bar {

    min-height: 83px;

    display: flex;

    align-items: center;

    justify-content:
        space-between;

    gap: 20px;

    padding:
        14px
        22px;

    border-bottom:
        1px
        solid
        var(--line);

}


.tc-symbol-primary {

    display: flex;

    align-items: center;

    gap: 13px;

}


.tc-symbol-icon {

    width: 46px;
    height: 46px;

    display: grid;

    place-items: center;

    border:
        1px
        solid
        rgba(226,184,92,.18);

    border-radius: 15px;

    color:
        #17120a;

    background:
        linear-gradient(
            145deg,
            var(--gold-2),
            var(--gold)
        );

    font-weight: 900;

    font-size: 19px;

    box-shadow:
        0 10px 30px
        rgba(226,184,92,.12);

}


.tc-symbol-primary strong {

    display: block;

    direction: ltr;

    text-align: right;

    font-size: 17px;

}


.tc-symbol-primary span {

    display: block;

    margin-top: 5px;

    color: var(--muted);

    font-size: 12px;

}


.tc-data-note {

    display: flex;

    align-items: center;

    gap: 8px;

    color: var(--muted);

    font-size: 12px;

}


.tc-data-dot {

    width: 6px;
    height: 6px;

    border-radius: 50%;

    background:
        var(--success);

}


.tc-quick-symbols {

    display: flex;

    gap: 7px;

    overflow-x: auto;

    scrollbar-width: none;

    padding:
        13px
        18px;

    border-bottom:
        1px
        solid
        var(--line);

}


.tc-quick-symbols::-webkit-scrollbar {
    display: none;
}


.tc-symbol-chip {

    flex: 0 0 auto;

    padding:
        8px
        13px;

    border:
        1px
        solid
        rgba(255,255,255,.07);

    border-radius: 10px;

    color:
        #cbd0d9;

    background:
        rgba(255,255,255,.02);

    direction: ltr;

    cursor: pointer;

    font:
        600
        11px/1
        Tahoma,
        Arial,
        sans-serif;

    transition:
        .2s ease;

}


.tc-symbol-chip:hover,
.tc-symbol-chip.active {

    color:
        var(--gold-2);

    border-color:
        rgba(226,184,92,.32);

    background:
        rgba(226,184,92,.07);

}


.tc-forex-notice {

    padding:
        15px
        20px;

    border-bottom:
        1px
        solid
        var(--line);

    background:
        linear-gradient(
            90deg,
            rgba(226,184,92,.04),
            transparent
        );

}


.tc-forex-notice > div:first-child {

    display: flex;

    align-items: center;

    gap: 11px;

    flex-wrap: wrap;

}


.tc-forex-notice strong {
    color:
        var(--gold-2);
}


.tc-forex-notice span {
    color:
        var(--muted);

    font-size: 12px;
}


.tc-forex-pairs {

    margin-top: 8px;

    direction: ltr;

    text-align: right;

    color:
        #7f8796;

    font-size: 11px;

}


.tc-forex-pairs i {

    margin:
        0
        7px;

    color:
        var(--gold-dark);

    font-style:
        normal;

}


.tc-timeframe-bar {

    display: flex;

    align-items: center;

    gap: 14px;

    padding:
        12px
        18px;

    border-bottom:
        1px
        solid
        var(--line);

}


.tc-timeframe-label {

    color:
        var(--muted);

    font-size: 11px;

    white-space: nowrap;

}


.tc-timeframes {

    display: flex;

    gap: 4px;

    direction: ltr;

    overflow-x: auto;

    scrollbar-width: none;

}


.tc-timeframes::-webkit-scrollbar {
    display: none;
}


.tc-timeframes button {

    min-width: 38px;

    padding:
        7px
        9px;

    border: 0;

    border-radius: 8px;

    color:
        #939baa;

    background:
        transparent;

    cursor: pointer;

    font:
        600
        11px
        Tahoma,
        Arial,
        sans-serif;

}


.tc-timeframes button:hover {

    color:
        var(--text);

    background:
        rgba(255,255,255,.035);

}


.tc-timeframes button.active {

    color:
        var(--gold-2);

    background:
        rgba(226,184,92,.09);

}


.tc-chart-shell {

    position: relative;

    min-height: 640px;

    background:
        #080b10;

}


.tc-chart {

    position: relative;

    width: 100%;
    height: 640px;

    min-height: 470px;

    z-index: 2;

}


.tc-chart-glow {

    position: absolute;

    top: -100px;
    left: 50%;

    width: 50%;
    height: 180px;

    transform:
        translateX(-50%);

    border-radius: 50%;

    background:
        rgba(226,184,92,.08);

    filter:
        blur(80px);

    pointer-events:
        none;

}


.tc-chart-loading {

    position: absolute;

    inset: 0;

    z-index: 1;

    display: flex;

    flex-direction: column;

    justify-content: center;
    align-items: center;

    gap: 14px;

    color:
        var(--muted);

    font-size:
        12px;

}


.tc-market-loader {

    width: 30px;
    height: 30px;

    border:
        2px
        solid
        rgba(255,255,255,.08);

    border-top-color:
        var(--gold);

    border-radius: 50%;

    animation:
        tc-market-spin
        .75s
        linear
        infinite;

}


@keyframes tc-market-spin {
    to {
        transform:
            rotate(360deg);
    }
}


.tc-terminal-footer {

    min-height: 47px;

    display: flex;

    justify-content:
        space-between;

    align-items: center;

    gap: 15px;

    padding:
        10px
        18px;

    border-top:
        1px
        solid
        var(--line);

    color:
        #747d8c;

    font-size:
        10px;

    direction: ltr;

}


.tc-terminal-footer > div {

    display: flex;

    align-items: center;

    gap: 7px;

}


.tc-status-dot {

    width: 6px;
    height: 6px;

    border-radius: 50%;

    background:
        var(--success);

}


/* Fullscreen */

.tc-terminal:fullscreen {

    border: 0;

    border-radius: 0;

    width: 100vw;
    height: 100vh;

    background:
        var(--bg);

}


.tc-terminal:fullscreen .tc-chart-shell {

    height:
        calc(
            100vh - 288px
        );

}


.tc-terminal:fullscreen .tc-chart {

    height: 100%;

}


/* Responsive */

@media (max-width: 760px) {

    .tc-market-hero {

        padding-top: 92px;

        padding-bottom: 12px;

    }


    .tc-market-heading p {

        padding:
            0
            12px;

        line-height: 1.85;

    }


    .tc-terminal-section {
        padding-bottom: 65px;
    }


    .tc-terminal {

        margin:
            0
            -8px;

        border-radius:
            20px;

    }


    .tc-terminal-top {

        min-height: 60px;

        padding:
            10px
            11px;

    }


    .tc-market-tab {

        padding:
            9px
            14px;

        font-size:
            12px;

    }


    .tc-symbol-bar {

        min-height: 70px;

        padding:
            11px
            14px;

    }


    .tc-symbol-icon {

        width: 40px;
        height: 40px;

        border-radius:
            12px;

    }


    .tc-symbol-primary strong {
        font-size: 14px;
    }


    .tc-symbol-primary span {
        font-size: 10px;
    }


    .tc-data-note {
        display: none;
    }


    .tc-quick-symbols {

        padding:
            10px
            11px;

    }


    .tc-timeframe-bar {

        padding:
            9px
            11px;

    }


    .tc-timeframe-label {
        display: none;
    }


    .tc-chart-shell {

        min-height:
            530px;

    }


    .tc-chart {

        height:
            530px;

    }


    .tc-terminal-footer {

        padding:
            9px
            12px;

    }


    .tc-terminal-footer > div:last-child {
        display: none;
    }

}


@media (max-width: 420px) {

    .tc-live-badge {
        display: none;
    }


    .tc-market-heading h1 {

        font-size:
            33px;

    }


    .tc-chart,
    .tc-chart-shell {

        height:
            500px;

        min-height:
            500px;

    }

}


/* V2 fast widget bootstrap */

.tc-chart-loading {
    transition:
        opacity .22s ease,
        visibility .22s ease;
}

.tc-chart-loading.is-hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.tc-chart-error {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    text-align: center;
}

.tc-chart-error strong {
    color: var(--gold-2);
    font-size: 13px;
}

.tc-chart-error span {
    color: var(--muted);
    font-size: 11px;
}

#bitycle-ac-widget iframe {
    display: block;
    width: 100% !important;
    height: 100% !important;
    border: 0 !important;
}


/* Bitycle dark boot */
#bitycle-ac-widget,
#bitycle-ac-widget iframe {
    background: #07090d !important;
    color-scheme: dark !important;
}

.tc-chart-shell {
    background: #07090d;
}

#bitycle-ac-widget iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

/* =========================================================
   TAHLIL CLUB / BITYCLE OFFICIAL CHART
   ========================================================= */

#bitycle-ac-widget {
    display: block;
    position: relative;
    width: 100%;
    height: 720px;
    min-height: 540px;
    background: #07090d !important;
    border-radius: 20px;
    overflow: hidden;
}

#bitycle-ac-widget iframe {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 540px !important;
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #07090d !important;
    color-scheme: dark;
}

@media (max-width: 900px) {
    #bitycle-ac-widget {
        height: 650px;
        min-height: 500px;
    }

    #bitycle-ac-widget iframe {
        min-height: 500px !important;
    }
}

@media (max-width: 600px) {
    #bitycle-ac-widget {
        height: 620px;
        min-height: 480px;
        border-radius: 14px;
    }

    #bitycle-ac-widget iframe {
        min-height: 480px !important;
    }
}

/* BEGIN BITYCLE FINAL VISIBILITY FIX */

/*
 * Old TahlilClub loading/error layers were controlled by markets.js.
 * The official Bitycle embed no longer needs those overlays.
 */

.tc-chart-loading,
.tc-chart-error,
.tc-chart-status,
.tc-chart-diagnostic,
.tc-chart-message,
.tc-chart-placeholder {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/*
 * Make the actual widget the top content inside the chart shell.
 */

#bitycle-ac-widget {
    position: relative !important;
    z-index: 50 !important;

    display: block !important;

    width: 100% !important;
    height: 720px !important;
    min-height: 540px !important;

    opacity: 1 !important;
    visibility: visible !important;

    background: #07090d !important;
}

#bitycle-ac-widget iframe {
    position: relative !important;
    z-index: 100 !important;

    display: block !important;

    width: 100% !important;
    height: 100% !important;
    min-height: 540px !important;

    opacity: 1 !important;
    visibility: visible !important;

    border: 0 !important;
    background: #07090d !important;
}

/*
 * Prevent old pseudo-element masks from covering the iframe.
 */

.tc-chart-shell::before,
.tc-chart-shell::after,
.tc-chart::before,
.tc-chart::after {
    pointer-events: none !important;
    z-index: 0 !important;
}

.tc-chart-shell,
.tc-chart {
    position: relative !important;
    overflow: hidden;
}

@media (max-width: 900px) {

    #bitycle-ac-widget {
        height: 650px !important;
        min-height: 500px !important;
    }

    #bitycle-ac-widget iframe {
        min-height: 500px !important;
    }
}

@media (max-width: 600px) {

    #bitycle-ac-widget {
        height: 620px !important;
        min-height: 480px !important;
    }

    #bitycle-ac-widget iframe {
        min-height: 480px !important;
    }
}

/* END BITYCLE FINAL VISIBILITY FIX */


/* BEGIN BITYCLE LOADER FINAL FIX */

.tc-chart-shell {
    position: relative !important;
}

#bitycle-ac-widget {
    position: relative !important;
    z-index: 10 !important;
}

#bitycle-ac-widget iframe {
    position: relative !important;
    z-index: 20 !important;
}

.tc-chart-loading {
    position: absolute !important;
    inset: 0 !important;

    z-index: 100 !important;

    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;

    gap: 14px;

    background:
        radial-gradient(
            circle at center,
            rgba(226,184,92,.06),
            rgba(7,9,13,.96) 42%
        );

    transition:
        opacity .25s ease,
        visibility .25s ease;

    opacity: 1;
    visibility: visible;

    pointer-events: none !important;
}

.tc-chart-loading.is-hidden {
    opacity: 0 !important;
    visibility: hidden !important;
}

.tc-chart-loading.is-error {
    background: rgba(7,9,13,.94);
}

.tc-chart-loading span {
    color: #9ba3b2;
    font-size: 14px;
    text-align: center;
}

.tc-chart-loading.is-error span {
    color: #ff647c;
}

.tc-market-loader {
    width: 34px;
    height: 34px;

    border: 3px solid rgba(226,184,92,.18);
    border-top-color: #e2b85c;

    border-radius: 50%;

    animation: tcMarketSpin .8s linear infinite;
}

@keyframes tcMarketSpin {
    to {
        transform: rotate(360deg);
    }
}

/* END BITYCLE LOADER FINAL FIX */


/* BEGIN TAHLIL BITYCLE PRODUCTION */

/*
 * Bitycle production chart container
 */

#bitycle-ac-widget {
    position: relative !important;

    display: block !important;

    width: 100% !important;

    height: 680px !important;
    min-height: 680px !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    background: #07090d !important;

    border: 0 !important;

    z-index: 1 !important;
}


/*
 * Direct Bitycle iframe
 */

#bitycle-ac-widget-iframe {
    position: absolute !important;

    inset: 0 !important;

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    min-width: 100% !important;
    min-height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;
    outline: 0 !important;

    background: #07090d !important;

    color-scheme: dark;

    z-index: 2 !important;
}


/*
 * Chart shell should not create
 * additional empty vertical space.
 */

.tc-chart-shell {
    position: relative !important;

    display: block !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden !important;

    background: #07090d !important;
}


/*
 * Remove all temporary debugging UI.
 */

#tcBitycleDirectStatus,
#tcBitycleInitStatus,
#tcForcedAuditV2,
#tcBitycleAuditPanel,
.tc-chart-loading,
.tc-chart-error,
.tc-chart-status,
.tc-chart-diagnostic,
.tc-chart-message,
.tc-chart-placeholder {
    display: none !important;
}


/*
 * Desktop
 */

@media (min-width: 1200px) {

    #bitycle-ac-widget {
        height: 720px !important;
        min-height: 720px !important;
    }

}


/*
 * Tablet
 */

@media (
    min-width: 768px
) and (
    max-width: 1199px
) {

    #bitycle-ac-widget {
        height: 650px !important;
        min-height: 650px !important;
    }

}


/*
 * Mobile
 */

@media (max-width: 767px) {

    #bitycle-ac-widget {
        height: 560px !important;
        min-height: 560px !important;
    }

    #bitycle-ac-widget-iframe {
        min-height: 560px !important;
    }

}


/* END TAHLIL BITYCLE PRODUCTION */

/* ==========================================================
   TAHLIL MARKET SYMBOL SEARCH
   ========================================================== */

.tc-market-symbol-search {
    position: relative;
    width: 100%;
    margin: 0 0 14px;
    direction: rtl;
}

.tc-market-search-box {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 8px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 16px;
    background:
        rgba(14,18,25,.88);
    box-shadow:
        0 14px 35px rgba(0,0,0,.20);
    backdrop-filter:
        blur(16px);
}

.tc-market-search-icon {
    flex: 0 0 auto;
    padding: 0 4px;
    color: var(--gold);
    font-size: 23px;
    line-height: 1;
}

#tcGlobalSymbolSearch {
    min-width: 0;
    flex: 1;
    height: 42px;
    padding: 0 6px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text);
    font: inherit;
    font-size: 14px;
}

#tcGlobalSymbolSearch::placeholder {
    color: var(--muted);
    opacity: .72;
}

#tcGlobalSymbolSearchButton {
    flex: 0 0 auto;
    height: 42px;
    padding: 0 18px;
    border: 1px solid
        rgba(226,184,92,.36);
    border-radius: 11px;
    background:
        linear-gradient(
            135deg,
            rgba(226,184,92,.20),
            rgba(226,184,92,.07)
        );
    color: var(--gold-2);
    cursor: pointer;
    font: inherit;
    white-space: nowrap;
}

#tcGlobalSymbolSearchButton:hover {
    border-color:
        rgba(226,184,92,.70);
}

.tc-market-search-hint {
    margin-top: 6px;
    padding: 0 8px;
    color: var(--muted);
    font-size: 11px;
    direction: ltr;
    text-align: left;
}

.tc-market-search-status {
    position: absolute;
    z-index: 20;
    top: calc(100% + 7px);
    right: 8px;
    opacity: 0;
    transform:
        translateY(-4px);
    pointer-events: none;
    padding: 8px 12px;
    border:
        1px solid
        rgba(50,213,131,.28);
    border-radius: 10px;
    background:
        rgba(10,18,15,.96);
    color: var(--success);
    font-size: 12px;
    transition:
        opacity .18s ease,
        transform .18s ease;
}

.tc-market-search-status.is-visible {
    opacity: 1;
    transform:
        translateY(0);
}

.tc-market-search-status.is-error {
    border-color:
        rgba(255,100,124,.30);
    background:
        rgba(26,12,16,.96);
    color: var(--danger);
}

@media (max-width: 700px) {
    .tc-market-search-box {
        gap: 6px;
    }

    #tcGlobalSymbolSearchButton {
        padding:
            0 11px;
        font-size:
            12px;
    }

    #tcGlobalSymbolSearch {
        font-size:
            13px;
    }

    .tc-market-search-hint {
        display: none;
    }
}

/* ==========================================================
   STATIC MARKET SEARCH VISIBILITY FIX
   ========================================================== */

#tcMarketSymbolSearch {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 50 !important;
    width: 100% !important;
    min-height: 68px;
    margin: 0 0 14px !important;
}

#tcMarketSymbolSearch .tc-market-search-box {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    box-sizing: border-box;
}

#tcGlobalSymbolSearch {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

#tcGlobalSymbolSearchButton {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

@media (max-width: 650px) {

    #tcMarketSymbolSearch
    .tc-market-search-box {
        flex-wrap: wrap;
    }

    #tcGlobalSymbolSearch {
        flex: 1 1 180px;
    }

    #tcGlobalSymbolSearchButton {
        flex: 0 0 auto;
    }
}

/* ==========================================================
   TAHLIL MARKET SYMBOL AUTOCOMPLETE
   ========================================================== */

#tcMarketSymbolSearch {
    overflow: visible !important;
}

.tc-symbol-suggestions {
    display: none;
    position: absolute;
    z-index: 500;
    top: 58px;
    right: 0;
    left: 0;
    max-height: 360px;
    overflow-y: auto;
    padding: 6px;
    border: 1px solid
        rgba(255,255,255,.10);
    border-radius: 14px;
    background:
        rgba(10,14,20,.98);
    box-shadow:
        0 22px 60px
        rgba(0,0,0,.48);
    backdrop-filter:
        blur(20px);
}

.tc-symbol-suggestions.is-open {
    display: block;
}

.tc-symbol-suggestion {
    appearance: none;
    display: flex;
    align-items: center;
    justify-content:
        space-between;
    gap: 16px;
    width: 100%;
    min-height: 52px;
    padding: 8px 12px;
    border: 0;
    border-radius: 10px;
    background:
        transparent;
    color:
        var(--text);
    text-align: left;
    cursor: pointer;
    font: inherit;
    direction: ltr;
}

.tc-symbol-suggestion:hover,
.tc-symbol-suggestion.is-selected {
    background:
        rgba(226,184,92,.11);
}

.tc-symbol-main {
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
}

.tc-symbol-main strong {
    min-width: 92px;
    color:
        var(--gold-2);
    font-size: 13px;
}

.tc-symbol-main span {
    overflow: hidden;
    color:
        var(--muted);
    font-size: 12px;
    text-overflow:
        ellipsis;
    white-space: nowrap;
}

.tc-symbol-market {
    flex: 0 0 auto;
    padding: 4px 7px;
    border: 1px solid
        rgba(255,255,255,.08);
    border-radius: 999px;
    color:
        var(--muted);
    font-size: 10px;
}

#tcGlobalSymbolSearch:focus {
    caret-color:
        var(--gold);
}

@media (max-width: 650px) {

    .tc-symbol-suggestions {
        top: 106px;
    }

    .tc-symbol-main strong {
        min-width: 78px;
    }
}

/* ==========================================================
   TAHLIL FOREX QUICK SYMBOLS
   ========================================================== */

.tc-forex-quick-symbols {
    display: flex;
    align-items: center;
    gap: 7px;
    width: 100%;
    margin: 0 0 12px;
    overflow-x: auto;
    padding: 2px 0 5px;
    scrollbar-width: thin;
}

.tc-forex-label {
    flex: 0 0 auto;
    color: var(--muted);
    font-size: 12px;
}

.tc-forex-quick-symbols button {
    appearance: none;
    flex: 0 0 auto;
    min-height: 32px;
    padding: 5px 10px;
    border: 1px solid
        rgba(255,255,255,.09);
    border-radius: 999px;
    background:
        rgba(255,255,255,.025);
    color:
        var(--muted);
    cursor: pointer;
    font: inherit;
    font-size: 11px;
    direction: ltr;
    transition:
        background .18s ease,
        border-color .18s ease,
        color .18s ease;
}

.tc-forex-quick-symbols button:hover,
.tc-forex-quick-symbols button.is-active {
    border-color:
        rgba(226,184,92,.38);
    background:
        rgba(226,184,92,.10);
    color:
        var(--gold-2);
}

/* ==========================================================
   TAHLIL DYNAMIC SYMBOL SEARCH V2
   ========================================================== */


/*
 * Fixed search:
 * small permanent search in upper corner.
 */
#tcMarketSymbolSearch {
    width: min(340px, 100%);
    margin:
        0 0 14px auto;
    position: relative;
    z-index: 18;
}

#tcMarketSymbolSearch
.tc-market-search-box {
    min-height: 42px;
}


/*
 * Center modal.
 */
.tc-dynamic-search-overlay {
    position: fixed;
    inset: 0;
    z-index: 99990;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 20px;

    background:
        rgba(3, 5, 9, .72);

    backdrop-filter:
        blur(8px);
    -webkit-backdrop-filter:
        blur(8px);
}

.tc-dynamic-search-overlay[hidden] {
    display: none !important;
}


.tc-dynamic-search-dialog {
    width:
        min(
            590px,
            calc(100vw - 32px)
        );

    max-height:
        min(
            650px,
            calc(100vh - 60px)
        );

    overflow: hidden;

    border:
        1px solid
        rgba(226,184,92,.24);

    border-radius: 22px;

    background:
        rgba(13,17,24,.97);

    box-shadow:
        0 32px 100px
        rgba(0,0,0,.65);

    direction: rtl;
}


.tc-dynamic-search-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

    padding:
        18px 20px 13px;

    border-bottom:
        1px solid
        rgba(255,255,255,.07);
}


.tc-dynamic-search-head > div {
    display: flex;
    flex-direction: column;
    gap: 3px;
}


.tc-dynamic-search-head strong {
    color:
        var(--text);

    font-size: 14px;
}


.tc-dynamic-search-head span {
    color:
        var(--muted);

    font-size: 11px;
}


.tc-dynamic-search-close {
    appearance: none;

    width: 34px;
    height: 34px;

    border:
        1px solid
        rgba(255,255,255,.09);

    border-radius: 50%;

    background:
        rgba(255,255,255,.04);

    color:
        var(--muted);

    cursor: pointer;

    font-size: 22px;
    line-height: 1;
}


.tc-dynamic-search-input-wrap {
    display: flex;
    align-items: center;
    gap: 10px;

    margin: 16px;

    padding:
        0 15px;

    min-height: 54px;

    border:
        1px solid
        rgba(226,184,92,.32);

    border-radius: 14px;

    background:
        rgba(255,255,255,.035);

    box-shadow:
        inset 0 0 0 1px
        rgba(226,184,92,.04);
}


.tc-dynamic-search-input-wrap > span {
    color:
        var(--gold);

    font-size: 21px;
}


#tcDynamicSearchInput {
    flex: 1 1 auto;

    min-width: 0;

    border: 0;
    outline: 0;

    background:
        transparent;

    color:
        var(--text);

    font: inherit;

    font-size: 17px;

    direction: ltr;
    text-align: left;
}


#tcDynamicSearchInput::placeholder {
    color:
        rgba(155,163,178,.62);
}


.tc-dynamic-search-results {
    max-height: 380px;
    overflow-y: auto;

    padding:
        0 10px 10px;
}


.tc-dynamic-search-result {
    appearance: none;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;

    width: 100%;

    min-height: 55px;

    padding:
        9px 12px;

    border:
        1px solid
        transparent;

    border-radius: 12px;

    background:
        transparent;

    cursor: pointer;

    font: inherit;
}


.tc-dynamic-search-result:hover,
.tc-dynamic-search-result.is-active {
    border-color:
        rgba(226,184,92,.22);

    background:
        rgba(226,184,92,.08);
}


.tc-dynamic-result-code {
    color:
        var(--gold-2);

    font-size: 14px;
    font-weight: 700;

    direction: ltr;
}


.tc-dynamic-result-meta {
    color:
        var(--muted);

    font-size: 11px;

    direction: ltr;
}


.tc-dynamic-search-empty {
    padding: 30px 15px;

    color:
        var(--muted);

    text-align: center;
}


.tc-dynamic-search-footer {
    padding:
        10px 17px 13px;

    border-top:
        1px solid
        rgba(255,255,255,.06);

    color:
        var(--muted);

    font-size: 10px;

    text-align: center;
}


body.tc-search-modal-open {
    overflow: hidden;
}


/*
 * Forex shortcuts:
 * visually similar to the crypto shortcuts.
 */
.tc-forex-symbol-grid {
    flex-wrap: wrap;
    overflow-x: visible;
    gap: 7px;
}


.tc-forex-symbol-grid
.tc-forex-label {
    width: 100%;

    margin-bottom: 2px;
}


.tc-forex-symbol-grid button {
    min-height: 34px;

    padding:
        6px 11px;
}


@media (max-width: 650px) {

    #tcMarketSymbolSearch {
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }


    .tc-dynamic-search-overlay {
        padding: 12px;
    }


    .tc-dynamic-search-dialog {
        width: 100%;
        max-height:
            calc(100vh - 24px);
    }


    .tc-dynamic-search-result {
        align-items: flex-start;
        flex-direction: column;
        gap: 3px;
    }
}


/* ==========================================================
   TAHLIL FIXED SEARCH FINAL POSITION V1
   MUST override old !important visibility patch.
   ========================================================== */

#tcMarketSymbolSearch {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 320px !important;
    max-width: calc(100% - 24px) !important;

    min-height: 0 !important;

    margin:
        0 0 12px auto !important;

    position: relative !important;

    z-index: 70 !important;
}

#tcMarketSymbolSearch
.tc-market-search-box {
    display: flex !important;
    align-items: center !important;

    width: 100% !important;

    min-height: 40px !important;

    box-sizing: border-box !important;
}

#tcGlobalSymbolSearch {
    min-width: 0 !important;
    height: 38px !important;
}

#tcGlobalSymbolSearchButton {
    min-height: 38px !important;

    padding:
        0 12px !important;
}

#tcMarketSymbolSearch
.tc-market-search-hint {
    display: none !important;
}

#tcMarketSymbolSearch
.tc-market-search-status:empty {
    display: none !important;
}


/*
 * Dynamic modal must always win visually.
 */

#tcDynamicSearchOverlay {
    position: fixed !important;

    inset: 0 !important;

    z-index: 2147483000 !important;

    display: flex !important;

    align-items: center !important;
    justify-content: center !important;

    padding: 20px !important;

    background:
        rgba(3,5,9,.78) !important;
}

#tcDynamicSearchOverlay[hidden] {
    display: none !important;
}

#tcDynamicSearchOverlay
.tc-dynamic-search-dialog {
    position: relative !important;

    z-index: 2147483001 !important;

    width:
        min(
            600px,
            calc(100vw - 30px)
        ) !important;

    background:
        #0d1118 !important;

    border:
        1px solid
        rgba(226,184,92,.38) !important;

    border-radius:
        20px !important;

    box-shadow:
        0 35px 120px
        rgba(0,0,0,.75) !important;
}


/*
 * Forex quick buttons:
 * make them clearly visible like Crypto.
 */

#tcForexQuickSymbols {
    display: flex;

    flex-wrap: wrap;

    align-items: center;

    gap: 8px;

    margin:
        10px 0 14px;

    padding:
        12px;

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius:
        14px;

    background:
        rgba(255,255,255,.025);
}

#tcForexQuickSymbols[hidden] {
    display: none !important;
}

#tcForexQuickSymbols
.tc-forex-label {
    flex:
        0 0 100%;

    color:
        var(--muted);

    font-size:
        11px;
}

#tcForexQuickSymbols button {
    appearance: none;

    min-height:
        35px;

    padding:
        6px 11px;

    border:
        1px solid
        rgba(226,184,92,.20);

    border-radius:
        999px;

    background:
        rgba(226,184,92,.055);

    color:
        var(--text);

    font:
        inherit;

    font-size:
        11px;

    cursor:
        pointer;
}

#tcForexQuickSymbols button:hover {
    border-color:
        rgba(226,184,92,.55);

    background:
        rgba(226,184,92,.12);

    color:
        var(--gold-2);
}


@media (max-width: 650px) {

    #tcMarketSymbolSearch {
        width: 100% !important;

        max-width: 100% !important;

        margin:
            0 0 10px !important;
    }

    #tcDynamicSearchOverlay {
        padding:
            10px !important;
    }

}


/* ==========================================================
   TAHLIL CHART HEADER FINAL V1
   ========================================================== */

.tc-chart-header-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    gap: 18px !important;

    width: 100% !important;

    margin:
        0 0 12px !important;

    padding:
        0 2px !important;
}


.tc-chart-market-title {
    display: flex;
    align-items: center;

    gap: 9px;

    flex:
        0 0 auto;
}


.tc-chart-market-dot {
    width: 8px;
    height: 8px;

    flex:
        0 0 8px;

    border-radius: 50%;

    background:
        var(--gold);

    box-shadow:
        0 0 14px
        rgba(226,184,92,.55);
}


.tc-chart-market-title > div {
    display: flex;
    flex-direction: column;

    gap: 2px;
}


#tcChartMarketTitle {
    color:
        var(--text);

    font-size:
        13px;

    font-weight:
        700;
}


#tcChartMarketSubtitle {
    color:
        var(--muted);

    font-size:
        10px;
}


/*
 * IMPORTANT:
 * Fixed search is now actually located in
 * the chart header DOM, not merely repositioned.
 */

.tc-chart-header-row
#tcMarketSymbolSearch {
    flex:
        0 1 330px !important;

    width:
        330px !important;

    max-width:
        330px !important;

    margin:
        0 !important;

    min-height:
        0 !important;
}


.tc-chart-header-row
#tcMarketSymbolSearch
.tc-market-search-box {
    width:
        100% !important;

    min-height:
        38px !important;
}


.tc-chart-header-row
#tcMarketSymbolSearch
.tc-market-search-hint {
    display:
        none !important;
}


/*
 * Forex quick symbols now belong to the
 * Forex panel itself.
 */

#tcForexPanel
#tcForexQuickSymbols {
    display:
        flex;

    flex-wrap:
        wrap;

    align-items:
        center;

    gap:
        7px;

    width:
        100%;

    margin:
        12px 0 0;

    padding:
        0;
}


#tcForexPanel[hidden]
#tcForexQuickSymbols {
    display:
        none !important;
}


#tcForexPanel
#tcForexQuickSymbols
.tc-forex-label {
    flex:
        0 0 100%;

    margin-bottom:
        3px;

    color:
        var(--muted);

    font-size:
        10px;
}


#tcForexPanel
#tcForexQuickSymbols button {
    min-height:
        34px;

    padding:
        6px 12px;

    border:
        1px solid
        rgba(255,255,255,.09);

    border-radius:
        999px;

    background:
        rgba(255,255,255,.035);

    color:
        var(--text);

    font:
        inherit;

    font-size:
        11px;

    font-weight:
        600;

    direction:
        ltr;

    cursor:
        pointer;

    transition:
        .16s ease;
}


#tcForexPanel
#tcForexQuickSymbols button:hover {
    color:
        var(--gold-2);

    border-color:
        rgba(226,184,92,.40);

    background:
        rgba(226,184,92,.08);
}


@media (max-width: 700px) {

    .tc-chart-header-row {
        align-items:
            stretch !important;

        flex-direction:
            column !important;

        gap:
            8px !important;
    }


    .tc-chart-header-row
    #tcMarketSymbolSearch {
        width:
            100% !important;

        max-width:
            100% !important;

        flex:
            0 0 auto !important;
    }

}


/* ==========================================================
   TAHLIL MULTI CHART V1
   Isolated extension.
   Existing single-chart rules remain untouched.
   ========================================================== */

.tc-multichart-control {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;

    width: 100%;

    margin: 0 0 12px;
    padding: 0 2px;
}

.tc-multichart-label {
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
}

.tc-multichart-buttons {
    display: flex;
    align-items: center;
    gap: 5px;

    padding: 4px;

    border: 1px solid var(--line);
    border-radius: 12px;

    background: rgba(14,18,25,.72);
}

.tc-multichart-buttons button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 34px;
    height: 32px;

    padding: 0 9px;

    border: 1px solid transparent;
    border-radius: 9px;

    background: transparent;

    color: var(--muted);

    font: inherit;
    font-size: 12px;
    font-weight: 700;

    cursor: pointer;

    transition: .16s ease;
}

.tc-multichart-buttons button:hover {
    color: var(--gold-2);
    background: rgba(226,184,92,.07);
}

.tc-multichart-buttons button.active {
    color: var(--gold-2);

    border-color:
        rgba(226,184,92,.28);

    background:
        rgba(226,184,92,.12);

    box-shadow:
        inset 0 0 0 1px
        rgba(226,184,92,.04);
}


/*
 * Grid wrapper.
 */

.tc-multichart-grid {
    display: grid;

    width: 100%;

    gap: 12px;

    align-items: stretch;
}


/*
 * Single chart must remain visually identical.
 */

.tc-multichart-count-1 {
    grid-template-columns:
        minmax(0, 1fr);
}


/*
 * 2 charts:
 * 2 columns.
 */

.tc-multichart-count-2 {
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}


/*
 * 3 charts:
 * 3 columns on large desktop.
 */

.tc-multichart-count-3 {
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}


/*
 * 4 charts:
 * 2 x 2.
 */

.tc-multichart-count-4 {
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
}


/*
 * 6 charts:
 * 3 x 2.
 */

.tc-multichart-count-6 {
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
}


/*
 * Original chart shell is Chart #1.
 */

.tc-multichart-grid
.tc-chart-shell {
    min-width: 0;

    margin: 0 !important;
}


/*
 * Additional chart cards.
 */

.tc-extra-chart {
    position: relative;

    min-width: 0;

    overflow: hidden;

    border: 1px solid var(--line);
    border-radius: 18px;

    background:
        var(--panel-solid);

    box-shadow:
        0 18px 45px
        rgba(0,0,0,.24);
}


/*
 * Compact title bar for charts 2-6.
 */

.tc-extra-chart-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 10px;

    min-height: 42px;

    padding: 7px 10px;

    border-bottom:
        1px solid var(--line);

    background:
        rgba(10,13,18,.94);
}

.tc-extra-chart-title {
    min-width: 0;

    color: var(--text);

    font-size: 11px;
    font-weight: 700;

    direction: ltr;

    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tc-extra-chart-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 25px;

    width: 25px;
    height: 25px;

    border: 1px solid
        rgba(226,184,92,.24);

    border-radius: 8px;

    color: var(--gold-2);

    background:
        rgba(226,184,92,.08);

    font-size: 10px;
    font-weight: 800;
}


/*
 * Extra Bitycle iframe.
 */

.tc-extra-chart iframe {
    display: block;

    width: 100%;

    height: 650px;

    border: 0;

    background:
        #11151d;
}


/*
 * In multi-chart mode reduce height so the page
 * does not become unnecessarily huge.
 */

.tc-multichart-grid:not(.tc-multichart-count-1)
.tc-chart-shell
#bitycle-ac-widget-iframe {
    height: 650px !important;
}


/*
 * Medium screens:
 * never force 3 tiny columns.
 */

@media (max-width: 1180px) {

    .tc-multichart-count-3,
    .tc-multichart-count-6 {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/*
 * Mobile:
 * every chart gets full width.
 */

@media (max-width: 760px) {

    .tc-multichart-control {
        justify-content:
            space-between;

        gap: 8px;
    }

    .tc-multichart-label {
        font-size: 11px;
    }

    .tc-multichart-buttons {
        gap: 3px;
    }

    .tc-multichart-buttons button {
        min-width: 30px;
        height: 30px;

        padding: 0 7px;
    }

    .tc-multichart-count-2,
    .tc-multichart-count-3,
    .tc-multichart-count-4,
    .tc-multichart-count-6 {
        grid-template-columns:
            minmax(0, 1fr);
    }

    .tc-extra-chart iframe {
        height: 560px;
    }

    .tc-multichart-grid:not(.tc-multichart-count-1)
    .tc-chart-shell
    #bitycle-ac-widget-iframe {
        height: 560px !important;
    }

}



/* ==========================================================
   BEGIN TAHLIL DEDICATED CHART WORKSPACE
   /markets/chart/
   ========================================================== */


/*
 * Entry button on normal markets page
 */

.tc-open-market-workspace {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 7px;

    min-height: 34px;

    padding: 0 12px;

    border:
        1px solid rgba(226,184,92,.28);

    border-radius: 10px;

    background:
        rgba(226,184,92,.10);

    color: var(--gold-2);

    font-size: 11px;
    font-weight: 700;

    text-decoration: none;

    white-space: nowrap;

    transition:
        background .16s ease,
        border-color .16s ease,
        transform .16s ease;
}

.tc-open-market-workspace:hover {
    background:
        rgba(226,184,92,.17);

    border-color:
        rgba(226,184,92,.46);

    transform:
        translateY(-1px);
}


/*
 * Workspace document
 */

body.tc-chart-workspace {
    width: 100%;
    min-width: 0;

    min-height: 100vh;
    min-height: 100dvh;

    margin: 0;

    overflow-x: hidden;

    background: #07090d;
}


/*
 * Disable decorative website background layer.
 */

body.tc-chart-workspace::before {
    display: none !important;
}


/*
 * Minimal top bar.
 *
 * This is the ONLY website-level navigation retained.
 */

.tc-chart-workspace-bar {
    position: relative;

    z-index: 200;

    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 16px;

    width: 100%;

    min-height: 54px;

    padding:
        max(8px, env(safe-area-inset-top))
        max(14px, env(safe-area-inset-right))
        8px
        max(14px, env(safe-area-inset-left));

    border-bottom:
        1px solid rgba(255,255,255,.07);

    background:
        rgba(7,9,13,.96);

    backdrop-filter:
        blur(18px);
}


.tc-chart-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 7px;

    min-height: 34px;

    padding: 0 12px;

    border:
        1px solid rgba(226,184,92,.28);

    border-radius: 10px;

    background:
        rgba(226,184,92,.08);

    color: var(--gold-2);

    text-decoration: none;

    font-size: 11px;
    font-weight: 700;

    white-space: nowrap;
}


.tc-chart-back:hover {
    background:
        rgba(226,184,92,.15);
}


.tc-chart-workspace-brand {
    display: flex;
    align-items: baseline;

    gap: 8px;

    min-width: 0;
}


.tc-chart-workspace-brand strong {
    color: var(--text);

    font-size: 12px;
    font-weight: 800;
}


.tc-chart-workspace-brand span {
    color: var(--muted);

    font-size: 10px;
}


/*
 * Remove all normal page spacing.
 */

.tc-chart-workspace
.tc-market-main {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;
}


.tc-chart-workspace
.tc-terminal-section {
    width: 100%;

    margin: 0 !important;
    padding: 0 !important;
}


/*
 * Critical:
 * bypass global 1180px .container limit.
 */

.tc-chart-workspace
.tc-terminal-section
> .container {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}


/*
 * Terminal becomes the application shell.
 */

.tc-chart-workspace
.tc-terminal {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;

    background: #07090d !important;
}


/*
 * Keep controls compact.
 */

.tc-chart-workspace
.tc-terminal-top,

.tc-chart-workspace
.tc-symbol-bar,

.tc-chart-workspace
.tc-market-controls,

.tc-chart-workspace
.tc-chart-header-row,

.tc-chart-workspace
.tc-multichart-control {
    padding-left:
        clamp(10px, 1.25vw, 24px);

    padding-right:
        clamp(10px, 1.25vw, 24px);
}


/*
 * Search must not become ridiculously wide
 * on ultrawide monitors.
 */

.tc-chart-workspace
.tc-chart-header-row {
    width: 100%;

    margin: 0 !important;
}


.tc-chart-workspace
#tcMarketSymbolSearch {
    width:
        min(100%, 760px);

    margin-bottom: 10px;
}


/*
 * Multi-chart selector.
 */

.tc-chart-workspace
.tc-multichart-control {
    margin-bottom: 8px;
}


/*
 * Grid uses entire viewport width.
 */

.tc-chart-workspace
.tc-multichart-grid {
    width: 100% !important;
    max-width: none !important;

    gap: 6px;

    padding:
        0
        clamp(4px, .55vw, 10px)
        clamp(4px, .55vw, 10px);
}


/*
 * Main chart:
 *
 * top bar ≈ 54px
 * terminal controls consume the remaining upper space.
 * clamp provides a sane minimum on shorter screens.
 */

.tc-chart-workspace
.tc-multichart-count-1
.tc-chart-shell {
    height:
        max(
            620px,
            calc(100dvh - 285px)
        ) !important;

    min-height:
        max(
            620px,
            calc(100dvh - 285px)
        ) !important;

    border-radius: 0 !important;
}


/*
 * Existing Bitycle placeholder receives same height.
 */

.tc-chart-workspace
.tc-multichart-count-1
#bitycle-ac-widget {
    height: 100% !important;
    min-height: 100% !important;
}


/*
 * Main iframe already uses absolute inset:0,
 * but repeat the dimensions specifically for workspace.
 */

.tc-chart-workspace
.tc-multichart-count-1
#bitycle-ac-widget-iframe {
    width: 100% !important;
    height: 100% !important;

    min-width: 100% !important;
    min-height: 100% !important;
}


/*
 * Multi-chart modes:
 * fit rows intelligently to the viewport.
 */

.tc-chart-workspace
.tc-multichart-count-2
.tc-chart-shell,

.tc-chart-workspace
.tc-multichart-count-2
.tc-extra-chart {
    min-height:
        max(
            520px,
            calc(100dvh - 285px)
        );
}


.tc-chart-workspace
.tc-multichart-count-3
.tc-chart-shell,

.tc-chart-workspace
.tc-multichart-count-3
.tc-extra-chart {
    min-height:
        max(
            480px,
            calc(100dvh - 285px)
        );
}


.tc-chart-workspace
.tc-multichart-count-4
.tc-chart-shell,

.tc-chart-workspace
.tc-multichart-count-4
.tc-extra-chart,

.tc-chart-workspace
.tc-multichart-count-6
.tc-chart-shell,

.tc-chart-workspace
.tc-multichart-count-6
.tc-extra-chart {
    min-height:
        max(
            420px,
            calc((100dvh - 300px) / 2)
        );
}


/*
 * Extra iframe fills its card beneath its tiny header.
 */

.tc-chart-workspace
.tc-extra-chart {
    display: flex;
    flex-direction: column;
}


.tc-chart-workspace
.tc-extra-chart iframe {
    flex: 1 1 auto;

    width: 100%;

    height: auto !important;

    min-height: 0;
}


/*
 * Existing rule forces Chart #1 to 650px in multi mode.
 * Override ONLY inside dedicated workspace.
 */

.tc-chart-workspace
.tc-multichart-grid:not(.tc-multichart-count-1)
.tc-chart-shell
#bitycle-ac-widget-iframe {
    height: 100% !important;

    min-height: 100% !important;
}


/*
 * The normal website footer inside terminal isn't useful
 * in the analysis workspace.
 */

.tc-chart-workspace
.tc-terminal-footer {
    display: none !important;
}


/*
 * Large / ultrawide displays.
 *
 * 3 and 6 charts may use three columns.
 */

@media (min-width: 1500px) {

    .tc-chart-workspace
    .tc-multichart-count-3,

    .tc-chart-workspace
    .tc-multichart-count-6 {
        grid-template-columns:
            repeat(
                3,
                minmax(0, 1fr)
            ) !important;
    }

}


/*
 * Laptop / tablet landscape.
 */

@media
(max-width: 1180px) {

    .tc-chart-workspace
    .tc-multichart-count-3,

    .tc-chart-workspace
    .tc-multichart-count-6 {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            ) !important;
    }

}


/*
 * Mobile / portrait tablet.
 */

@media
(max-width: 760px) {

    .tc-chart-workspace-bar {
        min-height: 48px;

        padding-top:
            max(
                6px,
                env(safe-area-inset-top)
            );

        padding-bottom: 6px;
    }


    .tc-chart-workspace-brand span {
        display: none;
    }


    .tc-chart-workspace
    .tc-terminal-top,

    .tc-chart-workspace
    .tc-symbol-bar,

    .tc-chart-workspace
    .tc-market-controls,

    .tc-chart-workspace
    .tc-chart-header-row,

    .tc-chart-workspace
    .tc-multichart-control {
        padding-left: 8px;
        padding-right: 8px;
    }


    .tc-chart-workspace
    .tc-multichart-grid {
        padding:
            0 3px 4px;

        gap: 6px;
    }


    .tc-chart-workspace
    .tc-multichart-count-1
    .tc-chart-shell {
        height:
            max(
                520px,
                calc(100dvh - 320px)
            ) !important;

        min-height:
            max(
                520px,
                calc(100dvh - 320px)
            ) !important;
    }


    .tc-chart-workspace
    .tc-multichart-count-2,

    .tc-chart-workspace
    .tc-multichart-count-3,

    .tc-chart-workspace
    .tc-multichart-count-4,

    .tc-chart-workspace
    .tc-multichart-count-6 {
        grid-template-columns:
            minmax(0, 1fr) !important;
    }


    .tc-chart-workspace
    .tc-extra-chart,

    .tc-chart-workspace
    .tc-multichart-grid:not(.tc-multichart-count-1)
    .tc-chart-shell {
        min-height: 520px;
    }

}


/* ==========================================================
   END TAHLIL DEDICATED CHART WORKSPACE
   ========================================================== */



/* ==========================================================
   BEGIN TAHLIL MARKETS ENTRY CTA V1
   ========================================================== */


/* Hero CTA */

.tc-market-hero-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;

    gap: 12px;

    margin-top: 24px;
}


.tc-market-primary-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 9px;

    min-height: 48px;

    padding: 0 20px;

    border:
        1px solid rgba(246,215,143,.45);

    border-radius: 14px;

    background:
        linear-gradient(
            135deg,
            #e2b85c,
            #b88737
        );

    color: #090b0f;

    font-size: 13px;
    font-weight: 800;

    text-decoration: none;

    box-shadow:
        0 12px 35px
        rgba(226,184,92,.20);

    transition:
        transform .18s ease,
        box-shadow .18s ease;
}


.tc-market-primary-cta:hover {
    transform:
        translateY(-2px);

    box-shadow:
        0 16px 42px
        rgba(226,184,92,.28);
}


.tc-market-hero-note {
    color: var(--muted);

    font-size: 11px;
}


/* ----------------------------------------------------------
   Main explanation section
   ---------------------------------------------------------- */

.tc-market-intro {
    padding:
        8px 0 28px;
}


.tc-market-intro-card {
    display: grid;

    grid-template-columns:
        minmax(0, 1.65fr)
        minmax(270px, .75fr);

    gap: 28px;

    align-items: stretch;

    padding:
        clamp(22px, 3vw, 38px);

    border:
        1px solid rgba(255,255,255,.08);

    border-radius: 24px;

    background:
        radial-gradient(
            circle at 85% 10%,
            rgba(226,184,92,.10),
            transparent 33%
        ),
        rgba(14,18,25,.70);

    box-shadow:
        0 24px 70px
        rgba(0,0,0,.22);

    backdrop-filter:
        blur(18px);
}


.tc-market-intro-copy {
    min-width: 0;
}


.tc-market-intro-eyebrow {
    display: inline-block;

    margin-bottom: 10px;

    color: var(--gold);

    font-size: 10px;
    font-weight: 800;

    letter-spacing: .08em;
}


.tc-market-intro h2 {
    margin:
        0 0 12px;

    color: var(--text);

    font-size:
        clamp(
            1.35rem,
            2.2vw,
            2rem
        );

    line-height: 1.5;
}


.tc-market-intro p {
    max-width: 720px;

    margin: 0;

    color: var(--muted);

    font-size: 13px;

    line-height: 2;
}


.tc-market-intro-features {
    display: grid;

    grid-template-columns:
        repeat(
            2,
            minmax(0, 1fr)
        );

    gap: 9px;

    margin-top: 22px;
}


.tc-market-intro-features span {
    display: flex;
    align-items: center;

    gap: 9px;

    min-height: 42px;

    padding: 8px 11px;

    border:
        1px solid rgba(255,255,255,.07);

    border-radius: 11px;

    background:
        rgba(255,255,255,.025);

    color: var(--muted);

    font-size: 11px;
}


.tc-market-intro-features b {
    color: var(--gold-2);

    direction: ltr;

    font-size: 10px;
}


/* ----------------------------------------------------------
   Launch card
   ---------------------------------------------------------- */

.tc-market-intro-action {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;

    min-width: 0;

    padding:
        clamp(18px, 2vw, 26px);

    border:
        1px solid rgba(226,184,92,.16);

    border-radius: 18px;

    background:
        rgba(7,9,13,.62);
}


.tc-market-intro-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 42px;
    height: 42px;

    margin-bottom: 15px;

    border:
        1px solid rgba(226,184,92,.25);

    border-radius: 12px;

    background:
        rgba(226,184,92,.09);

    color: var(--gold);

    font-size: 20px;
}


.tc-market-intro-action strong {
    margin-bottom: 6px;

    color: var(--text);

    font-size: 14px;
}


.tc-market-intro-action > span {
    margin-bottom: 18px;

    color: var(--muted);

    font-size: 11px;

    line-height: 1.8;
}


.tc-market-launch-button {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 9px;

    width: 100%;

    min-height: 46px;

    padding: 0 15px;

    border:
        1px solid rgba(226,184,92,.38);

    border-radius: 12px;

    background:
        linear-gradient(
            135deg,
            rgba(226,184,92,.19),
            rgba(226,184,92,.07)
        );

    color: var(--gold-2);

    font-size: 12px;
    font-weight: 800;

    text-decoration: none;

    transition:
        .18s ease;
}


.tc-market-launch-button:hover {
    border-color:
        rgba(226,184,92,.65);

    background:
        rgba(226,184,92,.15);
}


.tc-market-launch-button i {
    font-style: normal;
}


/* Tablet */

@media (max-width: 900px) {

    .tc-market-intro-card {
        grid-template-columns:
            minmax(0, 1fr);
    }

}


/* Mobile */

@media (max-width: 650px) {

    .tc-market-hero-actions {
        flex-direction: column;

        align-items: stretch;
    }


    .tc-market-primary-cta {
        width: 100%;
    }


    .tc-market-hero-note {
        text-align: center;
    }


    .tc-market-intro {
        padding-bottom: 18px;
    }


    .tc-market-intro-card {
        gap: 18px;

        padding: 17px;

        border-radius: 18px;
    }


    .tc-market-intro-features {
        grid-template-columns:
            minmax(0, 1fr);
    }

}


/* ==========================================================
   END TAHLIL MARKETS ENTRY CTA V1
   ========================================================== */


/* ==========================================================
   TAHLIL MARKET REGISTRATION GATE V1
   Level 2 only.
   Does not modify chart, search or market controls.
   ========================================================== */

.tc-registration-gate[hidden] {
    display: none !important;
}

.tc-registration-gate {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    direction: rtl;
}

.tc-registration-gate-backdrop {
    position: absolute;
    inset: 0;
    background:
        rgba(5, 8, 15, 0.78);
    backdrop-filter:
        blur(8px);
    -webkit-backdrop-filter:
        blur(8px);
}

.tc-registration-gate-dialog {
    position: relative;
    z-index: 1;
    width: min(100%, 470px);
    padding: 30px 28px 25px;
    border:
        1px solid
        rgba(255, 255, 255, 0.12);
    border-radius: 24px;
    background:
        linear-gradient(
            145deg,
            rgba(24, 28, 39, 0.98),
            rgba(12, 15, 23, 0.98)
        );
    box-shadow:
        0 28px 80px
        rgba(0, 0, 0, 0.55);
    color: #fff;
    text-align: center;
}

.tc-registration-gate-dialog:focus {
    outline: none;
}

.tc-registration-gate-close {
    position: absolute;
    top: 13px;
    left: 15px;
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 50%;
    background:
        rgba(255, 255, 255, 0.07);
    color: rgba(255, 255, 255, 0.75);
    font-size: 25px;
    line-height: 1;
    cursor: pointer;
}

.tc-registration-gate-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    margin:
        2px auto
        18px;
    border-radius: 18px;
    background:
        rgba(255, 255, 255, 0.09);
    font-size: 27px;
    font-weight: 800;
}

.tc-registration-gate-dialog h2 {
    margin:
        0 0 12px;
    font-size:
        clamp(21px, 4vw, 27px);
    line-height: 1.5;
}

.tc-registration-gate-dialog p {
    margin:
        0;
    color:
        rgba(255, 255, 255, 0.68);
    line-height:
        1.9;
}

.tc-registration-gate-feature {
    margin:
        18px 0 0;
    padding:
        11px 14px;
    border-radius:
        13px;
    background:
        rgba(255, 255, 255, 0.06);
    color:
        rgba(255, 255, 255, 0.88);
    font-size:
        14px;
}

.tc-registration-gate-actions {
    display:
        grid;
    grid-template-columns:
        1fr 1fr;
    gap:
        10px;
    margin-top:
        24px;
}

.tc-registration-gate-register,
.tc-registration-gate-later {
    min-height:
        48px;
    display:
        flex;
    align-items:
        center;
    justify-content:
        center;
    border-radius:
        14px;
    font:
        inherit;
    font-weight:
        700;
    text-decoration:
        none;
    cursor:
        pointer;
}

.tc-registration-gate-register {
    border:
        1px solid
        rgba(255, 255, 255, 0.18);
    background:
        #fff;
    color:
        #11151d;
}

.tc-registration-gate-later {
    border:
        1px solid
        rgba(255, 255, 255, 0.12);
    background:
        rgba(255, 255, 255, 0.055);
    color:
        #fff;
}

.tc-registration-gate-login {
    margin-top:
        17px !important;
    font-size:
        13px;
}

.tc-registration-gate-login a {
    color:
        #fff;
    font-weight:
        700;
}

html.tc-registration-gate-open,
html.tc-registration-gate-open body {
    overflow:
        hidden !important;
}

@media (max-width: 560px) {

    .tc-registration-gate {
        align-items:
            flex-end;
        padding:
            12px;
    }

    .tc-registration-gate-dialog {
        width:
            100%;
        padding:
            28px 20px 22px;
        border-radius:
            22px;
    }

    .tc-registration-gate-actions {
        grid-template-columns:
            1fr;
    }
}


/* TAHLIL_LEVEL3_WATCHLIST_FRONTEND_V1 */

.tc-watchlist-actions {
    position: fixed;
    left: 18px;
    bottom: 18px;
    z-index: 2147482000;
    display: flex;
    align-items: center;
    gap: 8px;
    direction: rtl;
}

.tc-watchlist-button,
.tc-watchlist-star,
.tc-watchlist-close {
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(13,18,28,.94);
    color: #fff;
    cursor: pointer;
    font: inherit;
}

.tc-watchlist-button {
    min-height: 44px;
    padding: 8px 13px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 7px;
    box-shadow: 0 12px 34px rgba(0,0,0,.25);
}

.tc-watchlist-star {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    font-size: 25px;
    line-height: 1;
}

.tc-watchlist-star.is-saved {
    background: rgba(240,180,41,.16);
    border-color: rgba(240,180,41,.5);
}

.tc-watchlist-count {
    min-width: 21px;
    height: 21px;
    padding: 0 5px;
    border-radius: 20px;
    background: rgba(255,255,255,.1);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
}

.tc-watchlist-panel {
    position: fixed;
    left: 18px;
    bottom: 74px;
    z-index: 2147481999;
    width: min(360px, calc(100vw - 36px));
    max-height: min(560px, calc(100vh - 110px));
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 16px;
    background: rgba(10,14,23,.98);
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,0,0,.45);
    direction: rtl;
}

.tc-watchlist-panel[hidden] {
    display: none !important;
}

.tc-watchlist-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 14px;
    border-bottom: 1px solid rgba(255,255,255,.09);
}

.tc-watchlist-head > div {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.tc-watchlist-head strong {
    font-size: 14px;
}

.tc-watchlist-head span {
    font-size: 11px;
    opacity: .6;
}

.tc-watchlist-close {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    font-size: 22px;
}

.tc-watchlist-status {
    padding: 9px 14px 0;
    font-size: 12px;
    opacity: .72;
}

.tc-watchlist-items {
    padding: 10px;
    overflow: auto;
    max-height: 460px;
}

.tc-watchlist-empty {
    padding: 28px 12px;
    text-align: center;
    font-size: 13px;
    opacity: .65;
}

.tc-watchlist-item {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 8px;
    border-bottom: 1px solid rgba(255,255,255,.06);
}

.tc-watchlist-open {
    appearance: none;
    border: 0;
    background: transparent;
    color: inherit;
    text-align: right;
    cursor: pointer;
    min-width: 0;
    padding: 3px;
    font: inherit;
}

.tc-watchlist-symbol {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 700;
    font-size: 13px;
}

.tc-watchlist-market {
    display: block;
    margin-top: 3px;
    font-size: 10px;
    opacity: .55;
    text-transform: uppercase;
}

.tc-watchlist-remove {
    border: 1px solid rgba(255,255,255,.1);
    background: transparent;
    color: inherit;
    border-radius: 8px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    font-size: 18px;
}

.tc-watchlist-remove:hover {
    border-color: rgba(255,90,90,.55);
}

@media (max-width: 640px) {
    .tc-watchlist-actions {
        left: 10px;
        bottom: 10px;
    }

    .tc-watchlist-panel {
        left: 10px;
        bottom: 64px;
        width: calc(100vw - 20px);
        max-height: calc(100vh - 90px);
    }
}

/* TAHLIL_LEVEL4_SCREENER_FRONTEND_V1 */

.tc-screener-launcher {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 2147481900;
    direction: rtl;
}

.tc-screener-toggle,
.tc-screener-close,
.tc-screener-run {
    font: inherit;
    cursor: pointer;
}

.tc-screener-toggle {
    min-height: 44px;
    padding: 9px 14px;
    display: flex;
    align-items: center;
    gap: 7px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 12px;
    background: rgba(13,18,28,.95);
    color: #fff;
    box-shadow: 0 12px 34px rgba(0,0,0,.25);
}

.tc-screener-panel {
    position: fixed;
    right: 18px;
    bottom: 74px;
    z-index: 2147481899;
    width: min(620px, calc(100vw - 36px));
    max-height: min(720px, calc(100vh - 100px));
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 17px;
    background: rgba(10,14,23,.985);
    color: #fff;
    box-shadow: 0 24px 70px rgba(0,0,0,.45);
    direction: rtl;
}

.tc-screener-panel[hidden] {
    display: none !important;
}

.tc-screener-head {
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.tc-screener-head > div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.tc-screener-head strong {
    font-size: 15px;
}

.tc-screener-head span {
    font-size: 11px;
    opacity: .62;
}

.tc-screener-close {
    width: 34px;
    height: 34px;
    border-radius: 9px;
    border: 1px solid rgba(255,255,255,.12);
    background: transparent;
    color: #fff;
    font-size: 22px;
}

.tc-screener-form {
    padding: 14px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}

.tc-screener-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 10px;
}

.tc-screener-grid label {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 0;
}

.tc-screener-grid label > span {
    font-size: 11px;
    opacity: .7;
}

.tc-screener-grid select,
.tc-screener-grid input {
    width: 100%;
    min-height: 38px;
    box-sizing: border-box;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 9px;
    padding: 7px 9px;
    background: rgba(255,255,255,.055);
    color: #fff;
    outline: none;
    font: inherit;
}

.tc-screener-grid option {
    color: #111;
}

.tc-screener-run {
    width: 100%;
    min-height: 42px;
    margin-top: 12px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 10px;
    background: rgba(255,255,255,.11);
    color: #fff;
    font-weight: 700;
}

.tc-screener-run:disabled {
    cursor: wait;
    opacity: .55;
}

.tc-screener-status {
    min-height: 20px;
    padding: 10px 14px 0;
    font-size: 12px;
    opacity: .72;
}

.tc-screener-summary {
    margin: 10px 14px 0;
    padding: 9px 11px;
    border-radius: 10px;
    background: rgba(255,255,255,.055);
    font-size: 12px;
    line-height: 1.8;
}

.tc-screener-results {
    padding: 10px 14px 14px;
    max-height: 360px;
    overflow: auto;
}

.tc-screener-empty {
    padding: 28px 10px;
    text-align: center;
    opacity: .62;
    font-size: 13px;
}

.tc-screener-item {
    width: 100%;
    appearance: none;
    border: 0;
    border-bottom: 1px solid rgba(255,255,255,.065);
    background: transparent;
    color: inherit;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto auto;
    gap: 12px;
    align-items: center;
    text-align: right;
    padding: 10px 5px;
    cursor: pointer;
    font: inherit;
}

.tc-screener-symbol {
    min-width: 0;
}

.tc-screener-symbol strong {
    display: block;
    font-size: 13px;
}

.tc-screener-symbol small {
    display: block;
    margin-top: 3px;
    opacity: .52;
    font-size: 10px;
}

.tc-screener-indicator-value {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    font-size: 13px;
}

.tc-screener-price {
    opacity: .7;
    font-variant-numeric: tabular-nums;
    font-size: 11px;
}

.tc-screener-unavailable {
    margin-top: 8px;
    padding: 9px 10px;
    border-radius: 9px;
    background: rgba(255,255,255,.035);
    font-size: 11px;
    opacity: .58;
}

@media (max-width: 720px) {
    .tc-screener-launcher {
        right: 10px;
        bottom: 10px;
    }

    .tc-screener-panel {
        right: 10px;
        bottom: 64px;
        width: calc(100vw - 20px);
        max-height: calc(100vh - 80px);
    }

    .tc-screener-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
    }
}


/* ==========================================================
   TAHLIL_LEVEL5_GUEST_MULTICHART_LIMIT_V1

   Visual state only.
   Existing MultiChart layout CSS remains untouched.
   ========================================================== */

#tcMultiChartControl
[data-chart-count].tc-multichart-registration-required {
    position: relative;
    opacity: .58;
}

#tcMultiChartControl
[data-chart-count].tc-multichart-registration-required::after {
    content: "🔒";
    display: inline-block;
    margin-right: 4px;
    font-size: 9px;
    line-height: 1;
    vertical-align: middle;
}

#tcMultiChartControl
[data-chart-count].tc-multichart-registration-required:hover {
    opacity: .9;
}


/* ==========================================================
   TAHLIL_LEVEL6_GUEST_INDICATOR_LIMIT_V1
   ========================================================== */

.tc-indicator-limit-note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: max-content;
    max-width: calc(100% - 24px);
    margin: 8px auto 0;
    padding: 6px 10px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 9px;
    background: rgba(255,255,255,.035);
    color: inherit;
    font: inherit;
    font-size: 11px;
    line-height: 1.5;
    opacity: .72;
    cursor: pointer;
}

.tc-indicator-limit-note:hover {
    opacity: 1;
    background: rgba(255,255,255,.06);
}

.tc-indicator-limit-note strong {
    font-size: inherit;
    font-weight: 700;
}

.tc-indicator-limit-note[hidden] {
    display: none !important;
}


/*
 * TAHLIL_LEVEL7B_TEMPLATES_FRONTEND_V1
 *
 * Templates UI only.
 * No chart engine styling is changed.
 */

.tc-templates-toggle {
    position: fixed;
    right: 18px;
    bottom: 156px;
    z-index: 1200;
    min-width: 84px;
    min-height: 42px;
    padding: 8px 14px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 12px;
    background: rgba(14,18,28,.96);
    color: #fff;
    font: inherit;
    cursor: pointer;
    box-shadow: 0 8px 30px rgba(0,0,0,.24);
}

.tc-templates-toggle:hover {
    transform: translateY(-1px);
}

.tc-templates-panel {
    position: fixed;
    right: 18px;
    bottom: 210px;
    z-index: 1300;
    width: min(390px, calc(100vw - 36px));
    max-height: min(620px, calc(100vh - 110px));
    overflow: auto;
    padding: 16px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 16px;
    background: rgba(12,16,25,.98);
    color: #fff;
    box-shadow: 0 18px 55px rgba(0,0,0,.34);
    direction: rtl;
}

.tc-templates-panel[hidden] {
    display: none !important;
}

.tc-templates-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.tc-templates-subtitle {
    margin-top: 4px;
    opacity: .66;
    font-size: 12px;
}

.tc-templates-close {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border: 0;
    border-radius: 9px;
    background: rgba(255,255,255,.08);
    color: inherit;
    font-size: 22px;
    cursor: pointer;
}

.tc-template-save-form label {
    display: block;
    margin-bottom: 7px;
    font-size: 13px;
}

.tc-template-save-row {
    display: flex;
    gap: 8px;
}

.tc-template-save-row input {
    flex: 1 1 auto;
    min-width: 0;
    height: 40px;
    padding: 0 11px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 10px;
    background: rgba(255,255,255,.06);
    color: inherit;
    font: inherit;
    outline: none;
}

.tc-template-save-row button,
.tc-template-action {
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 9px;
    background: rgba(255,255,255,.08);
    color: inherit;
    font: inherit;
    cursor: pointer;
}

.tc-template-save-row button {
    min-width: 72px;
    padding: 0 12px;
}

.tc-templates-status {
    min-height: 20px;
    margin: 10px 0;
    font-size: 12px;
    opacity: .78;
}

.tc-templates-status.is-error {
    opacity: 1;
}

.tc-template-card {
    padding: 12px;
    margin-top: 9px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 12px;
    background: rgba(255,255,255,.035);
}

.tc-template-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.tc-template-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 700;
}

.tc-template-meta {
    margin-top: 5px;
    opacity: .62;
    font-size: 11px;
}

.tc-template-actions {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    margin-top: 10px;
}

.tc-template-action {
    min-height: 34px;
    padding: 6px 8px;
}

.tc-template-action.is-delete {
    opacity: .86;
}

.tc-templates-empty {
    padding: 22px 10px;
    text-align: center;
    opacity: .62;
    font-size: 13px;
}

.tc-template-action:disabled,
.tc-template-save-row button:disabled {
    cursor: wait;
    opacity: .5;
}

@media (max-width: 640px) {
    .tc-templates-toggle {
        right: 12px;
        bottom: 148px;
    }

    .tc-templates-panel {
        right: 12px;
        bottom: 200px;
        width: calc(100vw - 24px);
        max-height: calc(100vh - 90px);
    }
}


/*
 * ==========================================================
 * TAHLIL_LEVEL8C_MARKET_ALERTS_FRONTEND_V1
 * Market Workspace V2 - Alerts / Alert Center
 * ==========================================================
 */

.tc-alerts-toggle {
    position: fixed;
    left: 18px;
    bottom: 18px;
    z-index: 1250;
    min-width: 94px;
    min-height: 44px;
    padding: 8px 14px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 13px;
    background: rgba(14,18,28,.97);
    color: #fff;
    font: inherit;
    cursor: pointer;
    box-shadow: 0 10px 32px rgba(0,0,0,.28);
}

.tc-alerts-toggle:hover {
    transform: translateY(-1px);
}

.tc-alerts-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    margin-right: 6px;
    padding: 0 5px;
    border-radius: 999px;
    background: #fff;
    color: #111827;
    font-size: 11px;
    font-weight: 800;
}

.tc-alerts-badge[hidden] {
    display: none !important;
}

.tc-alerts-panel {
    position: fixed;
    left: 18px;
    bottom: 74px;
    z-index: 1350;
    width: min(430px, calc(100vw - 36px));
    max-height: min(760px, calc(100vh - 95px));
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 16px;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 17px;
    background: rgba(11,15,24,.985);
    color: #fff;
    box-shadow: 0 20px 60px rgba(0,0,0,.38);
    direction: rtl;
}

.tc-alerts-panel[hidden] {
    display: none !important;
}

.tc-alerts-head,
.tc-alerts-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.tc-alerts-head {
    align-items: flex-start;
    margin-bottom: 15px;
}

.tc-alerts-subtitle {
    margin-top: 4px;
    opacity: .62;
    font-size: 12px;
}

.tc-alerts-close {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 9px;
    background: rgba(255,255,255,.08);
    color: inherit;
    font-size: 22px;
    cursor: pointer;
}

.tc-alert-form {
    display: grid;
    gap: 10px;
}

.tc-alert-form label {
    display: grid;
    gap: 6px;
    font-size: 12px;
}

.tc-alert-form input,
.tc-alert-form select {
    width: 100%;
    min-width: 0;
    height: 39px;
    padding: 0 10px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 9px;
    outline: none;
    background: rgba(255,255,255,.055);
    color: inherit;
    font: inherit;
}

.tc-alert-form option {
    color: #111;
}

.tc-alert-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
}

.tc-alert-section {
    display: grid;
    gap: 9px;
}

.tc-alert-section[hidden] {
    display: none !important;
}

.tc-alert-check {
    display: flex !important;
    align-items: center;
    gap: 8px !important;
}

.tc-alert-check input {
    width: 17px;
    height: 17px;
}

.tc-alert-primary,
.tc-alert-small,
.tc-alert-action {
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 9px;
    background: rgba(255,255,255,.09);
    color: inherit;
    font: inherit;
    cursor: pointer;
}

.tc-alert-primary {
    min-height: 41px;
    font-weight: 700;
}

.tc-alert-small {
    min-height: 31px;
    padding: 4px 9px;
    font-size: 11px;
}

.tc-alert-primary:disabled,
.tc-alert-small:disabled,
.tc-alert-action:disabled {
    cursor: wait;
    opacity: .5;
}

.tc-alerts-status {
    min-height: 20px;
    margin: 10px 0 4px;
    font-size: 12px;
    opacity: .75;
}

.tc-alerts-status.is-error {
    opacity: 1;
}

.tc-alerts-divider {
    height: 1px;
    margin: 14px 0;
    background: rgba(255,255,255,.1);
}

.tc-alerts-list,
.tc-alert-events-list {
    display: grid;
    gap: 8px;
    margin-top: 9px;
}

.tc-alert-card,
.tc-alert-event {
    padding: 11px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 11px;
    background: rgba(255,255,255,.035);
}

.tc-alert-card.is-inactive {
    opacity: .58;
}

.tc-alert-card-top,
.tc-alert-event-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.tc-alert-symbol {
    font-weight: 800;
    direction: ltr;
    unicode-bidi: isolate;
}

.tc-alert-condition-text,
.tc-alert-event-meta {
    margin-top: 5px;
    opacity: .67;
    font-size: 11px;
    line-height: 1.7;
}

.tc-alert-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    margin-top: 9px;
}

.tc-alert-action {
    min-height: 33px;
    padding: 5px 7px;
    font-size: 11px;
}

.tc-alert-event {
    cursor: pointer;
}

.tc-alert-event.is-unread {
    border-color: rgba(255,255,255,.26);
    background: rgba(255,255,255,.07);
}

.tc-alert-event-message {
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.75;
}

.tc-alert-unread-text {
    margin-right: 6px;
    opacity: .65;
    font-size: 11px;
}

.tc-alert-empty {
    padding: 17px 8px;
    text-align: center;
    opacity: .58;
    font-size: 12px;
}

.tc-alert-toast-root {
    position: fixed;
    left: 18px;
    top: 18px;
    z-index: 5000;
    display: grid;
    gap: 9px;
    width: min(370px, calc(100vw - 36px));
    pointer-events: none;
}

.tc-alert-toast {
    padding: 12px 14px;
    border: 1px solid rgba(255,255,255,.17);
    border-radius: 12px;
    background: rgba(12,16,25,.98);
    color: #fff;
    box-shadow: 0 16px 45px rgba(0,0,0,.35);
    direction: rtl;
    line-height: 1.7;
    font-size: 12px;
    animation: tcAlertToastIn .2s ease-out;
}

@keyframes tcAlertToastIn {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (max-width: 640px) {

    .tc-alerts-toggle {
        left: 12px;
        bottom: 12px;
    }

    .tc-alerts-panel {
        left: 12px;
        bottom: 66px;
        width: calc(100vw - 24px);
        max-height: calc(100vh - 82px);
    }

    .tc-alert-grid {
        grid-template-columns: 1fr;
    }

    .tc-alert-toast-root {
        left: 12px;
        top: 12px;
        width: calc(100vw - 24px);
    }
}


/* ==========================================================
   TAHLIL_MARKET_UI_CLEAN_V1

   CSS-only workspace cleanup.

   IMPORTANT:
   - no JS
   - no polling
   - no MutationObserver
   - no frontend behavior changes
   ========================================================== */


:root {
    --tc-clean-rail-width: 52px;
    --tc-clean-panel-width: 370px;

    --tc-clean-bg: #0f1319;
    --tc-clean-bg-2: #151a22;
    --tc-clean-border: rgba(255,255,255,.09);

    --tc-clean-text: #dfe4ec;
    --tc-clean-muted: #8b95a4;

    --tc-clean-hover: rgba(255,255,255,.075);
}


/* ----------------------------------------------------------
   CHART SPACE
   Keep tools OUTSIDE the chart.
   ---------------------------------------------------------- */

body.tc-market-page
.tc-chart-shell {
    margin-right:
        var(--tc-clean-rail-width) !important;
}


/* ----------------------------------------------------------
   RIGHT RAIL BACKGROUND
   ---------------------------------------------------------- */

body.tc-market-page::after {
    content: "";

    position: fixed;

    top: 150px;
    right: 0;
    bottom: 52px;

    z-index: 99990;

    width:
        var(--tc-clean-rail-width);

    border-left:
        1px solid
        var(--tc-clean-border);

    background:
        var(--tc-clean-bg);

    pointer-events: none;
}


/* ----------------------------------------------------------
   RIGHT RAIL BUTTONS
   ---------------------------------------------------------- */

#tcWatchlistToggle,
#tcScreenerToggle,
#tcTemplatesToggle,
#tcAlertsToggle {
    position: fixed !important;

    right: 7px !important;
    left: auto !important;

    z-index: 100000 !important;

    display: grid !important;
    place-items: center !important;

    width: 38px !important;
    min-width: 38px !important;

    height: 38px !important;
    min-height: 38px !important;

    padding: 0 !important;
    margin: 0 !important;

    border:
        0 !important;

    border-radius:
        5px !important;

    background:
        transparent !important;

    color:
        var(--tc-clean-muted) !important;

    box-shadow:
        none !important;

    font-size:
        0 !important;

    cursor:
        pointer !important;
}


/*
 * Stack order:
 *
 * Watchlist
 * Screener
 * Templates
 * Alerts
 */

#tcWatchlistToggle {
    top: 165px !important;
}


#tcScreenerToggle {
    top: 207px !important;
}


#tcTemplatesToggle {
    top: 249px !important;
}


#tcAlertsToggle {
    top: 291px !important;
}


#tcWatchlistToggle:hover,
#tcScreenerToggle:hover,
#tcTemplatesToggle:hover,
#tcAlertsToggle:hover {
    background:
        var(--tc-clean-hover) !important;

    color:
        #e1b957 !important;
}


/*
 * Existing icons/SVG remain visible.
 */

#tcWatchlistToggle svg,
#tcScreenerToggle svg,
#tcTemplatesToggle svg,
#tcAlertsToggle svg {
    width: 19px !important;
    height: 19px !important;

    margin: 0 !important;

    fill: none;

    stroke: currentColor;

    pointer-events: none;
}


/* ----------------------------------------------------------
   If buttons contain emoji/text instead of SVG,
   give them compact visual fallback.
   ---------------------------------------------------------- */

#tcWatchlistToggle::before {
    content: "☰";

    display: block;

    font-size: 18px;
    line-height: 1;
}


#tcScreenerToggle::before {
    content: "⌁";

    display: block;

    font-size: 20px;
    line-height: 1;
}


#tcTemplatesToggle::before {
    content: "▤";

    display: block;

    font-size: 18px;
    line-height: 1;
}


#tcAlertsToggle::before {
    content: "♢";

    display: block;

    font-size: 19px;
    line-height: 1;
}


/* ----------------------------------------------------------
   Remove old scattered launcher containers from layout,
   but DO NOT remove the buttons themselves.
   ---------------------------------------------------------- */

#tcWatchlistActions,
.tc-screener-launcher {
    position: static !important;

    width: 0 !important;
    height: 0 !important;

    padding: 0 !important;
    margin: 0 !important;

    border: 0 !important;

    background: transparent !important;

    box-shadow: none !important;
}


/* ----------------------------------------------------------
   ALL PANELS = SAME DRAWER
   ---------------------------------------------------------- */

#tcWatchlistPanel,
#tcScreenerPanel,
#tcTemplatesPanel,
#tcAlertsPanel {
    position: fixed !important;

    top: 150px !important;

    right:
        var(--tc-clean-rail-width) !important;

    bottom: 52px !important;
    left: auto !important;

    z-index: 99995 !important;

    width:
        min(
            var(--tc-clean-panel-width),
            calc(100vw - 70px)
        ) !important;

    max-width:
        var(--tc-clean-panel-width) !important;

    height: auto !important;

    max-height: none !important;

    padding: 0 !important;

    overflow-y: auto !important;
    overflow-x: hidden !important;

    border:
        1px solid
        var(--tc-clean-border) !important;

    border-right: 0 !important;

    border-radius:
        0 !important;

    background:
        var(--tc-clean-bg) !important;

    color:
        var(--tc-clean-text) !important;

    box-shadow:
        -12px 0 35px
        rgba(0,0,0,.20) !important;
}


#tcWatchlistPanel[hidden],
#tcScreenerPanel[hidden],
#tcTemplatesPanel[hidden],
#tcAlertsPanel[hidden] {
    display: none !important;
}


/* ----------------------------------------------------------
   PANEL HEADERS
   ---------------------------------------------------------- */

#tcWatchlistPanel
.tc-watchlist-head,

#tcScreenerPanel
.tc-screener-head,

#tcTemplatesPanel
.tc-templates-head,

#tcAlertsPanel
.tc-alerts-head {
    position: sticky;

    top: 0;

    z-index: 3;

    display: flex;
    align-items: center;

    min-height: 48px;

    padding: 9px 12px !important;

    margin: 0 !important;

    border-bottom:
        1px solid
        var(--tc-clean-border) !important;

    background:
        var(--tc-clean-bg) !important;
}


/* ----------------------------------------------------------
   PANEL BODY CONTROLS
   ---------------------------------------------------------- */

#tcWatchlistPanel input,
#tcWatchlistPanel select,
#tcScreenerPanel input,
#tcScreenerPanel select,
#tcTemplatesPanel input,
#tcTemplatesPanel select,
#tcAlertsPanel input,
#tcAlertsPanel select {
    border:
        1px solid
        var(--tc-clean-border) !important;

    background:
        var(--tc-clean-bg-2) !important;

    color:
        var(--tc-clean-text) !important;

    border-radius:
        5px !important;
}


/* ----------------------------------------------------------
   WATCHLIST ROWS
   ---------------------------------------------------------- */

#tcWatchlistItems {
    padding: 0 !important;
}


.tc-watchlist-item {
    margin: 0 !important;

    border:
        0 !important;

    border-bottom:
        1px solid
        var(--tc-clean-border) !important;

    border-radius:
        0 !important;

    background:
        transparent !important;
}


.tc-watchlist-item:hover {
    background:
        var(--tc-clean-hover) !important;
}


/* ----------------------------------------------------------
   CLOSE BUTTONS
   ---------------------------------------------------------- */

#tcWatchlistClose,
#tcScreenerClose,
#tcTemplatesClose,
#tcAlertsClose {
    width: 30px !important;
    height: 30px !important;

    padding: 0 !important;

    border:
        0 !important;

    border-radius:
        4px !important;

    background:
        transparent !important;

    color:
        var(--tc-clean-muted) !important;
}


#tcWatchlistClose:hover,
#tcScreenerClose:hover,
#tcTemplatesClose:hover,
#tcAlertsClose:hover {
    background:
        var(--tc-clean-hover) !important;

    color:
        var(--tc-clean-text) !important;
}


/* ----------------------------------------------------------
   MULTI CHART CONTROL
   Keep it clean at top; do not modify its logic.
   ---------------------------------------------------------- */

#tcMultiChartControl {
    border:
        1px solid
        var(--tc-clean-border) !important;

    border-radius:
        6px !important;

    background:
        var(--tc-clean-bg) !important;

    box-shadow:
        none !important;
}


/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width: 760px) {

    body.tc-market-page
    .tc-chart-shell {
        margin-right: 0 !important;
    }


    body.tc-market-page::after {
        display: none;
    }


    #tcWatchlistToggle,
    #tcScreenerToggle,
    #tcTemplatesToggle,
    #tcAlertsToggle {
        top: auto !important;

        bottom: 8px !important;
    }


    #tcWatchlistToggle {
        right: 12px !important;
    }


    #tcScreenerToggle {
        right: 56px !important;
    }


    #tcTemplatesToggle {
        right: 100px !important;
    }


    #tcAlertsToggle {
        right: 144px !important;
    }


    #tcWatchlistPanel,
    #tcScreenerPanel,
    #tcTemplatesPanel,
    #tcAlertsPanel {
        top: 58px !important;

        right: 8px !important;
        left: 8px !important;

        bottom: 56px !important;

        width: auto !important;
        max-width: none !important;
    }
}



/* ==========================================================
   TAHLIL_MARKET_UI_CLEAN_V11

   Pixel cleanup based on real /markets/chart/ screenshot.

   CSS ONLY:
   - no JavaScript
   - no timers
   - no observers
   ========================================================== */


:root {

    /*
     * Header height changes with viewport width because
     * symbol/search rows wrap on smaller desktops.
     *
     * This formula tracks that without JavaScript:
     *
     * 1120px viewport -> ~446px
     * 1366px viewport -> ~373px
     * 1668px viewport -> ~284px
     */

    --tc-clean-rail-top:
        clamp(
            284px,
            calc(776px - 29.5vw),
            470px
        );

    --tc-clean-rail-width:
        46px;

    --tc-clean-panel-width:
        clamp(
            320px,
            30vw,
            380px
        );
}


/* ==========================================================
   1. CHART / RAIL GEOMETRY
   ========================================================== */


/*
 * Reserve a real 46px column OUTSIDE Bitycle.
 */

body.tc-market-page
.tc-chart-shell {

    margin-right:
        var(--tc-clean-rail-width)
        !important;
}


/*
 * Override previous rail.
 *
 * It now starts exactly around the chart region,
 * not in BTC/Search/Timeframe section.
 */

body.tc-market-page::after {

    top:
        var(--tc-clean-rail-top)
        !important;

    right:
        0
        !important;

    bottom:
        0
        !important;

    width:
        var(--tc-clean-rail-width)
        !important;

    border-left:
        1px solid
        rgba(255,255,255,.075)
        !important;

    background:
        #11161d
        !important;

    box-shadow:
        -1px 0 0
        rgba(0,0,0,.22)
        !important;
}


/* ==========================================================
   2. RIGHT RAIL BUTTONS
   ========================================================== */

#tcWatchlistToggle,
#tcScreenerToggle,
#tcTemplatesToggle,
#tcAlertsToggle {

    right:
        4px
        !important;

    width:
        38px
        !important;

    min-width:
        38px
        !important;

    height:
        38px
        !important;

    min-height:
        38px
        !important;

    border-radius:
        5px
        !important;

    border:
        0
        !important;

    background:
        transparent
        !important;

    color:
        #8893a1
        !important;

    box-shadow:
        none
        !important;

    overflow:
        visible
        !important;

    font-size:
        0
        !important;

    transition:
        background .12s ease,
        color .12s ease
        !important;
}


/*
 * Position relative to chart top.
 */

#tcWatchlistToggle {

    top:
        calc(
            var(--tc-clean-rail-top)
            + 8px
        )
        !important;
}


#tcScreenerToggle {

    top:
        calc(
            var(--tc-clean-rail-top)
            + 48px
        )
        !important;
}


#tcTemplatesToggle {

    top:
        calc(
            var(--tc-clean-rail-top)
            + 88px
        )
        !important;
}


#tcAlertsToggle {

    top:
        calc(
            var(--tc-clean-rail-top)
            + 128px
        )
        !important;
}


#tcWatchlistToggle:hover,
#tcScreenerToggle:hover,
#tcTemplatesToggle:hover,
#tcAlertsToggle:hover {

    color:
        #e4bd5c
        !important;

    background:
        rgba(255,255,255,.065)
        !important;
}


/* ==========================================================
   3. REMOVE OLD TEXT/FALLBACK ICONS
   ========================================================== */

#tcWatchlistToggle svg,
#tcScreenerToggle svg,
#tcTemplatesToggle svg,
#tcAlertsToggle svg {

    display:
        none
        !important;
}


/*
 * All four icons use monochrome CSS masks.
 */

#tcWatchlistToggle::before,
#tcScreenerToggle::before,
#tcTemplatesToggle::before,
#tcAlertsToggle::before {

    content:
        ""
        !important;

    display:
        block
        !important;

    width:
        19px
        !important;

    height:
        19px
        !important;

    background:
        currentColor
        !important;

    -webkit-mask-repeat:
        no-repeat;

    -webkit-mask-position:
        center;

    -webkit-mask-size:
        contain;

    mask-repeat:
        no-repeat;

    mask-position:
        center;

    mask-size:
        contain;
}


/*
 * WATCHLIST
 */

#tcWatchlistToggle::before {

    -webkit-mask-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 6h12M5 12h12M5 18h7'/%3E%3Cpath d='m18 15 .9 1.8 2 .3-1.45 1.4.35 2-1.8-.95-1.8.95.35-2-1.45-1.4 2-.3z'/%3E%3C/g%3E%3C/svg%3E")
        !important;

    mask-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 6h12M5 12h12M5 18h7'/%3E%3Cpath d='m18 15 .9 1.8 2 .3-1.45 1.4.35 2-1.8-.95-1.8.95.35-2-1.45-1.4 2-.3z'/%3E%3C/g%3E%3C/svg%3E")
        !important;
}


/*
 * SCREENER / FILTER
 */

#tcScreenerToggle::before {

    -webkit-mask-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M4 6h16M4 12h16M4 18h16'/%3E%3Ccircle cx='8' cy='6' r='2'/%3E%3Ccircle cx='15' cy='12' r='2'/%3E%3Ccircle cx='10' cy='18' r='2'/%3E%3C/g%3E%3C/svg%3E")
        !important;

    mask-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M4 6h16M4 12h16M4 18h16'/%3E%3Ccircle cx='8' cy='6' r='2'/%3E%3Ccircle cx='15' cy='12' r='2'/%3E%3Ccircle cx='10' cy='18' r='2'/%3E%3C/g%3E%3C/svg%3E")
        !important;
}


/*
 * TEMPLATES
 */

#tcTemplatesToggle::before {

    -webkit-mask-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='16' rx='1.5'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h5'/%3E%3C/g%3E%3C/svg%3E")
        !important;

    mask-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='16' rx='1.5'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h5'/%3E%3C/g%3E%3C/svg%3E")
        !important;
}


/*
 * ALERTS
 */

#tcAlertsToggle::before {

    -webkit-mask-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 9a6 6 0 1 0-12 0c0 6-2.5 7-2.5 7h17S18 15 18 9z'/%3E%3Cpath d='M10 20h4'/%3E%3C/g%3E%3C/svg%3E")
        !important;

    mask-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 9a6 6 0 1 0-12 0c0 6-2.5 7-2.5 7h17S18 15 18 9z'/%3E%3Cpath d='M10 20h4'/%3E%3C/g%3E%3C/svg%3E")
        !important;
}


/* ==========================================================
   4. CSS-ONLY ACTIVE STATE
   ========================================================== */

body.tc-market-page:has(
    #tcWatchlistPanel:not([hidden])
)
#tcWatchlistToggle,

body.tc-market-page:has(
    #tcScreenerPanel:not([hidden])
)
#tcScreenerToggle,

body.tc-market-page:has(
    #tcTemplatesPanel:not([hidden])
)
#tcTemplatesToggle,

body.tc-market-page:has(
    #tcAlertsPanel:not([hidden])
)
#tcAlertsToggle {

    color:
        #e4bd5c
        !important;

    background:
        rgba(228,189,92,.11)
        !important;
}


/* ==========================================================
   5. TOOLTIPS
   ========================================================== */

#tcWatchlistToggle::after,
#tcScreenerToggle::after,
#tcTemplatesToggle::after,
#tcAlertsToggle::after {

    position:
        absolute;

    top:
        50%;

    right:
        45px;

    transform:
        translateY(-50%);

    z-index:
        100005;

    display:
        block;

    padding:
        5px 8px;

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius:
        5px;

    background:
        #171c24;

    color:
        #dfe5ee;

    box-shadow:
        0 5px 16px
        rgba(0,0,0,.25);

    font-size:
        10px
        !important;

    font-family:
        inherit;

    line-height:
        1;

    white-space:
        nowrap;

    opacity:
        0;

    visibility:
        hidden;

    pointer-events:
        none;

    transition:
        opacity .12s ease;
}


#tcWatchlistToggle::after {
    content:
        "واچ‌لیست";
}


#tcScreenerToggle::after {
    content:
        "فیلتر بازار";
}


#tcTemplatesToggle::after {
    content:
        "قالب‌ها";
}


#tcAlertsToggle::after {
    content:
        "هشدارها";
}


#tcWatchlistToggle:hover::after,
#tcScreenerToggle:hover::after,
#tcTemplatesToggle:hover::after,
#tcAlertsToggle:hover::after {

    opacity:
        1;

    visibility:
        visible;
}


/* ==========================================================
   6. DRAWER
   ========================================================== */

#tcWatchlistPanel,
#tcScreenerPanel,
#tcTemplatesPanel,
#tcAlertsPanel {

    top:
        var(--tc-clean-rail-top)
        !important;

    right:
        var(--tc-clean-rail-width)
        !important;

    bottom:
        0
        !important;

    width:
        var(--tc-clean-panel-width)
        !important;

    max-width:
        var(--tc-clean-panel-width)
        !important;

    box-sizing:
        border-box;

    border:
        1px solid
        rgba(255,255,255,.075)
        !important;

    border-right:
        0
        !important;

    border-radius:
        0
        !important;

    background:
        #11161d
        !important;

    box-shadow:
        -8px 0 30px
        rgba(0,0,0,.23)
        !important;
}


/*
 * A little more breathing room.
 */

#tcWatchlistPanel
.tc-watchlist-head,

#tcScreenerPanel
.tc-screener-head,

#tcTemplatesPanel
.tc-templates-head,

#tcAlertsPanel
.tc-alerts-head {

    min-height:
        46px
        !important;

    padding:
        8px 11px
        !important;
}


/* ==========================================================
   7. WATCHLIST ROW POLISH
   ========================================================== */

#tcWatchlistItems
.tc-watchlist-item {

    min-height:
        44px;

    padding:
        7px 9px
        !important;
}


#tcWatchlistItems
.tc-watchlist-symbol {

    font-size:
        11px;
}


#tcWatchlistItems
.tc-watchlist-market {

    margin-top:
        2px;

    font-size:
        9px;

    opacity:
        .55;
}


/* ==========================================================
   8. MULTI CHART
   ========================================================== */


/*
 * Current screenshot shows this control occupying an
 * unnecessary full-width dark row.
 *
 * Keep exactly the same buttons/logic, only make the
 * container compact.
 */

#tcMultiChartControl {

    width:
        max-content
        !important;

    max-width:
        calc(100% - 20px)
        !important;

    min-height:
        38px
        !important;

    margin:
        6px auto 6px 10px
        !important;

    padding:
        3px 5px
        !important;

    border:
        1px solid
        rgba(255,255,255,.075)
        !important;

    border-radius:
        6px
        !important;

    background:
        #11161d
        !important;

    box-shadow:
        none
        !important;
}


#tcMultiChartControl button {

    min-width:
        30px
        !important;

    height:
        30px
        !important;

    padding:
        0 7px
        !important;

    border-radius:
        5px
        !important;
}


/* ==========================================================
   9. SEARCH / QUICK AREA
   ========================================================== */


/*
 * Since Rail now begins at Chart, the symbol/search
 * header regains its full width.
 */

.tc-market-search-box {

    margin-right:
        0
        !important;
}


/*
 * Keep pills visually tighter.
 */

.tc-market-page
.tc-symbol-chip,

.tc-market-page
.tc-quick-symbol {

    min-height:
        30px;

    border-radius:
        6px;
}


/* ==========================================================
   10. MOBILE
   ========================================================== */

@media (max-width: 760px) {

    :root {

        --tc-clean-rail-width:
            0px;
    }


    body.tc-market-page
    .tc-chart-shell {

        margin-right:
            0
            !important;
    }


    body.tc-market-page::after {

        display:
            none
            !important;
    }


    #tcWatchlistToggle,
    #tcScreenerToggle,
    #tcTemplatesToggle,
    #tcAlertsToggle {

        top:
            auto
            !important;

        bottom:
            8px
            !important;
    }


    #tcWatchlistToggle {

        right:
            12px
            !important;
    }


    #tcScreenerToggle {

        right:
            54px
            !important;
    }


    #tcTemplatesToggle {

        right:
            96px
            !important;
    }


    #tcAlertsToggle {

        right:
            138px
            !important;
    }


    #tcWatchlistToggle::after,
    #tcScreenerToggle::after,
    #tcTemplatesToggle::after,
    #tcAlertsToggle::after {

        display:
            none
            !important;
    }


    #tcWatchlistPanel,
    #tcScreenerPanel,
    #tcTemplatesPanel,
    #tcAlertsPanel {

        top:
            58px
            !important;

        right:
            8px
            !important;

        left:
            8px
            !important;

        bottom:
            56px
            !important;

        width:
            auto
            !important;

        max-width:
            none
            !important;
    }


    #tcMultiChartControl {

        max-width:
            calc(100% - 16px)
            !important;

        margin:
            5px 8px
            !important;
    }
}



/* ==========================================================
   TAHLIL_CHART_COMPACT_V12

   Dedicated /markets/chart/ only.

   GOALS:
   - Chart begins much higher
   - Less wasted vertical header space
   - Keep every existing control
   - Rail outside chart with 4px breathing room
   - No JS / Timer / Observer
   ========================================================== */


/* ----------------------------------------------------------
   DESKTOP VARIABLES
   ---------------------------------------------------------- */

body.tc-chart-workspace {

    --tc-v12-rail-width:
        44px;

    --tc-v12-rail-gap:
        4px;

    /*
     * Target position after compacting the controls.
     */
    --tc-v12-chart-top:
        226px;
}


/* ==========================================================
   1. DEDICATED WORKSPACE TOP BAR
   ========================================================== */

body.tc-chart-workspace
.tc-chart-workspace-bar {

    min-height:
        34px !important;

    height:
        34px !important;

    padding:
        3px 10px !important;

    margin:
        0 !important;

    box-sizing:
        border-box !important;
}


body.tc-chart-workspace
.tc-chart-workspace-brand {

    gap:
        5px !important;

    font-size:
        10px !important;
}


body.tc-chart-workspace
.tc-chart-back {

    min-height:
        26px !important;

    height:
        26px !important;

    padding:
        0 9px !important;

    border-radius:
        5px !important;

    font-size:
        9px !important;
}


/* ==========================================================
   2. REMOVE EXTRA SECTION SPACE
   ========================================================== */

body.tc-chart-workspace
.tc-terminal-section {

    padding-top:
        0 !important;

    margin-top:
        0 !important;
}


body.tc-chart-workspace
.tc-terminal-section
> .container {

    width:
        100% !important;

    max-width:
        none !important;

    padding-left:
        6px !important;

    padding-right:
        6px !important;
}


body.tc-chart-workspace
#tcMarketTerminal {

    margin-top:
        0 !important;

    border-radius:
        7px !important;
}


/* ==========================================================
   3. CRYPTO / FOREX TOP TABS
   ========================================================== */

body.tc-chart-workspace
.tc-terminal-top {

    min-height:
        38px !important;

    padding:
        4px 8px !important;

    box-sizing:
        border-box !important;
}


body.tc-chart-workspace
.tc-market-tabs {

    gap:
        4px !important;
}


body.tc-chart-workspace
.tc-market-tab {

    min-height:
        30px !important;

    height:
        30px !important;

    padding:
        0 13px !important;

    border-radius:
        6px !important;

    font-size:
        10px !important;
}


/* ==========================================================
   4. CURRENT SYMBOL BAR
   ========================================================== */

body.tc-chart-workspace
.tc-symbol-bar {

    min-height:
        44px !important;

    padding:
        4px 9px !important;

    box-sizing:
        border-box !important;
}


body.tc-chart-workspace
.tc-symbol-icon {

    width:
        32px !important;

    height:
        32px !important;

    min-width:
        32px !important;

    border-radius:
        8px !important;
}


body.tc-chart-workspace
.tc-symbol-primary {

    gap:
        1px !important;
}


body.tc-chart-workspace
.tc-symbol-primary strong {

    font-size:
        12px !important;

    line-height:
        1.2 !important;
}


body.tc-chart-workspace
.tc-symbol-primary span {

    font-size:
        9px !important;

    line-height:
        1.2 !important;
}


body.tc-chart-workspace
.tc-data-note {

    font-size:
        8px !important;

    line-height:
        1 !important;
}


/* ==========================================================
   5. QUICK SYMBOLS
   ========================================================== */

body.tc-chart-workspace
.tc-quick-symbols {

    min-height:
        32px !important;

    padding:
        3px 8px !important;

    gap:
        4px !important;

    box-sizing:
        border-box !important;
}


body.tc-chart-workspace
.tc-symbol-chip {

    min-height:
        25px !important;

    height:
        25px !important;

    padding:
        0 9px !important;

    border-radius:
        5px !important;

    font-size:
        9px !important;
}


/* Forex shortcuts when Forex is selected */

body.tc-chart-workspace
#tcForexQuickSymbols {

    min-height:
        30px !important;

    padding-top:
        3px !important;

    padding-bottom:
        3px !important;

    gap:
        4px !important;
}


body.tc-chart-workspace
#tcForexQuickSymbols button {

    min-height:
        25px !important;

    padding:
        3px 8px !important;

    font-size:
        9px !important;
}


/* ==========================================================
   6. TIMEFRAME ROW
   ========================================================== */

body.tc-chart-workspace
.tc-timeframe-bar {

    min-height:
        32px !important;

    padding:
        3px 8px !important;

    gap:
        8px !important;

    box-sizing:
        border-box !important;
}


body.tc-chart-workspace
.tc-timeframe-label {

    font-size:
        9px !important;
}


body.tc-chart-workspace
.tc-timeframes {

    gap:
        1px !important;
}


body.tc-chart-workspace
.tc-timeframes button {

    min-width:
        29px !important;

    min-height:
        25px !important;

    height:
        25px !important;

    padding:
        0 6px !important;

    border-radius:
        5px !important;

    font-size:
        9px !important;
}


/* ==========================================================
   7. SEARCH ROW
   ========================================================== */

body.tc-chart-workspace
.tc-chart-header-row {

    min-height:
        36px !important;

    margin:
        3px 0 !important;

    padding:
        0 5px !important;

    gap:
        8px !important;

    box-sizing:
        border-box !important;
}


body.tc-chart-workspace
.tc-chart-header-row
#tcMarketSymbolSearch {

    width:
        300px !important;

    max-width:
        300px !important;

    flex:
        0 1 300px !important;

    min-height:
        32px !important;

    margin:
        0 !important;
}


body.tc-chart-workspace
#tcMarketSymbolSearch
.tc-market-search-box {

    min-height:
        32px !important;

    height:
        32px !important;

    padding:
        2px 5px !important;

    gap:
        5px !important;

    border-radius:
        7px !important;
}


body.tc-chart-workspace
.tc-market-search-icon {

    font-size:
        17px !important;

    padding:
        0 2px !important;
}


body.tc-chart-workspace
#tcGlobalSymbolSearch {

    height:
        28px !important;

    font-size:
        10px !important;
}


body.tc-chart-workspace
#tcGlobalSymbolSearchButton {

    height:
        28px !important;

    min-height:
        28px !important;

    padding:
        0 10px !important;

    border-radius:
        5px !important;

    font-size:
        9px !important;
}


/* ==========================================================
   8. MULTI CHART
   ========================================================== */

body.tc-chart-workspace
#tcMultiChartControl {

    min-height:
        30px !important;

    height:
        30px !important;

    width:
        max-content !important;

    max-width:
        calc(100% - 12px) !important;

    margin:
        3px 6px !important;

    padding:
        2px 4px !important;

    border-radius:
        5px !important;

    box-sizing:
        border-box !important;
}


body.tc-chart-workspace
.tc-multichart-label {

    font-size:
        8px !important;

    margin:
        0 5px !important;
}


body.tc-chart-workspace
.tc-multichart-buttons {

    gap:
        2px !important;
}


body.tc-chart-workspace
#tcMultiChartControl button {

    min-width:
        25px !important;

    width:
        25px !important;

    height:
        24px !important;

    min-height:
        24px !important;

    padding:
        0 !important;

    border-radius:
        4px !important;

    font-size:
        9px !important;
}


/* ==========================================================
   9. CHART START / HEIGHT
   ========================================================== */


/*
 * Small clean gap immediately before chart.
 */

body.tc-chart-workspace
#tcMultiChartGrid {

    margin-top:
        2px !important;
}


/*
 * The default 1-chart workspace should fill almost all
 * remaining browser viewport.
 */

body.tc-chart-workspace
#tcMultiChartGrid.tc-multichart-count-1
.tc-chart-shell {

    height:
        calc(
            100vh - 232px
        ) !important;

    min-height:
        620px !important;

    margin-right:
        calc(
            var(--tc-v12-rail-width)
            + var(--tc-v12-rail-gap)
        ) !important;

    box-sizing:
        border-box !important;
}


body.tc-chart-workspace
#tcMultiChartGrid.tc-multichart-count-1
.tc-chart {

    height:
        100% !important;

    min-height:
        620px !important;
}


body.tc-chart-workspace
#tcMultiChartGrid.tc-multichart-count-1
#bitycle-ac-widget-iframe {

    height:
        100% !important;

    min-height:
        620px !important;
}


/* ==========================================================
   10. RIGHT RAIL — NO COLLISION
   ========================================================== */


/*
 * Rail itself is 44px.
 *
 * Chart reserves:
 *   44px rail
 * +  4px breathing gap
 *
 * Therefore price scale and rail no longer touch.
 */

body.tc-chart-workspace::after {

    top:
        var(--tc-v12-chart-top)
        !important;

    right:
        0 !important;

    bottom:
        0 !important;

    width:
        var(--tc-v12-rail-width)
        !important;

    border-left:
        1px solid
        rgba(255,255,255,.07)
        !important;
}


body.tc-chart-workspace
#tcWatchlistToggle {

    top:
        calc(
            var(--tc-v12-chart-top)
            + 7px
        )
        !important;

    right:
        3px !important;
}


body.tc-chart-workspace
#tcScreenerToggle {

    top:
        calc(
            var(--tc-v12-chart-top)
            + 45px
        )
        !important;

    right:
        3px !important;
}


body.tc-chart-workspace
#tcTemplatesToggle {

    top:
        calc(
            var(--tc-v12-chart-top)
            + 83px
        )
        !important;

    right:
        3px !important;
}


body.tc-chart-workspace
#tcAlertsToggle {

    top:
        calc(
            var(--tc-v12-chart-top)
            + 121px
        )
        !important;

    right:
        3px !important;
}


body.tc-chart-workspace
#tcWatchlistToggle,

body.tc-chart-workspace
#tcScreenerToggle,

body.tc-chart-workspace
#tcTemplatesToggle,

body.tc-chart-workspace
#tcAlertsToggle {

    width:
        36px !important;

    min-width:
        36px !important;

    height:
        34px !important;

    min-height:
        34px !important;
}


/* Drawers begin exactly with the chart area. */

body.tc-chart-workspace
#tcWatchlistPanel,

body.tc-chart-workspace
#tcScreenerPanel,

body.tc-chart-workspace
#tcTemplatesPanel,

body.tc-chart-workspace
#tcAlertsPanel {

    top:
        var(--tc-v12-chart-top)
        !important;

    right:
        var(--tc-v12-rail-width)
        !important;

    bottom:
        0 !important;
}


/* ==========================================================
   11. MEDIUM DESKTOP
   ========================================================== */

@media (
    min-width: 761px
)
and (
    max-width: 1100px
) {

    body.tc-chart-workspace {

        --tc-v12-chart-top:
            252px;
    }


    body.tc-chart-workspace
    .tc-chart-header-row
    #tcMarketSymbolSearch {

        width:
            270px !important;

        max-width:
            270px !important;

        flex:
            0 1 270px !important;
    }


    body.tc-chart-workspace
    #tcMultiChartGrid.tc-multichart-count-1
    .tc-chart-shell {

        height:
            calc(
                100vh - 258px
            ) !important;
    }

}


/* ==========================================================
   12. MOBILE
   ========================================================== */

@media (
    max-width: 760px
) {

    body.tc-chart-workspace {

        --tc-v12-rail-width:
            0px;

        --tc-v12-rail-gap:
            0px;
    }


    body.tc-chart-workspace
    .tc-chart-workspace-bar {

        height:
            38px !important;

        min-height:
            38px !important;
    }


    body.tc-chart-workspace
    .tc-symbol-bar {

        min-height:
            48px !important;
    }


    body.tc-chart-workspace
    .tc-chart-header-row {

        min-height:
            auto !important;

        margin:
            4px 0 !important;
    }


    body.tc-chart-workspace
    .tc-chart-header-row
    #tcMarketSymbolSearch {

        width:
            100% !important;

        max-width:
            100% !important;

        flex:
            1 1 100% !important;
    }


    body.tc-chart-workspace
    #tcMultiChartGrid.tc-multichart-count-1
    .tc-chart-shell {

        height:
            620px !important;

        min-height:
            620px !important;

        margin-right:
            0 !important;
    }

}


/* TAHLIL_CHART_OVERLAP_HOTFIX_V13
 * CSS-only hotfix
 * Goal:
 * 1) remove overlap between upper controls and right rail
 * 2) reduce dead space above chart
 * 3) keep chart area clearer and slightly higher
 */

#tcMarketTerminal {
    position: relative !important;
    padding-top: 4px !important;
    padding-right: 58px !important;
}

#tcCryptoSymbols,
#tcForexQuickSymbols,
#tcMarketSymbolSearch {
    position: relative !important;
    z-index: 40 !important;
    margin-bottom: 8px !important;
}

#tcMarketSymbolSearch {
    margin-top: 0 !important;
}

:is(
    #tcWorkspaceRail,
    #tcChartWorkspaceRail,
    #tcToolsRail,
    .tc-workspace-rail,
    .tc-chart-workspace-rail,
    .tc-chart-tools-rail,
    .tc-right-tools-rail,
    .tc-side-rail,
    .tc-chart-side-rail
) {
    position: fixed !important;
    top: 252px !important;
    right: 8px !important;
    width: 42px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    z-index: 22 !important;
}

:is(
    #tcWorkspaceRail,
    #tcChartWorkspaceRail,
    #tcToolsRail,
    .tc-workspace-rail,
    .tc-chart-workspace-rail,
    .tc-chart-tools-rail,
    .tc-right-tools-rail,
    .tc-side-rail,
    .tc-chart-side-rail
) > * {
    margin: 0 !important;
}

:is(
    .tc-market-chart-shell,
    .tc-chart-shell,
    .tc-chart-wrap,
    .tc-market-chart-wrap,
    .tc-chart-stage
) {
    margin-top: 0 !important;
    padding-top: 0 !important;
    min-height: calc(100vh - 245px) !important;
}

:is(
    #bitycle-ac-widget-iframe,
    .tc-market-chart-iframe,
    .tc-main-chart-iframe
) {
    display: block !important;
    width: 100% !important;
    min-height: calc(100vh - 255px) !important;
}

@media (max-width: 1280px) {
    #tcMarketTerminal {
        padding-right: 54px !important;
    }

    :is(
        #tcWorkspaceRail,
        #tcChartWorkspaceRail,
        #tcToolsRail,
        .tc-workspace-rail,
        .tc-chart-workspace-rail,
        .tc-chart-tools-rail,
        .tc-right-tools-rail,
        .tc-side-rail,
        .tc-chart-side-rail
    ) {
        top: 236px !important;
        right: 6px !important;
    }

    :is(
        #bitycle-ac-widget-iframe,
        .tc-market-chart-iframe,
        .tc-main-chart-iframe
    ) {
        min-height: calc(100vh - 238px) !important;
    }
}

@media (max-width: 992px) {
    #tcMarketTerminal {
        padding-right: 0 !important;
        padding-top: 2px !important;
    }

    :is(
        #tcWorkspaceRail,
        #tcChartWorkspaceRail,
        #tcToolsRail,
        .tc-workspace-rail,
        .tc-chart-workspace-rail,
        .tc-chart-tools-rail,
        .tc-right-tools-rail,
        .tc-side-rail,
        .tc-chart-side-rail
    ) {
        top: auto !important;
        bottom: 92px !important;
        right: 6px !important;
        width: 40px !important;
        gap: 6px !important;
    }

    :is(
        #bitycle-ac-widget-iframe,
        .tc-market-chart-iframe,
        .tc-main-chart-iframe
    ) {
        min-height: calc(100vh - 210px) !important;
    }
}



/* ==========================================================
   TAHLIL_CHART_CENTER_V131

   Fix visual left-shift introduced by double right spacing.

   V12 already reserves:
     44px rail + 4px gap

   V13 additionally added:
     #tcMarketTerminal padding-right: 58px

   That second reservation is removed here.
   CSS ONLY.
   ========================================================== */


/* ----------------------------------------------------------
   1. REMOVE DOUBLE RIGHT RESERVATION
   ---------------------------------------------------------- */

body.tc-chart-workspace
#tcMarketTerminal {

    padding-right:
        0 !important;

    padding-left:
        0 !important;
}


/* ----------------------------------------------------------
   2. KEEP ONLY THE REAL RAIL SPACE
   ---------------------------------------------------------- */

body.tc-chart-workspace
#tcMultiChartGrid.tc-multichart-count-1
.tc-chart-shell {

    margin-right:
        48px !important;

    margin-left:
        0 !important;

    width:
        calc(100% - 48px) !important;

    max-width:
        calc(100% - 48px) !important;
}


/* ----------------------------------------------------------
   3. GRID ITSELF MUST USE FULL WIDTH
   ---------------------------------------------------------- */

body.tc-chart-workspace
#tcMultiChartGrid {

    width:
        100% !important;

    max-width:
        none !important;

    margin-left:
        0 !important;

    margin-right:
        0 !important;

    padding-left:
        0 !important;

    padding-right:
        0 !important;
}


/* ----------------------------------------------------------
   4. CHART CONTAINER
   ---------------------------------------------------------- */

body.tc-chart-workspace
.tc-chart {

    width:
        100% !important;

    max-width:
        none !important;
}


/* ----------------------------------------------------------
   5. BITYCLE IFRAME FILLS ITS SHELL
   ---------------------------------------------------------- */

body.tc-chart-workspace
#bitycle-ac-widget-iframe {

    width:
        100% !important;

    max-width:
        100% !important;

    margin:
        0 !important;
}


/* ----------------------------------------------------------
   6. RAIL POSITION REMAINS UNCHANGED
   ---------------------------------------------------------- */

body.tc-chart-workspace::after {

    right:
        0 !important;

    width:
        44px !important;
}


/*
 * Actual tools stay centered inside 44px rail.
 */

body.tc-chart-workspace
#tcWatchlistToggle,

body.tc-chart-workspace
#tcScreenerToggle,

body.tc-chart-workspace
#tcTemplatesToggle,

body.tc-chart-workspace
#tcAlertsToggle {

    right:
        4px !important;
}


/* ----------------------------------------------------------
   7. REMOVE V13 MEDIUM-DESKTOP EXTRA RIGHT PADDING
   ---------------------------------------------------------- */

@media (max-width: 1280px) {

    body.tc-chart-workspace
    #tcMarketTerminal {

        padding-right:
            0 !important;

        padding-left:
            0 !important;
    }


    body.tc-chart-workspace
    #tcMultiChartGrid.tc-multichart-count-1
    .tc-chart-shell {

        margin-right:
            48px !important;

        width:
            calc(100% - 48px) !important;

        max-width:
            calc(100% - 48px) !important;
    }

}


/* ----------------------------------------------------------
   8. MOBILE
   ---------------------------------------------------------- */

@media (max-width: 760px) {

    body.tc-chart-workspace
    #tcMultiChartGrid.tc-multichart-count-1
    .tc-chart-shell {

        margin-right:
            0 !important;

        width:
            100% !important;

        max-width:
            100% !important;
    }

}



/* ==========================================================
   TAHLIL_RAIL_ALIGN_V132

   Final vertical alignment.

   Problem:
   right-side tools currently start inside Search /
   MultiChart controls.

   Correct behavior:
   Rail begins immediately after those controls,
   aligned with the Bitycle chart.

   CSS ONLY.
   ========================================================== */


body.tc-chart-workspace {

    /*
     * V12 used 226px, which is slightly too high after
     * Search + MultiChart compact layout.
     */

    --tc-v132-rail-top:
        266px;
}


/* ----------------------------------------------------------
   RAIL BACKGROUND
   ---------------------------------------------------------- */

body.tc-chart-workspace::after {

    top:
        var(--tc-v132-rail-top)
        !important;

    right:
        0 !important;

    bottom:
        0 !important;

    width:
        44px !important;
}


/* ----------------------------------------------------------
   RAIL BUTTONS
   ---------------------------------------------------------- */

body.tc-chart-workspace
#tcWatchlistToggle {

    top:
        calc(
            var(--tc-v132-rail-top)
            + 6px
        )
        !important;

    right:
        4px !important;
}


body.tc-chart-workspace
#tcScreenerToggle {

    top:
        calc(
            var(--tc-v132-rail-top)
            + 42px
        )
        !important;

    right:
        4px !important;
}


body.tc-chart-workspace
#tcTemplatesToggle {

    top:
        calc(
            var(--tc-v132-rail-top)
            + 78px
        )
        !important;

    right:
        4px !important;
}


body.tc-chart-workspace
#tcAlertsToggle {

    top:
        calc(
            var(--tc-v132-rail-top)
            + 114px
        )
        !important;

    right:
        4px !important;
}


/*
 * Keep buttons fully inside the rail.
 */

body.tc-chart-workspace
#tcWatchlistToggle,

body.tc-chart-workspace
#tcScreenerToggle,

body.tc-chart-workspace
#tcTemplatesToggle,

body.tc-chart-workspace
#tcAlertsToggle {

    width:
        36px !important;

    min-width:
        36px !important;

    height:
        32px !important;

    min-height:
        32px !important;

    margin:
        0 !important;
}


/* ----------------------------------------------------------
   DRAWERS
   Must start at same vertical point as rail/chart.
   ---------------------------------------------------------- */

body.tc-chart-workspace
#tcWatchlistPanel,

body.tc-chart-workspace
#tcScreenerPanel,

body.tc-chart-workspace
#tcTemplatesPanel,

body.tc-chart-workspace
#tcAlertsPanel {

    top:
        var(--tc-v132-rail-top)
        !important;

    right:
        44px !important;

    bottom:
        0 !important;
}


/* ----------------------------------------------------------
   SEARCH / MULTICHART
   Keep these completely ABOVE the rail.
   ---------------------------------------------------------- */

body.tc-chart-workspace
.tc-chart-header-row {

    position:
        relative !important;

    z-index:
        30 !important;
}


body.tc-chart-workspace
#tcMarketSymbolSearch {

    position:
        relative !important;

    z-index:
        31 !important;
}


body.tc-chart-workspace
#tcMultiChartControl {

    position:
        relative !important;

    z-index:
        31 !important;
}


/* ----------------------------------------------------------
   CHART WIDTH FROM V131 REMAINS UNCHANGED
   ---------------------------------------------------------- */

body.tc-chart-workspace
#tcMultiChartGrid.tc-multichart-count-1
.tc-chart-shell {

    margin-right:
        48px !important;

    width:
        calc(100% - 48px) !important;

    max-width:
        calc(100% - 48px) !important;
}


/* ----------------------------------------------------------
   MEDIUM DESKTOP
   Slightly more room because controls wrap earlier.
   ---------------------------------------------------------- */

@media (
    min-width: 761px
)
and (
    max-width: 1100px
) {

    body.tc-chart-workspace {

        --tc-v132-rail-top:
            282px;
    }

}


/* ----------------------------------------------------------
   MOBILE
   Keep previous bottom-toolbar behavior.
   ---------------------------------------------------------- */

@media (max-width: 760px) {

    body.tc-chart-workspace::after {

        display:
            none !important;
    }


    body.tc-chart-workspace
    #tcWatchlistToggle,

    body.tc-chart-workspace
    #tcScreenerToggle,

    body.tc-chart-workspace
    #tcTemplatesToggle,

    body.tc-chart-workspace
    #tcAlertsToggle {

        top:
            auto !important;
    }


    body.tc-chart-workspace
    #tcWatchlistPanel,

    body.tc-chart-workspace
    #tcScreenerPanel,

    body.tc-chart-workspace
    #tcTemplatesPanel,

    body.tc-chart-workspace
    #tcAlertsPanel {

        top:
            58px !important;

        right:
            8px !important;

        left:
            8px !important;

        bottom:
            56px !important;
    }

}



/* ==========================================================
   TAHLIL_CHART_TOPBAND_V133

   Goal:
   1) move Search row and MultiChart row one band upward
   2) place MultiChart opposite the Display/Search band
   3) reduce dead space above the chart
   4) bring the main chart upward
   5) do not touch JavaScript

   Works only inside chart workspace.
   ========================================================== */

body.tc-chart-workspace {
    --tc-v133-top-shift: 34px;
    --tc-v133-chart-lift: 26px;
    --tc-v133-search-width: min(620px, calc(100vw - 360px));
    --tc-v133-multichart-width: 280px;

    /*
     * V132 started the right rail slightly too low for the
     * newer compact control layout.
     */
    --tc-v132-rail-top: 232px !important;
}


/* ----------------------------------------------------------
   1) TOP CONTROL LINES TIGHTER
   ---------------------------------------------------------- */

body.tc-chart-workspace
#tcCryptoSymbols,

body.tc-chart-workspace
#tcForexQuickSymbols {
    margin-bottom: 6px !important;
}


body.tc-chart-workspace
#tcMarketSymbolSearch {
    position: relative !important;
    z-index: 35 !important;
    width: var(--tc-v133-search-width) !important;
    max-width: 100% !important;
    margin-top: calc(var(--tc-v133-top-shift) * -1) !important;
    margin-bottom: 6px !important;
}


body.tc-chart-workspace
#tcMarketSymbolSearch input,
body.tc-chart-workspace
#tcMarketSymbolSearch .tc-market-search-input {
    min-height: 44px !important;
}


/* ----------------------------------------------------------
   2) MULTICHART MOVES UP NEXT TO SEARCH BAND
   ---------------------------------------------------------- */

body.tc-chart-workspace
#tcMultiChartControl {
    position: relative !important;
    z-index: 35 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;

    width: var(--tc-v133-multichart-width) !important;
    max-width: 100% !important;

    margin-top: calc(var(--tc-v133-top-shift) * -1 - 2px) !important;
    margin-bottom: 4px !important;

    /*
     * In RTL this nudges the block to the opposite side
     * of the display/search band.
     */
    margin-inline-start: 0 !important;
    margin-inline-end: 14px !important;
}


body.tc-chart-workspace
#tcMultiChartControl .tc-multichart-buttons,
body.tc-chart-workspace
#tcMultiChartControl .tc-multichart-counts,
body.tc-chart-workspace
#tcMultiChartControl .tc-multichart-list {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
}


body.tc-chart-workspace
#tcMultiChartControl .tc-multichart-label {
    white-space: nowrap !important;
    margin: 0 !important;
}


body.tc-chart-workspace
#tcMultiChartControl button,
body.tc-chart-workspace
#tcMultiChartControl .tc-multichart-btn {
    min-width: 40px !important;
}


/* ----------------------------------------------------------
   3) PULL CHART UP
   ---------------------------------------------------------- */

body.tc-chart-workspace
#tcMultiChartGrid {
    margin-top: calc(var(--tc-v133-chart-lift) * -1) !important;
    padding-top: 0 !important;
}


body.tc-chart-workspace
#tcMultiChartGrid.tc-multichart-count-1
.tc-chart-shell {
    margin-top: 0 !important;
    padding-top: 0 !important;
    min-height: calc(100vh - 212px) !important;
}


body.tc-chart-workspace
#bitycle-ac-widget-iframe,
body.tc-chart-workspace
.tc-main-chart-iframe,
body.tc-chart-workspace
.tc-market-chart-iframe {
    min-height: calc(100vh - 222px) !important;
}


/* ----------------------------------------------------------
   4) KEEP TOP LAYERS CLEAN
   ---------------------------------------------------------- */

body.tc-chart-workspace
.tc-chart-header-row,
body.tc-chart-workspace
.tc-market-controls-row,
body.tc-chart-workspace
.tc-market-top-row {
    position: relative !important;
    z-index: 30 !important;
}


/* ----------------------------------------------------------
   5) SMALL DESKTOP / LAPTOP
   ---------------------------------------------------------- */

@media (max-width: 1200px) {
    body.tc-chart-workspace {
        --tc-v133-search-width: min(540px, calc(100vw - 320px));
        --tc-v133-multichart-width: 250px;
        --tc-v133-top-shift: 32px;
        --tc-v133-chart-lift: 22px;
        --tc-v132-rail-top: 226px !important;
    }

    body.tc-chart-workspace
    #tcMarketSymbolSearch {
        margin-bottom: 4px !important;
    }

    body.tc-chart-workspace
    #tcMultiChartControl {
        margin-bottom: 2px !important;
    }

    body.tc-chart-workspace
    #tcMultiChartGrid.tc-multichart-count-1
    .tc-chart-shell {
        min-height: calc(100vh - 206px) !important;
    }

    body.tc-chart-workspace
    #bitycle-ac-widget-iframe,
    body.tc-chart-workspace
    .tc-main-chart-iframe,
    body.tc-chart-workspace
    .tc-market-chart-iframe {
        min-height: calc(100vh - 216px) !important;
    }
}


/* ----------------------------------------------------------
   6) TABLET
   ---------------------------------------------------------- */

@media (max-width: 992px) {
    body.tc-chart-workspace {
        --tc-v133-search-width: min(100%, calc(100vw - 120px));
        --tc-v133-multichart-width: auto;
        --tc-v133-top-shift: 18px;
        --tc-v133-chart-lift: 12px;
        --tc-v132-rail-top: 214px !important;
    }

    body.tc-chart-workspace
    #tcMarketSymbolSearch {
        width: 100% !important;
        margin-top: -18px !important;
    }

    body.tc-chart-workspace
    #tcMultiChartControl {
        width: auto !important;
        margin-top: -14px !important;
        margin-inline-end: 8px !important;
        flex-wrap: wrap !important;
    }

    body.tc-chart-workspace
    #tcMultiChartGrid {
        margin-top: -10px !important;
    }

    body.tc-chart-workspace
    #tcMultiChartGrid.tc-multichart-count-1
    .tc-chart-shell {
        min-height: calc(100vh - 190px) !important;
    }

    body.tc-chart-workspace
    #bitycle-ac-widget-iframe,
    body.tc-chart-workspace
    .tc-main-chart-iframe,
    body.tc-chart-workspace
    .tc-market-chart-iframe {
        min-height: calc(100vh - 198px) !important;
    }
}


/* ----------------------------------------------------------
   7) MOBILE
   ---------------------------------------------------------- */

@media (max-width: 760px) {
    body.tc-chart-workspace {
        --tc-v133-top-shift: 0px;
        --tc-v133-chart-lift: 0px;
    }

    body.tc-chart-workspace
    #tcMarketSymbolSearch {
        width: 100% !important;
        margin-top: 0 !important;
        margin-bottom: 8px !important;
    }

    body.tc-chart-workspace
    #tcMultiChartControl {
        width: 100% !important;
        margin-top: 0 !important;
        margin-bottom: 8px !important;
        margin-inline-end: 0 !important;
        justify-content: flex-start !important;
    }

    body.tc-chart-workspace
    #tcMultiChartGrid {
        margin-top: 0 !important;
    }

    body.tc-chart-workspace
    #tcMultiChartGrid.tc-multichart-count-1
    .tc-chart-shell {
        min-height: calc(100vh - 180px) !important;
    }

    body.tc-chart-workspace
    #bitycle-ac-widget-iframe,
    body.tc-chart-workspace
    .tc-main-chart-iframe,
    body.tc-chart-workspace
    .tc-market-chart-iframe {
        min-height: calc(100vh - 188px) !important;
    }
}



/* ==========================================================
   TAHLIL_TIMEFRAME_TOOLBAR_V134B

   Search + MultiChart are REAL children of Timeframe bar.

   Final desktop layout:
   LEFT:
       Search / Display Chart
       MultiChart selector

   RIGHT:
       Timeframes

   Dedicated /markets/chart/ only.
   ========================================================== */


/* ----------------------------------------------------------
   1. SINGLE REAL TOOLBAR
   ---------------------------------------------------------- */

body.tc-chart-workspace
.tc-timeframe-bar {

    display:
        flex !important;

    flex-direction:
        row !important;

    align-items:
        center !important;

    flex-wrap:
        nowrap !important;

    width:
        100% !important;

    min-height:
        44px !important;

    height:
        auto !important;

    padding:
        4px 10px !important;

    gap:
        5px !important;

    box-sizing:
        border-box !important;

    overflow:
        visible !important;
}


/* ----------------------------------------------------------
   2. TIMEFRAMES STAY ON RIGHT
   ---------------------------------------------------------- */

body.tc-chart-workspace
.tc-timeframe-label {

    flex:
        0 0 auto !important;

    margin:
        0 !important;

    white-space:
        nowrap !important;
}


body.tc-chart-workspace
.tc-timeframes {

    display:
        flex !important;

    align-items:
        center !important;

    flex-wrap:
        nowrap !important;

    flex:
        0 0 auto !important;

    gap:
        1px !important;

    margin:
        0 !important;

    white-space:
        nowrap !important;
}


/* ----------------------------------------------------------
   3. SEARCH + MULTICHART ON OPPOSITE SIDE
   ---------------------------------------------------------- */

body.tc-chart-workspace
.tc-timeframe-opposite-tools {

    display:
        flex !important;

    align-items:
        center !important;

    justify-content:
        flex-start !important;

    flex:
        1 1 auto !important;

    min-width:
        0 !important;

    gap:
        6px !important;

    margin-right:
        auto !important;

    margin-left:
        0 !important;

    padding:
        0 !important;

    position:
        relative !important;

    z-index:
        35 !important;
}


/* ----------------------------------------------------------
   4. SEARCH / DISPLAY
   ---------------------------------------------------------- */

body.tc-chart-workspace
.tc-timeframe-opposite-tools
.tc-chart-header-row {

    display:
        block !important;

    position:
        relative !important;

    inset:
        auto !important;

    transform:
        none !important;

    flex:
        1 1 280px !important;

    min-width:
        220px !important;

    max-width:
        360px !important;

    width:
        auto !important;

    min-height:
        34px !important;

    height:
        34px !important;

    margin:
        0 !important;

    padding:
        0 !important;
}


body.tc-chart-workspace
.tc-timeframe-opposite-tools
#tcMarketSymbolSearch {

    position:
        relative !important;

    inset:
        auto !important;

    transform:
        none !important;

    width:
        100% !important;

    max-width:
        100% !important;

    min-width:
        0 !important;

    height:
        34px !important;

    min-height:
        34px !important;

    margin:
        0 !important;

    padding:
        0 !important;
}


body.tc-chart-workspace
.tc-timeframe-opposite-tools
#tcMarketSymbolSearch
.tc-market-search-box {

    height:
        34px !important;

    min-height:
        34px !important;

    padding:
        2px 5px !important;

    margin:
        0 !important;

    gap:
        4px !important;

    border-radius:
        6px !important;

    box-sizing:
        border-box !important;
}


body.tc-chart-workspace
.tc-timeframe-opposite-tools
#tcGlobalSymbolSearch {

    height:
        28px !important;

    min-height:
        28px !important;

    font-size:
        9px !important;
}


body.tc-chart-workspace
.tc-timeframe-opposite-tools
#tcGlobalSymbolSearchButton {

    height:
        28px !important;

    min-height:
        28px !important;

    padding:
        0 9px !important;

    white-space:
        nowrap !important;
}


/* ----------------------------------------------------------
   5. MULTICHART BESIDE SEARCH
   ---------------------------------------------------------- */

body.tc-chart-workspace
.tc-timeframe-opposite-tools
#tcMultiChartControl {

    display:
        flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    flex-wrap:
        nowrap !important;

    flex:
        0 0 auto !important;

    position:
        relative !important;

    inset:
        auto !important;

    transform:
        none !important;

    width:
        auto !important;

    min-width:
        205px !important;

    max-width:
        225px !important;

    height:
        34px !important;

    min-height:
        34px !important;

    padding:
        2px 5px !important;

    margin:
        0 !important;

    gap:
        4px !important;

    box-sizing:
        border-box !important;
}


body.tc-chart-workspace
.tc-timeframe-opposite-tools
.tc-multichart-label {

    margin:
        0 2px !important;

    font-size:
        8px !important;

    white-space:
        nowrap !important;
}


body.tc-chart-workspace
.tc-timeframe-opposite-tools
.tc-multichart-buttons {

    display:
        flex !important;

    align-items:
        center !important;

    flex-wrap:
        nowrap !important;

    gap:
        2px !important;
}


body.tc-chart-workspace
.tc-timeframe-opposite-tools
#tcMultiChartControl button {

    width:
        27px !important;

    min-width:
        27px !important;

    height:
        27px !important;

    min-height:
        27px !important;

    padding:
        0 !important;

    margin:
        0 !important;

    font-size:
        8px !important;
}


/* ----------------------------------------------------------
   6. KILL V133 NEGATIVE-MARGIN SIMULATION
   ---------------------------------------------------------- */

body.tc-chart-workspace
#tcMarketSymbolSearch,

body.tc-chart-workspace
#tcMultiChartControl {

    margin-top:
        0 !important;

    margin-bottom:
        0 !important;

    transform:
        none !important;
}


/* ----------------------------------------------------------
   7. CHART NOW FOLLOWS TOOLBAR DIRECTLY
   ---------------------------------------------------------- */

body.tc-chart-workspace
#tcMultiChartGrid {

    margin-top:
        2px !important;

    padding-top:
        0 !important;
}


/* ----------------------------------------------------------
   8. LAPTOP COMPRESSION
   ---------------------------------------------------------- */

@media (
    min-width: 1001px
)
and (
    max-width: 1250px
) {

    body.tc-chart-workspace
    .tc-timeframe-bar {

        gap:
            3px !important;

        padding-left:
            6px !important;

        padding-right:
            6px !important;
    }


    body.tc-chart-workspace
    .tc-timeframes {

        gap:
            0 !important;
    }


    body.tc-chart-workspace
    .tc-timeframes button {

        min-width:
            26px !important;

        padding:
            0 3px !important;

        font-size:
            8px !important;
    }


    body.tc-chart-workspace
    .tc-timeframe-opposite-tools {

        gap:
            4px !important;
    }


    body.tc-chart-workspace
    .tc-timeframe-opposite-tools
    .tc-chart-header-row {

        min-width:
            205px !important;

        max-width:
            300px !important;
    }


    body.tc-chart-workspace
    .tc-timeframe-opposite-tools
    #tcMultiChartControl {

        min-width:
            190px !important;

        max-width:
            205px !important;
    }

}


/* ----------------------------------------------------------
   9. SMALL SCREEN FALLBACK — NO OVERLAP
   ---------------------------------------------------------- */

@media (max-width: 1000px) {

    body.tc-chart-workspace
    .tc-timeframe-bar {

        flex-wrap:
            wrap !important;

        row-gap:
            5px !important;
    }


    body.tc-chart-workspace
    .tc-timeframe-opposite-tools {

        order:
            2 !important;

        flex:
            1 0 100% !important;

        width:
            100% !important;

        margin:
            0 !important;
    }


    body.tc-chart-workspace
    .tc-timeframe-opposite-tools
    .tc-chart-header-row {

        flex:
            1 1 auto !important;

        max-width:
            none !important;
    }


    body.tc-chart-workspace
    .tc-timeframe-opposite-tools
    #tcMultiChartControl {

        flex:
            0 0 auto !important;
    }

}


/* ----------------------------------------------------------
   10. MOBILE
   ---------------------------------------------------------- */

@media (max-width: 760px) {

    body.tc-chart-workspace
    .tc-timeframe-opposite-tools {

        display:
            grid !important;

        grid-template-columns:
            1fr !important;
    }


    body.tc-chart-workspace
    .tc-timeframe-opposite-tools
    #tcMultiChartControl {

        width:
            100% !important;

        max-width:
            none !important;
    }

}



/* ==========================================================
   TAHLIL_TOOLBAR_SPACING_V135

   Visual spacing only.
   No DOM movement.
   No JS.
   ========================================================== */


/*
 * More breathing room between:
 *
 * Timeframes
 * Search / Display
 * MultiChart
 */

body.tc-chart-workspace
.tc-timeframe-bar {

    column-gap:
        11px !important;

    padding-left:
        14px !important;

    padding-right:
        14px !important;
}


/*
 * Search and MultiChart themselves were too close.
 */

body.tc-chart-workspace
.tc-timeframe-opposite-tools {

    gap:
        12px !important;

    padding-right:
        6px !important;
}


/*
 * Small gap around timeframe label.
 */

body.tc-chart-workspace
.tc-timeframe-label {

    margin-left:
        5px !important;
}


/*
 * Timeframes themselves remain compact,
 * but not visually glued together.
 */

body.tc-chart-workspace
.tc-timeframes {

    gap:
        3px !important;
}


/*
 * Give Search a little independent breathing space.
 */

body.tc-chart-workspace
.tc-timeframe-opposite-tools
.tc-chart-header-row {

    margin:
        0 3px !important;
}


/*
 * MultiChart also gets a few pixels around itself.
 */

body.tc-chart-workspace
.tc-timeframe-opposite-tools
#tcMultiChartControl {

    margin:
        0 3px !important;
}


/*
 * Laptop widths:
 * retain spacing without forcing wrap.
 */

@media (
    min-width: 1001px
)
and (
    max-width: 1250px
) {

    body.tc-chart-workspace
    .tc-timeframe-bar {

        column-gap:
            7px !important;

        padding-left:
            8px !important;

        padding-right:
            8px !important;
    }


    body.tc-chart-workspace
    .tc-timeframe-opposite-tools {

        gap:
            8px !important;

        padding-right:
            3px !important;
    }


    body.tc-chart-workspace
    .tc-timeframes {

        gap:
            1px !important;
    }

}



/* ==========================================================
   TAHLIL_WATCHLIST_ENTRY_V136

   Existing Level-3 Watchlist star is now shown beside
   current symbol on /markets/chart/.

   No new Watchlist logic.
   ========================================================== */


body.tc-chart-workspace
.tc-symbol-primary {

    display:
        flex !important;

    align-items:
        center !important;

    gap:
        8px !important;
}


/*
 * Existing real Watchlist button.
 */

body.tc-chart-workspace
.tc-symbol-primary
#tcWatchlistCurrent {

    position:
        static !important;

    inset:
        auto !important;

    flex:
        0 0 34px !important;

    display:
        grid !important;

    place-items:
        center !important;

    width:
        34px !important;

    min-width:
        34px !important;

    height:
        34px !important;

    min-height:
        34px !important;

    padding:
        0 !important;

    margin:
        0 4px 0 0 !important;

    border:
        1px solid
        rgba(255,255,255,.10) !important;

    border-radius:
        7px !important;

    background:
        #11161d !important;

    color:
        #9ba5b3 !important;

    box-shadow:
        none !important;

    font-size:
        21px !important;

    line-height:
        1 !important;

    cursor:
        pointer !important;

    transition:
        background .12s ease,
        color .12s ease,
        border-color .12s ease
        !important;
}


body.tc-chart-workspace
.tc-symbol-primary
#tcWatchlistCurrent:hover {

    background:
        rgba(255,255,255,.06) !important;

    color:
        #e6bd58 !important;

    border-color:
        rgba(230,189,88,.35) !important;
}


/*
 * Saved = filled gold star.
 */

body.tc-chart-workspace
.tc-symbol-primary
#tcWatchlistCurrent.is-saved {

    color:
        #e6bd58 !important;

    border-color:
        rgba(230,189,88,.42) !important;

    background:
        rgba(230,189,88,.09) !important;
}


/*
 * Do not allow old floating Watchlist-actions CSS
 * to affect the moved star.
 */

body.tc-chart-workspace
.tc-symbol-primary
.tc-watchlist-star {

    position:
        static !important;

    transform:
        none !important;
}


/* Mobile */

@media (max-width: 760px) {

    body.tc-chart-workspace
    .tc-symbol-primary
    #tcWatchlistCurrent {

        width:
            32px !important;

        min-width:
            32px !important;

        height:
            32px !important;

        min-height:
            32px !important;

        font-size:
            19px !important;
    }

}



/* ==========================================================
   TAHLIL_WATCHLIST_QUOTES_UI_V137A
   ========================================================== */


body.tc-chart-workspace
#tcWatchlistPanel {

    width:
        min(
            390px,
            calc(100vw - 64px)
        ) !important;

    max-width:
        390px !important;
}


body.tc-chart-workspace
.tc-watchlist-columns-v137a {

    display:
        grid;

    grid-template-columns:
        minmax(0,1fr)
        88px
        68px
        24px;

    align-items:
        center;

    gap:
        5px;

    min-height:
        28px;

    padding:
        0 8px;

    border-bottom:
        1px solid
        rgba(255,255,255,.07);

    background:
        rgba(255,255,255,.025);

    color:
        #7f8997;

    font-size:
        9px;
}


body.tc-chart-workspace
#tcWatchlistItems
.tc-watchlist-item {

    display:
        grid !important;

    grid-template-columns:
        minmax(0,1fr)
        161px
        24px;

    align-items:
        center;

    gap:
        5px;

    min-height:
        50px;

    padding:
        5px 8px !important;
}


body.tc-chart-workspace
.tc-watchlist-quote-v137a {

    display:
        grid;

    grid-template-columns:
        88px
        68px;

    align-items:
        center;

    gap:
        5px;

    direction:
        ltr;

    text-align:
        right;

    font-variant-numeric:
        tabular-nums;
}


body.tc-chart-workspace
.tc-watchlist-price-v137a {

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;

    color:
        #dfe5ed;

    font-size:
        10px;
}


body.tc-chart-workspace
.tc-watchlist-change-v137a {

    white-space:
        nowrap;

    font-size:
        10px;

    font-weight:
        650;
}


body.tc-chart-workspace
.tc-watchlist-change-v137a.is-up {

    color:
        #18a982;
}


body.tc-chart-workspace
.tc-watchlist-change-v137a.is-down {

    color:
        #dc6269;
}


body.tc-chart-workspace
.tc-watchlist-change-v137a.is-flat {

    color:
        #818b99;
}


body.tc-chart-workspace
.tc-watchlist-quote-v137a.is-stale
.tc-watchlist-price-v137a,

body.tc-chart-workspace
.tc-watchlist-quote-v137a.is-stale
.tc-watchlist-change-v137a {

    opacity:
        .55;
}


body.tc-chart-workspace
.tc-watchlist-stale-v137a {

    grid-column:
        1 / -1;

    color:
        #788290;

    font-size:
        7px;

    direction:
        rtl;

    text-align:
        right;
}


@media (max-width: 760px) {

    body.tc-chart-workspace
    #tcWatchlistPanel {

        width:
            auto !important;

        max-width:
            none !important;
    }

}



/* ==========================================================
   TAHLIL_ADVANCED_ALERT_UI_V138
   ========================================================== */


/*
 * On dedicated Chart page use the advanced creator instead
 * of the legacy creation form.
 *
 * Alert Center below remains available.
 */

body.tc-chart-workspace
#tcAlertCreateForm {

    display:
        none !important;
}


body.tc-chart-workspace
#tcAlertsList {

    display:
        none !important;
}


body.tc-chart-workspace
.tc-advanced-alert-v138 {

    padding:
        10px;

    border-bottom:
        1px solid
        rgba(255,255,255,.08);
}


body.tc-chart-workspace
.tc-advanced-alert-title-v138 {

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        8px;

    margin-bottom:
        10px;
}


body.tc-chart-workspace
.tc-advanced-alert-title-v138
strong {

    display:
        block;

    font-size:
        12px;
}


body.tc-chart-workspace
.tc-advanced-alert-title-v138
span {

    color:
        #818b99;

    font-size:
        8px;
}


body.tc-chart-workspace
.tc-advanced-alert-symbol-v138 {

    padding:
        4px 7px;

    border:
        1px solid
        rgba(226,184,92,.22);

    border-radius:
        5px;

    color:
        #ddb75a !important;

    background:
        rgba(226,184,92,.06);
}


body.tc-chart-workspace
.tc-advanced-alert-grid-v138 {

    display:
        grid;

    grid-template-columns:
        1fr 1fr;

    gap:
        7px;

    margin-bottom:
        7px;
}


body.tc-chart-workspace
.tc-advanced-alert-v138
label {

    display:
        grid;

    gap:
        4px;

    margin-bottom:
        7px;

    color:
        #8e98a6;

    font-size:
        9px;
}


body.tc-chart-workspace
.tc-advanced-alert-v138
input,

body.tc-chart-workspace
.tc-advanced-alert-v138
select {

    width:
        100%;

    min-height:
        34px;

    padding:
        4px 7px;

    box-sizing:
        border-box;

    border:
        1px solid
        rgba(255,255,255,.09);

    border-radius:
        6px;

    background:
        #151a22;

    color:
        #dce2ea;
}


body.tc-chart-workspace
.tc-advanced-alert-check-v138 {

    display:
        flex !important;

    grid-template-columns:
        none !important;

    align-items:
        center;

    gap:
        6px !important;
}


body.tc-chart-workspace
.tc-advanced-alert-check-v138
input {

    width:
        auto !important;

    min-height:
        auto !important;
}


body.tc-chart-workspace
.tc-advanced-alert-actions-v138 {

    display:
        flex;

    gap:
        6px;

    margin-top:
        4px;
}


body.tc-chart-workspace
.tc-advanced-alert-actions-v138
button {

    min-height:
        33px;

    padding:
        0 10px;

    border:
        1px solid
        rgba(255,255,255,.09);

    border-radius:
        6px;

    cursor:
        pointer;
}


body.tc-chart-workspace
.tc-advanced-alert-create-v138 {

    flex:
        1;

    color:
        #e4be60;

    border-color:
        rgba(228,190,96,.32)
        !important;

    background:
        rgba(228,190,96,.08);
}


body.tc-chart-workspace
.tc-advanced-alert-refresh-v138 {

    color:
        #a5afbd;

    background:
        #151a22;
}


body.tc-chart-workspace
.tc-advanced-alert-status-v138 {

    min-height:
        18px;

    margin-top:
        6px;

    color:
        #8e98a6;

    font-size:
        9px;
}


body.tc-chart-workspace
.tc-advanced-alert-status-v138
[data-kind="success"] {

    color:
        #19a77f;
}


body.tc-chart-workspace
.tc-advanced-alert-status-v138
[data-kind="error"] {

    color:
        #dc6269;
}


body.tc-chart-workspace
.tc-advanced-alert-list-head-v138 {

    margin:
        5px 0;

    color:
        #87919e;

    font-size:
        9px;
}


body.tc-chart-workspace
.tc-advanced-alert-list-v138 {

    display:
        grid;

    gap:
        5px;
}


body.tc-chart-workspace
.tc-advanced-alert-row-v138 {

    display:
        grid;

    grid-template-columns:
        minmax(0,1fr)
        auto;

    align-items:
        center;

    gap:
        6px;

    padding:
        7px;

    border:
        1px solid
        rgba(255,255,255,.07);

    border-radius:
        6px;

    background:
        rgba(255,255,255,.025);
}


body.tc-chart-workspace
.tc-advanced-alert-row-main-v138 {

    display:
        grid;

    min-width:
        0;

    gap:
        2px;
}


body.tc-chart-workspace
.tc-advanced-alert-row-main-v138
strong {

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;

    color:
        #dce2ea;

    font-size:
        10px;
}


body.tc-chart-workspace
.tc-advanced-alert-row-main-v138
span {

    color:
        #7d8795;

    font-size:
        8px;
}


body.tc-chart-workspace
.tc-advanced-alert-row-actions-v138 {

    display:
        flex;

    gap:
        3px;
}


body.tc-chart-workspace
.tc-advanced-alert-row-actions-v138
button {

    min-height:
        26px;

    padding:
        0 6px;

    border:
        1px solid
        rgba(255,255,255,.08);

    border-radius:
        5px;

    background:
        #151a22;

    color:
        #9ca6b4;

    font-size:
        8px;

    cursor:
        pointer;
}


body.tc-chart-workspace
.tc-advanced-alert-note-v138 {

    margin-top:
        8px;

    padding-top:
        7px;

    border-top:
        1px solid
        rgba(255,255,255,.06);

    color:
        #697381;

    font-size:
        7px;

    line-height:
        1.7;
}


/*
 * Existing Bell in right rail visually indicates creation.
 */

body.tc-chart-workspace
#tcAlertsToggle {

    position:
        fixed !important;
}


body.tc-chart-workspace
#tcAlertsToggle::before {

    transform:
        scale(.94);
}


@media (max-width: 760px) {

    body.tc-chart-workspace
    .tc-advanced-alert-grid-v138 {

        grid-template-columns:
            1fr;
    }

}