/* Blazor-specific overrides — Tailwind CDN handles the bulk of Blazor styling;
   this file holds rules that cannot be expressed as Tailwind utilities. */

/* Loaded only via Pages/_Host.cshtml, so no impact on MVC pages. */

/* Ensure box-sizing is consistent for Blazor EditForm inputs */
.blazor-form-input {
    box-sizing: border-box;
}

/* MudBlazor nav link overrides — match cp-teal/cp-orange site theme */
.mud-nav-link:hover {
    background-color: rgba(20, 143, 119, 0.08) !important;
}

.mud-nav-link.active {
    background-color: rgba(20, 143, 119, 0.15) !important;
    color: #148f77 !important;
    border-left: 3px solid #148f77;
}

/* Consistent icon width inside MudNavLink for Font Awesome icons */
.mud-nav-link .fas,
.mud-nav-link .far,
.mud-nav-link .fab {
    width: 1.25rem;
    text-align: center;
}

/* Hide MudBlazor built-in chart legend — used on dashboard pie/donut charts
   that render a custom legend with counts below the chart instead. */
.no-chart-legend .mud-chart-legend,
.no-chart-legend .mud-charts-legend {
    display: none !important;
}

/* DateRangeFilter: the wrapper pins the input to 155px while allowing the
   calendar popup to overflow at its natural width (300px+).
   overflow:visible ensures the absolutely-positioned picker panel is not clipped. */
.date-filter-picker-wrap {
    position: relative;
    width: 155px;
    overflow: visible;
}

.date-filter-picker-wrap .mud-picker {
    width: 100%;
}

/* Calendar panel: guarantee a minimum width so the full month grid is visible
   regardless of the constrained input width above it. */
.mud-picker-inline-paper {
    min-width: 300px !important;
    width: auto !important;
}

/* Brand green (#148f77) override for MudButton filled variant */
.mud-btn-cp-green.mud-button-filled {
    background-color: #148f77 !important;
    color: #fff !important;
}
.mud-btn-cp-green.mud-button-filled:hover {
    background-color: #0f6b59 !important;
}