﻿.cc-schedule-app * .primary-final-button:active,
.cc-schedule-app * .btn-light.btn-outline-dark,
.cc-schedule-app * #confirmBooking,
.cc-schedule-app * #rescheduleBooking {
    align-items: center;
    background-color: #ffc524;
    border-color: transparent;
    border-radius: 0.675rem;
    color: black;
    cursor: pointer;
    display: flex;
    font-weight: 500 !important;
    font-family: poppins-semibold;
    font-size: 14pt;
    height: auto;
    justify-content: center;
    margin-bottom: 2rem;
    min-height: 50px;
    max-height: 55px;
    min-width: 220px;
    padding: 1rem;
    line-height: 1.5;
    text-decoration: none;
    text-transform: capitalize;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.cc-schedule-app * .btn-danger:focus,
.cc-schedule-app * .btn-danger,
.cc-schedule-app * .btn-warning.btn-outline-dark {
    align-items: center;
    background-color: white;
    border: 1px solid #ffc524;
    border-radius: 0.675rem;
    color: black;
    cursor: pointer;
    display: flex;
    font-weight: 500 !important;
    font-family: poppins-semibold;
    font-size: 14pt;
    height: auto;
    justify-content: center;
    line-height: 1.5;
    margin-bottom: 2rem;
    min-height: 50px;
    max-height: 55px;
    min-width: 220px;
    padding: 1rem;
    text-decoration: none;
    text-transform:capitalize;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}
.cc-schedule-app * .appointment-list-container * .btn-danger,
.cc-schedule-app * .appointment-list-container * .btn-warning.btn-outline-dark,
.cc-schedule-app * .appointment-list-container * .btn-light.btn-outline-dark {
    min-width: 315px !important;
    max-width: 315px !important;
    width: auto !important;
}
.cc-schedule-app * label.text-decoration-underline {
    text-decoration: none !important;
    font-weight: 600;
}
.cc-schedule-app * .fw-bold {
    font-weight: 600 !important;
}
.cc-schedule-app * .appointment-container {
    display: flex !important;
    border-radius: 8px !important;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}
.cc-schedule-app * .set-desc {
    width: 59% !important;
    display:inline-block !important;
}
.cc-schedule-app * .set-desc-details {
    display:inline-block !important;
    padding-left: 25px;
    width: 41% !important;
}
.cc-schedule-app * .appointment-container .details-column {
    width: 70% !important;
}
.cc-schedule-app * .appointment-container .details-column.cc-split-booking,
.cc-schedule-app * .appointment-list-container {
    width: 100% !important;
}
.cc-schedule-app * .appointment-container .cc-split-booking .view-details-container {
    width: 90% !important;
}
.cc-schedule-app * .appointment-container .right-column {
    width: 30% !important;
}
.cc-schedule-app * .btn-light.btn-outline-dark.time-card {
    width: 130px !important;
    min-width: 125px !important;
    display: inline-flex !important;
    align-items:center;
    background-color: #FFC524;
    color: #000;
    border: 1px solid #000 !important;
}

