/* Shared viewport and interaction fixes for every RAMS document. */
html { scrollbar-gutter: stable; }
*, *::before, *::after { box-sizing: border-box; }
img, video, canvas { max-width: 100%; }
body.rams-modal-open { overflow: hidden !important; }
.rams-modal-panel {
    max-width: 100% !important;
    max-height: calc(100vh - 32px) !important;
    max-height: calc(100dvh - 32px) !important;
    min-height: 0;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
}
#addUserModal { z-index: 3000; padding: 16px; }
.rams-modal-panel :is(.modal-heading,.modal-header,.student-modal-header,.professor-modal-header,.subject-modal-header,.schedule-modal-header,.rooms-modal-header,.attendance-modal-header) {
    position: static;
    background: var(--ui-surface, #07101f);
    flex-shrink: 0;
}
/* MODAL ATA FOR X BUTTON */
.rams-modal-panel :is(.modal-heading,.modal-header,.student-modal-header,.professor-modal-header,.subject-modal-header,.schedule-modal-header) > div { min-width: 0; }
.rams-modal-panel :is(h2,h3) { overflow-wrap: anywhere; }
.rams-modal-close, #closeAddUserModal,
:is(.student-modal-close,.professor-modal-close,.subject-modal-close,.schedule-modal-close,.rooms-modal-close,.attendance-modal-close,.admin-icon-button,.modal-close) {
    min-width: 44px !important; min-height: 44px !important; flex-shrink: 0;
    cursor: pointer; touch-action: manipulation;
}
#closeAddUserModal, .rams-modal-close { font-size: 26px; line-height: 1; color: #dfeaff; }
.modal-overlay .modal-close { position: relative; float: right; background: var(--ui-surface, #07101f); }
.rams-modal-close { position: relative; float: right; margin: 0 0 8px 8px; border: 1px solid var(--ui-border, #314358); border-radius: 9px; background: var(--ui-surface, #07101f); }
.admin-dialog { max-width: calc(100vw - 32px); overflow: hidden !important; }
.admin-dialog-panel { max-width: 100%; max-height: calc(100dvh - 32px) !important; }
.admin-dialog-header { position: static; }
.rams-notifications { position: fixed; bottom: max(16px, env(safe-area-inset-bottom)); right: max(16px, env(safe-area-inset-right)); z-index: 10000; width: min(420px, calc(100vw - 32px)); max-height: 40dvh; overflow-y: auto; display: grid; gap: 10px; pointer-events: none; }
.rams-notification { display: flex; align-items: flex-start; gap: 12px; padding: 16px; border: 1px solid #278568; border-radius: 12px; background: #09271f; color: #c9f7e4; box-shadow: 0 12px 40px #0008; pointer-events: auto; overflow-wrap: anywhere; }
.rams-notification.error { background: #32151c; border-color: #a24b5b; color: #ffe0e5; }
.rams-notification span { flex: 1; padding-top: 10px; }
.rams-notification button { min-width: 44px; min-height: 44px; border: 0; border-radius: 8px; background: transparent; color: inherit; font-size: 25px; cursor: pointer; }
.rams-form-feedback { grid-column: 1 / -1; padding: 12px 16px; border: 1px solid #a24b5b; border-radius: 9px; background: #32151c; color: #ffe0e5 !important; overflow-wrap: anywhere; }
form[aria-busy="true"] { cursor: progress; }
button:disabled { cursor: wait; }
:is(.admin-main,.admin-content,.professor-main,.portal-card,.admin-panel,.table-wrapper,.admin-table-wrap,.table-container,.table-responsive,.student-main) { min-width: 0; }
:is(.table-wrapper,.admin-table-wrap,.table-container,.table-responsive,.attendance-table-wrap,.rams-table-scroll) { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
:focus-visible { outline: 2px solid #00d5ef; outline-offset: 3px; }
.login-form-section { min-width: 0; max-width: 100%; }
.login-card { overflow-wrap: anywhere; }
.login-shell { overflow-x: clip; }
.ui-simple-page { margin: 0; min-height: 100dvh; padding: clamp(20px,5vw,64px); background: #040b16; color: #dfeaff; font: 16px/1.6 system-ui,sans-serif; }
.ui-simple-page > :is(h1,h2,p,form,div) { max-width: 640px; margin-left: auto; margin-right: auto; }
.ui-simple-page h1 { font-size: clamp(24px,5vw,36px); line-height: 1.2; }
.ui-simple-page form { padding: 24px; background: #07101f; border: 1px solid #1a394d; border-radius: 16px; }
.ui-simple-page input { width: 100%; min-height: 48px; padding: 12px; border: 1px solid #314358; border-radius: 9px; background: #020812; color: #dfeaff; font-size: 16px; }
.ui-simple-page button { min-height: 48px; padding: 12px 20px; background: #00cde8; color: #02101b; border: 0; border-radius: 9px; font-weight: 700; cursor: pointer; }
.ui-simple-page a { color: #00d5ef; display: inline-flex; align-items: center; min-height: 44px; }
@media (max-width: 700px) {
    :is(.student-modal,.subject-modal,.schedule-modal,.professor-modal,.rooms-modal,.attendance-modal,.tablet-modal,.modal-overlay) { padding: 12px !important; }
    .rams-modal-panel { max-height: calc(100dvh - 24px) !important; width: 100%; }
    .admin-dialog { max-width: calc(100vw - 24px); }
    .admin-dialog-panel { max-height: calc(100dvh - 24px) !important; }
    #addUserForm { grid-template-columns: minmax(0,1fr); padding: 16px; }
    #addUserForm label, #addUserForm button { grid-column: 1 !important; }
    :is(input,select,textarea) { font-size: 16px !important; max-width: 100%; }
    :is(button,.admin-btn,.admin-button,.text-action,.primary-action,.danger-action) { min-height: 44px; }
    :is(.page-heading,.section-heading,.users-header,.student-page-header,.subject-page-header,.professor-page-header,.admin-panel-header) { flex-wrap: wrap; gap: 12px; }
    :is(.admin-content,.professor-main) :is(h1,h2,p,small,strong,a) { overflow-wrap: anywhere; }
    :is(.modal-heading,.student-modal-header,.professor-modal-header,.subject-modal-header,.schedule-modal-header) { padding: 14px 16px !important; }
    .modal-heading h2 { font-size: 21px; }
    body.admin-sidebar-open { overflow: hidden; }
}
@media (prefers-reduced-motion: reduce) {
    /* Keep the landing tablet's original motion, as explicitly requested. */
    :where(*:not(#heroAboutWrap):not(#heroAboutWrap *)),
    :where(*:not(#heroAboutWrap):not(#heroAboutWrap *))::before,
    :where(*:not(#heroAboutWrap):not(#heroAboutWrap *))::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}
tr[data-rams-page-hidden] { display: none !important; }
.rams-table-pagination { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 12px; padding: 14px 18px; color: inherit; }
.rams-table-pagination button { min-height: 36px; padding: 7px 13px; border: 1px solid currentColor; border-radius: 9px; background: transparent; color: inherit; cursor: pointer; font: inherit; }
.rams-table-pagination button:disabled { opacity: .4; cursor: default; }
.rams-table-pagination span { font-size: 12px; }
.rams-page-actions {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 16px;
}

.rams-page-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 12px;
    margin-left: auto;
}

.rams-back-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 8px 14px;
    border: 1px solid var(--ui-border-soft, var(--line, #cbd5e1));
    border-radius: 9px;
    background: var(--ui-surface, var(--panel, #fff));
    color: var(--ui-text, var(--text, #17232d));
    font: 650 13px/1.3 Inter, system-ui, sans-serif;
    text-decoration: none;
    white-space: nowrap;
}

.rams-back-link:hover {
    filter: brightness(1.08);
}

.rams-back-link:focus-visible {
    outline: 2px solid var(--brand-text, var(--accent, #00c8e8));
    outline-offset: 3px;
}

:is(.portal-topbar-actions, .header-right) .rams-back-link {
    flex: 0 0 auto;
}