/* Shared institutional frame. Keep this stylesheet after each module stylesheet. */
:root { --cii-header-height: 64px; }
body.cii-shell { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; margin: 0; }
.cii-shell > main, .cii-shell > :is(.admin-layout, .finance-layout, .teacher-layout, .student-layout, .committee-layout) { flex: 1 0 auto; min-width: 0; }
.cii-shell > :is(.admin-layout, .finance-layout, .teacher-layout, .student-layout, .committee-layout) { min-height: calc(100dvh - var(--cii-header-height)); align-items: start; }
.cii-shell .main, .cii-shell .student-main { min-width: 0; }
.cii-shell main [id] { scroll-margin-top: calc(var(--cii-header-height) + 24px); }
.cii-shell > .page-shell { flex: 1 0 auto; min-width: 0; min-height: calc(100dvh - var(--cii-header-height)); }
.cii-shell .page-shell .student-sidebar { grid-template-rows: auto minmax(0, 1fr); }
.cii-shell .mobile-topbar { top: var(--cii-header-height); }
.cii-shell .career-report-list { grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
.cii-shell :is(.custom-select, .select-trigger, .selected-text, .benefit-list, .faq-list, .faq-list article > div) { min-width: 0; }
.cii-shell .form-group { grid-template-columns: minmax(0, 1fr); }
.cii-shell .workspace-aside, .cii-shell .carousel-admin-layout .form-panel { top: calc(var(--cii-header-height) + 18px); }
.cii-gov-header { position: sticky; top: 0; z-index: 90; flex: 0 0 auto; }
.cii-shell .gov-bar { width: 100%; min-height: 64px; background: #611232; color: #fff; }
.cii-shell .gov-content { width: min(1280px, calc(100% - 32px)); min-height: 64px; margin-inline: auto; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding-block: 10px; }
.cii-shell .gov-brand { display: inline-flex; flex-shrink: 0; }
.cii-shell .gov-brand img { display: block; height: 40px; width: 145px; max-width: 100%; object-fit: contain; }
.cii-shell .gov-links { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px 18px; }
.cii-shell .gov-links a { color: #fff; font-size: 14px; font-weight: 650; text-decoration: none; padding-block: 6px; }
.cii-shell .gov-links a:hover { text-decoration: underline; }
.cii-shell .gov-links .icon-button { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #ffffff18; color: white; }

/* The navigation, not the logo or logout action, scrolls in a short viewport. */
.cii-shell :is(.sidebar, .student-sidebar, .teacher-sidebar, .committee-sidebar) { top: var(--cii-header-height); height: calc(100vh - var(--cii-header-height)); height: calc(100dvh - var(--cii-header-height)); max-height: calc(100dvh - var(--cii-header-height)); min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 18px; overflow: hidden; align-self: start; }
.cii-shell :is(.sidebar, .student-sidebar, .teacher-sidebar, .committee-sidebar) .sidebar-brand { margin-bottom: 0; min-width: 0; }
.cii-shell .sidebar-brand > div { min-width: 0; }
.cii-shell .sidebar-brand .brand-badge { flex: 0 0 auto; }
.cii-shell .sidebar-nav { min-height: 0; min-width: 0; overflow-y: auto; overflow-x: hidden; align-content: start; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #ffffff70 transparent; padding: 3px 5px 3px 0; }
.cii-shell .sidebar-nav a, .cii-shell .sidebar-footer a { min-width: 0; padding-block: 12px; overflow-wrap: anywhere; }
.cii-shell .sidebar-nav .material-symbols-rounded, .cii-shell .sidebar-footer .material-symbols-rounded { flex: 0 0 auto; }
.cii-shell .sidebar-footer { margin-top: 0; }
.cii-shell .sidebar-backdrop { inset: var(--cii-header-height) 0 0; }
.cii-shell.cii-menu-open { overflow: hidden; }
.cii-shell :is(.panel, .panel-header, .topbar, .topbar-actions, .filters, .filters-grid, .form-group, .stat-card, .summary-card, .hero-copy, .workspace-main, .workspace-side) { min-width: 0; }
.cii-shell :is(.topbar, .panel-header, .hero-actions) { flex-wrap: wrap; }
.cii-shell :is(.topbar, .panel-header, .hero-summary) > div { min-width: 0; }
.cii-shell :is(h1, h2, h3, p, dd, .user-chip, .stat-card, .summary-card, .sidebar-brand) { overflow-wrap: anywhere; }
.cii-shell :is(input, select, textarea) { min-width: 0; max-width: 100%; }
.cii-shell :is(.primary-button, .secondary-button, .ghost-button, .danger-button) { max-width: 100%; white-space: normal; text-align: center; }
.cii-shell :is(.table-wrapper, .table-wrap, .table-container, .shirt-report-preview) { max-width: 100%; overflow-x: auto; }
.cii-shell :is(.login-page, .password-page, .registration-page, .communication-password-page) { min-height: calc(100dvh - var(--cii-header-height)); }
.cii-shell :is(.login-page, .password-page, .registration-page, .communication-password-page) > :is(.visual-panel, .form-panel) { min-height: 0; }

/* Footer uses local styles and assets; no remote stylesheet or Shadow DOM needed. */
.cii-footer { flex: 0 0 auto; margin-top: auto; width: 100%; padding: 32px max(20px, calc((100% - 1280px) / 2)); background: #611232; color: white; font: 14px/1.6 Inter, system-ui, sans-serif; }
.cii-footer-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 30px; }
.cii-footer img { width: 180px; height: 52px; object-fit: contain; max-width: 100%; }
.cii-footer h2 { font-size: 17px; margin: 0 0 10px; color: white; }
.cii-footer p { margin: 10px 0; }
.cii-footer a { color: white; text-decoration: none; overflow-wrap: anywhere; }
.cii-footer a:hover { text-decoration: underline; }
.cii-footer ul { padding: 0; margin: 0; list-style: none; }
.cii-footer li { margin: 6px 0; }
.cii-footer-bottom { padding-top: 18px; margin-top: 22px; border-top: 1px solid #ffffff40; }
.cii-shell :focus-visible { outline: 3px solid #d4af37; outline-offset: 3px; }

@media (min-width: 1181px) {
    .cii-shell > :is(.admin-layout, .finance-layout, .teacher-layout, .student-layout, .committee-layout) { grid-template-columns: var(--sidebar-width, 280px) minmax(0, 1fr); }
}
@media (max-width: 980px) {
    .cii-shell .topbar-actions { display: flex; flex-wrap: wrap; gap: 12px; }
}
@media (max-width: 620px) {
    .cii-shell .gov-content { gap: 10px; }
    .cii-shell .gov-brand img { width: 124px; height: 36px; }
    .cii-shell .gov-links { gap: 4px 12px; }
    .cii-shell .gov-links .icon-button { display: none; }
    .cii-shell :is(.sidebar, .student-sidebar, .teacher-sidebar, .committee-sidebar) { max-width: calc(100vw - 44px); padding: 16px; gap: 14px; }
    .cii-shell .main { padding: 16px; }
    .cii-shell .topbar { gap: 14px; padding: 18px; }
    .cii-shell .topbar > div:not(.topbar-actions) { flex: 1 1 160px; }
    .cii-shell .topbar-actions { flex: 1 1 100%; }
    .cii-shell .topbar-actions > :is(a, button) { flex: 1 1 180px; }
    .cii-footer-inner { grid-template-columns: minmax(0, 1fr); gap: 22px; }
}
@media (max-height: 450px) {
    .cii-shell :is(.sidebar, .student-sidebar, .teacher-sidebar, .committee-sidebar) { padding-block: 10px; gap: 8px; }
    .cii-shell .sidebar-brand > div > span { display: none; }
    .cii-shell .sidebar-brand .brand-badge { width: 36px; height: 36px; border-radius: 10px; }
    .cii-shell .sidebar-nav a, .cii-shell .sidebar-footer a { min-height: 40px; padding-block: 8px; }
}
@media (prefers-reduced-motion: reduce) {
    .cii-shell *, .cii-shell *::before, .cii-shell *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}