/* /Components/Advocates/AdvocateCardDeck.razor.rz.scp.css */
/* Deck fills width */
.advocate-card-deck[b-7ngzdjr406] {
    width: 100%;
}

/* Card defaults */
.advocate-card[b-7ngzdjr406] {
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.08);
    width: 100%;
}

@media (max-width: 575px) {
    .advocate-card[b-7ngzdjr406] {
        border-radius: .75rem;
        box-shadow: 0 .25rem .75rem rgba(0,0,0,.05);
        width: 100%;
    }
}


/* Header & footer share the same background */
.advocate-card-header[b-7ngzdjr406],
.advocate-card-footer[b-7ngzdjr406] {
    /*background-color: #3c85ae;*/
    background-image: linear-gradient( 90deg, #79aee0 0%, #6fa0d7 30%, #538cc6 60%, #4977D7 100% );
    color: #ffffff;
    border: none;
}

/* Body is a softer contrast */
.advocate-card-body[b-7ngzdjr406] {
    background-color: #f8f9fa;
}

.advocate-card:hover[b-7ngzdjr406] {
    transform: translateY(-2px);
    box-shadow: 0 0.5rem 1.25rem rgba(0,0,0,.08);
}

/* Name */
.advocate-name[b-7ngzdjr406] {
    font-weight: 600;
    font-size: 1.05rem;
    color: black;
    /*padding-left: .5rem;*/
    padding-bottom: 0;
}

/* Community Leader badge */
.advocate-badge[b-7ngzdjr406] {
    background-color: #ffc107;
    color: #212529;
    font-size: 0.75rem;
}

/* Description */
.advocate-description[b-7ngzdjr406] {
    font-size: 0.9rem;
    color: #495057;
}

/* Contact info stacked nicely */
.advocate-contact[b-7ngzdjr406] {
    font-size: 0.85rem;
}

.advocate-contact-row[b-7ngzdjr406] {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 0.25rem;
}

    .advocate-contact-row dt[b-7ngzdjr406] {
        width: 4rem;
        margin: 0;
        font-weight: 600;
        color: #6c757d;
    }

    .advocate-contact-row dd[b-7ngzdjr406] {
        margin: 0;
        flex: 1 1 auto;
    }

.advocate-contact a[b-7ngzdjr406] {
    text-decoration: none;
}

    .advocate-contact a:hover[b-7ngzdjr406] {
        text-decoration: underline;
    }

/* Footer icon buttons */
.advocate-card-footer[b-7ngzdjr406] {
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
}

.advocate-icon-btn[b-7ngzdjr406] {
    /*background-color: rgba(255, 255, 255, 0.1);*/
    background-color: transparent;
    border: none;
    border-radius: 999px;
    width: 2.25rem;
    height: 2.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 1px;
    margin-right: 5px;
    /*padding-bottom: 0.5rem;
    margin-right: 5px;*/
}

    .advocate-icon-btn i[b-7ngzdjr406] {
        font-size: 1.05rem;
        color: #ffffff;
        /*background-color: rgba(255, 255, 255, 0.1);*/
        background-color: transparent;
    }

    .advocate-icon-btn:hover[b-7ngzdjr406] {
        background-color: rgba(255, 255, 255, 0.25);
        /*border-color: #ffffff;*/
        box-shadow: 0 0 0 0.12rem rgba(255, 255, 255, 0.3);
    }

/* Social links row */
.advocate-social[b-7ngzdjr406] {
    margin-top: 1rem;
}

.advocate-social-link[b-7ngzdjr406] {
    font-size: 1.4rem;
    color: #3c85ae;
    text-decoration: none;
    transition: color 0.2s, transform 0.2s;
}

    .advocate-social-link:hover[b-7ngzdjr406] {
        color: #082767;
        transform: scale(1.15);
    }

/* Extra small devices: single column, comfortable text sizes */
@media (max-width: 575.98px) {
    .advocate-name[b-7ngzdjr406] {
        font-size: 1rem;
    }

    .advocate-contact-row dt[b-7ngzdjr406] {
        width: 3.5rem;
    }
}


/* Footer base (you probably already have something like this) */
/*.advocate-card-footer {
    background-color: #3c85ae;
    color: #ffffff;
    border: none;
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
}*/

/* Toggle pill button */
.advocate-follow-toggle[b-7ngzdjr406] {
    border-radius: 999px;
    padding: 0.1rem 0.4rem;
    border: 1px solid rgba(255, 255, 255, 0.35);
    background-color: transparent;
    font-weight: 700;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 6rem;
    transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

.advocate-follow-toggle-inner[b-7ngzdjr406] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.advocate-follow-knob[b-7ngzdjr406] {
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 999px;
    background-color: rgba(255, 255, 255, 0.15);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
}

.advocate-follow-label[b-7ngzdjr406] {
    font-size: 0.8rem;
    white-space: nowrap;
}

/* OFF state */
.advocate-follow-toggle.not-following[b-7ngzdjr406] {
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.45);
}

    .advocate-follow-toggle.not-following .advocate-follow-knob[b-7ngzdjr406] {
        background-color: rgba(255, 255, 255, 0.15);
    }

/* ON state */
.advocate-follow-toggle.is-following[b-7ngzdjr406] {
    background-color: #20c997; /* teal-ish success tone */
    border-color: #20c997;
    box-shadow: 0 0 0 0.1rem rgba(32, 201, 151, 0.35);
}

    .advocate-follow-toggle.is-following .advocate-follow-knob[b-7ngzdjr406] {
        background-color: rgba(0, 0, 0, 0.15);
    }

/* Hover */
.advocate-follow-toggle:hover[b-7ngzdjr406] {
    border-color: #ffffff;
    box-shadow: 0 0 0 0.12rem rgba(255, 255, 255, 0.3);
}

/* Small screens: keep it compact */
@media (max-width: 575.98px) {
    .advocate-follow-label[b-7ngzdjr406] {
        font-size: 0.75rem;
    }

    .advocate-follow-knob[b-7ngzdjr406] {
        width: 1.4rem;
        height: 1.4rem;
    }
}
/* /Components/Advocates/AdvocateUserCardDeck.razor.rz.scp.css */
/* Deck fills width */
.advocate-user-card-deck[b-8ib233o5gr] {
    width: 100%;
}

/* Card defaults */
.advocate-user-card[b-8ib233o5gr] {
    border-radius: 0.75rem;
    overflow: hidden;
    box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.08);
    width: 400%;
}

@media (max-width: 575px) {
    .advocate-user-card[b-8ib233o5gr] {
        border-radius: .75rem;
        box-shadow: 0 .25rem .75rem rgba(0,0,0,.05);
        width: 100%;
    }
}


/* Header & footer share the same background */
.advocate-user-card-header[b-8ib233o5gr],
.advocate-user-card-footer[b-8ib233o5gr] {
    /*background-color: #3c85ae;*/
    background-image: linear-gradient( 90deg, #79aee0 0%, #6fa0d7 30%, #538cc6 60%, #4977D7 100% );
    color: #ffffff;
    border: none;
}

/* Body is a softer contrast */
.advocate-user-card-body[b-8ib233o5gr] {
    background-color: #f8f9fa;
}

.advocate-user-card:hover[b-8ib233o5gr] {
    transform: translateY(-2px);
    box-shadow: 0 0.5rem 1.25rem rgba(0,0,0,.08);
}

/* Name */
.advocate-user-name[b-8ib233o5gr] {
    font-weight: 600;
    font-size: 1.05rem;
    color: black;
    /*padding-left: .5rem;*/
    padding-bottom: 0;
}

/* Community Leader badge */
.advocate-user-badge[b-8ib233o5gr] {
    background-color: #ffc107;
    color: #212529;
    font-size: 0.75rem;
}

/* Description */
.advocate-user-description[b-8ib233o5gr] {
    font-size: 0.9rem;
    color: #495057;
}

/* Contact info stacked nicely */
.advocate-user-contact[b-8ib233o5gr] {
    font-size: 0.85rem;
}

.advocate-user-contact-row[b-8ib233o5gr] {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 0.25rem;
}

    .advocate-user-contact-row dt[b-8ib233o5gr] {
        width: 4rem;
        margin: 0;
        font-weight: 600;
        color: #6c757d;
    }

    .advocate-user-contact-row dd[b-8ib233o5gr] {
        margin: 0;
        flex: 1 1 auto;
    }

.advocate-user-contact a[b-8ib233o5gr] {
    text-decoration: none;
}

    .advocate-user-contact a:hover[b-8ib233o5gr] {
        text-decoration: underline;
    }

/* Footer icon buttons */
.advocate-user-card-footer[b-8ib233o5gr] {
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
}

.advocate-user-icon-btn[b-8ib233o5gr] {
    /*background-color: rgba(255, 255, 255, 0.1);*/
    background-color: transparent;
    border: none;
    border-radius: 999px;
    width: 2.25rem;
    height: 2.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 1px;
    margin-right: 5px;
    /*padding-bottom: 0.5rem;
    margin-right: 5px;*/
}

    .advocate-user-icon-btn i[b-8ib233o5gr] {
        font-size: 1.05rem;
        color: #ffffff;
        /*background-color: rgba(255, 255, 255, 0.1);*/
        background-color: transparent;
    }

    .advocate-user-icon-btn:hover[b-8ib233o5gr] {
        background-color: rgba(255, 255, 255, 0.25);
        /*border-color: #ffffff;*/
        box-shadow: 0 0 0 0.12rem rgba(255, 255, 255, 0.3);
    }


/* Extra small devices: single column, comfortable text sizes */
@media (max-width: 575.98px) {
    .advocate-name[b-8ib233o5gr] {
        font-size: 1rem;
    }

    .advocate-contact-row dt[b-8ib233o5gr] {
        width: 3.5rem;
    }
}

/* /Components/Controls/CommitmentCtrls/NeedCommitmentDelivery.razor.rz.scp.css */
/* =====================================================
   NeedCommitmentDelivery — isolated styles
   ===================================================== */

.commitment-card[b-gf3z3h8qww] {
    border-radius: 0.75rem;
    overflow: hidden;
    border: 1px solid #dee2e6;
}

.commitment-card .card-header[b-gf3z3h8qww] {
    background: linear-gradient(135deg, #ffd6cc 0%, #ffc2b3 100%);
    color: dimgray;
    border-bottom: 1px solid #d0dbf5;
    padding: 1rem 1.25rem;
}

.need-description[b-gf3z3h8qww] {
    font-size: 0.95rem;
    margin-bottom: 1.25rem;
}

.option-row[b-gf3z3h8qww] {
    border-radius: 0.5rem !important;
    transition: box-shadow 0.2s ease;
}

.option-row:hover[b-gf3z3h8qww] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

/* Make switches a bit larger for easier tapping on mobile */
/*.commitment-toggle,
.deliver-toggle {
    width: 3rem !important;
    height: 1.5rem !important;
    cursor: pointer;
}


.form-check-label {
    cursor: pointer;
    min-width: 7rem;
    text-align: left;
}*/

.commitment-toggle[b-gf3z3h8qww],
.deliver-toggle[b-gf3z3h8qww] {
    width: 3rem !important;
    height: 1.5rem !important;
    cursor: pointer;
    margin-top: 0 !important; /* Bootstrap adds a top offset that misaligns it */
    flex-shrink: 0;
}

.form-check-label[b-gf3z3h8qww] {
    cursor: pointer;
    min-width: 7rem;
    line-height: 1.5rem; /* Match switch height so text sits centered */
    margin-bottom: 0;
}


.status-summary[b-gf3z3h8qww] {
    border-radius: 0.5rem;
    font-size: 0.92rem;
}

.card-footer[b-gf3z3h8qww] {
    background-color: #f8f9fa;
    border-top: 1px solid #e9ecef;
    padding: 0.85rem 1.25rem;
}
/* /Components/Controls/CommitmentCtrls/NeedCommitmentMoney.razor.rz.scp.css */
/* =====================================================
   NeedCommitmentMoney — isolated styles
   ===================================================== */
.center-75[b-3g5axcfm6u] {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 768px) {
    .center-75[b-3g5axcfm6u] {
        width: 75%;
    }
}

.commitment-card[b-3g5axcfm6u] {
    border-radius: 0.75rem;
    overflow: hidden;
    border: 1px solid #dee2e6;
}

.commitment-card .card-header[b-3g5axcfm6u] {
    background: linear-gradient(135deg, #e8f8ef 0%, #f0fff5 100%);
    color: darkgreen;
    border-bottom: 1px solid #c3e6cb;
    padding: 1rem 1.25rem;
}

.need-description[b-3g5axcfm6u] {
    font-size: 0.95rem;
    margin-bottom: 1.25rem;
}

/* ── Money input ── */
.money-input-wrapper[b-3g5axcfm6u] {
    position: relative;
}

.dollar-sign[b-3g5axcfm6u] {
    user-select: none;
    line-height: 1;
}

.money-input[b-3g5axcfm6u] {
    /* Grow and shrink with content via ch units */
    width: auto;
    min-width: 4ch;
    max-width: 100%;
    /* ch-based sizing trick: overridden by JS if needed; browser default is fine */
    font-size: 1.35rem;
    font-weight: 600;
    color: #198754;
    border: none;
    border-bottom: 2px solid #198754;
    border-radius: 0;
    padding: 0.15rem 0.25rem;
    background: transparent;
    outline: none;
    box-shadow: none !important;
    transition: border-color 0.2s;
}

.money-input:focus[b-3g5axcfm6u] {
    border-bottom-color: #0d6efd;
    color: #0d6efd;
}

.money-input.is-invalid[b-3g5axcfm6u] {
    border-bottom-color: #dc3545;
    color: #dc3545;
}

/* Remove browser number spinners */
.money-input[b-3g5axcfm6u]::-webkit-inner-spin-button,
.money-input[b-3g5axcfm6u]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.money-input[b-3g5axcfm6u] {
    -moz-appearance: textfield;
}

/* ── Can-deliver toggle ── */
.option-row[b-3g5axcfm6u] {
    border-radius: 0.5rem !important;
    transition: box-shadow 0.2s ease;
}

.option-row:hover[b-3g5axcfm6u] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

/*.deliver-toggle {
    width: 3rem !important;
    height: 1.5rem !important;
    cursor: pointer;
}

.form-check-label {
    cursor: pointer;
    min-width: 9rem;
}
*/
deliver-toggle[b-3g5axcfm6u] {
    width: 3rem !important;
    height: 1.5rem !important;
    cursor: pointer;
    margin-top: 0 !important; /* Bootstrap adds a top offset that misaligns it */
    flex-shrink: 0;
}

.form-check-label[b-3g5axcfm6u] {
    cursor: pointer;
    min-width: 7rem;
    line-height: 1.5rem; /* Match switch height so text sits centered */
    margin-bottom: 0;
}
.progress[b-3g5axcfm6u] {
    border-radius: 0.5rem;
}

.card-footer[b-3g5axcfm6u] {
    background-color: #f8f9fa;
    border-top: 1px solid #e9ecef;
    padding: 0.85rem 1.25rem;
}
/* /Components/Controls/CommitmentCtrls/NeedCommitmentQuantity.razor.rz.scp.css */
/* =====================================================
   NeedCommitmentQuantity — isolated styles
   ===================================================== */

.commitment-card[b-9yxi0f0ls3] {
    border-radius: 0.75rem;
    overflow: hidden;
    border: 1px solid #dee2e6;
}

.commitment-card .card-header[b-9yxi0f0ls3] {
    background: linear-gradient(135deg, #e7f0fd 0%, #f0f4ff 100%);
    color: dimgrey;
    border-bottom: 1px solid #d0dbf5;
    padding: 1rem 1.25rem;
}

.need-description[b-9yxi0f0ls3] {
    font-size: 0.95rem;
    margin-bottom: 1.25rem;
}

/* Remove browser number spinners */
input[type="number"][b-9yxi0f0ls3]::-webkit-inner-spin-button,
input[type="number"][b-9yxi0f0ls3]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type="number"][b-9yxi0f0ls3] {
    -moz-appearance: textfield;
}

.option-row[b-9yxi0f0ls3] {
    border-radius: 0.5rem !important;
    transition: box-shadow 0.2s ease;
}

.option-row:hover[b-9yxi0f0ls3] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

/*.deliver-toggle {
    width: 3rem !important;
    height: 1.5rem !important;
    cursor: pointer;
}

.form-check-label {
    cursor: pointer;
    min-width: 8rem;
}*/

deliver-toggle[b-9yxi0f0ls3] {
    width: 3rem !important;
    height: 1.5rem !important;
    cursor: pointer;
    margin-top: 0 !important; /* Bootstrap adds a top offset that misaligns it */
    flex-shrink: 0;
}

.form-check-label[b-9yxi0f0ls3] {
    cursor: pointer;
    min-width: 7rem;
    line-height: 1.5rem; /* Match switch height so text sits centered */
    margin-bottom: 0;
}

.progress[b-9yxi0f0ls3] {
    border-radius: 0.5rem;
}

.card-footer[b-9yxi0f0ls3] {
    background-color: #f8f9fa;
    border-top: 1px solid #e9ecef;
    padding: 0.85rem 1.25rem;
}
/* /Components/Controls/CommitmentCtrls/NeedCommitmentSingle.razor.rz.scp.css */
/* =====================================================
   NeedCommitmentSingle — isolated styles
   ===================================================== */

.commitment-card[b-dgsztfb4lr] {
    border-radius: 0.75rem;
    overflow: hidden;
    border: 1px solid #dee2e6;
}

    .commitment-card .card-header[b-dgsztfb4lr] {
        background: linear-gradient(135deg,#f0e6ff 0%, #e0ccff 100%);
        color: dimgray;
        border-bottom: 1px solid #d0dbf5;
        padding: 1rem 1.25rem;
    }

.need-description[b-dgsztfb4lr] {
    font-size: 0.95rem;
    margin-bottom: 1.25rem;
}

.option-row[b-dgsztfb4lr] {
    border-radius: 0.5rem !important;
    transition: box-shadow 0.2s ease;
}

.option-row:hover[b-dgsztfb4lr] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

/* Make switches a bit larger for easier tapping on mobile */
/*.commitment-toggle,
.deliver-toggle {
    width: 3rem !important;
    height: 1.5rem !important;
    cursor: pointer;
}


.form-check-label {
    cursor: pointer;
    min-width: 7rem;
    text-align: left;
}*/

.commitment-toggle[b-dgsztfb4lr],
.deliver-toggle[b-dgsztfb4lr] {
    width: 3rem !important;
    height: 1.5rem !important;
    cursor: pointer;
    margin-top: 0 !important; /* Bootstrap adds a top offset that misaligns it */
    flex-shrink: 0;
}

.form-check-label[b-dgsztfb4lr] {
    cursor: pointer;
    min-width: 7rem;
    line-height: 1.5rem; /* Match switch height so text sits centered */
    margin-bottom: 0;
}


.status-summary[b-dgsztfb4lr] {
    border-radius: 0.5rem;
    font-size: 0.92rem;
}

.card-footer[b-dgsztfb4lr] {
    background-color: #f8f9fa;
    border-top: 1px solid #e9ecef;
    padding: 0.85rem 1.25rem;
}
/* /Components/Controls/CommitmentEditor.razor.rz.scp.css */
.commitment-editor[b-6uq2gb2uol] {
    display: inline-flex; /* ✅ allows the parent to size it cleanly */
    flex-direction: column; /* label above, input below */
    width: 100%; /* ✅ take whatever width the parent grants */
    border: 1px solid #d9d9d9;
    background-color: rgb(248, 249, 250);
    padding: .5rem;
    margin-bottom: .5rem;
}

/* Right-align **just** the input content (not labels) */
.commitment-editor input[b-6uq2gb2uol],
.commitment-editor .form-control[b-6uq2gb2uol],
.commitment-editor .money-input input[b-6uq2gb2uol] {
    text-align: right;
}

/* Checkbox layout should remain natural left-aligned */
.commitment-editor .form-check[b-6uq2gb2uol] {
    text-align: left;
}

.commitment-editor .form-label[b-6uq2gb2uol] {
    margin-bottom: 0.25rem;
}

.commitment-editor .form-text[b-6uq2gb2uol] {
    margin-top: 0.25rem;
}

.commitment-editor .input-group > .input-group-text[b-6uq2gb2uol] {
    min-width: 2.25rem;
    justify-content: center;
}

/* Right align both the money input and the normal number input */
.commitment-editor input[type="number"][b-6uq2gb2uol],
.commitment-editor .money-input input[b-6uq2gb2uol] {
    text-align: right !important;
}

input[type="number"][b-6uq2gb2uol],
.money-input input[b-6uq2gb2uol] {
    text-align: right !important;
}

input[type="number"][b-6uq2gb2uol]::-webkit-outer-spin-button,
input[type="number"][b-6uq2gb2uol]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type="number"][b-6uq2gb2uol] {
    -moz-appearance: textfield;
}

.commitment-editor input[type="number"].form-control[b-6uq2gb2uol] {
    text-align: right !important;
}

/* Remove spinner arrows (Chrome, Edge, Safari, Opera) */
.commitment-editor input[type="number"][b-6uq2gb2uol]::-webkit-outer-spin-button,
.commitment-editor input[type="number"][b-6uq2gb2uol]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Remove spinner arrows (Firefox) */
.commitment-editor input[type="number"][b-6uq2gb2uol] {
    -moz-appearance: textfield;
}

/* Right-align numeric text */
.text-end[b-6uq2gb2uol],
input[type="number"][b-6uq2gb2uol] {
    text-align: right;
}

/* Remove browser spinner (arrows) */

/* Chrome, Safari, Edge, Opera */
input[type=number].no-spinner[b-6uq2gb2uol]::-webkit-inner-spin-button,
input[type=number].no-spinner[b-6uq2gb2uol]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number].no-spinner[b-6uq2gb2uol] {
    -moz-appearance: textfield;
}
/* /Components/Controls/CustomTooltip.razor.rz.scp.css */
.custom-tooltip-host[b-y6smh3do6p] {
    position: relative;
    display: inline-block;
}

.custom-tooltip-trigger[b-y6smh3do6p] {
    display: inline-flex;
    align-items: center;
}

.custom-tooltip-popup[b-y6smh3do6p] {
    position: absolute;
    z-index: 2000;
    min-width: 220px;
    max-width: 320px;
    padding: 0.65rem 0.8rem;
    border-radius: 0.5rem;
    background: #2f3542;
    color: #fff;
    box-shadow: 0 6px 20px rgba(0,0,0,0.20);
    font-size: 0.85rem;
    line-height: 1.3;
}

.tooltip-top[b-y6smh3do6p] {
    bottom: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
}

.tooltip-bottom[b-y6smh3do6p] {
    top: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
}

.tooltip-left[b-y6smh3do6p] {
    right: calc(100% + 8px);
    top: 50%;
    transform: translateY(-50%);
}

.tooltip-right[b-y6smh3do6p] {
    left: calc(100% + 8px);
    top: 50%;
    transform: translateY(-50%);
}

.custom-tooltip-loading[b-y6smh3do6p] {
    font-style: italic;
    opacity: 0.9;
}
/* /Components/Controls/DateRangeFilter.razor.rz.scp.css */
/* Scoped to DateRangeFilter via CSS isolation */

.nr-datefilter .form-label[b-ne099gcxgl] {
    font-weight: 600;
}

.nr-datefilter .form-text code[b-ne099gcxgl] {
    user-select: all;
    white-space: nowrap;
}

/* Visual cue when date inputs are disabled due to phrase selection */
.nr-disabled[b-ne099gcxgl] {
    opacity: 0.6;
    pointer-events: none;
}

@media (max-width: 576px) {
    .nr-datefilter .form-text[b-ne099gcxgl] {
        font-size: 0.85rem;
    }
}
/* Smaller, circular icon buttons */
.btn-icon[b-ne099gcxgl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 50%;
    padding: 0;
    line-height: 1;
}

.btn-icon i[b-ne099gcxgl] {
    font-size: 1.1rem;
}
.btn-icon.btn-outline-primary:hover[b-ne099gcxgl] {
    background-color: #3C85AE;
    color: #fff;
}

.icon:hover[b-ne099gcxgl] {
    background-color: #3C85AE;
}

/* Keep label + icons aligned neatly */
.nr-datefilter .form-label[b-ne099gcxgl] {
    font-weight: 600;
    margin-bottom: 0; /* ensure inline alignment */
}

.nr-datefilter .btn-icon:hover[b-ne099gcxgl] {
    background-color: rgba(0,0,0,0.05);
    border-color: transparent;
}

/* Base icon behavior */
.icon-action[b-ne099gcxgl] {
    cursor: pointer;
    font-size: 1.25rem;
    color: var(--bs-secondary);
    transition: color 0.2s ease-in-out, transform 0.15s ease-in-out;
}

/* Hover and focus effects */
.icon-action:hover[b-ne099gcxgl],
.icon-action:focus[b-ne099gcxgl] {
    color: var(--bs-danger);
    transform: scale(1.1);
}

/* Apply-specific override (optional) */
.apply-icon:hover[b-ne099gcxgl] {
    color: var(--bs-danger);
}

/* Clear-specific override (optional) */
.clear-icon:hover[b-ne099gcxgl] {
    color: var(--bs-danger);
}

/* Keyboard focus outline */
/*.icon-action:focus {
    outline: none;
    text-shadow: 0 0 3px var(--bs-primary);
}*/
/* /Components/Controls/IconLabel.razor.rz.scp.css */
:host[b-auvfvjzkom] {
    display: inline-block;
}

/* Outer container defaults (can be overridden via Class/Style) */
.iconlabel[b-auvfvjzkom] {
    /* Keeps things tight and aligned with Bootstrap utilities already applied */
}

/* Text styling defaults */
.iconlabel-text[b-auvfvjzkom] {
    /* Inherit Bootstrap body styles; customize if you like */
    line-height: 1.25;
    text-decoration: none;
}

/* Icon wrapper: ensure icon aligns nicely with text baseline */
.iconlabel-icon i[b-auvfvjzkom] {
    display: inline-block;
    vertical-align: text-bottom;
    /* Use Bootstrap font-size utilities via parameters, e.g., add "fs-5" in IconClass */
}

/* Hover affordances for link-like parts (text/icon) are already provided by .btn-link */
button.btn.btn-link.icon-only[b-auvfvjzkom] {
    line-height: 1;
}

/* Optional: tweak spacing when stacked on very small screens */
@media (max-width: 575.98px) {
    .iconlabel[b-auvfvjzkom] {
        gap: .25rem;
    }
}
/* /Components/Controls/InfoPopover.razor.rz.scp.css */
/*.info-popover-host {
    position: relative;
    display: inline-block;
}*/

.info-popover-host[b-k7ytsl5pfm] {
    position: relative;
    display: inline-block;
    z-index: 10;
}

.info-popover-trigger[b-k7ytsl5pfm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    outline: none;
}

/*.info-popover-panel {
    position: absolute;
    z-index: 2000;
    background: #ffffff;
    color: #212529;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.75rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    padding: 0;
}
*/
.info-popover-panel[b-k7ytsl5pfm] {
    position: absolute;
    z-index: 99999;
    background: #ffffff;
    color: #212529;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.75rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    padding: 0;
}

.popover-width-sm[b-k7ytsl5pfm] {
    min-width: 180px;
    max-width: 220px;
}

.popover-width-md[b-k7ytsl5pfm] {
    min-width: 240px;
    max-width: 320px;
}

.popover-width-lg[b-k7ytsl5pfm] {
    min-width: 300px;
    max-width: 420px;
}

.info-popover-header[b-k7ytsl5pfm] {
    padding: 0.55rem 0.75rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    font-weight: 600;
    background: #f8f9fa;
    border-top-left-radius: 0.75rem;
    border-top-right-radius: 0.75rem;
}

.info-popover-body[b-k7ytsl5pfm] {
    padding: 0.70rem 0.80rem;
    font-size: 0.875rem;
    line-height: 1.35;
}

.info-popover-loading[b-k7ytsl5pfm] {
    padding: 0.75rem 0.85rem;
    font-size: 0.875rem;
    min-width: 180px;
}

.popover-top[b-k7ytsl5pfm] {
    bottom: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%);
}

.popover-bottom[b-k7ytsl5pfm] {
    top: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%);
}

