/* Uppy */

.uppy-Root {
    font-family: var(--mud-typography-default-family) !important;
    color: var(--mud-palette-text-primary) !important;
}

.uppy-c-textInput {
    background-color: var(--mud-palette-surface) !important;
    border-color: var(--mud-palette-lines-inputs) !important;
    color: var(--mud-palette-text-primary) !important;
}

.uppy-c-textInput:focus {
    border-color: var(--mud-palette-primary) !important;
}

.uppy-c-btn-primary {
    background-color: var(--mud-palette-primary) !important;
}

.uppy-c-btn-primary:hover {
    background-color: var(--mud-palette-primary) !important;
}

.uppy-c-btn-link {
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-c-btn-link:hover {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-Informer p {
    background-color: var(--mud-palette-dark, #757575) !important;
    color: var(--mud-palette-dark-text, #fff) !important;
}

.uppy-Informer span {
    color: var(--mud-palette-text-secondary) !important;
    background-color: var(--mud-palette-surface) !important;
}

.uppy-StatusBar {
    background-color: var(--mud-palette-surface) !important;
    color: var(--mud-palette-text-primary) !important;
}

.uppy-StatusBar:before {
    background-color: var(--mud-palette-lines-default) !important;
}

.uppy-StatusBar.is-complete .uppy-StatusBar-progress {
    background-color: var(--mud-palette-success) !important;
}

.uppy-StatusBar.is-error .uppy-StatusBar-progress {
    background-color: var(--mud-palette-error) !important;
}

.uppy-StatusBar.is-complete .uppy-StatusBar-statusIndicator {
    color: var(--mud-palette-success) !important;
}

.uppy-StatusBar.is-error .uppy-StatusBar-statusIndicator {
    color: var(--mud-palette-error) !important;
}

.uppy-StatusBar:not([aria-hidden=true]).is-waiting {
    background-color: var(--mud-palette-surface) !important;
    border-top-color: var(--mud-palette-lines-default) !important;
}

.uppy-StatusBar-progress {
    background-color: var(--mud-palette-primary) !important;
}

.uppy-StatusBar.is-postprocessing .uppy-StatusBar-progress,
.uppy-StatusBar.is-preprocessing .uppy-StatusBar-progress {
    background-color: var(--mud-palette-warning) !important;
}

.uppy-StatusBar-content {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-StatusBar-statusPrimary {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-StatusBar-statusSecondary {
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-StatusBar-statusIndicator {
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-StatusBar.is-waiting .uppy-StatusBar-actions {
    background-color: var(--mud-palette-surface) !important;
}

.uppy-StatusBar-actionBtn {
    color: var(--mud-palette-primary) !important;
}

.uppy-StatusBar-actionBtn--retry {
    background-color: var(--mud-palette-error) !important;
    color: var(--mud-palette-error-text) !important;
}

.uppy-StatusBar-actionBtn--retry:hover {
    background-color: var(--mud-palette-error) !important;
    color: var(--mud-palette-error-text) !important;
}

.uppy-StatusBar.is-waiting .uppy-StatusBar-actionBtn--upload {
    background-color: var(--mud-palette-primary) !important;
}

.uppy-StatusBar.is-waiting .uppy-StatusBar-actionBtn--upload:hover {
    background-color: var(--mud-palette-primary) !important;
}

.uppy-StatusBar:not(.is-waiting) .uppy-StatusBar-actionBtn--upload {
    color: var(--mud-palette-primary) !important;
}

.uppy-StatusBar-actionBtn--done:focus {
    background-color: var(--mud-palette-action-default-hover) !important;
}

.uppy-StatusBar-actionBtn--done:hover {
    color: var(--mud-palette-primary) !important;
}

.uppy-StatusBar-details {
    background-color: var(--mud-palette-text-disabled) !important;
}

.uppy-StatusBar-spinner {
    fill: var(--mud-palette-primary) !important;
}

.uppy-StatusBar.is-postprocessing .uppy-StatusBar-spinner,
.uppy-StatusBar.is-preprocessing .uppy-StatusBar-spinner {
    fill: var(--mud-palette-warning) !important;
}

.uppy-ProviderBrowser-viewType--grid .uppy-ProviderBrowserItem-fakeCheckbox {
    background-color: var(--mud-palette-primary) !important;
}

.uppy-ProviderBrowser-viewType--list {
    background-color: var(--mud-palette-surface) !important;
}

.uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-fakeCheckbox {
    background-color: var(--mud-palette-surface) !important;
    border-color: var(--mud-palette-lines-default) !important;
}

.uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-fakeCheckbox:after {
    border-bottom-color: var(--mud-palette-lines-default) !important;
    border-left-color: var(--mud-palette-lines-default) !important;
}

.uppy-ProviderBrowser-viewType--list .uppy-ProviderBrowserItem-fakeCheckbox--is-checked {
    background-color: var(--mud-palette-primary) !important;
    border-color: var(--mud-palette-primary) !important;
}

.uppy-Provider-auth,
.uppy-Provider-empty,
.uppy-Provider-error,
.uppy-Provider-loading {
    color: var(--mud-palette-text-disabled) !important;
}

.uppy-Provider-authTitle {
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-Provider-breadcrumbs {
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-Provider-breadcrumbsIcon {
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-Provider-breadcrumbsIcon svg {
    fill: var(--mud-palette-text-secondary) !important;
}

.uppy-Provider-breadcrumbs button:focus {
    background-color: var(--mud-palette-action-default-hover) !important;
}

.uppy-Provider-breadcrumbs button:hover {
    color: var(--mud-palette-primary) !important;
}

.uppy-ProviderBrowser-user {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-ProviderBrowser-user:after {
    color: var(--mud-palette-text-disabled) !important;
}

.uppy-ProviderBrowser-header {
    border-bottom-color: var(--mud-palette-lines-default) !important;
}

.uppy-ProviderBrowser-headerBar {
    background-color: var(--mud-palette-surface) !important;
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-ProviderBrowser-search {
    background-color: var(--mud-palette-surface) !important;
}

.uppy-ProviderBrowser-searchIcon {
    color: var(--mud-palette-text-disabled) !important;
}

.uppy-ProviderBrowser-searchInput {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-ProviderBrowser-searchInput:focus {
    background-color: var(--mud-palette-action-default-hover) !important;
}

.uppy-ProviderBrowser-searchClose {
    color: var(--mud-palette-text-disabled) !important;
}

.uppy-ProviderBrowser-searchClose:hover {
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-ProviderBrowser-userLogout {
    color: var(--mud-palette-primary) !important;
}

.uppy-ProviderBrowser-userLogout:focus {
    background-color: var(--mud-palette-action-default-hover) !important;
}

.uppy-ProviderBrowser-userLogout:hover {
    color: var(--mud-palette-primary) !important;
}

.uppy-ProviderBrowser-list {
    background-color: var(--mud-palette-surface) !important;
}

.uppy-ProviderBrowser-footer {
    background-color: var(--mud-palette-surface) !important;
    border-top-color: var(--mud-palette-lines-default) !important;
}

.uppy-Dashboard-Item-name {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-Dashboard-Item-status {
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-Dashboard-Item-statusSize {
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-Dashboard-Item-sourceIcon {
    color: var(--mud-palette-text-disabled) !important;
}

.uppy-Dashboard-Item-action {
    color: var(--mud-palette-text-disabled) !important;
}

.uppy-Dashboard-Item-action:hover {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-Dashboard-Item-action--remove {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-Dashboard-Item-action--remove:hover {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-Dashboard-Item {
    border-bottom-color: var(--mud-palette-lines-default) !important;
}

.uppy-Dashboard-Item-errorDetails {
    background-color: var(--mud-palette-text-disabled) !important;
}

.uppy-Dashboard-Item-progressIcon--circle circle {
    fill: var(--mud-palette-success) !important;
}

.uppy-Dashboard-FileCard {
    background-color: var(--mud-palette-surface) !important;
}

.uppy-Dashboard-FileCard-preview {
    border-bottom-color: var(--mud-palette-lines-default) !important;
}

.uppy-Dashboard-FileCard-label {
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-Dashboard-FileCard-actions {
    background-color: var(--mud-palette-surface) !important;
    border-top-color: var(--mud-palette-lines-default) !important;
}

.uppy-Dashboard-inner {
    background-color: var(--mud-palette-surface) !important;
    border-color: var(--mud-palette-lines-inputs) !important;
    border-radius: var(--mud-default-borderradius) !important;
}

.uppy-Dashboard--isDisabled .uppy-ProviderIconBg {
    fill: var(--mud-palette-text-disabled) !important;
}

[data-uppy-drag-drop-supported=true] .uppy-Dashboard-AddFiles {
    border-color: var(--mud-palette-lines-default) !important;
}

.uppy-Dashboard--modal .uppy-Dashboard-AddFiles {
    border-color: var(--mud-palette-lines-default) !important;
}

.uppy-Dashboard-browse {
    color: var(--mud-palette-primary) !important;
}

.uppy-Dashboard-browse:focus,
.uppy-Dashboard-browse:hover {
    border-bottom-color: var(--mud-palette-primary) !important;
}

.uppy-DashboardTab {
    border-bottom-color: var(--mud-palette-lines-default) !important;
}

.uppy-DashboardTab-btn {
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-DashboardTab-btn:focus {
    background-color: var(--mud-palette-action-default-hover) !important;
}

.uppy-DashboardTab-btn:hover {
    background-color: var(--mud-palette-action-default-hover) !important;
}

.uppy-DashboardTab-btn:active {
    background-color: var(--mud-palette-action-default-hover) !important;
}

.uppy-DashboardContent-bar {
    background-color: var(--mud-palette-surface) !important;
    border-bottom-color: var(--mud-palette-lines-default) !important;
}

.uppy-DashboardContent-title {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-DashboardContent-back {
    color: var(--mud-palette-primary) !important;
}

.uppy-DashboardContent-back:focus {
    background-color: var(--mud-palette-action-default-hover) !important;
}

.uppy-DashboardContent-back:hover {
    color: var(--mud-palette-primary) !important;
}

.uppy-DashboardContent-addMore {
    color: var(--mud-palette-primary) !important;
}

.uppy-DashboardContent-addMore:focus {
    background-color: var(--mud-palette-action-default-hover) !important;
}

.uppy-DashboardContent-addMore:hover {
    color: var(--mud-palette-primary) !important;
}

.uppy-DashboardContent-panel {
    background-color: var(--mud-palette-background) !important;
}

.uppy-Dashboard-AddFilesPanel {
    background: var(--mud-palette-surface) !important;
}

.uppy-Dashboard-dropFilesHereHint {
    color: var(--mud-palette-text-secondary) !important;
    border-color: var(--mud-palette-primary) !important;
}

.uppy-Dashboard-AddFiles-title {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-Dashboard-note {
    color: var(--mud-palette-text-secondary) !important;
}

a.uppy-Dashboard-poweredBy {
    color: var(--mud-palette-text-disabled) !important;
}

.uppy-Dashboard-poweredByIcon {
    stroke: var(--mud-palette-text-disabled) !important;
}

.uppy-Dashboard-uploadCount {
    background-color: var(--mud-palette-success) !important;
}

.uppy-DragDrop-container {
    background-color: var(--mud-palette-surface) !important;
}

.uppy-DragDrop-arrow {
    fill: var(--mud-palette-lines-default) !important;
}

.uppy-DragDrop--isDragDropSupported {
    border-color: var(--mud-palette-text-disabled) !important;
}

.uppy-DragDrop--isDraggingOver {
    background: var(--mud-palette-action-default-hover) !important;
    border-color: var(--mud-palette-primary) !important;
}

.uppy-DragDrop--isDraggingOver .uppy-DragDrop-arrow {
    fill: var(--mud-palette-text-disabled) !important;
}

.uppy-DragDrop-browse {
    color: var(--mud-palette-primary) !important;
}

.uppy-DragDrop-note {
    color: var(--mud-palette-text-disabled) !important;
}

.uppy-FileInput-btn {
    border-color: var(--mud-palette-primary) !important;
    color: var(--mud-palette-primary) !important;
}

.uppy-FileInput-btn:hover {
    background-color: var(--mud-palette-primary) !important;
    color: var(--mud-palette-surface) !important;
}

.uppy-ProgressBar-inner {
    background-color: var(--mud-palette-primary) !important;
}

.uppy-Webcam-videoSource-select {
    border-color: var(--mud-palette-text-secondary) !important;
}

.uppy-Webcam-recordingLength {
    color: var(--mud-palette-text-secondary) !important;
}

.uppy-Webcam-button {
    background-color: var(--mud-palette-error) !important;
}

.uppy-Webcam-button:hover {
    background-color: var(--mud-palette-error) !important;
}

.uppy-Webcam-button--submit {
    background-color: var(--mud-palette-primary) !important;
}

.uppy-Webcam-button--submit:hover {
    background-color: var(--mud-palette-primary) !important;
}

.uppy-Webcam-permissons p {
    color: var(--mud-palette-text-disabled) !important;
}

.uppy-Webcam-permissonsIcon svg {
    color: var(--mud-palette-text-disabled) !important;
}

.uppy-Webcam-title {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-ScreenCapture-buttonContainer {
    background-color: var(--mud-palette-surface) !important;
    border-top-color: var(--mud-palette-lines-default) !important;
}

.uppy-ScreenCapture-button:hover {
    background-color: var(--mud-palette-error) !important;
}

.uppy-ScreenCapture-button--submit {
    background-color: var(--mud-palette-primary) !important;
}

.uppy-ScreenCapture-button--submit:hover {
    background-color: var(--mud-palette-primary) !important;
}

.uppy-ScreenCapture-button--submit:disabled {
    background-color: var(--mud-palette-text-disabled) !important;
}

.uppy-ScreenCapture-button--submit:disabled:hover {
    background-color: var(--mud-palette-lines-default) !important;
}

.uppy-ScreenCapture-title {
    color: var(--mud-palette-text-primary) !important;
}

.uppy-ScreenCapture-icon--stream svg {
    fill: var(--mud-palette-text-disabled) !important;
}

.uppy-ScreenCapture-button--video {
    background-color: var(--mud-palette-error) !important;
}

.uppy-ScreenCapture-button--video:hover {
    background-color: var(--mud-palette-error) !important;
}

.uppy-is-drag-over:after {
    border-color: var(--mud-palette-text-disabled) !important;
}

/* Quill */

.ql-container {
    font-family: var(--mud-typography-default-family) !important;
    font-size: var(--mud-typography-default-size) !important;
    color: var(--mud-palette-text-primary) !important;
}

.ql-editor {
    color: var(--mud-palette-text-primary) !important;
}

.ql-editor td {
    border-color: var(--mud-palette-lines-default) !important;
}

.ql-editor li[data-list=checked] > .ql-ui,
.ql-editor li[data-list=unchecked] > .ql-ui {
    color: var(--mud-palette-text-secondary) !important;
}

.ql-editor.ql-blank::before {
    color: var(--mud-palette-text-disabled) !important;
}

.ql-snow .ql-toolbar button.ql-active,
.ql-snow .ql-toolbar button:focus,
.ql-snow .ql-toolbar button:hover,
.ql-snow .ql-toolbar .ql-picker-label.ql-active,
.ql-snow .ql-toolbar .ql-picker-label:hover,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected,
.ql-snow .ql-toolbar .ql-picker-item:hover,
.ql-snow.ql-toolbar button.ql-active,
.ql-snow.ql-toolbar button:focus,
.ql-snow.ql-toolbar button:hover,
.ql-snow.ql-toolbar .ql-picker-label.ql-active,
.ql-snow.ql-toolbar .ql-picker-label:hover,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected,
.ql-snow.ql-toolbar .ql-picker-item:hover {
    color: var(--mud-palette-primary) !important;
}

.ql-snow .ql-toolbar button.ql-active .ql-fill,
.ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:focus .ql-fill,
.ql-snow .ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow .ql-toolbar button:hover .ql-fill,
.ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-fill,
.ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button:focus .ql-fill,
.ql-snow.ql-toolbar button:focus .ql-stroke.ql-fill,
.ql-snow.ql-toolbar button:hover .ql-fill,
.ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill {
    fill: var(--mud-palette-primary) !important;
}

.ql-snow .ql-toolbar button.ql-active .ql-stroke,
.ql-snow .ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar button:focus .ql-stroke,
.ql-snow .ql-toolbar button:focus .ql-stroke-miter,
.ql-snow .ql-toolbar button:hover .ql-stroke,
.ql-snow .ql-toolbar button:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-miter,
.ql-snow.ql-toolbar button.ql-active .ql-stroke,
.ql-snow.ql-toolbar button.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar button:focus .ql-stroke,
.ql-snow.ql-toolbar button:focus .ql-stroke-miter,
.ql-snow.ql-toolbar button:hover .ql-stroke,
.ql-snow.ql-toolbar button:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-miter,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke,
.ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-miter {
    stroke: var(--mud-palette-primary) !important;
}

@media (pointer: coarse) {
    .ql-snow .ql-toolbar button:hover:not(.ql-active),
    .ql-snow.ql-toolbar button:hover:not(.ql-active) {
        color: var(--mud-palette-text-primary) !important;
    }

    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-fill,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill,
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-fill,
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke.ql-fill {
        fill: var(--mud-palette-text-primary) !important;
    }

    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke,
    .ql-snow .ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter,
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke,
    .ql-snow.ql-toolbar button:hover:not(.ql-active) .ql-stroke-miter {
        stroke: var(--mud-palette-text-primary) !important;
    }
}

.ql-snow .ql-stroke {
    stroke: var(--mud-palette-text-primary) !important;
}

.ql-snow .ql-stroke-miter {
    stroke: var(--mud-palette-text-primary) !important;
}

.ql-snow .ql-fill,
.ql-snow .ql-stroke.ql-fill {
    fill: var(--mud-palette-text-primary) !important;
}

.ql-snow .ql-editor a {
    color: var(--mud-palette-primary) !important;
}

.ql-snow .ql-editor blockquote {
    border-left-color: var(--mud-palette-lines-default) !important;
}

.ql-snow .ql-editor code {
    background-color: var(--mud-palette-action-default-hover) !important;
    color: var(--mud-palette-text-primary) !important;
}

.ql-snow .ql-editor .ql-code-block-container {
    background-color: var(--mud-palette-action-default-hover) !important;
    color: var(--mud-palette-text-primary) !important;
}

.ql-snow .ql-picker {
    color: var(--mud-palette-text-primary) !important;
}

.ql-snow .ql-picker-options {
    background-color: var(--mud-palette-surface) !important;
    border-radius: var(--mud-default-borderradius) !important;
}

.ql-snow .ql-picker-options .ql-picker-item {
    color: var(--mud-palette-text-primary) !important;
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label {
    color: var(--mud-palette-text-secondary) !important;
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-fill {
    fill: var(--mud-palette-text-secondary) !important;
}

.ql-snow .ql-picker.ql-expanded .ql-picker-label .ql-stroke {
    stroke: var(--mud-palette-text-secondary) !important;
}

.ql-snow .ql-picker.ql-expanded .ql-picker-options {
    border-color: var(--mud-palette-lines-default) !important;
}

.ql-toolbar.ql-snow {
    border-color: var(--mud-palette-lines-inputs) !important;
    border-radius: var(--mud-default-borderradius) var(--mud-default-borderradius) 0 0 !important;
    background-color: var(--mud-palette-action-default-hover) !important;
    font-family: var(--mud-typography-default-family) !important;
}

.ql-toolbar.ql-snow .ql-picker-label {
    border-color: transparent !important;
}

.ql-toolbar.ql-snow .ql-picker-options {
    border-color: transparent !important;
    box-shadow: var(--mud-elevation-8) !important;
}

.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-label {
    border-color: var(--mud-palette-lines-default) !important;
}

.ql-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options {
    border-color: var(--mud-palette-lines-default) !important;
}

.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item.ql-selected,
.ql-toolbar.ql-snow .ql-color-picker .ql-picker-item:hover {
    border-color: var(--mud-palette-text-primary) !important;
}

.ql-snow .ql-tooltip {
    background-color: var(--mud-palette-surface) !important;
    border-color: var(--mud-palette-lines-default) !important;
    box-shadow: var(--mud-elevation-8) !important;
    color: var(--mud-palette-text-primary) !important;
    border-radius: var(--mud-default-borderradius) !important;
    z-index: 1;
}

.ql-snow .ql-tooltip::before {
    content: "Visitar URL:" !important;
}

.ql-snow .ql-tooltip input[type=text] {
    border-color: var(--mud-palette-lines-default) !important;
    color: var(--mud-palette-text-primary) !important;
    background-color: var(--mud-palette-surface) !important;
    border-radius: var(--mud-default-borderradius) !important;
}

.ql-snow .ql-tooltip a.ql-action::after {
    content: 'Editar' !important;
    border-right-color: var(--mud-palette-lines-default) !important;
}

.ql-snow .ql-tooltip a.ql-remove::before {
    content: 'Remover' !important;
}

.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
    content: 'Salvar' !important;
}

.ql-snow .ql-tooltip[data-mode=link]::before {
    content: "Inserir link:" !important;
}

.ql-snow .ql-tooltip[data-mode=formula]::before {
    content: "Inserir fórmula:" !important;
}

.ql-snow .ql-tooltip[data-mode=video]::before {
    content: "Inserir vídeo:" !important;
}

.ql-snow .ql-tooltip a {
    color: var(--mud-palette-primary) !important;
}

.ql-snow a {
    color: var(--mud-palette-primary) !important;
}

.ql-container.ql-snow {
    border-color: var(--mud-palette-lines-inputs) !important;
    border-radius: 0 0 var(--mud-default-borderradius) var(--mud-default-borderradius) !important;
}

/* FormMudMainContent */

:root {
    --breadcrumb-top: 64px;
}

.breadcrumb-container {
    background-color: var(--mud-palette-background);
    position: fixed;
    top: var(--breadcrumb-top);
    left: 240px;
    right: 0;
    z-index: 1099;
    transition: left 225ms cubic-bezier(0, 0, 0.2, 1);
}

.content-container {
    padding-top: 24px !important;
    padding-bottom: 88px !important;
}

.breadcrumb-container + .content-container {
    padding-top: calc(53px + 24px) !important;
}

.mud-drawer-close-responsive-md-left .breadcrumb-container {
    left: 0 !important;
}

@media (max-width: 959px) {
    .breadcrumb-container {
        left: 0;
    }
}

@media (max-width: 599px) {
    :root {
        --breadcrumb-top: 56px;
    }
}

/* SplitScreen */

.split-screen {
    height: 100%;
    padding-top: 0;
}

.split-screen-left {
    display: flex;
    justify-content: center;
    align-items: center;
}

.split-screen-right {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    position: relative;
}

.split-screen-content {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    width: 100%;
}

.split-screen-footer {
    text-align: center;
    padding: 16px;
}

.split-screen-theme-toggle {
    position: absolute;
    top: 8px;
    right: 8px;
}

@media (max-width: 959px) {
    .split-screen-left {
        display: none !important;
    }
}

@media (max-width: 768px) {
    .split-screen-footer {
        display: none !important;
    }
}

/* HeroSide */

.hero-side {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--mud-palette-primary) 0%, var(--mud-palette-primary-lighten) 50%, var(--mud-palette-primary-darken) 100%);
    padding: 60px;
    position: relative;
    overflow: hidden;
    height: 100%;
}

.hero-side::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(ellipse at 20% 80%, rgba(255,255,255,0.1) 0%, transparent 50%), radial-gradient(ellipse at 80% 20%, rgba(255,255,255,0.08) 0%, transparent 40%), radial-gradient(ellipse at 40% 40%, rgba(255,255,255,0.05) 0%, transparent 30%);
    pointer-events: none;
}

.shapes-container {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.circle {
    position: absolute;
    border-radius: 50%;
    border: 2px solid #fff;
    opacity: 0.1;
}

.circle-1 {
    width: 300px;
    height: 300px;
    top: -100px;
    right: -100px;
    animation: rotate 30s linear infinite;
}

.circle-2 {
    width: 200px;
    height: 200px;
    bottom: -50px;
    left: -50px;
    animation: rotate 25s linear infinite reverse;
}

.circle-3 {
    width: 80px;
    height: 80px;
    top: 20%;
    left: 15%;
    background: rgba(255,255,255,0.1);
    border: none;
    animation: float 6s ease-in-out infinite;
}

.square {
    position: absolute;
    border: 2px solid rgba(255,255,255,0.3);
    opacity: 0.1;
}

.square-1 {
    width: 60px;
    height: 60px;
    top: 15%;
    right: 20%;
    transform: rotate(45deg);
    animation: float 8s ease-in-out infinite;
}

.square-2 {
    width: 40px;
    height: 40px;
    bottom: 25%;
    right: 15%;
    transform: rotate(15deg);
    animation: float 7s ease-in-out infinite 1s;
}

.line {
    position: absolute;
    height: 100%;
    width: 1px;
    background: linear-gradient(to bottom, transparent 0%, rgba(255,255,255,0.15) 20%, rgba(255,255,255,0.15) 80%, transparent 100%);
    opacity: 0.1;
}

.line-1 {
    left: 25%;
}

.line-2 {
    left: 50%;
}

.line-3 {
    left: 75%;
}

.dots {
    position: absolute;
    display: grid;
    grid-template-columns: repeat(5, 8px);
    gap: 12px;
}

.dots-1 {
    top: 30%;
    right: 10%;
}

.dots-2 {
    bottom: 20%;
    left: 10%;
}

.dots span {
    width: 6px;
    height: 6px;
    background: rgba(255,255,255,0.2);
    border-radius: 50%;
}

.hero-content {
    position: relative;
    z-index: 1;
    text-align: center;
    max-width: 420px;
}

.abstract-icon {
    width: 100px;
    height: 100px;
    margin: 0 auto 40px;
    position: relative;
}

.abstract-icon::before {
    content: '';
    position: absolute;
    top: 0;
    left: 10px;
    width: 80px;
    height: 80px;
    background: rgba(255,255,255,0.15);
    border-radius: 24px;
    transform: rotate(-10deg);
    animation: float 5s ease-in-out infinite;
}

.abstract-icon::after {
    content: '';
    position: absolute;
    top: 20px;
    left: 30px;
    width: 60px;
    height: 60px;
    background: rgba(255,255,255,0.2);
    border-radius: 18px;
    transform: rotate(5deg);
    animation: float 5s ease-in-out infinite 0.5s;
}

.hero-title {
    font-size: 2.5rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 16px;
    text-shadow: 0 2px 20px rgba(0,0,0,0.15);
}

.hero-subtitle {
    font-size: 1.05rem;
    color: rgba(255, 255, 255, 0.7);
    line-height: 1.7;
}

@keyframes float {
    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-15px);
    }
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* Clipboard */

.clipboard {
    cursor: pointer;
}

.clipboard:hover {
    text-decoration: underline;
}

/* index.html */

html, body, #app {
    height: 100%;
    margin: 0;
}

#app {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.loading-progress {
    position: relative;
    display: block;
    width: 120px;
    height: 120px;
    animation: fade-in 0.4s ease-out;
}

.loading-progress circle {
    fill: none;
    stroke: #e9e9e9;
    stroke-width: 0.5rem;
    transform-origin: 50% 50%;
    transform: rotate(-90deg);
}

.loading-progress circle:last-child {
    stroke: #999;
    stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
    transition: stroke-dasharray 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.loading-progress-text {
    text-align: center;
    font-weight: 500;
    font-size: 0.85rem;
    color: #666;
    margin-top: 12px;
}

.loading-progress-text:after {
    content: var(--blazor-load-percentage-text, "Carregando");
    font-family: Roboto, Helvetica, Arial, sans-serif;
}

@keyframes fade-in {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
}

@media (max-width: 768px) {
    .hide-toolbar {
        display: none;
    }

    .form-mud-toolbar-title {
        font-size: 16px !important;
    }
}