:root {
  --ink: #265148;
      --ink-deep: #add4a8;
  --tg-body-font-family: "Inter", sans-serif;
  --tg-heading-font-family: "DM Sans", sans-serif;
  --tg-icon-font-family: "Font Awesome 5 Free";
  --tg-body-font-size: 16px;
  --tg-body-line-height: 1.6;
  --tg-heading-line-height: 1.2;
  --tg-body-color: #222222;
  --tg-heading-color: #212121;
  --tg-theme-primary: #2457D6;
  --tg-theme-primary-2: #2457D6;
  --tg-theme-primary-3: #FF4C4C;
  --tg-theme-secondary: #219dd3;
      --gold: #9127a8;
          --gold-light: #f27eff;
          --slate-light: #f27eff;
          --border: #f7b6ff;
  --tg-color-blue-default: #1598d1;
  --tg-color-dark-blue: #0E104B;
  --tg-color-yellow-default: #FFD247;
  --tg-color-yellow-light: #f8f7d7;
  --tg-color-white-default: #ffffff;
  --tg-color-lavender-default: #eeebff;
  --tg-color-anti-flash-default: #f1f1f1;
  --tg-color-anti-flash-2: #f4eaf4;
  --tg-color-alice-blue-default: #ecf5ff;
  --tg-color-green-default: #1598d1;
  --tg-color-dark-green: #ffbe052e;
  --tg-color-gray-1: #b1b5bf;
  --tg-color-gray-2: #E8E8E8;
  --tg-color-gray-3: #F5F7F9;
  --tg-color-gray-4: #767982;
  --tg-color-gray-5: #B1B5BF;
  --tg-color-gray-6: #F0F1F3;
  --tg-color-gray-7: #494C55;
  --tg-color-gray-8: #F0F2F6;
  --tg-color-gray-9: #F3F1FF;
  --tg-color-gray-10: #F7F7F7;
  --tg-color-dark: #0A0B0F;
  --tg-color-dark-2: #242424;
  --tg-color-dark-3: #1F2122;
  --tg-color-dark-4: #06070A;
  --tg-color-dark-5: #1B1C1D;
  --tg-border-1: #f0f0f0;
  --tg-border-2: #d9dfe5;
  --tg-border-3: #343641;
  --tg-border-4: #EEF2F6;
  --tg-border-5: #E1E6F0;
  --tg-fw-extra-bold: 800;
  --tg-fw-bold: 800;
  --tg-fw-semi-bold: 600;
  --tg-fw-medium: 500;
  --tg-fw-regular: 400;
  --tg-fw-light: 300;
}

