.typing-cursor {
   animation: blink 1s steps(1) infinite;
 }

 @keyframes blink {

   0%,
   50% {
     opacity: 0.6;
   }

   51%,
   100% {
     opacity: 0;
   }
 }

 .time-mechine {
   display: flex;
 }



 .glass-box {
   /* min-height: 130px;
  margin-bottom: -230px; */
   position: relative;
   border-radius: 48px;
   border: 1px solid rgba(255, 255, 255, 0.08);
   background: rgba(255, 255, 255, 0.132);
   box-shadow: 0 22px 60px rgba(0, 0, 0, 0.05);
   backdrop-filter: blur(16px);
   -webkit-backdrop-filter: blur(16px);
   max-width: 1024px;
   margin-left: auto;
   margin-right: auto;
   border: 1px solid var(--bs-primary-bg-subtle);
 }

 .modal-backdrop-blur {
   position: fixed;
   inset: 0;
   background: rgba(0, 0, 0, 0.45);
   backdrop-filter: blur(6px);
   -webkit-backdrop-filter: blur(6px);
   z-index: 1050;
 }

 input[type="time"]::-webkit-calendar-picker-indicator {
   color: var(--bs-text-color);
 }

 .start-placeholder::placeholder {
   color: var(--bs-placeholder);
   opacity: 1;
 }

 .custom-placeholder::placeholder {
   color: var(--bs-text-color);
   opacity: 1;
   /* optional */

 }

 .modal-dialog-centered {
   position: fixed;
   inset: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   z-index: 1060;
   padding: 1rem;
 }

 .modal-card {
   max-width: 540px;
   width: 100%;
   border-radius: .75rem;
 }

 .chat-textarea {
   border: none !important;
   /* default border */
   outline: none !important;
 }

 .chat-textarea:focus {
   border: none !important;
   outline: none !important;
   /* Also removes the default focus outline */
 }


 /* ensure close button looks OK on dark bg */
 .btn-close {
   background: transparent;
   border: none;
   width: 1.1rem;
   height: 1.1rem;
   position: relative;
 }

 .btn-close::before,
 .btn-close::after {
   content: '';
   position: absolute;
   left: 50%;
   top: 50%;
   width: 14px;
   height: 2px;
   background: #333;
   transform-origin: center;
 }

 .btn-close::before {
   transform: translate(-50%, -50%) rotate(45deg);
 }

 .btn-close::after {
   transform: translate(-50%, -50%) rotate(-45deg);
 }

 /* ... (استایل‌های موجود شما) ... */

 .desktop-sidebar {
   /* این ویژگی اصلی برای چسبنده کردن سایدبار است */
   position: sticky;

   /* فاصله از بالای صفحه که در آنجا ثابت می‌شود. 
     این مقدار را باید با ارتفاع هدر ثابت خود تنظیم کنید. */
   top: 120px;

   /* این خط بسیار مهم است!
     چون والد (div.row) یک فلکس‌باکس است، این ویژگی از کش آمدن سایدبار 
     به اندازه ارتفاع محتوای اصلی جلوگیری می‌کند. */
   align-self: flex-start;

   /* برای اینکه اگر محتوای سایدبار از ارتفاع صفحه بلندتر شد، اسکرول بخورد */
   max-height: calc(100vh - 90px);
   overflow-y: auto;
 }

 .appt_label {
   display: inline-block;
   background: #73b8f5;
   font-size: 20px;
   font-family: Arial, sans-serif;
   padding: 7px 30px 7px 10px;
   border-radius: 30px 0 0 30px;
   min-width: 120px;
   /* سمت چپ گرد */
   position: relative;
   clip-path: polygon(0 0, 100% 0, calc(100% - 8px) 100%, 0% 100%);
 }

 .appt_label::after {
   content: "";
   position: absolute;
   top: 0;
   right: 0;
   width: 2px;
   /* ضخامت خط */
   height: 100%;
   background: #ffffff;
   /* رنگ خط (سفید مثل تصویر) */
   transform: skew(-20deg);
   transform-origin: top;
 }

 .cookie-consent-banner {
   /* This creates a shadow with:
     - 0 horizontal offset
     - -4px vertical offset (top shadow)
     - 12px blur
     - A subtle color that works in both light and dark modes
  */
   box-shadow: 0 -4px 18px rgba(0, 0, 0, 0.1);
   transition: transform 0.3s ease-in-out;
 }

 body.dark .cookie-consent-banner {
   box-shadow: 0 -4px 8px rgba(255, 255, 255, 0.15);
 }

 .search-input-home {
   border-start-start-radius: 32px;
   border-end-start-radius: 32px;
   width: calc(100% - 50px);
   height: 72px;
   padding-inline-start: 12px;
   font-size: 20px;
   --bs-text-color: var(--black-color);
   transform: translateZ(0);
 }

 .search-input-start {
   /* border-start-start-radius: 32px;
  border-end-start-radius: 32px; */
   margin-block: 10px;
   width: calc(100% - 40px);
   height: 72px;
   vertical-align: middle;
   font-size: 20px;
   background-color: transparent;
   --bs-text-color: "#FFF";
   transform: translateZ(0);
   scrollbar-width: none;
   /* For Firefox */
 }

 @media (max-width: 772px) {
   .glass-box {
     max-width: 90%;
     min-width: 300px;
   }


 }

 /* :root[data-bs-theme='dark'] .glass-box {
  background: rgba(15, 15, 17, 0.35);
  bs-primary-bg-subtle: rgba(255, 255, 255, 0.08);
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.6);
} */

 .glass-section {
   /* border-radius: 48px; */

   /* background-clip: padding-box; */
 }

 /* :root[data-bs-theme='dark'] .glass-section {
  bs-primary-bg-subtle: rgba(255, 255, 255, 0.08);
} */

 .glass-primary {
   border: none;

   /* background: rgba(var(--bs-primary-rgb), 0.12); */
   /* color: var(--bs-body-color); */
 }

 .glass-secondary {
   background: rgba(var(--bs-primary-rgb), 0.12);
   color: var(--bs-body-color);
 }

 .glass-secondary:hover {
   background: rgba(var(--bs-primary-rgb), 0.25);
 }

 .glass-secondary1:hover {
   background: rgba(var(--bs-primary-rgb), 0.25);

 }

 .list-group-item:last-child {
   background-color: var(--bs-body-bg) !important;
   color: var(--bs-text-color) !important;
 }

 @media (min-width: 992px) {

   .glass-secondary {
     border-end-end-radius: 48px;
     border-start-end-radius: 48px;
   }

   .glass-secondary1 {
     border-start-start-radius: 48px;
     border-end-start-radius: 48px;
   }
 }

 @media (max-width: 992px) {


   .glass-secondary {
     border-end-end-radius: 48px;
     border-end-start-radius: 48px;
   }
 }



 /* استایل برای بقیه جدول که اسکرول می‌شود */
 .time-mechine .scrollable-table {
   overflow-x: auto;
   width: 100%;
 }

 table {
   border-collapse: collapse;
   width: 100%;
 }

 th,
 td {
   border: 1px solid #ccc;
   padding: 8px;
   text-align: center;
   white-space: nowrap;
 }


 .time-mechine th:first-child,
 .time-mechine td:first-child {
   position: sticky;
   left: 0;
   background: white;
   /* پس‌زمینه برای جلوگیری از روی هم افتادن */
   z-index: 10;
   box-shadow:
     0px 10px 15px -3px rgba(48, 48, 48, 0.1),
     0px 4px 6px -2px rgba(0, 0, 0, 0.05);

 }

 .scrollable-table table {
   border-left: 0;
 }

 .wave-container {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 5px;
 }

 .wave {
   width: 4px;
   height: 20px;
   background: var(--s-primary-btn-hover-border-color);
   animation: wave-animation 1s infinite;
 }

 .wave:nth-child(2) {
   animation-delay: 0.2s;
 }

 .wave:nth-child(3) {
   animation-delay: 0.4s;
 }

 .wave:nth-child(4) {
   animation-delay: 0.6s;
 }

 .wave:nth-child(5) {
   animation-delay: 0.8s;
 }

 .wave:nth-child(6) {
   animation-delay: 1s;
 }

 .wave:nth-child(7) {
   animation-delay: 1.2s;
 }

 .wave:nth-child(8) {
   animation-delay: 1.4s;
 }

 @keyframes wave-animation {

   0%,
   100% {
     height: 10px;
   }

   50% {
     height: 20px;
   }
 }

 .disclaimer-container {
   width: 100%;
   margin-left: auto;
   margin-right: auto;
   padding-left: 2rem;
   padding-right: 2rem;
   color: var(--bs-text-color);
   font-size: small;
 }

 .disclaimer-title {
   font-weight: bold;
 }

 .roadmap-pay {
   position: absolute;
   left: 0px;
   right: 0px;
   bottom: 0px;
   height: 12rem;
   padding: 0.75rem;
   background-color: var(--dark-white-color);
   border-top: 1px solid var(--bs-primary-bg-subtle);
   border-top-left-radius: 0.75rem;
   border-top-right-radius: 0.75rem;
   color: var(--bs-text-color);
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
 }

 .discounttext {
   text-decoration-line: line-through;
   font-size: 12px;
 }

 .spter-container {
   width: 100%;
   height: 55px;
   display: flex;
   border-bottom-left-radius: 0.75rem;
   border-bottom-right-radius: 0.75rem;
   background-color: var(--bs-primary-bg-subtle);
   direction: ltr;
 }

 body.dark .spter-container {
   width: 100%;
   height: 55px;
   display: flex;
   border-bottom-left-radius: 0.75rem;
   border-bottom-right-radius: 0.75rem;
   background-color: var(--bs-primary-bg-subtle);
   direction: ltr;
 }

 .footer-logo {
   font-family: "Good Times RG" !important;
 }

 .start_page_icon {
   width: 180px;
   height: 180px;
   border-radius: 90px;
   z-index: 20;
   cursor: pointer;
 }

 .provider_page_icon {
   width: 250px;
   height: 250px;
   border-radius: 50%;
   z-index: 20;
   cursor: pointer;
 }

 /* .load-text {
    font-size: 9vw;
    font-weight: 200;
    letter-spacing: 12px;
    text-transform: uppercase;
    height: 200px;
    z-index: 20;
    margin-top: 30px;
    color: #FFF;
    direction: ltr;

 
    -webkit-text-stroke: 2px transparent;
     text-stroke: 2px transparent;
    background: linear-gradient(90deg, #4CAF50, #2196F3, #FF5722);
     -webkit-background-clip: text;
     background-clip: text;
    filter: drop-shadow(0 0 1px #FF5722) drop-shadow(0 0 5px #4CAF50) drop-shadow(0 0 1px #2196F3);
 } */
 .load-text text,
 svg {
   font-family: "Good Times RG" !important;
 }

 #load-text {
   font-family: "Good Times RG" !important;

   justify-content: center;
   align-items: center;
 }

 .flex-selectable-checked {
   display: flex;
   cursor: pointer;
   user-select: none;
   font-size: 0.875rem;
   font-weight: 500;
 }

 .box-style-checked {
   height: 1.25rem;
   width: 1.25rem;
   align-items: center;
   justify-content: center;
   border-radius: 0.5rem;
   border: none;
 }

 /* #checkboxLabel{
    display: none;
} */

 .user_login {
   display: none;
 }

 .user_login label {
   display: block;
   margin-bottom: 5px;
 }

 .user_login input[type="text"],
 .user_login input[type="email"],
 .user_login input[type="password"] {
   display: block;
   width: 90%;
   padding: 10px;
   border: 1px solid #ddd;
   color: #666;
 }

 .user_login input[type="checkbox"] {
   float: inline-start;
   margin-inline: 10px;
   width: 22px;
 }

 .user_login input[type="checkbox"]+label {
   float: inline-start;
 }

 .user_login .checkbox {
   padding-inline-end: 8px;
   clear: both;
   overflow: hidden;
 }

 .user_login span {
   line-height: normal;
 }

 .profile-form label {
   display: block;
   margin-bottom: 5px;
   color: var(--bs-text-color);
 }

 .MuiOutlinedInput-notchedOutline {
   border: none !important;
   padding-top: 0 !important;
 }

 .MuiSvgIcon-root {
   color: var(--bs-text-color) !important;
 }

 .MuiInputBase-formControl {
   border-radius: 8px !important;
   border: 1px solid var(--bs-primary-bg-subtle) !important;
   background-color: var(--bs-body-bg) !important;
   color: var(--bs-text-color) !important;
 }

 .profile-form input[type="text"],
 .profile-form input[type="email"],
 .profile-form input[type="tel"],
 .profile-form input[type="url"],
 .profile-form input[type="password"],
 .profile-form textarea,
 .profile-form select {
   display: block;
   width: 100%;
   padding: 10px;
   border-radius: 8px;
   border: 1px solid var(--bs-primary-bg-subtle);
   background-color: var(--bs-body-bg);
   color: var(--bs-text-color);
 }

 .MuiInputAdornment-root .MuiInputAdornment-positionEnd .MuiInputAdornment-outlined .MuiInputAdornment-sizeSmall .MuiIconButton-loadingIndicator {

   color: var(--bs-text-color) !important;
 }

 .profile-form input[type="checkbox"] {
   float: inline-start;
   margin-inline: 10px;
   width: 22px;
 }

 .profile-form input[type="checkbox"]+label {
   float: inline-start;
 }

 .profile-form .checkbox {
   padding-inline-end: 8px;
   clear: both;
   overflow: hidden;
 }

 .profile-form span {
   line-height: normal;
 }

 .profile-picture-edit-btn {
   position: absolute;
   cursor: pointer;
   bottom: 1rem;
   right: 3.5rem;
   background-color: var(--bs-body-bg);
   color: var(--bs-primary);
   border-radius: 0.75rem;
   padding-inline: 0.5rem;
   font-size: 0.75rem;
 }

 .text-link-checked {
   color: #3b82f6;
   transition: text-decoration 0.3s;
   background-color: transparent;
 }

 .text-link-checked:hover {
   text-decoration: underline;
 }

 .load-text-footer {
   font-size: 10px !important;
   height: 40px;
 }

 .text-block {
   margin-bottom: 6.25rem;
   padding-top: 0.75rem;
   font-weight: 500;
   font-size: 1rem;
   color: var(--bs-text-color);
   text-align: center;
 }

 .question-class {
   min-height: 2.5rem;
   height: 2.5rem;
   overflow: hidden;
   overflow-wrap: anywhere;
 }



 @media (max-width: 991px) {
   .mobile-breadcrumb-section {
     padding: 70px 0 0 0 !important;
   }
 }

 @media (max-width: 640px) {
   .search-input-start {
     font-size: 0.7rem;

   }

   .question-class {
     min-height: 3.5rem;
     height: 3.5rem;
     font-size: 1rem;
   }
 }

 .tp-about-desc-content p {
   text-align: start;
 }

 @media (min-width: 1024px) {
   .search-input-start {
     font-size: 1.1rem;

   }

   .question-class {
     font-size: 1.125rem;
   }
 }

 .header-area a {
   color: var(--bs-text-color);
 }

 .anastomi-font {
   font-family: "Good Times RG" !important;
 }

 @media (max-width: 761px) {
   .tp-about-desc-content p {
     text-align: center;
   }

   .load-text {
     font-size: 7.7vw;
   }

   .question-class {
     font-size: 0.5rem;
   }
 }

 /* Responsive adjustments */
 @media (max-width: 768px) {
   .load-text {
     display: block;
     padding-inline: 50px;
     font-size: 6vw;
     letter-spacing: 2px;
     /* Adjust font size for tablets */
   }

   .btngetstarted {
     font-size: 1rem;
     padding: 8px 16px;
   }
 }

 @media (max-width: 480px) {
   .load-text {
     letter-spacing: 1px;
     /* Adjust font size for mobile */
   }

   .btngetstarted {
     font-size: 0.9rem;
     padding: 6px 12px;
   }
 }

 .load-text span {
   font-family: "Good Times RG", sans-serif !important;
   -webkit-animation: loading 1s infinite alternate;
   animation: loading 1s infinite alternate;
   -webkit-text-stroke: 0.3px #d3d3d3;
   /* Initial gray border */
   color: transparent;
   /* Transparent text */
   position: relative;
   transition: -webkit-text-stroke-color 0.08s ease;
   display: inline-block;
 }

 .load-text span:nth-child(1) {
   -webkit-animation-delay: 0s;
   animation-delay: 0s;
 }

 .load-text span:nth-child(2) {
   -webkit-animation-delay: 0.1s;
   animation-delay: 0.1s;
 }

 .load-text span:nth-child(3) {
   -webkit-animation-delay: 0.2s;
   animation-delay: 0.2s;
 }

 .load-text span:nth-child(4) {
   -webkit-animation-delay: 0.3s;
   animation-delay: 0.3s;
 }

 .load-text span:nth-child(5) {
   -webkit-animation-delay: 0.4s;
   animation-delay: 0.4s;
 }

 .load-text span:nth-child(6) {
   -webkit-animation-delay: 0.5s;
   animation-delay: 0.5s;
 }

 .load-text span:nth-child(7) {
   -webkit-animation-delay: 0.6s;
   animation-delay: 0.6s;
 }

 body.dark .post-container {
   max-width: 768px;
   margin-left: auto;
   margin-right: auto;
   background-color: var(--black-color2);
   border: 1px solid var(--bs-primary-bg-subtle2);
   border-radius: 1rem;
   padding: 0.5rem;
   box-shadow:
     0px 10px 15px -3px rgba(48, 48, 48, 0.1),
     0px 4px 6px -2px rgba(0, 0, 0, 0.05);

   margin-top: 5rem;
   margin-bottom: 4rem;
 }

 body.dark .post-container-nouser {
   max-width: 768px;
   margin-left: auto;
   margin-right: auto;
   background-color: var(--black-color2);
   border: 1px solid var(--bs-primary-bg-subtle2);
   border-radius: 1rem;
   padding: 0.5rem;
   box-shadow:
     0px 10px 15px -3px rgba(48, 48, 48, 0.1),
     0px 4px 6px -2px rgba(0, 0, 0, 0.05);

   margin-top: 1rem;
   margin-bottom: 1rem;
 }

 .post-container {
   max-width: 768px;
   margin-left: auto;
   margin-right: auto;
   background-color: var(--bs-light);
   border: 1px solid var(--bs-primary-bg-subtle);
   border-radius: 1rem;
   padding: 0.5rem;
   box-shadow:
     0px 10px 15px -3px rgba(48, 48, 48, 0.1),
     0px 4px 6px -2px rgba(0, 0, 0, 0.05);

   margin-top: 5rem;
   margin-bottom: 4rem;
 }

 .post-container-nouser {
   max-width: 768px;
   margin-left: auto;
   margin-right: auto;
   background-color: var(--bs-light);
   border: 1px solid var(--bs-primary-bg-subtle);
   border-radius: 1rem;
   padding: 0.5rem;
   box-shadow:
     0px 10px 15px -3px rgba(48, 48, 48, 0.1),
     0px 4px 6px -2px rgba(0, 0, 0, 0.05);

   margin-top: 1rem;
   margin-bottom: 1rem;
 }

 .post-container-header {
   direction: ltr;
   position: relative;
   border-bottom: 1px solid var(--bs-primary-bg-subtle);

   padding-bottom: 0.5rem;
 }

 .post-container-header2 {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   align-items: center;
 }

 .post-container-header3 {
   position: relative;
   display: flex;
   align-items: flex-start;
   cursor: pointer;
 }

 .post-container-badge {
   /* position: absolute; */
   /* right: 0.25rem; */
   border-radius: 50%;
   display: flex;
   justify-content: center;
   align-items: center;
   background-color: #bfdbfe;
   padding: 0.25rem 1rem;
   border-radius: 0.5rem;
   min-width: 4.5rem;
   color: #4b5563;
   font-size: 0.75rem;

 }

 .expert-picture {
   min-height: 280px;
   max-height: 280px;
   object-fit: cover;
 }

 .relative-avatar {
   position: relative;
   border-radius: 9999px;
   width: 2.5rem;
   height: 2.5rem;
   margin-inline-end: 0.75rem;
   overflow: hidden;
 }

 .post-containertext-style {
   color: var(--bs-text-color);
   font-size: 0.875rem;
   line-height: 1.25rem;
 }

 @media (min-width: 640px) {
   .post-container.text-style {
     font-size: 1.125rem;
     line-height: 1.75rem;
   }

   .expert-picture {
     min-height: 280px !important;
     max-height: 280px !important;
   }
 }

 @media (max-width: 641px) {
   .expert-picture {
     max-height: 400px !important;
   }
 }

 .document-container {
   display: flex;
   align-items: flex-end;
   font-size: 0.875rem;
   overflow: auto;
   margin-top: 4rem;
 }

 .document-pdf-mini {
   max-height: 5rem;
   min-width: 6rem;
   overflow: hidden;
 }

 .opend-tap {
   padding-top: 0.5rem;
   bs-primary-bg-subtle: #2563eb;
   color: #2563eb;
   white-space: nowrap;
   display: flex;
   margin-right: 0.125rem;
   border: 1px solid;
   border-bottom: 0;

   line-height: 1.75rem;
   padding: 0.25rem 0.75rem;
   font-size: 1rem;
   outline: none;
   border-top-left-radius: 0.375rem;
   border-top-right-radius: 0.375rem;
 }

 /* .opend-tap span {
    background-color: var(--bs-text-color2);
    color: var(--bs-primary-bg-subtle2);
    margin-inline-start: 0.75rem;
    margin-top: 0.35rem;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 700;
} */

 body.dark .document-popup-bg {
   position: relative;
   background-color: var(--black-color2);
   height: calc(90vh);
   overflow-y: auto;
 }

 .document-popup-bg {
   width: 100%;
   position: relative;
   background-color: var(--bs-light);
   height: calc(90vh);
   overflow-y: auto;
 }

 .agreement-container {
   display: flex;
   width: 100%;
   justify-content: justify;
   flex-direction: column;
   padding: 1rem;
   color: var(--bs-text-color);
   min-height: 390px;
   font-size: 1rem;
 }

 body.dark .signin-popup-bg {
   position: relative;
   background-color: var(--black-color2);

   overflow-y: hidden;
 }

 .signin-popup-bg {
   width: 100%;
   position: relative;
   background-color: var(--bs-light);

   overflow-y: hidden;
 }

 .sticky-pop-header {
   position: sticky;
   top: 0;
   z-index: 50;
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
   border-bottom: 1px solid var(--bs-primary-bg-subtle);
   width: 100%;
   height: 3.5rem;
   font-weight: 700;
   color: var(--bs-text-color);
   font-size: 1.125rem;
   padding-inline: 1rem;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
 }

 .sticky-pop-footer2 {
   position: sticky;
   bottom: 0;
   z-index: 50;
   padding-top: 0.75rem;
   padding-bottom: 0.75rem;
   border-top: 1px solid var(--bs-primary-bg-subtle);
   width: 100%;
   height: 3.5rem;
   font-weight: 700;
   color: var(--bs-text-color);
   font-size: 1.125rem;
   padding-inline: 1rem;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
 }

 .absolute-pop-button-doc {
   display: flex;
   flex-direction: row;
   justify-content: end;
   align-items: center;
   padding: 0;
   height: 1.5rem;
   min-width: 80px;
 }

 .absolute-pop-button {
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 0;
   border-radius: 9999px;
   width: 1.5rem;
   height: 1.5rem;
   color: #3b82f6;
   transition: all 0.3s ease-in-out;
 }

 .absolute-pop-button:hover {
   background-color: #dbeafe;
 }

 .full-pop-container {
   width: 100%;
   height: 100%;
   padding: 0.75rem;
   color: var(--bs-text-color);
   overflow-y: auto;
   flex: 1;
   padding-bottom: 9rem;
   margin-bottom: 6rem;
 }

 .small-pop-container {
   width: 100%;
   height: 100%;
   padding: 0.75rem;
   color: var(--bs-text-color);
   overflow-y: auto;
   flex: 1;
 }

 .sticky-pop-footer {
   position: sticky;
   bottom: 0;
   background-color: #e5e7eb;
   margin-left: auto;
   margin-right: auto;
   border-radius: 0.5rem;
   width: 100%;
   height: auto;
   max-height: 6rem;
 }

 .company-logo span {
   font-size: 13px;
   font-family: "Good Times RG" !important;
 }

 .full-pop-page {
   width: 100%;
   height: 100%;
   padding: 0.75rem;
   text-align: center;
   display: flex;
   justify-content: center;
   align-items: center;
   color: #d1d5db;
   overflow-y: auto;
   flex: 1;
 }

 .document-container button span {
   background-color: var(--bs-text-color);

   color: var(--bs-primary-bg-subtle2);
   margin-inline-start: 0.75rem;
   margin-top: 0.25rem;
   border-radius: 50%;
   width: 18px;
   height: 18px;
   display: flex;
   justify-content: center;
   align-items: center;
   font-weight: 700;
   font-size: smaller;
 }

 body.dark .closed-tap span {
   background-color: var(--bs-text-color2);
 }

 .closed-tap {
   padding-top: 0.5rem;
   bs-primary-bg-subtle: var(--bs-primary-bg-subtle2);

   color: var(--bs-text-color);
   white-space: nowrap;
   display: flex;
   margin-right: 0.125rem;
   border: 1px solid;
   border-bottom: 0;
   padding: 0.25rem 0.75rem;
   font-size: 0.875rem;
   line-height: 1.5rem;
   outline: none;
   border-top-left-radius: 0.375rem;
   border-top-right-radius: 0.375rem;
 }

 body.dark .document-container button {
   background-color: var(--bs-primary-bg-subtle);
 }

 .document-container button {
   background-color: var(--bs-light);
 }

 .opend-tap-text {
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 0.375rem;
   background-color: var(--bs-primary-bg-subtle2);
   min-width: 1.25rem;
   font-size: 0.875rem;
   margin-left: 0.25rem;
   font-weight: 500;
 }

 .closed-tap-text {
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 0.375rem;
   background-color: var(--bs-primary-bg-subtle2);
   min-width: 1.25rem;
   font-size: 0.875rem;
   margin-left: 0.25rem;
   font-weight: 500;
 }

 .single-experience p {
   min-height: 50px;
 }

 .flex-between-pointer {
   display: flex;
   justify-content: space-between;
   cursor: pointer;
 }

 .flex-wrap-center {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
 }

 .flex-item-text-date {
   display: flex;
   align-items: center;
   padding-inline-start: 0.75rem;
   font-weight: 500;
   color: var(--bs-text-color2);
   font-size: 0.75rem;
 }

 .question-class {
   color: var(--bs-text-color);
   /* text-gray-400 (#9ca3af رنگ پیش‌فرض) */
   font-size: 1rem;

   /* text-xs (12px یا 0.75rem) */
   display: flex;
   /* flex (برای نمایش فلکس) */
   justify-content: flex-start;
   /* justify-start (چیدمان آیتم‌ها در شروع) */
   align-items: center;
   /* items-center (مرتب‌سازی عمودی وسط) */
 }

 @media (max-width: 1100px) {
   .question-class {
     font-weight: 600;
     font-size: 0.8rem;
   }
 }

 /* Responsive adjustments */
 @media (max-width: 768px) {
   .search-input-start {
     font-size: 1rem;
   }

   .question-class {
     font-weight: 600;
     font-size: 0.65rem;
   }
 }

 @media (max-width: 600px) {
   .search-input-start {
     line-height: 1.3rem;
   }


 }

 .group-hover-block {
   position: absolute;
   top: -0.75rem;
   right: 0.25rem;
   display: none;
   background-color: #eff6ff;
   padding: 0.5rem;
   border-radius: 9999px;
   transition: all 0.3s ease-in-out;
 }

 .group:hover .group-hover-block {
   display: block;
 }

 .spacing-text {
   margin-top: 1.25rem;
   margin-bottom: 1.25rem;
   font-size: 1rem;
   line-height: 1.625rem;
 }

 @media (min-width: 640px) {
   .spacing-text {
     line-height: 1.625rem;
   }
 }

 @media (min-width: 1024px) {
   .spacing-text {
     line-height: 1.625rem;
   }
 }

 @media (min-width: 1280px) {
   .spacing-text {
     line-height: 1.625rem;
   }
 }

 .posttext {
   border: none !important;
 }

 .posttext {
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   height: auto;
   max-height: 3em;
   /* برای سه خط */
 }

 .posttext2 {
   display: -webkit-box;
   -webkit-line-clamp: 3;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   height: auto;
   max-height: 3em;
   font-weight: bold;
   color: var(--bs-text-color);
   /* برای 2 خط */
 }

 .postshowmore {
   -webkit-line-clamp: unset;
   max-height: unset;
 }

 .translate-text {
   background-color: transparent;
   color: var(--bs-text-color);
   float: left;
   margin-top: 0.5rem;
   margin-bottom: 0.75rem;
   font-size: 0.75rem;
 }

 .float-end-text {
   float: right;
   margin-top: 0.5rem;
   margin-bottom: 0.75rem;
   color: var(--bs-text-color);
   font-size: 0.75rem;
 }

 #demo-positioned-button {
   background-color: transparent;
 }

 .post-action-container {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-top: 4rem;
   margin-bottom: 1.25rem;
   padding: 0.5rem;
   border: 1px solid var(--bs-primary-bg-subtle);
   border-radius: 0.5rem;
 }

 .post-action-item-text {
   display: flex;
   align-items: center;
   background-color: transparent;

   font-weight: 500;
   color: var(--bs-text-color);
   font-size: 0.75rem;
 }

 .post-action-center-rounded {
   display: flex;
   justify-content: center;
   align-items: center;
   height: 100%;
   border-radius: 0.375rem;
   min-width: 1.25rem;
   max-height: 1.25rem;
   font-weight: 500;
   color: var(--bs-text-color2);
   background-color: var(--bs-primary-bg-subtle2);
   font-size: 0.875rem;
   margin-inline-start: 0.25rem;
 }

 .post-action-center-text {
   display: flex;
   align-items: center;
   font-weight: 500;
   color: var(--bs-text-color);
   background-color: transparent;
   font-size: 0.75rem;
 }

 .text-body-color-margin {
   color: var(--bs-text-color);
   margin-inline-end: 0.5rem;
   font-size: 1rem;
 }

 .post-action-button-center-text {
   display: flex;
   align-items: center;
   font-weight: 500;
   color: var(--bs-text-color);
   background-color: transparent;
   font-size: 0.75rem;
 }

 body.dark .searchboxvitai {
   padding-left: 0.5rem;
   padding-right: 0.5rem;
   background-color: var(--bs-primary-bg-subtle);
   border: 1px solid var(--bs-primary-bg-subtle2);
   border-radius: 0.75rem;
   width: 100%;
   margin-left: auto;
   margin-right: auto;
 }

 .searchboxvitai {
   padding-left: 0.5rem;
   padding-right: 0.5rem;
   background-color: var(--bs-primary-bg-subtle);
   border: 1px solid var(--bs-primary-bg-subtle2);
   border-radius: 0.75rem;
   width: 100%;
   margin-left: auto;
   margin-right: auto;
 }

 /* .searchboxvitai:hover {
  background-color: var(--bs-primary-bg-subtle2);
} */

 .player-class {
   display: flex;
   background-color: var(--bs-body-bg);
   justify-content: space-between;
   height: 3rem;
   border-bottom: 0.5px solid var(--bs-primary-bg-subtle2);
   color: var(--bs-text-color);
   border-top-left-radius: 0.75rem;
   border-top-right-radius: 0.75rem;
 }

 body.dark .player-class {
   display: flex;
   background-color: var(--black-color2);
   justify-content: space-between;
   height: 3rem;
   border-bottom: 1px solid var(--bs-primary-bg-subtle);
   border-top-left-radius: 0.75rem;
   border-top-right-radius: 0.75rem;
 }

 body.dark .player-class10 {
   height: 8rem;
 }

 .player-class10 {
   height: 8rem;
 }

 @media (min-width: 768px) {
   .player-class {
     height: 2.75rem;
   }

   .player-class10 {
     height: 8rem;
   }
 }

 .player-class2 {
   width: 2.5rem;
   height: 2.5rem;
 }

 .player-class3 {
   height: 3.5rem;
 }

 @media (max-width: 640px) {

   .player-class3 {
     height: 2.5rem;
     max-width: 130px;
   }
 }

 .ai-container {
   width: 100%;
   height: 450px;
   overflow-y: auto;
   padding-inline: 15px;
   padding-block: 10px;
   color: var(--bs-text-color);
   background-color: var(--bs-body-bg);
   font-size: small;
   border-bottom-right-radius: 0.75rem;
   border-bottom-left-radius: 0.75rem;
 }

 body.dark.ai-container {
   width: 100%;
   height: 440px;
   overflow-y: auto;
   padding-inline: 15px;
   color: var(--bs-text-color);
   background-color: var(--black-color2);
   font-size: small;
   border-bottom-right-radius: 0.75rem;
   border-bottom-left-radius: 0.75rem;
 }

 @media (min-width: 768px) {
   .player-class2 {
     width: 4rem;
   }

 }

 @media (max-width: 768px) {
   .ai-container {
     height: 180px;
   }
 }

 .typist-class {
   display: flex;
   /* flex */
   width: 100%;
   /* w-full */
   overflow-y: hidden;
   /* overflow-y-hidden */
 }

 .typist-class p {
   display: flex;
   /* flex */
   align-items: center;
   /* items-center */
   height: 2.5rem;
   /* h-10 (10 x 0.25rem = 2.5rem or 40px) */
   font-size: 0.75rem;
   /* text-sm (14px or 0.875rem) */
 }

 @media (min-width: 768px) {

   /* md:text-md */
   .typist-class p {
     font-size: 1rem;
     /* 16px or 1rem */
   }
 }

 .generateport-container {
   max-width: 768px;
   margin-left: auto;
   /* mx-auto */
   margin-right: auto;
   display: flex;
   gap: 15px;
   flex-wrap: wrap;
   justify-content: center;
   /* justify-center */
   align-items: flex-start;
   /* items-start */
   width: 100%;
   /* w-full */
   height: 100%;
 }

 .write-post {
   background-color: var(--bs-light);
   border: 1px solid var(--bs-primary-bg-subtle2);
   border-radius: 0.75rem;
   flex: 0.65;
   width: 100%;
 }

 body.dark .write-post {
   background-color: var(--black-color2);
   border: 1px solid var(--bs-primary-bg-subtle2);
   border-radius: 0.75rem;
   flex: 0.65;
   width: 100%;
 }

 textarea {
   border: none;
   overflow: auto;
   outline: none;

   -webkit-box-shadow: none;
   -moz-box-shadow: none;
   box-shadow: none;

   resize: none;
   /*remove the resize handle on the bottom right*/
 }

 .post-content textarea,
 .container2 {
   min-height: 395px;
   padding: 10px;
   border: none;
   background-color: transparent;
   color: var(--bs-text-color2);
 }

 .MuiChip-root .MuiChip-filled {
   background-color: var(--bs-text-color2) !important;
   border-radius: 50%;
 }

 .specialitiesbox {
   color: var(--bs-text-color) !important;
   background-color: var(--bs-primary-bg-subtle);
   border-radius: 0.75rem;
   padding-right: 0 !important;
 }

 .specialitiesbox .MuiInputBase-input {
   color: var(--bs-text-color) !important;
 }

 .specialitiesbox ::placeholder {
   color: var(--bs-text-color2);
 }

 .MuiChip-label,
 .MuiChip-deleteIcon {
   color: var(--bs-text-color2) !important;
 }

 .MuiChip-filledDefault {
   border: 1px solid var(--bs-text-color2) !important;
 }

 .ai-post {
   flex: 0.35;
   height: 505px;
   max-height: 505px;
   min-height: 240px;
   background-color: var(--bs-body-bg);
   border: 1px solid var(--bs-primary-bg-subtle);
   border-radius: 0.75rem;
 }

 .Cursor--blinking {
   display: none !important;
 }

 .ai-container p {
   font-size: 0.9rem;
   margin-bottom: 3px !important;
   line-height: 22px !important;
 }

 .robot-container2 {
   position: relative;
   flex: 1;

   margin-bottom: 0.25rem;
   padding-left: 0.75rem;

   padding-right: 0.75rem;

   padding-top: 0.5rem;

   padding-bottom: 0.5rem;

   border-radius: 0.75rem;

   height: 100%;

   color: #e5e7eb;

   overflow-y: hidden;
 }

 @media (max-width: 768px) {
   .generateport-container {
     flex-direction: column;
     padding-inline: 5px;
   }

   .agreement-container {
     min-height: 220px;
   }

   .post-content textarea,
   .container2 {
     min-height: 220px;
   }

   .ai-post {
     order: -1;
     flex: 1;
     width: 100%;
   }

   .write-post {
     flex: 1;
   }
 }

 .header-generate-post {
   direction: ltr;
   display: flex;
   flex-direction: row;
   justify-content: space-between;

   background-color: var(--bs-body-bg);
   border-bottom: 1px solid var(--bs-primary-bg-subtle2);

   padding-left: 1rem;

   padding-right: 1rem;

   padding-top: 0.5rem;

   padding-bottom: 0.5rem;

   border-bottom-width: 1px;
   border-top-right-radius: 0.75rem;
   border-top-left-radius: 0.75rem;
   width: 100%;
 }

 .swal2-container,
 .swal2-popup {
   z-index: 999999;
 }

 .header-generate-post2 {
   position: relative;
   /* relative */
   display: flex;
   /* flex */
   justify-content: space-between;
   /* justify-between */
   align-items: center;
   /* items-center */
   border-radius: 9999px;
   /* rounded-full */
   min-width: 16rem;
   /* min-w-64 (64 x 0.25rem = 16rem or 256px) */
   cursor: pointer;
   /* cursor-pointer */
   padding-inline-end: 1.25rem;
   /* pe-5 (5 x 0.25rem = 1.25rem or 20px) */
 }

 .header-generate-post3 {
   display: flex;
   align-items: center;
   color: var(--bs-text-color);
 }

 .header-generate-post4 {
   font-weight: bold;
   color: var(--bs-text-color);
   /* text-gray-900 */
   font-size: 0.875rem;
   /* text-sm */
   line-height: 1.375rem;
 }

 .header-generate-post-close {
   background: url("../icons/bluex.svg") no-repeat center !important;
   color: #eff6ff;
   width: 30px;
   height: 30px;
   background-color: #eff6ff;
   display: flex;
   padding: auto;
   border-radius: 99px;
   transition: all 0.3s ease-in-out;
 }

 body.dark .selected-flag {
   background-color: var(--light-black-color);
   bs-primary-bg-subtle: var(--light-black-color);
 }

 .documnet-badge {
   position: absolute;
   color: #ffffff;
   background-color: #93c5fd;
   padding-inline: 0.4rem;
   margin-bottom: 0;
   bottom: 0;
   right: 0;
   border-radius: 50%;
   border: 1px solid;
   z-index: 50;
 }

 .documnet-delete-badge {
   position: absolute;
   color: #ffffff;
   background-color: #f54f4f;
   padding-inline: 0.4rem;
   margin-bottom: 0;
   bottom: 0;
   left: 0;
   border-radius: 9999px;
   border: 1px solid;
   z-index: 50;
 }

 .documnet-flex-wrap {
   transition: all 0.3s;
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   gap: 15px;
 }

 .full-width-pay-button {
   width: 100%;
   min-height: 4rem;
   padding: 0.75rem;
   display: flex;
   justify-content: center;
   align-items: center;
   border-radius: 0.75rem;
   color: #ffffff;
   background-color: #3b82f6;
   transition: background-color 0.3s;
 }

 .full-width-pay-button:hover {
   background-color: #1d4ed8;
 }

 .full-width-pay-button p {
   margin-bottom: 0 !important;
 }

 /* .MuiButtonBase-root,
.MuiTypography-root {
    font-family: var(--font-hankenGrotesk), sans-serif !important;
} */
 body.dark .phoneinput {
   width: 100% !important;
   border-radius: 5px;
   height: 50px !important;
   min-height: 50px !important;
   background-color: "#242627";
   color: var(--bs-text-color);
   font-size: 16px;
 }

 .btn .btn-outline-secondary {
   font-size: 13px !important;
 }

 .phoneinput {
   font-size: 16px;
   width: 100% !important;
   border-radius: 5px;
   height: 48px !important;
   min-height: 48px !important;
   color: var(--bs-text-color);
 }

 .react-tel-input .form-control {
   height: 48px !important;
   width: 100%;
 }

 .MuiTab-root {
   padding: 5px !important;
   margin: 0 !important;
   color: var(--bs-text-color) !important;
 }

 .MuiAccordionSummary-root {
   min-height: 42px !important;
   color: var(--bs-text-color) !important;
   background-color: var(--bs-body-bg) !important;
   border-bottom: 1px solid var(--bs-primary-bg-subtle) !important;
   padding: 0 8px !important;
 }

 .Mui-expanded {
   min-height: 42px !important;
 }

 .MuiAccordionDetails-root {
   background-color: var(--dark-white-color) !important;
 }

 .arrow_back-docs {
   width: 50px;
   height: 50px;
   top: 30vh;
   left: 5px;
   background-color: #ffffff75;
   position: absolute !important;
   z-index: 999999;
 }

 .arrow_back-docs:hover {
   background-color: var(--bs-primary-bg-subtle);
 }

 .arrow_next-docs {
   width: 50px;
   height: 50px;
   top: 30vh;
   right: 5px;
   background-color: #ffffff75;
   position: absolute !important;
   z-index: 999999;
 }

 .arrow_next-docs:hover {
   background-color: var(--bs-primary-bg-subtle);
 }

 .arrow-docs {
   width: 100%;
   height: 50px;
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   position: absolute;
   top: 25%;
   z-index: 99999;
 }

 .sticky-pop-des {
   position: sticky;
   bottom: 0;
   font-size: small;
   background-color: var(--bs-body-bg);
   margin-left: auto;
   margin-right: auto;
   border-bottom-left-radius: 0.5rem;
   border-bottom-right-radius: 0.5rem;
   width: 100%;
   border-top: 1px solid var(--bs-primary-bg-subtle2);
   border-top-left-radius: 30px;
   border-top-right-radius: 30px;
 }

 .sticky-pop-des b {
   color: var(--bs-text-color2);
 }

 .flex-pop-des {
   border-bottom: 1px solid var(--bs-primary-bg-subtle);
   color: var(--bs-text-color);
   display: flex;
   justify-content: space-between;
   align-items: center;
   width: 100%;
   padding-left: 0.5rem;
   padding-right: 0.5rem;
   padding-bottom: 0.5rem;
 }

 .rounded-button {
   border-radius: 9999px;
   height: 2rem;
   margin-right: 0.5rem;
   background-color: var(--bs-primary);
   padding-left: 0.75rem;
   padding-right: 0.75rem;
   color: #ffffff;
   transition: all 0.3s;
 }

 .rounded-button:hover {
   background-color: var(--s-primary-btn-hover-border-color);
   color: #d1d5db;
 }

 .rounded-icon-button {
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   width: 38px;
   height: 38px;
   background-color: var(--bs-primary);
   color: #ffffff;
   transition: all 0.3s;
 }

 .rounded-icon-button:hover {
   background-color: var(--s-primary-btn-hover-border-color);
   color: #d1d5db;
 }

 .max-height-scroll {
   max-height: 14rem;
   font-size: 0.875rem;
   overflow-y: auto;
   color: var(--bs-text-color);
 }

 .button-pop-hover {
   padding-left: 0.5rem;
   padding-right: 0.5rem;
   background-color: #eff6ff;
   border-radius: 9999px;
   transition: background-color 0.3s ease-in-out;
 }

 .button-pop-hover:hover {
   background-color: #dbeafe;
 }

 .documentsviewr {
   display: flex;
   width: 100%;
   height: auto;
   /* برای محلی‌سازی دراور */
 }

 .documentsviewr #drawer {
   width: 16.66%;
   min-width: 150px;
   /* معادل 1/6 */
   background-color: var(--bs-body-bg);
   box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
   display: flex;
   flex-direction: column;
   align-items: center;
   padding: 0;
 }

 .documentsviewr.hidden {
   display: none;
   /* Drawer مخفی */
 }

 .documentsviewr #main-content {
   width: 83.33%;
   /* معادل 5/6 */
   padding-inline-start: 0.75rem;
 }

 .change-category {
   width: 100%;
   display: flex;
   justify-content: center;
   align-items: center;
   cursor: pointer;
   padding-top: 5px;
 }

 .absolute-pop-button-doc #open-icon {
   display: none;
   /* فقط در حالت کوچکتر از دسکتاپ نشان داده می‌شود */

   background-color: transparent;
   color: var(--bs-primary);
   border: none;
   padding: 1rem;
   cursor: pointer;
   z-index: 999;
 }

 .documentsviewr #close-drawer {
   margin-bottom: 1rem;
   background-color: #ff4d4f;
   color: white;
   border: none;
   padding: 0.5rem;
   cursor: pointer;
   border-radius: 5px;
 }

 /* Media Query برای دستگاه‌های کوچکتر از دسکتاپ */
 @media (max-width: 991px) {
   .documentsviewr #drawer {
     display: none;
     /* Drawer در حالت عادی مخفی */
   }

   .absolute-pop-button-doc #open-icon {
     display: block;
     /* آیکون نمایش Drawer ظاهر می‌شود */
   }
 }

 @media (min-width: 991px) {
   .documentsviewr #close-drawer {
     display: none;
   }
 }

 .comment-container {
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
   width: 100%;
   height: auto;
 }

 .comment-main-container {
   display: flex;
   gap: 0.5rem;
 }

 .comment-user {
   display: flex;
   gap: 0.5rem;
 }

 .comment-avatar {
   position: relative;
   display: flex;
   flex-shrink: 0;
   padding-top: 0.5rem;
   cursor: pointer;
 }

 .comment-avatar.group:hover {
   /* Add group hover effects here if needed */
 }

 .comment-avatar.self-start {
   align-self: flex-start;
 }

 .comment-avatar-img {
   border-radius: 50%;
   width: 2rem;
   height: 2rem;
   object-fit: cover;
 }

 .comment-comment-container {
   display: flex;
   justify-content: space-between;
   background-color: var(--bs-body-bg);
   padding: 0 0.5rem 0.5rem 0.5rem;
   border-radius: 0.75rem;
   border-bottom-right-radius: 0;
   border-bottom-left-radius: 0;
   width: 100%;
   border: 1px solid var(--bs-primary-bg-subtle);
 }

 .comment-actions-container {
   display: flex;
   justify-content: flex-end;
   align-items: center;
   margin-bottom: 0.5rem;
   width: 100%;
   font-size: 0.75rem;
   border: 1px solid var(--bs-primary-bg-subtle);
   border-top: none;
   border-bottom-right-radius: 0.75rem;
   border-bottom-left-radius: 0.75rem;
 }

 .comment-actions-container2 {
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 0.25rem;
   padding: 0 0.5rem;
   font-weight: 600;
 }

 .comment-actions-couner {
   justify-content: center;
   align-items: center;
   background-color: var(--bs-primary-bg-subtle);
   border-radius: 0.5rem;
   padding-inline: 0.25rem;
   font-weight: 500;
   color: var(--bs-text-color2);
   font-size: 0.75rem;
   margin-inline-start: 0.25rem;
 }

 .comment-file {
   margin-top: 0.5rem;
   border-radius: 0.375rem;
   width: 3.5rem;
   min-width: 3.5rem;
   height: 3.5rem;
 }

 .comment-highlight {
   background-color: var(--bs-primary-bg-subtle2);
   /* رنگ مورد نظر */
   transition: background-color 0.5s ease;
   /* انیمیشن نرم */
 }

 .miniprofile-container {
   position: absolute;
   top: -2.5rem;
   z-index: 10;
   border: 1px solid var(--bs-primary-bg-subtle);
   background-color: var(--bs-body-bg);
   box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
   padding: 1rem;
   border-radius: 0.75rem;
   width: 18rem;
   cursor: default;
   inset-inline-start: 1rem;
 }

 .miniprofile-header {
   display: flex;
   gap: 0.75rem;
 }

 .miniprofile-class1 {
   display: flex;
   flex-direction: column;
   gap: 0.5rem;
 }

 .miniprofile-class2 {
   display: flex;
   justify-content: flex-start;
   align-items: center;
   gap: 0.5rem;
 }

 .miniprofile-class3 {
   width: auto;
   font-size: 0.875rem;
   line-height: 1;
 }

 .miniprofile-class4 {
   position: absolute;
   top: -0.5rem;
   right: -0.5rem;
   display: flex;
   justify-content: center;
   align-items: center;
   background-color: #93c5fd;
   border-radius: 9999px;
   width: 1.5rem;
   height: 1.5rem;
   color: #ffffff;
   padding-top: 0.5rem;
   padding-bottom: 0.5rem;
   transition: background-color 0.3s ease-in-out;
 }

 .profile-breadcrumb {
   background-image:
     url(../img/innerpage/home2-banner-bg-dark.png),
     linear-gradient(180deg, #121212 0%, #121212 100%);
 }

 .dark.profile-breadcrumb {
   background-image:
     url(../img/innerpage/breadcrumb-bg1.png),
     linear-gradient(180deg, #121212 0%, #121212 100%);
 }

 .miniprofile-class4:hover {
   background-color: #3b82f6;
 }

 .miniprofile-class5 {
   display: flex;
   gap: 0.25rem;
   margin-top: 0.5rem;
 }

 .miniprofile-class6 {
   display: flex;
   justify-content: center;
   align-items: center;
   background-color: rgba(96, 165, 250, 0.5);
   padding: 0.25rem 0.75rem;
   border-radius: 9999px;
   font-weight: 600;
   color: var(--bs-text-color);
   font-size: 0.75rem;
   transition: background-color 0.3s ease-in-out;
 }

 .miniprofile-class6:hover {
   background-color: rgba(96, 165, 250, 0.6);
 }

 .miniprofile-class7 {
   display: flex;
   justify-content: center;
   align-items: center;
   background-color: #e5e7eb;
   padding: 0.25rem 0.5rem;
   border-radius: 0.5rem;
   font-weight: 600;
   color: var(--bs-text-color);
   font-size: 0.75rem;
   cursor: auto;
 }

 .miniprofile-class8 {
   display: flex;
   justify-content: space-evenly;
   align-items: center;
   margin-right: 0.25rem;
 }

 input {
   color: var(--bs-text-color) !important;
 }

 .otherposts-box {
   max-width: 768px;

   margin-left: auto;
   margin-right: auto;
   display: flex;
   align-items: center;
   justify-content: space-between;
   background-color: var(--dark-white-color);
   border: 1px solid var(--bs-primary-bg-subtle);
   border-radius: 1.75rem;
   margin-block: 0.5rem;
   box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
 }

 .otherpostsdropdown-menu {
   max-height: 350px;
   overflow-y: auto;
   background-color: var(--bs-body-bg);
   border: 1px solid var(--bs-primary-bg-subtle2);
   color: var(--bs-text-color) !important;
 }

 .otherpostsdropdown-menu .dropdown-item {
   color: var(--bs-text-color) !important;
 }

 .otherpostsdropdown-menu .dropdown-item:hover {
   color: var(--bs-text-color) !important;
   background-color: var(--bs-primary-bg-subtle2) !important;
 }

 .otherpostsdropdown-menu-horizontak {
   min-width: 350px;
   width: 350px;
   max-width: 786px;
   max-height: 350px;
   overflow-y: auto;
   background-color: var(--bs-body-bg);
   border: 1px solid var(--bs-primary-bg-subtle2);
   color: var(--bs-text-color) !important;
   padding-inline: 10px;
   text-align: center;
 }

 .otherpostsdropdown-menu-horizontak .dropdown-item {
   color: var(--bs-text-color) !important;
 }

 .otherpostsdropdown-menu-horizontak .dropdown-item:hover {
   color: var(--bs-text-color) !important;
   background-color: var(--bs-primary-bg-subtle2) !important;
 }

 .otherpostsdropdown-menu-horizontak li {
   display: inline-block;
   background-color: var(--bs-primary-bg-subtle2);
   border-radius: 2px;
   margin: 1px;
   width: 25px;
   vertical-align: middle;
   text-align: center;
 }

 .MuiOutlinedInput-root input {
   border: none !important;
   height: 30px !important;
 }

 .human-container {
   display: flex;
   flex-direction: row;
   justify-content: space-evenly;
 }

 @media (max-width: 786px) {
   .human-container {
     display: flex;
     flex-direction: column;
   }
 }

 .report-flex-container {
   display: flex;
   width: 100%;
   padding-top: 0.5rem;
   padding-bottom: 0.5rem;
   height: 3rem;
   padding-left: 1rem;
   padding-right: 1rem;
   justify-content: flex-end;
   align-items: center;
   border-bottom: 1px solid;
 }

 .report-button-rewrite {
   display: inline-flex;
   height: 2rem;
   max-height: 2rem;
   padding-left: 0.5rem;
   padding-right: 0.5rem;
   align-items: center;
   font-size: 0.875rem;
   transition-duration: 300ms;
   border-radius: 9999px;
   min-width: 8rem;
   margin-inline-end: 0.5rem;
   border: 1px solid var(--bs-primary);
   color: var(--bs-text-color);
 }

 .report-button-rewrite :hover {
   border-width: 2px;
   bs-primary-bg-subtle: var(--s-primary-btn-hover-border-color);
   color: var(--bs-primary);
 }

 .report-sticky-footer {
   position: sticky;
   bottom: 0;
   right: 0;
   left: 0;
   background-color: var(--bs-body-bg);
   padding-bottom: 0.25rem;
   padding-top: 0.25rem;
   display: flex;
   height: 3.5rem;
   align-items: flex-start;
   justify-content: flex-end;
 }

 .report-sticky-footer-print {
   border-radius: 9999px;
   min-width: 8rem;
   height: 2.5rem;
   margin-inline-end: 0.5rem;
   border: 1px solid var(--bs-primary);
   padding-left: 0.75rem;
   padding-right: 0.75rem;
   color: var(--bs-text-color);
 }

 .report-sticky-footer-print:hover {
   border-width: 2px;
   bs-primary-bg-subtle: 1px solid var(--s-primary-btn-hover-border-color);
   color: 1px solid var(--bs-primary);
 }

 .report-sticky-footer-submit {
   border-radius: 9999px;
   min-width: 8rem;
   height: 2.5rem;
   margin-inline-end: 0.5rem;
   background-color: var(--bs-primary);
   padding-left: 0.75rem;
   padding-right: 0.75rem;
   color: var(--bs-text-color);
 }

 .report-sticky-footer-submit:hover {
   background-color: var(--bs-primary);
   color: var(--bs-text-color);
 }

 .autosize-textarea {
   width: 100%;
   padding: 0.5rem;
   border: none;
   background-color: transparent;
   color: var(--bs-text-color);
   border-radius: 0.375rem;
   resize: none;
   overflow: hidden;
   min-height: 80px;
 }

 .autosize-textarea {

   overflow-y: scroll;
   scrollbar-width: none;
   /* Firefox */
   -ms-overflow-style: none;
   /* IE 10+ */
 }

 .autosize-textarea:-webkit-scrollbar {
   display: none;
   /* Chrome, Safari */
 }

 .self-center {
   padding-inline: 5px;
 }

 .profile-picture {
   border-radius: 50%;
   padding: 2px;
   border: 3px solid var(--bs-primary-bg-subtle2);
 }

 .profile-picture-experts {
   height: 200px;
   max-height: 200px;
 }

 @media (max-width: 460px) {


   .profile-picture-experts {
     height: 250px !important;
     max-height: 250px !important;
   }
 }

 @media (max-width:640px) {

   .profile-picture-experts {
     height: 300px !important;
     max-height: 300px !important;
   }
 }

 @media (min-width: 1200px) {


   .profile-picture-experts {
     height: 250px !important;
     max-height: 250px !important;
   }
 }

 .tagged-dr-title {
   max-width: 768px;
   display: flex;
   margin-inline: auto;
   font-size: 22px;
   color: var(--bs-text-color);
   display: flex;
   justify-content: space-between;
   border: 2px solid var(--bs-primary-bg-subtle);
   border-radius: 0.75rem;
   padding: 0.75rem;
   background-color: var(--bs-primary-bg-subtle2);
 }

 .confirmbutton {
   font-size: 13px;
   min-width: 60px;
   border-radius: 25px;
   padding-inline: 4px;
   color: #ffffff;
   background-color: var(--bs-primary);
   border: 1px solid var(--s-primary-btn-hover-border-color);
 }

 .confirmbutton:hover {
   background-color: var(--s-primary-btn-hover-border-color);
 }

 .button {
   font-size: 13px;
   min-width: 60px;
   border-radius: 25px;
   padding-inline: 4px;
   background-color: transparent;
   color: var(--bs-primary);
   border: 1px solid var(--s-primary-btn-hover-border-color);
 }

 .confirmbutton:hover {
   border: 1px solid var(--bs-primary);
 }

 @media (max-width: 768px) {
   .tagged-dr-title {
     max-width: 700px;
     display: flex;
     margin-inline: auto;
     font-size: 14px;
     color: var(--bs-text-color);
     display: flex;
     justify-content: space-between;
   }
 }

 .checkout-container {
   margin-bottom: 0.75rem;
   font-weight: bold;
   color: black;
   text-align: center;
   font-size: 1.25rem;
 }

 @media (min-width: 640px) {
   .checkout-container {
     font-size: 1.25rem;
   }


 }

 .checkout-suceess-class {
   display: flex;
   justify-content: center;
   margin-top: 2.5rem;
   width: 100%;
   font-weight: bold;
 }

 .checkout-suceess-p {
   display: flex;
   justify-content: center;
   margin-top: 2.5rem;
   width: 100%;
   font-weight: bold;
   color: #16a34a;
 }

 .checkout-suceess-p2 {
   display: flex;
   justify-content: center;
   margin-top: 2.5rem;
   width: 100%;
   font-weight: bold;
   color: var(--bs-text-color);
 }

 .checkout-error-p {
   display: flex;
   justify-content: center;
   margin-top: 2.5rem;
   width: 100%;
   font-weight: bold;
   color: #dc2626;
 }

 .checkout-back {
   display: flex;
   justify-content: center;
   align-items: center;
   background-color: var(--s-primary-btn-hover-border-color);
   margin-top: 1.25rem;
   margin-bottom: 0.75rem;
   border-radius: 0.5rem;
   width: 100%;
   height: 3rem;
   color: var(--bs-text-color);
   transition:
     background-color 0.3s,
     color 0.3s;
 }

 .checkout-back:hover {
   background-color: var(--bs-primary);
   color: var(--bs-text-color);
 }

 .verify-rewrited-text {
   background-color: var(--bs-body-bg);
   border-top-left-radius: 0.75rem;
   border-top-right-radius: 0.75rem;
   border: 1px solid var(--bs-primary-bg-subtle2);
   color: var(--bs-text-color);
   position: relative;
 }

 .gradienttext-container-1 {
   margin-top: -30px;

   margin-bottom: -20px;
 }

 .gradienttext-container-2 {
   margin-top: -50px;
 }

 /* Iran Yekan Font for Persian Text */
 [lang="fa"],
 [dir="rtl"],
 html[lang="fa"] {
   font-family: "iranyekan", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
 }

 html[lang="fa"] * {
   font-family: "iranyekan", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
 }

 /* Restore FontAwesome and other icon fonts for Persian pages */
 html[lang="fa"] .fa,
 html[lang="fa"] .fa-solid,
 html[lang="fa"] .fas,
 html[lang="fa"] .fa-regular,
 html[lang="fa"] .far,
 html[lang="fa"] .fa-brands,
 html[lang="fa"] .fab,
 html[lang="fa"] .feather,
 html[lang="fa"] .bi,
 html[lang="fa"] [class^="icon-"],
 html[lang="fa"] svg {
   font-family: var(--fa-style-family, "Font Awesome 6 Free") !important;
 }

 html[lang="fa"] .fa-brands,
 html[lang="fa"] .fab {
   font-family: "Font Awesome 6 Brands" !important;
 }

 html[lang="fa"] .feather {
   font-family: feather !important;
 }

 html[lang="fa"] .bi {
   font-family: "bootstrap-icons" !important;
 }

 /* Ensure English text still uses proper fonts */
 [lang="en"],
 [dir="ltr"],
 html[lang="en"] {
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
 }

 /* Profile Dropdown Styling */
 #profileDropdown {
   width: 40px;
   height: 40px;
   padding: 0.375rem;
   border-radius: 50%;
   display: inline-flex !important;
   align-items: center;
   justify-content: center;
   border: 2px solid var(--bs-primary);
   background: transparent;
   transition: all 0.3s ease;
   visibility: visible !important;
   opacity: 1 !important;
 }

 #profileDropdown:hover {
   background-color: var(--bs-primary);
   color: white;
 }

 #profileDropdown .feather {
   width: 18px;
   height: 18px;
   stroke-width: 2;
 }

 #profileDropdown.show {
   background-color: var(--bs-primary);
   color: white;
   border-color: var(--bs-primary);
 }

 /* Dropdown menu styling */
 .dropdown-menu-sm {
   min-width: 220px;
   max-width: 280px;
   border-radius: 0.5rem;
   border: 1px solid var(--bs-border-color);
   box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
   padding: 0.5rem 0;
 }

 .dropdown-menu-sm .dropdown-item {
   padding: 0.75rem 1rem;
   color: var(--bs-body-color);
   font-size: 0.95rem;
   transition: all 0.2s ease;
   border-left: 3px solid transparent;
 }

 .dropdown-menu-sm .dropdown-item:hover {
   background-color: var(--bs-gray-100);
   border-left-color: var(--bs-primary);
   color: var(--bs-primary);
 }

 .dropdown-menu-sm .dropdown-item i {
   width: 18px;
   height: 18px;
   flex-shrink: 0;
 }

 .dropdown-menu-sm .dropdown-item span {
   margin-left: 0.5rem;
   font-weight: 500;
 }

 .dropdown-menu-sm .dropdown-item.text-danger {
   color: var(--bs-danger);
 }

 .dropdown-menu-sm .dropdown-item.text-danger:hover {
   background-color: rgba(220, 53, 69, 0.1);
   border-left-color: var(--bs-danger);
   color: var(--bs-danger);
 }

 .dropdown-divider {
   border-top: 1px solid var(--bs-border-color);
 }

 /* Desktop and large screens (1380px+) */
 @media (min-width: 1380px) {
   #profileDropdown {
     width: 40px;
     height: 40px;
     padding: 0.375rem;
   }

   .dropdown-menu-sm {
     min-width: 220px;
   }

   .dropdown-menu-sm .dropdown-item {
     padding: 0.75rem 1rem;
     font-size: 0.95rem;
   }
 }

 /* Large screens (1200px - 1379px) */
 @media (max-width: 1199px) and (min-width: 1000px) {
   #profileDropdown {
     width: 40px;
     height: 40px;
   }

   .dropdown-menu-sm {
     min-width: 220px;
   }
 }

 /* Responsive adjustments */
 @media (max-width: 992px) {
   .dropdown-menu-sm {
     min-width: 200px;
   }

   #profileDropdown {
     width: 38px;
     height: 38px;
   }
 }

 @media (max-width: 768px) {
   .dropdown-menu-sm {
     min-width: 180px;
   }

   #profileDropdown {
     width: 36px;
     height: 36px;
     padding: 0.25rem;
   }

   .dropdown-menu-sm .dropdown-item {
     padding: 0.625rem 0.875rem;
     font-size: 0.9rem;
   }

   .banner-content-bottom-start {
     margin-top: 50px;
   }

   .gradienttext-container-1 {
     margin-top: -30px;
     margin-bottom: 0;
   }

   .gradienttext-container-2 {
     margin-top: -30px;
   }
 }

 /* Ensure the always-visible auth block centers on small screens */
 .auth-always {
   margin-left: auto;
   display: flex;
   gap: 8px;
   align-items: center;
 }

 @media (max-width: 991px) {
   .main-bar {
     position: relative;
   }

   .auth-always {
     height: 50px;
     position: absolute;
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
     z-index: 2000;
     width: auto;
     justify-content: center;
   }

   .auth-always .dropdown-menu {
     z-index: 9999;
     right: auto;
     left: 50% !important;
     transform: translateX(-50%);
     background-color: var(--bs-secondary) !important;
   }
 }

 @media (min-width: 990px) {
   .auth-always .dropdown-menu {

     margin-left: 100px !important;
   }
 }

 /* Prevent sticky header from clipping dropdowns */
 .sticky-header,
 .main-bar,
 .main-bar-wraper {
   overflow: visible !important;
   z-index: 1100;
 }

 /* Ensure dropdown menus are positioned absolutely and don't affect layout */
 .auth-always .dropdown-menu {
   position: absolute !important;
   top: calc(100% + 6px) !important;
   left: 50% !important;
   transform: translateX(-50%) !important;
   min-width: 260px;
 }

 /* If site header becomes fixed/sticky by JS, ensure it stays above content */
 .site-header.is-sticky,
 .site-header.sticky {
   position: fixed !important;
   top: 0;
   left: 0;
   right: 0;
   z-index: 1200;
 }