:root[data-theme=material3] {
  --palette-hue: var(--neutral-hue);
  --palette-saturation: var(--neutral-saturation);
  --palette-lightness-0: var(--neutral-lightness-0);
  --palette-color-0: var(--neutral-color-0);
  --palette-color-0-ch: var(--neutral-color-0-ch);
  --palette-gray-0: var(--neutral-gray-0);
  --palette-accent-0: var(--neutral-accent-0);
  --palette-lightness-1: var(--neutral-lightness-1);
  --palette-color-1: var(--neutral-color-1);
  --palette-color-1-ch: var(--neutral-color-1-ch);
  --palette-gray-1: var(--neutral-gray-1);
  --palette-accent-1: var(--neutral-accent-1);
  --palette-lightness-2: var(--neutral-lightness-2);
  --palette-color-2: var(--neutral-color-2);
  --palette-color-2-ch: var(--neutral-color-2-ch);
  --palette-gray-2: var(--neutral-gray-2);
  --palette-accent-2: var(--neutral-accent-2);
  --palette-lightness-3: var(--neutral-lightness-3);
  --palette-color-3: var(--neutral-color-3);
  --palette-color-3-ch: var(--neutral-color-3-ch);
  --palette-gray-3: var(--neutral-gray-3);
  --palette-accent-3: var(--neutral-accent-3);
  --palette-lightness-4: var(--neutral-lightness-4);
  --palette-color-4: var(--neutral-color-4);
  --palette-color-4-ch: var(--neutral-color-4-ch);
  --palette-gray-4: var(--neutral-gray-4);
  --palette-accent-4: var(--neutral-accent-4);
  --palette-lightness-5: var(--neutral-lightness-5);
  --palette-color-5: var(--neutral-color-5);
  --palette-color-5-ch: var(--neutral-color-5-ch);
  --palette-gray-5: var(--neutral-gray-5);
  --palette-accent-5: var(--neutral-accent-5);
  --palette-lightness-6: var(--neutral-lightness-6);
  --palette-color-6: var(--neutral-color-6);
  --palette-color-6-ch: var(--neutral-color-6-ch);
  --palette-gray-6: var(--neutral-gray-6);
  --palette-accent-6: var(--neutral-accent-6);
  --palette-lightness-7: var(--neutral-lightness-7);
  --palette-color-7: var(--neutral-color-7);
  --palette-color-7-ch: var(--neutral-color-7-ch);
  --palette-gray-7: var(--neutral-gray-7);
  --palette-accent-7: var(--neutral-accent-7);
  --palette-lightness-8: var(--neutral-lightness-8);
  --palette-color-8: var(--neutral-color-8);
  --palette-color-8-ch: var(--neutral-color-8-ch);
  --palette-gray-8: var(--neutral-gray-8);
  --palette-accent-8: var(--neutral-accent-8);
  --palette-lightness-9: var(--neutral-lightness-9);
  --palette-color-9: var(--neutral-color-9);
  --palette-color-9-ch: var(--neutral-color-9-ch);
  --palette-gray-9: var(--neutral-gray-9);
  --palette-accent-9: var(--neutral-accent-9);
  --palette-lightness-10: var(--neutral-lightness-10);
  --palette-color-10: var(--neutral-color-10);
  --palette-color-10-ch: var(--neutral-color-10-ch);
  --palette-gray-10: var(--neutral-gray-10);
  --palette-accent-10: var(--neutral-accent-10);
  --palette-lighter: var(--neutral-lighter);
  --palette-accent-lighter: var(--neutral-accent-lighter);
  --palette-lighter-ch: var(--neutral-lighter-ch);
  --palette-light: var(--neutral-light);
  --palette-accent-light: var(--neutral-accent-light);
  --palette-light-ch: var(--neutral-light-ch);
  --palette-default: var(--neutral-default);
  --palette-accent-default: var(--neutral-accent-default);
  --palette-default-ch: var(--neutral-default-ch);
  --palette-dark: var(--neutral-dark);
  --palette-accent-dark: var(--neutral-accent-dark);
  --palette-dark-ch: var(--neutral-dark-ch);
  --palette-darker: var(--neutral-darker);
  --palette-accent-darker: var(--neutral-accent-darker);
  --palette-darker-ch: var(--neutral-darker-ch);
  --primary-hue: 254;
  --primary-saturation: 40%;
  --primary-lighter: var(--primary-color-2);
  --primary-lighter-ch: var(--primary-color-2-ch);
  --primary-accent-lighter: var(--primary-accent-2);
  --primary-light: var(--primary-color-3);
  --primary-light-ch: var(--primary-color-3-ch);
  --primary-accent-light: var(--primary-accent-3);
  --primary-default: var(--primary-color-6);
  --primary-default-ch: var(--primary-color-6-ch);
  --primary-accent-default: var(--primary-accent-6);
  --primary-dark: var(--primary-color-8);
  --primary-dark-ch: var(--primary-color-8-ch);
  --primary-accent-dark: var(--primary-accent-8);
  --primary-darker: var(--primary-color-9);
  --primary-darker-ch: var(--primary-color-9-ch);
  --primary-accent-darker: var(--primary-accent-9);
  --secondary-hue: 250;
  --secondary-saturation: 13%;
  --secondary-lighter: var(--secondary-color-2);
  --secondary-lighter-ch: var(--secondary-color-2-ch);
  --secondary-accent-lighter: var(--secondary-accent-2);
  --secondary-light: var(--secondary-color-3);
  --secondary-light-ch: var(--secondary-color-3-ch);
  --secondary-accent-light: var(--secondary-accent-3);
  --secondary-default: var(--secondary-color-6);
  --secondary-default-ch: var(--secondary-color-6-ch);
  --secondary-accent-default: var(--secondary-accent-6);
  --secondary-dark: var(--secondary-color-8);
  --secondary-dark-ch: var(--secondary-color-8-ch);
  --secondary-accent-dark: var(--secondary-accent-8);
  --secondary-darker: var(--secondary-color-9);
  --secondary-darker-ch: var(--secondary-color-9-ch);
  --secondary-accent-darker: var(--secondary-accent-9);
  --tertiary-hue: 355;
  --tertiary-saturation: 30%;
  --tertiary-accent-5: var(--tertiary-accent-light-color);
  --tertiary-accent-6: var(--tertiary-accent-light-color);
  --tertiary-lighter: var(--tertiary-color-2);
  --tertiary-lighter-ch: var(--tertiary-color-2-ch);
  --tertiary-accent-lighter: var(--tertiary-accent-2);
  --tertiary-light: var(--tertiary-color-3);
  --tertiary-light-ch: var(--tertiary-color-3-ch);
  --tertiary-accent-light: var(--tertiary-accent-3);
  --tertiary-default: var(--tertiary-color-6);
  --tertiary-default-ch: var(--tertiary-color-6-ch);
  --tertiary-accent-default: var(--tertiary-accent-6);
  --tertiary-dark: var(--tertiary-color-8);
  --tertiary-dark-ch: var(--tertiary-color-8-ch);
  --tertiary-accent-dark: var(--tertiary-accent-8);
  --tertiary-darker: var(--tertiary-color-9);
  --tertiary-darker-ch: var(--tertiary-color-9-ch);
  --tertiary-accent-darker: var(--tertiary-accent-9);
  --danger-hue: 8;
  --danger-saturation: 90%;
  --danger-lighter: var(--danger-color-2);
  --danger-lighter-ch: var(--danger-color-2-ch);
  --danger-accent-lighter: var(--danger-accent-2);
  --danger-light: var(--danger-color-3);
  --danger-light-ch: var(--danger-color-3-ch);
  --danger-accent-light: var(--danger-accent-3);
  --danger-default: var(--danger-color-6);
  --danger-default-ch: var(--danger-color-6-ch);
  --danger-accent-default: var(--danger-accent-6);
  --danger-dark: var(--danger-color-8);
  --danger-dark-ch: var(--danger-color-8-ch);
  --danger-accent-dark: var(--danger-accent-8);
  --danger-darker: var(--danger-color-9);
  --danger-darker-ch: var(--danger-color-9-ch);
  --danger-accent-darker: var(--danger-accent-9);
  --success-hue: 133;
  --success-saturation: 55%;
  --success-lighter: var(--success-color-2);
  --success-lighter-ch: var(--success-color-2-ch);
  --success-accent-lighter: var(--success-accent-2);
  --success-light: var(--success-color-3);
  --success-light-ch: var(--success-color-3-ch);
  --success-accent-light: var(--success-accent-3);
  --success-default: var(--success-color-6);
  --success-default-ch: var(--success-color-6-ch);
  --success-accent-default: var(--success-accent-6);
  --success-dark: var(--success-color-8);
  --success-dark-ch: var(--success-color-8-ch);
  --success-accent-dark: var(--success-accent-8);
  --success-darker: var(--success-color-9);
  --success-darker-ch: var(--success-color-9-ch);
  --success-accent-darker: var(--success-accent-9);
  --warning-hue: 46;
  --warning-saturation: 100%;
  --warning-lighter: var(--warning-color-2);
  --warning-lighter-ch: var(--warning-color-2-ch);
  --warning-accent-lighter: var(--warning-accent-2);
  --warning-light: var(--warning-color-3);
  --warning-light-ch: var(--warning-color-3-ch);
  --warning-accent-light: var(--warning-accent-3);
  --warning-default: var(--warning-color-6);
  --warning-default-ch: var(--warning-color-6-ch);
  --warning-accent-default: var(--warning-accent-6);
  --warning-dark: var(--warning-color-8);
  --warning-dark-ch: var(--warning-color-8-ch);
  --warning-accent-dark: var(--warning-accent-8);
  --warning-darker: var(--warning-color-9);
  --warning-darker-ch: var(--warning-color-9-ch);
  --warning-accent-darker: var(--warning-accent-9);
  --info-hue: 195;
  --info-saturation: 75%;
  --info-lighter: var(--info-color-2);
  --info-lighter-ch: var(--info-color-2-ch);
  --info-accent-lighter: var(--info-accent-2);
  --info-light: var(--info-color-3);
  --info-light-ch: var(--info-color-3-ch);
  --info-accent-light: var(--info-accent-3);
  --info-default: var(--info-color-7);
  --info-default-ch: var(--info-color-7-ch);
  --info-accent-default: var(--info-accent-7);
  --info-dark: var(--info-color-8);
  --info-dark-ch: var(--info-color-8-ch);
  --info-accent-dark: var(--info-accent-8);
  --info-darker: var(--info-color-9);
  --info-darker-ch: var(--info-color-9-ch);
  --info-accent-darker: var(--info-accent-9);
  --neutral-hue: 280;
  --neutral-saturation: 13%;
  --neutral-lighter: var(--neutral-color-2);
  --neutral-lighter-ch: var(--neutral-color-2-ch);
  --neutral-accent-lighter: var(--neutral-accent-2);
  --neutral-light: var(--neutral-color-3);
  --neutral-light-ch: var(--neutral-color-3-ch);
  --neutral-accent-light: var(--neutral-accent-3);
  --neutral-default: var(--neutral-color-7);
  --neutral-default-ch: var(--neutral-color-7-ch);
  --neutral-accent-default: var(--neutral-accent-7);
  --neutral-dark: var(--neutral-color-8);
  --neutral-dark-ch: var(--neutral-color-8-ch);
  --neutral-accent-dark: var(--neutral-accent-8);
  --neutral-darker: var(--neutral-color-9);
  --neutral-darker-ch: var(--neutral-color-9-ch);
  --neutral-accent-darker: var(--neutral-accent-9);
}

