/* 
    Created on : 23.12.2019, 16:22:06
    Author     : TB
*/

@charset 'UTF-8';



.roster-controls {
    position: relative;
}

.roster-controls .roster-controls-date {
    /*min-width: 360px;
    padding: 0 80px;*/
}

.roster-controls .btn-roster {
    
}

/*
.roster-controls .roster-controls-date .btn-roster.btn-prev {
    left: -80px;
}

.roster-controls .roster-controls-date .btn-roster.btn-next {
    right: -80px;
}

.roster-controls .roster-controls-date .btn-roster.btn-today {
    right: -170px;
}
*/

.roster-controls .roster-controls-right {
    position: absolute;
    
    /*top: 1.5rem;*/
    top: 0;
    right: 0px;
}

.roster-headers {
    overflow: hidden;
    
    width: calc(100% - 50px);
    margin-left: 50px;
    /*margin-bottom: -2px;*/
    
    /*margin-top: 1rem;*/
    
    margin-top: .5rem;
    height: 4.5rem;
}

.roster-headers.roster-headers-month {
    
    height: 2.5rem;
}

.roster-headers > div {
    display: inline-block;
    width: auto;
    height: auto;
    position: relative;
    
    margin-bottom: -0.35rem;
    padding: 0;
}

.roster-content {
    margin-top: calc(-1rem - 2px) !important;
}

.roster-content, 
.roster-content-dragger {
    /*height: calc(100vh - 24rem);
    height: calc(100vh - 22rem);
    height: calc(100vh - 18rem);
    height: calc(100vh - 20rem);*/
    height: calc(100vh - 18rem);
    overflow: auto;
}

@media (max-width: 767px) {
    
    .roster-content, 
    .roster-content-dragger {
        /*height: calc(100vh - 19rem);*/
        height: calc(100vh - 20.5rem);
    }
    
}

.roster-content-dragger {
    z-index: 10000;
    overflow: hidden;
}

.roster-content.is-change-term, 
.roster-content-dragger.is-change-term {
    height: calc(100vh - 13.3rem);
}

.roster-headers .roster-content-time, 
.roster-content .roster-content-time, 
.roster-content-dragger .roster-content-time {
    /*width: 5rem;
    min-width: 5rem;
    
    width: 3.2rem;
    min-width: 3.2rem;*/
    
    /*width: 50px;
    min-width: 50px;*/
    
    width: 50px;
    min-width: 50px;
    max-width: 50px;
}

.roster-headers .roster-content-col, 
.roster-content .roster-content-col, 
.roster-content-dragger .roster-content-col {
    /*width: 18rem;
    min-width: 18rem;
    
    width: 16rem;
    min-width: 16rem;
    max-width: 16rem;*/
    
    /*width: 10rem;
    min-width: 10rem;
    max-width: 10rem;*/
    
    width: 12rem;
    min-width: 12rem;
    max-width: 12rem;
}

/*.roster-headers .roster-content-time {
    border-left: 1px solid transparent;
    border-right: 1px solid transparent;
}*/

.roster-headers .roster-content-time,
.roster-headers .roster-content-col, 
.roster-headers-dragger .roster-content-col {
    /*height: 4rem;*/
}

.roster-content .roster-content-time,
.roster-content .roster-content-col, 
.roster-content-dragger .roster-content-col {
    height: 3rem;
    height: 1.5rem;
}

.roster-content .roster-content-time {
    position: sticky;
    left: 0;
    background: #fff;
    z-index: 100;
}

.roster-headers .roster-content-col {
    vertical-align: top;
}

.roster-headers .roster-content-col .text-muted {
    /*font-size: 0.85rem;
    font-style: italic;*/
}

.roster-content .roster-content-table {
    border-collapse: separate;
    border-spacing: 0;
    border-color: transparent;
}

.roster-content .roster-content-table td {
    border-bottom: 0 none;
    border-color: transparent;
    border-top-color: transparent;
    border-right-color: transparent;
}

.roster-content .roster-content-table td:not(.roster-content-time) {
    border-left: 0 none;
}

.roster-content .roster-content-time a.is-full-hour, 
.roster-content .roster-content-col a.is-full-hour, 
.roster-content-dragger .roster-content-time a.is-full-hour, 
.roster-content-dragger .roster-content-col a.is-full-hour {
    /*border-top: 1px solid #263238;*/
    /*border-top: 1px solid #8392ab;*/
    border-top: 1px solid transparent;
}
 
