﻿@font-face {
    font-family: 'Outfit';
    src: url('../fonts/Outfit-VariableFont_wght.ttf') format('truetype');
}

.divpanelmenu {
    height:100%;
    vertical-align:top;
    position:relative;
}

.divpanelmenucontent {
    vertical-align:top;
    position:relative;
}

@media (min-width:992px){
    .divpanelmenu {
        min-width:300px;
        width:300px;
    }

    .divclosepanel {
        display:none;
    }
    /*.divpanelmenucontent {
        vertical-align:top;
        position:relative;
    }*/
}

@media (max-width:992px){
    .divpanelmenu {
        width:100% !important;
        display:none;
    }

    .divclosepanel {
        display:inherit;
    }

    .btn-toggle-nav a {
      font-size:1.05rem;
      padding:0.5rem !important;
    }

    .nav-menu {
        font-size:1.25rem !important;        
    }
}

.BreadCrumbs {
    overflow:auto;
}

.ItemsBreadCrumbs {
    white-space:nowrap;
}

.table.headerfitwidth th {
    white-space:nowrap;
}

table.dataTable thead th, table.dataTable thead td{
    border: 0px solid #FFF !important;
}

.dataTables_wrapper {
    overflow: auto !important;
}

table.dataTable.no-footer {
    border-bottom: 1px solid inherit !important;
}

select.fixed {
    width:auto !important;
}

.required {
    color: red !important;
}

.ui-table-cell-label,
[custom-data-role="popup"] {
    display:none;
}

.menu-description {
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    height: 39px;
    cursor:pointer;
}

.nav-link {
    outline:none !important;
}

.divTable {
    display: table;
    width: 100%;
    table-layout: fixed;
    height: 100%;
}

.divTableRow {
    display: table-row;
}

.divTableCell {
    display: table-cell;
    box-sizing: border-box;
    padding: 3px;
    word-wrap: break-word;
}

.bg-success.darker,
.btn-success.darker{
    background-color: #208236 !important;
}

.btn-success.darker:hover,
.btn-success.darker.active{
    background-color: #186329 !important;
}

.bg-dark.darker,
.btn-dark.darker{
    background-color: #2c3136 !important;
}

.btn-dark.darker:hover,
.btn-dark.darker.active{
    background-color: #1f2326 !important;
}

.border-dark.darker {
    border-color: #1f2326 !important;
}

.editmodeinputtext,
.staticmodeinputtext,
.editmodetextarea,
.staticmodetextarea {
    visibility: visible;
    display: block;
}

.staticeditmodeinputtext,
.staticeditmodetextarea
{
    visibility: hidden;
    display: none;   
}

.dashboardGrid {
    min-height:150px;
    color: var(--bs-gray-dark)
}

.dashboardGrid:hover > div.bi {
    color: var(--bs-primary)
}

.dashboardGrid:hover {
    cursor: pointer;
    box-shadow: 0 0.5rem 1rem rgb(0 0 0 / 15%) !important;
    color: #0d6efd !important;
    border-color: #CCC !important;
}

.dashboardGrid > .gHeader {
    font-weight: bold;
    margin-bottom:0.5rem;
    text-align:center;
    display: -webkit-box; 
    -webkit-line-clamp: 2; 
    -webkit-box-orient: vertical; 
    height: 50px; 
    overflow: hidden; 
    text-overflow: ellipsis;
}

.dashboardGrid > .gBody {
    text-align:center;
    font-size: 20px;
}

.dashboardGrid > .gFooter {
    text-align:center;
    font-size: 20px;
}

#tblBrowsePopup_length {
    margin: 0 0 10px 0;
}

.txt-left,
.txt-left th
{
    text-align:left;   
}

.txt-right,
.txt-right th
{
    text-align:right;   
}

.txt-center,
.txt-center th,
.txt-center td
{
    text-align:center;   
}

.txt-justify
{
    text-align: justify;   
}

.txt-bold{
    font-weight:bold;
}

.module-buttons {
    font-size: 80px;
    color: var(--bg-gray);
}

.hb-navbtn {
    height: 80px;
    word-break: break-word;
}

.clear {
    clear: both;
}

@media (max-width:575px){
    .module-buttons {
        font-size: 40px;
    }

    .dashboardGrid {
        min-height:115px;
    }

    .menu-description,
    .storedetails,
    .hb-navbtn,
    .HotButtonsText {
        font-size: 11px !important;
    }

    .table-fixed td.fixed-col,
    .table-fixed td.fixed-col-right {
        position: unset !important;
    }

    .table-fixed th.fixed-col,
    .table-fixed th.fixed-col-right {
        left: unset !important;
        right: unset !important;
    }
}