.cc-schedule-app * .btn-light.btn-outline-dark.time-card.active {
    background-color: #000 !important;
    color: #FFF !important;
}
.cc-schedule-app * .time-card:disabled {
    background-color: #f8f9fa;
    cursor: no-drop !important;
    opacity: 0.5 !important;
}
.cc-schedule-app * .ron-timeslot #timeslotContainer,
.cc-schedule-app * .preview-container {
    border: 1px solid #000 !important;
    border-radius: 10px !important;
}
.cc-schedule-app *.rz-dialog-wrapper {
    left: 0;
}
.cc-schedule-app *.rz-dialog-titlebar .rz-dialog-title {
    color: white !important;
    font-family: poppins-semibold !important;
    font-size: 1.25rem !important;
}
.cc-schedule-app *.rz-dialog-titlebar {
    background-color: #000 !important;
    border-top-left-radius: 8px !important;
    color: white !important;
    position: relative !important;
    padding: 22px !important;
}
.cc-schedule-app * .rz-dialog-titlebar-icon {
    font-weight: 500;
    height: 45px;
    width: 45px;
    z-index: 1;
    opacity: 1;
    right: -20px;
    position: absolute;
    background-color: white !important;
    border-radius: 50%;
    top: -22px;
}
.cc-schedule-app *.rz-dialog.rz-open {
    overflow: visible !important;
    border-top-left-radius: 8px !important;
    border-bottom-left-radius: 8px !important;
    border-bottom-right-radius: 8px !important
}
.cc-schedule-app * .booking-btn {
    margin-bottom: .5rem !important;
    width: 335px !important;
    max-height: 75px !important;
}
.cc-schedule-app * .booking-btn:disabled {
    pointer-events:unset !important;
    cursor: no-drop !important;
}
.cc-schedule-app * .discard-btn {
    position: absolute;
    top: -45px;
}
.cc-schedule-app * .booking-header {
    position: absolute;
    top: -45px;
}
.cc-schedule-app * #splitAvailabilityContainer,
.cc-schedule-app * #notificationsSection,
.cc-schedule-app * #availabilityContainer, .cc-schedule-app * #calendarContainer, .cc-schedule-app * #branchContainer {
    min-height: 500px;
    max-height: 500px;
    height: auto;
    margin-bottom: 14px;
    border-radius: 10px;
}
.cc-schedule-app * #commentSectionContainer {
    height: auto;
    margin-bottom: 14px;
    border-radius: 10px;
}
.cc-schedule-app * #availabilityContainer {
    max-width: 100% !important;
}
.cc-schedule-app * .grid-body > .buyer-timeslots,
.cc-schedule-app * .grid-body > .seller-timeslots {
    height: 100% !important;
}
.cc-schedule-app *.custom-sch-app-rdo {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e") !important;
    border-radius: 50% !important;
    appearance: none;
    width: 16px;
    height: 16px;
    border: 2px solid #999;
    display: inline-block;
    position: relative;
}
.cc-schedule-app * .custom-sch-app-rdo:checked {
      accent-color: #FFC524;
    background-color: #FFC524 !important;
    border-color: #ffc524 !important;
}
.cc-schedule-app * input[type=checkbox],
.cc-schedule-app * .form-check-input {
    background-image: url("../images/EmptyCheckBox.png") !important;
    background-color: transparent !important;
    width: 25px;
    height: 24px;
    border-radius: 0 !important;
    box-shadow: none !important;
    border: 1px solid #c9c9c9 !important;
    outline: none !important;
    flex-shrink: 0;
}
.cc-schedule-app * input[type=checkbox]:checked,
.cc-schedule-app * .form-check-input:checked {
    background-image: url(../images/check-lg.svg) !important;
    background-color: #000 !important;
    border: 2px solid #ffc524 !important;
    width: 25px;
    height: 24px;
    border-radius: 0 !important;
    box-shadow: none !important;
    outline: none;
    flex-shrink: 0;
}
.cc-schedule-app * input[type=checkbox] ~ label.form-check-label,
.cc-schedule-app * .form-check-input ~ label.form-check-label {
    padding-left: .25rem !important;
}
.cc-schedule-app * #branchContainer .list-container * .form-check {
    display:flex !important;
}
.cc-schedule-app * #dateRangeChecked,
.cc-schedule-app * #dateRangeChecked:checked {
    width:18px !important;
    height:18px !important;
}
.cc-schedule-app *.contacts-list {
    height: 385px !important;
    max-height: 385px !important;
    overflow-y: auto;
    border-radius: 10px;
}
.cc-schedule-app * #additionalEmailsContainer .container .badge-container {
    border-radius: 10px;
    max-height: 320px !important;
}
.cc-schedule-app * #additionalEmailsContainer .container {
    height: 385px !important;
    border-radius: 10px;
}
.cc-schedule-app * #splitNotificationsSection {
    margin-bottom:14px !important;
    width:100% !important;
    border-radius:10px !important;
}
.cc-schedule-app * #branchContainer .grid {
    height: 380px;
}
.cc-schedule-app * .rz-datepicker-inline,
.cc-schedule-app * textarea,
.cc-schedule-app * .branch,
.cc-schedule-app * .split-preview .border.border-dark {
    border-radius: 10px !important;
}
.cc-schedule-app * select:focus,
.cc-schedule-app * input:focus,
.cc-schedule-app * textarea:focus {
    background-color: rgb(255, 253, 247) !important;
    border: 1px solid rgb(255, 197, 36) !important;
    outline: 0 !important;
}
.cc-schedule-app * select:focus,
.cc-schedule-app * input:focus {
    border-radius: 6px;
}
.cc-schedule-app * .column .list-container {
    max-height: 330px !important;
}
.cc-schedule-app * .ron-comments #commentSectionContainer,
.cc-schedule-app * .ron-col-calendar #calendarContainer {
    height: auto !important;
    min-height: 592px;
    max-height: 100%;
    margin-bottom: 14px;
}
.cc-schedule-app * .component-header * .rz-calendar-header {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}
.cc-schedule-app * #timeslotContainer {
    height: 499px !important;
}
.cc-schedule-app * .component-header {
    background-color: #000;
    border-top-left-radius: 9px;
    border-top-right-radius: 9px;
    color: #FFF;
    padding: 1rem !important;
}
.cc-schedule-app * .split-col-branch #branchContainer {
    min-height: 500px !important;
    max-height: 500px !important;
}
.cc-schedule-app * #splitAvailabilityContainer .grid {
    height: 430px !important;
}
.cc-schedule-app * .times-container {
    height: 385px !important;
}
.cc-schedule-app * .rz-dialog-content {
    overflow: visible !important;
    padding: 0 !important;
}
.cc-schedule-app * .rz-dialog-content:has(.booking-container) {
    padding:1.5rem !important;
}
.cc-schedule-app * .confirm {
    min-width: 230px !important;
}
.cc-schedule-app * .rz-calendar-view .rz-calendar-other-month {
    opacity: .6 !important;
}
.cc-schedule-app * #contactsContainer * .checkboxes input[type=checkbox]:checked {
    outline: 2px solid #FFC524 !important;
    outline-offset: -1px;
}
.cc-schedule-app * #contactsContainer * .checkboxes label {
    display: flex !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    word-break: break-word !important;
}
.cc-schedule-app * textarea {
    padding:10px !important;
}
/*Radzen Tooltip*/
.rz-tooltip-content.rz-left-tooltip-content {
    background-color: rgb(255, 253, 247) !important;
    border-color: rgb(255, 197, 36) !important;
    outline: 0 !important;
    color: #000 !important;
}
/*Radzen Alert*/
.cc-schedule-app * .rz-dialog-alert-message {
    padding: 1.5rem !important;
}
.cc-schedule-app * .rz-dialog-alert-buttons {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin-bottom: 20px;
}
.cc-schedule-app * .rz-dialog-alert-message {
    border: 1px solid lightgrey !important;
}
.cc-schedule-app * #confirmBooking {
    height:55px !important;
}
.cc-schedule-app * .rz-dialog-alert-buttons .rz-button.rz-button-md.rz-variant-filled.rz-primary.rz-shade-default {
    max-width: 190px !important;
    height: 55px !important;
    background-color: #FFC524;
    color: #000 !important;
    font-weight: bold;
    font-size: 14pt !important;
    border-radius: 10px !important;
    box-shadow: none !important;
}
.cc-sc-px-12 {
    padding-left: 12px;
}
.cc-schedule-app * #calendarContainer * .rz-datepicker .rz-inputtext {
    border: 0 !important;
    color: #fff !important;
}
.appointment-list-container:not(:has(*)) .view-list-header {
    display: none;
}
.cc-trash-icon {
    color: #6d6e71 !important;
}

