.common_detail_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: flex-start;
    min-height: 30px;
    padding: 0 16px;
    border: 1px solid #e4eaf1;
    border-radius: 999px;
    background: #eef4ff;
    color: #10428C;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    text-decoration: none;
    margin: 0px 0px 14px;
}

.common_detail_btn:hover,
.common_detail_btn:focus-visible {
    background: #e3ecff;
    color: #10428C;
}

/* ================================
   Admission Page
   ================================ */
[v-cloak] {
    display: none;
}

.admission_shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: #f5f7fa;
}

.admission_shell > .container-fluid {
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
}

.admission_shell main {
/*    flex: 1 0 auto;*/
    padding-bottom: 0 !important;
}

.admission_shell .site-footer {
    margin-top: auto;
}

.admission_page_root {
    width: 100%;
    min-width: 0;
}

.admission_mobile_toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 14px 0;
    min-height: 56px;
}

.admission_mobile_trigger {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    justify-content: center;
    min-width: 80px;
    height: 42px;
    padding: 0 14px;
    border: 1px solid #d7deea;
    border-radius: 12px;
    background: #fff;
    color: #10428C;
    font-size: 14px;
    font-weight: 600;
    box-shadow: 0 1px 2px rgba(16, 66, 140, 0.06);
}

.admission_mobile_current {
    display: block;
    margin-left: auto;
    color: #10428C;
    font-size: 18px;
    font-weight: 600;
    text-align: right;
    line-height: 1.3;
    white-space: nowrap;
}

.admission_layout_shell {
    display: flex;
    width: 100%;
    min-height: calc(100vh - 68px);
    min-width: 0;
    align-items: stretch;
}

.admission_sidebar {
    width: 300px;
    flex: 0 0 300px;
    background: #d7dee7;
}

.admission_sidebar_panel {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    height: 100%;
    padding: 14px 12px 42px;
    background: #d7dee7;
}

.admission_sidebar_panel::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-image: url("../img/Khee.svg");
    background-repeat: repeat;
    background-size: 80px auto;
    opacity: 0.32;
    pointer-events: none;
}

.admission_sidebar_node + .admission_sidebar_node {
    margin-top: 6px;
}

.admission_sidebar_node {
    position: relative;
    z-index: 1;
}

.admission_sidebar_link {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 40px;
    padding: 0 14px;
    border-radius: 10px;
    color: #4b5565;
    font-size: 16px;
    font-weight: 500;
    text-decoration: none;
}

.admission_sidebar_link.admission_has_no_symbol,
.admission_sidebar_link.has-no-symbol {
    grid-template-columns: minmax(0, 1fr) auto;
}

.admission_sidebar_symbol {
    color: #97a2b4;
    font-size: 13px;
}

.admission_sidebar_link:hover {
    background: #eef2f7;
    color: #10428C;
}

.admission_sidebar_link.is-active {
    background: #eef2f7;
    color: #10428C;
}

.admission_sidebar_link.is-root-section {
    background: #eef2f7;
    color: #10428C;
    font-weight: 600;
}

.admission_sidebar_link.is-root-section {
    position: relative;
}

.admission_sidebar_link.is-root-section::after {
    content: "";
    position: absolute;
    right: -12px;
    bottom: -12px;
    left: -12px;
    height: 1px;
    background: #fff;
}

.admission_sidebar_node:has(> .admission_sidebar_link.is-root-section) + .admission_sidebar_node {
    margin-top: 18px;
}

.admission_sidebar_link.is-active {
    font-weight: 600;
}

.admission_sidebar_link.is-active .admission_sidebar_symbol,
.admission_sidebar_link:hover .admission_sidebar_symbol {
    color: #10428C;
}

.admission_sidebar_children {
    display: none;
    gap: 6px;
    padding-top: 6px;
}

.admission_sidebar_children.is-open {
    display: grid;
}

.admission_sidebar_child {
    margin-left: 24px;
}

.admission_sidebar_child.admission_has_no_symbol,
.admission_sidebar_child.has-no-symbol {
    margin-left: 24px;
    padding-left: 40px;
}

.admission_sidebar_clock {
    grid-column: -2 / -1;
    justify-self: end;
    color: #10428C !important;
    font-size: 12px !important;
}

.admission_content {
    flex: 1;
    min-width: 0;
    max-width: 100%;
    padding: 28px 30px;
    background: #fff;
}

.admission_meta_header {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 14px;
    min-width: 0;
    padding: 16px 0 21px;
    border-bottom: 0;
}

.admission_meta_divider {
    display: block;
    width: 100%;
    height: 0;
    margin: 20px 0 24px;
    border: 0;
    border-top: 1px solid #10428C;
}

.admission_schedule_row {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 32px;
}

.admission_schedule_main {
    flex: 1 1 auto;
    min-width: 0;
}

@media (max-width: 767.98px) {
    .admission_schedule_row {
        flex-direction: column;
        align-items: stretch;
    }

}

.admission_registration_info > h2 {
    display: none;
    margin: 0 0 14px;
    color: #1f2937;
    font-size: 16px;
    font-weight: 700;
}

.admission_registration_header {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px 14px;
    margin: 0 0 14px;
}

.admission_registration_header h2 {
    margin: 0;
    color: #1f2937;
    font-size: 16px;
    font-weight: 700;
}

.admission_meta_main {
    position: relative;
    min-width: 0;
}
/* Элсэлт overview page дээр дээд зайг багасгах */
.admission_content.is-overview {
    padding-top: 0 !important;
    margin-top: 0 !important;
}
    .admission_meta_main h1 {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 14px;
        margin: 0 0 22px;
        font-size: 20px;
        font-weight: 600;
        color: var(--num-blue);
    }
.admission_content.is-overview .admission_meta_main h1 {
    color: #252B42;
}
/* Зөвхөн Элсэлт overview page-ийн section гарчиг */
.admission_content.is-overview .admission_info_section h2 {
    
    font-size: 16px;
    font-weight: 600;
    color: #252B42;
}

/* Overview page section хоорондын зай */
.admission_content.is-overview .admission_info_section {
    margin-bottom: 42px;
}

/* Гарчгийн доорх текст арай зайтай эхэлнэ */
.admission_content.is-overview .admission_info_html {
    margin-top: 0;
}
.admission_season {
    margin: 0;
    color: #1f2937;
    font-size: 14px;
    font-weight: 500;
}

.admission_date_lines p {
    margin: 0 0 2px;
    color: #374151;
    font-size: 14px;
    line-height: 1.45;
}

.admission_date_lines strong {
    font-weight: 800;
}

.admission_schedule_groups {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 490px), 490px));
    gap: 10px;
    width: 100%;
}

.admission_schedule_group {
    border: 1px solid #dce3ec;
    border-radius: 10px;
    padding: 10px 14px;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    overflow: hidden;
}

.admission_schedule_group:only-child {
    border: none;
    padding: 0;
}

.admission_schedule_group .admission_location_badge {
    align-items: flex-start;
    white-space: normal;
    overflow-wrap: break-word;
}

.admission_schedule_group .admission_location_badge .bi-geo-alt {
    margin-top: 3px;
}

.admission_schedule_group .admission_location_badge .bi-geo-alt {
    flex-shrink: 0;
    width: 14px;
    text-align: center;
}

.admission_location_sublabel {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: 4px;
    margin-left: 20px;
    color: #374151;
    font-size: 13px;
    white-space: normal;
    overflow-wrap: break-word;
}

.admission_location_sublabel .bi-building {
    margin-top: 2px;
    color: currentColor;
    font-size: 12px;
}

.admission_schedule_group_status {
    margin-bottom: 6px;
}

.admission_schedule_group .admission_date_lines {
    margin-bottom: 4px;
}

.admission_schedule_group .admission_date_lines:last-child {
    margin-bottom: 0;
}

.admission_meta_actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 34px;
    min-width: 180px;
    padding-top: 0;
}

.admission_status_badge {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    min-height: 18px;
    padding: 0;
    border-radius: 0;
    background: transparent !important;
    font-size: 11px;
    font-weight: 600 !important;
    white-space: nowrap;
    color: #475467 !important;
}

.admission_status_badge::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex: 0 0 auto;
    background: currentColor;
}

.admission_status_badge.is-active {
    color: #198754 !important;
}

.admission_status_badge.text-bg-success {
    color: #198754 !important;
}

.admission_status_badge.is-upcoming {
    color: #f0ad00 !important;
}

.admission_status_badge.text-bg-warning {
    color: #f0ad00 !important;
}

.admission_status_badge.is-closed {
    color: #dc3545 !important;
}

.admission_status_badge.text-bg-danger {
    color: #dc3545 !important;
}

.admission_request_link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 112px;
    height: 32px;
    padding: 0 16px;
    border-radius: 8px;
    background: #10428C;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
    margin-top: 0;
}

.admission_request_link:hover,
.admission_request_link:focus {
    background: #0d3674;
    color: #fff;
}

.admission_info_sections {
    min-width: 0;
    max-width: 100%;

}

.admission_info_section {
    min-width: 0;
    max-width: 100%;
    margin: 34px 0;
}

.admission_info_section:not(.is-notice) {
    --section-accent: #10428C;
    position: relative;
    overflow: hidden;
    padding: 22px 24px 24px;
    border: 1px solid #dbe4f0;
    border-radius: 12px;
   
    box-shadow: 0 4px 16px rgba(16, 66, 140, 0.05);
}

.admission_info_section:not(.is-notice)::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 4px;
    background: var(--section-accent);
}

.admission_info_section.is-requirement {
    --section-accent: #26745f;
}

.admission_info_section.is-material {
    --section-accent: #6b5aad;
}

.admission_info_heading {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #e3e9f1;
}

.admission_info_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    width: 34px;
    height: 34px;
    border-radius: 9px;
    background: #edf3fb;
    color: var(--section-accent);
    font-size: 16px;
}

.admission_info_section .admission_info_heading h2 {
    margin: 0;
    color: #182230;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.35;
}

@media (max-width: 767.98px) {
    .admission_info_section:not(.is-notice) {
        padding: 18px 16px 20px;
        border-radius: 10px;
    }

    .admission_info_heading {
        gap: 10px;
    }
}

.admission_info_section:not(.is-notice) .admission_info_html ul,
.admission_info_section:not(.is-notice) > ul {
    display: grid;
    gap: 5px;
}

.admission_info_section.is-collapsible .admission_info_body {
    max-height: 132px;
    overflow: hidden;
}

.admission_info_section.is-collapsible.is-expanded .admission_info_body {
    max-height: none;
}

/* Looks come from .common_detail_btn; only the show/hide state lives here. */
.admission_info_toggle {
    margin-top: 14px;
}

.admission_info_toggle:not(.is-visible) {
    display: none;
}

.admission_info_section:not(.is-notice) .admission_info_html li::marker,
.admission_info_section:not(.is-notice) > ul li::marker {
    color: var(--section-accent);
}

    .admission_info_section h2 {
        font-size: 16px;
        font-weight: 700;

      
    }
/* дотор гарчиг (магистр, доктор) */
.admission_info_html h3 {
    font-size: 15px;
    font-weight: 700;
    color: #111827;
    margin: 25px 0 6px;
}

/* текст */
.admission_info_html p,
.admission_info_html li {
    font-size: 14px;
    line-height: 1.6;
    color: #1F2933;
    margin-bottom: 0;
    text-align: justify;
}
.admission_info_html,
.admission_info_section li {

    font-size: 14px;
    line-height: 1.55;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.admission_info_html a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    color: #10428C;
    font-weight: 500;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.admission_info_section ul {
    margin: 0;
    padding-left: 18px;
}

.admission_info_section.is-notice {
    background: #FFEED1;
    border-radius: 8px;
    padding: 12px 16px;
    margin: 0 0 18px;
}

.admission_meta_header .admission_meta_main h1 {
    margin-bottom: 0;
}

.admission_meta_header .admission_meta_actions {
    min-width: 0;
    margin-left: 0;
}

    .admission_info_section.is-notice h2 {
        margin: 0 0 18px;
        padding-bottom: 16px;
        display: none;
    }

.admission_program_app {
    padding-top: 10px;
    padding-bottom: 130px;
}

.admission_program_heading {
    margin: 0 0 18px;
    color: #182230;
    font-size: 16px;
    font-weight: 700;
}

.admission_filter_row {
    display: grid;
    grid-template-columns: minmax(240px, 330px) minmax(240px, 1fr);
    gap: 18px;
    align-items: end;
    max-width: 720px;
    margin-bottom: 20px;
}

.admission_filter_row .form-label {
    margin-bottom: 8px;
    color: #1f2937;
    font-size: 14px;
    font-weight: 600;
}

.admission_filter_row .form-select,
.admission_filter_row .form-control,
.admission_filter_row .input-group-text {
    min-height: 42px;
    border-color: #d9d9d9;
    font-size: 12px;
}

.admission_filter_row .input-group-text {
    background: #fff;
}

.admission_table_shell {
    overflow-x: auto;
}

.admission_program_table {
    min-width: 920px;
    margin: 0;
}

    .admission_program_table thead th {
        padding: 14px 12px;
        border-bottom: 1px solid #B8C7DD !important;
        color: #1F2933;
        font-size: 13px;
        font-weight: 500;
        white-space: nowrap;
        background: #fff;
    }
.admission_program_table {
    border-collapse: collapse; /* 👈 маш чухал */
}
    .admission_program_table tbody td {
        padding: 16px 12px;
        border-bottom: 1px solid #B8C7DD;
        color: #1F2933;
        font-size: 13px;
        vertical-align: top;
        background: #fff;
    }

.exam_schedule_list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 260px;
}

.exam_schedule_item {
    color: #344054;
    font-size: 13px;
    line-height: 1.55;
}

.exam_schedule_item + .exam_schedule_item {
    padding-top: 10px;
    border-top: 1px solid #e4e7ec;
}

.exam_schedule_item > div {
    display: block;
    white-space: normal;
}

.exam_schedule_item span {
    color: #98a2b3;
    font-weight: 400;
}

.auth_account_exam_schedule {
    margin: 0;
}

.auth_account_program_info_panel {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
    margin: 10px 0 0;
    padding: 12px 14px;
    border: 1px solid #e4e9f2;
    border-radius: 10px;
    background: #f8fafc;
}

.auth_account_program_info_panel .auth_account_exam_schedule {
    padding-bottom: 10px;
    border-bottom: 1px solid #e4e9f2;
}

.auth_account_student_info_panel .auth_account_program_meta span {
    flex-basis: 135px;
}

.auth_account_exam_summary_row {
    display: grid;
    grid-template-columns: 135px minmax(0, 1fr);
    align-items: start;
    gap: 6px;
    color: #475467;
    font-size: 13px;
    line-height: 1.45;
}

.auth_account_exam_summary_row > span {
    color: #667085;
}

.auth_account_exam_summary_row > strong {
    color: #293346;
    font-weight: 600;
}

.auth_account_exam_summary_row.is-note > strong {
    color: #475467;
    font-weight: 400;
}

.auth_account_exam_summary_value.is-success {
    color: #198754;
}

.auth_account_exam_summary_value.is-danger {
    color: #dc3545;
}

.auth_account_exam_summary_value.is-warning {
    color: #d99a00;
}

.admission_program_name {
    width: 36%;
}

.admission_program_name strong {
    display: block;
    margin: 0;
    color: #1f2937;
    font-size: 13px;
    font-weight: 500;
}

.admission_program_name a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    margin-bottom: 4px;
    color: #10428C;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
}

.admission_program_title_line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 8px;
}

.admission_program_title_line strong {
    flex: 1 1 auto;
    min-width: 0;
}

.admission_program_detail_line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.admission_title_divider {
    flex-shrink: 0;
    width: 1px;
    height: 16px;
    background: #d7deea;
}

.admission_location_badge {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #34456b;
    font-size: 14px;
    white-space: nowrap;
}

.admission_date_lines + .admission_location_badge {
    margin-top: 6px;
}

.admission_location_badge.is-ub {
    color: #1565d8;
}

.admission_location_badge.is-regional {
    color: #b9720f;
}

.admission_location_badge .bi-geo-alt {
    color: currentColor;
    font-size: 12px;
}

.admission_program_meta_line {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
    gap: 8px;
}

.admission_program_name .admission_program_detail_btn {
    flex: 0 0 auto;
    min-height: 34px;
    margin: 0;
    padding: 0 18px;
    border-radius: 999px;
    background: #eef4ff;
    color: #10428C;
    font-size: 13px;
    font-weight: 500;
}

.admission_program_name .admission_program_detail_btn:hover {
    background: #e3ecff;
    color: #10428C;
}

    .admission_program_name span {
        display: block;
        color: #7F8C8D;
        font-size: 13px;
        line-height: 1.5;
    }

.admission_empty_row {
    height: 64px;
    color: #98a2b3 !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.admission_pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 18px;
}

.admission_pagination_summary {
    color: #64748b;
    font-size: 13px;
}

.admission_pagination .pagination {
    margin: 0;
    gap: 6px;
}

.admission_pagination .page-link {
    min-width: 34px;
    border: 1px solid #d8e2f0;
    border-radius: 6px;
    color: #10428C;
    font-size: 13px;
    text-align: center;
}

.admission_pagination .page-item.active .page-link {
    border-color: #10428C;
    background: #10428C;
    color: #fff;
}

.admission_pagination .page-item.disabled .page-link {
    color: #94a3b8;
}

.admission_introduction_backdrop {
    position: fixed;
    inset: 0;
    z-index: 1080;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(15, 23, 42, 0.55);
}

.transfer_request_intro_backdrop {
    z-index: 1105;
}

.admission_introduction_modal {
    display: flex;
    flex-direction: column;
    width: min(900px, 100%);
    max-height: calc(100vh - 48px);
    overflow: hidden;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.28);
}

.admission_introduction_header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 18px 22px;
    border-bottom: 1px solid #dbe3ee;
}

.admission_introduction_header h2 {
    margin: 0;
    color: #10428C;
    font-size: 19px;
    font-weight: 700;
}

.auth_account_modal_header h3,
.transfer_modal_header h3,
.admission_introduction_header h2,
.non_degree_modal_header h2 {
    color: #213456;
    font-weight: 500;
}

.admission_introduction_close {
    flex: 0 0 auto;
    border: 0;
    background: transparent;
    color: #4b5563;
    font-size: 18px;
}

.admission_introduction_body {
    overflow: auto;
    padding: 22px;
    color: #1f2937;
    font-size: 14px;
    line-height: 1.6;
}

.admission_introduction_body img {
    max-width: 100% !important;
    height: auto !important;
}

.admission_introduction_body table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    border-collapse: collapse;
}

.admission_introduction_empty {
    margin: 0;
    color: #64748b;
}

@media (max-width: 767.98px) {
    .admission_introduction_backdrop {
        padding: 12px;
    }

    .admission_introduction_modal {
        max-height: calc(100vh - 24px);
    }

    .admission_introduction_header,
    .admission_introduction_body {
        padding: 16px;
    }
}

.admission_sidebar_canvas {
    width: 280px !important;
    border-right: 0;
}

.admission_sidebar_canvas .offcanvas-header {
    padding: 14px 16px 0;
    background: #d7dee7;
}

.admission_sidebar_canvas .offcanvas-title {
    color: #10428C;
    font-size: 15px;
    font-weight: 600;
}

.admission_season_status {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-bottom: 10px;
}

.admission_sidebar_canvas .offcanvas-body {
    padding: 8px 0 0;
    background: #d7dee7;
}

