/* Page Section Container */
.net-cost-section-container {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
    max-width: 1140px; /* Max-width for the main content area */
    padding-top: 3rem; /* py-5 equivalent */
    padding-bottom: 3rem; /* py-5 equivalent */
}

/* Utility equivalent for text alignment */
.text-align-center {
    text-align: center;
}

/* Utility equivalent for margins and padding */
.margin-bottom-0 {
    margin-bottom: 0 !important;
}

.margin-bottom-1x {
    margin-bottom: 0.25rem;
}
/* mb-1 */
.margin-bottom-2x {
    margin-bottom: 0.5rem;
}
/* mb-2 */
.margin-bottom-3x {
    margin-bottom: 1rem;
}
/* mb-3 */
.margin-bottom-4x {
    margin-bottom: 1.5rem;
}
/* mb-4 */
.margin-bottom-5x {
    margin-bottom: 3rem;
}
/* mb-5 */
.margin-top-0 {
    margin-top: 0 !important;
}

.margin-top-1x {
    margin-top: 0.25rem;
}
/* mt-1 */
.margin-top-2x {
    margin-top: 0.5rem;
}
/* mt-2 */
.margin-top-3x {
    margin-top: 1rem;
}
/* mt-3 */
.margin-top-4x {
    margin-top: 1.5rem;
}
/* mt-4 */
.margin-top-5x {
    margin-top: 3rem;
}
/* mt-5 */
.margin-right-1x {
    margin-right: 0.25rem;
}
/* me-1 */
.margin-right-2x {
    margin-right: 0.5rem;
}
/* me-2 */
.margin-right-3x {
    margin-right: 1rem;
}
/* me-3 */
.margin-left-auto {
    margin-left: auto;
}
/* mx-auto */
.margin-right-auto {
    margin-right: auto;
}
/* mx-auto */


.padding-0 {
    padding: 0 !important;
}

.padding-1x {
    padding: 0.25rem;
}

.padding-2x {
    padding: 0.5rem;
}

.padding-3x {
    padding: 1rem;
}

.padding-4x {
    padding: 1.5rem;
}

.padding-5x {
    padding: 3rem;
}

.padding-top-2x {
    padding-top: 0.5rem;
}

.padding-bottom-2x {
    padding-bottom: 0.5rem;
}

.padding-top-3x {
    padding-top: 1rem;
}

.padding-bottom-3x {
    padding-bottom: 1rem;
}

.padding-start-3x {
    padding-left: 1rem;
}
/* ps-3 */


/* Flexbox utilities */
.display-flex {
    display: flex;
}

.flex-column {
    flex-direction: column;
}

.align-items-center {
    align-items: center;
}

.justify-content-center {
    justify-content: center;
}

.justify-content-space-between {
    justify-content: space-between;
}

.mb-auto {
    margin-bottom: auto !important;
}
/* for flex containers */


/* Text Colors */
.text-dark-custom {
    color: #343a40;
}

.text-muted-custom {
    color: #6c757d;
}

.text-primary-custom {
    color: #007bff;
}
/* A default primary blue */
.text-danger-custom {
    color: #dc3545;
}

.text-success-custom {
    color: #28a745;
}

.text-secondary-custom {
    color: #5f6a7d;
}
/* Specific for next payment due */
.text-white-custom {
    color: #fff;
}


/* Typography */
.heading-main {
    font-size: 3.5rem; /* display-4 equivalent, larger */
    font-weight: 700; /* fw-bold equivalent */
    line-height: 1.2;
    margin-bottom: 0.5rem;
}

.heading-lead {
    font-size: 1.5rem; /* lead equivalent, larger */
    font-weight: 300;
}

.heading-card-title { /* For general card titles in messages/summary */
    font-size: 1.5rem;
    font-weight: 600;
}

.text-uppercase-custom {
    text-transform: uppercase;
    letter-spacing: 0.05em; /* Custom letter spacing */
    font-weight: 600;
    font-size: 0.9rem; /* small equivalent, but slightly adjusted */
    color: #888;
}

