/* hebrew-month/hebrew-month.css — the Hebrew-month view reuses the exact
 * layout of the Gregorian month page (month/month.css). Only the Hebrew-only
 * extras live here: the small Gregorian month label inside cells and the
 * month-boundary borders. Keeping the container/grid/print rules identical to
 * month.css guarantees screen + print look the same as that page. */

/* ---- Layout: copied verbatim from month/month.css ---- */
.calendar-container {
    position: relative;
    width: 90%;
    margin-inline-end: 20px;
    zoom: 1;
}

@media (max-width: 768px) {
    .calendar-container {
        width: 100%;
        margin-inline-end: 0;
    }

    .calendar-header,
    .hebmonth-grid {
        width: 100%;
        max-width: 100%;
    }

    .hebmonth-grid {
        height: auto;
        max-height: none;
        grid-template-rows: auto repeat(var(--calendar-week-rows, 6), minmax(52px, auto));
    }

    .hebmonth-grid .day-cell {
        min-height: 52px;
    }
}

.hebmonth-grid {
    height: 80vh;
    max-height: 80vh;
    box-sizing: border-box;
    grid-template-rows: auto repeat(var(--calendar-week-rows, 6), minmax(0, 1fr));
    transition: filter 180ms ease, opacity 180ms ease;
}

.calendar-container.is-loading .calendar-header {
    min-height: 70px;
    box-sizing: border-box;
    filter: blur(4px);
    opacity: 0.45;
}

.calendar-container.is-loading .calendar-grid {
    filter: blur(4px);
    opacity: 0.48;
    background-color: #f8fafc;
    background-image:
        repeating-linear-gradient(to left, transparent 0, transparent calc(14.2857% - 1px), #dbe1e8 calc(14.2857% - 1px), #dbe1e8 14.2857%),
        repeating-linear-gradient(to bottom, transparent 0, transparent calc(16.6667% - 1px), #dbe1e8 calc(16.6667% - 1px), #dbe1e8 16.6667%);
}

.calendar-loading-status {
    display: none;
    position: absolute;
    z-index: 3;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 0;
    line-height: 0;
    color: transparent;
    background: none;
    border: none;
    padding: 0;
    box-shadow: none;
}

.calendar-loading-status::before {
    content: '';
    display: block;
    width: 36px;
    height: 36px;
    border: 3px solid #dbe1e8;
    border-top-color: #1f3a5f;
    border-radius: 50%;
    animation: calendar-spinner-spin 0.8s linear infinite;
}

@keyframes calendar-spinner-spin {
    to {
        transform: rotate(360deg);
    }
}

.calendar-container.is-loading .calendar-loading-status {
    display: block;
}

.hebmonth-grid .day-cell {
    min-height: 0;
    overflow: hidden;
}

.calendar-header {
    margin-top: 30px;
    padding-top: 12px;
    padding-bottom: 50px;
}

/* ---- Hebrew-only extras ---- */
.hebmonth-grid .gregorian-month-name {
    position: absolute;
    top: 23px;
    inset-inline-end: 8px;
    width: auto;
    margin: 0;
    font-size: 10px;
    line-height: 1.1;
    text-align: end;
}

.hebmonth-grid .month-border-top {
    border-top: 1px solid #89a3c2 !important;
}

.hebmonth-grid .month-border-bottom {
    border-bottom: 1px solid #89a3c2 !important;
}

.hebmonth-grid .month-border-right {
    border-inline-start: 1px solid #89a3c2 !important;
}

/* ---- Print: copied verbatim from month/month.css ---- */
@media print {
    .month-intro {
        display: none;
    }

    .calendar-container {
        width: 100%;
    }

    @page {
        size: A4 portrait;
        margin: 8mm 8mm 20mm 8mm;
    }

    html, body {
        height: 100%;
    }

    .calendar-container {
        display: flex;
        flex-direction: column;
        min-height: 100vh;
        padding-top: 40px;
        padding-bottom: 20px;
        box-sizing: border-box;
    }

    .hebmonth-grid {
        flex: 1 1 auto;
        grid-auto-rows: 1fr;
    }

    .calendar-header {
        margin-top: 0;
    }

    .calendar-container.is-loading .calendar-grid,
    .calendar-container.is-loading .calendar-header {
        filter: none;
        opacity: 1;
    }

    /* Portrait: stay inside the printable width of A4, including all 7 columns. */
    html[data-print-orientation="portrait"] .container {
        width: 190mm;
        max-width: 100%;
        margin: 0 auto;
    }

    html[data-print-orientation="portrait"] .calendar-container {
        width: 190mm;
        max-width: 100%;
        margin: 0 auto;
        padding-right: 0;
        padding-left: 0;
    }

    html[data-print-orientation="portrait"] .calendar-grid {
        width: 100%;
        min-width: 0;
        grid-template-columns: repeat(7, minmax(0, 1fr));
    }

    html[data-print-orientation="portrait"] .day-cell,
    html[data-print-orientation="portrait"] .day-header {
        width: auto;
        min-width: 0;
        padding-right: 3px;
        padding-left: 3px;
    }

    /* Landscape: fit the header and all week rows inside one printable page. */
    html[data-print-orientation="landscape"] .calendar-container {
        height: 175mm;
        min-height: 0;
        max-height: 175mm;
        padding-top: 4mm;
        padding-bottom: 2mm;
        overflow: hidden;
    }

    html[data-print-orientation="landscape"] .calendar-header {
        flex: 0 0 auto;
        padding-top: 2mm;
        padding-bottom: 3mm;
    }

    html[data-print-orientation="landscape"] .calendar-grid {
        height: auto;
        max-height: none;
        min-height: 0;
        flex: 1 1 0;
    }

    html[data-print-orientation="landscape"] .day-cell {
        min-height: 0;
        padding-top: 3px;
        padding-bottom: 3px;
    }
}

@media (max-width: 768px) {
    .calendar-header {
        margin-top: 6px;
        padding: 8px 0 10px;
    }

    .month-title-subline,
    [dir="rtl"] .month-title-subline,
    [dir="ltr"] .month-title-subline {
        padding-inline: 0;
        padding-left: 0;
        padding-right: 0;
        justify-content: center;
    }

    .month-title-nav {
        width: 100%;
        align-items: center;
    }
}
