/*
* {
  border: 1px solid #111;
}
*/

.ui-autocomplete {
    z-index:2000;}

html {
  position: relative;
  min-height: 100%;
}

body {
    padding-top: 66px;
    margin-bottom: 35px;
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  min-height: 35px;
  background-color: #f8f9fa;
  border-top: 1px solid #e7e7e7;
}

.footer a {
    color: #959595;
}

.footer-copyright {
    color: #959595;
    line-height: 35px;
    min-height: 35px;
}

.footer-links {
    color: #959595;
    line-height: 35px;
    min-height: 35px;
    text-align: right;
}

.form-label {
    color: #959595;
}

.legend-circle {
      width: 20px;
      height: 20px;
      border-radius: 10px;
      margin: 5px;
      float: left;
    }

.legend-free {
    background: #8DC63F;
}

.legend-full {
    background: #CB2439;
}

.legend-reserved {
    background: #00BCE4;
}

.legend-text{
    color: #939393;
}

#caption-car-id{
    color: #939393;
    text-align: right;
}

.input-group-btn-light{
    border-color:#cdd4da;
}

.accordion-button-iconless::after {
  display: none !important;
}

.accordion-button-left::before {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 1rem;
    content: "";
    background-image: var(--bs-accordion-btn-active-icon);
    background-repeat: no-repeat;
    background-size: 1.25rem;
    transition: None;
}

.accordion-button:not(.collapsed)::before{
    background-image:var(--bs-accordion-btn-active-icon);
    transform:var(--bs-accordion-btn-icon-transform)
}

.accordion-button-left::after {
    display: none !important;
}

/* =================================
     Gradients
   =================================*/

.gradient-purple{
    background: linear-gradient(40deg, #9072ec, #e96fcc) !important;
}
.gradient-blue{
    background: linear-gradient(40deg, #3459b0, #42b4ed) !important;
}
.gradient-aqua{
    background: linear-gradient(40deg, #0aedb3, #1ca6f1) !important;
}
.gradient-peach{
    background: linear-gradient(40deg, #fc7564, #ffc66d) !important;
}

.gradient-honeydew{
    background: linear-gradient(40deg, #43C6AC, #F8FFAE) !important;
}

.gradient-vicecity{
    background: linear-gradient(300deg, #3494E6, #EC6EAD) !important;
}

.gradient-danger{
    background: linear-gradient(to right, #eb3349, #f45c43) !important;
}

.gradient-warning{
    background: linear-gradient(to right, #FBB034, #FFDD00) !important;
}

.gradient-notify{
    background: linear-gradient(to right, #2193b0, #6dd5ed) !important;
}

.gradient-ok{
    background: linear-gradient(to right, #56ab2f, #a8e063) !important;
}

/* =================================
     PRIVACY POLICY
   =================================*/

.paragraph-privacy-policy p {
    text-align: justify;
}

.paragraph-privacy-policy ul li {
    text-align: justify;
}

/* =================================
     RESERV SINGLE - ADMIN DAY BOXES
   =================================*/

#lots table{
    padding: 0;
    margin: 0;
    width: 100%;
}

#lots tr{
    height: 50px;
}

#lots td{
    padding: 0 10px 0 10px;
    vertical-align: middle;
}

#lots td.lot-reserved-name{
    text-align:right;
}

#lots td:hover {
    cursor: pointer;
}

/* =================================
     RESERV SINGLE - CALENDAR
   =================================*/

#calendar {
    width: 100%;
}

#calendar a {
    color: #8e352e;
    text-decoration: none;
}

#calendar-monthform{
    float: right;
    margin-left: 15px;
}

.calendar-month_actions{
    line-height:34px;
    height:34px;
    margin-bottom: 10px;
}

#calendar-monthname {
    line-height: 38px;
    float: right;
    vertical-align: middle;
    font-size: 18px;
    font-weight: bold;
    color: #939393;
}

#calendar-userform{
    float: left;
    margin-left: 15px;
}

#calendar-username{
    float: left;
    vertical-align: middle;
    font-size: 18px;
    font-weight: bold;
    color: #939393;
}

#calendar ul.weekdays {
    height: 40px;
}

#calendar ul.weekdays li {
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
    color: #939393;
    height: 20px;
    border: none !important;
    padding: 10px 6px;
    font-size: 13px;
}

#calendar ul {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
}

#calendar li {
    display: block;
    float: left;
    height: 100px;
    width: 14.342%;
    padding: 5px;
    box-sizing: border-box;
    border: 1px solid #d5d5d5;
    margin-right: -1px;
    margin-bottom: -1px;
    position: relative;
    cursor: pointer;
}

#calendar .date {
    position: absolute;
    top: 8px;
    left: 10px;
    color: #eee;
    font-weight: bold;
}


#calendar .date-current {
    color: #acacac;
}

#calendar .date-box-current {
    background: #d5d5d5;
    border-radius: 10%;
    height: 26px;
    width: 26px;
    position: absolute;
    top: 5px;
    left: 5px;
}

#calendar .date-noedit {
    color: #acacac;
}

#calendar .box-id {
    color: #eee;
    position: absolute;
    bottom: 8px;
    right: 10px;
}

#calendar .occupied-info {
    color: #eee;
    position: absolute;
    top: 8px;
    right: 10px;
}

#calendar .other-month {
    border: none;
}

#calendar .days .day-reserved-edit{
    background: #00BCE4;
}

#calendar .days .day-reserved-edit:hover{
    background: #00A7CC;
}

#calendar .days .day-reserved-noedit{
    background: #0AD2FF;
}

