@import url("definitions.css");


:root {
    --bs-dark-gray: #303030;
    --primary-icon-color: var(--bs-blue-link-hover);
    --table-default-color: #eff7ff;
    --bs-body-color: var(--bs-dark-grey);
    --bs-form-border-color: #D7DBFF;
    --table-todays-day-color: #C8EED7;
    --table-weekend-day-color: #f1f1f1;
}

.pagination {
  --bs-pagination-active-color: var(--bs-white);
  --bs-pagination-active-bg: var(--bs-blue);
  --bs-pagination-active-border-color: var(--bs-blue);
}

a {
    color: var(--bs-blue-link-hover);
}

a:hover {
    color: var(--bs-blue);
    --primary-icon-color: var(--bs-blue);
}

.btn:hover svg,
.btn:focus svg {
  filter: brightness(0) saturate(100%) invert(99%) sepia(0%) saturate(936%) hue-rotate(167deg) brightness(117%) contrast(100%);
}

#main-wrapper[data-layout=vertical][data-header-position=fixed] .body-wrapper > .container-fluid, #main-wrapper[data-layout=vertical][data-header-position=fixed] .body-wrapper > .container-sm, #main-wrapper[data-layout=vertical][data-header-position=fixed] .body-wrapper > .container-md, #main-wrapper[data-layout=vertical][data-header-position=fixed] .body-wrapper > .container-lg, #main-wrapper[data-layout=vertical][data-header-position=fixed] .body-wrapper > .container-xl, #main-wrapper[data-layout=vertical][data-header-position=fixed] .body-wrapper > .container-xxl {
    padding: var(--bs-mar-pad-3);
}


/* NAVIGATION VARS */

.nav {
    --bs-nav-link-font-size: 0.9rem;
    --bs-nav-link-padding-x: 1rem;
    --bs-nav-link-padding-y: 0.5rem;
}

.nav-link {
    --bs-nav-link-padding-x: 0.7rem;
    --bs-nav-link-padding-y: 0.7rem;
    border-radius: var(--bs-border-radius-lg);
    display: block;
    padding: var(--bs-nav-link-padding-y) var();
}

.left-sidebar .scroll-sidebar {
    padding: 0 0 0 24px;
}




.navbar {
    border-radius: var(--bs-border-radius-lg);
    padding: var(--bs-mar-pad-3)  var(--bs-mar-pad-3);
    background-color: var(--bs-white)!important;
}



.text-blue {
    color: var(--bs-blue);
}

.bg-blue {
    background-color: var(--bs-blue);
}

/* ARES DESIGN ADDON */

.logo a {
    color: var(--bs-dark-gray);
}

.monthsBtn {
    border-radius: var(--bs-border-radius-lg);
    padding: var(--bs-mar-pad-3)  var(--bs-mar-pad-3);
    color: var(--bs-white);
    background-color: var(--bs-blue); 
    min-height: 100%;
}

.employeesBtn {
    border-radius: var(--bs-border-radius-lg);
    padding: var(--bs-mar-pad-2)  var(--bs-mar-pad-3);
    color: var(--bs-white);
    background-color: var(--bs-blue); 
    min-height: 100%;
}

.form-check-input:checked {
  background-color: var(--bs-green);
  border-color: var(--bs-green);
}

.verticaltext {
    
    text-align: left;
    vertical-align: middle;
    left: calc(50% - .5rem);
    line-height: 1;
    padding-top: .5rem;
    position: relative;
    text-orientation: sideways;
    transform: rotate(180deg);
    white-space: nowrap;
    writing-mode: vertical-rl;
    min-height: 11%;
}



.table tr td.extra-px, .table tr th.extra-px {
    padding-left: 3rem;
    padding-right: 3rem;
}

table.dataTable thead th.centerAlign, table.dataTable thead td.centerAlign, table.dataTable tfoot th.centerAlign, table.dataTable tfoot td.centerAlign {
  text-align: center;
}

.titleBar {
    color: var(--bs-blue);
    padding: var(--bs-mar-pad-3) var(--bs-mar-pad-3);
}

.titleBar h1 {
    color: var(--bs-blue);
}





















/* GLOBAL STYLES */

/*.mw-100 {
    max-width: 100% !important;
}*/

.mw-90 {
    max-width: 98% !important;
}

.text-gray-200 {
    color: var(--bs-gray-200);
}

.text-gray-300 {
    color: var(--bs-gray-300);
}

.text-gray-350 {
    color: var(--bs-gray-350);
}

