﻿/* =========================================================
   VPSPANEL SELLER PANEL - PROFESSIONAL THEME
   Common CSS for all Seller Panel pages
   ========================================================= */


/* =========================================================
   1. GLOBAL
   ========================================================= */

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    font-family: "Segoe UI", Arial, sans-serif;
    background: #080516;
    color: #f4f1ff;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}

* {
    box-sizing: border-box;
}

button,
input,
select,
textarea {
    font-family: inherit;
}


/* =========================================================
   2. SELLER MAIN AREA
   ========================================================= */

.seller-main {
    min-height: 100vh;
    padding: 28px;
    background: radial-gradient( circle at 75% 0%, rgba(126, 54, 255, 0.16), transparent 32% ), radial-gradient( circle at 20% 100%, rgba(72, 25, 150, 0.12), transparent 35% ), linear-gradient( 135deg, #080516 0%, #0c0720 50%, #090518 100% );
}


/* =========================================================
   3. PAGE HEADER
   ========================================================= */

.seller-page-header,
.dashboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

    .seller-page-header h1,
    .seller-page-header h2,
    .dashboard-header h1,
    .dashboard-header h2 {
        margin: 0;
        color: #ffffff;
        font-size: 30px;
        font-weight: 800;
        letter-spacing: -0.4px;
    }

    .seller-page-header p,
    .dashboard-header p {
        margin: 6px 0 0;
        color: #a9a0bd;
        font-size: 14px;
    }


/* =========================================================
   4. COMMON CARD
   ========================================================= */

.seller-main .card,
.seller-main .seller-card,
.seller-main .panel,
.seller-main .box {
    background: linear-gradient( 145deg, rgba(27, 16, 50, 0.98), rgba(13, 8, 28, 0.98) );
    border: 1px solid rgba(157, 92, 255, 0.18);
    border-radius: 18px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.30), inset 0 1px 0 rgba(255, 255, 255, 0.025);
}


/* =========================================================
   5. VPS / LINUX PRODUCT CARDS
   ========================================================= */

