/* Force Arabic Font for RTL */
:lang(ar) * {
  font-family: "29LT Zarid Display", sans-serif !important;
}

.ar * {
  font-family: "29LT Zarid Display", sans-serif !important;
}

/* RTL Specific Adjustments for Home No Org */

/* Welcome Banner */
.welcome-banner h1 {
  font-size: 40px !important;
  line-height: 48px !important;
  text-align: right;
  font-weight: 700;
}

.welcome-banner h1 .highlight {
  font-size: 50px !important;
  line-height: 55px !important;
  font-weight: 700;
}

.welcome-banner p {
  text-align: right;
  font-size: 25px !important;
  font-weight: 400;
  line-height: 29px;
  letter-spacing: -0.15px;
  max-width: 411px;
}

/* Steps Section */
.steps-section {
  /* font-size: 40px !important; */
  /* Adjusted for Arabic sizing */
  text-align: center;

  .heading1 {
    font-size: 40px;
  }

  .heading2 {
    font-size: 55px !important;
  }

  .paragraph {
    font-size: 23px !important;
  }
}

.step-card {
  text-align: right !important;
}

.card-link {
  font-size: 18px !important;
}

.step-card h3 {
  font-size: 30px !important;
  font-weight: 700;
  line-height: 28px;
  letter-spacing: -0.449px;
  margin-bottom: 16px !important;
}

.step-card p {
  font-size: 23px !important;
  line-height: 26px !important;
  color: #4b5563 !important;
  font-weight: 400 !important;
}

/* Icons in Steps should not be flipped if they are directional, but text direction is RTL */
.step-icon {
  margin-left: 0;
  margin-right: 0;
  /* Centered in design or right aligned? Design shows left aligned in LTR, so Right in RTL */
  margin-bottom: 24px;
}

/* No Organization State */
.no-org-content,
.no-org-state .bg-white {
  text-align: center !important;
  /* Centered in both LTR and RTL usually, but check Figma */
}

.no-org-state h3 {
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 28px;
  letter-spacing: -0.49px;
}

.no-org-state p {
  font-size: 16px !important;
  line-height: 24px !important;
  color: #4a5565 !important;
}

/* Buttons */
.btn-custom-primary {
  font-family: "29LT Zarid Display", sans-serif !important;
}

/* step 1 */
#active-step .font-mackay {
  color: #00041c !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.step-item:not(#active-step) .font-mackay {
  color: #99a1af !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.eligibility-banner strong {
  color: #00041c !important;
  text-align: right !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 25px !important;
  letter-spacing: -0.312px !important;
}

.eligibility-banner p {
  color: #00041c !important;
  text-align: right !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 25px !important;
  letter-spacing: -0.312px !important;
}

#create-project-step-1-form h2 {
  color: #101828 !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 30px !important;
  letter-spacing: -0.449px !important;
}

#create-project-step-1-form .form-label {
  color: #364153 !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 14px !important;
  letter-spacing: -0.15px !important;
}

#create-project-step-1-form .btn-add-org-custom {
  color: #3bc4bd !important;
  text-align: center !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  width: 239px;
}

#create-project-step-1-form input,
#create-project-step-1-form select,
#create-project-step-1-form textarea {
  color: #717182 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

#create-project-step-1-form .form-text {
  font-size: 17px !important;
  font-weight: 400 !important;
  letter-spacing: -0.15px !important;
}

#create-project-step-1-form button[type="submit"] {
  width: 274px !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  height: 36px !important;
  padding: 8px 0px !important;
}

.position-relative.z-1 h3.font-mackay {
  font-size: 25px !important;
  font-weight: 700 !important;
  line-height: 27px !important;
  letter-spacing: -0.439px !important;
}

.position-relative.z-1>p.font-graphik {
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 21px !important;
  letter-spacing: -0.15px !important;
}

.position-relative.z-1>.font-graphik p {
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 21px !important;
  letter-spacing: -0.15px !important;
}

