@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700&display=swap');

:root {
	--color-1: #e6ae48;
	--color-2: #4A4A4A;
	--color-3: #e2e2e2;
	--font-1: 'Roboto', Helvetica, Arial, sans-serif;
}
/* width */
::-webkit-scrollbar {
  width: 10px;
}
/* Track */
::-webkit-scrollbar-track {
  background: white;
}
/* Handle */
::-webkit-scrollbar-thumb {
  background: var(--color-1);
  border-radius: 2px;
}
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: var(--color-3);
}
::-moz-selection { /* Code for Firefox */
  color: var(--color-1);
  background: black;
}
::selection {
  color: var(--color-1);
  background: black;
}
body{
  background-color: white;
  font-family: var(--font-1);
  color: black;
}
a{
  color: black;
  text-decoration: none;
}
a:hover{
  color: var(--color-1);
}
header{
  width: 100%;
  color: white;
  text-align: center;
  background-color: black;
}
header .row{
  align-items: center;
  max-width: 900px;
  margin: auto;
}
.menu-btn{
  text-align: center;
  font-size: 20px;
  margin-right: 10px;
  margin-left: 10px;
}
header .logo {
  text-align: left;
}
header .logo img{
  max-width: 100%;
  width: 180px;
  margin: auto;
  padding: 10px;
}

header .icons{
  display: flex;
  justify-content: flex-end;
}