/*.text-gray-400 {
    color: var(--bs-gray-400);
}*/

.text-dark {
    color: var(--bs-dark-gray);
}

.form-check-input {
   border: 1.25px solid #c4cfdd;
}

/* NAV BREDCRUMBS ICON */

/*
.text-logo-color {
    color: #ff6161;
}
*/

/* .tab-content {
    background-color: var(--bs-white);
} */

.text-secondary {
  color: var(--bs-blue)!important;
}

.form-check-input.secondary:checked {
  background-color: var(--bs-blue);
  border: var(--bs-blue);
}

.form-check-input.primary:checked {
  background-color: var(--bs-blue);
  border: var(--bs-blue);
}

/* FILTER PANNEL */


.filterTab {
    background-color: var(--bs-blue);
    padding:8px 20px!important;
    color: #FFF;
    border-bottom-left-radius: 10px!important;
    border-bottom-right-radius: 10px!important;
    margin-right: 20px;
    border: 1px solid var(--bs-form-border-color)!important;
}

.filterTab.active {
    background-color: #FFF!important;
    color: #5A6A85!important;
    font-weight: 600;
    border: 1px solid var(--bs-form-border-color);
}

.filterPanel {
    padding: var(--bs-mar-pad-3);
    background: var(--bs-blue);
    border-radius: var(--bs-border-radius-lg);
    margin-right: -20px;
}

.filterPanel .card-label {
    color:var(--bs-white);
}

.filterPanel .tab-content {
    background: transparent;
}

.filterPanel a.nav-link {
    padding:8px 20px!important;
    border-radius: 7px!important;
}

.tabIcons .nav-tabs {
  --bs-nav-tabs-link-active-color: #fff;
  --bs-nav-tabs-link-active-bg: var(--bs-blue);
}

.tabIcons .nav-link {
    --bs-nav-link-padding-x: 0.7rem;
    --bs-nav-link-padding-y: 0.4rem;
    border-radius: var(--bs-border-radius-lg);
    display: block;
    padding: var(--bs-nav-link-padding-y);
}

.tabIcons .nav-tabs .nav-link {
    border: 1px solid var(--bs-light-gray)!important;
}

.tabIcons .nav-tabs, .nav-tabs .nav-link {
  border-radius: var(--bs-border-radius);
}

.tabIcons .nav-tabs .nav-link:hover, .nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
    --bs-nav-link-color: var(--bs-blue);
  --bs-nav-link-hover-color: var(--bs-white);
    background-color: var(--bs-blue-link-hover);
    border: 1px solid var(--bs-blue);
}

.nav-tabs .nav-link.active {
    background-color: var(--bs-blue)!important;
    border: 1px solid var(--bs-blue)!important;
}

.shortText {
    display:inherit;
}

/* .text-nowrap {
    white-space:normal!important;
} */

.cardElement {
    padding: var(--bs-mar-pad-3) var(--bs-mar-pad-3);
    border-bottom: 1px solid var(--bs-blue-light);
    /*border: 1px solid green;*/
   /* align-items: center !important;*/
}

.cardElement ul {
    margin:0;
    padding: 0;
}

.cardElementForm {
    padding: var(--bs-mar-pad-3) var(--bs-mar-pad-3);
    border-bottom: 0;
}

.cardElement:last-child, .cardElement.no-bottom-border {
    border-bottom: none;
}

.card-element-submit-button {
    padding:0!important;
}

.cardElement.additional-data {
    border-bottom-left-radius: var(--bs-border-radius-lg)!important;
    border-bottom-right-radius: var(--bs-border-radius-lg)!important;
    background-color: #cbcde6;
}

.cardElement .cardElement {
  padding-top: var(--bs-mar-pad-2)!important;
  padding-bottom: var(--bs-mar-pad-2)!important;
}

.card-label {
    color: var(--bs-blue);

    font-weight: 400;
}

.card {
    box-shadow: var(--bs-box-shadow-sm);
    border-radius: var(--bs-border-radius-lg);
}

.card.no-margin {
    margin: 0;
}

.card .card-body.no-padding {
    padding: 0;
}

.card .card .card-body {
    flex: 1 1 auto;
    padding: var(--bs-mar-pad-0) var(--bs-mar-pad-2);
    color: var(--bs-card-color);
  }

.card .card {
    box-shadow: var(--bs-box-shadow-card-nested)!important;
    margin-bottom: var(--bs-mar-pad-3);
}