.roster-content .roster-content-col.is-full-hour {
    border-top-color: #8392ab; /* dark */
    border-top-color: #67748e; /* muted */
    border-top-color: #c0c4c8;
    border-top-color: #dee2e6;
    
    border-top-width: 1px;
}

.roster-content .roster-content-col.is-full-hour.is-today {
    border-top-color: #c0c4c8;
}
 
.roster-content .roster-content-col.is-half-hour {
    border-top-color: #8392ab; /* dark */ 
    border-top-color: #67748e; /* muted */
    border-top-color: #dee2e6;
    border-top-color: #c0c4c8;
    border-top-style: dashed;
    
    border-top-width: 1px;
}
 
.roster-content .roster-content-col.is-half-hour.is-today {
    border-top-color: #9da0a4;
}

.roster-content-dragger .roster-content-col.is-full-hour,
.roster-content-dragger .roster-content-col.is-full-hour.is-today,
.roster-content-dragger .roster-content-col.is-half-hour,
.roster-content-dragger .roster-content-col.is-half-hour.is-today {
    border-color: transparent;
}

.roster-content .roster-content-time a, 
.roster-content .roster-content-col a, 
.roster-content-dragger .roster-content-time a, 
.roster-content-dragger .roster-content-col a {
    color: var(--dark);
    /*font-weight: bold;*/
    display: block;
    /*width: calc(100% + 1rem);*/
    /*width: calc(100% + 4px);*/
    /*height: calc(100% + .5rem);*/
    
    /*margin: -.25rem -1px -.25rem -1px;*/
    /*margin: -.35rem -.5rem -.25rem -.5rem;*/
    /*margin: -.35rem -2px -.35rem;*/
    line-height: 3rem;
    line-height: 1.4rem;
    line-height: 1.6rem;
    padding-left: .5rem;
    padding-right: .5rem;
    
    font-size: .8rem;
    font-weight: 400;
    
    width: calc(100% + 2px);
    height: calc(100% + .5rem + 2px);
    margin: calc(-.25rem - 1px) -1px calc(-.25rem - 1px) -1px;
    
    width: calc(100% + 2px + 1rem);
    margin: calc(-.25rem - 1px) calc(-.5rem - 1px) calc(-.25rem - 1px) calc(-.5rem);
    
    width: calc(100% + 1rem);
    margin: calc(-.25rem - 1px) calc(-.5rem - 0px) calc(-.25rem - 1px) calc(-.5rem);
}

.roster-content .roster-content-time a.is-first-block, 
.roster-content .roster-content-col a.is-first-block, 
.roster-content-dragger .roster-content-time a.is-first-block, 
.roster-content-dragger .roster-content-col a.is-first-block {
    height: calc(100% + .5rem + 1px);
    margin: calc(-.25rem) -1px calc(-.25rem - 1px) -1px;
    
    width: calc(100% + 2px);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    
    width: calc(100% + 2px + 1rem);
    margin: calc(-.25rem) calc(-.5rem - 1px) calc(-.25rem - 1px) calc(-.5rem);
    
    width: calc(100% + 1rem);
    margin: calc(-.25rem) calc(-.5rem - 0px) calc(-.25rem - 1px) calc(-.5rem);
}

.roster-content .roster-content-time a.is-last-block, 
.roster-content .roster-content-col a.is-last-block, 
.roster-content-dragger .roster-content-time a.is-last-block, 
.roster-content-dragger .roster-content-col a.is-last-block {
    height: calc(100% + .5rem + 1px);
    margin: calc(-.25rem - 1px) -1px calc(-.25rem) -1px;
    
    width: calc(100% + 2px + 1rem);
    margin: calc(-.25rem) calc(-.5rem - 1px) calc(-.25rem - 1px) calc(-.5rem);
    
    width: calc(100% + 1rem);
    margin: calc(-.25rem) calc(-.5rem - 0px) calc(-.25rem - 1px) calc(-.5rem);
}

.roster-content .roster-content-col, 
.roster-content-dragger .roster-content-col {
    position: relative;
}