/* CSP-compliant Radzen dialog width classes */
.rz-dialog[data-dialog-width="400"] {
    width: 400px !important;
}
.rz-dialog[data-dialog-width="500"] {
    width: 500px !important;
}
.rz-dialog[data-dialog-width="600"] {
    width: 600px !important;
}
.rz-dialog[data-dialog-width="666"],
.rz-dialog.dialog-width-666 {
    width: 666px !important;
}
.rz-dialog[data-dialog-width="700"] {
    width: 700px !important;
}
.rz-dialog[data-dialog-width="800"] {
    width: 800px !important;
}
.rz-dialog[data-dialog-width="900"],
.rz-dialog.dialog-width-900 {
    width: 900px !important;
}
.rz-dialog[data-dialog-width="1000"] {
    width: 1000px !important;
}
.rz-dialog[data-dialog-width="1200"],
.rz-dialog.dialog-width-1200 {
    width: 1200px !important;
}
.rz-dialog[data-dialog-min-width="700"],
.rz-dialog.dialog-min-width-700 {
    min-width: 700px !important;
}
/* CSP-compliant Radzen stack gap classes */
.rz-stack[data-gap="0"] {
    --rz-gap: 0 !important;
}
.rz-stack[data-gap="0.5"] {
    --rz-gap: 0.5rem !important;
}
.rz-stack[data-gap="1"] {
    --rz-gap: 1rem !important;
}
.rz-stack[data-gap="1.5"] {
    --rz-gap: 1.5rem !important;
}
.rz-stack[data-gap="2"] {
    --rz-gap: 2rem !important;
}
.rz-stack[data-gap="2.5"] {
    --rz-gap: 2.5rem !important;
}
.rz-stack[data-gap="3"] {
    --rz-gap: 3rem !important;
}
.rz-stack[data-gap="4"] {
    --rz-gap: 4rem !important;
}

