/**
 * VPD Professional Styles - Sans Emojis IA
 * Design professionnel avec badges texte
 * 
 * @package VPD
 * @version 2.1.2
 */

/* ========================================
   HEADERS PROFESSIONNELS
   ======================================== */

/* Hero Section - Clean & Professional */
.vpd-hero {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
    padding: 80px 24px 60px !important;
    text-align: center;
    border-bottom: 2px solid rgba(99, 102, 241, 0.2);
    position: relative;
    overflow: hidden;
}

.vpd-hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(circle at 20% 50%, rgba(99, 102, 241, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 80% 80%, rgba(236, 72, 153, 0.08) 0%, transparent 50%);
    pointer-events: none;
}

.vpd-hero-content {
    position: relative;
    z-index: 1;
    max-width: 900px;
    margin: 0 auto;
}

.vpd-hero-title {
    font-size: clamp(2.5rem, 6vw, 4.5rem) !important;
    font-weight: 900 !important;
    margin: 0 0 24px 0 !important;
    background: linear-gradient(135deg, #ffffff 0%, #cbd5e1 100%);
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    line-height: 1.1 !important;
    letter-spacing: -0.02em !important;
}

/* Supprime les emojis/spans dans le titre */
.vpd-hero-title span {
    display: none !important;
}

.vpd-hero-subtitle {
    font-size: 1.25rem !important;
    color: #94a3b8 !important;
    margin: 0 auto 32px !important;
    max-width: 600px !important;
    line-height: 1.6 !important;
    font-weight: 400 !important;
}

/* Stats - Professional Design */
.vpd-quick-stats {
    display: flex !important;
    gap: 48px !important;
    justify-content: center !important;
    margin-top: 48px !important;
    flex-wrap: wrap !important;
}

.vpd-stat {
    text-align: center !important;
    padding: 0 !important;
}

.vpd-stat-value {
    display: block !important;
    font-size: 3.5rem !important;
    font-weight: 800 !important;
    background: linear-gradient(135deg, #6366f1, #ec4899);
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
    line-height: 1 !important;
    margin-bottom: 8px !important;
}

.vpd-stat-label {
    font-size: 0.875rem !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-weight: 600 !important;
}

/* ========================================
   FILE TYPE BADGES - Professional Text
   ======================================== */

/* Badge container pour remplacer les emojis */
.vpd-file-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 48px !important;
    height: 48px !important;
    padding: 0 12px !important;
    border-radius: 8px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    color: #ffffff !important;
    background: #6366f1 !important;
    box-shadow: 0 2px 8px rgba(99, 102, 241, 0.3) !important;
}

/* Couleurs par type de fichier */
.vpd-file-badge[data-type="pdf"],
.vpd-file-badge[data-type="doc"],
.vpd-file-badge[data-type="docx"],
.vpd-file-badge[data-type="txt"] {
    background: #ef4444 !important; /* Rouge - Documents */
}

.vpd-file-badge[data-type="xls"],
.vpd-file-badge[data-type="xlsx"],
.vpd-file-badge[data-type="csv"] {
    background: #10b981 !important; /* Vert - Excel */
}

.vpd-file-badge[data-type="ppt"],
.vpd-file-badge[data-type="pptx"] {
    background: #f59e0b !important; /* Orange - PowerPoint */
}

.vpd-file-badge[data-type="zip"],
.vpd-file-badge[data-type="rar"],
.vpd-file-badge[data-type="7z"],
.vpd-file-badge[data-type="tar"],
.vpd-file-badge[data-type="gz"] {
    background: #8b5cf6 !important; /* Violet - Archives */
}

.vpd-file-badge[data-type="jpg"],
.vpd-file-badge[data-type="jpeg"],
.vpd-file-badge[data-type="png"],
.vpd-file-badge[data-type="gif"],
.vpd-file-badge[data-type="svg"],
.vpd-file-badge[data-type="webp"] {
    background: #ec4899 !important; /* Rose - Images */
}

.vpd-file-badge[data-type="mp3"],
.vpd-file-badge[data-type="wav"],
.vpd-file-badge[data-type="flac"] {
    background: #06b6d4 !important; /* Cyan - Audio */
}

.vpd-file-badge[data-type="mp4"],
.vpd-file-badge[data-type="avi"],
.vpd-file-badge[data-type="mov"] {
    background: #8b5cf6 !important; /* Violet - Vidéo */
}

.vpd-file-badge[data-type="psd"],
.vpd-file-badge[data-type="ai"],
.vpd-file-badge[data-type="fig"],
.vpd-file-badge[data-type="sketch"] {
    background: #f59e0b !important; /* Orange - Design */
}

.vpd-file-badge[data-type="exe"],
.vpd-file-badge[data-type="msi"],
.vpd-file-badge[data-type="dmg"] {
    background: #64748b !important; /* Slate - Logiciels */
}

.vpd-file-badge[data-type="epub"],
.vpd-file-badge[data-type="mobi"] {
    background: #14b8a6 !important; /* Teal - Ebooks */
}

/* ========================================
   LIBRARY HEADER - Professional
   ======================================== */

.vpd-library-hero {
    background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
    padding: 60px 24px 40px !important;
    text-align: center;
    border-bottom: 2px solid rgba(99, 102, 241, 0.2);
}

.vpd-library-hero h1 {
    font-size: clamp(2rem, 5vw, 3.5rem) !important;
    font-weight: 900 !important;
    margin: 0 0 16px 0 !important;
    background: linear-gradient(135deg, #ffffff, #cbd5e1);
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    background-clip: text !important;
}

.vpd-library-hero p {
    font-size: 1.125rem !important;
    color: #94a3b8 !important;
    margin: 0 auto !important;
    max-width: 600px !important;
}

/* Supprime les emojis */
.vpd-library-hero h1 span,
.vpd-library-hero span[role="img"] {
    display: none !important;
}

/* ========================================
   CATEGORIES & VENDORS - Clean Icons
   ======================================== */

.vpd-category-icon,
.vpd-vendor-avatar {
    background: linear-gradient(135deg, #6366f1, #8b5cf6) !important;
    border: 3px solid rgba(99, 102, 241, 0.2) !important;
}

/* Supprime les emojis dans les categories */
.vpd-category-icon span,
.vpd-vendor-avatar span {
    display: none !important;
}

/* Utilise des initiales au lieu d'emojis */
.vpd-category-icon::before,
.vpd-vendor-avatar::before {
    content: attr(data-initial) !important;
    font-size: 2rem !important;
    font-weight: 800 !important;
    color: #ffffff !important;
}

/* ========================================
   BOUTONS VPD - Professional
   ======================================== */

.vpd-btn,
button[class*="vpd-btn"] {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    padding: 14px 28px !important;
    border-radius: 10px !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    min-height: 50px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
}

.vpd-btn-primary {
    background: #6366f1 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(99, 102, 241, 0.4) !important;
}

.vpd-btn-primary:hover {
    background: #4f46e5 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(99, 102, 241, 0.5) !important;
}

.vpd-btn-download {
    background: #10b981 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(16, 185, 129, 0.4) !important;
}

.vpd-btn-download:hover {
    background: #059669 !important;
    transform: translateY(-2px) !important;
}

/* Cache les SVG dans les boutons */
.vpd-btn svg {
    display: none !important;
}

/* ========================================
   CARDS - Professional Sans Emojis
   ======================================== */

.vpd-product-card,
.vpd-library-item {
    background: #1e293b !important;
    border-radius: 16px !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    transition: all 0.3s ease !important;
}

.vpd-product-card:hover,
.vpd-library-item:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6) !important;
    border-color: rgba(99, 102, 241, 0.5) !important;
}

/* ========================================
   RESPONSIVE
   ======================================== */

@media (max-width: 767px) {
    .vpd-hero {
        padding: 60px 20px 40px !important;
    }
    
    .vpd-hero-title {
        font-size: 2rem !important;
    }
    
    .vpd-hero-subtitle {
        font-size: 1rem !important;
    }
    
    .vpd-quick-stats {
        gap: 32px !important;
    }
    
    .vpd-stat-value {
        font-size: 2.5rem !important;
    }
    
    .vpd-file-badge {
        min-width: 40px !important;
        height: 40px !important;
        font-size: 10px !important;
    }
}

/* ========================================
   SUPPRESSION GLOBALE EMOJIS
   ======================================== */

/* Supprime tous les emojis standalone */
.vpd-store-page span[role="img"],
.vpd-digital-library span[role="img"],
.vpd-categories-page span[role="img"],
.vpd-vendors-page span[role="img"] {
    display: none !important;
}

/* Force le texte sans emojis */
h1 span,
h2 span,
h3 span {
    font-family: inherit !important;
}