root {
    --saaspricing-primary:#54595F;
    --saaspricing-wild-sand:#F7F7F7;
    --saaspricing-platinum:#DEE1E2;
    --saaspricing-boulder:#4E4E4E;
    --saaspricing-mako:#474F53;
    --saaspricing-secondary:#474F53;
    --saaspricing-white:#ffffff;
    --saaspricing-black:#000000;
    --saaspricing-dark-gray:#505050;
    --saaspricing-box-shadow:#00000015;
    --saaspricing-yellow:#f4b400;
    --saaspricing-pastel-green: #88cf8f;
    --saaspricing-dark-slate-blue: #2e394d;
    --saaspricing-mint-green: #61ce70;
    --saaspricing-light-gray: #e2e2e2;
    --saaspricing-red: #ff0000;
}

/* Comparison table */
h2.saaspricing-heading-title {
    line-height: normal;
}

table.saaspricing-table{
    width: 100%;
}

/* Interactive pricing  calculator  */
.saasp-interactive-cal-main a:not([href]):not([tabindex]),
.saasp-interactive-cal-main a:not([href]):not([tabindex]):hover {
    color: var(--saaspricing-primary);
    text-decoration: none;
}

.paragraph-field {
    margin-bottom: 0 !important;
}

.elementor-widget-container:has( .saasp-interactive-cal-main ) {
    background-color: var(--saaspricing-wild-sand);
    border-radius: 20px;
    overflow: hidden;
}

.saasp-cal-elements input#saasp-quantity {
    width:100%;
    padding: .375rem 2.25rem .375rem .75rem;
}

.saasp-cal-elements .row div.col-md-12 {
    padding: 10px 0;
}

.saasp-cal-elements p.saasp-field-label {
    font-size: 24px;
    font-weight: 600 ;
}

.saasp-cal-elements .field-typography {
    font-size: 16px;
}

.col.saasp-cal-cta {
    padding: 0;
}

.col.saasp-cal-cta .cta-wrapper {
    background-color: var(--saaspricing-primary);
    height: 100%;
    display: flex;
    align-items: wc;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.saasp-brange-wrapper {
    position: relative;
}

.flex-md-row.flex-column.saasp-interactive-cal-main .saasp-cal-elements,
.flex-column.saasp-interactive-cal-main .saasp-cal-elements {
    padding: 30px 25px;
}

.flex-md-row.flex-column.saasp-interactive-cal-main .col.saasp-cal-cta .cta-wrapper {
    border-radius: 0;
}

.flex-column.saasp-interactive-cal-main .col.saasp-cal-cta .cta-wrapper {
    border-radius: 20px;
}
.flex-column.saasp-interactive-cal-main .col.saasp-cal-cta {
    padding: 0 37px 30px 37px;
}
.flex-md-row.flex-column.saasp-interactive-cal-main .col.saasp-cal-cta {
    padding: 0;
}

.saasp-interactive-cal-main h4.saasp-icta-title {
    font-family: inherit;
    color: var(--saaspricing-white);
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 400;
    margin: 0;
}

span.saasp-cta-price-symbol span.calculator-price, 
span.saasp-cta-price-symbol{
    font-family: inherit ;
    color: var(--saaspricing-white);
    font-size: 64px;
    line-height: normal;
    margin-left: -15px;
}

.saasp-order-now.grayish-blue, .saasp-order-now.grayish-blue:hover {
    color: var(--saaspricing-primary);
    background-color: var(--saaspricing-white);
}

.saasp-order-now{
    font-size: 20px;
    padding: 15px 40px;
    color: var(--saaspricing-white);
    background-color: var(--saaspricing-secondary);
    font-weight: 600;
    text-transform: uppercase;
    border: none;
}

input[type=range] {
    margin: 0;
}

input:focus{
    border-style: none;
    outline: none;
}

/* Range */
.saasp-range-wrap {
    position: relative;
}

.saasp-range {
    width: 100%;
}

.saasp-range-wrap .min-max small{
    color: var(--saaspricing-black);
}

.saasp-display-grid{
    display: grid;
    align-items: center;
}

.bubble.saasp-null-label {
    top: -10px;
}

.bubble {
    background: var(--saaspricing-black);
    color: var(--saaspricing-white);
    padding: 0px 16px;
    position: absolute;
    border-radius: 4px;
    left: 50%;
    transform: translateX(-45%);
    top: -25px;
    font-size: 12px;
}

.bubble::after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-top: 10px solid var(--saaspricing-black);
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    margin-top: -1px;
}


