@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap");

/* VGIK interface theme 116.22
   Palette derived from the current vgik.info visual system.
   Loaded after legacy, browser, design and module styles so the old
   interface remains functional while receiving one coherent skin. */

:root {
    --vgik-navy: #040D3A;
    --vgik-blue-dark: #1E6AAE;
    --vgik-blue: #61ADC8;
    --vgik-sky: #88BCEB;
    --vgik-violet: #7474C9;
    --vgik-violet-deep: #5656A7;
    --vgik-violet-soft: #EAEAFF;
    --vgik-sky-soft: #EEF7FD;
    --vgik-page: #F4F7FB;
    --vgik-surface: #FFFFFF;
    --vgik-line: #D8E2F0;
    --vgik-text: #1C2947;
    --vgik-muted: #64718A;
    --vgik-success: #2E8068;
    --vgik-success-soft: #E7F5F0;
    --vgik-warning: #A46B16;
    --vgik-warning-soft: #FFF4DD;
    --vgik-danger: #B54554;
    --vgik-danger-soft: #FCEBED;
    --vgik-shadow: 0 10px 28px rgba(4, 13, 58, .10);
    --vgik-shadow-soft: 0 3px 12px rgba(4, 13, 58, .08);
}

html, body {
    min-height: 100%;
}

body {
    color: var(--vgik-text) !important;
    background: var(--vgik-page) !important;
    background-image: none !important;
    font-family: "Montserrat", "Segoe UI", Arial, Helvetica, sans-serif !important;
}

body, table, input, select, textarea, button {
    text-rendering: optimizeLegibility;
}

a, a:visited {
    color: var(--vgik-blue-dark);
}

a:hover {
    color: var(--vgik-violet);
}

/* Header */
#mt_c1 {
    position: relative;
    height: 112px !important;
    overflow: visible;
    background: linear-gradient(103deg, var(--vgik-blue) 0%, var(--vgik-blue-dark) 100%) !important;
    box-shadow: 0 7px 22px rgba(4, 13, 58, .18);
}

#mt_c1::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: .14;
    background:
        linear-gradient(135deg, transparent 0 64%, rgba(255,255,255,.32) 64% 65%, transparent 65%),
        linear-gradient(45deg, transparent 0 80%, rgba(255,255,255,.22) 80% 81%, transparent 81%);
}

#hdr_brand {
    position: absolute;
    z-index: 2;
    left: 22px;
    top: 10px;
    display: block;
    width: 760px;
    height: 92px;
    color: #fff !important;
    text-decoration: none !important;
}

#hdr_logo {
    position: absolute !important;
    left: 0;
    top: 0;
    width: 68px !important;
    height: 88px !important;
    margin: 0 !important;
    background: transparent url('/design/vgik/logo-2026.svg') center / contain no-repeat !important;
}

#hdr_brand_name {
    position: absolute;
    left: 86px;
    top: 12px;
    width: 650px;
    color: #fff;
    font: 600 15px/1.25 "Montserrat", "Segoe UI", Arial, sans-serif;
    letter-spacing: .045em;
    text-transform: uppercase;
}

#hdr_brand_name small {
    display: block;
    margin-top: 7px;
    color: rgba(255,255,255,.78);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .12em;
}

#hdr_text {
    z-index: 2;
    top: auto !important;
    left: 108px;
    bottom: 12px;
    margin: 0 !important;
    color: #fff !important;
    font: 600 14px/18px "Montserrat", "Segoe UI", Arial, sans-serif !important;
    font-style: normal !important;
    letter-spacing: .02em;
}

#beta_notice {
    z-index: 3;
    top: 13px;
    right: 254px;
    left: auto;
    margin: 0 !important;
    padding: 5px 9px;
    color: rgba(255,255,255,.9) !important;
    font: 600 10px/16px "Segoe UI", Arial, sans-serif !important;
    letter-spacing: .02em;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: 999px;
    background: rgba(4,13,58,.18);
    backdrop-filter: blur(4px);
}

