/* /Components/Editor/MarkdownEditor.razor.rz.scp.css */
.markdown-editor[b-u9xqiujvxn] {
    --editor-border: color-mix(in srgb, var(--text-secondary, #5a6a7e) 18%, transparent);
    --editor-surface: var(--card-bg, #ffffff);
    --editor-bg-subtle: color-mix(in srgb, var(--bg-secondary, #f8faff) 60%, var(--card-bg, #ffffff));
    --editor-text: var(--text-color, #2c3e50);
    --editor-text-muted: var(--text-secondary, #5a6a7e);
    --editor-primary: var(--primary-color, #1b54f5);
    --editor-primary-hover: var(--primary-hover, #1440bd);
    --editor-primary-light: color-mix(in srgb, var(--editor-primary) 10%, transparent);
    --editor-focus-ring: color-mix(in srgb, var(--editor-primary) 14%, transparent);

    background: var(--editor-surface);
    border: 1px solid var(--editor-border);
    border-radius: 14px;
    box-shadow: 0 1px 4px color-mix(in srgb, #000 4%, transparent);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.markdown-editor:focus-within[b-u9xqiujvxn] {
    border-color: color-mix(in srgb, var(--editor-primary) 50%, transparent);
    box-shadow: 0 0 0 3px var(--editor-focus-ring);
}

/* Header with Mode Switcher */
.markdown-editor__header[b-u9xqiujvxn] {
    align-items: center;
    background: var(--editor-bg-subtle);
    border-bottom: 1px solid var(--editor-border);
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding: 8px 12px;
}

.markdown-editor__modes[b-u9xqiujvxn] {
    background: color-mix(in srgb, var(--text-secondary) 12%, transparent);
    border-radius: 10px;
    display: inline-flex;
    gap: 2px;
    padding: 3px;
}

.markdown-editor__modes button[b-u9xqiujvxn] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 7px;
    color: var(--editor-text-muted);
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 650;
    gap: 6px;
    min-height: 28px;
    padding: 4px 12px;
    transition: all 0.15s ease;
}

.markdown-editor__modes button:hover:not(:disabled):not(.is-active)[b-u9xqiujvxn] {
    background: color-mix(in srgb, var(--text-secondary) 10%, transparent);
    color: var(--editor-text);
}

.markdown-editor__modes button.is-active[b-u9xqiujvxn] {
    background: var(--card-bg, #ffffff);
    box-shadow: 0 1px 4px color-mix(in srgb, #000 10%, transparent);
    color: var(--editor-primary);
    font-weight: 750;
}

.markdown-editor__modes button:disabled[b-u9xqiujvxn] {
    cursor: not-allowed;
    opacity: 0.5;
}

.markdown-editor__format[b-u9xqiujvxn] {
    align-items: center;
    background: color-mix(in srgb, var(--text-secondary) 8%, transparent);
    border-radius: 6px;
    color: var(--editor-text-muted);
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 600;
    gap: 6px;
    padding: 4px 9px;
}

/* Toolbar */
.markdown-editor__toolbar[b-u9xqiujvxn] {
    align-items: center;
    background: var(--editor-bg-subtle);
    border-bottom: 1px solid var(--editor-border);
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    padding: 7px 12px;
}

.markdown-editor__toolbar-group[b-u9xqiujvxn] {
    align-items: center;
    display: inline-flex;
    gap: 4px;
}

.markdown-editor__toolbar button[b-u9xqiujvxn] {
    align-items: center;
    background: var(--card-bg, #ffffff);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 8px;
    box-shadow: 0 1px 2px color-mix(in srgb, #000 3%, transparent);
    color: var(--editor-text);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.84rem;
    height: 32px;
    justify-content: center;
    min-height: 32px;
    padding: 0;
    transition: all 0.15s ease;
    width: 32px;
}

.markdown-editor__toolbar button:hover:not(:disabled)[b-u9xqiujvxn] {
    background: var(--editor-primary-light);
    border-color: var(--editor-primary);
    color: var(--editor-primary);
    transform: translateY(-1px);
}

.markdown-editor__toolbar button:active:not(:disabled)[b-u9xqiujvxn] {
    transform: translateY(0);
}

.markdown-editor__toolbar button:disabled[b-u9xqiujvxn] {
    cursor: not-allowed;
    opacity: 0.45;
}

.markdown-editor__toolbar select[b-u9xqiujvxn] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: var(--card-bg, #ffffff);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%235a6a7e'%3E%3Cpath fill-rule='evenodd' d='M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z' clip-rule='evenodd'/%3E%3C/svg%3E");
    background-position: right 8px center;
    background-repeat: no-repeat;
    background-size: 13px;
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 8px;
    box-shadow: 0 1px 2px color-mix(in srgb, #000 3%, transparent);
    color: var(--editor-text);
    cursor: pointer;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 600;
    height: 32px;
    min-height: 32px;
    padding: 0 26px 0 10px;
    transition: all 0.15s ease;
}

.markdown-editor__toolbar select:hover:not(:disabled)[b-u9xqiujvxn] {
    border-color: var(--editor-primary);
    color: var(--editor-primary);
}

.markdown-editor__toolbar select:focus[b-u9xqiujvxn] {
    border-color: var(--editor-primary);
    box-shadow: 0 0 0 2px var(--editor-focus-ring);
    outline: none;
}

.markdown-editor__separator[b-u9xqiujvxn] {
    background: var(--editor-border);
    height: 20px;
    margin: 0 4px;
    width: 1px;
}

/* Surfaces */
.markdown-editor__surface[b-u9xqiujvxn] {
    background: var(--editor-surface);
    display: flex;
    flex: 1 1 auto;
    position: relative;
}

.markdown-editor__surface[hidden][b-u9xqiujvxn] {
    display: none;
}

.markdown-editor__visual[b-u9xqiujvxn],
.markdown-editor__source[b-u9xqiujvxn],
.markdown-editor__preview[b-u9xqiujvxn] {
    background: var(--editor-surface);
    border: 0;
    box-sizing: border-box;
    color: var(--editor-text);
    font: inherit;
    font-size: 0.94rem;
    line-height: 1.7;
    min-height: var(--editor-min-height, 360px);
    outline: 0;
    padding: 16px 20px;
    width: 100%;
}

.markdown-editor__visual:empty[b-u9xqiujvxn]::before {
    color: var(--editor-text-muted);
    content: attr(data-placeholder);
    opacity: 0.65;
    pointer-events: none;
}

.markdown-editor__source[b-u9xqiujvxn] {
    background: var(--editor-surface);
    border: 0;
    color: var(--editor-text);
    display: block;
    font-family: "Cascadia Code", "Fira Code", Consolas, "Courier New", monospace;
    font-size: 0.91rem;
    line-height: 1.65;
    resize: vertical;
    tab-size: 4;
}

.markdown-editor__source:focus[b-u9xqiujvxn] {
    outline: none;
}

.markdown-editor__preview[b-u9xqiujvxn] {
    overflow: auto;
}

.markdown-editor__empty[b-u9xqiujvxn] {
    color: var(--editor-text-muted);
    font-style: italic;
    opacity: 0.7;
}

/* Footer */
.markdown-editor__footer[b-u9xqiujvxn] {
    align-items: center;
    background: var(--editor-bg-subtle);
    border-top: 1px solid var(--editor-border);
    color: var(--editor-text-muted);
    display: flex;
    font-size: 0.81rem;
    font-weight: 550;
    justify-content: space-between;
    padding: 7px 14px;
}

.markdown-editor__stats[b-u9xqiujvxn] {
    align-items: center;
    display: inline-flex;
    gap: 5px;
}

.markdown-editor__dirty[b-u9xqiujvxn] {
    align-items: center;
    background: color-mix(in srgb, #f59e0b 14%, transparent);
    border-radius: 6px;
    color: #b45309;
    display: inline-flex;
    font-size: 0.77rem;
    font-weight: 700;
    gap: 6px;
    padding: 2px 8px;
}

.markdown-editor__dirty i[b-u9xqiujvxn] {
    animation: editorPulse-b-u9xqiujvxn 1.5s infinite;
    font-size: 0.45rem;
}

@keyframes editorPulse-b-u9xqiujvxn {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

/* Image Form */
.markdown-editor__image-form[b-u9xqiujvxn] {
    background: var(--editor-bg-subtle);
    border-bottom: 1px solid var(--editor-border);
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(120px, 160px) 1fr;
    padding: 16px;
}

.markdown-editor__image-form img[b-u9xqiujvxn] {
    background: var(--card-bg, #ffffff);
    border: 1px solid var(--editor-border);
    border-radius: 10px;
    max-height: 140px;
    object-fit: contain;
    width: 100%;
}

.markdown-editor__image-fields[b-u9xqiujvxn] {
    display: grid;
    gap: 10px;
}

.markdown-editor__image-fields label[b-u9xqiujvxn] {
    color: var(--editor-text);
    display: grid;
    font-size: 0.82rem;
    font-weight: 650;
    gap: 4px;
}

.markdown-editor__image-fields input[b-u9xqiujvxn],
.markdown-editor__image-fields select[b-u9xqiujvxn] {
    background: var(--card-bg, #ffffff);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 8px;
    color: var(--editor-text);
    font-family: inherit;
    font-size: 0.85rem;
    padding: 6px 10px;
    width: 100%;
}

.markdown-editor__image-options[b-u9xqiujvxn],
.markdown-editor__image-actions[b-u9xqiujvxn] {
    display: flex;
    gap: 10px;
}

.markdown-editor__image-options label[b-u9xqiujvxn] {
    flex: 1;
}

.markdown-editor__image-actions button[b-u9xqiujvxn] {
    background: var(--card-bg, #ffffff);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 8px;
    cursor: pointer;
    font-family: inherit;
    font-size: 0.85rem;
    font-weight: 700;
    padding: 6px 14px;
    transition: all 0.15s ease;
}

.markdown-editor__image-actions button.primary[b-u9xqiujvxn] {
    background: var(--editor-primary);
    border-color: var(--editor-primary);
    color: #fff;
}

/* Errors & Validation */
.markdown-editor__error[b-u9xqiujvxn],
.markdown-editor__validation[b-u9xqiujvxn] {
    align-items: center;
    background: color-mix(in srgb, #ef4444 10%, transparent);
    border-bottom: 1px solid color-mix(in srgb, #ef4444 25%, transparent);
    color: #dc2626;
    display: flex;
    font-size: 0.84rem;
    font-weight: 600;
    gap: 8px;
    padding: 9px 14px;
}

.markdown-editor__validation[b-u9xqiujvxn] {
    border-bottom: 0;
    border-top: 1px solid color-mix(in srgb, #ef4444 25%, transparent);
    display: grid;
    gap: 4px;
}

.markdown-editor__file-input[b-u9xqiujvxn] {
    display: none;
}

.markdown-editor.is-disabled[b-u9xqiujvxn] {
    opacity: 0.65;
    pointer-events: none;
}

/* Responsive */
@media (max-width: 768px) {
    .markdown-editor__header[b-u9xqiujvxn] {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .markdown-editor__format[b-u9xqiujvxn] {
        display: none;
    }

    .markdown-editor__modes[b-u9xqiujvxn] {
        width: 100%;
    }

    .markdown-editor__modes button[b-u9xqiujvxn] {
        flex: 1;
        justify-content: center;
        padding-inline: 4px;
    }

    .markdown-editor__toolbar[b-u9xqiujvxn] {
        gap: 4px;
    }

    .markdown-editor__separator[b-u9xqiujvxn] {
        display: none;
    }

    .markdown-editor__visual[b-u9xqiujvxn],
    .markdown-editor__source[b-u9xqiujvxn],
    .markdown-editor__preview[b-u9xqiujvxn] {
        padding: 12px 14px;
    }

    .markdown-editor__image-form[b-u9xqiujvxn] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Layout/AdminSidebarMenu.razor.rz.scp.css */
.teacher-topbar[b-7h3lkhvha1] {
    align-items: center;
    background: color-mix(in srgb, var(--card-bg) 94%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    box-shadow: 0 2px 14px rgba(15, 23, 42, 0.08);
    display: flex;
    height: 64px;
    justify-content: space-between;
    left: 0;
    padding: 0 18px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1200;
}

.teacher-topbar__start[b-7h3lkhvha1],
.teacher-topbar__actions[b-7h3lkhvha1],
.teacher-brand[b-7h3lkhvha1],
.teacher-breadcrumbs[b-7h3lkhvha1] {
    align-items: center;
    display: flex;
}

.teacher-topbar__start[b-7h3lkhvha1] {
    gap: 12px;
    min-width: 0;
}

.teacher-topbar__actions[b-7h3lkhvha1] {
    flex: 0 0 auto;
    gap: 8px;
}

.teacher-icon-button[b-7h3lkhvha1] {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 12px;
    color: var(--text-secondary);
    cursor: pointer;
    display: inline-flex;
    height: 40px;
    justify-content: center;
    text-decoration: none;
    transition: 160ms ease;
    width: 40px;
}

.teacher-icon-button:hover[b-7h3lkhvha1],
.teacher-icon-button:focus-visible[b-7h3lkhvha1] {
    background: var(--accent-light);
    border-color: color-mix(in srgb, var(--primary-color) 25%, transparent);
    color: var(--primary-color);
    outline: none;
}

.teacher-brand[b-7h3lkhvha1] {
    color: var(--text-color);
    gap: 10px;
    min-width: 205px;
    text-decoration: none;
}

.teacher-brand__mark[b-7h3lkhvha1] {
    align-items: center;
    background: linear-gradient(145deg, var(--primary-color), #7c3aed);
    border-radius: 12px;
    color: #fff;
    display: inline-flex;
    flex: 0 0 38px;
    height: 38px;
    justify-content: center;
}

.teacher-brand__copy[b-7h3lkhvha1] {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
}

.teacher-brand__copy strong[b-7h3lkhvha1] {
    font-size: 0.95rem;
}

.teacher-brand__copy small[b-7h3lkhvha1] {
    color: var(--text-secondary);
    font-size: 0.7rem;
    margin-top: 3px;
}

.teacher-breadcrumbs[b-7h3lkhvha1] {
    color: var(--text-secondary);
    font-size: 0.82rem;
    gap: 8px;
    min-width: 0;
    white-space: nowrap;
}

.teacher-breadcrumbs a[b-7h3lkhvha1] {
    color: var(--text-secondary);
    text-decoration: none;
}

.teacher-breadcrumbs a:hover[b-7h3lkhvha1] {
    color: var(--primary-color);
}

.teacher-breadcrumbs span:last-child[b-7h3lkhvha1] {
    color: var(--text-color);
    font-weight: 700;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.teacher-breadcrumbs i[b-7h3lkhvha1] {
    font-size: 0.58rem;
    opacity: 0.55;
}

.teacher-logout-form[b-7h3lkhvha1] {
    margin: 0;
}

.teacher-logout[b-7h3lkhvha1] {
    align-items: center;
    background: color-mix(in srgb, #dc3545 10%, transparent);
    border: 1px solid transparent;
    border-radius: 12px;
    color: #dc3545;
    cursor: pointer;
    display: inline-flex;
    font-weight: 700;
    gap: 8px;
    height: 40px;
    padding: 0 14px;
    transition: 160ms ease;
}

.teacher-logout:hover[b-7h3lkhvha1],
.teacher-logout:focus-visible[b-7h3lkhvha1] {
    background: #dc3545;
    color: #fff;
    outline: none;
}

.teacher-sidebar[b-7h3lkhvha1] {
    background: var(--card-bg);
    border-right: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent);
    bottom: 0;
    box-shadow: 8px 0 24px rgba(15, 23, 42, 0.04);
    left: 0;
    overflow: hidden;
    position: fixed;
    top: 64px;
    transition: width 180ms ease, transform 180ms ease;
    width: 260px;
    z-index: 1100;
}

.teacher-sidebar__content[b-7h3lkhvha1] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 16px 12px 18px;
    scrollbar-width: thin;
}

.teacher-nav-section[b-7h3lkhvha1] {
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 13%, transparent);
    margin-top: 14px;
    padding-top: 14px;
}

.teacher-nav-section__title[b-7h3lkhvha1] {
    color: var(--text-secondary);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    min-height: 24px;
    padding: 2px 12px 7px;
    text-transform: uppercase;
    transition: opacity 120ms ease;
}

.teacher-sidebar__content[b-7h3lkhvha1]  .teacher-nav-link,
.teacher-nav-group summary[b-7h3lkhvha1] {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 12px;
    color: var(--text-secondary);
    cursor: pointer;
    display: flex;
    font-size: 0.9rem;
    font-weight: 650;
    gap: 12px;
    line-height: 1.25;
    min-height: 44px;
    padding: 9px 12px;
    text-decoration: none;
    transition: 150ms ease;
}

.teacher-sidebar__content[b-7h3lkhvha1]  .teacher-nav-link > i:first-child,
.teacher-nav-group summary > i:first-child[b-7h3lkhvha1] {
    flex: 0 0 20px;
    font-size: 1rem;
    text-align: center;
}

.teacher-sidebar__content[b-7h3lkhvha1]  .teacher-nav-link:hover,
.teacher-sidebar__content[b-7h3lkhvha1]  .teacher-nav-link:focus-visible,
.teacher-nav-group summary:hover[b-7h3lkhvha1],
.teacher-nav-group summary:focus-visible[b-7h3lkhvha1] {
    background: var(--accent-light);
    color: var(--primary-color);
    outline: none;
}

.teacher-sidebar__content[b-7h3lkhvha1]  .teacher-nav-link.active {
    background: linear-gradient(90deg, color-mix(in srgb, var(--primary-color) 15%, transparent), color-mix(in srgb, var(--primary-color) 6%, transparent));
    border-color: color-mix(in srgb, var(--primary-color) 20%, transparent);
    color: var(--primary-color);
}

.teacher-sidebar__content[b-7h3lkhvha1]  .teacher-nav-link--overview {
    color: var(--text-color);
    font-weight: 800;
}

.teacher-nav-group[b-7h3lkhvha1] {
    margin: 1px 0;
}

.teacher-nav-group summary[b-7h3lkhvha1] {
    list-style: none;
}

.teacher-nav-group summary[b-7h3lkhvha1]::-webkit-details-marker {
    display: none;
}

.teacher-nav-group__chevron[b-7h3lkhvha1] {
    font-size: 0.68rem;
    margin-left: auto;
    transition: transform 150ms ease;
}

.teacher-nav-group[open] .teacher-nav-group__chevron[b-7h3lkhvha1] {
    transform: rotate(180deg);
}

.teacher-nav-children[b-7h3lkhvha1] {
    border-left: 1px solid color-mix(in srgb, var(--primary-color) 23%, transparent);
    margin: 3px 0 6px 21px;
    padding-left: 7px;
}

.teacher-nav-children[b-7h3lkhvha1]  .teacher-nav-link {
    font-size: 0.82rem;
    min-height: 39px;
}

.teacher-nav-link--site[b-7h3lkhvha1] {
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent);
    border-radius: 0;
    margin-top: auto;
    padding-top: 14px;
}

.teacher-navigation.is-collapsed .teacher-sidebar[b-7h3lkhvha1] {
    width: 72px;
}

.teacher-navigation.is-collapsed .teacher-nav-section__title[b-7h3lkhvha1],
.teacher-navigation.is-collapsed[b-7h3lkhvha1]  .teacher-nav-link span,
.teacher-navigation.is-collapsed .teacher-nav-group summary span[b-7h3lkhvha1],
.teacher-navigation.is-collapsed .teacher-nav-group__chevron[b-7h3lkhvha1],
.teacher-navigation.is-collapsed .teacher-nav-children[b-7h3lkhvha1] {
    display: none;
}

.teacher-navigation.is-collapsed[b-7h3lkhvha1]  .teacher-nav-link,
.teacher-navigation.is-collapsed .teacher-nav-group summary[b-7h3lkhvha1] {
    justify-content: center;
    padding-left: 12px;
    padding-right: 12px;
}

.teacher-navigation.is-collapsed .teacher-nav-section__title[b-7h3lkhvha1] {
    min-height: 0;
    padding: 0;
}

.teacher-sidebar-overlay[b-7h3lkhvha1] {
    display: none;
}

@media (max-width: 1100px) {
    .teacher-breadcrumbs a:not(:last-of-type)[b-7h3lkhvha1],
    .teacher-breadcrumbs i:not(:last-of-type)[b-7h3lkhvha1] {
        display: none;
    }
}

@media (max-width: 900px) {
    .teacher-topbar[b-7h3lkhvha1] {
        padding: 0 12px;
    }

    .teacher-brand[b-7h3lkhvha1] {
        min-width: 0;
    }

    .teacher-brand__copy small[b-7h3lkhvha1],
    .teacher-breadcrumbs[b-7h3lkhvha1] {
        display: none;
    }

    .teacher-sidebar[b-7h3lkhvha1],
    .teacher-navigation.is-collapsed .teacher-sidebar[b-7h3lkhvha1] {
        transform: translateX(0);
        width: min(86vw, 300px);
    }

    .teacher-navigation.is-collapsed .teacher-sidebar[b-7h3lkhvha1] {
        transform: translateX(-105%);
    }

    .teacher-navigation.is-collapsed .teacher-nav-section__title[b-7h3lkhvha1],
    .teacher-navigation.is-collapsed[b-7h3lkhvha1]  .teacher-nav-link span,
    .teacher-navigation.is-collapsed .teacher-nav-group summary span[b-7h3lkhvha1],
    .teacher-navigation.is-collapsed .teacher-nav-group__chevron[b-7h3lkhvha1] {
        display: initial;
    }

    .teacher-navigation.is-collapsed[b-7h3lkhvha1]  .teacher-nav-link,
    .teacher-navigation.is-collapsed .teacher-nav-group summary[b-7h3lkhvha1] {
        justify-content: flex-start;
    }

    .teacher-sidebar-overlay[b-7h3lkhvha1] {
        background: rgba(15, 23, 42, 0.48);
        border: 0;
        bottom: 0;
        display: block;
        left: 0;
        position: fixed;
        right: 0;
        top: 64px;
        z-index: 1050;
    }
}

@media (max-width: 560px) {
    .teacher-brand__copy[b-7h3lkhvha1] {
        display: none;
    }

    .teacher-topbar__start[b-7h3lkhvha1] {
        gap: 7px;
    }

    .teacher-topbar__actions[b-7h3lkhvha1] {
        gap: 3px;
    }

    .teacher-topbar__actions > a[b-7h3lkhvha1] {
        display: none;
    }

    .teacher-logout[b-7h3lkhvha1] {
        padding: 0 11px;
    }

    .teacher-logout span[b-7h3lkhvha1] {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .teacher-sidebar[b-7h3lkhvha1],
    .teacher-icon-button[b-7h3lkhvha1],
    .teacher-sidebar__content[b-7h3lkhvha1]  .teacher-nav-link,
    .teacher-nav-group summary[b-7h3lkhvha1] {
        transition: none;
    }
}
.teacher-sidebar__content[b-7h3lkhvha1]  .chat-nav-badge {
    align-items: center;
    background: #3268da;
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    font-size: .68rem;
    font-weight: 800;
    justify-content: center;
    margin-left: auto;
    min-height: 21px;
    min-width: 21px;
    padding: 0 5px;
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
main[b-h0rcnbob0u] {
    margin-top: var(--header-height);
}

.a11y-panel[b-h0rcnbob0u] {
    position: fixed;
    top: var(--header-height);
    right: -320px;
    width: 300px;
    background: var(--card-bg);
    border-left: 4px solid var(--primary-color);
    padding: 25px;
    box-shadow: var(--shadow-md);
    z-index: 999;
    transition: var(--transition);
    border-bottom-left-radius: 20px;
}

    .a11y-panel.open[b-h0rcnbob0u] {
        right: 0;
    }

    .a11y-panel h3[b-h0rcnbob0u] {
        margin-bottom: 20px;
        font-size: 1.1rem;
        color: var(--primary-color);
    }

.a11y-control[b-h0rcnbob0u] {
    margin-bottom: 20px;
}

    .a11y-control label[b-h0rcnbob0u] {
        display: block;
        margin-bottom: 8px;
        font-weight: 600;
        font-size: 0.9rem;
    }

.a11y-btn-group[b-h0rcnbob0u] {
    display: flex;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--accent-light);
}

.a11y-btn[b-h0rcnbob0u] {
    flex: 1;
    padding: 10px;
    border: none;
    background: var(--bg-color);
    color: var(--text-color);
    cursor: pointer;
    font-weight: 600;
    transition: var(--transition);
}

    .a11y-btn:not(:last-child)[b-h0rcnbob0u] {
        border-right: 1px solid var(--accent-light);
    }

    .a11y-btn:hover[b-h0rcnbob0u] {
        background: var(--accent-light);
    }

#scrollToTop[b-h0rcnbob0u] {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 55px;
    height: 55px;
    background: var(--primary-color);
    color: white;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 10px 20px rgba(27, 84, 245, 0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    z-index: 900;
    transition: var(--transition);
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
}

    #scrollToTop.show[b-h0rcnbob0u] {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    #scrollToTop:hover[b-h0rcnbob0u] {
        transform: translateY(-5px);
        background: var(--primary-hover);
    }

@media (max-width: 768px) {
    .a11y-panel[b-h0rcnbob0u] {
        width: 100%;
        right: -100%;
        border-left: none;
        border-top: 4px solid var(--primary-color);
        border-radius: 0 0 20px 20px;
    }
}
/* /Components/Pages/Admin/AdminAbout.razor.rz.scp.css */
.about-admin-page[b-as96smjlul] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
    padding-bottom: 60px;
}

/* --- Хедер раздела --- */
.about-admin-header[b-as96smjlul] {
    align-items: flex-end;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.about-eyebrow[b-as96smjlul] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.about-admin-header h1[b-as96smjlul] {
    font-size: clamp(1.8rem, 3vw, 2.45rem);
    font-weight: 800;
    margin: 0 0 6px;
}

.about-admin-header p[b-as96smjlul] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    margin: 0;
    max-width: 680px;
}

.about-header-actions[b-as96smjlul] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.about-save-btn[b-as96smjlul] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.95rem;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 20px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.about-save-btn:hover:not(:disabled)[b-as96smjlul] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    transform: translateY(-1px);
}

.about-save-btn:disabled[b-as96smjlul] {
    cursor: not-allowed;
    opacity: 0.6;
}

/* --- Вкладки (Tabs) --- */
.about-tabs[b-as96smjlul] {
    background: transparent;
    border: 0;
}

.about-tabs[b-as96smjlul]  .rz-tabview-nav {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 14px;
    box-shadow: var(--shadow-sm);
    display: flex;
    gap: 6px;
    margin-bottom: 22px;
    padding: 6px;
}

.about-tabs[b-as96smjlul]  .rz-tabview-nav li {
    background: transparent !important;
    border: none !important;
    border-radius: 10px;
    flex: 1 1 auto;
    text-align: center;
    transition: all 0.15s ease;
}

.about-tabs[b-as96smjlul]  .rz-tabview-nav li .rz-tabview-link {
    border: none !important;
    border-radius: 10px;
    color: var(--text-secondary) !important;
    font-size: 0.9rem;
    font-weight: 700;
    justify-content: center;
    padding: 10px 16px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.about-tabs[b-as96smjlul]  .rz-tabview-nav li .rz-tabview-title {
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    text-transform: none !important;
}

/* Наведение на неактивные вкладки */
.about-tabs[b-as96smjlul]  .rz-tabview-nav li:not(.rz-tabview-selected):hover {
    background: color-mix(in srgb, var(--primary-color) 6%, transparent) !important;
}

.about-tabs[b-as96smjlul]  .rz-tabview-nav li:not(.rz-tabview-selected):hover .rz-tabview-link,
.about-tabs[b-as96smjlul]  .rz-tabview-nav li:not(.rz-tabview-selected):hover .rz-tabview-title {
    color: var(--text-color) !important;
}

/* Активная вкладка в стиле кабинета педагога */
.about-tabs[b-as96smjlul]  .rz-tabview-nav li.rz-tabview-selected {
    background: color-mix(in srgb, var(--primary-color) 12%, var(--card-bg)) !important;
    box-shadow: none !important;
}

.about-tabs[b-as96smjlul]  .rz-tabview-nav li.rz-tabview-selected .rz-tabview-link,
.about-tabs[b-as96smjlul]  .rz-tabview-nav li.rz-tabview-selected .rz-tabview-title,
.about-tabs[b-as96smjlul]  .rz-tabview-nav li.rz-tabview-selected span,
.about-tabs[b-as96smjlul]  .rz-tabview-nav li.rz-tabview-selected a {
    color: var(--primary-color) !important;
    -webkit-text-fill-color: var(--primary-color) !important;
    font-weight: 800 !important;
}

.about-tabs[b-as96smjlul]  .rz-tabview-panels {
    background: transparent;
    border: 0;
    padding: 0;
}

/* Контент вкладки */
.tab-pane-content[b-as96smjlul] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.tab-pane-toolbar[b-as96smjlul] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
}

.tab-pane-tip[b-as96smjlul] {
    align-items: center;
    color: var(--text-secondary);
    display: inline-flex;
    font-size: 0.88rem;
    gap: 8px;
}

.tab-pane-tip i[b-as96smjlul] {
    color: var(--primary-color);
}

.about-restore-btn[b-as96smjlul] {
    align-items: center;
    background: transparent !important;
    border: 0 !important;
    border-radius: 8px;
    box-shadow: none !important;
    color: var(--text-secondary) !important;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.84rem;
    font-weight: 650;
    gap: 6px;
    min-height: 32px;
    padding: 4px 10px;
    transition: all 0.15s ease;
}

.about-restore-btn:hover[b-as96smjlul] {
    background: color-mix(in srgb, var(--text-secondary) 10%, transparent) !important;
    color: var(--primary-color) !important;
}

/* --- Сетки --- */
.about-hero-grid[b-as96smjlul] {
    display: grid;
    gap: 24px;
    grid-template-columns: 1fr 380px;
}

.about-stats-grid[b-as96smjlul] {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.about-profile-header-grid[b-as96smjlul] {
    align-items: center;
    display: grid;
    gap: 20px;
    grid-template-columns: 1fr auto;
}

.about-markdown-two-cols[b-as96smjlul] {
    display: grid;
    gap: 20px;
    grid-template-columns: 1fr 1fr;
}

/* --- Карточки --- */
.about-card[b-as96smjlul] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    padding: 22px;
    transition: border-color 0.15s ease;
}

.about-card:hover[b-as96smjlul] {
    border-color: color-mix(in srgb, var(--primary-color) 25%, transparent);
}

.about-card__header[b-as96smjlul] {
    align-items: flex-start;
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 14px;
}

.about-card__header--between[b-as96smjlul] {
    align-items: center;
    justify-content: space-between;
}

.about-card__header-left[b-as96smjlul] {
    align-items: center;
    display: flex;
    gap: 12px;
}

.about-card__header i[b-as96smjlul] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 36px;
    font-size: 1.1rem;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.about-card__header h2[b-as96smjlul] {
    font-size: 1.15rem;
    font-weight: 750;
    margin: 0 0 3px;
}

.about-card__header p[b-as96smjlul] {
    color: var(--text-secondary);
    font-size: 0.83rem;
    margin: 0;
}

.about-card__header-actions[b-as96smjlul] {
    align-items: center;
    display: flex;
    gap: 8px;
}

.about-card__body[b-as96smjlul] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.about-fields-row[b-as96smjlul] {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.about-field[b-as96smjlul] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.about-field label[b-as96smjlul] {
    color: var(--text-color);
    font-size: 0.88rem;
    font-weight: 650;
}

/* --- Стилизация полей ввода и текстовых редакторов блоков --- */
.about-editor-badge[b-as96smjlul] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--primary-color) 20%, transparent);
    border-radius: 8px;
    color: var(--primary-color);
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 700;
    gap: 6px;
    padding: 4px 10px;
    white-space: nowrap;
}

.about-card__body[b-as96smjlul]  .rz-textbox,
.about-card__body[b-as96smjlul]  .rz-textarea,
.about-field[b-as96smjlul]  .rz-textbox,
.about-field[b-as96smjlul]  .rz-textarea,
.approach-item[b-as96smjlul]  .rz-textbox,
.approach-item[b-as96smjlul]  .rz-textarea {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    font-family: inherit;
    font-size: 0.92rem;
    padding: 10px 14px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px color-mix(in srgb, #000 3%, transparent);
}

.about-card__body[b-as96smjlul]  .rz-textbox:focus,
.about-card__body[b-as96smjlul]  .rz-textarea:focus,
.about-field[b-as96smjlul]  .rz-textbox:focus,
.about-field[b-as96smjlul]  .rz-textarea:focus,
.approach-item[b-as96smjlul]  .rz-textbox:focus,
.approach-item[b-as96smjlul]  .rz-textarea:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 14%, transparent);
    outline: none;
}

.about-field[b-as96smjlul]  .rz-textarea,
.approach-item[b-as96smjlul]  .rz-textarea {
    line-height: 1.6;
    resize: vertical;
}

/* --- Загрузка фото Hero и профиля --- */
.hero-photo-preview[b-as96smjlul] {
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 12px;
    height: 240px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.hero-photo-preview img[b-as96smjlul] {
    height: 100%;
    object-fit: cover;
    object-position: top center;
    width: 100%;
}

.hero-photo-placeholder[b-as96smjlul] {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: 100%;
    justify-content: center;
}

.hero-photo-placeholder i[b-as96smjlul] {
    font-size: 3rem;
    opacity: 0.4;
}

.photo-upload-box[b-as96smjlul] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 12px;
    width: 100%;
}

.photo-upload-label[b-as96smjlul] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border: 1.5px solid color-mix(in srgb, var(--primary-color) 28%, transparent);
    border-radius: 12px;
    box-shadow: var(--shadow-sm);
    color: var(--primary-color);
    cursor: pointer;
    display: flex;
    font-size: 0.9rem;
    font-weight: 750;
    gap: 9px;
    justify-content: center;
    min-height: 42px;
    overflow: hidden;
    padding: 0 16px;
    position: relative;
    text-align: center;
    transition: all 0.15s ease;
    width: 100%;
}

.photo-upload-label:hover[b-as96smjlul] {
    background: color-mix(in srgb, var(--primary-color) 14%, var(--card-bg));
    border-color: var(--primary-color);
    transform: translateY(-1px);
}

.photo-upload-label span[b-as96smjlul] {
    white-space: nowrap;
}

.photo-upload-label[b-as96smjlul]  input[type="file"],
.photo-upload-label[b-as96smjlul]  .photo-input-file,
.photo-upload-box[b-as96smjlul]  input[type="file"],
.profile-avatar-upload[b-as96smjlul]  input[type="file"],
.photo-input-file[b-as96smjlul] {
    border: 0 !important;
    clip: rect(0, 0, 0, 0) !important;
    height: 1px !important;
    margin: -1px !important;
    opacity: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    pointer-events: none !important;
    position: absolute !important;
    white-space: nowrap !important;
    width: 1px !important;
}

.upload-tip[b-as96smjlul] {
    color: var(--text-secondary);
    display: block;
    font-size: 0.78rem;
    text-align: center;
}

/* Профиль аватар */
.about-profile-avatar-box[b-as96smjlul] {
    align-items: center;
    display: flex;
    gap: 16px;
}

.profile-avatar-wrapper[b-as96smjlul] {
    align-items: center;
    background: var(--bg-secondary);
    border: 2px solid var(--primary-color);
    border-radius: 50%;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 72px;
    font-size: 1.8rem;
    height: 72px;
    justify-content: center;
    overflow: hidden;
    width: 72px;
}

.profile-avatar-wrapper img[b-as96smjlul] {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.profile-avatar-upload[b-as96smjlul] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* --- Кнопки действий карточки подхода --- */
.about-btn-action[b-as96smjlul] {
    align-items: center;
    background: transparent !important;
    border: 0 !important;
    border-radius: 8px;
    box-shadow: none !important;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.85rem;
    font-weight: 750;
    gap: 6px;
    min-height: 32px;
    padding: 4px 10px;
    transition: all 0.15s ease;
}

.about-btn-action--add[b-as96smjlul] {
    background: transparent !important;
    color: var(--primary-color) !important;
}

.about-btn-action--add:hover[b-as96smjlul] {
    background: color-mix(in srgb, var(--primary-color) 10%, transparent) !important;
    color: var(--primary-color) !important;
}

.about-btn-action--restore[b-as96smjlul] {
    background: transparent !important;
    border: 0 !important;
    color: var(--text-secondary) !important;
}

.about-btn-action--restore:hover[b-as96smjlul] {
    background: color-mix(in srgb, var(--text-secondary) 10%, transparent) !important;
    color: var(--text-color) !important;
}

/* Элементы списка подхода */
.approach-cards-list[b-as96smjlul] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.approach-item[b-as96smjlul] {
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 12px;
    display: flex;
    gap: 16px;
    padding: 16px;
    position: relative;
    transition: border-color 0.15s ease;
}

.approach-item:hover[b-as96smjlul] {
    border-color: color-mix(in srgb, var(--primary-color) 30%, transparent);
}

.approach-remove-btn[b-as96smjlul] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: #ef4444;
    cursor: pointer;
    display: flex;
    font-size: 0.95rem;
    height: 30px;
    justify-content: center;
    position: absolute;
    right: 10px;
    top: 10px;
    transition: background 0.15s ease;
    width: 30px;
}

.approach-remove-btn:hover[b-as96smjlul] {
    background: color-mix(in srgb, #ef4444 14%, transparent);
}

.approach-item__icon-col[b-as96smjlul] {
    align-items: center;
    display: flex;
    flex: 0 0 130px;
    flex-direction: column;
    gap: 8px;
}

.approach-icon-preview[b-as96smjlul] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 12px;
    color: var(--primary-color);
    display: flex;
    font-size: 1.5rem;
    height: 54px;
    justify-content: center;
    width: 54px;
}

.approach-icon-dropdown[b-as96smjlul] {
    width: 100%;
}

.approach-item__fields-col[b-as96smjlul] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 12px;
    padding-right: 32px;
}

.approach-empty[b-as96smjlul] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px dashed color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 12px;
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 36px 20px;
    text-align: center;
}

.approach-empty i[b-as96smjlul] {
    font-size: 2.2rem;
    opacity: 0.5;
}

/* --- Загрузка --- */
.about-loading[b-as96smjlul] {
    align-items: center;
    background: var(--card-bg);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    padding: 60px 20px;
}

/* --- Адаптивность --- */
@media (max-width: 992px) {
    .about-admin-header[b-as96smjlul] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .about-header-actions[b-as96smjlul] {
        width: 100%;
    }

    .about-save-btn[b-as96smjlul] {
        justify-content: center;
        width: 100%;
    }

    .about-hero-grid[b-as96smjlul] {
        grid-template-columns: 1fr;
    }

    .about-markdown-two-cols[b-as96smjlul] {
        grid-template-columns: 1fr;
    }

    .about-profile-header-grid[b-as96smjlul] {
        grid-template-columns: 1fr;
    }

    .about-card__header--between[b-as96smjlul] {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .about-card__header-actions[b-as96smjlul] {
        width: 100%;
    }

    .about-card__header-actions button[b-as96smjlul] {
        flex: 1;
        justify-content: center;
    }
}

@media (max-width: 768px) {
    [b-as96smjlul] .rz-tabview-nav {
        flex-direction: column;
    }

    .approach-item[b-as96smjlul] {
        flex-direction: column;
    }

    .approach-item__icon-col[b-as96smjlul] {
        flex-direction: row;
        width: 100%;
    }

    .approach-item__fields-col[b-as96smjlul] {
        padding-right: 0;
    }
}
/* /Components/Pages/Admin/AdminDashboard.razor.rz.scp.css */
.teacher-dashboard[b-100qf6huf2] {
    display: grid;
    gap: 24px;
}

.dashboard-hero[b-100qf6huf2] {
    align-items: flex-end;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    padding: 8px 4px 0;
}

.dashboard-eyebrow[b-100qf6huf2],
.section-kicker[b-100qf6huf2] {
    color: var(--primary-color);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.09em;
    margin: 0 0 6px;
    text-transform: uppercase;
}

.dashboard-hero h1[b-100qf6huf2] {
    font-size: clamp(1.75rem, 2.8vw, 2.55rem);
    margin: 0;
}

.dashboard-lead[b-100qf6huf2] {
    color: var(--text-secondary);
    margin: 7px 0 0;
    max-width: 680px;
}

.dashboard-quick-links[b-100qf6huf2] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: flex-end;
}

.dashboard-quick-links a[b-100qf6huf2],
.section-link[b-100qf6huf2] {
    align-items: center;
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 11px;
    color: var(--text-color);
    display: inline-flex;
    font-size: 0.82rem;
    font-weight: 700;
    gap: 8px;
    padding: 9px 12px;
    text-decoration: none;
    transition: 160ms ease;
}

.dashboard-quick-links a:hover[b-100qf6huf2],
.dashboard-quick-links a:focus-visible[b-100qf6huf2],
.section-link:hover[b-100qf6huf2],
.section-link:focus-visible[b-100qf6huf2] {
    background: var(--accent-light);
    border-color: color-mix(in srgb, var(--primary-color) 35%, transparent);
    color: var(--primary-color);
    outline: none;
}

.dashboard-metrics[b-100qf6huf2] {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.work-metric[b-100qf6huf2],
.dashboard-panel[b-100qf6huf2] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent);
    box-shadow: var(--shadow-sm);
}

.work-metric[b-100qf6huf2] {
    align-items: center;
    border-radius: 16px;
    color: var(--text-color);
    display: grid;
    gap: 12px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    min-height: 136px;
    padding: 18px;
    text-decoration: none;
    transition: 170ms ease;
}

.work-metric:hover[b-100qf6huf2],
.work-metric:focus-visible[b-100qf6huf2] {
    border-color: color-mix(in srgb, var(--primary-color) 35%, transparent);
    box-shadow: var(--shadow-md);
    outline: none;
    transform: translateY(-2px);
}

.work-metric__icon[b-100qf6huf2],
.dashboard-empty-state__icon[b-100qf6huf2],
.attention-item__icon[b-100qf6huf2],
.site-status-card__icon[b-100qf6huf2] {
    align-items: center;
    border-radius: 13px;
    display: inline-flex;
    flex: 0 0 auto;
    justify-content: center;
}

.work-metric__icon[b-100qf6huf2] {
    height: 46px;
    width: 46px;
}

.work-metric__icon--blue[b-100qf6huf2] {
    background: color-mix(in srgb, var(--card-bg) 68%, #e8efff);
    color: #1b54f5;
}

.work-metric__icon--violet[b-100qf6huf2] {
    background: color-mix(in srgb, var(--card-bg) 68%, #f2eaff);
    color: #7c3aed;
}

.work-metric__icon--green[b-100qf6huf2] {
    background: color-mix(in srgb, var(--card-bg) 68%, #e8f8f0);
    color: #15835d;
}

.work-metric__icon--amber[b-100qf6huf2] {
    background: color-mix(in srgb, var(--card-bg) 68%, #fff3df);
    color: #b86b00;
}

.work-metric__body[b-100qf6huf2] {
    display: grid;
    min-width: 0;
}

.work-metric__label[b-100qf6huf2] {
    color: var(--text-secondary);
    font-size: 0.8rem;
    font-weight: 700;
}

.work-metric strong[b-100qf6huf2] {
    font-size: 1.75rem;
    line-height: 1.15;
}

.work-metric small[b-100qf6huf2] {
    color: var(--text-secondary);
    display: -webkit-box;
    font-size: 0.7rem;
    line-height: 1.35;
    margin-top: 4px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.work-metric__arrow[b-100qf6huf2] {
    color: color-mix(in srgb, var(--text-secondary) 55%, transparent);
    font-size: 0.78rem;
}

.dashboard-primary-grid[b-100qf6huf2] {
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
}

.dashboard-panel[b-100qf6huf2] {
    border-radius: 18px;
    padding: 22px;
}

.dashboard-panel__header[b-100qf6huf2] {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 20px;
}

.dashboard-panel__header h2[b-100qf6huf2] {
    font-size: 1.16rem;
    margin: 0;
}

.dashboard-empty-state[b-100qf6huf2] {
    align-items: center;
    background: color-mix(in srgb, var(--bg-secondary) 75%, transparent);
    border: 1px dashed color-mix(in srgb, var(--text-secondary) 30%, transparent);
    border-radius: 14px;
    display: flex;
    gap: 16px;
    min-height: 170px;
    padding: 24px;
}

.dashboard-empty-state__icon[b-100qf6huf2] {
    background: var(--accent-light);
    color: var(--primary-color);
    font-size: 1.35rem;
    height: 52px;
    width: 52px;
}

.dashboard-empty-state h3[b-100qf6huf2] {
    font-size: 1rem;
    margin: 0 0 5px;
}

.dashboard-empty-state p[b-100qf6huf2] {
    color: var(--text-secondary);
    font-size: 0.86rem;
    line-height: 1.55;
    margin: 0;
    max-width: 620px;
}

.attention-count[b-100qf6huf2] {
    align-items: center;
    background: color-mix(in srgb, var(--card-bg) 72%, #fff0ee);
    border-radius: 999px;
    color: #c2382b;
    display: inline-flex;
    font-size: 0.8rem;
    font-weight: 800;
    height: 28px;
    justify-content: center;
    min-width: 28px;
    padding: 0 8px;
}

.attention-item[b-100qf6huf2] {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 13px;
    color: var(--text-color);
    display: grid;
    gap: 12px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    padding: 14px;
    text-decoration: none;
}

.attention-item--danger[b-100qf6huf2] {
    background: color-mix(in srgb, var(--card-bg) 78%, #fff5f3);
    border-color: color-mix(in srgb, var(--card-bg) 45%, #ffd6d0);
}

.attention-item__icon[b-100qf6huf2] {
    background: color-mix(in srgb, var(--card-bg) 55%, #ffe1dc);
    color: #c2382b;
    height: 38px;
    width: 38px;
}

.attention-item > span:nth-child(2)[b-100qf6huf2] {
    display: grid;
    min-width: 0;
}

.attention-item small[b-100qf6huf2],
.attention-item > span:nth-child(2) > span[b-100qf6huf2] {
    color: var(--text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.attention-item small[b-100qf6huf2] {
    font-size: 0.68rem;
    margin: 2px 0 4px;
}

.attention-item > span:nth-child(2) > span[b-100qf6huf2] {
    font-size: 0.78rem;
}

.attention-clear[b-100qf6huf2] {
    align-items: center;
    background: color-mix(in srgb, var(--card-bg) 86%, #15835d);
    border: 1px solid color-mix(in srgb, var(--card-bg) 64%, #15835d);
    border-radius: 13px;
    color: color-mix(in srgb, var(--text-color) 58%, #15835d);
    display: flex;
    gap: 12px;
    padding: 15px;
}

.attention-clear > i[b-100qf6huf2] {
    font-size: 1.3rem;
}

.attention-clear div[b-100qf6huf2] {
    display: grid;
}

.attention-clear span[b-100qf6huf2] {
    font-size: 0.76rem;
    opacity: 0.8;
}

.attention-pending[b-100qf6huf2] {
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent);
    margin-top: 18px;
    padding-top: 16px;
}

.attention-pending p[b-100qf6huf2] {
    color: var(--text-secondary);
    font-size: 0.76rem;
    margin: 0 0 10px;
}

.attention-pending__tags[b-100qf6huf2] {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.attention-pending__tags span[b-100qf6huf2] {
    background: var(--bg-secondary);
    border-radius: 999px;
    color: var(--text-secondary);
    font-size: 0.68rem;
    font-weight: 700;
    padding: 5px 9px;
}

.site-status__updated[b-100qf6huf2] {
    color: var(--text-secondary);
    font-size: 0.72rem;
}

.site-status__grid[b-100qf6huf2] {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.site-status-card[b-100qf6huf2] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid transparent;
    border-radius: 14px;
    color: var(--text-color);
    display: flex;
    gap: 13px;
    min-width: 0;
    padding: 15px;
    text-decoration: none;
    transition: 160ms ease;
}

.site-status-card:hover[b-100qf6huf2],
.site-status-card:focus-visible[b-100qf6huf2] {
    border-color: color-mix(in srgb, var(--primary-color) 30%, transparent);
    outline: none;
}

.site-status-card__icon[b-100qf6huf2] {
    background: var(--card-bg);
    color: var(--primary-color);
    height: 40px;
    width: 40px;
}

.site-status-card > span:last-child[b-100qf6huf2] {
    display: grid;
    min-width: 0;
}

.site-status-card strong[b-100qf6huf2] {
    font-size: 1.32rem;
    line-height: 1.1;
}

.site-status-card span span[b-100qf6huf2] {
    font-size: 0.77rem;
    font-weight: 700;
}

.site-status-card small[b-100qf6huf2] {
    color: var(--text-secondary);
    font-size: 0.66rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.site-status-card--warning .site-status-card__icon[b-100qf6huf2] {
    color: #c2382b;
}

@media (max-width: 1180px) {
    .dashboard-metrics[b-100qf6huf2],
    .site-status__grid[b-100qf6huf2] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-primary-grid[b-100qf6huf2] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .dashboard-hero[b-100qf6huf2] {
        align-items: stretch;
        flex-direction: column;
    }

    .dashboard-quick-links[b-100qf6huf2] {
        justify-content: flex-start;
    }
}

@media (max-width: 560px) {
    .teacher-dashboard[b-100qf6huf2] {
        gap: 16px;
    }

    .dashboard-metrics[b-100qf6huf2],
    .site-status__grid[b-100qf6huf2] {
        grid-template-columns: 1fr;
    }

    .work-metric[b-100qf6huf2] {
        min-height: 112px;
        padding: 15px;
    }

    .dashboard-panel[b-100qf6huf2] {
        border-radius: 15px;
        padding: 17px;
    }

    .dashboard-panel__header[b-100qf6huf2] {
        align-items: flex-start;
        flex-direction: column;
        margin-bottom: 15px;
    }

    .dashboard-empty-state[b-100qf6huf2] {
        align-items: flex-start;
        min-height: auto;
        padding: 18px;
    }

    .site-status__updated[b-100qf6huf2] {
        margin-top: -8px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .work-metric[b-100qf6huf2],
    .dashboard-quick-links a[b-100qf6huf2],
    .section-link[b-100qf6huf2],
    .site-status-card[b-100qf6huf2] {
        transition: none;
    }

    .work-metric:hover[b-100qf6huf2] {
        transform: none;
    }
}

.dashboard-refresh[b-100qf6huf2], .dashboard-lesson__actions[b-100qf6huf2] { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
button.section-link[b-100qf6huf2] { background: var(--card-bg); cursor: pointer; font: inherit; font-size: .82rem; }
button.section-link:disabled[b-100qf6huf2] { opacity: .5; cursor: wait; }
.dashboard-error[b-100qf6huf2] { background: var(--card-bg); border: 1px solid #c2382b; border-radius: 12px; padding: 16px; color: var(--text-color); }
.dashboard-notice[b-100qf6huf2] { margin: 0; color: var(--text-secondary); }
.dashboard-next[b-100qf6huf2] { display: grid; gap: 4px; padding: 14px; margin-bottom: 14px; border-radius: 12px; background: var(--accent-light); color: var(--text-color); text-decoration: none; overflow-wrap: anywhere; }
.dashboard-next > span[b-100qf6huf2] { font-size: .78rem; color: var(--primary-color); }
.dashboard-lesson[b-100qf6huf2] { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 14px; padding: 16px 0; border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent); }
.dashboard-lesson:last-child[b-100qf6huf2] { border-bottom: 0; padding-bottom: 0; }
.dashboard-lesson time[b-100qf6huf2] { font-weight: 800; color: var(--primary-color); }
.dashboard-lesson small[b-100qf6huf2] { display: block; color: var(--text-secondary); font-size: .76rem; font-weight: 400; }
.dashboard-lesson__body[b-100qf6huf2] { min-width: 0; display: grid; gap: 4px; overflow-wrap: anywhere; }
.dashboard-lesson__body > a[b-100qf6huf2] { color: var(--text-color); text-decoration: none; }
.dashboard-detail[b-100qf6huf2] { display: grid; gap: 3px; margin: 0 0 8px 14px; padding: 8px 12px; border-left: 2px solid var(--accent-light); color: var(--text-color); text-decoration: none; overflow-wrap: anywhere; }
.dashboard-detail span[b-100qf6huf2] { color: var(--text-secondary); font-size: .78rem; }
.dashboard-detail:hover[b-100qf6huf2], .dashboard-lesson__body > a:hover[b-100qf6huf2] { color: var(--primary-color); }
.attention-item:not(.attention-item--danger):hover[b-100qf6huf2] { background: var(--bg-secondary); }
@media (max-width: 560px) {
    .dashboard-lesson[b-100qf6huf2] { gap: 10px; grid-template-columns: 48px minmax(0, 1fr); }
    .dashboard-lesson__actions .section-link[b-100qf6huf2] { padding: 8px; }
    .dashboard-detail[b-100qf6huf2] { margin-left: 0; }
    .dashboard-refresh .site-status__updated[b-100qf6huf2] { margin-top: 0; }
}
/* /Components/Pages/Admin/ArticlesList.razor.rz.scp.css */
.articles-page[b-pgfhkls4ys] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
}

/* --- Заголовок страницы --- */
.articles-header[b-pgfhkls4ys] {
    align-items: flex-end;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.articles-eyebrow[b-pgfhkls4ys] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.articles-header h1[b-pgfhkls4ys] {
    font-size: clamp(1.8rem, 3vw, 2.45rem);
    font-weight: 800;
    margin: 0 0 6px;
}

.articles-header p[b-pgfhkls4ys] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    margin: 0;
    max-width: 680px;
}

.articles-actions[b-pgfhkls4ys] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.articles-primary-action[b-pgfhkls4ys] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff !important;
    display: inline-flex;
    flex: 0 0 auto;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 18px;
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.articles-primary-action:hover[b-pgfhkls4ys] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    color: #fff !important;
    transform: translateY(-1px);
}

.articles-secondary-action[b-pgfhkls4ys] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    display: inline-flex;
    font-weight: 700;
    gap: 8px;
    min-height: 44px;
    padding: 0 16px;
    text-decoration: none;
    transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease;
}

.articles-secondary-action:hover[b-pgfhkls4ys] {
    background: color-mix(in srgb, var(--primary-color) 6%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
}

/* --- Карточки метрик --- */
.articles-metrics[b-pgfhkls4ys] {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    margin-bottom: 22px;
}

.articles-metrics article[b-pgfhkls4ys] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 16px 18px;
}

.articles-metrics article span[b-pgfhkls4ys] {
    color: var(--text-secondary);
    font-size: .78rem;
    font-weight: 750;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.articles-metrics article strong[b-pgfhkls4ys] {
    color: var(--text-color);
    font-size: 1.85rem;
    font-weight: 850;
    line-height: 1.15;
}

.articles-metrics article small[b-pgfhkls4ys] {
    color: var(--text-secondary);
    font-size: .76rem;
}

/* --- Панель поиска и фильтров --- */
.articles-toolbar[b-pgfhkls4ys] {
    align-items: end;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(240px, 2fr) minmax(160px, 1fr) minmax(160px, 1fr) minmax(160px, 1fr);
    margin-bottom: 16px;
    padding: 16px;
}

.articles-search[b-pgfhkls4ys],
.articles-filter[b-pgfhkls4ys] {
    display: grid;
    gap: 6px;
}

.articles-search > span[b-pgfhkls4ys],
.articles-filter > span[b-pgfhkls4ys] {
    color: var(--text-secondary);
    font-size: .75rem;
    font-weight: 750;
}

.articles-search > div[b-pgfhkls4ys] {
    align-items: center;
    display: flex;
    position: relative;
}

.articles-search i[b-pgfhkls4ys] {
    color: var(--text-secondary);
    left: 14px;
    pointer-events: none;
    position: absolute;
}

.articles-search input[b-pgfhkls4ys],
.articles-filter select[b-pgfhkls4ys] {
    background: color-mix(in srgb, var(--card-bg) 96%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 24%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    font: inherit;
    min-height: 44px;
    outline: none;
    width: 100%;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.articles-search input[b-pgfhkls4ys] {
    padding: 0 14px 0 40px;
}

.articles-filter select[b-pgfhkls4ys] {
    padding: 0 12px;
}

.articles-search input:focus[b-pgfhkls4ys],
.articles-filter select:focus[b-pgfhkls4ys] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 14%, transparent);
}

.articles-summary[b-pgfhkls4ys] {
    color: var(--text-secondary);
    font-size: .84rem;
    margin: 0 2px 14px;
}

.articles-summary strong[b-pgfhkls4ys] {
    color: var(--text-color);
}

/* --- Сетка карточек статей --- */
.articles-grid[b-pgfhkls4ys] {
    display: grid;
    gap: 16px;
}

.article-card[b-pgfhkls4ys] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 18px;
    box-shadow: var(--shadow-sm);
    display: grid;
    gap: 18px;
    grid-template-columns: 200px 1fr auto;
    overflow: hidden;
    padding: 18px;
    position: relative;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.article-card:hover[b-pgfhkls4ys] {
    border-color: color-mix(in srgb, var(--primary-color) 35%, transparent);
    box-shadow: var(--shadow-md);
    transform: translateY(-2px);
}

.article-card--draft[b-pgfhkls4ys]::before {
    background: #e69d19;
    content: "";
    height: 100%;
    inset: 0 auto 0 0;
    position: absolute;
    width: 4px;
}

.article-card--published[b-pgfhkls4ys]::before {
    background: #20a85b;
    content: "";
    height: 100%;
    inset: 0 auto 0 0;
    position: absolute;
    width: 4px;
}

/* Превью обложки */
.article-cover-wrap[b-pgfhkls4ys] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 6%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    border-radius: 12px;
    display: flex;
    height: 135px;
    justify-content: center;
    overflow: hidden;
    position: relative;
    width: 200px;
}

.article-cover-img[b-pgfhkls4ys] {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.article-cover-placeholder[b-pgfhkls4ys] {
    color: color-mix(in srgb, var(--primary-color) 40%, var(--text-secondary));
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    font-size: 1.8rem;
}

.article-cover-placeholder span[b-pgfhkls4ys] {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

/* Тело карточки */
.article-card__content[b-pgfhkls4ys] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.article-card__meta[b-pgfhkls4ys] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.article-status[b-pgfhkls4ys] {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    font-size: .72rem;
    font-weight: 800;
    gap: 5px;
    padding: 4px 10px;
}

.article-status--published[b-pgfhkls4ys] {
    background: color-mix(in srgb, #20a85b 12%, var(--card-bg));
    color: #148342;
}

.article-status--draft[b-pgfhkls4ys] {
    background: color-mix(in srgb, #e69d19 14%, var(--card-bg));
    color: #a86c00;
}

.article-date[b-pgfhkls4ys] {
    align-items: center;
    color: var(--text-secondary);
    display: inline-flex;
    font-size: .78rem;
    gap: 5px;
}

.article-id-badge[b-pgfhkls4ys] {
    color: var(--text-secondary);
    font-size: .74rem;
    font-weight: 700;
}

.article-card__title[b-pgfhkls4ys] {
    font-size: 1.18rem;
    font-weight: 800;
    line-height: 1.35;
    margin: 0;
}

.article-card__title a[b-pgfhkls4ys] {
    color: var(--text-color);
    text-decoration: none;
    transition: color 0.15s ease;
}

.article-card__title a:hover[b-pgfhkls4ys] {
    color: var(--primary-color);
}

.article-card__description[b-pgfhkls4ys] {
    color: var(--text-secondary);
    display: -webkit-box;
    font-size: .88rem;
    line-height: 1.5;
    margin: 0;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

/* Теги и бейджи вложений */
.article-card__footer[b-pgfhkls4ys] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: auto;
    padding-top: 6px;
}

.article-tags-list[b-pgfhkls4ys] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.article-tag[b-pgfhkls4ys] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--primary-color) 16%, transparent);
    border-radius: 8px;
    color: var(--primary-color);
    font-size: .73rem;
    font-weight: 750;
    padding: 3px 8px;
}

.article-attachments[b-pgfhkls4ys] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.article-attachment-badge[b-pgfhkls4ys] {
    align-items: center;
    background: color-mix(in srgb, var(--text-secondary) 10%, var(--card-bg));
    border-radius: 6px;
    color: var(--text-secondary);
    display: inline-flex;
    font-size: .72rem;
    font-weight: 700;
    gap: 4px;
    padding: 3px 7px;
}

.article-attachment-badge i[b-pgfhkls4ys] {
    font-size: .75rem;
}

/* Колонка действий */
.article-card__actions[b-pgfhkls4ys] {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: center;
}

.article-btn[b-pgfhkls4ys] {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 10px;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: .82rem;
    font-weight: 750;
    gap: 7px;
    justify-content: center;
    min-height: 38px;
    padding: 0 14px;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 100%;
}

.article-btn--view[b-pgfhkls4ys] {
    background: color-mix(in srgb, var(--primary-color) 9%, var(--card-bg));
    border-color: color-mix(in srgb, var(--primary-color) 18%, transparent);
    color: var(--primary-color) !important;
}

.article-btn--view:hover[b-pgfhkls4ys] {
    background: color-mix(in srgb, var(--primary-color) 18%, var(--card-bg));
    color: var(--primary-color) !important;
}

.article-btn--edit[b-pgfhkls4ys] {
    background: color-mix(in srgb, var(--text-secondary) 10%, var(--card-bg));
    border-color: color-mix(in srgb, var(--text-secondary) 20%, transparent);
    color: var(--text-color);
}

.article-btn--edit:hover[b-pgfhkls4ys] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.article-btn--delete[b-pgfhkls4ys] {
    background: transparent;
    border-color: color-mix(in srgb, #d44545 20%, transparent);
    color: #c93636;
}

.article-btn--delete:hover[b-pgfhkls4ys] {
    background: color-mix(in srgb, #d44545 10%, var(--card-bg));
    border-color: #d44545;
    color: #bd2525;
}

/* --- Пагинация --- */
.articles-pagination[b-pgfhkls4ys] {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: center;
    margin-top: 24px;
}

.articles-pagination button[b-pgfhkls4ys] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 9px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: .85rem;
    font-weight: 750;
    height: 40px;
    justify-content: center;
    min-width: 40px;
    padding: 0 12px;
    transition: all 0.15s ease;
}

.articles-pagination button:hover:not(:disabled)[b-pgfhkls4ys] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.articles-pagination button.is-active[b-pgfhkls4ys] {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
}

.articles-pagination button:disabled[b-pgfhkls4ys] {
    cursor: not-allowed;
    opacity: 0.45;
}

/* --- Состояния загрузки / пустые --- */
.articles-state[b-pgfhkls4ys],
.articles-empty[b-pgfhkls4ys] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 18px;
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    min-height: 280px;
    padding: 32px 20px;
    text-align: center;
}

.articles-empty > span[b-pgfhkls4ys] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg));
    border-radius: 18px;
    color: var(--primary-color);
    display: flex;
    font-size: 1.8rem;
    height: 64px;
    justify-content: center;
    width: 64px;
}

.articles-empty h2[b-pgfhkls4ys] {
    color: var(--text-color);
    font-size: 1.25rem;
    margin: 0;
}

.articles-empty p[b-pgfhkls4ys] {
    font-size: .9rem;
    margin: 0;
    max-width: 520px;
}

.articles-empty a[b-pgfhkls4ys],
.articles-empty button[b-pgfhkls4ys] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 11px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-weight: 750;
    gap: 8px;
    min-height: 42px;
    padding: 0 18px;
    text-decoration: none;
    margin-top: 6px;
}

/* --- Адаптивность (Планшеты и Мобильные) --- */
@media (max-width: 1024px) {
    .articles-toolbar[b-pgfhkls4ys] {
        grid-template-columns: 1fr 1fr;
    }

    .article-card[b-pgfhkls4ys] {
        grid-template-columns: 170px 1fr;
    }

    .article-cover-wrap[b-pgfhkls4ys] {
        height: 120px;
        width: 170px;
    }

    .article-card__actions[b-pgfhkls4ys] {
        flex-direction: row;
        grid-column: 1 / -1;
        justify-content: flex-end;
        padding-top: 10px;
        border-top: 1px solid color-mix(in srgb, var(--text-secondary) 10%, transparent);
    }

    .article-btn[b-pgfhkls4ys] {
        width: auto;
    }
}

@media (max-width: 768px) {
    .articles-header[b-pgfhkls4ys] {
        align-items: stretch;
        flex-direction: column;
    }

    .articles-actions[b-pgfhkls4ys] {
        width: 100%;
    }

    .articles-primary-action[b-pgfhkls4ys],
    .articles-secondary-action[b-pgfhkls4ys] {
        flex: 1;
        justify-content: center;
    }

    .articles-toolbar[b-pgfhkls4ys] {
        grid-template-columns: 1fr;
    }

    .article-card[b-pgfhkls4ys] {
        grid-template-columns: 1fr;
    }

    .article-cover-wrap[b-pgfhkls4ys] {
        height: 180px;
        width: 100%;
    }

    .article-card__actions[b-pgfhkls4ys] {
        flex-wrap: wrap;
        justify-content: stretch;
    }

    .article-btn[b-pgfhkls4ys] {
        flex: 1;
        min-height: 44px;
    }
}
/* /Components/Pages/Admin/CategoriesList.razor.rz.scp.css */
.categories-page[b-55ql5kr14u] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
    padding-bottom: 40px;
}

/* --- Заголовок раздела --- */
.categories-header[b-55ql5kr14u] {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.categories-header__main[b-55ql5kr14u] {
    flex: 1 1 320px;
}

.categories-eyebrow[b-55ql5kr14u] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.categories-title-row[b-55ql5kr14u] {
    align-items: center;
    display: flex;
    gap: 12px;
}

.categories-back-button[b-55ql5kr14u] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    display: inline-flex;
    height: 38px;
    justify-content: center;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 38px;
}

.categories-back-button:hover[b-55ql5kr14u] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
    transform: translateX(-2px);
}

.categories-header h1[b-55ql5kr14u] {
    font-size: clamp(1.6rem, 2.8vw, 2.2rem);
    font-weight: 800;
    margin: 0;
}

.categories-description[b-55ql5kr14u] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    line-height: 1.45;
    margin: 8px 0 0;
    max-width: 680px;
}

.categories-header__actions[b-55ql5kr14u] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.categories-secondary-action[b-55ql5kr14u] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    display: inline-flex;
    font-size: 0.9rem;
    font-weight: 700;
    gap: 8px;
    min-height: 42px;
    padding: 0 16px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.categories-secondary-action:hover[b-55ql5kr14u] {
    background: color-mix(in srgb, var(--primary-color) 6%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
    transform: translateY(-1px);
}

/* --- Загрузка --- */
.categories-state[b-55ql5kr14u] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 16px;
    color: var(--text-secondary);
    display: flex;
    font-size: 1rem;
    font-weight: 600;
    gap: 14px;
    justify-content: center;
    padding: 48px 24px;
}

/* --- Метрики раздела --- */
.categories-metrics[b-55ql5kr14u] {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    margin-bottom: 22px;
}

.categories-metric-card[b-55ql5kr14u] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 16px 18px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.categories-metric-card:hover[b-55ql5kr14u] {
    box-shadow: 0 8px 20px rgba(0,0,0,0.06);
    transform: translateY(-2px);
}

.categories-metric-card__label[b-55ql5kr14u] {
    color: var(--text-secondary);
    font-size: .76rem;
    font-weight: 750;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.categories-metric-card__value[b-55ql5kr14u] {
    color: var(--text-color);
    font-size: 1.85rem;
    font-weight: 850;
    line-height: 1.15;
}

.categories-metric-card__value--highlight[b-55ql5kr14u] {
    font-size: 1.35rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.categories-metric-card__hint[b-55ql5kr14u] {
    color: var(--text-secondary);
    font-size: .78rem;
}

/* --- Форма добавления / редактирования --- */
.categories-form-card[b-55ql5kr14u] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent);
    border-radius: 18px;
    box-shadow: var(--shadow-sm);
    margin-bottom: 22px;
    padding: 20px 24px;
    transition: all 0.2s ease;
}

.categories-form-card.is-editing[b-55ql5kr14u] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 16%, transparent), var(--shadow-sm);
}

.categories-form-card__header[b-55ql5kr14u] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
}

.categories-form-card__title-group[b-55ql5kr14u] {
    align-items: center;
    display: flex;
    gap: 12px;
}

.categories-form-card__icon[b-55ql5kr14u] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    display: inline-flex;
    font-size: 1.1rem;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.categories-form-card__title[b-55ql5kr14u] {
    font-size: 1.1rem;
    font-weight: 800;
    margin: 0;
}

.categories-form-card__hint[b-55ql5kr14u] {
    color: var(--text-secondary);
    font-size: .84rem;
    margin: 3px 0 0;
}

.categories-cancel-button[b-55ql5kr14u] {
    align-items: center;
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 10px;
    color: var(--text-secondary);
    cursor: pointer;
    display: inline-flex;
    font-size: .84rem;
    font-weight: 700;
    gap: 6px;
    padding: 6px 12px;
    transition: all 0.15s ease;
}

.categories-cancel-button:hover[b-55ql5kr14u] {
    background: color-mix(in srgb, var(--text-secondary) 10%, transparent);
    color: var(--text-color);
}

.categories-form[b-55ql5kr14u] {
    align-items: stretch;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.categories-form__input-wrapper[b-55ql5kr14u] {
    align-items: center;
    display: flex;
    flex: 1 1 280px;
    position: relative;
}

.categories-form__input-icon[b-55ql5kr14u] {
    color: var(--text-secondary);
    left: 14px;
    pointer-events: none;
    position: absolute;
}

.categories-form__input[b-55ql5kr14u] {
    background: color-mix(in srgb, var(--card-bg) 96%, var(--text-color));
    border: 1.5px solid color-mix(in srgb, var(--text-secondary) 22%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    font: inherit;
    font-size: 0.95rem;
    min-height: 46px;
    outline: none;
    padding: 0 40px 0 42px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    width: 100%;
}

.categories-form__input:focus[b-55ql5kr14u] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 14%, transparent);
}

.categories-form__clear-btn[b-55ql5kr14u] {
    align-items: center;
    background: none;
    border: none;
    color: var(--text-secondary);
    cursor: pointer;
    display: flex;
    height: 100%;
    justify-content: center;
    padding: 0 14px;
    position: absolute;
    right: 0;
    top: 0;
}

.categories-form__clear-btn:hover[b-55ql5kr14u] {
    color: var(--text-color);
}

.categories-form__submit-btn[b-55ql5kr14u] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: none;
    border-radius: 12px;
    box-shadow: 0 8px 18px color-mix(in srgb, var(--primary-color) 25%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: 0.92rem;
    font-weight: 750;
    gap: 8px;
    justify-content: center;
    min-height: 46px;
    padding: 0 24px;
    transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

.categories-form__submit-btn:hover:not(:disabled)[b-55ql5kr14u] {
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 35%, transparent);
    transform: translateY(-1px);
}

.categories-form__submit-btn:disabled[b-55ql5kr14u] {
    cursor: not-allowed;
    opacity: 0.6;
}

.categories-form__error[b-55ql5kr14u] {
    align-items: center;
    background: color-mix(in srgb, var(--rz-danger) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--rz-danger) 28%, transparent);
    border-radius: 10px;
    color: var(--rz-danger);
    display: flex;
    font-size: 0.88rem;
    font-weight: 600;
    gap: 8px;
    margin-top: 12px;
    padding: 10px 14px;
}

/* --- Панель поиска и сортировки --- */
.categories-toolbar[b-55ql5kr14u] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: space-between;
    margin-bottom: 20px;
    padding: 14px 18px;
}

.categories-search[b-55ql5kr14u] {
    align-items: center;
    display: flex;
    flex: 1 1 280px;
    position: relative;
}

.categories-search i[b-55ql5kr14u] {
    color: var(--text-secondary);
    left: 14px;
    pointer-events: none;
    position: absolute;
}

.categories-search input[b-55ql5kr14u] {
    background: color-mix(in srgb, var(--card-bg) 96%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    font: inherit;
    font-size: .92rem;
    min-height: 42px;
    outline: none;
    padding: 0 38px 0 38px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    width: 100%;
}

.categories-search input:focus[b-55ql5kr14u] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 14%, transparent);
}

.categories-search__clear[b-55ql5kr14u] {
    align-items: center;
    background: none;
    border: none;
    color: var(--text-secondary);
    cursor: pointer;
    display: flex;
    height: 100%;
    justify-content: center;
    padding: 0 12px;
    position: absolute;
    right: 0;
    top: 0;
}

.categories-search__clear:hover[b-55ql5kr14u] {
    color: var(--text-color);
}

.categories-sort[b-55ql5kr14u] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.categories-sort label[b-55ql5kr14u] {
    color: var(--text-secondary);
    font-size: 0.85rem;
    font-weight: 700;
    white-space: nowrap;
}

.categories-sort__select-wrapper[b-55ql5kr14u] {
    align-items: center;
    display: flex;
    position: relative;
}

.categories-sort select[b-55ql5kr14u] {
    appearance: none;
    background: color-mix(in srgb, var(--card-bg) 96%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    cursor: pointer;
    font: inherit;
    font-size: .88rem;
    min-height: 42px;
    outline: none;
    padding: 0 34px 0 14px;
    transition: border-color 0.15s ease;
}

.categories-sort select:focus[b-55ql5kr14u] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 14%, transparent);
}

.categories-sort__select-wrapper i[b-55ql5kr14u] {
    color: var(--text-secondary);
    font-size: .75rem;
    pointer-events: none;
    position: absolute;
    right: 12px;
}

/* --- Сетка категорий --- */
.categories-grid[b-55ql5kr14u] {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}

.category-card[b-55ql5kr14u] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 16px;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.category-card:hover[b-55ql5kr14u] {
    border-color: color-mix(in srgb, var(--primary-color) 35%, transparent);
    box-shadow: 0 8px 22px rgba(0,0,0,0.06);
    transform: translateY(-2px);
}

.category-card.is-current-edit[b-55ql5kr14u] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary-color) 20%, transparent);
}

.category-card__header[b-55ql5kr14u] {
    align-items: flex-start;
    display: flex;
    gap: 12px;
    margin-bottom: 14px;
}

.category-card__icon[b-55ql5kr14u] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    flex-shrink: 0;
    font-size: 1.1rem;
    height: 40px;
    justify-content: center;
    width: 40px;
}

.category-card__info[b-55ql5kr14u] {
    flex: 1;
    min-width: 0;
}

.category-card__name[b-55ql5kr14u] {
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.3;
    margin: 0 0 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.category-card__meta[b-55ql5kr14u] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.category-card__badge[b-55ql5kr14u] {
    align-items: center;
    border-radius: 20px;
    display: inline-flex;
    font-size: .78rem;
    font-weight: 700;
    gap: 5px;
    padding: 3px 9px;
}

.category-card__badge.has-articles[b-55ql5kr14u] {
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    color: var(--primary-color);
}

.category-card__badge.empty-articles[b-55ql5kr14u] {
    background: color-mix(in srgb, var(--text-secondary) 12%, transparent);
    color: var(--text-secondary);
}

.category-card__actions[b-55ql5kr14u] {
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 10%, transparent);
    display: flex;
    gap: 8px;
    padding-top: 12px;
}

.category-card__action-btn[b-55ql5kr14u] {
    align-items: center;
    background: color-mix(in srgb, var(--card-bg) 96%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 8px;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: .82rem;
    font-weight: 700;
    gap: 6px;
    justify-content: center;
    min-height: 34px;
    padding: 0 10px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.category-card__action-btn--view[b-55ql5kr14u] {
    color: var(--text-secondary);
}

.category-card__action-btn--view:hover[b-55ql5kr14u] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.category-card__action-btn--edit[b-55ql5kr14u] {
    color: var(--primary-color);
    flex: 1;
}

.category-card__action-btn--edit:hover[b-55ql5kr14u] {
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    border-color: var(--primary-color);
}

.category-card__action-btn--delete[b-55ql5kr14u] {
    color: var(--rz-danger);
}

.category-card__action-btn--delete:hover[b-55ql5kr14u] {
    background: color-mix(in srgb, var(--rz-danger) 10%, transparent);
    border-color: var(--rz-danger);
}

/* --- Пустое состояние --- */
.categories-empty[b-55ql5kr14u] {
    align-items: center;
    background: var(--card-bg);
    border: 2px dashed color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 48px 24px;
    text-align: center;
}

.categories-empty__icon[b-55ql5kr14u] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    border-radius: 50%;
    color: var(--primary-color);
    display: flex;
    font-size: 2rem;
    height: 64px;
    justify-content: center;
    margin-bottom: 16px;
    width: 64px;
}

.categories-empty h3[b-55ql5kr14u] {
    font-size: 1.25rem;
    font-weight: 800;
    margin: 0 0 8px;
}

.categories-empty p[b-55ql5kr14u] {
    color: var(--text-secondary);
    font-size: .95rem;
    margin: 0 0 18px;
    max-width: 440px;
}

.categories-empty__reset-btn[b-55ql5kr14u] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 24%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: .88rem;
    font-weight: 750;
    gap: 8px;
    min-height: 38px;
    padding: 0 16px;
    transition: all 0.15s ease;
}

.categories-empty__reset-btn:hover[b-55ql5kr14u] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

/* --- Адаптивность для планшетов и мобильных устройств --- */
@media (max-width: 900px) {
    .categories-header[b-55ql5kr14u] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .categories-header__actions[b-55ql5kr14u] {
        width: 100%;
    }

    .categories-secondary-action[b-55ql5kr14u] {
        flex: 1 1 auto;
        justify-content: center;
    }

    .categories-metrics[b-55ql5kr14u] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .categories-metrics[b-55ql5kr14u] {
        grid-template-columns: 1fr;
    }

    .categories-toolbar[b-55ql5kr14u] {
        flex-direction: column;
        align-items: stretch;
    }

    .categories-sort[b-55ql5kr14u] {
        justify-content: space-between;
    }

    .categories-sort__select-wrapper[b-55ql5kr14u] {
        flex: 1;
    }

    .categories-sort select[b-55ql5kr14u] {
        width: 100%;
    }

    .categories-grid[b-55ql5kr14u] {
        grid-template-columns: 1fr;
    }

    .categories-form[b-55ql5kr14u] {
        flex-direction: column;
    }

    .categories-form__submit-btn[b-55ql5kr14u] {
        width: 100%;
    }
}
/* /Components/Pages/Admin/ContactSettings.razor.rz.scp.css */
.contacts-admin-page[b-q2l4gl66x9] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
    padding-bottom: 60px;
}

/* --- Хедер раздела --- */
.contacts-header[b-q2l4gl66x9] {
    align-items: flex-end;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.contacts-eyebrow[b-q2l4gl66x9] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.contacts-header h1[b-q2l4gl66x9] {
    font-size: clamp(1.8rem, 3vw, 2.45rem);
    font-weight: 800;
    margin: 0 0 6px;
}

.contacts-header p[b-q2l4gl66x9] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    margin: 0;
    max-width: 680px;
}

.contacts-header-actions[b-q2l4gl66x9] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.contacts-save-btn[b-q2l4gl66x9] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.95rem;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 20px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.contacts-save-btn:hover:not(:disabled)[b-q2l4gl66x9] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    transform: translateY(-1px);
}

.contacts-save-btn:disabled[b-q2l4gl66x9] {
    cursor: not-allowed;
    opacity: 0.6;
}

.contacts-save-btn--large[b-q2l4gl66x9] {
    font-size: 1.05rem;
    min-height: 48px;
    min-width: 280px;
    padding: 0 32px;
}

/* --- Сетка карточек --- */
.contacts-grid[b-q2l4gl66x9] {
    display: grid;
    gap: 24px;
    grid-template-columns: 1fr 1fr;
}

.contacts-card--full[b-q2l4gl66x9] {
    grid-column: 1 / -1;
}

/* --- Карточки --- */
.contacts-card[b-q2l4gl66x9] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    padding: 22px;
    transition: border-color 0.15s ease;
}

.contacts-card:hover[b-q2l4gl66x9] {
    border-color: color-mix(in srgb, var(--primary-color) 25%, transparent);
}

.contacts-card__header[b-q2l4gl66x9] {
    align-items: flex-start;
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 14px;
}

.contacts-card__header--between[b-q2l4gl66x9] {
    align-items: center;
    justify-content: space-between;
}

.contacts-card__header-left[b-q2l4gl66x9] {
    align-items: center;
    display: flex;
    gap: 12px;
}

.contacts-card__header i[b-q2l4gl66x9] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 36px;
    font-size: 1.1rem;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.contacts-card__header h2[b-q2l4gl66x9] {
    font-size: 1.15rem;
    font-weight: 750;
    margin: 0 0 3px;
}

.contacts-card__header p[b-q2l4gl66x9] {
    color: var(--text-secondary);
    font-size: 0.83rem;
    margin: 0;
}

.contacts-card__body[b-q2l4gl66x9] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 16px;
}

.contacts-field[b-q2l4gl66x9] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.contacts-field label[b-q2l4gl66x9] {
    color: var(--text-color);
    font-size: 0.88rem;
    font-weight: 650;
}

/* --- Кнопка добавления --- */
.contacts-btn-add[b-q2l4gl66x9] {
    align-items: center;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--primary-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.84rem;
    font-weight: 700;
    gap: 6px;
    min-height: 32px;
    padding: 4px 10px;
    transition: all 0.15s ease;
}

.contacts-btn-add:hover[b-q2l4gl66x9] {
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    color: var(--primary-color);
}

.contacts-btn-add--social[b-q2l4gl66x9] {
    color: var(--primary-color);
}

.contacts-btn-add--social:hover[b-q2l4gl66x9] {
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    color: var(--primary-color);
}

/* --- Пустые подсказки --- */
.contacts-empty-hint[b-q2l4gl66x9] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px dashed color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 12px;
    color: var(--text-secondary);
    display: flex;
    font-size: 0.88rem;
    gap: 10px;
    justify-content: center;
    padding: 24px 16px;
    text-align: center;
}

.contacts-empty-hint i[b-q2l4gl66x9] {
    font-size: 1.2rem;
    opacity: 0.6;
}

/* --- Список телефонов --- */
.phone-items-list[b-q2l4gl66x9] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.phone-row[b-q2l4gl66x9] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 12px;
    display: flex;
    gap: 10px;
    padding: 8px 12px;
    transition: border-color 0.15s ease;
}

.phone-row:focus-within[b-q2l4gl66x9] {
    border-color: var(--primary-color);
}

.phone-row__icon[b-q2l4gl66x9] {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    flex: 0 0 24px;
    font-size: 1rem;
    justify-content: center;
}

.phone-row__input[b-q2l4gl66x9] {
    background: transparent;
    border: 0;
    box-shadow: none;
    flex: 1 1 auto;
}

/* --- Список соцсетей --- */
.social-items-list[b-q2l4gl66x9] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.social-row[b-q2l4gl66x9] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 12px;
    display: flex;
    gap: 14px;
    padding: 12px 14px;
    transition: border-color 0.15s ease;
}

.social-row:focus-within[b-q2l4gl66x9] {
    border-color: var(--primary-color);
}

.social-row__network[b-q2l4gl66x9] {
    flex: 0 0 220px;
}

.social-row__url[b-q2l4gl66x9] {
    flex: 1 1 auto;
}

.network-option-item[b-q2l4gl66x9] {
    align-items: center;
    display: flex;
    gap: 8px;
}

.network-icon[b-q2l4gl66x9] {
    font-size: 1.1rem;
    text-align: center;
    width: 20px;
}

.network-icon-img[b-q2l4gl66x9] {
    height: 20px;
    object-fit: contain;
    width: 20px;
}

/* Кнопка удаления */
.contacts-row-delete[b-q2l4gl66x9] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 8px;
    color: var(--text-secondary);
    cursor: pointer;
    display: flex;
    flex: 0 0 36px;
    font-size: 0.95rem;
    height: 36px;
    justify-content: center;
    transition: all 0.15s ease;
    width: 36px;
}

.contacts-row-delete:hover[b-q2l4gl66x9] {
    background: color-mix(in srgb, #ef4444 12%, transparent);
    color: #ef4444;
}



/* --- Загрузка --- */
.contacts-loading[b-q2l4gl66x9] {
    align-items: center;
    background: var(--card-bg);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    padding: 60px 20px;
}

/* --- Адаптивность --- */
@media (max-width: 900px) {
    .contacts-grid[b-q2l4gl66x9] {
        grid-template-columns: 1fr;
    }

    .contacts-header[b-q2l4gl66x9] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .contacts-header-actions[b-q2l4gl66x9] {
        width: 100%;
    }

    .contacts-save-btn[b-q2l4gl66x9] {
        justify-content: center;
        width: 100%;
    }

    .social-row[b-q2l4gl66x9] {
        align-items: stretch;
        flex-direction: column;
        position: relative;
    }

    .social-row__network[b-q2l4gl66x9] {
        flex: 1 1 auto;
        padding-right: 40px;
    }

    .contacts-row-delete[b-q2l4gl66x9] {
        position: absolute;
        right: 10px;
        top: 10px;
    }
}
/* /Components/Pages/Admin/CreateArticle.razor.rz.scp.css */
.article-editor-page[b-lffk68z90k] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
    padding-bottom: 60px;
}

/* --- Хедер редактора --- */
.article-editor-header[b-lffk68z90k] {
    align-items: flex-start;
    display: flex;
    gap: 16px;
    height: auto;
    inset: auto;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.article-editor-back[b-lffk68z90k] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    display: inline-flex;
    flex: 0 0 44px;
    height: 44px;
    justify-content: center;
    text-decoration: none;
    transition: all 0.15s ease;
}

.article-editor-back:hover[b-lffk68z90k] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.article-editor-eyebrow[b-lffk68z90k] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.article-editor-header h1[b-lffk68z90k] {
    font-size: clamp(1.65rem, 3vw, 2.3rem);
    font-weight: 800;
    margin: 0 0 5px;
}

.article-editor-header p[b-lffk68z90k] {
    color: var(--text-secondary);
    font-size: .95rem;
    margin: 0;
}

/* --- Сетка формы --- */
.article-editor-layout[b-lffk68z90k] {
    align-items: start;
    display: grid;
    gap: 20px;
    grid-template-columns: minmax(0, 1.7fr) minmax(320px, 1fr);
}

.article-editor-main[b-lffk68z90k],
.article-editor-side[b-lffk68z90k] {
    display: grid;
    gap: 20px;
}

/* --- Карточки секций --- */
.article-section-card[b-lffk68z90k] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 18px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 22px;
    position: relative;
}

.article-section-card > header[b-lffk68z90k],
.article-section-header[b-lffk68z90k] {
    align-items: flex-start;
    display: flex;
    gap: 14px;
    height: auto;
    inset: auto;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.article-section-icon[b-lffk68z90k] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg));
    border-radius: 12px;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 40px;
    height: 40px;
    justify-content: center;
    font-size: 1.05rem;
}

.article-section-card h2[b-lffk68z90k] {
    color: var(--text-color);
    font-size: 1.05rem;
    font-weight: 800;
    margin: 0 0 3px;
}

.article-section-card header p[b-lffk68z90k],
.article-section-card > p[b-lffk68z90k] {
    color: var(--text-secondary);
    font-size: .8rem;
    margin: 0;
}

/* Аккордеон переключатель для шапки */
.article-accordion-toggle[b-lffk68z90k] {
    align-items: center;
    background: none;
    border: none;
    color: var(--text-color);
    cursor: pointer;
    display: flex;
    font: inherit;
    justify-content: space-between;
    padding: 0;
    text-align: left;
    width: 100%;
}

.article-accordion-toggle h2[b-lffk68z90k] {
    align-items: center;
    color: var(--text-color);
    display: flex;
    flex-wrap: wrap;
    font-size: 1.05rem;
    font-weight: 800;
    gap: 6px;
    margin: 0 0 3px;
}

.article-accordion-toggle p[b-lffk68z90k] {
    color: var(--text-secondary);
    font-size: .82rem;
    margin: 0;
}

.article-accordion-toggle > div[b-lffk68z90k] {
    align-items: flex-start;
    display: flex;
    gap: 14px;
}

.article-chevron[b-lffk68z90k] {
    color: var(--text-secondary);
    font-size: 1rem;
    transition: transform 0.25s ease;
}

.article-chevron.is-expanded[b-lffk68z90k] {
    transform: rotate(180deg);
}

/* Поля ввода формы */
.article-field[b-lffk68z90k] {
    display: grid;
    gap: 6px;
}

.article-field > label[b-lffk68z90k],
.article-field > span[b-lffk68z90k] {
    font-size: .8rem;
    font-weight: 750;
    color: var(--text-color);
}

.article-field > label b[b-lffk68z90k] {
    color: #d44545;
}

.article-field-hint[b-lffk68z90k] {
    color: var(--text-secondary);
    font-size: .74rem;
    margin-top: 2px;
}

.article-input-text[b-lffk68z90k],
.article-textarea[b-lffk68z90k] {
    background: color-mix(in srgb, var(--card-bg) 96%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 24%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    font: inherit;
    font-size: .95rem;
    outline: none;
    padding: 10px 14px;
    width: 100%;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.article-input-text[b-lffk68z90k] {
    min-height: 44px;
}

.article-textarea[b-lffk68z90k] {
    resize: vertical;
}

.article-input-text:focus[b-lffk68z90k],
.article-textarea:focus[b-lffk68z90k] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 14%, transparent);
}

/* --- Секция Публикации (Боковая колонка) --- */
.article-publish-box[b-lffk68z90k] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.article-status-switch[b-lffk68z90k] {
    align-items: center;
    background: color-mix(in srgb, var(--card-bg) 95%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 12px;
    display: flex;
    justify-content: space-between;
    padding: 12px 14px;
}

.article-status-switch-info[b-lffk68z90k] {
    display: grid;
    gap: 2px;
}

.article-status-switch-info strong[b-lffk68z90k] {
    font-size: .88rem;
}

.article-status-switch-info span[b-lffk68z90k] {
    color: var(--text-secondary);
    font-size: .75rem;
}

.article-social-sync[b-lffk68z90k] {
    background: color-mix(in srgb, var(--card-bg) 95%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
}

.article-social-sync-item[b-lffk68z90k] {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.article-social-sync-label[b-lffk68z90k] {
    align-items: center;
    display: inline-flex;
    font-size: .85rem;
    font-weight: 700;
    gap: 8px;
}

.article-social-sync-label--vk[b-lffk68z90k] {
    color: #0077ff;
}

.article-social-sync-label--tg[b-lffk68z90k] {
    color: #0088cc;
}

.article-autosave-status[b-lffk68z90k] {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    font-size: .78rem;
    font-weight: 600;
    gap: 7px;
}

.article-autosave-status i[b-lffk68z90k] {
    color: #20a85b;
}

.article-publish-actions[b-lffk68z90k] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 6px;
}

.article-save-btn[b-lffk68z90k] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-weight: 800;
    gap: 9px;
    justify-content: center;
    min-height: 48px;
    padding: 0 20px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
    width: 100%;
}

.article-save-btn:hover[b-lffk68z90k] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    transform: translateY(-1px);
}

.article-save-btn:disabled[b-lffk68z90k] {
    cursor: wait;
    opacity: 0.65;
}

.article-cancel-btn[b-lffk68z90k] {
    align-items: center;
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-secondary);
    display: inline-flex;
    font-weight: 750;
    justify-content: center;
    min-height: 44px;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 100%;
}

.article-cancel-btn:hover[b-lffk68z90k] {
    border-color: var(--text-color);
    color: var(--text-color);
}

/* --- Секция Медиа и файлы --- */
.article-media-group[b-lffk68z90k] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.article-media-item[b-lffk68z90k] {
    background: color-mix(in srgb, var(--card-bg) 96%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
}

.article-media-item-header[b-lffk68z90k] {
    align-items: center;
    display: flex;
    font-size: .84rem;
    font-weight: 750;
    gap: 7px;
}

.article-media-item-header i[b-lffk68z90k] {
    color: var(--primary-color);
}

.article-cover-preview-box[b-lffk68z90k] {
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    max-height: 200px;
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
}

.article-cover-preview-box img[b-lffk68z90k] {
    height: 100%;
    max-height: 200px;
    object-fit: cover;
    width: 100%;
    display: block;
}

.article-media-attached-row[b-lffk68z90k] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 8px;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    padding: 8px 12px;
}

.article-media-remove-btn[b-lffk68z90k] {
    align-items: center;
    background: transparent;
    border: none;
    color: #c93636;
    cursor: pointer;
    display: inline-flex;
    font-size: .95rem;
    padding: 4px;
    transition: color 0.15s ease;
}

.article-media-remove-btn:hover[b-lffk68z90k] {
    color: #a31818;
}

/* Мобильный плавающий бар сохранения */
.article-mobile-bar[b-lffk68z90k] {
    align-items: center;
    background: var(--card-bg);
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent);
    bottom: 0;
    box-shadow: 0 -4px 18px rgba(0, 0, 0, 0.08);
    display: none;
    gap: 12px;
    inset: auto 0 0 0;
    padding: 12px 16px;
    position: fixed;
    z-index: 100;
}

.article-mobile-bar button[b-lffk68z90k] {
    flex: 1;
}

/* --- Секция NVIDIA AI Ассистента --- */
.article-ai-card[b-lffk68z90k] {
    background: linear-gradient(180deg, color-mix(in srgb, var(--primary-color) 4%, var(--card-bg)), var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--primary-color) 25%, transparent);
    color: var(--text-color);
    position: relative;
}

.article-ai-card h2[b-lffk68z90k] {
    color: var(--text-color);
}

.article-ai-card p[b-lffk68z90k] {
    color: var(--text-secondary);
}

.article-ai-card .article-section-icon[b-lffk68z90k] {
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary-color) 12%, transparent), color-mix(in srgb, #7048e8 16%, transparent));
    color: var(--primary-color);
}

.nvidia-pill[b-lffk68z90k] {
    align-items: center;
    background: color-mix(in srgb, #76b900 15%, transparent);
    border: 1px solid color-mix(in srgb, #76b900 35%, transparent);
    border-radius: 6px;
    color: #4d7c00;
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    line-height: 1;
    margin-right: 6px;
    padding: 3px 7px;
    text-transform: uppercase;
    vertical-align: middle;
}

body.dark-theme .nvidia-pill[b-lffk68z90k] {
    background: color-mix(in srgb, #76b900 22%, transparent);
    color: #8be000;
}

.ai-presets-wrap[b-lffk68z90k] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.ai-preset-chip[b-lffk68z90k] {
    align-items: center;
    background: color-mix(in srgb, var(--bg-secondary) 80%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 9px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 650;
    gap: 7px;
    padding: 7px 12px;
    transition: all 0.15s ease;
}

.ai-preset-chip:hover[b-lffk68z90k] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
    transform: translateY(-1px);
}

.ai-preset-chip i[b-lffk68z90k] {
    color: var(--primary-color);
    font-size: 0.88rem;
}

.ai-prompt-area[b-lffk68z90k] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent);
    border-radius: 12px;
    box-shadow: 0 1px 3px color-mix(in srgb, #000 3%, transparent);
    color: var(--text-color);
    font-family: inherit;
    font-size: 0.92rem;
    line-height: 1.55;
    min-height: 84px;
    outline: none;
    padding: 12px 14px;
    resize: vertical;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    width: 100%;
}

.ai-prompt-area:focus[b-lffk68z90k] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 14%, transparent);
}

.ai-prompt-area[b-lffk68z90k]::placeholder {
    color: var(--text-secondary);
    opacity: 0.65;
}

.ai-actions-bar[b-lffk68z90k] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}

.ai-generate-btn[b-lffk68z90k] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 10px;
    box-shadow: 0 6px 16px color-mix(in srgb, var(--primary-color) 25%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.88rem;
    font-weight: 750;
    gap: 8px;
    min-height: 40px;
    padding: 0 18px;
    transition: all 0.15s ease;
}

.ai-generate-btn:hover:not(:disabled)[b-lffk68z90k] {
    box-shadow: 0 8px 22px color-mix(in srgb, var(--primary-color) 35%, transparent);
    transform: translateY(-1px);
}

.ai-generate-btn:disabled[b-lffk68z90k] {
    cursor: not-allowed;
    opacity: 0.65;
}

.ai-clear-btn[b-lffk68z90k] {
    align-items: center;
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 10px;
    color: var(--text-secondary);
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.85rem;
    font-weight: 650;
    gap: 6px;
    min-height: 40px;
    padding: 0 14px;
    transition: all 0.15s ease;
}

.ai-clear-btn:hover[b-lffk68z90k] {
    background: color-mix(in srgb, var(--text-secondary) 10%, transparent);
    color: var(--text-color);
}

.ai-result-panel[b-lffk68z90k] {
    background: color-mix(in srgb, var(--bg-secondary) 75%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--primary-color) 22%, transparent);
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 14px;
    padding: 16px;
}

.ai-result-panel-header[b-lffk68z90k] {
    align-items: center;
    color: #059669;
    display: flex;
    font-size: 0.86rem;
    font-weight: 750;
    gap: 7px;
}

.ai-result-content[b-lffk68z90k] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    font-size: 0.92rem;
    line-height: 1.65;
    max-height: 320px;
    overflow-y: auto;
    padding: 14px 16px;
}

.ai-result-actions[b-lffk68z90k] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.ai-insert-btn[b-lffk68z90k] {
    align-items: center;
    background: var(--primary-color);
    border: 0;
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.84rem;
    font-weight: 700;
    gap: 6px;
    min-height: 36px;
    padding: 0 14px;
    transition: all 0.15s ease;
}

.ai-insert-btn:hover[b-lffk68z90k] {
    background: var(--primary-hover);
    transform: translateY(-1px);
}

.ai-insert-desc-btn[b-lffk68z90k] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--primary-color) 35%, transparent);
    border-radius: 8px;
    color: var(--primary-color);
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.84rem;
    font-weight: 700;
    gap: 6px;
    min-height: 36px;
    padding: 0 14px;
    transition: all 0.15s ease;
}

.ai-insert-desc-btn:hover[b-lffk68z90k] {
    background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg));
}

/* --- Адаптивность --- */
@media (max-width: 980px) {
    .article-editor-layout[b-lffk68z90k] {
        grid-template-columns: 1fr;
    }

    .article-mobile-bar[b-lffk68z90k] {
        display: flex;
    }
}

@media (max-width: 680px) {
    .article-editor-header[b-lffk68z90k] {
        align-items: stretch;
        flex-direction: column;
    }

    .article-editor-back[b-lffk68z90k] {
        align-self: flex-start;
    }

    .article-section-card[b-lffk68z90k] {
        padding: 16px;
    }
}
/* /Components/Pages/Admin/CreateReview.razor.rz.scp.css */
.review-edit-page[b-mtt15ofw6y] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1200px;
    padding-bottom: 60px;
}

/* --- Хедер страницы --- */
.review-edit-header[b-mtt15ofw6y] {
    align-items: center;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.review-edit-header__left[b-mtt15ofw6y] {
    align-items: center;
    display: flex;
    gap: 16px;
}

.review-back-link[b-mtt15ofw6y] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    display: inline-flex;
    flex: 0 0 42px;
    font-size: 1rem;
    height: 42px;
    justify-content: center;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 42px;
}

.review-back-link:hover[b-mtt15ofw6y] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.review-eyebrow[b-mtt15ofw6y] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.review-edit-header h1[b-mtt15ofw6y] {
    font-size: clamp(1.6rem, 2.5vw, 2.1rem);
    font-weight: 800;
    margin: 0 0 4px;
}

.review-edit-header p[b-mtt15ofw6y] {
    color: var(--text-secondary);
    font-size: 0.92rem;
    margin: 0;
}

.review-edit-header__actions[b-mtt15ofw6y] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.review-primary-btn[b-mtt15ofw6y] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.95rem;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 20px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.review-primary-btn:hover[b-mtt15ofw6y] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    transform: translateY(-1px);
}

.review-secondary-btn[b-mtt15ofw6y] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 700;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.review-secondary-btn:hover[b-mtt15ofw6y] {
    background: color-mix(in srgb, var(--text-secondary) 8%, var(--card-bg));
}

/* --- Сетка формы --- */
.review-layout[b-mtt15ofw6y] {
    display: grid;
    gap: 24px;
    grid-template-columns: 1fr 340px;
}

.review-main-col[b-mtt15ofw6y],
.review-sidebar-col[b-mtt15ofw6y] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* --- Карточки --- */
.review-card[b-mtt15ofw6y] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    padding: 22px;
    transition: border-color 0.15s ease;
}

.review-card:hover[b-mtt15ofw6y] {
    border-color: color-mix(in srgb, var(--primary-color) 25%, transparent);
}

.review-card__header[b-mtt15ofw6y] {
    align-items: flex-start;
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 14px;
}

.review-card__header i[b-mtt15ofw6y] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 36px;
    font-size: 1.1rem;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.review-card__header h2[b-mtt15ofw6y] {
    font-size: 1.15rem;
    font-weight: 750;
    margin: 0 0 3px;
}

.review-card__header p[b-mtt15ofw6y] {
    color: var(--text-secondary);
    font-size: 0.83rem;
    margin: 0;
}

.review-card__body[b-mtt15ofw6y] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.review-fields-row[b-mtt15ofw6y] {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.review-field[b-mtt15ofw6y] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.review-field label[b-mtt15ofw6y] {
    align-items: center;
    display: flex;
    font-size: 0.88rem;
    font-weight: 650;
    gap: 6px;
}

.required-star[b-mtt15ofw6y] {
    color: #ef4444;
    font-weight: 700;
}

.field-hint[b-mtt15ofw6y] {
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 400;
}

/* --- Блок тумблера публикации --- */
.publish-toggle-box[b-mtt15ofw6y] {
    align-items: center;
    border-radius: 12px;
    display: flex;
    gap: 14px;
    justify-content: space-between;
    padding: 16px;
    transition: all 0.2s ease;
}

.publish-toggle-box.is-published[b-mtt15ofw6y] {
    background: color-mix(in srgb, #10b981 10%, transparent);
    border: 1px solid color-mix(in srgb, #10b981 25%, transparent);
}

.publish-toggle-box.is-draft[b-mtt15ofw6y] {
    background: color-mix(in srgb, #f59e0b 10%, transparent);
    border: 1px solid color-mix(in srgb, #f59e0b 25%, transparent);
}

.publish-toggle-info[b-mtt15ofw6y] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.publish-status-title[b-mtt15ofw6y] {
    font-size: 0.95rem;
    font-weight: 750;
}

.is-published .publish-status-title[b-mtt15ofw6y] {
    color: #059669;
}

.is-draft .publish-status-title[b-mtt15ofw6y] {
    color: #d97706;
}

.publish-status-desc[b-mtt15ofw6y] {
    color: var(--text-secondary);
    font-size: 0.8rem;
}

/* --- Превью скриншота и загрузка --- */
.screenshot-preview[b-mtt15ofw6y] {
    border-radius: 12px;
    box-shadow: var(--shadow-sm);
    margin-bottom: 12px;
    overflow: hidden;
    position: relative;
}

.screenshot-preview img[b-mtt15ofw6y] {
    display: block;
    max-height: 280px;
    object-fit: cover;
    width: 100%;
}

.screenshot-remove-btn[b-mtt15ofw6y] {
    align-items: center;
    background: rgba(239, 68, 68, 0.9);
    border: 0;
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.8rem;
    font-weight: 650;
    gap: 6px;
    padding: 6px 12px;
    position: absolute;
    right: 10px;
    top: 10px;
    transition: background 0.15s ease;
}

.screenshot-remove-btn:hover[b-mtt15ofw6y] {
    background: #dc2626;
}

.upload-tip[b-mtt15ofw6y] {
    color: var(--text-secondary);
    display: block;
    font-size: 0.78rem;
    margin-top: 8px;
    text-align: center;
}

/* --- Нижняя мобильная панель --- */
.review-mobile-actions[b-mtt15ofw6y] {
    background: var(--card-bg);
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    bottom: 0;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
    display: none;
    gap: 12px;
    left: 0;
    padding: 12px 16px;
    position: fixed;
    right: 0;
    z-index: 100;
}

.review-mobile-actions .review-primary-btn[b-mtt15ofw6y],
.review-mobile-actions .review-secondary-btn[b-mtt15ofw6y] {
    flex: 1;
    justify-content: center;
}

/* --- Адаптивность --- */
@media (max-width: 992px) {
    .review-layout[b-mtt15ofw6y] {
        grid-template-columns: 1fr;
    }

    .review-edit-header[b-mtt15ofw6y] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .review-edit-header__actions[b-mtt15ofw6y] {
        display: none;
    }

    .review-mobile-actions[b-mtt15ofw6y] {
        display: flex;
    }
}
/* /Components/Pages/Admin/EditArticle.razor.rz.scp.css */
.article-editor-page[b-jw3w7y0q08] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
    padding-bottom: 60px;
}

/* --- Хедер редактора --- */
.article-editor-header[b-jw3w7y0q08] {
    align-items: flex-start;
    display: flex;
    gap: 16px;
    height: auto;
    inset: auto;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.article-editor-back[b-jw3w7y0q08] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    display: inline-flex;
    flex: 0 0 44px;
    height: 44px;
    justify-content: center;
    text-decoration: none;
    transition: all 0.15s ease;
}

.article-editor-back:hover[b-jw3w7y0q08] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.article-editor-eyebrow[b-jw3w7y0q08] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.article-editor-header h1[b-jw3w7y0q08] {
    font-size: clamp(1.65rem, 3vw, 2.3rem);
    font-weight: 800;
    margin: 0 0 5px;
}

.article-editor-header p[b-jw3w7y0q08] {
    color: var(--text-secondary);
    font-size: .95rem;
    margin: 0;
}

/* --- Сетка формы --- */
.article-editor-layout[b-jw3w7y0q08] {
    align-items: start;
    display: grid;
    gap: 20px;
    grid-template-columns: minmax(0, 1.7fr) minmax(320px, 1fr);
}

.article-editor-main[b-jw3w7y0q08],
.article-editor-side[b-jw3w7y0q08] {
    display: grid;
    gap: 20px;
}

/* --- Карточки секций --- */
.article-section-card[b-jw3w7y0q08] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 18px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 22px;
    position: relative;
}

.article-section-card > header[b-jw3w7y0q08],
.article-section-header[b-jw3w7y0q08] {
    align-items: flex-start;
    display: flex;
    gap: 14px;
    height: auto;
    inset: auto;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.article-section-icon[b-jw3w7y0q08] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg));
    border-radius: 12px;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 40px;
    height: 40px;
    justify-content: center;
    font-size: 1.05rem;
}

.article-section-card h2[b-jw3w7y0q08] {
    color: var(--text-color);
    font-size: 1.05rem;
    font-weight: 800;
    margin: 0 0 3px;
}

.article-section-card header p[b-jw3w7y0q08],
.article-section-card > p[b-jw3w7y0q08] {
    color: var(--text-secondary);
    font-size: .8rem;
    margin: 0;
}

/* Аккордеон переключатель для шапки */
.article-accordion-toggle[b-jw3w7y0q08] {
    align-items: center;
    background: none;
    border: none;
    color: var(--text-color);
    cursor: pointer;
    display: flex;
    font: inherit;
    justify-content: space-between;
    padding: 0;
    text-align: left;
    width: 100%;
}

.article-accordion-toggle h2[b-jw3w7y0q08] {
    align-items: center;
    color: var(--text-color);
    display: flex;
    flex-wrap: wrap;
    font-size: 1.05rem;
    font-weight: 800;
    gap: 6px;
    margin: 0 0 3px;
}

.article-accordion-toggle p[b-jw3w7y0q08] {
    color: var(--text-secondary);
    font-size: .82rem;
    margin: 0;
}

.article-accordion-toggle > div[b-jw3w7y0q08] {
    align-items: flex-start;
    display: flex;
    gap: 14px;
}

.article-chevron[b-jw3w7y0q08] {
    color: var(--text-secondary);
    font-size: 1rem;
    transition: transform 0.25s ease;
}

.article-chevron.is-expanded[b-jw3w7y0q08] {
    transform: rotate(180deg);
}

/* Поля ввода формы */
.article-field[b-jw3w7y0q08] {
    display: grid;
    gap: 6px;
}

.article-field > label[b-jw3w7y0q08],
.article-field > span[b-jw3w7y0q08] {
    font-size: .8rem;
    font-weight: 750;
    color: var(--text-color);
}

.article-field > label b[b-jw3w7y0q08] {
    color: #d44545;
}

.article-field-hint[b-jw3w7y0q08] {
    color: var(--text-secondary);
    font-size: .74rem;
    margin-top: 2px;
}

.article-input-text[b-jw3w7y0q08],
.article-textarea[b-jw3w7y0q08] {
    background: color-mix(in srgb, var(--card-bg) 96%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 24%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    font: inherit;
    font-size: .95rem;
    outline: none;
    padding: 10px 14px;
    width: 100%;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.article-input-text[b-jw3w7y0q08] {
    min-height: 44px;
}

.article-textarea[b-jw3w7y0q08] {
    resize: vertical;
}

.article-input-text:focus[b-jw3w7y0q08],
.article-textarea:focus[b-jw3w7y0q08] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 14%, transparent);
}

/* --- Секция Публикации (Боковая колонка) --- */
.article-publish-box[b-jw3w7y0q08] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.article-status-switch[b-jw3w7y0q08] {
    align-items: center;
    background: color-mix(in srgb, var(--card-bg) 95%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 12px;
    display: flex;
    justify-content: space-between;
    padding: 12px 14px;
}

.article-status-switch-info[b-jw3w7y0q08] {
    display: grid;
    gap: 2px;
}

.article-status-switch-info strong[b-jw3w7y0q08] {
    font-size: .88rem;
}

.article-status-switch-info span[b-jw3w7y0q08] {
    color: var(--text-secondary);
    font-size: .75rem;
}

.article-autosave-status[b-jw3w7y0q08] {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    font-size: .78rem;
    font-weight: 600;
    gap: 7px;
}

.article-autosave-status i[b-jw3w7y0q08] {
    color: #20a85b;
}

.article-publish-actions[b-jw3w7y0q08] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 6px;
}

.article-save-btn[b-jw3w7y0q08] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-weight: 800;
    gap: 9px;
    justify-content: center;
    min-height: 48px;
    padding: 0 20px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
    width: 100%;
}

.article-save-btn:hover[b-jw3w7y0q08] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    transform: translateY(-1px);
}

.article-save-btn:disabled[b-jw3w7y0q08] {
    cursor: wait;
    opacity: 0.65;
}

.article-view-online-btn[b-jw3w7y0q08] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--primary-color) 25%, transparent);
    border-radius: 12px;
    color: var(--primary-color) !important;
    display: inline-flex;
    font-weight: 750;
    gap: 7px;
    justify-content: center;
    min-height: 44px;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 100%;
}

.article-view-online-btn:hover[b-jw3w7y0q08] {
    background: color-mix(in srgb, var(--primary-color) 16%, var(--card-bg));
}

.article-cancel-btn[b-jw3w7y0q08] {
    align-items: center;
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-secondary);
    display: inline-flex;
    font-weight: 750;
    justify-content: center;
    min-height: 44px;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 100%;
}

.article-cancel-btn:hover[b-jw3w7y0q08] {
    border-color: var(--text-color);
    color: var(--text-color);
}

/* --- Секция Медиа и файлы --- */
.article-media-group[b-jw3w7y0q08] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.article-media-item[b-jw3w7y0q08] {
    background: color-mix(in srgb, var(--card-bg) 96%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px;
}

.article-media-item-header[b-jw3w7y0q08] {
    align-items: center;
    display: flex;
    font-size: .84rem;
    font-weight: 750;
    gap: 7px;
}

.article-media-item-header i[b-jw3w7y0q08] {
    color: var(--primary-color);
}

.article-cover-preview-box[b-jw3w7y0q08] {
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    max-height: 200px;
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
}

.article-cover-preview-box img[b-jw3w7y0q08] {
    height: 100%;
    max-height: 200px;
    object-fit: cover;
    width: 100%;
    display: block;
}

.article-media-attached-row[b-jw3w7y0q08] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 8px;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    padding: 8px 12px;
}

.article-media-remove-btn[b-jw3w7y0q08] {
    align-items: center;
    background: transparent;
    border: none;
    color: #c93636;
    cursor: pointer;
    display: inline-flex;
    font-size: .95rem;
    padding: 4px;
    transition: color 0.15s ease;
}

.article-media-remove-btn:hover[b-jw3w7y0q08] {
    color: #a31818;
}

/* Мобильный плавающий бар сохранения */
.article-mobile-bar[b-jw3w7y0q08] {
    align-items: center;
    background: var(--card-bg);
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent);
    bottom: 0;
    box-shadow: 0 -4px 18px rgba(0, 0, 0, 0.08);
    display: none;
    gap: 12px;
    inset: auto 0 0 0;
    padding: 12px 16px;
    position: fixed;
    z-index: 100;
}

.article-mobile-bar button[b-jw3w7y0q08] {
    flex: 1;
}

/* Состояние загрузки */
.article-editor-loading[b-jw3w7y0q08] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 18px;
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    min-height: 260px;
    padding: 40px 20px;
    text-align: center;
}

/* --- Секция NVIDIA AI Ассистента --- */
.article-ai-card[b-jw3w7y0q08] {
    background: linear-gradient(180deg, color-mix(in srgb, var(--primary-color) 4%, var(--card-bg)), var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--primary-color) 25%, transparent);
    color: var(--text-color);
    position: relative;
}

.article-ai-card h2[b-jw3w7y0q08] {
    color: var(--text-color);
}

.article-ai-card p[b-jw3w7y0q08] {
    color: var(--text-secondary);
}

.article-ai-card .article-section-icon[b-jw3w7y0q08] {
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary-color) 12%, transparent), color-mix(in srgb, #7048e8 16%, transparent));
    color: var(--primary-color);
}

.nvidia-pill[b-jw3w7y0q08] {
    align-items: center;
    background: color-mix(in srgb, #76b900 15%, transparent);
    border: 1px solid color-mix(in srgb, #76b900 35%, transparent);
    border-radius: 6px;
    color: #4d7c00;
    display: inline-flex;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    line-height: 1;
    margin-right: 6px;
    padding: 3px 7px;
    text-transform: uppercase;
    vertical-align: middle;
}

body.dark-theme .nvidia-pill[b-jw3w7y0q08] {
    background: color-mix(in srgb, #76b900 22%, transparent);
    color: #8be000;
}

.ai-presets-wrap[b-jw3w7y0q08] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 14px;
}

.ai-preset-chip[b-jw3w7y0q08] {
    align-items: center;
    background: color-mix(in srgb, var(--bg-secondary) 80%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 9px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.82rem;
    font-weight: 650;
    gap: 7px;
    padding: 7px 12px;
    transition: all 0.15s ease;
}

.ai-preset-chip:hover[b-jw3w7y0q08] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
    transform: translateY(-1px);
}

.ai-preset-chip i[b-jw3w7y0q08] {
    color: var(--primary-color);
    font-size: 0.88rem;
}

.ai-prompt-area[b-jw3w7y0q08] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent);
    border-radius: 12px;
    box-shadow: 0 1px 3px color-mix(in srgb, #000 3%, transparent);
    color: var(--text-color);
    font-family: inherit;
    font-size: 0.92rem;
    line-height: 1.55;
    min-height: 84px;
    outline: none;
    padding: 12px 14px;
    resize: vertical;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    width: 100%;
}

.ai-prompt-area:focus[b-jw3w7y0q08] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 14%, transparent);
}

.ai-prompt-area[b-jw3w7y0q08]::placeholder {
    color: var(--text-secondary);
    opacity: 0.65;
}

.ai-actions-bar[b-jw3w7y0q08] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}

.ai-generate-btn[b-jw3w7y0q08] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 10px;
    box-shadow: 0 6px 16px color-mix(in srgb, var(--primary-color) 25%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.88rem;
    font-weight: 750;
    gap: 8px;
    min-height: 40px;
    padding: 0 18px;
    transition: all 0.15s ease;
}

.ai-generate-btn:hover:not(:disabled)[b-jw3w7y0q08] {
    box-shadow: 0 8px 22px color-mix(in srgb, var(--primary-color) 35%, transparent);
    transform: translateY(-1px);
}

.ai-generate-btn:disabled[b-jw3w7y0q08] {
    cursor: not-allowed;
    opacity: 0.65;
}

.ai-clear-btn[b-jw3w7y0q08] {
    align-items: center;
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 10px;
    color: var(--text-secondary);
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.85rem;
    font-weight: 650;
    gap: 6px;
    min-height: 40px;
    padding: 0 14px;
    transition: all 0.15s ease;
}

.ai-clear-btn:hover[b-jw3w7y0q08] {
    background: color-mix(in srgb, var(--text-secondary) 10%, transparent);
    color: var(--text-color);
}

.ai-result-panel[b-jw3w7y0q08] {
    background: color-mix(in srgb, var(--bg-secondary) 75%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--primary-color) 22%, transparent);
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 14px;
    padding: 16px;
}

.ai-result-panel-header[b-jw3w7y0q08] {
    align-items: center;
    color: #059669;
    display: flex;
    font-size: 0.86rem;
    font-weight: 750;
    gap: 7px;
}

.ai-result-content[b-jw3w7y0q08] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    font-size: 0.92rem;
    line-height: 1.65;
    max-height: 320px;
    overflow-y: auto;
    padding: 14px 16px;
}

.ai-result-actions[b-jw3w7y0q08] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.ai-insert-btn[b-jw3w7y0q08] {
    align-items: center;
    background: var(--primary-color);
    border: 0;
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.84rem;
    font-weight: 700;
    gap: 6px;
    min-height: 36px;
    padding: 0 14px;
    transition: all 0.15s ease;
}

.ai-insert-btn:hover[b-jw3w7y0q08] {
    background: var(--primary-hover);
    transform: translateY(-1px);
}

.ai-insert-desc-btn[b-jw3w7y0q08] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--primary-color) 35%, transparent);
    border-radius: 8px;
    color: var(--primary-color);
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 0.84rem;
    font-weight: 700;
    gap: 6px;
    min-height: 36px;
    padding: 0 14px;
    transition: all 0.15s ease;
}

.ai-insert-desc-btn:hover[b-jw3w7y0q08] {
    background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg));
}

/* --- Адаптивность --- */
@media (max-width: 980px) {
    .article-editor-layout[b-jw3w7y0q08] {
        grid-template-columns: 1fr;
    }

    .article-mobile-bar[b-jw3w7y0q08] {
        display: flex;
    }
}

@media (max-width: 680px) {
    .article-editor-header[b-jw3w7y0q08] {
        align-items: stretch;
        flex-direction: column;
    }

    .article-editor-back[b-jw3w7y0q08] {
        align-self: flex-start;
    }

    .article-section-card[b-jw3w7y0q08] {
        padding: 16px;
    }
}
/* /Components/Pages/Admin/EditReview.razor.rz.scp.css */
.review-edit-page[b-8d3vip5266] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1200px;
    padding-bottom: 60px;
}

/* --- Хедер страницы --- */
.review-edit-header[b-8d3vip5266] {
    align-items: center;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.review-edit-header__left[b-8d3vip5266] {
    align-items: center;
    display: flex;
    gap: 16px;
}

.review-back-link[b-8d3vip5266] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    display: inline-flex;
    flex: 0 0 42px;
    font-size: 1rem;
    height: 42px;
    justify-content: center;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 42px;
}

.review-back-link:hover[b-8d3vip5266] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.review-eyebrow[b-8d3vip5266] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.review-edit-header h1[b-8d3vip5266] {
    font-size: clamp(1.6rem, 2.5vw, 2.1rem);
    font-weight: 800;
    margin: 0 0 4px;
}

.review-edit-header p[b-8d3vip5266] {
    color: var(--text-secondary);
    font-size: 0.92rem;
    margin: 0;
}

.review-edit-header__actions[b-8d3vip5266] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.review-primary-btn[b-8d3vip5266] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.95rem;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 20px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.review-primary-btn:hover[b-8d3vip5266] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    transform: translateY(-1px);
}

.review-secondary-btn[b-8d3vip5266] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 700;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.review-secondary-btn:hover[b-8d3vip5266] {
    background: color-mix(in srgb, var(--text-secondary) 8%, var(--card-bg));
}

.review-danger-btn[b-8d3vip5266] {
    align-items: center;
    background: color-mix(in srgb, #ef4444 10%, transparent);
    border: 1px solid color-mix(in srgb, #ef4444 30%, transparent);
    border-radius: 12px;
    color: #ef4444;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 700;
    gap: 8px;
    min-height: 44px;
    padding: 0 16px;
    transition: all 0.15s ease;
}

.review-danger-btn:hover[b-8d3vip5266] {
    background: color-mix(in srgb, #ef4444 20%, transparent);
    border-color: #ef4444;
    color: #dc2626;
}

/* --- Сетка формы --- */
.review-layout[b-8d3vip5266] {
    display: grid;
    gap: 24px;
    grid-template-columns: 1fr 340px;
}

.review-main-col[b-8d3vip5266],
.review-sidebar-col[b-8d3vip5266] {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* --- Карточки --- */
.review-card[b-8d3vip5266] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    padding: 22px;
    transition: border-color 0.15s ease;
}

.review-card:hover[b-8d3vip5266] {
    border-color: color-mix(in srgb, var(--primary-color) 25%, transparent);
}

.review-card__header[b-8d3vip5266] {
    align-items: flex-start;
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 14px;
}

.review-card__header i[b-8d3vip5266] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 36px;
    font-size: 1.1rem;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.review-card__header h2[b-8d3vip5266] {
    font-size: 1.15rem;
    font-weight: 750;
    margin: 0 0 3px;
}

.review-card__header p[b-8d3vip5266] {
    color: var(--text-secondary);
    font-size: 0.83rem;
    margin: 0;
}

.review-card__body[b-8d3vip5266] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.review-fields-row[b-8d3vip5266] {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

.review-field[b-8d3vip5266] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.review-field label[b-8d3vip5266] {
    align-items: center;
    display: flex;
    font-size: 0.88rem;
    font-weight: 650;
    gap: 6px;
}

.required-star[b-8d3vip5266] {
    color: #ef4444;
    font-weight: 700;
}

.field-hint[b-8d3vip5266] {
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 400;
}

/* --- Блок тумблера публикации --- */
.publish-toggle-box[b-8d3vip5266] {
    align-items: center;
    border-radius: 12px;
    display: flex;
    gap: 14px;
    justify-content: space-between;
    padding: 16px;
    transition: all 0.2s ease;
}

.publish-toggle-box.is-published[b-8d3vip5266] {
    background: color-mix(in srgb, #10b981 10%, transparent);
    border: 1px solid color-mix(in srgb, #10b981 25%, transparent);
}

.publish-toggle-box.is-draft[b-8d3vip5266] {
    background: color-mix(in srgb, #f59e0b 10%, transparent);
    border: 1px solid color-mix(in srgb, #f59e0b 25%, transparent);
}

.publish-toggle-info[b-8d3vip5266] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.publish-status-title[b-8d3vip5266] {
    font-size: 0.95rem;
    font-weight: 750;
}

.is-published .publish-status-title[b-8d3vip5266] {
    color: #059669;
}

.is-draft .publish-status-title[b-8d3vip5266] {
    color: #d97706;
}

.publish-status-desc[b-8d3vip5266] {
    color: var(--text-secondary);
    font-size: 0.8rem;
}

/* --- Превью скриншота и загрузка --- */
.screenshot-preview[b-8d3vip5266] {
    border-radius: 12px;
    box-shadow: var(--shadow-sm);
    margin-bottom: 12px;
    overflow: hidden;
    position: relative;
}

.screenshot-preview img[b-8d3vip5266] {
    display: block;
    max-height: 280px;
    object-fit: cover;
    width: 100%;
}

.screenshot-remove-btn[b-8d3vip5266] {
    align-items: center;
    background: rgba(239, 68, 68, 0.9);
    border: 0;
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.8rem;
    font-weight: 650;
    gap: 6px;
    padding: 6px 12px;
    position: absolute;
    right: 10px;
    top: 10px;
    transition: background 0.15s ease;
}

.screenshot-remove-btn:hover[b-8d3vip5266] {
    background: #dc2626;
}

.upload-tip[b-8d3vip5266] {
    color: var(--text-secondary);
    display: block;
    font-size: 0.78rem;
    margin-top: 8px;
    text-align: center;
}

/* --- Загрузка --- */
.review-loading[b-8d3vip5266] {
    align-items: center;
    background: var(--card-bg);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    padding: 60px 20px;
}

/* --- Нижняя мобильная панель --- */
.review-mobile-actions[b-8d3vip5266] {
    background: var(--card-bg);
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    bottom: 0;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
    display: none;
    gap: 12px;
    left: 0;
    padding: 12px 16px;
    position: fixed;
    right: 0;
    z-index: 100;
}

.review-mobile-actions .review-primary-btn[b-8d3vip5266],
.review-mobile-actions .review-secondary-btn[b-8d3vip5266] {
    flex: 1;
    justify-content: center;
}

/* --- Адаптивность --- */
@media (max-width: 992px) {
    .review-layout[b-8d3vip5266] {
        grid-template-columns: 1fr;
    }

    .review-edit-header[b-8d3vip5266] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .review-edit-header__actions[b-8d3vip5266] {
        display: none;
    }

    .review-mobile-actions[b-8d3vip5266] {
        display: flex;
    }
}
/* /Components/Pages/Admin/Flashcards/CreateFlashcardSet.razor.rz.scp.css */
.flashcard-edit-page[b-zduzfnk7vw] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1100px;
    padding-bottom: 60px;
}

/* --- Хедер страницы --- */
.flashcard-edit-header[b-zduzfnk7vw] {
    align-items: center;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.flashcard-edit-header__left[b-zduzfnk7vw] {
    align-items: center;
    display: flex;
    gap: 16px;
}

.flashcard-back-link[b-zduzfnk7vw] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    display: inline-flex;
    flex: 0 0 42px;
    font-size: 1rem;
    height: 42px;
    justify-content: center;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 42px;
}

.flashcard-back-link:hover[b-zduzfnk7vw] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.flashcard-eyebrow[b-zduzfnk7vw] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.flashcard-edit-header h1[b-zduzfnk7vw] {
    font-size: clamp(1.6rem, 2.5vw, 2.1rem);
    font-weight: 800;
    margin: 0 0 4px;
}

.flashcard-edit-header p[b-zduzfnk7vw] {
    color: var(--text-secondary);
    font-size: 0.92rem;
    margin: 0;
}

.flashcard-edit-header__actions[b-zduzfnk7vw] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.flashcard-primary-btn[b-zduzfnk7vw] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.95rem;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 20px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.flashcard-primary-btn:hover[b-zduzfnk7vw] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    transform: translateY(-1px);
}

.flashcard-secondary-btn[b-zduzfnk7vw] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 700;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.flashcard-secondary-btn:hover[b-zduzfnk7vw] {
    background: color-mix(in srgb, var(--text-secondary) 8%, var(--card-bg));
}

/* --- Стек формы --- */
.flashcard-form-stack[b-zduzfnk7vw] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* --- Карточки --- */
.flashcard-card[b-zduzfnk7vw] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    padding: 22px;
    transition: border-color 0.15s ease;
}

.flashcard-card:hover[b-zduzfnk7vw] {
    border-color: color-mix(in srgb, var(--primary-color) 25%, transparent);
}

.flashcard-card__header[b-zduzfnk7vw] {
    align-items: flex-start;
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 14px;
}

.flashcard-card__header--between[b-zduzfnk7vw] {
    align-items: center;
    justify-content: space-between;
}

.flashcard-card__header-left[b-zduzfnk7vw] {
    align-items: center;
    display: flex;
    gap: 12px;
}

.flashcard-card__header i[b-zduzfnk7vw] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 36px;
    font-size: 1.1rem;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.flashcard-card__header h2[b-zduzfnk7vw] {
    font-size: 1.15rem;
    font-weight: 750;
    margin: 0 0 3px;
}

.flashcard-card__header p[b-zduzfnk7vw] {
    color: var(--text-secondary);
    font-size: 0.83rem;
    margin: 0;
}

.flashcard-card__body[b-zduzfnk7vw] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.flashcard-field[b-zduzfnk7vw] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.flashcard-field label[b-zduzfnk7vw] {
    align-items: center;
    display: flex;
    font-size: 0.88rem;
    font-weight: 650;
    gap: 6px;
}

.required-star[b-zduzfnk7vw] {
    color: #ef4444;
    font-weight: 700;
}

/* --- Кнопка добавления --- */
.flashcard-btn-add[b-zduzfnk7vw] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--primary-color) 30%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.84rem;
    font-weight: 700;
    gap: 6px;
    min-height: 36px;
    padding: 0 14px;
    transition: all 0.15s ease;
}

.flashcard-btn-add:hover[b-zduzfnk7vw] {
    background: color-mix(in srgb, var(--primary-color) 20%, transparent);
}

/* --- Пустое состояние --- */
.flashcard-empty-hint[b-zduzfnk7vw] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px dashed color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 12px;
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 32px 20px;
    text-align: center;
}

.flashcard-empty-hint i[b-zduzfnk7vw] {
    font-size: 2.2rem;
    opacity: 0.5;
}

.flashcard-empty-hint p[b-zduzfnk7vw] {
    font-size: 0.92rem;
    margin: 0;
}

/* --- Сетка карточек редактора --- */
.cards-editor-grid[b-zduzfnk7vw] {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}

.card-editor-item[b-zduzfnk7vw] {
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    padding: 16px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.card-editor-item:hover[b-zduzfnk7vw] {
    border-color: color-mix(in srgb, var(--primary-color) 35%, transparent);
    box-shadow: var(--shadow-sm);
}

.card-editor-item__header[b-zduzfnk7vw] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 14px;
}

.card-number-badge[b-zduzfnk7vw] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 8px;
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 750;
    padding: 4px 10px;
}

.card-icon-tag[b-zduzfnk7vw] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 50%;
    color: var(--primary-color);
    display: flex;
    font-size: 1.1rem;
    height: 34px;
    justify-content: center;
    width: 34px;
}

.card-delete-btn[b-zduzfnk7vw] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: #ef4444;
    cursor: pointer;
    display: flex;
    font-size: 0.9rem;
    height: 30px;
    justify-content: center;
    transition: background 0.15s ease;
    width: 30px;
}

.card-delete-btn:hover[b-zduzfnk7vw] {
    background: color-mix(in srgb, #ef4444 14%, transparent);
}

.card-editor-item__body[b-zduzfnk7vw] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.dropdown-icon-item[b-zduzfnk7vw] {
    align-items: center;
    display: flex;
    gap: 8px;
}

/* --- Мобильный фиксированный бар --- */
.flashcard-mobile-actions[b-zduzfnk7vw] {
    background: var(--card-bg);
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    bottom: 0;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
    display: none;
    gap: 12px;
    left: 0;
    padding: 12px 16px;
    position: fixed;
    right: 0;
    z-index: 100;
}

.flashcard-mobile-actions .flashcard-primary-btn[b-zduzfnk7vw],
.flashcard-mobile-actions .flashcard-secondary-btn[b-zduzfnk7vw] {
    flex: 1;
    justify-content: center;
}

/* --- Адаптивность --- */
@media (max-width: 900px) {
    .flashcard-edit-header[b-zduzfnk7vw] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .flashcard-edit-header__actions[b-zduzfnk7vw] {
        display: none;
    }

    .flashcard-mobile-actions[b-zduzfnk7vw] {
        display: flex;
    }

    .cards-editor-grid[b-zduzfnk7vw] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Admin/Flashcards/CreateQuiz.razor.rz.scp.css */
.quiz-edit-page[b-6f9jar9t62] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1100px;
    padding-bottom: 60px;
}

/* --- Хедер страницы --- */
.quiz-edit-header[b-6f9jar9t62] {
    align-items: center;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.quiz-edit-header__left[b-6f9jar9t62] {
    align-items: center;
    display: flex;
    gap: 16px;
}

.quiz-back-link[b-6f9jar9t62] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    display: inline-flex;
    flex: 0 0 42px;
    font-size: 1rem;
    height: 42px;
    justify-content: center;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 42px;
}

.quiz-back-link:hover[b-6f9jar9t62] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.quiz-eyebrow[b-6f9jar9t62] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.quiz-edit-header h1[b-6f9jar9t62] {
    font-size: clamp(1.6rem, 2.5vw, 2.1rem);
    font-weight: 800;
    margin: 0 0 4px;
}

.quiz-edit-header p[b-6f9jar9t62] {
    color: var(--text-secondary);
    font-size: 0.92rem;
    margin: 0;
}

.quiz-edit-header__actions[b-6f9jar9t62] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.quiz-primary-btn[b-6f9jar9t62] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.95rem;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 20px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.quiz-primary-btn:hover[b-6f9jar9t62] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    transform: translateY(-1px);
}

.quiz-secondary-btn[b-6f9jar9t62] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 700;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.quiz-secondary-btn:hover[b-6f9jar9t62] {
    background: color-mix(in srgb, var(--text-secondary) 8%, var(--card-bg));
}

/* --- Стек формы --- */
.quiz-form-stack[b-6f9jar9t62] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* --- Карточки --- */
.quiz-card[b-6f9jar9t62] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    padding: 22px;
    transition: border-color 0.15s ease;
}

.quiz-card:hover[b-6f9jar9t62] {
    border-color: color-mix(in srgb, var(--primary-color) 25%, transparent);
}

.quiz-card__header[b-6f9jar9t62] {
    align-items: flex-start;
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 14px;
}

.quiz-card__header--between[b-6f9jar9t62] {
    align-items: center;
    justify-content: space-between;
}

.quiz-card__header-left[b-6f9jar9t62] {
    align-items: center;
    display: flex;
    gap: 12px;
}

.quiz-card__header i[b-6f9jar9t62] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 36px;
    font-size: 1.1rem;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.quiz-card__header h2[b-6f9jar9t62] {
    font-size: 1.15rem;
    font-weight: 750;
    margin: 0 0 3px;
}

.quiz-card__header p[b-6f9jar9t62] {
    color: var(--text-secondary);
    font-size: 0.83rem;
    margin: 0;
}

.quiz-card__body[b-6f9jar9t62] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.quiz-field[b-6f9jar9t62] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.quiz-field label[b-6f9jar9t62] {
    align-items: center;
    display: flex;
    font-size: 0.88rem;
    font-weight: 650;
    gap: 6px;
}

.required-star[b-6f9jar9t62] {
    color: #ef4444;
    font-weight: 700;
}

.field-hint[b-6f9jar9t62] {
    color: var(--text-secondary);
    font-size: 0.8rem;
    font-weight: 400;
}

/* --- Кнопка добавления элемента --- */
.quiz-btn-add[b-6f9jar9t62] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--primary-color) 30%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.84rem;
    font-weight: 700;
    gap: 6px;
    min-height: 36px;
    padding: 0 14px;
    transition: all 0.15s ease;
}

.quiz-btn-add:hover[b-6f9jar9t62] {
    background: color-mix(in srgb, var(--primary-color) 20%, transparent);
}

.quiz-btn-add--warning[b-6f9jar9t62] {
    background: color-mix(in srgb, #f59e0b 12%, transparent);
    border-color: color-mix(in srgb, #f59e0b 30%, transparent);
    color: #d97706;
}

.quiz-btn-add--warning:hover[b-6f9jar9t62] {
    background: color-mix(in srgb, #f59e0b 20%, transparent);
}

/* --- Пустое состояние секции --- */
.quiz-empty-hint[b-6f9jar9t62] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px dashed color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 12px;
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 32px 20px;
    text-align: center;
}

.quiz-empty-hint i[b-6f9jar9t62] {
    font-size: 2rem;
    opacity: 0.5;
}

.quiz-empty-hint p[b-6f9jar9t62] {
    font-size: 0.92rem;
    margin: 0;
}

/* --- Элемент вопроса --- */
.questions-list[b-6f9jar9t62] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.question-item[b-6f9jar9t62] {
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 14px;
    padding: 18px;
    transition: border-color 0.15s ease;
}

.question-item:hover[b-6f9jar9t62] {
    border-color: color-mix(in srgb, var(--primary-color) 30%, transparent);
}

.question-item__header[b-6f9jar9t62] {
    align-items: center;
    display: flex;
    gap: 12px;
    margin-bottom: 14px;
}

.question-number-badge[b-6f9jar9t62] {
    align-items: center;
    background: var(--primary-color);
    border-radius: 8px;
    color: #fff;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 0.8rem;
    font-weight: 750;
    padding: 6px 12px;
    white-space: nowrap;
}

.question-item__title-input[b-6f9jar9t62] {
    flex: 1 1 auto;
}

.question-delete-btn[b-6f9jar9t62] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 8px;
    color: #ef4444;
    cursor: pointer;
    display: flex;
    flex: 0 0 36px;
    font-size: 0.95rem;
    height: 36px;
    justify-content: center;
    transition: background 0.15s ease;
    width: 36px;
}

.question-delete-btn:hover[b-6f9jar9t62] {
    background: color-mix(in srgb, #ef4444 14%, transparent);
}

/* Контейнер вариантов ответов */
.answers-container[b-6f9jar9t62] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 16px;
}

.answers-title[b-6f9jar9t62] {
    color: var(--text-secondary);
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
}

.answers-list[b-6f9jar9t62] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.answer-row[b-6f9jar9t62] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.answer-row__text[b-6f9jar9t62] {
    flex: 1 1 auto;
}

.answer-row__score[b-6f9jar9t62] {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: 6px;
}

[b-6f9jar9t62] .answer-numeric {
    width: 80px;
}

.score-label[b-6f9jar9t62] {
    color: var(--text-secondary);
    font-size: 0.8rem;
}

.answer-delete-btn[b-6f9jar9t62] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--text-secondary);
    cursor: pointer;
    display: flex;
    flex: 0 0 30px;
    font-size: 0.88rem;
    height: 30px;
    justify-content: center;
    transition: all 0.15s ease;
    width: 30px;
}

.answer-delete-btn:hover[b-6f9jar9t62] {
    background: color-mix(in srgb, #ef4444 14%, transparent);
    color: #ef4444;
}

.answer-add-btn[b-6f9jar9t62] {
    align-items: center;
    align-self: flex-start;
    background: var(--bg-secondary);
    border: 1px dashed color-mix(in srgb, var(--primary-color) 35%, transparent);
    border-radius: 8px;
    color: var(--primary-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.82rem;
    font-weight: 650;
    gap: 6px;
    margin-top: 4px;
    padding: 6px 12px;
    transition: all 0.15s ease;
}

.answer-add-btn:hover[b-6f9jar9t62] {
    background: color-mix(in srgb, var(--primary-color) 8%, transparent);
}

/* --- Результаты и итоги --- */
.results-list[b-6f9jar9t62] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.result-row[b-6f9jar9t62] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 12px;
    display: flex;
    gap: 12px;
    padding: 10px 14px;
}

.result-score-range[b-6f9jar9t62] {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: 6px;
}

.range-label[b-6f9jar9t62] {
    color: var(--text-secondary);
    font-size: 0.82rem;
    font-weight: 600;
}

[b-6f9jar9t62] .range-numeric {
    width: 70px;
}

.range-dash[b-6f9jar9t62] {
    color: var(--text-secondary);
}

.result-message[b-6f9jar9t62] {
    flex: 1 1 auto;
}

.result-delete-btn[b-6f9jar9t62] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--text-secondary);
    cursor: pointer;
    display: flex;
    flex: 0 0 32px;
    font-size: 0.9rem;
    height: 32px;
    justify-content: center;
    transition: all 0.15s ease;
    width: 32px;
}

.result-delete-btn:hover[b-6f9jar9t62] {
    background: color-mix(in srgb, #ef4444 14%, transparent);
    color: #ef4444;
}

/* --- Мобильный фиксированный бар --- */
.quiz-mobile-actions[b-6f9jar9t62] {
    background: var(--card-bg);
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    bottom: 0;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
    display: none;
    gap: 12px;
    left: 0;
    padding: 12px 16px;
    position: fixed;
    right: 0;
    z-index: 100;
}

.quiz-mobile-actions .quiz-primary-btn[b-6f9jar9t62],
.quiz-mobile-actions .quiz-secondary-btn[b-6f9jar9t62] {
    flex: 1;
    justify-content: center;
}

/* --- Адаптивность --- */
@media (max-width: 900px) {
    .quiz-edit-header[b-6f9jar9t62] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .quiz-edit-header__actions[b-6f9jar9t62] {
        display: none;
    }

    .quiz-mobile-actions[b-6f9jar9t62] {
        display: flex;
    }

    .question-item__header[b-6f9jar9t62] {
        flex-wrap: wrap;
    }

    .question-item__title-input[b-6f9jar9t62] {
        flex: 1 1 100%;
        order: 3;
    }

    .question-delete-btn[b-6f9jar9t62] {
        margin-left: auto;
    }

    .result-row[b-6f9jar9t62] {
        flex-direction: column;
        align-items: stretch;
        position: relative;
    }

    .result-delete-btn[b-6f9jar9t62] {
        position: absolute;
        top: 10px;
        right: 10px;
    }
}
/* /Components/Pages/Admin/Flashcards/EditFlashcardSet.razor.rz.scp.css */
.flashcard-edit-page[b-s275qfrw8f] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1100px;
    padding-bottom: 60px;
}

/* --- Хедер страницы --- */
.flashcard-edit-header[b-s275qfrw8f] {
    align-items: center;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.flashcard-edit-header__left[b-s275qfrw8f] {
    align-items: center;
    display: flex;
    gap: 16px;
}

.flashcard-back-link[b-s275qfrw8f] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    display: inline-flex;
    flex: 0 0 42px;
    font-size: 1rem;
    height: 42px;
    justify-content: center;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 42px;
}

.flashcard-back-link:hover[b-s275qfrw8f] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.flashcard-eyebrow[b-s275qfrw8f] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.flashcard-edit-header h1[b-s275qfrw8f] {
    font-size: clamp(1.6rem, 2.5vw, 2.1rem);
    font-weight: 800;
    margin: 0 0 4px;
}

.flashcard-edit-header p[b-s275qfrw8f] {
    color: var(--text-secondary);
    font-size: 0.92rem;
    margin: 0;
}

.flashcard-edit-header__actions[b-s275qfrw8f] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.flashcard-primary-btn[b-s275qfrw8f] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.95rem;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 20px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.flashcard-primary-btn:hover[b-s275qfrw8f] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    transform: translateY(-1px);
}

.flashcard-secondary-btn[b-s275qfrw8f] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 700;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.flashcard-secondary-btn:hover[b-s275qfrw8f] {
    background: color-mix(in srgb, var(--text-secondary) 8%, var(--card-bg));
}

.flashcard-danger-btn[b-s275qfrw8f] {
    align-items: center;
    background: color-mix(in srgb, #ef4444 10%, transparent);
    border: 1px solid color-mix(in srgb, #ef4444 30%, transparent);
    border-radius: 12px;
    color: #ef4444;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 700;
    gap: 8px;
    min-height: 44px;
    padding: 0 16px;
    transition: all 0.15s ease;
}

.flashcard-danger-btn:hover[b-s275qfrw8f] {
    background: color-mix(in srgb, #ef4444 20%, transparent);
    border-color: #ef4444;
    color: #dc2626;
}

/* --- Стек формы --- */
.flashcard-form-stack[b-s275qfrw8f] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* --- Карточки --- */
.flashcard-card[b-s275qfrw8f] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    padding: 22px;
    transition: border-color 0.15s ease;
}

.flashcard-card:hover[b-s275qfrw8f] {
    border-color: color-mix(in srgb, var(--primary-color) 25%, transparent);
}

.flashcard-card__header[b-s275qfrw8f] {
    align-items: flex-start;
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 14px;
}

.flashcard-card__header--between[b-s275qfrw8f] {
    align-items: center;
    justify-content: space-between;
}

.flashcard-card__header-left[b-s275qfrw8f] {
    align-items: center;
    display: flex;
    gap: 12px;
}

.flashcard-card__header i[b-s275qfrw8f] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 36px;
    font-size: 1.1rem;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.flashcard-card__header h2[b-s275qfrw8f] {
    font-size: 1.15rem;
    font-weight: 750;
    margin: 0 0 3px;
}

.flashcard-card__header p[b-s275qfrw8f] {
    color: var(--text-secondary);
    font-size: 0.83rem;
    margin: 0;
}

.flashcard-card__body[b-s275qfrw8f] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.flashcard-field[b-s275qfrw8f] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.flashcard-field label[b-s275qfrw8f] {
    align-items: center;
    display: flex;
    font-size: 0.88rem;
    font-weight: 650;
    gap: 6px;
}

.required-star[b-s275qfrw8f] {
    color: #ef4444;
    font-weight: 700;
}

/* --- Кнопка добавления --- */
.flashcard-btn-add[b-s275qfrw8f] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--primary-color) 30%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.84rem;
    font-weight: 700;
    gap: 6px;
    min-height: 36px;
    padding: 0 14px;
    transition: all 0.15s ease;
}

.flashcard-btn-add:hover[b-s275qfrw8f] {
    background: color-mix(in srgb, var(--primary-color) 20%, transparent);
}

/* --- Пустое состояние --- */
.flashcard-empty-hint[b-s275qfrw8f] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px dashed color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 12px;
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 32px 20px;
    text-align: center;
}

.flashcard-empty-hint i[b-s275qfrw8f] {
    font-size: 2.2rem;
    opacity: 0.5;
}

.flashcard-empty-hint p[b-s275qfrw8f] {
    font-size: 0.92rem;
    margin: 0;
}

/* --- Сетка карточек редактора --- */
.cards-editor-grid[b-s275qfrw8f] {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}

.card-editor-item[b-s275qfrw8f] {
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    padding: 16px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.card-editor-item:hover[b-s275qfrw8f] {
    border-color: color-mix(in srgb, var(--primary-color) 35%, transparent);
    box-shadow: var(--shadow-sm);
}

.card-editor-item__header[b-s275qfrw8f] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 14px;
}

.card-number-badge[b-s275qfrw8f] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 8px;
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 750;
    padding: 4px 10px;
}

.card-icon-tag[b-s275qfrw8f] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 50%;
    color: var(--primary-color);
    display: flex;
    font-size: 1.1rem;
    height: 34px;
    justify-content: center;
    width: 34px;
}

.card-delete-btn[b-s275qfrw8f] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: #ef4444;
    cursor: pointer;
    display: flex;
    font-size: 0.9rem;
    height: 30px;
    justify-content: center;
    transition: background 0.15s ease;
    width: 30px;
}

.card-delete-btn:hover[b-s275qfrw8f] {
    background: color-mix(in srgb, #ef4444 14%, transparent);
}

.card-editor-item__body[b-s275qfrw8f] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.dropdown-icon-item[b-s275qfrw8f] {
    align-items: center;
    display: flex;
    gap: 8px;
}

/* --- Загрузка --- */
.flashcard-loading[b-s275qfrw8f] {
    align-items: center;
    background: var(--card-bg);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    padding: 60px 20px;
}

/* --- Мобильный фиксированный бар --- */
.flashcard-mobile-actions[b-s275qfrw8f] {
    background: var(--card-bg);
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    bottom: 0;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
    display: none;
    gap: 12px;
    left: 0;
    padding: 12px 16px;
    position: fixed;
    right: 0;
    z-index: 100;
}

.flashcard-mobile-actions .flashcard-primary-btn[b-s275qfrw8f],
.flashcard-mobile-actions .flashcard-secondary-btn[b-s275qfrw8f] {
    flex: 1;
    justify-content: center;
}

/* --- Адаптивность --- */
@media (max-width: 900px) {
    .flashcard-edit-header[b-s275qfrw8f] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .flashcard-edit-header__actions[b-s275qfrw8f] {
        display: none;
    }

    .flashcard-mobile-actions[b-s275qfrw8f] {
        display: flex;
    }

    .cards-editor-grid[b-s275qfrw8f] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Admin/Flashcards/EditQuiz.razor.rz.scp.css */
.quiz-edit-page[b-4qaxgn64a3] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1100px;
    padding-bottom: 60px;
}

/* --- Хедер страницы --- */
.quiz-edit-header[b-4qaxgn64a3] {
    align-items: center;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.quiz-edit-header__left[b-4qaxgn64a3] {
    align-items: center;
    display: flex;
    gap: 16px;
}

.quiz-back-link[b-4qaxgn64a3] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    display: inline-flex;
    flex: 0 0 42px;
    font-size: 1rem;
    height: 42px;
    justify-content: center;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 42px;
}

.quiz-back-link:hover[b-4qaxgn64a3] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.quiz-eyebrow[b-4qaxgn64a3] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.quiz-edit-header h1[b-4qaxgn64a3] {
    font-size: clamp(1.6rem, 2.5vw, 2.1rem);
    font-weight: 800;
    margin: 0 0 4px;
}

.quiz-edit-header p[b-4qaxgn64a3] {
    color: var(--text-secondary);
    font-size: 0.92rem;
    margin: 0;
}

.quiz-edit-header__actions[b-4qaxgn64a3] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.quiz-primary-btn[b-4qaxgn64a3] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.95rem;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 20px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.quiz-primary-btn:hover[b-4qaxgn64a3] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    transform: translateY(-1px);
}

.quiz-secondary-btn[b-4qaxgn64a3] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 700;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.quiz-secondary-btn:hover[b-4qaxgn64a3] {
    background: color-mix(in srgb, var(--text-secondary) 8%, var(--card-bg));
}

.quiz-danger-btn[b-4qaxgn64a3] {
    align-items: center;
    background: color-mix(in srgb, #ef4444 10%, transparent);
    border: 1px solid color-mix(in srgb, #ef4444 30%, transparent);
    border-radius: 12px;
    color: #ef4444;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 700;
    gap: 8px;
    min-height: 44px;
    padding: 0 16px;
    transition: all 0.15s ease;
}

.quiz-danger-btn:hover[b-4qaxgn64a3] {
    background: color-mix(in srgb, #ef4444 20%, transparent);
    border-color: #ef4444;
    color: #dc2626;
}

/* --- Стек формы --- */
.quiz-form-stack[b-4qaxgn64a3] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* --- Карточки --- */
.quiz-card[b-4qaxgn64a3] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    padding: 22px;
    transition: border-color 0.15s ease;
}

.quiz-card:hover[b-4qaxgn64a3] {
    border-color: color-mix(in srgb, var(--primary-color) 25%, transparent);
}

.quiz-card__header[b-4qaxgn64a3] {
    align-items: flex-start;
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 14px;
}

.quiz-card__header--between[b-4qaxgn64a3] {
    align-items: center;
    justify-content: space-between;
}

.quiz-card__header-left[b-4qaxgn64a3] {
    align-items: center;
    display: flex;
    gap: 12px;
}

.quiz-card__header i[b-4qaxgn64a3] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 36px;
    font-size: 1.1rem;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.quiz-card__header h2[b-4qaxgn64a3] {
    font-size: 1.15rem;
    font-weight: 750;
    margin: 0 0 3px;
}

.quiz-card__header p[b-4qaxgn64a3] {
    color: var(--text-secondary);
    font-size: 0.83rem;
    margin: 0;
}

.quiz-card__body[b-4qaxgn64a3] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.quiz-field[b-4qaxgn64a3] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.quiz-field label[b-4qaxgn64a3] {
    align-items: center;
    display: flex;
    font-size: 0.88rem;
    font-weight: 650;
    gap: 6px;
}

.required-star[b-4qaxgn64a3] {
    color: #ef4444;
    font-weight: 700;
}

.field-hint[b-4qaxgn64a3] {
    color: var(--text-secondary);
    font-size: 0.8rem;
    font-weight: 400;
}

/* --- Кнопка добавления элемента --- */
.quiz-btn-add[b-4qaxgn64a3] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--primary-color) 30%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.84rem;
    font-weight: 700;
    gap: 6px;
    min-height: 36px;
    padding: 0 14px;
    transition: all 0.15s ease;
}

.quiz-btn-add:hover[b-4qaxgn64a3] {
    background: color-mix(in srgb, var(--primary-color) 20%, transparent);
}

.quiz-btn-add--warning[b-4qaxgn64a3] {
    background: color-mix(in srgb, #f59e0b 12%, transparent);
    border-color: color-mix(in srgb, #f59e0b 30%, transparent);
    color: #d97706;
}

.quiz-btn-add--warning:hover[b-4qaxgn64a3] {
    background: color-mix(in srgb, #f59e0b 20%, transparent);
}

/* --- Пустое состояние секции --- */
.quiz-empty-hint[b-4qaxgn64a3] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px dashed color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 12px;
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 32px 20px;
    text-align: center;
}

.quiz-empty-hint i[b-4qaxgn64a3] {
    font-size: 2rem;
    opacity: 0.5;
}

.quiz-empty-hint p[b-4qaxgn64a3] {
    font-size: 0.92rem;
    margin: 0;
}

/* --- Элемент вопроса --- */
.questions-list[b-4qaxgn64a3] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.question-item[b-4qaxgn64a3] {
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 14px;
    padding: 18px;
    transition: border-color 0.15s ease;
}

.question-item:hover[b-4qaxgn64a3] {
    border-color: color-mix(in srgb, var(--primary-color) 30%, transparent);
}

.question-item__header[b-4qaxgn64a3] {
    align-items: center;
    display: flex;
    gap: 12px;
    margin-bottom: 14px;
}

.question-number-badge[b-4qaxgn64a3] {
    align-items: center;
    background: var(--primary-color);
    border-radius: 8px;
    color: #fff;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 0.8rem;
    font-weight: 750;
    padding: 6px 12px;
    white-space: nowrap;
}

.question-item__title-input[b-4qaxgn64a3] {
    flex: 1 1 auto;
}

.question-delete-btn[b-4qaxgn64a3] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 8px;
    color: #ef4444;
    cursor: pointer;
    display: flex;
    flex: 0 0 36px;
    font-size: 0.95rem;
    height: 36px;
    justify-content: center;
    transition: background 0.15s ease;
    width: 36px;
}

.question-delete-btn:hover[b-4qaxgn64a3] {
    background: color-mix(in srgb, #ef4444 14%, transparent);
}

/* Контейнер вариантов ответов */
.answers-container[b-4qaxgn64a3] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 16px;
}

.answers-title[b-4qaxgn64a3] {
    color: var(--text-secondary);
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
}

.answers-list[b-4qaxgn64a3] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.answer-row[b-4qaxgn64a3] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.answer-row__text[b-4qaxgn64a3] {
    flex: 1 1 auto;
}

.answer-row__score[b-4qaxgn64a3] {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: 6px;
}

[b-4qaxgn64a3] .answer-numeric {
    width: 80px;
}

.score-label[b-4qaxgn64a3] {
    color: var(--text-secondary);
    font-size: 0.8rem;
}

.answer-delete-btn[b-4qaxgn64a3] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--text-secondary);
    cursor: pointer;
    display: flex;
    flex: 0 0 30px;
    font-size: 0.88rem;
    height: 30px;
    justify-content: center;
    transition: all 0.15s ease;
    width: 30px;
}

.answer-delete-btn:hover[b-4qaxgn64a3] {
    background: color-mix(in srgb, #ef4444 14%, transparent);
    color: #ef4444;
}

.answer-add-btn[b-4qaxgn64a3] {
    align-items: center;
    align-self: flex-start;
    background: var(--bg-secondary);
    border: 1px dashed color-mix(in srgb, var(--primary-color) 35%, transparent);
    border-radius: 8px;
    color: var(--primary-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.82rem;
    font-weight: 650;
    gap: 6px;
    margin-top: 4px;
    padding: 6px 12px;
    transition: all 0.15s ease;
}

.answer-add-btn:hover[b-4qaxgn64a3] {
    background: color-mix(in srgb, var(--primary-color) 8%, transparent);
}

/* --- Результаты и итоги --- */
.results-list[b-4qaxgn64a3] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.result-row[b-4qaxgn64a3] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 12px;
    display: flex;
    gap: 12px;
    padding: 10px 14px;
}

.result-score-range[b-4qaxgn64a3] {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: 6px;
}

.range-label[b-4qaxgn64a3] {
    color: var(--text-secondary);
    font-size: 0.82rem;
    font-weight: 600;
}

[b-4qaxgn64a3] .range-numeric {
    width: 70px;
}

.range-dash[b-4qaxgn64a3] {
    color: var(--text-secondary);
}

.result-message[b-4qaxgn64a3] {
    flex: 1 1 auto;
}

.result-delete-btn[b-4qaxgn64a3] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--text-secondary);
    cursor: pointer;
    display: flex;
    flex: 0 0 32px;
    font-size: 0.9rem;
    height: 32px;
    justify-content: center;
    transition: all 0.15s ease;
    width: 32px;
}

.result-delete-btn:hover[b-4qaxgn64a3] {
    background: color-mix(in srgb, #ef4444 14%, transparent);
    color: #ef4444;
}

/* --- Загрузка --- */
.quiz-loading[b-4qaxgn64a3] {
    align-items: center;
    background: var(--card-bg);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    padding: 60px 20px;
}

/* --- Мобильный фиксированный бар --- */
.quiz-mobile-actions[b-4qaxgn64a3] {
    background: var(--card-bg);
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    bottom: 0;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
    display: none;
    gap: 12px;
    left: 0;
    padding: 12px 16px;
    position: fixed;
    right: 0;
    z-index: 100;
}

.quiz-mobile-actions .quiz-primary-btn[b-4qaxgn64a3],
.quiz-mobile-actions .quiz-secondary-btn[b-4qaxgn64a3] {
    flex: 1;
    justify-content: center;
}

/* --- Адаптивность --- */
@media (max-width: 900px) {
    .quiz-edit-header[b-4qaxgn64a3] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .quiz-edit-header__actions[b-4qaxgn64a3] {
        display: none;
    }

    .quiz-mobile-actions[b-4qaxgn64a3] {
        display: flex;
    }

    .question-item__header[b-4qaxgn64a3] {
        flex-wrap: wrap;
    }

    .question-item__title-input[b-4qaxgn64a3] {
        flex: 1 1 100%;
        order: 3;
    }

    .question-delete-btn[b-4qaxgn64a3] {
        margin-left: auto;
    }

    .result-row[b-4qaxgn64a3] {
        flex-direction: column;
        align-items: stretch;
        position: relative;
    }

    .result-delete-btn[b-4qaxgn64a3] {
        position: absolute;
        top: 10px;
        right: 10px;
    }
}
/* /Components/Pages/Admin/Flashcards/FlashcardList.razor.rz.scp.css */
.flashcards-page[b-ztqvcku40n] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
    padding-bottom: 60px;
}

/* --- Хедер раздела --- */
.flashcards-header[b-ztqvcku40n] {
    align-items: flex-end;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.flashcards-eyebrow[b-ztqvcku40n] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.flashcards-header h1[b-ztqvcku40n] {
    font-size: clamp(1.8rem, 3vw, 2.45rem);
    font-weight: 800;
    margin: 0 0 6px;
}

.flashcards-header p[b-ztqvcku40n] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    margin: 0;
    max-width: 680px;
}

.flashcards-actions[b-ztqvcku40n] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.flashcards-primary-action[b-ztqvcku40n] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff !important;
    display: inline-flex;
    font-size: 0.95rem;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 18px;
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.flashcards-primary-action:hover[b-ztqvcku40n] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    color: #fff !important;
    transform: translateY(-1px);
}

/* --- Панель поиска и фильтров --- */
.flashcards-toolbar[b-ztqvcku40n] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 14px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 14px 18px;
}

.flashcards-search[b-ztqvcku40n] {
    display: flex;
    flex: 1 1 280px;
    flex-direction: column;
    gap: 4px;
}

.flashcards-search > span[b-ztqvcku40n] {
    display: none;
}

.flashcards-search > div[b-ztqvcku40n] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 10px;
    display: flex;
    gap: 10px;
    padding: 0 14px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.flashcards-search > div:focus-within[b-ztqvcku40n] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 16%, transparent);
}

.flashcards-search i[b-ztqvcku40n] {
    color: var(--text-secondary);
    font-size: 0.95rem;
}

.flashcards-search input[b-ztqvcku40n] {
    background: transparent;
    border: 0;
    color: var(--text-color);
    font-size: 0.92rem;
    min-height: 40px;
    outline: none;
    width: 100%;
}

.flashcards-filter-group select[b-ztqvcku40n] {
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    font-size: 0.88rem;
    font-weight: 600;
    min-height: 40px;
    padding: 0 12px;
}

.flashcards-filter-group select:focus[b-ztqvcku40n] {
    border-color: var(--primary-color);
    outline: none;
}

/* --- Сетка наборов карточек --- */
.flashcards-grid[b-ztqvcku40n] {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    margin-bottom: 30px;
}

.flashcard-set-card[b-ztqvcku40n] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 22px;
    position: relative;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.flashcard-set-card:hover[b-ztqvcku40n] {
    border-color: color-mix(in srgb, var(--primary-color) 40%, transparent);
    box-shadow: 0 12px 30px color-mix(in srgb, #000 7%, transparent);
    transform: translateY(-3px);
}

.flashcard-set-card__header[b-ztqvcku40n] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 14px;
}

.flashcard-set-card__icon-badge[b-ztqvcku40n] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 12px;
    color: var(--primary-color);
    display: flex;
    font-size: 1.25rem;
    height: 44px;
    justify-content: center;
    width: 44px;
}

.flashcard-set-date[b-ztqvcku40n] {
    align-items: center;
    color: var(--text-secondary);
    display: inline-flex;
    font-size: 0.8rem;
    gap: 5px;
}

.flashcard-set-card__body[b-ztqvcku40n] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 12px;
}

.flashcard-set-card__title[b-ztqvcku40n] {
    font-size: 1.18rem;
    font-weight: 750;
    line-height: 1.35;
    margin: 0;
}

.flashcard-set-card__title a[b-ztqvcku40n] {
    color: var(--text-color);
    text-decoration: none;
    transition: color 0.15s ease;
}

.flashcard-set-card__title a:hover[b-ztqvcku40n] {
    color: var(--primary-color);
}

.flashcard-set-card__stats[b-ztqvcku40n] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.flashcard-stat-pill[b-ztqvcku40n] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 20px;
    color: var(--text-secondary);
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 650;
    gap: 6px;
    padding: 4px 11px;
}

.flashcard-stat-pill--ready[b-ztqvcku40n] {
    background: color-mix(in srgb, #10b981 12%, transparent);
    border-color: color-mix(in srgb, #10b981 25%, transparent);
    color: #059669;
}

.flashcard-stat-pill--empty[b-ztqvcku40n] {
    background: color-mix(in srgb, #f59e0b 12%, transparent);
    border-color: color-mix(in srgb, #f59e0b 25%, transparent);
    color: #d97706;
}

/* Описание набора */
.flashcard-set-card__desc[b-ztqvcku40n] {
    color: var(--text-secondary);
    font-size: 0.85rem;
    line-height: 1.45;
    margin: 4px 0 0;
}

.flashcard-set-card__desc--empty[b-ztqvcku40n] {
    color: var(--text-secondary);
    font-style: italic;
    opacity: 0.8;
}

/* Чипсы упражнений в наборе */
.flashcard-topics-preview[b-ztqvcku40n] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 4px;
}

.flashcard-topics-label[b-ztqvcku40n] {
    color: var(--text-secondary);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.flashcard-topics-chips[b-ztqvcku40n] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.flashcard-topic-chip[b-ztqvcku40n] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 8px;
    color: var(--text-color);
    display: inline-flex;
    font-size: 0.8rem;
    font-weight: 600;
    max-width: 220px;
    overflow: hidden;
    padding: 3px 9px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flashcard-topic-chip--more[b-ztqvcku40n] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--bg-secondary));
    border-color: color-mix(in srgb, var(--primary-color) 25%, transparent);
    color: var(--primary-color);
    font-weight: 700;
}

.flashcard-set-card__footer[b-ztqvcku40n] {
    align-items: center;
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    justify-content: space-between;
    margin-top: 18px;
    padding-top: 14px;
}

.flashcard-set-card__id[b-ztqvcku40n] {
    color: var(--text-secondary);
    font-family: monospace;
    font-size: 0.82rem;
    font-weight: 600;
}

.flashcard-set-card__actions[b-ztqvcku40n] {
    align-items: center;
    display: flex;
    gap: 8px;
}

.flashcard-icon-btn[b-ztqvcku40n] {
    align-items: center;
    border-radius: 9px;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.82rem;
    font-weight: 650;
    gap: 6px;
    min-height: 34px;
    padding: 0 11px;
    transition: all 0.15s ease;
}

.flashcard-icon-btn--edit[b-ztqvcku40n] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--primary-color) 30%, transparent);
    color: var(--primary-color);
    text-decoration: none;
}

.flashcard-icon-btn--edit:hover[b-ztqvcku40n] {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff !important;
}

.flashcard-icon-btn--delete[b-ztqvcku40n] {
    background: transparent;
    border: 1px solid color-mix(in srgb, #ef4444 24%, transparent);
    color: #ef4444;
}

.flashcard-icon-btn--delete:hover[b-ztqvcku40n] {
    background: color-mix(in srgb, #ef4444 12%, transparent);
    border-color: #ef4444;
    color: #dc2626;
}

/* --- Пустое состояние --- */
.flashcards-empty[b-ztqvcku40n] {
    align-items: center;
    background: var(--card-bg);
    border: 1px dashed color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    padding: 60px 24px;
    text-align: center;
}

.flashcards-empty__icon[b-ztqvcku40n] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    border-radius: 50%;
    color: var(--primary-color);
    display: flex;
    font-size: 2.2rem;
    height: 76px;
    justify-content: center;
    margin-bottom: 18px;
    width: 76px;
}

.flashcards-empty h3[b-ztqvcku40n] {
    font-size: 1.35rem;
    font-weight: 750;
    margin: 0 0 8px;
}

.flashcards-empty p[b-ztqvcku40n] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    margin: 0 0 22px;
    max-width: 480px;
}

.flashcards-reset-btn[b-ztqvcku40n] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-weight: 650;
    gap: 8px;
    min-height: 40px;
    padding: 0 16px;
    transition: all 0.15s ease;
}

.flashcards-reset-btn:hover[b-ztqvcku40n] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.flashcards-state[b-ztqvcku40n] {
    align-items: center;
    background: var(--card-bg);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    padding: 60px 20px;
}

/* --- Адаптивность --- */
@media (max-width: 900px) {
    .flashcards-header[b-ztqvcku40n] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .flashcards-actions[b-ztqvcku40n] {
        width: 100%;
    }

    .flashcards-primary-action[b-ztqvcku40n] {
        justify-content: center;
        width: 100%;
    }

    .flashcards-toolbar[b-ztqvcku40n] {
        flex-direction: column;
    }

    .flashcards-filter-group[b-ztqvcku40n] {
        width: 100%;
    }

    .flashcards-filter-group select[b-ztqvcku40n] {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .flashcards-grid[b-ztqvcku40n] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Admin/Flashcards/QuizList.razor.rz.scp.css */
.quizzes-page[b-10mwwr14j1] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
    padding-bottom: 60px;
}

/* --- Хедер раздела --- */
.quizzes-header[b-10mwwr14j1] {
    align-items: flex-end;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.quizzes-eyebrow[b-10mwwr14j1] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.quizzes-header h1[b-10mwwr14j1] {
    font-size: clamp(1.8rem, 3vw, 2.45rem);
    font-weight: 800;
    margin: 0 0 6px;
}

.quizzes-header p[b-10mwwr14j1] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    margin: 0;
    max-width: 680px;
}

.quizzes-actions[b-10mwwr14j1] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.quizzes-primary-action[b-10mwwr14j1] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff !important;
    display: inline-flex;
    font-size: 0.95rem;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 18px;
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.quizzes-primary-action:hover[b-10mwwr14j1] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    color: #fff !important;
    transform: translateY(-1px);
}

/* --- Метрики раздела --- */
.quizzes-metrics[b-10mwwr14j1] {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    margin-bottom: 22px;
}

.quizzes-metrics article[b-10mwwr14j1] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 14px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 16px 18px;
    transition: transform 0.15s ease, border-color 0.15s ease;
}

.quizzes-metrics article:hover[b-10mwwr14j1] {
    border-color: color-mix(in srgb, var(--primary-color) 35%, transparent);
    transform: translateY(-2px);
}

.quizzes-metrics span[b-10mwwr14j1] {
    color: var(--text-secondary);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.quizzes-metrics strong[b-10mwwr14j1] {
    color: var(--text-color);
    font-size: 1.85rem;
    font-weight: 850;
    line-height: 1.15;
}

.quizzes-metrics small[b-10mwwr14j1] {
    color: var(--text-secondary);
    font-size: 0.78rem;
}

/* --- Панель поиска и фильтров --- */
.quizzes-toolbar[b-10mwwr14j1] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 14px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 14px 18px;
}

.quizzes-search[b-10mwwr14j1] {
    display: flex;
    flex: 1 1 280px;
    flex-direction: column;
    gap: 4px;
}

.quizzes-search > span[b-10mwwr14j1] {
    display: none;
}

.quizzes-search > div[b-10mwwr14j1] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 10px;
    display: flex;
    gap: 10px;
    padding: 0 14px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.quizzes-search > div:focus-within[b-10mwwr14j1] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 16%, transparent);
}

.quizzes-search i[b-10mwwr14j1] {
    color: var(--text-secondary);
    font-size: 0.95rem;
}

.quizzes-search input[b-10mwwr14j1] {
    background: transparent;
    border: 0;
    color: var(--text-color);
    font-size: 0.92rem;
    min-height: 40px;
    outline: none;
    width: 100%;
}

.quizzes-filter-group select[b-10mwwr14j1] {
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    font-size: 0.88rem;
    font-weight: 600;
    min-height: 40px;
    padding: 0 12px;
}

.quizzes-filter-group select:focus[b-10mwwr14j1] {
    border-color: var(--primary-color);
    outline: none;
}

/* --- Сетка карточек тестов --- */
.quizzes-grid[b-10mwwr14j1] {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    margin-bottom: 30px;
}

.quiz-card[b-10mwwr14j1] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    padding: 20px;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.quiz-card:hover[b-10mwwr14j1] {
    border-color: color-mix(in srgb, var(--primary-color) 40%, transparent);
    box-shadow: 0 12px 30px color-mix(in srgb, #000 7%, transparent);
    transform: translateY(-3px);
}

.quiz-card__header[b-10mwwr14j1] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 14px;
}

.quiz-card__icon-badge[b-10mwwr14j1] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 12px;
    color: var(--primary-color);
    display: flex;
    font-size: 1.25rem;
    height: 44px;
    justify-content: center;
    width: 44px;
}

.quiz-date[b-10mwwr14j1] {
    align-items: center;
    color: var(--text-secondary);
    display: inline-flex;
    font-size: 0.8rem;
    gap: 5px;
}

.quiz-card__body[b-10mwwr14j1] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 8px;
}

.quiz-card__title[b-10mwwr14j1] {
    font-size: 1.15rem;
    font-weight: 750;
    line-height: 1.35;
    margin: 0;
}

.quiz-card__title a[b-10mwwr14j1] {
    color: var(--text-color);
    text-decoration: none;
    transition: color 0.15s ease;
}

.quiz-card__title a:hover[b-10mwwr14j1] {
    color: var(--primary-color);
}

.quiz-card__subtitle[b-10mwwr14j1] {
    color: var(--text-secondary);
    display: -webkit-box;
    font-size: 0.88rem;
    line-height: 1.45;
    margin: 0;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.quiz-card__stats[b-10mwwr14j1] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 6px;
}

.quiz-stat-pill[b-10mwwr14j1] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 20px;
    color: var(--text-secondary);
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 650;
    gap: 5px;
    padding: 3px 10px;
}

.quiz-stat-pill--accent[b-10mwwr14j1] {
    background: color-mix(in srgb, #f59e0b 12%, transparent);
    border-color: color-mix(in srgb, #f59e0b 25%, transparent);
    color: #d97706;
}

.quiz-card__footer[b-10mwwr14j1] {
    align-items: center;
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    justify-content: space-between;
    margin-top: 16px;
    padding-top: 14px;
}

.quiz-card__id[b-10mwwr14j1] {
    color: var(--text-secondary);
    font-family: monospace;
    font-size: 0.82rem;
    font-weight: 600;
}

.quiz-card__actions[b-10mwwr14j1] {
    align-items: center;
    display: flex;
    gap: 8px;
}

.quiz-icon-btn[b-10mwwr14j1] {
    align-items: center;
    border-radius: 8px;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.82rem;
    font-weight: 650;
    gap: 6px;
    min-height: 34px;
    padding: 0 10px;
    transition: all 0.15s ease;
}

.quiz-icon-btn--edit[b-10mwwr14j1] {
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--primary-color) 30%, transparent);
    color: var(--primary-color);
    text-decoration: none;
}

.quiz-icon-btn--edit:hover[b-10mwwr14j1] {
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
}

.quiz-icon-btn--delete[b-10mwwr14j1] {
    background: transparent;
    border: 1px solid color-mix(in srgb, #ef4444 25%, transparent);
    color: #ef4444;
}

.quiz-icon-btn--delete:hover[b-10mwwr14j1] {
    background: color-mix(in srgb, #ef4444 12%, transparent);
    color: #dc2626;
}

/* --- Пустое состояние --- */
.quizzes-empty[b-10mwwr14j1] {
    align-items: center;
    background: var(--card-bg);
    border: 1px dashed color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    padding: 60px 24px;
    text-align: center;
}

.quizzes-empty__icon[b-10mwwr14j1] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    border-radius: 50%;
    color: var(--primary-color);
    display: flex;
    font-size: 2.2rem;
    height: 76px;
    justify-content: center;
    margin-bottom: 18px;
    width: 76px;
}

.quizzes-empty h3[b-10mwwr14j1] {
    font-size: 1.35rem;
    font-weight: 750;
    margin: 0 0 8px;
}

.quizzes-empty p[b-10mwwr14j1] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    margin: 0 0 22px;
    max-width: 480px;
}

.quizzes-reset-btn[b-10mwwr14j1] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-weight: 650;
    gap: 8px;
    min-height: 40px;
    padding: 0 16px;
    transition: all 0.15s ease;
}

.quizzes-reset-btn:hover[b-10mwwr14j1] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.quizzes-state[b-10mwwr14j1] {
    align-items: center;
    background: var(--card-bg);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    padding: 60px 20px;
}

/* --- Адаптивность --- */
@media (max-width: 900px) {
    .quizzes-header[b-10mwwr14j1] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .quizzes-actions[b-10mwwr14j1] {
        width: 100%;
    }

    .quizzes-primary-action[b-10mwwr14j1] {
        justify-content: center;
        width: 100%;
    }

    .quizzes-toolbar[b-10mwwr14j1] {
        flex-direction: column;
    }

    .quizzes-filter-group[b-10mwwr14j1] {
        width: 100%;
    }

    .quizzes-filter-group select[b-10mwwr14j1] {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .quizzes-grid[b-10mwwr14j1] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Pages/Admin/ReviewsList.razor.rz.scp.css */
.reviews-page[b-zr7ulsej0w] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
}

/* --- Заголовок страницы --- */
.reviews-header[b-zr7ulsej0w] {
    align-items: flex-end;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.reviews-eyebrow[b-zr7ulsej0w] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.reviews-header h1[b-zr7ulsej0w] {
    font-size: clamp(1.75rem, 3.2vw, 2.45rem);
    font-weight: 800;
    line-height: 1.2;
    margin: 0 0 6px;
}

.reviews-header p[b-zr7ulsej0w] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    line-height: 1.45;
    margin: 0;
    max-width: 680px;
}

.reviews-actions[b-zr7ulsej0w] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.reviews-primary-action[b-zr7ulsej0w] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff !important;
    display: inline-flex;
    flex: 0 0 auto;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 18px;
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.reviews-primary-action:hover[b-zr7ulsej0w] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    color: #fff !important;
    transform: translateY(-1px);
}

/* --- Панель поиска и фильтрации --- */
.reviews-toolbar[b-zr7ulsej0w] {
    align-items: flex-end;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 18px;
    padding: 16px 20px;
}

.reviews-filter-label[b-zr7ulsej0w] {
    color: var(--text-secondary);
    display: block;
    font-size: .74rem;
    font-weight: 750;
    letter-spacing: .04em;
    margin-bottom: 6px;
    text-transform: uppercase;
}

.reviews-search[b-zr7ulsej0w] {
    display: flex;
    flex: 1 1 280px;
    flex-direction: column;
    min-width: 240px;
}

.reviews-search-box[b-zr7ulsej0w] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 10px;
    display: flex;
    gap: 10px;
    padding: 0 12px 0 14px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.reviews-search-box:focus-within[b-zr7ulsej0w] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 16%, transparent);
}

.reviews-search-box i[b-zr7ulsej0w] {
    color: var(--text-secondary);
    font-size: 0.95rem;
}

.reviews-search-box input[b-zr7ulsej0w] {
    background: transparent;
    border: 0;
    color: var(--text-color);
    font: inherit;
    font-size: 0.92rem;
    min-height: 42px;
    outline: none;
    width: 100%;
}

.reviews-search-clear[b-zr7ulsej0w] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--text-secondary);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.85rem;
    height: 28px;
    justify-content: center;
    padding: 0;
    transition: color 0.15s ease, background 0.15s ease;
    width: 28px;
}

.reviews-search-clear:hover[b-zr7ulsej0w] {
    background: color-mix(in srgb, var(--text-secondary) 15%, transparent);
    color: var(--text-color);
}

.reviews-filter-group[b-zr7ulsej0w] {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.reviews-filter-item[b-zr7ulsej0w] {
    display: flex;
    flex-direction: column;
    min-width: 145px;
}

.reviews-filter-item select[b-zr7ulsej0w] {
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    font: inherit;
    font-size: 0.88rem;
    font-weight: 600;
    min-height: 42px;
    padding: 0 12px;
    transition: border-color 0.15s ease;
}

.reviews-filter-item select:focus[b-zr7ulsej0w] {
    border-color: var(--primary-color);
    outline: none;
}

/* --- Сводка счетчика --- */
.reviews-summary[b-zr7ulsej0w] {
    color: var(--text-secondary);
    font-size: .84rem;
    margin: 0 2px 14px;
}

.reviews-summary strong[b-zr7ulsej0w] {
    color: var(--text-color);
}

/* --- Сетка карточек отзывов --- */
.reviews-grid[b-zr7ulsej0w] {
    align-items: stretch;
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
    margin-bottom: 30px;
}

/* --- Карточка отзыва --- */
.review-card[b-zr7ulsej0w] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 18px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.review-card:hover[b-zr7ulsej0w] {
    border-color: color-mix(in srgb, var(--primary-color) 45%, transparent);
    box-shadow: 0 12px 28px color-mix(in srgb, #000 9%, transparent);
    transform: translateY(-3px);
}

/* Дифференциация статуса: Опубликован */
.review-card--published[b-zr7ulsej0w] {
    border-top: 3px solid #10b981;
}

/* Дифференциация статуса: Черновик */
.review-card--draft[b-zr7ulsej0w] {
    background: color-mix(in srgb, var(--card-bg) 96%, #f59e0b);
    border-style: dashed;
    border-top: 3px solid #f59e0b;
}

.review-card--draft:hover[b-zr7ulsej0w] {
    border-color: #f59e0b;
}

/* Шапка карточки */
.review-card__header[b-zr7ulsej0w] {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    padding: 16px 18px 12px;
}

.review-card__badges[b-zr7ulsej0w] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* Бейджи статуса */
.review-status-pill[b-zr7ulsej0w] {
    align-items: center;
    border-radius: 20px;
    display: inline-flex;
    font-size: 0.76rem;
    font-weight: 750;
    gap: 5px;
    letter-spacing: .01em;
    padding: 4px 10px;
}

.review-status-pill--published[b-zr7ulsej0w] {
    background: color-mix(in srgb, #10b981 14%, transparent);
    border: 1px solid color-mix(in srgb, #10b981 32%, transparent);
    color: #059669;
}

.review-status-pill--draft[b-zr7ulsej0w] {
    background: color-mix(in srgb, #f59e0b 16%, transparent);
    border: 1px solid color-mix(in srgb, #f59e0b 38%, transparent);
    color: #d97706;
}

/* Бейджи формата отзыва (скриншот / текст) */
.review-format-pill[b-zr7ulsej0w] {
    align-items: center;
    border-radius: 20px;
    display: inline-flex;
    font-size: 0.74rem;
    font-weight: 650;
    gap: 5px;
    padding: 4px 9px;
}

.review-format-pill--media[b-zr7ulsej0w] {
    background: color-mix(in srgb, #0ea5e9 12%, transparent);
    border: 1px solid color-mix(in srgb, #0ea5e9 28%, transparent);
    color: #0284c7;
}

.review-format-pill--text[b-zr7ulsej0w] {
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--primary-color) 24%, transparent);
    color: var(--primary-color);
}

.review-card__date[b-zr7ulsej0w] {
    align-items: center;
    color: var(--text-secondary);
    display: inline-flex;
    font-size: 0.8rem;
    font-weight: 600;
    gap: 5px;
    white-space: nowrap;
}

/* --- Блок автора --- */
.review-card__author-section[b-zr7ulsej0w] {
    align-items: center;
    display: flex;
    gap: 12px;
    padding: 0 18px 12px;
}

.review-card__avatar[b-zr7ulsej0w] {
    align-items: center;
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary-color) 18%, var(--card-bg)), color-mix(in srgb, #8b5cf6 24%, var(--card-bg)));
    border: 1px solid color-mix(in srgb, var(--primary-color) 26%, transparent);
    border-radius: 12px;
    box-shadow: 0 2px 8px color-mix(in srgb, var(--primary-color) 12%, transparent);
    color: var(--primary-color);
    display: flex;
    flex: 0 0 44px;
    font-size: 0.95rem;
    font-weight: 800;
    height: 44px;
    justify-content: center;
    letter-spacing: .02em;
    width: 44px;
}

.review-card__author-meta[b-zr7ulsej0w] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.review-card__author-name[b-zr7ulsej0w] {
    color: var(--text-color);
    font-size: 1.05rem;
    font-weight: 750;
    line-height: 1.25;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.review-card__child-badge[b-zr7ulsej0w] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 6px;
    color: var(--text-secondary);
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 600;
    gap: 5px;
    max-width: 100%;
    overflow: hidden;
    padding: 2px 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: fit-content;
}

.review-card__child-badge i[b-zr7ulsej0w] {
    color: var(--primary-color);
    font-size: 0.74rem;
}

/* --- Основное тело карточки --- */
.review-card__body[b-zr7ulsej0w] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    gap: 10px;
    padding: 0 18px 16px;
}

/* Текстовый отзыв: элегантный блок цитаты */
.review-card__quote-box[b-zr7ulsej0w] {
    background: color-mix(in srgb, var(--bg-secondary) 55%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    border-left: 3px solid color-mix(in srgb, var(--primary-color) 65%, transparent);
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    height: 100%;
    min-height: 100px;
    padding: 14px 16px;
    position: relative;
}

.review-card__quote-icon[b-zr7ulsej0w] {
    color: var(--primary-color);
    font-size: 1.35rem;
    line-height: 1;
    opacity: 0.45;
}

.review-card__quote-text[b-zr7ulsej0w] {
    color: var(--text-color);
    display: -webkit-box;
    font-size: 0.92rem;
    line-height: 1.55;
    margin: 0;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    white-space: pre-wrap;
}

/* Отзыв со скриншотом: выдержка и превью */
.review-card__excerpt[b-zr7ulsej0w] {
    color: var(--text-secondary);
    display: -webkit-box;
    font-size: 0.88rem;
    font-style: italic;
    line-height: 1.45;
    margin: 0;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.review-card__media-frame[b-zr7ulsej0w] {
    background: color-mix(in srgb, var(--bg-secondary) 85%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 12px;
    cursor: pointer;
    height: 175px;
    overflow: hidden;
    position: relative;
    touch-action: manipulation;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    width: 100%;
}

.review-card__media-frame:hover[b-zr7ulsej0w] {
    border-color: var(--primary-color);
    box-shadow: 0 6px 18px color-mix(in srgb, var(--primary-color) 16%, transparent);
}

.review-card__media-frame img[b-zr7ulsej0w] {
    height: 100%;
    object-fit: cover;
    object-position: top center;
    transition: transform 0.25s ease;
    width: 100%;
}

.review-card__media-frame:hover img[b-zr7ulsej0w] {
    transform: scale(1.03);
}

.review-card__media-overlay[b-zr7ulsej0w] {
    align-items: center;
    background: color-mix(in srgb, #000 45%, transparent);
    backdrop-filter: blur(2px);
    display: flex;
    inset: 0;
    justify-content: center;
    opacity: 0;
    position: absolute;
    transition: opacity 0.2s ease;
}

.review-card__media-frame:hover .review-card__media-overlay[b-zr7ulsej0w] {
    opacity: 1;
}

.review-card__zoom-btn[b-zr7ulsej0w] {
    align-items: center;
    background: rgba(255, 255, 255, 0.95);
    border-radius: 20px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.22);
    color: #0f172a;
    display: inline-flex;
    font-size: 0.8rem;
    font-weight: 750;
    gap: 6px;
    padding: 7px 14px;
    transform: translateY(4px);
    transition: transform 0.2s ease;
}

.review-card__media-frame:hover .review-card__zoom-btn[b-zr7ulsej0w] {
    transform: translateY(0);
}

.review-card__media-badge[b-zr7ulsej0w] {
    align-items: center;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 6px;
    color: #fff;
    display: flex;
    font-size: 0.72rem;
    height: 26px;
    justify-content: center;
    position: absolute;
    right: 8px;
    top: 8px;
    transition: opacity 0.2s ease;
    width: 26px;
}

.review-card__media-frame:hover .review-card__media-badge[b-zr7ulsej0w] {
    opacity: 0;
}

/* --- Футер карточки --- */
.review-card__footer[b-zr7ulsej0w] {
    align-items: center;
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    gap: 10px;
    justify-content: space-between;
    margin-top: auto;
    padding: 12px 18px;
}

.review-card__status-toggle[b-zr7ulsej0w] {
    align-items: center;
    display: flex;
}

.review-action-btn[b-zr7ulsej0w] {
    align-items: center;
    border-radius: 9px;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.82rem;
    font-weight: 700;
    gap: 6px;
    min-height: 36px;
    padding: 0 12px;
    transition: all 0.15s ease;
}

.review-action-btn--publish[b-zr7ulsej0w] {
    background: color-mix(in srgb, #10b981 12%, transparent);
    border: 1px solid color-mix(in srgb, #10b981 35%, transparent);
    color: #059669;
}

.review-action-btn--publish:hover[b-zr7ulsej0w] {
    background: #10b981;
    border-color: #10b981;
    box-shadow: 0 4px 12px color-mix(in srgb, #10b981 30%, transparent);
    color: #fff;
}

.review-action-btn--draft[b-zr7ulsej0w] {
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--text-secondary) 25%, transparent);
    color: var(--text-secondary);
}

.review-action-btn--draft:hover[b-zr7ulsej0w] {
    background: color-mix(in srgb, #f59e0b 12%, transparent);
    border-color: color-mix(in srgb, #f59e0b 45%, transparent);
    color: #d97706;
}

.review-card__actions[b-zr7ulsej0w] {
    align-items: center;
    display: flex;
    gap: 6px;
}

.review-icon-link[b-zr7ulsej0w],
.review-icon-button[b-zr7ulsej0w] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 9px;
    color: var(--text-secondary);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.85rem;
    height: 36px;
    justify-content: center;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 36px;
}

.review-icon-link--edit:hover[b-zr7ulsej0w] {
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.review-icon-button--delete[b-zr7ulsej0w] {
    padding: 0;
}

.review-icon-button--delete:hover[b-zr7ulsej0w] {
    background: color-mix(in srgb, #ef4444 12%, transparent);
    border-color: #ef4444;
    color: #dc2626;
}

/* --- Пустое состояние --- */
.reviews-empty[b-zr7ulsej0w] {
    align-items: center;
    background: var(--card-bg);
    border: 1px dashed color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    padding: 60px 24px;
    text-align: center;
}

.reviews-empty__icon[b-zr7ulsej0w] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    border-radius: 50%;
    color: var(--primary-color);
    display: flex;
    font-size: 2.2rem;
    height: 76px;
    justify-content: center;
    margin-bottom: 18px;
    width: 76px;
}

.reviews-empty h3[b-zr7ulsej0w] {
    font-size: 1.35rem;
    font-weight: 750;
    margin: 0 0 8px;
}

.reviews-empty p[b-zr7ulsej0w] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    margin: 0 0 22px;
    max-width: 480px;
}

.reviews-reset-btn[b-zr7ulsej0w] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 25%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-weight: 650;
    gap: 8px;
    min-height: 40px;
    padding: 0 16px;
    transition: all 0.15s ease;
}

.reviews-reset-btn:hover[b-zr7ulsej0w] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

/* --- Пагинация --- */
.reviews-pagination[b-zr7ulsej0w] {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: center;
    margin-top: 10px;
}

.pagination-btn[b-zr7ulsej0w] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.88rem;
    font-weight: 650;
    gap: 6px;
    min-height: 38px;
    padding: 0 14px;
    transition: all 0.15s ease;
}

.pagination-btn:hover:not(:disabled)[b-zr7ulsej0w] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.pagination-btn:disabled[b-zr7ulsej0w] {
    cursor: not-allowed;
    opacity: 0.45;
}

.pagination-pages[b-zr7ulsej0w] {
    display: flex;
    gap: 6px;
}

.pagination-num[b-zr7ulsej0w] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.88rem;
    font-weight: 700;
    height: 38px;
    justify-content: center;
    transition: all 0.15s ease;
    width: 38px;
}

.pagination-num:hover:not(.is-active)[b-zr7ulsej0w] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.pagination-num.is-active[b-zr7ulsej0w] {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: #fff;
}

/* --- Загрузка --- */
.reviews-state[b-zr7ulsej0w] {
    align-items: center;
    background: var(--card-bg);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    padding: 60px 20px;
}

/* --- Модальное окно просмотра скриншота --- */
.image-modal-backdrop[b-zr7ulsej0w] {
    align-items: center;
    animation: fadeIn-b-zr7ulsej0w 0.18s ease;
    background: rgba(15, 23, 42, 0.78);
    backdrop-filter: blur(6px);
    display: flex;
    inset: 0;
    justify-content: center;
    padding: 24px;
    position: fixed;
    z-index: 1000;
}

.image-modal-content[b-zr7ulsej0w] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 18px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.45);
    display: flex;
    flex-direction: column;
    max-height: 90vh;
    max-width: 90vw;
    overflow: hidden;
    position: relative;
}

.image-modal-content img[b-zr7ulsej0w] {
    max-height: calc(90vh - 70px);
    max-width: 100%;
    object-fit: contain;
}

.image-modal-close[b-zr7ulsej0w] {
    align-items: center;
    background: rgba(0, 0, 0, 0.65);
    border: 0;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 1.15rem;
    height: 40px;
    justify-content: center;
    position: absolute;
    right: 12px;
    top: 12px;
    transition: background 0.15s ease, transform 0.15s ease;
    width: 40px;
    z-index: 10;
}

.image-modal-close:hover[b-zr7ulsej0w] {
    background: rgba(0, 0, 0, 0.9);
    transform: scale(1.05);
}

.image-modal-caption[b-zr7ulsej0w] {
    align-items: center;
    background: var(--card-bg);
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    color: var(--text-color);
    display: flex;
    font-size: 0.92rem;
    font-weight: 750;
    gap: 8px;
    justify-content: center;
    padding: 12px 18px;
    text-align: center;
}

.image-modal-caption i[b-zr7ulsej0w] {
    color: var(--primary-color);
}

@keyframes fadeIn-b-zr7ulsej0w {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* ==========================================================================
   Адаптивность (Планшеты и Мобильные телефоны)
   ========================================================================== */

/* --- Планшеты (до 1024px) --- */
@media (max-width: 1024px) {
    .reviews-toolbar[b-zr7ulsej0w] {
        align-items: stretch;
        flex-direction: column;
        gap: 14px;
        padding: 16px;
    }

    .reviews-search[b-zr7ulsej0w] {
        flex: 0 0 auto;
        min-width: 0;
        width: 100%;
    }

    .reviews-filter-group[b-zr7ulsej0w] {
        display: grid;
        gap: 12px;
        grid-template-columns: repeat(3, 1fr);
        width: 100%;
    }

    .reviews-filter-item[b-zr7ulsej0w] {
        min-width: 0;
        width: 100%;
    }

    .reviews-filter-item select[b-zr7ulsej0w] {
        width: 100%;
    }

    .reviews-grid[b-zr7ulsej0w] {
        gap: 18px;
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    }
}

/* --- Мобильные устройства (до 768px) --- */
@media (max-width: 768px) {
    .reviews-header[b-zr7ulsej0w] {
        align-items: stretch;
        flex-direction: column;
        gap: 14px;
        margin-bottom: 18px;
    }

    .reviews-actions[b-zr7ulsej0w] {
        width: 100%;
    }

    .reviews-primary-action[b-zr7ulsej0w] {
        flex: 1 1 100%;
        justify-content: center;
        min-height: 46px;
        width: 100%;
    }

    .reviews-toolbar[b-zr7ulsej0w] {
        border-radius: 14px;
        gap: 12px;
        padding: 14px;
    }

    .reviews-search-box input[b-zr7ulsej0w] {
        min-height: 44px;
    }

    .reviews-filter-group[b-zr7ulsej0w] {
        gap: 10px;
        grid-template-columns: 1fr 1fr;
    }

    .reviews-filter-item:last-child[b-zr7ulsej0w] {
        grid-column: 1 / -1;
    }

    .reviews-filter-item select[b-zr7ulsej0w] {
        min-height: 44px;
    }

    .reviews-grid[b-zr7ulsej0w] {
        gap: 16px;
        grid-template-columns: 1fr;
    }

    .review-card[b-zr7ulsej0w] {
        border-radius: 16px;
    }

    .review-card__header[b-zr7ulsej0w] {
        padding: 14px 14px 10px;
    }

    .review-card__author-section[b-zr7ulsej0w] {
        padding: 0 14px 10px;
    }

    .review-card__body[b-zr7ulsej0w] {
        padding: 0 14px 14px;
    }

    .review-card__media-frame[b-zr7ulsej0w] {
        height: 160px;
    }

    .review-card__footer[b-zr7ulsej0w] {
        padding: 10px 14px;
    }

    .review-action-btn[b-zr7ulsej0w] {
        min-height: 38px;
    }

    .review-icon-link[b-zr7ulsej0w],
    .review-icon-button[b-zr7ulsej0w] {
        height: 38px;
        width: 38px;
    }

    .image-modal-backdrop[b-zr7ulsej0w] {
        padding: 12px;
    }

    .image-modal-content[b-zr7ulsej0w] {
        border-radius: 14px;
        max-height: 92vh;
        max-width: 96vw;
    }

    .image-modal-close[b-zr7ulsej0w] {
        height: 38px;
        right: 8px;
        top: 8px;
        width: 38px;
    }
}

/* --- Узкие мобильные экраны (до 460px) --- */
@media (max-width: 460px) {
    .reviews-filter-group[b-zr7ulsej0w] {
        grid-template-columns: 1fr;
    }

    .reviews-filter-item:last-child[b-zr7ulsej0w] {
        grid-column: auto;
    }

    .review-card__header[b-zr7ulsej0w] {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .review-card__badges[b-zr7ulsej0w] {
        flex: 1 1 auto;
    }

    .review-card__date[b-zr7ulsej0w] {
        margin-left: auto;
    }

    .pagination-btn span[b-zr7ulsej0w] {
        display: none;
    }

    .pagination-btn[b-zr7ulsej0w] {
        padding: 0 12px;
    }
}
/* /Components/Pages/Admin/Settings/GlobalSettings.razor.rz.scp.css */
.settings-page[b-nicsz7ynok] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
    padding-bottom: 60px;
}

/* --- Хедер раздела --- */
.settings-header[b-nicsz7ynok] {
    align-items: flex-end;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.settings-eyebrow[b-nicsz7ynok] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.settings-header h1[b-nicsz7ynok] {
    font-size: clamp(1.8rem, 3vw, 2.45rem);
    font-weight: 800;
    margin: 0 0 6px;
}

.settings-header p[b-nicsz7ynok] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    margin: 0;
    max-width: 680px;
}

.settings-header-actions[b-nicsz7ynok] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.settings-primary-btn[b-nicsz7ynok] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.95rem;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 20px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.settings-primary-btn:hover:not(:disabled)[b-nicsz7ynok] {
    box-shadow: 0 12px 26px color-mix(in srgb, var(--primary-color) 32%, transparent);
    transform: translateY(-1px);
}

.settings-primary-btn:disabled[b-nicsz7ynok] {
    cursor: not-allowed;
    opacity: 0.6;
}

.settings-secondary-btn[b-nicsz7ynok] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--primary-color) 40%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.88rem;
    font-weight: 700;
    gap: 8px;
    min-height: 40px;
    padding: 0 16px;
    transition: all 0.15s ease;
}

.settings-secondary-btn:hover[b-nicsz7ynok] {
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
}

/* --- Сообщение об ошибке --- */
.settings-alert-error[b-nicsz7ynok] {
    align-items: center;
    background: color-mix(in srgb, #ef4444 12%, transparent);
    border: 1px solid color-mix(in srgb, #ef4444 30%, transparent);
    border-radius: 14px;
    color: #ef4444;
    display: flex;
    font-size: 0.92rem;
    gap: 12px;
    margin-bottom: 22px;
    padding: 14px 18px;
}

.settings-alert-error i[b-nicsz7ynok] {
    font-size: 1.2rem;
}

/* --- Сетка карточек --- */
.settings-grid[b-nicsz7ynok] {
    display: grid;
    gap: 24px;
    grid-template-columns: 1fr 1fr;
}

.settings-card--full[b-nicsz7ynok] {
    grid-column: 1 / -1;
}

/* --- Карточка --- */
.settings-card[b-nicsz7ynok] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    padding: 22px;
    transition: border-color 0.15s ease;
}

.settings-card:hover[b-nicsz7ynok] {
    border-color: color-mix(in srgb, var(--primary-color) 25%, transparent);
}

.settings-card__header[b-nicsz7ynok] {
    align-items: flex-start;
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 14px;
}

.settings-card__header i[b-nicsz7ynok] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 36px;
    font-size: 1.1rem;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.telegram-brand-icon[b-nicsz7ynok] {
    background: color-mix(in srgb, #0088cc 14%, transparent) !important;
    color: #0088cc !important;
}

.vk-brand-icon[b-nicsz7ynok] {
    background: color-mix(in srgb, #0077ff 14%, transparent) !important;
    color: #0077ff !important;
}

.nvidia-brand-icon[b-nicsz7ynok] {
    background: color-mix(in srgb, #76b900 15%, transparent) !important;
    color: #4d7c00 !important;
}

body.dark-theme .nvidia-brand-icon[b-nicsz7ynok] {
    background: color-mix(in srgb, #76b900 22%, transparent) !important;
    color: #8be000 !important;
}

.settings-link[b-nicsz7ynok] {
    color: var(--primary-color);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.settings-link:hover[b-nicsz7ynok] {
    color: var(--primary-hover);
}

.settings-card__header h2[b-nicsz7ynok] {
    font-size: 1.15rem;
    font-weight: 750;
    margin: 0 0 3px;
}

.settings-card__header p[b-nicsz7ynok] {
    color: var(--text-secondary);
    font-size: 0.83rem;
    margin: 0;
}

.settings-card__body[b-nicsz7ynok] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
}

.settings-form-stack[b-nicsz7ynok] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.settings-vk-grid[b-nicsz7ynok] {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.settings-field[b-nicsz7ynok] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.settings-field label[b-nicsz7ynok] {
    align-items: center;
    display: flex;
    font-size: 0.88rem;
    font-weight: 650;
    gap: 6px;
}

.required-star[b-nicsz7ynok] {
    color: #ef4444;
    font-weight: 700;
}

.field-hint[b-nicsz7ynok] {
    color: var(--text-secondary);
    font-size: 0.8rem;
    font-weight: 400;
}

.field-tip[b-nicsz7ynok] {
    color: var(--text-secondary);
    font-size: 0.78rem;
}

.settings-card-action[b-nicsz7ynok] {
    display: flex;
    justify-content: flex-start;
    margin-top: 4px;
}

.settings-info-box[b-nicsz7ynok] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 10px;
    color: var(--text-secondary);
    display: flex;
    font-size: 0.82rem;
    gap: 10px;
    line-height: 1.4;
    padding: 12px 14px;
}

.settings-info-box i[b-nicsz7ynok] {
    color: #0088cc;
    font-size: 1rem;
}

/* --- Адаптивность --- */
@media (max-width: 900px) {
    .settings-grid[b-nicsz7ynok] {
        grid-template-columns: 1fr;
    }

    .settings-header[b-nicsz7ynok] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .settings-header-actions[b-nicsz7ynok] {
        width: 100%;
    }

    .settings-primary-btn[b-nicsz7ynok] {
        justify-content: center;
        width: 100%;
    }
}
/* /Components/Pages/Admin/SystemHealth.razor.rz.scp.css */
.health-page[b-ykcofibg6t] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
    padding-bottom: 60px;
}

.health-disk-warning[b-ykcofibg6t] {
    background: #fff3df;
    border: 1px solid #e5b458;
    border-radius: 12px;
    color: #654515;
    margin-bottom: 20px;
    padding: 12px 16px;
}

/* --- Хедер раздела --- */
.health-header[b-ykcofibg6t] {
    align-items: flex-end;
    display: flex;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.health-eyebrow[b-ykcofibg6t] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.health-header h1[b-ykcofibg6t] {
    font-size: clamp(1.8rem, 3vw, 2.45rem);
    font-weight: 800;
    margin: 0 0 6px;
}

.health-header p[b-ykcofibg6t] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    margin: 0;
    max-width: 680px;
}

.health-header-actions[b-ykcofibg6t] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.health-action-btn[b-ykcofibg6t] {
    align-items: center;
    border-radius: 12px;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 750;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.health-action-btn--primary[b-ykcofibg6t] {
    background: linear-gradient(135deg, #10b981, #059669);
    border: 0;
    box-shadow: 0 10px 22px color-mix(in srgb, #10b981 25%, transparent);
    color: #fff;
}

.health-action-btn--primary:hover[b-ykcofibg6t] {
    box-shadow: 0 12px 26px color-mix(in srgb, #10b981 35%, transparent);
    transform: translateY(-1px);
}

.health-action-btn--secondary[b-ykcofibg6t] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    color: var(--text-color);
}

.health-action-btn--secondary:hover[b-ykcofibg6t] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
}

/* --- Карточки метрик (4 шт) --- */
.health-metrics-grid[b-ykcofibg6t] {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 24px;
}

.health-metric-card[b-ykcofibg6t] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    gap: 14px;
    padding: 18px 20px;
    transition: transform 0.15s ease, border-color 0.15s ease;
}

.health-metric-card:hover[b-ykcofibg6t] {
    transform: translateY(-2px);
}

.health-metric-card__icon[b-ykcofibg6t] {
    align-items: center;
    border-radius: 12px;
    display: flex;
    flex: 0 0 46px;
    font-size: 1.25rem;
    height: 46px;
    justify-content: center;
    width: 46px;
}

.health-metric-card--primary .health-metric-card__icon[b-ykcofibg6t] {
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    color: var(--primary-color);
}
.health-metric-card--primary:hover[b-ykcofibg6t] {
    border-color: var(--primary-color);
}

.health-metric-card--warning .health-metric-card__icon[b-ykcofibg6t] {
    background: color-mix(in srgb, #f59e0b 14%, transparent);
    color: #f59e0b;
}
.health-metric-card--warning:hover[b-ykcofibg6t] {
    border-color: #f59e0b;
}

.health-metric-card--info .health-metric-card__icon[b-ykcofibg6t] {
    background: color-mix(in srgb, #3b82f6 14%, transparent);
    color: #3b82f6;
}
.health-metric-card--info:hover[b-ykcofibg6t] {
    border-color: #3b82f6;
}

.health-metric-card--success .health-metric-card__icon[b-ykcofibg6t] {
    background: color-mix(in srgb, #10b981 14%, transparent);
    color: #10b981;
}
.health-metric-card--success:hover[b-ykcofibg6t] {
    border-color: #10b981;
}

.health-metric-card__content[b-ykcofibg6t] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.health-metric-label[b-ykcofibg6t] {
    color: var(--text-secondary);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.health-metric-value[b-ykcofibg6t] {
    color: var(--text-color);
    font-size: 1.55rem;
    font-weight: 850;
    line-height: 1.15;
}

.health-metric-sub[b-ykcofibg6t] {
    color: var(--text-secondary);
    font-size: 0.78rem;
}

/* --- Сетка графиков --- */
.health-charts-grid[b-ykcofibg6t] {
    display: grid;
    gap: 24px;
    grid-template-columns: 1fr 380px;
    margin-bottom: 24px;
}

.health-card[b-ykcofibg6t] {
    min-width: 0;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    padding: 22px;
    transition: border-color 0.15s ease;
}

.health-card--table[b-ykcofibg6t] {
    padding: 0;
}

.health-card--table .health-card__header[b-ykcofibg6t] {
    margin-bottom: 0;
    padding: 20px 22px;
}

.health-card:hover[b-ykcofibg6t] {
    border-color: color-mix(in srgb, var(--primary-color) 25%, transparent);
}

.health-card__header[b-ykcofibg6t] {
    align-items: flex-start;
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    display: flex;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 14px;
}

.health-card__header--between[b-ykcofibg6t] {
    align-items: center;
    justify-content: space-between;
}

.health-card__header-left[b-ykcofibg6t] {
    align-items: center;
    display: flex;
    gap: 12px;
}

.health-card__header i[b-ykcofibg6t] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, transparent);
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    flex: 0 0 36px;
    font-size: 1.1rem;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.health-card__header h2[b-ykcofibg6t] {
    font-size: 1.15rem;
    font-weight: 750;
    margin: 0 0 3px;
}

.health-card__header p[b-ykcofibg6t] {
    color: var(--text-secondary);
    font-size: 0.83rem;
    margin: 0;
}

.health-card__body[b-ykcofibg6t] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
}

.health-chart-empty[b-ykcofibg6t] {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: 240px;
    justify-content: center;
}

.health-chart-empty i[b-ykcofibg6t] {
    font-size: 2.5rem;
    opacity: 0.4;
}

/* --- Инструменты таблицы логов --- */
.health-table-actions[b-ykcofibg6t] {
    align-items: center;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.health-btn-tool[b-ykcofibg6t] {
    align-items: center;
    border-radius: 8px;
    cursor: pointer;
    display: inline-flex;
    font-size: 0.82rem;
    font-weight: 700;
    gap: 6px;
    min-height: 34px;
    padding: 0 12px;
    transition: all 0.15s ease;
}

.health-btn-tool--export[b-ykcofibg6t] {
    background: color-mix(in srgb, #3b82f6 12%, transparent);
    border: 1px solid color-mix(in srgb, #3b82f6 30%, transparent);
    color: #2563eb;
}

.health-btn-tool--export:hover[b-ykcofibg6t] {
    background: color-mix(in srgb, #3b82f6 20%, transparent);
}

.health-btn-tool--danger[b-ykcofibg6t] {
    background: color-mix(in srgb, #ef4444 12%, transparent);
    border: 1px solid color-mix(in srgb, #ef4444 30%, transparent);
    color: #ef4444;
}

.health-btn-tool--danger:hover[b-ykcofibg6t] {
    background: color-mix(in srgb, #ef4444 20%, transparent);
    color: #dc2626;
}

/* --- Таблица логов --- */
.health-table-wrapper[b-ykcofibg6t] {
    overflow-x: auto;
    width: 100%;
}

[b-ykcofibg6t] .health-datagrid {
    background: transparent;
    border: none;
}

[b-ykcofibg6t] .health-datagrid .rz-grid-table {
    border-collapse: collapse;
    min-width: 800px;
}

[b-ykcofibg6t] .health-datagrid thead th {
    background: var(--bg-secondary) !important;
    color: var(--text-secondary) !important;
    font-size: 0.82rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.03em !important;
    padding: 12px 16px !important;
    text-transform: uppercase !important;
}

[b-ykcofibg6t] .health-datagrid tbody tr {
    transition: background 0.15s ease;
}

[b-ykcofibg6t] .health-datagrid tbody tr:hover {
    background: color-mix(in srgb, var(--primary-color) 4%, transparent) !important;
}

[b-ykcofibg6t] .health-datagrid td {
    background: var(--card-bg) !important;
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent) !important;
    color: var(--text-color) !important;
    font-size: 0.9rem !important;
    padding: 12px 16px !important;
}

[b-ykcofibg6t] .health-datagrid .rz-column-title,
[b-ykcofibg6t] .health-datagrid .rz-column-title-content {
    color: var(--text-secondary) !important;
}

[b-ykcofibg6t] .health-datagrid .rz-cell-data,
.log-message[b-ykcofibg6t],
.log-source[b-ykcofibg6t] {
    color: var(--text-color) !important;
}

[b-ykcofibg6t] .health-card .rz-chart text {
    fill: var(--text-secondary);
}

.log-time[b-ykcofibg6t] {
    color: var(--text-secondary);
    font-family: monospace;
    font-size: 0.82rem;
}

.log-badge[b-ykcofibg6t] {
    align-items: center;
    border-radius: 20px;
    display: inline-flex;
    font-size: 0.76rem;
    font-weight: 750;
    gap: 5px;
    padding: 3px 9px;
}

.log-badge--error[b-ykcofibg6t] {
    background: color-mix(in srgb, #ef4444 14%, transparent);
    color: #dc2626;
}

.log-badge--warning[b-ykcofibg6t] {
    background: color-mix(in srgb, #f59e0b 14%, transparent);
    color: #d97706;
}

.log-badge--info[b-ykcofibg6t] {
    background: color-mix(in srgb, #3b82f6 14%, transparent);
    color: #2563eb;
}

.log-source[b-ykcofibg6t] {
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 6px;
    display: inline-block;
    font-family: monospace;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 2px 8px;
}

.log-message[b-ykcofibg6t] {
    line-height: 1.45;
    word-break: break-word;
}

.log-details-btn[b-ykcofibg6t] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 8px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 700;
    gap: 5px;
    padding: 4px 10px;
    transition: all 0.15s ease;
}

.log-details-btn:hover[b-ykcofibg6t] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

/* --- Модальное окно StackTrace --- */
.stack-modal-backdrop[b-ykcofibg6t] {
    align-items: center;
    animation: fadeIn-b-ykcofibg6t 0.18s ease;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(4px);
    display: flex;
    inset: 0;
    justify-content: center;
    padding: 20px;
    position: fixed;
    z-index: 1000;
}

.stack-modal-content[b-ykcofibg6t] {
    background: var(--card-bg);
    border-radius: 18px;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.35);
    display: flex;
    flex-direction: column;
    max-height: 85vh;
    max-width: 820px;
    overflow: hidden;
    width: 100%;
}

.stack-modal-header[b-ykcofibg6t] {
    align-items: center;
    border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    display: flex;
    justify-content: space-between;
    padding: 16px 20px;
}

.stack-modal-title[b-ykcofibg6t] {
    align-items: center;
    display: flex;
    gap: 10px;
}

.stack-modal-title i[b-ykcofibg6t] {
    color: #ef4444;
    font-size: 1.25rem;
}

.stack-modal-title h3[b-ykcofibg6t] {
    font-size: 1.1rem;
    font-weight: 750;
    margin: 0;
}

.stack-modal-close[b-ykcofibg6t] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 50%;
    color: var(--text-secondary);
    cursor: pointer;
    display: flex;
    font-size: 1.1rem;
    height: 32px;
    justify-content: center;
    transition: all 0.15s ease;
    width: 32px;
}

.stack-modal-close:hover[b-ykcofibg6t] {
    background: color-mix(in srgb, #ef4444 12%, transparent);
    color: #ef4444;
}

.stack-modal-body[b-ykcofibg6t] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    overflow-y: auto;
    padding: 20px;
}

.stack-meta-row[b-ykcofibg6t] {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.stack-meta-item[b-ykcofibg6t] {
    align-items: center;
    display: flex;
    font-size: 0.88rem;
    gap: 8px;
}

.stack-meta-label[b-ykcofibg6t] {
    color: var(--text-secondary);
    font-weight: 600;
}

.stack-message-box[b-ykcofibg6t] {
    background: color-mix(in srgb, #ef4444 8%, transparent);
    border-left: 4px solid #ef4444;
    border-radius: 8px;
    padding: 12px 16px;
}

.stack-message-box strong[b-ykcofibg6t] {
    color: #dc2626;
    display: block;
    font-size: 0.85rem;
    margin-bottom: 4px;
}

.stack-message-box p[b-ykcofibg6t] {
    font-size: 0.92rem;
    line-height: 1.45;
    margin: 0;
}

.stack-trace-section[b-ykcofibg6t] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.stack-trace-header[b-ykcofibg6t] {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.stack-trace-header span[b-ykcofibg6t] {
    color: var(--text-secondary);
    font-size: 0.84rem;
    font-weight: 700;
}

.stack-copy-btn[b-ykcofibg6t] {
    align-items: center;
    background: var(--bg-secondary);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 6px;
    color: var(--text-secondary);
    cursor: pointer;
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 650;
    gap: 5px;
    padding: 4px 10px;
    transition: all 0.15s ease;
}

.stack-copy-btn:hover[b-ykcofibg6t] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.stack-trace-code[b-ykcofibg6t] {
    background: #18181b;
    border-radius: 10px;
    color: #e4e4e7;
    font-family: Consolas, Monaco, "Courier New", monospace;
    font-size: 0.82rem;
    line-height: 1.5;
    margin: 0;
    max-height: 340px;
    overflow-y: auto;
    padding: 14px 16px;
    white-space: pre-wrap;
    word-break: break-all;
}

@keyframes fadeIn-b-ykcofibg6t {
    from { opacity: 0; }
    to { opacity: 1; }
}

.health-log-filters[b-ykcofibg6t] { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; padding: 16px; align-items: end; }
.health-log-filters label[b-ykcofibg6t] { display: flex; flex-direction: column; gap: 6px; font-size: .85rem; min-width: 0; }
.health-log-filters input[b-ykcofibg6t], .health-log-filters select[b-ykcofibg6t] { width: 100%; min-width: 0; padding: 9px; border: 1px solid var(--border-color, #dbe2ef); border-radius: 8px; background: var(--card-bg); color: var(--text-color); }
.log-trace[b-ykcofibg6t] { display: block; overflow-wrap: anywhere; font-family: monospace; color: var(--text-secondary); }
@media (max-width: 1100px) { .health-log-filters[b-ykcofibg6t] { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .health-log-filters[b-ykcofibg6t] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 359px) { .health-log-filters[b-ykcofibg6t] { grid-template-columns: minmax(0, 1fr); } }

/* --- Адаптивность --- */
@media (max-width: 992px) {
    .health-charts-grid[b-ykcofibg6t] {
        grid-template-columns: 1fr;
    }

    .health-header[b-ykcofibg6t] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .health-header-actions[b-ykcofibg6t] {
        width: 100%;
        flex-wrap: wrap;
    }

    .health-header-actions button[b-ykcofibg6t] {
        flex: 1;
        justify-content: center;
    }
}

@media (max-width: 640px) {
    .health-card__header--between[b-ykcofibg6t] {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .health-table-actions[b-ykcofibg6t] {
        width: 100%;
    }

    .health-table-actions button[b-ykcofibg6t] {
        flex: 1;
        justify-content: center;
    }
}

/* Event journal: full timestamps and wrapping content at every viewport. */
.health-table-actions .health-btn-tool[b-ykcofibg6t],
.health-table-actions .health-btn-tool:hover[b-ykcofibg6t],
.health-table-actions .health-btn-tool:focus-visible[b-ykcofibg6t] { background: transparent; }
.health-table-actions .health-btn-tool i[b-ykcofibg6t] { background: transparent; box-shadow: none; padding: 0; width: auto; height: auto; }
.health-btn-tool:focus-visible[b-ykcofibg6t], .log-details-btn:focus-visible[b-ykcofibg6t] { outline: 2px solid var(--primary-color); outline-offset: 3px; }
.health-btn-tool:disabled[b-ykcofibg6t] { opacity: .45; cursor: default; }
.health-event-list[b-ykcofibg6t] { min-width: 0; padding: 0 20px; }
.health-event[b-ykcofibg6t] { display: grid; grid-template-columns: 120px minmax(0, 1fr) auto; gap: 20px; align-items: start; border-top: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent); padding: 20px 0; min-width: 0; }
.health-event:hover[b-ykcofibg6t] { background: color-mix(in srgb, var(--card-bg) 96%, var(--primary-color)); }
.health-event .log-time[b-ykcofibg6t] { display: grid; gap: 4px; white-space: nowrap; font-size: .86rem; line-height: 1.45; font-variant-numeric: tabular-nums; color: var(--text-color); }
.health-event .log-time strong[b-ykcofibg6t] { font-size: 1rem; }
.health-event__body[b-ykcofibg6t] { min-width: 0; overflow-wrap: anywhere; }
.health-event__labels[b-ykcofibg6t] { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 9px; }
.health-event .log-source[b-ykcofibg6t] { white-space: normal; overflow-wrap: anywhere; max-width: 100%; }
.log-event-name[b-ykcofibg6t] { margin: 0 0 6px; font-size: .96rem; color: var(--text-color); line-height: 1.5; overflow-wrap: anywhere; }
.health-event .log-message[b-ykcofibg6t] { white-space: pre-wrap; overflow-wrap: anywhere; font-size: .9rem; line-height: 1.65; color: var(--text-color); }
.log-request[b-ykcofibg6t] { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .8rem; color: var(--text-secondary); margin-top: 8px; overflow-wrap: anywhere; }
.health-event .log-details-btn[b-ykcofibg6t] { margin-top: 0; background: transparent; max-width: 100%; min-height: 36px; }
.health-log-pagination[b-ykcofibg6t] { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 14px; padding: 16px 20px; border-top: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent); font-size: .84rem; color: var(--text-secondary); }
.health-log-pagination > div[b-ykcofibg6t] { display: flex; gap: 8px; }
.health-log-pagination button[b-ykcofibg6t] { border: 1px solid color-mix(in srgb, var(--text-secondary) 25%, transparent); background: transparent; color: var(--text-color); }
.health-log-empty[b-ykcofibg6t], .health-log-error[b-ykcofibg6t] { padding: 20px 0; color: var(--text-secondary); }
.health-log-error[b-ykcofibg6t] { color: #dc2626; }
.log-context[b-ykcofibg6t] { display: grid; grid-template-columns: minmax(100px, 150px) minmax(0, 1fr); gap: 10px 18px; margin: 0; font-size: .86rem; }
.log-context dt[b-ykcofibg6t] { color: var(--text-secondary); }
.log-context dd[b-ykcofibg6t] { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.stack-modal-body[b-ykcofibg6t] { min-width: 0; overflow-x: hidden; }
.stack-message-box p[b-ykcofibg6t] { white-space: pre-wrap; overflow-wrap: anywhere; }
.stack-trace-code[b-ykcofibg6t] { overflow-wrap: anywhere; word-break: normal; }
@media (max-width: 760px) {
    .health-event[b-ykcofibg6t] { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 18px 0; }
    .health-event .log-time[b-ykcofibg6t] { display: flex; flex-wrap: wrap; gap: 10px; align-items: baseline; }
    .health-event .log-details-btn[b-ykcofibg6t] { justify-self: start; }
    .health-event-list[b-ykcofibg6t] { padding: 0 16px; }
}
@media (max-width: 480px) {
    .log-context[b-ykcofibg6t] { grid-template-columns: minmax(0, 1fr); gap: 3px; }
    .log-context dd[b-ykcofibg6t] { margin-bottom: 10px; }
    .stack-modal-header[b-ykcofibg6t], .stack-modal-body[b-ykcofibg6t] { padding: 14px; }
    .stack-modal-title[b-ykcofibg6t] { min-width: 0; }
    .stack-modal-close[b-ykcofibg6t] { flex: 0 0 32px; }
    .stack-meta-row[b-ykcofibg6t] { flex-direction: column; gap: 10px; }
    .stack-trace-header[b-ykcofibg6t] { flex-wrap: wrap; gap: 8px; }
}
.stack-message-box[b-ykcofibg6t] { background: var(--bg-secondary); border-color: color-mix(in srgb, var(--text-secondary) 20%, transparent); }
.stack-message-box strong[b-ykcofibg6t] { color: var(--text-color); }
.stack-modal-title i[b-ykcofibg6t] { color: var(--primary-color); }
.stack-modal-content:focus[b-ykcofibg6t] { outline: none; }
/* /Components/Pages/Admin/UploadTrash.razor.rz.scp.css */
.upload-trash[b-a3yxiuw5e4] { max-width: 1200px; margin: 0 auto; min-width: 0; color: var(--text-color, #293d50); }
.trash-heading[b-a3yxiuw5e4] { position: static; height: auto; width: auto; padding: 0; box-shadow: none; background: transparent; display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.trash-heading > div[b-a3yxiuw5e4] { min-width: 0; }
h1[b-a3yxiuw5e4] { font-size: clamp(1.6rem, 3vw, 2.4rem); margin: 8px 0; }
p[b-a3yxiuw5e4] { color: var(--text-secondary, #687b8f); line-height: 1.6; margin: 8px 0; }
.trash-eyebrow[b-a3yxiuw5e4] { color: var(--trash-link, var(--primary-color, #3265ef)); text-transform: uppercase; font-weight: 700; letter-spacing: .1em; font-size: .8rem; }
.trash-button[b-a3yxiuw5e4] { border: 1px solid var(--trash-border, #d8e1ed); border-radius: 10px; padding: 11px 16px; background: transparent; color: inherit; font: inherit; font-weight: 600; cursor: pointer; flex-shrink: 0; }
.trash-button:hover:not(:disabled)[b-a3yxiuw5e4] { border-color: var(--trash-link, var(--primary-color, #3265ef)); color: var(--trash-link, var(--primary-color, #3265ef)); }
.trash-button:disabled[b-a3yxiuw5e4] { opacity: .5; cursor: default; }
.trash-button:focus-visible[b-a3yxiuw5e4], input:focus-visible[b-a3yxiuw5e4], select:focus-visible[b-a3yxiuw5e4] { outline: 3px solid #8dafff; outline-offset: 3px; }
.trash-stats[b-a3yxiuw5e4] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 24px; }
.trash-stats > div[b-a3yxiuw5e4], .trash-policy[b-a3yxiuw5e4], .trash-file[b-a3yxiuw5e4], .trash-empty[b-a3yxiuw5e4] { border: 1px solid var(--trash-border, #d8e1ed); background: var(--card-bg, #fff); border-radius: 16px; padding: 20px; }
.trash-stats strong[b-a3yxiuw5e4] { display: block; font-size: 1.8rem; margin-bottom: 4px; }
.trash-stats span[b-a3yxiuw5e4] { font-size: .9rem; color: var(--text-secondary, #687b8f); }
.trash-policy[b-a3yxiuw5e4] { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.trash-policy p[b-a3yxiuw5e4] { flex-basis: 100%; font-size: .9rem; }
select[b-a3yxiuw5e4], input[b-a3yxiuw5e4] { min-width: 0; border: 1px solid var(--trash-border, #d8e1ed); border-radius: 10px; padding: 11px; background: var(--card-bg, #fff); color: inherit; font: inherit; }
.trash-search[b-a3yxiuw5e4] { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 24px; align-items: center; }
.trash-search label[b-a3yxiuw5e4] { flex-basis: 100%; font-weight: 600; }
.trash-search input[b-a3yxiuw5e4] { flex: 1; }
.trash-explanation[b-a3yxiuw5e4] { margin: 16px 0 24px; font-size: .9rem; }
.trash-files[b-a3yxiuw5e4] { display: grid; gap: 12px; }
.trash-file[b-a3yxiuw5e4] { display: flex; gap: 16px; align-items: center; }
.trash-file-content[b-a3yxiuw5e4] { flex: 1; min-width: 0; }
.trash-file h2[b-a3yxiuw5e4] { margin: 0 0 6px; font-size: 1rem; overflow-wrap: anywhere; }
.trash-file-icon[b-a3yxiuw5e4] { color: var(--trash-link, var(--primary-color, #3265ef)); font-size: 1.5rem; }
.trash-thumbnail[b-a3yxiuw5e4] { width: 60px; height: 60px; object-fit: cover; border-radius: 8px; background: var(--bg-secondary); flex-shrink: 0; }
.trash-path[b-a3yxiuw5e4] { display: block; font-size: .85rem; color: var(--trash-link, var(--primary-color, #3265ef)); overflow-wrap: anywhere; }
.trash-file-meta[b-a3yxiuw5e4] { display: flex; gap: 12px; flex-wrap: wrap; font-size: .8rem; color: var(--text-secondary, #687b8f); margin: 10px 0; }
.trash-deadline[b-a3yxiuw5e4], .trash-protected[b-a3yxiuw5e4] { display: inline-block; font-size: .85rem; padding: 5px 8px; border-radius: 6px; }
.trash-deadline[b-a3yxiuw5e4] { background: #e99a131a; color: var(--trash-warning, #a96800); }
.trash-protected[b-a3yxiuw5e4] { background: #16966c1a; color: var(--trash-success, #16845e); }
.trash-restore[b-a3yxiuw5e4] { color: var(--trash-success, #16845e); }.trash-danger[b-a3yxiuw5e4] { color: #c65335; }
.trash-error[b-a3yxiuw5e4], .trash-notice[b-a3yxiuw5e4] { padding: 16px; border-radius: 12px; margin-bottom: 16px; overflow-wrap: anywhere; }
.trash-error[b-a3yxiuw5e4] { background: #d548481a; color: #be4242; }.trash-notice[b-a3yxiuw5e4] { background: #16966c1a; color: var(--trash-success, #16845e); }
.trash-empty[b-a3yxiuw5e4] { text-align: center; margin: 20px 0; }.trash-empty i[b-a3yxiuw5e4] { color: var(--trash-success, #16845e); font-size: 2rem; }
.trash-pagination[b-a3yxiuw5e4] { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: 24px; flex-wrap: wrap; }
@media (max-width: 767px) {
    .trash-heading[b-a3yxiuw5e4] { align-items: stretch; flex-direction: column; gap: 12px; }
    .trash-stats[b-a3yxiuw5e4] { grid-template-columns: 1fr; gap: 8px; }
    .trash-stats > div[b-a3yxiuw5e4] { padding: 12px 16px; }.trash-stats strong[b-a3yxiuw5e4] { font-size: 1.4rem; }
    .trash-file[b-a3yxiuw5e4] { flex-wrap: wrap; padding: 16px; }.trash-file > button[b-a3yxiuw5e4] { width: 100%; }
    .trash-file-icon[b-a3yxiuw5e4] { display: none; }.trash-policy[b-a3yxiuw5e4] { padding: 16px; }
    .trash-pagination[b-a3yxiuw5e4] { gap: 8px; font-size: .9rem; }
}
/* /Components/Pages/Admin/VkSync.razor.rz.scp.css */
.vksync-page[b-auwlktee5k] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
    padding-bottom: 40px;
}

.social-tabs[b-auwlktee5k] { display: flex; gap: 12px; margin: 0 0 20px; }
.social-form[b-auwlktee5k] { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 18px; margin: 20px 0; }
.social-form label[b-auwlktee5k] { display: block; font-weight: 700; margin-bottom: 8px; }
.social-form select[b-auwlktee5k] { width: 100%; min-width: 0; padding: 12px; border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent); border-radius: 10px; background: var(--bg-secondary); color: var(--text-color); }
.social-preview-header[b-auwlktee5k] { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.social-previews[b-auwlktee5k] { display: grid; gap: 12px; max-height: 500px; overflow: auto; margin: 16px 0; }
.social-preview[b-auwlktee5k] { padding: 18px; background: var(--bg-secondary); border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent); border-radius: 12px; min-width: 0; }
.social-preview div[b-auwlktee5k] { white-space: pre-wrap; overflow-wrap: anywhere; }
.social-preview a[b-auwlktee5k], .vksync-history-card a[b-auwlktee5k] { color: var(--text-color); text-decoration: underline; text-underline-offset: 3px; }
.social-preview small[b-auwlktee5k] { display: block; margin-bottom: 12px; color: var(--text-secondary); }
.social-hint[b-auwlktee5k] { color: var(--text-secondary); line-height: 1.65; margin: 12px 0; }
.social-publish h2[b-auwlktee5k], .vksync-action-card h2[b-auwlktee5k] { margin-top: 0; }
.social-tabs button:disabled[b-auwlktee5k] { opacity: .65; }
@media (max-width: 768px) { .social-form[b-auwlktee5k] { grid-template-columns: minmax(0, 1fr); } .social-preview[b-auwlktee5k] { padding: 12px; } }

/* --- Заголовок страницы --- */
.vksync-header[b-auwlktee5k] {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.vksync-header__main[b-auwlktee5k] {
    flex: 1 1 320px;
}

.vksync-eyebrow[b-auwlktee5k] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.vksync-title-row[b-auwlktee5k] {
    align-items: center;
    display: flex;
    gap: 12px;
}

.vksync-back-button[b-auwlktee5k] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    display: inline-flex;
    height: 38px;
    justify-content: center;
    text-decoration: none;
    transition: all 0.15s ease;
    width: 38px;
}

.vksync-back-button:hover[b-auwlktee5k] {
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
    transform: translateX(-2px);
}

.vksync-header h1[b-auwlktee5k] {
    font-size: clamp(1.6rem, 2.8vw, 2.2rem);
    font-weight: 800;
    margin: 0;
}

.vksync-description[b-auwlktee5k] {
    color: var(--text-secondary);
    font-size: 0.95rem;
    line-height: 1.45;
    margin: 8px 0 0;
    max-width: 720px;
}

.vksync-header__actions[b-auwlktee5k] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.vksync-secondary-action[b-auwlktee5k] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 12px;
    color: var(--text-color);
    display: inline-flex;
    font-size: 0.9rem;
    font-weight: 700;
    gap: 8px;
    min-height: 42px;
    padding: 0 16px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.vksync-secondary-action:hover[b-auwlktee5k] {
    background: color-mix(in srgb, var(--primary-color) 6%, var(--card-bg));
    border-color: var(--primary-color);
    color: var(--primary-color);
    transform: translateY(-1px);
}

/* --- Загрузка --- */
.vksync-state[b-auwlktee5k] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 16px;
    color: var(--text-secondary);
    display: flex;
    font-size: 1rem;
    font-weight: 600;
    gap: 14px;
    justify-content: center;
    padding: 48px 24px;
}

/* --- Статус подключения (Alert / Card) --- */
.vksync-alert[b-auwlktee5k] {
    background: var(--card-bg);
    border-radius: 18px;
    box-shadow: var(--shadow-sm);
    display: flex;
    gap: 16px;
    margin-bottom: 22px;
    padding: 20px 24px;
}

.vksync-alert--warning[b-auwlktee5k] {
    background: color-mix(in srgb, var(--rz-warning) 8%, var(--card-bg));
    border: 1.5px solid color-mix(in srgb, var(--rz-warning) 35%, transparent);
}

.vksync-alert__icon[b-auwlktee5k] {
    align-items: center;
    background: color-mix(in srgb, var(--rz-warning) 18%, transparent);
    border-radius: 12px;
    color: var(--rz-warning);
    display: flex;
    flex-shrink: 0;
    font-size: 1.4rem;
    height: 44px;
    justify-content: center;
    width: 44px;
}

.vksync-alert__content h3[b-auwlktee5k] {
    font-size: 1.15rem;
    font-weight: 800;
    margin: 0 0 6px;
}

.vksync-alert__content p[b-auwlktee5k] {
    color: var(--text-secondary);
    font-size: 0.92rem;
    line-height: 1.45;
    margin: 0 0 14px;
}

.vksync-alert__btn[b-auwlktee5k] {
    align-items: center;
    background: linear-gradient(135deg, #0077ff, #0056cc);
    border-radius: 10px;
    color: #fff !important;
    display: inline-flex;
    font-size: 0.88rem;
    font-weight: 750;
    gap: 8px;
    min-height: 38px;
    padding: 0 16px;
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.vksync-alert__btn:hover[b-auwlktee5k] {
    box-shadow: 0 6px 16px rgba(0, 119, 255, 0.3);
    transform: translateY(-1px);
}

.vksync-status-card[b-auwlktee5k] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-left: 4px solid #0077ff;
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 22px;
    padding: 16px 20px;
}

.vksync-status-card__left[b-auwlktee5k] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.vksync-status-card__badge[b-auwlktee5k] {
    align-items: center;
    background: color-mix(in srgb, #0077ff 12%, transparent);
    border-radius: 20px;
    color: #0077ff;
    display: inline-flex;
    font-size: 0.84rem;
    font-weight: 800;
    gap: 7px;
    padding: 5px 12px;
}

.vksync-status-card__domain[b-auwlktee5k] {
    align-items: center;
    display: flex;
    gap: 6px;
}

.vksync-status-card__domain-label[b-auwlktee5k] {
    color: var(--text-secondary);
    font-size: 0.88rem;
    font-weight: 600;
}

.vksync-status-card__domain-link[b-auwlktee5k] {
    align-items: center;
    color: #0077ff;
    display: inline-flex;
    font-size: 0.92rem;
    font-weight: 750;
    gap: 5px;
    text-decoration: none;
}

.vksync-status-card__domain-link:hover[b-auwlktee5k] {
    text-decoration: underline;
}

.vksync-status-card__right[b-auwlktee5k] {
    align-items: center;
    display: flex;
    gap: 12px;
}

.vksync-pill[b-auwlktee5k] {
    align-items: center;
    border-radius: 20px;
    display: inline-flex;
    font-size: 0.82rem;
    font-weight: 750;
    gap: 6px;
    padding: 4px 11px;
}

.vksync-pill--success[b-auwlktee5k] {
    background: color-mix(in srgb, var(--rz-success) 12%, transparent);
    color: var(--rz-success);
}

.vksync-settings-link[b-auwlktee5k] {
    align-items: center;
    color: var(--text-secondary);
    display: inline-flex;
    font-size: 0.85rem;
    font-weight: 700;
    gap: 6px;
    text-decoration: none;
    transition: color 0.15s ease;
}

.vksync-settings-link:hover[b-auwlktee5k] {
    color: var(--primary-color);
}

/* --- Карточки метрик --- */
.vksync-metrics[b-auwlktee5k] {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 22px;
}

.vksync-metric-card[b-auwlktee5k] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 16px 18px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.vksync-metric-card:hover[b-auwlktee5k] {
    box-shadow: 0 8px 20px rgba(0,0,0,0.06);
    transform: translateY(-2px);
}

.vksync-metric-card__label[b-auwlktee5k] {
    color: var(--text-secondary);
    font-size: .76rem;
    font-weight: 750;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.vksync-metric-card__value[b-auwlktee5k] {
    color: var(--text-color);
    font-size: 1.85rem;
    font-weight: 850;
    line-height: 1.15;
}

.vksync-metric-card__value--warning[b-auwlktee5k] {
    color: var(--rz-warning);
}

.vksync-metric-card__value--success[b-auwlktee5k] {
    color: var(--rz-success);
}

.vksync-metric-card__hint[b-auwlktee5k] {
    color: var(--text-secondary);
    font-size: .78rem;
}

/* --- Главная панель запуска импорта --- */
.vksync-action-card[b-auwlktee5k] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent);
    border-radius: 20px;
    box-shadow: var(--shadow-sm);
    margin-bottom: 26px;
    padding: 24px;
}

.vksync-action-card__header[b-auwlktee5k] {
    margin-bottom: 20px;
}

.vksync-action-card__title-group[b-auwlktee5k] {
    align-items: center;
    display: flex;
    gap: 14px;
}

.vksync-action-card__icon[b-auwlktee5k] {
    align-items: center;
    background: color-mix(in srgb, #0077ff 12%, transparent);
    border-radius: 12px;
    color: #0077ff;
    display: inline-flex;
    font-size: 1.25rem;
    height: 44px;
    justify-content: center;
    width: 44px;
}

.vksync-action-card__title-group h2[b-auwlktee5k] {
    font-size: 1.25rem;
    font-weight: 800;
    margin: 0;
}

.vksync-action-card__title-group p[b-auwlktee5k] {
    color: var(--text-secondary);
    font-size: 0.9rem;
    margin: 4px 0 0;
}

/* --- Информационные шаги --- */
.vksync-steps[b-auwlktee5k] {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    margin-bottom: 24px;
}

.vksync-step[b-auwlktee5k] {
    background: color-mix(in srgb, var(--card-bg) 96%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 14px;
    display: flex;
    gap: 12px;
    padding: 14px;
}

.vksync-step__num[b-auwlktee5k] {
    align-items: center;
    background: color-mix(in srgb, #0077ff 14%, transparent);
    border-radius: 8px;
    color: #0077ff;
    display: flex;
    flex-shrink: 0;
    font-size: 0.9rem;
    font-weight: 850;
    height: 28px;
    justify-content: center;
    width: 28px;
}

.vksync-step__text[b-auwlktee5k] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.vksync-step__text strong[b-auwlktee5k] {
    color: var(--text-color);
    font-size: 0.88rem;
    font-weight: 750;
}

.vksync-step__text span[b-auwlktee5k] {
    color: var(--text-secondary);
    font-size: 0.8rem;
    line-height: 1.35;
}

/* --- Элементы управления глубиной импорта --- */
.vksync-controls[b-auwlktee5k] {
    align-items: flex-end;
    background: color-mix(in srgb, var(--card-bg) 95%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent);
    border-radius: 16px;
    display: flex;
    flex-wrap: wrap;
    gap: 18px;
    justify-content: space-between;
    padding: 18px 20px;
}

.vksync-controls__depth[b-auwlktee5k] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.vksync-controls__label[b-auwlktee5k] {
    color: var(--text-color);
    font-size: 0.9rem;
    font-weight: 750;
}

.vksync-controls__label small[b-auwlktee5k] {
    color: var(--text-secondary);
    font-size: 0.82rem;
    font-weight: 500;
    margin-left: 4px;
}

.vksync-depth-row[b-auwlktee5k] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.vksync-presets[b-auwlktee5k] {
    display: flex;
    gap: 6px;
}

.vksync-preset-chip[b-auwlktee5k] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: 0.88rem;
    font-weight: 750;
    height: 42px;
    justify-content: center;
    min-width: 44px;
    padding: 0 12px;
    transition: all 0.15s ease;
}

.vksync-preset-chip:hover[b-auwlktee5k] {
    border-color: #0077ff;
    color: #0077ff;
}

.vksync-preset-chip.is-active[b-auwlktee5k] {
    background: #0077ff;
    border-color: #0077ff;
    color: #fff;
    box-shadow: 0 4px 12px rgba(0, 119, 255, 0.3);
}

.vksync-numeric-box[b-auwlktee5k] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 24%, transparent);
    border-radius: 10px;
    display: flex;
    height: 42px;
    padding: 0 10px;
    transition: border-color 0.15s ease;
}

.vksync-numeric-box:focus-within[b-auwlktee5k] {
    border-color: #0077ff;
    box-shadow: 0 0 0 3px rgba(0, 119, 255, 0.15);
}

.vksync-number-input[b-auwlktee5k] {
    background: transparent;
    border: none;
    color: var(--text-color);
    font: inherit;
    font-size: 0.95rem;
    font-weight: 750;
    outline: none;
    text-align: center;
    width: 50px;
}

.vksync-number-unit[b-auwlktee5k] {
    color: var(--text-secondary);
    font-size: 0.82rem;
    font-weight: 600;
    margin-left: 4px;
}

.vksync-start-btn[b-auwlktee5k] {
    align-items: center;
    background: linear-gradient(135deg, #0077ff, #0056cc);
    border: none;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0, 119, 255, 0.28);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: 0.95rem;
    font-weight: 750;
    gap: 9px;
    justify-content: center;
    min-height: 44px;
    padding: 0 24px;
    transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

.vksync-start-btn:hover:not(:disabled)[b-auwlktee5k] {
    box-shadow: 0 10px 26px rgba(0, 119, 255, 0.4);
    transform: translateY(-1px);
}

.vksync-start-btn:disabled[b-auwlktee5k] {
    cursor: not-allowed;
    opacity: 0.6;
}

/* --- Результат синхронизации --- */
.vksync-result-alert[b-auwlktee5k] {
    border-radius: 14px;
    display: flex;
    gap: 14px;
    margin-top: 18px;
    padding: 16px 18px;
}

.vksync-result-alert--success[b-auwlktee5k] {
    background: color-mix(in srgb, var(--rz-success) 12%, var(--card-bg));
    border: 1.5px solid color-mix(in srgb, var(--rz-success) 35%, transparent);
}

.vksync-result-alert--info[b-auwlktee5k] {
    background: color-mix(in srgb, var(--primary-color) 12%, var(--card-bg));
    border: 1.5px solid color-mix(in srgb, var(--primary-color) 35%, transparent);
}

.vksync-result-alert--danger[b-auwlktee5k] {
    background: color-mix(in srgb, var(--rz-danger) 12%, var(--card-bg));
    border: 1.5px solid color-mix(in srgb, var(--rz-danger) 35%, transparent);
}

.vksync-result-alert__icon[b-auwlktee5k] {
    font-size: 1.35rem;
    margin-top: 2px;
}

.vksync-result-alert--success .vksync-result-alert__icon[b-auwlktee5k] { color: var(--rz-success); }
.vksync-result-alert--info .vksync-result-alert__icon[b-auwlktee5k] { color: var(--primary-color); }
.vksync-result-alert--danger .vksync-result-alert__icon[b-auwlktee5k] { color: var(--rz-danger); }

.vksync-result-alert__content[b-auwlktee5k] {
    flex: 1;
}

.vksync-result-alert__content strong[b-auwlktee5k] {
    color: var(--text-color);
    display: block;
    font-size: 0.95rem;
    margin-bottom: 4px;
}

.vksync-result-alert__content p[b-auwlktee5k] {
    color: var(--text-secondary);
    font-size: 0.9rem;
    line-height: 1.4;
    margin: 0;
}

.vksync-result-alert__link[b-auwlktee5k] {
    align-items: center;
    color: var(--primary-color);
    display: inline-flex;
    font-size: 0.88rem;
    font-weight: 750;
    gap: 6px;
    margin-top: 10px;
    text-decoration: none;
}

.vksync-result-alert__link:hover[b-auwlktee5k] {
    text-decoration: underline;
}

/* --- История публикаций из ВК --- */
.vksync-history-card[b-auwlktee5k] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 16%, transparent);
    border-radius: 20px;
    box-shadow: var(--shadow-sm);
    padding: 22px 24px;
}

.vksync-history-card__header[b-auwlktee5k] {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    margin-bottom: 18px;
}

.vksync-history-card__title[b-auwlktee5k] {
    font-size: 1.15rem;
    font-weight: 800;
    margin: 0;
}

.vksync-history-card__subtitle[b-auwlktee5k] {
    color: var(--text-secondary);
    font-size: 0.85rem;
    margin: 4px 0 0;
}

.vksync-history-card__all-link[b-auwlktee5k] {
    align-items: center;
    color: var(--primary-color);
    display: inline-flex;
    font-size: 0.85rem;
    font-weight: 750;
    gap: 6px;
    text-decoration: none;
}

.vksync-history-card__all-link:hover[b-auwlktee5k] {
    text-decoration: underline;
}

.vksync-history-empty[b-auwlktee5k] {
    align-items: center;
    border: 2px dashed color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 36px 20px;
    text-align: center;
}

.vksync-history-empty__icon[b-auwlktee5k] {
    align-items: center;
    background: color-mix(in srgb, #0077ff 12%, transparent);
    border-radius: 50%;
    color: #0077ff;
    display: flex;
    font-size: 1.75rem;
    height: 54px;
    justify-content: center;
    margin-bottom: 12px;
    width: 54px;
}

.vksync-history-empty h4[b-auwlktee5k] {
    font-size: 1.05rem;
    font-weight: 800;
    margin: 0 0 6px;
}

.vksync-history-empty p[b-auwlktee5k] {
    color: var(--text-secondary);
    font-size: 0.88rem;
    margin: 0;
    max-width: 440px;
}

/* --- Строки списка постов --- */
.vksync-history-list[b-auwlktee5k] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.vksync-post-row[b-auwlktee5k] {
    align-items: center;
    background: color-mix(in srgb, var(--card-bg) 96%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 14px;
    display: flex;
    gap: 14px;
    padding: 12px 14px;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.vksync-post-row:hover[b-auwlktee5k] {
    background: color-mix(in srgb, #0077ff 4%, var(--card-bg));
    border-color: color-mix(in srgb, #0077ff 30%, transparent);
}

.vksync-post-row__thumb[b-auwlktee5k] {
    border-radius: 10px;
    flex-shrink: 0;
    height: 54px;
    overflow: hidden;
    width: 72px;
}

.vksync-post-row__thumb img[b-auwlktee5k] {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.vksync-post-row__placeholder[b-auwlktee5k] {
    align-items: center;
    background: color-mix(in srgb, var(--text-secondary) 14%, transparent);
    color: var(--text-secondary);
    display: flex;
    height: 100%;
    justify-content: center;
    width: 100%;
}

.vksync-post-row__main[b-auwlktee5k] {
    flex: 1;
    min-width: 0;
}

.vksync-post-row__title[b-auwlktee5k] {
    font-size: 0.94rem;
    font-weight: 750;
    line-height: 1.35;
    margin: 0 0 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.vksync-post-row__meta[b-auwlktee5k] {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.vksync-post-row__date[b-auwlktee5k] {
    align-items: center;
    color: var(--text-secondary);
    display: inline-flex;
    font-size: 0.8rem;
    gap: 5px;
}

.vksync-post-row__badge[b-auwlktee5k] {
    border-radius: 12px;
    font-size: 0.76rem;
    font-weight: 750;
    padding: 2px 8px;
}

.vksync-post-row__badge.is-draft[b-auwlktee5k] {
    background: color-mix(in srgb, var(--rz-warning) 14%, transparent);
    color: var(--rz-warning);
}

.vksync-post-row__badge.is-published[b-auwlktee5k] {
    background: color-mix(in srgb, var(--rz-success) 14%, transparent);
    color: var(--rz-success);
}

.vksync-post-row__actions[b-auwlktee5k] {
    align-items: center;
    display: flex;
    flex-shrink: 0;
    gap: 8px;
}

.vksync-post-action-btn[b-auwlktee5k] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 8px;
    display: inline-flex;
    font-size: 0.82rem;
    font-weight: 700;
    gap: 5px;
    min-height: 34px;
    padding: 0 10px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.vksync-post-action-btn--edit[b-auwlktee5k] {
    color: var(--primary-color);
}

.vksync-post-action-btn--edit:hover[b-auwlktee5k] {
    background: color-mix(in srgb, var(--primary-color) 10%, transparent);
    border-color: var(--primary-color);
}

.vksync-post-action-btn--external[b-auwlktee5k] {
    color: #0077ff;
}

.vksync-post-action-btn--external:hover[b-auwlktee5k] {
    background: color-mix(in srgb, #0077ff 10%, transparent);
    border-color: #0077ff;
}

/* --- Адаптивность для мобильных устройств --- */
@media (max-width: 900px) {
    .vksync-header[b-auwlktee5k] {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .vksync-header__main[b-auwlktee5k] { flex: none; min-width: 0; width: 100%; }

    .vksync-header__actions[b-auwlktee5k] {
        width: 100%;
    }

    .vksync-secondary-action[b-auwlktee5k] {
        flex: 1 1 auto;
        justify-content: center;
    }

    .vksync-metrics[b-auwlktee5k] {
        grid-template-columns: repeat(2, 1fr);
    }

    .vksync-steps[b-auwlktee5k] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .vksync-metrics[b-auwlktee5k] {
        grid-template-columns: 1fr;
    }

    .vksync-controls[b-auwlktee5k] {
        flex-direction: column;
        align-items: stretch;
    }

    .vksync-start-btn[b-auwlktee5k] {
        width: 100%;
    }

    .vksync-post-row[b-auwlktee5k] {
        flex-direction: column;
        align-items: flex-start;
    }

    .vksync-post-row__thumb[b-auwlktee5k] {
        width: 100%;
        height: 140px;
    }

    .vksync-post-row__actions[b-auwlktee5k] {
        width: 100%;
        margin-top: 8px;
    }

    .vksync-post-action-btn[b-auwlktee5k] {
        flex: 1;
        justify-content: center;
    }
}
/* /Components/Pages/LessonRoom.razor.rz.scp.css */
.lesson-room-page[b-phft4p2tcj] { background: #f3f6fb; color: #172b49; min-height: calc(100vh - 72px); padding: clamp(16px, 3vw, 34px); }
.lesson-room-state[b-phft4p2tcj] { align-items: center; background: #fff; border: 1px solid #e0e6f0; border-radius: 24px; box-shadow: 0 18px 50px rgba(25,45,82,.08); display: flex; flex-direction: column; justify-content: center; margin: 7vh auto; max-width: 620px; min-height: 360px; padding: 36px; text-align: center; }
.lesson-room-state > i[b-phft4p2tcj] { align-items: center; background: #e9efff; border-radius: 18px; color: #3157e8; display: flex; font-size: 1.6rem; height: 68px; justify-content: center; margin-bottom: 20px; width: 68px; }
.lesson-room-state h1[b-phft4p2tcj] { font-size: clamp(1.45rem, 4vw, 2rem); margin: 0 0 10px; }
.lesson-room-state p[b-phft4p2tcj] { color: #64728a; line-height: 1.6; margin: 0 0 22px; }
.lesson-room-state a[b-phft4p2tcj] { background: linear-gradient(135deg, #3157e8, #7048e8); border-radius: 12px; color: #fff; font-weight: 800; padding: 12px 18px; text-decoration: none; }
.lesson-room-state--denied > i[b-phft4p2tcj] { background: #fff0f1; color: #b93948; }
.lesson-room-state--waiting > i[b-phft4p2tcj] { background: #fff6df; color: #b77b16; }
.lesson-room-header[b-phft4p2tcj] { align-items: center; background: transparent; box-shadow: none; display: flex; gap: 20px; height: auto; justify-content: space-between; margin: 0 auto 18px; max-width: 1480px; min-width: 0; padding: 0; position: static; width: 100%; z-index: auto; }
.lesson-room-header > div:first-child[b-phft4p2tcj] { align-items: center; display: flex; gap: 13px; min-width: 0; }
.lesson-room-header > div:first-child > div[b-phft4p2tcj] { min-width: 0; }
.lesson-room-header a[b-phft4p2tcj], .lesson-room-header__icon[b-phft4p2tcj] { align-items: center; background: #fff; border: 1px solid #dde4ef; border-radius: 12px; color: #60708a; display: flex; flex: 0 0 auto; height: 44px; justify-content: center; text-decoration: none; width: 44px; }
.lesson-room-header__icon[b-phft4p2tcj] { background: linear-gradient(135deg, #3157e8, #7048e8); border: 0; color: #fff; }
.lesson-room-header h1[b-phft4p2tcj] { font-size: clamp(1.1rem, 2.5vw, 1.55rem); margin: 2px 0 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lesson-room-header small[b-phft4p2tcj] { color: #6a7890; font-size: .72rem; }
.lesson-connection[b-phft4p2tcj] { align-items: center; background: #fff; border: 1px solid #dde4ef; border-radius: 999px; color: #69778d; display: inline-flex; flex: 0 0 auto; font-size: .72rem; font-weight: 800; gap: 8px; padding: 9px 13px; }
.lesson-connection span[b-phft4p2tcj] { background: #d39a2c; border-radius: 50%; height: 8px; width: 8px; }
.lesson-connection--connected span[b-phft4p2tcj] { background: #22a66b; box-shadow: 0 0 0 4px rgba(34,166,107,.12); }
.lesson-connection--disconnected span[b-phft4p2tcj] { background: #d44555; }
.lesson-room-alert[b-phft4p2tcj] { align-items: center; background: #fff0f1; border: 1px solid #f0cdd2; border-radius: 12px; color: #ad3442; display: flex; gap: 9px; margin: 0 auto 16px; max-width: 1480px; padding: 11px 14px; }
.lesson-room-layout[b-phft4p2tcj] { align-items: stretch; display: grid; gap: 18px; grid-template-columns: minmax(0, 1fr) minmax(280px, 340px); margin: 0 auto; max-width: 1480px; }
.lesson-stage[b-phft4p2tcj] { background: #121a2a; border-radius: 24px; box-shadow: 0 20px 55px rgba(17,29,51,.18); min-height: min(68vh, 760px); min-width: 0; overflow: hidden; position: relative; }
.lesson-video[b-phft4p2tcj] { align-items: center; display: flex; justify-content: center; }
.lesson-view-controls[b-phft4p2tcj] { left: 10px; opacity: 0; pointer-events: none; position: absolute; top: 10px; transition: opacity .15s ease; z-index: 6; }
[data-lesson-view][data-lesson-controls="visible"] > .lesson-view-controls[b-phft4p2tcj],
[data-lesson-view][data-lesson-expanded] > .lesson-view-controls[b-phft4p2tcj],
.lesson-view-controls:has(button:focus-visible)[b-phft4p2tcj] { opacity: 1; pointer-events: auto; }
@media (hover: hover) and (pointer: fine) {
    [data-lesson-view]:hover > .lesson-view-controls[b-phft4p2tcj] { opacity: 1; pointer-events: auto; }
}
.lesson-view-controls button[b-phft4p2tcj] { align-items: center; background: rgba(15,24,40,.9); border: 1px solid rgba(255,255,255,.45); border-radius: 12px; color: #fff; cursor: pointer; display: inline-flex; height: 44px; justify-content: center; width: 44px; }
.lesson-view-controls button:hover[b-phft4p2tcj] { background: #3157e8; }
.lesson-view-controls button:focus-visible[b-phft4p2tcj] { outline: 3px solid #8eb5ff; outline-offset: 3px; }
.lesson-view-controls [data-lesson-collapse][b-phft4p2tcj] { display: none; }
.lesson-presentation > .lesson-view-controls[b-phft4p2tcj] { left: 50%; top: 10px; transform: translateX(-50%); }
.lesson-stage[data-lesson-expanding][b-phft4p2tcj] { overflow: visible; z-index: 20000; }
.lesson-stage [data-lesson-view][data-lesson-expanded][b-phft4p2tcj] { background: #121a2a; border: 0; border-radius: 0; box-shadow: none; height: 100vh; height: 100dvh; inset: 0; margin: 0; max-height: none; max-width: none; min-height: 0; padding: 0; position: fixed; width: 100vw; z-index: 20001; }
.lesson-stage [data-lesson-view][data-lesson-expanded] > video[b-phft4p2tcj] { border-radius: 0; height: 100%; object-fit: contain; width: 100%; }
.lesson-stage [data-lesson-view][data-lesson-expanded] > .lesson-view-controls[b-phft4p2tcj] { bottom: auto; left: auto; right: max(12px, env(safe-area-inset-right)); top: max(12px, env(safe-area-inset-top)); transform: none; }
[data-lesson-expanded] > .lesson-view-controls [data-lesson-expand][b-phft4p2tcj] { display: none; }
[data-lesson-expanded] > .lesson-view-controls [data-lesson-collapse][b-phft4p2tcj] { display: inline-flex; }
.lesson-stage .lesson-presentation[data-lesson-expanded][b-phft4p2tcj] { gap: 8px; padding: max(64px, calc(env(safe-area-inset-top) + 56px)) max(8px, env(safe-area-inset-right)) max(8px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left)); }
.lesson-presentation[data-lesson-expanded] > .lesson-presentation__toolbar[b-phft4p2tcj] { flex-wrap: wrap; margin-right: 0; }
.lesson-presentation[data-lesson-expanded] > .lesson-pdf-viewer[b-phft4p2tcj] { border-radius: 8px; }
.lesson-presentation[data-lesson-expanded] .lesson-presentation__controls button[b-phft4p2tcj] { min-height: 44px; min-width: 44px; }
.lesson-presentation[data-lesson-expanded] .lesson-presentation__controls input[b-phft4p2tcj] { min-height: 44px; }
@media (orientation: landscape) and (max-height: 520px) {
    .lesson-presentation[data-lesson-expanded] > .lesson-presentation__toolbar[b-phft4p2tcj] { align-items: center; flex-direction: row; }
    .lesson-presentation[data-lesson-expanded] .lesson-presentation__toolbar strong[b-phft4p2tcj] { max-width: 150px; }
}
.lesson-video--remote[b-phft4p2tcj] { inset: 0; position: absolute; }
.lesson-video--remote.lesson-video--presentation-mini[b-phft4p2tcj] { background: #202b3e; border: 2px solid rgba(255,255,255,.18); border-radius: 17px; box-shadow: 0 15px 30px rgba(0,0,0,.3); height: 180px; inset: 18px 18px auto auto; overflow: hidden; width: min(30%, 260px); z-index: 3; }
.lesson-remote-video[b-phft4p2tcj] { background: #121a2a; height: 100%; object-fit: contain; width: 100%; }
.lesson-remote-video[hidden][b-phft4p2tcj] { display: none; }
.lesson-video--local[b-phft4p2tcj] { background: #202b3e; border: 2px solid rgba(255,255,255,.12); border-radius: 17px; bottom: 18px; box-shadow: 0 15px 30px rgba(0,0,0,.3); height: 180px; position: absolute; right: 18px; width: min(30%, 260px); z-index: 2; }
.lesson-video--sharing[b-phft4p2tcj] { border-color: #65d7a4; box-shadow: inset 0 0 0 2px rgba(101,215,164,.28); }
.lesson-local-preview[b-phft4p2tcj] { background: #202b3e; border-radius: inherit; height: 100%; object-fit: cover; transform: scaleX(-1); width: 100%; }
.lesson-video--local.lesson-video--sharing .lesson-local-preview[b-phft4p2tcj] { object-fit: contain; transform: none; }
.lesson-local-preview[hidden][b-phft4p2tcj] { display: none; }
.lesson-video-placeholder[b-phft4p2tcj] { align-items: center; color: #fff; display: flex; flex-direction: column; padding: 20px; text-align: center; }
.lesson-video-placeholder > span[b-phft4p2tcj] { align-items: center; background: linear-gradient(135deg, #3157e8, #7048e8); border-radius: 50%; display: flex; font-size: 2rem; height: 86px; justify-content: center; margin-bottom: 16px; width: 86px; }
.lesson-video--local .lesson-video-placeholder > span[b-phft4p2tcj] { font-size: 1rem; height: 48px; margin-bottom: 9px; width: 48px; }
.lesson-video-placeholder strong[b-phft4p2tcj] { font-size: 1rem; }
.lesson-video-placeholder small[b-phft4p2tcj] { color: #aebad0; font-size: .72rem; margin-top: 6px; }
.lesson-media-prompt[b-phft4p2tcj] { align-items: center; background: rgba(255,255,255,.96); border: 1px solid rgba(255,255,255,.25); border-radius: 16px; box-shadow: 0 14px 32px rgba(0,0,0,.24); display: grid; gap: 12px; grid-template-columns: auto minmax(0,1fr) auto; left: 18px; max-width: min(620px, calc(100% - 314px)); padding: 14px; position: absolute; top: 18px; z-index: 3; }
.lesson-media-prompt > span[b-phft4p2tcj] { align-items: center; background: #e9efff; border-radius: 11px; color: #3157e8; display: flex; height: 44px; justify-content: center; width: 44px; }
.lesson-media-prompt strong[b-phft4p2tcj], .lesson-media-prompt small[b-phft4p2tcj] { display: block; }
.lesson-media-prompt strong[b-phft4p2tcj] { font-size: .86rem; }
.lesson-media-prompt small[b-phft4p2tcj] { color: #68778e; font-size: .7rem; line-height: 1.45; margin-top: 3px; }
.lesson-media-prompt p[b-phft4p2tcj] { color: #ad3442; font-size: .69rem; line-height: 1.4; margin: 7px 0 0; }
.lesson-media-prompt button[b-phft4p2tcj], .lesson-media-notice button[b-phft4p2tcj] { background: linear-gradient(135deg, #3157e8, #7048e8); border: 0; border-radius: 10px; color: #fff; cursor: pointer; font-size: .72rem; font-weight: 800; padding: 10px 12px; }
.lesson-media-prompt button:disabled[b-phft4p2tcj], .lesson-media-notice button:disabled[b-phft4p2tcj] { cursor: wait; opacity: .6; }
.lesson-media-prompt button i[b-phft4p2tcj] { margin-right: 5px; }
.lesson-media-notice[b-phft4p2tcj] { align-items: center; background: rgba(255,246,223,.96); border: 1px solid #e7ce92; border-radius: 13px; color: #805913; display: flex; font-size: .72rem; gap: 9px; left: 18px; max-width: min(560px, calc(100% - 314px)); padding: 10px 12px; position: absolute; top: 18px; z-index: 3; }
.lesson-media-notice span[b-phft4p2tcj] { line-height: 1.4; }
.lesson-media-notice button[b-phft4p2tcj] { flex: 0 0 auto; margin-left: auto; }
.lesson-peer-state[b-phft4p2tcj] { align-items: center; background: rgba(32,43,62,.94); border: 1px solid rgba(255,255,255,.14); border-radius: 999px; bottom: 18px; color: #dce5f3; display: flex; font-size: .7rem; font-weight: 750; gap: 8px; left: 18px; max-width: calc(70% - 54px); padding: 9px 12px; position: absolute; z-index: 3; }
.lesson-peer-state--connected[b-phft4p2tcj] { background: rgba(22,112,73,.94); border-color: rgba(128,231,184,.35); color: #f4fff9; }
.lesson-peer-state--failed[b-phft4p2tcj], .lesson-peer-state--disconnected[b-phft4p2tcj], .lesson-peer-state--unsupported[b-phft4p2tcj] { background: rgba(120,38,48,.95); border-color: rgba(255,173,183,.32); color: #fff7f8; }
.lesson-peer-state span[b-phft4p2tcj] { line-height: 1.35; }
.lesson-peer-state button[b-phft4p2tcj] { background: #fff; border: 0; border-radius: 999px; color: #9e2f3c; cursor: pointer; font-size: .66rem; font-weight: 850; margin-left: 3px; padding: 6px 9px; }
.lesson-peer-state button:disabled[b-phft4p2tcj] { cursor: wait; opacity: .6; }
.lesson-presentation[b-phft4p2tcj] { display: grid; gap: 10px; grid-template-rows: minmax(0,1fr) auto; inset: 12px; position: absolute; }
.lesson-pdf-viewer[b-phft4p2tcj] { align-items: center; background: #303747; border-radius: 14px; display: flex; justify-content: center; min-height: 0; min-width: 0; overflow: hidden; position: relative; touch-action: pan-y pinch-zoom; }
.lesson-pdf-viewer[b-phft4p2tcj]  .lesson-pdf-page { background: #fff; flex: none; position: relative; }
.lesson-pdf-viewer[b-phft4p2tcj]  canvas { display: block; height: 100%; width: 100%; }
.lesson-pdf-viewer[b-phft4p2tcj]  .lesson-pdf-pointer { background: #ef233c; border: 2px solid #fff; border-radius: 50%; box-shadow: 0 0 0 2px rgba(160,0,25,.6), 0 2px 7px #0008; height: 16px; pointer-events: none; position: absolute; transform: translate(-50%,-50%); width: 16px; z-index: 1; }
.lesson-pdf-viewer[b-phft4p2tcj]  .lesson-pdf-pointer[hidden], .lesson-pdf-viewer[b-phft4p2tcj]  .lesson-pdf-status[hidden] { display: none; }
.lesson-pdf-viewer[b-phft4p2tcj]  .lesson-pdf-status { background: #fff; border-radius: 10px; color: #263a58; font-size: .85rem; margin: 14px; padding: 14px; position: absolute; text-align: center; }
.lesson-presentation__toolbar[b-phft4p2tcj] { align-items: center; background: rgba(255,255,255,.97); border: 1px solid #dce3ee; border-radius: 14px; box-shadow: 0 10px 30px rgba(8,21,44,.22); display: flex; gap: 12px; justify-content: space-between; margin-right: 280px; min-height: 58px; padding: 9px 12px; }
.lesson-presentation__toolbar > div:first-child[b-phft4p2tcj] { align-items: center; display: flex; gap: 9px; min-width: 0; }
.lesson-presentation__toolbar > div:first-child > i[b-phft4p2tcj] { color: #d33f49; font-size: 1.15rem; }
.lesson-presentation__toolbar strong[b-phft4p2tcj], .lesson-presentation__toolbar small[b-phft4p2tcj] { display: block; }
.lesson-presentation__toolbar strong[b-phft4p2tcj] { font-size: .72rem; max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lesson-presentation__toolbar small[b-phft4p2tcj] { color: #6b7990; font-size: .65rem; margin-top: 2px; }
.lesson-presentation__controls[b-phft4p2tcj] { align-items: center; display: flex; gap: 6px; }
.lesson-presentation__controls button[b-phft4p2tcj] { align-items: center; background: #edf2ff; border: 0; border-radius: 9px; color: #2856e8; cursor: pointer; display: flex; height: 35px; justify-content: center; width: 35px; }
.lesson-presentation__controls button:disabled[b-phft4p2tcj] { cursor: not-allowed; opacity: .45; }
.lesson-presentation__controls input[b-phft4p2tcj] { background: #f6f8fc; border: 1px solid #d8e0ec; border-radius: 9px; color: #263a58; font-size: .75rem; height: 35px; text-align: center; width: 62px; }
.lesson-presentation__controls .lesson-presentation__delete[b-phft4p2tcj] { background: #fff0f1; color: #b43b48; margin-left: 5px; }
.lesson-presentation__following[b-phft4p2tcj] { align-items: center; color: #617089; display: inline-flex; font-size: .68rem; gap: 6px; white-space: nowrap; }
.lesson-presentation-notice[b-phft4p2tcj] { align-items: center; background: rgba(255,255,255,.97); border: 1px solid #dce3ee; border-radius: 999px; color: #52627a; display: flex; font-size: .7rem; font-weight: 750; gap: 8px; left: 50%; max-width: calc(100% - 36px); padding: 9px 12px; position: absolute; top: 18px; transform: translateX(-50%); z-index: 5; }
.lesson-presentation-notice--failed[b-phft4p2tcj] { background: rgba(120,38,48,.96); border-color: rgba(255,173,183,.32); color: #fff7f8; }
.lesson-presentation-file[b-phft4p2tcj] { display: none; }
.lesson-screen-share-indicator[b-phft4p2tcj] { align-items: center; background: rgba(22,112,73,.94); border: 1px solid rgba(128,231,184,.35); border-radius: 999px; color: #f4fff9; display: flex; font-size: .7rem; font-weight: 800; gap: 8px; max-width: min(360px, calc(100% - 36px)); padding: 9px 12px; position: absolute; right: 18px; top: 18px; z-index: 4; }
.lesson-screen-share-indicator--error[b-phft4p2tcj] { background: rgba(120,38,48,.95); border-color: rgba(255,173,183,.32); color: #fff7f8; }
.lesson-room-side[b-phft4p2tcj] { align-content: start; display: grid; gap: 14px; min-width: 0; }
.lesson-room-side > section[b-phft4p2tcj] { background: #fff; border: 1px solid #e0e6f0; border-radius: 18px; padding: 18px; }
.lesson-room-side__heading[b-phft4p2tcj] { align-items: center; display: flex; justify-content: space-between; }
.lesson-room-side__heading small[b-phft4p2tcj], .lesson-room-window > small[b-phft4p2tcj] { color: #738097; font-size: .68rem; }
.lesson-room-side__heading h2[b-phft4p2tcj] { font-size: 1rem; margin: 3px 0 0; }
.lesson-room-side__heading > span[b-phft4p2tcj] { align-items: center; background: #e9efff; border-radius: 11px; color: #3157e8; display: flex; height: 40px; justify-content: center; width: 40px; }
.lesson-participants[b-phft4p2tcj] { display: grid; gap: 8px; list-style: none; margin: 15px 0 0; padding: 0; }
.lesson-participants li[b-phft4p2tcj] { align-items: center; background: #f5f7fb; border-radius: 12px; display: grid; gap: 10px; grid-template-columns: auto minmax(0, 1fr) auto; min-width: 0; padding: 10px; }
.lesson-participant-avatar[b-phft4p2tcj] { align-items: center; background: #e9efff; border-radius: 10px; color: #3157e8; display: flex; height: 38px; justify-content: center; width: 38px; }
.lesson-participants strong[b-phft4p2tcj], .lesson-participants small[b-phft4p2tcj] { display: block; overflow-wrap: anywhere; }
.lesson-participants strong[b-phft4p2tcj] { font-size: .78rem; }
.lesson-participants small[b-phft4p2tcj] { color: #738097; font-size: .65rem; margin-top: 2px; }
.lesson-participant-online[b-phft4p2tcj] { background: #22a66b; border-radius: 50%; box-shadow: 0 0 0 4px rgba(34,166,107,.12); height: 8px; width: 8px; }
.lesson-entry-control p[b-phft4p2tcj], .lesson-room-window p[b-phft4p2tcj] { color: #6b7990; font-size: .72rem; line-height: 1.5; }
.lesson-entry-control button[b-phft4p2tcj] { align-items: center; border: 0; border-radius: 11px; cursor: pointer; display: flex; font-weight: 850; gap: 8px; justify-content: center; min-height: 43px; width: 100%; }
.lesson-entry-control button:disabled[b-phft4p2tcj] { cursor: wait; opacity: .55; }
.lesson-entry-open[b-phft4p2tcj] { background: linear-gradient(135deg, #3157e8, #7048e8); color: #fff; }
.lesson-entry-close[b-phft4p2tcj] { background: #fff0f1; color: #b43b48; }
.lesson-invitation-control p[b-phft4p2tcj] { color: #69788e; font-size: .83rem; line-height: 1.5; margin: 12px 0; }
.lesson-invitation-link[b-phft4p2tcj] { display: grid; gap: 8px; }
.lesson-invitation-link input[b-phft4p2tcj] { background: #f6f8fc; border: 1px solid #d8e0ec; border-radius: 10px; color: #33445d; font-size: .72rem; min-width: 0; padding: 10px; width: 100%; }
.lesson-invitation-link button[b-phft4p2tcj], .lesson-invitation-actions button[b-phft4p2tcj] { border: 0; border-radius: 10px; cursor: pointer; font-size: .78rem; font-weight: 750; padding: 10px 12px; }
.lesson-invitation-link button[b-phft4p2tcj] { background: #edf2ff; color: #2856e8; }
.lesson-invitation-link button i[b-phft4p2tcj] { margin-right: 6px; }
.lesson-invitation-actions[b-phft4p2tcj] { display: flex; gap: 8px; margin-top: 12px; }
.lesson-invitation-actions button:disabled[b-phft4p2tcj] { cursor: not-allowed; opacity: .55; }
.lesson-invitation-create[b-phft4p2tcj] { background: #2658f5; color: #fff; flex: 1; }
.lesson-invitation-create i[b-phft4p2tcj] { margin-right: 6px; }
.lesson-invitation-revoke[b-phft4p2tcj] { background: #fff0f1; color: #b43b48; }
.lesson-device-control[b-phft4p2tcj] { display: grid; gap: 12px; }
.lesson-device-control label[b-phft4p2tcj] { color: #43536b; display: grid; font-size: .7rem; font-weight: 800; gap: 5px; }
.lesson-device-control select[b-phft4p2tcj] { background: #f6f8fc; border: 1px solid #d8e0ec; border-radius: 10px; color: #263a58; font: inherit; min-height: 40px; padding: 7px 9px; width: 100%; }
.lesson-device-control select:disabled[b-phft4p2tcj] { cursor: not-allowed; opacity: .72; }
.lesson-device-control p[b-phft4p2tcj] { color: #69788e; font-size: .72rem; line-height: 1.45; margin: 0; }
.lesson-device-control .lesson-device-control__hint[b-phft4p2tcj] { background: #edf2ff; border-radius: 9px; color: #536782; padding: 9px; }
.lesson-room-window strong[b-phft4p2tcj] { display: block; font-size: .9rem; margin-top: 5px; }
.lesson-toolbar[b-phft4p2tcj] { align-items: center; background: rgba(255,255,255,.96); border: 1px solid #dce3ee; border-radius: 18px; box-shadow: 0 15px 38px rgba(20,39,73,.12); display: flex; gap: 7px; justify-content: center; margin: 18px auto 0; max-width: 760px; padding: 9px; position: sticky; bottom: 14px; z-index: 10; }
.lesson-toolbar button[b-phft4p2tcj] { align-items: center; background: #f1f4f9; border: 0; border-radius: 11px; color: #5e6d84; display: flex; flex-direction: column; font-size: .64rem; font-weight: 750; gap: 5px; justify-content: center; min-height: 50px; min-width: 68px; padding: 6px 9px; }
.lesson-toolbar button i[b-phft4p2tcj] { font-size: .92rem; }
.lesson-toolbar button:disabled[b-phft4p2tcj] { cursor: not-allowed; opacity: .5; }
.lesson-toolbar .lesson-toolbar__media-on[b-phft4p2tcj] { background: #e8efff; color: #2856e8; cursor: pointer; }
.lesson-toolbar .lesson-toolbar__media-off:not(:disabled)[b-phft4p2tcj] { background: #fff0f1; color: #bd3444; cursor: pointer; }
.lesson-toolbar .lesson-toolbar__leave[b-phft4p2tcj] { background: #fff0f1; color: #bd3444; cursor: pointer; }
body.dark-theme .lesson-room-page[b-phft4p2tcj] { background: #101724; color: #eef3fb; }
body.dark-theme .lesson-room-header a[b-phft4p2tcj], body.dark-theme .lesson-room-state[b-phft4p2tcj], body.dark-theme .lesson-connection[b-phft4p2tcj], body.dark-theme .lesson-room-side > section[b-phft4p2tcj], body.dark-theme .lesson-toolbar[b-phft4p2tcj] { background: #1a2434; border-color: #2b3a50; }
body.dark-theme .lesson-participants li[b-phft4p2tcj], body.dark-theme .lesson-toolbar button[b-phft4p2tcj] { background: #222e41; }
body.dark-theme .lesson-media-prompt[b-phft4p2tcj] { background: rgba(26,36,52,.96); border-color: #37465c; }
body.dark-theme .lesson-media-prompt small[b-phft4p2tcj], body.dark-theme .lesson-device-control p[b-phft4p2tcj] { color: #9aa9bf; }
body.dark-theme .lesson-device-control label[b-phft4p2tcj] { color: #dce5f3; }
body.dark-theme .lesson-device-control select[b-phft4p2tcj] { background: #222e41; border-color: #34435a; color: #eef3fb; }
body.dark-theme .lesson-room-header small[b-phft4p2tcj], body.dark-theme .lesson-room-side__heading small[b-phft4p2tcj], body.dark-theme .lesson-room-window > small[b-phft4p2tcj], body.dark-theme .lesson-entry-control p[b-phft4p2tcj], body.dark-theme .lesson-room-window p[b-phft4p2tcj] { color: #9aa9bf; }
@media (max-width: 900px) { .lesson-room-layout[b-phft4p2tcj] { grid-template-columns: 1fr; } .lesson-stage[b-phft4p2tcj] { min-height: 58vh; } .lesson-media-prompt[b-phft4p2tcj], .lesson-media-notice[b-phft4p2tcj] { max-width: min(620px, calc(100% - 36px)); } .lesson-room-side[b-phft4p2tcj] { grid-template-columns: 1fr 1fr; grid-template-rows: auto; } .lesson-room-window[b-phft4p2tcj] { grid-column: 1 / -1; } }
@media (max-width: 620px) { .lesson-room-page[b-phft4p2tcj] { min-height: 100vh; padding: 12px; } .lesson-room-header[b-phft4p2tcj] { align-items: flex-start; } .lesson-room-header__icon[b-phft4p2tcj] { display: none; } .lesson-connection[b-phft4p2tcj] { font-size: 0; padding: 11px; } .lesson-stage[b-phft4p2tcj] { border-radius: 18px; min-height: 56vh; } .lesson-media-prompt[b-phft4p2tcj], .lesson-media-notice[b-phft4p2tcj] { left: 12px; max-width: calc(100% - 24px); right: 12px; top: 12px; } .lesson-media-prompt[b-phft4p2tcj] { grid-template-columns: auto 1fr; } .lesson-media-prompt button[b-phft4p2tcj] { grid-column: 1 / -1; width: 100%; } .lesson-media-notice[b-phft4p2tcj] { align-items: flex-start; flex-wrap: wrap; } .lesson-peer-state[b-phft4p2tcj] { bottom: 12px; left: 12px; max-width: calc(62% - 24px); } .lesson-screen-share-indicator[b-phft4p2tcj] { max-width: calc(100% - 24px); right: 12px; top: 12px; } .lesson-video--local[b-phft4p2tcj] { bottom: 12px; height: 130px; right: 12px; width: 38%; } .lesson-video--local.lesson-video--presentation-local[b-phft4p2tcj] { bottom: auto; height: 96px; right: 12px; top: 12px; width: 30%; } .lesson-video--remote.lesson-video--presentation-mini[b-phft4p2tcj] { height: 96px; inset: 12px auto auto 12px; width: 30%; } .lesson-video--local .lesson-video-placeholder > span[b-phft4p2tcj] { display: none; } .lesson-presentation[b-phft4p2tcj] { inset: 8px; } .lesson-presentation__toolbar[b-phft4p2tcj] { align-items: stretch; flex-direction: column; margin-right: 0; padding: 8px; } .lesson-presentation__toolbar strong[b-phft4p2tcj] { max-width: 240px; } .lesson-presentation__controls[b-phft4p2tcj] { justify-content: center; } .lesson-presentation__following[b-phft4p2tcj] { justify-content: center; padding: 6px; } .lesson-presentation-notice[b-phft4p2tcj] { top: 118px; } .lesson-room-side[b-phft4p2tcj] { grid-template-columns: 1fr; } .lesson-room-window[b-phft4p2tcj] { grid-column: auto; } .lesson-toolbar[b-phft4p2tcj] { bottom: 8px; justify-content: flex-start; max-width: 100%; overflow-x: auto; } .lesson-toolbar button[b-phft4p2tcj] { flex: 0 0 58px; min-width: 58px; } }
.lesson-recording-region[b-phft4p2tcj] { margin: 1rem 0; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-controls { padding: .75rem 1rem; border: 1px solid var(--border-color, #cbd5e1); border-radius: 14px; background: var(--card-bg, #fff); color: var(--text-color, #1e293b); display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-notice { flex-basis: 100%; font-size: .86rem; margin: 0; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-controls__buttons { display: flex; flex-wrap: wrap; gap: .5rem; }
.lesson-recording-region[b-phft4p2tcj]  button { border: 1px solid var(--border-color, #94a3b8); border-radius: 10px; color: inherit; font: inherit; min-height: 44px; padding: .65rem 1rem; background: transparent; cursor: pointer; }
.lesson-recording-region[b-phft4p2tcj]  button:disabled { opacity: .5; cursor: default; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-controls__rec { color: #b91c1c; font-weight: 800; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-controls__rec::before { content: '● '; }
.lesson-recording-region[b-phft4p2tcj]  [hidden] { display: none !important; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-timer { font-variant-numeric: tabular-nums; font-weight: 700; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-controls > a { color: #3268da; font-weight: 700; margin-left: auto; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-dialog { background: var(--card-bg, #fff); border: 1px solid var(--border-color, #dce3ee); border-radius: 22px; color: var(--text-color, #1e293b); margin: auto; max-height: calc(100dvh - 32px); max-width: 540px; overflow-y: auto; padding: clamp(20px, 4vw, 30px); width: calc(100% - 24px); }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-dialog::backdrop { background: #0b122bc4; backdrop-filter: blur(5px); }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-dialog h2 { font-size: clamp(1.25rem, 4vw, 1.7rem); line-height: 1.35; margin: 8px 0 18px; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-dialog p { font-size: .95rem; line-height: 1.65; margin: 0 0 16px; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-dialog__close { display: block; font-size: .8rem; margin-left: auto; min-height: 36px; padding: 6px 10px; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-dialog__reminder { border-left: 3px solid #3268da; padding-left: 14px; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-dialog__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-dialog__actions button { flex: 1; font-weight: 700; min-height: 48px; }
.lesson-recording-region[b-phft4p2tcj]  .lesson-recording-dialog__primary { background: #3268da; border-color: #3268da; color: #fff; }
.lesson-recording-region[b-phft4p2tcj]  button:focus-visible { outline: 3px solid #759dff; outline-offset: 3px; }
.lesson-toolbar .lesson-recording-action--active[b-phft4p2tcj] { background: #ffe5e9; color: #c0203b; }
body.dark-theme .lesson-toolbar .lesson-recording-action--active[b-phft4p2tcj] { background: #502438; color: #ffbac6; }
body.dark-theme .lesson-recording-region[b-phft4p2tcj]  .lesson-recording-controls__rec { color: #ffbac6; }
@media(max-width: 400px) { .lesson-recording-region[b-phft4p2tcj]  .lesson-recording-dialog__actions { flex-direction: column; } }
@media(max-width: 620px) {
    .lesson-room-header[b-phft4p2tcj] { gap: 10px; }
    .lesson-room-header > div:first-child[b-phft4p2tcj] { flex: 1; }
    .lesson-room-header small[b-phft4p2tcj] { display: block; overflow-wrap: anywhere; }
    .lesson-room-header h1[b-phft4p2tcj] { overflow-wrap: anywhere; white-space: normal; }
    .lesson-room-layout[b-phft4p2tcj], .lesson-room-side[b-phft4p2tcj] { grid-template-columns: minmax(0, 1fr); }
    .lesson-toolbar[b-phft4p2tcj] { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); overflow-x: visible; }
    .lesson-toolbar button[b-phft4p2tcj] { font-size: .68rem; min-width: 0; width: 100%; }
}

@media (min-width: 621px) and (max-width: 900px) {
    .lesson-presentation__toolbar[b-phft4p2tcj] { flex-wrap: wrap; margin-right: 0; }
    .lesson-video--local.lesson-video--presentation-local[b-phft4p2tcj] { bottom: auto; top: 18px; }
}

@media (max-width: 620px) {
    .lesson-presentation__controls button[b-phft4p2tcj],
    .lesson-presentation__controls input[b-phft4p2tcj] { min-height: 44px; }
    .lesson-presentation__controls button[b-phft4p2tcj] { min-width: 44px; }
    .lesson-toolbar button[b-phft4p2tcj] { min-height: 56px; }
    .lesson-recording-region[b-phft4p2tcj]  button { min-height: 44px; }
}
/* /Components/Pages/Login.razor.rz.scp.css */
.login-page[b-nvvybur5rm] {
    min-height: 80vh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 120px 20px 40px;
}

.login-card[b-nvvybur5rm] {
    width: 100%;
    max-width: 420px;
    padding: 32px;
    border-radius: 18px;
    background: var(--card-bg);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.login-title[b-nvvybur5rm] {
    margin-bottom: 20px;
    text-align: center;
    color: var(--text-color);
}

.login-error[b-nvvybur5rm] {
    margin-bottom: 20px;
    padding: 12px 14px;
    border-radius: 10px;
    background: #ffebee;
    color: #b71c1c;
    text-align: center;
}

.login-form[b-nvvybur5rm] {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.login-field[b-nvvybur5rm] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

    .login-field label[b-nvvybur5rm] {
        color: var(--text-secondary);
        font-weight: 600;
    }

    .login-field input[b-nvvybur5rm] {
        width: 100%;
        padding: 12px 14px;
        border: 1px solid #d9dee7;
        border-radius: 10px;
        background: var(--bg-color);
        color: var(--text-color);
    }

        .login-field input:focus-visible[b-nvvybur5rm] {
            outline: 3px solid var(--primary-color);
            outline-offset: 2px;
        }

.login-submit[b-nvvybur5rm] {
    width: 100%;
    border: none;
    cursor: pointer;
}
/* /Components/Pages/PostDetails.razor.rz.scp.css */
.mobile-toc[b-h55n8s9plc] {
    display: none;
}

.post-layout[b-h55n8s9plc] {
    display: flex;
    gap: 40px;
    max-width: 1200px;
    margin: 0 auto;
}

.post-main[b-h55n8s9plc] {
    flex: 1;
    max-width: 800px;
}

.post-sidebar[b-h55n8s9plc] {
    width: 320px;
    display: none;
}

@media (min-width: 1024px) {
    .post-sidebar[b-h55n8s9plc] {
        display: block;
    }
}

.toc-container[b-h55n8s9plc] {
    position: sticky;
    top: 100px;
    background: var(--card-bg);
    padding: 25px;
    border-radius: 20px;
    box-shadow: var(--shadow-sm);
    border: 1px solid var(--accent-light);
    max-height: calc(100vh - 120px);
    overflow-y: auto;
}

.toc-title[b-h55n8s9plc] {
    margin-bottom: 20px;
    font-size: 1.1rem;
    color: var(--primary-color);
    font-weight: 800;
}

/* Изолируем стили содержания, чтобы Blazor их видел через ::deep, так как JS генерирует их налету */
[b-h55n8s9plc] .toc-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

[b-h55n8s9plc] .toc-item {
    margin-bottom: 12px;
}

[b-h55n8s9plc] .toc-h1 {
    font-weight: 700;
    font-size: 1rem;
    margin-top: 10px;
}

[b-h55n8s9plc] .toc-h2 {
    font-weight: 600;
    font-size: 0.95rem;
    padding-left: 10px;
}

[b-h55n8s9plc] .toc-h3 {
    padding-left: 20px;
    font-size: 0.9rem;
}

[b-h55n8s9plc] .toc-link {
    color: var(--text-secondary);
    text-decoration: none;
    transition: 0.3s;
    display: block;
    line-height: 1.4;
}

    [b-h55n8s9plc] .toc-link:hover {
        color: var(--primary-color);
        transform: translateX(5px);
    }

.post-wrapper[b-h55n8s9plc] {
    padding: 120px 20px 80px;
    background-color: var(--bg-color);
    min-height: 100vh;
    transition: var(--transition);
}

.post-nav[b-h55n8s9plc] {
    margin-bottom: 40px;
}

.back-link[b-h55n8s9plc] {
    text-decoration: none;
    color: var(--text-secondary);
    font-weight: 600;
    transition: var(--transition);
    display: flex;
    align-items: center;
    gap: 10px;
}

    .back-link:hover[b-h55n8s9plc] {
        color: var(--primary-color);
        transform: translateX(-5px);
    }

.post-meta-top[b-h55n8s9plc] {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 20px;
    align-items: center;
}

.post-tag[b-h55n8s9plc] {
    background: var(--accent-light);
    color: var(--primary-color);
    padding: 4px 12px;
    border-radius: 50px;
    font-weight: 700;
    font-size: 0.85rem;
    text-decoration: none;
    transition: 0.3s;
}

    .post-tag:hover[b-h55n8s9plc] {
        filter: brightness(0.9);
    }

.post-date[b-h55n8s9plc], .read-time[b-h55n8s9plc] {
    color: var(--text-secondary);
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 6px;
}

.post-main-title[b-h55n8s9plc] {
    font-size: clamp(2rem, 5vw, 3.5rem);
    line-height: 1.2;
    margin-bottom: 20px;
    color: var(--text-color);
    transition: var(--transition);
}

.post-lead[b-h55n8s9plc] {
    font-size: 1.25rem;
    color: var(--text-secondary);
    line-height: 1.6;
    border-left: 4px solid var(--primary-color);
    padding-left: 20px;
    margin-bottom: 40px;
}

.post-featured-image[b-h55n8s9plc] {
    margin-bottom: 50px;
    border-radius: 25px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}

    .post-featured-image img[b-h55n8s9plc] {
        width: 100%;
        height: auto;
        display: block;
    }


[b-h55n8s9plc] .article-content {
    font-size: 1.15rem;
    line-height: 1.85;
    color: var(--text-color) !important;
    background-color: transparent !important;
    transition: var(--transition);
}

    [b-h55n8s9plc] .article-content * {
        color: inherit !important;
        background-color: transparent !important;
        font-family: inherit !important;
    }

    [b-h55n8s9plc] .article-content h1,
    [b-h55n8s9plc] .article-content h2,
    [b-h55n8s9plc] .article-content h3 {
        margin: 40px 0 20px;
        color: var(--text-color) !important;
    }

    [b-h55n8s9plc] .article-content p {
        margin-bottom: 25px;
    }

    /* Исключение для картинок, им фон прозрачный делать не нужно */
    [b-h55n8s9plc] .article-content img {
        max-width: 100%;
        border-radius: 15px;
        margin: 30px 0;
        box-shadow: var(--shadow-sm);
        background-color: initial !important;
    }
/* ========================================================================== */

.media-container[b-h55n8s9plc] {
    margin: 40px 0;
}

.media-title[b-h55n8s9plc] {
    font-size: 1.4rem;
    color: var(--text-color);
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.video-wrapper[b-h55n8s9plc] {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
    background: #000;
    line-height: 0;
}

    .video-wrapper video[b-h55n8s9plc] {
        width: 100%;
        max-height: 600px;
        object-fit: cover;
    }

.audio-block[b-h55n8s9plc] {
    display: flex;
    align-items: center;
    gap: 20px;
    background: var(--bg-secondary);
    padding: 20px 30px;
    border-radius: 50px;
    border: 1px solid var(--accent-light);
    transition: var(--transition);
}

.audio-icon[b-h55n8s9plc] {
    font-size: 2.5rem;
    color: var(--primary-color);
}

.audio-info[b-h55n8s9plc] {
    display: flex;
    align-items: center;
    gap: 15px;
    min-width: 200px;
}

.custom-audio[b-h55n8s9plc] {
    flex-grow: 1;
    height: 40px;
    outline: none;
}

.pdf-download-card[b-h55n8s9plc] {
    display: flex;
    align-items: center;
    gap: 20px;
    background: var(--accent-light);
    padding: 25px;
    border-radius: 20px;
    margin-top: 40px;
    border: 2px dashed var(--primary-color);
    transition: var(--transition);
}
/* Исправлен белый фон иконки PDF для темной темы */
.pdf-icon[b-h55n8s9plc] {
    font-size: 3rem;
    color: #ff4d4d;
    background: var(--card-bg);
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
    box-shadow: var(--shadow-sm);
    transition: var(--transition);
}

.pdf-info[b-h55n8s9plc] {
    flex-grow: 1;
}

    .pdf-info h4[b-h55n8s9plc] {
        margin: 0 0 5px 0;
        color: var(--text-color);
        transition: var(--transition);
    }

    .pdf-info p[b-h55n8s9plc] {
        margin: 0;
        font-size: 0.95rem;
        color: var(--text-secondary);
        transition: var(--transition);
    }

.pdf-btn[b-h55n8s9plc] {
    background: var(--primary-color);
    color: white !important;
    text-decoration: none;
    padding: 12px 25px;
    border-radius: 50px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: var(--transition);
    box-shadow: 0 4px 15px rgba(27, 84, 245, 0.2);
}

    .pdf-btn:hover[b-h55n8s9plc] {
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(27, 84, 245, 0.3);
    }

.post-footer[b-h55n8s9plc] {
    margin-top: 60px;
    padding-top: 40px;
    border-top: 1px solid var(--accent-light);
}

.share-box[b-h55n8s9plc] {
    text-align: center;
    color: var(--text-color);
}

.share-links[b-h55n8s9plc] {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 20px;
}

.share-btn[b-h55n8s9plc] {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    text-decoration: none;
    font-size: 1.2rem;
    transition: var(--transition);
}

    .share-btn:hover[b-h55n8s9plc] {
        transform: translateY(-3px);
        filter: brightness(1.1);
    }

.tg[b-h55n8s9plc] {
    background: #0088cc;
}

.vk[b-h55n8s9plc] {
    background: #4a76a8;
}

.wa[b-h55n8s9plc] {
    background: #25d366;
}

.loader-container[b-h55n8s9plc] {
    padding: 150px 20px;
    text-align: center;
    color: var(--text-color);
}

.spinner[b-h55n8s9plc] {
    width: 40px;
    height: 40px;
    border: 4px solid var(--accent-light);
    border-top: 4px solid var(--primary-color);
    border-radius: 50%;
    animation: spin-b-h55n8s9plc 1s linear infinite;
    margin: 0 auto 20px;
}

@keyframes spin-b-h55n8s9plc {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@media (max-width: 1023px) {
    .post-wrapper[b-h55n8s9plc] {
        padding-top: 100px;
    }

    .post-main-title[b-h55n8s9plc] {
        font-size: 2.2rem;
    }

    .post-lead[b-h55n8s9plc] {
        font-size: 1.1rem;
    }

    .audio-block[b-h55n8s9plc] {
        flex-direction: column;
        border-radius: 20px;
        text-align: center;
    }

    .custom-audio[b-h55n8s9plc] {
        width: 100%;
    }

    .pdf-download-card[b-h55n8s9plc] {
        flex-direction: column;
        text-align: center;
    }

    .pdf-btn[b-h55n8s9plc] {
        width: 100%;
        justify-content: center;
    }

    .mobile-toc[b-h55n8s9plc] {
        display: block;
        margin-bottom: 40px;
    }

    .mobile-toc-details[b-h55n8s9plc] {
        background: var(--card-bg);
        border-radius: 20px;
        padding: 20px;
        border: 1px solid var(--accent-light);
        box-shadow: var(--shadow-sm);
        transition: var(--transition);
    }

    .mobile-toc-summary[b-h55n8s9plc] {
        font-size: 1.2rem;
        font-weight: 700;
        color: var(--primary-color);
        cursor: pointer;
        outline: none;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .mobile-toc-details[open] .mobile-toc-summary[b-h55n8s9plc] {
        margin-bottom: 15px;
        padding-bottom: 15px;
        border-bottom: 1px solid var(--accent-light);
    }
}
/* /Components/Pages/Student/Messages.razor.rz.scp.css */
.chat-page[b-85jrqymj9c] {
    --chat-ink: var(--text-color, #1e293b);
    --chat-muted: var(--text-muted, #64748b);
    --chat-line: var(--border-color, #dce5ef);
    --chat-surface: var(--bg-color, #fff);
    --chat-accent: #3268da;
    --chat-glow: #edf4ff70;
    --chat-mine-bg: #e4efff;
    --chat-mine-line: #d5e5ff;
    --chat-mine-ink: #1d355a;
    --chat-mine-muted: #526780;
    color: var(--chat-ink);
    margin: 0 auto;
    max-width: 1320px;
    padding: clamp(14px, 2.5vw, 28px);
}
body.dark-theme .chat-page[b-85jrqymj9c] {
    --chat-surface: var(--card-bg, #252525);
    --chat-muted: var(--text-secondary, #aaa);
    --chat-line: #3f4754;
    --chat-glow: transparent;
    --chat-mine-bg: #263b61;
    --chat-mine-line: #355080;
    --chat-mine-ink: #e5edfc;
    --chat-mine-muted: #b3c2dc;
}
body.dark-theme .chat-avatar[b-85jrqymj9c] { background: linear-gradient(135deg, #293950, #25414c); color: #a8c7ff; }
body.dark-theme .chat-live-label[b-85jrqymj9c] { background: #19382a; border-color: #2d5844; color: #98dfb9; }
body.dark-theme .chat-thread__empty span[b-85jrqymj9c] { background: #243652; color: #a8c7ff; }
body.dark-theme .chat-error[b-85jrqymj9c] { background: #3d2026; border-color: #633741; color: #ffb8bd; }
.chat-page__header[b-85jrqymj9c] { align-items: center; display: flex; gap: 16px; margin-bottom: 22px; }
.chat-page__heading-icon[b-85jrqymj9c] { align-items: center; background: linear-gradient(145deg, #4d84f0, #2858c0); border-radius: 19px; box-shadow: 0 12px 26px #3268da36; color: #fff; display: flex; flex: 0 0 54px; font-size: 1.25rem; height: 54px; justify-content: center; }
.chat-eyebrow[b-85jrqymj9c] { color: var(--chat-accent); display: block; font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.chat-page__header h1[b-85jrqymj9c] { font-size: clamp(1.5rem, 2.3vw, 2.05rem); line-height: 1.2; margin: 2px 0; }
.chat-page__header p[b-85jrqymj9c] { color: var(--chat-muted); font-size: .93rem; margin: 0; }
.chat-live-label[b-85jrqymj9c] { align-items: center; background: #eaf5ef; border: 1px solid #cde7d8; border-radius: 100px; color: #18744c; display: inline-flex; font-size: .75rem; font-weight: 750; gap: 8px; margin-left: auto; padding: 8px 12px; white-space: nowrap; }
.chat-live-label span[b-85jrqymj9c] { background: #30aa70; border-radius: 50%; height: 7px; width: 7px; }
.chat-page__grid[b-85jrqymj9c] { display: grid; grid-template-columns: minmax(260px, 315px) minmax(0, 1fr); height: clamp(560px, calc(100dvh - 205px), 850px); min-height: 0; }
.chat-conversations[b-85jrqymj9c], .chat-thread[b-85jrqymj9c] { background: var(--chat-surface); border: 1px solid var(--chat-line); box-shadow: 0 12px 36px #1833630c; min-height: 0; }
.chat-conversations[b-85jrqymj9c] { border-radius: 20px 0 0 20px; display: flex; flex-direction: column; overflow: hidden; }
.chat-conversations__heading[b-85jrqymj9c] { align-items: center; display: flex; justify-content: space-between; padding: 24px 20px 16px; }
.chat-conversations__heading h2[b-85jrqymj9c] { font-size: 1.18rem; margin: 3px 0 0; }
.chat-total[b-85jrqymj9c] { background: #edf3ff; border-radius: 12px; color: var(--chat-accent); font-size: .8rem; font-weight: 800; padding: 6px 10px; }
.chat-search[b-85jrqymj9c] { align-items: center; background: color-mix(in srgb, var(--chat-surface) 93%, #8ba4cf); border: 1px solid var(--chat-line); border-radius: 12px; color: var(--chat-muted); display: flex; gap: 9px; margin: 0 14px 15px; padding: 0 13px; }
.chat-search:focus-within[b-85jrqymj9c] { border-color: var(--chat-accent); box-shadow: 0 0 0 3px #3268da19; }
.chat-search input[b-85jrqymj9c] { background: transparent; border: 0; color: var(--chat-ink); font: inherit; min-width: 0; outline: 0; padding: 11px 0; width: 100%; }
.chat-conversations__list[b-85jrqymj9c] { flex: 1; min-height: 0; overflow-y: auto; padding: 0 9px 14px; }
.chat-conversation[b-85jrqymj9c] { align-items: center; background: transparent; border: 1px solid transparent; border-radius: 14px; color: var(--chat-ink); cursor: pointer; display: flex; gap: 12px; margin: 3px 0; padding: 12px 10px; text-align: left; width: 100%; }
.chat-conversation:hover[b-85jrqymj9c], .chat-conversation:focus-visible[b-85jrqymj9c] { background: #f1f6ff; color: #1d355a; outline: none; }
.chat-conversation.is-selected[b-85jrqymj9c] { background: #eaf2ff; border-color: #d5e4ff; color: #1d355a; }
.chat-avatar[b-85jrqymj9c] { align-items: center; background: linear-gradient(135deg, #e2ebff, #d6f0f5); border-radius: 15px; color: #2b60ba; display: inline-flex; flex: 0 0 42px; font-size: .78rem; font-weight: 800; height: 42px; justify-content: center; letter-spacing: .02em; }
.chat-avatar--header[b-85jrqymj9c] { border-radius: 16px; flex-basis: 44px; height: 44px; }
.chat-conversation__content[b-85jrqymj9c] { display: flex; flex: 1; flex-direction: column; gap: 3px; min-width: 0; }
.chat-conversation__content strong[b-85jrqymj9c] { font-size: .88rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-conversation__content small[b-85jrqymj9c] { color: var(--chat-muted); font-size: .74rem; }
.chat-unread[b-85jrqymj9c] { align-items: center; background: var(--chat-accent); border-radius: 20px; color: #fff; display: inline-flex; flex: 0 0 auto; font-size: .69rem; font-weight: 800; height: 23px; justify-content: center; min-width: 23px; padding: 0 5px; }
.chat-conversations__empty[b-85jrqymj9c] { color: var(--chat-muted); padding: 26px 16px; text-align: center; }
.chat-conversations__empty i[b-85jrqymj9c] { color: #9eb6dd; font-size: 1.8rem; }
.chat-thread[b-85jrqymj9c] { border-left: 0; border-radius: 0 20px 20px 0; display: flex; flex-direction: column; overflow: hidden; }
.chat-page--student .chat-thread[b-85jrqymj9c] { border-left: 1px solid var(--chat-line); border-radius: 20px; height: clamp(560px, calc(100dvh - 235px), 850px); }
.chat-thread__toolbar[b-85jrqymj9c] { align-items: center; border-bottom: 1px solid var(--chat-line); display: flex; flex: 0 0 auto; gap: 12px; min-height: 76px; padding: 14px 22px; }
.chat-thread__identity[b-85jrqymj9c] { min-width: 0; }
.chat-thread__identity h2[b-85jrqymj9c] { font-size: .98rem; margin: 0 0 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-thread__identity small[b-85jrqymj9c] { color: var(--chat-muted); font-size: .75rem; }
.chat-back[b-85jrqymj9c] { background: transparent; border: 0; color: var(--chat-ink); cursor: pointer; display: none; font-size: 1rem; padding: 10px; }
.chat-thread__messages[b-85jrqymj9c] { background: radial-gradient(circle at 15% 15%, var(--chat-glow), transparent 30%), color-mix(in srgb, var(--chat-surface) 96%, #bed2f7); display: flex; flex: 1; flex-direction: column; gap: 10px; min-height: 0; overflow-x: hidden; overflow-y: auto; padding: 24px clamp(18px, 3vw, 40px); scroll-behavior: smooth; }
.chat-message[b-85jrqymj9c] { align-self: flex-start; background: var(--chat-surface); border: 1px solid var(--chat-line); border-radius: 17px 17px 17px 5px; box-shadow: 0 4px 12px #1833630a; max-width: min(78%, 560px); overflow-wrap: anywhere; padding: 11px 14px 8px; }
.chat-message--mine[b-85jrqymj9c] { align-self: flex-end; background: var(--chat-mine-bg); border-color: var(--chat-mine-line); border-radius: 17px 17px 5px 17px; color: var(--chat-mine-ink); }
.chat-message p[b-85jrqymj9c] { font-size: .9rem; line-height: 1.5; margin: 0 0 4px; white-space: pre-wrap; }
.chat-message small[b-85jrqymj9c] { align-items: center; color: var(--chat-muted); display: flex; font-size: .68rem; gap: 6px; justify-content: flex-end; }
.chat-message--mine small[b-85jrqymj9c] { color: var(--chat-mine-muted); }
.chat-message small i[b-85jrqymj9c] { color: var(--chat-accent); }
.chat-thread__compose[b-85jrqymj9c] { border-top: 1px solid var(--chat-line); flex: 0 0 auto; padding: 13px clamp(16px, 2.5vw, 28px) 11px; }
.chat-thread__compose label[b-85jrqymj9c] { display: block; font-size: .78rem; font-weight: 800; margin-bottom: 7px; }
.chat-compose-row[b-85jrqymj9c] { align-items: end; display: flex; gap: 10px; }
.chat-compose-row textarea[b-85jrqymj9c] { background: color-mix(in srgb, var(--chat-surface) 94%, #9cb5df); border: 1px solid var(--chat-line); border-radius: 12px; color: var(--chat-ink); flex: 1; font: inherit; line-height: 1.4; min-height: 46px; min-width: 0; padding: 11px 13px; resize: vertical; }
.chat-compose-row textarea:focus[b-85jrqymj9c] { border-color: var(--chat-accent); outline: 3px solid #3268da19; }
.chat-compose-row textarea[b-85jrqymj9c]::placeholder { color: var(--chat-muted); opacity: 1; }
.chat-compose-row button[b-85jrqymj9c] { align-items: center; background: var(--chat-accent); border: 0; border-radius: 12px; color: #fff; cursor: pointer; display: inline-flex; font: inherit; font-size: .84rem; font-weight: 750; gap: 8px; height: 46px; justify-content: center; padding: 0 17px; }
.chat-compose-row button:hover:not(:disabled)[b-85jrqymj9c] { background: #2157c5; }
.chat-compose-row button:disabled[b-85jrqymj9c] { cursor: not-allowed; opacity: .5; }
.chat-thread__compose > small[b-85jrqymj9c] { color: var(--chat-muted); display: block; font-size: .68rem; margin-top: 7px; }
.chat-thread__empty[b-85jrqymj9c], .chat-thread__blank[b-85jrqymj9c] { align-items: center; color: var(--chat-muted); display: flex; flex: 1; flex-direction: column; justify-content: center; padding: 24px; text-align: center; }
.chat-thread__empty span[b-85jrqymj9c], .chat-thread__blank > i[b-85jrqymj9c] { align-items: center; background: #e7f0ff; border-radius: 20px; color: var(--chat-accent); display: flex; font-size: 1.4rem; height: 66px; justify-content: center; margin-bottom: 14px; width: 66px; }
.chat-thread__empty h3[b-85jrqymj9c], .chat-thread__blank h2[b-85jrqymj9c] { color: var(--chat-ink); font-size: 1rem; margin: 0 0 6px; }
.chat-thread__empty p[b-85jrqymj9c], .chat-thread__blank p[b-85jrqymj9c] { line-height: 1.5; margin: 0; max-width: 330px; }
.chat-error[b-85jrqymj9c] { background: #fff0f0; border: 1px solid #f3caca; border-radius: 9px; color: #a52828; padding: 10px 14px; }
@media (max-width: 900px) {
    .chat-page__grid[b-85jrqymj9c] { grid-template-columns: minmax(220px, 265px) minmax(0, 1fr); }
    .chat-message[b-85jrqymj9c] { max-width: 88%; }
}
@media (max-width: 700px) {
    .chat-page[b-85jrqymj9c] { padding: 10px 10px 16px; }
    .chat-page__header[b-85jrqymj9c] { gap: 10px; margin-bottom: 12px; }
    .chat-page__heading-icon[b-85jrqymj9c] { border-radius: 14px; flex-basis: 43px; height: 43px; }
    .chat-page__header p[b-85jrqymj9c], .chat-live-label[b-85jrqymj9c] { display: none; }
    .chat-page__header h1[b-85jrqymj9c] { font-size: 1.45rem; }
    .chat-page__grid[b-85jrqymj9c] { display: block; height: calc(100dvh - 190px); min-height: 410px; }
    .chat-conversations[b-85jrqymj9c], .chat-thread[b-85jrqymj9c] { border: 1px solid var(--chat-line); border-radius: 16px; height: 100%; }
    .chat-page__grid:not(.is-thread-open) .chat-thread[b-85jrqymj9c] { display: none; }
    .chat-page__grid.is-thread-open .chat-conversations[b-85jrqymj9c] { display: none; }
    .chat-back[b-85jrqymj9c] { display: inline-flex; }
    .chat-thread__toolbar[b-85jrqymj9c] { min-height: 64px; padding: 10px 12px; }
    .chat-thread__messages[b-85jrqymj9c] { padding: 16px 13px; }
    .chat-message[b-85jrqymj9c] { max-width: 88%; }
    .chat-page--student .chat-thread[b-85jrqymj9c] { height: calc(100dvh - 190px); min-height: 410px; }
    .chat-compose-row button[b-85jrqymj9c] { padding: 0 14px; }
    .chat-compose-row button span[b-85jrqymj9c] { display: none; }
}
@media (max-width: 370px) {
    .chat-thread__compose[b-85jrqymj9c] { padding: 10px; }
    .chat-message[b-85jrqymj9c] { max-width: 94%; }
}

.chat-notice[b-85jrqymj9c] { background: var(--chat-surface); color: var(--chat-ink); border: 1px solid var(--chat-line); border-radius: 10px; padding: 12px 16px; margin: 0 0 14px; font-size: .85rem; }
/* /Components/Pages/Teacher/Homework/HomeworkDetailsContent.razor.rz.scp.css */
.homework-details-page[b-bx2icook9z] { color: var(--text-color); margin: 0 auto; max-width: 1240px; }
.homework-details-heading[b-bx2icook9z] { align-items: center; background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 17px; box-shadow: var(--shadow-sm); display: grid; gap: 14px; grid-template-columns: 42px 62px minmax(0, 1fr) auto; margin-bottom: 15px; padding: 18px; }
.homework-details-back[b-bx2icook9z] { align-items: center; background: color-mix(in srgb, var(--text-secondary) 7%, var(--card-bg)); border-radius: 10px; color: var(--text-color); display: flex; height: 42px; justify-content: center; text-decoration: none; }
.homework-details-date[b-bx2icook9z] { align-items: center; background: linear-gradient(145deg, var(--primary-color), #7048e8); border-radius: 14px; color: #fff; display: flex; flex-direction: column; height: 62px; justify-content: center; }
.homework-details-date strong[b-bx2icook9z] { font-size: 1.25rem; line-height: 1; }
.homework-details-date span[b-bx2icook9z] { font-size: .65rem; font-weight: 800; text-transform: uppercase; }
.homework-details-title[b-bx2icook9z] { min-width: 0; }
.homework-details-title > div[b-bx2icook9z] { align-items: center; color: var(--text-secondary); display: flex; flex-wrap: wrap; font-size: .7rem; gap: 10px; }
.homework-details-title > div span[b-bx2icook9z] { align-items: center; display: inline-flex; gap: 5px; }
.homework-details-title .status[b-bx2icook9z] { color: var(--primary-color); font-weight: 850; }
.homework-details-title .status--overdue[b-bx2icook9z] { color: #c93636; }
.homework-details-title .status--completed[b-bx2icook9z] { color: #25845a; }
.homework-details-title h1[b-bx2icook9z] { font-size: clamp(1.35rem, 2.5vw, 1.9rem); margin: 5px 0; }
.homework-details-title > a[b-bx2icook9z] { align-items: center; color: var(--text-secondary); display: inline-flex; font-size: .76rem; gap: 6px; text-decoration: none; }
.homework-details-edit[b-bx2icook9z] { align-items: center; border: 1px solid color-mix(in srgb, var(--primary-color) 22%, transparent); border-radius: 10px; color: var(--primary-color); display: inline-flex; font-size: .78rem; font-weight: 800; gap: 7px; min-height: 41px; padding: 0 13px; text-decoration: none; }
.homework-details-alert[b-bx2icook9z] { align-items: center; background: color-mix(in srgb, #d44545 8%, var(--card-bg)); border: 1px solid color-mix(in srgb, #d44545 22%, transparent); border-radius: 12px; color: #bd3030; display: flex; gap: 9px; margin-bottom: 15px; padding: 12px 14px; }
.homework-details-actions[b-bx2icook9z] { align-items: center; background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 13px; display: flex; gap: 12px; justify-content: space-between; margin-bottom: 16px; padding: 10px 13px; }
.homework-details-actions button[b-bx2icook9z] { align-items: center; border: 0; border-radius: 9px; cursor: pointer; display: inline-flex; font: inherit; font-size: .74rem; font-weight: 800; gap: 6px; min-height: 38px; padding: 0 12px; }
.homework-details-actions .danger[b-bx2icook9z] { background: color-mix(in srgb, #d44545 9%, var(--card-bg)); color: #c93636; }
.homework-details-actions > span[b-bx2icook9z] { align-items: center; color: var(--text-secondary); display: inline-flex; font-size: .72rem; gap: 7px; }
.homework-details-grid[b-bx2icook9z] { align-items: start; display: grid; gap: 17px; grid-template-columns: minmax(0, 1.55fr) minmax(280px, .72fr); }
.homework-details-main[b-bx2icook9z], .homework-details-side[b-bx2icook9z] { display: grid; gap: 17px; }
.homework-details-side[b-bx2icook9z] { position: sticky; top: 84px; }
.homework-panel[b-bx2icook9z] { background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 16px; box-shadow: var(--shadow-sm); display: grid; gap: 16px; padding: 19px; }
.homework-panel-title[b-bx2icook9z] { align-items: flex-start; display: flex; gap: 11px; }
.homework-panel-title > span[b-bx2icook9z] { align-items: center; background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg)); border-radius: 9px; color: var(--primary-color); display: flex; height: 36px; justify-content: center; width: 36px; }
.homework-panel-title h2[b-bx2icook9z] { font-size: .94rem; margin: 0 0 2px; }
.homework-panel-title p[b-bx2icook9z] { color: var(--text-secondary); font-size: .73rem; margin: 0; }
.homework-instructions[b-bx2icook9z] { line-height: 1.65; white-space: pre-wrap; }
.homework-muted[b-bx2icook9z] { color: var(--text-secondary); font-size: .78rem; margin: 0; }
.homework-material-list[b-bx2icook9z], .submission-list[b-bx2icook9z] { display: grid; gap: 9px; }
.homework-material-list article[b-bx2icook9z] { align-items: center; background: color-mix(in srgb, var(--text-secondary) 4%, var(--card-bg)); border-radius: 10px; display: grid; gap: 10px; grid-template-columns: 38px minmax(0, 1fr) 34px; padding: 10px; }
.homework-material-list article > span[b-bx2icook9z] { align-items: center; background: color-mix(in srgb, var(--primary-color) 10%, transparent); border-radius: 8px; color: var(--primary-color); display: flex; height: 34px; justify-content: center; }
.homework-material-list article div[b-bx2icook9z] { display: grid; gap: 2px; }
.homework-material-list article small[b-bx2icook9z] { color: var(--text-secondary); font-size: .68rem; }
.homework-material-list article > a[b-bx2icook9z] { color: var(--primary-color); text-align: center; }
.submission-list > article[b-bx2icook9z] { background: color-mix(in srgb, var(--text-secondary) 4%, var(--card-bg)); border-radius: 11px; padding: 13px; }
.submission-list header[b-bx2icook9z] { align-items: center; display: flex; flex-wrap: wrap; font-size: .72rem; gap: 8px; }
.submission-list header time[b-bx2icook9z] { color: var(--text-secondary); }
.submission-list header span[b-bx2icook9z] { color: var(--primary-color); font-weight: 800; margin-left: auto; }
.submission-list article > p[b-bx2icook9z] { line-height: 1.55; margin: 10px 0 0; white-space: pre-wrap; }
.submission-list footer[b-bx2icook9z] { border-top: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent); margin-top: 12px; padding-top: 10px; }
.submission-list footer p[b-bx2icook9z] { color: var(--text-secondary); margin: 4px 0; white-space: pre-wrap; }
.submission-list footer span[b-bx2icook9z] { color: var(--primary-color); font-size: .72rem; font-weight: 800; }
.homework-history-panel ol[b-bx2icook9z] { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; }
.homework-history-panel li[b-bx2icook9z] { align-items: center; display: grid; gap: 10px; grid-template-columns: 32px minmax(0, 1fr); }
.homework-history-panel li > span[b-bx2icook9z] { align-items: center; background: color-mix(in srgb, var(--primary-color) 9%, transparent); border-radius: 50%; color: var(--primary-color); display: flex; height: 30px; justify-content: center; }
.homework-history-panel li div[b-bx2icook9z] { display: grid; gap: 2px; }
.homework-history-panel li time[b-bx2icook9z] { color: var(--text-secondary); font-size: .67rem; }
.homework-summary-panel dl[b-bx2icook9z] { display: grid; gap: 10px; margin: 0; }
.homework-summary-panel dl div[b-bx2icook9z] { border-top: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent); padding-top: 9px; }
.homework-summary-panel dt[b-bx2icook9z] { color: var(--text-secondary); font-size: .67rem; }
.homework-summary-panel dd[b-bx2icook9z] { font-size: .77rem; font-weight: 750; margin: 3px 0 0; }
.homework-summary-panel a[b-bx2icook9z] { color: var(--text-color); text-decoration: none; }
.review-panel label[b-bx2icook9z], .reassign-panel label[b-bx2icook9z] { display: grid; gap: 5px; }
.review-panel label span[b-bx2icook9z], .reassign-panel label span[b-bx2icook9z] { font-size: .72rem; font-weight: 750; }
.review-panel input[b-bx2icook9z], .review-panel textarea[b-bx2icook9z], .reassign-panel input[b-bx2icook9z] { background: color-mix(in srgb, var(--card-bg) 97%, var(--text-color)); border: 1px solid color-mix(in srgb, var(--text-secondary) 23%, transparent); border-radius: 9px; color: var(--text-color); font: inherit; padding: 9px 10px; width: 100%; }
.review-panel > div:last-child[b-bx2icook9z] { display: grid; gap: 8px; grid-template-columns: 1fr 1fr; }
.review-panel button[b-bx2icook9z], .reassign-panel > button[b-bx2icook9z] { align-items: center; background: linear-gradient(135deg, var(--primary-color), #7048e8); border: 0; border-radius: 9px; color: #fff; cursor: pointer; display: inline-flex; font: inherit; font-size: .72rem; font-weight: 800; gap: 6px; justify-content: center; min-height: 40px; padding: 0 10px; }
.review-panel button.secondary[b-bx2icook9z] { background: color-mix(in srgb, var(--primary-color) 9%, var(--card-bg)); color: var(--primary-color); }
.homework-details-state[b-bx2icook9z] { align-items: center; color: var(--text-secondary); display: flex; gap: 8px; justify-content: center; min-height: 260px; }
@media (max-width: 980px) { .homework-details-grid[b-bx2icook9z] { grid-template-columns: 1fr; } .homework-details-side[b-bx2icook9z] { position: static; } }
@media (max-width: 680px) { .homework-details-heading[b-bx2icook9z] { align-items: start; grid-template-columns: 42px 62px minmax(0, 1fr); } .homework-details-title[b-bx2icook9z] { grid-column: 1 / -1; } .homework-details-edit[b-bx2icook9z] { grid-column: 1 / -1; justify-content: center; } .homework-details-actions[b-bx2icook9z] { align-items: stretch; flex-direction: column; } .homework-details-actions button[b-bx2icook9z] { justify-content: center; } }
/* /Components/Pages/Teacher/Homework/HomeworkEditorContent.razor.rz.scp.css */
.homework-editor-page[b-gu28qh862c] { color: var(--text-color); margin: 0 auto; max-width: 1240px; }
.homework-editor-heading[b-gu28qh862c] { align-items: flex-start; display: flex; gap: 14px; margin-bottom: 22px; }
.homework-editor-heading > a[b-gu28qh862c] { align-items: center; background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent); border-radius: 11px; color: var(--text-color); display: flex; flex: 0 0 42px; height: 42px; justify-content: center; text-decoration: none; }
.homework-editor-heading span[b-gu28qh862c] { color: var(--primary-color); display: block; font-size: .72rem; font-weight: 850; letter-spacing: .1em; margin-bottom: 4px; text-transform: uppercase; }
.homework-editor-heading h1[b-gu28qh862c] { font-size: clamp(1.65rem, 3vw, 2.3rem); margin: 0 0 5px; }
.homework-editor-heading p[b-gu28qh862c] { color: var(--text-secondary); margin: 0; }
.homework-editor-layout[b-gu28qh862c] { align-items: start; display: grid; gap: 18px; grid-template-columns: minmax(0, 1.65fr) minmax(280px, .75fr); }
.homework-editor-main[b-gu28qh862c], .homework-editor-side[b-gu28qh862c] { display: grid; gap: 18px; }
.homework-editor-side[b-gu28qh862c] { position: sticky; top: 84px; }
.homework-form-card[b-gu28qh862c], .homework-editor-summary[b-gu28qh862c] { background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 17px; box-shadow: var(--shadow-sm); display: grid; gap: 17px; padding: 20px; }
.homework-form-title[b-gu28qh862c] { align-items: flex-start; display: flex; gap: 12px; }
.homework-form-title > i[b-gu28qh862c] { align-items: center; background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg)); border-radius: 10px; color: var(--primary-color); display: flex; height: 38px; justify-content: center; width: 38px; }
.homework-form-title h2[b-gu28qh862c] { font-size: .98rem; margin: 0 0 2px; }
.homework-form-title p[b-gu28qh862c] { color: var(--text-secondary); font-size: .77rem; margin: 0; }
.homework-form-card label[b-gu28qh862c] { display: grid; gap: 6px; }
.homework-form-card label > span[b-gu28qh862c] { font-size: .78rem; font-weight: 750; }
.homework-form-card label b[b-gu28qh862c] { color: #d44545; }
.homework-form-card input[b-gu28qh862c], .homework-form-card select[b-gu28qh862c], .homework-form-card textarea[b-gu28qh862c] { background: color-mix(in srgb, var(--card-bg) 97%, var(--text-color)); border: 1px solid color-mix(in srgb, var(--text-secondary) 23%, transparent); border-radius: 10px; color: var(--text-color); font: inherit; outline: none; padding: 10px 12px; width: 100%; }
.homework-form-card input[b-gu28qh862c], .homework-form-card select[b-gu28qh862c] { min-height: 44px; }
.homework-form-card textarea[b-gu28qh862c] { resize: vertical; }
.homework-form-card input:focus[b-gu28qh862c], .homework-form-card select:focus[b-gu28qh862c], .homework-form-card textarea:focus[b-gu28qh862c] { border-color: var(--primary-color); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 12%, transparent); }
.homework-due-grid[b-gu28qh862c] { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.homework-materials-heading[b-gu28qh862c] { align-items: flex-start; display: flex; gap: 14px; justify-content: space-between; }
.material-add-menu[b-gu28qh862c] { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.material-add-menu button[b-gu28qh862c] { align-items: center; background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg)); border: 0; border-radius: 8px; color: var(--primary-color); cursor: pointer; display: inline-flex; font: inherit; font-size: .7rem; font-weight: 800; gap: 5px; min-height: 34px; padding: 0 9px; }
.material-add-menu button:disabled[b-gu28qh862c] { cursor: not-allowed; opacity: .45; }
.materials-empty[b-gu28qh862c] { align-items: center; background: color-mix(in srgb, var(--text-secondary) 4%, var(--card-bg)); border: 1px dashed color-mix(in srgb, var(--text-secondary) 22%, transparent); border-radius: 11px; color: var(--text-secondary); display: flex; font-size: .76rem; gap: 8px; justify-content: center; min-height: 80px; padding: 15px; text-align: center; }
.material-list[b-gu28qh862c] { display: grid; gap: 10px; }
.material-editor-row[b-gu28qh862c] { align-items: end; background: color-mix(in srgb, var(--text-secondary) 4%, var(--card-bg)); border-radius: 11px; display: grid; gap: 10px; grid-template-columns: 100px minmax(0, 1fr) minmax(0, 1fr) 38px; padding: 12px; }
.material-editor-row:has(select)[b-gu28qh862c] { grid-template-columns: 100px minmax(0, 1fr) 38px; }
.material-type[b-gu28qh862c] { align-items: center; align-self: center; color: var(--primary-color); display: inline-flex; font-size: .72rem; font-weight: 800; gap: 6px; }
.remove-material[b-gu28qh862c] { align-items: center; background: color-mix(in srgb, #d44545 9%, var(--card-bg)); border: 0; border-radius: 8px; color: #c93636; cursor: pointer; display: flex; height: 38px; justify-content: center; }
.materials-hint[b-gu28qh862c] { align-items: flex-start; color: var(--text-secondary); display: flex; font-size: .7rem; gap: 7px; line-height: 1.45; margin: 0; }
.homework-editor-summary > span[b-gu28qh862c] { align-items: center; background: linear-gradient(145deg, var(--primary-color), #7048e8); border-radius: 15px; color: #fff; display: flex; font-size: 1.2rem; height: 54px; justify-content: center; width: 54px; }
.homework-editor-summary h2[b-gu28qh862c] { font-size: 1rem; margin: 0; }
.homework-editor-summary dl[b-gu28qh862c] { display: grid; gap: 11px; margin: 0; }
.homework-editor-summary dl div[b-gu28qh862c] { border-top: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent); padding-top: 10px; }
.homework-editor-summary dt[b-gu28qh862c] { color: var(--text-secondary); font-size: .68rem; margin-bottom: 3px; }
.homework-editor-summary dd[b-gu28qh862c] { font-size: .8rem; font-weight: 750; margin: 0; }
.homework-editor-actions[b-gu28qh862c] { display: flex; gap: 10px; justify-content: flex-end; }
.homework-editor-actions a[b-gu28qh862c], .homework-editor-actions button[b-gu28qh862c] { align-items: center; border-radius: 10px; display: inline-flex; font-weight: 800; justify-content: center; min-height: 43px; padding: 0 15px; text-decoration: none; }
.homework-editor-actions a[b-gu28qh862c] { color: var(--text-secondary); }
.homework-editor-actions button[b-gu28qh862c] { background: linear-gradient(135deg, var(--primary-color), #7048e8); border: 0; color: #fff; cursor: pointer; gap: 8px; }
.homework-editor-alert[b-gu28qh862c], .homework-editor-state[b-gu28qh862c] { align-items: center; background: color-mix(in srgb, #d44545 8%, var(--card-bg)); border: 1px solid color-mix(in srgb, #d44545 22%, transparent); border-radius: 12px; color: #bd3030; display: flex; gap: 9px; margin-bottom: 16px; padding: 12px 14px; }
.homework-editor-state[b-gu28qh862c] { color: var(--text-secondary); justify-content: center; min-height: 220px; }
.validation-message[b-gu28qh862c] { color: #c93636; font-size: .7rem; }
@media (max-width: 980px) { .homework-editor-layout[b-gu28qh862c] { grid-template-columns: 1fr; } .homework-editor-side[b-gu28qh862c] { position: static; } }
@media (max-width: 760px) { .homework-materials-heading[b-gu28qh862c] { flex-direction: column; } .material-add-menu[b-gu28qh862c] { justify-content: flex-start; } .material-editor-row[b-gu28qh862c], .material-editor-row:has(select)[b-gu28qh862c] { grid-template-columns: 1fr 38px; } .material-editor-row label[b-gu28qh862c] { grid-column: 1 / -1; } .remove-material[b-gu28qh862c] { grid-column: 2; grid-row: 1; } }
@media (max-width: 520px) { .homework-due-grid[b-gu28qh862c] { grid-template-columns: 1fr; } .homework-editor-actions[b-gu28qh862c] { flex-direction: column-reverse; } .homework-editor-actions a[b-gu28qh862c], .homework-editor-actions button[b-gu28qh862c] { width: 100%; } }
/* /Components/Pages/Teacher/Homework/HomeworkListContent.razor.rz.scp.css */
.homework-list-page[b-ovipl7wcjo] { color: var(--text-color); margin: 0 auto; max-width: 1240px; }
.homework-heading[b-ovipl7wcjo] { align-items: flex-end; display: flex; gap: 20px; justify-content: space-between; margin-bottom: 22px; }
.homework-heading > div > span[b-ovipl7wcjo] { color: var(--primary-color); display: block; font-size: .72rem; font-weight: 850; letter-spacing: .1em; margin-bottom: 5px; text-transform: uppercase; }
.homework-heading h1[b-ovipl7wcjo] { font-size: clamp(1.8rem, 3vw, 2.45rem); margin: 0 0 7px; }
.homework-heading p[b-ovipl7wcjo] { color: var(--text-secondary); margin: 0; max-width: 680px; }
.homework-heading > a[b-ovipl7wcjo] { align-items: center; background: linear-gradient(135deg, var(--primary-color), #7048e8); border-radius: 11px; color: #fff; display: inline-flex; font-weight: 800; gap: 8px; min-height: 44px; padding: 0 17px; text-decoration: none; }
.homework-metrics[b-ovipl7wcjo] { display: grid; gap: 14px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 18px; }
.homework-metrics article[b-ovipl7wcjo] { background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 15px; box-shadow: var(--shadow-sm); display: grid; gap: 2px; padding: 16px 18px; }
.homework-metrics span[b-ovipl7wcjo], .homework-metrics small[b-ovipl7wcjo] { color: var(--text-secondary); font-size: .72rem; }
.homework-metrics strong[b-ovipl7wcjo] { color: var(--primary-color); font-size: 1.65rem; }
.homework-queues[b-ovipl7wcjo] { background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 14px; display: flex; gap: 7px; margin-bottom: 22px; overflow-x: auto; padding: 7px; }
.homework-queues button[b-ovipl7wcjo] { align-items: center; background: transparent; border: 0; border-radius: 9px; color: var(--text-secondary); cursor: pointer; display: inline-flex; flex: 1 0 auto; font: inherit; font-size: .78rem; font-weight: 800; gap: 7px; justify-content: center; min-height: 39px; padding: 0 12px; }
.homework-queues button small[b-ovipl7wcjo] { background: color-mix(in srgb, var(--text-secondary) 12%, transparent); border-radius: 20px; min-width: 24px; padding: 2px 6px; }
.homework-queues button.is-active[b-ovipl7wcjo] { background: color-mix(in srgb, var(--primary-color) 11%, var(--card-bg)); color: var(--primary-color); }
.homework-section-heading[b-ovipl7wcjo] { align-items: center; display: flex; justify-content: space-between; margin-bottom: 13px; }
.homework-section-heading h2[b-ovipl7wcjo] { font-size: 1.05rem; margin: 0 0 3px; }
.homework-section-heading p[b-ovipl7wcjo] { color: var(--text-secondary); font-size: .78rem; margin: 0; }
.homework-cards[b-ovipl7wcjo] { display: grid; gap: 11px; }
.homework-card[b-ovipl7wcjo] { align-items: stretch; background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-left: 4px solid var(--primary-color); border-radius: 14px; box-shadow: var(--shadow-sm); display: grid; gap: 15px; grid-template-columns: 70px minmax(0, 1fr) 42px; padding: 14px; }
.homework-card--submitted[b-ovipl7wcjo] { border-left-color: #e59b25; }
.homework-card--overdue[b-ovipl7wcjo] { border-left-color: #d44545; }
.homework-card--completed[b-ovipl7wcjo] { border-left-color: #2d9a68; }
.homework-card--cancelled[b-ovipl7wcjo] { border-left-color: #8b94a3; }
.homework-card__due[b-ovipl7wcjo] { align-items: center; background: color-mix(in srgb, var(--primary-color) 7%, var(--card-bg)); border-radius: 10px; display: flex; flex-direction: column; justify-content: center; }
.homework-card__due strong[b-ovipl7wcjo] { font-size: 1.25rem; }
.homework-card__due span[b-ovipl7wcjo] { font-size: .68rem; font-weight: 800; text-transform: uppercase; }
.homework-card__due small[b-ovipl7wcjo] { color: var(--text-secondary); font-size: .68rem; margin-top: 3px; }
.homework-card__body[b-ovipl7wcjo] { align-self: center; min-width: 0; }
.homework-card__meta[b-ovipl7wcjo] { align-items: center; color: var(--text-secondary); display: flex; flex-wrap: wrap; font-size: .68rem; gap: 9px; }
.homework-card__meta span[b-ovipl7wcjo] { align-items: center; display: inline-flex; gap: 4px; }
.homework-card__meta .status[b-ovipl7wcjo] { color: var(--primary-color); font-weight: 850; }
.homework-card h3[b-ovipl7wcjo] { font-size: .96rem; margin: 6px 0; }
.homework-card h3 a[b-ovipl7wcjo] { color: var(--text-color); text-decoration: none; }
.student-link[b-ovipl7wcjo] { align-items: center; color: var(--text-secondary); display: inline-flex; font-size: .74rem; gap: 6px; text-decoration: none; }
.homework-card__open[b-ovipl7wcjo] { align-items: center; align-self: center; border-radius: 9px; color: var(--primary-color); display: flex; height: 38px; justify-content: center; text-decoration: none; }
.homework-empty[b-ovipl7wcjo], .homework-state[b-ovipl7wcjo] { align-items: center; background: var(--card-bg); border: 1px dashed color-mix(in srgb, var(--text-secondary) 25%, transparent); border-radius: 15px; color: var(--text-secondary); display: flex; flex-direction: column; gap: 7px; justify-content: center; min-height: 240px; padding: 25px; text-align: center; }
.homework-empty > i[b-ovipl7wcjo] { color: var(--primary-color); font-size: 1.6rem; }
.homework-empty h3[b-ovipl7wcjo], .homework-empty p[b-ovipl7wcjo] { margin: 0; }
.homework-empty p[b-ovipl7wcjo] { font-size: .8rem; }
.homework-state--error[b-ovipl7wcjo] { color: #bd3030; }
@media (max-width: 850px) { .homework-metrics[b-ovipl7wcjo] { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .homework-heading[b-ovipl7wcjo] { align-items: stretch; flex-direction: column; } .homework-heading > a[b-ovipl7wcjo] { justify-content: center; } .homework-card[b-ovipl7wcjo] { grid-template-columns: 58px minmax(0, 1fr); } .homework-card__open[b-ovipl7wcjo] { display: none; } }
/* /Components/Pages/Teacher/Lessons/LessonDetailsContent.razor.rz.scp.css */
.lesson-details-page[b-4ly9pje7ji] { color: var(--text-color); margin: 0 auto; max-width: 1320px; }
.lesson-details-heading[b-4ly9pje7ji] { align-items: center; background: linear-gradient(135deg, color-mix(in srgb, var(--primary-color) 10%, var(--card-bg)), var(--card-bg) 70%); border: 1px solid color-mix(in srgb, var(--primary-color) 17%, transparent); border-radius: 20px; box-shadow: var(--shadow-sm); display: grid; gap: 15px; grid-template-columns: auto auto minmax(0, 1fr) auto; margin-bottom: 16px; padding: 20px; }
.lesson-details-back[b-4ly9pje7ji] { align-items: center; border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent); border-radius: 10px; color: var(--text-secondary); display: flex; height: 40px; justify-content: center; text-decoration: none; width: 40px; }
.lesson-details-date[b-4ly9pje7ji] { align-items: center; background: linear-gradient(145deg, var(--primary-color), #7048e8); border-radius: 15px; color: #fff; display: flex; flex-direction: column; height: 64px; justify-content: center; text-transform: uppercase; width: 64px; }
.lesson-details-date strong[b-4ly9pje7ji] { font-size: 1.35rem; line-height: 1; }
.lesson-details-date span[b-4ly9pje7ji] { font-size: .65rem; font-weight: 800; margin-top: 4px; }
.lesson-details-title > div[b-4ly9pje7ji] { align-items: center; color: var(--text-secondary); display: flex; flex-wrap: wrap; font-size: .7rem; gap: 8px; }
.lesson-details-title > div > span[b-4ly9pje7ji] { align-items: center; display: inline-flex; gap: 5px; }
.lesson-details-status[b-4ly9pje7ji] { background: color-mix(in srgb, #4d72e8 11%, var(--card-bg)); border-radius: 999px; color: #3459c7; font-weight: 850; padding: 4px 8px; }
.lesson-details-status--confirmed[b-4ly9pje7ji], .lesson-details-status--completed[b-4ly9pje7ji] { background: color-mix(in srgb, #20a85b 12%, var(--card-bg)); color: #16814d; }
.lesson-details-status--inprogress[b-4ly9pje7ji] { background: color-mix(in srgb, #8a49e8 12%, var(--card-bg)); color: #7041c6; }
.lesson-details-status--cancelled[b-4ly9pje7ji], .lesson-details-status--studentabsent[b-4ly9pje7ji] { background: color-mix(in srgb, #c84b4b 11%, var(--card-bg)); color: #b03838; }
.lesson-details-status--rescheduled[b-4ly9pje7ji] { background: color-mix(in srgb, #d89416 13%, var(--card-bg)); color: #9c6500; }
.lesson-details-title h1[b-4ly9pje7ji] { font-size: clamp(1.45rem, 3vw, 2.05rem); margin: 5px 0 3px; }
.lesson-details-title p[b-4ly9pje7ji] { color: var(--text-secondary); font-size: .83rem; margin: 0; text-transform: capitalize; }
.lesson-details-edit[b-4ly9pje7ji] { align-items: center; background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--primary-color) 24%, transparent); border-radius: 11px; color: var(--primary-color); display: inline-flex; font-size: .8rem; font-weight: 800; gap: 7px; min-height: 42px; padding: 0 13px; text-decoration: none; }
.lesson-details-actions[b-4ly9pje7ji] { align-items: center; background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 14px; display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 17px; padding: 10px; }
.lesson-details-actions button[b-4ly9pje7ji] { align-items: center; border: 0; border-radius: 9px; cursor: pointer; display: inline-flex; font-size: .74rem; font-weight: 800; gap: 7px; min-height: 39px; padding: 0 12px; }
.lesson-details-actions .action-room[b-4ly9pje7ji] { align-items: center; background: linear-gradient(135deg, var(--primary-color), #7048e8); border-radius: 9px; color: #fff; display: inline-flex; font-size: .74rem; font-weight: 800; gap: 7px; margin-left: auto; min-height: 39px; padding: 0 12px; text-decoration: none; }
.action-confirm[b-4ly9pje7ji], .action-complete[b-4ly9pje7ji] { background: color-mix(in srgb, #20a85b 12%, var(--card-bg)); color: #16814d; }
.action-start[b-4ly9pje7ji] { background: linear-gradient(135deg, var(--primary-color), #7048e8); color: #fff; }
.action-muted[b-4ly9pje7ji] { background: color-mix(in srgb, var(--text-secondary) 8%, var(--card-bg)); color: var(--text-secondary); }
.action-danger[b-4ly9pje7ji] { background: color-mix(in srgb, #c84b4b 10%, var(--card-bg)); color: #b03838; }
.lesson-room-note[b-4ly9pje7ji] { align-items: center; color: var(--text-secondary); display: inline-flex; font-size: .69rem; gap: 6px; margin-left: auto; }
.lesson-details-grid[b-4ly9pje7ji] { align-items: start; display: grid; gap: 17px; grid-template-columns: minmax(0, 1.45fr) minmax(290px, .65fr); }
.lesson-details-main[b-4ly9pje7ji], .lesson-details-side[b-4ly9pje7ji] { display: grid; gap: 17px; }
.lesson-panel[b-4ly9pje7ji] { background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 17px; box-shadow: var(--shadow-sm); padding: 18px; }
.lesson-panel-title[b-4ly9pje7ji] { align-items: flex-start; display: flex; gap: 11px; margin-bottom: 16px; }
.lesson-panel-title > span[b-4ly9pje7ji] { align-items: center; background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg)); border-radius: 10px; color: var(--primary-color); display: flex; height: 38px; justify-content: center; width: 38px; }
.lesson-panel-title h2[b-4ly9pje7ji] { font-size: .98rem; margin: 0 0 2px; }
.lesson-panel-title p[b-4ly9pje7ji] { color: var(--text-secondary); font-size: .73rem; margin: 0; }
.lesson-student-card[b-4ly9pje7ji] { align-items: center; background: color-mix(in srgb, var(--text-secondary) 4%, var(--card-bg)); border-radius: 12px; display: grid; gap: 12px; grid-template-columns: auto minmax(0, 1fr) auto; padding: 13px; }
.lesson-student-card > span[b-4ly9pje7ji] { align-items: center; background: color-mix(in srgb, var(--primary-color) 12%, var(--card-bg)); border-radius: 11px; color: var(--primary-color); display: flex; font-weight: 850; height: 43px; justify-content: center; width: 43px; }
.lesson-student-card > div[b-4ly9pje7ji] { display: grid; gap: 2px; }
.lesson-student-card small[b-4ly9pje7ji] { color: var(--text-secondary); font-size: .7rem; }
.lesson-student-card a[b-4ly9pje7ji] { color: var(--primary-color); font-size: .72rem; font-weight: 800; text-decoration: none; }
.lesson-student-card a i[b-4ly9pje7ji] { margin-left: 7px; }
.lesson-content-list[b-4ly9pje7ji], .schedule-panel dl[b-4ly9pje7ji] { display: grid; gap: 12px; margin: 0; }
.lesson-content-list > div[b-4ly9pje7ji], .schedule-panel dl > div[b-4ly9pje7ji] { background: color-mix(in srgb, var(--text-secondary) 4%, var(--card-bg)); border-radius: 10px; padding: 11px; }
.lesson-content-list dt[b-4ly9pje7ji], .schedule-panel dt[b-4ly9pje7ji] { color: var(--text-secondary); font-size: .68rem; margin-bottom: 4px; }
.lesson-content-list dd[b-4ly9pje7ji] { line-height: 1.5; white-space: pre-wrap; }
.lesson-content-list dd[b-4ly9pje7ji], .schedule-panel dd[b-4ly9pje7ji] { font-size: .8rem; margin: 0; }
.lesson-history-panel ol[b-4ly9pje7ji] { list-style: none; margin: 0; padding: 0; }
.lesson-history-panel li[b-4ly9pje7ji] { display: grid; gap: 11px; grid-template-columns: auto 1fr; min-height: 58px; position: relative; }
.lesson-history-panel li:not(:last-child)[b-4ly9pje7ji]::before { background: color-mix(in srgb, var(--primary-color) 20%, transparent); content: ""; height: calc(100% - 31px); left: 15px; position: absolute; top: 32px; width: 1px; }
.lesson-history-panel li > span[b-4ly9pje7ji] { align-items: center; background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg)); border-radius: 9px; color: var(--primary-color); display: flex; height: 31px; justify-content: center; width: 31px; }
.lesson-history-panel li > div[b-4ly9pje7ji] { display: grid; gap: 2px; padding-top: 2px; }
.lesson-history-panel strong[b-4ly9pje7ji] { font-size: .79rem; }
.lesson-history-panel time[b-4ly9pje7ji] { color: var(--text-secondary); font-size: .67rem; }
.lesson-details-side[b-4ly9pje7ji] { position: sticky; top: 84px; }
.reschedule-panel label[b-4ly9pje7ji] { display: grid; gap: 5px; margin-top: 11px; }
.reschedule-panel label span[b-4ly9pje7ji] { font-size: .72rem; font-weight: 750; }
.reschedule-panel input[b-4ly9pje7ji] { background: color-mix(in srgb, var(--card-bg) 97%, var(--text-color)); border: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent); border-radius: 9px; color: var(--text-color); min-height: 40px; padding: 8px 10px; width: 100%; }
.reschedule-panel > button[b-4ly9pje7ji] { align-items: center; background: linear-gradient(135deg, var(--primary-color), #7048e8); border: 0; border-radius: 10px; color: #fff; cursor: pointer; display: flex; font-weight: 800; gap: 7px; justify-content: center; margin-top: 13px; min-height: 41px; width: 100%; }
.lesson-details-alert[b-4ly9pje7ji], .lesson-details-state[b-4ly9pje7ji] { align-items: center; background: color-mix(in srgb, #d44545 8%, var(--card-bg)); border: 1px solid color-mix(in srgb, #d44545 22%, transparent); border-radius: 12px; color: #bd3030; display: flex; gap: 9px; margin-bottom: 15px; padding: 12px 14px; }
.lesson-details-state[b-4ly9pje7ji] { color: var(--text-secondary); justify-content: center; min-height: 220px; }
.lesson-details-state div[b-4ly9pje7ji] { display: grid; gap: 5px; }
.lesson-details-state a[b-4ly9pje7ji] { color: var(--primary-color); }
@media (max-width: 980px) { .lesson-details-grid[b-4ly9pje7ji] { grid-template-columns: 1fr; } .lesson-details-side[b-4ly9pje7ji] { position: static; } }
@media (max-width: 720px) { .lesson-details-heading[b-4ly9pje7ji] { grid-template-columns: auto auto minmax(0, 1fr); padding: 16px; } .lesson-details-edit[b-4ly9pje7ji] { grid-column: 1 / -1; justify-content: center; } .lesson-details-actions .action-room[b-4ly9pje7ji] { flex-basis: 100%; justify-content: center; margin-left: 0; } }
@media (max-width: 500px) { .lesson-details-heading[b-4ly9pje7ji] { grid-template-columns: auto 1fr; } .lesson-details-title[b-4ly9pje7ji] { grid-column: 1 / -1; } .lesson-student-card[b-4ly9pje7ji] { grid-template-columns: auto 1fr; } .lesson-student-card a[b-4ly9pje7ji] { grid-column: 1 / -1; } .lesson-details-actions button[b-4ly9pje7ji] { justify-content: center; width: 100%; } }
/* /Components/Pages/Teacher/Lessons/LessonEditorContent.razor.rz.scp.css */
.lesson-editor-page[b-p1ik1kvn8w] { color: var(--text-color); margin: 0 auto; max-width: 1240px; }
.lesson-editor-heading[b-p1ik1kvn8w] { align-items: flex-start; display: flex; gap: 14px; margin-bottom: 23px; }
.lesson-editor-heading > a[b-p1ik1kvn8w] { align-items: center; background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent); border-radius: 11px; color: var(--text-color); display: flex; flex: 0 0 42px; height: 42px; justify-content: center; text-decoration: none; }
.lesson-editor-heading span[b-p1ik1kvn8w] { color: var(--primary-color); display: block; font-size: .72rem; font-weight: 850; letter-spacing: .1em; margin-bottom: 4px; text-transform: uppercase; }
.lesson-editor-heading h1[b-p1ik1kvn8w] { font-size: clamp(1.65rem, 3vw, 2.3rem); margin: 0 0 5px; }
.lesson-editor-heading p[b-p1ik1kvn8w] { color: var(--text-secondary); margin: 0; }
.lesson-editor-layout[b-p1ik1kvn8w] { align-items: start; display: grid; gap: 18px; grid-template-columns: minmax(0, 1.65fr) minmax(280px, .75fr); }
.lesson-editor-main[b-p1ik1kvn8w], .lesson-editor-side[b-p1ik1kvn8w] { display: grid; gap: 18px; }
.lesson-editor-side[b-p1ik1kvn8w] { position: sticky; top: 84px; }
.lesson-form-card[b-p1ik1kvn8w], .lesson-editor-summary[b-p1ik1kvn8w] { background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 17px; box-shadow: var(--shadow-sm); display: grid; gap: 17px; padding: 20px; }
.lesson-form-card__title[b-p1ik1kvn8w] { align-items: flex-start; display: flex; gap: 12px; }
.lesson-form-card__title > i[b-p1ik1kvn8w] { align-items: center; background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg)); border-radius: 10px; color: var(--primary-color); display: flex; height: 38px; justify-content: center; width: 38px; }
.lesson-form-card h2[b-p1ik1kvn8w] { font-size: .98rem; margin: 0 0 2px; }
.lesson-form-card__title p[b-p1ik1kvn8w] { color: var(--text-secondary); font-size: .77rem; margin: 0; }
.lesson-form-card label[b-p1ik1kvn8w] { display: grid; gap: 6px; }
.lesson-form-card label > span[b-p1ik1kvn8w] { font-size: .78rem; font-weight: 750; }
.lesson-form-card label > span b[b-p1ik1kvn8w] { color: #d44545; }
.lesson-form-card input[b-p1ik1kvn8w], .lesson-form-card select[b-p1ik1kvn8w], .lesson-form-card textarea[b-p1ik1kvn8w] { background: color-mix(in srgb, var(--card-bg) 97%, var(--text-color)); border: 1px solid color-mix(in srgb, var(--text-secondary) 23%, transparent); border-radius: 10px; color: var(--text-color); font: inherit; outline: none; padding: 10px 12px; width: 100%; }
.lesson-form-card input[b-p1ik1kvn8w], .lesson-form-card select[b-p1ik1kvn8w] { min-height: 44px; }
.lesson-form-card textarea[b-p1ik1kvn8w] { resize: vertical; }
.lesson-form-card input:focus[b-p1ik1kvn8w], .lesson-form-card select:focus[b-p1ik1kvn8w], .lesson-form-card textarea:focus[b-p1ik1kvn8w] { border-color: var(--primary-color); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 12%, transparent); }
.lesson-form-grid[b-p1ik1kvn8w] { display: grid; gap: 14px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lesson-form-grid--schedule[b-p1ik1kvn8w] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.validation-message[b-p1ik1kvn8w] { color: #c93636; font-size: .7rem; }
.lesson-editor-summary[b-p1ik1kvn8w] { position: static; }
.lesson-editor-summary__icon[b-p1ik1kvn8w] { align-items: center; background: linear-gradient(145deg, var(--primary-color), #7048e8); border-radius: 15px; color: #fff; display: flex; font-size: 1.2rem; height: 54px; justify-content: center; width: 54px; }
.lesson-editor-summary h2[b-p1ik1kvn8w] { font-size: 1rem; margin: 0; }
.lesson-editor-summary dl[b-p1ik1kvn8w] { display: grid; gap: 11px; margin: 0; }
.lesson-editor-summary dl div[b-p1ik1kvn8w] { border-top: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent); padding-top: 10px; }
.lesson-editor-summary dt[b-p1ik1kvn8w] { color: var(--text-secondary); font-size: .68rem; margin-bottom: 3px; }
.lesson-editor-summary dd[b-p1ik1kvn8w] { font-size: .8rem; font-weight: 750; margin: 0; }
.lesson-editor-summary > p[b-p1ik1kvn8w] { align-items: flex-start; background: color-mix(in srgb, var(--primary-color) 7%, var(--card-bg)); border-radius: 10px; color: var(--text-secondary); display: flex; font-size: .7rem; gap: 8px; line-height: 1.45; margin: 0; padding: 10px; }
.lesson-editor-actions[b-p1ik1kvn8w] { display: flex; gap: 10px; justify-content: flex-end; }
.lesson-editor-actions a[b-p1ik1kvn8w], .lesson-editor-actions button[b-p1ik1kvn8w] { align-items: center; border-radius: 10px; display: inline-flex; font-weight: 800; justify-content: center; min-height: 43px; padding: 0 15px; text-decoration: none; }
.lesson-editor-actions a[b-p1ik1kvn8w] { color: var(--text-secondary); }
.lesson-editor-actions button[b-p1ik1kvn8w] { background: linear-gradient(135deg, var(--primary-color), #7048e8); border: 0; color: #fff; cursor: pointer; gap: 8px; }
.lesson-editor-alert[b-p1ik1kvn8w], .lesson-editor-state[b-p1ik1kvn8w] { align-items: center; background: color-mix(in srgb, #d44545 8%, var(--card-bg)); border: 1px solid color-mix(in srgb, #d44545 22%, transparent); border-radius: 12px; color: #bd3030; display: flex; gap: 9px; margin-bottom: 16px; padding: 12px 14px; }
.lesson-editor-state[b-p1ik1kvn8w] { color: var(--text-secondary); justify-content: center; min-height: 220px; }
@media (max-width: 980px) { .lesson-editor-layout[b-p1ik1kvn8w] { grid-template-columns: 1fr; } .lesson-editor-side[b-p1ik1kvn8w] { position: static; } }
@media (max-width: 720px) { .lesson-form-grid--schedule[b-p1ik1kvn8w] { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .lesson-form-grid[b-p1ik1kvn8w], .lesson-form-grid--schedule[b-p1ik1kvn8w] { grid-template-columns: 1fr; } .lesson-editor-actions[b-p1ik1kvn8w] { flex-direction: column-reverse; } .lesson-editor-actions a[b-p1ik1kvn8w], .lesson-editor-actions button[b-p1ik1kvn8w] { width: 100%; } }
/* /Components/Pages/Teacher/Lessons/LessonsListContent.razor.rz.scp.css */
.lessons-page[b-ucj2erjnq1] { color: var(--text-color); margin: 0 auto; max-width: 1380px; }

.lessons-heading[b-ucj2erjnq1] { align-items: flex-end; display: flex; gap: 24px; justify-content: space-between; margin-bottom: 22px; }
.lessons-eyebrow[b-ucj2erjnq1] { color: var(--primary-color); display: block; font-size: .74rem; font-weight: 850; letter-spacing: .11em; margin-bottom: 5px; text-transform: uppercase; }
.lessons-heading h1[b-ucj2erjnq1] { font-size: clamp(1.8rem, 3vw, 2.45rem); margin: 0 0 6px; }
.lessons-heading p[b-ucj2erjnq1] { color: var(--text-secondary); margin: 0; max-width: 720px; }
.lessons-primary-action[b-ucj2erjnq1], .lessons-empty a[b-ucj2erjnq1] { align-items: center; background: linear-gradient(135deg, var(--primary-color), #7048e8); border-radius: 12px; box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent); color: #fff; display: inline-flex; flex: 0 0 auto; font-weight: 800; gap: 9px; min-height: 44px; padding: 0 17px; text-decoration: none; }

.lesson-metrics[b-ucj2erjnq1] { display: grid; gap: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 16px; }
.lesson-metrics article[b-ucj2erjnq1] { background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 15px; box-shadow: var(--shadow-sm); display: grid; gap: 2px; padding: 15px 17px; }
.lesson-metrics span[b-ucj2erjnq1], .lesson-metrics small[b-ucj2erjnq1] { color: var(--text-secondary); font-size: .72rem; }
.lesson-metrics strong[b-ucj2erjnq1] { color: var(--primary-color); font-size: 1.55rem; line-height: 1.1; }

.lessons-toolbar[b-ucj2erjnq1] { align-items: center; background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 15px; display: flex; gap: 18px; justify-content: space-between; margin-bottom: 18px; padding: 8px; }
.lessons-toolbar nav[b-ucj2erjnq1] { display: flex; gap: 4px; overflow-x: auto; }
.lessons-toolbar nav button[b-ucj2erjnq1] { align-items: center; background: transparent; border: 0; border-radius: 9px; color: var(--text-secondary); cursor: pointer; display: inline-flex; flex: 0 0 auto; font-size: .78rem; font-weight: 750; gap: 7px; min-height: 40px; padding: 0 12px; }
.lessons-toolbar nav button:hover[b-ucj2erjnq1], .lessons-toolbar nav button.is-active[b-ucj2erjnq1] { background: color-mix(in srgb, var(--primary-color) 11%, var(--card-bg)); color: var(--primary-color); }
.lessons-toolbar label[b-ucj2erjnq1] { align-items: center; display: flex; flex: 0 0 auto; gap: 8px; }
.lessons-toolbar label span[b-ucj2erjnq1] { color: var(--text-secondary); font-size: .72rem; font-weight: 750; }
.lessons-toolbar select[b-ucj2erjnq1] { background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent); border-radius: 9px; color: var(--text-color); min-height: 38px; padding: 0 10px; }

.lesson-agenda[b-ucj2erjnq1], .month-calendar[b-ucj2erjnq1] { background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 18px; box-shadow: var(--shadow-sm); padding: 18px; }
.agenda-heading[b-ucj2erjnq1], .calendar-toolbar[b-ucj2erjnq1] { align-items: center; display: flex; gap: 16px; justify-content: space-between; margin-bottom: 18px; }
.agenda-heading h2[b-ucj2erjnq1], .calendar-toolbar h2[b-ucj2erjnq1] { font-size: 1.2rem; margin: 0 0 3px; }
.agenda-heading p[b-ucj2erjnq1] { color: var(--text-secondary); font-size: .8rem; margin: 0; }
.agenda-navigation[b-ucj2erjnq1] { align-items: center; display: flex; gap: 10px; }
.agenda-navigation button[b-ucj2erjnq1], .calendar-toolbar button[b-ucj2erjnq1] { align-items: center; background: transparent; border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent); border-radius: 9px; color: var(--text-secondary); cursor: pointer; display: flex; height: 36px; justify-content: center; width: 36px; }
.agenda-navigation span[b-ucj2erjnq1] { font-size: .78rem; font-weight: 800; min-width: 100px; text-align: center; }

.agenda-day[b-ucj2erjnq1] { display: grid; gap: 16px; grid-template-columns: 150px minmax(0, 1fr); padding: 15px 0; }
.agenda-day + .agenda-day[b-ucj2erjnq1] { border-top: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent); }
.agenda-day__date[b-ucj2erjnq1] { display: flex; flex-direction: column; gap: 3px; }
.agenda-day__date strong[b-ucj2erjnq1] { font-size: .82rem; text-transform: capitalize; }
.agenda-day__date span[b-ucj2erjnq1] { color: var(--text-secondary); font-size: .7rem; }
.agenda-day__items[b-ucj2erjnq1] { display: grid; gap: 10px; }
.lesson-row[b-ucj2erjnq1] { align-items: center; background: color-mix(in srgb, var(--text-secondary) 3%, var(--card-bg)); border-left: 4px solid #4d72e8; border-radius: 12px; display: grid; gap: 15px; grid-template-columns: 74px minmax(0, 1fr) auto; padding: 13px; }
.lesson-row--confirmed[b-ucj2erjnq1] { border-left-color: #20a85b; }
.lesson-row--inprogress[b-ucj2erjnq1] { border-left-color: #8a49e8; }
.lesson-row--completed[b-ucj2erjnq1] { border-left-color: #16814d; }
.lesson-row--cancelled[b-ucj2erjnq1], .lesson-row--studentabsent[b-ucj2erjnq1] { border-left-color: #c84b4b; }
.lesson-row--rescheduled[b-ucj2erjnq1] { border-left-color: #d89416; }
.lesson-row__time[b-ucj2erjnq1] { display: grid; gap: 2px; }
.lesson-row__time strong[b-ucj2erjnq1] { font-size: 1rem; }
.lesson-row__time span[b-ucj2erjnq1] { color: var(--text-secondary); font-size: .68rem; }
.lesson-row__main > div[b-ucj2erjnq1] { align-items: center; display: flex; flex-wrap: wrap; gap: 7px; }
.lesson-status[b-ucj2erjnq1], .lesson-format[b-ucj2erjnq1] { align-items: center; background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg)); border-radius: 999px; color: var(--text-secondary); display: inline-flex; font-size: .66rem; font-weight: 750; gap: 5px; padding: 4px 7px; }
.lesson-row__main h3[b-ucj2erjnq1] { font-size: .92rem; margin: 7px 0 4px; }
.lesson-row__main h3 a[b-ucj2erjnq1] { color: var(--text-color); text-decoration: none; }
.lesson-student[b-ucj2erjnq1] { color: var(--primary-color); font-size: .72rem; font-weight: 750; text-decoration: none; }
.lesson-student i[b-ucj2erjnq1] { margin-right: 5px; }
.lesson-row__open[b-ucj2erjnq1] { align-items: center; border: 1px solid color-mix(in srgb, var(--primary-color) 22%, transparent); border-radius: 9px; color: var(--primary-color); display: flex; height: 36px; justify-content: center; text-decoration: none; width: 36px; }

.calendar-toolbar h2[b-ucj2erjnq1] { text-transform: capitalize; }
.calendar-weekdays[b-ucj2erjnq1], .calendar-grid[b-ucj2erjnq1] { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.calendar-weekdays[b-ucj2erjnq1] { color: var(--text-secondary); font-size: .68rem; font-weight: 800; text-align: center; }
.calendar-weekdays span[b-ucj2erjnq1] { padding: 7px; }
.calendar-grid[b-ucj2erjnq1] { border-left: 1px solid color-mix(in srgb, var(--text-secondary) 13%, transparent); border-top: 1px solid color-mix(in srgb, var(--text-secondary) 13%, transparent); }
.calendar-day[b-ucj2erjnq1] { border-bottom: 1px solid color-mix(in srgb, var(--text-secondary) 13%, transparent); border-right: 1px solid color-mix(in srgb, var(--text-secondary) 13%, transparent); min-height: 115px; min-width: 0; padding: 8px; }
.calendar-day.is-outside[b-ucj2erjnq1] { opacity: .42; }
.calendar-day.is-today[b-ucj2erjnq1] { background: color-mix(in srgb, var(--primary-color) 6%, var(--card-bg)); }
.calendar-day__number[b-ucj2erjnq1] { align-items: center; display: flex; font-size: .72rem; font-weight: 800; height: 24px; justify-content: center; width: 24px; }
.calendar-day.is-today .calendar-day__number[b-ucj2erjnq1] { background: var(--primary-color); border-radius: 50%; color: #fff; }
.calendar-day__lessons[b-ucj2erjnq1] { display: grid; gap: 4px; margin-top: 5px; }
.lesson-dot[b-ucj2erjnq1] { background: color-mix(in srgb, #4d72e8 11%, var(--card-bg)); border-radius: 6px; color: var(--text-color); display: grid; font-size: .62rem; gap: 1px; min-width: 0; padding: 4px 5px; text-decoration: none; }
.lesson-dot time[b-ucj2erjnq1] { color: var(--primary-color); font-weight: 850; }
.lesson-dot span[b-ucj2erjnq1] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lesson-dot--completed[b-ucj2erjnq1] { background: color-mix(in srgb, #20a85b 11%, var(--card-bg)); }
.lesson-dot--cancelled[b-ucj2erjnq1], .lesson-dot--studentabsent[b-ucj2erjnq1] { background: color-mix(in srgb, #c84b4b 10%, var(--card-bg)); }
.lesson-dot--rescheduled[b-ucj2erjnq1] { background: color-mix(in srgb, #d89416 12%, var(--card-bg)); }
.calendar-day__lessons small[b-ucj2erjnq1] { color: var(--text-secondary); font-size: .6rem; }

.lessons-state[b-ucj2erjnq1], .lessons-empty[b-ucj2erjnq1] { align-items: center; background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 18px; color: var(--text-secondary); display: flex; gap: 10px; justify-content: center; min-height: 220px; padding: 28px; text-align: center; }
.lessons-state--error[b-ucj2erjnq1] { color: #c23b3b; }
.lessons-empty[b-ucj2erjnq1] { border: 0; box-shadow: none; flex-direction: column; }
.lessons-empty > span[b-ucj2erjnq1] { align-items: center; background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg)); border-radius: 17px; color: var(--primary-color); display: flex; font-size: 1.4rem; height: 60px; justify-content: center; width: 60px; }
.lessons-empty h3[b-ucj2erjnq1] { color: var(--text-color); margin: 6px 0 0; }
.lessons-empty p[b-ucj2erjnq1] { margin: 0 0 8px; }

@media (max-width: 850px) {
    .lesson-metrics[b-ucj2erjnq1] { grid-template-columns: 1fr; }
    .lessons-toolbar[b-ucj2erjnq1] { align-items: stretch; flex-direction: column; }
    .lessons-toolbar label[b-ucj2erjnq1] { justify-content: space-between; }
    .lessons-toolbar select[b-ucj2erjnq1] { flex: 1; }
    .agenda-day[b-ucj2erjnq1] { grid-template-columns: 1fr; }
    .agenda-day__date[b-ucj2erjnq1] { align-items: baseline; flex-direction: row; }
    .month-calendar[b-ucj2erjnq1] { overflow-x: auto; }
    .calendar-weekdays[b-ucj2erjnq1], .calendar-grid[b-ucj2erjnq1] { min-width: 760px; }
}

@media (max-width: 620px) {
    .lessons-heading[b-ucj2erjnq1] { align-items: stretch; flex-direction: column; }
    .lessons-primary-action[b-ucj2erjnq1] { justify-content: center; }
    .lesson-agenda[b-ucj2erjnq1], .month-calendar[b-ucj2erjnq1] { padding: 13px; }
    .agenda-heading[b-ucj2erjnq1] { align-items: stretch; flex-direction: column; }
    .agenda-navigation[b-ucj2erjnq1] { justify-content: space-between; }
    .lesson-row[b-ucj2erjnq1] { align-items: start; grid-template-columns: 62px minmax(0, 1fr); }
    .lesson-row__open[b-ucj2erjnq1] { grid-column: 1 / -1; justify-self: stretch; width: auto; }
}
/* /Components/Pages/Teacher/Students/EmptyProfileSection.razor.rz.scp.css */
.empty-profile-section[b-w66w2l5a1c] {
    align-items: center;
    background: var(--card-bg);
    border: 1px dashed color-mix(in srgb, var(--text-secondary) 24%, transparent);
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    min-height: 230px;
    padding: 28px;
    text-align: center;
}

.empty-profile-section > span[b-w66w2l5a1c] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg));
    border-radius: 14px;
    color: var(--primary-color);
    display: flex;
    font-size: 1.2rem;
    height: 52px;
    justify-content: center;
    width: 52px;
}

.empty-profile-section h3[b-w66w2l5a1c] { font-size: 1rem; margin: 13px 0 4px; }
.empty-profile-section p[b-w66w2l5a1c] { color: var(--text-secondary); font-size: .79rem; margin: 0; max-width: 420px; }
/* /Components/Pages/Teacher/Students/OverviewTab.razor.rz.scp.css */
.overview-tab[b-cbju7uk7nn] {
    align-items: start;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1.45fr) minmax(290px, .72fr);
}

.overview-main[b-cbju7uk7nn],
.overview-side[b-cbju7uk7nn] {
    display: grid;
    gap: 15px;
}

.overview-card[b-cbju7uk7nn] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    padding: 18px;
}

.overview-card > header[b-cbju7uk7nn] {
    align-items: center;
    display: flex;
    gap: 12px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    margin-bottom: 15px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.overview-card h2[b-cbju7uk7nn] {
    font-size: .96rem;
    margin: 0;
}

.overview-card > header a[b-cbju7uk7nn],
.overview-card > header button[b-cbju7uk7nn],
.overview-empty-contact button[b-cbju7uk7nn],
.overview-empty-contact a[b-cbju7uk7nn] {
    background: transparent;
    border: 0;
    color: var(--primary-color);
    cursor: pointer;
    font-size: .72rem;
    font-weight: 800;
    padding: 0;
    text-decoration: none;
}

.overview-info-grid[b-cbju7uk7nn] {
    display: grid;
    gap: 11px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
}

.overview-info-grid div[b-cbju7uk7nn] {
    background: color-mix(in srgb, var(--text-secondary) 4%, var(--card-bg));
    border-radius: 10px;
    padding: 11px;
}

.overview-info-grid dt[b-cbju7uk7nn] { color: var(--text-secondary); font-size: .68rem; margin-bottom: 3px; }
.overview-info-grid dd[b-cbju7uk7nn] { font-size: .81rem; margin: 0; overflow-wrap: anywhere; }

.overview-long-text[b-cbju7uk7nn] {
    line-height: 1.55;
    margin: 0;
    white-space: pre-wrap;
}

.overview-card--private[b-cbju7uk7nn] {
    border-left: 4px solid #ca8d18;
}

.overview-card--private header span[b-cbju7uk7nn] {
    background: color-mix(in srgb, #ca8d18 12%, var(--card-bg));
    border-radius: 999px;
    color: #956300;
    font-size: .65rem;
    font-weight: 800;
    padding: 5px 8px;
}

.overview-card--private h2 i[b-cbju7uk7nn] { color: #b57a09; margin-right: 5px; }

.overview-contact-card > strong[b-cbju7uk7nn] { display: block; font-size: 1rem; }
.overview-contact-card > span[b-cbju7uk7nn] { color: var(--text-secondary); display: block; font-size: .74rem; margin-top: 2px; }

.overview-contact-lines[b-cbju7uk7nn] {
    display: grid;
    gap: 9px;
    margin-top: 15px;
}

.overview-contact-lines span[b-cbju7uk7nn] {
    align-items: center;
    display: flex;
    font-size: .78rem;
    gap: 9px;
    overflow-wrap: anywhere;
}

.overview-contact-lines i[b-cbju7uk7nn] { color: var(--primary-color); width: 14px; }

.overview-empty-contact[b-cbju7uk7nn] {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    flex-direction: column;
    padding: 14px 5px 7px;
    text-align: center;
}

.overview-empty-contact > i[b-cbju7uk7nn] { color: var(--primary-color); font-size: 1.25rem; }
.overview-empty-contact p[b-cbju7uk7nn] { font-size: .76rem; margin: 9px 0; }

.overview-history[b-cbju7uk7nn] {
    display: grid;
    gap: 12px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.overview-history li[b-cbju7uk7nn] {
    display: grid;
    gap: 9px;
    grid-template-columns: auto 1fr;
}

.overview-history li > span[b-cbju7uk7nn] {
    background: var(--primary-color);
    border-radius: 50%;
    height: 7px;
    margin-top: 6px;
    width: 7px;
}

.overview-history li div[b-cbju7uk7nn] { display: grid; gap: 2px; }
.overview-history strong[b-cbju7uk7nn] { font-size: .75rem; }
.overview-history time[b-cbju7uk7nn] { color: var(--text-secondary); font-size: .67rem; }

@media (max-width: 1000px) {
    .overview-tab[b-cbju7uk7nn] { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
    .overview-info-grid[b-cbju7uk7nn] { grid-template-columns: 1fr; }
}
/* /Components/Pages/Teacher/Students/StudentAccessPanel.razor.rz.scp.css */
.student-access-card[b-hh8tdy7jlw] { background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 16px; box-shadow: var(--shadow-sm); display: grid; gap: 14px; padding: 17px; }
.student-access-card > header[b-hh8tdy7jlw] { align-items: flex-start; display: flex; gap: 10px; justify-content: space-between; }
.student-access-card > header > div[b-hh8tdy7jlw] { align-items: center; display: flex; gap: 10px; }
.student-access-card > header > div > span[b-hh8tdy7jlw] { align-items: center; background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg)); border-radius: 10px; color: var(--primary-color); display: flex; height: 38px; justify-content: center; width: 38px; }
.student-access-card h2[b-hh8tdy7jlw] { font-size: .9rem; margin: 0; }
.student-access-card header p[b-hh8tdy7jlw] { color: var(--text-secondary); font-size: .67rem; margin: 2px 0 0; }
.student-access-card header > strong[b-hh8tdy7jlw] { border-radius: 999px; font-size: .62rem; padding: 5px 8px; white-space: nowrap; }
.student-access-card header > strong.is-active[b-hh8tdy7jlw] { background: color-mix(in srgb, #20a85b 12%, var(--card-bg)); color: #188348; }
.student-access-card header > strong.is-disabled[b-hh8tdy7jlw] { background: color-mix(in srgb, #c84b4b 10%, var(--card-bg)); color: #b53f3f; }
.student-access-card form[b-hh8tdy7jlw] { display: grid; gap: 11px; }
.student-access-card label[b-hh8tdy7jlw] { display: grid; gap: 5px; }
.student-access-card label > span[b-hh8tdy7jlw] { font-size: .68rem; font-weight: 800; }
.student-access-card input[type="text"][b-hh8tdy7jlw], .student-access-card input[type="password"][b-hh8tdy7jlw] { background: var(--bg-secondary); border: 1px solid color-mix(in srgb, var(--text-secondary) 22%, transparent); border-radius: 9px; color: var(--text-color); min-height: 40px; padding: 0 11px; width: 100%; }
.student-access-card label small[b-hh8tdy7jlw] { color: var(--text-secondary); font-size: .61rem; }
.student-access-toggle[b-hh8tdy7jlw] { align-items: center; display: flex !important; gap: 8px !important; }
.student-access-toggle input[b-hh8tdy7jlw] { accent-color: var(--primary-color); height: 17px; width: 17px; }
.student-access-card button[b-hh8tdy7jlw] { align-items: center; background: var(--primary-color); border: 0; border-radius: 9px; color: #fff; cursor: pointer; display: flex; font-size: .72rem; font-weight: 800; gap: 7px; justify-content: center; min-height: 40px; }
.student-access-card button:disabled[b-hh8tdy7jlw] { cursor: default; opacity: .55; }
.student-access-state[b-hh8tdy7jlw] { color: var(--text-secondary); font-size: .72rem; padding: 20px 0; text-align: center; }
.student-access-message[b-hh8tdy7jlw] { border-radius: 9px; font-size: .68rem; padding: 9px 10px; }
.student-access-message--success[b-hh8tdy7jlw] { background: color-mix(in srgb, #20a85b 11%, var(--card-bg)); color: #188348; }
.student-access-message--error[b-hh8tdy7jlw] { background: color-mix(in srgb, #c84b4b 10%, var(--card-bg)); color: #b53f3f; }
.student-access-archive[b-hh8tdy7jlw] { align-items: center; color: #b53f3f; display: flex; font-size: .66rem; gap: 7px; margin: 0; }
.student-access-card footer[b-hh8tdy7jlw] { border-top: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent); color: var(--text-secondary); font-size: .62rem; padding-top: 10px; }
/* /Components/Pages/Teacher/Students/StudentEditorContent.razor.rz.scp.css */
.student-editor-page[b-3orz0zcbqt] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
}

.student-editor-header[b-3orz0zcbqt] {
    align-items: flex-start;
    display: flex;
    gap: 14px;
    height: auto;
    inset: auto;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.student-editor-header > a[b-3orz0zcbqt] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 18%, transparent);
    border-radius: 11px;
    color: var(--text-color);
    display: flex;
    flex: 0 0 42px;
    height: 42px;
    justify-content: center;
    text-decoration: none;
}

.student-editor-header span[b-3orz0zcbqt] {
    color: var(--primary-color);
    display: block;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .1em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.student-editor-header h1[b-3orz0zcbqt] {
    font-size: clamp(1.65rem, 3vw, 2.3rem);
    margin: 0 0 5px;
}

.student-editor-header p[b-3orz0zcbqt] {
    color: var(--text-secondary);
    margin: 0;
}

.student-editor-layout[b-3orz0zcbqt] {
    align-items: start;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1.65fr) minmax(280px, .75fr);
}

.student-editor-main[b-3orz0zcbqt],
.student-editor-side[b-3orz0zcbqt] {
    display: grid;
    gap: 18px;
}

.student-form-card[b-3orz0zcbqt] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 17px;
    box-shadow: var(--shadow-sm);
    display: grid;
    gap: 17px;
    padding: 20px;
}

.student-form-card > header[b-3orz0zcbqt] {
    align-items: flex-start;
    display: flex;
    gap: 12px;
    height: auto;
    inset: auto;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.student-form-card > header > i[b-3orz0zcbqt] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg));
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.student-form-card h2[b-3orz0zcbqt] {
    font-size: .98rem;
    margin: 0 0 2px;
}

.student-form-card header p[b-3orz0zcbqt] {
    color: var(--text-secondary);
    font-size: .77rem;
    margin: 0;
}

.student-form-card label[b-3orz0zcbqt] {
    display: grid;
    gap: 6px;
}

.student-form-card label > span[b-3orz0zcbqt] {
    font-size: .78rem;
    font-weight: 750;
}

.student-form-card label > span b[b-3orz0zcbqt] { color: #d44545; }

.student-form-card input[b-3orz0zcbqt],
.student-form-card select[b-3orz0zcbqt],
.student-form-card textarea[b-3orz0zcbqt] {
    background: color-mix(in srgb, var(--card-bg) 97%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 23%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    font: inherit;
    outline: none;
    padding: 10px 12px;
    width: 100%;
}

.student-form-card input[b-3orz0zcbqt],
.student-form-card select[b-3orz0zcbqt] { min-height: 43px; }
.student-form-card textarea[b-3orz0zcbqt] { resize: vertical; }

.student-form-card input:focus[b-3orz0zcbqt],
.student-form-card select:focus[b-3orz0zcbqt],
.student-form-card textarea:focus[b-3orz0zcbqt] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 13%, transparent);
}

.student-form-card small[b-3orz0zcbqt] {
    color: var(--text-secondary);
    font-size: .7rem;
}

.student-form-grid[b-3orz0zcbqt] {
    display: grid;
    gap: 14px;
}

.student-form-grid--three[b-3orz0zcbqt] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.student-form-grid--two[b-3orz0zcbqt] { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.student-editor-hint[b-3orz0zcbqt] {
    align-items: flex-start;
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--primary-color) 20%, transparent);
    border-radius: 14px;
    display: flex;
    gap: 11px;
    padding: 15px;
}

.student-editor-hint > i[b-3orz0zcbqt] { color: var(--primary-color); margin-top: 3px; }
.student-editor-hint div[b-3orz0zcbqt] { display: grid; gap: 3px; }
.student-editor-hint strong[b-3orz0zcbqt] { font-size: .82rem; }
.student-editor-hint span[b-3orz0zcbqt] { color: var(--text-secondary); font-size: .76rem; }

.student-editor-actions[b-3orz0zcbqt] {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 20px;
}

.student-editor-actions a[b-3orz0zcbqt] {
    color: var(--text-secondary);
    font-weight: 750;
    padding: 10px 14px;
    text-decoration: none;
}

.student-editor-actions button[b-3orz0zcbqt] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 11px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-weight: 800;
    gap: 8px;
    min-height: 44px;
    padding: 0 18px;
}

.student-editor-actions button:disabled[b-3orz0zcbqt] { cursor: wait; opacity: .7; }

.student-editor-alert[b-3orz0zcbqt],
.student-editor-state[b-3orz0zcbqt] {
    background: color-mix(in srgb, #d44545 9%, var(--card-bg));
    border: 1px solid color-mix(in srgb, #d44545 25%, transparent);
    border-radius: 12px;
    color: #bd3030;
    margin-bottom: 16px;
    padding: 13px 15px;
}

.student-editor-state[b-3orz0zcbqt] {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    gap: 10px;
    min-height: 140px;
    justify-content: center;
}

.student-editor-state div[b-3orz0zcbqt] { display: grid; gap: 8px; }
.student-editor-state a[b-3orz0zcbqt] { color: var(--primary-color); }
.validation-message[b-3orz0zcbqt] { color: #c93636; font-size: .72rem; }

@media (max-width: 980px) {
    .student-editor-layout[b-3orz0zcbqt] { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
    .student-form-grid--three[b-3orz0zcbqt],
    .student-form-grid--two[b-3orz0zcbqt] { grid-template-columns: 1fr; }

    .student-form-card[b-3orz0zcbqt] { padding: 16px; }

    .student-editor-actions[b-3orz0zcbqt] {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .student-editor-actions a[b-3orz0zcbqt],
    .student-editor-actions button[b-3orz0zcbqt] { justify-content: center; text-align: center; }
}
/* /Components/Pages/Teacher/Students/StudentHomeworkTab.razor.rz.scp.css */
.student-homework-tab[b-4ibi0x742z] { display: grid; gap: 16px; }
.student-homework-heading[b-4ibi0x742z] { align-items: flex-end; display: flex; gap: 15px; justify-content: space-between; }
.student-homework-heading h2[b-4ibi0x742z] { font-size: 1.25rem; margin: 0 0 3px; }
.student-homework-heading p[b-4ibi0x742z] { color: var(--text-secondary); font-size: .8rem; margin: 0; }
.student-homework-heading > a[b-4ibi0x742z] { align-items: center; background: linear-gradient(135deg, var(--primary-color), #7048e8); border-radius: 10px; color: #fff; display: inline-flex; font-size: .77rem; font-weight: 800; gap: 7px; min-height: 40px; padding: 0 13px; text-decoration: none; }
.student-homework-groups[b-4ibi0x742z] { display: grid; gap: 17px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.student-homework-groups > section[b-4ibi0x742z] { background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 16px; box-shadow: var(--shadow-sm); padding: 17px; }
.student-homework-group-title[b-4ibi0x742z] { align-items: center; display: flex; justify-content: space-between; margin-bottom: 13px; }
.student-homework-group-title h3[b-4ibi0x742z] { font-size: .96rem; margin: 0; }
.student-homework-group-title span[b-4ibi0x742z] { align-items: center; background: color-mix(in srgb, var(--primary-color) 11%, var(--card-bg)); border-radius: 999px; color: var(--primary-color); display: flex; font-size: .68rem; font-weight: 850; height: 24px; justify-content: center; min-width: 24px; padding: 0 7px; }
.student-homework-list[b-4ibi0x742z] { display: grid; gap: 9px; }
.student-homework-row[b-4ibi0x742z] { align-items: center; background: color-mix(in srgb, var(--text-secondary) 4%, var(--card-bg)); border-left: 3px solid #4d72e8; border-radius: 10px; display: grid; gap: 10px; grid-template-columns: auto minmax(0, 1fr) auto; padding: 11px; }
.student-homework-row--submitted[b-4ibi0x742z] { border-left-color: #d89416; }
.student-homework-row--completed[b-4ibi0x742z] { border-left-color: #20a85b; }
.student-homework-row--cancelled[b-4ibi0x742z], .student-homework-row--overdue[b-4ibi0x742z] { border-left-color: #c84b4b; }
.student-homework-row--needsrevision[b-4ibi0x742z] { border-left-color: #a458d2; }
.student-homework-row__icon[b-4ibi0x742z] { align-items: center; background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg)); border-radius: 9px; color: var(--primary-color); display: flex; height: 38px; justify-content: center; width: 38px; }
.student-homework-row > div > span[b-4ibi0x742z] { color: var(--primary-color); font-size: .63rem; font-weight: 800; }
.student-homework-row h4[b-4ibi0x742z] { font-size: .8rem; margin: 2px 0; }
.student-homework-row h4 a[b-4ibi0x742z] { color: var(--text-color); text-decoration: none; }
.student-homework-row small[b-4ibi0x742z] { color: var(--text-secondary); font-size: .66rem; }
.student-homework-row > a[b-4ibi0x742z] { align-items: center; color: var(--primary-color); display: flex; height: 30px; justify-content: center; text-decoration: none; width: 30px; }
.student-homework-state[b-4ibi0x742z] { align-items: center; background: var(--card-bg); border-radius: 15px; color: var(--text-secondary); display: flex; gap: 8px; justify-content: center; min-height: 180px; }
.student-homework-state--error[b-4ibi0x742z] { color: #c23b3b; }
.student-homework-empty-line[b-4ibi0x742z] { color: var(--text-secondary); font-size: .78rem; margin: 0; padding: 18px 0; text-align: center; }
@media (max-width: 900px) { .student-homework-groups[b-4ibi0x742z] { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .student-homework-heading[b-4ibi0x742z] { align-items: stretch; flex-direction: column; } .student-homework-heading > a[b-4ibi0x742z] { justify-content: center; } }
/* /Components/Pages/Teacher/Students/StudentLessonsTab.razor.rz.scp.css */
.student-lessons-tab[b-c0da6d3hjs] { display: grid; gap: 16px; }
.student-lessons-heading[b-c0da6d3hjs] { align-items: flex-end; display: flex; gap: 15px; justify-content: space-between; }
.student-lessons-heading h2[b-c0da6d3hjs] { font-size: 1.25rem; margin: 0 0 3px; }
.student-lessons-heading p[b-c0da6d3hjs] { color: var(--text-secondary); font-size: .8rem; margin: 0; }
.student-lessons-heading > a[b-c0da6d3hjs] { align-items: center; background: linear-gradient(135deg, var(--primary-color), #7048e8); border-radius: 10px; color: #fff; display: inline-flex; font-size: .77rem; font-weight: 800; gap: 7px; min-height: 40px; padding: 0 13px; text-decoration: none; }
.student-lesson-groups[b-c0da6d3hjs] { display: grid; gap: 17px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.student-lesson-groups > section[b-c0da6d3hjs] { background: var(--card-bg); border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent); border-radius: 16px; box-shadow: var(--shadow-sm); padding: 17px; }
.student-lesson-group-title[b-c0da6d3hjs] { align-items: center; display: flex; justify-content: space-between; margin-bottom: 13px; }
.student-lesson-group-title h3[b-c0da6d3hjs] { font-size: .96rem; margin: 0; }
.student-lesson-group-title span[b-c0da6d3hjs] { align-items: center; background: color-mix(in srgb, var(--primary-color) 11%, var(--card-bg)); border-radius: 999px; color: var(--primary-color); display: flex; font-size: .68rem; font-weight: 850; height: 24px; justify-content: center; min-width: 24px; padding: 0 7px; }
.student-lesson-list[b-c0da6d3hjs] { display: grid; gap: 9px; }
.student-lesson-row[b-c0da6d3hjs] { align-items: center; background: color-mix(in srgb, var(--text-secondary) 4%, var(--card-bg)); border-left: 3px solid #4d72e8; border-radius: 10px; display: grid; gap: 10px; grid-template-columns: auto minmax(0, 1fr) auto; padding: 11px; }
.student-lesson-row--completed[b-c0da6d3hjs], .student-lesson-row--confirmed[b-c0da6d3hjs] { border-left-color: #20a85b; }
.student-lesson-row--cancelled[b-c0da6d3hjs], .student-lesson-row--studentabsent[b-c0da6d3hjs] { border-left-color: #c84b4b; }
.student-lesson-row--rescheduled[b-c0da6d3hjs] { border-left-color: #d89416; }
.student-lesson-row > time[b-c0da6d3hjs] { align-items: center; display: flex; flex-direction: column; min-width: 42px; }
.student-lesson-row > time strong[b-c0da6d3hjs] { font-size: .78rem; }
.student-lesson-row > time span[b-c0da6d3hjs], .student-lesson-row small[b-c0da6d3hjs] { color: var(--text-secondary); font-size: .66rem; }
.student-lesson-row > div > span[b-c0da6d3hjs] { color: var(--primary-color); font-size: .63rem; font-weight: 800; }
.student-lesson-row h4[b-c0da6d3hjs] { font-size: .8rem; margin: 2px 0; }
.student-lesson-row h4 a[b-c0da6d3hjs] { color: var(--text-color); text-decoration: none; }
.student-lesson-row > a[b-c0da6d3hjs] { align-items: center; color: var(--primary-color); display: flex; height: 30px; justify-content: center; text-decoration: none; width: 30px; }
.student-lessons-state[b-c0da6d3hjs] { align-items: center; background: var(--card-bg); border-radius: 15px; color: var(--text-secondary); display: flex; gap: 8px; justify-content: center; min-height: 180px; }
.student-lessons-state--error[b-c0da6d3hjs] { color: #c23b3b; }
.student-lessons-empty-line[b-c0da6d3hjs] { color: var(--text-secondary); font-size: .78rem; margin: 0; padding: 18px 0; text-align: center; }
@media (max-width: 900px) { .student-lesson-groups[b-c0da6d3hjs] { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .student-lessons-heading[b-c0da6d3hjs] { align-items: stretch; flex-direction: column; } .student-lessons-heading > a[b-c0da6d3hjs] { justify-content: center; } }
/* /Components/Pages/Teacher/Students/StudentProfileContent.razor.rz.scp.css */
.student-profile-page[b-3lz9x0puqi] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1380px;
}

.profile-header[b-3lz9x0puqi] {
    align-items: center;
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary-color) 10%, var(--card-bg)), var(--card-bg) 70%);
    border: 1px solid color-mix(in srgb, var(--primary-color) 17%, transparent);
    border-radius: 20px;
    box-shadow: var(--shadow-sm);
    display: grid;
    gap: 16px;
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    height: auto;
    inset: auto;
    margin-bottom: 18px;
    padding: 21px;
    position: static;
    width: auto;
    z-index: auto;
}

.profile-back[b-3lz9x0puqi] {
    align-items: center;
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 10px;
    color: var(--text-secondary);
    display: flex;
    height: 40px;
    justify-content: center;
    text-decoration: none;
    width: 40px;
}

.profile-avatar[b-3lz9x0puqi] {
    align-items: center;
    background: linear-gradient(145deg, var(--primary-color), #7048e8);
    border-radius: 17px;
    box-shadow: 0 10px 20px color-mix(in srgb, var(--primary-color) 20%, transparent);
    color: #fff;
    display: flex;
    font-size: 1.25rem;
    font-weight: 850;
    height: 62px;
    justify-content: center;
    width: 62px;
}

.profile-heading h1[b-3lz9x0puqi] {
    font-size: clamp(1.45rem, 3vw, 2.15rem);
    margin: 2px 0 4px;
}

.profile-heading > p[b-3lz9x0puqi] {
    color: var(--text-secondary);
    font-size: .87rem;
    margin: 0;
    max-width: 720px;
}

.profile-heading__meta[b-3lz9x0puqi] {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    flex-wrap: wrap;
    font-size: .72rem;
    gap: 8px;
}

.profile-heading__meta > span:not(.profile-status)[b-3lz9x0puqi]::before {
    content: "•";
    margin-right: 8px;
}

.profile-status[b-3lz9x0puqi] {
    background: color-mix(in srgb, #20a85b 13%, var(--card-bg));
    border-radius: 999px;
    color: #148342;
    font-weight: 800;
    padding: 4px 8px;
}

.profile-status--paused[b-3lz9x0puqi] {
    background: color-mix(in srgb, #d89416 14%, var(--card-bg));
    color: #9b6200;
}

.profile-status--archived[b-3lz9x0puqi] {
    background: color-mix(in srgb, #8b93a7 14%, var(--card-bg));
    color: var(--text-secondary);
}

.profile-edit[b-3lz9x0puqi] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--primary-color) 24%, transparent);
    border-radius: 11px;
    color: var(--primary-color);
    display: inline-flex;
    font-size: .83rem;
    font-weight: 800;
    gap: 8px;
    min-height: 42px;
    padding: 0 14px;
    text-decoration: none;
}

.profile-tabs[b-3lz9x0puqi] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 15px;
    display: flex;
    gap: 4px;
    margin-bottom: 18px;
    overflow-x: auto;
    padding: 6px;
    scrollbar-width: thin;
}

.profile-tabs button[b-3lz9x0puqi],
.profile-tabs a[b-3lz9x0puqi] {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 9px;
    color: var(--text-secondary);
    cursor: pointer;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: .77rem;
    font-weight: 750;
    gap: 7px;
    min-height: 38px;
    padding: 0 11px;
    text-decoration: none;
}

.profile-tabs button:hover[b-3lz9x0puqi],
.profile-tabs a:hover[b-3lz9x0puqi] {
    background: color-mix(in srgb, var(--primary-color) 6%, transparent);
    color: var(--text-color);
}

.profile-tabs button.is-active[b-3lz9x0puqi],
.profile-tabs a.is-active[b-3lz9x0puqi] {
    background: color-mix(in srgb, var(--primary-color) 11%, var(--card-bg));
    color: var(--primary-color);
}

.profile-tabs small[b-3lz9x0puqi] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 16%, transparent);
    border-radius: 999px;
    display: flex;
    font-size: .65rem;
    height: 20px;
    justify-content: center;
    min-width: 20px;
    padding: 0 5px;
}

.profile-content[b-3lz9x0puqi] {
    min-height: 360px;
}

.profile-section-grid[b-3lz9x0puqi] {
    align-items: start;
    display: grid;
    gap: 18px;
    grid-template-columns: minmax(0, 1.45fr) minmax(300px, .7fr);
}

.profile-list-column[b-3lz9x0puqi] {
    display: grid;
    gap: 14px;
}

.profile-section-title[b-3lz9x0puqi] {
    align-items: flex-end;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin: 0 2px 4px;
}

.profile-section-title h2[b-3lz9x0puqi] {
    font-size: 1.25rem;
    margin: 0 0 3px;
}

.profile-section-title p[b-3lz9x0puqi] {
    color: var(--text-secondary);
    font-size: .8rem;
    margin: 0;
}

.profile-section-title > button[b-3lz9x0puqi],
.profile-form-actions > button:not(.secondary)[b-3lz9x0puqi] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border: 0;
    border-radius: 10px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: .77rem;
    font-weight: 800;
    gap: 7px;
    min-height: 40px;
    padding: 0 13px;
}

.note-list[b-3lz9x0puqi],
.parent-list[b-3lz9x0puqi] {
    display: grid;
    gap: 13px;
}

.student-note[b-3lz9x0puqi],
.parent-card[b-3lz9x0puqi],
.profile-form-panel[b-3lz9x0puqi],
.history-section[b-3lz9x0puqi] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    padding: 18px;
}

.student-note[b-3lz9x0puqi] {
    border-left: 4px solid #ca8d18;
}

.student-note--parent[b-3lz9x0puqi] { border-left-color: #2b9f65; }

.student-note > header[b-3lz9x0puqi] {
    align-items: center;
    display: flex;
    gap: 12px;
    height: auto;
    inset: auto;
    justify-content: space-between;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.student-note > header span[b-3lz9x0puqi] {
    align-items: center;
    color: #a66c00;
    display: flex;
    font-size: .74rem;
    font-weight: 800;
    gap: 7px;
}

.student-note--parent > header span[b-3lz9x0puqi] { color: #16814d; }

.student-note time[b-3lz9x0puqi],
.history-list time[b-3lz9x0puqi] {
    color: var(--text-secondary);
    font-size: .7rem;
}

.student-note > p[b-3lz9x0puqi] {
    line-height: 1.55;
    margin: 14px 0;
    white-space: pre-wrap;
}

.student-note footer[b-3lz9x0puqi],
.parent-card footer[b-3lz9x0puqi] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.student-note footer button[b-3lz9x0puqi],
.parent-card footer button[b-3lz9x0puqi] {
    align-items: center;
    background: transparent;
    border: 0;
    color: var(--primary-color);
    cursor: pointer;
    display: inline-flex;
    font-size: .73rem;
    font-weight: 750;
    gap: 6px;
    padding: 6px;
}

.student-note footer button.danger[b-3lz9x0puqi],
.parent-card footer button.danger[b-3lz9x0puqi] { color: #c13d3d; }

.parent-card header[b-3lz9x0puqi] {
    align-items: center;
    display: grid;
    gap: 11px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    height: auto;
    inset: auto;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.parent-avatar[b-3lz9x0puqi] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 11%, var(--card-bg));
    border-radius: 12px;
    color: var(--primary-color);
    display: flex;
    font-weight: 850;
    height: 43px;
    justify-content: center;
    width: 43px;
}

.parent-card h3[b-3lz9x0puqi] { font-size: .93rem; margin: 0 0 2px; }
.parent-card header p[b-3lz9x0puqi] { color: var(--text-secondary); font-size: .73rem; margin: 0; }

.primary-contact[b-3lz9x0puqi] {
    background: color-mix(in srgb, #20a85b 11%, var(--card-bg));
    border-radius: 999px;
    color: #16814d;
    font-size: .66rem;
    font-weight: 800;
    padding: 5px 8px;
}

.parent-card dl[b-3lz9x0puqi] {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 17px 0 13px;
}

.parent-card dl div[b-3lz9x0puqi] {
    background: color-mix(in srgb, var(--text-secondary) 4%, var(--card-bg));
    border-radius: 9px;
    padding: 10px;
}

.parent-card dt[b-3lz9x0puqi] { color: var(--text-secondary); font-size: .67rem; margin-bottom: 3px; }
.parent-card dd[b-3lz9x0puqi] { font-size: .78rem; margin: 0; overflow-wrap: anywhere; }

.profile-form-panel[b-3lz9x0puqi] {
    position: sticky;
    top: 84px;
}

.profile-form-panel > h2[b-3lz9x0puqi] {
    font-size: 1rem;
    margin: 0 0 16px;
}

.profile-form-panel form[b-3lz9x0puqi] {
    display: grid;
    gap: 13px;
}

.profile-form-panel label[b-3lz9x0puqi] {
    display: grid;
    gap: 5px;
}

.profile-form-panel label > span[b-3lz9x0puqi] {
    font-size: .73rem;
    font-weight: 750;
}

.profile-form-panel label > span b[b-3lz9x0puqi] { color: #d44545; }

.profile-form-panel input:not([type="checkbox"])[b-3lz9x0puqi],
.profile-form-panel select[b-3lz9x0puqi],
.profile-form-panel textarea[b-3lz9x0puqi] {
    background: color-mix(in srgb, var(--card-bg) 97%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 23%, transparent);
    border-radius: 9px;
    color: var(--text-color);
    font: inherit;
    outline: none;
    padding: 9px 11px;
    width: 100%;
}

.profile-form-panel input:not([type="checkbox"])[b-3lz9x0puqi],
.profile-form-panel select[b-3lz9x0puqi] { min-height: 40px; }

.profile-form-panel textarea[b-3lz9x0puqi] { resize: vertical; }

.profile-form-panel input:focus[b-3lz9x0puqi],
.profile-form-panel select:focus[b-3lz9x0puqi],
.profile-form-panel textarea:focus[b-3lz9x0puqi] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 12%, transparent);
}

.profile-checkbox[b-3lz9x0puqi] {
    align-items: center;
    display: flex !important;
    gap: 8px !important;
}

.profile-checkbox input[b-3lz9x0puqi] { accent-color: var(--primary-color); height: 17px; width: 17px; }

.visibility-hint[b-3lz9x0puqi] {
    align-items: flex-start;
    background: color-mix(in srgb, #ca8d18 9%, var(--card-bg));
    border-radius: 9px;
    color: #8d6000;
    display: flex;
    font-size: .7rem;
    gap: 8px;
    line-height: 1.4;
    padding: 9px;
}

.visibility-hint--parent[b-3lz9x0puqi] {
    background: color-mix(in srgb, #2b9f65 9%, var(--card-bg));
    color: #167344;
}

.visibility-hint i[b-3lz9x0puqi] { margin-top: 2px; }

.profile-form-actions[b-3lz9x0puqi] {
    display: flex;
    gap: 9px;
    justify-content: flex-end;
    margin-top: 4px;
}

.profile-form-actions .secondary[b-3lz9x0puqi] {
    background: transparent;
    border: 0;
    color: var(--text-secondary);
    cursor: pointer;
    font-weight: 750;
}

.history-section[b-3lz9x0puqi] {
    max-width: 900px;
}

.history-list[b-3lz9x0puqi] {
    list-style: none;
    margin: 22px 0 0;
    padding: 0;
}

.history-list li[b-3lz9x0puqi] {
    display: grid;
    gap: 13px;
    grid-template-columns: auto 1fr;
    min-height: 65px;
    position: relative;
}

.history-list li:not(:last-child)[b-3lz9x0puqi]::before {
    background: color-mix(in srgb, var(--primary-color) 20%, transparent);
    content: "";
    height: calc(100% - 31px);
    left: 16px;
    position: absolute;
    top: 34px;
    width: 1px;
}

.history-list li > span[b-3lz9x0puqi] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg));
    border-radius: 10px;
    color: var(--primary-color);
    display: flex;
    height: 33px;
    justify-content: center;
    width: 33px;
}

.history-list li > div[b-3lz9x0puqi] { display: grid; gap: 3px; padding-top: 2px; }
.history-list strong[b-3lz9x0puqi] { font-size: .82rem; }

.future-tab[b-3lz9x0puqi] {
    align-items: center;
    background: var(--card-bg);
    border: 1px dashed color-mix(in srgb, var(--primary-color) 30%, transparent);
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    min-height: 330px;
    padding: 36px;
    text-align: center;
}

.future-tab > span[b-3lz9x0puqi] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg));
    border-radius: 18px;
    color: var(--primary-color);
    display: flex;
    font-size: 1.45rem;
    height: 64px;
    justify-content: center;
    width: 64px;
}

.future-tab h2[b-3lz9x0puqi] { margin: 16px 0 6px; }
.future-tab p[b-3lz9x0puqi] { color: var(--text-secondary); margin: 0 0 12px; max-width: 540px; }
.future-tab strong[b-3lz9x0puqi] { color: var(--primary-color); font-size: .78rem; }

.profile-alert[b-3lz9x0puqi],
.profile-state[b-3lz9x0puqi] {
    align-items: center;
    background: color-mix(in srgb, #d44545 9%, var(--card-bg));
    border: 1px solid color-mix(in srgb, #d44545 24%, transparent);
    border-radius: 12px;
    color: #bd3030;
    display: flex;
    gap: 10px;
    margin-bottom: 15px;
    padding: 12px 14px;
}

.profile-state[b-3lz9x0puqi] {
    color: var(--text-secondary);
    justify-content: center;
    min-height: 200px;
}

.profile-state div[b-3lz9x0puqi] { display: grid; gap: 6px; }
.profile-state a[b-3lz9x0puqi] { color: var(--primary-color); }
.validation-message[b-3lz9x0puqi] { color: #c93636; font-size: .7rem; }

@media (max-width: 1000px) {
    .profile-section-grid[b-3lz9x0puqi] { grid-template-columns: 1fr; }
    .profile-form-panel[b-3lz9x0puqi] { position: static; }
}

@media (max-width: 720px) {
    .profile-header[b-3lz9x0puqi] {
        grid-template-columns: auto auto minmax(0, 1fr);
        padding: 16px;
    }

    .profile-back[b-3lz9x0puqi] { grid-column: 1; }
    .profile-avatar[b-3lz9x0puqi] { height: 52px; width: 52px; }
    .profile-edit[b-3lz9x0puqi] { grid-column: 1 / -1; justify-content: center; }

    .profile-tabs button[b-3lz9x0puqi],
    .profile-tabs a[b-3lz9x0puqi] { min-height: 42px; }

    .parent-card header[b-3lz9x0puqi] { grid-template-columns: auto 1fr; }
    .primary-contact[b-3lz9x0puqi] { grid-column: 1 / -1; justify-self: start; }
    .parent-card dl[b-3lz9x0puqi] { grid-template-columns: 1fr; }

    .profile-section-title[b-3lz9x0puqi] {
        align-items: stretch;
        flex-direction: column;
    }

    .profile-section-title > button[b-3lz9x0puqi] { justify-content: center; }
}

@media (max-width: 480px) {
    .profile-heading[b-3lz9x0puqi] { grid-column: 1 / -1; }
    .profile-header[b-3lz9x0puqi] { grid-template-columns: auto 1fr; }
    .student-note > header[b-3lz9x0puqi] { align-items: flex-start; flex-direction: column; }
}
/* /Components/Pages/Teacher/Students/StudentsListContent.razor.rz.scp.css */
.students-page[b-is5vrijsos] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1240px;
}

.students-header[b-is5vrijsos] {
    align-items: flex-end;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    height: auto;
    inset: auto;
    margin-bottom: 24px;
    padding: 0;
    position: static;
    width: auto;
    z-index: auto;
}

.students-eyebrow[b-is5vrijsos] {
    color: var(--primary-color);
    display: block;
    font-size: .74rem;
    font-weight: 800;
    letter-spacing: .11em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.students-header h1[b-is5vrijsos] {
    font-size: clamp(1.8rem, 3vw, 2.45rem);
    margin: 0 0 6px;
}

.students-header p[b-is5vrijsos] {
    color: var(--text-secondary);
    margin: 0;
    max-width: 680px;
}

.students-primary-action[b-is5vrijsos],
.students-empty a[b-is5vrijsos] {
    align-items: center;
    background: linear-gradient(135deg, var(--primary-color), #7048e8);
    border-radius: 12px;
    box-shadow: 0 10px 22px color-mix(in srgb, var(--primary-color) 22%, transparent);
    color: #fff;
    display: inline-flex;
    flex: 0 0 auto;
    font-weight: 750;
    gap: 9px;
    min-height: 44px;
    padding: 0 17px;
    text-decoration: none;
}

.students-toolbar[b-is5vrijsos] {
    align-items: end;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 16px;
    box-shadow: var(--shadow-sm);
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(240px, 1fr) minmax(180px, 240px);
    margin-bottom: 20px;
    padding: 16px;
}

.students-search[b-is5vrijsos],
.students-filter[b-is5vrijsos] {
    display: grid;
    gap: 6px;
}

.students-search > span[b-is5vrijsos],
.students-filter > span[b-is5vrijsos] {
    color: var(--text-secondary);
    font-size: .75rem;
    font-weight: 750;
}

.students-search > div[b-is5vrijsos] {
    align-items: center;
    display: flex;
    position: relative;
}

.students-search i[b-is5vrijsos] {
    color: var(--text-secondary);
    left: 13px;
    position: absolute;
}

.students-search input[b-is5vrijsos],
.students-filter select[b-is5vrijsos] {
    background: color-mix(in srgb, var(--card-bg) 96%, var(--text-color));
    border: 1px solid color-mix(in srgb, var(--text-secondary) 24%, transparent);
    border-radius: 10px;
    color: var(--text-color);
    min-height: 44px;
    outline: none;
    width: 100%;
}

.students-search input[b-is5vrijsos] {
    padding: 0 14px 0 39px;
}

.students-filter select[b-is5vrijsos] {
    padding: 0 12px;
}

.students-search input:focus[b-is5vrijsos],
.students-filter select:focus[b-is5vrijsos] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 14%, transparent);
}

.students-summary[b-is5vrijsos] {
    color: var(--text-secondary);
    font-size: .82rem;
    margin: 0 2px 10px;
}

.student-grid[b-is5vrijsos] {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr));
}

.student-card[b-is5vrijsos] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 18px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    min-height: 320px;
    overflow: hidden;
    padding: 19px;
    position: relative;
}

.student-card[b-is5vrijsos]::before {
    background: #20a85b;
    content: "";
    height: 4px;
    inset: 0 0 auto;
    position: absolute;
}

.student-card--paused[b-is5vrijsos]::before { background: #d89416; }
.student-card--archived[b-is5vrijsos]::before { background: #8b93a7; }
.student-card--archived[b-is5vrijsos] { opacity: .86; }

.student-card__topline[b-is5vrijsos] {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.student-avatar[b-is5vrijsos] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 12%, var(--card-bg));
    border-radius: 13px;
    color: var(--primary-color);
    display: inline-flex;
    font-size: 1rem;
    font-weight: 850;
    height: 46px;
    justify-content: center;
    width: 46px;
}

.student-status[b-is5vrijsos] {
    background: color-mix(in srgb, #20a85b 12%, var(--card-bg));
    border-radius: 999px;
    color: #148342;
    font-size: .72rem;
    font-weight: 800;
    padding: 5px 9px;
}

.student-card--paused .student-status[b-is5vrijsos] {
    background: color-mix(in srgb, #d89416 14%, var(--card-bg));
    color: #a26500;
}

.student-card--archived .student-status[b-is5vrijsos] {
    background: color-mix(in srgb, #8b93a7 14%, var(--card-bg));
    color: var(--text-secondary);
}

.student-card__identity[b-is5vrijsos] {
    margin: 17px 0 14px;
}

.student-card__identity h2[b-is5vrijsos] {
    font-size: 1.13rem;
    margin: 0 0 4px;
}

.student-card__identity h2 a[b-is5vrijsos] {
    color: var(--text-color);
    text-decoration: none;
}

.student-card__identity h2 a:hover[b-is5vrijsos] { color: var(--primary-color); }

.student-card__identity p[b-is5vrijsos] {
    color: var(--text-secondary);
    font-size: .82rem;
    margin: 0;
}

.student-card__details[b-is5vrijsos] {
    display: grid;
    gap: 12px;
    margin: 0 0 18px;
}

.student-card__details div[b-is5vrijsos] {
    border-top: 1px solid color-mix(in srgb, var(--text-secondary) 12%, transparent);
    padding-top: 10px;
}

.student-card__details dt[b-is5vrijsos] {
    color: var(--text-secondary);
    font-size: .72rem;
    font-weight: 750;
    margin-bottom: 3px;
}

.student-card__details dt i[b-is5vrijsos] {
    color: var(--primary-color);
    margin-right: 5px;
    width: 14px;
}

.student-card__details dd[b-is5vrijsos] {
    display: -webkit-box;
    font-size: .84rem;
    margin: 0;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.student-card__actions[b-is5vrijsos] {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-top: auto;
}

.student-card__actions > a[b-is5vrijsos] {
    align-items: center;
    color: var(--primary-color);
    display: inline-flex;
    font-size: .84rem;
    font-weight: 800;
    gap: 7px;
    text-decoration: none;
}

.student-card__status-action[b-is5vrijsos] {
    align-items: center;
    background: transparent;
    border: 1px solid color-mix(in srgb, var(--text-secondary) 20%, transparent);
    border-radius: 9px;
    color: var(--text-secondary);
    cursor: pointer;
    display: inline-flex;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.student-card__status-action:hover[b-is5vrijsos] {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.students-state[b-is5vrijsos],
.students-empty[b-is5vrijsos] {
    align-items: center;
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 14%, transparent);
    border-radius: 18px;
    color: var(--text-secondary);
    display: flex;
    gap: 10px;
    justify-content: center;
    min-height: 160px;
    padding: 28px;
    text-align: center;
}

.students-state--error[b-is5vrijsos] { color: #c23b3b; }

.students-empty[b-is5vrijsos] {
    flex-direction: column;
    min-height: 300px;
}

.students-empty > span[b-is5vrijsos] {
    align-items: center;
    background: color-mix(in srgb, var(--primary-color) 10%, var(--card-bg));
    border-radius: 18px;
    color: var(--primary-color);
    display: flex;
    font-size: 1.5rem;
    height: 64px;
    justify-content: center;
    width: 64px;
}

.students-empty h2[b-is5vrijsos] { color: var(--text-color); margin: 8px 0 0; }
.students-empty p[b-is5vrijsos] { margin: 0 0 8px; max-width: 520px; }

@media (max-width: 680px) {
    .students-header[b-is5vrijsos] {
        align-items: stretch;
        flex-direction: column;
    }

    .students-primary-action[b-is5vrijsos] { justify-content: center; }

    .students-toolbar[b-is5vrijsos] { grid-template-columns: 1fr; }

    .student-card[b-is5vrijsos] { min-height: 300px; }
}
/* /Components/Pages/Teacher/TeacherMessages.razor.rz.scp.css */
.chat-page[b-l1qhsg53q1] {
    --chat-ink: var(--text-color, #1e293b);
    --chat-muted: var(--text-muted, #64748b);
    --chat-line: var(--border-color, #dce5ef);
    --chat-surface: var(--bg-color, #fff);
    --chat-accent: #3268da;
    color: var(--chat-ink);
    margin: 0 auto;
    max-width: 1320px;
    padding: clamp(14px, 2.5vw, 28px);
}
.chat-page__header[b-l1qhsg53q1] { align-items: center; display: flex; gap: 16px; margin-bottom: 22px; }
.chat-page__heading-icon[b-l1qhsg53q1] { align-items: center; background: linear-gradient(145deg, #4d84f0, #2858c0); border-radius: 19px; box-shadow: 0 12px 26px #3268da36; color: #fff; display: flex; flex: 0 0 54px; font-size: 1.25rem; height: 54px; justify-content: center; }
.chat-eyebrow[b-l1qhsg53q1] { color: var(--chat-accent); display: block; font-size: .7rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.chat-page__header h1[b-l1qhsg53q1] { font-size: clamp(1.5rem, 2.3vw, 2.05rem); line-height: 1.2; margin: 2px 0; }
.chat-page__header p[b-l1qhsg53q1] { color: var(--chat-muted); font-size: .93rem; margin: 0; }
.chat-live-label[b-l1qhsg53q1] { align-items: center; background: #eaf5ef; border: 1px solid #cde7d8; border-radius: 100px; color: #18744c; display: inline-flex; font-size: .75rem; font-weight: 750; gap: 8px; margin-left: auto; padding: 8px 12px; white-space: nowrap; }
.chat-live-label span[b-l1qhsg53q1] { background: #30aa70; border-radius: 50%; height: 7px; width: 7px; }
.chat-page__grid[b-l1qhsg53q1] { display: grid; grid-template-columns: minmax(260px, 315px) minmax(0, 1fr); height: clamp(560px, calc(100dvh - 205px), 850px); min-height: 0; }
.chat-conversations[b-l1qhsg53q1], .chat-thread[b-l1qhsg53q1] { background: var(--chat-surface); border: 1px solid var(--chat-line); box-shadow: 0 12px 36px #1833630c; min-height: 0; }
.chat-conversations[b-l1qhsg53q1] { border-radius: 20px 0 0 20px; display: flex; flex-direction: column; overflow: hidden; }
.chat-conversations__heading[b-l1qhsg53q1] { align-items: center; display: flex; justify-content: space-between; padding: 24px 20px 16px; }
.chat-conversations__heading h2[b-l1qhsg53q1] { font-size: 1.18rem; margin: 3px 0 0; }
.chat-total[b-l1qhsg53q1] { background: #edf3ff; border-radius: 12px; color: var(--chat-accent); font-size: .8rem; font-weight: 800; padding: 6px 10px; }
.chat-search[b-l1qhsg53q1] { align-items: center; background: color-mix(in srgb, var(--chat-surface) 93%, #8ba4cf); border: 1px solid var(--chat-line); border-radius: 12px; color: var(--chat-muted); display: flex; gap: 9px; margin: 0 14px 15px; padding: 0 13px; }
.chat-search:focus-within[b-l1qhsg53q1] { border-color: var(--chat-accent); box-shadow: 0 0 0 3px #3268da19; }
.chat-search input[b-l1qhsg53q1] { background: transparent; border: 0; color: var(--chat-ink); font: inherit; min-width: 0; outline: 0; padding: 11px 0; width: 100%; }
.chat-conversations__list[b-l1qhsg53q1] { flex: 1; min-height: 0; overflow-y: auto; padding: 0 9px 14px; }
.chat-conversation[b-l1qhsg53q1] { align-items: center; background: transparent; border: 1px solid transparent; border-radius: 14px; color: var(--chat-ink); cursor: pointer; display: flex; gap: 12px; margin: 3px 0; padding: 12px 10px; text-align: left; width: 100%; }
.chat-conversation:hover[b-l1qhsg53q1], .chat-conversation:focus-visible[b-l1qhsg53q1] { background: #f1f6ff; color: #1d355a; outline: none; }
.chat-conversation.is-selected[b-l1qhsg53q1] { background: #eaf2ff; border-color: #d5e4ff; color: #1d355a; }
.chat-avatar[b-l1qhsg53q1] { align-items: center; background: linear-gradient(135deg, #e2ebff, #d6f0f5); border-radius: 15px; color: #2b60ba; display: inline-flex; flex: 0 0 42px; font-size: .78rem; font-weight: 800; height: 42px; justify-content: center; letter-spacing: .02em; }
.chat-avatar--header[b-l1qhsg53q1] { border-radius: 16px; flex-basis: 44px; height: 44px; }
.chat-conversation__content[b-l1qhsg53q1] { display: flex; flex: 1; flex-direction: column; gap: 3px; min-width: 0; }
.chat-conversation__content strong[b-l1qhsg53q1] { font-size: .88rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-conversation__content small[b-l1qhsg53q1] { color: var(--chat-muted); font-size: .74rem; }
.chat-unread[b-l1qhsg53q1] { align-items: center; background: var(--chat-accent); border-radius: 20px; color: #fff; display: inline-flex; flex: 0 0 auto; font-size: .69rem; font-weight: 800; height: 23px; justify-content: center; min-width: 23px; padding: 0 5px; }
.chat-conversations__empty[b-l1qhsg53q1] { color: var(--chat-muted); padding: 26px 16px; text-align: center; }
.chat-conversations__empty i[b-l1qhsg53q1] { color: #9eb6dd; font-size: 1.8rem; }
.chat-thread[b-l1qhsg53q1] { border-left: 0; border-radius: 0 20px 20px 0; display: flex; flex-direction: column; overflow: hidden; }
.chat-page--student .chat-thread[b-l1qhsg53q1] { border-left: 1px solid var(--chat-line); border-radius: 20px; height: clamp(560px, calc(100dvh - 235px), 850px); }
.chat-thread__toolbar[b-l1qhsg53q1] { align-items: center; border-bottom: 1px solid var(--chat-line); display: flex; flex: 0 0 auto; gap: 12px; min-height: 76px; padding: 14px 22px; }
.chat-thread__identity[b-l1qhsg53q1] { min-width: 0; }
.chat-thread__identity h2[b-l1qhsg53q1] { font-size: .98rem; margin: 0 0 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-thread__identity small[b-l1qhsg53q1] { color: var(--chat-muted); font-size: .75rem; }
.chat-back[b-l1qhsg53q1] { background: transparent; border: 0; color: var(--chat-ink); cursor: pointer; display: none; font-size: 1rem; padding: 10px; }
.chat-thread__messages[b-l1qhsg53q1] { background: radial-gradient(circle at 15% 15%, #edf4ff70, transparent 30%), color-mix(in srgb, var(--chat-surface) 96%, #bed2f7); display: flex; flex: 1; flex-direction: column; gap: 10px; min-height: 0; overflow-x: hidden; overflow-y: auto; padding: 24px clamp(18px, 3vw, 40px); scroll-behavior: smooth; }
.chat-message[b-l1qhsg53q1] { align-self: flex-start; background: var(--chat-surface); border: 1px solid var(--chat-line); border-radius: 17px 17px 17px 5px; box-shadow: 0 4px 12px #1833630a; max-width: min(78%, 560px); overflow-wrap: anywhere; padding: 11px 14px 8px; }
.chat-message--mine[b-l1qhsg53q1] { align-self: flex-end; background: #e4efff; border-color: #d5e5ff; border-radius: 17px 17px 5px 17px; color: #1d355a; }
.chat-message p[b-l1qhsg53q1] { font-size: .9rem; line-height: 1.5; margin: 0 0 4px; white-space: pre-wrap; }
.chat-message small[b-l1qhsg53q1] { align-items: center; color: var(--chat-muted); display: flex; font-size: .68rem; gap: 6px; justify-content: flex-end; }
.chat-message--mine small[b-l1qhsg53q1] { color: #526780; }
.chat-message small i[b-l1qhsg53q1] { color: var(--chat-accent); }
.chat-thread__compose[b-l1qhsg53q1] { border-top: 1px solid var(--chat-line); flex: 0 0 auto; padding: 13px clamp(16px, 2.5vw, 28px) 11px; }
.chat-thread__compose label[b-l1qhsg53q1] { display: block; font-size: .78rem; font-weight: 800; margin-bottom: 7px; }
.chat-compose-row[b-l1qhsg53q1] { align-items: end; display: flex; gap: 10px; }
.chat-compose-row textarea[b-l1qhsg53q1] { background: color-mix(in srgb, var(--chat-surface) 94%, #9cb5df); border: 1px solid var(--chat-line); border-radius: 12px; color: var(--chat-ink); flex: 1; font: inherit; line-height: 1.4; min-height: 46px; min-width: 0; padding: 11px 13px; resize: vertical; }
.chat-compose-row textarea:focus[b-l1qhsg53q1] { border-color: var(--chat-accent); outline: 3px solid #3268da19; }
.chat-compose-row textarea[b-l1qhsg53q1]::placeholder { color: var(--chat-muted); opacity: 1; }
.chat-compose-row button[b-l1qhsg53q1] { align-items: center; background: var(--chat-accent); border: 0; border-radius: 12px; color: #fff; cursor: pointer; display: inline-flex; font: inherit; font-size: .84rem; font-weight: 750; gap: 8px; height: 46px; justify-content: center; padding: 0 17px; }
.chat-compose-row button:hover:not(:disabled)[b-l1qhsg53q1] { background: #2157c5; }
.chat-compose-row button:disabled[b-l1qhsg53q1] { cursor: not-allowed; opacity: .5; }
.chat-thread__compose > small[b-l1qhsg53q1] { color: var(--chat-muted); display: block; font-size: .68rem; margin-top: 7px; }
.chat-thread__empty[b-l1qhsg53q1], .chat-thread__blank[b-l1qhsg53q1] { align-items: center; color: var(--chat-muted); display: flex; flex: 1; flex-direction: column; justify-content: center; padding: 24px; text-align: center; }
.chat-thread__empty span[b-l1qhsg53q1], .chat-thread__blank > i[b-l1qhsg53q1] { align-items: center; background: #e7f0ff; border-radius: 20px; color: var(--chat-accent); display: flex; font-size: 1.4rem; height: 66px; justify-content: center; margin-bottom: 14px; width: 66px; }
.chat-thread__empty h3[b-l1qhsg53q1], .chat-thread__blank h2[b-l1qhsg53q1] { color: var(--chat-ink); font-size: 1rem; margin: 0 0 6px; }
.chat-thread__empty p[b-l1qhsg53q1], .chat-thread__blank p[b-l1qhsg53q1] { line-height: 1.5; margin: 0; max-width: 330px; }
.chat-error[b-l1qhsg53q1] { background: #fff0f0; border: 1px solid #f3caca; border-radius: 9px; color: #a52828; padding: 10px 14px; }
@media (max-width: 900px) {
    .chat-page__grid[b-l1qhsg53q1] { grid-template-columns: minmax(220px, 265px) minmax(0, 1fr); }
    .chat-message[b-l1qhsg53q1] { max-width: 88%; }
}
@media (max-width: 700px) {
    .chat-page[b-l1qhsg53q1] { padding: 10px 10px 16px; }
    .chat-page__header[b-l1qhsg53q1] { gap: 10px; margin-bottom: 12px; }
    .chat-page__heading-icon[b-l1qhsg53q1] { border-radius: 14px; flex-basis: 43px; height: 43px; }
    .chat-page__header p[b-l1qhsg53q1], .chat-live-label[b-l1qhsg53q1] { display: none; }
    .chat-page__header h1[b-l1qhsg53q1] { font-size: 1.45rem; }
    .chat-page__grid[b-l1qhsg53q1] { display: block; height: calc(100dvh - 190px); min-height: 410px; }
    .chat-conversations[b-l1qhsg53q1], .chat-thread[b-l1qhsg53q1] { border: 1px solid var(--chat-line); border-radius: 16px; height: 100%; }
    .chat-page__grid:not(.is-thread-open) .chat-thread[b-l1qhsg53q1] { display: none; }
    .chat-page__grid.is-thread-open .chat-conversations[b-l1qhsg53q1] { display: none; }
    .chat-back[b-l1qhsg53q1] { display: inline-flex; }
    .chat-thread__toolbar[b-l1qhsg53q1] { min-height: 64px; padding: 10px 12px; }
    .chat-thread__messages[b-l1qhsg53q1] { padding: 16px 13px; }
    .chat-message[b-l1qhsg53q1] { max-width: 88%; }
    .chat-page--student .chat-thread[b-l1qhsg53q1] { height: calc(100dvh - 190px); min-height: 410px; }
    .chat-compose-row button[b-l1qhsg53q1] { padding: 0 14px; }
    .chat-compose-row button span[b-l1qhsg53q1] { display: none; }
}
@media (max-width: 370px) {
    .chat-thread__compose[b-l1qhsg53q1] { padding: 10px; }
    .chat-message[b-l1qhsg53q1] { max-width: 94%; }
}

.chat-delete[b-l1qhsg53q1] { align-items: center; display: inline-flex; gap: 8px; margin-left: auto; flex: 0 0 auto; background: transparent; border: 1px solid var(--chat-line); border-radius: 10px; color: #dc2626; cursor: pointer; padding: 9px 12px; font-size: .8rem; min-height: 40px; }
.chat-delete:hover[b-l1qhsg53q1], .chat-delete:focus-visible[b-l1qhsg53q1] { border-color: #dc2626; outline: 2px solid color-mix(in srgb, #dc2626 20%, transparent); outline-offset: 2px; }
.chat-delete:disabled[b-l1qhsg53q1] { opacity: .45; cursor: default; }
.chat-thread__identity[b-l1qhsg53q1] { flex: 1; }
.chat-notice[b-l1qhsg53q1] { background: var(--chat-surface); color: var(--chat-ink); border: 1px solid var(--chat-line); border-radius: 10px; padding: 12px 16px; margin: 0 0 14px; font-size: .85rem; }
@media (max-width: 560px) { .chat-delete[b-l1qhsg53q1] { padding: 10px; } .chat-delete span[b-l1qhsg53q1] { display: none; } .chat-thread__toolbar[b-l1qhsg53q1] { gap: 8px; } }
/* /Components/Pages/Teacher/TeacherWorkspacePlaceholder.razor.rz.scp.css */
.workspace-placeholder[b-qta9suavoj] {
    color: var(--text-color);
    margin: 0 auto;
    max-width: 1120px;
}

.workspace-placeholder__heading[b-qta9suavoj] {
    align-items: flex-start;
    display: flex;
    gap: 18px;
    margin-bottom: 26px;
}

.workspace-placeholder__icon[b-qta9suavoj] {
    align-items: center;
    background: linear-gradient(145deg, var(--primary-color), #7c3aed);
    border-radius: 20px;
    box-shadow: var(--shadow-md);
    color: #fff;
    display: inline-flex;
    flex: 0 0 64px;
    font-size: 1.45rem;
    height: 64px;
    justify-content: center;
}

.workspace-placeholder__eyebrow[b-qta9suavoj] {
    color: var(--primary-color);
    display: block;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.workspace-placeholder h1[b-qta9suavoj] {
    font-size: clamp(1.65rem, 3vw, 2.35rem);
    margin: 0 0 7px;
}

.workspace-placeholder__heading p[b-qta9suavoj],
.workspace-placeholder article p[b-qta9suavoj] {
    color: var(--text-secondary);
    margin: 0;
}

.workspace-placeholder__notice[b-qta9suavoj] {
    align-items: flex-start;
    background: color-mix(in srgb, var(--primary-color) 8%, var(--card-bg));
    border: 1px solid color-mix(in srgb, var(--primary-color) 22%, transparent);
    border-radius: 16px;
    display: flex;
    gap: 13px;
    margin-bottom: 22px;
    padding: 16px 18px;
}

.workspace-placeholder__notice > i[b-qta9suavoj] {
    color: var(--primary-color);
    margin-top: 4px;
}

.workspace-placeholder__notice div[b-qta9suavoj] {
    display: grid;
    gap: 3px;
}

.workspace-placeholder__notice span[b-qta9suavoj] {
    color: var(--text-secondary);
}

.workspace-placeholder__grid[b-qta9suavoj] {
    display: grid;
    gap: 20px;
    grid-template-columns: minmax(0, 1.35fr) minmax(260px, 0.65fr);
}

.workspace-placeholder article[b-qta9suavoj] {
    background: var(--card-bg);
    border: 1px solid color-mix(in srgb, var(--text-secondary) 15%, transparent);
    border-radius: 18px;
    box-shadow: var(--shadow-sm);
    padding: 22px;
}

.workspace-placeholder article h2[b-qta9suavoj] {
    font-size: 1rem;
    margin: 0 0 16px;
}

.workspace-placeholder ul[b-qta9suavoj] {
    display: grid;
    gap: 12px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.workspace-placeholder li[b-qta9suavoj] {
    align-items: flex-start;
    display: flex;
    gap: 10px;
}

.workspace-placeholder li i[b-qta9suavoj] {
    color: var(--primary-color);
    margin-top: 5px;
}

.workspace-placeholder__back[b-qta9suavoj] {
    align-items: center;
    color: var(--primary-color);
    display: inline-flex;
    font-weight: 750;
    gap: 8px;
    margin-top: 20px;
    text-decoration: none;
}

@media (max-width: 720px) {
    .workspace-placeholder__grid[b-qta9suavoj] {
        grid-template-columns: 1fr;
    }

    .workspace-placeholder__heading[b-qta9suavoj] {
        gap: 13px;
    }

    .workspace-placeholder__icon[b-qta9suavoj] {
        border-radius: 15px;
        flex-basis: 52px;
        height: 52px;
    }
}