.roster-content .roster-content-col a {
}

.roster-content .roster-content-col a .fas, 
.roster-content-dragger .roster-content-col a .fas {
    font-size: .75rem;
}

.roster-content .roster-content-col a:not(.no-hover), 
.roster-content .roster-content-col a:not(.is-term), 
.roster-content-dragger .roster-content-col a:not(.no-hover) {
    background: transparent;
    color: transparent;
    
    transition: background .2s, color .2s;
}

.roster-content .roster-content-col a:not(.no-hover):hover, 
.roster-content .roster-content-col a:not(.no-hover):active, 
.roster-content .roster-content-col a:not(.no-hover):focus, 
.roster-content .roster-content-col a:not(.is-term):hover, 
.roster-content .roster-content-col a:not(.is-term):active, 
.roster-content .roster-content-col a:not(.is-term):focus, 
.roster-content-dragger .roster-content-col a:not(.no-hover):hover, 
.roster-content-dragger .roster-content-col a:not(.no-hover):active, 
.roster-content-dragger .roster-content-col a:not(.no-hover):focus {
    background: rgba(96, 125, 139, 0.1);
    color: rgba(0,0,0,.5);
}

.roster-content .roster-content-col a.no-hover, 
.roster-content-dragger .roster-content-col a.no-hover {
    pointer-events: none;
}

.roster-content .roster-content-time a, 
.roster-content-dragger .roster-content-time a {
    pointer-events: none;
    color: #212529 !important;
    color: #67748e !important;
    font-weight: initial;
}

.roster-content .roster-content-time.text-white a, 
.roster-content-dragger .roster-content-time.text-white a {
    color: #fff !important;
}

.roster-content .roster-content-col a.is-deal, 
.roster-content .roster-content-col a.is-deal:hover, 
.roster-content-dragger .roster-content-col a.is-deal, 
.roster-content-dragger .roster-content-col a.is-deal:hover {
    background-color: #ffa500;
    /*border-left: 2px solid #111;
    border-right: 2px solid #111;*/
}

.is-term.is-first-block { 
    /*border-top: 2px solid #111;*/
    
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem;
    
    /*border-top-left-radius: .35rem;
    border-top-right-radius: .35rem;*/
}

.is-term.is-last-block { 
    /*border-bottom: 2px solid #111;*/
    
    border-bottom-left-radius: .5rem;
    border-bottom-right-radius: .5rem;
    
    /*border-bottom-left-radius: .35rem;
    border-bottom-right-radius: .35rem;*/
}















.roster-content td.roster-content-col .card.deal-preview, 
.roster-content-dragger td.roster-content-col .card.deal-preview {
    z-index: 100;
}

.card.deal-preview {
    position: relative;
    position: absolute;
    display: none;
    
    
    bottom: 2.25rem;
    bottom: 2rem;
    bottom: 1.8rem;
    
    /*z-index: 100;*/
    
    transition: display .2s ease-in;
}

.card.term-preview {
    display: none;
    position: absolute;
    top: 1px;
    left: calc(100% - 1rem);
    z-index: 120;
    width: 18rem;
}

.roster-content .roster-content-col.has-term.is-first:hover .term-preview {
    display: block;
}

.card.deal-preview.is-side {
    
    bottom: auto;
    /*right: -310px;
    top: 5px;*/
    right: -305px;
    top: 0;
}

.card.deal-preview.active {
    display: block;
}

.roster-content-dragger {
    /*box-shadow: 0 2px 10px 0 rgba(0,0,0,.16),0 2px 20px 0 rgba(0,0,0,.12);*/
    /*box-shadow: 0 0 12px 0 rgba(0, 0, 0, .16);*/
    cursor: grabbing;
}

.roster-content-dragger, 
.roster-content-dragger table, 
.roster-content-dragger table tr, 
.roster-content-dragger table tr td {
    background: transparent;
    border-color: transparent;
    cursor: grabbing;
}

.card.deal-preview > .bubble-tip,
.card.term-preview > .bubble-tip {
    
    background: #fff;
    /*
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12);
    */
    
    position: absolute;
    
    transform: rotate(-45deg);
    
    display:block;
    
    /*width: 20px;
    height: 20px;*/
    width: 15px;
    height: 15px;
    
    /*border-left: 1px solid #aaa;
    border-bottom: 1px solid #aaa;*/
    
    bottom: -11px;
    bottom: -9px;
    left: 60px;
    /*z-index: -1;*/
    
    width: 8px;
    height: 8px;
}

