/* ═══════════════════════════════════════════════════════════
   CYBERPUNK GLASS THEME — Portal V2 (Full Intensity)
   ═══════════════════════════════════════════════════════════ */

@keyframes cp-scan {
    0% {
        transform: translateX(-100%)
    }

    100% {
        transform: translateX(200%)
    }
}

@keyframes cp-border-flow {
    0% {
        background-position: 0% 50%
    }

    50% {
        background-position: 100% 50%
    }

    100% {
        background-position: 0% 50%
    }
}

@keyframes cp-pulse {

    0%,
    100% {
        opacity: .6
    }

    50% {
        opacity: 1
    }
}

@keyframes cp-wave {
    0% {
        transform: translateX(0) scaleY(1)
    }

    50% {
        transform: translateX(-25%) scaleY(.7)
    }

    100% {
        transform: translateX(-50%) scaleY(1)
    }
}

@keyframes cp-glow-cyan {

    0%,
    100% {
        box-shadow: 0 0 8px #00f0ff, 0 0 20px rgba(0, 240, 255, .15)
    }

    50% {
        box-shadow: 0 0 15px #00f0ff, 0 0 40px rgba(0, 240, 255, .25)
    }
}

/* ── Variables ──────────────────────────────────────────── */
[data-theme="cyberpunk"] {
    --cp-cyan: #00f0ff;
    --cp-purple: #bd00ff;
    --cp-pink: #ff0080;
    --cp-green: #39ff14;
    --cp-yellow: #ffe600;
    --cp-orange: #ff6b00;
    --cp-bg: #0a0a1a;
    --cp-bg2: #0d0d24;
    --cp-card: rgba(13, 13, 36, .92);
    --glass-bg: rgba(13, 13, 36, .92);
    --glass-border: rgba(0, 240, 255, .18);
    --glass-shadow: 0 8px 32px rgba(0, 0, 0, .5);
    --text-primary: #e0f0ff;
    --text-secondary: #6a8aaa;
    --surface: #0d0d24;
    --portal-accent: #00f0ff;
    --portal-accent-glow: rgba(0, 240, 255, .3);
    --portal-success: #39ff14;
    --portal-warning: #ffe600;
    --portal-danger: #ff0080;
}

/* ── Body ───────────────────────────────────────────────── */
[data-theme="cyberpunk"] body {
    background: var(--cp-bg);
    background-image:
        linear-gradient(rgba(0, 240, 255, .04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 240, 255, .04) 1px, transparent 1px),
        radial-gradient(ellipse at 0% 0%, rgba(0, 240, 255, .1) 0%, transparent 50%),
        radial-gradient(ellipse at 100% 100%, rgba(189, 0, 255, .1) 0%, transparent 50%);
    background-size: 40px 40px, 40px 40px, 100% 100%, 100% 100%;
}

/* ── Sidebar ────────────────────────────────────────────── */
[data-theme="cyberpunk"] .portal-sidebar {
    background: linear-gradient(180deg, rgba(6, 6, 18, .98), rgba(10, 10, 26, .98));
    border-color: var(--cp-cyan) !important;
    border-width: 0 0 0 2px !important;
    box-shadow: -5px 0 30px rgba(0, 240, 255, .08), inset 2px 0 20px rgba(0, 240, 255, .03);
}

[dir="ltr"][data-theme="cyberpunk"] .portal-sidebar {
    border-width: 0 2px 0 0 !important;
    box-shadow: 5px 0 30px rgba(0, 240, 255, .08), inset -2px 0 20px rgba(0, 240, 255, .03);
}

[data-theme="cyberpunk"] .portal-sidebar-header {
    border-color: transparent;
    position: relative;
    padding-bottom: 18px;
}

[data-theme="cyberpunk"] .portal-sidebar-header::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 5%;
    right: 5%;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--cp-cyan), var(--cp-purple), transparent);
}

[data-theme="cyberpunk"] .portal-logo-text {
    background: linear-gradient(135deg, var(--cp-cyan), var(--cp-purple));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    filter: drop-shadow(0 0 12px rgba(0, 240, 255, .6));
    font-size: 1.3rem;
    letter-spacing: 1px;
}

[data-theme="cyberpunk"] .portal-logo-icon {
    color: var(--cp-cyan);
    filter: drop-shadow(0 0 10px rgba(0, 240, 255, .7));
}