#beta_notice span {
    margin-right: 6px !important;
    padding: 1px 7px !important;
    color: var(--vgik-navy) !important;
    background: #fff !important;
    border-radius: 999px !important;
}

#sec_menu {
    z-index: 4;
    top: 0;
    right: 0 !important;
    width: 232px !important;
    min-height: 96px;
    padding: 9px 14px 7px !important;
    color: #fff;
    background: rgba(4,13,58,.22) !important;
    border-left: 1px solid rgba(255,255,255,.18);
    box-sizing: border-box;
}

#sec_menu p,
#sec_menu span,
#sec_menu div {
    color: #fff !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
}

#sec_menu em {
    color: #fff !important;
    font-weight: 700;
}

#sec_menu center a,
#sec_menu center a:visited {
    display: inline-block;
    margin-top: 3px;
    padding: 4px 10px;
    color: #fff !important;
    text-decoration: none !important;
    background: rgba(255,255,255,.14);
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 4px;
}

#sec_menu center a:hover {
    background: rgba(255,255,255,.25);
}

#sec_menu input[type="text"],
#sec_menu input[type="password"] {
    color: var(--vgik-navy) !important;
    background: rgba(255,255,255,.96) !important;
    border-color: rgba(255,255,255,.75) !important;
}

/* Main layout */
#mt_c2 {
    padding-top: 0;
}

#ct_c1 {
    width: 36px !important;
    padding: 28px 0 0 15px !important;
}

#ct_c2 {
    padding: 26px 22px 20px 10px !important;
}

/* Slide-out navigation */
.mm_tab {
    top: 124px;
    left: 14px !important;
    width: 230px !important;
    display: block;
    max-height: calc(100vh - 145px);
    overflow-x: hidden;
    overflow-y: auto;
    background: #fff;
    border: 1px solid var(--vgik-line);
    border-radius: 8px;
    box-shadow: var(--vgik-shadow);
}

.mm_c1,
.mm_c3 {
    width: 230px !important;
    height: 8px !important;
    background: #fff !important;
}

.mm_c2 {
    width: 230px !important;
    padding: 3px 0 7px;
    background: #fff !important;
}

.mm_c2 a,
.mm_c2 div a {
    width: auto !important;
    margin: 0 7px !important;
    padding: 8px 11px !important;
    color: var(--vgik-text) !important;
    font: 600 11px/15px "Segoe UI", Arial, sans-serif !important;
    border: 0 !important;
    border-radius: 5px;
    box-sizing: border-box;
    text-decoration: none !important;
}

.mm_c2 div a {
    padding-left: 25px !important;
    color: var(--vgik-muted) !important;
    font-weight: 500 !important;
}

.mm_c2 a:hover,
.mm_c2 div a:hover {
    color: var(--vgik-violet-deep) !important;
    background: var(--vgik-violet-soft) !important;
}

.mm_c2 .mm_sel,
.mm_c2 .mm_sel:visited {
    color: #fff !important;
    background: linear-gradient(102deg, var(--vgik-violet), var(--vgik-blue)) !important;
}

.mm_c2 a i {
    color: var(--vgik-blue-dark) !important;
}

.mm_btn {
    top: 135px;
    left: 0;
    width: 32px !important;
    height: 132px !important;
    margin: 0 !important;
    font-size: 0;
    background: linear-gradient(180deg, var(--vgik-violet), var(--vgik-blue-dark)) !important;
    border-radius: 0 7px 7px 0;
    box-shadow: 0 5px 16px rgba(4,13,58,.22);
}

.mm_btn::after {
    content: "MENU";
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font: 700 9px/1 "Segoe UI", Arial, sans-serif;
    letter-spacing: .16em;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
}

.mm_btn:hover {
    filter: brightness(1.08);
}