.accordion .card-header > button:first-child {
    display:flex;
    align-items:center;
}

.accordion .card-header > button:first-child:after,
.accordion .card-header > div:first-child:after {
    font-family: 'boostrapicon' !important;
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: auto;
    content: "\eb21";
    /*background-image: url(data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e);
    background-repeat: no-repeat;
    background-size: 1.25rem;*/
    transition: transform .2s ease-in-out;
    float:right;
    font-weight:bold;
}

.accordion .card-header > button:first-child:not(.collapsed)::after,
.accordion .card-header > div:first-child:not(.collapsed)::after {
    content: "\eb25";
}

.modal-fullwidth {
    width: 100% !important;
    max-width: inherit !important;
    margin: auto 0.5rem !important;
}

.modal-fullwidth.modal-dialog-centered {
    min-height: calc(100% - 0rem) !important;
}

.shadow-scrollbox {
    overflow: auto;
    background-image:
    /* Shadows */
    linear-gradient(to right, white, white), linear-gradient(to right, white, white),
    /* Shadow covers */
    linear-gradient(to right, rgba(0,0,0,.25), rgba(255,255,255,0)), linear-gradient(to left, rgba(0,0,0,.25), rgba(255,255,255,0));
    background-position: left center, right center, left center, right center;
    background-repeat: no-repeat;
    background-color: white;
    background-size: 20px 100%, 20px 100%, 10px 100%, 10px 100%;
    /* Opera doesn't support this in the shorthand */
    background-attachment: local, local, scroll, scroll;
}

.table-scroll {
    position: relative;
    width: 100%;
    z-index: 1;
    margin: auto;
    overflow: auto;
    max-height: 300px;
}

.table-scroll table {
    width: 100%;
    margin: auto;
    border-collapse: separate;
    border-spacing: 0;
}

.table-scroll thead th {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
}

.table-scroll tfoot,
.table-scroll tfoot th,
.table-scroll tfoot td {
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    z-index: 4;
}

.table-fixed-container {
    display: grid;
    height: 70vh;
    grid-template-rows: 100% 1fr 0px;
}

.table-fixed {
    position: relative;
    overflow: auto;
}

.table-fixed table {
    border-collapse: separate;
    border-spacing: 0;
}

.table-fixed table thead tr,
.table-fixed table tfoot tr {
    position: sticky;
    z-index: 1;
}

.table-fixed th.fixed-col,
.table-fixed th.fixed-col-right {
    position: sticky;
    z-index: 3;
    top: 0;
}

.table-fixed .fixed-col {
    position: sticky;
    z-index: 0;
}

.table-fixed .fixed-col-right {
    /*for first column from right only */
    position: sticky;
    z-index: 0;
    right:0;
}

.textvm-primary {
    color: #55883B;
}

.bgvm-primary {
    background-color: #55883B;
}

.btnvm-primary,
.btnvm-primary:hover {
    color: #FFF;
    background-color: #55883B;
    border-color: #55883B;
}

.btnvm-primary-outline,
.btnvm-primary-outline:hover {
    color: #55883B;
    background-color: #FFF;
    border-color: #55883B;
}

.bordervm-primary {
    border-color: #55883B !important;
}

.btn-xl {
    padding: 1rem 1rem;
    font-size: 1.25rem;
    border-radius: 0.3rem;
}

.bgvm-primary-gradient {
    background: rgb(238,120,4);
    background: linear-gradient(135deg, rgba(238,120,4,1) 0%, rgba(255,199,0,1) 100%);
}

.translate-middle {
    transform: translate(-50%, -50%) !important;
}

.start-100 {
    left: 100% !important;
}

.top-0 {
    top: 0 !important;
}

.border-5 {
    border-width: 5px !important;
}

.gap-3{
    gap: 1rem !important;
}

.rounded-1{
    border-radius: 0.5rem !important;
}

.rounded-2{
    border-radius: 0.75rem !important;
}

.rounded-3{
    border-radius: 1rem !important;
}

.rounded-top-bottom-left-1{
    border-top-left-radius: 0.5rem !important;
    border-bottom-left-radius: 0.5rem !important;
}

.rounded-top-bottom-right-1 {
    border-top-right-radius: 0.5rem !important;
    border-bottom-right-radius: 0.5rem !important;
}