/*Calender CSS*/
#calendar-container{ display: flex; gap: 10px; margin: 30px 0 0; align-items: center; position: relative; justify-content: center; flex-direction: column; } 
#calendar-container .sec-calender-box-start { width: 500px; max-width: 100%; background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 10px; padding: 20px; } 
#calendar-container .sec-calendar-wrapper table { width: 100%; border-collapse: collapse; table-layout: fixed; border: none; margin: 0; border: none; outline: none; background: transparent; } 
#calendar-container .sec-calendar-wrapper th{ border: none; padding: 10px 5px; text-align: center; border-radius: 50%; transition: background-color 0.3s;  background-color: #ffffff; border-radius: 0; font-weight: 600;  } 
#calendar-container .sec-calendar-wrapper td{ border: none; padding: 0; } 
#calendar-container .sec-calendar-wrapper .past-day, 
#calendar-container .sec-calendar-wrapper .inactive { color: #aaa; pointer-events: none; } 
#calendar-container .sec-calendar-wrapper td .sec-day-box{ width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; font-weight: 600; margin: 5px auto; color: #949494; padding: 0; border-radius: 5px; cursor: default; background-color: #fff; text-align: center; transition: background-color 0.3s; } 
#calendar-container .sec-calendar-wrapper td .sec-day-box.allow-day{ color: var(--sec-primary-background-color); background-color: rgb(0 105 247 / 7%); cursor: pointer; } 
#calendar-container .sec-calendar-wrapper h2 { text-align: center; margin-bottom: 0; font-size: 22px; line-height: 1; font-weight: 600; } 
#calendar-container button { display: inline-block; margin: 10px 5px; padding: 10px 10px; font-size: 1em; border: none; border-radius: 5px; cursor: pointer; background-color: var(--sec-primary-background-color); color: var(--sec-primary-text-color); transition: background-color 0.3s; } 
#calendar-container button:hover { background-color: #0056b3; } 
#calendar-container .sec-date-next-prev-option { display: flex; justify-content: space-between; margin-bottom: -15px; } 
#calendar-container .sec-time-list-main { flex-direction: row; flex-wrap: wrap; background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 10px; padding: 20px; display: none; gap: 10px; } 
#calendar-container.sec-time-box-show .sec-time-list-main{ display: flex; }
#calendar-container .sec-time-list-main button.sec-time-list-btn { margin: 0; width: 100%; background: transparent; color: var(--sec-text-color); border: 2px solid var(--sec-text-color); font-weight: 600; font-size: 14px; } 
#calendar-container .sec-time-list-main button.sec-time-list-btn.time-selected, 
#calendar-container .sec-time-list-main button.sec-time-list-btn:hover { background: var(--sec-primary-background-color); border-color: var(--sec-primary-background-color); color: var(--sec-primary-text-color); } 
#calendar-container .sec-time-list-main .sec-listitem { margin-bottom: 0; width: calc(50% - 5px); }
#calendar-container .sec-calendar-wrapper table tbody { border: none; }