@media (max-width: 991.98px) {
    .admission_layout_shell {
        min-height: auto;
    }

    .admission_content {
        width: 100%;
        padding: 12px 14px 24px;
    }

    .admission_meta_header {
        padding-top: 8px;
    }

    .admission_filter_row {
        max-width: none;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .admission_mobile_toolbar {
        padding: 14px 18px 0;
    }
}

@media (min-width: 992px) and (max-width: 1399.98px) {
    .admission_content {
        padding: 16px 18px 24px;
    }

    .admission_meta_header {
        flex-wrap: wrap;
    }

    .admission_meta_actions {
        min-width: 0;
        margin-left: auto;
    }

    .admission_status_badge {
        max-width: 180px;
        white-space: normal;
        text-align: center;
        justify-content: center;
    }

    .admission_program_table {
        min-width: 780px;
    }
}

@media (max-width: 767.98px) {
    .admission_mobile_toolbar {
        padding: 12px 14px 12px;
    }

    .admission_mobile_trigger {
        min-width: 80px;
        height: 42px;
        padding: 0 12px;
        font-size: 14px;
    }

    .admission_mobile_current {
        max-width: calc(100% - 96px);
        font-size: 17px;
    }

    .admission_meta_header {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 10px 14px;
    }

    .admission_meta_actions {
        align-items: flex-start;
        min-width: 0;
    }

    .admission_filter_row {
        grid-template-columns: 1fr;
    }

    .admission_pagination {
        align-items: flex-start;
        flex-direction: column;
    }
}

.admission_second_title {
    margin-top: 36px;
    padding-bottom: 16px;
    border-bottom: 1px solid #174EA6;
}

    .admission_second_title h1 {
        font-size: 20px;
        font-weight: 700;
        color: #111827;
        margin: 0;
    }

.admission_info_sections.admission_second {
    margin-top: 18px;
}

.admission_sidebar_button {
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
}

.admission_sidebar_arrow,
.admission_sidebar_button {
    display: none;
}
.admission_sidebar_children {
    display: block;
}

/* ================================
   Admission Request Page
   ================================ */
.admission_request_page .transfer_stepper_six,
.transfer_request_consent_page .transfer_stepper_five,
.transfer_request_consent_page .transfer_stepper_six {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.transfer_request_consent_page .transfer_stepper_five {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.admission_request_page .transfer_stepper_five {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.admission_request_consent_copy {
    color: #424c5a;
    font-size: 14px;
    line-height: 1.6;
}

.admission_request_consent_copy p {
    margin-bottom: 14px;
}

.admission_request_consent_list {
    margin: 0 0 18px 18px;
    padding: 0;
}

.admission_request_consent_questions,
.admission_request_student_consent_box {
    display: grid;
    gap: 8px;
    padding: 18px 16px;
    border-radius: 12px;
    background: #f4f7fb;
}

.admission_request_consent_questions h3,
.admission_request_student_consent_box h3 {
    margin: 0;
    color: #1f2733;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
}

.admission_request_consent_check {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #10428C;
    font-size: 14px;
}

.admission_request_consent_check input {
    margin-top: 5px;
}

.transfer_step_validation {
    margin: 12px 0 14px;
    font-size: 13px;
}

.admission_request_student_become_page {
    padding: 24px 28px 40px;
    background: #fff;
}

body.admission_request_student_become_modal_body {
    height: 100dvh;
    min-height: 100dvh;
    overflow: hidden;
    background: #fff;
}

body.admission_request_student_become_modal_body > .container-fluid,
body.admission_request_student_become_modal_body > .container-fluid > main,
body.admission_request_student_become_modal_body #student-become-app {
    height: 100%;
    min-height: 0;
}

body.admission_request_student_become_modal_body #student-become-app {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
}

.admission_request_student_become_modal_body .admission_request_student_become_shell {
    flex: 1 1 auto;
    width: 100%;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 22px 16px 32px;
    overscroll-behavior: contain;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
}

.admission_request_student_become_modal_body .admission_request_student_become_actions {
    position: relative;
    z-index: 20;
    flex: 0 0 auto;
    width: 100%;
    min-height: 64px;
    margin: 0;
    padding: 10px 16px 12px;
    border-top: 1px solid #e8edf5;
    background: #fff;

}

.admission_request_student_become_modal_body .admission_request_student_become_page {
    min-height: 0;
    height: 100%;
    box-sizing: border-box;
    padding: 22px 16px 92px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
}

.admission_request_student_become_modal_body .transfer_request_topbar,
.admission_request_student_become_modal_body .admission_request_student_become_sidebar,
.admission_request_student_become_modal_body .auth_account_mobile_topbar,
.admission_request_student_become_modal_body .floating-actions,
.admission_request_student_become_modal_body .floating-contact-modal {
    display: none !important;
}

.admission_request_student_become_modal_body .admission_request_student_become_layout {
    grid-template-columns: minmax(0, 1fr);
    height: 100%;
}

.admission_request_student_become_modal_body .admission_request_student_become_stepper {
    margin-top: 0;
}

.admission_request_student_become_shell {
    max-width: 1320px;
    margin: 0 auto;
}

.admission_request_student_become_layout {
    display: grid;
    grid-template-columns: 290px minmax(0, 1fr);
    gap: 28px;
}

.admission_request_student_become_sidebar {
    padding-top: 36px;
}

.admission_request_student_become_main {
    min-width: 0;
}

.admission_request_student_become_stepper {
    display: grid;
    grid-template-columns: auto 1fr auto 1fr auto;
    gap: 16px;
    align-items: center;
    margin: 18px 0 28px;
}

.admission_request_student_become_step {
    display: flex;
    align-items: center;
    gap: 16px;
}

.admission_request_student_become_step_badge {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border-radius: 999px;
    background: #a8b2c3;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
}

.admission_request_student_become_step.is-active .admission_request_student_become_step_badge {
    background: #10428C;
}

.admission_request_student_become_step.is-complete .admission_request_student_become_step_badge {
    background: #49c751;
}

.admission_request_student_become_step_text {
    color: #8d96a5;
    font-size: 17px;
    line-height: 1.3;
}

.admission_request_student_become_step.is-active .admission_request_student_become_step_text,
.admission_request_student_become_step.is-complete .admission_request_student_become_step_text {
    color: #10428C;
}

.admission_request_student_become_step.is-complete .admission_request_student_become_step_text {
    color: #49c751;
}

.admission_request_student_become_step_line {
    height: 1px;
    background: #c9d3e0;
}

.admission_request_student_step_panel {
    min-height: 560px;
}

.admission_request_student_become_actions {
    margin-top: 32px;
}

.admission_request_student_form_section {
    margin-bottom: 22px;
}

    .admission_request_student_form_section h3 {
        margin: 0 0 18px;
        padding: 8px 10px;
        background: #f4f7fb;
        color: #39436f;
        font-size: 17px;
        font-weight: 500;
    }

.admission_request_student_form_grid {
    display: grid;
    grid-template-columns: 1fr minmax(260px, 300px);
    gap: 18px 24px;
    align-items: center;
    min-width: 0;
}

.admission_request_student_form_grid > label {
    color: #4a5361;
    font-size: 14px;
}

.admission_request_student_inline_grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    min-width: 0;
}

.admission_request_student_inline_grid > div,
.admission_request_student_form_grid > div {
    min-width: 0;
}


.admission_request_student_form_grid .invalid-feedback {
    margin-top: 6px;
    font-size: 13px;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
    line-height: 1.35;
}

.admission_request_student_success_hero {
    position: relative;
    padding: 22px 20px 14px;
    text-align: center;
    color: #10428C;
}

.admission_request_student_confetti,
.admission_request_student_success_hero::before,
.admission_request_student_success_hero::after {
    position: absolute;
    display: block;
    width: 10px;
    height: 10px;
    clip-path: polygon(50% 0, 0 100%, 100% 100%);
    opacity: .9;
}

.admission_request_student_success_hero::before,
.admission_request_student_success_hero::after {
    content: "";
    background: #4ac75a;
}

.admission_request_student_success_hero::before {
    top: 54px;
    left: 18%;
    transform: rotate(-20deg);
}

.admission_request_student_success_hero::after {
    top: 76px;
    right: 14%;
    transform: rotate(22deg);
}

.admission_request_student_confetti.is-green {
    background: #41B853;
}

.admission_request_student_confetti.is-blue {
    background: #2F6BFF;
}

.admission_request_student_confetti.is-yellow {
    background: #F5B700;
}

.admission_request_student_confetti.is-red {
    background: #E64C5E;
}

.admission_request_student_confetti.is-one {
    top: 28px;
    left: 26%;
    transform: rotate(16deg);
}

.admission_request_student_confetti.is-two {
    top: 36px;
    right: 29%;
    transform: rotate(-24deg);
}

.admission_request_student_confetti.is-three {
    top: 88px;
    left: 24%;
    transform: rotate(42deg);
}

.admission_request_student_confetti.is-four {
    top: 106px;
    right: 23%;
    transform: rotate(-14deg);
}

.admission_request_student_confetti.is-five {
    top: 18px;
    left: 39%;
    width: 8px;
    height: 8px;
    transform: rotate(-36deg);
}

.admission_request_student_confetti.is-six {
    top: 22px;
    right: 39%;
    width: 8px;
    height: 8px;
    transform: rotate(31deg);
}

.admission_request_student_confetti.is-seven {
    top: 120px;
    left: 35%;
    width: 8px;
    height: 8px;
    transform: rotate(-8deg);
}

.admission_request_student_confetti.is-eight {
    top: 118px;
    right: 36%;
    width: 8px;
    height: 8px;
    transform: rotate(28deg);
}

.admission_request_student_success_logo {
    margin-bottom: 16px;
    font-size: 34px;
    font-weight: 700;
}

.admission_request_student_success_note {
    max-width: 980px;
    margin: 22px auto 18px;
    color: #46556f;
    font-size: 14px;
    line-height: 1.75;
    text-align: left;
}

.admission_request_student_success_note a {
    color: #10428C;
    font-weight: 600;
    text-decoration: none;
}

.admission_request_student_confirm_wrap {
    display: grid;
    justify-items: end;
    gap: 26px;
    padding-top: 12px;
    color: #1D2737;
    font-size: 16px;
    line-height: 1.6;
}

.admission_request_student_confirm_wrap p {
    width: 100%;
    margin: 0;
    text-align: left;
}

.admission_request_student_confirm_actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    width: 100%;
}

.admission_request_student_confirm_btn {
    min-width: 170px;
}

.admission_request_student_confirm_back_btn {
    min-width: 96px;
}

.admission_request_student_action_message {
    margin: 0 auto 0 0;
    align-self: center;
    font-size: 13px;
}

.admission_request_student_credential_card {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px 34px;
    max-width: 980px;
    margin: 0 auto;
    padding: 18px 22px;
    border-radius: 12px;
    background: #f4f7fb;
    color: #46556f;
    font-size: 14px;
    line-height: 1.45;
}

.admission_request_student_credential_card div {
    display: contents;
}

.admission_request_student_credential_card strong {
    color: #0b1f3f;
    font-weight: 800;
}

.admission_request_student_credential_value,
.auth_account_program_credential_value {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.admission_request_student_credential_value small,
.auth_account_program_credential_value small {
    color: #c48700;
    font-size: 13px;
    font-weight: 500;
}

@media (max-width: 991.98px) {
    .admission_request_student_become_page {
        padding: 16px 14px 28px;
    }

    .admission_request_student_become_layout {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .admission_request_student_become_stepper {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .admission_request_student_become_step_line {
        display: none;
    }

    .admission_request_student_form_grid {
        grid-template-columns: 1fr;
    }

    .admission_request_student_step_panel {
        min-height: auto;
    }

    .admission_request_student_success_hero {
        padding-left: 0;
        padding-right: 0;
    }

    .admission_request_student_confirm_wrap {
        justify-items: stretch;
        font-size: 16px;
    }
}

@media (max-width: 767.98px) {
    .admission_request_page .transfer_stepper_six,
    .transfer_request_consent_page .transfer_stepper_five,
    .transfer_request_consent_page .transfer_stepper_six {
        display: flex;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 10px;
        scroll-snap-type: x proximity;
    }

    .transfer_request_consent_page .transfer_stepper_five {
        min-width: 0;
    }

    .admission_request_student_inline_grid {
        grid-template-columns: 1fr;
    }

    .admission_request_student_success_logo {
        font-size: 24px;
    }

    .admission_request_student_confetti,
    .admission_request_student_success_hero::before,
    .admission_request_student_success_hero::after {
        width: 7px;
        height: 7px;
    }

    .admission_request_student_confetti.is-one,
    .admission_request_student_confetti.is-three,
    .admission_request_student_success_hero::before {
        left: 6%;
    }

    .admission_request_student_confetti.is-two,
    .admission_request_student_confetti.is-four,
    .admission_request_student_success_hero::after {
        right: 6%;
    }

    .admission_request_student_confetti.is-five {
        left: 22%;
    }

    .admission_request_student_confetti.is-six {
        right: 22%;
    }

    .admission_request_student_confetti.is-seven {
        left: 16%;
    }

    .admission_request_student_confetti.is-eight {
        right: 16%;
    }

    .admission_request_student_become_step {
        justify-content: flex-start;
    }

    .admission_request_student_become_step_text {
        font-size: 15px;
    }

    .admission_request_student_credential_card {
        padding: 16px;
    }
}

/* ================================
   Auth Page
   ================================ */
[v-cloak] {
    display: none;
}

.auth_modal_open {
    overflow: hidden;
}

.auth_shell {
    position: fixed;
    inset: 0;
    z-index: 1085;
    pointer-events: none;
}

.auth_backdrop,
.auth_account_modal_backdrop {
    position: absolute;
    inset: 0;
    background: rgba(17, 24, 39, 0.38);
    backdrop-filter: blur(2px);
    pointer-events: auto;
}

.auth_modal_wrap,
.auth_account_modal_overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    pointer-events: none;
}

.auth_modal_card,
.auth_account_modal_window {
    width: min(100%, 442px);
    padding: 24px 38px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 24px 40px rgba(15, 23, 42, 0.18);
    pointer-events: auto;
}

.auth_title {
    margin: 0 0 28px;
    color: #10428C;
    font-size: 20px;
    font-weight: 600;
    text-align: center;
}

.auth_title_left {
    margin-bottom: 0;
    text-align: left;
}

.auth_login_brand {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 12px;
    margin-bottom: 45px;
    transform: translateY(6px);
}

.auth_login_brand_symbol {
    width: 48px;
    flex: 0 0 48px;
    height: auto;
}

.auth_login_brand_text {
    display: flex;
    min-width: 0;
    flex-direction: column;
    color: #10428c;
    line-height: 1.1;
    transform: translateY(2px);
}

.auth_login_brand_university {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .1px;
}

.auth_login_brand_system {
    font-size: 12px;
    font-weight: 500;
}

.auth_modal_head {
    display: grid;
    gap: 16px;
    margin-bottom: 20px;
}

.auth_modal_card .auth_modal_head {
    width: calc(100% + 76px);
    margin-right: -38px;
    margin-left: -38px;
    padding: 0 38px 24px;
    border-bottom: 1px solid #e1e5eb;
}

.auth_recovery_tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    width: 100%;
    min-width: 0;
    margin-bottom: 18px;
    padding: 4px;
    overflow: hidden;
    border: 1px solid #d5ddea;
    border-radius: 10px;
    background: #f3f6fa;
    box-shadow: 0 1px 2px rgba(29, 48, 76, .06);
}

.auth_recovery_tab {
    min-height: 36px;
    padding: 0 18px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: #69788d;
    font-size: 14px;
    font-weight: 500;
    white-space: nowrap;
    transition: background .18s ease, color .18s ease;
}

.auth_recovery_tab:not(.is-active):hover {
    background: #e3e9f1;
    color: #385f8e;
}

.auth_recovery_tab:focus-visible {
    outline: 3px solid rgba(40, 94, 178, .2);
    outline-offset: 1px;
}

.auth_recovery_tab.is-active {
    background: #fff;
    color: #2859a0;
    font-weight: 600;
    box-shadow: 0 1px 4px rgba(29, 48, 76, .14);
}

.auth_label {
    display: block;
    margin-bottom: 8px;
    color: #10428C;
    font-size: 14px;
    font-weight: 500;
}

.auth_input,
.auth_inline_group,
.auth_register_grid {
    margin-bottom: 14px;
}

.auth_input_no_margin {
    margin-bottom: 0;
}

.auth_input input,
.auth_inline_input,
.auth_register_grid input,
.auth_register_grid select,
.auth_account_input {
    width: 100%;
    box-sizing: border-box;
    min-height: 44px;
    padding: 0 14px;
    border: 1px solid #d9dfeb;
    border-radius: 10px;
    color: #2a3340;
    font-size: 14px;
    outline: 0;
    background: #fff;
    box-shadow: none;
}

/* Select үндсэн загвар */
.auth_account_input,
.admission_request_student_form select {
    width: 100%;
    min-height: 44px;
    padding: 0 42px 0 14px;
    border: 1px solid #d9e2f0;
    border-radius: 10px;
    background-color: #fff;
    color: #24324a;
    font-size: 14px;
    font-family: inherit;
    line-height: 1.4;
    outline: none;
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}

    /* Hover */
    .admission_request_student_form select:hover {
        border-color: #aebed8;
        background-color: #fbfcff;
    }

    /* Focus */
    .admission_request_student_form select:focus {
        border-color: #5b7fff;
        box-shadow: 0 0 0 3px rgba(91, 127, 255, 0.12);
        background-color: #fff;
    }

    /* Disabled */
    .admission_request_student_form select:disabled {
        background-color: #f5f7fa;
        color: #98a2b3;
        cursor: not-allowed;
        opacity: 1;
    }

/* Select-ийн arrow-ийг арай цэвэрхэн болгох */
.admission_request_student_form select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2356677f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 16px;
}

    /* option */
    .admission_request_student_form select option {
        background: #fff;
        color: #24324a;
        font-size: 14px;
        padding: 8px;
    }

    /* Сонгох placeholder маягийн option */
    .admission_request_student_form select:invalid {
        color: #7e8ba3;
    }

.auth_input .form-control.is-valid,
.auth_input .form-control.is-invalid,
.auth_register_grid .form-control.is-valid,
.auth_register_grid .form-control.is-invalid {
    background-position: right 12px center;
    background-size: 16px 16px;
}

.auth_input_password .form-control.is-valid,
.auth_input_password .form-control.is-invalid {
    background-image: none;
}

.auth_profile_validation_form .form-control.is-invalid {
    border-color: #dc3545;
    padding-right: 14px;
    background-image: none;
}

.auth_profile_validation_form .form-control.is-invalid:focus {
    border-color: #dc3545;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, .1);
}

.auth_profile_validation_form .invalid-feedback {
    margin-top: 6px;
    color: #dc3545;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.35;
    text-align: left;
}

.auth_profile_validation_form .auth_change_phone_feedback {
    margin-top: -8px;
    margin-bottom: 8px;
}

.auth_profile_validation_form .auth_register_grid.is-invalid .auth_letter_trigger,
.auth_profile_validation_form .auth_register_grid.is-invalid .form-control {
    border-color: #dc3545;
    background-image: none;
}

.auth_profile_validation_form .auth_register_grid.is-invalid .invalid-feedback {
    display: block;
}

.auth_account_input[type="date"]::-webkit-calendar-picker-indicator {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.auth_register_grid .invalid-feedback {
    grid-column: 1 / -1;
    margin-top: -2px;
}

.auth_account_input.is-invalid {
    border-color: #dc3545;
    padding-right: 38px;
}

.auth_account_input:disabled {
    background: #eef2f6;
    color: #666f7a;
}

.auth_input_icon {
    position: relative;
}

.auth_input_icon input {
    padding-left: 40px;
}

.auth_input_icon > i {
    position: absolute;
    top: 22px;
    left: 14px;
    transform: translateY(-50%);
    color: #9aa4b2;
    z-index: 2;
    pointer-events: none;
}

.auth_input_password input {
    padding-right: 44px;
}

.auth_input_password {
    position: relative;
}

.auth_password_field.is-hidden {
    -webkit-text-security: disc;
    text-security: disc;
}

.auth_password_field::-ms-reveal,
.auth_password_field::-ms-clear {
    display: none;
}

.auth_eye_btn {
    position: absolute;
    top: 22px;
    right: 12px;
    transform: translateY(-50%);
    border: 0;
    background: transparent;
    color: #9aa4b2;
    z-index: 2;
}

.auth_eye_btn i,
.auth_eye_closed_icon {
    display: block;
    width: 18px;
    height: 18px;
    font-size: 18px;
    line-height: 1;
}

.auth_eye_closed_icon {
    opacity: .42;
}

.auth_link_stack {
    display: grid;
    justify-items: end;
    gap: 3px;
    margin-bottom: 24px;
}

.auth_link_stack .auth_text_link {
    padding: 2px 0;
    transition: color .15s ease;
}

.auth_text_link,
.auth_back_link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 0;
    background: transparent;
    color: #10428C;
    font-size: 14px;
    text-decoration: none;
}

.auth_step_back_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 35px;
    justify-self: start;
    padding: 0 20px;
    border: 1px solid #a4adba;
    border-radius: 25px;
    background: #fff;
    color: #8a94a3;
    font-size: 14px;
    font-weight: 400;
    transition: background .15s ease;
}

.auth_step_back_btn i,
.auth_step_back_btn span {
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

.auth_step_back_btn .bi::before {
    vertical-align: 0;
}

.auth_step_back_btn:hover,
.auth_step_back_btn:focus-visible {
    background: #f7f8fa;
    color: #6f7885;
}

.auth_form_actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 36px;
}

.auth_form_actions .auth_step_back_btn,
.auth_form_actions .auth_primary_btn {
    width: 100%;
    margin-top: 0;
    justify-self: stretch;
}

.auth_primary_btn,
.auth_secondary_btn,
.auth_account_action_btn,
.auth_account_primary_pill {
    width: 100%;
    min-height: 41px;
    border: 0;
    margin-top: 19px;
    border-radius: 25px;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
}

.auth_primary_btn,
.auth_account_action_btn,
.auth_account_primary_pill {
    background: #10428C;
}

.auth_modal_card .auth_primary_btn,
.auth_modal_card .auth_secondary_btn,
.auth_modal_card .auth_step_back_btn {
    border-radius: 8px;
}

.auth_secondary_btn {
    margin-top: 20px;
    border: 1px solid #10428c;
    background: #fff;
    color: #10428c;
}

.auth_secondary_btn:hover,
.auth_secondary_btn:focus-visible {
    border-color: #0a3474;
    background: #f1f6fd;
    color: #0a3474;
}

.auth_login_support_links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: 10px;
    width: 100%;
    margin-top: 19px;
    color: #a4adba;
    white-space: nowrap;
}

.auth_login_support_links .auth_text_link {
    padding: 2px 0;
}

.auth_login_support_links .auth_text_link:first-child {
    justify-self: start;
}

.auth_login_support_links .auth_text_link:last-child {
    justify-self: end;
}

.auth_account_action_btn,
.auth_account_primary_pill {
    width: auto;
    min-width: 118px;
    padding: 0 24px;
}

.auth_account_action_btn.is-light {
    background: #BEC3C7;
    color: #fff;
}

.auth_account_action_btn.is-muted {
    background: #d5dbe5;
    color: #fff;
}

.auth_account_action_btn:not(.is-light):disabled,
.auth_primary_btn:disabled,
.auth_account_primary_pill:disabled {
    background: #10428C;
    color: #fff;
    cursor: not-allowed;
    opacity: .45;
}

.auth_account_action_btn.is-light:disabled {
    background: #edf2f8;
    color: #fff;
    cursor: not-allowed;
    opacity: .75;
}

.auth_inline_group {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
}

.auth_inline_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-width: 96px;
    min-height: 36px;
    align-self: center;
    border: 1px solid #10428C;
    border-radius: 8px;
    background: #f7faff;
    color: #10428C;
    font-size: 13px;
    font-weight: 500;
    transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}

.auth_inline_btn:hover,
.auth_inline_btn:focus-visible {
    background: #10428C;
    color: #fff;
    box-shadow: 0 4px 12px rgba(16, 66, 140, .18);
}

.auth_inline_btn:disabled {
    opacity: .6;
    box-shadow: none;
}

.auth_code_status {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 34px;
    margin: 2px 0 14px;
}

.auth_code_timer {
    color: #0b67a3;
    font-size: 18px;
    font-weight: 700;
}

.auth_resend_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 34px;
    border: 0;
    background: #fff;
    color: #0b67a3;
    font-size: 15px;
    font-weight: 700;
}

.auth_resend_btn:disabled {
    opacity: .65;
}

.auth_register_grid {
    display: grid;
    grid-template-columns: 64px 64px minmax(0, 1fr);
    gap: 8px;
}

.auth_letter_trigger {
    min-height: 44px;
    border: 1px solid #d9dfeb;
    border-radius: 10px;
    background: #fff;
    color: #2a3340;
    font-size: 18px;
}

.auth_picker_modal {
    width: min(100%, 620px);
    padding: 26px 34px 34px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 24px 40px rgba(15, 23, 42, 0.18);
    pointer-events: auto;
}

.auth_letter_preview {
    display: flex;
    gap: 12px;
    margin-bottom: 22px;
}

.auth_letter_preview_box {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border: 1px solid #d9dfeb;
    border-radius: 14px;
    color: #2a3340;
    font-size: 24px;
}

.auth_letter_preview_box.is-active {
    border-color: #10428C;
    box-shadow: 0 0 0 2px rgba(16, 66, 140, 0.08);
}

.auth_letter_grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 12px;
}

.auth_letter_btn {
    min-height: 56px;
    border: 1px solid #d9dfeb;
    border-radius: 14px;
    background: #fff;
    color: #3a4452;
    font-size: 28px;
    line-height: 1;
    font-style: italic;
}

.auth_feedback {
    margin: 16px 0 0;
    font-size: 13px;
    text-align: center;
}

.auth_login_feedback {
    margin: 0;
}

.auth_login_feedback + .auth_primary_btn {
    margin-top: 10px;
}

.auth_feedback.is-error {
    color: #c0392b;
}

.auth_reset_form .auth_feedback.is-error,
.auth_account_password_form .auth_feedback.is-error {
    color: #f0b400;
}