:root[data-theme=material3],
:root[data-theme=material3][data-color-scheme=light] {
  --border-color: var(--neutral-gray-3);
  --border-color-subtle: var(--neutral-gray-2);
  --border-color-strong: var(--neutral-gray-5);
  --control-border-color: var(--neutral-gray-4);
  --control-border-color-strong: var(--neutral-gray-5);
  --control-border-color-subtle: var(--neutral-gray-2);
  --text-color: var(--neutral-gray-8);
  --text-color-subtle: var(--neutral-gray-5);
  --text-color-strong: var(--neutral-gray-10);
  --surface-color-overlay: var(--neutral-color-0);
  --surface-color-raised: var(--neutral-color-1);
  --surface-color: var(--neutral-color-2);
  --surface-color-sunken: var(--neutral-color-3);
  --surface-color-deep: var(--neutral-color-4);
}

:root[data-theme=material3][data-color-scheme=dark] {
  --palette-lighter: var(--palette-color-2);
  --palette-accent-lighter: var(--palette-accent-2);
  --palette-light: var(--palette-color-3);
  --palette-accent-light: var(--palette-accent-3);
  --palette-default: var(--palette-color-4);
  --palette-accent-default: var(--palette-accent-4);
  --palette-dark: var(--palette-color-7);
  --palette-accent-dark: var(--palette-accent-7);
  --palette-darker: var(--palette-color-9);
  --palette-accent-darker: var(--palette-accent-9);
  --primary-lighter: var(--primary-color-2);
  --primary-accent-lighter: var(--primary-accent-2);
  --primary-light: var(--primary-color-3);
  --primary-accent-light: var(--primary-accent-3);
  --primary-default: var(--primary-color-4);
  --primary-accent-default: var(--primary-accent-4);
  --primary-dark: var(--primary-color-7);
  --primary-accent-dark: var(--primary-accent-7);
  --primary-darker: var(--primary-color-9);
  --primary-accent-darker: var(--primary-accent-9);
  --secondary-lighter: var(--secondary-color-2);
  --secondary-accent-lighter: var(--secondary-accent-2);
  --secondary-light: var(--secondary-color-3);
  --secondary-accent-light: var(--secondary-accent-3);
  --secondary-default: var(--secondary-color-4);
  --secondary-accent-default: var(--secondary-accent-4);
  --secondary-dark: var(--secondary-color-7);
  --secondary-accent-dark: var(--secondary-accent-7);
  --secondary-darker: var(--secondary-color-9);
  --secondary-accent-darker: var(--secondary-accent-9);
  --tertiary-lighter: var(--tertiary-color-2);
  --tertiary-accent-lighter: var(--tertiary-accent-2);
  --tertiary-light: var(--tertiary-color-3);
  --tertiary-accent-light: var(--tertiary-accent-3);
  --tertiary-default: var(--tertiary-color-4);
  --tertiary-accent-default: var(--tertiary-accent-4);
  --tertiary-dark: var(--tertiary-color-7);
  --tertiary-accent-dark: var(--tertiary-accent-7);
  --tertiary-darker: var(--tertiary-color-9);
  --tertiary-accent-darker: var(--tertiary-accent-9);
  --success-lighter: var(--success-color-2);
  --success-accent-lighter: var(--success-accent-2);
  --success-light: var(--success-color-3);
  --success-accent-light: var(--success-accent-3);
  --success-default: var(--success-color-4);
  --success-accent-default: var(--success-accent-4);
  --success-dark: var(--success-color-7);
  --success-accent-dark: var(--success-accent-7);
  --success-darker: var(--success-color-9);
  --success-accent-darker: var(--success-accent-9);
  --warning-lighter: var(--warning-color-2);
  --warning-accent-lighter: var(--warning-accent-2);
  --warning-light: var(--warning-color-3);
  --warning-accent-light: var(--warning-accent-3);
  --warning-default: var(--warning-color-4);
  --warning-accent-default: var(--warning-accent-4);
  --warning-dark: var(--warning-color-8);
  --warning-accent-dark: var(--warning-accent-8);
  --warning-darker: var(--warning-color-9);
  --warning-accent-darker: var(--warning-accent-9);
  --danger-lighter: var(--danger-color-2);
  --danger-accent-lighter: var(--danger-accent-2);
  --danger-light: var(--danger-color-3);
  --danger-accent-light: var(--danger-accent-3);
  --danger-default: var(--danger-color-4);
  --danger-accent-default: var(--danger-accent-4);
  --danger-dark: var(--danger-color-7);
  --danger-accent-dark: var(--danger-accent-7);
  --danger-darker: var(--danger-color-9);
  --danger-accent-darker: var(--danger-accent-9);
  --info-lighter: var(--info-color-2);
  --info-accent-lighter: var(--info-accent-2);
  --info-light: var(--info-color-3);
  --info-accent-light: var(--info-accent-3);
  --info-default: var(--info-color-4);
  --info-accent-default: var(--info-accent-4);
  --info-dark: var(--info-color-8);
  --info-accent-dark: var(--info-accent-8);
  --info-darker: var(--info-color-9);
  --info-accent-darker: var(--info-accent-9);
  --neutral-lightness-0: 99%;
  --neutral-lightness-1: 92%;
  --neutral-lightness-2: 85%;
  --neutral-lightness-3: 75%;
  --neutral-lightness-4: 65%;
  --neutral-lightness-5: 45%;
  --neutral-lightness-6: 25%;
  --neutral-lightness-7: 10%;
  --neutral-lightness-8: 6%;
  --neutral-lightness-9: 4%;
  --neutral-lightness-10: 1%;
  --neutral-lighter: var(--neutral-color-2);
  --neutral-accent-lighter: var(--neutral-accent-2);
  --neutral-light: var(--neutral-color-3);
  --neutral-accent-light: var(--neutral-accent-3);
  --neutral-default: var(--neutral-color-4);
  --neutral-accent-default: var(--neutral-accent-4);
  --neutral-dark: var(--neutral-color-6);
  --neutral-accent-dark: var(--neutral-accent-6);
  --neutral-darker: var(--neutral-color-7);
  --neutral-accent-darker: var(--neutral-accent-7);
  --border-color: var(--neutral-color-5);
  --border-color-subtle: var(--neutral-color-7);
  --border-color-strong: var(--neutral-color-4);
  --text-color: var(--neutral-gray-1);
  --text-color-subtle: var(--neutral-gray-0);
  --text-color-strong: var(--neutral-gray-3);
  --surface-color-overlay: var(--neutral-color-7);
  --surface-color-raised: var(--neutral-color-8);
  --surface-color: var(--neutral-color-9);
  --surface-color-sunken: var(--neutral-color-9);
  --surface-color-deep: var(--neutral-color-10);
}