select#sec-timezone { width: 100%; margin-bottom: 10px; } 
.sec-calendar-navigation { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; gap: 20px; } 
.sec-calendar-navigation-icon { display: flex; background: #edf4fe; fill: var(--sec-primary-background-color); padding: 10px; border-radius: 5px; cursor: pointer; } 
.sec-calendar-navigation-icon svg { fill: var(--sec-primary-background-color); }

#card-element { border: 1px solid #ced4da; border-radius: 4px; padding: 10px; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; } 
#card-element:focus { border-color: #80bdff; box-shadow: 0 0 8px rgba(128, 189, 255, 0.6); } 
#sec-payment-method { display: flex; gap: 10px; margin-bottom: 20px; } 
#sec-payment-method .sec-payment-option { display: flex; width: 50%; } 
.sec-payment-option input { display: none; } 
.sec-payment-option .icon { margin-right: 10px; font-size: 24px; } 
.sec-payment-option label { cursor: pointer; } 
.sec-payment-option:hover { background-color: #f8f9fa; border-color: #80bdff; } 
.sec-payment-option input:checked + .content { background-color: #80bdff; color: #fff; } 
#sec-payment-method .sec-payment-option .sec-content { font-size: 13px; font-weight: 400; } 
#sec-payment-method .sec-payment-option input[type="radio"]:checked + .sec-content { background: #000000; border-color: #000; } 
.sec-payment-content-radio { position: relative; z-index: 99; display: flex; gap: 5px; align-items: center; justify-content: center; } 
#sec-payment-method .sec-payment-option > input { display: none!important; } 
input[type="radio"]:checked + .sec-content .sec-payment-content-radio svg { fill: #fff; } 
input[type="radio"]:checked + .sec-content .sec-payment-content-radio span { color: #fff; } 
.sec-payment-content-radio span { font-weight: 600; line-height: 1; } 
#sec-payment-method .sec-payment-option .sec-content { border: 1px solid #ced4da; border-radius: 4px; padding: 10px 10px; cursor: pointer; transition: background-color 0.3s, border-color 0.3s; position: relative; z-index: 222; width: 100%; }

.sec-summary { max-width: 100%; border: 1px solid #ccc; padding: 20px; border-radius: 8px; margin-bottom: 0; } 
.sec-summary h2 { text-align: center; margin-bottom: 20px; } 
.sec-events { margin-bottom: 0px; } 
.sec-events h3 { font-size: 16px; margin-bottom: 0; margin-top: 0; } 
.sec-events .sec-event { display: flex; justify-content: space-between; font-size: 14px; } 
.sec-subtotal { display: flex; justify-content: space-between; font-size: 16px; font-weight: bold; margin-top: 10px; padding-top: 0; margin-bottom: 0; } 
.sec-wizard-step.sec-wizard-screen-payment .sec-wizard-banner { /*display: none;*/ } 
.sec-event-subheading { border-bottom: 2px solid #ddd; padding-bottom: 10px; margin-bottom: 10px; } 
.sec-event-summary { margin-bottom: 20px; border-bottom: 2px dotted gainsboro; padding-bottom: 10px; margin-top: 20px; }

.sec-summary-card { border: 1px solid #ccc; border-radius: 8px; padding: 16px; max-width: 100%; font-family: Arial, sans-serif; } 
.sec-summary-card h2 { margin-top: 0; } 
.sec-summary-icon { display: inline-block; width: 20px; height: 20px; background-color: #ccc; border-radius: 50%; margin-right: 8px; vertical-align: middle; } 
.sec-summary-info { display: flex; align-items: center; margin-bottom: 8px; } 
.sec-summary-info p { margin: 0; } 
#sec_add_calender_links li { list-style: none; } 
#sec-wizard-one-to-one-submitsion .sec-content-details a:hover { text-decoration: none; color: #fff; background: #5d78ff; color: #fff!important; border-color: rgba(0, 0, 0, 0); } 
#sec-wizard-one-to-one-submitsion .sec-content-details a:hover p { color: #fff; } 
h4.sec-widget-title.sec-title { font-size: 18px; margin: 0; } 
.sec-add-to-calender-title { margin-top: 0; } 
div#oneonone-scheduled-summary { margin-top: 10px; } 
#sec-wizard-one-to-one-submitsion .sec-wizard-step .sec-form-container > h2 { font-size: 20px; } 
#sec-wizard-one-to-one-submitsion .sec-wizard-step .sf-center-text-thank-you h2, 
#sec-wizard-one-to-one-submitsion .sec-wizard-step .sf-center-text-thank-you p { text-align: center; } 
.sec-thank-you-icon { text-align: center; } 
.sec-thank-you-icon img { width: 100px; }


/*Common CSS*/
#sec-primary .sec-action-btn.sec-loading { color: transparent!important; pointer-events: none; position: relative; } 
#sec-primary .sec-action-btn::after { content: ''; display: block; width: 1.2em; height: 1.2em; position: absolute; left: calc(50% - 0.75em); top: calc(50% - 0.75em); border: 0.15em solid transparent; border-right-color: white; border-radius: 50%; animation: button-anim 0.7s linear infinite; opacity: 0; } 
#sec-primary .sec-action-btn.sec-loading::after { opacity: 1; } 