.auth_feedback.is-success {
    color: #22863a;
}

.auth_modal_card .auth_back_link,
.auth_modal_card .auth_title,
.auth_modal_card .auth_label,
.auth_modal_card .auth_code_timer {
    color: #111827;
}

.auth_modal_card .auth_text_link {
    color: #00A2FF;
}

.auth_modal_card .auth_link_stack .auth_text_link:hover,
.auth_modal_card .auth_link_stack .auth_text_link:focus-visible {
    color: #10428C;
}

.auth_modal_message {
    margin: 22px 0 30px;
    padding: 0 14px;
    font-size: 13px;
    line-height: 1.65;
}

.auth_modal_message span {
    display: block;
}

.auth_modal_message.is-error {
    color: #ff0000;
}

.auth_modal_message.is-success {
    color: #48b02c;
}

.auth_modal_notice {
    display: grid;
    gap: 4px;
    margin: 22px 0 34px;
    padding: 0 14px;
    color: #344052;
}

.auth_modal_actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 86px;
    margin-top: 60px;
}

.auth_unconfirmed_header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
}

.auth_unconfirmed_icon {
    display: inline-flex;
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    align-items: center;
    justify-content: center;
    border-radius: 13px;
    background: #eef4ff;
    color: #10428c;
    font-size: 21px;
}

.auth_unconfirmed_eyebrow {
    margin: 0 0 3px;
    color: #64748b;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.auth_unconfirmed_title {
    margin: 0;
    color: #111827;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.35;
}

.auth_unconfirmed_rule {
    height: 1px;
    margin: 0 -38px 20px;
    background: #e6ebf2;
}

.auth_unconfirmed_prompt {
    margin: 0 0 18px;
    color: #111827;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.35;
}

.auth_unconfirmed_message {
    color: #344052;
    font-size: 13px;
    line-height: 1.65;
}

.auth_unconfirmed_message > p {
    margin: 0;
}

.auth_unconfirmed_hint {
    display: flex;
    gap: 9px;
    margin-top: 16px !important;
    padding: 12px 14px;
    border-radius: 10px;
    background: #f6f8fb;
    color: #526078;
}

.auth_unconfirmed_hint i {
    flex: 0 0 auto;
    margin-top: 2px;
    color: #10428c;
}

.auth_unconfirmed_actions {
    margin-top: 24px;
}

.auth_forgot_code_label {
    margin-top: 10px;
}

.auth_forgot_feedback {
    margin-top: 12px;
    text-align: left;
}

.auth_status_page {
    min-height: 100vh;
    background: #fff;
}

.auth_status_wrap {
    min-height: calc(100vh - 72px);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 36px 24px;
}

.auth_status_card {
    width: min(100%, 640px);
    min-height: 0;
    padding: 34px 38px;
    background: #fff;
    border: 0;
    border-radius: 16px;
    box-shadow: 0 12px 34px rgba(16, 42, 87, 0.07);
}

.auth_status_card h1,
.auth_status_title {
    margin: 0 0 16px;
    color: #10428C;
    font-size: clamp(19px, 2vw, 24px);
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: .01em;
    text-transform: uppercase;
}

.auth_status_rule {
    height: 1px;
    background: #e0e0e0;
}

.auth_status_rule.is-accent {
    width: 48px;
    height: 5px;
    border-radius: 2px;
    background: #10428C;
}

.auth_status_block {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin: 28px 0 34px;
}

.auth_status_icon {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    flex-shrink: 0;
    border: 2px solid currentColor;
    border-radius: 50%;
    font-size: 16px;
    line-height: 1;
}

.auth_status_icon.is-success {
    color: #2fa84f;
}

.auth_status_icon.is-error {
    color: #d92d20;
}

.auth_status_text {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.auth_status_headline {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
}

.auth_status_headline.is-success {
    color: #2fa84f;
}

.auth_status_headline.is-error {
    color: #d92d20;
}

.auth_status_detail {
    margin: 0;
    color: #3d4a5c;
    font-size: 15px;
    line-height: 1.55;
}

.auth_status_message {
    margin: 24px 0 42px;
    font-size: 15px;
    line-height: 1.6;
}

.auth_status_message.is-error {
    color: #ff0000;
}

.auth_status_message.is-success {
    color: #48b02c;
}

.auth_status_actions {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 14px;
    padding: 0;
}

.auth_status_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 150px;
    min-height: 46px;
    padding: 0 24px;
    border: 0;
    background: #10428C;
    color: #fff;
    border-radius: 10px;
    box-shadow: none;
    font-family: inherit;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}

.auth_status_btn:hover {
    color: #fff;
}

.auth_modal_card .auth_status_title {
    font-size: 19px;
}

.auth_modal_card .auth_status_block {
    margin: 24px 0 28px;
}

.system_response_modal_window {
    width: min(100%, 700px) !important;
    max-width: 408px !important;
    padding: 41px !important;
    border-radius: 14px !important;
}

.system_response_modal {
    display: grid;
    justify-items: center;
    width: 100%;
    padding: 0;
    text-align: center;
}

.system_response_icon {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    margin-bottom: 10px;
    border-radius: 50%;
    background: #f1f5f9;
    color: #10428C;
    font-size: 25px;
}

.system_response_modal.is-error .system_response_icon {
    background: #fff1f2;
    color: #dc3545;
}

.system_response_modal h2,
.system_response_modal h3 {
    margin: 0 0 7px;
    color: #2f3742;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.35;
}

.system_response_modal p {
    width: 100%;
    margin: 0 0 36px;
    color: #2f3742;
    font-size: 14px;
    line-height: 1.5;
    text-align: left;
}

.auth_reset_card.system_response_modal_window .system_response_modal p {
    width: 100%;
    text-align: left;
}

.system_response_button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 35px;
    border: 0;
    border-radius: 7px;
    background: #c8cdd1;
    color: #fff;
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
}

.system_response_button:hover {
    color: #fff;
}

.system_response_actions {
    display: grid;
    gap: 8px;
    width: 100%;
}

.confirm_email_status_button {
    min-height: 42px;
    border-radius: 8px;
}

.system_response_actions.is-paired {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.confirm_email_status_button.is-primary {
    background: #244d9b;
    color: #fff;
    font-weight: 700;
}

.confirm_email_status_button.is-secondary {
    border: 1px solid #aeb8c8;
    background: #fff;
    color: #9ca6b7;
}

.confirm_email_status_button.is-secondary:hover {
    background: #f7f8fa;
    color: #7f8999;
}

@media (max-width: 640px) {
    .auth_status_card {
        padding: 24px 20px;
    }

    .auth_status_block {
        gap: 12px;
        margin: 22px 0 26px;
    }

    .auth_status_actions {
        flex-direction: column-reverse;
    }

    .auth_status_btn {
        width: 100%;
    }
}

.auth_reset_card {
    width: min(100%, 640px);
    min-height: 0;
    padding: 34px 38px;
    background: #fff;
    border: 1px solid #e3e8f1;
    border-radius: 16px;
    box-shadow: none;
}

.auth_reset_card h1 {
    width: min(100%, 420px);
    margin: 0 auto 18px;
    color: #213456;
    font-size: 20px;
    font-weight: 400;
    text-align: left;
}

.auth_reset_intro {
    margin: 0 0 18px;
    color: #6b7280;
    font-size: 14px;
}

.auth_reset_form {
    display: grid;
    gap: 12px;
    width: min(100%, 420px);
    margin: 28px auto 0;
}

.auth_reset_card > .auth_status_rule {
    width: calc(100% + 76px);
    margin-right: -38px;
    margin-left: -38px;
}

.auth_reset_form .auth_label {
    margin: 0;
    color: #10428C;
    font-size: 14px;
    font-weight: 400;
}

.auth_reset_form .auth_account_input {
    min-height: 44px;
    padding: 0 14px;
    border: 1px solid #d9dfeb;
    border-radius: 10px;
    color: #293346;
    font-size: 14px;
}

.auth_reset_hint,
.auth_account_password_hint {
    margin: 4px 0 0;
    color: #f5b800;
    font-size: 13px;
    line-height: 1.35;
}

.auth_reset_hint {
    margin-bottom: 18px;
} 

.auth_reset_form .auth_reset_confirm_field {
    margin-bottom: 0;
}

.auth_register_form .auth_reset_hint {
    margin: -6px 0 14px;
}

.auth_reset_form .auth_feedback {
    margin-top: 0;
}

.auth_reset_form .auth_feedback:empty {
    display: none;
}

.auth_reset_submit {
    justify-self: end;
    margin-top: 0;
    min-width: 110px;
    min-height: 38px;
    padding: 0 18px;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 400;
}

.auth_account_shell {
    min-height: 100vh;
    background: #fff;
}

.auth_account_page {
    min-height: calc(100vh - 72px);
    padding: 26px 24px 36px;
    background: #fff;
}

.auth_account_page.is-nondegree-section {
    background: #fff;
}

.auth_account_page.is-nondegree-section .auth_account_main_column,
.auth_account_page.is-nondegree-section .auth_account_nondegree_section,
.auth_account_page.is-nondegree-section .auth_account_nondegree_panel,
.auth_account_page.is-nondegree-section .auth_account_week_grid {
    background: #fff;
}

.auth_account_mobile_topbar {
    display: none;
}

.auth_account_content_layout {
    display: grid;
    grid-template-columns: 284px minmax(0, 1fr);
    gap: 28px;
    align-items: stretch;
}

.auth_account_sidebar {
    position: sticky;
    isolation: isolate;
    overflow: hidden;
    top: 0;
    align-self: stretch;
    min-height: calc(100vh - 72px);
    margin: -26px 0 -36px -24px;
    border-right: 1px solid #d6deea;
    padding: 26px 20px 36px 24px;
    background: #fff;
}

.auth_account_sidebar::before,
.auth_account_sidebar_offcanvas .offcanvas-body::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background-color: #63758f;
    -webkit-mask-image: url("../img/profile-khee.svg");
    mask-image: url("../img/profile-khee.svg");
    -webkit-mask-repeat: repeat;
    mask-repeat: repeat;
    -webkit-mask-size: 80px auto;
    mask-size: 80px auto;
    opacity: 0.03;
    pointer-events: none;
}

.auth_account_sidebar .auth_account_menu {
    position: relative;
    z-index: 1;
}

.auth_account_sidebar_offcanvas .offcanvas-body {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

.auth_account_sidebar_offcanvas .auth_account_menu {
    position: relative;
    z-index: 1;
}

.auth_account_menu {
    display: grid;
    gap: 10px;
}

.auth_account_menu_item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 48px;
    padding: 0 14px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #475467;
    font-size: 14px;
    text-decoration: none;
    text-align: left;
}

.auth_account_menu_item.is-active {
    background: #fff;
    color: #10428C;
    font-weight: 700;
    box-shadow: inset -2px 0 0 #10428C;
}

.auth_account_menu_item.is-child {
    min-height: 42px;
    margin-left: 20px;
    padding-left: 20px;
    border-left: 1px solid #e3e8ef;
    background: #fff;
    color: #4b5565;
    font-size: 14px;
    box-shadow: none;
}

.auth_account_menu_item.is-child.is-active {
    color: #10428C;
    background: #fff;
    box-shadow: none;
}

.auth_account_menu {
    gap: 16px;
}

.auth_account_menu_group {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.auth_account_menu_group + .auth_account_menu_group {
    padding-top: 16px;
    border-top: 1px solid #e4eaf2;
}

.auth_account_menu_group_title {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 0 10px 9px;
    border-bottom: 0;
    color: #10428C;
    font-size: 14px;
    font-weight: 600;
}

.auth_account_menu_group_title i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    color: #10428C;
    font-size: 15px;
    text-align: center;
}

.auth_account_menu_group_items {
    display: grid;
    gap: 3px;
    padding-top: 0;
}

.auth_account_menu_group .auth_account_menu_item {
    min-height: 40px;
    padding: 0 10px;
    border-radius: 7px;
    font-size: 14px;
}

.auth_account_menu_group .auth_account_menu_item i {
    width: 18px;
    color: #718096;
    font-size: 14px;
    text-align: center;
}

.auth_account_menu_group .auth_account_menu_item:hover {
    background: #f5f8fc;
    color: #10428C;
}

.auth_account_menu_group .auth_account_menu_item.is-active {
    background: #edf4ff;
    color: #10428C;
    font-weight: 600;
    box-shadow: inset 3px 0 0 #10428C;
}

.auth_account_menu_group .auth_account_menu_item.is-active i {
    color: #10428C;
}

.auth_account_main_column,
.auth_account_card,
.auth_account_card_main {
    min-width: 0;
}

.auth_account_section_shell {
    display: grid;
    gap: 20px;
}

.auth_account_section_grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 28px;
    align-items: start;
}




.auth_account_table_card {
    padding: 20px 32px 28px;
}

.auth_account_table_card .auth_account_section_header {
    margin-bottom: 10px;
}



.auth_account_personal_card {
    overflow: hidden;
    border-color: #dfe7f3;
    border-radius: 18px;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.02);
}

.auth_account_personal_info_card {
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.auth_account_employment_card .auth_account_detail_actions {
    margin-top: 20px;
}

.auth_account_employment_card {
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.auth_account_balance_card {
    padding: 28px;
}

.auth_account_section_header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;

}

.auth_account_personal_header {
    align-items: center;

    border-bottom: 0;
}

.auth_account_personal_title,
.auth_account_balance_head {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    padding-bottom: 12px; 
}

.auth_account_section_icon,
.auth_account_field_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.auth_account_section_icon {
    width: 78px;
    height: 78px;
    border-radius: 50%;
    background: #eef5ff;
    color: #126bff;
    font-size: 38px;
}

.auth_account_section_icon_small {
    width: 42px;
    height: 42px;
    border-radius: 50%;  
    font-size: 20px;
}

.auth_account_section_header h2,
.auth_account_balance_card h3,
.auth_account_modal_header h3 {
    margin: 0;
    color: #213456;
    font-size: 18px;
    font-weight: 500;
}

.auth_account_section_subtitle {
    margin: 8px 0 0;
    color: #6b7280;
    font-size: 14px;
}

.auth_account_personal_header h2 {
    color: #111b36;
    font-size: 18px;
}

.auth_account_personal_header .auth_account_section_subtitle {
    margin-top: 14px;
    color: #7b879c;
    font-size: 16px;
}

.auth_account_password_card {
    max-width: 620px;
}

.auth_account_password_form {
    display: grid;
    gap: 12px;
    max-width: 420px;
}

.auth_account_password_input {
    position: relative;
}

.auth_account_password_input .auth_account_input {
    padding-right: 44px;
}

.auth_account_password_toggle {
    position: absolute;
    right: 12px;
    top: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #98a2b3;
    transform: translateY(-50%);
}

.auth_account_password_toggle i {
    font-size: 16px;
    line-height: 1;
}

.auth_account_password_submit {
    justify-self: start;
    margin-top: 8px;
}

.auth_account_section_actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.auth_account_personal_grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.auth_account_field_row {
    display: grid;
    gap: 12px;
}

.auth_account_field_label {
    color: #848c98;
    font-size: 14px;
    font-weight: 400;
}

.auth_account_field_value {
    color: #1f2733;
    font-size: 17px;
    font-style: italic;
    line-height: 1.45;
}

.auth_account_field_value_strong {
    font-style: normal;
    font-weight: 500;
}

.auth_account_field_value.is-empty {
    color: #98A2B3;
    font-size: 14px;
    font-weight: 400;
}

.auth_account_detail_grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.auth_account_field_panel {
    overflow: hidden;
    border: 1px solid #e2e8f2;
    border-radius: 12px;
    background: #fff;
}

.auth_account_detail_grid .auth_account_field_row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(150px, auto);
    align-items: center;
    gap: 18px;
    min-height: 74px;
    padding: 16px 24px 16px 18px;
    border: 0;
    border-radius: 0;
    background: #fff;
}

.auth_account_field_panel .auth_account_field_row + .auth_account_field_row {
    border-top: 1px solid #e2e8f2;
}

.auth_account_detail_grid .auth_account_field_row:hover {
    box-shadow: none;
    transform: none;
}

.auth_account_field_label_wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.auth_account_field_icon {
    width: 42px;
    height: 42px;
    border-radius: 9px;
    background: #eef5ff;
    color: #126bff;
    font-size: 19px;
}

.auth_account_detail_grid .auth_account_field_label {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    color: #4f5d75;
    font-size: 14px;
    font-weight: 400;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.auth_account_detail_grid .auth_account_field_value,
.auth_account_detail_grid .auth_account_field_value_strong {
    overflow-wrap: anywhere;
    color: #111b36;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    text-align: right;
}

.auth_account_detail_grid .auth_account_field_value.is-empty {
    color: #98A2B3;
    font-size: 14px;
    font-weight: 400;
}

.auth_account_detail_grid .auth_account_input_wrap {
    max-width: none;
}

/* Same invalid treatment as .civil_profile_input.is-invalid: red border always,
   the soft red ring only while the field has focus. */
.auth_account_detail_grid .auth_account_input.is-invalid {
    border-color: #dc3545;
}

.auth_account_detail_grid .auth_account_input.is-invalid:focus {
    box-shadow: 0 0 0 3px rgba(220, 53, 69, .1);
}

.auth_account_field_error {
    margin: 6px 0 0;
    color: #dc3545;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.35;
    text-align: left;
}

.auth_account_detail_actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 0;
}

.auth_account_detail_actions .auth_account_section_actions {
    justify-content: center;
}

.auth_account_detail_actions .auth_account_action_btn {
    min-width: 115px;
    min-height: 37px;
    border-radius: 8px;
    font-size: 14px;
}

.auth_account_detail_actions .auth_account_action_btn.is-edit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 98px;
    min-height: 35px;
    border-radius: 8px;
    background: #f5b800;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
}

.auth_account_detail_actions .auth_account_action_btn.is-edit:hover {
    background: #e6aa00;
}

.auth_account_personal_footer {
    display: flex;
    justify-content: flex-end;
    margin: 22px 0 0;
    padding: 0;
    border-top: 0;
    background: #fff;
}

.auth_account_recharge_panel {
    display: grid;
    gap: 10px;
    width: calc((100% - 18px) / 2);
    margin-bottom: 4px;
    padding: 0;
    background: transparent;
}

.auth_account_recharge_summary {
    display: grid;
    grid-template-columns: auto minmax(120px, 1fr) auto auto;
    align-items: center;
    gap: 12px;
    min-height: 74px;
    padding: 16px 18px;
    border: 1px solid #e2e8f2;
    border-radius: 12px;
    background: #fff;
}

.auth_account_recharge_icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 9px;
    background: #eef5ff;
    color: #126bff;
    font-size: 19px;
}

.auth_account_recharge_balance {
    display: grid;
    justify-self: start;
    gap: 7px;
    min-width: 0;
    color: #1f2d4d;
}

.auth_account_recharge_balance span {
    color: #233354;
    font-size: 14px;
    font-weight: 500;
}

.auth_account_recharge_balance strong {
    color: #1d5be3;
    font-size: 22px;
    line-height: 1;
    white-space: nowrap;
}

.auth_account_recharge_primary,
.auth_account_recharge_guide {
    display: inline-flex;
    align-items: center;
    border: 0;
    background: transparent;
    text-align: left;
}

.auth_account_recharge_primary {
    justify-content: center;
    gap: 10px;
    min-width: 128px;
    min-height: 38px;
    padding: 0 14px;
    border-radius: 8px;
    background: #1d5be3;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
}

.auth_account_recharge_primary:hover {
    background: #164ccb;
}

.auth_account_recharge_divider {
    width: 1px;
    height: 54px;
    background: #ccd8ef;
}

.auth_account_recharge_guide {
    justify-content: center;
    justify-self: stretch;
    gap: 8px;
    min-height: 38px;
    padding: 0 10px;
    border: 1px solid #d8e4ff;
    border-radius: 8px;
    color: #1d5be3;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.25;
    white-space: nowrap;
}

.auth_account_recharge_guide i {
    font-size: 18px;
}

.auth_account_input_wrap {
    max-width: 390px;
}

.auth_account_balance_card strong {
    display: block;
    margin-top: 22px;
    color: #10428C;
    font-size: 30px;
    font-weight: 700;
    line-height: 1.15;
    white-space: nowrap;
}

.auth_account_profile_balance_card {
    position: sticky;
    top: 22px;
    overflow: hidden;
    border-color: #dfe7f3;
    box-shadow: 0 18px 42px rgba(21, 35, 63, 0.07);
}

.auth_account_profile_balance_card::after {
    content: "";
    position: absolute;
    right: -48px;
    top: -48px;
    width: 136px;
    height: 136px;
    border-radius: 50%;
    background: rgba(16, 66, 140, 0.07);
    pointer-events: none;
}