.popover-left[b-k7ytsl5pfm] {
    right: calc(100% + 10px);
    top: 50%;
    transform: translateY(-50%);
}

.popover-right[b-k7ytsl5pfm] {
    left: calc(100% + 10px);
    top: 50%;
    transform: translateY(-50%);
}

.info-popover-arrow[b-k7ytsl5pfm] {
    position: absolute;
    width: 12px;
    height: 12px;
    background: #ffffff;
    border-left: 1px solid rgba(0, 0, 0, 0.125);
    border-top: 1px solid rgba(0, 0, 0, 0.125);
    transform: rotate(45deg);
}

.popover-top .info-popover-arrow[b-k7ytsl5pfm] {
    bottom: -7px;
    left: 50%;
    margin-left: -6px;
    border-left: none;
    border-top: none;
    border-right: 1px solid rgba(0, 0, 0, 0.125);
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

.popover-bottom .info-popover-arrow[b-k7ytsl5pfm] {
    top: -7px;
    left: 50%;
    margin-left: -6px;
}

.popover-left .info-popover-arrow[b-k7ytsl5pfm] {
    right: -7px;
    top: 50%;
    margin-top: -6px;
    border-left: none;
    border-top: none;
    border-right: 1px solid rgba(0, 0, 0, 0.125);
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

.popover-right .info-popover-arrow[b-k7ytsl5pfm] {
    left: -7px;
    top: 50%;
    margin-top: -6px;
}

@media (max-width: 767.98px) {
    .popover-width-sm[b-k7ytsl5pfm],
    .popover-width-md[b-k7ytsl5pfm],
    .popover-width-lg[b-k7ytsl5pfm] {
        min-width: 220px;
        max-width: min(320px, 90vw);
    }
}
/* /Components/Controls/LoadMorePanel.razor.rz.scp.css */
.load-more-panel[b-0mqjuzxlo5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 0.85rem 1rem;
    border: 1px solid #d9e2ec;
    border-radius: 0.75rem;
    background: #f8fafc;
    margin: 0.75rem 0 1rem 0;
}

.load-more-panel__content[b-0mqjuzxlo5] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.load-more-panel__summary[b-0mqjuzxlo5] {
    font-weight: 600;
    color: #2c3e50;
}

.load-more-panel__subtext[b-0mqjuzxlo5] {
    font-size: 0.9rem;
    color: #6c757d;
}

.load-more-panel__button[b-0mqjuzxlo5] {
    min-width: 140px;
    white-space: nowrap;
}

@media (max-width: 576px) {
    .load-more-panel[b-0mqjuzxlo5] {
        align-items: stretch;
    }

    .load-more-panel__button[b-0mqjuzxlo5] {
        width: 100%;
    }
}
/* /Components/Controls/MoneyInput.razor.rz.scp.css */
.money-input .input-group-text[b-mf1th0jp0x] {
    width: 2.5rem;
    justify-content: center;
    background-color: #f8f9fa;
    font-weight: 600;
    user-select: none;
}

.money-input input[b-mf1th0jp0x] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

    /* Optional: hide the browser's spin buttons if you don't want them */
    .money-input input[b-mf1th0jp0x]::-webkit-outer-spin-button,
    .money-input input[b-mf1th0jp0x]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    .money-input input[type=number][b-mf1th0jp0x] {
        -moz-appearance: textfield; /* Firefox */
    }
/* /Components/Controls/MultiColumnSelectWithActions.razor.rz.scp.css */


.select-with-actions[b-fsyjq0wzep] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.select-host[b-fsyjq0wzep] {
    flex: 0 0 auto;
}

.icon-btn[b-fsyjq0wzep] {
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
/* /Components/Controls/MultiSelect/MultiSelectChips.razor.rz.scp.css */
.multi-select-chips[b-89fzejo60g] {
    margin-bottom: 0.75rem;
}

.multi-select-chips .chip-container[b-89fzejo60g] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
}

.chip-btn[b-89fzejo60g] {
    border-radius: 999px;
    padding-inline: 0.75rem;
    padding-block: 0.2rem;
    font-size: 0.8rem;
    line-height: 1.2;
}

/* Selected vs unselected styles – tuned for Bootstrap 5 */
.chip-selected[b-89fzejo60g] {
    background-color: var(--bs-primary);
    color: #ffffff;
    border-color: var(--bs-primary);
}

.chip-selected:hover[b-89fzejo60g] {
    background-color: #CECECE;
    color: black;
    border-color: var(--bs-primary);
}


.chip-unselected[b-89fzejo60g] {
    background-color: #D6E6F7;
    color: var(--bs-body-color);
    border-color: darkgrey;
}

.chip-btn:disabled[b-89fzejo60g] {
    opacity: 0.65;
    cursor: default;
}

.chip-unselected:hover[b-89fzejo60g] {
    cursor: pointer;
    background-color: #CECECE;
    color: black;
}

.chip-clear[b-89fzejo60g] {
    font-size: 0.8rem;
}

/* Small screens */
@media (max-width: 575.98px) {
    .chip-btn[b-89fzejo60g] {
        font-size: 0.75rem;
        padding-inline: 0.6rem;
    }
}
/* /Components/Controls/MultiSelect/MultiSelectDropdown.razor.rz.scp.css */
.multi-select-dropdown[b-jzldmiov3q] {
    margin-bottom: 0.75rem;
    position: relative;
}

.multi-select-dropdown-inner[b-jzldmiov3q] {
    position: relative;
}

/* Make the toggle look like a form-select but clickable */
.multi-select-toggle[b-jzldmiov3q] {
    text-align: left;
    padding-right: 2rem;
    cursor: pointer;
}

/* Dropdown panel */
.multi-select-menu[b-jzldmiov3q] {
    position: absolute;
    z-index: 1050;
    top: 100%;
    left: 0;
    right: 0;
    margin-top: 0.15rem;
    background-color: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 0.375rem;
    max-height: 260px;
    overflow-y: auto;
}

.multi-select-item[b-jzldmiov3q] {
    width: 100%;
    text-align: left;
    padding: 0.25rem 0.75rem;
    font-size: 0.9rem;
}

    .multi-select-item .form-check-input[b-jzldmiov3q] {
        margin-top: 0;
    }

/* Clear button inside dropdown */
.multi-select-clear[b-jzldmiov3q] {
    font-size: 0.8rem;
    border-top: 1px solid rgba(0, 0, 0, 0.06);
    margin-top: 0.25rem;
}

/* Small screens */
@media (max-width: 575.98px) {
    .multi-select-toggle[b-jzldmiov3q] {
        font-size: 0.9rem;
    }

    .multi-select-item[b-jzldmiov3q] {
        font-size: 0.85rem;
    }

    .multi-select-menu[b-jzldmiov3q] {
        max-height: 220px;
    }
}

/* Stronger, more visible checkbox */
.multi-select-item .form-check-input[b-jzldmiov3q] {
    width: 1.1rem;
    height: 1.1rem;
    border: 2px solid var(--bs-primary);
    margin-right: 0.5rem;
    flex-shrink: 0;
}

    /* Checked state - bold blue fill */
    .multi-select-item .form-check-input:checked[b-jzldmiov3q] {
        background-color: var(--bs-primary) !important;
        border-color: var(--bs-primary) !important;
    }

/* Hover improves visibility */
.multi-select-item:hover[b-jzldmiov3q] {
    background-color: rgba(0, 123, 255, 0.08);
}

/* Larger tap target for mobile */
.multi-select-item[b-jzldmiov3q] {
    padding: 0.45rem 0.75rem;
    min-height: 2.2rem;
    display: flex;
    align-items: center;
}

/* Improve icon visibility on dark mode */
@media (prefers-color-scheme: dark) {
    .multi-select-item .form-check-input[b-jzldmiov3q] {
        border-color: #9ecaff;
    }
}

/* Mobile tweaks */
@media (max-width: 575.98px) {
    .multi-select-item .form-check-input[b-jzldmiov3q] {
        width: 1.25rem;
        height: 1.25rem;
        margin-right: 0.65rem;
    }
}





/* /Components/Controls/MultiSelect/ScrollableSelectionList.razor.rz.scp.css */
.scroll-select-card[b-6yrbnrhu88] {
    border-radius: 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

    /* Header */
    .scroll-select-card .card-header[b-6yrbnrhu88] {
        padding: 0.5rem 0.75rem;
    }

.scroll-select-title[b-6yrbnrhu88] {
    font-weight: 600;
    font-size: 0.95rem;
}

.scroll-select-actions .scroll-select-btn[b-6yrbnrhu88] {
    width: 2rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.15rem 0;
}

/* Scrollable list body */
.scroll-select-list[b-6yrbnrhu88] {
    max-height: 260px;
    overflow-y: auto;
    padding: 0.25rem 0;
}

/* Individual items */
.scroll-select-item[b-6yrbnrhu88] {
    border: 0;
    background-color: transparent;
    padding: 0.35rem 0.75rem;
    text-align: left;
    cursor: pointer;
}

    .scroll-select-item:hover[b-6yrbnrhu88] {
        background-color: rgba(0, 123, 255, 0.06);
    }

    .scroll-select-item.selected[b-6yrbnrhu88] {
        background-color: rgba(0, 123, 255, 0.12);
        border-left: 3px solid var(--bs-primary);
    }

/* Emphasized checkbox / radio */
.scroll-select-check[b-6yrbnrhu88] {
    width: 1.15rem;
    height: 1.15rem;
    border: 2px solid var(--bs-primary);
    margin-right: 0.5rem;
    flex-shrink: 0;
}

    .scroll-select-check:checked[b-6yrbnrhu88] {
        background-color: var(--bs-primary) !important;
        border-color: var(--bs-primary) !important;
    }

/* Label */
.scroll-select-label[b-6yrbnrhu88] {
    font-size: 0.9rem;
}

/* Small screens */
@media (max-width: 575.98px) {
    .scroll-select-card .card-header[b-6yrbnrhu88] {
        padding-inline: 0.5rem;
    }

    /*.scroll-select-item {
        padding-inline: 0.5rem;
    }

    .scroll-select-item {
        margin-bottom: 0.35rem !important;*/ /* space between items */
        /*border-radius: 0.4rem !important;*/ /* optional rounded corners */
        /*border: thin;
        background-color: rebeccapurple !important;
    }*/

    .scroll-select-item[b-6yrbnrhu88] {
        margin-bottom: 0.4rem;
        border-radius: 0.5rem;
        background-color: #f8f9fa; /* light gray */
        padding: 0.5rem 0.75rem;
    }

    .scroll-select-item.selected[b-6yrbnrhu88] {
        background-color: rgba(0, 123, 255, 0.14);
        border-left: 3px solid var(--bs-primary);
    }

    .scroll-select-check[b-6yrbnrhu88] {
        width: 1.25rem;
        height: 1.25rem;
        margin-right: 0.6rem;
    }

    .scroll-select-label[b-6yrbnrhu88] {
        font-size: 0.85rem;
    }
}
/* /Components/Controls/NeedIdCopyBadge.razor.rz.scp.css */
.need-id-copy-badge-wrapper[b-0j276x81vn] {
    position: relative;
    display: inline-block;
    padding: 0.25rem 0.45rem;
    font-size: 0.75rem;
}
/*
.need-id-copy-badge {
    border-radius: 20px !important;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    user-select: none;
    transition: transform 0.12s ease, box-shadow 0.12s ease, opacity 0.12s ease;
}*/

.need-id-copy-badge[b-0j276x81vn] {
    background-color: #6c757d;
    color: white;
    font-size: 0.75rem;
    padding: 0.05rem 0.30rem;
    border-radius: 16px;
    cursor: pointer;
    user-select: none;
    display: inline-block;
}

.need-id-copy-badge:hover[b-0j276x81vn] {
    transform: translateY(-1px);
    box-shadow: 0 0.2rem 0.6rem rgba(0, 0, 0, 0.18);
    opacity: 0.85;
}

    .need-id-copy-badge:active[b-0j276x81vn] {
        transform: scale(0.98);
    }

.need-id-copy-toast[b-0j276x81vn] {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    min-width: 160px;
    z-index: 1080;
}

@media (max-width: 575.98px) {
    .need-id-copy-toast[b-0j276x81vn] {
        right: auto;
        left: 0;
        min-width: 120px;
        max-width: 70vw;
    }
}



/*

.need-id-copy-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    cursor: pointer;
    user-select: none;
    padding: 0.45rem 0.65rem;
    font-size: 0.82rem;
    line-height: 1;
    border-radius: 999px;
    transition: transform 0.12s ease, opacity 0.12s ease, box-shadow 0.12s ease;
}

    .need-id-copy-badge:hover {
        transform: translateY(-1px);
        opacity: 0.95;
        box-shadow: 0 0.15rem 0.5rem rgba(0, 0, 0, 0.18);
    }

    .need-id-copy-badge:active {
        transform: scale(0.98);
    }

.copied-text {
    font-size: 0.72rem;
    font-weight: 600;
    opacity: 0.95;
    white-space: nowrap;
}*/
/* /Components/Controls/NeedProgress.razor.rz.scp.css */
.np-bar[b-nza0fttaup] {
    position: relative;
    background: #e9ecef;
    height: 1.1rem;
    border-radius: 14px;
    overflow: hidden;
}

.np-fill[b-nza0fttaup] {
    background-color: #FFDE59 !important;
    height: 100%;
    transition: width .3s ease;
}

.np-label[b-nza0fttaup] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .70rem;
    color: #000;
    pointer-events: none;
    user-select: none;
    white-space: nowrap;
}

.np-header-text[b-nza0fttaup] {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0 6px;
    line-height: 1;
    color: darkblue
   /* color: var(--np-text-color, #fff);
    text-shadow: 0 1px 2px rgba(0,0,0,0.35);*/
}

/* Better contrast when the fill is short (under ~50%) */
.np-fill[style*="width: 0%"][b-nza0fttaup],
.np-fill[style*="width: 1%"][b-nza0fttaup],
.np-fill[style*="width: 2%"][b-nza0fttaup],
.np-fill[style*="width: 3%"][b-nza0fttaup],
.np-fill[style*="width: 4%"][b-nza0fttaup],
.np-fill[style*="width: 5%"][b-nza0fttaup],
.np-fill[style*="width: 6%"][b-nza0fttaup],
.np-fill[style*="width: 7%"][b-nza0fttaup],
.np-fill[style*="width: 8%"][b-nza0fttaup],
.np-fill[style*="width: 9%"][b-nza0fttaup],
.np-fill[style*="width: 10%"][b-nza0fttaup],
.np-fill[style*="width: 11%"][b-nza0fttaup],
.np-fill[style*="width: 12%"][b-nza0fttaup],
.np-fill[style*="width: 13%"][b-nza0fttaup],
.np-fill[style*="width: 14%"][b-nza0fttaup],
.np-fill[style*="width: 15%"][b-nza0fttaup],
.np-fill[style*="width: 16%"][b-nza0fttaup],
.np-fill[style*="width: 17%"][b-nza0fttaup],
.np-fill[style*="width: 18%"][b-nza0fttaup],
.np-fill[style*="width: 19%"][b-nza0fttaup],
.np-fill[style*="width: 20%"][b-nza0fttaup],
.np-fill[style*="width: 21%"][b-nza0fttaup],
.np-fill[style*="width: 22%"][b-nza0fttaup],
.np-fill[style*="width: 23%"][b-nza0fttaup],
.np-fill[style*="width: 24%"][b-nza0fttaup],
.np-fill[style*="width: 25%"][b-nza0fttaup],
.np-fill[style*="width: 26%"][b-nza0fttaup],
.np-fill[style*="width: 27%"][b-nza0fttaup],
.np-fill[style*="width: 28%"][b-nza0fttaup],
.np-fill[style*="width: 29%"][b-nza0fttaup],
.np-fill[style*="width: 30%"][b-nza0fttaup],
.np-fill[style*="width: 31%"][b-nza0fttaup],
.np-fill[style*="width: 32%"][b-nza0fttaup],
.np-fill[style*="width: 33%"][b-nza0fttaup],
.np-fill[style*="width: 34%"][b-nza0fttaup],
.np-fill[style*="width: 35%"][b-nza0fttaup],
.np-fill[style*="width: 36%"][b-nza0fttaup],
.np-fill[style*="width: 37%"][b-nza0fttaup],
.np-fill[style*="width: 38%"][b-nza0fttaup],
.np-fill[style*="width: 39%"][b-nza0fttaup],
.np-fill[style*="width: 40%"][b-nza0fttaup],
.np-fill[style*="width: 41%"][b-nza0fttaup],
.np-fill[style*="width: 42%"][b-nza0fttaup],
.np-fill[style*="width: 43%"][b-nza0fttaup],
.np-fill[style*="width: 44%"][b-nza0fttaup],
.np-fill[style*="width: 45%"][b-nza0fttaup],
.np-fill[style*="width: 46%"][b-nza0fttaup],
.np-fill[style*="width: 47%"][b-nza0fttaup],
.np-fill[style*="width: 48%"][b-nza0fttaup],
.np-fill[style*="width: 49%"] .np-text[b-nza0fttaup] {
    /* When fill is small, place text outside for readability */
    position: absolute;
    right: 6px;
    color: rgba(0,0,0,0.8);
    text-shadow: none;
}
/* /Components/Controls/NeedsListHeader.razor.rz.scp.css */
.needs-header[b-ziu7x3f322] {
    border: 1px solid rgba(0,0,0,.08);
    border-radius: 16px;
    padding: 5px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,.04);
    margin-bottom: 5px;
}

.needs-header__top[b-ziu7x3f322] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.needs-header__titleblock[b-ziu7x3f322] {
    min-width: 0;
}

.needs-header__title[b-ziu7x3f322] {
    margin: 0;
    font-size: 1.25rem;
    line-height: 1.2;
    font-weight: 700;
}

.needs-header__count[b-ziu7x3f322] {
    margin-left: 8px;
    font-weight: 600;
    opacity: .7;
    font-size: 0.95rem;
}

.needs-header__subtitle[b-ziu7x3f322] {
    margin-top: 6px;
    opacity: .78;
    font-size: 0.95rem;
}

.needs-header__right[b-ziu7x3f322] {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
}

.needs-header__actions[b-ziu7x3f322] {
    margin-top: 5px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.needs-header__btn[b-ziu7x3f322] {
    border-radius: 999px;
    padding-left: 14px;
    padding-right: 14px;
}

/* Small screens: stack nicely */
@media (max-width: 576px) {
    .needs-header[b-ziu7x3f322] {
        padding: 12px 12px;
        border-radius: 14px;
    }

    .needs-header__actions[b-ziu7x3f322] {
        gap: 8px;
    }

    .needs-header__btn[b-ziu7x3f322] {
        width: 100%;
        justify-content: center;
    }
}
/* /Components/Controls/NeedSuggestionLink.razor.rz.scp.css */
.need-suggestion-link[b-jfp4087c9y] {
    width: 100%;
    margin-top: 1rem;
}

.suggestion-input-wrap[b-jfp4087c9y] {
    position: relative;
}

.suggestion-input[b-jfp4087c9y] {
    padding-right: 2.25rem;
}

.suggestion-clear-btn[b-jfp4087c9y] {
    position: absolute;
    top: 50%;
    right: 0.625rem;
    transform: translateY(-50%);
    border: none;
    background: transparent;
    color: #6c757d;
    cursor: pointer;
    padding: 0.125rem 0.25rem;
    line-height: 1;
}

    .suggestion-clear-btn:hover[b-jfp4087c9y] {
        color: #000;
    }

.suggestion-preview[b-jfp4087c9y] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem;
}

.preview-label[b-jfp4087c9y] {
    font-size: 0.875rem;
    color: #6c757d;
}

.suggestion-preview-link[b-jfp4087c9y],
.suggestion-action-link[b-jfp4087c9y] {
    font-weight: 600;
    text-decoration: none;
    word-break: break-word;
}

    .suggestion-preview-link:hover[b-jfp4087c9y],
    .suggestion-action-link:hover[b-jfp4087c9y] {
        text-decoration: underline;
    }

.suggestion-readonly[b-jfp4087c9y] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem;
    padding: 0.125rem 0;
}