.alert {
    --bs-alert-padding-x: 0.7rem;
    --bs-alert-padding-y: 0.7rem;
    --bs-alert-margin-bottom: 1rem;
    padding: var(--bs-alert-padding-y) var(--bs-alert-padding-x);
    margin-bottom: var(--bs-alert-margin-bottom);
}

table.dataTable thead > tr > th.sorting::before, table.dataTable thead > tr > th.sorting::after, table.dataTable thead > tr > th.sorting_asc::before, table.dataTable thead > tr > th.sorting_asc::after, table.dataTable thead > tr > th.sorting_desc::before, table.dataTable thead > tr > th.sorting_desc::after, table.dataTable thead > tr > th.sorting_asc_disabled::before, table.dataTable thead > tr > th.sorting_asc_disabled::after, table.dataTable thead > tr > th.sorting_desc_disabled::before, table.dataTable thead > tr > th.sorting_desc_disabled::after, table.dataTable thead > tr > td.sorting::before, table.dataTable thead > tr > td.sorting::after, table.dataTable thead > tr > td.sorting_asc::before, table.dataTable thead > tr > td.sorting_asc::after, table.dataTable thead > tr > td.sorting_desc::before, table.dataTable thead > tr > td.sorting_desc::after, table.dataTable thead > tr > td.sorting_asc_disabled::before, table.dataTable thead > tr > td.sorting_asc_disabled::after, table.dataTable thead > tr > td.sorting_desc_disabled::before, table.dataTable thead > tr > td.sorting_desc_disabled::after {
  position: absolute;
  display: block;
  opacity: .125;
  right: 5px;
  line-height: 13px;
  font-size: .7em;
}

/* BOX VIEW */
.box {
    height: 100%;
}

.row.display-flex {
    display: flex;
    flex-wrap: wrap;
}

.cursor-pointer {
    cursor: pointer;
}


/* SIDEBAR */


.dropdown-menu-center {width:200px; left:50%; margin-left:-100px;}
    #main-wrapper[data-layout="vertical"] .app-header.fixed-header .navbar {
    background: none;
    padding: 0px;
    border-radius: 0px;
    box-shadow: none;
    margin-top: 0px;
}

.progress-bar {
    --bs-progress-bar-bg: var(--bs-blue);
    --bs-progress-bar-color: var(--bs-white);
  }


/* BUTTONS */

.dt-buttons, .dataTables_filter, .dataTables_paginate, .dataTables_info, .dataTables_length {
    padding: var(--bs-mar-pad-3) var(--bs-mar-pad-3);
    padding-bottom: var(--bs-mar-pad-1);
}

.dt-buttons {
    float: left;
}


.dataTables_filter, .dataTables_paginate, .dataTables_length {
    margin: 0px!important;
}

.offcanvasCloseBtn {
    position: absolute;
    top:0;
    right: 0;
    padding: 30px;
}

/*.welcomeIcons img {
    width: 80px;
    height: 80px;
    margin-right: -15px;
}*/

/*img.textIcon {
    width: 33px;
    height: 33px;
    margin-right: 15px;
    margin-top: -7px;
}*/


/* FORM STYLES*/

label  {
    max-width:100%; 
}

.form-floating > label {
    padding: 0.8rem 16px;
    margin-bottom: 0px;
}

.select2-container--classic .select2-selection--single, .select2-container--default .select2-selection--single, .select2-container--default .select2-selection--single .select2-selection__rendered, .select2-container--default .select2-selection--single .select2-selection__arrow, .select2-container--classic .select2-selection--single .select2-selection__arrow, .select2-container--classic .select2-selection--single .select2-selection__rendered {
    height: 38px;
    line-height: 38px;
}

.select2-container--default .select2-selection--single, .select2-container--default .select2-selection--multiple {
    border:  1px solid var(--bs-form-border-color);
    border-radius: 7px;
    padding-left: var(--bs-mar-pad-1);
}

.select2-container .select2-search--inline .select2-search__field {
    margin-top: 9px;
    padding-left: var(--bs-mar-pad-1);
    height: 28px;
    font-family: var(--bs-font-sans-serif);
}

.form-control::file-selector-button {
    height: 45px;
}

.form-control, .form-select, .form-control-sm, .form-select-sm {
    font-size: 0.95rem;
    line-height: 1.5;
    border: 1px solid var(--bs-form-border-color);
    background-color: var(--bs-white);
}

.form-control-sm, .form-select-sm {
    padding: 8px 38px 8px 16px;
}

