/*
 * P2P Marketplace Styles
 * All P2P-specific styles with p2p- prefix
 * Supports both dark (default) and light (body.light-theme) themes
 */

/* ========================================
   P2P Layout & Containers
   ======================================== */
.p2p-container {
    max-width: 1200px;
    margin: 0 auto;
}

.p2p-grid {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 20px;
}

.p2p-grid-full {
    grid-template-columns: 1fr;
}

/* ========================================
   P2P Header & Stats Bar
   ======================================== */
.p2p-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: var(--border);
    margin-bottom: 20px;
}

.p2p-stat {
    background: var(--bg-2);
    padding: 16px;
    text-align: center;
}

.p2p-stat-label {
    font-size: 10px;
    color: var(--text-2);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}

.p2p-stat-value {
    font-size: 20px;
    font-weight: 700;
    color: var(--text);
}

.p2p-stat-value.green { color: #10b981; }
.p2p-stat-value.gold { color: var(--gold); }
.p2p-stat-value.red { color: #ef4444; }
.p2p-stat-value.blue { color: #3b82f6; }

.p2p-stat-sub {
    font-size: 10px;
    color: var(--text-2);
    margin-top: 2px;
}

/* ========================================
   P2P Toolbar & Search
   ======================================== */
.p2p-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: var(--bg-2);
    border: 1px solid var(--border);
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.p2p-search-form {
    display: flex;
    flex: 1;
    min-width: 200px;
}

.p2p-search-input {
    flex: 1;
    padding: 10px 12px;
    background: var(--bg-1);
    border: 1px solid var(--border);
    border-right: none;
    color: var(--text);
    font-size: 13px;
    font-family: inherit;
}

.p2p-search-input:focus {
    outline: none;
    border-color: var(--gold);
}

.p2p-search-btn {
    padding: 10px 16px;
    background: var(--gold);
    border: 1px solid var(--gold);
    color: #000;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.p2p-search-btn:hover {
    background: var(--gold-dim);
}

.p2p-filter-select {
    padding: 10px 12px;
    background: var(--bg-1);
    border: 1px solid var(--border);
    color: var(--text);
    font-size: 13px;
    font-family: inherit;
    min-width: 150px;
    cursor: pointer;
}

.p2p-nav-links {
    display: flex;
    gap: 8px;
}

.p2p-nav-link {
    padding: 10px 16px;
    background: var(--bg-3);
    border: 1px solid var(--border);
    color: var(--text-2);
    font-size: 12px;
    text-decoration: none;
}

.p2p-nav-link:hover,
.p2p-nav-link.active {
    background: var(--gold);
    border-color: var(--gold);
    color: #000;
}

/* ========================================
   P2P Panel
   ======================================== */
.p2p-panel {
    background: var(--bg-1);
    border: 1px solid var(--border);
    margin-bottom: 16px;
}

.p2p-panel-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: var(--bg-2);
    border-bottom: 1px solid var(--border);
}

.p2p-panel-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--text);
}

.p2p-panel-badge {
    padding: 3px 8px;
    background: var(--gold);
    color: #000;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
}

.p2p-panel-body {
    padding: 16px;
}

/* ========================================
   P2P Listings Grid
   ======================================== */
.p2p-listings {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 16px;
}

.p2p-listing-card {
    background: var(--bg-2);
    border: 1px solid var(--border);
    transition: border-color 0.2s;
}

.p2p-listing-card:hover {
    border-color: var(--gold);
}

.p2p-listing-header {
    padding: 12px;
    border-bottom: 1px solid var(--border);
}

.p2p-listing-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.p2p-listing-category {
    font-size: 11px;
    color: var(--text-2);
}

.p2p-listing-body {
    padding: 12px;
}

.p2p-listing-seller {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.p2p-seller-name {
    font-size: 12px;
    color: var(--gold);
    font-weight: 600;
}

.p2p-seller-rank {
    font-size: 10px;
    padding: 2px 6px;
    background: var(--bg-3);
    color: var(--text-2);
}

.p2p-seller-rating {
    font-size: 11px;
    color: #fbbf24;
}

.p2p-listing-stats {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    color: var(--text-2);
    margin-bottom: 10px;
}

.p2p-listing-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px;
    background: var(--bg-3);
    border-top: 1px solid var(--border);
}

.p2p-listing-price {
    font-size: 18px;
    font-weight: 700;
    color: #10b981;
}

.p2p-listing-btn {
    padding: 8px 16px;
    background: var(--gold);
    border: none;
    color: #000;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
}

.p2p-listing-btn:hover {
    background: var(--gold-dim);
}

.p2p-listing-btn.disabled {
    background: var(--bg-3);
    color: var(--text-2);
    cursor: not-allowed;
}

/* Listing badges */
.p2p-badge {
    display: inline-block;
    padding: 2px 6px;
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
    margin-left: 6px;
}

.p2p-badge-new {
    background: #10b981;
    color: #fff;
}

.p2p-badge-featured {
    background: var(--gold);
    color: #000;
}

.p2p-badge-hot {
    background: #ef4444;
    color: #fff;
}

/* ========================================
   P2P Single Listing View
   ======================================== */
.p2p-view-header {
    padding: 20px;
    border-bottom: 1px solid var(--border);
}

.p2p-view-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 8px;
}

.p2p-view-meta {
    display: flex;
    gap: 16px;
    font-size: 12px;
    color: var(--text-2);
}

.p2p-view-body {
    padding: 20px;
}

.p2p-view-section {
    margin-bottom: 20px;
}

.p2p-view-section-title {
    font-size: 13px;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border);
}

.p2p-view-desc {
    font-size: 13px;
    color: var(--text);
    line-height: 1.6;
    white-space: pre-wrap;
}

.p2p-view-price-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    background: var(--bg-3);
    border: 1px solid var(--border);
    margin-bottom: 16px;
}

.p2p-view-price {
    font-size: 28px;
    font-weight: 700;
    color: #10b981;
}

.p2p-view-stock {
    font-size: 13px;
    color: var(--text-2);
}

.p2p-view-stock strong {
    color: var(--text);
}

.p2p-buy-btn {
    display: block;
    width: 100%;
    padding: 14px;
    background: var(--gold);
    border: none;
    color: #000;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    cursor: pointer;
    text-decoration: none;
}

.p2p-buy-btn:hover {
    background: var(--gold-dim);
}

.p2p-buy-btn.disabled {
    background: var(--bg-3);
    color: var(--text-2);
    cursor: not-allowed;
}

/* ========================================
   P2P Seller Profile Card
   ======================================== */
.p2p-seller-card {
    padding: 16px;
    background: var(--bg-2);
    border: 1px solid var(--border);
}

.p2p-seller-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.p2p-seller-avatar {
    width: 48px;
    height: 48px;
    background: var(--bg-3);
    border: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: var(--gold);
}

.p2p-seller-info h3 {
    font-size: 14px;
    font-weight: 600;
    color: var(--gold);
    margin: 0 0 4px 0;
}

.p2p-seller-info .rank {
    font-size: 11px;
    color: var(--text-2);
}

.p2p-seller-verified {
    color: #10b981;
    font-size: 11px;
}

.p2p-seller-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
}

.p2p-seller-stat {
    text-align: center;
}

.p2p-seller-stat-value {
    font-size: 16px;
    font-weight: 700;
    color: var(--text);
}

.p2p-seller-stat-label {
    font-size: 10px;
    color: var(--text-2);
}

/* Seller Profile Stats Bar */
.p2p-stats-bar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 1px;
    background: var(--border);
    border: 1px solid var(--border);
    margin-bottom: 20px;
    overflow: hidden;
}

.p2p-stat-item {
    background: var(--bg-2);
    padding: 24px 16px;
    text-align: center;
}

.p2p-stat-item .p2p-stat-value {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 6px;
    line-height: 1.2;
}

.p2p-stat-item .p2p-stat-label {
    font-size: 10px;
    color: var(--text-2);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Seller Badges */
.p2p-seller-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}

.p2p-seller-badge {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: var(--bg-3);
    border: 1px solid var(--border);
    font-size: 13px;
    color: var(--text);
}

.p2p-seller-badge-icon {
    font-size: 16px;
    flex-shrink: 0;
}

/* Seller Rank Display */
.p2p-seller-rank {
    font-weight: 600;
    font-size: 13px;
    padding: 4px 10px;
    background: var(--bg-3);
    border: 1px solid var(--border);
}

/* ========================================
   P2P Orders / Sales Table
   ======================================== */
.p2p-table-head {
    display: grid;
    grid-template-columns: 80px 1fr 100px 80px 100px 100px;
    gap: 12px;
    padding: 10px 12px;
    background: var(--bg-3);
    border-bottom: 1px solid var(--border);
    font-size: 10px;
    color: var(--text-2);
    text-transform: uppercase;
}

.p2p-table-row {
    display: grid;
    grid-template-columns: 80px 1fr 100px 80px 100px 100px;
    gap: 12px;
    padding: 12px;
    border-bottom: 1px solid var(--border);
    align-items: center;
    font-size: 12px;
}

.p2p-table-row:hover {
    background: var(--bg-2);
}

.p2p-order-id {
    font-family: monospace;
    color: var(--text-2);
}

.p2p-order-title {
    color: var(--text);
    font-weight: 500;
}

.p2p-order-price {
    color: #10b981;
    font-weight: 600;
}

.p2p-order-status {
    padding: 4px 8px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
}

.p2p-status-pending { background: #fbbf24; color: #000; }
.p2p-status-completed { background: #10b981; color: #fff; }
.p2p-status-disputed { background: #ef4444; color: #fff; }
.p2p-status-refunded { background: #6b7280; color: #fff; }
.p2p-status-secondary { background: var(--bg-3); color: var(--text-2); }
.p2p-status-warning { background: #f59e0b; color: #000; }

/* Info rows for detail panels */
.p2p-info-rows { display: flex; flex-direction: column; gap: 0; }
.p2p-info-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--border);
    font-size: 12px;
}
.p2p-info-row:last-child { border-bottom: none; }
.p2p-info-label { color: var(--text-2); }
.p2p-info-value { color: var(--text); font-weight: 500; text-align: right; }

.p2p-order-action {
    padding: 6px 12px;
    background: var(--bg-3);
    border: 1px solid var(--border);
    color: var(--text);
    font-size: 11px;
    cursor: pointer;
    text-decoration: none;
    text-align: center;
}

.p2p-order-action:hover {
    border-color: var(--gold);
    color: var(--gold);
}

/* ========================================
   P2P Seller Dashboard
   ======================================== */
.p2p-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    margin-bottom: 20px;
}

.p2p-dash-card {
    padding: 20px;
    background: var(--bg-2);
    border: 1px solid var(--border);
    text-align: center;
}

.p2p-dash-icon {
    font-size: 24px;
    margin-bottom: 8px;
}

.p2p-dash-value {
    font-size: 24px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 4px;
}

.p2p-dash-label {
    font-size: 11px;
    color: var(--text-2);
    text-transform: uppercase;
}

/* ========================================
   P2P Forms
   ======================================== */
.p2p-form-group {
    margin-bottom: 16px;
}

.p2p-form-label {
    display: block;
    font-size: 12px;
    color: var(--text-2);
    margin-bottom: 6px;
    text-transform: uppercase;
}

.p2p-form-input,
.p2p-form-textarea,
.p2p-form-select {
    width: 100%;
    padding: 12px;
    background: var(--bg-1);
    border: 1px solid var(--border);
    color: var(--text);
    font-size: 13px;
    font-family: inherit;
}

.p2p-form-input:focus,
.p2p-form-textarea:focus,
.p2p-form-select:focus {
    outline: none;
    border-color: var(--gold);
}

.p2p-form-textarea {
    min-height: 120px;
    resize: vertical;
}

.p2p-form-hint {
    font-size: 11px;
    color: var(--text-2);
    margin-top: 4px;
}

.p2p-form-error {
    font-size: 11px;
    color: #ef4444;
    margin-top: 4px;
}

.p2p-form-btn {
    padding: 12px 24px;
    background: var(--gold);
    border: none;
    color: #000;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.p2p-form-btn:hover {
    background: var(--gold-dim);
}

.p2p-form-btn.secondary {
    background: var(--bg-3);
    border: 1px solid var(--border);
    color: var(--text);
}

.p2p-form-btn.danger {
    background: #ef4444;
    color: #fff;
}

/* ========================================
   P2P Alerts
   ======================================== */
.p2p-alert {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px;
    margin-bottom: 16px;
    border: 1px solid var(--border);
}

.p2p-alert-icon {
    font-size: 18px;
}

.p2p-alert-content {
    flex: 1;
}

.p2p-alert-title {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 4px;
}

.p2p-alert-text {
    font-size: 12px;
    color: var(--text-2);
}

.p2p-alert-warning {
    background: rgba(251, 191, 36, 0.1);
    border-color: #fbbf24;
}

.p2p-alert-warning .p2p-alert-icon { color: #fbbf24; }

.p2p-alert-success {
    background: rgba(16, 185, 129, 0.1);
    border-color: #10b981;
}

.p2p-alert-success .p2p-alert-icon { color: #10b981; }

.p2p-alert-error {
    background: rgba(239, 68, 68, 0.1);
    border-color: #ef4444;
}

.p2p-alert-error .p2p-alert-icon { color: #ef4444; }

.p2p-alert-info {
    background: rgba(59, 130, 246, 0.1);
    border-color: #3b82f6;
}

.p2p-alert-info .p2p-alert-icon { color: #3b82f6; }

/* ========================================
   P2P Recording Modal
   ======================================== */
.p2p-modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.8);
    z-index: 1000;
    justify-content: center;
    align-items: center;
}

.p2p-modal-overlay.active {
    display: flex;
}

.p2p-modal {
    background: var(--bg-1);
    border: 1px solid var(--border);
    max-width: 480px;
    width: 90%;
    padding: 24px;
    text-align: center;
}

.p2p-modal-icon {
    font-size: 48px;
    margin-bottom: 16px;
}

.p2p-modal-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--text);
    margin-bottom: 12px;
}

.p2p-modal-text {
    font-size: 13px;
    color: var(--text-2);
    line-height: 1.6;
    margin-bottom: 20px;
}

.p2p-modal-btns {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.p2p-modal-confirm {
    padding: 14px;
    background: #ef4444;
    border: none;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.p2p-modal-cancel {
    padding: 12px;
    background: var(--bg-3);
    border: 1px solid var(--border);
    color: var(--text);
    font-size: 12px;
    cursor: pointer;
}

/* ========================================
   P2P Categories Sidebar
   ======================================== */
.p2p-categories {
    padding: 12px;
}

.p2p-cat-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    border: 1px solid transparent;
    cursor: pointer;
    margin-bottom: 4px;
    transition: all 0.2s;
}

.p2p-cat-item:hover,
.p2p-cat-item.active {
    background: var(--bg-3);
    border-color: var(--border);
}

.p2p-cat-item.active {
    border-color: var(--gold);
}

.p2p-cat-name {
    font-size: 12px;
    color: var(--text);
}

.p2p-cat-count {
    font-size: 11px;
    color: var(--text-2);
    background: var(--bg-2);
    padding: 2px 6px;
}

/* ========================================
   P2P Reviews
   ======================================== */
.p2p-review {
    padding: 16px;
    border-bottom: 1px solid var(--border);
}

.p2p-review:last-child {
    border-bottom: none;
}

.p2p-review-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}

.p2p-review-rating {
    color: #fbbf24;
    font-size: 14px;
}

.p2p-review-date {
    font-size: 11px;
    color: var(--text-2);
}

.p2p-review-text {
    font-size: 13px;
    color: var(--text);
    line-height: 1.5;
}

.p2p-review-reply {
    margin-top: 12px;
    padding: 12px;
    background: var(--bg-3);
    border-left: 2px solid var(--gold);
}

.p2p-review-reply-label {
    font-size: 10px;
    color: var(--gold);
    margin-bottom: 4px;
}

/* Review Item (seller profile style) */
.p2p-review-item {
    padding: 16px 20px;
    border-bottom: 1px solid var(--border);
    transition: background 0.15s;
}

.p2p-review-item:last-child {
    border-bottom: none;
}

.p2p-review-item:hover {
    background: var(--bg-2);
}

.p2p-review-item .p2p-review-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.p2p-review-badge {
    font-size: 9px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 3px;
    letter-spacing: 0.5px;
    line-height: 1;
    text-transform: uppercase;
}
.p2p-badge-vip {
    background: rgba(139, 92, 246, 0.15);
    color: #a78bfa;
    border: 1px solid rgba(139, 92, 246, 0.3);
}
.p2p-badge-gold {
    background: rgba(251, 191, 36, 0.15);
    color: #fbbf24;
    border: 1px solid rgba(251, 191, 36, 0.3);
}
.p2p-badge-user {
    background: rgba(148, 163, 184, 0.1);
    color: var(--text-2);
    border: 1px solid rgba(148, 163, 184, 0.2);
}

.p2p-review-stars {
    color: #fbbf24;
    font-size: 14px;
    letter-spacing: 2px;
}

.p2p-review-product {
    font-size: 11px;
    color: var(--text-3);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
    padding: 1px 6px;
    background: var(--bg-3);
    border-radius: 3px;
}

.p2p-review-date {
    margin-left: auto;
}

.p2p-review-item .p2p-review-text {
    font-size: 13px;
    color: var(--text);
    line-height: 1.6;
    padding-left: 2px;
}

/* Listings Grid (seller profile style) */
.p2p-listings-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 16px;
    padding: 16px;
}

.p2p-listings-grid .p2p-listing-card {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    border: 1px solid var(--border);
    background: var(--bg-2);
    transition: border-color 0.2s, transform 0.2s;
    overflow: hidden;
    min-width: 0;
}

.p2p-listings-grid .p2p-listing-badges {
    padding: 10px 12px 0;
}

.p2p-listings-grid .p2p-listing-title {
    padding: 0 12px;
    margin-top: 6px;
}

.p2p-listings-grid .p2p-listing-badges + .p2p-listing-title {
    margin-top: 0;
}

.p2p-listings-grid .p2p-listing-seller {
    padding: 4px 12px 8px;
}

.p2p-listings-grid .p2p-listing-card:hover {
    border-color: var(--gold);
    transform: translateY(-2px);
}

.p2p-listing-cat {
    font-size: 11px;
    color: var(--text-2);
    padding: 6px 12px 10px;
}

.p2p-listing-stock {
    font-size: 12px;
    color: var(--text-2);
    font-weight: 500;
}

/* Seller Rank Card (sidebar) */
.p2p-seller-rank-card {
    text-align: center;
    padding: 24px 16px;
}

.p2p-seller-rank-name {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 8px;
}

.p2p-seller-rank-fee {
    font-size: 12px;
    color: var(--text-2);
}

/* Seller Info List (sidebar) */
.p2p-seller-info-list {
    padding: 0;
}

.p2p-seller-info-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border);
    font-size: 13px;
}

.p2p-seller-info-row:last-child {
    border-bottom: none;
}

.p2p-seller-info-label {
    color: var(--text-2);
}

.p2p-seller-info-value {
    font-weight: 600;
    color: var(--text);
}

/* Seller Dispute Stats */
.p2p-seller-disputes {
    padding: 14px 16px;
    border-top: 1px solid var(--border);
}

.p2p-seller-disputes-title {
    font-size: 12px;
    font-weight: 600;
    color: var(--text-2);
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.p2p-seller-disputes-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.p2p-dispute-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px 6px;
    border-radius: 6px;
    background: var(--bg-2);
}

.p2p-dispute-stat-value {
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
}

