/* =========================================================
   VEXTA / NEXT - SHARED DARK / LIGHT THEME
   ========================================================= */

html{
    color-scheme:dark;
}

html[data-theme="light"]{
    color-scheme:light;
}


/* ---------------------------------------------------------
   TOGGLE BUTTON
   --------------------------------------------------------- */

.vexta-theme-toggle{
    width:36px;
    height:36px;
    min-width:36px;
    padding:0;
    border-radius:10px;

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

    border:1px solid rgba(148,163,184,.22);
    background:rgba(10,18,34,.82);
    color:#e8f0ff;

    font-size:17px;
    line-height:1;

    cursor:pointer;

    box-shadow:
        0 8px 24px rgba(0,0,0,.18),
        inset 0 1px 0 rgba(255,255,255,.04);

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

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

    flex:0 0 auto;
    margin-left:10px;
    z-index:10000;
}

.vexta-theme-toggle:hover{
    transform:translateY(-1px);
    border-color:rgba(104,160,255,.5);
}

.vexta-theme-toggle:active{
    transform:translateY(0);
}

.vexta-theme-toggle svg{
    width:17px;
    height:17px;
    display:block;
}


/* Fallback if no suitable header exists */
.vexta-theme-toggle.vexta-theme-toggle-fixed{
    position:fixed;
    top:14px;
    right:14px;
    margin:0;
}


/* =========================================================
   LIGHT THEME
   ========================================================= */

html[data-theme="light"] body{
    background:#f3f6fb !important;
    color:#172033 !important;
}


/* Main structural surfaces */
html[data-theme="light"] .topbar,
html[data-theme="light"] header,
html[data-theme="light"] .header,
html[data-theme="light"] .navbar,
html[data-theme="light"] nav{
    background-color:rgba(248,250,253,.94) !important;
    border-color:#d9e1ec !important;
}


/* Cards / panels */
html[data-theme="light"] .card,
html[data-theme="light"] .panel,
html[data-theme="light"] .table-card,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .coin-card,
html[data-theme="light"] .pool-card,
html[data-theme="light"] .quick-connect,
html[data-theme="light"] .quick-connect-card,
html[data-theme="light"] .dashboard-card,
html[data-theme="light"] .metric-card,
html[data-theme="light"] .prediction-card,
html[data-theme="light"] .best-card,
html[data-theme="light"] .rbf-shell,
html[data-theme="light"] .vexta-compact-shell{
    background:#ffffff !important;
    border-color:#dce4ef !important;

    box-shadow:
        0 10px 30px rgba(35,50,75,.06) !important;
}


/* Secondary / nested surfaces */
html[data-theme="light"] .rbf-stage,
html[data-theme="light"] .table-wrap,
html[data-theme="light"] .quick-connect-value,
html[data-theme="light"] .connect-value,
html[data-theme="light"] .server-select,
html[data-theme="light"] .port-select{
    background-color:#f8fafd !important;
    border-color:#dce4ef !important;
}


/* Main text */
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] strong,
html[data-theme="light"] .panel-title,
html[data-theme="light"] .rbf-title,
html[data-theme="light"] .stat-value,
html[data-theme="light"] .metric-value,
html[data-theme="light"] .pool-title,
html[data-theme="light"] .coin-title{
    color:#172033 !important;
}


/* Secondary text */
html[data-theme="light"] p,
html[data-theme="light"] .muted,
html[data-theme="light"] .subtitle,
html[data-theme="light"] .stat-label,
html[data-theme="light"] .metric-label,
html[data-theme="light"] .rbf-meta,
html[data-theme="light"] .rbf-kicker,
html[data-theme="light"] .note,
html[data-theme="light"] small{
    color:#64748b !important;
}


/* Tables */
html[data-theme="light"] table{
    color:#263247 !important;
}

html[data-theme="light"] th{
    color:#64748b !important;
    border-color:#e3e9f1 !important;
}

html[data-theme="light"] td{
    color:#263247 !important;
    border-color:#e8edf4 !important;
}

html[data-theme="light"] tbody tr:hover{
    background:rgba(74,116,190,.045) !important;
}


/* Inputs / selects */
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea{
    color:#172033 !important;
    background:#ffffff !important;
    border-color:#ccd6e3 !important;
}

html[data-theme="light"] input::placeholder{
    color:#94a3b8 !important;
}


/* Buttons and neutral links */
html[data-theme="light"] .vexta-theme-toggle{
    background:#ffffff;
    border-color:#d4deea;
    color:#263247;

    box-shadow:
        0 6px 18px rgba(35,50,75,.10);
}