.auth_account_balance_charge_btn {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.auth_account_balance_actions {
    display: grid;
    gap: 12px;
    margin-top: 24px;
}

.auth_account_balance_charge_btn i,
.auth_account_link_btn i {
    font-size: 16px;
}

.auth_account_link_btn,
.auth_account_inline_link,
.auth_account_link_icon_btn,
.auth_account_inline_action {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 0;
    background: transparent;
    color: #10428C;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    padding: 0;
}

.auth_account_link_btn {
    margin-top: 18px;
}

.auth_account_inline_action.is-underlined span {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.auth_account_table .auth_account_inline_link {
    text-decoration: underline;
    text-underline-offset: 2px;
}

.auth_account_table_scroll {
    overflow-x: auto;
}

.auth_account_table {
    width: 100%;
    min-width: 860px;
    border-collapse: collapse;
}

.auth_account_table th,
.auth_account_table td {
    padding: 8px 12px;
    border: 1px solid #dce3ee;
    vertical-align: top;
    color: #4a5260;
    font-size: 14px;
}

.auth_account_table th {
    color: #222f45;
    font-weight: 700;
    background: #fff;
    text-align: center;
    vertical-align: middle;
}

.auth_account_table td {
    text-align: center;
    vertical-align: middle;
}

.auth_account_table td.auth_account_table_cell_center {
    text-align: center;
    vertical-align: middle;
}

.auth_account_table_education .auth_account_education_text_cell {
    text-align: left;
    padding-left: 18px;
}

.auth_account_registration_history_table tbody td {
    text-align: left;
}

.auth_account_registration_history_table tbody td:first-child {
    text-align: center;
}

.auth_account_registration_info_table tbody td {
    text-align: left;
}

.auth_account_registration_info_table tbody td:first-child {
    text-align: center;
}

.auth_account_registration_info_table .auth_account_program_card_grid {
    justify-items: stretch;
}

.auth_account_documents_table {
    min-width: 820px;
    table-layout: fixed;
}

.auth_account_documents_col_number {
    width: 44px;
}

.auth_account_documents_col_type {
    width: calc((100% - 44px) * .32);
}

.auth_account_documents_col_file {
    width: calc((100% - 44px) * .14);
}

.auth_account_documents_col_usage {
    width: calc((100% - 44px) * .54);
}

.auth_account_documents_table .auth_account_document_number_cell {
    width: 44px;
    min-width: 44px;
    max-width: 44px;
    padding-left: 6px;
    padding-right: 6px;
    white-space: nowrap;
}

.auth_account_documents_table .auth_account_document_type_cell {
    text-align: left;

}

.auth_account_empty_state {
    display: grid;
    place-items: center;
    gap: 10px;
    

    color: #98a2b3;
    font-size: 14px;
    font-weight: 400;
    text-align: center;
}

.auth_account_table_empty_state {

    margin-top: 10px;
    padding: 18px 16px 10px;
    border: 0;
    background: transparent;
    align-content: start;
    justify-items: center;
}

.auth_account_empty_state img {
    display: block;
    width: 48px;
    height: auto;
    object-fit: contain;
    opacity: .95;
}

.auth_account_nondegree_card_row > .auth_account_empty_state,
.auth_account_admission_link_stack > .auth_account_empty_state,
.auth_account_schedule_picker > .auth_account_empty_state {
    width: 100%;
}

.auth_account_usage_stack {
    display: grid;
    gap: 10px;
}

.auth_account_usage_row {
    display: grid;
    gap: 4px;
    justify-items: start;
    color: #111b36;
    font-size: 14px;
    font-weight: 400;
    text-align: left;
}

.auth_account_usage_row span,
.auth_account_usage_row strong {
    font-size: 14px;
}

.auth_account_usage_row span {
    color: #7b8796;
}

.auth_account_usage_row strong {
    color: #111b36;
    font-weight: 500;
}

.auth_account_row_actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.auth_account_icon_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border: 0;
    border-radius: 5px;
    background: #f5b800;
    color: #fff;
    font-size: 12px;
    line-height: 1;
}

.auth_account_icon_btn + .auth_account_icon_btn {
    background: #dc3545;
}

.auth_account_icon_btn i {
    font-size: 12px;
    line-height: 1;
}

.auth_account_program_card_grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(240px, 1fr));
    gap: 16px;
}

.auth_account_program_card {
    padding: 14px 18px;
    border: 1px solid #dfe5ef;
    border-radius: 14px;
    background: #fff;
    text-align: left;
}

.auth_account_program_card_head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 8px;
}

.auth_account_program_card h4 {
    margin: 0;
    color: #10428C;
    font-size: 15px;
    font-weight: 700;
}

.auth_account_status_pill {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    min-height: 18px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: #475467;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    white-space: normal;
}

.auth_account_status_pill::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex: 0 0 auto;
    background: currentColor;
}

.auth_account_status_pill.is-success {
    background: transparent;
    color: #198754;
}

.auth_account_status_pill.is-danger {
    background: transparent;
    color: #dc3545;
}

.auth_account_status_pill.is-warning {
    background: transparent;
    color: #f0ad00;
}

.auth_account_program_card p {
    margin: 0 0 8px;
    color: #8b94a3;
    font-size: 14px;
}

.auth_account_program_status_mobile {
    display: none;
}

.auth_account_program_description {
    color: #4b5563 !important;
}

.auth_account_program_meta {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: nowrap;
    color: #49515f;
    line-height: 1.45;
}

.auth_account_program_meta span {
    flex: 0 0 150px;
}

.auth_account_program_meta strong {
    color: #293346;
}

.auth_account_program_meta a {
    color: #10489a;
    font-weight: 600;
    text-decoration: underline;
}

.auth_account_program_link_value {
    min-width: 0;
    color: #49515f;
    line-height: 1.55;
    overflow-wrap: anywhere;
}

.auth_account_payment_meta {
    margin-bottom: 8px;
}

.auth_account_status_text.is-success {
    color: #23b84a !important;
}

.auth_account_status_text.is-danger {
    color: #ef4444 !important;
}

.auth_account_inline_note {
    padding: 12px 14px;
    border-radius: 12px;
    font-size: 14px;
}

.auth_account_inline_note.is-warning {
    background: #fff4d8;
    color: #5f4f2d;
}

.auth_account_program_actions {
    display: grid;
    justify-items: end;
    gap: 8px;
    margin-top: 12px;
}

.auth_account_registration_table_actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 12px;
}

.auth_account_footer_action {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
}

.auth_account_admission_link_stack {
    display: grid;
    gap: 18px;
}

.auth_account_admission_link_card {
    width: 100%;
    padding: 18px 18px 16px;
    border: 1px solid #dce3ee;
    border-radius: 16px;
    background: #fff;
    font-size: 14px;
    text-align: left;
}

.auth_account_admission_link_head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.auth_account_admission_link_head h4 {
    margin: 0;
    color: #333333;
    font-size: 16px;
    font-weight: 600;
}

.auth_account_admission_active_status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #198754;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
}

.auth_account_admission_active_status::before {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 7px;
    border-radius: 50%;
    background: currentColor;
}

.auth_account_admission_link_card p {
    font-size: 14px;
    color: #333333;
}

.auth_account_admission_link_dates {
    display: grid;
    color: #8b95a5;
    font-size: 13px;
}

.auth_account_admission_link_dates strong {
    color: #333333;
    font-weight: 400;
}

.auth_account_modal_overlay {
    position: fixed;
    inset: 0;
    z-index: 1090;
}

.auth_account_modal_window {
    position: relative;
    display: flex;
    flex-direction: column;
    width: min(100%, 580px);
    max-height: calc(100vh - 48px);
    padding: 0;
    overflow: hidden;
}

.auth_account_modal_window.is-medium {
    width: min(100%, 620px);
}

.auth_account_modal_window.is-large {
    width: min(100%, 760px);
}

.auth_account_modal_window.is-education {
    width: min(calc(100vw - 64px), 980px);
}

.auth_account_modal_window.is-xlarge {
    width: min(calc(100vw - 48px), 1480px);
}

.auth_account_modal_window.is-student-become {
    width: min(1280px, calc(100vw - 24px));
    height: min(760px, calc(100dvh - 48px));
    max-height: calc(100dvh - 48px);
    background: #fff;
}

.auth_account_modal_window.is-compact {
    width: min(100%, 420px);
}

.auth_account_modal_header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 16px 18px;
    border-bottom: 1px solid #e6ebf3;
}

.auth_account_modal_body {
    min-height: 0;
    overflow-y: auto;
    padding: 18px;
}

.auth_account_student_become_modal_body {
    position: relative;
    flex: 1;
    min-height: 0;
    padding: 0;
    overflow: hidden;
    background: #fff;
}

.auth_account_student_become_header {
    align-items: center;
}

.auth_account_student_become_title_group,
.auth_account_student_become_header_actions {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.auth_account_student_become_back_btn {
    height: 32px;
    padding: 0 14px;
    border: 0;
    border-radius: 8px;
    background: #e9eef6;
    color: #243653;
    font-size: 13px;
    font-weight: 700;
}

.auth_account_student_become_back_btn:hover {
    background: #dfe6f1;
}

.auth_account_student_become_frame {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
    border: 0;
    background: #fff;
}

.auth_account_student_become_frame.is-loading {
    visibility: hidden;
}

.auth_account_student_become_loading {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 12px;
    background: #fff;
    color: #10428C;
    font-size: 14px;
    font-weight: 600;
}

.auth_account_student_become_loading p {
    margin: 0;
}

.admission_request_student_become_modal_body :is(.transfer_stepper_three, .transfer_stepper_two) {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: min(100%, 1180px);
    box-sizing: border-box;
    padding: 0 36px;
    margin: 10px auto 15px;
}

.admission_request_student_become_modal_body .transfer_stepper_two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admission_request_student_become_modal_body :is(.transfer_stepper_three, .transfer_stepper_two) .transfer_step {
    justify-items: center;
}

.admission_request_student_become_modal_body :is(.transfer_stepper_three, .transfer_stepper_two) .transfer_step_marker {
    position: relative;
    display: grid;
    place-items: center;
    width: 100%;
}

.admission_request_student_become_modal_body :is(.transfer_stepper_three, .transfer_stepper_two) .transfer_step_line {
    position: absolute;
    left: calc(50% + 36px);
    width: calc(100% - 72px);
    margin: 0;
    top: 50%;
    transform: translateY(-50%);
}

.admission_request_student_become_modal_body .transfer_step_label {
    justify-self: center;
    margin-left: 0;
    transform: none;
    white-space: normal;
}

.admission_request_student_become_modal_body .admission_request_student_become_shell,
.admission_request_student_become_modal_body .admission_request_student_become_main {
    height: 100%;
}

.admission_request_student_become_modal_body .admission_request_student_become_main {
    display: flex;
    flex-direction: column;
    background: #fff;
}

.admission_request_student_become_modal_body .admission_request_student_step_panel {
    flex: 0 1 auto;
    width: min(100%, 1180px);
    min-height: 0;
    margin: 0 auto;
}

.admission_request_student_become_modal_body .admission_request_student_form_section {
    margin-bottom: 28px;
}

.admission_request_student_become_modal_body .admission_request_student_form_section h3 {
    margin-bottom: 20px;
    padding: 9px 12px;
    border-left: 3px solid #8fa8d4;
    border-radius: 4px;
    background: #eef2f7;
    color: #758197;
    font-size: 15px;
    font-weight: 600;
}

.admission_request_student_become_modal_body .admission_request_student_personal_section {
    overflow: hidden;
    padding: 0 24px 24px;
    border: 1px solid #dfe7f3;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(32, 62, 112, .06);
}

.admission_request_student_become_modal_body .admission_request_student_section_header {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 -24px 24px;
    padding: 18px 24px;
    border-bottom: 1px solid #e7edf6;
    background: linear-gradient(135deg, #f7faff 0%, #f2f6fc 100%);
}

.admission_request_student_become_modal_body .admission_request_student_section_icon {
    display: inline-flex;
    flex: 0 0 44px;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: #e7efff;
    color: #2f63d8;
    font-size: 20px;
}

.admission_request_student_become_modal_body .admission_request_student_section_header h3 {
    margin: 0 0 3px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #172b4d;
    font-size: 17px;
    font-weight: 700;
}

.admission_request_student_become_modal_body .admission_request_student_section_header p {
    margin: 0;
    color: #69778e;
    font-size: 13px;
    line-height: 1.45;
}

.admission_request_student_become_modal_body .admission_request_student_section_header.is-compact {
    min-height: 62px;
    gap: 0;
    margin-bottom: 24px;
    padding-block: 18px;
}

.admission_request_student_become_modal_body .admission_request_student_section_header.is-compact h3 {
    margin: 0;
}

.admission_request_student_become_modal_body .admission_request_student_personal_grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 24px;
}

.admission_request_student_become_modal_body .admission_request_student_field {
    min-width: 0;
}

.admission_request_student_become_modal_body .admission_request_student_field > label {
    display: block;
    margin-bottom: 8px;
    color: #34425a;
    font-size: 13px;
    font-weight: 600;
}

.admission_request_student_become_modal_body .admission_request_student_field .auth_account_input {
    width: 100%;
    min-height: 44px;
    border-color: #d5dfed;
    border-radius: 9px;
    background-color: #fff;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.admission_request_student_become_modal_body .admission_request_student_field .auth_account_input:hover {
    border-color: #aebed5;
}

.admission_request_student_become_modal_body .admission_request_student_field .auth_account_input:focus {
    border-color: #4b78e6;
    box-shadow: 0 0 0 3px rgba(75, 120, 230, .12);
}

.admission_request_student_become_modal_body .admission_request_student_become_page.is-step-2 .admission_request_student_step_panel {
    flex: 0 0 auto;
    padding-bottom: 0;
}

.admission_request_student_scroll_clearance {
    display: block;
    width: 100%;
    height: 116px;
    flex: 0 0 116px;
    pointer-events: none;
}

.admission_request_student_become_modal_body .admission_request_consent_copy {
    font-size: 14px;
    line-height: 1.45;
}

.admission_request_student_become_modal_body .admission_request_consent_copy p {
    margin-bottom: 8px;
}

.admission_request_student_become_modal_body .admission_request_consent_list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 24px;
    margin: 8px 0 14px;
    padding-left: 18px;
}

.admission_request_student_become_modal_body .admission_request_student_consent_box {
    padding: 14px 16px;
}

.admission_request_student_become_modal_body .admission_request_student_consent_box h3 {
 
    color: #111827;
    font-size: 14px;
    font-weight: 500;
}

.admission_request_student_program_consent {
    margin: 14px 0 0;
    color: #1f2a44;
    font-size: 14px;
    line-height: 1.5;
}

.admission_request_student_become_modal_body .admission_request_student_step_confirm {
    display: flex;
    align-items: flex-start;
}

.admission_request_student_become_modal_body .admission_request_student_confirm_wrap {
    width: 100%;
    gap: 14px;
    padding-top: 22px;
}

.admission_request_student_confirm_notice {
    color: #dc3545;
}

.admission_request_student_confirm_notice strong {
    color: inherit;
}

.admission_request_student_danger_alert {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    width: 100%;
    box-sizing: border-box;
    margin-top: 4px;
    padding: 14px 16px;
    border: 1px solid #f5b9c0;
    border-radius: 10px;
    background: #fff5f6;
    color: #a61b2b;
}

.admission_request_student_danger_icon {
    display: inline-flex;
    flex: 0 0 34px;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: #fee2e5;
    color: #dc3545;
    font-size: 16px;
}

.admission_request_student_danger_alert strong {
    display: block;
    margin-bottom: 3px;
    color: #8f1725;
    font-size: 14px;
    font-weight: 700;
}

.admission_request_student_danger_alert p {
    margin: 0;
    color: #b42335;
    font-size: 13px;
    line-height: 1.45;
}

.admission_request_student_become_modal_body .admission_request_student_become_actions {
    position: fixed;
    bottom: 0;
    left: 50%;
    z-index: 10;
    justify-content: flex-end;
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: 14px max(16px, calc((100% - 1180px) / 2)) 16px;
    border-top: 1px solid #e8edf5;
    background: rgba(255, 255, 255, .97);
    transform: translateX(-50%);
    backdrop-filter: blur(8px);
}

.admission_request_student_action_stack {
    display: grid;
    justify-items: end;
    gap: 8px;
    margin-left: auto;
}

.admission_request_student_action_row {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.admission_request_student_action_row .transfer_primary_btn {
    min-width: 132px;
    min-height: 40px;
}

.admission_request_student_back_confirm {
    z-index: 1200;
}

.admission_request_student_back_confirm .transfer_confirm_text {
    margin: 0;
    color: #475467;
    font-size: 14px;
    line-height: 1.6;
}

.admission_request_student_action_message {
    margin: 0;
    align-self: auto;
    font-size: 13px;
    text-align: right;
}

.admission_request_select_host {
    position: relative;
    min-height: 44px;
}

.admission_request_select_expanded {
    position: absolute;
    inset: 0 auto auto 0;
    z-index: 120;
    width: max(100%, 240px);
    max-width: min(320px, calc(100vw - 32px));
    height: auto;
    max-height: 320px;
    overflow-y: auto;
    background: #fff;
    box-shadow: 0 14px 26px rgba(16, 31, 58, .18);
    overscroll-behavior: contain;
}

.auth_account_password_modal_actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 14px;
}

.auth_account_password_modal_actions .auth_account_password_cancel {
    min-height: 35px;
    margin-top: 8px;
}

    .auth_account_modal_validation {
        margin: 12px 0 14px;
        font-size: 13px;
    }

.auth_account_close_btn {
    width: 28px;
    height: 28px;
    border: 0;
    background: transparent;
    color: #5b6472;
}

.auth_account_document_view {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

.auth_account_document_preview {
    padding: 12px;
    border: 1px solid #e4e9f2;
    border-radius: 14px;
}

.auth_account_document_preview img {
    display: block;
    width: 100%;
    max-height: 70vh;
    height: auto;
    object-fit: contain;
}

.auth_account_document_empty {
    min-height: 220px;
    display: grid;
    place-items: center;
    border: 1px dashed #d9dfeb;
    border-radius: 14px;
    color: #98a2b3;
    font-size: 14px;
    font-weight: 400;
    text-align: center;
    padding: 24px;
}

.auth_account_document_pdf iframe {
    display: block;
    width: 100%;
    height: min(78vh, 760px);
    min-height: 620px;
    border: 1px solid #e4e9f2;
    border-radius: 14px;
}

.auth_account_modal_form_grid {
    display: grid;
    gap: 14px;
    margin-bottom: 18px;
}

.auth_account_education_form_grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 18px;
    row-gap: 12px;
    margin-bottom: 12px;
}

.auth_account_modal_field {
    display: grid;
    gap: 7px;
}

.auth_account_modal_window.is-education .auth_account_modal_body {
    overflow-y: visible;
    padding: 16px 18px 18px;
}

.auth_account_modal_window.is-education .auth_label {
    margin: 0;
    color: #111b36;
}

.auth_account_modal_window.is-education .auth_account_input {
    color: #111b36;
    font-weight: 400;
}

.auth_account_modal_window.is-education .auth_account_input::placeholder {
    color: #111b36;
    font-weight: 400;
    opacity: 1;
}

.auth_account_education_modal_actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 8px;
}

.auth_account_education_save_btn,
.auth_account_education_cancel_btn {
    min-width: 86px;
    min-height: 34px;
    border: 0;
    border-radius: 8px;
    padding: 0 16px;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
}

.auth_account_education_save_btn {
    background: #10428C;
}

.auth_account_education_cancel_btn {
    background: #BEC3C7;
}

.auth_account_education_save_btn:disabled {
    background: #e6ebf2;
    color: #7c8797;
    cursor: not-allowed;
}

.transfer_education_modal_actions {
    margin-top: 18px;
}

.auth_account_inline_years {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.auth_account_confirm_text {
    margin: 0 0 14px;
    color: #404a59;
    font-size: 14px;
    line-height: 1.6;
}

.auth_account_confirm_check {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #2A3340;
    font-size: 14px;
    font-weight: 400;
}

.auth_account_confirm_check input {
    width: 15px;
    height: 15px;
    accent-color: #10428C;
}

.auth_account_confirm_actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 18px;
}

.auth_account_confirm_btn {
    width: auto;
    min-width: 88px;
}

.auth_account_status_modal_body {
    display: grid;
    justify-items: center;
    gap: 14px;
    text-align: center;
    padding: 30px 24px;
}

.auth_account_loader {
    width: 52px;
    height: 52px;
    border: 4px solid #d9e3f4;
    border-top-color: #10428C;
    border-radius: 50%;
    animation: account-spin .9s linear infinite;
}

.auth_account_success_icon {
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: radial-gradient(circle at center, rgba(16,66,140,.18), rgba(16,66,140,.04));
    color: #10428C;
    font-size: 30px;
}

.auth_account_error_icon {
    display: grid;
    place-items: center;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: rgba(239, 68, 68, .1);
    color: #dc2626;
    font-size: 30px;
}

.auth_account_modal_window.is-compact .auth_account_status_modal_body h3 {
    margin: 0;
    font-size: 20px;
    line-height: 1.35;
}

.auth_account_modal_window.is-compact .auth_account_status_modal_body p {
    width: 100%;
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    text-align: left;
}

.auth_account_modal_window.is-compact .auth_account_status_modal_body .auth_account_personal_incomplete_message {
    width: 100%;
    text-align: left;
}

.auth_account_guide_list {
    display: grid;
    gap: 12px;
    margin: 0;
    padding-left: 20px;
    color: #455162;
    line-height: 1.65;
}

.auth_account_recharge_form {
    display: grid;
    gap: 14px;
}

.auth_account_money_input_wrap {
    position: relative;
}

.auth_account_money_input_wrap .auth_account_input {
    padding-right: 42px;
}

.auth_account_money_input_wrap span {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #10428C;
    font-weight: 700;
}

.auth_account_qpay_qr {
    display: block;
    width: min(100%, 300px);
    height: auto;
    margin: 0 auto;
    border-radius: 10px;
}

.auth_account_qpay_link {
    display: inline-flex;
    margin-top: 10px;
    color: #10428C;
    font-size: 14px;
    font-weight: 600;
}

.auth_account_recharge_summary {
    display: grid;
    gap: 12px;
    margin: 18px 0;
    padding: 14px;
    border-radius: 10px;
    background: #f8fafc;
}

.auth_account_recharge_summary div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    color: #10428C;
    font-size: 14px;
}

.auth_account_recharge_summary strong {
    white-space: nowrap;
}

.auth_account_recharge_message {
    margin: 0;
    color: #b45309;
    font-weight: 700;
    line-height: 1.45;
}

.auth_account_recharge_message.is-error {
    color: #b91c1c;
}

.auth_account_recharge_message.is-success {
    color: #166534;
}

.auth_account_sidebar_offcanvas {
    max-width: 290px;
}

.offcanvas-header .offcanvas-title {
    color: #10428C;
    font-weight: 700;
}

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

@media (min-width: 1200px) and (max-width: 1540px) {
    .auth_account_recharge_panel {
        width: min(100%, 620px);
    }

    .auth_account_recharge_summary {
        grid-template-columns: auto minmax(126px, max-content) minmax(128px, auto) minmax(170px, auto);
    }
}

@media (max-width: 1199.98px) {
    .auth_account_page {
        padding: 20px 16px 30px;
    }

    .auth_account_content_layout {
        grid-template-columns: 248px minmax(0, 1fr);
        gap: 20px;
    }

    .auth_account_sidebar {
        margin: -20px 0 -30px -16px;
        padding: 20px 20px 30px 16px;
    }

    .auth_account_section_grid {
        grid-template-columns: 1fr;
    }

    .auth_account_balance_card {
        order: -1;
    }

    .auth_account_profile_balance_card {
        position: relative;
        top: auto;
    }

    .auth_account_recharge_panel {
        width: 100%;
    }

    .auth_account_recharge_summary {
        grid-template-columns: auto minmax(126px, max-content) minmax(128px, auto) minmax(170px, auto);
        align-items: center;
    }

    .auth_account_recharge_primary,
    .auth_account_recharge_guide {
        grid-column: auto;
        width: fit-content;
    }

    .auth_account_personal_grid {
        gap: 24px 28px;
    }

}