.card.deal-preview.is-side > .bubble-tip,
.card.term-preview.is-side > .bubble-tip {
    bottom: auto;
    /*left: -10px;
    top: 20px;*/
    left: -4px;
    top: 6px;
    
    transform: rotate(45deg);
    
    z-index: -1;
    /*z-index: 99;*/
    
    /*background: #000;
    border-color: #000;*/
}

.card.deal-preview .spz-badge-small {
    /*line-height: 1.3rem;*/
    line-height: 1.4rem;
}








/* ------------------- DRAG N DROP --------------------- */

.roster-extend-top, 
.roster-extend-bottom {
    display: block;
    width: 100%;
    height: 5px;
    height: 8px;
    cursor: row-resize;
    background: transparent;
    transition: all .2s;
    
    position: absolute;
    left: 0px;
    z-index: 100;
}

.roster-extend-top:hover, 
.roster-extend-bottom:hover {
    background: #000;
    background: rgba(0, 0, 0, .2);
}
    
.roster-extend-top {
    top: 0px;
    
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem;
} 
    
.roster-extend-bottom {
    bottom: 0px;
    
    border-bottom-left-radius: .5rem;
    border-bottom-right-radius: .5rem;
} 

/* ------------------- DRAG N DROP - konec ------------- */






.roster-content .roster-content-col .roster-border-overflow, 
.roster-content-dragger .roster-content-col .roster-border-overflow {
    /*width: calc(100% + 4px);
    display: block;
    height: 1px;
    margin: 4px 0 -6px -.5rem;
    padding: 0;
    
    background-color: transparent;*/
    
    --mx: calc(-.5rem - 1px);
    margin-left: var(--mx);
    margin-right: var(--mx);
} 






.crosshair-v, 
.crosshair-h {
    display: block;
    margin: 0;
    padding: 0;
    background: #00a5ff;
    position: fixed;
    z-index: 100000;
}

.crosshair-v {
    width: 1px;
    height: 100vh;
    top: 0px;
}

.crosshair-h {
    width: 100vw;
    height: 1px;
    left: 0px;
}

.cursor-coords {
    display: block;
    width: 100px;
    height: 50px;
    background: #00a5ff;
    color: #fff;
    position: fixed;
    z-index: 100000;
    padding: 5px 12px;
    font-size: .875rem;
}

.cursor-coords .CC-x, 
.cursor-coords .CC-y {
    font-weight: 600;
}






.roster-crosshair-vt,
.roster-crosshair-vb,
.roster-crosshair-hl,
.roster-crosshair-hr {
    display: block;
    position: fixed;
    z-index: 10000;
    /*background-color: #344767;*/
}

.roster-crosshair-vt,
.roster-crosshair-vb {
    width: 1px;
    height: 45vh;
}

.roster-crosshair-hl,
.roster-crosshair-hr {
    width: 45vw;
    height: 1px;
}

.roster-crosshair-vt {
    left: 50vw;
    top: 0;
    bottom: auto;
}

.roster-crosshair-vb {
    left: 50vw;
    top: auto;
    bottom: 0;
}

.roster-crosshair-hl {
    top: 50vh;
    left: 0;
    right: auto;
}

.roster-crosshair-hr {
    top: 50vh;
    left: auto;
    right: 0;
}










.roster-contextmenu, 
.roster-contextmenu .dropdown-item {
    font-size: .875rem;
}

.roster-contextmenu .card-header {
    border-top-left-radius: .25rem;
    border-top-right-radius: .25rem;
}

.roster-contextmenu .close { 
    font-size: 1.3rem;
}

.deal-memory-toast.md-toast {
    background-image: none !important;
    padding-left: 15px !important;
}

.roster-contextmenu .dropdown-item .fa, 
.roster-contextmenu .dropdown-item .fas, 
.roster-contextmenu .dropdown-item .far, 
.roster-contextmenu .dropdown-item .fal, 
.roster-contextmenu .dropdown-item .fad, 
.roster-contextmenu .dropdown-item .fab {
    /*width: 15px;*/
    width: 1.5rem;
}









