.main-rc-tc {
     padding: 25px 30px;
     background: var(--background-color);
 }

 .switch_rc_tc {
     margin: auto;
     --_switch-bg-clr: var(--text-color-white);
     --_switch-padding: 4px;
     /* padding around button*/
     /* slider color unchecked */
     --_slider-bg-clr-on: var(--text-theme-color);
     ;
     /* slider color checked */
     --_label-padding: 1rem 2rem;
     /* padding around the labels -  this gives the switch it's global width and height */
     --_switch-easing: cubic-bezier(0.47, 1.64, 0.41, 0.8);
     /* easing on toggle switch */
     color: white;
     width: fit-content;
     /*    width: 90%; */
     display: flex;
     justify-content: center;
     position: relative;
     border-radius: 30px;
     cursor: pointer;
     display: grid;
     grid-template-columns: repeat(2, minmax(0, 1fr));
     position: relative;
     isolation: isolate;
 }

 .switch_rc_tc input[type="checkbox"] {
     position: absolute;
     width: 1px;
     height: 1px;
     padding: 0;
     margin: -1px;
     overflow: hidden;
     clip: rect(0, 0, 0, 0);
     white-space: nowrap;
     border-width: 0;
 }

 .switch_rc_tc>span {
     display: grid;
     place-content: center;
     transition: opacity 300ms ease-in-out 150ms;
     padding: var(--_label-padding);
     color: var(--text-color-white);
 }

 .switch_rc_tc::before,
 .switch_rc_tc::after {
     content: "";
     position: absolute;
     border-radius: inherit;
     transition: inset 150ms ease-in-out;
 }


 /* switch slider */

 .switch_rc_tc::before {
     background-color: var(--text-theme-color);
     inset: var(--_switch-padding) 50% var(--_switch-padding) var(--_switch-padding);
     transition: inset 500ms var(--_switch-easing), background-color 500ms ease-in-out;
     z-index: -1;
     box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.3);
 }


 /* switch bg color */

 .switch_rc_tc::after {
     background-color: var(--_switch-bg-clr);
     inset: 0;
     z-index: -2;
 }


 /* switch hover & focus */

 .switch_rc_tc:has(input:checked):hover>span:first-of-type,
 .switch_rc_tc:has(input:not(:checked)):hover>span:last-of-type {
     opacity: 1;
     transition-delay: 0ms;
     transition-duration: 100ms;
 }

 .switch_rc_tc:has(input:checked)>span:first-of-type,
 .switch_rc_tc:has(input:not(:checked))>span:last-of-type {
     color: var(--text-color-1);
 }


 /* switch hover */


 /* checked - move slider to right */

 .switch_rc_tc:has(input:checked)::before {
     background-color: var(--_slider-bg-clr-on);
     inset: var(--_switch-padding) var(--_switch-padding) var(--_switch-padding) 50%;
 }


 /* checked - set opacity */

 .switch_rc_tc>span:last-of-type,
 .switch_rc_tc>input:checked+span:first-of-type {
     opacity: 0.75;
 }

 .switch_rc_tc>input:checked~span:last-of-type {
     opacity: 1;
 }

 .section-sub-text {
     font-size: 1rem;
     text-align: left;
     margin-left: 35px;
     font-weight: normal;
     color: var(--text-color-light-black);

 }

 @media(max-width:600px) {
     .switch_rc_tc {
         --_label-padding: .5rem 1rem;
         font-size: 0.8rem;
     }

     .main-rc-tc {
         padding: 15px 10px;
     }
 }