/* step 2 */
.bi::before,
[class*=" bi-"]::before,
[class^="bi-"]::before {
  vertical-align: middle !important;
}

.col-lg-8>h2.font-mackay {
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 36px !important;
  letter-spacing: 0.07px !important;
}

.col-lg-8>p.font-graphik {
  font-size: 25px !important;
  font-weight: 400 !important;
  line-height: 24px !important;
  letter-spacing: -0.312px !important;
}

#create-project-step-2-form h3.font-graphik {
  font-size: 25px !important;
  font-weight: 700 !important;
  line-height: 30px !important;
  letter-spacing: -0.449px !important;
}

.form-check .form-check-input {
  float: right !important;
  margin-left: 1rem !important;
}

#create-project-step-2-form p.font-graphik.text-secondary {
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

#create-project-step-2-form .form-check-label {
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 14px !important;
  letter-spacing: -0.15px !important;
  color: #364153 !important;
}

#create-project-step-2-form .form-label {
  color: #364153 !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 14px !important;
  letter-spacing: -0.15px !important;
}

#create-project-step-2-form input[type="number"] {
  color: #717182 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  letter-spacing: -0.15px !important;
}

#create-project-step-2-form small.text-cp-aqua-marine {
  color: #3bc4bd !important;
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

#create-project-step-2-form select.form-select {
  color: #717182 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

#create-project-step-2-form #sdg-count {
  color: #009689 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 16px !important;
  direction: ltr !important;
}

#create-project-step-2-form .sdg-card span.font-graphik {
  color: #101828 !important;
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 15px !important;
}

#create-project-step-2-form .btn.btn-white {
  color: #00041c !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  width: 124px !important;
}

#create-project-step-2-form button[type="submit"] {
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  width: 120px !important;
}

/* step 3 */
#step_3_form .form-label {
  color: #101828 !important;
  font-size: 25px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: -0.312px !important;
}

#step_3_form .form-label.small {
  color: #101828 !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 14px !important;
  letter-spacing: -0.15px !important;
}


#step_3_form p.font-graphik {
  color: #4a5565 !important;
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

#step_3_form h6.font-graphik {
  color: #4a5565 !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

#step_3_form p.font-graphik.text-secondary.x-small.mb-0 {
  color: #b7b7b7 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

#step_3_form input[type="url"] {
  color: #717182 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  letter-spacing: -0.15px !important;
}

#step_3_form .btn.btn-white {
  color: #00041c !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  width: 124px !important;
}

#step_3_form button[type="submit"] {
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  width: 120px !important;
}

/* step 4 */
.mb-4>label.form-label {
  font-size: 18px !important;
}

.project-step-card h2.font-graphik {
  color: #00041c !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 32px !important;
  letter-spacing: 0.07px !important;
}

.project-step-card p.font-graphik {
  color: #4a5565 !important;
  font-size: 25px !important;
  font-weight: 400 !important;
  line-height: 24px !important;
  letter-spacing: -0.312px !important;
}

.location-search-btn {
  color: #fff !important;
  font-size: 21px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  left: 5px !important;
  right: auto !important;
}

.location-search-wrapper .bi-search {
  left: auto !important;
  right: 16px !important;
  border: none !important;
  margin-right: 10px !important;
}

.location-search-input {
  padding-right: 60px !important;
  padding-left: 140px !important;
}

#step_4_form .btn.btn-white {
  color: #00041c !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  width: 124px !important;
}

#step_4_form button[type="submit"] {
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  width: 120px !important;
}

/* step 5 */

.bg-white.rounded-4.p-4.shadow-sm h3.font-graphik {
  color: #00041c !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
}

.bg-white.rounded-4.p-4.shadow-sm label.form-label {
  color: #00041c !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 21px !important;
}

.bg-white.rounded-4.p-4.shadow-sm .range-value-text,
.bg-white.rounded-4.p-4.shadow-sm .range-value-symbol {
  color: #374151 !important;
  font-size: 24px !important;
  font-weight: 700 !important;
}

