/* =========================================================
   AGIKS V3.4.16 — desktop/mobile navigation fix
   ========================================================= */

/*
   Кнопка мобильного меню НИКОГДА не отображается на десктопе.
   Ниже в @media(max-width:900px) она включается обратно.
*/
.agiks-platform-nav__toggle {
    display: none !important;
}


/* =========================================================
   AGIKS V3.4.13 — mobile hardening
   Загружается ПОСЛЕ всех остальных стилей.
   ========================================================= */

html {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    -webkit-text-size-adjust: 100%;
}

body {
    width: 100%;
    max-width: 100%;
    min-width: 0 !important;
    overflow-x: clip !important;
}

body * {
    min-width: 0;
}

img,
svg,
video,
canvas,
iframe {
    max-width: 100%;
    height: auto;
}

input,
select,
textarea,
button {
    box-sizing: border-box;
}

/* Исправление старого невалидного width:min(100% - 24px, ...) */
@media (max-width: 1100px) {
    .account_container,
    .new_class_page,
    .agiks-versions-page,
    .self-manage-page,
    .online-page,
    .activity-page,
    main.page,
    .wrap {
        width: calc(100% - 24px) !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* =========================================================
   NAVIGATION
   ========================================================= */
@media (max-width: 900px) {
    .agiks-platform-nav {
        width: 100% !important;
        max-width: 100% !important;
        position: sticky !important;
        top: 0 !important;
        z-index: 5000 !important;
    }

    .agiks-platform-nav__inner {
        width: calc(100% - 20px) !important;
        max-width: 100% !important;
        min-height: 58px !important;
        margin: 0 auto !important;
        padding: 8px 0 !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-auto-rows: auto !important;
        align-items: center !important;
        gap: 8px !important;
    }

    .agiks-platform-nav__brand {
        grid-column: 1 !important;
        width: fit-content !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    .agiks-platform-nav__brand-mark {
        width: 38px !important;
        height: 38px !important;
        flex: 0 0 38px !important;
    }

    .agiks-platform-nav__toggle {
        display: inline-flex !important;
        grid-column: 2 !important;
        justify-self: end !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 44px !important;
        min-height: 44px !important;
        padding: 0 !important;
        border-radius: 13px !important;
    }

    .agiks-platform-nav__toggle > span:last-child {
        display: none !important;
    }

    .agiks-platform-nav__toggle-icon {
        margin: 0 !important;
    }

    .agiks-platform-nav__links,
    .agiks-platform-nav__actions {
        display: none !important;
        grid-column: 1 / -1 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .agiks-platform-nav.is-mobile-open .agiks-platform-nav__links {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 5px !important;
        padding: 8px 0 4px !important;
    }

    .agiks-platform-nav.is-mobile-open .agiks-platform-nav__actions {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
        padding: 5px 0 4px !important;
    }

    .agiks-platform-nav__link,
    .agiks-platform-nav__group,
    .agiks-platform-nav__group > summary,
    .agiks-platform-nav__icon-link {
        width: 100% !important;
        max-width: 100% !important;
        white-space: normal !important;
    }

    .agiks-platform-nav__link,
    .agiks-platform-nav__group > summary,
    .agiks-platform-nav__icon-link {
        min-height: 44px !important;
        padding: 10px 12px !important;
        justify-content: space-between !important;
        overflow-wrap: anywhere !important;
    }

    .agiks-platform-nav__dropdown {
        position: static !important;
        inset: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 4px 0 7px !important;
        box-shadow: none !important;
    }

    .agiks-platform-nav__dropdown a {
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }
}

/* =========================================================
   ACCOUNT / DASHBOARD
   ========================================================= */
@media (max-width: 760px) {
    .main,
    .main > section,
    .account_container,
    .account_info,
    .account_content {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .account_container {
        width: calc(100% - 16px) !important;
        padding: 14px 0 26px !important;
        margin: 0 auto !important;
    }

    .account_container > h1 {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 16px !important;
        padding: 0 2px !important;
        font-size: clamp(27px, 8.4vw, 36px) !important;
        line-height: 1.08 !important;
        text-align: left !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }

    .account_info {
        display: block !important;
    }

    .account_content {
        display: block !important;
    }

    .agiks-account-toolbar {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 0 !important;
        margin: 0 0 14px !important;
        padding: 14px !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        align-items: stretch !important;
        overflow: visible !important;
    }

    .agiks-account-toolbar__profile {
        width: 100% !important;
        max-width: 100% !important;
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) !important;
        gap: 10px !important;
        align-items: center !important;
    }

    .agiks-account-toolbar__avatar {
        width: 44px !important;
        height: 44px !important;
    }

    .agiks-account-toolbar__profile > div:last-child {
        min-width: 0 !important;
    }

    .agiks-account-toolbar__profile strong,
    .agiks-account-toolbar__profile span {
        max-width: 100% !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    .agiks-account-toolbar__settings {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        align-items: stretch !important;
    }

    .agiks-account-toolbar__settings form {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: minmax(0,1fr) auto !important;
        gap: 8px !important;
        align-items: stretch !important;
    }

    .agiks-account-toolbar__settings .agiks-small-button {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 44px !important;
        white-space: normal !important;
    }

    .role-specific-content,
    .agiks-admin-command,
    .agiks-admin-hero,
    .admin_stats,
    .teacher_dashboard,
    .student_dashboard {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 14px !important;
        border-radius: 18px !important;
        overflow: hidden !important;
    }

    .agiks-command-head,
    .agiks-admin-hero__head,
    .agiks-section-title-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        align-items: stretch !important;
    }

    .agiks-command-head h2,
    .agiks-admin-hero h2,
    .role-specific-content h2,
    .admin_stats h3 {
        max-width: 100% !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        font-size: clamp(21px, 6.5vw, 28px) !important;
    }

    .agiks-command-head p,
    .agiks-admin-hero p {
        max-width: 100% !important;
        overflow-wrap: anywhere !important;
    }

    .agiks-command-health {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        justify-content: stretch !important;
    }

    .agiks-health-chip {
        width: 100% !important;
        max-width: 100% !important;
        justify-content: flex-start !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        border-radius: 12px !important;
    }

    .agiks-command-kpis,
    .agiks-command-actions,
    .agiks-dashboard-grid,
    .admin_stats_grid,
    .admin_stats_cards,
    .admin_stats_cards.three_columns,
    .enrollment_status_grid,
    .stream_status_grid,
    .teacher_dashboard_grid,
    .agiks-session-strip {
        width: 100% !important;
        max-width: 100% !important;
        grid-template-columns: 1fr !important;
        gap: 9px !important;
    }

    .agiks-admin-command .agiks-kpi,
    .agiks-command-action,
    .agiks-dashboard-card,
    .admin_stat_card,
    .admin_role_card,
    .admin_stream_card,
    .admin_direction_card,
    .enrollment_status_card {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: 0 !important;
    }

    .agiks-command-layout,
    .agiks-dashboard-columns {
        width: 100% !important;
        max-width: 100% !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .agiks-command-panel,
    .agiks-command-panel__body,
    .agiks-command-panel__head {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .agiks-command-panel__head {
        display: grid !important;
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
    }

    .agiks-command-class,
    .agiks-upcoming-item {
        width: 100% !important;
        grid-template-columns: 1fr !important;
        gap: 5px !important;
    }

    .agiks-command-class .agiks-command-mini-link {
        grid-column: auto !important;
        width: 100% !important;
    }

    .agiks-command-class strong,
    .agiks-command-class span,
    .agiks-upcoming-item * {
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }
}

@media (max-width: 420px) {
    .account_container {
        width: calc(100% - 12px) !important;
    }

    .agiks-account-toolbar__settings form {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   GENERIC FORMS / CARDS
   ========================================================= */
@media (max-width: 760px) {
    .new_class_page,
    .self-manage-page,
    .online-page,
    .activity-page,
    .agiks-versions-page,
    main.page,
    .wrap {
        width: calc(100% - 16px) !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .new_class_form,
    .edit_class_form,
    .form-grid,
    .users_filters,
    .schedule_filters,
    .bulk-grid,
    .profile_grid,
    .journal_summary_grid,
    .monitor-grid,
    .online-filters,
    .activity-filters,
    .online-summary,
    .activity-summary {
        width: 100% !important;
        grid-template-columns: 1fr !important;
        gap: 9px !important;
    }

    .panel,
    .course-card,
    .class-card,
    .profile_card,
    .monitor-section,
    .schedule-section,
    .messages_users,
    .messages_chat,
    .online-panel,
    .activity-panel {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 13px !important;
        border-radius: 18px !important;
    }

    input,
    select,
    textarea {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        font-size: 16px !important;
    }

    button,
    .btn,
    .auth_button,
    .button_login,
    .table_action_button,
    .agiks-small-button,
    .agiks-action {
        max-width: 100% !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    .actions,
    .page_actions,
    .top_actions,
    .schedule_actions,
    .item-actions,
    .edit_form_actions {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .actions > *,
    .page_actions > *,
    .top_actions > *,
    .schedule_actions > *,
    .item-actions > *,
    .edit_form_actions > * {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* =========================================================
   TABLES
   ========================================================= */
@media (max-width: 760px) {
    .table_wrap,
    .journal_table_wrap,
    .monitor-table-wrap,
    .admin_table_wrap,
    .teacher_mini_journal,
    .schedule-section {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    table {
        max-width: none !important;
    }

    .schedule-section table,
    .teacher_mini_journal table {
        width: max-content !important;
        min-width: 720px !important;
    }
}

/* =========================================================
   MESSAGES
   ========================================================= */
@media (max-width: 760px) {
    .messages_layout {
        width: 100% !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .messages_users,
    .messages_chat {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .messages_user_list {
        max-height: 38vh !important;
    }

    .messages_list {
        min-height: 280px !important;
        max-height: 52vh !important;
    }

    .message_item {
        max-width: 94% !important;
        overflow-wrap: anywhere !important;
    }
}

/* =========================================================
   SELF STUDY
   ========================================================= */
@media (max-width: 760px) {
    .self_summary,
    .self_tasks,
    .self_course_stats,
    .materials_grid {
        width: 100% !important;
        grid-template-columns: 1fr !important;
    }

    .self-manage-page .grid {
        grid-template-columns: 1fr !important;
    }

    .self-manage-page .session-box {
        width: 100% !important;
        max-height: 48vh !important;
    }

    .self-manage-page .session-option {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* =========================================================
   ONLINE / ACTIVITY PAGES
   ========================================================= */
@media (max-width: 760px) {
    .online-head,
    .activity-head {
        display: grid !important;
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
        gap: 10px !important;
    }

    .online-head h1,
    .activity-head h1 {
        max-width: 100% !important;
        font-size: clamp(28px, 8vw, 34px) !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    .online-person,
    .activity-person {
        width: 100% !important;
        max-width: 100% !important;
        grid-template-columns: 44px minmax(0,1fr) !important;
    }

    .online-contexts,
    .online-activity,
    .activity-role,
    .activity-contexts,
    .activity-person > div:nth-last-child(-n+2) {
        grid-column: 2 !important;
        justify-self: stretch !important;
        text-align: left !important;
    }
}

/* =========================================================
   MODALS
   ========================================================= */
@media (max-width: 760px) {
    .modal,
    .modal_content,
    .modal-content,
    .chat_members_modal,
    .edit_modal,
    [role="dialog"] {
        width: calc(100vw - 16px) !important;
        max-width: calc(100vw - 16px) !important;
        max-height: calc(100dvh - 16px) !important;
        margin: 0 auto !important;
        overflow-y: auto !important;
    }
}


/* =========================================================
   V3.4.27 — MOBILE STUDENT SCHEDULE
   На телефоне расписание слушателя — полноценные карточки,
   без горизонтального растягивания таблицы.
   ========================================================= */
@media (max-width: 760px) {
    .role-specific-content.role-4,
    .role-specific-content.role-4 .course-card,
    .role-specific-content.role-4 .session-content,
    .role-specific-content.role-4 .student-schedule-section {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .role-specific-content.role-4 .course-card {
        overflow: hidden !important;
        padding: 14px !important;
    }

    .role-specific-content.role-4 .course-card h3,
    .role-specific-content.role-4 .student-schedule-section td {
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }

    /* Сессии не уезжают вправо: на телефоне показываем сеткой 2×N. */
    .role-specific-content.role-4 .session-tabs {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important;
        margin: 14px 0 !important;
        padding: 6px !important;
        box-sizing: border-box !important;
    }

    .role-specific-content.role-4 .session-tabs .tab-button {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 42px !important;
        padding: 9px 8px !important;
        margin: 0 !important;
        white-space: normal !important;
        text-align: center !important;
        line-height: 1.2 !important;
        box-sizing: border-box !important;
    }

    .role-specific-content.role-4 .session-content {
        padding: 12px !important;
        overflow: hidden !important;
        border-radius: 16px !important;
    }

    .role-specific-content.role-4 .session-content > h2 {
        margin: 0 0 14px !important;
        padding: 0 !important;
        font-size: clamp(24px, 7vw, 30px) !important;
        line-height: 1.08 !important;
        text-align: left !important;
    }

    /* Отменяем позднее общее правило mobile_v3_4_16.css,
       которое возвращало таблице min-width:720px и горизонтальный скролл. */
    .role-specific-content.role-4 .student-schedule-section {
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    .role-specific-content.role-4 .student-schedule-section table,
    .role-specific-content.role-4 .student-schedule-section thead,
    .role-specific-content.role-4 .student-schedule-section tbody,
    .role-specific-content.role-4 .student-schedule-section tr,
    .role-specific-content.role-4 .student-schedule-section th,
    .role-specific-content.role-4 .student-schedule-section td {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .role-specific-content.role-4 .student-schedule-section table {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        overflow: visible !important;
    }

    .role-specific-content.role-4 .student-schedule-section thead {
        display: none !important;
    }

    .role-specific-content.role-4 .student-schedule-section tbody {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .role-specific-content.role-4 .student-schedule-section tr {
        margin: 0 !important;
        padding: 14px !important;
        overflow: hidden !important;
        border: 1px solid #d7e3ef !important;
        border-radius: 16px !important;
        background: #ffffff !important;
        box-shadow: 0 8px 20px rgba(6, 28, 53, 0.07) !important;
    }

    .role-specific-content.role-4 .student-schedule-section td {
        position: relative !important;
        padding: 10px 0 11px !important;
        border: 0 !important;
        border-bottom: 1px solid #e7eef6 !important;
        background: transparent !important;
        color: #17324d !important;
        font-size: 14px !important;
        line-height: 1.4 !important;
        overflow-wrap: anywhere !important;
    }

    .role-specific-content.role-4 .student-schedule-section td:last-child {
        padding-bottom: 0 !important;
        border-bottom: 0 !important;
    }

    .role-specific-content.role-4 .student-schedule-section td::before {
        content: attr(data-label) !important;
        display: block !important;
        margin: 0 0 6px !important;
        color: #64748b !important;
        font-family: 'DroidSans-Bold', 'DroidSans', Arial, sans-serif !important;
        font-size: 11px !important;
        line-height: 1.25 !important;
        text-transform: uppercase !important;
        letter-spacing: .035em !important;
    }

    .role-specific-content.role-4 .student-schedule-section td[data-label="Название занятия"] {
        color: #02315d !important;
        font-family: 'DroidSans-Bold', 'DroidSans', Arial, sans-serif !important;
        font-size: 16px !important;
        line-height: 1.35 !important;
    }

    /* У задания без длительности не показываем пустой блок на телефоне. */
    .role-specific-content.role-4 .student-schedule-section td.schedule-duration-empty {
        display: none !important;
    }

    .role-specific-content.role-4 .student-schedule-section .class_datetime,
    .role-specific-content.role-4 .student-schedule-section .teacher_card {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 0 !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        gap: 3px !important;
        padding: 10px 11px !important;
        border: 1px solid #dce7f2 !important;
        border-radius: 12px !important;
        background: #f5f8fb !important;
        color: #02315d !important;
        text-align: left !important;
        white-space: normal !important;
        box-sizing: border-box !important;
    }

    .role-specific-content.role-4 .student-schedule-section .teacher_card {
        flex-direction: column !important;
    }

    .role-specific-content.role-4 .student-schedule-section .class_link_block {
        width: 100% !important;
        margin: 0 0 7px !important;
    }

    .role-specific-content.role-4 .student-schedule-section .class_link_block:last-child {
        margin-bottom: 0 !important;
    }

    .role-specific-content.role-4 .student-schedule-section .link-class,
    .role-specific-content.role-4 .student-schedule-section .link-recording {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 44px !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 10px 12px !important;
        margin: 0 !important;
        text-align: center !important;
        white-space: normal !important;
        box-sizing: border-box !important;
    }

    .role-specific-content.role-4 .student-schedule-section .status_badge {
        display: inline-flex !important;
        width: auto !important;
        max-width: 100% !important;
        min-height: 0 !important;
        justify-content: flex-start !important;
        padding: 8px 11px !important;
        text-align: left !important;
        white-space: normal !important;
    }

    .student-schedule-empty-note {
        display: block;
        width: 100%;
        padding: 10px 11px;
        border-radius: 12px;
        background: #f5f8fb;
        border: 1px dashed #d7e3ef;
        color: #64748b;
        font-size: 13px;
        line-height: 1.35;
        box-sizing: border-box;
    }
}

@media (max-width: 360px) {
    .role-specific-content.role-4 .session-tabs {
        grid-template-columns: 1fr !important;
    }
}