@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');

html {height: 100%;}
body {font-family: "Poppins", sans-serif;font-weight: 400;font-size: 14px;background: #ffffff;color: #000000;line-height: 1.4;}
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, a, address, img, strong, b, center, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, footer, header, menu, nav, section {margin: 0;padding: 0;border: 0;font-size: 100%;}
*, ::after, ::before {box-sizing: border-box;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
img {max-width: 100%;height: auto;}
ol, ul {list-style: none;padding: 0px;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {font-weight: inherit;}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {text-decoration: none;}
h1, h2, h3, h4, h5, h6 {margin-bottom: 15px;font-weight: normal;color: #0B0A14;}
p {margin: 0 0 15px 0;line-height: initial;}
em, i {font-style: italic;}
b, strong {font-weight: bold;}
a, a:visited, a:focus, a:hover {text-decoration: none;outline: 0;}
p a, p a:visited {line-height: inherit;}
a:focus, a:hover {text-decoration: none;outline: 0;color: #0F99D6;}
.clearfix:before, .clearfix:after {content: '\0020';display: block;overflow: hidden;visibility: hidden;width: 0;height: 0;}
.clearfix, .clearfix:after {clear: both;}

/* Auth Module Css starts */
.auth_body {background: linear-gradient(to right, #fff, #fff);padding:0 ;}
.auth_wrapper {align-content: center; display:flex; max-width:500px; margin:auto; flex-wrap: wrap; align-items: center;justify-content: center;padding:0px;}
.auth_wrapper .auth_box {padding:40px; background: #ffffff;border-radius:20px; border:1px solid #ededed; width: 100%;max-height: calc(100vh - 24px);overflow: auto;overflow: -moz-scrollbars-none;-ms-overflow-style: none;scrollbar-width: none;}
.auth_wrapper .auth_box::-webkit-scrollbar, body::-webkit-scrollbar {display: none;}
.auth_wrapper .logo img {width: 100%;max-width:150px;}
.auth_wrapper .auth_box .title_top h2 {font-size: 22px; font-weight: 400; margin-bottom: 5px;}
.auth_wrapper .auth_box .title_top h3 {font-size: 15px;color: #565656;}
.auth_wrapper .auth_box form .form-group {position: relative;margin-bottom: 10px;}
.auth_wrapper .auth_box form .form-group label {display: block;font-size: 15px;color: #565656;margin-bottom: 3px;}
.auth_wrapper .auth_box form .form-control {border: 1px solid #f0f0f0;font-size: 14px;color: #000000;border-radius:5px;padding: 5px 16px;height: 47px;line-height: 47px;}
.auth_body .btn {border-radius: 5px;box-shadow: none !important;outline: 0 !important;background: #0172AF;color: #ffffff; font-size: 15px;width: 100%;padding: 12px 10px;}
.auth_body .btn:hover, .auth_body .btn:focus, .auth_body .btn:active {background: #349CA3; border-color:#349CA3; }
.auth_wrapper form .ex-link {font-size: 14px;color: #565656;}
.auth_wrapper form .ex-link:hover, .auth_wrapper form .ex-link:focus, .auth_wrapper form .ex-link:active {color: #000000;}
.or_separator {position: relative;width: 100%;max-width: 373px;margin: 0px auto;text-align: center;padding: 22px 2px;}
.or_separator span {display: flex;align-items: center;justify-content: center;width: 36px;margin: 0px auto;font-size: 14px;color: #565656;background: #ffffff;position: relative;z-index: 1;}
.or_separator::after {background: #D2D2D2;height: 1px;content: "";left: 0px;right: 0px;width: 100%;position: absolute;top: 50%;transform: translateY(-50%);z-index: 0;}
.social-links .s-btn {display: flex;align-items: center;justify-content: center;border-radius: 10px;background: #EEEEEE;overflow: hidden;min-height: 52px;margin-bottom: 8px;color: #000000;font-size: 14px;font-weight: 500;gap: 10px;}
.social-links .s-btn>img {width: 100%;max-width: 15px;}
.social-links .s-btn:last-child {margin-bottom: 0px;}
.social-links .s-btn:hover, .social-links .s-btn:focus, .social-links .s-btn:active {background: #e7e7e7;}
.link-arrow {position: relative;display: inline-flex;align-items: center;column-gap: 8px;color: #349CA3 !important;}
.auth_wrapper .ex-content p, .auth_wrapper .ex-content p a {color: #565656;font-size: 14px;}
.auth-links {gap: 8px;}
.auth-links li a {color: #565656;font-size: 14px;}
.auth-links li a:hover, .auth-links li a:focus, .auth-links li a:active {color: #349CA3;}
.link {color: #2498F0 !important;}
.link:hover, .link:focus {color: #0041d9 !important;}
.form-group-icon {position: relative;}
.form-group-icon .ico {position: absolute;top: 50%;transform: translateY(-50%);right: 16px;cursor: pointer;z-index: 2;}
.form-group-icon .ico img {width: 23px;}
.form-group-icon .form-control {padding-right: 36px !important;}
/* Auth Module Css ends */

/* Header Css Starts */
.header {padding: 34px 64px;background: #ffffff;position: fixed;top: 0px;left: 0px;right: 0px;width: 100%;z-index: 99;-webkit-transition: all 300ms linear;-moz-transition: all 300ms linear;-o-transition: all 300ms linear;-ms-transition: all 300ms linear;transition: all 300ms linear;}
.sticky-header .header {box-shadow: 0px 4px 40px 0px rgba(0, 0, 0, 0.25);padding-top: 16px;padding-bottom: 16px;}
.header .navbar {max-width: 1490px;margin: 0px auto;}
.header .navbar .navbar-brand {width: 145px;}
.header .navbar .navbar-brand img {width: 100%;object-fit: contain;}
.header .navbar .navbar-nav {column-gap: 50px;}
.header .navbar .navbar-nav .nav-item .nav-link {padding: 0px;color: #727272;font-size: 17px;font-weight: 400;}
.header .navbar .navbar-nav .nav-item.active .nav-link, .header .navbar .navbar-nav .nav-item .nav-link:hover {color: #000000;}
.header .header-right a {font-size: 16px;color: #000000;}
.header .header-right .btn {border-radius: 20px;text-align: center;color: #ffffff;font-size: 16px;background: #000000;padding: 10px 30px;margin-left: 24px;border: 0px;min-width: 198px;}
.header .header-right .btn:hover, .header .header-right .btn:focus {background: linear-gradient(to right, #0172AF, #74FEBD);color: #ffffff;}

/* Body Css starts */
.container {max-width: 1350px;margin: 0px auto;}
.wrapper {padding-top: 100px;}

.hero-section {position: relative;padding: 55px 0px;}
.hero-section .caption {padding-top: 60px;}
.hero-section .caption .caption-title {font-size: 72px;font-weight: 500;letter-spacing: -4px;}
.hero-section .caption .caption-title span {background: linear-gradient(to right, #0172AF, #74FEBD);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}

.hero-section .caption p {font-size: 24px;font-weight: 300;}
.hero-section .btn-group {display: flex;flex-wrap: wrap;gap: 15px;}
.hero-section .btn-group .btn-site {font-size: 17px;font-weight: 300;min-width: 250px;text-align: center;padding: 12px 16px;border-radius: 20px;box-shadow: 0px 0px 60px 0px rgba(0, 0, 0, 0.25);}
.hero-section .btn-group .btn-site.btn-dark {border: 0px;}
.hero-section .btn-group .btn-site.btn-dark:hover {background: linear-gradient(to right, #0172AF, #74FEBD);}

.title-column {width: 100%;max-width: 991px;margin: 0px auto;}
.title-column p {font-size: 24px;font-weight: 300;}
.section-title {color: #000000;margin-bottom: 20px;font-weight: 500;letter-spacing: -1.12px;line-height: initial;}

.interface-section .section-title{font-size: 34px;}
.interface-section .title-column p {font-size: 16px;}
.price-section .title-column {max-width: 796px;}
.price-section  .title-column p {font-size: 24px;}
.price-section .section-title {font-size: 40px;color: #000000;margin-bottom: 20px;font-weight: 500;letter-spacing: -1.12px;line-height: initial;}

.section-spacing.interface-section {position: relative;padding: 90px 0px 50px !important;}
.interface-section .owl-carousel .item {margin: 0px;}
.interface-section .owl-carousel .box {display: flex;justify-content: center;align-items: center;flex-direction: column;background: #ffffff;padding: 34px 34px 20px;text-align: center;border: 1px solid #E0E0E0;margin-bottom: 20px;border-radius: 22px;overflow: hidden;}
.interface-section .owl-carousel .box .icon {margin-bottom: 35px;}
.interface-section .owl-carousel .box .icon img {max-width: 68px;margin: 0px auto;}
.interface-section .owl-carousel .box .content h3{font-size: 24px;font-weight: 500;margin-bottom: 15px;}
.interface-section .owl-carousel .box .content p{font-size: 16px;font-weight: 300;}
.interface-section .owl-carousel.row [class^='col-']{padding: 0px 7px;}

.sales-section{position: relative;display: flex;align-items: center;}
.sales-section .sales-content {width: 100%;max-width: 800px;position: relative;z-index: 2;}
.sales-section .section-title {position: relative;z-index: 2;font-size: 40px;margin-bottom: 50px;}
.sales-content .row {margin: 0px -7.5px;width: 100%;max-width: 792px;}
.sales-content .row .col {padding: 0px 7.5px;flex: 0 0 33.33%;max-width: 33.33%;}
.sales-content .col .box {box-shadow: 0px 0px 60px 0px rgba(0, 0, 0, 0.25);padding: 30px;border-radius: 10px;text-align: center;background: #ffffff;}
.sales-content .box .num-text {color: #0172AF;font-size: 55px;font-weight: 500;margin-bottom: 15px;}
.sales-content .box .content h3 {font-size: 18px;font-weight: 500;margin-bottom: 20px;}
.sales-content .box .content p {font-size: 16px;font-weight: 200;margin-bottom: 0px;}

.checked-list ul {padding: 0px;list-style-type: none;display: flex;flex-direction: column;gap: 12px;}
.checked-list ul li {background: #ffffff;overflow: hidden;flex: 0 0 100%;max-width: 595px;width: 100%;border-radius: 10px;box-shadow: 0 0px 40px 0px rgba(0, 0, 0, 0.10);padding: 14px 15px;display: flex;align-items: center;column-gap: 13px;font-size: 20px;font-weight: 500;color: #000000;}
.checked-list ul li span {flex: 0 0 30px;max-width: 30px;}
.orders-section.section-spacing  {padding-top: 80px !important;}

.orders-section .section-title {font-size: 40px;}
.orders-section {position: relative;padding: 0px 0px 75px;}
.orders-section p {font-size: 24px;font-weight: 300;}

.price-section {position: relative;}
.price-section .row .box {box-shadow: 0px 0px 60px 0px rgba(0, 0, 0, 0.25);padding: 30px;border-radius: 40px;text-align: center;margin: 0px auto;background: #ffffff;}
.price-section .row .box h2 {font-weight: 500;font-size: 32px;margin-bottom: 5px;}
.price-section .row .box p{font-weight: 200;font-size: 16px;margin-bottom: 20px;}
.price-section .row .box .price {font-size: 64px;padding: 10px 0px;}
.price-section .row .box .price sub {font-size: 16px;font-weight: 200;position: relative;top: -3px;}
.price-section .row .box .content h4 {font-weight: 400;font-size: 15px;margin-bottom: 10px;}
.price-section #pricing_slider {width: 100%;max-width: 730px;margin: 0px auto;}
.price-section .row .box .content p {font-size: 14px;font-weight: 200;margin-bottom: 10px;}
.price-section .row .box .btn {border-radius: 20px;min-height: 62px;display: flex;align-items: center;justify-content: center;font-size: 16px;border: 0px;}
.price-section .row .box .btn.btn:hover {background: linear-gradient(to right, #0172AF, #74FEBD);}
.section-spacing {padding: 130px 0px 50px !important;}
.section-spacing.pb-0 {padding-bottom: 0px !important;}
.section-spacing.pt-0 {padding-top: 0px !important;}
.price-section .row .box p.font-lg {font-size: 13px;}

.testimonial-section {position: relative;overflow: hidden;}
.testimonial-slider-section {position: relative;top: -30px;width: 100%;max-width: 1500px;margin: 0px auto;}
.testimonial-slider-section .owl-carousel .item {padding: 50px 35px;}
.testimonial-slider-section .owl-carousel .owl-item.active.center .item {transform: scale(1.2);-moz-transform: scale(1.2);-webkit-transform: scale(1.2);-o-transform: scale(1.2);}
.testimonial-slider-section .owl-stage {padding: 50px 0px;}
.testimonial-slider-section .card {padding: 30px 60px;background: #fff;border-radius: 44px;box-shadow: 0 0px 30px 0px rgba(0, 0, 0, 0.25);text-align: center;border: 0px;}
.testimonial-slider-section .card p {font-weight: 200;font-size: 16px;}
.testimonial-slider-section .card .name {font-weight: 500;margin-bottom: 0px;font-size: 18px;}
.testimonial-slider-section .card .position {font-size: 16px;font-weight: 200;}
.testimonial-slider-section .owl-nav button {position: absolute;top: 50%;transform: translateY(-50%);background: none;}
.testimonial-slider-section .owl-nav button {margin: 0px !important;}
.testimonial-slider-section .owl-nav button span{display: block;width: 40px;background-position: center;background-repeat: no-repeat;text-indent: -9999px;}
.testimonial-slider-section .owl-nav button.owl-prev {left: -45px;}
.testimonial-slider-section .owl-nav button.owl-next {right: -45px;}
.testimonial-slider-section .owl-dots {text-align: center;margin-top: 20px;display: block !important;}

.testimonial-slider-section .owl-theme .owl-dots .owl-dot.active span, .testimonial-slider-section .owl-theme .owl-dots .owl-dot:hover span {background: #ffffff;}
.testimonial-slider-section .owl-theme .owl-dots .owl-dot span {width: 13px;height: 13px;margin: 0px 0px;background: #E8E8E8;}
.testimonial-slider-section .card .auth-img img {height: 94px;object-fit: contain;object-position: center;margin: 0px auto;}
.testimonial-slider-section .owl-nav button.owl-prev, .testimonial-slider-section .owl-nav button.owl-next {width: 40px;height: 40px;display: inline-flex;justify-content: center;align-items: center;background: rgb(217 217 217 / 60%) !important;text-align: center;background-repeat: no-repeat !important;background-position: center;}
.testimonial-slider-section .owl-nav button:hover, .testimonial-slider-section .owl-nav button:focus {background-color: transparent;}
.testimonial-slider-section .owl-nav button.owl-prev span {background-image: url(../images/angle-left.png) !important;}
.testimonial-slider-section .owl-nav button.owl-next span{background-image: url(../images/angle-right.png) !important;}
.testimonial-slider-section .owl-carousel .owl-dots.disabled, .testimonial-slider-section .owl-carousel .owl-nav.disabled {display: block !important;}
.testimonial-slider-section .owl-carousel .owl-nav {position: absolute;z-index: 2;height: 40px;margin: 0px auto !important;width: 100% !important;max-width: 640px;left: 0px;right: 0px;display: flex !important;justify-content: space-between;top: 50%;transform: translateY(-50%);}
.testimonial-slider-section .owl-carousel .owl-nav.disabled, .testimonial-slider-section .owl-carousel .owl-nav {position: absolute;z-index: 2;height: 40px;margin: 0px auto !important;width: 100% !important;max-width: 640px;left: 0px;right: 0px;display: flex !important;justify-content: space-between;}

.faq-section {position: relative;}
.faq-section .accordion {max-width: 946px;width: 100%;margin: 0px auto;}
.faq-section .accordion-item {border: 0px;border-bottom: 1px solid #E0E0E0;padding: 20px 0px 10px;border-radius: 0px;}
.faq-section .accordion-item .accordion-button {padding: 0px 30px 10px 0px;color: #000000;font-size: 17px;font-weight: 500;background: transparent !important;border: 0px !important;box-shadow: none;}
.faq-section .accordion-item .accordion-body {padding-left: 0px;padding-right: 0px;padding-top: 0px;font-size: 14px;}
.faq-section .accordion-item .accordion-body p {font-size: 13px;}
.faq-section .accordion-item .accordion-body p:last-child {margin-bottom: 0px;}

.trial-section .trial-box {background: #ECECEC;max-width: 995px;margin: 0px auto;padding: 60px 30px;border-radius: 40px;}
.trial-section .trial-box h2 {font-size: 36px;margin-bottom: 30px;font-weight: 500;}
.trial-section .trial-box p {font-size: 15px;font-weight: 300;color: #545454;}
.trial-section .trial-box .btns-group {display: flex;gap: 15px;flex-wrap: nowrap;justify-content: center;margin-bottom: 14px;}
.trial-section .trial-box .btns-group .btn-site {display: inline-flex;height: 62px;border-radius: 20px;padding: 5px 24px;font-size: 20px;font-weight: 400;border: 1px solid #000000;}
.trial-section .trial-box .btns-group .btn-site:hover{background: linear-gradient(to right, #0172AF, #74FEBD);}
.trial-section .trial-box .btns-group .btn-site:first-child {min-width: 298px;}
.trial-section.section-spacing {padding-bottom: 198px !important;padding-top: 100px !important;}

/* contact us css starts */
.contact-section {position: relative;}
.contact-section .form-box {width: 100%;max-width: 917px;margin: 0px auto;}
.contact-section .form-box .row{margin: 0px -25px;}
.contact-section .form-box .row [class*="col-"] {padding: 0px 25px;margin-bottom: 20px;}
.contact-section .form-box .form-group {margin-bottom: 0px;}
.contact-section .form-box .form-group label {display: block;font-size: 15px;color: #000000;font-weight: 200;margin-bottom: 5px;}
.contact-section .form-box .form-control {border: 1px solid #C7C7C7;height: 50px;border-radius: 10px;padding: 5px 16px;color: #000000;font-size: 16px;box-shadow: none;outline: none;}
.contact-section .form-box textarea.form-control {height: 134px;resize: none;padding-top: 16px;}
.contact-section .form-box .btn-site {background: linear-gradient(to bottom, rgba(0, 0, 0, 1), rgba(94, 94, 94, 1)) !important;color: #ffffff;font-size: 18px;font-weight: 500;height: 50px;display: inline-flex;align-items: center;justify-content: center;padding: 5px 10px;min-width: 217px;border-radius: 10px;}
.contact-section .form-box .btn-site:hover {background: linear-gradient(to right, #0172AF, #74FEBD) !important;color: #ffffff;}
.contact-section .or-line{position: relative;width: 100%;display: flex;align-items: center;justify-content: center;margin-top: 30px;}
.contact-section .or-line::after {background: #9B9B9B;height: 1px;content: "";left: 0px;right: 0px;width: 100%;position: absolute;top: 50%;transform: translateY(-50%);z-index: 1;pointer-events: none;}
.contact-section .or-line span{display: inline-block;text-align: center;color: #9B9B9B;font-size: 18px;font-weight: 300;padding: 10px 40px;background: #ffffff;position: relative;z-index: 2;}
.contact-section .btn-share {display: flex;align-items: center;justify-content: center;column-gap: 10px;box-shadow: 0 0 30px 0px rgba(0, 0, 0, 0.15);height: 67px;font-size: 18px;font-weight: 300;color: #25D366;border-radius: 10px;}
/* contact us css ends */

.footer {padding: 54px 0px 10px;background: #212121;text-align: center;color: #ffffff;}
.footer ul {display: flex;align-items: center;gap: 30px;text-align: center;justify-content: center;padding-top: 100px;margin-bottom: 80px;}
.footer ul li a{font-size: 14px;color: #ffffff;font-weight: 400;}
.footer p {color: #858585;font-size: 13px;}

.owl-carousel .owl-item img {width: auto;}
.font-lg {font-size: 16px;}
.btn-site.btn-dark {background: #000000;}
.btn-site.btn-light {background: transparent;color: #000000;border: 1px solid #D4D4D4;}
.gred-text-inn span, .gred-text {background: linear-gradient(to right, #0172AF, #74FEBD);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}

.error {color: #ff0000 !important;}
.back-button {cursor: pointer;}
.navbar-nav {justify-content: flex-end;}
.logout-button {padding-right: 40px;}
.home_auth_wrapper {display: flex;align-items: center;justify-content: center;padding-top: 0px;}
.home_auth_wrapper .auth_box {padding:40px; background: #ffffff;border-radius: 10px;box-shadow: 0px 4px 10px rgba(1, 114, 175, 0.5);flex: 0 0 476px;max-width: 476px;width: 100%;max-height: calc(100vh - 24px);overflow: auto;overflow: -moz-scrollbars-none;-ms-overflow-style: none;scrollbar-width: none;}
.footer .logo-white {width:173px; height:36px;object-fit: contain;object-position: center;}
.header-logo {width: 100%;max-width: 88px;}
.header-logo img {position: relative; top: 8px;}

/* Common Css */
a, button {-webkit-transition: all 300ms linear;-moz-transition: all 300ms linear;-o-transition: all 300ms linear;-ms-transition: all 300ms linear;transition: all 300ms linear;}
.btn-site {display: flex;align-items: center;justify-content: center;text-align: center;color: #ffffff;font-size: 16px;font-weight: 600;background: #00c5de;border-radius: 50px;padding: 8px 16px;outline: none;box-shadow: none;border: 0px;min-height: 45px;cursor: pointer;}
.btn-site:hover, .btn-site:focus, .btn-site:active {background: #333333;color: #ffffff;}
.font-sm {font-size: 14px !important;}




/***********rigister-steps********************/
/* Layout */
.registration-wrapper {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    overflow-y: auto;
}

.registration-container {
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    width: 100%;
    max-width: 480px;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    overflow-x: hidden;
    transition: max-width 0.3s ease;
}

/* Logo */
.logo-section {
    padding: 32px 40px 0;
}

.logo {
    display: flex;
    align-items: center;
    margin:20px 20px 0 20px;
 }

.logo img {
    height: 32px;
    width: auto;
}

/* Steps */
.step-content {
    display: none;
}

.step-content.active {
    display: block;
}

.form-container {
    padding: 0 20px;
     max-width: 1030px;
        margin: auto;
}

/* Typography */
.main-title {
    font-size: 18px;
    font-weight: 500;
    color:#4E4E4E;
    margin-bottom: 8px;
}

.subtitle {
    font-size: 14px;
    color: #4e4e4e;
    font-weight: 300;
}
.subtitle b{font-weight:500;}
.subtitle span{margin:0 10px; color:#AFAFAF;}

/* Forms */
.registration-form {
    margin-top: 30px;
}

.input-row {
    display: grid;
    grid-template-columns:1fr 1fr;
    gap:42px;
    margin-bottom:22px;
}

.form-input, .form-select {
    width: 100%;
    padding: 14px;
    border: 1px solid #F0F0F0;
    border-radius:5px;
    font-size: 13px;
    background: #fff;
    transition: border-color 0.2s, box-shadow 0.2s;
    margin-bottom:0;
}

.form-input:focus, .form-select:focus {
    outline: none;
    border-color: #F0F0F0;
    box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.1);
}

.password-container {
    position: relative;
    margin-bottom: 16px;
}

.password-toggle {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 18px;
    opacity: 0.6;
    transition: opacity 0.2s;
}

.password-toggle:hover {
    opacity: 1;
}

/* Phone input */
.phone-input-group {
    display: flex;
    flex: 1;
    border:1px solid #F0F0F0;
    border-radius: 5px;    
}

.country-code {
    border:0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin-bottom: 0;
    background:transparent;
    font-size:14px;
    padding:13px 15px;
}

.country-code:focus, .country-code:focus-visible{outline:none;}


.phone-input {
    flex: 1;
    border-left: none;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-bottom: 0;
    border:0;
     border-left: 1px solid #f0f0f0;
    font-size:14px;
    padding:13px 15px;
    margin-left:15px;
    width:100%;
}

.phone-input:focus, .phone-input:focus-visible{outline:none;}


/* Plan Selection Styles */
.pricing-container {
    display: flex;
    gap: 40px;
    max-width: 1000px;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 32px;
}

.plan {
    flex: 1;
    max-width: 474px;
    border: 1px solid #EDEDED;
    border-radius: 16px;
    padding: 25px 40px;
    transition: transform 0.3s, box-shadow 0.3s, border-color 0.3s;
    cursor: pointer;
}

.plan:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 32px rgba(0,0,0,0.12);
}

.plan.selected {
    border-color: #1976d2;
    box-shadow: 0 8px 32px rgba(25, 118, 210, 0.15);
}

.plan h3 {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 8px;
    color: #4E4E4E;
}

.plan p {
    color: #AFAFAF;
    font-size:14px;
    margin-bottom: 20px;
}

.price {
    font-size: 28px;
    font-weight: 400;
    margin-bottom: 15px;
    color: #1a1a1a;
    display:flex;
    align-items: center;
    gap:10px;
}

.price-period {
    font-size: 14px;
    color: #9a9a9a;
    font-weight: 400;
}

.plan ul {
    list-style: none;
    margin-top: 20px;
}

.plan ul li {
    margin-bottom: 15px;
    font-size:14px;
    color: #000;
    padding-left: 30px;
    position: relative;
}

.plan ul li::before {
    content: "";
    background: url(../images/checkicon.svg);
    background-repeat: no-repeat; 
    position: absolute;
    left: 0;
    font-weight: bold;
    width:18px;
    height:13px;
    margin:3px 0 0 0;
}

.auth_body .btn-disabled{border-color:#E2DFDF; background:#fff; color:#BEBEBE;}


.btn-back {
    background: transparent;
    border: 1px solid #ddd;
    color: #666;
    padding: 12px 20px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s;
}

.btn-back:hover {
    background: #f8f9fa;
    border-color: #bbb;
}

.top-back-section{display:block; gap:10px;}
.top-back-section a{color:#4E4E4E; display:flex; align-items:center; gap:10px;}

.back-section {
    text-align: center;
    margin-top: 24px;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Step 3 Payment Layout */
.payment-container {
    display: flex;
    margin: 0 auto;
    padding:30px 0;
    overflow-y: auto;
    gap:80px;
}

.left-column {
    flex: 1;
}

.left-column h2{font-size:24px; color:#4E4E4E; font-weight:500; margin-bottom:5px;}
.left-column p{font-size:14px; font-weight:400; color:#8F8F8F;}


.right-column {
    flex: 1;
    background: #fff;
    padding: 30px 40px;
    border-radius: 20px;
    border:1px solid #EDEDED;
}

.right-column .section-title{color:#4E4E4E; letter-spacing:inherit;}


/* Toggle Switch */
.billing-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
    font-size:14px;
    color:#656565;
    font-weight:400;
}

.toggle-switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 20px;
}

.toggle-switch input {
    display: none;
}

.toggle-slider {
    position: absolute;
    cursor: pointer;
    background: #EBEBEB;
    border-radius: 34px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transition: .3s;
}

.toggle-slider:before {
    position: absolute;
    content: "";
    height: 14px;
    width: 14px;
    left: 3px;
    bottom: 3px;
    background: white;
    border-radius: 50%;
    transition: .3s;
}

.toggle-switch input:checked + .toggle-slider {
    background: #1976d2;
}

.toggle-switch input:checked + .toggle-slider:before {
    transform: translateX(20px);
}

.save-badge {
    background: #B9F9A9;
    color:#1F7600;
    font-size: 14px;
    padding: 6px 9px;
    border-radius:5px;
}

/* Subscription & Pricing */
.subscription-summary {
    margin-bottom: 20px;
}

.subscription-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4px;
    font-size:14px;
    color:#232323;
}

.price-after {
    font-size: 14px;
    color:#878787;
    text-align:right;
    margin-top:24px;
}

.pricing-section {
    border-top: 1px solid #ededed;
    margin-top: 20px;
    padding-top: 20px;
}

.price-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    color: #232323;
    font-size:14px;
}

.price-row .price{font-size:14px; font-weight:500;}

.total-trial{color:#999;}


.total-today .total-price {
    font-weight: 500;
    color:#000;
}

.bank-select {
    width: calc(100% - 24px);
    padding: 14px;
    border:transparent;
    font-size:14px;
    border-radius: 3px;
    margin:0;
    background: #fbfbfb;
    margin:0 12px 12px 12px;
}

/* Coupon Section */
.coupon-section {
    margin: 15px 0 0 0;
    border-bottom:1px solid #ededed;
    padding-bottom:20px;
    margin-bottom:20px;
}

.coupon-input-group {
    display: flex;
    gap: 8px;
    margin-bottom:0;
}

.coupon-input {
    flex: 1;
    padding: 10px 12px;
    border: transparent;
    border-radius: 6px;
    font-size: 14px;
    background:#F3F3F3;
}

.coupon-btn {
    padding: 10px 16px;
    background: #f3f4f6;
    border: 1px solid #ddd;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    color: #374151;
    font-weight: 500;
    transition: all 0.2s;
    white-space: nowrap;
}

.coupon-btn:hover:not(:disabled) {
    background: #e5e7eb;
}

.coupon-message {
    font-size: 12px;
    min-height: 16px;
    margin-top: 4px;
}

.coupon-message.success {
    color: #22c55e;
}

.coupon-message.error {
    color: #ef4444;
}

/* Payment Methods */

.custom-radio{display:flex; align-items:center; gap:15px; font-size:14px;}
.custom-radio input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  width: 20px;
  height: 20px;
  border: 1px solid #E4E4E4;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  cursor: pointer;
}

.custom-radio input[type="radio"]:checked {
  border-color:#0172AF;
  background-color: #fff;
  border-width:5px;
}

.payment-methods{border:1px solid #F0F0F0; border-radius:5px;}

.payment-option:first-child{border:0;}

.payment-option {
    display: block;
    border-radius:0;
    padding: 12px;
    margin-bottom:0;
    cursor: pointer;
    transition: all 0.2s;
    color:#8F8F8F;
    border-top:1px solid #f0f0f0;
}

.payment-option.selected {
    color:#000;
}


.payment-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.payment-logos span{padding:0 10px; border-radius: 3px; border:1px solid #EFEFEF; margin-left: 5px;}

.payment-logos img {
    height: auto;
    display: inline-block;
    
}

.trial-notice {
    font-size: 14px;
    color:#797979;
    margin-top: 22px;
    text-align: center;
    line-height: 1.4;
    margin-bottom:0;
}

/* Alert System */
.custom-alert {
    margin-bottom: 20px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    animation: slideIn 0.3s ease-out;
}

@keyframes slideIn {
    from {
        transform: translateY(-20px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.alert-content {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    gap: 10px;
}

.custom-alert-success {
    background: #f0f9ff;
    border-left: 4px solid #22c55e;
}

.custom-alert-error {
    background: #fef2f2;
    border-left: 4px solid #ef4444;
}

.custom-alert-info {
    background: #f0f9ff;
    border-left: 4px solid #3b82f6;
}

.custom-alert-warning {
    background: #fffbeb;
    border-left: 4px solid #f59e0b;
}

.alert-message {
    flex: 1;
    font-size: 14px;
    font-weight: 500;
}

.alert-close {
    background: none;
    border: none;
    font-size: 18px;
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.2s;
}

.alert-close:hover {
    opacity: 1;
}

/* Links */
.login-link {
    text-align: center;
    font-size: 14px;
    color: #6b7280;
    margin-bottom: 24px;
}

.login-link a, .terms-link {
    color: #1976d2;
    text-decoration: none;
    transition: color 0.2s;
}

.login-link a:hover, .terms-link:hover {
    color: #1565c0;
}

.terms-section {
    text-align: center;
}

.terms-text {
    font-size: 12px;
    color: #9ca3af;
    line-height: 1.5;
}

.finish-account{border:1px solid #EDEDED; padding:30px 40px; border-radius:20px;}


/* Responsive Design */
@media (max-width: 520px) {
    .registration-wrapper {
        align-items: flex-start;
        padding: 10px;
    }
    
    .registration-container {
        margin: 0;
        border-radius: 0;
        max-height: none;
        min-height: calc(100vh - 20px);
        max-width: none !important;
    }
    
    .payment-container {
        flex-direction: column;
        gap: 20px;
    }
    
    .pricing-container {
        flex-direction: column;
        gap: 20px;
    }
    
    .plan {
        min-width: 100%;
    }
    
    .coupon-input-group {
        flex-direction: column;
    }
    
    .coupon-btn {
        width: 100%;
    }
}

@media (max-height: 600px) {
    .registration-wrapper {
        align-items: flex-start;
        padding: 10px;
    }
    
    .main-title {
        font-size: 20px;
        margin-bottom: 6px;
    }
    
    .subtitle {
        margin-bottom: 20px;
    }    
}




/* Medis queries */

@media (min-width: 992px) {
    .interface-section .owl-carousel .item {flex: 1 1 25%;max-width: 25%;margin: 0px;}
}
@media (min-width: 768px) {
    .owl-carousel {display: flex;flex-wrap: wrap;}
    .owl-carousel .owl-stage-outer {display: block !important;}
    .owl-nav, .owl-dots {display: none !important;}
    .testimonial-slider-section .owl-theme .owl-nav.disabled+.owl-dots, .testimonial-slider-section .owl-dots {margin-top: 10px;display: inline-flex !important;justify-content: center;align-items: center;background: #d9d9d9;border-radius: 9999px;padding: 9px 14px;column-gap: 9px;}
    .testimonial-slider-section .card .content p {font-size: 14px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 6;overflow: hidden;text-overflow: ellipsis;}
    .testimonial-slider-section .card .content {min-height: 140px;max-height: 140px;}
}

@media (max-width: 1536px) {
    .header {padding: 20px 40px;}
    .wrapper {padding-top: 100px;}
    .wrapper .container {padding-left: 30px;padding-right: 30px;}
    .wrapper .price-section .container {padding-left: 0px;padding-right: 0px;}
    .wrapper .price-section .container .title-column  {padding: 0px 30px;}
    .hero-section .caption .caption-title {font-size: 80px;}
    .hero-section .caption p {font-size: 18px;}
    .hero-section .btn-group .btn-site {font-size: 16px;min-width: initial;padding: 12px 30px;}
    .title-column p {font-size: 18px;}
    .interface-section .owl-carousel .box .content h3 {font-size: 18px;}
    .interface-section .owl-carousel .box .content p, .orders-section p {font-size: 16px;}
    .sales-section .section-title, .orders-section .section-title {font-size: 40px;}
    .price-section .row .box h2 {font-size: 24px;}
    .price-section .row .box .price {font-size: 58px;}
    .price-section .row .box .price sub {font-size: 18px;top: 0px;}
    .price-section .row .box p {font-size: 18px;}
    .price-section .row .box .btn {min-height: 58px;font-size: 16px;}
    .price-section .row .box div p {font-size: 16px;}
    .testimonial-slider-section .card {padding: 30px 50px;}
    .trial-section .trial-box h2 {font-size: 36px;}
    .trial-section .trial-box .btns-group .btn-site {height: 58px;padding: 5px 46px;font-size: 16px;}
    .trial-section .trial-box p {font-size: 16px;}
    .section-spacing {padding: 40px 0px !important;}
    .hero-section.section-spacing {padding-top: 80px !important;}
    .sales-section.section-spacing {padding: 10px 0px !important;background-size: 55%;min-height: initial;}
    .sales-section .section-title {margin-bottom: 80px;}
    .trial-section.section-spacing{margin-bottom: 40px !important;}
    .hero-section .caption {padding-top: 20px;}
}

@media (max-width: 1280px) {
    .header {padding: 15px 30px;}
    .wrapper {padding-top: 90px;}
    .hero-section .caption .caption-title {font-size: 72px;}
    .hero-section .caption p {font-size: 16px;}
    .hero-section .btn-group .btn-site {font-size: 16px;padding: 12px 30px;}
    .title-column p {font-size: 16px;}
    .interface-section .owl-carousel .box .content h3 {font-size: 18px;}
    .interface-section .owl-carousel .box .content p, .orders-section p {font-size: 16px;}
    .sales-section .section-title, .orders-section .section-title {font-size: 40px;}
    .price-section .row .box h2 {font-size: 18px;}
    .price-section .row .box .price {font-size: 54px;}
    .price-section .row .box .price sub {font-size: 16px;}
    .price-section .row .box p {font-size: 16px;}
    .price-section .row .box .btn {min-height: 48px;font-size: 16px;}
    .price-section .row .box div p {font-size: 14px;}
    .trial-section .trial-box h2 {font-size: 24px;}
    .trial-section .trial-box .btns-group .btn-site {height: 48px;font-size: 16px;}
    .trial-section .trial-box p {font-size: 14px;}
    .section-spacing {padding: 40px 0px !important;}
    .sales-section .section-title {margin-bottom: 60px;}
    .trial-section.section-spacing{margin-bottom: 30px !important;}
    .interface-section .owl-carousel .box .icon {margin-bottom: 25px;}
}

@media (max-width: 1200px) {
    .header {padding: 20px 24px;}
    .header .navbar .navbar-nav {column-gap: 20px;}
    .header .header-right .btn {padding: 10px 16px;margin-left: 20px;}
    .hero-section {padding: 40px 0px;}
    .hero-section .caption .caption-title {font-size: 60px;}
    .hero-section .caption p {font-size: 16px;}
    .hero-section .btn-group .btn-site {font-size: 18px;padding: 12px 36px;min-width: auto;}
    .interface-section .owl-carousel .box {padding: 20px 20px 10px;}
    .sales-section.section-spacing {padding: 80px 0px !important;background-size: 50%;}
    .sales-section .section-title, .orders-section .section-title {font-size: 36px;}
}


@media (max-width:1023px) 
{
 .auth_wrapper .auth_box{padding:20px;}    
.right-column{padding:20px;}
.payment-container{flex-direction: column; gap:30px;}
.plan{padding:20px;}
.finish-account{padding:20px;}
.input-row{grid-template-columns:1fr; gap:20px;}
}



@media (max-width: 992px) {
    .header {box-shadow: none;}
    .header .navbar-toggler {border: 0px !important;box-shadow: none !important;outline: 0 !important;}
    .header .navbar .navbar-collapse {position: absolute;left: -40px;right: 0px;z-index: 9;top: 59px;width: calc(100vw + 40px);background: #ffffff;padding: 0px 15px;border-top: 1px solid #dcdcdc;box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.25);}
    .header .header-right .btn {border-radius: 9999px;margin-right: 0px;min-width: max-content;}
    .header .navbar {flex-wrap: nowrap;}
    .header .navbar .navbar-nav .nav-item .nav-link {padding: 10px 16px;}
    .header .navbar .navbar-nav .nav-item {border-bottom: 1px solid #dcdcdc;}
    .header .navbar .navbar-nav .nav-item:last-child {border-bottom: 0px;}
    .wrapper {padding-top: 90px;}
    .hero-section {padding: 15px 0px !important;text-align: center;}
    .hero-section .btn-group {justify-content: center;}
    .hero-section .btn-group .btn-site {box-shadow: none;font-size: 14px;padding: 6px 26px;min-width: auto;min-height: 40px;}
    .hero-img img {max-width: 220px;margin: 0px auto;}
    .hero-section .caption .caption-title {font-size: 40px;letter-spacing: initial;}
    .hero-section .caption p {font-size: 14px;}

    .section-spacing.interface-section {padding: 40px 0px 50px !important;}
}


@media (max-width:768px) {
    .header {padding: 10px 24px !important;}
    .wrapper {padding-top: 80px;}
    .hero-section .caption .caption-title {font-size: 24px;}
    .interface-section .owl-carousel .item {margin: 10px;}
    .price-section .row .box {max-width: 340px;margin-bottom: 0px;}
    .interface-section .container {padding-left: 15px;padding-right: 15px;}
    .hero-section .caption .caption-title {font-size: 24px;}
    .title-column p {font-size: 14px;}
    .interface-section .owl-theme .owl-dots .owl-dot.active span, .interface-section .owl-theme .owl-dots .owl-dot:hover span, .sales-content .owl-theme .owl-dots .owl-dot.active span, .sales-content .owl-theme .owl-dots .owl-dot:hover span {background: #000000;}
    .hero-section.section-spacing {padding-top: 10px !important;}
    .hero-section .caption {padding-top: 0px;}
    .sales-section.section-spacing {padding: 20px 0px !important;background-image: none;}
    .sales-section {text-align: center;}
    .sales-section .section-title, .orders-section .section-title {font-size: 30px;}
    .sales-content .row .col {flex: 0 0 100%;max-width: 100%;}
    .sales-content .box .num-text {font-size: 24px;margin-bottom: 20px;}
    .sales-content .col .box {box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.25);padding: 24px;}
    .sales-content .row .col {padding: 0px;}
    .sales-content .box .content h3 {font-size: 14px;}
    .sales-content .box .content p {font-size: 14px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;overflow: hidden;text-overflow: ellipsis;}
    .sales-section .sales-content .owl-stage {padding: 40px 0px;}
    .sales-section {overflow: hidden;}
    .sales-section .sales-content {position: relative;width: calc(100vw + 140px);margin-left: -100px;max-width: 100%;max-width: initial;}
    .sales-content .row {max-width: initial;}
    .sales-section .section-title {margin-bottom: 30px;}
    .sales-section .owl-carousel .owl-dots.disabled {display: block !important;}
    .sales-section .mobile-resposnive-frame {height: 554px;object-fit: cover;margin: 0px -80px;margin-top: -190px;position: relative;z-index: 1;opacity: 0.8;pointer-events: none;}
    .sales-section .mobile-resposnive-frame img {width: 100%;}
    .interface-section .owl-carousel .box .content p, .orders-section p {font-size: 14px;}
    .price-section.section-spacing.pt-0 {padding-top: 40px !important;padding-bottom: 0px !important;}
    .price-section #pricing_slider {padding-bottom: 0px;}
    .price-section #pricing_slider .owl-stage-outer {padding: 50px 0px;margin-top: -50px;}
    .price-section .owl-theme .owl-nav.disabled+.owl-dots {margin-top: -20px;}
    .testimonial-slider-section .owl-carousel .owl-nav.disabled, .testimonial-slider-section .owl-carousel .owl-nav {display: none !important;}
    .testimonial-slider-section {position: relative;top: 0px;margin-top: -50px;width: 100%;margin-left: 0px;}
    .testimonial-slider-section .card .auth-img {margin-bottom: 10px;}
    .testimonial-slider-section .card .auth-img img {height: 56px;}
    .testimonial-slider-section .card .name {font-size: 18px;}
    .testimonial-slider-section .card .position {font-size: 14px;}
    .testimonial-slider-section .card p {font-size: 13px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;overflow: hidden;text-overflow: ellipsis;}
    .testimonial-section .title-column {padding-left: 30px !important;padding-right: 30px !important;}
    .testimonial-slider-section .card {padding: 30px 20px;}
    .testimonial-slider-section .owl-carousel .item {padding: 40px 30px 50px;}
    .testimonial-slider-section .owl-theme .owl-dots .owl-dot span {margin: 5px;}
    .testimonial-slider-section .owl-dots {margin-top: -20px;}
    .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {background: #000000 !important;}
    .faq-section .accordion-item {border: 0px;border-bottom: 0px;padding: 5px 0px 2.5px;}
    .faq-section .accordion-item .accordion-button {font-size: 16px;font-weight: 300;}
    .faq-section .accordion-item .accordion-body p {font-size: 12px;font-weight: 300;}
    .faq-section.section-spacing.pt-0 {padding-bottom: 70px !important;}
    .trial-section .trial-box .btns-group .btn-site:first-child {min-width: initial;}
    .trial-section .trial-box {padding: 40px 15px;}
    .trial-section .trial-box .btns-group .btn-site {font-size: 14px;padding: 5px 26px;}

    .checked-list ul li {justify-content: center;font-size: 14px;}
    
    .contact-section .form-box .row [class*="col-"] {margin-bottom: 15px;}
    .contact-section .form-box .form-control {height: 40px;font-size: 14px;}
    .contact-section .form-box textarea.form-control {height: 90px;}
    .contact-section .form-box .btn-site {font-size: 16px;height: 48px;}
    .contact-section .or-line span {font-size: 18px;padding: 10px 25px;}
    .trial-section.section-spacing {padding-bottom: 40px !important;padding-top: 30px !important;}
    .footer {padding: 34px 0px 10px;}
    .footer ul li a {font-size: 18px;}
    .footer p {font-size: 18px;}    
}

@media (max-width:767px) {
   
}

@media (max-width:575px) {
    .header .navbar .navbar-collapse {top: 50px;}
    .header .header-right .btn {font-size: 12px;padding: 6px 10px;}
    .header .navbar .navbar-brand {width: 110px;}
    .header .header-right .btn {margin-right: 5px;}

    .sales-section .section-title, .orders-section .section-title {font-size: 26px;}
    .price-section .row .box {max-width: 80%;}
    .price-section .row .box .price {font-size: 44px;}
    .trial-section .trial-box h2 {font-size: 26px;}

    .testimonial-slider-section .owl-carousel .owl-item.active.center .item {transform: none !important;-moz-transform: none !important;-webkit-transform: none !important;-o-transform: none !important;}
.testimonial-slider-section .owl-carousel .item {padding: 20px 30px 10px;}
.contact-section .form-box .btn-site {width: 100%;}
.contact-section .or-line {margin-top: 15px;}

.hero-section .btn-group .btn-site, .header .header-right .btn, .price-section .row .box .btn, .trial-section .trial-box .btns-group .btn-site {border-radius: 10px;}

    .footer ul {gap: 20px;padding-top: 30px;margin-bottom: 60px;flex-direction: column;}
    .footer ul li a {font-size: 14px;}
    .footer p {font-size: 14px;}
}

/* Loader inside button */
.btn.loading {
  position: relative;
  pointer-events: none;
  opacity: 0.8;
}

.btn.loading::after {
  content: "";
  position: absolute;
  right: 16px;
  top: 50%;
  width: 18px;
  height: 18px;
  border: 2px solid #fff;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
  transform: translateY(-50%);
}

@keyframes spin {
  to {
    transform: translateY(-50%) rotate(360deg);
  }
}
plan {
    position: relative;
}

.popular-badge {
    position: absolute;
    top: -10px;
    right: 20px;
    background: #ff6b35;
    color: white;
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: bold;
    z-index: 1;
}

.old-price {
    text-decoration: line-through;
    color: #999;
    font-size: 0.9em;
    margin-right: 10px;
}

.trial-info {
    color: #28a745;
    font-weight: bold;
    font-size: 0.9em;
    margin-top: 10px;
}

.spinner-border {
    width: 3rem;
    height: 3rem;
}

#plans-loading {
    min-height: 200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.plan.selected {
    border: 2px solid #007bff;
    transform: scale(1.02);
    transition: all 0.3s ease;
}

.plan:hover:not(.selected) {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
}