.roster-placement-heading.in-calendar {
    /*width: 15rem;*/
    width: auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}





.roster-month-header-col, 
.roster-month-content-col {
    width: 14.285714%;
}

.roster-month-content-col {
    height: 10rem;
    min-width: 8rem;
}





.roster-headers .is-today,
.roster-content .is-today {
    background-color: #f8f9fa;
}




.roster-content .roster-actual-time {
    width: 800px;
    height: 1.8rem;
    position: relative;
    z-index: 120;
    /*position: fixed;
    left: 380px;
    top: 300px;*/
    /*background: skyblue;*/
}

.roster-content .roster-actual-time .RAT-time, 
.roster-content .roster-actual-time .RAT-line {
    display: inline-block;
    vertical-align: top;
}

.roster-content .roster-actual-time .RAT-time {
    content: attr(data-time);
    background: #344767;
    color: #fff;
    font-size: .7rem;
    padding: 0 .25rem;
    width: 3rem;
    height: 1.8rem;
    /*line-height: 1.9rem;*/
    border-radius: .9rem;
    text-align: center;
    font-weight: 600;
}

.roster-content .roster-actual-time .RAT-time .RATT-seconds {
    font-size: 80%;
    margin-top: -.3rem;
    font-weight: 400;
}

.roster-content .roster-actual-time .RAT-line {
    background: #344767;
    width: calc(100% - 3rem);
    height: 1px;
    margin-top: calc(.9rem - 1px);
}





.roster-month-term {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    transition: all .3s;
}

.roster-month-term:hover {
    background-color: rgba(200,200,200,.2);
}

.roster-month-term .roster-month-term-label {
    font-weight: 600;
}

.roster-month-additional {
   font-weight: 700;
}

.roster-month-nempty-add {
    
    color: transparent;
    transition: all .3s;
    font-weight: 500;
}

.roster-month-content-col:hover .roster-month-nempty-add {
    background-color: rgba(200,200,200,.1);
    color: rgba(0,0,0,.2);
}

.roster-month-empty-add {
    display: block;
    color: transparent;
    transition: all .3s;
    font-weight: 500;
}

.roster-month-empty-add:hover {
    background-color: rgba(200,200,200,.1);
    color: rgba(0,0,0,.2);
}






.roster-month-day {
    /*background-color:green;*/
    border-radius: 50%;
    padding: 0 .1rem 0 0;
    width: 1.7rem;
    height: 1.7rem;
    line-height: 1.8rem;
    display: inline-block;
    text-align: center;
    transition: background-color .3s;
}

.roster-month-full-day .roster-month-day {
    padding: 0 .05rem 0 0;
    width: 2.2rem;
    height: 2.2rem;
    line-height: 2.3rem;
}

.roster-month-day:focus,
.roster-month-day:hover,
.roster-month-day:active {
    background-color: rgba(200,200,200,.2);
}

.roster-month-full-day {
    box-shadow: 0 1px 3px 0 rgba(60,64,67,.3), 0 4px 8px 3px rgba(60,64,67,.15);
}

.roster-month-full-day .RMFD-close {
    transition: background-color .3s;
}

.roster-month-full-day .RMFD-close:focus,
.roster-month-full-day .RMFD-close:hover,
.roster-month-full-day .RMFD-close:active {
    /*background-color: rgba(0, 0, 0, 0.03);*/
    background-color: rgba(200,200,200,.2);
}




.calendar-switch .dropdown-toggle::after {
    position: relative;
    top: -2px;
}









.roster-headers tr:first-of-type .is-today::after {
    content: attr(data-today-label);
    font-size: 10px;
    color: var(--vz-body-color);
    opacity: .25;
    float: right;
}

.tooltip.show .term-tooltip {
    text-align: left !important;
}






.calendar-crosshair-switch .form-check {
    padding-left: 0;
}

.calendar-crosshair-switch input[type="checkbox"] {
    display: none;
}

.calendar-crosshair-switch input[type="checkbox"] ~ label {
    padding: .63rem;
}

.calendar-crosshair-switch input[type="checkbox"]:checked ~ label {
    --vz-btn-bg: rgba(53, 119, 241, 0.1);
    background-color: var(--vz-btn-bg);
}