.suggestion-label[b-jfp4087c9y] {
    font-weight: 600;
}

.suggestion-pill[b-jfp4087c9y] {
    border-radius: 999px;
}
/* /Components/Controls/ProgressOverlay.razor.rz.scp.css */
/* Root wrapper uses Bootstrap .progress under the hood */
/*.po-root {
    position: relative;
    background-color: var(--bs-gray-200);*/ /* track */
    /*border-radius: 9999px;
    overflow: hidden;
}*/

/* Fill bar */
/*.po-bar {
    height: 100%;
    border-radius: 9999px;
}*/

/* Centered overlay label */
/*.po-label {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .75rem;
    font-weight: 600;
    color: #fff;*/ /* assumes darker bar; tweak if needed */
    /*text-shadow: 0 1px 1px rgba(0,0,0,.35);
    pointer-events: none;*/ /* clicks fall through to parent if needed */
/*}*/

/* Support very narrow widths: avoid label overflow */
/*@media (max-width: 400px) {
    .po-label {
        font-size: .7rem;
    }
}*/


.po-root[b-vles6xot36] {
    position: relative;
    background-color: var(--bs-gray-200);
    border-radius: 9999px;
    overflow: hidden;
}

.po-bar[b-vles6xot36] {
    height: 100%;
    border-radius: 9999px;
}

.po-label[b-vles6xot36] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .75rem;
    font-weight: 600;
    pointer-events: none;
    padding: 0 .35rem; /* helps with pill spacing if enabled */
}

/* Text tones */
.po-label-light[b-vles6xot36] {
    color: #fff;
    text-shadow: 0 1px 1px rgba(0,0,0,.35);
}

.po-label-dark[b-vles6xot36] {
    color: #212529; /* Bootstrap body color */
    text-shadow: none;
}

/* Optional pill backdrop for guaranteed contrast */
.po-label-pill[b-vles6xot36] {
    border-radius: 9999px;
    line-height: 1.2;
    /* background-color is set inline via LabelPillStyle */
}

@media (max-width: 400px) {
    .po-label[b-vles6xot36] {
        font-size: .7rem;
    }
}

/* /Components/Controls/SearchTextBox.razor.rz.scp.css */
.search-box[b-c31zi4o32k] {
    position: relative;
    display: inline-block;
    min-width: 0;
}

.search-box-input[b-c31zi4o32k] {
    padding-right: 1.25rem;
}

