﻿.corners-round {
    border: 1px solid black;
    border-radius: 5px;
}

.nesting {
    padding: 5px;
    margin-left: 10px;
    margin-top: 2px;
    margin-bottom: 2px;
}

.toggle-title {
    border-radius: 5px;
    cursor: pointer
}

.expense-leaf {
    background-color: #ddffdd
}

.heading-large-centered {
}

.financials-title {
    text-align: center;
    font-size: 1.4rem;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

.financials-section {
    margin-bottom: 10px;
}

.financials-bold {
    font-weight: bold;
}

.financials-table {
    width: 100%;
    border-collapse: collapse;
}

.financials-table-sm td,
.financials-table-sm th {
    padding: 6px 10px;
    font-size: 0.9rem;
}


.financials-table-bordered thead th,
.financials-table-bordered tbody td {
    border: 1px solid #aaa;
}


.financials-header {
    background-color: #d0d0d0;
    font-weight: bold;
    text-align: left;
}

.financials-right {
    text-align: right;
    white-space: nowrap;
}

.financials-footer-label {
    text-align: right;
    font-weight: bold;
    border: none !important; /* force remove borders */
    background-color: transparent;
}

.financials-footer-total {
    text-align: right;
    font-weight: bold;
    border: 1px solid #333;
    background-color: #f8f8f8;
    white-space: nowrap;
}

.financials-add-item-btn {
    /*    border: 1px solid black;
    border-radius:5px;
    height:30px;
    padding:5px;
    display:flex;
    font-size:15px;
    align-items:center;
    align-content:center;*/
}

.financials-footer-label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    font-weight: bold;
    border: 1px solid #333;
    /*    background-color: #f8f8f8;*/
    white-space: nowrap;
}

.financials-add-item-container {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
    border: 1px solid black;
    padding: 5px;
    border-radius: 5px;
}

.financials-top-category {
    font-weight: bold;
    background-color: #f9e0e0;
}

/* Base table */
.sched-grid {
    border-collapse: collapse;
    width: 100%;
}

    .sched-grid td {
        padding: 0;
        border: 1px solid #c9c9c9; /* default thin grid lines */
    }

    /* 3px block outline */
    .sched-grid tr.period td:first-child {
        border-left-width: 2px;
        border-left-color: #333;
    }

    .sched-grid tr.period td:last-child {
        border-right-width: 2px;
        border-right-color: #333;
    }

    .sched-grid tr.period.block-first td {
        border-top-width: 2px;
        border-top-color: #333;
    }

    .sched-grid tr.period.block-last td {
        border-bottom-width: 2px;
        border-bottom-color: #333;
    }

    /* NEW: slightly thicker horizontal line between periods */
    .sched-grid tr.period + tr.period td {
        border-top-width: 1.5px; /* only the line between two period rows */
        border-top-color: #999; /* or keep same color */
    }

    /* Spacer: pure gap */
    .sched-grid tr.spacer td {
        border: 0;
        height: 16px; /* adjust gap height */
        background: transparent;
    }

/* for StudentViewMode selector component */
.seg-group {
    display: inline-flex;
    align-items: stretch;
    border: 1px solid #bbb;
    border-radius: 8px;
    overflow: hidden;
}

.seg-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.seg {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .35rem .6rem;
    border-right: 1px solid #bbb;
    cursor: pointer;
    background: #f7f7f7;
}

    .seg:last-of-type {
        border-right: 0;
    }

    .seg .oi {
        font-size: 1rem;
    }

    .seg .seg-text {
        line-height: 1;
        white-space: nowrap;
    }

.seg-input:checked + .seg {
    background: #e9eef9;
    outline: 2px solid #6b8cff;
    outline-offset: -2px;
}

.seg:hover {
    background: #eee;
}