/* Unified section headings, hotfix 116.30.14.
   The legacy design applied a fixed 202px left margin to every H3, which
   displaced page names on wide and narrow screens. The direct-child selector
   affects section page names only and leaves internal/print headings untouched. */
#ct_c2 > h3 {
    margin: 0 0 12px 14px !important;
    color: var(--vgik-navy) !important;
    font: 600 18px/1.3 "Montserrat", "Segoe UI", Arial, sans-serif !important;
    font-style: normal !important;
    letter-spacing: .01em;
}

/* Cards and legacy nine-slice containers */
.cnt_tab,
.srh_tab {
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 8px;
    box-shadow: var(--vgik-shadow-soft);
}

.cnt_t1, .cnt_t2, .cnt_t3,
.cnt_c1, .cnt_c2, .cnt_c3,
.cnt_b1, .cnt_b2, .cnt_b3,
.srh_t1, .srh_t2, .srh_t3,
.srh_c1, .srh_c2, .srh_c3,
.srh_b1, .srh_b2, .srh_b3 {
    background-image: none !important;
}

.cnt_t1, .cnt_t2, .cnt_t3,
.cnt_c1, .cnt_c2, .cnt_c3,
.cnt_b1, .cnt_b2, .cnt_b3,
.cnt_cont {
    background-color: #fff !important;
}

.srh_t1, .srh_t2, .srh_t3,
.srh_c1, .srh_c2, .srh_c3,
.srh_b1, .srh_b2, .srh_b3 {
    background-color: var(--vgik-sky-soft) !important;
    border-color: var(--vgik-line) !important;
}

.cnt_cont {
    padding: 12px 14px !important;
}

.cnt_hdr,
.srh_hdr {
    color: var(--vgik-violet-deep) !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
}

.nav {
    margin-bottom: 16px !important;
    padding: 9px 12px !important;
    color: var(--vgik-muted) !important;
    font: 600 11px/16px "Segoe UI", Arial, sans-serif !important;
    background: #fff;
    border: 1px solid var(--vgik-line) !important;
    border-left: 4px solid var(--vgik-violet) !important;
    border-radius: 5px;
    box-shadow: var(--vgik-shadow-soft);
}

.nav a,
.nav a:visited {
    color: var(--vgik-blue-dark) !important;
}

.nav b {
    color: var(--vgik-violet-deep) !important;
}

/* Typography */
h2, .hdr_md, .hdr_med, .frm_hdr, .frm_hdrt, .frm_hdrb, .frm_hdr_nm {
    color: var(--vgik-navy) !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
}

h2, .hdr_md {
    font-weight: 650 !important;
}

.hdr_md a, .hdr_med a,
.hdr_md a:visited, .hdr_med a:visited {
    color: var(--vgik-blue-dark) !important;
}

.hdr_md a:hover, .hdr_med a:hover {
    color: var(--vgik-violet) !important;
}

.ih, .hint, .show_div_info {
    color: var(--vgik-muted) !important;
}

/* Forms */
input[type="text"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="time"],
input[type="email"],
select,
textarea,
.area11,
.area12,
.inp120 {
    color: var(--vgik-text) !important;
    background-color: #fff !important;
    border: 1px solid #BFCDE0 !important;
    border-radius: 4px !important;
    box-shadow: inset 0 1px 2px rgba(4,13,58,.04);
    box-sizing: border-box;
}

input[type="text"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="time"],
input[type="email"],
select {
    min-height: 26px;
    padding: 3px 7px !important;
}

textarea, .area11, .area12 {
    padding: 7px !important;
}

input:focus,
select:focus,
textarea:focus {
    outline: none;
    border-color: var(--vgik-violet) !important;
    box-shadow: 0 0 0 3px rgba(116,116,201,.16) !important;
}