:root[data-theme=material3] {
  --font-body-size: 16px;
  --font-family:
    "Roboto", "Roboto Flex", "Roboto Serif", "Roboto Mono", "Noto Sans",
    sans-serif;
}

:root[data-theme=material3][data-color-scheme=dark] {
  --shadow-0-color: rgba(0, 0, 0, 0.8);
  --shadow-1-color: rgba(0, 0, 0, 0.8);
  --shadow-2-color: rgba(0, 0, 0, 0.8);
  --shadow-3-color: rgba(0, 0, 0, 0.8);
  --shadow-4-color: rgba(0, 0, 0, 0.8);
  --shadow-5-color: rgba(0, 0, 0, 0.8);
}

:root[data-theme=material3] .accordion {
  --accordion-icon-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6-1.41-1.41z'/%3E%3C/svg%3E");
  --accordion-icon-open-rotation: 180deg;
  --accordion-header-hover-bg-color: var(--accordion-header-bg-color);
  --accordion-icon-size: 2.5rem;
  --accordion-icon-border-radius: 50%;
  --accordion-icon-hover-bg-color: rgba(0, 0, 0, 0.08);
}

:root[data-theme=material3][data-color-scheme=dark] .accordion {
  --accordion-icon-hover-bg-color: rgba(255, 255, 255, 0.08);
}

