:root {
    --it-green-100: #dcfce7;
    --it-red-100: #fee2e2;
    --it-gray-100: #f3f4f6;
    --bs-gray-700: #374151;
    --bs-gray-800: #1f2937;
    --bs-gray-900: #111827;
    --bs-bluegrey-500: #78909C;
}


h1:focus {
    outline: none;
}

.fw-500 {
    font-weight: 500 !important;
}

.fs-135 {
    font-size: 1.35rem;
}

.btn-details:hover {
    color: var(--mud-palette-info);
}

.btn-nopadding {
    padding: 0 !important;
}

.btn-edit:hover {
    color: var(--mud-palette-warning);
}

.btn-delete:hover {
    color: var(--mud-palette-error);
}

.btn-success:hover {
    color: var(--mud-palette-success);
}


.page-header-main {
    font-size: 1.35rem;
}

.page-subheader-main {
    color: var(--bs-gray-800);
    font-weight: 500;
}

.page-header {
    font-size: 1.25rem;
    color: var(--bs-gray-700);
}

.it-nav-start {
    font-weight: 300 !important;
    color: var(--bs-gray-800) !important;
}

.bg-transparent {
    background: transparent !important;
}
.bg-hover-transparent:hover {
    background: transparent !important;
}

.price::after {
    content: ' RSD';
    font-weight: 300;
    margin-right: 0.2rem;
}

.mud-chip.mud-chip-size-small {
    height:auto !important;
}

.apexcharts-title-text {
    font-size: var(--mud-typography-button-size) !important;
    font-family: var(--mud-typography-button-family) !important;
    font-weight: var(--mud-typography-button-weight) !important;
    line-height: var(--mud-typography-button-lineheight) !important;
    letter-spacing: var(--mud-typography-button-letterspacing) !important;
    text-transform: var(--mud-typography-button-text-transform) !important;
    color: var(--mud-palette-text-primary) !important;
}

/*.mud-table-cell {
    padding: 8px 16px !important;
}*/

/*.mud-table-cell {
    padding: 6px 24px 6px 16px;
    padding-inline-start: 16px;
    padding-inline-end: 24px;
}*/