input[type="button"],
input[type="submit"],
button,
.btn70,
.btn90 {
    min-height: 27px;
    color: #fff !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
    font-weight: 650 !important;
    background: var(--vgik-violet) !important;
    border: 1px solid var(--vgik-violet) !important;
    border-radius: 4px !important;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}

input[type="button"]:hover,
input[type="submit"]:hover,
button:hover,
.btn70:hover,
.btn90:hover {
    background: var(--vgik-violet-deep) !important;
    border-color: var(--vgik-violet-deep) !important;
    box-shadow: 0 3px 8px rgba(86,86,167,.22);
}

input[type="checkbox"], input[type="radio"] {
    accent-color: var(--vgik-violet);
}

optgroup {
    color: var(--vgik-navy) !important;
    background: var(--vgik-sky-soft) !important;
    border-color: var(--vgik-line) !important;
}

.frm_tab td, .frm_tab_sm td, .frd_tab td, .frs_tab td,
.frm_tab td i, .frm_tab_sm td i {
    color: var(--vgik-text) !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
}

.frm_tab td em, .frm_tab_sm td s {
    color: var(--vgik-danger) !important;
}

/* Action links */
.act_link,
.act_link:visited {
    display: inline-block !important;
    margin: 2px 5px 2px 0 !important;
    padding: 5px 9px 5px 25px !important;
    color: var(--vgik-blue-dark) !important;
    line-height: 16px !important;
    background-color: var(--vgik-sky-soft);
    border: 1px solid #D4E8F5;
    border-radius: 4px;
}

.act_link:hover {
    color: var(--vgik-violet-deep) !important;
    text-decoration: none !important;
    background-color: var(--vgik-violet-soft);
    border-color: #D7D7F2;
}

/* Tables */
.dtatab,
.dtatab_lh,
.epv_tab,
.tlg_tab,
.shd_tab,
.shd_tab_ho,
.shd_tab_vo {
    border-collapse: separate;
    border-spacing: 0;
    color: var(--vgik-text);
    background: #fff;
}

.dtatab th,
.dtatab_lh th,
.dtah_c,
.dtah_l,
.dtah_fx,
.dtah_fxc,
.dta_sh {
    color: var(--vgik-navy) !important;
    background: #EAF3FA !important;
    background-image: none !important;
    border-color: #C9DBEA !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
    font-weight: 650 !important;
}

.dtah_c a, .dtah_l a, .dtah_fx a,
.dtah_c a:visited, .dtah_l a:visited, .dtah_fx a:visited {
    color: var(--vgik-blue-dark) !important;
}

.dtah_c a:hover, .dtah_l a:hover, .dtah_fx a:hover {
    color: var(--vgik-violet) !important;
}

.dta, .dta_n, .dta_n_nolnk, .dta_d, .dta_lh, .dta_n_lh {
    color: var(--vgik-text) !important;
    border-color: var(--vgik-line) !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
}

.dtatab tr:hover > .dta_n,
.dtatab tr:hover > .dta,
.dtatab tr:hover > .dta_d,
.dtatab tr:hover > td {
    background-color: #F7FAFD;
}

.dta a, .dta_n a, .dta_d a,
.dta a:visited, .dta_n a:visited, .dta_d a:visited {
    color: var(--vgik-blue-dark) !important;
}

.dta a:hover, .dta_n a:hover, .dta_d a:hover {
    color: var(--vgik-violet-deep) !important;
}

.dtah_clr1, .dta_total, .bgr_gray, .bgr_gray1 {
    background-color: #EEF3F8 !important;
}

.dta_inshdr, .bgr_yel, .bgr_yel_s, .elm_h1, .elm_h2, .elm_hy {
    background-color: var(--vgik-warning-soft) !important;
}

.bgr_green, .elm_hg {
    background-color: var(--vgik-success-soft) !important;
}

.bgr_red, .elm_hr {
    background-color: var(--vgik-danger-soft) !important;
}

.bgr_blue, .bgr_skyblue {
    background-color: var(--vgik-sky-soft) !important;
}

