/**
 * Common Messages Styles for Vendor Dashboard Pro - these styles should apply to both list and view pages
 *
 * @package Vendor Dashboard Pro
 */

/* Messages Content Container */
.vdp-messages-content,
.vdp-message-view-content {
    max-width: 100%;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

/* Stats Section */
.vdp-messages-stats {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    gap: 1.5rem !important;
    position: relative !important;
    z-index: 2 !important;
}

.vdp-stat-box {
    display: flex !important;
    align-items: center !important;
    flex: 1 !important;
    min-width: 180px !important;
    max-width: 25% !important;
    margin-bottom: 10px !important;
}

@media (min-width: 768px) {
    .vdp-messages-stats {
        flex-direction: row !important;
    }
    
    .vdp-stat-box {
        margin-bottom: 0 !important;
    }
}

/* Message View Styles */
.vdp-message-header-section {
    background-color: white !important;
    border-radius: 12px !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05) !important;
    padding: 1.5rem !important;
    margin-bottom: 1.5rem !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    flex-wrap: wrap !important;
    gap: 1rem !important;
}