/*DARK MUDBALZOR*/
:root {
    --mud-palette-black: rgba(39,39,47,1) !important;
    --mud-palette-white: rgba(255,255,255,1) !important;
    --mud-palette-primary: rgba(126,111,255,1) !important;
    --mud-palette-primary-rgb: 126,111,255 !important;
    --mud-palette-primary-text: rgba(255,255,255,1) !important;
    --mud-palette-primary-darken: rgb(90,71,255) !important;
    --mud-palette-primary-lighten: rgb(163,153,255) !important;
    --mud-palette-primary-hover: rgba(126,111,255,0.058823529411764705) !important;
    --mud-palette-secondary: rgba(255,64,129,1) !important;
    --mud-palette-secondary-rgb: 255,64,129 !important;
    --mud-palette-secondary-text: rgba(255,255,255,1) !important;
    --mud-palette-secondary-darken: rgb(255,31,105) !important;
    --mud-palette-secondary-lighten: rgb(255,102,153) !important;
    --mud-palette-secondary-hover: rgba(255,64,129,0.058823529411764705) !important;
    --mud-palette-tertiary: rgba(30,200,165,1) !important;
    --mud-palette-tertiary-rgb: 30,200,165 !important;
    --mud-palette-tertiary-text: rgba(255,255,255,1) !important;
    --mud-palette-tertiary-darken: rgb(25,169,140) !important;
    --mud-palette-tertiary-lighten: rgb(42,223,187) !important;
    --mud-palette-tertiary-hover: rgba(30,200,165,0.058823529411764705) !important;
    --mud-palette-info: rgba(74,134,255,1) !important;
    --mud-palette-info-rgb: 74,134,255 !important;
    --mud-palette-info-text: rgba(255,255,255,1) !important;
    --mud-palette-info-darken: rgb(41,112,255) !important;
    --mud-palette-info-lighten: rgb(112,160,255) !important;
    --mud-palette-info-hover: rgba(74,134,255,0.058823529411764705) !important;
    --mud-palette-success: rgba(61,203,108,1) !important;
    --mud-palette-success-rgb: 61,203,108 !important;
    --mud-palette-success-text: rgba(255,255,255,1) !important;
    --mud-palette-success-darken: rgb(47,177,91) !important;
    --mud-palette-success-lighten: rgb(94,212,133) !important;
    --mud-palette-success-hover: rgba(61,203,108,0.058823529411764705) !important;
    --mud-palette-warning: rgba(255,181,69,1) !important;
    --mud-palette-warning-rgb: 255,181,69 !important;
    --mud-palette-warning-text: rgba(255,255,255,1) !important;
    --mud-palette-warning-darken: rgb(255,167,36) !important;
    --mud-palette-warning-lighten: rgb(255,198,112) !important;
    --mud-palette-warning-hover: rgba(255,181,69,0.058823529411764705) !important;
    --mud-palette-error: rgba(255,63,95,1) !important;
    --mud-palette-error-rgb: 255,63,95 !important;
    --mud-palette-error-text: rgba(255,255,255,1) !important;
    --mud-palette-error-darken: rgb(255,26,64) !important;
    --mud-palette-error-lighten: rgb(255,102,128) !important;
    --mud-palette-error-hover: rgba(255,63,95,0.058823529411764705) !important;
    --mud-palette-dark: rgba(39,39,47,1) !important;
    --mud-palette-dark-rgb: 39,39,47 !important;
    --mud-palette-dark-text: rgba(255,255,255,1) !important;
    --mud-palette-dark-darken: rgb(23,23,28) !important;
    --mud-palette-dark-lighten: rgb(56,56,67) !important;
    --mud-palette-dark-hover: rgba(39,39,47,0.058823529411764705) !important;
    --mud-palette-text-primary: rgba(178,176,191,1) !important;
    --mud-palette-text-secondary: rgba(146,146,159,1) !important;
    --mud-palette-text-disabled: rgba(255,255,255,0.25) !important;
    --mud-palette-action-default: rgba(116,113,142,1) !important;
    --mud-palette-action-default-hover: rgba(116,113,142,0.058823529411764705) !important;
    --mud-palette-action-disabled: rgba(255,255,255,0.25) !important;
    --mud-palette-action-disabled-background: rgba(96,95,109,0.55196078431372547) !important;
    --mud-palette-surface: rgba(30,30,45,1) !important;
    --mud-palette-background: rgba(26,26,39,1) !important;
    --mud-palette-background-gray: rgba(21,21,33,1) !important;
    --mud-palette-drawer-background: rgba(26,26,39,1) !important;
    --mud-palette-drawer-text: rgba(146,146,159,1) !important;
    --mud-palette-drawer-icon: rgba(146,146,159,1) !important;
    --mud-palette-appbar-background: rgba(26,26,39,0.8) !important;
    --mud-palette-appbar-text: rgba(146,146,159,1) !important;
    --mud-palette-lines-default: rgba(51,50,62,1) !important;
    --mud-palette-lines-inputs: rgba(255,255,255,0.2980392156862745) !important;
    --mud-palette-table-lines: rgba(51,50,62,1) !important;
    --mud-palette-table-striped: rgba(255,255,255,0.2) !important;
    --mud-palette-table-hover: rgba(0,0,0,0.0392156862745098) !important;
    --mud-palette-divider: rgba(41,40,56,1) !important;
    --mud-palette-divider: rgba(255,255,255,0.3) !important;
    --mud-palette-divider-light: rgba(255,255,255,0.11764705882352941) !important;
    --mud-palette-divider-light: rgba(255,255,255,0.3) !important;
    --mud-palette-gray-default: #9E9E9E !important;
    --mud-palette-gray-light: #2a2833 !important;
    --mud-palette-gray-lighter: #1e1e2d !important;
    --mud-palette-gray-dark: #757575 !important;
    --mud-palette-gray-darker: #616161 !important;
    --mud-palette-overlay-dark: rgba(33,33,33,0.4980392156862745) !important;
    --mud-palette-overlay-light: #1e1e2d80 !important;
    --mud-ripple-color: var(--mud-palette-text-primary) !important;
    --mud-ripple-opacity: 0.1 !important;
    --mud-ripple-opacity-secondary: 0.2 !important;
    --mud-elevation-0: none !important;
    --mud-elevation-1: 0px 2px 1px -1px rgba(0,0,0,0.2),0px 1px 1px 0px rgba(0,0,0,0.14),0px 1px 3px 0px rgba(0,0,0,0.12) !important;
    --mud-elevation-2: 0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12) !important;
    --mud-elevation-3: 0px 3px 3px -2px rgba(0,0,0,0.2),0px 3px 4px 0px rgba(0,0,0,0.14),0px 1px 8px 0px rgba(0,0,0,0.12) !important;
    --mud-elevation-4: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12) !important;
    --mud-elevation-5: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 5px 8px 0px rgba(0,0,0,0.14),0px 1px 14px 0px rgba(0,0,0,0.12) !important;
    --mud-elevation-6: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12) !important;
    --mud-elevation-7: 0px 4px 5px -2px rgba(0,0,0,0.2),0px 7px 10px 1px rgba(0,0,0,0.14),0px 2px 16px 1px rgba(0,0,0,0.12) !important;
    --mud-elevation-8: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12) !important;
    --mud-elevation-9: 0px 5px 6px -3px rgba(0,0,0,0.2),0px 9px 12px 1px rgba(0,0,0,0.14),0px 3px 16px 2px rgba(0,0,0,0.12) !important;
    --mud-elevation-10: 0px 6px 6px -3px rgba(0,0,0,0.2),0px 10px 14px 1px rgba(0,0,0,0.14),0px 4px 18px 3px rgba(0,0,0,0.12) !important;
    --mud-elevation-11: 0px 6px 7px -4px rgba(0,0,0,0.2),0px 11px 15px 1px rgba(0,0,0,0.14),0px 4px 20px 3px rgba(0,0,0,0.12) !important;
    --mud-elevation-12: 0px 7px 8px -4px rgba(0,0,0,0.2),0px 12px 17px 2px rgba(0,0,0,0.14),0px 5px 22px 4px rgba(0,0,0,0.12) !important;
    --mud-elevation-13: 0px 7px 8px -4px rgba(0,0,0,0.2),0px 13px 19px 2px rgba(0,0,0,0.14),0px 5px 24px 4px rgba(0,0,0,0.12) !important;
    --mud-elevation-14: 0px 7px 9px -4px rgba(0,0,0,0.2),0px 14px 21px 2px rgba(0,0,0,0.14),0px 5px 26px 4px rgba(0,0,0,0.12) !important;
    --mud-elevation-15: 0px 8px 9px -5px rgba(0,0,0,0.2),0px 15px 22px 2px rgba(0,0,0,0.14),0px 6px 28px 5px rgba(0,0,0,0.12) !important;
    --mud-elevation-16: 0px 8px 10px -5px rgba(0,0,0,0.2),0px 16px 24px 2px rgba(0,0,0,0.14),0px 6px 30px 5px rgba(0,0,0,0.12) !important;
    --mud-elevation-17: 0px 8px 11px -5px rgba(0,0,0,0.2),0px 17px 26px 2px rgba(0,0,0,0.14),0px 6px 32px 5px rgba(0,0,0,0.12) !important;
    --mud-elevation-18: 0px 9px 11px -5px rgba(0,0,0,0.2),0px 18px 28px 2px rgba(0,0,0,0.14),0px 7px 34px 6px rgba(0,0,0,0.12) !important;
    --mud-elevation-19: 0px 9px 12px -6px rgba(0,0,0,0.2),0px 19px 29px 2px rgba(0,0,0,0.14),0px 7px 36px 6px rgba(0,0,0,0.12) !important;
    --mud-elevation-20: 0px 10px 13px -6px rgba(0,0,0,0.2),0px 20px 31px 3px rgba(0,0,0,0.14),0px 8px 38px 7px rgba(0,0,0,0.12) !important;
    --mud-elevation-21: 0px 10px 13px -6px rgba(0,0,0,0.2),0px 21px 33px 3px rgba(0,0,0,0.14),0px 8px 40px 7px rgba(0,0,0,0.12) !important;
    --mud-elevation-22: 0px 10px 14px -6px rgba(0,0,0,0.2),0px 22px 35px 3px rgba(0,0,0,0.14),0px 8px 42px 7px rgba(0,0,0,0.12) !important;
    --mud-elevation-23: 0px 11px 14px -7px rgba(0,0,0,0.2),0px 23px 36px 3px rgba(0,0,0,0.14),0px 9px 44px 8px rgba(0,0,0,0.12) !important;
    --mud-elevation-24: 0px 11px 15px -7px rgba(0,0,0,0.2),0px 24px 38px 3px rgba(0,0,0,0.14),0px 9px 46px 8px rgba(0,0,0,0.12) !important;
    --mud-elevation-25: 0 5px 5px -3px rgba(0,0,0,.06), 0 8px 10px 1px rgba(0,0,0,.042), 0 3px 14px 2px rgba(0,0,0,.036) !important;
    --mud-default-borderradius: 4px !important;
    --mud-drawer-width-left: 240px !important;
    --mud-drawer-width-right: 240px !important;
    --mud-drawer-width-mini-left: 56px !important;
    --mud-drawer-width-mini-right: 56px !important;
    --mud-appbar-height: 64px !important;
    --mud-typography-default-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-default-size: .875rem !important;
    --mud-typography-default-weight: 400 !important;
    --mud-typography-default-lineheight: 1.43 !important;
    --mud-typography-default-letterspacing: .01071em !important;
    --mud-typography-default-text-transform: none !important;
    --mud-typography-h1-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-h1-size: 6rem !important;
    --mud-typography-h1-weight: 300 !important;
    --mud-typography-h1-lineheight: 1.167 !important;
    --mud-typography-h1-letterspacing: -.01562em !important;
    --mud-typography-h1-text-transform: none !important;
    --mud-typography-h2-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-h2-size: 3.75rem !important;
    --mud-typography-h2-weight: 300 !important;
    --mud-typography-h2-lineheight: 1.2 !important;
    --mud-typography-h2-letterspacing: -.00833em !important;
    --mud-typography-h2-text-transform: none !important;
    --mud-typography-h3-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-h3-size: 3rem !important;
    --mud-typography-h3-weight: 400 !important;
    --mud-typography-h3-lineheight: 1.167 !important;
    --mud-typography-h3-letterspacing: 0 !important;
    --mud-typography-h3-text-transform: none !important;
    --mud-typography-h4-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-h4-size: 2.125rem !important;
    --mud-typography-h4-weight: 400 !important;
    --mud-typography-h4-lineheight: 1.235 !important;
    --mud-typography-h4-letterspacing: .00735em !important;
    --mud-typography-h4-text-transform: none !important;
    --mud-typography-h5-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-h5-size: 1.5rem !important;
    --mud-typography-h5-weight: 400 !important;
    --mud-typography-h5-lineheight: 1.334 !important;
    --mud-typography-h5-letterspacing: 0 !important;
    --mud-typography-h5-text-transform: none !important;
    --mud-typography-h6-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-h6-size: 1.25rem !important;
    --mud-typography-h6-weight: 500 !important;
    --mud-typography-h6-lineheight: 1.6 !important;
    --mud-typography-h6-letterspacing: .0075em !important;
    --mud-typography-h6-text-transform: none !important;
    --mud-typography-subtitle1-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-subtitle1-size: 1rem !important;
    --mud-typography-subtitle1-weight: 400 !important;
    --mud-typography-subtitle1-lineheight: 1.75 !important;
    --mud-typography-subtitle1-letterspacing: .00938em !important;
    --mud-typography-subtitle1-text-transform: none !important;
    --mud-typography-subtitle2-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-subtitle2-size: .875rem !important;
    --mud-typography-subtitle2-weight: 500 !important;
    --mud-typography-subtitle2-lineheight: 1.57 !important;
    --mud-typography-subtitle2-letterspacing: .00714em !important;
    --mud-typography-subtitle2-text-transform: none !important;
    --mud-typography-body1-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-body1-size: 1rem !important;
    --mud-typography-body1-weight: 400 !important;
    --mud-typography-body1-lineheight: 1.5 !important;
    --mud-typography-body1-letterspacing: .00938em !important;
    --mud-typography-body1-text-transform: none !important;
    --mud-typography-body2-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-body2-size: .875rem !important;
    --mud-typography-body2-weight: 400 !important;
    --mud-typography-body2-lineheight: 1.43 !important;
    --mud-typography-body2-letterspacing: .01071em !important;
    --mud-typography-body2-text-transform: none !important;
    --mud-typography-input-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-input-size: 1rem !important;
    --mud-typography-input-weight: 400 !important;
    --mud-typography-input-lineheight: 1.1876 !important;
    --mud-typography-input-letterspacing: .00938em !important;
    --mud-typography-input-text-transform: none !important;
    --mud-typography-button-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-button-size: .875rem !important;
    --mud-typography-button-weight: 500 !important;
    --mud-typography-button-lineheight: 1.75 !important;
    --mud-typography-button-letterspacing: .02857em !important;
    --mud-typography-button-text-transform: uppercase !important;
    --mud-typography-caption-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-caption-size: .75rem !important;
    --mud-typography-caption-weight: 400 !important;
    --mud-typography-caption-lineheight: 1.66 !important;
    --mud-typography-caption-letterspacing: .03333em !important;
    --mud-typography-caption-text-transform: none !important;
    --mud-typography-overline-family: 'Roboto','Helvetica','Arial','sans-serif' !important;
    --mud-typography-overline-size: .75rem !important;
    --mud-typography-overline-weight: 400 !important;
    --mud-typography-overline-lineheight: 2.66 !important;
    --mud-typography-overline-letterspacing: .08333em !important;
    --mud-typography-overline-text-transform: none !important;
    --mud-zindex-drawer: 1100 !important;
    --mud-zindex-appbar: 1300 !important;
    --mud-zindex-dialog: 1400 !important;
    --mud-zindex-popover: 1200 !important;
    --mud-zindex-snackbar: 1500 !important;
    --mud-zindex-tooltip: 1600 !important;
}