[data-theme="cyberpunk"] .portal-user-info {
    border-color: rgba(0, 240, 255, .1);
    background: linear-gradient(135deg, rgba(0, 240, 255, .04), rgba(189, 0, 255, .02));
    margin: 8px 12px;
    border-radius: 12px;
    border: 1px solid rgba(0, 240, 255, .12);
}

[data-theme="cyberpunk"] .portal-user-avatar {
    background: linear-gradient(135deg, rgba(0, 240, 255, .15), rgba(189, 0, 255, .1));
    border: 2px solid var(--cp-cyan);
    color: var(--cp-cyan);
    box-shadow: 0 0 15px rgba(0, 240, 255, .3);
}

[data-theme="cyberpunk"] .portal-user-name {
    color: var(--cp-cyan);
    font-weight: 700;
}

[data-theme="cyberpunk"] .portal-user-status {
    color: var(--cp-green);
    text-shadow: 0 0 10px rgba(57, 255, 20, .5);
}

/* Nav Items */
[data-theme="cyberpunk"] .portal-nav-item {
    color: #4a6a8a;
    transition: all .3s;
    border-radius: 10px;
    margin: 2px 10px;
    position: relative;
    border: 1px solid transparent;
}

[data-theme="cyberpunk"] .portal-nav-item::before {
    display: none;
}

[data-theme="cyberpunk"] .portal-nav-item:hover {
    color: var(--cp-cyan);
    background: rgba(0, 240, 255, .06);
    border-color: rgba(0, 240, 255, .15);
    text-shadow: 0 0 12px rgba(0, 240, 255, .4);
}

[data-theme="cyberpunk"] .portal-nav-item:hover svg,
[data-theme="cyberpunk"] .portal-nav-item:hover i {
    filter: drop-shadow(0 0 8px rgba(0, 240, 255, .7));
}

[data-theme="cyberpunk"] .portal-nav-item.active {
    background: linear-gradient(135deg, rgba(0, 240, 255, .12), rgba(189, 0, 255, .08)) !important;
    color: var(--cp-cyan) !important;
    border: 1px solid rgba(0, 240, 255, .35) !important;
    box-shadow: 0 0 20px rgba(0, 240, 255, .12), inset 0 0 20px rgba(0, 240, 255, .05);
    text-shadow: 0 0 15px rgba(0, 240, 255, .6);
}

[data-theme="cyberpunk"] .portal-nav-item.active svg,
[data-theme="cyberpunk"] .portal-nav-item.active i {
    filter: drop-shadow(0 0 10px rgba(0, 240, 255, .8));
}

[data-theme="cyberpunk"] .portal-logout-btn:hover {
    color: var(--cp-pink) !important;
    background: rgba(255, 0, 128, .08);
    border-color: rgba(255, 0, 128, .25);
    text-shadow: 0 0 12px rgba(255, 0, 128, .5);
}

[data-theme="cyberpunk"] .portal-sidebar-footer {
    border-color: rgba(0, 240, 255, .1);
}

/* ── Topbar ─────────────────────────────────────────────── */
[data-theme="cyberpunk"] .portal-topbar {
    background: linear-gradient(180deg, rgba(6, 6, 18, .96), rgba(10, 10, 26, .94));
    border-color: transparent;
    box-shadow: 0 4px 25px rgba(0, 0, 0, .4);
    position: relative;
}

[data-theme="cyberpunk"] .portal-topbar::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--cp-cyan), var(--cp-purple), var(--cp-pink), var(--cp-cyan));
    background-size: 200% 100%;
    animation: cp-border-flow 4s linear infinite;
}

[data-theme="cyberpunk"] .portal-page-title {
    color: var(--cp-cyan);
    text-shadow: 0 0 15px rgba(0, 240, 255, .4);
    letter-spacing: .5px;
    font-weight: 700;
}

[data-theme="cyberpunk"] .portal-topbar .btn-icon {
    color: #5a7a9a;
    border: 1px solid rgba(0, 240, 255, .15);
    background: rgba(0, 240, 255, .04);
}

[data-theme="cyberpunk"] .portal-topbar .btn-icon:hover {
    color: var(--cp-cyan);
    border-color: var(--cp-cyan);
    background: rgba(0, 240, 255, .1);
    box-shadow: 0 0 20px rgba(0, 240, 255, .2);
}

