/* Isolated desktop preview for Grafik. Mobile schedule.php remains unchanged. */
.desktop-schedule-preview-body {
    display: block !important;
    min-height: 100vh !important;
    height: 100vh !important;
    overflow: hidden !important;
    background: var(--ui-page-bg, #f6f6f6) !important;
}

.desktop-schedule-preview-body #desktop-preview-frame.phone-frame {
    position: relative !important;
    display: block !important;
    width: 100vw !important;
    max-width: none !important;
    height: 100vh !important;
    max-height: none !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: var(--ui-page-bg, #f6f6f6) !important;
}

.desktop-schedule-preview-body #desktop-preview-frame > .bottom-nav-responsive {
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    width: 220px !important;
    height: 100vh !important;
}

.desktop-schedule-preview-body #desktop-preview-frame > [data-global-modal-header] {
    position: fixed !important;
    z-index: 70;
    top: 0 !important;
    left: 220px !important;
    right: 0 !important;
    width: auto !important;
    height: 76px !important;
    min-height: 76px !important;
    padding: 0 40px !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 10px !important;
    border-bottom: 1px solid var(--ui-line, #ececec) !important;
    background: rgba(255,255,255,.94) !important;
    box-shadow: 0 3px 14px rgba(51,51,51,.04) !important;
    backdrop-filter: blur(12px);
}

.desktop-schedule-preview-body #header-greeting {
    left: 40px !important;
    right: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: var(--ui-text, #333333) !important;
    font-size: 24px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
}

.desktop-schedule-preview-body #header-profile-avatar {
    order: 3;
    width: 38px !important;
    height: 38px !important;
    font-size: 14px !important;
}

.desktop-schedule-preview-body [data-global-modal-actions] {
    order: 2;
    gap: 4px !important;
}

.desktop-schedule-preview-body #desktop-preview-frame > .compact-header {
    position: absolute !important;
    z-index: 35;
    top: 94px !important;
    left: 252px !important;
    right: 32px !important;
    width: auto !important;
    min-height: 58px;
    padding: 10px 12px !important;
    gap: 7px !important;
    border: 0 !important;
    border-radius: var(--radius-card, 16px) !important;
    background: var(--ui-surface, #ffffff) !important;
    box-shadow: var(--ui-record-shadow, var(--shadow-card)) !important;
}

.desktop-schedule-preview-body .header-row-top {
    width: 100%;
    gap: 10px !important;
}

.desktop-schedule-preview-body .compact-search {
    min-height: 38px;
    border: 1px solid var(--ui-line, #ececec);
    background: var(--ui-surface-muted, #f6f6f6) !important;
}

.desktop-schedule-preview-body .compact-search input {
    font-size: 13px !important;
}

.desktop-schedule-preview-body #filters-container {
    padding: 0 !important;
    margin: 0 !important;
}

.desktop-schedule-preview-body #desktop-preview-frame > #main-scroll {
    position: absolute !important;
    top: 170px !important;
    left: 220px !important;
    right: 0 !important;
    bottom: 0 !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    gap: 18px;
    padding: 0 32px 42px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    background: var(--ui-page-bg, #f6f6f6) !important;
}

.desktop-schedule-preview-body #main-scroll > .schedule-level-header {
    display: none !important;
}

.desktop-schedule-preview-body #main-scroll > .desktop-schedule-week-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    align-content: start;
    align-items: start;
    gap: 12px;
    width: 100%;
    min-width: 0;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-week-grid > [id^="list-"] {
    min-width: 0;
    overflow: hidden;
    border-radius: var(--radius-card, 16px);
    background: var(--ui-surface, #ffffff);
    box-shadow: var(--ui-record-shadow, var(--shadow-card));
}

.desktop-schedule-preview-body #main-scroll .date-header {
    position: static !important;
    min-height: 42px;
    display: flex;
    align-items: center;
    padding: 10px 12px !important;
    border: 0 !important;
    background: var(--color-text-primary, #333333) !important;
    color: #ffffff !important;
    box-shadow: none !important;
    font-size: 10px !important;
    letter-spacing: .045em;
}

.desktop-schedule-preview-body #main-scroll .date-header-count {
    color: rgba(255,255,255,.62) !important;
    font-size: 9px !important;
}

