/* =========================================================
   LUX CRIPTOS TRADING
   UI inspirada en TradingView
   ========================================================= */

:root {

    --tv-bg: #0d111a;

    --tv-chart: #131722;

    --tv-panel: #171b26;

    --tv-panel-2: #1e222d;

    --tv-panel-hover: #252a36;

    --tv-border: #2a2e39;

    --tv-border-strong: #363c4a;

    --tv-text: #d1d4dc;

    --tv-text-muted: #8a8e99;

    --tv-text-dim: #5e626d;

    --tv-green: #26a69a;

    --tv-green-light: #42c6b8;

    --tv-red: #ef5350;

    --tv-blue: #2962ff;

    --tv-blue-hover: #3d6fff;

    --tv-purple: #ab47bc;

    --tv-yellow: #ffb74d;

    --tv-orange: #ff9800;

    --radius: 5px;

    --header-height: 48px;

    --bottom-height: 34px;

    --toolbar-width: 46px;

    --watchlist-width: 270px;
}


/* =========================================================
   RESET
   ========================================================= */

* {
    box-sizing: border-box;
}

html,
body {

    width: 100%;
    height: 100%;

    margin: 0;
    padding: 0;

    overflow: hidden;

    background: var(--tv-bg);

    color: var(--tv-text);

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Helvetica,
        Arial,
        sans-serif;

    font-size: 12px;

    -webkit-font-smoothing: antialiased;
}


button,
input,
select {

    font-family: inherit;
}


button {

    cursor: pointer;
}


.tabular {

    font-variant-numeric: tabular-nums;
}



/* =========================================================
   SCROLL
   ========================================================= */

::-webkit-scrollbar {

    width: 7px;
    height: 7px;
}

::-webkit-scrollbar-track {

    background: transparent;
}

::-webkit-scrollbar-thumb {

    background: #303541;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {

    background: #444a59;
}



/* =========================================================
   APP
   ========================================================= */

.app {

    width: 100vw;
    height: 100dvh;

    display: flex;
    flex-direction: column;

    overflow: hidden;

    background: var(--tv-chart);
}



/* =========================================================
   HEADER
   ========================================================= */

.header {

    height: var(--header-height);
    min-height: var(--header-height);

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

    padding: 0 8px;

    background: var(--tv-panel);

    border-bottom: 1px solid var(--tv-border-strong);

    box-shadow:
        0 1px 0 rgba(255,255,255,.015),
        0 3px 12px rgba(0,0,0,.14);

    z-index: 100;
}


.header-left,
.header-right {

    height: 100%;

    display: flex;
    align-items: center;

    gap: 3px;
}


.header-left {

    min-width: 0;
}


.header-divider {

    width: 1px;
    height: 26px;

    margin: 0 5px;

    background: var(--tv-border);
}



/* =========================================================
   LOGO
   ========================================================= */

.brand {

    height: 100%;

    display: flex;
    align-items: center;

    gap: 9px;

    padding: 0 6px 0 2px;

    flex-shrink: 0;
}


.brand-icon {

    width: 34px;
    height: 34px;

    overflow: hidden;

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

    border-radius: 7px;

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

    background: #10141d;

    box-shadow:
        0 2px 8px rgba(0,0,0,.35);
}


.brand-icon img {

    width: 100%;
    height: 100%;

    object-fit: cover;

    display: block;
}


.brand-text {

    display: flex;
    align-items: baseline;

    gap: 5px;

    white-space: nowrap;
}


.brand-main {

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

    color: #f0f3fa;
}


.brand-lux {

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

    color: var(--tv-text-muted);
}



/* =========================================================
   HEADER CONTROLS
   ========================================================= */

.header-control {

    min-height: 32px;

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

    gap: 6px;

    padding: 0 9px;

    border: 1px solid transparent;

    border-radius: 5px;

    background: transparent;

    color: var(--tv-text);

    font-size: 11px;

    text-decoration: none;

    white-space: nowrap;

    transition:
        background .15s,
        border-color .15s,
        color .15s;
}


.header-control:hover {

    background: var(--tv-panel-hover);

    border-color: rgba(255,255,255,.035);
}


.control-icon {

    color: var(--tv-text-muted);

    font-size: 14px;
}


.control-chevron {

    color: var(--tv-text-dim);

    font-size: 10px;
}


.symbol-btn {

    font-weight: 650;
}


.symbol-label {

    font-size: 12px;

    color: #f1f3f6;
}



/* =========================================================
   LIVE STATUS
   ========================================================= */

.market-status {

    display: flex;
    align-items: center;

    gap: 5px;

    margin-right: 4px;

    padding: 4px 7px;

    color: var(--tv-text-muted);

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

    letter-spacing: .08em;
}


.market-status-dot {

    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--tv-green);

    box-shadow:
        0 0 7px rgba(38,166,154,.8);
}


.whatsapp-link {

    color: #d8dce4;
}


.whatsapp-dot {

    color: #25d366;

    font-size: 12px;
}



/* =========================================================
   TIMEFRAMES
   ========================================================= */

.timeframe-selector {

    height: 32px;

    display: flex;
    align-items: center;

    gap: 1px;

    padding: 2px;

    background: #11151e;

    border: 1px solid var(--tv-border);

    border-radius: 5px;
}


.tf-btn {

    height: 26px;

    min-width: 31px;

    padding: 0 7px;

    border: none;

    border-radius: 4px;

    background: transparent;

    color: var(--tv-text-muted);

    font-size: 10px;

    font-weight: 600;

    text-transform: uppercase;
}


.tf-btn:hover {

    background: var(--tv-panel-hover);

    color: #fff;
}


.tf-btn.active {

    background: #2a2f3b;

    color: #fff;

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



/* =========================================================
   BADGE
   ========================================================= */

.badge {

    min-width: 17px;

    padding: 1px 5px;

    border-radius: 4px;

    background: rgba(41,98,255,.18);

    color: #6f92ff;

    font-size: 9px;

    font-weight: 700;

    text-align: center;
}



/* =========================================================
   WORKSPACE
   ========================================================= */

.workspace {

    flex: 1;

    min-height: 0;

    display: flex;

    overflow: hidden;

    background: var(--tv-chart);
}



/* =========================================================
   TOOLBAR IZQUIERDA
   ========================================================= */

.left-sidebar {

    width: var(--toolbar-width);
    min-width: var(--toolbar-width);

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

    gap: 2px;

    padding: 6px 0;

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

    background: var(--tv-panel);

    border-right: 1px solid var(--tv-border-strong);

    z-index: 40;
}


.tool-btn {

    width: 34px;
    height: 34px;

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

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

    padding: 0;

    border: 1px solid transparent;

    border-radius: 5px;

    background: transparent;

    color: #9296a1;

    font-size: 15px;

    transition:
        background .13s,
        color .13s,
        border-color .13s;
}


.tool-btn:hover {

    color: #fff;

    background: var(--tv-panel-hover);

    border-color: rgba(255,255,255,.035);
}


.tool-btn.active {

    color: #fff;

    background: var(--tv-blue);

    border-color: #4d79ff;

    box-shadow:
        0 2px 7px rgba(41,98,255,.3);
}


.tool-btn.danger:hover {

    color: #fff;

    background: rgba(239,83,80,.15);

    border-color: rgba(239,83,80,.22);
}


.tool-btn[disabled] {

    opacity: .28;

    cursor: default;
}


.tool-sep {

    width: 26px;
    height: 1px;

    margin: 3px 0;

    background: var(--tv-border);
}



/* =========================================================
   CENTER
   ========================================================= */

.center-area {

    flex: 1;

    min-width: 0;
    min-height: 0;

    display: flex;
    flex-direction: column;

    overflow: hidden;
}


.chart-main {

    position: relative;

    flex: 1;

    min-width: 0;
    min-height: 0;

    overflow: hidden;

    background: var(--tv-chart);
}


.chart-container {

    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;
}



/* =========================================================
   WATCHLIST DERECHA
   ========================================================= */

.right-sidebar {

    width: var(--watchlist-width);
    min-width: var(--watchlist-width);

    display: flex;
    flex-direction: column;

    overflow: hidden;

    background: var(--tv-panel);

    border-left: 1px solid var(--tv-border-strong);
}


.right-sidebar-header {

    height: 49px;

    display: flex;
    align-items: center;

    padding: 0 12px;

    border-bottom: 1px solid var(--tv-border);
}


.sidebar-title {

    display: block;

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

    color: #e2e5eb;
}


.sidebar-subtitle {

    display: block;

    margin-top: 2px;

    font-size: 9px;

    color: var(--tv-text-dim);
}



/* =========================================================
   WATCHLIST
   ========================================================= */

.watchlist {

    flex: 1;

    min-height: 0;

    display: flex;
    flex-direction: column;
}


.watchlist-header {

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

    padding: 8px 10px;

    border-bottom: 1px solid var(--tv-border);
}


.watchlist-header h2 {

    margin: 0;

    font-size: 10px;

    font-weight: 600;

    color: var(--tv-text-muted);

    text-transform: uppercase;

    letter-spacing: .05em;
}


.watchlist-add {

    width: 26px;
    height: 26px;

    border: none;

    border-radius: 4px;

    background: transparent;

    color: var(--tv-text-muted);
}


.watchlist-add:hover {

    color: #fff;

    background: var(--tv-panel-hover);
}


.watchlist-cols {

    display: grid;

    grid-template-columns: 1fr auto auto;

    gap: 7px;

    padding: 6px 9px;

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

    color: var(--tv-text-dim);

    font-size: 9px;

    text-transform: uppercase;
}


.watchlist-cols span:not(:first-child) {

    text-align: right;
}


.watchlist-rows {

    flex: 1;

    overflow-y: auto;
}


.watchlist-row {

    display: grid;

    grid-template-columns: 1fr auto auto;

    align-items: center;

    gap: 7px;

    min-height: 38px;

    padding: 5px 9px;

    border-bottom: 1px solid rgba(42,46,57,.42);

    font-size: 11px;

    cursor: pointer;
}


.watchlist-row:hover {

    background: #1f2430;
}


.watchlist-row.active {

    background: #252a36;

    box-shadow:
        inset 2px 0 0 var(--tv-blue);
}


.watchlist-row .wl-symbol {

    display: flex;
    align-items: center;

    gap: 5px;
}


.watchlist-row .wl-base {

    color: #e4e7ed;

    font-weight: 600;
}


.watchlist-row .wl-quote {

    color: var(--tv-text-dim);

    font-size: 9px;
}


.watchlist-row .wl-price {

    color: #d6d9df;

    text-align: right;
}


.watchlist-row .wl-pct-wrap {

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

    gap: 3px;
}


.watchlist-row .wl-remove {

    visibility: hidden;

    border: none;

    background: transparent;

    color: var(--tv-text-dim);
}


.watchlist-row:hover .wl-remove {

    visibility: visible;
}


.watchlist-row .wl-remove:hover {

    color: var(--tv-red);
}



/* =========================================================
   TOP OVERLAY
   ========================================================= */

.top-overlay {

    position: absolute;

    top: 10px;
    left: 10px;

    z-index: 20;

    display: flex;
    flex-direction: column;

    gap: 4px;

    max-width: calc(100% - 80px);

    pointer-events: none;
}


.top-overlay .row {

    min-height: 19px;

    display: flex;
    align-items: center;

    gap: 10px;

    white-space: nowrap;
}


.top-overlay .row-symbol {

    display: flex;
    align-items: center;

    gap: 6px;

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

    color: #f1f3f6;
}


.top-overlay .row-price {

    height: 25px;

    display: flex;
    align-items: center;

    gap: 7px;
}


.top-overlay .price-big {

    font-size: 17px;

    font-weight: 650;
}


/* =========================================================
   INDICADORES SOBRE EL GRÁFICO
   ESTILO TRADINGVIEW
   ========================================================= */

.indicator-row {

    pointer-events: auto;

    min-height: 22px;

    width: fit-content;
    max-width: 100%;

    display: flex;
    align-items: center;

    gap: 6px;

    padding: 1px 4px;

    border-radius: 3px;

    background: transparent;

    color: var(--tv-text-muted);

    font-size: 10px;

    transition:
        background .12s ease,
        color .12s ease;

    cursor: pointer;
}


.indicator-row:hover,
.indicator-row.expanded {

    background: rgba(30, 34, 45, 0.92);

    color: var(--tv-text);
}


.indicator-row.dimmed {

    opacity: .45;
}


.indicator-row-main {

    min-width: 0;

    display: flex;
    align-items: center;

    gap: 5px;
}


.indicator-row-dot {

    width: 6px;
    height: 6px;

    flex-shrink: 0;

    border-radius: 50%;
}


.indicator-row-name {

    color: var(--tv-text);

    font-weight: 500;

    white-space: nowrap;
}


.indicator-row-value {

    color: var(--tv-text-muted);

    white-space: nowrap;
}


.indicator-row-actions {

    display: flex;
    align-items: center;

    gap: 1px;

    opacity: 0;

    pointer-events: none;

    transition: opacity .12s ease;
}


.indicator-row:hover .indicator-row-actions,
.indicator-row.expanded .indicator-row-actions {

    opacity: 1;

    pointer-events: auto;
}


.indicator-action {

    width: 20px;
    height: 20px;

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

    padding: 0;

    border: none;

    border-radius: 3px;

    background: transparent;

    color: #777b86;

    font-size: 9px;
}


.indicator-action:hover {

    background: var(--tv-panel-hover);

    color: #ffffff;
}


.indicator-action.danger:hover {

    color: var(--tv-red);
}

@media (max-width: 768px) {

    .top-overlay {

        top: 5px;
        left: 5px;

        gap: 0;

        max-width: calc(100% - 55px);
    }


    .indicator-row {

        min-height: 20px;

        max-width: calc(100vw - 95px);

        padding: 0 3px;

        gap: 3px;

        font-size: 8px;
    }


    .indicator-row-name {

        max-width: 130px;

        overflow: hidden;

        text-overflow: ellipsis;
    }


    .indicator-row-value {

        font-size: 8px;
    }


    /*
       En mobile los controles quedan ocultos.
       Tocás la fila y recién aparecen.
    */
    .indicator-row-actions {

        display: none;

        opacity: 1;
    }


    .indicator-row.expanded .indicator-row-actions {

        display: flex;
    }


    .indicator-action {

        width: 24px;
        height: 24px;

        font-size: 10px;
    }
}


/* =========================================================
   LUX STATS
   ========================================================= */

.stats-panel {

    pointer-events: auto;

    width: 210px;

    margin-top: 4px;

    overflow: hidden;

    border: 1px solid #343945;

    border-radius: 5px;

    background: rgba(23,27,38,.91);

    backdrop-filter: blur(7px);

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

    padding: 7px;

    font-size: 10px;
}


.stats-panel .stats-title {

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

    margin-bottom: 5px;

    padding-bottom: 5px;

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

    color: #f2f4f7;

    font-weight: 650;
}


.stats-panel .stats-row {

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

    min-height: 17px;

    color: var(--tv-text-muted);
}


.stats-panel .stats-pnl,
.stats-panel .stats-trade,
.stats-panel .stats-retest {

    margin-top: 4px;

    padding-top: 4px;

    border-top: 1px solid var(--tv-border);
}



/* =========================================================
   PANE OVERLAY
   ========================================================= */

.pane-overlay {

    position: absolute;

    left: 10px;

    z-index: 18;

    pointer-events: none;
}


.pane-label {

    position: absolute;

    left: 0;

    pointer-events: none;
}



/* =========================================================
   DRAWING / MEASURE
   ========================================================= */

.measure-svg {

    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    z-index: 30;

    pointer-events: none;

    overflow: visible;
}


.measure-label {

    position: absolute;

    z-index: 31;

    transform: translateX(-50%);

    padding: 5px 8px;

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

    border-radius: 5px;

    background: rgba(17,21,30,.94);

    color: #fff;

    box-shadow:
        0 3px 10px rgba(0,0,0,.35);

    font-size: 10px;

    line-height: 1.35;

    text-align: center;

    white-space: nowrap;

    pointer-events: none;
}



/* =========================================================
   BOTTOM PANEL
   ========================================================= */

.bottom-panel {

    height: var(--bottom-height);
    min-height: var(--bottom-height);

    display: flex;
    align-items: center;

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

    padding: 0 9px;

    background: var(--tv-panel);

    border-top: 1px solid var(--tv-border-strong);

    color: var(--tv-text-muted);

    white-space: nowrap;

    font-size: 10px;
}


.bp-stat {

    height: 100%;

    display: flex;
    align-items: center;

    gap: 5px;

    padding: 0 9px;

    border-right: 1px solid var(--tv-border);

    flex-shrink: 0;
}


.bp-stat:first-child {

    padding-left: 1px;
}


.bp-stat .bp-label {

    color: var(--tv-text-dim);
}


.bp-stat .bp-value {

    color: #c8cbd2;

    font-weight: 500;
}


.bp-live {

    margin-left: auto;

    min-width: max-content;

    display: flex;
    align-items: center;

    gap: 5px;

    padding-left: 12px;

    color: var(--tv-text-dim);

    font-size: 9px;
}


.bp-live .dot {

    width: 6px;
    height: 6px;

    border-radius: 50%;

    background: var(--tv-green);

    box-shadow:
        0 0 6px rgba(38,166,154,.55);
}



/* =========================================================
   DROPDOWN INDICATORS
   ========================================================= */

.dropdown {

    position: relative;
}


.dropdown-content {

    display: none;

    position: absolute;

    top: 39px;
    left: 0;

    z-index: 500;

    width: 285px;

    max-height: 70vh;

    overflow-y: auto;

    padding: 5px;

    border: 1px solid #363b48;

    border-radius: 6px;

    background: #1b1f2a;

    box-shadow:
        0 10px 30px rgba(0,0,0,.48);
}


.dropdown-content.open {

    display: block;
}


.dropdown-label {

    padding: 7px 8px 3px;

    color: var(--tv-text-dim);

    font-size: 9px;

    font-weight: 650;

    text-transform: uppercase;

    letter-spacing: .07em;
}


.dropdown-sep {

    height: 1px;

    margin: 4px 0;

    background: var(--tv-border);
}


.dropdown-item {

    min-height: 34px;

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

    padding: 6px 8px;

    border-radius: 4px;

    color: #d8dbe1;

    font-size: 11px;

    cursor: pointer;
}


.dropdown-item:hover {

    background: #282d39;
}


.dropdown-check {

    color: #6e91ff;

    font-weight: 700;
}



/* =========================================================
   DIALOGS
   ========================================================= */

.dialog-overlay {

    position: fixed;

    inset: 0;

    z-index: 10000;

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

    padding: 12px;

    background: rgba(4,7,12,.72);

    backdrop-filter: blur(3px);
}


.dialog {

    width: 430px;

    max-width: 94vw;
    max-height: 86vh;

    display: flex;
    flex-direction: column;

    overflow: hidden;

    border: 1px solid #3b414e;

    border-radius: 8px;

    background: #1b1f2a;

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


.settings-dialog {

    width: 490px;
}


.dialog-header {

    min-height: 57px;

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

    padding: 9px 14px;

    border-bottom: 1px solid var(--tv-border);
}


.dialog-title {

    color: #f2f4f8;

    font-size: 13px;

    font-weight: 650;
}


.dialog-subtitle {

    margin-top: 2px;

    color: var(--tv-text-dim);

    font-size: 9px;
}


.dialog-close {

    width: 30px;
    height: 30px;

    border: none;

    border-radius: 5px;

    background: transparent;

    color: var(--tv-text-muted);

    font-size: 13px;
}


.dialog-close:hover {

    background: var(--tv-panel-hover);

    color: #fff;
}



/* =========================================================
   SEARCH
   ========================================================= */

.dialog-search {

    position: relative;

    padding: 10px 12px;

    border-bottom: 1px solid var(--tv-border);
}


.search-icon {

    position: absolute;

    top: 50%;
    left: 23px;

    transform: translateY(-50%);

    color: var(--tv-text-dim);

    font-size: 14px;

    pointer-events: none;
}


.dialog-search input {

    width: 100%;

    height: 38px;

    padding: 0 10px 0 32px;

    border: 1px solid #343a47;

    border-radius: 5px;

    outline: none;

    background: #11151e;

    color: #e4e7ed;

    font-size: 12px;
}


.dialog-search input:focus {

    border-color: var(--tv-blue);

    box-shadow:
        0 0 0 1px rgba(41,98,255,.18);
}



/* =========================================================
   SYMBOL LIST
   ========================================================= */

.dialog-list {

    min-height: 120px;
    max-height: 430px;

    overflow-y: auto;
}


.symbol-row {

    min-height: 40px;

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

    padding: 6px 13px;

    border-bottom: 1px solid rgba(42,46,57,.5);

    cursor: pointer;
}


.symbol-row:hover {

    background: #252a35;
}


.symbol-row.active {

    background: rgba(41,98,255,.09);

    box-shadow:
        inset 2px 0 0 var(--tv-blue);
}


.symbol-row .base {

    color: #e7e9ed;

    font-weight: 650;
}


.symbol-row .quote,
.symbol-row .full {

    color: var(--tv-text-muted);

    font-size: 10px;
}



/* =========================================================
   SETTINGS
   ========================================================= */

.dialog-body {

    flex: 1;

    min-height: 0;

    display: flex;
    flex-direction: column;

    gap: 10px;

    overflow-y: auto;

    padding: 12px 14px 20px;
}


.field {

    display: flex;
    flex-direction: column;

    gap: 4px;

    min-width: 0;
}


.field label {

    color: var(--tv-text-muted);

    font-size: 10px;
}


.field input,
.field select {

    width: 100%;

    height: 34px;

    padding: 0 8px;

    border: 1px solid #343a47;

    border-radius: 4px;

    outline: none;

    background: #11151e;

    color: #e2e5ea;

    font-size: 11px;
}


.field input:focus,
.field select:focus {

    border-color: var(--tv-blue);
}


.field-row {

    display: flex;

    gap: 8px;
}


.field-row .field {

    flex: 1;
}


.checkbox-field {

    min-height: 30px;

    display: flex;
    align-items: center;

    gap: 7px;

    color: #d7dae0;

    font-size: 11px;
}


.checkbox-field input {

    width: 15px;
    height: 15px;

    accent-color: var(--tv-blue);
}


.settings-section-title {

    margin-top: 5px;

    padding-top: 9px;

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

    color: #757a87;

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

    text-transform: uppercase;

    letter-spacing: .07em;
}


.settings-hint {

    color: var(--tv-text-dim);

    font-size: 9px;

    line-height: 1.4;
}



/* =========================================================
   COLORS
   ========================================================= */

.text-green {

    color: var(--tv-green);
}

.text-red {

    color: var(--tv-red);
}

.text-blue {

    color: #5f86ff;
}

.text-yellow {

    color: var(--tv-yellow);
}

.muted {

    color: var(--tv-text-muted);
}



/* =========================================================
   REPLAY TOOLBAR
   ========================================================= */

.replay-toolbar {

    position: fixed !important;

    left: 50% !important;

    bottom: 42px !important;

    transform: translateX(-50%) !important;

    z-index: 15000 !important;

    display: flex;

    align-items: center;

    gap: 5px;

    max-width: calc(100vw - 30px);

    padding: 6px;

    overflow-x: auto;

    border: 1px solid #3a404e;

    border-radius: 7px;

    background: rgba(23,27,38,.96);

    box-shadow:
        0 8px 25px rgba(0,0,0,.45);

    backdrop-filter: blur(8px);
}


.replay-btn {

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

    padding: 0 8px;

    flex-shrink: 0;

    border: 1px solid #343a47;

    border-radius: 4px;

    background: #1e232e;

    color: #dce0e7;

    font-size: 10px;
}


.replay-btn:hover {

    background: #292f3b;
}


.replay-btn.primary {

    border-color: var(--tv-blue);

    background: var(--tv-blue);

    color: #fff;
}


.replay-btn.danger:hover {

    border-color: rgba(239,83,80,.4);

    background: rgba(239,83,80,.12);

    color: var(--tv-red);
}


.replay-info {

    padding: 0 4px;

    color: var(--tv-text-muted);

    font-size: 10px;

    white-space: nowrap;
}



/* =========================================================
   BOTÓN REPLAY
   ========================================================= */

#activate-replay-btn {

    transition:
        background .15s,
        color .15s;
}



/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {

    :root {

        --header-height: 44px;

        --toolbar-width: 38px;

        --bottom-height: 30px;
    }


    html,
    body {

        overflow: hidden;

        overscroll-behavior: none;
    }


    /* HEADER */

    .header {

        height: var(--header-height);
        min-height: var(--header-height);

        justify-content: flex-start;

        padding: 0 4px;

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

        scrollbar-width: none;
    }


    .header::-webkit-scrollbar {

        display: none;
    }


    .header-left,
    .header-right {

        flex-shrink: 0;
    }


    .header-right {

        margin-left: 3px;
    }


    .brand {

        gap: 5px;

        padding-right: 2px;
    }


    .brand-icon {

        width: 29px;
        height: 29px;
    }


    .brand-main {

        font-size: 11px;
    }


    .brand-lux {

        display: none;
    }


    .header-divider {

        height: 21px;

        margin: 0 2px;
    }


    .header-control {

        min-height: 30px;

        padding: 0 6px;

        gap: 3px;

        font-size: 10px;
    }


    .symbol-label {

        font-size: 10px;
    }


    .control-icon {

        font-size: 12px;
    }


    .market-status {

        display: none;
    }


    .whatsapp-text {

        display: none;
    }


    .whatsapp-link {

        width: 31px;

        padding: 0;
    }


    .whatsapp-dot {

        font-size: 15px;
    }


    /* TIMEFRAMES */

    .timeframe-selector {

        height: 30px;

        flex-shrink: 0;
    }


    .tf-btn {

        height: 25px;

        min-width: 28px;

        padding: 0 5px;

        font-size: 9px;
    }


    /* SIDEBAR */

    .left-sidebar {

        width: var(--toolbar-width);
        min-width: var(--toolbar-width);

        padding-top: 4px;

        scrollbar-width: none;
    }


    .left-sidebar::-webkit-scrollbar {

        display: none;
    }


    .tool-btn {

        width: 32px;
        height: 32px;

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

        font-size: 14px;
    }


    /* WATCHLIST */

    .right-sidebar {

        display: none;
    }


    /* CHART */

    .center-area {

        width: calc(100% - var(--toolbar-width));
    }


    .top-overlay {

        top: 5px;
        left: 5px;

        max-width: calc(100vw - 70px);

        gap: 2px;
    }


    .top-overlay .row {

        gap: 5px;

        min-height: 16px;
    }


    .top-overlay .row-symbol {

        font-size: 9px;
    }


    .top-overlay .price-big {

        font-size: 13px;
    }


    /* PILLS */

    .pill {

        min-height: 22px;

        max-width: calc(100vw - 85px);

        padding: 2px 4px;

        gap: 3px;

        font-size: 8px;
    }


    .pill-name {

        max-width: 110px;

        overflow: hidden;

        text-overflow: ellipsis;

        white-space: nowrap;
    }


    .pill-value {

        font-size: 8px;
    }


    .pill-actions button {

        width: 21px;
        height: 21px;

        font-size: 9px;
    }


    /* WINRATE LUX */

    .stats-panel {

        width: 142px;

        max-width: 39vw;

        max-height: 122px;

        padding: 4px 5px;

        overflow-y: auto;

        font-size: 7px;

        background: rgba(23,27,38,.83);
    }


    .stats-panel .stats-title {

        margin-bottom: 2px;

        padding-bottom: 2px;

        font-size: 8px;
    }


    .stats-panel .stats-row {

        min-height: 13px;

        font-size: 7px;
    }


    .stats-panel .stats-pnl,
    .stats-panel .stats-trade,
    .stats-panel .stats-retest {

        margin-top: 2px;

        padding-top: 2px;
    }


    /* BOTTOM */

    .bottom-panel {

        height: var(--bottom-height);
        min-height: var(--bottom-height);

        padding: 0 3px;

        scrollbar-width: none;
    }


    .bottom-panel::-webkit-scrollbar {

        display: none;
    }


    .bp-stat {

        padding: 0 6px;

        gap: 3px;

        font-size: 8px;
    }


    .bp-live {

        margin-left: 5px;

        padding-right: 5px;

        font-size: 8px;
    }


    /* INDICATORS DROPDOWN */

    .dropdown-content {

        position: fixed;

        top: 46px;

        left: 5px;
        right: 5px;

        width: auto;

        max-height: calc(100dvh - 95px);

        z-index: 20000;
    }


    .dropdown-item {

        min-height: 40px;

        padding: 8px 9px;

        font-size: 11px;
    }


    /* DIALOGS */

    .dialog-overlay {

        padding: 6px;
    }


    .dialog {

        width: 100%;

        max-width: 100%;

        max-height: calc(100dvh - 12px);
    }


    .settings-dialog {

        width: 100%;
    }


    .dialog-header {

        min-height: 48px;

        padding: 7px 10px;

        flex-shrink: 0;
    }


    .dialog-body {

        flex: 1;

        min-height: 0;

        overflow-y: auto;

        padding: 9px 10px 22px;
    }


    .dialog-list {

        flex: 1;

        max-height: none;
    }


    .field-row {

        display: grid;

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

        gap: 7px;
    }


    .field input,
    .field select {

        height: 38px;

        font-size: 13px;
    }


    .checkbox-field input {

        width: 17px;
        height: 17px;
    }


    /* REPLAY PRINCIPAL */

    #activate-replay-btn {

        position: fixed;

        right: 7px;
        bottom: 35px;

        z-index: 14500;

        height: 36px;

        min-width: 42px;

        padding: 0 8px;

        border: 1px solid #3a404e;

        border-radius: 6px;

        background: rgba(23,27,38,.96);

        color: #fff;

        box-shadow:
            0 4px 14px rgba(0,0,0,.45);
    }


    /* REPLAY TOOLBAR */

    .replay-toolbar {

        left: 43px !important;

        right: 5px !important;

        bottom: 35px !important;

        width: auto !important;

        max-width: none !important;

        transform: none !important;

        justify-content: flex-start !important;

        gap: 4px;

        padding: 5px;

        overflow-x: auto;
    }


    .replay-btn {

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

        padding: 0 7px;

        font-size: 9px;
    }


    .replay-info {

        max-width: 100px;

        overflow: hidden;

        text-overflow: ellipsis;

        font-size: 8px;
    }


    .measure-label {

        max-width: 170px;

        white-space: normal;

        font-size: 8px;
    }

}



/* =========================================================
   MOBILE PEQUEÑO
   ========================================================= */

@media (max-width: 480px) {

    .brand-main {

        font-size: 10px;
    }


    .brand-icon {

        width: 27px;
        height: 27px;
    }


    .header-control {

        padding: 0 5px;

        font-size: 9px;
    }


    .indicator-button span:not(.control-icon):not(.badge) {

        display: none;
    }


    .indicator-button {

        width: 31px;

        padding: 0;
    }


    .stats-panel {

        width: 120px;

        max-width: 35vw;

        max-height: 98px;

        font-size: 6.5px;
    }


    .stats-panel .stats-row {

        min-height: 12px;

        font-size: 6.5px;
    }


    .pill-name {

        max-width: 90px;
    }


    .field-row {

        grid-template-columns: 1fr;
    }


    #activate-replay-btn {

        right: 5px;

        bottom: 33px;
    }


    .replay-toolbar {

        left: 41px !important;

        right: 4px !important;

        bottom: 33px !important;
    }

}



/* =========================================================
   MOBILE HORIZONTAL
   ========================================================= */

@media
(max-height: 520px)
and (orientation: landscape) {

    :root {

        --header-height: 39px;

        --bottom-height: 27px;
    }


    .brand-icon {

        width: 25px;
        height: 25px;
    }


    .tool-btn {

        width: 29px;
        height: 29px;

        min-height: 29px;
    }


    .stats-panel {

        max-height: 88px;
    }


    .dialog {

        max-height: calc(100dvh - 8px);
    }


    #activate-replay-btn {

        bottom: 30px;
    }


    .replay-toolbar {

        bottom: 30px !important;
    }

}

/* =========================================================
   TRADING DEMO - BINANCE/BINGX STYLE
   ========================================================= */

.sim-trading-btn { border-color: rgba(41,98,255,.22); background: rgba(41,98,255,.08); }
.sim-trading-btn:hover { background: rgba(41,98,255,.16); }

.sim-trading-panel {
    position: fixed;
    top: var(--header-height, 48px);
    right: 0;
    bottom: 0;
    z-index: 12000;
    width: 340px;
    max-width: calc(100vw - 46px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transform: translateX(102%);
    transition: transform .2s ease;
    background: #171b26;
    border-left: 1px solid #363c4a;
    box-shadow: -12px 0 32px rgba(0,0,0,.35);
    color: var(--tv-text);
}
.sim-trading-panel.open { transform: translateX(0); }

.sim-panel-head {
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 11px;
    border-bottom: 1px solid var(--tv-border);
}
.sim-panel-head strong { display:block; color:#fff; font-size:13px; }
.sim-panel-head small { display:block; margin-top:2px; color:var(--tv-text-dim); font-size:9px; }
.sim-icon-btn {
    width:30px;height:30px;border:0;border-radius:5px;background:transparent;color:var(--tv-text-muted);
}
.sim-icon-btn:hover { background:var(--tv-panel-hover); color:#fff; }

.sim-account {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:1px;
    background:var(--tv-border);
    border-bottom:1px solid var(--tv-border);
}
.sim-account > div { padding:8px 7px; background:#151923; min-width:0; }
.sim-account span { display:block; color:var(--tv-text-dim); font-size:8px; }
.sim-account b { display:block; margin-top:3px; color:#e7e9ee; font-size:10px; overflow:hidden; text-overflow:ellipsis; }

.sim-side-tabs, .sim-type-tabs {
    display:grid;
    gap:4px;
    padding:8px 10px 0;
}
.sim-side-tabs { grid-template-columns:1fr 1fr; }
.sim-type-tabs { grid-template-columns:1fr 1fr; padding-top:6px; }
.sim-side, .sim-type {
    height:32px;
    border:1px solid var(--tv-border);
    border-radius:5px;
    background:#11151e;
    color:var(--tv-text-muted);
    font-size:11px;
    font-weight:650;
}
.sim-side.long.active { background:rgba(38,166,154,.16); border-color:rgba(38,166,154,.55); color:#4cd4c5; }
.sim-side.short.active { background:rgba(239,83,80,.14); border-color:rgba(239,83,80,.55); color:#ff7471; }
.sim-type.active { background:#252a36; color:#fff; border-color:#414756; }

.sim-order-form {
    padding:8px 10px 10px;
    overflow-y:auto;
    border-bottom:1px solid var(--tv-border);
}
.sim-field { display:flex; flex-direction:column; gap:4px; margin-bottom:8px; }
.sim-field > span { display:flex; justify-content:space-between; color:var(--tv-text-muted); font-size:9px; }
.sim-field input {
    width:100%;
    height:34px;
    padding:0 9px;
    border:1px solid #343a47;
    border-radius:4px;
    outline:none;
    background:#0f131b;
    color:#e5e8ed;
    font-size:11px;
}
.sim-field input:focus { border-color:var(--tv-blue); }
.sim-field input[type="range"] { height:24px; padding:0; accent-color:var(--tv-blue); }

.sim-lev-presets {
    display:grid;
    grid-template-columns:repeat(7,1fr);
    gap:3px;
    margin:-2px 0 8px;
}
.sim-lev-presets button {
    height:25px;
    padding:0;
    border:1px solid var(--tv-border);
    border-radius:4px;
    background:#11151e;
    color:var(--tv-text-muted);
    font-size:8px;
}
.sim-lev-presets button:hover { color:#fff; background:var(--tv-panel-hover); }

.sim-order-summary {
    padding:7px;
    margin-bottom:8px;
    border:1px solid var(--tv-border);
    border-radius:5px;
    background:#121620;
}
.sim-order-summary > div {
    display:flex; align-items:center; justify-content:space-between;
    min-height:19px; color:var(--tv-text-dim); font-size:9px;
}
.sim-order-summary b { color:#cfd3da; font-weight:550; }

.sim-submit {
    width:100%; height:38px;
    border:0; border-radius:5px;
    color:#fff; font-size:11px; font-weight:750;
}
.sim-submit.long { background:#089981; }
.sim-submit.long:hover { background:#0bad92; }
.sim-submit.short { background:#f23645; }
.sim-submit.short:hover { background:#ff4655; }
.sim-error { min-height:16px; padding-top:5px; color:#ff6b6b; font-size:9px; }

.sim-tabs {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    border-bottom:1px solid var(--tv-border);
}
.sim-tabs button {
    height:34px; border:0; border-bottom:2px solid transparent;
    background:#151923; color:var(--tv-text-dim); font-size:9px;
}
.sim-tabs button.active { color:#fff; border-bottom-color:var(--tv-blue); background:#1b202b; }
.sim-tabs span { color:var(--tv-blue); }

.sim-tab-content { flex:1; min-height:100px; overflow-y:auto; padding:7px; background:#11151e; }
.sim-empty { padding:24px 8px; text-align:center; color:var(--tv-text-dim); font-size:10px; }

.sim-card {
    margin-bottom:6px; padding:8px;
    border:1px solid var(--tv-border); border-radius:5px;
    background:#181d28;
}
.sim-card-head { display:flex; align-items:center; justify-content:space-between; gap:6px; font-size:9px; }
.sim-card-head strong { color:#fff; }
.sim-card-head span { color:var(--tv-text-dim); }
.sim-card-head small { color:var(--tv-text-dim); }
.long-text { color:#26a69a; }
.short-text { color:#ef5350; }
.sim-card-close {
    border:1px solid #3b414f; border-radius:4px; background:#202531;
    color:#cfd2d8; padding:4px 7px; font-size:8px;
}
.sim-card-close:hover { color:#fff; border-color:#596171; }

.sim-pnl { margin:7px 0; font-size:15px; font-weight:700; }
.sim-pnl small { margin-left:5px; font-size:9px; font-weight:500; }
.sim-pnl.positive { color:#26a69a; }
.sim-pnl.negative { color:#ef5350; }

.sim-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:5px 10px; }
.sim-grid span { color:var(--tv-text-dim); font-size:8px; }
.sim-grid b { display:block; margin-top:2px; color:#cfd3da; font-size:9px; }

.sim-reset-wrap { padding:7px; border-top:1px solid var(--tv-border); background:#151923; }
.sim-reset {
    width:100%; height:30px; border:1px solid #3b414d; border-radius:4px;
    background:transparent; color:var(--tv-text-muted); font-size:9px;
}
.sim-reset:hover { color:#ff7676; border-color:rgba(239,83,80,.4); background:rgba(239,83,80,.06); }

@media (max-width: 768px) {
    .sim-trading-text { display:none; }
    .sim-trading-btn { width:31px; padding:0; }
    .sim-trading-panel {
        top:auto;
        left:38px;
        right:0;
        bottom:0;
        width:auto;
        max-width:none;
        height:min(78dvh, 650px);
        transform:translateY(102%);
        border-left:1px solid var(--tv-border);
        border-top:1px solid #414756;
        border-radius:10px 10px 0 0;
        box-shadow:0 -14px 36px rgba(0,0,0,.45);
    }
    .sim-trading-panel.open { transform:translateY(0); }
    .sim-order-form { max-height:310px; }
    .sim-account b { font-size:9px; }
    .sim-lev-presets { grid-template-columns:repeat(4,1fr); }
}

@media (max-width: 480px) {
    .sim-trading-panel { left:36px; height:82dvh; }
    .sim-panel-head { min-height:48px; }
    .sim-account { grid-template-columns:1fr 1fr; }
    .sim-account > div:nth-child(3) { grid-column:1 / -1; }
    .sim-grid { grid-template-columns:1fr 1fr; }
}


/* =========================================================
   FIX V2 - INDICADORES + POSICIONES DEMO
   ========================================================= */

/* La barra de indicadores recibe clics por encima del canvas. */
.top-overlay {
    z-index: 80 !important;
}

.indicator-row {
    position: relative;
    z-index: 82;
    pointer-events: auto !important;
}

.indicator-row-main,
.indicator-row-name,
.indicator-row-value,
.indicator-row-dot {
    pointer-events: none;
}

.indicator-row-actions,
.indicator-action {
    pointer-events: auto;
}

/* Panel demo más grande y legible. */
.sim-trading-panel {
    width: 430px;
    max-width: min(430px, calc(100vw - var(--toolbar-width, 46px)));
}

.sim-panel-head {
    min-height: 62px;
    padding: 10px 14px;
}

.sim-panel-head strong {
    font-size: 15px;
}

.sim-panel-head small {
    font-size: 10px;
}

.sim-account > div {
    padding: 10px 9px;
}

.sim-account span {
    font-size: 9px;
}

.sim-account b {
    font-size: 12px;
}

.sim-side,
.sim-type {
    height: 38px;
    font-size: 12px;
}

.sim-order-form {
    padding: 12px 14px;
}

.sim-field > span {
    font-size: 10px;
}

.sim-field input {
    height: 39px;
    font-size: 12px;
}

.sim-order-summary > div {
    min-height: 23px;
    font-size: 10px;
}

.sim-submit {
    height: 44px;
    font-size: 13px;
}

/* Posición abierta más grande. */
.sim-position-card {
    padding: 12px;
    border-color: #3a414f;
}

.sim-position-title {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 11px;
}

.sim-position-title strong {
    font-size: 12px;
}

.sim-leverage-badge {
    padding: 2px 6px;
    border-radius: 4px;
    background: rgba(41,98,255,.14);
    color: #7d9cff !important;
}

.sim-position-card .sim-pnl {
    margin: 10px 0;
    font-size: 21px;
}

.sim-position-card .sim-pnl small {
    font-size: 11px;
}

.sim-position-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 9px 12px;
    padding: 9px 0;
    border-top: 1px solid var(--tv-border);
    border-bottom: 1px solid var(--tv-border);
}

.sim-position-grid span {
    font-size: 9px;
}

.sim-position-grid b {
    margin-top: 3px;
    font-size: 11px;
}

.sim-risk-editor {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin-top: 10px;
}

.sim-risk-editor label {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.sim-risk-editor label span {
    color: var(--tv-text-muted);
    font-size: 9px;
}

.sim-risk-editor input {
    width: 100%;
    height: 36px;
    padding: 0 8px;
    border: 1px solid #343a47;
    border-radius: 4px;
    outline: none;
    background: #0f131b;
    color: #fff;
    font-size: 11px;
}

.sim-risk-editor input:focus {
    border-color: var(--tv-blue);
}

.sim-save-risk {
    grid-column: 1 / -1;
    height: 34px;
    border: 1px solid #3e4655;
    border-radius: 4px;
    background: #252b37;
    color: #e2e5ea;
    font-size: 10px;
}

.sim-save-risk:hover {
    border-color: var(--tv-blue);
    background: rgba(41,98,255,.12);
    color: #fff;
}

.sim-position-hint {
    margin-top: 8px;
    padding: 7px 8px;
    border-radius: 4px;
    background: rgba(255,183,77,.07);
    color: #c5a46f;
    font-size: 9px;
    line-height: 1.35;
}

@media (max-width: 768px) {
    .sim-trading-panel {
        left: var(--toolbar-width, 38px);
        width: auto;
        max-width: none;
        height: 88dvh;
    }

    .sim-position-card {
        padding: 11px;
    }

    .sim-position-card .sim-pnl {
        font-size: 19px;
    }

    .sim-position-grid {
        grid-template-columns: 1fr 1fr;
    }

    .sim-risk-editor {
        grid-template-columns: 1fr 1fr;
    }

    .indicator-row-actions {
        position: relative;
        z-index: 90;
    }
}

@media (max-width: 480px) {
    .sim-trading-panel {
        left: var(--toolbar-width, 36px);
        height: 91dvh;
    }

    .sim-position-grid {
        grid-template-columns: 1fr 1fr;
    }

    .sim-risk-editor {
        grid-template-columns: 1fr;
    }

    .sim-save-risk {
        grid-column: 1;
    }
}

/* =========================================================
   V3 - PANEL DIVIDIDO AJUSTABLE / POSICIÓN PROTAGONISTA
   ========================================================= */

.sim-order-zone {
    flex: 0 0 38%;
    min-height: 145px;
    max-height: 68%;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    background: #171b26;
}

.sim-resize-handle {
    position: relative;
    flex: 0 0 14px;
    height: 14px;
    min-height: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: ns-resize;
    touch-action: none;
    background: #151923;
    border-top: 1px solid #303744;
    border-bottom: 1px solid #303744;
    z-index: 4;
}

.sim-resize-handle::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background: rgba(255, 193, 7, .28);
    transform: translateY(-50%);
}

.sim-resize-handle span {
    position: relative;
    z-index: 1;
    width: 54px;
    height: 4px;
    border-radius: 999px;
    background: #d7a914;
    box-shadow: 0 0 0 3px rgba(215,169,20,.08);
}

.sim-resize-handle:hover span,
.sim-resize-handle.dragging span {
    width: 72px;
    background: #ffd54a;
    box-shadow: 0 0 10px rgba(255,213,74,.28);
}

.sim-tabs {
    flex: 0 0 36px;
    min-height: 36px;
    position: relative;
    z-index: 3;
}

.sim-tab-content {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
}

/* Cuando la zona inferior está visible, la posición gana presencia. */
.sim-position-card {
    margin: 9px;
    padding: 14px 15px;
    border: 1px solid #434b5a;
    border-radius: 7px;
    background: linear-gradient(180deg, #1b202c 0%, #171c27 100%);
    box-shadow: 0 5px 16px rgba(0,0,0,.22);
}

.sim-position-card .sim-card-head {
    min-height: 31px;
}

.sim-position-title {
    gap: 9px;
}

.sim-position-title > b {
    font-size: 13px;
    letter-spacing: .02em;
}

.sim-position-title strong {
    font-size: 14px;
}

.sim-leverage-badge {
    font-size: 10px;
    padding: 3px 7px;
}

.sim-position-card .sim-card-close {
    min-height: 31px;
    padding: 0 10px;
    font-size: 9px;
}

.sim-position-card .sim-pnl {
    margin: 12px 0 10px;
    font-size: 26px;
    line-height: 1;
}

.sim-position-card .sim-pnl small {
    font-size: 11px;
    vertical-align: middle;
}

.sim-position-grid {
    padding: 11px 0;
}

.sim-position-grid span {
    font-size: 9px;
}

.sim-position-grid b {
    font-size: 12px;
}

.sim-risk-editor {
    margin-top: 12px;
    padding-top: 11px;
    border-top: 1px solid #303744;
}

.sim-risk-editor label span {
    font-size: 10px;
}

.sim-risk-editor input {
    height: 40px;
    font-size: 12px;
}

.sim-save-risk {
    height: 38px;
    font-size: 11px;
    font-weight: 650;
}

@media (max-width: 768px) {
    .sim-order-zone {
        min-height: 120px;
        max-height: 66%;
    }

    .sim-resize-handle {
        flex-basis: 18px;
        height: 18px;
        min-height: 18px;
    }

    .sim-resize-handle span {
        width: 68px;
        height: 5px;
    }

    .sim-position-card {
        margin: 7px;
        padding: 13px;
    }

    .sim-position-card .sim-pnl {
        font-size: 24px;
    }

    .sim-position-title > b {
        font-size: 12px;
    }

    .sim-position-title strong {
        font-size: 13px;
    }

    .sim-tab-content {
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 480px) {
    .sim-position-card .sim-pnl {
        font-size: 22px;
    }

    .sim-position-card {
        margin: 5px;
        padding: 11px;
    }
}


/* =========================================================
   V5 - OPERACIÓN DEMO VIVA EN EL GRÁFICO
   ========================================================= */

#measure-svg {
    overflow: visible;
}

@media (max-width: 768px) {
    #measure-svg text {
        font-size: 9px;
    }
}

@media (max-width: 480px) {
    #measure-svg text {
        font-size: 8px;
    }
}


/* =========================================================
   OPERACIONES LUX AUTO · CAPA PERSISTENTE
   ========================================================= */

.sim-trading-svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 54;
    pointer-events: none;
    overflow: hidden;
}


/* =========================================================
   V6 - OPERACIÓN ABIERTA SIEMPRE VISIBLE
   ========================================================= */

.measure-svg {
    z-index: 55 !important;
}

@media (max-width: 768px) {
    .measure-svg {
        z-index: 55 !important;
    }
}



/* =========================================================
   LUXCRIPTOS NAV INTEGRADO EN HEADER
   ========================================================= */

.lux-header-nav {
    height: 38px;

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

    padding: 4px 7px;

    background: rgba(15, 18, 27, 0.96);

    border: 1px solid rgba(212, 175, 55, 0.35);
    border-radius: 7px;

    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.3);
}

.lux-header-back {
    height: 28px;

    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;

    padding: 0 8px;

    border-radius: 5px;

    background: rgba(212, 175, 55, 0.10);

    border: 1px solid rgba(212, 175, 55, 0.28);

    color: #d4af37;

    text-decoration: none;

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

    transition: .15s ease;
}

.lux-header-back:hover {
    background: rgba(212, 175, 55, 0.22);
    border-color: #d4af37;
    color: #ffffff;
}

.lux-header-brand {
    display: flex;
    align-items: center;
    gap: 6px;
}

.lux-header-brand img {
    width: 28px;
    height: 28px;

    object-fit: cover;

    border-radius: 5px;

    border: 1px solid rgba(212, 175, 55, 0.35);
}

.lux-header-brand-text {
    display: flex;
    flex-direction: column;

    line-height: 1.05;
}

.lux-header-name {
    color: #ffffff;

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

    white-space: nowrap;
}

.lux-header-subtitle {
    color: #d4af37;

    font-size: 8px;
    font-weight: 600;

    text-transform: uppercase;
    letter-spacing: .5px;
}

.lux-header-user {
    max-width: 90px;

    padding-left: 7px;

    border-left: 1px solid rgba(255,255,255,.10);

    color: #8f95a3;

    font-size: 9px;

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


/* ================= MOBILE ================= */

.lux-back-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: #d4af37;

    font-size: 16px;
    line-height: 1;
    font-weight: 700;
}

.lux-back-text {
    display: inline-block;
}


@media (max-width: 768px) {

    .lux-header-nav {
        height: 34px;
        gap: 4px;
        padding: 3px 4px;
    }

    .lux-header-back {
        width: 32px;
        min-width: 32px;
        height: 28px;

        padding: 0;

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

    /* LA FLECHA SÍ SE MUESTRA */
    .lux-header-back .lux-back-arrow {
        display: inline-flex;
        color: #d4af37;
        font-size: 20px;
        line-height: 1;
    }

    /* OCULTAMOS ÚNICAMENTE LA PALABRA VOLVER */
    .lux-header-back .lux-back-text {
        display: none;
    }

    .lux-header-brand {
        gap: 4px;
    }

    .lux-header-brand img {
        width: 26px;
        height: 26px;
    }

    .lux-header-name {
        font-size: 9px;
    }

    .lux-header-subtitle {
        font-size: 7px;
    }

    .lux-header-user {
        display: none;
    }
}

/* =========================================================
   TOOLBAR EDICIÓN DE DIBUJOS
   Horizontal / diagonal
   NO reutilizar .replay-toolbar
   ========================================================= */

.drawing-edit-toolbar {
    position: fixed !important;

    top: calc(var(--header-height, 48px) + 10px) !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;

    transform: translateX(-50%) !important;

    z-index: 16000 !important;

    width: auto !important;
    min-width: 0 !important;
    max-width: calc(100vw - 90px) !important;
    height: 38px !important;
    min-height: 38px !important;

    display: none;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;

    gap: 5px;

    padding: 4px 6px !important;

    overflow: visible !important;

    border: 1px solid #363a45;
    border-radius: 7px;

    background: rgba(30, 34, 45, .97);

    box-shadow:
        0 5px 18px rgba(0,0,0,.42);

    color: #d1d4dc;

    white-space: nowrap;
}

.drawing-edit-title {
    max-width: 165px;

    overflow: hidden;
    text-overflow: ellipsis;

    color: #9da2ad;

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

    white-space: nowrap;
}

.drawing-edit-color {
    width: 38px !important;
    height: 28px !important;

    min-width: 38px !important;

    padding: 2px !important;

    border: 1px solid #454b59;
    border-radius: 4px;

    background: #171b26;

    cursor: pointer;
}

.drawing-edit-select {
    height: 28px !important;
    min-height: 28px !important;

    padding: 0 6px !important;

    border: 1px solid #454b59;
    border-radius: 4px;

    background: #171b26;
    color: #d1d4dc;

    font-size: 10px;

    outline: none;
}

.drawing-edit-width {
    width: 60px !important;
}

.drawing-edit-style {
    width: 88px !important;
}

.drawing-edit-delete {
    width: 29px !important;
    height: 29px !important;

    min-width: 29px !important;
    min-height: 29px !important;

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

    padding: 0 !important;

    border: 1px solid #454b59;
    border-radius: 5px;

    background: #202530;
    color: #9297a3;

    font-size: 12px;
}

.drawing-edit-delete:hover {
    border-color: rgba(239,83,80,.5);
    background: rgba(239,83,80,.14);
    color: #ef5350;
}


/* ================= MOBILE ================= */

@media (max-width: 768px) {

    .drawing-edit-toolbar {
        top: calc(var(--header-height, 48px) + 6px) !important;

        left: calc(var(--toolbar-width, 46px) + 5px) !important;
        right: 5px !important;

        transform: none !important;

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

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

        justify-content: flex-start;

        gap: 4px;

        padding: 3px 4px !important;

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

        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .drawing-edit-toolbar::-webkit-scrollbar {
        display: none;
    }

    .drawing-edit-title {
        display: none;
    }

    .drawing-edit-color {
        width: 34px !important;
        height: 27px !important;
        min-width: 34px !important;
        flex: 0 0 34px;
    }

    .drawing-edit-select {
        height: 27px !important;
        min-height: 27px !important;
        padding: 0 4px !important;
        font-size: 9px;
        flex: 0 0 auto;
    }

    .drawing-edit-width {
        width: 52px !important;
    }

    .drawing-edit-style {
        width: 76px !important;
    }

    .drawing-edit-delete {
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        min-height: 28px !important;
        flex: 0 0 28px;
    }
}


/* Mobile angosto */
@media (max-width: 420px) {

    .drawing-edit-toolbar {
        left: calc(var(--toolbar-width, 46px) + 3px) !important;
        right: 3px !important;
        gap: 3px;
        padding: 3px !important;
    }

    .drawing-edit-width {
        width: 49px !important;
    }

    .drawing-edit-style {
        width: 70px !important;
    }
}


/* MOBILE INTERACTION FIXES - LUXCRIPTOS */
button,select,input,.header-control,.tool-btn,.indicator-action,.dropdown-item{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
#indicator-menu,#indicator-menu-btn{position:relative;z-index:22010;pointer-events:auto}
.dropdown-content{pointer-events:auto}
#activate-replay-btn{display:inline-flex!important;align-items:center;justify-content:center;pointer-events:auto!important}
@media(max-width:768px){
#indicator-menu-btn{min-width:34px!important;width:34px!important;height:32px!important;flex:0 0 34px!important}
#indicator-menu-content.open{display:block!important;position:fixed!important;top:calc(var(--header-height,44px) + 3px)!important;left:4px!important;right:4px!important;width:auto!important;max-height:calc(100dvh - var(--header-height,44px) - var(--bottom-height,30px) - 12px)!important;overflow-y:auto!important;z-index:30000!important;box-shadow:0 12px 35px rgba(0,0,0,.62)!important}
#activate-replay-btn{position:fixed!important;right:7px!important;bottom:calc(var(--bottom-height,30px) + 7px)!important;top:auto!important;left:auto!important;z-index:26000!important;width:auto!important;min-width:48px!important;height:36px!important;padding:0 9px!important;border:1px solid #454b59!important;border-radius:7px!important;background:rgba(23,27,38,.98)!important;color:#fff!important;box-shadow:0 5px 18px rgba(0,0,0,.55)!important}
.dialog-overlay,.settings-dialog,.dropdown-content,.replay-toolbar,.drawing-edit-toolbar{pointer-events:auto!important}
}


/* =========================================================
   REPLAY INTEGRADO A TOOLBAR IZQUIERDA
   ========================================================= */
#activate-replay-btn.replay-tool-btn {
    position: static !important;
    inset: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 5px !important;
    box-shadow: none !important;
    font-size: 15px !important;
    flex: 0 0 auto !important;
}

#activate-replay-btn.replay-tool-btn:not(.active) {
    border-color: transparent !important;
    background: transparent !important;
    color: #9296a1 !important;
}

#activate-replay-btn.replay-tool-btn:hover {
    color: #fff !important;
    background: var(--tv-panel-hover) !important;
    border-color: rgba(255,255,255,.035) !important;
}

#activate-replay-btn.replay-tool-btn.active {
    color: #fff !important;
    background: var(--tv-blue) !important;
    border-color: #4d79ff !important;
}

@media (max-width: 768px) {
    #activate-replay-btn.replay-tool-btn {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        min-height: 32px !important;
        font-size: 14px !important;
    }
}


/* =========================================================
   INDICADORES — DROPDOWN FLOTANTE RESPONSIVE
   Se monta en BODY desde ui.js para escapar del overflow del header.
   ========================================================= */

#indicator-menu-content.dropdown-content {
    position: fixed !important;
    z-index: 40000 !important;

    display: none;

    width: 300px;
    max-width: calc(100vw - 16px);
    max-height: min(70vh, 560px);

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

    padding: 6px !important;

    border: 1px solid #3a4050 !important;
    border-radius: 8px !important;

    background: rgba(23, 27, 38, .995) !important;
    box-shadow: 0 16px 42px rgba(0, 0, 0, .62) !important;

    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;

    pointer-events: auto !important;
}

#indicator-menu-content.dropdown-content.open {
    display: block !important;
}

#indicator-menu-content .dropdown-label {
    position: sticky;
    top: -6px;
    z-index: 2;

    margin: 0 -2px 2px;
    padding: 8px 8px 5px !important;

    background: rgba(23, 27, 38, .995);

    font-size: 9px;
    letter-spacing: .04em;
}

#indicator-menu-content .dropdown-item {
    width: 100%;
    min-height: 36px;

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

    gap: 10px;

    padding: 7px 9px !important;
    margin: 1px 0;

    border-radius: 5px;

    font-size: 11px;
    line-height: 1.25;
}

#indicator-menu-content .dropdown-item > span:first-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#indicator-menu-btn {
    pointer-events: auto !important;
    touch-action: manipulation;
}

#indicator-menu-btn.active {
    background: var(--tv-panel-hover) !important;
    border-color: rgba(255,255,255,.08) !important;
}


/* MOBILE VERTICAL */
@media (max-width: 768px) and (orientation: portrait) {

    #indicator-menu-content.dropdown-content.open {
        top: calc(var(--header-height, 44px) + 5px) !important;
        left: calc(var(--toolbar-width, 38px) + 5px) !important;
        right: 5px !important;
        bottom: calc(var(--bottom-height, 30px) + 5px) !important;

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

        border-radius: 8px !important;
    }

    #indicator-menu-content .dropdown-item {
        min-height: 42px;
        padding: 9px 10px !important;
        font-size: 12px;
    }

    #indicator-menu-content .dropdown-label {
        padding-top: 10px !important;
        font-size: 10px;
    }
}


/* MOBILE HORIZONTAL */
@media (max-width: 932px) and (orientation: landscape) {

    #indicator-menu-content.dropdown-content.open {
        top: calc(var(--header-height, 39px) + 4px) !important;
        left: calc(var(--toolbar-width, 38px) + 5px) !important;
        right: auto !important;
        bottom: calc(var(--bottom-height, 27px) + 4px) !important;

        width: min(340px, calc(100vw - var(--toolbar-width, 38px) - 14px)) !important;
        max-width: none !important;
        max-height: none !important;

        padding: 4px !important;
    }

    #indicator-menu-content .dropdown-item {
        min-height: 34px;
        padding: 6px 8px !important;
        font-size: 10px;
    }

    #indicator-menu-content .dropdown-label {
        top: -4px;
        padding: 6px 7px 3px !important;
        font-size: 8px;
    }
}


/* =========================================================
   LUXCRIPTOS — LEYENDA COMPACTA ESTILO TRADINGVIEW
   ========================================================= */

.indicator-legend {
    margin-top: 3px;
    width: max-content;
    max-width: min(520px, calc(100vw - 110px));
    border: 1px solid rgba(255,255,255,.04);
    border-radius: 5px;
    background: rgba(19,23,34,.72);
    backdrop-filter: blur(3px);
    overflow: hidden;
    pointer-events: auto;
}

.indicator-legend-head {
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0 4px 0 7px;
    color: #787b86;
    font-size: 9px;
}

.indicator-legend-title {
    font-weight: 600;
}

.indicator-legend-toggle {
    width: 20px;
    height: 18px;
    border: 0;
    border-radius: 3px;
    background: transparent;
    color: #9297a3;
    font-size: 11px;
}

.indicator-legend-toggle:hover {
    background: rgba(255,255,255,.06);
    color: #fff;
}

.indicator-legend-rows {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 1px 3px 3px;
}

.indicator-legend.collapsed .indicator-legend-rows {
    display: none;
}

.indicator-legend .indicator-row {
    min-height: 20px !important;
    height: 20px;
    max-width: 430px;
    padding: 0 2px 0 4px !important;
    margin: 0 !important;
    border-radius: 3px;
    background: transparent !important;
}

.indicator-legend .indicator-row-main {
    min-width: 0;
    height: 20px;
    gap: 5px;
}

.indicator-legend .indicator-row-dot {
    width: 6px;
    height: 6px;
    min-width: 6px;
}

.indicator-legend .indicator-row-name {
    font-size: 9px;
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.indicator-legend .indicator-row-value {
    font-size: 9px;
}

.indicator-legend .indicator-row-actions {
    opacity: 1 !important;
    pointer-events: auto !important;
    position: static !important;
    display: flex !important;
    gap: 1px !important;
}

.indicator-legend .indicator-action {
    width: 20px !important;
    height: 18px !important;
    min-width: 20px !important;
    min-height: 18px !important;
    padding: 0 !important;
    font-size: 10px !important;
    opacity: .72;
}

.indicator-legend .indicator-action:hover {
    opacity: 1;
}

/* =========================================================
   TIPO DE GRÁFICO
   ========================================================= */

.chart-type-control {
    position: relative;
    flex-shrink: 0;
}

.chart-type-button {
    min-width: 84px;
}

.chart-type-menu {
    position: fixed !important;
    z-index: 41000 !important;
    display: none;
    width: 245px;
    max-width: calc(100vw - 16px);
    max-height: 70vh;
    overflow-y: auto;
    background: rgba(23,27,38,.995) !important;
    border: 1px solid #3a4050 !important;
    border-radius: 8px !important;
    box-shadow: 0 16px 42px rgba(0,0,0,.62) !important;
    pointer-events: auto !important;
}

.chart-type-menu.open {
    display: block !important;
}

/* =========================================================
   SLIDER AMARILLO — ÁREA TÁCTIL REAL
   ========================================================= */

.sim-resize-handle {
    touch-action: none !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    overscroll-behavior: none !important;
}

.sim-resize-handle::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -12px;
    bottom: -12px;
    z-index: 5;
    background: transparent;
}

html.sim-resizing,
html.sim-resizing body {
    overflow: hidden !important;
    overscroll-behavior: none !important;
    touch-action: none !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 768px) {
    .indicator-legend {
        max-width: calc(100vw - var(--toolbar-width, 38px) - 85px);
        background: rgba(19,23,34,.84);
    }

    .indicator-legend .indicator-row {
        max-width: calc(100vw - var(--toolbar-width, 38px) - 95px);
    }

    .indicator-legend .indicator-row-name {
        max-width: 100px;
    }

    .indicator-legend .indicator-row-value {
        display: none;
    }

    .indicator-legend .indicator-action {
        width: 24px !important;
        height: 22px !important;
        min-width: 24px !important;
        min-height: 22px !important;
    }

    .chart-type-button {
        min-width: 31px !important;
        width: 31px !important;
        padding: 0 !important;
    }

    .chart-type-button .chart-type-label,
    .chart-type-button .chev {
        display: none;
    }

    .chart-type-menu.open {
        top: calc(var(--header-height, 44px) + 5px) !important;
        left: calc(var(--toolbar-width, 38px) + 5px) !important;
        right: 5px !important;
        width: auto !important;
        max-width: none !important;
    }
.sim-resize-handle {
        flex-basis: 26px !important;
        height: 26px !important;
        min-height: 26px !important;
        z-index: 30 !important;
    }

    .sim-resize-handle span {
        width: 82px !important;
        height: 6px !important;
        box-shadow: 0 0 0 5px rgba(215,169,20,.11) !important;
    }
}


/* =========================================================
   V5 VERIFICADO — DIVISOR OPERACIONES MOVIBLE
   ========================================================= */

.sim-trading-panel {
    display: flex !important;
    flex-direction: column !important;
}

.sim-order-zone {
    flex: 0 0 var(--sim-order-height, 320px) !important;
    flex-basis: var(--sim-order-height, 320px) !important;
    height: var(--sim-order-height, 320px) !important;

    min-height: 0 !important;
    max-height: none !important;

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

.sim-order-form {
    max-height: none !important;
    overflow-y: visible !important;
}

.sim-resize-handle {
    position: relative !important;

    flex: 0 0 30px !important;
    flex-basis: 30px !important;

    width: 100% !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;

    cursor: ns-resize !important;
    touch-action: none !important;
    user-select: none !important;
    -webkit-user-select: none !important;

    background: #151923 !important;
    border-top: 1px solid #3b424f !important;
    border-bottom: 1px solid #3b424f !important;

    z-index: 20000 !important;
    pointer-events: auto !important;
}

.sim-resize-handle span {
    width: 82px !important;
    height: 6px !important;
    min-width: 82px !important;

    border-radius: 999px !important;
    background: #ffd21f !important;

    box-shadow:
        0 0 0 4px rgba(255,210,31,.10),
        0 0 10px rgba(255,210,31,.20) !important;

    pointer-events: none !important;
}

.sim-resize-handle small {
    color: #d7a914 !important;
    font-size: 8px !important;
    font-weight: 700 !important;
    letter-spacing: .04em !important;
    pointer-events: none !important;
}

.sim-resize-handle::before,
.sim-resize-handle::after {
    pointer-events: none !important;
}

.sim-resize-handle:hover,
.sim-resize-handle.dragging {
    background: rgba(255,210,31,.06) !important;
}

.sim-resize-handle.dragging span {
    width: 112px !important;
    background: #ffe36a !important;
    box-shadow:
        0 0 0 5px rgba(255,227,106,.12),
        0 0 16px rgba(255,227,106,.38) !important;
}

.sim-tabs {
    flex: 0 0 36px !important;
}

.sim-tab-content {
    flex: 1 1 auto !important;
    min-height: 80px !important;
    overflow-y: auto !important;
}

.sim-reset-wrap {
    flex: 0 0 auto !important;
}

.sim-panel-resizing .sim-order-zone,
.sim-panel-resizing .sim-tab-content {
    pointer-events: none !important;
}

html.sim-resizing,
html.sim-resizing body {
    cursor: ns-resize !important;
    user-select: none !important;
    -webkit-user-select: none !important;
    overscroll-behavior: none !important;
}

@media (max-width: 768px) {
    .sim-resize-handle {
        flex-basis: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
    }

    .sim-resize-handle span {
        width: 108px !important;
        height: 7px !important;
    }

    .sim-resize-handle small {
        font-size: 9px !important;
    }
}




/* Watchlist LuxCriptos - controles */
.watchlist-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 9px;
}

.watchlist-empty-add {
    border: 1px solid var(--tv-border);
    border-radius: 5px;
    background: var(--tv-panel-hover);
    color: var(--tv-text);
    padding: 6px 10px;
    font-size: 10px;
}

.watchlist-row.market-closed {
    opacity: .68;
}

@media (hover: none), (max-width: 768px) {
    .watchlist-row .wl-remove {
        visibility: visible !important;
        width: 22px;
        height: 22px;
        padding: 0;
    }
}


/* =========================================================
   LUX TRADING V7 — TOOLBAR PRO / TRADINGVIEW FEEL
   Solo presentación. No altera la lógica de dibujos.
   ========================================================= */
:root {
    --lux-tool-size: 36px;
    --lux-tv-blue: #2962ff;
    --lux-tv-blue-soft: rgba(41, 98, 255, .16);
    --lux-tv-hover: #252a36;
    --lux-tv-gold: #d4af37;
}

.left-sidebar {
    width: 48px;
    min-width: 48px;
    padding: 5px 5px 8px;
    gap: 1px;
    background: #171b26;
    border-right: 1px solid #2a2e39;
    box-shadow: 1px 0 0 rgba(255,255,255,.015);
}

.left-sidebar .tool-btn {
    position: relative;
    width: var(--lux-tool-size);
    height: var(--lux-tool-size);
    min-width: var(--lux-tool-size);
    min-height: var(--lux-tool-size);
    border: 1px solid transparent;
    border-radius: 5px;
    background: transparent;
    color: #a3a7b2;
    display: grid;
    place-items: center;
    padding: 0;
    box-shadow: none;
    isolation: isolate;
}

.left-sidebar .tool-btn:hover {
    color: #f2f4f8;
    background: #252a36;
    border-color: rgba(255,255,255,.04);
}

.left-sidebar .tool-btn.active {
    color: #ffffff;
    background: var(--lux-tv-blue);
    border-color: #4b78ff;
    box-shadow: 0 2px 8px rgba(41,98,255,.28);
}

.left-sidebar .tool-btn.active::after {
    content: "";
    position: absolute;
    left: -5px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    border-radius: 2px;
    background: #8aa6ff;
}

.left-sidebar .tool-btn.danger:hover {
    color: #ff7471;
    background: rgba(239,83,80,.11);
    border-color: rgba(239,83,80,.18);
}

.left-sidebar .tool-sep {
    width: 28px;
    height: 1px;
    margin: 4px auto;
    background: #2a2e39;
}

.lux-tool-icon {
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    pointer-events: none;
}

.lux-tool-icon svg {
    width: 19px;
    height: 19px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
    overflow: visible;
}

/* tooltip oscuro tipo TradingView */
.left-sidebar .tool-btn[title]::before {
    content: attr(title);
    position: absolute;
    left: calc(100% + 9px);
    top: 50%;
    transform: translateY(-50%) translateX(-3px);
    z-index: 20000;
    max-width: 210px;
    padding: 6px 8px;
    border: 1px solid #363c4a;
    border-radius: 5px;
    background: #1e222d;
    color: #e6e8ed;
    box-shadow: 0 5px 18px rgba(0,0,0,.38);
    font-size: 10px;
    font-weight: 500;
    line-height: 1.25;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .12s ease, transform .12s ease;
}

.left-sidebar .tool-btn[title]:hover::before {
    opacity: 1;
    visibility: visible;
    transform: translateY(-50%) translateX(0);
}

/* Header más sobrio: dorado solo marca LUX, azul para acciones de gráfico */
.header {
    background: #171b26;
    border-bottom-color: #2a2e39;
}

.lux-header-nav {
    background: #151922;
    border-color: rgba(212,175,55,.20);
    box-shadow: none;
}

.lux-header-back {
    background: transparent;
    border-color: transparent;
}

.lux-header-back:hover {
    background: #252a36;
    border-color: rgba(255,255,255,.04);
}

.header-control:focus-visible,
.tool-btn:focus-visible,
.tf-btn:focus-visible {
    outline: 2px solid rgba(41,98,255,.8);
    outline-offset: 1px;
}

/* Botón Trading Demo integrado al header */
#sim-trading-btn {
    border: 1px solid #303541;
    background: #1e222d;
    color: #e4e7ed;
}

#sim-trading-btn:hover {
    background: #252a36;
    border-color: #3b414f;
}

#sim-trading-btn .control-icon {
    color: #7c9cff;
}

@media (max-width: 768px) {
    :root { --lux-tool-size: 34px; }
    .left-sidebar {
        width: 44px;
        min-width: 44px;
        padding-left: 4px;
        padding-right: 4px;
    }
    .lux-tool-icon svg {
        width: 18px;
        height: 18px;
    }
    .left-sidebar .tool-btn[title]::before { display: none; }
}

/* =========================================================
   MOBILE — INPUTS SIN ZOOM / UI ESTABLE AL ABRIR TECLADO
   Evita el auto-zoom de iOS/Android en campos pequeños.
   ========================================================= */
@media (max-width: 768px) {
    html {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    /* Mantiene estable el área principal cuando aparece el teclado. */
    .app {
        height: 100vh;
        height: 100svh;
        min-height: 100svh;
        max-height: 100svh;
    }

    /* Todo campo editable debe quedar en 16px o más para evitar zoom automático. */
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
    textarea,
    select,
    .field input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
    .field select,
    .dialog-search input,
    .sim-field input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),
    .sim-trading-panel input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),
    .sim-trading-panel textarea,
    .sim-trading-panel select {
        font-size: 16px !important;
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
        transform: none !important;
        zoom: 1 !important;
        touch-action: manipulation;
    }

    /* El foco cambia borde, nunca tamaño, escala ni dimensiones. */
    input:focus,
    textarea:focus,
    select:focus {
        transform: none !important;
        scale: none !important;
        zoom: 1 !important;
    }

    /* Los controles que no escriben conservan su tamaño original. */
    input[type="checkbox"],
    input[type="radio"],
    input[type="range"],
    input[type="color"] {
        font-size: inherit;
        touch-action: manipulation;
    }

    /* Evita que los diálogos cambien de alto por el viewport dinámico. */
    .dialog {
        max-height: calc(100svh - 12px);
    }

    .dropdown-content {
        max-height: calc(100svh - 95px);
    }

    /* Panel Trading Demo estable mientras se escribe. */
    .sim-trading-panel {
        height: auto;
        max-height: calc(100svh - var(--header-height, 44px));
    }
}

@media (max-height: 520px) and (orientation: landscape) {
    .dialog {
        max-height: calc(100svh - 8px);
    }
}

/* =========================================================
   WATCHLIST COLAPSABLE · LUX
   ========================================================= */

.right-sidebar {
    position: relative;
    overflow: visible !important;
    transition:
        width .22s ease,
        min-width .22s ease,
        border-color .22s ease;
}

/* El contenido mantiene su propio recorte.
   Así la pestaña lateral sí puede sobresalir. */
.right-sidebar-header {
    flex: 0 0 auto;
    overflow: hidden;
}

.right-sidebar > .watchlist {
    min-width: 0;
    overflow: hidden;
}

.watchlist-collapse-btn {
    position: absolute;
    left: -24px;
    top: 50%;
    transform: translateY(-50%);

    width: 24px;
    height: 58px;

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

    padding: 0;
    border: 1px solid var(--tv-border-strong);
    border-right: 0;
    border-radius: 8px 0 0 8px;

    background: var(--tv-panel);
    color: var(--tv-text-muted);

    font-size: 19px;
    font-weight: 700;
    line-height: 1;

    cursor: pointer;
    z-index: 90;

    box-shadow: -3px 0 10px rgba(0,0,0,.16);

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

.watchlist-collapse-btn:hover {
    background: var(--tv-panel-hover);
    color: var(--tv-text);
    border-color: var(--tv-border-strong);
}

.right-sidebar.watchlist-collapsed {
    width: 0 !important;
    min-width: 0 !important;
    border-left-color: transparent !important;
}

.right-sidebar.watchlist-collapsed .right-sidebar-header,
.right-sidebar.watchlist-collapsed .watchlist {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

.right-sidebar.watchlist-collapsed .watchlist-collapse-btn {
    left: -24px;
}

/* En portrait ya tenías la watchlist oculta.
   En landscape la pestaña queda disponible si entra la sidebar. */
@media (max-width: 768px) {
    .watchlist-collapse-btn {
        display: none;
    }
}

@media (max-height: 650px) and (orientation: landscape) and (min-width: 769px) {
    .watchlist-collapse-btn {
        width: 22px;
        height: 48px;
        left: -22px;
        font-size: 17px;
    }

    .right-sidebar.watchlist-collapsed .watchlist-collapse-btn {
        left: -22px;
    }
}


/* =========================================================
   PANEL LUX TRADES PLEGABLE
   ========================================================= */

#lux-stats-panel {
    overflow: hidden;
    transition:
        width .18s ease,
        min-width .18s ease,
        height .18s ease,
        padding .18s ease;
}

.lux-stats-collapse-btn {
    width: 100%;
    min-height: 28px;

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

    padding: 5px 8px;

    border: 0;
    border-bottom: 1px solid rgba(255,255,255,.08);
    border-radius: 4px;

    background: rgba(156,39,176,.24);
    color: #e8e8e8;

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .35px;

    cursor: pointer;
    pointer-events: auto;

    transition:
        background .15s ease,
        color .15s ease;
}

.lux-stats-collapse-btn:hover {
    background: rgba(156,39,176,.38);
    color: #fff;
}

.lux-stats-collapse-btn b {
    color: #e1ff00;
    font-size: 12px;
}

.lux-stats-content {
    padding-top: 5px;
}

.lux-stats-title {
    padding: 3px 2px 7px;
    text-align: center;
    color: #e1ff00;
    font-size: 12px;
    font-weight: 700;
}

.lux-stats-title span {
    color: #d1d4dc;
    font-weight: 600;
}

.lux-stats-grid {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 5px 12px;
}

.lux-stats-history {
    margin: 7px -3px 5px;
    padding: 4px;
    text-align: center;
    background: rgba(156,39,176,.32);
}

#lux-stats-panel.lux-stats-collapsed {
    min-width: 122px !important;
    width: 122px !important;
    padding: 4px !important;
    border-color: rgba(156,39,176,.42) !important;
}

#lux-stats-panel.lux-stats-collapsed .lux-stats-content {
    display: none !important;
}

#lux-stats-panel.lux-stats-collapsed .lux-stats-collapse-btn {
    min-height: 27px;
    border-bottom: 0;
}

/* Landscape: el panel plegado ocupa todavía menos */
@media (max-height: 650px) and (orientation: landscape) {
    #lux-stats-panel.lux-stats-collapsed {
        min-width: 104px !important;
        width: 104px !important;
    }

    .lux-stats-collapse-btn {
        font-size: 9px;
    }
}

/* =========================================================
   MINI PANEL OPERATIVA ACTIVA EN EL GRÁFICO
   Se filtra por el par actualmente visible.
   ========================================================= */

.lux-trade-mini-panel {
    position: absolute;
    top: 10px;
    right: 300px;

    width: 238px;
    max-width: calc(100% - 90px);

    z-index: 31;

    overflow: hidden;

    border: 1px solid rgba(255,255,255,.16);
    border-radius: 7px;

    background: rgba(14,18,27,.92);
    color: var(--tv-text);

    box-shadow: 0 6px 22px rgba(0,0,0,.26);

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

    pointer-events: auto;
}

.lux-trade-mini-toggle {
    width: 100%;
    min-height: 31px;

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

    padding: 6px 8px;

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

    background: rgba(255,255,255,.025);
    color: var(--tv-text);

    font-size: 9px;

    cursor: pointer;
}

.lux-trade-mini-toggle:hover {
    background: rgba(255,255,255,.055);
}

.lux-trade-mini-toggle-left,
.lux-trade-mini-toggle-right {
    display: flex;
    align-items: center;
    gap: 6px;

    min-width: 0;
}

.lux-trade-mini-toggle-left strong {
    color: #f1f3f6;
    font-size: 9px;
    letter-spacing: .5px;
}

.lux-trade-mini-toggle-left b {
    color: var(--tv-text-muted);
    font-size: 9px;
    white-space: nowrap;
}

.lux-trade-mini-toggle-left em {
    min-width: 17px;
    height: 17px;

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

    border-radius: 10px;

    background: rgba(41,98,255,.18);
    color: #7f9dff;

    font-size: 8px;
    font-style: normal;
    font-weight: 800;
}

.lux-trade-mini-live {
    width: 6px;
    height: 6px;

    flex: 0 0 auto;

    border-radius: 50%;

    background: var(--tv-green);
    box-shadow: 0 0 7px rgba(38,166,154,.75);
}

.lux-trade-mini-toggle-right {
    margin-left: auto;
    white-space: nowrap;
}

.lux-trade-mini-toggle-right .positive {
    color: #55d7a2;
}

.lux-trade-mini-toggle-right .negative {
    color: #ff7d7a;
}

.lux-trade-mini-toggle-right i {
    color: var(--tv-text-muted);
    font-size: 11px;
    font-style: normal;
}

.lux-trade-mini-body {
    padding: 6px;
}

.lux-trade-mini-position {
    padding: 7px;

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

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

.lux-trade-mini-position + .lux-trade-mini-position {
    margin-top: 6px;
}

.lux-trade-mini-position-head {
    display: flex;
    align-items: center;
    gap: 6px;

    margin-bottom: 6px;
}

.lux-trade-mini-position-head strong {
    min-width: 0;

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

    color: #f1f3f6;
    font-size: 10px;
}

.lux-trade-mini-side {
    padding: 2px 5px;

    border-radius: 3px;

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

.lux-trade-mini-side.long {
    background: rgba(38,166,154,.16);
    color: #5bd7ca;
}

.lux-trade-mini-side.short {
    background: rgba(239,83,80,.16);
    color: #ff8582;
}

.lux-trade-mini-lev {
    margin-left: auto;

    color: var(--tv-text-muted);

    font-size: 9px;
    font-weight: 700;
}

.lux-trade-mini-pnl {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 8px;

    margin-bottom: 7px;
    padding-bottom: 6px;

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

.lux-trade-mini-pnl > span {
    color: var(--tv-text-dim);
    font-size: 8px;
    text-transform: uppercase;
    letter-spacing: .4px;
}

.lux-trade-mini-pnl strong {
    text-align: right;

    font-size: 11px;
    font-variant-numeric: tabular-nums;
}

.lux-trade-mini-pnl strong small {
    display: block;

    margin-top: 1px;

    font-size: 8px;
    font-weight: 600;
    opacity: .8;
}

.lux-trade-mini-pnl.positive strong {
    color: #55d7a2;
}

.lux-trade-mini-pnl.negative strong {
    color: #ff7d7a;
}

.lux-trade-mini-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
}

.lux-trade-mini-grid span {
    min-width: 0;

    display: flex;
    flex-direction: column;
    gap: 2px;

    padding: 5px 6px;

    border-radius: 4px;

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

    color: var(--tv-text-dim);

    font-size: 8px;
}

.lux-trade-mini-grid b {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

    color: var(--tv-text);

    font-size: 9px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.lux-trade-mini-grid .risk b {
    color: #ff8582;
}

.lux-trade-mini-grid .target b {
    color: #5bd7ca;
}

.lux-trade-mini-panel.is-collapsed {
    width: 225px;
}

.lux-trade-mini-panel.is-collapsed .lux-trade-mini-toggle {
    border-bottom: 0;
}

.lux-trade-mini-panel.is-collapsed .lux-trade-mini-body {
    display: none;
}


/* Landscape y pantallas angostas */
@media (max-width: 1100px) {
    .lux-trade-mini-panel {
        right: 72px;
        top: 52px;
        width: 220px;
    }

    .lux-trade-mini-panel.is-collapsed {
        width: 210px;
    }
}

@media (max-height: 650px) and (orientation: landscape) {
    .lux-trade-mini-panel {
        top: 44px;
        right: 62px;
        width: 205px;
    }

    .lux-trade-mini-panel.is-collapsed {
        width: 195px;
    }

    .lux-trade-mini-position {
        padding: 5px;
    }

    .lux-trade-mini-body {
        padding: 4px;
    }

    .lux-trade-mini-grid span {
        padding: 4px 5px;
    }
}

@media (max-width: 768px) {
    .lux-trade-mini-panel {
        top: 8px;
        right: 8px;

        width: min(220px, calc(100vw - 68px));
        max-width: calc(100vw - 68px);
    }

    .lux-trade-mini-panel.is-collapsed {
        width: min(210px, calc(100vw - 68px));
    }
}



/* ==========================================================================
   LUX CRIPTOS — TOOLBAR DE HERRAMIENTAS DESPLEGABLE
   Mantiene los iconos compactos y permite mostrar el nombre de cada herramienta.
   ========================================================================== */

:root{
    --lux-tools-collapsed-width: 46px;
    --lux-tools-expanded-width: 205px;
}

#left-sidebar.left-sidebar{
    width: var(--lux-tools-collapsed-width);
    min-width: var(--lux-tools-collapsed-width);
    align-items: center;
    overflow-x: hidden;
    transition:
        width .22s cubic-bezier(.2,.75,.2,1),
        min-width .22s cubic-bezier(.2,.75,.2,1),
        box-shadow .22s ease;
    will-change: width;
}

#left-sidebar.left-sidebar.tools-expanded{
    width: var(--lux-tools-expanded-width);
    min-width: var(--lux-tools-expanded-width);
    align-items: stretch;
    box-shadow: 10px 0 24px rgba(0,0,0,.16);
}

/* Flecha superior */
#left-sidebar .tools-expand-btn{
    width: 34px;
    min-width: 34px;
    height: 30px;
    min-height: 30px;
    margin: 0 auto 5px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 6px;
    background: rgba(255,255,255,.025);
    color: #a9adb8;
    cursor: pointer;
    transition:
        width .22s cubic-bezier(.2,.75,.2,1),
        margin .22s ease,
        background .14s ease,
        color .14s ease,
        border-color .14s ease;
}

#left-sidebar .tools-expand-btn:hover{
    color: #fff;
    background: var(--tv-panel-hover);
    border-color: rgba(255,255,255,.12);
}

#left-sidebar.tools-expanded .tools-expand-btn{
    width: calc(100% - 12px);
    margin-left: 6px;
    margin-right: 6px;
    justify-content: flex-start;
    padding: 0 10px;
}

#left-sidebar .tools-expand-icon{
    width: 20px;
    min-width: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    line-height: 1;
    font-weight: 500;
}

#left-sidebar .tools-expand-label{
    max-width: 0;
    opacity: 0;
    white-space: nowrap;
    overflow: hidden;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    transition: max-width .18s ease, opacity .15s ease;
}

#left-sidebar.tools-expanded .tools-expand-label{
    max-width: 130px;
    opacity: .72;
}

/* Botones */
#left-sidebar .tool-btn{
    width: 34px;
    min-width: 34px;
    max-width: 34px;
    justify-content: flex-start;
    gap: 0;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    white-space: nowrap;
    transition:
        width .22s cubic-bezier(.2,.75,.2,1),
        min-width .22s cubic-bezier(.2,.75,.2,1),
        max-width .22s cubic-bezier(.2,.75,.2,1),
        background .13s,
        color .13s,
        border-color .13s;
}

#left-sidebar.tools-expanded .tool-btn{
    width: calc(100% - 12px);
    min-width: calc(100% - 12px);
    max-width: calc(100% - 12px);
    margin-left: 6px;
    margin-right: 6px;
    padding-right: 9px;
}

#left-sidebar .lux-tool-icon{
    width: 32px;
    min-width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 32px;
}

#left-sidebar .lux-tool-name{
    min-width: 0;
    max-width: 0;
    opacity: 0;
    overflow: hidden;
    transform: translateX(-4px);
    pointer-events: none;
    color: currentColor;
    font-size: 11px;
    font-weight: 580;
    line-height: 1;
    text-align: left;
    white-space: nowrap;
    transition:
        max-width .2s ease,
        opacity .15s ease .03s,
        transform .2s ease;
}

#left-sidebar.tools-expanded .lux-tool-name{
    max-width: 155px;
    opacity: .92;
    transform: translateX(2px);
}

#left-sidebar.tools-expanded .tool-btn.active .lux-tool-name{
    color: #fff;
    opacity: 1;
    font-weight: 700;
}

#left-sidebar.tools-expanded .tool-btn.danger .lux-tool-name{
    color: #c8cbd3;
}

#left-sidebar.tools-expanded .tool-btn.danger:hover .lux-tool-name{
    color: #fff;
}

#left-sidebar .tool-sep{
    transition: width .22s ease, margin .22s ease;
}

#left-sidebar.tools-expanded .tool-sep{
    width: calc(100% - 20px);
    margin-left: 10px;
    margin-right: 10px;
}

/* En pantallas chicas no dejamos que el menú se vuelva excesivamente ancho. */
@media (max-width: 768px){
    :root{
        --lux-tools-expanded-width: 164px;
    }

    #left-sidebar.tools-expanded .lux-tool-name{
        max-width: 112px;
        font-size: 10px;
    }

    #left-sidebar .tools-expand-label{
        font-size: 9px;
    }
}

/* Landscape bajo: compacto para conservar el gráfico. */
@media (orientation: landscape) and (max-height: 650px){
    :root{
        --lux-tools-expanded-width: 174px;
    }

    #left-sidebar .tool-btn{
        height: 31px;
        min-height: 31px;
    }

    #left-sidebar .lux-tool-icon{
        width: 30px;
        min-width: 30px;
        height: 30px;
        flex-basis: 30px;
    }
}


/* ==========================================================================
   FIX V2 — TOOLBAR EXPANDIDA EN FILAS HORIZONTALES
   Corrige iconos arriba + texto abajo/cortado por reglas heredadas.
   ========================================================================== */

#left-sidebar.left-sidebar.tools-expanded{
    width: 220px !important;
    min-width: 220px !important;
    max-width: 220px !important;
    align-items: stretch !important;
    padding: 6px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

/* Cabecera / botón de desplegar */
#left-sidebar.left-sidebar .tools-expand-btn,
#left-sidebar.left-sidebar.tools-expanded .tools-expand-btn{
    box-sizing: border-box !important;
    flex: 0 0 auto !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 31px !important;
    min-height: 31px !important;
    max-height: 31px !important;
    margin: 0 auto 6px !important;
    padding: 0 !important;
    overflow: hidden !important;
    white-space: nowrap !important;
}

#left-sidebar.left-sidebar.tools-expanded .tools-expand-btn{
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    justify-content: flex-start !important;
    padding: 0 9px !important;
    gap: 7px !important;
}

#left-sidebar .tools-expand-icon{
    flex: 0 0 22px !important;
    width: 22px !important;
    min-width: 22px !important;
    height: 22px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
}

#left-sidebar.tools-expanded .tools-expand-label{
    display: inline-block !important;
    max-width: 150px !important;
    opacity: .9 !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    font-size: 10px !important;
    line-height: 1 !important;
}

/* Cada herramienta = UNA fila horizontal */
#left-sidebar.left-sidebar .tool-btn,
#left-sidebar.left-sidebar.tools-expanded .tool-btn{
    box-sizing: border-box !important;
    flex: 0 0 auto !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 8px !important;

    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;

    padding: 0 !important;
    margin: 1px auto !important;

    overflow: hidden !important;
    white-space: nowrap !important;
    line-height: 1 !important;
}

#left-sidebar.left-sidebar .tool-btn{
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    justify-content: center !important;
}

#left-sidebar.left-sidebar.tools-expanded .tool-btn{
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    justify-content: flex-start !important;
    padding: 0 9px !important;
}

/* Icono siempre a la izquierda y centrado */
#left-sidebar .tool-btn .lux-tool-icon{
    box-sizing: border-box !important;
    flex: 0 0 24px !important;
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 24px !important;

    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
}

#left-sidebar .tool-btn .lux-tool-icon svg{
    width: 19px !important;
    height: 19px !important;
    display: block !important;
    flex: 0 0 auto !important;
}

/* Texto a la derecha, una sola línea */
#left-sidebar .tool-btn .lux-tool-name{
    display: none !important;
}

#left-sidebar.tools-expanded .tool-btn .lux-tool-name{
    display: block !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;

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

    opacity: .88 !important;
    transform: none !important;

    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;

    color: inherit !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 34px !important;
    text-align: left !important;
}

/* Activa mucho más limpia */
#left-sidebar.tools-expanded .tool-btn.active{
    border-color: rgba(77,121,255,.75) !important;
    box-shadow: 0 3px 10px rgba(41,98,255,.20) !important;
}

#left-sidebar.tools-expanded .tool-btn.active .lux-tool-name{
    color: #fff !important;
    opacity: 1 !important;
}

/* Separadores alineados al nuevo ancho */
#left-sidebar.left-sidebar.tools-expanded .tool-sep{
    flex: 0 0 auto !important;
    width: calc(100% - 12px) !important;
    height: 1px !important;
    margin: 5px 6px !important;
}

/* Botones deshabilitados visibles pero discretos */
#left-sidebar.tools-expanded .tool-btn[disabled]{
    opacity: .34 !important;
}

/* Mobile */
@media (max-width: 768px){
    #left-sidebar.left-sidebar.tools-expanded{
        width: 190px !important;
        min-width: 190px !important;
        max-width: 190px !important;
    }

    #left-sidebar.tools-expanded .tool-btn .lux-tool-name{
        font-size: 10.5px !important;
    }
}

/* Mobile muy angosto */
@media (max-width: 420px){
    #left-sidebar.left-sidebar.tools-expanded{
        width: 176px !important;
        min-width: 176px !important;
        max-width: 176px !important;
    }

    #left-sidebar.left-sidebar.tools-expanded .tool-btn{
        height: 34px !important;
        min-height: 34px !important;
        max-height: 34px !important;
    }

    #left-sidebar.tools-expanded .tool-btn .lux-tool-name{
        font-size: 10px !important;
    }
}


/* ==========================================================================
   FIX V3 — BOTONES FLEX REALES PARA LEER BIEN LOS NOMBRES
   Antes heredaban display:grid del estilo base y por eso icono + texto
   se superponían y el texto quedaba cortado.
   ========================================================================== */

#left-sidebar.left-sidebar.tools-expanded{
    width: 214px !important;
    min-width: 214px !important;
    max-width: 214px !important;
    padding: 6px 6px 8px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

#left-sidebar.left-sidebar,
#left-sidebar.left-sidebar.tools-expanded{
    scrollbar-width: thin;
}

#left-sidebar.left-sidebar .tool-btn,
#left-sidebar.left-sidebar.tools-expanded .tool-btn{
    display: flex !important;
    place-items: initial !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    align-items: center !important;
    align-content: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

#left-sidebar.left-sidebar .tool-btn{
    width: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    justify-content: center !important;
    padding: 0 !important;
}

#left-sidebar.left-sidebar.tools-expanded .tool-btn{
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    padding: 0 10px !important;
    border-radius: 8px !important;
}

#left-sidebar.left-sidebar .tools-expand-btn,
#left-sidebar.left-sidebar.tools-expanded .tools-expand-btn{
    display: flex !important;
    place-items: initial !important;
    align-items: center !important;
    align-content: center !important;
}

#left-sidebar.left-sidebar.tools-expanded .tools-expand-btn{
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    height: 34px !important;
    min-height: 34px !important;
    max-height: 34px !important;
    padding: 0 10px !important;
    justify-content: flex-start !important;
}

#left-sidebar .tool-btn .lux-tool-icon{
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 22px !important;
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
}

#left-sidebar .tool-btn .lux-tool-icon svg{
    width: 18px !important;
    height: 18px !important;
    flex: 0 0 auto !important;
}

#left-sidebar .tool-btn .lux-tool-name{
    display: none !important;
}

#left-sidebar.tools-expanded .tool-btn .lux-tool-name{
    display: block !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    opacity: .95 !important;
    transform: none !important;
    line-height: 1.15 !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-align: left !important;
    color: inherit !important;
}

#left-sidebar.tools-expanded .tool-btn.active .lux-tool-name{
    color: #fff !important;
    opacity: 1 !important;
}

#left-sidebar.tools-expanded .tool-btn .lux-tool-name,
#left-sidebar.tools-expanded .tools-expand-label{
    text-shadow: none !important;
}

#left-sidebar.tools-expanded .tools-expand-label{
    display: block !important;
    max-width: 140px !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    line-height: 1.1 !important;
}

#left-sidebar.left-sidebar.tools-expanded .tool-sep{
    width: calc(100% - 12px) !important;
    margin: 6px 6px !important;
}

@media (max-width: 768px){
    #left-sidebar.left-sidebar.tools-expanded{
        width: 188px !important;
        min-width: 188px !important;
        max-width: 188px !important;
    }

    #left-sidebar.tools-expanded .tool-btn .lux-tool-name{
        font-size: 10.5px !important;
    }
}

@media (max-width: 420px){
    #left-sidebar.left-sidebar.tools-expanded{
        width: 176px !important;
        min-width: 176px !important;
        max-width: 176px !important;
    }

    #left-sidebar.left-sidebar.tools-expanded .tool-btn{
        height: 36px !important;
        min-height: 36px !important;
        max-height: 36px !important;
        padding: 0 8px !important;
    }

    #left-sidebar.tools-expanded .tool-btn .lux-tool-name{
        font-size: 10px !important;
    }
}


/* =========================================================
   WATCHLIST — LOGOS DE ACTIVOS v7
   Estilo compacto tipo TradingView · desktop + mobile
   ========================================================= */

.watchlist-row{
    grid-template-columns: minmax(0, 1fr) auto auto;
}

.watchlist-row .wl-symbol{
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 7px;
}

.watchlist-row .wl-logo{
    width: 23px;
    height: 23px;
    min-width: 23px;
    flex: 0 0 23px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 50%;
    background: #151a23;
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 1px 3px rgba(0,0,0,.28);
}

.watchlist-row .wl-logo img{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    border-radius: 50%;
    pointer-events: none;
    user-select: none;
}

.watchlist-row .wl-logo-fallback{
    color: #aeb5c2;
    background: #202632;
    border-color: rgba(255,255,255,.08);
    font-size: 7px;
    font-weight: 800;
    letter-spacing: -.15px;
    line-height: 1;
}

.watchlist-row .wl-symbol-text{
    min-width: 0;
    display: flex;
    align-items: baseline;
    gap: 4px;
    overflow: hidden;
    white-space: nowrap;
}

.watchlist-row .wl-symbol-text .wl-base{
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.watchlist-row.active .wl-logo{
    border-color: rgba(105,138,255,.55);
    box-shadow:
        0 0 0 1px rgba(41,98,255,.12),
        0 1px 4px rgba(0,0,0,.30);
}

@media (max-width: 768px){
    .watchlist-row{
        min-height: 37px;
        padding-left: 7px;
        padding-right: 7px;
        gap: 5px;
    }

    .watchlist-row .wl-symbol{
        gap: 6px;
    }

    .watchlist-row .wl-logo{
        width: 21px;
        height: 21px;
        min-width: 21px;
        flex-basis: 21px;
    }

    .watchlist-row .wl-symbol-text{
        gap: 3px;
    }

    .watchlist-row .wl-base{
        font-size: 10.5px;
    }

    .watchlist-row .wl-quote{
        font-size: 8px;
    }
}

@media (max-width: 420px){
    .watchlist-row .wl-logo{
        width: 20px;
        height: 20px;
        min-width: 20px;
        flex-basis: 20px;
    }

    .watchlist-row .wl-logo-fallback{
        font-size: 6.5px;
    }
}


/* =========================================================
   BUSCADOR GLOBAL DE ACTIVOS v8
   ========================================================= */
.symbol-search-left{
    min-width:0;
    display:flex;
    align-items:center;
    gap:9px;
}
.symbol-search-logo{
    width:25px;
    height:25px;
    min-width:25px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    border-radius:50%;
    background:#171c25;
    border:1px solid rgba(255,255,255,.10);
    font-size:7px;
    font-weight:800;
    color:#aeb5c2;
}
.symbol-search-logo img{
    width:100%;
    height:100%;
    object-fit:contain;
    border-radius:50%;
}
.symbol-search-logo.fallback{background:#222936;}
.symbol-search-text{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:2px;
}
.symbol-search-top{
    display:flex;
    align-items:baseline;
    gap:4px;
    min-width:0;
}
.symbol-search-name{
    max-width:360px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:var(--tv-text-muted);
    font-size:9px;
}
.symbol-row .full{
    flex:0 0 auto;
    margin-left:10px;
    font-size:9px;
}
@media(max-width:768px){
    .symbol-search-logo{width:22px;height:22px;min-width:22px;}
    .symbol-search-left{gap:7px;}
    .symbol-search-name{max-width:190px;font-size:8px;}
    .symbol-row .full{font-size:8px;margin-left:6px;}
}
@media(max-width:420px){
    .symbol-search-name{max-width:145px;}
}


/* Buscador global v9: símbolo claro + tipo de mercado */
#symbol-list .symbol-row .full{
  flex:0 0 auto;
  padding:3px 7px;
  border-radius:999px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.07);
  font-size:9px;
  line-height:1.1;
  white-space:nowrap;
}
#symbol-list .symbol-search-top .base{font-weight:750;letter-spacing:.1px;}
#symbol-list .symbol-search-name{max-width:360px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
@media(max-width:768px){
  #symbol-list .symbol-row .full{font-size:8px;padding:3px 5px;}
  #symbol-list .symbol-search-name{max-width:210px;}
}


/* =========================================================
   BUSCADOR DE SÍMBOLOS TIPO TRADINGVIEW v10
   ========================================================= */
.symbol-dialog-box{
  width:min(780px, calc(100vw - 28px));
  max-width:780px;
}

.symbol-market-tabs{
  display:flex;
  align-items:center;
  gap:6px;
  overflow-x:auto;
  padding:0 12px 10px;
  scrollbar-width:none;
}
.symbol-market-tabs::-webkit-scrollbar{display:none;}

.symbol-market-tab{
  flex:0 0 auto;
  min-height:29px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:999px;
  background:#252a33;
  color:#c7cbd3;
  font-size:10px;
  font-weight:650;
  cursor:pointer;
}
.symbol-market-tab:hover{background:#303641;color:#fff;}
.symbol-market-tab.active{
  background:#f1f3f6;
  border-color:#f1f3f6;
  color:#15181e;
}

#symbol-list .symbol-row{
  min-height:48px;
  padding:6px 12px;
  gap:12px;
}
#symbol-list .symbol-search-left{
  flex:1 1 auto;
  min-width:0;
}
#symbol-list .symbol-search-logo{
  width:29px;
  height:29px;
  min-width:29px;
  font-size:8px;
}
#symbol-list .symbol-search-logo.tradfi-logo.fallback{
  background:linear-gradient(145deg,#242a34,#151922);
  color:#f4f5f7;
  border-color:rgba(255,255,255,.16);
  font-size:8px;
  letter-spacing:-.2px;
}
#symbol-list .symbol-search-top{
  line-height:1.15;
}
#symbol-list .symbol-search-top .base{
  font-size:12px;
  font-weight:760;
}
#symbol-list .symbol-search-top .quote{
  font-size:10px;
  color:var(--tv-text-muted);
}
#symbol-list .symbol-search-meta{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
  margin-top:2px;
}
#symbol-list .symbol-search-name{
  max-width:390px;
  color:#c2c7d0;
  font-size:9px;
}
#symbol-list .symbol-search-exchange{
  flex:0 0 auto;
  color:#6f8fb7;
  font-size:8px;
  font-weight:650;
  text-transform:uppercase;
}
#symbol-list .symbol-search-right{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:9px;
}
#symbol-list .symbol-market-badge{
  padding:3px 7px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:999px;
  background:rgba(255,255,255,.045);
  color:#9fa6b2;
  font-size:8px;
  white-space:nowrap;
}
#symbol-list .symbol-add-hint{
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  color:#aab0ba;
  border-radius:50%;
  font-size:18px;
  font-weight:300;
}
#symbol-list .symbol-row:hover .symbol-add-hint{
  background:rgba(255,255,255,.07);
  color:#fff;
}

@media(max-width:768px){
  .symbol-dialog-box{
    width:calc(100vw - 18px);
    max-width:none;
  }
  .symbol-market-tabs{padding:0 9px 8px;gap:5px;}
  .symbol-market-tab{min-height:27px;padding:0 10px;font-size:9px;}
  #symbol-list .symbol-row{min-height:45px;padding:5px 9px;gap:8px;}
  #symbol-list .symbol-search-logo{width:26px;height:26px;min-width:26px;}
  #symbol-list .symbol-search-top .base{font-size:11px;}
  #symbol-list .symbol-search-name{max-width:190px;font-size:8px;}
  #symbol-list .symbol-search-exchange{font-size:7px;}
  #symbol-list .symbol-market-badge{font-size:7px;padding:3px 5px;}
  #symbol-list .symbol-add-hint{display:none;}
}

@media(max-width:420px){
  #symbol-list .symbol-search-name{max-width:145px;}
  #symbol-list .symbol-search-exchange{display:none;}
}


/* =========================================================
   SELECTOR DE MERCADOS v13 — grupos + paginado
   ========================================================= */
#symbol-list .symbol-section-title{
  position:sticky;
  top:0;
  z-index:3;
  min-height:30px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:7px 13px 5px;
  background:rgba(17,21,30,.96);
  border-top:1px solid rgba(255,255,255,.045);
  border-bottom:1px solid rgba(255,255,255,.055);
  color:#8c94a3;
  font-size:8.5px;
  font-weight:800;
  letter-spacing:.65px;
  backdrop-filter:blur(8px);
}
#symbol-list .symbol-section-count{
  color:#626b79;
  font-size:7.5px;
  font-weight:650;
  letter-spacing:0;
}
.symbol-more-wrap{
  display:flex;
  justify-content:center;
  padding:12px;
}
.symbol-more-btn{
  min-width:180px;
  height:32px;
  padding:0 15px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:7px;
  background:#20252f;
  color:#d6d9df;
  font-size:9px;
  font-weight:700;
  cursor:pointer;
}
.symbol-more-btn:hover{
  background:#2a303c;
  border-color:rgba(255,255,255,.16);
  color:#fff;
}
@media(max-width:768px){
  #symbol-list .symbol-section-title{
    min-height:27px;
    padding:6px 9px 4px;
    font-size:8px;
  }
  .symbol-more-btn{height:30px;font-size:8.5px;}
}


/* =========================================================
   SELECTOR HÍBRIDO v14 — categorías reales, sin tabs vacías
   ========================================================= */
.symbol-market-tab{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
}
.symbol-market-tab[hidden]{
  display:none !important;
}
.symbol-market-tab small{
  min-width:16px;
  height:16px;
  padding:0 4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  color:#858d9a;
  font-size:7px;
  font-weight:750;
  line-height:1;
}
.symbol-market-tab.active small{
  background:rgba(0,0,0,.10);
  color:inherit;
}
#symbol-list .symbol-search-exchange{
  text-transform:none;
}


/* LOGOS AUTOMÁTICOS v19 */
.watchlist-row .wl-logo img,
#symbol-list .symbol-search-logo img{
  object-fit:contain;
  padding:2px;
}
.watchlist-row .wl-logo,
#symbol-list .symbol-search-logo{
  background:#151a23;
}


/* =========================================================
   LOGOS AUTOMÁTICOS TODOS LOS MERCADOS v20
   ========================================================= */
.market-logo-flags{
  position:relative;
  overflow:visible !important;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}

.market-logo-flags img{
  position:absolute;
  width:16px !important;
  height:16px !important;
  min-width:16px;
  object-fit:cover !important;
  border-radius:50% !important;
  padding:0 !important;
  border:1.5px solid #151a23;
  box-shadow:0 1px 3px rgba(0,0,0,.35);
}

.market-logo-flags img:first-child{
  left:0;
  top:2px;
  z-index:2;
}

.market-logo-flags img:nth-child(2){
  right:0;
  bottom:2px;
  z-index:1;
}

#symbol-list .market-logo-flags img{
  width:18px !important;
  height:18px !important;
  min-width:18px;
}

.watchlist-row .wl-logo img,
#symbol-list .symbol-search-logo img{
  object-fit:contain;
}

@media(max-width:768px){
  .market-logo-flags img{
    width:15px !important;
    height:15px !important;
    min-width:15px;
  }
  #symbol-list .market-logo-flags img{
    width:17px !important;
    height:17px !important;
    min-width:17px;
  }
}


/* =========================================================
   SELECTOR DE SÍMBOLOS — FIX MOBILE v21
   ========================================================= */
@media (max-width: 768px) {
  /* Overlay con aire arriba/abajo para no ocupar toda la pantalla */
  .symbol-search-overlay,
  #symbol-search-overlay,
  .symbol-modal-overlay,
  #symbolModal {
    align-items: flex-start !important;
    padding:
      max(12px, env(safe-area-inset-top))
      10px
      max(14px, env(safe-area-inset-bottom))
      10px !important;
    overflow: hidden !important;
  }

  /* Caja principal más chica y centrada */
  .symbol-search-modal,
  #symbol-search-modal,
  .symbol-modal,
  .market-selector-modal {
    width: min(94vw, 680px) !important;
    max-width: 94vw !important;
    height: auto !important;
    max-height: calc(100dvh - 110px) !important;
    margin: 0 auto !important;
    border-radius: 16px !important;
    overflow: hidden !important;
  }

  /* Cabecera compacta y siempre visible */
  .symbol-search-header,
  .symbol-modal-header,
  .market-selector-header {
    min-height: 64px !important;
    padding: 12px 54px 10px 16px !important;
    position: relative !important;
    flex-shrink: 0 !important;
  }

  .symbol-search-header h2,
  .symbol-modal-header h2,
  .market-selector-header h2 {
    font-size: 18px !important;
    line-height: 1.1 !important;
    margin: 0 0 4px !important;
  }

  .symbol-search-header p,
  .symbol-modal-header p,
  .market-selector-header p {
    font-size: 12px !important;
    line-height: 1.2 !important;
    margin: 0 !important;
  }

  /* X bien visible y lejos del botón flotante de tema/color */
  .symbol-search-close,
  #symbol-search-close,
  .symbol-modal-close,
  .market-selector-close {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    display: grid !important;
    place-items: center !important;
    border-radius: 10px !important;
    z-index: 40 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  /* Input más compacto */
  .symbol-search-input-wrap,
  .symbol-search-input-container,
  .market-selector-search {
    margin: 10px 14px 8px !important;
  }

  .symbol-search-input,
  #symbol-search-input,
  .market-selector-search input {
    min-height: 48px !important;
    height: 48px !important;
    font-size: 16px !important; /* evita zoom en iPhone */
    border-radius: 12px !important;
  }

  /* Tabs con scroll horizontal; no cortarlos contra los bordes */
  .symbol-search-tabs,
  .market-tabs,
  .symbol-tabs {
    padding: 0 12px 8px !important;
    gap: 6px !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    flex-shrink: 0 !important;
  }

  .symbol-search-tabs::-webkit-scrollbar,
  .market-tabs::-webkit-scrollbar,
  .symbol-tabs::-webkit-scrollbar {
    display: none !important;
  }

  .symbol-search-tabs button,
  .market-tabs button,
  .symbol-tabs button {
    flex: 0 0 auto !important;
    min-height: 34px !important;
    padding: 6px 12px !important;
    font-size: 13px !important;
    white-space: nowrap !important;
  }

  /* Lista interna: ocupa el espacio sobrante y scrollea adentro */
  .symbol-search-results,
  #symbol-search-results,
  .market-selector-results,
  .symbol-list {
    max-height: calc(100dvh - 285px) !important;
    min-height: 220px !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    padding-bottom: max(12px, env(safe-area-inset-bottom)) !important;
  }

  /* Filas un poco más compactas */
  .symbol-search-row,
  .symbol-result-row,
  .market-symbol-row {
    min-height: 62px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
  }

  /* Evitar que el botón flotante de tema/color tape la X del modal */
  .theme-toggle,
  .color-theme-toggle,
  #theme-toggle,
  #appearance-toggle,
  .floating-theme-btn {
    z-index: 10 !important;
  }

  /* Si el botón flotante vive pegado arriba a la derecha, bajarlo cuando el selector está abierto */
  body:has(.symbol-search-overlay:not([hidden])) .theme-toggle,
  body:has(#symbol-search-overlay:not([hidden])) .theme-toggle,
  body:has(.symbol-modal-overlay:not([hidden])) .theme-toggle,
  body:has(#symbolModal:not([hidden])) .theme-toggle,
  body:has(.symbol-search-overlay:not([hidden])) .color-theme-toggle,
  body:has(#symbol-search-overlay:not([hidden])) .color-theme-toggle,
  body:has(.symbol-modal-overlay:not([hidden])) .color-theme-toggle,
  body:has(#symbolModal:not([hidden])) .color-theme-toggle {
    transform: translateY(58px) !important;
  }
}

@media (max-width: 430px) {
  .symbol-search-modal,
  #symbol-search-modal,
  .symbol-modal,
  .market-selector-modal {
    width: 96vw !important;
    max-width: 96vw !important;
    max-height: calc(100dvh - 92px) !important;
    border-radius: 14px !important;
  }

  .symbol-search-results,
  #symbol-search-results,
  .market-selector-results,
  .symbol-list {
    max-height: calc(100dvh - 270px) !important;
  }
}

/* INDICADORES AVANZADOS LUX v31 */
.advanced-indicator-help{margin-top:14px;padding:10px 12px;border:1px solid rgba(120,123,134,.25);border-radius:10px;background:rgba(120,123,134,.07);color:#9aa0aa;font-size:12px;line-height:1.45}
#indicator-menu-content{max-height:min(72vh,680px);overflow-y:auto;overscroll-behavior:contain}
#indicator-menu-content .dropdown-label{position:sticky;top:0;z-index:2;background:#1e222d}
.lux-volume-profile-svg{overflow:hidden}
@media(max-width:768px){#indicator-menu-content{max-height:68dvh}.advanced-indicator-help{font-size:11px}}


/* =========================================================
   MODO PÚBLICO /PROBAR — v32
   ========================================================= */
.lux-demo-banner{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:7px 14px;
  border-bottom:1px solid rgba(212,175,55,.28);
  background:linear-gradient(90deg,rgba(212,175,55,.12),rgba(11,14,20,.98) 42%,rgba(11,14,20,.98));
  color:#d1d4dc;
  flex:0 0 auto;
  z-index:80;
}
.lux-demo-banner-copy{display:flex;align-items:center;gap:8px;min-width:0;font-size:12px}
.lux-demo-banner-copy strong{color:#f1d37a;letter-spacing:.08em;font-size:11px;white-space:nowrap}
.lux-demo-live-dot{width:7px;height:7px;border-radius:50%;background:#26a69a;box-shadow:0 0 0 4px rgba(38,166,154,.10)}
.lux-demo-banner-actions{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.lux-demo-link-btn,.lux-demo-cta-btn{
  min-height:30px;border-radius:7px;padding:0 11px;font-size:11px;font-weight:700;cursor:pointer;
}
.lux-demo-link-btn{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#d1d4dc}
.lux-demo-cta-btn{border:1px solid rgba(212,175,55,.55);background:#d4af37;color:#111318}

.lux-demo-stats-panel{
  position:absolute;
  top:14px;
  right:76px;
  width:290px;
  z-index:34;
  border:1px solid rgba(212,175,55,.30);
  border-radius:12px;
  overflow:hidden;
  background:rgba(15,18,25,.94);
  box-shadow:0 10px 30px rgba(0,0,0,.32);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  color:#d1d4dc;
  pointer-events:auto;
}
.lux-demo-stats-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 11px 9px;border-bottom:1px solid rgba(255,255,255,.07);
}
.lux-demo-stats-eyebrow{font-size:10px;color:#d4af37;font-weight:800;letter-spacing:.08em}
.lux-demo-stats-market{margin-top:3px;font-size:12px;font-weight:700;color:#f0f2f5}
.lux-demo-stats-toggle{
  width:28px;height:28px;display:grid;place-items:center;border-radius:7px;
  border:1px solid rgba(255,255,255,.10);background:#171b24;color:#c8ccd4;cursor:pointer;font-size:17px;
}
.lux-demo-stats-body{padding:10px}
.lux-demo-total-row{display:flex;align-items:center;justify-content:space-between;padding:7px 8px;margin-bottom:8px;border-radius:8px;background:rgba(255,255,255,.035);font-size:11px}
.lux-demo-total-row strong{font-size:18px;color:#fff}
.lux-demo-results-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.lux-demo-result{padding:8px 5px 7px;border:1px solid rgba(255,255,255,.06);border-radius:8px;background:#11151d;text-align:center}
.lux-demo-result span{display:block;font-size:9px;font-weight:800;letter-spacing:.06em;color:#8d93a0}
.lux-demo-result strong{display:block;margin-top:3px;font-size:16px;color:#fff}
.lux-demo-result small{display:block;margin-top:2px;font-size:9px;color:#858b97}
.lux-demo-result.tp1 strong,.lux-demo-result.tp2 strong,.lux-demo-result.tp3 strong{color:#26a69a}
.lux-demo-result.tp3{border-color:rgba(38,166,154,.22)}
.lux-demo-result.sl strong{color:#ef5350}
.lux-demo-stats-foot{display:flex;justify-content:space-between;gap:8px;margin-top:9px;font-size:9px;color:#777e8a}
#lux-demo-stats-status[data-kind="ok"]{color:#26a69a}
#lux-demo-stats-status[data-kind="error"]{color:#ef5350}
#lux-demo-stats-status[data-kind="loading"]{color:#d4af37}
.lux-demo-protected-note{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.06);font-size:9px;color:#7f8691}
.lux-demo-stats-panel.is-collapsed .lux-demo-stats-body{display:none}

@media(max-width:768px){
  .lux-demo-banner{min-height:38px;padding:6px 8px;gap:6px}
  .lux-demo-banner-copy{font-size:10px;gap:5px}
  .lux-demo-banner-copy > span:last-child{display:none}
  .lux-demo-banner-actions{gap:5px}
  .lux-demo-link-btn,.lux-demo-cta-btn{min-height:28px;padding:0 8px;font-size:10px}
  .lux-demo-stats-panel{
    top:10px;
    right:8px;
    width:min(280px,calc(100vw - 74px));
    border-radius:10px;
  }
  .lux-demo-stats-head{padding:8px 9px 7px}
  .lux-demo-stats-body{padding:8px}
  .lux-demo-results-grid{gap:4px}
  .lux-demo-result{padding:6px 3px}
  .lux-demo-result strong{font-size:14px}
}

@media(max-width:430px){
  .lux-demo-banner-copy strong{font-size:9px}
  .lux-demo-stats-panel{width:min(270px,calc(100vw - 58px));right:5px}
}


/* =========================================================
   DEMO CTA GUARDADO/REGISTRO — v33
   ========================================================= */
.lux-demo-stats-actions{
  display:grid;
  grid-template-columns:1fr 1.25fr;
  gap:7px;
  margin-top:10px;
}
.lux-demo-secondary-cta,
.lux-demo-primary-cta{
  min-height:34px;
  border-radius:8px;
  padding:0 9px;
  font-size:10px;
  font-weight:800;
  cursor:pointer;
}
.lux-demo-secondary-cta{
  border:1px solid rgba(255,255,255,.12);
  background:#171b24;
  color:#d1d4dc;
}
.lux-demo-primary-cta{
  border:1px solid rgba(212,175,55,.55);
  background:#d4af37;
  color:#101217;
}
.lux-demo-save-note{
  margin-top:7px;
  color:#a7adb8;
  line-height:1.45;
}
.lux-demo-save-note strong{
  color:#eceff4;
  font-weight:800;
}

@media(max-width:768px){
  .lux-demo-stats-actions{
    grid-template-columns:1fr;
  }
  .lux-demo-secondary-cta,
  .lux-demo-primary-cta{
    min-height:32px;
    font-size:9.5px;
  }
}


/* =========================================================
   DEMO LIMITES COMERCIALES — v35
   ========================================================= */

.lux-demo-trading-locked{
  position:fixed;
  right:14px;
  bottom:58px;
  z-index:10020;
  display:flex;
  align-items:center;
  gap:9px;
  min-width:190px;
  padding:9px 12px;
  border:1px solid rgba(212,175,55,.42);
  border-radius:10px;
  background:rgba(19,23,32,.96);
  color:#d1d4dc;
  box-shadow:0 8px 28px rgba(0,0,0,.38);
  cursor:pointer;
  text-align:left;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.lux-demo-trading-locked:hover{
  border-color:rgba(212,175,55,.72);
  background:#171c26;
}
.lux-demo-trading-lock{
  width:30px;height:30px;
  display:grid;place-items:center;
  flex:0 0 30px;
  border-radius:8px;
  background:rgba(212,175,55,.10);
}
.lux-demo-trading-copy{display:flex;flex-direction:column;gap:2px;min-width:0}
.lux-demo-trading-copy strong{font-size:11px;color:#f0f2f5}
.lux-demo-trading-copy small{font-size:9px;color:#9299a5}

.lux-demo-gate{
  position:fixed;
  inset:0;
  z-index:20000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
}
.lux-demo-gate.is-open{display:flex}
.lux-demo-gate-backdrop{
  position:absolute;
  inset:0;
  background:rgba(3,5,9,.68);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
}
.lux-demo-gate-card{
  position:relative;
  z-index:1;
  width:min(390px,calc(100vw - 28px));
  padding:22px 20px 18px;
  border:1px solid rgba(212,175,55,.36);
  border-radius:14px;
  background:#11151d;
  box-shadow:0 22px 70px rgba(0,0,0,.58);
  color:#d1d4dc;
  text-align:center;
}
.lux-demo-gate-close{
  position:absolute;
  top:8px;right:9px;
  width:31px;height:31px;
  border:0;border-radius:8px;
  background:rgba(255,255,255,.045);
  color:#aab0ba;
  font-size:20px;
  cursor:pointer;
}
.lux-demo-gate-lock{
  width:42px;height:42px;
  display:grid;place-items:center;
  margin:0 auto 10px;
  border-radius:12px;
  background:rgba(212,175,55,.10);
  font-size:20px;
}
.lux-demo-gate-card h3{
  margin:0;
  font-size:16px;
  color:#f1f3f6;
}
.lux-demo-gate-card p{
  margin:9px 0 16px;
  color:#969da9;
  font-size:12px;
  line-height:1.5;
}
.lux-demo-gate-actions{
  display:grid;
  grid-template-columns:1fr 1.25fr;
  gap:8px;
}
.lux-demo-gate-actions button{
  min-height:38px;
  border-radius:8px;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
}
.lux-demo-gate-login{
  border:1px solid rgba(255,255,255,.12);
  background:#191e28;
  color:#d5d9e0;
}
.lux-demo-gate-register{
  border:1px solid rgba(212,175,55,.60);
  background:#d4af37;
  color:#101217;
}

@media(max-width:768px){
  .lux-demo-trading-locked{
    right:8px;
    bottom:54px;
    min-width:0;
    padding:8px 10px;
  }
  .lux-demo-trading-copy small{display:none}
  .lux-demo-gate-card{padding:20px 16px 16px}
}

@media(max-width:430px){
  .lux-demo-trading-locked{
    right:6px;
    bottom:52px;
  }
  .lux-demo-trading-copy strong{font-size:10px}
  .lux-demo-gate-actions{grid-template-columns:1fr}
}


/* =========================================================
   MOBILE WATCHLIST DESLIZABLE — v36
   ========================================================= */

.mobile-watchlist-toggle{
  display:none;
}

@media (max-width:768px){

  /*
   * El botón queda siempre visible en mobile, centrado sobre
   * la barra inferior. Es el equivalente mobile a la pestaña
   * lateral que usa la watchlist en desktop.
   */
  .mobile-watchlist-toggle{
    position:fixed;
    left:50%;
    bottom:max(10px, env(safe-area-inset-bottom));
    transform:translateX(-50%);
    z-index:145;

    min-width:210px;
    max-width:calc(100vw - 112px);
    height:38px;

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

    padding:0 13px;

    border:1px solid rgba(212,175,55,.78);
    border-radius:10px;

    background:linear-gradient(
      180deg,
      rgba(35,39,49,.98),
      rgba(20,23,31,.98)
    );

    color:#fff;

    box-shadow:
      0 6px 22px rgba(0,0,0,.34),
      inset 0 0 0 1px rgba(255,255,255,.025);

    font-size:11px;
    font-weight:750;
    letter-spacing:.01em;

    cursor:pointer;
    -webkit-tap-highlight-color:transparent;

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

  .mobile-watchlist-toggle:active{
    transform:translateX(-50%) scale(.98);
  }

  .mobile-watchlist-toggle-icon{
    color:#e3bd46;
    font-size:13px;
    line-height:1;
  }

  .mobile-watchlist-toggle-text{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .mobile-watchlist-toggle-arrow{
    color:#d4af37;
    font-size:14px;
    line-height:1;
    transition:transform .18s ease;
  }

  .mobile-watchlist-toggle.is-open{
    border-color:#e2bd4a;
    background:linear-gradient(
      180deg,
      rgba(55,48,25,.98),
      rgba(31,28,20,.98)
    );
    box-shadow:
      0 7px 26px rgba(0,0,0,.42),
      0 0 0 1px rgba(212,175,55,.08);
  }

  /*
   * La watchlist deja de estar display:none.
   * Permanece fuera de pantalla hasta que el botón la abre.
   * NO ocupa toda la pantalla: máximo 360px / 42dvh.
   */
  .right-sidebar{
    display:flex !important;

    position:fixed !important;
    left:calc(var(--toolbar-width) + 8px) !important;
    right:8px !important;
    bottom:58px !important;

    width:auto !important;
    min-width:0 !important;
    height:min(42dvh,360px) !important;
    max-height:360px !important;

    z-index:140 !important;

    border:1px solid rgba(212,175,55,.34) !important;
    border-radius:12px !important;

    background:rgba(18,22,30,.985) !important;

    box-shadow:
      0 14px 38px rgba(0,0,0,.50),
      0 0 0 1px rgba(255,255,255,.02);

    overflow:hidden !important;

    opacity:0;
    visibility:hidden;
    pointer-events:none;

    transform:translateY(calc(100% + 78px));
    transition:
      transform .22s cubic-bezier(.2,.8,.2,1),
      opacity .16s ease,
      visibility .16s ease;
  }

  .right-sidebar.mobile-watchlist-open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;

    transform:translateY(0);
  }

  /* En mobile ignoramos el colapsado de desktop. */
  .right-sidebar.watchlist-collapsed{
    width:auto !important;
    min-width:0 !important;
    border-left-color:rgba(212,175,55,.34) !important;
  }

  .right-sidebar.watchlist-collapsed .right-sidebar-header,
  .right-sidebar.watchlist-collapsed .watchlist{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
  }

  .right-sidebar-header{
    height:42px !important;
    min-height:42px !important;
    padding:0 11px !important;

    background:linear-gradient(
      90deg,
      rgba(212,175,55,.10),
      rgba(30,34,43,.96) 48%
    );

    border-bottom:1px solid rgba(212,175,55,.18) !important;
  }

  .right-sidebar-header .sidebar-title{
    color:#fff !important;
    font-size:11px !important;
    font-weight:750 !important;
  }

  .right-sidebar-header .sidebar-subtitle{
    color:#9ca2ad !important;
    font-size:8px !important;
  }

  .right-sidebar > .watchlist{
    min-height:0 !important;
    overflow:hidden !important;
  }

  .watchlist-header{
    min-height:38px;
    padding:5px 9px !important;
  }

  .watchlist-cols{
    padding:5px 8px !important;
    font-size:8px !important;
  }

  .watchlist-rows{
    min-height:0 !important;
    overflow-y:auto !important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }

  .watchlist-row{
    min-height:43px !important;
    padding:5px 8px !important;
  }

  /* La pestaña desktop no se usa en mobile. */
  .watchlist-collapse-btn{
    display:none !important;
  }
}

@media (max-width:430px){
  .mobile-watchlist-toggle{
    min-width:195px;
    max-width:calc(100vw - 96px);
    height:36px;
    bottom:max(8px, env(safe-area-inset-bottom));
    font-size:10.5px;
  }

  .right-sidebar{
    left:calc(var(--toolbar-width) + 5px) !important;
    right:5px !important;
    bottom:52px !important;
    height:min(40dvh,330px) !important;
    border-radius:10px !important;
  }
}

/* iPhone en landscape: panel más bajo para no tapar todo el gráfico. */
@media (max-height:500px) and (max-width:932px){
  .right-sidebar.mobile-watchlist-open{
    height:min(54dvh,245px) !important;
  }
}


/* =========================================================
   MOBILE FINAL — WATCHLIST + BUSCADOR COMPACTO v37
   ========================================================= */

@media (max-width:768px){

  /* -------------------------------------------------------
     1. BOTÓN LISTA DE SEGUIMIENTO
     Vive DENTRO de la barra gris inferior.
     No tapa fecha, gráfico ni "Símbolo".
     ------------------------------------------------------- */

  .center-area{
    position:relative !important;
  }

  .bottom-panel{
    position:relative !important;
    z-index:20 !important;

    /* dejamos lugar a la derecha para el botón */
    padding-right:148px !important;
  }

  .mobile-watchlist-toggle{
    position:absolute !important;

    left:auto !important;
    right:4px !important;
    bottom:2px !important;

    transform:none !important;

    z-index:35 !important;

    width:140px !important;
    min-width:140px !important;
    max-width:140px !important;

    height:calc(var(--bottom-height) - 4px) !important;
    min-height:20px !important;

    gap:5px !important;
    padding:0 7px !important;

    border:1px solid rgba(212,175,55,.82) !important;
    border-radius:6px !important;

    background:linear-gradient(
      180deg,
      rgba(42,38,25,.98),
      rgba(27,25,20,.98)
    ) !important;

    box-shadow:none !important;

    color:#fff !important;

    font-size:8.5px !important;
    line-height:1 !important;
  }

  .mobile-watchlist-toggle:active{
    transform:none !important;
  }

  .mobile-watchlist-toggle-icon{
    font-size:9px !important;
  }

  .mobile-watchlist-toggle-arrow{
    font-size:10px !important;
  }

  .mobile-watchlist-toggle.is-open{
    background:linear-gradient(
      180deg,
      rgba(67,56,25,.98),
      rgba(38,32,21,.98)
    ) !important;
    box-shadow:inset 0 0 0 1px rgba(212,175,55,.12) !important;
  }


  /* -------------------------------------------------------
     2. WATCHLIST ABIERTA
     Panel más corto y siempre por ENCIMA de la barra gris,
     sin invadirla.
     ------------------------------------------------------- */

  .right-sidebar{
    bottom:calc(var(--bottom-height) + 6px) !important;

    height:min(38dvh,300px) !important;
    max-height:300px !important;

    left:calc(var(--toolbar-width) + 6px) !important;
    right:6px !important;

    border-radius:10px !important;
  }

  .right-sidebar-header{
    height:37px !important;
    min-height:37px !important;
  }

  .watchlist-row{
    min-height:39px !important;
    padding-top:4px !important;
    padding-bottom:4px !important;
  }


  /* -------------------------------------------------------
     3. BUSCADOR GENERAL DE SÍMBOLOS
     Estas son las clases REALES del modal.
     ------------------------------------------------------- */

  #symbol-dialog.dialog-overlay{
    align-items:flex-start !important;
    justify-content:center !important;

    /* Separación del header y safe-area de iPhone */
    padding:
      max(42px, env(safe-area-inset-top))
      8px
      max(14px, env(safe-area-inset-bottom))
      8px !important;

    overflow:hidden !important;
  }

  #symbol-dialog .symbol-dialog-box{
    width:min(88vw,360px) !important;
    max-width:360px !important;

    /*
     * Un poco hacia la izquierda para que el botón flotante
     * de apariencia no coincida con la X.
     */
    transform:translateX(-10px);

    height:auto !important;
    max-height:min(70dvh,560px) !important;

    border-radius:10px !important;
    overflow:hidden !important;
  }

  #symbol-dialog .dialog-header{
    min-height:43px !important;
    height:43px !important;

    flex:0 0 43px !important;

    padding:6px 9px 5px 10px !important;
  }

  #symbol-dialog .dialog-title{
    font-size:11px !important;
    line-height:1.1 !important;
  }

  #symbol-dialog .dialog-subtitle{
    margin-top:2px !important;
    font-size:7.5px !important;
    line-height:1.1 !important;
  }

  #symbol-dialog .dialog-close{
    position:relative !important;

    width:27px !important;
    height:27px !important;
    min-width:27px !important;

    z-index:10030 !important;

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

    border:1px solid rgba(255,255,255,.09) !important;
    border-radius:7px !important;

    background:#252b35 !important;

    color:#e7e9ed !important;
    font-size:11px !important;

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

  #symbol-dialog .dialog-search{
    flex:0 0 auto !important;

    padding:6px 8px !important;

    border-bottom:1px solid var(--tv-border) !important;
  }

  #symbol-dialog .dialog-search input{
    height:34px !important;
    min-height:34px !important;

    padding-left:29px !important;

    border-radius:7px !important;

    /* 16px evita zoom automático en iPhone */
    font-size:16px !important;
  }

  #symbol-dialog .search-icon{
    left:18px !important;
    font-size:11px !important;
  }

  /*
   * Los tabs nunca quedan escondidos detrás del input.
   * Son una fila independiente con scroll horizontal.
   */
  #symbol-dialog .symbol-market-tabs{
    position:relative !important;

    flex:0 0 34px !important;

    min-height:34px !important;

    display:flex !important;
    align-items:center !important;

    gap:4px !important;

    padding:3px 7px 4px !important;

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

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

    background:#1b1f2a !important;

    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }

  #symbol-dialog .symbol-market-tabs::-webkit-scrollbar{
    display:none !important;
  }

  #symbol-dialog .symbol-market-tab{
    min-height:24px !important;
    height:24px !important;

    padding:0 8px !important;

    font-size:7.8px !important;

    border-radius:999px !important;

    white-space:nowrap !important;
  }

  /*
   * La lista usa solamente el espacio sobrante del modal.
   * Ya no hace crecer el modal hasta tapar toda la pantalla.
   */
  #symbol-dialog #symbol-list{
    flex:1 1 auto !important;

    min-height:150px !important;
    max-height:none !important;

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

    overscroll-behavior:contain !important;
    -webkit-overflow-scrolling:touch !important;
  }

  #symbol-dialog #symbol-list .symbol-section-title{
    min-height:25px !important;

    padding:5px 8px 4px !important;

    font-size:7.5px !important;
  }

  #symbol-dialog #symbol-list .symbol-section-count{
    font-size:7px !important;
  }

  #symbol-dialog #symbol-list .symbol-row{
    min-height:39px !important;

    padding:4px 8px !important;

    gap:6px !important;
  }

  #symbol-dialog #symbol-list .symbol-search-logo{
    width:23px !important;
    height:23px !important;
    min-width:23px !important;
  }

  #symbol-dialog #symbol-list .symbol-search-top .base{
    font-size:9.5px !important;
  }

  #symbol-dialog #symbol-list .symbol-search-name{
    max-width:155px !important;

    font-size:7.2px !important;
  }

  #symbol-dialog #symbol-list .symbol-search-exchange{
    font-size:6.5px !important;
  }

  #symbol-dialog #symbol-list .symbol-market-badge{
    padding:2px 5px !important;

    font-size:6.5px !important;
  }
}


@media (max-width:430px){

  .bottom-panel{
    padding-right:132px !important;
  }

  .mobile-watchlist-toggle{
    right:3px !important;

    width:126px !important;
    min-width:126px !important;
    max-width:126px !important;

    padding:0 5px !important;

    font-size:7.8px !important;
  }

  .right-sidebar{
    left:calc(var(--toolbar-width) + 4px) !important;
    right:4px !important;

    height:min(36dvh,275px) !important;
    max-height:275px !important;
  }

  #symbol-dialog.dialog-overlay{
    padding-top:max(38px, env(safe-area-inset-top)) !important;
  }

  #symbol-dialog .symbol-dialog-box{
    width:84vw !important;
    max-width:315px !important;

    transform:translateX(-13px);

    max-height:68dvh !important;
  }

  #symbol-dialog #symbol-list .symbol-search-name{
    max-width:118px !important;
  }
}


/* Pantallas MUY angostas: que el botón no tape "Símbolo XXX". */
@media (max-width:340px){

  .bottom-panel{
    padding-right:116px !important;
  }

  .mobile-watchlist-toggle{
    width:110px !important;
    min-width:110px !important;
    max-width:110px !important;

    font-size:7px !important;
  }

  .mobile-watchlist-toggle-icon{
    display:none !important;
  }
}

/* =========================================================
   LUX TRADING · MOBILE APP NAV · PWA
   ========================================================= */

.lux-trading-app-nav { display: none; }

@media (max-width: 767.98px) {
  :root { --lux-trading-app-nav-h: 66px; }

  .app {
    height: 100dvh !important;
    max-height: 100dvh !important;
    padding-bottom: calc(var(--lux-trading-app-nav-h) + env(safe-area-inset-bottom)) !important;
  }

  .workspace { min-height: 0 !important; }

  .lux-trading-app-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 24000;

    display: grid;
    grid-template-columns: repeat(6, minmax(0,1fr));
    align-items: end;

    height: calc(var(--lux-trading-app-nav-h) + env(safe-area-inset-bottom));
    padding: 4px 4px max(4px, env(safe-area-inset-bottom));

    border-top: 1px solid #2d3340;
    background: rgba(18,22,30,.985);
    box-shadow: 0 -7px 24px rgba(0,0,0,.34);

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

  .lux-trading-app-nav-item {
    position: relative;
    min-width: 0;
    height: 54px;
    padding: 0;

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

    border: 0;
    border-radius: 9px;
    background: transparent;

    color: #8c94a2 !important;
    text-decoration: none !important;

    font-family: Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
    font-size: 8.5px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
  }

  .lux-trading-app-nav-item .lux-nav-ico {
    color: #aab1bd;
    font-size: 17px !important;
    line-height: 1 !important;
  }

  .lux-trading-app-nav-item.active {
    color: #fff !important;
    background: rgba(41,98,255,.08);
  }

  .lux-trading-app-nav-item.active::before {
    content: "";
    position: absolute;
    top: 0;
    left: 30%;
    right: 30%;
    height: 2px;
    border-radius: 99px;
    background: #2962ff;
    box-shadow: 0 0 10px rgba(41,98,255,.75);
  }

  .lux-nav-trade-circle {
    width: 34px;
    height: 34px;
    margin-top: -10px;

    display: grid;
    place-items: center;

    border: 1px solid #567cff;
    border-radius: 50%;
    background: #2962ff;
    color: #fff;

    font-size: 18px !important;
    line-height: 1 !important;

    box-shadow:
      0 0 0 4px rgba(41,98,255,.12),
      0 7px 18px rgba(0,0,0,.32);
  }

  .mobile-watchlist-toggle {
    bottom: calc(var(--lux-trading-app-nav-h) + 6px + env(safe-area-inset-bottom)) !important;
  }

  .right-sidebar,
  .right-sidebar.mobile-watchlist-open {
    bottom: calc(var(--lux-trading-app-nav-h) + env(safe-area-inset-bottom)) !important;
  }

  .sim-trading-panel {
    padding-bottom: calc(var(--lux-trading-app-nav-h) + env(safe-area-inset-bottom)) !important;
  }

  .header {
    padding-top: env(safe-area-inset-top) !important;
    height: calc(var(--header-height) + env(safe-area-inset-top)) !important;
    min-height: calc(var(--header-height) + env(safe-area-inset-top)) !important;
  }
}

@media (min-width: 768px) {
  .lux-trading-app-nav { display: none !important; }
}


/* PWA: ocultar botón watchlist dorado duplicado */
@media (max-width: 767.98px) {
  .mobile-watchlist-toggle {
    display: none !important;
  }
}



/* =========================================================
   LUX TRADING MOBILE APP · AJUSTE FINAL v40
   ========================================================= */

@media (max-width: 767.98px) {

  /* El logo/volver superior deja de ser necesario porque Inicio vive abajo. */
  .header .lux-header-nav {
    display: none !important;
  }

  /* Recupera el espacio liberado por el bloque LUX superior. */
  .header-left {
    min-width: 0 !important;
    gap: 2px !important;
  }

  .header-left > .header-divider:first-of-type {
    display: none !important;
  }

  /* INDICADORES: panel compacto, no ocupa toda la pantalla. */
  #indicator-menu-content.dropdown-content.open,
  #indicator-menu-content.open {
    position: fixed !important;
    top: calc(var(--header-height, 44px) + env(safe-area-inset-top) + 5px) !important;
    left: calc(var(--toolbar-width, 46px) + 7px) !important;
    right: 7px !important;

    width: auto !important;
    max-width: 420px !important;
    height: auto !important;
    max-height: 56dvh !important;

    padding: 5px !important;

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

    border: 1px solid #303642 !important;
    border-radius: 10px !important;

    background: rgba(24,29,40,.985) !important;
    box-shadow: 0 16px 38px rgba(0,0,0,.46) !important;

    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  #indicator-menu-content .dropdown-label {
    min-height: 27px !important;
    padding: 6px 9px !important;
    font-size: 8px !important;
    line-height: 1 !important;
  }

  #indicator-menu-content .dropdown-item {
    min-height: 39px !important;
    padding: 7px 10px !important;
    font-size: 10.5px !important;
    line-height: 1.15 !important;
  }

  /* WATCHLIST: sube aproximadamente hasta media pantalla. */
  .right-sidebar,
  .right-sidebar.mobile-watchlist-open {
    height: 52dvh !important;
    max-height: 460px !important;
    min-height: 280px !important;

    left: calc(var(--toolbar-width) + 5px) !important;
    right: 5px !important;
    bottom: calc(var(--lux-trading-app-nav-h) + env(safe-area-inset-bottom) + 4px) !important;

    border-radius: 13px 13px 0 0 !important;
  }

  /* El botón Watchlist dorado viejo ya no participa del layout. */
  .mobile-watchlist-toggle {
    display: none !important;
  }

  /* Cuenta */
  .lux-nav-user-icon {
    width: 18px;
    height: 18px;
    border: 1.5px solid currentColor;
    border-radius: 50%;
    font-size: 0 !important;
    position: relative;
  }

  .lux-nav-user-icon::before {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    left: 50%;
    top: 3px;
    transform: translateX(-50%);
    border-radius: 50%;
    background: currentColor;
  }

  .lux-nav-user-icon::after {
    content: "";
    position: absolute;
    width: 9px;
    height: 5px;
    left: 50%;
    bottom: 2px;
    transform: translateX(-50%);
    border-radius: 6px 6px 4px 4px;
    background: currentColor;
  }
}

/* =========================================================
   PANELES FLOTANTES MOVIBLES + CANDADO
   #lux-trade-mini-panel y #lux-stats-panel
   ========================================================= */

.lux-float-controls {
  position: absolute;
  top: 4px;
  right: 5px;
  z-index: 80;

  display: flex;
  align-items: center;
  gap: 3px;
}

.lux-float-drag,
.lux-float-lock {
  width: 25px;
  height: 25px;
  min-width: 25px;
  padding: 0;

  display: grid;
  place-items: center;

  border: 1px solid rgba(255,255,255,.10);
  border-radius: 7px;

  background: rgba(20,24,32,.92);
  color: #aeb5c1;

  font-family: Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size: 12px;
  line-height: 1;

  box-shadow: 0 3px 10px rgba(0,0,0,.24);
  touch-action: none;
}

.lux-float-drag {
  cursor: grab;
  letter-spacing: -2px;
}

.lux-float-drag:active {
  cursor: grabbing;
}

.lux-float-lock {
  cursor: pointer;
}

.lux-float-lock.is-locked {
  color: #e2bd59;
  border-color: rgba(212,175,55,.36);
  background: rgba(54,46,24,.94);
}

.lux-floating-panel-locked .lux-float-drag {
  opacity: .32;
  cursor: default;
}

#lux-trade-mini-panel.lux-user-positioned,
#lux-stats-panel.lux-user-positioned {
  position: fixed !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  z-index: 16000 !important;
}

/* Deja espacio para los controles nuevos dentro de ambos carteles. */
#lux-trade-mini-panel .lux-trade-mini-toggle {
  padding-right: 64px !important;
}

#lux-stats-panel .lux-stats-collapse-btn {
  padding-right: 62px !important;
}

@media (max-width: 767.98px) {
  .lux-float-controls {
    top: 3px;
    right: 4px;
  }

  .lux-float-drag,
  .lux-float-lock {
    width: 23px;
    height: 23px;
    min-width: 23px;
    font-size: 11px;
  }
}



/* =========================================================
   LUX TRADING MOBILE · FIX FINAL v41
   ========================================================= */

/* Los carteles movibles quedan sobre el gráfico, pero DETRÁS
   de Buscar símbolo y Trading Demo. */
#lux-trade-mini-panel.lux-user-positioned,
#lux-stats-panel.lux-user-positioned {
  z-index: 9000 !important;
}

/* Buscar símbolo está en 10000 y Trading Demo en 12000.
   Reforzamos ambos para evitar cualquier superposición. */
#symbol-dialog.dialog-overlay,
.dialog-overlay {
  z-index: 10000 !important;
}

.sim-trading-panel {
  z-index: 12000 !important;
}

/* Icono pequeño junto al nombre del par dentro del gráfico. */
.lux-chart-symbol-logo {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  flex: 0 0 16px !important;
  object-fit: contain !important;
  border-radius: 50% !important;
  vertical-align: middle !important;
  margin-right: 5px !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.10) !important;
}

/* Fallback si el título del gráfico vive sobre canvas. */
.lux-chart-symbol-logo-fallback {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 28;

  width: 16px;
  height: 16px;

  border-radius: 50%;
  object-fit: contain;

  background: #171b26;
  box-shadow: 0 0 0 1px rgba(255,255,255,.10);

  pointer-events: none;
  display: none;
}

@media (max-width: 767.98px) {
  /* Mantener Indicadores compacto cuando se abre desde nav inferior. */
  #indicator-menu-content.open {
    display: block !important;
    max-height: 56dvh !important;
  }
}



/* =========================================================
   LUX TRADING MOBILE · WHATSAPP HEADER v42
   ========================================================= */

.lux-mobile-whatsapp-channel {
  display: none;
}

@media (max-width: 767.98px) {
  .lux-mobile-whatsapp-channel {
    display: flex !important;
    align-items: center;
    gap: 7px;

    flex: 0 0 auto;
    min-width: 78px;
    height: 36px;
    padding: 0 9px;

    border: 1px solid rgba(37,211,102,.34);
    border-radius: 9px;

    background:
      linear-gradient(180deg,rgba(24,31,29,.96),rgba(18,24,23,.98));

    color: #eef8f1 !important;
    text-decoration: none !important;

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.03),
      0 4px 12px rgba(0,0,0,.20);

    touch-action: manipulation;
  }

  .lux-mobile-whatsapp-channel:active {
    transform: scale(.98);
  }

  .lux-wa-dot {
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 50%;
    background: #25d366;
    box-shadow: 0 0 9px rgba(37,211,102,.58);
  }

  .lux-wa-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    line-height: 1 !important;
  }

  .lux-wa-copy strong {
    color: #f1f4f2 !important;
    font-size: 8.5px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: .06em !important;
  }

  .lux-wa-copy small {
    margin-top: 3px;
    color: #77d99d !important;
    font-size: 7px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
  }
}



/* =========================================================
   LUX TRADING MOBILE · NAV DORADO v43
   ========================================================= */

@media (max-width: 767.98px) {
  .lux-trading-app-nav {
    left: 5px !important;
    right: 5px !important;
    bottom: max(5px, env(safe-area-inset-bottom)) !important;

    width: auto !important;

    height: calc(var(--lux-trading-app-nav-h) + env(safe-area-inset-bottom)) !important;

    padding:
      4px
      4px
      max(4px, env(safe-area-inset-bottom))
      4px !important;

    border: 1px solid rgba(212,175,55,.72) !important;
    border-top-color: rgba(230,198,103,.92) !important;
    border-radius: 14px !important;

    background: rgba(18,22,30,.985) !important;

    box-shadow:
      0 0 0 1px rgba(212,175,55,.06),
      0 -8px 26px rgba(0,0,0,.34),
      inset 0 1px 0 rgba(255,255,255,.025) !important;

    overflow: visible !important;
  }

  .lux-trading-app-nav::before {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    top: -1px;

    height: 1px;

    background: linear-gradient(
      90deg,
      transparent,
      rgba(244,212,118,.95),
      transparent
    );

    pointer-events: none;
  }

  /* Ajuste por el pequeño margen inferior del nav. */
  .app {
    padding-bottom:
      calc(var(--lux-trading-app-nav-h) + env(safe-area-inset-bottom) + 10px)
      !important;
  }

  .right-sidebar,
  .right-sidebar.mobile-watchlist-open {
    bottom:
      calc(var(--lux-trading-app-nav-h) + env(safe-area-inset-bottom) + 10px)
      !important;
  }

  .sim-trading-panel {
    padding-bottom:
      calc(var(--lux-trading-app-nav-h) + env(safe-area-inset-bottom) + 10px)
      !important;
  }
}



/* =========================================================
   LUX TRADING · LOGO DEL PAR JUNTO AL TÍTULO v44
   ========================================================= */

.lux-chart-symbol-logo {
  width: 15px !important;
  height: 15px !important;
  min-width: 15px !important;
  flex: 0 0 15px !important;
  object-fit: contain !important;
  border-radius: 50% !important;
  margin-right: 6px !important;
  vertical-align: middle !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.10) !important;
}

.lux-chart-title-with-logo {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0 !important;
}

.lux-chart-symbol-logo-fallback {
  position: absolute;
  z-index: 30;
  width: 15px;
  height: 15px;
  border-radius: 50%;
  object-fit: contain;
  box-shadow: 0 0 0 1px rgba(255,255,255,.10);
  pointer-events: none;
  display: none;
}

@media (max-width: 767.98px) {
  .lux-chart-symbol-logo,
  .lux-chart-symbol-logo-fallback {
    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    flex-basis: 14px !important;
  }
}



/* =========================================================
   LUX TRADING · IDENTIDAD DE PAR ESTABLE v45
   Formato fijo: [logo] PAR · temporalidad
   ========================================================= */

.lux-chart-symbol-logo,
.lux-chart-symbol-logo-fallback {
  display: none !important;
}

.lux-chart-symbol-brand {
  display: none;
}

@media (max-width: 767.98px) {
  .chart-main {
    position: relative !important;
  }

  /* Ocultamos la fila vieja del símbolo para que nunca duplique
     ni se desplace junto con OHLC/precio. */
  #top-overlay .row-symbol {
    display: none !important;
  }

  /* Reservamos siempre el mismo espacio arriba. */
  #top-overlay {
    padding-top: 24px !important;
  }

  .lux-chart-symbol-brand {
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: 38;

    display: inline-flex;
    align-items: center;
    gap: 6px;

    height: 20px;
    max-width: calc(100% - 64px);

    padding: 1px 4px 1px 2px;

    border-radius: 5px;
    background: rgba(19,23,34,.72);

    color: #d9dde5;
    pointer-events: none;

    white-space: nowrap;
    overflow: hidden;
  }

  .lux-chart-symbol-brand-logo {
    width: 16px;
    height: 16px;
    min-width: 16px;

    object-fit: contain;
    border-radius: 50%;

    background: #1b202a;
    box-shadow: 0 0 0 1px rgba(255,255,255,.11);
  }

  .lux-chart-symbol-brand-pair {
    color: #f0f2f5;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: .01em;
  }

  .lux-chart-symbol-brand-sep {
    color: #68707e;
    font-size: 9px;
    line-height: 1;
  }

  .lux-chart-symbol-brand-tf {
    color: #b8bec9;
    font-size: 10px;
    font-weight: 750;
    line-height: 1;
  }
}



/* =========================================================
   LUX TRADING · PERFORMANCE + OPERATIVA v46
   ========================================================= */

/* Mini operativa: PNL debajo del encabezado, sin pisar drag/candado. */
#lux-trade-mini-panel .lux-trade-mini-toggle {
  min-height: 48px !important;
  height: auto !important;
  padding: 5px 62px 5px 9px !important;
  align-items: flex-start !important;
}

#lux-trade-mini-panel .lux-trade-mini-toggle-main {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

#lux-trade-mini-panel .lux-trade-mini-toggle-left {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 5px;
  line-height: 1;
}

#lux-trade-mini-panel .lux-trade-mini-header-pnl {
  display: flex;
  align-items: baseline;
  gap: 5px;
  padding-left: 11px;
  line-height: 1;
  white-space: nowrap;
}

#lux-trade-mini-panel .lux-trade-mini-header-pnl small {
  color: #777f8e;
  font-size: 7px;
  font-weight: 800;
  letter-spacing: .08em;
}

#lux-trade-mini-panel .lux-trade-mini-header-pnl strong {
  font-size: 9px;
  font-weight: 850;
}

#lux-trade-mini-panel .lux-trade-mini-header-pnl.positive strong {
  color: #25c6a2;
}

#lux-trade-mini-panel .lux-trade-mini-header-pnl.negative strong {
  color: #ff5c64;
}

#lux-trade-mini-panel .lux-trade-mini-toggle-arrow {
  position: absolute;
  right: 58px;
  top: 8px;
  color: #8a91a0;
  font-size: 9px;
  line-height: 1;
}

/* Los controles mover/candado siguen arriba a la derecha. */
#lux-trade-mini-panel .lux-float-controls {
  top: 4px !important;
  right: 4px !important;
}

/* Durante cargas/cambios, no forzamos transiciones visuales pesadas. */
.chart-main,
.chart-main * {
  animation-duration: 0s;
}

@media (max-width: 767.98px) {
  #lux-trade-mini-panel .lux-trade-mini-toggle {
    min-height: 46px !important;
    padding-right: 58px !important;
  }

  #lux-trade-mini-panel .lux-trade-mini-header-pnl strong {
    font-size: 8.5px;
  }

  #lux-trade-mini-panel .lux-trade-mini-toggle-arrow {
    right: 54px;
  }
}



/* =========================================================
   LUX TRADING MOBILE · HERRAMIENTAS DESDE NAV v48
   ========================================================= */

.lux-mobile-tools-sheet { display: none; }

@media (max-width: 767.98px) {
  body:not(.lux-mobile-tools-pinned) #left-sidebar {
    display: none !important;
  }

  body:not(.lux-mobile-tools-pinned) .workspace {
    grid-template-columns: minmax(0,1fr) !important;
  }

  body.lux-mobile-tools-pinned #left-sidebar {
    display: flex !important;
  }

  .lux-mobile-tools-sheet {
    position: fixed;
    left: 7px;
    right: 7px;
    bottom: calc(var(--lux-trading-app-nav-h) + env(safe-area-inset-bottom) + 10px);
    z-index: 23500;

    max-height: min(57dvh, 430px);
    overflow-y: auto;

    padding: 8px;
    border: 1px solid rgba(212,175,55,.58);
    border-radius: 14px;
    background: rgba(20,24,33,.99);

    box-shadow: 0 -12px 34px rgba(0,0,0,.40);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
  }

  .lux-mobile-tools-sheet.open { display: block; }

  .lux-mobile-tools-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 5px 5px 8px;
    color: #e9eaf0;
  }

  .lux-mobile-tools-title strong {
    font-size: 10px;
    letter-spacing: .05em;
  }

  .lux-mobile-tools-title span {
    color: #818998;
    font-size: 8px;
  }

  .lux-mobile-tools-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 6px;
  }

  .lux-mobile-tool-item {
    min-width: 0;
    min-height: 54px;
    padding: 7px 5px;

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

    border: 1px solid rgba(255,255,255,.07);
    border-radius: 9px;
    background: #181d27;
    color: #aeb5c0;

    font-size: 8px;
    font-weight: 700;
    text-align: center;
  }

  .lux-mobile-tool-item .lux-tool-icon {
    width: 20px;
    height: 20px;
  }

  .lux-mobile-tool-item.active {
    color: #fff;
    border-color: rgba(70,112,255,.70);
    background: rgba(41,98,255,.15);
  }

  .lux-mobile-tool-pin {
    width: 100%;
    min-height: 42px;
    margin-top: 8px;

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

    padding: 8px 10px;

    border: 1px solid rgba(212,175,55,.22);
    border-radius: 9px;
    background: rgba(212,175,55,.055);
    color: #d8dbe2;

    font-size: 9px;
    font-weight: 750;
  }

  .lux-mobile-tool-pin b {
    color: #d4af37;
    font-size: 8px;
  }
}



/* =========================================================
   LUX TRADING MOBILE · RESTAURACIÓN UI v51
   ========================================================= */
@media (max-width: 767.98px) {
  .lux-trading-app-nav {
    grid-template-columns: repeat(6, minmax(0,1fr));
  }

  body:not(.lux-mobile-tools-pinned) #left-sidebar {
    display: none !important;
  }

  body:not(.lux-mobile-tools-pinned) .workspace {
    grid-template-columns: minmax(0,1fr) !important;
  }

  body.lux-mobile-tools-pinned #left-sidebar {
    display: flex !important;
  }

  #lux-stats-panel {
    width: 220px !important;
    min-width: 220px !important;
    max-width: min(72vw, 235px) !important;
    min-height: 148px !important;
  }

  #lux-stats-panel.lux-stats-collapsed {
    width: 132px !important;
    min-width: 132px !important;
    min-height: 0 !important;
  }

  #lux-stats-panel .lux-float-controls {
    display: flex !important;
    z-index: 150 !important;
  }
}

#lux-stats-panel > .lux-float-controls {
  display: flex !important;
}



/* =========================================================
   TRADING BOTTOM PANEL · EXPANDE HACIA ARRIBA v51
   ========================================================= */

@media (max-width: 767.98px) {
  .bottom-panel,
  #bottom-panel {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;

    bottom: calc(
      var(--lux-trading-app-nav-h) +
      env(safe-area-inset-bottom) +
      10px
    ) !important;

    transform-origin: bottom center !important;
    margin: 0 !important;

    z-index: 18000 !important;
  }

  /* Cuando se expande, el borde inferior permanece exactamente
     en la misma posición y el panel gana altura hacia arriba. */
  .bottom-panel.expanded,
  .bottom-panel.is-expanded,
  #bottom-panel.expanded,
  #bottom-panel.is-expanded {
    top: auto !important;
    bottom: calc(
      var(--lux-trading-app-nav-h) +
      env(safe-area-inset-bottom) +
      10px
    ) !important;

    height: min(46dvh, 390px) !important;
    max-height: min(46dvh, 390px) !important;
  }

  .bottom-panel:not(.expanded):not(.is-expanded),
  #bottom-panel:not(.expanded):not(.is-expanded) {
    top: auto !important;
  }
}



/* =========================================================
   LUX TRADES RESTAURADO v52
   ========================================================= */

#lux-stats-panel {
  width: 220px !important;
  min-width: 220px !important;
  max-width: min(72vw, 235px) !important;
  min-height: 148px !important;

  overflow: visible !important;
  pointer-events: auto !important;
}

#lux-stats-panel .lux-stats-content {
  display: block;
  padding-top: 5px;
}

#lux-stats-panel .lux-stats-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 5px 12px;
}

#lux-stats-panel .lux-stats-collapse-btn {
  min-height: 29px !important;
  padding-right: 62px !important;
}

#lux-stats-panel > .lux-float-controls {
  display: flex !important;
  z-index: 200 !important;
}

/* Si el usuario lo pliega manualmente, ahí sí se achica. */
#lux-stats-panel.lux-stats-collapsed {
  width: 132px !important;
  min-width: 132px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

#lux-stats-panel.lux-stats-collapsed .lux-stats-content {
  display: none !important;
}

@media (max-width: 767.98px) {
  #lux-stats-panel {
    width: 215px !important;
    min-width: 215px !important;
    max-width: min(74vw, 225px) !important;
    min-height: 145px !important;
  }

  #lux-stats-panel .lux-stats-title {
    font-size: 10px !important;
    line-height: 1.2 !important;
  }

  #lux-stats-panel .lux-stats-grid {
    font-size: 9px !important;
  }

  #lux-stats-panel .lux-stats-history {
    font-size: 8px !important;
  }
}



/* =========================================================
   OPERATIVA ADAPTATIVA · ABRE SEGÚN ESPACIO v53
   ========================================================= */

#lux-trade-mini-panel {
  transform-origin: center top;
}

#lux-trade-mini-panel.lux-open-down {
  display: flex;
  flex-direction: column;
  transform-origin: top center;
}

#lux-trade-mini-panel.lux-open-up {
  display: flex;
  flex-direction: column-reverse;
  transform-origin: bottom center;
}

/* Cuando abre arriba, el borde visual del encabezado queda abajo. */
#lux-trade-mini-panel.lux-open-up .lux-trade-mini-toggle {
  border-bottom: 0 !important;
  border-top: 1px solid rgba(255,255,255,.07) !important;
}

/* Cuando abre abajo, comportamiento tradicional. */
#lux-trade-mini-panel.lux-open-down .lux-trade-mini-toggle {
  border-top: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
}

#lux-trade-mini-panel .lux-trade-mini-body {
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

/* Plegado: sólo encabezado, sin dirección forzada. */
#lux-trade-mini-panel.is-collapsed {
  display: block;
}

@media (max-width: 767.98px) {
  #lux-trade-mini-panel .lux-trade-mini-body {
    max-height: min(46dvh, 360px);
  }
}



/* =========================================================
   NAV MOBILE · 6 BOTONES + HERRAMIENTAS v55
   ========================================================= */
@media (max-width: 767.98px) {
  .lux-trading-app-nav {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }

  .lux-trading-app-nav-item[data-trading-action="tools"] {
    display: flex !important;
    min-width: 0 !important;
  }

  .lux-trading-app-nav-item span:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}



/* =========================================================
   OPERATIVA · Z-INDEX RESTAURADO v55
   ========================================================= */

/* OPERATIVA vuelve a quedar bien por encima del gráfico. */
#lux-trade-mini-panel,
#lux-trade-mini-panel.lux-user-positioned {
  z-index: 9000 !important;
}

/* LUX TRADES también conserva su nivel flotante. */
#lux-stats-panel,
#lux-stats-panel.lux-user-positioned {
  z-index: 9000 !important;
}

/* Los overlays importantes siguen mandando sobre ambos. */
#symbol-dialog.dialog-overlay,
.dialog-overlay {
  z-index: 10000 !important;
}

.sim-trading-panel {
  z-index: 12000 !important;
}

.lux-mobile-tools-sheet {
  z-index: 23500 !important;
}



/* =========================================================
   HERRAMIENTAS LATERALES · EXPANDIR NOMBRES v56
   ========================================================= */

#left-sidebar {
  position: relative;
}

.lux-tools-expand-handle-v56 {
  display: none;
}

@media (max-width: 767.98px) {
  body.lux-mobile-tools-pinned #left-sidebar {
    overflow: visible !important;
  }

  body.lux-mobile-tools-pinned .lux-tools-expand-handle-v56 {
    position: absolute;
    top: 8px;
    right: -20px;
    z-index: 120;

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

    width: 20px;
    height: 36px;
    padding: 0;

    border: 1px solid rgba(255,255,255,.12);
    border-left: 0;
    border-radius: 0 7px 7px 0;

    background: rgba(20,24,33,.97);
    color: #cfd4dd;

    font-size: 18px;
    font-weight: 700;
    line-height: 1;

    box-shadow: 3px 3px 10px rgba(0,0,0,.22);
    touch-action: manipulation;
  }

  /* Cerrado: barra fina de iconos como antes. */
  body.lux-mobile-tools-pinned #left-sidebar:not(.tools-expanded) {
    width: var(--toolbar-width) !important;
    min-width: var(--toolbar-width) !important;
  }

  /* Expandido: abre un poco hacia la derecha para mostrar nombres. */
  body.lux-mobile-tools-pinned #left-sidebar.tools-expanded {
    width: 138px !important;
    min-width: 138px !important;
    z-index: 115 !important;
    background: rgba(16,20,28,.98) !important;
    box-shadow: 8px 0 22px rgba(0,0,0,.32);
  }

  body.lux-mobile-tools-pinned #left-sidebar.tools-expanded .tool-btn {
    width: 126px !important;
    min-width: 126px !important;
    justify-content: flex-start !important;
    gap: 8px !important;
    padding: 0 8px !important;
  }

  body.lux-mobile-tools-pinned #left-sidebar.tools-expanded .tool-btn .tool-label,
  body.lux-mobile-tools-pinned #left-sidebar.tools-expanded .tool-btn span:last-child:not(.tool-icon) {
    display: inline !important;
    opacity: 1 !important;
    visibility: visible !important;
    max-width: 92px !important;

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

    font-size: 9px !important;
  }
}

/* =========================================================
   NAV INFERIOR · SEPARAR TEXTOS v56
   ========================================================= */

@media (max-width: 767.98px) {
  .lux-trading-app-nav {
    column-gap: 2px !important;
    padding-left: 3px !important;
    padding-right: 3px !important;
  }

  .lux-trading-app-nav-item {
    min-width: 0 !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
    gap: 3px !important;
  }

  .lux-trading-app-nav-item > span:last-child {
    width: 100%;
    max-width: 100%;

    display: block !important;

    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;

    font-size: 8.5px !important;
    letter-spacing: -.12px !important;
    line-height: 1.05 !important;
    text-align: center !important;
  }

  /* Herramientas es la palabra más larga: un poco más compacta. */
  .lux-trading-app-nav-item[data-trading-action="tools"] > span:last-child {
    font-size: 7.7px !important;
    letter-spacing: -.25px !important;
  }

  .lux-trading-app-nav-item[data-trading-action="indicators"] > span:last-child {
    font-size: 8px !important;
  }

  .lux-trading-app-nav-trading > span:last-child {
    font-size: 9px !important;
  }
}



/* =========================================================
   OPERATIVA · CAPA SUPERIOR MOBILE v57
   ========================================================= */

/*
 * Cuando el usuario mueve OPERATIVA hacia la parte inferior,
 * no debe quedar escondida detrás de la barra de mercado ni del nav.
 * Conservamos los modales importantes por encima.
 */
#lux-trade-mini-panel,
#lux-trade-mini-panel.lux-user-positioned {
  z-index: 22000 !important;
}

/* LUX TRADES mantiene su nivel normal sobre el gráfico. */
#lux-stats-panel,
#lux-stats-panel.lux-user-positioned {
  z-index: 9000 !important;
}

/* Nav inferior queda debajo de OPERATIVA. */
.lux-trading-app-nav {
  z-index: 20000 !important;
}

/* Panel de herramientas puede seguir apareciendo por encima cuando se abre. */
.lux-mobile-tools-sheet {
  z-index: 23500 !important;
}

/* Buscar símbolo y Trading Demo siempre deben ganar a OPERATIVA. */
#symbol-dialog.dialog-overlay,
.dialog-overlay {
  z-index: 24000 !important;
}

.sim-trading-panel {
  z-index: 25000 !important;
}

@media (max-width: 767.98px) {
  #lux-trade-mini-panel,
  #lux-trade-mini-panel.lux-user-positioned {
    z-index: 22000 !important;
  }
}


/* =========================================================
   HERRAMIENTAS LATERALES · CONTROLES INTERNOS v58
   ========================================================= */

.lux-tools-expand-handle-v56 {
  display: none !important;
}

@media (max-width: 767.98px) {
  body.lux-mobile-tools-pinned #left-sidebar {
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  /* El botón de nombres vive DENTRO de la barra, no tapa el símbolo. */
  body.lux-mobile-tools-pinned #left-sidebar .tools-expand-btn {
    display: flex !important;
    flex: 0 0 auto;
  }

  /* Barra compacta */
  body.lux-mobile-tools-pinned #left-sidebar:not(.tools-expanded) {
    width: var(--lux-tools-collapsed-width) !important;
    min-width: var(--lux-tools-collapsed-width) !important;
  }

  /* Barra expandida con nombres */
  body.lux-mobile-tools-pinned #left-sidebar.tools-expanded {
    width: var(--lux-tools-expanded-width) !important;
    min-width: var(--lux-tools-expanded-width) !important;
    z-index: 115 !important;
  }

  /* Botón para esconder completamente el lateral. */
  .lux-tools-hide-sidebar {
    width: 34px;
    min-width: 34px;
    min-height: 34px;

    margin: 6px auto 8px;
    padding: 0;

    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0;

    overflow: hidden;

    border: 1px solid rgba(239,83,80,.18);
    border-radius: 6px;

    background: rgba(239,83,80,.055);
    color: #d6a0a0;
  }

  #left-sidebar.tools-expanded .lux-tools-hide-sidebar {
    width: calc(100% - 12px);
    min-width: calc(100% - 12px);

    margin-left: 6px;
    margin-right: 6px;

    gap: 7px;
    padding-right: 8px;
  }

  .lux-tools-hide-sidebar .lux-tool-icon {
    width: 32px;
    min-width: 32px;
    height: 32px;

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

    font-size: 17px;
  }

  .lux-tools-hide-sidebar .lux-tool-name {
    max-width: 0;
    opacity: 0;
    overflow: hidden;
    white-space: nowrap;

    font-size: 9px;
    font-weight: 700;
  }

  #left-sidebar.tools-expanded .lux-tools-hide-sidebar .lux-tool-name {
    max-width: 110px;
    opacity: .92;
  }
}



/* =========================================================
   PRECIO + CONTADOR INTEGRADO v72
   ========================================================= */
#chart-container { position: relative; }

#lux-current-price-badge-v72 {
  position: absolute;
  right: 0;
  z-index: 44;

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

  display: none;
  flex-direction: column;
  justify-content: center;

  overflow: hidden;
  border: 1px solid;
  border-radius: 2px 0 0 2px;

  color: #fff;
  pointer-events: none;
  box-sizing: border-box;
  font-variant-numeric: tabular-nums;
}

#lux-current-price-badge-v72 .lux-current-price-value {
  padding: 2px 5px 1px;
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  line-height: 15px;
  text-align: center;
  white-space: nowrap;
}

#lux-current-price-badge-v72 .lux-current-price-countdown {
  padding: 0 5px 2px;
  border-top: 1px solid rgba(255,255,255,.20);
  color: #fff;
  font-size: 8px;
  font-weight: 700;
  line-height: 12px;
  text-align: center;
}

@media (max-width: 767.98px) {
  #lux-current-price-badge-v72 {
    min-width: 62px;
    min-height: 30px;
  }

  #lux-current-price-badge-v72 .lux-current-price-value {
    font-size: 9px;
    line-height: 14px;
  }

  #lux-current-price-badge-v72 .lux-current-price-countdown {
    font-size: 7.5px;
    line-height: 11px;
  }
}



/* =========================================================
   SL / TP · GUARDADO + FEEDBACK v73
   ========================================================= */
.sim-save-risk:disabled {
  opacity: .72;
  cursor: wait;
}

.sim-risk-editor input.sim-risk-dirty {
  outline: 1px solid rgba(212,175,55,.45);
  box-shadow: 0 0 0 2px rgba(212,175,55,.06);
}


/* =========================================================
   NAV MOBILE · APROVECHAR SAFE AREA iPHONE v78
   =========================================================
   Antes el nav completo se elevaba por env(safe-area-inset-bottom)
   Y además volvía a sumar ese espacio dentro de su alto/padding.
   En iPhone PWA eso dejaba una franja negra grande debajo.
   Ahora el marco llega al borde inferior y sólo reservamos el safe-area
   DENTRO del nav para los controles.
   ========================================================= */
@media (max-width: 767.98px) {
  :root {
    --lux-trading-app-nav-content-h: 58px;
    --lux-trading-app-nav-total-h:
      calc(var(--lux-trading-app-nav-content-h) + env(safe-area-inset-bottom));
  }

  .lux-trading-app-nav {
    /* Clave: no levantar TODO el nav por el safe area. */
    bottom: 0 !important;

    left: 4px !important;
    right: 4px !important;

    box-sizing: border-box !important;
    height: var(--lux-trading-app-nav-total-h) !important;
    min-height: var(--lux-trading-app-nav-total-h) !important;

    /* El safe area queda adentro, no debajo del nav. */
    padding:
      2px
      3px
      max(3px, env(safe-area-inset-bottom))
      3px !important;

    align-items: start !important;
    border-radius: 14px 14px 0 0 !important;
  }

  .lux-trading-app-nav-item {
    height: 52px !important;
    min-height: 52px !important;
    align-self: start !important;
  }

  .lux-nav-trade-circle {
    margin-top: -8px !important;
  }

  /*
   * El gráfico/panel sólo reserva lo que realmente ocupa el nav.
   * Evita sumar safe-area dos veces.
   */
  .app {
    padding-bottom: var(--lux-trading-app-nav-total-h) !important;
  }

  .right-sidebar,
  .right-sidebar.mobile-watchlist-open {
    bottom: var(--lux-trading-app-nav-total-h) !important;
  }

  .mobile-watchlist-toggle {
    bottom: calc(var(--lux-trading-app-nav-total-h) + 6px) !important;
  }

  .sim-trading-panel {
    padding-bottom: var(--lux-trading-app-nav-total-h) !important;
  }
}

/*
 * En iPhone instalado (standalone) aprovechamos todavía mejor el borde.
 * La zona segura sigue quedando dentro del propio nav.
 */
@media (max-width: 767.98px) and (display-mode: standalone) {
  .lux-trading-app-nav {
    left: 0 !important;
    right: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
  }
}


/* =========================================================
   DIBUJOS MOBILE · PRIORIDAD SOBRE PAN DEL GRÁFICO v81
   ========================================================= */
#chart-container.mobile-drawing-drag,
#chart-container.mobile-drawing-drag * {
  touch-action: none !important;
  overscroll-behavior: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
}


/* =========================================================
   TRADINGVIEW-LIKE DRAWING EDIT v83
   ========================================================= */
@media (pointer: coarse) {
  #chart-container.mobile-drawing-drag {
    touch-action: none !important;
    overscroll-behavior: none !important;
    -webkit-user-select: none !important;
    user-select: none !important;
  }

  #chart-container.mobile-drawing-drag canvas,
  #chart-container.mobile-drawing-drag svg {
    touch-action: none !important;
  }
}


/* =========================================================
   SELECCIÓN / ELIMINAR DIBUJOS v84
   ========================================================= */
.drawing-edit-delete--v84 {
  color: #ff6b68 !important;
  border-color: rgba(239,83,80,.42) !important;
  background: rgba(239,83,80,.10) !important;
  font-size: 14px !important;
}

.drawing-edit-delete--v84:active {
  transform: scale(.94);
  background: rgba(239,83,80,.22) !important;
}

@media (max-width: 767.98px) {
  .drawing-edit-toolbar {
    /* Mantiene el toolbar dentro del área visible del chart. */
    z-index: 17000 !important;
  }

  .drawing-edit-delete--v84 {
    width: 34px !important;
    min-width: 34px !important;
    height: 29px !important;
    min-height: 29px !important;
    flex: 0 0 34px !important;
  }
}


/* =========================================================
   BARRA INFERIOR DE MERCADO · LIBERAR FECHAS v85
   ========================================================= */
@media (max-width: 767.98px) {
  .bottom-panel,
  #bottom-panel {
    /*
     * La subimos apenas para que la escala temporal/fechas no quede
     * tapada detrás de la barra gris.
     */
    bottom: calc(
      var(--lux-native-nav-h, calc(62px + env(safe-area-inset-bottom)))
      + 24px
    ) !important;
  }

  .bottom-panel.expanded,
  .bottom-panel.is-expanded,
  #bottom-panel.expanded,
  #bottom-panel.is-expanded {
    bottom: calc(
      var(--lux-native-nav-h, calc(62px + env(safe-area-inset-bottom)))
      + 24px
    ) !important;
  }

  /* Mientras hay un objeto seleccionado, cualquier gesto pertenece
     primero al dibujo; la navegación vuelve al tocar vacío. */
  #chart-container.lux-drawing-selected-v85 {
    overscroll-behavior: none !important;
  }
}


/* =========================================================
   /PROBAR · EXPERIENCIA COMPLETA DE ANÁLISIS v91
   Mantiene bloqueada la lógica privada/guardado, pero devuelve
   navegación, indicadores, herramientas y watchlist.
   ========================================================= */
@media (max-width: 767.98px) {
  body:has(.lux-demo-banner) {
    padding-bottom:
      calc(var(--lux-trading-app-nav-h, 64px) + env(safe-area-inset-bottom))
      !important;
  }

  body:has(.lux-demo-banner) .lux-trading-app-nav {
    display: grid !important;
  }

  body:has(.lux-demo-banner) .mobile-watchlist-toggle {
    bottom:
      calc(
        var(--lux-trading-app-nav-h, 64px) +
        env(safe-area-inset-bottom) +
        4px
      ) !important;
  }

  body:has(.lux-demo-banner) .bottom-panel,
  body:has(.lux-demo-banner) #bottom-panel {
    bottom:
      calc(
        var(--lux-trading-app-nav-h, 64px) +
        env(safe-area-inset-bottom) +
        18px
      ) !important;
  }

  .lux-demo-banner {
    position: relative;
    z-index: 180 !important;
  }
}


/* =========================================================
   REPRODUCCIÓN DE BARRAS · FLOTANTE MOVIBLE v93
   Desktop + mobile + /probar.
   ========================================================= */
#replay-toolbar.replay-toolbar {
  z-index: 50050 !important;
  max-width: calc(100vw - 12px) !important;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}

#replay-toolbar .replay-drag-handle-v93 {
  flex: 0 0 30px;
  width: 30px;
  min-width: 30px;
  height: 30px;
  min-height: 30px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid rgba(212,175,55,.24);
  border-radius: 6px;
  background: rgba(212,175,55,.065);
  color: #d7ba62;
  font-size: 18px;
  line-height: 1;
  cursor: grab;
  touch-action: none !important;
}

#replay-toolbar .replay-drag-handle-v93:active,
#replay-toolbar.is-dragging-v93 .replay-drag-handle-v93 {
  cursor: grabbing;
  background: rgba(212,175,55,.14);
  border-color: rgba(212,175,55,.46);
}

#replay-toolbar.is-dragging-v93 {
  box-shadow:
    0 14px 34px rgba(0,0,0,.58),
    0 0 0 1px rgba(212,175,55,.16) !important;
}

@media (max-width: 767.98px) {
  #replay-toolbar.replay-toolbar {
    max-width: calc(100vw - 10px) !important;
    padding: 6px 7px !important;
    gap: 5px !important;
  }

  #replay-toolbar .replay-info {
    max-width: 170px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #replay-toolbar .replay-drag-handle-v93 {
    flex-basis: 28px;
    width: 28px;
    min-width: 28px;
    height: 29px;
    min-height: 29px;
  }

  .lux-mobile-replay-item {
    border-color: rgba(212,175,55,.28) !important;
  }

  .lux-mobile-replay-item.active {
    background: rgba(212,175,55,.12) !important;
    border-color: rgba(212,175,55,.48) !important;
    color: #f0d279 !important;
  }

  .lux-mobile-delete-selected:disabled {
    opacity: .36 !important;
    pointer-events: none !important;
  }
}

/* =========================================================
   DIBUJOS · MISMO COMPORTAMIENTO DESKTOP/MOBILE v93
   La selección/drag tiene prioridad sobre el pane.
   ========================================================= */
#chart-container.mobile-drawing-drag,
#chart-container.lux-drawing-selected-v85 {
  overscroll-behavior: none !important;
}

#chart-container.mobile-drawing-drag canvas {
  touch-action: none !important;
}

@media (pointer: coarse) {
  .drawing-edit-toolbar {
    z-index: 51000 !important;
  }
}


/* =========================================================
   REPLAY DRAG FIX v96 · iOS / Android / Desktop
   ========================================================= */
#replay-toolbar .replay-drag-handle-v93 {
  touch-action: none !important;
  -webkit-user-select: none !important;
  user-select: none !important;
  cursor: grab !important;
}

html.lux-replay-dragging-v96,
html.lux-replay-dragging-v96 body {
  overscroll-behavior: none !important;
  touch-action: none !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

html.lux-replay-dragging-v96 #replay-toolbar {
  cursor: grabbing !important;
}

/* El panel siempre queda por encima de la NAV y controles de trading. */
#replay-toolbar.replay-toolbar {
  z-index: 52000 !important;
}


/* =========================================================
   REPLAY COMPACTO Y MOVIBLE DENTRO DEL GRÁFICO · v99
   Corrige reglas antiguas que lo estiraban como panel gigante.
   ========================================================= */
#replay-toolbar.replay-toolbar {
  position: fixed !important;

  right: auto !important;
  bottom: auto !important;

  width: max-content !important;
  min-width: 0 !important;
  max-width: min(760px, calc(100vw - 12px)) !important;

  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;

  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;

  padding: 6px 7px !important;
  gap: 5px !important;

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

  border: 1px solid #363a45 !important;
  border-radius: 8px !important;

  background: rgba(30,34,45,.97) !important;
  box-shadow: 0 6px 24px rgba(0,0,0,.45) !important;

  z-index: 52000 !important;
}

@media (max-width: 767.98px) {
  #replay-toolbar.replay-toolbar {
    right: auto !important;
    bottom: auto !important;

    width: max-content !important;
    min-width: 0 !important;
    max-width: calc(100vw - 12px) !important;

    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }
}

/* El agarre amarillo sólo mueve; el resto de botones conserva interacción. */
#replay-toolbar .replay-drag-handle-v93 {
  flex: 0 0 30px !important;
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
  touch-action: none !important;
}


/* =========================================================
   REPLAY FINAL · v100
   Aplica a trading autenticado + /probar demo.
   Compacto, cerrable y movible X/Y dentro del gráfico.
   ========================================================= */
#replay-toolbar.replay-toolbar {
  position: fixed !important;
  right: auto !important;
  bottom: auto !important;

  width: max-content !important;
  min-width: 0 !important;
  max-width: calc(100vw - 18px) !important;

  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;

  display: flex;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;

  padding: 6px 7px !important;
  gap: 5px !important;

  overflow: visible !important;
  touch-action: manipulation !important;

  border: 1px solid #363a45 !important;
  border-radius: 8px !important;
  background: rgba(30,34,45,.97) !important;
  box-shadow: 0 6px 24px rgba(0,0,0,.45) !important;
  z-index: 52000 !important;
}

#replay-toolbar .replay-btn {
  flex: 0 0 auto !important;
  touch-action: manipulation !important;
}

#replay-toolbar .replay-drag-handle-v93 {
  touch-action: none !important;
  flex: 0 0 30px !important;
  width: 30px !important;
  min-width: 30px !important;
  height: 32px !important;
  min-height: 32px !important;
  cursor: grab !important;
}

#replay-toolbar .replay-close-v100 {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  margin-left: 1px !important;
  position: relative !important;
  z-index: 3 !important;
  pointer-events: auto !important;
}

@media (max-width: 767.98px) {
  #replay-toolbar.replay-toolbar {
    width: max-content !important;
    max-width: calc(100vw - 14px) !important;
    padding: 5px 6px !important;
    gap: 4px !important;
    overflow: visible !important;
  }

  #replay-toolbar .replay-info {
    display: none !important;
  }

  #replay-toolbar .replay-play-v100 {
    width: 38px !important;
    min-width: 38px !important;
    height: 32px !important;
    padding: 0 !important;
  }

  #replay-toolbar .replay-restart-v100 {
    width: 34px !important;
    min-width: 34px !important;
    height: 32px !important;
    padding: 0 !important;
  }

  #replay-toolbar select.replay-btn {
    width: 58px !important;
    min-width: 58px !important;
    height: 32px !important;
    padding: 0 22px 0 7px !important;
  }

  #replay-toolbar .replay-btn {
    height: 32px !important;
    min-height: 32px !important;
  }
}


/* =========================================================
   REPLAY CIERRE REAL · v104
   El estado oculto tiene prioridad absoluta.
   Aplica a Trading real y /probar DEMO.
   ========================================================= */
#replay-toolbar.replay-toolbar[aria-hidden="true"] {
  display: none !important;
}


/* =========================================================
   MOBILE · INFO DE MERCADO ARRIBA DEL GRÁFICO · v105
   Prioridad absoluta: PAR + TEMPORALIDAD + ESCALA DE PRECIO.
   Sólo mobile. Desktop queda exactamente igual.
   ========================================================= */
@media (max-width: 767.98px) {
  .bottom-panel,
  #bottom-panel {
    position: fixed !important;

    left: var(--lux-market-info-left-v105, 190px) !important;
    right: auto !important;
    top: var(--lux-market-info-top-v105, calc(var(--header-height, 44px) + 6px)) !important;
    bottom: auto !important;

    width: var(--lux-market-info-width-v105, calc(100vw - 285px)) !important;
    max-width: var(--lux-market-info-width-v105, calc(100vw - 285px)) !important;

    height: 22px !important;
    min-height: 22px !important;
    max-height: 22px !important;

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

    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;

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

    white-space: nowrap !important;

    border: 1px solid rgba(54,58,69,.70) !important;
    border-radius: 5px !important;

    background: rgba(19,23,34,.88) !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.18) !important;

    z-index: 37 !important;

    scrollbar-width: none !important;
    overscroll-behavior-x: contain !important;
    touch-action: pan-x !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .bottom-panel::-webkit-scrollbar,
  #bottom-panel::-webkit-scrollbar {
    display: none !important;
  }

  .bottom-panel .bp-stat,
  #bottom-panel .bp-stat {
    height: 20px !important;
    min-height: 20px !important;
    padding: 0 6px !important;
    gap: 3px !important;

    flex: 0 0 auto !important;

    font-size: 7.5px !important;
    line-height: 1 !important;
  }

  .bottom-panel .bp-label,
  #bottom-panel .bp-label {
    font-size: 7px !important;
  }

  .bottom-panel .bp-value,
  #bottom-panel .bp-value {
    font-size: 7.5px !important;
  }

  .bottom-panel .bp-live,
  #bottom-panel .bp-live {
    flex: 0 0 auto !important;
    margin-left: 0 !important;
    padding: 0 6px !important;
    font-size: 7px !important;
  }

  /* Si no queda espacio por un par/TF largo, gana el par/TF:
     la barra secundaria desaparece antes de taparlo o pisar precios. */
  #bottom-panel.lux-market-info-too-tight-v105 {
    display: none !important;
  }

  /* Las reglas antiguas de "barra inferior" ya no aplican en mobile. */
  .bottom-panel.expanded,
  .bottom-panel.is-expanded,
  #bottom-panel.expanded,
  #bottom-panel.is-expanded {
    top: var(--lux-market-info-top-v105, calc(var(--header-height, 44px) + 6px)) !important;
    bottom: auto !important;
    height: 22px !important;
    max-height: 22px !important;
  }
}


/* =========================================================
   WATCHLIST · DETALLE DEL ACTIVO SELECCIONADO
   Cambio visual aislado. No modifica chart, indicadores ni herramientas.
   ========================================================= */

.right-sidebar .watchlist {
    min-height: 0;
    overflow: hidden;
}

.right-sidebar .watchlist-rows {
    flex: 0 1 48%;
    min-height: 150px;
    max-height: 48%;
    overflow-y: auto;
    overscroll-behavior: contain;
    border-bottom: 1px solid var(--tv-border-strong);
}

.right-sidebar .watchlist-row {
    min-height: 34px;
    padding-top: 3px;
    padding-bottom: 3px;
}

.wl-selected-detail {
    flex: 1 1 auto;
    min-height: 230px;
    overflow-y: auto;
    padding: 15px 16px 18px;
    background: #11151e;
    border-top: 5px solid #0d111a;
}

.wl-detail-top {
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 0;
}

.wl-detail-logo-slot {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.wl-detail-logo-slot .wl-logo,
.wl-detail-logo-slot .wl-logo-large {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    border-radius: 50%;
    overflow: hidden;
}

.wl-detail-logo-slot .wl-logo img,
.wl-detail-logo-slot .wl-logo-large img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}

.wl-detail-identity {
    min-width: 0;
    flex: 1;
}

.wl-detail-symbol-line {
    display: flex;
    align-items: baseline;
    gap: 5px;
    min-width: 0;
}

.wl-detail-symbol {
    color: #f0f3fa;
    font-size: 17px;
    line-height: 1.15;
    font-weight: 700;
}

.wl-detail-quote {
    color: var(--tv-text-muted);
    font-size: 12px;
}

.wl-detail-name {
    margin-top: 5px;
    overflow: hidden;
    color: #c9cdd5;
    font-size: 11px;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wl-detail-market {
    margin-top: 3px;
    color: var(--tv-text-dim);
    font-size: 9px;
    letter-spacing: .04em;
}

.wl-detail-price-line {
    display: flex;
    align-items: baseline;
    gap: 5px;
    margin-top: 20px;
}

.wl-detail-price {
    color: #f0f3fa;
    font-size: 31px;
    line-height: 1;
    font-weight: 650;
    letter-spacing: -.02em;
}

.wl-detail-currency {
    color: #d1d4dc;
    font-size: 11px;
    font-weight: 600;
}

.wl-detail-change {
    margin-top: 8px;
    font-size: 15px;
    font-weight: 650;
}

.wl-detail-status {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    color: var(--tv-green);
    font-size: 11px;
}

.wl-detail-status-dot {
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: var(--tv-green);
}

@media (max-width: 768px) {
    .right-sidebar .watchlist-rows {
        flex-basis: 52%;
        max-height: 52%;
        min-height: 130px;
    }

    .wl-selected-detail {
        min-height: 190px;
        padding: 12px 14px 16px;
    }

    .wl-detail-price {
        font-size: 27px;
    }
}


/* LUX FLOATING CHAT v125 · fuera del DOM del gráfico */
#chart-container a[href*="tradingview.com"]{opacity:0!important;pointer-events:none!important}

#lux-floating-chat-btn{
  position:fixed;left:10px;bottom:10px;z-index:99990;
  width:38px;height:38px;padding:0;border-radius:50%;overflow:hidden;
  border:1px solid rgba(212,175,55,.75);background:#090a0d;
  box-shadow:0 4px 18px rgba(0,0,0,.48);cursor:pointer
}
#lux-floating-chat-btn img{display:block;width:100%;height:100%;object-fit:cover}

.lux-floating-chat[hidden]{display:none!important}
.lux-floating-chat{
  position:fixed;left:10px;bottom:58px;z-index:99991;
  width:min(360px,calc(100vw - 20px));height:min(500px,calc(100vh - 110px));
  display:flex;flex-direction:column;overflow:hidden;
  border:1px solid rgba(212,175,55,.42);border-radius:15px;
  background:#0a0c11;box-shadow:0 20px 55px rgba(0,0,0,.7)
}
.lux-floating-chat-head{
  min-height:58px;padding:10px 12px 10px 14px;display:flex;
  align-items:center;justify-content:space-between;border-bottom:1px solid #20232b
}
.lux-floating-chat-head div{display:flex;flex-direction:column}
.lux-floating-chat-head strong{color:#f1f3f6;font-size:14px}
.lux-floating-chat-head small{color:#8d929d;font-size:10px}
#lux-floating-chat-close{width:32px;height:32px;border:0;border-radius:8px;background:#171a20;color:#bbb;cursor:pointer}
.lux-floating-chat-messages{flex:1;min-height:0;overflow:auto;padding:12px;display:flex;flex-direction:column;gap:8px}
.lux-chat-msg{width:fit-content;max-width:88%;padding:8px 10px;border-radius:10px;background:#181c24;color:#e8eaf0;font-size:12px;word-break:break-word}
.lux-chat-msg.mine{align-self:flex-end;background:#203a31}
.lux-chat-msg.other{align-self:flex-start}
.lux-chat-msg.system{align-self:center;color:#a3a8b2;background:rgba(212,175,55,.08)}
.lux-chat-msg-head{display:flex;justify-content:space-between;gap:12px;margin-bottom:3px}
.lux-chat-msg-head small{color:#d8b54a;font-weight:700}
.lux-chat-msg-head button{border:0;background:transparent;cursor:pointer}
.lux-chat-msg img,.lux-chat-msg video{display:block;max-width:100%;max-height:220px;margin-top:6px;border-radius:8px}
.lux-floating-chat-form{display:grid;grid-template-columns:minmax(0,1fr) 36px 38px;gap:6px;padding:9px;border-top:1px solid #20232b}
#lux-floating-chat-input{min-width:0;height:38px;padding:0 11px;border:1px solid #292e38;border-radius:9px;background:#151820;color:#fff;outline:none;font-size:16px}
#lux-floating-chat-file-btn,#lux-floating-chat-send{height:38px;border:1px solid #2b3039;border-radius:9px;background:#191d25;color:#ddd;cursor:pointer}
#lux-floating-chat-send{background:#c49a2e;color:#090909;border-color:#d4af37;font-weight:800}

@media(max-width:768px){
  #lux-floating-chat-btn{left:8px;bottom:calc(70px + env(safe-area-inset-bottom));width:35px;height:35px}
  .lux-floating-chat{left:8px;right:8px;bottom:calc(112px + env(safe-area-inset-bottom));width:auto;height:min(60vh,460px)}
}


/* LUX CHAT v127 · teclado mobile */
@media(max-width:768px){
  .lux-floating-chat.lux-keyboard-open{
    left:6px !important;
    right:6px !important;
    width:auto !important;
    border-radius:12px !important;
  }

  .lux-floating-chat.lux-keyboard-open .lux-floating-chat-head{
    flex:0 0 auto !important;
  }

  .lux-floating-chat.lux-keyboard-open .lux-floating-chat-messages{
    flex:1 1 auto !important;
    min-height:0 !important;
    overflow-y:auto !important;
  }

  .lux-floating-chat.lux-keyboard-open .lux-floating-chat-form{
    flex:0 0 auto !important;
    position:relative !important;
    bottom:auto !important;
  }

  .lux-floating-chat.lux-keyboard-open #lux-floating-chat-input{
    font-size:16px !important;
  }
}


/* =========================================================
   LUX SHARE CARD v123 · aislado del resto de Trading
   ========================================================= */
.sim-card-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.sim-share-btn{
  border:1px solid rgba(212,175,55,.55);background:rgba(212,175,55,.09);
  color:#e8c75b;border-radius:8px;padding:7px 10px;font:inherit;font-size:11px;
  font-weight:700;cursor:pointer;white-space:nowrap
}
.sim-share-btn:hover{background:rgba(212,175,55,.17);border-color:#d4af37}
.lux-share-modal{
  position:fixed;inset:0;z-index:100000;display:none;align-items:center;justify-content:center;
  padding:18px;background:rgba(0,0,0,.82);backdrop-filter:blur(8px)
}
.lux-share-modal.open{display:flex}
.lux-share-dialog{
  width:min(430px,96vw);max-height:94vh;display:flex;flex-direction:column;
  background:#0c0d10;border:1px solid rgba(212,175,55,.5);border-radius:18px;
  box-shadow:0 24px 80px rgba(0,0,0,.7);overflow:hidden
}
.lux-share-head{display:flex;align-items:center;justify-content:space-between;padding:13px 15px;border-bottom:1px solid rgba(255,255,255,.08);color:#f5f5f5}
.lux-share-head button{width:34px;height:34px;border:0;border-radius:9px;background:#181a20;color:#c8cbd3;font-size:18px;cursor:pointer}
.lux-share-preview{padding:12px;overflow:auto;background:#050506;text-align:center}
.lux-share-preview img{display:block;width:100%;height:auto;border-radius:10px;border:1px solid rgba(212,175,55,.25)}
.lux-share-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:12px;border-top:1px solid rgba(255,255,255,.08)}
.lux-share-actions button{min-height:42px;border-radius:10px;border:1px solid rgba(212,175,55,.4);background:#17181d;color:#f2f2f2;font-weight:700;cursor:pointer}
.lux-share-actions .lux-share-native{background:linear-gradient(135deg,#b88a16,#e0ba4a);color:#090909;border-color:#e0ba4a}
@media(max-width:600px){
  .sim-card-head{align-items:flex-start;gap:8px}
  .sim-card-actions{gap:5px}
  .sim-share-btn,.sim-card-close{font-size:10px;padding:6px 8px}
  .lux-share-modal{padding:8px}
  .lux-share-dialog{width:100%;max-height:96vh;border-radius:14px}
}


/* =========================================================
   LUX CHAT + ALERTAS REALTIME v132
   ========================================================= */
#lux-floating-chat-btn.has-unread::after{
  content:"";position:absolute;right:0;top:0;width:9px;height:9px;border-radius:50%;
  background:#ef5350;border:2px solid #090a0d;box-sizing:content-box
}
.lux-chat-msg img{cursor:zoom-in}
.lux-trading-image-viewer{
  position:fixed;inset:0;z-index:120000;display:flex;align-items:center;justify-content:center;
  padding:20px;background:rgba(3,5,8,.92);backdrop-filter:blur(8px)
}
.lux-trading-image-viewer-inner{position:relative;max-width:94vw;max-height:92dvh;display:flex;align-items:center;justify-content:center}
.lux-trading-image-viewer img{max-width:94vw;max-height:88dvh;object-fit:contain;border-radius:10px;border:1px solid rgba(212,175,55,.35);box-shadow:0 20px 70px rgba(0,0,0,.7)}
.lux-trading-image-viewer-close{position:absolute;right:-12px;top:-14px;z-index:2;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:#171a20;color:#fff;font-size:24px;line-height:1;cursor:pointer}
#lux-trading-toast-host{position:fixed;right:12px;top:58px;z-index:110000;display:grid;gap:8px;width:min(330px,calc(100vw - 24px));pointer-events:none}
.lux-trading-toast{transform:translateY(-7px);opacity:0;transition:.18s ease;padding:11px 12px;border:1px solid rgba(212,175,55,.30);border-radius:10px;background:rgba(14,17,23,.97);box-shadow:0 12px 35px rgba(0,0,0,.38);display:flex;flex-direction:column;gap:3px}
.lux-trading-toast.show{transform:none;opacity:1}.lux-trading-toast strong{color:#ead174;font-size:11px}.lux-trading-toast span{color:#d8dce4;font-size:10px;line-height:1.35}
#lux-trading-notification-tool{position:relative}.lux-trading-bell{font-size:18px;color:#d4af37;line-height:1}.lux-trading-realtime-connected #lux-trading-notification-tool::after{content:"";position:absolute;right:4px;top:4px;width:6px;height:6px;border-radius:50%;background:#26a69a;box-shadow:0 0 7px rgba(38,166,154,.8)}
.lux-trading-alert-settings{position:fixed;left:58px;top:58px;z-index:108000;width:min(360px,calc(100vw - 74px));display:none;padding:13px;border:1px solid rgba(212,175,55,.32);border-radius:13px;background:rgba(13,16,22,.985);box-shadow:0 20px 60px rgba(0,0,0,.55);color:#e7eaf0}
.lux-trading-alert-settings.open{display:block}.lux-trading-alert-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.lux-trading-alert-head>div{display:flex;flex-direction:column;gap:2px}.lux-trading-alert-head small{font-size:8px;color:#d4af37;letter-spacing:.12em;font-weight:800}.lux-trading-alert-head strong{font-size:13px;color:#f2f3f5}.lux-trading-alert-head button{width:30px;height:30px;border:1px solid #2a2e39;border-radius:7px;background:#171b26;color:#c8ccd4;font-size:19px;cursor:pointer}
.lux-trading-alert-row{display:grid;grid-template-columns:minmax(0,1fr) 38px;gap:10px;align-items:center;padding:10px 3px;border-top:1px solid rgba(255,255,255,.055)}.lux-trading-alert-row>div{display:flex;flex-direction:column;gap:2px}.lux-trading-alert-row strong{font-size:11px;color:#e5e7eb}.lux-trading-alert-row small{font-size:9px;color:#8e95a1;line-height:1.35}.lux-trading-alert-row input{appearance:none;width:36px;height:20px;border-radius:999px;border:1px solid #363c4a;background:#252a36;position:relative;cursor:pointer}.lux-trading-alert-row input::after{content:"";position:absolute;width:14px;height:14px;left:2px;top:2px;border-radius:50%;background:#7c818b;transition:.16s}.lux-trading-alert-row input:checked{background:rgba(212,175,55,.20);border-color:rgba(212,175,55,.55)}.lux-trading-alert-row input:checked::after{left:18px;background:#d4af37}.lux-trading-alert-status{margin-top:8px;padding:8px 9px;border-radius:8px;background:#171b26;color:#9298a3;font-size:9px}.lux-trading-alert-status span{margin-right:6px;color:#5e626d}.lux-trading-alert-status.online span{color:#26a69a}
@media(max-width:768px){#lux-trading-toast-host{top:8px;right:8px;width:calc(100vw - 16px)}.lux-trading-alert-settings{left:8px;right:8px;top:auto;bottom:calc(78px + env(safe-area-inset-bottom));width:auto;max-height:calc(100dvh - 100px);overflow:auto}.lux-trading-image-viewer{padding:8px}.lux-trading-image-viewer-close{right:4px;top:4px}}


/* =========================================================
   LUX TRADING MOBILE · NOTIFICACIONES EN HERRAMIENTAS v126
   ========================================================= */
@media (max-width: 767.98px) {
  #lux-mobile-notification-tool {
    border-color: rgba(212,175,55,.32);
    background: linear-gradient(180deg, rgba(212,175,55,.09), #181d27);
    color: #e9d27b;
  }

  #lux-mobile-notification-tool .lux-mobile-notification-icon {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    border: 1px solid rgba(212,175,55,.42);
    color: #d4af37;
    font-size: 15px;
    line-height: 1;
    background: rgba(212,175,55,.06);
  }

  .lux-trading-realtime-connected #lux-mobile-notification-tool .lux-mobile-notification-icon {
    box-shadow: 0 0 0 3px rgba(38,166,154,.08), 0 0 12px rgba(38,166,154,.14);
  }
}



/* =========================================================
   LUX WATCHLIST MOBILE v182
   Objetivo: mostrar ~6 pares visibles y compactar detalle inferior.
   PEGAR AL FINAL de trading.css
   ========================================================= */

@media (max-width: 768px) {

  /* Más altura útil para Radar / Watchlist en mobile. */
  #right-sidebar,
  #right-sidebar.mobile-watchlist-open {
    height: min(72dvh, 560px) !important;
    max-height: calc(100dvh - 105px) !important;
  }

  /* La watchlist ocupa todo el alto disponible de su pestaña. */
  #right-sidebar > #watchlist,
  #right-sidebar > .watchlist {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  /* Encabezado más compacto. */
  #right-sidebar .watchlist-header {
    min-height: 34px !important;
    padding: 3px 8px !important;
    flex: 0 0 auto !important;
  }

  #right-sidebar .watchlist-cols {
    min-height: 28px !important;
    padding: 4px 8px !important;
    font-size: 8px !important;
    flex: 0 0 auto !important;
  }

  /*
   * Zona principal: dejamos suficiente alto para unas 6 filas.
   * Ya no se limita a 52% del panel.
   */
  #right-sidebar .watchlist-rows {
    flex: 1 1 auto !important;
    min-height: 228px !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* Filas un poco más compactas sin hacerlas incómodas al tacto. */
  #right-sidebar .watchlist-row {
    min-height: 36px !important;
    height: 36px !important;
    padding: 3px 8px !important;
  }

  #right-sidebar .watchlist-row .wl-logo {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
  }

  #right-sidebar .watchlist-row .wl-symbol-text .wl-base {
    font-size: 11px !important;
  }

  /*
   * Detalle inferior mucho más chico.
   * Sigue mostrando identidad, precio, cambio y estado.
   */
  #right-sidebar .wl-selected-detail {
    flex: 0 0 112px !important;
    min-height: 112px !important;
    max-height: 112px !important;
    overflow: hidden !important;
    padding: 8px 10px 9px !important;
    border-top-width: 2px !important;
  }

  #right-sidebar .wl-detail-top {
    gap: 8px !important;
  }

  #right-sidebar .wl-detail-logo-slot {
    width: 32px !important;
    height: 32px !important;
    flex-basis: 32px !important;
  }

  #right-sidebar .wl-detail-logo-slot .wl-logo,
  #right-sidebar .wl-detail-logo-slot .wl-logo-large {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
  }

  #right-sidebar .wl-detail-symbol {
    font-size: 14px !important;
  }

  #right-sidebar .wl-detail-quote {
    font-size: 10px !important;
  }

  /* Ocultamos datos secundarios SOLO en mobile para ganar espacio. */
  #right-sidebar .wl-detail-name,
  #right-sidebar .wl-detail-market {
    display: none !important;
  }

  #right-sidebar .wl-detail-price-line {
    margin-top: 8px !important;
  }

  #right-sidebar .wl-detail-price {
    font-size: 19px !important;
  }

  #right-sidebar .wl-detail-currency {
    font-size: 9px !important;
  }

  #right-sidebar .wl-detail-change {
    margin-top: 4px !important;
    font-size: 12px !important;
  }

  #right-sidebar .wl-detail-status {
    margin-top: 5px !important;
    font-size: 9px !important;
  }
}

/* Teléfonos angostos: aprovechamos todavía más la altura. */
@media (max-width: 430px) {
  #right-sidebar,
  #right-sidebar.mobile-watchlist-open {
    height: min(74dvh, 560px) !important;
    max-height: calc(100dvh - 96px) !important;
  }

  #right-sidebar .watchlist-rows {
    min-height: 216px !important;
  }

  #right-sidebar .wl-selected-detail {
    flex-basis: 104px !important;
    min-height: 104px !important;
    max-height: 104px !important;
  }
}



/* =========================================================
   LUX RADAR v181 · RADAR / WATCHLIST
   Pegar AL FINAL de trading.css
   ========================================================= */

#right-sidebar .lux-radar-sidebar-header {
  height: auto !important;
  min-height: 0 !important;
  padding: 7px 8px 6px !important;
  display: block !important;
  border-bottom: 1px solid rgba(212, 175, 55, .15) !important;
  background: #11161e !important;
}

#right-sidebar .lux-radar-tabs-host {
  width: 100%;
  min-width: 0;
}

#right-sidebar .lux-right-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 3px;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 8px;
  background: #0b0f15;
}

#right-sidebar .lux-right-tab {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  outline: 0;
  min-width: 0;
  height: 29px;
  padding: 0 8px;
  border-radius: 6px;
  background: transparent;
  color: #8f98a6;
  font: 700 10px/1 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: .04em;
  text-transform: uppercase;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  box-shadow: none;
}

#right-sidebar .lux-right-tab:hover {
  color: #e9edf3;
  background: rgba(255, 255, 255, .045);
}

#right-sidebar .lux-right-tab.active {
  color: #f3d36a;
  background: rgba(212, 175, 55, .12);
  box-shadow: inset 0 0 0 1px rgba(212, 175, 55, .28);
}

#right-sidebar .lux-radar-count,
.lux-radar-mobile-badge {
  min-width: 17px;
  height: 17px;
  padding: 0 5px;
  border-radius: 999px;
  background: #e84d4d;
  color: #fff;
  font: 800 9px/17px system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  text-align: center;
}

#right-sidebar .lux-radar-mode {
  margin-top: 6px;
  padding: 0 2px;
  color: #a8b0bc;
  font: 600 9px/1.35 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: .02em;
}

/* Las pestañas son excluyentes: nunca Radar + Watchlist juntos. */
#right-sidebar .lux-radar-panel[hidden],
#right-sidebar #watchlist[hidden] {
  display: none !important;
}

#right-sidebar .lux-radar-panel {
  min-height: 0;
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  padding: 8px;
  background: #0d1219;
}

#right-sidebar .lux-radar-empty {
  min-height: 145px;
  padding: 18px 12px;
  border: 1px dashed rgba(255, 255, 255, .09);
  border-radius: 9px;
  background: rgba(255, 255, 255, .018);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  text-align: center;
}

#right-sidebar .lux-radar-empty strong {
  color: #e9edf3;
  font: 750 12px/1.3 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#right-sidebar .lux-radar-empty small {
  color: #7f8997;
  font: 500 10px/1.45 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#right-sidebar .lux-radar-empty button,
#right-sidebar #lux-radar-refresh {
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid rgba(212, 175, 55, .28);
  border-radius: 7px;
  background: rgba(212, 175, 55, .09);
  color: #e7c75d;
  cursor: pointer;
  font: 750 10px/1 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  box-shadow: none;
}

#right-sidebar .lux-radar-empty button {
  margin-top: 4px;
  height: 28px;
  padding: 0 11px;
}

#right-sidebar .lux-radar-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
}

#right-sidebar .lux-radar-summary > div {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

#right-sidebar .lux-radar-summary strong {
  color: #eef1f5;
  font: 800 11px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#right-sidebar .lux-radar-summary small {
  color: #7f8997;
  font: 600 9px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#right-sidebar #lux-radar-refresh {
  width: 29px;
  height: 29px;
  padding: 0;
  flex: 0 0 29px;
  font-size: 15px;
}

#right-sidebar .lux-radar-cards {
  display: flex;
  flex-direction: column;
  gap: 7px;
}

#right-sidebar .lux-radar-card {
  appearance: none;
  -webkit-appearance: none;
  width: 100%;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid rgba(255, 255, 255, .075);
  border-left: 3px solid #d4af37;
  border-radius: 8px;
  background: #121923;
  color: #e9edf3;
  text-align: left;
  cursor: pointer;
  box-shadow: none;
}

#right-sidebar .lux-radar-card:hover {
  background: #151e29;
  border-color: rgba(212, 175, 55, .22);
}

#right-sidebar .lux-radar-card.confirmed.long { border-left-color: #20b486; }
#right-sidebar .lux-radar-card.confirmed.short { border-left-color: #ef5b5b; }
#right-sidebar .lux-radar-card.waiting { border-left-color: #f0a94b; }
#right-sidebar .lux-radar-card.possible { border-left-color: #e0c24d; }

#right-sidebar .lux-radar-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

#right-sidebar .lux-radar-card-top strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font: 800 11px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#right-sidebar .lux-radar-card-top span {
  flex: 0 0 auto;
  color: #99a3b0;
  font: 700 9px/1 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#right-sidebar .lux-radar-status {
  margin-top: 6px;
  display: flex;
  align-items: center;
  gap: 5px;
}

#right-sidebar .lux-radar-status i {
  color: #d4af37;
  font-style: normal;
  font-size: 8px;
}

#right-sidebar .lux-radar-card.confirmed.long .lux-radar-status i { color: #20b486; }
#right-sidebar .lux-radar-card.confirmed.short .lux-radar-status i { color: #ef5b5b; }
#right-sidebar .lux-radar-card.waiting .lux-radar-status i { color: #f0a94b; }

#right-sidebar .lux-radar-status b {
  font: 800 9px/1.2 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: .025em;
}

#right-sidebar .lux-radar-detail {
  margin-top: 4px;
  color: #7f8997;
  font: 500 9px/1.35 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#right-sidebar .lux-radar-open {
  margin-top: 7px;
  color: #d4af37;
  font: 800 8px/1 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: .05em;
}

#right-sidebar .lux-radar-partial {
  margin-top: 7px;
  color: #d49f61;
  font: 600 9px/1.35 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#right-sidebar .lux-radar-pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #d4af37;
  box-shadow: 0 0 0 0 rgba(212, 175, 55, .45);
  animation: luxRadarPulseV181 1.45s ease-out infinite;
}

@keyframes luxRadarPulseV181 {
  0% { box-shadow: 0 0 0 0 rgba(212, 175, 55, .42); }
  70% { box-shadow: 0 0 0 8px rgba(212, 175, 55, 0); }
  100% { box-shadow: 0 0 0 0 rgba(212, 175, 55, 0); }
}

@media (max-width: 768px) {
  #right-sidebar .lux-radar-sidebar-header {
    padding: 6px !important;
  }

  #right-sidebar .lux-right-tab {
    height: 28px;
    font-size: 9px;
  }

  #right-sidebar .lux-radar-panel {
    padding: 7px;
  }

  .lux-radar-mobile-badge {
    margin-left: 3px;
    flex: 0 0 auto;
  }
}

/* =========================================================
   LUX WATCHLIST MOBILE v182
   Objetivo: mostrar ~6 pares visibles y compactar detalle inferior.
   PEGAR AL FINAL de trading.css
   ========================================================= */

@media (max-width: 768px) {

  /* Más altura útil para Radar / Watchlist en mobile. */
  #right-sidebar,
  #right-sidebar.mobile-watchlist-open {
    height: min(72dvh, 560px) !important;
    max-height: calc(100dvh - 105px) !important;
  }

  /* La watchlist ocupa todo el alto disponible de su pestaña. */
  #right-sidebar > #watchlist,
  #right-sidebar > .watchlist {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  /* Encabezado más compacto. */
  #right-sidebar .watchlist-header {
    min-height: 34px !important;
    padding: 3px 8px !important;
    flex: 0 0 auto !important;
  }

  #right-sidebar .watchlist-cols {
    min-height: 28px !important;
    padding: 4px 8px !important;
    font-size: 8px !important;
    flex: 0 0 auto !important;
  }

  /*
   * Zona principal: dejamos suficiente alto para unas 6 filas.
   * Ya no se limita a 52% del panel.
   */
  #right-sidebar .watchlist-rows {
    flex: 1 1 auto !important;
    min-height: 228px !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* Filas un poco más compactas sin hacerlas incómodas al tacto. */
  #right-sidebar .watchlist-row {
    min-height: 36px !important;
    height: 36px !important;
    padding: 3px 8px !important;
  }

  #right-sidebar .watchlist-row .wl-logo {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
  }

  #right-sidebar .watchlist-row .wl-symbol-text .wl-base {
    font-size: 11px !important;
  }

  /*
   * Detalle inferior mucho más chico.
   * Sigue mostrando identidad, precio, cambio y estado.
   */
  #right-sidebar .wl-selected-detail {
    flex: 0 0 112px !important;
    min-height: 112px !important;
    max-height: 112px !important;
    overflow: hidden !important;
    padding: 8px 10px 9px !important;
    border-top-width: 2px !important;
  }

  #right-sidebar .wl-detail-top {
    gap: 8px !important;
  }

  #right-sidebar .wl-detail-logo-slot {
    width: 32px !important;
    height: 32px !important;
    flex-basis: 32px !important;
  }

  #right-sidebar .wl-detail-logo-slot .wl-logo,
  #right-sidebar .wl-detail-logo-slot .wl-logo-large {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
  }

  #right-sidebar .wl-detail-symbol {
    font-size: 14px !important;
  }

  #right-sidebar .wl-detail-quote {
    font-size: 10px !important;
  }

  /* Ocultamos datos secundarios SOLO en mobile para ganar espacio. */
  #right-sidebar .wl-detail-name,
  #right-sidebar .wl-detail-market {
    display: none !important;
  }

  #right-sidebar .wl-detail-price-line {
    margin-top: 8px !important;
  }

  #right-sidebar .wl-detail-price {
    font-size: 19px !important;
  }

  #right-sidebar .wl-detail-currency {
    font-size: 9px !important;
  }

  #right-sidebar .wl-detail-change {
    margin-top: 4px !important;
    font-size: 12px !important;
  }

  #right-sidebar .wl-detail-status {
    margin-top: 5px !important;
    font-size: 9px !important;
  }
}

/* Teléfonos angostos: aprovechamos todavía más la altura. */
@media (max-width: 430px) {
  #right-sidebar,
  #right-sidebar.mobile-watchlist-open {
    height: min(74dvh, 560px) !important;
    max-height: calc(100dvh - 96px) !important;
  }

  #right-sidebar .watchlist-rows {
    min-height: 216px !important;
  }

  #right-sidebar .wl-selected-detail {
    flex-basis: 104px !important;
    min-height: 104px !important;
    max-height: 104px !important;
  }
}


/* =========================================================
   LUX TERMINAL SHELL · v197
   Reestructuración visual completa de Trading.
   Sólo presentación: conserva IDs, overlays, toolbars y lógica JS.
   ========================================================= */

body.lux-terminal-shell-v197 {
  --lux-shell-bg: #06080c;
  --lux-shell-panel: #0d1016;
  --lux-shell-panel-2: #11151d;
  --lux-shell-card: #141922;
  --lux-shell-border: rgba(255,255,255,.075);
  --lux-shell-border-soft: rgba(255,255,255,.045);
  --lux-shell-gold: #d4af37;
  --lux-shell-gold-2: #f0cf67;
  --lux-shell-gold-soft: rgba(212,175,55,.11);
  --lux-shell-text: #edf0f4;
  --lux-shell-muted: #8d96a3;
  --lux-shell-dim: #606976;
  background: var(--lux-shell-bg);
}

body.lux-terminal-shell-v197 .app {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(circle at 72% -18%, rgba(212,175,55,.055), transparent 34%),
    linear-gradient(180deg, #080b10 0%, #06080c 100%);
}

body.lux-terminal-shell-v197 .app::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .18;
  background-image:
    linear-gradient(rgba(255,255,255,.014) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.012) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(to bottom, #000, transparent 72%);
}

/* Command bar wrapper agregado en HTML; todos los controles internos mantienen IDs. */
body.lux-terminal-shell-v197 .lux-market-commandbar-v197 {
  min-width: 0;
  display: flex;
  align-items: center;
}

body.lux-terminal-shell-v197 .lux-sidebar-eyebrow-v197 {
  display: block;
  margin-bottom: 2px;
  color: rgba(212,175,55,.76);
  font-size: 7px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: .14em;
}

/* =========================================================
   DESKTOP · TERMINAL PROFESIONAL
   ========================================================= */
@media (min-width: 769px) {
  body.lux-terminal-shell-v197 {
    --header-height: 60px;
    --toolbar-width: 52px;
    --watchlist-width: 304px;
    --bottom-height: 31px;
  }

  body.lux-terminal-shell-v197 .lux-terminal-header-v197 {
    gap: 9px;
    padding: 7px 10px;
    background:
      linear-gradient(180deg, rgba(18,22,30,.985), rgba(10,13,18,.985));
    border-bottom: 1px solid rgba(212,175,55,.14);
    box-shadow:
      0 8px 24px rgba(0,0,0,.24),
      inset 0 -1px 0 rgba(255,255,255,.015);
  }

  body.lux-terminal-shell-v197 .header-left {
    flex: 1 1 auto;
    min-width: 0;
    gap: 7px;
    overflow: visible;
  }

  body.lux-terminal-shell-v197 .header-left > .header-divider:first-of-type {
    display: none;
  }

  body.lux-terminal-shell-v197 .lux-header-nav {
    height: 44px;
    flex: 0 0 auto;
    gap: 8px;
    padding: 4px 6px;
    border: 1px solid rgba(212,175,55,.25);
    border-radius: 11px;
    background:
      linear-gradient(145deg, rgba(22,26,34,.98), rgba(11,14,19,.98));
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025),
      0 6px 18px rgba(0,0,0,.22);
  }

  body.lux-terminal-shell-v197 .lux-header-back {
    height: 34px;
    padding: 0 10px;
    border: 1px solid rgba(212,175,55,.14);
    border-radius: 8px;
    background: rgba(212,175,55,.055);
    color: var(--lux-shell-gold-2);
  }

  body.lux-terminal-shell-v197 .lux-header-back:hover {
    border-color: rgba(212,175,55,.34);
    background: rgba(212,175,55,.12);
    color: #fff4cd;
  }

  body.lux-terminal-shell-v197 .lux-header-brand img {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border-color: rgba(212,175,55,.38);
    box-shadow: 0 0 0 1px rgba(212,175,55,.05), 0 5px 14px rgba(0,0,0,.34);
  }

  body.lux-terminal-shell-v197 .lux-header-name {
    font-size: 12px;
    font-weight: 760;
    letter-spacing: -.015em;
  }

  body.lux-terminal-shell-v197 .lux-header-subtitle {
    margin-top: 2px;
    color: var(--lux-shell-gold);
    font-size: 7px;
    letter-spacing: .13em;
  }

  body.lux-terminal-shell-v197 .lux-header-user {
    max-width: 112px;
    color: #707988;
  }

  body.lux-terminal-shell-v197 .lux-market-commandbar-v197 {
    flex: 1 1 auto;
    height: 44px;
    gap: 3px;
    padding: 4px;
    overflow-x: auto;
    overflow-y: visible;
    scrollbar-width: none;
    border: 1px solid var(--lux-shell-border);
    border-radius: 11px;
    background:
      linear-gradient(180deg, rgba(15,19,26,.96), rgba(10,13,18,.96));
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.018),
      0 5px 16px rgba(0,0,0,.17);
  }

  body.lux-terminal-shell-v197 .lux-market-commandbar-v197::-webkit-scrollbar {
    display: none;
  }

  body.lux-terminal-shell-v197 .lux-market-commandbar-v197 .header-divider {
    height: 24px;
    margin: 0 3px;
    background: rgba(255,255,255,.075);
  }

  body.lux-terminal-shell-v197 .lux-market-commandbar-v197 .header-control {
    min-height: 34px;
    border-radius: 8px;
    color: #cdd3db;
  }

  body.lux-terminal-shell-v197 .lux-market-commandbar-v197 .header-control:hover {
    background: rgba(255,255,255,.055);
    border-color: rgba(255,255,255,.055);
    color: #fff;
  }

  body.lux-terminal-shell-v197 .symbol-btn {
    min-width: 108px;
    justify-content: flex-start;
    padding: 0 10px;
    border-color: rgba(212,175,55,.16) !important;
    background: rgba(212,175,55,.045) !important;
  }

  body.lux-terminal-shell-v197 .symbol-btn:hover {
    border-color: rgba(212,175,55,.32) !important;
    background: rgba(212,175,55,.09) !important;
  }

  body.lux-terminal-shell-v197 .symbol-btn .control-icon,
  body.lux-terminal-shell-v197 .symbol-btn .control-chevron {
    color: #c9a943;
  }

  body.lux-terminal-shell-v197 .symbol-label {
    color: #f2f4f7;
    font-size: 12px;
    font-weight: 720;
  }

  body.lux-terminal-shell-v197 .timeframe-selector {
    height: 34px;
    gap: 2px;
    padding: 2px;
    border-color: rgba(255,255,255,.055);
    border-radius: 8px;
    background: rgba(255,255,255,.018);
  }

  body.lux-terminal-shell-v197 .tf-btn {
    height: 28px;
    min-width: 32px;
    border: 1px solid transparent;
    border-radius: 6px;
    color: #8f98a5;
    font-weight: 680;
  }

  body.lux-terminal-shell-v197 .tf-btn:hover {
    background: rgba(255,255,255,.055);
    color: #eef1f5;
  }

  body.lux-terminal-shell-v197 .tf-btn.active {
    border-color: rgba(212,175,55,.26);
    background: rgba(212,175,55,.11);
    color: #f1d67e;
    box-shadow: inset 0 0 0 1px rgba(212,175,55,.035);
  }

  body.lux-terminal-shell-v197 #indicator-menu-btn .control-icon {
    color: #d6b64c;
  }

  body.lux-terminal-shell-v197 .lux-session-cluster-v197 {
    height: 44px;
    flex: 0 0 auto;
    gap: 3px;
    padding: 4px;
    border: 1px solid var(--lux-shell-border);
    border-radius: 11px;
    background: rgba(12,15,21,.92);
  }

  body.lux-terminal-shell-v197 .market-status {
    height: 34px;
    margin: 0;
    padding: 0 9px;
    border-radius: 7px;
    background: rgba(38,166,154,.05);
  }

  body.lux-terminal-shell-v197 .market-status-dot {
    width: 7px;
    height: 7px;
    box-shadow: 0 0 0 3px rgba(38,166,154,.08), 0 0 9px rgba(38,166,154,.7);
  }

  body.lux-terminal-shell-v197 .whatsapp-link {
    height: 34px;
    border-radius: 7px;
    color: #aeb5bf;
  }

  body.lux-terminal-shell-v197 .whatsapp-link:hover {
    background: rgba(37,211,102,.06);
    border-color: rgba(37,211,102,.12);
    color: #e4f7ea;
  }

  /* Estructura principal en paneles separados: más limpia y con más profundidad. */
  body.lux-terminal-shell-v197 .lux-terminal-workspace-v197 {
    gap: 6px;
    padding: 6px;
    background: transparent;
  }

  body.lux-terminal-shell-v197 .lux-tool-dock-v197 {
    width: 50px;
    min-width: 50px;
    padding: 6px 6px 9px;
    border: 1px solid var(--lux-shell-border);
    border-radius: 11px;
    background:
      linear-gradient(180deg, rgba(18,22,30,.98), rgba(10,13,18,.98));
    box-shadow: 0 8px 24px rgba(0,0,0,.20);
  }

  body.lux-terminal-shell-v197 .left-sidebar .tool-btn {
    width: 36px;
    height: 36px;
    min-width: 36px;
    min-height: 36px;
    border-radius: 8px;
    color: #929ba7;
  }

  body.lux-terminal-shell-v197 .left-sidebar .tool-btn:hover {
    color: #f0f2f5;
    background: rgba(255,255,255,.055);
    border-color: rgba(255,255,255,.05);
  }

  body.lux-terminal-shell-v197 .left-sidebar .tool-btn.active {
    color: #171205;
    background: linear-gradient(145deg, #e5c75d, #c89f2d);
    border-color: #f0d775;
    box-shadow: 0 5px 14px rgba(212,175,55,.19);
  }

  body.lux-terminal-shell-v197 .left-sidebar .tool-btn.active::after {
    left: -7px;
    top: 9px;
    bottom: 9px;
    width: 2px;
    background: #f0cf67;
  }

  body.lux-terminal-shell-v197 .left-sidebar .tool-sep {
    width: 27px;
    background: rgba(255,255,255,.07);
  }

  body.lux-terminal-shell-v197 .lux-terminal-center-v197 {
    border-radius: 11px;
  }

  body.lux-terminal-shell-v197 .lux-chart-stage-v197 {
    border: 1px solid var(--lux-shell-border);
    border-radius: 11px 11px 0 0;
    background: #0b0e14;
    box-shadow:
      0 10px 30px rgba(0,0,0,.19),
      inset 0 1px 0 rgba(255,255,255,.012);
  }

  body.lux-terminal-shell-v197 .lux-chart-stage-v197::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.008);
  }

  body.lux-terminal-shell-v197 .lux-market-footer-v197 {
    height: 31px;
    min-height: 31px;
    border: 1px solid var(--lux-shell-border);
    border-top: 0;
    border-radius: 0 0 11px 11px;
    background: linear-gradient(180deg, #10141b, #0c0f15);
    box-shadow: 0 7px 18px rgba(0,0,0,.14);
  }

  body.lux-terminal-shell-v197 .bottom-panel .bp-stat {
    border-right-color: rgba(255,255,255,.055);
  }

  body.lux-terminal-shell-v197 .bottom-panel .bp-label {
    color: #68717e;
  }

  body.lux-terminal-shell-v197 .bottom-panel .bp-value {
    color: #cdd2d9;
  }

  body.lux-terminal-shell-v197 .lux-market-sidebar-v197 {
    width: 304px;
    min-width: 304px;
    border: 1px solid var(--lux-shell-border);
    border-radius: 11px;
    background:
      linear-gradient(180deg, rgba(17,21,29,.985), rgba(9,12,17,.985));
    box-shadow: 0 10px 28px rgba(0,0,0,.22);
  }

  body.lux-terminal-shell-v197 .right-sidebar-header {
    height: 56px;
    padding: 0 13px;
    border-bottom-color: rgba(255,255,255,.065);
    background: linear-gradient(180deg, rgba(255,255,255,.018), transparent);
  }

  body.lux-terminal-shell-v197 .sidebar-title {
    color: #edf0f4;
    font-size: 12px;
    font-weight: 720;
  }

  body.lux-terminal-shell-v197 .sidebar-subtitle {
    color: #68717d;
  }

  body.lux-terminal-shell-v197 .watchlist-collapse-btn {
    left: -20px;
    width: 20px;
    height: 54px;
    border-color: rgba(255,255,255,.09);
    border-radius: 8px 0 0 8px;
    background: #0f131a;
    color: #7c8591;
    box-shadow: -4px 0 14px rgba(0,0,0,.22);
  }

  body.lux-terminal-shell-v197 .watchlist-collapse-btn:hover {
    border-color: rgba(212,175,55,.22);
    background: #171c25;
    color: #e7c960;
  }

  body.lux-terminal-shell-v197 .right-sidebar.watchlist-collapsed .watchlist-collapse-btn {
    left: -20px;
  }

  body.lux-terminal-shell-v197 .watchlist-header,
  body.lux-terminal-shell-v197 .watchlist-cols {
    border-bottom-color: rgba(255,255,255,.055);
  }

  body.lux-terminal-shell-v197 .watchlist-row {
    min-height: 39px;
    border-bottom-color: rgba(255,255,255,.035);
  }

  body.lux-terminal-shell-v197 .watchlist-row:hover {
    background: rgba(255,255,255,.035);
  }

  body.lux-terminal-shell-v197 .watchlist-row.active {
    background: linear-gradient(90deg, rgba(212,175,55,.10), rgba(212,175,55,.025));
    box-shadow: inset 2px 0 0 #d4af37;
  }

  body.lux-terminal-shell-v197 .watchlist-row.active .wl-base {
    color: #f2dda0;
  }

  body.lux-terminal-shell-v197 .wl-selected-detail {
    border-top-color: #090c11;
    background:
      radial-gradient(circle at 90% 0%, rgba(212,175,55,.045), transparent 36%),
      #0c1016;
  }

  /* Menús / diálogos dentro de la misma identidad visual. */
  body.lux-terminal-shell-v197 .dropdown-content {
    border-color: rgba(212,175,55,.16);
    border-radius: 11px;
    background: rgba(16,20,28,.985);
    box-shadow: 0 18px 44px rgba(0,0,0,.52);
  }

  body.lux-terminal-shell-v197 .dropdown-item {
    border-radius: 7px;
  }

  body.lux-terminal-shell-v197 .dropdown-item:hover {
    background: rgba(212,175,55,.065);
  }

  body.lux-terminal-shell-v197 .dropdown-check {
    color: #d4af37;
  }

  body.lux-terminal-shell-v197 .dialog-overlay {
    background: rgba(2,4,7,.72);
    backdrop-filter: blur(7px);
  }

  body.lux-terminal-shell-v197 .dialog {
    border-color: rgba(212,175,55,.18);
    border-radius: 14px;
    background: linear-gradient(180deg, #141821, #0c0f15);
    box-shadow: 0 28px 70px rgba(0,0,0,.62);
  }

  /* Floating trading / stats: sólo estética, posición y drag siguen intactos. */
  body.lux-terminal-shell-v197 #lux-trade-mini-panel,
  body.lux-terminal-shell-v197 #lux-stats-panel {
    border-color: rgba(212,175,55,.18) !important;
    background: rgba(10,13,18,.94) !important;
    box-shadow: 0 14px 34px rgba(0,0,0,.34) !important;
    backdrop-filter: blur(10px);
  }

  body.lux-terminal-shell-v197 .sim-trading-panel {
    border-left-color: rgba(212,175,55,.17);
    background: #0b0f15;
    box-shadow: -20px 0 50px rgba(0,0,0,.38);
  }

  body.lux-terminal-shell-v197 .sim-tabs button.active {
    color: #f0d47b;
    border-bottom-color: #d4af37;
    background: rgba(212,175,55,.055);
  }

  body.lux-terminal-shell-v197 #sim-trading-btn {
    border-color: rgba(212,175,55,.18);
    background: rgba(212,175,55,.055);
  }

  body.lux-terminal-shell-v197 #sim-trading-btn .control-icon {
    color: #d4af37;
  }
}

/* =========================================================
   MOBILE · APP TERMINAL
   Mantiene toda la lógica y alturas ya resueltas en versiones anteriores.
   ========================================================= */
@media (max-width: 768px) {
  body.lux-terminal-shell-v197 {
    --lux-mobile-surface: #0a0d12;
  }

  body.lux-terminal-shell-v197 .lux-terminal-header-v197 {
    gap: 2px;
    padding-left: 4px;
    padding-right: 4px;
    border-bottom-color: rgba(212,175,55,.16);
    background: rgba(8,11,15,.975);
    box-shadow: 0 5px 18px rgba(0,0,0,.26);
  }

  body.lux-terminal-shell-v197 .lux-market-commandbar-v197 {
    flex: 0 0 auto;
    gap: 2px;
    padding: 0;
    border: 0;
    background: transparent;
  }

  body.lux-terminal-shell-v197 .lux-market-commandbar-v197 .header-divider {
    margin: 0 1px;
    background: rgba(255,255,255,.07);
  }

  body.lux-terminal-shell-v197 .symbol-btn {
    border: 1px solid rgba(212,175,55,.17) !important;
    border-radius: 7px;
    background: rgba(212,175,55,.05) !important;
  }

  body.lux-terminal-shell-v197 .symbol-btn .control-icon,
  body.lux-terminal-shell-v197 .symbol-btn .control-chevron {
    color: #c7a744;
  }

  body.lux-terminal-shell-v197 .timeframe-selector {
    border-color: rgba(255,255,255,.065);
    border-radius: 7px;
    background: rgba(255,255,255,.018);
  }

  body.lux-terminal-shell-v197 .tf-btn.active {
    background: rgba(212,175,55,.12);
    color: #f0d477;
    box-shadow: inset 0 0 0 1px rgba(212,175,55,.12);
  }

  body.lux-terminal-shell-v197 #indicator-menu-btn .control-icon {
    color: #d4af37;
  }

  body.lux-terminal-shell-v197 .left-sidebar {
    background: linear-gradient(180deg, #11151c, #0a0d12);
    border-right-color: rgba(255,255,255,.06);
  }

  body.lux-terminal-shell-v197 .left-sidebar .tool-btn.active {
    color: #171205;
    background: linear-gradient(145deg, #e4c75c, #c49b2d);
    border-color: #ecd16e;
    box-shadow: 0 4px 12px rgba(212,175,55,.20);
  }

  body.lux-terminal-shell-v197 .left-sidebar .tool-btn.active::after {
    background: #f1d36d;
  }

  body.lux-terminal-shell-v197 .lux-terminal-mobile-nav-v197 {
    border-top: 1px solid rgba(212,175,55,.16) !important;
    background:
      linear-gradient(180deg, rgba(15,19,25,.98), rgba(6,8,12,.99)) !important;
    box-shadow: 0 -12px 32px rgba(0,0,0,.40) !important;
    backdrop-filter: blur(14px);
  }

  body.lux-terminal-shell-v197 .lux-trading-app-nav-item {
    color: #7e8794;
  }

  body.lux-terminal-shell-v197 .lux-trading-app-nav-item.active,
  body.lux-terminal-shell-v197 .lux-trading-app-nav-item:active {
    color: #e6c85f;
  }

  body.lux-terminal-shell-v197 .lux-nav-trade-circle {
    border-color: #efd574 !important;
    background: linear-gradient(145deg, #e5c75d, #bd9225) !important;
    color: #171205 !important;
    box-shadow:
      0 0 0 4px rgba(212,175,55,.10),
      0 8px 20px rgba(0,0,0,.34),
      0 0 18px rgba(212,175,55,.12) !important;
  }

  body.lux-terminal-shell-v197 .right-sidebar,
  body.lux-terminal-shell-v197 .right-sidebar.mobile-watchlist-open {
    border-color: rgba(212,175,55,.18) !important;
    background: linear-gradient(180deg, #11151d, #090c11) !important;
    box-shadow: 0 -16px 38px rgba(0,0,0,.48) !important;
  }

  body.lux-terminal-shell-v197 .right-sidebar-header {
    border-bottom-color: rgba(255,255,255,.055);
  }

  body.lux-terminal-shell-v197 .watchlist-row.active {
    background: linear-gradient(90deg, rgba(212,175,55,.11), rgba(212,175,55,.025));
    box-shadow: inset 2px 0 0 #d4af37;
  }

  body.lux-terminal-shell-v197 .dropdown-content,
  body.lux-terminal-shell-v197 #indicator-menu-content.dropdown-content.open {
    border-color: rgba(212,175,55,.18) !important;
    background: rgba(14,18,25,.985) !important;
  }

  body.lux-terminal-shell-v197 .dialog {
    border-color: rgba(212,175,55,.18);
    border-radius: 14px;
    background: #0d1118;
  }

  body.lux-terminal-shell-v197 #lux-trade-mini-panel,
  body.lux-terminal-shell-v197 #lux-stats-panel {
    border-color: rgba(212,175,55,.18) !important;
    background: rgba(9,12,17,.95) !important;
    backdrop-filter: blur(10px);
  }

  body.lux-terminal-shell-v197 .sim-trading-panel {
    background: #090c11;
  }
}

@media (max-width: 430px) {
  body.lux-terminal-shell-v197 .lux-market-commandbar-v197 {
    gap: 1px;
  }

  body.lux-terminal-shell-v197 .symbol-btn {
    padding-left: 5px;
    padding-right: 5px;
  }

  body.lux-terminal-shell-v197 .lux-sidebar-eyebrow-v197 {
    font-size: 6.5px;
  }
}


/* =========================================================
   v198 · TOOLBAR IZQUIERDA
   Oculta visualmente la barra de scroll, pero mantiene
   rueda del mouse, trackpad y desplazamiento táctil.
   ========================================================= */
.left-sidebar {
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}

.left-sidebar::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
}


/* =====================================================================
   LUX TRADING · PREMIUM TERMINAL v199
   Reestructuración visual fuerte SIN alterar IDs ni lógica JavaScript.
   Objetivos:
   - terminal premium negra/dorada;
   - gráfico como protagonista;
   - navegación entendible para usuarios nuevos;
   - mayor jerarquía y feedback interactivo;
   - cero barras de scroll visibles, conservando scroll/touch/rueda.
   ===================================================================== */

body.lux-terminal-shell-v199 {
  --lux99-bg: #05070a;
  --lux99-bg-2: #080b10;
  --lux99-surface: #0c1016;
  --lux99-surface-2: #11161e;
  --lux99-surface-3: #151b24;
  --lux99-border: rgba(255,255,255,.07);
  --lux99-border-strong: rgba(212,175,55,.20);
  --lux99-gold: #d4af37;
  --lux99-gold-bright: #f1d36c;
  --lux99-gold-soft: rgba(212,175,55,.10);
  --lux99-text: #f2f4f7;
  --lux99-muted: #939ba7;
  --lux99-dim: #626b77;
  --lux99-green: #2bc79f;
  --lux99-red: #ef6262;
  --lux99-radius: 14px;
  --lux99-shadow: 0 18px 50px rgba(0,0,0,.28);
  background: var(--lux99-bg) !important;
}

/* Sin barras visibles en TODA la terminal. El contenido sigue scrolleando. */
body.lux-terminal-shell-v199 *,
body.lux-terminal-shell-v199 *::before,
body.lux-terminal-shell-v199 *::after {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

body.lux-terminal-shell-v199 *::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

body.lux-terminal-shell-v199 :focus-visible {
  outline: 2px solid rgba(241,211,108,.78) !important;
  outline-offset: 2px;
}

body.lux-terminal-shell-v199 .app {
  background:
    radial-gradient(circle at 58% -18%, rgba(212,175,55,.08), transparent 28%),
    radial-gradient(circle at 100% 42%, rgba(56,75,108,.05), transparent 24%),
    linear-gradient(180deg, #07090d 0%, #05070a 100%) !important;
}

/* Sutil textura de terminal, sin interferir con el gráfico. */
body.lux-terminal-shell-v199 .app::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .13;
  background:
    linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.014) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, #000 0%, transparent 76%);
}

/* ---------------------------------------------------------------------
   GUÍA RÁPIDA · interacción nativa <details>, sin JS adicional
   --------------------------------------------------------------------- */

body.lux-terminal-shell-v199 .lux-quickstart-v199 {
  position: relative;
  flex: 0 0 auto;
}

body.lux-terminal-shell-v199 .lux-quickstart-v199 > summary {
  list-style: none;
  height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 10px 0 7px;
  border: 1px solid rgba(212,175,55,.14);
  border-radius: 10px;
  background: rgba(212,175,55,.045);
  color: #c7cdd5;
  cursor: pointer;
  user-select: none;
  transition: background .16s ease, border-color .16s ease, transform .16s ease;
}

body.lux-terminal-shell-v199 .lux-quickstart-v199 > summary::-webkit-details-marker {
  display: none;
}

body.lux-terminal-shell-v199 .lux-quickstart-v199 > summary:hover,
body.lux-terminal-shell-v199 .lux-quickstart-v199[open] > summary {
  border-color: rgba(212,175,55,.34);
  background: rgba(212,175,55,.09);
  color: #fff1bd;
  transform: translateY(-1px);
}

body.lux-terminal-shell-v199 .lux-quickstart-icon-v199 {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 7px;
  background: linear-gradient(145deg, rgba(241,211,108,.18), rgba(212,175,55,.08));
  color: var(--lux99-gold-bright);
  font-size: 12px;
  font-weight: 900;
  box-shadow: inset 0 0 0 1px rgba(241,211,108,.10);
}

body.lux-terminal-shell-v199 .lux-quickstart-label-v199 {
  font-size: 10px;
  font-weight: 750;
  letter-spacing: .02em;
}

body.lux-terminal-shell-v199 .lux-quickstart-card-v199 {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 12000;
  width: min(360px, calc(100vw - 22px));
  padding: 14px;
  border: 1px solid rgba(212,175,55,.22);
  border-radius: 16px;
  background:
    radial-gradient(circle at 92% 4%, rgba(212,175,55,.09), transparent 30%),
    rgba(10,13,18,.985);
  box-shadow: 0 28px 80px rgba(0,0,0,.64);
  backdrop-filter: blur(18px);
}

body.lux-terminal-shell-v199 .lux-quickstart-head-v199 {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 12px;
  padding-bottom: 11px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}

body.lux-terminal-shell-v199 .lux-quickstart-head-v199 div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

body.lux-terminal-shell-v199 .lux-quickstart-head-v199 small {
  color: var(--lux99-gold);
  font-size: 8px;
  font-weight: 850;
  letter-spacing: .14em;
}

body.lux-terminal-shell-v199 .lux-quickstart-head-v199 strong {
  color: #f3f5f8;
  font-size: 13px;
  font-weight: 780;
}

body.lux-terminal-shell-v199 .lux-quickstart-head-v199 > span {
  flex: 0 0 auto;
  padding: 5px 8px;
  border: 1px solid rgba(212,175,55,.16);
  border-radius: 999px;
  background: rgba(212,175,55,.06);
  color: #cdb969;
  font-size: 8px;
  font-weight: 750;
}

body.lux-terminal-shell-v199 .lux-quickstart-step-v199 {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 10px;
  align-items: start;
  padding: 9px 0;
}

body.lux-terminal-shell-v199 .lux-quickstart-step-v199 > b {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(212,175,55,.20);
  border-radius: 9px;
  background: rgba(212,175,55,.07);
  color: var(--lux99-gold-bright);
  font-size: 10px;
}

body.lux-terminal-shell-v199 .lux-quickstart-step-v199 div {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

body.lux-terminal-shell-v199 .lux-quickstart-step-v199 strong {
  color: #e7eaee;
  font-size: 10px;
}

body.lux-terminal-shell-v199 .lux-quickstart-step-v199 span {
  color: #818a96;
  font-size: 9px;
  line-height: 1.45;
}

body.lux-terminal-shell-v199 .lux-quickstart-tip-v199 {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 9px;
  margin-top: 9px;
  padding: 9px 10px;
  border: 1px solid rgba(43,199,159,.12);
  border-radius: 10px;
  background: rgba(43,199,159,.045);
}

body.lux-terminal-shell-v199 .lux-quickstart-tip-v199 > span {
  color: var(--lux99-green);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .10em;
}

body.lux-terminal-shell-v199 .lux-quickstart-tip-v199 p {
  margin: 0;
  color: #87928f;
  font-size: 8.5px;
  line-height: 1.45;
}

/* ---------------------------------------------------------------------
   DESKTOP · nueva arquitectura visual
   --------------------------------------------------------------------- */

@media (min-width: 769px) {
  body.lux-terminal-shell-v199 {
    --header-height: 70px;
    --toolbar-width: 58px;
    --watchlist-width: 320px;
    --bottom-height: 36px;
  }

  /* Header = brand / mercado / ayuda-estado */
  body.lux-terminal-shell-v199 .lux-command-deck-v199 {
    height: 70px;
    min-height: 70px;
    gap: 10px;
    padding: 9px 12px;
    background:
      linear-gradient(180deg, rgba(15,19,26,.99), rgba(8,11,15,.99)) !important;
    border-bottom: 1px solid rgba(212,175,55,.16) !important;
    box-shadow:
      0 10px 30px rgba(0,0,0,.30),
      inset 0 -1px 0 rgba(255,255,255,.015);
  }

  body.lux-terminal-shell-v199 .lux-command-deck-v199::before {
    content: "";
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: -1px;
    height: 1px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(212,175,55,.28), transparent);
  }

  body.lux-terminal-shell-v199 .header-left {
    flex: 1 1 auto;
    min-width: 0;
    gap: 10px;
  }

  body.lux-terminal-shell-v199 .lux-header-nav {
    height: 50px;
    gap: 9px;
    padding: 5px 7px;
    border: 1px solid rgba(212,175,55,.20);
    border-radius: 14px;
    background:
      radial-gradient(circle at 75% 0%, rgba(212,175,55,.06), transparent 38%),
      linear-gradient(145deg, #121720, #0a0d12);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.025),
      0 10px 24px rgba(0,0,0,.22);
  }

  body.lux-terminal-shell-v199 .lux-header-back {
    height: 38px;
    min-width: 42px;
    border-radius: 10px;
    border-color: rgba(212,175,55,.15);
    background: rgba(212,175,55,.045);
    transition: transform .16s ease, background .16s ease, border-color .16s ease;
  }

  body.lux-terminal-shell-v199 .lux-header-back:hover {
    transform: translateX(-2px);
    border-color: rgba(212,175,55,.34);
    background: rgba(212,175,55,.10);
  }

  body.lux-terminal-shell-v199 .lux-header-brand {
    padding-right: 2px;
  }

  body.lux-terminal-shell-v199 .lux-header-brand img {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    border: 1px solid rgba(212,175,55,.32);
    box-shadow:
      0 0 0 3px rgba(212,175,55,.045),
      0 7px 18px rgba(0,0,0,.32);
  }

  body.lux-terminal-shell-v199 .lux-header-name {
    color: #f5f6f8;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: -.02em;
  }

  body.lux-terminal-shell-v199 .lux-header-subtitle {
    color: var(--lux99-gold);
    font-size: 7.5px;
    font-weight: 850;
    letter-spacing: .16em;
  }

  body.lux-terminal-shell-v199 .lux-header-user {
    max-width: 102px;
    color: #737c88;
    font-size: 9px;
  }

  /* Centro de control: cada grupo se entiende sin conocer la plataforma. */
  body.lux-terminal-shell-v199 .lux-market-commandbar-v199 {
    position: relative;
    flex: 1 1 auto;
    height: 50px;
    gap: 5px;
    padding: 4px;
    overflow-x: auto;
    overflow-y: visible;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 14px;
    background:
      linear-gradient(180deg, rgba(17,22,30,.95), rgba(10,13,18,.95));
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.018),
      0 9px 24px rgba(0,0,0,.17);
  }

  body.lux-terminal-shell-v199 .lux-market-commandbar-v199 > .header-divider {
    height: 30px;
    margin: 0 2px;
    background: rgba(255,255,255,.065);
  }

  body.lux-terminal-shell-v199 .symbol-btn {
    position: relative;
    height: 42px !important;
    min-width: 132px;
    justify-content: flex-start;
    padding: 13px 12px 2px !important;
    border: 1px solid rgba(212,175,55,.18) !important;
    border-radius: 10px !important;
    background:
      linear-gradient(145deg, rgba(212,175,55,.075), rgba(212,175,55,.025)) !important;
  }

  body.lux-terminal-shell-v199 .symbol-btn::before {
    content: "MERCADO";
    position: absolute;
    top: 4px;
    left: 12px;
    color: rgba(212,175,55,.68);
    font-size: 6.5px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .13em;
  }

  body.lux-terminal-shell-v199 .symbol-btn:hover {
    border-color: rgba(212,175,55,.38) !important;
    background: rgba(212,175,55,.105) !important;
    transform: translateY(-1px);
  }

  body.lux-terminal-shell-v199 .symbol-label {
    color: #f6f7f9;
    font-size: 12px;
    font-weight: 800;
  }

  body.lux-terminal-shell-v199 .timeframe-selector {
    position: relative;
    height: 42px;
    min-width: max-content;
    padding: 12px 3px 2px;
    gap: 2px;
    border: 1px solid rgba(255,255,255,.055);
    border-radius: 10px;
    background: rgba(255,255,255,.014);
  }

  body.lux-terminal-shell-v199 .timeframe-selector::before {
    content: "TEMPORALIDAD";
    position: absolute;
    top: 4px;
    left: 8px;
    color: #626b77;
    font-size: 6.5px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .12em;
    pointer-events: none;
  }

  body.lux-terminal-shell-v199 .tf-btn {
    height: 25px;
    min-width: 32px;
    padding: 0 7px;
    border: 1px solid transparent;
    border-radius: 7px;
    font-size: 9px;
    font-weight: 760;
    color: #929ba6;
    transition: transform .13s ease, color .13s ease, background .13s ease, border-color .13s ease;
  }

  body.lux-terminal-shell-v199 .tf-btn:hover {
    transform: translateY(-1px);
    background: rgba(255,255,255,.055);
    color: #f2f4f7;
  }

  body.lux-terminal-shell-v199 .tf-btn.active {
    border-color: rgba(212,175,55,.28);
    background:
      linear-gradient(145deg, rgba(212,175,55,.18), rgba(212,175,55,.08));
    color: #f3d97d;
    box-shadow: 0 4px 12px rgba(0,0,0,.18);
  }

  body.lux-terminal-shell-v199 #indicator-menu {
    position: relative;
    height: 42px;
    display: flex;
    align-items: flex-end;
  }

  body.lux-terminal-shell-v199 #indicator-menu::before {
    content: "ANÁLISIS";
    position: absolute;
    top: 4px;
    left: 10px;
    z-index: 1;
    color: #626b77;
    font-size: 6.5px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: .12em;
    pointer-events: none;
  }

  body.lux-terminal-shell-v199 #indicator-menu-btn {
    height: 42px;
    padding: 13px 11px 2px;
    border: 1px solid rgba(255,255,255,.045);
    border-radius: 10px;
    background: rgba(255,255,255,.014);
  }

  body.lux-terminal-shell-v199 #indicator-menu-btn:hover {
    border-color: rgba(212,175,55,.18);
    background: rgba(212,175,55,.055);
  }

  body.lux-terminal-shell-v199 #indicator-menu-btn .control-icon {
    color: var(--lux99-gold);
  }

  body.lux-terminal-shell-v199 .lux-session-cluster-v199 {
    height: 50px;
    gap: 5px;
    padding: 5px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 14px;
    background: linear-gradient(180deg, rgba(16,20,27,.95), rgba(9,12,17,.95));
    box-shadow: 0 9px 24px rgba(0,0,0,.18);
  }

  body.lux-terminal-shell-v199 .market-status {
    height: 38px;
    padding: 0 10px;
    border-radius: 10px;
    background: rgba(43,199,159,.045);
  }

  body.lux-terminal-shell-v199 .market-status-dot {
    width: 7px;
    height: 7px;
    background: var(--lux99-green);
    box-shadow: 0 0 0 4px rgba(43,199,159,.07), 0 0 11px rgba(43,199,159,.72);
  }

  body.lux-terminal-shell-v199 .whatsapp-link {
    height: 38px;
    padding: 0 10px;
    border-radius: 10px;
    color: #9ca5b0;
  }

  body.lux-terminal-shell-v199 .whatsapp-link:hover {
    border-color: rgba(37,211,102,.15);
    background: rgba(37,211,102,.055);
    color: #e8f8ed;
  }

  /* Workspace: dock / gráfico / inteligencia de mercado */
  body.lux-terminal-shell-v199 .lux-terminal-workspace-v199 {
    gap: 9px;
    padding: 9px;
    background: transparent;
  }

  body.lux-terminal-shell-v199 .lux-tool-dock-v199 {
    width: 56px;
    min-width: 56px;
    padding: 8px 7px 10px;
    gap: 3px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 15px;
    background:
      radial-gradient(circle at 50% 0%, rgba(212,175,55,.045), transparent 24%),
      linear-gradient(180deg, #11161e, #090c11);
    box-shadow: 0 15px 36px rgba(0,0,0,.24);
    overflow-y: auto;
    overflow-x: hidden;
  }

  body.lux-terminal-shell-v199 .lux-tool-dock-v199 .tool-btn {
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    border-radius: 10px;
    color: #8d96a2;
    transition: transform .14s ease, color .14s ease, background .14s ease, border-color .14s ease;
  }

  body.lux-terminal-shell-v199 .lux-tool-dock-v199 .tool-btn:hover {
    transform: translateX(2px);
    border-color: rgba(255,255,255,.06);
    background: rgba(255,255,255,.05);
    color: #f5f6f8;
  }

  body.lux-terminal-shell-v199 .lux-tool-dock-v199 .tool-btn.active {
    transform: none;
    border-color: rgba(241,211,108,.58);
    background: linear-gradient(145deg, #f0d36f, #c79c28);
    color: #171205;
    box-shadow:
      0 0 0 3px rgba(212,175,55,.07),
      0 8px 20px rgba(212,175,55,.16);
  }

  body.lux-terminal-shell-v199 .lux-tool-dock-v199 .tool-sep {
    width: 31px;
    margin: 4px 0;
    background: rgba(255,255,255,.065);
  }

  body.lux-terminal-shell-v199 .lux-terminal-center-v199 {
    min-width: 0;
    border-radius: 15px;
    filter: drop-shadow(0 14px 34px rgba(0,0,0,.18));
  }

  body.lux-terminal-shell-v199 .lux-chart-stage-v199 {
    border: 1px solid rgba(255,255,255,.072);
    border-radius: 15px 15px 0 0;
    background: #0a0e14;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.012),
      0 0 0 1px rgba(0,0,0,.15);
  }

  body.lux-terminal-shell-v199 .lux-chart-stage-v199::before {
    content: "LUX · LIVE MARKET";
    position: absolute;
    right: 13px;
    bottom: 10px;
    z-index: 1;
    pointer-events: none;
    color: rgba(212,175,55,.17);
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .18em;
  }

  body.lux-terminal-shell-v199 .lux-chart-stage-v199::after {
    border-radius: inherit;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.012),
      inset 0 0 0 1px rgba(255,255,255,.008);
  }

  /* Overlays más legibles sin tapar velas. */
  body.lux-terminal-shell-v199 .top-overlay {
    top: 12px;
    left: 13px;
  }

  body.lux-terminal-shell-v199 .top-overlay .row {
    width: fit-content;
    min-height: 22px;
    padding: 1px 5px;
    border-radius: 6px;
    text-shadow: 0 1px 2px #000;
  }

  body.lux-terminal-shell-v199 .indicator-row:hover,
  body.lux-terminal-shell-v199 .indicator-row.expanded {
    background: rgba(10,13,18,.90);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.045);
    backdrop-filter: blur(8px);
  }

  body.lux-terminal-shell-v199 .stats-panel {
    border-color: rgba(212,175,55,.16);
    border-radius: 11px;
    background: rgba(9,12,17,.91);
    box-shadow: 0 12px 30px rgba(0,0,0,.26);
  }

  /* Status bar inferior: datos compactos tipo terminal. */
  body.lux-terminal-shell-v199 .lux-market-footer-v199 {
    height: 36px;
    min-height: 36px;
    padding: 0 7px;
    border: 1px solid rgba(255,255,255,.07);
    border-top: 0;
    border-radius: 0 0 15px 15px;
    background: linear-gradient(180deg, #10151d, #0a0d12);
  }

  body.lux-terminal-shell-v199 .lux-market-footer-v199 .bp-stat {
    padding: 0 10px;
    border-right-color: rgba(255,255,255,.05);
  }

  body.lux-terminal-shell-v199 .lux-market-footer-v199 .bp-label {
    color: #626b77;
    font-size: 8px;
    font-weight: 650;
    text-transform: uppercase;
    letter-spacing: .04em;
  }

  body.lux-terminal-shell-v199 .lux-market-footer-v199 .bp-value {
    color: #cdd2d8;
    font-weight: 680;
  }

  /* Inteligencia de mercado / Radar / Watchlist */
  body.lux-terminal-shell-v199 .lux-market-sidebar-v199 {
    width: 320px;
    min-width: 320px;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 15px;
    background:
      radial-gradient(circle at 88% 0%, rgba(212,175,55,.06), transparent 28%),
      linear-gradient(180deg, #11161e, #080b10);
    box-shadow: 0 15px 38px rgba(0,0,0,.24);
  }

  body.lux-terminal-shell-v199 .lux-market-sidebar-v199 .right-sidebar-header {
    height: 66px;
    padding: 0 15px;
    border-bottom: 1px solid rgba(255,255,255,.06);
    background:
      linear-gradient(180deg, rgba(255,255,255,.018), transparent);
  }

  body.lux-terminal-shell-v199 .lux-market-sidebar-v199 .lux-sidebar-eyebrow-v197 {
    color: rgba(212,175,55,.78);
    font-size: 7px;
    letter-spacing: .16em;
  }

  body.lux-terminal-shell-v199 .lux-market-sidebar-v199 .sidebar-title {
    margin-top: 3px;
    color: #f0f2f5;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: -.015em;
  }

  body.lux-terminal-shell-v199 .lux-market-sidebar-v199 .sidebar-subtitle {
    margin-top: 3px;
    color: #69727f;
    font-size: 8px;
  }

  body.lux-terminal-shell-v199 .watchlist-collapse-btn {
    left: -21px;
    width: 21px;
    height: 58px;
    border: 1px solid rgba(255,255,255,.08);
    border-right: 0;
    border-radius: 10px 0 0 10px;
    background: #0d1117;
    color: #77818d;
    box-shadow: -6px 0 18px rgba(0,0,0,.24);
  }

  body.lux-terminal-shell-v199 .watchlist-collapse-btn:hover {
    border-color: rgba(212,175,55,.24);
    background: #151a22;
    color: var(--lux99-gold-bright);
  }

  body.lux-terminal-shell-v199 .watchlist-header {
    min-height: 38px;
    padding: 7px 12px;
    border-bottom-color: rgba(255,255,255,.05);
  }

  body.lux-terminal-shell-v199 .watchlist-cols {
    padding: 7px 11px;
    border-bottom-color: rgba(255,255,255,.045);
    color: #606976;
    font-size: 8px;
    letter-spacing: .07em;
  }

  body.lux-terminal-shell-v199 .watchlist-row {
    min-height: 44px;
    padding: 6px 11px;
    border-bottom-color: rgba(255,255,255,.032);
    transition: background .14s ease, transform .14s ease, box-shadow .14s ease;
  }

  body.lux-terminal-shell-v199 .watchlist-row:hover {
    transform: translateX(2px);
    background: rgba(255,255,255,.035);
  }

  body.lux-terminal-shell-v199 .watchlist-row.active {
    transform: none;
    background:
      linear-gradient(90deg, rgba(212,175,55,.14), rgba(212,175,55,.025));
    box-shadow:
      inset 3px 0 0 var(--lux99-gold),
      inset 0 0 0 1px rgba(212,175,55,.035);
  }

  body.lux-terminal-shell-v199 .watchlist-row.active .wl-base {
    color: #f1da8b;
  }

  body.lux-terminal-shell-v199 .watchlist-row .wl-price {
    font-variant-numeric: tabular-nums;
    font-weight: 650;
  }

  body.lux-terminal-shell-v199 .wl-selected-detail {
    border-top-color: rgba(212,175,55,.10);
    background:
      radial-gradient(circle at 90% 0%, rgba(212,175,55,.07), transparent 34%),
      #0a0e14;
  }

  /* Menús y modales = misma identidad premium */
  body.lux-terminal-shell-v199 .dropdown-content {
    padding: 7px;
    border: 1px solid rgba(212,175,55,.18);
    border-radius: 14px;
    background:
      radial-gradient(circle at 85% 0%, rgba(212,175,55,.06), transparent 34%),
      rgba(12,16,22,.99);
    box-shadow: 0 24px 68px rgba(0,0,0,.60);
    backdrop-filter: blur(18px);
  }

  body.lux-terminal-shell-v199 .dropdown-item {
    min-height: 38px;
    padding: 7px 9px;
    border-radius: 9px;
  }

  body.lux-terminal-shell-v199 .dropdown-item:hover {
    background: rgba(212,175,55,.065);
  }

  body.lux-terminal-shell-v199 .dialog-overlay {
    background: rgba(2,4,7,.78);
    backdrop-filter: blur(10px);
  }

  body.lux-terminal-shell-v199 .dialog {
    border: 1px solid rgba(212,175,55,.18);
    border-radius: 17px;
    background:
      radial-gradient(circle at 90% 0%, rgba(212,175,55,.06), transparent 28%),
      linear-gradient(180deg, #141922, #0a0d12);
    box-shadow: 0 34px 90px rgba(0,0,0,.68);
  }

  body.lux-terminal-shell-v199 .dialog-header {
    border-bottom-color: rgba(255,255,255,.055);
  }

  body.lux-terminal-shell-v199 .dialog-title {
    color: #f4f5f7;
    font-weight: 780;
  }

  body.lux-terminal-shell-v199 .dialog-close {
    border-radius: 9px;
  }

  /* Paneles creados por trading.js / alertas: sólo diseño. */
  body.lux-terminal-shell-v199 #lux-trade-mini-panel,
  body.lux-terminal-shell-v199 #lux-stats-panel,
  body.lux-terminal-shell-v199 #lux-trading-alert-settings {
    border-color: rgba(212,175,55,.18) !important;
    border-radius: 14px !important;
    background:
      radial-gradient(circle at 88% 0%, rgba(212,175,55,.06), transparent 30%),
      rgba(8,11,15,.965) !important;
    box-shadow: 0 22px 60px rgba(0,0,0,.48) !important;
    backdrop-filter: blur(16px);
  }

  body.lux-terminal-shell-v199 .sim-trading-panel {
    border-left: 1px solid rgba(212,175,55,.15);
    background:
      radial-gradient(circle at 90% 0%, rgba(212,175,55,.045), transparent 30%),
      #080b10;
    box-shadow: -24px 0 60px rgba(0,0,0,.46);
  }

  body.lux-terminal-shell-v199 .sim-tabs button {
    transition: background .14s ease, color .14s ease, border-color .14s ease;
  }

  body.lux-terminal-shell-v199 .sim-tabs button.active {
    color: #f2d778;
    border-bottom-color: var(--lux99-gold);
    background: rgba(212,175,55,.055);
  }

  body.lux-terminal-shell-v199 #sim-trading-btn {
    border-color: rgba(212,175,55,.18);
    border-radius: 10px;
    background: rgba(212,175,55,.055);
  }

  body.lux-terminal-shell-v199 #sim-trading-btn:hover {
    border-color: rgba(212,175,55,.34);
    background: rgba(212,175,55,.10);
  }

  /* Chat integrado al mismo lenguaje visual. */
  body.lux-terminal-shell-v199 #lux-floating-chat-btn {
    border-color: rgba(212,175,55,.32) !important;
    box-shadow:
      0 12px 30px rgba(0,0,0,.38),
      0 0 0 4px rgba(212,175,55,.045) !important;
  }

  body.lux-terminal-shell-v199 .lux-floating-chat {
    border-color: rgba(212,175,55,.17) !important;
    border-radius: 16px !important;
    background: rgba(8,11,15,.98) !important;
    box-shadow: 0 28px 70px rgba(0,0,0,.58) !important;
  }
}

/* ---------------------------------------------------------------------
   TABLET · aprovecha espacio sin volver la UI incómoda
   --------------------------------------------------------------------- */

@media (min-width: 769px) and (max-width: 1180px) {
  body.lux-terminal-shell-v199 {
    --watchlist-width: 285px;
  }

  body.lux-terminal-shell-v199 .lux-market-sidebar-v199 {
    width: 285px;
    min-width: 285px;
  }

  body.lux-terminal-shell-v199 .lux-header-user,
  body.lux-terminal-shell-v199 .whatsapp-text,
  body.lux-terminal-shell-v199 .lux-quickstart-label-v199 {
    display: none;
  }

  body.lux-terminal-shell-v199 .lux-header-nav {
    gap: 5px;
  }

  body.lux-terminal-shell-v199 .symbol-btn {
    min-width: 112px;
  }
}

/* ---------------------------------------------------------------------
   MOBILE · sensación de app, controles claros, gráfico protagonista
   --------------------------------------------------------------------- */

@media (max-width: 768px) {
  body.lux-terminal-shell-v199 {
    --lux99-mobile-nav: 58px;
  }

  body.lux-terminal-shell-v199 .lux-command-deck-v199 {
    border-bottom-color: rgba(212,175,55,.16) !important;
    background:
      linear-gradient(180deg, rgba(10,13,18,.99), rgba(6,8,12,.99)) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,.30) !important;
  }

  body.lux-terminal-shell-v199 .lux-market-commandbar-v199 {
    overflow-x: auto;
    overflow-y: visible;
    scroll-snap-type: x proximity;
  }

  body.lux-terminal-shell-v199 .lux-market-commandbar-v199 > * {
    scroll-snap-align: start;
  }

  body.lux-terminal-shell-v199 .symbol-btn {
    border-color: rgba(212,175,55,.20) !important;
    background: rgba(212,175,55,.065) !important;
  }

  body.lux-terminal-shell-v199 .tf-btn.active {
    border-color: rgba(212,175,55,.22);
    background: rgba(212,175,55,.13);
    color: #f2d676;
  }

  body.lux-terminal-shell-v199 .lux-tool-dock-v199 {
    background: linear-gradient(180deg, #10151c, #080b10);
    border-right-color: rgba(255,255,255,.055);
  }

  body.lux-terminal-shell-v199 .lux-tool-dock-v199 .tool-btn {
    border-radius: 9px;
  }

  body.lux-terminal-shell-v199 .lux-tool-dock-v199 .tool-btn.active {
    border-color: #f0d36e;
    background: linear-gradient(145deg, #efd16b, #c49a27);
    color: #171205;
    box-shadow: 0 6px 16px rgba(212,175,55,.18);
  }

  body.lux-terminal-shell-v199 .lux-chart-stage-v199::before {
    display: none;
  }

  body.lux-terminal-shell-v199 .lux-market-footer-v199 {
    border-top-color: rgba(255,255,255,.055);
    background: #0a0d12;
  }

  body.lux-terminal-shell-v199 .lux-terminal-mobile-nav-v199 {
    border-top: 1px solid rgba(212,175,55,.16) !important;
    background:
      linear-gradient(180deg, rgba(13,17,23,.985), rgba(5,7,10,.995)) !important;
    box-shadow: 0 -16px 40px rgba(0,0,0,.44) !important;
    backdrop-filter: blur(16px);
  }

  body.lux-terminal-shell-v199 .lux-trading-app-nav-item {
    color: #737d89;
  }

  body.lux-terminal-shell-v199 .lux-trading-app-nav-item.active,
  body.lux-terminal-shell-v199 .lux-trading-app-nav-item:active {
    color: #efd16e;
  }

  body.lux-terminal-shell-v199 .lux-nav-trade-circle {
    border-color: #f2d775 !important;
    background: linear-gradient(145deg, #f1d46e, #bd9224) !important;
    color: #171205 !important;
    box-shadow:
      0 0 0 4px rgba(212,175,55,.09),
      0 9px 22px rgba(0,0,0,.38),
      0 0 20px rgba(212,175,55,.12) !important;
  }

  body.lux-terminal-shell-v199 .right-sidebar,
  body.lux-terminal-shell-v199 .right-sidebar.mobile-watchlist-open {
    border-color: rgba(212,175,55,.18) !important;
    border-radius: 18px 18px 0 0 !important;
    background:
      radial-gradient(circle at 90% 0%, rgba(212,175,55,.06), transparent 28%),
      linear-gradient(180deg, #11161e, #080b10) !important;
    box-shadow: 0 -22px 55px rgba(0,0,0,.54) !important;
  }

  body.lux-terminal-shell-v199 .right-sidebar-header {
    background: linear-gradient(180deg, rgba(255,255,255,.018), transparent);
  }

  body.lux-terminal-shell-v199 .watchlist-row.active {
    background: linear-gradient(90deg, rgba(212,175,55,.13), rgba(212,175,55,.02));
    box-shadow: inset 3px 0 0 var(--lux99-gold);
  }

  body.lux-terminal-shell-v199 .dropdown-content,
  body.lux-terminal-shell-v199 #indicator-menu-content.dropdown-content.open {
    border-color: rgba(212,175,55,.18) !important;
    border-radius: 15px !important;
    background: rgba(10,13,18,.99) !important;
    box-shadow: 0 26px 70px rgba(0,0,0,.62) !important;
  }

  body.lux-terminal-shell-v199 .dialog {
    border-radius: 18px 18px 0 0;
    background:
      radial-gradient(circle at 90% 0%, rgba(212,175,55,.055), transparent 28%),
      #0a0d12;
  }

  /* La guía se convierte en tarjeta flotante cómoda para teléfono. */
  body.lux-terminal-shell-v199 .lux-quickstart-label-v199 {
    display: none;
  }

  body.lux-terminal-shell-v199 .lux-quickstart-v199 > summary {
    width: 32px;
    height: 32px;
    padding: 0;
    justify-content: center;
    border-radius: 9px;
  }

  body.lux-terminal-shell-v199 .lux-quickstart-icon-v199 {
    width: 23px;
    height: 23px;
  }

  body.lux-terminal-shell-v199 .lux-quickstart-card-v199 {
    position: fixed;
    top: 58px;
    right: 8px;
    left: 8px;
    width: auto;
    max-height: calc(100dvh - 136px);
    overflow-y: auto;
    border-radius: 16px;
  }

  body.lux-terminal-shell-v199 #lux-trade-mini-panel,
  body.lux-terminal-shell-v199 #lux-stats-panel,
  body.lux-terminal-shell-v199 #lux-trading-alert-settings {
    border-radius: 15px !important;
    background: rgba(8,11,15,.97) !important;
  }

  body.lux-terminal-shell-v199 .sim-trading-panel {
    background: #080b10;
  }
}

@media (max-width: 430px) {
  body.lux-terminal-shell-v199 .lux-quickstart-v199 {
    display: none;
  }

  body.lux-terminal-shell-v199 .lux-sidebar-eyebrow-v197 {
    font-size: 6px;
  }

  body.lux-terminal-shell-v199 .sidebar-subtitle {
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* Motion respetuoso: premium sin marear ni forzar animaciones. */
@media (prefers-reduced-motion: reduce) {
  body.lux-terminal-shell-v199 *,
  body.lux-terminal-shell-v199 *::before,
  body.lux-terminal-shell-v199 *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}


/* =====================================================================
   LUX TRADING v200 · HEADER HORIZONTAL + DRAG ESTABLE
   - El bloque Mercado / Temporalidad / Velas / Indicadores / Trading
     puede desplazarse horizontalmente sin mostrar barra de scroll.
   - Los paneles flotantes mantienen el punto de agarre bajo el mouse.
   ===================================================================== */

/* Todos los controles del commandbar quedan en una sola fila.
   Si no entran, se desplazan horizontalmente. */
body.lux-terminal-shell-v199 .lux-market-commandbar-v199 {
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-x: contain;
  scroll-behavior: smooth;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

body.lux-terminal-shell-v199 .lux-market-commandbar-v199::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

body.lux-terminal-shell-v199 .lux-market-commandbar-v199 > * {
  flex: 0 0 auto !important;
}

/* El bloque central puede encogerse sin empujar fuera de pantalla
   la zona LIVE / guía / acceso de la derecha. */
@media (min-width: 769px) {
  body.lux-terminal-shell-v199 .header-left {
    min-width: 0 !important;
    overflow: hidden !important;
  }

  body.lux-terminal-shell-v199 .lux-market-commandbar-v199 {
    min-width: 0 !important;
    width: 0;
    flex: 1 1 auto !important;
  }

  body.lux-terminal-shell-v199 .lux-session-cluster-v199 {
    flex: 0 0 auto !important;
  }
}

/* Cursor visual mientras se desplaza la cabecera con rueda/trackpad. */
body.lux-terminal-shell-v199 .lux-market-commandbar-v199.lux-horizontal-scrolling-v200 {
  scroll-behavior: auto;
}

/* Los controles flotantes no cambian de lugar durante el drag. */
#lux-trade-mini-panel.lux-floating-dragging-v200,
#lux-stats-panel.lux-floating-dragging-v200 {
  transition: none !important;
  will-change: left, top !important;
}

/* Cuando OPERATIVA abre hacia arriba, su encabezado queda abajo.
   El agarrador debe acompañar al encabezado y NO irse al borde superior
   del contenido expandido. */
#lux-trade-mini-panel.lux-open-up > .lux-float-controls {
  top: auto !important;
  bottom: 4px !important;
}

#lux-trade-mini-panel.lux-open-down > .lux-float-controls,
#lux-trade-mini-panel.is-collapsed > .lux-float-controls {
  top: 4px !important;
  bottom: auto !important;
}

/* Mantiene el gesto de arrastre aislado del gráfico. */
.lux-float-drag {
  touch-action: none !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}


/* =====================================================================
   LUX TRADING v201 · DRAG SIN SALTO
   El filtro aplicado al contenedor central convertía ese bloque en
   containing-block para elementos position:fixed. Por eso al empezar
   a arrastrar OPERATIVA o LUX TRADES el panel recibía otra referencia
   de coordenadas y "saltaba" hacia abajo mientras el puntero quedaba
   donde estaba.

   Quitamos SOLAMENTE ese filter del contenedor. Los paneles flotantes
   siguen usando exactamente el drag de v200, pero ahora las coordenadas
   fixed vuelven a corresponder al viewport y el panel queda debajo del
   puntero desde el primer pixel.
   ===================================================================== */
@media (min-width: 769px) {
  body.lux-terminal-shell-v199 .lux-terminal-center-v199 {
    filter: none !important;
  }
}

/* Durante el drag anulamos cualquier transformación heredada accidental
   en los dos paneles, sin cambiar su posición normal ni su lógica. */
#lux-trade-mini-panel.lux-floating-dragging-v200,
#lux-stats-panel.lux-floating-dragging-v200 {
  transform: none !important;
  transition: none !important;
}


/* =====================================================================
   LUX TRADING v202 · TEMA CLARO PREMIUM REAL
   El switch de tema usa html[data-theme="light"].
   Esta capa reemplaza los fondos negros introducidos por la terminal
   premium v199/v200/v201 sin alterar IDs, layout ni comportamiento.
   ===================================================================== */

html[data-theme="light"] {
  color-scheme: light;
  --tv-bg: #eeeae2;
  --tv-chart: #f7f8fa;
  --tv-panel: #fffdf9;
  --tv-panel-2: #f4f1ea;
  --tv-panel-hover: #ece7dc;
  --tv-border: #ddd7cc;
  --tv-border-strong: #cbc3b5;
  --tv-text: #20242b;
  --tv-text-muted: #68717d;
  --tv-text-dim: #9199a3;
  --tv-green: #16866e;
  --tv-green-light: #209d82;
  --tv-red: #d84c4c;
  --tv-blue: #315ed6;
  --tv-blue-hover: #244dbd;
  --tv-yellow: #aa7d12;
  --tv-orange: #c07919;
}

html[data-theme="light"] body.lux-terminal-shell-v199 {
  --lux99-bg: #eeeae2;
  --lux99-bg-2: #f4f1eb;
  --lux99-surface: #fffdf9;
  --lux99-surface-2: #f5f2ec;
  --lux99-surface-3: #ebe6dc;
  --lux99-border: rgba(55,48,38,.11);
  --lux99-border-strong: rgba(161,124,25,.26);
  --lux99-gold: #a77c18;
  --lux99-gold-bright: #b78b20;
  --lux99-gold-soft: rgba(167,124,24,.10);
  --lux99-text: #1b2028;
  --lux99-muted: #68717d;
  --lux99-dim: #939aa3;
  --lux99-green: #16866e;
  --lux99-red: #d84c4c;
  --lux99-shadow: 0 16px 42px rgba(45,38,27,.12);
  background: #eeeae2 !important;
  color: #22272f !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .app {
  background:
    radial-gradient(circle at 58% -18%, rgba(181,141,39,.10), transparent 31%),
    linear-gradient(180deg, #f5f2eb 0%, #ebe7de 100%) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .app::after {
  opacity: .20;
  background:
    linear-gradient(rgba(76,67,52,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(76,67,52,.025) 1px, transparent 1px);
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-command-deck-v199 {
  background: linear-gradient(180deg, rgba(255,254,250,.99), rgba(244,240,233,.99)) !important;
  border-bottom-color: rgba(161,124,25,.22) !important;
  box-shadow: 0 8px 24px rgba(49,42,30,.10), inset 0 -1px 0 rgba(255,255,255,.75) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-command-deck-v199::before {
  background: linear-gradient(90deg, transparent, rgba(167,124,24,.35), transparent) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-header-nav,
html[data-theme="light"] body.lux-terminal-shell-v199 .lux-market-commandbar-v199,
html[data-theme="light"] body.lux-terminal-shell-v199 .lux-session-cluster-v199 {
  border-color: rgba(74,65,50,.11) !important;
  background: linear-gradient(145deg, #fffefa, #f3efe7) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 8px 22px rgba(51,43,31,.08) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-header-back {
  border-color: rgba(167,124,24,.18) !important;
  background: rgba(167,124,24,.06) !important;
  color: #55451d !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-header-back:hover {
  border-color: rgba(167,124,24,.34) !important;
  background: rgba(167,124,24,.11) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-header-name,
html[data-theme="light"] body.lux-terminal-shell-v199 .symbol-label,
html[data-theme="light"] body.lux-terminal-shell-v199 .dialog-title,
html[data-theme="light"] body.lux-terminal-shell-v199 .sidebar-title {
  color: #1f242b !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-header-subtitle,
html[data-theme="light"] body.lux-terminal-shell-v199 .lux-sidebar-eyebrow-v197 {
  color: #9c7316 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-header-user,
html[data-theme="light"] body.lux-terminal-shell-v199 .sidebar-subtitle {
  color: #7a828b !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .header-divider,
html[data-theme="light"] body.lux-terminal-shell-v199 .lux-market-commandbar-v199 > .header-divider {
  background: rgba(69,62,51,.11) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .symbol-btn,
html[data-theme="light"] body.lux-terminal-shell-v199 .timeframe-selector,
html[data-theme="light"] body.lux-terminal-shell-v199 #indicator-menu-btn {
  border-color: rgba(72,64,51,.10) !important;
  background: rgba(255,255,255,.52) !important;
  color: #343a43 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .symbol-btn {
  border-color: rgba(167,124,24,.24) !important;
  background: linear-gradient(145deg, rgba(184,143,35,.10), rgba(255,255,255,.72)) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .symbol-btn::before,
html[data-theme="light"] body.lux-terminal-shell-v199 .timeframe-selector::before,
html[data-theme="light"] body.lux-terminal-shell-v199 #indicator-menu::before {
  color: #8a8175 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .symbol-btn::before {
  color: #997015 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .tf-btn {
  color: #69717c !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .tf-btn:hover {
  background: rgba(86,76,60,.07) !important;
  color: #222831 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .tf-btn.active {
  border-color: rgba(167,124,24,.30) !important;
  background: linear-gradient(145deg, rgba(185,143,35,.18), rgba(185,143,35,.08)) !important;
  color: #76550b !important;
  box-shadow: 0 4px 12px rgba(93,73,25,.08) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 #indicator-menu-btn .control-icon {
  color: #a37918 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .market-status {
  background: rgba(22,134,110,.07) !important;
  color: #547068 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .whatsapp-link {
  color: #626b75 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-terminal-workspace-v199 {
  background: transparent !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-tool-dock-v199,
html[data-theme="light"] body.lux-terminal-shell-v199 .lux-market-sidebar-v199 {
  border-color: rgba(71,63,50,.11) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(177,137,34,.07), transparent 26%),
    linear-gradient(180deg, #fffefa, #f0ece4) !important;
  box-shadow: 0 14px 34px rgba(53,45,33,.10) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-tool-dock-v199 .tool-btn {
  color: #6f7883 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-tool-dock-v199 .tool-btn:hover {
  border-color: rgba(72,64,51,.10) !important;
  background: rgba(81,72,58,.07) !important;
  color: #1f252d !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-tool-dock-v199 .tool-btn.active {
  border-color: #c3972d !important;
  background: linear-gradient(145deg, #e3bd56, #ba8c20) !important;
  color: #211a08 !important;
  box-shadow: 0 0 0 3px rgba(167,124,24,.08), 0 8px 18px rgba(102,78,22,.13) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-tool-dock-v199 .tool-sep {
  background: rgba(72,64,51,.11) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-chart-stage-v199 {
  border-color: rgba(68,62,53,.13) !important;
  background: #f7f8fa !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 0 0 1px rgba(65,57,44,.035) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-chart-stage-v199::before {
  color: rgba(135,99,15,.20) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-market-footer-v199 {
  border-color: rgba(70,62,50,.11) !important;
  background: linear-gradient(180deg, #fffefa, #eeeae2) !important;
  color: #69717b !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-market-footer-v199 .bp-stat {
  border-right-color: rgba(73,65,52,.08) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-market-footer-v199 .bp-label {
  color: #8c939c !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-market-footer-v199 .bp-value {
  color: #414850 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-market-sidebar-v199 .right-sidebar-header,
html[data-theme="light"] body.lux-terminal-shell-v199 .right-sidebar-header {
  border-bottom-color: rgba(70,62,49,.09) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.56), transparent) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .watchlist-header,
html[data-theme="light"] body.lux-terminal-shell-v199 .watchlist-cols {
  border-color: rgba(70,62,49,.08) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .watchlist-cols {
  color: #969da5 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .watchlist-row {
  border-bottom-color: rgba(72,64,51,.055) !important;
  color: #363c44 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .watchlist-row:hover {
  background: rgba(78,69,55,.055) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .watchlist-row.active {
  background: linear-gradient(90deg, rgba(180,139,33,.15), rgba(180,139,33,.035)) !important;
  box-shadow: inset 3px 0 0 #aa801c, inset 0 0 0 1px rgba(167,124,24,.05) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .watchlist-row .wl-base,
html[data-theme="light"] body.lux-terminal-shell-v199 .watchlist-row .wl-price {
  color: #252b32 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .watchlist-row.active .wl-base {
  color: #76570f !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .watchlist-collapse-btn {
  border-color: rgba(72,64,51,.13) !important;
  background: #f1ede6 !important;
  color: #707883 !important;
  box-shadow: -6px 0 16px rgba(53,45,33,.08) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .watchlist-collapse-btn:hover {
  border-color: rgba(167,124,24,.28) !important;
  background: #fffdf8 !important;
  color: #926b12 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .wl-selected-detail {
  border-top-color: rgba(167,124,24,.13) !important;
  background: radial-gradient(circle at 90% 0%, rgba(181,140,33,.08), transparent 34%), #f7f4ee !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .dropdown-content,
html[data-theme="light"] body.lux-terminal-shell-v199 .dialog,
html[data-theme="light"] body.lux-terminal-shell-v199 #lux-trade-mini-panel,
html[data-theme="light"] body.lux-terminal-shell-v199 #lux-stats-panel,
html[data-theme="light"] body.lux-terminal-shell-v199 #lux-trading-alert-settings,
html[data-theme="light"] body.lux-terminal-shell-v199 .lux-floating-chat,
html[data-theme="light"] body.lux-terminal-shell-v199 .sim-trading-panel {
  border-color: rgba(149,113,21,.20) !important;
  background:
    radial-gradient(circle at 88% 0%, rgba(181,140,33,.07), transparent 31%),
    rgba(255,253,248,.985) !important;
  color: #242a31 !important;
  box-shadow: 0 24px 64px rgba(48,40,28,.16) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .dialog-overlay {
  background: rgba(74,67,57,.27) !important;
  backdrop-filter: blur(9px);
}

html[data-theme="light"] body.lux-terminal-shell-v199 .dropdown-item {
  color: #363c43 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .dropdown-item:hover {
  background: rgba(167,124,24,.08) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .sim-tabs button.active {
  color: #85610d !important;
  border-bottom-color: #aa801c !important;
  background: rgba(167,124,24,.07) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 #sim-trading-btn {
  border-color: rgba(167,124,24,.22) !important;
  background: rgba(167,124,24,.07) !important;
  color: #5d4815 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-quickstart-v199 > summary,
html[data-theme="light"] body.lux-terminal-shell-v199 .lux-quickstart-card-v199 {
  border-color: rgba(167,124,24,.20) !important;
  background: #fffdf8 !important;
  color: #2c3239 !important;
  box-shadow: 0 22px 58px rgba(50,42,29,.15) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-quickstart-head-v199 strong,
html[data-theme="light"] body.lux-terminal-shell-v199 .lux-quickstart-step-v199 strong {
  color: #2b3037 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-quickstart-step-v199 span,
html[data-theme="light"] body.lux-terminal-shell-v199 .lux-quickstart-tip-v199 p {
  color: #727b85 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-trading-app-nav,
html[data-theme="light"] body.lux-terminal-shell-v199 .lux-terminal-mobile-nav-v199 {
  border-top-color: rgba(167,124,24,.19) !important;
  background: linear-gradient(180deg, rgba(255,254,250,.985), rgba(239,235,226,.995)) !important;
  box-shadow: 0 -13px 34px rgba(50,42,30,.12) !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-trading-app-nav-item {
  color: #737c86 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .lux-trading-app-nav-item.active {
  color: #8a6410 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .top-overlay .row,
html[data-theme="light"] body.lux-terminal-shell-v199 .indicator-row:hover,
html[data-theme="light"] body.lux-terminal-shell-v199 .indicator-row.expanded,
html[data-theme="light"] body.lux-terminal-shell-v199 .stats-panel {
  color: #2b3138 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .indicator-row:hover,
html[data-theme="light"] body.lux-terminal-shell-v199 .indicator-row.expanded,
html[data-theme="light"] body.lux-terminal-shell-v199 .stats-panel {
  border-color: rgba(70,62,50,.12) !important;
  background: rgba(255,253,248,.91) !important;
  box-shadow: 0 10px 28px rgba(54,45,31,.10) !important;
}

/* Controles inyectados por chart.js */
html[data-theme="light"] .lux-chart-timezone-control {
  border-left-color: #d6d1c8 !important;
  background: #f7f8fa !important;
  color: #69727d !important;
}

html[data-theme="light"] .lux-chart-timezone-control:hover,
html[data-theme="light"] .lux-chart-timezone-control.is-open {
  background: #ece8e0 !important;
  color: #242a31 !important;
}

html[data-theme="light"] .lux-chart-timezone-control b,
html[data-theme="light"] .lux-chart-timezone-control .lux-chart-timezone-label {
  color: #59626e !important;
}

html[data-theme="light"] .lux-chart-timezone-menu,
html[data-theme="light"] .lux-economic-events-popup {
  border-color: #d4cec3 !important;
  background: rgba(255,253,248,.99) !important;
  color: #293038 !important;
  box-shadow: 0 16px 44px rgba(50,43,31,.18) !important;
}

html[data-theme="light"] .lux-chart-timezone-option {
  color: #4b545f !important;
}

html[data-theme="light"] .lux-chart-timezone-option:hover,
html[data-theme="light"] .lux-chart-timezone-option.active {
  background: #eee9df !important;
  color: #242a31 !important;
}

html[data-theme="light"] .lux-economic-popup-head {
  background: #f1ede5 !important;
  border-bottom-color: #d9d3c8 !important;
}

html[data-theme="light"] .lux-economic-popup-close {
  border-color: #d3cdc2 !important;
  background: #fffdf8 !important;
  color: #4a535d !important;
}

html[data-theme="light"] .lux-economic-popup-value {
  border-color: rgba(71,63,50,.10) !important;
  background: rgba(73,64,50,.035) !important;
}

@media (max-width: 768px) {
  html[data-theme="light"] body.lux-terminal-shell-v199 .lux-command-deck-v199,
  html[data-theme="light"] body.lux-terminal-shell-v199 .lux-tool-dock-v199,
  html[data-theme="light"] body.lux-terminal-shell-v199 .right-sidebar,
  html[data-theme="light"] body.lux-terminal-shell-v199 .right-sidebar.mobile-watchlist-open,
  html[data-theme="light"] body.lux-terminal-shell-v199 .sim-trading-panel {
    background: linear-gradient(180deg, #fffefa, #eeeae2) !important;
  }
}


/* =====================================================================
   LUX TRADING v203 · WATCHLIST DETALLE EN TEMA CLARO
   Corrige textos que conservaban colores blancos del tema oscuro.
   ===================================================================== */
html[data-theme="light"] body.lux-terminal-shell-v199 .wl-detail-symbol {
  color: #1f252d !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .wl-detail-quote {
  color: #69727d !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .wl-detail-name {
  color: #6f7781 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .wl-detail-market {
  color: #8a929c !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .wl-detail-price {
  color: #20262e !important;
  text-shadow: none !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .wl-detail-currency {
  color: #6e7680 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .wl-detail-change.up,
html[data-theme="light"] body.lux-terminal-shell-v199 .wl-detail-change.positive {
  color: #0d8a70 !important;
}

html[data-theme="light"] body.lux-terminal-shell-v199 .wl-detail-change.down,
html[data-theme="light"] body.lux-terminal-shell-v199 .wl-detail-change.negative {
  color: #d04747 !important;
}


/* =====================================================================
   LUX TRADING v204 · ALERTAS DE PRECIO PERSONALIZADAS
   ===================================================================== */
.lux-price-alert-tool-count{min-width:17px;height:17px;display:inline-grid;place-items:center;padding:0 4px;border-radius:999px;background:#d4af37;color:#171207;font-size:8px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums;box-shadow:0 0 0 2px rgba(212,175,55,.08)}
.lux-price-alert-tool-count[hidden]{display:none!important}
.tool-btn[data-tool="price_alert"]{position:relative}
.left-sidebar:not(.tools-expanded) .tool-btn[data-tool="price_alert"] .lux-price-alert-tool-count{position:absolute;top:1px;right:0;transform:scale(.84)}
.lux-mobile-tool-item[data-tool="price_alert"]{position:relative}
.lux-mobile-tool-item[data-tool="price_alert"] .lux-price-alert-tool-count{margin-left:auto}
.lux-price-line-alert-bell{color:#f1d36c!important;border-color:rgba(212,175,55,.35)!important;background:rgba(212,175,55,.08)!important}
.lux-price-line-alert-bell:hover{background:rgba(212,175,55,.16)!important}

.lux-price-alert-placement-hint{position:fixed;top:82px;left:50%;z-index:88000;transform:translateX(-50%);min-width:390px;max-width:calc(100vw - 40px);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:9px 10px 9px 12px;border:1px solid rgba(212,175,55,.28);border-radius:13px;background:rgba(8,11,15,.96);box-shadow:0 18px 52px rgba(0,0,0,.46);backdrop-filter:blur(16px);color:#eef1f4}
.lux-price-alert-placement-copy{min-width:0;display:flex;align-items:center;gap:10px}
.lux-price-alert-placement-copy>span{width:30px;height:30px;flex:0 0 30px;display:grid;place-items:center;border-radius:9px;border:1px solid rgba(212,175,55,.24);background:rgba(212,175,55,.09);font-size:14px}
.lux-price-alert-placement-copy div{display:flex;flex-direction:column;gap:2px}
.lux-price-alert-placement-copy strong{color:#f4f5f7;font-size:10px;font-weight:800}
.lux-price-alert-placement-copy small{color:#7d8793;font-size:8px}
.lux-price-alert-placement-actions{display:flex;gap:6px}
.lux-price-alert-placement-actions button{height:29px;padding:0 9px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:rgba(255,255,255,.035);color:#aeb6c0;font-size:8px;font-weight:750}
.lux-price-alert-placement-actions button:first-child{border-color:rgba(212,175,55,.24);background:rgba(212,175,55,.07);color:#e6cd74}

.lux-price-alert-modal{position:fixed;inset:0;z-index:91000;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(2,4,7,.74);backdrop-filter:blur(9px)}
.lux-price-alert-modal.open{display:flex}
.lux-price-alert-dialog{width:min(610px,100%);max-height:min(760px,calc(100dvh - 36px));overflow-y:auto;overflow-x:hidden;border:1px solid rgba(212,175,55,.20);border-radius:18px;background:radial-gradient(circle at 94% 0%,rgba(212,175,55,.075),transparent 27%),linear-gradient(180deg,#11161e,#080b10);box-shadow:0 34px 100px rgba(0,0,0,.66);color:#edf0f4;scrollbar-width:none!important;-ms-overflow-style:none!important}
.lux-price-alert-dialog::-webkit-scrollbar,.lux-price-alert-list::-webkit-scrollbar{width:0!important;height:0!important;display:none!important}
.lux-price-alert-head{position:sticky;top:0;z-index:2;min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;border-bottom:1px solid rgba(255,255,255,.06);background:rgba(10,13,18,.96);backdrop-filter:blur(14px)}
.lux-price-alert-head>div{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 10px}
.lux-price-alert-head small{grid-column:1/-1;color:#d4af37;font-size:7px;font-weight:900;letter-spacing:.15em}
.lux-price-alert-head strong{color:#f4f5f7;font-size:14px;font-weight:820}
.lux-price-alert-head span{padding:4px 7px;border:1px solid rgba(43,199,159,.13);border-radius:999px;background:rgba(43,199,159,.055);color:#52cfae;font-size:8px;font-weight:800}
.lux-price-alert-head>button{width:34px;height:34px;flex:0 0 34px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.035);color:#9aa3ae;font-size:18px}
.lux-price-alert-create{display:grid;grid-template-columns:1fr 1fr;gap:11px;padding:14px 15px;border-bottom:1px solid rgba(255,255,255,.055)}
.lux-price-alert-market{grid-column:1/-1;min-height:50px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 11px;border:1px solid rgba(212,175,55,.15);border-radius:12px;background:rgba(212,175,55,.045)}
.lux-price-alert-market>div{display:flex;flex-direction:column;gap:2px}
.lux-price-alert-market small,.lux-price-alert-field>span{color:#747e8a;font-size:7px;font-weight:850;letter-spacing:.09em;text-transform:uppercase}
.lux-price-alert-market strong{color:#f2d676;font-size:13px;font-weight:850}
.lux-price-alert-market button{height:30px;padding:0 10px;border:1px solid rgba(212,175,55,.22);border-radius:8px;background:rgba(212,175,55,.07);color:#e5cc74;font-size:8px;font-weight:780}
.lux-price-alert-field{display:flex;flex-direction:column;gap:6px}
.lux-price-alert-field input,.lux-price-alert-field select{width:100%;height:42px;padding:0 11px;border:1px solid rgba(255,255,255,.085);border-radius:10px;outline:0;background:rgba(255,255,255,.035);color:#edf0f4;font-size:11px;font-weight:650}
.lux-price-alert-field input:focus,.lux-price-alert-field select:focus{border-color:rgba(212,175,55,.42);box-shadow:0 0 0 3px rgba(212,175,55,.06)}
.lux-price-alert-field select option{background:#11161e;color:#edf0f4}
.lux-price-alert-repeat{grid-column:1/-1;min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 11px;border:1px solid rgba(255,255,255,.06);border-radius:11px;background:rgba(255,255,255,.02)}
.lux-price-alert-repeat>div{display:flex;flex-direction:column;gap:2px}
.lux-price-alert-repeat strong{color:#dfe3e8;font-size:9px}
.lux-price-alert-repeat small{color:#747e89;font-size:8px}
.lux-price-alert-repeat input{width:18px;height:18px;accent-color:#d4af37}
.lux-price-alert-save-row{grid-column:1/-1;display:flex;justify-content:flex-end;gap:7px}
.lux-price-alert-save-row button{min-height:35px;padding:0 14px;border-radius:9px;font-size:9px;font-weight:820}
.lux-price-alert-save-row .primary{border:1px solid #d9b546;background:linear-gradient(145deg,#efd36e,#bd9224);color:#181307}
.lux-price-alert-save-row .secondary{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035);color:#a4acb6}
.lux-price-alert-info{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr;gap:8px;padding:8px 10px;border:1px solid rgba(43,199,159,.10);border-radius:9px;background:rgba(43,199,159,.035)}
.lux-price-alert-info span{color:#2bc79f;font-size:8px}
.lux-price-alert-info p{margin:0;color:#78847f;font-size:8px;line-height:1.45}
.lux-price-alert-list-head{padding:13px 15px 8px}
.lux-price-alert-list-head>div{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.lux-price-alert-list-head strong{color:#e8ebef;font-size:10px}
.lux-price-alert-list-head small{color:#6e7884;font-size:8px}
.lux-price-alert-list{display:flex;flex-direction:column;gap:7px;max-height:310px;overflow-y:auto;padding:0 15px 15px;scrollbar-width:none!important}
.lux-price-alert-card{padding:10px 11px;border:1px solid rgba(255,255,255,.065);border-radius:11px;background:rgba(255,255,255,.022)}
.lux-price-alert-card.is-active{border-color:rgba(212,175,55,.14);background:linear-gradient(90deg,rgba(212,175,55,.055),rgba(255,255,255,.012))}
.lux-price-alert-card.is-paused{opacity:.68}
.lux-price-alert-card-main{display:flex;align-items:center;justify-content:space-between;gap:12px}
.lux-price-alert-card-symbol{min-width:0;display:flex;align-items:center;gap:9px}
.lux-price-alert-card-symbol>span{width:28px;height:28px;flex:0 0 28px;display:grid;place-items:center;border-radius:8px;background:rgba(212,175,55,.07)}
.lux-price-alert-card-symbol>div,.lux-price-alert-card-price{display:flex;flex-direction:column;gap:2px}
.lux-price-alert-card-symbol strong{color:#eef1f4;font-size:10px;font-weight:820}
.lux-price-alert-card-symbol small{color:#76808b;font-size:8px}
.lux-price-alert-card-price{align-items:flex-end;flex:0 0 auto}
.lux-price-alert-card-price strong{color:#e8d17d;font-size:11px;font-weight:820;font-variant-numeric:tabular-nums}
.lux-price-alert-card-price span{color:#727c87;font-size:7px;font-weight:850;letter-spacing:.06em}
.lux-price-alert-card-price span.active{color:#2bc79f}
.lux-price-alert-card-actions{display:flex;justify-content:flex-end;gap:5px;margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,255,255,.045)}
.lux-price-alert-card-actions button{height:27px;padding:0 8px;border:1px solid rgba(255,255,255,.07);border-radius:7px;background:rgba(255,255,255,.03);color:#929ba6;font-size:7.5px;font-weight:760}
.lux-price-alert-card-actions button:hover{background:rgba(212,175,55,.065);color:#edd47b}
.lux-price-alert-card-actions button.danger:hover{border-color:rgba(239,98,98,.18);background:rgba(239,98,98,.06);color:#ef7676}
.lux-price-alert-empty{min-height:120px;display:grid;place-items:center;align-content:center;gap:5px;border:1px dashed rgba(255,255,255,.08);border-radius:12px;color:#6f7985;text-align:center}
.lux-price-alert-empty>span{font-size:20px}
.lux-price-alert-empty strong{color:#aab1ba;font-size:9px}
.lux-price-alert-empty small{font-size:8px}

html[data-theme="light"] .lux-price-alert-placement-hint,html[data-theme="light"] .lux-price-alert-dialog{border-color:rgba(167,124,24,.22)!important;background:radial-gradient(circle at 94% 0%,rgba(181,140,33,.08),transparent 27%),linear-gradient(180deg,#fffefa,#f0ece4)!important;color:#242a31!important;box-shadow:0 26px 76px rgba(50,42,29,.18)!important}
html[data-theme="light"] .lux-price-alert-head{border-bottom-color:rgba(72,64,50,.09)!important;background:rgba(255,253,248,.96)!important}
html[data-theme="light"] .lux-price-alert-head strong,html[data-theme="light"] .lux-price-alert-placement-copy strong,html[data-theme="light"] .lux-price-alert-card-symbol strong,html[data-theme="light"] .lux-price-alert-list-head strong,html[data-theme="light"] .lux-price-alert-repeat strong{color:#282e35!important}
html[data-theme="light"] .lux-price-alert-head>button,html[data-theme="light"] .lux-price-alert-field input,html[data-theme="light"] .lux-price-alert-field select,html[data-theme="light"] .lux-price-alert-repeat,html[data-theme="light"] .lux-price-alert-card{border-color:rgba(72,64,50,.10)!important;background:rgba(255,255,255,.55)!important;color:#30363e!important}
html[data-theme="light"] .lux-price-alert-field select option{background:#fffdf8!important;color:#30363e!important}
html[data-theme="light"] .lux-price-alert-card.is-active{border-color:rgba(167,124,24,.18)!important;background:linear-gradient(90deg,rgba(181,140,33,.09),rgba(255,255,255,.4))!important}
html[data-theme="light"] .lux-price-alert-placement-copy small,html[data-theme="light"] .lux-price-alert-repeat small,html[data-theme="light"] .lux-price-alert-card-symbol small,html[data-theme="light"] .lux-price-alert-list-head small,html[data-theme="light"] .lux-price-alert-info p{color:#747d86!important}
html[data-theme="light"] .lux-price-alert-card-price strong{color:#85620f!important}

@media(max-width:768px){
  .lux-price-alert-placement-hint{top:auto;bottom:calc(66px + env(safe-area-inset-bottom,0px));width:calc(100vw - 16px);min-width:0;max-width:none;padding:9px;border-radius:14px}
  .lux-price-alert-placement-copy small{max-width:170px}
  .lux-price-alert-placement-hint{flex-wrap:wrap}
  .lux-price-alert-placement-actions{width:100%;justify-content:flex-end}
  .lux-price-alert-modal{align-items:flex-end;padding:0}
  .lux-price-alert-dialog{width:100%;max-height:calc(100dvh - 48px);border-radius:20px 20px 0 0;border-bottom:0;padding-bottom:env(safe-area-inset-bottom,0px)}
  .lux-price-alert-create{grid-template-columns:1fr}
  .lux-price-alert-market,.lux-price-alert-repeat,.lux-price-alert-save-row,.lux-price-alert-info{grid-column:1}
  .lux-price-alert-list{max-height:250px}
}

/* =========================================================
   LUX AUTO v1.3 · CABECERA MINI OPERATIVA
   Prioriza SIEMPRE el nombre del par.
   LUX AUTO y timeframe quedan como badges secundarios compactos.
   ========================================================= */
#lux-trade-mini-panel {
    width: 278px !important;
}

#lux-trade-mini-panel .lux-trade-mini-position-head {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    min-width: 0 !important;
}

#lux-trade-mini-panel .lux-trade-mini-side {
    flex: 0 0 auto !important;
}

#lux-trade-mini-panel .lux-trade-mini-symbol {
    flex: 1 1 auto !important;
    min-width: 54px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    color: #f1f3f6 !important;
    font-size: 10px !important;
    font-weight: 800 !important;
}

#lux-trade-mini-panel .lux-trade-mini-auto {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 1px 3px !important;
    border: 1px solid rgba(66,133,255,.48) !important;
    border-radius: 4px !important;
    background: rgba(41,98,255,.14) !important;
    color: #69a7ff !important;
    font-size: 6.5px !important;
    font-weight: 850 !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
}

#lux-trade-mini-panel .lux-trade-mini-tf {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 22px !important;
    padding: 1px 3px !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 4px !important;
    background: rgba(255,255,255,.035) !important;
    color: #aeb5c0 !important;
    font-size: 6.5px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
}

#lux-trade-mini-panel .lux-trade-mini-lev {
    flex: 0 0 auto !important;
    margin-left: 0 !important;
    font-size: 8px !important;
    white-space: nowrap !important;
}

#lux-trade-mini-panel .lux-trade-mini-close {
    flex: 0 0 20px !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    border: 1px solid rgba(239,83,80,.45) !important;
    border-radius: 50% !important;
    background: rgba(239,83,80,.10) !important;
    color: #ff8a87 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}

@media (max-width: 1100px) {
    #lux-trade-mini-panel {
        width: 268px !important;
    }
    #lux-trade-mini-panel .lux-trade-mini-symbol {
        min-width: 50px !important;
        font-size: 9px !important;
    }
}

@media (max-height: 650px) and (orientation: landscape) {
    #lux-trade-mini-panel {
        width: 268px !important;
    }
}

@media (max-width: 768px) {
    #lux-trade-mini-panel {
        width: min(268px, calc(100vw - 48px)) !important;
        max-width: calc(100vw - 48px) !important;
    }
    #lux-trade-mini-panel .lux-trade-mini-position-head {
        gap: 3px !important;
    }
    #lux-trade-mini-panel .lux-trade-mini-symbol {
        min-width: 46px !important;
        font-size: 9px !important;
    }
    #lux-trade-mini-panel .lux-trade-mini-auto,
    #lux-trade-mini-panel .lux-trade-mini-tf {
        font-size: 6px !important;
        padding-left: 2px !important;
        padding-right: 2px !important;
    }
    #lux-trade-mini-panel .lux-trade-mini-tf {
        min-width: 20px !important;
    }
    #lux-trade-mini-panel .lux-trade-mini-lev {
        font-size: 7.5px !important;
    }
}

/* =========================================================
   LUX · WATCHLIST LOGOS + DETALLE TRADINGVIEW v234
   ========================================================= */
#watchlist .wl-logo,
#watchlist .wl-logo-large,
.lux-detail-logo-v234 {
  position: relative;
}

#watchlist .wl-logo::after,
.lux-detail-logo-v234::after {
  content: attr(data-fallback);
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #d8dce5;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: -.02em;
  pointer-events: none;
}

.lux-detail-logo-v234::after {
  font-size: 15px;
}

#watchlist .wl-logo img,
.lux-detail-logo-v234 img {
  position: relative;
  z-index: 1;
}

.wl-selected-detail.lux-selected-market-v234 {
  display: block;
  flex: 1 1 auto;
  min-height: 220px;
}

.lux-selected-market-v234 .wl-detail-price {
  font-size: 34px;
  font-weight: 700;
}

.lux-selected-market-v234 .wl-detail-change.positive {
  color: var(--tv-green);
}

.lux-selected-market-v234 .wl-detail-change.negative {
  color: var(--tv-red);
}

@media (min-width: 769px) {
  .right-sidebar .watchlist-rows {
    flex: 0 1 54%;
    max-height: 54%;
  }

  .wl-selected-detail.lux-selected-market-v234 {
    padding-top: 18px;
  }
}


/* =========================================================
   v242 · Logos de mercado compartidos, sin costo de layout pesado
   ========================================================= */
.row-symbol {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.chart-symbol-logo,
.row-symbol .chart-symbol-logo {
    width: 18px;
    height: 18px;
    min-width: 18px;
    border-radius: 50%;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #10141d;
    border: 1px solid rgba(255,255,255,.10);
    flex: 0 0 18px;
}

.chart-symbol-logo img,
.row-symbol .chart-symbol-logo img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

.chart-symbol-logo.fallback {
    font-size: 7px;
    font-weight: 800;
    color: var(--tv-text-muted);
    letter-spacing: -.02em;
}

.wl-logo.symbol-search-logo,
.wl-logo-v242 {
    width: 22px;
    height: 22px;
    min-width: 22px;
    flex: 0 0 22px;
    border-radius: 50%;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #10141d;
    border: 1px solid rgba(255,255,255,.10);
}

.wl-logo.symbol-search-logo img,
.wl-logo-v242 img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

.wl-logo.symbol-search-logo.fallback,
.wl-logo-v242.fallback {
    font-size: 8px;
    font-weight: 800;
    color: var(--tv-text-muted);
}

.wl-logo.market-logo-flags img,
.wl-logo.symbol-forex-flags img,
.chart-symbol-logo.market-logo-flags img,
.chart-symbol-logo.symbol-forex-flags img {
    width: 68%;
    height: 68%;
    border-radius: 50%;
    position: absolute;
}

.wl-logo.market-logo-flags,
.wl-logo.symbol-forex-flags,
.chart-symbol-logo.market-logo-flags,
.chart-symbol-logo.symbol-forex-flags {
    position: relative;
}

.wl-logo.market-logo-flags img:first-child,
.wl-logo.symbol-forex-flags img:first-child,
.chart-symbol-logo.market-logo-flags img:first-child,
.chart-symbol-logo.symbol-forex-flags img:first-child {
    left: 0;
    top: 0;
}

.wl-logo.market-logo-flags img:last-child,
.wl-logo.symbol-forex-flags img:last-child,
.chart-symbol-logo.market-logo-flags img:last-child,
.chart-symbol-logo.symbol-forex-flags img:last-child {
    right: 0;
    bottom: 0;
}


/* =========================================================
   VIP 2 DESDE TRADING · PUBLICACIÓN / CAPTURA / DEMO
   ========================================================= */
.lux-vip2-drawing-btn{min-width:58px!important;padding:0 9px!important;border:1px solid rgba(212,175,55,.55)!important;background:rgba(212,175,55,.12)!important;color:#f2d675!important;font-weight:800!important}
.lux-vip2-modal{position:fixed;inset:0;z-index:120000;display:none;align-items:center;justify-content:center;padding:18px;font-family:Inter,system-ui,sans-serif}.lux-vip2-modal.open{display:flex}.lux-vip2-modal-backdrop{position:absolute;inset:0;background:rgba(2,4,8,.78);backdrop-filter:blur(8px)}
.lux-vip2-modal-card{position:relative;width:min(920px,96vw);max-height:min(860px,94dvh);display:flex;flex-direction:column;background:#121722;border:1px solid rgba(212,175,55,.34);border-radius:16px;box-shadow:0 28px 80px rgba(0,0,0,.6);overflow:hidden;color:#d1d4dc}
.lux-vip2-modal-card>header{display:flex;align-items:center;justify-content:space-between;padding:15px 17px;border-bottom:1px solid #2a2e39;background:#171b26}.lux-vip2-modal-card>header div{display:flex;flex-direction:column;gap:2px}.lux-vip2-modal-card>header small{font-size:9px;color:#d4af37;letter-spacing:.12em}.lux-vip2-modal-card>header strong{font-size:16px}.lux-vip2-modal-card>header button{width:34px;height:34px;border:0;border-radius:8px;background:#242a36;color:#fff;font-size:22px}
.lux-vip2-modal-scroll{padding:16px;overflow:auto;overscroll-behavior:contain}.lux-vip2-market{display:flex;justify-content:space-between;align-items:center;padding:11px 12px;border:1px solid #2a2e39;border-radius:10px;background:#0e131d;margin-bottom:13px}.lux-vip2-market span{font-weight:700}.lux-vip2-market b{padding:5px 9px;border-radius:999px;font-size:11px}.lux-vip2-market b.long{background:rgba(38,166,154,.14);color:#61d4c7}.lux-vip2-market b.short{background:rgba(239,83,80,.14);color:#ff8a87}
.lux-vip2-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.lux-vip2-grid label,.lux-vip2-message{display:flex;flex-direction:column;gap:5px}.lux-vip2-grid label span,.lux-vip2-message span,.lux-vip2-image-tools>span{font-size:10px;color:#8a8e99;font-weight:700;text-transform:uppercase;letter-spacing:.04em}.lux-vip2-grid input,.lux-vip2-grid select,.lux-vip2-message textarea{width:100%;border:1px solid #303641;background:#0d121b;color:#f0f3fa;border-radius:8px;padding:9px 10px;outline:none}.lux-vip2-grid input:focus,.lux-vip2-grid select:focus,.lux-vip2-message textarea:focus{border-color:#d4af37}.lux-vip2-grid label.hidden{display:none}.lux-vip2-message{margin-top:12px}.lux-vip2-message textarea{resize:vertical;min-height:78px}
.lux-vip2-image-tools{margin-top:14px;display:flex;flex-direction:column;gap:8px}.lux-vip2-image-tools>div{display:flex;gap:7px;flex-wrap:wrap}.lux-vip2-image-tools button{border:1px solid #303641;background:#171c27;color:#cbd0da;border-radius:8px;padding:8px 10px;font-size:11px}.lux-vip2-image-tools button.active{border-color:#d4af37;background:rgba(212,175,55,.12);color:#f1d678}.lux-vip2-preview{margin-top:10px;min-height:190px;border:1px dashed #343a46;border-radius:10px;background:#0a0e15;display:grid;place-items:center;overflow:hidden;position:relative}.lux-vip2-preview img{display:block;max-width:100%;max-height:360px;object-fit:contain}.lux-vip2-preview>span{display:none;color:#69717f;font-size:11px}.lux-vip2-preview.empty>span{display:block}.lux-vip2-preview.empty img{display:none}
.lux-vip2-note{margin-top:11px;padding:10px 11px;border-radius:9px;background:rgba(38,166,154,.08);border:1px solid rgba(38,166,154,.22);font-size:11px;line-height:1.45;color:#b7d9d5}.lux-vip2-status{min-height:20px;margin-top:9px;color:#f1d678;font-size:11px;font-weight:700}.lux-vip2-modal-card>footer{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid #2a2e39;background:#111620}.lux-vip2-modal-card>footer button{min-height:38px;border-radius:9px;padding:0 14px;font-weight:800;font-size:11px}.lux-vip2-modal-card>footer .primary{background:#d4af37;border:1px solid #e1c158;color:#15120a}.lux-vip2-modal-card>footer .secondary{background:#202633;border:1px solid #343b49;color:#d8dce4}.lux-vip2-modal-card>footer .danger{background:rgba(239,83,80,.11);border:1px solid rgba(239,83,80,.4);color:#ff8a87}
html.lux-vip2-modal-open,html.lux-vip2-modal-open body{overscroll-behavior:none}.lux-vip2-portfolio-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}.lux-vip2-portfolio-summary>div{padding:10px;border:1px solid #2a2e39;background:#111722;border-radius:9px;display:flex;flex-direction:column;gap:4px}.lux-vip2-portfolio-summary span{font-size:9px;color:#8a8e99}.lux-vip2-portfolio-summary b{font-size:13px}.lux-vip2-portfolio-summary .positive{color:#42c6b8}.lux-vip2-portfolio-summary .negative{color:#ff7975}.lux-vip2-list-title{margin:12px 2px 7px;color:#d4af37;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.lux-vip2-mini-badge{display:inline-flex!important;padding:2px 6px!important;border-radius:999px;background:rgba(212,175,55,.11);color:#e2c361!important;border:1px solid rgba(212,175,55,.28);font-size:8px!important;font-weight:800}.lux-vip2-portfolio-card.closed{opacity:.86}
@media(max-width:768px){.lux-vip2-modal{padding:0;align-items:flex-end}.lux-vip2-modal-card{width:100vw;max-width:none;max-height:92dvh;border-radius:18px 18px 0 0;border-left:0;border-right:0;border-bottom:0;padding-bottom:env(safe-area-inset-bottom)}.lux-vip2-modal-scroll{padding:13px}.lux-vip2-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.lux-vip2-grid input,.lux-vip2-grid select,.lux-vip2-message textarea{font-size:16px!important;min-height:42px}.lux-vip2-modal-card>footer{position:sticky;bottom:0;display:grid;grid-template-columns:1fr 1fr;padding:10px 12px calc(10px + env(safe-area-inset-bottom));z-index:2}.lux-vip2-modal-card>footer .primary{grid-column:1/-1;order:-1}.lux-vip2-preview{min-height:150px}.lux-vip2-preview img{max-height:250px}.lux-vip2-image-tools>div{display:grid;grid-template-columns:repeat(3,1fr)}.lux-vip2-image-tools button{padding:9px 5px;font-size:10px}.lux-vip2-portfolio-summary{grid-template-columns:1fr 1fr}.lux-vip2-portfolio-summary>div:last-child{grid-column:1/-1}.drawing-edit-toolbar .lux-vip2-drawing-btn{min-width:62px!important;flex:0 0 62px!important}}


/* VIP 2 · estado de envío no bloqueante */
.lux-vip2-sending{position:fixed;inset:0;z-index:130000;display:flex;align-items:center;justify-content:center;padding:18px;pointer-events:none;opacity:0;visibility:hidden;transition:opacity .16s ease,visibility .16s ease;background:rgba(2,4,8,.28);backdrop-filter:blur(2px)}
.lux-vip2-sending.show{opacity:1;visibility:visible}
.lux-vip2-sending-card{display:flex;align-items:center;gap:12px;min-width:min(340px,88vw);max-width:88vw;padding:15px 17px;border-radius:13px;background:#111722;border:1px solid rgba(212,175,55,.38);box-shadow:0 18px 55px rgba(0,0,0,.55);color:#f1e8d2;font:700 13px/1.35 Inter,system-ui,sans-serif}
.lux-vip2-sending-spinner{width:18px;height:18px;border-radius:50%;border:2px solid rgba(212,175,55,.22);border-top-color:#d4af37;animation:luxVip2SendingSpin .75s linear infinite;flex:0 0 auto}
.lux-vip2-sending[data-kind="success"] .lux-vip2-sending-spinner{border:0;background:#26a69a;animation:none;box-shadow:0 0 0 4px rgba(38,166,154,.12)}
.lux-vip2-sending[data-kind="error"] .lux-vip2-sending-spinner{border:0;background:#ef5350;animation:none;box-shadow:0 0 0 4px rgba(239,83,80,.12)}
@keyframes luxVip2SendingSpin{to{transform:rotate(360deg)}}
@media(max-width:768px){.lux-vip2-sending{align-items:flex-end;padding:0 12px calc(18px + env(safe-area-inset-bottom))}.lux-vip2-sending-card{width:100%;min-width:0;padding:14px 15px;font-size:12px}}


/* VIP 2 MANUAL · isolated UI additions. These selectors do not modify drawing tools. */
.lux-vip2-open-top{border-color:rgba(212,175,55,.42)!important;background:linear-gradient(180deg,rgba(212,175,55,.15),rgba(212,175,55,.07))!important;color:#f2d675!important;font-weight:800!important;white-space:nowrap}
.lux-vip2-open-top:hover{border-color:rgba(212,175,55,.72)!important;background:rgba(212,175,55,.18)!important}
.lux-vip2-open-plus{font-size:15px;line-height:1;font-weight:900}
.lux-vip2-capital-preview{margin-top:10px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.lux-vip2-capital-preview>span{display:flex;flex-direction:column;gap:4px;padding:9px 10px;border:1px solid #2b3340;border-radius:9px;background:#0d131c;color:#8d95a3;font-size:9px;text-transform:uppercase;letter-spacing:.04em}
.lux-vip2-capital-preview b{color:#e5e9f0;font-size:11px;text-transform:none;letter-spacing:0}.lux-vip2-capital-preview b.negative{color:#ff827e}
.lux-vip2-modal-card>footer .gold{border-color:rgba(212,175,55,.45);background:rgba(212,175,55,.09);color:#f0d36f}
.lux-vip2-source-note{margin:0 0 10px;padding:8px 10px;border:1px solid rgba(212,175,55,.2);border-radius:8px;background:rgba(212,175,55,.055);color:#b9a96f;font-size:10px;line-height:1.4}
.lux-vip2-mini-badge,.lux-trade-mini-vip2{white-space:nowrap;border:1px solid rgba(212,175,55,.38);border-radius:5px;padding:2px 5px;color:#f1d36d;background:rgba(212,175,55,.10);font-size:8px;font-weight:850;letter-spacing:.03em}
.lux-trade-mini-view{margin-left:auto;border:1px solid rgba(212,175,55,.42);border-radius:6px;background:rgba(212,175,55,.10);color:#f1d36d;font-size:8px;font-weight:850;cursor:pointer;padding:4px 7px}
.lux-trade-mini-view:hover{background:rgba(212,175,55,.18)}
@media(max-width:768px){.lux-vip2-open-top{min-width:max-content!important;height:34px!important;padding:0 10px!important;font-size:11px!important}.lux-vip2-capital-preview{grid-template-columns:1fr 1fr}.lux-vip2-modal-card>footer{grid-template-columns:1fr 1fr}.lux-vip2-modal-card>footer [data-vip2-open-publish]{grid-column:1/-1;order:-2;min-height:46px;font-size:12px}.lux-vip2-modal-card>footer [data-vip2-publish]{grid-column:1/-1;order:-1}}


/* VIP 2 MANUAL · mismo comportamiento visual que Posiciones / LUX AUTO */
.lux-vip2-portfolio-card{border-color:rgba(212,175,55,.24)!important}
.lux-vip2-portfolio-card .sim-position-title{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.lux-vip2-card-editor{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important}
.lux-vip2-card-editor .sim-save-risk{grid-column:1/-1}
.lux-trade-mini-vip2-actions{margin-left:auto;display:inline-flex;align-items:center;gap:4px}
#lux-trade-mini-panel .lux-trade-mini-vip2-actions .lux-trade-mini-view{margin-left:0;padding:3px 5px;font-size:7px}
#lux-trade-mini-panel .lux-trade-mini-vip2-actions .lux-trade-mini-close{position:static;margin-left:0}
@media(max-width:760px){
  .lux-vip2-card-editor{grid-template-columns:1fr!important}
  .lux-vip2-card-editor .sim-save-risk{grid-column:auto}
  .lux-vip2-portfolio-card .sim-card-actions{width:100%;justify-content:flex-start}
  #lux-trade-mini-panel .lux-trade-mini-vip2-actions{gap:3px;flex-wrap:wrap}
}


/* Capa PNL/operativas: sólo visual, nunca bloquea herramientas del chart */

#vip2-manual-overlay-svg,#vip2-manual-overlay-svg *{pointer-events:none!important;}


/* VIP 2 MANUAL · separación visual Activas / Historial */
.lux-vip2-subtabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
  margin:7px 0 12px;
  padding:4px;
  border:1px solid rgba(212,175,55,.18);
  border-radius:11px;
  background:#0f141d;
}
.lux-vip2-subtabs button{
  appearance:none;
  border:1px solid transparent;
  border-radius:8px;
  min-height:36px;
  padding:7px 9px;
  background:transparent;
  color:#8f96a6;
  font-size:10px;
  font-weight:800;
  letter-spacing:.025em;
  cursor:pointer;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.lux-vip2-subtabs button span{
  display:inline-flex;
  min-width:18px;
  height:18px;
  align-items:center;
  justify-content:center;
  margin-left:4px;
  padding:0 5px;
  border-radius:999px;
  background:#222938;
  color:#c7ccd7;
  font-size:9px;
}
.lux-vip2-subtabs button.active{
  border-color:rgba(212,175,55,.5);
  background:rgba(212,175,55,.11);
  color:#f1d368;
}
.lux-vip2-subtabs button.active span{
  background:rgba(212,175,55,.18);
  color:#f1d368;
}
.lux-vip2-subtab-content{
  min-width:0;
}
.lux-vip2-subtab-content .lux-vip2-list-title{
  margin-top:5px;
}
.lux-vip2-empty{
  margin-top:8px;
}
@media(max-width:768px){
  .lux-vip2-subtabs{
    position:sticky;
    top:0;
    z-index:3;
    backdrop-filter:blur(10px);
  }
}
