 /* تأثيرات البطاقات */
 .time-slot-selector .ant-card {
   border-radius: 12px;
   transition: all 0.3s ease; 
 } 
 /* تأثيرات الأزرار */
 .time-slot-selector .ant-btn {
   border-radius: 8px;
   font-weight: 500;
   transition: all 0.2s ease;
 }

 .time-slot-selector .ant-btn:hover:not(:disabled) {
   transform: translateY(-1px);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
 }

 .time-slot-selector .ant-btn:active {
   transform: translateY(0);
 }

 /* تأثيرات DatePicker */
 .time-slot-selector .ant-picker {
   border-radius: 8px;
   border: 2px solid #e5e7eb;
   transition: all 0.2s ease;
 }

/* تأثيرات شبكة الأوقات - Row & Col */
.time-slot-selector .ant-row {
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 #f8fafc;
}

.time-slot-selector .ant-row::-webkit-scrollbar {
  width: 6px;
}

.time-slot-selector .ant-row::-webkit-scrollbar-track {
  background: #f8fafc;
  border-radius: 3px;
}

.time-slot-selector .ant-row::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 3px;
  border: none;
  transition: background 0.2s ease;
}

.time-slot-selector .ant-row::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

.time-slot-selector .ant-row::-webkit-scrollbar-corner {
  background: transparent;
}

/* تحسينات للـ Col */
.time-slot-selector .ant-col {
  margin-bottom: 12px;
}

/* تأثيرات الأزرار في الـ Col */
.time-slot-selector .ant-col .ant-btn {
  width: 100%;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Custom scrollbar class (مطابق لـ DurationSelector) */
.custom-scrollbar::-webkit-scrollbar {
  width: 6px;
}

.custom-scrollbar::-webkit-scrollbar-track {
  background: #f8fafc;
  border-radius: 3px;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 3px;
  transition: background 0.2s ease;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

 /* تأثيرات الأيقونات */
 .time-slot-selector .anticon {
   transition: all 0.2s ease;
 }

 .time-slot-selector .anticon:hover {
   transform: scale(1.1);
 }

 /* تأثيرات Labels */
 .time-slot-selector label {
   font-weight: 600;
   color: #374151;
   transition: color 0.2s ease;
 }

 .time-slot-selector label:hover {
   color: #1f2937;
 }

 /* تأثيرات النصوص */
 .time-slot-selector .ant-typography {
   transition: color 0.2s ease;
 }

 /* تأثيرات الأزرار المتاحة */
 .time-slot-selector .ant-btn.bg-white {
   background: #ffffff;
   border: 1px solid #e5e7eb;
 }

 .time-slot-selector .ant-btn.bg-white:hover {
   background: #f8fafc;
   border-color: #d1d5db;
   color: #374151;
 }

 /* تأثيرات الأزرار المعطلة */
 .time-slot-selector .ant-btn.bg-gray-100 {
   background: #fafafa;
   border: 1px solid #f3f4f6;
   cursor: not-allowed;
   opacity: 0.7;
 }

 /* تأثيرات الانتقال */
 .time-slot-selector * {
   transition: all 0.2s ease;
 }

/* تحسينات للشاشات الصغيرة */
@media (max-width: 768px) {
  .time-slot-selector .ant-col {
    flex: 0 0 50%; /* عمودين في الشاشات الصغيرة */
    max-width: 50%;
  }

  .time-slot-selector .ant-row {
    margin-left: -4px;
    margin-right: -4px;
  }

  .time-slot-selector .ant-row > .ant-col {
    padding-left: 4px;
    padding-right: 4px;
  }

  .time-slot-selector .flex-col.md\:flex-row {
    flex-direction: column;
  }
}

/* تحسينات للشاشات المتوسطة */
@media (max-width: 992px) and (min-width: 769px) {
  .time-slot-selector .ant-col {
    flex: 0 0 33.333333%; /* 3 أعمدة في الشاشات المتوسطة */
    max-width: 33.333333%;
  }
}

 .ant-card-body {
   padding: 0px !important;
   padding-bottom: 10px !important;
 }