/* فایل: seat-reservation.css */

/* تعریف متغیرهای CSS برای دسترسی در جاوا اسکریپت (رنگ‌های استاندارد Tailwind) */
:root {
    --color-blue-100: #dbeafe;
    --color-blue-400: #60a5fa;
    --color-blue-600: #2563eb;
    --color-blue-800: #1e40af;
    
    --color-green-100: #d1fae5;
    --color-green-400: #34d399;
    --color-green-600: #059669;
    --color-green-800: #065f46;
    
    --color-purple-100: #f3e8ff;
    --color-purple-400: #a78bfa;
    --color-purple-600: #7c3aed;
    --color-purple-800: #5b21b6;

    --color-red-100: #fee2e2;
    --color-red-400: #f87171;
    --color-red-600: #dc2626;
    --color-red-800: #991b1b;

    --color-yellow-100: #fef9c3;
    --color-yellow-400: #facc15;
    --color-yellow-600: #d97706;
    --color-yellow-800: #92400e;

    --color-indigo-100: #e0e7ff;
    --color-indigo-400: #818cf8;
    --color-indigo-600: #4f46e5;
    --color-indigo-800: #3730a3;

    --color-gray-400: #9ca3af;
    --color-gray-600: #4b5563;
    --color-gray-800: #1f2937;
}

/* ** شروع CSS Scoping ** */
/* تمام استایل‌های عمومی را با شناسه wrapper محدود کنید */
#tr-seat-reservation-wrapper {
    /* بازنشانی فونت و باکس مدل فقط برای این بخش */
    box-sizing: border-box; 
    font-family: 'Tahoma', sans-serif;
    direction: rtl; /* تضمین RTL */
}

/* Custom CSS from the original HTML source */
#tr-seat-reservation-wrapper .seat {
    transition: all 0.3s ease;
}
#tr-seat-reservation-wrapper .seat:hover {
    transform: scale(1.1);
}

.modal {
    backdrop-filter: blur(5px);
}
.barcode-container {
    background: white;
    padding: 10px;
    border-radius: 8px;
    text-align: center;
}
.drag-handle {
    cursor: move;
}
.section-container {
    position: relative;
}

/* --- Matrix Designer Styles --- */
.matrix-cell {
    min-height: 80px;
    border: 2px dashed #d1d5db;
    border-radius: 8px;
    transition: all 0.3s ease;
    background-color: #f9fafb; /* رنگ زمینه روشن */
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}
.matrix-cell.drag-over {
    border-color: #3b82f6;
    background-color: #eff6ff;
    transform: scale(1.02);
}
.matrix-cell.occupied {
    border-style: solid; 
    border-width: 3px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.06);
}

.section-item {
    cursor: grab;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); 
    border: 1px solid rgba(255, 255, 255, 0.3);
}
.section-item:active {
    cursor: grabbing;
}

/* استایل‌های انتخاب چند خانه */
.matrix-cell.selecting {
    border-color: #3b82f6;
    background-color: #dbeafe;
    border-style: solid;
}
.matrix-cell.selected-for-merge {
    border-color: var(--color-green-600) !important;
    background-color: var(--color-green-100) !important;
    box-shadow: 0 0 10px rgba(5, 150, 105, 0.5);
}

/* استایل برای نام بخش در حالت Multi-Cell */
.multi-cell-section {
    pointer-events: none; /* جلوگیری از تداخل با درگ */
}