.range-display span {
  font-size: 24px;
  line-height: 1;
}

.bg-white.rounded-4.p-4.shadow-sm>.p-3.rounded-3 p {
  color: #00041c !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 23px !important;
}

.form-check .form-check-label {
  font-size: 18px !important;
}

.d-flex.justify-content-between.pt-4.border-top .btn-white {
  color: #00041c !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  width: 124px !important;
}

.d-flex.justify-content-between.pt-4.border-top .btn-custom-aqua {
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  width: 120px !important;
}

/* step 6 */

.bg-white.rounded-4.p-5.shadow-sm h2.font-mackay {
  color: #101828 !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 36px !important;
  letter-spacing: 0.07px !important;
  text-align: right !important;
}

#disclaimer-container .me-3.mt-1 {
  margin-top: 0px !important;
  margin-right: 0px !important;
  margin-left: 1rem !important;
}

.mt-1 {
  margin-top: 1.5px !important;
}

.text-start {
  text-align: right !important;
}

#disclaimer-container label.form-check-label {
  color: #364153 !important;
  text-align: right !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 26px !important;
  letter-spacing: -0.312px !important;
  width: 100% !important;
}

#disclaimer-container p.text-secondary {
  text-align: right !important;
  color: #6a7282 !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 16px;
}

.d-flex.justify-content-center.gap-3 .btn-white {
  color: #00041c !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  width: 124px !important;
}

.d-flex.justify-content-center.gap-3 .btn-custom-aqua {
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  width: 120px !important;
}

.d-flex.justify-content-center.gap-3 {
  gap: 3rem !important;
}

/* organization */

.col-lg-8 h1.font-mackay {
  color: #101828 !important;
  font-size: 34px !important;
  font-weight: 700 !important;
  line-height: 36px !important;
  letter-spacing: 0.07px !important;
}

.col-lg-8 a.btn-custom-primary {
  background-color: #3bc4bd !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.d-flex.justify-content-between.align-items-center.mb-4 h2.font-graphik {
  color: #101828 !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 30px !important;
}

.input-group {
  display: flex;
  flex-wrap: nowrap !important;
  align-items: center;
}

.input-group .form-control:focus {
  border: 1px solid rgb(208, 213, 221) !important;
  border-left: none !important;
}

/* RTL Search Input Adjustments */
.input-group input.form-control {
  border: 1px solid #d0d5dd !important;
  border-left: 0 !important;
  /* Open to button on Left */
  border-right: 1px solid #d0d5dd !important;
  /* Closed on Right */
  border-radius: 0 50px 50px 0 !important;
  /* Right side rounded */
  padding: 10px 16px;
  text-align: right;
  color: #717182 !important;
  font-size: 20px !important;
  font-weight: 400 !important;
}

.input-group .input-group-text {
  border: 1px solid #d0d5dd !important;
  border-right: 0 !important;
  /* Open to input on Right */
  border-left: 1px solid #d0d5dd !important;
  /* Closed on Left */
  border-radius: 50px 0 0 50px !important;
  /* Left side rounded */
  background: #fff;
  padding: 10px 16px;
  white-space: nowrap;
}

.input-group .input-group-text {
  border: 1px solid #d0d5dd !important;
  border-right: 0 !important;
  border-radius: 999px 0 0 999px !important;
  background: #fff;
  padding: 10px 16px;
  white-space: nowrap;
  border-left: 1px solid #d1d5db !important;
}

.input-group>* {
  margin: 0 !important;
}

.fw-bold.small {
  color: #364153 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
}

.custom-dashboard-table .font-graphik {
  color: #364153 !important;
  font-family: "Graphik Arabic" !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 24px;
}

.custom-dashboard-table tbody td.text-secondary {
  color: #364153 !important;
  font-family: "Graphik Arabic" !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 24px;
}

