/* Vchat 0.36.76 — Calendar UX, multiple time ranges and control consistency */

/* Remove inherited red borders from ordinary actions. Destructive actions keep explicit danger styling. */
.vchat-frontend-app [data-vchat-panel="booking"] button:not(.danger):not([data-calendar-archive]),
.vchat-modal .vchat-calendar-manager button:not(.danger):not([data-calendar-archive]),
.vchat-modal .vchat-calendar-editor button:not(.danger):not([data-calendar-archive]),
.vchat-modal .vchat-booking-settings-modal button:not(.danger),
.vchat-modal .vchat-booking-form button:not(.danger){
  border-color:#ded9e9!important;
  outline-color:transparent!important;
}
.vchat-frontend-app [data-vchat-panel="booking"] button:focus-visible,
.vchat-modal .vchat-calendar-manager button:focus-visible,
.vchat-modal .vchat-calendar-editor button:focus-visible,
.vchat-modal .vchat-booking-settings-modal button:focus-visible{
  outline:3px solid rgba(101,84,184,.18)!important;
  outline-offset:2px!important;
  border-color:#8e7bd5!important;
}
.vchat-frontend-app [data-vchat-panel="booking"] button.primary,
.vchat-modal .vchat-calendar-manager button.primary,
.vchat-modal .vchat-calendar-editor button.primary,
.vchat-modal .vchat-booking-settings-modal button.primary{
  border-color:#6554b8!important;
  background:#6554b8!important;
  color:#fff!important;
}