/* The Overlay (background) */
.overlay {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  left: 0;
  top: 0;
  background-color: black;
  overflow-x: hidden;
  transition: 0.5s ease;
}
.overlay-content {
  position: relative;
  padding-top: 80px;
  width: 100%;
  height: 100%;
  text-align: center;
}
.overlay a {
  padding: 5px;
  text-decoration: none;
  font-size: 20px;
  color: white;
  display: block;
  transition: 0.3s;
}
.overlay a:hover, .overlay a:focus {
  color: var(--color-1);
}
.overlay .closebtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 20px;
  color: white;
  z-index: 99;
}
.overlay .designedby{
  color: white;
  font-size: 20px;
  margin: auto;
  position: absolute;
  bottom: 30px;
  left: 50%;
  text-align: center;
  transform: translateX(-50%);
}
.overlay .designedby img{
  display: block;
  width: 150px;
  margin: 10px auto ;
}
@media screen and (max-height: 450px) {
  .overlay a {font-size: 20px}
  .overlay .closebtn {
    font-size: 40px;
    top: 15px;
    right: 35px;
  }
}
.overlay.search-overlay{
  height: 0%;
  width: 100%;
  background-color: white;
}
.search-inner{
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
}
.overlay.search-overlay .closebtn {
  color: black;
}
.search-overlay form{
  width: 90%;
}
.search-overlay input,
.search-overlay input:focus-within,
.search-overlay input:focus{
  outline: none;
  border: none;
  border-bottom: 2px solid black;
  width: 85%;
  color: black;
}
.search-overlay form button{
  background: transparent;
  border: none;
  box-shadow: none;
  outline: none;
  width: 10%;
  font-size: 20px;
}
.index-content{
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
  height: 75vh;
  max-width: 900px;
  margin: auto;
}
.index-content .single-cat{
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: black;
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  text-align: center;
}
.index-content .single-cat img{
  width: 70px;
}
.top-buttons-container{
  background-color: var(--color-1);
}
.top-buttons{
  display: flex;
  max-width: 900px;
  margin: auto;
}
.top-buttons a{
  width: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: black;
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  text-align: center;
  padding: 10px 0;
}
.top-buttons a:first-child{
  border-right: 2px solid black;
}
.page-title{
  text-align: center;
  margin: 0;
  padding: 20px 0;
}
.accordion-item{
  border: none;
  color: black;
}
.accordion-button{
  font-size: 18px;
  font-weight: 500;
}
.accordion-button::after,
.accordion-button:not(.collapsed)::after,
.accordion-button:not(.collapsed){
  color: black;
}
.accordion-button:not(.collapsed){
  background-color: white;
}
.accordion-button:focus,
.accordion-button:focus-visible{
  border: none;
  box-shadow: none;
}
.accordion-button:active::after{
  background-image:  url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='#{$accordion-icon-color}'><path 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'/></svg>");
}
.accordion-body ul{
  list-style: none;
  padding-left: 0;
}
.accordion-body ul li{
  font-weight: 500;
  margin-bottom: 10px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  text-align: right;
}
.accordion-body ul li span{
  font-weight: 400;
  margin-right: 10px;
  text-align: left;
  width: 40%;
}
.accordion-body ul li span.edit{
width: unset;
}
.accordion-body ul li span.apostoli{
  text-align: right;
  margin-right: 0;
}
.accordion-body ul li span.edit a{
  font-weight: 500;
  margin-top: 20px;
}
.list-area{
  max-width: 900px;
  margin: auto;
}
.bottom-pagination{
  width: 100%;
  max-width: 400px;
  padding: 10px 25px;
  margin: 40px auto 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.bottom-pagination a.active{
  background-color: black;
  border-radius: 100%;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  color: white;
}
@media screen and (min-width:768px) {
  .bottom-pagination{
    margin-bottom: 20px;
  }
}
.input-group{
  align-items: center;
}
.input-group .form-label {
  margin-bottom: 0;
  width: 40%;
  padding-left: 10px;
}
.input-group .form-label .form-select{
  padding-left: 0;
  padding-right: 35px;
  border: none;
}
.input-group .form-control:focus,
.input-group .form-label .form-select:focus:focus,
.input-group .form-label .form-select:focus-visible{
  box-shadow: none;
}
.input-group .form-control {
  margin-right: 10px;
  border-radius: 5px;
}
.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback){
  border-radius: 5px;
}
.form-control.extra{
  padding-left: 10px;
  margin-right: 34px;
  border-radius: 5px 0 0 5px !important;
}
.extra-field{
  margin-top: 20px;
  text-align: center;
}
.extra-field:hover{
  cursor: pointer;
}
.remove-field{
  border: none;
  font-size: 20px;
  background-color: black;
  color: var(--color-1);
  height: 38px;
  width: 25px;
  max-width: 25px;
  text-align: center;
  margin-left: 0px;
  position: relative;
  right: 0;
  border-radius: 0 5px 5px 0 !important;
  margin-right: 10px;
  padding: 0;
}
.submit-btn{
  text-align: center;
}
.filter-btn,
.submit-btn input{
  background-color: black;
  color: var(--color-1);
  font-size: 16px;
  font-weight: 500;
  border: none;
  box-shadow: none;
  outline: none;
  padding: 10px 20px;
  border-radius: 5px;
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
}
.submit-btn.cloneit input{
  background-color: #dc3545;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  border: none;
  box-shadow: none;
  outline: none;
  padding: 10px 20px;
  border-radius: 5px;
  margin-top: 20px;
  margin-bottom: 20px;
  text-align: center;
}
.login-form .input-group .form-label{
  width: 100px;
}
@media screen and (min-width:768px) {
  .index-content .single-cat{
    width: 25%;
  }
  .input-group .form-label {
    width: 40%;
  }
}
.input-group .form-control{
  height: 38px;
  line-height: 19px;
  border: 1px solid #ced4da;
  position: relative;
  flex: 1 1 auto;
  width: 1%;
  min-width: 0;
  margin-right: 10px;
  padding: 0.375rem 0.75rem;
}
.input-group .form-control:focus,
.input-group .form-control:focus-visible{
  border-color: #86b7fe;
  outline: none;
}
.input-group textarea.form-control{
  height: 100px;
}
.select2-container--default .select2-selection--single{
  height: 38px;
  border-radius: 5px;
  border-color: #ced4da;
}
.select2-container--default .select2-selection--single .select2-selection__arrow{
  right: 13px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: black transparent transparent transparent;
  margin-left: -10px;
  margin-top: 3px;
  width: 10px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
  color: black;
  line-height: 38px;
}
@media screen and (max-width:330px) {
  .input-group .form-label {
    width: 40%;
  }
}
.filter-btn{
  width: fit-content;
  margin: 0px auto 20px;
}
.filters-overlay{
  height: 0%;
  width: 100%;
  background-color: white;
}
.filters-inner{
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
}
.overlay.filters-overlay .closebtn {
  color: black;
}
.filters-inner form{
  width: 100%;
}
.filters-inner .input-group .form-label {
  width: 150px;
  padding-right: 10px;
}
.filters-inner .input-group .form-control.normal{
  margin-right: 20px;
}
.filters-inner .input-group .form-control.select2-hidden-accessible{
  margin-right: 10px;
}
.filters-inner .datefilter{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.filters-inner .single-datefilter{
  margin-bottom: 10px;
}
#accordionExoda  .accordion-button,
#accordionTransfers .accordion-button{
  display: flex;
  flex-flow: row wrap;
  line-height: 20px;
}
#accordionExoda  .accordion-button span,
#accordionTransfers .accordion-button span{
  text-align: left;
  margin-bottom: 5px;
}
#accordionExoda  .accordion-button b,
#accordionTransfers .accordion-button b{
  margin-left: -15px;
  margin-right: 5px;
  margin-bottom: 5px;
}
#accordionExoda .accordion-button span:not(:last-child),
#accordionTransfers .accordion-button span:not(:last-child){
  margin-right: 20px;
}
#accordionExoda .accordion-button::after,
#accordionTransfers .accordion-button::after{
  position: absolute;
  right: 30px;
  top: 50%;
  transform: translateY(-50%);
}
#accordionExoda .accordion-button span.payment_method,
#accordionTransfers .accordion-button span.payment_method{
  background-color: var(--color-1);
  color: black;
  padding: 5px 15px;
  border-radius: 5px;
  margin-bottom: 0px;
}
#file_attach{
  line-height: 24px;
}
.form-control.extra{
  margin-right: 0;
}
.export-area{
  margin-top: 20px;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}