/* ── Glass Cards (FULL) ─────────────────────────────────── */
[data-theme="cyberpunk"] .glass-card {
    background: linear-gradient(145deg, rgba(8, 8, 22, .95), rgba(13, 13, 36, .9)) !important;
    border: 1px solid rgba(0, 240, 255, .18) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, .5), 0 0 1px rgba(0, 240, 255, .3), inset 0 1px 0 rgba(0, 240, 255, .08) !important;
    position: relative;
    overflow: hidden;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

[data-theme="cyberpunk"] .glass-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent 0%, var(--cp-cyan) 30%, var(--cp-purple) 70%, transparent 100%);
    background-size: 200% 100%;
    animation: cp-border-flow 3s linear infinite;
    z-index: 1;
}

[data-theme="cyberpunk"] .glass-card::after {
    content: '';
    position: absolute;
    bottom: -20px;
    left: -50%;
    right: -50%;
    height: 80px;
    background: linear-gradient(180deg, transparent, rgba(0, 240, 255, .03), rgba(189, 0, 255, .03));
    border-radius: 50%;
    animation: cp-wave 6s ease-in-out infinite;
    pointer-events: none;
    z-index: 0;
}

[data-theme="cyberpunk"] .glass-card:hover {
    border-color: rgba(0, 240, 255, .3) !important;
    box-shadow: 0 8px 40px rgba(0, 0, 0, .5), 0 0 25px rgba(0, 240, 255, .1) !important;
}

/* ── Welcome Card ───────────────────────────────────────── */
[data-theme="cyberpunk"] .portal-welcome-card {
    background: linear-gradient(135deg, rgba(0, 240, 255, .08), rgba(189, 0, 255, .05), rgba(8, 8, 22, .95)) !important;
    border-color: rgba(0, 240, 255, .25) !important;
}

[data-theme="cyberpunk"] .welcome-title {
    color: #fff;
    text-shadow: 0 0 20px rgba(0, 240, 255, .3);
}

[data-theme="cyberpunk"] .welcome-sub {
    color: var(--cp-cyan);
    text-shadow: 0 0 10px rgba(0, 240, 255, .4);
    font-family: 'Courier New', monospace;
}

[data-theme="cyberpunk"] .welcome-status {
    animation: cp-glow-cyan 3s ease-in-out infinite;
    border-radius: 20px;
}

[data-theme="cyberpunk"] .welcome-status .status-dot {
    background: var(--cp-green);
    box-shadow: 0 0 10px var(--cp-green), 0 0 20px rgba(57, 255, 20, .3);
}

/* ── Card Titles ────────────────────────────────────────── */
[data-theme="cyberpunk"] .card-title {
    color: var(--cp-cyan);
    text-shadow: 0 0 10px rgba(0, 240, 255, .3);
    letter-spacing: .5px;
    text-transform: uppercase;
    font-size: .85rem;
}

[data-theme="cyberpunk"] .card-title i,
[data-theme="cyberpunk"] .card-title svg {
    color: var(--cp-cyan);
    filter: drop-shadow(0 0 8px rgba(0, 240, 255, .6));
}

/* ── Traffic Donut ──────────────────────────────────────── */
[data-theme="cyberpunk"] .donut-bg {
    stroke: rgba(0, 240, 255, .1);
}

[data-theme="cyberpunk"] .donut-fill {
    filter: drop-shadow(0 0 12px rgba(0, 240, 255, .6));
}

[data-theme="cyberpunk"] .donut-percent {
    color: var(--cp-cyan);
    text-shadow: 0 0 20px rgba(0, 240, 255, .6);
    font-weight: 900;
    font-size: 1.6rem;
}

[data-theme="cyberpunk"] .donut-label {
    color: var(--cp-green);
    text-shadow: 0 0 8px rgba(57, 255, 20, .3);
}

[data-theme="cyberpunk"] .traffic-row {
    border-color: rgba(0, 240, 255, .08);
    color: #6a8aaa;
}

[data-theme="cyberpunk"] .traffic-row span:last-child {
    color: var(--cp-cyan);
    font-weight: 600;
}

[data-theme="cyberpunk"] .traffic-total span:last-child {
    color: var(--cp-purple);
    text-shadow: 0 0 10px rgba(189, 0, 255, .4);
    font-weight: 700;
}

/* ── Progress Bars ──────────────────────────────────────── */
[data-theme="cyberpunk"] .dash-bar-track {
    background: rgba(0, 240, 255, .04);
    border: 1px solid rgba(0, 240, 255, .1);
    border-radius: 6px;
    overflow: hidden;
}

