/* =========================================
   1. Calendar Container & General
   ========================================= */
#ld-booking-calendar {
    max-width: 900px;
    margin: 40px auto;
    padding: 20px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

/* =========================================
   2. Text & Layout Fixes (حل مشكلة التفاف النص)
   ========================================= */
/* تحسين شكل الحدث داخل التقويم */
.fc-event {
    border-radius: 4px;
    border: none;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
    transition: transform 0.2s;
}

/* ضبط النص داخل المربع */
.fc-event-main {
    padding: 2px 4px;
    overflow: hidden; /* إخفاء الزائد بشكل جميل */
}

/* تصغير الخط قليلاً ليناسب المربع */
.fc-event-title {
    font-weight: 600 !important;
    font-size: 0.85em !important; /* تصغير الخط */
    white-space: normal !important; /* السماح بالتفاف النص بشكل صحيح */
    line-height: 1.2 !important;
}

.fc-event-time {
    font-size: 0.8em !important;
    opacity: 0.9;
    margin-bottom: 2px;
}

/* =========================================
   3. Color Statuses (ألوان مميزة جداً)
   ========================================= */

/* --- 1. Available (متاح) - أخضر --- */
.status-free {
    background-color: #10b981 !important; /* Emerald Green */
    border-left: 4px solid #065f46 !important; /* شريط جانبي غامق للتميز */
    color: #fff !important;
    cursor: pointer;
}
.status-free:hover {
    transform: translateY(-1px);
    background-color: #059669 !important;
}

/* --- 2. My Appointment (موعدي) - أزرق غامق --- */
/* هذا اللون مختلف تماماً عن الباقي */
.status-mine {
    background-color: #2563eb !important; /* Royal Blue */
    border-left: 4px solid #1e3a8a !important; /* Dark Blue Border */
    color: #fff !important;
    cursor: default;
    box-shadow: 0 0 0 2px #bfdbfe !important; /* توهج خفيف حول المربع */
}

/* --- 3. Booked by others (محجوز للغير) - أحمر --- */
.status-booked {
    background-color: #ef4444 !important; /* Red */
    border-left: 4px solid #991b1b !important;
    color: #fff !important;
    opacity: 0.7;
    cursor: not-allowed;
    text-decoration: line-through; /* خط على النص */
}

/* --- 4. Expired (منتهي) - رمادي فاتح --- */
/* يجب أن يكون باهت جداً ليدل أنه غير فعال */
.status-past {
    background-color: #e5e7eb !important; /* Light Gray */
    border: 1px solid #d1d5db !important;
    border-left: 4px solid #9ca3af !important;
    color: #6b7280 !important; /* Dark Gray Text */
    cursor: not-allowed;
    opacity: 0.6;
}

/* =========================================
   4. Messages & Modal (كما هي)
   ========================================= */
#ld-global-message, #ld-modal-message {
    padding: 12px;
    margin-bottom: 15px;
    border-radius: 6px;
    font-weight: 500;
    text-align: center;
}
.ld-msg-success { background-color: #d1fae5; color: #065f46; border: 1px solid #34d399; }
.ld-msg-error { background-color: #fee2e2; color: #991b1b; border: 1px solid #f87171; }

#ld-booking-modal {
    display: none; 
    position: fixed; 
    top: 50%; left: 50%; 
    transform: translate(-50%, -50%); 
    background: #ffffff; 
    width: 90%; max-width: 400px; 
    padding: 30px; 
    border-radius: 12px; 
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1); 
    z-index: 10000; 
    text-align: center; 
    border: 1px solid #e5e7eb;
}
#ld-booking-modal button { margin-top: 20px; }