.fi-ta-row.catalog-row-absent-today > td {
    background-color: #fef2f2;
}

.fi-ta-row.catalog-row-absent-today > td:first-child {
    box-shadow: inset 3px 0 0 #dc2626;
}

.dark .fi-ta-row.catalog-row-absent-today > td {
    background-color: color-mix(in srgb, var(--danger-500) 12%, transparent);
}

.dark .fi-ta-row.catalog-row-absent-today > td:first-child {
    box-shadow: inset 3px 0 0 var(--danger-500);
}

.fi-ta-row.teacher-timetable-row-past > td {
    background-color: var(--gray-50);
    color: var(--gray-500);
}

.dark .fi-ta-row.teacher-timetable-row-past > td {
    background-color: color-mix(in srgb, var(--gray-700) 40%, transparent);
    color: var(--gray-400);
}

.teacher-identity {
    display: grid;
    line-height: 1.2;
    text-align: right;
    white-space: nowrap;
}

.teacher-identity-name {
    color: var(--gray-950);
    font-size: 0.875rem;
    font-weight: 600;
}

.teacher-identity-roles {
    color: var(--gray-500);
    font-size: 0.75rem;
}

.dark .teacher-identity-name {
    color: white;
}

.dark .teacher-identity-roles {
    color: var(--gray-400);
}

.teacher-grade-timeline {
    display: flex;
    width: min(20rem, 70vw);
    gap: 0.75rem;
    overflow-x: auto;
    padding-block: 0.25rem;
    scrollbar-width: thin;
}

.teacher-grade-timeline-item {
    display: inline-flex;
    flex: none;
    gap: 0.25rem;
    white-space: nowrap;
}

.teacher-grade-timeline-button,
.teacher-grade-add-button {
    border-radius: 0.375rem;
    cursor: pointer;
}

.teacher-grade-timeline-button:hover,
.teacher-grade-timeline-button:focus-visible {
    color: var(--primary-600);
    outline: none;
}

.teacher-grade-add-button {
    flex: none;
    color: var(--info-400);
    font-size: 0.875rem;
    font-weight: 600;
    white-space: nowrap;
}

.teacher-grade-add-button:hover,
.teacher-grade-add-button:focus-visible {
    color: var(--info-400);
}

.teacher-grade-timeline-value {
    font-weight: 700;
}

.teacher-absence-item {
    display: inline-flex;
    flex: none;
    align-items: center;
    gap: 0.375rem;
    white-space: nowrap;
}

.teacher-absence-timeline {
    gap: 0;
}

.teacher-absence-separator {
    margin-inline-end: 0.25rem;
}

.teacher-absence-date {
    border-radius: 9999px;
    padding: 0.125rem 0.375rem;
}

.teacher-absence-date.is-justified {
    border: 1px solid var(--success-700);
}

.teacher-grade-timeline-empty {
    color: var(--gray-400);
}

.teacher-timetable-table .fi-ta-cell .fi-ta-text:not(.fi-inline),
.teacher-catalog-table .fi-ta-cell .fi-ta-text:not(.fi-inline) {
    padding-block: 0.5rem;
}

.message-chat-item {
    padding-block: 0.5rem;
    font-size: 0.875rem;
    min-width: 0;
}
.message-chat-item > * + * { margin-top: 0.5rem; }
.message-chat-meta { display: flex; align-items: baseline; gap: 0.75rem; flex-wrap: wrap; }
.message-chat-author { font-weight: 600; }
.message-chat-time, .message-chat-quote { font-size: 0.75rem; color: var(--gray-500); }
.dark .message-chat-time, .dark .message-chat-quote { color: var(--gray-400); }
.message-chat-body { white-space: pre-wrap; overflow-wrap: anywhere; }
.message-chat-quote { border-inline-start: 2px solid var(--gray-400); padding-inline-start: 0.75rem; }
.message-chat-link { text-decoration: underline; text-underline-offset: 0.15em; }
.message-chat-attachment { display: block; overflow-wrap: anywhere; }
.message-chat-reaction { display: inline-block; border: 1px solid var(--gray-400); border-radius: 0.5rem; padding: 0.125rem 0.5rem; }
.message-chat-reaction-own { font-weight: 700; border-color: var(--primary-500); }
.message-chat-reactions { display: flex; align-items: center; flex-wrap: wrap; gap: 0.375rem; }
.fi-dropdown-panel:has(> .message-chat-reaction-picker) { width: max-content; }
.message-chat-reaction-picker { max-width: calc(100vw - 2rem); }
.message-chat-reaction-picker { display: flex; flex-wrap: wrap; gap: 0.125rem; padding: 0.375rem; }
.message-chat-emoji { flex: 0 0 auto; line-height: 1; font-size: 1.5rem; padding: 0.375rem; border-radius: 0.375rem; cursor: pointer; }
.message-chat-emoji:hover, .message-chat-emoji:focus-visible { background: color-mix(in srgb, var(--primary-500) 15%, transparent); }
button.message-chat-reaction { cursor: pointer; }
button.message-chat-reaction:disabled, .message-chat-emoji:disabled { opacity: 0.5; cursor: wait; }

