/* 
 * VideoMarket Pro Stylesheet
 * Version: 2.4.0 (Withdrawal Popup Fix & Nested Comments)
 * Design: Ultra Glassmorphism / Spatial UI
 */

:root {
    --vmp-primary: #6366f1;       /* Indigo 500 */
    --vmp-primary-hover: #4f46e5; /* Indigo 600 */
    --vmp-secondary: #64748b;     /* Slate 500 */
    --vmp-success: #10b981;       /* Emerald 500 */
    --vmp-warning: #f59e0b;       /* Amber 500 */
    --vmp-danger: #ef4444;        /* Red 500 */
    --vmp-dark: #1e293b;          /* Slate 800 */
    --vmp-text: #334155;          /* Slate 700 */
    --vmp-light: #f8fafc;         /* Slate 50 */
    
    /* Glass Variables */
    --vmp-glass-bg: rgba(255, 255, 255, 0.75);
    --vmp-glass-border: rgba(255, 255, 255, 0.6);
    --vmp-glass-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.07);
    --vmp-glass-blur: blur(20px) saturate(180%);
    --vmp-radius: 24px;
    --vmp-radius-sm: 16px;
}

/* =========================================
   1. GLOBAL LAYOUT & ANIMATION
   ========================================= */
.vmp-glass-wrapper {
    position: relative !important;
    width: 100% !important;
    min-height: auto !important; 
    background: linear-gradient(to bottom, #f0f4f8 0%, #eef2ff 50%, #f0f4f8 100%) !important;
    overflow: hidden !important;
    padding-top: 60px !important;
    padding-bottom: 80px !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
    z-index: 1 !important; 
}

.vmp-container {
    max-width: 1240px !important;
    margin: 0 auto !important;
    padding: 0 20px !important;
    position: relative !important;
    z-index: 2 !important;
}

.vmp-container * {
    box-sizing: border-box !important;
}

/* Blobs Background */
.vmp-blob {
    position: absolute !important;
    border-radius: 50% !important;
    filter: blur(80px) !important;
    z-index: 0 !important;
    opacity: 0.5 !important;
    animation: vmpFloat 15s infinite alternate ease-in-out !important;
    pointer-events: none !important;
}
.vmp-blob-1 {
    top: 0% !important; left: -10% !important; width: 600px !important; height: 600px !important;
    background: radial-gradient(circle, #c7d2fe 0%, rgba(199,210,254,0) 70%) !important;
}
.vmp-blob-2 {
    bottom: 0% !important; right: -10% !important; width: 500px !important; height: 500px !important;
    background: radial-gradient(circle, #bae6fd 0%, rgba(186,230,253,0) 70%) !important; animation-delay: -5s !important;
}
@keyframes vmpFloat {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(30px, 50px) scale(1.1); }
}

/* Glass Card Base Style */
.vmp-glass-card {
    background: var(--vmp-glass-bg) !important;
    backdrop-filter: var(--vmp-glass-blur) !important;
    -webkit-backdrop-filter: var(--vmp-glass-blur) !important;
    border: 1px solid var(--vmp-glass-border) !important;
    border-radius: var(--vmp-radius) !important;
    box-shadow: var(--vmp-glass-shadow) !important;
    padding: 30px !important;
    margin-bottom: 30px !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    position: relative !important;
}
.vmp-glass-card.vmp-nopad-card {
    padding: 0 !important;
    overflow: hidden !important;
}

/* Dashboard Login Gate (Guest View) */
.vmp-login-gate {
    text-align: center !important;
    padding: 60px 40px !important;
    max-width: 500px !important;
    margin: 40px auto !important;
}

/* =========================================
   2. TYPOGRAPHY
   ========================================= */
.vmp-section-header {
    text-align: center !important;
    margin-bottom: 50px !important;
    position: relative !important;
    z-index: 2 !important;
}
.vmp-title {
    font-size: 2.5rem !important;
    font-weight: 800 !important;
    letter-spacing: -1px !important;
    margin-bottom: 10px !important;
    color: var(--vmp-dark) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 15px !important;
    line-height: 1.2 !important;
}
.vmp-title i {
    background: linear-gradient(135deg, var(--vmp-primary), #818cf8) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}
.vmp-text-muted { color: var(--vmp-secondary) !important; }

/* =========================================
   3. BUTTONS
   ========================================= */
.vmp-btn {
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    padding: 14px 28px !important; border-radius: 14px !important;
    font-weight: 700 !important; font-size: 0.95rem !important; cursor: pointer !important;
    border: none !important; text-decoration: none !important; gap: 8px !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important; outline: none !important;
    line-height: 1.2 !important;
    box-shadow: none !important; /* Reset Theme Shadow */
    text-transform: none !important; /* Reset Theme Transform */
}
.vmp-btn:active { transform: scale(0.97) !important; }
.vmp-btn-block { width: 100% !important; display: flex !important; }

.vmp-btn-primary { background: linear-gradient(135deg, var(--vmp-primary), #4338ca) !important; color: white !important; box-shadow: 0 4px 15px rgba(79, 70, 229, 0.3) !important; }
.vmp-btn-primary:hover { box-shadow: 0 8px 25px rgba(79, 70, 229, 0.4) !important; transform: translateY(-2px) !important; color: white !important; }

.vmp-btn-success { background: linear-gradient(135deg, var(--vmp-success), #059669) !important; color: white !important; box-shadow: 0 4px 15px rgba(16, 185, 129, 0.3) !important; }
.vmp-btn-success:hover { transform: translateY(-2px) !important; color: white !important; }

.vmp-btn-danger { background: linear-gradient(135deg, var(--vmp-danger), #dc2626) !important; color: white !important; }
.vmp-btn-outline { background: rgba(255,255,255,0.5) !important; border: 2px solid var(--vmp-primary) !important; color: var(--vmp-primary) !important; }
.vmp-btn-outline:hover { background: var(--vmp-primary) !important; color: white !important; }
.vmp-btn-light { background: rgba(255,255,255,0.8) !important; color: var(--vmp-dark) !important; border: 1px solid rgba(0,0,0,0.05) !important; }
.vmp-btn-light:hover { background: #fff !important; }
.vmp-btn-disabled { cursor: not-allowed !important; opacity: 0.6 !important; background: #e2e8f0 !important; color: #94a3b8 !important; box-shadow: none !important; }
.vmp-btn-text { background: none !important; border: none !important; color: var(--vmp-secondary) !important; text-decoration: underline !important; padding: 0 !important; cursor: pointer !important; }

.vmp-btn-sm { padding: 8px 16px !important; font-size: 0.85rem !important; border-radius: 10px !important; }
.vmp-btn-lg { padding: 16px 32px !important; font-size: 1.1rem !important; }

/* Pulse Animation */
@keyframes vmpPulse {
    0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); }
    70% { box-shadow: 0 0 0 12px rgba(16, 185, 129, 0); }
    100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}
.vmp-pulse-anim { animation: vmpPulse 2s infinite !important; }

/* =========================================
   4. FORMS & INPUTS
   ========================================= */
.vmp-form-wrapper {
    background: var(--vmp-glass-bg) !important;
    padding: 40px !important;
    border-radius: var(--vmp-radius) !important;
    box-shadow: var(--vmp-glass-shadow) !important;
    max-width: 900px !important;
    margin: 0 auto !important;
    border: 1px solid var(--vmp-glass-border) !important;
}

.vmp-form-group { margin-bottom: 25px !important; }
.vmp-form label { display: block !important; margin-bottom: 10px !important; font-weight: 700 !important; color: var(--vmp-dark) !important; font-size: 0.95rem !important; }

.vmp-form input[type="text"], .vmp-form input[type="number"], .vmp-form input[type="email"], 
.vmp-form input[type="password"], .vmp-form textarea, .vmp-form select {
    width: 100% !important; padding: 16px 20px !important;
    border-radius: 16px !important; border: 1px solid rgba(255,255,255,0.6) !important;
    background: rgba(255,255,255,0.5) !important; backdrop-filter: blur(10px) !important;
    color: var(--vmp-dark) !important; font-size: 1rem !important; transition: 0.3s !important;
    height: auto !important; box-shadow: inset 0 1px 2px rgba(0,0,0,0.03) !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    max-width: 100% !important;
}
.vmp-form input:focus, .vmp-form textarea:focus, .vmp-form select:focus {
    background: #fff !important; border-color: var(--vmp-primary) !important;
    outline: none !important; box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.15) !important;
}

.vmp-files-row {
    display: grid !important;
    grid-template-columns: 1fr 1fr 1fr !important;
    gap: 20px !important;
}

.vmp-file-input input {
    background: rgba(255,255,255,0.4) !important;
    border: 2px dashed rgba(99, 102, 241, 0.4) !important;
    padding: 20px !important;
    width: 100% !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    height: 100% !important;
}
.vmp-file-input input:hover { background: rgba(255,255,255,0.8) !important; border-color: var(--vmp-primary) !important; }

.vmp-row { display: flex !important; gap: 20px !important; flex-wrap: wrap !important; }
.vmp-col { flex: 1 !important; min-width: 250px !important; }
.vmp-progress-bar { height: 10px !important; background: var(--vmp-success) !important; border-radius: 5px !important; transition: width 0.3s !important; color: #fff !important; font-size: 10px !important; text-align: center !important; line-height: 10px !important; }
.vmp-progress-wrapper { background: #e2e8f0 !important; border-radius: 5px !important; overflow: hidden !important; }

/* =========================================
   5. TABS & FILTERS
   ========================================= */
.vmp-center-tabs { justify-content: center !important; }
.vmp-tabs {
    display: flex !important; gap: 8px !important; margin-bottom: 20px !important;
    background: rgba(255,255,255,0.3) !important; padding: 6px !important;
    border-radius: 18px !important; width: fit-content !important; margin-left: auto !important; margin-right: auto !important;
    border: 1px solid rgba(255,255,255,0.4) !important; flex-wrap: wrap !important;
}
.vmp-tab-link {
    background: transparent !important; border: none !important; padding: 10px 24px !important;
    border-radius: 12px !important; font-weight: 600 !important; color: var(--vmp-secondary) !important;
    cursor: pointer !important; transition: 0.3s !important;
}
.vmp-tab-link.active {
    background: #fff !important; color: var(--vmp-primary) !important;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05) !important;
}

.vmp-tab-content { 
    display: none !important;
    width: 100% !important;
    animation: none !important;
}
.vmp-tab-content.active-tab {
    display: block !important; 
    animation: vmpFadeIn 0.4s ease-out !important; 
}

/* Filter Chips */
.vmp-filter-bar { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 10px !important; margin-bottom: 30px !important; }
.vmp-filter-chip {
    display: inline-block !important; padding: 10px 20px !important; background: rgba(255,255,255,0.5) !important;
    border: 1px solid rgba(255,255,255,0.6) !important; border-radius: 30px !important; color: var(--vmp-secondary) !important;
    font-weight: 600 !important; transition: 0.2s !important; cursor: pointer !important;
}
.vmp-filter-chip:hover, .vmp-filter-chip.active {
    background: #fff !important; color: var(--vmp-primary) !important;
    border-color: var(--vmp-primary) !important; box-shadow: 0 4px 15px rgba(99, 102, 241, 0.2) !important;
}

/* =========================================
   6. SINGLE PRODUCT PAGE
   ========================================= */
.vmp-glass-nav { display: flex !important; justify-content: space-between !important; align-items: center !important; margin-bottom: 25px !important; }
.vmp-back-link {
    text-decoration: none !important; color: var(--vmp-secondary) !important; font-weight: 600 !important;
    background: rgba(255,255,255,0.6) !important; padding: 8px 16px !important; border-radius: 30px !important;
    display: inline-flex !important; align-items: center !important; gap: 5px !important;
}
.vmp-single-layout { display: grid !important; grid-template-columns: 2fr 1fr !important; gap: 30px !important; align-items: start !important; }

/* FIX: Image/Video Sizing for Optimization */
.vmp-video-aspect { position: relative !important; aspect-ratio: 16 / 9 !important; background: #000 !important; border-radius: var(--vmp-radius) !important; overflow: hidden !important; }
.vmp-glass-video, .vmp-glass-image { 
    width: 100% !important; 
    height: 100% !important; 
    object-fit: contain !important; /* Prevents cropping */
    max-height: 700px !important; /* Prevent huge vertical images */
}

.vmp-glass-title { font-size: 2.2rem !important; font-weight: 800 !important; margin: 0 0 15px !important; color: var(--vmp-dark) !important; line-height: 1.2 !important; }
.vmp-glass-meta { display: flex !important; justify-content: space-between !important; margin-bottom: 25px !important; padding-bottom: 15px !important; border-bottom: 1px solid rgba(0,0,0,0.05) !important; }
.vmp-glass-author { display: flex !important; align-items: center !important; gap: 12px !important; }
.vmp-glass-author img { width: 45px !important; height: 45px !important; border-radius: 50% !important; border: 2px solid #fff !important; }
.vmp-glass-author span { color: var(--vmp-secondary) !important; margin-right: 5px !important; font-size: 0.9em !important; }

/* Star Rating */
.vmp-glass-rating .stars { color: #cbd5e1 !important; font-size: 1.2rem !important; }
.vmp-glass-rating .stars .filled { color: var(--vmp-warning) !important; }

.vmp-glass-tabs { display: flex !important; gap: 10px !important; margin-bottom: 20px !important; background: rgba(255,255,255,0.5) !important; padding: 5px !important; border-radius: 12px !important; width: fit-content !important; }
.vmp-glass-tabs button { background: transparent !important; border: none !important; padding: 8px 16px !important; border-radius: 10px !important; font-weight: 600 !important; color: var(--vmp-secondary) !important; cursor: pointer !important; }
.vmp-glass-tabs button.active { background: #fff !important; color: var(--vmp-primary) !important; box-shadow: 0 2px 5px rgba(0,0,0,0.05) !important; }

.vmp-purchase-box { position: sticky !important; top: 30px !important; text-align: center !important; background: rgba(255,255,255,0.9) !important; border: 1px solid rgba(255,255,255,0.8) !important; }
.vmp-glass-price { font-size: 3rem !important; font-weight: 800 !important; color: var(--vmp-dark) !important; margin-bottom: 15px !important; letter-spacing: -1px !important; }
.vmp-glass-features { text-align: left !important; background: #f8fafc !important; padding: 20px !important; border-radius: 16px !important; margin-bottom: 20px !important; }
.vmp-glass-features div { display: flex !important; align-items: center !important; gap: 10px !important; margin-bottom: 8px !important; color: var(--vmp-text) !important; font-weight: 500 !important; }
.vmp-glass-features i { color: var(--vmp-success) !important; background: rgba(16, 185, 129, 0.1) !important; padding: 5px !important; border-radius: 50% !important; }
.vmp-secure-badge { margin-top: 15px !important; font-size: 0.85rem !important; color: var(--vmp-secondary) !important; display: flex !important; justify-content: center !important; align-items: center !important; gap: 5px !important; }

.vmp-glass-review-box { background: rgba(255,255,255,0.5) !important; border: 1px solid rgba(255,255,255,0.6) !important; border-radius: 16px !important; padding: 25px !important; margin-bottom: 30px !important; }
.vmp-stars-input { display: flex !important; flex-direction: row-reverse !important; justify-content: flex-end !important; margin-bottom: 15px !important; }
.vmp-stars-input label { font-size: 30px !important; color: #cbd5e1 !important; cursor: pointer !important; margin-right: 5px !important; transition: 0.2s !important; }
.vmp-stars-input label:hover, .vmp-stars-input label:hover ~ label, .vmp-stars-input input:checked ~ label { color: var(--vmp-warning) !important; }
.vmp-stars-input input { display: none !important; }

/* RECURSIVE COMMENTS FIX */
.vmp-glass-comments { margin-top: 30px !important; }
.vmp-glass-comment { 
    background: #fff !important; 
    border-radius: 16px !important; 
    padding: 20px !important; 
    margin-bottom: 15px !important; 
    border: 1px solid rgba(255,255,255,0.5) !important; 
    box-shadow: 0 2px 5px rgba(0,0,0,0.02) !important; 
    position: relative !important;
}

/* Recursive Container */
.vmp-replies { 
    margin-left: 30px !important; /* Indent for children */
    border-left: 2px solid rgba(0,0,0,0.05) !important; 
    padding-left: 0 !important; 
    margin-top: 10px !important; 
    list-style: none !important;
}

/* Fix for mobile or deep nesting: reduce indent if nested deeply */
.vmp-replies .vmp-replies {
    margin-left: 15px !important; 
}
.vmp-replies .vmp-replies .vmp-replies {
    margin-left: 10px !important; 
}

/* Connecting line visual fix (Optional) */
.vmp-replies .vmp-glass-comment {
    background: rgba(255,255,255,0.7) !important;
    margin-bottom: 10px !important;
    border: 1px solid rgba(0,0,0,0.05) !important;
}

.comment-head { display: flex !important; justify-content: space-between !important; margin-bottom: 10px !important; }
.comment-head img { width: 40px !important; height: 40px !important; border-radius: 50% !important; margin-right: 10px !important; }

.vmp-inline-reply-form { margin-top: 15px !important; padding-top: 15px !important; border-top: 1px dashed #e2e8f0 !important; animation: vmpFadeIn 0.3s ease-out !important; }
.vmp-inline-reply-form textarea { background: #f8fafc !important; }


/* =========================================
   7. MARKETPLACE & PROJECT LISTS
   ========================================= */
.vmp-glass-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 30px !important;
}

.vmp-card { background: var(--vmp-glass-bg) !important; border-radius: 20px !important; overflow: hidden !important; box-shadow: var(--vmp-glass-shadow) !important; transition: all 0.3s ease !important; border: 1px solid var(--vmp-glass-border) !important; display: flex !important; flex-direction: column !important; }
.vmp-card:hover, .vmp-glass-card.vmp-card-hover:hover { transform: translateY(-8px) !important; box-shadow: 0 20px 40px -5px rgba(0,0,0,0.1) !important; background: #fff !important; }

.vmp-card-video { position: relative !important; aspect-ratio: 16/9 !important; background: #000 !important; border-bottom: 1px solid rgba(0,0,0,0.05) !important; overflow: hidden !important; }
.vmp-card-video video, .vmp-card-video img { 
    width: 100% !important; 
    height: 100% !important; 
    object-fit: cover !important; 
}

.vmp-card-body { padding: 20px !important; flex-grow: 1 !important; display: flex !important; flex-direction: column !important; }
.vmp-card-body h3 { margin: 0 0 10px !important; font-size: 1.1rem !important; line-height: 1.4 !important; font-weight: 700 !important; }
.vmp-card-body h3 a { color: var(--vmp-dark) !important; text-decoration: none !important; }
.vmp-card-body h3 a:hover { color: var(--vmp-primary) !important; }

.vmp-card-footer { margin-top: auto !important; display: flex !important; justify-content: space-between !important; align-items: center !important; gap: 10px !important; }
.vmp-price-tag { font-weight: 800 !important; font-size: 1.1rem !important; color: var(--vmp-dark) !important; }

.vmp-author { display: flex !important; align-items: center !important; gap: 8px !important; color: var(--vmp-secondary) !important; font-size: 0.9rem !important; margin-bottom: 15px !important; }
.vmp-author img { border-radius: 50% !important; width: 28px !important; height: 28px !important; }

.vmp-load-more-container { text-align: center !important; margin-top: 40px !important; width: 100% !important; }

.vmp-project-card { padding: 30px !important; background: #fff !important; border-radius: 20px !important; box-shadow: var(--vmp-glass-shadow) !important; margin-bottom: 25px !important; border: 1px solid var(--vmp-glass-border) !important; }
.vmp-project-header { display: flex !important; justify-content: space-between !important; border-bottom: 1px solid #f1f5f9 !important; padding-bottom: 15px !important; margin-bottom: 15px !important; }
.vmp-project-title-row h3 { margin: 0 !important; font-size: 1.3rem !important; color: var(--vmp-dark) !important; }
.vmp-project-meta { display: flex !important; gap: 15px !important; color: var(--vmp-secondary) !important; font-size: 0.9rem !important; margin-top: 5px !important; }
.vmp-badge-status { padding: 5px 12px !important; border-radius: 8px !important; font-size: 0.8rem !important; font-weight: 700 !important; text-transform: uppercase !important; }
.vmp-badge-status.vmp-open { background: #e0e7ff !important; color: var(--vmp-primary) !important; }
.vmp-badge-status.vmp-working { background: #fff7ed !important; color: var(--vmp-warning) !important; }
.vmp-budget-tag { background: #f8fafc !important; padding: 4px 10px !important; border-radius: 6px !important; font-weight: 600 !important; border: 1px solid #e2e8f0 !important; }

.vmp-project-desc-container { max-height: 2.8em !important; overflow: hidden !important; position: relative !important; transition: max-height 0.5s ease !important; line-height: 1.6 !important; color: #475569 !important; margin-bottom: 20px !important; }
.vmp-project-desc-container.expanded { max-height: 600px !important; }
.vmp-desc-fade { position: absolute !important; bottom: 0 !important; width: 100% !important; height: 100% !important; background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1) 90%) !important; }
.vmp-project-desc-container.expanded .vmp-desc-fade { display: none !important; }
.vmp-center-btn { text-align: center !important; margin-top: -10px !important; position: relative !important; z-index: 5 !important; margin-bottom: 25px !important; }

.vmp-read-more-btn { background: #fff !important; border: 1px solid #e2e8f0 !important; color: var(--vmp-primary) !important; font-weight: 600 !important; padding: 5px 15px !important; border-radius: 20px !important; cursor: pointer !important; box-shadow: 0 2px 5px rgba(0,0,0,0.05) !important; }

/* =========================================
   8. DASHBOARD & FILES
   ========================================= */
.vmp-dash-header-card { display: flex !important; justify-content: space-between !important; align-items: center !important; padding: 30px !important; border-radius: 20px !important; margin-bottom: 30px !important; flex-wrap: wrap !important; gap: 20px !important; }
.vmp-user-profile { display: flex !important; align-items: center !important; gap: 20px !important; }
.vmp-avatar-img { border-radius: 50% !important; border: 4px solid rgba(255,255,255,0.5) !important; box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important; width: 80px !important; height: 80px !important; object-fit: cover !important; }
.vmp-wallet-card { text-align: right !important; background: linear-gradient(135deg, var(--vmp-primary), #4338ca) !important; color: white !important; padding: 25px 40px !important; border-radius: 20px !important; box-shadow: 0 10px 30px rgba(79, 70, 229, 0.4) !important; }
.vmp-wallet-amount { font-size: 2.2rem !important; display: block !important; margin: 5px 0 15px !important; }

.vmp-files-list { display: flex !important; flex-direction: column !important; gap: 15px !important; margin-top: 20px !important; }
.vmp-file-row { display: flex !important; justify-content: space-between !important; align-items: center !important; background: #fff !important; padding: 20px !important; border-radius: 16px !important; box-shadow: 0 2px 10px rgba(0,0,0,0.03) !important; transition: 0.2s !important; border: 1px solid #f1f5f9 !important; }
.vmp-file-row:hover { transform: translateY(-2px) !important; box-shadow: 0 5px 15px rgba(0,0,0,0.05) !important; border-color: var(--vmp-primary) !important; }
.vmp-file-info { display: flex !important; align-items: center !important; gap: 15px !important; font-weight: 500 !important; color: var(--vmp-dark) !important; }
.vmp-file-info i { font-size: 1.5rem !important; color: var(--vmp-primary) !important; }

.vmp-table-container { overflow-x: auto !important; border-radius: 20px !important; background: #fff !important; box-shadow: var(--vmp-glass-shadow) !important; }
.vmp-modern-table { width: 100% !important; border-collapse: collapse !important; text-align: center !important; }
.vmp-modern-table th { background: #f8fafc !important; color: var(--vmp-secondary) !important; font-weight: 700 !important; padding: 20px !important; border-bottom: 1px solid #e2e8f0 !important; text-align: center !important; }
.vmp-modern-table td { padding: 20px !important; border-bottom: 1px solid #f1f5f9 !important; vertical-align: middle !important; color: var(--vmp-dark) !important; }
.vmp-modern-table tr:hover td { background: #f8fafc !important; }
.vmp-modern-table tr[data-link] { cursor: pointer !important; }
.vmp-table-thumb { border-radius: 8px !important; width: 60px !important; height: 40px !important; object-fit: cover !important; margin: 0 auto !important; display: block !important; }
.vmp-text-success { color: var(--vmp-success) !important; }
.vmp-text-danger { color: var(--vmp-danger) !important; }

.vmp-action-box { padding: 20px !important; border-radius: 16px !important; margin-top: 15px !important; }
.vmp-action-box.warning { background: #fff7ed !important; border: 1px solid #ffedd5 !important; }
.vmp-action-box.success { background: #f0fdf4 !important; border: 1px solid #dcfce7 !important; }
.vmp-mt-2 { margin-top: 15px !important; }

.vmp-profile-box { max-width: 800px !important; margin: 0 auto !important; }
.vmp-profile-box h4 { margin-bottom: 25px !important; font-size: 1.5rem !important; border-bottom: 1px solid #f1f5f9 !important; padding-bottom: 15px !important; }
.vmp-profile-actions { display: flex !important; justify-content: space-between !important; align-items: center !important; margin-top: 30px !important; border-top: 1px solid #f1f5f9 !important; padding-top: 20px !important; }

/* =========================================
   9. AUTH MODAL
   ========================================= */
.vmp-modal {
    display: none; 
    position: fixed !important;
    z-index: 2147483647 !important; 
    left: 0 !important;
    top: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background-color: rgba(15, 23, 42, 0.6) !important; 
    backdrop-filter: blur(15px) !important; 
    -webkit-backdrop-filter: blur(15px) !important;
    align-items: center !important;
    justify-content: center !important;
    overflow-y: auto !important;
    padding: 20px !important;
}

.vmp-modal-content {
    background: rgba(255, 255, 255, 0.95) !important;
    padding: 40px !important;
    border-radius: 30px !important;
    width: 100% !important;
    max-width: 480px !important;
    position: relative !important;
    box-shadow: 0 30px 60px -15px rgba(0,0,0,0.3), 0 0 0 1px rgba(255,255,255,0.5) !important;
    border: 1px solid rgba(255,255,255,0.8) !important;
    animation: vmpModalIn 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) forwards !important; 
    margin: auto !important;
    text-align: center !important;
    transform: none !important; 
}

.vmp-modal-content h3 {
    margin-top: 0 !important;
    margin-bottom: 25px !important;
    font-size: 1.8rem !important;
    font-weight: 800 !important;
    color: var(--vmp-dark) !important;
}

.vmp-auth-tabs {
    background: #f1f5f9 !important;
    padding: 5px !important;
    border-radius: 14px !important;
    display: flex !important;
    margin-bottom: 25px !important;
}
.vmp-auth-tabs button {
    flex: 1 !important;
    border-radius: 10px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--vmp-secondary) !important;
    padding: 10px !important;
}
.vmp-auth-tabs button.active {
    background: #fff !important;
    color: var(--vmp-primary) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05) !important;
}

.vmp-close-modal {
    position: absolute !important;
    right: 20px !important;
    top: 20px !important;
    width: 35px !important;
    height: 35px !important;
    background: #f1f5f9 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 20px !important;
    cursor: pointer !important;
    color: #64748b !important;
    transition: 0.2s !important;
}
.vmp-close-modal:hover {
    background: #e2e8f0 !important;
    color: var(--vmp-danger) !important;
    transform: rotate(90deg) !important;
}

.vmp-auth-form input {
    background: #f8fafc !important;
    border: 2px solid #e2e8f0 !important;
    margin-bottom: 15px !important;
    padding: 15px !important;
    font-size: 1rem !important;
    transition: 0.2s !important;
}
.vmp-auth-form input:focus {
    border-color: var(--vmp-primary) !important;
    background: #fff !important;
}

.vmp-auth-message {
    display: none;
    padding: 12px 15px !important;
    border-radius: 12px !important;
    margin-bottom: 20px !important;
    font-size: 0.95rem !important;
    text-align: left !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
}
.vmp-msg-error {
    background: rgba(239, 68, 68, 0.1) !important;
    color: #b91c1c !important;
    border: 1px solid rgba(239, 68, 68, 0.2) !important;
}
.vmp-msg-success {
    background: rgba(16, 185, 129, 0.1) !important;
    color: #047857 !important;
    border: 1px solid rgba(16, 185, 129, 0.2) !important;
}

/* =========================================
   10. SWEET ALERT CUSTOM STYLES (FIXED)
   ========================================= */
/* FIX: Force SweetAlert Styles over Theme Defaults */
div.swal2-container div.swal2-popup.vmp-glass-swal {
    border-radius: 30px !important;
    padding: 30px !important;
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(255,255,255,0.6) !important;
    box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25) !important;
    font-family: inherit !important;
}

div.swal2-container div.swal2-popup.vmp-glass-swal .swal2-title {
    font-size: 1.8rem !important;
    font-weight: 800 !important;
    color: var(--vmp-dark) !important;
    padding-bottom: 20px !important;
    line-height: 1.2 !important;
}

.vmp-swal-form {
    text-align: left !important;
    margin-top: 10px !important;
    width: 100% !important;
}

.vmp-swal-label {
    display: block !important;
    margin-bottom: 8px !important;
    font-weight: 700 !important;
    color: var(--vmp-text) !important;
    font-size: 0.95rem !important;
    margin-top: 15px !important;
    text-align: left !important;
}

/* FIX: Input Styles in Popup (Override Theme) */
div.swal2-container div.swal2-popup.vmp-glass-swal .vmp-swal-input {
    width: 100% !important;
    padding: 14px 16px !important;
    border-radius: 12px !important;
    border: 2px solid #e2e8f0 !important;
    background: #f8fafc !important;
    font-size: 1rem !important;
    transition: 0.2s !important;
    box-sizing: border-box !important;
    height: auto !important;
    line-height: normal !important;
    margin: 0 !important;
    color: #334155 !important;
    box-shadow: none !important;
    display: block !important;
    max-width: 100% !important;
}

div.swal2-container div.swal2-popup.vmp-glass-swal .vmp-swal-input:focus {
    border-color: var(--vmp-primary) !important;
    background: #fff !important;
    outline: none !important;
    box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.1) !important;
}

.vmp-swal-note {
    font-size: 0.9rem !important;
    color: var(--vmp-secondary) !important;
    margin-bottom: 20px !important;
    background: #f1f5f9 !important;
    padding: 12px !important;
    border-radius: 10px !important;
    text-align: center !important;
    border: 1px solid #e2e8f0 !important;
}

/* Action Buttons in SweetAlert */
div.swal2-container div.swal2-actions {
    margin-top: 25px !important;
    gap: 15px !important;
}
div.swal2-container button.swal2-confirm {
    background: linear-gradient(135deg, var(--vmp-primary), #4338ca) !important;
    border-radius: 12px !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
    box-shadow: 0 4px 15px rgba(79, 70, 229, 0.3) !important;
}
div.swal2-container button.swal2-cancel {
    background: #f1f5f9 !important;
    color: var(--vmp-secondary) !important;
    border-radius: 12px !important;
    padding: 12px 24px !important;
    font-weight: 600 !important;
}

/* Animations */
@keyframes vmpFadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes vmpModalIn { 
    from { opacity: 0; transform: scale(0.9); } 
    to { opacity: 1; transform: scale(1); } 
}
.vmp-animate-up { animation: vmpFadeIn 0.6s ease-out forwards !important; }

/* Responsive */
@media (max-width: 992px) {
    .vmp-glass-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 768px) {
    .vmp-glass-grid { grid-template-columns: 1fr !important; }
    .vmp-files-row { grid-template-columns: 1fr !important; }
    .vmp-single-layout { grid-template-columns: 1fr !important; }
    .vmp-dash-header-card { flex-direction: column !important; text-align: center !important; }
    .vmp-user-profile { flex-direction: column !important; }
    .vmp-wallet-card { width: 100% !important; margin-top: 20px !important; }
    
    /* Better nesting on mobile */
    .vmp-replies { margin-left: 15px !important; }
}