
/* ── Layout tokens ───────────────────────────────────────────────────────── */
:root {
    --vn-sidebar-w: 262px;
    --vn-topbar-h: 64px;
    --vn-footer-h: 32px;
    --vn-navy-900: #0B1B34;
}

/* ── Dark mode token overrides ───────────────────────────────────────────── */
body[data-colorscheme="dark"] {
    --vn-paper: #0C1524; --vn-surface: #111C2E; --vn-surface-2: #16233A;
    --vn-sunken: #0F1A2B; --vn-line: #243349; --vn-line-strong: #33455F;
    --vn-ink: #E9EDF4; --vn-ink-2: #BDC7D6; --vn-ink-3: #8B98AC;
    --vn-navy-100: #1B2C48; --vn-gold-100: #3A2E17;
    --vn-brick-100: #3A211C; --vn-moss-100: #16342A; --vn-azure-100: #172A45;
    --vn-gold-600: #DCB666; --vn-brick: #D9705C; --vn-moss: #5FBE99; --vn-azure: #7FAAE0;
}
body[data-colorscheme="dark"] { background: var(--vn-paper); color: var(--vn-ink); }
body[data-colorscheme="dark"] .vn-topbar { background: #111C2E; border-bottom: 1px solid #243349; }
body[data-colorscheme="dark"] #page.vn-page,
body[data-colorscheme="dark"] #page-wrapper { background: var(--vn-paper); }
body[data-colorscheme="dark"] .vn-content,
body[data-colorscheme="dark"] #region-main { background: transparent; }

@media (prefers-color-scheme: dark) {
    body:not([data-colorscheme="light"]) {
        --vn-paper: #0C1524; --vn-surface: #111C2E; --vn-surface-2: #16233A;
        --vn-sunken: #0F1A2B; --vn-line: #243349; --vn-line-strong: #33455F;
        --vn-ink: #E9EDF4; --vn-ink-2: #BDC7D6; --vn-ink-3: #8B98AC;
        --vn-navy-100: #1B2C48; --vn-gold-100: #3A2E17;
        --vn-brick-100: #3A211C; --vn-moss-100: #16342A; --vn-azure-100: #172A45;
        --vn-gold-600: #DCB666; --vn-brick: #D9705C; --vn-moss: #5FBE99; --vn-azure: #7FAAE0;
        background: var(--vn-paper); color: var(--vn-ink);
    }
    body:not([data-colorscheme="light"]) .vn-topbar { background: #111C2E; border-bottom: 1px solid #243349; }
    body:not([data-colorscheme="light"]) #page.vn-page,
    body:not([data-colorscheme="light"]) #page-wrapper { background: var(--vn-paper); }
}

/* ── Theme toggle icon: moon in light mode, sun in dark mode ─────────────── */
.vn-icon--sun  { display: none; }
.vn-icon--moon { display: block; }
body[data-colorscheme="dark"] .vn-icon--sun  { display: block; }
body[data-colorscheme="dark"] .vn-icon--moon { display: none; }
@media (prefers-color-scheme: dark) {
    body:not([data-colorscheme="light"]) .vn-icon--sun  { display: block; }
    body:not([data-colorscheme="light"]) .vn-icon--moon { display: none; }
}

/* Smooth theme transition — only active after page load (.vn-ready on body) */
body.vn-ready,
body.vn-ready *,
body.vn-ready *::before,
body.vn-ready *::after {
    transition: background-color .25s ease, color .25s ease,
                border-color .25s ease, box-shadow .25s ease !important;
}

/* ── Fixed sidebar + topbar + footer ─────────────────────────────────────── */
.vn-sidebar {
    position: fixed; top: 0; left: 0; bottom: 0;
    width: var(--vn-sidebar-w); z-index: 1040;
    background: var(--vn-navy-900);
}
.vn-topbar {
    position: fixed; top: 0; left: var(--vn-sidebar-w); right: 0;
    height: var(--vn-topbar-h); z-index: 1035; background: #fff;
}
#page.vn-page { margin-left: var(--vn-sidebar-w); padding: 25px 26px 60px; }
.vn-footer-bar {
    position: fixed; bottom: 0; left: var(--vn-sidebar-w); right: 0;
    z-index: 1030; background: var(--vn-navy-900);
}
.vn-ham           { display: none; }
.vn-sidebar-overlay { display: none; }

@media (max-width: 992px) {
    .vn-sidebar { transform: translateX(-100%); transition: transform .25s ease; }
    .vn-sidebar.vn-sidebar--open { transform: none; box-shadow: 0 0 40px rgba(0,0,0,.35); }
    .vn-topbar, .vn-footer-bar { left: 0; }
    #page.vn-page { margin-left: 0; }
    .vn-ham {
        display: grid; place-items: center; width: 38px; height: 38px;
        border: 0; background: none; cursor: pointer;
        color: inherit; flex: none; border-radius: 6px;
    }
    .vn-sidebar-overlay.vn-sidebar-overlay--visible {
        display: block; position: fixed; inset: 0;
        z-index: 1039; background: rgba(0,0,0,.45);
    }
}
@media (max-width: 640px) {
    .vn-footer-bar { flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px 16px; }
    .vn-footer-bar__left span { display: none; }
    .vn-footer-bar__right { margin-left: 0; flex-wrap: wrap; gap: 8px 14px; }
    #page.vn-page { padding-bottom: 110px !important; }
}

/* ── Block action menus ───────────────────────────────────────────────────── */
/* overflow:hidden clips dropdowns; raise z-index above sidebar/topbar.
   Anchor the dropdown to the RIGHT edge of the trigger (JS anchorToToggle
   corrects Popper's position, so don't set right/left/transform here). */
.block           { overflow: visible !important; }
.block .card-body { overflow: visible !important; }
.block .dropdown-menu {
    z-index: 1045 !important;
    transition: none !important;
    animation: none !important;
}
/* Reset Boost's 360px float:right that breaks inline dashboard blocks. */
#region-main [data-region="blocks-column"] { width: auto !important; float: none !important; }

/* Primary action items (drag handle) */
.block .block-controls .action-menu-item { display: inline-flex !important; }
.block .block-controls .action-menu-item a {
    display: inline-flex !important; align-items: center;
    color: inherit; opacity: .6;
}
.block .block-controls .action-menu-item a:hover { opacity: 1; }

/* Drag handle — ::before fallback when renderPix hasn't fired yet */
.block .block-controls .moodle-core-dragdrop-draghandle {
    display: inline-flex !important; align-items: center; justify-content: center;
    min-width: 24px; min-height: 24px; cursor: move; opacity: 1; vertical-align: middle;
}
.block .block-controls .moodle-core-dragdrop-draghandle:hover { opacity: .7; }
.block .block-controls .moodle-core-dragdrop-draghandle:empty::before {
    content: ''; display: block; width: 10px; height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath fill='%231d2125' d='M182.6 9.4c-12.5-12.5-32.8-12.5-45.3 0l-96 96c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L128 109.3l0 293.5L86.6 361.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l96 96c12.5 12.5 32.8 12.5 45.3 0l96-96c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 402.7l0-293.5 41.4 41.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-96-96z'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-size: contain; background-position: center;
}
.block .block-controls .moodle-core-dragdrop-draghandle img,
.block .block-controls .moodle-core-dragdrop-draghandle svg { width: 16px; height: 16px; display: block; }

/* Edit switch */
.vn-topbar__editswitch .divider { display: none; }
.vn-topbar__editswitch .editmode-switch-form { display: flex !important; align-items: center; gap: 6px; }
.vn-topbar__editswitch label { font-size: 12.5px; font-weight: 600; color: var(--vn-ink-2); cursor: pointer; margin: 0; white-space: nowrap; }
.vn-topbar__editswitch .custom-control { padding-left: 2.5rem; cursor: pointer; }
.vn-topbar__editswitch .custom-control-label { cursor: pointer; }
.vn-topbar__editswitch .custom-control-input { z-index: 1040; cursor: pointer; }

/* ── Course header (.vn-ch) ──────────────────────────────────────────────── */
.vn-ch { border: 1px solid var(--vn-line,#e5e7eb); border-radius: 8px; background: var(--vn-surface,#fff); overflow: hidden; margin-bottom: 16px; box-shadow: 0 1px 3px rgba(0,0,0,.07); }
.vn-ch__band { height: 6px; }
.vn-ch__bd { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 18px 22px 16px; flex-wrap: wrap; }
.vn-ch__info { flex: 1; min-width: 0; }
.vn-ch__eyebrow { display: block; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--vn-gold-500,#c9962a); margin-bottom: 6px; }
.vn-ch__title { font-family: var(--display,"Iowan Old Style","Palatino Linotype",Georgia,serif); font-size: 24px; font-weight: 600; line-height: 1.2; color: var(--ink,#131A26); margin: 0 0 8px; }
.vn-ch__meta { font-size: 12.5px; color: var(--vn-ink-3,#6b7280); }
.vn-ch__actions { display: flex; gap: 8px; flex-shrink: 0; align-items: center; padding-top: 4px; flex-wrap: wrap; }
.vn-ch__ft { border-top: 1px solid var(--vn-line,#e5e7eb); background: var(--vn-surface-2,#f9fafb); padding: 11px 22px; }
.vn-ch__progress { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; font-size: 12.5px; }
.vn-ch__prog-track { flex: 1; min-width: 120px; max-width: 320px; height: 6px; border-radius: 100px; background: var(--vn-line-strong,#d1d5db); overflow: hidden; }
.vn-ch__prog-fill { height: 100%; border-radius: 100px; }
.vn-ch__prog-label { font-weight: 650; white-space: nowrap; color: var(--vn-ink-2,#374151); }
.vn-ch__deadline { display: inline-flex; align-items: center; gap: 5px; margin-left: auto; padding: 3px 10px; border-radius: 100px; background: #FCE8E8; color: #8B2020; font-size: 12px; font-weight: 600; white-space: nowrap; }
.vn-ch__stats { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; font-size: 12.5px; color: var(--vn-ink-2,#374151); }
.vn-ch__stats b { color: var(--vn-ink,#1a1f36); }
.vn-ch__vis-badge { display: inline-block; padding: 3px 10px; border-radius: 100px; font-size: 12px; font-weight: 600; margin-left: auto; white-space: nowrap; }
.vn-ch__vis-badge--on  { background: #D6EDD7; color: #1E5C22; }
.vn-ch__vis-badge--off { background: #FCE8E8; color: #8B2020; }
.vn-dotm { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex-shrink: 0; vertical-align: middle; }
/* Tighten gap between course header and secondary nav tabs */
.vn-ch + .secondary-navigation { margin-top: 0; }
.secondary-navigation .nav-tabs { border-bottom: 1px solid var(--vn-line,#e5e7eb); padding: 0; }
.secondary-navigation .moremenu.navigation { padding-left: 0 !important; padding-right: 0 !important; }
.secondary-navigation .more-nav.nav-tabs { padding-left: 0 !important; margin-left: 0 !important; }

/* ── Dashboard greeting header ───────────────────────────────────────────── */
/* Breadcrumb */
.vn-crumb { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--vn-ink-3,#6b7280); margin-bottom: 10px; flex-wrap: wrap; }
.vn-crumb__link { color: var(--vn-ink-3,#6b7280); text-decoration: none; }
.vn-crumb__link:hover { color: var(--vn-ink,#1a1f36); text-decoration: underline; }
.vn-crumb__sep { opacity: .5; }
.vn-crumb__cur { color: var(--vn-ink-2,#374151); }
/* Header container */
.vn-dash-head { margin-bottom: 32px; }
.vn-dash-head__eyebrow { font-size: 11px; font-weight: 700; letter-spacing: .1em; color: var(--vn-ink-3,#6b7280); text-transform: uppercase; margin-bottom: 6px; }
.vn-dash-head__greeting { font-size: 36px; line-height: 1.15; }
/* Gold ornament rule */
.vn-gold-rule { display: flex; align-items: center; gap: 8px; margin: 10px 0 0; border: none; }
.vn-gold-rule::before { content: ""; height: 2px; width: 34px; background: var(--vn-gold-500,#c9962a); }
.vn-gold-rule::after  { content: ""; height: 5px; width: 5px; transform: rotate(45deg); background: var(--vn-gold-500,#c9962a); }
/* Bottom row */
.vn-dash-head__bottom { display: flex; align-items: center; gap: 24px; }
.vn-dash-head__sub { flex: 1; min-width: 0; font-size: 14px; color: var(--vn-ink-2,#374151); max-width: 56ch; line-height: 1.55; margin: 0; }
.vn-dash-head__actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; margin-left: auto; }
/* Buttons */
.vn-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 18px; border-radius: 6px; border: 1px solid transparent; font-size: 13.5px; font-weight: 650; cursor: pointer; text-decoration: none; font-family: inherit; transition: background .15s, box-shadow .15s; }
.vn-btn:hover { text-decoration: none; }
.vn-btn--primary { background: var(--vn-navy-700,#1e3470); color: #fff; border-color: var(--vn-navy-700,#1e3470); }
.vn-btn--primary:hover { background: var(--vn-navy-600,#2a4599); border-color: var(--vn-navy-600,#2a4599); color: #fff; }
.vn-btn--ghost { background: transparent; border-color: var(--vn-line-strong,#c5ccd8); color: var(--vn-ink-2,#374151); }
.vn-btn--ghost:hover { background: var(--vn-sunken,#f3f4f8); color: var(--vn-ink,#1a1f36); }
/* display:revert on .staff-only falls back to block on divs — restore flex */
body[data-role="staff"] .vn-dash-head__bottom.staff-only { display: flex !important; }
@media (max-width: 768px) {
    .vn-dash-head__bottom { flex-direction: column; align-items: flex-start; gap: 14px; }
    .vn-dash-head__greeting { font-size: 28px; }
    .vn-dash-head__actions { margin-left: 0; }
}
@media (max-width: 480px) {
    .vn-dash-head__greeting { font-size: 24px; }
    .vn-dash-head__actions { flex-wrap: wrap; }
}

/* ── User menu ───────────────────────────────────────────────────────────── */
.vn-usermenu-wrap { padding-left: 12px; margin-left: 4px; border-left: 1px solid var(--vn-line); display: flex; align-items: center; gap: 9px; }
.vn-who__txt { text-align: right; line-height: 1.25; }
.vn-who__txt b    { display: block; font-size: 12.5px; font-weight: 650; color: var(--vn-ink); }
.vn-who__txt span { font-size: 11px; color: var(--vn-ink-3); }
@media (max-width: 992px) { .vn-who__txt { display: none; } }
.vn-usermenu-wrap .usertext { display: none !important; }
.vn-usermenu-wrap .usermenu .btn.dropdown-toggle { display: flex; align-items: center; padding: 0; background: none; border: none; box-shadow: none; color: var(--vn-ink); }
.vn-usermenu-wrap .usermenu .btn.dropdown-toggle::after { display: none; }
.vn-usermenu-wrap .userinitials { width: 34px !important; height: 34px !important; font-size: 12.5px !important; font-weight: 700 !important; background-color: var(--vn-navy-600,#1E3E70) !important; color: #fff !important; margin-right: 0 !important; }
.vn-usermenu-wrap .userpicture  { width: 34px !important; height: 34px !important; border-radius: 50%; object-fit: cover; }
.vn-usermenu-wrap .dropdown-menu { min-width: 200px; border: 1px solid var(--vn-line-strong,#ccc); border-radius: 10px; box-shadow: 0 8px 28px -8px rgba(16,37,70,.22), 0 2px 6px rgba(16,37,70,.06); padding: 6px 0; right: 0; left: auto; }
.vn-usermenu-wrap .dropdown-divider { margin: 4px 0; border-color: var(--vn-line,#e2e8f0); }
.vn-usermenu-wrap .dropdown-item { font-size: 13.5px; color: var(--vn-ink-2); padding: 8px 16px; }
.vn-usermenu-wrap .dropdown-item:hover,
.vn-usermenu-wrap .dropdown-item:focus { background: var(--vn-paper); color: var(--vn-navy-600,#1E3E70); }

/* ── Live-search wrap + dropdown ─────────────────────────────────────────── */
.vn-search-wrap { position: relative; display: flex; align-items: center; width: 100%; }
.vn-search-wrap__icon { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); stroke: var(--vn-ink-3); pointer-events: none; flex: none; }
.vn-search-wrap__input { width: 100%; padding: 8px 12px 8px 34px; border: 1px solid var(--vn-line); background: var(--vn-surface-2); border-radius: 100px; font-size: 13px; color: var(--vn-ink); outline: none; transition: border-color .15s, background .15s; }
.vn-search-wrap__input:focus { border-color: var(--vn-navy-600,#1E3E70); background: var(--vn-surface); }
.vn-search-wrap__input::placeholder { color: var(--vn-ink-3); }
.vn-search-wrap__input::-webkit-search-cancel-button { display: none; }
.vn-search-drop { position: absolute; top: calc(100% + 6px); left: 0; right: 0; background: var(--vn-surface); border: 1px solid var(--vn-line); border-radius: var(--vn-r,8px); box-shadow: 0 4px 16px rgba(0,0,0,.10); z-index: 1060; overflow: hidden; }
.vn-search-drop--mobile { position: static; border-radius: 0; border-left: none; border-right: none; box-shadow: none; border-top: 1px solid var(--vn-line); }
.vn-search-drop__item { display: flex; flex-direction: column; padding: 10px 14px; text-decoration: none; color: var(--vn-ink); border-bottom: 1px solid var(--vn-line); }
.vn-search-drop__item:last-child { border-bottom: none; }
.vn-search-drop__item:hover,
.vn-search-drop__item--focused { background: var(--vn-surface-2); outline: none; }
.vn-search-drop__name { font-size: 14px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.vn-search-drop__meta { font-size: 12px; color: var(--vn-ink-3); margin-top: 2px; }
.vn-search-drop__empty { padding: 14px; font-size: 13px; color: var(--vn-ink-3); }
.vn-search-drop__see-all { color: var(--vn-navy-700,#1A3875); font-weight: 500; }

/* ── Block-level visibility by Student / Staff role ──────────────────────── */
/* Staff-only blocks: hidden by default + in student mode */
.block_vidyanagari_myteaching,
.block_vidyanagari_markingqueue,
.block_vidyanagari_weeklyengagement,
.block_vidyanagari_studentsattention,
.block_vidyanagari_quickactions,
.block_vidyanagari_fromuni,
body[data-role="student"] .block_vidyanagari_myteaching,
body[data-role="student"] .block_vidyanagari_markingqueue,
body[data-role="student"] .block_vidyanagari_weeklyengagement,
body[data-role="student"] .block_vidyanagari_studentsattention,
body[data-role="student"] .block_vidyanagari_quickactions,
body[data-role="student"] .block_vidyanagari_fromuni { display: none !important; }

/* Staff-only blocks: visible in staff mode */
body[data-role="staff"] .block_vidyanagari_myteaching,
body[data-role="staff"] .block_vidyanagari_markingqueue,
body[data-role="staff"] .block_vidyanagari_weeklyengagement,
body[data-role="staff"] .block_vidyanagari_studentsattention,
body[data-role="staff"] .block_vidyanagari_quickactions,
body[data-role="staff"] .block_vidyanagari_fromuni { display: block !important; }

/* Student-only blocks: hidden in staff mode */
body[data-role="staff"] .block_vidyanagari_mycourses,
body[data-role="staff"] .block_vidyanagari_studyactivity,
body[data-role="staff"] .block_vidyanagari_comingup,
body[data-role="staff"] .block_vidyanagari_noticeboard { display: none !important; }

/* ── Default dashboard editor (/my/indexsys.php) ───────────────────────── */
/* Moodle puts the "Reset Dashboard for all users" control in full_header.
   The normal user dashboard replaces that header with the custom greeting,
   but the system dashboard editor must retain the core header and action. */
body.vn-default-dashboard .vn-default-dashboard__header {
    margin-bottom: 18px;
}
body.vn-default-dashboard .vn-default-dashboard__header .page-header-headings h1 {
    font-family: var(--display, "Iowan Old Style", "Palatino Linotype", Georgia, serif);
    font-size: 28px;
    font-weight: 600;
    color: var(--vn-ink, #131A26);
}
body.vn-default-dashboard .vn-default-dashboard__header .header-actions-container .singlebutton {
    margin: 0;
}
body.vn-default-dashboard .vn-default-dashboard__header .header-actions-container .btn {
    border-radius: 6px;
    font-size: 13px;
    font-weight: 650;
}

/* The default dashboard editor is a configuration surface, not a role view.
   Keep all student/staff blocks visible there even when the role switch is hidden. */
body.vn-default-dashboard .block_vidyanagari_myteaching,
body.vn-default-dashboard .block_vidyanagari_markingqueue,
body.vn-default-dashboard .block_vidyanagari_weeklyengagement,
body.vn-default-dashboard .block_vidyanagari_studentsattention,
body.vn-default-dashboard .block_vidyanagari_quickactions,
body.vn-default-dashboard .block_vidyanagari_fromuni,
body.vn-default-dashboard .block_vidyanagari_mycourses,
body.vn-default-dashboard .block_vidyanagari_studyactivity,
body.vn-default-dashboard .block_vidyanagari_comingup,
body.vn-default-dashboard .block_vidyanagari_noticeboard { display: block !important; }

/* ── Dashboard regions ────────────────────────────────────────────────── */
/*
   Moodle's /my pages create a custom `content` region themselves. On the
   Vidyanagari dashboard that core region is the full-width Stats rail.

   The desktop body then uses a 2/3 Left Content rail and a 1/3 Right Content
   rail. The analytics pair is no longer faked by sizing two blocks in the same
   Moodle region. Weekly Engagement and Students Needing Attention now live in
   two independent Moodle block regions inside a dedicated two-column wrapper.
   This makes their side-by-side position structural and keeps native Moodle
   drag/drop and block configuration intact.
*/
.vn-dashboard-regions {
    width: 100%;
    min-width: 0;
}

.vn-dashboard-region,
.vn-dashboard-subregion {
    min-width: 0;
}

.vn-dashboard-region--stats {
    width: 100%;
    margin-bottom: 18px;
}

.vn-dashboard-columns {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
    gap: 18px;
    align-items: start;
    width: 100%;
    min-width: 0;
}

.vn-dashboard-region__label {
    display: none;
}

body.editing .vn-dashboard-region__label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 10px;
    padding: 4px 9px;
    border-radius: 999px;
    background: var(--vn-navy-100, #e3e9f3);
    color: var(--vn-navy-700, #16305a);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

body.editing .vn-dashboard-region,
body.editing .vn-dashboard-subregion {
    border: 1px dashed var(--vn-line-strong, #cfc9bb);
    border-radius: var(--vn-r, 10px);
    padding: 10px;
    min-height: 72px;
}

.vn-dashboard-regions .block-region,
.vn-dashboard-regions [data-region="blocks-column"] {
    width: 100% !important;
    max-width: none !important;
    float: none !important;
    min-width: 0;
}

.vn-dashboard-regions .block-region > .block,
.vn-dashboard-regions [data-region="blocks-column"] > .block {
    width: 100% !important;
    max-width: none !important;
    min-width: 0;
    margin: 0 !important;
}

.vn-dashboard-region--stats .block-region {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

/* Main full-width left region: Marking Queue for staff and the normal student
   dashboard blocks. The region itself stays a simple vertical block stream. */
.vn-dashboard-region--left > .block-region,
.vn-dashboard-region--left > [data-region="blocks-column"] {
    display: flex !important;
    flex-direction: column;
    flex-wrap: nowrap !important;
    gap: 18px;
    align-items: stretch;
}

/* Dedicated two-part row. Each side contains its own real Moodle region. */
.vn-dashboard-left-pair {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: start;
    width: 100%;
    min-width: 0;
    margin-top: 18px;
}

.vn-dashboard-subregion > .block-region,
.vn-dashboard-subregion > [data-region="blocks-column"] {
    display: flex !important;
    flex-direction: column;
    flex-wrap: nowrap !important;
    gap: 18px;
    align-items: stretch;
    min-width: 0;
}

.vn-dashboard-subregion--bottom {
    margin-top: 18px;
}

body[data-role="staff"] .vn-dashboard-subregion--one .block_vidyanagari_weeklyengagement .vnwe-wrap,
body[data-role="staff"] .vn-dashboard-subregion--two .block_vidyanagari_studentsattention .vnst-wrap {
    height: 100%;
}

/* Right Content: Quick actions, compact Calendar, From the university. */
.vn-dashboard-region--right > .block-region,
.vn-dashboard-region--right > [data-region="blocks-column"] {
    display: flex !important;
    flex-direction: column;
    flex-wrap: nowrap !important;
    gap: 18px;
    align-items: stretch;
}

.vn-dashboard-region--right .block_calendar_month .card,
.vn-dashboard-region--right .block_calendar_month .card-body,
.vn-dashboard-region--right .block_calendar_month .content,
.vn-dashboard-region--right .block_calendar_month .calendarwrapper {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.vn-dashboard-region--right .block_calendar_month table.calendartable {
    width: 100% !important;
    table-layout: fixed;
}

.vn-dashboard-region--right .block_calendar_month table.calendartable th,
.vn-dashboard-region--right .block_calendar_month table.calendartable td {
    min-width: 0 !important;
    height: auto !important;
}

/* Student dashboards keep the same two-column Left Content / Right Content
   structure configured on the default dashboard. Only the staff-only
   subregions are hidden on a normal student dashboard. */
body[data-role="student"]:not(.vn-default-dashboard) .vn-dashboard-left-pair,
body[data-role="student"]:not(.vn-default-dashboard) .vn-dashboard-subregion--bottom {
    display: none;
}

body.vn-default-dashboard .vn-dashboard-columns {
    grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
}

body.vn-default-dashboard .vn-dashboard-region--left,
body.vn-default-dashboard .vn-dashboard-region--right {
    grid-row: auto;
    grid-column: auto;
}

@media (max-width: 980px) {
    .vn-dashboard-columns,
    body.vn-default-dashboard .vn-dashboard-columns {
        grid-template-columns: minmax(0, 1fr);
    }

    .vn-dashboard-left-pair {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 760px) {
    .vn-dashboard-columns,
    .vn-dashboard-left-pair {
        gap: 14px;
    }

    .vn-dashboard-region--stats {
        margin-bottom: 14px;
    }

    .vn-dashboard-left-pair,
    .vn-dashboard-subregion--bottom {
        margin-top: 14px;
    }

    .vn-dashboard-region--left > .block-region,
    .vn-dashboard-region--left > [data-region="blocks-column"],
    .vn-dashboard-subregion > .block-region,
    .vn-dashboard-subregion > [data-region="blocks-column"],
    .vn-dashboard-region--right > .block-region,
    .vn-dashboard-region--right > [data-region="blocks-column"],
    .vn-dashboard-region--stats .block-region {
        gap: 14px;
    }
}
