/* Reset Styles */

:root {
      --bs-primary: #2c6e91;
      --bs-primary-rgb: 44, 110, 145;

      /* Override commonly derived button/link variables too (safer) */
      --bs-btn-bg: var(--bs-primary);
      --bs-btn-border-color: var(--bs-primary);
      --bs-btn-color: #fff;
      --bs-btn-hover-bg: rgba(var(--bs-primary-rgb), .9);
      --bs-btn-hover-border-color: rgba(var(--bs-primary-rgb), .9);
      --bs-link-color: var(--bs-primary);
      --bs-outline-btn-color: var(--bs-primary);
      --bs-outline-btn-border-color: var(--bs-primary);

    }

    /* Optional: also set classes as a last-resort fallback */
    .btn-primary {
      background-color: var(--bs-primary);
      border-color: var(--bs-primary);
      color: #fff;
    }
    .btn-outline-primary {
      color: var(--bs-primary);
      border-color: var(--bs-primary);
    }
    .bg-primary { background-color: var(--bs-primary); }
    .text-primary { color: var(--bs-primary); }

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.lato-thin {
  font-family: "Lato", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.lato-light {
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.lato-regular {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.lato-bold {
  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.lato-black {
  font-family: "Lato", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.lato-thin-italic {
  font-family: "Lato", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.lato-light-italic {
  font-family: "Lato", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.lato-regular-italic {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.lato-bold-italic {
  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.lato-black-italic {
  font-family: "Lato", sans-serif;
  font-weight: 900;
  font-style: italic;
}

h1 {
  margin: 0;
  font-size: 32px;
  font-weight: 600;
  line-height: 140%;
  color: #2A2F33;
}

h2 {
  margin: 0;
  font-size: 28px;
  font-weight: 600;
  line-height: 140%;
  color: #2A2F33;
}

h3 {
  margin: 0;
  font-size: 24px;
  font-weight: 600;
  line-height: 140%;
  color: #2A2F33;
}

h4 {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
  line-height: 140%;
  color: #2A2F33;
}

h5 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  line-height: 140%;
  color: #2A2F33;
}

h6 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 140%;
  color: #2A2F33;
}

p {
  font-size: 16px;
  color: #555D66;
  line-height: 160%;
  margin: 0;
}

input,
input:hover,
input:focus,
input:active {
  outline: none;
}

ul,li {
    margin: 0;
    padding: 0;
}

a, a:hover, a:focus { text-decoration:none }

body {
  font-family: "Lato", sans-serif;
  background: #FFFBFB;
}


/* login pages styles start */

.login-wrap {
    width: 100%;
    min-height: 100vh;
    background: url("/assets/splash-background-acb0b60d.jpg") no-repeat scroll center center / cover;
    padding: 50px 0;
    display: flex;
    align-items: center;
}

.back-btn {position: absolute;left: 0;top: 80px;}

.login-wrap .container {
    position: relative;
    height: 100%;
}

.login-inner {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.btn-secondary {
    border-radius: 100px;
    padding: 12px 20px;
    background: radial-gradient(50% 50% at 50% 50%, #183B4E 0%, #20506A 100%);
    box-shadow: 0 0 1px 4px rgba(255, 255, 255, 0.10), 0 -4px 2px 0 rgba(0, 0, 0, 0.25) inset, 0 2px 1px 0 rgba(255, 255, 255, 0.25) inset;
}

.btn-secondary:hover {
    box-shadow: 0 0 1px 4px rgba(255, 255, 255, 0.10);
}

.btn-secondary .btn-icon {
    margin-right: 8px;
    float: left;
    margin-top: 0px;
    margin-left: 0;
}

.btn-secondary .btn-text {
    font-size: 14px;
    font-weight: bold;
    line-height: 140%;
}

.login-box {
    width: 480px;
    padding: 40px;
    border-radius: 32px;
    border: 2px solid #FFF;
    background: linear-gradient(180deg, rgba(240, 248, 255, 0.50) 0%, rgba(207, 227, 239, 0.50) 100%);
    backdrop-filter: blur(3px);
}

.login-title {
    width: 100%;
    text-align: center;
    margin-bottom: 40px;
}

.login-title h2 {
    margin-bottom: 6px;
}

.login-option-container {
    width: 100%;
    display: flex;
    align-items: center;
    column-gap: 16px;
}

.login-option-link {
    background: #fff;
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    flex: 0 0 auto;
}

.btn-outline-primary {
    border-color: #2C6E91;
    color: #2C6E91;
    border-radius: 99px;
    background: #fff;
    font-size: 14px;
    line-height: 20px;
    font-weight: bold;
    padding: 17px 40px;
    text-align: center;
}

.login-text-link {
    width: 100%;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
  background: #2C6E91;
  border-color: #2C6E91;
  color: #fff;
}

.or-devider {
    width: 100%;
    text-align: center;
    margin: 32px 0;
}

.or-devider p {
    position: relative;
}

.or-devider p:after {
    content: "";
    background: url("/assets/or-after-797f538a.svg");
    position: absolute;
    right: 30px;
    width: 100%;
    height: 1px;
    background-position: center right;
    background-repeat: no-repeat;
    top: 50%;
    transform: translateY(-50%);
}

.or-devider p:before {
    content: "";
    background: url("/assets/or-before-f3ee22c2.svg");
    position: absolute;
    left: 30px;
    width: 100%;
    height: 1px;
    background-position: center left;
    background-repeat: no-repeat;
    top: 50%;
    transform: translateY(-50%);
}

.login-input {
    width: 100%;
}

.login-input-box {
    width: 100%;
}

label {}

.label-sm {
    font-size: 14px;
    line-height: 20px;
    font-weight: bold;
    color: #2A2F33;
}

.login-input-box label {
    margin-bottom: 3px;
}

.login-input-inner {
    width: 100%;
    position: relative;
    padding: 1px;
    border-radius: 99px;
    background: linear-gradient(183deg, rgb(44 109 144 / 0%) 0%, #a3c7e4 100%);
}

.login-input-self {
    width: 100%;
    border-radius: 99px;
    border: none;
    font-size: 14px;
    color: #2A2F33;
    padding: 18px 18px 18px 48px;
    line-height: 20px;
    background: linear-gradient(94deg, #F0F8FF 0%, rgba(240, 248, 255, 0.50) 100%);
    box-shadow: -4px -6px 22px 0 rgba(160, 196, 223, 0.30) inset, 0 6px 12px 0 rgba(0, 0, 0, 0.10);
}

.login-input-icon {
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    align-items: center;
}

.login-input-wrap .login-input-box {
    margin-bottom: 18px;
}

.btn-primary {
    /*background-color: #2c6e91;
    border-color: #2c6e91;*/
    border-radius: 99px;
    padding: 15px 30px;
    font-size: 14px;
    font-weight: bold;
    line-height: 24px;
    text-align: center;
    display: inline-block;
    vertical-align: top;
    box-shadow: -4px -4px 16px 0 rgba(0, 0, 0, 0.05) inset, 0 6px 32px 0 rgba(10, 28, 48, 0.12);;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: #1D485E;
  border-color: #1D485E;
  box-shadow: none;
}

.btn-icon {
    display: inline-block;
    vertical-align: top;
    margin-left: 8px;
    margin-top: -1px;
}

.btn-text {
    line-height: 24px;
    display: inline-block;
    vertical-align: top;
}

.login-submit {
    width: 100%;
}

.login-submit a {
    width: 100%;
}

.otp-input {
    display: flex;
    column-gap: 8px;
    width: 100%;
}

.otp-input .login-input-self {
    padding: 18px 8px;
    text-align: center;
}

.login-title.left {
  text-align: left;
}

.resend {
    width: 100%;
    margin-top: 45px;
}

.resend p a {
    margin-left: 12px;
    color: #2A2F33;
    font-weight: bold;
}

.qs-text {
    margin-bottom: 12px;
}

.qs-inner {
    width: 100%;
}

.qs-inner label {
    width: 100%;
    position: relative;
    margin-bottom: 12px;
}

.qs-inner label .question-check {
    position: absolute;
    width: 20px;
    height: 20px;
    top: 50%;
    transform: translateY(-50%);
    left: 20px;
    border: 1px solid #7F8C99;
    border-radius: 4px;
}

.qs-check-label {
    width: 100%;
    display: inline-block;
    vertical-align: top;
    background: linear-gradient(135deg, #f0f8ff 0%, rgb(240 248 255 / 50%) 100%);
    box-shadow: inset -4px -6px 22px rgb(160 196 223 / 30%), 0px 6px 12px 0px rgb(0 0 0 / 10%);
    border-radius: 99px;
    border: 1px solid rgb(44 110 145 / 20%);
    color: #555D66;
    font-size: 16px;
    padding: 15px 20px 15px 48px;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.qs-inner label input:checked ~ .qs-check-label {
  border-color: rgb(44 110 145 / 100%);
  color: #2A2F33;
  transition: all 0.3s linear;
  -webkit-transition: all 0.3s linear;
}

/* login pages styles ends */


/* landingpage styles start */

.topbar {
    width: 100%;
    padding: 5px 0;
    background: linear-gradient(90deg, rgba(44, 110, 145, 0.10) 0%, rgba(44, 110, 145, 0.05) 49.52%, rgba(44, 110, 145, 0.10) 100%);
}

.topbar-inner {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.topbar-left, .topbar-right {
    width: 50%;
}

.topbar-right {
    display: flex;
    justify-content: flex-end;
}

.logout-link {
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    text-decoration: none;
    display: flex;
    align-items: center;
    color: #2A2F33;
}

.logout-link img {
    margin-right: 6px;
}

.navbar-wrap {
    width: 100%;
    padding: 10px 0;
}

.navbar-inner {
    width: 100%;
}

.nav-toggle {
    width: 100%;
    display: flex;
    align-items: flex-end;
    column-gap: 20px;
    justify-content: center;
    list-style: none;
}

.navlink-wrap {
    width: 150px;
    flex: 0 0 auto;
}

.nav-item-link {
    background: #ECEDEE;
    text-align: center;
    width: 100%;
    border-radius: 12px;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #2C6E91;
    position: relative;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.nav-item-link:hover {
    color: #2C6E91;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.nav-icon {
    margin-right: 8px;
    position: relative;
    z-index: 1;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.navlink-text {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    position: relative;
    z-index: 1;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.logo {
    width: 160px;
    text-align: center;
    margin: 0 auto;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.navlink-wrap.active .nav-item-link,
.navlink-wrap .nav-item-link:hover {
    background: transparent;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.nav-item-link:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: 15px;
    background: linear-gradient(225deg, #2C6E91 -0.42%, #4BBCF7 99.58%);
    z-index: -1;
    opacity: 0;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.navlink-wrap.active .nav-item-link:before,
.navlink-wrap .nav-item-link:hover:before {
    opacity: 1;
    left: 3px;
    top: -3px;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.nav-item-link:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    border: 1px solid rgba(255, 255, 255, 0.30);
    background: rgba(255, 255, 255, 0.50);
    box-shadow: -4px 4px 12px 0 rgba(255, 255, 255, 0.25) inset, -4px 4px 14px 0 rgba(0, 0, 0, 0.10);
    backdrop-filter: blur(2px);
    border-radius: 12px;
    opacity: 0;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.navlink-wrap.active .nav-item-link:after,
.navlink-wrap .nav-item-link:hover:after {
    opacity: 1;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.main-content {
    width: 100%;
    padding-top: 20px;
}

.diagnos-box {
    width: 100%;
}

.db-inner {
    width: 100%;
    text-align: center;
    background: url("/assets/diagnos-bg-9407ad13.jpg") no-repeat scroll center center / cover;
    display: flex;
    padding: 20px 20px;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    border-radius: 16px;
    border-bottom: 2px solid rgba(255, 255, 255, 0.00);
    box-shadow: 0 16px 40px 0 rgba(87, 125, 145, 0.16);
}

.db-inner h4 {
    font-size: 32px;
}

.treatment {
    width: 100%;
    overflow: hidden;
}

.py-60 {
    padding: 60px 0;
}

.treatment-slider {
    width: 100%;
    margin-top: 20px;
}

.treatment-slide {
    width: 200px !important;
}

.treatment-link {
    width: 100%;
    display: inline-block;
    vertical-align: top;
}

.treatment-box {
    width: 100%;
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 14px 34px 0 rgba(0, 0, 0, 0.10);
}

.treatment-box-img {
    width: 100%;
    height: 200px;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    background: #fff;
}

.treatment-box-img img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: auto;
    border-radius: 8px;
}

.tretment-box-content {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    padding: 12px;
    background: linear-gradient(349deg, rgba(255, 255, 255, 0.80) 7.8%, rgba(255, 255, 255, 0.20) 91.56%);
    backdrop-filter: blur(6px);
    border-radius: 0 0 8px 8px;
}

.tretment-box-content p {
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    color: #2A2F33;
}

.treatment-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    display: flex;
    padding: 3px 8px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 99px;
    background: radial-gradient(231.49% 100.03% at 100% 45.24%, rgba(44, 110, 145, 0.50) 0%, rgba(13, 33, 43, 0.50) 100%);
    backdrop-filter: blur(2px);
}

.treatment-badge p {
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 143%;
    color: #fff;
}

.treatment-badge.premium {
    display: flex;
    width: 26px;
    height: 26px;
    padding: 2px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    aspect-ratio: 1/1;
    background: radial-gradient(231.49% 100.03% at 100% 45.24%, rgba(44, 110, 145, 0.80) 0%, rgba(13, 33, 43, 0.80) 100%);
    backdrop-filter: blur(2px);
}

.treatmentSwiper {
    overflow: visible;
}

.post-wrap {
    width: 100%;
    padding-bottom: 60px;
}

.post-wrap {
    width: 100%;
    padding-bottom: 60px;
}

.post-inner {
    width: 100%;
}

.desktop-card {
    width: 100%;
    border-radius: 16px;
    background: #FFF;
    box-shadow: 0 14px 44px 0 rgba(0, 0, 0, 0.10);
    padding: 30px;
}

.ptn-inner {
    width: 320px;
    display: flex;
    list-style: none;
}

.ptn-item {
    width: 50%;
}

.ptn-item .nav-link {
    width: 100%;
    text-align: center;
    padding: 15px 8px;
    font-size: 16px;
    font-style: normal;
    color: #7F8C99;
    font-weight: 700;
    border-bottom: 2px solid transparent;
}

.ptn-item .nav-link.active {
    color: #1D485E;
    border-color: #1D485E;
}

.post-tab-nav {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.btn-primary.icon-left .btn-icon {
    margin-left: 0;
    margin-right: 8px;
}

.landing-post-wrap {
    width: 100%;
    margin-top: 20px;
}

.post-card {
    width: 100%;
    padding: 16px;
}

.post-header {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.post-user {
    display: flex;
    align-items: center;
}

.post-avatar {
    width: 48px;
    height: 48px;
    position: relative;
    border-radius: 100%;
    overflow: hidden;
    margin-right: 8px;
}

.post-avatar img {
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.post-user-content {
    width: auto;
    display: flex;
    flex-direction: column;
}

.post-user-content h6 {}

.post-user-content p {
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    color: #555D66;
}

.post-category {
    margin-right: 10px;
    position: relative;
}

.post-user-content p span:after {
    content: "";
    background: #555D66;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 3px;
    height: 3px;
    border-radius: 100%;
    right: -7px;
}

.post-user-content p span:last-child:after {
    display: none;
}

.post-user-content p span {
    position: relative;
}

.post-content {
    width: 100%;
    padding: 16px 0;
}

.post-text {
    width: 100%;
    margin-bottom: 8px;
}

.post-link {
    width: 100%;
    margin-bottom: 8px;
}

.post-link a {
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%; /* 25.6px */
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    color: #2C6E91;
}

.post-media {
    width: 100%;
    display: flex;
    align-items: flex-start;
    gap: 6px;
    align-self: stretch;
    margin-bottom: 8px;
}

.post-media-item {
    width: 72px;
    height: 72px;
    position: relative;
    overflow: hidden;
    border-radius: 8px;
}

.post-media-item img {
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.post-doc {
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #BADEF3;
}

.post-doc.yt {
    background: #E9E0E4;
}

.post-readmore {
    width: 100%;
}

.post-readmore a {
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 140%; /* 19.6px */
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: auto;
    text-underline-offset: auto;
    text-underline-position: from-font;
    color: #2A2F33;
}

.post-footer {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 16px;
    align-self: stretch;
}

.post-reaction {
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    color: #2A2F33;
    border: none;
    background: none;
    display: flex;
    align-items: center;
    gap: 5px;
}

.post-slide {
    width: 412px;
    border-radius: 16px;
    border: 1px solid rgba(0, 0, 0, 0.10);
    padding: 10px;
}

/* landingpage styles ends */

/* treatment page styles start */

.treatment-search {
    width: 345px;
}

.treatment-page-wrap {
    width: 100%;
    padding-bottom: 60px;
}

.treatment-page-inner {
    width: 100%;
}

.treatment-page-inner > h2 {
    width: 100%;
    margin-bottom: 16px;
}

.tr-card {
    width: 100%;
    display: flex;
    padding: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    border-radius: 16px;
    border: 1px solid #FFF;
    background: linear-gradient(90deg, #FFF 0%, rgba(255, 255, 255, 0.00) 100%);
    box-shadow: 0 14px 34px 0 rgba(0, 0, 0, 0.10);
    position: relative;
    margin-bottom: 24px;
}

.tr-card-wrap {
    width: 100%;
    padding-top: 30px;
    min-height: 467px;
}

.tr-icon {
    display: flex;
    padding: 0;
    align-items: center;
    gap: 10px;
    border-radius: 4px;
    width: 100%;
    max-width: 100px;
}

.tr-icon img {
    width: 100%;
    border-radius: 4px;
}

.tr-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    align-self: stretch;
}

.tr-content h5 {
    color: #2C6E91;
}

.tr-card .treatment-badge {
    left: inherit;
    right: 10px;
}

/* treatment page styles ends */

/* treatment detail page start */

.btn-primary-icon {
    display: flex;
    padding: 11px;
    justify-content: center;
    align-items: center;
    border-radius: 99px;
    background: #2C6E91;
    box-shadow: -4px -4px 16px 0 rgba(0, 0, 0, 0.05) inset, 0 6px 32px 0 rgba(10, 28, 48, 0.12);
    width: 44px;
    height: 44px;
    flex: 0 0 auto;
}

.btn-primary-icon:hover,
.btn-primary-icon:focus,
.btn-primary-icon:active,
.btn-primary-icon:first-child:active {
  background: #2C6E91;
}

.title-with-btn {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.treatment-page-inner .title-with-btn h2 {
    margin-bottom: 0;
}

.trt-summary {
    width: 100%;
    margin-top: 30px;
}

.trt-summary h4 {
    margin-bottom: 12px;
}

.btn-simple {
    color: #2A2F33;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    padding: 2px 0;
}

.trt-summary p {
    margin-bottom: 16px;
}

.trt-accordian-wrap {
    width: 100%;
    margin-top: 30px;
}

.trt-accordian-wrap .accordion-item {
    margin-bottom: 30px;
    border-radius: 16px;
    border: 2px solid #FFF;
    background: linear-gradient(92deg, rgba(255, 255, 255, 0.80) 8.69%, rgba(255, 255, 255, 0.16) 97.91%);
    box-shadow: 0 6px 32px 0 rgba(10, 28, 48, 0.12);
}

.trt-accordian-wrap .accordion-item .accordion-button {
    background: transparent;
    padding: 10px 16px;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
}

.trt-accordian-wrap .accordion-item .accordion-header {
    background: transparent;
}

ol.numbered-list {
    list-style: auto;
}

ol.numbered-list li {
    list-style: auto;
}

.trt-accordian-wrap .accordion-button:not(.collapsed) {
    color: #2A2F33;
}

.trt-accordian-wrap .accordion-body p {
    margin-bottom: 12px;
}

.edu-material-media {
    width: 100%;
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    column-gap: 12px;
    margin-top: 12px;
}

.em-box {
    width: 160px;
    flex: 0 0 auto;
}

.em-box-anchor {
    width: 100%;
    display: flex;
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    height: 107px;
}

.em-box-anchor img {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 100%;height: auto;}

.post-for-accordian .post-card {
    border: 1px solid rgba(0, 0, 0, 0.10);
    border-radius: 16px;
}

.post-for-accordian .btn-simple {
    margin-top: 12px;
    width: auto;
    display: inline-block;
    vertical-align: top;
}

.start-treatment-button {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

.st-box {
    width: auto;
    display: flex;
    align-items: center;
}

.st-box a {
    color: #fff;
    margin-right: 12px;
}

.st-box .form-switch {
    margin: 0;
    padding-top: 0;
    padding-bottom: 0;
    min-height: unset;
    padding-right: 0;
}

.mobile-only {
    display: none;
}

/* treatment detail page ends */

/* post list page style start */

.post-list-inner {
    width: 100%;
    max-width: 700px;
    margin: 30px auto 0 auto;
}

.post-card-wrap {
    width: 100%;
    border-radius: 16px;
    border: 1px solid rgba(0, 0, 0, 0.10);
    margin-bottom: 20px;
}

.post-link-extra .dropdown-toggle::after {
    display: none;
}

.post-link-extra .btn.dropdown-toggle {
    padding: 3px 4px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.post-list-page-wrap {
    padding-bottom: 60px;
}

/* post list page style ends */

/* post details page style start */

.post-comments {
    display: flex;
    padding: 16px;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    align-self: stretch;
    border-radius: 16px 16px 0 0;
    border-top: 1px solid #FFF;
    border-right: 1px solid #FFF;
    border-left: 1px solid #FFF;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.50) 0%, rgba(255, 255, 255, 0.00) 100%);
    box-shadow: 0 14px 34px 0 rgba(0, 0, 0, 0.10);
}

.pc-row {
    width: 100%;
}

.pc-box {
    display: flex;
    padding: 8px;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    width: 100%;
}

.pc-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 4px;
    flex: 1 0 0;
    position: relative;
}

.pc-wrap {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    align-self: stretch;
}

.login-input-icon img {
    width: 20px;
}

.add-comments {
    width: 100%;
    display: flex;
    align-items: center;
}

.ac-input {
    width: 100%;
    display: flex;
    align-items: center;
    column-gap: 8px;
}

.ac-input .btn-primary-icon {width: 58px;height: 58px;}

.login-input-inner.no-icon .login-input-self {
    padding-left: 18px;
}

/* post details page styles ends */

/* add post styles start */

.login-input-box.textarea-box .login-input-self {
    border-radius: 16px;
    display: flex;
}

.add-post-wrap {
    width: 100%;
    margin-top: 30px;
}

textarea, textarea:hover, textarea:focus, textarea:active, select, select:hover, select:focus, select:active {
    outline: none;
}

.login-input-box.textarea-box .login-input-inner {
    border-radius: 16px;
}

.btn-cancel {
    border-radius: 99px;
    padding: 15px 30px;
    font-size: 14px;
    font-weight: bold;
    line-height: 24px;
    text-align: center;
    display: inline-block;
    vertical-align: top;
    /* box-shadow: -4px -4px 16px 0 rgba(0, 0, 0, 0.05) inset, 0 6px 32px 0 rgba(10, 28, 48, 0.12); */
}

.btn-cancel:hover {
    background-color: transparent;
}
.btn-submit-wrap {
    width: 100%;
    display: flex;
    column-gap: 10px;
    justify-content: flex-end;
}

/* add post styles ends */

/* community styles start */

.c-subtitle {
    width: 100%;
    margin-top: 30px;
    display: flex;
    align-items: center;
    margin-bottom: 16px;
}

.cs-left {
    width: 50%;
}

.cs-right {
    width: 50%;
    display: flex;
    justify-content: flex-end;
    column-gap: 10px;
}

.groups-wrap {
    width: 100%;
    padding-top: 16px;
}

.group-slide {
    width: 175px;
}

.group-link {
    width: 100%;
    display: inline-block;
    vertical-align: top;
}

.gr-box {
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0 14px 34px 0 rgba(0, 0, 0, 0.10);
    display: flex;
    width: 100%;
    padding: 24px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    position: relative;
}

.gr-icon {
    display: flex;
    padding: 12px;
    align-items: center;
    gap: 10px;
    border-radius: 100px;
    background: var(--Natural-Neutral-1, #F0F8FF);
}

.gr-badge {
    width: 24px;
    height: 24px;
    border-radius: 100%;
    background: radial-gradient(231.49% 100.03% at 100% 45.24%, rgba(44, 110, 145, 0.80) 0%, rgba(13, 33, 43, 0.80) 100%);
    backdrop-filter: blur(2px);
    position: absolute;
    right: 6px;
    top: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.groupSwiper, .grouprecommendedSwiper {
    overflow: visible;
}

.community-page-inner {
    overflow: hidden;
}

.group-join-btn {
    display: flex;
    padding: 4px 0;
    justify-content: center;
    align-items: center;
    border-radius: 99px;
    background: #2C6E91;
    box-shadow: -4px -4px 16px 0 rgba(0, 0, 0, 0.05) inset, 0 6px 32px 0 rgba(10, 28, 48, 0.12);
    align-self: stretch;
    color: #fff;
}

.ui-tab-title {
    width: 100%;
    display: flex;
    align-items: center;
    margin-top: 16px;
}

.uit-left {
    width: 50%;
}

.uit-right {
    display: flex;
    justify-content: flex-end;
    width: 50%;
}

.poll-box {
    width: 100%;
    border-radius: 8px;
    background: #FFF;
    box-shadow: 0 12px 24px 0 rgba(0, 0, 0, 0.10);
    padding: 16px;
    border-radius: 8px;
}

.polls-wrap {
    width: 100%;
    margin-top: 20px;
}

.poll-title {
    width: 100%;
}

.poll-content {
    width: 100%;
    margin-top: 12px;
}

.poll-option-wrap {
    width: 100%;
}

.poll-option {
    width: 100%;
    margin-bottom: 6px;
}

.po-inner {
    width: 100%;
    border-radius: 99px;
    background: #F0F8FF;
    padding: 10px 20px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.poll-option label {
    width: 100%;
    position: relative;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    cursor: pointer;
}

.poll-option label input[type="radio"] {
    position: absolute;
    opacity: 0;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.poll-option label input[type="radio"]:checked ~ .po-inner {
    background: #A8D8D8;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.poll-option label input[type="radio"]:checked ~ .po-inner .poll-tick {
    opacity: 1;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.poll-tick {
    opacity: 0;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.poll-submit {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    row-gap: 6px;
}

.poll-helper-text {
    width: 100%;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    color: #555D66;
}

.poll-comment-input {
    border-radius: 99px;
    background: var(--Natural-Neutral-4, #E6E6EB);
    border: none;
    padding: 10px 20px;
    width: 100%;
}

.btn-primary.poll-submit-btn {
    width: 100%;
    padding: 8px 30px;
}

.pcs-box {
    width: 100%;
    position: relative;
    border-radius: 99px;
    background: #F0F8FF;
    padding: 10px 20px;
    display: flex;
    align-items: center;
    margin-bottom: 6px;
}

.pcb-result {
    display: flex;
    padding: 4px 6px;
    justify-content: center;
    align-items: center;
    border-radius: 99px;
    background: #2C6E91;
    color: #fff;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

.pcb-comment {
    width: 100%;
    text-align: center;
}

.cmpoll-slide {
    width: 373px;
}

.communitypollSwiper {
    overflow: visible;
}

.all-poll-list-wrap {
    margin-top: 16px;
}

.poll-summary-wrap {
    width: 100%;
    margin-top: 24px;
}

.poll-summary-wrap .post-comments {
    border-radius: 16px;
}

.poll-options-wrap .login-input-inner {
    margin-bottom: 10px;
}

/* community styles ends */

.treatment-page-inner .title-with-btn {
    margin-bottom: 16px;
}

.mini-goal-wrap {
    width: 100%;
}

.mg-alert {
    margin-top: 12px;
}

.minigoal-switch {
    width: 100%;
}

.minigoal-switch .form-check {
    width: auto;
    display: inline-block;
    border: 1px solid #2c6e91;
    padding: 16px 30px 16px 60px;
    border-radius: 99px;
    box-shadow: -4px -4px 16px 0 rgba(0, 0, 0, 0.05) inset, 0 6px 32px 0 rgba(10, 28, 48, 0.12);
}

.mg-log-wrap {
    width: 100%;
    margin-top: 24px;
}

.card.mg-card {
    padding: 24px;
}

.mg-progress {
    width: 100%;
    margin-top: 20px;
    margin-bottom: 12px;
}

.mg-submit {
    width: 100%;
}

.mg-submit .minigoal-switch {
    margin-bottom: 20px;
}

.incident-wrap {
    width: 100%;
    margin-top: 20px;
}

.iw-switch {
    width: 100%;
    margin-top: 16px;
}

.leak-form {
    width: 100%;
    margin-top: 20px;
}

.leak-form>label {
    /* width: 100%; */
    margin-bottom: 6px;
}

.leak-form.leak-volume-input {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 16px;
}

.leak-form .btn-outline-primary {
    padding: 10px 30px;
}

.bath-wrap {
    width: 100%;
    margin-top: 20px;
}

.bath-wrap .iw-switch.minigoal-switch {
    margin-bottom: 16px;
}

/* new styles 14-11 starts */

.dl-custom-radio {
    width: auto;
    display: flex;
    flex-wrap: wrap;
    border: 1px solid rgba(0,0,0,0.1);
    justify-self: flex-start;
    border-radius: 12px;
    overflow: hidden;
}

.dl-radio-label {
    width: auto;
    position: relative;
}

.dl-radio-label input[type="radio"] {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    cursor: pointer;
}

.dl-radio-box {
    width: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 12px 20px;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.dl-radio-box img {
    width: 42px;
}

.dl-radio-text {
    font-size: 16px;
    margin-top: 2px;
}

.dl-radio-label input[type="radio"]:checked ~ .dl-radio-box {
    background: #BADEF3;
    transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
}

.btn-submit-wrap.left {
    justify-content: flex-start;
}

/* new styles 14-11 ends */

.login-box-outer {
    background: url("/assets/box-background-c9193165.jpg") no-repeat scroll center center / cover;
    border-radius: 32px;
}

.login-submit .btn {
    width: 100%;
}

.remember-me-box {
    width: 100%;
    margin: 10px 0;
}

.remember-me-box label {
    width: auto;
    display: flex;
    align-items: center;
}

.remember-me-box label input {
    margin-right: 5px;
}

.login-helper-links {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-top: 10px;
    gap: 10px;
}

a {
    color: #2c6e91;
    
}

a:hover, a:focus, a:active {
    color: #1D485E;
}

.trix-content div {
    margin-bottom: 10px;
}

.question-main-text {
    font-size: 16px;
    margin-bottom: 20px;
}

.chart-filter-inner {
    width: 100%;
}

.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active {
    background-color: #2c6e91;
    border-color: #2c6e91;
}

.group-options {
    z-index: 9;
}

.reaction-btn {
    border: none;
    background: none;
    display: flex;
    align-items: center;
    gap: 5px;
}

.post-reaction-count-text {
    position: relative;
    top: 1px;
}

.post-comments form{ width: 100% !important }
.no-radius{ border-radius: 0!important; }

trix-editor,
.trix-content { /* or whatever your render container class is */
  font-family: sans-serif;
  line-height: 1.5;
}

/* Make ordered list numbers visible inside Trix editor */
trix-editor ol,
.trix-content ol {
  list-style-type: decimal !important;
  margin-left: 1.5rem !important;
  padding-left: 1.2rem !important;
}

/* Style the list items a bit for spacing */
trix-editor li,
.trix-content li {
  margin-bottom: 0.4rem;
}

trix-editor div{
    display: block;
}

.post-list-type {
    border-radius: 16px;
    border: 1px solid rgba(0, 0, 0, 0.10);
    padding: 10px;
    margin: 10px 0 10px;
}

.gr-badge-relative {
    width: 24px;
    height: 24px;
    border-radius: 100%;
    background: radial-gradient(231.49% 100.03% at 100% 45.24%, rgba(44, 110, 145, 0.80) 0%, rgba(13, 33, 43, 0.80) 100%);
    backdrop-filter: blur(2px);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.treatment-options, .group-options {
    position: absolute;
    top: 10px;
    left: 10px;
    display: flex;
    padding: 3px 8px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    border-radius: 99px;
    backdrop-filter: blur(2px);

    left: inherit;
    right: 10px;
}
.date-filter .login-input-self{ width: 250px; }
.btn-danger {
    /*background-color: #2c6e91;
    border-color: #2c6e91;*/
    border-radius: 99px;
    padding: 15px 30px;
    font-size: 14px;
    font-weight: bold;
    line-height: 24px;
    text-align: center;
    display: inline-block;
    vertical-align: top;
    box-shadow: -4px -4px 16px 0 rgba(0, 0, 0, 0.05) inset, 0 6px 32px 0 rgba(10, 28, 48, 0.12);;
    background-color: red;
}

#wizard-select{ padding-right: 20px; }

.btn-disabled {
  pointer-events: none;
  color: #9ca3af; /* gray */
  cursor: not-allowed;
}

.btn-enabled {
  pointer-events: auto;
  color: #2563eb; /* blue */
  text-decoration: underline;
  cursor: pointer;
}

#polls #myTab1{ min-width: 320px; }

.date-filter .form-control{ display:inline; }

#polls #myTab1{ width: 500px; }

.pc-wrap .turbo-frame, .pc-wrap .comment-edit{
  width: 100%;
}

.hidden{ display: none; }

.ptn-inner{ width: 500px; }

.input-calendar {
  position: relative;
}

.calendar-icon-leak, .calendar-icon-bathroom {
  position: absolute;
  right: 20px;
  top: 40%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  pointer-events: none;
}

.reaction-btn.active {
    color: #2b6d8f;
    font-weight: bold;
}

.post-tab-wrap>h6 {
    margin-bottom: 10px;
}

.progress-chart-outer {
    width: 100%;
    margin-top: 40px;
}

.progress-card.desktop-card {
    background: rgba(255,255,255,0.2);
}

.assets-remove {
    margin-top: 27px;
}

.add-new-asset-btn {
    margin-bottom: 10px;
}

.post-doc img {
    width: 36px;
}

.em-box.em-doc .em-box-anchor {
    background: #BADEF3;
}

.em-box.em-doc .em-box-anchor img {
    width: 56px;
}

.filter-submit-btn {
    width: 100%;
    padding-top: 28px;
}

.filter-submit-btn .btn.btn-primary {
    width: 100%;
}

.progress-card .tab-pane {
    padding-top: 30px;
}

.post-content .em-box {
    width: 72px;
}

.post-content .em-box .em-box-anchor {
    height: 72px;
}

.post-content .em-box.em-doc .em-box-anchor img {
    width: 36px;
}

.user-avatar {
    width: 100%;
    display: flex;
    align-items: center;
    padding-top: 28px;
    margin-bottom: 14px;
}

.avatar-preview-img {
    position: relative;
    width: 89px;
    height: 89px;
    border-radius: 100%;
    overflow: hidden;
    margin-right: 14px;
    border: 1px solid #dfdfdf;
}

.avatar-preview-img img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: auto;
    transform: translate(-50%, -50%);
}

.upload-avatar {
    width: 100%;
}

.upload-avatar input {width: 100%;border-radius: 16px;}

.privacy-text {
    width: 100%;
}

.privacy-text p {
    margin-bottom: 10px;
}

.privacy-text ol>li {
    margin-bottom: 20px;
}

.privacy-text ol>li h5 {
    margin-bottom: 10px;
}

.privacy-text ol>li ul {
    padding-left: 30px;
    margin-bottom: 10px;
}

.privacy-text li {
    color: #555D66;
}

.privacy-text ol>li::marker {
    font-size: 18px;
    font-weight: 600;
    color: #2A2F33;
}

.drag-handle {
  cursor: grab;
  font-size: 18px;
  user-select: none;
}

.sortable-ghost {
  opacity: 0.4;
}

.inactive-list{ display: none; }

.btn-cancel:active {
    background: #fff !important;
}

.post-media {
    overflow-x: auto;
}

/* Responsive styles start */

@media (max-width: 767px) {
    
    .mobile-only {
        display: block;
    }

    .login-wrap {
        background: #FFFCF9;
    }

    .desktop-only {
        display: none;
    }

    .back-btn .btn-secondary {
        width: auto;
    }

    .login-box-outer {
        background: none;
        border-radius: 0;
        margin-top: auto;
        padding-top: 50px;
        width: 100%;
    }
 
    .login-box {
        width: 100%;
        background: transparent;
        box-shadow: none;
        padding: 0 16px;
        margin-top: auto;
        border: none;
        backdrop-filter: none;
        border-radius: 0px;
    }

    .login-inner .logo {
        width: 228px;
        margin-bottom: 40px;
    }

    .login-inner .logo img {
        width: 100%;
    }

    .login-inner {
        align-items: center;
        padding-top: 0;
        padding-bottom: 0;
        flex-direction: column;
        justify-content: flex-start;
    }

    .or-devider p:before {
        left: 0;
    }

    .or-devider p:after {
        right: 0;
    }

    .back-btn {
        position: static;
        width: 100%;
    }

    .login-inner .back-btn .btn-text {
        display: none;
    }

    .login-inner .back-btn .btn-icon {
        margin-right: 0;
    }

    .login-inner .back-btn a.btn.btn-secondary {
        padding: 17px 17px;
    }

    .login-inner.questions-inner {
        padding-bottom: 56px;
    }

    .qs-check-label {
        font-size: 14px;
    }

    .login-input-wrap.otp-box-wrap {
        position: relative;
    }

    .resend {
        position: absolute;
    }

    main.main-content {
        padding-top: 84px;
        min-height: 100vh;
        padding-bottom: 81px;
    }

    .db-inner {
        border-radius: 0px;
        position: relative;
        text-align: left;
        align-items: flex-start;
        margin: 0 -12px;
        width: auto;
        padding: 20px;
    }

    .db-inner p {
        padding-left: 0;
    }

    .db-inner > img {
        position: absolute;
        top: 52px;
        left: 16px;
    }

    .treatment-slide {
        width: 90px !important;
    }

    .treatment-box-img {
        height: 90px;
    }

    .tretment-box-content {
        position: static;
    }

    .tretment-box-content p {
        font-size: 15px;
        word-wrap: break-word;
        width: 100%;
    }

    .post-tab-wrap>h6 {
        padding: 0 16px;
        margin-bottom: 10px;
    }

    .treatment.py-60 {
        padding: 32px 0;
    }

    .desktop-card {
        box-shadow: none;
        background: #fffbfb;
        border-radius: 0;
        padding: 0;
        width: auto;
        margin: 0 -12px;
    }

    .ptn-inner {
        width: 100%;
    }

    .landing-post-wrap .btn.btn-primary.icon-left {
        width: 100%;
    }

    .post-slide {
        width: 100%;
    }

    .landing-post-wrap {
        padding: 0 16px;
    }

    .title-with-btn {
        padding: 20px 16px 20px 70px;
        background: #eeeeee url("/assets/diagnos-bg-9407ad13.jpg") no-repeat scroll center center / cover;
        box-shadow: 0 16px 40px 0 rgba(87, 125, 145, 0.16);
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 11;
    }

    .tr-left {
        width: 100%;
    }

    .tr-right {
        position: absolute;
        left: 16px;
        top: 50%;
        transform: translateY(-50%);
    }

    .title-with-btn.icon-right-mobile {
        padding: 20px 70px 20px 16px;
    }

    .title-with-btn.icon-right-mobile .tr-right {
        left: unset;
        right: 16px;
    }

    .post-list-inner {
        margin-top: 12px;
    }

    .post-list-inner .post-card-wrap {
        border-radius: 0;
        border-width: 0 0 1px 0;
        padding-bottom: 15px;
        margin-bottom: 15px;
    }

    .loadmore-btn {
        padding: 0 16px;
    }

    .loadmore-btn a.btn-secondary {
        width: 100%;
    }

    .post-list-page-wrap {
        padding-bottom: 15px;
    }

    .add-post-wrap {
        padding: 0 16px;
    }

    .btn-submit-wrap {
        flex-direction: column-reverse;
    }

    main.main-content.landing-page {
        padding-top: 0;
    }

    .treatment-page-inner .post-tab-content-wrap {
        padding: 0 12px;
    }

    .tr-card {
        flex-direction: row;
        margin-bottom: 16px;
    }

    .c-subtitle {
        padding: 0 16px;
    }

    .group-slide {
        width: 160px;
    }

    .more-view-content-btn {
        padding: 0 16px;
    }

    .cs-left.full-width {
        width: 100%;
    }

    .ui-tab-title {
        padding: 0 16px;
    }

    .cmpoll-slide {
        width: 100%;
    }

    .polls-wrap {
        padding: 0 16px;
    }

    .groups-wrap {
        padding-left: 21px;
        padding-right: 21px;
    }

    .groups-wrap .col {
        margin-bottom: 10px;
        padding: 0 5px;
    }

    .groups-wrap .row.mt-4 {
        margin-top: 0 !important;
    }

    .groups-wrap .col-6 {
        padding: 0 5px;
        margin-bottom: 10px;
    }

    .all-poll-list-wrap {
        padding: 0 16px;
    }

    .btn-secondary {
        width: 100%;
    }

    .poll-box {
        margin-bottom: 10px;
    }

    .poll-summary-wrap .col-lg-4 {
        padding-left: 12px;
        padding-right: 12px;
    }

    .poll-summary-wrap {
        padding: 0 12px;
    }

    .mobile-navbar {
        width: 100%;
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        padding: 10px 16px;
        border-top: 1px solid rgba(255, 255, 255, 0.00);
        background: linear-gradient(91deg, rgba(186, 222, 243, 0.60) -20.54%, rgba(186, 222, 243, 0.30) 115.64%);
        box-shadow: 0 -4px 15px 0 rgba(255, 255, 255, 0.25) inset, 0 -4px 14px 0 rgba(0, 0, 0, 0.11);
        backdrop-filter: blur(7px);
        z-index: 99;
    }

    .mn-toggle {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        list-style: none;
    }

    .mn-link-wrap {
        width: auto;
        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
    }

    .mn-icon {
        display: flex;
        width: 32px;
        height: 32px;
        align-items: center;
        justify-content: center;
        position: relative;
        z-index: 1;
        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
    }

    .mn-item-link {
        width: 60px;
        height: 60px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        position: relative;
        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
    }

    .mn-text {
        font-size: 10px;
        font-style: normal;
        font-weight: 600;
        color: #2C6E91;
        position: relative;
        z-index: 1;
        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
    }

    .mn-item-link:before {
        width: 100%;
        content: "";
        height: 100%;
        position: absolute;
        border-radius: 12px;
        background: linear-gradient(225deg, #2C6E91 -0.42%, #4BBCF7 99.58%);
        top: 0;
        left: 0;
        opacity: 0;
        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
    }

    .mn-link-wrap.active .mn-item-link:before {
        opacity: 1;
        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
    }

    .mn-item-link:after {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        border-radius: 12px;
        border: 1px solid rgba(255, 255, 255, 0.30);
        background: rgba(255, 255, 255, 0.50);
        box-shadow: -4px 4px 12px 0 rgba(255, 255, 255, 0.25) inset, -4px 4px 14px 0 rgba(0, 0, 0, 0.10);
        backdrop-filter: blur(2px);
        opacity: 0;
        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
    }

    .mn-link-wrap.active .mn-item-link:after {
        opacity: 1;
        top: 3px;
        left: -3px;
        transition: all 0.3s ease-in-out;
        -webkit-transition: all 0.3s ease-in-out;
    }

    .tr-left h2 {
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .tr-left h2 {
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .trt-summary {
        padding: 0 16px;
    }

    .trt-accordian-wrap {
        padding: 0 16px;
    }

    .edu-material {
        padding: 0 16px;
    }

    .post-for-accordian .post-card {
        margin-bottom: 10px;
    }

    .incident-tab-pane {
        padding: 0 16px;
    }

    .incident-wrap {
        padding: 0 16px;
    }

    .daily-log-wrap {
        padding: 0 16px;
    }

    .dl-radio-label {
        width: 25%;
    }

    .btn-submit-wrap.left {
        flex-direction: column;
    }

    header.desktop-only {
        display: block;
    }

    header.desktop-only .navbar-wrap {
        display: none;
    }

    .add-comments .ac-input {
        flex-wrap: wrap;
    }

    .add-comments .ac-input input.btn.btn-primary {width: 100%;margin-top: 10px;}

    .reaction-btn {
        border: none;
        background: none;
    }

    .mb-alert .alert {
        margin-top: 60px;
        margin-bottom: 0 !important;
    }

    .tr-icon {
        width: 60%;
    }

    .chart-filter-inner {
        padding: 16px 16px 0 16px;
    }

    .chart-filter-card {
        padding: 16px 16px 0 16px;
    }

    .chart-filter-inner .login-input-box.last {
        margin-top: 16px;
    }

    .tr-content h5 {
        padding-right: 35px;
        font-size: 16px;
        word-wrap: break-word;
    }


    .tr-content p {
        font-size: 14px;
    }

    .dl-radio-text {
        font-size: 13px;
    }

    .alert {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        z-index: 99999999;
        border-radius: 0 !important;
        border-width: 0 0 1px 0;
        backdrop-filter: blur(2px);
    }

    .alert.alert-success {
        background: rgb(209 231 221 / 80%);
    }

    .alert.alert-primary {
        background: rgb(207 226 255 / 80%);
    }

    .alert.alert-secondary {
        background: rgb(226 227 229 / 80%);
    }

    .alert.alert-danger {
        background: rgb(248 215 218 / 80%);
    }

    .alert.alert-warning {
        background: rgb(255 243 205 / 80%);
    }

    .alert.alert-info {
        background: rgb(207 244 252 / 80%);
    }

    .alert.alert-light {
        background: rgb(252 252 253 / 80%);
    }

    .alert.alert-dark {
        background: rgb(206 212 218 / 80%);
    }

    .progress-card .tab-pane {
        padding: 20px 20px 0 20px;
    }

    .progress-charts-wrap {
        margin-top: 40px;
    }

    .user-profile-page-wrap {
        padding: 0 16px;
    }

    .treatment-box {
        box-shadow: none;
        border: 1px solid #dfdfdf;
        border-width: 0 1px 1px 1px;
    }

    .tretment-box-content {
        min-height: 72px;
        display: flex;
        align-items: center;
    }

    .treatment-box-img {
        border-radius: 8px 8px 0 0;
        height: 87px;
    }

    .treatment-box-img img {
        border-radius: 8px 8px 0 0;
    }

    .dl-custom-radio {
        width: 100%;
    }

    .privacy-text {
        padding: 0 16px;
    }

    .dl-radio-box .dl-radio-text {
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .dl-radio-box {
        padding: 12px 6px;
    }

}

/* Responsive styles ends */

