.zindex {
    z-index: 20000;
}

/* Zaman DatePicker Styles */
.zaman-datepicker {
    direction: rtl;
    text-align: right;
}

.zaman-datepicker .MuiTextField-root {
    width: 100%;
}

.zaman-datepicker .MuiInputBase-input {
    text-align: right;
    direction: rtl;
}

/* High z-index for zaman datepicker popper - must be above header (usually 1100) */
.zaman-datepicker-popper,
.zaman-datepicker-popper *,
[class*="zaman-datepicker-popper"],
[class*="zaman-datepicker-popper"] * {
    z-index: 99999 !important;
}

.zaman-datepicker-popper .MuiPaper-root,
.zaman-datepicker-popper [role="dialog"],
.zaman-datepicker-popper .MuiPopover-paper,
.zaman-datepicker-popper .MuiDialog-root,
.zaman-datepicker-popper .MuiDialog-container,
.zaman-datepicker-popper .MuiPopover-root {
    z-index: 99999 !important;
}

/* Ensure all popper elements have high z-index */
.MuiPopper-root.zaman-datepicker-popper,
.MuiPopper-root[class*="zaman"],
div[class*="zaman-datepicker"],
div[class*="zaman-datepicker"] * {
    z-index: 99999 !important;
}

/* Global override for any popper that might contain zaman */
body > div[class*="MuiPopper"],
body > div[class*="zaman"],
body > div[class*="MuiPopover"] {
    z-index: 99999 !important;
}

/* Ensure datepicker is above AppBar (usually z-index 1100) */
.MuiAppBar-root ~ * .zaman-datepicker-popper,
.MuiAppBar-root ~ * [class*="zaman-datepicker"] {
    z-index: 99999 !important;
}

.zaman-datepicker-popper .MuiPaper-root {
    direction: rtl;
}

/* Date picker container */
.date-filter-container {
    margin-bottom: 16px;
}

.date-filter-container .MuiGrid-item {
    display: flex;
    align-items: center;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .date-filter-container .MuiGrid-container .MuiGrid-item {
        flex-basis: 100%;
        max-width: 100%;
        margin-bottom: 8px;
    }
}