﻿
body, #content-container, #accItems, .add-phone-button .dx-button, .dx-overlay-content.dx-popup-normal.dx-resizable, .dx-item.dx-list-item, .dx-datagrid-search-text, .menu-container .dx-widget, .dx-tooltip-wrapper .dx-overlay-content .dx-popup-content, .dx-tooltip-wrapper.dx-popover-wrapper .dx-popover-arrow:after {
    background-color: #444 !important;
}

.dx-button-content, .dx-datagrid, #form-container, .dx-datagrid, .dx-loadindicator-icon .dx-loadindicator-segment, #simple-treeview, #devextreme19, #devextreme28, #devextreme2, #devextreme1, .obaveznoProcitatiDiv, .dx-lookup-arrow {
    background-color: #555 !important;
}

    i, tr, .dx-datagrid .dx-header-filter-empty, .dx-datagrid-filter-panel-text, .dx-icon-filter, .dx-field-item-label-text, #content-container p, #content-container li, #content-container h2, .dx-form-group-caption, h1, a, .dx-field-item-label-text, .dx-popup-content {
        color: #fff !important;
    }


.dx-invalid.dx-texteditor.dx-editor-outlined.dx-show-invalid-badge .dx-texteditor-input-container:after {
    background: #555;
}

.dx-overlay-content.dx-invalid-message-content.dx-resizable, .dx-invalid.dx-lookup .dx-lookup-field:after {
    background: #555;
}

.dx-invalid.dx-lookup .dx-lookup-field:after, .dx-radiobutton-icon-checked .dx-radiobutton-icon-dot {
    background: #555;
}


.dx-datagrid-filter-panel .dx-datagrid-filter-panel-text, .dx-field-item-label-text, .dx-item-content.dx-toolbar-item-content, .dx-item-content.dx-list-item-content, .dx-button-text, .dx-lookup-arrow {
    color: #fff !important;
}

.dx-datagrid-filter-panel .dx-icon-filter, .dx-datagrid-nodata, .dx-dropdowneditor-icon, .dx-item .dx-treeview-item, .dx-checkbox-text, .dx-list-select-all-label, .dx-item-content .dx-treeview-item-content, .dx-treeview-item-with-checkbox .dx-treeview-item,
.dx-treeview-item.dx-state-hover, .dx-datagrid-group-closed, .dx-datagrid-group-opened, .dx-datagrid-column-chooser-list.dx-treeview .dx-empty-message, .dx-list-item-content, .dx-list .dx-empty-message, .dx-treeview .dx-empty-message,
.dx-treeview-node-container:first-child, .dx-treeview-item-without-checkbox.dx-state-selected > .dx-treeview-item, .dx-datagrid-filter-panel .dx-datagrid-filter-panel-clear-filter, .dx-widget .dx-collection, .dx-datagrid .dx-header-filter,
.dx-fileuploader-input-label, .dx-fileuploader-file-name {
    color: #fff;
}

.dx-datagrid-focus-overlay, .dx-state-focused.dx-accordion-item {
    border-color: #fff;
}


.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):not(.dx-row-removed) > td, .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused, .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover {
    background-color: lightgrey !important;
    color: #000 !important;
    border-color: lightgrey;
}

.dx-tabpanel.dx-state-focused .dx-multiview-wrapper, .dx-checkbox.dx-state-hover .dx-checkbox-icon, .dx-treeview-item-with-checkbox.dx-state-focused > .dx-checkbox .dx-checkbox-icon, .dx-checkbox.dx-state-focused .dx-checkbox-icon {
    border: #fff;
}

.dx-form-group-with-caption > .dx-form-group-content {
    border-top: 1px solid #fff !important;
}

.dx-tabpanel.dx-state-focused > .dx-tabpanel-tabs .dx-tabs, .dx-tabpanel.dx-state-focused > .dx-tabpanel-tabs .dx-tab.dx-tab-selected, .dx-tabpanel.dx-state-focused > .dx-tabpanel-tabs .dx-tab {
    box-shadow: inset 0 -1px #444,inset 0 1px,inset -1px 0,inset 1px 0 !important;
}

.dx-tabpanel > .dx-tabpanel-tabs .dx-tabs-expanded .dx-tab:not(.dx-tab-selected):first-of-type {
    box-shadow: inset 0 -1px #444,inset 0 1px,inset -1px 0,inset 1px 0 !important;
}