/* Messages */
.msg {
    min-height: 38px;
    height: auto !important;
    color: var(--vgik-text) !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
    line-height: 18px !important;
    background-color: #F7FAFD !important;
    border: 1px solid var(--vgik-line) !important;
    border-left: 4px solid var(--vgik-blue) !important;
    border-radius: 5px;
    box-shadow: var(--vgik-shadow-soft);
}

.mt_acc { border-left-color: var(--vgik-success) !important; }
.mt_err { border-left-color: var(--vgik-danger) !important; }

/* Schedule and educational-plan accents */
.epv_sem_hdr,
.epv_sem_les_type,
.epv_les_type,
.epv_les_type_top {
    color: var(--vgik-navy) !important;
    background-color: #EAF3FA !important;
    border-color: #C9DBEA !important;
}

.epv_bgr_blue { background-color: var(--vgik-sky-soft) !important; }
.epv_bgr_gray { background-color: #EEF3F8 !important; }
.epv_bgr_yel { background-color: var(--vgik-warning-soft) !important; }
.epv_bgr_total { background-color: var(--vgik-violet-soft) !important; }
.epv_bgr_pract { background-color: var(--vgik-success-soft) !important; }

.shd_ch,
.shd_ch_h1,
.shd_ch_h2,
.shd_ch_sh2,
.shd_c1_vo,
.shd_c2_vo,
.shd_c1_ho,
.shd_c2_ho {
    border-color: #C9DBEA !important;
}

.shd_ch,
.shd_ch_h1,
.shd_ch_h2,
.shd_ch_sh2 {
    color: var(--vgik-navy) !important;
    background-color: #EAF3FA !important;
}

.shd_csel {
    outline: 2px solid var(--vgik-violet) !important;
}

.tlg_it_c1, .tlg_it_c2, .tlg_it_c3, .tlg_it_c4,
.tlg_it_c1c, .tlg_it_c2c, .tlg_it_c3c,
.tlg_it_c1t, .tlg_it_c2t, .tlg_it_c3t {
    border-color: var(--vgik-line) !important;
}

/* jQuery UI */
.ui-widget-header {
    color: #fff !important;
    background: var(--vgik-violet) !important;
    border-color: var(--vgik-violet) !important;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
    color: #fff !important;
    background: var(--vgik-blue-dark) !important;
    border-color: var(--vgik-blue-dark) !important;
}

.ui-state-hover,
.ui-widget-content .ui-state-hover {
    color: var(--vgik-violet-deep) !important;
    background: var(--vgik-violet-soft) !important;
    border-color: #CFCFEF !important;
}

/* Footer */
#mt_c3 {
    height: 64px !important;
    padding: 8px 22px 0 58px !important;
}

.ftr_t1, .ftr_t2, .ftr_t3,
.ftr_c1, .ftr_c2, .ftr_c3,
.ftr_b1, .ftr_b2, .ftr_b3 {
    background-image: none !important;
    background-color: var(--vgik-navy) !important;
}

.ftr_c2 {
    color: rgba(255,255,255,.74) !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
    border-radius: 5px;
}

/* Scroll control */
.top_scroll,
.top_scroll_h {
    opacity: .78;
    filter: hue-rotate(165deg) saturate(.8);
}

