:root {
  --bs-primary: #d00143;
  --bs-primary-rgb: 255, 76, 81;
  --bs-primary-text-emphasis: #661e20;
  --bs-primary-bg-subtle: #ffe2e3;
  --bs-primary-border-subtle: #ffb9bb;
}

.btn-primary {
  background-color: #d00143 !important;
  border-color: #d00143 !important;
}

.text-primary {
  color: #d00143 !important;
}

.bg-primary {
  background-color: #d00143 !important;
}

.menu-inner-shadow {
  position: relative;
}

.menu-status-float {
  background-color: var(--bs-body-bg);
}

.truncate-dot {
  max-width: 50px;
  white-space: nowrap;
  overflow: hidden;
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.truncate-dot::after {
  content: ".";
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: white; /* Match your container bg */
  padding-left: 4px;
  display: flex;
  align-items: center;
}

@media (min-width: 576px) {
  /* .custom-width {
    width: 500px;
  } */
}

@media (min-width: 768px) {
  /* .custom-width {
    width: 600px;
  } */
}

@media (min-width: 992px) {
  /* .custom-width {
    width: 500px;
  } */
}

@media (min-width: 1200px) {
  /* .custom-width {
    width: 650px;
  } */
}

@media (min-width: 1300px) {
  .custom-width {
    width: 500px;
  }
}

@media (min-width: 1400px) {
  /* .custom-width {
    width: 650px;
  } */
}
/* // No media query necessary for xs breakpoint as it's effectively `@media (max-width: 0) { ... }` */
/* @include media-breakpoint-down(sm) {
  .custom-width {
    width: 300px;
  }
}

@include media-breakpoint-down(md) {
  .custom-width {
    width: 500px;
  }
}

@include media-breakpoint-down(lg) {
  .custom-width {
    width: 800px;
  }
}

@include media-breakpoint-down(xl) {
  .custom-width {
    width: 800px;
  }
} */

@include media-breakpoint-down(xxl) {
  .custom-width {
    width: 800px;
  }
}