.dx-checkbox-checked .dx-checkbox-icon, .dx-checkbox-indeterminate .dx-checkbox-icon, .dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-group-item .dx-filterbuilder-action.dx-filterbuilder-action-icon {
    color: #444;
}

.dx-texteditor.dx-state-focused.dx-editor-outlined, .dx-invalid.dx-texteditor, .dx-invalid.dx-texteditor.dx-editor-outlined.dx-state-focused, .dx-texteditor.dx-state-hover, .dx-datagrid-filter-row .dx-menu-item.dx-state-focused:after, .dx-button-mode-contained.dx-state-focused {
    border-color: #444;
}

.dx-calendar-cell.dx-calendar-selected-date.dx-calendar-contoured-date, .dx-calendar-cell.dx-calendar-selected-date.dx-calendar-today.dx-calendar-contoured-date {
    box-shadow: inset 0 0 0 1px #c7cccf, inset 0 0 0 1000px #555;
}

.dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-focused .dx-radiobutton-icon:before, .dx-list.dx-list-select-decorator-enabled .dx-list-select-all.dx-state-focused .dx-radiobutton-icon:before,
.dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-focused .dx-checkbox-icon, .dx-list.dx-list-select-decorator-enabled .dx-list-select-all.dx-state-focused .dx-checkbox-icon, .dx-list.dx-list-select-decorator-enabled
.dx-list-item.dx-state-hover .dx-radiobutton-icon:before, .dx-list.dx-list-select-decorator-enabled .dx-list-select-all.dx-state-hover .dx-radiobutton-icon:before, .dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-hover
.dx-checkbox-icon, .dx-list.dx-list-select-decorator-enabled .dx-list-select-all.dx-state-hover .dx-checkbox-icon, .dx-datagrid-filter-panel .dx-datagrid-filter-panel-clear-filter, .dx-radiobutton.dx-state-hover .dx-radiobutton-icon:before,
.dx-radiobutton.dx-state-focused:not(.dx-state-active) .dx-radiobutton-icon:before {
    border-color: #fff;
}

.dx-scrollable-scroll-content, .dx-checkbox.dx-state-active .dx-checkbox-icon {
    background: #fff;
}

.dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-group-item .dx-filterbuilder-text, .dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-group-operation:hover,
.dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-field:hover, .dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-operation:hover,
.dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-operation:focus, .dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-operation.dx-state-active,
.dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-operation:focus, .dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-operation.dx-state-active,
.dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-group-operation:focus, .dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-group-operation.dx-state-active,
.dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-field:focus, .dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-field.dx-state-active,
.dx-scrollbar-hoverable.dx-scrollable-scrollbar-active .dx-scrollable-scroll-content {
    background-color: rgba(128,128,128,.5);
}

.dx-texteditor .dx-state-hover
.dx-datagrid-filter-panel.dx-state-focused .dx-icon-filter:focus, .dx-datagrid-filter-panel.dx-state-focused .dx-datagrid-filter-panel-text:focus, .dx-datagrid-filter-panel.dx-state-focused .dx-datagrid-filter-panel-clear-filter:focus,
.dx-datagrid-filter-panel.dx-state-focused .dx-icon-filter:focus, .dx-datagrid-filter-panel.dx-state-focused .dx-datagrid-filter-panel-text:focus, .dx-datagrid-filter-panel.dx-state-focused .dx-datagrid-filter-panel-clear-filter:focus,
.dx-datagrid .dx-datagrid-headers.dx-state-focused .dx-header-row td:focus, .dx-datagrid .dx-datagrid-headers.dx-state-focused .dx-header-row td .dx-header-filter:focus {
    outline: 2px solid #444;
}

.dx-button-mode-contained.dx-button-default, .dx-button-mode-contained.dx-button-default.dx-state-focused, .dx-button-mode-contained.dx-button-default.dx-state-hover {
    background-color: #fff;
}

.btn {
    color: #fff !important;
    background-color: #555 !important;
}

    .btn:hover {
        color: #fff !important;
        background-color: #444 !important;
        border: 1px solid #fff;
    }

#about {
    background-color: #444 !important;
}

#btnPretrazi,
#btnPocistiFiltere {
    background-color: #555 !important;
    border-radius: 0px;
}

