@font-face {
    font-family: DM_TypeWriter;
    src: url('../fonts/Cutive/Cutive.ttf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url('../fonts/Roboto/Roboto-Regular.ttf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url('../fonts/Roboto/Roboto-Bold.ttf');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url('../fonts/Roboto/Roboto-Light.ttf');
    font-weight: lighter;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url('../fonts/Roboto/Roboto-Italic.ttf');
    font-style: italic;
}

@font-face {
    font-family: Roboto;
    src: url('../fonts/Roboto/Roboto-BoldItalic.ttf');
    font-weight: bold;
    font-style: italic;
}

:root {
    --mud-palette-primary: #009688;
    --mud-palette-secondary: #03A9F4;
    --mud-palette-tertiary: #9C27B0;
    --mud-palette-warning: #FFC107;
    --mud-palette-error: #F44336;
    --mud-palette-success: #2ECC40;
    --mud-palette-info: #3F51B5;
    --dm-border-radius: .25rem;
    --dm-box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
    --rz-primary: var(--mud-palette-secondary) !important;
}

body {
    font-family: Roboto;
}

#dm-auth-header, #dm-auth-box {
    color: white;
    background-color: var(--mud-palette-primary);
    box-shadow: var(--dm-box-shadow);
}

#dm-auth-box {
    border-radius: var(--dm-border-radius);
}

.dm-auth-button {
    background-color: var(--mud-palette-secondary);
    border-radius: var(--dm-border-radius);
    box-shadow: var(--dm-box-shadow);
}

.dm-auth-password {
    background-color: var(--mud-palette-tertiary) !important;
}

.dm-auth-input {
    border-radius: var(--dm-border-radius);
}

    .dm-auth-input:focus {
        box-shadow: var(--dm-box-shadow);
        outline: none;
    }

.dm-filter-panel > .mud-expand-panel-border {
    box-shadow: none !important;
}

.dm-nav-active > .mud-nav-link {
    color: var(--mud-palette-primary) !important;
    background-color: var(--mud-palette-action-default-hover) !important;
}

.dm-procedures a {
    text-decoration: underline;
    color: var(--mud-palette-secondary);
    transition: color 0.2s;
}

    .dm-procedures a:hover {
        color: var(--mud-palette-primary);
    }

    .dm-procedures a:visited {
        color: var(--mud-palette-tertiary);
        text-decoration: none;
    }

html, body, p {
    font-family: Roboto;
}

.border-primary {
    border: 1px solid var(--mud-palette-primary) !important;
    border-radius: var(--dm-border-radius) !important;
}

.border-secondary {
    border: 1px solid var(--mud-palette-secondary) !important;
    border-radius: var(--dm-border-radius) !important;
}

.border-tertiary {
    border: 1px solid var(--mud-palette-tertiary) !important;
    border-radius: var(--dm-border-radius) !important;
}

.border-error {
    border: 1px solid var(--mud-palette-error) !important;
    border-radius: var(--dm-border-radius) !important;
}

.border-warning {
    border: 1px solid var(--mud-palette-warning) !important;
    border-radius: var(--dm-border-radius) !important;
}

.column-filter-popup {
    border: 1px solid var(--mud-palette-primary);
}

.dm-grid-head-border {
    border-bottom: 1px solid var(--mud-palette-tertiary) !important;
    border-right: 1px solid var(--mud-palette-table-lines);
}

.dm-grid-foot-border {
    border-top: none !important;
}

.mud-table-container table td {
    border-bottom: 1px solid #66666666;
}

.dm-Dialog-blur {
    backdrop-filter: blur(10px);
}

.dm-disabled-readable .mud-input-slot,
.dm-disabled-readable .mud-input-label,
.dm-disabled-readable .mud-input.mud-input-outlined.mud-disabled .mud-input-outlined-border {
    color: var(--mud-palette-text-primary) !important;
    border-color: var(--mud-palette-text-primary) !important;
    opacity: 0.85 !important;
}

.rz-html-editor-button, .rz-html-editor-color, .rz-html-editor-colorpicker, .rz-colorpicker-trigger, .rz-html-editor-content, .rz-html-editor-toolbar {
    color: var(--mud-palette-text-primary) !important;
    background-color: var(--mud-palette-surface) !important;
}

.svg-tooltip tspan {
    fill: white;
}

@media (max-width: 600px) {
    .mud-table-cell {
        border-bottom: none;
    }

    .mud-table-container table tr::after {
        content: "";
        display: block;
        width: 100%;
        border-bottom: 1px solid #66666666;
    }
}