.dashboard {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  font-size: 12px;
  margin-top: 20px;
}

/* بخش‌های عمومی */
.dashboard .welcome-section,
.dashboard .main-alert,
.dashboard .special-offers,
.dashboard .latest-news,
.dashboard .social-media {
  background-color: #ffffff;
  border: 1px solid #ced4da;
  border-radius: 4px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  padding: 20px 10px;
  width: 100%;
  max-width: 450px;
  transform: scale(1.05);
  position: relative;
}


.dashboard .latest-news,
.dashboard .social-media {
  margin-top: 10px;
}


/* متن داخل welcome */
.dashboard .welcome-section {
  text-align: justify;
  line-height: 25px;
}

/* عنوان‌های بالای هر کارت */
.dashboard .info-box {
  position: absolute;
  top: -13px;
  right: 20px;
  border-radius: 50px;
  background-color: #ffffff;
  padding: 5px 10px;
  font-weight: bold;
  color: #007bff;
}


/* بخش خبرها محدود به 5 خط */
.dashboard .latest-news .news-text {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.8em;
  max-height: calc(1.8em * 5);
  word-break: break-word; /* جلوگیری از شکستن ناخواسته */
}

.dashboard .body-news {
  margin: 0px;
  outline: #DCDCDC solid 0px;
}



/* ردیف‌ها در واکنش‌گرایی */
.dashboard-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 50px;
  width: 95%;
}

/* رنگ وضعیت‌ها */
.due-soon {
  color: #FF4C4C;
}

.unpaid-status {
  color: #FF4C4C;
  animation: blink 2s step-start infinite;
}

.paid-status {
  color: #00FF7F;
}

.cancel-status {
  color: gray;
}

@keyframes blink {
  50% {
    opacity: 0;
  }
}

/* آیکن خوش‌آمدگویی */
.dashboard .icon {
  display: block;
  margin: 0 auto 20px;
  font-size: 50px;
  color: #ff9900;
}

/* Policies Container */
.dashboard .Policies-container {
  display: flex;
  flex-direction: column;
  gap: 5px;
  background: var(--main-background-color);
  color: white;
  border: none;
  margin-top: 10px;
  padding: 5px;
  border-radius: 5px;
}

/* فضای پایینی شبکه اجتماعی */
.social-media {
  margin-bottom: 100px;
}

  
.dashboard .user-profile {
  display: flex;
  align-items: center;
  gap: 15px; /* فاصله بین آواتار و نام */
  padding: 10px 20px; /* فاصله از طرفین */
  margin-top:-22px;
  margin-right: -20px ; 
}

.dashboard .avatar {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 0 12px rgba(0, 128, 0, 0.5);
}

.dashboard .avatar:hover {
  transform: scale(1.1) rotate(-5deg);
}

.dashboard .user-name {
  font-size: 12px;
  font-weight: bold;
  color: #333;
  margin: 0; /* حذف فاصله پیش‌فرض h3 */
}


/* در حالت واکنش گرایی */
/* وقتی اندازه صفحه بزرگتر از 915 پیکسل شد */
@media only screen and (min-width: 915px){
.dashboard {
    display: flex;
    flex-direction:row;
    justify-content: center;
    align-items: flex-start;}
    
.dashboard .social-media {
  margin-top: 0px;
}
.dashboard-row {
 width: 480px;
}
}