.desktop-schedule-preview-body #main-scroll .activity-row {
    grid-template-columns: 39px minmax(0, 1fr) !important;
    min-height: 62px;
    padding: 10px 8px !important;
    border-bottom: 1px solid var(--ui-line, #ececec) !important;
    background: var(--ui-surface, #ffffff) !important;
}

.desktop-schedule-preview-body #main-scroll .activity-row:last-child {
    border-bottom: 0 !important;
}

.desktop-schedule-preview-body #main-scroll .col-time {
    padding-left: 0 !important;
}

.desktop-schedule-preview-body #main-scroll .time-text {
    font-size: 11px !important;
}

.desktop-schedule-preview-body #main-scroll .col-info {
    padding-left: 6px !important;
    gap: 3px !important;
}

.desktop-schedule-preview-body #main-scroll .activity-header {
    gap: 5px !important;
}

.desktop-schedule-preview-body #main-scroll .activity-name {
    font-size: 11px !important;
    line-height: 1.25 !important;
}

.desktop-schedule-preview-body #main-scroll .activity-instructor {
    font-size: 9px !important;
    line-height: 1.25 !important;
}

.desktop-schedule-preview-body #main-scroll .activity-side-meta {
    gap: 1px !important;
}

.desktop-schedule-preview-body #main-scroll .badge-base,
.desktop-schedule-preview-body #main-scroll .c-badge-base,
.desktop-schedule-preview-body #main-scroll .badge-level-neutral,
.desktop-schedule-preview-body #main-scroll .badge-level-p0-start {
    max-width: 62px;
    padding: 2px 5px !important;
    overflow: hidden;
    font-size: 8px !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.desktop-schedule-preview-body #main-scroll .schedule-term-mobile,
.desktop-schedule-preview-body #main-scroll .schedule-instructor-status {
    display: none !important;
}