[data-theme="cyberpunk"] .dash-bar-fill {
    position: relative;
}

[data-theme="cyberpunk"] .dash-bar-fill::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 40%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .2), transparent);
    animation: cp-scan 2s ease-in-out infinite;
}

[data-theme="cyberpunk"] .dash-bar-fill[data-level="green"] {
    background: linear-gradient(90deg, #00f0ff, #39ff14) !important;
    box-shadow: 0 0 15px rgba(0, 240, 255, .5), 0 0 30px rgba(57, 255, 20, .2);
}

[data-theme="cyberpunk"] .dash-bar-fill[data-level="yellow"] {
    background: linear-gradient(90deg, #ffe600, #ff6b00) !important;
    box-shadow: 0 0 15px rgba(255, 230, 0, .5);
}

[data-theme="cyberpunk"] .dash-bar-fill[data-level="red"] {
    background: linear-gradient(90deg, #ff6b00, #ff0080) !important;
    box-shadow: 0 0 15px rgba(255, 0, 128, .5);
}

[data-theme="cyberpunk"] .dash-bar-header span {
    color: #6a8aaa;
}

[data-theme="cyberpunk"] .dash-bar-val {
    color: var(--cp-cyan) !important;
    font-weight: 700;
    text-shadow: 0 0 8px rgba(0, 240, 255, .3);
}

/* ── Stat Cards ─────────────────────────────────────────── */
[data-theme="cyberpunk"] .portal-stat-card {
    transition: all .3s;
}

[data-theme="cyberpunk"] .portal-stat-card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 240, 255, .35) !important;
    box-shadow: 0 8px 35px rgba(0, 0, 0, .5), 0 0 25px rgba(0, 240, 255, .12) !important;
}

[data-theme="cyberpunk"] .stat-icon {
    border-radius: 14px;
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
}

[data-theme="cyberpunk"] .stat-icon-days {
    background: linear-gradient(135deg, rgba(0, 240, 255, .15), rgba(0, 240, 255, .05)) !important;
    border: 2px solid rgba(0, 240, 255, .3) !important;
    color: var(--cp-cyan) !important;
    box-shadow: 0 0 20px rgba(0, 240, 255, .2) !important;
}

[data-theme="cyberpunk"] .stat-icon-balance {
    background: linear-gradient(135deg, rgba(57, 255, 20, .15), rgba(57, 255, 20, .05)) !important;
    border: 2px solid rgba(57, 255, 20, .3) !important;
    color: var(--cp-green) !important;
    box-shadow: 0 0 20px rgba(57, 255, 20, .2) !important;
}

[data-theme="cyberpunk"] .stat-icon-invoices {
    background: linear-gradient(135deg, rgba(255, 230, 0, .15), rgba(255, 230, 0, .05)) !important;
    border: 2px solid rgba(255, 230, 0, .3) !important;
    color: var(--cp-yellow) !important;
    box-shadow: 0 0 20px rgba(255, 230, 0, .2) !important;
}

[data-theme="cyberpunk"] .stat-icon-package {
    background: linear-gradient(135deg, rgba(189, 0, 255, .15), rgba(189, 0, 255, .05)) !important;
    border: 2px solid rgba(189, 0, 255, .3) !important;
    color: var(--cp-purple) !important;
    box-shadow: 0 0 20px rgba(189, 0, 255, .2) !important;
}

[data-theme="cyberpunk"] .stat-icon-tickets-open {
    background: linear-gradient(135deg, rgba(255, 107, 0, .15), rgba(255, 107, 0, .05)) !important;
    border: 2px solid rgba(255, 107, 0, .3) !important;
    color: var(--cp-orange) !important;
    box-shadow: 0 0 20px rgba(255, 107, 0, .2) !important;
}

[data-theme="cyberpunk"] .stat-icon-tickets-closed {
    background: linear-gradient(135deg, rgba(255, 0, 128, .15), rgba(255, 0, 128, .05)) !important;
    border: 2px solid rgba(255, 0, 128, .3) !important;
    color: var(--cp-pink) !important;
    box-shadow: 0 0 20px rgba(255, 0, 128, .2) !important;
}

[data-theme="cyberpunk"] .stat-icon i,
[data-theme="cyberpunk"] .stat-icon svg {
    filter: drop-shadow(0 0 6px currentColor);
}

[data-theme="cyberpunk"] .stat-value {
    color: #fff;
    text-shadow: 0 0 10px rgba(0, 240, 255, .2);
    font-weight: 800;
}

[data-theme="cyberpunk"] .stat-label {
    color: #5a7a9a;
    text-transform: uppercase;
    font-size: .7rem;
    letter-spacing: 1px;
}

/* ── Subscription Details ───────────────────────────────── */
[data-theme="cyberpunk"] .portal-sub-card {
    border-color: rgba(189, 0, 255, .2) !important;
}

[data-theme="cyberpunk"] .portal-sub-card::before {
    background: linear-gradient(90deg, transparent, var(--cp-purple), var(--cp-cyan), transparent) !important;
}

[data-theme="cyberpunk"] .sub-detail {
    border-color: rgba(0, 240, 255, .08);
}

[data-theme="cyberpunk"] .sub-label {
    color: #5a7a9a;
    text-transform: uppercase;
    font-size: .7rem;
    letter-spacing: .5px;
}

[data-theme="cyberpunk"] .sub-value {
    color: var(--cp-cyan);
    font-weight: 600;
    text-shadow: 0 0 8px rgba(0, 240, 255, .3);
}

/* ── Auto Renew ─────────────────────────────────────────── */
[data-theme="cyberpunk"] .portal-autorenew-card {
    border-color: rgba(57, 255, 20, .15) !important;
}

[data-theme="cyberpunk"] .portal-autorenew-card::before {
    background: linear-gradient(90deg, transparent, var(--cp-green), var(--cp-cyan), transparent) !important;
}

[data-theme="cyberpunk"] .autorenew-title {
    color: var(--cp-green);
    text-shadow: 0 0 10px rgba(57, 255, 20, .3);
}

[data-theme="cyberpunk"] .autorenew-title i,
[data-theme="cyberpunk"] .autorenew-title svg {
    filter: drop-shadow(0 0 8px rgba(57, 255, 20, .6));
}

[data-theme="cyberpunk"] .autorenew-desc {
    color: #5a7a9a;
}

[data-theme="cyberpunk"] .toggle-switch .toggle-slider {
    background: rgba(0, 240, 255, .08);
    border: 2px solid rgba(0, 240, 255, .2);
}

[data-theme="cyberpunk"] .toggle-switch input:checked+.toggle-slider {
    background: linear-gradient(135deg, var(--cp-cyan), var(--cp-green)) !important;
    box-shadow: 0 0 20px rgba(57, 255, 20, .4);
    border-color: var(--cp-green);
}

/* ── Quick Actions ──────────────────────────────────────── */
[data-theme="cyberpunk"] .action-btn {
    background: rgba(0, 240, 255, .03);
    border: 1px solid rgba(0, 240, 255, .12);
    color: #6a8aaa;
    transition: all .3s;
    position: relative;
    overflow: hidden;
}

[data-theme="cyberpunk"] .action-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(0, 240, 255, .3), transparent);
    opacity: 0;
    transition: opacity .3s;
}

