@import '_content/GlobalEdTech.Sis.WebApp.Shared/GlobalEdTech.Sis.WebApp.Shared.7dswd2vzln.bundle.scp.css';
@import '_content/GlobalEdTech.Web.Shared/GlobalEdTech.Web.Shared.5jxrc9xb72.bundle.scp.css';

/* /Pages/Account.razor.rz.scp.css */
/*
Copyright (c) 2026 Student First, LLC
All rights reserved.
This code is licensed under the Student First, LLC License.
Unauthorized copying of this file, via any medium is strictly prohibited.
Proprietary and confidential.
*/

/* Card layout for balance groups — the alternative to the row list. One column on small screens,
   filling out to as many as fit above that, so a student with several enrollments does not scroll
   past one card per screen. */
.account-group-cards[b-zezsucqiie] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
    /* The expanded card's detail spans every column, so it cannot share the row it follows. Dense
       packing lets the next card take the slot the detail left empty, which keeps the row whole and
       puts the detail below a full row. Every card is one column wide and the detail is the only
       wide item, so no card is ever pulled out of source order - only the detail lands later. */
    grid-auto-flow: row dense;
}

@media (min-width: 768px) {
    .account-group-cards[b-zezsucqiie] {
        grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
    }
}

.account-group-card[b-zezsucqiie] {
    background-color: #fff;
    display: flex;
    flex-direction: column;
}

.account-group-card-action[b-zezsucqiie] {
    margin-top: auto;
}

/* The summary carries the card's own padding-box width and none of a button's chrome, so the card
   reads as a card while the toggle keeps a button's keyboard and screen-reader behaviour. */
.account-group-card-summary[b-zezsucqiie] {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}

/* A click leaves the summary focused, and the browser's own focus ring then sits around the card as
   a stray dark box until something else takes focus. Suppressed here and restored below for
   :focus-visible only, which a click does not match but keyboard focus does - so the ring still
   appears for the readers who need it. */
.account-group-card-summary:focus[b-zezsucqiie] {
    outline: none;
    box-shadow: none;
}

.account-group-card-summary:focus-visible[b-zezsucqiie] {
    outline: 2px solid #0d6efd;
    outline-offset: 2px;
}

.account-group-card--expanded[b-zezsucqiie] {
    border-color: #0d6efd !important;
}

/* Spans every column so the detail lands on its own line under the card that opened it, where the
   transaction grids have the full width they need. */
.account-group-detail[b-zezsucqiie] {
    grid-column: 1 / -1;
    background-color: #fff;
}

/* The outcome of setting up a payment plan.

   Coloured here rather than borrowed from the framework's alert classes: this page renders under a
   component theme layered over Bootstrap, so which stylesheet wins is not something the outcome
   should depend on. Scoped CSS carries the page's own attribute selector, which outranks both.

   Both pairs are the accessible combinations: #155724 on #d4edda is about 7.5:1 and #721c24 on
   #f8d7da about 7.9:1, so each clears AA for text at any size. Colour is never the only signal —
   the markup pairs these with an icon and a word naming the outcome. */
.pp-plan-result[b-zezsucqiie] {
    display: flex;
    align-items: flex-start;
    padding: .75rem 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
}

.pp-plan-result--ok[b-zezsucqiie] {
    color: #155724;
    background-color: #d4edda;
    border-color: #c3e6cb;
}

.pp-plan-result--error[b-zezsucqiie] {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}
/* /Shared/MainLayout.razor.rz.scp.css */
.page[b-ws7a238ltj] {
    position: relative;
    display: flex;
    flex-direction: column;
}

.skip-link[b-ws7a238ltj] {
    position: absolute;
    top: -40px;
    left: 0;
    background: #222;
    color: #fff;
    padding: 0.5rem 1rem;
    text-decoration: none;
    z-index: 10000;
    border-radius: 0 0 4px 0;
    transition: top 120ms ease;
}

    /* Use :focus-visible so NVDA's first forward Tab reveals the link in
       browse-mode. AC-1.2 tester FAIL on Apr 27 traced to plain :focus. */
    .skip-link:focus-visible[b-ws7a238ltj] {
        top: 0;
        outline: 2px solid #ffbf47;
        outline-offset: 2px;
    }

main:focus[b-ws7a238ltj] {
    outline: none;
}

.sidebar[b-ws7a238ltj] {
    width: 250px;
    height: 100vh;
    position: sticky;
    top: 0;
}

.main[b-ws7a238ltj] {
    flex: 1;
    min-width: 0;
    overflow-x: hidden;
}

.page-body[b-ws7a238ltj] {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.top-row[b-ws7a238ltj] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-ws7a238ltj]  a, .top-row .btn-link[b-ws7a238ltj] {
        white-space: nowrap;
        margin-left: 1.5rem;
    }

    .top-row a:first-child[b-ws7a238ltj] {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row:not(.auth)[b-ws7a238ltj] {
        display: none;
    }

    .top-row.auth[b-ws7a238ltj] {
        justify-content: space-between;
    }

    .top-row a[b-ws7a238ltj], .top-row .btn-link[b-ws7a238ltj] {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-ws7a238ltj] {
        flex-direction: row;
    }

    .sidebar[b-ws7a238ltj] {
        width: 224px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-ws7a238ltj] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .main > div[b-ws7a238ltj] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}