@media (max-width: 991.98px) {
    .auth_account_mobile_topbar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-bottom: 14px;
    }

    .auth_account_mobile_menu_btn {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        min-height: 42px;
        padding: 0 14px;
        border: 1px solid #d7deea;
        border-radius: 12px;
        background: #fff;
        color: #10428C;
        font-weight: 600;
    }

    .auth_account_mobile_current {
        color: #10428C;
        font-weight: 700;
    }

    .auth_account_content_layout {
        grid-template-columns: 1fr;
    }

    .auth_account_card,
    .auth_account_card_main,
    .auth_account_balance_card {
        padding: 20px;
    }

    .auth_account_personal_grid,
    .auth_account_program_card_grid,
    .auth_account_document_view {
        grid-template-columns: 1fr;
    }

    .auth_account_detail_grid .auth_account_field_row {
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 12px;
        min-height: 0;
        padding: 16px;
    }

    .auth_account_personal_footer {
        margin-top: 20px;
        padding: 0;
        justify-content: flex-end;
    }

    .auth_account_personal_footer .auth_account_detail_actions {
        width: 100%;
    }

    .auth_account_detail_actions .auth_account_action_btn,
    .auth_account_detail_actions .auth_account_section_actions {
        width: 100%;
    }

    .auth_account_table {
        min-width: 760px;
    }

    .auth_account_program_status_desktop {
        display: none;
    }

    .auth_account_program_status_mobile {
        display: inline-flex;
        margin: 0 0 10px;
    }

    .auth_account_program_card_head {
        display: block;
    }
}

@media (max-width: 767.98px) {
    .auth_modal_wrap,
    .auth_account_modal_overlay {
        align-items: flex-start;
        padding: 84px 12px 20px;
    }

    .auth_modal_card,
    .auth_account_modal_window {
        width: 100%;
        padding: 24px 18px;
    }

    .auth_modal_card .auth_modal_head {
        width: calc(100% + 36px);
        margin-right: -18px;
        margin-left: -18px;
        padding-right: 18px;
        padding-left: 18px;
    }

    .auth_unconfirmed_rule {
        margin-right: -18px;
        margin-left: -18px;
    }

    .auth_account_modal_window {
        padding: 0;
    }

    .auth_inline_group {
        grid-template-columns: 1fr;
    }

    .auth_register_grid {
        grid-template-columns: 1fr 1fr;
    }

    .auth_register_grid input {
        grid-column: 1 / -1;
    }

    .auth_picker_modal {
        width: 100%;
        padding: 22px 16px 20px;
    }

    .auth_letter_grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 10px;
    }

    .auth_letter_btn {
        min-height: 52px;
        font-size: 24px;
    }

    .auth_account_page {
        padding: 16px 14px 24px;
    }

    .auth_account_section_header {
        flex-direction: column;
        align-items: flex-start;
    }

    .auth_account_personal_header {
        gap: 18px;
    }

    .auth_account_personal_title {
        gap: 16px;
    }

    .auth_account_section_icon {
        width: 58px;
        height: 58px;
        font-size: 29px;
    }

    .auth_account_section_header h2,
    .auth_account_balance_card h3,
    .auth_account_modal_header h3 {
        font-size: 22px;
    }

    .auth_account_section_actions {
        width: 100%;
    }

    .auth_account_action_btn,
    .auth_account_primary_pill {
        width: 100%;
    }

    .auth_account_balance_card strong {
        font-size: 26px;
    }

    .auth_account_personal_footer {
        align-items: stretch;
    }

    .auth_account_recharge_panel {
        width: 100%;
    }

    .auth_account_recharge_summary {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .auth_account_recharge_primary,
    .auth_account_recharge_guide {
        grid-column: 1 / -1;
        width: 100%;
    }

    .auth_account_detail_grid .auth_account_field_row {
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
    }

    .auth_account_detail_grid .auth_account_field_value,
    .auth_account_detail_grid .auth_account_field_value_strong {
        text-align: left;
    }

    .auth_account_inline_years,
    .auth_account_confirm_actions {
        grid-template-columns: 1fr;
        display: grid;
    }

    .auth_account_education_form_grid {
        grid-template-columns: 1fr;
    }

    .auth_account_modal_window.is-education .auth_account_modal_body {
        overflow-y: auto;
    }

    .auth_account_education_modal_actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .auth_account_confirm_btn {
        width: 100%;
    }
}

.auth_account_nondegree_section {
    font-size: 14px;
}

.auth_account_nondegree_panel {
    min-width: 0;
}

.auth_account_nondegree_label {
    display: block;
    margin: 0 0 10px;
    color: #344052;
    font-size: 14px;
    font-weight: 600;
}

.auth_account_nondegree_select {
    min-width: 300px;
    min-height: 52px;
    margin-bottom: 20px;
    padding: 0 52px 0 16px;
    border: 0;
    border-radius: 10px;
    color: #7b8796;
    background: #eef2f6;
}

.auth_account_nondegree_card_row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 330px));
    gap: 10px;
    margin-bottom: 18px;
}

.auth_account_nondegree_empty {
    grid-column: 1 / -1;
    min-height: 116px;
    padding: 24px;
    border: 1px dashed #dce3ee;
    border-radius: 10px;
    background: #fafcff;
}

.auth_account_nondegree_program_card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 14px;
    align-items: center;
    min-height: 120px;
    padding: 18px;
    border: 1px solid #e1e6ee;
    border-radius: 8px;
    background: #fff;
    text-align: left;
}

.auth_account_nondegree_program_card.is-active {
    border-color: #10428C;
}

.auth_account_nondegree_program_card > i:first-child {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    color: #10428C;
    background: #e8eef8;
    font-size: 22px;
}

.auth_account_nondegree_program_card > i:last-child {
    color: #22c55e;
}

.auth_account_nondegree_program_card span {
    display: grid;
    gap: 8px;
}

.auth_account_nondegree_program_card strong {
    color: #10428C;
    font-size: 15px;
}

.auth_account_nondegree_program_card small,
.auth_account_nondegree_program_card em {
    color: #8490a1;
    font-style: normal;
}

.auth_account_nondegree_info {
    padding-top: 18px;
    border-top: 1px solid #e1e6ee;
}

.auth_account_nondegree_info h3,
.auth_account_nondegree_subtitle {
    margin: 0 0 8px;
    color: #10428C;
    font-size: 15px;
    font-weight: 600;
}

.auth_account_nondegree_info p {
    margin: 0 0 18px;
    color: #4b5565;
    line-height: 1.45;
    font-size: 14px;
}

.auth_account_nondegree_meta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
    margin: 0 0 20px;
}

.auth_account_nondegree_meta dt {
    color: #10428C;
    font-size: 14px;
    font-weight: 600;
}

.auth_account_nondegree_meta dd {
    margin: 4px 0 0;
    color: #4b5565;
}

.auth_account_nondegree_meta dd.is-empty {
    color: #98a2b3;
}

.auth_account_schedule_empty_state {
    min-height: 260px;
    align-content: center;
}

.auth_account_nondegree_table th {
    background: #e5ebf2;
}

.auth_account_nondegree_grade_table th {
    background: #fff;
}

.auth_account_nondegree_table span {
    color: #8a94a3;
}

.auth_account_soft_pill,
.auth_account_warning_pill,
.auth_account_muted_pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid #DFE5EB;
    border-radius: 12px;
    color: #58616B;
    background: #DFE5EB;
    font-weight: 600;
}

.auth_account_soft_pill:disabled {
    cursor: not-allowed;
    opacity: 0.62;
}

.auth_account_warning_pill {
    border: 1px solid #FFEED1;
    color: #FB9200 !important;
    background: #FFEED1;
    font-size: 12px;
}

.auth_account_nondegree_toolbar {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto auto;
    align-items: end;
    gap: 18px;
    margin-bottom: 12px;
}

.auth_account_muted_pill {
    border-color: #e8edf4;
    color: #7b8796 !important;
    background: #eef2f6;
    font-size: 12px;
}

.auth_account_week_check {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    color: #344052;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
}

.auth_account_week_range {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.auth_account_week_range button {
    width: 42px;
    height: 42px;
    border: 1px solid #9aa6b4;
    border-radius: 10px;
    background: #fff;
    color: #8995a3;
    font-size: 16px;
    line-height: 1;
}

.auth_account_week_range span {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0 38px 0 16px;
    color: #1f242b;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
}

.auth_account_week_date {
    position: relative;
    display: inline-flex;
    align-items: center;
    min-width: 220px;
    min-height: 42px;
    border: 1px solid #9aa6b4;
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}

.auth_account_week_date input {
    position: absolute;
    inset: 0;
    opacity: 0;
}

.auth_account_week_date i {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #7b8796;
    font-size: 15px;
    pointer-events: none;
}

.auth_account_week_grid {
    display: grid;
    grid-template-columns: 112px minmax(980px, 1fr);
    gap: 0;
    overflow-x: auto;
}

.auth_account_week_times {
    display: grid;
    grid-template-rows: repeat(18, 42px);
    padding-top: 44px;
    color: #657184;
    font-size: 13px;
}

.auth_account_week_board {
    position: relative;
    display: grid;
    grid-template-columns: repeat(7, minmax(100px, 1fr));
    min-width: 980px;
    border-top: 1px solid #e2e7ee;
    border-left: 1px solid #e2e7ee;
    background:
        repeating-linear-gradient(to bottom, transparent 0 41px, #edf1f6 41px 42px),
        repeating-linear-gradient(to right, transparent 0 calc(100% / 7 - 1px), #e2e7ee calc(100% / 7 - 1px) calc(100% / 7));
}

.auth_account_week_days {
    display: contents;
}

.auth_account_week_days span {
    border-right: 1px solid #e2e7ee;
    background: #e9eef5;
    color: #344052;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
}

.auth_account_week_event {
    z-index: 1;
    align-self: stretch;
    margin: 4px;
    padding: 7px 8px;
    border: 0;
    border-left: 3px solid rgba(16, 66, 140, 0.35);
    border-radius: 4px;
    color: #344052;
    background: #dedaf0;
    font-size: 11px;
    line-height: 1.25;
    text-align: left;
    cursor: pointer;
}

.auth_account_week_event span,
.auth_account_week_event em {
    display: block;
}

.auth_account_week_event em {
    margin-top: 4px;
    color: #657184;
    font-style: normal;
    text-align: right;
}

.auth_account_week_event small {
    display: inline-flex;
    margin-right: 5px;
    padding: 1px 7px;
    border-radius: 999px;
    background: #fff;
    color: #10428C;
}

.auth_account_week_event.is-purple {
    background: #dedaf0;
}

.auth_account_week_event.is-green {
    background: #cde5ab;
}

.auth_account_week_event.is-related {
    outline: 2px solid rgba(16, 66, 140, 0.18);
}

.auth_account_week_event.is-selected {
    z-index: 3;
    box-shadow: 0 0 0 2px #10428C;
}

.auth_account_week_detail {
    z-index: 4;
    pointer-events: none;
    align-self: start;
    justify-self: start;
    width: min(240px, calc(100% - 16px));
    min-width: 210px;
    margin: 0 8px;
    padding: 14px 14px 12px;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.22);
    color: #344052;
    font-size: 12px;
}

.auth_account_week_detail h4 {
    margin: 0 0 12px;
    color: #344052;
    font-size: 13px;
    font-weight: 700;
}

.auth_account_week_detail dl {
    display: grid;
    gap: 7px;
    margin: 0;
}

.auth_account_week_detail dl div {
    display: grid;
    grid-template-columns: 64px 1fr;
    gap: 8px;
}

.auth_account_week_detail dt {
    color: #657184;
    font-weight: 700;
}

.auth_account_week_detail dd {
    margin: 0;
}

.auth_account_week_detail p {
    margin: 12px 0 0;
    color: #8a94a3;
}

.auth_account_week_detail_close {
    float: right;
    border: 0;
    background: transparent;
    color: #8a94a3;
}

.auth_account_term_row td {
    background: #e5ebf2;
    color: #66707d;
    text-align: center;
}

.auth_account_schedule_picker {
    display: grid;
    gap: 8px;
    padding-bottom: 4px;
}

.auth_account_schedule_picker h4 {
    margin: 14px 0 0;
    color: #10428C;
    font-size: 15px;
    font-weight: 600;
}

.auth_account_schedule_picker label {
    display: grid;
    grid-template-columns: auto 1fr 1fr 1.4fr;
    align-items: center;
    gap: 12px;
    min-height: 50px;
    padding: 0 12px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: #eef2f6;
}

.auth_account_schedule_picker label:has(input:checked) {
    border-color: #0d6efd;
    background: #e4ebff;
}

.auth_account_schedule_picker label.is-conflict {
    border-color: #f2d38a;
    background: #fff4d8;
}

.auth_account_schedule_alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
}

.auth_account_schedule_alert i {
    font-size: 15px;
    line-height: 1.4;
}

.auth_account_schedule_alert strong {
    display: block;
    margin-bottom: 2px;
    font-weight: 600;
}

.auth_account_schedule_conflict_note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: -2px 0 2px;
    padding: 0 12px;
    color: #8a6d3b;
    font-size: 12px;
    line-height: 1.4;
}

@media (max-width: 1199.98px) {
    .auth_account_nondegree_toolbar {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .auth_account_nondegree_select {
        min-width: 0;
        width: 100%;
    }

    .auth_account_nondegree_card_row,
    .auth_account_nondegree_meta {
        grid-template-columns: 1fr;
    }

    .auth_account_week_range {
        gap: 8px;
        width: 100%;
    }

    .auth_account_week_range button {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        font-size: 18px;
    }

    .auth_account_week_date {
        flex: 1;
        min-width: 0;
        min-height: 48px;
        border-radius: 12px;
    }

    .auth_account_week_range span {
        min-height: 44px;
        padding: 0 42px 0 12px;
        font-size: 14px;
    }

    .auth_account_week_date i {
        right: 14px;
        font-size: 18px;
    }

    .auth_account_schedule_picker label {
        grid-template-columns: auto 1fr;
        align-items: start;
        padding: 12px;
    }
}

/* ================================
   Contact Page
   ================================ */
.contact_body,
.contact-body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: #eef3fa;
}

.contact_body > .container-fluid.p-0,
.contact-body > .container-fluid.p-0 {
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
}

.contact_body > .container-fluid.p-0 > main,
.contact-body > .container-fluid.p-0 > main {
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
}

.contact_page {
    flex: 1 0 auto;
    padding: 40px 20px 52px;
    background:
        radial-gradient(circle at 10% 0%, rgba(50, 133, 255, .11), transparent 30%),
        linear-gradient(180deg, #f4f8fd 0%, #eef3fa 100%);
}

.contact_shell {
    max-width: 1220px;
    margin: 0 auto;
}

.contact_hero {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 32px;
    overflow: hidden;
    padding: 44px 48px;
    border-radius: 28px;
    background: linear-gradient(125deg, #082f72 0%, #104c9f 58%, #087fca 100%);
    color: #fff;
    box-shadow: 0 24px 60px rgba(16, 66, 140, .2);
}

.contact_hero::before,
.contact_hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    pointer-events: none;
}

.contact_hero::before {
    width: 340px;
    height: 340px;
    top: -210px;
    right: 10%;
    border: 70px solid rgba(255, 255, 255, .07);
}

.contact_hero::after {
    width: 190px;
    height: 190px;
    right: -70px;
    bottom: -110px;
    background: rgba(67, 199, 255, .16);
}

.contact_eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 15px;
    color: #bfe6ff;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.contact_hero h1 {
    margin: 0 0 10px;
    font-size: clamp(32px, 4vw, 48px);
    font-weight: 500;
    letter-spacing: -.03em;
}

.contact_hero_content > p {
    max-width: 650px;
    margin: 0;
    color: rgba(255, 255, 255, .82);
    font-size: 17px;
    line-height: 1.6;
}

.contact_phone_group {
    display: grid;
    gap: 11px;
    min-width: 320px;
    padding: 20px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 18px;
    background: rgba(255, 255, 255, .1);
    backdrop-filter: blur(10px);
}

.contact_phone_label {
    color: #cbe9ff;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.contact_phone_links {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.contact_phone_links a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 10px 13px;
    border-radius: 10px;
    background: #fff;
    color: #0b428d;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    transition: transform .18s ease, box-shadow .18s ease;
}

.contact_phone_links a:hover {
    color: #0b428d;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 25, 70, .18);
}

.contact_directory {
    margin-top: 24px;
    padding: 28px;
    border: 1px solid #e2eaf4;
    border-radius: 26px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 18px 48px rgba(35, 74, 149, .08);
}

.contact_department_group {
    padding: 28px;
    border: 1px solid #dfe8f4;
    border-radius: 22px;
    background: #f7faff;
}

.contact_department_group + .contact_department_group {
    margin-top: 22px;
}

.contact_department_group.is-digital-office {
    border-color: #dbe5f0;
    background: #f4f7fb;
}

.contact_department_header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 22px;
}

.contact_department_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    border-radius: 15px;
    background: #104c9f;
    color: #fff;
    font-size: 21px;
    box-shadow: 0 8px 18px rgba(16, 76, 159, .18);
}

.is-digital-office .contact_department_icon {
    background: #3976b8;
}

.contact_department_label {
    display: block;
    margin-bottom: 4px;
    color: #718097;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.contact_department_header h2 {
    margin: 0;
    color: #18263a;
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: -.02em;
}

.contact_section_heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 28px;
}

.contact_section_heading span {
    display: block;
    margin-bottom: 7px;
    color: #1672c4;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.contact_section_heading h2 {
    margin: 0;
    color: #18263a;
    font-size: clamp(23px, 3vw, 30px);
    font-weight: 700;
    letter-spacing: -.025em;
}

.contact_section_heading > p {
    max-width: 420px;
    margin: 0;
    color: #758197;
    font-size: 14px;
    line-height: 1.6;
}

.contact_service_grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.contact_service_card {
    --contact-accent: #1672c4;
    --contact-tint: #eaf5ff;
    position: relative;
    display: flex;
    min-height: 280px;
    flex-direction: column;
    overflow: hidden;
    padding: 25px;
    border: 1px solid #e4eaf2;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 8px 24px rgba(29, 55, 94, .055);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.contact_service_card::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 90px;
    height: 4px;
    border-radius: 0 20px 0 8px;
    background: var(--contact-accent);
}