[data-theme="cyberpunk"] .action-btn:hover {
    background: rgba(0, 240, 255, .08);
    border-color: rgba(0, 240, 255, .3);
    color: var(--cp-cyan);
    box-shadow: 0 0 25px rgba(0, 240, 255, .1);
    transform: translateY(-2px);
}

[data-theme="cyberpunk"] .action-btn:hover::before {
    opacity: 1;
}

[data-theme="cyberpunk"] .action-btn:hover i,
[data-theme="cyberpunk"] .action-btn:hover svg {
    filter: drop-shadow(0 0 8px rgba(0, 240, 255, .7));
}

/* ── Modals ─────────────────────────────────────────────── */
[data-theme="cyberpunk"] .portal-modal-overlay {
    background: rgba(3, 3, 10, .9);
}

[data-theme="cyberpunk"] .portal-modal {
    background: linear-gradient(145deg, rgba(8, 8, 22, .98), rgba(13, 13, 36, .98)) !important;
    border: 2px solid rgba(0, 240, 255, .2) !important;
    box-shadow: 0 0 50px rgba(0, 240, 255, .1), 0 20px 60px rgba(0, 0, 0, .7) !important;
}

[data-theme="cyberpunk"] .portal-modal-header {
    border-color: rgba(0, 240, 255, .12);
}

[data-theme="cyberpunk"] .portal-modal-header h3 {
    color: var(--cp-cyan);
    text-shadow: 0 0 12px rgba(0, 240, 255, .4);
}