/* /Shared/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-koawzsqfth] {
    background-color: rgba(255, 255, 255, 0.1);
}

.sidebar[b-koawzsqfth] {
    background-color: #333333;
}

.top-row[b-koawzsqfth] {
    height: 3.5rem;
    background-color: #333333;
}

.navbar-brand[b-koawzsqfth] {
    font-size: 1.1rem;
}

.oi[b-koawzsqfth] {
    width: 2rem;
    font-size: 1.1rem;
    vertical-align: text-top;
    top: -2px;
}

.fa[b-koawzsqfth] {
    width: 2rem;
    font-size: 1.1rem;
    vertical-align: text-top;
    top: -2px;
}

.nav-item[b-koawzsqfth] {
    font-size: 0.9rem;
    padding-bottom: 0.0rem;
}

    .nav-item:first-of-type[b-koawzsqfth] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-koawzsqfth] {
        padding-bottom: 1rem;
    }

    .nav-item[b-koawzsqfth]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 2.5rem;
        display: flex;
        align-items: center;
        line-height: 2.5rem;
    }

        .nav-item[b-koawzsqfth]  a.active {
            background-color: rgba(255,255,255,0.25);
            color: white;
        }

        .nav-item[b-koawzsqfth]  a:hover {
            background-color: rgba(255,255,255,0.1);
            color: white;
        }

@media (min-width: 641px) {
    .navbar-toggler[b-koawzsqfth] {
        display: none;
    }

    .collapse[b-koawzsqfth] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }
}
/* /Shared/PortalContentElements.razor.rz.scp.css */
/*
   Mirror of the .nav-item ::deep a rule in NavMenu.razor.css.

   Why duplicate: NavMenu's rule only matches elements that carry NavMenu's
   scope attribute. The <li class="nav-item"> rendered by this child component
   carries this component's scope attribute instead, so NavMenu's rule does
   not reach our admin-configured Main Menu entries. Keeping a copy here keeps
   admin-added items visually identical to the standard Home / Grades / etc.
   nav links. If you tweak nav-link colors, hover, or sizing in NavMenu.razor.css,
   keep this file in sync.
*/

.nav-item[b-769kg1m3g3]  a {
    color: #d7d7d7;
    border-radius: 4px;
    height: 2.5rem;
    display: flex;
    align-items: center;
    line-height: 2.5rem;
}

    .nav-item[b-769kg1m3g3]  a.active {
        background-color: rgba(255, 255, 255, 0.25);
        color: white;
    }

    .nav-item[b-769kg1m3g3]  a:hover {
        background-color: rgba(255, 255, 255, 0.1);
        color: white;
    }
/* /Shared/TitleIVAuthorizationsSection.razor.rz.scp.css */
/* portal Title IV authorizations section (scoped) */

.tiv-portal-auth[b-6mc5ei6v2r]  .tiv-portal-auth__note {
    color: var(--sf-color-muted, #64748b);
    margin-bottom: 0.75rem;
}

.tiv-portal-auth[b-6mc5ei6v2r]  .tiv-portal-auth__question {
    padding: 0.75rem 0;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.tiv-portal-auth[b-6mc5ei6v2r]  .tiv-portal-auth__question:first-of-type {
    border-top: none;
    padding-top: 0;
}

.tiv-portal-auth[b-6mc5ei6v2r]  .tiv-portal-auth__question-text {
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.tiv-portal-auth[b-6mc5ei6v2r]  .tiv-portal-auth__answer {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.tiv-portal-auth[b-6mc5ei6v2r]  .tiv-portal-auth__effective {
    font-size: 0.8125rem;
    color: var(--sf-color-muted, #64748b);
}

.tiv-portal-auth[b-6mc5ei6v2r]  .tiv-portal-auth__actions {
    margin-left: auto;
}

.tiv-portal-auth[b-6mc5ei6v2r]  .tiv-portal-auth__history {
    margin-top: 0.75rem;
}

.tiv-portal-auth[b-6mc5ei6v2r]  .tiv-portal-auth__history summary {
    cursor: pointer;
    font-weight: 600;
}

.tiv-portal-auth[b-6mc5ei6v2r]  .tiv-portal-auth__history ul {
    margin: 0.5rem 0 0;
    padding-left: 1.25rem;
}

/* Stack the answer row on narrow (mobile) widths. */
@media (max-width: 600px) {
    .tiv-portal-auth[b-6mc5ei6v2r]  .tiv-portal-auth__answer {
        flex-direction: column;
        align-items: flex-start;
    }

    .tiv-portal-auth[b-6mc5ei6v2r]  .tiv-portal-auth__actions {
        margin-left: 0;
    }
}