.search-box-button[b-c31zi4o32k] {
    position: absolute;
    top: 50%;
    right: .35rem;
    transform: translateY(-50%);
    border: none;
    background: transparent;
    padding: .25rem .4rem;
    color: var(--bs-secondary-color, #6c757d);
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: .375rem;
}

    .search-box-button:hover[b-c31zi4o32k] {
        color: var(--bs-primary, #0d6efd);
        background-color: rgba(0, 0, 0, 0.04);
    }

    .search-box-button:focus-visible[b-c31zi4o32k] {
        outline: 0;
        box-shadow: 0 0 0 .2rem rgba(13, 110, 253, .25);
    }

    .search-box-button i[b-c31zi4o32k] {
        font-size: 1rem;
        line-height: 1;
    }

.search-box:focus-within .search-box-button[b-c31zi4o32k] {
    color: var(--bs-primary, #0d6efd);
}
/* /Components/Controls/SelectWithActions.razor.rz.scp.css */
.select-with-actions[b-f5e3epjhbt] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

    .select-with-actions .form-select[b-f5e3epjhbt] {
        flex: 1 1 auto;
        min-width: 0;
    }

.icon-btn[b-f5e3epjhbt] {
    width: 2.5rem;
    height: 2.5rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}
/* /Components/Controls/TimedTooltip.razor.rz.scp.css */
/* Admin/Components/Common/TimedTooltip.razor.css */

.nr-tooltip-wrapper[b-3m63qk6ek3] {
    position: relative;
    display: inline-block;
}

.nr-tooltip-target[b-3m63qk6ek3] {
    cursor: help;
}

.nr-tooltip-popup[b-3m63qk6ek3] {
    z-index: 1000;
    min-width: 180px;
    max-width: 260px;
    padding: 0.5rem 0.75rem;
    border-radius: 0.5rem;
    font-size: 0.85rem;
    background-color: rgba(0, 0, 0, 0.85);
    color: #fff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}

    /* You can keep the arrow; it will still roughly line up */
    .nr-tooltip-popup[b-3m63qk6ek3]::before {
        content: "";
        position: absolute;
        top: -6px;
        left: 50%;
        transform: translateX(-50%);
        border-width: 6px;
        border-style: solid;
        border-color: transparent transparent rgba(0, 0, 0, 0.85) transparent;
    }

.nr-tooltip-title[b-3m63qk6ek3] {
    font-weight: 600;
    margin-bottom: 0.2rem;
}

.nr-tooltip-message[b-3m63qk6ek3] {
    margin: 0;
    line-height: 1.3;
    white-space: normal;
}

@media (max-width: 576px) {
    .nr-tooltip-popup[b-3m63qk6ek3] {
        max-width: 80vw;
        font-size: 0.8rem;
    }
}
/* /Components/Deprecated/AdvocateCardList.razor.rz.scp.css */
.needs-container[b-7veex1pppz] {
    padding: 1rem;
}

.need-card[b-7veex1pppz] {
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    border: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.need-card[b-7veex1pppz] {
    max-width: 95%;
}


.need-card:hover[b-7veex1pppz] {
    transform: translateY(-5px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.need-card .card-header[b-7veex1pppz] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    font-weight: 600;
    border-bottom: none;
    padding: 1rem 1.25rem;
}

.need-card .card-header h5[b-7veex1pppz] {
    font-size: 1.1rem;
    margin-bottom: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.need-card .card-body[b-7veex1pppz] {
    padding: 1.25rem;
}

.need-card .card-title[b-7veex1pppz] {
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.need-card .card-subtitle[b-7veex1pppz] {
    font-size: 0.9rem;
    line-height: 1.4;
}

.need-card .card-text[b-7veex1pppz] {
    font-size: 0.875rem;
}

.need-card .card-text strong[b-7veex1pppz] {
    color: #495057;
    display: block;
    margin-bottom: 0.25rem;
}

.need-card .card-text p[b-7veex1pppz] {
    color: #6c757d;
    line-height: 1.5;
}

.need-details[b-7veex1pppz] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 1rem;
}

.detail-item[b-7veex1pppz] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem;
    background-color: #f8f9fa;
    border-radius: 0.375rem;
    font-size: 0.875rem;
}

.detail-item i[b-7veex1pppz] {
    color: #667eea;
    font-size: 1rem;
    min-width: 1rem;
}

.detail-item span[b-7veex1pppz] {
    color: #495057;
}

.need-card .card-footer[b-7veex1pppz] {
    background-color: #fff;
    border-top: 1px solid #e9ecef;
    padding: 0.75rem 1.25rem;
}

.need-card .card-footer .badge[b-7veex1pppz] {
    font-size: 0.875rem;
    padding: 0.5rem 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Custom badge colors for need types not in Bootstrap */
.badge.bg-pink[b-7veex1pppz] {
    background-color: #e83e8c !important;
}

.badge.bg-purple[b-7veex1pppz] {
    background-color: #6f42c1 !important;
}

.badge.bg-teal[b-7veex1pppz] {
    background-color: #20c997 !important;
}

/* Responsive adjustments */
@media (max-width: 575.98px) {
    .needs-container[b-7veex1pppz] {
        padding: 0.5rem;
    }

    .need-card .card-header h5[b-7veex1pppz] {
        font-size: 1rem;
    }

    .need-card .card-body[b-7veex1pppz] {
        padding: 1rem;
    }

    .need-card[b-7veex1pppz] {
        border-radius: .75rem;
        margin-left: auto;
        margin-right: auto;
    }
}

@media (min-width: 576px) and (max-width: 991.98px) {
    .need-card .card-header h5[b-7veex1pppz] {
        font-size: 1rem;
    }
}

/* Empty state styling */
.alert[b-7veex1pppz] {
    border-radius: 0.5rem;
    padding: 1.5rem;
}

.alert i[b-7veex1pppz] {
    font-size: 1.25rem;
}
/* /Components/Dialogs/MessageBox.razor.rz.scp.css */
/* Backdrop */
.mbox-backdrop[b-db98ejt4sq] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(2px);
    z-index: 1040;
}

/* Wrapper to center */
.mbox-wrap[b-db98ejt4sq] {
    position: fixed;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 1rem;
    z-index: 1050;
}

/* Dialog */
.mbox[b-db98ejt4sq] {
    width: 100%;
    max-width: 560px;
    background: #ffffff;
    color: #111827;
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0,0,0,.25);
    outline: none;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Header */
.mbox-header[b-db98ejt4sq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: .875rem 1rem;
    background: #f8fafc;
    border-bottom: 1px solid #e5e7eb;
}

.mbox-title[b-db98ejt4sq] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    min-width: 0;
}

.mbox-title-text[b-db98ejt4sq] {
    font-weight: 600;
    font-size: 1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Close button */
.mbox-close[b-db98ejt4sq] {
    appearance: none;
    border: none;
    background: transparent;
    font-size: 1.25rem;
    line-height: 1;
    padding: .25rem .35rem;
    cursor: pointer;
    border-radius: .5rem;
}

    .mbox-close:hover[b-db98ejt4sq] {
        background: #e5e7eb;
    }

/* Body */
.mbox-body[b-db98ejt4sq] {
    padding: 1rem;
}

.mbox-message[b-db98ejt4sq] {
    margin: 0;
    line-height: 1.5;
    font-size: .975rem;
}

/* Footer */
.mbox-footer[b-db98ejt4sq] {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    padding: .75rem 1rem 1rem;
}

/* Buttons (theme-agnostic) */
.mbox-btn[b-db98ejt4sq] {
    appearance: none;
    border: 1px solid transparent;
    border-radius: .625rem;
    padding: .5rem .9rem;
    font-weight: 600;
    font-size: .95rem;
    cursor: pointer;
    transition: transform .1s ease, background-color .15s ease, border-color .15s ease, color .15s ease;
}

    .mbox-btn:active[b-db98ejt4sq] {
        transform: scale(.98);
    }

    .mbox-btn.primary[b-db98ejt4sq] {
        background: #3C85AE;
        border-color: #3C85AE;
        color: #fff;
    }

        .mbox-btn.primary:hover[b-db98ejt4sq] {
            background: #2f6a8b;
            border-color: #2f6a8b;
        }

    .mbox-btn.secondary[b-db98ejt4sq] {
        background: #ffffff;
        border-color: #d1d5db;
        color: #111827;
    }

        .mbox-btn.secondary:hover[b-db98ejt4sq] {
            background: #f3f4f6;
        }

    .mbox-btn.danger[b-db98ejt4sq] {
        background: #ef4444;
        border-color: #ef4444;
        color: #fff;
    }

        .mbox-btn.danger:hover[b-db98ejt4sq] {
            background: #dc2626;
            border-color: #dc2626;
        }

/* Icon token (swap for Bootstrap Icons if desired) */
.mbox-icon[b-db98ejt4sq] {
    width: 1.15rem;
    height: 1.15rem;
    display: inline-block;
    border-radius: 50%;
    flex: 0 0 auto;
}

    .mbox-icon.info[b-db98ejt4sq] {
        background: radial-gradient(circle at 50% 40%, #60a5fa 0 45%, #2563eb 46%);
    }

    .mbox-icon.warning[b-db98ejt4sq] {
        background: radial-gradient(circle at 50% 40%, #fbbf24 0 45%, #d97706 46%);
    }

    .mbox-icon.error[b-db98ejt4sq] {
        background: radial-gradient(circle at 50% 40%, #f87171 0 45%, #dc2626 46%);
    }

/* Responsive tweaks */
@media (max-width: 480px) {
    .mbox[b-db98ejt4sq] {
        max-width: 100%;
        border-radius: 12px;
    }

    .mbox-title-text[b-db98ejt4sq] {
        font-size: .95rem;
    }

    .mbox-btn[b-db98ejt4sq] {
        padding: .45rem .75rem;
        font-size: .9rem;
    }
}
/* /Components/Dialogs/MsgBox.razor.rz.scp.css */
/* Overlay */
.messagebox-overlay[b-q8h2tzyg8v] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    padding: 1rem;
}

/* Container */
.messagebox-container[b-q8h2tzyg8v] {
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    min-width: 320px;
    max-width: 500px;
    width: 100%;
    display: flex;
    flex-direction: column;
    animation: messageboxFadeIn-b-q8h2tzyg8v 0.2s ease-out;
}

@keyframes messageboxFadeIn-b-q8h2tzyg8v {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Header */
.messagebox-header[b-q8h2tzyg8v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #e0e0e0;
    background: #f5f5f5;
    border-radius: 8px 8px 0 0;
}

.messagebox-title[b-q8h2tzyg8v] {
    font-size: 1.125rem;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.messagebox-close[b-q8h2tzyg8v] {
    background: none;
    border: none;
    font-size: 1.75rem;
    line-height: 1;
    color: #666;
    cursor: pointer;
    padding: 0;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: background-color 0.2s, color 0.2s;
}

.messagebox-close:hover[b-q8h2tzyg8v] {
    background-color: #e0e0e0;
    color: #333;
}

.messagebox-close:active[b-q8h2tzyg8v] {
    background-color: #d0d0d0;
}

/* Body */
.messagebox-body[b-q8h2tzyg8v] {
    display: flex;
    gap: 1rem;
    padding: 1.5rem 1.25rem;
    align-items: flex-start;
}

.messagebox-icon[b-q8h2tzyg8v] {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    font-weight: bold;
}

.icon-info[b-q8h2tzyg8v] {
    background-color: #e3f2fd;
    color: #1976d2;
}

.icon-warning[b-q8h2tzyg8v] {
    background-color: #fff3e0;
    color: #f57c00;
}

.icon-error[b-q8h2tzyg8v] {
    background-color: #ffebee;
    color: #d32f2f;
}

.messagebox-message[b-q8h2tzyg8v] {
    flex: 1;
    color: #333;
    font-size: 0.9375rem;
    line-height: 1.5;
    word-wrap: break-word;
    padding-top: 0.5rem;
}

/* Footer */
.messagebox-footer[b-q8h2tzyg8v] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-top: 1px solid #e0e0e0;
    background: #fafafa;
    border-radius: 0 0 8px 8px;
}

.messagebox-button[b-q8h2tzyg8v] {
    padding: 0.5rem 1.5rem;
    border: none;
    border-radius: 4px;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s, transform 0.1s;
    min-width: 80px;
}

.messagebox-button:active[b-q8h2tzyg8v] {
    transform: scale(0.98);
}

.button-primary[b-q8h2tzyg8v] {
    background-color: #1976d2;
    color: white;
}

.button-primary:hover[b-q8h2tzyg8v] {
    background-color: #1565c0;
}

.button-primary:active[b-q8h2tzyg8v] {
    background-color: #0d47a1;
}

.button-secondary[b-q8h2tzyg8v] {
    background-color: #e0e0e0;
    color: #333;
}

.button-secondary:hover[b-q8h2tzyg8v] {
    background-color: #d0d0d0;
}

.button-secondary:active[b-q8h2tzyg8v] {
    background-color: #bdbdbd;
}

/* Responsive Design */
@media (max-width: 600px) {
    .messagebox-overlay[b-q8h2tzyg8v] {
        padding: 0.5rem;
    }

    .messagebox-container[b-q8h2tzyg8v] {
        min-width: 280px;
        max-width: 100%;
    }

    .messagebox-header[b-q8h2tzyg8v] {
        padding: 0.875rem 1rem;
    }

    .messagebox-title[b-q8h2tzyg8v] {
        font-size: 1rem;
    }

    .messagebox-body[b-q8h2tzyg8v] {
        padding: 1.25rem 1rem;
        gap: 0.75rem;
    }

    .messagebox-icon[b-q8h2tzyg8v] {
        width: 40px;
        height: 40px;
        font-size: 1.5rem;
    }

    .messagebox-message[b-q8h2tzyg8v] {
        font-size: 0.875rem;
        padding-top: 0.25rem;
    }

    .messagebox-footer[b-q8h2tzyg8v] {
        padding: 0.875rem 1rem;
        gap: 0.5rem;
        flex-wrap: wrap;
    }

    .messagebox-button[b-q8h2tzyg8v] {
        padding: 0.5rem 1.25rem;
        min-width: 70px;
        font-size: 0.8125rem;
    }
}

@media (max-width: 400px) {
    .messagebox-container[b-q8h2tzyg8v] {
        min-width: 260px;
    }

    .messagebox-footer[b-q8h2tzyg8v] {
        flex-direction: column;
    }

    .messagebox-button[b-q8h2tzyg8v] {
        width: 100%;
        min-width: unset;
    }
}

/* Focus styles for accessibility */
.messagebox-close:focus-visible[b-q8h2tzyg8v],
.messagebox-button:focus-visible[b-q8h2tzyg8v] {
    outline: 2px solid #1976d2;
    outline-offset: 2px;
}
/* /Components/Dialogs/NeedCommitmentModal.razor.rz.scp.css */
/* =====================================================
   NeedCommitmentModal — isolated styles
   ===================================================== */

/* ── Backdrop ── */
.modal-backdrop-overlay[b-dx0o7mjm30] {
    position: fixed;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 1060;
    animation: fadeInBackdrop-b-dx0o7mjm30 0.2s ease;
}

@keyframes fadeInBackdrop-b-dx0o7mjm30 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* ── Modal container ── */
.commitment-modal[b-dx0o7mjm30] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    overflow-x: hidden;
    overflow-y: auto;
    animation: slideInModal-b-dx0o7mjm30 0.22s ease;
}

@keyframes slideInModal-b-dx0o7mjm30 {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ── Dialog sizing ── */
.commitment-modal-dialog[b-dx0o7mjm30] {
    /* Comfortable on desktop, full-width on mobile */
    max-width: 70%;
    margin: 2.5rem auto;
}

@media (max-width: 575.98px) {
    .commitment-modal-dialog[b-dx0o7mjm30] {
        margin: 0.5rem;
        margin-top: max(0.5rem, env(safe-area-inset-top));
        max-width: calc(100vw - 1rem);
    }
}

/* Ensure modal-dialog-centered doesn't pull modal behind navbar on small screens */
.commitment-modal .modal-dialog-centered[b-dx0o7mjm30] {
    min-height: calc(100% - 2rem);
    align-items: flex-start;
}

@media (min-width: 576px) {
    .commitment-modal .modal-dialog-centered[b-dx0o7mjm30] {
        align-items: center;
        min-height: calc(100% - 3.5rem);
    }
}

/* ── Header ── */
.commitment-modal-header[b-dx0o7mjm30] {
    background: linear-gradient(135deg, #1a56db 0%, #0d3b8e 100%);
    color: #fff;
    border-bottom: none;
    padding: 1rem 1.25rem;
    border-radius: calc(0.375rem - 1px) calc(0.375rem - 1px) 0 0;
}

    .commitment-modal-header .modal-title[b-dx0o7mjm30] {
        font-size: 1.1rem;
        font-weight: 600;
    }

/* ── Body — remove extra padding so child cards look flush ── */
.commitment-modal .modal-body[b-dx0o7mjm30] {
    background-color: #f8f9fa;
}

/* ── Remove the card's outer shadow inside the modal ── */
.commitment-modal .commitment-card[b-dx0o7mjm30] {
    box-shadow: none !important;
    border: none !important;
    border-radius: 0.5rem;
    background-color: #fff;
}
/* /Components/Dialogs/NeedInstructionsDialog.razor.rz.scp.css */
.need-dialog-backdrop[b-r2jln265ls] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 1040;
}

.need-dialog-shell[b-r2jln265ls] {
    position: fixed;
    inset: 0;
    z-index: 1050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.need-dialog-card[b-r2jln265ls] {
    width: min(800px, 100%);
    max-height: 90vh;
    background: #fff;
    border-radius: 0.75rem;
    box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.20);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.need-dialog-header[b-r2jln265ls] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.25rem;
    border-bottom: 1px solid #dee2e6;
}

.need-dialog-body[b-r2jln265ls] {
    padding: 1rem 1.25rem;
    overflow-y: auto;
}

.need-dialog-footer[b-r2jln265ls] {
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-top: 1px solid #dee2e6;
}

@media (max-width: 576px) {
    .need-dialog-shell[b-r2jln265ls] {
        padding: 0.5rem;
        align-items: flex-end;
    }

    .need-dialog-card[b-r2jln265ls] {
        width: 100%;
        max-height: 95vh;
        border-radius: 1rem 1rem 0 0;
    }

    .need-dialog-footer[b-r2jln265ls] {
        flex-direction: column;
    }

        .need-dialog-footer .btn[b-r2jln265ls] {
            width: 100%;
        }
}
/* /Components/Dialogs/PopupDialog.razor.rz.scp.css */
/* Backdrop covers the screen */
.nr-modal-backdrop[b-kzy1q4rp1y] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: saturate(120%) blur(1px);
    z-index: 1000;
}

/* Shell centers the modal and handles small-screen padding */
.nr-modal-shell[b-kzy1q4rp1y] {
    position: fixed;
    inset: 0;
    z-index: 1001;
    display: grid;
    place-items: center;
    padding: 1rem;
}

/* The dialog panel */
.nr-modal[b-kzy1q4rp1y] {
    width: 100%;
    max-width: 640px; /* Desktop cap */
    background: #ffffff;
    color: #111827;
    border-radius: 14px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25), 0 2px 8px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: nr-modal-in-b-kzy1q4rp1y 140ms ease-out;
}

/* Header */
.nr-modal-header[b-kzy1q4rp1y] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1rem;
    border-bottom: 1px solid #e5e7eb;
    background: #f8fafc;
}

.nr-modal-title[b-kzy1q4rp1y] {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0;
}

/* Close button (X) */
.nr-modal-close[b-kzy1q4rp1y] {
    border: none;
    background: transparent;
    font-size: 1.125rem;
    line-height: 1;
    padding: 0.25rem 0.5rem;
    border-radius: 8px;
    cursor: pointer;
}

    .nr-modal-close:hover[b-kzy1q4rp1y] {
        background: #eef2f7;
    }

    .nr-modal-close:focus[b-kzy1q4rp1y] {
        outline: 2px solid #93c5fd;
        outline-offset: 2px;
    }

/* Body */
.nr-modal-body[b-kzy1q4rp1y] {
    padding: 1rem;
    display: grid;
    gap: 0.75rem;
}

.nr-modal-message[b-kzy1q4rp1y] {
    margin: 0;
    color: #374151;
}

.nr-modal-label[b-kzy1q4rp1y] {
    font-size: 0.875rem;
    color: #4b5563;
}

.nr-modal-input[b-kzy1q4rp1y] {
    width: 100%;
    padding: 0.625rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    font-size: 1rem;
    outline: none;
}

    .nr-modal-input:focus[b-kzy1q4rp1y] {
        border-color: #3b82f6;
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25);
    }

/* Footer */
.nr-modal-footer[b-kzy1q4rp1y] {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
    padding: 0.875rem 1rem;
    border-top: 1px solid #e5e7eb;
    background: #f9fafb;
}

/* Buttons (framework-agnostic, all styling here) */
.nr-btn[b-kzy1q4rp1y] {
    border: 1px solid transparent;
    border-radius: 10px;
    padding: 0.5rem 0.875rem;
    font-size: 0.95rem;
    cursor: pointer;
    transition: transform 60ms ease, box-shadow 120ms ease, background 120ms ease;
}

    .nr-btn:active[b-kzy1q4rp1y] {
        transform: translateY(1px);
    }

.nr-btn-primary[b-kzy1q4rp1y] {
    background: #3b82f6;
    color: #ffffff;
    box-shadow: 0 4px 10px rgba(59, 130, 246, 0.35);
}

    .nr-btn-primary:hover[b-kzy1q4rp1y] {
        background: #2563eb;
    }

    .nr-btn-primary:disabled[b-kzy1q4rp1y] {
        background: #93c5fd;
        box-shadow: none;
        cursor: not-allowed;
    }

.nr-btn-ghost[b-kzy1q4rp1y] {
    background: transparent;
    color: #111827;
    border-color: #d1d5db;
}

    .nr-btn-ghost:hover[b-kzy1q4rp1y] {
        background: #f3f4f6;
    }

/* Responsiveness */
@media (max-width: 480px) {
    .nr-modal[b-kzy1q4rp1y] {
        border-radius: 12px;
        max-width: 100%;
    }

    .nr-modal-title[b-kzy1q4rp1y] {
        font-size: 1rem;
    }

    .nr-btn[b-kzy1q4rp1y] {
        padding: 0.5rem 0.75rem;
    }
}

/* Entry animation */
@keyframes nr-modal-in-b-kzy1q4rp1y {
    from {
        opacity: 0;
        transform: translateY(8px) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
/* /Components/Dialogs/SearchDialog.razor.rz.scp.css */
/* Backdrop covers the screen */
.nr-modal-backdrop[b-shtu6g82ag] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: saturate(120%) blur(1px);
    z-index: 1000;
}

/* Shell centers the modal and handles small-screen padding */
.nr-modal-shell[b-shtu6g82ag] {
    position: fixed;
    inset: 0;
    z-index: 1001;
    display: grid;
    place-items: center;
    padding: 1rem;
}

/* The dialog panel */
.nr-modal[b-shtu6g82ag] {
    width: 100%;
    max-width: 640px; /* Desktop cap */
    background: #ffffff;
    color: #111827;
    border-radius: 14px;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.25), 0 2px 8px rgba(0, 0, 0, 0.15);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    animation: nr-modal-in-b-shtu6g82ag 140ms ease-out;
}

/* Header */
.nr-modal-header[b-shtu6g82ag] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.875rem 1rem;
    border-bottom: 1px solid #e5e7eb;
    background: #f8fafc;
}

.nr-modal-title[b-shtu6g82ag] {
    font-size: 1.125rem;
    font-weight: 600;
    margin: 0;
}

/* Close button (X) */
.nr-modal-close[b-shtu6g82ag] {
    border: none;
    background: transparent;
    font-size: 1.125rem;
    line-height: 1;
    padding: 0.25rem 0.5rem;
    border-radius: 8px;
    cursor: pointer;
}

    .nr-modal-close:hover[b-shtu6g82ag] {
        background: #eef2f7;
    }

    .nr-modal-close:focus[b-shtu6g82ag] {
        outline: 2px solid #93c5fd;
        outline-offset: 2px;
    }

/* Body */
.nr-modal-body[b-shtu6g82ag] {
    padding: 1rem;
    display: grid;
    gap: 0.75rem;
}

.nr-modal-message[b-shtu6g82ag] {
    margin: 0;
    color: #374151;
}

.nr-modal-label[b-shtu6g82ag] {
    font-size: 0.875rem;
    color: #4b5563;
}

.nr-modal-input[b-shtu6g82ag] {
    width: 100%;
    padding: 0.625rem 0.75rem;
    border: 1px solid #d1d5db;
    border-radius: 10px;
    font-size: 1rem;
    outline: none;
}

    .nr-modal-input:focus[b-shtu6g82ag] {
        border-color: #3b82f6;
        box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.25);
    }

/* Footer */
.nr-modal-footer[b-shtu6g82ag] {
    display: flex;
    gap: 0.5rem;
    justify-content: flex-end;
    padding: 0.875rem 1rem;
    border-top: 1px solid #e5e7eb;
    background: #f9fafb;
}

/* Buttons (framework-agnostic, all styling here) */
.nr-btn[b-shtu6g82ag] {
    border: 1px solid transparent;
    border-radius: 10px;
    padding: 0.5rem 0.875rem;
    font-size: 0.95rem;
    cursor: pointer;
    transition: transform 60ms ease, box-shadow 120ms ease, background 120ms ease;
}

.nr-btn:active[b-shtu6g82ag] {
    transform: translateY(1px);
}

.nr-btn-primary[b-shtu6g82ag] {
    background: #3b82f6;
    color: #ffffff;
    box-shadow: 0 4px 10px rgba(59, 130, 246, 0.35);
}

.nr-btn-primary:hover[b-shtu6g82ag] {
    background: #2563eb;
}

.nr-btn-primary:disabled[b-shtu6g82ag] {
    background: #93c5fd;
    box-shadow: none;
    cursor: not-allowed;
}

.nr-btn-ghost[b-shtu6g82ag] {
    background: #828283;
    color: white;
    border-color: #d1d5db;
}

    .nr-btn-ghost:hover[b-shtu6g82ag] {
        background: #606161;
        /*#fff*/
    }

/* Responsiveness */
@media (max-width: 480px) {
    .nr-modal[b-shtu6g82ag] {
        border-radius: 12px;
        max-width: 100%;
    }

    .nr-modal-title[b-shtu6g82ag] {
        font-size: 1rem;
    }

    .nr-btn[b-shtu6g82ag] {
        padding: 0.5rem 0.75rem;
    }
}

/* Entry animation */
@keyframes nr-modal-in-b-shtu6g82ag {
    from {
        opacity: 0;
        transform: translateY(8px) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
/* /Components/Dialogs/UserCommitmentsDialog.razor.rz.scp.css */

/* Lower the dimmer (backdrop) opacity */
.modal-backdrop.show[b-4w3r0xfevs] {
    opacity: var(--backdrop-opacity, 0.5); /* default 0.5; override via inline style */
}

:host[b-4w3r0xfevs] {
    display: block;
}

.modal-content[b-4w3r0xfevs] {
    background-color: var(--bs-body-bg); /* or #fff */
}
/* /Components/ExpandableText.razor.rz.scp.css */
.expandable-text-root[b-wx94afyph3] {
    display: inline-flex;
    align-items: flex-start;
    cursor: pointer;
}

/* Icon – left, tight, blue, with hover glow */
.expand-toggle-icon[b-wx94afyph3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.25rem;
    min-width: 1.25rem;
    transition: color 0.15s ease, text-shadow 0.15s ease, transform 0.15s ease;
}

/* Slight blue hover glow + lift */
.expandable-text-root:hover .expand-toggle-icon[b-wx94afyph3] {
    color: var(--bs-primary);
    text-shadow: 0 0 4px rgba(13, 110, 253, 0.4);
    transform: translateY(-1px);
}

/* Text fade/slide animation */
.expandable-text-inner[b-wx94afyph3] {
    display: inline-block;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

    .expandable-text-inner.collapsed[b-wx94afyph3] {
        opacity: 0.85;
        transform: translateY(1px);
    }

    .expandable-text-inner.expanded[b-wx94afyph3] {
        opacity: 1;
        transform: translateY(0);
    }
/* /Components/NeedCards/NeedsCardList.razor.rz.scp.css */
:host[b-966quzks3k] {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

.heart-with-count[b-966quzks3k] {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.heart-count[b-966quzks3k] {
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.60rem;
    font-weight: 700;
    color: white;
    pointer-events: none;
}

.icon-action[b-966quzks3k] {
    transition: transform .15s ease, opacity .15s ease;
}

    .icon-action:hover[b-966quzks3k] {
        transform: scale(1.15);
        opacity: .85;
        cursor: pointer;
        color: navy !important;
    }

.need-card.critical-border[b-966quzks3k] {
    border: 4px solid #dc3545 !important;
}

.need-card[b-966quzks3k] {
    border-radius: 1rem;
    overflow: hidden;
    transition: transform 120ms ease, box-shadow 120ms ease;
    max-width: 100%;
    border: 1px solid gray !important;
    margin-left: auto;
    margin-right: auto;
}

.need-card:hover[b-966quzks3k] {
    transform: translateY(-2px);
    box-shadow: 0 0.5rem 1.25rem rgba(0,0,0,.08);
}

@media (max-width: 575px) {
    .card-alignment[b-966quzks3k] {
        justify-content: center
    }

    .need-card[b-966quzks3k] {
        width: 100%;
        max-width: 100%;
        margin-left: auto;
        margin-right: auto;
    }

}

.need-card-header[b-966quzks3k] {
    background-image: linear-gradient( 90deg, #79aee0 0%, #6fa0d7 30%, #538cc6 60%, #4977D7 100% );
    color: #0f1b33;
    font-weight: 600;
    border-bottom: none;
    padding: 1rem 1.25rem;
}

.need-card-header h5[b-966quzks3k] {
    font-size: 1.1rem;
    margin-bottom: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Legend */
.needs-legend .legend-title[b-966quzks3k] {
    font-weight: 600;
}

.needs-legend .badge[b-966quzks3k] {
    margin-right: .375rem;
}


/* Tighten spacing on narrow phones */
@media (max-width: 400px) {
    .need-card .card-body[b-966quzks3k] {
        padding: .9rem;
    }
}

@media (max-width: 575px) {
    .need-card[b-966quzks3k] {
        border-radius: .75rem;
        box-shadow: 0 .25rem .75rem rgba(0,0,0,.05);
        /*width: 90%;*/
        /*max-width: 90%;*/
    }
}

/* Make all badges pill-like and bold */
.badge[b-966quzks3k] {
    border-radius: 999px;
    padding: .45rem .7rem;
    font-weight: 600;
}

.detail-item[b-966quzks3k] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem;
    background-color: #f8f9fa;
    border-radius: 0.375rem;
    font-size: 0.875rem;
}

.detail-item i[b-966quzks3k] {
    color: #667eea;
    font-size: 1rem;
    min-width: 1rem;
}

    .detail-item span[b-966quzks3k] {
        color: #495057;
    }





.min-w-0[b-966quzks3k] {
    min-width: 0;
}
.need-card-header[b-966quzks3k] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: .5rem;
    min-width: 0;
    background-image: linear-gradient(90deg, #79aee0 0%, #6fa0d7 30%, #538cc6 60%, #4977D7 100%);
    color: #0f1b33;
    font-weight: 600;
    border-bottom: none;
    padding: 1rem 1.25rem;
}

.need-card-header-main[b-966quzks3k] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: .5rem;
    overflow: hidden;
}

.need-card-header-text[b-966quzks3k] {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
}

.need-card-header-flag[b-966quzks3k] {
    flex: 0 0 auto;
    line-height: 1;
}

/* /Components/NeedDetailsGrid.razor.rz.scp.css */

.edit-icon[b-izm3hhgzgn] {
    font-size: 1rem;
    cursor: pointer;
    color: #3C85AE;
    border: none !important;
    transition: color 0.15s ease, transform 0.15s ease;
}

    .edit-icon:hover[b-izm3hhgzgn] {
        color: black !important;
        transform: scale(1.1);
    }

/*.need-grid-list-page {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}*/

.need-grid-list-page[b-izm3hhgzgn] {
    width: 100%;
    min-width: 0;
    overflow-x: auto;
}

.page-toolbar[b-izm3hhgzgn] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.grid-outer-shell[b-izm3hhgzgn] {
    width: 100%;
    min-width: 0;
}

.grid-horizontal-scroll[b-izm3hhgzgn] {
    width: 100%;
    overflow-x: hidden;
    overflow-y: hidden;
}


.grid-min-width[b-izm3hhgzgn] {
    min-width: 0;
}



.commitment-link[b-izm3hhgzgn] {
    font-weight: 600;
    color: #2a6edb;
    text-decoration: none;
    cursor: pointer;
    padding: 0 !important;
    margin: 0 !important;
}

.commitment-link:hover[b-izm3hhgzgn] {
    text-decoration: underline;
}

.grid-select-checkbox[b-izm3hhgzgn] {
    cursor: pointer;
    transform: scale(0.9);
}

[b-izm3hhgzgn] .need-grid {
    width: 100% !important;
}

    /* Prevent Syncfusion from creating its own horizontal scrollbars */
    [b-izm3hhgzgn] .need-grid .e-gridheader,
    [b-izm3hhgzgn] .need-grid .e-headercontent,
    [b-izm3hhgzgn] .need-grid .e-gridcontent,
    [b-izm3hhgzgn] .need-grid .e-content {
        overflow-x: hidden !important;
    }

    /* Keep vertical scrolling inside the grid body */
    [b-izm3hhgzgn] .need-grid .e-gridcontent {
        overflow-y: hidden !important;
    }

    /* Header */
    [b-izm3hhgzgn] .need-grid .e-gridheader {
        background-color: #f4f6f9;
        border-bottom: 1px solid #d9d9d9;
    }

    /* Compact cell styling */
    [b-izm3hhgzgn] .need-grid .e-rowcell {
        font-size: 0.82rem;
        padding: 4px 8px;
    }

    [b-izm3hhgzgn] .need-grid .e-headercell {
        font-size: 0.82rem;
        font-weight: 600;
        padding: 6px 8px;
    }

    /* Slightly tighter row height */
    [b-izm3hhgzgn] .need-grid .e-row {
        line-height: 1.2;
    }

    /* Row styling */
    [b-izm3hhgzgn] .need-grid .e-altrow {
        background-color: #fafbfd;
    }

    [b-izm3hhgzgn] .need-grid .e-row:hover {
        background-color: #eef4ff;
    }

    /* Border cleanup */
    [b-izm3hhgzgn] .need-grid .e-gridcontent {
        /*max-height: 650px;*/
        border-top: none;
        border-radius: 0 0 0.375rem 0.375rem;
    }

    [b-izm3hhgzgn] .need-grid .e-content {
        max-height: 650px;
    }

    [b-izm3hhgzgn] .need-grid .e-rowcell,
    [b-izm3hhgzgn] .need-grid .e-headercell {
        border-color: #e3e6ea;
    }

    /* Toolbar */
    [b-izm3hhgzgn] .need-grid .e-toolbar {
        padding: 6px;
        border-bottom: 1px solid #dcdcdc;
        border-radius: 0.375rem 0.375rem 0 0;
    }

    /* Pager */
    [b-izm3hhgzgn] .need-grid .e-gridpager {
        font-size: 0.82rem;
        padding: 4px;
    }


    /* Completely remove Syncfusion horizontal scrollbar */
    [b-izm3hhgzgn] .need-grid .e-gridcontent {
        overflow-x: hidden !important;
        scrollbar-width: none; /* Firefox */
    }

        [b-izm3hhgzgn] .need-grid .e-gridcontent::-webkit-scrollbar {
            display: none; /* Chrome / Edge / Safari */
        }

    /* Prevent header area from showing horizontal scroll */
    [b-izm3hhgzgn] .need-grid .e-headercontent {
        overflow-x: hidden !important;
    }


/*.need-name-tooltip {
    cursor: help;
}
*/
/*.need-name-tooltip {
    display: inline-block;
    max-width: 170px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: help;
}
*/
.need-name-tooltip[b-izm3hhgzgn] {
    display: flex;
    align-items: center;
    height: 100%;
    min-height: 100%;
    width: 100%;
    font-size: 0.90rem;
    font-weight: 400;
    line-height: 1.2;
    color: inherit;
    cursor: help;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.need-name-tooltip:hover[b-izm3hhgzgn] {
    color: #2a6edb;
    text-decoration: underline;
}

.need-hover-card[b-izm3hhgzgn] {
    max-width: 340px;
    padding: 0.15rem 0.05rem;
}

.need-hover-section-title[b-izm3hhgzgn] {
    font-size: 0.78rem;
    font-weight: 700;
    color: lightblue;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 0.2rem;
}

.need-hover-description[b-izm3hhgzgn],
.need-hover-instructions[b-izm3hhgzgn] {
    font-size: 0.82rem;
    line-height: 1.35;
    color: white;
}

.need-hover-description[b-izm3hhgzgn] {
    margin-bottom: 0.6rem;
    padding-bottom: 0.45rem;
    border-bottom: 1px solid #e5e7eb;
}

[b-izm3hhgzgn] .need-info-tooltip.e-tooltip-wrap {
    border-radius: 0.5rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.12);
}

[b-izm3hhgzgn] .need-info-tooltip .e-tip-content {
    padding: 0.65rem 0.8rem;
}
/* /Layout/MainLayout.razor.rz.scp.css */
.maintenance-container[b-m5mizdx8ip] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 20px;
}

.maintenance-card[b-m5mizdx8ip] {
    max-width: 520px;
    width: 100%;
    padding: 30px;
    text-align: center;
    border-radius: 10px;
    background-color: #ffffff;
    box-shadow: 0 6px 20px rgba(0,0,0,.15);
}

.maintenance-icon[b-m5mizdx8ip] {
    font-size: 2.8rem;
    color: #3C85AE;
    margin-bottom: 15px;
}

.maintenance-title[b-m5mizdx8ip] {
    margin-bottom: 10px;
    font-weight: 600;
}

.maintenance-message[b-m5mizdx8ip] {
    color: red;
    margin-bottom: 10px;
    font-size: 1.0rem;
    font-weight: 700;

}

.maintenance-return[b-m5mizdx8ip] {
    font-size: 0.9rem;
    color: #666;
}



.user-menu[b-m5mizdx8ip] {
    position: absolute;
    right: 0;
    top: 38px;
    width: 180px;
    z-index: 9999 !important;
}

.user-menu .dropdown-item[b-m5mizdx8ip] {
    padding: .5rem .75rem;
    cursor: pointer;
}

.user-menu .dropdown-item:hover[b-m5mizdx8ip] {
    background: #f1f1f1;
}

.app-shell[b-m5mizdx8ip] {
    --sidebar-open: 200px;
    --sidebar-mini: 64px;
    display: grid;
    grid-template-columns: var(--sidebar-open) 1fr;
    grid-template-rows: auto 1fr;
    min-height: 100vh;
    position: relative;
}

    /* Column widths per mode */
    .app-shell.mode-open[b-m5mizdx8ip] {
        grid-template-columns: var(--sidebar-open) 1fr;
    }

    .app-shell.mode-mini[b-m5mizdx8ip] {
        grid-template-columns: var(--sidebar-mini) 1fr;
    }

    .app-shell.mode-closed[b-m5mizdx8ip] {
        grid-template-columns: 0px 1fr;
    }


.header-bar[b-m5mizdx8ip] {
    display: flex;
    justify-content: space-between; /* pushes first item left, last item right */
    align-items: center; /* vertically center them */
    padding: 0.5rem 1rem;
    background-color: #f5f5f5; /* optional */
}

.left-btn[b-m5mizdx8ip],
.right-btn[b-m5mizdx8ip] {
    padding: 0.4rem 0.8rem;
    border: none;
    background-color: #3C85AE;
    color: white;
    border-radius: 4px;
    cursor: pointer;
}


/* Sidebar */
.sidebar[b-m5mizdx8ip] {
    grid-row: 1 / span 2;
    grid-column: 1;
    border-right: 1px solid #e5e7eb;
    /*background-color: red;*/
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
    transform: translateX(0);
    transition: transform 180ms ease, width 180ms ease;
    overflow: hidden;
    z-index: 1020;
}

.sidebar-inner[b-m5mizdx8ip] {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.sidebar-header[b-m5mizdx8ip] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .5rem .5rem;
    border-bottom: 1px solid #f1f3f5;
}

/* Mini width */
.app-shell.mode-mini .sidebar[b-m5mizdx8ip] {
    width: var(--sidebar-mini);
}

.app-shell.mode-open .sidebar[b-m5mizdx8ip] {
    width: var(--sidebar-open);
}

/* CLOSED (desktop) – slide fully out so it doesn't intercept focus/clicks */
.app-shell.mode-closed .sidebar[b-m5mizdx8ip] {
    transform: translateX(-100%);
}

/* MAIN */
.main[b-m5mizdx8ip] {
    grid-column: 2;
    display: grid;
    grid-template-rows: auto 1fr;
    min-width: 0;
}

.topbar[b-m5mizdx8ip] {
    padding: 0;
    margin: 0;
    border-bottom: 2px solid #404040;
    max-width: 100%;
    height: 3.0rem;
    position: sticky;
    z-index: 9999;
    /*background-image: linear-gradient(90deg, #3c3f44 0%, #b6bcc3 30%);*/
    background-image: linear-gradient(90deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.topbar-span[b-m5mizdx8ip] {
    color: white;
    text-shadow: 0 1px 2px rgba(0,0,0,0.4);
    font-weight:700;
    font-size: 1.5rem;
}

.topbar-span-user[b-m5mizdx8ip]
 {
    color: white;
    text-shadow: 0 1px 2px rgba(0,0,0,0.4);
    font-weight: 500;
    font-size: 1.0rem;
}

.content[b-m5mizdx8ip] {
    padding: 0.75rem;
    max-width: 99%;
}

/* MOBILE overlay + backdrop */
.backdrop[b-m5mizdx8ip] {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    display: none;
    z-index: 1015;
    border: none;
}

@media (max-width: 991.98px) {
    .content[b-m5mizdx8ip] {
        padding: 0.75rem;
        max-width: 95%;
    }

    .sidebar[b-m5mizdx8ip] {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        box-shadow: 0 10px 30px rgba(0,0,0,.25);
    }

    .app-shell.mode-open .backdrop[b-m5mizdx8ip],
    .app-shell.mode-mini .backdrop[b-m5mizdx8ip] {
        display: block;
    }

    .app-shell.mode-closed .backdrop[b-m5mizdx8ip] {
        display: none;
    }

    .app-shell.mode-open[b-m5mizdx8ip],
    .app-shell.mode-mini[b-m5mizdx8ip],
    .app-shell.mode-closed[b-m5mizdx8ip] {
        grid-template-columns: 1fr;
    }

    .main[b-m5mizdx8ip] {
        grid-column: 1;
    }
}

/* --- The important part: reach into child components with ::deep --- */

/* Hide header text & the “Mini” button while mini; keep Open/Close */
.app-shell.mode-mini .sidebar-header span[b-m5mizdx8ip] {
    display: none !important;
}

.app-shell.mode-mini .sidebar-header button[title="Mini"][b-m5mizdx8ip] {
    display: none !important;
}

/* Only icons in mini — hide link text */
.app-shell.mode-mini[b-m5mizdx8ip]  .nav-text {
    display: none !important;
}

/* Center icons, remove extra spacing in mini */
.app-shell.mode-mini[b-m5mizdx8ip]  .nav {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.app-shell.mode-mini[b-m5mizdx8ip]  .nav-link {
    justify-content: center;
    width: 100%;
    padding: .75rem 0;
}

.app-shell.mode-mini[b-m5mizdx8ip]  .nav-icon {
    margin: 0;
    font-size: 1.4rem;
}

/* Optional: shrink left/right padding when open */
.app-shell.mode-open[b-m5mizdx8ip]  .nav-link {
    padding: .5rem .75rem;
}

/* Base nav look */
[b-m5mizdx8ip] .nav-link {
    color: #333;
    border-radius: .5rem;
    transition: background .15s;
}

[b-m5mizdx8ip] .nav-link:hover {
    background: #f2f4f7;
    color: #111;
}

[b-m5mizdx8ip] .nav-icon {
    width: 1.25rem;
    text-align: center;
    margin-right: .5rem;
}


/* Remove borders and focus rings from toggle buttons inside this layout only */
[b-m5mizdx8ip] .btn.btn-outline-secondary {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    color: inherit;
}

[b-m5mizdx8ip] .btn.btn-outline-secondary:hover,
[b-m5mizdx8ip] .btn.btn-outline-secondary:active,
[b-m5mizdx8ip] .btn.btn-outline-secondary:focus,
[b-m5mizdx8ip] .btn.btn-outline-secondary:focus-visible{
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    outline: none !important;
    background-color: transparent !important;
    color: inherit;
}

.btn.btn-outline-secondary:hover[b-m5mizdx8ip] {
    background-color: rgba(0,0,0,0.05) !important; /* subtle tint */
}


/* Mini mode (desktop only) */
@media (min-width: 992px) {
    .app-shell.mini .app-sidebar[b-m5mizdx8ip] {
        --sidebar-w: 72px;
    }

    /* Hide labels in mini mode; keep icons centered */
    .app-shell.mini .nav .nav-link .nav-label[b-m5mizdx8ip] {
        display: none;
    }

    .app-shell.mini .nav .nav-link[b-m5mizdx8ip] {
        justify-content: center; /* center icon */
    }

        .app-shell.mini .nav .nav-link i[b-m5mizdx8ip],
        .app-shell.mini .nav .nav-link .bi[b-m5mizdx8ip] {
            margin-right: 0 !important; /* no gap without label */
        }
}


.app-content[b-m5mizdx8ip] {
    position: relative;
}
/* ensure a positioning context */

/*.content-menu-button {
    position: absolute;
    top: 0.75rem;
    left: 0.75rem;  now this is relative to content, not behind sidebar 
    z-index: 10;  enough to be above content 
    border-radius: 50%;
    width: 2.75rem;
    height: 2.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    background: var(--bs-primary);
    color: #fff;
    border: none;
    box-shadow: 0 3px 10px rgba(0,0,0,.25);
    transition: transform .15s ease-in-out;
}

    .content-menu-button:hover {
        transform: scale(1.08);
    }
*/

/* Floating button (lower-right) */
.floating-menu-button[b-m5mizdx8ip] {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 2000;
    border: 0;
    border-radius: 50%;
    width: 2.75rem;
    height: 2.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    background: var(--bs-primary);
    color: #fff;
    box-shadow: 0 3px 10px rgba(0,0,0,.25);
}


.floating-menu-button:hover[b-m5mizdx8ip] {
    transform: scale(1.08);
}
/* /Layout/MenuModal.razor.rz.scp.css */
/* Backdrop */
.mbox-backdrop[b-qmo41xb3uu] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(2px);
    z-index: 1040;
}

/* The dialog/card should shrink to fit nav content */
.mbox[b-qmo41xb3uu] {
    display: inline-block; /* shrink to fit width + height of content */
    width: auto;
    height: auto; /* <-- ensures it matches NavMenu height */
    max-height: 100vh; /* prevent overflowing screen */
    overflow-y: auto; /* scrollbar if menu is very tall */
    background: var(--bs-body-bg, #fff);
    border-radius: .5rem;
    box-shadow: 0 8px 24px rgba(0,0,0,.25);
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

/* Center the dialog horizontally inside the wrap */
.mbox-wrap[b-qmo41xb3uu] {
    min-height: 100%;
    display: flex; /* center align horizontally */
    justify-content: center;
    align-items: flex-start; /* top, not vertical center */
    padding-top: 2rem; /* space from top */
}

/* Makes sure the nav itself has a stable width */
.mbox-body[b-qmo41xb3uu] {
    display: block;
    padding: 0; /* optional */
    height: auto; /* <-- important */
    max-height: inherit; /* follows mbox max-height */
}

.sidebar-header[b-qmo41xb3uu] {
    display: flex;
    align-items: center;
    gap: .5rem;
    padding: .5rem .5rem;
    border-bottom: 1px solid #f1f3f5;
}

/* Dialog */
/*.mbox {
    width: 100%;
    max-width: 560px;
    background: #ffffff;
    color: #111827;
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0,0,0,.25);
    outline: none;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}*/


/* Wrapper to center */
/*.mbox-wrap {
    position: fixed;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 1rem;
    z-index: 1050;
}*/

/* Body */
/*.mbox-body {
    padding: 1rem;
}*/




/* /Layout/Scratch/MainLayout01.razor.rz.scp.css */
.page[b-9x221y0gpk] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-9x221y0gpk] {
    flex: 1;
}

.top-bar[b-9x221y0gpk] {
    position: sticky; /* or fixed if you want it always visible */
    top: 0;
    display: flex;
    justify-content: space-between; /* left/right layout */
    align-items: center;
    background-color: whitesmoke; /* your brand color */
    color: black;
    height: 60px;
    padding: 0 1rem;
    z-index: 10;
    /* border-bottom: 2px solid #2f6a8c; */
}

.top-bar .left[b-9x221y0gpk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.top-bar .left .title[b-9x221y0gpk] {
    font-size: 1.2rem;
    font-weight: 600;
}

.top-bar .right i[b-9x221y0gpk] {
    font-size: 1.2rem;
    cursor: pointer;
}

.sidebar[b-9x221y0gpk] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

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

    .top-row[b-9x221y0gpk]  a, .top-row[b-9x221y0gpk]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-9x221y0gpk]  a:hover, .top-row[b-9x221y0gpk]  .btn-link:hover {
        text-decoration: underline;
    }

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

@media (max-width: 640.98px) {
    .top-row[b-9x221y0gpk] {
        justify-content: space-between;
    }

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

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

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

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

    .top-row.auth[b-9x221y0gpk]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-9x221y0gpk], article[b-9x221y0gpk] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}
/* /Layout/Scratch/MainLayoutSF.razor.rz.scp.css */
/* /Layout/Scratch/NavMenu01.razor.rz.scp.css */
.navbar-toggler[b-2a3z0w06gl] {
    background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-2a3z0w06gl] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
    /*background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #347B98 70%);*/
}

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

.bi[b-2a3z0w06gl] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-2a3z0w06gl] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-2a3z0w06gl] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-2a3z0w06gl] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-2a3z0w06gl] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

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

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

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

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

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

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

    .collapse[b-2a3z0w06gl] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }

    .nav-scrollable[b-2a3z0w06gl] {
        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
        background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #347B98 70%);
    }
}
/* /Layout/Scratch/QQQMenuModal.razor.rz.scp.css */
/* Modal shell (these elements are in THIS component’s DOM) */
#menuModal .modal-content[b-avqfban4q1] {
    border-radius: 0.75rem;
    box-shadow: 0 12px 30px rgba(0,0,0,.20);
    background-color: var(--bs-modal-bg, #fff);
}

#menuModal .modal-header[b-avqfban4q1] {
    padding: .6rem .8rem;
}

#menuModal .modal-body[b-avqfban4q1] {
    padding: 0;
}