.saasp-range[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    cursor: pointer;
    outline: none;
    overflow: hidden;
    border-radius: 16px;
    height: 15px;
}

/* Track: webkit browsers */
.saasp-range[type="range"]::-webkit-slider-runnable-track {
    height: 15px;
    background: var(--saaspricing-light-gray);
    border-radius: 16px;
}

/* Track: Mozilla Firefox */
.saasp-range[type="range"]::-moz-range-track {
    height: 15px;
    background: var(--saaspricing-light-gray);
    border-radius: 16px;
}

/* Thumb: webkit */
.saasp-range[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    height: 16px;
    width: 16px;
    background-color: var(--saaspricing-white);
    border-radius: 50%;
    margin-top:-1px;
    box-shadow: -2007px 0 0 2000px rgb(70, 61, 57);
}

/* Thumb: Firefox */
.saasp-range[type="range"]::-moz-range-thumb {
    height: 16px;
    width: 16px;
    background-color: var(--saaspricing-white);
    border-radius: 50%;
    box-shadow: -2007px 0 0 2000px rgb(70, 61, 57);
}

input[type="checkbox"]:checked, input[type=range]::-webkit-slider-thumb {
    border:none !important;
}

.form-check-input:focus {
    box-shadow:unset;
}

.min-max {
    display: flex;
    justify-content: space-between;
    color: var(--saaspricing-white);
}

.flex-column.saasp-interactive-cal-main .saasp-cal-cta-top {
    margin-top: 37px;
}

.flex-column.flex-md-row.saasp-interactive-cal-main .saasp-cal-cta-top {
    margin-top: 0;
}

.form-check-input {
    --bs-form-check-bg: var(--bs-form-control-bg);
    width: 1em !important;
    height: 1em !important;
    margin-top: .25em;
    vertical-align: top;
    background-color: var(--bs-form-check-bg);
    background-image: var(--bs-form-check-bg-image);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: var(--bs-border-width) solid var(--bs-border-color) !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
    print-color-adjust: exact;
}


input[type=checkbox]:after {
    content: "";
    opacity: 0;
    display: block;
    left: 5px;
    top: 2px;
    position: absolute;
    width: 6px;
    height: 10px;
    border: 3px solid var(--saaspricing-white);
    border-top: 0;
    border-left: 0;
    transform: rotate(30deg);
}

input[type=radio]:after {
    width: 8px;
    height: 8px;
    background: var(--saaspricing-white);
}

.saasp-parargraph-wrapper {
    display: flex;
    gap: 10px;
}
.saasp-paragraph-icon svg {
    width: 40px;
    height: 40px;
}

.saasp-alert-wraper{
	text-align:center;
	padding: 8px 8px;
	display:none;
	background: var(--saaspricing-black);
}
.saasp-alert-wraper .saasp-alert-notice{
	color: var(--saaspricing-red);
	font-size:16px;
}

/* SaasPro Content Switch*/
.saasp-content-switcher-wrapper {
    display: block;
    text-align: center;
  }
  
.saasp-cs-layout-skin1 .saasp-cs-switch-wrapper {
    display: inline-flex;
    flex-wrap: wrap;
    padding: 8px 12px;
    background: var(--saaspricing-primary);;
    border-radius: 50px;
}
  
/* Skin1 Head */
.saasp-cs-switch-container {
    display: block;
    text-align: center;
}

.saasp-cs-layout-skin1 .saasp-cs-label-wrapper {
    display: inline-block;
    overflow: hidden;
}

.saasp-cs-layout-skin1 .saasp-content-switch-button {
    border-radius: 50px;
    padding: 8px 12px;
    overflow: hidden;
    display: block;
    min-width: 150px;
    position: relative;
    text-align: center;
    margin: 3px;
}

.saasp-cs-layout-skin1 .saasp-content-switch-button.active {
    color: var(--saaspricing-dark-gray);
}