.btn-primary {
    text-transform: uppercase;
    --bs-btn-bg: var(--mud-palette-primary) !important;
    --bs-btn-hover-bg: var(--mud-palette-primary-darken) !important;
}

.nav-pills {
    --bs-nav-pills-link-active-bg: var(--mud-palette-primary) !important;
}

.nav {
    --bs-nav-link-color: var(--mud-palette-primary) !important;
    --bs-nav-link-hover-color: var(--mud-palette-primary-darken) !important;
}

.btn-primary-purple {
    color: #651FFF !important;
    color: #B39DDB !important;
    background-color: rgba(149,117,205, 0.3) !important;
}

    .btn-primary-purple:hover {
        background-color: rgba(149,117,205, 0.4) !important;
    }

.btn-primary-blue {
    color: #90CAF9 !important;
    background-color: rgba(100,181,246, 0.3) !important;
}

    .btn-primary-blue:hover {
        background-color: rgba(100,181,246, 0.4) !important;
    }

.btn-primary-amber {
    color: #FFD54F !important;
    background-color: rgba(255,224,130, 0.3) !important;
}

    .btn-primary-amber:hover {
        background-color: rgba(255,224,130, 0.4) !important;
    }

.btn-primary-lightgreen {
    color: #AED581 !important;
    background-color: rgba(165,214,167,0.3) !important;
}

    .btn-primary-lightgreen:hover {
        background-color: rgba(165,214,167, 0.4) !important;
    }

