.rs-form-group {
  margin-bottom: 20px !important;
}

.rs-form-group span,
.rs-form-group p {
  font-size: 14px !important;
}

.rs-form-group select,
.rs-form-group input {
  font-size: 14px !important;
  border-radius: 6px !important;
}

.rs-form-group textarea {
  font-size: 14px !important;
  border-radius: 6px !important;
}
.rs-form-group input[type="number"] {
  padding: 0.5rem 0rem !important;
  font-size: 14px !important;
  border-radius: 6px !important;
}

.official-invoice {
  display: flex;
  gap: 8px;
  font-size: 14px;
}
.official-invoice input[type="checkbox"] {
  float: right !important;
  position: relative !important; /* Required for positioning pseudo-element */
}

.official-invoice input[type="checkbox"]::after {
  content: "" !important;
  width: 0px !important;
  height: 0px !important;
  display: none !important;
}

.popup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 999;
}
.popup-inner {
  background-color: #fff;
  padding: 8px;
  border-radius: 6px;
  display: flex;
  height: 566px;
  width: 350px;
  flex-direction: column;
  position: relative;
}

.step {
  border-radius: 6px;
  padding: 5px;
  width: 55px;
  text-align: center;
  display: flex;
  flex-direction: column;
  height: 70px;
}

.step-number {
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
}
.step-name {
  font-size: 8px;
  font-weight: 500;
  line-height: 20px;
}
.step-active {
  background-color: #50adc971;
}

.cards {
  display: flex !important;
  margin: 10px !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  height: 310px;
}