:root[data-theme=material3] .alert {
  --alert-border-color: var(--alert-bg-color);
  --alert-border-radius: 0.5rem;
}

:root[data-theme=material3] .button {
  --button-border-width: 1px;
  --button-border-radius: 10rem;
  --button-transition:
    background-color 0.3s, color 0.3s, box-shadow 0.3s, opacity 0.3s,
    border-radius 0.1s;
  --button-focus-ring-color: var(--palette-default);
  --button-active-border-radius: 0.5rem;
  --button-height: 56px;
  --button-padding: 0px 24px;
  --button-gap: 8px;
  --button-xs-height: 32px;
  --button-xs-padding: 0px 12px;
  --button-xs-gap: 4px;
  --button-sm-height: 40px;
  --button-sm-padding: 0px 16px;
  --button-sm-gap: 8px;
  --button-lg-height: 96px;
  --button-lg-padding: 0px 48px;
  --button-lg-gap: 12px;
  --button-xl-height: 136px;
  --button-xl-padding: 0px 64px;
  --button-xl-gap: 16px;
}
:root[data-theme=material3] .button.filled {
  --button-hover-bg-color: var(--button-bg-color);
  --button-hover-color: var(--button-color);
  --button-hover-opacity: 0.8;
  --button-active-bg-color: var(--button-bg-color);
  --button-active-color: var(--button-color);
  --button-active-opacity: 0.7;
  --button-border-color: var(--button-bg-color);
  --button-hover-border-color: var(--button-hover-bg-color);
  --button-active-border-color: var(--button-active-bg-color);
  --button-focus-border-color: var(--button-focus-bg-color);
  --button-disabled-bg-color: var(--neutral-lighter);
  --button-disabled-border-color: var(--neutral-lighter);
  --button-disabled-opacity: 1;
  --button-disabled-color: var(--text-color-subtle);
}
:root[data-theme=material3] .button.tonal {
  --button-hover-bg-color: var(--palette-light);
  --button-active-bg-color: var(--button-hover-bg-color);
  --button-focus-bg-color: var(--button-hover-bg-color);
  --button-border-color: var(--button-bg-color);
  --button-hover-border-color: var(--button-hover-bg-color);
  --button-active-border-color: var(--button-active-bg-color);
  --button-focus-border-color: var(--button-focus-bg-color);
  --button-disabled-bg-color: var(--neutral-lighter);
  --button-disabled-border-color: var(--neutral-lighter);
  --button-disabled-opacity: 1;
  --button-disabled-color: var(--text-color-subtle);
  --button-hover-box-shadow: var(--shadow-1);
}
:root[data-theme=material3] .button.outlined {
  --button-disabled-bg-color: var(--neutral-lighter);
  --button-disabled-border-color: var(--neutral-light);
  --button-disabled-opacity: 1;
}
:root[data-theme=material3] .button.text {
  --button-focus-bg-color: var(--button-bg-color);
  --button-disabled-bg-color: var(--neutral-lighter);
  --button-disabled-border-color: var(--neutral-lighter);
  --button-disabled-opacity: 1;
  --button-disabled-color: var(--text-color-subtle);
}