.breadcrumbs {
    background: #555 !important;
}

#breadcrumb-nav {
    color: #fff;
}

#footer .footer-newsletter {
    background: #555 !important;
}

.dx-datagrid-rowsview .dx-row-focused.dx-data-row:not(.dx-row-lines) > td, .dx-datagrid-rowsview .dx-row-focused.dx-data-row:not(.dx-row-lines) > tr:first-child > td {
    background-color: #444 !important;
}

.breadcrumb-item.active {
    color: #fff;
    font-weight: bold;
}

#header {
    background: #444 !important;
}

#footer {
    background: #444 !important;
}

#intro {
    background: #555 !important;
    border: 1px solid #fff;
    color: #fff;
}

#intro-text {
    color: #fff;
}

#intro ul li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 700;
    font-size: 1.2rem;
    color: #fff !important;
    margin-bottom: 10px;
}

#intro p {
    color: #fff !important;
    font-size: 1.2rem;
    line-height: 1.6;
    margin-bottom: 20px;
}

#intro h4 {
    color: #fff !important;
    font-size: 1.6rem;
    margin-bottom: 15px;
}

#intro h2 {
    color: #fff !important;
    font-size: 2.8rem;
    font-weight: bold;
    margin-bottom: 15px;
}

.solution_cards_box .solution_card {
    background: #555 !important;
    border: 1px solid #fff;
    color: #fff;
}

.sidebar {
    background: #555 !important;
}

.solution_cards_box .solution_card:before {
    background: #444 !important;
}

.hover_color_bubble {
    background: #555 !important;
}

#mainDiv .solution_card:hover {
    background: #555 !important;
    border: 1px solid #fff;
}

#mainDiv .solution_card:before {
    background: #444 !important;
}

.arrow-controls {
    background: #444 !important;
    border: 1px solid #fff;
}

    .arrow-controls .arrow:hover {
        background-color: #555 !important;
        color: #fff;
        border: 1px solid #fff;
    }

.service-info {
    background: #444 !important;
    border: 1px solid #fff;
}

.solution_card .solu_description button {
    background: #444 !important;
    border: 1px solid #fff;
}

.solution_card .solu_title h3 {
    color: #fff !important;
}

#font-popup button {
    color: #fff !important;
    background-color: #555 !important;
}

#font-popup button:hover {
        color: #fff !important;
        border: 1px solid;
        border-color: #fff !important;
        background-color: #444 !important;
}
#footer p,
.vidljivost p {
    color: #fff !important;
}
body.low-vision-mode .logo-normal,
body.low-vision-mode .intro-logo-normal {
    display: none !important;
}
body.low-vision-mode .logo-white,
body.low-vision-mode .intro-logo-white {
    display: inline-block !important;
}


body.low-vision-mode .intro-logo-white {
    display: block !important;
    margin: 0 auto;
}

body.low-vision-mode .eu-logo-normal {
    display: none !important;
}

body.low-vision-mode .eu-logo-white {
    display: block !important;
}
body.low-vision-mode .icon-normal {
    display: none !important;
}

body.low-vision-mode .icon-bw {
    display: inline-block !important;
}
body.low-vision-mode .intro-img-normal {
    display: none !important;
}

body.low-vision-mode .intro-img-bw {
    display: block !important;
    margin: 0 auto; 
}
body.low-vision-mode .intro-img-normal {
    display: none !important;
}

body.low-vision-mode .intro-img-bw {
    display: block !important;
    margin: 0 auto;
}
body.low-vision-mode #popupKontaktInformacije,
body.low-vision-mode #popupKontaktInformacije div,
body.low-vision-mode #popupKontaktInformacije span,
body.low-vision-mode #popupKontaktInformacije b,
body.low-vision-mode #popupKontaktInformacije i {
    color: #ffffff !important;
}


    body.low-vision-mode #popupKontaktInformacije a {
        color: #ffffff !important;
        text-decoration: underline !important;
    }


    body.low-vision-mode #popupKontaktInformacije div[style*="border-bottom"] {
        border-bottom-color: #ffffff !important;
    }

body.low-vision-mode .dx-popup-normal .dx-overlay-content,
body.low-vision-mode .dx-popup-normal .dx-popup-content {
    background-color: #444444 !important;
    color: #ffffff !important;
}

