@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&family=Tajawal:wght@400;500;700&family=Cairo:wght@400;600;700&display=swap');

/* Variables for easier maintenance */
:root {
    --calendar-primary: #1976d2;
    --calendar-accent: #FFC107;
    --calendar-font-ar: 'IBM Plex Sans Arabic', 'Tajawal', 'Cairo', 'Noto Naskh Arabic', 'Segoe UI', Tahoma, Arial, sans-serif;
}

/* Page layout */
.calendar-page {
    padding: 68px 0;
}

.calendar-wrapper {
    max-width: 1100px;
    margin: 40px auto 0;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,.08);
    padding: 16px;
}

.calendar-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
}

.calendar-title {
    margin: 0;
    font-size: 32px;
}

/* FullCalendar base styles */
.calendar-wrapper .fc table {
    table-layout: fixed;
    width: 100%;
    border-collapse: collapse;
}

.calendar-wrapper .fc th,
.calendar-wrapper .fc td {
    padding: 0;
    box-sizing: border-box;
}

.calendar-wrapper .fc-basic-view .fc-day-header {
    text-align: center;
    white-space: nowrap;
    font-weight: 700;
}

/* Keep headers exactly aligned with day columns */
.calendar-wrapper .fc-basic-view .fc-week .fc-day,
.calendar-wrapper .fc-basic-view .fc-week .fc-day-header,
.calendar-wrapper .fc-basic-view .fc-day-grid .fc-day {
    width: calc(100% / 7);
}

/* Event colors */
.calendar-wrapper .fc-event,
.calendar-wrapper .fc-event-dot {
    background-color: var(--calendar-primary);
    border-color: var(--calendar-primary);
    color: #fff;
}

.calendar-wrapper .fc-unthemed .fc-list-item-title a {
    color: #222;
}

/* Yellow borders/accents */
.calendar-wrapper .fc-unthemed th,
.calendar-wrapper .fc-unthemed td,
.calendar-wrapper .fc-unthemed .fc-divider,
.calendar-wrapper .fc-unthemed .fc-row,
.calendar-wrapper .fc-unthemed .fc-content,
.calendar-wrapper .fc-unthemed .fc-popover,
.calendar-wrapper .fc-unthemed .fc-list-view {
    border-color: #d6b738;
}

.calendar-wrapper .fc-basic-view .fc-day-header {
    color: #d6b738;
}

/* Ensure consistent left/right borders */
.calendar-wrapper .fc-unthemed th,
.calendar-wrapper .fc-unthemed td {
    border-right: 1px solid var(--calendar-accent);
}

.calendar-wrapper .fc-unthemed tr > th:first-child,
.calendar-wrapper .fc-unthemed tr > td:first-child {
    border-left: 1px solid var(--calendar-accent);
}

.calendar-wrapper .fc-basic-view .fc-head .fc-row th,
.calendar-wrapper .fc-basic-view .fc-day-grid .fc-row .fc-bg table td {
    border-left: 1px solid var(--calendar-accent);
    border-right: 1px solid var(--calendar-accent);
}

/* RTL + Arabic adjustments */
html[dir="rtl"] .calendar-wrapper,
html:lang(ar) .calendar-wrapper {
    font-family: var(--calendar-font-ar) !important;
    line-height: 1.7;
    letter-spacing: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-kerning: normal;
    font-variant-ligatures: contextual;
}

    html[dir="rtl"] .calendar-wrapper .fc,
    html:lang(ar) .calendar-wrapper .fc {
        font-size: 15px;
        line-height: 1.7;
    }

html[dir="rtl"] .calendar-title,
html:lang(ar) .calendar-title {
    font-weight: 700;
}

/* Month title in toolbar */
html[dir="rtl"] .calendar-wrapper .fc .fc-toolbar h2,
html:lang(ar) .calendar-wrapper .fc .fc-toolbar h2 {
    font-family: var(--calendar-font-ar) !important;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
}

/* Buttons */
html[dir="rtl"] .calendar-wrapper .fc .fc-toolbar .fc-button {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0;
    font-family: var(--calendar-font-ar) !important;
}

/* Day headers, numbers, list labels */
html[dir="rtl"] .calendar-wrapper .fc .fc-day-header,
html[dir="rtl"] .calendar-wrapper .fc .fc-axis,
html[dir="rtl"] .calendar-wrapper .fc .fc-day-number,
html[dir="rtl"] .calendar-wrapper .fc .fc-list-heading-main,
html[dir="rtl"] .calendar-wrapper .fc .fc-list-item-time,
html[dir="rtl"] .calendar-wrapper .fc .fc-list-item-title,
html:lang(ar) .calendar-wrapper .fc .fc-day-header,
html:lang(ar) .calendar-wrapper .fc .fc-axis,
html:lang(ar) .calendar-wrapper .fc .fc-day-number,
html:lang(ar) .calendar-wrapper .fc .fc-list-heading-main,
html:lang(ar) .calendar-wrapper .fc .fc-list-item-time,
html:lang(ar) .calendar-wrapper .fc .fc-list-item-title {
    font-family: var(--calendar-font-ar) !important;
}

/* Increase Arabic sizes for day headers and numbers */
html[dir="rtl"] .calendar-wrapper .fc .fc-day-header,
html:lang(ar) .calendar-wrapper .fc .fc-day-header {
    font-size: 18px !important;
    font-weight: 700;
}

html[dir="rtl"] .calendar-wrapper .fc .fc-day-number,
html:lang(ar) .calendar-wrapper .fc .fc-day-number {
    font-size: 18px !important;
    font-weight: 600;
}

/* Toolbar layout (RTL) */
html[dir="rtl"] .calendar-wrapper .fc .fc-toolbar .fc-center {
    order: 2;
}

html[dir="rtl"] .calendar-wrapper .fc .fc-toolbar .fc-right {
    order: 3;
    margin-left: auto;
}

/* Responsive */
@media (max-width: 992px) {
    .calendar-wrapper {
        padding: 12px;
        max-width: 95vw;
    }

    .calendar-title {
        font-size: 22px;
    }

    html[dir="rtl"] .calendar-wrapper .fc {
        font-size: 14.5px;
    }

        html[dir="rtl"] .calendar-wrapper .fc .fc-toolbar .fc-button {
            font-size: 15.5px;
        }
}

/* Adjust grid and scroll */
.calendar-wrapper .fc-basic-view .fc-head .fc-row th.fc-day-header,
.calendar-wrapper .fc-basic-view .fc-day-grid .fc-row td.fc-day,
.calendar-wrapper .fc-basic-view .fc-week .fc-day,
.calendar-wrapper .fc-basic-view .fc-week .fc-day-header {
    width: calc(100% / 7) !important;
}

.calendar-wrapper .fc-basic-view .fc-head .fc-row th {
    border-left: 1px solid #d3b22a !important;
    border-right: 1px solid #d3b22a !important;
    box-shadow: none !important;
}

.calendar-wrapper .fc-basic-view .fc-body .fc-scroller,
.calendar-wrapper .fc .fc-scroller {
    overflow-y: hidden !important;
    overflow-x: hidden !important;
    height: auto !important;
}