:root{
--bs-body-font-family:'Open Sans';
--bs-border-width:0.05rem;
--blue:#49abe0;
--bs-primary-rgb:73,171,224; /* --blue */
--light-blue:#eef2f7;
--bs-light-rgb:238,242,247; /* --light-blue */
--dark-blue:#17405c;
--bs-secondary-color:rgb(23,64,92); /* --dark-blue */
--bs-danger-bg-subtle:#ff999b;
--bs-success-bg-subtle:#e0ffc9;
--bs-success:#a2de76;
--success-bg-medium:#c5f5a2;
--bs-border-color:#49abe070;
}

html, body {font-size:14px;min-width:360px;}

/* header */
header svg {width:10rem;}

/* logo */
.no-fill{fill: none;}
.fill-dark-blue{fill: var(--dark-blue);}
.fill-blue{fill:var(--blue);}
.group-clip-path{clip-path: url(#clippath);}

/* login */
.login .container {max-width:25rem;background-color:var(--light-blue);border:1px solid var(--blue);border-radius:var(--bs-border-radius);box-shadow:0 0 10px 0px rgba(74, 171, 224, .25);}

/* notifications */
.notifications i.fa-message {font-size:1.7rem;color:var(--blue);}
.notifications .badge {font-size:0.7rem;}
.notifications .badge:empty {display:none;}
.notifications .dropdown-toggle::after{display:none;}
#newMsgContent {max-height:80vh;overflow-x:hidden;overflow-y:auto;background-color:#fff;--bs-dropdown-item-padding-y:1rem;}
#newMsgContent>li>a {font-size:0.9rem;}
#newMsgContent>li>a .msg-preview {width:220px;white-space:normal;}
#newMsgContent>li>a .notif-meta {font-size:0.8rem;}
#newMsgContent>li+li{border-top:1px solid var(--bs-border-color-translucent);}
#newMsgContent>li:first-child, #newMsgContent>li:first-child>a{border-top-left-radius: var(--bs-dropdown-border-radius);border-top-right-radius: var(--bs-dropdown-border-radius);}
#newMsgContent>li:last-child, #newMsgContent>li:last-child>a{border-bottom-left-radius: var(--bs-dropdown-border-radius);border-bottom-right-radius: var(--bs-dropdown-border-radius);}
#newMsgContent>li.mark-all-read {position:sticky;bottom:0;background-color:#fff;box-shadow:0 0 10px 0px rgba(0,0,0,0.2);}
#newMsgContent>li.mark-all-read>a {color:var(--blue);}
#newMsgContent .dropdown-item:active, #newMsgContent .dropdown-item:focus, #newMsgContent .dropdown-item:hover{background-color:var(--blue);}
.navbar-text a:focus, .navbar-text a:hover {color:#fff !important;}

/* form elements */
.btn-primary, .btn-outline-primary { --bs-btn-border-color:var(--dark-blue);--bs-btn-hover-bg:var(--blue);--bs-btn-hover-border-color:var(--blue);--bs-btn-active-bg:var(--blue);--bs-btn-active-border-color:var(--blue);--bs-btn-disabled-bg:#999;--bs-btn-disabled-border-color:#999;}
.btn-primary {--bs-btn-bg:var(--dark-blue);}
.btn-outline-primary {--bs-btn-color:var(--dark-blue);}
.form-check-input:checked {background-color:var(--dark-blue);border-color:var(--dark-blue);}
.form-control:focus, .form-check-input:focus {border-color:var(--blue); box-shadow:0 0 0 .25rem rgba(74,171,224,.25);}
.form-floating>textarea.form-control {height: calc(7rem + calc(var(--bs-border-width)* 2));min-height: calc(3.5rem + calc(var(--bs-border-width)* 2));}
.form-floating>textarea.form-control.textarea-lg {height: calc(21rem + calc(var(--bs-border-width)* 2));}
.form-floating>label {color: rgba(var(--bs-body-color-rgb), .65);}
.btn-link {color:inherit;text-decoration:none;--bs-btn-hover-color:var(--dark-blue);}
.btn-form-control {text-align:left; height: calc(3.5rem + calc(var(--bs-border-width) * 2));min-height: calc(3.5rem + calc(var(--bs-border-width) * 2));line-height: 1.25;padding:1.625rem .75rem .625rem .75rem;--bs-btn-color: var(--bs-body-color);--bs-btn-bg: #fff;--bs-btn-border-color: var(--bs-border-color);--bs-btn-hover-color: var(--bs-body-color);--bs-btn-hover-bg: #fff;--bs-btn-hover-border-color: var(--bs-border-color);--bs-btn-focus-shadow-rgb: 74, 171, 224;--bs-btn-active-color: var(--bs-body-color);--bs-btn-active-bg: #fff;--bs-btn-active-border-color: var(--blue);--bs-btn-active-shadow: 0 3px 5px rgba(0, 0, 0, 0.125);--bs-btn-disabled-color: #fff;--bs-btn-disabled-bg: #6c757d;--bs-btn-disabled-border-color: #6c757d;}
.btn-form-control.show {box-shadow:0 0 0 .25rem rgba(74,171,224,.25);}
.btn-form-control::after {position: absolute;right: 1rem;top: 50%;transform: translateY(-50%);}
.btn-form-control .value {max-width:calc(100% - 1em);display:inline-block;overflow:hidden;text-overflow:ellipsis;}
.btn-form-control .value:empty {display:none;}
.btn-form-control .label {color: rgba(var(--bs-body-color-rgb), .65);position: absolute;top: 0;left: 0;z-index: 2;height: 100%;padding: 1rem .75rem;overflow: hidden;text-align: start;text-overflow: ellipsis;white-space: nowrap;pointer-events: none;border: var(--bs-border-width) solid transparent;transform-origin: 0 0;transition: opacity .1s ease-in-out, transform .1s ease-in-out;margin-bottom: .5rem;display: inline-block;}
.btn-form-control .value:not(:empty) + .label {transform: scale(.85) translateY(-.5rem) translateX(.15rem);}
.dropdown.like-form-control .dropdown-menu {max-height:250px;overflow-x:hidden;overflow-y:auto;}

/* clock */
canvas {width:100%;}
.col-clock {display:none;}

/* list */
#projectsMobile .status {display:flex;align-items:center;}
#projectsMobile .noteDiv {margin-top:.5rem;}
#projectsMobile .swiper-container {border:1px solid rgba(var(--bs-primary-rgb));background-color:rgb(var(--bs-light-rgb));/*padding-right: calc(var(--bs-gutter-x) * .5);padding-left: calc(var(--bs-gutter-x) * .5);*/}
#projectsMobile .project>div {padding:.25rem 1rem .25rem 1rem;}
#projectsMobile .project>div:first-child {padding-top:var(--bs-gutter-y);}
#projectsMobile .project>div:last-child {padding-bottom:var(--bs-gutter-y);}
#projectsMobile .project>div::before{display:inline-block;margin-right:.5rem;font-weight:700;}
#projectsMobile .status.inline-status::before {display:none;}
#projectsMobile .status:not(.inline-status)::before{content:'Status:';}
#projectsMobile .ident {font-weight:700;font-size:1.2rem;line-height:1;margin-top:0.5rem;}
#projectsMobile .ident::before{content:'Št. projekta:';}
#projectsMobile .client::before{content:'Naročnik:';}
#projectsMobile .project-name::before{content:'Objekt:';}
#projectsMobile .estStart::before{content:'Predv. pričetek del:';}
#projectsMobile .delay::before{content:'Zamuda dni:';}
#projectsMobile .start::before{content:'Podpis pogodbe:';}
#projectsMobile .deadline::before{content:'Rok izvedbe:';}
#projectsMobile .remaining::before{content:'Ostane dni:';}
#projectsMobile .project-manager::before{content:'Vodja projekta:';}
#projectsMobile .installers::before{content:'Delovodja:';}

#projectsDesktop {display:none;}
.container, .container-fluid, .row {--bs-gutter-x:1.25rem;}
.project-list {font-size:1rem;}
.project-hidden td, .project-hidden + .noteRow td{color:#999999;}

.table>:not(caption)>*>* {padding:.3rem;box-shadow:none;}
.table-primary {--bs-table-bg:var(--dark-blue);--bs-table-color:#fff;--bs-table-border-color:var(--blue);}
.table-hover>tbody>tr:hover>td {--bs-table-bg:var(--light-blue);}
.table-hover>tbody>tr:hover>td:not(.actions){cursor:pointer;}
.table-hover>tbody>tr:hover>td.actions>div{display:flex!important;background-color:var(--light-blue);background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(238,242,247,1) 35%);}
.table-hover>tbody>tr.hasNote.hover, .table-hover>tbody>tr.hasNote:hover + tr.noteRow>*{--bs-table-bg:var(--light-blue);--bs-table-color-state: var(--bs-table-hover-color);--bs-table-bg-state: var(--bs-table-hover-bg);}
.table-hover>tbody>tr.hasNote.hover > td.ident, .table-hover>tbody>tr.hasNote:hover > td.ident {border-bottom-color:var(--light-blue);}

#projectsDesktop .noteRow td, #projectsDesktop .hasNote .ident {background-color:var(--light-blue)!important;}
#projectsDesktop .hasNote {border-color:transparent;}
.hasNote > td {border-width:var(--bs-border-width);border-color:var(--blue);}
.hasNote > td.ident {border-bottom-color:var(--light-blue);}
th, #projectsDesktop .notes, #projectsDesktop .client, #projectsDesktop .project-name, #projectsDesktop .project-manager, #projectsDesktop .actions {white-space:nowrap; overflow:hidden; text-overflow:ellipsis;max-width:0;}
#projectsDesktop .notes.scrolling {text-overflow:unset;}
.delay:not(:empty) {background-color:var(--bs-danger-bg-subtle);}
#paging {color:var(--blue);font-weight:700;font-size:1.1rem;}

.circle-progress {transform: rotate(-90deg);}
.circle-background {stroke: #eee;}
.circle-progress-bar {stroke: var(--dark-blue);transition: stroke-dashoffset 0.1s linear;}

#projectsDesktop .status {text-align:center;vertical-align:middle;}
.status i {display:inline-block;width:1rem;height:1rem;border-radius:50%;content:'';}
.status-0 {background-color:var(--bs-danger-bg-subtle);}
.status-1 {background-color:var(--bs-success);}

.alert-level-1 {background-color:var(--bs-success-bg-subtle)!important;}
.alert-level-2 {background-color:var(--success-bg-medium)!important;}
.alert-level-3 {background-color:var(--bs-success)!important;}
.alert-level-4 {background-color:var(--bs-danger-bg-subtle)!important;}
.alert-danger {--bs-alert-bg:#f8d7da;}

.actions>div {top:.15rem;}

.offcanvas {--bs-offcanvas-width:250px;}

.modal-header {border-bottom:none;}
.modal-footer {border-top:none;}

/* users */

.users-list .row>div {padding-top:.5rem;padding-bottom:.5rem;}
.users-list .row.border-top {background-color:var(--dark-blue);}
.users-list .col-actions {flex:0 0 auto;width:90px;}

/* project form */
.users-list, .project-form {max-width:720px;}

/* weather */
.col-weather {margin-top:1.5rem;margin-bottom:1.5rem;}
#weatherContent p {text-align:center;}
#weatherContent div>p:first-child {margin-bottom:0;}
#weatherContent>div:first-child img {max-width:50%;}
#weatherContent>div:last-child img {max-width:70%;}
#weatherContent .d-flex>div{width:50%;flex:0 0 auto;max-width:100%;}
#weatherContent .d-flex>div:first-child {padding-right:1rem;}
#weatherContent .d-flex>div:last-child {padding-left:1rem;}
#weatherContent .forecast {margin-top:1rem;}
/*#weatherContent .d-flex p+p {display: -webkit-box;overflow-wrap: break-word;text-overflow: ellipsis;-webkit-box-orient: vertical; margin-bottom:.5rem;-webkit-line-clamp:2; height:calc(1.6rem * var(--bs-body-line-height));}*/

/* traffic */
#trafficContent p {margin-bottom:.5rem;}
#trafficContent > p:last-child {margin-bottom:0;}

/* Chromium only */
.prettyScrollbar::-webkit-scrollbar {width:4px;}
.prettyScrollbar::-webkit-scrollbar-button {display:none;}
.prettyScrollbar::-webkit-scrollbar-thumb {background: #ccc;border-radius:2px;}
.prettyScrollbar::-webkit-scrollbar-thumb:hover {background:#17405c;}
.prettyScrollbar::-webkit-scrollbar-track, .prettyScrollbar::-webkit-scrollbar-track-piece {background:rgb(238,242,247);}

/* Firefox */
.is-firefox .prettyScrollbar { scrollbar-width: thin; scrollbar-color: #ccc var(--bs-light-rgb); }
.is-firefox .prettyScrollbar:hover { scrollbar-color: var(--dark-blue) var(--bs-light-rgb); }

/* files */
.file-list:empty {display:none;}
.file-list.limit-height {min-height:300px;}
.file-list ul {list-style-type:none;}
.file-list ul.files li {margin-bottom:1rem;}
.file-list ul.files i {font-size:1.25rem; width:1.5rem;}
.file-list ul.files a, .file-list a:hover, .file-list a:focus, .file-list a:visited, .file-list a:active {text-decoration:none;color:inherit;}
.file-list ul.images a, .file-list ul.images img {aspect-ratio:4 / 3;}
.file-list ul.images img {object-fit:cover; object-position:center;}
.file-list ul.images li.dragging{opacity:.6}
.file-list.with-btn-delete .btn-remove {position:absolute;bottom:0;right:calc(var(--bs-gutter-x) * .5);background-color:rgba(255,255,255,0.7);margin-right:5px;margin-bottom:5px;}
.product-file-upload ul {list-style-type:none;}

.product-file-upload ul {padding-left:1em;}
.product-file-upload ul li:not(.new-file) {margin-left:-1rem;}
.product-file-upload ul li.new-file::before {content:"";display:inline-block;width:12px; height:12px; margin:0 .7em 0 -1.1em; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='20px' viewBox='0 -960 960 960' width='20px' fill='%23ff8f00'%3E%3Cpath d='M444-144v-249L268-217l-51-51 176-176H144v-72h249L217-692l51-51 176 176v-249h72v249l176-176 51 51-176 176h249v72H567l176 176-51 51-176-176v249h-72Z'/%3E%3C/svg%3E"); background-repeat: no-repeat no-repeat; background-position: center center; background-size: contain;}
.product-file-upload ul li .link-download {color:inherit;text-decoration:none;}
.product-file-upload ul li .link-download i {width:1.5rem;}
.product-file-upload .btn-remove i, .file-list.with-btn-delete .btn-remove i{color:red;}
.product-file-upload button:hover i, .file-list ul.images li button:hover {color:#000000;transform:scale(1.2);}

/* messages */
.messages-container {max-height:80vh;overflow-x:hidden;overflow-y:auto;scrollbar-gutter:stable;padding-right:38px; /* 42px(.button-container) - 4px (.prettyScrollbar) */}
.is-firefox .messages-container {padding-right:34px;} /* thin scrollbar is 8px wide in FireFox */
.messages-container:empty, .messages-container.reply .message:not(.active){display:none;}
.messages-container:not(.reply) .message + .message {margin-top:1rem;}
.messages-container:not(:empty) + .new-message-container {border-top:1px solid var(--blue);padding-top:2rem;}
.message-meta strong, .reply button {font-size:.9rem;}
.reply button {color:var(--blue);font-weight:bold;}
.message:not(.active) .reply .btn-pin-container {display:none;}
.message.active .reply {display:flex;justify-content:space-between;align-items:center;}
.recipients {font-size:.8rem;}
.message.active .recipients {display:none;}
.message-meta strong em {opacity:.8;}
.message-meta em {font-size:.8rem;}
textarea.form-control.new-message {resize:none;height:100px;}
.messages-slide {min-height:216px;}
.messages-slide .bg-light {background-color:#fff !important;}
.new-message-bullet {width:6px;height:6px;display:inline-block;background-color:#ff0000;border-radius:50%;margin-left:5px;vertical-align:0.1em;}

.file-upload-container .inner {position:relative;width:32px;height:34px;}
.file-upload-container input {position: absolute;top: 0;bottom: 0;left: 0;right: 0;opacity: 0;cursor: pointer;padding:16px;}
.button-container {flex:0 0 auto; width:42px;}

/* footer */
.bottom-info {color:var(--dark-blue);font-size:.9rem;}
.bottom-info p strong {font-size:.95rem;}
.bottom-info .heading {font-size:1.05rem;}
.bottom-info .content > p:last-child {margin-bottom:0;}
.bottom-info>.row>.col{flex:0 0 auto;width:100%;}

@media (min-width:576px){
    #weatherContent {display:flex;}
    #weatherContent>div:first-child, #weatherContent .d-flex>div{width:calc((100vw - 6rem) / 3);}
    #weatherContent>div:first-child{padding-right:1rem;}
    #weatherContent>div:first-child img, #weatherContent>div:last-child img {max-width:100%;}
    #weatherContent .forecast {margin-top:0;}
    #newMsgContent>li>a .msg-preview {width:350px;}
}

@media (min-width:768px){
    #projectsMobile>.project:nth-child(2)>div:first-child {border-top:none;padding-top:.25rem;}
    
}

@media (min-width:992px){
    #projectsMobile>.project:nth-child(3)>div:first-child {border-top:none;padding-top:.25rem;}
    .bottom-info {--fixed-width-containers:18rem;}
    .bottom-info>.row {height:100%;}
    .bottom-info>.row>.col:not(.col-traffic) {flex:0 0 auto;}
    .bottom-info>.row>.col.col-weather, .bottom-info>.row>.col.col-clock {width:var(--fixed-width-containers);}
    .bottom-info>.row>.col.col-board {width:calc((100vw - 2rem - var(--fixed-width-containers)) * 0.5);}
    .bottom-info>.row>.col.col-traffic {width:auto;flex-grow:1;flex-basis:0%;margin-bottom:0;}
    .col-traffic {width:auto;margin-bottom:1.5rem;}
    #trafficContent {max-height:var(--traffic-max-height);overflow:auto;}
    #messageboardContent {max-height:var(--board-max-height);overflow:auto;}
    .col-weather {margin-top:0;margin-bottom:0;}
    #weatherContent {display:block;}
    #weatherContent>div:first-child img, #weatherContent>div:last-child img {max-width:10rem;}
    #weatherContent .d-flex>div {width:50%;}
    #weatherContent>div:first-child{padding-right:0;width:auto;margin-bottom:1.5rem;}
    #weatherContent>div:first-child img {max-width:50%;}
    #weatherContent>div:last-child img {max-width:70%;}
    #weatherContent .forecast {margin-top:1rem;}    
    #weatherContent p {font-size:0.8rem;}
    #newMsgContent {max-height:400px; max-height:min(400px, 70vh);}
}

@media (min-width:1200px){
    header svg {width:20rem;}
    #projectsDesktop {display:table;}
    #projectsMobile {display:none;}
    .bottom-info {--fixed-width-containers:20rem;}    
    .bottom-info>.row>.col.col-board {width:calc((100vw - 2rem - (2 * var(--fixed-width-containers))) * 0.5);}        
    #weatherContent p {font-size:0.9rem;}
    .col-clock {display:block;}
    .file-list.with-btn-delete .btn-remove {display:none;}
    .file-list.with-btn-delete li:hover .btn-remove, .file-list.with-btn-delete li:focus .btn-remove {display:block;}
    .column-messanger {position:fixed;top:0;right:0;bottom:0;width:25rem;padding-top:10px;border-left: 0.05rem solid rgba(0, 0, 0, 0.175);z-index:1039;max-width:100%;background-color:#fff;background-clip:padding-box;display:flex;flex-direction:column;box-shadow:0 0 10px 0px rgba(0,0,0,0.2);}
    .column-messanger #divMessenger {flex-grow:1;display:flex;flex-direction:column;}
    .column-messanger #divMessenger .messages-container {flex-grow:1;max-height:calc(100vh - var(--new-message-height));}
    .project-form-btn-container, header.with-messanger {margin-right:25rem;}
}

@media (min-width:1400px){
    .bottom-info {--fixed-width-containers:22rem;}
    .column-messanger {width:28rem;}
    .project-form-btn-container, header.with-messanger {margin-right:28rem;}
}