.font-weight-bold-custom {
    font-weight: 700;
}
/* fw-bold */
.font-weight-semibold-custom {
    font-weight: 600;
}
/* fw-semibold */
.font-weight-bolder-custom {
    font-weight: 800;
}
/* custom bolder */
.font-size-small-custom {
    font-size: 0.875em;
}
/* small */
.font-size-medium-custom {
    font-size: 1.125em;
}
/* For term balance */
.font-size-large-custom {
    font-size: 1.25rem;
}
/* fs-5 equivalent, lead for term balance */


/* Generic Card Styles */
.custom-card {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.125); /* default card border */
    border-radius: 0.25rem; /* default card border-radius */
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); /* shadow-lg equivalent */
}

/* Custom Card Body */
.custom-card-body {
    flex: 1 1 auto; /* Fill available space in a flex container */
}


/* Account Summary Card Specifics */
.account-summary-card {
    max-width: 450px; /* Adjusted max-width for centering */
    border-radius: 12px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
    margin-left: auto; /* Center the card */
    margin-right: auto; /* Center the card */
    margin-bottom: 3rem; /* mb-5 equivalent */
}

    .account-summary-card .as-head {
        font-size: 1.2rem;
    }
    .account-summary-card .display-balance {
        font-size: 3.8rem; /* display-3 equivalent, much larger */
        line-height: 1.2;
        font-weight: 800; /* fw-bolder equivalent */
    }

    .account-summary-card .text-next-payment {
        font-size: 1rem; /* small equivalent, but slightly larger */
        color: #5f6a7d !important; /* Specific shade of grey */
    }

/* Grid Layout (Reimplementing Bootstrap's row/col) */
.custom-row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px; /* Compensate for column padding */
    margin-left: -15px; /* Compensate for column padding */
    justify-content: center; /* justify-content-center */
}

/* Generic column for responsive behavior */
.custom-col {
    padding-right: 15px;
    padding-left: 15px;
    flex: 0 0 auto;
    width: 100%; /* Default to full width on small screens */
}

/* Specific column widths for different breakpoints */
@media (min-width: 576px) { /* sm breakpoint */
    .custom-col-sm-10 {
        width: 83.33333333%;
    }
}

@media (min-width: 768px) { /* md breakpoint */
    .custom-col-md-8 {
        width: 66.66666667%;
    }
}

@media (min-width: 992px) { /* lg breakpoint */
    .custom-col-lg-6 {
        width: 50%;
    }
    /* .custom-col-lg-5 is not directly used for term cards in new layout */
}


/* Gutters (g-4 equivalent for custom-row) */
.custom-row.gutter-4x {
    margin-right: -1.5rem;
    margin-left: -1.5rem;
    margin-top: 3rem; /* my-5 */
    margin-bottom: 3rem; /* my-5 */
}

    .custom-row.gutter-4x > .custom-col,
    .custom-row.gutter-4x > [class*="custom-col-"] {
        padding-right: 1.5rem; /* 1.5rem for g-4 */
        padding-left: 1.5rem;
    }