.contact_service_card:hover {
    border-color: color-mix(in srgb, var(--contact-accent) 28%, #e4eaf2);
    transform: translateY(-3px);
    box-shadow: 0 18px 36px rgba(29, 55, 94, .1);
}

.contact_service_card.is-transfer {
    --contact-accent: #7357d8;
    --contact-tint: #f0edff;
}

.contact_service_card.is-digital-transfer {
    --contact-accent: #3976b8;
    --contact-tint: #eaf2fb;
}

.contact_service_card.is-standalone {
    min-height: 0;
}

.contact_service_card.is-standalone > p {
    min-height: 0;
    margin-bottom: 8px;
}

.contact_service_card.is-standalone .contact_service_details {
    margin-top: 0;
}

.contact_service_card.is-civil {
    --contact-accent: #0d9783;
    --contact-tint: #e7f8f4;
}

.contact_service_card.is-nondegree {
    --contact-accent: #d67825;
    --contact-tint: #fff2e6;
}

.contact_service_topline {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.contact_service_intro {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.contact_service_intro p {
    margin: 0;
    color: #47566c;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
}

.contact_service_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 15px;
    background: var(--contact-tint);
    color: var(--contact-accent);
    font-size: 22px;
}

.contact_header_icon::before {
    content: "";
    width: 24px;
    height: 24px;
    background: currentColor;
    -webkit-mask: var(--contact-header-icon) center / contain no-repeat;
    mask: var(--contact-header-icon) center / contain no-repeat;
}

.contact_header_icon.is-transfer-icon {
    --contact-header-icon: url("../img/shiljilt.svg");
}

.contact_header_icon.is-civil-icon {
    --contact-header-icon: url("../img/users.svg");
}

.contact_header_icon.is-nondegree-icon {
    --contact-header-icon: url("../img/zergiin-bus.svg");
}

.contact_service_number {
    flex: 0 0 auto;
    color: #d5dce6;
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -.04em;
}

.contact_service_card h3 {
    margin: 0 0 7px;
    color: #1d2a3c;
    font-size: 21px;
    font-weight: 500;
}

.contact_service_card > p {
    min-height: 44px;
    margin: 0 0 20px;
    color: #778398;
    font-size: 14px;
    line-height: 1.55;
}

.contact_service_details {
    display: grid;
    gap: 13px;
    margin: 12px 0 0;
}

.contact_service_details > div {
    display: grid;
    grid-template-columns: 142px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
}

.contact_service_details dt {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #7d8899;
    font-size: 12px;
    font-weight: 500;
}

.contact_service_details dt i {
    color: var(--contact-accent);
    font-size: 15px;
}

.contact_service_details dd {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
    color: #263449;
    font-size: 13px;
    font-weight: 500;
}

.contact_service_details dd > span {
    padding: 5px 8px;
    border-radius: 7px;
    background: var(--contact-tint);
    color: var(--contact-accent);
}

.contact_service_details a {
    color: #333333;
    text-decoration: none;
}

.contact_service_details a:hover {
    text-decoration: underline;
}

@media (max-width: 1199.98px) {
    .contact_hero {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .contact_phone_group {
        min-width: 0;
        width: fit-content;
    }
}

@media (max-width: 991.98px) {
    .contact_page {
        padding: 22px 14px 34px;
    }

    .contact_hero {
        padding: 32px 28px;
        border-radius: 22px;
    }

    .contact_directory {
        padding: 20px;
        border-radius: 22px;
    }

    .contact_department_group {
        padding: 22px;
    }

    .contact_section_heading {
        display: grid;
        gap: 12px;
    }

    .contact_service_grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}

@media (max-width: 767.98px) {
    .contact_service_grid {
        grid-template-columns: 1fr;
    }

    .contact_service_card {
        min-height: 0;
    }
}

@media (max-width: 575.98px) {
    .contact_hero {
        gap: 24px;
        padding: 27px 20px;
        border-radius: 18px;
    }

    .contact_hero_content > p {
        font-size: 15px;
    }

    .contact_phone_group,
    .contact_phone_links,
    .contact_phone_links a {
        width: 100%;
    }

    .contact_phone_links a {
        justify-content: center;
    }

    .contact_directory {
        margin-top: 14px;
        padding: 12px;
        border-radius: 18px;
    }

    .contact_department_group {
        padding: 17px 12px;
        border-radius: 16px;
    }

    .contact_department_header {
        align-items: flex-start;
        gap: 11px;
        margin-bottom: 17px;
    }

    .contact_department_icon {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
        border-radius: 12px;
        font-size: 18px;
    }

    .contact_department_header h2 {
        font-size: 18px;
    }

    .contact_service_card {
        padding: 21px 18px;
        border-radius: 16px;
    }

    .contact_service_details > div {
        grid-template-columns: 1fr;
        gap: 7px;
        padding-top: 11px;
        border-top: 1px solid #edf0f4;
    }

    .contact_service_card > p {
        min-height: 0;
    }
}

/* ================================
   Home Page
   ================================ */
[v-cloak] {
    display: none;
}

:root {
    --num-blue: #10428C;
    --num-soft: #F5F7FA;
    --num-card: #EFF3F8;
    --num-footer: #154D9F;

    --num-blue-dark: #0a3474;
    --num-ink: #202833;
    --num-muted: #66707d;
    --num-line: #d8e0ea;
    --num-green: #23b84a;
    --num-gold: #f2ae00;
}

html {
    scroll-behavior: smooth;
}

body {
    margin-bottom: 0;
    color: var(--num-ink);
    background: var(--num-soft);
    font-family: 'Montserrat';
}

@font-face {
    font-family: 'Montserrat';
    src: url('../font/Montserrat-Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../font/Montserrat-Medium.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../font/Montserrat-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    src: url('../font/Montserrat-Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}
.home_num_home {
    --home-content-width: 1524px;
    min-height: 100vh;
    overflow-x: hidden;
    background: var(--num-soft);
    letter-spacing: 0;
}

.home_num_home .container-xxl {
    max-width: 2020px;
}

.home_app_icon {
    width: 1.35rem;
    height: 1.35rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
    flex: 0 0 auto;
}


.home_hero_skyline {
    display: block;
    width: 100%;
    min-width: 1120px;
    height: auto;
    margin-inline: auto;
}

.home_intro_section {
    padding: 50px 0 92px;
}

.home_intro_copy {
    max-width: var(--home-content-width);
    margin: 0 auto;
    color: var(--num-blue);
    font-size: clamp(1.12rem, 1rem + .7vw, 1.72rem);
    line-height: 2.05;
    font-weight: 400;
    text-align: center;
}

.home_intro_copy strong {
    font-weight: 800;
}

.home_admission_section {
    padding: 0 0 94px;
}




.home_program_card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 270px;
    padding: 46px 56px 34px;
    border-radius: 22px;
    background: #fff;
    box-shadow: none;
    scroll-snap-align: start;
}



.home_program_card_header {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.home_program_type {
    margin: 0 0 22px;
    color: var(--num-blue);
    font-size: 1.32rem;
    font-weight: 500;
}

.home_program_card h3 {
    margin: 0 0 22px;
    color: #202833;
    font-size: 1.18rem;
    font-weight: 800;
}

.home_program_status_badge {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    min-height: 18px;
    margin: 0 0 14px;
    padding: 0;
    border-radius: 0 !important;
    background: transparent !important;
    font-size: 12px;
    font-weight: 600 !important;
    line-height: 1.2;
    white-space: normal;
    color: #475467 !important;
}

.home_program_status_badge::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex: 0 0 auto;
    background: currentColor;
}

.home_program_status_badge.text-bg-success {
    color: #198754 !important;
}

.home_program_status_badge.text-bg-danger {
    color: #dc3545 !important;
}

.home_program_status_badge.text-bg-warning {
    color: #f0ad00 !important;
}

/* Магистр/Доктор карт дээр хөтөлбөрийн төрлийн мөр байхгүй тул нэг мөрийн өндөртэй
   зайг үлдээж, статусын мөрийг бакалаврын баганануудтай нэг хэвтээ шугаманд байлгана. */
.home_program_type_spacer {
    visibility: hidden;
}

.home_program_icon {
    color: var(--num-blue);
}

.home_program_term,
.home_program_dates {
    font-size: 1.08rem;
}

.home_program_term {
    margin: 0 0 14px;
    font-weight: 800;
}

.home_program_dates {
    display: grid;
    gap: 4px;
    margin: 0;
}

.home_program_dates div {
    display: flex;
    gap: .35rem;
}

.home_program_dates dt {
    color: #3c4550;
    font-weight: 400;
}

.home_program_dates dd {
    margin: 0;
    color: #202833;
    font-weight: 600;
}

.home_details_link {
    align-self: flex-end;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    margin-top: auto;
    color: var(--num-blue);
    font-size: 1.06rem;
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 5px;
}

.home_process_section {
    padding: 12px 0 120px;
}

.home_process_grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 118px 88px;
    align-items: start;
}

.home_process_step.is-wide {
    grid-column: 1 / -1;
}

.home_process_heading {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin: 0 auto 72px;
    position: relative;
    width: 100%;
}

    .home_process_heading span {
        color: #d3dbe4;
        font-size: clamp(5.2rem, 9vw, 9.6rem);
        line-height: .82;
        font-weight: 900;
    }

    .home_process_heading h2 {
        margin: 0 0 0 -2.5rem; /* энд overlap хийнэ */
        color: #050608;
        font-size: clamp(2rem, 1.2rem + 2vw, 3.45rem);
        font-weight: 700;
        white-space: nowrap;
        position: relative;
        z-index: 1;
    }

.home_process_cards {
    display: inline-flex;
    justify-content: center;
    align-items: stretch;
    gap: 48px;
    flex-wrap: nowrap;
    margin: 0;
}
.home_process_cards_wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
}
/* 04-р алхам бүтэн мөр эзэлнэ */
.home_process_step:last-child {
    grid-column: 1 / -1;
}

    /* 04-ийн heading голдоно */
    .home_process_step:last-child .home_process_heading {
        justify-content: center;
    }

    /* 04-ийн card-ууд голдоо нэг мөрөөр байрлана */
    .home_process_step:last-child .home_process_cards_wrapper {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .home_process_step:last-child .home_process_cards {
        display: flex;
        justify-content: center;
        align-items: stretch;
        gap: 48px;
        flex-wrap: nowrap;
        width: auto;
        margin: 0 auto;
    }
.home_action_card {
    width: min(100%, 430px);
    min-height: 214px;
    padding: 44px 58px;
    border-radius: 8px;
    background: var(--num-card);
    box-shadow: 0 22px 42px rgba(28, 41, 56, .08);
}

.home_action_title {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 24px;
}

.home_action_title h3 {
    margin: 0;
    color: var(--num-blue);
    font-size: 1.55rem;
    font-weight: 700;
    line-height: 1.15;
}

.home_action_title .home_app_icon {
    width: 1.5rem;
    height: 1.5rem;
    stroke-width: 1.9;
}

.home_action_title .home_gold {
    color: var(--num-gold);
}

.home_action_title .home_green {
    color: var(--num-green);
}

.home_action_title .home_blue {
    color: var(--num-blue);
}

.home_action_card p {
    margin: 0;
    color: #343b45;
    font-size: 1.18rem;
    line-height: 1.45;
}

.home_stats_section {
    padding: 60px 0 104px;
}

.home_stats_section strong {
    display: block;
    color: var(--num-blue);
    font-size: clamp(3.2rem, 5vw, 5.35rem);
    line-height: 1;
    font-weight: 900;
}

.home_stats_section span {
    display: block;
    max-width: 270px;
    margin: 18px auto 0;
    color: #262c35;
    font-size: 1.14rem;
    font-weight: 800;
    line-height: 1.25;
}


@media (max-width: 1199.98px) {


    .home_intro_section {
        padding: 76px 0 68px;
    }

    .home_intro_copy {
        max-width: 1396px;
    }

}

@media (max-width: 767.98px) {


    .home_hero_skyline {
        min-width: 760px;
        transform: translateX(-24%);
    }

    .home_intro_section {
        padding: 54px 0 54px;
    }

    .home_intro_copy {
        max-width: 1232px;
        line-height: 1.75;
        text-align: left;
    }

    .home_section_title {
        gap: 1.25rem;
        margin-bottom: 34px;
    }

    .home_section_title span {
        height: 54px;
    }

    .home_admission_section {
        padding-bottom: 64px;
    }

 

    .home_program_card {
        min-height: 250px;
        padding: 30px 28px 28px;
        border-radius: 16px;
    }


    .home_program_dates div {
        display: block;
    }


 

 

    .home_action_card {
        padding: 32px 30px;
    }

    .home_stats_section {
        padding: 42px 0 70px;
    }


}



/* HERO responsive */
@media (max-width: 1199.98px) {
    .home_hero_art {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .home_hero_skyline {
        width: auto;
        max-width: none;
        margin: 0 auto;
        transform: none;
    }
}






/* HERO */
.home_hero_section {
    background: #fff;
    margin-top: 0;
}

.home_hero_art {
    width: 100%;
    overflow: hidden;
}

/* =========================
   MOBILE / TABLET
========================= */




.home_admission_stack {
    display: grid;
    gap: 55px;
    width: 100%;
    max-width: var(--home-content-width);
    margin: 0 auto;
}





/* =========================
   ADMISSION SCROLL - DESKTOP / TABLET / MOBILE
========================= */




.home_admission_row {
    --admission-bachelor-width: 980px;
    --admission-extra-width: 250px;
    --admission-gap: 22px;
    position: relative;
    min-width: 0;
}

.home_admission_carousel {
    position: relative;
    min-width: 0;
}

.home_admission_viewport {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
    scroll-behavior: smooth;
    scroll-snap-type: x proximity;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
}

.home_admission_viewport::-webkit-scrollbar {
    display: none;
}

.home_admission_viewport.is-auto-scrolling {
    scroll-behavior: auto;
    scroll-snap-type: none;
}

.home_carousel_arrow {
    position: absolute;
    z-index: 4;
    top: 50%;
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    padding: 0;
    border: 1px solid rgba(30, 91, 171, 0.15);
    border-radius: 50%;
    color: var(--num-blue);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 12px 32px rgba(20, 54, 96, 0.2);
    transform: translateY(-50%);
    transition: color 180ms ease, background 180ms ease, box-shadow 180ms ease, transform 180ms ease, opacity 180ms ease;
    backdrop-filter: blur(10px);
}

.home_carousel_arrow i {
    font-size: 1.3rem;
    line-height: 1;
}

.home_carousel_arrow.is-previous {
    left: 14px;
}

.home_carousel_arrow.is-next {
    right: 14px;
}

.home_carousel_arrow:hover,
.home_carousel_arrow:focus-visible {
    color: #fff;
    background: var(--num-blue);
    box-shadow: 0 15px 36px rgba(16, 75, 153, 0.32);
    transform: translateY(-50%) scale(1.06);
    outline: none;
}

.home_admission_carousel.is-at-start .home_carousel_arrow.is-previous,
.home_admission_carousel.is-at-end .home_carousel_arrow.is-next {
    opacity: 0.38;
}

.home_admission_layout {
    display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    gap: var(--admission-gap);
    width: max-content;
    min-width: 100%;
}

.home_view_all_link {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #5893D8;
    font-size: 18px;
    font-weight: 500;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
}

.home_view_all_link i {
    font-size: 20px;
    line-height: 1;
}

.home_view_all_link:hover {
    color: var(--num-blue);
    text-decoration: underline;
    text-underline-offset: 4px;
}

.home_group_panel {
    flex: 0 0 auto;
    min-width: 980px;
    background: #fff;
    border-radius: 28px;
    padding: 36px 46px 34px;
    scroll-snap-align: start;
}

.home_admission_extra {
    position: relative;
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
    min-width: 250px;
    background: #fff;
    border-radius: 28px;
    padding: 36px 28px 34px;
    scroll-snap-align: start;
}

.home_group_panel_title {
    margin: 0 0 28px;
    color: #202833;
    font-size: 1.35rem;
    font-weight: 700;
}

.home_group_strip {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(250px, 1fr);
    align-items: stretch;
}

.home_strip_item {
    position: relative;
    display: flex;
    min-width: 250px;
    padding: 0 28px;
}

    .home_strip_item:first-child {
        padding-left: 0;
    }

    .home_strip_item:last-child {
        padding-right: 0;
    }

    .home_strip_item + .home_strip_item::before {
        content: "";
        position: absolute;
        left: 0;
        top: 8px;
        bottom: 8px;
        width: 1px;
        background: var(--num-blue);
    }

.home_group_panel .home_program_card,
.home_admission_extra .home_program_card {
    width: 100%;
    min-height: auto;
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.home_group_panel .home_program_card {
    height: 100%;
}

.home_admission_extra .home_program_card {
    flex: 1 1 auto;
    height: auto;
}

    .home_group_panel .home_program_card::before,
    .home_admission_extra .home_program_card::before {
        display: none;
    }

.home_group_panel .home_program_card_header,
.home_admission_extra .home_program_card_header {
    align-items: flex-start;
}

.home_group_panel .home_program_type,
.home_admission_extra .home_program_type {
    margin: 0 0 20px;
    color: var(--num-blue);
    font-size: 1.08rem;
    font-weight: 500;
}

.home_group_panel .home_program_card h3,
.home_admission_extra .home_program_card h3 {
    margin: 0 0 18px;
    color: #202833;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.35;
}

.home_group_panel .home_program_term,
.home_admission_extra .home_program_term {
    margin: 0 0 12px;
    font-size: 0.98rem;
    font-weight: 600;
}

.home_group_panel .home_program_dates,
.home_admission_extra .home_program_dates {
    font-size: 0.96rem;
}

    .home_group_panel .home_program_dates div,
    .home_admission_extra .home_program_dates div {
        display: grid;
        grid-template-columns: auto auto;
        column-gap: 8px;
        align-items: start;
        justify-content: start;
    }

.home_group_panel .home_details_link,
.home_admission_extra .home_details_link {
    margin-top: auto;
    padding-top: 22px;
    font-size: 0.98rem;
    font-weight: 600;
}

@media (min-width: 1200px) {
    .home_admission_stack {
        width: calc(100% - 128px);
    }

    .home_carousel_arrow.is-previous {
        left: -66px;
    }

    .home_carousel_arrow.is-next {
        right: -66px;
    }
}

@media (max-width: 1199.98px) {
    .home_admission_row {
        --admission-bachelor-width: 860px;
        --admission-extra-width: 260px;
    }

    .home_view_all_link {
        gap: 5px;
        font-size: 18px;
    }

    .home_view_all_link i {
        font-size: 18px;
    }

    .home_group_panel {
        min-width: 860px;
        padding: 30px 34px 28px;
    }

    .home_admission_extra {
        flex: 0 0 auto;
        min-width: 260px;
        padding: 30px 24px 28px;
    }

    .home_strip_item {
        min-width: 260px;
        padding: 0 24px;
    }
}

@media (max-width: 767.98px) {
    .home_admission_row {
        --admission-bachelor-width: 760px;
        --admission-extra-width: 220px;
        --admission-gap: 16px;
    }

    .home_carousel_arrow {
        width: 42px;
        height: 42px;
    }

    .home_carousel_arrow.is-previous {
        left: 8px;
    }

    .home_carousel_arrow.is-next {
        right: 8px;
    }

    .home_admission_layout {
        gap: var(--admission-gap);
    }

    .home_view_all_link {
        gap: 5px;
        font-size: 14px;
    }

    .home_view_all_link i {
        font-size: 16px;
    }

    .home_group_panel {
        min-width: 760px;
        padding: 24px 22px 22px;
        border-radius: 18px;
    }

    .home_admission_extra {
        flex: 0 0 auto;
        min-width: 220px;
        padding: 24px 18px 22px;
        border-radius: 18px;
    }

    .home_strip_item {
        min-width: 220px;
        padding: 0 18px;
    }

        .home_strip_item + .home_strip_item::before {
            top: 6px;
            bottom: 6px;
        }

    .home_group_panel .home_program_card h3,
    .home_admission_extra .home_program_card h3 {
        font-size: 1rem;
        line-height: 1.35;
    }

    .home_group_panel .home_program_dates,
    .home_admission_extra .home_program_dates {
        font-size: 0.9rem;
    }
    .home_sub_section_title {
        flex-wrap: wrap;
        gap: 16px;
        margin: 0 0 18px;
        padding-left: 0;
        padding-bottom: 18px;
    }

        .home_sub_section_title span {
            height: 36px;
        }

        .home_sub_section_title h2 {
            font-size: 22px;
        }

    .home_sub_section_title .home_view_all_link {
        max-width: 100%;
        margin-left: 0;
        flex: 0 0 auto;
    }
}


.home_sub_section_title {
    display: flex;
    align-items: center;
    gap: 22px;
    margin: 0 0 22px;
 
    padding-bottom: 30px;
}

    .home_sub_section_title span {
        width: 3px;
        height: 46px;
        background: var(--num-blue);
        flex: 0 0 2px;
    }

    .home_sub_section_title h2 {
        margin: 0;
        
        font-size: 36px;
        line-height: 1;
        font-weight: 600;
        letter-spacing: 0;
    }

@media (max-width: 767.98px) {
    .home_sub_section_title {
        flex-wrap: wrap;
        gap: 12px 16px;
        margin: 0 0 18px;
        padding-bottom: 18px;
    }

    .home_sub_section_title span {
        height: 36px;
    }

    .home_sub_section_title h2 {
        font-size: 22px;
    }

    .home_sub_section_title .home_view_all_link {
        max-width: 100%;
        margin-left: 0;
        flex: 0 0 auto;
    }
}

/* =========================
   PROCESS SECTION RESPONSIVE
========================= */

/* tablet */
@media (max-width: 1199.98px) {
    .home_process_section {
        padding: 8px 0 90px;
    }

    .home_process_grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 56px 40px;
    }

    /* 04-ийн heading голдоно */
    .home_process_step:last-child .home_process_heading {
        justify-content: start;
    }


    .home_process_heading {
        justify-content: flex-start;
        margin: 0 0 28px;
    }

        .home_process_heading span {
            font-size: 4.2rem;
            line-height: 0.85;
        }

        .home_process_heading h2 {
            margin-left: -1.2rem;
            font-size: 2rem;
            white-space: normal;
            text-align: center;
        }

    .home_process_cards_wrapper {
        width: 100%;
        justify-content: center;
    }

    .home_process_cards,
    .home_process_step:last-child .home_process_cards {
        
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
        width: 100%;
        margin: 0;
    }

    .home_action_card {
        width: 100%;
        min-height: auto;
        padding: 28px 24px;
    }

    .home_action_title {
        gap: 18px;
        margin-bottom: 16px;
    }

        .home_action_title h3 {
            font-size: 1.25rem;
        }

    .home_action_card p {
        font-size: 1rem;
        line-height: 1.55;
    }
}

/* mobile */
@media (max-width: 767.98px) {
    .home_process_section {
        padding: 0 0 64px;
    }

    .home_process_grid {
        grid-template-columns: 1fr;
        gap: 42px;
    }

    .home_process_step,
    .home_process_step.is-wide,
    .home_process_step:last-child {
        grid-column: 1 / -1;
    }

    .home_process_heading {
        justify-content: flex-start;
        align-items: flex-end;
        margin: 0 0 20px;
    }

        .home_process_heading span {
            font-size: 3.4rem;
            line-height: 0.82;
        }

        .home_process_heading h2 {
            margin-left: -0.8rem;
            font-size: 1.9rem;
            line-height: 1.4;
            white-space: normal;
        }

    .home_process_cards_wrapper,
    .home_process_step:last-child .home_process_cards_wrapper {
        width: 100%;
        justify-content: flex-start;
    }

    .home_process_cards,
    .home_process_step:last-child .home_process_cards {
        display: grid;
        grid-template-columns: 1fr;
        gap: 16px;
        width: 100%;
        margin: 0;
    }
    /* 04-ийн heading голдоно */
    .home_process_step:last-child .home_process_heading {
        justify-content: start;
    }
    .home_action_card {
        width: 100%;
        min-height: auto;
        padding: 22px 18px;
        border-radius: 14px;
    }

    .home_action_title {
        gap: 14px;
        margin-bottom: 14px;
    }

        .home_action_title .home_app_icon {
            width: 1.42rem;
            height: 1.42rem;
        }

        .home_action_title h3 {
            font-size: 1.1rem;
            line-height: 1.25;
        }

    .home_action_card p {
        font-size: 0.98rem;
        line-height: 1.5;
    }
}


.home_hero_section {
    position: relative;
    background: #fff;
    margin-top: 0;
}

.home_hero_title {
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #10428C;
    font-weight: 700;
    font-size: clamp(28px, 3vw, 48px);
    letter-spacing: 0.5px;
    text-align: center;
    white-space: nowrap;
}

/* Tablet */
@media (max-width: 991.98px) {
    .home_hero_title {
        top: 43%;
        font-size: 23px;
        padding: 0 20px;
        line-height: 1.3;
    }
}

/* Mobile */
@media (max-width: 767.98px) {
    .home_hero_title {
        top: 43%;
        font-size: 15px;
        padding: 0 16px;
        line-height: 1.3;
    }
}

.home_hero_art {
    height: clamp(250px, 31vw, 500px);
}

.home_hero_title {
    display: none;
}

.home_hero_skyline {
    margin-top: -32px;
}

@media (max-width: 1199.98px) {
    .home_hero_art {
        height: 300px;
    }

    .home_hero_skyline {
        margin-top: -24px;
    }
}

@media (max-width: 767.98px) {
    .home_hero_art {
        height: 210px;
    }

    .home_hero_skyline {
        margin-top: -18px;
    }

    .home_intro_copy {
        font-size: 0.96rem;
        line-height: 1.65;
    }
}

/* ================================
   Non Degree Page
   ================================ */
.non_degree_shell {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: #fff;
    color: #344052;
    font-size: 14px;
}

.non_degree_shell > .container-fluid {
    flex: 1 0 auto;
    width: 100%;
}

.non_degree_shell .site-footer {
    flex-shrink: 0;
}

.non_degree_container {
    
    margin: 0 auto;
    padding: 40px 48px 72px;
}

.non_degree_page {
    background: #fff;
}

.non_degree_hero {
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 160px;
    padding: 30px 0 34px;
    background: linear-gradient(180deg, #ffffff 0%, #f4f8fd 100%);
    border-bottom: 1px solid #e6ecf5;
}

.non_degree_hero_art {
    position: absolute;
    right: 28px;
    /* Gap scales with the hero height so the art never creeps up to the top edge on wide screens. */
    top: max(16px, 18%);
    bottom: 0;
    width: min(30%, 430px);
    background-image: url("../img/num-hero-building.svg");
    background-repeat: no-repeat;
    background-position: right bottom;
    background-size: contain;
    pointer-events: none;
}

.non_degree_hero_inner {
    position: relative;
    z-index: 1;
    padding: 0 48px;
}

.non_degree_hero_title {
    margin: 0 0 10px;
    color: #10428C;
    font-size: clamp(24px, 2.1vw, 32px);
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.2px;
}

.non_degree_hero_text {
    max-width: 620px;
    min-height: 3.3em;
    margin: 0;
    color: #5b6678;
    font-size: 14px;
    line-height: 1.65;
}

.non_degree_program_grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr));
    gap: 28px;
    align-items: stretch;
}

.non_degree_empty {
    grid-column: 1 / -1;
    margin: 0;
    padding: 20px;
    border: 1px dashed #d9dfeb;
    border-radius: 8px;
    color: #66707d;
}

.non_degree_program_card,
.non_degree_panel,
.non_degree_payment_panel {
    border: 1px solid #edf0f4;
    border-radius: 7px;
    background: #fff;
}

.non_degree_program_card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 342px;
    padding: 14px 10px 20px;
    box-shadow: 0 20px 38px rgba(15, 23, 42, 0.08);
}

.non_degree_credit_pill {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 34px;
    padding: 7px 14px;
    border-radius: 10px;
    color: #334155;
    background: #eef2fb;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.2;
    white-space: nowrap;
}

