.woocommerce-MyAccount-content {
    margin-top: -120px;
}

.car-seller-user-details {
    display: flex;
    align-items: center;
    width: 30%;
    color: #fff;
    background: #20104e;
    padding: 15px;
}
p.seller-type {
	font-size: 10px;
	background: #740209;
	border-radius: 15px;
	padding: 0px 15px;
	width: max-content;
	font-weight: bold;
}
span.username {
	font-weight: bold;
	font-size: 20px;
}

.user-avatar-container {
    margin-right: 20px; /* Adjust space between avatar and details */
}

.user-avatar {
    width: 80px; /* Adjust size of the avatar */
    height: 80px; /* Adjust size of the avatar */
    border-radius: 50%; /* Make the avatar round */
}

.user-details p {
    margin: 5px 0;
}


 /* Container for the icon */
        .submenu-container {
            position: relative;
            display: inline-block;
        }

        /* Initially hide the submenu */
        .submenu {
            display: none;
            position: absolute;
            top: 100%;
            right: 0;
            background-color: #fff;
            border: 1px solid #ddd;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            padding: 10px;
            min-width: 200px;
            z-index: 1000;
			text-align: left;
        }

        /* Styling the submenu items */
        .submenu a {
            display: block;
            padding: 8px 12px;
            text-decoration: none;
            color: #333;
            font-size: 14px;
        }

        .submenu a:hover {
            background-color: #f5f5f5;
        }

        /* Styling the icon */
        .fa-ellipsis-v {
            font-size: 24px;
            cursor: pointer;
        }

.noti-meta {
    display: flex;
    justify-content: space-between;
    font-weight: bold;
    font-size: 10px;
    margin-top: 10px;
}


.user-notifications {
    list-style-type: none;
    padding: 0;
}

.user-notifications .user-notification-item {
    padding: 10px;
    border: 1px solid #ddd;
    margin-bottom: 10px;
}

.user-notifications .user-notification-item.unread {
    background-color: #ffffff; 
	position: relative;
	color: #000000ab;
	    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    border: 2px solid #dddddd47;
}
ul.user-notifications{
	padding-left: 0 !important;
}
.user-notifications .user-notification-item.read {
    background-color: #e0e0e0; /* Darker gray for read */
    font-weight: normal;
}

.user-notifications .mark-as-read-button {
   	background-color: #740209;
    color: white;
    padding: 5px 10px;
    border: none;
    cursor: pointer;
    margin-top: 10px;
    font-size: 14px;
    position: absolute;
    right: -10px;
    top: -20px;
    border-radius: 50%;
    font-weight: bold;
}

.user-notifications .mark-as-read-button:hover {
    background-color: #005177;
}

.user-notifications a {
    color: #0073aa;
}

.blog-post .post-excerpt ul.user-notifications li.user-notification-item span.noti-badge {
    color: #fff;
    font-size: 12px !important;
    font-weight: bold;
    padding: 1px 15px;
    border-radius: 10px;
    text-transform: capitalize;
}
.blog-post .post-excerpt ul.user-notifications li.user-notification-item span.noti-badge.unread{
	 background: #20104e;
}

.blog-post .post-excerpt ul.user-notifications li.user-notification-item span.noti-badge.read {
    background: #20104e8c;
}

.blog-post .post-excerpt ul li a .noti-indicator {
    font-size: 10px !important;
    background: #740209;
    color: #fff;
    padding: 5px;
    border-radius: 50%;
    float: right;
    font-weight: bold;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.ad-closed img {
    left: 42px;
    position: absolute;
    top: 0;
    z-index: 1000;
}