.vps-product-card,
.vps-premium-main .vps-product-card,
.linux-product-card,
.linux-plan-card,
.product-card {
    position: relative;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    background: linear-gradient( 145deg, rgba(24, 13, 48, 0.99), rgba(11, 7, 25, 0.99) );
    border: 1px solid rgba(149, 77, 255, 0.28);
    border-radius: 18px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.32), 0 0 0 1px rgba(255, 255, 255, 0.015);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

    .vps-product-card:hover,
    .linux-product-card:hover,
    .linux-plan-card:hover,
    .product-card:hover {
        transform: translateY(-3px);
        border-color: rgba(160, 83, 255, 0.55);
        box-shadow: 0 20px 45px rgba(0, 0, 0, 0.40), 0 0 25px rgba(128, 55, 255, 0.10);
    }


    /* =========================================================
   6. CARD HEADER
   ========================================================= */

    .vps-product-card .card-header,
    .vps-product-card .product-header,
    .linux-product-card .card-header,
    .linux-plan-card .card-header {
        min-height: 82px;
        padding: 20px;
        background: linear-gradient( 135deg, #5320a8, #722de0 55%, #3d177d );
        border-bottom: 1px solid rgba(255, 255, 255, 0.10);
        border-radius: 18px 18px 0 0;
    }

    .vps-product-card h3,
    .vps-product-card h4,
    .linux-product-card h3,
    .linux-plan-card h3 {
        margin: 0;
        color: #ffffff;
        font-weight: 800;
    }


    /* =========================================================
   7. CARD BODY
   ========================================================= */

    .vps-product-card .card-body,
    .vps-product-card .product-body,
    .linux-product-card .card-body,
    .linux-plan-card .card-body {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        padding: 20px;
    }


/* =========================================================
   8. SERVER CONFIGURATION
   IMPORTANT: FULL DETAILS MUST BE VISIBLE
   ========================================================= */

.server-configuration,
.server-config,
.linux-configuration,
.vps-configuration {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

    .server-configuration ul,
    .server-config ul,
    .linux-configuration ul,
    .vps-configuration ul {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .server-configuration li,
    .server-config li,
    .linux-configuration li,
    .vps-configuration li {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        min-height: 24px;
        margin: 0 0 7px;
        color: #c8bfd8;
        font-size: 13px;
        line-height: 1.5;
        white-space: normal;
        word-break: normal;
        overflow-wrap: anywhere;
    }


        /* =========================================================
   9. COMMON CHECK ICON
   ========================================================= */

        .server-configuration li i,
        .server-config li i,
        .linux-configuration li i,
        .vps-configuration li i,
        .config-check {
            flex: 0 0 auto;
            color: #a855f7;
        }


/* =========================================================
   10. PRICE AREA
   ========================================================= */

.price-section,
.product-price,
.vps-price {
    margin-top: 18px;
    padding-top: 15px;
    border-top: 1px solid rgba(255, 255, 255, 0.10);
}

    .price-section .price,
    .product-price .price,
    .vps-price .price {
        color: #ffffff;
        font-size: 27px;
        font-weight: 800;
        letter-spacing: -0.4px;
    }

    .price-section small,
    .product-price small,
    .vps-price small {
        color: #9890a8;
        font-size: 12px;
    }


/* =========================================================
   11. STOCK STATUS
   ========================================================= */

.stock-status,
.status-badge,
.badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 28px;
    padding: 5px 11px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.stock-in,
.in-stock,
.status-active {
    color: #52f2a4;
    background: rgba(33, 196, 118, 0.12);
    border: 1px solid rgba(33, 196, 118, 0.28);
}

.stock-out,
.out-stock,
.status-inactive {
    color: #ff6b7a;
    background: rgba(255, 61, 91, 0.10);
    border: 1px solid rgba(255, 61, 91, 0.25);
}


/* =========================================================
   12. PROFESSIONAL BUTTONS
   ========================================================= */

.seller-main .btn,
.seller-main button {
    border-radius: 10px;
    transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.seller-main .btn-primary,
.seller-main .btn-buy,
.seller-main .buy-btn,
.seller-main .order-btn {
    color: #ffffff;
    background: linear-gradient( 135deg, #8b35ff, #6420d8 );
    border: 1px solid rgba(190, 137, 255, 0.35);
    box-shadow: 0 8px 20px rgba(108, 40, 220, 0.25);
}

    .seller-main .btn-primary:hover,
    .seller-main .btn-buy:hover,
    .seller-main .buy-btn:hover,
    .seller-main .order-btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 10px 25px rgba(108, 40, 220, 0.38);
    }


/* =========================================================
   13. TABLES
   ========================================================= */

.seller-main .table-responsive {
    width: 100%;
    overflow-x: auto;
    border-radius: 14px;
}

.seller-main table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: rgba(18, 10, 34, 0.90);
    color: #ddd6ea;
}

    .seller-main table thead th {
        padding: 14px 12px;
        background: linear-gradient( 135deg, rgba(117, 53, 205, 0.24), rgba(79, 34, 143, 0.20) );
        color: #ffffff;
        font-size: 12px;
        font-weight: 700;
        border-bottom: 1px solid rgba(166, 101, 255, 0.20);
        white-space: nowrap;
    }

    .seller-main table tbody td {
        padding: 13px 12px;
        color: #c9c1d7;
        font-size: 13px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.055);
        vertical-align: middle;
    }

    .seller-main table tbody tr:hover {
        background: rgba(128, 64, 255, 0.06);
    }


/* =========================================================
   14. DASHBOARD STAT CARDS
   ========================================================= */

.dashboard-card,
.stat-card,
.summary-card {
    border-radius: 18px;
    border: 1px solid rgba(155, 91, 255, 0.18);
    background: linear-gradient( 145deg, rgba(28, 17, 52, 0.98), rgba(13, 8, 29, 0.98) );
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25);
}

    .dashboard-card:hover,
    .stat-card:hover,
    .summary-card:hover {
        border-color: rgba(160, 83, 255, 0.38);
    }


/* =========================================================
   15. FORM CONTROLS
   ========================================================= */

.seller-main input,
.seller-main select,
.seller-main textarea {
    width: 100%;
    color: #ffffff;
    background: #120a22;
    border: 1px solid rgba(151, 92, 255, 0.22);
    border-radius: 10px;
    padding: 11px 13px;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

    .seller-main input:focus,
    .seller-main select:focus,
    .seller-main textarea:focus {
        border-color: #914cff;
        box-shadow: 0 0 0 3px rgba(145, 76, 255, 0.12);
    }


/* =========================================================
   16. PAGINATION
   ========================================================= */

.seller-main .pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

    .seller-main .pagination .page-link {
        color: #d9caff;
        background: #170d2c;
        border: 1px solid rgba(148, 82, 255, 0.22);
        border-radius: 8px;
    }

    .seller-main .pagination .page-item.active .page-link {
        color: #ffffff;
        background: linear-gradient( 135deg, #8b35ff, #6420d8 );
        border-color: #8b35ff;
    }


/* =========================================================
   17. SIDEBAR
   ========================================================= */

.seller-sidebar {
    background: linear-gradient( 180deg, #0d061c 0%, #080411 100% );
    border-right: 1px solid rgba(154, 87, 255, 0.16);
}

.seller-logo {
    color: #ffffff;
    font-weight: 800;
}

.seller-menu a {
    transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

    .seller-menu a:hover {
        background: rgba(135, 65, 255, 0.10);
        color: #ffffff;
    }

    .seller-menu a.active {
        color: #ffffff;
        background: linear-gradient( 135deg, rgba(126, 54, 255, 0.28), rgba(93, 36, 170, 0.18) );
        border-color: rgba(153, 87, 255, 0.45);
        box-shadow: 0 0 20px rgba(128, 55, 255, 0.10);
    }


/* =========================================================
   18. LINKS
   ========================================================= */

.seller-main a {
    color: #a970ff;
}

    .seller-main a:hover {
        color: #c39aff;
    }


/* =========================================================
   19. EMPTY / ALERT BOX
   ========================================================= */

.seller-main .alert,
.empty-state,
.no-data {
    border-radius: 14px;
    border: 1px solid rgba(151, 92, 255, 0.18);
    background: rgba(26, 15, 45, 0.85);
    color: #cfc6df;
}


/* =========================================================
   20. IMPORTANT - NEVER CUT CARD CONTENT
   ========================================================= */

.vps-product-card *,
.linux-product-card *,
.linux-plan-card *,
.product-card * {
    max-height: none;
}

.vps-product-card,
.linux-product-card,
.linux-plan-card,
.product-card {
    contain: none;
}

    .vps-product-card p,
    .linux-product-card p,
    .linux-plan-card p,
    .product-card p {
        white-space: normal;
        overflow: visible;
    }


/* =========================================================
   21. RESPONSIVE - TABLET
   ========================================================= */

@media (max-width: 1200px) {

    .seller-main {
        padding: 22px;
    }

    .seller-page-header h1,
    .seller-page-header h2 {
        font-size: 27px;
    }
}


/* =========================================================
   22. RESPONSIVE - MOBILE
   ========================================================= */

@media (max-width: 768px) {

    .seller-main {
        padding: 15px !important;
    }

    .seller-page-header,
    .dashboard-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

        .seller-page-header h1,
        .seller-page-header h2,
        .dashboard-header h1,
        .dashboard-header h2 {
            font-size: 24px;
        }

    .vps-product-card,
    .linux-product-card,
    .linux-plan-card,
    .product-card {
        border-radius: 15px;
    }

        .vps-product-card .card-header,
        .linux-product-card .card-header,
        .linux-plan-card .card-header {
            padding: 16px;
        }

        .vps-product-card .card-body,
        .linux-product-card .card-body,
        .linux-plan-card .card-body {
            padding: 16px;
        }

    .server-configuration li,
    .server-config li,
    .linux-configuration li,
    .vps-configuration li {
        font-size: 12px;
    }

    .price-section .price,
    .product-price .price,
    .vps-price .price {
        font-size: 24px;
    }

    .seller-main table {
        min-width: 800px;
    }
}


/* =========================================================
   23. SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

    .seller-main {
        padding: 12px !important;
    }

    .seller-page-header h1,
    .seller-page-header h2,
    .dashboard-header h1,
    .dashboard-header h2 {
        font-size: 21px;
    }

    .vps-product-card .card-header,
    .linux-product-card .card-header,
    .linux-plan-card .card-header,
    .vps-product-card .card-body,
    .linux-product-card .card-body,
    .linux-plan-card .card-body {
        padding: 14px;
    }

    .server-configuration li,
    .server-config li,
    .linux-configuration li,
    .vps-configuration li {
        font-size: 11px;
    }
}

/* =========================================================
   24. FINAL SELLER PANEL OVERRIDES
   Purpose:
   - Keep all existing functionality untouched
   - Improve readability/contrast
   - Prevent clipped product content
   - Keep VPS/Linux/Proxy/IP/Order pages visually consistent
   ========================================================= */

.seller-main {
    color: #f5f1ff;
}

    .seller-main .text-muted,
    .seller-main .text-secondary {
        color: #a9a0bd !important;
    }

    .seller-main h1,
    .seller-main h2,
    .seller-main h3,
    .seller-main h4,
    .seller-main h5,
    .seller-main h6 {
        color: #ffffff;
    }

/* Product grids */
.vps-products-row,
.linux-products-row,
.product-grid {
    align-items: stretch;
}

    .vps-products-row > [class*="col-"],
    .linux-products-row > [class*="col-"],
    .product-grid > [class*="col-"] {
        display: flex;
    }

    .vps-products-row .vps-product-card,
    .linux-products-row .linux-product-card,
    .product-grid .product-card {
        width: 100%;
    }

/* VPS header */
.vps-product-card .vps-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 86px;
    padding: 17px 18px;
    background: linear-gradient(135deg, #4b1d96 0%, #7028d9 52%, #3a176f 100%);
}

.vps-product-card .vps-card-title-area {
    min-width: 0;
}

.vps-product-card .vps-plan-name {
    color: #ffffff !important;
    font-size: 16px;
    font-weight: 800;
    line-height: 1.25;
    margin: 0;
    word-break: break-word;
}

.vps-product-card .vps-plan-type {
    margin-top: 5px;
    color: rgba(255,255,255,.72) !important;
    font-size: 11px;
    font-weight: 600;
}

.vps-product-card .vps-server-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.16);
    font-size: 21px;
}

/* VPS body and configuration */
.vps-product-card .vps-card-body {
    padding: 18px;
}

.vps-product-card .vps-config-list {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

    .vps-product-card .vps-config-list li {
        color: #d2c9e1 !important;
        line-height: 1.55;
    }

        .vps-product-card .vps-config-list li strong {
            color: #ffffff !important;
        }

/* Linux cards */
.linux-product-card .card-header,
.linux-plan-card .card-header {
    color: #ffffff !important;
}

    .linux-product-card .card-header *,
    .linux-plan-card .card-header * {
        color: inherit;
    }

.linux-product-card .card-body,
.linux-plan-card .card-body {
    color: #d0c7df;
}

    .linux-product-card .card-body p,
    .linux-plan-card .card-body p {
        color: #bdb3ce !important;
    }

    .linux-product-card .card-body strong,
    .linux-plan-card .card-body strong {
        color: #ffffff !important;
    }

/* Never clip product content */
.vps-product-card .card-body,
.vps-product-card .product-body,
.linux-product-card .card-body,
.linux-plan-card .card-body,
.product-card .card-body {
    overflow: visible !important;
}

    .vps-product-card .card-body *,
    .linux-product-card .card-body *,
    .linux-plan-card .card-body *,
    .product-card .card-body {
        text-overflow: clip;
    }

.vps-product-card .description,
.linux-product-card .description,
.linux-plan-card .description,
.product-card .description {
    color: #c9c0d8 !important;
    line-height: 1.55;
    white-space: normal !important;
}

/* Price */
.vps-product-card .price,
.vps-product-card .vps-price .price,
.linux-product-card .price,
.linux-plan-card .price,
.product-card .price {
    color: #ffffff !important;
}

    .vps-product-card .price small,
    .linux-product-card .price small,
    .linux-plan-card .price small,
    .product-card .price small {
        color: #a9a0b8 !important;
    }

/* Buttons */
.vps-product-card .btn,
.linux-product-card .btn,
.linux-plan-card .btn,
.product-card .btn {
    min-height: 40px;
    font-weight: 700;
}

.vps-product-card .btn-outline-primary,
.linux-product-card .btn-outline-primary,
.linux-plan-card .btn-outline-primary,
.product-card .btn-outline-primary {
    color: #c8a9ff;
    border-color: rgba(159,92,255,.45);
    background: rgba(126,54,255,.07);
}

    .vps-product-card .btn-outline-primary:hover,
    .linux-product-card .btn-outline-primary:hover,
    .linux-plan-card .btn-outline-primary:hover,
    .product-card .btn-outline-primary:hover {
        color: #ffffff;
        background: rgba(126,54,255,.20);
        border-color: #9a5cff;
    }

/* Tables / View pages */
.seller-main .table-responsive {
    background: rgba(12,7,25,.72);
    border: 1px solid rgba(157,92,255,.14);
}

.seller-main table th,
.seller-main table td {
    white-space: nowrap;
}

    .seller-main table td .btn {
        white-space: nowrap;
    }

.seller-main .table > :not(caption) > * > * {
    background: transparent;
}

/* Forms / payment / order */
.seller-main .form-control,
.seller-main .form-select {
    color: #ffffff !important;
    background-color: #120a22 !important;
}

    .seller-main .form-control::placeholder {
        color: #827893 !important;
    }

.seller-main .card-header h1,
.seller-main .card-header h2,
.seller-main .card-header h3,
.seller-main .card-header h4,
.seller-main .card-header h5,
.seller-main .card-header h6 {
    color: #ffffff !important;
}

/* Alerts */
.seller-main .alert {
    color: #d9d1e6;
}

    .seller-main .alert strong {
        color: #ffffff;
    }

/* Dashboard cards */
.dashboard-action-card,
.dashboard-kpi-card,
.dashboard-color-card,
.dashboard-success-card,
.dashboard-chart-card {
    color: #d8d0e5;
}

    .dashboard-action-card h1,
    .dashboard-action-card h2,
    .dashboard-action-card h3,
    .dashboard-action-card h4,
    .dashboard-action-card h5,
    .dashboard-action-card h6,
    .dashboard-kpi-card h1,
    .dashboard-kpi-card h2,
    .dashboard-kpi-card h3,
    .dashboard-kpi-card h4,
    .dashboard-kpi-card h5,
    .dashboard-kpi-card h6 {
        color: #ffffff;
    }

/* Modals */
.seller-main .modal-content {
    color: #d8d0e5;
    background: linear-gradient(145deg, #1b1032, #0d081c);
    border: 1px solid rgba(157,92,255,.25);
    border-radius: 16px;
    box-shadow: 0 25px 70px rgba(0,0,0,.55);
}

.seller-main .modal-title {
    color: #ffffff;
}

.seller-main .modal .btn-close {
    filter: invert(1) grayscale(1);
}

/* IP / Proxy / Stock sections */
.ip-panel,
.ip-stock-card,
.proxy-panel,
.proxy-stock-card,
.ip-script-panel,
.proxy-product-card {
    background: linear-gradient(145deg, rgba(24,13,48,.98), rgba(11,7,25,.98));
    border: 1px solid rgba(149,77,255,.24);
    border-radius: 16px;
    color: #d3cadf;
}

    .ip-panel h1,
    .ip-panel h2,
    .ip-panel h3,
    .ip-panel h4,
    .ip-panel h5,
    .proxy-panel h1,
    .proxy-panel h2,
    .proxy-panel h3,
    .proxy-panel h4,
    .proxy-panel h5,
    .ip-script-panel h1,
    .ip-script-panel h2,
    .ip-script-panel h3,
    .ip-script-panel h4,
    .ip-script-panel h5 {
        color: #ffffff;
    }

/* Order history */
.order-history-card,
.order-card,
.history-card {
    background: linear-gradient(145deg, rgba(27,16,50,.98), rgba(13,8,28,.98));
    border: 1px solid rgba(157,92,255,.18);
    border-radius: 16px;
}

    .order-history-card strong,
    .order-card strong,
    .history-card strong {
        color: #ffffff;
    }

/* Empty states */
.seller-empty,
.vps-empty,
.linux-empty-state,
.empty-state,
.no-data {
    color: #cfc6dc;
}

    .seller-empty h1,
    .seller-empty h2,
    .seller-empty h3,
    .seller-empty h4,
    .seller-empty h5 {
        color: #ffffff;
    }

/* Scrollbar */
.seller-main ::-webkit-scrollbar {
    width: 7px;
    height: 7px;
}

.seller-main ::-webkit-scrollbar-track {
    background: rgba(255,255,255,.03);
}

.seller-main ::-webkit-scrollbar-thumb {
    background: rgba(151,92,255,.45);
    border-radius: 20px;
}

    .seller-main ::-webkit-scrollbar-thumb:hover {
        background: rgba(151,92,255,.70);
    }

/* Responsive */
@media (max-width: 991px) {
    .vps-products-row > [class*="col-"],
    .linux-products-row > [class*="col-"],
    .product-grid > [class*="col-"] {
        display: block;
    }

    .seller-main table {
        min-width: 760px;
    }
}

@media (max-width: 768px) {
    .vps-product-card .vps-card-header {
        min-height: 78px;
        padding: 15px;
    }

    .vps-product-card .vps-card-body,
    .linux-product-card .card-body,
    .linux-plan-card .card-body {
        padding: 15px;
    }

    .vps-product-card .vps-plan-name {
        font-size: 15px;
    }

    .seller-main .btn {
        max-width: 100%;
    }
}

@media (max-width: 480px) {
    .vps-product-card .vps-server-icon {
        width: 36px;
        height: 36px;
        min-width: 36px;
        font-size: 18px;
    }

    .seller-main table {
        min-width: 680px;
    }
}

/* =========================================================
   25. FINAL PROFESSIONAL UI - VPS / LINUX / PROXY / HISTORY
   ========================================================= */

:root {
    --sp-bg: #08051a;
    --sp-bg-2: #100728;
    --sp-panel: rgba(19, 10, 42, .96);
    --sp-panel-2: rgba(29, 14, 58, .96);
    --sp-border: rgba(145, 76, 255, .30);
    --sp-border-soft: rgba(166, 104, 255, .18);
    --sp-purple: #7c2cff;
    --sp-purple-2: #a64dff;
    --sp-text: #f7f4ff;
    --sp-muted: #a99fbd;
}

/* ---------- GLOBAL SELLER AREA ---------- */
.seller-main {
    background: radial-gradient(circle at 18% 0%, rgba(107, 39, 255, .10), transparent 28%), radial-gradient(circle at 90% 10%, rgba(36, 90, 255, .07), transparent 24%), var(--sp-bg) !important;
    color: var(--sp-text) !important;
}

    .seller-main h1,
    .seller-main h2,
    .seller-main h3,
    .seller-main h4,
    .seller-main h5,
    .seller-main h6,
    .seller-main .fw-bold,
    .seller-main .fw-semibold {
        color: #ffffff !important;
    }

    .seller-main .text-muted,
    .seller-main small,
    .seller-main .small {
        color: #aaa2b9 !important;
    }

.seller-page-header,
.dashboard-header {
    position: relative;
    margin-bottom: 20px !important;
}

    .seller-page-header h1,
    .seller-page-header h2,
    .dashboard-header h1,
    .dashboard-header h2 {
        color: #ffffff !important;
        text-shadow: 0 2px 14px rgba(124, 44, 255, .18);
    }

    .seller-page-header p,
    .dashboard-header p {
        color: #a9a0b9 !important;
    }

.seller-section-badge {
    background: linear-gradient(135deg, rgba(124,44,255,.20), rgba(74,34,139,.18)) !important;
    color: #d9c2ff !important;
    border: 1px solid rgba(155,92,255,.38) !important;
    box-shadow: 0 0 18px rgba(124,44,255,.10);
}

/* ---------- DASHBOARD HEADINGS / ANALYTICS ---------- */
.dashboard-kpi-section,
.dashboard-analytics,
.dashboard-chart-section,
.dashboard-section {
    color: #ffffff !important;
}

.dashboard-kpi-card,
.dashboard-chart-card,
.dashboard-analytics-card,
.dashboard-stat-card {
    background: linear-gradient(145deg, rgba(28, 14, 60, .98), rgba(12, 7, 28, .98)) !important;
    border: 1px solid rgba(145, 76, 255, .25) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 38px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.025) !important;
}

.dashboard-kpi-title,
.dashboard-kpi-description,
.dashboard-analytics-title,
.dashboard-chart-title,
.dashboard-section-title {
    color: #ffffff !important;
}

.dashboard-kpi-description,
.dashboard-analytics-subtitle,
.dashboard-chart-subtitle {
    color: #aaa2b9 !important;
}

.dashboard-analytics h2,
.dashboard-analytics h3,
.dashboard-analytics h4,
.dashboard-analytics .fw-bold,
.dashboard-section h2,
.dashboard-section h3,
.dashboard-section h4 {
    color: #ffffff !important;
}

/* ---------- COMMON PRODUCT GRID ---------- */
.vps-products-row,
.linux-products-row,
.product-grid {
    row-gap: 18px !important;
}

    .vps-products-row > [class*="col-"],
    .linux-products-row > [class*="col-"],
    .product-grid > [class*="col-"] {
        display: flex;
        align-items: stretch;
    }

/* =========================================================
   VPS CARD - FULL PROFESSIONAL HEADER + BODY
   ========================================================= */
.vps-product-card {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    min-height: 520px !important;
    overflow: hidden !important;
    background: linear-gradient(145deg, rgba(27,13,57,.99), rgba(9,6,23,.99)) !important;
    border: 1px solid rgba(143,74,255,.34) !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.38), 0 0 0 1px rgba(255,255,255,.015) !important;
}

    .vps-product-card .vps-card-header {
        position: relative !important;
        min-height: 102px !important;
        padding: 20px 18px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 12px !important;
        background: linear-gradient(135deg, #3b167d 0%, #7429df 54%, #4b19a1 100%) !important;
        border-bottom: 1px solid rgba(255,255,255,.14) !important;
        border-radius: 17px 17px 0 0 !important;
    }

        .vps-product-card .vps-card-header::after {
            content: "";
            position: absolute;
            inset: auto 0 0 0;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,.32), transparent);
        }

.vps-plan-name {
    color: #ffffff !important;
    font-size: 17px !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
    letter-spacing: .1px;
}

.vps-plan-type {
    color: rgba(255,255,255,.72) !important;
    font-size: 11px !important;
    margin-top: 5px !important;
}

.vps-server-icon {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    background: rgba(255,255,255,.12) !important;
    border: 1px solid rgba(255,255,255,.24) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 8px 20px rgba(0,0,0,.14) !important;
}

.vps-product-card .vps-card-body {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    padding: 18px !important;
    background: linear-gradient(180deg, rgba(20,10,42,.96), rgba(11,7,25,.98)) !important;
    color: #ddd5ea !important;
}

    .vps-product-card .vps-card-body > * {
        max-width: 100% !important;
    }

    /* VPS detail area: NEVER collapse or clip */
    .vps-product-card .server-configuration,
    .vps-product-card .server-config,
    .vps-product-card .vps-configuration,
    .vps-product-card .vps-card-body .configuration {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }

        .vps-product-card .server-configuration li,
        .vps-product-card .server-config li,
        .vps-product-card .vps-configuration li {
            color: #cfc6dc !important;
            font-size: 12px !important;
            line-height: 1.45 !important;
            margin-bottom: 6px !important;
        }

            .vps-product-card .server-configuration li i,
            .vps-product-card .server-config li i,
            .vps-product-card .vps-configuration li i,
            .vps-product-card .config-check {
                color: #a24cff !important;
            }

.vps-product-card .vps-price,
.vps-product-card .product-price,
.vps-product-card .price-section {
    margin-top: auto !important;
    padding-top: 15px !important;
    border-top: 1px solid rgba(255,255,255,.10) !important;
}

    .vps-product-card .vps-price .price,
    .vps-product-card .product-price .price,
    .vps-product-card .price-section .price {
        color: #ffffff !important;
        font-size: 25px !important;
        font-weight: 850 !important;
    }

    .vps-product-card .vps-price small,
    .vps-product-card .product-price small,
    .vps-product-card .price-section small {
        color: #9c93aa !important;
    }

/* VPS stock */
.vps-product-card .stock,
.vps-product-card .stock-count,
.vps-product-card .available-stock {
    color: #ffffff !important;
}

/* VPS buttons */
.vps-product-card .btn,
.vps-product-card button {
    border-radius: 10px !important;
    min-height: 40px !important;
    font-weight: 750 !important;
}

.vps-product-card .btn-primary,
.vps-product-card .btn-success,
.vps-product-card .order-btn {
    background: linear-gradient(135deg, #7b2cff, #9b3dff) !important;
    border-color: transparent !important;
    color: #ffffff !important;
    box-shadow: 0 8px 20px rgba(124,44,255,.24) !important;
}

    .vps-product-card .btn-primary:hover,
    .vps-product-card .btn-success:hover,
    .vps-product-card .order-btn:hover {
        background: linear-gradient(135deg, #8a3cff, #aa50ff) !important;
        transform: translateY(-1px);
    }

/* =========================================================
   LINUX CARD - MATCH VPS CARD
   ========================================================= */
.linux-card-column {
    display: flex !important;
    padding-left: 7px !important;
    padding-right: 7px !important;
}

.linux-plan-card,
.linux-product-card {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 520px !important;
    overflow: hidden !important;
    background: linear-gradient(145deg, rgba(27,13,57,.99), rgba(9,6,23,.99)) !important;
    border: 1px solid rgba(143,74,255,.34) !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.38), 0 0 0 1px rgba(255,255,255,.015) !important;
}

    .linux-plan-header,
    .linux-product-card .card-header {
        min-height: 102px !important;
        padding: 17px 18px !important;
        display: flex !important;
        align-items: center !important;
        background: linear-gradient(135deg, #3b167d 0%, #7429df 54%, #4b19a1 100%) !important;
        color: #ffffff !important;
        border: 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.14) !important;
        border-radius: 17px 17px 0 0 !important;
    }

        .linux-plan-header h5,
        .linux-plan-header label,
        .linux-plan-header span,
        .linux-product-card .card-header h3,
        .linux-product-card .card-header h4 {
            color: #ffffff !important;
        }

.linux-plan-select-row {
    color: #ffffff !important;
}

.linux-plan-select-label {
    color: #ffffff !important;
    font-weight: 750 !important;
}

.linux-plan-body,
.linux-product-card .card-body {
    flex: 1 1 auto !important;
    padding: 18px !important;
    display: flex !important;
    flex-direction: column !important;
    background: linear-gradient(180deg, rgba(20,10,42,.96), rgba(11,7,25,.98)) !important;
    color: #d8d0e5 !important;
}

    .linux-config-title,
    .linux-plan-body .linux-config-title {
        color: #ffffff !important;
        font-weight: 800 !important;
    }

    .linux-config-box,
    .linux-plan-body .linux-config-box {
        background: rgba(255,255,255,.035) !important;
        border: 1px solid rgba(164,101,255,.20) !important;
        border-radius: 10px !important;
        color: #cfc6dc !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
    }

        .linux-config-box * {
            color: #cfc6dc !important;
        }

    .linux-plan-body .linux-price,
    .linux-plan-body .price,
    .linux-plan-body .linux-plan-price {
        color: #ffffff !important;
        font-weight: 850 !important;
    }

    .linux-plan-body .linux-price,
    .linux-plan-body .linux-plan-price {
        font-size: 25px !important;
    }

    .linux-plan-body .text-muted,
    .linux-plan-body small {
        color: #9d95aa !important;
    }

    .linux-plan-body .linux-action-row {
        margin-top: auto !important;
        padding-top: 14px !important;
    }

    .linux-action-row .btn,
    .linux-plan-body .btn {
        min-height: 40px !important;
        border-radius: 10px !important;
        font-weight: 750 !important;
    }

    .linux-action-row .btn-primary,
    .linux-action-row .btn-success,
    .linux-plan-body .btn-primary {
        background: linear-gradient(135deg, #7b2cff, #9b3dff) !important;
        border-color: transparent !important;
        color: #ffffff !important;
        box-shadow: 0 8px 20px rgba(124,44,255,.22) !important;
    }

    .linux-action-row .btn-outline-primary,
    .linux-plan-body .btn-outline-primary {
        background: rgba(124,44,255,.08) !important;
        color: #d9c4ff !important;
        border: 1px solid rgba(160,95,255,.45) !important;
    }

/* Stock badges inside Linux */
.linux-plan-card .badge,
.linux-product-card .badge {
    border-radius: 999px !important;
    font-weight: 800 !important;
    border: 1px solid rgba(255,255,255,.10) !important;
}

/* =========================================================
   BUY PROXY - MATCH THE VPS / LINUX DARK THEME
   ========================================================= */
.proxy-panel,
.proxy-products,
.buy-proxy-page {
    color: #ffffff !important;
}

.proxy-product-card,
.proxy-plan-card,
.buy-proxy-card,
.proxy-card {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-height: 520px !important;
    overflow: hidden !important;
    background: linear-gradient(145deg, rgba(27,13,57,.99), rgba(9,6,23,.99)) !important;
    border: 1px solid rgba(143,74,255,.34) !important;
    border-radius: 18px !important;
    color: #ffffff !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.38), 0 0 0 1px rgba(255,255,255,.015) !important;
}

    .proxy-product-card > .card-header,
    .proxy-plan-card > .card-header,
    .buy-proxy-card > .card-header,
    .proxy-card > .card-header,
    .proxy-product-card .proxy-card-header {
        min-height: 102px !important;
        padding: 20px 18px !important;
        display: flex !important;
        align-items: center !important;
        background: linear-gradient(135deg, #3b167d 0%, #7429df 54%, #4b19a1 100%) !important;
        color: #ffffff !important;
        border: 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.14) !important;
    }

        .proxy-product-card > .card-header *,
        .proxy-plan-card > .card-header *,
        .buy-proxy-card > .card-header *,
        .proxy-card > .card-header * {
            color: #ffffff !important;
        }

    .proxy-product-card > .card-body,
    .proxy-plan-card > .card-body,
    .buy-proxy-card > .card-body,
    .proxy-card > .card-body {
        flex: 1 1 auto !important;
        padding: 18px !important;
        background: linear-gradient(180deg, rgba(20,10,42,.96), rgba(11,7,25,.98)) !important;
        color: #d8d0e5 !important;
    }

    .proxy-product-card .text-muted,
    .proxy-plan-card .text-muted,
    .buy-proxy-card .text-muted,
    .proxy-card .text-muted,
    .proxy-product-card small,
    .proxy-plan-card small,
    .buy-proxy-card small,
    .proxy-card small {
        color: #9d95aa !important;
    }

    .proxy-product-card .price,
    .proxy-product-card .proxy-price,
    .proxy-plan-card .price,
    .proxy-plan-card .proxy-price,
    .buy-proxy-card .price,
    .buy-proxy-card .proxy-price,
    .proxy-card .price,
    .proxy-card .proxy-price {
        color: #ffffff !important;
        font-size: 25px !important;
        font-weight: 850 !important;
    }

    .proxy-product-card .stock,
    .proxy-product-card .proxy-stock,
    .proxy-plan-card .stock,
    .proxy-plan-card .proxy-stock {
        color: #ffffff !important;
    }

    .proxy-product-card .btn,
    .proxy-plan-card .btn,
    .buy-proxy-card .btn,
    .proxy-card .btn {
        min-height: 40px !important;
        border-radius: 10px !important;
        font-weight: 750 !important;
    }

    .proxy-product-card .btn-primary,
    .proxy-product-card .btn-success,
    .proxy-plan-card .btn-primary,
    .proxy-plan-card .btn-success,
    .buy-proxy-card .btn-primary,
    .buy-proxy-card .btn-success,
    .proxy-card .btn-primary,
    .proxy-card .btn-success {
        background: linear-gradient(135deg, #7b2cff, #9b3dff) !important;
        border-color: transparent !important;
        color: #ffffff !important;
        box-shadow: 0 8px 20px rgba(124,44,255,.24) !important;
    }

    .proxy-product-card .btn-outline-primary,
    .proxy-plan-card .btn-outline-primary,
    .buy-proxy-card .btn-outline-primary,
    .proxy-card .btn-outline-primary {
        color: #d9c4ff !important;
        background: rgba(124,44,255,.08) !important;
        border-color: rgba(160,95,255,.45) !important;
    }

/* =========================================================
   ORDER HISTORY - CARDS + LINUX COUNT FIX
   ========================================================= */
.seller-main .card.shadow-sm.border-0 {
    background: linear-gradient(145deg, rgba(25,12,53,.98), rgba(10,6,24,.98)) !important;
    border: 1px solid rgba(145,76,255,.24) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 36px rgba(0,0,0,.32) !important;
}

    /* KPI cards at top of Order History */
    .seller-main .card.shadow-sm.border-0 .card-body {
        background: transparent !important;
        color: #ffffff !important;
    }

        .seller-main .card.shadow-sm.border-0 .card-body .text-muted,
        .seller-main .card.shadow-sm.border-0 .card-body .small {
            color: #aaa2b9 !important;
        }

        .seller-main .card.shadow-sm.border-0 .card-body h3,
        .seller-main .card.shadow-sm.border-0 .card-body h3.text-dark,
        .seller-main .card.shadow-sm.border-0 .card-body h3.text-primary {
            color: #ffffff !important;
            text-shadow: 0 2px 12px rgba(124,44,255,.16);
        }

            /* Explicit Linux count correction */
            .seller-main .card.shadow-sm.border-0 .card-body h3.text-dark {
                color: #ffffff !important;
                opacity: 1 !important;
                visibility: visible !important;
            }

/* Order tables */
.seller-main .card-header.bg-primary {
    background: linear-gradient(135deg, #3b167d 0%, #7429df 54%, #4b19a1 100%) !important;
    border-bottom: 1px solid rgba(255,255,255,.12) !important;
}

    .seller-main .card-header.bg-primary h5,
    .seller-main .card-header.bg-primary * {
        color: #ffffff !important;
    }

.seller-main table thead th {
    background: rgba(52,24,91,.78) !important;
    color: #e9ddff !important;
    border-color: rgba(177,119,255,.20) !important;
}

.seller-main table tbody td {
    background: rgba(10,6,24,.42) !important;
    color: #d8d0e5 !important;
    border-color: rgba(177,119,255,.12) !important;
}

.seller-main table tbody tr:hover td {
    background: rgba(124,44,255,.07) !important;
}

/* =========================================================
   DASHBOARD QUICK CARDS - KEEP DARK PROFESSIONAL
   ========================================================= */
.dashboard-action-card {
    background: linear-gradient(145deg, rgba(28,14,60,.98), rgba(12,7,28,.98)) !important;
    color: #ffffff !important;
    border: 1px solid rgba(145,76,255,.24) !important;
}

    .dashboard-action-card:hover {
        color: #ffffff !important;
        border-color: rgba(160,95,255,.55) !important;
    }

    .dashboard-action-card h5,
    .dashboard-action-card h6,
    .dashboard-action-card strong,
    .dashboard-action-card .title {
        color: #ffffff !important;
    }

/* =========================================================
   GENERIC DARK CARDS / FORMS INSIDE SELLER
   ========================================================= */
.seller-main .form-control,
.seller-main .form-select,
.seller-main input,
.seller-main select,
.seller-main textarea {
    background: rgba(255,255,255,.045) !important;
    color: #ffffff !important;
    border-color: rgba(158,98,255,.28) !important;
}

    .seller-main .form-control::placeholder,
    .seller-main input::placeholder,
    .seller-main textarea::placeholder {
        color: #8f879c !important;
    }

    .seller-main .form-control:focus,
    .seller-main .form-select:focus,
    .seller-main input:focus,
    .seller-main select:focus,
    .seller-main textarea:focus {
        border-color: rgba(165,92,255,.70) !important;
        box-shadow: 0 0 0 .20rem rgba(124,44,255,.12) !important;
    }

/* Do not let Bootstrap utility text colors make important values invisible */
.seller-main .text-dark,
.seller-main .text-secondary,
.seller-main .text-body,
.seller-main .text-black {
    color: #ffffff !important;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1199px) {
    .vps-product-card,
    .linux-plan-card,
    .linux-product-card,
    .proxy-product-card,
    .proxy-plan-card,
    .buy-proxy-card,
    .proxy-card {
        min-height: 500px !important;
    }
}

@media (max-width: 991px) {
    .linux-card-column {
        width: 50% !important;
    }
}

@media (max-width: 768px) {
    .vps-product-card,
    .linux-plan-card,
    .linux-product-card,
    .proxy-product-card,
    .proxy-plan-card,
    .buy-proxy-card,
    .proxy-card {
        min-height: 0 !important;
    }

        .vps-product-card .vps-card-header,
        .linux-plan-header,
        .linux-product-card .card-header,
        .proxy-product-card > .card-header,
        .proxy-plan-card > .card-header,
        .buy-proxy-card > .card-header,
        .proxy-card > .card-header {
            min-height: 88px !important;
            padding: 15px !important;
        }

        .vps-product-card .vps-card-body,
        .linux-plan-body,
        .linux-product-card .card-body,
        .proxy-product-card > .card-body,
        .proxy-plan-card > .card-body,
        .buy-proxy-card > .card-body,
        .proxy-card > .card-body {
            padding: 15px !important;
        }
}

@media (max-width: 575px) {
    .linux-card-column {
        width: 100% !important;
    }

    .vps-plan-name {
        font-size: 15px !important;
    }
}

/* =========================================================
   25. FINAL VISIBILITY FIXES - SELLER PANEL
   ========================================================= */

/* ---------------------------------------------------------
   GLOBAL SELLER CARD HEADER
   Fixes white/blank headers such as View VPS / View Linux
   --------------------------------------------------------- */
.seller-main .card > .card-header,
.seller-main .seller-card > .card-header,
.seller-main .panel > .card-header,
.seller-main .box > .card-header {
    background: linear-gradient(135deg, #32105f 0%, #5d20ad 52%, #3d147d 100%) !important;
    color: #ffffff !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 16px 16px 0 0 !important;
}

    .seller-main .card > .card-header h1,
    .seller-main .card > .card-header h2,
    .seller-main .card > .card-header h3,
    .seller-main .card > .card-header h4,
    .seller-main .card > .card-header h5,
    .seller-main .card > .card-header h6,
    .seller-main .card > .card-header p,
    .seller-main .card > .card-header span,
    .seller-main .card > .card-header strong,
    .seller-main .card > .card-header label,
    .seller-main .seller-card > .card-header *,
    .seller-main .panel > .card-header *,
    .seller-main .box > .card-header * {
        color: #ffffff !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

/* ---------------------------------------------------------
   VIEW VPS / VIEW LINUX LIST HEADER
   Makes "VPS Server List" and "Linux Server List"
   permanently visible without text selection.
   --------------------------------------------------------- */
.seller-main .table-responsive {
    background: linear-gradient(145deg, rgba(24,12,49,.98), rgba(10,6,24,.98)) !important;
    border-radius: 0 0 16px 16px !important;
}

    .seller-main .table-responsive + * {
        color: #ffffff !important;
    }

/* Any heading placed immediately inside a list/table card */
.seller-main .card > .card-header + .table-responsive,
.seller-main .card > .card-header + .table-responsive table {
    color: #ffffff !important;
}

/* ---------------------------------------------------------
   ALL SELLER TABLE HEADINGS / CELLS
   --------------------------------------------------------- */
.seller-main .table,
.seller-main .table thead,
.seller-main .table tbody,
.seller-main .table tr,
.seller-main .table th,
.seller-main .table td {
    color: #eee8f8 !important;
}

    .seller-main .table thead th,
    .seller-main .table-light th,
    .seller-main .table-light > th {
        background: linear-gradient(135deg, #32105f, #4f1a91) !important;
        color: #ffffff !important;
        font-weight: 750 !important;
        border-color: rgba(177,119,255,.22) !important;
        opacity: 1 !important;
    }

    .seller-main .table tbody td,
    .seller-main .table tbody th {
        background: rgba(18,10,36,.72) !important;
        color: #e8e1f1 !important;
        border-color: rgba(177,119,255,.12) !important;
    }

        .seller-main .table tbody td strong,
        .seller-main .table tbody td span,
        .seller-main .table tbody td a {
            color: inherit !important;
        }

        .seller-main .table tbody td .text-muted {
            color: #a9a0b8 !important;
        }

        .seller-main .table tbody td .text-primary,
        .seller-main .table tbody td .text-info,
        .seller-main .table tbody td .text-success {
            color: #c59bff !important;
        }

/* ---------------------------------------------------------
   GENERIC SELLER CARD BODY
   Fixes Buy Proxy / other cards where Bootstrap text-dark
   becomes almost invisible on the dark professional theme.
   --------------------------------------------------------- */
.seller-main .card > .card-body,
.seller-main .seller-card > .card-body,
.seller-main .panel > .card-body,
.seller-main .box > .card-body {
    background: linear-gradient(180deg, rgba(20,10,42,.97), rgba(10,6,24,.99)) !important;
    color: #e3dced !important;
    border-radius: 0 0 16px 16px !important;
}

    .seller-main .card > .card-body h1,
    .seller-main .card > .card-body h2,
    .seller-main .card > .card-body h3,
    .seller-main .card > .card-body h4,
    .seller-main .card > .card-body h5,
    .seller-main .card > .card-body h6,
    .seller-main .card > .card-body strong,
    .seller-main .card > .card-body label {
        color: #ffffff !important;
        opacity: 1 !important;
    }

    .seller-main .card > .card-body p,
    .seller-main .card > .card-body div,
    .seller-main .card > .card-body li,
    .seller-main .card > .card-body span {
        opacity: 1;
    }

    .seller-main .card > .card-body .text-muted,
    .seller-main .card > .card-body small {
        color: #b2a8bf !important;
    }

    .seller-main .card > .card-body .text-dark,
    .seller-main .card > .card-body .text-secondary,
    .seller-main .card > .card-body .text-body,
    .seller-main .card > .card-body .text-black {
        color: #e8e1f1 !important;
    }

/* ---------------------------------------------------------
   BUY PROXY - FORCE PLAN DETAILS TO BE READABLE
   --------------------------------------------------------- */
.proxy-product-card,
.proxy-plan-card,
.buy-proxy-card,
.proxy-card,
.linux-proxy-card {
    color: #e7dfef !important;
}

    .proxy-product-card .card-body *,
    .proxy-plan-card .card-body *,
    .buy-proxy-card .card-body *,
    .proxy-card .card-body *,
    .linux-proxy-card .card-body * {
        opacity: 1 !important;
    }

    .proxy-product-card .card-body .text-dark,
    .proxy-product-card .card-body .text-secondary,
    .proxy-product-card .card-body .text-body,
    .proxy-plan-card .card-body .text-dark,
    .proxy-plan-card .card-body .text-secondary,
    .proxy-plan-card .card-body .text-body,
    .buy-proxy-card .card-body .text-dark,
    .buy-proxy-card .card-body .text-secondary,
    .buy-proxy-card .card-body .text-body,
    .proxy-card .card-body .text-dark,
    .proxy-card .card-body .text-secondary,
    .proxy-card .card-body .text-body,
    .linux-proxy-card .card-body .text-dark,
    .linux-proxy-card .card-body .text-secondary,
    .linux-proxy-card .card-body .text-body {
        color: #e8e1f1 !important;
    }

    .proxy-product-card .description,
    .proxy-product-card .proxy-description,
    .proxy-plan-card .description,
    .proxy-plan-card .proxy-description,
    .buy-proxy-card .description,
    .buy-proxy-card .proxy-description,
    .proxy-card .description,
    .proxy-card .proxy-description,
    .linux-proxy-card .description {
        color: #d8d0e5 !important;
        line-height: 1.55 !important;
        white-space: normal !important;
        overflow: visible !important;
    }

/* ---------------------------------------------------------
   LINUX CONFIGURATION - EVERY DETAIL VISIBLE
   --------------------------------------------------------- */
.linux-plan-card .linux-config-box,
.linux-plan-card .linux-config-box *,
.linux-plan-card .linux-configuration,
.linux-plan-card .linux-configuration *,
.linux-product-card .linux-config-box,
.linux-product-card .linux-config-box * {
    color: #ddd5e8 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.linux-plan-card .linux-config-box,
.linux-product-card .linux-config-box {
    min-height: 95px !important;
    max-height: none !important;
    overflow: visible !important;
}

    .linux-plan-card .linux-config-box li,
    .linux-plan-card .linux-config-box p,
    .linux-product-card .linux-config-box li,
    .linux-product-card .linux-config-box p {
        color: #ddd5e8 !important;
        line-height: 1.55 !important;
        white-space: normal !important;
        overflow: visible !important;
    }

/* ---------------------------------------------------------
   LINUX CART COUNT / TOP CART BADGE
   --------------------------------------------------------- */
.linux-cart-btn,
.linux-cart-btn *,
.linux-cart-count,
.cart-count,
.cart-badge,
.cart-count-badge,
.seller-cart-count {
    color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.linux-cart-count,
.cart-count,
.cart-badge,
.cart-count-badge,
.seller-cart-count {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 24px !important;
    height: 24px !important;
    padding: 0 7px !important;
    margin-left: 5px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #7b2cff, #9b3dff) !important;
    border: 1px solid rgba(255,255,255,.25) !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    box-shadow: 0 5px 14px rgba(124,44,255,.28) !important;
}

/* Cart button itself */
.linux-cart-btn,
.seller-cart-btn,
.cart-btn {
    color: #ffffff !important;
    background: rgba(124,44,255,.10) !important;
    border: 1px solid rgba(160,95,255,.50) !important;
}

/* ---------------------------------------------------------
   QUANTITY CONTROL - CLEAN PROFESSIONAL LOOK
   --------------------------------------------------------- */
.linux-quantity-control,
.linux-quantity-box,
.linux-quantity-wrapper {
    background: rgba(255,255,255,.045) !important;
    border: 1px solid rgba(158,98,255,.35) !important;
    border-radius: 10px !important;
    overflow: hidden !important;
}

    .linux-quantity-input,
    .linux-quantity-control input,
    .linux-quantity-box input,
    .linux-quantity-wrapper input {
        background: rgba(255,255,255,.04) !important;
        color: #ffffff !important;
        border-color: transparent !important;
    }

    .linux-quantity-btn,
    .linux-quantity-control button,
    .linux-quantity-box button,
    .linux-quantity-wrapper button {
        color: #ffffff !important;
        background: rgba(124,44,255,.18) !important;
        border-color: rgba(158,98,255,.22) !important;
    }

        .linux-quantity-btn:hover,
        .linux-quantity-control button:hover,
        .linux-quantity-box button:hover,
        .linux-quantity-wrapper button:hover {
            background: rgba(124,44,255,.35) !important;
        }

/* ---------------------------------------------------------
   PREVENT SELECT/HIGHLIGHT FROM BEING NEEDED TO SEE TITLES
   --------------------------------------------------------- */
.seller-main .card-header,
.seller-main .card-header * {
    -webkit-text-fill-color: currentColor;
}

    .seller-main .card-header h1,
    .seller-main .card-header h2,
    .seller-main .card-header h3,
    .seller-main .card-header h4,
    .seller-main .card-header h5,
    .seller-main .card-header h6 {
        color: #ffffff !important;
        text-shadow: 0 1px 8px rgba(0,0,0,.25) !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

/* =========================================================
   END FINAL VISIBILITY FIXES
   ========================================================= */

/* =========================================================
   25. FINAL SCREENSHOT FIXES - SELLER PANEL
   ========================================================= */

/* ---------------------------------------------------------
   LINUX SERVER CARD - AVAILABLE STOCK
   --------------------------------------------------------- */
.linux-plan-card .linux-plan-stock,
.linux-plan-card .linux-plan-stock strong {
    display: block !important;
    color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
}

.linux-plan-card .linux-plan-stock {
    margin-top: 8px !important;
    margin-bottom: 10px !important;
    padding: 5px 0 !important;
}

    .linux-plan-card .linux-plan-stock::first-line {
        color: #ffffff !important;
    }

/* Make the actual stock number clearly visible */
.linux-plan-card .linux-plan-stock {
    text-shadow: 0 1px 4px rgba(0,0,0,.45) !important;
}

/* ---------------------------------------------------------
   VIEW VPS / VIEW LINUX - WHITE LIST HEADER
   The list title sits inside a white Bootstrap card header.
   Force heading/text to dark readable color.
   --------------------------------------------------------- */
.seller-main .card-header.bg-white h1,
.seller-main .card-header.bg-white h2,
.seller-main .card-header.bg-white h3,
.seller-main .card-header.bg-white h4,
.seller-main .card-header.bg-white h5,
.seller-main .card-header.bg-white h6,
.seller-main .card-header.bg-light h1,
.seller-main .card-header.bg-light h2,
.seller-main .card-header.bg-light h3,
.seller-main .card-header.bg-light h4,
.seller-main .card-header.bg-light h5,
.seller-main .card-header.bg-light h6 {
    color: #24113f !important;
    -webkit-text-fill-color: #24113f !important;
    text-shadow: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.seller-main .card-header.bg-white,
.seller-main .card-header.bg-light {
    color: #24113f !important;
}

    .seller-main .card-header.bg-white .text-muted,
    .seller-main .card-header.bg-light .text-muted,
    .seller-main .card-header.bg-white small,
    .seller-main .card-header.bg-light small,
    .seller-main .card-header.bg-white p,
    .seller-main .card-header.bg-light p {
        color: #596273 !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

/* ---------------------------------------------------------
   VIEW VPS / VIEW LINUX - LIST TITLE EVEN IF HEADER IS PLAIN
   --------------------------------------------------------- */
.seller-main .table-responsive + .seller-list-title,
.seller-main .seller-list-title,
.seller-main .server-list-title,
.seller-main .vps-server-list-title,
.seller-main .linux-server-list-title {
    color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* ---------------------------------------------------------
   BUY PROXY - PRICE + MONTHLY/BILLING MUST BE WHITE
   --------------------------------------------------------- */
.proxy-plan-card .proxy-price,
.proxy-plan-card .proxy-price-value,
.proxy-plan-card .proxy-price-cycle,
.proxy-product-card .proxy-price,
.proxy-product-card .proxy-price-value,
.proxy-product-card .proxy-price-cycle,
.buy-proxy-card .proxy-price,
.buy-proxy-card .proxy-price-value,
.buy-proxy-card .proxy-price-cycle,
.proxy-card .proxy-price,
.proxy-card .proxy-price-value,
.proxy-card .proxy-price-cycle {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.proxy-plan-card .proxy-price,
.proxy-product-card .proxy-price,
.buy-proxy-card .proxy-price,
.proxy-card .proxy-price {
    display: flex !important;
    align-items: baseline !important;
    gap: 6px !important;
    min-height: 34px !important;
    overflow: visible !important;
}

.proxy-plan-card .proxy-price-value,
.proxy-product-card .proxy-price-value,
.buy-proxy-card .proxy-price-value,
.proxy-card .proxy-price-value {
    color: #ffffff !important;
    font-size: 21px !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
    text-shadow: 0 1px 6px rgba(0,0,0,.45) !important;
}

.proxy-plan-card .proxy-price-cycle,
.proxy-product-card .proxy-price-cycle,
.buy-proxy-card .proxy-price-cycle,
.proxy-card .proxy-price-cycle {
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

/* ---------------------------------------------------------
   BUY PROXY - DESCRIPTION / STOCK / BILLING ALSO READABLE
   --------------------------------------------------------- */
.proxy-plan-card .proxy-detail-label,
.proxy-plan-card .proxy-detail-value,
.proxy-product-card .proxy-detail-label,
.proxy-product-card .proxy-detail-value,
.buy-proxy-card .proxy-detail-label,
.buy-proxy-card .proxy-detail-value,
.proxy-card .proxy-detail-label,
.proxy-card .proxy-detail-value {
    opacity: 1 !important;
    visibility: visible !important;
}

.proxy-plan-card .proxy-detail-label,
.proxy-product-card .proxy-detail-label,
.buy-proxy-card .proxy-detail-label,
.proxy-card .proxy-detail-label {
    color: #687184 !important;
}

.proxy-plan-card .proxy-detail-value,
.proxy-product-card .proxy-detail-value,
.buy-proxy-card .proxy-detail-value,
.proxy-card .proxy-detail-value {
    color: #172033 !important;
    font-weight: 800 !important;
}

.proxy-plan-card .proxy-description,
.proxy-product-card .proxy-description,
.buy-proxy-card .proxy-description,
.proxy-card .proxy-description {
    color: #e8e1f1 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* =========================================================
   END SCREENSHOT FIXES
   ========================================================= */


/* =========================================================
   26. VIEW LINUX / VIEW VPS - EXACT LIST HEADER FIX
   ========================================================= */

/* These two partial views use their own custom header classes,
   not Bootstrap .card-header. Force the title to be visible. */
.view-linux-card .view-linux-card-header,
.view-vps-card .view-vps-card-header {
    background: #ffffff !important;
    color: #24113f !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    overflow: visible !important;
}

.view-linux-card .view-linux-card-header-inner,
.view-vps-card .view-vps-card-header-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    min-height: 52px !important;
    overflow: visible !important;
}

.view-linux-card .view-linux-card-title,
.view-vps-card .view-vps-card-title {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #24113f !important;
    -webkit-text-fill-color: #24113f !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-shadow: none !important;
    white-space: nowrap !important;
    overflow: visible !important;
}

.view-linux-card .view-linux-card-header *,
.view-vps-card .view-vps-card-header * {
    visibility: visible !important;
    opacity: 1 !important;
}

/* Keep the ACTIVE badge visible on the right. */
.view-linux-card .view-linux-card-header .badge,
.view-vps-card .view-vps-card-header .badge {
    display: inline-flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
}

@media (max-width: 767px) {
    .view-linux-card .view-linux-card-title,
    .view-vps-card .view-vps-card-title {
        font-size: 15px !important;
    }
}

/* =========================================================
   27. MANAGE VPS - PROFESSIONAL LIVE SYSTEM THEME
   Matches the Seller Panel dark/purple professional design.
   UI ONLY: no JavaScript/functionality is changed.
   ========================================================= */

/* Main page */
.seller-main .manage-vps-page,
.manage-vps-page {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 0 30px !important;
    color: #f7f4ff !important;
}

    /* Professional page heading generated without changing Razor markup */
    .manage-vps-page::before {
        content: "Manage VPS" !important;
        display: block !important;
        margin: 0 0 2px !important;
        font-size: clamp(25px, 2vw, 34px) !important;
        line-height: 1.15 !important;
        font-weight: 800 !important;
        letter-spacing: -.4px !important;
        color: #ffffff !important;
        text-shadow: 0 4px 18px rgba(125, 48, 255, .18) !important;
    }

    /* Add the professional subtitle below the generated heading */
    .manage-vps-page::after {
        content: "Manage and view your VPS server details." !important;
        display: block !important;
        margin: 0 0 22px !important;
        color: #aaa2bd !important;
        font-size: 13px !important;
        font-weight: 500 !important;
    }

    /* Refresh bar becomes a clean top-right control area */
    .manage-vps-page .vps-top-bar {
        min-height: 0 !important;
        padding: 0 !important;
        margin: -55px 0 18px !important;
        border: 0 !important;
        justify-content: flex-end !important;
        position: relative !important;
        z-index: 3 !important;
    }

    .manage-vps-page .vps-refresh-btn {
        min-height: 40px !important;
        padding: 10px 16px !important;
        border: 1px solid rgba(139, 92, 246, .55) !important;
        border-radius: 12px !important;
        background: linear-gradient(135deg, #6d28d9, #8b5cf6) !important;
        color: #fff !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        box-shadow: 0 10px 24px rgba(109, 40, 217, .22) !important;
    }

        .manage-vps-page .vps-refresh-btn:hover {
            background: linear-gradient(135deg, #7c3aed, #a855f7) !important;
            transform: translateY(-1px) !important;
        }

    /* Status area */
    .manage-vps-page .vps-status-row {
        min-height: 58px !important;
        margin: 0 0 18px !important;
        padding: 0 4px !important;
        border: 1px solid rgba(139, 92, 246, .18) !important;
        border-radius: 16px !important;
        background: linear-gradient(145deg, rgba(27, 17, 51, .92), rgba(16, 10, 32, .94)) !important;
        box-shadow: 0 14px 32px rgba(0,0,0,.18) !important;
    }

    .manage-vps-page .vps-setup-title {
        color: #ffffff !important;
        font-size: 15px !important;
        font-weight: 800 !important;
        letter-spacing: .1px !important;
    }

    .manage-vps-page .vps-status-right {
        right: 14px !important;
        gap: 8px !important;
    }

    .manage-vps-page .vps-status-badge {
        min-width: 82px !important;
        height: 34px !important;
        padding: 0 13px !important;
        border-radius: 999px !important;
        font-size: 11px !important;
        font-weight: 800 !important;
        letter-spacing: .3px !important;
    }

    .manage-vps-page .vps-status-active {
        color: #39d98a !important;
        background: rgba(30, 185, 112, .10) !important;
        border: 1px solid rgba(57, 217, 138, .42) !important;
    }

    .manage-vps-page .vps-status-online {
        color: #ffffff !important;
        background: linear-gradient(135deg, #0ea982, #19c39a) !important;
        border: 1px solid rgba(71, 236, 193, .45) !important;
        box-shadow: 0 5px 15px rgba(14,169,130,.22) !important;
    }

    /* Summary cards - all details readable */
    .manage-vps-page .vps-summary-row {
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 18px !important;
    }

    .manage-vps-page .vps-summary-card {
        min-height: 104px !important;
        height: auto !important;
        padding: 20px 21px !important;
        border: 1px solid rgba(139, 92, 246, .20) !important;
        border-radius: 16px !important;
        background: linear-gradient(145deg, rgba(30, 19, 54, .98), rgba(17, 11, 34, .98)) !important;
        box-shadow: 0 14px 30px rgba(0,0,0,.18) !important;
        position: relative !important;
        overflow: hidden !important;
    }

        .manage-vps-page .vps-summary-card::before {
            content: "" !important;
            position: absolute !important;
            left: 0 !important;
            top: 14px !important;
            bottom: 14px !important;
            width: 3px !important;
            border-radius: 0 4px 4px 0 !important;
            background: linear-gradient(180deg, #8b5cf6, #22d3ee) !important;
        }

    .manage-vps-page .vps-summary-title {
        color: #aaa1bd !important;
        font-size: 11px !important;
        font-weight: 800 !important;
        letter-spacing: .65px !important;
        text-transform: uppercase !important;
        margin-bottom: 8px !important;
    }

    .manage-vps-page .vps-summary-icon {
        color: #8b7cff !important;
        font-size: 13px !important;
    }

    .manage-vps-page .vps-summary-value,
    .manage-vps-page .vps-ip-value {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        font-size: 16px !important;
        line-height: 1.35 !important;
        font-weight: 800 !important;
        word-break: break-word !important;
        overflow-wrap: anywhere !important;
    }

        .manage-vps-page .vps-summary-value .text-muted,
        .manage-vps-page .vps-ip-value .text-muted {
            color: #8f879f !important;
        }

    /* Login + OS cards */
    .manage-vps-page > .row:not(.vps-summary-row) {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .manage-vps-page .vps-main-card {
        height: 100% !important;
        border: 1px solid rgba(139, 92, 246, .20) !important;
        border-radius: 18px !important;
        background: linear-gradient(145deg, rgba(28, 18, 52, .98), rgba(15, 9, 30, .98)) !important;
        box-shadow: 0 18px 38px rgba(0,0,0,.22) !important;
        overflow: hidden !important;
    }

    .manage-vps-page .vps-main-card-header {
        min-height: 58px !important;
        padding: 17px 20px !important;
        text-align: left !important;
        border-bottom: 1px solid rgba(255,255,255,.08) !important;
        background: linear-gradient(135deg, rgba(73, 28, 130, .90), rgba(40, 17, 79, .92)) !important;
    }

        .manage-vps-page .vps-main-card-header h5 {
            margin: 0 !important;
            color: #ffffff !important;
            font-size: 13px !important;
            font-weight: 800 !important;
            letter-spacing: .55px !important;
        }

    .manage-vps-page .vps-main-card-body {
        padding: 22px !important;
        background: transparent !important;
    }

    /* Credential fields */
    .manage-vps-page .login-field {
        margin-bottom: 16px !important;
    }

    .manage-vps-page .login-label,
    .manage-vps-page .os-label {
        color: #b9b0c9 !important;
        font-size: 11px !important;
        font-weight: 700 !important;
        margin-bottom: 7px !important;
    }

    .manage-vps-page .login-value {
        min-height: 46px !important;
        padding: 11px 13px !important;
        border: 1px solid rgba(139, 92, 246, .22) !important;
        border-radius: 11px !important;
        background: rgba(12, 8, 25, .74) !important;
        color: #ffffff !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
    }

        .manage-vps-page .login-value > span:first-child,
        .manage-vps-page .login-value #vpsUsername,
        .manage-vps-page .login-value #vpsPassword {
            color: #ffffff !important;
            -webkit-text-fill-color: #ffffff !important;
        }

    .manage-vps-page .login-icon-btn,
    .manage-vps-page .login-copy-btn {
        color: #cfc6dc !important;
        border-radius: 8px !important;
        padding: 6px 8px !important;
        transition: .15s ease !important;
    }

        .manage-vps-page .login-icon-btn:hover,
        .manage-vps-page .login-copy-btn:hover {
            color: #ffffff !important;
            background: rgba(139, 92, 246, .20) !important;
        }

    /* OS panel */
    .manage-vps-page .windows-area {
        padding-top: 0 !important;
    }

    .manage-vps-page .windows-icon {
        width: 70px !important;
        height: 70px !important;
        margin: 0 auto 10px !important;
        filter: drop-shadow(0 8px 18px rgba(20,160,230,.14)) !important;
    }

    .manage-vps-page .windows-title {
        color: #ffffff !important;
        font-size: 15px !important;
        font-weight: 800 !important;
        margin-bottom: 20px !important;
    }

    .manage-vps-page .os-select {
        height: 46px !important;
        border: 1px solid rgba(139, 92, 246, .42) !important;
        border-radius: 11px !important;
        background: #130b25 !important;
        color: #ffffff !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        padding-left: 13px !important;
        box-shadow: none !important;
    }

        .manage-vps-page .os-select option {
            background: #130b25 !important;
            color: #ffffff !important;
        }

    .manage-vps-page .change-os-btn {
        height: 46px !important;
        margin-top: 10px !important;
        border: 0 !important;
        border-radius: 11px !important;
        background: linear-gradient(135deg, #7c2ee8, #8b5cf6) !important;
        color: #ffffff !important;
        font-size: 12px !important;
        font-weight: 800 !important;
        box-shadow: 0 10px 22px rgba(124,46,232,.22) !important;
    }

        .manage-vps-page .change-os-btn:hover {
            background: linear-gradient(135deg, #8b35f4, #a56bff) !important;
            transform: translateY(-1px) !important;
        }

    /* VPS actions */
    .manage-vps-page .vps-actions-row {
        margin-top: 20px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .manage-vps-page .vps-action-card {
        height: 118px !important;
        border: 1px solid rgba(139, 92, 246, .18) !important;
        border-radius: 16px !important;
        background: linear-gradient(145deg, rgba(29, 18, 51, .98), rgba(15, 9, 30, .98)) !important;
        box-shadow: 0 13px 28px rgba(0,0,0,.18) !important;
        transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
    }

        .manage-vps-page .vps-action-card:hover {
            transform: translateY(-3px) !important;
            box-shadow: 0 18px 35px rgba(0,0,0,.26) !important;
            border-color: rgba(139, 92, 246, .48) !important;
        }

    .manage-vps-page .vps-action-icon {
        font-size: 34px !important;
        margin-bottom: 10px !important;
    }

    .manage-vps-page .vps-action-title {
        color: #ddd5e8 !important;
        font-size: 12px !important;
        font-weight: 800 !important;
    }

    .manage-vps-page .action-stop {
        border-bottom: 3px solid #ef476f !important;
    }

    .manage-vps-page .action-start {
        border-bottom: 3px solid #34d399 !important;
    }

    .manage-vps-page .action-reboot {
        border-bottom: 3px solid #60a5fa !important;
    }

    .manage-vps-page .action-format {
        border-bottom: 3px solid #2dd4bf !important;
    }

    .manage-vps-page .action-ipv6 {
        border-bottom: 3px solid #fbbf24 !important;
    }

    /* Back button */
    .manage-vps-page .back-area {
        margin-top: 20px !important;
    }

    .manage-vps-page .back-btn {
        display: inline-flex !important;
        align-items: center !important;
        min-height: 38px !important;
        padding: 8px 14px !important;
        border: 1px solid rgba(139, 92, 246, .30) !important;
        border-radius: 10px !important;
        background: rgba(34, 20, 61, .82) !important;
        color: #cfc6dc !important;
        font-size: 11px !important;
        font-weight: 800 !important;
    }

        .manage-vps-page .back-btn:hover {
            background: rgba(84, 35, 139, .85) !important;
            color: #ffffff !important;
        }

    /* Prevent any detail from being clipped */
    .manage-vps-page .vps-summary-card,
    .manage-vps-page .vps-main-card,
    .manage-vps-page .vps-main-card-body,
    .manage-vps-page .login-value,
    .manage-vps-page .windows-area,
    .manage-vps-page .vps-action-card {
        overflow: visible !important;
    }

    .manage-vps-page * {
        text-overflow: clip !important;
    }

/* Responsive */
@media (max-width: 991px) {
    .manage-vps-page::before {
        font-size: 28px !important;
    }

    .manage-vps-page .vps-top-bar {
        margin-top: -50px !important;
    }
}

@media (max-width: 767px) {
    .manage-vps-page::before {
        font-size: 25px !important;
        margin-top: 4px !important;
    }

    .manage-vps-page::after {
        margin-bottom: 16px !important;
    }

    .manage-vps-page .vps-top-bar {
        margin: -58px 0 18px !important;
    }

    .manage-vps-page .vps-status-row {
        align-items: flex-start !important;
        padding: 13px 14px !important;
        gap: 10px !important;
    }

    .manage-vps-page .vps-status-right {
        position: static !important;
        transform: none !important;
        margin-left: 0 !important;
    }

    .manage-vps-page .vps-summary-card {
        min-height: 94px !important;
    }

    .manage-vps-page .vps-main-card-body {
        padding: 18px !important;
    }

    .manage-vps-page .vps-action-card {
        height: 105px !important;
    }
}

@media (max-width: 480px) {
    .manage-vps-page .vps-refresh-btn {
        padding: 9px 12px !important;
        font-size: 10px !important;
    }

    .manage-vps-page .vps-status-badge {
        min-width: 72px !important;
        padding: 0 9px !important;
    }

    .manage-vps-page .vps-summary-value {
        font-size: 14px !important;
    }
}

/* =========================================================
   END MANAGE VPS PROFESSIONAL THEME
   ========================================================= */

/* =========================================================
   BUY PROXY - EXTRA DETAIL HEIGHT / READABILITY
   ========================================================= */

.proxy-product-card,
.proxy-plan-card,
.buy-proxy-card,
.proxy-card,
.linux-proxy-card {
    min-height: 500px !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
}

    .proxy-product-card .card-body,
    .proxy-plan-card .card-body,
    .buy-proxy-card .card-body,
    .proxy-card .card-body,
    .linux-proxy-card .card-body {
        min-height: 405px !important;
        height: auto !important;
        display: flex !important;
        flex-direction: column !important;
        padding: 18px !important;
    }

    /* Give proxy description a proper readable area instead of squeezing it */
    .proxy-product-card .proxy-description,
    .proxy-plan-card .proxy-description,
    .buy-proxy-card .proxy-description,
    .proxy-card .proxy-description,
    .linux-proxy-card .proxy-description,
    .proxy-product-card .description,
    .proxy-plan-card .description,
    .buy-proxy-card .description,
    .proxy-card .description,
    .linux-proxy-card .description {
        display: block !important;
        min-height: 175px !important;
        height: auto !important;
        margin-top: 14px !important;
        margin-bottom: 18px !important;
        padding: 12px 4px !important;
        color: #f0eafa !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 2 !important;
        letter-spacing: .1px !important;
        white-space: normal !important;
        overflow: visible !important;
        word-break: normal !important;
    }

        /* If the proxy details are rendered as separate lines, keep each line easy to read */
        .proxy-product-card .proxy-description br,
        .proxy-plan-card .proxy-description br,
        .buy-proxy-card .proxy-description br,
        .proxy-card .proxy-description br,
        .linux-proxy-card .proxy-description br,
        .proxy-product-card .description br,
        .proxy-plan-card .description br,
        .buy-proxy-card .description br,
        .proxy-card .description br,
        .linux-proxy-card .description br {
            line-height: 2 !important;
        }

    /* Stock + billing section remains compact and clear */
    .proxy-product-card .proxy-detail-label,
    .proxy-plan-card .proxy-detail-label,
    .buy-proxy-card .proxy-detail-label,
    .proxy-card .proxy-detail-label {
        font-size: 12px !important;
        font-weight: 700 !important;
    }

    .proxy-product-card .proxy-detail-value,
    .proxy-plan-card .proxy-detail-value,
    .buy-proxy-card .proxy-detail-value,
    .proxy-card .proxy-detail-value {
        font-size: 13px !important;
        font-weight: 850 !important;
    }

    /* Keep action buttons at the bottom of the taller card */
    .proxy-product-card .card-footer,
    .proxy-plan-card .card-footer,
    .buy-proxy-card .card-footer,
    .proxy-card .card-footer,
    .linux-proxy-card .card-footer {
        margin-top: auto !important;
    }

    .proxy-product-card .btn,
    .proxy-plan-card .btn,
    .buy-proxy-card .btn,
    .proxy-card .btn,
    .linux-proxy-card .btn {
        min-height: 42px !important;
    }

@media (max-width: 767px) {
    .proxy-product-card,
    .proxy-plan-card,
    .buy-proxy-card,
    .proxy-card,
    .linux-proxy-card {
        min-height: 0 !important;
    }

        .proxy-product-card .card-body,
        .proxy-plan-card .card-body,
        .buy-proxy-card .card-body,
        .proxy-card .card-body,
        .linux-proxy-card .card-body {
            min-height: 0 !important;
        }

        .proxy-product-card .proxy-description,
        .proxy-plan-card .proxy-description,
        .buy-proxy-card .proxy-description,
        .proxy-card .proxy-description,
        .linux-proxy-card .proxy-description,
        .proxy-product-card .description,
        .proxy-plan-card .description,
        .buy-proxy-card .description,
        .proxy-card .description,
        .linux-proxy-card .description {
            min-height: 140px !important;
            line-height: 1.8 !important;
        }
}

/* =========================================================
   END BUY PROXY DETAIL HEIGHT FIX
   ========================================================= */

/* =========================================================
   BUY PROXY - MATCH VPS SERVER CARD PROFESSIONAL THEME
   ========================================================= */

.proxy-plan-card,
.proxy-product-card,
.buy-proxy-card,
.proxy-card,
.linux-proxy-card {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-height: 520px !important;
    overflow: hidden !important;
    background: linear-gradient(145deg, rgba(27,13,57,.99), rgba(9,6,23,.99)) !important;
    border: 1px solid rgba(143,74,255,.34) !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 44px rgba(0,0,0,.38), 0 0 0 1px rgba(255,255,255,.015) !important;
}

    /* Purple VPS-style card header */
    .proxy-plan-card .proxy-card-top,
    .proxy-product-card .proxy-card-top,
    .buy-proxy-card .proxy-card-top,
    .proxy-card .proxy-card-top,
    .linux-proxy-card .proxy-card-top {
        flex: 0 0 auto !important;
        min-height: 96px !important;
        padding: 22px 20px !important;
        background: linear-gradient(135deg, #5720c8 0%, #7b2cff 52%, #9b3dff 100%) !important;
        border-bottom: 1px solid rgba(255,255,255,.16) !important;
        color: #ffffff !important;
    }

        .proxy-plan-card .proxy-card-top *,
        .proxy-product-card .proxy-card-top *,
        .buy-proxy-card .proxy-card-top *,
        .proxy-card .proxy-card-top *,
        .linux-proxy-card .proxy-card-top * {
            color: #ffffff !important;
            -webkit-text-fill-color: #ffffff !important;
            opacity: 1 !important;
            visibility: visible !important;
        }

    .proxy-plan-card .proxy-plan-name,
    .proxy-product-card .proxy-plan-name,
    .buy-proxy-card .proxy-plan-name,
    .proxy-card .proxy-plan-name,
    .linux-proxy-card .proxy-plan-name {
        margin: 0 0 7px !important;
        font-size: 18px !important;
        line-height: 1.3 !important;
        font-weight: 850 !important;
    }

    .proxy-plan-card .proxy-plan-subtitle,
    .proxy-product-card .proxy-plan-subtitle,
    .buy-proxy-card .proxy-plan-subtitle,
    .proxy-card .proxy-plan-subtitle,
    .linux-proxy-card .proxy-plan-subtitle {
        font-size: 11px !important;
        font-weight: 700 !important;
        letter-spacing: .3px !important;
        text-transform: uppercase !important;
        opacity: .9 !important;
    }

    .proxy-plan-card .proxy-stock-badge,
    .proxy-product-card .proxy-stock-badge,
    .buy-proxy-card .proxy-stock-badge,
    .proxy-card .proxy-stock-badge,
    .linux-proxy-card .proxy-stock-badge {
        display: inline-flex !important;
        align-items: center !important;
        padding: 6px 10px !important;
        border-radius: 999px !important;
        background: rgba(17,185,110,.22) !important;
        border: 1px solid rgba(117,255,191,.34) !important;
        color: #dffff0 !important;
        font-size: 11px !important;
        font-weight: 800 !important;
        white-space: nowrap !important;
    }

    .proxy-plan-card .proxy-out-badge,
    .proxy-product-card .proxy-out-badge,
    .buy-proxy-card .proxy-out-badge,
    .proxy-card .proxy-out-badge,
    .linux-proxy-card .proxy-out-badge {
        display: inline-flex !important;
        align-items: center !important;
        padding: 6px 10px !important;
        border-radius: 999px !important;
        background: rgba(239,68,68,.18) !important;
        border: 1px solid rgba(255,100,100,.35) !important;
        color: #ffdede !important;
        font-size: 11px !important;
        font-weight: 800 !important;
        white-space: nowrap !important;
    }

    /* Dark VPS-style body */
    .proxy-plan-card .proxy-plan-body,
    .proxy-product-card .proxy-plan-body,
    .buy-proxy-card .proxy-plan-body,
    .proxy-card .proxy-plan-body,
    .linux-proxy-card .proxy-plan-body {
        display: flex !important;
        flex: 1 1 auto !important;
        flex-direction: column !important;
        min-height: 424px !important;
        padding: 20px !important;
        background: linear-gradient(180deg, rgba(20,10,42,.98), rgba(9,6,23,.99)) !important;
        color: #d8d0e5 !important;
    }

    /* Price exactly like VPS card */
    .proxy-plan-card .proxy-price,
    .proxy-product-card .proxy-price,
    .buy-proxy-card .proxy-price,
    .proxy-card .proxy-price,
    .linux-proxy-card .proxy-price {
        margin: 0 0 15px !important;
        padding: 0 0 14px !important;
        border-bottom: 1px solid rgba(255,255,255,.10) !important;
    }

    .proxy-plan-card .proxy-price-value,
    .proxy-product-card .proxy-price-value,
    .buy-proxy-card .proxy-price-value,
    .proxy-card .proxy-price-value,
    .linux-proxy-card .proxy-price-value {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        font-size: 25px !important;
        font-weight: 850 !important;
        line-height: 1.15 !important;
    }

    .proxy-plan-card .proxy-price-cycle,
    .proxy-product-card .proxy-price-cycle,
    .buy-proxy-card .proxy-price-cycle,
    .proxy-card .proxy-price-cycle,
    .linux-proxy-card .proxy-price-cycle {
        color: #9c93aa !important;
        -webkit-text-fill-color: #9c93aa !important;
        font-size: 11px !important;
        font-weight: 700 !important;
    }

    /* Stock / billing panel matching VPS configuration blocks */
    .proxy-plan-card .proxy-detail-box,
    .proxy-product-card .proxy-detail-box,
    .buy-proxy-card .proxy-detail-box,
    .proxy-card .proxy-detail-box,
    .linux-proxy-card .proxy-detail-box {
        margin: 0 0 15px !important;
        padding: 4px 12px !important;
        background: rgba(255,255,255,.035) !important;
        border: 1px solid rgba(255,255,255,.10) !important;
        border-radius: 10px !important;
    }

    .proxy-plan-card .proxy-detail-row,
    .proxy-product-card .proxy-detail-row,
    .buy-proxy-card .proxy-detail-row,
    .proxy-card .proxy-detail-row,
    .linux-proxy-card .proxy-detail-row {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        min-height: 40px !important;
        border-bottom: 1px dashed rgba(255,255,255,.10) !important;
    }

        .proxy-plan-card .proxy-detail-row:last-child,
        .proxy-product-card .proxy-detail-row:last-child,
        .buy-proxy-card .proxy-detail-row:last-child,
        .proxy-card .proxy-detail-row:last-child,
        .linux-proxy-card .proxy-detail-row:last-child {
            border-bottom: 0 !important;
        }

    .proxy-plan-card .proxy-detail-label,
    .proxy-product-card .proxy-detail-label,
    .buy-proxy-card .proxy-detail-label,
    .proxy-card .proxy-detail-label,
    .linux-proxy-card .proxy-detail-label {
        color: #aaa2b9 !important;
        font-size: 12px !important;
        font-weight: 650 !important;
    }

    .proxy-plan-card .proxy-detail-value,
    .proxy-product-card .proxy-detail-value,
    .buy-proxy-card .proxy-detail-value,
    .proxy-card .proxy-detail-value,
    .linux-proxy-card .proxy-detail-value {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        font-size: 13px !important;
        font-weight: 850 !important;
    }

    /* Proxy features/details: readable and spaced like VPS configuration */
    .proxy-plan-card .proxy-description,
    .proxy-product-card .proxy-description,
    .buy-proxy-card .proxy-description,
    .proxy-card .proxy-description,
    .linux-proxy-card .proxy-description {
        flex: 1 1 auto !important;
        min-height: 150px !important;
        margin: 0 0 18px !important;
        padding: 2px 0 !important;
        color: #cfc6dc !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1.75 !important;
        white-space: normal !important;
        overflow: visible !important;
    }

        .proxy-plan-card .proxy-description br,
        .proxy-product-card .proxy-description br,
        .buy-proxy-card .proxy-description br,
        .proxy-card .proxy-description br,
        .linux-proxy-card .proxy-description br {
            line-height: 1.75 !important;
        }

    /* Action buttons stay at bottom and match VPS buttons */
    .proxy-plan-card .proxy-card-actions,
    .proxy-product-card .proxy-card-actions,
    .buy-proxy-card .proxy-card-actions,
    .proxy-card .proxy-card-actions,
    .linux-proxy-card .proxy-card-actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 10px !important;
        margin-top: auto !important;
    }

    .proxy-plan-card .proxy-cart-btn,
    .proxy-product-card .proxy-cart-btn,
    .buy-proxy-card .proxy-cart-btn,
    .proxy-card .proxy-cart-btn,
    .linux-proxy-card .proxy-cart-btn,
    .proxy-plan-card .proxy-buy-btn,
    .proxy-product-card .proxy-buy-btn,
    .buy-proxy-card .proxy-buy-btn,
    .proxy-card .proxy-buy-btn,
    .linux-proxy-card .proxy-buy-btn {
        min-height: 42px !important;
        border-radius: 10px !important;
        font-weight: 800 !important;
        cursor: pointer !important;
        transition: .2s ease !important;
    }

    .proxy-plan-card .proxy-cart-btn,
    .proxy-product-card .proxy-cart-btn,
    .buy-proxy-card .proxy-cart-btn,
    .proxy-card .proxy-cart-btn,
    .linux-proxy-card .proxy-cart-btn {
        background: rgba(124,44,255,.08) !important;
        border: 1px solid rgba(160,95,255,.48) !important;
        color: #e2cfff !important;
    }

    .proxy-plan-card .proxy-buy-btn,
    .proxy-product-card .proxy-buy-btn,
    .buy-proxy-card .proxy-buy-btn,
    .proxy-card .proxy-buy-btn,
    .linux-proxy-card .proxy-buy-btn {
        background: linear-gradient(135deg, #7b2cff, #9b3dff) !important;
        border: 1px solid transparent !important;
        color: #ffffff !important;
        box-shadow: 0 8px 20px rgba(124,44,255,.24) !important;
    }

        .proxy-plan-card .proxy-cart-btn:hover,
        .proxy-product-card .proxy-cart-btn:hover,
        .buy-proxy-card .proxy-cart-btn:hover,
        .proxy-card .proxy-cart-btn:hover,
        .linux-proxy-card .proxy-cart-btn:hover,
        .proxy-plan-card .proxy-buy-btn:hover,
        .proxy-product-card .proxy-buy-btn:hover,
        .buy-proxy-card .proxy-buy-btn:hover,
        .proxy-card .proxy-buy-btn:hover,
        .linux-proxy-card .proxy-buy-btn:hover {
            transform: translateY(-1px) !important;
        }

    .proxy-plan-card .proxy-disabled-btn,
    .proxy-product-card .proxy-disabled-btn,
    .buy-proxy-card .proxy-disabled-btn,
    .proxy-card .proxy-disabled-btn,
    .linux-proxy-card .proxy-disabled-btn {
        width: 100% !important;
        min-height: 42px !important;
        margin-top: auto !important;
        border-radius: 10px !important;
        background: rgba(120,30,50,.18) !important;
        border: 1px solid rgba(240,80,100,.24) !important;
        color: #ff8d9d !important;
        font-weight: 800 !important;
    }

@media (max-width: 767px) {
    .proxy-plan-card,
    .proxy-product-card,
    .buy-proxy-card,
    .proxy-card,
    .linux-proxy-card {
        min-height: 0 !important;
    }

        .proxy-plan-card .proxy-card-top,
        .proxy-product-card .proxy-card-top,
        .buy-proxy-card .proxy-card-top,
        .proxy-card .proxy-card-top,
        .linux-proxy-card .proxy-card-top {
            min-height: 88px !important;
            padding: 18px 16px !important;
        }

        .proxy-plan-card .proxy-plan-body,
        .proxy-product-card .proxy-plan-body,
        .buy-proxy-card .proxy-plan-body,
        .proxy-card .proxy-plan-body,
        .linux-proxy-card .proxy-plan-body {
            min-height: 0 !important;
            padding: 16px !important;
        }

        .proxy-plan-card .proxy-description,
        .proxy-product-card .proxy-description,
        .buy-proxy-card .proxy-description,
        .proxy-card .proxy-description,
        .linux-proxy-card .proxy-description {
            min-height: 120px !important;
        }
}

/* =========================================================
   END BUY PROXY - VPS MATCHING THEME
   ========================================================= */


/* =========================================================
   BUY PROXY - VPS STYLE FEATURE / DETAIL LIST
   ========================================================= */

.proxy-plan-card .proxy-description,
.proxy-product-card .proxy-description,
.buy-proxy-card .proxy-description,
.proxy-card .proxy-description,
.linux-proxy-card .proxy-description {
    min-height: 0 !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    color: #cfc6dc !important;
    overflow: visible !important;
}

.proxy-plan-card .proxy-feature-list,
.proxy-product-card .proxy-feature-list,
.buy-proxy-card .proxy-feature-list,
.proxy-card .proxy-feature-list,
.linux-proxy-card .proxy-feature-list {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

.proxy-plan-card .proxy-feature-item,
.proxy-product-card .proxy-feature-item,
.buy-proxy-card .proxy-feature-item,
.proxy-card .proxy-feature-item,
.linux-proxy-card .proxy-feature-item {
    display: flex !important;
    align-items: flex-start !important;
    gap: 8px !important;
    min-height: 27px !important;
    padding: 3px 0 !important;
    color: #cfc6dc !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
    border: 0 !important;
}

    .proxy-plan-card .proxy-feature-item + .proxy-feature-item,
    .proxy-product-card .proxy-feature-item + .proxy-feature-item,
    .buy-proxy-card .proxy-feature-item + .proxy-feature-item,
    .proxy-card .proxy-feature-item + .proxy-feature-item,
    .linux-proxy-card .proxy-feature-item + .proxy-feature-item {
        border-top: 0 !important;
    }

.proxy-plan-card .proxy-feature-icon,
.proxy-product-card .proxy-feature-icon,
.buy-proxy-card .proxy-feature-icon,
.proxy-card .proxy-feature-icon,
.linux-proxy-card .proxy-feature-icon {
    flex: 0 0 16px !important;
    width: 16px !important;
    height: 16px !important;
    margin-top: 1px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background: #9b3dff !important;
    color: #ffffff !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    box-shadow: 0 2px 7px rgba(124,44,255,.28) !important;
}

.proxy-plan-card .proxy-feature-text,
.proxy-product-card .proxy-feature-text,
.buy-proxy-card .proxy-feature-text,
.proxy-card .proxy-feature-text,
.linux-proxy-card .proxy-feature-text {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    color: #cfc6dc !important;
    white-space: normal !important;
    overflow: visible !important;
    word-break: normal !important;
}

@media (max-width: 767px) {
    .proxy-plan-card .proxy-feature-item,
    .proxy-product-card .proxy-feature-item,
    .buy-proxy-card .proxy-feature-item,
    .proxy-card .proxy-feature-item,
    .linux-proxy-card .proxy-feature-item {
        font-size: 12px !important;
        min-height: 26px !important;
    }
}

/* =========================================================
   END BUY PROXY - VPS STYLE FEATURE / DETAIL LIST
   ========================================================= */


/* =========================================================
   FINAL BUY PROXY FEATURE LIST OVERRIDE
   Description entered in Admin is displayed line-by-line.
   ========================================================= */

.proxy-plan-card .proxy-description,
.proxy-product-card .proxy-description,
.buy-proxy-card .proxy-description,
.proxy-card .proxy-description,
.linux-proxy-card .proxy-description {
    min-height: 175px !important;
    height: auto !important;
    margin: 0 0 18px !important;
    padding: 4px 0 !important;
    overflow: visible !important;
    white-space: normal !important;
}

.proxy-plan-card .proxy-feature-list,
.proxy-product-card .proxy-feature-list,
.buy-proxy-card .proxy-feature-list,
.proxy-card .proxy-feature-list,
.linux-proxy-card .proxy-feature-list {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.proxy-plan-card .proxy-feature-item,
.proxy-product-card .proxy-feature-item,
.buy-proxy-card .proxy-feature-item,
.proxy-card .proxy-feature-item,
.linux-proxy-card .proxy-feature-item {
    display: flex !important;
    align-items: flex-start !important;
    width: 100% !important;
    min-height: 29px !important;
    padding: 4px 0 !important;
    gap: 8px !important;
    color: #d8d0e5 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
    white-space: normal !important;
    border: 0 !important;
}

.proxy-plan-card .proxy-feature-icon,
.proxy-product-card .proxy-feature-icon,
.buy-proxy-card .proxy-feature-icon,
.proxy-card .proxy-feature-icon,
.linux-proxy-card .proxy-feature-icon {
    flex: 0 0 18px !important;
    width: 18px !important;
    height: 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-top: 1px !important;
    border-radius: 50% !important;
    background: #913cff !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 18px !important;
}

.proxy-plan-card .proxy-feature-text,
.proxy-product-card .proxy-feature-text,
.buy-proxy-card .proxy-feature-text,
.proxy-card .proxy-feature-text,
.linux-proxy-card .proxy-feature-text {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    color: #d8d0e5 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
}

.proxy-plan-card .proxy-feature-item + .proxy-feature-item,
.proxy-product-card .proxy-feature-item + .proxy-feature-item,
.buy-proxy-card .proxy-feature-item + .proxy-feature-item,
.proxy-card .proxy-feature-item + .proxy-feature-item,
.linux-proxy-card .proxy-feature-item + .proxy-feature-item {
    border-top: 1px solid rgba(255,255,255,.055) !important;
}


/* =========================================================
   26. FINAL MATCH FIX - VPS SERVER + LEFT SELLER SIDEBAR
   Based on the existing Seller Panel markup.
   FUNCTIONALITY IS NOT CHANGED.
   ========================================================= */

/* ---------------------------------------------------------
   LEFT SELLER SIDEBAR - MATCH PROFESSIONAL DARK THEME
   --------------------------------------------------------- */
.seller-sidebar {
    background: linear-gradient(180deg, #0d061c 0%, #080411 100%) !important;
    background-color: #0d061c !important;
    border-right: 1px solid rgba(154, 87, 255, .18) !important;
    color: #f5f1ff !important;
}

    .seller-sidebar .seller-logo {
        color: #ffffff !important;
        background: transparent !important;
        border-bottom: 1px solid rgba(154, 87, 255, .16) !important;
    }

    .seller-sidebar .seller-user {
        color: #ffffff !important;
        background: transparent !important;
        border-bottom: 1px solid rgba(154, 87, 255, .12) !important;
    }

        .seller-sidebar .seller-user .fw-bold,
        .seller-sidebar .seller-user strong {
            color: #ffffff !important;
        }

        .seller-sidebar .seller-user small {
            color: #aaa2b9 !important;
        }

    .seller-sidebar .seller-menu {
        background: transparent !important;
    }

        .seller-sidebar .seller-menu a {
            color: #c8bfd8 !important;
            background: transparent !important;
            border: 1px solid transparent !important;
            border-radius: 10px !important;
            text-decoration: none !important;
            opacity: 1 !important;
        }

            .seller-sidebar .seller-menu a:hover {
                color: #ffffff !important;
                background: rgba(126, 54, 255, .10) !important;
                border-color: rgba(153, 87, 255, .18) !important;
            }

            .seller-sidebar .seller-menu a.active {
                color: #ffffff !important;
                background: linear-gradient(135deg, rgba(126,54,255,.30), rgba(93,36,170,.20)) !important;
                border: 1px solid rgba(153,87,255,.48) !important;
                box-shadow: 0 0 20px rgba(128,55,255,.12) !important;
            }

            .seller-sidebar .seller-menu a .menu-icon {
                color: inherit !important;
                opacity: 1 !important;
            }

    .seller-sidebar .seller-logout {
        background: transparent !important;
    }

        .seller-sidebar .seller-logout a {
            color: #ffffff !important;
            background: linear-gradient(135deg, #b72d45, #8f2035) !important;
            border: 1px solid rgba(255, 112, 132, .20) !important;
            border-radius: 7px !important;
            text-decoration: none !important;
            opacity: 1 !important;
        }

            .seller-sidebar .seller-logout a:hover {
                color: #ffffff !important;
                background: linear-gradient(135deg, #c8334d, #a3233a) !important;
            }

/* ---------------------------------------------------------
   VPS CARD - EXISTING MARKUP COLORS WERE STILL BOOTSTRAP
   These selectors match the actual VPS Server view.
   --------------------------------------------------------- */

.vps-product-card .vps-card-body {
    color: #ddd5ea !important;
    -webkit-text-fill-color: #ddd5ea !important;
}

.vps-product-card .vps-config-title {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    border-bottom-color: rgba(255,255,255,.12) !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.vps-product-card .vps-config-list {
    color: #cfc6dc !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.vps-product-card .vps-config-item {
    color: #cfc6dc !important;
    -webkit-text-fill-color: #cfc6dc !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.vps-product-card .vps-config-text {
    color: #cfc6dc !important;
    -webkit-text-fill-color: #cfc6dc !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.vps-product-card .vps-check {
    background: #9b3dff !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Price - actual markup uses .vps-price, not .vps-price .price */
.vps-product-card .vps-price-section {
    border-top-color: rgba(255,255,255,.11) !important;
}

.vps-product-card .vps-small-label {
    color: #aaa2b9 !important;
    -webkit-text-fill-color: #aaa2b9 !important;
    opacity: 1 !important;
}

.vps-product-card .vps-price {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-size: 25px !important;
    font-weight: 850 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.vps-product-card .vps-billing {
    color: #9d95aa !important;
    -webkit-text-fill-color: #9d95aa !important;
    opacity: 1 !important;
}

/* Stock - actual markup uses .vps-stock-number */
.vps-product-card .vps-stock-section {
    border-top-color: rgba(255,255,255,.11) !important;
}

.vps-product-card .vps-stock-number {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-size: 20px !important;
    font-weight: 850 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.vps-product-card .vps-stock-badge {
    opacity: 1 !important;
    visibility: visible !important;
}

    .vps-product-card .vps-stock-badge.in-stock {
        background: rgba(33,196,118,.13) !important;
        color: #52f2a4 !important;
        -webkit-text-fill-color: #52f2a4 !important;
        border: 1px solid rgba(33,196,118,.28) !important;
    }

    .vps-product-card .vps-stock-badge.out-stock {
        background: rgba(255,61,91,.12) !important;
        color: #ff7180 !important;
        -webkit-text-fill-color: #ff7180 !important;
        border: 1px solid rgba(255,61,91,.28) !important;
    }

.vps-product-card .stock-dot {
    background: currentColor !important;
}

/* Availability messages */
.vps-product-card .vps-available-message {
    background: rgba(33,196,118,.10) !important;
    color: #63e9a5 !important;
    -webkit-text-fill-color: #63e9a5 !important;
    border: 1px solid rgba(33,196,118,.18) !important;
}

.vps-product-card .vps-unavailable-message {
    background: rgba(255,61,91,.10) !important;
    color: #ff7180 !important;
    -webkit-text-fill-color: #ff7180 !important;
    border: 1px solid rgba(255,61,91,.20) !important;
}

/* Do not allow Bootstrap dark text utilities inside VPS cards */
.vps-product-card .vps-card-body .text-dark,
.vps-product-card .vps-card-body .text-secondary,
.vps-product-card .vps-card-body .text-body,
.vps-product-card .vps-card-body .text-black,
.vps-product-card .vps-card-body .text-muted {
    color: #cfc6dc !important;
    -webkit-text-fill-color: #cfc6dc !important;
    opacity: 1 !important;
}

/* Keep headings and important values white */
.vps-product-card .vps-card-body h1,
.vps-product-card .vps-card-body h2,
.vps-product-card .vps-card-body h3,
.vps-product-card .vps-card-body h4,
.vps-product-card .vps-card-body h5,
.vps-product-card .vps-card-body h6,
.vps-product-card .vps-card-body strong {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
}

/* ---------------------------------------------------------
   VPS CARD SPACING - SAME PROFESSIONAL LOOK
   --------------------------------------------------------- */
.vps-product-card .vps-card-body {
    padding: 18px !important;
}

.vps-product-card .vps-config-list {
    min-height: 150px !important;
    margin-bottom: 13px !important;
}

.vps-product-card .vps-price-section {
    margin-bottom: 13px !important;
    padding-top: 13px !important;
}

.vps-product-card .vps-stock-section {
    padding-top: 11px !important;
    margin-bottom: 12px !important;
}

/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */
@media (max-width: 768px) {
    .vps-product-card .vps-card-body {
        padding: 15px !important;
    }

    .vps-product-card .vps-config-item {
        font-size: 12px !important;
    }

    .vps-product-card .vps-price {
        font-size: 23px !important;
    }
}

/* =========================================================
   25. FUNCTIONALITY SAFETY - PROXY CART
   IMPORTANT: CSS ONLY. DO NOT BLOCK EXISTING JAVASCRIPT.
   ========================================================= */

/* Proxy action area must always receive mouse/touch events */
.proxy-card-actions,
.proxy-plan-card .proxy-card-actions,
.proxy-product-card .proxy-card-actions,
.buy-proxy-card .proxy-card-actions,
.proxy-card .proxy-card-actions,
.linux-proxy-card .proxy-card-actions {
    position: relative !important;
    z-index: 20 !important;
    pointer-events: auto !important;
}

    .proxy-card-actions button,
    .proxy-plan-card .proxy-card-actions button,
    .proxy-product-card .proxy-card-actions button,
    .buy-proxy-card .proxy-card-actions button,
    .proxy-card .proxy-card-actions button,
    .linux-proxy-card .proxy-card-actions button {
        position: relative !important;
        z-index: 21 !important;
        pointer-events: auto !important;
        cursor: pointer !important;
    }

/* Never let decorative/visual layers block the buttons */
.proxy-plan-card::before,
.proxy-plan-card::after,
.proxy-product-card::before,
.proxy-product-card::after,
.buy-proxy-card::before,
.buy-proxy-card::after,
.proxy-card::before,
.proxy-card::after,
.linux-proxy-card::before,
.linux-proxy-card::after {
    pointer-events: none !important;
}

/* Top-right Proxy Cart control remains clickable */
.proxy-cart-link,
.proxy-cart-btn-top,
.proxy-top-cart,
#proxyCartButton,
#proxyCartLink,
#proxyCartCount {
    position: relative !important;
    z-index: 30 !important;
    pointer-events: auto !important;
}

/* Keep the cart count visible */
#proxyCartCount {
    opacity: 1 !important;
    visibility: visible !important;
}