/* Keep miner addresses readable */
html[data-theme="light"] .miner-address-cell span,
html[data-theme="light"] .block-miner span{
    color:#31466c !important;
}


/* Graph */
html[data-theme="light"] .rbf-grid{
    stroke:rgba(54,76,110,.13) !important;
}

html[data-theme="light"] .rbf-guide{
    stroke:rgba(54,76,110,.08) !important;
}

html[data-theme="light"] .rbf-y,
html[data-theme="light"] .rbf-x1,
html[data-theme="light"] .rbf-x2{
    fill:#718096 !important;
}


/* Footer */
html[data-theme="light"] footer,
html[data-theme="light"] .footer{
    color:#7a8799 !important;
    border-color:#dce4ef !important;
}


/* ---------------------------------------------------------
   Mobile
   --------------------------------------------------------- */

@media(max-width:760px){

    .vexta-theme-toggle{
        width:34px;
        height:34px;
        min-width:34px;
        border-radius:9px;
    }

    .vexta-theme-toggle.vexta-theme-toggle-fixed{
        top:10px;
        right:10px;
    }
}


/* =========================================================
   CLEAN STATUS / SOCIAL LABELS
   Remove pill borders/backgrounds
   ========================================================= */

/* ONLINE / status badges */
.status-online,
.online-status,
.pool-online,
.coin-online,
.badge-online,
.status-badge.online,
.status-badge.status-online,
.online-badge,

/* Android / Discord / Telegram */
.android-app,
.android-link,
.discord-link,
.telegram-link,
.social-link,
.social-badge,
.app-badge,
.header-social,
.topbar-social{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
    outline:none !important;
}


/* Preserve green ONLINE text */
.status-online,
.online-status,
.pool-online,
.coin-online,
.badge-online,
.status-badge.online,
.status-badge.status-online,
.online-badge{
    color:#45e0a2 !important;
}


/* Remove rounded pill appearance */
.status-online,
.online-status,
.pool-online,
.coin-online,
.badge-online,
.status-badge.online,
.status-badge.status-online,
.online-badge,
.android-app,
.android-link,
.discord-link,
.telegram-link,
.social-link,
.social-badge,
.app-badge{
    border-radius:0 !important;
    padding-left:0 !important;
    padding-right:0 !important;
}


/* Light mode stays clean too */
html[data-theme="light"] .status-online,
html[data-theme="light"] .online-status,
html[data-theme="light"] .pool-online,
html[data-theme="light"] .coin-online,
html[data-theme="light"] .badge-online,
html[data-theme="light"] .status-badge.online,
html[data-theme="light"] .online-badge,
html[data-theme="light"] .android-app,
html[data-theme="light"] .android-link,
html[data-theme="light"] .discord-link,
html[data-theme="light"] .telegram-link,
html[data-theme="light"] .social-link,
html[data-theme="light"] .social-badge,
html[data-theme="light"] .app-badge{
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
}


/* =========================================================
   FINAL CLEAN HEADER / ONLINE ELEMENTS
   ========================================================= */

/* Main page ONLINE */
.status.online,
.status.online:hover{
    border-color:transparent !important;
    border:none !important;
    background:transparent !important;
    box-shadow:none !important;
    outline:none !important;
}


/* Pool page ONLINE / OFFLINE container */
#pool-status,
#pool-status:hover{
    border-color:transparent !important;
    border:none !important;
    background:transparent !important;
    box-shadow:none !important;
    outline:none !important;
}


/* Android App / Discord / Telegram Bot */
.header-link.header-link-active,
.header-link.header-link-active:hover,
.header-link.header-link-active:focus,
.header-link.header-link-active:active{
    border-color:transparent !important;
    border:none !important;
    background:transparent !important;
    box-shadow:none !important;
    outline:none !important;
}


/* Same treatment in light mode */
html[data-theme="light"] .status.online,
html[data-theme="light"] #pool-status,
html[data-theme="light"] .header-link.header-link-active{
    border:none !important;
    background:transparent !important;
    box-shadow:none !important;
}


/* =========================================================
   REMOVE BORDER FROM AWAITING ACTIVATION
   ========================================================= */

.status.scheduled,
.status.scheduled:hover,
.status.awaiting,
.status.awaiting:hover{
    border:none !important;
    box-shadow:none !important;
    outline:none !important;
    background:transparent !important;
}

/* if randomx activation badge uses generic top-right badge styling */
.pool-card .status.scheduled,
.pool-card .status.awaiting{
    border:none !important;
    box-shadow:none !important;
    background:transparent !important;
}

/* light mode */
html[data-theme="light"] .status.scheduled,
html[data-theme="light"] .status.awaiting{
    border:none !important;
    box-shadow:none !important;
    background:transparent !important;
}