.saasp-cs-layout-skin1 .saasp-content-switch-button {
    color: var(--saaspricing-white);
}

.saasp-cs-layout-skin1 .saasp-content-switch-button:before {
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
    content: "";
    width: 0;
    position: absolute;
    right: 0;
    transition: all 300ms ease-out;
}

.saasp-cs-layout-skin1 .saasp-content-switch-button.active:before {
    width: 100%;
    left: 0;
    right: auto;
    background-color: var(--saaspricing-white);;
}

.saasp-cs-layout-skin1 .saasp-content-switch-label {
    position: relative;
}

/*
* SaasPro Switcher Content CSS
*/

.saasp-cs-switch-container a.saasp-content-switch-button {
    text-decoration: none;
}

.saasp-cs-content-section {
    display: none;
}

.saasp-cs-content-section.active {
    display: block;
}
  
@media only screen and (max-width: 768px) {
    .saasp-cs-switch-wrapper {
        display: inline-block !important;
    }
}
  
/* Skin 2 */
.saasp-cs-layout-skin2 .saasp-cs-switch-wrapper {
    display: inline-flex;
    flex-wrap: wrap;
    padding: 0px;
    background: none;
}

.saasp-cs-layout-skin2 .saasp-cs-label-wrapper {
    display: inline-block;
}
  
.saasp-cs-layout-skin2 .saasp-content-switch-button {
    width: auto;
    margin: 3px 8px;
    padding: 10px 12px;
    background-color: var(--saaspricing-light-gray);
    overflow: hidden;
    display: block;
    position: relative;
    text-align: center;
    border-radius: 5px;
    border: 1px solid rgba(130, 130, 130, 0.26);
    color: rgba(71, 71, 71, 0.44);
}
  
.saasp-cs-layout-skin2 .saasp-content-switch-button.active {
    box-shadow: 0px 10px 34px -9px rgba(0, 0, 0, 0.38);
    background-color: var(--saaspricing-white);
    color: var(--saaspricing-dark-gray);
    border-color: var(--saaspricing-white);
}

h5.saasp-cs-label {
    margin: 0px;
}
  
/* Skin 3 */
.saasp-cs-layout-skin3 .saasp-cs-switch-wrapper {
    display: block;
    justify-content: center;
    align-items: center;
}

.saasp-content-switch-label.primary-label {
    margin-right: 30px;
}

.saasp-content-switch-label.secondary-label {
    margin-left: 30px;
}
  
.saasp-cs-layout-skin3 .saasp-cs-switch-label {
    position: relative;
    display: inline-block;
    width: 4.5em;
    height: 2.3em;
    vertical-align: middle;
}
  
.saasp-cs-layout-skin3 .saasp-content-switch-label {
    margin: 0px;
    display: inline-block;
}

.saasp-cs-layout-skin3 .saasp-cs-switch-button {
    display: inline-block;
}

.saasp-cs-layout-skin3 .saasp-cs-label {
    display: inline-block;
}

.saasp-cs-layout-skin3 .saasp-cs-switch-label input.saasp-content-toggle-switch {
    display: none;
}
  
.saasp-cs-layout-skin3
    .saasp-cs-switch-label
    input.saasp-content-toggle-switch
    + span {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    -webkit-border-radius: 1.5em;
    border-radius: 1.5em;
    background-color: var(--saaspricing-dark-gray);
    border: 2px solid var(--saaspricing-dark-gray);
}

.saasp-cs-layout-skin3
    .saasp-cs-switch-label
    input.saasp-content-toggle-switch
    + span:before {
    position: absolute;
    content: "";
    height: 30px;
    width: 30px;
    left: -3px;
    transform: translateY(-52%);
    top: 50%;
    transition: 0.4s;
    transition: 0.4s;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background: var(--saaspricing-white);
    border: 2px solid var(--saaspricing-dark-gray);
}

body.rtl
    .saasp-cs-layout-skin3
    .saasp-cs-switch-label
    input.saasp-content-toggle-switch
    + span:before {
    left: unset;
    right: 4px;
}
  
