﻿.table-container {
    overflow-x: auto;
    width: 100%;
}

table.rz-grid-lines-both {
    border-collapse: collapse !important;
    width: 100% !important;
    border: 1px solid var(--rz-base-500) !important;
    border-radius: 0;
}

    table.rz-grid-lines-both th,
    table.rz-grid-lines-both td {
        border: 1px solid var(--rz-base-500) !important;
        padding: 8px !important;
        text-align: left !important;
        vertical-align: middle;
    }

        /* --- THEME-AWARE STICKY COLUMN STYLING --- */
        table.rz-grid-lines-both th:first-child,
        table.rz-grid-lines-both td:first-child {
            position: sticky;
            left: 0;
            /* Use Radzen's variable for a theme-aware background */
            background-color: var(--rz-base-300);
        }

    table.rz-grid-lines-both th {
        /* Use Radzen's variable for header backgrounds */
        background-color: var(--rz-base-300);
    }


.room-column {
    width: 200px;
    min-width: 180px;
    max-width: 250px;
    vertical-align: middle;
}

.date-column {
    min-width: 110px;
    text-align: center;
    vertical-align: top;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal;
}

td.date-column { /* Specifically target TD for reservation text alignment */
    text-align: left;
}

.hover-effect:hover {
    background-color: var(--rz-base-200);
    border-radius: var(--rz-border-radius);
}

/* --- THEME-AWARE STATUS CLASSES --- */
.table-success {
    background-color: var(--rz-success-lighter) !important;
    color: var(--rz-success-dark) !important;
}

.table-warning {
    background-color: var(--rz-warning-lighter) !important;
    color: var(--rz-warning-dark) !important;
}

.table-danger {
    background-color: var(--rz-danger-lighter) !important;
    color: var(--rz-danger-dark) !important;
}

 /* ================================================= */
    /* ==   أنماط خاصة بالموبايل (الشاشات الصغيرة)   == */
    /* ================================================= */
    @media (max-width: 768px) {
        
        /* تصغير حجم خطوط عناوين الجدول (التواريخ) وتقليل الحد الأدنى للعرض */
        table.rz-grid-lines-both th {
            font-size: 0.7rem !important;
            min-width: 80px !important;
            height: auto !important;
            padding: 4px !important;
        }

        /* تصغير خطوط خلايا الجدول وتقليل المسافات الداخلية والارتفاع */
        table.rz-grid-lines-both td {
            height: auto !important; /* اجعل الارتفاع تلقائياً */
            padding: 4px !important;
        }

        /* ==== تعديل رئيسي هنا: استهداف النصوص داخل خلايا الجدول ==== */

        /* تصغير حجم خط اسم الغرفة الرئيسي */
        .room-column .rz-subtitle-2 {
            font-size: 0.8rem !important; 
        }

        /* تصغير حجم خط اسم النزيل */
        .date-column .rz-body-1 {
            font-size: 0.75rem !important;
        }

        /* تصغير حجم الخطوط الصغيرة الأخرى (الفئة، النوع، السعر، إلخ) */
        .room-column .rz-caption,
        .date-column .rz-caption, 
        .date-column .rz-overline {
            font-size: 0.65rem !important;
        }
        
        /* تصغير خطوط "إضافة حجز" */
        .hover-effect .rz-text {
            font-size: 0.7rem !important;
        }
        .hover-effect .rz-icon {
            font-size: 1rem; /* تصغير أيقونة الزائد قليلاً */
        }
        
        /* تصغير الحد الأدنى لعرض عمود الغرفة */
        .room-column {
            min-width: 120px !important;
        }
    }