.p2p-dispute-stat-label {
    font-size: 10px;
    color: var(--text-3);
    margin-top: 4px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.p2p-dispute-open .p2p-dispute-stat-value { color: #f59e0b; }
.p2p-dispute-won .p2p-dispute-stat-value { color: #10b981; }
.p2p-dispute-lost .p2p-dispute-stat-value { color: #ef4444; }

.p2p-dispute-open { border: 1px solid rgba(245, 158, 11, 0.2); }
.p2p-dispute-won { border: 1px solid rgba(16, 185, 129, 0.2); }
.p2p-dispute-lost { border: 1px solid rgba(239, 68, 68, 0.2); }

/* Seller Profile Section Divider */
.p2p-seller-section-title {
    font-size: 11px;
    font-weight: 600;
    color: var(--text-2);
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 12px 16px;
    background: var(--bg-3);
    border-bottom: 1px solid var(--border);
    margin: 0;
}

/* ========================================
   P2P Withdrawals
   ======================================== */
.p2p-withdrawal-form {
    max-width: 500px;
}

.p2p-balance-display {
    padding: 20px;
    background: var(--bg-3);
    border: 1px solid var(--border);
    text-align: center;
    margin-bottom: 20px;
}

.p2p-balance-label {
    font-size: 12px;
    color: var(--text-2);
    margin-bottom: 4px;
}

.p2p-balance-value {
    font-size: 32px;
    font-weight: 700;
    color: #10b981;
}

.p2p-crypto-options {
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
}

.p2p-crypto-option {
    flex: 1;
    padding: 12px;
    background: var(--bg-2);
    border: 2px solid var(--border);
    text-align: center;
    cursor: pointer;
    transition: border-color 0.2s;
}

.p2p-crypto-option:hover {
    border-color: var(--text-2);
}

.p2p-crypto-option.selected {
    border-color: var(--gold);
    background: var(--bg-3);
}

.p2p-crypto-option input {
    display: none;
}

/* ========================================
   P2P Empty States
   ======================================== */
.p2p-empty {
    padding: 60px 20px;
    text-align: center;
}

.p2p-empty-icon {
    font-size: 48px;
    margin-bottom: 16px;
    opacity: 0.5;
}

.p2p-empty-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--text);
    margin-bottom: 8px;
}

.p2p-empty-text {
    font-size: 13px;
    color: var(--text-2);
    margin-bottom: 20px;
}

/* ========================================
   P2P Pagination
   ======================================== */
.p2p-pagination {
    display: flex;
    justify-content: center;
    padding: 20px 0 4px;
}

.p2p-pagination nav { display: flex; }

.p2p-pagination .pagination {
    display: flex;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.p2p-pagination .page-item .page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 10px;
    background: var(--bg-2);
    border: 1px solid var(--border);
    border-radius: 6px;
    color: var(--text-2);
    font-size: 12px;
    text-decoration: none;
    transition: all 0.18s;
}

.p2p-pagination .page-item .page-link:hover {
    border-color: var(--gold);
    color: var(--gold);
}

.p2p-pagination .page-item.active .page-link {
    background: var(--gold);
    border-color: var(--gold);
    color: #000;
    font-weight: 600;
}

.p2p-pagination .page-item.disabled .page-link {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}

.p2p-page-link {
    padding: 8px 12px;
    background: var(--bg-2);
    border: 1px solid var(--border);
    color: var(--text);
    font-size: 12px;
    text-decoration: none;
}

.p2p-page-link:hover {
    border-color: var(--gold);
}

.p2p-page-link.active {
    background: var(--gold);
    border-color: var(--gold);
    color: #000;
}

.p2p-page-link.disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ========================================
   Light Theme Overrides
   ======================================== */
body.light-theme .p2p-stat { background: #f9fafb; }
body.light-theme .p2p-listing-card { background: #fff; }
body.light-theme .p2p-listing-footer { background: #f3f4f6; }
body.light-theme .p2p-panel { background: #fff; }
body.light-theme .p2p-panel-head { background: #f9fafb; }
body.light-theme .p2p-seller-card { background: #fff; }
body.light-theme .p2p-dash-card { background: #fff; }
body.light-theme .p2p-table-row:hover { background: #f9fafb; }
body.light-theme .p2p-form-input,
body.light-theme .p2p-form-textarea,
body.light-theme .p2p-form-select { background: #fff; }
body.light-theme .p2p-modal { background: #fff; }
body.light-theme .p2p-view-price-box { background: #f3f4f6; }
body.light-theme .p2p-cat-item:hover,
body.light-theme .p2p-cat-item.active { background: #f3f4f6; }
body.light-theme .p2p-crypto-option { background: #fff; }
body.light-theme .p2p-crypto-option.selected { background: #f3f4f6; }
body.light-theme .p2p-balance-display { background: #f3f4f6; }
body.light-theme .p2p-review-reply { background: #f3f4f6; }
body.light-theme .p2p-page-link { background: #fff; }
body.light-theme .p2p-stat-item { background: #fff; }
body.light-theme .p2p-seller-badge { background: #f3f4f6; border-color: #e5e7eb; }
body.light-theme .p2p-review-item:hover { background: #f9fafb; }
body.light-theme .p2p-badge-vip { background: rgba(139, 92, 246, 0.1); color: #7c3aed; border-color: rgba(139, 92, 246, 0.25); }
body.light-theme .p2p-badge-gold { background: rgba(217, 159, 16, 0.1); color: #b45309; border-color: rgba(217, 159, 16, 0.25); }
body.light-theme .p2p-badge-user { background: rgba(100, 116, 139, 0.08); color: #64748b; border-color: rgba(100, 116, 139, 0.2); }
body.light-theme .p2p-dispute-stat { background: #f9fafb; }
body.light-theme .p2p-listings-grid .p2p-listing-card { background: #fff; }
body.light-theme .p2p-seller-rank { background: #f3f4f6; border-color: #e5e7eb; }
body.light-theme .p2p-seller-section-title { background: #f3f4f6; }

/* ========================================
   Responsive - Tablet (768px - 1199px)
   ======================================== */
@media (max-width: 1200px) {
    .p2p-grid {
        grid-template-columns: 1fr 250px;
    }
    
    .p2p-stats {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .p2p-dashboard-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .p2p-table-head,
    .p2p-table-row {
        grid-template-columns: 60px 1fr 80px 80px;
    }
    
    .p2p-table-head > *:nth-child(4),
    .p2p-table-row > *:nth-child(4) {
        display: none;
    }
    
    .p2p-table-head > *:nth-child(5),
    .p2p-table-row > *:nth-child(5) {
        display: none;
    }
}

/* ========================================
   Responsive - Mobile (480px - 767px)
   ======================================== */
@media (max-width: 768px) {
    .p2p-grid {
        grid-template-columns: 1fr;
    }
    
    .p2p-toolbar {
        flex-direction: column;
    }
    
    .p2p-search-form {
        width: 100%;
    }
    
    .p2p-nav-links {
        width: 100%;
        justify-content: center;
    }
    
    .p2p-listings {
        grid-template-columns: 1fr;
    }
    
    .p2p-dashboard-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .p2p-table-head {
        display: none;
    }
    
    .p2p-table-row {
        display: flex;
        flex-direction: column;
        gap: 8px;
        padding: 16px;
    }
    
    .p2p-seller-stats {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .p2p-crypto-options {
        flex-direction: column;
    }
    
    .p2p-view-price-box {
        flex-direction: column;
        text-align: center;
        gap: 12px;
    }
}

/* ========================================
   P2P Admin Navigation
   ======================================== */
.p2p-admin-nav {
    display: flex;
    gap: 4px;
    padding: 8px;
    background: var(--bg-2);
    border: 1px solid var(--border);
    margin-bottom: 16px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.p2p-admin-nav::-webkit-scrollbar {
    display: none;
}

.p2p-admin-nav-link {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: var(--bg-3);
    border: 1px solid var(--border);
    color: var(--text-2);
    font-size: 12px;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    transition: all 0.15s ease;
}

.p2p-admin-nav-link:hover {
    background: var(--bg-1);
    color: var(--text);
    border-color: var(--gold);
}

.p2p-admin-nav-link.active {
    background: var(--gold);
    border-color: var(--gold);
    color: #000;
    font-weight: 600;
}

.p2p-admin-nav-icon {
    font-size: 14px;
    line-height: 1;
}

body.light-theme .p2p-admin-nav {
    background: #f8f9fa;
    border-color: #dee2e6;
}

body.light-theme .p2p-admin-nav-link {
    background: #fff;
    border-color: #dee2e6;
    color: #6c757d;
}

body.light-theme .p2p-admin-nav-link:hover {
    background: #f0f0f0;
    color: #333;
}

body.light-theme .p2p-admin-nav-link.active {
    background: var(--gold);
    border-color: var(--gold);
    color: #000;
}

/* ========================================
   P2P Rules & FAQ Page
   ======================================== */
.p2p-rules-nav {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
}

.p2p-rules-back {
    color: var(--text-2);
    text-decoration: none;
    font-size: 13px;
    transition: color 0.15s;
}

.p2p-rules-back:hover {
    color: var(--gold);
}

.p2p-rules-heading {
    font-size: 18px;
    font-weight: 700;
    color: var(--text);
}

.p2p-rules-grid {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 20px;
}

.p2p-rules-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.p2p-rule-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
    font-size: 13px;
    line-height: 1.6;
    color: var(--text);
}

.p2p-rule-item:last-child {
    border-bottom: none;
}

.p2p-rule-num {
    min-width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--bg-3);
    border: 1px solid var(--border);
    color: var(--gold);
    font-size: 11px;
    font-weight: 700;
    flex-shrink: 0;
}

.p2p-rank-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    margin-bottom: 8px;
    background: var(--bg-3);
    border: 1px solid var(--border);
}

.p2p-rank-row:last-child {
    margin-bottom: 0;
}

.p2p-rank-name {
    font-weight: 700;
    font-size: 13px;
    min-width: 80px;
    white-space: nowrap;
}

.p2p-rank-details {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 11px;
}

.p2p-rank-tag {
    padding: 2px 8px;
    background: var(--bg-1);
    border: 1px solid var(--border);
    color: var(--text-2);
    font-size: 11px;
    white-space: nowrap;
}

body.light-theme .p2p-rank-row {
    background: #f8f9fa;
    border-color: #dee2e6;
}

body.light-theme .p2p-rank-tag {
    background: #fff;
    border-color: #dee2e6;
}

.p2p-faq-list {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.p2p-faq-item {
    padding: 10px 0;
    border-bottom: 1px solid var(--border);
}

.p2p-faq-item:last-child {
    border-bottom: none;
}

.p2p-faq-q {
    font-weight: 700;
    font-size: 13px;
    color: var(--gold);
    margin-bottom: 4px;
}

.p2p-faq-a {
    font-size: 12px;
    color: var(--text-2);
    line-height: 1.6;
}

body.light-theme .p2p-rule-num {
    background: #f0f0f0;
    border-color: #dee2e6;
    color: #b8860b;
}

body.light-theme .p2p-faq-q {
    color: #b8860b;
}

@media (max-width: 768px) {
    .p2p-rules-grid {
        grid-template-columns: 1fr;
    }
}

/* ========================================
   Responsive - Small Mobile (<480px)
   ======================================== */
@media (max-width: 480px) {
    .p2p-stats,
    .p2p-stats-bar {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .p2p-dashboard-grid {
        grid-template-columns: 1fr;
    }
    
    .p2p-nav-links {
        flex-direction: column;
    }
    
    .p2p-nav-link {
        text-align: center;
    }
    
    .p2p-seller-stats {
        grid-template-columns: 1fr;
    }
    
    .p2p-seller-badges {
        flex-direction: column;
    }
    
    .p2p-seller-badge {
        justify-content: center;
    }
    
    .p2p-modal {
        padding: 16px;
    }
    
    .p2p-view-title {
        font-size: 16px;
    }
    
    .p2p-view-price {
        font-size: 24px;
    }
    
    .p2p-balance-value {
        font-size: 24px;
    }
}

/* ========================================
   Homepage P2P Marketplace Block
   ======================================== */
.panel-p2p {
    position: relative;
    border-color: rgba(139, 92, 246, 0.22);
    background: var(--bg-1);
    margin-bottom: 20px;
    border-left: 2px solid #8b5cf6;
}

.panel-p2p::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 140px;
    height: 2px;
    background: linear-gradient(90deg, #8b5cf6 0%, rgba(139, 92, 246, 0) 100%);
    pointer-events: none;
}

.panel-head-dot-purple {
    width: 7px;
    height: 7px;
    background: #8b5cf6;
    border-radius: 50%;
    box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.55);
    animation: p2p-pulse-dot 2.2s ease-out infinite;
    flex-shrink: 0;
}

@keyframes p2p-pulse-dot {
    0%   { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0.55); }
    70%  { box-shadow: 0 0 0 7px rgba(139, 92, 246, 0); }
    100% { box-shadow: 0 0 0 0 rgba(139, 92, 246, 0); }
}

.panel-head-title-purple {
    color: #8b5cf6 !important;
}

.panel-head-badge-purple {
    background: rgba(139, 92, 246, 0.12);
    color: #a78bfa;
    border: 1px solid rgba(139, 92, 246, 0.35);
    font-size: 10px;
    padding: 2px 7px;
    font-weight: 700;
    font-family: 'Anonymous Pro', monospace;
    text-transform: uppercase;
}

.panel-head-badge-purple-outline {
    background: transparent;
    color: #a78bfa;
    border: 1px solid rgba(139, 92, 246, 0.4);
    font-size: 10px;
    padding: 2px 7px;
    font-weight: 700;
    font-family: 'Anonymous Pro', monospace;
    text-transform: uppercase;
}

.panel-head-badge-pink {
    background: rgba(236, 72, 153, 0.08);
    color: #f472b6;
    border: 1px solid rgba(236, 72, 153, 0.35);
    font-size: 10px;
    padding: 2px 7px;
    font-weight: 700;
    font-family: 'Anonymous Pro', monospace;
    text-transform: uppercase;
}

.p2p-prod-head {
    display: grid;
    grid-template-columns: 80px 1fr 100px 50px 55px 70px 85px;
    gap: 10px;
    padding: 8px 16px;
    background: var(--bg-2);
    border-bottom: 1px solid var(--border);
    font-size: 9px;
    color: var(--text-3);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.p2p-prod-head span:nth-child(4),
.p2p-prod-head span:nth-child(5) {
    text-align: center;
}

.p2p-prod-head span:nth-child(6) {
    text-align: right;
}

.p2p-prod, .prod.p2p-prod-row {
    display: grid;
    grid-template-columns: 80px 1fr 100px 50px 55px 70px 85px;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border);
    align-items: center;
    border-left: 2px solid transparent;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.p2p-prod:last-child, .prod.p2p-prod-row:last-child {
    border-bottom: none;
}

.p2p-prod:hover, .prod.p2p-prod-row:hover {
    background: linear-gradient(90deg, rgba(139, 92, 246, 0.025) 0%, transparent 100%) !important;
    border-left-color: #8b5cf6 !important;
    transform: translateX(2px) !important;
}

.p2p-prod-fresh, .prod.p2p-prod-row.p2p-prod-fresh {
    border-left: 2px solid #c084fc !important;
    background: rgba(139, 92, 246, 0.02) !important;
}

.p2p-badge-fresh {
    display: inline-block;
    font-family: 'Anonymous Pro', monospace;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.5px;
    padding: 1px 4px;
    background: rgba(139, 92, 246, 0.15);
    border: 1px solid rgba(139, 92, 246, 0.4);
    color: #c084fc;
    margin-left: 6px;
    vertical-align: middle;
    line-height: 1;
}

.p2p-mob-fresh {
    color: #c084fc;
    font-weight: 700;
    font-family: 'Anonymous Pro', monospace;
}

.p2p-prod-item {
    min-width: 0;
}

.p2p-prod-name {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.p2p-prod-type {
    font-size: 8px;
    font-weight: 700;
    padding: 2px 6px;
    background: rgba(139, 92, 246, 0.12);
    color: #a78bfa;
    text-transform: uppercase;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: 1px solid rgba(139, 92, 246, 0.25);
    line-height: 1;
}

.p2p-prod-stock {
    font-size: 11px;
    font-weight: 700;
    text-align: center;
}

.p2p-prod-stock.ok {
    color: var(--green);
}

.p2p-prod-stock.low {
    color: var(--red);
}

.p2p-prod-time {
    font-size: 10px;
    color: var(--text-3);
    text-align: center;
}

.p2p-prod-price {
    font-size: 11.5px;
    font-weight: 700;
    color: var(--green);
    text-align: right;
}

.p2p-prod-seller-info {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.p2p-prod-seller-name {
    font-size: 11px;
    font-weight: 700;
    color: var(--text-1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.p2p-prod-seller-rating {
    font-size: 9px;
    font-weight: 700;
    color: var(--gold);
}

/* Homepage block button - scoped to .panel-p2p to avoid conflicts */
.panel-p2p .p2p-buy-btn {
    height: 24px;
    padding: 0 12px;
    background: #8b5cf6;
    border: none;
    color: #fff !important;
    font-size: 9px;
    font-weight: 700;
    cursor: pointer;
    font-family: 'Anonymous Pro', monospace;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: background 0.15s ease;
    white-space: nowrap;
    letter-spacing: 0.5px;
    width: auto;
}

.panel-p2p .p2p-buy-btn:hover {
    background: #7c3aed;
    color: #fff !important;
    text-decoration: none;
}

.p2p-btn-sold {
    height: 24px;
    padding: 0 10px;
    background: var(--bg-3);
    border: 1px solid var(--border);
    color: var(--text-3);
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: not-allowed;
    white-space: nowrap;
    font-family: 'Anonymous Pro', monospace;
    letter-spacing: 0.5px;
}

.p2p-empty {
    padding: 20px;
    text-align: center;
    color: var(--text-3);
    font-size: 11px;
    font-family: 'Anonymous Pro', monospace;
}

.p2p-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 14px;
    background: var(--bg-2);
    border-top: 1px solid var(--border);
    font-size: 10.5px;
    color: #a78bfa;
    text-decoration: none;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-family: 'Anonymous Pro', monospace;
    transition: background 0.2s ease;
}

.p2p-footer:hover {
    background: var(--bg-3);
    color: #c084fc;
    text-decoration: none;
}

.p2p-footer-arrow {
    transition: transform 0.2s ease;
}

.p2p-footer:hover .p2p-footer-arrow {
    transform: translateX(4px);
}

.p2p-meta-mobile {
    display: none;
}

/* Light Theme */
body.light-theme .panel-p2p {
    border-color: rgba(124, 58, 237, 0.3);
    background: #fff;
    border-left-color: #7c3aed;
}

body.light-theme .panel-p2p::before {
    background: linear-gradient(90deg, #7c3aed 0%, rgba(124, 58, 237, 0) 100%);
}

body.light-theme .panel-head-dot-purple {
    background: #7c3aed;
    box-shadow: 0 0 0 0 rgba(124, 58, 237, 0.55);
}

body.light-theme .panel-head-title-purple {
    color: #7c3aed !important;
}

body.light-theme .panel-head-badge-purple {
    background: rgba(124, 58, 237, 0.1);
    color: #6d28d9;
    border-color: rgba(124, 58, 237, 0.3);
}

body.light-theme .panel-head-badge-purple-outline {
    color: #6d28d9;
    border-color: rgba(124, 58, 237, 0.4);
}

body.light-theme .panel-head-badge-pink {
    background: rgba(219, 39, 119, 0.06);
    color: #db2777;
    border-color: rgba(219, 39, 119, 0.25);
}

body.light-theme .p2p-prod:hover, body.light-theme .prod.p2p-prod-row:hover {
    background: rgba(124, 58, 237, 0.05) !important;
    border-left-color: #7c3aed !important;
}

body.light-theme .p2p-prod-fresh, body.light-theme .prod.p2p-prod-row.p2p-prod-fresh {
    border-left-color: #7c3aed !important;
    background: rgba(124, 58, 237, 0.03) !important;
}

body.light-theme .p2p-badge-fresh {
    background: rgba(124, 58, 237, 0.08);
    border-color: rgba(124, 58, 237, 0.3);
    color: #6d28d9;
}

body.light-theme .p2p-mob-fresh {
    color: #6d28d9;
}

body.light-theme .p2p-prod-type {
    background: rgba(124, 58, 237, 0.08);
    color: #6d28d9;
    border-color: rgba(124, 58, 237, 0.2);
}

body.light-theme .panel-p2p .p2p-buy-btn {
    background: #7c3aed;
    color: #fff !important;
}

body.light-theme .panel-p2p .p2p-buy-btn:hover {
    background: #6d28d9;
}

body.light-theme .p2p-footer {
    background: #fafafa;
    color: #6d28d9;
}

body.light-theme .p2p-footer:hover {
    background: #f4f4f5;
    color: #5b21b6;
}

/* Mobile */
@media (max-width: 768px) {
    .p2p-prod-head {
        display: none;
    }

    .p2p-prod, .prod.p2p-prod-row {
        display: block !important;
        padding: 10px !important;
        min-width: 0;
        overflow: hidden;
    }

    .p2p-prod-seller-info {
        display: none;
    }

    .p2p-prod-item {
        display: block;
        width: 100%;
        margin-bottom: 4px;
    }

    .p2p-prod-name {
        white-space: normal;
        word-break: break-word;
        font-size: 12.5px;
        font-weight: 500;
    }

    .p2p-prod-type,
    .p2p-prod-stock,
    .p2p-prod-time,
    .p2p-prod-price {
        display: none;
    }

    .p2p-meta-mobile {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 4px 6px;
        font-size: 11px;
        color: var(--text-2);
        margin-bottom: 8px;
    }

    .p2p-meta-mobile .sep {
        color: var(--text-3);
        margin: 0;
    }

    .p2p-meta-mobile .price {
        color: var(--green);
        font-weight: 600;
    }

    .panel-p2p .p2p-buy-btn,
    .panel-combined .p2p-buy-btn,
    .p2p-btn-sold {
        display: block;
        width: 100%;
        text-align: center;
        padding: 8px 12px;
        height: auto;
    }
}

/* ========================================
   Combined Products Panel (Modern Glow Theme)
   ======================================== */
.panel-combined {
    position: relative;
    background: linear-gradient(135deg, var(--bg-1) 0%, rgba(255,255,255,0.01) 100%) !important;
    margin-bottom: 20px;
    border: 1px solid var(--border);
    border-radius: 4px !important;
    transition: all 0.3s ease;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2) !important;
}

/* Base border left color and subtle box shadow */
.panel-combined.tab-accounts-active { border-left: 3px solid #10b981 !important; box-shadow: 0 0 14px rgba(16, 185, 129, 0.1), 0 4px 20px rgba(0,0,0,0.2) !important; }
.panel-combined.tab-p2p-active { border-left: 3px solid #a78bfa !important; box-shadow: 0 0 14px rgba(167, 139, 250, 0.1), 0 4px 20px rgba(0,0,0,0.2) !important; }
.panel-combined.tab-cc-active { border-left: 3px solid #f59e0b !important; box-shadow: 0 0 14px rgba(245, 158, 11, 0.1), 0 4px 20px rgba(0,0,0,0.2) !important; }
.panel-combined.tab-ssn-active { border-left: 3px solid #3b82f6 !important; box-shadow: 0 0 14px rgba(59, 130, 246, 0.1), 0 4px 20px rgba(0,0,0,0.2) !important; }

/* Ambient background glow depending on active tab */
.panel-combined::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; height: 200px;
    pointer-events: none;
    z-index: 0;
    transition: background 0.4s ease;
}
.panel-combined.tab-accounts-active::before { background: radial-gradient(ellipse at 15% 0%, rgba(16, 185, 129, 0.12), transparent 70%); }
.panel-combined.tab-p2p-active::before { background: radial-gradient(ellipse at 40% 0%, rgba(167, 139, 250, 0.12), transparent 70%); }
.panel-combined.tab-cc-active::before { background: radial-gradient(ellipse at 65% 0%, rgba(245, 158, 11, 0.12), transparent 70%); }
.panel-combined.tab-ssn-active::before { background: radial-gradient(ellipse at 90% 0%, rgba(59, 130, 246, 0.12), transparent 70%); }

/* Make sure content stays above the background glow */
.panel-combined .combined-tab-content {
    position: relative;
    z-index: 1;
}

/* Header housing the tabs and meta info */
.combined-tabs-header {
    display: flex;
    background: transparent;
    padding: 8px 12px 0 0;
    gap: 6px;
    border-bottom: 1px solid var(--border);
    user-select: none;
    align-items: center;
    position: relative;
    z-index: 2;
    overflow-x: auto;
    scrollbar-width: none;
}
.combined-tabs-header::-webkit-scrollbar { display: none; }

/* The tabs themselves (Capsule style) */
.combined-tab-btn {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 10px 16px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    font-family: inherit !important;
    letter-spacing: 0.3px !important;
    color: var(--text-3) !important;
    cursor: pointer;
    background: transparent !important;
    border: 1px solid transparent !important;
    border-bottom: none !important;
    border-radius: 6px 6px 0 0 !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    position: relative;
    white-space: nowrap;
    text-transform: none !important;
}

.combined-tab-btn:hover {
    color: var(--text);
    background: rgba(255, 255, 255, 0.02);
}

/* Active tab top glowing indicator line */
.combined-tab-btn::after {
    content: '';
    position: absolute;
    top: -1px; left: -1px; right: -1px; height: 2px;
    border-radius: 6px 6px 0 0;
    opacity: 0;
    transition: opacity 0.3s ease;
}

/* Active states for each tab - colored text + glowing top line */
.panel-combined.tab-accounts-active .combined-tab-btn.tab-accounts,
.panel-combined.tab-p2p-active .combined-tab-btn.tab-p2p,
.panel-combined.tab-cc-active .combined-tab-btn.tab-cc,
.panel-combined.tab-ssn-active .combined-tab-btn.tab-ssn {
    background: var(--bg-2) !important;
    border-color: var(--border) !important;
    border-bottom-color: transparent !important;
}

/* Colored text for each active tab */
.panel-combined.tab-accounts-active .combined-tab-btn.tab-accounts { color: #10b981 !important; }
.panel-combined.tab-p2p-active .combined-tab-btn.tab-p2p { color: #a78bfa !important; }
.panel-combined.tab-cc-active .combined-tab-btn.tab-cc { color: #fbbf24 !important; }
.panel-combined.tab-ssn-active .combined-tab-btn.tab-ssn { color: #60a5fa !important; }

.panel-combined.tab-accounts-active .combined-tab-btn.tab-accounts::after { background: #10b981; opacity: 1; box-shadow: 0 0 10px rgba(16, 185, 129, 0.6); }
.panel-combined.tab-p2p-active .combined-tab-btn.tab-p2p::after { background: #a78bfa; opacity: 1; box-shadow: 0 0 10px rgba(167, 139, 250, 0.6); }
.panel-combined.tab-cc-active .combined-tab-btn.tab-cc::after { background: #f59e0b; opacity: 1; box-shadow: 0 0 10px rgba(245, 158, 11, 0.6); }
.panel-combined.tab-ssn-active .combined-tab-btn.tab-ssn::after { background: #3b82f6; opacity: 1; box-shadow: 0 0 10px rgba(59, 130, 246, 0.6); }

/* Dots inside tabs */
.tab-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    opacity: 0.5;
    transition: all 0.3s ease;
}
.combined-tab-btn:hover .tab-dot { opacity: 0.9; }

.tab-dot-green { background: #10b981; }
.tab-dot-purple { background: #a78bfa; }
.tab-dot-amber { background: #f59e0b; }
.tab-dot-blue { background: #3b82f6; }

@keyframes tab-dot-glow {
    0%, 100% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.3); opacity: 0.8; }
}

.panel-combined.tab-accounts-active .combined-tab-btn.tab-accounts .tab-dot-green,
.panel-combined.tab-p2p-active .combined-tab-btn.tab-p2p .tab-dot-purple,
.panel-combined.tab-cc-active .combined-tab-btn.tab-cc .tab-dot-amber,
.panel-combined.tab-ssn-active .combined-tab-btn.tab-ssn .tab-dot-blue {
    opacity: 1;
    animation: tab-dot-glow 2s infinite;
}

.panel-combined.tab-accounts-active .combined-tab-btn.tab-accounts .tab-dot-green { box-shadow: 0 0 8px #10b981; }
.panel-combined.tab-p2p-active .combined-tab-btn.tab-p2p .tab-dot-purple { box-shadow: 0 0 8px #a78bfa; }
.panel-combined.tab-cc-active .combined-tab-btn.tab-cc .tab-dot-amber { box-shadow: 0 0 8px #f59e0b; }
.panel-combined.tab-ssn-active .combined-tab-btn.tab-ssn .tab-dot-blue { box-shadow: 0 0 8px #3b82f6; }

/* Fresh indicator next to P2P Tab name */
.tab-badge-fresh {
    font-size: 8px;
    font-weight: 700;
    padding: 1px 4px;
    background: rgba(139, 92, 246, 0.15);
    border: 1px solid rgba(139, 92, 246, 0.4);
    color: #c084fc;
    animation: p2p-pulse-badge 1.8s ease-in-out infinite;
    line-height: 1;
}

@keyframes p2p-pulse-badge {
    0%   { opacity: 0.85; }
    50%  { opacity: 0.4; }
    100% { opacity: 0.85; }
}

/* Meta stats on the right of tabs */
.combined-tab-meta {
    margin-left: auto;
    display: flex;
    align-items: center;
    padding-right: 16px;
    gap: 12px;
}

.combined-meta-section {
    display: none;
    align-items: center;
    gap: 12px;
}

.combined-meta-section.active {
    display: flex;
}

.combined-meta-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 24px;
    padding: 0 10px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.02);
    color: #e4e4e7;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.combined-meta-link:hover {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.18);
    background: rgba(255, 255, 255, 0.06);
    text-decoration: none;
}

/* Content visibility */
.combined-tab-content {
    display: none;
}
.combined-tab-content.active {
    display: block;
}

.panel-combined .p2p-buy-btn {
    height: 24px;
    padding: 0 12px;
    background: rgba(139, 92, 246, 0.06) !important;
    border: 1px solid rgba(139, 92, 246, 0.3) !important;
    color: #a78bfa !important;
    font-size: 9px;
    font-weight: 700;
    cursor: pointer;
    font-family: 'Anonymous Pro', monospace;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.2s ease !important;
    white-space: nowrap;
    letter-spacing: 0.5px;
    width: auto;
    box-shadow: none !important;
    border-radius: 0;
}

.panel-combined .p2p-buy-btn:hover {
    background: #8b5cf6 !important;
    color: #fff !important;
    border-color: #8b5cf6 !important;
    box-shadow: 0 0 10px rgba(139, 92, 246, 0.35) !important;
    text-decoration: none;
}

/* Light Theme overrides for combined block */
body.light-theme .panel-combined {
    background: #fff;
    border-color: rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
}
body.light-theme .panel-combined.tab-accounts-active { border-left-color: #059669; }
body.light-theme .panel-combined.tab-p2p-active { border-left-color: #7c3aed; }
body.light-theme .panel-combined.tab-cc-active { border-left-color: #d97706; }
body.light-theme .panel-combined.tab-ssn-active { border-left-color: #2563eb; }

/* Subtle background glows for light theme */
body.light-theme .panel-combined.tab-accounts-active::before { background: radial-gradient(ellipse at 15% -20%, rgba(16, 185, 129, 0.05), transparent 70%); }
body.light-theme .panel-combined.tab-p2p-active::before { background: radial-gradient(ellipse at 40% -20%, rgba(167, 139, 250, 0.05), transparent 70%); }
body.light-theme .panel-combined.tab-cc-active::before { background: radial-gradient(ellipse at 65% -20%, rgba(245, 158, 11, 0.05), transparent 70%); }
body.light-theme .panel-combined.tab-ssn-active::before { background: radial-gradient(ellipse at 90% -20%, rgba(59, 130, 246, 0.05), transparent 70%); }

body.light-theme .combined-tabs-header {
    background: #fdfdfc;
    border-bottom-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .combined-tab-btn {
    background: transparent;
    border: 1px solid transparent;
    border-bottom: none;
    color: #71717a;
    padding: 10px 16px;
}
body.light-theme .combined-tab-btn:hover {
    color: #18181b;
    background: rgba(0, 0, 0, 0.02);
    border-color: transparent;
}
body.light-theme .panel-combined.tab-accounts-active .combined-tab-btn.tab-accounts,
body.light-theme .panel-combined.tab-p2p-active .combined-tab-btn.tab-p2p,
body.light-theme .panel-combined.tab-cc-active .combined-tab-btn.tab-cc,
body.light-theme .panel-combined.tab-ssn-active .combined-tab-btn.tab-ssn {
    color: #18181b;
    background: #fff;
    border-color: rgba(0, 0, 0, 0.06);
    border-bottom-color: #fff;
    text-shadow: none;
    box-shadow: 0 -2px 8px rgba(0,0,0,0.02);
}
body.light-theme .combined-meta-link {
    background: rgba(0, 0, 0, 0.03);
    border-color: rgba(0, 0, 0, 0.08);
    color: #52525b;
}
body.light-theme .combined-meta-link:hover {
    background: rgba(0, 0, 0, 0.06);
    color: #18181b;
}

/* ========================================
   Auctions Tab (red) — Latest Inventory
   ======================================== */
.tab-dot-red { background: #ef4444; }

.panel-combined.tab-auctions-active {
    border-left: 3px solid #ef4444 !important;
    box-shadow: 0 0 14px rgba(239, 68, 68, 0.1), 0 4px 20px rgba(0,0,0,0.2) !important;
}
.panel-combined.tab-auctions-active::before {
    background: radial-gradient(ellipse at 5% 0%, rgba(239, 68, 68, 0.12), transparent 70%);
}

.panel-combined.tab-auctions-active .combined-tab-btn.tab-auctions {
    color: #f87171 !important;
    background: rgba(239, 68, 68, 0.06) !important;
    border-color: rgba(239, 68, 68, 0.15) !important;
}
.panel-combined.tab-auctions-active .combined-tab-btn.tab-auctions::after {
    background: #ef4444;
    opacity: 1;
    box-shadow: 0 0 10px rgba(239, 68, 68, 0.6);
}
.panel-combined.tab-auctions-active .combined-tab-btn.tab-auctions .tab-dot-red {
    opacity: 1;
    animation: tab-dot-glow 2s infinite;
    box-shadow: 0 0 8px #ef4444;
}

/* LIVE badge next to Auctions tab name */
.tab-badge-live {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 8px;
    font-weight: 800;
    padding: 1px 5px;
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.4);
    color: #f87171;
    border-radius: 3px;
    line-height: 1;
    letter-spacing: 0.5px;
    animation: p2p-pulse-badge 1.8s ease-in-out infinite;
}

/* Red meta badges */
.panel-head-badge-red {
    border-color: rgba(239, 68, 68, 0.35);
    color: #f87171;
    background: rgba(239, 68, 68, 0.07);
}
.panel-head-badge-red-outline {
    border-color: rgba(239, 68, 68, 0.3);
    color: #f87171;
    background: transparent;
}

/* Light theme overrides for auctions tab */
body.light-theme .panel-combined.tab-auctions-active {
    border-left-color: #dc2626;
}
body.light-theme .panel-combined.tab-auctions-active::before {
    background: radial-gradient(ellipse at 5% -20%, rgba(239, 68, 68, 0.05), transparent 70%);
}
body.light-theme .panel-combined.tab-auctions-active .combined-tab-btn.tab-auctions {
    color: #b91c1c;
    background: #fff;
    border-color: rgba(0, 0, 0, 0.06);
    border-bottom-color: #fff;
    text-shadow: none;
    box-shadow: 0 -2px 8px rgba(0,0,0,0.02);
}
body.light-theme .tab-badge-live {
    color: #dc2626;
    background: rgba(220, 38, 38, 0.08);
    border-color: rgba(220, 38, 38, 0.3);
}
body.light-theme .panel-head-badge-red {
    border-color: rgba(220, 38, 38, 0.3);
    color: #dc2626;
    background: rgba(220, 38, 38, 0.06);
}
body.light-theme .panel-head-badge-red-outline {
    color: #dc2626;
    border-color: rgba(220, 38, 38, 0.35);
}

/* ========================================
   Auctions Inventory Grid (Latest Inventory tab)
   ======================================== */
.prod-head.auctions-inv-grid,
.prod.auctions-inv-grid {
    width: 100%;
    grid-template-columns: 80px 1fr 100px 50px 55px 95px 85px;
    gap: 10px;
    align-items: center;
}

.prod-head.auctions-inv-grid {
    padding: 8px 16px;
    background: var(--bg-2);
    border-bottom: 1px solid var(--border);
    font-size: 9px;
    font-weight: 700;
    color: var(--text-3);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-top: none;
    white-space: nowrap;
}

.prod-head.auctions-inv-grid .prod-col-qty { text-align: center; }
.prod-head.auctions-inv-grid .prod-col-added { text-align: center; }
.prod-head.auctions-inv-grid .prod-col-price { text-align: right; padding-right: 15px; }

.prod.auctions-inv-grid {
    padding: 12px 16px;
    border-bottom: 1px solid var(--border);
    transition: background 0.15s, box-shadow 0.15s;
    border-left: none;
}

.prod.auctions-inv-grid:hover {
    box-shadow: inset 3px 0 0 var(--gold);
    background: transparent;
}

.prod.auctions-inv-grid .prod-item {
    min-width: 0;
    overflow: hidden;
}

.prod.auctions-inv-grid .prod-name {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11.5px;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.prod.auctions-inv-grid .prod-name .auc-badge-blitz {
    flex-shrink: 0;
}

.prod.auctions-inv-grid .prod-sub {
    font-size: 10.5px;
    color: var(--text-3);
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    opacity: 0.85;
}

.prod.auctions-inv-grid .prod-stock {
    justify-self: center;
    font-size: 12px;
    font-weight: 700;
    text-align: center;
    color: var(--text-3);
    transition: color 0.15s ease;
}

.prod.auctions-inv-grid.has-bids {
    background: rgba(16, 185, 129, 0.035);
    border-left-color: #10b981;
}

.prod.auctions-inv-grid.has-bids:hover {
    background: rgba(16, 185, 129, 0.06);
    box-shadow: inset 3px 0 0 #10b981;
}

.prod.auctions-inv-grid.has-bids .prod-stock {
    color: #10b981;
}

.prod.auctions-inv-grid .prod-time {
    justify-self: center;
    font-size: 10px;
    color: var(--text-3);
    text-align: center;
    white-space: nowrap;
}

.prod.auctions-inv-grid .prod-price {
    font-size: 13px;
    font-weight: 700;
    color: var(--green);
    text-align: right;
    padding-right: 0;
}

.prod-buy-auction {
    font-size: 9px;
    font-weight: 700;
    padding: 6px 14px;
    border-radius: 4px;
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    color: #ffffff !important;
    border: none;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    text-decoration: none;
    box-shadow: 0 2px 6px rgba(16, 185, 129, 0.25);
    transition: all 0.2s ease;
    justify-self: end;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.prod-buy-auction:hover {
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4);
    transform: translateY(-1px);
    text-decoration: none;
    color: #ffffff !important;
    border: none;
}

/* Auction inventory footer */
.inv-footer-auction {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.08), rgba(245, 158, 11, 0.05));
}
.inv-footer-auction:hover {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.14), rgba(245, 158, 11, 0.09));
}

/* Light theme overrides for auction inventory grid */
body.light-theme .prod.auctions-inv-grid .prod-name {
    color: #1a1a1a;
}
body.light-theme .prod.auctions-inv-grid .prod-sub {
    color: #606060;
}
body.light-theme .prod.auctions-inv-grid .prod-time {
    color: #b45309;
}
body.light-theme .prod.auctions-inv-grid .prod-price {
    color: #b45309;
}
body.light-theme .prod-head.auctions-inv-grid {
    background: #fdfdfc;
    border-color: rgba(0, 0, 0, 0.06);
    color: #6b7280;
}
body.light-theme .prod.auctions-inv-grid {
    border-color: rgba(0, 0, 0, 0.06);
}
body.light-theme .prod.auctions-inv-grid:hover {
    box-shadow: inset 3px 0 0 var(--gold);
}
body.light-theme .prod.auctions-inv-grid .prod-name {
    color: #1a1a1a;
}
body.light-theme .prod.auctions-inv-grid .prod-sub {
    color: #606060;
}
body.light-theme .prod.auctions-inv-grid .prod-time {
    color: #909090;
}
body.light-theme .prod.auctions-inv-grid .prod-price {
    color: #059669;
}
body.light-theme .prod.auctions-inv-grid .prod-stock {
    color: #909090;
}
body.light-theme .prod.auctions-inv-grid.has-bids {
    background: rgba(16, 185, 129, 0.035);
    border-left-color: #059669;
}
body.light-theme .prod.auctions-inv-grid.has-bids:hover {
    background: rgba(16, 185, 129, 0.06);
    box-shadow: inset 3px 0 0 #059669;
}
body.light-theme .prod.auctions-inv-grid.has-bids .prod-stock {
    color: #059669;
}
body.light-theme .prod-buy-auction {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
    border: none;
    color: #fff !important;
    box-shadow: 0 2px 6px rgba(16, 185, 129, 0.25);
}
body.light-theme .prod-buy-auction:hover {
    background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
    border: none;
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.35);
}

/* Responsive for auction inventory grid */
@media (max-width: 1100px) {
    .prod-head.auctions-inv-grid,
    .prod.auctions-inv-grid {
        grid-template-columns: 80px minmax(0, 1fr) 95px 45px 70px 85px 80px;
        gap: 8px;
    }
    .prod-head.auctions-inv-grid {
        padding: 9px 14px;
    }
    .prod.auctions-inv-grid {
        padding: 12px 14px;
    }
}

@media (max-width: 768px) {
    .prod-head.auctions-inv-grid {
        display: none;
    }
    .prod.auctions-inv-grid {
        display: block;
        padding: 12px;
    }
    .prod.auctions-inv-grid .prod-name {
        white-space: normal;
    }
}

/* Block title for the combined Latest Inventory panel */
.combined-block-title {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px 10px 14px;
    font-family: 'Anonymous Pro', monospace;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--text);
    white-space: nowrap;
    user-select: none;
}
.combined-block-title .tab-dot { opacity: 1; }
body.light-theme .combined-block-title { color: #18181b; }

@media (max-width: 768px) {
    .combined-block-title {
        width: 100%;
        justify-content: center;
        padding: 8px 12px;
    }
}

@media (max-width: 1024px) {
    .combined-tabs-header {
        flex-wrap: wrap;
        align-items: stretch;
    }
    .combined-tab-meta {
        width: 100%;
        margin-left: 0;
        padding-right: 0;
        padding-top: 8px;
    }
    .combined-meta-section.active {
        flex-wrap: wrap;
    }
}

@media (max-width: 768px) {
    .combined-tabs-header {
        position: relative;
        gap: 8px;
    }
    .combined-tab-btn {
        min-width: calc(50% - 4px);
        flex: 1 1 calc(50% - 4px);
        justify-content: center;
        padding: 10px 12px;
        font-size: 10px;
        gap: 8px;
    }
    .combined-tab-meta {
        display: block;
        width: 100%;
        margin-left: 0;
        padding: 4px 0 0;
    }
    .combined-meta-section {
        gap: 8px;
    }
    .combined-meta-section.active {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
    }
    .combined-meta-link {
        width: 100%;
        min-height: 34px;
        font-size: 10px;
    }
}

/* ========================================
   Compact Latest Inventory inside Tabs
   ======================================== */
.panel-combined .prod-head {
    padding: 5px 14px;
    background: #0a0a0f;
    border-bottom: 1px solid rgba(255, 255, 255, 0.04);
    grid-template-columns: 50px 1fr 110px 50px 55px 70px 95px;
}

.panel-combined .prod {
    padding: 6px 14px;
    border-left: 2px solid transparent;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    grid-template-columns: 50px 1fr 110px 50px 55px 70px 95px;
}

.panel-combined .prod:hover {
    background: linear-gradient(90deg, rgba(16, 185, 129, 0.015) 0%, transparent 100%);
    border-left-color: var(--green);
    transform: translateX(2px);
}

.panel-combined .prod-id {
    font-family: 'Anonymous Pro', monospace;
    color: #4e4e5e;
    font-size: 10px;
}

.panel-combined .prod-name {
    font-size: 11.5px;
    font-weight: 600;
}

.panel-combined .prod-type {
    font-size: 8px;
    font-weight: 700;
    padding: 2px 6px;
    border: 1px solid rgba(16, 185, 129, 0.25);
    background: rgba(16, 185, 129, 0.12);
    color: var(--green);
    line-height: 1;
    text-transform: uppercase;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.panel-combined .prod-stock {
    font-size: 11px;
}

.panel-combined .prod-time {
    font-size: 10px;
}

.panel-combined .prod-price {
    font-family: 'Anonymous Pro', monospace;
    font-size: 11.5px;
    color: var(--green);
    font-weight: 700;
    text-shadow: 0 0 6px rgba(16, 185, 129, 0.15);
}

.panel-combined .prod-buy,
.panel-combined .prod-btn-sold,
.panel-combined .prod-btn-locked,
.panel-combined .prod-btn-lowbal {
    height: 24px;
    padding: 0 12px;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    font-family: 'Anonymous Pro', monospace;
    letter-spacing: 0.5px;
    border-radius: 0;
    white-space: nowrap;
}

.panel-combined .prod-buy {
    background: rgba(16, 185, 129, 0.06) !important;
    border: 1px solid rgba(16, 185, 129, 0.3) !important;
    color: #10b981 !important;
    transition: all 0.2s ease !important;
}

.panel-combined .prod-buy:hover {
    background: #10b981 !important;
    color: #000 !important;
    border-color: #10b981 !important;
    box-shadow: 0 0 10px rgba(16, 185, 129, 0.35) !important;
}

.panel-combined .prod-btn-sold {
    background: rgba(115, 115, 115, 0.05);
    border: 1px solid rgba(115, 115, 115, 0.15);
    color: #4e4e5e;
}

.panel-combined .prod-btn-locked {
    background: rgba(245, 158, 11, 0.04);
    border: 1px solid rgba(245, 158, 11, 0.15);
    color: #f59e0b;
}

.panel-combined .prod-btn-lowbal {
    background: rgba(239, 68, 68, 0.04);
    border: 1px solid rgba(239, 68, 68, 0.15);
    color: #ef4444;
}

/* Light Theme tweaks for compact inventory */
body.light-theme .panel-combined .prod-head {
    background: #f4f4f5;
    border-bottom-color: rgba(0, 0, 0, 0.1);
}
body.light-theme .panel-combined .prod:hover,
body.light-theme .p2p-prod:hover {
    background: #f9fafb;
    transform: translateX(2px);
}
body.light-theme .panel-combined .prod-type {
    background: rgba(5, 150, 105, 0.08);
    border-color: rgba(5, 150, 105, 0.2);
    color: #059669;
}
body.light-theme .panel-combined .prod-buy {
    background: #059669 !important;
    border-color: #059669 !important;
    color: #fff !important;
}
body.light-theme .panel-combined .prod-buy:hover {
    background: #047857 !important;
    border-color: #047857 !important;
    box-shadow: none !important;
}
body.light-theme .panel-combined .p2p-buy-btn {
    background: #7c3aed !important;
    border-color: #7c3aed !important;
    color: #fff !important;
}
body.light-theme .panel-combined .p2p-buy-btn:hover {
    background: #6d28d9 !important;
    border-color: #6d28d9 !important;
    box-shadow: none !important;
}
body.light-theme .panel-combined .inv-footer {
    border-top-color: rgba(5, 150, 105, 0.15);
    background: rgba(5, 150, 105, 0.02);
    color: #059669;
}
body.light-theme .panel-combined .inv-footer:hover {
    background: rgba(5, 150, 105, 0.05);
    color: #047857;
}
body.light-theme .panel-combined .p2p-footer {
    border-top-color: rgba(124, 58, 237, 0.15);
    background: rgba(124, 58, 237, 0.02);
    color: #7c3aed;
}
body.light-theme .panel-combined .p2p-footer:hover {
    background: rgba(124, 58, 237, 0.05);
    color: #6d28d9;
}

/* Mobile responsive styles for compact inventory inside combined panel */
@media (max-width: 768px) {
    .panel-combined .prod {
        display: block;
        padding: 10px;
    }
    .panel-combined .prod-buy,
    .panel-combined .prod-btn-sold,
    .panel-combined .prod-btn-locked,
    .panel-combined .prod-btn-lowbal {
        display: block;
        width: 100%;
        text-align: center;
        padding: 8px 12px;
        height: auto;
    }
}

/* Custom CC Hover and styling inside combined panel */
.panel-combined .prod-cc:hover {
    background: linear-gradient(90deg, rgba(245, 158, 11, 0.015) 0%, transparent 100%) !important;
    border-left-color: #f59e0b !important;
    transform: translateX(2px);
}
.panel-combined .prod-type-cc {
    border: 1px solid rgba(245, 158, 11, 0.25) !important;
    background: rgba(245, 158, 11, 0.06) !important;
    color: #f59e0b !important;
}
.panel-combined .prod-price-cc {
    color: #fbbf24 !important;
    text-shadow: 0 0 6px rgba(245, 158, 11, 0.15) !important;
}
.panel-combined .prod-buy-cc {
    background: rgba(245, 158, 11, 0.06) !important;
    border: 1px solid rgba(245, 158, 11, 0.3) !important;
    color: #fbbf24 !important;
    transition: all 0.2s ease !important;
}
.panel-combined .prod-buy-cc:hover {
    background: #f59e0b !important;
    color: #000 !important;
    border-color: #f59e0b !important;
    box-shadow: 0 0 10px rgba(245, 158, 11, 0.35) !important;
}
.panel-combined .cc-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'Anonymous Pro', monospace;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    background: rgba(245, 158, 11, 0.01);
    color: #fbbf24;
    text-decoration: none;
    transition: all 0.2s ease;
}
.panel-combined .cc-footer:hover {
    background: rgba(245, 158, 11, 0.04);
    color: #fbbf24;
}
.panel-combined .cc-footer-arrow {
    margin-left: 6px;
    transition: transform 0.2s ease;
}
.panel-combined .cc-footer:hover .cc-footer-arrow {
    transform: translateX(4px);
}

/* Custom SSN Hover and styling inside combined panel */
.panel-combined .prod-ssn:hover {
    background: linear-gradient(90deg, rgba(59, 130, 246, 0.015) 0%, transparent 100%) !important;
    border-left-color: #3b82f6 !important;
    transform: translateX(2px);
}
.panel-combined .prod-type-ssn {
    border: 1px solid rgba(59, 130, 246, 0.25) !important;
    background: rgba(59, 130, 246, 0.06) !important;
    color: #3b82f6 !important;
}
.panel-combined .prod-price-ssn {
    color: #60a5fa !important;
    text-shadow: 0 0 6px rgba(59, 130, 246, 0.15) !important;
}
.panel-combined .prod-buy-ssn {
    background: rgba(59, 130, 246, 0.06) !important;
    border: 1px solid rgba(59, 130, 246, 0.3) !important;
    color: #60a5fa !important;
    transition: all 0.2s ease !important;
    cursor: pointer;
}
.panel-combined .prod-buy-ssn:hover {
    background: #3b82f6 !important;
    color: #fff !important;
    border-color: #3b82f6 !important;
    box-shadow: 0 0 10px rgba(59, 130, 246, 0.35) !important;
}
.panel-combined .ssn-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'Anonymous Pro', monospace;
    border-top: 1px solid rgba(255, 255, 255, 0.04);
    background: rgba(59, 130, 246, 0.01);
    color: #60a5fa;
    text-decoration: none;
    transition: all 0.2s ease;
}
.panel-combined .ssn-footer:hover {
    background: rgba(59, 130, 246, 0.04);
    color: #60a5fa;
}
.panel-combined .ssn-footer-arrow {
    margin-left: 6px;
    transition: transform 0.2s ease;
}
.panel-combined .ssn-footer:hover .ssn-footer-arrow {
    transform: translateX(4px);
}

/* Light Theme tweaks for CC and SSN */
body.light-theme .panel-combined .prod-type-cc {
    background: rgba(217, 119, 6, 0.08) !important;
    border-color: rgba(217, 119, 6, 0.2) !important;
    color: #d97706 !important;
}
body.light-theme .panel-combined .prod-buy-cc {
    background: #d97706 !important;
    border-color: #d97706 !important;
    color: #fff !important;
}
body.light-theme .panel-combined .prod-buy-cc:hover {
    background: #b45309 !important;
    border-color: #b45309 !important;
    box-shadow: none !important;
}
body.light-theme .panel-combined .cc-footer {
    border-top-color: rgba(217, 119, 6, 0.15) !important;
    background: rgba(217, 119, 6, 0.02) !important;
    color: #d97706 !important;
}
body.light-theme .panel-combined .cc-footer:hover {
    background: rgba(217, 119, 6, 0.05) !important;
    color: #b45309 !important;
}

body.light-theme .panel-combined .prod-type-ssn {
    background: rgba(37, 99, 235, 0.08) !important;
    border-color: rgba(37, 99, 235, 0.2) !important;
    color: #2563eb !important;
}
body.light-theme .panel-combined .prod-buy-ssn {
    background: #2563eb !important;
    border-color: #2563eb !important;
    color: #fff !important;
}
body.light-theme .panel-combined .prod-buy-ssn:hover {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
    box-shadow: none !important;
}
body.light-theme .panel-combined .ssn-footer {
    border-top-color: rgba(37, 99, 235, 0.15) !important;
    background: rgba(37, 99, 235, 0.02) !important;
    color: #2563eb !important;
}
body.light-theme .panel-combined .ssn-footer:hover {
    background: rgba(37, 99, 235, 0.05) !important;
    color: #1d4ed8 !important;
}

/* ========================================
   Clean Cyan Vault Stats Panel
   Matches Reseller style but in Blue/Cyan
   ======================================== */
.idx-panel-vault {
    display: block;
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, var(--bg-1) 0%, rgba(6, 182, 212, 0.05) 50%, rgba(6, 182, 212, 0.01) 100%) !important;
    border: 1px solid rgba(6, 182, 212, 0.25) !important;
    border-left: 3px solid #06b6d4 !important;
    box-shadow: 0 0 14px rgba(6, 182, 212, 0.08) !important;
    border-radius: 4px !important;
    margin-bottom: 12px !important;
    transition: border-color 0.2s, box-shadow 0.25s, background 0.2s !important;
    animation: none !important;
    padding: 0 !important;
}

.idx-panel-vault::before {
    content: "";
    position: absolute;
    top: -60px; right: -60px;
    width: 240px; height: 240px;
    background: radial-gradient(circle, rgba(6, 182, 212, 0.12), rgba(6, 182, 212, 0.04) 50%, transparent 70%) !important;
    pointer-events: none;
    transition: opacity 0.25s;
    z-index: 0;
}

.idx-panel-vault::after {
    display: none !important;
}

.idx-panel-vault:hover {
    border-color: rgba(6, 182, 212, 0.55) !important;
    box-shadow: 0 0 24px rgba(6, 182, 212, 0.2) !important;
    background: linear-gradient(135deg, var(--bg-1) 0%, rgba(6, 182, 212, 0.08) 50%, rgba(6, 182, 212, 0.02) 100%) !important;
}

.idx-panel-vault .idx-panel-head {
    position: relative;
    z-index: 1;
    background: transparent !important;
    border-bottom: none !important;
    padding: 12px 14px 10px 14px !important;
    margin-bottom: 0 !important;
}

.idx-panel-vault .idx-panel-title {
    font-size: 11px !important;
    color: var(--text) !important;
    letter-spacing: 0.8px !important;
}

.idx-panel-vault .idx-panel-sub {
    font-size: 10px !important;
    color: var(--text-3) !important;
}

.idx-panel-vault .idx-panel-dot {
    background: #06b6d4 !important;
    box-shadow: 0 0 6px rgba(6, 182, 212, 0.5) !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    animation: idx-vault-dot-pulse 2s ease-in-out infinite !important;
}

.idx-panel-vault .idx-panel-dot::after {
    display: none !important;
}

@keyframes idx-vault-dot-pulse {
    0%, 100% { transform: scale(1); box-shadow: 0 0 6px rgba(6, 182, 212, 0.4); }
    50% { transform: scale(1.1); box-shadow: 0 0 10px rgba(6, 182, 212, 0.8); }
}

.idx-panel-vault .idx-panel-badge {
    color: #06b6d4 !important;
    border: 1px solid rgba(6, 182, 212, 0.35) !important;
    background: linear-gradient(135deg, rgba(6, 182, 212, 0.08), transparent) !important;
    font-size: 9px !important;
    padding: 2px 6px !important;
    border-radius: 3px !important;
    animation: idx-vault-badge-glow 2.5s ease-in-out infinite !important;
}

@keyframes idx-vault-badge-glow {
    0%, 100% { box-shadow: 0 0 4px rgba(6, 182, 212, 0.2); }
    50% { box-shadow: 0 0 10px rgba(6, 182, 212, 0.5); }
}

/* Vault Grid Layout (overriding p2p styles) */
.idx-panel-vault .idx-panel-grid {
    position: relative;
    z-index: 1;
    background: rgba(6, 182, 212, 0.08) !important;
    border: 1px solid rgba(6, 182, 212, 0.15) !important;
    margin: 0 14px 14px 14px !important;
    padding: 1px !important;
    gap: 1px !important;
    border-radius: 4px;
    overflow: hidden;
}

.idx-panel-vault .idx-panel-grid::before,
.idx-panel-vault .idx-panel-cell::before,
.idx-panel-vault .idx-panel-cell::after {
    display: none !important;
}

.idx-panel-vault .idx-panel-cell {
    background: var(--bg-2) !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 10px 12px !important;
    transition: background 0.2s ease !important;
    box-shadow: none !important;
}

.idx-panel-vault .idx-panel-cell:hover {
    background: rgba(6, 182, 212, 0.04) !important;
    transform: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

/* Grid columns layout */
@media (min-width: 769px) {
    .idx-panel-vault .idx-panel-grid {
        display: grid !important;
        grid-template-columns: repeat(5, 1fr) !important;
        grid-template-rows: auto !important;
    }
    .idx-panel-vault .idx-panel-cell:nth-child(1),
    .idx-panel-vault .idx-panel-cell:nth-child(2),
    .idx-panel-vault .idx-panel-cell:nth-child(3),
    .idx-panel-vault .idx-panel-cell:nth-child(4),
    .idx-panel-vault .idx-panel-cell:nth-child(5) {
        grid-column: auto !important;
        grid-row: auto !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        justify-content: center !important;
        gap: 6px !important;
        padding: 14px 8px !important;
    }
    .idx-panel-vault .idx-panel-cell:nth-child(3) .idx-pc-claim {
        position: static !important;
        transform: none !important;
        margin-top: 4px !important;
        display: inline-block;
    }
}

@media (max-width: 768px) {
    .idx-panel-vault .idx-panel-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}
@media (max-width: 480px) {
    .idx-panel-vault .idx-panel-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Cell typography */
.idx-panel-vault .idx-pc-label {
    color: var(--text-3) !important;
    font-size: 9px !important;
    font-weight: 600 !important;
    letter-spacing: 0.6px !important;
    text-transform: uppercase !important;
}

.idx-panel-vault .idx-pc-val {
    font-size: 15px !important;
    color: var(--text) !important;
    font-family: 'Anonymous Pro', monospace !important;
    text-shadow: none !important;
}

.idx-panel-vault .idx-pc-sub {
    font-size: 10px !important;
    font-family: 'Anonymous Pro', monospace !important;
    color: var(--text-3) !important;
}

.idx-panel-vault .idx-pc-val-green {
    color: #06b6d4 !important;
    text-shadow: 0 0 8px rgba(6, 182, 212, 0.3) !important;
}

.idx-panel-vault .idx-pc-val-ok {
    color: #06b6d4 !important;
    font-size: 12px !important;
    text-shadow: none !important;
}

.idx-panel-vault .idx-pc-val-muted {
    color: var(--text-3) !important;
    font-size: 11px !important;
}

.idx-panel-vault .idx-pc-tag {
    font-size: 8px !important;
    padding: 1px 5px !important;
}
.idx-pc-tag-gold { color: var(--gold) !important; border: 1px solid rgba(212, 160, 23, 0.3) !important; background: rgba(212, 160, 23, 0.05) !important; }
.idx-pc-tag-vip { color: #a78bfa !important; border: 1px solid rgba(167, 139, 250, 0.3) !important; background: rgba(167, 139, 250, 0.05) !important; }
.idx-pc-tag-new { color: #06b6d4 !important; border: 1px solid rgba(6, 182, 212, 0.3) !important; background: rgba(6, 182, 212, 0.05) !important; }
.idx-pc-tag-inactive { color: #ef4444 !important; border: 1px solid rgba(239, 68, 68, 0.3) !important; background: rgba(239, 68, 68, 0.05) !important; }

.idx-panel-vault .idx-pc-claim {
    background: transparent !important;
    border: 1px solid #06b6d4 !important;
    color: #06b6d4 !important;
    font-size: 10px !important;
    padding: 4px 8px !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    animation: none !important;
    transition: all 0.15s ease;
}
.idx-panel-vault .idx-pc-claim:hover {
    background: #06b6d4 !important;
    color: #fff !important;
    box-shadow: 0 0 10px rgba(6, 182, 212, 0.4) !important;
}

/* Sellers rows - Centered */
.idx-panel-vault .idx-pc-sellers {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 4px !important;
    margin-top: 4px !important;
    align-items: center;
}

.idx-panel-vault .idx-pc-seller-row {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    font-size: 11px !important;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.idx-panel-vault .idx-pc-seller-row:hover {
    background: transparent !important;
    border-color: transparent !important;
}

.idx-panel-vault .idx-pc-seller-rank {
    font-size: 10px !important;
    border-right: none !important;
    margin-right: 4px !important;
    padding-right: 0 !important;
}
.idx-panel-vault .idx-pc-seller-row:nth-child(1) .idx-pc-seller-rank { color: #fbbf24 !important; text-shadow: none !important; }
.idx-panel-vault .idx-pc-seller-row:nth-child(2) .idx-pc-seller-rank { color: #94a3b8 !important; }
.idx-panel-vault .idx-pc-seller-row:nth-child(3) .idx-pc-seller-rank { color: #b45309 !important; }

.idx-panel-vault .idx-pc-seller-name {
    color: var(--text) !important;
    font-weight: 700 !important;
}
.idx-panel-vault .idx-pc-seller-name:hover {
    color: #06b6d4 !important;
}
.idx-panel-vault .idx-pc-seller-badge {
    font-size: 8px !important;
    padding: 1px 3px !important;
    background: transparent !important;
}
.idx-panel-vault .idx-pc-seller-rating {
    font-size: 9px !important;
    color: var(--text-3) !important;
    margin-left: 6px !important;
}
.idx-panel-vault .idx-pc-seller-row:hover .idx-pc-seller-rating {
    color: var(--text) !important;
}

/* User Stats - Centered Grid */
.idx-panel-vault .idx-pc-stats-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px !important;
    margin-top: 4px !important;
}

.idx-panel-vault .idx-pc-stat {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

/* Light theme overrides */
body.light-theme .idx-panel-vault {
    background: linear-gradient(135deg, #fff 0%, rgba(6, 182, 212, 0.04) 50%, rgba(6, 182, 212, 0.01) 100%) !important;
    border-color: rgba(6, 182, 212, 0.25) !important;
    box-shadow: 0 0 14px rgba(6, 182, 212, 0.05) !important;
}

body.light-theme .idx-panel-vault:hover {
    background: linear-gradient(135deg, #fff 0%, rgba(6, 182, 212, 0.08) 50%, rgba(6, 182, 212, 0.03) 100%) !important;
}

body.light-theme .idx-panel-vault .idx-panel-cell {
    background: #fdfdfc !important;
}

body.light-theme .idx-panel-vault .idx-panel-cell:hover {
    background: rgba(6, 182, 212, 0.04) !important;
}

body.light-theme .idx-panel-vault .idx-pc-val {
    color: #1c1917 !important;
}
body.light-theme .idx-panel-vault .idx-pc-seller-name {
    color: #1c1917 !important;
}


/* ========================================
   Upgraded Live Orders Bar (Fuchsia Accent / Modern)
   ======================================== */
.live-orders-bar {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    padding: 6px 12px 6px 16px !important;
    background: linear-gradient(135deg, var(--bg-1) 0%, rgba(217, 70, 239, 0.08) 50%, rgba(217, 70, 239, 0.02) 100%) !important;
    border: 1px solid rgba(217, 70, 239, 0.28) !important;
    border-left: 3px solid #d946ef !important;
    border-radius: 4px !important;
    margin-bottom: 12px !important;
    overflow: hidden !important;
    position: relative !important;
    box-shadow: 0 0 16px rgba(217, 70, 239, 0.12) !important;
    transition: box-shadow 0.2s, border-color 0.2s !important;
}

.live-orders-bar:hover {
    border-color: rgba(217, 70, 239, 0.6) !important;
    box-shadow: 0 0 28px rgba(217, 70, 239, 0.25) !important;
    background: linear-gradient(135deg, var(--bg-1) 0%, rgba(217, 70, 239, 0.12) 50%, rgba(217, 70, 239, 0.03) 100%) !important;
}

.live-orders-bar::before {
    content: '';
    position: absolute;
    top: -40px; left: -40px;
    width: 150px; height: 150px;
    background: radial-gradient(circle, rgba(217, 70, 239, 0.15), rgba(217, 70, 239, 0.05) 50%, transparent 70%) !important;
    pointer-events: none;
    z-index: 0;
}

.live-orders-bar::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 80px;
    height: 2px;
    background: linear-gradient(90deg, #d946ef, transparent);
    opacity: 0.8;
    pointer-events: none;
    z-index: 1;
}

.live-orders-bar-head {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    z-index: 5;
    box-shadow: none !important;
    font-size: 11px !important;
    color: var(--text) !important;
    font-weight: 700 !important;
    letter-spacing: 0.8px !important;
}

.live-orders-bar-head .lob-title {
    color: #d946ef !important;
}

.live-dot {
    width: 6px !important;
    height: 6px !important;
    background: #d946ef !important;
    box-shadow: 0 0 6px rgba(217, 70, 239, 0.5) !important;
    border-radius: 50% !important;
    animation: live-dot-pulse-modern 2s ease-in-out infinite !important;
}

@keyframes live-dot-pulse-modern {
    0%, 100% { transform: scale(1); box-shadow: 0 0 6px rgba(217, 70, 239, 0.4); }
    50% { transform: scale(1.1); box-shadow: 0 0 10px rgba(217, 70, 239, 0.8); }
}

.live-orders-bar-track {
    flex: 1;
    overflow: hidden;
    mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%) !important;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%) !important;
    z-index: 2;
}

.live-orders-bar-inner {
    display: flex !important;
    gap: 16px !important;
    align-items: center !important;
    padding: 4px 0 !important;
}

/* Modern Capsule Item for Live Orders */
.live-order-item {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 4px 12px !important;
    background: rgba(217, 70, 239, 0.05) !important;
    border: 1px solid rgba(217, 70, 239, 0.2) !important;
    border-radius: 4px !important;
    white-space: nowrap !important;
    transition: all 0.2s ease !important;
    color: var(--text-3) !important;
    text-decoration: none !important;
    height: 26px !important;
    box-sizing: border-box !important;
    font-size: 11px !important;
}

.live-order-item::before,
.live-order-item::after {
    display: none !important;
}

.live-order-item:hover {
    color: var(--text) !important;
    background: rgba(217, 70, 239, 0.1) !important;
    border-color: rgba(217, 70, 239, 0.4) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(217, 70, 239, 0.15) !important;
}

.live-order-item b {
    color: #d946ef !important;
    font-weight: 700 !important;
}

.live-order-item .time-ago {
    font-size: 9px !important;
    color: var(--text-3) !important;
    opacity: 0.8 !important;
}

.live-order-item:hover .time-ago {
    color: #d946ef !important;
}

/* Light Theme overrides for Live Orders */
body.light-theme .live-orders-bar {
    background: linear-gradient(135deg, #fff 0%, rgba(217, 70, 239, 0.04) 50%, rgba(217, 70, 239, 0.01) 100%) !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.04) !important;
}

body.light-theme .live-orders-bar:hover {
    background: linear-gradient(135deg, #fff 0%, rgba(217, 70, 239, 0.08) 50%, rgba(217, 70, 239, 0.02) 100%) !important;
    box-shadow: 0 3px 14px rgba(217, 70, 239, 0.1) !important;
}

body.light-theme .live-order-item {
    background: rgba(217, 70, 239, 0.03) !important;
}

body.light-theme .live-order-item:hover {
    background: rgba(217, 70, 239, 0.08) !important;
}

/* Enable custom vector/emoji indicator icons */
.live-order-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 10px !important;
    width: 16px !important;
    height: 16px !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border-radius: 50% !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    line-height: 1 !important;
    flex-shrink: 0 !important;
}

.live-order-item:hover .live-order-icon {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

.live-order-info {
    display: flex !important;
    flex-direction: row !important; /* Make it single row horizontal! */
    align-items: center !important;
    gap: 6px !important;
}

.live-order-row {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
}

.live-order-status {
    font-size: 8px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    line-height: 1 !important;
}

.live-order-mode {
    font-size: 7.5px !important;
    color: #4e4e5e !important;
    font-family: 'Anonymous Pro', monospace !important;
    line-height: 1 !important;
}

.live-order-text {
    font-size: 9.5px !important;
    color: #d4d4d8 !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    letter-spacing: 0.1px;
}

.live-order-time {
    font-size: 8.5px !important;
    color: #4e4e5e !important;
    font-family: 'Anonymous Pro', monospace !important;
    margin-left: 2px !important;
    line-height: 1 !important;
}

.live-order-item:hover .live-order-time {
    color: #71717a !important;
}

/* Light Theme overrides for Live Orders ticker */
body.light-theme .live-orders-bar {
    background: linear-gradient(135deg, #fff 0%, rgba(217, 70, 239, 0.06) 50%, rgba(217, 70, 239, 0.02) 100%) !important;
    border: 1px solid rgba(217, 70, 239, 0.25) !important;
    border-left: 3px solid #c026d3 !important;
    box-shadow: 0 0 14px rgba(217, 70, 239, 0.12) !important;
}

body.light-theme .live-orders-bar:hover {
    border-color: rgba(217, 70, 239, 0.45) !important;
    box-shadow: 0 0 24px rgba(217, 70, 239, 0.2) !important;
    background: linear-gradient(135deg, #fff 0%, rgba(217, 70, 239, 0.1) 50%, rgba(217, 70, 239, 0.03) 100%) !important;
}

body.light-theme .live-orders-bar::after {
    background: linear-gradient(90deg, #c026d3, transparent) !important; /* Fuchsia stripe for light theme */
}

body.light-theme .live-orders-bar::before {
    background: radial-gradient(circle, rgba(217, 70, 239, 0.14), rgba(217, 70, 239, 0.05) 50%, transparent 70%) !important;
}

body.light-theme .live-orders-bar-head {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

body.light-theme .live-orders-bar-head .lob-title {
    color: #c026d3 !important;
}

/* Perfect crisp styles for the count box to avoid jaggedness */
.live-orders-bar-head .lob-count {
    border-radius: 3px !important;
    border: 1px solid rgba(217, 70, 239, 0.18) !important;
    padding: 1px 6px !important;
    font-size: 9px !important;
    font-weight: 700 !important;
}

body.light-theme .live-orders-bar-head .lob-count {
    border-color: rgba(192, 38, 211, 0.35) !important;
    background: rgba(192, 38, 211, 0.08) !important;
    color: #c026d3 !important;
}

body.light-theme .live-order-item {
    background: rgba(217, 70, 239, 0.05) !important;
    border: 1px solid rgba(217, 70, 239, 0.15) !important;
    color: #52525b !important;
}

body.light-theme .live-order-item:hover {
    color: #18181b !important;
    background: rgba(217, 70, 239, 0.1) !important;
    border-color: rgba(217, 70, 239, 0.35) !important;
    box-shadow: 0 4px 12px rgba(217, 70, 239, 0.12) !important;
}

body.light-theme .live-order-item:hover .live-order-icon {
    background: rgba(217, 70, 239, 0.08) !important;
    border-color: rgba(217, 70, 239, 0.2) !important;
}

body.light-theme .live-order-text {
    color: #27272a !important;
}

body.light-theme .live-order-icon {
    background: rgba(217, 70, 239, 0.04) !important;
    border-color: rgba(217, 70, 239, 0.08) !important;
}

/* Fix TG Ban Modal close button clickability */
.tg-ban-modal-close {
    z-index: 100 !important;
}

/* Hide overflowing panel-head accent line — panels have their own border-bottom */
.side-panel-offer .panel-head::after,
.side-panel-news .panel-head::after {
    display: none !important;
}

/* ========================================
   Tactical Side Panels (Pink/Rose Exclusive Offer & Cyan News Theme)
   ======================================== */

/* --- Exclusive Offer Panel (Neon Pink Theme) --- */
.side-panel-offer {
    position: relative;
    background: linear-gradient(135deg, #050406 0%, #09050b 100%) !important;
    background-image: radial-gradient(rgba(236, 72, 153, 0.05) 1px, transparent 0) !important;
    background-size: 8px 8px !important;
    border: 1px solid rgba(236, 72, 153, 0.08) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.7), 0 0 12px rgba(236, 72, 153, 0.01) !important;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 12px !important;
    transition: all 0.3s ease;
    animation: vault-grid-animate 24s linear infinite, glitch-flicker 6s ease-in-out infinite !important;
}

/* Cyber Pink Warning Tape Stripe */
.side-panel-offer::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; height: 2px;
    background: repeating-linear-gradient(45deg, #ec4899, #ec4899 4px, #000 4px, #000 8px) !important;
    z-index: 10;
    pointer-events: none;
    opacity: 0.8;
}

/* 4x HUD Outer Corners (Pink) */
.side-panel-offer::after {
    content: '';
    position: absolute;
    top: 2px; left: 2px; right: 2px; bottom: 2px;
    background: 
        linear-gradient(to right, #ec4899 1px, transparent 1px) 0 0,
        linear-gradient(to bottom, #ec4899 1px, transparent 1px) 0 0,
        linear-gradient(to left, #ec4899 1px, transparent 1px) 100% 0,
        linear-gradient(to bottom, #ec4899 1px, transparent 1px) 100% 0,
        linear-gradient(to right, #ec4899 1px, transparent 1px) 0 100%,
        linear-gradient(to top, #ec4899 1px, transparent 1px) 0 100%,
        linear-gradient(to left, #ec4899 1px, transparent 1px) 100% 100%,
        linear-gradient(to top, #ec4899 1px, transparent 1px) 100% 100% !important;
    background-size: 6px 6px;
    background-repeat: no-repeat;
    pointer-events: none;
    z-index: 10;
    opacity: 0.5;
    width: auto !important;
    height: auto !important;
}

.side-panel-offer .panel-head {
    background: #060507 !important;
    border-bottom: 1px solid rgba(236, 72, 153, 0.1) !important;
    padding: 6px 12px !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.side-panel-offer .panel-head-title {
    color: #f472b6 !important;
    font-size: 10px !important;
    font-weight: 700;
    font-family: 'Anonymous Pro', monospace;
    text-transform: uppercase;
}

.side-panel-offer .panel-head-dot {
    position: relative;
    background: #ec4899 !important;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 4px;
}

.side-panel-offer .panel-head-dot::after {
    content: '';
    position: absolute;
    top: -5px; left: -5px; right: -5px; bottom: -5px;
    border: 1px solid #ec4899;
    border-radius: 50%;
    animation: vault-radar 2s cubic-bezier(0.1, 0.8, 0.3, 1) infinite;
    pointer-events: none;
}

.side-panel-offer .panel-head-badge {
    color: #f472b6 !important;
    border: 1px solid rgba(236, 72, 153, 0.3) !important;
    background: rgba(236, 72, 153, 0.05) !important;
    font-size: 8px !important;
    padding: 1px 4px !important;
    margin-left: auto;
}

.offer-body {
    padding: 10px 12px !important;
}

.offer-title {
    font-size: 13px !important;
    font-family: 'Anonymous Pro', monospace;
    font-weight: 700;
    color: #fff;
    margin-bottom: 6px !important;
    letter-spacing: 0.3px;
}

.offer-desc {
    font-size: 11px !important;
    color: #a1a1aa !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
    white-space: pre-line;
}

.offer-promo-box {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 8px 10px;
    background: rgba(236, 72, 153, 0.04);
    border: 1px solid rgba(236, 72, 153, 0.15);
    border-radius: 4px;
    margin-bottom: 10px;
}

.offer-promo-header {
    font-size: 10.5px;
    font-weight: 700;
    color: #f472b6;
    letter-spacing: 0.3px;
    display: flex;
    align-items: center;
    gap: 5px;
    padding-bottom: 4px;
    border-bottom: 1px dashed rgba(236, 72, 153, 0.18);
}

.offer-tier-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    padding: 5px 8px;
    background: rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(236, 72, 153, 0.14);
    border-radius: 3px;
    font-size: 10.5px;
    font-family: 'Anonymous Pro', monospace;
    transition: all 0.15s ease;
}

.offer-tier-row:hover {
    border-color: rgba(236, 72, 153, 0.35);
    background: rgba(236, 72, 153, 0.08);
}

.offer-tier-cond {
    color: #f4f4f5;
    font-weight: 600;
}

.offer-tier-arrow {
    color: #ec4899;
    font-weight: 700;
    font-size: 11px;
}

.offer-tier-reward {
    color: #34d399;
    font-weight: 700;
    background: rgba(52, 211, 153, 0.1);
    padding: 1px 6px;
    border-radius: 2px;
    border: 1px solid rgba(52, 211, 153, 0.25);
    white-space: nowrap;
}

.offer-tier-full {
    color: #e4e4e7;
    font-size: 10px;
    line-height: 1.3;
}

.offer-promo-line {
    font-size: 9.5px;
    color: #a1a1aa;
    line-height: 1.3;
    padding-top: 2px;
}

/* Exclusive Countdown - Compact row */
.offer-countdown {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 6px;
    background: rgba(236, 72, 153, 0.03);
    border: 1px solid rgba(236, 72, 153, 0.08);
    border-radius: 4px;
}

.offer-countdown .countdown-value {
    font-family: 'Anonymous Pro', monospace;
    font-size: 13px !important;
    font-weight: 700;
    color: #ec4899 !important;
    text-shadow: 0 0 6px rgba(236, 72, 153, 0.3);
}

.offer-countdown .countdown-label {
    font-size: 7.5px !important;
    color: #4e4e5e;
}

/* VIP Benefits inside offer block */
.offer-vip-title {
    font-size: 9.5px !important;
    color: #f472b6 !important;
    font-family: 'Anonymous Pro', monospace;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 6px !important;
}

.offer-vip-list {
    display: flex;
    flex-direction: column;
    gap: 3px !important;
}

.offer-vip-item {
    font-size: 9px !important;
    color: #a1a1aa !important;
}

.offer-vip-item .vip-check {
    color: #ec4899 !important;
    font-weight: 800;
    margin-right: 3px;
    text-shadow: 0 0 4px rgba(236, 72, 153, 0.3);
}

.offer-empty-notice {
    font-size: 10px !important;
    color: #4e4e5e !important;
    font-family: 'Anonymous Pro', monospace;
    margin-bottom: 8px !important;
}

/* Exclusive footer buttons */
.sof-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    padding: 8px 12px !important;
    border-top: 1px solid rgba(236, 72, 153, 0.12) !important;
    background: rgba(236, 72, 153, 0.015) !important;
    color: #ec4899 !important;
    font-size: 9.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-family: 'Anonymous Pro', monospace !important;
    letter-spacing: 0.5px;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.sof-footer:hover {
    background: rgba(236, 72, 153, 0.04) !important;
    color: #f472b6 !important;
    text-decoration: none !important;
}

.sof-footer:hover .sof-footer-arrow {
    transform: translateX(3px);
}


/* --- News Panel (Neon Cyan Theme) --- */
.side-panel-news {
    position: relative;
    background: linear-gradient(135deg, #040506 0%, #05090b 100%) !important;
    background-image: radial-gradient(rgba(6, 182, 212, 0.05) 1px, transparent 0) !important;
    background-size: 8px 8px !important;
    border: 1px solid rgba(6, 182, 212, 0.08) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.7), 0 0 12px rgba(6, 182, 212, 0.01) !important;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 12px !important;
    transition: all 0.3s ease;
    animation: vault-grid-animate 24s linear infinite, glitch-flicker 6s ease-in-out infinite !important;
}

/* Cyber Cyan Warning Tape Stripe */
.side-panel-news::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; height: 2px;
    background: repeating-linear-gradient(45deg, #06b6d4, #06b6d4 4px, #000 4px, #000 8px) !important;
    z-index: 10;
    pointer-events: none;
    opacity: 0.8;
}

/* 4x HUD Outer Corners (Cyan) */
.side-panel-news::after {
    content: '';
    position: absolute;
    top: 2px; left: 2px; right: 2px; bottom: 2px;
    background: 
        linear-gradient(to right, #06b6d4 1px, transparent 1px) 0 0,
        linear-gradient(to bottom, #06b6d4 1px, transparent 1px) 0 0,
        linear-gradient(to left, #06b6d4 1px, transparent 1px) 100% 0,
        linear-gradient(to bottom, #06b6d4 1px, transparent 1px) 100% 0,
        linear-gradient(to right, #06b6d4 1px, transparent 1px) 0 100%,
        linear-gradient(to top, #06b6d4 1px, transparent 1px) 0 100%,
        linear-gradient(to left, #06b6d4 1px, transparent 1px) 100% 100%,
        linear-gradient(to top, #06b6d4 1px, transparent 1px) 100% 100% !important;
    background-size: 6px 6px;
    background-repeat: no-repeat;
    pointer-events: none;
    z-index: 10;
    opacity: 0.5;
    width: auto !important;
    height: auto !important;
}

.side-panel-news .panel-head {
    background: #050607 !important;
    border-bottom: 1px solid rgba(6, 182, 212, 0.1) !important;
    padding: 6px 12px !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.side-panel-news .panel-head-left {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.side-panel-news .panel-head-title {
    color: #22d3ee !important;
    font-size: 10px !important;
    font-weight: 700;
    font-family: 'Anonymous Pro', monospace;
    text-transform: uppercase;
}

.side-panel-news .panel-head-dot {
    position: relative;
    background: #06b6d4 !important;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    display: inline-block;
    margin-right: 4px;
}

.side-panel-news .panel-head-dot::after {
    content: '';
    position: absolute;
    top: -5px; left: -5px; right: -5px; bottom: -5px;
    border: 1px solid #06b6d4;
    border-radius: 50%;
    animation: vault-radar 2s cubic-bezier(0.1, 0.8, 0.3, 1) infinite;
    pointer-events: none;
}

.side-panel-news .panel-head-badge {
    color: #22d3ee !important;
    border: 1px solid rgba(6, 182, 212, 0.3) !important;
    background: rgba(6, 182, 212, 0.05) !important;
    font-size: 8px !important;
    padding: 1px 4px !important;
    margin-left: auto;
}

.snn-list {
    padding: 6px 4px !important;
    display: flex;
    flex-direction: column;
    gap: 4px !important;
}

/* Modern Cyan news capsules */
.side-panel-news .news {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    padding: 5px 10px !important;
    background: rgba(255, 255, 255, 0.005) !important;
    border: 1px solid rgba(255, 255, 255, 0.01) !important;
    border-radius: 4px !important;
    margin: 0 4px !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    text-decoration: none !important;
}

.side-panel-news .news:hover {
    background: rgba(6, 182, 212, 0.015) !important;
    border-color: rgba(6, 182, 212, 0.15) !important;
    transform: translateX(2px) !important;
}

.side-panel-news .news-title {
    font-size: 10px !important;
    font-weight: 600 !important;
    color: #e4e4e7 !important;
    line-height: 1.3 !important;
}

.side-panel-news .news:hover .news-title {
    color: #ffffff !important;
}

.side-panel-news .news.new .news-title {
    color: #22d3ee !important;
    text-shadow: 0 0 6px rgba(6, 182, 212, 0.3);
}

.side-panel-news .news-time {
    font-size: 8px !important;
    font-family: 'Anonymous Pro', monospace !important;
    color: #4e4e5e !important;
}

.side-panel-news .news:hover .news-time {
    color: #71717a !important;
}

/* News footer button */
.snn-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    padding: 8px 12px !important;
    border-top: 1px solid rgba(6, 182, 212, 0.12) !important;
    background: rgba(6, 182, 212, 0.015) !important;
    color: #06b6d4 !important;
    font-size: 9.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-family: 'Anonymous Pro', monospace !important;
    letter-spacing: 0.5px;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.snn-footer:hover {
    background: rgba(6, 182, 212, 0.04) !important;
    color: #22d3ee !important;
    text-decoration: none !important;
}

.snn-footer:hover .snn-footer-arrow {
    transform: translateX(3px);
}


/* --- Light Theme overrides for side panels --- */
body.light-theme .side-panel-offer {
    background: #fff !important;
    background-image: none !important;
    border-color: rgba(236, 72, 153, 0.2) !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.04) !important;
    animation: none !important;
}

body.light-theme .side-panel-offer::before,
body.light-theme .side-panel-offer::after {
    display: none !important;
}

body.light-theme .side-panel-offer .panel-head {
    background: #fdfafb !important;
    border-bottom-color: rgba(236, 72, 153, 0.12) !important;
}

body.light-theme .side-panel-offer .panel-head-title {
    color: #db2777 !important;
}

body.light-theme .side-panel-offer .panel-head-badge {
    color: #db2777 !important;
    border-color: rgba(236, 72, 153, 0.25) !important;
    background: rgba(236, 72, 153, 0.04) !important;
}

body.light-theme .offer-title {
    color: #1c1917 !important;
}

body.light-theme .offer-desc,
body.light-theme .offer-vip-item,
body.light-theme .offer-empty-notice {
    color: #57534e !important;
}

body.light-theme .offer-promo-box {
    background: #fdf2f8 !important;
    border-color: rgba(236, 72, 153, 0.22) !important;
}

body.light-theme .offer-promo-header {
    color: #db2777 !important;
    border-bottom-color: rgba(236, 72, 153, 0.2) !important;
}

body.light-theme .offer-tier-row {
    background: #ffffff !important;
    border-color: rgba(236, 72, 153, 0.2) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
}

body.light-theme .offer-tier-row:hover {
    border-color: rgba(236, 72, 153, 0.4) !important;
    background: #fff5f8 !important;
}

body.light-theme .offer-tier-cond {
    color: #27272a !important;
}

body.light-theme .offer-tier-arrow {
    color: #db2777 !important;
}

body.light-theme .offer-tier-reward {
    color: #059669 !important;
    background: rgba(16, 185, 129, 0.08) !important;
    border-color: rgba(16, 185, 129, 0.25) !important;
}

body.light-theme .offer-tier-full {
    color: #374151 !important;
}

body.light-theme .offer-promo-line {
    color: #6b7280 !important;
}

body.light-theme .offer-countdown {
    background: rgba(236, 72, 153, 0.03);
    border-color: rgba(236, 72, 153, 0.1);
}

body.light-theme .offer-countdown .countdown-value {
    color: #db2777 !important;
    text-shadow: none !important;
}

body.light-theme .offer-vip-title {
    color: #db2777 !important;
}

body.light-theme .sof-footer {
    border-top-color: rgba(236, 72, 153, 0.15) !important;
    background: rgba(236, 72, 153, 0.02) !important;
    color: #db2777 !important;
}

body.light-theme .sof-footer:hover {
    background: rgba(236, 72, 153, 0.05) !important;
    color: #9d174d !important;
}


body.light-theme .side-panel-news {
    background: #fff !important;
    background-image: none !important;
    border-color: rgba(6, 182, 212, 0.2) !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.04) !important;
    animation: none !important;
}

body.light-theme .side-panel-news::before,
body.light-theme .side-panel-news::after {
    display: none !important;
}

body.light-theme .side-panel-news .panel-head {
    background: #fafdff !important;
    border-bottom-color: rgba(6, 182, 212, 0.12) !important;
}

body.light-theme .side-panel-news .panel-head-title {
    color: #0891b2 !important;
}

body.light-theme .side-panel-news .panel-head-badge {
    color: #0891b2 !important;
    border-color: rgba(6, 182, 212, 0.25) !important;
    background: rgba(6, 182, 212, 0.04) !important;
}

body.light-theme .side-panel-news .news {
    background: rgba(0, 0, 0, 0.015) !important;
    border-color: rgba(0, 0, 0, 0.03) !important;
}

body.light-theme .side-panel-news .news:hover {
    background: rgba(6, 182, 212, 0.04) !important;
    border-color: rgba(6, 182, 212, 0.15) !important;
}

body.light-theme .side-panel-news .news-title {
    color: #27272a !important;
}

body.light-theme .side-panel-news .news:hover .news-title {
    color: #0891b2 !important;
}

body.light-theme .side-panel-news .news.new .news-title {
    color: #0891b2 !important;
    text-shadow: none !important;
}

body.light-theme .snn-footer {
    border-top-color: rgba(6, 182, 212, 0.15) !important;
    background: rgba(6, 182, 212, 0.02) !important;
    color: #0891b2 !important;
}

body.light-theme .snn-footer:hover {
    background: rgba(6, 182, 212, 0.05) !important;
    color: #0e7490 !important;
}

/* ============================================================
   FOOTER — 2026 Darknet Terminal (Glass + Minimal)
   ============================================================ */

footer {
    position: relative;
    background: rgba(8, 8, 12, 0.6) !important;
    backdrop-filter: blur(20px) saturate(140%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(140%) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    padding: 0 !important;
    text-align: left !important;
    overflow: hidden;
    margin-top: 24px;
}

/* Subtle top gradient hairline */
footer::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    top: 0; left: 0; right: 0; height: 1px !important;
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(16, 185, 129, 0.3) 20%,
        rgba(139, 92, 246, 0.3) 50%,
        rgba(59, 130, 246, 0.3) 80%,
        transparent 100%) !important;
}

/* Noise texture overlay */
footer::after {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.015 0'/%3E%3C/filter%3E%3Crect width='100' height='100' filter='url(%23n)'/%3E%3C/svg%3E") !important;
    pointer-events: none;
    opacity: 0.5;
}

footer .wrap {
    position: relative;
    z-index: 3;
    padding: 20px 24px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
}

/* ── Brand (left) ── */
.ft-brand {
    font-size: 10px !important;
    font-weight: 700 !important;
    font-family: 'Anonymous Pro', monospace !important;
    color: rgba(255, 255, 255, 0.7) !important;
    letter-spacing: 2px !important;
    text-transform: uppercase;
    margin-bottom: 0 !important;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* Status dot — clean pulse */
.ft-brand::before {
    content: '' !important;
    display: inline-block !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
    background: #10b981 !important;
    box-shadow: 0 0 6px rgba(16, 185, 129, 0.6) !important;
    animation: ft-status 2.5s ease-in-out infinite !important;
}

@keyframes ft-status {
    0%, 100% { opacity: 1; box-shadow: 0 0 6px rgba(16, 185, 129, 0.5); }
    50% { opacity: 0.5; box-shadow: 0 0 3px rgba(16, 185, 129, 0.3); }
}

.ft-brand::after {
    display: none !important;
}

/* ── Center text ── */
.ft-text {
    font-size: 9px !important;
    font-family: 'Anonymous Pro', monospace !important;
    letter-spacing: 1.5px !important;
    color: rgba(255, 255, 255, 0.3) !important;
    margin-bottom: 0 !important;
    text-transform: uppercase !important;
    display: flex !important;
    align-items: center;
    gap: 6px;
}

/* Separator */
.ft-text::before {
    content: '';
    display: inline-block;
    width: 1px; height: 10px;
    background: rgba(255, 255, 255, 0.1);
}

/* ── Dev credits (right) ── */
.ft-dev {
    font-size: 9px !important;
    font-family: 'Anonymous Pro', monospace !important;
    color: rgba(255, 255, 255, 0.3) !important;
    margin-top: 0 !important;
    letter-spacing: 1px;
    text-align: right;
    display: flex;
    align-items: center;
    gap: 6px;
}

.ft-dev::before {
    display: none !important;
}

.ft-dev-link {
    color: rgba(255, 255, 255, 0.5) !important;
    text-decoration: none !important;
    font-weight: 700 !important;
    border-bottom: none !important;
    transition: all 0.25s ease !important;
    -webkit-text-fill-color: unset !important;
    background: none !important;
    padding: 2px 0;
    letter-spacing: 1px;
}

.ft-dev-link:hover {
    color: #10b981 !important;
    -webkit-text-fill-color: #10b981 !important;
    background: none !important;
    text-shadow: 0 0 8px rgba(16, 185, 129, 0.4) !important;
}

/* Mobile */
@media (max-width: 768px) {
    footer .wrap {
        flex-direction: column !important;
        text-align: center !important;
        gap: 8px !important;
        padding: 16px 16px !important;
    }
    .ft-brand { font-size: 9px !important; }
    .ft-text { font-size: 8px !important; }
    .ft-dev { justify-content: center !important; font-size: 8px !important; }
}

/* ── Light theme ── */
body.light-theme footer {
    background: rgba(255, 255, 255, 0.7) !important;
    backdrop-filter: blur(20px) saturate(140%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(140%) !important;
    border-top: 1px solid rgba(0, 0, 0, 0.06) !important;
}

body.light-theme footer::before {
    background: linear-gradient(90deg,
        transparent 0%,
        rgba(16, 185, 129, 0.2) 20%,
        rgba(139, 92, 246, 0.2) 50%,
        rgba(59, 130, 246, 0.2) 80%,
        transparent 100%) !important;
}

body.light-theme .ft-brand {
    color: rgba(0, 0, 0, 0.7) !important;
}

body.light-theme .ft-text {
    color: rgba(0, 0, 0, 0.3) !important;
}

body.light-theme .ft-text::before {
    background: rgba(0, 0, 0, 0.1);
}

body.light-theme .ft-dev {
    color: rgba(0, 0, 0, 0.3) !important;
}

body.light-theme .ft-dev-link {
    color: rgba(0, 0, 0, 0.5) !important;
}

body.light-theme .ft-dev-link:hover {
    color: #059669 !important;
    -webkit-text-fill-color: #059669 !important;
    text-shadow: none !important;
}


/* ============================================================
   HEADER — High-Fidelity Cyber Security Bar
   ============================================================ */

/* ── Top Warn/Secure Session Strip ── */
.warn-bar {
    padding: 4px 12px !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-weight: 700 !important;
    font-size: 8.5px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.warn-bar-secure {
    background: repeating-linear-gradient(45deg, rgba(16, 185, 129, 0.03), rgba(16, 185, 129, 0.03) 10px, rgba(0, 0, 0, 0.85) 10px, rgba(0, 0, 0, 0.85) 20px) !important;
    border-bottom: 1px solid rgba(16, 185, 129, 0.25) !important;
}

.warn-bar-secure .warn-text {
    color: #10b981 !important;
    text-shadow: 0 0 6px rgba(16, 185, 129, 0.4) !important;
}

.warn-bar-warning {
    background: repeating-linear-gradient(45deg, rgba(239, 68, 68, 0.03), rgba(239, 68, 68, 0.03) 10px, rgba(0, 0, 0, 0.85) 10px, rgba(0, 0, 0, 0.85) 20px) !important;
    border-bottom: 1px solid rgba(239, 68, 68, 0.25) !important;
}

.warn-bar-warning .warn-text {
    color: #ef4444 !important;
    text-shadow: 0 0 6px rgba(239, 68, 68, 0.4) !important;
}

/* ── Main Header Glass Box ── */
.header {
    background: rgba(3, 3, 5, 0.82) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
    position: sticky !important;
    top: 0;
    z-index: 999;
    transition: all 0.3s ease;
}

.header-row {
    padding: 10px 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

/* Logo mainframe theme */
.logo {
    text-decoration: none !important;
    transition: all 0.2s ease;
}

.logo-vault {
    width: 34px !important;
    height: 34px !important;
    border: 1px solid rgba(212, 160, 23, 0.35) !important;
    background: rgba(212, 160, 23, 0.015) !important;
    color: #d4a017 !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 15px !important;
    transition: all 0.3s ease !important;
}

.logo-vault::before {
    inset: 2px !important;
    border: 1px solid rgba(212, 160, 23, 0.15) !important;
}

.logo:hover .logo-vault {
    border-color: #d4a017 !important;
    box-shadow: 0 0 10px rgba(212, 160, 23, 0.2) !important;
}

.logo-text {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 15px !important;
    color: #d4a017 !important;
    letter-spacing: 1.5px !important;
    text-shadow: 0 0 8px rgba(212, 160, 23, 0.15) !important;
}

.logo-sub {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 8px !important;
    color: #52525b !important;
    letter-spacing: 1px !important;
    margin-top: 1px !important;
}

/* ── HUD Navigation Links ── */
.nav {
    display: flex !important;
    align-items: center !important;
    gap: 3px !important;
}

.nav-link {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    color: #a1a1aa !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase !important;
    padding: 6px 10px !important;
    border-radius: 4px !important;
    border: 1px solid transparent !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.nav-link:hover {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.02) !important;
    border-color: rgba(255, 255, 255, 0.01) !important;
    text-decoration: none !important;
}

/* Active HUD Highlight */
.nav-link.active {
    color: #d4a017 !important;
    background: rgba(212, 160, 23, 0.04) !important;
    border: 1px solid rgba(212, 160, 23, 0.1) !important;
}

/* Dropdown Arrow Symbol */
.nav-drop {
    display: flex;
    align-items: center;
    gap: 2px;
    cursor: pointer;
}

/* ── Dropdown Glass Panels ── */
.nav-menu {
    background: rgba(4, 4, 6, 0.96) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.85), 0 0 12px rgba(212, 160, 23, 0.01) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-radius: 6px !important;
    padding: 5px !important;
    min-width: 175px !important;
    top: 100% !important;
    margin-top: 5px !important;
}

/* Transparent hover-bridge to prevent dropdown from closing prematurely */
.nav-menu::before {
    content: '' !important;
    position: absolute !important;
    top: -8px !important;
    left: 0 !important;
    right: 0 !important;
    height: 8px !important;
    background: transparent !important;
}

.nav-menu-item {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 9.5px !important;
    font-weight: 700 !important;
    color: #a1a1aa !important;
    padding: 6px 10px !important;
    border-radius: 4px !important;
    transition: all 0.18s ease !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    text-decoration: none !important;
}

.nav-menu-item:hover {
    background: rgba(212, 160, 23, 0.04) !important;
    color: #ffffff !important;
    transform: translateX(3px) !important;
    text-decoration: none !important;
}

/* ── Header Cyber Action Widgets ── */
.header-acts {
    display: flex !important;
    align-items: center !important;
    gap: 5px !important;
}

/* Modern micro buttons */
.header-acts .btn {
    height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 10px !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 9.5px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    border-radius: 4px !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

/* Sound & Theme toggle widgets */
.header-acts .sound-toggle-btn,
.header-acts .theme-toggle-btn {
    width: 28px !important;
    padding: 0 !important;
    background: rgba(255, 255, 255, 0.01) !important;
    color: #a1a1aa !important;
}

.header-acts .sound-toggle-btn:hover,
.header-acts .theme-toggle-btn:hover {
    background: rgba(255, 255, 255, 0.03) !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}

/* User Balance Ledger (Green) */
.header-acts .balance {
    background: rgba(16, 185, 129, 0.015) !important;
    border: 1px solid rgba(16, 185, 129, 0.12) !important;
    color: #10b981 !important;
}

.header-acts .balance:hover {
    background: rgba(16, 185, 129, 0.04) !important;
    border-color: rgba(16, 185, 129, 0.25) !important;
    color: #34d399 !important;
    box-shadow: 0 0 10px rgba(16, 185, 129, 0.08) !important;
}

/* Seller Balance Ledger (Amber) */
.header-acts .balance-seller {
    background: rgba(245, 158, 11, 0.015) !important;
    border: 1px solid rgba(245, 158, 11, 0.12) !important;
    color: #f59e0b !important;
    gap: 4px;
}

.header-acts .balance-seller:hover {
    background: rgba(245, 158, 11, 0.04) !important;
    border-color: rgba(245, 158, 11, 0.25) !important;
    color: #fbbf24 !important;
    box-shadow: 0 0 10px rgba(245, 158, 11, 0.08) !important;
}

.header-acts .bs-icon {
    font-size: 10px;
}

/* Support Channel Widget (Cyan) */
.header-acts .btn-pgp {
    background: rgba(6, 182, 212, 0.015) !important;
    border: 1px solid rgba(6, 182, 212, 0.12) !important;
    color: #06b6d4 !important;
    gap: 6px !important;
}

.header-acts .btn-pgp:hover {
    background: rgba(6, 182, 212, 0.04) !important;
    border-color: rgba(6, 182, 212, 0.25) !important;
    color: #22d3ee !important;
    box-shadow: 0 0 10px rgba(6, 182, 212, 0.08) !important;
}

/* Pulse status dot */
.header-acts .support-status {
    width: 4px !important;
    height: 4px !important;
    border-radius: 50% !important;
    background: #10b981 !important;
    box-shadow: 0 0 6px #10b981 !important;
    animation: ft-status-pulse 2s ease-in-out infinite !important;
}

/* Dispute Alert Widget (Red) */
.header-acts .btn-dispute {
    background: rgba(239, 68, 68, 0.015) !important;
    border: 1px solid rgba(239, 68, 68, 0.12) !important;
    color: #ef4444 !important;
}

.header-acts .btn-dispute:hover {
    background: rgba(239, 68, 68, 0.04) !important;
    border-color: rgba(239, 68, 68, 0.25) !important;
    color: #f87171 !important;
    box-shadow: 0 0 10px rgba(239, 68, 68, 0.08) !important;
}

/* Exit/Logout Widget (Pragmatic Red Alert) */
.header-acts a[href="/logout"] {
    background: rgba(239, 68, 68, 0.03) !important;
    border: 1px solid rgba(239, 68, 68, 0.18) !important;
    color: #ef4444 !important;
}

.header-acts a[href="/logout"]:hover {
    background: #ef4444 !important;
    border-color: #ef4444 !important;
    color: #ffffff !important;
    box-shadow: 0 0 12px rgba(239, 68, 68, 0.3) !important;
}

/* User rank tag */
.header-acts .user-tag {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 9.5px !important;
    font-weight: 700 !important;
    color: #a1a1aa !important;
    background: rgba(255, 255, 255, 0.015) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 10px !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
}

.header-acts .user-tag:hover {
    background: rgba(255, 255, 255, 0.04) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
    box-shadow: 0 0 10px rgba(255, 255, 255, 0.05) !important;
}

.header-acts .user-tag-gold {
    color: #f59e0b !important;
    border-color: rgba(245, 158, 11, 0.2) !important;
    background: rgba(245, 158, 11, 0.02) !important;
}

.header-acts .user-tag-gold:hover {
    color: #fbbf24 !important;
    border-color: rgba(245, 158, 11, 0.4) !important;
    background: rgba(245, 158, 11, 0.06) !important;
    box-shadow: 0 0 10px rgba(245, 158, 11, 0.1) !important;
}

.header-acts .user-tag-vip {
    color: #ec4899 !important;
    border-color: rgba(236, 72, 153, 0.2) !important;
    background: rgba(236, 72, 153, 0.02) !important;
}

.header-acts .user-tag-vip:hover {
    color: #f472b6 !important;
    border-color: rgba(236, 72, 153, 0.4) !important;
    background: rgba(236, 72, 153, 0.06) !important;
    box-shadow: 0 0 10px rgba(236, 72, 153, 0.1) !important;
}


/* ── Light theme header overrides ── */
body.light-theme .warn-bar-secure {
    background: #e6f4ea !important;
    border-bottom: 1px solid #a7f3d0 !important;
}

body.light-theme .warn-bar-secure .warn-text {
    color: #065f46 !important;
    text-shadow: none !important;
}

body.light-theme .warn-bar-warning {
    background: #fdf2f2 !important;
    border-bottom: 1px solid #fecdca !important;
}

body.light-theme .warn-bar-warning .warn-text {
    color: #991b1b !important;
    text-shadow: none !important;
}

body.light-theme .header {
    background: rgba(255, 255, 255, 0.85) !important;
    border-bottom-color: rgba(0, 0, 0, 0.05) !important;
}

body.light-theme .logo-vault {
    border-color: rgba(180, 83, 9, 0.3) !important;
    background: rgba(180, 83, 9, 0.02) !important;
    color: #b45309 !important;
}

body.light-theme .logo:hover .logo-vault {
    border-color: #b45309 !important;
    box-shadow: 0 0 8px rgba(180, 83, 9, 0.15) !important;
}

body.light-theme .logo-text {
    color: #b45309 !important;
    text-shadow: none !important;
}

body.light-theme .logo-sub {
    color: #71717a !important;
}

body.light-theme .nav-link {
    color: #52525b !important;
}

body.light-theme .nav-link:hover {
    color: #18181b !important;
    background: rgba(0, 0, 0, 0.03) !important;
}

body.light-theme .nav-link.active {
    color: #b45309 !important;
    background: rgba(180, 83, 9, 0.04) !important;
    border-color: rgba(180, 83, 9, 0.1) !important;
}

body.light-theme .nav-menu {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06) !important;
}

body.light-theme .nav-menu-item {
    color: #52525b !important;
}

body.light-theme .nav-menu-item:hover {
    background: rgba(0, 0, 0, 0.02) !important;
    color: #18181b !important;
}

body.light-theme .header-acts .btn {
    border-color: rgba(0, 0, 0, 0.04) !important;
    background: rgba(0, 0, 0, 0.01) !important;
    color: #52525b !important;
}

body.light-theme .header-acts .sound-toggle-btn:hover,
body.light-theme .header-acts .theme-toggle-btn:hover {
    background: rgba(0, 0, 0, 0.03) !important;
    color: #18181b !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
}

body.light-theme .header-acts .balance {
    background: rgba(5, 150, 105, 0.02) !important;
    border-color: rgba(5, 150, 105, 0.15) !important;
    color: #059669 !important;
}

body.light-theme .header-acts .balance:hover {
    background: rgba(5, 150, 105, 0.05) !important;
    border-color: rgba(5, 150, 105, 0.3) !important;
    color: #047857 !important;
    box-shadow: none !important;
}

body.light-theme .header-acts .balance-seller {
    background: rgba(217, 119, 6, 0.02) !important;
    border-color: rgba(217, 119, 6, 0.15) !important;
    color: #d97706 !important;
}

body.light-theme .header-acts .balance-seller:hover {
    background: rgba(217, 119, 6, 0.05) !important;
    border-color: rgba(217, 119, 6, 0.3) !important;
    color: #b45309 !important;
    box-shadow: none !important;
}

body.light-theme .header-acts .btn-pgp {
    background: rgba(8, 145, 178, 0.02) !important;
    border-color: rgba(8, 145, 178, 0.15) !important;
    color: #0891b2 !important;
}

body.light-theme .header-acts .btn-pgp:hover {
    background: rgba(8, 145, 178, 0.05) !important;
    border-color: rgba(8, 145, 178, 0.3) !important;
    color: #0e7490 !important;
    box-shadow: none !important;
}

body.light-theme .header-acts .btn-dispute {
    background: rgba(220, 38, 38, 0.02) !important;
    border-color: rgba(220, 38, 38, 0.15) !important;
    color: #dc2626 !important;
}

body.light-theme .header-acts .btn-dispute:hover {
    background: rgba(220, 38, 38, 0.05) !important;
    border-color: rgba(220, 38, 38, 0.3) !important;
    color: #b91c1c !important;
    box-shadow: none !important;
}

body.light-theme .header-acts a[href="/logout"] {
    background: rgba(220, 38, 38, 0.04) !important;
    border-color: rgba(220, 38, 38, 0.2) !important;
    color: #dc2626 !important;
}

body.light-theme .header-acts a[href="/logout"]:hover {
    background: #dc2626 !important;
    border-color: #dc2626 !important;
    color: #ffffff !important;
}

body.light-theme .header-acts .user-tag {
    background: rgba(0, 0, 0, 0.04) !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
    color: #52525b !important;
    -webkit-text-fill-color: #52525b !important;
    background-clip: unset !important;
    -webkit-background-clip: unset !important;
}

body.light-theme .header-acts .user-tag:hover {
    background: rgba(0, 0, 0, 0.08) !important;
    border-color: rgba(0, 0, 0, 0.22) !important;
    color: #18181b !important;
    -webkit-text-fill-color: #18181b !important;
}

body.light-theme .header-acts .user-tag-gold {
    color: #b45309 !important;
    border-color: rgba(180, 83, 9, 0.3) !important;
    background: rgba(180, 83, 9, 0.06) !important;
    -webkit-text-fill-color: #b45309 !important;
    background-clip: unset !important;
    -webkit-background-clip: unset !important;
}

body.light-theme .header-acts .user-tag-gold:hover {
    color: #92400e !important;
    -webkit-text-fill-color: #92400e !important;
    border-color: rgba(180, 83, 9, 0.5) !important;
    background: rgba(180, 83, 9, 0.12) !important;
}

body.light-theme .header-acts .user-tag-vip {
    color: #db2777 !important;
    border-color: rgba(219, 39, 119, 0.3) !important;
    background: rgba(219, 39, 119, 0.06) !important;
    -webkit-text-fill-color: #db2777 !important;
    background-clip: unset !important;
    -webkit-background-clip: unset !important;
}

body.light-theme .header-acts .user-tag-vip:hover {
    color: #be185d !important;
    -webkit-text-fill-color: #be185d !important;
    border-color: rgba(219, 39, 119, 0.5) !important;
    background: rgba(219, 39, 119, 0.12) !important;
}


/* ============================================================
   RESPONSIVE ADAPTATIONS — Fluid Header Control
   ============================================================ */

/* ── Clean Laptop & Tablet Adaptive Breakpoints ── */
@media (max-width: 1250px) {
    /* Hide the full navigation links early to avoid horizontal clutter and wrapping */
    .nav {
        display: none !important;
    }
    
    /* Make sure the mobile menu button (hamburger ☰) is visible and styled as a sleek dark widget */
    .mobile-btn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: rgba(255, 255, 255, 0.015) !important;
        border: 1px solid rgba(255, 255, 255, 0.04) !important;
        color: #a1a1aa !important;
        width: 32px !important;
        height: 28px !important;
        border-radius: 4px !important;
        cursor: pointer !important;
        transition: all 0.2s ease !important;
        font-size: 14px !important;
        padding: 0 !important;
    }
    
    .mobile-btn:hover {
        background: rgba(255, 255, 255, 0.03) !important;
        color: #ffffff !important;
        border-color: rgba(255, 255, 255, 0.08) !important;
    }
    
    /* Restore normal spacious padding of action buttons since we now have huge space! */
    .header-acts .btn {
        padding: 0 10px !important;
        font-size: 9.5px !important;
    }
    .header-acts {
        gap: 5px !important;
    }
    .header-acts .user-tag {
        display: none !important; /* Hide rank tag to keep focus strictly on balances */
    }
}


/* Mobile menu toggle buttons (Sound / Theme) */
.mob-link-btn {
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
    gap: 10px !important;
    background: none !important;
    border: none !important;
    color: var(--text) !important;
    cursor: pointer !important;
    font-family: inherit !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    padding: 10px 0 !important;
    text-align: left !important;
}

.mob-link-btn:hover {
    color: var(--gold) !important;
}

.mob-link-btn .theme-icon-dark,
.mob-link-btn .theme-icon-light,
.mob-link-btn .sound-icon-on,
.mob-link-btn .sound-icon-off {
    position: static !important;
    transform: none !important;
    opacity: 1 !important;
    transition: none !important;
    width: 20px !important;
    text-align: center !important;
    display: inline !important;
}

.mob-link-btn .theme-icon-dark,
body.light-theme .mob-link-btn .theme-icon-light,
.mob-link-btn:not(.sound-off) .sound-icon-on,
.mob-link-btn.sound-off .sound-icon-off {
    display: inline !important;
}

.mob-link-btn .theme-icon-light,
body.light-theme .mob-link-btn .theme-icon-dark,
.mob-link-btn:not(.sound-off) .sound-icon-off,
.mob-link-btn.sound-off .sound-icon-on {
    display: none !important;
}

body.light-theme .mob-link-btn {
    color: #52525b !important;
}

body.light-theme .mob-link-btn:hover {
    color: #d97706 !important;
}

@media (max-width: 768px) {
    /* On small tablets, hide dispute and support from header Acts (available inside mobile drawer and profile) */
    .header-acts .btn-dispute,
    .header-acts .btn-pgp {
        display: none !important;
    }
}

@media (max-width: 600px) {
    /* On phone screens, hide Exit and logo subtitle to keep it perfectly single-line and clean */
    .header-acts a[href="/logout"] {
        display: none !important;
    }
    
    .logo-sub {
        display: none !important;
    }
}


/* ── Light Theme Responsive overrides ── */
body.light-theme .mobile-btn {
    background: rgba(0, 0, 0, 0.015) !important;
    border-color: rgba(0, 0, 0, 0.04) !important;
    color: #52525b !important;
}

body.light-theme .mobile-btn:hover {
    background: rgba(0, 0, 0, 0.03) !important;
    color: #18181b !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
}


/* ============================================================
   PRIVATE MESSAGES — Tactical Communications Center
   ============================================================ */

.msg-container {
    display: grid !important;
    grid-template-columns: 320px 1fr !important;
    gap: 0 !important;
    background: #08080b !important; /* Lighter, highly solid dark slate to prevent blending */
    border: 1px solid rgba(255, 255, 255, 0.08) !important; /* highly visible thin border */
    box-shadow: 0 16px 45px rgba(0, 0, 0, 0.95), 
                inset 0 0 12px rgba(255, 255, 255, 0.015), 
                0 0 0 1px rgba(255, 255, 255, 0.04) !important; /* ultra-sharp specular outer bezel */
    border-radius: 6px !important;
    overflow: hidden !important;
    margin-bottom: 30px !important;
}

/* Sidebar conversations list */
.msg-sidebar {
    background: rgba(4, 4, 6, 0.35) !important;
    border-right: 1px solid rgba(255, 255, 255, 0.03) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

.msg-sidebar-head {
    padding: 16px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: rgba(255, 255, 255, 0.005) !important;
}

.msg-sidebar-title {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #06b6d4 !important; /* Cyan HUD core */
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.msg-new-btn {
    width: 28px !important;
    height: 28px !important;
    background: rgba(6, 182, 212, 0.05) !important;
    border: 1px solid rgba(6, 182, 212, 0.25) !important;
    color: #06b6d4 !important;
    border-radius: 4px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.msg-new-btn:hover {
    background: #06b6d4 !important;
    color: #000000 !important;
    box-shadow: 0 0 10px rgba(6, 182, 212, 0.3) !important;
    text-decoration: none !important;
}

/* Search Area */
.msg-search-wrap {
    padding: 10px 16px !important;
    background: rgba(0, 0, 0, 0.15) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
    position: relative !important;
}

.msg-search-input {
    background: rgba(0, 0, 0, 0.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    color: #ffffff !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 11px !important;
    padding: 6px 12px !important;
    border-radius: 4px !important;
    width: 100% !important;
    transition: all 0.2s ease !important;
}

.msg-search-input:focus {
    border-color: rgba(6, 182, 212, 0.3) !important;
    outline: none !important;
    box-shadow: 0 0 8px rgba(6, 182, 212, 0.05) !important;
}

.msg-search-clear {
    color: #71717a !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

/* Conversation Cards */
.msg-conversations {
    overflow-y: auto !important;
    max-height: 520px !important;
}

/* Custom terminal-scrollbar inside conversations */
.msg-conversations::-webkit-scrollbar,
.msg-messages::-webkit-scrollbar {
    width: 4px !important;
}
.msg-conversations::-webkit-scrollbar-track,
.msg-messages::-webkit-scrollbar-track {
    background: rgba(0,0,0,0.1) !important;
}
.msg-conversations::-webkit-scrollbar-thumb,
.msg-messages::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.05) !important;
    border-radius: 2px !important;
}

.msg-conv {
    padding: 12px 16px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.02) !important;
    background: transparent !important;
    transition: all 0.2s ease !important;
    border-left: 2px solid transparent !important;
    display: flex !important;
    gap: 12px !important;
    align-items: center !important;
}

.msg-conv:hover {
    background: rgba(255, 255, 255, 0.01) !important;
    text-decoration: none !important;
}

.msg-conv.active {
    background: rgba(6, 182, 212, 0.025) !important;
    border-left: 2px solid #06b6d4 !important;
}

.msg-conv.unread {
    background: rgba(239, 68, 68, 0.015) !important;
    border-left: 2px solid #ef4444 !important;
    animation: msg-unread-glow 3s ease-in-out infinite !important;
}

.msg-conv-name {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.msg-conv-badge {
    font-size: 8.5px !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-weight: 700 !important;
    padding: 1px 5px !important;
    border-radius: 3px !important;
    background: rgba(245, 158, 11, 0.08) !important;
    border: 1px solid rgba(245, 158, 11, 0.18) !important;
    color: #f59e0b !important;
}

.msg-conv-badge.system {
    background: rgba(139, 92, 246, 0.08) !important;
    border: 1px solid rgba(139, 92, 246, 0.18) !important;
    color: #a78bfa !important;
}

.msg-conv-badge.closed {
    background: rgba(255, 255, 255, 0.015) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    color: #71717a !important;
}

.msg-conv-subject {
    font-size: 11px !important;
    color: #e4e4e7 !important;
    margin-top: 3px !important;
}

.msg-conv-preview {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10px !important;
    color: #52525b !important;
    margin-top: 4px !important;
}

/* Avatar Microchips */
.msg-avatar {
    width: 34px !important;
    height: 34px !important;
    border-radius: 4px !important;
    background: rgba(255, 255, 255, 0.012) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    color: #71717a !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.msg-avatar.support {
    background: rgba(245, 158, 11, 0.04) !important;
    border: 1px solid rgba(245, 158, 11, 0.18) !important;
    color: #f59e0b !important;
}

.msg-avatar.system {
    background: rgba(139, 92, 246, 0.04) !important;
    border: 1px solid rgba(139, 92, 246, 0.18) !important;
    color: #a78bfa !important;
}

.msg-avatar.vip {
    background: rgba(236, 72, 153, 0.04) !important;
    border: 1px solid rgba(236, 72, 153, 0.18) !important;
    color: #ec4899 !important;
}

.msg-avatar.gold {
    background: rgba(245, 158, 11, 0.04) !important;
    border: 1px solid rgba(245, 158, 11, 0.18) !important;
    color: #f59e0b !important;
}

/* ── Chat view framing ── */
.msg-chat {
    background: transparent !important;
    border-left: none !important;
}

.msg-chat-head {
    padding: 14px 20px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
    background: rgba(255, 255, 255, 0.01) !important;
}

.msg-chat-name {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 13px !important;
    color: #ffffff !important;
}

.msg-chat-subject {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10.5px !important;
    color: #06b6d4 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.msg-chat-avatar {
    width: 32px !important;
    height: 32px !important;
    border-radius: 4px !important;
    background: rgba(255, 255, 255, 0.012) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
}

.msg-chat-avatar.support {
    background: rgba(245, 158, 11, 0.04) !important;
    border: 1px solid rgba(245, 158, 11, 0.18) !important;
    color: #f59e0b !important;
}

.msg-chat-avatar.system {
    background: rgba(139, 92, 246, 0.04) !important;
    border: 1px solid rgba(139, 92, 246, 0.18) !important;
    color: #a78bfa !important;
}

/* Header Actions Close / Reopen */
.msg-action-btn {
    padding: 5px 10px !important;
    border-radius: 4px !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
    transition: all 0.2s ease !important;
}

.msg-action-btn.close {
    background: rgba(239, 68, 68, 0.02) !important;
    border-color: rgba(239, 68, 68, 0.18) !important;
    color: #ef4444 !important;
}

.msg-action-btn.close:hover {
    background: #ef4444 !important;
    color: #ffffff !important;
    box-shadow: 0 0 8px rgba(239, 68, 68, 0.25) !important;
}

.msg-action-btn.reopen {
    background: rgba(16, 185, 129, 0.02) !important;
    border-color: rgba(16, 185, 129, 0.18) !important;
    color: #10b981 !important;
}

.msg-action-btn.reopen:hover {
    background: #10b981 !important;
    color: #ffffff !important;
    box-shadow: 0 0 8px rgba(16, 185, 129, 0.25) !important;
}

.msg-closed-label {
    background: rgba(255, 255, 255, 0.015) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    color: #71717a !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    border-radius: 4px !important;
}

/* ── Chat Messages list & bubbles ── */
.msg-messages {
    background: rgba(0, 0, 0, 0.12) !important;
    max-height: 520px !important;
    padding: 16px !important;
}

.msg-bubble {
    border-radius: 4px !important;
    padding: 10px 14px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
    font-size: 12.5px !important;
}

/* Incoming bubble */
.msg-bubble.incoming {
    background: rgba(255, 255, 255, 0.012) !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
    border-left: 2px solid #52525b !important;
    align-self: flex-start !important;
}

/* Outgoing bubble */
.msg-bubble.outgoing {
    background: rgba(16, 185, 129, 0.02) !important;
    border: 1px solid rgba(16, 185, 129, 0.15) !important;
    border-right: 2px solid #10b981 !important;
    align-self: flex-end !important;
}

/* Date separator */
.msg-date-sep {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 9px !important;
    color: #3f3f46 !important;
}

.msg-date-sep::before,
.msg-date-sep::after {
    background: rgba(255, 255, 255, 0.03) !important;
}

/* System Conversation Inside Chat */
.msg-bubble.system-lcn {
    background: rgba(139, 92, 246, 0.03) !important;
    border: 1px solid rgba(139, 92, 246, 0.15) !important;
    border-left: 2px solid #8b5cf6 !important;
}

.msg-bubble.system-lcn .msg-bubble-from {
    color: #a78bfa !important;
    font-family: 'Anonymous Pro', monospace !important;
}

.msg-bubble.system-lcn .msg-bubble-text {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 11.5px !important;
    color: #e4e4e7 !important;
}

/* ── Form Response Input Area ── */
.msg-input-area {
    background: rgba(0, 0, 0, 0.18) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.03) !important;
    padding: 12px 16px !important;
}

.msg-input-textarea {
    background: rgba(0, 0, 0, 0.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    color: #ffffff !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 11.5px !important;
    border-radius: 4px !important;
    padding: 10px !important;
    transition: all 0.2s ease !important;
}

.msg-input-textarea:focus {
    border-color: rgba(6, 182, 212, 0.25) !important;
    outline: none !important;
    box-shadow: 0 0 10px rgba(6, 182, 212, 0.05) !important;
}

.msg-send-btn {
    background: rgba(6, 182, 212, 0.05) !important;
    border: 1px solid rgba(6, 182, 212, 0.25) !important;
    color: #06b6d4 !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
    border-radius: 4px !important;
    height: 38px !important;
    padding: 0 16px !important;
    transition: all 0.2s ease !important;
}

.msg-send-btn:hover {
    background: #06b6d4 !important;
    color: #000000 !important;
    box-shadow: 0 0 10px rgba(6, 182, 212, 0.3) !important;
}

/* ── New Topic Creation Form ── */
.msg-create-container {
    max-width: 800px !important;
    margin: 30px auto !important;
}

.msg-create-title {
    font-family: 'Anonymous Pro', monospace !important;
    color: #ffffff !important;
    font-size: 16px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.msg-create-form-wrap {
    background: #08080b !important; /* Lighter, highly solid dark slate to prevent blending */
    border: 1px solid rgba(255, 255, 255, 0.08) !important; /* highly visible thin border */
    box-shadow: 0 16px 45px rgba(0, 0, 0, 0.95), 
                inset 0 0 12px rgba(255, 255, 255, 0.015), 
                0 0 0 1px rgba(255, 255, 255, 0.04) !important; /* ultra-sharp specular outer bezel */
    border-radius: 6px !important;
    padding: 24px !important;
    overflow: hidden !important;
}

.msg-form-label {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    color: #71717a !important;
    letter-spacing: 1px !important;
    margin-bottom: 6px !important;
}

.msg-form-static {
    background: rgba(0, 0, 0, 0.2) !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
    border-radius: 4px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 12px !important;
}

.msg-recipient-avatar {
    width: 24px;
    height: 24px;
    background: rgba(217, 119, 6, 0.1);
    border: 1px solid rgba(217, 119, 6, 0.2);
    color: #d97706;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Anonymous Pro', monospace;
    font-weight: 700;
    font-size: 11px;
    border-radius: 3px;
}

.msg-recipient-name {
    font-family: 'Anonymous Pro', monospace;
    font-weight: 700;
    font-size: 12px;
    color: #fff;
}

.msg-recipient-badge {
    font-size: 8.5px;
    font-family: 'Anonymous Pro', monospace;
    font-weight: 700;
    padding: 1px 5px;
    border-radius: 3px;
    background: rgba(245, 158, 11, 0.08);
    border: 1px solid rgba(245, 158, 11, 0.18);
    color: #f59e0b;
}

.msg-form-input,
.msg-form-textarea {
    background: rgba(0, 0, 0, 0.25) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    color: #ffffff !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 11.5px !important;
    border-radius: 4px !important;
    padding: 10px !important;
    transition: all 0.2s ease !important;
}

.msg-form-input:focus,
.msg-form-textarea:focus {
    border-color: rgba(212, 160, 23, 0.25) !important;
    outline: none !important;
    box-shadow: 0 0 10px rgba(212, 160, 23, 0.05) !important;
}

.msg-form-btn.submit {
    background: rgba(212, 160, 23, 0.05) !important;
    border: 1px solid rgba(212, 160, 23, 0.2) !important;
    color: #d4a017 !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    border-radius: 4px !important;
    height: 38px !important;
    padding: 0 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
}

.msg-form-btn.submit:hover {
    background: #d4a017 !important;
    color: #000000 !important;
    box-shadow: 0 0 10px rgba(212, 160, 23, 0.3) !important;
}

.msg-form-btn.cancel {
    background: rgba(255, 255, 255, 0.015) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: #71717a !important;
    font-family: 'Anonymous Pro', monospace !important;
    text-transform: uppercase !important;
    border-radius: 4px !important;
    height: 38px !important;
    padding: 0 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
}

.msg-form-btn.cancel:hover {
    background: rgba(255, 255, 255, 0.04) !important;
    color: #ffffff !important;
}

.msg-form-hint {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 9px !important;
    color: #3f3f46 !important;
}


/* ── Messages Light Theme overrides ── */
body.light-theme .msg-container {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
}

body.light-theme .msg-sidebar {
    background: #f8f8fa !important;
    border-right-color: rgba(0, 0, 0, 0.05) !important;
}

body.light-theme .msg-sidebar-head {
    border-bottom-color: rgba(0, 0, 0, 0.05) !important;
    background: rgba(0, 0, 0, 0.005) !important;
}

body.light-theme .msg-sidebar-title {
    color: #0e7490 !important;
}

body.light-theme .msg-new-btn {
    background: rgba(14, 116, 144, 0.04) !important;
    border-color: rgba(14, 116, 144, 0.2) !important;
    color: #0e7490 !important;
}

body.light-theme .msg-new-btn:hover {
    background: #0e7490 !important;
    color: #ffffff !important;
}

body.light-theme .msg-search-input {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.06) !important;
    color: #18181b !important;
}

body.light-theme .msg-conv {
    border-bottom-color: rgba(0, 0, 0, 0.03) !important;
}

body.light-theme .msg-conv:hover {
    background: rgba(0, 0, 0, 0.01) !important;
}

body.light-theme .msg-conv.active {
    background: rgba(14, 116, 144, 0.04) !important;
    border-left-color: #0e7490 !important;
}

body.light-theme .msg-conv-name {
    color: #18181b !important;
}

body.light-theme .msg-conv-subject {
    color: #3f3f46 !important;
}

body.light-theme .msg-conv-preview {
    color: #a1a1aa !important;
}

body.light-theme .msg-avatar {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.06) !important;
    color: #71717a !important;
}

body.light-theme .msg-avatar.support {
    background: rgba(217, 119, 6, 0.04) !important;
    border-color: rgba(217, 119, 6, 0.2) !important;
    color: #b45309 !important;
}

body.light-theme .msg-avatar.system {
    background: rgba(109, 40, 217, 0.04) !important;
    border-color: rgba(109, 40, 217, 0.2) !important;
    color: #6d28d9 !important;
}

body.light-theme .msg-chat-head {
    border-bottom-color: rgba(0, 0, 0, 0.05) !important;
    background: rgba(0, 0, 0, 0.005) !important;
}

body.light-theme .msg-chat-name {
    color: #18181b !important;
}

body.light-theme .msg-chat-subject {
    color: #0e7490 !important;
}

body.light-theme .msg-bubble.incoming {
    background: #f4f4f5 !important;
    border-color: rgba(0, 0, 0, 0.04) !important;
    border-left: 2px solid #71717a !important;
}

body.light-theme .msg-bubble.outgoing {
    background: #ecfdf5 !important;
    border-color: rgba(16, 185, 129, 0.15) !important;
    border-right-color: #10b981 !important;
}

body.light-theme .msg-input-area {
    background: #f4f4f5 !important;
    border-top-color: rgba(0, 0, 0, 0.05) !important;
}

body.light-theme .msg-input-textarea {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.06) !important;
    color: #18181b !important;
}

body.light-theme .msg-send-btn {
    background: rgba(14, 116, 144, 0.04) !important;
    border-color: rgba(14, 116, 144, 0.2) !important;
    color: #0e7490 !important;
}

body.light-theme .msg-send-btn:hover {
    background: #0e7490 !important;
    color: #ffffff !important;
}

body.light-theme .msg-create-title {
    color: #18181b !important;
}

body.light-theme .msg-create-form-wrap {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
}

body.light-theme .msg-form-static {
    background: #f4f4f5 !important;
    border-color: rgba(0, 0, 0, 0.04) !important;
}

body.light-theme .msg-recipient-name {
    color: #18181b;
}

body.light-theme .msg-form-input,
body.light-theme .msg-form-textarea {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.06) !important;
    color: #18181b !important;
}

body.light-theme .msg-form-btn.submit {
    background: rgba(180, 83, 9, 0.04) !important;
    border-color: rgba(180, 83, 9, 0.2) !important;
    color: #b45309 !important;
}

body.light-theme .msg-form-btn.submit:hover {
    background: #b45309 !important;
    color: #ffffff !important;
}

@media (max-width: 1024px) {
    .combined-meta-link {
        min-height: 30px;
        padding: 0 12px;
        border-color: rgba(212, 160, 23, 0.24);
        background: rgba(212, 160, 23, 0.1);
        color: #fbbf24;
        box-shadow: inset 0 0 0 1px rgba(212, 160, 23, 0.08);
    }

    .combined-meta-link:hover {
        background: rgba(212, 160, 23, 0.18);
        border-color: rgba(251, 191, 36, 0.42);
        color: #fde68a;
    }
}

@media (max-width: 768px) {
    .combined-meta-link {
        min-height: 38px;
        font-size: 11px;
        letter-spacing: 0.8px;
        border-width: 1px;
        justify-content: center;
    }
}

body.light-theme .combined-meta-link {
    border-color: rgba(180, 83, 9, 0.2);
    background: rgba(217, 119, 6, 0.08);
    color: #b45309;
    box-shadow: inset 0 0 0 1px rgba(180, 83, 9, 0.05);
}

body.light-theme .combined-meta-link:hover {
    background: rgba(217, 119, 6, 0.14);
    border-color: rgba(180, 83, 9, 0.32);
    color: #92400e;
}

/* ============================================================
   GLOBAL HIGH-FIDELITY PANEL & FORM CONTROLS
   ============================================================ */

/* ── Panel & Card Modernization (Dark Theme) ── */
.panel,
.panel-vault,
.panel-sc,
.sc-card,
.p2p-card,
.acc-card {
    background: rgba(3, 3, 5, 0.85) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.75), inset 0 0 20px rgba(255, 255, 255, 0.01) !important;
    border-radius: 6px !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
}

.panel-head,
.panel-vault-head,
.panel-sc-head,
.sc-card-head {
    background: rgba(255, 255, 255, 0.005) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
    padding: 12px 18px !important;
}

.panel-title {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    color: #ffffff !important;
}

/* ── Custom Frosted Toolbars (P2P & Accounts search) ── */
.acc-toolbar,
.p2p-toolbar {
    background: rgba(3, 3, 5, 0.82) !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
    border-radius: 6px !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    padding: 12px 16px !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.5) !important;
    margin-bottom: 24px !important;
}

/* ── Profile Sub-Navigation Toolbar ── */
.acc-toolbar-vault {
    background: rgba(3, 3, 5, 0.82) !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
    border-radius: 6px !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    padding: 4px 8px !important;
    box-shadow: 0 8px 32px rgba(0,0,0,0.5) !important;
    margin-bottom: 24px !important;
    display: flex !important;
}

.acc-nav-link {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    border-radius: 4px !important;
    border: 1px solid transparent !important;
    transition: all 0.2s ease !important;
    padding: 6px 12px !important;
    color: #a1a1aa !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.acc-nav-link:hover {
    background: rgba(255, 255, 255, 0.015) !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

/* Glow-active states based on color scheme */
.acc-nav-link.active {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.02) !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
}

.acc-nav-link.active[data-pv="cyan"],
.acc-nav-link.active[data-pv="blue"] {
    background: rgba(6, 182, 212, 0.04) !important;
    border-color: rgba(6, 182, 212, 0.2) !important;
    color: #06b6d4 !important;
}

.acc-nav-link.active[data-pv="gold"],
.acc-nav-link.active[data-pv="orange"] {
    background: rgba(212, 160, 23, 0.04) !important;
    border-color: rgba(212, 160, 23, 0.2) !important;
    color: #d4a017 !important;
}

.acc-nav-link.active[data-pv="green"],
.acc-nav-link.active[data-pv="emerald"] {
    background: rgba(16, 185, 129, 0.04) !important;
    border-color: rgba(16, 185, 129, 0.2) !important;
    color: #10b981 !important;
}

.acc-nav-link.active[data-pv="pink"],
.acc-nav-link.active[data-pv="red"] {
    background: rgba(236, 72, 153, 0.04) !important;
    border-color: rgba(236, 72, 153, 0.2) !important;
    color: #ec4899 !important;
}

.acc-nav-link.active[data-pv="purple"] {
    background: rgba(139, 92, 246, 0.04) !important;
    border-color: rgba(139, 92, 246, 0.2) !important;
    color: #a78bfa !important;
}

/* ── Modern High-Visibility Form Fields (Thin Elegant Border) ── */
.msg-container input,
.msg-container textarea,
.msg-container select,
.msg-create-container input,
.msg-create-container textarea,
.msg-create-container select,
.p2p-container input,
.p2p-container textarea,
.p2p-container select,
.acc-toolbar input,
.acc-toolbar textarea,
.acc-toolbar select,
.p2p-toolbar input,
.p2p-toolbar textarea,
.p2p-toolbar select,
.panel-vault input,
.panel-vault textarea,
.panel-vault select,
.panel input,
.panel textarea,
.panel select,
.form-group input,
.form-group textarea,
.form-group select,
.auth-input,
.p2p-input,
.p2p-select,
.p2p-search-input,
.acc-search-input {
    background: rgba(4, 4, 6, 0.6) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important; /* Premium visible thin border */
    color: #ffffff !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 11px !important;
    border-radius: 4px !important;
    padding: 8px 12px !important;
    height: auto !important;
    min-height: 34px !important;
    transition: all 0.2s ease !important;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25) !important;
}

.msg-container select,
.msg-create-container select,
.p2p-container select,
.acc-toolbar select,
.p2p-toolbar select,
.panel-vault select,
.panel select,
.form-group select,
.p2p-select {
    padding-right: 28px !important;
}

/* Option tags inside select element dropdowns */
.msg-container option,
.msg-create-container option,
.p2p-container option,
.acc-toolbar option,
.p2p-toolbar option,
.panel-vault option,
.panel option,
.form-group option,
.p2p-select option {
    background-color: #0b0b0f !important;
    color: #ffffff !important;
}

/* Specific focus state for inputs in messages/profile/p2p */
.msg-container input:focus,
.msg-container textarea:focus,
.msg-container select:focus,
.msg-create-container input:focus,
.msg-create-container textarea:focus,
.msg-create-container select:focus,
.p2p-container input:focus,
.p2p-container textarea:focus,
.p2p-container select:focus,
.acc-toolbar input:focus,
.acc-toolbar textarea:focus,
.acc-toolbar select:focus,
.p2p-toolbar input:focus,
.p2p-toolbar textarea:focus,
.p2p-toolbar select:focus,
.panel-vault input:focus,
.panel-vault textarea:focus,
.panel-vault select:focus,
.panel input:focus,
.panel textarea:focus,
.panel select:focus,
.form-group input:focus,
.form-group textarea:focus,
.form-group select:focus,
.auth-input:focus,
.p2p-input:focus,
.p2p-select:focus,
.p2p-search-input:focus,
.acc-search-input:focus {
    border-color: rgba(212, 160, 23, 0.35) !important; /* Gold HUD focus accent */
    box-shadow: 0 0 10px rgba(212, 160, 23, 0.08) !important;
    outline: none !important;
    background: rgba(4, 4, 6, 0.8) !important;
}

/* ── Light Theme Global Panel, Toolbar & Form overrides ── */
body.light-theme .panel,
body.light-theme .panel-vault,
body.light-theme .panel-sc,
body.light-theme .sc-card,
body.light-theme .p2p-card,
body.light-theme .acc-card {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04) !important;
}

body.light-theme .panel-head,
body.light-theme .panel-vault-head,
body.light-theme .panel-sc-head,
body.light-theme .sc-card-head {
    border-bottom-color: rgba(0, 0, 0, 0.05) !important;
    background: rgba(0, 0, 0, 0.003) !important;
}

body.light-theme .panel-title {
    color: #18181b !important;
}

body.light-theme .acc-toolbar,
body.light-theme .p2p-toolbar,
body.light-theme .acc-toolbar-vault {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.03) !important;
}

body.light-theme .acc-nav-link {
    color: #52525b !important;
}

body.light-theme .acc-nav-link:hover {
    background: rgba(0, 0, 0, 0.015) !important;
    color: #18181b !important;
}

body.light-theme .acc-nav-link.active {
    background: rgba(0, 0, 0, 0.02) !important;
    border-color: rgba(0, 0, 0, 0.05) !important;
}

body.light-theme .acc-nav-link.active[data-pv="cyan"],
body.light-theme .acc-nav-link.active[data-pv="blue"] {
    background: rgba(14, 116, 144, 0.04) !important;
    border-color: rgba(14, 116, 144, 0.15) !important;
    color: #0e7490 !important;
}

body.light-theme .acc-nav-link.active[data-pv="gold"],
body.light-theme .acc-nav-link.active[data-pv="orange"] {
    background: rgba(180, 83, 9, 0.04) !important;
    border-color: rgba(180, 83, 9, 0.15) !important;
    color: #b45309 !important;
}

body.light-theme .acc-nav-link.active[data-pv="green"],
body.light-theme .acc-nav-link.active[data-pv="emerald"] {
    background: rgba(4, 120, 87, 0.04) !important;
    border-color: rgba(4, 120, 87, 0.15) !important;
    color: #047857 !important;
}

body.light-theme .acc-nav-link.active[data-pv="pink"],
body.light-theme .acc-nav-link.active[data-pv="red"] {
    background: rgba(190, 24, 74, 0.04) !important;
    border-color: rgba(190, 24, 74, 0.15) !important;
    color: #be184d !important;
}

body.light-theme .acc-nav-link.active[data-pv="purple"] {
    background: rgba(109, 40, 217, 0.04) !important;
    border-color: rgba(109, 40, 217, 0.15) !important;
    color: #6d28d9 !important;
}

/* Light Theme form inputs */
body.light-theme .msg-container input,
body.light-theme .msg-container textarea,
body.light-theme .msg-container select,
body.light-theme .msg-create-container input,
body.light-theme .msg-create-container textarea,
body.light-theme .msg-create-container select,
body.light-theme .p2p-container input,
body.light-theme .p2p-container textarea,
body.light-theme .p2p-container select,
body.light-theme .acc-toolbar input,
body.light-theme .acc-toolbar textarea,
body.light-theme .acc-toolbar select,
body.light-theme .p2p-toolbar input,
body.light-theme .p2p-toolbar textarea,
body.light-theme .p2p-toolbar select,
body.light-theme .panel-vault input,
body.light-theme .panel-vault textarea,
body.light-theme .panel-vault select,
body.light-theme .panel input,
body.light-theme .panel textarea,
body.light-theme .panel select,
body.light-theme .form-group input,
body.light-theme .form-group textarea,
body.light-theme .form-group select,
body.light-theme .auth-input,
body.light-theme .p2p-input,
body.light-theme .p2p-select,
body.light-theme .p2p-search-input,
body.light-theme .acc-search-input {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.12) !important; /* Elegant light thin border */
    color: #18181b !important;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.02) !important;
}

body.light-theme .msg-container select option,
body.light-theme .msg-create-container select option,
body.light-theme .p2p-container select option,
body.light-theme .acc-toolbar select option,
body.light-theme .p2p-toolbar select option,
body.light-theme .panel-vault select option,
body.light-theme .panel select option,
body.light-theme .form-group select option,
body.light-theme .p2p-select option {
    background-color: #ffffff !important;
    color: #18181b !important;
}

body.light-theme .msg-container input:focus,
body.light-theme .msg-container textarea:focus,
body.light-theme .msg-container select:focus,
body.light-theme .msg-create-container input:focus,
body.light-theme .msg-create-container textarea:focus,
body.light-theme .msg-create-container select:focus,
body.light-theme .p2p-container input:focus,
body.light-theme .p2p-container textarea:focus,
body.light-theme .p2p-container select:focus,
body.light-theme .acc-toolbar input:focus,
body.light-theme .acc-toolbar textarea:focus,
body.light-theme .acc-toolbar select:focus,
body.light-theme .p2p-toolbar input:focus,
body.light-theme .p2p-toolbar textarea:focus,
body.light-theme .p2p-toolbar select:focus,
body.light-theme .panel-vault input:focus,
body.light-theme .panel-vault textarea:focus,
body.light-theme .panel-vault select:focus,
body.light-theme .panel input:focus,
body.light-theme .panel textarea:focus,
body.light-theme .panel select:focus,
body.light-theme .form-group input:focus,
body.light-theme .form-group textarea:focus,
body.light-theme .form-group select:focus,
body.light-theme .auth-input:focus,
body.light-theme .p2p-input:focus,
body.light-theme .p2p-select:focus,
body.light-theme .p2p-search-input:focus,
body.light-theme .acc-search-input:focus {
    border-color: rgba(14, 116, 144, 0.35) !important; /* Teal focus highlight */
    box-shadow: 0 0 10px rgba(14, 116, 144, 0.05) !important;
    background: #ffffff !important;
}


/* ============================================================
   HIGH-FIDELITY PROFILE DROPDOWN, CORNER & BEZEL FIXES
   ============================================================ */

/* ── 1. Specular High-Contrast Containers & Specular Outlines ── */
.panel,
.panel-vault,
.panel-sc,
.sc-card,
.p2p-card,
.acc-card,
.stats-vault,
.stats-vault-pro,
.p2p-stats {
    background: #08080b !important; /* Lighter, highly solid dark slate to prevent blending */
    border: 1px solid rgba(255, 255, 255, 0.08) !important; /* highly visible thin border */
    box-shadow: 0 16px 45px rgba(0, 0, 0, 0.95), 
                inset 0 0 12px rgba(255, 255, 255, 0.015), 
                0 0 0 1px rgba(255, 255, 255, 0.04) !important; /* ultra-sharp specular outer bezel */
    border-radius: 6px !important;
    overflow: hidden !important; /* Clips all sharp backgrounds inside */
    position: relative !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
}

/* Clip top headers correctly to prevent bleeding sharp corners */
.panel-head,
.panel-vault-head,
.panel-sc-head,
.sc-card-head,
.svp-header,
.side-head,
.mem-plans-header,
.side-panel-vault > .side-head {
    border-top-left-radius: 6px !important;
    border-top-right-radius: 6px !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow: hidden !important;
}

/* Top-left/right gradient corner strip clip fix */
.panel-vault::before,
.panel-vault::after,
.stats-vault-pro::before,
.stats-vault-pro::after {
    border-radius: 6px 6px 0 0 !important;
}

/* ── 2. Navigation Toolbars and Dropdowns ── */
.acc-toolbar-vault, 
.acc-toolbar, 
.p2p-toolbar {
    overflow: visible !important; /* Crucial! Allows dropdowns to go beyond toolbar limits */
    z-index: 100 !important;
}

.acc-nav-links {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
}

.acc-nav-drop {
    position: relative !important;
    overflow: visible !important;
}

.acc-nav-drop:hover .acc-nav-menu {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

/* Dropdown Sub-menu */
.acc-nav-menu {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    min-width: 180px !important;
    background: #060609 !important; /* Dark solid black background */
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.95), 0 0 0 1px rgba(255,255,255,0.04) !important;
    border-radius: 4px !important;
    z-index: 99999 !important;
    display: block !important;
    opacity: 0;
    visibility: hidden;
    transform: translateY(6px);
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
    margin-top: 4px !important;
    padding: 4px 0 !important;
}

/* Transparent hover bridge (prevents cursor gap mouseleave triggers) */
.acc-nav-menu::before {
    content: '' !important;
    position: absolute !important;
    top: -12px !important;
    left: 0 !important;
    right: 0 !important;
    height: 12px !important;
    background: transparent !important;
    pointer-events: all !important;
}

.acc-nav-menu-item {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10.5px !important;
    padding: 8px 14px 8px 24px !important; /* Indent text to leave 24px room for the dot indicator! */
    color: #a1a1aa !important;
    display: block !important;
    position: relative !important; /* Anchor absolute dot indicator correctly */
    transition: all 0.15s ease !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.acc-nav-menu-item:hover {
    padding-left: 28px !important; /* Slide out slightly on hover */
    background: rgba(255, 255, 255, 0.02) !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

.acc-nav-menu-item.active {
    padding-left: 26px !important;
    background: rgba(6, 182, 212, 0.04) !important;
    color: #06b6d4 !important;
}


/* ── 2.1 Search Input Padding Fix (Prevents text overlapping search icons) ── */
.acc-search-wrap input.acc-search-input,
.acc-search-wrap .acc-search-input,
.acc-search-wrap input,
.acc-toolbar input.acc-search-input,
.p2p-search-wrap input.p2p-search-input,
.p2p-search-wrap input,
.p2p-toolbar input.p2p-search-input,
input.acc-search-input,
input.p2p-search-input,
input.msg-search-input,
input.usr-search-input,
input.search-input {
    padding-left: 38px !important;
}


/* ── 3. Light Theme Overrides ── */
body.light-theme .panel,
body.light-theme .panel-vault,
body.light-theme .panel-sc,
body.light-theme .sc-card,
body.light-theme .p2p-card,
body.light-theme .acc-card,
body.light-theme .stats-vault,
body.light-theme .stats-vault-pro,
body.light-theme .p2p-stats {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04), 0 0 0 1px rgba(0, 0, 0, 0.02) !important;
}

/* Premium Tactical Dark HUD Captcha wrapper for Light Theme (guarantees perfect tile contrast) */
body.light-theme .auth-captcha {
    background: #0b0c10 !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 16px 45px rgba(0, 0, 0, 0.85), 
                inset 0 0 12px rgba(255, 255, 255, 0.015), 
                0 0 0 1px rgba(255, 255, 255, 0.04) !important;
    border-radius: 6px !important;
}

body.light-theme .auth-captcha-hint {
    color: #e4e4e7 !important;
}

body.light-theme .auth-captcha-help {
    color: #71717a !important;
}

body.light-theme .auth-captcha-refresh {
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #a1a1aa !important;
    border-radius: 4px !important;
}

body.light-theme .auth-captcha-refresh:hover {
    color: var(--gold) !important;
    border-color: var(--gold) !important;
    background: rgba(255, 255, 255, 0.08) !important;
}

/* Captcha text shadow visibility helper for decoy shapes across all themes */
.captcha-tile span {
    text-shadow: 0 0 2px rgba(255, 255, 255, 0.45) !important;
}

/* ── Auth Page Space Compression (Reduces vertical height by ~145px) ── */
.auth-box {
    max-width: 360px !important;
}

.auth-card {
    padding: 14px 20px 16px !important;
}

.auth-warn {
    padding: 6px 10px !important;
    margin-bottom: 10px !important;
}

.auth-warn-text {
    font-size: 9.5px !important;
    line-height: 1.35 !important;
}

.auth-head {
    margin-bottom: 6px !important;
}

.auth-subtitle {
    margin-top: 2px !important;
    margin-bottom: 10px !important;
    font-size: 10.5px !important;
    line-height: 1.4 !important;
}

.auth-reg-line {
    padding: 5px 10px !important;
    margin-bottom: 10px !important;
    font-size: 10px !important;
    line-height: 1.35 !important;
}

.auth-field {
    margin-bottom: 10px !important;
}

.auth-label {
    margin-bottom: 3px !important;
    font-size: 10px !important;
}

.auth-input {
    height: 36px !important;
    font-size: 11px !important;
}

.auth-secret-hint {
    font-size: 8.5px !important;
    height: 24px !important;
    line-height: 24px !important;
    padding: 0 8px !important;
}

.auth-captcha {
    padding: 8px 10px !important;
    margin-bottom: 12px !important;
}

.auth-captcha-hint {
    margin-bottom: 6px !important;
    font-size: 10px !important;
}

.captcha-grid {
    gap: 3px !important;
}

.captcha-tile {
    width: 38px !important;
    height: 38px !important;
    font-size: 16px !important;
}

.auth-captcha-help {
    margin-top: 4px !important;
    font-size: 8px !important;
}

.auth-captcha-refresh {
    margin-top: 4px !important;
    padding: 3px 8px !important;
    font-size: 9px !important;
}

.auth-btn {
    height: 36px !important;
    margin-bottom: 10px !important;
    font-size: 11px !important;
}

.auth-footer {
    margin-top: 8px !important;
    font-size: 10px !important;
    text-align: center !important;
    line-height: 1.45 !important;
}

.auth-forgot-link {
    color: #f59e0b !important;
    text-decoration: none !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    transition: all 0.15s ease !important;
}

.auth-forgot-link:hover {
    color: #d97706 !important;
    text-decoration: underline !important;
}

body.light-theme .auth-forgot-link {
    color: #d97706 !important;
}

body.light-theme .auth-forgot-link:hover {
    color: #b45309 !important;
}

body.light-theme .acc-nav-menu {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06), 0 0 0 1px rgba(0, 0, 0, 0.02) !important;
}

body.light-theme .acc-nav-menu-item {
    color: #52525b !important;
}

body.light-theme .acc-nav-menu-item:hover {
    background: rgba(0, 0, 0, 0.015) !important;
    color: #18181b !important;
}

body.light-theme .acc-nav-menu-item.active {
    background: rgba(14, 116, 144, 0.04) !important;
    color: #0e7490 !important;
}



/* ============================================================
   PRIVATE MESSAGES — Tactical Communications Center
   ============================================================ */

.msg-container {
    display: grid !important;
    grid-template-columns: 320px 1fr !important;
    gap: 0 !important;
    background: #08080b !important; /* Lighter, highly solid dark slate to prevent blending */
    border: 1px solid rgba(255, 255, 255, 0.08) !important; /* highly visible thin border */
    box-shadow: 0 16px 45px rgba(0, 0, 0, 0.95), 
                inset 0 0 12px rgba(255, 255, 255, 0.015), 
                0 0 0 1px rgba(255, 255, 255, 0.04) !important; /* ultra-sharp specular outer bezel */
    border-radius: 6px !important;
    overflow: hidden !important;
    margin-bottom: 30px !important;
}

/* Sidebar conversations list */
.msg-sidebar {
    background: rgba(4, 4, 6, 0.35) !important;
    border-right: 1px solid rgba(255, 255, 255, 0.03) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

.msg-sidebar-head {
    padding: 16px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: rgba(255, 255, 255, 0.005) !important;
}

.msg-sidebar-title {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    color: #06b6d4 !important; /* Cyan HUD core */
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.msg-new-btn {
    width: 28px !important;
    height: 28px !important;
    background: rgba(6, 182, 212, 0.05) !important;
    border: 1px solid rgba(6, 182, 212, 0.25) !important;
    color: #06b6d4 !important;
    border-radius: 4px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.msg-new-btn:hover {
    background: #06b6d4 !important;
    color: #000000 !important;
    box-shadow: 0 0 10px rgba(6, 182, 212, 0.3) !important;
    text-decoration: none !important;
}

/* Search Area */
.msg-search-wrap {
    padding: 10px 16px !important;
    background: rgba(0, 0, 0, 0.15) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
    position: relative !important;
}

.msg-search-input {
    background: rgba(0, 0, 0, 0.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    color: #ffffff !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 11px !important;
    padding: 6px 12px !important;
    border-radius: 4px !important;
    width: 100% !important;
    transition: all 0.2s ease !important;
}

.msg-search-input:focus {
    border-color: rgba(6, 182, 212, 0.3) !important;
    outline: none !important;
    box-shadow: 0 0 8px rgba(6, 182, 212, 0.05) !important;
}

.msg-search-clear {
    color: #71717a !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

/* Conversation Cards */
.msg-conversations {
    overflow-y: auto !important;
    max-height: 520px !important;
}

/* Custom terminal-scrollbar inside conversations */
.msg-conversations::-webkit-scrollbar,
.msg-messages::-webkit-scrollbar {
    width: 4px !important;
}
.msg-conversations::-webkit-scrollbar-track,
.msg-messages::-webkit-scrollbar-track {
    background: rgba(0,0,0,0.1) !important;
}
.msg-conversations::-webkit-scrollbar-thumb,
.msg-messages::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,0.05) !important;
    border-radius: 2px !important;
}

.msg-conv {
    padding: 12px 16px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.02) !important;
    background: transparent !important;
    transition: all 0.2s ease !important;
    border-left: 2px solid transparent !important;
    display: flex !important;
    gap: 12px !important;
    align-items: center !important;
}

.msg-conv:hover {
    background: rgba(255, 255, 255, 0.01) !important;
    text-decoration: none !important;
}

.msg-conv.active {
    background: rgba(6, 182, 212, 0.025) !important;
    border-left: 2px solid #06b6d4 !important;
}

.msg-conv.unread {
    background: rgba(239, 68, 68, 0.015) !important;
    border-left: 2px solid #ef4444 !important;
    animation: msg-unread-glow 3s ease-in-out infinite !important;
}

.msg-conv-name {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.msg-conv-badge {
    font-size: 8.5px !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-weight: 700 !important;
    padding: 1px 5px !important;
    border-radius: 3px !important;
    background: rgba(245, 158, 11, 0.08) !important;
    border: 1px solid rgba(245, 158, 11, 0.18) !important;
    color: #f59e0b !important;
}

.msg-conv-badge.system {
    background: rgba(139, 92, 246, 0.08) !important;
    border: 1px solid rgba(139, 92, 246, 0.18) !important;
    color: #a78bfa !important;
}

.msg-conv-badge.closed {
    background: rgba(255, 255, 255, 0.015) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    color: #71717a !important;
}

.msg-conv-subject {
    font-size: 11px !important;
    color: #e4e4e7 !important;
    margin-top: 3px !important;
}

.msg-conv-preview {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10px !important;
    color: #52525b !important;
    margin-top: 4px !important;
}

/* Avatar Microchips */
.msg-avatar {
    width: 34px !important;
    height: 34px !important;
    border-radius: 4px !important;
    background: rgba(255, 255, 255, 0.012) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    color: #71717a !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.msg-avatar.support {
    background: rgba(245, 158, 11, 0.04) !important;
    border: 1px solid rgba(245, 158, 11, 0.18) !important;
    color: #f59e0b !important;
}

.msg-avatar.system {
    background: rgba(139, 92, 246, 0.04) !important;
    border: 1px solid rgba(139, 92, 246, 0.18) !important;
    color: #a78bfa !important;
}

.msg-avatar.vip {
    background: rgba(236, 72, 153, 0.04) !important;
    border: 1px solid rgba(236, 72, 153, 0.18) !important;
    color: #ec4899 !important;
}

.msg-avatar.gold {
    background: rgba(245, 158, 11, 0.04) !important;
    border: 1px solid rgba(245, 158, 11, 0.18) !important;
    color: #f59e0b !important;
}

/* ── Chat view framing ── */
.msg-chat {
    background: transparent !important;
    border-left: none !important;
}

.msg-chat-head {
    padding: 14px 20px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
    background: rgba(255, 255, 255, 0.01) !important;
}

.msg-chat-name {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 13px !important;
    color: #ffffff !important;
}

.msg-chat-subject {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10.5px !important;
    color: #06b6d4 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.msg-chat-avatar {
    width: 32px !important;
    height: 32px !important;
    border-radius: 4px !important;
    background: rgba(255, 255, 255, 0.012) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
}

.msg-chat-avatar.support {
    background: rgba(245, 158, 11, 0.04) !important;
    border: 1px solid rgba(245, 158, 11, 0.18) !important;
    color: #f59e0b !important;
}

.msg-chat-avatar.system {
    background: rgba(139, 92, 246, 0.04) !important;
    border: 1px solid rgba(139, 92, 246, 0.18) !important;
    color: #a78bfa !important;
}

/* Header Actions Close / Reopen */
.msg-action-btn {
    padding: 5px 10px !important;
    border-radius: 4px !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
    transition: all 0.2s ease !important;
}

.msg-action-btn.close {
    background: rgba(239, 68, 68, 0.02) !important;
    border-color: rgba(239, 68, 68, 0.18) !important;
    color: #ef4444 !important;
}

.msg-action-btn.close:hover {
    background: #ef4444 !important;
    color: #ffffff !important;
    box-shadow: 0 0 8px rgba(239, 68, 68, 0.25) !important;
}

.msg-action-btn.reopen {
    background: rgba(16, 185, 129, 0.02) !important;
    border-color: rgba(16, 185, 129, 0.18) !important;
    color: #10b981 !important;
}

.msg-action-btn.reopen:hover {
    background: #10b981 !important;
    color: #ffffff !important;
    box-shadow: 0 0 8px rgba(16, 185, 129, 0.25) !important;
}

.msg-closed-label {
    background: rgba(255, 255, 255, 0.015) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    color: #71717a !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    border-radius: 4px !important;
}

/* ── Chat Messages list & bubbles ── */
.msg-messages {
    background: rgba(0, 0, 0, 0.12) !important;
    max-height: 520px !important;
    padding: 16px !important;
}

.msg-bubble {
    border-radius: 4px !important;
    padding: 10px 14px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
    font-size: 12.5px !important;
}

/* Incoming bubble */
.msg-bubble.incoming {
    background: rgba(255, 255, 255, 0.012) !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
    border-left: 2px solid #52525b !important;
    align-self: flex-start !important;
}

/* Outgoing bubble */
.msg-bubble.outgoing {
    background: rgba(16, 185, 129, 0.02) !important;
    border: 1px solid rgba(16, 185, 129, 0.15) !important;
    border-right: 2px solid #10b981 !important;
    align-self: flex-end !important;
}

/* Date separator */
.msg-date-sep {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 9px !important;
    color: #3f3f46 !important;
}

.msg-date-sep::before,
.msg-date-sep::after {
    background: rgba(255, 255, 255, 0.03) !important;
}

/* System Conversation Inside Chat */
.msg-bubble.system-lcn {
    background: rgba(139, 92, 246, 0.03) !important;
    border: 1px solid rgba(139, 92, 246, 0.15) !important;
    border-left: 2px solid #8b5cf6 !important;
}

.msg-bubble.system-lcn .msg-bubble-from {
    color: #a78bfa !important;
    font-family: 'Anonymous Pro', monospace !important;
}

.msg-bubble.system-lcn .msg-bubble-text {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 11.5px !important;
    color: #e4e4e7 !important;
}

/* ── Form Response Input Area ── */
.msg-input-area {
    background: rgba(0, 0, 0, 0.18) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.03) !important;
    padding: 12px 16px !important;
}

.msg-input-textarea {
    background: rgba(0, 0, 0, 0.3) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    color: #ffffff !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 11.5px !important;
    border-radius: 4px !important;
    padding: 10px !important;
    transition: all 0.2s ease !important;
}

.msg-input-textarea:focus {
    border-color: rgba(6, 182, 212, 0.25) !important;
    outline: none !important;
    box-shadow: 0 0 10px rgba(6, 182, 212, 0.05) !important;
}

.msg-send-btn {
    background: rgba(6, 182, 212, 0.05) !important;
    border: 1px solid rgba(6, 182, 212, 0.25) !important;
    color: #06b6d4 !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
    border-radius: 4px !important;
    height: 38px !important;
    padding: 0 16px !important;
    transition: all 0.2s ease !important;
}

.msg-send-btn:hover {
    background: #06b6d4 !important;
    color: #000000 !important;
    box-shadow: 0 0 10px rgba(6, 182, 212, 0.3) !important;
}

/* ── New Topic Creation Form ── */
.msg-create-container {
    max-width: 800px !important;
    margin: 30px auto !important;
}

.msg-create-title {
    font-family: 'Anonymous Pro', monospace !important;
    color: #ffffff !important;
    font-size: 16px !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}

.msg-create-form-wrap {
    background: #08080b !important; /* Lighter, highly solid dark slate to prevent blending */
    border: 1px solid rgba(255, 255, 255, 0.08) !important; /* highly visible thin border */
    box-shadow: 0 16px 45px rgba(0, 0, 0, 0.95), 
                inset 0 0 12px rgba(255, 255, 255, 0.015), 
                0 0 0 1px rgba(255, 255, 255, 0.04) !important; /* ultra-sharp specular outer bezel */
    border-radius: 6px !important;
    padding: 24px !important;
    overflow: hidden !important;
}

.msg-form-label {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    color: #71717a !important;
    letter-spacing: 1px !important;
    margin-bottom: 6px !important;
}

.msg-form-static {
    background: rgba(0, 0, 0, 0.2) !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
    border-radius: 4px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 8px 12px !important;
}

.msg-recipient-avatar {
    width: 24px;
    height: 24px;
    background: rgba(217, 119, 6, 0.1);
    border: 1px solid rgba(217, 119, 6, 0.2);
    color: #d97706;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Anonymous Pro', monospace;
    font-weight: 700;
    font-size: 11px;
    border-radius: 3px;
}

.msg-recipient-name {
    font-family: 'Anonymous Pro', monospace;
    font-weight: 700;
    font-size: 12px;
    color: #fff;
}

.msg-recipient-badge {
    font-size: 8.5px;
    font-family: 'Anonymous Pro', monospace;
    font-weight: 700;
    padding: 1px 5px;
    border-radius: 3px;
    background: rgba(245, 158, 11, 0.08);
    border: 1px solid rgba(245, 158, 11, 0.18);
    color: #f59e0b;
}

.msg-form-input,
.msg-form-textarea {
    background: rgba(0, 0, 0, 0.25) !important;
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    color: #ffffff !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 11.5px !important;
    border-radius: 4px !important;
    padding: 10px !important;
    transition: all 0.2s ease !important;
}

.msg-form-input:focus,
.msg-form-textarea:focus {
    border-color: rgba(212, 160, 23, 0.25) !important;
    outline: none !important;
    box-shadow: 0 0 10px rgba(212, 160, 23, 0.05) !important;
}

.msg-form-btn.submit {
    background: rgba(212, 160, 23, 0.05) !important;
    border: 1px solid rgba(212, 160, 23, 0.2) !important;
    color: #d4a017 !important;
    font-family: 'Anonymous Pro', monospace !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    border-radius: 4px !important;
    height: 38px !important;
    padding: 0 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
}

.msg-form-btn.submit:hover {
    background: #d4a017 !important;
    color: #000000 !important;
    box-shadow: 0 0 10px rgba(212, 160, 23, 0.3) !important;
}

.msg-form-btn.cancel {
    background: rgba(255, 255, 255, 0.015) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: #71717a !important;
    font-family: 'Anonymous Pro', monospace !important;
    text-transform: uppercase !important;
    border-radius: 4px !important;
    height: 38px !important;
    padding: 0 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-decoration: none !important;
}

.msg-form-btn.cancel:hover {
    background: rgba(255, 255, 255, 0.04) !important;
    color: #ffffff !important;
}

.msg-form-hint {
    font-family: 'Anonymous Pro', monospace !important;
    font-size: 9px !important;
    color: #3f3f46 !important;
}


/* ── Messages Light Theme overrides ── */
body.light-theme .msg-container {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
}

body.light-theme .msg-sidebar {
    background: #f8f8fa !important;
    border-right-color: rgba(0, 0, 0, 0.05) !important;
}

body.light-theme .msg-sidebar-head {
    border-bottom-color: rgba(0, 0, 0, 0.05) !important;
    background: rgba(0, 0, 0, 0.005) !important;
}

body.light-theme .msg-sidebar-title {
    color: #0e7490 !important;
}

body.light-theme .msg-new-btn {
    background: rgba(14, 116, 144, 0.04) !important;
    border-color: rgba(14, 116, 144, 0.2) !important;
    color: #0e7490 !important;
}

body.light-theme .msg-new-btn:hover {
    background: #0e7490 !important;
    color: #ffffff !important;
}

body.light-theme .msg-search-input {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.06) !important;
    color: #18181b !important;
}

body.light-theme .msg-conv {
    border-bottom-color: rgba(0, 0, 0, 0.03) !important;
}

body.light-theme .msg-conv:hover {
    background: rgba(0, 0, 0, 0.01) !important;
}

body.light-theme .msg-conv.active {
    background: rgba(14, 116, 144, 0.04) !important;
    border-left-color: #0e7490 !important;
}

body.light-theme .msg-conv-name {
    color: #18181b !important;
}

body.light-theme .msg-conv-subject {
    color: #3f3f46 !important;
}

body.light-theme .msg-conv-preview {
    color: #a1a1aa !important;
}

body.light-theme .msg-avatar {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.06) !important;
    color: #71717a !important;
}

body.light-theme .msg-avatar.support {
    background: rgba(217, 119, 6, 0.04) !important;
    border-color: rgba(217, 119, 6, 0.2) !important;
    color: #b45309 !important;
}

body.light-theme .msg-avatar.system {
    background: rgba(109, 40, 217, 0.04) !important;
    border-color: rgba(109, 40, 217, 0.2) !important;
    color: #6d28d9 !important;
}

body.light-theme .msg-chat-head {
    border-bottom-color: rgba(0, 0, 0, 0.05) !important;
    background: rgba(0, 0, 0, 0.005) !important;
}

body.light-theme .msg-chat-name {
    color: #18181b !important;
}

body.light-theme .msg-chat-subject {
    color: #0e7490 !important;
}

body.light-theme .msg-bubble.incoming {
    background: #f4f4f5 !important;
    border-color: rgba(0, 0, 0, 0.04) !important;
    border-left: 2px solid #71717a !important;
}

body.light-theme .msg-bubble.outgoing {
    background: #ecfdf5 !important;
    border-color: rgba(16, 185, 129, 0.15) !important;
    border-right-color: #10b981 !important;
}

body.light-theme .msg-input-area {
    background: #f4f4f5 !important;
    border-top-color: rgba(0, 0, 0, 0.05) !important;
}

body.light-theme .msg-input-textarea {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.06) !important;
    color: #18181b !important;
}

body.light-theme .msg-send-btn {
    background: rgba(14, 116, 144, 0.04) !important;
    border-color: rgba(14, 116, 144, 0.2) !important;
    color: #0e7490 !important;
}

body.light-theme .msg-send-btn:hover {
    background: #0e7490 !important;
    color: #ffffff !important;
}

body.light-theme .msg-create-title {
    color: #18181b !important;
}

body.light-theme .msg-create-form-wrap {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05) !important;
}

body.light-theme .msg-form-static {
    background: #f4f4f5 !important;
    border-color: rgba(0, 0, 0, 0.04) !important;
}

body.light-theme .msg-recipient-name {
    color: #18181b;
}

body.light-theme .msg-form-input,
body.light-theme .msg-form-textarea {
    background: #ffffff !important;
    border-color: rgba(0, 0, 0, 0.06) !important;
    color: #18181b !important;
}

body.light-theme .msg-form-btn.submit {
    background: rgba(180, 83, 9, 0.04) !important;
    border-color: rgba(180, 83, 9, 0.2) !important;
    color: #b45309 !important;
}

body.light-theme .msg-form-btn.submit:hover {
    background: #b45309 !important;
    color: #ffffff !important;
}

@media (max-width: 1024px) {
    .combined-meta-link {
        min-height: 30px !important;
        padding: 0 12px !important;
        border-color: rgba(212, 160, 23, 0.24) !important;
        background: rgba(212, 160, 23, 0.1) !important;
        color: #fbbf24 !important;
        box-shadow: inset 0 0 0 1px rgba(212, 160, 23, 0.08) !important;
    }

    .combined-meta-link:hover {
        background: rgba(212, 160, 23, 0.18) !important;
        border-color: rgba(251, 191, 36, 0.42) !important;
        color: #fde68a !important;
    }
}

@media (max-width: 768px) {
    .combined-meta-link {
        min-height: 38px !important;
        font-size: 11px !important;
        letter-spacing: 0.8px !important;
        justify-content: center !important;
    }
}

body.light-theme .combined-meta-link {
    border-color: rgba(180, 83, 9, 0.2) !important;
    background: rgba(217, 119, 6, 0.08) !important;
    color: #b45309 !important;
    box-shadow: inset 0 0 0 1px rgba(180, 83, 9, 0.05) !important;
}

body.light-theme .combined-meta-link:hover {
    background: rgba(217, 119, 6, 0.14) !important;
    border-color: rgba(180, 83, 9, 0.32) !important;
    color: #92400e !important;
}

@media (max-width: 768px) {
    .header-row {
        gap: 8px !important;
    }

    .logo {
        gap: 8px !important;
        min-width: 0 !important;
    }

    .logo-vault {
        width: 30px !important;
        height: 30px !important;
        font-size: 13px !important;
    }

    .logo-text {
        font-size: 13px !important;
        letter-spacing: 1px !important;
    }

    .header-acts {
        gap: 4px !important;
        flex-wrap: nowrap !important;
        min-width: 0 !important;
    }

    .header-acts .btn {
        height: 30px !important;
        padding: 0 8px !important;
        font-size: 8px !important;
        min-width: 0 !important;
        white-space: nowrap !important;
    }

    .header-acts .balance,
    .header-acts .balance-seller {
        padding: 0 7px !important;
        font-size: 8px !important;
    }

    .header-acts .bs-icon {
        font-size: 9px !important;
    }

    .header-acts .header-support-btn,
    .header-acts .header-exit-btn,
    .header-acts .sound-toggle-btn,
    .header-acts .theme-toggle-btn,
    .header-acts .mobile-btn {
        display: inline-flex !important;
        width: 30px !important;
        min-width: 30px !important;
        padding: 0 !important;
        justify-content: center !important;
        font-size: 0 !important;
        position: relative !important;
        flex-shrink: 0 !important;
    }

    .header-acts .header-support-btn {
        background: rgba(6, 182, 212, 0.04) !important;
        border-color: rgba(6, 182, 212, 0.18) !important;
        color: #06b6d4 !important;
    }

    .header-acts .header-exit-btn {
        background: rgba(239, 68, 68, 0.05) !important;
        border-color: rgba(239, 68, 68, 0.22) !important;
        color: #ef4444 !important;
    }

    .header-acts .header-support-btn::before {
        content: '\1F4AC';
        font-size: 14px;
        line-height: 1;
    }

    .header-acts .header-exit-btn::before {
        content: '\27A2';
        font-size: 14px;
        line-height: 1;
    }

    .header-acts .header-support-btn .support-status {
        position: absolute !important;
        top: 6px !important;
        left: 6px !important;
        width: 4px !important;
        height: 4px !important;
    }

    .header-acts .header-support-btn .msg-badge {
        position: absolute !important;
        top: -4px !important;
        right: -4px !important;
        margin: 0 !important;
    }

    .header-acts .btn-dispute {
        display: none !important;
    }

    .msg-container {
        display: flex !important;
        flex-direction: column !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
        border-radius: 6px !important;
    }

    .msg-mobile-tabs {
        display: flex !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 5 !important;
    }

    .msg-sidebar,
    .msg-chat,
    .msg-create-container,
    .msg-create-form-wrap {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .msg-sidebar {
        border-right: none !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important;
        order: 1 !important;
    }

    .msg-chat {
        order: 2 !important;
        min-height: calc(100vh - 170px) !important;
        min-height: calc(100dvh - 170px) !important;
    }

    .msg-sidebar.msg-mobile-hidden,
    .msg-chat.msg-mobile-hidden {
        display: none !important;
    }

    .msg-conversations {
        max-height: calc(100vh - 260px) !important;
        max-height: calc(100dvh - 260px) !important;
        overflow-x: hidden !important;
    }

    .msg-conv {
        align-items: flex-start !important;
        padding: 12px !important;
    }

    .msg-conv-info,
    .msg-chat-info {
        min-width: 0 !important;
    }

    .msg-conv-name,
    .msg-chat-name {
        flex-wrap: wrap !important;
        gap: 6px !important;
    }

    .msg-conv-subject,
    .msg-conv-preview,
    .msg-chat-subject {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        word-break: break-word !important;
        overflow-wrap: anywhere !important;
    }

    .msg-conv-meta {
        align-items: flex-start !important;
        gap: 4px !important;
    }

    .msg-chat-head {
        flex-wrap: wrap !important;
        align-items: flex-start !important;
        padding: 12px !important;
        gap: 10px !important;
    }

    .msg-chat-actions {
        width: 100% !important;
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
    }

    .msg-messages {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 260px !important;
        max-height: none !important;
        padding: 12px !important;
        overflow-x: hidden !important;
    }

    .msg-bubble,
    .msg-bubble.system-lcn {
        width: auto !important;
        max-width: 100% !important;
    }

    .msg-bubble-text {
        white-space: pre-wrap !important;
        word-break: break-word !important;
        overflow-wrap: anywhere !important;
    }

    .msg-reply-area,
    .msg-no-reply {
        padding: 12px !important;
    }

    .msg-reply-form {
        flex-direction: column !important;
        gap: 10px !important;
    }

    .msg-reply-input {
        width: 100% !important;
        min-height: 88px !important;
        max-height: 180px !important;
        height: auto !important;
    }

    .msg-send-btn {
        width: 100% !important;
        height: 38px !important;
    }

    .msg-pagination,
    .msg-form-static,
    .msg-form-actions {
        flex-wrap: wrap !important;
    }

    .msg-form-actions {
        flex-direction: column-reverse !important;
        gap: 10px !important;
    }

    .msg-form-btn {
        width: 100% !important;
        text-align: center !important;
    }

    .msg-create-container {
        margin: 16px auto !important;
    }

    .msg-create-form-wrap {
        padding: 16px !important;
        overflow: visible !important;
    }
}

@media (max-width: 600px) {
    .header-acts .header-support-btn,
    .header-acts .header-exit-btn {
        display: inline-flex !important;
    }

    .logo-sub {
        display: none !important;
    }
}

body.light-theme .header-acts .header-support-btn {
    background: rgba(8, 145, 178, 0.04) !important;
    border-color: rgba(8, 145, 178, 0.18) !important;
    color: #0891b2 !important;
}

body.light-theme .header-acts .header-exit-btn {
    background: rgba(220, 38, 38, 0.05) !important;
    border-color: rgba(220, 38, 38, 0.22) !important;
    color: #dc2626 !important;
}

@media (max-width: 768px) {
    .header-acts .mobile-btn {
        display: inline-flex !important;
        width: 30px !important;
        min-width: 30px !important;
        padding: 0 !important;
        justify-content: center !important;
        font-size: 14px !important;
        line-height: 1 !important;
        color: #71717a !important;
    }

    .header-acts .header-support-btn,
    .header-acts a.header-exit-btn[href="/logout"] {
        font-size: 0 !important;
        overflow: hidden !important;
    }

    .header-acts .header-support-btn::before {
        content: 'S';
        font-family: 'Anonymous Pro', monospace !important;
        font-size: 10px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
    }

    .header-acts a.header-exit-btn[href="/logout"]::before {
        content: '\2192';
        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
    }
}

@media (max-width: 600px) {
    .header-acts a.header-exit-btn[href="/logout"] {
        display: inline-flex !important;
        width: 28px !important;
        min-width: 28px !important;
        padding: 0 !important;
        justify-content: center !important;
        font-size: 0 !important;
    }

    .header-acts .header-support-btn,
    .header-acts .sound-toggle-btn,
    .header-acts .theme-toggle-btn,
    .header-acts .mobile-btn {
        width: 28px !important;
        min-width: 28px !important;
    }

    .header-acts .balance {
        max-width: 60px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .header-acts .balance-seller {
        width: 28px !important;
        min-width: 28px !important;
        padding: 0 !important;
        font-size: 0 !important;
        gap: 0 !important;
    }

    .header-acts .balance-seller .bs-icon {
        font-size: 10px !important;
    }

    .header-acts .balance-seller .bs-text {
        display: none !important;
    }

    .header-acts .mobile-btn {
        font-size: 13px !important;
    }

    .header-acts .header-support-btn::before {
        font-size: 9px !important;
    }
}

@media (max-width: 768px) {
    .header-acts .header-support-btn,
    .header-acts a.header-exit-btn[href="/logout"] {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: relative !important;
        padding: 0 !important;
    }

    .header-acts .header-support-btn::before,
    .header-acts a.header-exit-btn[href="/logout"]::before {
        content: '' !important;
        display: block !important;
        width: 14px !important;
        height: 14px !important;
        background-color: currentColor !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
        background-size: contain !important;
        margin: 0 !important;
    }

    .header-acts .header-support-btn::before {
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13a8 8 0 0 1 16 0'/%3E%3Crect x='3' y='12' width='4' height='7' rx='2'/%3E%3Crect x='17' y='12' width='4' height='7' rx='2'/%3E%3Cpath d='M21 19a3 3 0 0 1-3 3h-3'/%3E%3C/svg%3E") center / contain no-repeat !important;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13a8 8 0 0 1 16 0'/%3E%3Crect x='3' y='12' width='4' height='7' rx='2'/%3E%3Crect x='17' y='12' width='4' height='7' rx='2'/%3E%3Cpath d='M21 19a3 3 0 0 1-3 3h-3'/%3E%3C/svg%3E") center / contain no-repeat !important;
    }

    .header-acts a.header-exit-btn[href="/logout"]::before {
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 17l5-5-5-5'/%3E%3Cpath d='M15 12H3'/%3E%3Cpath d='M21 21H12a2 2 0 0 1-2-2v-3'/%3E%3Cpath d='M21 3H12a2 2 0 0 0-2 2v3'/%3E%3C/svg%3E") center / contain no-repeat !important;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 17l5-5-5-5'/%3E%3Cpath d='M15 12H3'/%3E%3Cpath d='M21 21H12a2 2 0 0 1-2-2v-3'/%3E%3Cpath d='M21 3H12a2 2 0 0 0-2 2v3'/%3E%3C/svg%3E") center / contain no-repeat !important;
    }

    .header-acts .header-support-btn .msg-badge {
        position: absolute !important;
        top: -4px !important;
        right: -4px !important;
        z-index: 2 !important;
        min-width: 15px !important;
        height: 15px !important;
        padding: 0 4px !important;
        line-height: 15px !important;
        font-size: 9px !important;
    }
}

@media (max-width: 768px) {
    .header-acts .header-support-btn,
    .header-acts a.header-exit-btn[href="/logout"] {
        position: relative !important;
    }

    .header-acts .header-support-btn::before,
    .header-acts a.header-exit-btn[href="/logout"]::before {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 16px !important;
        height: 16px !important;
    }

    .header-acts .header-support-btn::before {
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='black'%3E%3Cpath fill-rule='evenodd' d='M18 10a8 8 0 10-16 0v3.5A1.5 1.5 0 003.5 15H5v-5H3.04a7 7 0 0113.92 0H15v5h1.5a1.5 1.5 0 001.5-1.5V10zm-6 6a1 1 0 10-2 0 1 1 0 002 0zm-4 0a2 2 0 114 0 2 2 0 11-4 0z' clip-rule='evenodd'/%3E%3C/svg%3E") center / contain no-repeat !important;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='black'%3E%3Cpath fill-rule='evenodd' d='M18 10a8 8 0 10-16 0v3.5A1.5 1.5 0 003.5 15H5v-5H3.04a7 7 0 0113.92 0H15v5h1.5a1.5 1.5 0 001.5-1.5V10zm-6 6a1 1 0 10-2 0 1 1 0 002 0zm-4 0a2 2 0 114 0 2 2 0 11-4 0z' clip-rule='evenodd'/%3E%3C/svg%3E") center / contain no-repeat !important;
    }

    .header-acts a.header-exit-btn[href="/logout"]::before {
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='black'%3E%3Cpath fill-rule='evenodd' d='M3 4.75A1.75 1.75 0 014.75 3h5.5A1.75 1.75 0 0112 4.75v2a.75.75 0 01-1.5 0v-2a.25.25 0 00-.25-.25h-5.5a.25.25 0 00-.25.25v10.5c0 .138.112.25.25.25h5.5a.25.25 0 00.25-.25v-2a.75.75 0 011.5 0v2A1.75 1.75 0 0110.25 17h-5.5A1.75 1.75 0 013 15.25V4.75z' clip-rule='evenodd'/%3E%3Cpath fill-rule='evenodd' d='M13.22 6.22a.75.75 0 011.06 0l3.25 3.25a.75.75 0 010 1.06l-3.25 3.25a.75.75 0 11-1.06-1.06l1.97-1.97H8.75a.75.75 0 010-1.5h6.44l-1.97-1.97a.75.75 0 010-1.06z' clip-rule='evenodd'/%3E%3C/svg%3E") center / contain no-repeat !important;
        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='black'%3E%3Cpath fill-rule='evenodd' d='M3 4.75A1.75 1.75 0 014.75 3h5.5A1.75 1.75 0 0112 4.75v2a.75.75 0 01-1.5 0v-2a.25.25 0 00-.25-.25h-5.5a.25.25 0 00-.25.25v10.5c0 .138.112.25.25.25h5.5a.25.25 0 00.25-.25v-2a.75.75 0 011.5 0v2A1.75 1.75 0 0110.25 17h-5.5A1.75 1.75 0 013 15.25V4.75z' clip-rule='evenodd'/%3E%3Cpath fill-rule='evenodd' d='M13.22 6.22a.75.75 0 011.06 0l3.25 3.25a.75.75 0 010 1.06l-3.25 3.25a.75.75 0 11-1.06-1.06l1.97-1.97H8.75a.75.75 0 010-1.5h6.44l-1.97-1.97a.75.75 0 010-1.06z' clip-rule='evenodd'/%3E%3C/svg%3E") center / contain no-repeat !important;
    }

    .msg-container {
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    .msg-sidebar {
        overflow: visible !important;
    }

    .msg-conversations {
        height: auto !important;
        max-height: none !important;
        overflow-y: visible !important;
        overflow-x: hidden !important;
    }

    .msg-pagination {
        position: static !important;
    }
}

/* Admin P2P Boost Button */
.p2p-listing-card-wrapper {
    display: flex;
    flex-direction: column;
}

.p2p-listing-card-wrapper .p2p-listing-card {
    flex: 1;
}

.p2p-boost-btn {
    width: 100%;
    padding: 6px 12px;
    background: linear-gradient(135deg, #8b5cf6, #a855f7);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.p2p-boost-btn:hover {
    background: linear-gradient(135deg, #7c3aed, #9333ea);
    box-shadow: 0 0 8px rgba(139, 92, 246, 0.5);
}

body.light-theme .p2p-boost-btn {
    background: linear-gradient(135deg, #8b5cf6, #a855f7);
    color: #fff;
}

body.light-theme .p2p-boost-btn:hover {
    background: linear-gradient(135deg, #7c3aed, #9333ea);
}