/* Reach INTO the child NavMenu component */
#menuModal[b-avqfban4q1] (nav.nav) {
    padding: .5rem;
}

#menuModal[b-avqfban4q1] (.nav .nav-link) {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .55rem .9rem;
    border-radius: .5rem;
    color: var(--bs-body-color);
    text-decoration: none;
    transition: background .15s ease, transform .15s ease;
}

#menuModal[b-avqfban4q1] (.nav .nav-link:hover) {
    background: rgba(0,0,0,.07);
    transform: translateX(3px);
}

#menuModal[b-avqfban4q1] (.nav .nav-link .bi),
#menuModal[b-avqfban4q1] (.nav .nav-link i) {
    font-size: 1.15rem;
    line-height: 1;
}

/* Optional compact mode if you add a "compact" class to the modal root */
#menuModal.compact[b-avqfban4q1] (.nav .nav-link) {
    padding: .35rem .65rem;
    gap: .45rem;
}
/* /Layout/SideMenu.razor.rz.scp.css */
.nav-link[b-hbm5009key] {
    color: white;
    border-radius: .5rem;
    padding: .5rem .6rem;
    font-size: .85rem;
}

    .nav-link:hover[b-hbm5009key] {
        background: #f2f4f7;
        color: #111;
    }

.nav-icon[b-hbm5009key] {
    display: inline-flex;
    width: 1.25rem;
}