[data-theme="cyberpunk"] .portal-modal-close:hover {
    color: var(--cp-pink);
}

[data-theme="cyberpunk"] .portal-modal-footer {
    border-color: rgba(0, 240, 255, .08);
}

/* ── Inputs ─────────────────────────────────────────────── */
[data-theme="cyberpunk"] .portal-input {
    background: rgba(0, 240, 255, .03);
    border: 2px solid rgba(0, 240, 255, .15);
    color: #e0f0ff;
}

[data-theme="cyberpunk"] .portal-input:focus {
    border-color: var(--cp-cyan);
    box-shadow: 0 0 20px rgba(0, 240, 255, .2);
    background: rgba(0, 240, 255, .06);
}

[data-theme="cyberpunk"] .portal-input::placeholder {
    color: #3a5570;
}

/* ── Buttons ────────────────────────────────────────────── */
[data-theme="cyberpunk"] .btn-primary {
    background: linear-gradient(135deg, var(--cp-cyan), var(--cp-purple)) !important;
    border: none;
    color: #fff;
    box-shadow: 0 4px 20px rgba(0, 240, 255, .35);
    text-shadow: 0 1px 3px rgba(0, 0, 0, .4);
    position: relative;
    overflow: hidden;
}

[data-theme="cyberpunk"] .btn-primary:hover {
    box-shadow: 0 6px 30px rgba(0, 240, 255, .5);
    transform: translateY(-2px);
}

/* ── Tables ─────────────────────────────────────────────── */
[data-theme="cyberpunk"] .inv-table th,
[data-theme="cyberpunk"] .portal-table thead th {
    background: rgba(0, 240, 255, .06);
    color: var(--cp-cyan);
    border-color: rgba(0, 240, 255, .12);
    text-shadow: 0 0 8px rgba(0, 240, 255, .2);
    text-transform: uppercase;
    font-size: .75rem;
    letter-spacing: 1px;
}

[data-theme="cyberpunk"] .inv-table tbody tr,
[data-theme="cyberpunk"] .portal-table tbody tr {
    border-color: rgba(0, 240, 255, .05);
}

[data-theme="cyberpunk"] .inv-table tbody tr:hover,
[data-theme="cyberpunk"] .portal-table tbody tr:hover {
    background: rgba(0, 240, 255, .04);
}

[data-theme="cyberpunk"] .inv-status-badge.paid {
    background: rgba(57, 255, 20, .1);
    color: var(--cp-green);
    border: 1px solid rgba(57, 255, 20, .25);
    text-shadow: 0 0 6px rgba(57, 255, 20, .4);
}

[data-theme="cyberpunk"] .inv-status-badge.unpaid {
    background: rgba(255, 0, 128, .1);
    color: var(--cp-pink);
    border: 1px solid rgba(255, 0, 128, .25);
    text-shadow: 0 0 6px rgba(255, 0, 128, .4);
}

/* ── Pagination ─────────────────────────────────────────── */
[data-theme="cyberpunk"] .portal-pagination .page-btn {
    background: rgba(0, 240, 255, .04);
    border: 1px solid rgba(0, 240, 255, .12);
    color: #5a7a9a;
}

[data-theme="cyberpunk"] .portal-pagination .page-btn:hover {
    background: rgba(0, 240, 255, .08);
    border-color: rgba(0, 240, 255, .3);
    color: var(--cp-cyan);
}

[data-theme="cyberpunk"] .portal-pagination .page-btn.active {
    background: linear-gradient(135deg, var(--cp-cyan), var(--cp-purple));
    border-color: var(--cp-cyan);
    color: #fff;
    box-shadow: 0 0 18px rgba(0, 240, 255, .35);
}

/* ── Sessions ───────────────────────────────────────────── */
[data-theme="cyberpunk"] .session-card {
    background: linear-gradient(145deg, rgba(8, 8, 22, .95), rgba(13, 13, 36, .9));
    border: 1px solid rgba(0, 240, 255, .1);
}

[data-theme="cyberpunk"] .session-card:hover {
    border-color: rgba(0, 240, 255, .25);
    box-shadow: 0 4px 25px rgba(0, 240, 255, .08);
}

[data-theme="cyberpunk"] .session-header-label {
    color: var(--cp-cyan);
}

[data-theme="cyberpunk"] .session-page-btn {
    border-color: rgba(0, 240, 255, .12);
    color: #5a7a9a;
}

