/* Additional Custom Colors (not supported by MudBlazor theme */
:root {
    /* Chip colors */
    --admin-palette-info-lighten: #C2DAF0;
    --admin-palette-success-lighten: #C1DFC6;
    --admin-palette-warning-lighten: #F6DA9F;
    --admin-palette-error-lighten: #F3C3C8;

    /* Grays */
    --admin-palette-gray-98: #F3F3F7;
    --admin-palette-gray-90: #DCDEE9;
    --admin-palette-gray-80: #BBBFC8;
    --admin-palette-gray-60: #82868E;
    --admin-palette-gray-50: #696C74;
    --admin-palette-gray-30: #3B3E45;
    --admin-palette-gray-10: #171A1F;

    --admin-form-max-width: 656px;
    --admin-copyright-footer-height: 56px;
}

/* Utility to visually hide content but still expose to screen readers */
.visually-hidden:not(:focus):not(:active) {
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

/* Main content area */
.w-max-width {
    max-width: var(--admin-form-max-width);
}

/* Copyright Footer */
.mud-main-content {
    min-height: calc(100vh - var(--admin-copyright-footer-height));
}

.copyright-footer {
    padding: 16px 48px;
    text-align: right;
    border-top: 1px solid var(--admin-palette-gray-80);
    height: var(--admin-copyright-footer-height);
}

/* Restyling MudBlazor buttons */
.mud-button-root {
  text-transform: none;
  box-shadow: none;
}

/* Adds a line break to grids (for gaps in grid design */
.mud-flex-break {
  flex-basis: 100%;
  height: 0;
  padding: 0 !important;
}

/* Sets custom palette colors for Alerts */
.mud-alert-text-info { background-color: var(--admin-palette-info-lighten); }
.mud-alert-text-success { background-color: var(--admin-palette-success-lighten); }
.mud-alert-text-warning { background-color: var(--admin-palette-warning-lighten); }
.mud-alert-text-error { background-color: var(--admin-palette-error-lighten); }

/* Remove default italics for <address> tag */
address {
    font-style: unset;
}

/* Styles for disabled inputs */
.mud-input-outlined.mud-disabled {
    color: var(--admin-palette-gray-50);
    background-color: var(--admin-palette-gray-98);
}
.mud-input-label-outlined.mud-disabled {
    background-color: var(--admin-palette-gray-98);
}

/* Resize input helper text */
.mud-input-helper-text {
    font-size: 10px;
}

/* Resize Radio Button and Checkbox Labels */
.mud-radio .mud-radio-content.mud-typography,
.mud-checkbox .mud-typography{
    font-size: 16px;
}

/* Resize checkbox padding */
.mud-checkbox .mud-button-root {
    padding: 8px 13px;
}
.mud-checkbox .mud-icon-button:hover {
    background-color: inherit;
}

/* Padding for error 404 and error 500 pages */
.mud-container-padding-error{
    padding: 120px 80px 120px 80px;
}

/* Google Maps */
.map-embed {
    border: 0;
    border-radius: 8px;
    height: 358px !important;
}

/* Enabled checkbox styles */
.mud-checkbox-input + .mud-icon-root,
.mud-checkbox-input:checked + .mud-icon-root {
    color: var(--admin-palette-gray-10);
}

/* Disabled checkbox styles */
.mud-checkbox-input:disabled + .mud-icon-root,
.mud-checkbox-input:checked:disabled + .mud-icon-root {
    color: var(--admin-palette-gray-60);
}

/* Disabled buttons */
.button-style-grey:disabled {
    background-color: var(--admin-palette-gray-98);
}

/*
 * Set a specific size for the in-button progress spinner
 * to ensure button height doesn't change when the spinner is shown.
 */
.mud-button .mud-progress-circular.mud-progress-small {
    width: 19px;
    height: 19px;
}