:root[data-theme=material3][data-color-scheme=dark] .button.filled {
  --button-bg-color: var(--palette-light);
  --button-color: var(--palette-darker);
  --button-hover-bg-color: var(--palette-lighter);
  --button-hover-color: var(--palette-darker);
  --button-hover-opacity: 1;
  --button-active-bg-color: var(--palette-lighter);
  --button-active-color: var(--palette-darker);
  --button-active-opacity: 0.9;
  --button-border-color: var(--button-bg-color);
  --button-hover-border-color: var(--button-hover-bg-color);
  --button-active-border-color: var(--button-active-bg-color);
  --button-focus-border-color: var(--button-focus-bg-color);
  --button-disabled-bg-color: var(--neutral-gray-7);
  --button-disabled-border-color: var(--button-disabled-bg-color);
  --button-disabled-opacity: 1;
  --button-disabled-color: var(--neutral-gray-5);
}
:root[data-theme=material3][data-color-scheme=dark] .button.tonal {
  --button-bg-color: var(--palette-darker);
  --button-color: var(--palette-lighter);
  --button-hover-bg-color: var(--palette-dark);
  --button-hover-color: var(--button-color);
  --button-active-bg-color: var(--button-hover-bg-color);
  --button-active-color: var(--button-color);
  --button-focus-bg-color: var(--button-hover-bg-color);
  --button-focus-color: var(--button-color);
  --button-border-color: var(--button-bg-color);
  --button-hover-border-color: var(--button-hover-bg-color);
  --button-active-border-color: var(--button-active-bg-color);
  --button-focus-border-color: var(--button-focus-bg-color);
  --button-disabled-bg-color: var(--neutral-gray-7);
  --button-disabled-border-color: var(--button-disabled-bg-color);
  --button-disabled-opacity: 1;
  --button-disabled-color: var(--neutral-gray-5);
  --button-hover-box-shadow: var(--shadow-1);
}
:root[data-theme=material3][data-color-scheme=dark] .button.outlined {
  --button-hover-bg-color: var(--palette-darker);
  --button-hover-color: var(--button-color);
  --button-active-bg-color: var(--button-hover-bg-color);
  --button-active-color: var(--button-color);
  --button-focus-bg-color: var(--button-hover-bg-color);
  --button-focus-color: var(--button-color);
  --button-disabled-bg-color: var(--neutral-gray-7);
  --button-disabled-border-color: var(--button-disabled-color);
  --button-disabled-opacity: 1;
  --button-disabled-color: var(--neutral-gray-5);
  --button-disabled-opacity: 1;
}
:root[data-theme=material3][data-color-scheme=dark] .button.text {
  --button-hover-bg-color: var(--palette-darker);
  --button-hover-color: var(--button-color);
  --button-active-bg-color: var(--button-hover-bg-color);
  --button-active-color: var(--button-color);
  --button-focus-bg-color: var(--button-hover-bg-color);
  --button-focus-color: var(--button-color);
  --button-disabled-bg-color: var(--neutral-gray-7);
  --button-disabled-border-color: var(--button-disabled-bg-color);
  --button-disabled-opacity: 1;
  --button-disabled-color: var(--neutral-gray-5);
}