/* TABLES */
.table > :not(caption) > * > * {
    padding: 10px 14px;
}

.table.small-p > :not(caption) > * > * {
    padding: 10px 20px;
}

.table.text-primary-header tr th {
    color: var(--bs-blue);
}

.table tr th {
    color: var(--bs-dark-gray);
}

.table-striped > tbody > tr:nth-of-type(odd) > td {
    --bs-table-color-type: var(--bs-table-striped-color);
    
}

table tbody tr:nth-child(even):hover td, table tbody tr:nth-child(odd):hover td {
    --bs-table-color-type: var(--bs-table-striped-color);
    --bs-table-bg-type: var(--table-todays-day-color);
}

.table-striped tbody tr:nth-child(even):hover td, .table-striped tbody tr:nth-child(odd):hover td {
    --bs-table-color-type: var(--bs-table-striped-color);
    --bs-table-bg-type: var(--table-todays-day-color);
}

table tbody tr td a {
    font-weight: 600;
}


table.defaultTable tbody tr td, table.defaultTableBills tbody tr td {
    vertical-align: middle;
    font-size: 1rem;
}

/* .table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-color-type: var(--bs-table-striped-color);
    --bs-table-bg-type: var(--bs-table-striped-bg);
}

.table-striped-columns > :not(caption) > tr > :nth-child(even) {
    --bs-table-color-type: var(--table-default-color);
    --bs-table-bg-type: var(--bs-table-striped-bg);
}

tr.table-default-color > td {
    background-color: var(--table-default-color);
} */

table.dataTable.table-striped > tbody > tr.odd > * {
    box-shadow: inset 0 0 0 9999px rgba(239, 247, 255, 1);
}

.table {
    margin-bottom: 0;
}

/* TABLE COLOR PALLETE START */
/* TABLE COLOR PALLETE START */
/* TABLE COLOR PALLETE START */
/* TABLE COLOR PALLETE START */
/* TABLE COLOR PALLETE START */

.table tr th.todays-day, .table tr td.todays-day {
    background-color: var(--table-todays-day-color);
}

.table tr th.weekend-day, .table tr td.weekend-day {
    background: rgba(234, 239, 244, 0.5);
}

.table-striped > tbody > tr:nth-of-type(odd) > td.todays-day {
    --bs-table-color-type: var(--bs-table-striped-color);
    --bs-table-bg-type: var(--table-todays-day-color);
}

.table-striped > tbody > tr:nth-of-type(odd) > td.weekend-day {
    --bs-table-color-type: var(--bs-table-striped-color);
    background: rgba(234, 239, 244, 0.7);
}

/* TABLE COLOR PALLETE END */
/* TABLE COLOR PALLETE END */
/* TABLE COLOR PALLETE END */
/* TABLE COLOR PALLETE END */
/* TABLE COLOR PALLETE END */
/* TABLE COLOR PALLETE END */

.select2-dropdown, .select2-search, .select2-search, .select2-search--dropdown {
    z-index: 99001;
  }

.fixedWidth60 {
    width: 60px;
}

.icon-default {
    width: 1.2rem;
    height: 1.2rem;
}

.icon-add-icon {
    width: 1.3rem;
    height: 1.3rem;
}

.icon-small {
    width: 1.0rem;
    height: 1.0rem;
}

.icon-large {
    width: 3.5rem;
    height: 3.5rem;
}

.iconBlank {
    margin-right:13px;
}

.icon-arrows {
    width: 1.1rem;
    height: 1.3rem;
}

.icon-arrows-small {
    width: 0.40rem;
    height: 1.2rem;
}

.icon-medium {
    width: 1.5rem;
    height: 1.5rem;
}

.icon-titlebar {
    width: 30px;
    height: 30px;
}

.icon-color-sidebar {
    --primary-icon-color: var(--bs-blue);
}

.icon-color-dark {
    --primary-icon-color: var(--bs-dark-gray);
}

.icon-color-white {
    --primary-icon-color: var(--bs-white);
}

.icon-color-danger {
    --primary-icon-color: #DD5252;
}

.icon-color-success {
    --primary-icon-color: #288761;
}

/* OFFCANVAS PANNEL */

.offcanvas-body {
    padding: 35px;
}

.scrollCont{
    height: calc(100vh - 100px);
    overflow: auto;
}

.offcanvas, .offcanvas-xxl, .offcanvas-xl, .offcanvas-lg, .offcanvas-md, .offcanvas-sm {
    --bs-offcanvas-width: 800px;
}

