﻿/* PdfViewer */
@import url("pdfviewer.css");

#pdfContainer {
    height: 100%;
    max-height: 100%;
    overflow: hidden;
}

/* Modal */
.modal-dialog { 
    z-index: 101;
}


/* Editor */
.btn-nav-edit {
    padding-top: 5px;
    padding-left: 7px;
    padding-right: 7px;
    right: 43px;
    top: 6px;
    z-index: 1;
}
.btn-nav-delete {
    padding-top: 5px;
    padding-left: 7px;
    padding-right: 7px;
    right: 5px;
    top: 6px;
    z-index: 1;
}

/* Widgets */
.grid-stack {
    margin-bottom: 60px;
}

.grid-stack > .grid-stack-item > .grid-stack-item-content {
    overflow: hidden !important;
}

.grid-stack > .grid-stack-item > .grid-stack-item-content > .card > .card-body {
    overflow-y: auto;
    padding-bottom: 0px;
}

/* Query Grid */
.query-grid table {
    table-layout: fixed;
    /*width: unset;*/
}

.query-grid {
    height: 100%;
    max-height: 100%;
    overflow: hidden;
}

    .query-grid .query-grid-container {
        height:     calc(100% - var(--querygrid-navbar-top-height) - var(--querygrid-navbar-bottom-height) );
        max-height: calc(100% - var(--querygrid-navbar-top-height) - var(--querygrid-navbar-bottom-height) );
        overflow-x: hidden;
        overflow-y: scroll;
    }

    /* 
        CSS3 :has selector         
        https://developer.mozilla.org/en-US/docs/Web/CSS/:has
        If there is a navbar inside cardview, add its height to the querygrid height calculation 
     */
    .query-grid:has(.navbar-card) .query-grid-container.query-card {
        height:     calc(100%
        - var(--querygrid-navbar-top-height)        
        - var(--querygrid-navbar-card-top-height-nowrap)
        - var(--querygrid-navbar-card-top-padding-bottom)
        - var(--querygrid-navbar-card-top-border-top)
        - var(--querygrid-navbar-card-top-border-bottom)
        - var(--querygrid-navbar-bottom-height) );

        max-height: calc(100%
        - var(--querygrid-navbar-top-height)        
        - var(--querygrid-navbar-card-top-height-nowrap)
        - var(--querygrid-navbar-card-top-padding-bottom)
        - var(--querygrid-navbar-card-top-border-top)
        - var(--querygrid-navbar-card-top-border-bottom)
        - var(--querygrid-navbar-bottom-height) );
    }   

.query-grid div.navbar.navbar-card th {
    border-bottom: none;
}

.query-grid div.navbar.navbar-card th.sorting_desc, .query-grid div.navbar.navbar-card th.sorting_asc {
    font-weight: 700;
}

.query-grid.query-grid-modal .query-grid-container {
    height: calc(100% - 96px);
    max-height: calc(100% - 96px);
    overflow-x: hidden;
    overflow-y: scroll;
}

.query-grid .query-grid-container.card {
    overflow-y: auto;
    /*height: 100%;*/
}

.query-grid table.table-scrollable thead tr th {
    z-index: 1;
    background-color: white;
}

.query-grid .query-grid-container.query-grid-pager-hidden {
    height: calc(100% - 20px);
    max-height: calc(100% - 20px);
}

.query-grid .dataTables_scroll
{
    height: 100%;
}

.query-grid .dataTables_scrollHead {
    overflow: hidden;
    position: relative;
    border: 0px;
    width: 100%;
    height: 100%;
}

.query-grid .dataTables_scrollHeadInner {
    box-sizing: content-box;
    width: 100%;
    padding-right: 0px;
    overflow: hidden;
}

.query-grid .dataTables_scrollBody {
    position: relative;
    overflow: auto;
    height: calc(100% - 44px);
    max-height: calc(100% - 44px)
}

.query-grid .dataTables_scrollBody_nopager {
    position: relative;
    overflow: auto;
    height: calc(100% - 104px);
    max-height: calc(100% - 104px)
}

.query-grid .dataTable thead .sorting {
    padding-right: 1.25rem;
}

/* Date Range Picker */
.daterangepicker .applyBtn.hide {
    display: none;
}

.daterangepicker .cancelBtn.hide {
    margin-top: 0px !important;
}

/* Time Picker */
input.mobiess--time--picker:read-only {
    background-color: white !important;
}

/* Draggable */
/*add this to avoid flickering*/
.plk-dd-inprogess > * {
    pointer-events: none;
}

/*dropzone style style*/
.plk-dd-dropzone {
    min-height: 20px;
    min-width: 200px;
}

/*drag drop styles*/

.plk-dd-spacing {
    height: 1px;
}

.plk-dd-spacing-dragged-over {
    padding: 1px;
}

.plk-dd-dragged-over {
    background-color: lightgray;
    opacity: 0.6;
    /*animation: blinker 1s linear infinite;*/
}

    .plk-dd-dragged-over > div {
        background-color: lightgray;
        opacity: 0.6;
        animation: blinker 1s linear infinite;
    }

.plk-dd-dragged-over-denied {
    background-color: red;
    opacity: 0.6;
    /*animation: blinker 1s linear infinite;*/
}

.plk-dd-in-transit {
    opacity: 0.4;
}

    .plk-dd-in-transit > div {
        opacity: 0.4;
    }

@keyframes blinker {
    50% {
        opacity: 0;
    }
}

.blink_me {
    animation: blinker 1s linear infinite;
}

li.nav-item.can-drop {
    background-color: lightgreen;
    opacity: 0.6;
    animation: blinker 1s linear infinite;
    cursor: grabbing;
}

li.nav-item.cannot-drop {
    background-color: lightcoral;
    opacity: 0.6;
    cursor: grabbing;
}

.icomoon {
    font-family: 'icomoon' !important;
    font-size: 32px;
    font-weight: normal;
}

.icomoon.small {
    font-size: 13px;
}

.icomoon.large {
    font-size: 3.4rem;
}