/* Term Cards Specifics */
.net-cost-term-card {
    border-radius: 12px; /* Specific rounded corners for term cards */
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

    .net-cost-term-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15); /* Enhanced shadow on hover */
    }

    .net-cost-term-card .card-icon {
        font-size: 2.5rem; /* Icon size */
        margin-right: 1rem; /* me-3 equivalent */
        vertical-align: middle;
    }

    .net-cost-term-card .term-name-header { /* Custom class for term name h3 */
        font-size: 1.8rem; /* fs-3 equivalent, bold */
        font-weight: 700;
        display: flex; /* For aligning icon and text */
        align-items: center;
        margin-bottom: 1rem; /* mb-3 */
        color: #212529; /* Darker text */
    }

    .net-cost-term-card .term-balance-text { /* Custom class for term balance p */
        font-size: 1.3rem; 
        border-bottom: 1px solid #dee2e6; /* border-bottom pb-3 mb-3 */
        padding-bottom: 1rem;
        margin-bottom: 1rem;
        color: #6c757d; /* text-muted */
    }

    .net-cost-term-card .balance-due-box {
        background-color: #007bff; /* Equivalent to bg-primary */
        color: white; /* Equivalent to text-white */
        padding: 1.5rem; /* p-4 equivalent */
        border-radius: 8px; /* Specific border-radius, `rounded-custom` */
        text-align: center;
        margin-top: 1.5rem; /* mt-4 equivalent, ensures spacing */
    }

    .net-cost-term-card .balance-due-label {
        font-size: 1.1rem; 
        margin-bottom: 0.5rem; /* mb-1 equivalent */
        opacity: 0.8; /* opacity-75 equivalent */
    }

    .net-cost-term-card .balance-due-amount {
        font-size: 2.8rem; /* display-6 equivalent, larger */
        font-weight: 700; /* fw-bold equivalent */
        line-height: 1.2;
        margin-bottom: 0;
    }

.term-final-balance-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.2rem;
    font-weight: 700;
    color: #343a40;
    padding-top: 1.5rem;
    margin-top: 1.5rem;
    border-top: 2px solid #e9ecef;
}

/* --- AccordionSection Component Styles --- */
.accordion-container {
    border-top: 1px solid #dee2e6; /* hr-like separator */
    padding-top: 1rem; /* pt-3 */
}

    .accordion-container:first-of-type { /* Use of_type for direct child */
        border-top: none; /* No top border for the first section */
        padding-top: 0;
    }

.accordion-header-button { /* Custom button for accordion header */
    width: 100%;
    text-align: left;
    background-color: transparent;
    border: none;
    padding: 0.75rem 0; /* py-2 */
    font-size: 1.25rem; /* fs-5 equivalent, larger */
    font-weight: 700; /* fw-bold */
    color: #212529; /* Darker text */
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    transition: color 0.2s ease-in-out;
}

    .accordion-header-button:hover {
        color: #0056b3; /* Lighter blue on hover */
    }

    .accordion-header-button:focus {
        outline: 2px solid #007bff; /* Focus ring for accessibility */
        outline-offset: 2px;
    }

.accordion-icon {
    font-size: 1rem;
    transition: transform 0.3s ease-in-out;
}
.accordion-title {
    font-size: 1.3rem;
}

.accordion-header-button.collapsed .accordion-icon {
    transform: rotate(0deg); /* Down arrow when collapsed */
}

.accordion-header-button:not(.collapsed) .accordion-icon {
    transform: rotate(180deg); /* Up arrow when open */
}