.export-area div{
  background-color: var(--color-3);
  color: black;
  padding: 5px 30px;
  border-radius: 5px;
  margin: 10px;
  text-align: center;
  display: flex;
  flex-direction: column;
}
.export-area div span{
  font-size: 18px;
}
.export-area div span.excel{
  color: forestgreen;
}
.export-area div span.pdf{
  color: crimson;
}
@media screen and (min-width:768px) {
  .export-area div span {
    margin-left: 10px;
  }
  .export-area div{
    flex-direction: row;
  }
}
#accordionExoda .accordion-button span.exoda_place{
  min-width: 100%;
}
#accordionExoda .accordion-button span.exoda_value{
  color: crimson;
  font-weight: 700;
  margin-left: -10px;
  margin-right: 10px;
}
#accordionExoda .accordion-button span.exoda_value.exoda_value_green{
  color: darkgreen;
}
#add_event{
  position: fixed;
  bottom: 10px;
  right: 10px;
  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 100%;
  background-color: var(--color-1);
  color: black;
  text-align: center;
  font-size: 30px;
  z-index: 2;
  cursor: pointer;
}
#add-event-area{
  width: 0px;
  height: 0px;
  margin: auto;
  background-color: white;
  border-radius: 5px;
  border-bottom-right-radius: 25px;
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 1;
  transition: 0.4s ease;
}
#cross_icon{
  display: none;
}
#add-event-area .list-area{
  overflow-y: scroll;
  max-height: calc(100%-20px);
}
.select2{
  width: 59% !important;
}
@media screen and (max-width:767px) {
  .select2{
    width: 58% !important;
  }
}
@media screen and (max-width:330px) {
  .select2{
    width: 57% !important;
  }
}
.edit-btns{
  width: 100%;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}
.edit-btns .submit-btn input{
  width: 150px;
}
.edit-btns .submit-btn.cancel input{
  background-color: var(--color-1);
  color: black;
}