:root[data-theme=material3] .checkbox {
  --checkbox-border-radius: 3px;
  --checkbox-state-layer-size: 2.5rem;
  --checkbox-focus-ring-width: 0;
  position: relative;
  overflow: visible;
}
:root[data-theme=material3] .checkbox::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--checkbox-state-layer-size);
  height: var(--checkbox-state-layer-size);
  transform: translate(-50%, -50%) scale(0);
  border-radius: 50%;
  background-color: var(--text-color);
  border: 2px solid transparent;
  opacity: 0;
  pointer-events: none;
  transition: transform 0.2s, opacity 0.2s;
}
:root[data-theme=material3] .checkbox:hover:not(:disabled)::after {
  transform: translate(-50%, -50%) scale(1);
  opacity: 0.08;
}
:root[data-theme=material3] .checkbox:active:not(:disabled)::after {
  transform: translate(-50%, -50%) scale(1);
  opacity: 0.16;
}
:root[data-theme=material3] .checkbox:focus-visible:not(:disabled)::after {
  transform: translate(-50%, -50%) scale(1);
  background-color: transparent;
  border-color: var(--neutral-default);
  opacity: 1;
}
:root[data-theme=material3] .checkbox:checked:hover:not(:disabled)::after, :root[data-theme=material3] .checkbox:checked:active:not(:disabled)::after, :root[data-theme=material3] .checkbox:indeterminate:hover:not(:disabled)::after, :root[data-theme=material3] .checkbox:indeterminate:active:not(:disabled)::after {
  background-color: var(--checkbox-checked-bg-color);
}