.offcanvasTab {
    padding:8px 20px!important;
    border-bottom-left-radius: 0px!important;
    border-bottom-right-radius: 0px!important;
}


/* CALENDAR NEW */

.calendarTable{
    border: 1px solid #ebf1f6!important;
    margin-top: 10px;
    margin-bottom: 60px;
}

#weekHeader {
    height: 2%;  
}

#monthHeader{
    height: 2%;  
}

.headerDay {
    width: calc(100vw / 7);
}

.tableDay{
    border: 1px solid #ebf1f6!important;
}

.numberDay {
    text-align: right;
    padding-bottom: 10px;
}

a.calenderEvent, a.calenderEventTrainings, a.calenderEventIndividual {
    display: block;
    color:  var(--bs-blue);
    background-color: #ecf2ff;
    border:1px solid var(--bs-blue);
    border-radius: 7px;
}

a.calenderEvent:hover {
    color: #ecf2ff;
    background-color: var(--bs-blue);
}

/*.eventDay{
    border: 1px solid  #FF0004 !important;
}*/

/*a.calenderEventTrainings {
    border: 0;
}*/

a.calenderEventIndividual {
    color:  #3f73ff;
    background-color: #bdd2ff;
    border:1px solid #3f73ff;
}

a.calenderEventTrainings:hover {
    background-color: #e4ebfa;
}

.form-control-invoices {
    border-color: #49beff;
}

/* PAGGINATION */
.pagination {
  --bs-pagination-active-bg: var(--bs-blue);
  --bs-pagination-active-border-color: var(--bs-blue);
}





/* AJAX STUFF */
#spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 3.5rem;
    height: 3.5rem;
}

#backdrop {
    position:fixed;
    top:0;
    width: 100vw;
    height: 100vh;
    z-index: 999;
    background-color: rgb(0,0,0,0.2);
    display: none;
}

.table-info {
    --bs-table-bg: transparent;
}


.show {
    display: block !important;
}

select, .select2-container { 
    display: block;
    width: 100% !important;
}

.seq-num-text {
    width: 60px;
}

.dropdown-toggle {
    padding-top: 9px;
    padding-bottom: 8px;
}


.todays-day {
    background-color: var(--table-todays-day-color);
}

.modal {
    --bs-modal-padding: 0rem;
}

.select-w-200 {
    width: 200px;
}






/* Add media queries for smaller screens */

@media screen and (max-width: 290px) {
    .weekdays li, .days li {
        width: 12.2%;
    }
}

@media screen and (max-width: 420px) {
    .weekdays li, .days li {
        width: 12.5%;
    }
    .days li .active {
        padding: 2px;
    }
}

@media screen and (max-width:720px) {
    .weekdays li, .days li {width: 13.1%;}
    .form-floating {
        margin-bottom: 10px;
    }
    
    .breadcrumb {
        margin-bottom: 20px;
    }
    
    .filterPanel a.nav-link {
        padding:4px 10px!important;
        margin-bottom: 20px;
    }
    
    .opomin {
        margin: 10px 0px 20px 0px;;
    }
    
    .offcanvas-body {
        padding: 20px 10px 10px 10px;
    }
    
    .offcanvasCloseBtn {
        padding: 20px 20px 10px 10px;
    }
    
    .infoBtn {
        position: inherit;
        top: inherit;
        right: inherit;
        padding: 0px;
        margin-top: 30px;
        text-align: center;
    }
    
    .tab-content .p-5 {
        padding:2.5rem!important
    }
    
    .shortText {
       display:none;
    }
    
  .navbar-collapse {
    border-top: none;
    padding: 30px 15px 15px 15px;
  }
}

@media (min-width: 992px) {
    #main-wrapper[data-layout=vertical][data-header-position=fixed] .app-header {
        width: calc(99% - 270px);
    }

    #main-wrapper[data-layout=vertical][data-sidebartype=full] .body-wrapper {
        margin-left: auto;
    }
    #main-wrapper[data-layout=vertical][data-sidebartype=mini-sidebar] .body-wrapper {
        margin-left: auto;
    }
}

@media print {
    /* All your print styles go here */
    .print {
      display: none !important;
    }
    a .icon-default {

        display: none!important;
      }
      @page {
        size: A4 landscape;
        margin: 0.5cm;
      }

      body {
        margin: 0;
      }

      .dataTables_filter, .dataTables_info {
        display: none!important;
    }
  }