/* ============================================================================
   Client Home — quick-action toolbar buttons.
   Scoped to .dash-toolbar so it never leaks to other MudButtons.
   Mirrors the mock spec: 40px high, 0 16px padding, 9px radius, 7px icon gap,
   13px text / 16px glyph, 9px between buttons, single right-aligned row.
   Colours come from theme tokens (--primary-rgb / --border) where possible.
   ========================================================================== */

.dash-toolbar {
    display: flex;
    flex-wrap: nowrap;
    gap: 9px;
    justify-content: flex-end;
    margin-left: auto;
}

@media (max-width: 991.98px) {
    .dash-toolbar {
        flex-wrap: wrap;
        justify-content: flex-start;
        margin-left: 0;
    }
}

.dash-toolbar .mud-button-root {
    height: 40px;
    min-height: 40px;
    padding: 0 16px;
    border-radius: 9px;
    font-size: 13px;
    font-weight: 600;
    text-transform: none;
    white-space: nowrap;
}

.dash-toolbar .mud-button-root .mud-button-label {
    gap: 7px;
}

.dash-toolbar .mud-button-root .mud-icon-root {
    font-size: 16px;
}

/* New Quote — cyan */
.dash-toolbar .dash-btn-cyan.mud-button-root {
    background-color: #0ea5e9;
    color: #fff;
    box-shadow: 0 4px 12px rgba(14, 165, 233, .28);
}

.dash-toolbar .dash-btn-cyan.mud-button-root:hover {
    background-color: #0ea5e9;
    filter: brightness(1.05);
}

/* View Overdue — red */
.dash-toolbar .dash-btn-overdue.mud-button-root {
    background-color: #ef5b4c;
    color: #fff;
    box-shadow: 0 4px 12px rgba(239, 91, 76, .28);
}

.dash-toolbar .dash-btn-overdue.mud-button-root:hover {
    background-color: #ef5b4c;
    filter: brightness(1.05);
}

/* Upload Invoice / Upload Receipt — light */
.dash-toolbar .dash-btn-light.mud-button-root {
    background-color: #fff;
    color: #4d5663;
    border: 1px solid var(--border);
    box-shadow: none;
}

.dash-toolbar .dash-btn-light.mud-button-root:hover {
    background-color: #fff;
    border-color: var(--primary);
    color: var(--primary);
}
