@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap');/* ========================================
   Sidebar Navigation — Telelinks Design
   ======================================== */

.rpm-sidenav {
  height: 100vh;
  background-color: #0e0c31;
  color: #ffffff;
  display: flex;
  flex-direction: column;
  box-shadow: 2px 0 12px rgba(0, 0, 0, 0.15);
  transition: width 0.3s ease, min-width 0.3s ease;
  overflow-x: hidden;
  overflow-y: auto;
  position: relative;
  z-index: 100;
  flex-shrink: 0;
  scrollbar-width: thin;
  scrollbar-color: #132237 white;
  border-top-right-radius: 20px;
}

.rpm-sidenav::-webkit-scrollbar {
  width: 4px;
}

.rpm-sidenav::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
}

/* Expanded state — full labels visible */
.sidenav-expanded {
  width: 240px;
  min-width: 240px;
}

/* Compressed state — icons only */
.sidenav-compressed {
  width: 64px;
  min-width: 64px;
}

/* ---- Brand Header ---- */
.rpm-sidenav .sidenav-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 12px 0px 16px;
  /* border-bottom: 1px solid rgba(255, 255, 255, 0.07); */
  min-height: 100px;
}

.sidenav-compressed .sidenav-header {
  justify-content: center;
  padding: 16px 0;
}

.rpm-heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  overflow: hidden;
  flex: 1;
  margin-top: 20px;
}

.sidenav-compressed .rpm-heading {
  display: none;
}

.sidenav-expanded .rpm-heading img {
  width: 150px;
  object-fit: contain;
}

.rpm-heading-subtitle {
  font-size: 13px;
  letter-spacing: 1px;
  margin-left: 20px;
  /* opacity: 0.6; */
  text-transform: uppercase;
  margin-top: 5px;
  white-space: nowrap;
}

/* ---- Toggle Button ---- */
.rpm-sidenav .toggle-btn {
  background: none;
  border: none;
  color: rgba(255, 255, 255, 0.7);
  /* padding: 6px; */
  cursor: pointer;
  display: flex;
  margin-top: -50px;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  transition: background-color 0.2s ease, color 0.2s ease;
  flex-shrink: 0;
}

.rpm-sidenav .toggle-btn:hover {
  background-color: rgba(255, 255, 255, 0.1);
  color: #ffffff;
}

.sidenav-compressed .toggle-btn {
  margin: 0 auto;
}

/* ---- Nav List ---- */
.rpm-nav-list {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 12px 0 40px 0;
  flex: 1;
}

/* ---- Menu Items ---- */
.app-menu-button {
  height: 50px;
  display: flex;
  align-items: center;
  padding: 0 16px;
  color: rgba(255, 255, 255, 0.75);
  text-decoration: none;
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.2px;
  cursor: pointer;
  transition: all 0.2s ease;
  border-left: 3px solid transparent;
  white-space: nowrap;
  gap: 0;
}

.sidenav-compressed .app-menu-button {
  padding: 0;
  justify-content: center;
}

.app-menu-button:hover {
  background-color: rgba(255, 255, 255, 0.07);
  color: #ffffff;
}

/* Active State */
.app-menu-button.active {
  background-color: #fff;
  color: #0e0c31;
  /* border-left-color: #ffbc34; */
  font-weight: 600;
  border-top-left-radius: 20px;
  border-bottom-left-radius: 20px;
}

.sidenav-compressed .app-menu-button.active {
  border-left-color: #0e0c31;
  border-radius: 0;
}

.app-menu-button.active .app-nav-list-icon {
  color: #0e0c31 !important;
}

/* ---- Icons ---- */
.app-nav-list-icon {
  font-size: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
}

.sidenav-expanded .app-nav-list-icon {
  margin-right: 10px;
}

.sidenav-compressed .app-nav-list-icon {
  margin: 0;
  width: 70px;
  height: 70px;
}

/* ---- Nav Labels ---- */
.rpm-list-item-text {
  flex-grow: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 14px;
}

.sidenav-compressed .rpm-list-item-text {
  display: none;
}

/* ---- Expandable sub-menu header ---- */
.expandable-header {
  justify-content: space-between;
}

.expandable-header .submenu-arrow {
  font-size: 18px;
  opacity: 0.6;
  margin-left: auto;
  flex-shrink: 0;
}

.sidenav-compressed .expandable-header .submenu-arrow {
  display: none;
}

/* Submenu container */
.submenu-list {
  display: flex;
  flex-direction: column;
  background-color: rgba(0, 0, 0, 0.2);
}

.submenu-list .app-menu-button.sub-item {
  padding-left: 52px;
  height: 40px;
  font-size: 12px;
  border-left: none;
  border-left: 3px solid transparent;
}

.sidenav-compressed .submenu-list .app-menu-button.sub-item {
  padding: 0;
  justify-content: center;
}

.submenu-list .app-menu-button.sub-item.active {
  background-color: #fff;
  color: #0e0c31;
  /* border-left-color: #ffbc34; */

}/* ========================================
   Top Navigation Bar — Telelinks Design
   ======================================== */

.rpm-navigation-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 56px;
  background-color: rgb(245, 246, 250);
  /* border-bottom: 1px solid #e8ecf0; */
  padding:20px;
  position: sticky;
  top: 0;
  z-index: 99;
  /* box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06); */
}

/* ---- Left section (hamburger + title + actions) ---- */
.nav-bar-left {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 1;
}

/* Hamburger toggle in topbar */
.rpm-topbar-toggle {
  background: none;
  border: none;
  color: #475569;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px;
  border-radius: 6px;
  transition: background-color 0.2s ease;
  flex-shrink: 0;
}

.rpm-topbar-toggle:hover {
  background-color: #f1f5f9;
  color: #0e0c31;
}

.rpm-navigate-back {
  background: none;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: opacity 0.2s ease;
}

.rpm-navigate-back:hover {
  opacity: 0.8;
}

/* Title + actions bar */
.title-and-actions {
  display: flex;
  align-items: center;
  gap: 110px;
  border-left: 3px solid #00a2e8;
  padding-left: 16px;
  min-height: 30px;
}

#topbar-actions-target {
  display: flex;
  align-items: center;
  gap: 12px;
}

.rpm-page-title {
  font-family: 'Open Sans', sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #0e0c31;
  line-height: 1;
  white-space: nowrap;
}

/* ---- Right section (profile) ---- */
.nav-bar-right {
  display: flex;
  align-items: center;
  gap: 16px;
}

.profile-img-container {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border: 2px solid #ffbc34;
  border-radius: 50%;

  transition: transform 0.2s ease;
}

.profile-img-container img {
  width: 38px;
  height: 38px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.profile-img-container:hover {
  transform: scale(1.05);
}
.call-action-btn {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}
/* ---------- RESET & BASE ---------- */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: "Helvetica", Arial, sans-serif;
  overflow-x: hidden;
}

.landing-page {
  width: 100%;
  overflow-x: hidden;
}

/* ---------- FEATURE SECTION ---------- */
.feature-section {
  width: 100%;
  background: #e6f5ff;
  padding-bottom: 60px;
}

.left-section {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  background: linear-gradient(120.25deg, #0579bf 29.57%, #46acea 106.13%);
  border-radius: 0 0 172px 0;
  padding: 80px 40px 60px 80px;
  position: relative;
}

.feature-title {
  font-weight: bold;
  font-size: 50px;
  color: #fff;
  /* max-width: 600px; */
}

.feature-content {
  font-size: 16px;
  color: #fff;
  margin: 25px 0 30px;
  /* max-width: 500px; */
}

.feature-first-img-circle {
  margin-top: -180px;
  text-align: right;
}

.feature-img {
  width: 280px;
  height: 280px;
  border-radius: 50%;
  /* border: 8px solid #f4ce59; */
  object-fit: cover;
}

.start-btn {
  display: inline-block;
  background: #f4ce59;
  padding: 12px 30px;
  margin-top: 20px;
  /* border-radius: 40px; */
}

.start-btn a {
  text-decoration: none;
  font-weight: bold;
  color: #2a4c61;
}

/* Feature cards – using flex/grid instead of absolute */
.feature-section .left-section {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: 30px;
}

.feature-section .left-section > *:first-child {
  flex: 1 1 100%;
}

.feature-first-card,
.feature-second-card,
.feature-third-card,
.feature-fourth-card {
  flex: 1 1 240px;
  background: #fff;
  border-radius: 27px;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  padding: 20px;
  transition: transform 0.2s;
  position: static;
}

.feature-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
}

.card-title {
  font-weight: bold;
  font-size: 18px;
  color: #5c5c5c;
  margin: 0;
}

.card-small-img {
  width: 50px;
  height: 50px;
}

.card-content {
  font-size: 14px;
  color: #5c5c5c;
  line-height: 1.4;
}

/* ---------- REVENUE SECTION ---------- */
.revenue-section {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 40px;
  padding: 80px 40px;
  background: #fff;
}

.revenue-text {
  font-weight: bold;
  font-size: 28px;
  color: #5c5c5c;
  max-width: 400px;
}

.revenue-line {
  display: none;
}

.revenue-no {
  min-width: 260px;
}

.revenue-row {
  padding: 15px 10px;
  cursor: pointer;
  border-radius: 100px;
  transition: all 0.2s;
}

.revenue-row.default {
  background: #3aa3e2;
}

.revenue-row.default .price,
.revenue-row.default .price-details {
  color: white;
}

.price {
  font-weight: bold;
  font-size: 24px;
  color: #5c5c5c;
}

.price-details {
  font-size: 14px;
  color: #5c5c5c;
}

.revenue-price {
  background: #f5f9fe;
  border-radius: 24px;
  padding: 25px;
  min-width: 260px;
}

.price-title {
  font-weight: bold;
  font-size: 18px;
  margin-bottom: 8px;
}

.price-content {
  font-size: 14px;
  color: #2c3e50;
}

/* ---------- ABOUT US SECTION ---------- */
.about-us-section {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 40px;
  background: #e6f5ff;
  padding: 80px 40px;
}

.inside-div {
  position: relative;
  background: linear-gradient(315.4deg, #0579bf -3.03%, #46acea 103.37%);
  border-radius: 0 44px 44px 0;
  padding: 40px;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mockup-image {
  max-width: 100%;
  height: auto;
  display: block;
}

.about-us-title {
  font-weight: bold;
  font-size: 28px;
  color: #5c5c5c;
  margin-bottom: 20px;
}

.about-us-content {
  font-size: 16px;
  color: #5c5c5c;
  margin-bottom: 20px;
}

.list {
  list-style: none;
  margin: 20px 0;
}

/* li::before {
  content: "•";
  color: #0579bf;
  font-size: 25px;
  padding-right: 10px;
} */

.list-content {
  margin: 10px 0;
  font-size: 16px;
  color: #5c5c5c;
}

.end-text {
  font-size: 16px;
  color: #5c5c5c;
  margin-top: 20px;
}

/* ---------- DEVICE SECTION ---------- */
.device-section {
  padding: 60px 40px;
  background: #fff;
  text-align: center;
}

.device-title {
  font-weight: bold;
  font-size: 28px;
  color: #5c5c5c;
  margin-bottom: 10px;
}

.device-content {
  font-size: 16px;
  color: #5c5c5c;
  max-width: 700px;
  margin: 0 auto 40px;
}

.device-cir {
  display: flex;
  justify-content: center;
  margin-bottom: 40px;
}

.circle {
  position: relative;
  width: 350px;
  height: 350px;
  border-radius: 50%;
  border: 1px solid #3aa3e2;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.gif-img {
  width: 250px;
  height: 250px;
  z-index: 2;
}

.device-icons-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* Device icon positioning (relative to .circle) */
.img-ihealth-lite,
.img-glucose,
.img-21,
.img-1,
.img-pt3,
.img-wave {
  position: absolute;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  transition: transform 0.2s;
}

.img-ihealth-lite { top: 10px; left: 30px; }
.img-glucose { top: 10px; right: 30px; }
.img-21 { top: 130px; right: 0px; }
.img-1 { bottom: 10px; right: 30px; }
.img-pt3 { bottom: 10px; left: 30px; }
.img-wave { top: 130px; left: 0px; }

/* Right side – selected device image */
.image-container {
  position: relative;
  width: 100%;
  max-width: 500px;
  margin: 20px auto;
  background: #f0f4f8;
  border-radius: 32px;
  padding: 20px;
}

.image {
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

.img-text {
  font-weight: bold;
  font-size: 24px;
  color: #5c5c5c;
  margin: 30px 0 10px;
}

/* ---------- CONTACT SECTION ---------- */
.contact-us {
  display: flex;
  flex-wrap: wrap;
  /* background: linear-gradient(120.25deg, #0579bf 29.57%, #46acea 106.13%); */
  /* padding: 4px; */
  gap: 40px;
  align-items: flex-start;
}

.contact-us > div {
  flex: 1 1 300px;
}

.email-img {
  max-width: 200px;
  display: block;
  margin: 0 auto 20px;
}

.mail-title {
  font-weight: bold;
  font-size: 28px;
  color: #fff;
  text-align: center;
}

.mail-text {
  font-size: 16px;
  color: #fff;
  text-align: center;
  padding: 10px;
}

.contact-frm form {
  max-width: 500px;
  margin: 0 auto;
}

.input-name,
.textbox-field {
  color: white;
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
}

.fieldWidth-contact input,
.text-area textarea {
  width: 100%;
  padding: 12px;
  border-radius: 8px;
  border: none;
  font-size: 16px;
}

.send-btn {
  background: #f4ce59;
  border: none;
  padding: 12px 30px;
  font-size: 16px;
  border-radius: 40px;
  cursor: pointer;
  color: #2a4c61;
  margin-top: 20px;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1024px) {
  .left-section {
    padding: 40px 20px;
  }
  .feature-title {
    font-size: 36px;
  }
  .feature-first-img-circle {
    margin-top: 20px;
    text-align: center;
  }
  .revenue-section {
    flex-direction: column;
    text-align: center;
  }
  .about-us-section {
    flex-direction: column;
  }
  .circle {
    width: 280px;
    height: 280px;
  }
  .gif-img {
    width: 200px;
    height: 200px;
  }
  .img-ihealth-lite,
  .img-glucose,
  .img-21,
  .img-1,
  .img-pt3,
  .img-wave {
    width: 55px;
    height: 55px;
  }
}

@media (max-width: 768px) {
  .device-icons-wrapper {
    transform: scale(0.8);
  }
  .circle {
    width: 240px;
    height: 240px;
  }
  .gif-img {
    width: 160px;
    height: 160px;
  }
}:root {
  --color-primary: #27235e;
  --color-accent: #f6fbfe;
  --color-muted: #fafafa;
  --primary-color: #27235e;
  --body-background: #f6fbfe;
  --dark-text-font-color: #494949;
  --input-field-background: #eef2f6;
  --medium-font-size: 14px;
}

.verify-otp-dialog {
  padding: 0;
  border-radius: 12px;
  overflow: hidden;
}

.otp-dialog-title {
  display: flex;
  align-items: center;
  gap: 12px;
  /* background-color: var(--primary-color); */
  color: var(--dark-text-font-color);
  padding: 24px 24px 8px;
  margin: 0;
  font-family: "Open Sans", sans-serif;
  font-size: 20px;
  font-weight: 600;
}

.otp-dialog-title svg {
  fill: var(--primary-color);
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  display: inline-block;
}

.otp-verification-container {
  font-family: "Open Sans", sans-serif;
  text-align: center;
  padding: 24px;
  background-color: white;
  color: var(--dark-text-font-color);
}

.otp-verification-container p {
  font-size: 15px;
  color: #666;
  margin-bottom: 24px;
  line-height: 1.5;
}

.otp-input-wrapper {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin: 20px 0 30px;
}

.otp-digit-input {
  width: 55px;
  height: 55px;
  font-size: 20px;
  font-weight: 600;
  text-align: center;
  border: 2px solid #ddd;
  border-radius: 4px;
  /* background-color: var(--input-field-background); */
  color: var(--dark-text-font-color);
  transition: border-color 0.3s, box-shadow 0.3s;
}

.otp-digit-input:focus {
  outline: none;
  border-color: var(--primary-color);
  box-shadow: 0 0 0 3px rgba(39, 35, 94, 0.15);
}

.otp-action-section {
  margin-bottom: 24px;
}

.otp-verify-btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
  width: 100%;
  height: 48px;
  background-color: var(--primary-color);
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.3s, transform 0.1s;
}

.otp-verify-btn:hover:not(:disabled) {
  background-color: var(--color-primary);
  opacity: 0.9;
}

.otp-verify-btn:disabled {
  background-color: #cccccc;
  cursor: not-allowed;
}

.otp-verify-btn svg {
  fill: white;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  display: inline-block;
}

.otp-resend-section {
  margin-top: 16px;
}

.otp-resend-section p {
  margin: 0 0 6px 0;
  font-size: 14px;
  color: #888;
}

.txt4 {
  font-family: "Open Sans", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 15px;
  line-height: 18px;
  color: var(--primary-color);
  display: inline-block;
  text-decoration: none;
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: color 0.2s;
}

.txt4:hover {
  text-decoration: underline;
}

.about-border {
  display: block;
  width: 120px;
  height: 3px;
  background: var(--primary-color);
  margin: 8px auto 0;
  border-radius: 2px;
}
:root {
  --color-primary: #27235e;
  --color-accent: #f6fbfe;
  --color-muted: #fafafa;
  --primary-color: #27235e;
  --body-background: #f6fbfe;
  --dark-text-font-color: #494949;
  --input-field-background: #eef2f6;
  --medium-font-size: 14px;
}


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


body,
html {
  height: 100%;
  font-family: 'Open Sans', sans-serif;
}


/*---------------------------------------------*/


a {
  font-family: 'Open Sans', sans-serif;;
  font-size: 14px;
  line-height: 1.7;
  color: #666666;
  margin: 0px;
  transition: all 0.4s;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
}


a:focus {
  outline: none !important;
}


a:hover {
  text-decoration: none;
  color: #1b3815;
}


/*---------------------------------------------*/


h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0px;
}


p {
  font-family: 'Open Sans', sans-serif;;
  font-size: 14px;
  line-height: 1.7;
  color: #666666;
  margin: 0px;
}


ul,
li {
  margin: 0px;
  list-style-type: none;
}


/*---------------------------------------------*/


input {
  outline: none;
  border: none;
}


input[type="number"] {
  -moz-appearance: textfield;
  appearance: none;
  -webkit-appearance: none;
}


input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}


textarea {
  outline: none;
  border: none;
}


textarea:focus,
input:focus {
  border-color: transparent !important;
}


input::-webkit-input-placeholder {
  color: #1b3815;
}


input:-moz-placeholder {
  color: #1b3815;
}


input::-moz-placeholder {
  color: #1b3815;
}


input:-ms-input-placeholder {
  color: #1b3815;
}


textarea::-webkit-input-placeholder {
  color: #1b3815;
}


textarea:-moz-placeholder {
  color: #1b3815;
}


textarea::-moz-placeholder {
  color: #1b3815;
}


textarea:-ms-input-placeholder {
  color: #1b3815;
}


/*---------------------------------------------*/


button {
  outline: none !important;
  border: none;
  background: transparent;
}


button:hover {
  cursor: pointer;
}


iframe {
  border: none !important;
}


/*//////////////////////////////////////////////////////////////////
[ Utility ]*/


.txt1 {
  font-family: 'Open Sans', sans-serif;;
  font-size: 15px;
  color: #999999;
  line-height: 1.4;
}


.txt2 {
  font-family: 'Open Sans', sans-serif;;
  font-size: 15px;
  color: #57b846;
  line-height: 1.4;
}


.txt3 {
  font-family: 'Open Sans', sans-serif;;
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 18px;
  color: var(--primary-color);
  display: block;
  text-decoration: none;
  letter-spacing: 1px;
}


.about-border {
  display: block;
  width: 146px;
  height: 3px;
  background: var(--primary-color);
  margin: 10px auto;
}


.limiter {
  width: 100%;
  margin: 0 auto;
}


.container-login100 {
  width: 100%;
  min-height: 120vh;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  padding: 15px;
  position: relative;
  background-color: var(--body-background);
}


.wrap-login100 {
  width: 500px;
  background: #fff;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -ms-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  z-index: 1;
}


.login100-form {
  width: 100%;
  position: relative;
}


.login100-form-title {
  font-family: 'Open Sans', sans-serif;;
  font-size: 30px;
  color: var(--dark-text-font-color);
  text-align: center;
  display: block;
  width: 100%;
  font-weight: 900;
  line-height: 45px;
  top: 60px;
}


.login100-form-sub-title {
  font-size: 28px;
  font-style: normal;
  font-weight: normal;
  line-height: 28px;
  display: block;
  text-align: center;
  width: 100%;
  color: var(--dark-text-font-color);
  padding-top: 10px;
  padding-bottom: 10px;
}


.form-labels {
  font-family: 'Open Sans', sans-serif;;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
}


/*------------------------------------------------------------------
[ Input ]*/


.wrap-input100 {
  width: 100%;
  background-color: var(--input-field-background);
  position: relative;
  z-index: 1;
}


.input100 {
  font-family: 'Open Sans', sans-serif;;
  font-size: 15px;
  color: var(--dark-text-font-color);
  line-height: 1.2;
  position: relative;
  display: block;
  width: 100%;
  height: 55px;
  background: var(--input-field-background);
  padding: 0 35px 0 35px;
  border-radius: 8px;
}


/*------------------------------------------------------------------
[ Focus Input ]*/


.focus-input100 {
  display: block;
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  border-radius: 8px;
  background-color: var(--input-field-background);
  pointer-events: none;

  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}


.input100:focus+.focus-input100 {
  width: calc(100% + 20px);
}


/*------------------------------------------------------------------
[ Button ]*/


.container-login100-form-btn {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}


.login100-form-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 20px;
  width: 100%;
  height: 73px;
  background-color: var(--primary-color);
  border-radius: 8px;

  font-family: 'Open Sans', sans-serif;;
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  line-height: 20px;
  letter-spacing: 0.5px;

  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}


.login100-form-btn:hover {
  background-color: var(--body-background);
  color: var(--primary-color);
}


/*------------------------------------------------------------------
[ Alert validate ]*/


.validate-input {
  position: relative;
}


.alert-validate::before {
  content: attr(data-validate);
  position: absolute;
  z-index: 1000;
  max-width: 70%;
  background-color: #fff;
  border: 1px solid #c80000;
  border-radius: 14px;
  padding: 4px 25px 4px 10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 10px;
  pointer-events: none;

  font-family: 'Open Sans', sans-serif;;
  color: #c80000;
  font-size: 13px;
  line-height: 1.4;
  text-align: left;

  visibility: hidden;
  opacity: 0;

  -webkit-transition: opacity 0.4s;
  -o-transition: opacity 0.4s;
  -moz-transition: opacity 0.4s;
  transition: opacity 0.4s;
}


.alert-validate::after {
  content: "\f06a";
  font-family: FontAwesome;
  display: block;
  position: absolute;
  z-index: 1100;
  color: #c80000;
  font-size: 16px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 16px;
}


.alert-validate:hover:before {
  visibility: visible;
  opacity: 1;
}


@media (max-width: 992px) {
  .alert-validate::before {
    visibility: visible;
    opacity: 1;
  }
}


/*//////////////////////////////////////////////////////////////////
[ Responsive ]*/


@media (max-width: 576px) {
  .login100-form {
    padding-left: 15px;
    padding-right: 15px;
  }

  .login100-form-sub-title {
    display: none;
  }
}


.wrap-background-bottom {
  height: 200px;
  background: var(--primary-color);
  position: absolute;
  width: 100%;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  z-index: 0;
  bottom: 0;
}


.invalid-feedback {
  color: rgb(151, 8, 8);
  position: absolute;
  right: 0;
}


.doctoricon
{
  height:60px;
  width:60px;
}
:root {
  --color-primary: #27235e;
  --color-accent: #f6fbfe;
  --color-muted: #fafafa;
  --primary-color: #27235e;
  --body-background: #f6fbfe;
  --dark-text-font-color: #494949;
  --input-field-background: #eef2f6;
  --medium-font-size: 14px;
}

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

body,
html {
  height: 100%;
  font-family: "Open Sans", sans-serif;
}

/*---------------------------------------------*/

a {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  line-height: 1.7;
  color: #666666;
  margin: 0px;
  transition: all 0.4s;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
}

a:focus {
  outline: none !important;
}

a:hover {
  text-decoration: none;
  color: #1b3815;
}

/*---------------------------------------------*/

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0px;
}

p {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  line-height: 1.7;
  color: #666666;
  margin: 0px;
}

ul,
li {
  margin: 0px;
  list-style-type: none;
}

/*---------------------------------------------*/

input {
  outline: none;
  border: none;
}

