/* Mobile workweek calendar and private owner/sales availability */

.appointment-kind-grid-v1{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}

.appointment-create-modal-form.personal-appointment-v1 .appointment-contact-search-v1,
.appointment-create-modal-form.personal-appointment-v1 .appointment-contact-results-v1,
.appointment-create-modal-form.personal-appointment-v1 [data-appointment-selected-contact],
.appointment-create-modal-form.personal-appointment-v1 .appointment-add-customer-v1{
  display:none !important;
}

.appointment-create-modal-form.personal-appointment-v1 .appointment-contact-panel-v1::before{
  content:"Private availability block";
  display:block;
  margin:0 0 12px;
  padding:12px 14px;
  border:1px solid rgba(177,92,255,.62);
  border-left:4px solid #b15cff;
  border-radius:10px;
  background:rgba(92,38,140,.18);
  color:#f2e5ff;
  font-size:14px;
  font-weight:800;
  line-height:1.4;
}

.appointment-calendar-owner-v1 small{
  display:block;
  margin-top:6px;
  color:#aebdcd;
  font-size:12px;
  font-weight:650;
  line-height:1.35;
}

.slot-event.appt-personal-time,
.calendar-month-event-shell-v2.appt-personal-time .calendar-month-event{
  border-color:#b15cff !important;
  border-left-color:#b15cff !important;
  background:linear-gradient(135deg,rgba(69,30,103,.92),rgba(23,17,38,.96)) !important;
  box-shadow:inset 0 0 0 1px rgba(177,92,255,.2) !important;
}

.slot-event.appt-personal-time time,
.slot-event.appt-personal-time strong{
  color:#f4e8ff !important;
}

.slot-event.appt-personal-time span,
.slot-event.appt-personal-time small{
  color:#cfb4eb !important;
}

.calendar-day-appointment.appt-personal-time{
  border-color:rgba(177,92,255,.6) !important;
  border-left:4px solid #b15cff !important;
  background:linear-gradient(135deg,rgba(69,30,103,.54),rgba(13,23,34,.96)) !important;
}

.calendar-day-appointment.appt-personal-time time,
.calendar-day-appointment.appt-personal-time strong{
  color:#f4e8ff !important;
}

.calendar-mobile-weekend-hint{
  display:none;
}

@media (max-width:760px){
  .calendar-mobile-weekend-hint{
    display:flex;
    align-items:center;
    gap:8px;
    color:#c6d3e0;
    font-size:12px;
    font-weight:750;
    line-height:1.35;
  }

  .calendar-mobile-weekend-hint svg{
    width:17px;
    height:17px;
    color:#ff7a00;
    flex:0 0 auto;
  }

  #app .premium-app .ironflow-calendar-page .calendar-month-scroll-v4{
    width:100%;
    padding-bottom:4px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    overscroll-behavior-x:contain;
    scroll-snap-type:x proximity;
    touch-action:pan-x pan-y !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none !important;
    -ms-overflow-style:none !important;
  }

  #app .premium-app .ironflow-calendar-page .calendar-month-scroll-v4::-webkit-scrollbar{
    display:none !important;
    width:0 !important;
    height:0 !important;
  }

  .premium-app .ironflow-calendar-page .month-calendar-grid-v4{
    width:calc(100% + 160px) !important;
    min-width:520px !important;
    max-width:none !important;
    grid-template-columns:repeat(5,minmax(72px,1fr)) 80px 80px !important;
    grid-template-rows:36px repeat(6,132px) !important;
    min-height:828px !important;
  }

  .premium-app .ironflow-calendar-page .month-calendar-grid-v4 .month-weekday{
    min-width:0 !important;
    padding:9px 4px !important;
    font-size:11px !important;
    font-weight:850 !important;
    letter-spacing:.02em !important;
  }

  .premium-app .ironflow-calendar-page .month-calendar-grid-v4 .month-day{
    min-width:0 !important;
    min-height:132px !important;
    padding:6px !important;
    scroll-snap-align:start;
  }

  .premium-app .ironflow-calendar-page .month-calendar-grid-v4 .month-date{
    width:26px !important;
    height:26px !important;
    min-width:26px !important;
    min-height:26px !important;
    font-size:12px !important;
  }

  .premium-app .ironflow-calendar-page .month-calendar-grid-v4 .month-events{
    max-height:94px !important;
    gap:3px !important;
  }

  .premium-app .ironflow-calendar-page .month-calendar-grid-v4 .calendar-month-event-shell-v2,
  .premium-app .ironflow-calendar-page .month-calendar-grid-v4 .month-day .calendar-month-event{
    min-height:36px !important;
  }

  .premium-app .ironflow-calendar-page .month-calendar-grid-v4 .month-day .calendar-month-event{
    padding:5px 6px !important;
  }

  .premium-app .ironflow-calendar-page .month-calendar-grid-v4 .month-day .calendar-month-event time{
    font-size:10px !important;
    line-height:1.15 !important;
  }

  .premium-app .ironflow-calendar-page .month-calendar-grid-v4 .month-day .calendar-month-event strong{
    font-size:10px !important;
    line-height:1.2 !important;
  }

  .appointment-kind-grid-v1{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}