.section-title[b-hbm5009key] {
    font-size: .75rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: cadetblue; /* rgba(255,255,255,.7);*/
    padding: .75rem 1rem .25rem;
}
/* /Pages/Advocates/AdvocateList.razor.rz.scp.css */
/* /Pages/Advocates/AdvocateMemberEditor.razor.rz.scp.css */

/* ===== Global InputSelect Style ===== */
input.select[b-uxxysjrjqj], select[b-uxxysjrjqj], .form-select[b-uxxysjrjqj], InputSelect[b-uxxysjrjqj] {
    background-color: black;
    border: 1px solid #c7d3e3;
    padding: .55rem .85rem;
    border-radius: 6px; /* Change this for more/less rounding */
    font-size: 0.95rem;
    transition: all .18s ease-in-out;
}

    /* Hover */
    input.select:hover[b-uxxysjrjqj],
    select:hover[b-uxxysjrjqj],
    .form-select:hover[b-uxxysjrjqj],
    InputSelect:hover[b-uxxysjrjqj] {
        border-color: #7aa7dc;
    }

    /* Focused */
    input.select:focus[b-uxxysjrjqj],
    select:focus[b-uxxysjrjqj],
    .form-select:focus[b-uxxysjrjqj],
    InputSelect:focus[b-uxxysjrjqj] {
        outline: none;
        border-color: #3C85AE; /* Your brand blue */
        box-shadow: 0 0 4px rgba(60,133,174,.45);
    }

    /* Disabled State */
    input.select:disabled[b-uxxysjrjqj],
    select:disabled[b-uxxysjrjqj],
    .form-select:disabled[b-uxxysjrjqj],
    InputSelect:disabled[b-uxxysjrjqj] {
        background-color: #f1f4f7;
        color: #8ca0b3;
        cursor: not-allowed;
    }

    /* Valid / Invalid states for edit forms */
    input.select.is-valid[b-uxxysjrjqj],
    select.is-valid[b-uxxysjrjqj],
    .form-select.is-valid[b-uxxysjrjqj],
    InputSelect.is-valid[b-uxxysjrjqj] {
        border-color: #28a745;
    }

    input.select.is-invalid[b-uxxysjrjqj],
    select.is-invalid[b-uxxysjrjqj],
    .form-select.is-invalid[b-uxxysjrjqj],
    InputSelect.is-invalid[b-uxxysjrjqj] {
        border-color: #dc3545;
    }

    .form-select.sm[b-uxxysjrjqj] {
        padding: .35rem .6rem;
        font-size: .85rem;
        border-radius: 4px;
    }


.form-check-box[b-uxxysjrjqj] {
    width: 100%;
    text-align: left;
    padding: 0.25rem 0.75rem;
    font-size: 0.9rem;
}

.form-check-box .form-check-input[b-uxxysjrjqj] {
    margin-top: 0;
}


/* Improve icon visibility on dark mode */
@media (prefers-color-scheme: dark) {
    .form-check-box .form-check-input[b-uxxysjrjqj] {
        border-color: #9ecaff;
    }
}

/* Mobile tweaks */
@media (max-width: 575.98px) {
    .form-check-box .form-check-input[b-uxxysjrjqj] {
        width: 1.25rem;
        height: 1.25rem;
        margin-right: 0.65rem;
    }
}
/* /Pages/Advocates/AdvocateUserList.razor.rz.scp.css */
/* /Pages/Advocates/AdvocateViewer.razor.rz.scp.css */
.detail-value[b-gdpkg8h29t] {
    font-size: 0.85rem;
    color: #2c3e50;
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 4px;
    border: 1px solid #d9d9d9;
    min-height: 1.5rem;
    display: flex;
    align-items: center;
}

    .detail-value.multiline[b-gdpkg8h29t] {
        white-space: pre-wrap;
        word-wrap: break-word;
        align-items: flex-start;
        line-height: 1.6;
    }

    .detail-value a[b-gdpkg8h29t] {
        color: #3498db;
        text-decoration: none;
        transition: color 0.2s ease;
    }

        .detail-value a:hover[b-gdpkg8h29t] {
            color: #2980b9;
            text-decoration: underline;
        }
/* /Pages/Advocates/AssignAdvocateUser.razor.rz.scp.css */
.detail-value[b-kx0ga0mfzh] {
    font-size: 0.85rem;
    color: #2c3e50;
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 4px;
    border: 1px solid #d9d9d9;
    min-height: 1.5rem;
    display: flex;
    align-items: center;
}

.detail-value.multiline[b-kx0ga0mfzh] {
    white-space: pre-wrap;
    word-wrap: break-word;
    align-items: flex-start;
    line-height: 1.6;
}

.detail-value a[b-kx0ga0mfzh] {
    color: #3498db;
    text-decoration: none;
    transition: color 0.2s ease;
}

.detail-value a:hover[b-kx0ga0mfzh] {
    color: #2980b9;
    text-decoration: underline;
}

.contact-wrap[b-kx0ga0mfzh] {
    text-align: center;
    padding: 32px 12px;
}

.contact-card[b-kx0ga0mfzh] {
    display: inline-block; /* shrink to content */
    text-align: left; /* keep text aligned inside */
    border: 1px solid #d0d7de;
    border-radius: 14px;
    padding: 14px 16px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,.06);
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
    max-width: min(600px, 100%); /* responsive cap */
}

.contact-card:hover[b-kx0ga0mfzh] {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(0,0,0,.10);
    border-color: #bfc7d1;
}

.contact-name[b-kx0ga0mfzh] {
    font-weight: 700;
    font-size: 1.05rem;
    line-height: 1.25;
    margin-bottom: 6px;
    letter-spacing: .2px;
}

.contact-email[b-kx0ga0mfzh] {
    display: inline-block;
    font-size: .95rem;
    color: #0969da;
    text-decoration: none;
    word-break: break-word; /* prevents overflow on long emails */
}

.contact-email:hover[b-kx0ga0mfzh] {
    text-decoration: underline;
}

/* /Pages/Advocates/UserAdvocateAssignments.razor.rz.scp.css */
/* /Pages/Auth/ResetPassword.razor.rz.scp.css */
.reset-password-page[b-5mhpy6t84z] {
    display: flex;
    justify-content: center;
    padding-top: 3rem;
}

.reset-password-card[b-5mhpy6t84z] {
    max-width: 420px;
    width: 100%;
}
/* /Pages/Auth/UserRegistration.razor.rz.scp.css */
.registration-page[b-95uwmfyhwv] {
    min-height: 70vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

    /* Card tweaks */
    .registration-page .card[b-95uwmfyhwv] {
        border-radius: 0.75rem;
    }

    .registration-page .card-title[b-95uwmfyhwv] {
        font-weight: 600;
    }

    /* Make sure inputs look good on small screens too */
    .registration-page .form-control[b-95uwmfyhwv] {
        font-size: 0.95rem;
    }

/* Button text spacing for password toggle */
.password-toggle-text[b-95uwmfyhwv] {
    font-size: 0.85rem;
}

/* Slightly smaller max width on very small devices */
@media (max-width: 575.98px) {
    .registration-page .card-body[b-95uwmfyhwv] {
        padding: 1.5rem;
    }
}
/* /Pages/CustomNotFound.razor.rz.scp.css */
.customNotFound[b-c5g2soonj4] {
	text-align: center;
	color: red;
	font-size: 35px;
	box-shadow: 1px 1px 1px grey;
}
/* /Pages/Deprecated/NeedGridList.razor.rz.scp.css */

.edit-icon[b-j0xyyp9ejs] {
    font-size: 1rem;
    cursor: pointer;
    color: #3C85AE;
    border: none !important;
    transition: color 0.15s ease, transform 0.15s ease;
}

    .edit-icon:hover[b-j0xyyp9ejs] {
        color: black !important;
        transform: scale(1.1);
    }

.need-grid-list-page[b-j0xyyp9ejs] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
}

.page-toolbar[b-j0xyyp9ejs] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    align-items: center;
}

.grid-outer-shell[b-j0xyyp9ejs] {
    width: 100%;
    min-width: 0;
}

.grid-horizontal-scroll[b-j0xyyp9ejs] {
    width: 100%;
    overflow-x: hidden;
    overflow-y: hidden;
}


.grid-min-width[b-j0xyyp9ejs] {
    min-width: 1200px;
}



.commitment-link[b-j0xyyp9ejs] {
    font-weight: 600;
    color: #2a6edb;
    text-decoration: none;
    cursor: pointer;
    padding: 0 !important;
    margin: 0 !important;
}

.commitment-link:hover[b-j0xyyp9ejs] {
    text-decoration: underline;
}

.grid-select-checkbox[b-j0xyyp9ejs] {
    cursor: pointer;
    transform: scale(0.9);
}

[b-j0xyyp9ejs] .need-grid {
    width: 100% !important;
}

    /* Prevent Syncfusion from creating its own horizontal scrollbars */
    [b-j0xyyp9ejs] .need-grid .e-gridheader,
    [b-j0xyyp9ejs] .need-grid .e-headercontent,
    [b-j0xyyp9ejs] .need-grid .e-gridcontent,
    [b-j0xyyp9ejs] .need-grid .e-content {
        overflow-x: hidden !important;
    }

    /* Keep vertical scrolling inside the grid body */
    [b-j0xyyp9ejs] .need-grid .e-gridcontent {
        overflow-y: hidden !important;
    }

    /* Header */
    [b-j0xyyp9ejs] .need-grid .e-gridheader {
        background-color: #f4f6f9;
        border-bottom: 1px solid #d9d9d9;
    }

    /* Compact cell styling */
    [b-j0xyyp9ejs] .need-grid .e-rowcell {
        font-size: 0.82rem;
        padding: 4px 8px;
    }

    [b-j0xyyp9ejs] .need-grid .e-headercell {
        font-size: 0.82rem;
        font-weight: 600;
        padding: 6px 8px;
    }

    /* Slightly tighter row height */
    [b-j0xyyp9ejs] .need-grid .e-row {
        line-height: 1.2;
    }

    /* Row styling */
    [b-j0xyyp9ejs] .need-grid .e-altrow {
        background-color: #fafbfd;
    }

    [b-j0xyyp9ejs] .need-grid .e-row:hover {
        background-color: #eef4ff;
    }

    /* Border cleanup */
    [b-j0xyyp9ejs] .need-grid .e-gridcontent {
        /*max-height: 650px;*/
        border-top: none;
        border-radius: 0 0 0.375rem 0.375rem;
    }

    [b-j0xyyp9ejs] .need-grid .e-content {
        max-height: 650px;
    }

    [b-j0xyyp9ejs] .need-grid .e-rowcell,
    [b-j0xyyp9ejs] .need-grid .e-headercell {
        border-color: #e3e6ea;
    }

    /* Toolbar */
    [b-j0xyyp9ejs] .need-grid .e-toolbar {
        padding: 6px;
        border-bottom: 1px solid #dcdcdc;
        border-radius: 0.375rem 0.375rem 0 0;
    }

    /* Pager */
    [b-j0xyyp9ejs] .need-grid .e-gridpager {
        font-size: 0.82rem;
        padding: 4px;
    }


    /* Completely remove Syncfusion horizontal scrollbar */
    [b-j0xyyp9ejs] .need-grid .e-gridcontent {
        overflow-x: hidden !important;
        scrollbar-width: none; /* Firefox */
    }

        [b-j0xyyp9ejs] .need-grid .e-gridcontent::-webkit-scrollbar {
            display: none; /* Chrome / Edge / Safari */
        }

    /* Prevent header area from showing horizontal scroll */
    [b-j0xyyp9ejs] .need-grid .e-headercontent {
        overflow-x: hidden !important;
    }