.btn-primary-red {
    color: #FF5252 !important;
    background-color: rgba(255, 138, 128,0.2) !important;
}

    .btn-primary-red:hover {
        background-color: rgba(255, 138, 128, 0.3) !important;
    }


.btn-details:hover {
    color: var(--mud-palette-info);
}

.btn-nopadding {
    padding: 0 !important;
}

.btn-edit:hover {
    color: var(--mud-palette-warning);
}

.btn-delete:hover {
    color: var(--mud-palette-error);
}

.btn-success:hover {
    color: var(--mud-palette-success);
}

.text-red {
    color: #FF5252 !important;
}

th {
    text-transform: uppercase !important;
}

.marker1 {
    filter: hue-rotate(250deg);
}

.marker2 {
    filter: hue-rotate(145deg);
}

@@media only screen and (max-width: 600px) {
    .action-column {
        min-height: 100%;
    }
}

h1:focus {
    outline: none;
    box-shadow: none;
}

.quick-link-disabled {
    background-color: rgba(255, 255, 255,0.08) !important;
    border-color: rgba(255, 255, 255,0.25) !important;
    color: rgba(255, 255, 255,0.25) !important;
}

.quick-link-create {
    background-color: rgba(255, 179, 0,0.1) !important;
    border-color: rgba(255, 179, 0,0.5) !important;
    color: rgba(255, 179, 0,0.9) !important;
}

    .quick-link-create:hover {
        background-color: rgba(255, 179, 0, 0.15) !important;
        border-color: rgba(255, 179, 0, 0.75) !important;
        color: rgba(255, 179, 0, 1) !important;
    }

.quick-link-porudzbine {
    background-color: rgba(0, 229, 255, 0.1) !important;
    border-color: rgba(0, 229, 255, 0.5) !important;
    color: rgba(0, 229, 255, 0.8) !important;
}

    .quick-link-porudzbine:hover {
        background-color: rgba(0, 229, 255, 0.15) !important;
        border-color: rgba(0, 229, 255, 0.75) !important;
        color: rgba(0, 229, 255, 1) !important;
    }

.quick-link-racuni {
    background-color: rgba(0, 176, 255, 0.1) !important;
    border-color: rgba(0, 176, 255, 0.5) !important;
    color: rgba(0, 176, 255, 0.8) !important;
}

    .quick-link-racuni:hover {
        background-color: rgba(0, 176, 255, 0.15) !important;
        border-color: rgba(0, 176, 255, 0.75) !important;
        color: rgba(0, 176, 255, 1) !important;
    }

.mud-text-dark {
    color: #757d8c !important;   
}

.text-color-header {
    color: #78909C;
}

.custom-price::after {
    content: ' RSD';
    font-weight: 300;
    font-size: 0.8em;
}

.text-white {
    color: #aaaccc;
}

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