/* CSP-compliant Radzen stack flex-wrap classes */
.rz-stack[data-flex-wrap="nowrap"] {
    flex-wrap: nowrap !important;
}
.rz-stack[data-flex-wrap="wrap"] {
    flex-wrap: wrap !important;
}
.rz-stack[data-flex-wrap="wrap-reverse"] {
    flex-wrap: wrap-reverse !important;
}

/* CSP-compliant Radzen dialog mask pointer-events classes */
.rz-dialog-mask[data-pointer-events="none"] {
    pointer-events: none !important;
}
.rz-dialog-mask[data-pointer-events="auto"] {
    pointer-events: auto !important;
}
.rz-dialog-mask[data-pointer-events="all"] {
    pointer-events: all !important;
}
.cc-schedule-app * #NotesTxtbx {
    resize:none;
    height:377px !important;
}
.cc-schedule-app * #BuyerNotesTxtbx,
.cc-schedule-app * #SellerNotesTxtbx {
    resize: none;
    height:250px !important;
}
.cc-schedule-app * .ron-grid #NotesTxtbx {
    height: 410px !important;
}
.cc-schedule-app * .cc-ron-upload * .css-config-text {
    font-size:0;
}
.cc-schedule-app * .cc-ron-upload * .css-config-text:after {
    content: 'Select File' !important;
    font-size: 12pt;
}
/*Responsive*/
@media screen and (max-width:2788px) {
    .cc-schedule-app * .ron-grid #NotesTxtbx {
        height: 390px !important;
    }
}
@media screen and (max-width:1920px) {
    .cc-schedule-app * .rz-dialog-wrapper {
        margin-top: 4.5rem !important;
    }

    .cc-schedule-app * .notifications-container {
        min-width: 100% !important;
    }

    .cc-schedule-app * .notifications-container ~ .col {
        min-width: 100% !important;
    }

    .cc-schedule-app * #splitNotificationsSection * .block {
        width: 50% !important;
        max-width: 50% !important;
        min-width: 50%;
    }
    .cc-schedule-app * .ron-grid #NotesTxtbx {
        height: 320px !important;
    }
}