body.low-vision-mode .dx-popup-title {
    background-color: #333333 !important;
    color: #ffffff !important;
    border-bottom: 1px solid #ffffff !important;
}
body.low-vision-mode .help-icon i {
    color: #101429 !important;
}

.dx-datagrid-column-chooser .dx-overlay-content .dx-popup-content .dx-column-chooser-item {
    opacity: 1 !important; /* UKLONJENO .5 jer to krši standard čitljivosti */
    margin-bottom: 10px;
    background-color: #fff;
    /* PROMJENA: #959595 -> #333 (Tamno siva za kontrast > 4.5:1) */
    color: #333 !important;
    font-weight: 500; 
    border: 1px solid #ddd;
    padding: 7px;
    -webkit-box-shadow: 0 1px 3px -1px rgba(0, 0, 0, .2);
    box-shadow: 0 1px 3px -1px rgba(0, 0, 0, .2);
}

body.low-vision-mode .solution_card {
    background-color: #555 !important;
    border: 1px solid #fff !important;
}

    body.low-vision-mode .solution_card .dx-scrollable,
    body.low-vision-mode .solution_card .dx-scrollable-wrapper,
    body.low-vision-mode .solution_card .dx-scrollable-container,
    body.low-vision-mode .solution_card .dx-scrollable-content,
    body.low-vision-mode .solution_card .dx-scrollview-content {
        background: transparent !important;
        background-color: transparent !important;
    }


    body.low-vision-mode .solution_card h3,
    body.low-vision-mode .solution_card h5,
    body.low-vision-mode .solution_card p,
    body.low-vision-mode .solution_card div,
    body.low-vision-mode .solution_card span {
        color: #ffffff !important;
    }

body.low-vision-mode .arrow-controls {
    background-color: #444 !important;
    border-top: 1px solid #fff;
}

    body.low-vision-mode .arrow-controls i.arrow {
        color: #ffffff !important;
    }

body.low-vision-mode .arrow-controls i.arrow:hover {
            color: #fff !important; 
}
.breadcrumb-item.active {
    color: #fff !important;
}
.breadcrumb-item + .breadcrumb-item::before {
    color: white;
    float: left;
    padding-right: var(--bs-breadcrumb-item-padding-x);
    content: var(--bs-breadcrumb-divider, "/");
    color: white !important;
}
body.low-vision-mode .dx-datagrid-rowsview .dx-row.dx-data-row.dx-state-hover > td {
    color: #ffffff !important; 
    font-weight: 700 !important; 
    background-color: #444444 !important; 
    border-top: 1px solid #ffffff !important;
    border-bottom: 1px solid #ffffff !important;
}

    body.low-vision-mode .dx-datagrid-rowsview .dx-row.dx-data-row.dx-state-hover > td a,
    body.low-vision-mode .dx-datagrid-rowsview .dx-row.dx-data-row.dx-state-hover > td i {
        color: #ffffff !important;
    }

body.low-vision-mode .dx-texteditor-input-container {
    background-color: #ffffff !important;
}

body.low-vision-mode .dx-texteditor-input {
    color: #000000 !important; 
    font-weight: 700 !important;
    background-color: #ffffff !important; 
}


body.low-vision-mode .dx-texteditor-container .dx-icon {
    color: #000000 !important;
}


body.low-vision-mode .dx-placeholder {
    color: #444444 !important;
    font-weight: 700 !important;
}
body.low-vision-mode .dx-item-content.dx-list-item-content {
    background-color: #444444 !important; /* Temna pozadina */
    color: #ffffff !important; /* Bel tekst */
    font-weight: 700 !important; /* Bold (podebelen) */
    border-bottom: 1px solid #fff !important; /* Linija za razdvojuvanje */
}

    /* Ikonite vnatre isto taka da bidat beli */
    body.low-vision-mode .dx-item-content.dx-list-item-content .dx-icon,
    body.low-vision-mode .dx-item-content.dx-list-item-content i {
        color: #ffffff !important;
    }

/* Koga kje se pomine so gluvcheto (Hover) */
body.low-vision-mode .dx-list-item.dx-state-hover .dx-item-content {
    background-color: #333333 !important; /* Ushte potemna za hover */
    color: #ffff !important; /* Zholta za hover (opcionalno) ili #fff */
    border: 1px solid #fff !important;
}