/* Global Container Styles */
    .profile-container {
        background: #fefefe;
        min-height: 100vh;
        padding: 2rem 0;
    }

    /* Profile Card Styles */
    .profile-card {
        background: white;
        border-radius: 15px;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
        overflow: hidden;
        /* Added from view-profile styles, useful for grid layouts */
        margin-bottom: 2rem; 
    }

    /* Card Header Styles (Consolidated) */
    .profile-header {
        background: linear-gradient(135deg, #007bff, #0056b3);
        color: white;
        /* Using 2rem from edit-profile and 3rem 2rem from view-profile. A solid 2rem (top/bottom) 
           or 3rem 2rem (top/bottom, left/right) should be chosen based on preference. 
           Using the simpler, common `2rem` as base, but noting the variation. */
        padding: 2rem; 
        text-align: center;
        /* Added for positioning elements like avatar */
        position: relative; 
    }

    /* Card Body Styles */
    .profile-body {
        padding: 2rem;
    }

    /* Form Floating Styles (Specific to edit-profile forms) */
    .form-floating {
        margin-bottom: 1rem;
    }

    /* Primary Gradient Button Styles (Used for Save/Edit) */
    .btn-gradient, .btn-edit {
        background: linear-gradient(135deg, #007bff, #0056b3);
        border: none;
        color: white;
        padding: 12px;
        font-weight: 600;
        transition: all 0.3s ease;
    }

    .btn-gradient:hover, .btn-edit:hover {
        transform: translateY(-2px);
        box-shadow: 0 5px 15px rgba(0, 123, 255, 0.3);
    }
    
    /* Danger Button Styles (Used for Delete/Logout) */
    .btn-danger {
        background: linear-gradient(135deg, #dc3545, #c82333);
        border: none;
        transition: all 0.3s ease;
    }

    .btn-danger:hover {
        transform: translateY(-2px);
        box-shadow: 0 5px 15px rgba(220, 53, 69, 0.3);
    }

    /* Avatar Preview/Edit Styles (Specific to edit-profile forms) */
    .avatar-preview {
        width: 100px;
        height: 100px;
        border-radius: 50%;
        border: 3px solid #007bff;
        margin: 0 auto 1rem;
        background: #f8f9fa;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 2rem;
        color: #6c757d;
        overflow: hidden;
    }

    .avatar-preview img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* Profile Avatar (Larger, specific to view-profile) */
    .profile-avatar {
        width: 120px;
        height: 120px;
        border-radius: 50%;
        border: 4px solid white;
        margin: 0 auto 1rem;
        background: #f8f9fa;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 3rem;
        color: #6c757d;
    }

    .profile-avatar img {
        width: 100%;
        height: 100%;
        border-radius: 50%;
        object-fit: cover;
    }

    /* Section Title Styles (Specific to edit-profile forms) */
    .section-title {
        color: #495057;
        border-bottom: 2px solid #007bff;
        padding-bottom: 0.5rem;
        margin-bottom: 1.5rem;
    }

    /* Profile Section Styles (Specific to view-profile) */
    .profile-section {
        margin-bottom: 2rem;
    }

    .profile-section:last-child {
        margin-bottom: 0;
    }

    .profile-info-item {
        display: flex;
        /* Corrected from 'justify-content: between' to 'space-between' */
        justify-content: space-between; 
        align-items: center;
        padding: 0.75rem 0;
        border-bottom: 1px solid #e9ecef;
    }

    .profile-info-item:last-child {
        border-bottom: none;
    }

    .info-label {
        font-weight: 600;
        color: #495057;
        min-width: 120px;
    }

    .info-value {
        color: #6c757d;
    }

    .badge-verified {
        background: linear-gradient(135deg, #28a745, #20c997);
    }

    /* Stats Card Styles (Specific to view-profile) */
    .stats-card {
        background: white;
        border-radius: 10px;
        padding: 1.5rem;
        text-align: center;
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
        border: 1px solid #e9ecef;
        transition: transform 0.3s ease;
    }

    .stats-card:hover {
        transform: translateY(-5px);
    }

    .stats-number {
        font-size: 2rem;
        font-weight: 700;
        color: #007bff;
        margin-bottom: 0.5rem;
    }

    .stats-label {
        color: #6c757d;
        font-size: 0.9rem;
    }