[data-theme="cyberpunk"] .session-page-btn:hover {
    border-color: rgba(0, 240, 255, .3);
    color: var(--cp-cyan);
}

[data-theme="cyberpunk"] .session-page-btn.active {
    background: linear-gradient(135deg, var(--cp-cyan), var(--cp-purple));
    color: #fff;
    box-shadow: 0 0 15px rgba(0, 240, 255, .3);
}

/* ── Sub Status Dialog ──────────────────────────────────── */
[data-theme="cyberpunk"] .sub-status-overlay {
    background: rgba(3, 3, 10, .92);
}

[data-theme="cyberpunk"] .sub-status-dialog {
    background: linear-gradient(145deg, rgba(8, 8, 22, .99), rgba(13, 13, 36, .99));
    border: 2px solid rgba(0, 240, 255, .25);
    box-shadow: 0 0 60px rgba(0, 240, 255, .12), 0 25px 70px rgba(0, 0, 0, .7);
}

[data-theme="cyberpunk"] .sub-status-title {
    color: var(--cp-cyan);
    text-shadow: 0 0 20px rgba(0, 240, 255, .5);
}

[data-theme="cyberpunk"] .sub-status-icon-pulse {
    background: rgba(0, 240, 255, .1);
}

[data-theme="cyberpunk"] .sub-status-icon-inner {
    color: var(--cp-cyan);
    filter: drop-shadow(0 0 12px rgba(0, 240, 255, .6));
}

[data-theme="cyberpunk"] .sub-bar-track {
    background: rgba(0, 240, 255, .05);
    border: 1px solid rgba(0, 240, 255, .1);
}

[data-theme="cyberpunk"] .sub-status-btn-primary {
    background: linear-gradient(135deg, var(--cp-cyan), var(--cp-purple));
    border: none;
    box-shadow: 0 4px 20px rgba(0, 240, 255, .35);
}

[data-theme="cyberpunk"] .sub-status-btn-secondary {
    background: rgba(0, 240, 255, .06);
    border: 1px solid rgba(0, 240, 255, .15);
    color: #8a9ab0;
}

[data-theme="cyberpunk"] .sub-status-detail-row {
    border-color: rgba(0, 240, 255, .08);
}

[data-theme="cyberpunk"] .sub-status-detail-val {
    color: var(--cp-cyan);
}

/* ── Extensions / Change Pkg ────────────────────────────── */
[data-theme="cyberpunk"] .extensions-modal-content {
    background: linear-gradient(145deg, rgba(8, 8, 22, .99), rgba(13, 13, 36, .99)) !important;
    border: 2px solid rgba(0, 240, 255, .2) !important;
    box-shadow: 0 0 45px rgba(0, 240, 255, .1) !important;
}

[data-theme="cyberpunk"] .extensions-modal-header {
    border-color: rgba(0, 240, 255, .12);
}

[data-theme="cyberpunk"] .extensions-modal-header h3 {
    color: var(--cp-cyan);
}

[data-theme="cyberpunk"] .ext-card,
[data-theme="cyberpunk"] .pkg-modal-card {
    background: rgba(0, 240, 255, .03);
    border: 1px solid rgba(0, 240, 255, .1);
}

[data-theme="cyberpunk"] .ext-card:hover,
[data-theme="cyberpunk"] .pkg-modal-card:hover {
    border-color: rgba(0, 240, 255, .25);
    box-shadow: 0 4px 25px rgba(0, 240, 255, .1);
}

[data-theme="cyberpunk"] .ext-name {
    color: #e0f0ff;
}

[data-theme="cyberpunk"] .ext-price {
    color: var(--cp-cyan);
    text-shadow: 0 0 10px rgba(0, 240, 255, .4);
}

[data-theme="cyberpunk"] .current-pkg-card {
    background: rgba(0, 240, 255, .04);
    border: 1px solid rgba(0, 240, 255, .15);
}

[data-theme="cyberpunk"] .current-pkg-name {
    color: var(--cp-cyan);
}

/* ── Confirm Modal ──────────────────────────────────────── */
[data-theme="cyberpunk"] .confirm-modal-overlay {
    background: rgba(3, 3, 10, .88);
}

[data-theme="cyberpunk"] .confirm-modal {
    background: linear-gradient(145deg, rgba(8, 8, 22, .99), rgba(13, 13, 36, .99)) !important;
    border: 2px solid rgba(0, 240, 255, .2) !important;
    box-shadow: 0 0 35px rgba(0, 240, 255, .1) !important;
}

