/* CourseTracker custom CSS layer — loaded AFTER the SB Admin v7 theme so these win.
   Holds the few bits we still want from the old sb-admin.css after the v7 re-skin.
   (Phase 2 of the SB Admin v7 migration — see docs/developer-guide/sb-admin-v7-migration-plan.md) */

/* Scroll-to-top button. SB Admin v7 ships no built-in one; this is ported from the
   old sb-admin.css. Shown/hidden by site.js on scroll. */
.scroll-to-top {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    display: none;
    width: 2.75rem;
    height: 2.75rem;
    text-align: center;
    color: #fff;
    background: rgba(33, 37, 41, 0.5);
    line-height: 2.75rem;
    z-index: 1050;
}

.scroll-to-top:hover {
    background: #212529;
    color: #fff;
}

.scroll-to-top:focus {
    color: #fff;
}

/* Auth-card widths, ported from the old sb-admin.css. The Login/Register cards use
   `mx-auto` to center, which only works once the card has a constrained width. */
.card-login {
    max-width: 25rem;
}

.card-register {
    max-width: 40rem;
}

/* Dashboard "card" decorative corner icon (Home + Admin dashboard cards) and its clip,
   ported from the old sb-admin.css. `.card` is position:relative in BS5 so the icon
   anchors to the card; `.o-hidden` clips the overflow. Admin/Index layers its own
   font-size/opacity/offset on top of this base rule. */
.o-hidden {
    overflow: hidden !important;
}

.card-body-icon {
    position: absolute;
    z-index: 0;
    top: -25px;
    right: -25px;
    font-size: 5rem;
    transform: rotate(15deg);
}

/* Clickable selection rows in the Term/Student/Assignment index tables. */
.clickable-row {
    cursor: pointer;
}

/* Progress page input highlights. */
.progress-none {
    background-color: #FFCD85 !important;
}

.progress-complete {
    background-color: #D2F5B0 !important;
}

/* The toggle sits before the brand; let the brand size to the wordmark (override the
   theme's fixed 225px width) and cap the logo height so it fits the 56px topnav. */
.sb-topnav .navbar-brand {
    width: auto;
}

.sb-topnav .navbar-brand img {
    max-height: 36px;
    width: auto;
    height: auto;
}

/* BS5 changed bg-info from #17a2b8 (BS4 teal) to #0dcaf0 (lighter cyan).
   Restore the original teal for progress bars. */
.progress-bar.bg-info {
    background-color: #17a2b8 !important;
}

/* Bootstrap 5 removed the gray background for readonly inputs (only disabled gets it now).
   Restore the visual distinction so readonly fields look non-editable. */
.form-control[readonly] {
    background-color: #e9ecef;
}

/* The v7 theme sets margin-left:-225px on #layoutSidenav_content by default (mobile)
   to compensate for the sidebar nav's width in the flex layout. When there is no
   sidebar (unauthenticated pages — body lacks .sb-nav-fixed), that negative margin
   just shifts the content off-screen to the left. Reset it. */
body:not(.sb-nav-fixed) #layoutSidenav #layoutSidenav_content {
    margin-left: 0;
}

/* Lighten the v7 dark-sidebar links + icons — the theme defaults (rgba .5 text / .25 icon)
   are dimmer than the previous theme. Hover/active still go to #fff via the theme. */
.sb-sidenav-dark .sb-sidenav-menu .nav-link {
    color: rgba(255, 255, 255, 0.8);
}

.sb-sidenav-dark .sb-sidenav-menu .nav-link .sb-nav-link-icon {
    color: rgba(255, 255, 255, 0.65);
}

/* Simple-DataTables pagination — override the library defaults so the pager matches
   Bootstrap's .pagination.pagination-sm used on the server-side paginated pages. */
.datatable-pagination ul {
    display: flex;
    flex-wrap: wrap;
    padding-left: 0;
    list-style: none;
}

.datatable-pagination li {
    float: none;
}

.datatable-pagination a,
.datatable-pagination button {
    position: relative;
    display: block;
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    font-weight: normal;
    line-height: 1.5;
    color: #0d6efd;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #dee2e6;
    margin-left: -1px;
    border-radius: 0;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.datatable-pagination li:first-child a,
.datatable-pagination li:first-child button {
    margin-left: 0;
    border-top-left-radius: 0.2rem;
    border-bottom-left-radius: 0.2rem;
}

.datatable-pagination li:last-child a,
.datatable-pagination li:last-child button {
    border-top-right-radius: 0.2rem;
    border-bottom-right-radius: 0.2rem;
}

.datatable-pagination a:hover,
.datatable-pagination button:hover {
    z-index: 2;
    color: #0a58ca;
    background-color: #e9ecef;
    border-color: #dee2e6;
}

.datatable-pagination .datatable-active a,
.datatable-pagination .datatable-active a:focus,
.datatable-pagination .datatable-active a:hover,
.datatable-pagination .datatable-active button,
.datatable-pagination .datatable-active button:focus,
.datatable-pagination .datatable-active button:hover {
    z-index: 3;
    color: #fff;
    background-color: #0d6efd;
    border-color: #0d6efd;
    cursor: default;
}

.datatable-pagination .datatable-disabled a,
.datatable-pagination .datatable-disabled a:focus,
.datatable-pagination .datatable-disabled a:hover,
.datatable-pagination .datatable-disabled button,
.datatable-pagination .datatable-disabled button:focus,
.datatable-pagination .datatable-disabled button:hover {
    color: #6c757d;
    pointer-events: none;
    background-color: #fff;
    border-color: #dee2e6;
    opacity: 1;
    cursor: default;
}