/* ==================================== */
#filter_partners{
  position: fixed;
  bottom: 10px;
  right: 130px;
  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 100%;
  background-color: var(--color-1);
  color: black;
  text-align: center;
  font-size: 30px;
  z-index: 2;
  cursor: pointer;
}

#filter_clients{
  position: fixed;
  bottom: 10px;
  right: 130px;
  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 100%;
  background-color: var(--color-1);
  color: black;
  text-align: center;
  font-size: 30px;
  z-index: 2;
  cursor: pointer;
}

#sort_event{
  position: fixed;
  bottom: 10px;
  right: 70px;
  width: 50px;
  height: 50px;
  line-height: 50px;
  border-radius: 100%;
  background-color: var(--color-1);
  color: black;
  text-align: center;
  font-size: 30px;
  z-index: 2;
  cursor: pointer;
}

.sort-item { cursor: move; }
.sort-item:before { content:"\205D"; padding-right: 10px; font-weight: bold; color: #999; }


.bottom-pagination { flex-wrap: wrap; }

.bottom-pagination a {
    background-color: #f2f2f2;
    border-radius: 100%;
    min-width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    color: #666;
	margin-right: 5px;
	margin-bottom: 5px;
}
.bottom-pagination a:hover {
    background-color: var(--color-1);
    border-radius: 100%;
    min-width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    color: #000;
	margin-right: 5px;
	margin-bottom: 5px;
}

.bottom-pagination a.active {
    width: unset;
    min-width: 30px;
}


.accordion-body ul li .tralerts { text-align: left; }
.accordion-body ul li .tralerts p.border-bottom { font-weight: 400; }


.accordion-body ul li .trnotes { text-align: left; }
.accordion-body ul li .trnotes p.border-bottom { font-weight: 400; }

.accordion-body.accordion-body-left  ul li { text-align: left; justify-content: flex-start; }
.accordion-body.accordion-body-left  ul li span { min-width: 40%; }

h2.accordion-header.tranhead  { position: relative; }
h2.accordion-header.tranhead input[type=checkbox] { position: absolute; left: 0px; top: calc(50% - 13px); }
h2.accordion-header.tranhead button { padding-left: 5px; margin-left: 20px; }

button.btn-tran-top { width: 35px; }

.text-light2 { color: #d9d9d9; }



.select2-like {
    width: 59% !important;
    flex-grow: 0 !important;
}

@media screen and (max-width:767px) {
	.select2-like {
		width: 58% !important;
		flex-grow: 0 !important;
	}
}


.home-alert-title { cursor: pointer; }

.export-area div { cursor: pointer; }


:root {
  --transfers-color-1: #e9e9e9;
  --transfers-color-2: #f9f9f9;
}



#accordionTransfers .accordion-item { border-bottom: 1px solid #ccc; }

#accordionTransfers .accordion-item h2.accordion-header.tranhead button {
    width: calc(100% - 20px);
}

#accordionTransfers .accordion-item:nth-of-type(even)  { background: var(--transfers-color-2); }
#accordionTransfers .accordion-item:nth-of-type(even) h2 { background: var(--transfers-color-2); }
#accordionTransfers .accordion-item:nth-of-type(even) h2 button.accordion-button { background: var(--transfers-color-2); }

#accordionTransfers .accordion-item:nth-of-type(odd)  { background: var(--transfers-color-1); }
#accordionTransfers .accordion-item:nth-of-type(odd) h2 { background: var(--transfers-color-1); }
#accordionTransfers .accordion-item:nth-of-type(odd) h2 button.accordion-button { background: var(--transfers-color-1); }


#accordionTransfers h2.accordion-header.tranhead input[type=checkbox] {
    position: absolute;
    left: 5px;
    top: calc(50% - 8px);
}

#accordionClients .accordion-item:nth-of-type(even) h2 { background: var(--transfers-color-2); }
#accordionClients .accordion-item:nth-of-type(even) h2 button.accordion-button { background: var(--transfers-color-2); }
#accordionClients .accordion-item { border-bottom: 1px solid #ccc; }