/* Create organization */

.col-12 h1.fw-bold.text-cp-deep-ocean {
  color: #101828 !important;
  font-size: 34px !important;
  font-weight: 700 !important;
  line-height: 36px !important;
  letter-spacing: 0.07px !important;
}

.row.g-4 .form-label {
  color: #374151 !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 14px !important;
  letter-spacing: -0.15px !important;
}

.row.g-4 input[type="url"].form-control {
  color: #717182 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  min-height: 45px !important;
}

.row.g-4 input[type="number"].form-control {
  color: #717182 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.row.g-4 input[type="text"].form-control {
  color: #717182 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  margin: 0.5rem !important;
}

.row.g-4 select.form-select {
  color: #bebebe !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.row.g-4 .form-text {
  color: #6b7280 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 16px !important;
}

.row.g-4 .form-check-label {
  color: #374151 !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.bg-white.rounded-lg.p-5.shadow-sm.mb-4 h2.font-graphik {
  color: #111827 !important;
  font-size: 30px !important;
  font-weight: 700 !important;
  line-height: 30px !important;
  letter-spacing: -0.449px !important;
}

.bg-white.rounded-lg.p-5.shadow-sm.mb-4 h2 span.text-secondary {
  color: #6b7280 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.bg-white.rounded-lg.p-5.shadow-sm.mb-4 .form-label.font-graphik {
  color: #374151 !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.bg-white.rounded-lg.p-5.shadow-sm.mb-4 select.form-select {
  color: #717182 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.mt-5>h2.font-graphik {
  color: #111827 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.mt-5>p.font-graphik {
  color: #6b7280 !important;
  font-size: 17px !important;
  font-weight: 400 !important;
  line-height: 16px !important;
  letter-spacing: -0.15px !important;
}

.mt-5 .mb-4>label.form-label {
  color: #374151 !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 14px !important;
  letter-spacing: -0.15px !important;
}

.mt-5 .form-check .form-check-label.font-graphik {
  color: #374151 !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.mt-5 #csr-fields select.form-select#csr_focus_area {
  color: #717182 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.mb-5>.organization-submit {
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
  width: 176.008px !important;
  height: 36px !important;
  padding: 8px 0px !important;
}

.guidance-content p.font-graphik {
  color: #00041c !important;
  text-align: right !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 26px !important;
  letter-spacing: -0.15px !important;
}

.guidance-panel {
  position: relative;
  direction: rtl;
}

.guidance-icon-container {
  position: absolute;
  width: 35px;
  height: 35px;
  background-color: #fc9c63;
  top: 20px;
  right: 20px;
  left: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}

.guidance-content {
  padding-right: 60px;
  padding-left: 0;
  text-align: right;
}

.thankyou-wrapper h2 {
  color: #101828 !important;
  font-size: 38px !important;
  font-weight: 700 !important;
  line-height: 32px !important;
  letter-spacing: 0.07px !important;
}

.thankyou-wrapper .d-flex.justify-content-center {
  color: #00041c !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.no-org-state h3 {
  color: #101828 !important;
  font-size: 34px !important;
  font-weight: 700 !important;
  line-height: 32px !important;
  letter-spacing: -0.449px !important;
}

.no-org-state p {
  color: #4a5565 !important;
  font-size: 25px !important;
  font-weight: 400 !important;
  line-height: 29px !important;
  letter-spacing: -0.312px !important;
  width: 420px !important;
}

.no-org-state .btn {
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: -0.312px !important;
  width: 215px !important;
  height: 48px !important;
}

.modal-content h2.font-mackay {
  color: #101828 !important;
  font-size: 38px !important;
  font-weight: 700 !important;
  line-height: 32px !important;
  letter-spacing: 0.07px !important;
}

.modal-content p.font-graphik.text-secondary {
  color: #364153 !important;
  font-size: 21px !important;
  font-weight: 400 !important;
  line-height: 24px !important;
  letter-spacing: -0.312px !important;
}