/* Desktop-only weekday disclosure. The mobile Grafik remains untouched. */
.desktop-schedule-preview-body #main-scroll .desktop-schedule-week-grid > [id^="list-"].desktop-day-disclosure {
    max-height: var(--desktop-day-collapsed-height, 135px);
    transition: max-height .24s ease;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-week-grid > [id^="list-"].desktop-day-disclosure.is-expanded {
    max-height: var(--desktop-day-expanded-height, 2400px);
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-week-grid > [id^="list-"].desktop-day-disclosure > .date-header {
    cursor: pointer;
    user-select: none;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-week-grid > [id^="list-"].desktop-day-disclosure > .activity-row,
.desktop-schedule-preview-body #main-scroll .desktop-schedule-week-grid > [id^="list-"].desktop-day-disclosure > .course-row {
    transition: filter .18s ease, opacity .18s ease;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-week-grid > [id^="list-"].desktop-day-disclosure:not(.is-expanded) > .activity-row,
.desktop-schedule-preview-body #main-scroll .desktop-schedule-week-grid > [id^="list-"].desktop-day-disclosure:not(.is-expanded) > .course-row {
    filter: blur(3.5px);
    opacity: .58;
    user-select: none;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-week-grid > [id^="list-"].desktop-day-disclosure.is-expanded > .activity-row,
.desktop-schedule-preview-body #main-scroll .desktop-schedule-week-grid > [id^="list-"].desktop-day-disclosure.is-expanded > .course-row {
    filter: none;
    opacity: 1;
}

/* Mobile-like list is a separate block below the complete weekday grid. */
.desktop-schedule-preview-body #main-scroll > .desktop-schedule-linear {
    --desktop-linear-columns-height: 34px;
    flex: 0 0 auto;
    width: 50%;
    min-width: 460px;
    max-width: 760px;
    margin: 0 auto;
    overflow: visible;
    border-radius: var(--radius-card, 16px);
    background: var(--ui-surface, #ffffff);
    box-shadow: var(--ui-record-shadow, var(--shadow-card));
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear-columns {
    position: sticky;
    z-index: 30;
    top: 0;
    display: grid;
    grid-template-columns: 70px minmax(0, 1fr) 140px 124px;
    align-items: center;
    min-height: var(--desktop-linear-columns-height, 34px);
    padding: 0 8px;
    border-bottom: 1px solid var(--ui-line, #ececec);
    border-radius: var(--radius-card, 16px) var(--radius-card, 16px) 0 0;
    background: var(--ui-surface, #ffffff);
    box-shadow: 0 2px 8px rgba(51,51,51,.08);
    color: var(--ui-text-muted, #636363);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .035em;
    text-transform: uppercase;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear-columns > span:nth-child(3),
.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear-columns > span:nth-child(4) {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear-day {
    position: relative;
    width: 100%;
    min-width: 0;
    background: var(--ui-surface, #ffffff);
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear-day + .desktop-schedule-linear-day {
    border-top: 8px solid var(--ui-page-bg, #f6f6f6);
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .date-header {
    position: sticky !important;
    z-index: 20;
    top: var(--desktop-linear-columns-height, 34px) !important;
    min-height: 38px;
    padding: 8px 16px !important;
    border: 0 !important;
    background: var(--color-text-primary, #333333) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(51,51,51,.12) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    letter-spacing: .05em;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .date-header-count {
    margin-left: 6px;
    color: rgba(255,255,255,.62) !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 0;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .activity-row,
.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .course-row {
    grid-template-columns: 70px minmax(0, 1fr) 140px 124px !important;
    min-height: 0;
    width: 100%;
    padding: 10px 8px !important;
    border-bottom: 1px solid var(--ui-line-soft, #f6f6f6) !important;
    background: var(--ui-surface, #ffffff) !important;
    filter: none !important;
    cursor: pointer;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .activity-row:last-child,
.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .course-row:last-child {
    border-bottom: 0 !important;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .col-time {
    padding-left: 8px !important;
    gap: 4px !important;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .time-text {
    font-size: 13px !important;
    line-height: 1.2 !important;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .col-info {
    padding-left: 8px !important;
    padding-right: 10px !important;
    gap: 1px !important;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .activity-header {
    gap: 8px !important;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .activity-name {
    font-size: 13px !important;
    line-height: 1.2 !important;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .activity-instructor {
    font-size: 11px !important;
    line-height: 1.2 !important;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .desktop-linear-term-cell,
.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .desktop-linear-level-cell {
    align-self: stretch;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .desktop-linear-term-cell {
    justify-content: center;
    text-align: center;
    padding: 0 10px;
    color: var(--ui-text-muted, #636363);
    font-size: 10px;
    font-weight: 400;
    line-height: 1.25;
    white-space: nowrap;
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .desktop-linear-term-cell.schedule-status-start {
    color: var(--ui-success-text, #137a52);
}

.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .badge-base,
.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .c-badge-base,
.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .badge-level-neutral,
.desktop-schedule-preview-body #main-scroll .desktop-schedule-linear .badge-level-p0-start {
    max-width: none;
    padding: 3px 7px !important;
    overflow: visible;
    font-size: 11px !important;
    text-overflow: clip;
}

@media (min-width: 931px) {
    .desktop-schedule-preview-body .bottom-sheet-overlay {
        position: fixed !important;
        top: 76px !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 220px !important;
    }

    .desktop-schedule-preview-body .bottom-sheet {
        position: fixed !important;
        top: 76px !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        width: min(500px, calc(100vw - 220px)) !important;
        height: calc(100vh - 76px) !important;
        max-height: calc(100vh - 76px) !important;
        border-radius: 24px 0 0 24px !important;
        transform: translateX(100%) !important;
    }

    .desktop-schedule-preview-body .bottom-sheet.active,
    .desktop-schedule-preview-body .bottom-sheet.open {
        transform: translateX(0) !important;
    }
}

@media (max-width: 1400px) and (min-width: 1181px) {
    .desktop-schedule-preview-body #main-scroll > .desktop-schedule-week-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 1180px) {
    .desktop-schedule-preview-body #desktop-preview-frame > .bottom-nav-responsive {
        width: 82px !important;
    }

    .desktop-schedule-preview-body #desktop-preview-frame > [data-global-modal-header] {
        left: 82px !important;
    }

    .desktop-schedule-preview-body #desktop-preview-frame > .compact-header {
        left: 114px !important;
        right: 24px !important;
    }

    .desktop-schedule-preview-body #desktop-preview-frame > #main-scroll {
        left: 82px !important;
        padding-left: 24px !important;
        padding-right: 24px !important;
    }

    .desktop-schedule-preview-body #main-scroll > .desktop-schedule-week-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .desktop-schedule-preview-body #main-scroll > .desktop-schedule-linear {
        width: 50%;
        min-width: 520px;
    }

    .desktop-schedule-preview-body .bottom-sheet-overlay {
        left: 82px !important;
    }

    .desktop-schedule-preview-body .bottom-sheet {
        width: min(480px, calc(100vw - 82px)) !important;
    }
}