/*
 Copyright Watman & Worth Web Ltd 2018-2021
 Use without modification granted to all our customers.
 Do Not Redistribute
*/
/* 
    Created on : 19 Aug 2021, 15:40:29
    Author     : William Worth <william@watmanworth.co.uk>
*/

/********CALENDAR************/

.ui-widget-content a.button {color:#fff !important;}

.mod-calendar .navigation {
    text-align: center;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    margin-bottom: 12px;
    padding: 4px;
}

.mod-calendar .navigation a {
    border-radius: 50%;
    height: 28px;
    width: 28px;
    display: inline-block;
    background-color: #253746;
    font-size: 0px;
    vertical-align: top;
    margin: 0px 20px;
    background-size: 14px;
    background-repeat: no-repeat;
}

.mod-calendar .navigation a.prev {
    background-image: url(/calendar/images/left-arrow);
    background-position: 40% center;
}

.mod-calendar .navigation a.next {
    background-image: url(/calendar/images/right-arrow);
    background-position: 60% center;
}


.mod-calendar .navigation span {
    font-size: 20px;
}


.mod-calendar .week-day {
    text-align: center;
    margin-bottom: 6px;
    background-color: #efefef;
    padding: 4px;
    font-size: 10px;
    border-radius: 4px;
    color: #333;
}

.calendar-day {
    border: 1px solid #ccc;
    margin-bottom: 12px;
    font-size: 12px;
    vertical-align:top;
        position: relative;
}



.calendar-day.today {
    background-color: #e8e8e8;

}

.calendar-day.not-in-month {opacity:0;}

.calendar-day.today .day-num {
    background-color: green;
}

.calendar-day .day-num {
    background-color: #253746;
    color: #fff;
    padding: 4px 12px;
    font-weight: bold;
}

.calendar-day .day-content {padding:8px;}

.calendar-day .add-holiday {
    position: absolute;
    top: 0px;
    right: 0px;
    font-size: 10px;
    background-color: #118a2a;
    border-radius: 0px;
    border: none;
    border-left-color: currentcolor;
    border-left-style: none;
    border-left-width: medium;
    border-left-color: currentcolor;
    border-left-style: none;
    border-left-width: medium;
    line-height: 13px;
    border-left: 2px solid #fff;
    background-image: url(/images/add.png);
    background-size: 17px;
    background-position: 4px center;
    padding-left: 26px;
}

/***************HOLIDAY CALENDAR HUB**************/

.holiday-request .name {font-weight:bold;}


/************USER HOLIDAY REQUESTS*************/


.requested-days {
    border-top: 1px solid #ccc;
    padding: 12px 0px 0px;
    border-bottom: 1px solid #ccc;
}

.holiday-requests .holiday-request {
  background-color: #efefef;
  padding: 8px;
  border-radius: 4px;
  margin: 12px;
}

.requested-days .selected-day {
    font-weight: bold;
    font-size: 14px;
    display: inline-block;
    border-radius: 4px;
    background-repeat: no-repeat;
    background-size: 14px;
    background-position: 8px center;
    margin-right: 8px;
    margin-bottom: 8px;
    background-color: #efefef;
    padding: 6px 12px 6px 12px;
    border: 1px solid #ccc;
}

.holiday-request > div > .submit-request {
  margin-top: 12px;
  margin-bottom: 12px;
  background-color: green;
  font-size: 18px;
  line-height: 24px;
}


.day-content .requested .status {
    display: inline-block;
    width: 100%;
    font-weight: bold;
    border: 1px solid #ccc;
    padding: 8px;
    margin-bottom: 8px;
    background-color: #efefef;
}

.checkbox-set-entry label {display:inline-block; margin-left:8px; font-size:14px;}

.day-content .request .button {width:100%;}

.button.red.delete-request {
    margin-top: 8px;
    width: 100%;
    font-size: 10px;
}


 .request-detail {
  border: 1px solid #ccc;
  padding: 12px;
  text-align: center;
}





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

    .layout .mod-calendar .week-days {display:none;}

    .layout .mod-calendar .days {text-align:center;}
    .layout .mod-calendar .days .calendar-day {text-align:left !important;}  
    

.layout .mod-calendar .calendar-day.not-in-month {display: none !important;}  

.layout .mod-calendar .calendar-day {
  margin-left: 0% !important;
  margin-right: 0% !important;
  width: 100% !important;
}

.calendar-day .day-num {
  border: 1px solid #253746;
}

.calendar-day.today .day-num {
    border: 1px solid green;
}

.entry.multi-day {
  width: 100% !important;
  margin-bottom: 12px;
}

.packing-piece, .no-slots {display:none !important;}
}