.header {
    width: 100%;
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #6E3AB6 rgba(26, 26, 26, 0.32);
}

.dashboard {
    display: flex;
    gap: 10px;
    padding: 15px;
    font-family: helvetica;
}

.card {
    min-width: 140px;
    color: #fff;
    padding: 0;
}

.purple {
    background: linear-gradient(164.66deg, #F1EBFC 1.77%, #E6DBF9 100%);
}

.orange {
    background: linear-gradient(164.66deg, #FFE7C6 1.77%, #FFCD88 100%);
}

.green {
    background: linear-gradient(164.66deg, #E0F4D3 1.77%, #C4EAAC 100%);
}

.red {
    background: linear-gradient(164.66deg, #FDE7E3 1.77%, #FDD2CB 100%);
}

.theme-based2 {
    background: linear-gradient(164.66deg, #FBE8F7 1.77%, #F9D1F0 100%);
}

.title {
    font-size: 14px;
    font-weight: normal;
    margin: 0;
    padding: 9px 9px 10px 9px;
    color: black;
}

.value {
    font-size: 32px;
    font-weight: 600;
    line-height: 42px;
    border-bottom: 1px solid #b4b4b4;
    padding: 0 9px 10px 9px;
    margin: 0;
    color: black;
}

.family {
    font-family: helvetica;
}

.paddingleft {
    padding-left: 2px;
}

.footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px 9px 9px;
    color: black;
    font-family: helvetica;
}

.label {
    font-size: 14px;
}

.sub {
    font-size: 20px;
}

.container {
    padding-left: 20px;
    display: flex;
    align-items: center;
    gap: 20px;
}

.view-group {
    display: flex;
    align-items: center;
    gap: 10px;
}

.viewlabel {
    font-weight: bold;
}

.group {
    display: flex;
    align-items: center;
    gap: 10px;
}

.select-group {
    display: flex;
    align-items: center;
}

.summary-dropdown {
    min-width: 180px;
}

/* Keep your existing mat-select and mat-option styles */

::ng-deep.mat-mdc-radio-button.mat-mdc-radio-checked .mat-ripple-element,
.mat-mdc-radio-button.mat-mdc-radio-checked .mdc-radio__background::before {
    background-color: var(--radio-checked-dot) !important;
}

::ng-deep .mat-mdc-radio-button .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__outer-circle,
.mat-mdc-radio-button .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__inner-circle {
    border-color: var(--radio-checked-dot) !important;
}

::ng-deep .mat-mdc-radio-button .mdc-radio__native-control:enabled:not(:checked)+.mdc-radio__background>.mdc-radio__outer-circle {
    border-color: var(--radio-unchecked-border) !important;
}

::ng-deep .mat-mdc-radio-button .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__inner-circle {
    border-color: var(--radio-checked-dot) !important
}

::ng-deep .mat-mdc-radio-button.mat-mdc-radio-checked .mat-ripple-element,
.mat-mdc-radio-button.mat-mdc-radio-checked .mdc-radio__background::before {
    background-color: var(--radio-checked-dot) !important;
}

::ng-deep.mat-mdc-radio-button.mat-mdc-radio-checked .mat-ripple-element,
.mat-mdc-radio-button.mat-mdc-radio-checked .mdc-radio__background::before {
    background-color: var(--radio-checked-dot) !important;
}

::ng-deep .mat-mdc-radio-button .mdc-radio__native-control:disabled+.mdc-radio__background .mdc-radio__outer-circle {
    border-color: var(--radio-checked-dot) !important;
    opacity: 1 !important;
}

::ng-deep.mat-mdc-radio-button .mdc-radio__native-control:disabled+.mdc-radio__background .mdc-radio__inner-circle,
.mat-mdc-radio-button .mdc-radio__native-control:disabled+.mdc-radio__background .mdc-radio__outer-circle {
    border-color: var(--radio-checked-dot) !important;
    opacity: 1 !important;
}

::ng-deep.mat-mdc-radio-button .mdc-radio__native-control:disabled+.mdc-radio__background .mdc-radio__inner-circle,
.mat-mdc-radio-button .mdc-radio__native-control:disabled+.mdc-radio__background .mdc-radio__outer-circle {
    border-color: var(--radio-checked-dot) !important;
    opacity: 1 !important;
}

::ng-deep .mat-mdc-radio-button .mdc-radio--disabled+label {
    color: var(--text-primary) !important;
}

::ng-deep .mat-internal-form-field>label {
    color: var(--text-primary) !important;
    padding-left: 0px !important;
}

.mat-select-value {
    display: table-cell;
    max-width: 0;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

mat-select {
    width: auto;
    min-width: 180px;
    white-space: nowrap;
}

mat-option {
    min-width: 140px;
    white-space: nowrap;
    min-height: 40px;
    border-radius: 6px;
}

.mat-mdc-select-panel-below div.mat-mdc-select-panel {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    transform-origin: bottom center;
}

// mat-select styles
::ng-deep .mat-mdc-select-value {
    padding-left: 10px !important;
}

::ng-deep .mat-mdc-select-arrow {
    color: var(--radio-unchecked-border) !important;
}

::ng-deep .mat-mdc-select-arrow-wrapper {
    width: 24px !important;
}

::ng-deep div.mat-mdc-select-panel {
    background-color: var(--bg-surface) !important;
}

::ng-deep .mat-mdc-option {
    color: var(--text-primary) !important;
}

::ng-deep .mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled):not(.mat-mdc-option-multiple) .mdc-list-item__primary-text {
    color: var(--action-primary-active) !important;
}

::ng-deep .mat-mdc-option .mat-pseudo-checkbox {
    --mat-pseudo-checkbox-minimal-selected-checkmark-color: var(--action-primary-active) !important;
}

::ng-deep .mat-mdc-option:hover:not(.mdc-list-item--disabled) {
    background-color: var(--action-secondary-hover) !important;
}