/*.need-name-tooltip {
    cursor: help;
}
*/
/*.need-name-tooltip {
    display: inline-block;
    max-width: 170px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: help;
}
*/
.need-name-tooltip[b-j0xyyp9ejs] {
    display: flex;
    align-items: center;
    height: 100%;
    min-height: 100%;
    width: 100%;
    font-size: 0.90rem;
    font-weight: 400;
    line-height: 1.2;
    color: inherit;
    cursor: help;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.need-name-tooltip:hover[b-j0xyyp9ejs] {
    color: #2a6edb;
    text-decoration: underline;
}

.need-hover-card[b-j0xyyp9ejs] {
    max-width: 340px;
    padding: 0.15rem 0.05rem;
}

.need-hover-section-title[b-j0xyyp9ejs] {
    font-size: 0.78rem;
    font-weight: 700;
    color: lightblue;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-bottom: 0.2rem;
}

.need-hover-description[b-j0xyyp9ejs],
.need-hover-instructions[b-j0xyyp9ejs] {
    font-size: 0.82rem;
    line-height: 1.35;
    color: white;
}

.need-hover-description[b-j0xyyp9ejs] {
    margin-bottom: 0.6rem;
    padding-bottom: 0.45rem;
    border-bottom: 1px solid #e5e7eb;
}

[b-j0xyyp9ejs] .need-info-tooltip.e-tooltip-wrap {
    border-radius: 0.5rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.12);
}

[b-j0xyyp9ejs] .need-info-tooltip .e-tip-content {
    padding: 0.65rem 0.8rem;
}
/* /Pages/Home.razor.rz.scp.css */
:host[b-mfgjyy8fjk] {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

html[b-mfgjyy8fjk], body[b-mfgjyy8fjk] {
    overflow-x: hidden;
}

.container-fluid[b-mfgjyy8fjk],
.need-toolbar[b-mfgjyy8fjk],
.offcanvas[b-mfgjyy8fjk],
.offcanvas-body[b-mfgjyy8fjk],
.row[b-mfgjyy8fjk],
[class*="col-"][b-mfgjyy8fjk],
.need-card[b-mfgjyy8fjk] {
    max-width: 100%;
}

If that still does not f

.empty-state[b-mfgjyy8fjk] {
    min-height: 260px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 2rem 1rem;
    text-align: center;
    border: 1px dashed #d0d7de;
    border-radius: 1rem;
    background: #fafbfc;
}

.empty-state-icon[b-mfgjyy8fjk] {
    font-size: 2.5rem;
    color: #6c757d;
    margin-bottom: .75rem;
}

.empty-state-title[b-mfgjyy8fjk] {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: .35rem;
}

.empty-state-text[b-mfgjyy8fjk] {
    max-width: 420px;
}

@media (max-width: 991.98px) {
    .grid-toggle-desktop-only[b-mfgjyy8fjk] {
        display: none !important;
    }
}

.need-toolbar[b-mfgjyy8fjk] {
    width: 100%;
}

.need-toolbar-desktop .toolbar-view[b-mfgjyy8fjk] {
    width: 280px;
    min-width: 280px;
}

.need-toolbar .custom-ddl[b-mfgjyy8fjk],
.need-toolbar .e-ddl[b-mfgjyy8fjk],
.need-toolbar .e-control[b-mfgjyy8fjk],
.need-toolbar .e-input-group[b-mfgjyy8fjk],
.need-toolbar .e-control-wrapper[b-mfgjyy8fjk] {
    width: 100% !important;
}

.mobile-ddl-view[b-mfgjyy8fjk] {
    margin-bottom: 1.0rem;
}

.mobile-ddl-view .e-ddl.e-popup[b-mfgjyy8fjk],
.mobile-ddl-view .e-ddl[b-mfgjyy8fjk],
.mobile-ddl-view .e-control[b-mfgjyy8fjk],
.mobile-ddl-view .e-input-group[b-mfgjyy8fjk],
.mobile-ddl-view .e-control-wrapper[b-mfgjyy8fjk] {
    width: 100% !important;    
    max-width: 320px;
}

.need-toolbar-desktop .toolbar-loadmore[b-mfgjyy8fjk] {
    display: flex;
    align-items: center;
}

.need-toolbar-mobile .btn[b-mfgjyy8fjk] {
    width: 100%;
}

.need-toolbar-mobile .btn[b-mfgjyy8fjk] {
    padding: .4rem .9rem;
}
.need-toolbar-mobile .e-ddl[b-mfgjyy8fjk] {
    max-width: 320px;
}

@media (max-width: 991.98px) {

    .mobile-button-stack[b-mfgjyy8fjk] {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: .5rem;
    }

        .mobile-button-stack .btn[b-mfgjyy8fjk] {
            width: 50%;
            max-width: 220px;
        }
}

.offcanvas[b-mfgjyy8fjk] {
    z-index: 10010 !important;
    background-color: #e6e6e6 !important;
}

.offcanvas-backdrop[b-mfgjyy8fjk] {
    z-index: 10005 !important;
}

.drawer-body[b-mfgjyy8fjk] {
    position: relative;
}

.drawer-close-btn[b-mfgjyy8fjk] {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-weight: 700;
}

.drawer-close-btn i[b-mfgjyy8fjk] {
    color: white;
    font-size: 0.95rem;
}

.drawer-close-btn:hover[b-mfgjyy8fjk] {
    background-color: #0b5ed7;
}

.view-pill[b-mfgjyy8fjk] {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .25rem .6rem;
    border-radius: 999px;
    background-color: #f1f3f5;
    white-space: nowrap;
}

.view-label[b-mfgjyy8fjk] {
    font-size: .85rem;
    font-weight: 600;
    /*color: #6c757d;*/
    color: red;
    margin-right: 5px;
}

.view-value[b-mfgjyy8fjk] {
    font-size: 1.0rem;
    font-weight: 600;
    
}


.needs-view-page[b-mfgjyy8fjk] {
    width: 100%;
}

.needs-view-toolbar[b-mfgjyy8fjk] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
    padding: 1rem 1.25rem;
    background: linear-gradient(180deg, #f8f9fa 0%, #ffffff 100%);
    border: 1px solid #dee2e6;
    border-radius: 0.85rem;
    box-shadow: 0 0.125rem 0.35rem rgba(0, 0, 0, 0.04);
}

.needs-view-toolbar-left[b-mfgjyy8fjk] {
    display: flex;
    align-items: center;
    min-width: 0;
}

.needs-view-toolbar-right[b-mfgjyy8fjk] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-left: auto;
}

.needs-view-title[b-mfgjyy8fjk] {
    font-weight: 600;
    color: #2f3e4e;
    line-height: 1.1;
}

.needs-view-subtitle[b-mfgjyy8fjk] {
    font-size: 0.875rem;
    color: #6c757d;
    margin-top: 0.2rem;
}

.view-switcher[b-mfgjyy8fjk] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem;
    background-color: #e9ecef;
    border-radius: 999px;
    border: 1px solid #d6dbe1;
}

.view-switch-btn[b-mfgjyy8fjk] {
    border-radius: 999px !important;
    min-width: 100px;
    font-weight: 500;
    padding: 0.45rem 0.9rem;
    border: none !important;
    box-shadow: none !important;
    transition: all 0.18s ease-in-out;
}

    .view-switch-btn.btn-light[b-mfgjyy8fjk] {
        background-color: transparent;
        color: #495057;
    }

        .view-switch-btn.btn-light:hover[b-mfgjyy8fjk] {
            background-color: #f8f9fa;
            color: #212529;
        }

    .view-switch-btn.btn-primary.active[b-mfgjyy8fjk],
    .view-switch-btn.btn-primary[b-mfgjyy8fjk] {
        background-color: #3C85AE;
        color: white;
    }

        .view-switch-btn.btn-primary:hover[b-mfgjyy8fjk] {
            filter: brightness(0.96);
        }

.needs-view-content[b-mfgjyy8fjk] {
    min-width: 0;
}

@media (max-width: 767.98px) {
    .needs-view-toolbar[b-mfgjyy8fjk] {
        padding: 0.85rem 1rem;
        align-items: stretch;
    }

    .needs-view-toolbar-right[b-mfgjyy8fjk] {
        width: 100%;
        justify-content: flex-start;
        margin-left: 0;
    }

    .view-switcher[b-mfgjyy8fjk] {
        width: 100%;
        justify-content: stretch;
    }

    .view-switch-btn[b-mfgjyy8fjk] {
        flex: 1 1 0;
        min-width: 0;
    }
}
/* /Pages/Needs/EnhancedSearch.razor.rz.scp.css */
.enhanced-search-container[b-f82vdihzjn] {
    max-width: 960px;
    margin: 0 auto;
    padding: 1rem;
}

.enhanced-search-card[b-f82vdihzjn] {
    border-radius: 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.06);
}

    .enhanced-search-card .card-header[b-f82vdihzjn] {
        background: linear-gradient(270deg, #79aee0 0%, #6fa0d7 30%, #538cc6 60%, #082767 100%);
        color: #ffffff;
        border-bottom: none;
    }

input[b-f82vdihzjn]::placeholder {
    /*color: #cccccc;*/ /* light gray */
    /*opacity: .5;*/ /* ensure full opacity */
    color: rgba(0, 0, 0, 0.3); /* black at 40% opacity */
}

.enhanced-search-icon[b-f82vdihzjn] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    background-color: rgba(255, 255, 255, 0.15);
}

    .enhanced-search-icon i[b-f82vdihzjn] {
        font-size: 1.1rem;
    }

.enhanced-date-tabs .nav-link[b-f82vdihzjn] {
    border-radius: 999px;
    padding-inline: 1rem;
    font-size: 0.9rem;
}

    .enhanced-date-tabs .nav-link.active[b-f82vdihzjn] {
        font-weight: 600;
    }

/* Date range layout tweaks */
.enhanced-date-range .form-label[b-f82vdihzjn] {
    font-size: 0.9rem;
}

.enhanced-search-card .form-label[b-f82vdihzjn] {
    font-weight: 500;
}

.enhanced-search-card .form-text[b-f82vdihzjn] {
    font-size: 0.8rem;
}

/* Small screen tweaks */
@media (max-width: 575.98px) {
    .enhanced-search-container[b-f82vdihzjn] {
        padding: 0.5rem;
    }

    .enhanced-search-card[b-f82vdihzjn] {
        border-radius: 0.5rem;
    }

        .enhanced-search-card .card-header[b-f82vdihzjn] {
            padding: 0.5rem 0.75rem;
        }

        .enhanced-search-card .card-body[b-f82vdihzjn] {
            padding: 0.75rem;
        }
}
/* /Pages/Needs/NeedCommitments.razor.rz.scp.css */
.system-data-list-page[b-3cnfxkjqpt] {
    padding: 0.5rem;
}

.page-header[b-3cnfxkjqpt] {
    margin-bottom: .25rem;
    font-size: 1rem;
}

.need-commitments-page[b-3cnfxkjqpt] {
    min-height: 70vh;
    margin: 0 !important;
}

.need-commitments-card[b-3cnfxkjqpt] {
    border-radius: 0.5rem;
}

.toolbar-actions .btn[b-3cnfxkjqpt] {
    min-width: 120px;
}

.loading-panel[b-3cnfxkjqpt] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 180px;
    border: 1px dashed #d0d7de;
    border-radius: 1rem;
    background: #f8f9fa;
    font-weight: 500;
}

.empty-state[b-3cnfxkjqpt] {
    min-height: 260px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 2rem 1rem;
    text-align: center;
    border: 1px dashed #d0d7de;
    border-radius: 1rem;
    background: #fafbfc;
}

.empty-state-icon[b-3cnfxkjqpt] {
    font-size: 2.5rem;
    color: #6c757d;
    margin-bottom: .75rem;
}

.empty-state-title[b-3cnfxkjqpt] {
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: .35rem;
}

.empty-state-text[b-3cnfxkjqpt] {
    max-width: 420px;
}

.detail-template-wrapper[b-3cnfxkjqpt] {
    padding: 1rem 1rem 1.25rem 1rem;
    background-color: #f8f9fa;
    border-top: 1px solid #e9ecef;
}

.detail-header[b-3cnfxkjqpt] {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    margin-bottom: .75rem;
}

.detail-title[b-3cnfxkjqpt] {
    font-size: .98rem;
    font-weight: 500;
    color: #212529;
}

.detail-summary[b-3cnfxkjqpt] {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

[b-3cnfxkjqpt] .e-grid {
    border-radius: .75rem;
    overflow: hidden;
}

    [b-3cnfxkjqpt] .e-grid .e-gridheader {
        border-top-left-radius: .75rem;
        border-top-right-radius: .75rem;
    }

    [b-3cnfxkjqpt] .e-grid .e-headercell,
    [b-3cnfxkjqpt] .e-grid .e-rowcell {
        vertical-align: middle;
    }

    [b-3cnfxkjqpt] .e-grid .e-detailrowcollapse,
    [b-3cnfxkjqpt] .e-grid .e-detailrowexpand {
        cursor: pointer;
    }

    [b-3cnfxkjqpt] .e-grid .e-detailcell {
        padding: 0 !important;
    }

@media (max-width: 991.98px) {
    .toolbar-actions .btn[b-3cnfxkjqpt] {
        min-width: unset;
    }

    .detail-header[b-3cnfxkjqpt] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Pages/Needs/NeedEditor.razor.rz.scp.css */
.instruction-preview[b-zecnrar18q] {
    min-height: 2.5rem;
    background-color: #f8f9fa;  light gray like disabled input 
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.delivery-need-preview[b-zecnrar18q] {
    max-height: 1rem;
    background-color: #f8f9fa;
    white-space: pre-wrap;

}
/* /Pages/Needs/NeedViewer.razor.rz.scp.css */

/*.commitment-editor-container {
    min-width: 200px;
    max-width: 350px;
}
*/

.commitment-action-row[b-2zrgm0icx7] {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
}

.commitment-editor-container[b-2zrgm0icx7] {
    flex: 0 0 350px; /* fixed-ish editor width */
    max-width: 350px;
}

    .commitment-editor-container .commitment-editor[b-2zrgm0icx7] {
        width: 100%;
    }

/* Base small round icon button */
.icon-btn[b-2zrgm0icx7] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    padding: 0;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #f0f0f0;
    color: #333;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease, transform .15s ease;
}

/* Hover + active feel */
.icon-btn:hover[b-2zrgm0icx7] {
    background-color: #e0e0e0;
    color: #000;
    transform: scale(1.05);
}

.icon-btn:active[b-2zrgm0icx7] {
    transform: scale(0.95);
}

 /* save variant */
    .icon-btn.save[b-2zrgm0icx7] {
        background-color: #d8facc;
        color: #b20000;
    }

        .icon-btn.save:hover[b-2zrgm0icx7] {
            background-color: #befaa8;
            color: #7a0000;
        }

/* delete variant */
.icon-btn.delete[b-2zrgm0icx7] {
    background-color: #fbeaea;
    color: #b20000;
}

.icon-btn.delete:hover[b-2zrgm0icx7] {
    background-color: #f3d6d6;
    color: #7a0000;
}

/* Allow vertical stacking in your Commitment UI */
.commitment-buttons[b-2zrgm0icx7] {
    display: flex;
    flex-direction: column;
    gap: .4rem;
}
/*.commitment-buttons {
    display: flex;
    flex-direction: column;
    gap: .5rem;
}*/

    /* Optional: make vertical buttons same width */
    /*.commitment-buttons .btn {
        width: 160px;
    }*/
/* tweak as you like */

/* Responsive: stack everything on small screens */
@media (max-width: 576px) {
    .commitment-action-row[b-2zrgm0icx7] {
        flex-direction: column;
        align-items: stretch;
    }

    .commitment-buttons .btn[b-2zrgm0icx7] {
        width: 100%;
    }
}

.need-viewer[b-2zrgm0icx7] {
    max-width: 100%;
    margin: 0 auto;
    padding: 2rem;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;   
    border: 1px solid #9C9C9C;
    background-color: #f2f2f2;
    border-radius: 10px;

}

.page-header[b-2zrgm0icx7] {
    margin-bottom: 2rem;
    border-bottom: 2px solid #e0e0e0;
    padding-bottom: 1rem;
}

.page-header h1[b-2zrgm0icx7] {
    color: #2c3e50;
    font-size: 2rem;
    font-weight: 600;
    margin: 0;
}

.sections-container[b-2zrgm0icx7] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

.need-section[b-2zrgm0icx7],
.advocate-section[b-2zrgm0icx7] {
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 1.5rem;
    height: fit-content;
}

.advocate-section[b-2zrgm0icx7] {
    background: #ffffe6;
    border: 1px solid #ffe6cc;
}

.need-section[b-2zrgm0icx7] {
    background: #e6f3ff;
    border: 1px solid #e0ccff;
}

.instruction-section[b-2zrgm0icx7] {
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    padding: 0.5rem;
    height: fit-content;
    background: #ffcccc;
    border: 1px solid #e0ccff;
}


.section-header[b-2zrgm0icx7] {
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #f0f0f0;
}

.section-header h2[b-2zrgm0icx7] {
    color: #34495e;
    font-size: 1.0rem;
    font-weight: 600;
    margin: 0;
}

.details-grid[b-2zrgm0icx7] {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.detail-item[b-2zrgm0icx7] {
    display: flex;
    flex-direction: column;
}

.detail-label[b-2zrgm0icx7] {
    font-size: 0.75rem;
    font-weight: 700;
    color: #606b6c;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 0.25rem;
}

.detail-value[b-2zrgm0icx7] {
    font-size: 0.85rem;
    color: #2c3e50;
    padding: 0.5rem;
    background: #f8f9fa;
    border-radius: 4px;
    border: 1px solid #d9d9d9;
    min-height: 1.5rem;
    display: flex;
    align-items: center;
}

.detail-value.multiline[b-2zrgm0icx7] {
    white-space: pre-wrap;
    word-wrap: break-word;
    align-items: flex-start;
    line-height: 1.6;
}

.detail-value a[b-2zrgm0icx7] {
    color: #3498db;
    text-decoration: none;
    transition: color 0.2s ease;
}

.detail-value a:hover[b-2zrgm0icx7] {
    color: #2980b9;
    text-decoration: underline;
}

.no-data[b-2zrgm0icx7] {
    text-align: center;
    padding: 3rem;
    color: #95a5a6;
    font-size: 1.125rem;
}


/* Responsive design */
@media (max-width: 992px) {
    .sections-container[b-2zrgm0icx7] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .need-viewer[b-2zrgm0icx7] {
        padding: 1rem;
    }

    .page-header h1[b-2zrgm0icx7] {
        font-size: 1.5rem;
    }

    .section-header h2[b-2zrgm0icx7] {
        font-size: 1.25rem;
    }

    .sections-container[b-2zrgm0icx7] {
        gap: 1.5rem;
    }
}
/* /Pages/SearchByInterests.razor.rz.scp.css */
.enhanced-search-container[b-o993ihxkul] {
    max-width: 960px;
    margin: 0 auto;
    padding: 1rem;
}

.enhanced-search-card[b-o993ihxkul] {
    border-radius: 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.06);
}

    .enhanced-search-card .card-header[b-o993ihxkul] {
        background: linear-gradient(270deg, #79aee0 0%, #6fa0d7 30%, #538cc6 60%, #082767 100%);
        color: #ffffff;
        border-bottom: none;
    }

input[b-o993ihxkul]::placeholder {
    /*color: #cccccc;*/ /* light gray */
    /*opacity: .5;*/ /* ensure full opacity */
    color: rgba(0, 0, 0, 0.3); /* black at 40% opacity */
}

.enhanced-search-icon[b-o993ihxkul] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    background-color: rgba(255, 255, 255, 0.15);
}

    .enhanced-search-icon i[b-o993ihxkul] {
        font-size: 1.1rem;
    }

.enhanced-date-tabs .nav-link[b-o993ihxkul] {
    border-radius: 999px;
    padding-inline: 1rem;
    font-size: 0.9rem;
}

    .enhanced-date-tabs .nav-link.active[b-o993ihxkul] {
        font-weight: 600;
    }

/* Date range layout tweaks */
.enhanced-date-range .form-label[b-o993ihxkul] {
    font-size: 0.9rem;
}

.enhanced-search-card .form-label[b-o993ihxkul] {
    font-weight: 500;
}

.enhanced-search-card .form-text[b-o993ihxkul] {
    font-size: 0.8rem;
}

/* Small screen tweaks */
@media (max-width: 575.98px) {
    .enhanced-search-container[b-o993ihxkul] {
        padding: 0.5rem;
    }

    .enhanced-search-card[b-o993ihxkul] {
        border-radius: 0.5rem;
    }

        .enhanced-search-card .card-header[b-o993ihxkul] {
            padding: 0.5rem 0.75rem;
        }

        .enhanced-search-card .card-body[b-o993ihxkul] {
            padding: 0.75rem;
        }
}
/* /Pages/SetUpView.razor.rz.scp.css */
.support-title[b-9xsuug24ca] {
    margin-bottom: 0.75rem;
}

.support-grid[b-9xsuug24ca] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
}

@media (min-width: 992px) {
    .support-grid[b-9xsuug24ca] {
        grid-template-columns: 1fr 1fr;
    }
}

.support-card[b-9xsuug24ca] {
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    padding: 1rem;
    background: #fff;
}

.support-card-title[b-9xsuug24ca] {
    margin: 0 0 0.75rem 0;
    font-size: 1.05rem;
}

.support-dl[b-9xsuug24ca] {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 0.35rem 0.75rem;
    margin: 0.35rem;
}

    .support-dl dt[b-9xsuug24ca] {
        font-weight: 600;
        color: #374151;
    }

    .support-dl dd[b-9xsuug24ca] {
        margin: 0;
        color: #111827;
        overflow-wrap: anywhere;
    }

.support-badges[b-9xsuug24ca] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.support-badge[b-9xsuug24ca] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.55rem;
    border-radius: 999px;
    font-size: 0.85rem;
    font-weight: 600;
    border: 1px solid transparent;
}