.accordion-content {
    overflow: hidden;
    transition: max-height 0.3s ease-out, opacity 0.3s ease-out, padding 0.3s ease-out; /* Include padding in transition */
    max-height: 500px; /* Arbitrary max-height for expanded state, adjust if content can be taller */
    opacity: 1;
    padding-left: 1rem; /* For content indent */
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.accordion-content-collapsed {
    max-height: 0 !important; /* Force hide */
    opacity: 0 !important; /* Force hide */
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.accordion-content hr {
    border-top: 1px solid rgba(0,0,0,.1);
    margin-top: 0.5rem; /* mt-2 */
    margin-bottom: 0.5rem; /* mb-2 */
}


/* --- DetailRow Component Styles --- */
.detail-row-item {
    display: flex;
    justify-content: space-between;
    padding-top: 0.5rem; /* py-2 */
    padding-bottom: 0.5rem; /* py-2 */
    font-size: 1.2rem; /* fs-6 equivalent, larger */
    color: #343a40; /* Default text color */
}

.detail-row-item-label { /* Span for the label */
    color: #6c757d; /* text-muted */
}

.detail-row-item-amount { /* Span for the amount */
    color: #212529; /* Darker for the actual number */
}

.detail-row-item-total {
    font-weight: 700; /* fw-bold */
    border-top: 1px solid #dee2e6; /* border-top mt-2 pt-3 */
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    color: #212529; /* Total amount is dark */
}

/* Special Case for Winter Term costs carried (border-top equivalent) */
.accordion-content .border-top-custom {
    border-top: 1px solid #dee2e6;
    margin-top: 0.5rem; /* mt-2 */
    padding-top: 0.5rem; /* pt-2 */
}


/* Important Messages & Net Tuition Summary - Card-like appearance */
.important-message-box,
.net-tuition-summary-box {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.25rem;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); /* shadow-sm equivalent */
    margin-top: 3rem; /* mt-5 */
    padding: 1.5rem; /* p-4 */
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.important-message-box {
    border-color: #ffeeba; /* alert-warning border */
    background-color: #fff3cd; /* alert-warning background */
    color: #856404; /* alert-warning text */
}

    .important-message-box h4 {
        color: #856404; /* alert-warning heading */
        margin-bottom: 1rem;
    }

    .important-message-box ul {
        list-style: disc; /* Unstyled lists should have bullets */
        margin-bottom: 0;
        padding-left: 1.5rem; /* ps-4 */
    }

        .important-message-box ul li {
            margin-bottom: 0.5rem;
        }

    .important-message-box hr {
        border-top: 1px solid rgba(0,0,0,.1);
        margin-top: 1rem;
        margin-bottom: 1rem;
    }

.net-tuition-summary-box {
    border-radius: 12px; /* Specific border-radius for this card */
}

    .net-tuition-summary-box .summary-row-items {
        display: flex;
        flex-wrap: wrap;
        margin-left: -0.75rem; /* g-3 gutter adjustment */
        margin-right: -0.75rem;
    }

    .net-tuition-summary-box .summary-col-item {
        padding-left: 0.75rem; /* g-3 gutter adjustment */
        padding-right: 0.75rem;
        flex: 0 0 auto;
        width: 100%; /* Default to full width */
    }

@media (min-width: 768px) { /* md-6 equivalent */
    .net-tuition-summary-box .summary-col-item {
        width: 50%;
    }
}

.net-tuition-summary-box ul {
    list-style: none; /* list-unstyled equivalent */
    padding-left: 1rem; /* ms-3 */
    margin-top: 0;
    margin-bottom: 1rem;
}

    .net-tuition-summary-box ul li {
        margin-bottom: 0.25rem; /* mb-1 */
        font-size: 0.875em; /* small */
    }

.net-tuition-summary-box .net-cost-final {
    font-size: 1.25rem; /* h5 equivalent */
    font-weight: 700; /* fw-bold */
    margin-top: 1rem;
}

/* Loading Spinner */
.loading-spinner {
    display: inline-block;
    width: 3rem;
    height: 3rem;
    vertical-align: -0.125em;
    border: 0.25em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: .75s linear infinite spinner-border;
}

.admin-search-container {
    display: flex;
    align-items: center;
    gap: 1rem; /* Creates the space between the input and button */
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 3rem;
}

.admin-search-input {
    flex-grow: 1; /* Makes the input field take up all available space */
    font-size: 1.2rem;
    padding: 0.75rem 1rem;
    border: 1px solid #ced4da;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.admin-search-button {
    padding: 0.75rem 1.5rem;
    font-size: 1.2rem;
    font-weight: 600;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    white-space: nowrap; /* Prevents button text from wrapping */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 120px; /* Gives the button a consistent width */
}

    .admin-search-button .fa {
        margin-right: 0.5rem;
    }

    .admin-search-button:disabled {
        background-color: #6c757d;
        cursor: not-allowed;
    }


@keyframes spinner-border {
    to {
        transform: rotate(360deg);
    }
}

.visually-hidden-custom { /* visually-hidden */
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}