.non_degree_credit_pill .bi {
    color: var(--num-blue);
    font-size: 14px;
    line-height: 1;
}

.non_degree_credit_pill_dot {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #9aa7bd;
    flex: 0 0 auto;
}

.non_degree_credit_pill.is-empty {
    visibility: hidden;
}

.non_degree_program_card h2 {

    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    min-height: calc(1.35em * 2);
    margin: 42px 0 18px;
    color: #344052;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.non_degree_card_copy {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    overflow: hidden;
    min-height: 66px;
    margin: 0 0 14px;
    color: #344052;
    font-size: 14px;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.non_degree_date_list {
    display: grid;
    gap: 16px;
    margin-top: auto;
    margin-bottom: 28px;
}

.non_degree_date_row {
    display: grid;
    grid-template-columns: 16px 1fr;
    column-gap: 10px;
    color: #5f6b7a;
    margin-top:14px
}

.non_degree_date_row i {
    grid-row: span 2;
    color: #a4afbd;
    font-size: 14px;
}

.non_degree_date_row span {
    color: #8b95a3;
    line-height: 1.15;
}

.non_degree_date_row strong {
    color: #344052;
    font-weight: 500;
    line-height: 1.35;
}

.non_degree_primary_btn,
.non_degree_soft_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 24px;
    border: 0;
    border-radius: 9px;
    cursor: pointer;
    font-size: 14px;
    text-decoration: none;
}

.non_degree_primary_btn {
    color: #fff;
    background: #10428C;
}

.non_degree_primary_btn:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.non_degree_soft_btn {
    color: #58616B;
    border: 1px solid #DFE5EB;
    background: #DFE5EB;
}

.non_degree_program_card {
    margin-bottom: 8px;
}
.non_degree_card_actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    width: 100%;
    margin-top: auto;
    padding-top: 8px;
}

.non_degree_detail_link {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding: 0 12px;

    border: 0;
    background: transparent;
    color: #10428C;

    font-size: 13px;
    font-weight: 500;
    line-height: 1.2;

    text-decoration: underline;
    text-underline-offset: 3px;

    cursor: pointer;
}

.non_degree_detail_link:hover,
.non_degree_detail_link:focus-visible {
    color: #0b3572;
}

.non_degree_card_actions .non_degree_primary_btn {
    flex: 0 0 auto;

    width: 150px;
    min-width: 150px;
    height: 40px;
    min-height: 40px;

    padding: 0 20px;

    border: 0;
    border-radius: 5px;

    background: #10428C;
    color: #fff;

    font-size: 13px;
    line-height: 1;

    white-space: nowrap;
}

.non_degree_card_actions .non_degree_primary_btn:hover {
    background: #0d3674;
}
h2.program_title {
    font-size: 15px;
}

.non_degree_request_page {
    background: #f3f6fa;
}

.non_degree_request_top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 32px;
}

.non_degree_request_top h1 {
    margin: 0;
    color: #10428C;
    font-size: 22px;
    font-weight: 500;
}

.non_degree_request_top a {
    color: #a6afbc;
    font-size: 13px;
    text-decoration: none;
}

.non_degree_panel {
    margin-bottom: 28px;
    padding: 28px 28px 30px;
}

.non_degree_panel h2,
.non_degree_payment_panel h2 {
    margin: 0 0 26px;
    color: #202833;
    font-size: 16px;
    font-weight: 700;
}

.non_degree_form_grid {
    display: grid;
    grid-template-columns: 160px minmax(220px, 1fr) 160px minmax(220px, 1fr);
    gap: 26px 44px;
    align-items: center;
}

.non_degree_form_grid label {
    margin: 0;
    color: #202833;
    font-size: 13px; 
    font-weight: 400;
}

.non_degree_form_grid input {
    width: 100%;
    min-height: 40px;
    padding: 0 14px;
    border: 1px solid #d7dde6;
    border-radius: 7px;
    background: #fff;
    color: #202833;
    font-size: 13px;
}

.non_degree_form_grid input:disabled {
    background: #f0f0f0;
    color: #8a9099;
}

.non_degree_table_scroll {
    width: 100%;
    overflow-x: auto;
}

.non_degree_table {
    width: 100%;
    min-width: 760px;
    border-collapse: separate;
    border-spacing: 0;
    color: #4b5565;
    font-size: 13px;
}

.non_degree_table th {
    padding: 13px 16px;
    color: #66707d;
    background: #e5ebf2;
    font-weight: 500;
    text-align: left;
}

.non_degree_table td {
    padding: 13px 16px;
    border-bottom: 1px solid #dbe1e8;
    vertical-align: middle;
}



.non_degree_warning_pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid #FFEED1;
    border-radius: 12px;
    color: #FB9200;
    background: #FFEED1;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.non_degree_muted_pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 12px;
    border-radius: 12px;
    color: #7b8796;
    background: #eef2f6;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.non_degree_soft_btn:disabled {
    cursor: not-allowed;
    opacity: 0.62;
}

.non_degree_equivalent_pill {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    margin-left: 8px;
    padding: 0 9px;
    border-radius: 999px;
    color: #0b7a35;
    background: #e7f7ed;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.non_degree_empty_schedule {
    margin: 0;
    padding: 16px;
    border-radius: 8px;
    color: #66707d;
    background: #f3f6fa;
    font-size: 13px;
}

.non_degree_payment_panel {
    width: min(100%, 420px);
    padding: 28px;
}

.non_degree_qpay_box {
    display: grid;
    justify-items: center;
    gap: 12px;
    min-height: 72px;
    margin-bottom: 24px;
}

.non_degree_qpay_qr {
    width: min(100%, 320px);
    aspect-ratio: 1;
    object-fit: contain;
}

.non_degree_payment_loading {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #4b5565;
    font-size: 13px;
}

.non_degree_payment_loading p,
.non_degree_payment_message {
    margin: 0;
}

.non_degree_validation_message {
    min-height: 18px;
    margin: 14px 0 0;
    color: #b42318;
    font-size: 13px;
    font-weight: 600;
}

.non_degree_payment_message {
    color: #4b5565;
    font-size: 13px;
    text-align: center;
}

.non_degree_payment_message.is-error {
    color: #b42318;
}

.non_degree_qpay_link {
    color: #10428C;
    font-size: 13px;
    font-weight: 600;
}

.non_degree_payment_btn {
    width: 100%;
    margin-top: 14px;
}

.non_degree_payment_panel dl {
    display: grid;
    gap: 16px;
    margin: 0;
}

.non_degree_payment_panel dl div {
    display: flex;
    justify-content: space-between;
    gap: 16px;
}

.non_degree_payment_panel dt {
    color: #10428C;
    font-size: 13px;
    font-weight: 500;
}

.non_degree_payment_panel dd {
    margin: 0;
    color: #344052;
    font-size: 13px;
}

.non_degree_payment_panel dl div:last-child dd {
    color: #10428C;
    font-weight: 700;
}

.non_degree_request_actions,
.non_degree_modal_footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
}

.non_degree_modal {
    position: fixed;
    inset: 0;
    z-index: 1080;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.non_degree_modal.is-open {
    display: flex;
}

.non_degree_modal_backdrop {
    position: absolute;
    inset: 0;
    background: rgba(17, 24, 39, 0.32);
}

.non_degree_modal_window {
    position: relative;
    width: min(100%, 802px);
    max-height: calc(100vh - 48px);
    overflow: auto;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 24px 42px rgba(15, 23, 42, 0.18);
}

.non_degree_modal_window.is-schedule {
    width: min(100%, 620px);
}

.non_degree_modal_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 44px;
    padding: 0 10px;
    border-bottom: 1px solid #e2e7ee;
}

.non_degree_modal_header h2 {
    margin: 0;
    color: #213456;
    font-size: 15px;
    font-weight: 500;
}

.non_degree_modal_header button {
    border: 0;
    background: transparent;
    color: #4b5565;
    font-size: 18px;
}

.non_degree_detail_body {
    padding: 16px;
}

.non_degree_detail_body h3,
.non_degree_schedule_picker h3 {
    margin: 0 0 8px;
    color: #10428C;
    font-size: 16px;
    font-weight: 500;
}

.non_degree_detail_body p {
    margin: 0 0 18px;
    color: #344052;
    font-size: 16px;
    line-height: 1.45;
}

.non_degree_detail_grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 0 0 18px;
}

.non_degree_detail_grid dt {
    color: #10428C;
    font-size: 13px;
    font-weight: 500;
}

.non_degree_detail_grid dd {
    margin: 4px 0 0;
    color: #344052;
    font-size: 14px;
}

.non_degree_modal_footer {
    padding: 18px 16px 20px;
    border-top: 1px solid #e6ebf3;
}

.non_degree_response_icon {
    display: none;
}

.non_degree_modal.is-response .non_degree_modal_window {
    width: min(100%, 360px);
    padding: 20px;
    border-radius: 14px;
}

.non_degree_modal.is-response .non_degree_response_icon {
    display: grid;
    margin-right: auto;
    margin-left: auto;
}

.non_degree_modal.is-response.is-error-response .non_degree_response_icon {
    background: #fff1f2;
    color: #dc3545;
}

.non_degree_modal.is-response .non_degree_modal_header {
    justify-content: center;
    min-height: 0;
    padding: 0;
    border: 0;
}

.non_degree_modal.is-response .non_degree_modal_header h2 {
    margin: 0 0 7px;
    color: #2f3742;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.35;
}

.non_degree_modal.is-response .non_degree_modal_header button {
    display: none;
}

.non_degree_modal.is-response .non_degree_detail_body {
    padding: 0;
    text-align: center;
}

.non_degree_modal.is-response .non_degree_detail_body p {
    width: 100%;
    margin: 0 0 14px;
    color: #2f3742;
    font-size: 14px;
    line-height: 1.5;
    text-align: left;
}

.non_degree_modal.is-response .non_degree_modal_footer {
    display: block;
    padding: 0;
    border: 0;
}

.non_degree_modal.is-response [data-non-degree-confirm-accept] {
    width: 100%;
    min-height: 35px;
    border: 0;
    border-radius: 7px;
    background: #c8cdd1;
    color: #fff;
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
}

.non_degree_schedule_picker {
    display: grid;
    gap: 8px;
    padding: 16px;
}

.non_degree_schedule_picker label {
    display: grid;
    grid-template-columns: auto 1fr 1fr 1.4fr;
    align-items: center;
    gap: 12px;
    min-height: 50px;
    padding: 0 12px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: #eef2f6;
    font-size: 14px;
}

.non_degree_schedule_picker label.is-selected {
    border-color: #0d6efd;
    background: #e4ebff;
}

.non_degree_schedule_picker label.is-conflict {
    border-color: #f2d38a;
    background: #fff4d8;
}

.non_degree_schedule_alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 16px 16px 0;
    padding: 12px 14px;
    border-radius: 12px;
    background: #fff4d8;
    color: #5f4f2d;
    font-size: 14px;
    line-height: 1.45;
}

.non_degree_schedule_alert[hidden] {
    display: none;
}

.non_degree_schedule_alert i {
    font-size: 15px;
    line-height: 1.4;
}

.non_degree_schedule_alert strong {
    display: block;
    margin-bottom: 2px;
    font-weight: 600;
}

.non_degree_schedule_conflict_note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: -2px 0 2px;
    padding: 0 12px;
    color: #8a6d3b;
    font-size: 12px;
    line-height: 1.4;
}

@media (max-width: 1320px) {
    .non_degree_program_grid {
        grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
        gap: 24px;
    }
}

@media (max-width: 991.98px) {
    .non_degree_container {
        padding: 28px 20px 56px;
    }

    .non_degree_hero {
        min-height: 150px;
        padding: 26px 0 30px;
    }

    .non_degree_hero_inner {
        padding: 0 20px;
    }

    .non_degree_hero_art {
        right: 20px;
        width: 34%;
    }

    .non_degree_program_grid {
        grid-template-columns: repeat(auto-fill, minmax(min(272px, 100%), 1fr));
        gap: 20px;
    }

    .non_degree_form_grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .non_degree_request_top {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 640px) {
    .non_degree_container {
        padding: 22px 14px 42px;
    }

    .non_degree_hero {
        min-height: 150px;
        padding: 22px 0 26px;
    }

    .non_degree_hero_inner {
        padding: 0 14px;
    }

    .non_degree_hero_title {
        font-size: 20px;
    }

    .non_degree_hero_text {
        font-size: 13px;
    }

    .non_degree_hero_art {
        right: 12px;
        width: 34%;
        opacity: .6;
    }

    .non_degree_program_grid {
        grid-template-columns: 1fr;
    }

    .non_degree_program_card {
        min-height: 0;
        padding: 14px;
    }

    .non_degree_detail_grid {
        grid-template-columns: 1fr;
    }

    .non_degree_program_card h2 {
        margin-top: 24px;
    }

    .non_degree_primary_btn,
    .non_degree_soft_btn {
        width: 100%;
    }

    /* Card action row keeps the link + button side by side like the design. */
    .non_degree_card_actions .non_degree_primary_btn {
        width: auto;
    }

    .non_degree_panel,
    .non_degree_payment_panel {
        padding: 20px 16px;
    }

    .non_degree_schedule_picker label {
        grid-template-columns: auto 1fr;
        align-items: start;
        padding: 12px;
    }

    .non_degree_modal_footer,
    .non_degree_request_actions {
        align-items: stretch;
        flex-direction: column;
    }
}

/* ================================
   Rules Page
   ================================ */
.rules_shell {
    min-height: 100vh;
    background: #f4f8fd;
}

.rules_page {
    padding: 18px 20px 30px;
    background: #f4f8fd;
}

.rules_workspace {
    width: 100%;
    border: 1px solid #e6edf7;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 10px 30px rgba(15, 50, 98, .05);
}

.rules_icon_btn,
.rules_action_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 34px;
    border: 1px solid #dce5f1;
    border-radius: 6px;
    background: #fff;
    color: #334155;
    text-decoration: none;
}

.rules_icon_btn {
    width: 34px;
    padding: 0;
}

.rules_workspace {
    position: relative;
    display: grid;
    grid-template-columns: 386px minmax(0, 1fr);
    min-height: calc(100vh - 104px);
    padding: 0;
    overflow: hidden;
}

.rules_sidebar {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 24px 16px 24px 18px;
    border-right: 1px solid #d7e4f4;
    background: #fff;
}

.rules_sidebar h2 {
    margin: 0 0 16px 8px;
    color: #1f2937;
    font-size: 14px;
    font-weight: 700;
}

.rules_document_list {
    display: grid;
    gap: 8px;
}

.rules_document_card {
    position: relative;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 92px;
    padding: 12px 12px 12px 16px;
    border-radius: 6px;
    color: #1f2937;
    text-decoration: none;
    transition: background-color .18s ease, color .18s ease;
}

.rules_document_card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    background: transparent;
}

.rules_document_card:hover,
.rules_document_card.is-active {
    background: #eef5ff;
    color: #10428C;
}

.rules_document_card.is-active::before {
    background: #0b66e4;
}

.rules_pdf_icon {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    justify-self: center;
    width: 38px;
    height: 48px;
    border: 1px solid #f2d2d2;
    border-radius: 6px;
    background: #fff;
    color: #ff3b30;
    font-size: 20px;
    line-height: 1;
}

.rules_pdf_icon span {
    display: inline-flex;
    margin-top: 2px;
    padding: 1px 4px;
    border-radius: 3px;
    background: #ff3b30;
    color: #fff;
    font-size: 8px;
    font-weight: 700;
    line-height: 1.1;
}

.rules_document_body {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.rules_document_title {
    display: block;
    color: inherit;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
}

.rules_document_number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    margin-right: 7px;
    border-radius: 50%;
    background: #0b66e4;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    vertical-align: 1px;
}

.rules_document_meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    color: #697386;
    font-size: 11px;
    font-weight: 500;
}

.rules_document_meta span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.rules_note {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 10px;
    margin-top: auto;
    padding: 16px;
    border: 1px solid #d8e7ff;
    border-radius: 6px;
    background: #f0f6ff;
    color: #0b66e4;
}

.rules_note p {
    margin: 0;
    color: #175cd3;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.5;
}

.rules_note a {
    color: inherit;
    font-weight: inherit;
}

.rules_divider {
    position: absolute;
    top: 50%;
    left: 386px;
    z-index: 2;
    transform: translate(-50%, -50%);
}

.rules_divider span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid #d9e7fb;
    border-radius: 50%;
    background: #fff;
    color: #0b66e4;
    font-size: 13px;
    box-shadow: 0 6px 18px rgba(16, 66, 140, .08);
}

.rules_viewer_panel {
    min-width: 0;
    padding: 24px 18px 18px 26px;
    background: #fff;
}

.rules_viewer_top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 16px;
}

.rules_viewer_top h2 {
    margin: 0;
    color: #1f2937;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
}

.rules_viewer_actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
}

.rules_action_btn {
    gap: 8px;
    min-width: 76px;
    padding: 0 12px;
    font-size: 12px;
    font-weight: 600;
}

.rules_action_btn:hover,
.rules_icon_btn:hover {
    border-color: #b9c9df;
    background: #f8fbff;
    color: #10428C;
}

.rules_pdf_frame {
    overflow: hidden;
    border: 1px solid #dde5ef;
    border-radius: 8px;
    background: #f8fafc;
}

.rules_pdf_frame iframe {
    display: block;
    width: 100%;
    min-height: calc(100vh - 194px);
    border: 0;
    background: #fff;
}

@media (max-width: 1199.98px) {
    .rules_workspace {
        grid-template-columns: 330px minmax(0, 1fr);
    }

    .rules_divider {
        left: 330px;
    }

    .rules_viewer_panel {
        padding: 22px 16px 16px 24px;
    }

}

@media (max-width: 767.98px) {
    .rules_page {
        padding: 12px 10px 24px;
    }

    .rules_workspace {
        display: flex;
        flex-direction: column;
    }

    .rules_sidebar {
        border-right: 0;
        border-bottom: 1px solid #d7e4f4;
        padding: 18px 12px;
    }

    .rules_divider {
        display: none;
    }

    .rules_viewer_panel {
        padding: 18px 12px 12px;
    }

    .rules_viewer_top {
        align-items: flex-start;
        flex-direction: column;
    }

    .rules_viewer_actions {
        width: 100%;
        justify-content: flex-start;
    }

    .rules_pdf_frame iframe {
        min-height: 640px;
    }
}

/* ================================
   Transfer Page
   ================================ */
.transfer_request_page {
    padding: 24px 28px 40px;
    background: #fff;
}

.transfer_request_shell {
    max-width: 1260px;
    margin: 0 auto;
}

.transfer_request_topbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 24px;
}

.transfer_request_back {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    color: #c3c8d0;
    font-size: 15px;
    text-decoration: none;
}

.transfer_request_back i {
    font-size: 18px;
    line-height: 1;
}

.transfer_request_title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    margin: 0 0 34px;
    color: #10428C;
    font-size: 20px;
    font-weight: 400;
}

.transfer_request_title strong,
.transfer_request_title b {
    font-weight: 700;
}

.transfer_stepper {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    align-items: start;
    width: min(100%, 1120px);
    overflow: visible;
    margin: 0 auto 38px;
}

.admission_request_page :is(.transfer_stepper_five, .transfer_stepper_six),
.transfer_request_consent_page :is(.transfer_stepper_five, .transfer_stepper_six) {
    width: 100%;
}

@media (min-width: 992px) {
    .admission_request_page .transfer_step,
    .transfer_request_consent_page .transfer_step {
        justify-items: center;
    }

    .admission_request_page .transfer_step_marker,
    .transfer_request_consent_page .transfer_step_marker {
        position: relative;
        justify-content: center;
        width: 100%;
    }

    .admission_request_page .transfer_step_line,
    .transfer_request_consent_page .transfer_step_line {
        position: absolute;
        top: 50%;
        left: calc(50% + 36px);
        width: calc(100% - 72px);
        margin: 0;
        transform: translateY(-50%);
    }

    .admission_request_page .transfer_step_label,
    .transfer_request_consent_page .transfer_step_label {
        justify-self: center;
        margin-left: 0;
        transform: none;
    }
}

.transfer_step {
    display: grid;
    grid-template-rows: 58px auto;
    min-width: 0;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: inherit;
}

.transfer_step:disabled {
    opacity: 1;
}

.transfer_step.is-clickable {
    cursor: pointer;
}

.transfer_step.is-clickable:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 4px;
    border-radius: 8px;
}

.transfer_num_student_notice {
    font-size: 14px;
}

.transfer_step_marker {
    display: flex;
    align-items: center;
    min-width: 0;
}

.transfer_step_icon {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    flex: 0 0 54px;
    border: 2px solid #b9c2d1;
    border-radius: 999px;
    color: #3b4658;
    font-size: 24px;
    background: #fff;
    box-shadow: 0 1px 5px rgba(22, 42, 72, 0.08);
}

.transfer_step_line {
    flex: 1;
    height: 0;
    margin: 0 18px;
    border-top: 2px dashed #cfd6e2;
}

.transfer_step_label {
    width: 180px;
    max-width: 180px;
    margin-top: 10px;
    margin-left: 27px;
    transform: translateX(-50%);
    color: #1d2737;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.28;
    text-align: center;
    white-space: normal;
}

.transfer_step.is-complete .transfer_step_icon {
    border-color: #2fab50;
    color: #fff;
    background: #2fab50;
}

.transfer_step.is-active .transfer_step_icon {
    border-color: #b9c8ff;
    color: #2563eb;
    background: #eef3ff;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12);
}

.transfer_step.is-active .transfer_step_label {
    color: #2563eb;
}

.transfer_step_line.is-complete {
    border-top-style: solid;
    border-top-color: #2fab50;
}

.transfer_step_line.is-active {
    border-top-style: solid;
    border-top-color: #2563eb;
}

.transfer_step_panel {
    min-height: 520px;
}

.transfer_step_panel h2 {
    margin: 0 0 22px;
    color: #263146;
    font-size: 16px;
 
    font-weight: 700;
}

.transfer_panel_head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

.transfer_panel_head_actions {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}

.transfer_form_grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 28px 80px;
}

.transfer_field {
    display: grid;
    gap: 10px;
    min-width: 0;
}

.transfer_form_grid .invalid-feedback {
    display: block;
    min-height: 18px;
    margin-top: 0;
    visibility: hidden;
}

.transfer_form_grid .transfer_input.is-invalid ~ .invalid-feedback,
.transfer_form_grid select.transfer_input.is-invalid ~ .invalid-feedback {
    visibility: visible;
}

.transfer_field label {
    color: #2d3542;
    font-size: 14px;

}

.transfer_input {
    width: 100%;
    box-sizing: border-box;
    display: block;
    min-height: 44px;
    height: 44px;
    padding: 0 14px;
    border: 1px solid #d7deea;
    border-radius: 10px;
    background: #fff;
    color: #2f3742;
    font-size: 14px;
}