@media (min-width: 600px) {
  .cards {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 900px) {
  .cards {
    grid-template-columns: repeat(3, 1fr);
  }
}

.cards label {
  cursor: pointer !important;
}
.cards label input {
  display: none !important;
}
.cards label .text {
  color: #0f6da7;
  display: flex;
  margin: 6px;
  border: 1px solid #f2f2f2;
  background: #f8f8f8;
  padding: 6px;
  font-size: 14px;
  align-items: center;
  border-radius: 6px;
  justify-content: center;
  line-height: 1.5rem;
  width: 220px;
}
.cards label.isActive {
  font-size: 30px;
}
.cards label:hover .text {
  border-color: #275fd8;
  box-shadow: 0 0 8px #ccc;
}
.cards label input:checked + .text {
  color: green;
  border-color: green;
}

.register-stepper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.register {
  display: flex;
  padding: 8px;
  flex-direction: column;
  height: 480px;
  justify-content: space-between;
}

.cta-step {
  display: flex;
  justify-content: space-between;
}

.error-message {
  color: red;
  font-size: 14px;
  margin-top: 5px;
}

.service-request-form {
  height: 525px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 6px;
  margin-top: 16px;
}

.service-type {
  height: 390px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.service-request-form span {
  font-size: 16px;
}

.service-request-form p {
  font-size: 14px !important;
}

.rs-close-icon {
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
  padding: 8px;
  align-items: center;
  justify-content: space-between;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: fit-content;
}

.rs-step-control {
  border-radius: 4px; /* Rounded corners */
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Subtle box shadow */
  padding: 10px 15px; /* Inner padding */
  display: flex; /* Allow for horizontal layout (optional) */
  align-items: center; /* Align content vertically */
  justify-content: space-between; /* Space content horizontally (optional) */

  /* Positioning */
  position: absolute; /* Absolute positioning to stick to bottom */
  bottom: 0; /* Position at the bottom */
  left: 0; /* Align to the left edge of its parent */
  right: 0; /* Stretch to the right edge (if desired) */

  /* Adjust width (optional) */
  width: 100%; /* Match the parent's width (optional) */
}

.cta {
  border-radius: 5px;
  /* background-color: #4caf50; */
  color: white;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

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

.link_text {
  border: none !important;
  background: none;
  font-size: 14px !important;
  cursor: pointer !important;
  transition: color 0.3s ease !important;
  width: 140px !important;
  color: #0c0d0e !important;
  background-color: #5bc0de !important;
  display: flex !important;
  justify-content: center;
  align-items: center;
  padding: 8px !important;
}

.link_text:focus,
.link_text:hover {
  background-color: #2196f3 !important; /* Blue */
}

.link_text:focus-visible {
  outline: none;
}

.productProblem_attachment__2IG9n {
  /* Common styles */
  background-color: #e8e8e8; /* Light gray background */
  border-radius: 4px; /* Rounded corners */
  padding: 10px 15px; /* Inner padding */
  display: inline-flex; /* Inline for horizontal alignment */
  align-items: center; /* Align content vertically */
  cursor: pointer; /* Pointer cursor for clickable behavior */
  transition: background-color 0.2s ease-in-out; /* Smooth transition on hover */
  user-select: none; /* Prevent accidental text selection */

  /* Hover state for visual feedback */
  &:hover {
    background-color: #d7d7d7; /* Slightly darker on hover */
  }
}

.productProblem_attachment__2IG9n i {
  /* Icon styles */
  color: #333; /* Dark gray icon color */
  font-size: 18px; /* Adjust as needed */
  margin-right: 10px; /* Spacing between icon and text */
}

.productProblem_attachment__2IG9n span {
  /* Text styles */
  color: #333; /* Dark gray text color */
  font-weight: 500; /* Slightly bold to emphasize */
}

.productProblem_attachment__2IG9n input[type="file"] {
  /* Style the hidden input */
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  cursor: pointer; /* Maintain click behavior even when hidden */
}

.file-error {
  color: red;
  font-size: 0.8rem; /* Adjust as needed */
  margin-top: 5px;
}

.r-s-popup-title {
  text-align: center;
  font-weight: bold;
  padding-right: 16px;
}

.r-s-popup-header {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
}

.check-contract-number,
.check-serial-number {
  display: flex;
}
.check-contract-number input,
.check-serial-number input {
  border-top-left-radius: 0px !important;
  border-bottom-left-radius: 0px !important;
  font-size: 14px !important;
}
.check-contract-number button,
.check-serial-number button {
  border-top-right-radius: 0px !important;
  border-bottom-right-radius: 0px !important;
  font-size: 14px !important;
  color: white !important;
  background-color: #73b767 !important;
}

.company-form-group {
  display: flex;
  margin: 6px 0px;
  gap: 4px;
}

.company-form-group div {
  width: -webkit-fill-available;
}

.rs-company-error-message {
  font-size: 12px !important;
  padding: 0px;
  margin: 0px;
  color: red;
  text-align: center;
}
.rs-company-success-message {
  font-size: 12px !important;
  padding: 0px;
  margin: 0px;
  color: rgb(86, 143, 20);
  text-align: center;
}

.add-new-company {
  padding: 8px 16px;
  width: -webkit-fill-available;
  border: 1px solid #ccc;
  border-radius: 6px;
  display: flex;
  cursor: pointer;
  justify-content: center;
}

.add-new-company:hover {
  border: 1px solid #52c04e;
}

.loader {
  width: 15px;
  height: 15px;
  border: 2px solid #1e95df;
  border-bottom-color: transparent;
  border-radius: 50%;
  display: inline-block;
  animation: rotation 1s linear infinite;
  margin: 4px;
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.service-request-btn {
  border: none;
  border-radius: 6px !important;
  padding: 8px 16px !important;
  text-align: center !important;
  font-size: 14px !important;
  background: #187081 !important;
}

.service-request-btn:hover {
  background: #183981 !important;
}

.congrats {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
}

.congrats img {
  width: fit-content;
}

.crm-check-btn {
  border: none;
  border-radius: 6px !important;
  padding: 6px 8px !important;
  text-align: center !important;
  font-size: 14px !important;
  background: #73b767 !important;
}

.mihanpanelpanel form input[type="radio"] {
  width: 30px !important;
  height: 20px !important;
  border-radius: 100px !important;
  position: inherit !important;
  padding: 5px !important;
  display: inline-block !important;
  background: #e0e0e0 !important;
  border: none !important;
}

.user-companies {
  border: 1px solid #ccc !important;
  padding: 6px !important;
  border-radius: 6px !important;
  align-items: center !important;
  display: flex !important;
  margin: 6px;
  font-size: 14px;
}

.rs-close-icon {
  display: block;
  cursor: pointer;
  font-size: 24px;
  border: none;
  z-index: 999;
}

.companyList {
  display: flex;
  padding: 8px;
  flex-direction: column;
  overflow-x: auto;
  height: 230px;
  margin: 8px;
}

/* Custom scrollbar */
.companyList::-webkit-scrollbar {
  height: 10px;
  width: 7px;
}

/* Track */
.companyList::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 6px;
}

/* Handle */
.companyList::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 6px;
}

/* Handle on hover */
.companyList::-webkit-scrollbar-thumb:hover {
  background: #555;
}