/* Month chooser */
.vchat-booking-period{position:relative!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;min-width:0!important}
.vchat-booking-month-button{display:inline-flex!important;align-items:center!important;gap:8px!important;max-width:min(360px,40vw)!important;min-height:42px!important;padding:9px 12px!important;border:1px solid #ded9e9!important;border-radius:12px!important;background:#fff!important;color:#2d2840!important;font:inherit!important;font-weight:850!important;cursor:pointer!important}
.vchat-booking-month-button span{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;text-transform:capitalize!important}
.vchat-booking-month-button svg{flex:0 0 17px!important;width:17px!important;height:17px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important}
.vchat-booking-month-native{position:absolute!important;right:94px!important;bottom:0!important;width:1px!important;height:1px!important;opacity:.01!important;pointer-events:none!important}

/* Calendar grid: every real day always shows the day number and a + action. */
.vchat-booking-weekdays{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:8px!important;padding:0 4px 10px!important}
.vchat-booking-weekdays span{padding:0 8px!important;color:#777083!important;font-size:10px!important;font-weight:900!important;text-transform:uppercase!important;letter-spacing:.04em!important}
.vchat-booking-days{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:8px!important}
.vchat-booking-days>.is-empty{min-height:126px!important;border:1px dashed transparent!important}
.vchat-booking-day{position:relative!important;display:flex!important;flex-direction:column!important;min-width:0!important;min-height:126px!important;padding:0!important;border:1px solid #e2deec!important;border-radius:15px!important;background:#fff!important;overflow:hidden!important}
.vchat-booking-day>header{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;min-height:46px!important;padding:9px 10px 8px 12px!important;border-bottom:1px solid #f0edf5!important;background:#fcfbfe!important}
.vchat-booking-day>header time{display:grid!important;place-items:center!important;min-width:30px!important;height:30px!important;padding:0 6px!important;border-radius:9px!important;color:#2d2840!important;font-size:13px!important;font-weight:900!important;line-height:1!important}
.vchat-booking-day.is-today>header time{background:#6554b8!important;color:#fff!important}
.vchat-booking-day-add{display:grid!important;place-items:center!important;flex:0 0 30px!important;width:30px!important;height:30px!important;min-height:30px!important;padding:0!important;border:1px solid #ddd7e8!important;border-radius:9px!important;background:#f3efff!important;color:#6554b8!important;font-size:18px!important;font-weight:500!important;line-height:1!important;cursor:pointer!important}
.vchat-booking-day-add:hover{background:#6554b8!important;color:#fff!important;border-color:#6554b8!important}
.vchat-booking-day>div{display:grid!important;align-content:start!important;gap:6px!important;min-width:0!important;padding:8px!important}
.vchat-booking-day>div>button{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;gap:2px 7px!important;min-width:0!important;padding:7px 8px!important;border:0!important;border-radius:9px!important;background:#f7f5fc!important;text-align:left!important}
.vchat-booking-day>div>button span{grid-row:1/3!important;align-self:start!important;color:#6554b8!important;font-size:9px!important;font-weight:900!important}
.vchat-booking-day>div>button strong,.vchat-booking-day>div>button small{min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
.vchat-booking-day>div>button strong{color:#302a44!important;font-size:10px!important}.vchat-booking-day>div>button small{color:#8c8495!important;font-size:8.5px!important}

/* Multiple availability periods */
.vchat-booking-settings-modal{display:grid!important;gap:16px!important}
.vchat-booking-settings-modal>section{padding:18px!important;border:1px solid #e2deec!important;border-radius:17px!important;background:#fff!important;overflow:visible!important}
.vchat-booking-settings-modal>section>header{margin-bottom:14px!important}
.vchat-booking-settings-modal>section>header strong{display:block!important;color:#2d2840!important;font-size:13px!important}
.vchat-booking-settings-modal>section>header p{margin:5px 0 0!important;color:#827b8e!important;font-size:10px!important;line-height:1.5!important}
.vchat-booking-hours-week{display:grid!important;gap:10px!important}
.vchat-booking-hours-day{padding:13px!important;border:1px solid #ece8f3!important;border-radius:14px!important;background:#faf9fd!important}
.vchat-booking-hours-day>header{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;margin-bottom:10px!important}
.vchat-booking-hours-day>header>div{min-width:0!important}.vchat-booking-hours-day>header strong{display:block!important;color:#302a44!important;font-size:11px!important}.vchat-booking-hours-day>header small{display:block!important;margin-top:3px!important;color:#928b9c!important;font-size:8.5px!important}
.vchat-booking-hours-add{flex:0 0 auto!important;min-height:34px!important;padding:7px 10px!important;border:1px solid #ddd7e8!important;border-radius:10px!important;background:#fff!important;color:#5948a1!important;font-size:9px!important;font-weight:850!important}
.vchat-booking-hours-list{display:grid!important;gap:8px!important}
.vchat-booking-hours-interval{display:grid!important;grid-template-columns:minmax(120px,1fr) auto minmax(120px,1fr) 34px!important;gap:8px!important;align-items:end!important}
.vchat-booking-hours-interval label{display:grid!important;gap:5px!important;min-width:0!important;color:#756f82!important;font-size:8.5px!important;font-weight:800!important}
.vchat-booking-hours-interval input[type="time"]{width:100%!important;min-height:40px!important}
.vchat-booking-hours-to{align-self:center!important;padding-top:16px!important;color:#777083!important;font-size:10px!important;font-weight:800!important}
.vchat-booking-hours-remove{display:grid!important;place-items:center!important;width:34px!important;height:40px!important;min-height:40px!important;padding:0!important;border:1px solid #e6dbe0!important;border-radius:10px!important;background:#fff!important;color:#a34a5e!important;font-size:17px!important;cursor:pointer!important}
.vchat-booking-phone-option{display:flex!important;align-items:center!important;gap:9px!important;padding:11px 12px!important;border:1px solid #e2deec!important;border-radius:12px!important;background:#faf9fd!important}
.vchat-booking-phone-option input{flex:0 0 auto!important;width:18px!important;height:18px!important;margin:0!important}

/* Calendar assignment cards: text must never leave the card/modal. */
.vchat-calendar-link-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
.vchat-calendar-link-choice{min-width:0!important;overflow:hidden!important}
.vchat-calendar-link-choice span{min-width:0!important;overflow:hidden!important}
.vchat-calendar-link-choice b,.vchat-calendar-link-choice small{max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important}
.vchat-calendar-manager-list article{overflow:hidden!important}
.vchat-calendar-manager-list article>div{min-width:0!important}
.vchat-calendar-manager-list article p,.vchat-calendar-manager-list article span{overflow-wrap:anywhere!important}

/* Generic booking/modal controls must remain clickable and visually consistent. */
.vchat-modal .vchat-calendar-editor input,
.vchat-modal .vchat-calendar-editor select,
.vchat-modal .vchat-calendar-editor textarea,
.vchat-modal .vchat-booking-settings-modal input,
.vchat-modal .vchat-booking-settings-modal select,
.vchat-modal .vchat-booking-settings-modal textarea{
  border:1px solid #ddd7e8!important;
  outline:none!important;
}
.vchat-modal .vchat-calendar-editor input:focus,
.vchat-modal .vchat-calendar-editor select:focus,
.vchat-modal .vchat-calendar-editor textarea:focus,
.vchat-modal .vchat-booking-settings-modal input:focus,
.vchat-modal .vchat-booking-settings-modal select:focus,
.vchat-modal .vchat-booking-settings-modal textarea:focus{
  border-color:#806dcb!important;
  box-shadow:0 0 0 3px rgba(101,84,184,.10)!important;
}

@media(max-width:1000px){
  .vchat-booking-days{gap:6px!important}
  .vchat-booking-day{min-height:112px!important}
  .vchat-booking-month-button{max-width:300px!important}
}
@media(max-width:760px){
  .vchat-booking-calendar{overflow-x:auto!important;padding-bottom:8px!important}
  .vchat-booking-weekdays,.vchat-booking-days{min-width:760px!important}
  .vchat-booking-period{justify-content:flex-start!important;flex-wrap:wrap!important}
  .vchat-booking-month-button{max-width:calc(100vw - 190px)!important}
  .vchat-booking-hours-day>header{align-items:flex-start!important;flex-direction:column!important}
  .vchat-booking-hours-add{width:100%!important}
  .vchat-booking-hours-interval{grid-template-columns:1fr auto 1fr!important}
  .vchat-booking-hours-remove{grid-column:1/-1!important;width:100%!important;height:34px!important;min-height:34px!important}
  .vchat-calendar-link-grid{grid-template-columns:1fr!important}
}