input[type="number"] {
  -moz-appearance: textfield;
  appearance: none;
  -webkit-appearance: none;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

textarea {
  outline: none;
  border: none;
}

textarea:focus,
input:focus {
  border-color: transparent !important;
}

input::-webkit-input-placeholder {
  color: #1b3815;
}

input:-moz-placeholder {
  color: #1b3815;
}

input::-moz-placeholder {
  color: #1b3815;
}

input:-ms-input-placeholder {
  color: #1b3815;
}

textarea::-webkit-input-placeholder {
  color: #1b3815;
}

textarea:-moz-placeholder {
  color: #1b3815;
}

textarea::-moz-placeholder {
  color: #1b3815;
}

textarea:-ms-input-placeholder {
  color: #1b3815;
}

/*---------------------------------------------*/

button {
  outline: none !important;
  border: none;
  background: transparent;
}

button:hover {
  cursor: pointer;
}

iframe {
  border: none !important;
}

/*//////////////////////////////////////////////////////////////////
[ Utility ]*/

.txt1 {
  font-family: "Open Sans", sans-serif;
  font-size: 15px;
  color: #999999;
  line-height: 1.4;
}

.txt2 {
  font-family: "Open Sans", sans-serif;
  font-size: 15px;
  color: #57b846;
  line-height: 1.4;
}

.txt3 {
  font-family: "Open Sans", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 18px;
  color: $primary-color;
  display: block;
  text-decoration: none;
  letter-spacing: 1px;
}

.about-border {
  display: block;
  width: 146px;
  height: 3px;
  background: $primary-color;
  margin: 10px auto;
}

.limiter {
  width: 100%;
  margin: 0 auto;
}

.container-login100 {
  width: 100%;
  min-height: 100vh;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  padding: 15px;
  position: relative;
  background-color: $body-background;
}

.wrap-login100 {
  width: 500px;
  background: #fff;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -ms-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  z-index: 1;
}

.login100-form {
  width: 100%;
  position: relative;
}

.login100-form-title {
  font-family: "Open Sans", sans-serif;
  font-size: 30px;
  color: $dark-text-font-color;
  text-align: center;
  display: block;
  width: 100%;
  font-weight: 900;
  line-height: 45px;
  top: 60px;
}

.login100-form-sub-title {
  font-size: 28px;
  font-style: normal;
  font-weight: normal;
  line-height: 28px;
  display: block;
  text-align: center;
  width: 100%;
  color: $dark-text-font-color;
  padding-top: 10px;
  padding-bottom: 10px;
  cursor: pointer;
}

.form-labels {
  font-family: "Open Sans", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
}

/*------------------------------------------------------------------
[ Input ]*/

.wrap-input100 {
  width: 100%;
  background-color: $input-field-background;
  position: relative;
  z-index: 1;
}

.input100 {
  font-family: "Open Sans", sans-serif;
  font-size: 15px;
  color: $dark-text-font-color;
  line-height: 1.2;
  position: relative;
  display: block;
  width: 100%;
  height: 55px;
  background: $input-field-background;
  padding: 0 35px 0 35px;
  border-radius: 8px;
}

/*------------------------------------------------------------------
[ Focus Input ]*/

.focus-input100 {
  display: block;
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  border-radius: 8px;
  background-color: $input-field-background;
  pointer-events: none;

  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}

.input100:focus+.focus-input100 {
  width: calc(100% + 20px);
}

/*------------------------------------------------------------------
[ Button ]*/

.container-login100-form-btn {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.login100-form-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 20px;
  width: 100%;
  height: 73px;
  background-color: $primary-color;
  border-radius: 8px;

  font-family: "Open Sans", sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  line-height: 20px;
  letter-spacing: 0.5px;

  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}

.login100-form-btn:hover,
.login100-form-btn.disabled {
  background-color: $body-background;
  color: $primary-color;
}

.txt {
  font-family: "Open Sans", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  margin-top: 20px;
  line-height: 18px;
  color: $primary-color;
  display: block;
  text-decoration: none;
  letter-spacing: 1px;
  cursor: pointer;
}

.about-border {
  display: block;
  width: 93px;
  height: 2px;
  background: $primary-color;
  margin: 5px auto;
}

/*------------------------------------------------------------------
[ Alert validate ]*/

.validate-input {
  position: relative;
}

.alert-validate::before {
  content: attr(data-validate);
  position: absolute;
  z-index: 1000;
  max-width: 70%;
  background-color: #fff;
  border: 1px solid #c80000;
  border-radius: 14px;
  padding: 4px 25px 4px 10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 10px;
  pointer-events: none;

  font-family: "Open Sans", sans-serif;
  color: #c80000;
  font-size: 13px;
  line-height: 1.4;
  text-align: left;

  visibility: hidden;
  opacity: 0;

  -webkit-transition: opacity 0.4s;
  -o-transition: opacity 0.4s;
  -moz-transition: opacity 0.4s;
  transition: opacity 0.4s;
}

.alert-validate::after {
  content: "\f06a";
  font-family: FontAwesome;
  display: block;
  position: absolute;
  z-index: 1100;
  color: #c80000;
  font-size: 16px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 16px;
}

.alert-validate:hover:before {
  visibility: visible;
  opacity: 1;
}

@media (max-width: 992px) {
  .alert-validate::before {
    visibility: visible;
    opacity: 1;
  }
}

/*//////////////////////////////////////////////////////////////////
[ Responsive ]*/

@media (max-width: 576px) {
  .login100-form {
    padding-left: 15px;
    padding-right: 15px;
  }

  .login100-form-sub-title {
    display: none;
  }
}

.wrap-background-bottom {
  height: 200px;
  background: $primary-color;
  position: absolute;
  width: 100%;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  z-index: 0;
  bottom: 0;
}

.invalid-feedback {
  color: rgb(151, 8, 8);
  position: absolute;
  margin: 20px 0px;
  right: 0;
}:root {
  --color-primary: #27235e;
  --color-accent: #f6fbfe;
  --color-muted: #fafafa;
  --primary-color: #27235e;
  --body-background: #f6fbfe;
  --dark-text-font-color: #494949;
  --input-field-background: #eef2f6;
  --medium-font-size: 14px;
}
/* @import "../../../utils"; */
* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
body,
html {
  height: 100%;
  font-family: "Open Sans", sans-serif;
}
/*---------------------------------------------*/
a {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  line-height: 1.7;
  color: #666666;
  margin: 0px;
  transition: all 0.4s;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
}
a:focus {
  outline: none !important;
}
a:hover {
  text-decoration: none;
  color: #1b3815;
}
/*---------------------------------------------*/
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0px;
}
p {
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  line-height: 1.7;
  color: #666666;
  margin: 0px;
}
ul,
li {
  margin: 0px;
  list-style-type: none;
}
/*---------------------------------------------*/
input {
  outline: none;
  border: none;
}
input[type="number"] {
  -moz-appearance: textfield;
  appearance: none;
  -webkit-appearance: none;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
textarea {
  outline: none;
  border: none;
}
textarea:focus,
input:focus {
  border-color: transparent !important;
}
input::-webkit-input-placeholder {
  color: #1b3815;
}
input:-moz-placeholder {
  color: #1b3815;
}
input::-moz-placeholder {
  color: #1b3815;
}
input:-ms-input-placeholder {
  color: #1b3815;
}
textarea::-webkit-input-placeholder {
  color: #1b3815;
}
textarea:-moz-placeholder {
  color: #1b3815;
}
textarea::-moz-placeholder {
  color: #1b3815;
}
textarea:-ms-input-placeholder {
  color: #1b3815;
}
/*---------------------------------------------*/
button {
  outline: none !important;
  border: none;
  background: transparent;
}
button:hover {
  cursor: pointer;
}
iframe {
  border: none !important;
}
/*//////////////////////////////////////////////////////////////////
[ Utility ]*/
.txt1 {
  font-family: "Open Sans", sans-serif;
  font-size: 15px;
  color: #999999;
  line-height: 1.4;
}
.txt2 {
  font-family: "Open Sans", sans-serif;
  font-size: 15px;
  color: #57b846;
  line-height: 1.4;
}
.txt3 {
  font-family: "Open Sans", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 18px;
  color: $primary-color;
  display: block;
  text-decoration: none;
  letter-spacing: 1px;
}
.about-border {
  display: block;
  width: 146px;
  height: 3px;
  background: $primary-color;
  margin: 10px auto;
}
.limiter {
  width: 100%;
  margin: 0 auto;
}
.container-login100 {
  width: 100%;
  min-height: 100vh;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  padding: 15px;
  position: relative;
  background-color: $body-background;
}
.wrap-login100 {
  width: 500px;
  background: #fff;
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -webkit-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -o-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  -ms-box-shadow: 0 3px 20px 0px rgba(0, 0, 0, 0.1);
  z-index: 1;
}
.login100-form {
  width: 100%;
  position: relative;
}
.login100-form-title {
  font-family: "Open Sans", sans-serif;
  font-size: 30px;
  color: $dark-text-font-color;
  text-align: center;
  display: block;
  width: 100%;
  font-weight: 900;
  line-height: 45px;
  top: 60px;
}
.login100-form-sub-title {
  font-size: 28px;
  font-style: normal;
  font-weight: normal;
  line-height: 28px;
  display: block;
  text-align: center;
  width: 100%;
  color: $dark-text-font-color;
  padding-top: 10px;
  padding-bottom: 10px;
  cursor: pointer;
}
.form-labels {
  font-family: "Open Sans", sans-serif;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
}
/*------------------------------------------------------------------
[ Input ]*/
.wrap-input100 {
  width: 100%;
  background-color: $input-field-background;
  position: relative;
  z-index: 1;
}
.wrap-input1000 {
  width: 100%;
  position: relative;
  z-index: 1;
}
.input100 {
  font-family: "Open Sans", sans-serif;
  font-size: 15px;
  color: $dark-text-font-color;
  line-height: 1.2;
  position: relative;
  display: block;
  width: 100%;
  height: 55px;
  background: $input-field-background;
  padding: 0 35px 0 35px;
  border-radius: 8px;
}
/*------------------------------------------------------------------
[ Focus Input ]*/
.focus-input100 {
  display: block;
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  border-radius: 8px;
  background-color: $input-field-background;
  pointer-events: none;

  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}
.input100:focus + .focus-input100 {
  width: calc(100% + 20px);
}
/*------------------------------------------------------------------
[ Button ]*/
.container-login100-form-btn {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.login100-form-btn {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 20px;
  width: 100%;
  height: 73px;
  background-color: $primary-color;
  border-radius: 8px;

  font-family: "Open Sans", sans-serif;
  font-size: 20px;
  font-weight: 600;
  color: #fff;
  line-height: 20px;
  letter-spacing: 0.5px;

  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  -moz-transition: all 0.4s;
  transition: all 0.4s;
}
.login100-form-btn:hover,
.login100-form-btn.disabled {
  background-color: $body-background;
  color: $primary-color;
}
/*------------------------------------------------------------------
[ Alert validate ]*/
.validate-input {
  position: relative;
}
.alert-validate::before {
  content: attr(data-validate);
  position: absolute;
  z-index: 1000;
  max-width: 70%;
  background-color: #fff;
  border: 1px solid #c80000;
  border-radius: 14px;
  padding: 4px 25px 4px 10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 10px;
  pointer-events: none;

  font-family: "Open Sans", sans-serif;
  color: #c80000;
  font-size: 13px;
  line-height: 1.4;
  text-align: left;

  visibility: hidden;
  opacity: 0;

  -webkit-transition: opacity 0.4s;
  -o-transition: opacity 0.4s;
  -moz-transition: opacity 0.4s;
  transition: opacity 0.4s;
}
.alert-validate::after {
  content: "\f06a";
  font-family: FontAwesome;
  display: block;
  position: absolute;
  z-index: 1100;
  color: #c80000;
  font-size: 16px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 16px;
}
.alert-validate:hover:before {
  visibility: visible;
  opacity: 1;
}
@media (max-width: 992px) {
  .alert-validate::before {
    visibility: visible;
    opacity: 1;
  }
}
/*//////////////////////////////////////////////////////////////////
[ Responsive ]*/
@media (max-width: 576px) {
  .login100-form {
    padding-left: 15px;
    padding-right: 15px;
  }
  .login100-form-sub-title {
    display: none;
  }
}
.wrap-background-bottom {
  height: 200px;
  background: $primary-color;
  position: absolute;
  width: 100%;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  z-index: 0;
  bottom: 0;
}
.invalid-feedback {
  color: rgb(151, 8, 8);
  position: absolute;
  margin: 20px 0px;
  right: 0;
}
.card-note {
  font-size: x-small;
}
/* ---------- NEW RESPONSIVE HEADER STYLES ---------- */

.static-header-container {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    padding: 24px 20px;
    background: transparent;
    transition: all 0.3s ease;
}

.static-header {
    max-width: 1280px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

/* Logo Section */
.header-logo {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.logo-image {
    height: 50px;
    width: auto;
    object-fit: contain;
    transition: transform 0.2s ease;
}

.logo-image:hover {
    transform: scale(1.03);
}

/* Desktop Split Layout */
.header-left-part {
    flex: 0 0 75%;
    display: flex;
    align-items: center;
    justify-content: space-around;
}

.header-right-part {
    flex: 0 0 25%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 48px;
    padding-right: 40px;
}

/* Desktop Navigation Links */
.header-nav {
    display: flex;
    align-items: center;
    gap: 40px;
}

.nav-link {
    font-family: inherit;
    font-size: 16px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.85);
    text-decoration: none;
    cursor: pointer;
    transition: color 0.2s ease;
    position: relative;
    padding: 6px 0;
}

.nav-link:hover {
    color: #ffffff;
}

/* Subtle sliding underline hover effect */
.nav-link::after {
    content: '';
    position: absolute;
    width: 100%;
    transform: scaleX(0);
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: #f4ce59;
    transform-origin: bottom right;
    transition: transform 0.25s ease-out;
}

.nav-link:hover::after {
    transform: scaleX(1);
    transform-origin: bottom left;
}

/* Desktop Actions Group (Contact us & SIGN IN) */
.contact-us-btn {
    font-family: inherit;
    font-size: 15px;
    font-weight: 500;
    color: #2a4c61; /* Dark blue color to stand out on the light blue background */
    text-decoration: none;
    cursor: pointer;
    transition: color 0.2s ease;
}

.contact-us-btn:hover {
    color: var(--color-primary, #0579bf);
}

.sign-in-btn {
    font-family: inherit;
    font-size: 14px;
    font-weight: bold;
    background: #f4ce59;
    color: #2a4c61;
    border: none;
    padding: 10px 24px;
    border-radius: 50px;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 4px 12px rgba(244, 206, 89, 0.15);
}

.sign-in-btn:hover {
    background: #e5bc40;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(244, 206, 89, 0.3);
}

.sign-in-btn:active {
    transform: translateY(0);
}


/* Mobile Menu Toggle button */
.mobile-menu-toggle {
    display: none;
    flex-direction: column;
    justify-content: space-between;
    width: 28px;
    height: 20px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    z-index: 200;
}

.hamburger-line {
    width: 100%;
    height: 2.5px;
    background-color: #ffffff;
    border-radius: 4px;
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}

/* Hamburger animations */
.mobile-menu-toggle.active .hamburger-line:nth-child(1) {
    transform: translateY(8.5px) rotate(45deg);
}

.mobile-menu-toggle.active .hamburger-line:nth-child(2) {
    opacity: 0;
}

.mobile-menu-toggle.active .hamburger-line:nth-child(3) {
    transform: translateY(-9px) rotate(-45deg);
}

/* Integrated inside mobile navigation group, hidden on desktop */
.mobile-cta-group {
    display: none;
}

/* ---------- RESPONSIVE BREAKPOINTS ---------- */
@media (max-width: 992px) {
    .static-header-container {
        padding: 20px 40px;
    }

    .header-right-part {
        display: none;
    }

    .header-left-part {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }

    .mobile-menu-toggle {
        display: flex;
    }

    /* Side-drawer navigation menu */
    .header-nav {
        position: fixed;
        top: 0;
        right: -100%;
        width: 280px;
        height: 100vh;
        background: rgba(10, 48, 80, 0.96);
        backdrop-filter: blur(15px);
        -webkit-backdrop-filter: blur(15px);
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 32px;
        transition: right 0.35s cubic-bezier(0.645, 0.045, 0.355, 1);
        z-index: 150;
        box-shadow: -10px 0 40px rgba(0, 0, 0, 0.25);
    }

    .header-nav.mobile-open {
        right: 0;
    }

    .nav-link {
        font-size: 20px;
        color: #ffffff;
        padding: 8px 0;
    }

    .nav-link::after {
        display: none; /* Disable hover underline on mobile view */
    }

    .mobile-cta-group {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 24px;
        margin-top: 30px;
        width: 100%;
    }

    .mobile-cta-group .contact-us-btn {
        font-size: 18px;
        color: #ffffff;
    }

    .mobile-cta-group .sign-in-btn {
        width: 160px;
        font-size: 16px;
        padding: 12px 0;
    }
}

@media (max-width: 576px) {
    .static-header-container {
        padding: 16px 20px;
    }
    .logo-image {
        height: 32px;
    }
    .header-nav {
        width: 100%; /* Take full screen on tiny devices */
    }
}
.footer {
	background: #434343;
	margin: 0px;
	padding-left: 120px;
	display: flex;
	padding-top: 15px;
}
.first-div {
	display: flex;
}

.privacy-policy {
	font-family: "Helvetica", Arial, sans-serif;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	color: #ffffff;
	margin-left: 10px;
	cursor: pointer;
}

.copyright-text {
	font-family: "Helvetica", Arial, sans-serif;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	color: #cccccc;
}


.logo-img {
	margin-right: 10px;
	margin-left: 5px;
}


/* ---------- FONTS & VARIABLES ---------- */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
:root {
    --color-primary: #0579bf;
    --color-primary-dark: #1e5a8a;
    --color-secondary: #46acea;
    --color-text-dark: #2c3e50;
    --color-text-muted: #5c5c5c;
    --color-bg-light: #e6f5ff;
    --color-accent: #f4ce59;
    --color-accent-hover: #e5bc40;
    --font-sans: 'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}
body {
    font-family: var(--font-sans);
    color: var(--color-text-dark);
    background-color: #ffffff;
    overflow-x: hidden;
}
.landing-page {
    width: 100%;
    overflow-x: hidden;
}
/* ---------- FEATURE / HERO SECTION ---------- */
.feature-section {
    background: var(--color-bg-light);
    position: relative;
    width: 100%;
    overflow: hidden;
}
.feature-container {
    width: 75%;
    max-width: 75%;
    background: linear-gradient(135deg, var(--color-secondary) 0%, var(--color-primary-dark) 100%);
    border-radius: 0 0 142px 0;
    padding: 160px 0 120px 80px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    overflow: visible;
}
.feature-left {
    flex: 1.2;
    max-width: 650px;
    z-index: 5;
}
.feature-title {
    font-family: var(--font-sans);
    font-size: 54px;
    font-weight: 800;
    color: #ffffff;
    margin-bottom: 20px;
    line-height: 1.15;
    text-transform: capitalize;
    letter-spacing: -0.5px;
}
.feature-content {
    font-family: var(--font-sans);
    font-size: 17.5px;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.6;
    margin-bottom: 36px;
    font-weight: 400;
}
.start-btn {
    display: inline-block;
    background: var(--color-accent);
    color: #2a4c61;
    font-weight: 700;
    text-decoration: none;
    font-size: 15px;
    letter-spacing: 1px;
    padding: 14px 36px;
    border-radius: 50px;
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    box-shadow: 0 8px 20px rgba(244, 206, 89, 0.25);
    text-transform: uppercase;
}
.start-btn:hover {
    background: #ffffff;
    color: var(--color-primary);
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(255, 255, 255, 0.2);
}
.start-btn:active {
    transform: translateY(-1px);
}
.feature-right {
    flex: 0 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 5;
}
.feature-img-circle {
    width: 400px;
    height: 400px;
    border-radius: 50%;
    border: 8px solid rgb(201, 172, 4);
    overflow: hidden;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
    margin-right: -150px;
    margin-top: -20px;
    z-index: 10;
    position: relative;
}
.feature-img-circle:hover {
    transform: scale(1.02) rotate(1deg);
}
.feature-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* ---------- 4 CARDS SECTION ---------- */
.cards-container {
    max-width: 1240px;
    margin: -60px auto 0 auto;
    padding: 0 24px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    position: relative;
    z-index: 10;
}
.feature-card {
    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0px 10px 35px rgba(0, 0, 0, 0.06);
    padding: 32px 28px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    border: 1px solid rgba(0, 0, 0, 0.03);
}
.feature-card:hover {
    transform: translateY(-8px);
    box-shadow: 0px 20px 45px rgba(5, 121, 191, 0.12);
    border-color: rgba(5, 121, 191, 0.1);
}
.card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 18px;
    width: 100%;
}
.card-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--color-text-dark);
    margin: 0;
    line-height: 1.35;
    flex: 1;
    padding-right: 12px;
}
.card-icon {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
}
.card-content {
    font-size: 14.5px;
    color: var(--color-text-muted);
    line-height: 1.55;
}
/* ---------- REVENUE / ECONOMICS SECTION ---------- */
.revenue-section {
    max-width: 1240px;
    margin: 120px auto;
    padding:24px;
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: 48px;
    align-items: start;
    border-radius: 20px;
}
.revenue-left {
    padding-right: 20px;
    height: 100%;
    align-content: center;
}
.revenue-text {
    font-size: 28px;
    font-weight: 800;
    color: var(--color-text-dark);
    line-height: 1.2;
    letter-spacing: -0.5px;
}
.revenue-middle {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.revenue-item {
    padding: 18px 24px;
    border-radius: 16px;
    cursor: pointer;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.02);
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.revenue-item:hover {
    transform: translateX(4px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
    border-color: rgba(5, 121, 191, 0.2);
}
.revenue-item.active {
    background: var(--color-primary);
    border-color: var(--color-primary);
    transform: translateX(8px);
    box-shadow: 0 10px 25px rgba(5, 121, 191, 0.2);
}
.revenue-price-number {
    font-size: 28px;
    font-weight: 800;
    color: var(--color-text-dark);
    margin-bottom: 4px;
    transition: color 0.3s ease;
}
.revenue-item.active .revenue-price-number {
    color: #ffffff;
}
.revenue-price-desc {
    font-size: 11.5px;
    font-weight: 600;
    color: var(--color-text-muted);
    letter-spacing: 0.5px;
    text-transform: uppercase;
    transition: color 0.3s ease;
}
.revenue-item.active .revenue-price-desc {
    color: rgba(255, 255, 255, 0.85);
}
.revenue-right {
    background: #f5f9fe;
    border-radius: 24px;
    padding: 40px 32px;
    border: 1px dashed rgba(5, 121, 191, 0.2);
    box-shadow: inset 0 2px 8px rgba(0,0,0,0.01);
    min-height: 250px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.detail-title {
    font-size: 22px;
    font-weight: 800;
    color: var(--color-primary);
    margin-bottom: 14px;
    border-bottom: 2px solid rgba(5, 121, 191, 0.1);
    padding-bottom: 8px;
}
.detail-content {
    font-size: 15.5px;
    color: var(--color-text-dark);
    line-height: 1.65;
}
/* ---------- ABOUT US SECTION ---------- */
.about-us-section {
    background: var(--color-bg-light);
    padding: 100px 8%;
    display: flex;
    flex-direction: row;
    gap: 80px;
    align-items: center;
    width: 100%;
}
.about-left {
    flex: 1.2;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
.about-gradient-bg {
    width: 100%;
    max-width: 520px;
    height: 360px;
    background: linear-gradient(135deg, var(--color-primary) -3.03%, var(--color-secondary) 103.37%);
    border-radius: 28px;
    position: relative;
    box-shadow: 0 15px 35px rgba(5, 121, 191, 0.15);
}
.mockup-image {
    position: absolute;
    width: 110%;
    height: auto;
    left: 5%;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    z-index: 2;
    filter: drop-shadow(0 20px 40px rgba(0,0,0,0.18));
    transition: transform 0.3s ease;
}
.mockup-image:hover {
    transform: translateY(-52%) scale(1.01);
}
.about-right {
    flex: 1;
}
.about-title {
    font-size: 34px;
    font-weight: 800;
    color: var(--color-text-dark);
    margin-bottom: 20px;
    line-height: 1.25;
}
.about-subtitle {
    font-size: 16.5px;
    color: var(--color-text-muted);
    margin-bottom: 25px;
    line-height: 1.6;
}
.feature-list {
    list-style: none;
    margin-bottom: 30px;
    padding: 0;
}
.feature-list li {
    font-size: 15.5px;
    color: var(--color-text-dark);
    margin-bottom: 12px;
    padding-left: 28px;
    position: relative;
    line-height: 1.45;
    font-weight: 500;
}
.feature-list li::before {
    content: "✓";
    color: var(--color-primary);
    font-weight: 900;
    font-size: 18px;
    position: absolute;
    left: 0;
    top: -2px;
}
.about-footer {
    font-size: 16px;
    color: var(--color-text-muted);
    line-height: 1.6;
    font-style: italic;
    border-left: 3px solid var(--color-primary);
    padding-left: 16px;
}
/* ---------- DEVICE SECTION ---------- */
.device-section {
    padding: 120px 24px;
    width: 100%;
    background: #ffffff;
    text-align: center;
}
.device-title {
    font-size: 36px;
    font-weight: 800;
    color: var(--color-text-dark);
    margin-bottom: 16px;
}
.device-description {
    max-width: 680px;
    margin: 0 auto 70px auto;
    font-size: 16.5px;
    color: var(--color-text-muted);
    line-height: 1.6;
}
.device-main-layout {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    max-width: 1140px;
    margin: 0 auto;
    gap: 80px;
}
.device-left-col {
    flex: 1.2;
    display: flex;
    justify-content: center;
    align-items: center;
}
.device-right-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}
.device-circle {
    position: relative;
    width: 380px;
    height: 380px;
    border-radius: 50%;
    border: 2px dashed rgba(5, 121, 191, 0.25);
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: inset 0 0 20px rgba(5, 121, 191, 0.03);
}
.circle-gif {
    width: 200px;
    height: 200px;
    z-index: 2;
    object-fit: contain;
}
.device-icons-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.device-icon {
    position: absolute;
    width: 76px;
    height: 76px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    padding: 12px;
    object-fit: contain;
    z-index: 3;
    border: 2px solid transparent;
}
.device-icon:hover {
    transform: scale(1.15);
    box-shadow: 0 12px 28px rgba(5, 121, 191, 0.2);
    border-color: rgba(5, 121, 191, 0.2);
}
.device-icon.active {
    box-shadow: 0 12px 28px rgba(5, 121, 191, 0.35);
    border-color: var(--color-primary);
    transform: scale(1.15);
}
/* Symmetrical circular coordinates (radius ~150px) */
.device-icon.img-ihealth-lite { top: 12px; left: 60px; }
.device-icon.img-glucose { top: 12px; right: 60px; }
.device-icon.img-21 { top: 152px; right: 8px; }
.device-icon.img-1 { bottom: 12px; right: 60px; }
.device-icon.img-pt3 { bottom: 12px; left: 60px; }
.device-icon.img-wave { top: 152px; left: 8px; }
.selected-device-name {
    font-size: 32px;
    font-weight: 800;
    color: var(--color-text-dark);
    margin-bottom: 24px;
}
.selected-device-image {
    position: relative;
    width: 100%;
    max-width: 440px;
    background: #f8fafc;
    border-radius: 24px;
    padding: 40px;
    box-shadow: inset 0 2px 8px rgba(0,0,0,0.01), 0 10px 30px rgba(0, 0, 0, 0.03);
    border: 1px solid rgba(0, 0, 0, 0.03);
    display: flex;
    justify-content: center;
    align-items: center;
}
.selected-device-image img {
    width: 100%;
    height: auto;
    display: block;
    max-height: 220px;
    object-fit: contain;
    filter: drop-shadow(0 10px 20px rgba(0,0,0,0.08));
}
/* ---------- CONTACT SECTION ---------- */
.contact-section {
    background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    padding: 100px 8%;
    display: flex;
    flex-wrap: wrap;
    gap: 80px;
    align-items: center;
}
.contact-left {
    flex: 1;
    text-align: left;
}
.contact-illustration {
    max-width: 220px;
    margin-bottom: 30px;
    filter: drop-shadow(0 15px 25px rgba(0,0,0,0.15));
}
.contact-title {
    font-size: 42px;
    font-weight: 800;
    color: #ffffff;
    margin-bottom: 16px;
    letter-spacing: -0.5px;
}
.contact-text {
    font-size: 17px;
    color: rgba(255, 255, 255, 0.9);
    line-height: 1.6;
    max-width: 440px;
}
.contact-right {
    flex: 1;
    display: flex;
    justify-content: flex-end;
}
.contact-right form {
    width: 100%;
    max-width: 500px;
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.15);
    padding: 40px;
    border-radius: 24px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15);
}
.form-group {
    margin-bottom: 24px;
}
.form-group label {
    display: block;
    color: #ffffff;
    font-weight: 600;
    margin-bottom: 8px;
    font-size: 12.5px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
.form-group input,
.form-group textarea {
    width: 100%;
    padding: 14px 18px;
    border-radius: 12px;
    border: 1.5px solid transparent;
    font-size: 15px;
    background: rgba(255, 255, 255, 0.95);
    font-family: inherit;
    color: var(--color-text-dark);
    transition: all 0.3s ease;
}
.form-group input:focus,
.form-group textarea:focus {
    outline: none;
    border-color: var(--color-accent);
    background: #ffffff;
    box-shadow: 0 0 12px rgba(244, 206, 89, 0.25);
}
.form-group textarea {
    resize: vertical;
}
.error {
    color: #ffd2d2;
    font-size: 12.5px;
    display: block;
    margin-top: 6px;
    font-weight: 500;
}
.send-button {
    background: var(--color-accent);
    border: none;
    padding: 14px 35px;
    font-weight: 800;
    font-size: 16px;
    border-radius: 50px;
    cursor: pointer;
    color: #2a4c61;
    transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
    box-shadow: 0 8px 20px rgba(244, 206, 89, 0.2);
    width: 100%;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.send-button:hover {
    background: #ffffff;
    color: var(--color-primary);
    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(255, 255, 255, 0.2);
}
.send-button:active {
    transform: translateY(0);
}
/* ---------- RESPONSIVE MEDIA QUERIES ---------- */
@media (max-width: 1200px) {
    .feature-title {
        font-size: 46px;
    }
    .cards-container {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }
    .revenue-section {
        grid-template-columns: 1fr 1fr;
        gap: 36px;
    }
    .revenue-left {
        grid-column: span 2;
        text-align: center;
        padding-right: 0;
        margin-bottom: 16px;
    }
    .revenue-text {
        font-size: 34px;
    }
}
@media (max-width: 992px) {
    .feature-container {
        width: 100%;
        max-width: 100%;
        flex-direction: column;
        text-align: center;
        padding: 140px 6% 80px 6%;
        gap: 48px;
        border-radius: 0 0 100px 0;
    }
    .feature-left {
        max-width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .feature-right {
        margin-left: 0;
    }
    .feature-img-circle {
        width: 320px;
        height: 320px;
        margin-right: 0;
        margin-top: 0;
    }
    .about-us-section {
        flex-direction: column;
        padding: 80px 6%;
        gap: 48px;
        text-align: center;
    }
    .about-left {
        width: 100%;
    }
    .about-gradient-bg {
        height: 280px;
        max-width: 100%;
    }
    .mockup-image {
        width: 90%;
        max-height: 330px;
    }
    .about-right {
        width: 100%;
        padding: 0;
    }
    .about-title {
        text-align: center;
    }
    .about-subtitle {
        text-align: center;
    }
    .feature-list li {
        text-align: left;
    }
    .about-footer {
        border-left: none;
        border-top: 3px solid var(--color-primary);
        padding-left: 0;
        padding-top: 20px;
        font-style: normal;
        text-align: center;
    }
    .device-main-layout {
        flex-direction: column;
        gap: 48px;
    }
    .device-right-col {
        align-items: center;
        text-align: center;
    }
    .selected-device-image {
        max-width: 100%;
    }
    .contact-section {
        flex-direction: column;
        padding: 80px 6%;
        gap: 48px;
    }
    .contact-left {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    .contact-title {
        font-size: 36px;
    }
    .contact-right {
        width: 100%;
        justify-content: center;
    }
    .contact-right form {
        max-width: 100%;
    }
}
@media (max-width: 768px) {
    .feature-title {
        font-size: 38px;
    }
    .cards-container {
        grid-template-columns: 1fr;
        margin-top: -40px;
    }
    .revenue-section {
        grid-template-columns: 1fr;
        gap: 24px;
        margin: 80px auto;
    }
    .revenue-left {
        grid-column: span 1;
    }
    .revenue-right {
        min-height: auto;
        padding: 24px;
    }
    .device-circle {
        width: 320px;
        height: 320px;
    }
    .circle-gif {
        width: 160px;
        height: 160px;
    }
    .device-icon {
        width: 64px;
        height: 64px;
        padding: 10px;
    }
    /* Adjusted coordinates for 320px circle */
    .device-icon.img-ihealth-lite { top: 8px; left: 50px; }
    .device-icon.img-glucose { top: 8px; right: 50px; }
    .device-icon.img-21 { top: 128px; right: 4px; }
    .device-icon.img-1 { bottom: 8px; right: 50px; }
    .device-icon.img-pt3 { bottom: 8px; left: 50px; }
    .device-icon.img-wave { top: 128px; left: 4px; }
}
@media (max-width: 480px) {
    .feature-title {
        font-size: 32px;
    }
    .feature-content {
        font-size: 15px;
    }
    .feature-img-circle {
        width: 240px;
        height: 240px;
    }
    .device-circle {
        width: 280px;
        height: 280px;
    }
    .circle-gif {
        width: 130px;
        height: 130px;
    }
    .device-icon {
        width: 56px;
        height: 56px;
        padding: 8px;
    }
    /* Adjusted coordinates for 280px circle */
    .device-icon.img-ihealth-lite { top: 6px; left: 40px; }
    .device-icon.img-glucose { top: 6px; right: 40px; }
    .device-icon.img-21 { top: 112px; right: 0px; }
    .device-icon.img-1 { bottom: 6px; right: 40px; }
    .device-icon.img-pt3 { bottom: 6px; left: 40px; }
    .device-icon.img-wave { top: 112px; left: 0px; }
}:root {
  --color-primary: #27235e;
  --color-accent: #f6fbfe;
  --color-muted: #fafafa;
  --primary-color: #27235e;
  --body-background: #f6fbfe;
  --dark-text-font-color: #494949;
  --input-field-background: #eef2f6;
  --medium-font-size: 14px;
}
.main-page {
	margin-top: 80px;
	margin-left: 80px;
	margin-bottom: 80px;
	margin-right: 80px;
}
.main-title {
	font-family: $landing-page-font;
	font-style: normal;
	font-weight: bold;
	font-size: 38px;
	color: #5c5c5c;
	margin-bottom: 20px;
}
.main-content {
	font-family: $landing-page-font;
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	color: #5c5c5c;
	margin-top: 10px;
	margin-bottom: 60px;
}
.policy-content {
	font-family: $landing-page-font;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	color: #5c5c5c;
}
.policy-heading {
	font-family: $landing-page-font;
	font-style: normal;
	font-weight: bold;
	font-size: 16px;
	color: #5c5c5c;
	margin-top: 10px;
	margin-bottom: 10px;
}
.list-title {
	font-family: $landing-page-font;
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
}
.list-content {
	font-family: $landing-page-font;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	color: #5c5c5c;
	margin-top: 5px;
	margin-bottom: 5px;
}
.box {
  display: flex;
  align-items: center;
  justify-content: center;
}

.box mat-card {
  width: 40%;
  height: 10%;
  text-align: center;
}
.box {
  display: flex;
  align-items: center;
  justify-content: center;
}

.box mat-card {
  width: 40%;
  height: 10%;
  text-align: center;
}
/* clinic-dashboard.css */

/* Fade-in animation for dashboard container */
@keyframes dashboardFadeIn {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.dashboard-container {
  animation: dashboardFadeIn 0.5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  /* background: linear-gradient(135deg, #f8fafc 0%, #eff6ff 100%) !important; */
  min-height: 100vh;
}

/* Glassmorphic KPI Cards */
.kpi-card {
  background: rgba(255, 255, 255, 0.7) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border: 1px solid rgba(255, 255, 255, 0.6) !important;
  box-shadow: 0 8px 32px rgba(14, 12, 49, 0.04) !important;
  border-radius: 16px !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  position: relative;
  min-width: 250px;
  overflow: hidden;
}

.kpi-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: transparent;
  transition: background 0.3s ease;
}

.kpi-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(14, 12, 49, 0.08) !important;
  background: rgba(255, 255, 255, 0.85) !important;
}

.kpi-card:hover::before {
  background: linear-gradient(90deg, #ffbc34, #27235e);
}

/* Premium KPI Value Styles */
.kpi-value {
  background: linear-gradient(135deg, #ffbc34 0%, #d97706 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 500 !important;
}

/* Sidebar Styling */
.sidebar-panel {
  /* background: rgba(255, 255, 255, 0.75) !important; */
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  border-left: 1px solid rgba(226, 232, 240, 0.8) !important;
  box-shadow: -10px 0 30px rgba(14, 12, 49, 0.02) !important;
  transition: all 0.3s ease;
}

/* Gold gilded Avatar Border */
.avatar-frame {
  border: 3.5px solid #ffbc34 !important;
  box-shadow: 0 0 15px rgba(255, 188, 52, 0.25);
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.avatar-frame:hover {
  transform: rotate(5deg) scale(1.08);
  box-shadow: 0 0 22px rgba(255, 188, 52, 0.45);
}

/* List scrollbar customization */
.alerts-list {
  scrollbar-width: thin;
  scrollbar-color: rgba(39, 35, 94, 0.2) transparent;
}

.alerts-list::-webkit-scrollbar {
  width: 5px;
}

.alerts-list::-webkit-scrollbar-track {
  background: transparent;
}

.alerts-list::-webkit-scrollbar-thumb {
  background: rgba(39, 35, 94, 0.2);
  border-radius: 4px;
}

.alerts-list::-webkit-scrollbar-thumb:hover {
  background: rgba(39, 35, 94, 0.4);
}

/* Premium alert cards inside sidebar */
.alert-item-card {
  border-left: 3px solid #ffbc34 !important;
  background: #f8fafc !important;
  border-radius: 10px !important;
  transition: all 0.2s ease;
}

.alert-item-card:hover {
  background: #f1f5f9 !important;
  transform: translateX(4px);
}

/* Pulsing red/gold badge effect for active notifications */
@keyframes badgePulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 188, 52, 0.7);
  }
  70% {
    box-shadow: 0 0 0 8px rgba(255, 188, 52, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 188, 52, 0);
  }
}

.pulse-badge {
  animation: badgePulse 2s infinite;
  border-radius: 50%;
}
.mat-row:hover {
	cursor: pointer;
}

.hide-pagination-element {
	display: none;
}
.hide-pagination-element {
  display: none;
}

/* Chat container and layout */
.chat-container-left {
  align-self: flex-start;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  margin-bottom: 24px;
}

.chat-container-right {
  align-self: flex-end;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  width: 100%;
  margin-bottom: 24px;
}

.chat-header-row {
  display: flex;
  justify-content: space-between;
  width: 80%; /* Match bubble max-width */
  margin-bottom: 6px;
  padding: 0 4px;
}

.chat-sender-me {
  font-weight: 600;
  color: #1b00a5;
  font-size: 0.7rem;
}

.chat-sender-other {
  font-weight: 600;
  color: #777777;
  font-size: 0.7rem;
}

.chat-date {
  color: #777777;
  font-size: 0.7rem;
}

.chat-bubble-me {
  position: relative;
  background-color: #0c092a;
  color: #ffffff;
  padding: 12px 18px;
  border-radius: 8px;
  border-top-left-radius: 0;
  font-size: 0.95rem;
  min-width: 80%;
  word-break: break-word;
  box-shadow: 0 4px 10px rgba(0,0,0,0.06);
  font-weight: 500;
  letter-spacing: 0.2px;
}

.chat-bubble-me::before {
  content: '';
  position: absolute;
  top: -8px;
  left: 0px;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-bottom: 8px solid #0c092a;
}

.chat-bubble-other {
  position: relative;
  background-color: #fdbd15;
  color: #fff;
  padding: 6px 12px;
  border-radius: 8px;
  border-top-left-radius: 0;
  font-size: 0.95rem;
  min-width: 80%;
  word-break: break-word;
  box-shadow: 0 4px 10px rgba(0,0,0,0.06);
  font-weight: 500;
}

.chat-bubble-other::before {
  content: '';
  position: absolute;
  top: -8px;
  left: 0px;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-bottom: 8px solid #fdbd15;
}
.user-message {
	text-align: center;
	margin: auto;
	width: 50%;
	padding-top: 300px;
	font-size: 25px;
	font-weight: bold;
}
.user-message {
	text-align: center;
	margin: auto;
	width: 50%;
	padding-top: 300px;
	font-size: 25px;
	font-weight: bold;
}
:root {
  --color-primary: #27235e;
  --color-accent: #f6fbfe;
  --color-muted: #fafafa;
  --primary-color: #27235e;
  --body-background: #f6fbfe;
  --dark-text-font-color: #494949;
  --input-field-background: #eef2f6;
  --medium-font-size: 14px;
}

.profile-settings,
.profile-image-settings {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: wrap;
  div {
    flex: 1;
    margin: 0px 5px;
    background-color: #ffffff;
    flex-wrap: wrap;
    flex-direction: column;
    position: relative;
  }
}

.rpm-spacer {
  flex: 1 1 auto;
}

form > div.button-container {
  margin: 0px 10px;
  position: absolute;
  right: 20px;
}

.app-drawer-container {
  flex: 1;
}

.app-content {
  display: flex;
  flex: 1;
  flex-direction: column;
}
:root {
  --color-primary: #27235e;
  --color-accent: #f6fbfe;
  --color-muted: #fafafa;
  --primary-color: #27235e;
  --body-background: #f6fbfe;
  --dark-text-font-color: #494949;
  --input-field-background: #eef2f6;
  --medium-font-size: 14px;
}

a {
	text-transform: capitalize;
	text-decoration: none;
	font-weight: normal;
	color: $primary-color;
}

.hide-pagination-element {
	display: none!important;
}

@-webkit-keyframes fa-spin {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(359deg);
		transform: rotate(359deg);
	}
}

@keyframes fa-spin {
	0% {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(359deg);
		transform: rotate(359deg);
	}
}

.mat-icon.spin {
	-webkit-animation: fa-spin 2s infinite linear;
	animation: fa-spin 2s infinite linear;
}

.show-user-status {
	display: none;
}
/* add-patient.css */

/* Dialog container max height and rounded corners */
body .add-patient-paper {
    max-height: 90vh;
    border-radius: 12px !important;
}

/* Dialog close button positioning */
body .add-patient-paper .branch-close-btn {
    position: absolute !important;
    right: 16px;
    top: 16px;
    color: #999;
}

/* Dialog content padding consistency */
body .add-patient-paper .MuiDialogContent-root {
    padding-top: 24px !important;
}

/* Form field spacing tweaks */
body .add-patient-paper .MuiGrid-item {
    margin-bottom: 4px;
}

/* Navigation buttons container spacing */
body .add-patient-paper .dialog-actions-box {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
}

/* Stepper Layout and Alignment */
body .add-patient-paper .MuiStepper-root {
    width: calc(100% + 48px) !important;
    margin-left: -24px !important;
    margin-right: -24px !important;
    margin-top: -24px !important;
    padding: 16px 24px !important;
    background-color: #ffffff !important;
    border-bottom: 1px solid #cbd5e1 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 24px !important;
}

body .add-patient-paper .MuiStep-root {
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
}

body .add-patient-paper .MuiStepLabel-root {
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
}

body .add-patient-paper .MuiStepLabel-iconContainer {
    padding-right: 8px !important;
    display: flex !important;
    align-items: center !important;
}

body .add-patient-paper .MuiStepLabel-labelContainer {
    display: flex !important;
    align-items: center !important;
}

/* Stepper Active/Completed Circles */
body .add-patient-paper .MuiStepIcon-root.Mui-active,
body .add-patient-paper .MuiStepIcon-root.Mui-completed {
    color: #0e0c31 !important;
}

/* Stepper Inactive Circles */
body .add-patient-paper .MuiStepIcon-root:not(.Mui-active):not(.Mui-completed) {
    color: #cbd5e1 !important;
}

/* Stepper Active Step Label Text */
body .add-patient-paper .MuiStepLabel-label.Mui-active {
    color: #0e0c31 !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    line-height: 1 !important;
}

/* Stepper Inactive Step Label Text */
body .add-patient-paper .MuiStepLabel-label:not(.Mui-active) {
    color: #64748b !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 1 !important;
}

/* Stepper Connector Lines */
body .add-patient-paper .MuiStepConnector-root {
    position: relative !important;
    flex: 1 1 auto !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 16px !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
}

body .add-patient-paper .MuiStepConnector-line {
    border-top-width: 1px !important;
    border-color: #cbd5e1 !important;
    width: 100% !important;
    align-self: center !important;
}

/* Autocomplete chip styling */
body .add-patient-paper .MuiChip-root {
    background-color: #e0e0e0;
}

/* Dialog Outlined Inputs */
body .add-patient-paper .MuiAutocomplete-root,
body .add-patient-paper .MuiFormControl-root,
body .add-patient-paper .MuiTextField-root,
body .add-patient-paper .MuiAutocomplete-root .MuiOutlinedInput-root {
    width: 100% !important;
    min-width: 300px !important;
}

/* Validation error outline thickness and color override */
body .add-patient-paper .MuiOutlinedInput-root.Mui-error .MuiOutlinedInput-notchedOutline {
    border-color: #ff3b30 !important;
    border-width: 1.5px !important;
}

/* Validation error label color */
body .add-patient-paper .MuiInputLabel-root.Mui-error {
    color: #ff3b30 !important;
}

/* Error helper text styling */
body .add-patient-paper .MuiFormHelperText-root.Mui-error {
    color: #ff3b30 !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    margin-top: 3px !important;
    margin-left: 4px !important;
}

/* Optional field helper text */
body .add-patient-paper .MuiFormHelperText-root:not(.Mui-error) {
    color: #8e8e93 !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    margin-top: 3px !important;
    margin-left: 4px !important;
}

/* Red asterisk */
body .add-patient-paper .MuiInputLabel-asterisk,
body .add-patient-paper .MuiFormLabel-asterisk {
    color: #ff3b30 !important;
}

/* Responsive adjustments */
@media (max-width: 600px) {
    body .add-patient-paper {
        margin: 16px;
    }
    body .add-patient-paper .branch-close-btn {
        right: 8px;
        top: 8px;
    }
}

/* Date input layout adjustments to prevent date format and icon overlap */
body .add-patient-paper input[type="date"]::-webkit-datetime-edit,
body .add-patient-paper input[type="date"]::-webkit-datetime-edit-fields-wrapper {
    padding: 0 !important;
}

/* Force single-select Autocomplete fields to align in height with text fields */
.MuiDialog-root .patient-form-autocomplete:not(.MuiAutocomplete-multiple) .MuiInputBase-root.MuiOutlinedInput-root {
    height: 45px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.MuiDialog-root .patient-form-autocomplete:not(.MuiAutocomplete-multiple) .MuiInputBase-root.MuiOutlinedInput-root .MuiAutocomplete-input {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 100% !important;
}/* edit-patient.css */

body .edit-patient-paper .mat-form-field.diease-chip-list {
    width: 84%;
    margin: 0px 20px;
}

/* Dialog container max height and rounded corners */
body .edit-patient-paper {
    max-height: 90vh;
    border-radius: 12px !important;
}

/* Dialog close button positioning */
body .edit-patient-paper .branch-close-btn {
    position: absolute !important;
    right: 16px;
    top: 16px;
    color: #999;
}

/* Dialog content padding consistency */
body .edit-patient-paper .MuiDialogContent-root {
    padding-top: 24px !important;
}

/* Form field spacing tweaks */
body .edit-patient-paper .MuiGrid-item {
    margin-bottom: 4px;
}

/* Navigation buttons container spacing */
body .edit-patient-paper .dialog-actions-box {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
}

/* Stepper Layout and Alignment */
body .edit-patient-paper .MuiStepper-root {
    width: calc(100% + 48px) !important;
    margin-left: -24px !important;
    margin-right: -24px !important;
    margin-top: -24px !important;
    padding: 16px 24px !important;
    background-color: #ffffff !important;
    border-bottom: 1px solid #cbd5e1 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    margin-bottom: 24px !important;
}

body .edit-patient-paper .MuiStep-root {
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
}

body .edit-patient-paper .MuiStepLabel-root {
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
}

body .edit-patient-paper .MuiStepLabel-iconContainer {
    padding-right: 8px !important;
    display: flex !important;
    align-items: center !important;
}

body .edit-patient-paper .MuiStepLabel-labelContainer {
    display: flex !important;
    align-items: center !important;
}

/* Stepper Active/Completed Circles */
body .edit-patient-paper .MuiStepIcon-root.Mui-active,
body .edit-patient-paper .MuiStepIcon-root.Mui-completed {
    color: #0e0c31 !important;
}

/* Stepper Inactive Circles */
body .edit-patient-paper .MuiStepIcon-root:not(.Mui-active):not(.Mui-completed) {
    color: #cbd5e1 !important;
}

/* Stepper Active Step Label Text */
body .edit-patient-paper .MuiStepLabel-label.Mui-active {
    color: #0e0c31 !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    line-height: 1 !important;
}

/* Stepper Inactive Step Label Text */
body .edit-patient-paper .MuiStepLabel-label:not(.Mui-active) {
    color: #64748b !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 1 !important;
}

/* Stepper Connector Lines */
body .edit-patient-paper .MuiStepConnector-root {
    position: relative !important;
    flex: 1 1 auto !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 16px !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
}

body .edit-patient-paper .MuiStepConnector-line {
    border-top-width: 1px !important;
    border-color: #cbd5e1 !important;
    width: 100% !important;
    align-self: center !important;
}

/* Autocomplete chip styling */
body .edit-patient-paper .MuiChip-root {
    background-color: #e0e0e0;
}

/* Dialog Outlined Inputs */
body .edit-patient-paper .MuiAutocomplete-root,
body .edit-patient-paper .MuiFormControl-root,
body .edit-patient-paper .MuiTextField-root,
body .edit-patient-paper .MuiAutocomplete-root .MuiOutlinedInput-root {
    width: 100% !important;
    min-width: 300px !important;
}

/* Validation error outline thickness and color override */
body .edit-patient-paper .MuiOutlinedInput-root.Mui-error .MuiOutlinedInput-notchedOutline {
    border-color: #ff3b30 !important;
    border-width: 1.5px !important;
}

/* Validation error label color */
body .edit-patient-paper .MuiInputLabel-root.Mui-error {
    color: #ff3b30 !important;
}

/* Error helper text styling */
body .edit-patient-paper .MuiFormHelperText-root.Mui-error {
    color: #ff3b30 !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    margin-top: 3px !important;
    margin-left: 4px !important;
}

/* Optional field helper text */
body .edit-patient-paper .MuiFormHelperText-root:not(.Mui-error) {
    color: #8e8e93 !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    margin-top: 3px !important;
    margin-left: 4px !important;
}

/* Red asterisk */
body .edit-patient-paper .MuiInputLabel-asterisk,
body .edit-patient-paper .MuiFormLabel-asterisk {
    color: #ff3b30 !important;
}

/* Responsive adjustments */
@media (max-width: 600px) {
    body .edit-patient-paper {
        margin: 16px;
    }
    body .edit-patient-paper .branch-close-btn {
        right: 8px;
        top: 8px;
    }
}

/* Date input layout adjustments to prevent date format and icon overlap */
body .edit-patient-paper input[type="date"]::-webkit-datetime-edit,
body .edit-patient-paper input[type="date"]::-webkit-datetime-edit-fields-wrapper {
    padding: 0 !important;
}

/* Force single-select Autocomplete fields to align in height with text fields */
.MuiDialog-root .patient-form-autocomplete:not(.MuiAutocomplete-multiple) .MuiInputBase-root.MuiOutlinedInput-root {
    height: 45px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.MuiDialog-root .patient-form-autocomplete:not(.MuiAutocomplete-multiple) .MuiInputBase-root.MuiOutlinedInput-root .MuiAutocomplete-input {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 100% !important;
}
.hide-pagination-element {
	display: none;
}



:root {
  --color-primary: #27235e;
  --color-accent: #f6fbfe;
  --color-muted: #fafafa;
  --primary-color: #27235e;
  --body-background: #f6fbfe;
  --dark-text-font-color: #494949;
  --input-field-background: #eef2f6;
  --medium-font-size: 14px;
}
/* Removed invalid import */
.label-text {
	padding-left: 8px;
}
.card-style {
	padding: 10px 30px 10px 30px;
	background-color: #ffffff;
	margin: 10px;
	justify-content: space-between;
	display: flex;
	align-items: center;
}
.report-radio-btn {
	padding: 5px;
	background: rgba(33, 150, 243, 0.05);
}
.report-label {
	display: flex;
	align-items: center;
}
::ng-deep .mat-checkbox .mat-checkbox-frame {
	border-color: $primary-color;
}
.div-report-btn {
	margin-top: 1rem;
	margin-left: 2rem;
	margin-right: 1rem;
}
::ng-deep .mat-checkbox-checked .mat-checkbox-background,
.mat-checkbox-indeterminate .mat-checkbox-background {
	background-color: $primary-color !important;
}
::ng-deep .mat-checkbox:not(.mat-checkbox-disabled) .mat-checkbox-ripple .mat-ripple-element {
	background-color: $primary-color !important;
}
.checkbox-title {
	float: right;
}
.rs-picker-menu,
.rs-picker-daterange-menu {
	z-index: 9999 !important;
}
a {
  text-transform: capitalize;
  text-decoration: dotted;
}
.hide-pagination-element {
  display: none;
}
*[class*=rs-],*[class*=rs-]::before, *[class*=rs-]::after{
  box-sizing:border-box;
}
:root{
  --rs-gray-0:#fff;
  --rs-gray-50:#f7f7fa;
  --rs-gray-100:#f2f2f5;
  --rs-gray-200:#e5e5ea;
  --rs-gray-300:#d9d9d9;
  --rs-gray-400:#b6b7b8;
  --rs-gray-500:#939393;
  --rs-gray-600:#717273;
  --rs-gray-700:#575757;
  --rs-gray-800:#343434;
  --rs-gray-900:#121212;
  --rs-primary-50:#F2FAFF;
  --rs-primary-100:#CCE9FF;
  --rs-primary-200:#A6D7FF;
  --rs-primary-300:#80C3FF;
  --rs-primary-400:#59AFFF;
  --rs-primary-500:#3498ff;
  --rs-primary-600:#2589F5;
  --rs-primary-700:#1675E0;
  --rs-primary-800:#0A5DC2;
  --rs-primary-900:#004299;
  --rs-color-red:#f44336;
  --rs-red-200:#FAA9A7;
  --rs-red-300:#FA8682;
  --rs-red-400:#F7635C;
  --rs-red-500:#F44336;
  --rs-red-600:#EB3626;
  --rs-red-700:#D62915;
  --rs-red-800:#B81C07;
  --rs-red-900:#8F1300;
  --rs-orange-200:#FCC690;
  --rs-orange-300:#FCB160;
  --rs-orange-400:#FA9B2F;
  --rs-orange-500:#FA8900;
  --rs-orange-600:#F08800;
  --rs-orange-700:#DB8000;
  --rs-orange-800:#BD7100;
  --rs-orange-900:#945B00;
  --rs-yellow-200:#FFD991;
  --rs-yellow-300:#FFCA61;
  --rs-yellow-400:#FFBE30;
  --rs-yellow-500:#FFB300;
  --rs-yellow-600:#F5AF00;
  --rs-yellow-700:#E0A500;
  --rs-yellow-800:#C29100;
  --rs-yellow-900:#997500;
  --rs-green-200:#A5E0A4;
  --rs-green-300:#82CF82;
  --rs-green-400:#65BF67;
  --rs-green-500:#4CAF50;
  --rs-green-600:#37AB3C;
  --rs-green-700:#22A12A;
  --rs-green-800:#0F9119;
  --rs-green-900:#007D0C;
  --rs-cyan-200:#87E6ED;
  --rs-cyan-300:#57DAE6;
  --rs-cyan-400:#2ACADB;
  --rs-cyan-500:#00BCD4;
  --rs-cyan-600:#00B1CC;
  --rs-cyan-700:#00A0BD;
  --rs-cyan-800:#008AA6;
  --rs-cyan-900:#006E87;
  --rs-blue-200:#9BD4FA;
  --rs-blue-300:#72C0F7;
  --rs-blue-400:#49ABF5;
  --rs-blue-500:#2196F3;
  --rs-blue-600:#1787E8;
  --rs-blue-700:#0D73D4;
  --rs-blue-800:#045CB5;
  --rs-blue-900:#00448C;
  --rs-violet-200:#B6A1E3;
  --rs-violet-300:#987BD4;
  --rs-violet-400:#805AC7;
  --rs-violet-500:#673AB7;
  --rs-violet-600:#5F2BB3;
  --rs-violet-700:#531BA8;
  --rs-violet-800:#470C99;
  --rs-violet-900:#390085;
  --rs-state-error:var(--rs-color-red);
  --rs-text-primary:var(--rs-gray-800);
  --rs-text-secondary:var(--rs-gray-600);
  --rs-text-inverse:var(--rs-gray-50);
  --rs-text-active:var(--rs-primary-700);
  --rs-text-disabled:var(--rs-gray-600);
  --rs-text-error:var(--rs-color-red);
  --rs-text-highlight-bg:#fff6c9;
  --rs-border-primary:var(--rs-gray-200);
  --rs-border-secondary:var(--rs-gray-100);
  --rs-bg-overlay:var(--rs-gray-0);
  --rs-bg-well:var(--rs-gray-50);
  --rs-bg-active:var(--rs-primary-500);
  --rs-state-hover-bg:var(--rs-primary-50);
  --rs-focus-ring-color:rgb(from var(--rs-primary-500) r g b / 25%);
  --rs-state-error-outline:2px solid rgb(from var(--rs-color-red) r g b / 25%);
  --rs-btn-default-bg:var(--rs-gray-50);
  --rs-btn-default-text:var(--rs-gray-800);
  --rs-btn-default-border-color:var(--rs-gray-200);
  --rs-btn-default-hover-bg:var(--rs-gray-200);
  --rs-btn-default-active-bg:var(--rs-gray-300);
  --rs-btn-default-active-text:var(--rs-gray-900);
  --rs-btn-default-disabled-bg:var(--rs-gray-50);
  --rs-btn-default-disabled-text:var(--rs-gray-600);
  --rs-btn-primary-bg:var(--rs-primary-500);
  --rs-btn-primary-text:var(--rs-gray-0);
  --rs-btn-primary-border-color:var(--rs-primary-600);
  --rs-btn-primary-hover-bg:var(--rs-primary-600);
  --rs-btn-primary-active-bg:var(--rs-primary-700);
  --rs-btn-subtle-text:var(--rs-gray-800);
  --rs-btn-subtle-hover-bg:var(--rs-gray-200);
  --rs-btn-subtle-hover-text:var(--rs-gray-800);
  --rs-btn-subtle-active-bg:var(--rs-gray-200);
  --rs-btn-subtle-active-text:var(--rs-gray-900);
  --rs-btn-subtle-disabled-text:var(--rs-gray-400);
  --rs-btn-ghost-border:var(--rs-primary-700);
  --rs-btn-ghost-text:var(--rs-primary-700);
  --rs-btn-ghost-hover-border:var(--rs-primary-800);
  --rs-btn-ghost-hover-text:var(--rs-primary-800);
  --rs-btn-ghost-active-border:var(--rs-primary-900);
  --rs-btn-ghost-active-text:var(--rs-primary-900);
  --rs-btn-link-text:var(--rs-primary-700);
  --rs-btn-link-hover-text:var(--rs-primary-800);
  --rs-btn-link-active-text:var(--rs-primary-900);
  --rs-iconbtn-addon:var(--rs-gray-100);
  --rs-iconbtn-activated-addon:var(--rs-gray-300);
  --rs-iconbtn-pressed-addon:var(--rs-gray-400);
  --rs-iconbtn-primary-addon:var(--rs-primary-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-primary-700);
  --rs-iconbtn-primary-pressed-addon:var(--rs-primary-800);
  --rs-divider-border:var(--rs-gray-200);
  --rs-loader-ring:rgb(from var(--rs-gray-50) r g b / 80%);
  --rs-loader-rotor:var(--rs-gray-500);
  --rs-loader-backdrop:rgb(from var(--rs-gray-0) r g b / 90%);
  --rs-loader-ring-inverse:rgb(from var(--rs-gray-50) r g b / 30%);
  --rs-loader-rotor-inverse:var(--rs-gray-0);
  --rs-loader-backdrop-inverse:rgb(from var(--rs-gray-900) r g b / 83%);
  --rs-input-bg:var(--rs-gray-0);
  --rs-input-focus-border:var(--rs-primary-500);
  --rs-input-disabled-bg:var(--rs-gray-50);
  --rs-listbox-option-group-bg:var(--rs-gray-0);
  --rs-listbox-option-hover-bg:rgb(from var(--rs-primary-100) r g b / 50%);
  --rs-listbox-option-hover-text:var(--rs-primary-700);
  --rs-picker-value:var(--rs-primary-700);
  --rs-picker-count-bg:var(--rs-primary-500);
  --rs-picker-count-text:#fff;
  --rs-picker-state-error:var(--rs-state-error);
  --rs-picker-state-error-outline:var(--rs-state-error-outline);
  --rs-calendar-today-bg:var(--rs-primary-500);
  --rs-calendar-today-text:#fff;
  --rs-calendar-range-bg:rgb(from var(--rs-primary-100) r g b / 50%);
  --rs-calendar-time-unit-bg:var(--rs-gray-50);
  --rs-calendar-date-selected-text:#fff;
  --rs-calendar-cell-selected-hover-bg:var(--rs-primary-700);
}
@supports not (color: rgb(from white r g b)){
  :root{
    --rs-focus-ring-color:rgba(52, 152, 255, 0.25);
    --rs-loader-ring:rgba(247, 247, 250, 0.8);
    --rs-loader-backdrop:rgba(255, 255, 255, 0.9);
    --rs-loader-ring-inverse:rgba(247, 247, 250, 0.3);
    --rs-loader-backdrop-inverse:rgba(18, 18, 18, 0.83);
    --rs-listbox-option-hover-bg:rgba(#CCE9FF, 0.5);
    --rs-calendar-range-bg:rgba(#CCE9FF, 0.5);
  }
}

[data-theme=dark],
.rs-theme-dark{
  --rs-gray-0:#fff;
  --rs-gray-50:#e9ebf0;
  --rs-gray-100:#cbced4;
  --rs-gray-200:#a4a9b3;
  --rs-gray-300:#858b94;
  --rs-gray-400:#6a6f76;
  --rs-gray-500:#5c6066;
  --rs-gray-600:#3c3f43;
  --rs-gray-700:#292d33;
  --rs-gray-800:#1a1d24;
  --rs-gray-900:#0f131a;
  --rs-primary-50:#F2FCFF;
  --rs-primary-100:#CCF3FF;
  --rs-primary-200:#A6E9FF;
  --rs-primary-300:#80DDFF;
  --rs-primary-400:#59D0FF;
  --rs-primary-500:#34c3ff;
  --rs-primary-600:#25B3F5;
  --rs-primary-700:#169DE0;
  --rs-primary-800:#0A81C2;
  --rs-primary-900:#006199;
  --rs-color-red:#f04f43;
  --rs-red-200:#FAA9A7;
  --rs-red-300:#F58884;
  --rs-red-400:#F26A63;
  --rs-red-500:#F04F43;
  --rs-red-600:#E63F30;
  --rs-red-700:#D12F1D;
  --rs-red-800:#B3200C;
  --rs-red-900:#8A1200;
  --rs-orange-200:#FFCE91;
  --rs-orange-300:#FFBA61;
  --rs-orange-400:#FFA930;
  --rs-orange-500:#FF9800;
  --rs-orange-600:#F59700;
  --rs-orange-700:#E08E00;
  --rs-orange-800:#C27E00;
  --rs-orange-900:#996600;
  --rs-yellow-200:#FFE2B3;
  --rs-yellow-300:#FFD894;
  --rs-yellow-400:#FFCF75;
  --rs-yellow-500:#FFC757;
  --rs-yellow-600:#F5BB3D;
  --rs-yellow-700:#E0A824;
  --rs-yellow-800:#C28F0E;
  --rs-yellow-900:#997000;
  --rs-green-200:#AEE0AD;
  --rs-green-300:#8CCF8C;
  --rs-green-400:#71BF72;
  --rs-green-500:#58B15B;
  --rs-green-600:#3FAB45;
  --rs-green-700:#27A12F;
  --rs-green-800:#10911B;
  --rs-green-900:#007D0C;
  --rs-cyan-200:#87E6ED;
  --rs-cyan-300:#57DAE6;
  --rs-cyan-400:#2ACADB;
  --rs-cyan-500:#00BCD4;
  --rs-cyan-600:#00B1CC;
  --rs-cyan-700:#00A0BD;
  --rs-cyan-800:#008AA6;
  --rs-cyan-900:#006E87;
  --rs-blue-200:#93D6FA;
  --rs-blue-300:#67C1F5;
  --rs-blue-400:#3DADF2;
  --rs-blue-500:#1499EF;
  --rs-blue-600:#0E8CE6;
  --rs-blue-700:#087AD1;
  --rs-blue-800:#0464B3;
  --rs-blue-900:#00498A;
  --rs-violet-200:#B6A1E3;
  --rs-violet-300:#987BD4;
  --rs-violet-400:#805AC7;
  --rs-violet-500:#673AB7;
  --rs-violet-600:#5F2BB3;
  --rs-violet-700:#531BA8;
  --rs-violet-800:#470C99;
  --rs-violet-900:#390085;
  --rs-state-error:var(--rs-color-red);
  --rs-text-primary:var(--rs-gray-50);
  --rs-text-secondary:var(--rs-gray-200);
  --rs-text-inverse:var(--rs-gray-800);
  --rs-text-active:var(--rs-primary-500);
  --rs-text-disabled:var(--rs-gray-400);
  --rs-border-primary:var(--rs-gray-600);
  --rs-border-secondary:var(--rs-gray-700);
  --rs-bg-overlay:var(--rs-gray-700);
  --rs-bg-well:var(--rs-gray-900);
  --rs-bg-active:var(--rs-primary-700);
  --rs-state-hover-bg:var(--rs-gray-600);
  --rs-state-error-outline:2px solid rgb(from var(--rs-color-red) r g b / 25%);
  --rs-btn-default-bg:var(--rs-gray-600);
  --rs-btn-default-text:var(--rs-gray-50);
  --rs-btn-default-border-color:var(--rs-gray-700);
  --rs-btn-default-hover-bg:var(--rs-gray-500);
  --rs-btn-default-active-bg:var(--rs-gray-300);
  --rs-btn-default-active-text:var(--rs-gray-0);
  --rs-btn-default-disabled-bg:var(--rs-gray-600);
  --rs-btn-default-disabled-text:var(--rs-gray-400);
  --rs-btn-primary-bg:var(--rs-primary-700);
  --rs-btn-primary-text:var(--rs-gray-0);
  --rs-btn-primary-border-color:var(--rs-primary-800);
  --rs-btn-primary-hover-bg:var(--rs-primary-600);
  --rs-btn-primary-active-bg:var(--rs-primary-400);
  --rs-btn-subtle-text:var(--rs-gray-200);
  --rs-btn-subtle-hover-bg:var(--rs-gray-500);
  --rs-btn-subtle-hover-text:var(--rs-gray-50);
  --rs-btn-subtle-active-bg:var(--rs-gray-400);
  --rs-btn-subtle-active-text:var(--rs-gray-0);
  --rs-btn-subtle-disabled-text:var(--rs-gray-500);
  --rs-btn-ghost-border:var(--rs-primary-500);
  --rs-btn-ghost-text:var(--rs-primary-500);
  --rs-btn-ghost-hover-border:var(--rs-primary-400);
  --rs-btn-ghost-hover-text:var(--rs-primary-400);
  --rs-btn-ghost-active-border:var(--rs-primary-200);
  --rs-btn-ghost-active-text:var(--rs-primary-200);
  --rs-btn-link-text:var(--rs-primary-500);
  --rs-btn-link-hover-text:var(--rs-primary-400);
  --rs-btn-link-active-text:var(--rs-primary-200);
  --rs-iconbtn-addon:var(--rs-gray-500);
  --rs-iconbtn-activated-addon:var(--rs-gray-400);
  --rs-iconbtn-pressed-addon:var(--rs-gray-200);
  --rs-iconbtn-primary-addon:var(--rs-primary-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-primary-500);
  --rs-iconbtn-primary-pressed-addon:var(--rs-primary-400);
  --rs-divider-border:var(--rs-gray-600);
  --rs-loader-ring:rgb(from var(--rs-gray-50) r g b / 30%);
  --rs-loader-rotor:var(--rs-gray-0);
  --rs-loader-backdrop:rgb(from var(--rs-gray-900) r g b / 83%);
  --rs-loader-ring-inverse:rgb(from var(--rs-gray-50) r g b / 80%);
  --rs-loader-rotor-inverse:var(--rs-gray-500);
  --rs-loader-backdrop-inverse:rgb(from var(--rs-gray-0) r g b / 90%);
  --rs-input-bg:var(--rs-gray-800);
  --rs-input-focus-border:var(--rs-primary-500);
  --rs-input-disabled-bg:var(--rs-gray-700);
  --rs-listbox-option-group-bg:var(--rs-gray-700);
  --rs-listbox-option-hover-bg:var(--rs-gray-600);
  --rs-listbox-option-hover-text:currentColor;
  --rs-picker-value:var(--rs-primary-500);
  --rs-picker-count-bg:var(--rs-primary-700);
  --rs-picker-count-text:#fff;
  --rs-calendar-today-bg:var(--rs-primary-700);
  --rs-calendar-today-text:#fff;
  --rs-calendar-range-bg:rgb(from var(--rs-primary-900) r g b / 50%);
  --rs-calendar-time-unit-bg:var(--rs-gray-600);
  --rs-calendar-date-selected-text:#fff;
  --rs-calendar-cell-selected-hover-bg:var(--rs-primary-700);
}
@supports not (color: rgb(from white r g b)){
  [data-theme=dark],
  .rs-theme-dark{
    --rs-loader-ring:rgba(233, 235, 240, 0.3);
    --rs-loader-backdrop:rgba(15, 19, 26, 0.83);
    --rs-loader-ring-inverse:rgba(233, 235, 240, 0.8);
    --rs-loader-backdrop-inverse:rgba(255, 255, 255, 0.9);
    --rs-calendar-range-bg:rgba(#006199, 0.5);
  }
}

[data-theme=high-contrast],
.rs-theme-high-contrast{
  --rs-gray-0:#fff;
  --rs-gray-50:#e9ebf0;
  --rs-gray-100:#cbced4;
  --rs-gray-200:#a4a9b3;
  --rs-gray-300:#858b94;
  --rs-gray-400:#6a6f76;
  --rs-gray-500:#5c6066;
  --rs-gray-600:#3c3f43;
  --rs-gray-700:#292d33;
  --rs-gray-800:#1a1d24;
  --rs-gray-900:#0f131a;
  --rs-primary-50:#fffef2;
  --rs-primary-100:#fffbc2;
  --rs-primary-200:#fffa91;
  --rs-primary-300:#fffa61;
  --rs-primary-400:#fffc30;
  --rs-primary-500:#ffff00;
  --rs-primary-600:#f1f500;
  --rs-primary-700:#d9e000;
  --rs-primary-800:#b8c200;
  --rs-primary-900:#8f9900;
  --rs-color-red:#bd1732;
  --rs-red-200:#E591A3;
  --rs-red-300:#D6637A;
  --rs-red-400:#C93A55;
  --rs-red-500:#BD1732;
  --rs-red-600:#B51029;
  --rs-red-700:#A60A1F;
  --rs-red-800:#8F0414;
  --rs-red-900:#70000B;
  --rs-orange-200:#FFCE91;
  --rs-orange-300:#FFBA61;
  --rs-orange-400:#FFA930;
  --rs-orange-500:#FF9800;
  --rs-orange-600:#F59700;
  --rs-orange-700:#E08E00;
  --rs-orange-800:#C27E00;
  --rs-orange-900:#996600;
  --rs-yellow-200:#FFE2B3;
  --rs-yellow-300:#FFD894;
  --rs-yellow-400:#FFCF75;
  --rs-yellow-500:#FFC757;
  --rs-yellow-600:#F5BB3D;
  --rs-yellow-700:#E0A824;
  --rs-yellow-800:#C28F0E;
  --rs-yellow-900:#997000;
  --rs-green-200:#7CCC8E;
  --rs-green-300:#50B567;
  --rs-green-400:#2A9C46;
  --rs-green-500:#0D822C;
  --rs-green-600:#09802B;
  --rs-green-700:#057A28;
  --rs-green-800:#017325;
  --rs-green-900:#006923;
  --rs-cyan-200:#87E6ED;
  --rs-cyan-300:#57DAE6;
  --rs-cyan-400:#2ACADB;
  --rs-cyan-500:#00BCD4;
  --rs-cyan-600:#00B1CC;
  --rs-cyan-700:#00A0BD;
  --rs-cyan-800:#008AA6;
  --rs-cyan-900:#006E87;
  --rs-blue-200:#93D6FA;
  --rs-blue-300:#67C1F5;
  --rs-blue-400:#3DADF2;
  --rs-blue-500:#1499EF;
  --rs-blue-600:#0E8CE6;
  --rs-blue-700:#087AD1;
  --rs-blue-800:#0464B3;
  --rs-blue-900:#00498A;
  --rs-violet-200:#B6A1E3;
  --rs-violet-300:#987BD4;
  --rs-violet-400:#805AC7;
  --rs-violet-500:#673AB7;
  --rs-violet-600:#5F2BB3;
  --rs-violet-700:#531BA8;
  --rs-violet-800:#470C99;
  --rs-violet-900:#390085;
  --rs-state-error:var(--rs-color-red);
  --rs-text-primary:var(--rs-gray-50);
  --rs-text-secondary:var(--rs-gray-200);
  --rs-text-inverse:var(--rs-gray-800);
  --rs-text-active:var(--rs-primary-500);
  --rs-text-disabled:var(--rs-gray-400);
  --rs-text-highlight-bg:var(--rs-primary-500);
  --rs-border-primary:var(--rs-gray-100);
  --rs-border-secondary:var(--rs-gray-700);
  --rs-bg-overlay:var(--rs-gray-800);
  --rs-bg-well:var(--rs-gray-900);
  --rs-bg-active:var(--rs-primary-500);
  --rs-state-hover-bg:var(--rs-gray-600);
  --rs-focus-ring-color:var(--rs-gray-0);
  --rs-state-error-outline:2px solid rgb(from var(--rs-color-red) r g b / 25%);
  --rs-btn-default-bg:transparent;
  --rs-btn-default-text:var(--rs-primary-500);
  --rs-btn-default-border-color:var(--rs-primary-500);
  --rs-btn-default-hover-bg:transparent;
  --rs-btn-default-hover-text:var(--rs-primary-400);
  --rs-btn-default-active-bg:transparent;
  --rs-btn-default-active-text:var(--rs-primary-200);
  --rs-btn-default-disabled-bg:transparent;
  --rs-btn-default-disabled-text:var(--rs-primary-900);
  --rs-btn-default-disabled-border-color:var(--rs-gray-100);
  --rs-btn-primary-bg:var(--rs-primary-500);
  --rs-btn-primary-text:var(--rs-gray-900);
  --rs-btn-primary-hover-bg:var(--rs-primary-400);
  --rs-btn-primary-active-bg:var(--rs-primary-200);
  --rs-btn-subtle-text:var(--rs-primary-500);
  --rs-btn-subtle-hover-bg:transparent;
  --rs-btn-subtle-hover-text:var(--rs-primary-400);
  --rs-btn-subtle-active-bg:transparent;
  --rs-btn-subtle-active-text:var(--rs-primary-200);
  --rs-btn-subtle-disabled-text:var(--rs-gray-500);
  --rs-btn-ghost-border:var(--rs-primary-500);
  --rs-btn-ghost-text:var(--rs-primary-500);
  --rs-btn-ghost-hover-border:var(--rs-primary-400);
  --rs-btn-ghost-hover-text:var(--rs-primary-400);
  --rs-btn-ghost-active-border:var(--rs-primary-200);
  --rs-btn-ghost-active-text:var(--rs-primary-200);
  --rs-btn-link-text:var(--rs-primary-500);
  --rs-btn-link-hover-text:var(--rs-primary-400);
  --rs-btn-link-active-text:var(--rs-primary-200);
  --rs-iconbtn-addon:transparent;
  --rs-iconbtn-activated-addon:transparent;
  --rs-iconbtn-pressed-addon:transparent;
  --rs-iconbtn-primary-addon:var(--rs-primary-400);
  --rs-iconbtn-primary-activated-addon:var(--rs-primary-300);
  --rs-iconbtn-primary-pressed-addon:var(--rs-primary-100);
  --rs-divider-border:var(--rs-gray-600);
  --rs-loader-ring:rgb(from var(--rs-gray-50) r g b / 30%);
  --rs-loader-rotor:var(--rs-gray-0);
  --rs-loader-backdrop:rgb(from var(--rs-gray-900) r g b / 83%);
  --rs-loader-ring-inverse:rgb(from var(--rs-gray-50) r g b / 80%);
  --rs-loader-rotor-inverse:var(--rs-gray-500);
  --rs-loader-backdrop-inverse:rgb(from var(--rs-gray-0) r g b / 90%);
  --rs-input-bg:var(--rs-gray-800);
  --rs-input-focus-border:var(--rs-primary-500);
  --rs-input-disabled-bg:var(--rs-gray-700);
  --rs-listbox-option-group-bg:var(--rs-gray-800);
  --rs-listbox-option-hover-bg:transparent;
  --rs-listbox-option-hover-text:var(--rs-primary-500);
  --rs-picker-value:var(--rs-primary-500);
  --rs-picker-count-bg:var(--rs-primary-500);
  --rs-picker-count-text:var(--rs-gray-900);
  --rs-calendar-today-bg:var(--rs-primary-500);
  --rs-calendar-today-text:var(--rs-gray-900);
  --rs-calendar-range-bg:rgb(from var(--rs-primary-900) r g b / 50%);
  --rs-calendar-time-unit-bg:var(--rs-gray-900);
  --rs-calendar-date-selected-text:var(--rs-gray-900);
  --rs-calendar-cell-selected-hover-bg:var(--rs-gray-50);
}
@supports not (color: rgb(from white r g b)){
  [data-theme=high-contrast],
  .rs-theme-high-contrast{
    --rs-loader-ring:rgba(233, 235, 240, 0.3);
    --rs-loader-backdrop:rgba(15, 19, 26, 0.83);
    --rs-loader-ring-inverse:rgba(233, 235, 240, 0.8);
    --rs-loader-backdrop-inverse:rgba(255, 255, 255, 0.9);
    --rs-calendar-range-bg:rgba(143, 153, 0, 0.5);
  }
}

:root{
  --rs-font-size-xs:0.75rem;
  --rs-font-size-sm:0.875rem;
  --rs-font-size-md:1rem;
  --rs-line-height-base:20px;
  --rs-line-height-plus:22px;
  --rs-line-height-xs:calc(20 / 12);
  --rs-line-height-sm:calc(20 / 12);
  --rs-line-height-md:calc(20 / 14);
  --rs-line-height-lg:calc(22 / 16);
  --rs-spacing:0.25rem;
  --rs-spacing-inline-xs:8px;
  --rs-spacing-block-xs:2px;
  --rs-spacing-inline-sm:10px;
  --rs-spacing-block-sm:5px;
  --rs-spacing-inline-lg:16px;
  --rs-spacing-block-lg:10px;
  --rs-padding-inline-md:12px;
  --rs-padding-block-md:8px;
  --rs-radius-none:0;
  --rs-radius-sm:0.25rem;
  --rs-radius-md:0.375rem;
  --rs-radius-full:62.5rem;
  --rs-shadow-color:rgb(0 0 0 / 10%);
  --rs-shadow-none:0 0 #0000;
  --rs-shadow-md:0 4px 6px -1px var(--rs-shadow-color), 0 2px 4px 0 var(--rs-shadow-color);
  --rs-cursor-disabled:not-allowed;
  --rs-link-hover-decoration:underline;
  --rs-ripple-bg:rgb(0 0 0 / 20%);
  --rs-zindex-date-range-picker-calendar-dropdown:1;
  --rs-zindex-date-range-picker-table-cell-content:1;
  --rs-zindex-dropdown:5;
  --rs-zindex-picker-toggle:5;
  --rs-zindex-picker-popup:7;
  --rs-zindex-modal:1050;
  --rs-zindex-drawer:1050;
}

@media (max-width: calc(576px - 1px)){
  [data-visible-from=xs]{
    display:none !important;
  }
}
@media (min-width: 576px){
  [data-hidden-from=xs]{
    display:none !important;
  }
}
@media (max-width: calc(768px - 1px)){
  [data-visible-from=sm]{
    display:none !important;
  }
}
@media (min-width: 768px){
  [data-hidden-from=sm]{
    display:none !important;
  }
}
@media (max-width: calc(992px - 1px)){
  [data-visible-from=md]{
    display:none !important;
  }
}
@media (min-width: 992px){
  [data-hidden-from=md]{
    display:none !important;
  }
}
@media (max-width: calc(1200px - 1px)){
  [data-visible-from=lg]{
    display:none !important;
  }
}
@media (min-width: 1200px){
  [data-hidden-from=lg]{
    display:none !important;
  }
}
@media (max-width: calc(1400px - 1px)){
  [data-visible-from=xl]{
    display:none !important;
  }
}
@media (min-width: 1400px){
  [data-hidden-from=xl]{
    display:none !important;
  }
}
:root{
  --rs-stack-spacing:calc(var(--rs-spacing) * 1.5);
  --rs-stack-wrap:nowrap;
  --rs-stack-direction:row;
  --rs-stack-align:center;
  --rs-stack-justify:flex-start;
}

.rs-stack{
  display:flex;
  gap:var(--rs-stack-spacing);
  flex-wrap:var(--rs-stack-wrap);
  flex-direction:var(--rs-stack-direction);
  align-items:var(--rs-stack-align);
  justify-content:var(--rs-stack-justify);
}
.rs-stack-column{
  --rs-stack-align:flex-start;
  flex-direction:column;
}
.rs-stack-row{
  --rs-stack-align:center;
  flex-direction:row;
}
.rs-stack-column-reverse{
  --rs-stack-align:flex-start;
  flex-direction:column-reverse;
}
.rs-stack-row-reverse{
  --rs-stack-align:center;
  flex-direction:row-reverse;
}
.rs-stack[data-wrap=true]{
  flex-wrap:wrap;
}
.rs-stack-xs-column{
  flex-direction:column;
}
.rs-stack-xs-row{
  flex-direction:row;
}
.rs-stack-xs-column-reverse{
  flex-direction:column-reverse;
}
.rs-stack-xs-row-reverse{
  flex-direction:row-reverse;
}
@media (min-width: 576px){
  .rs-stack-sm-column{
    flex-direction:column;
  }
  .rs-stack-sm-row{
    flex-direction:row;
  }
  .rs-stack-sm-column-reverse{
    flex-direction:column-reverse;
  }
  .rs-stack-sm-row-reverse{
    flex-direction:row-reverse;
  }
}
@media (min-width: 768px){
  .rs-stack-md-column{
    flex-direction:column;
  }
  .rs-stack-md-row{
    flex-direction:row;
  }
  .rs-stack-md-column-reverse{
    flex-direction:column-reverse;
  }
  .rs-stack-md-row-reverse{
    flex-direction:row-reverse;
  }
}
@media (min-width: 992px){
  .rs-stack-lg-column{
    flex-direction:column;
  }
  .rs-stack-lg-row{
    flex-direction:row;
  }
  .rs-stack-lg-column-reverse{
    flex-direction:column-reverse;
  }
  .rs-stack-lg-row-reverse{
    flex-direction:row-reverse;
  }
}
@media (min-width: 1200px){
  .rs-stack-xl-column{
    flex-direction:column;
  }
  .rs-stack-xl-row{
    flex-direction:row;
  }
  .rs-stack-xl-column-reverse{
    flex-direction:column-reverse;
  }
  .rs-stack-xl-row-reverse{
    flex-direction:row-reverse;
  }
}
@media (min-width: 1400px){
  .rs-stack-xxl-column{
    flex-direction:column;
  }
  .rs-stack-xxl-row{
    flex-direction:row;
  }
  .rs-stack-xxl-column-reverse{
    flex-direction:column-reverse;
  }
  .rs-stack-xxl-row-reverse{
    flex-direction:row-reverse;
  }
}

:root{
  --rs-loader-duration-fast:0.4s;
  --rs-loader-duration-normal:0.6s;
  --rs-loader-duration-slow:0.8s;
  --rs-loader-duration-paused:paused;
  --rs-loader-size-xs:1rem;
  --rs-loader-size-sm:1.125rem;
  --rs-loader-size-md:2.25rem;
  --rs-loader-size-lg:4rem;
  --rs-loader-font-size-xs:var(--rs-font-size-xs);
  --rs-loader-font-size-sm:var(--rs-font-size-sm);
  --rs-loader-font-size-md:var(--rs-font-size-sm);
  --rs-loader-font-size-lg:var(--rs-font-size-md);
  --rs-loader-spin-ring-width:3px;
}

.rs-loader-box{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:calc(var(--rs-spacing) * 3);
}
.rs-loader-spin{
  position:relative;
  display:inline-block;
}
.rs-loader-spin,.rs-loader-spin::before, .rs-loader-spin::after{
  width:var(--rs-loader-size);
  height:var(--rs-loader-size);
}
.rs-loader-spin::before, .rs-loader-spin::after{
  content:"";
  position:absolute;
  inset-inline-start:0;
  inset-inline-end:0;
  display:block;
  border-radius:var(--rs-radius-full);
}
.rs-loader-spin::before{
  border:var(--rs-loader-spin-ring-width) solid var(--rs-loader-ring);
}
.rs-loader-spin::after{
  border-width:var(--rs-loader-spin-ring-width);
  border-style:solid;
  border-color:var(--rs-loader-rotor) transparent transparent;
  animation:loaderSpin var(--rs-loader-duration-normal) infinite linear;
}
.rs-loader-content{
  font-size:var(--rs-loader-font-size);
}
.rs-loader-backdrop{
  position:absolute;
  top:0;
  inset-inline-start:0;
  width:100%;
  height:100%;
  background:var(--rs-loader-backdrop);
}
.rs-loader[data-direction=vertical] .rs-loader-box{
  flex-direction:column;
}
.rs-loader[data-inverse=true] .rs-loader-content{
  color:var(--rs-text-inverse);
}
.rs-loader[data-inverse=true] .rs-loader-backdrop{
  background:var(--rs-loader-backdrop-inverse);
}
.rs-loader[data-inverse=true] .rs-loader-spin::before{
  border-color:var(--rs-loader-ring-inverse);
}
.rs-loader[data-inverse=true] .rs-loader-spin::after{
  border-top-color:var(--rs-loader-rotor-inverse);
}
.rs-loader[data-speed=fast] .rs-loader-spin::after{
  animation-duration:var(--rs-loader-duration-fast);
}
.rs-loader[data-speed=normal] .rs-loader-spin::after{
  animation-duration:var(--rs-loader-duration-normal);
}
.rs-loader[data-speed=slow] .rs-loader-spin::after{
  animation-duration:var(--rs-loader-duration-slow);
}
.rs-loader[data-speed=paused] .rs-loader-spin::after{
  animation-play-state:var(--rs-loader-duration-paused);
}
.rs-loader[data-center=true]{
  position:absolute;
  top:0;
  bottom:0;
  inset-inline-start:0;
  inset-inline-end:0;
  margin:auto;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.rs-loader[data-center=true] .rs-loader-content{
  z-index:1;
}

.rs-loader[data-size=xs]{
  --rs-loader-size:var(--rs-loader-size-xs);
  --rs-loader-font-size:var(--rs-loader-font-size-xs);
}

.rs-loader[data-size=sm]{
  --rs-loader-size:var(--rs-loader-size-sm);
  --rs-loader-font-size:var(--rs-loader-font-size-sm);
}

.rs-loader[data-size=md]{
  --rs-loader-size:var(--rs-loader-size-md);
  --rs-loader-font-size:var(--rs-loader-font-size-md);
}

.rs-loader[data-size=lg]{
  --rs-loader-size:var(--rs-loader-size-lg);
  --rs-loader-font-size:var(--rs-loader-font-size-lg);
}

@keyframes loaderSpin{
  from{
    transform:rotate(0);
  }
  to{
    transform:rotate(360deg);
  }
}
:root{
  --rs-input-border-width:1px;
  --rs-input-font-size-xs:var(--rs-font-size-xs);
  --rs-input-font-size-sm:var(--rs-font-size-sm);
  --rs-input-font-size-md:var(--rs-font-size-sm);
  --rs-input-font-size-lg:var(--rs-font-size-md);
  --rs-input-line-height-xs:var(--rs-line-height-xs);
  --rs-input-line-height-sm:var(--rs-line-height-md);
  --rs-input-line-height-md:var(--rs-line-height-md);
  --rs-input-line-height-lg:var(--rs-line-height-lg);
  --rs-input-border-radius:var(--rs-radius-md);
  --rs-input-padding-block-xs:calc(var(--rs-spacing-block-xs) - var(--rs-input-border-width));
  --rs-input-padding-block-sm:calc(var(--rs-spacing-block-sm) - var(--rs-input-border-width));
  --rs-input-padding-block-md:calc(var(--rs-padding-block-md) - var(--rs-input-border-width));
  --rs-input-padding-block-lg:calc(var(--rs-spacing-block-lg) - var(--rs-input-border-width));
  --rs-input-padding-inline-xs:calc(var(--rs-spacing) - var(--rs-input-border-width));
  --rs-input-padding-inline-sm:calc(calc(var(--rs-spacing) * 2) - var(--rs-input-border-width));
  --rs-input-padding-inline-md:calc(calc(var(--rs-spacing) * 2.5) - var(--rs-input-border-width));
  --rs-input-padding-inline-lg:calc(calc(var(--rs-spacing) * 3) - var(--rs-input-border-width));
  --rs-input-transition:border-color ease-in-out 0.15s;
}

.rs-input{
  display:block;
  width:100%;
  color:var(--rs-text-primary);
  background-color:var(--rs-input-bg);
  background-image:none;
  border:1px solid var(--rs-border-primary);
  transition:var(--rs-input-transition);
  border-radius:var(--rs-input-border-radius);
  font-size:var(--rs-input-font-size);
  line-height:var(--rs-input-line-height);
  padding-block:var(--rs-input-padding-block);
  padding-inline:var(--rs-input-padding-inline);
}
[data-theme=high-contrast] .rs-input, .rs-theme-high-contrast .rs-input{
  transition:none;
}
.rs-input::-moz-placeholder{
  color:var(--rs-text-secondary);
}
.rs-input::placeholder{
  color:var(--rs-text-secondary);
}
.rs-input:focus{
  border-color:var(--rs-input-focus-border);
}
.rs-input:focus-visible{
  outline:2px solid var(--rs-focus-ring-color);
  outline-offset:-1px;
}
.rs-input:disabled{
  background-color:var(--rs-input-disabled-bg);
  color:var(--rs-text-disabled);
}
.rs-input[data-size=xs]{
  --rs-input-font-size:var(--rs-input-font-size-xs);
  --rs-input-line-height:var(--rs-input-line-height-xs);
  --rs-input-padding-block:var(--rs-input-padding-block-xs);
  --rs-input-padding-inline:var(--rs-input-padding-inline-xs);
}
.rs-input[data-size=sm]{
  --rs-input-font-size:var(--rs-input-font-size-sm);
  --rs-input-line-height:var(--rs-input-line-height-sm);
  --rs-input-padding-block:var(--rs-input-padding-block-sm);
  --rs-input-padding-inline:var(--rs-input-padding-inline-sm);
}
.rs-input[data-size=md]{
  --rs-input-font-size:var(--rs-input-font-size-md);
  --rs-input-line-height:var(--rs-input-line-height-md);
  --rs-input-padding-block:var(--rs-input-padding-block-md);
  --rs-input-padding-inline:var(--rs-input-padding-inline-md);
}
.rs-input[data-size=lg]{
  --rs-input-font-size:var(--rs-input-font-size-lg);
  --rs-input-line-height:var(--rs-input-line-height-lg);
  --rs-input-padding-block:var(--rs-input-padding-block-lg);
  --rs-input-padding-inline:var(--rs-input-padding-inline-lg);
}

.rs-input-group{
  --rs-input-height-xs:calc(var(--rs-line-height-base) + (var(--rs-spacing-block-xs) * 2));
  --rs-input-height-sm:calc(var(--rs-line-height-base) + (var(--rs-spacing-block-sm) * 2));
  --rs-input-height-md:calc(var(--rs-line-height-base) + (var(--rs-padding-block-md) * 2));
  --rs-input-height-lg:calc(var(--rs-line-height-plus) + (var(--rs-spacing-block-lg) * 2));
  --rs-input-group-input-height-xs:calc(var(--rs-input-height-xs) - 2px);
  --rs-input-group-input-height-sm:calc(var(--rs-input-height-sm) - 2px);
  --rs-input-group-input-height-md:calc(var(--rs-input-height-md) - 2px);
  --rs-input-group-input-height-lg:calc(var(--rs-input-height-lg) - 2px);
  --rs-input-group-inside-btn-m-x-xs:calc(var(--rs-spacing-block-xs) / 2);
  --rs-input-group-inside-btn-m-x-sm:calc(var(--rs-spacing-block-sm) / 2);
  --rs-input-group-inside-btn-m-x-md:calc(var(--rs-padding-block-md) / 2);
  --rs-input-group-inside-btn-m-x-lg:calc(var(--rs-spacing-block-lg) / 2);
  --rs-input-group-inside-btn-p-x-xs:calc(var(--rs-spacing-inline-xs) / 2);
  --rs-input-group-inside-btn-p-x-sm:calc(var(--rs-spacing-inline-sm) / 2);
  --rs-input-group-inside-btn-p-x-md:calc(var(--rs-padding-inline-md) / 2);
  --rs-input-group-inside-btn-p-x-lg:calc(var(--rs-spacing-inline-lg) / 2);
  --rs-input-group-border-radius:var(--rs-radius-md);
  --rs-input-group-font-size-xs:var(--rs-font-size-xs);
  --rs-input-group-font-size-sm:var(--rs-font-size-sm);
  --rs-input-group-font-size-md:var(--rs-font-size-sm);
  --rs-input-group-font-size-lg:var(--rs-font-size-md);
  --rs-input-group-width:100%;
  position:relative;
  display:flex;
  border-radius:var(--rs-input-group-border-radius);
  transition:var(--rs-input-transition);
  width:var(--rs-input-group-width);
  cursor:text;
  color:var(--rs-text-primary);
  border:1px solid var(--rs-border-primary);
  overflow:hidden;
}
.rs-input-group[data-size=xs]{
  --rs-input-group-input-height:var(--rs-input-group-input-height-xs);
  --rs-input-group-inside-btn-spacing:var(--rs-input-group-inside-btn-m-x-xs);
  --rs-input-group-inside-btn-padding:var(--rs-input-group-inside-btn-p-x-xs);
  --rs-input-group-font-size:var(--rs-input-group-font-size-xs);
}
.rs-input-group[data-size=sm]{
  --rs-input-group-input-height:var(--rs-input-group-input-height-sm);
  --rs-input-group-inside-btn-spacing:var(--rs-input-group-inside-btn-m-x-sm);
  --rs-input-group-inside-btn-padding:var(--rs-input-group-inside-btn-p-x-sm);
  --rs-input-group-font-size:var(--rs-input-group-font-size-sm);
}
.rs-input-group[data-size=md]{
  --rs-input-group-input-height:var(--rs-input-group-input-height-md);
  --rs-input-group-inside-btn-spacing:var(--rs-input-group-inside-btn-m-x-md);
  --rs-input-group-inside-btn-padding:var(--rs-input-group-inside-btn-p-x-md);
  --rs-input-group-font-size:var(--rs-input-group-font-size-md);
}
.rs-input-group[data-size=lg]{
  --rs-input-group-input-height:var(--rs-input-group-input-height-lg);
  --rs-input-group-inside-btn-spacing:var(--rs-input-group-inside-btn-m-x-lg);
  --rs-input-group-inside-btn-padding:var(--rs-input-group-inside-btn-p-x-lg);
  --rs-input-group-font-size:var(--rs-input-group-font-size-lg);
}
[data-theme=high-contrast] .rs-input-group, .rs-theme-high-contrast .rs-input-group{
  transition:none;
}
.rs-input-group:not([data-disabled=true]).rs-input-group-focus, .rs-input-group:focus-within{
  border-color:var(--rs-input-focus-border);
}
.rs-input-group:not([data-disabled=true]).rs-input-group-focus, .rs-input-group:focus-within{
  outline:2px solid var(--rs-focus-ring-color);
  outline-offset:-1px;
}
.rs-input-group .rs-input-group{
  outline:none !important;
  border-color:transparent !important;
}
.rs-input-group .rs-input-group-btn{
  height:var(--rs-input-group-input-height);
}
.rs-input-group .rs-number-input,
.rs-input-group .rs-input-group-addon,
.rs-input-group .rs-input-group-btn,
.rs-input-group .rs-picker[data-picker=date] .rs-picker-toggle{
  border:none;
  border-radius:var(--rs-radius-none);
  outline:none;
}
.rs-input-group > .rs-input,
.rs-input-group > .rs-form-control-wrapper{
  flex:1 1 auto;
}
.rs-input-group .rs-form-control-wrapper > .rs-input{
  width:100%;
}
.rs-input-group > .rs-input{
  position:relative;
  height:var(--rs-input-group-input-height);
  border:none;
  border-radius:var(--rs-radius-none);
  outline:none;
}
.rs-input-group > .rs-input-group-addon > .rs-icon{
  font-size:inherit;
}
.rs-input-group[data-inside=true]{
  width:var(--rs-input-group-width);
  align-items:center;
  background-color:var(--rs-input-bg);
}
.rs-input-group[data-inside=true] .rs-input{
  display:block;
  width:100%;
  border:none;
  outline:none;
}
.rs-input-group[data-inside=true] .rs-input-group-btn,
.rs-input-group[data-inside=true] .rs-input-group-addon{
  flex:0 0 auto;
  width:auto;
}
.rs-input-group[data-inside=true] .rs-input-group-btn{
  border-radius:var(--rs-input-group-border-radius);
  height:calc(var(--rs-input-group-input-height) - var(--rs-input-group-inside-btn-spacing) * 2);
  margin-inline:var(--rs-input-group-inside-btn-spacing);
  padding-inline:var(--rs-input-group-inside-btn-padding);
  color:var(--rs-btn-subtle-text);
  background-color:transparent;
  color:inherit;
}
.rs-input-group[data-inside=true] .rs-input-group-btn:hover{
  color:var(--rs-btn-subtle-hover-text);
  background-color:var(--rs-btn-subtle-hover-bg);
}
.rs-input-group[data-inside=true] .rs-input-group-btn:active, .rs-input-group[data-inside=true] .rs-input-group-btn[data-active=true]{
  color:var(--rs-btn-subtle-active-text);
  background-color:var(--rs-btn-subtle-active-bg);
}
.rs-input-group[data-inside=true] .rs-input-group-btn:disabled, .rs-input-group[data-inside=true] .rs-input-group-btn[data-disabled=true]{
  color:var(--rs-btn-subtle-disabled-text);
  background:none;
}
.rs-input-group[data-inside=true] .rs-input-group-btn:focus{
  outline:none;
}
.rs-input-group[data-inside=true] .rs-input-group-addon{
  background:none;
  border:none;
}
.rs-input-group[data-inside=true] .rs-input:not(:first-child),
.rs-input-group[data-inside=true] .rs-auto-complete:not(:first-child) .rs-input{
  padding-inline-start:0;
}
.rs-input-group[data-inside=true] .rs-input:not(:last-child),
.rs-input-group[data-inside=true] .rs-auto-complete:not(:last-child) .rs-input{
  padding-inline-end:0;
}

.rs-input-group[data-disabled=true]{
  background-color:var(--rs-input-disabled-bg);
  color:var(--rs-text-disabled);
  cursor:not-allowed;
}
.rs-input-group[data-disabled=true] .rs-input,
.rs-input-group[data-disabled=true] .rs-input-group-btn,
.rs-input-group[data-disabled=true] .rs-input-group-addon{
  color:inherit;
}

.rs-input-group-addon{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
  vertical-align:middle;
  color:var(--rs-text-primary);
  font-size:var(--rs-input-group-font-size);
  font-weight:normal;
  line-height:1;
  text-align:center;
  background-color:var(--rs-btn-default-bg);
  padding-inline:var(--rs-spacing);
  min-width:var(--rs-input-group-input-height);
}
.rs-input-group-addon[data-size=sm]{
  padding-block:var(--rs-spacing-block-sm);
  padding-inline:var(--rs-spacing-inline-sm);
  font-size:var(--rs-font-size-sm);
}
.rs-input-group-addon[data-size=xs]{
  padding:var(--rs-spacing-inline-xs);
  font-size:var(--rs-font-size-xs);
}
.rs-input-group-addon[data-size=lg]{
  padding-block:var(--rs-spacing-block-lg);
  padding-inline:var(--rs-spacing-inline-lg);
  font-size:var(--rs-font-size-md);
}
.rs-input-group-addon input[type=radio],
.rs-input-group-addon input[type=checkbox]{
  margin-top:0;
}

.rs-input-group-btn{
  display:flex;
  align-items:center;
  position:relative;
  line-height:1;
  white-space:nowrap;
  border-radius:var(--rs-radius-none);
  font-size:var(--rs-input-group-font-size);
}

.rs-highlight-mark{
  background-color:var(--rs-text-highlight-bg);
  padding:0 0.2em;
  font-weight:bolder;
  border-radius:var(--rs-radius-sm);
}

.rs-ripple{
  position:absolute;
  display:block;
  border-radius:var(--rs-radius-full);
  background-color:var(--rs-ripple-bg);
  transform:scale(0);
  transition:0s;
}
.rs-ripple-rippling{
  transition:transform 0.55s cubic-bezier(0.4, 0, 0.2, 1), opacity 1s cubic-bezier(0.4, 0, 0.2, 1);
  transform:scale(1);
  opacity:0;
}
.rs-ripple-pond{
  content:"";
  display:block;
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  inset-inline-start:0;
  pointer-events:none;
}
.high-contrast-mode .rs-ripple-pond{
  display:none !important;
}

:root{
  --rs-btn-size-xs:1.5rem;
  --rs-btn-size-sm:1.875rem;
  --rs-btn-size-md:2.25rem;
  --rs-btn-size-lg:2.625rem;
  --rs-btn-font-size-xs:var(--rs-font-size-xs);
  --rs-btn-font-size-sm:var(--rs-font-size-sm);
  --rs-btn-font-size-md:var(--rs-font-size-sm);
  --rs-btn-font-size-lg:var(--rs-font-size-md);
  --rs-btn-line-height-xs:1.25rem;
  --rs-btn-line-height-sm:1.25rem;
  --rs-btn-line-height-md:1.25rem;
  --rs-btn-line-height-lg:1.375rem;
  --rs-btn-padding-inline-xs:calc(var(--rs-spacing) * 2);
  --rs-btn-padding-inline-sm:calc(var(--rs-spacing) * 2.5);
  --rs-btn-padding-inline-md:calc(var(--rs-spacing) * 3);
  --rs-btn-padding-inline-lg:calc(var(--rs-spacing) * 3.5);
  --rs-btn-padding-block-xs:calc(var(--rs-spacing) / 2);
  --rs-btn-padding-block-sm:calc(var(--rs-spacing) * 1.25);
  --rs-btn-padding-block-md:calc(var(--rs-spacing) * 2);
  --rs-btn-padding-block-lg:calc(var(--rs-spacing) * 2.5);
  --rs-btn-icon-size-xs:0.75rem;
  --rs-btn-icon-size-sm:1rem;
  --rs-btn-icon-size-md:1rem;
  --rs-btn-icon-size-lg:1.25rem;
  --rs-btn-ghost-border-width:1px;
  --rs-btn-loading-spin-default-diameter:18px;
  --rs-btn-loading-spin-xs-diameter:16px;
  --rs-btn-loading-spin-ring-wide:3px;
  --rs-btn-font-weight:normal;
  --rs-btn-transition:color 0.15s ease-out, background-color 0.15s ease-out;
  --rs-btn-icon-gap:5px;
}

.rs-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-bottom:0;
  font-weight:var(--rs-btn-font-weight);
  font-size:var(--rs-btn-font-size, var(--rs-font-size-sm));
  line-height:var(--rs-btn-line-height, 1.25rem);
  height:var(--rs-btn-size, 2.25rem);
  text-align:center;
  vertical-align:middle;
  cursor:pointer;
  white-space:nowrap;
  transition:var(--rs-btn-transition);
  border-width:0;
  border-style:solid;
  border-color:var(--rs-btn-default-border-color, none);
  -webkit-user-select:none;
     -moz-user-select:none;
          user-select:none;
  text-decoration:none;
  color:var(--rs-btn-default-text);
  background-color:var(--rs-btn-default-bg);
  border-radius:var(--rs-radius-md);
  padding-inline:var(--rs-btn-padding-inline);
  padding-block:var(--rs-btn-padding-block);
}
[data-theme=high-contrast] .rs-btn, .rs-theme-high-contrast .rs-btn{
  transition:none;
  border-width:1px;
  border-color:var(--rs-btn-default-border-color);
}
.rs-btn:focus-visible{
  outline:2px solid var(--rs-focus-ring-color);
  outline-offset:-1px;
}
.rs-btn:hover{
  color:var(--rs-btn-default-hover-text);
  background-color:var(--rs-btn-default-hover-bg);
  text-decoration:none;
}
.rs-btn:active, .rs-btn.rs-btn[data-active=true]{
  color:var(--rs-btn-default-active-text);
  background-color:var(--rs-btn-default-active-bg);
}
.rs-btn:disabled, .rs-btn.rs-btn[data-disabled=true]{
  cursor:var(--rs-cursor-disabled);
  color:var(--rs-btn-default-disabled-text);
  background-color:var(--rs-btn-default-disabled-bg);
}
[data-theme=high-contrast] .rs-btn:disabled, .rs-theme-high-contrast .rs-btn:disabled, [data-theme=high-contrast] .rs-btn.rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn.rs-btn[data-disabled=true]{
  border-color:var(--rs-btn-default-disabled-border-color);
}
.rs-btn{
  position:relative;
  overflow:hidden;
}
@media not all and (min-resolution: 0.001dpcm){
  .rs-btn{
    -webkit-mask-image:radial-gradient(white, black);
            mask-image:radial-gradient(white, black);
  }
}
.rs-btn{
  --rs-btn-size:var(--rs-btn-size-md);
  --rs-btn-font-size:var(--rs-btn-font-size-md);
  --rs-btn-line-height:var(--rs-btn-line-height-md);
  --rs-btn-padding-inline:var(--rs-btn-padding-inline-md);
  --rs-btn-padding-block:var(--rs-btn-padding-block-md);
  --rs-btn-icon-size:var(--rs-btn-icon-size-md);
}
.rs-btn[data-size=lg]{
  --rs-btn-size:var(--rs-btn-size-lg);
  --rs-btn-font-size:var(--rs-btn-font-size-lg);
  --rs-btn-line-height:var(--rs-btn-line-height-lg);
  --rs-btn-padding-inline:var(--rs-btn-padding-inline-lg);
  --rs-btn-padding-block:var(--rs-btn-padding-block-lg);
  --rs-btn-icon-size:var(--rs-btn-icon-size-lg);
}
.rs-btn[data-size=md]{
  --rs-btn-size:var(--rs-btn-size-md);
  --rs-btn-font-size:var(--rs-btn-font-size-md);
  --rs-btn-line-height:var(--rs-btn-line-height-md);
  --rs-btn-padding-inline:var(--rs-btn-padding-inline-md);
  --rs-btn-padding-block:var(--rs-btn-padding-block-md);
  --rs-btn-icon-size:var(--rs-btn-icon-size-md);
}
.rs-btn[data-size=sm]{
  --rs-btn-size:var(--rs-btn-size-sm);
  --rs-btn-font-size:var(--rs-btn-font-size-sm);
  --rs-btn-line-height:var(--rs-btn-line-height-sm);
  --rs-btn-padding-inline:var(--rs-btn-padding-inline-sm);
  --rs-btn-padding-block:var(--rs-btn-padding-block-sm);
  --rs-btn-icon-size:var(--rs-btn-icon-size-sm);
}
.rs-btn[data-size=xs]{
  --rs-btn-size:var(--rs-btn-size-xs);
  --rs-btn-font-size:var(--rs-btn-font-size-xs);
  --rs-btn-line-height:var(--rs-btn-line-height-xs);
  --rs-btn-padding-inline:var(--rs-btn-padding-inline-xs);
  --rs-btn-padding-block:var(--rs-btn-padding-block-xs);
  --rs-btn-icon-size:var(--rs-btn-icon-size-xs);
}

.rs-btn-start-icon{
  line-height:0;
  margin-inline-end:var(--rs-btn-icon-gap);
}

.rs-btn-end-icon{
  line-height:0;
  margin-inline-start:var(--rs-btn-icon-gap);
}

.rs-btn[data-appearance=primary]{
  color:var(--rs-btn-primary-text);
  background-color:var(--rs-btn-primary-bg);
  border-color:var(--rs-btn-primary-border-color);
}
.rs-btn[data-appearance=primary]:hover{
  color:var(--rs-btn-primary-text);
  background-color:var(--rs-btn-primary-hover-bg);
}
.rs-btn[data-appearance=primary]:active, .rs-btn[data-appearance=primary].rs-btn[data-active=true]{
  color:var(--rs-btn-primary-text);
  background-color:var(--rs-btn-primary-active-bg);
}
.rs-btn[data-appearance=primary]:disabled, .rs-btn[data-appearance=primary].rs-btn[data-disabled=true]{
  color:var(--rs-btn-primary-text);
  background-color:var(--rs-btn-primary-bg);
  opacity:0.3;
}
[data-theme=high-contrast] .rs-btn[data-appearance=primary]:disabled, .rs-theme-high-contrast .rs-btn[data-appearance=primary]:disabled, [data-theme=high-contrast] .rs-btn[data-appearance=primary].rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn[data-appearance=primary].rs-btn[data-disabled=true]{
  border-color:var(--rs-btn-default-disabled-border-color);
}

.rs-btn[data-appearance=subtle],
.rs-btn-subtle,
.rs-calendar-header-error{
  color:var(--rs-btn-subtle-text);
  background-color:transparent;
}
.rs-btn[data-appearance=subtle]:hover,
.rs-btn-subtle:hover,
.rs-calendar-header-error:hover{
  color:var(--rs-btn-subtle-hover-text);
  background-color:var(--rs-btn-subtle-hover-bg);
}
.rs-btn[data-appearance=subtle]:active, .rs-btn[data-appearance=subtle].rs-btn[data-active=true],
.rs-btn-subtle:active,
.rs-calendar-header-error:active,
.rs-btn-subtle.rs-btn[data-active=true],
.rs-btn[data-active=true].rs-calendar-header-error{
  color:var(--rs-btn-subtle-active-text);
  background-color:var(--rs-btn-subtle-active-bg);
}
.rs-btn[data-appearance=subtle]:disabled, .rs-btn[data-appearance=subtle].rs-btn[data-disabled=true],
.rs-btn-subtle:disabled,
.rs-calendar-header-error:disabled,
.rs-btn-subtle.rs-btn[data-disabled=true],
.rs-btn[data-disabled=true].rs-calendar-header-error{
  color:var(--rs-btn-subtle-disabled-text);
  background:none;
}
[data-theme=high-contrast] .rs-btn[data-appearance=subtle]:disabled, .rs-theme-high-contrast .rs-btn[data-appearance=subtle]:disabled, [data-theme=high-contrast] .rs-btn[data-appearance=subtle].rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn[data-appearance=subtle].rs-btn[data-disabled=true],
[data-theme=high-contrast] .rs-btn-subtle:disabled,
[data-theme=high-contrast] .rs-calendar-header-error:disabled,
.rs-theme-high-contrast .rs-btn-subtle:disabled,
.rs-theme-high-contrast .rs-calendar-header-error:disabled,
[data-theme=high-contrast] .rs-btn-subtle.rs-btn[data-disabled=true],
[data-theme=high-contrast] .rs-btn[data-disabled=true].rs-calendar-header-error,
.rs-theme-high-contrast .rs-btn-subtle.rs-btn[data-disabled=true],
.rs-theme-high-contrast .rs-btn[data-disabled=true].rs-calendar-header-error{
  border-color:var(--rs-btn-default-disabled-border-color);
}

.rs-btn[data-appearance=link]{
  color:var(--rs-btn-link-text);
  background-color:transparent;
}
.rs-btn[data-appearance=link]:hover{
  color:var(--rs-btn-link-hover-text);
  background-color:transparent;
  -webkit-text-decoration:var(--rs-link-hover-decoration);
          text-decoration:var(--rs-link-hover-decoration);
}
.rs-btn[data-appearance=link]:active, .rs-btn[data-appearance=link].rs-btn[data-active=true]{
  color:var(--rs-btn-link-active-text);
  background-color:transparent;
}
.rs-btn[data-appearance=link]:disabled, .rs-btn[data-appearance=link].rs-btn[data-disabled=true]{
  color:var(--rs-btn-link-hover-text);
  background-color:transparent;
  text-decoration:none;
  opacity:0.3;
}
[data-theme=high-contrast] .rs-btn[data-appearance=link]:disabled, .rs-theme-high-contrast .rs-btn[data-appearance=link]:disabled, [data-theme=high-contrast] .rs-btn[data-appearance=link].rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn[data-appearance=link].rs-btn[data-disabled=true]{
  border-color:var(--rs-btn-default-disabled-border-color);
}

.rs-btn[data-appearance=ghost]{
  color:var(--rs-btn-ghost-text);
  background-color:transparent;
  border:var(--rs-btn-ghost-border-width) solid var(--rs-btn-ghost-border);
  padding-inline:calc(var(--rs-btn-padding-inline) - var(--rs-btn-ghost-border-width));
}
.rs-btn[data-appearance=ghost]:hover{
  color:var(--rs-btn-ghost-hover-text);
  background-color:transparent;
  border-color:var(--rs-btn-ghost-hover-border);
  box-shadow:0 0 0 1px var(--rs-btn-ghost-hover-border);
}
.rs-btn[data-appearance=ghost]:active, .rs-btn[data-appearance=ghost].rs-btn[data-active=true]{
  color:var(--rs-btn-ghost-active-text);
  background-color:transparent;
  border-color:var(--rs-btn-ghost-active-border);
}
.rs-btn[data-appearance=ghost]:disabled, .rs-btn[data-appearance=ghost].rs-btn[data-disabled=true]{
  color:var(--rs-btn-ghost-text);
  background-color:transparent;
  opacity:0.3;
  border-color:var(--rs-btn-ghost-border);
  box-shadow:var(--rs-shadow-none);
}
[data-theme=high-contrast] .rs-btn[data-appearance=ghost]:disabled, .rs-theme-high-contrast .rs-btn[data-appearance=ghost]:disabled, [data-theme=high-contrast] .rs-btn[data-appearance=ghost].rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn[data-appearance=ghost].rs-btn[data-disabled=true]{
  border-color:var(--rs-btn-default-disabled-border-color);
}

.rs-btn[data-color=red]{
  --rs-btn-primary-bg:var(--rs-red-500);
  --rs-btn-primary-hover-bg:var(--rs-red-700);
  --rs-btn-primary-active-bg:var(--rs-red-800);
  --rs-btn-primary-border-color:var(--rs-red-700);
  --rs-btn-subtle-hover-bg:var(--rs-red-500);
  --rs-btn-subtle-hover-text:var(--rs-body-200);
  --rs-btn-subtle-active-bg:var(--rs-red-600);
  --rs-btn-subtle-active-text:var(--rs-body-800);
  --rs-btn-ghost-border:var(--rs-red-700);
  --rs-btn-ghost-text:var(--rs-red-700);
  --rs-btn-ghost-hover-border:var(--rs-red-900);
  --rs-btn-ghost-hover-text:var(--rs-red-800);
  --rs-btn-ghost-active-border:var(--rs-red-900);
  --rs-btn-ghost-active-text:var(--rs-red-900);
  --rs-btn-link-text:var(--rs-red-700);
  --rs-btn-link-hover-text:var(--rs-red-800);
  --rs-btn-link-active-text:var(--rs-red-900);
  --rs-iconbtn-primary-addon:var(--rs-red-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-red-800);
  --rs-iconbtn-primary-pressed-addon:var(--rs-red-900);
}
[data-theme=dark] .rs-btn[data-color=red], .rs-theme-dark .rs-btn[data-color=red]{
  --rs-btn-primary-bg:var(--rs-red-700);
  --rs-btn-primary-hover-bg:var(--rs-red-500);
  --rs-btn-primary-active-bg:var(--rs-red-400);
  --rs-btn-primary-border-color:var(--rs-red-800);
  --rs-btn-subtle-hover-bg:var(--rs-red-600);
  --rs-btn-subtle-hover-text:#fff;
  --rs-btn-subtle-active-bg:var(--rs-red-400);
  --rs-btn-subtle-active-text:#fff;
  --rs-btn-ghost-border:var(--rs-red-500);
  --rs-btn-ghost-text:var(--rs-red-500);
  --rs-btn-ghost-hover-border:var(--rs-red-400);
  --rs-btn-ghost-hover-text:var(--rs-red-400);
  --rs-btn-ghost-active-border:var(--rs-red-200);
  --rs-btn-ghost-active-text:var(--rs-red-200);
  --rs-btn-link-text:var(--rs-red-500);
  --rs-btn-link-hover-text:var(--rs-red-400);
  --rs-btn-link-active-text:var(--rs-red-200);
  --rs-iconbtn-primary-addon:var(--rs-red-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-red-400);
  --rs-iconbtn-primary-pressed-addon:var(--rs-red-300);
}
[data-theme=high-contrast] .rs-btn[data-color=red], .rs-theme-high-contrast .rs-btn[data-color=red]{
  --rs-btn-primary-bg:var(--rs-red-700);
  --rs-btn-primary-hover-bg:var(--rs-red-600);
  --rs-btn-primary-active-bg:var(--rs-red-400);
  --rs-btn-subtle-hover-bg:var(--rs-red-600);
  --rs-btn-subtle-hover-text:var(--rs-gray-900);
  --rs-btn-subtle-active-bg:var(--rs-red-400);
  --rs-btn-subtle-active-text:var(--rs-gray-900);
  --rs-btn-ghost-border:var(--rs-red-500);
  --rs-btn-ghost-text:var(--rs-red-500);
  --rs-btn-ghost-hover-border:var(--rs-red-400);
  --rs-btn-ghost-hover-text:var(--rs-red-400);
  --rs-btn-ghost-active-border:var(--rs-red-200);
  --rs-btn-ghost-active-text:var(--rs-red-200);
  --rs-btn-link-text:var(--rs-red-500);
  --rs-btn-link-hover-text:var(--rs-red-400);
  --rs-btn-link-active-text:var(--rs-red-200);
}

.rs-btn[data-color=orange]{
  --rs-btn-primary-bg:var(--rs-orange-500);
  --rs-btn-primary-hover-bg:var(--rs-orange-700);
  --rs-btn-primary-active-bg:var(--rs-orange-800);
  --rs-btn-primary-border-color:var(--rs-orange-700);
  --rs-btn-subtle-hover-bg:var(--rs-orange-500);
  --rs-btn-subtle-hover-text:var(--rs-body-200);
  --rs-btn-subtle-active-bg:var(--rs-orange-600);
  --rs-btn-subtle-active-text:var(--rs-body-800);
  --rs-btn-ghost-border:var(--rs-orange-700);
  --rs-btn-ghost-text:var(--rs-orange-700);
  --rs-btn-ghost-hover-border:var(--rs-orange-900);
  --rs-btn-ghost-hover-text:var(--rs-orange-800);
  --rs-btn-ghost-active-border:var(--rs-orange-900);
  --rs-btn-ghost-active-text:var(--rs-orange-900);
  --rs-btn-link-text:var(--rs-orange-700);
  --rs-btn-link-hover-text:var(--rs-orange-800);
  --rs-btn-link-active-text:var(--rs-orange-900);
  --rs-iconbtn-primary-addon:var(--rs-orange-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-orange-800);
  --rs-iconbtn-primary-pressed-addon:var(--rs-orange-900);
}
[data-theme=dark] .rs-btn[data-color=orange], .rs-theme-dark .rs-btn[data-color=orange]{
  --rs-btn-primary-bg:var(--rs-orange-700);
  --rs-btn-primary-hover-bg:var(--rs-orange-500);
  --rs-btn-primary-active-bg:var(--rs-orange-400);
  --rs-btn-primary-border-color:var(--rs-orange-800);
  --rs-btn-subtle-hover-bg:var(--rs-orange-600);
  --rs-btn-subtle-hover-text:#fff;
  --rs-btn-subtle-active-bg:var(--rs-orange-400);
  --rs-btn-subtle-active-text:#fff;
  --rs-btn-ghost-border:var(--rs-orange-500);
  --rs-btn-ghost-text:var(--rs-orange-500);
  --rs-btn-ghost-hover-border:var(--rs-orange-400);
  --rs-btn-ghost-hover-text:var(--rs-orange-400);
  --rs-btn-ghost-active-border:var(--rs-orange-200);
  --rs-btn-ghost-active-text:var(--rs-orange-200);
  --rs-btn-link-text:var(--rs-orange-500);
  --rs-btn-link-hover-text:var(--rs-orange-400);
  --rs-btn-link-active-text:var(--rs-orange-200);
  --rs-iconbtn-primary-addon:var(--rs-orange-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-orange-400);
  --rs-iconbtn-primary-pressed-addon:var(--rs-orange-300);
}
[data-theme=high-contrast] .rs-btn[data-color=orange], .rs-theme-high-contrast .rs-btn[data-color=orange]{
  --rs-btn-primary-bg:var(--rs-orange-700);
  --rs-btn-primary-hover-bg:var(--rs-orange-600);
  --rs-btn-primary-active-bg:var(--rs-orange-400);
  --rs-btn-subtle-hover-bg:var(--rs-orange-600);
  --rs-btn-subtle-hover-text:var(--rs-gray-900);
  --rs-btn-subtle-active-bg:var(--rs-orange-400);
  --rs-btn-subtle-active-text:var(--rs-gray-900);
  --rs-btn-ghost-border:var(--rs-orange-500);
  --rs-btn-ghost-text:var(--rs-orange-500);
  --rs-btn-ghost-hover-border:var(--rs-orange-400);
  --rs-btn-ghost-hover-text:var(--rs-orange-400);
  --rs-btn-ghost-active-border:var(--rs-orange-200);
  --rs-btn-ghost-active-text:var(--rs-orange-200);
  --rs-btn-link-text:var(--rs-orange-500);
  --rs-btn-link-hover-text:var(--rs-orange-400);
  --rs-btn-link-active-text:var(--rs-orange-200);
}

.rs-btn[data-color=yellow]{
  --rs-btn-primary-bg:var(--rs-yellow-500);
  --rs-btn-primary-hover-bg:var(--rs-yellow-700);
  --rs-btn-primary-active-bg:var(--rs-yellow-800);
  --rs-btn-primary-border-color:var(--rs-yellow-700);
  --rs-btn-subtle-hover-bg:var(--rs-yellow-500);
  --rs-btn-subtle-hover-text:var(--rs-body-200);
  --rs-btn-subtle-active-bg:var(--rs-yellow-600);
  --rs-btn-subtle-active-text:var(--rs-body-800);
  --rs-btn-ghost-border:var(--rs-yellow-700);
  --rs-btn-ghost-text:var(--rs-yellow-700);
  --rs-btn-ghost-hover-border:var(--rs-yellow-900);
  --rs-btn-ghost-hover-text:var(--rs-yellow-800);
  --rs-btn-ghost-active-border:var(--rs-yellow-900);
  --rs-btn-ghost-active-text:var(--rs-yellow-900);
  --rs-btn-link-text:var(--rs-yellow-700);
  --rs-btn-link-hover-text:var(--rs-yellow-800);
  --rs-btn-link-active-text:var(--rs-yellow-900);
  --rs-iconbtn-primary-addon:var(--rs-yellow-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-yellow-800);
  --rs-iconbtn-primary-pressed-addon:var(--rs-yellow-900);
}
[data-theme=dark] .rs-btn[data-color=yellow], .rs-theme-dark .rs-btn[data-color=yellow]{
  --rs-btn-primary-bg:var(--rs-yellow-700);
  --rs-btn-primary-hover-bg:var(--rs-yellow-500);
  --rs-btn-primary-active-bg:var(--rs-yellow-400);
  --rs-btn-primary-border-color:var(--rs-yellow-800);
  --rs-btn-subtle-hover-bg:var(--rs-yellow-600);
  --rs-btn-subtle-hover-text:#fff;
  --rs-btn-subtle-active-bg:var(--rs-yellow-400);
  --rs-btn-subtle-active-text:#fff;
  --rs-btn-ghost-border:var(--rs-yellow-500);
  --rs-btn-ghost-text:var(--rs-yellow-500);
  --rs-btn-ghost-hover-border:var(--rs-yellow-400);
  --rs-btn-ghost-hover-text:var(--rs-yellow-400);
  --rs-btn-ghost-active-border:var(--rs-yellow-200);
  --rs-btn-ghost-active-text:var(--rs-yellow-200);
  --rs-btn-link-text:var(--rs-yellow-500);
  --rs-btn-link-hover-text:var(--rs-yellow-400);
  --rs-btn-link-active-text:var(--rs-yellow-200);
  --rs-iconbtn-primary-addon:var(--rs-yellow-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-yellow-400);
  --rs-iconbtn-primary-pressed-addon:var(--rs-yellow-300);
}
[data-theme=high-contrast] .rs-btn[data-color=yellow], .rs-theme-high-contrast .rs-btn[data-color=yellow]{
  --rs-btn-primary-bg:var(--rs-yellow-700);
  --rs-btn-primary-hover-bg:var(--rs-yellow-600);
  --rs-btn-primary-active-bg:var(--rs-yellow-400);
  --rs-btn-subtle-hover-bg:var(--rs-yellow-600);
  --rs-btn-subtle-hover-text:var(--rs-gray-900);
  --rs-btn-subtle-active-bg:var(--rs-yellow-400);
  --rs-btn-subtle-active-text:var(--rs-gray-900);
  --rs-btn-ghost-border:var(--rs-yellow-500);
  --rs-btn-ghost-text:var(--rs-yellow-500);
  --rs-btn-ghost-hover-border:var(--rs-yellow-400);
  --rs-btn-ghost-hover-text:var(--rs-yellow-400);
  --rs-btn-ghost-active-border:var(--rs-yellow-200);
  --rs-btn-ghost-active-text:var(--rs-yellow-200);
  --rs-btn-link-text:var(--rs-yellow-500);
  --rs-btn-link-hover-text:var(--rs-yellow-400);
  --rs-btn-link-active-text:var(--rs-yellow-200);
}

.rs-btn[data-color=green]{
  --rs-btn-primary-bg:var(--rs-green-500);
  --rs-btn-primary-hover-bg:var(--rs-green-700);
  --rs-btn-primary-active-bg:var(--rs-green-800);
  --rs-btn-primary-border-color:var(--rs-green-700);
  --rs-btn-subtle-hover-bg:var(--rs-green-500);
  --rs-btn-subtle-hover-text:var(--rs-body-200);
  --rs-btn-subtle-active-bg:var(--rs-green-600);
  --rs-btn-subtle-active-text:var(--rs-body-800);
  --rs-btn-ghost-border:var(--rs-green-700);
  --rs-btn-ghost-text:var(--rs-green-700);
  --rs-btn-ghost-hover-border:var(--rs-green-900);
  --rs-btn-ghost-hover-text:var(--rs-green-800);
  --rs-btn-ghost-active-border:var(--rs-green-900);
  --rs-btn-ghost-active-text:var(--rs-green-900);
  --rs-btn-link-text:var(--rs-green-700);
  --rs-btn-link-hover-text:var(--rs-green-800);
  --rs-btn-link-active-text:var(--rs-green-900);
  --rs-iconbtn-primary-addon:var(--rs-green-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-green-800);
  --rs-iconbtn-primary-pressed-addon:var(--rs-green-900);
}
[data-theme=dark] .rs-btn[data-color=green], .rs-theme-dark .rs-btn[data-color=green]{
  --rs-btn-primary-bg:var(--rs-green-700);
  --rs-btn-primary-hover-bg:var(--rs-green-500);
  --rs-btn-primary-active-bg:var(--rs-green-400);
  --rs-btn-primary-border-color:var(--rs-green-800);
  --rs-btn-subtle-hover-bg:var(--rs-green-600);
  --rs-btn-subtle-hover-text:#fff;
  --rs-btn-subtle-active-bg:var(--rs-green-400);
  --rs-btn-subtle-active-text:#fff;
  --rs-btn-ghost-border:var(--rs-green-500);
  --rs-btn-ghost-text:var(--rs-green-500);
  --rs-btn-ghost-hover-border:var(--rs-green-400);
  --rs-btn-ghost-hover-text:var(--rs-green-400);
  --rs-btn-ghost-active-border:var(--rs-green-200);
  --rs-btn-ghost-active-text:var(--rs-green-200);
  --rs-btn-link-text:var(--rs-green-500);
  --rs-btn-link-hover-text:var(--rs-green-400);
  --rs-btn-link-active-text:var(--rs-green-200);
  --rs-iconbtn-primary-addon:var(--rs-green-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-green-400);
  --rs-iconbtn-primary-pressed-addon:var(--rs-green-300);
}
[data-theme=high-contrast] .rs-btn[data-color=green], .rs-theme-high-contrast .rs-btn[data-color=green]{
  --rs-btn-primary-bg:var(--rs-green-700);
  --rs-btn-primary-hover-bg:var(--rs-green-600);
  --rs-btn-primary-active-bg:var(--rs-green-400);
  --rs-btn-subtle-hover-bg:var(--rs-green-600);
  --rs-btn-subtle-hover-text:var(--rs-gray-900);
  --rs-btn-subtle-active-bg:var(--rs-green-400);
  --rs-btn-subtle-active-text:var(--rs-gray-900);
  --rs-btn-ghost-border:var(--rs-green-500);
  --rs-btn-ghost-text:var(--rs-green-500);
  --rs-btn-ghost-hover-border:var(--rs-green-400);
  --rs-btn-ghost-hover-text:var(--rs-green-400);
  --rs-btn-ghost-active-border:var(--rs-green-200);
  --rs-btn-ghost-active-text:var(--rs-green-200);
  --rs-btn-link-text:var(--rs-green-500);
  --rs-btn-link-hover-text:var(--rs-green-400);
  --rs-btn-link-active-text:var(--rs-green-200);
}

.rs-btn[data-color=cyan]{
  --rs-btn-primary-bg:var(--rs-cyan-500);
  --rs-btn-primary-hover-bg:var(--rs-cyan-700);
  --rs-btn-primary-active-bg:var(--rs-cyan-800);
  --rs-btn-primary-border-color:var(--rs-cyan-700);
  --rs-btn-subtle-hover-bg:var(--rs-cyan-500);
  --rs-btn-subtle-hover-text:var(--rs-body-200);
  --rs-btn-subtle-active-bg:var(--rs-cyan-600);
  --rs-btn-subtle-active-text:var(--rs-body-800);
  --rs-btn-ghost-border:var(--rs-cyan-700);
  --rs-btn-ghost-text:var(--rs-cyan-700);
  --rs-btn-ghost-hover-border:var(--rs-cyan-900);
  --rs-btn-ghost-hover-text:var(--rs-cyan-800);
  --rs-btn-ghost-active-border:var(--rs-cyan-900);
  --rs-btn-ghost-active-text:var(--rs-cyan-900);
  --rs-btn-link-text:var(--rs-cyan-700);
  --rs-btn-link-hover-text:var(--rs-cyan-800);
  --rs-btn-link-active-text:var(--rs-cyan-900);
  --rs-iconbtn-primary-addon:var(--rs-cyan-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-cyan-800);
  --rs-iconbtn-primary-pressed-addon:var(--rs-cyan-900);
}
[data-theme=dark] .rs-btn[data-color=cyan], .rs-theme-dark .rs-btn[data-color=cyan]{
  --rs-btn-primary-bg:var(--rs-cyan-700);
  --rs-btn-primary-hover-bg:var(--rs-cyan-500);
  --rs-btn-primary-active-bg:var(--rs-cyan-400);
  --rs-btn-primary-border-color:var(--rs-cyan-800);
  --rs-btn-subtle-hover-bg:var(--rs-cyan-600);
  --rs-btn-subtle-hover-text:#fff;
  --rs-btn-subtle-active-bg:var(--rs-cyan-400);
  --rs-btn-subtle-active-text:#fff;
  --rs-btn-ghost-border:var(--rs-cyan-500);
  --rs-btn-ghost-text:var(--rs-cyan-500);
  --rs-btn-ghost-hover-border:var(--rs-cyan-400);
  --rs-btn-ghost-hover-text:var(--rs-cyan-400);
  --rs-btn-ghost-active-border:var(--rs-cyan-200);
  --rs-btn-ghost-active-text:var(--rs-cyan-200);
  --rs-btn-link-text:var(--rs-cyan-500);
  --rs-btn-link-hover-text:var(--rs-cyan-400);
  --rs-btn-link-active-text:var(--rs-cyan-200);
  --rs-iconbtn-primary-addon:var(--rs-cyan-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-cyan-400);
  --rs-iconbtn-primary-pressed-addon:var(--rs-cyan-300);
}
[data-theme=high-contrast] .rs-btn[data-color=cyan], .rs-theme-high-contrast .rs-btn[data-color=cyan]{
  --rs-btn-primary-bg:var(--rs-cyan-700);
  --rs-btn-primary-hover-bg:var(--rs-cyan-600);
  --rs-btn-primary-active-bg:var(--rs-cyan-400);
  --rs-btn-subtle-hover-bg:var(--rs-cyan-600);
  --rs-btn-subtle-hover-text:var(--rs-gray-900);
  --rs-btn-subtle-active-bg:var(--rs-cyan-400);
  --rs-btn-subtle-active-text:var(--rs-gray-900);
  --rs-btn-ghost-border:var(--rs-cyan-500);
  --rs-btn-ghost-text:var(--rs-cyan-500);
  --rs-btn-ghost-hover-border:var(--rs-cyan-400);
  --rs-btn-ghost-hover-text:var(--rs-cyan-400);
  --rs-btn-ghost-active-border:var(--rs-cyan-200);
  --rs-btn-ghost-active-text:var(--rs-cyan-200);
  --rs-btn-link-text:var(--rs-cyan-500);
  --rs-btn-link-hover-text:var(--rs-cyan-400);
  --rs-btn-link-active-text:var(--rs-cyan-200);
}

.rs-btn[data-color=blue]{
  --rs-btn-primary-bg:var(--rs-blue-500);
  --rs-btn-primary-hover-bg:var(--rs-blue-700);
  --rs-btn-primary-active-bg:var(--rs-blue-800);
  --rs-btn-primary-border-color:var(--rs-blue-700);
  --rs-btn-subtle-hover-bg:var(--rs-blue-500);
  --rs-btn-subtle-hover-text:var(--rs-body-200);
  --rs-btn-subtle-active-bg:var(--rs-blue-600);
  --rs-btn-subtle-active-text:var(--rs-body-800);
  --rs-btn-ghost-border:var(--rs-blue-700);
  --rs-btn-ghost-text:var(--rs-blue-700);
  --rs-btn-ghost-hover-border:var(--rs-blue-900);
  --rs-btn-ghost-hover-text:var(--rs-blue-800);
  --rs-btn-ghost-active-border:var(--rs-blue-900);
  --rs-btn-ghost-active-text:var(--rs-blue-900);
  --rs-btn-link-text:var(--rs-blue-700);
  --rs-btn-link-hover-text:var(--rs-blue-800);
  --rs-btn-link-active-text:var(--rs-blue-900);
  --rs-iconbtn-primary-addon:var(--rs-blue-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-blue-800);
  --rs-iconbtn-primary-pressed-addon:var(--rs-blue-900);
}
[data-theme=dark] .rs-btn[data-color=blue], .rs-theme-dark .rs-btn[data-color=blue]{
  --rs-btn-primary-bg:var(--rs-blue-700);
  --rs-btn-primary-hover-bg:var(--rs-blue-500);
  --rs-btn-primary-active-bg:var(--rs-blue-400);
  --rs-btn-primary-border-color:var(--rs-blue-800);
  --rs-btn-subtle-hover-bg:var(--rs-blue-600);
  --rs-btn-subtle-hover-text:#fff;
  --rs-btn-subtle-active-bg:var(--rs-blue-400);
  --rs-btn-subtle-active-text:#fff;
  --rs-btn-ghost-border:var(--rs-blue-500);
  --rs-btn-ghost-text:var(--rs-blue-500);
  --rs-btn-ghost-hover-border:var(--rs-blue-400);
  --rs-btn-ghost-hover-text:var(--rs-blue-400);
  --rs-btn-ghost-active-border:var(--rs-blue-200);
  --rs-btn-ghost-active-text:var(--rs-blue-200);
  --rs-btn-link-text:var(--rs-blue-500);
  --rs-btn-link-hover-text:var(--rs-blue-400);
  --rs-btn-link-active-text:var(--rs-blue-200);
  --rs-iconbtn-primary-addon:var(--rs-blue-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-blue-400);
  --rs-iconbtn-primary-pressed-addon:var(--rs-blue-300);
}
[data-theme=high-contrast] .rs-btn[data-color=blue], .rs-theme-high-contrast .rs-btn[data-color=blue]{
  --rs-btn-primary-bg:var(--rs-blue-700);
  --rs-btn-primary-hover-bg:var(--rs-blue-600);
  --rs-btn-primary-active-bg:var(--rs-blue-400);
  --rs-btn-subtle-hover-bg:var(--rs-blue-600);
  --rs-btn-subtle-hover-text:var(--rs-gray-900);
  --rs-btn-subtle-active-bg:var(--rs-blue-400);
  --rs-btn-subtle-active-text:var(--rs-gray-900);
  --rs-btn-ghost-border:var(--rs-blue-500);
  --rs-btn-ghost-text:var(--rs-blue-500);
  --rs-btn-ghost-hover-border:var(--rs-blue-400);
  --rs-btn-ghost-hover-text:var(--rs-blue-400);
  --rs-btn-ghost-active-border:var(--rs-blue-200);
  --rs-btn-ghost-active-text:var(--rs-blue-200);
  --rs-btn-link-text:var(--rs-blue-500);
  --rs-btn-link-hover-text:var(--rs-blue-400);
  --rs-btn-link-active-text:var(--rs-blue-200);
}

.rs-btn[data-color=violet]{
  --rs-btn-primary-bg:var(--rs-violet-500);
  --rs-btn-primary-hover-bg:var(--rs-violet-700);
  --rs-btn-primary-active-bg:var(--rs-violet-800);
  --rs-btn-primary-border-color:var(--rs-violet-700);
  --rs-btn-subtle-hover-bg:var(--rs-violet-500);
  --rs-btn-subtle-hover-text:var(--rs-body-200);
  --rs-btn-subtle-active-bg:var(--rs-violet-600);
  --rs-btn-subtle-active-text:var(--rs-body-800);
  --rs-btn-ghost-border:var(--rs-violet-700);
  --rs-btn-ghost-text:var(--rs-violet-700);
  --rs-btn-ghost-hover-border:var(--rs-violet-900);
  --rs-btn-ghost-hover-text:var(--rs-violet-800);
  --rs-btn-ghost-active-border:var(--rs-violet-900);
  --rs-btn-ghost-active-text:var(--rs-violet-900);
  --rs-btn-link-text:var(--rs-violet-700);
  --rs-btn-link-hover-text:var(--rs-violet-800);
  --rs-btn-link-active-text:var(--rs-violet-900);
  --rs-iconbtn-primary-addon:var(--rs-violet-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-violet-800);
  --rs-iconbtn-primary-pressed-addon:var(--rs-violet-900);
}
[data-theme=dark] .rs-btn[data-color=violet], .rs-theme-dark .rs-btn[data-color=violet]{
  --rs-btn-primary-bg:var(--rs-violet-700);
  --rs-btn-primary-hover-bg:var(--rs-violet-500);
  --rs-btn-primary-active-bg:var(--rs-violet-400);
  --rs-btn-primary-border-color:var(--rs-violet-800);
  --rs-btn-subtle-hover-bg:var(--rs-violet-600);
  --rs-btn-subtle-hover-text:#fff;
  --rs-btn-subtle-active-bg:var(--rs-violet-400);
  --rs-btn-subtle-active-text:#fff;
  --rs-btn-ghost-border:var(--rs-violet-500);
  --rs-btn-ghost-text:var(--rs-violet-500);
  --rs-btn-ghost-hover-border:var(--rs-violet-400);
  --rs-btn-ghost-hover-text:var(--rs-violet-400);
  --rs-btn-ghost-active-border:var(--rs-violet-200);
  --rs-btn-ghost-active-text:var(--rs-violet-200);
  --rs-btn-link-text:var(--rs-violet-500);
  --rs-btn-link-hover-text:var(--rs-violet-400);
  --rs-btn-link-active-text:var(--rs-violet-200);
  --rs-iconbtn-primary-addon:var(--rs-violet-600);
  --rs-iconbtn-primary-activated-addon:var(--rs-violet-400);
  --rs-iconbtn-primary-pressed-addon:var(--rs-violet-300);
}
[data-theme=high-contrast] .rs-btn[data-color=violet], .rs-theme-high-contrast .rs-btn[data-color=violet]{
  --rs-btn-primary-bg:var(--rs-violet-700);
  --rs-btn-primary-hover-bg:var(--rs-violet-600);
  --rs-btn-primary-active-bg:var(--rs-violet-400);
  --rs-btn-subtle-hover-bg:var(--rs-violet-600);
  --rs-btn-subtle-hover-text:var(--rs-gray-900);
  --rs-btn-subtle-active-bg:var(--rs-violet-400);
  --rs-btn-subtle-active-text:var(--rs-gray-900);
  --rs-btn-ghost-border:var(--rs-violet-500);
  --rs-btn-ghost-text:var(--rs-violet-500);
  --rs-btn-ghost-hover-border:var(--rs-violet-400);
  --rs-btn-ghost-hover-text:var(--rs-violet-400);
  --rs-btn-ghost-active-border:var(--rs-violet-200);
  --rs-btn-ghost-active-text:var(--rs-violet-200);
  --rs-btn-link-text:var(--rs-violet-500);
  --rs-btn-link-hover-text:var(--rs-violet-400);
  --rs-btn-link-active-text:var(--rs-violet-200);
}

.rs-btn[data-block=true]{
  width:100%;
}
.rs-btn[data-block=true] + .rs-btn[data-block=true]{
  margin-top:5px;
}

.rs-btn[data-loading=true]{
  color:transparent !important;
  position:relative;
  cursor:default;
  pointer-events:none;
}
.rs-btn[data-loading=true] > .rs-btn-spin::before, .rs-btn[data-loading=true] > .rs-btn-spin::after{
  content:"";
  position:absolute;
  width:var(--rs-btn-loading-spin-default-diameter);
  height:var(--rs-btn-loading-spin-default-diameter);
  margin:auto;
  top:0;
  bottom:0;
  inset-inline-end:0;
  inset-inline-start:0;
  border-radius:var(--rs-radius-full);
  z-index:1;
}
.rs-btn[data-size=xs] .rs-btn[data-loading=true] > .rs-btn-spin::before, .rs-btn[data-size=xs] .rs-btn[data-loading=true] > .rs-btn-spin::after{
  width:var(--rs-btn-loading-spin-xs-diameter);
  height:var(--rs-btn-loading-spin-xs-diameter);
}
.rs-btn[data-loading=true] > .rs-btn-spin::before{
  border:var(--rs-btn-loading-spin-ring-wide) solid var(--rs-loader-ring);
}
.rs-btn[data-appearance=primary] .rs-btn[data-loading=true] > .rs-btn-spin::before{
  border-color:rgba(248, 247, 250, 0.3);
}
[data-theme=high-contrast] .rs-btn[data-appearance=primary] .rs-btn[data-loading=true] > .rs-btn-spin::before, .rs-theme-high-contrast .rs-btn[data-appearance=primary] .rs-btn[data-loading=true] > .rs-btn-spin::before{
  border-color:var(--rs-loader-ring-inverse);
}
.rs-btn[data-loading=true] > .rs-btn-spin::after{
  border-width:var(--rs-btn-loading-spin-ring-wide);
  border-color:var(--rs-loader-rotor) transparent transparent;
  border-style:solid;
  animation:buttonSpin 0.6s infinite linear;
}
.rs-btn[data-appearance=primary] .rs-btn[data-loading=true] > .rs-btn-spin::after{
  border-top-color:#fff;
}
[data-theme=high-contrast] .rs-btn[data-appearance=primary] .rs-btn[data-loading=true] > .rs-btn-spin::after, .rs-theme-high-contrast .rs-btn[data-appearance=primary] .rs-btn[data-loading=true] > .rs-btn-spin::after{
  border-top-color:var(--rs-loader-rotor-inverse);
}
@keyframes buttonSpin{
  from{
    transform:rotate(0);
  }
  to{
    transform:rotate(360deg);
  }
}

.rs-btn-icon{
  padding:calc((var(--rs-btn-size) - var(--rs-btn-icon-size)) / 2);
  line-height:var(--rs-btn-icon-size);
}
.rs-btn-icon > .rs-icon{
  font-size:var(--rs-btn-icon-size);
  vertical-align:bottom;
}
.rs-btn-icon:not([data-with-text]){
  width:var(--rs-btn-size);
}
.rs-btn-icon[data-shape=circle]{
  border-radius:var(--rs-radius-full);
}

.rs-btn-icon[data-with-text] > .rs-icon{
  position:absolute;
  top:0;
  display:block;
  background-color:var(--rs-iconbtn-addon);
  transition:var(--rs-btn-transition);
  width:var(--rs-btn-size);
  height:var(--rs-btn-size);
  padding:calc((var(--rs-btn-size) - var(--rs-btn-icon-size)) / 2);
}
.rs-btn-icon[data-with-text]:where([data-placement=start], [data-placement=left]){
  padding-inline-start:calc(var(--rs-btn-padding-inline) + var(--rs-btn-size));
}
.rs-btn-icon[data-with-text]:where([data-placement=start], [data-placement=left]) > .rs-icon{
  inset-inline-start:0;
  border-right-width:1px;
}
.rs-btn-icon[data-with-text]:where([data-placement=end], [data-placement=right]){
  padding-inline-end:calc(var(--rs-btn-padding-inline) + var(--rs-btn-size));
}
.rs-btn-icon[data-with-text]:where([data-placement=end], [data-placement=right]) > .rs-icon{
  inset-inline-end:0;
}
.rs-btn-icon[data-with-text]:hover > .rs-icon{
  background-color:var(--rs-iconbtn-activated-addon);
}
.rs-btn-icon[data-with-text]:active > .rs-icon, .rs-btn-icon[data-with-text].rs-btn[data-active=true] > .rs-icon{
  background-color:var(--rs-iconbtn-pressed-addon);
}
.rs-btn-icon[data-with-text]:disabled > .rs-icon, .rs-btn-icon[data-with-text].rs-btn[data-disabled=true] > .rs-icon{
  background-color:var(--rs-iconbtn-addon);
}
[data-theme=high-contrast] .rs-btn-icon[data-with-text]:disabled, .rs-theme-high-contrast .rs-btn-icon[data-with-text]:disabled, [data-theme=high-contrast] .rs-btn-icon[data-with-text].rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn-icon[data-with-text].rs-btn[data-disabled=true]{
  border-color:var(--rs-btn-default-disabled-border-color);
}

.rs-btn-icon[data-with-text][data-appearance=primary] > .rs-icon{
  background-color:var(--rs-iconbtn-primary-addon);
}
.rs-btn-icon[data-with-text][data-appearance=primary]:hover > .rs-icon{
  background-color:var(--rs-iconbtn-primary-activated-addon);
}
.rs-btn-icon[data-with-text][data-appearance=primary]:active > .rs-icon, .rs-btn-icon[data-with-text][data-appearance=primary].rs-btn[data-active=true] > .rs-icon{
  background-color:var(--rs-iconbtn-primary-pressed-addon);
}
.rs-btn-icon[data-with-text][data-appearance=primary]:disabled > .rs-icon, .rs-btn-icon[data-with-text][data-appearance=primary].rs-btn[data-disabled=true] > .rs-icon{
  background-color:var(--rs-iconbtn-primary-addon);
}
[data-theme=high-contrast] .rs-btn-icon[data-with-text][data-appearance=primary]:disabled, .rs-theme-high-contrast .rs-btn-icon[data-with-text][data-appearance=primary]:disabled, [data-theme=high-contrast] .rs-btn-icon[data-with-text][data-appearance=primary].rs-btn[data-disabled=true], .rs-theme-high-contrast .rs-btn-icon[data-with-text][data-appearance=primary].rs-btn[data-disabled=true]{
  border-color:var(--rs-btn-default-disabled-border-color);
}

.rs-btn-close{
  border:none;
  outline:none !important;
  background:transparent;
  line-height:1;
  cursor:pointer;
}
.rs-btn-close .rs-icon{
  vertical-align:bottom;
}

:root{
  --rs-picker-transition:var(--rs-input-transition);
  --rs-picker-menu-padding:12px;
}

.rs-picker{
  --rs-picker-value-count-margin:var(--rs-spacing);
  --rs-picker-loader-size:20px;
  --rs-picker-toggle-border-width:1px;
  --rs-picker-toggle-bg:var(--rs-input-bg);
  --rs-picker-toggle-border-color:var(--rs-border-primary);
  display:inline-block;
  vertical-align:middle;
  max-width:100%;
}
.rs-picker[data-block=true]{
  display:block;
  width:100%;
}
.rs-picker[data-disabled=true]{
  cursor:not-allowed;
}
.rs-picker[data-disabled=true] .rs-picker-toggle-value,
.rs-picker[data-disabled=true] .rs-picker-toggle-indicator,
.rs-picker[data-disabled=true] .rs-picker-tag-list .rs-tag{
  color:var(--rs-text-disabled) !important;
}
.rs-picker[data-disabled=true] .rs-picker-value-count{
  opacity:0.5;
}
.rs-picker[data-disabled=true] .rs-picker-toggle{
  pointer-events:none;
}
.rs-picker-toggle .rs-picker-toggle-placeholder{
  color:var(--rs-text-secondary);
}
.rs-picker-has-value .rs-btn .rs-picker-toggle-value, .rs-picker-has-value .rs-picker-toggle .rs-picker-toggle-value{
  color:var(--rs-picker-value);
}
.rs-picker-value-list{
  flex:0 1 auto;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.rs-picker .rs-picker-value-count{
  margin-inline:var(--rs-picker-value-count-margin);
  background-color:var(--rs-picker-count-bg);
  color:var(--rs-picker-count-text);
  flex-shrink:0;
}
.rs-picker-value-separator{
  margin:0 var(--rs-spacing) 0 0;
}
.rs-picker[data-focus=true]{
  border-color:var(--rs-input-focus-border);
}
.rs-picker-toggle[data-active=true], .rs-picker[data-focus=true]{
  --rs-picker-toggle-border-color:var(--rs-input-focus-border);
  outline:2px solid var(--rs-focus-ring-color);
  outline-offset:-1px;
}
.rs-picker-label.rs-input-group-addon{
  color:var(--rs-text-primary);
  padding-inline:calc(var(--rs-input-group-inside-btn-padding) * 2 - var(--rs-picker-toggle-border-width));
}
.rs-picker-loader{
  width:var(--rs-picker-loader-size);
  height:var(--rs-picker-loader-size);
  display:flex;
  align-items:center;
}
.rs-picker-error > .rs-picker-input-group,.rs-picker-error > .rs-picker-input-group:hover{
  border-color:var(--rs-picker-state-error);
}
.rs-picker-error > .rs-picker-input-group:focus-within{
  border-color:var(--rs-picker-state-error);
  outline:var(--rs-picker-state-error-outline);
}

.rs-picker-popup{
  --rs-picker-popup-none-padding:calc(var(--rs-spacing) * 3);
  --rs-picker-popup-border-radius:var(--rs-radius-md);
  --rs-picker-search-box-padding:calc(var(--rs-spacing) * 1.5) calc(var(--rs-spacing) * 3);
  --rs-picker-popup-z-index:var(--rs-zindex-picker-popup);
  --rs-picker-popup-shadow:var(--rs-shadow-md);
  --rs-picker-popup-position-x:var(--rs-position-x);
  --rs-picker-popup-position-y:var(--rs-position-y);
  --rs-picker-min-width:0;
  position:absolute;
  top:var(--rs-picker-popup-position-y);
  left:var(--rs-picker-popup-position-x);
  text-align:start;
  overflow:hidden;
  transition:none;
  display:flex;
  flex-direction:column;
  z-index:var(--rs-picker-popup-z-index);
  border-radius:var(--rs-picker-popup-border-radius);
  background-color:var(--rs-bg-overlay);
  box-shadow:var(--rs-picker-popup-shadow);
  padding-block:var(--rs-picker-popup-border-radius);
  min-width:var(--rs-picker-min-width);
}
[data-theme=high-contrast] .rs-picker-popup, .rs-theme-high-contrast .rs-picker-popup{
  border:1px solid var(--rs-border-primary);
}
.rs-modal-open .rs-picker-popup{
  --rs-picker-popup-z-index:calc(var(--rs-zindex-modal) + var(--rs-zindex-picker-toggle));
}
.rs-drawer-open .rs-picker-popup{
  --rs-picker-popup-z-index:calc(var(--rs-zindex-drawer) + var(--rs-zindex-picker-toggle));
}
.rs-picker-popup.rs-picker-inline{
  position:relative;
  box-shadow:none;
}
.rs-picker-popup .rs-search-box{
  padding:var(--rs-picker-search-box-padding);
}
.rs-picker-popup .rs-highlight .rs-highlight-mark{
  padding:0;
}
.rs-picker-popup .rs-picker-none{
  padding:var(--rs-picker-popup-none-padding);
  color:var(--rs-text-secondary);
  cursor:default;
}
.rs-picker-popup .rs-picker-listbox{
  max-height:var(--rs-picker-listbox-max-height);
}
.rs-picker-popup[data-breakpoint=xs]{
  min-width:unset;
  width:100%;
  height:100%;
  overflow:auto;
}
.rs-picker-popup[data-breakpoint=xs] .rs-picker-listbox{
  height:unset;
  max-height:unset;
}
.rs-picker-popup[data-breakpoint=xs] .rs-tree,
.rs-picker-popup[data-breakpoint=xs] .rs-check-tree{
  display:flex;
  flex-direction:column;
}
.rs-picker-popup[data-breakpoint=xs] .rs-tree-view,
.rs-picker-popup[data-breakpoint=xs] .rs-check-tree-view{
  max-height:unset;
  flex:1 1 auto;
}
.rs-picker-popup[data-breakpoint=xs] .rs-calendar-table{
  width:100%;
}
.rs-picker-popup[data-breakpoint=xs] .rs-picker-box{
  width:100%;
  height:100%;
  flex:1;
  display:flex;
  flex-direction:column;
}
.rs-picker-popup[data-breakpoint=xs].rs-picker-popup-date .rs-calendar,
.rs-picker-popup[data-breakpoint=xs] .rs-picker-daterange-panel-only-time .rs-calendar{
  height:348px;
}
[data-appearance=default] .rs-picker-toggle{
  color:var(--rs-text-primary);
  border-width:var(--rs-picker-toggle-border-width);
  border-color:var(--rs-picker-toggle-border-color);
  border-style:solid;
}
[data-disabled=true] .rs-picker-toggle{
  cursor:var(--rs-cursor-disabled);
}
.rs-picker-toggle [data-appearance=default]:not([data-disabled=true]):focus{
  border-color:var(--rs-input-focus-border);
}
.rs-picker[data-appearance=subtle] .rs-picker-toggle{
  --rs-picker-toggle-border-width:0px;
  position:relative;
  z-index:var(--rs-zindex-dropdown);
}
.rs-picker[data-appearance=subtle][data-disabled=true] .rs-picker-toggle{
  cursor:var(--rs-cursor-disabled);
}
.rs-picker[data-appearance=subtle][data-disabled=true] .rs-picker-toggle:focus, .rs-picker[data-appearance=subtle][data-disabled=true] .rs-picker-toggle:active{
  background:none;
}
.rs-picker[data-appearance=subtle][data-disabled=true] .rs-picker-toggle:focus::after, .rs-picker[data-appearance=subtle][data-disabled=true] .rs-picker-toggle:active::after{
  display:none;
}
.rs-picker-toggle-label{
  color:var(--rs-text-secondary);
}
.rs-picker-toggle .rs-picker-toggle-stack{
  flex:1 1 auto;
  gap:calc(var(--rs-spacing) * 2);
  overflow:hidden;
  align-items:center;
}
.rs-picker-toggle-value{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  width:100%;
}
.rs-picker-toggle-textbox{
  position:absolute;
  width:100%;
  height:100%;
  inset-inline-start:0;
  top:0;
  border:1px solid rgba(0, 0, 0, 0);
  padding-inline-start:10px;
  padding-inline-end:32px;
  color:var(--rs-text-primary);
  background-color:var(--rs-input-bg);
  outline:none;
}
.rs-picker-toggle-textbox:where([readonly]){
  opacity:0;
}
.rs-picker-toggle:where([data-size=lg]) .rs-picker-toggle-textbox{
  padding-inline-start:14px;
}
.rs-picker-toggle:where([data-size=sm]) .rs-picker-toggle-textbox{
  padding-inline-start:8px;
}
.rs-picker-toggle:where([data-size=xs]) .rs-picker-toggle-textbox{
  padding-inline-start:6px;
}
.rs-picker-toggle .rs-picker[data-appearance=default], .rs-picker-toggle{
  transition:var(--rs-picker-transition);
}
[data-theme=high-contrast] .rs-picker-toggle .rs-picker[data-appearance=default], .rs-theme-high-contrast .rs-picker-toggle .rs-picker[data-appearance=default], [data-theme=high-contrast] .rs-picker-toggle, .rs-theme-high-contrast .rs-picker-toggle{
  transition:none;
}
.rs-picker-toggle .rs-picker[data-appearance=default]:focus{
  border-color:var(--rs-input-focus-border);
}
.rs-picker[data-appearance=subtle] .rs-picker-toggle{
  color:var(--rs-btn-subtle-text);
  background-color:transparent;
  transition:none;
}
.rs-picker[data-appearance=subtle] .rs-picker-toggle:hover,.rs-picker[data-appearance=subtle] .rs-picker-toggle[data-active=true]{
  color:var(--rs-btn-subtle-hover-text);
  background-color:var(--rs-btn-subtle-hover-bg);
}
.rs-picker-toggle[data-size=lg] .rs-picker-clean .rs-icon{
  width:16px;
  height:16px;
}
.rs-picker-toggle[data-size=sm] .rs-picker-clean{
  height:18px;
}
.rs-picker-toggle[data-size=xs] .rs-picker-clean{
  height:18px;
}
.rs-picker-toggle[data-size=xs] .rs-picker-clean .rs-icon{
  width:12px;
  height:12px;
}
.rs-picker-toggle[data-countable=true] .rs-picker-toggle-value{
  display:flex;
  align-items:center;
}

.rs-picker-toggle.rs-btn{
  text-align:start;
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  padding-inline:calc(var(--rs-btn-padding-inline) - var(--rs-picker-toggle-border-width));
}
[data-block=true] .rs-picker-toggle.rs-btn{
  display:flex;
}

.rs-picker-toggle-indicator{
  display:inline-flex;
  align-items:center;
}
.rs-picker-toggle-indicator .rs-picker-clean{
  color:var(--rs-text-secondary);
  transition:0.2s color linear;
  cursor:pointer;
}
.rs-picker-toggle-indicator .rs-picker-clean:hover{
  color:var(--rs-text-primary);
}
.rs-picker-toggle-indicator .rs-picker-clean.rs-btn-close{
  padding:0;
}
.rs-picker-toggle-indicator .rs-picker-caret-icon{
  display:inline-flex;
  align-items:center;
  height:var(--rs-line-height-base);
  font-size:var(--rs-font-size-sm);
  font-size:var(--rs-font-size-md);
  color:var(--rs-text-secondary);
}

.rs-picker[data-appearance=default] .rs-btn,
.rs-picker[data-appearance=default] .rs-picker-toggle,
.rs-picker-input .rs-btn,
.rs-picker-input .rs-picker-toggle{
  background-color:var(--rs-picker-toggle-bg);
}
.rs-picker[data-appearance=default][data-disabled=true],
.rs-picker-input[data-disabled=true]{
  --rs-picker-toggle-bg:var(--rs-input-disabled-bg);
}
.rs-picker[data-appearance=default][data-disabled=true] .rs-input-group,
.rs-picker-input[data-disabled=true] .rs-input-group{
  pointer-events:none;
}
.rs-check-item:not(.rs-checkbox-disabled):hover, .rs-check-item:focus, .rs-check-item.rs-check-item-focus{
  background-color:var(--rs-listbox-option-hover-bg);
  color:var(--rs-listbox-option-hover-text);
}
[data-theme=high-contrast] .rs-check-item:not(.rs-checkbox-disabled):hover, .rs-theme-high-contrast .rs-check-item:not(.rs-checkbox-disabled):hover, [data-theme=high-contrast] .rs-check-item:focus, .rs-theme-high-contrast .rs-check-item:focus, [data-theme=high-contrast] .rs-check-item.rs-check-item-focus, .rs-theme-high-contrast .rs-check-item.rs-check-item-focus{
  outline:2px solid var(--rs-focus-ring-color);
  outline-offset:-1px;
  outline-offset:-3px;
  outline-width:2px;
  color:var(--rs-listbox-option-hover-text);
  text-decoration:underline;
}
[data-theme=high-contrast] .rs-check-item:not(.rs-checkbox-disabled):hover .rs-check-tree-node-text-wrapper, .rs-theme-high-contrast .rs-check-item:not(.rs-checkbox-disabled):hover .rs-check-tree-node-text-wrapper, [data-theme=high-contrast] .rs-check-item:focus .rs-check-tree-node-text-wrapper, .rs-theme-high-contrast .rs-check-item:focus .rs-check-tree-node-text-wrapper, [data-theme=high-contrast] .rs-check-item.rs-check-item-focus .rs-check-tree-node-text-wrapper, .rs-theme-high-contrast .rs-check-item.rs-check-item-focus .rs-check-tree-node-text-wrapper{
  text-decoration:underline;
}
.rs-check-item .rs-checkbox-checker{
  display:flex;
}
.rs-check-item .rs-checkbox-checker > label{
  cursor:pointer;
  width:100%;
  padding-inline:var(--rs-check-item-padding-inline);
  padding-block:var(--rs-check-item-padding-block);
}
[data-theme=high-contrast] .rs-check-item .rs-checkbox-checker > label, .rs-theme-high-contrast .rs-check-item .rs-checkbox-checker > label{
  transition:none;
}
.rs-check-item .rs-checkbox-checker > label::before{
  background-color:var(--rs-bg-overlay);
}
[data-theme=high-contrast] .rs-check-item .rs-checkbox-checker > label::before, .rs-theme-high-contrast .rs-check-item .rs-checkbox-checker > label::before{
  background:none;
}
.rs-check-item .rs-checkbox-checker > label[data-disabled=true]{
  cursor:not-allowed;
}

.rs-picker-menu-group{
  background-color:var(--rs-listbox-option-group-bg);
  position:sticky;
  top:-1px;
  z-index:1;
}

.rs-virt-list .rs-picker-select-menu-item,
.rs-virt-list .rs-check-item label,.rs-tree-virt-list .rs-tree-node-label{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

:root{
  --rs-calendar-cell-font-size:var(--rs-font-size-sm);
  --rs-calendar-cell-line-height:var(--rs-line-height-md);
  --rs-calendar-cell-padding:5px;
  --rs-calendar-border-radius:var(--rs-radius-md);
  --rs-calendar-table-width:100%;
  --rs-calendar-panel-today-active-side-length:var(--rs-line-height-base);
  --rs-calendar-panel-compact-cell-height:38px;
  --rs-calendar-panel-cell-height:100px;
  --rs-calendar-dropdown-top:44px;
  --rs-calendar-table-cell-padding:1px;
  --rs-calendar-header-title-margin:4px;
  --rs-calendar-body-padding-top:4px;
  --rs-calendar-base-spacing:10px;
  --rs-calendar-header-width:280px;
}

.rs-calendar{
  padding-top:var(--rs-calendar-base-spacing);
  position:relative;
  min-height:266px;
  overflow:hidden;
}
.rs-calendar-bordered .rs-calendar-table{
  border:1px solid var(--rs-border-primary);
  border-radius:var(--rs-calendar-border-radius);
}
.rs-calendar-bordered .rs-calendar-table-row:not(:last-child) .rs-calendar-table-cell, .rs-calendar-bordered .rs-calendar-table-header-row .rs-calendar-table-header-cell{
  border-bottom:1px solid var(--rs-border-secondary);
}
.rs-calendar-bordered .rs-calendar-month-dropdown{
  border:1px solid var(--rs-border-primary);
  border-radius:var(--rs-calendar-border-radius);
}
.rs-calendar-panel .rs-calendar-header{
  width:100%;
  padding-bottom:6px;
}
.rs-calendar-panel .rs-calendar-header::before, .rs-calendar-panel .rs-calendar-header::after{
  content:" ";
  display:table;
}
.rs-calendar-panel .rs-calendar-header::after{
  clear:both;
}
.rs-calendar-panel .rs-calendar-header .rs-calendar-btn-today{
  float:inline-end;
}
.rs-calendar-panel .rs-calendar-header-forward, .rs-calendar-panel .rs-calendar-header-backward{
  float:none !important;
}
.rs-calendar-panel.rs-calendar-month-view .rs-calendar-header-forward, .rs-calendar-panel.rs-calendar-month-view .rs-calendar-header-backward{
  display:inline-block;
  visibility:hidden;
  pointer-events:none;
}
.rs-calendar-panel .rs-calendar-header-month-toolbar{
  width:auto !important;
}
.rs-calendar-panel.rs-calendar-month-view .rs-calendar-header-month-toolbar,.rs-calendar-panel .rs-calendar-month-view{
  padding-inline-start:0;
  padding-inline-end:0;
}
.rs-calendar-panel .rs-calendar-table-header-row .rs-calendar-table-header-cell-content{
  padding-top:8px;
  padding-bottom:8px;
}
.rs-calendar-panel .rs-calendar-table-cell-is-today .rs-calendar-table-cell-day{
  color:var(--rs-calendar-today-text);
  width:var(--rs-calendar-panel-today-active-side-length);
  height:var(--rs-calendar-panel-today-active-side-length);
  background-color:var(--rs-calendar-today-bg);
  border-radius:var(--rs-radius-full);
  margin-inline-start:auto;
  margin-inline-end:auto;
}
.rs-calendar-panel .rs-calendar-table-cell-is-today .rs-calendar-table-cell-content{
  box-shadow:none;
}
.rs-calendar-panel .rs-calendar-table-cell-selected .rs-calendar-table-cell-content{
  background-color:inherit;
  color:inherit;
  box-shadow:inset 0 0 0 1px var(--rs-input-focus-border);
}
.rs-calendar-panel .rs-calendar-table-cell-day{
  display:block;
  text-align:center;
}
.rs-calendar-panel .rs-calendar-month-dropdown{
  margin-inline-start:10px;
  margin-inline-end:10px;
  border-radius:var(--rs-radius-md);
  width:calc(100% - 20px);
}
.rs-calendar-panel:not(.rs-calendar-compact) .rs-calendar-table-row:not(.rs-calendar-table-header-row) .rs-calendar-table-cell-content{
  width:100%;
  height:var(--rs-calendar-panel-cell-height);
  overflow:hidden;
}
.rs-calendar-panel:not(.rs-calendar-compact) .rs-calendar-table-cell{
  vertical-align:top;
}
.rs-calendar-panel .rs-calendar-table-cell{
  padding:0 1px;
  line-height:0;
}
.rs-calendar-panel .rs-calendar-table-cell-content{
  width:100%;
  border-radius:var(--rs-radius-none);
}
.rs-calendar-panel .rs-calendar-table-row:last-child :first-child .rs-calendar-table-cell-content{
  border-bottom-left-radius:var(--rs-radius-md);
}
.rs-calendar-panel .rs-calendar-table-row:last-child :last-child .rs-calendar-table-cell-content{
  border-bottom-right-radius:var(--rs-radius-md);
}
.rs-calendar-panel.rs-calendar-compact .rs-calendar-table-row:not(.rs-calendar-table-header-row) .rs-calendar-table-cell-content{
  min-height:var(--rs-calendar-panel-compact-cell-height);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
}
.rs-calendar-btn-close{
  position:absolute;
  bottom:0;
  inset-inline-start:0;
  inset-inline-end:0;
  height:14px;
  padding:0;
  border:0;
  display:flex;
  justify-content:center;
  background:var(--rs-bg-overlay);
  z-index:1;
}
.rs-calendar-btn-close:hover{
  background-color:var(--rs-btn-subtle-hover-bg);
}
.rs-calendar-panel .rs-calendar-btn-close{
  bottom:4px;
  margin:0 11px;
  border-bottom-left-radius:var(--rs-radius-md);
  border-bottom-right-radius:var(--rs-radius-md);
}
.rs-calendar-panel.rs-calendar-bordered .rs-calendar-btn-close{
  bottom:5px;
}

.rs-calendar-month-view .rs-calendar-header-month-toolbar{
  padding-inline-start:24px;
  padding-inline-end:24px;
}
.rs-calendar-month-view .rs-calendar-header-backward,
.rs-calendar-month-view .rs-calendar-header-forward{
  display:none;
}
.rs-calendar-month-view .rs-calendar-header-title-date{
  color:var(--rs-text-active);
  background:transparent;
}
.rs-calendar-month-view .rs-calendar-header-title-date.rs-calendar-header-error{
  color:var(--rs-text-error);
}
.rs-calendar-month-view .rs-calendar-header-title-date.rs-calendar-header-error:focus, .rs-calendar-month-view .rs-calendar-header-title-date.rs-calendar-header-error:hover:active{
  color:#fff !important;
}

.rs-calendar-time-view .rs-calendar-header-title-time{
  color:var(--rs-text-active);
  background:transparent;
}
.rs-calendar-time-view .rs-calendar-header-title-time.rs-calendar-header-error{
  color:var(--rs-text-error);
}
.rs-calendar-time-view .rs-calendar-header-title-time.rs-calendar-header-error:hover:active{
  color:#fff;
}

.rs-calendar-table-cell-selected,
.rs-calendar-table-cell-in-range{
  position:relative;
}
.rs-calendar-table-cell-selected::before,
.rs-calendar-table-cell-in-range::before{
  content:"";
  display:block;
  width:100%;
  margin-top:4px;
  height:24px;
  position:absolute;
  z-index:calc(var(--rs-zindex-date-range-picker-table-cell-content) - 1);
  top:0;
}
.rs-calendar-table-cell-selected .rs-calendar-table-cell-content,
.rs-calendar-table-cell-in-range .rs-calendar-table-cell-content{
  z-index:var(--rs-zindex-date-range-picker-table-cell-content);
  position:relative;
}

.rs-calendar-table-cell-in-range::before{
  background-color:var(--rs-calendar-range-bg);
}

.rs-calendar-table-cell-in-range:hover::before{
  display:none;
}

.rs-calendar-month-dropdown-scroll div:focus{
  outline:none;
}

.rs-calendar-header{
  width:var(--rs-calendar-header-width);
  padding-inline-start:var(--rs-calendar-base-spacing);
  padding-inline-end:var(--rs-calendar-base-spacing);
}
.rs-calendar-header::before, .rs-calendar-header::after{
  content:" ";
  display:table;
}
.rs-calendar-header::after{
  clear:both;
}
.rs-calendar-header-month-toolbar, .rs-calendar-header-time-toolbar{
  display:inline-block;
}
.rs-calendar-header-month-toolbar{
  float:inline-start;
}
.rs-calendar-header-time-toolbar{
  float:inline-end;
}
.rs-calendar-header-title{
  margin:0 var(--rs-calendar-header-title-margin);
}
.rs-calendar-header-meridiem{
  font-size:var(--rs-font-size-xs);
  margin-inline-start:4px;
}
.rs-calendar-header-error{
  --rs-btn-subtle-text:var(--rs-red-500);
  --rs-btn-subtle-hover-bg:var(--rs-red-500);
  --rs-btn-subtle-hover-text:#fff;
  --rs-btn-subtle-active-bg:var(--rs-red-600);
  --rs-btn-subtle-active-text:#fff;
}
[data-theme=dark] .rs-calendar-header-error, .rs-theme-dark .rs-calendar-header-error{
  --rs-btn-subtle-hover-bg:var(--rs-red-600);
  --rs-btn-subtle-active-bg:var(--rs-red-400);
}
.rs-calendar-header-btn-disabled, .rs-calendar-header-btn-disabled:hover, .rs-calendar-header-btn-disabled:hover:focus{
  cursor:not-allowed;
  opacity:0.3;
  background:none;
}
.rs-calendar-header-btn-disabled::after{
  display:none !important;
}
.rs-calendar-header-has-month:not(.rs-calendar-header-has-time){
  margin:0 auto;
  padding-inline:var(--rs-calendar-base-spacing);
}
.rs-calendar-header-has-month:not(.rs-calendar-header-has-time) .rs-calendar-header-month-toolbar{
  display:block;
  text-align:center;
  width:100%;
}
.rs-calendar-header-has-month:not(.rs-calendar-header-has-time) .rs-calendar-header-month-toolbar::before, .rs-calendar-header-has-month:not(.rs-calendar-header-has-time) .rs-calendar-header-month-toolbar::after{
  content:" ";
  display:table;
}
.rs-calendar-header-has-month:not(.rs-calendar-header-has-time) .rs-calendar-header-month-toolbar::after{
  clear:both;
}
.rs-calendar-header-has-month:not(.rs-calendar-header-has-time) .rs-calendar-header-backward{
  float:inline-start;
}
.rs-calendar-header-has-month:not(.rs-calendar-header-has-time) .rs-calendar-header-forward{
  float:inline-end;
}
.rs-calendar-header-has-time:not(.rs-calendar-header-has-month){
  margin:0 auto;
  text-align:center;
}
.rs-calendar-header-has-time:not(.rs-calendar-header-has-month) .rs-calendar-header-time-toolbar{
  float:none;
  display:inline-block;
}
.rs-calendar-header-has-month.rs-calendar-header-has-time{
  margin:0 auto;
}

[dir=rtl] .rs-calendar-header-backward .rs-icon, [dir=rtl] .rs-calendar-header-forward .rs-icon{
  transform:rotate(180deg);
}

.rs-calendar-body{
  padding:var(--rs-calendar-base-spacing);
  padding-top:var(--rs-calendar-body-padding-top);
}

.rs-calendar-table{
  display:table;
  table-layout:fixed;
  width:var(--rs-calendar-table-width);
}

.rs-calendar-table-row{
  display:table-row;
}
.rs-calendar-table-row:nth-child(2) .rs-calendar-table-cell-week-number{
  border-top-left-radius:var(--rs-radius-md);
  border-top-right-radius:var(--rs-radius-md);
}
.rs-calendar-table-row:last-child .rs-calendar-table-cell-week-number{
  border-bottom-left-radius:var(--rs-radius-md);
  border-bottom-right-radius:var(--rs-radius-md);
}

.rs-calendar-table-cell,
.rs-calendar-table-header-cell{
  display:table-cell;
  width:1%;
  padding:var(--rs-calendar-table-cell-padding) 0;
  text-align:center;
  vertical-align:middle;
}
.rs-calendar-table-cell-un-same-month .rs-calendar-table-cell-content, .rs-calendar-table-cell-un-same-month .rs-calendar-table-cell-content:hover, .rs-calendar-table-cell-disabled .rs-calendar-table-cell-content, .rs-calendar-table-cell-disabled .rs-calendar-table-cell-content:hover,
.rs-calendar-table-cell-un-same-month .rs-calendar-table-header-cell-content,
.rs-calendar-table-cell-un-same-month .rs-calendar-table-header-cell-content:hover,
.rs-calendar-table-cell-disabled .rs-calendar-table-header-cell-content,
.rs-calendar-table-cell-disabled .rs-calendar-table-header-cell-content:hover,
.rs-calendar-table-header-cell-un-same-month .rs-calendar-table-cell-content,
.rs-calendar-table-header-cell-un-same-month .rs-calendar-table-cell-content:hover,
.rs-calendar-table-header-cell-disabled .rs-calendar-table-cell-content,
.rs-calendar-table-header-cell-disabled .rs-calendar-table-cell-content:hover,
.rs-calendar-table-header-cell-un-same-month .rs-calendar-table-header-cell-content,
.rs-calendar-table-header-cell-un-same-month .rs-calendar-table-header-cell-content:hover,
.rs-calendar-table-header-cell-disabled .rs-calendar-table-header-cell-content,
.rs-calendar-table-header-cell-disabled .rs-calendar-table-header-cell-content:hover{
  color:var(--rs-text-disabled);
}
.rs-calendar-table-cell-disabled .rs-calendar-table-cell-content, .rs-calendar-table-cell-disabled .rs-calendar-table-cell-content:hover,
.rs-calendar-table-cell-disabled .rs-calendar-table-header-cell-content,
.rs-calendar-table-cell-disabled .rs-calendar-table-header-cell-content:hover,
.rs-calendar-table-header-cell-disabled .rs-calendar-table-cell-content,
.rs-calendar-table-header-cell-disabled .rs-calendar-table-cell-content:hover,
.rs-calendar-table-header-cell-disabled .rs-calendar-table-header-cell-content,
.rs-calendar-table-header-cell-disabled .rs-calendar-table-header-cell-content:hover{
  background:none;
  text-decoration:line-through;
  cursor:not-allowed;
}
.rs-calendar-table-cell-disabled.rs-calendar-table-cell-is-today.rs-calendar-table-cell-selected .rs-calendar-table-cell-content:hover,
.rs-calendar-table-cell-disabled.rs-calendar-table-cell-is-today.rs-calendar-table-cell-selected .rs-calendar-table-header-cell-content:hover,
.rs-calendar-table-header-cell-disabled.rs-calendar-table-cell-is-today.rs-calendar-table-cell-selected .rs-calendar-table-cell-content:hover,
.rs-calendar-table-header-cell-disabled.rs-calendar-table-cell-is-today.rs-calendar-table-cell-selected .rs-calendar-table-header-cell-content:hover{
  color:var(--rs-calendar-date-selected-text);
  background-color:var(--rs-bg-active);
  box-shadow:none;
}
[data-theme=high-contrast] .rs-calendar-table-cell-disabled.rs-calendar-table-cell-is-today.rs-calendar-table-cell-selected .rs-calendar-table-cell-content:hover, .rs-theme-high-contrast .rs-calendar-table-cell-disabled.rs-calendar-table-cell-is-today.rs-calendar-table-cell-selected .rs-calendar-table-cell-content:hover,
[data-theme=high-contrast] .rs-calendar-table-cell-disabled.rs-calendar-table-cell-is-today.rs-calendar-table-cell-selected .rs-calendar-table-header-cell-content:hover,
.rs-theme-high-contrast .rs-calendar-table-cell-disabled.rs-calendar-table-cell-is-today.rs-calendar-table-cell-selected .rs-calendar-table-header-cell-content:hover,
[data-theme=high-contrast] .rs-calendar-table-header-cell-disabled.rs-calendar-table-cell-is-today.rs-calendar-table-cell-selected .rs-calendar-table-cell-content:hover,
.rs-theme-high-contrast .rs-calendar-table-header-cell-disabled.rs-calendar-table-cell-is-today.rs-calendar-table-cell-selected .rs-calendar-table-cell-content:hover,
[data-theme=high-contrast] .rs-calendar-table-header-cell-disabled.rs-calendar-table-cell-is-today.rs-calendar-table-cell-selected .rs-calendar-table-header-cell-content:hover,
.rs-theme-high-contrast .rs-calendar-table-header-cell-disabled.rs-calendar-table-cell-is-today.rs-calendar-table-cell-selected .rs-calendar-table-header-cell-content:hover{
  text-decoration:underline;
}
.rs-calendar-table-cell-disabled.rs-calendar-table-cell-selected .rs-calendar-table-cell-content,
.rs-calendar-table-cell-disabled.rs-calendar-table-cell-selected .rs-calendar-table-header-cell-content,
.rs-calendar-table-header-cell-disabled.rs-calendar-table-cell-selected .rs-calendar-table-cell-content,
.rs-calendar-table-header-cell-disabled.rs-calendar-table-cell-selected .rs-calendar-table-header-cell-content{
  opacity:0.3;
}

.rs-calendar-table-cell-content{
  display:inline-block;
  cursor:pointer;
  font-size:var(--rs-calendar-cell-font-size);
  line-height:var(--rs-calendar-cell-line-height);
  padding:var(--rs-calendar-cell-padding);
  border-radius:var(--rs-calendar-border-radius);
}
.rs-calendar-table-cell-content:hover{
  background-color:var(--rs-state-hover-bg);
}
.rs-calendar-table-cell-is-today .rs-calendar-table-cell-content{
  box-shadow:inset 0 0 0 1px var(--rs-input-focus-border);
}
.rs-calendar-table-cell-selected .rs-calendar-table-cell-content{
  color:var(--rs-calendar-date-selected-text);
  background-color:var(--rs-bg-active);
  box-shadow:none;
}
[data-theme=high-contrast] .rs-calendar-table-cell-selected .rs-calendar-table-cell-content, .rs-theme-high-contrast .rs-calendar-table-cell-selected .rs-calendar-table-cell-content{
  text-decoration:underline;
}

.rs-calendar-table-header-cell-content{
  display:inline-block;
  color:var(--rs-text-secondary);
  font-size:var(--rs-font-size-xs);
  line-height:var(--rs-line-height-sm);
  padding-top:2px;
  padding-bottom:2px;
}
.rs-calendar-table-header-cell-content, .rs-calendar-table-header-cell-content:hover, .rs-calendar-table-header-cell-content:focus, .rs-calendar-table-header-cell-content:hover:focus{
  background:none;
  cursor:auto;
}

.rs-calendar-table-cell-week-number{
  display:table-cell;
  min-width:30px;
  padding:var(--rs-calendar-table-cell-padding);
  text-align:center;
  vertical-align:middle;
  color:var(--rs-text-secondary);
  background-color:var(--rs-bg-well);
  font-size:var(--rs-font-size-xs);
}

.rs-calendar-month-dropdown{
  display:none;
  position:absolute;
  top:var(--rs-calendar-dropdown-top);
  border-top:1px solid var(--rs-border-primary);
  margin-top:0;
  width:100%;
  background-color:var(--rs-bg-overlay);
  overflow:hidden;
  z-index:var(--rs-zindex-date-range-picker-table-cell-content);
  height:calc(100% - 48px);
}
.rs-calendar-month-view .rs-calendar-month-dropdown{
  display:block;
}
.rs-calendar-month-view .rs-calendar-month-dropdown-scroll{
  animation:0.3s linear slideDown;
}
.rs-calendar-month-dropdown-scroll{
  height:100%;
}
.rs-calendar-month-dropdown-row{
  position:relative;
  padding-inline-start:calc(var(--rs-calendar-base-spacing) + 38px);
  padding-inline-end:var(--rs-calendar-base-spacing);
  padding-top:5px;
  padding-bottom:5px;
}
.rs-calendar-month-dropdown-row:not(:last-child){
  border-bottom:1px dashed var(--rs-border-primary);
}
.rs-calendar-month-dropdown-year{
  position:absolute;
  top:calc(50% - 0.5em);
  inset-inline-start:var(--rs-calendar-base-spacing);
}
.rs-calendar-month-dropdown-year-active{
  color:var(--rs-text-active);
}
.rs-calendar-month-dropdown-list{
  display:grid;
  grid-template-columns:repeat(4, 25%);
}
.rs-calendar-month-dropdown-cell{
  margin:1px;
  text-align:center;
  vertical-align:middle;
}
.rs-calendar-month-dropdown-cell-content{
  display:inline-block;
  cursor:pointer;
  font-size:var(--rs-calendar-cell-font-size);
  line-height:var(--rs-calendar-cell-line-height);
  padding:var(--rs-calendar-cell-padding);
  border-radius:var(--rs-calendar-border-radius);
}
.rs-calendar-month-dropdown-cell-content:hover{
  background-color:var(--rs-state-hover-bg);
}
.rs-calendar-month-dropdown-cell:not(.rs-calendar-month-dropdown-cell-active).disabled .rs-calendar-month-dropdown-cell-content{
  color:var(--rs-text-disabled);
  background:none;
  text-decoration:line-through;
  cursor:not-allowed;
}
.rs-calendar-month-dropdown-cell-active.disabled .rs-calendar-month-dropdown-cell-content{
  opacity:0.3;
  cursor:not-allowed;
}
.rs-calendar-month-dropdown-cell-active .rs-calendar-month-dropdown-cell-content{
  color:var(--rs-calendar-date-selected-text);
  background-color:var(--rs-bg-active);
  box-shadow:none;
}
[data-theme=high-contrast] .rs-calendar-month-dropdown-cell-active .rs-calendar-month-dropdown-cell-content, .rs-theme-high-contrast .rs-calendar-month-dropdown-cell-active .rs-calendar-month-dropdown-cell-content{
  text-decoration:underline;
}

.rs-calendar-time-dropdown{
  display:none;
  position:absolute;
  top:var(--rs-calendar-dropdown-top);
  padding-inline:var(--rs-calendar-base-spacing);
  width:100%;
  background-color:var(--rs-bg-overlay);
  color:var(--rs-text-primary);
  overflow:hidden;
  z-index:var(--rs-zindex-date-range-picker-table-cell-content);
}
.rs-calendar-time-view .rs-calendar-time-dropdown{
  display:block;
}
.rs-calendar-time-view .rs-calendar-time-dropdown-content{
  animation:0.3s linear slideDown;
}
.rs-calendar-time-dropdown-row{
  display:table;
  width:100%;
}
.rs-calendar-time-dropdown-column{
  display:table-cell;
  width:1%;
}
.rs-calendar-time-dropdown-column .rs-scroll-view::after{
  content:"";
  display:block;
  height:calc(100% - 30px);
}
.rs-calendar-time-dropdown-column > ul,
.rs-calendar-time-dropdown-column > ul > li{
  list-style:none;
  margin:0;
  padding:0;
}
.rs-calendar-time-dropdown-column > ul{
  height:230px;
  overflow-y:auto;
  scroll-behavior:smooth;
}
.rs-calendar-time-dropdown-column-title{
  width:100%;
  background-color:var(--rs-calendar-time-unit-bg);
  color:var(--rs-text-secondary);
  text-align:center;
  font-size:var(--rs-font-size-xs);
  line-height:var(--rs-line-height-sm);
  padding-top:2px;
  padding-bottom:2px;
  margin-bottom:2px;
}
.rs-calendar-only-time .rs-calendar-time-dropdown-column-title{
  border-top:none;
}
.rs-calendar-time-dropdown-cell{
  font-size:var(--rs-font-size-sm);
  line-height:var(--rs-line-height-base);
  color:inherit;
  padding:5px;
  display:block;
  text-align:center;
  cursor:pointer;
  margin:1px;
}
.rs-calendar-time-dropdown-cell, .rs-calendar-time-dropdown-cell:hover, .rs-calendar-time-dropdown-cell:focus{
  text-decoration:none;
}
.rs-calendar-time-dropdown-cell:hover{
  background-color:var(--rs-listbox-option-hover-bg);
  color:var(--rs-listbox-option-hover-text);
}
[data-theme=high-contrast] .rs-calendar-time-dropdown-cell:hover, .rs-theme-high-contrast .rs-calendar-time-dropdown-cell:hover{
  outline:2px solid var(--rs-focus-ring-color);
  outline-offset:-1px;
  outline-offset:-3px;
  outline-width:2px;
  color:var(--rs-listbox-option-hover-text);
  text-decoration:underline;
}
.rs-calendar-time-dropdown-cell.rs-calendar-time-dropdown-cell-active{
  background-color:var(--rs-bg-active);
  color:var(--rs-calendar-date-selected-text);
}
@media (forced-colors: active){
  .rs-calendar-time-dropdown-cell.rs-calendar-time-dropdown-cell-active:hover{
    background-color:var(--rs-listbox-option-hover-bg);
    color:var(--rs-listbox-option-hover-text);
  }
  [data-theme=high-contrast] .rs-calendar-time-dropdown-cell.rs-calendar-time-dropdown-cell-active:hover, .rs-theme-high-contrast .rs-calendar-time-dropdown-cell.rs-calendar-time-dropdown-cell-active:hover{
    outline:2px solid var(--rs-focus-ring-color);
    outline-offset:-1px;
    outline-offset:-3px;
    outline-width:2px;
    color:var(--rs-listbox-option-hover-text);
    text-decoration:underline;
  }
}
.rs-calendar-time-dropdown-cell.rs-calendar-time-dropdown-cell-disabled{
  color:var(--rs-text-disabled);
  background:none;
  cursor:not-allowed;
  text-decoration:line-through;
}
.rs-calendar-time-dropdown-cell.rs-calendar-time-dropdown-cell-active.rs-calendar-time-dropdown-cell-disabled{
  opacity:0.3;
  cursor:not-allowed;
}

.rs-calendar-only-time{
  padding-top:var(--rs-calendar-base-spacing);
  display:block;
}
.rs-calendar-only-time .rs-calendar-time-dropdown{
  position:relative;
  top:2px;
}
.rs-calendar-only-time .rs-calendar-time-dropdown-row{
  display:flex;
}
.rs-calendar-only-time .rs-calendar-time-dropdown-column{
  min-width:60px;
  flex:1;
}

@keyframes slideDown{
  from{
    transform:translateY(-100%);
  }
  to{
    transform:translateY(0);
  }
}
.rs-picker-toolbar{
  padding:var(--rs-calendar-base-spacing);
  border-top:1px solid var(--rs-divider-border);
}

.rs-picker[data-picker=date] .rs-input-group-addon{
  color:var(--rs-text-secondary);
  cursor:pointer;
}
.rs-picker[data-picker=date] .rs-input-group-addon .rs-btn-close{
  padding:0;
}
.rs-picker[data-picker=date].rs-picker[data-appearance=subtle] .rs-input-group{
  border-color:transparent;
}
.rs-picker[data-picker=date] > .rs-input-group.rs-input-group-inside .rs-input{
  padding-inline-end:0;
}

.rs-picker-date-predefined{
  height:325px;
  border-right:1px solid var(--rs-border-primary);
  padding:4px 0;
}
.rs-picker-date-predefined .rs-btn{
  display:block;
}

.rs-picker-popup.rs-picker-popup-date{
  padding:0;
}
.rs-picker-popup .rs-picker-toolbar{
  max-width:100%;
}
.rs-picker-popup .rs-picker-toolbar-ranges{
  max-width:400px;
}
.rs-picker-popup .rs-calendar{
  --rs-calendar-in-menu-content-side-length:30px;
  min-width:264px;
  display:block;
  margin:0 auto;
}
.rs-picker-popup .rs-calendar-show-week-numbers{
  min-width:278px;
}
.rs-picker-popup .rs-calendar-show-week-numbers .rs-calendar-body{
  padding-inline-start:12px;
  padding-inline-end:12px;
}
.rs-picker-popup .rs-calendar-header{
  width:100%;
}
.rs-picker-popup .rs-calendar-body{
  padding-inline-start:15px;
  padding-inline-end:15px;
}
.rs-picker-popup .rs-calendar-table{
  width:unset;
}
.rs-picker-popup .rs-calendar-month-dropdown-cell:focus-visible .rs-calendar-month-dropdown-cell-content{
  outline:3px solid var(--rs-focus-ring-color);
}
.rs-picker-popup .rs-calendar-table-cell:focus-visible{
  outline:none;
}
.rs-picker-popup .rs-calendar-table-cell:focus-visible .rs-calendar-table-cell-content{
  outline:3px solid var(--rs-focus-ring-color);
}
.rs-picker-popup .rs-calendar .rs-calendar-table-cell-content{
  width:var(--rs-calendar-in-menu-content-side-length);
  height:var(--rs-calendar-in-menu-content-side-length);
}
.rs-picker-popup .rs-calendar .rs-calendar-month-dropdown-cell-content:hover{
  background-color:var(--rs-listbox-option-hover-bg);
  color:var(--rs-listbox-option-hover-text);
}
[data-theme=high-contrast] .rs-picker-popup .rs-calendar .rs-calendar-month-dropdown-cell-content:hover, .rs-theme-high-contrast .rs-picker-popup .rs-calendar .rs-calendar-month-dropdown-cell-content:hover{
  outline:2px solid var(--rs-focus-ring-color);
  outline-offset:-1px;
  outline-offset:-3px;
  outline-width:2px;
  color:var(--rs-listbox-option-hover-text);
  text-decoration:underline;
}
.rs-picker-popup .rs-calendar .rs-calendar-month-dropdown-cell-active .rs-calendar-month-dropdown-cell-content:hover{
  background-color:var(--rs-calendar-cell-selected-hover-bg);
  color:var(--rs-calendar-date-selected-text);
}
[data-theme=high-contrast] .rs-picker-popup .rs-calendar .rs-calendar-month-dropdown-cell-active .rs-calendar-month-dropdown-cell-content:hover, .rs-theme-high-contrast .rs-picker-popup .rs-calendar .rs-calendar-month-dropdown-cell-active .rs-calendar-month-dropdown-cell-content:hover{
  color:var(--rs-calendar-date-selected-text);
}
.rs-picker-popup .rs-calendar .rs-calendar-table-header-row .rs-calendar-table-cell-content{
  height:24px;
  padding-top:0;
}
.rs-picker-popup .rs-calendar .rs-calendar-table-cell-content{
  padding-inline-start:0;
  padding-inline-end:0;
  display:inline-block;
}
.rs-picker-popup .rs-calendar .rs-calendar-table-cell:hover .rs-calendar-table-cell-content{
  background-color:var(--rs-listbox-option-hover-bg);
  color:var(--rs-listbox-option-hover-text);
}
[data-theme=high-contrast] .rs-picker-popup .rs-calendar .rs-calendar-table-cell:hover .rs-calendar-table-cell-content, .rs-theme-high-contrast .rs-picker-popup .rs-calendar .rs-calendar-table-cell:hover .rs-calendar-table-cell-content{
  outline:2px solid var(--rs-focus-ring-color);
  outline-offset:-1px;
  outline-offset:-3px;
  outline-width:2px;
  color:var(--rs-listbox-option-hover-text);
  text-decoration:underline;
}
.rs-picker-popup .rs-calendar .rs-calendar-table-cell-selected:hover .rs-calendar-table-cell-content{
  background-color:var(--rs-calendar-cell-selected-hover-bg);
  color:var(--rs-calendar-date-selected-text);
}
[data-theme=high-contrast] .rs-picker-popup .rs-calendar .rs-calendar-table-cell-selected:hover .rs-calendar-table-cell-content, .rs-theme-high-contrast .rs-picker-popup .rs-calendar .rs-calendar-table-cell-selected:hover .rs-calendar-table-cell-content{
  color:var(--rs-calendar-date-selected-text);
}
.rs-picker-popup .rs-calendar .rs-calendar-time-dropdown-column > ul{
  height:198px;
}
.rs-picker-popup .rs-calendar.rs-calendar-only-time{
  min-width:auto;
  width:100%;
  flex:1;
}
.rs-picker-popup .rs-calendar.rs-calendar-only-time .rs-calendar-time-dropdown-column > ul{
  height:100%;
}

.rs-picker[data-picker=date-range] .rs-input-group-addon{
  color:var(--rs-text-secondary);
  cursor:pointer;
}
.rs-picker[data-picker=date-range] .rs-input-group-addon .rs-btn-close{
  padding:0;
}
.rs-picker[data-picker=date-range][data-appearance=subtle] .rs-input-group{
  border-color:transparent;
}
.rs-picker[data-picker=date-range] > .rs-input-group.rs-input-group-inside .rs-input{
  padding-inline-end:0;
}

.rs-picker-popup.rs-picker-popup-daterange{
  padding:0;
}
.rs-picker-popup.rs-picker-popup-daterange .rs-calendar:first-child{
  border-right:1px solid var(--rs-border-primary);
}
.rs-picker-popup .rs-calendar{
  height:274px;
  padding-bottom:var(--rs-calendar-base-spacing);
}
.rs-picker-popup .rs-calendar-header{
  width:100%;
  text-align:center;
}
.rs-picker-popup .rs-calendar-header-month-toolbar{
  float:none;
}
.rs-picker-popup .rs-calendar-month-dropdown{
  z-index:var(--rs-zindex-date-range-picker-calendar-dropdown);
}
.rs-picker-popup .rs-picker-daterange-panel-show-one-calendar .rs-picker-toolbar-ranges{
  width:190px;
}
.rs-picker-popup .rs-picker-daterange-panel-only-time{
  height:100%;
}
.rs-picker-popup .rs-picker-daterange-panel-only-time .rs-picker-daterange-calendar-group{
  min-width:auto;
}
.rs-picker-popup .rs-picker-daterange-panel-only-time .rs-picker-daterange-content{
  flex:1;
}
.rs-picker-popup .rs-picker-daterange-calendar-single .rs-calendar{
  border:0;
  display:block;
  margin:auto;
}

.rs-picker-daterange-header{
  --rs-date-range-picker-header-line-height:var(--rs-line-height-md);
  --rs-date-range-picker-header-padding-vertical:8px;
  padding-block:var(--rs-date-range-picker-header-padding-vertical);
  padding-inline:var(--rs-picker-menu-padding);
  font-size:var(--rs-font-size-sm);
  line-height:var(--rs-date-range-picker-header-line-height);
  border-bottom:1px solid var(--rs-border-primary);
}
.rs-picker-daterange-header .rs-picker-header-date:focus{
  background-color:transparent;
}
.rs-picker-daterange-header.rs-picker-tab-active-end, .rs-picker-daterange-header.rs-picker-tab-active-start{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-around;
}
.rs-picker-daterange-header.rs-picker-tab-active-end::after, .rs-picker-daterange-header.rs-picker-tab-active-start::after{
  content:" ";
  position:absolute;
  width:50%;
  bottom:-1px;
  border-bottom:2px solid #3498ff;
  inset-inline-start:0;
  transition:left 0.3s;
}
.rs-picker-daterange-header.rs-picker-tab-active-end::after{
  inset-inline-start:50%;
}

.rs-picker-daterange-calendar-group{
  display:flex;
  flex-wrap:nowrap;
  height:274px;
  min-width:492px;
}

.rs-picker-daterange-predefined{
  height:366px;
  border-right:1px solid var(--rs-border-primary);
  padding:4px 0;
}
.rs-picker-daterange-predefined .rs-btn{
  display:block;
}:root {
  --color-primary: #27235e;
  --color-accent: #f6fbfe;
  --color-muted: #fafafa;
  --primary-color: #27235e;
  --body-background: #f6fbfe;
  --dark-text-font-color: #494949;
  --input-field-background: #eef2f6;
  --medium-font-size: 14px;
}

.example-month-picker .mat-calendar-period-button {
  pointer-events: none;
}

.example-month-picker .mat-calendar-arrow {
  display: none;
}

.filter-fieldWidth {
  width: 155px;
}

.hide-pagination-element {
  display: none;
}

.claim-date-range-picker {
  display: inline-flex;
  flex-direction: column;
  position: relative;
  width: 200px;
  margin-top: 4px;
}

.claim-date-range-picker .rs-picker {
  width: 100% !important;
  outline: none!important;
}

/* Static label – matches MUI FormLabel and InputLabel standard variant */

.claim-date-range-picker .drp-label {
  display: block;
  font-family: "Roboto", "Helvetica", "Arial", sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 1.4375em;
  letter-spacing: 0.00938em;
  color: rgba(0, 0, 0, 0.6);
  padding: 0;
  transform-origin: top left;
  transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
  pointer-events: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Focused label color - when picker is active or focused */

.claim-date-range-picker:focus-within .drp-label {
  color: #27235e;
}

/* The rsuite picker toggle button – matches MUI Input standard variant */

.claim-date-range-picker .rs-picker-toggle {
  background: transparent !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.42) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 4px 0 5px 0 !important;
  margin-top: 4px !important;
  height: auto !important;
  min-height: 32px !important;
  cursor: pointer !important;
  transition: border-bottom-color 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms !important;
}

/* Remove ALL outlines / glows on every interactive state */

.claim-date-range-picker .rs-picker-toggle,
.claim-date-range-picker .rs-picker-toggle.rs-btn,
.claim-date-range-picker .rs-picker-toggle.rs-btn:focus,
.claim-date-range-picker .rs-picker-toggle.rs-btn:focus-visible,
.claim-date-range-picker .rs-picker-toggle:focus,
.claim-date-range-picker .rs-picker-toggle:focus-visible,
.claim-date-range-picker .rs-picker-toggle:active,
.claim-date-range-picker .rs-picker-has-value .rs-picker-toggle,
.claim-date-range-picker .rs-picker-focused .rs-picker-toggle,
.claim-date-range-picker .rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle:hover,
.claim-date-range-picker .rs-picker-default:not(.rs-picker-disabled) .rs-picker-toggle:focus,
.claim-date-range-picker * {
  outline: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent !important;
}

/* Hover - matches MUI underline:hover */

.claim-date-range-picker:hover .rs-picker-toggle:not(.rs-picker-toggle-active) {
  border-bottom: 2px solid rgba(0, 0, 0, 0.87) !important;
}

/* Focused underline - matches MUI underline:after (primary theme color) */

.claim-date-range-picker .rs-picker-toggle-active,
.claim-date-range-picker .rs-picker-focused .rs-picker-toggle {
  border-bottom: 2px solid #27235e !important;
  box-shadow: none !important;
}

/* Value text – same as MuiInput-input in the panel */

.claim-date-range-picker .rs-picker-toggle-value {
  font-family: "Roboto", "Helvetica", "Arial", sans-serif !important;
  font-size: 16px !important;
  color: rgba(0, 0, 0, 0.87) !important;
  line-height: 1.4375em !important;
  padding: 0 !important;
}

/* Placeholder text – same grey as MUI */

.claim-date-range-picker .rs-picker-toggle-placeholder {
  font-family: "Roboto", "Helvetica", "Arial", sans-serif !important;
  font-size: 16px !important;
  color: rgba(0, 0, 0, 0.42) !important;
  line-height: 1.4375em !important;
  padding: 0 !important;
}

/* Caret (chevron) icon */

.claim-date-range-picker .rs-picker-toggle-caret {
  color: rgba(0, 0, 0, 0.54) !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}

/* Clean (×) button */

.claim-date-range-picker .rs-picker-toggle-clean {
  color: rgba(0, 0, 0, 0.54) !important;
  right: 18px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
}

/* ── Calendar popup styling ── */

/* Selected day circle */

.rs-calendar-table-cell-selected .rs-calendar-table-cell-content {
  background-color: #27235e !important;
  color: #fff !important;
  border-radius: 50% !important;
}

/* In-range days */

.rs-calendar-table-cell-in-range .rs-calendar-table-cell-content {
  background-color: rgba(39, 35, 94, 0.10) !important;
  color: #27235e !important;
}

/* OK / apply button */

.rs-picker-daterange-panel .rs-btn-primary,
.rs-picker-toolbar .rs-btn-primary {
  background-color: #27235e !important;
  border-color: #27235e !important;
  color: #fff !important;
}

.rs-picker-daterange-panel .rs-btn-primary:hover,
.rs-picker-toolbar .rs-btn-primary:hover {
  background-color: #1c1a5c !important;
  border-color: #1c1a5c !important;
}
.bulkupload {
	cursor: pointer;
	font-size: medium;
	padding: 10px 20px 10px 20px;
	margin-left: 3rem;
}

.manualupload {
	cursor: pointer;
	font-size: medium;
	padding: 10px 20px 10px 20px;
	margin-right: 4rem;
}
.input-text {
	margin-left: 35px;
	margin-top: 10px;
}
.download-text {
	margin: 20px;
	margin-left: 40px;
}

.rpm-upload-button {
	width: 100px;
	height: 43px;
	border-radius: 8px;
	background-color: #0e0c31;
	font-family: "Open Sans", sans-serif;
	font-style: normal;
	font-weight: 600;
	font-size: 17px;
	line-height: 20px;
	color: #ffffff;
	letter-spacing: 0.3px;
	margin-left: 40px;
	text-align: center;
	margin-top: 20px;
}
.rpm-dialog {
	overflow: hidden;
}

.device-title {
	text-transform: uppercase;
}
.input-text {
	margin-left: 35px;
	margin-top: 10px;
}
.download-text {
	margin: 20px;
	margin-left: 40px;
}

.rpm-upload-button {
	width: 100px;
	height: 43px;
	border-radius: 8px;
	background-color: #0e0c31;
	font-family: "Open Sans", sans-serif;
	font-style: normal;
	font-weight: 600;
	font-size: 17px;
	line-height: 20px;
	color: #ffffff;
	letter-spacing: 0.3px;
	margin-left: 40px;
	text-align: center;
	margin-top: 5px;
}
.rpm-dialog {
	overflow: hidden;
}
div#canvas-container {
  position: relative;
  // height: 50vh;
  width: 95%;
  margin: auto;
}
:root {
  --color-primary: #27235e;
  --color-accent: #f6fbfe;
  --color-muted: #fafafa;
  --primary-color: #27235e;
  --body-background: #f6fbfe;
  --dark-text-font-color: #494949;
  --input-field-background: #eef2f6;
  --medium-font-size: 14px;
}

.tab-category-icon {
	padding: 5px;
}

.mat-cell,
.mat-header-cell {
	width: auto !important;
}

.example-spacer {
	flex: 1 1 auto;
}

.mat-expansion-panel-header-title,
.mat-expansion-panel-header-description {
	flex-basis: 0;
}

.mat-expansion-panel-header-description {
	justify-content: space-between;
	align-items: center;
}

app-stop-timer {
	font-size: 26px;
}

table,
th,
td {
	border: 1px solid $accent-color;
	border-collapse: collapse;
}

th,
td {
	padding: 15px;
	text-align: left;
}

.mat-expansion-content-claim {
	display: flex;
	flex-direction: column;
	align-content: space-between;

	.claim-text {
		font-size: 20px;
		line-height: 20px;
		font-weight: 500;
		margin: 20px;

		.duration-text {
			color: $primary-color;
		}
	}

	.action-btn {
		margin: 20px;
		height: 50px;
		color: #ffffff;
	}

	.table-claim {
		margin: 20px;
	}
}

section.patient-info {
	display: flex;
	flex-direction: row;

	div {
		flex: 1;
	}

	.profile-details {
		h2 {
			font-size: 35px;
			line-height: 35px;
			margin-top: 15px;
		}
	}

	.profile-icon {
		padding: 10px;
	}
}

.mat-list-base .mat-list-item .mat-line {
	white-space: normal !important;
}

.action-btn-green {
	background-color: #28a745;
	color: white;
}

div.row {
	width: 100%;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	flex-wrap: wrap;

	div.container {
		flex: 1;
    /* width: 100%; */
		margin: 10px;
		background-color: #ffffff;
		flex-wrap: wrap;
		flex-direction: column;
		position: relative;
	}
}

::ng-deep mdt-dynamic-table > table > tbody tr.mat-row {
	height: 20px !important;
}

/* ::ng-deep th.mat-header-cell {
  width: 140px;
  min-width: 140px;
  background-color: red;
} */

.section-action-fields {
	display: flex;
	justify-content: flex-start;
	margin: 0px 15px;
	padding-bottom: 10px;

	mat-checkbox {
		width: 90%;
	}

	button.action-btn {
		flex-grow: 1;
		color: #ffffff;
		text-align: center;
	}
}

mat-form-field.mat-form-field {
	width: 95%;
}

.eyebutton {
	margin-left: auto;
}

form.claim-form {
	margin-right: 20px;

	mat-form-field {
		padding: 10px;
		border: 1px solid $primary-color;
		border-radius: 8px;
	}
}

.dot {
	height: 25px;
	width: 25px;
	display: inline-block;
}

ul.table-legend {
	display: flex;
	flex-direction: row;
	justify-content: center;
	list-style: none;

	li {
		padding: 5px;
		margin: 2px;
		color: #ffffff;
		border-radius: 8px;
	}
}

.tooglesize {
	font-size: 12px;
}

div.comment-section {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-evenly;
	justify-self: flex-end;
	align-content: center;
	background-color: #ffffff;
	margin: 10px;

	div {
		flex: 1;
		width: 100%;
	}

	div.comments-view {
		border-right: 1px solid $accent-color;
	}

	div.notes-view {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		margin: 1rem;

		div {
			flex: 1;
		}
	}
}

form {
	padding-bottom: 20px;

	div.button-right {
		display: flex;
		flex-direction: row-reverse;
		width: 95%;

		button {
			color: #ffffff;
			margin: 10px;
		}
	}
}

.claims-action {
	width: 34%;
	margin: -3rem 0rem -1rem 23rem;
}

::ng-deep mat-table.claims-for-patient {
	.mat-header-cell {
		font-size: smaller;
	}

	.mat-cell {
		font-size: smaller;
	}
}

.example-button-container {
	display: flex;
	justify-content: flex-end;
	position: fixed;
	right: 12px;
	bottom: 8%;
}

section.container {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: stretch;
	align-content: stretch;

	div {
		flex: 1;
	}

	div.right-section {
		display: flex;
		width: 100%;
		flex-direction: column;
		flex-wrap: wrap;

		div {
			flex: 1;
		}
	}
}

/* .container {
   margin: 64px 2px 74px 11px;
   height: 411px;
} */

.patient-info-card {
	margin: 1rem;
	border-radius: 10px;
	font-family: "Open Sans", sans-serif;
	font-style: normal;
	font-weight: bold;
	font-size: 14px;
	line-height: 16px;
	color: #27235e;
}

.device-info-card {
	margin: 1rem;
	border-radius: 10px;
	font-family: "Open Sans", sans-serif;
	font-style: normal;
	font-weight: bold;
	font-size: 14px;
	line-height: 14px;
	color: $primary-color;

	.devices-list {
		display: flex;
		justify-content: space-between;
		vertical-align: baseline;
		margin: 10px;

		span {
			margin-top: 5px;
		}
	}

	/* .devices-list {
	  padding: 15px;
	  mat-icon {
	    height: 18px;
	    width: 18px;
	    margin-bottom: -11px;
	    margin-left: 7px;
	  }
	} */
}

.graph-info-card {
	border-radius: 10px;
	margin: 1rem;
}

.notes-list {
	margin: 1rem;
	border-radius: 5px;
	height: auto;

	.notes-section-header {
		padding: 0px 0px 0px 5px;
	}
}

.notes-display-list {
	min-height: 300px;
	max-height: 300px;
	height: 250px;
	overflow-y: scroll;
}

.note-template {
	float: right;
	border: 1px solid #27235e;
	border-radius: 10px;
	padding: 5px;
	display: flex;
	align-items: center;
	margin-top: -49px;
}

.obs-template {
	display: flex;
	align-items: center;

	.claims-section-header {
		padding: 0px 0px 0px 5px;
	}
}

.icon-text {
	display: flex;
	align-items: center;
	margin-bottom: 23px;
}

.drawer {
	position: fixed;
	height: 100vh;
	min-width: 40%;
	/* border-right: 1px solid #ccc; */
	border: 1px solid $primary-color;
	max-width: 40%;
}

.example-container {
	z-index: 999;
}

.drawer .header {
	position: absolute;
	/* right: 0; */
	justify-content: space-between;
	width: 100%;
	height: 500px;
}

.drawer .contents {
	padding: 16px;
}

.main {
	background-color: #fff;
}

.main.header {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 2;
	border-bottom: 1px solid #ccc;
}

.main.contents {
	min-height: 100vh;
	margin-top: 64px;
	padding: 16px;
}

.toolbar-heading {
	justify-content: space-between;
}

.device-info-title {
	margin-left: 1rem;
	font-weight: bolder !important;
}

.device-info-icon {
	float: right;
	font-size: 17px;
	color: green;
	margin-top: 5px;
	cursor: pointer;
}

.settings-icon {
	float: right;
	font-size: 19px;
	color: black;
	margin-top: -15px;
}

.device-info-content {
	margin-left: 11px;
	margin-bottom: 8px;
	color: $tertiary-color;
	font-size: $medium-font-size;
	font-weight: normal;
}

.date-form {
	margin-bottom: -47px;
	margin-left: 1037px;
}

.comment-content {
	border-radius: 10px;
}

.comments {
	/* background-color: #ffffff; */
	font-size: smaller;
	overflow-wrap: break-word;
	/* color: black; */
	padding: 1px 1px 8px 1px;
}

mat-form-field.mat-form-field {
	width: 95%;
}

.fill-height-or-more {
	display: flex;
	flex-direction: column-reverse;
	height: 288px;
	overflow: auto;
}

.fill-height-or-more > div {
	flex: 1;
	display: flex;
	justify-content: left;
	flex-direction: column;
	margin: 5px;
	padding: 15px;
	font-size: small;
	border-left: 5px solid $primary-color;
	background-color: #ffffff;
}

.fieldset {
	border-radius: 5px;
	border: 1px solid lightgray;
}

.legends {
	font-size: smaller;
	color: lightgrey;
}

.old-notes-section {
	overflow: auto;
}

.toggleChart {
	float: right;
}

::ng-deep .mat-form-field-appearance-outline .mat-form-field-outline {
	background-color: white;
	border-radius: 5px;
}

.date-icon {
	color: #79b9ec;
}

.comments-drawer {
	left-border: 1px solid $primary-color;
}

@media only screen and (max-width: 1024px) {
	.chart-graph {
		width: 95%;
	}
	/*
		.device-info-card {
			height: 215px;
			width: 350px;
		}
		.patient-info-card {
			width: 350px;
		}
	*/
}

.note-date {
	padding-right: 10px;
	float: right;
}

.notes-text {
	/* overflow-wrap: anywhere; */
	padding-top: 5px;
}
:root {
  --color-primary: #27235e;
  --color-accent: #f6fbfe;
  --color-muted: #fafafa;
  --primary-color: #27235e;
  --body-background: #f6fbfe;
  --dark-text-font-color: #494949;
  --input-field-background: #eef2f6;
  --medium-font-size: 14px;
}

::ng-deep mat-dialog-container {
	background-color: $accent-color !important;
	font-family: "Open Sans";
	color: $primary-color;
}

p.threshold-settings-title {
	color: $primary-color;
	font-size: 14px;
	font-family: "Open Sans";
	line-height: 14px;
	font-weight: 600;
}

::ng-deep mat-expansion-panel-header {
	border-bottom: 4px solid $secondary-color;
}

::ng-deep .mat-expansion-panel-body {
	font-size: 12px !important;
}

button.save-btn {
	margin-top: 20px;
	float: right;
}

.checkbox-btn {
	margin-left: 10px;
	margin-right: 10px;
}

::ng-deep .mat-checkbox .mat-checkbox-frame {
	border-color: $primary-color;
}

::ng-deep .mat-checkbox-checked .mat-checkbox-background,
.mat-checkbox-indeterminate .mat-checkbox-background {
	background-color: $primary-color !important;
}

::ng-deep .mat-checkbox:not(.mat-checkbox-disabled) .mat-checkbox-ripple .mat-ripple-element {
	background-color: $primary-color !important;
}

.first-label-name {
	margin-left: 30%;
	margin-right: 10px;
	margin-bottom: 10px;
}

.second-label-name {
	margin-left: 5%;
	margin-right: 10px;
	margin-bottom: 10px;
}

.module-form-title {
	display: inline;
	margin-bottom: 40px;
}

.main-title {
	display: inline;
}
.hide-pagination-element {
  display: none;
}
:root {
  --color-primary: #27235e;
  --color-accent: #f6fbfe;
  --color-muted: #fafafa;
  --primary-color: #27235e;
  --body-background: #f6fbfe;
  --dark-text-font-color: #494949;
  --input-field-background: #eef2f6;
  --medium-font-size: 14px;
}
.divtable {
  height: 35em;
  width: 100%;
}
.mat-cell {
  font-size: 12px;
}
.img-container:hover .overlay {
  bottom: 0%;
  height: 235px;
  background: linear-gradient(
    1.85deg,
    #1e1e1e 2.1%,
    rgba(30, 30, 30, 0.494792) 51.04%,
    rgba(30, 30, 30, 0) 98.97%
  );
  border-radius: 0px 0px 10px 10px;
}
.img-container {
  position: relative;
}
.image {
  display: block;
  width: 190px;
  height: 180px;
  border-radius: 10px;
  margin-left: 20px;
  cursor: pointer;
}
.img-container:hover .overlay {
  bottom: 0%;
  height: 235px;
  background: linear-gradient(
    1.85deg,
    #1e1e1e 2.1%,
    rgba(30, 30, 30, 0.494792) 51.04%,
    rgba(30, 30, 30, 0) 98.97%
  );
  border-radius: 0px 0px 10px 10px;
}
.delete-icon {
  position: absolute;
  top: 80%;
  left: 80%;
  cursor: pointer;
  color: white;
  background-color: #ffc107;
  border-radius: 4px;
  width: 17px;
  height: 17px;
  background-color: #ffc107;
  font-weight: 900;
  border-radius: 4px;
  padding: 3px 4px 4px 4px;
  /* -webkit-transform: translate(-50%, -50%); */
  /* -ms-transform: translate(-50%, -50%); */
  /* transform: translate(-50%, -50%); */
  /* text-align: center; */
}
.pres-image {
  width: 200px;
  height: 300px;
  /* position: relative; */
  left: 12vw;
  top: 3vh;
}
.prescription {
  position: relative;
  overflow: auto;
  margin-top: 60px;
}
.btn-group {
  margin-left: 160px;
}
.cancel-button {
  position: relative;
  left: -1.4vh;
  width: 81.09px;
  height: 37.13px;
  background: #fff;
  border: 1px solid #3f51b5;
  box-sizing: border-box;
  color: #3f51b5;
  box-shadow: 0px 0px 10px rgba(1, 0, 102, 0.1);
  border-radius: 10px;
  outline: none;
}
.save-button {
  position: relative;
  left: -1.4vh;
  width: 81.09px;
  height: 37.13px;
  background: #3f51b5;
  box-shadow: 0px 0px 10px rgba(1, 0, 102, 0.1);
  border-radius: 10px;
  color: white;
  outline: none;
}
.outer-div {
  border: 1px solid #e7f3fe;
  box-sizing: border-box;
  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  height: 65vh;
}
.title {
  font-size: 14px;
  color: #424242;
  margin-left: 10px;
  margin-top: 10px;
  font-weight: bold;
}
/* Styles for tab labels */
.mat-tab-label {
  min-width: 25px !important;
  padding: 5px;
  background-color: transparent;
  color: red;
  font-weight: 700;
}
/* Styles for the active tab label */
.mat-tab-label.mat-tab-label-active {
  min-width: 25px !important;
  padding: 5px;
  background-color: transparent;
  color: red;
  font-weight: 700;
}
input[type="file"] {
  opacity: 0; /* make transparent */
  z-index: -1; /* move under anything else */
  position: absolute; /* don't let it take up space */
}
.upload-pres-btn {
  width: 185px;
  height: 45px;
  border: 1px solid #0e0c31;
  background-color: #0e0c31;
  padding-left: 8px;
  padding-right: 5px;
  margin-top: -40px;
  float: right;
  padding-top: 10px;
  padding-bottom: 10px;
  margin-right: 24px;
  color: white;
  cursor: pointer;
}
.uploadedBy {
  position: absolute;
  text-transform: none;
  top: 148px;
  right: 142px;
  /* padding: 6px; */
  width: 20px;
  height: 20px;
  /* background-color: #ffc107; */
  font-weight: 900;
  border-radius: 4px;
  padding: 0px 0px 6px 8px;
}
.med-icon {
  height: 28px;
  width: 19px;
  top: 80%;
  left: 10%;
  cursor: pointer;
}
.upload-prescription-btn {
  margin-top: 5%;
  padding: 5px;
}
.uploaded-prescription-files-container {
  margin-top: 10px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  min-height: 100px;
  gap: 0.8rem;
  .img-container > .image,
  .img-container > a > .image {
    width: 150px;
    height: 150px;
  }
}
.noDataFound {
  margin: auto;
  font-weight: 500;
}
.noDataFoundText {
  position: absolute;
  top: 45%;
  left: 27%;
}
.hide-pagination-element {
  display: none;
}
/* Color System & Theme Variables */
:root {
  --primary-color: #27235e;
  --primary-hover: #1e1a4a;
  --accent-color: #e5bc40;
  --accent-hover: #d2aa32;
  --bg-light: #f5f6fa;
  --text-primary: #2b2b2b;
  --text-secondary: #6e6e6e;
  --success-color: #2e7d32;
  --success-bg: rgba(46, 125, 50, 0.1);
  --border-color: #e2e8f0;
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.05);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  --transition-fast: all 0.2s ease-in-out;
  --transition-normal: all 0.3s ease;
}

/* Page Layout Wrapper */
.organization-container {
  background-color: transparent;
  animation: fadeIn 0.4s ease-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
textarea {
  resize: none;
}

/* Modal overlay */
.add-edit-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

/* Modal container */
.add-edit-modal {
  background: white;
  border-radius: 12px;
  width: 90%;
  max-width: 600px;
  max-height: 90vh;
  overflow-y: auto;
  padding: 24px 28px;
  position: relative;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
  font-family: 'Helvetica', Arial, sans-serif;
}

/* Close button */
.close-button {
  position: absolute;
  top: 16px;
  right: 20px;
  font-size: 24px;
  cursor: pointer;
  color: #666;
  transition: color 0.2s;
}

.close-button:hover {
  color: #000;
}

/* Title */
.module-form-title {
  font-size: 24px;
  font-weight: 600;
  margin: 0 0 12px 0;
  color: #2a4c61;
}

/* Divider */
.module-divider {
  margin: 12px 0 24px 0;
  border: none;
  height: 1px;
  background: #e0e0e0;
}

/* Form container */
.form-container {
  margin-top: 8px;
}

/* Individual form field */
.form-field {
  margin-bottom: 20px;
  display: flex;
  flex-direction: column;
}

.form-field label {
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 6px;
  color: #333;
}

.form-field input,
.form-field select,
.form-field textarea {
  padding: 10px 12px;
  border: 1px solid #ccc;
  border-radius: 8px;
  font-size: 14px;
  font-family: inherit;
  transition: 0.2s;
  outline: none;
  background: #fff;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  border-color: #3aa3e2;
  box-shadow: 0 0 0 2px rgba(58, 163, 226, 0.2);
}

/* Error messages */
.error-message {
  color: #d32f2f;
  font-size: 12px;
  margin-top: 4px;
}

/* Form actions */
.form-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 24px;
}

.rpm-save-button {
  background: #f4ce59;
  border: none;
  padding: 10px 28px;
  border-radius: 40px;
  font-weight: bold;
  font-size: 14px;
  color: #2a4c61;
  cursor: pointer;
  transition: background 0.2s;
}

.rpm-save-button:hover:not(:disabled) {
  background: #e5bc40;
}

.rpm-save-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* Scrollbar for modal */
.add-edit-modal::-webkit-scrollbar {
  width: 6px;
}

.add-edit-modal::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-radius: 10px;
}

.add-edit-modal::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 10px;
}/* Color System & Theme Variables */
:root {
  --primary-color: #27235e;
  --primary-hover: #1e1a4a;
  --accent-color: #e5bc40;
  --accent-hover: #d2aa32;
  --bg-light: #f5f6fa;
  --text-primary: #2b2b2b;
  --text-secondary: #6e6e6e;
  --success-color: #2e7d32;
  --success-bg: rgba(46, 125, 50, 0.1);
  --border-color: #e2e8f0;
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.05);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  --transition-fast: all 0.2s ease-in-out;
  --transition-normal: all 0.3s ease;
}

/* Page Layout Wrapper */
.organization-user-container {
  background-color: transparent;
  animation: fadeIn 0.4s ease-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* branch-add-edit.css */

/* Specific layout grid for the Clinic Add/Edit Form */
.branch-form-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 24px;
    row-gap: 20px;
    padding: 8px 0;
}

/* Specific inputs custom styling */
.branch-input {
    width: 100%;
}

/* Specific autocomplete styling */
.branch-autocomplete {
    width: 100%;
}

.MuiDialog-root .branch-autocomplete .MuiInputBase-root.MuiOutlinedInput-root {
    height: 45px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.MuiDialog-root .branch-autocomplete .MuiInputBase-root.MuiOutlinedInput-root .MuiAutocomplete-input {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 100% !important;
}

/* Close button custom styling overrides (if any) */
.branch-close-btn {
    transition: all 0.2s ease-in-out;
}

/* Responsive: stack grid fields on small screens */
@media (max-width: 600px) {
    .branch-form-grid {
        grid-template-columns: 1fr;
        row-gap: 16px;
    }
}.hide-pagination-element {
  display: none;
}
/* Empty stylesheet */
.hide-pagination-element {
  display: none;
}
.disablebutton {
	pointer-events: none;
}
.mat-field-width {
	width: 270px;
	margin: 0px 14px 10px 23px;
}

::ng-deep .mat-tab-body-content {
	overflow-x: hidden !important;
}

.MuiDialog-root .doctor-dialog-autocomplete:not(.MuiAutocomplete-multiple) .MuiInputBase-root.MuiOutlinedInput-root {
    height: 45px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.MuiDialog-root .doctor-dialog-autocomplete:not(.MuiAutocomplete-multiple) .MuiInputBase-root.MuiOutlinedInput-root .MuiAutocomplete-input {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    height: 100% !important;
}
.hide-pagination-element {
  display: none;
}

.mat-row:hover {
  width: auto;
}.mat-dialog-content {
	overflow: hidden;
}

.MuiDialog-root .device-dialog-content .MuiTextField-root,
.MuiDialog-root .device-dialog-content .MuiAutocomplete-root,
.MuiDialog-root .device-dialog-content .MuiFormControl-root {
	min-width: unset !important;
}
form.assign-form {
  display: flex;
  flex-direction: row;
  width: 80%;

  div {
    flex: 1;

    button {
      margin-top: 20px;
    }
  }
}
.hide-pagination-element {
  display: none;
}
.mat-field-width {
	width: 270px;
	margin: 0px 14px 10px 23px;
}

::ng-deep .mat-tab-body-content {
	overflow-x: hidden !important;
}
.hide-pagination-element {
  display: none;
}
.hide-pagination-element {
	display: none!important;
}

.status-chip.open {
  background-color: #bbdefb !important;
  color: #0d47a1 !important;
}

.status-chip.reopen {
  background-color: #ffe0b2 !important;
  color: #e65100 !important;
}.hide-pagination-element {
  display: none;
}
.hide-pagination-element {
  display: none;
}
.rpm-module-filter-container form {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
}
.hide-pagination-element {
  display: none;
}
.hide-pagination-element {
  display: none;
}
html,
body,
#root {
  margin: 0;
  padding: 0;
  width: 100%;
  min-height: 100vh;
  box-sizing: border-box;
  font-family: 'Open Sans', 'Roboto', 'Helvetica Neue', sans-serif;
  background-color: #f5f6fa;
  color: #334155;
  overflow-x: hidden;
  text-align: left;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

input,
textarea,
[contenteditable="true"] {
  user-select: text !important;
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
}

*,
*::before,
*::after {
  box-sizing: inherit;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}

/* Global Variables */
:root {
  --primary-color: #0e0c31;
  --accent-color: #ffbc34;
  --border-color: #e2e8f0;
  --transition-fast: all 0.2s ease-in-out;
  --transition-normal: all 0.3s ease;
}

/* Global Filter Panel & Search (Flat Style) */
.filter-panel,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) {
  background: transparent !important;
  backdrop-filter: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0px 0px !important;
  box-shadow: none !important;
  display: flex !important;
  gap: 24px !important;
  margin-bottom: 24px !important;
  align-items: flex-end !important;
  flex-wrap: wrap !important;
}

/* Style filter labels to sit nicely above the inputs */
.filter-panel .MuiInputLabel-root,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiInputLabel-root {
  position: relative !important;
  /* transform: none !important; */
  font-size: 14px !important;
  font-weight: 500 !important;
  /* color: #757575 !important; */
  /* margin-bottom: 4px !important; */
  /* display: block !important; */
}

/* Make FormControl stack its label and input vertically */
.filter-panel .MuiFormControl-root,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiFormControl-root {
  display: inline-flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
}

/* Outlined Inputs inside the filters box styled as flat standard variant */
.filter-panel .MuiOutlinedInput-notchedOutline,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiOutlinedInput-notchedOutline {
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: 1px solid #cbd5e1 !important;
  border-radius: 0 !important;
}

.filter-panel .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {
  border-bottom-color: #0e0c31 !important;
  border-bottom-width: 2px !important;
}

.filter-panel .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-bottom-color: #ffbc34 !important;
  border-bottom-width: 2px !important;
  box-shadow: none !important;
}

.filter-panel .MuiOutlinedInput-root,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiOutlinedInput-root {
  background-color: transparent !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  border-radius: 0 !important;
}

/* Decrease padding and align all inputs/selects inside the filter box (both Outlined and Standard variants) */
.filter-panel .MuiOutlinedInput-input,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiOutlinedInput-input,
.filter-panel .MuiInput-input,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiInput-input,
.filter-panel .MuiSelect-select,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiSelect-select,
.filter-panel .MuiInput-root .MuiSelect-select,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiInput-root .MuiSelect-select {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  padding-left: 0 !important;
  padding-right: 24px !important;
  /* reserve space for arrows/icons */
  min-height: auto !important;
  /* height: 10px !important; */
  line-height: 12px !important;
}

/* Underline colors for standard variant inputs in filter box */
.filter-panel .MuiInput-underline:before,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiInput-underline:before {
  border-bottom: 1px solid #cbd5e1 !important;
}

.filter-panel .MuiInput-underline:hover:not(.Mui-disabled):before,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiInput-underline:hover:not(.Mui-disabled):before {
  border-bottom: 2px solid #0e0c31 !important;
}

.filter-panel .MuiInput-underline:after,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiInput-underline:after {
  border-bottom: 2px solid #ffbc34 !important;
}

/* Global Table Container Styling */
.table-container,
.MuiTableContainer-root {
  background: #ffffff !important;
  /* border-radius: 4px !important; */
  box-shadow: 0 4px 12px rgba(198, 217, 238, 0.03) !important;
  border: 1px solid var(--border-color) !important;
  overflow: auto !important;
  min-height: 500px !important;
  max-height: 65vh !important;
  transition: var(--transition-normal);
  max-width: 100% !important;
  scrollbar-width: thin;
  border-radius: 4px !important;
  scrollbar-color: #0e0e0e white;
}

.table-container:hover,
.MuiTableContainer-root:hover {
  box-shadow: 0 6px 18px rgba(0, 188, 226, 0.05) !important;
}

/* Global Table Headers */
.table-container th,
.table-container th.table-header-cell,
.MuiTableHead-root th,
.MuiTableCell-head {
  background-color: #e9ecf8 !important;
  color: #0e0c31 !important;
  font-weight: 550 !important;
  font-size: 12px !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  padding: 14px 16px !important;
  border-bottom: 1px solid #cbd5e1 !important;
  white-space: nowrap;
}

/* Global Table Body Rows */
.table-row,
.MuiTableBody-root tr {
  transition: var(--transition-fast) !important;
}

.table-row:hover,
.MuiTableBody-root tr:hover {
  background-color: rgba(14, 12, 49, 0.02) !important;
}

.table-row td,
.table-container td,
.MuiTableBody-root td,
.MuiTableCell-body {
    padding: 12px 0px 0px 16px !important;

  border-bottom: 5px solid #e9ecf8 !important;
  color: #334155 !important;
  font-size: 12px !important;
  font-weight: 500;
  vertical-align: text-top;
}

/* Table Text Formats */
.table-cell-bold {
  color: #0e0c31 !important;
  font-weight: 500 !important;
}

/* Clickable Cell Count Buttons/Links */
.table-link-btn,
.MuiTableCell-root a {
  color: #27235e !important;
  text-decoration: underline !important;
  font-weight: 600 !important;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  font-size: inherit;
  transition: var(--transition-fast) !important;
}

.table-link-btn:hover,
.MuiTableCell-root a:hover {
  color: #ffbc34 !important;
  text-decoration: underline !important;
}

/* Global Chips / Badges */
.status-chip,
.MuiChip-root {
  height: 24px !important;
  border-radius: 0px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  border: none !important;
}

.status-chip.active,
.status-chip.success {
  background-color: #8fed8f !important;
  color: #0c5e0c !important;
}

.status-chip.inactive,
.status-chip.default {
  background-color: #ff8f8f !important;
  color: #800f0f !important;
}

.status-chip.default{
  background-color: yellow !important;
}

/* Global Table Pagination Controls */
.MuiTablePagination-root {
  background-color: #ffffff !important;
  border-top: 1px solid #e2e8f0 !important;
  color: #334155 !important;
  font-family: inherit !important;
}

.MuiTablePagination-toolbar {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.MuiTablePagination-selectLabel,
.MuiTablePagination-displayedRows {
  font-size: 13px !important;
  font-weight: 600 !important;
}

/* Smooth Table Scrollbars globally */
.table-container::-webkit-scrollbar,
.MuiTableContainer-root::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.table-container::-webkit-scrollbar-track,
.MuiTableContainer-root::-webkit-scrollbar-track {
  background: #f5f6fa;
}

.table-container::-webkit-scrollbar-thumb,
.MuiTableContainer-root::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 4px;
}

.table-container::-webkit-scrollbar-thumb:hover,
.MuiTableContainer-root::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* ==========================================
   Global Dialog & Form Redesign Styles
   ========================================== */

/* Dialog Backdrop (Premium blur effect) */
body .MuiDialog-root .MuiBackdrop-root,
body .MuiModal-root:not(.MuiPopover-root):not(.MuiMenu-root) .MuiBackdrop-root,
body .MuiModal-root:not(.MuiPopover-root):not(.MuiMenu-root) .MuiModal-backdrop {
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
  background-color: rgba(14, 12, 49, 0.45) !important;
  /* Semi-transparent dark primary overlay */
}

/* Ensure Popovers and Menus do not get blur or dark backdrop overlays */
body .MuiPopover-root .MuiBackdrop-root,
body .MuiPopover-root .MuiModal-backdrop,
body .MuiMenu-root .MuiBackdrop-root,
body .MuiMenu-root .MuiModal-backdrop {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background-color: transparent !important;
}

/* Dialog Container (Paper) */
body .MuiDialog-paper {
  /* border-radius: 16px !important; */
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.08) !important;
  border: 1px solid #e2e8f0 !important;
  overflow: hidden !important;
  background-color: #ffffff !important;
}

/* Dialog Header (Title) */
body .MuiDialogTitle-root {
  padding: 20px 24px !important;
  font-family: inherit !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: #0e0c31 !important;
  /* Brand dark primary */
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  border-bottom: 1px solid #e2e8f0 !important;
}

/* Ensure typography elements inside title inherit the bold styling */
body .MuiDialogTitle-root .MuiTypography-root,
body .MuiDialogTitle-root h2 {
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: #0e0c31 !important;
  font-family: inherit !important;
}

/* Header Close Button styling */
body .MuiDialogTitle-root .MuiIconButton-root,
body .MuiDialogTitle-root button {
  color: #64748b !important;
  padding: 8px !important;
  margin-right: -8px !important;
  transition: all 0.2s ease-in-out !important;
}

body .MuiDialogTitle-root .MuiIconButton-root:hover,
body .MuiDialogTitle-root button:hover {
  background-color: #f1f5f9 !important;
  color: #0e0c31 !important;
}

/* Dialog Content */
body .MuiDialogContent-root {
  /* padding: 24px !important; */
  background-color: #ffffff !important;
}

/* Dialog Actions (Footer) */
body .MuiDialogActions-root {
  padding: 16px 24px 20px 24px !important;
  background-color: #ffffff !important;
  gap: 12px !important;
  justify-content: flex-end !important;
}

/* Dialog Dividers - Hide them to let header border handle separating, matching reference */
body .MuiDialog-paper hr,
body .MuiDialog-paper .MuiDivider-root {
  display: none !important;
}

/* Outlined Inputs inside Dialogs */
body .MuiDialogContent-root .MuiOutlinedInput-root {
  /* border-radius: 8px !important; */
  background-color: #ffffff !important;
  transition: all 0.2s ease-in-out !important;
}

/* Input hover outline */
body .MuiDialogContent-root .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {
  border-color: #94a3b8 !important;
}

/* Input focus outline (Brand color focus ring) */
body .MuiDialogContent-root .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {
  border-color: #27235e !important;
  border-width: 1.5px !important;
}

body .MuiDialogContent-root .MuiOutlinedInput-root.Mui-focused {
  box-shadow: 0 0 0 4px rgba(39, 35, 94, 0.1) !important;
}

/* Input label styling */
body .MuiDialogContent-root .MuiInputLabel-root {
  color: #64748b !important;
  font-size: 14px !important;
}

body .MuiDialogContent-root .MuiInputLabel-root.Mui-focused {
  color: #27235e !important;
}

/* Required asterisk coloring */
body .MuiDialogContent-root .MuiInputLabel-asterisk,
body .MuiDialogContent-root .MuiFormLabel-asterisk {
  color: #ff3b30 !important;
  /* Red asterisk */
}

/* Input Validation Error Border */
body .MuiDialogContent-root .MuiOutlinedInput-root.Mui-error .MuiOutlinedInput-notchedOutline {
  border-color: #ff3b30 !important;
  border-width: 1.5px !important;
}

body .MuiDialogContent-root .MuiOutlinedInput-root.Mui-error.Mui-focused {
  box-shadow: 0 0 0 4px rgba(255, 59, 48, 0.1) !important;
}

/* Input Validation Error Label */
body .MuiDialogContent-root .MuiInputLabel-root.Mui-error {
  color: #ff3b30 !important;
}

/* Form Helper Text / Errors styling */
body .MuiDialogContent-root .MuiFormHelperText-root {
  font-size: 11px !important;
  font-weight: 500 !important;
  margin-top: 3px !important;
  margin-left: 4px !important;
}

body .MuiDialogContent-root .MuiFormHelperText-root.Mui-error {
  color: #ff3b30 !important;
}

body .MuiDialogContent-root .MuiFormHelperText-root:not(.Mui-error) {
  color: #8e8e93 !important;
}

/* Footer Buttons */
body .MuiDialogActions-root .MuiButton-root {
  text-transform: none !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  /* border-radius: 4px !important; */
  padding: 8px 24px !important;
  min-width: 100px !important;
  box-shadow: none !important;
  transition: all 0.2s ease-in-out !important;
}

/* Contained Primary Button (Save/Action) */
body .MuiDialogActions-root .MuiButton-containedPrimary {
  background-color: #27235e !important;
  color: #ffffff !important;
}

body .MuiDialogActions-root .MuiButton-containedPrimary:hover {
  background-color: #1a1740 !important;
}

body .MuiDialogActions-root .MuiButton-containedPrimary.Mui-disabled {
  background-color: #e2e8f0 !important;
  color: #94a3b8 !important;
}

/* Outlined Button (Cancel) */
body .MuiDialogActions-root .MuiButton-outlined,
body .MuiDialogActions-root .MuiButton-outlinedInherit {
  border: 1px solid #cbd5e1 !important;
  color: #475569 !important;
  background-color: #ffffff !important;
}

body .MuiDialogActions-root .MuiButton-outlined:hover,
body .MuiDialogActions-root .MuiButton-outlinedInherit:hover {
  background-color: #f8fafc !important;
  border-color: #94a3b8 !important;
  color: #0f172a !important;
}

/* Style native select options globally */
select option {
  background-color: #ffffff !important;
  color: #333333 !important;
  font-family: inherit !important;
  font-size: 14px !important;
}

/* Align Autocomplete inputs inside the filters box to match standard variant TextFields */
.filter-panel .MuiAutocomplete-root .MuiInput-root,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiAutocomplete-root .MuiInput-root {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
  min-height: 12px !important;
}

.filter-panel .MuiAutocomplete-root .MuiAutocomplete-input,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiAutocomplete-root .MuiAutocomplete-input {
  padding-top: 4px !important;
  padding-bottom: 4px !important;
  padding-left: 0 !important;
}

/* Remove default margin-top between label and input for standard variant inputs inside filter box */
.filter-panel .MuiInputLabel-root+.MuiInput-root,
.filter-panel .MuiInputLabel-root+.MuiInputBase-root,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiInputLabel-root+.MuiInput-root,
.MuiBox-root:has(> .MuiTextField-root):has(> .MuiFormControl-root):not(.MuiDialog-root *) .MuiInputLabel-root+.MuiInputBase-root {
  margin-top: 0px !important;
}

/* Global MenuItem Text and Icons Gray Styling */
body .MuiMenuItem-root {
  color: #555555 !important;
  /* Premium neutral gray for text */
  font-size: 14px !important;
  font-weight: 400 !important;
  padding: 15px;

  gap: 10px;
  transition: all 0.2s ease-in-out !important;
}

body .MuiMenuItem-root .MuiSvgIcon-root {
  color: #777777 !important;
  /* Premium gray for icons */
  transition: all 0.2s ease-in-out !important;
}

/* Hover state styling */
body .MuiMenuItem-root:hover {
  background-color: #f1f5f9 !important;
  color: #0f172a !important;
  /* Dark color on hover */
}

body .MuiMenuItem-root:hover .MuiSvgIcon-root {
  color: #0f172a !important;
  /* Dark color for icons on hover */
}

/* =====================================================
   Universal Dialog Text Field Height
   Applies 45px height to all single-line outlined
   TextFields inside MUI Dialogs (settings forms, etc.)
   This removes the need for repeated inline sx styles.
   ===================================================== */
.MuiDialog-root .MuiInputBase-root.MuiOutlinedInput-root:not(.MuiInputBase-multiline) {
  height: 45px;
}

/* Ensure Autocomplete height is auto to handle multiple selected chips dynamically */
.MuiDialog-root .MuiAutocomplete-root .MuiInputBase-root.MuiOutlinedInput-root {
  height: auto !important;
  min-height: 45px;
}

/* Ensure label floats correctly with fixed height */
.MuiDialog-root .MuiInputLabel-root.MuiInputLabel-outlined:not(.MuiInputLabel-shrink) {
  top: 22.5px;
  transform: translate(14px, -50%) scale(1);
}
.MuiDialog-root .MuiInputLabel-root.MuiInputLabel-outlined.MuiInputLabel-shrink {
  top: 0;
  transform: translate(14px, -9px) scale(0.75);
}

/* Universal dialog button styles */
.MuiDialog-root .MuiDialogActions-root .MuiButton-outlined {
  text-transform: none;
  border-radius: 8px;
  padding: 6px 20px;
  color: #666;
  border-color: #ccc;
}
.MuiDialog-root .MuiDialogActions-root .MuiButton-outlined:hover {
  border-color: #999;
  background-color: #f5f5f5;
}
.MuiDialog-root .MuiDialogActions-root .MuiButton-contained {
  text-transform: none;
  border-radius: 8px;
  padding: 6px 20px;
  background-color: #27235e;
  color: #fff;
}
.MuiDialog-root .MuiDialogActions-root .MuiButton-contained:hover {
  background-color: #1c1a5c;
}

/* Login form helper text padding */
.login-container .MuiFormHelperText-root {
  padding-top: 14px !important;
}

/* Ensure all TextFields and Autocompletes inside Dialogs have a min-width of 300px */
.MuiDialog-root .MuiTextField-root,
.MuiDialog-root .MuiAutocomplete-root,
.MuiDialog-root .MuiFormControl-root {
  min-width: 300px !important;
}

/* Center Table Pagination & style arrows */
.MuiTablePagination-root {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.MuiTablePagination-toolbar {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  padding: 0 !important;
}

.MuiTablePagination-spacer {
  display: none !important;
}

.MuiTablePagination-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Pagination Arrow Styles */
.MuiTablePagination-actions .MuiIconButton-root {
  color: #27235e !important;
  background-color: #f5f6fa !important;
  border-radius: 4px !important;
  padding: 6px !important;
  border: 1px solid #e2e8f0 !important;
  transition: all 0.2s ease-in-out !important;
}

.MuiTablePagination-actions .MuiIconButton-root:hover {
  background-color: #e9ecf8 !important;
  border-color: #cbd5e1 !important;
}

.MuiTablePagination-actions .MuiIconButton-root.Mui-disabled {
  color: #cbd5e1 !important;
  background-color: #fafafa !important;
  border-color: #f1f5f9 !important;
  opacity: 0.6 !important;
}

/* Hide Rows per page options globally */
.MuiTablePagination-selectLabel,
.MuiTablePagination-selectRoot,
.MuiTablePagination-select,
.MuiTablePagination-input {
  display: none !important;
}