.modal-content .btn {
  color: #00041c !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.py-5 h3.font-mackay {
  color: #101828 !important;
  font-size: 34px !important;
  font-weight: 700 !important;
  line-height: 32px !important;
  letter-spacing: -0.449px !important;
}

.py-5 p.text-secondary {
  color: #4a5565 !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 29px !important;
  letter-spacing: -0.312px !important;
}

.py-5 a.btn,
.btn-download-outline {
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
  letter-spacing: -0.312px !important;
}

.modal-body h2 {
  color: #101828 !important;
  font-size: 38px !important;
  font-weight: 700 !important;
  line-height: 32px !important;
  letter-spacing: 0.07px !important;
}

.modal-body .text-secondary p {
  color: #364153 !important;
  font-size: 21px !important;
  font-weight: 400 !important;
  line-height: 24px !important;
  letter-spacing: -0.312px !important;
}

.modal-body .d-flex.justify-content-center {
  color: #00041c !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 20px !important;
  letter-spacing: -0.15px !important;
}

.dashboard-nav .nav-link {
  color: #00041c !important;
  font-family: "29LT Zarid Display" !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 24px !important;
  letter-spacing: -0.312px !important;
}

.dashboard-user-area .user-name {
  color: #364153 !important;
  font-family: "Graphik Arabic" !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 24px !important;
}

.bi::before,
[class*=" bi-"]::before,
[class^="bi-"]::before {
  color: #009689 !important;
}

.rounded-circle {
  margin-right: 0px !important;
  margin-left: 10px !important;
}

.form-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: none;
}

.form-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cg opacity='0.5'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%23717182' stroke-width='1.33333' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: left 1rem center;
  /* RTL */
  background-size: 20px;
  padding-left: 2.5rem;
}

.bi-exclamation-circle {
  margin-left: 10px !important;
  margin-right: 0px !important;
}

.file-icon-wrapper {
  margin-right: 0px !important;
  margin-left: 16px !important;
  margin-top: -4px !important;
}

.d-flex.justify-content-center.gap-3 {
  direction: ltr !important;
}

.details-label {
  font-size: 20px !important;
}

.details-row .details-value {
  font-size: 18px !important;
  margin-right: 10rem !important;
}

.border-bottom span.text-secondary {
  font-size: 18px !important;
}

.details-section-card .text-warning-emphasis {
  font-size: 20px !important;
}

.stat-box .font-mackay {
  font-size: 20px !important;
}

.stat-label {
  font-size: 16px !important;
}

.d-flex .font-graphik {
  font-size: 20px !important;
}

.border-bottom h2 {
  font-size: 25px !important;
}

.mb-4 .text-secondary {
  font-size: 20px !important;
}

.mb-4 .fw-medium {
  font-size: 18px !important;
}

.col-md-6 .d-block.text-secondary {
  font-size: 20px !important;
}

.col-md-6 .font-graphik {
  font-size: 18px !important;
}

.d-flex.align-items-center {
  margin-right: 0px !important;
}

.font-20 {
  font-size: 20px !important;
}

.status-draft,
.status-review {
  font-size: 18px !important;
}

@media (max-width: 768px) {

  .table-responsive {
    overflow-x: auto;
  }

  table {
    width: 100%;
    table-layout: auto;
  }

  .table td,
  .table th {
    white-space: nowrap;
  }

  .status-badge {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    white-space: nowrap;
    border-radius: 999px;
    font-size: 13px;
    white-space: nowrap;
  }
}


.dashboard-header .d-flex.align-items-center.me-3 {
  margin-inline-end: 16px !important;

}

@media (max-width: 991px) {
  .dashboard-header .d-flex.align-items-center.me-3 {
    margin-inline-end: 12px !important;
  }
}

html[dir="rtl"] .dashboard-header .d-flex.align-items-center.me-3 {
  margin-left: 16px !important;
  margin-right: 0 !important;
}