/* Add your CSS code here.

/* =====================================================
   PR Datepicker Redesign
   For jQuery UI datepicker: .disable_past_sat_sun
   ===================================================== */

/* Date input field */
.book-pr-field .disable_past_sat_sun,
input.disable_past_sat_sun {
  background-color: #ffffff !important;
  border: 1px solid #c6d3e3 !important;
  border-radius: 4px !important;
  color: #071C30 !important;
  font-family: Inter, Arial, sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  height: 44px !important;
  padding: 10px 42px 10px 12px !important;
  box-shadow: none !important;
  cursor: pointer;
}

.book-pr-field .disable_past_sat_sun:focus,
input.disable_past_sat_sun:focus {
  border-color: #ED2636 !important;
  box-shadow: 0 0 0 3px rgba(237, 38, 54, 0.12) !important;
  outline: none !important;
}

/* Main popup */
#ui-datepicker-div.ui-datepicker {
  width: 318px !important;
  padding: 14px !important;
  background: #ffffff !important;
  border: 1px solid #d7e0ea !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 45px rgba(7, 28, 48, 0.18) !important;
  font-family: Inter, Arial, sans-serif !important;
  z-index: 999999 !important;
}

/* Remove Redmond theme image/background */
#ui-datepicker-div .ui-widget-header,
#ui-datepicker-div .ui-state-default,
#ui-datepicker-div .ui-state-hover,
#ui-datepicker-div .ui-state-active {
  background-image: none !important;
}

/* Header */
#ui-datepicker-div .ui-datepicker-header {
  position: relative !important;
  padding: 13px 42px !important;
  background: linear-gradient(135deg, #071C30, #102B45) !important;
  border: 0 !important;
  border-radius: 11px !important;
  color: #ffffff !important;
}

#ui-datepicker-div .ui-datepicker-title {
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  text-align: center !important;
}

/* Previous / Next buttons */
#ui-datepicker-div .ui-datepicker-prev,
#ui-datepicker-div .ui-datepicker-next {
  top: 50% !important;
  width: 28px !important;
  height: 28px !important;
  margin-top: -14px !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: rgba(255, 255, 255, 0.14) !important;
  cursor: pointer !important;
}

#ui-datepicker-div .ui-datepicker-prev {
  left: 10px !important;
}

#ui-datepicker-div .ui-datepicker-next {
  right: 10px !important;
}

#ui-datepicker-div .ui-datepicker-prev:hover,
#ui-datepicker-div .ui-datepicker-next:hover {
  background: rgba(255, 255, 255, 0.24) !important;
}

/* Hide default jQuery UI sprite arrows */
#ui-datepicker-div .ui-datepicker-prev span,
#ui-datepicker-div .ui-datepicker-next span {
  display: none !important;
}

/* Custom arrows */
#ui-datepicker-div .ui-datepicker-prev::before,
#ui-datepicker-div .ui-datepicker-next::before {
  position: absolute;
  top: 50%;
  left: 50%;
  color: #ffffff;
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  transform: translate(-50%, -50%);
}

#ui-datepicker-div .ui-datepicker-prev::before {
  content: "‹";
}

#ui-datepicker-div .ui-datepicker-next::before {
  content: "›";
}

/* Calendar table */
#ui-datepicker-div table.ui-datepicker-calendar {
  width: 100% !important;
  margin: 12px 0 0 !important;
  border-collapse: separate !important;
  border-spacing: 5px !important;
}

#ui-datepicker-div .ui-datepicker-calendar th {
  padding: 5px 0 !important;
  color: #071C30 !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
}

#ui-datepicker-div .ui-datepicker-calendar td {
  padding: 0 !important;
  border: 0 !important;
}

/* Date boxes */
#ui-datepicker-div .ui-datepicker-calendar td a,
#ui-datepicker-div .ui-datepicker-calendar td span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  border-radius: 9px !important; 
  color: #102B45 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-align: center !important;
  text-decoration: none !important;
	border: 1px solid #d7e6f3 !important;
    background: #eff4fb !important;
}

/* Hover date */
#ui-datepicker-div .ui-datepicker-calendar td a:hover {
  background: #FFF1F3 !important;
  border-color: #ED2636 !important;
  color: #ED2636 !important;
}

/* Selected date */
#ui-datepicker-div .ui-datepicker-calendar .ui-state-active,
#ui-datepicker-div .ui-datepicker-calendar .ui-widget-content .ui-state-active {
  background: #ED2636 !important;
  border-color: #ED2636 !important;
  color: #ffffff !important;
  box-shadow: 0 8px 18px rgba(237, 38, 54, 0.28) !important;
}

/* Today */
#ui-datepicker-div .ui-datepicker-today a {
  background: #FFF7F8 !important;
  border-color: #F3A6AE !important;
  color: #ED2636 !important;
}

/* Disabled dates: past dates + Saturday/Sunday from your JS */
#ui-datepicker-div .ui-state-disabled span {
  background: #f1f5f9 !important;
  border-color: #e2e8f0 !important;
  color: #b7c4cf !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
}

/* Remove ugly default borders */
#ui-datepicker-div .ui-state-default,
#ui-datepicker-div .ui-widget-content .ui-state-default {
  border-color: #e5edf5 !important;
}

/* Mobile */
@media (max-width: 480px) {
  #ui-datepicker-div.ui-datepicker {
    width: calc(100vw - 32px) !important;
    max-width: 340px !important;
    padding: 12px !important;
    border-radius: 14px !important;
  }

  #ui-datepicker-div .ui-datepicker-calendar {
    border-spacing: 4px !important;
  }

  #ui-datepicker-div .ui-datepicker-calendar td a,
  #ui-datepicker-div .ui-datepicker-calendar td span {
    width: 32px !important;
    height: 32px !important;
    font-size: 13px !important;
  }
}

#ui-datepicker-div .ui-datepicker-calendar .tomorrowActive  a  {
    background: #ED2636 !important;
    border-color: #ED2636 !important;
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(237, 38, 54, 0.28) !important;
}