:root[data-theme=material3] .chip {
  --chip-border-radius: 0.5rem;
  --chip-focus-ring-offset: 2px;
}

:root[data-theme=material3] .form-control {
  --form-control-disabled-opacity: 0.6;
  --form-control-readonly-cursor: text;
  --form-control-focus-ring-width: 1.5px;
  --form-control-focus-ring-color: var(--palette-default);
  --form-control-focus-ring-opacity: 1;
  --form-control-focus-ring-offset-width: 0px;
  --form-control-cursor: pointer;
}

:root[data-theme=material3] .form-control,
:root[data-theme=material3][data-color-scheme=light] .form-control {
  --form-control-filled-bg-color: var(--neutral-gray-2);
  --form-control-filled-hover-bg-color: var(--neutral-gray-3);
}

:root[data-theme=material3][data-color-scheme=dark] .form-control {
  --form-control-filled-bg-color: var(--neutral-gray-7);
  --form-control-filled-hover-bg-color: var(--neutral-gray-6);
  --form-control-border-color: var(--neutral-gray-4);
  --form-control-hover-border-color: var(--neutral-gray-5);
  --form-control-placeholder-color: var(--form-control-border-color);
}

:root[data-theme=material3] .list,
:root[data-theme=material3] .list-group {
  --list-hover-bg-color: var(--palette-lighter);
  --list-hover-color: var(--palette-accent-lighter);
  --list-active-bg-color: var(--palette-light);
  --list-active-color: var(--palette-accent-light);
  --list-disabled-color: var(--text-color-muted);
  --list-border-width: none;
  --list-active-border-radius: 0.5rem;
}