.saasp-cs-layout-skin3
    .saasp-cs-switch-label
    input:checked.saasp-content-toggle-switch
    + span:before {
    transform: translate(36px, -52%);
}

body.rtl
    .saasp-cs-layout-skin3
    .saasp-cs-switch-label
    input:checked.saasp-content-toggle-switch
    + span:before {
    transform: translate(-36px, -52%);
}
  
.saasp-content-switch-label.active {
    color: var(--saaspricing-mint-green);
}
  
/* Skin 4 */
.saasp-cs-layout-skin4 .saasp-cs-switch-wrapper {
    display: block;
}

.saasp-cs-layout-skin4 .saasp-content-switch-label.primary-label {
    margin-right: 30px;
}

.saasp-cs-layout-skin4 .saasp-content-switch-label.secondary-label {
    margin-left: 30px;
}
  
.saasp-cs-layout-skin4 .saasp-content-switch-label {
    display: inline-block;
}

.saasp-cs-layout-skin4 .saasp-cs-switch-label {
    position: relative;
    display: inline-block;
    width: 70px;
    height: 20px;
    vertical-align: middle;
}

.saasp-cs-layout-skin4 .saasp-cs-label {
    display: inline-block;
}

.saasp-cs-layout-skin4 .saasp-content-toggle-switch {
    display: none;
}

.saasp-cs-layout-skin4 .saasp-content-toggle-switcher {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    -webkit-border-radius: 1.5em;
    border-radius: 1.5em;
    background: var(--saaspricing-dark-gray);
    border: 2px solid var(--saaspricing-dark-gray);
}

.saasp-cs-layout-skin4 .saasp-cs-switch-button {
    display: inline-block;
}

.saasp-cs-layout-skin4 .saasp-content-toggle-switcher:before {
    position: absolute;
    content: "";
    height: 34px;
    width: 34px;
    left: -12px;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 50%;
    border: 2px solid var(--saaspricing-dark-gray);
    background: var(--saaspricing-white);
    -webkit-transition: 0.4s;
    transition: 0.4s;
    -webkit-box-shadow: 3px 3px 6px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 3px 3px 6px 1px rgba(0, 0, 0, 0.2);
}

.saasp-cs-layout-skin4 .saasp-cs-switch-container {
    padding: 15px 0px;
}

body.rtl .saasp-cs-layout-skin4 .saasp-content-toggle-switcher:before {
    right: -12px !important;
}

.saasp-cs-layout-skin4 input:checked + .saasp-content-toggle-switcher:before {
    transform: translate(55px, -50%);
}

.saasp-cs-layout-skin3 .saasp-cs-label {
    vertical-align: middle;
}
  
body.rtl
    .saasp-cs-layout-skin4
    input:checked
    + .saasp-content-toggle-switcher:before {
    transform: translate(-55px, -50%);
}

@media screen and (max-width:1400px) {
    .saaspricing-main {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .saaspricing-table.table-column-4 {
        min-width: 1106px !important;
    }
    
    .saaspricing-table.table-column-5 {
        min-width: 1383px !important;
    }
    
    .saaspricing-table.table-column-6 {
        min-width: 1660px !important;
    }
}

@media only screen and (max-width: 767px) {
    .saasp-mob-12 {
      width: 100% !important;
    }
    .saasp-mob-6 {
      width: 50% !important;
    }
    .saasp-mob-4 {
      width: 33.3% !important;
    }
    .saasp-mob-3 {
      width: 25% !important;
    }

  }
  
  /* CSS for tablets (768px - 1024px) */
  @media only screen and (min-width: 768px) and (max-width: 1024px) {
    .saasp-tab-12 {
        width: 100% !important;
      }
      .saasp-tab-6 {
        width: 50% !important;
      }
      .saasp-tab-4 {
        width: 33.3% !important;
      }
      .saasp-tab-3 {
        width: 25% !important;
      }
  }
  
  /* CSS for desktop devices (1025px and above) */
  @media only screen and (min-width: 1025px) {
    .saasp-desk-12 {
        width: 100% !important;
      }
      .saasp-desk-6 {
        width: 50% !important;
      }
      .saasp-desk-4 {
        width: 33.3% !important;
      }
      .saasp-desk-3 {
        width: 25% !important;
      }
  }