.message-chat-table .fi-ta-record { border: 0; background: transparent; }
.message-chat-item {
    display: grid;
    grid-template-columns: minmax(0, max-content) 2rem;
    align-items: center;
    column-gap: 0.5rem;
    width: fit-content;
    max-width: min(38rem, 100%);
    padding-block: 0.5rem 1rem;
}
.message-chat-item > * + * { margin-top: 0; }
.message-chat-item-own { margin-inline-start: auto; grid-template-columns: 2rem minmax(0, max-content); }
.message-chat-item-own .message-chat-bubble, .message-chat-item-own .message-chat-reactions { grid-column: 2; }
.message-chat-item-own .message-chat-picker-trigger { grid-column: 1; }
.message-chat-bubble {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
    padding: 0.625rem 0.75rem 0.375rem;
    border-radius: 0.875rem 0.875rem 0.875rem 0.25rem;
    background: var(--gray-100);
}
.dark .message-chat-bubble { background: var(--gray-800); }
.message-chat-item-own .message-chat-bubble {
    border-radius: 0.875rem 0.875rem 0.25rem 0.875rem;
    background: color-mix(in srgb, var(--primary-500) 12%, var(--gray-50));
}
.dark .message-chat-item-own .message-chat-bubble { background: color-mix(in srgb, var(--primary-500) 12%, var(--gray-800)); }
.message-chat-meta { margin-bottom: 0.375rem; }
.message-chat-author { color: var(--primary-600); }
.dark .message-chat-author { color: var(--primary-400); }
.message-chat-quote {
    display: grid;
    gap: 0.25rem;
    border-color: var(--primary-500);
    background: color-mix(in srgb, var(--gray-500) 12%, transparent);
    border-radius: 0.375rem;
    padding: 0.5rem 0.625rem;
    margin-block: 0.25rem 0.5rem;
    overflow-wrap: anywhere;
}
.message-chat-quote strong { color: var(--primary-600); }
.dark .message-chat-quote strong { color: var(--primary-400); }
.message-chat-time { display: block; text-align: end; font-size: 0.6875rem; margin-top: 0.25rem; }
.message-chat-picker-trigger { grid-column: 2; grid-row: 1; }
.message-chat-picker-trigger .fi-icon-btn { border-radius: 50%; background: var(--gray-100); color: var(--gray-500); }
.dark .message-chat-picker-trigger .fi-icon-btn { background: var(--gray-800); color: var(--gray-300); }
.message-chat-reactions { grid-column: 1; grid-row: 2; padding-inline: 0.5rem; margin-top: -0.125rem; }
.message-chat-reactions:empty { display: none; }
.message-chat-reaction { border-radius: 999px; background: var(--gray-50); border-color: var(--gray-200); }
.dark .message-chat-reaction { background: var(--gray-900); border-color: var(--gray-700); }
.message-chat-reaction-own, .dark .message-chat-reaction-own { border-color: var(--primary-500); }
.fi-dropdown-panel:has(> .message-chat-reaction-picker) { border-radius: 999px; }
.message-chat-reaction-picker { gap: 0.125rem; padding: 0.25rem; }
.message-chat-emoji { border-radius: 50%; padding: 0.5rem; font-size: 1.5rem; }
.message-chat-emoji-selected { background: color-mix(in srgb, var(--primary-500) 20%, transparent); }
@media (hover: hover) and (pointer: fine) {
    .message-chat-picker-trigger { opacity: 0; transition: opacity 120ms; }
    .message-chat-item:hover .message-chat-picker-trigger,
    .message-chat-item:focus-within .message-chat-picker-trigger { opacity: 1; }
}
.message-chat-composer { margin-top: 1rem; padding: 0.75rem; border: 0; border-radius: 1rem; background: transparent; }
.message-chat-composer-bar, .message-chat-composer-input, .message-chat-composer-quote { display: flex; align-items: center; gap: 0.5rem; }
.message-chat-composer-input { flex: 1; min-width: 0; background: var(--gray-100); border: 1px solid var(--gray-300); border-radius: 1.5rem; padding: 0.375rem 0.625rem; }
.dark .message-chat-composer-input { background: var(--gray-800); border-color: var(--gray-700); }
.message-chat-composer-input textarea { flex: 1; min-width: 0; border: 0; outline: none; box-shadow: none; resize: none; overflow-y: auto; background: transparent; color: inherit; font: inherit; min-height: 1.5rem; max-height: 10rem; }
.message-chat-composer-input:focus-within { outline: 2px solid var(--primary-500); outline-offset: 2px; }
.message-chat-composer-quote { justify-content: space-between; border-inline-start: 3px solid var(--primary-500); padding: 0.5rem; margin-bottom: 0.5rem; font-size: 0.875rem; }
.message-chat-composer-error { color: var(--danger-500); font-size: 0.875rem; margin-top: 0.375rem; }
.message-chat-participants { display: block; font-size: 0.875rem; line-height: 1.5; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.message-chat-participant-link:hover, .message-chat-participant-link:focus-visible { text-decoration: underline; text-underline-offset: 0.15em; }
.message-chat-shell { display: flex; flex-direction: column; min-height: 0; overflow: hidden; border: 1px solid var(--gray-200); border-radius: 1rem; background: white; }
.dark .message-chat-shell { border-color: var(--gray-700); background: var(--gray-900); }
.message-chat-scroll { display: flex; flex-direction: column; flex: 1 1 0; min-height: 0; overflow-y: auto; overscroll-behavior-y: contain; scrollbar-gutter: stable; }
.message-chat-scroll .message-chat-table { border: 0; box-shadow: none; }
.message-chat-shell > .message-chat-composer { flex: 0 0 auto; margin: 0.75rem; max-height: 55%; overflow-y: auto; }
.message-chat-composer-uploads { max-height: 12rem; overflow-y: auto; margin-bottom: 0.5rem; }
.message-chat-header { flex: 0 0 auto; padding: 1rem; border-bottom: 1px solid var(--gray-200); }
.dark .message-chat-header { border-bottom-color: var(--gray-700); }
.message-chat-header h1 { margin: 0 0 0.25rem; font-size: 1.25rem; line-height: 1.4; font-weight: 700; overflow-wrap: anywhere; }
.message-chat-header .message-chat-participants { color: var(--gray-500); }
.dark .message-chat-header .message-chat-participants { color: var(--gray-400); }
.message-chat-header .message-chat-participant-link { text-decoration: underline; text-underline-offset: 0.15em; }
.message-chat-scroll .fi-ta-ctn { border: 0; border-radius: 0; box-shadow: none; }
.message-chat-scroll .fi-ta-content-ctn { border-bottom: 0; border-radius: 0; }

.message-chat-history { flex: 0 0 auto; width: 100%; margin-top: auto; }
.message-chat-viewport { position: relative; display: flex; flex-direction: column; flex: 1 1 0; min-height: 0; }
.message-chat-scroll-down { position: absolute; bottom: 1rem; inset-inline-end: 1rem; z-index: 10; }
.message-chat-scroll-down .fi-icon-btn { width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--gray-100); color: var(--gray-600); border: 1px solid var(--gray-200); box-shadow: 0 2px 8px rgb(0 0 0 / 12%); }
.dark .message-chat-scroll-down .fi-icon-btn { background: var(--gray-800); color: var(--gray-300); border-color: var(--gray-700); }
.message-chat-table .fi-ta-record .fi-ta-record-content { padding-inline-end: 0; }
.message-chat-table .fi-ta-record .fi-ta-actions { padding-inline-start: 0; }
.message-thread-preview .fi-ta-text-description { max-width: min(30rem, 50vw); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.message-chat-selected-files { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.message-chat-selected-files:not(:empty) { margin-bottom: 0.5rem; }
.message-chat-selected-file { display: flex; align-items: center; gap: 0.375rem; max-width: 100%; padding: 0.25rem 0.5rem; border: 1px solid var(--gray-300); border-radius: 0.5rem; font-size: 0.875rem; }
.message-chat-selected-file > span { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.dark .message-chat-selected-file { border-color: var(--gray-700); }
.message-chat-header { display: flex; align-items: center; gap: 0.75rem; }
.message-chat-header-details { flex: 1; min-width: 0; }
.message-chat-settings-list { display: flex; flex-direction: column; max-height: 24rem; overflow-y: auto; }
.message-chat-settings-row { display: flex; justify-content: space-between; gap: 0.75rem; padding: 0.75rem 0; border-bottom: 1px solid var(--gray-200); overflow-wrap: anywhere; }
.dark .message-chat-settings-row { border-color: var(--gray-700); }
.message-chat-settings-row small { flex-shrink: 0; color: var(--gray-500); }

.message-chat-image-trigger { display: flex; flex-direction: column; gap: .375rem; max-width: 100%; text-align: start; cursor: zoom-in; overflow-wrap: anywhere; }
.message-chat-image-thumbnail { display: block; width: auto; max-width: min(16rem, 100%); max-height: 12rem; object-fit: contain; border-radius: .5rem; }
.message-chat-image-preview { display: block; width: 100%; max-height: 75dvh; object-fit: contain; }