[data-theme="cyberpunk"] .confirm-modal-title {
    color: var(--cp-cyan);
}

[data-theme="cyberpunk"] .confirm-modal-cancel {
    background: rgba(0, 240, 255, .06);
    border: 1px solid rgba(0, 240, 255, .15);
    color: #8a9ab0;
}

[data-theme="cyberpunk"] .confirm-modal-ok {
    background: linear-gradient(135deg, var(--cp-cyan), var(--cp-purple));
    box-shadow: 0 4px 18px rgba(0, 240, 255, .35);
}

/* ── Support Page ───────────────────────────────────────── */
[data-theme="cyberpunk"] .support-tabs {
    border-color: rgba(0, 240, 255, .1);
    background: rgba(0, 240, 255, .02);
}

[data-theme="cyberpunk"] .support-tab:hover {
    background: rgba(0, 240, 255, .06);
    color: var(--cp-cyan);
}

[data-theme="cyberpunk"] .support-tab.active {
    background: linear-gradient(135deg, var(--cp-cyan), var(--cp-purple)) !important;
    box-shadow: 0 4px 18px rgba(0, 240, 255, .35);
}

[data-theme="cyberpunk"] .support-ticket-card {
    background: linear-gradient(145deg, rgba(8, 8, 22, .95), rgba(13, 13, 36, .9));
    border: 1px solid rgba(0, 240, 255, .1);
}

[data-theme="cyberpunk"] .support-ticket-card:hover {
    border-color: rgba(0, 240, 255, .25);
}

[data-theme="cyberpunk"] .support-ticket-id {
    color: var(--cp-cyan);
    background: rgba(0, 240, 255, .08);
}

[data-theme="cyberpunk"] .support-msg.admin .support-msg-bubble {
    background: linear-gradient(135deg, rgba(0, 240, 255, .08), rgba(189, 0, 255, .05));
    border: 1px solid rgba(0, 240, 255, .15);
}

/* ── Scrollbar ──────────────────────────────────────────── */
[data-theme="cyberpunk"] ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

[data-theme="cyberpunk"] ::-webkit-scrollbar-track {
    background: rgba(0, 240, 255, .02);
}

[data-theme="cyberpunk"] ::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--cp-cyan), var(--cp-purple));
    border-radius: 3px;
}

/* ── Spinner ────────────────────────────────────────────── */
[data-theme="cyberpunk"] .portal-spinner,
[data-theme="cyberpunk"] .spinner {
    border-color: rgba(0, 240, 255, .1);
    border-top-color: var(--cp-cyan);
    filter: drop-shadow(0 0 10px rgba(0, 240, 255, .5));
}

[data-theme="cyberpunk"] .portal-loading p {
    color: var(--cp-cyan);
    text-shadow: 0 0 12px rgba(0, 240, 255, .4);
}

/* ── Data Usage / Journals / Customize ──────────────────── */
[data-theme="cyberpunk"] .usage-filter-bar {
    background: rgba(0, 240, 255, .03);
    border-color: rgba(0, 240, 255, .1);
}

[data-theme="cyberpunk"] .usage-filter-bar select,
[data-theme="cyberpunk"] .usage-filter-bar input {
    background: rgba(0, 240, 255, .04);
    border-color: rgba(0, 240, 255, .12);
    color: #e0f0ff;
}

[data-theme="cyberpunk"] select {
    background: rgba(0, 240, 255, .04);
    border-color: rgba(0, 240, 255, .12);
    color: #e0f0ff;
}

[data-theme="cyberpunk"] select:focus {
    border-color: var(--cp-cyan);
    box-shadow: 0 0 12px rgba(0, 240, 255, .2);
}

[data-theme="cyberpunk"] .customize-widget-item {
    background: rgba(0, 240, 255, .03);
    border: 1px solid rgba(0, 240, 255, .1);
}

[data-theme="cyberpunk"] .customize-widget-item:hover {
    border-color: rgba(0, 240, 255, .2);
    background: rgba(0, 240, 255, .06);
}

[data-theme="cyberpunk"] .chpass-warning {
    background: rgba(255, 0, 128, .06);
    border-color: rgba(255, 0, 128, .2);
}

[data-theme="cyberpunk"] .portal-sidebar-overlay {
    background: rgba(3, 3, 10, .85);
}