#calendar .days .day-reserved-noedit:hover{
    background: #0AD2FF;
}

#calendar .days .day-full-edit{
    background: #CB2439;
}

#calendar .days .day-full-edit:hover{
    background: #BF2237;
}

#calendar .days .day-full-noedit{
    background: #E05265;
}

#calendar .days .day-full-noedit:hover{
    background: #DD4055;
}

#calendar .days .day-free-edit{
    background: #8DC63F;
}

#calendar .days .day-free-edit:hover{
    background: #85BC38;
}

#calendar .days .day-free-noedit{
    background: #EBEBEB;
}

#calendar .days .day-free-noedit:hover{
    background: #E0E0E0;
}

#calendar .days .day-processing{
    background: #858585;
}

#calendar .days .other-month {
    background: none;
}

#calendar .days .other-month:hover {
    background: none;
}

/* =================================
     Discount
   =================================*/

#ticket_info p {
    font-weight: bold;
    color: #939393;
    line-height: 15px;
    font-size: 15px;
}

#ticket_info #ticket_info_price{
    line-height: 25px;
    color: #656565;
    font-size: 20px;
}

#ticket_info #ticket_info_status {
    line-height: 25px;
    color: #656565;
    font-size: 20px;
}

.form-control-clear {
    align-items: center;
    color: #939393;
    cursor: pointer;
    display: flex;
    height: 48px;
    justify-content: center;
    position: absolute;
    right: 0;
    width: 48px;
    z-index: 10;
}

/* =================================
     City Card
   =================================*/

#ticket_info .ticket_info_bold{
    line-height: 25px;
    color: #656565;
    font-size: 20px;
}

/* =================================
     Modal dialogs
   =================================*/

.dialog-danger-header {
      background-color: #dc3746;
      color:white !important;
}

.dialog-danger-header h4 {
    text-align: center;
    font-size: 30px;
}

.dialog-warning-header {
    background-color: #ffc20d;
    color:white !important;
}

.dialog-warning-header h4 {
    text-align: center;
    font-size: 30px;
}

.dialog-info-header {
    background-color: #1ba3b9;
    color:white !important;
}

.dialog-info-header h4 {
    text-align: center;
    font-size: 30px;
}

/* =================================
     Filter dialogs
   =================================*/

.highlighted {
    border: 2px solid #1ba3b9;
}

/* =================================
     Parking monitor
   =================================*/

.card-content-default{
    overflow-y: auto;
    min-height: 280px;
    max-height: 280px;
}

.card-content-ps{
    overflow-y: auto;
    min-height: 280px;
}

.card-centered-info{
    position: relative;
    -moz-transform: translateY(50%);
    -webkit-transform: translateY(50%);
    transform: translateY(50%);
    font-size: 20px;
    text-align: center;
    color:#dae0e5;
}

@media only screen and (min-width: 992px) {
    .card-centered-info{
        position: absolute;
        top: 50%;
        left: 50%;
        -moz-transform: translateX(-50%) translateY(-50%);
        -webkit-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%);
    }
}

.icon-tabs-left button.btn{
    min-height: 48px;
    min-width: 48px;
}

.villa-badge-counter{
    position: relative;
    top: -15px;
    left: -5px;
}

.villa-badge-counter-danger{
    color: #d53343;
}

.villa-badge-counter-warning{
    color: #ffc107;
}

.villa-badge-counter-notif{
    color: #1ba3b9;
}

.villa-progress-bar-text{
    position: absolute;
    display: block;
}

/* =================================
     Parking settings
   =================================*/

.sidebar li .submenu{
	list-style: none;
	margin: 0;
    padding: 0 1rem;
}
.sidebar .nav-link {
    font-weight: 500;
    color: var(--bs-dark);
}
.sidebar .nav-link:hover {
    color: var(--bs-primary);
}

.card-header-collapsible .fa {
    transition: .3s transform ease-in-out;
}
.card-header-collapsible .collapsed .fa {
    transform: rotate(90deg);
}


.bootstrap-tagsinput .tag [data-role="remove"]:after{
      content: " \00d7";
  }

/* =================================
     Visits
   =================================*/

.progress-label {
    float: right;
    font-weight: bold;
    color: #939393;
}

/* =================================
     Residence
   =================================*/

.tagify__input, .car-id-input {
    text-transform: uppercase;
}

/* =================================
     Mobile Responsiveness
   =================================*/

@media(max-width: 1200px) {
    .icon-tabs-left {
        padding-right: 0px;
    }
}

@media (max-width: 992px) {
    .icon-tabs-left{
        border-right:none !important;
    }

    .villa-badge-counter{
        position: relative;
        top: -2px !important;
        left: 0px !important;
    }

}

@media(max-width: 768px) {

    body {
        margin-bottom: 70px;
    }

    #calendar .weekdays, #calendar .other-month {
        display: none;
    }

    #calendar li {
        height: 50px;
        border: 1px solid #ededed;
        width: 100%;
        margin-bottom: -1px;
    }

    #calendar .date-box-current {
        top: 11.5px;
        left: 5px;
    }

    #calendar .date {
        top: 14.5px;
        left: 10px;
    }

    #calendar .box-id {
        bottom: 2px;
        right: 10px;
    }

    #calendar .occupied-info {
        top: 2px;
        right: 10px;
    }

    #calendar-userform{
        margin-left: 0px;
    }

    .dialog-info-header, .dialog-info-header h4, .dialog-info-close {
        font-size: 20px;
    }

    .ui-autocomplete.ui-widget {
        font-size: 22px;
    }
}