/* Keep print output neutral. */
@media print {
    body { background: #fff !important; }
    #mt_c1, #mt_c3, #ct_c1, #beta_notice { display: none !important; }
    #ct_c2 { padding: 0 !important; }
}

@media screen and (max-width: 1050px) {
    #hdr_brand { width: 620px; }
    #hdr_brand_name { width: 490px; font-size: 13px; }
    #beta_notice { display: none; }
}


/* Curriculum passport: all identity fields are generated from current reference tables. */
.vgik_plan_passport_title {
    margin: 18px 0 10px !important;
    color: var(--vgik-violet-deep) !important;
    font: 700 18px/1.25 "Montserrat", "Segoe UI", Arial, sans-serif !important;
    text-transform: uppercase;
    letter-spacing: .025em;
}

.vgik_plan_passport {
    width: min(100%, 940px) !important;
    overflow: hidden;
    border: 1px solid var(--vgik-line) !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border-radius: 7px;
    box-shadow: var(--vgik-shadow-soft);
}

.vgik_plan_passport tr:nth-child(even) td {
    background-color: #F8FBFE !important;
}

.vgik_plan_passport td {
    padding: 9px 12px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--vgik-line) !important;
    font-family: "Montserrat", "Segoe UI", Arial, sans-serif !important;
    line-height: 1.45 !important;
}

.vgik_plan_passport tr:last-child td {
    border-bottom: 0 !important;
}

.vgik_plan_passport .vgik_pp_label {
    width: 285px !important;
    color: var(--vgik-muted) !important;
    font-weight: 600 !important;
    background-color: var(--vgik-sky-soft) !important;
}

.vgik_plan_passport .vgik_pp_value {
    width: auto !important;
    color: var(--vgik-text) !important;
    font-weight: 600 !important;
}

.vgik_plan_passport .vgik_pp_program_name {
    color: var(--vgik-violet-deep) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
}

.vgik_plan_identity_warning,
.vgik_plan_link_warning {
    margin: 8px 0 12px !important;
    padding: 10px 12px !important;
    color: #754A12 !important;
    font: 600 12px/18px "Montserrat", "Segoe UI", Arial, sans-serif !important;
    background: var(--vgik-warning-soft) !important;
    border: 1px solid #E9D29F !important;
    border-left: 4px solid var(--vgik-warning) !important;
    border-radius: 5px;
}

.vgik_plan_hint,
.vgik_semester_legend,
.vgik_plan_toolbar,
.vgik_manual_notice {
    color: var(--vgik-text) !important;
    background: var(--vgik-sky-soft) !important;
    border-color: var(--vgik-line) !important;
    border-radius: 5px;
}

.vgik_sem_chip {
    color: var(--vgik-navy) !important;
    background: var(--vgik-violet-soft) !important;
    border-color: #CFCFEF !important;
}


/* Hotfix 116.23: the menu must remain fully reachable on short screens. */
.mm_tab tbody,
.mm_tab tr,
.mm_tab td,
.mm_tab th {
    width: 100%;
    box-sizing: border-box;
}
.mm_tab::-webkit-scrollbar { width: 8px; }
.mm_tab::-webkit-scrollbar-thumb { background: rgba(116,116,201,.42); border-radius: 8px; }
.mm_tab::-webkit-scrollbar-track { background: transparent; }

/* Auditorium reference filters */
.vgik-aud-filter-select {
    width: calc(100% - 4px);
    min-width: 72px;
    height: 25px;
    margin: 1px 2px;
    padding: 2px 22px 2px 6px;
    color: var(--vgik-text);
    background: #fff;
    border: 1px solid var(--vgik-line);
    border-radius: 4px;
    box-sizing: border-box;
}
.vgik-aud-filter-select:focus {
    border-color: var(--vgik-violet);
    box-shadow: 0 0 0 2px rgba(116,116,201,.14);
    outline: 0;
}
.vgik-ao-note { max-width: 430px !important; }
.vgik-ao-note-group + .vgik-ao-note-group { margin-top: 5px; }
.vgik-ao-note-times { color: var(--vgik-text); }

/* Hotfix 116.24: reliable rendering of long menu branches. */
.mm_tab > tbody,
.mm_tab > tbody > tr,
.mm_tab > tbody > tr > td,
.mm_tab > tbody > tr > th {
    display: block;
    width: 100% !important;
    box-sizing: border-box;
}
.mm_c2 > div[name="mm_div"] {
    width: 100% !important;
    box-sizing: border-box;
}