select.transfer_input,
select.transfer_input.is-invalid {
    appearance: none;
    padding-right: 42px;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23234a95' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 14px 14px;
}

.transfer_input.is-invalid {
    width: 100%;
    box-sizing: border-box;
    min-height: 44px;
    height: 44px;
    border-color: #dc3545;
    padding-right: 42px;
    background-image: none;
}

select.transfer_input.is-invalid {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23234a95' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

.transfer_input[type="date"]::-webkit-calendar-picker-indicator {
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.transfer_input:disabled {
    background: #f3f5f8;
    color: #959eab;
}

.transfer_table_scroll {
    overflow: auto;
}

.transfer_table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
}

.transfer_table th,
.transfer_table td {
    padding: 14px 10px;
    border: 1px solid #dbe2ec;
    background: #fff;
    color: #485261;
    font-size: 14px;
    vertical-align: top;
}

.transfer_table td.transfer_status_cell {
    vertical-align: middle;
}

.transfer_table th {
    color: #273248;
    font-weight: 700;
    text-align: center;
    background: #fff;
}

.transfer_requirement_group_row td {
    color: #273248;
    font-weight: 700;
    background: #fff;
}

.transfer_required_mark {
    color: #ef4444;
    font-weight: 700;
    margin-left: 4px;
}

.transfer_link_btn,
.transfer_inline_link,
.transfer_icon_link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 0;
    background: transparent;
    color: #10428C;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}

.transfer_link_btn.is-inline {
    font-size: 13px;
}

.transfer_row_actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.transfer_chip_btn,
.transfer_primary_btn {
    border: 0;
    border-radius: 8px;
    min-height: 35px;
    padding: 0 20px;
    font-size: 14px;
    font-weight: 400;
}

.transfer_chip_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #d8dee7;
    color: #5f6775;
    cursor: pointer;
}

.transfer_chip_btn.is-primary,
.transfer_primary_btn {
    background: #10428C;
    color: #fff;
}

.transfer_chip_btn:disabled {
    background: #d8dee7;
    color: #5f6775;
    cursor: not-allowed;
}

.transfer_action_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    min-width: 22px;
    height: 35px;
    min-height: 22px;
    border: 0;
    border-radius: 8px;
    padding: 0;
    color: #fff;
    font-size: 15px;
    font-weight: 400;
    line-height: 1;
    cursor: pointer;
}

.transfer_primary_btn.is-danger {
    background: #dc3545;
    color: #fff;
}

.transfer_request_empty_state {
    min-height: 190px;
    align-content: center;
    gap: 12px;
}

.transfer_request_empty_state .transfer_primary_btn {
    margin-top: 4px;
}

.transfer_action_btn.is-edit {
    background: #f4b400;
}

.transfer_action_btn.is-delete {
    background: #dc3545;
}

.transfer_action_btn:disabled {
    background: #d8dee7;
    color: #fff;
    cursor: not-allowed;
}

.transfer_status_pill {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 7px;
    min-height: 18px;
    border-radius: 0;
    padding: 0;
    background: transparent;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
    color: #475467;
}

.transfer_status_pill::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex: 0 0 auto;
    background: currentColor;
}

.transfer_status_pill.is-success {
    background: transparent;
    color: #198754;
}

.transfer_program_paid_status {
    margin-top: 6px;
}

.transfer_status_pill.is-warning {
    background: transparent;
    color: #f0ad00;
}

.transfer_status_pill.is-danger {
    background: transparent;
    color: #dc3545;
}

.transfer_status_pill.transfer_education_status {
    min-height: auto;
    border-radius: 0;
    padding: 0;
    background: transparent;
}

.transfer_status_pill.transfer_education_status.is-success {
    background: transparent;
    color: #16894a;
}

.transfer_status_pill.transfer_education_status.is-warning {
    background: transparent;
    color: #d69200;
}

.transfer_status_pill.transfer_education_status.is-danger {
    background: transparent;
    color: #dc3545;
}

.transfer_status_pill.transfer_education_status.is-muted {
    background: transparent;
    color: #6b7280;
}

.transfer_payment_result {
    margin: 16px 0 4px;
    padding: 12px;
    border-radius: 8px;
    background: #f8fafc;
    color: #273248;
    text-align: left;
}

.transfer_payment_result p {
    margin: 0 0 10px;
    font-weight: 700;
}

.transfer_payment_result.is-success {
    background: #ecfdf5;
    color: #166534;
}

.transfer_payment_result.is-error {
    background: #fef2f2;
    color: #b91c1c;
}

.transfer_payment_loading {
    display: grid;
    justify-items: center;
    gap: 12px;
    padding: 36px 0;
    color: #10428C;
}

.transfer_payment_loading p,
.transfer_confirm_text {
    margin: 0;
}

.transfer_qpay_link {
    display: inline-flex;
    margin-top: 10px;
    color: #10428C;
    font-size: 14px;
    font-weight: 600;
}

.transfer_primary_btn:not(.is-light):disabled,
.transfer_primary_btn.is-disabled {
    background: #10428C;
    color: #fff;
    cursor: not-allowed;
    box-shadow: none;
    opacity: .45;
}

.transfer_primary_btn.is-light:disabled {
    background: #d8dee7;
    color: #fff;
    cursor: not-allowed;
    box-shadow: none;
    opacity: .75;
}

.transfer_primary_btn.is-light {
    background: #BEC3C7;
    color: #fff;
}

.transfer_file_cell {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 190px;
}

.transfer_file_input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.transfer_file_preview_btn {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    min-width: 126px;
    max-width: 220px;
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid #c9daf4;
    border-radius: 8px;
    background: #f4f8ff;
    color: #10428C;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.transfer_file_preview_btn i {
    flex: 0 0 auto;
    color: #1d5fbf;
    font-size: 16px;
}

.transfer_file_preview_btn span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.transfer_file_preview_btn:hover:not(:disabled),
.transfer_file_preview_btn:focus-visible:not(:disabled) {
    border-color: #10428C;
    background: #eaf2ff;
    color: #0b3470;
    box-shadow: 0 3px 10px rgba(16, 66, 140, .12);
}

.transfer_file_preview_btn.is-empty,
.transfer_file_preview_btn:disabled {
    border-color: #dbe2ec;
    background: #f8fafc;
    color: #8a95a5;
    cursor: default;
    box-shadow: none;
}

.transfer_file_preview_btn.is-empty i,
.transfer_file_preview_btn:disabled i {
    color: #98a2b3;
}

.transfer_file_upload_btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border: 1px solid #d8e3f2;
    border-radius: 8px;
    background: #fff;
    color: #10428C;
    font-size: 17px;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.transfer_file_upload_btn:hover,
.transfer_file_upload_btn:focus-visible {
    border-color: #10428C;
    background: #10428C;
    color: #fff;
    box-shadow: 0 5px 14px rgba(16, 66, 140, .18);
    transform: translateY(-1px);
}

.transfer_file_upload_btn.has-file {
    border-color: #d5eadf;
    background: #effaf4;
    color: #16894a;
}

.transfer_file_upload_btn.has-file:hover,
.transfer_file_upload_btn.has-file:focus-visible {
    border-color: #16894a;
    background: #16894a;
    color: #fff;
}

.transfer_icon_link {
    font-size: 20px;
}

.transfer_muted_text {
    color: #98a2b3;
    font-size: 13px;
}

.transfer_paid_note {
    display: inline-flex;
    margin-top: 6px;
    border-radius: 999px;
    padding: 3px 9px;
    background: #dcfce7;
    color: #166534;
    font-size: 12px;
    font-weight: 700;
}

.transfer_money {
    white-space: nowrap;
}

.transfer_step_actions {
    display: flex;
    justify-content: flex-end;
    gap: 14px;
    margin-top: 26px;
}

.transfer_summary_table {
    min-width: 0;
    margin-bottom: 10px;
}

.transfer_summary_table th,
.transfer_summary_table td {
    padding: 14px 10px;
    border: 0;
    border-bottom: 1px solid #e2e7ee;
    font-size: 14px;
}

.transfer_summary_table thead th {
    border-bottom-color: #10428C;
}

.transfer_summary_list {
    display: grid;
    gap: 14px;
    margin: 14px 0 24px;
}

.transfer_summary_list div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    width: 100%;
    color: #273248;
    font-size: 16px;
}

.transfer_summary_list strong {
    text-align: right;
    font-weight: 400;
}

.transfer_summary_list .is-primary strong {
    color: #10428C;
    font-size: 16px;
    font-weight: 700;
}

.transfer_summary_list .is-primary span {
    color: #10428C;
    font-weight: 700;
}

.transfer_summary_program_meta {
    margin-top: 4px;
    color: #7f8c8d;
    font-size: 13px;
}

.transfer_warning_box {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    border-radius: 14px;
    background: #fff0c8;
    color: #3d3424;
    line-height: 1.5;
}

.transfer_warning_box i {
    color: #ff9800;
    font-size: 24px;
}

.transfer_warning_box p {
    margin: 0;
    font-weight: 400;
}

.transfer_modal_overlay {
    position: fixed;
    inset: 0;
    z-index: 1095;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.transfer_modal_backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
}

.transfer_modal_window {
    position: relative;
    display: flex;
    flex-direction: column;
    width: min(100%, 540px);
    max-height: calc(100vh - 40px);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 24px 48px rgba(15, 23, 42, 0.18);
    overflow: hidden;
}

.transfer_modal_window.is-medium {
    width: min(100%, 520px);
}

.transfer_modal_window.is-large {
    width: min(100%, 980px);
}

.transfer_modal_window.is-xlarge {
    width: min(calc(100vw - 48px), 1480px);
}

.transfer_modal_window.is-compact {
    width: min(100%, 380px);
}

.transfer_modal_window.is-qpay {
    width: min(calc(100vw - 32px), 780px);
}

.transfer_modal_window.is-compact .transfer_payment_result {
    overflow: hidden;
}

.transfer_modal_window.is-compact .transfer_summary_list {
    justify-items: stretch;
}

.transfer_modal_window.is-compact .transfer_summary_list div {
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100%;
    gap: 12px;
}

.transfer_modal_window.is-compact .transfer_summary_list .is-primary strong {
    font-size: clamp(22px, 6vw, 26px);
}

.transfer_modal_header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 14px 20px;
    border-bottom: 1px solid #e5ebf3;
}

.transfer_modal_header h3 {
    margin: 0;
    color: #213456;
    font-size: 18px;
    font-weight: 500;
}

.transfer_close_btn {
    border: 0;
    background: transparent;
    color: #5d6775;
    font-size: 20px;
}

.transfer_modal_body {
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 20px;
}

.transfer_modal_form {
    display: grid;
    gap: 12px;
    margin-bottom: 18px;
}

.transfer_modal_form .transfer_input.is-invalid + .invalid-feedback {
    display: block;
    margin-top: -6px;
}

.transfer_inline_grid,
.transfer_program_filters {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.transfer_modal_form .transfer_field_error {
    margin-top: -6px;
    color: #dc3545;
    font-size: 12px;
    line-height: 1.4;
}

.transfer_inline_field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.transfer_modal_form .transfer_inline_field .transfer_field_error {
    margin-top: 0;
}

.transfer_modal_footer {
    flex-shrink: 0;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 18px;
}

.transfer_qpay_modal_body {
    display: grid;
    justify-items: center;
    padding: 18px 28px 16px;
}

.transfer_qpay_amount {
    display: grid;
    gap: 3px;
    margin-bottom: 12px;
}

.transfer_qpay_amount span {
    color: #98a2b3;
    font-size: 14px;
}

.transfer_qpay_amount strong {
    color: #213456;
    font-size: 17px;
    font-weight: 700;
}

.transfer_qr_frame {
    width: min(100%, 320px);
    padding: 14px;
    border: 1px solid #dfe5ee;
    border-radius: 12px;
    background: #fff;
}

.transfer_qr_frame .transfer_qr_image {
    width: 100%;
    border-radius: 0;
}

.transfer_qpay_instruction {
    margin: 12px 0 0;
    color: #8b95a5;
    font-size: 13px;
}

.transfer_qpay_waiting {
    margin: 14px 0 0;
    color: #526071;
    font-size: 14px;
    font-weight: 500;
}

.transfer_qpay_modal_body .transfer_payment_result {
    width: min(100%, 520px);
    margin-bottom: 0;
    text-align: center;
}

.transfer_qpay_footer {
    justify-self: stretch;
    justify-content: flex-end;
    width: 100%;
    padding-top: 14px;
    border-top: 1px solid #eef1f5;
}

.transfer_modal_window.is-xlarge .transfer_modal_body {
    display: flex;
    flex-direction: column;
}

.transfer_modal_window.is-xlarge .transfer_table_scroll {
    max-height: min(58vh, 560px);
    border: 1px solid #dbe2ec;
}

.transfer_modal_window.is-xlarge .transfer_program_filters + .transfer_table_scroll {
    margin-top: 24px;
}

.transfer_modal_window.is-xlarge .transfer_table {
    min-width: 860px;
}

.transfer_modal_window.is-xlarge .transfer_table th,
.transfer_modal_window.is-xlarge .transfer_table td {
    padding: 14px 14px;
}

.transfer_modal_window.is-xlarge .transfer_table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
}

.transfer_document_view {
    width: 100%;
}

.transfer_document_view.is-image {
    padding: 12px;
    border: 1px solid #e4e9f2;
    border-radius: 14px;
    overflow: auto;
}

.transfer_document_view.is-image img {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: 70vh;
    height: auto;
    margin: 0 auto;
    object-fit: contain;
}

.transfer_qr_image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 10px;
}

.transfer_document_view.is-pdf {
    display: block;
}

.transfer_document_view.is-pdf iframe {
    display: block;
    width: 100%;
    height: min(78vh, 760px);
    min-height: 620px;
    border: 1px solid #dbe2ec;
    border-radius: 10px;
}

.transfer_status_body {
    display: grid;
    justify-items: center;
    gap: 14px;
    padding: 28px 24px;
    text-align: center;
}

@media (max-width: 991.98px) {
    .transfer_request_page {
        padding: 16px 14px 28px;
        overflow-x: hidden;
    }

    .transfer_stepper {
        display: flex;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 10px;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
    }

    .transfer_step {
        flex: 0 0 148px;
        scroll-snap-align: start;
    }

    .transfer_step_line {
        margin: 0 10px;
    }

    .transfer_form_grid,
    .transfer_program_filters {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .auth_account_modal_window.is-student-become {
        width: calc(100vw - 16px);
        height: calc(100dvh - 16px);
        max-height: calc(100dvh - 16px);
        border-radius: 10px;
    }

    .auth_account_modal_window.is-student-become .auth_account_modal_header {
        padding: 12px 14px;
    }

    .auth_account_modal_window.is-student-become .auth_account_modal_header h3 {
        font-size: 16px;
    }

    .auth_account_student_become_back_btn {
        height: 30px;
        padding: 0 10px;
        font-size: 12px;
    }

    .transfer_request_topbar {
        justify-content: flex-start;
        margin-bottom: 18px;
    }

    .transfer_request_title {
        font-size: 18px;
        line-height: 1.35;
        margin-bottom: 24px;
    }

    .transfer_stepper {
        display: flex;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 10px;
    }

    .transfer_step {
        flex: 0 0 132px;
        min-width: 0;
    }

    .transfer_step_icon {
        width: 44px;
        height: 44px;
        flex-basis: 44px;
        font-size: 20px;
    }

    .transfer_step_label {
        width: 136px;
        max-width: 136px;
        margin-left: 22px;
        font-size: 13px;
    }

    .transfer_step_panel {
        min-height: auto;
    }

    .transfer_step_actions {
        flex-direction: column;
    }

    .transfer_primary_btn {
        width: 100%;
    }

    .transfer_summary_list {
        justify-items: stretch;
    }

    .transfer_summary_list div {
        grid-template-columns: 1fr auto;
    }

    .transfer_warning_box {
        grid-template-columns: 1fr;
    }

    .transfer_modal_overlay {
        align-items: flex-start;
        padding: 78px 12px 18px;
    }

    .transfer_modal_window {
        max-height: calc(100vh - 96px);
    }

    .transfer_modal_body,
    .transfer_modal_header {
        padding-left: 16px;
        padding-right: 16px;
    }

    .transfer_table {
        min-width: 760px;
    }

    .transfer_modal_window.is-xlarge .transfer_table_scroll {
        max-height: 52vh;
    }
}

@media (max-width: 1199.98px) {
    .auth_account_modal_window.is-student-become {
        width: calc(100vw - 28px);
        height: calc(100dvh - 28px);
        max-height: calc(100dvh - 28px);
    }

    .admission_request_student_become_modal_body .admission_request_student_become_page {
        padding: 20px 20px 16px;
    }

    .admission_request_student_become_modal_body :is(.transfer_stepper_three, .transfer_stepper_two),
    .admission_request_student_become_modal_body .admission_request_student_step_panel {
        width: min(100%, 980px);
    }

    .admission_request_student_become_modal_body :is(.transfer_stepper_three, .transfer_stepper_two) {
        padding: 0 36px;
    }
}

@media (max-width: 991.98px) {
    .admission_request_student_become_modal_body :is(.transfer_stepper_three, .transfer_stepper_two) {
        padding: 0 18px;
    }

    .admission_request_student_become_modal_body .admission_request_consent_list {
        grid-template-columns: 1fr;
        gap: 4px;
    }
}

@media (max-width: 767.98px) {
    .auth_account_modal_overlay.is-student-become {
        align-items: stretch;
        padding: 0;
    }

    .auth_account_modal_window.is-student-become {
        width: 100vw;
        height: 100%;
        max-height: 100%;
        border-radius: 0;
    }

    body.admission_request_student_become_modal_body {
        position: fixed;
        inset: 0;
        width: 100%;
        height: auto;
        min-height: 0;
        overflow: hidden;
    }

    body.admission_request_student_become_modal_body > .container-fluid,
    body.admission_request_student_become_modal_body > .container-fluid > main {
        height: 100%;
        min-height: 0;
    }

    .admission_request_student_become_modal_body .admission_request_student_become_layout,
    .admission_request_student_become_modal_body .admission_request_student_become_main {
        height: auto;
        min-height: 100%;
    }

    body.admission_request_student_become_modal_body #student-become-app {
        position: relative;
        height: 100%;
        min-height: 0;
    }

    .admission_request_student_become_modal_body .admission_request_student_become_shell {
        position: absolute;
        inset: 0 0 calc(64px + env(safe-area-inset-bottom));
        height: auto;
        min-height: 0;
        padding: 16px 14px 24px;
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        touch-action: pan-y;
        -webkit-overflow-scrolling: touch;
    }

    .admission_request_student_become_modal_body .admission_request_student_become_page {
        height: 100%;
        min-height: 0;
        padding: 0;
        overflow: hidden;
        overscroll-behavior: contain;
    }

    .admission_request_student_become_modal_body :is(.transfer_stepper_three, .transfer_stepper_two) {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
        overflow: visible;
        padding: 0;
        margin: 6px auto 18px;
    }

    .admission_request_student_become_modal_body .transfer_stepper_two {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admission_request_student_become_modal_body .transfer_step {
        flex: initial;
        min-width: 0;
    }

    .admission_request_student_become_modal_body .transfer_step_line {
        left: calc(50% + 28px);
        width: calc(100% - 56px);
        margin: 0;
    }

    .admission_request_student_become_modal_body .transfer_step_icon {
        width: 42px;
        height: 42px;
        flex-basis: 42px;
        font-size: 18px;
    }

    .admission_request_student_become_modal_body .transfer_step_label {
        width: auto;
        max-width: 104px;
        font-size: 12px;
        line-height: 1.25;
    }

    .admission_request_student_become_modal_body .admission_request_consent_copy {
        font-size: 13px;
    }

    .admission_request_student_become_modal_body .admission_request_student_form_grid,
    .admission_request_student_become_modal_body .admission_request_student_inline_grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .admission_request_student_become_modal_body .admission_request_student_personal_section {
        padding: 0 16px 18px;
        border-radius: 12px;
    }

    .admission_request_student_become_modal_body .admission_request_student_section_header {
        align-items: flex-start;
        margin: 0 -16px 18px;
        padding: 16px;
    }

    .admission_request_student_become_modal_body .admission_request_student_section_header.is-compact {
        min-height: 56px;
        margin-bottom: 18px;
        padding-block: 16px;
    }

    .admission_request_student_become_modal_body .admission_request_student_section_icon {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
    }

    .admission_request_student_become_modal_body .admission_request_student_personal_grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .admission_request_student_become_modal_body .admission_request_student_become_page.is-step-2 .admission_request_student_step_panel {
        padding-bottom: 0;
    }

    .admission_request_student_become_modal_body .admission_request_student_become_page.is-step-1 .admission_request_student_step_panel {
        flex: 0 0 auto;
    }

    .admission_request_student_scroll_clearance {
        height: calc(128px + env(safe-area-inset-bottom));
        flex-basis: calc(128px + env(safe-area-inset-bottom));
    }

    .admission_request_student_become_modal_body .admission_request_student_become_actions {
        position: fixed !important;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1000;
        flex-direction: row;
        align-items: flex-end;
        width: 100%;
        min-height: 64px;
        margin: 0;
        padding: 10px 14px calc(12px + env(safe-area-inset-bottom)) !important;
        border-top: 1px solid #e8edf5;
        background: #fff;
        box-shadow: 0 -10px 18px rgba(255, 255, 255, .92);
        transform: none;
    }

    .admission_request_student_become_modal_body .admission_request_student_become_page.is-step-1 .admission_request_student_become_actions,
    .admission_request_student_become_modal_body .admission_request_student_become_page.is-step-2 .admission_request_student_become_actions,
    .admission_request_student_become_modal_body .admission_request_student_become_page.is-step-3 .admission_request_student_become_actions {
        padding-top: 10px;
    }

    .admission_request_student_action_stack {
        width: 100%;
        justify-items: stretch;
    }

    .admission_request_student_action_row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .admission_request_student_action_row.is-single {
        grid-template-columns: 1fr;
        width: calc((100% - 10px) / 2);
        margin-left: auto;
    }

    .admission_request_student_action_message {
        text-align: left;
    }

    .admission_request_student_become_modal_body .transfer_primary_btn {
        width: 100%;
    }
}

@media (max-width: 479.98px) {
    .admission_request_student_become_modal_body :is(.transfer_stepper_three, .transfer_stepper_two) {
        gap: 4px;
    }

    .admission_request_student_become_modal_body .transfer_step_label {
        max-width: 88px;
        font-size: 11px;
    }

    .admission_request_student_become_modal_body .transfer_step_icon {
        width: 36px;
        height: 36px;
        flex-basis: 36px;
        font-size: 16px;
    }

    .admission_request_student_become_modal_body .transfer_step_line {
        left: calc(50% + 24px);
        width: calc(100% - 48px);
    }
}