/*=============================
	00. Section Title
===============================*/
.section__title {
 position: relative;
}
.application-bg{
  flex-direction: column;
  align-items: center;
  justify-content: center;
  display: flex;
  border-radius: 20px;
  padding: 20px;
  height: 100%;
  
  background: linear-gradient(180deg, #d1dcee, #c2f8ff, #00c4ff80);
}
.section__title .sub-title {
  font-weight: 500;
  font-size: 12px;
  border: 1px solid var(--tg-border-2);
  display: inline-block;
  padding: 8px 15px;
  -webkit-border-radius: 24px;
  -moz-border-radius: 24px;
  -o-border-radius: 24px;
  -ms-border-radius: 24px;
  border-radius: 24px;
  line-height: 1;
  margin-bottom: 16px;
}
.section__title .title {
  margin-bottom: 0;
  font-size: 47px;
  font-weight: 700;
  color: #000826;
}
.why-section{
  padding: 80px 0;
}
@media (max-width: 1199.98px) {
  .section__title .title {
    font-size: 36px;
  }
}
@media (max-width: 767.98px) {
  .section__title .title {
    font-size: 32px;
  }
}
.section__title .title span, span.highlited {
    color: #2563eb;
}
.section__title .title .shape {
  width: 165px;
  height: auto;
}
.section__title .title .shape path {
  fill: none;
  stroke: #FC5C79;
  stroke-width: 2;
}
.section__title p {
  margin-bottom: 0;
  margin-top: 16px;
  color: #434a5a
}
.section__title.white-title .title {
  color: var(--tg-color-white-default);
}
.section__title.white-title p {
  color: var(--tg-color-gray-5);
}
.section__title .white-content {
  color: var(--tg-color-white-default) !important;
}
.section__title-two .title span {
  text-decoration: underline;
  text-decoration-skip-ink: none;
  color: var(--tg-theme-secondary);
  font-style: italic;
}

@media (max-width: 991.98px) {
  .section__title.mb-70,
  .section__title.mb-60 {
    margin-bottom: 40px;
  }
}

.section-py-140 {
  padding: 140px 0;
}
@media (max-width: 991.98px) {
  .section-py-140 {
    padding: 120px 0;
  }
}
@media (max-width: 767.98px) {
  .section-py-140 {
    padding: 100px 0;
  }
}

.section-pt-140 {
  padding-top: 140px;
}
@media (max-width: 991.98px) {
  .section-pt-140 {
    padding-top: 120px;
  }
}
@media (max-width: 767.98px) {
  .section-pt-140 {
    padding-top: 100px;
  }
}

.section-pb-140 {
  padding-bottom: 140px;
}
@media (max-width: 991.98px) {
  .section-pb-140 {
    padding-bottom: 120px;
  }
}
@media (max-width: 767.98px) {
  .section-pb-140 {
    padding-bottom: 100px;
  }
}

.section-pb-110 {
  padding-bottom: 110px;
}
@media (max-width: 991.98px) {
  .section-pb-110 {
    padding-bottom: 90px;
  }
}
@media (max-width: 767.98px) {
  .section-pb-110 {
    padding-bottom: 70px;
  }
}

.section-py-120 {
  padding: 120px 0;
}
@media (max-width: 767.98px) {
  .section-py-120 {
    padding: 100px 0;
  }
}

.section-pt-120 {
  padding-top: 120px;
}
@media (max-width: 767.98px) {
  .section-pt-120 {
    padding-top: 100px;
  }
}

.section-pb-120 {
  padding-bottom: 120px;
}
@media (max-width: 767.98px) {
  .section-pb-120 {
    padding-bottom: 100px;
  }
}

.section-pb-90 {
  padding-bottom: 90px;
}
@media (max-width: 767.98px) {
  .section-pb-90 {
    padding-bottom: 70px;
  }
}

.section-pt-90 {
  padding-top: 90px;
}
@media (max-width: 767.98px) {
  .section-pt-90 {
    padding-top: 70px;
  }
}

/* .container {
  max-width: 1350px;
}
@media (max-width: 1500px) {
  .container {
    max-width: 1320px;
  }
} */
@media (max-width: 1199.98px) {
  
 
  .container {
    max-width: 960px;
  }
}
a, button {
    color: #4588f4;
    outline: none;
    text-decoration: none;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
}
.tgmobile__menu .tgmenu__action {
  padding: 0 0;
  margin: 0 0;
}
.tgmobile__menu .tgmenu__action > ul {
  margin: 0 0;
  padding: 30px 20px 0;
  justify-content: center;
  gap: 0 15px;
}
.tgmobile__menu .tgmenu__action > ul li {
  margin: 0 0;
}
.tgmobile__menu .tgmenu__action > ul .header-btn {
  display: block;
}
@media (max-width: 991.98px) {
  .tgmenu__action {
    margin: 0 24px 0 auto;
  }
}
@media (max-width: 767.98px) {
      .mission-section {
        padding: 4rem 0;
    }
    .mission-headline, .bgs-title{
      font-size: 31px !important;
    }
  .tgmenu__action {
    /* display: none; */
  }
}
.tgmenu__action > ul {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  gap: 0px;
  margin: 0;
  padding: 0;
}
.tgmenu__action > ul li {
  position: relative;
  margin-left: 24px;
  flex: 0 0 auto;
  list-style: none;
}
@media (max-width: 991.98px) {
  .tgmenu__action > ul li {
    margin-left: 20px;
  }
}
.tgmenu__action > ul li.header-btn .tg-btn {
  gap: 4px;
  padding: 16px 20px;
  border: 0;
}
.tgmenu__action > ul li:first-child {
  margin-left: 0;
}
.tgmenu__action-three {
  margin-left: 16px;
}
@media (max-width: 991.98px) {
  .tgmenu__action-three {
    margin: 0 24px 0 auto;
  }
}
/*=========================
      Breadcrumb
===========================*/
.breadcrumb__area {
    background: url(../images/page-title.jpg) no-repeat 0 0;
    background-size: cover;
  position: relative;
  z-index: 1;
  padding: 80px 0 120px;
      border-bottom: 1px solid #e4e4e4;
 background: radial-gradient(1200px 600px at 85% 110%, rgba(147, 51, 234, .22), transparent 55%), radial-gradient(900px 500px at 10% 120%, rgba(88, 28, 135, .18), transparent 55%), #0a0510;
}
@media (max-width: 1199.98px) {
  .feature-card{
    padding: 24px 16px;
  }
  .feature-card h3{
    font-size: 17px;
  }
  .feature-card-txt p{
    font-size: 14px;
  }
  .breadcrumb__area {
    padding: 80px 0 100px;
  }
  .feature-pill{
    width: 100%;
  }
  .feature-pill{
    font-size: 15px;
  }
}
@media (max-width: 767.98px) {
  .breadcrumb__area {
    padding: 60px 0 80px;
  }
}
.breadcrumb__area .shape {
  position: absolute;
  /* transform: rotate(90deg); */
  right: 0;
  top: 0;
  z-index: -1;
  opacity: 0.3
}
@media (max-width: 991.98px) {
  .features-section::before{
    width: 100%;
  }
  .ftr-left-wrap{
    position: relative;
  }
  .features-section::after{
    content: "";
        position: absolute;
        inset: 0;
              background: rgb(252 230 255 / 80%);
              z-index: 0;
              top:0;
              left: 0;
              width: 100%
  }
  .features-section{
        padding: 80px 0 30px;
  }
  .ftr-left-wrap{
    z-index: 99;
    padding-right: 0;
  }
  .breadcrumb__area .shape {
    max-width: 320px;
  }
}
@media (max-width: 767.98px) {
  .breadcrumb__area .shape {
    max-width: 280px;
  }
}
.breadcrumb__area-two {
  padding: 80px 0 32px;
}
@media (max-width: 767.98px) {
  .breadcrumb__area-two {
    padding: 60px 0 32px;
  }
}
.breadcrumb__area-three {
  padding: 80px 0 40px;
}
@media (max-width: 767.98px) {
  .breadcrumb__area-three {
    padding: 60px 0 40px;
  }
}
.breadcrumb__inner-wrap {
  padding: 0 56px;
}
@media (max-width: 1199.98px) {
  .breadcrumb__inner-wrap {
    padding: 0;
  }
}
.breadcrumb__inner-wrap .breadcrumb__content .title {
  text-align: left;
}
.breadcrumb__content {
  text-align: center;
}
.breadcrumb__content .breadcrumb {
  display: inline-flex;
    background: #f7d0ff;
  -webkit-border-radius: 24px;
  -moz-border-radius: 24px;
  -o-border-radius: 24px;
  -ms-border-radius: 24px;
  border-radius: 24px;
  padding: 8px 16px;
  gap: 8px;
  margin-bottom: 24px;
}
.breadcrumb__content .breadcrumb span {
  font-weight: 500;
  font-size: 12px;
  line-height: 1.2;
  color: var(--tg-heading-color);
}
.breadcrumb__content .breadcrumb span a {
  color: var(--tg-theme-primary);
}
.breadcrumb__content .breadcrumb span a:hover {
  color: var(--tg-theme-secondary);
}
.breadcrumb__content .breadcrumb span.breadcrumb-separator {
  color: var(--tg-color-gray-4);
}
.breadcrumb__content .title {
  margin-bottom: 0;
  font-size: 40px;
      color: #fff;
}
@media (max-width: 1199.98px) {
  .breadcrumb__content .title {
    font-size: 36px;
  }
}
@media (max-width: 767.98px) {
  .breadcrumb__content .title {
    font-size: 32px;
  }
}
.breadcrumb__menu {
  margin-top: 32px;
}
.breadcrumb__menu .list-wrap {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
}
.breadcrumb__menu .list-wrap li a {
  font-weight: 500;
  font-size: 14px;
  background: #F0F2F6;
  display: block;
  color: var(--tg-body-color);
  padding: 13px 20px;
  -webkit-border-radius: 40px;
  -moz-border-radius: 40px;
  -o-border-radius: 40px;
  -ms-border-radius: 40px;
  border-radius: 40px;
  line-height: 1;
  position: relative;
  z-index: 1;
}
.breadcrumb__menu .list-wrap li a:hover {
  background: var(--tg-theme-secondary);
  color: var(--tg-color-white-default);
}
.breadcrumb__menu .list-wrap li a span {
  font-weight: 600;
  font-size: 12px;
  text-transform: uppercase;
  border: 1px solid #d9dfe5;
  border-radius: 4px;
  background: var(--tg-color-white-default);
  color: var(--tg-heading-color);
  padding: 1px 5px;
}

/*=============================
    	20. Contact
===============================*/
.contact__info-box {
  background: linear-gradient(45deg, #fff 70.19%, #e6e2fa 100%);
  border: 1px solid var(--tg-border-2);
  padding: 70px 64px 72px;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -o-border-radius: 16px;
  -ms-border-radius: 16px;
  border-radius: 16px;
  height: 100%;
}
@media (max-width: 1199.98px) {
  .contact__info-box {
    padding: 60px 50px 60px;
  }
}
@media (max-width: 767.98px) {
  .contact__info-box {
    padding: 40px 30px 40px;
  }
}
.contact__info-box > .title {
  margin-bottom: 16px;
  font-size: 32px;
  font-weight: 600;
}
@media (max-width: 1199.98px) {
  .contact__info-box > .title {
    font-size: 28px;
  }
}
.contact__info-box p {
  font-size: 14px;
  margin-bottom: 32px;
  width: 90%;
}
@media (max-width: 1199.98px) {
  .contact__info-box p {
    width: 100%;
  }
}
.contact__info-box > .list-wrap li {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 24px;
}
.contact__info-box > .list-wrap li:last-child {
  margin-bottom: 0;
}
.contact__info-box > .list-wrap li .icon {
  width: 40px;
  height: 40px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 1px solid var(--tg-border-2);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -o-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  flex: 0 0 auto;
}
.contact__info-box > .list-wrap li span, .contact__info-box > .list-wrap li a {
  font-weight: 500;
  font-size: 24px;
  color: var(--tg-body-color);
  line-height: 1.4;
}
@media (max-width: 1199.98px) {
  .contact__info-box > .list-wrap li span, .contact__info-box > .list-wrap li a {
    font-size: 22px;
  }
}
@media (max-width: 767.98px) {
  .contact__info-box > .list-wrap li span, .contact__info-box > .list-wrap li a {
    font-size: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .contact__info-box > .list-wrap li span, .contact__info-box > .list-wrap li a {
    font-size: 22px;
  }
}
.contact__info-box > .list-wrap li a:hover {
  color: var(--tg-theme-secondary);
}
.contact__form-box {
  border: 1px solid var(--tg-border-2);
  background: linear-gradient(45deg, #fff 70.19%, #def7ea33 100%);
  border-radius: 16px;
  padding: 70px 64px 72px;
}
@media (max-width: 1199.98px) {
  .contact__form-box {
    padding: 60px 50px 60px;
  }
}
@media (max-width: 767.98px) {
  .contact__form-box {
    padding: 40px 30px 40px;
  }
}
.contact__form-box .title {
  font-size: 32px;
  margin-bottom: 24px;
}
@media (max-width: 1199.98px) {
  .contact__form-box .title {
    font-size: 28px;
  }
}
.contact__form-box .form-grp {
  margin-bottom: 16px;
}
.contact__form-box .form-grp textarea, .contact__form-box .form-grp input {
  width: 100%;
  background: var(--tg-color-white-default);
  border: 1px solid var(--tg-border-2);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -o-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 400;
  color: var(--tg-heading-color);
  padding: 14px 24px;
  height: 40px;
  display: block;
  outline: none;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}
.contact__form-box .form-grp textarea::placeholder, .contact__form-box .form-grp input::placeholder {
  color: #717484;
  font-size: 14px;
}
.contact__form-box .form-grp textarea:focus, .contact__form-box .form-grp input:focus {
  border-color: var(--tg-heading-color);
}
.contact__form-box .form-grp textarea {
  min-height: 117px;
  max-height: 117px;
  margin-bottom: 24px;
}
.contact__form-box .tg-btn {
  font-size: 14px;
  font-weight: 500;
}
.contact__social {
  margin-top: 70px;
}
.contact__social .list-wrap li a:hover {
  color: var(--tg-theme-secondary);
}
.contact__item {
  background: var(--tg-color-gray-3);
  padding: 32px 32px;
  -webkit-border-radius: 24px;
  -moz-border-radius: 24px;
  -o-border-radius: 24px;
  -ms-border-radius: 24px;
  border-radius: 24px;
  height: 100%;
}
@media (max-width: 1199.98px) {
  .contact__item {
    padding: 30px 25px;
  }
}
.contact__item:hover .contact__item-icon {
  transform: translateY(5px);
}
.contact__item-icon {
  width: 56px;
  height: 56px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -o-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--tg-color-white-default);
  border: 1px solid var(--tg-border-2);
  color: var(--tg-theme-secondary);
  margin-bottom: 32px;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}
.contact__item-content .title {
  margin-bottom: 8px;
  font-size: 32px;
}
@media (max-width: 1199.98px) {
  .contact__item-content .title {
    font-size: 28px;
  }
}
.contact__item-content p {
  margin-bottom: 30px;
}
.contact__item-content .list-wrap {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  gap: 10px 16px;
  flex-wrap: wrap;
}
.contact__item-content .list-wrap li a {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  background: var(--tg-color-white-default);
  gap: 8px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -o-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  color: var(--tg-theme-secondary);
  font-weight: 500;
  padding: 6px 16px;
  line-height: 1;
}
.contact__item-content .list-wrap li a:hover {
  background: var(--tg-theme-secondary);
  color: var(--tg-color-white-default);
}

.ajax-response.error, .ajax-response.success {
  margin: 20px 0 0 !important;
}
.ajax-response.error {
  color: red;
}
.ajax-response.success {
  color: green;
}


.your-order-table .product td {
    padding-top: 15px;
    padding-bottom: 15px;
    vertical-align: middle;
}

.total-price-table td, .total-price-table th {
    
    padding-top: 20px;
    padding-bottom: 20px;
    vertical-align: top;
}

.total-price-table .total-amount td, .total-price-table .total-amount th {
    border-bottom: 0;
    font-size:  19px;
}
tr.total-amount h6 {
    font-size: 25px;
}
ul.list-style2 {
    list-style: none;
    padding: 10px 0 0;
    
}
ul.list-style2::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
label {
  margin-top: 10px;
  margin-bottom: 10px;
  color: var(--tg-heading-color);
  cursor: pointer;
  font-size: var(--tg-body-font-size);
  font-weight: var(--tg-fw-regular);
}
.right_txt{
  float: right;
  padding-right: 48px;
}
/*=============================
    	21. Error
===============================*/
.error__area {
  position: relative;
  z-index: 1;
  padding: 120px 0;
}
@media (max-width: 767.98px) {
  .error__area {
    padding: 100px 0;
  }
}
.error__area .shape {
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
}
@media (max-width: 991.98px) {
  .error__area .shape {
    max-width: 320px;
  }
}
@media (max-width: 767.98px) {
  .error__area .shape {
    max-width: 280px;
  }
}
.error__content {
  text-align: center;
}
.error__content img {
  margin-bottom: 24px;
}
.error__content .title {
  margin-bottom: 16px;
  font-weight: 500;
  font-size: 40px;
}
@media (max-width: 767.98px) {
  .error__content .title {
    font-size: 34px;
  }
}
.error__content p {
  margin-bottom: 40px;
}

/*=============================
    	22. Terms
===============================*/
.terms_sec{
    margin: 50px 0 100px;
}
.terms__content .title {
  font-size: 18px;
  margin-bottom: 8px;
}
.terms__content p {
  margin-bottom: 32px;
}
.terms__content p.last-info {
  margin-bottom: 0;
}
.terms__content-bottom {
  margin-top: 40px;
}

/*=============================
    	23. Login
===============================*/
.login__form-inner {
  position: relative;
  z-index: 1;
  overflow: hidden;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}
@media (max-width: 767.98px) {
  .login__form-inner {
    height: 100vh;
  }
}
.login__form-inner .shape img {
  position: absolute;
  right: -24%;
  top: -10%;
  z-index: -1;
}
.login__form-wrap {
  padding: 30px 15px;
  width: 490px;
  margin: 0 auto;
}
@media (max-width: 1199.98px) {
  .login__form-wrap {
    width: 445px;
  }
}
@media (max-width: 991.98px) {
  .login__form-wrap {
    width: 345px;
  }
}
.login__form-wrap .title {
  margin-bottom: 48px;
  font-size: 40px;
}
@media (max-width: 1500px) {
  .login__form-wrap .title {
    font-size: 36px;
    margin-bottom: 25px;
  }
}
@media (max-width: 767.98px) {
  .login__form-wrap .title {
    font-size: 32px;
  }
}
.login__form-wrap .divider {
  text-align: center;
  display: block;
  font-weight: 500;
  font-size: 14px;
  color: #717484;
  margin-bottom: 24px;
  margin-top: 24px;
}
.login__form-social a {
  display: flex;
  align-items: center;
  color: var(--tg-heading-color);
  border: 1px solid var(--tg-border-2);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -o-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  justify-content: center;
  gap: 15px;
  font-weight: 500;
  font-size: 16px;
  margin-bottom: 16px;
  padding: 14px 15px;
  background: var(--tg-color-white-default);
}
.login__form-social a:hover {
  color: var(--tg-theme-secondary);
  border-color: var(--tg-theme-secondary);
}
.login__form-social a:last-child {
  margin-bottom: 0;
}
.login__form .form__grp {
  position: relative;
  margin-bottom: 16px;
}
.login__form .form__grp label {
  position: absolute;
  left: 16px;
  top: 16px;
  color: #717484;
}
.login__form .form__grp input {
  width: 100%;
  font-size: 16px;
  font-weight: 400;
  color: var(--tg-heading-color);
  border: 1px solid var(--tg-border-2);
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -o-border-radius: 8px;
  -ms-border-radius: 8px;
  border-radius: 8px;
  padding: 14px 20px 14px 55px;
  height: 56px;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  display: block;
}
.login__form .form__grp input::placeholder {
  color: #717484;
}
.login__form .form__grp input:focus {
  border-color: var(--tg-heading-color);
}
.login__form .tg-btn {
  width: 100%;
  justify-content: center;
  padding: 16px 20px;
}
.login__img {
  width: 100%;
  height: 100vh;
  background-size: cover;
  background-position: center;
  position: relative;
  z-index: 1;
}
@media (max-width: 767.98px) {
  .login__img {
    display: none;
  }
}
.login__img::before {
  content: "";
  position: absolute;
  left: 40px;
  top: 40px;
  bottom: 40px;
  right: 40px;
  border: 16px solid rgba(255, 255, 255, 0.24);
}

.forgot-password {
  margin-bottom: 32px;
}
.forgot-password a {
  font-size: 12px;
  color: #FC5C79;
}
.forgot-password a:hover {
  color: var(--tg-theme-primary);
}

.password-reset {
  margin-bottom: 24px;
}
.password-reset a {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  color: #19202B;
  gap: 8px;
}
.password-reset a:hover {
  color: var(--tg-theme-primary);
}

.account__switch {
  margin-top: 24px;
}
.account__switch p {
  margin-bottom: 0;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.account__switch p a {
  color: var(--tg-theme-secondary);
}
.account__switch p a:hover {
  color: var(--tg-theme-primary);
}

#my-widget-popup{
      top: auto !important;
    bottom: 20px !important;
}
#widget-content{
    bottom: 0px !important;
    top: auto !important;
}


/* contact us page css */
    .address-items, .address-items .icon-box {
    align-items: center;
    display: flex;
    } 
.address-items .icon-box {
    background-color: #2563eb;
    border-radius: 4px;
    height: 50px;
    justify-content: center;
    position: relative;
    width: 50px;
    z-index: 1;
}
.address-items .contact-box {
    background-color: #eee;
    border: 1px solid #1d1d1d;
    border-radius: 4px;
    padding: 20px 10px 20px 40px;
    transform: translateX(-24px);
    width: calc(100% - 50px);
}
.address-items .icon-box .iconsax {
    --Iconsax-Size: 24px;
    --Iconsax-Color: #fff;
}
.iconsax {
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: var(--Iconsax-Size);
    vertical-align: middle;
}

.form-select:disabled{
  background-color: #fff !important;
}



/* Main card area */
    .main-section {
      padding: 40px 0 60px;
    }

    .card-panel {
      background: white;
      border: 1px solid #14141440;
      border-radius: 12px;
      overflow: hidden;
      animation: fadeUp 0.5s 0.35s ease both;
    }
    .card-panel-header {
      background: #eee;
      padding: 18px 28px;
      border-bottom: 1px solid #14141412;
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .card-panel-header .label {
      font-size: 0.75rem;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: var(--sage);
    }
    .card-panel-header .order-num {
      font-family: 'Plus Jakarta Sans';
      font-size: 1.15rem;
      color: var(--ink);
      margin-left: auto;
    }
    .card-panel-body {
      padding: 28px;
    }

    /* Order detail rows */
    .detail-row {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      padding: 12px 0;
      border-bottom: 1px solid #14141412;
      font-size: 0.9rem;
    }
    .detail-row:last-child { border-bottom: none; }
    .detail-row .key {
      color: var(--warm-gray);
      font-weight: 400;
    }
    .detail-row .val {
      font-weight: 500;
      text-align: right;
      max-width: 55%;
    }
    .detail-row .val a {
      color: var(--sage);
      text-decoration: none;
    }
    .detail-row .val a:hover { text-decoration: underline; }

    /* Receipt link */
    .receipt-link {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 0.85rem;
      font-weight: 500;
      color: var(--sage);
      text-decoration: none;
      border: 1px solid var(--sage);
      border-radius: 6px;
      padding: 8px 16px;
      margin-top: 20px;
      transition: all 0.2s;
    }
    .receipt-link:hover {
      background: var(--sage);
      color: white;
    }

    /* Save info panel */
    .save-panel {
      background: white;
      border: 1px solid #14141440;
      border-radius: 12px;
      padding: 28px;
      animation: fadeUp 0.5s 0.45s ease both;
          margin-bottom: 60px;
    }
    .save-panel h3 {
    font-family: 'Urbanist';
    font-size: 1.2rem;
    margin-bottom: 6px;
    }
    .save-panel p {
      font-size: 0.85rem;
      color: var(--warm-gray);
      margin-bottom: 22px;
    }

    .form-label-custom {
      font-size: 0.78rem;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: var(--warm-gray);
      margin-bottom: 6px;
    }
    .form-control-custom {
      width: 100%;
      background: var(--cream);
      border: 1px solid #14141440;
      border-radius: 8px;
      padding: 11px 14px;
      font-size: 0.9rem;
      font-family: 'DM Sans', sans-serif;
      color: var(--ink);
      outline: none;
      transition: border-color 0.2s, box-shadow 0.2s;
    }
    .form-control-custom:focus {
      border-color: var(--sage);
      box-shadow: 0 0 0 3px rgba(74,124,89,0.12);
    }
    .form-control-custom::placeholder { color: #bbb; }
    .hint-text {
      font-size: 0.75rem;
      color: var(--warm-gray);
      margin-top: 5px;
    }

    .btn-create {
      background: var(--ink);
      color: white;
      border: none;
      border-radius: 8px;
      padding: 11px 24px;
      font-family: 'DM Sans', sans-serif;
      font-size: 0.88rem;
      font-weight: 500;
      letter-spacing: 0.03em;
      cursor: pointer;
      transition: background 0.2s, transform 0.1s;
      white-space: nowrap;
    }
    .btn-create:hover {
      background: var(--sage);
      transform: translateY(-1px);
    }
    .btn-create:active { transform: translateY(0); }

    /* Help sidebar */
    .help-sidebar {
      background: white;
      border: 1px solid #14141440;
      border-radius: 12px;
      padding: 24px;
      animation: fadeUp 0.5s 0.55s ease both;
    }
    .help-sidebar h5 {
      font-family: 'Urbanist';
      font-size: 1rem;
      margin-bottom: 14px;
    }
    .help-item {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      padding: 12px 0;
      border-bottom: 1px solid #14141412;
      font-size: 0.85rem;
    }
    .help-item:last-child { border-bottom: none; }
    .help-icon {
      width: 32px; height: 32px;
      border-radius: 8px;
      background: #eee;
      display: flex; align-items: center; justify-content: center;
      flex-shrink: 0;
      color: var(--sage);
    }
    .help-item .title { font-weight: 500; margin-bottom: 2px; }
    .help-item .desc { color: var(--warm-gray); font-size: 0.8rem; }
    .help-item a { color: var(--sage); text-decoration: none; font-weight: 500; }
    .help-item a:hover { text-decoration: underline; }