:root[data-theme=material3] .radio {
  --radio-mark-size: 65%;
  --radio-state-layer-size: 2.5rem;
  --radio-focus-ring-width: 0;
  position: relative;
  overflow: visible;
}
:root[data-theme=material3] .radio::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--radio-state-layer-size);
  height: var(--radio-state-layer-size);
  transform: translate(-50%, -50%) scale(0);
  border-radius: 50%;
  background-color: var(--text-color);
  border: 2px solid transparent;
  opacity: 0;
  pointer-events: none;
  transition: transform 0.2s, opacity 0.2s;
}
:root[data-theme=material3] .radio:hover:not(:disabled)::after {
  transform: translate(-50%, -50%) scale(1);
  opacity: 0.08;
}
:root[data-theme=material3] .radio:active:not(:disabled)::after {
  transform: translate(-50%, -50%) scale(1);
  opacity: 0.16;
}
:root[data-theme=material3] .radio:focus-visible:not(:disabled)::after {
  transform: translate(-50%, -50%) scale(1);
  background-color: transparent;
  border-color: var(--neutral-default);
  opacity: 1;
}
:root[data-theme=material3] .radio:checked:hover:not(:disabled)::after, :root[data-theme=material3] .radio:checked:active:not(:disabled)::after {
  background-color: var(--radio-mark-color);
}

:root[data-theme=material3] .select {
  --select-disabled-opacity: 1;
  --select-focus-ring-width: 1.5px;
  --select-focus-ring-color: var(--palette-default);
  --select-focus-ring-opacity: 1;
  --select-focus-ring-offset-width: 0px;
  --select-cursor: pointer;
}

:root[data-theme=material3] .select,
:root[data-theme=material3][data-color-scheme=light] .select {
  --select-filled-bg-color: var(--neutral-gray-2);
  --select-filled-hover-bg-color: var(--neutral-gray-3);
}

:root[data-theme=material3][data-color-scheme=dark] .select {
  --select-filled-bg-color: var(--neutral-gray-8);
  --select-filled-hover-bg-color: var(--neutral-gray-7);
}

:root[data-theme=material3][data-color-scheme=dark] .skeleton {
  --skeleton-bg-color: var(--neutral-gray-8);
  --skeleton-shimmer-color: var(--neutral-gray-7);
}

:root[data-theme=material3] .spinner {
  --spinner-border-width: 3px;
}

:root[data-theme=material3] .switch {
  --switch-track-bg-color: var(--neutral-light);
  --switch-thumb-bg-color: var(--neutral-default);
  --switch-track-checked-bg-color: var(--palette-default);
  --switch-thumb-checked-bg-color: var(--neutral-lighter);
  --switch-track-border-color: var(--neutral-default);
  --switch-track-border-width: 2px;
  --switch-thumb-size: 0.8rem;
  --switch-thumb-sm-size: 0.6rem;
  --switch-thumb-lg-size: 1rem;
  --switch-track-focus-ring-color: var(--neutral-default);
  --switch-track-disabled-bg-color: var(--switch-track-bg-color);
  --switch-thumb-disabled-bg-color: var(--switch-thumb-bg-color);
  --switch-track-checked-disabled-bg-color: var(
    --switch-track-checked-bg-color
  );
  --switch-thumb-checked-disabled-bg-color: var(
    --switch-thumb-checked-bg-color
  );
  --switch-disabled-opacity: 0.38;
}

/*# sourceMappingURL=material3.css.map */