#accordionExoda .accordion-item:nth-of-type(even) h2 { background: var(--transfers-color-2); }
#accordionExoda .accordion-item:nth-of-type(even) h2 button.accordion-button { background: var(--transfers-color-2); }
#accordionExoda .accordion-item { border-bottom: 1px solid #ccc; }



.xdsoft_datetimepicker {
	font-size: 16px !important;
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div >div,
.xdsoft_datetimepicker .xdsoft_calendar td, .xdsoft_datetimepicker .xdsoft_calendar th {
    font-size: 16px;
}
.xdsoft_datetimepicker .xdsoft_label {
    font-size: 16px;
}

.xdsoft_datetimepicker .xdsoft_datepicker {
    width: 300px;
}

.xdsoft_datetimepicker .xdsoft_month {
    width: 122px;
}

.xdsoft_datetimepicker .xdsoft_year {
    width: 64px;
}

body, #add-event-area, .card.my-card-294 { background: #f2f2f2; }


.edit-btns.transfer-edit-btns .submit-btn.cloneit input { width: 240px; }

@media screen and (max-width:767px) {

	.edit-btns.transfer-edit-btns {
		flex-direction: column;
	}

	.edit-btns.transfer-edit-btns .submit-btn { width: 100% !important; }

	.edit-btns.transfer-edit-btns .submit-btn input {
		width: 100% !important;
		margin-top: 10px;
		margin-bottom: 10px;
	}

}


.submit-btn input:focus { outline: #932fe9 3px solid; }


/* 202401 */

span.sum-in { color: darkgreen; }
span.sum-out { color: crimson; }



.cal-block { width: calc(25% - 1px); display: inline-block; padding: 10px; vertical-align: top; }
.cal-block table { width: 100%; background: #fff }
.cal-block table { border-collapse: collapse; }
.cal-block table caption { color: #164279; font-weight: bold; margin-bottom: 4px; }
.cal-block table th { font-weight: bold; }

.cal-block table thead th { border: 1px solid #ddd; text-align: center; background: #333; color: #fff; }
.cal-block table tbody td { border: 1px solid #ddd; text-align: center; }

.cal-block table tbody td.leaves { background: #a50202; color: #fff; cursor: pointer; }
.cal-block table tbody td.daysoff { background: #01508d; color: #fff; cursor: pointer; }
/*.cal-block table tbody td.leaves_daysoff { background: linear-gradient(135deg, #a50202, #01508d); color: #fff; cursor: pointer; }*/
.cal-block table tbody td.leaves_daysoff { background: #cd8107; color: #fff; cursor: pointer; }
.cal-block table tbody td.ldblank { cursor: pointer; }


span.guide-leaves { color: #a50202; }
span.guide-daysoff { color: #01508d; }
span.guide-leaves-daysoff { color: #cd8107; }

.alert-leave {
    color: #fff;
    background-color: #a50202;
    border-color: #a50202;
    padding: 0.5rem;
}

.alert-dayoff {
    color: #fff;
    background-color: #01508d;
    border-color: #01508d;
    padding: 0.5rem;
}

.alert-leave.alert-dismissible .btn-close, .alert-dayoff.alert-dismissible .btn-close { padding: 0.8rem; }



button.modal-add-leave, button.modal-add-dayoff { width: 48%; margin-left: 1%; margin-right: 1%; }

button.modal-add-leave {
    color: #fff;
    background-color: #a50202;
    border-color: #a50202;
}

button.modal-add-leave:hover, button.modal-add-leave:focus, button.modal-add-leave.focus {
    color: #fff;
    background-color: #d10404;
    border-color: #a50202;
}


button.modal-add-dayoff {
    color: #fff;
    background-color: #01508d;
    border-color: #01508d;
}

button.modal-add-dayoff:hover, button.modal-add-dayoff:focus, button.modal-add-dayoff.focus {
    color: #fff;
    background-color: #0679d1;
    border-color: #01508d;
}



.cal-form .select2{
  width: 100% !important;
}