.support-badge-secondary[b-9xsuug24ca] {
    background: #f3f4f6;
    color: #374151;
    border-color: #e5e7eb;
}

.support-badge-staging[b-9xsuug24ca] {
    background: #fef3c7;
    color: #92400e;
    border-color: #fcd34d;
}

.support-badge-prod[b-9xsuug24ca] {
    background: #d1fae5;
    color: #065f46;
    border-color: #34d399;
}

.support-badge-local[b-9xsuug24ca] {
    background: #dbeafe;
    color: #1e40af;
    border-color: #60a5fa;
}

.support-alert[b-9xsuug24ca] {
    border-radius: 0.75rem;
    padding: 0.75rem 1rem;
    border: 1px solid transparent;
}

.support-alert-danger[b-9xsuug24ca] {
    background: #fee2e2;
    border-color: #fecaca;
    color: #991b1b;
}

.support-actions[b-9xsuug24ca] {
    margin-top: 0.75rem;
    display: flex;
    gap: 0.75rem;
    align-items: center;
    flex-wrap: wrap;
}

.support-btn[b-9xsuug24ca] {
    border: 1px solid #d1d5db;
    background: #fff;
    border-radius: 0.5rem;
    padding: 0.4rem 0.75rem;
    cursor: pointer;
}

    .support-btn:hover[b-9xsuug24ca] {
        background: #f9fafb;
    }

.support-muted[b-9xsuug24ca] {
    color: #6b7280;
}

.support-footnote[b-9xsuug24ca] {
    margin-top: 0.75rem;
    color: #6b7280;
    font-size: 0.9rem;
}
/* /Pages/SystemAdmin/SysDataDialogGrid.razor.rz.scp.css */
.sys-data-grid-card[b-knlz5rlslw] {
    background: #fff;
    border: 1px solid #d9e2ec;
    border-radius: 14px;
    padding: 1rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .04);
}

.sys-data-grid-header[b-knlz5rlslw] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.sys-data-grid-body[b-knlz5rlslw] {
    min-height: 300px;
}

@media (max-width: 767.98px) {
    .sys-data-grid-header[b-knlz5rlslw] {
        flex-direction: column;
        align-items: stretch;
    }

        .sys-data-grid-header .btn[b-knlz5rlslw] {
            width: 100%;
        }
}

.sys-data-grid-card[b-knlz5rlslw] {
    background: #fff;
    border: 1px solid #d9e2ec;
    border-radius: 14px;
    padding: 1rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .04);
}

.sys-data-grid-header[b-knlz5rlslw] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.sys-data-grid-body[b-knlz5rlslw] {
    min-height: 300px;
}

/* Syncfusion dialog styling */
[b-knlz5rlslw] .sys-data-edit-dialog.e-dialog {
    border-radius: 14px;
    overflow: hidden;
}

[b-knlz5rlslw] .sys-data-edit-dialog .e-dlg-header-content {
    background: #f8fafc;
    border-bottom: 1px solid #d9e2ec;
    padding: .9rem 1rem;
}

[b-knlz5rlslw] .sys-data-edit-dialog .e-dlg-header {
    font-weight: 600;
    color: #212529;
}

[b-knlz5rlslw] .sys-data-edit-dialog .e-dlg-content {
    padding: 1rem;
    background: #fff;
}

[b-knlz5rlslw] .sys-data-edit-dialog .e-footer-content {
    border-top: 1px solid #d9e2ec;
    background: #f8fafc;
    padding: .75rem 1rem;
}

[b-knlz5rlslw] .sys-data-edit-dialog .e-btn {
    border-radius: 8px;
}

@media (max-width: 767.98px) {
    .sys-data-grid-header[b-knlz5rlslw] {
        flex-direction: column;
        align-items: stretch;
    }

        .sys-data-grid-header .btn[b-knlz5rlslw] {
            width: 100%;
        }
}
/* /Pages/SystemAdmin/SysDataGrid.razor.rz.scp.css */

.sys-data-grid-card[b-apaa0nk0vf] {
    background: #fff;
    border: 1px solid #d9e2ec;
    border-radius: 14px;
    padding: 1rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .04);
}

.sys-data-grid-header[b-apaa0nk0vf] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.sys-data-grid-body[b-apaa0nk0vf] {
    min-height: 300px;
}

@media (max-width: 767.98px) {
    .sys-data-grid-header[b-apaa0nk0vf] {
        flex-direction: column;
        align-items: stretch;
    }

        .sys-data-grid-header .btn[b-apaa0nk0vf] {
            width: 100%;
        }
}
/* /Pages/SystemAdmin/SystemDataList.razor.rz.scp.css */
.system-data-list-page[b-ed7mvrm62p] {
    padding: 0.5rem;
}

.page-header[b-ed7mvrm62p] {
    margin-bottom: 1rem;
    font-size: 1rem;
}

.system-data-tabs-card[b-ed7mvrm62p] {
    background: #fff;
    border: 1px solid #d9e2ec;
    border-radius: 16px;
    box-shadow: 0 2px 12px rgba(0,0,0,.04);
    overflow: hidden;
}

.system-data-tabs[b-ed7mvrm62p] {
    padding: 0 1rem;
    background: #f8fafc;
    border-bottom: 1px solid #d9e2ec;
}

    .system-data-tabs .nav-link[b-ed7mvrm62p] {
        border: none;
        border-bottom: 3px solid transparent;
        border-radius: 0;
        color: #495057;
        font-weight: 600;
        padding: .9rem 1rem;
        background: transparent;
    }

        .system-data-tabs .nav-link:hover[b-ed7mvrm62p] {
            color: #0d6efd;
            background: rgba(13, 110, 253, 0.04);
        }

        .system-data-tabs .nav-link.active[b-ed7mvrm62p] {
            color: #0d6efd;
            background: #fff;
            border-bottom-color: #0d6efd;
        }

.tab-content-area[b-ed7mvrm62p] {
    padding: 1rem;
}

@media (max-width: 767.98px) {
    .system-data-list-page[b-ed7mvrm62p] {
        padding: .75rem;
    }

    .system-data-tabs[b-ed7mvrm62p] {
        padding: 0 .5rem;
        overflow-x: auto;
        flex-wrap: nowrap;
    }

        .system-data-tabs .nav-link[b-ed7mvrm62p] {
            white-space: nowrap;
        }

    .tab-content-area[b-ed7mvrm62p] {
        padding: .75rem;
    }
}
/* /Pages/Users/EditUserCommitments.razor.rz.scp.css */
.commitment-modal[b-fd4k1j1voq] {
    /*position: fixed;*/
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    overflow-x: hidden !important;
    overflow-y: hidden !important;
}


/* ── Dialog sizing ── */
.commitment-modal-dialog[b-fd4k1j1voq] {
    /* Comfortable on desktop, full-width on mobile */
    max-width: 95%;
    margin: 1.5rem auto;
    border: 1px solid grey !important;
    border-radius: 5px !important;
}

@media (max-width: 575.98px) {
    .commitment-modal-dialog[b-fd4k1j1voq] {
        margin: 0.5rem;
        margin-top: max(0.5rem, env(safe-area-inset-top));
        max-width: calc(100vw - 1rem);
    }
}

/* Ensure modal-dialog-centered doesn't pull modal behind navbar on small screens */
.commitment-modal .modal-dialog-centered[b-fd4k1j1voq] {
    min-height: calc(100% - 2rem);
    align-items: flex-start;
}

@media (min-width: 576px) {
    .commitment-modal .modal-dialog-centered[b-fd4k1j1voq] {
        align-items: center;
        min-height: calc(100% - 3.5rem);
    }
}

/* ── Header ── */
.commitment-modal-header[b-fd4k1j1voq] {
    background: linear-gradient(135deg, #1a56db 0%, #0d3b8e 100%);
    color: #fff;
    border-bottom: none;
    padding: 1rem 1.25rem;
    border-radius: calc(0.375rem - 1px) calc(0.375rem - 1px) 0 0;
}

    .commitment-modal-header .modal-title[b-fd4k1j1voq] {
        font-size: 1.1rem;
        font-weight: 600;
    }

/* ── Body — remove extra padding so child cards look flush ── */
.commitment-modal .modal-body[b-fd4k1j1voq] {
    background-color: #f8f9fa;
}

/* ── Remove the card's outer shadow inside the modal ── */
.commitment-modal .commitment-card[b-fd4k1j1voq] {
    box-shadow: none !important;
    border: none !important;
    border-radius: 0.5rem;
    background-color: #fff;
}
/* /Pages/Users/UserEditor.razor.rz.scp.css */

/* ===== Global InputSelect Style ===== */
input.select[b-z0vnzptm6y], select[b-z0vnzptm6y], .form-select[b-z0vnzptm6y], InputSelect[b-z0vnzptm6y] {
    background-color: black;
    border: 1px solid #c7d3e3;
    padding: .55rem .85rem;
    border-radius: 6px; /* Change this for more/less rounding */
    font-size: 0.95rem;
    transition: all .18s ease-in-out;
}

    /* Hover */
    input.select:hover[b-z0vnzptm6y],
    select:hover[b-z0vnzptm6y],
    .form-select:hover[b-z0vnzptm6y],
    InputSelect:hover[b-z0vnzptm6y] {
        border-color: #7aa7dc;
    }

    /* Focused */
    input.select:focus[b-z0vnzptm6y],
    select:focus[b-z0vnzptm6y],
    .form-select:focus[b-z0vnzptm6y],
    InputSelect:focus[b-z0vnzptm6y] {
        outline: none;
        border-color: #3C85AE; /* Your brand blue */
        box-shadow: 0 0 4px rgba(60,133,174,.45);
    }

    /* Disabled State */
    input.select:disabled[b-z0vnzptm6y],
    select:disabled[b-z0vnzptm6y],
    .form-select:disabled[b-z0vnzptm6y],
    InputSelect:disabled[b-z0vnzptm6y] {
        background-color: #f1f4f7;
        color: #8ca0b3;
        cursor: not-allowed;
    }

    /* Valid / Invalid states for edit forms */
    input.select.is-valid[b-z0vnzptm6y],
    select.is-valid[b-z0vnzptm6y],
    .form-select.is-valid[b-z0vnzptm6y],
    InputSelect.is-valid[b-z0vnzptm6y] {
        border-color: #28a745;
    }

    input.select.is-invalid[b-z0vnzptm6y],
    select.is-invalid[b-z0vnzptm6y],
    .form-select.is-invalid[b-z0vnzptm6y],
    InputSelect.is-invalid[b-z0vnzptm6y] {
        border-color: #dc3545;
    }

    .form-select.sm[b-z0vnzptm6y] {
        padding: .35rem .6rem;
        font-size: .85rem;
        border-radius: 4px;
    }


.form-check-box[b-z0vnzptm6y] {
    width: 100%;
    text-align: left;
    padding: 0.25rem 0.75rem;
    font-size: 0.9rem;
}

.form-check-box .form-check-input[b-z0vnzptm6y] {
    margin-top: 0;
}


/* Improve icon visibility on dark mode */
@media (prefers-color-scheme: dark) {
    .form-check-box .form-check-input[b-z0vnzptm6y] {
        border-color: #9ecaff;
    }
}

/* Mobile tweaks */
@media (max-width: 575.98px) {
    .form-check-box .form-check-input[b-z0vnzptm6y] {
        width: 1.25rem;
        height: 1.25rem;
        margin-right: 0.65rem;
    }
}
/* /Pages/Users/UserInterestSettings.razor.rz.scp.css */
.ui-page[b-3ia7lw72j7] {
    padding-bottom: 5rem; /* room for sticky bar on mobile */
}

.ui-container[b-3ia7lw72j7] {
    padding-top: 1rem;
    padding-bottom: 2rem;
}

.ui-header[b-3ia7lw72j7] {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.ui-titlewrap[b-3ia7lw72j7] {
    min-width: 0;
}

.ui-title[b-3ia7lw72j7] {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.ui-subtitle[b-3ia7lw72j7] {
    margin-top: .25rem;
    color: rgba(0,0,0,.65);
}

.ui-header-actions[b-3ia7lw72j7] {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
}

.ui-btn[b-3ia7lw72j7] {
    min-width: 6.5rem;
}

.ui-card[b-3ia7lw72j7] {
    border-radius: 1rem;
    overflow: hidden;
}

.ui-section-title[b-3ia7lw72j7] {
    font-weight: 700;
    margin-bottom: .5rem;
}

.ui-section-subtitle[b-3ia7lw72j7] {
    color: rgba(0,0,0,.65);
    margin-bottom: 1rem;
}

.ui-actions[b-3ia7lw72j7] {
    display: grid;
    gap: .5rem;
}

.ui-summary[b-3ia7lw72j7] {
    display: grid;
    gap: .25rem;
}

.ui-summary-title[b-3ia7lw72j7] {
    font-weight: 700;
    margin-bottom: .25rem;
}

.ui-summary-row[b-3ia7lw72j7] {
    display: flex;
    justify-content: space-between;
    color: rgba(0,0,0,.75);
}

.ui-help[b-3ia7lw72j7] {
    padding: 1rem;
    border-radius: 1rem;
    background: rgba(0,0,0,.03);
}

.ui-help-title[b-3ia7lw72j7] {
    font-weight: 700;
    margin-bottom: .5rem;
}

.ui-help-list[b-3ia7lw72j7] {
    margin: 0;
    padding-left: 1.1rem;
    color: rgba(0,0,0,.75);
}

.ui-chipgrid[b-3ia7lw72j7] {
    display: grid;
    gap: 1rem;
}

/* Sticky save bar: always helpful on mobile, unobtrusive on desktop */
.ui-stickybar[b-3ia7lw72j7] {
    position: sticky;
    bottom: 0;
    margin-top: 1rem;
    z-index: 10;
}

.ui-stickybar-inner[b-3ia7lw72j7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .75rem;
    border-radius: 1rem;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(0,0,0,.08);
    box-shadow: 0 10px 30px rgba(0,0,0,.10);
}

.ui-stickybar-left[b-3ia7lw72j7] {
    min-width: 0;
}

.ui-stickybar-name[b-3ia7lw72j7] {
    font-weight: 700;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ui-stickybar-meta[b-3ia7lw72j7] {
    color: rgba(0,0,0,.65);
    font-size: .9rem;
}

/* On larger screens, the sticky bar doesn’t need to look “floating” */
@media (min-width: 992px) {
    .ui-page[b-3ia7lw72j7] {
        padding-bottom: 0;
    }

    .ui-stickybar-inner[b-3ia7lw72j7] {
        background: transparent;
        border: none;
        box-shadow: none;
        padding: 0;
        justify-content: flex-end;
    }

    .ui-stickybar-left[b-3ia7lw72j7] {
        display: none;
    }
}
/* /Pages/Users/UserList.razor.rz.scp.css */
.user-grid-wrapper[b-yit42qck2z] {
    /* Keep the grid within the viewport height */
    max-height: calc(100vh - 220px); /* adjust 220px for your header/footer */
    overflow: auto; /* grid scrolls inside this div */
}

    /* Optional: make sure the grid itself doesn’t stretch wider than the page */
    .user-grid-wrapper .e-grid[b-yit42qck2z] {
        width: 100%;
        max-width: 100%;
    }

.icon-btn[b-yit42qck2z] {
    background: transparent;
    border: 1px solid transparent; /* invisible default */
    padding: 4px 6px;
    border-radius: 6px;
    cursor: pointer;
    transition: border-color .18s ease, background-color .18s ease;
}

.icon-btn:hover[b-yit42qck2z],
.icon-btn:focus[b-yit42qck2z] {
    border-color: #3C85AE; /* visible only on hover */
    background-color: rgba(60,133,174,.10); /* subtle highlight */
}

.icon-btn i[b-yit42qck2z] {
    font-size: 1rem; /* adjust icon size here */
    color: #3C85AE;
}

.icon-btn:hover i[b-yit42qck2z] {
    color: #005c89;
}

.edit-icon[b-yit42qck2z] {
    font-size: 1.00rem; /* adjust size */
    cursor: pointer;
    color: #3C85AE; /* brand blue */
    border:none !important;
}

.edit-icon:hover[b-yit42qck2z] {
    color: navy !important; /* darker on hover */
    transform: scale(1.1); /* subtle zoom */
}

/*.userlist-page {
    min-height: 70vh;
}

.userlist-card {
    border-radius: 0.75rem;
    box-shadow: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.08);
}

    .userlist-card .card-header {
        background-color: #f8f9fa;
        border-bottom: 1px solid #dee2e6;
    }

    .userlist-card h2 {
        font-size: 1.4rem;
        font-weight: 600;
    }*/

    /* Make grid area breathe a bit */
    /*.userlist-card .card-body {
        padding: 0.75rem;
    }*/

    /* Syncfusion grid tweaks */
    /*.userlist-card .e-grid {
        font-size: 0.9rem;
    }

        .userlist-card .e-grid .e-headercell {
            font-weight: 600;
        }*/

/* On smaller screens, let the grid horizontally scroll */
/*@media (max-width: 768px) {
    .userlist-card .card-body {
        padding: 0.5rem;
    }

    .userlist-card .e-grid {
        overflow-x: auto;
    }
}*/