/* start file: dist/login.css */
body {
  padding: 0px !important;
  position: relative;
}

.login-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 100vh;
  padding: 30px;
}

.login-form-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: column;
  height: 100%;
  padding-top: 28px;
  padding-bottom: 28px;
  padding-left: 30px;
}

.carousel-section {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-left: 0;
  padding-right: 0;
}
.carousel-section .banner-carousel {
  position: relative;
  height: 100%;
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  border-radius: 50px;
  margin-right: 40px;
  background: #eef2ff;
}
.carousel-section .banner-carousel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(100deg, #eef2ff 30%, #f7f9ff 50%, #eef2ff 70%);
  background-size: 200% 100%;
  animation: banner-skeleton-shimmer 1.5s ease-in-out infinite;
}
@keyframes banner-skeleton-shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}
.carousel-section .banner-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  border-radius: 50px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.6s ease;
}
.carousel-section .banner-frame.is-active {
  opacity: 1;
  pointer-events: auto;
}
.carousel-section .banner-carousel-dots {
  position: absolute;
  left: 50%;
  bottom: 28px;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 2;
}
.carousel-section .banner-dot {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.25);
  cursor: pointer;
  transition: width 0.25s ease, background 0.25s ease;
}
.carousel-section .banner-dot.is-active {
  width: 22px;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.65);
}

.login-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.login-header .download-app-wrapper, .login-header .cancel-btn {
  margin-left: auto;
}

.languageDropdown,
.dropdown {
  position: relative;
}

.languageBtn {
  background: #FFFFFF;
  border: 1px solid #BCC9DF;
  border-radius: 16px;
  padding: 10px 8px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  cursor: pointer;
  color: #000000;
  width: 90px;
}
.languageBtn:hover {
  background: #FFFFFF;
}
.languageBtn::after {
  margin-left: 6px;
}

.languageMenu {
  display: none;
  position: absolute;
  right: -25px;
  top: 100%;
  z-index: 1000;
  list-style: none;
  background: #FFFFFF;
  border-radius: 8px;
  border: 1px solid #BCC9DF;
  min-width: 140px;
  margin: 10px 0 0 0;
  overflow: hidden;
  padding: 0;
  box-shadow: 0 18px 44px rgba(52, 66, 95, 0.1);
  padding: 16px 12px;
  border: 1px solid var(--GRAY-Gray-200, #D3DEEF);
}
.languageMenu .dropdown-item {
  display: block;
  padding: 8px 12px;
  color: #222A39;
  text-decoration: none;
  cursor: pointer;
  border-radius: 12px;
}
.languageMenu .dropdown-item:hover {
  background: #F5F7FB;
}
.languageMenu .dropdown-item.active {
  background-color: #EAECFF;
  color: var(--Gray, #6f6b6b);
  font-weight: 600;
}
.languageMenu .dropdown-item.active:hover {
  background-color: #e8ebf6;
  color: var(--Gray, #6f6b6b);
}

.downloadAppBtn {
  background: #222A39;
  border-radius: 12px;
  padding: 10px 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  cursor: pointer;
  font-size: 14px;
  color: #FFFFFF;
  position: relative;
}
.downloadAppBtn p {
  font-family: var(--font-body);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  margin: 0;
}

.qrContainer {
  display: none;
  position: absolute;
  right: 0px;
  z-index: 1000;
  margin-top: 10px;
}

.qrBox {
  background: #FFFFFF;
  border: 1px solid #BCC9DF;
  border-radius: 16px;
  padding: 12px;
  width: 190px;
  text-align: center;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}
.qrBox img {
  width: 100%;
  height: auto;
}

.slf-login-title {
  color: #141D2D;
  text-align: center;
  font-family: var(--font-body);
  font-size: 28px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  margin-bottom: 12px;
}

.otp-form {
  width: 62%;
  margin: auto;
}
.otp-form #pinwrapper {
  margin-right: 30px;
}

.login_form {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.login_form .site_logo {
  margin-bottom: 32px;
}
.login_form .form-control {
  padding: 10px 14px 10px 16px;
  border-radius: 12px;
  border: 1px solid #BCC9DF;
  height: 48px;
}
.login_form #password-inputs > .field {
  margin-bottom: 16px;
}

.position-relative {
  position: relative;
}

.login-form-default {
  width: 100%;
  background: #FFFFFF;
  border-radius: 26px;
  padding: 24px;
}

#login-inputs {
  width: 50%;
  margin-top: 20px;
}

.from-group-right {
  position: relative;
}
.from-group-right input {
  padding-right: 40px !important;
}

.pasdword-state {
  cursor: pointer;
  border-radius: 15px;
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 5px;
}

.from-group-addon-right {
  position: absolute;
  bottom: 0;
  right: 0;
}

.bi-eye-slash::before {
  content: "";
}
.bi-eye-slash {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  background-color: currentColor;
  -webkit-mask: url("/design/images/newDesign/eye-closed.svg") no-repeat center/contain;
  mask: url("/design/images/newDesign/eye-closed.svg") no-repeat center/contain;
}

.sso-button {
  width: 100%;
  padding: 10px 48px;
  background: #EAECFF;
  border-radius: 24px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}
.sso-button:hover {
  background: #E4E5FF;
}
.sso-button i {
  color: #6F61EA;
  font-size: 20px;
  transform: rotate(-10deg);
}

.sso-button-text {
  text-align: center;
  color: #6F61EA;
  font-size: 14px;
  font-family: var(--font-body);
  font-weight: 500;
  line-height: 22px;
}

.login-submit {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}
.login-submit button {
  width: 100%;
  border-radius: 24px !important;
  background: #6F61EA !important;
  border: none;
  margin-top: 24px !important;
  padding: 10px 48px;
  color: #FFFFFF;
  text-align: center;
  font-family: var(--font-body);
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
}
.login-submit button:hover {
  background: #6251E3 !important;
  color: #FFFFFF;
}
.login-submit button:focus {
  color: #FFFFFF;
}

.or-divider {
  width: 100%;
  height: 100%;
  display: inline-flex;
  justify-content: flex-start;
  align-items: center;
  gap: 14px;
}

#csrf-expired {
  padding: 24px 0;
  color: #D40F2A;
}
#csrf-expired .slf-login-title {
  font-size: 20px;
  margin-bottom: 24px;
  color: #D40F2A;
}
#csrf-expired .login-submit .btn {
  width: 100%;
  max-width: 480px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 10px 48px;
  border: none;
  border-radius: 24px;
  background: #6F61EA;
  color: #FFFFFF;
  text-align: center;
  text-decoration: none;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
}
#csrf-expired .login-submit .btn:hover {
  background: #6251E3;
  color: #FFFFFF;
}
#csrf-expired .login-submit .btn:focus {
  color: #FFFFFF;
}

.or-divider-line {
  width: 50%;
  height: 0;
  opacity: 0.4;
  border-top: 1px solid #A5B3C9;
}

.or-divider-text {
  opacity: 0.8;
  text-align: center;
  color: #3D4451;
  font-size: 14px;
  font-family: var(--font-body);
  font-weight: 400;
  line-height: 22px;
  white-space: nowrap;
}

.session-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.session-container div {
  padding-top: 0 !important;
}
.session-container label {
  color: #596476;
  font-family: var(--font-body);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  padding-left: 0;
}
.session-container .pass_restore_link a {
  color: #6F61EA;
  text-align: center;
  font-family: var(--font-body);
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  cursor: pointer;
}
.session-container .form-group {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.session-container input[type=checkbox] {
  border-radius: 24px;
  border: 1.2px solid #A5B3C9;
  width: 25px;
  height: 25px;
  margin-right: 12px;
  outline: none !important;
}

.self-radio {
  appearance: none;
  -webkit-appearance: none;
  border-radius: 50%;
  display: inline-block;
  position: relative;
  cursor: pointer;
  outline: none;
}

.cancel-btn-container button:nth-last-child(0) {
  justify-content: flex-end;
}

.cancel-btn {
  border-radius: 8px;
  background: #EFF2FF;
  justify-self: flex-end;
  border: none;
  outline: none;
  display: flex;
  height: 44px;
  padding: 0 16px;
  justify-content: center;
  align-items: center;
  gap: 14px;
  color: #222A39;
  font-size: 16px;
  font-family: "Poppins", "Noto Sans Georgian", system-ui, -apple-system, sans-serif;
  font-weight: 500;
  line-height: 12px;
  word-wrap: break-word;
}
.cancel-btn:hover {
  background: #E4E5FF;
}
.cancel-btn__icon {
  display: none;
}

.app-cancel-btn {
  position: absolute;
  right: -5px;
  top: -13px;
  border: 2px solid #FFFFFF;
  border-radius: 50%;
  height: 25px;
  width: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: white;
}
.app-cancel-btn i {
  font-size: 20px;
  transform: translate(-1px, 0px);
  background-color: white;
  border-radius: 50%;
}

.otp-setup-container {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 18px;
  width: 100%;
  margin-top: 30px;
}
.otp-setup-container::before {
  content: "";
  position: absolute;
  left: 17px;
  top: 17px;
  bottom: 17px;
  border-left: 1px dashed #758199;
  z-index: 0;
}

.otp-step {
  display: flex;
  align-items: center;
  gap: 13px;
}

.otp-step-number {
  position: relative;
  z-index: 1;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  border: 1px solid #758199;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Poppins", "Noto Sans Georgian", system-ui, -apple-system, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  color: #222A39;
  background: #FFFFFF;
  opacity: 0.8;
}

.otp-step-text {
  margin: 0;
  color: #3D4451;
  font-family: var(--font-body);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
}

.otp-qr-card {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-start;
  gap: 18px;
  padding: 10px;
  width: 100%;
  border: 1px solid #D3DEEF;
  border-radius: 16px;
  background: #F0F3FD;
  margin-bottom: 25px;
}

.otp-qr-image {
  flex: 0 0 128px;
  width: 128px;
  height: 128px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.otp-qr-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.otp-qr-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding-top: 4px;
}

.otp-info-lines {
  display: flex;
  flex-direction: column;
}

.otp-info-row {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  color: #222A39;
  font-family: "Poppins", "Noto Sans Georgian", system-ui, -apple-system, sans-serif;
  font-size: 11px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  opacity: 0.6;
}

.otp-label,
.otp-value {
  font-weight: 400;
}

.otp-secret-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.otp-secret {
  font-family: "Poppins", "Noto Sans Georgian", system-ui, -apple-system, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  color: #222A39;
  word-break: break-all;
}

.otp-copy-button {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  padding: 0;
  border: none;
  background: none;
  color: #3D4451;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.otp-copy-button i {
  font-size: 18px;
}
.otp-copy-button:hover {
  color: #141D2D;
}

.otp-inputs,
.pinlogin {
  display: flex;
  gap: 12px;
  justify-content: center;
  align-items: center;
}

.otp-input,
.pinlogin .pinlogin-field {
  display: flex;
  width: 70px;
  height: 70px;
  padding: 12.828px 21.379px;
  justify-content: space-between;
  align-items: center;
  aspect-ratio: 1/1;
  border-radius: 14px;
  border: 1.069px solid #BCC9DF;
  font-size: 22px;
  font-weight: 500;
  text-align: center;
  outline: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  margin-bottom: 80px;
  margin-top: 30px;
}
.otp-input:focus,
.pinlogin .pinlogin-field:focus {
  border: 1.069px solid #222A39;
  box-shadow: 0 0 0 3px rgba(111, 97, 234, 0.2);
}

.pinlogin .pinlogin-field.invalid {
  border-color: #FA3E93;
}

.otp-resend {
  width: 100%;
  height: 100%;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 5px;
}

.otp-info-text {
  color: #222A39;
  font-family: "Poppins", "Noto Sans Georgian", system-ui, -apple-system, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  opacity: 0.6;
}

.otp-resend-text {
  opacity: 0.6;
  color: #222A39;
  font-size: 14px;
  font-family: "Poppins", "Noto Sans Georgian", system-ui, -apple-system, sans-serif;
  font-weight: 400;
}

.otp-resend-btn {
  background: none;
  border: none;
  padding: 0;
  color: #6F61EA;
  font-size: 14px;
  font-family: "Poppins", "Noto Sans Georgian", system-ui, -apple-system, sans-serif;
  font-weight: 500;
  cursor: pointer;
}
.otp-resend-btn:hover {
  text-decoration: underline;
}
.otp-resend-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.login_flogo img {
  width: auto;
  object-fit: contain;
  max-width: 160px;
  max-height: 48px;
}

.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.login_flogo {
  flex-shrink: 0;
}

.footer-info {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
  min-width: 0;
  text-align: right;
}
.footer-info .footer-company {
  overflow-wrap: anywhere;
}
.footer-info span, .footer-info a {
  color: #222A39;
  font-family: var(--font-body);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
}
.footer-info .footer-articles span,
.footer-info .footer-articles a {
  font-size: 12px;
}

.article-modal__header .article-modal__title {
  font-weight: bold;
}

.terms-block {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 5px;
  cursor: pointer;
}

.footer-articles__link {
  display: inline-block;
  max-width: 250px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
}
.footer-articles__link:hover {
  color: var(--color-gray-600);
}

body.article-modal-open {
  overflow: hidden;
}

.article-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999999;
  align-items: center;
  justify-content: center;
  padding: 30px;
}
.article-modal.is-open {
  display: flex;
}
.article-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(34, 42, 57, 0.45);
}
.article-modal__dialog {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 40px;
  width: 100%;
  max-width: 1100px;
  max-height: calc(100vh - 60px);
  padding: 60px 80px;
  background: #FFFFFF;
  border-radius: 38px;
  box-shadow: 0 4px 54px rgba(46, 53, 75, 0.07);
  box-sizing: border-box;
}
.article-modal__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
}
.article-modal__title {
  margin: 0;
  color: #222A39;
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 500;
  line-height: normal;
  word-break: break-word;
}
.article-modal__close {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  padding: 0;
  border: none;
  background: transparent;
  color: #222A39;
  cursor: pointer;
  transition: all 0.2s ease;
}
.article-modal__close:hover {
  color: #6F61EA;
}
.article-modal__close i {
  font-size: 16px;
  line-height: 1;
}
.article-modal__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 20px;
  color: #222A39;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
}
.article-modal__body h1, .article-modal__body h2, .article-modal__body h3, .article-modal__body h4 {
  margin: 0 0 8px;
  font-weight: 500;
  line-height: normal;
}
.article-modal__body h1, .article-modal__body h2 {
  font-size: 16px;
  color: #222A39;
}
.article-modal__body h3, .article-modal__body h4 {
  font-size: 14px;
  color: #758199;
}
.article-modal__body p {
  margin: 0 0 16px;
  opacity: 0.8;
}
.article-modal__body ul, .article-modal__body ol {
  margin: 0 0 16px;
  padding-left: 22px;
  opacity: 0.8;
}
.article-modal__body li {
  margin-bottom: 4px;
}
.article-modal__body a {
  color: #222A39;
  text-decoration: underline;
}
.article-modal__body::-webkit-scrollbar {
  width: 4px;
}
.article-modal__body::-webkit-scrollbar-track {
  background: transparent;
}
.article-modal__body::-webkit-scrollbar-thumb {
  background: #BBB4FD;
  border-radius: 4px;
}
.article-modal__body {
  scrollbar-width: thin;
  scrollbar-color: #A5B3C9 transparent;
}
.article-modal__footer {
  flex-shrink: 0;
}
.article-modal__ok {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 200px;
  height: 48px;
  padding: 14px 48px;
  border: none;
  border-radius: 24px;
  background: #6F61EA;
  color: #FFFFFF;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  text-align: center;
  cursor: pointer;
  transition: all 0.2s ease;
}
.article-modal__ok:hover {
  background: #6251E3;
  color: #FFFFFF;
}

.cookie-consent {
  position: absolute;
  left: calc(50% + 30px);
  right: 30px;
  bottom: 95px;
  z-index: 1200;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 16px;
  max-width: 750px;
  margin-inline: auto;
  padding: 24px 28px;
  border: 1px solid #D3DEEF;
  border-radius: 24px;
  background: #FFFFFF;
  box-shadow: 0 2px 30px 0 rgba(214, 217, 229, 0.3);
  margin-bottom: 15px;
}
.cookie-consent__icon {
  flex: 0 0 58px;
  width: 58px;
  height: 58px;
  overflow: hidden;
}
.cookie-consent__icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.cookie-consent__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.cookie-consent__text {
  margin: 0;
  max-width: 425px;
  color: #758199;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  line-height: 22px;
  word-break: break-word;
}
.cookie-consent__link {
  color: #222A39;
  font-weight: 500;
  text-decoration: underline;
  cursor: pointer;
}
.cookie-consent__link:hover {
  color: #6F61EA;
}
.cookie-consent__accept {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 180px;
  height: 48px;
  padding: 14px 20px;
  border: none;
  border-radius: 24px;
  background: #222A39;
  color: #FFFFFF;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  text-align: center;
  cursor: pointer;
  transition: all 0.2s ease;
}
.cookie-consent__accept:hover {
  background: #3D4451;
}

.mobile-app-download {
  display: none;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 90%;
  padding: 12px 14px;
  border-radius: 20px 0 20px 20px;
  background: #282F60;
  box-sizing: border-box;
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  bottom: 10px;
  z-index: 1000;
}

.app-left {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}

.app-icon {
  width: 52px;
  height: 52px;
  flex-shrink: 0;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.app-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.app-info {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.app-title {
  color: #FFFFFF;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.3px;
}

.app-description {
  color: rgba(255, 255, 255, 0.85);
  font-size: 13px;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.download-btn {
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  border: 1px dashed rgba(255, 255, 255, 0.4);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.08);
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
}
.download-btn:hover {
  background: rgba(255, 255, 255, 0.15);
}
.download-btn svg {
  width: 18px;
  height: 18px;
}

.error_message {
  display: inline-flex;
  padding: 6px 16px 6px 10px;
  align-items: center;
  gap: 8px;
  border-radius: 12px;
  background: #FFCFEA;
  margin-left: 30px;
  margin-top: 20px;
}

.login-error-banner {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 36px;
  padding: 6px 16px 6px 10px;
  margin-bottom: 16px;
  border-radius: 12px;
  background: #FFCFEA;
  color: #222A39;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
}
.login-error-banner i {
  flex-shrink: 0;
  font-size: 20px;
  color: #222A39;
}

.otp-field-group {
  margin-top: 10px;
}

#login-inputs.has-error .form-control,
#login-inputs.has-error .input {
  border-color: #EB267F;
  color: #EB267F;
}
#login-inputs.has-error .form-control::placeholder,
#login-inputs.has-error .input::placeholder {
  color: #EB267F;
  opacity: 1;
}

#pinwrapper.has-error .pinlogin-field,
#pinwrapper.has-error .otp-input {
  border-color: #EB267F;
  color: #EB267F;
}

.carousel {
  position: relative;
}

.carousel-inner {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.carousel-inner > .item {
  position: relative;
  display: none;
  transition: 0.6s ease-in-out left;
}
.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
  line-height: 1;
}
.carousel-inner > .active,
.carousel-inner > .next,
.carousel-inner > .prev {
  display: block;
}
.carousel-inner > .active {
  left: 0;
}
.carousel-inner > .next,
.carousel-inner > .prev {
  position: absolute;
  top: 0;
  width: 100%;
}
.carousel-inner > .next {
  left: 100%;
}
.carousel-inner > .prev {
  left: -100%;
}
.carousel-inner > .next.left,
.carousel-inner > .prev.right {
  left: 0;
}
.carousel-inner > .active.left {
  left: -100%;
}
.carousel-inner > .active.right {
  left: 100%;
}

@media all and (transform-3d), (-webkit-transform-3d) {
  .carousel-inner > .item {
    transition: transform 0.6s ease-in-out;
    backface-visibility: hidden;
    perspective: 1000px;
  }
  .carousel-inner > .item.next,
  .carousel-inner > .item.active.right {
    left: 0;
    transform: translate3d(100%, 0, 0);
  }
  .carousel-inner > .item.prev,
  .carousel-inner > .item.active.left {
    left: 0;
    transform: translate3d(-100%, 0, 0);
  }
  .carousel-inner > .item.next.left,
  .carousel-inner > .item.prev.right,
  .carousel-inner > .item.active {
    left: 0;
    transform: translate3d(0, 0, 0);
  }
}
.carousel-control {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 15%;
  font-size: 20px;
  color: #FFFFFF;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  background-color: rgba(0, 0, 0, 0);
  opacity: 0.5;
}
.carousel-control.left {
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
  background-repeat: repeat-x;
}
.carousel-control.right {
  right: 0;
  left: auto;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
  background-repeat: repeat-x;
}
.carousel-control:hover, .carousel-control:focus {
  color: #FFFFFF;
  text-decoration: none;
  outline: 0;
  opacity: 0.9;
}
.carousel-control .icon-prev,
.carousel-control .icon-next,
.carousel-control .glyphicon-chevron-left,
.carousel-control .glyphicon-chevron-right {
  position: absolute;
  top: 50%;
  z-index: 5;
  display: inline-block;
  margin-top: -10px;
}
.carousel-control .icon-prev,
.carousel-control .glyphicon-chevron-left {
  left: 50%;
  margin-left: -10px;
}
.carousel-control .icon-next,
.carousel-control .glyphicon-chevron-right {
  right: 50%;
  margin-right: -10px;
}
.carousel-control .icon-prev,
.carousel-control .icon-next {
  width: 20px;
  height: 20px;
  line-height: 1;
}
.carousel-control .icon-prev:before {
  content: "‹";
}
.carousel-control .icon-next:before {
  content: "›";
}

.carousel-indicators {
  position: absolute;
  bottom: 10px;
  right: 50%;
  z-index: 15;
  padding-left: 0;
  text-align: center;
  list-style: none;
}
.carousel-indicators li {
  display: inline-block;
  width: 18px;
  height: 4px;
  margin: 1px;
  text-indent: -999px;
  cursor: pointer;
  border: 1px solid #f8fafa;
  border-radius: 40px;
  opacity: 0.6;
  background: #758199;
}
.carousel-indicators .active {
  margin: 0;
  width: 48px;
  height: 4px;
  border: 1px solid #bfe2d7;
  border-radius: 40px;
  background: #222A39;
}

.carousel-caption {
  position: absolute;
  right: 1%;
  top: 10%;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #FFFFFF;
  text-align: right;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
.carousel-caption .btn {
  text-shadow: none;
}

@media (min-width: 768px) {
  .carousel-control .glyphicon-chevron-left,
  .carousel-control .glyphicon-chevron-right,
  .carousel-control .icon-prev,
  .carousel-control .icon-next {
    width: 30px;
    height: 30px;
    margin-top: -10px;
    font-size: 30px;
  }
  .carousel-control .glyphicon-chevron-left,
  .carousel-control .icon-prev {
    margin-left: -10px;
  }
  .carousel-control .glyphicon-chevron-right,
  .carousel-control .icon-next {
    margin-right: -10px;
  }
  .carousel-caption {
    padding-bottom: 30px;
  }
  .carousel-indicators {
    bottom: 0;
  }
}
@media (max-width: 991.98px) {
  .login-container {
    flex-direction: column;
    justify-content: flex-start;
    height: auto;
    min-height: 100vh;
    padding: 20px;
  }
  .carousel-section {
    display: none;
  }
  .login-form-section {
    width: 100%;
    height: auto;
    padding-top: 20px;
    padding-bottom: 20px;
  }
  #login-inputs {
    width: 100%;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
  }
  .login-submit {
    width: 100%;
    max-width: 480px;
  }
  .cookie-consent {
    left: 20px;
    right: 20px;
  }
}
@media (max-width: 575.98px) {
  .login-container {
    background: #eaeff3;
    padding: 0;
  }
  .login-form-section {
    padding: 0;
    padding-top: 30px;
    width: 90%;
    min-height: 100dvh;
    height: auto;
  }
  .languageMenu {
    left: 0px;
  }
  #login-inputs {
    max-width: none;
  }
  .session-container {
    flex-direction: column-reverse;
    align-items: flex-start;
    gap: 2px;
  }
  .session-container .pass_restore_link {
    align-self: flex-end;
    margin-bottom: 0;
  }
  .download-app-wrapper {
    display: none;
  }
  .footer-bottom {
    flex-direction: column;
    gap: 20px;
    padding-bottom: 32px;
  }
  .article-modal__dialog {
    padding: 30px 20px;
    max-height: calc(100vh - 30%);
  }
  .footer-info {
    align-items: center;
    text-align: center;
  }
  .terms-block {
    justify-content: center;
  }
  .mobile-app-download {
    display: flex;
  }
  .cookie-consent {
    align-items: flex-start;
    gap: 12px;
    left: 12px;
    right: 12px;
    bottom: 150px;
    padding: 16px;
    border-radius: 20px;
  }
  .cookie-consent__icon {
    flex-basis: 40px;
    width: 40px;
    height: 40px;
  }
  .cookie-consent__body {
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
  }
  .cookie-consent__text {
    max-width: none;
  }
  .cookie-consent__accept {
    width: 100%;
  }
  .otp-input,
  .pinlogin .pinlogin-field {
    width: 40px;
    height: 40px;
    gap: 5px;
  }
  .cancel-btn {
    background: none;
    border-radius: 0;
    padding: 0;
    gap: 0;
    height: auto;
    color: #222A39;
  }
  .cancel-btn:hover {
    background: none;
  }
  .cancel-btn__text {
    display: none;
  }
  .cancel-btn__icon {
    display: inline-flex;
    font-size: 24px;
    line-height: 1;
    color: #222A39;
  }
}
.webview-layout.webview-login {
  height: auto;
  min-height: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.webview-layout.webview-login .login-container {
  height: auto;
}
.webview-layout.webview-login .login-form-section {
  height: auto;
  min-height: 0;
  justify-content: flex-start;
  gap: 24px;
}
.webview-layout.webview-login .mobile-app-download {
  display: none;
}

/* end file: dist/login.css */

/* start file: dist/main.css */
*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0;
}

html,
body {
  height: 100%;
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
}

input, button, textarea, select {
  font: inherit;
  color: inherit;
}

button {
  background: none;
  border: 0;
  cursor: pointer;
}

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

ul, ol {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word;
}

:focus {
  outline: none;
}

:focus-visible {
  outline: 1px solid var(--color-primary, #6F61EA);
  outline-offset: 2px;
  border-radius: 12px;
}

* {
  scrollbar-width: auto;
  scrollbar-color: var(--color-gray-300, #BCC9DF) transparent;
}

*::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

*::-webkit-scrollbar-track {
  background: transparent;
}

*::-webkit-scrollbar-thumb {
  background: var(--color-gray-300, #BCC9DF);
  border-radius: 40px;
  border: 3px solid transparent;
  background-clip: padding-box;
}

*::-webkit-scrollbar-thumb:hover {
  background: var(--color-gray-400, #A5B3C9);
  background-clip: padding-box;
}

*::-webkit-scrollbar-corner {
  background: transparent;
}

:root {
  --color-gray-0: #FFFFFF;
  --color-gray-10: #F4F7FF;
  --color-gray-50: #F8F9FC;
  --color-gray-100: #F0F3FD;
  --color-gray-150: #f4f5fa;
  --color-gray-200: #D3DEEF;
  --color-gray-300: #BCC9DF;
  --color-gray-400: #A5B3C9;
  --color-gray-500: #758199;
  --color-gray-600: #596476;
  --color-gray-700: #3D4451;
  --color-gray-800: #222A39;
  --color-gray-900: #141D2D;
  --color-purple-50: #F3F5FF;
  --color-purple-100: #EAECFF;
  --color-purple-150: #e4e6fc;
  --color-purple-200: #E4E5FF;
  --color-purple-300: #E8E6FC;
  --color-purple-400: #BBB4FD;
  --color-purple-800: #6F61EA;
  --color-purple-900: #6251E3;
  --color-pink-200: #F8E6FF;
  --color-pink-400: #F5C5F1;
  --color-pink-700: #E82ED9;
  --color-pink-800: #DA1BBE;
  --color-pink-900: #CE0097;
  --color-red-200: #FFE4F0;
  --color-red-400: #FFCFEA;
  --color-red-500: #f7a9d5;
  --color-red-800: #FA3E93;
  --color-red-900: #EB267F;
  --color-green-50: #e8faf4;
  --color-green-100: #D8F8EE;
  --color-green-200: #B8EAE0;
  --color-green-600: #01B39E;
  --color-green-700: #0C9B99;
  --color-green-800: #128394;
  --color-yellow-100: #FEF7DC;
  --color-yellow-200: #EEE2D1;
  --color-yellow-300: #F7E08A;
  --color-yellow-600: #FDAF42;
  --color-yellow-900: #7A5B00;
  --color-blue-50: #EFF6FF;
  --color-blue-100: #DBEAFE;
  --color-blue-200: #BFDBFE;
  --color-blue-400: #60A5FA;
  --color-blue-600: #2563EB;
  --color-blue-700: #1D4ED8;
  --color-blue-800: #1E40AF;
  --color-cyan-100: #CFFAFE;
  --color-cyan-200: #A5F3FC;
  --color-cyan-600: #0891B2;
  --color-cyan-900: #164E63;
  --color-black: #000000;
  --color-transparent: transparent;
  --color-primary: #6F61EA;
  --color-primary-hover: #6251E3;
  --color-primary-soft: #E4E5FF;
  --color-primary-soft-hover: #E8E6FC;
  --color-primary-softer: #EAECFF;
  --color-primary-strong: #BBB4FD;
  --color-secondary-softer: #F3F5FF;
  --color-text: #222A39;
  --color-text-strong: #141D2D;
  --color-text-muted: #596476;
  --color-text-subtle: #758199;
  --color-text-inverse: #FFFFFF;
  --color-border: #BCC9DF;
  --color-border-soft: #D3DEEF;
  --color-border-strong: #A5B3C9;
  --color-bg: #FFFFFF;
  --color-bg-soft: #F0F3FD;
  --color-bg-page: #F4F7FF;
  --color-danger: #FA3E93;
  --color-danger-soft: #FFE4F0;
  --color-danger-strong: #EB267F;
  --color-info: #2563EB;
  --color-info-soft: #DBEAFE;
  --color-info-strong: #1D4ED8;
  --color-success: #0C9B99;
  --color-success-soft: #D8F8EE;
  --color-success-strong: #128394;
  --color-accent: #DA1BBE;
  --color-accent-soft: #F8E6FF;
  --space-0: 0;
  --space-2: 2px;
  --space-4: 4px;
  --space-6: 6px;
  --space-8: 8px;
  --space-10: 10px;
  --space-12: 12px;
  --space-14: 14px;
  --space-16: 16px;
  --space-20: 20px;
  --space-24: 24px;
  --space-28: 28px;
  --space-30: 30px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-56: 56px;
  --space-64: 64px;
  --space-80: 80px;
  --space-96: 96px;
  --space-120: 120px;
  --space-auto: auto;
  --space-xs: 4px;
  --space-s: 8px;
  --space-m: 12px;
  --space-l: 16px;
  --radius-0: 0;
  --radius-4: 4px;
  --radius-8: 8px;
  --radius-10: 10px;
  --radius-12: 12px;
  --radius-14: 14px;
  --radius-16: 16px;
  --radius-20: 20px;
  --radius-24: 24px;
  --radius-26: 26px;
  --radius-30: 30px;
  --radius-40: 40px;
  --radius-50: 50px;
  --radius-full: 9999px;
  --font-geo: Poppins, Noto Sans Georgian, system-ui, sans-serif;
  --font-eng: Poppins, Noto Sans Georgian, system-ui, -apple-system, sans-serif;
  --font-sans: Poppins, Noto Sans Georgian, system-ui, -apple-system, sans-serif;
  --font-display: Poppins, Noto Sans Georgian, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  --font-body: Poppins, Noto Sans Georgian, system-ui, sans-serif;
  --fs-10: 10px;
  --fs-11: 11px;
  --fs-12: 12px;
  --fs-13: 13px;
  --fs-14: 14px;
  --fs-16: 16px;
  --fs-18: 18px;
  --fs-20: 20px;
  --fs-22: 22px;
  --fs-24: 24px;
  --fs-28: 28px;
  --fs-32: 32px;
  --fs-40: 40px;
  --fs-48: 48px;
  --fs-56: 56px;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;
  --shadow-none: none;
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 10px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.1);
  --shadow-xl: 0 20px 40px rgba(0, 0, 0, 0.12);
  --shadow-dropdown: 0 18px 44px rgba(52, 66, 95, 0.1);
  --shadow-hint: 0 8px 48px rgba(52, 66, 95, 0.2);
  --shadow-focus: 0 0 0 3px rgba(111, 97, 234, 0.2);
  --z-hide: -1;
  --z-base: 0;
  --z-docked: 10;
  --z-dropdown: 1000;
  --z-sticky: 1100;
  --z-overlay: 1200;
  --z-modal: 9999999;
  --z-popover: 1400;
  --z-toast: 1500;
  --z-tooltip: 1600;
}

body {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: var(--color-text);
  background: var(--color-bg);
}

h1, .h1 {
  font-size: 40px;
  font-weight: 600;
  line-height: 1.2;
}

h2, .h2 {
  font-size: 32px;
  font-weight: 600;
  line-height: 1.2;
}

h3, .h3 {
  font-size: 24px;
  font-weight: 500;
  line-height: 1.35;
}

h4, .h4 {
  font-size: 20px;
  font-weight: 500;
  line-height: 1.35;
}

h5, .h5 {
  font-size: 18px;
  font-weight: 500;
  line-height: 1.35;
}

h6, .h6 {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.35;
}

small {
  font-size: 12px;
}

strong, b {
  font-weight: 600;
}

code, kbd, samp, pre {
  font-family: var(--font-mono);
}

.text-style-geo-body-xs {
  font-family: "Poppins", "Noto Sans Georgian", system-ui, sans-serif;
  font-size: 11px;
  font-weight: 500;
  line-height: 11px;
  letter-spacing: 0;
}

.text-style-geo-body-s {
  font-family: "Poppins", "Noto Sans Georgian", system-ui, sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  letter-spacing: 0;
}

.text-style-geo-body-s-med {
  font-family: "Poppins", "Noto Sans Georgian", system-ui, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
  letter-spacing: 0;
}

.text-style-geo-body-m {
  font-family: "Poppins", "Noto Sans Georgian", system-ui, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  letter-spacing: 0;
}

.text-style-geo-body-m-med {
  font-family: "Poppins", "Noto Sans Georgian", system-ui, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  letter-spacing: 0;
}

.text-style-eng-body-m {
  font-family: "Poppins", "Noto Sans Georgian", system-ui, -apple-system, sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  letter-spacing: 0;
}

.text-style-eng-body-m-med {
  font-family: "Poppins", "Noto Sans Georgian", system-ui, -apple-system, sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  letter-spacing: 0;
}

.text-style-eng-sub-s {
  font-family: "Poppins", "Noto Sans Georgian", system-ui, -apple-system, sans-serif;
  font-size: 16px;
  font-weight: 500;
  line-height: 16px;
  letter-spacing: 0;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 44px;
  padding: 0 16px 0 16px;
  border: 1px solid transparent;
  border-radius: 24px;
  background: transparent;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  letter-spacing: 0;
  color: inherit;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.btn[hidden] {
  display: none;
}
.btn:focus-visible {
  box-shadow: 0 0 0 3px rgba(111, 97, 234, 0.2);
}
.btn:disabled, .btn.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}
.btn.btn-icon {
  width: 44px;
  padding: 0;
}

.btn-sm {
  height: 32px;
  padding: 0 12px;
  font-size: 12px;
  line-height: 18px;
  border-radius: 8px;
}
.btn-sm.btn-icon {
  width: 32px;
  padding: 0;
}

.btn-md {
  height: 44px;
  padding: 0 16px;
  font-size: 14px;
  line-height: 22px;
  border-radius: 24px;
}
.btn-md.btn-icon {
  width: 44px;
  padding: 0;
}

.btn-lg {
  height: 52px;
  padding: 0 20px;
  font-size: 16px;
  line-height: 22px;
  border-radius: 24px;
}
.btn-lg.btn-icon {
  width: 52px;
  padding: 0;
}

.btn-xl {
  height: 60px;
  padding: 0 24px;
  font-size: 16px;
  line-height: 22px;
  border-radius: 24px;
}
.btn-xl.btn-icon {
  width: 60px;
  padding: 0;
}

.btn-primary {
  background: var(--color-primary);
  color: var(--color-text-inverse);
}
.btn-primary:hover {
  background: var(--color-primary-hover);
}
.btn-primary:active {
  background: var(--color-primary-hover);
}

.btn-secondary {
  background: var(--color-primary-soft);
  color: var(--color-primary);
}
.btn-secondary:hover {
  background: var(--color-primary-softer);
}

.btn-outline {
  background: transparent;
  color: var(--color-primary);
  border-color: var(--color-primary);
}
.btn-outline:hover {
  background: var(--color-primary-soft);
}

.btn-ghost {
  background: transparent;
  color: var(--color-text);
}
.btn-ghost:hover {
  background: var(--color-bg-soft);
}

.btn-soft {
  background: var(--color-primary-softer);
  color: var(--color-primary);
}
.btn-soft:hover {
  background: var(--color-primary-soft);
}

.btn-softer {
  background: var(--color-secondary-softer);
  color: var(--color-secondary);
}
.btn-softer:hover {
  background: var(--color-primary-soft);
}

.btn-dark {
  background: #222A39;
  color: var(--color-text-inverse);
}
.btn-dark:hover {
  background: #141D2D;
}

.btn-danger {
  background: var(--color-danger);
  color: var(--color-text-inverse);
}
.btn-danger:hover {
  background: var(--color-danger-strong);
}

.btn-success {
  background: var(--color-success);
  color: var(--color-text-inverse);
}
.btn-success:hover {
  background: var(--color-success-strong);
}

.btn-accent {
  background: var(--color-accent);
  color: var(--color-text-inverse);
}
.btn-accent:hover {
  background: #CE0097;
}

.btn-LogIn .btn-primary {
  background: var(--color-green-700);
}
.btn-LogIn .btn-primary:hover, .btn-LogIn .btn-primary:active {
  background: var(--color-green-800);
}

.btn-LogOut .btn-primary {
  background: var(--color-primary);
}
.btn-LogOut .btn-primary:hover, .btn-LogOut .btn-primary:active {
  background: var(--color-primary-hover);
}

.btn-block {
  width: 100%;
}

.page-container.card {
  padding: 0;
}

.page_title, .rec-task-header {
  display: flex;
  position: sticky;
  top: 0;
  background: white;
  z-index: 50;
  min-height: 52px;
  padding: 24px;
  margin-bottom: 0;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  transition: box-shadow 0.15s ease, border-radius 0.15s ease;
}
.page_title .cls:empty, .rec-task-header .cls:empty {
  display: none;
}

.page_content {
  padding: 24px;
}

.page_title.is-stuck, .rec-task-header.is-stuck {
  border-bottom: var(--bs-border-width) solid var(--color-border-soft);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.sticky-sentinel {
  height: 0;
  margin: 0;
  padding: 0;
}

.p_title {
  flex: 0 1 auto;
  color: var(--Gray, #222A39);
  font-family: var(--font-body);
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  word-break: normal;
}

.toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: end;
  gap: 12px;
}

.toolbar.container {
  padding-bottom: 16px;
}

.field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 100%;
}

.label {
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
  color: #3D4451;
}

.page_filter_caption {
  margin-bottom: 4px;
}
.page_filter_caption label {
  display: flex;
  align-items: center;
  gap: 2px;
  max-width: 100%;
  color: var(--color-gray-400, #A5B3C9);
}
.page_filter_caption label > .page_filter_label_text {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.required-mark {
  color: var(--color-danger);
  margin-left: 2px;
}

.help-text {
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  line-height: 11px;
  color: var(--color-text-muted);
}

.error-text {
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 18px;
  color: var(--color-danger);
}

.input,
.textarea,
.select {
  width: 100%;
  min-height: 48px;
  padding: 10px 16px;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: var(--color-bg);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: var(--color-text);
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.input::placeholder,
.textarea::placeholder,
.select::placeholder {
  color: #A5B3C9;
  font-weight: 400;
}
.input:hover,
.textarea:hover,
.select:hover {
  border-color: var(--color-border-strong);
}
.input:focus,
.textarea:focus,
.select:focus {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(111, 97, 234, 0.2);
  outline: none;
}
.input:disabled, .input.is-disabled,
.textarea:disabled,
.textarea.is-disabled,
.select:disabled,
.select.is-disabled {
  background: var(--color-bg-soft);
  color: #758199;
  cursor: not-allowed;
}
.input.is-error,
.textarea.is-error,
.select.is-error {
  border-color: var(--color-danger);
}
.input.is-error:focus,
.textarea.is-error:focus,
.select.is-error:focus {
  box-shadow: 0 0 0 3px rgba(250, 62, 147, 0.2);
}

.textarea {
  min-height: 96px;
  resize: vertical;
  border-radius: 16px;
}

.select {
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 18px) 50%, calc(100% - 12px) 50%;
  background-size: 6px 6px;
  background-repeat: no-repeat;
  padding-right: 36px;
}

.input-sm, .select-sm {
  min-height: 36px;
  padding: 6px 12px;
  font-size: 12px;
  line-height: 18px;
  border-radius: 8px;
}

.input-lg, .select-lg {
  min-height: 56px;
  padding: 14px 16px;
  font-size: 16px;
  border-radius: 16px;
}

.input-group {
  position: relative;
  width: 100%;
}
.input-group .input {
  padding-right: 44px;
}
.input-group .input-addon {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--color-text-subtle);
  cursor: pointer;
}
.input-group.input-group-left .input {
  padding-right: 16px;
  padding-left: 44px;
}
.input-group.input-group-left .input-addon {
  right: auto;
  left: 12px;
}

.checkbox,
input[type=checkbox] {
  appearance: none;
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  border: 1.5px solid var(--color-border-strong);
  background: var(--color-bg);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  flex-shrink: 0;
  border-radius: 50%;
}
.checkbox:hover,
input[type=checkbox]:hover {
  border-color: var(--color-primary);
}
.checkbox:checked,
input[type=checkbox]:checked {
  background: var(--color-primary);
  border-color: var(--color-primary);
}
.checkbox:focus-visible,
input[type=checkbox]:focus-visible {
  box-shadow: 0 0 0 3px rgba(111, 97, 234, 0.2);
}

.radio {
  position: relative;
  display: block;
  padding-left: 20px;
}
.radio input {
  opacity: 0;
  position: absolute;
  z-index: 1;
  cursor: pointer;
  margin-left: -20px;
}
.radio label {
  display: inline-block;
  position: relative;
  padding-left: 5px;
  cursor: pointer;
}
.radio label::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 17px;
  height: 17px;
  margin-left: -20px;
  border: 1.5px solid var(--color-border-strong);
  border-radius: 50%;
  background: var(--color-bg);
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.radio input:checked + label::before {
  border-color: var(--color-primary);
}
.radio input:checked + label::after {
  content: "";
  position: absolute;
  left: 2px;
  top: 50%;
  transform: translateY(-50%);
  width: 13px;
  height: 13px;
  margin-left: -20px;
  border-radius: 50%;
  background: var(--color-primary);
}
.radio input:focus-visible + label::before {
  box-shadow: 0 0 0 3px rgba(111, 97, 234, 0.2);
}
.radio.disabled label,
.radio input:disabled + label {
  opacity: 0.54;
  cursor: default;
}

.radio:has(> input.checknid),
.list_header_x.radio {
  display: inline-block;
  width: 17px;
  height: 17px;
  padding-left: 0;
  vertical-align: middle;
}
.radio:has(> input.checknid) input,
.list_header_x.radio input {
  left: 0;
  width: 17px;
  height: 17px;
  margin-left: 0;
}
.radio:has(> input.checknid) label,
.list_header_x.radio label {
  display: block;
  width: 17px;
  height: 17px;
  padding-left: 0;
}
.radio:has(> input.checknid) label::before,
.list_header_x.radio label::before {
  left: 0;
  margin-left: 0;
}
.radio:has(> input.checknid) input:checked + label::after,
.list_header_x.radio input:checked + label::after {
  left: 2px;
  margin-left: 0;
}

.checkbox-label,
.radio-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 22px;
  color: var(--color-text);
}

.switch {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 22px;
  flex-shrink: 0;
}
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.switch .switch-track {
  position: absolute;
  inset: 0;
  background: var(--color-border);
  border-radius: 999px;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  cursor: pointer;
}
.switch .switch-track::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  background: #fff;
  border-radius: 50%;
  transition: transform 0.2s ease;
}
.switch input:checked + .switch-track {
  background: var(--color-primary);
}
.switch input:checked + .switch-track::before {
  transform: translateX(18px);
}

.filter-block .form-control,
.filter-block .form-select {
  min-height: 40px;
  font-size: 14px;
  line-height: 22px;
  border-radius: 12px;
}
.filter-block .form-control:not([multiple]) {
  height: 40px;
  padding: 8px 14px;
}
.filter-block .form-select {
  height: 40px;
  padding: 8px 40px 8px 14px;
  background-position: right 14px center;
}
.filter-block .form-control, .filter-block textarea.form-control {
  height: auto;
  padding: 8px 14px;
}
.filter-block select[multiple].form-control {
  height: auto;
  padding: 6px 14px;
}
.filter-block select.form-control:not([multiple]) {
  padding-right: 38px;
  background-position: right 14px center;
}

.filter_range {
  display: flex;
  gap: 8px;
}
.filter_range > * {
  flex: 1 1 0;
  min-width: 0;
}

.form-horizontal.form-single {
  max-width: 855px;
  margin-inline: auto;
}
.form-horizontal .form-actions {
  margin-top: 48px;
}
.form-horizontal .form-submit-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 260px;
  max-width: 100%;
  height: 48px;
  padding: 14px 48px;
  background: var(--color-primary);
  border: none;
  border-radius: 24px;
  color: #fff;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.form-horizontal .form-submit-btn:hover {
  background: var(--color-primary-hover, #6251E3);
}
.form-horizontal .row.flx {
  --bs-gutter-x: 0;
  margin-left: 0;
  margin-right: 0;
  gap: 15px;
  margin-bottom: 15px;
  align-items: flex-start;
}
.form-horizontal .row.flx > .form-group {
  flex: 1 1 0;
  min-width: 0;
  max-width: none;
  width: auto;
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 0;
}
.form-horizontal .row.flx > .form-group:has(textarea) {
  flex-basis: 100%;
}
@media (max-width: 575.98px) {
  .form-horizontal .row.flx:not(:has(input[type=color])) {
    flex-direction: column;
  }
  .form-horizontal .row.flx:not(:has(input[type=color])) > .form-group {
    flex: 0 0 auto;
    width: 100%;
  }
}
.form-horizontal .row.document-source {
  --bs-gutter-x: 0;
  margin-left: 0;
  margin-right: 0;
}
.form-horizontal .row.document-source > .col-sm-12 {
  padding-left: 0;
  padding-right: 0;
}
.form-horizontal .form-group {
  margin-bottom: 24px;
}
@media (max-width: 575.98px) {
  .form-horizontal .form-group {
    margin-top: 12px;
    margin-bottom: 12px;
  }
}
@media (max-width: 575.98px) {
  .form-horizontal .form-group:has(> table) {
    overflow-x: auto;
  }
}
.form-horizontal .radiodiv {
  width: 100%;
}
.form-horizontal .radiodiv .radiochild {
  flex: 1 1 0;
  min-width: 0;
}
.form-horizontal .radiodiv:has(.radiochild:nth-child(3)) .radiochild {
  padding-inline: 12px;
}
.form-horizontal .radiodiv:has(.radiochild:nth-child(3)) .radiochild .radiochild_lbl {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.form-horizontal .control-label {
  display: block;
  margin-bottom: 4px;
  padding: 0;
  color: #758199;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
  text-align: left;
  min-height: 18px;
}
.form-horizontal .label-must {
  display: inline-flex;
  align-items: center;
  height: 18px;
  vertical-align: top;
  margin-left: 2px;
}
.form-horizontal .form_must_fill {
  color: #EB267F;
  font-size: 7px;
}
.form-horizontal .form-control,
.form-horizontal .form-select {
  min-height: 40px;
  font-size: 14px;
  line-height: 22px;
  border-radius: 12px;
}
.form-horizontal .schedule {
  margin-top: 24px;
  margin-bottom: 24px;
}
.form-horizontal .noheight.schedule:empty {
  display: none;
}
.form-horizontal input.form-control,
.form-horizontal select.form-control:not([multiple]) {
  height: 40px;
  padding: 8px 14px;
}
.form-horizontal .form-select {
  height: 40px;
  padding: 8px 40px 8px 14px;
  background-position: right 14px center;
}
.form-horizontal textarea.form-control {
  height: auto;
  min-height: 96px;
  padding: 10px 14px;
  border-radius: 12px;
}
.form-horizontal select[multiple].form-control {
  height: auto;
  padding: 6px 14px;
}
.form-horizontal select.form-control:not([multiple]) {
  padding-right: 38px;
  background-position: right 14px center;
}

.autocomplete-suggestions {
  margin-top: 4px;
  padding: 4px;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  background: var(--color-bg);
  box-shadow: 0 18px 44px rgba(52, 66, 95, 0.1);
  overflow-y: auto;
}
.autocomplete-suggestions strong {
  font-weight: 500;
  color: #6251E3;
}

.autocomplete-suggestion,
.autocomplete-no-suggestion,
.autocomplete-group {
  padding: 8px 10px;
  border-radius: 8px;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 22px;
  color: #3D4451;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.autocomplete-no-suggestion {
  color: #758199;
}

.autocomplete-suggestion {
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.autocomplete-selected {
  background: var(--color-purple-100, #EAECFF);
  color: #6251E3;
}

.autocomplete-group {
  font-size: 12px;
  font-weight: 500;
  color: #758199;
}
.autocomplete-group strong {
  display: block;
  padding-bottom: 4px;
  border-bottom: 1px solid var(--color-border-soft);
}

.groups_parent {
  border-radius: 10px;
  padding: 10px;
  border: var(--bs-border-width) solid var(--color-border, #BCC9DF);
}
.groups_parent .select_all,
.groups_parent .deselect_all {
  font-size: 12px;
  font-weight: 500;
  color: #6251E3;
  text-decoration: none;
}
.groups_parent .select_all:hover,
.groups_parent .deselect_all:hover {
  text-decoration: underline;
}
.groups_parent .org_groups_l {
  display: flex;
  align-items: center;
}
.groups_parent > input[type=checkbox],
.groups_parent > input[type=checkbox] + label {
  vertical-align: middle;
}
.groups_parent .radio label,
.groups_parent .checkbox label {
  display: block;
  padding: 4px 8px 4px 8px;
  border-radius: 8px;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.groups_parent .radio label:hover,
.groups_parent .checkbox label:hover {
  background: #F8F9FC;
}
.groups_parent input:checked + label {
  color: #6251E3;
  font-weight: 500;
}

.groups_parent > .radio:has(input[type=checkbox]) {
  padding-left: 0;
}
.groups_parent > .radio:has(input[type=checkbox]) br {
  display: inline;
}
.groups_parent > .radio:has(input[type=checkbox]) input[type=checkbox] {
  position: static;
  opacity: 1;
  appearance: none;
  -webkit-appearance: none;
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  margin: 0 4px 0 0;
  border: 1.5px solid var(--color-border-strong);
  border-radius: 50%;
  background: var(--color-bg);
  vertical-align: middle;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.groups_parent > .radio:has(input[type=checkbox]) input[type=checkbox]:checked {
  border-color: var(--color-primary);
  background: var(--color-primary);
  box-shadow: inset 0 0 0 2.5px var(--color-bg);
}
.groups_parent > .radio:has(input[type=checkbox]) input[type=checkbox]:checked::after {
  content: none;
}
.groups_parent > .radio:has(input[type=checkbox]) input[type=checkbox]:focus-visible {
  box-shadow: 0 0 0 3px rgba(111, 97, 234, 0.2);
}
.groups_parent > .radio:has(input[type=checkbox]) input[type=checkbox]:has(+ label[style*="display: none"]), .groups_parent > .radio:has(input[type=checkbox]) input[type=checkbox]:has(+ label[style*="display:none"]) {
  display: none;
}
.groups_parent > .radio:has(input[type=checkbox]) label {
  display: inline-block;
  padding: 0;
  vertical-align: middle;
}
.groups_parent > .radio:has(input[type=checkbox]) label::before, .groups_parent > .radio:has(input[type=checkbox]) label::after {
  content: none;
}
.groups_parent > .radio:has(input[type=checkbox]) label:hover {
  background: transparent;
}

.x-bind {
  margin-bottom: 15px;
}

td .x-bind {
  margin-bottom: 0;
}

.items_spacer {
  margin: 16px 0 8px;
  color: var(--color-purple-800);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 600;
  line-height: 22px;
}
.items_spacer:first-child {
  margin-top: 0;
}

.x-bind-close {
  display: flex;
  height: 40px;
  width: 40px;
  background: #F7F7F7;
  border: 1px solid #e4e4e4;
  border-radius: 10px;
  cursor: pointer;
  font-size: 20px;
  color: #8a1a77;
  padding-top: 7.5px;
  padding-left: 12px;
}

.x-bind-add {
  display: flex;
  height: 40px;
  width: 40px;
  background: #F7F7F7;
  border: 1px solid #e4e4e4;
  border-radius: 10px;
  cursor: pointer;
  font-size: 15px;
  color: #7179be;
  padding-top: 7.5px !important;
  padding-left: 12px;
}

.x-bind-add:not(:disabled):hover {
  color: #521fb3;
}

.x-bind-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  width: 40px;
  background: #F7F7F7;
  border: 1px solid #e4e4e4;
  border-radius: 10px;
  color: rgb(211, 211, 211);
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.x-bind-check i {
  font-size: 22px;
  line-height: 1;
}
.x-bind-check:hover {
  opacity: 0.7;
}

.pw_field:has(> .x-bind-check) {
  display: flex;
  align-items: center;
  justify-content: center;
  left: 0 !important;
  padding-bottom: 0 !important;
}

.template_keys {
  margin-top: 20px;
}

.template_keys .add_key_val {
  margin: 0px 3px 0px 3px;
}

.tmpl_keys,
.tmpl_keys_a {
  margin-top: 20px;
}

.tmpl_key,
.tmpl_key_c {
  display: inline-flex;
  align-items: center;
  margin: 0 6px 8px 0;
  padding: 4px 8px;
  border: 1px solid #E4E5FF;
  border-radius: 8px;
  background: #EAECFF;
  font-size: 13px;
  font-weight: 500;
  line-height: normal;
  color: #6F61EA;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.tmpl_key:hover, .tmpl_key:focus-visible,
.tmpl_key_c:hover,
.tmpl_key_c:focus-visible {
  background: #E4E5FF;
  border-color: #E8E6FC;
  color: #6251E3;
  text-decoration: none;
}

select[multiple].form-control option,
select.multySelector option {
  margin-bottom: 2px;
  padding: 7px 10px;
  border-radius: 8px;
  font-size: 14px;
  line-height: 22px;
  color: #3D4451;
}
select[multiple].form-control option:last-child,
select.multySelector option:last-child {
  margin-bottom: 0;
}
select[multiple].form-control option:checked,
select.multySelector option:checked {
  background: #E4E5FF linear-gradient(0deg, #E4E5FF 0%, #E4E5FF 100%);
  color: #6251E3;
  -webkit-text-fill-color: #6251E3;
  font-weight: 500;
}

input[type=color].form-control {
  padding: 4px;
  cursor: pointer;
}

input[type=color]::-webkit-color-swatch-wrapper {
  padding: 0;
}

input[type=color]::-webkit-color-swatch {
  border: 1px solid #D3DEEF;
  border-radius: 8px;
}

input[type=color]::-moz-color-swatch {
  border: 1px solid #D3DEEF;
  border-radius: 8px;
}

.radiodiv {
  align-items: center;
  width: fit-content;
  max-width: 100%;
  gap: 0;
  margin: 0;
  padding: 3px;
  background: var(--color-bg-soft, #F0F3FD);
  border-radius: 26px;
}
.radiodiv .radiochild {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 34px;
  margin: 0;
  padding: 6px 24px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 26px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  color: #758199;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.radiodiv .radiochild:hover:not(.activeRadio) {
  color: #222A39;
}
.radiodiv .radiochild input[type=radio] {
  display: none;
}
.radiodiv .radiochild .checkmark {
  display: none;
}
.radiodiv .radiochild.activeRadio {
  background: var(--color-purple-200, #E4E5FF);
  border-color: var(--color-purple-400, #BBB4FD);
  color: var(--color-primary, #6F61EA);
}
.radiodiv .radiochild.activeRadio .checkmark {
  display: inline-flex;
  align-items: center;
  font-size: 16px;
  color: var(--color-primary, #6F61EA);
}
.radiodiv:not(:has(.activeRadio)) .radiochild:not(:last-child) {
  border-right-color: var(--color-border, #BCC9DF);
  border-radius: 0;
}
@media (max-width: 575.98px) {
  .radiodiv {
    width: 100%;
    margin-bottom: 8px;
  }
  .radiodiv .radiochild {
    flex: 1 1 0;
    min-width: 0;
    padding: 6px 12px;
    white-space: normal;
    width: 100%;
  }
  .radiodiv .radiochild_lbl {
    font-size: 12px;
  }
  .radiodiv:has(.radiochild:nth-child(3)) {
    flex-direction: column;
    align-items: stretch;
  }
  .radiodiv:has(.radiochild:nth-child(3)) .radiochild {
    width: 100%;
    flex: 0 0 auto;
  }
  .radiodiv:has(.radiochild:nth-child(3)):not(:has(.activeRadio)) .radiochild:not(:last-child) {
    border-right-color: transparent;
    border-bottom-color: var(--color-border, #BCC9DF);
  }
}

select.form-control:not([multiple]) {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-left: 14px;
  padding-right: 40px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23758199' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 16px center;
  background-size: 16px 12px;
}
select.form-control:not([multiple]):focus {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%236251E3' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 11 6-6 6 6'/%3e%3c/svg%3e");
}

.input-with-action {
  display: flex;
  align-items: stretch;
  gap: 8px;
}
.input-with-action .form-control {
  flex: 1 1 auto;
}
.input-with-action .btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  white-space: nowrap;
}

.WorkersBlock [id$=_container], .TagsBlock [id$=_container] {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.WorkersBlock [id$=_container]:not(:empty), .TagsBlock [id$=_container]:not(:empty) {
  margin-bottom: 8px;
}
.WorkersBlock .ContractItem, .WorkersBlock .TagItem, .TagsBlock .ContractItem, .TagsBlock .TagItem {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px 6px 14px;
  background: var(--color-bg-soft, #F0F3FD);
  border-radius: 8px;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 22px;
  color: var(--color-text);
  width: 100%;
  margin-bottom: 5px;
}
.WorkersBlock .Contracttool, .TagsBlock .Contracttool {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  color: #A5B3C9;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.WorkersBlock .Contracttool a, .TagsBlock .Contracttool a {
  text-decoration: none;
  color: inherit;
  line-height: 0;
}
.WorkersBlock .Contracttool:hover, .TagsBlock .Contracttool:hover {
  background: var(--color-danger-soft, rgba(250, 62, 147, 0.12));
  color: var(--color-danger);
}
.WorkersBlock .ContractItemRow, .TagsBlock .ContractItemRow {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 5px;
}
.WorkersBlock .ContractItemRow .ContractItem, .TagsBlock .ContractItemRow .ContractItem {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  margin-bottom: 0;
}
.WorkersBlock .ContractItemRow .worker_item_order, .TagsBlock .ContractItemRow .worker_item_order {
  flex: 0 0 auto;
  width: 48px;
  height: 34px;
  padding: 4px 8px;
  text-align: center;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  font-family: var(--font-body);
  font-size: 14px;
  color: var(--color-text);
}

.input-with-icon {
  position: relative;
}
.input-with-icon input.form-control {
  padding-right: 42px;
}
.input-with-icon .input-icon-btn {
  position: absolute;
  top: 50%;
  right: 7px;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: var(--color-bg-soft, #F0F3FD);
  color: var(--color-primary);
  font-size: 15px;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.input-with-icon .input-icon-btn:hover {
  background: var(--color-purple-100, #EAECFF);
  color: var(--color-primary);
}

.photo-upload {
  display: flex;
  align-items: center;
  gap: 24px;
}
.photo-upload .photo-dropzone {
  display: flex;
  align-items: center;
  gap: 24px;
  text-decoration: none;
  cursor: pointer;
}
.photo-upload .photo-dropzone-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 66px;
  height: 66px;
  background: #F0F3FD;
  border: 1.4px dashed var(--color-primary);
  border-radius: 50%;
  overflow: hidden;
  color: var(--color-primary);
  font-size: 26px;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.photo-upload .photo-dropzone-icon > i {
  position: relative;
  z-index: 2;
  transition: opacity 0.15s ease;
}
.photo-upload .photo-dropzone:hover .photo-dropzone-icon {
  background: var(--color-purple-100, #EAECFF);
  border-color: var(--color-primary);
}
.photo-upload .photo-dropzone-text {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.photo-upload .photo-dropzone-title {
  color: var(--color-primary);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 500;
  line-height: normal;
}
.photo-upload .photo-dropzone-hint {
  color: #A5B3C9;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
}
.photo-upload .photo-preview {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.photo-upload .photo-preview img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.photo-upload .photo-preview img.is-clearing {
  opacity: 0;
  transform: scale(0.6);
}
.photo-upload .photo-preview .rightDiagLine, .photo-upload .photo-preview .leftDiagLine {
  display: none;
}
.photo-upload:has(.photo-preview img:not([style*=none])) .photo-dropzone-icon {
  background: transparent;
  border-color: transparent;
}
.photo-upload:has(.photo-preview img:not([style*=none])) .photo-dropzone-icon > i {
  opacity: 0;
}
.photo-upload:has(.photo-preview img:not([style*=none])) .photo-dropzone:hover .photo-dropzone-icon > i {
  opacity: 1;
  color: #fff;
}
.photo-upload:has(.photo-preview img:not([style*=none])) .photo-dropzone:hover .photo-dropzone-icon::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: rgba(34, 42, 57, 0.45);
}
.photo-upload .photo-clear {
  display: none;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  background: transparent;
  border: none;
  color: #A5B3C9;
  cursor: pointer;
}
.photo-upload .photo-clear:hover {
  color: var(--color-danger);
}
.photo-upload:has(.photo-preview img:not([style*=none])) .photo-clear {
  display: inline-flex;
}

.bp_group_attribute {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 8px 0;
}

.group-element-rows {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.group-element-row {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  padding: 12px;
  border: 1px solid var(--color-border-soft, #D3DEEF);
  border-radius: 12px;
  background: var(--color-bg, #FFFFFF);
}
.group-element-row.hidden {
  display: none;
}

.group-element-fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  width: 100%;
}
.group-element-fields .form-group {
  margin-bottom: 0;
}

.group-element-field {
  min-width: 0;
}
.group-element-field .form-control {
  min-height: 40px;
  height: auto;
}
.group-element-field .chosen-container {
  width: 100% !important;
  max-width: 100%;
  min-width: 0;
}

.group-element-fields .group-element-field-full {
  grid-column: 1/-1;
}

.bp_group_attribute .drop {
  margin: 0;
  min-height: 50px;
  padding: 4px !important;
  font-size: 10px;
}
.bp_group_attribute .uploadfilesblock .file-name {
  white-space: normal !important;
  word-break: break-word;
}

.group-element-delete-btn {
  flex: none;
  aspect-ratio: 1/1;
}

.group-element-add-btn.x-bind-add {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: 8px 0 0 auto;
  padding: 0 !important;
  border: 1px solid transparent;
  border-radius: 10px;
  background: var(--color-primary-softer, #EAECFF);
  color: var(--color-primary, #6F61EA);
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.group-element-add-btn.x-bind-add span {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  font-size: 20px;
  line-height: 1;
}
.group-element-add-btn.x-bind-add:not(:disabled):hover {
  background: var(--color-primary-soft, #E4E5FF);
  color: var(--color-primary, #6F61EA);
}

.pw_field {
  position: relative;
}
.pw_field .form-control {
  padding-right: 40px;
}
.pw_field .pw_field_toggle {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  font-size: 16px;
  line-height: 1;
  color: #758199;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.pw_field .pw_field_toggle:hover {
  color: #6251E3;
}

.pw_field:has(> .label-must) {
  display: flex;
  align-items: center;
}
.pw_field:has(> .label-must) > .form-control,
.pw_field:has(> .label-must) > .bfh-datepicker {
  flex: 1 1 auto;
  min-width: 0;
}
.pw_field:has(> .label-must) .label-must {
  position: absolute;
  z-index: 1000;
  top: -16px;
  right: -2px;
}

.pw_field_wrap [id^=tst_] {
  display: none;
  margin-top: 8px;
  padding: 12px 16px;
  background: #F3F5FF;
  border: 1px solid #EAECFF;
  border-radius: 12px;
}
.pw_field_wrap [id^=tst_] .col-sm-12 {
  position: relative;
  margin: 0 0 4px;
  padding-left: 16px;
  font-size: 13px;
  line-height: 1.5;
}
.pw_field_wrap [id^=tst_] .col-sm-12::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 8px;
  width: 6px;
  height: 6px;
  border-radius: 9999px;
  background: currentColor;
  opacity: 0.6;
}
.pw_field_wrap [id^=tst_] .col-sm-12:last-child {
  margin-bottom: 0;
}

div.form-control:has(> strong) {
  background: var(--color-bg-soft, #F0F3FD);
}
div.form-control:has(> strong) > strong {
  font-weight: 400;
}

.row-remove-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50px;
  color: #758199;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.row-remove-btn:hover {
  background: var(--color-danger-soft, #FFE4F0);
  color: var(--color-danger, #FA3E93);
}

.displ {
  margin-bottom: 16px;
}
.displ.container {
  float: left;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}
.displ .form-control.noheight {
  height: auto;
  min-height: 0;
  padding: 16px;
  background: #FFFFFF;
  border: 1px solid #D3DEEF;
  border-radius: 12px;
  box-shadow: none;
  font-size: 14px;
  line-height: 22px;
  color: #222A39;
}
.displ .form-control.noheight:focus {
  border-color: #D3DEEF;
  box-shadow: none;
}
.displ .text-danger {
  color: #FA3E93;
}

.vacancy-preview .displ {
  float: none;
  width: 100%;
  max-width: none;
  margin-top: 20px;
}

#T_Reference_Table label[id$=-lbl],
#T_Depenent_Table label[id$=-lbl] {
  display: inline-block;
  margin-bottom: 4px;
}

#T_Depenent_Table td {
  text-align: center;
  vertical-align: middle;
}
#T_Depenent_Table td > div {
  width: 100%;
}
#T_Depenent_Table .pw_field {
  display: flex;
  justify-content: center;
  margin-top: 44px;
}
#T_Depenent_Table .bfh-datepicker,
#T_Depenent_Table input.form-control {
  margin-left: auto;
  margin-right: auto;
}

#T_Reference_Table .form-control.noheight {
  border: none;
}
#T_Reference_Table .x-bind {
  margin-bottom: 0;
}

.benefit-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.benefit-table-scroll > table {
  min-width: 480px;
  margin-bottom: 0;
}

.rollback-top {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 16px;
}
.rollback-top > .rollback-cell {
  flex: 1 1 300px;
  min-width: 0;
}
.rollback-top .form-control.form_field,
.rollback-top textarea.form-control {
  height: 44px;
  min-height: 44px;
}
.rollback-top textarea.form-control {
  resize: vertical;
}

.rollback-compare {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
  gap: 12px;
}
.rollback-compare .displ {
  flex: 1 1 320px;
  float: none;
  max-width: none;
  margin: 0;
}
.rollback-compare .displ .form-control.noheight {
  height: 100%;
}
.rollback-compare .col-xs-2 {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}
.rollback-compare .bi-chevron-double-right {
  color: var(--color-primary) !important;
  font-size: 24px !important;
}
@media (max-width: 767.98px) {
  .rollback-compare .col-xs-2 .bi-chevron-double-right {
    transform: rotate(90deg);
  }
}

.form-horizontal.displ-confirm {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  gap: 16px;
  max-width: 1040px;
  margin-inline: auto;
}
.form-horizontal.displ-confirm .displ {
  flex: 1 1 320px;
  max-width: 100%;
  margin-bottom: 0;
}

.i_flex {
  display: flex;
  align-items: baseline;
  gap: 4px;
  padding: 8px 0;
  border-bottom: 1px solid #F0F3FD;
  overflow-x: auto;
}
.i_flex:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.i_flex strong {
  flex: 0 0 auto;
  font-weight: 500;
  color: #596476;
}
.i_flex > span {
  color: #222A39;
}

.data_label {
  margin-bottom: 4px;
  padding-bottom: 12px;
  border-bottom: 1px solid #D3DEEF;
  font-size: 16px;
  font-weight: 600;
  color: #141D2D;
}
.data_label > span {
  font-size: 16px;
  font-weight: 600;
}
.data_label.text-success, .data_label.text-success > span {
  color: #0C9B99;
}
.data_label.text-danger, .data_label.text-danger > span {
  color: #FA3E93;
}

.data_origin {
  margin: 0 -8px;
  padding-left: 8px;
  padding-right: 8px;
  background: #F0F3FD;
  border-radius: 8px;
}

.data_changed {
  margin: 0 -8px;
  padding-left: 8px;
  padding-right: 8px;
  border: 1px dashed #FA3E93;
  border-radius: 8px;
}

.form_field strong {
  font-weight: normal;
}

/* Widen the PARAMETER column (first data column) — table-layout is fixed,
   so the column width is driven by the header cell width. */
.reg-step2 .multiparam-table th:nth-child(2),
.reg-step2 .multiparam-table tbody td:nth-child(2) {
  width: 250px;
}

/* Restore full cell borders that the soft-underline default drops. */
.reg-step2 .multiparam-table {
  border-bottom: 1px solid #D3DEEF;
}

.reg-step2 .multiparam-table thead th,
.reg-step2 .multiparam-table tbody td {
  border: 1px solid #D3DEEF;
}

.multiparam-table thead tr th:nth-child(1) {
  border-top-left-radius: 10px;
}

.multiparam-table thead tr th:last-child {
  border-top-right-radius: 10px;
}

.multiparam-table thead tr th {
  font-weight: unset;
  min-width: 50px;
  padding: 5px 5px 2px;
  white-space: normal;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.bi-eye-slash::before {
  content: "";
}
.bi-eye-slash {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
  background-color: currentColor;
  -webkit-mask: url("/design/images/newDesign/eye-closed.svg") no-repeat center/contain;
  mask: url("/design/images/newDesign/eye-closed.svg") no-repeat center/contain;
}

.form-horizontal.form-single.has-wizard {
  max-width: 1200px;
}
.form-horizontal.form-single.has-wizard.wizard-transitions {
  transition: all 0.2s ease;
}
.form-horizontal.form-single.has-wizard.wizard-transitions .form-wizard__content {
  transition: all 0.2s ease;
}
.form-horizontal.form-single.has-wizard.wizard-wide {
  max-width: 1600px;
}
.form-horizontal.form-single.has-wizard.wizard-wide .form-wizard__content {
  max-width: 1255px;
}

form:has(.wizard-step ~ .wizard-step):not(.has-wizard):not(.wizard-failed) {
  position: relative;
  min-height: 160px;
  visibility: hidden;
}
form:has(.wizard-step ~ .wizard-step):not(.has-wizard):not(.wizard-failed) .wizard-step ~ .wizard-step {
  display: none;
}
form:has(.wizard-step ~ .wizard-step):not(.has-wizard):not(.wizard-failed)::after {
  content: "";
  visibility: visible;
  position: absolute;
  inset: 0;
  margin: auto;
  width: 36px;
  height: 36px;
  border: 3px solid #D3DEEF;
  border-top-color: #6F61EA;
  border-radius: 50%;
  animation: wizardSpin 0.7s linear infinite;
}

@keyframes wizardSpin {
  to {
    transform: rotate(360deg);
  }
}
.form-wizard {
  display: flex;
  align-items: stretch;
  gap: 32px;
  padding-bottom: 8px;
}
.form-wizard__content {
  order: 1;
  flex: 1 1 auto;
  min-width: 0;
  max-width: 855px;
  overflow-x: scroll;
}
.form-wizard__content:has(.chosen-with-drop) {
  overflow: visible;
}
.form-wizard__rail {
  order: 2;
  flex: 0 0 328px;
  max-width: 328px;
  display: flex;
  flex-direction: column;
  padding: 48px 40px;
  background: #F4F7FF;
  border-radius: 32px;
}
.form-wizard__step {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding-bottom: 40px;
  background: none;
  border: 0;
  text-align: left;
  cursor: pointer;
}
.form-wizard__step::after {
  content: "";
  position: absolute;
  left: 14px;
  top: 28px;
  bottom: 0;
  border-left: 1px dashed #D3DEEF;
}
.form-wizard__step:last-child {
  padding-bottom: 0;
}
.form-wizard__step:last-child::after {
  display: none;
}
.form-wizard__num {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #D3DEEF;
  border-radius: 24px;
  background: #e4ebf6;
  font-size: 14px;
  line-height: 22px;
  color: #758199;
  z-index: 1;
}
.form-wizard__label {
  padding-top: 3px;
  font-size: 14px;
  line-height: 22px;
  color: #758199;
}
.form-wizard__step.is-done .form-wizard__num {
  border-color: #A5B3C9;
  color: #3D4451;
}
.form-wizard__step.is-active .form-wizard__num {
  border: 1.4px solid #6251E3;
  color: white;
  background-color: #6F61EA;
}
.form-wizard__step.is-active .form-wizard__label {
  color: #6251E3;
}
.form-wizard__content > .wizard-outer {
  margin-bottom: 30px;
  border: 1px solid var(--color-gray-200);
  border-radius: 24px;
  padding: 32px;
}
.form-wizard__content > .wizard-outer > .form-group:last-child {
  margin-bottom: 0;
}
.form-wizard__nav {
  display: flex;
  justify-content: flex-start;
  gap: 16px;
  margin-top: 32px;
}
.form-wizard__back, .form-wizard__next, .form-wizard__save {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 200px;
  height: 48px;
  padding: 14px 48px;
  border: 0;
  border-radius: 24px;
  font-size: 14px;
  line-height: 22px;
  white-space: nowrap;
  cursor: pointer;
}
.form-wizard__back:disabled, .form-wizard__next:disabled, .form-wizard__save:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.form-wizard__back[hidden], .form-wizard__next[hidden], .form-wizard__save[hidden] {
  display: none;
}
.form-wizard__next, .form-wizard__save {
  background: #6F61EA;
  color: #FFFFFF;
}
.form-wizard__save {
  width: auto;
  min-width: 200px;
}
.form-wizard__back, .form-wizard__save--ghost {
  background: #EAECFF;
  color: #6F61EA;
}
.form-wizard__arrow {
  display: none;
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  z-index: 600;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  background: #6F61EA;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
  -webkit-tap-highlight-color: transparent;
  outline: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.form-wizard__arrow:disabled {
  opacity: 0;
  pointer-events: none;
}
.form-wizard__arrow:active:not(:disabled) {
  transform: translateY(-50%) scale(0.86);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
.form-wizard__arrow::before {
  content: "";
  display: block;
  margin: auto;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}
.form-wizard__arrow--prev {
  left: 6px;
}
.form-wizard__arrow--prev::before {
  transform: rotate(-135deg) translate(-2px, 2px);
}
.form-wizard__arrow--next {
  right: 6px;
}
.form-wizard__arrow--next::before {
  transform: rotate(45deg) translate(-2px, 2px);
}
.form-wizard__mob-toggle {
  display: none;
  position: fixed;
  right: 0;
  top: 180px;
  z-index: 620;
  width: 32px;
  height: 56px;
  border: 0;
  border-radius: 8px 0 0 8px;
  background: #6F61EA;
  color: #fff;
  font-size: 12px;
  line-height: 1.2;
  cursor: pointer;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  box-shadow: -2px 2px 6px rgba(0, 0, 0, 0.18);
}
.form-wizard__mob-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 1200;
  background: rgba(0, 0, 0, 0.4);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}
.form-wizard__mob-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
}
.form-wizard__mob-drawer {
  display: none;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 9999999;
  width: min(300px, 82vw);
  background: #F4F7FF;
  padding: 56px 28px 32px;
  transform: translateX(100%);
  pointer-events: none;
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  overflow-y: auto;
}
.form-wizard__mob-drawer.is-open {
  transform: translateX(0);
  pointer-events: auto;
}
.form-wizard__mob-drawer-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  background: #D3DEEF;
  cursor: pointer;
  font-size: 18px;
  line-height: 1;
}
.form-wizard__mob-drawer-close::before {
  content: "×";
}
.form-wizard__rail--drawer {
  flex: none;
  max-width: none;
  padding: 0;
  background: none;
  border-radius: 0;
}

.wizard-step[hidden] {
  display: none;
}

.wizard-step {
  opacity: 1;
}

.wizard-step.is-step-in-forward {
  animation: wizardStepForward 0.28s ease;
}

.wizard-step.is-step-in-backward {
  animation: wizardStepBackward 0.28s ease;
}

@keyframes wizardStepForward {
  from {
    opacity: 0;
    transform: translateX(20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes wizardStepBackward {
  from {
    opacity: 0;
    transform: translateX(-20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  .form-horizontal.form-single.has-wizard.wizard-transitions,
  .form-horizontal.form-single.has-wizard.wizard-transitions .form-wizard__content {
    transition: none;
  }
}
@media (max-width: 992px) {
  .form-horizontal.form-single.has-wizard,
  .form-horizontal.form-single.has-wizard.wizard-wide {
    max-width: 855px;
  }
  .form-horizontal.form-single.has-wizard.wizard-wide .form-wizard__content {
    max-width: none;
  }
  .form-wizard {
    flex-direction: column;
    gap: 0;
  }
  .form-wizard__rail:not(.form-wizard__rail--drawer) {
    display: none;
  }
  .form-wizard__content {
    order: 1;
    max-width: none;
    width: 100%;
    overflow-x: scroll;
  }
  .form-wizard__nav {
    display: none;
  }
  .form-wizard__nav:has(.form-wizard__save:not([hidden])) {
    display: flex;
  }
  .form-wizard__nav:has(.form-wizard__save:not([hidden])) .form-wizard__back,
  .form-wizard__nav:has(.form-wizard__save:not([hidden])) .form-wizard__next {
    display: none;
  }
  .form-wizard__arrow {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .form-wizard__mob-toggle {
    display: block;
  }
  .form-wizard__mob-overlay {
    display: block;
  }
  .form-wizard__mob-drawer {
    display: block;
  }
}
.form-horizontal.form-single:has(.form-wizard--submit) {
  max-width: 1200px;
}

.form-wizard--submit .form-wizard__step.is-pending {
  cursor: default;
  opacity: 0.55;
}
.form-wizard--submit .form-wizard__step.is-pending .form-wizard__num,
.form-wizard--submit .form-wizard__step.is-pending .form-wizard__label {
  color: #A5B3C9;
}

.form-wizard__rail--drawer .form-wizard__step.is-pending {
  cursor: default;
  opacity: 0.55;
}
.form-wizard__rail--drawer .form-wizard__step.is-pending .form-wizard__num,
.form-wizard__rail--drawer .form-wizard__step.is-pending .form-wizard__label {
  color: #A5B3C9;
}

.multiparam-table {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  font-family: var(--font-body);
}
.multiparam-table thead th {
  padding: 8px 12px;
  text-align: left;
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
  color: #596476;
  white-space: nowrap;
  border-bottom: 1px solid var(--color-border-soft, #D3DEEF);
}
.multiparam-table th:first-child,
.multiparam-table .row-counter {
  width: 48px;
}
.multiparam-table th:last-child,
.multiparam-table tbody td:last-child {
  width: 56px;
}
.multiparam-table .multiparam-header-checkbox-cell {
  cursor: pointer;
  text-align: center;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.multiparam-table .multiparam-header-checkbox-cell:hover {
  color: var(--color-primary, #6F61EA);
}
.multiparam-table tbody td {
  padding: 8px 12px;
  vertical-align: middle;
  border-bottom: 1px solid var(--color-border-soft, #D3DEEF);
}
.multiparam-table tbody tr:last-child td {
  border-bottom: none;
}
.multiparam-table .row-counter {
  width: 48px;
  color: #758199;
  font-size: 12px;
}
.multiparam-table .form-control,
.multiparam-table .chosen-container {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.multiparam-table tbody td {
  overflow-wrap: anywhere;
}
.multiparam-table .multiparam-member-row td {
  color: #596476;
}

.vac-remove-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 8px;
  background: var(--color-danger-soft, #FFE4F0);
  color: var(--color-danger, #FA3E93);
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.vac-remove-btn:not(:disabled):not([aria-disabled=true]):hover {
  background: var(--color-danger, #FA3E93);
  color: var(--color-text-inverse, #FFFFFF);
}
.vac-remove-btn:disabled, .vac-remove-btn[aria-disabled=true] {
  opacity: 0.5;
  cursor: not-allowed;
}

.multiparam_add_btn.x-bind-add,
.multiparam_add_btn,
.x-bind-add[data-rec-articles-instance],
.Graphcontainercontrol .x-bind-add {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: auto;
  height: 40px;
  margin-top: 12px;
  padding: 0 16px !important;
  border: 1px solid transparent;
  border-radius: 24px;
  background: var(--color-primary-softer, #EAECFF);
  color: var(--color-primary, #6F61EA);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.multiparam_add_btn.x-bind-add::before,
.multiparam_add_btn::before,
.x-bind-add[data-rec-articles-instance]::before,
.Graphcontainercontrol .x-bind-add::before {
  content: "+";
  font-size: 16px;
  line-height: 1;
}
.multiparam_add_btn.x-bind-add:not(:disabled):hover,
.multiparam_add_btn:not(:disabled):hover,
.x-bind-add[data-rec-articles-instance]:not(:disabled):hover,
.Graphcontainercontrol .x-bind-add:not(:disabled):hover {
  background: var(--color-primary-soft, #E4E5FF);
  color: var(--color-primary, #6F61EA);
}
.multiparam_add_btn.x-bind-add:disabled,
.multiparam_add_btn:disabled,
.x-bind-add[data-rec-articles-instance]:disabled,
.Graphcontainercontrol .x-bind-add:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.uploadfilesblock {
  display: block;
  width: 100%;
}
.uploadfilesblock .container-fluid {
  padding: 0;
}
.uploadfilesblock .uploadFilesButtons {
  padding: 0;
}
.uploadfilesblock .i_btn_file {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  height: auto;
  min-height: 44px;
  padding: 12px 16px;
  border: 2px dashed #BCC9DF;
  border-radius: 12px;
  background: #F8F9FC;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  color: #596476;
  text-align: center;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.uploadfilesblock .i_btn_file .btn-ico {
  font-size: 18px;
  line-height: 1;
}
.uploadfilesblock .i_btn_file:hover, .uploadfilesblock .i_btn_file:focus {
  border-color: #6251E3;
  background: #F3F5FF;
  color: #6251E3;
}
.uploadfilesblock .uploadFilescontainer {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 8px;
}
.uploadfilesblock .uploadFilescontainer:empty {
  margin-top: 0;
}
.uploadfilesblock .uploadFileItem {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 12px;
  border: 1px solid #D3DEEF;
  border-radius: 12px;
  background: #FFFFFF;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.uploadfilesblock .uploadFileItem:hover {
  border-color: #BCC9DF;
  background: #F8F9FC;
}
.uploadfilesblock .uploadFileItem > .cls {
  display: none;
}
.uploadfilesblock .uploadFileItem_name {
  flex: 1 1 auto;
  min-width: 0;
}
.uploadfilesblock .uploadFileItem_name .upload_title {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 22px;
  color: #222A39;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.uploadfilesblock .uploadFileItem_name .upload_title:hover {
  color: #6251E3;
  text-decoration: underline;
}
.uploadfilesblock .uploadFiletools {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 0 0 auto;
}
.uploadfilesblock .uploadFiletool {
  display: inline-flex;
}
.uploadfilesblock .uploadFiletool a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  color: #758199;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.uploadfilesblock .uploadFiletool a i {
  font-size: 16px;
  line-height: 1;
}
.uploadfilesblock .uploadFiletool_search a:hover {
  background: #EAECFF;
  color: #6251E3;
}
.uploadfilesblock .uploadFiletool_delete a:hover {
  background: #FFE4F0;
  color: #EB267F;
}

.contentCenter.error {
  text-align: center;
  padding: 12px 16px;
  margin-bottom: 12px;
  background: #F3F5FF;
  border: 1px solid #EAECFF;
  border-radius: 12px;
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 18px;
  color: #3D4451;
}

.upload {
  width: 100%;
  margin: 0;
  padding: 16px;
  background: #F8F9FC;
  border: 1px solid #D3DEEF;
  border-radius: 16px;
  box-shadow: none;
}
.upload #upload_link {
  display: block;
  cursor: pointer;
  text-decoration: none;
}
.upload .drop {
  display: block;
  padding: 32px 24px;
  margin-bottom: 0;
  border: 2px dashed #BCC9DF;
  border-radius: 12px;
  background: #FFFFFF;
  text-align: center;
  text-transform: none;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  color: #596476;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.upload .drop .file-icon {
  margin-bottom: 12px;
}
.upload .drop .file-icon i {
  font-size: 36px !important;
  line-height: 1;
  color: #A5B3C9;
}
.upload .drop input {
  display: none;
}
.upload .drop:hover {
  border-color: #6251E3;
  background: #F3F5FF;
  color: #6251E3;
}
.upload .drop:hover .file-icon i {
  color: #6251E3;
}
.upload .drop.disabled {
  opacity: 0.5;
  filter: grayscale(60%);
  pointer-events: none;
  cursor: not-allowed;
}
.upload ul {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
}
.upload ul li {
  position: relative;
  min-height: 64px;
  padding: 12px 16px;
  margin-bottom: 8px;
  background: #FFFFFF;
  background-image: none;
  border: 1px solid #D3DEEF;
  border-radius: 12px;
}
.upload ul li:nth-child(even) {
  background: #F8F9FC;
}
.upload ul li.error p {
  color: #EB267F;
}
.upload ul li.working .upload_completed {
  display: none;
}
.upload ul li.converting .upload_completed {
  display: none;
}
.upload ul li .convert_state {
  font-style: normal;
  color: #758199;
}
.upload ul li .up-progress {
  position: absolute;
  top: 50%;
  left: 16px;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background: conic-gradient(#6251E3 calc(var(--p, 0) * 1%), #D3DEEF 0);
}
.upload ul li .up-progress::before {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 9999px;
  background: #FFFFFF;
}
.upload ul li .up-progress b {
  position: relative;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  color: #6251E3;
}
.upload ul li p {
  position: absolute;
  top: 50%;
  left: 76px;
  transform: translateY(-50%);
  margin: 0;
  max-width: calc(100% - 130px);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  color: #222A39;
}
.upload ul li p i {
  display: block;
  font-style: normal;
  font-size: 11px;
  font-weight: 400;
  color: #758199;
}
.upload ul li .upload_completed,
.upload ul li #remove_file_item,
.upload ul li .remove_file_item {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  line-height: 1;
  background: none;
}
.upload ul li .upload_completed {
  right: 44px;
  color: #0C9B99;
}
.upload ul li .upload_completed::before {
  content: "✓";
}
.upload ul li #remove_file_item,
.upload ul li .remove_file_item {
  right: 12px;
  color: #758199;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.upload ul li #remove_file_item::before,
.upload ul li .remove_file_item::before {
  content: "✕";
}
.upload ul li #remove_file_item:hover,
.upload ul li .remove_file_item:hover {
  background: #FFE4F0;
  color: #EB267F;
}

.filesupload-modal {
  display: flex;
  align-items: flex-start;
  gap: 48px;
}
@media (max-width: 980px) {
  .filesupload-modal {
    flex-wrap: wrap;
    gap: 16px;
  }
}

.filesupload-files {
  flex: 1 1 0;
  min-width: 0;
}

.filesupload-attach {
  flex: 0 0 400px;
}
@media (max-width: 980px) {
  .filesupload-attach {
    flex-basis: 100%;
    order: -1;
  }
}

.upload.upload--attach {
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}
.upload.upload--attach .drop {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 32px;
  min-height: 460px;
  padding: 60px;
  margin-bottom: 0;
  border: 1.4px dashed #6F61EA;
  border-radius: 32px;
  background: #F4F7FF;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.upload.upload--attach .drop:hover {
  border-color: #6251E3;
  background: #F3F5FF;
}
.upload.upload--attach .drop__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-align: center;
}
.upload.upload--attach .drop__icon i {
  font-size: 60px;
  line-height: 1;
  color: #6F61EA;
  transition: transform 0.15s ease, color 0.15s ease;
}
.upload.upload--attach .drop__spinner {
  display: none;
  width: 60px;
  height: 60px;
  border-radius: 9999px;
  border: 4px solid #E4E5FF;
  border-top-color: #6F61EA;
  animation: filesupload-spin 0.8s linear infinite;
}
.upload.upload--attach .drop__title {
  font-family: var(--font-body);
  font-size: 18px;
  line-height: 24px;
}
.upload.upload--attach .drop__title-default {
  color: #6F61EA;
}
.upload.upload--attach .drop__title-drag {
  display: none;
  color: #6251E3;
}
.upload.upload--attach .drop__title-loading {
  display: none;
  color: #3D4451;
}
.upload.upload--attach .drop__hint {
  max-width: 274px;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 22px;
  color: #596476;
}
.upload.upload--attach .drop__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  height: 48px;
  padding: 0 48px;
  border-radius: 24px;
  background: #6F61EA;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 22px;
  color: #FFFFFF;
}
.upload.upload--attach .drop__btn i {
  font-size: 18px;
  line-height: 1;
}
.upload.upload--attach .drop__btn-loading {
  display: none;
}
.upload.upload--attach .drop:hover .drop__btn {
  background: #6251E3;
}
.upload.upload--attach.is-dragover .drop {
  border-style: solid;
  border-color: #6F61EA;
  background: #EAECFF;
  box-shadow: 0 0 0 4px #F3F5FF;
}
.upload.upload--attach.is-dragover .drop__icon i {
  transform: scale(1.08);
  color: #6251E3;
}
.upload.upload--attach.is-dragover .drop__title-default {
  display: none;
}
.upload.upload--attach.is-dragover .drop__title-drag {
  display: block;
}
.upload.upload--attach.is-uploading .drop__icon {
  display: none;
}
.upload.upload--attach.is-uploading .drop__spinner {
  display: block;
}
.upload.upload--attach.is-uploading .drop__title-default {
  display: none;
}
.upload.upload--attach.is-uploading .drop__title-loading {
  display: block;
}
.upload.upload--attach.is-uploading .drop:hover {
  border-color: #6F61EA;
  background: #F4F7FF;
}
.upload.upload--attach.is-uploading .drop__btn {
  background: #F8F9FC;
  color: #BCC9DF;
  pointer-events: none;
}
.upload.upload--attach.is-uploading .drop__btn i {
  color: #BCC9DF;
}
.upload.upload--attach.is-uploading .drop:hover .drop__btn {
  background: #F8F9FC;
}
.upload.upload--attach.is-uploading .drop__btn-default {
  display: none;
}
.upload.upload--attach.is-uploading .drop__btn-loading {
  display: inline;
}
.upload.upload--attach ul {
  margin-top: 12px;
}

@keyframes filesupload-spin {
  to {
    transform: rotate(360deg);
  }
}
.filesupload-crop {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.filesupload-crop__loader {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 460px;
  padding: 60px;
  border: 1.4px dashed #6F61EA;
  border-radius: 32px;
  background: #F4F7FF;
}
.filesupload-crop__spinner {
  width: 60px;
  height: 60px;
  border-radius: 9999px;
  border: 4px solid #E4E5FF;
  border-top-color: #6F61EA;
  animation: filesupload-spin 0.8s linear infinite;
}
.filesupload-crop__body {
  display: flex;
  justify-content: center;
  width: 100%;
}
.filesupload-crop__body .croppie-container,
.filesupload-crop__body .cr-boundary {
  max-width: 100%;
}
.filesupload-crop__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
}

.filesupload-search {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 32px;
}
.filesupload-search__label {
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 22px;
  color: #222A39;
}
.filesupload-search__field {
  position: relative;
  width: 230px;
}
.filesupload-search__input {
  width: 100%;
  height: 32px;
  padding: 0 36px 0 12px;
  border: 1px solid #BCC9DF;
  border-radius: 8px;
  background: #FFFFFF;
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 18px;
  color: #222A39;
}
.filesupload-search__input::placeholder {
  color: #BCC9DF;
}
.filesupload-search__input:focus {
  outline: none;
  border-color: #6F61EA;
}
.filesupload-search__icon {
  position: absolute;
  top: 50%;
  right: 8px;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  background: none;
  color: #758199;
  cursor: pointer;
}
.filesupload-search__icon i {
  font-size: 16px;
  line-height: 1;
}
.filesupload-search__icon:hover {
  color: #6F61EA;
}

.storage-info-block {
  width: 100%;
  margin-bottom: 16px;
  padding: 12px 16px;
  border: 1px solid #D3DEEF;
  border-radius: 16px;
  background: #FFFFFF;
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 22px;
  color: #222A39;
}

.msg0 {
  display: none;
  margin-bottom: 16px;
  padding: 12px 16px;
  background: #F3F5FF;
  border: 1px solid #EAECFF;
  border-radius: 12px;
  font-family: var(--font-body);
}

.msg01 {
  display: none;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  color: #222A39;
}
.msg01 .info-ico {
  font-size: 16px;
  line-height: 1;
  color: #6251E3;
}
.msg01 .show-ico {
  margin-left: auto;
  font-size: 16px;
  line-height: 1;
  color: #758199;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.msg01 .show-ico:hover {
  color: #6251E3;
}

.msg02 {
  display: none;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #EAECFF;
  font-size: 13px;
  line-height: 1.6;
  color: #3D4451;
}
.msg02 strong {
  font-weight: 600;
  color: #222A39;
}
.msg02 a {
  color: #6251E3;
  text-decoration: underline;
}
.msg02 .bullet {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 8px 1px 2px;
  border-radius: 9999px;
  background: #6F61EA;
  vertical-align: middle;
}

#list_block_groups.boards-block,
.boards-block {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  padding: 8px 0 12px;
  border: none;
  overflow-x: auto;
  white-space: normal;
  scrollbar-width: thin;
  scrollbar-color: var(--color-border-strong) transparent;
}
#list_block_groups.boards-block::-webkit-scrollbar,
.boards-block::-webkit-scrollbar {
  height: 8px;
}
#list_block_groups.boards-block::-webkit-scrollbar-thumb,
.boards-block::-webkit-scrollbar-thumb {
  background: #BCC9DF;
  border-radius: 9999px;
}

.board-block {
  display: inline-flex;
  flex-direction: column;
  flex: 0 0 auto;
  width: 340px;
  min-height: 72vh;
  max-height: 72vh;
  margin: 0;
  padding: 0;
  border: 1px solid #D3DEEF;
  border-radius: 12px;
  background: #FFFFFF;
  overflow-x: hidden;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--color-border-strong) transparent;
}
.board-block::-webkit-scrollbar {
  width: 8px;
}
.board-block::-webkit-scrollbar-thumb {
  background: #BCC9DF;
  border-radius: 9999px;
}
.board-block .board-head {
  display: flex;
  align-items: center;
  gap: 8px;
  position: sticky;
  top: 0;
  z-index: 1;
  width: 100%;
  margin: 0;
  padding: 8px 12px;
  float: none;
  border: 0;
  border-bottom: 1px solid #D3DEEF;
  border-radius: 12px 12px 0 0;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  color: #3D4451;
  background: #F8F9FC;
  cursor: pointer;
}
.board-block .board-head .bi {
  font-size: 12px;
  transition: all 0.2s ease;
}
.board-block .board-head.board-min {
  writing-mode: vertical-rl;
  flex: 1 1 auto;
  justify-content: flex-start;
  border-bottom: 0;
  border-radius: 12px;
}
.board-block.board-collapsed {
  width: 36px;
  overflow: hidden;
}
.board-block.board-collapsed > *:not(.board-head) {
  display: none;
}
.board-block > *:not(.board-head) {
  display: block;
  width: 100% !important;
  max-width: 100%;
  float: none !important;
  margin: 0;
  padding: 0;
}

.boards-block > .cls {
  display: none;
}

.board-block.st_not_in {
  border-color: rgb(243.3, 172.65, 174.9);
  border-top: 3px solid #E5484D;
}

.key_st_not_in {
  color: #E5484D;
  background: rgb(251.88, 233.04, 233.64);
  border-bottom-color: rgb(247.2, 200.1, 201.6);
}
.key_st_not_in .bi {
  color: #E5484D;
}

.board-block.cl_black {
  border-color: rgb(167.7, 170.85, 176.7);
  border-top: 3px solid #3D4451;
}

.key_cl_black {
  color: #3D4451;
  background: rgb(231.72, 232.56, 234.12);
  border-bottom-color: rgb(196.8, 198.9, 202.8);
}
.key_cl_black .bi {
  color: #3D4451;
}

.board-block.st_staff_in {
  border-color: rgb(145.65, 210, 209.1);
  border-top: 3px solid #0C9B99;
}

.key_st_staff_in {
  color: #0C9B99;
  background: rgb(225.84, 243, 242.76);
  border-bottom-color: rgb(182.1, 225, 224.4);
}
.key_st_staff_in .bi {
  color: #0C9B99;
}

.board-block.cl_blue {
  border-color: rgb(166.35, 195.6, 236.1);
  border-top: 3px solid #3A7BD5;
}

.key_cl_blue {
  color: #3A7BD5;
  background: rgb(231.36, 239.16, 249.96);
  border-bottom-color: rgb(195.9, 215.4, 242.4);
}
.key_cl_blue .bi {
  color: #3A7BD5;
}

.board-block.cl_violet {
  border-color: rgb(196.05, 172.65, 233.4);
  border-top: 3px solid #7C48CF;
}

.key_cl_violet {
  color: #7C48CF;
  background: rgb(239.28, 233.04, 249.24);
  border-bottom-color: rgb(215.7, 200.1, 240.6);
}
.key_cl_violet .bi {
  color: #7C48CF;
}

.board-block.cl_yellow {
  border-color: rgb(230.7, 202.35, 140.25);
  border-top: 3px solid #C98A00;
}

.key_cl_yellow {
  color: #C98A00;
  background: rgb(248.52, 240.96, 224.4);
  border-bottom-color: rgb(238.8, 219.9, 178.5);
}
.key_cl_yellow .bi {
  color: #C98A00;
}

.board-block.cl_grey {
  border-color: rgb(232.95, 140.25, 208.2);
  border-top: 3px solid #CE0097;
}

.key_cl_grey {
  color: #CE0097;
  background: rgb(249.12, 224.4, 242.52);
  border-bottom-color: rgb(240.3, 178.5, 223.8);
}
.key_cl_grey .bi {
  color: #CE0097;
}

.board-block.cl_coffe {
  border-color: rgb(212.25, 187.95, 181.2);
  border-top: 3px solid #A06A5B;
}

.key_cl_coffe {
  color: #A06A5B;
  background: rgb(243.6, 237.12, 235.32);
  border-bottom-color: rgb(226.5, 210.3, 205.8);
}
.key_cl_coffe .bi {
  color: #A06A5B;
}

.board-block.st_day_off {
  border-color: rgb(192.9, 198.3, 209.1);
  border-top: 3px solid #758199;
}

.key_st_day_off {
  color: #758199;
  background: rgb(238.44, 239.88, 242.76);
  border-bottom-color: rgb(213.6, 217.2, 224.4);
}
.key_st_day_off .bi {
  color: #758199;
}

.live_item {
  position: relative;
  margin: 8px 8px 0;
  padding: 8px 12px;
  border: 1px solid #D3DEEF;
  border-radius: 8px;
  background: #FFFFFF;
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 18px;
  color: #222A39;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.live_item:last-child {
  margin-bottom: 8px;
}
.live_item:hover {
  background: #F8F9FC;
  border-color: #BCC9DF;
}

.list_block_item_active {
  border-color: #6251E3 !important;
  background: #F3F5FF !important;
}

.live_item_main {
  display: flex;
  align-items: center;
  gap: 8px;
}

.live_item_photo {
  flex: 0 0 auto;
  width: 34px;
  height: 34px;
  border-radius: 9999px;
  object-fit: cover;
  border: 1px solid #D3DEEF;
  background: #F8F9FC;
}

.live_item_inrrrr {
  font-weight: 500;
  white-space: normal;
  word-break: break-word;
}
.live_item_inrrrr.cl_popup {
  color: #EB267F;
}

.lateness_minutes {
  font-weight: 700;
  color: #EB267F;
}

.list_user_menu {
  display: none;
  margin-top: 4px;
  padding: 4px 0;
  background: #FFFFFF;
  border: 1px solid #D3DEEF;
  border-radius: 8px;
  box-shadow: 0 18px 44px rgba(52, 66, 95, 0.1);
  cursor: default;
  white-space: normal;
}
.list_user_menu a {
  display: block;
  margin: 0;
  padding: 4px 12px;
  font-size: 12px;
  line-height: 18px;
  color: #6251E3;
  text-decoration: none;
}
.list_user_menu a:hover {
  background: #F3F5FF;
  text-decoration: none;
}

.list_block_item_active .list_user_menu {
  display: block;
}

.checksBox {
  padding: 8px;
  border: 1px solid #D3DEEF;
  border-radius: 12px;
  background: #FFFFFF;
}
.checksBox .level_1 {
  padding-left: 20px;
}
.checksBox .level_2 {
  padding-left: 20px;
}
.checksBox .level_3 {
  padding-left: 60px;
}
.checksBox label {
  margin: 0 0 0 4px;
  font-family: var(--font-body);
  font-size: 13px;
  line-height: 20px;
  color: #222A39;
  cursor: pointer;
}
.checksBox .role_tasks {
  margin: 4px 0 8px 20px;
}

.showLevels {
  display: inline-block;
  margin-left: 8px;
  font-size: 12px;
  color: #758199;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.showLevels:hover {
  color: #6251E3;
}

.checksBox .self-border {
  accent-color: #6251E3;
}

.groups_parent .checksBox {
  padding: 0;
  border: 0;
  border-radius: 0;
}

.groups_parent br {
  display: none;
}

.groups_parent > br {
  display: inline;
}

.groups_parent:has(> .radio) > br {
  display: none;
}

.chosen-container {
  font-family: var(--font-body);
  font-size: 14px;
  line-height: 22px;
  color: var(--color-text);
  width: 100% !important;
}

.chosen-container-single .chosen-single {
  width: 100%;
}

.chosen-container-single .chosen-single {
  display: flex;
  align-items: center;
  height: 40px;
  padding: 0 40px 0 16px;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: 12px;
  box-shadow: none;
  color: var(--color-text);
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.chosen-container-single .chosen-single span {
  margin-right: 0;
  font-weight: 500;
}
.chosen-container-single .chosen-single.chosen-default span {
  color: var(--color-text-subtle);
  font-weight: 400;
}
.chosen-container-single .chosen-single div {
  width: 32px;
}
.chosen-container-single .chosen-single div b {
  background: none !important;
}
.chosen-container-single .chosen-single div b::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 16px;
  height: 16px;
  transform: translateY(-50%);
  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23758199' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") no-repeat center/16px 16px;
  transition: transform 0.15s ease;
}
.chosen-container-single .chosen-single abbr {
  background: none;
}
.chosen-container-single .chosen-single abbr::after {
  content: "×";
  position: absolute;
  top: 50%;
  right: 36px;
  transform: translateY(-50%);
  font-size: 16px;
  line-height: 1;
  color: var(--color-text-subtle);
}
.chosen-container-single .chosen-single abbr:hover::after {
  color: var(--color-danger);
}
.chosen-container-single .chosen-search input[type=text] {
  margin: 0;
  height: 38px;
  padding: 8px 12px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background: var(--color-bg);
  font-family: var(--font-body);
  font-size: 13px;
  color: var(--color-text);
  outline: none;
  width: 100%;
}
.chosen-container-single .chosen-search input[type=text]:focus {
  border-color: var(--color-primary);
}

.chosen-container-active.chosen-container-single .chosen-single,
.chosen-container-multi.chosen-container-active .chosen-choices {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(111, 97, 234, 0.2);
}

.chosen-container-active.chosen-with-drop.chosen-container-single .chosen-single {
  border-radius: 12px;
}
.chosen-container-active.chosen-with-drop.chosen-container-single .chosen-single div b::after {
  transform: translateY(-50%) rotate(180deg);
}

.chosen-container-multi .chosen-choices {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  min-height: 40px;
  max-height: 120px;
  overflow-y: auto;
  padding: 6px 12px;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: 12px;
  box-shadow: none;
  cursor: text;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
  scrollbar-width: thin;
  scrollbar-color: var(--color-border-strong) transparent;
}
.chosen-container-multi .chosen-choices::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.chosen-container-multi .chosen-choices::-webkit-scrollbar-track {
  background: transparent;
}
.chosen-container-multi .chosen-choices::-webkit-scrollbar-thumb {
  background: var(--color-border);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
.chosen-container-multi .chosen-choices::-webkit-scrollbar-thumb:hover {
  background: var(--color-border-strong);
}
.chosen-container-multi .chosen-choices li.search-field {
  margin: 0;
}
.chosen-container-multi .chosen-choices li.search-field input[type=text] {
  height: 28px;
  margin: 0;
  padding: 0 4px;
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
}
.chosen-container-multi .chosen-choices li.search-field input[type=text]::placeholder {
  color: var(--color-text-subtle);
}
.chosen-container-multi .chosen-choices li.search-field {
  width: 100%;
}
.chosen-container-multi .chosen-choices li.search-field span.geokbd-switcher {
  right: -6px;
}
.chosen-container-multi .chosen-choices li.search-choice {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 4px 8px 4px 10px;
  background: var(--color-bg-soft);
  border: 1px solid var(--color-border-soft);
  border-radius: 8px;
  box-shadow: none;
  color: #3D4451;
  font-size: 14px;
  line-height: 22px;
}
.chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
  position: static;
  width: 14px;
  height: 14px;
  top: auto;
  right: auto;
  background: none;
}
.chosen-container-multi .chosen-choices li.search-choice .search-choice-close::after {
  content: "×";
  display: block;
  font-size: 14px;
  line-height: 14px;
  text-align: center;
  color: var(--color-text-subtle);
}
.chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover::after {
  color: var(--color-danger);
}
.chosen-container-multi .chosen-choices li.search-choice-disabled {
  opacity: 0.6;
}

.chosen-container .chosen-drop {
  width: 100%;
  box-sizing: border-box;
  margin-top: 4px;
  padding: 8px;
  background: var(--color-bg);
  border: 1px solid var(--color-border-soft);
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.chosen-container:not(.chosen-with-drop) .chosen-drop {
  height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  overflow: hidden;
}

.chosen-container .chosen-results {
  margin: 0;
  padding: 0;
  max-height: 260px;
  scrollbar-width: thin;
  scrollbar-color: var(--color-border-strong) transparent;
}
.chosen-container .chosen-results::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.chosen-container .chosen-results::-webkit-scrollbar-track {
  background: transparent;
}
.chosen-container .chosen-results::-webkit-scrollbar-thumb {
  background: var(--color-border);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}
.chosen-container .chosen-results::-webkit-scrollbar-thumb:hover {
  background: var(--color-border-strong);
}
.chosen-container .chosen-results li {
  padding: 9px 12px;
  margin-bottom: 2px;
  border-radius: 12px;
  font-size: 14px;
  line-height: 22px;
  color: var(--color-text);
}
.chosen-container .chosen-results li.active-result {
  cursor: pointer;
}
.chosen-container .chosen-results li.active-result, .chosen-container .chosen-results li.result-selected {
  min-width: 100%;
  width: max-content;
}
.chosen-container .chosen-results li.highlighted {
  background: var(--PURPLE-Purple-100, #EAECFF);
  color: var(--GRAY-Gray-800, #222A39);
}
.chosen-container .chosen-results li.result-selected {
  color: var(--color-primary);
  font-weight: 500;
  background: var(--color-primary-softer);
}
.chosen-container .chosen-results li.group-result {
  padding: 8px 12px 4px;
  margin-bottom: 0;
  color: var(--color-text-subtle);
  font-size: 11px;
  font-weight: 500;
  text-transform: none;
  cursor: default;
}
.chosen-container .chosen-results li.no-results {
  color: var(--color-text-muted);
  background: var(--color-bg-soft);
  cursor: default;
}

.chosen-container .chosen-batch-select-block {
  display: flex;
  gap: 4px;
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px solid var(--color-border-soft);
}
.chosen-container .chosen-batch-select-block .chosen-batch-select {
  flex: 1 1 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
  text-align: center;
  cursor: pointer;
  user-select: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.chosen-container .chosen-batch-select-block .chosen-batch-select .bi {
  font-size: 14px;
  line-height: 1;
}
.chosen-container .chosen-batch-select-block .chosen-batch-select-all {
  color: var(--color-primary);
}
.chosen-container .chosen-batch-select-block .chosen-batch-select-all:hover {
  background: var(--color-primary-soft);
}
.chosen-container .chosen-batch-select-block .chosen-batch-deselect-all {
  color: var(--color-text-subtle);
}
.chosen-container .chosen-batch-select-block .chosen-batch-deselect-all:hover {
  color: var(--color-danger);
  background: var(--color-danger-soft);
}

.chosen-container .chosen-search {
  position: relative;
  padding: 0 0 6px;
}

.chosen-container-multi .chosen-drop .chosen-search input[type=text] {
  height: 38px;
  padding: 8px 12px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  font-family: var(--font-body);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 22px;
  color: var(--GRAY-Gray-500, #758199);
  background: var(--color-bg);
  outline: none;
}
.chosen-container-multi .chosen-drop .chosen-search input[type=text]:focus {
  border-color: var(--color-primary);
}

.from-group-right {
  position: relative;
}

.from-group-right input {
  padding-right: 40px;
}

.from-group-addon-right {
  position: absolute;
  right: 0;
  bottom: 4px;
}

.chosen-container span.geokbd-switcher {
  top: 44%;
  bottom: auto;
  right: 4px;
  width: 30px;
  height: 30px;
  transform: translateY(-50%);
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.chosen-container span.geokbd-switcher:hover {
  background: var(--color-bg-soft);
}
.chosen-container span.geokbd-switcher .gk-switcher {
  padding: 4px;
}
.chosen-container span.geokbd-switcher .gk-ka,
.chosen-container span.geokbd-switcher .gk-us {
  width: 22px;
  height: 22px;
  background-size: contain;
  background-position: center;
  border-radius: 8px;
}
.chosen-container .chosen-choices li.search-field span.geokbd-switcher {
  top: 50%;
}

.chosen-disabled {
  opacity: 1;
}
.chosen-disabled .chosen-single,
.chosen-disabled .chosen-choices {
  background: var(--color-bg-soft);
  border-color: var(--color-border-soft);
  color: #758199;
  cursor: not-allowed;
}

.filter-block .chosen-container-single .chosen-single {
  height: 40px;
}
.filter-block .chosen-container-multi .chosen-choices {
  min-height: 40px;
}

.chosen_img {
  width: 30px;
  height: 30px;
  overflow: hidden;
  min-height: 30px;
  min-width: 30px;
  flex: 0 0 auto;
}
.chosen_img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  vertical-align: middle;
  border-radius: 50%;
  display: block;
}

.chosen-container-multi .chosen-choices li.search-choice:has(.chosen_mulit_choice_with_img_wrapper) {
  height: fit-content !important;
}

.chosen_mulit_choice_with_img_wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 5px;
}

.chosen_element_with_img_wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 5px;
  line-height: inherit;
  font-weight: inherit;
  font-size: inherit;
  font-style: inherit;
  white-space: inherit;
}
.chosen_element_with_img_wrapper span {
  line-height: inherit;
  font-weight: inherit;
  font-size: inherit;
  font-style: inherit;
  white-space: inherit;
}

.chosen-container-single .chosen-single span {
  display: flex;
  align-items: center;
  gap: 6px;
  overflow: hidden;
}
.chosen-container-single .chosen-single span:has(> .chosen_img) {
  margin-top: -2px;
}
.chosen-container-single .chosen-single span .chosen_img {
  position: relative;
  top: unset;
  right: unset;
  width: 20px;
  height: 20px;
  line-height: 0;
  min-width: 20px;
  min-height: 20px;
}

.slfstaff_item_with_img {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 5px;
}

.img-hover-tip {
  display: none;
  z-index: 99999;
  background: #fff;
  padding: 4px;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}
.img-hover-tip[data-show] {
  display: block;
}
.img-hover-tip img {
  width: 100px;
  height: 100px;
  object-fit: cover;
  border-radius: 6px;
  display: block;
}

.img-hover-tip-arrow,
.img-hover-tip-arrow::before {
  position: absolute;
  width: 8px;
  height: 8px;
  background: #fff;
}

.img-hover-tip-arrow {
  visibility: hidden;
}
.img-hover-tip-arrow::before {
  content: "";
  visibility: visible;
  transform: rotate(45deg);
}

.img-hover-tip[data-popper-placement^=top] .img-hover-tip-arrow {
  bottom: -4px;
}

.img-hover-tip[data-popper-placement^=bottom] .img-hover-tip-arrow {
  top: -4px;
}

.filter-mode__pane.is-hidden {
  display: none;
}

.filter-mode-switch {
  display: none;
  align-items: center;
  flex: none;
}
.filter-mode-switch.is-visible {
  display: inline-flex;
}

.chosen-container .filter-mode-switch {
  position: absolute;
  top: 44%;
  right: 38px;
  transform: translateY(-50%);
}
.chosen-container .chosen-choices li.search-field .filter-mode-switch {
  top: 50%;
  right: 28px;
}
.chosen-container .chosen-search:has(.filter-mode-switch) input[type=text] {
  padding-right: 78px;
}
.chosen-container .chosen-choices li.search-field:has(.filter-mode-switch) input[type=text] {
  padding-right: 70px;
}

.on-off-switch-input {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.on-off-switch-wrap {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  vertical-align: middle;
}

.on-off-switch {
  position: relative;
  display: inline-block;
  flex: none;
  width: 35px;
  height: 22px;
  border-radius: 999px;
  background: var(--color-bg-soft);
  border: 1px solid var(--color-border);
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
  -webkit-tap-highlight-color: transparent;
}
.on-off-switch .on-off-switch-knob {
  position: absolute;
  top: 50%;
  left: 6px;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #758199;
  transform: translate(0, -50%);
  transition: transform 0.18s ease, background-color 0.18s ease;
}
.on-off-switch.is-on {
  background: #E4E5FF;
  border-color: #bbb6ea;
}
.on-off-switch.is-on .on-off-switch-knob {
  background: var(--color-primary);
  transform: translate(13px, -50%);
}
.on-off-switch:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(111, 97, 234, 0.2);
}

.on-off-switch-label {
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  color: var(--color-text);
  user-select: none;
}
.on-off-switch-label.is-empty {
  display: none;
}

.on-off-switch-wrap.is-disabled .on-off-switch {
  cursor: not-allowed;
  background: var(--color-bg-soft);
  border-color: var(--color-border-soft);
}
.on-off-switch-wrap.is-disabled .on-off-switch .on-off-switch-knob {
  background: #BCC9DF;
}
.on-off-switch-wrap.is-disabled .on-off-switch-label {
  color: var(--color-text-muted);
}

.icon_picker {
  cursor: pointer;
}
.icon_picker .icon-container {
  position: relative;
  display: flex;
  align-items: center;
  height: 100%;
  overflow: hidden;
}
.icon_picker .icon-pick {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
}
.icon_picker .icon-picked {
  font-size: 20px;
  line-height: 1;
  color: #222A39;
}
.icon_picker .sp-dd {
  flex: 0 0 auto;
  margin-left: 8px;
  font-size: 10px;
  color: #758199;
}

.icon-picker {
  position: absolute;
  z-index: 1400;
  width: 360px;
  height: 260px;
  padding: 12px;
  background: #FFFFFF;
  border: 1px solid #D3DEEF;
  border-radius: 16px;
  box-shadow: 0 18px 44px rgba(52, 66, 95, 0.1);
}
.icon-picker .icon-picker-search {
  width: 100%;
  height: 36px;
  padding: 0 44px 0 12px;
  font-size: 14px;
  color: #222A39;
  background: #FFFFFF;
  border: 1px solid #D3DEEF;
  border-radius: 10px;
  outline: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.icon-picker .icon-picker-search::placeholder {
  color: #A5B3C9;
}
.icon-picker .icon-picker-search:focus {
  border-color: #BBB4FD;
  box-shadow: 0 0 0 3px rgba(111, 97, 234, 0.2);
}
.icon-picker .icon-search {
  position: absolute;
  top: 12px;
  right: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  font-size: 14px;
  color: #758199;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.icon-picker .icon-search:hover {
  color: #6251E3;
}
.icon-picker > div {
  margin-top: 12px;
  height: calc(100% - 36px - 12px);
  overflow-y: auto;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 4px;
  scrollbar-width: thin;
  scrollbar-color: #BCC9DF transparent;
}
.icon-picker .icon_p {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1;
  font-size: 18px;
  color: #3D4451;
  border: 1px solid #D3DEEF;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.icon-picker .icon_p:hover {
  color: #6251E3;
  background: #F3F5FF;
  border-color: #E4E5FF;
}

.chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 36px;
  padding: 0 12px;
  border: 1px solid var(--color-border);
  border-radius: 24px;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.chip:hover {
  background: var(--color-bg-soft);
}
.chip.is-selected, .chip[aria-selected=true], .chip[aria-pressed=true] {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-text-inverse);
}
.chip.is-selected:hover, .chip[aria-selected=true]:hover, .chip[aria-pressed=true]:hover {
  background: var(--color-primary-hover);
}
.chip.is-disabled, .chip[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.chip-sm {
  height: 28px;
  padding: 0 10px;
  font-size: 12px;
  line-height: 18px;
}

.chip-md {
  height: 36px;
  padding: 0 12px;
}

.chip-lg {
  height: 44px;
  padding: 0 16px;
  font-size: 14px;
}

.chip-soft {
  background: var(--color-primary-soft);
  border-color: var(--color-primary-soft);
  color: var(--color-primary);
}
.chip-soft:hover {
  background: var(--color-primary-softer);
}
.chip-soft.is-selected, .chip-soft[aria-selected=true] {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-text-inverse);
}

.chip-ghost {
  background: transparent;
  border-color: var(--color-border-soft);
}
.chip-ghost:hover {
  background: var(--color-bg-soft);
  border-color: var(--color-border);
}

.tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border-radius: 24px;
  background: var(--color-bg-soft);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
}

.tag-primary {
  background: var(--color-primary-soft);
  color: var(--color-primary);
}

.tag-success {
  background: var(--color-success-soft);
  color: var(--color-success-strong);
}

.tag-danger {
  background: var(--color-danger-soft);
  color: var(--color-danger-strong);
}

.tag-accent {
  background: var(--color-accent-soft);
  color: var(--color-accent);
}

.tag-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  margin-left: 2px;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  opacity: 0.6;
  transition: all 0.15s ease;
}
.tag-close:hover {
  opacity: 1;
  background: rgba(0, 0, 0, 0.06);
}

.segmented {
  display: inline-flex;
  padding: 4px;
  background: var(--color-bg-soft);
  border-radius: 24px;
  gap: 2px;
}

.segmented-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 16px;
  border-radius: 20px;
  background: transparent;
  color: var(--color-text-muted);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.segmented-item:hover {
  color: var(--color-text);
}
.segmented-item.is-active, .segmented-item[aria-selected=true] {
  background: var(--color-bg);
  color: var(--color-primary);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
}

.pill-group {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pill-option {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border: 1px solid var(--color-border);
  border-radius: 24px;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  cursor: pointer;
  user-select: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.pill-option:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
}
.pill-option.is-selected, input:checked + .pill-option {
  background: var(--color-primary-soft);
  border-color: var(--color-primary);
  color: var(--color-primary);
}
.pill-option input[type=radio],
.pill-option input[type=checkbox] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.workflow_types_container {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 12px;
  width: 100%;
}

.workflow_type_button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-width: 200px;
  max-width: 320px;
  min-height: 80px;
  padding: 12px 16px;
  border: 1px solid var(--color-border-soft, #D3DEEF);
  border-radius: 16px;
  background: var(--color-bg, #FFFFFF);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  overflow: hidden;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.workflow_type_button:hover, .workflow_type_button:focus-visible {
  border-color: var(--color-primary, #6F61EA);
  background: var(--color-primary-softer, #EAECFF);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
  text-decoration: none;
}
.workflow_type_button:focus-visible {
  outline: none;
}

.flow_title {
  width: 100%;
  max-width: 100%;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-text, #222A39);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.workflow_type_button:hover .flow_title, .workflow_type_button:focus-visible .flow_title {
  color: var(--color-primary, #6F61EA);
}

.flow_desc {
  display: block;
  width: 100%;
  max-width: 100%;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  color: var(--color-text-subtle, #758199);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tab_header_container > div {
  border-bottom: none !important;
}

.tab_header_container:has(#global_flow_search_input) .tab_button_general {
  position: relative;
  padding: 8px 0;
  margin-right: 16px;
  border: 0;
  background: transparent;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
  color: var(--color-text-subtle, #758199);
  cursor: pointer;
  transition: color 0.2s ease;
}
.tab_header_container:has(#global_flow_search_input) .tab_button_general::after {
  content: "";
  position: absolute;
  left: 0;
  right: 16px;
  bottom: -1px;
  height: 2px;
  border-radius: 9999px;
  background: var(--color-primary, #6F61EA);
  opacity: 0;
  transition: opacity 0.2s ease;
  width: 100%;
}
.tab_header_container:has(#global_flow_search_input) .tab_button_general:hover {
  color: var(--color-primary, #6F61EA);
}
.tab_header_container:has(#global_flow_search_input) .tab_button_general.tab_button_active {
  color: var(--color-primary, #6F61EA);
}
.tab_header_container:has(#global_flow_search_input) .tab_button_general.tab_button_active::after {
  opacity: 1;
}

#global_flow_search_input.form-control {
  border-radius: 9999px;
  padding: 6px 10px;
}

.tab_header_container:has(#global_flow_search_input) + .col-md-12 > .tab-pane {
  display: none;
}
.tab_header_container:has(#global_flow_search_input) + .col-md-12 > .tab-pane.active {
  display: block;
}

.card {
  background: var(--color-bg);
  border-radius: 20px;
  padding: 24px;
  box-shadow: 0 2px 30px 0 rgba(214, 217, 229, 0.3);
}

.card-flat {
  background: var(--color-bg-soft);
  border-radius: 20px;
  padding: 24px;
}

.card-elevated {
  background: var(--color-bg);
  border-radius: 20px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
  padding: 24px;
}

.card-sm {
  padding: 16px;
  border-radius: 16px;
}

.card-lg {
  padding: 32px;
  border-radius: 26px;
}

.card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--color-border-soft);
}

.card-title {
  font-size: 14px;
  font-weight: 500;
  color: var(--color-text);
}

.card-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.card-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding-top: 16px;
  margin-top: 16px;
  border-top: 1px solid var(--color-border-soft);
}

.suggestion-detail {
  margin-bottom: 16px;
}

.suggestion-detail-title {
  margin: 0 0 30px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--color-text-strong, #141D2D);
}

.suggestion-detail-body {
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-start;
  gap: 16px;
  padding: 20px;
  background: var(--color-bg-soft, #F0F3FD);
  border-radius: 16px;
}
@media (max-width: 768px) {
  .suggestion-detail-body {
    flex-direction: column-reverse;
    align-items: center;
  }
}

.suggestion-detail-text {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 14px;
  line-height: 1.7;
  color: var(--color-text, #222A39);
}
.suggestion-detail-text p {
  margin: 0 0 8px;
}
.suggestion-detail-text p:last-child {
  margin-bottom: 0;
}
.suggestion-detail-text p:has(> strong:only-child),
.suggestion-detail-text p:has(> b:only-child) {
  color: var(--color-text-strong, #141D2D);
}
.suggestion-detail-text strong, .suggestion-detail-text b {
  color: var(--color-text-strong, #141D2D);
  font-weight: 600;
}
.suggestion-detail-text a {
  color: var(--color-primary, #6F61EA);
  word-break: break-word;
}

.suggestion-detail-media {
  flex: 0 0 auto;
}
.suggestion-detail-media img {
  display: block;
  max-width: 320px;
  width: 100%;
  height: auto;
  border-radius: 12px;
}

.suggestion-files {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--color-border-soft, #D3DEEF);
}

.suggestion-files-title {
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-text-muted, #596476);
}

.suggestion-files-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.suggestion-file img {
  display: block;
  width: 200px;
  height: 120px;
  object-fit: cover;
  border-radius: 10px;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.suggestion-file img:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}

.suggestion-others {
  margin-top: 30px;
}

.suggestion-others-title {
  margin: 0 0 16px;
  font-size: 18px;
  font-weight: 600;
  color: var(--color-text-strong, #141D2D);
}

.suggestion-others-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
}

.suggestion-card {
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.suggestion-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  text-decoration: none;
}

.suggestion-card-media {
  aspect-ratio: 1/1;
  overflow: hidden;
}
.suggestion-card-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.suggestion-card-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 auto;
  padding: 16px;
}

.suggestion-card-name {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--color-text-strong, #141D2D);
}

.suggestion-card-text {
  font-size: 13px;
  line-height: 1.5;
  color: var(--color-text-subtle, #758199);
}

.suggestion-card-more {
  margin-top: auto;
  padding-top: 8px;
  font-size: 13px;
  font-weight: 500;
  color: var(--color-primary, #6F61EA);
}

.news-article {
  max-width: 820px;
  margin: 0 auto;
}

.news-article-head {
  margin-bottom: 23px;
}

.news-article-date {
  display: block;
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--color-primary, #6F61EA);
}

.news-article-title {
  margin: 0;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.25;
  color: var(--color-text-strong, #141D2D);
}
@media (max-width: 768px) {
  .news-article-title {
    font-size: 24px;
  }
}

.news-article-main {
  display: flex;
  align-items: flex-start;
  gap: 32px;
}
@media (max-width: 768px) {
  .news-article-main {
    flex-direction: column;
    gap: 16px;
  }
}

.news-article-cover {
  flex: 0 0 auto;
  width: 340px;
  max-width: 100%;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 2px 30px 0 rgba(214, 217, 229, 0.3);
}
@media (max-width: 768px) {
  .news-article-cover {
    width: 100%;
  }
}
.news-article-cover img {
  display: block;
  width: 100%;
  height: 240px;
  object-fit: cover;
}
@media (max-width: 768px) {
  .news-article-cover img {
    height: 200px;
  }
}

.news-article-body {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 16px;
  line-height: 1.75;
  color: var(--color-text, #222A39);
}
.news-article-body p {
  margin: 0 0 16px;
}
.news-article-body p:last-child {
  margin-bottom: 0;
}
.news-article-body h1, .news-article-body h2, .news-article-body h3, .news-article-body h4 {
  margin: 28px 0 12px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--color-text-strong, #141D2D);
}
.news-article-body a {
  color: var(--color-primary, #6F61EA);
  word-break: break-word;
}
.news-article-body a:hover {
  color: var(--color-primary-hover, #6251E3);
}
.news-article-body img {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}
.news-article-body ul, .news-article-body ol {
  margin: 0 0 16px;
  padding-left: 20px;
}
.news-article-body li {
  margin-bottom: 4px;
}
.news-article-body blockquote {
  margin: 16px 0;
  padding: 8px 16px;
  border-left: 3px solid var(--color-primary-soft, #E4E5FF);
  color: var(--color-text-muted, #596476);
}

.news-article-files {
  margin-top: 32px;
  padding-top: 16px;
  border-top: 1px solid var(--color-border-soft, #D3DEEF);
}

.news-article-files-title {
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 500;
  color: var(--color-text-muted, #596476);
}

.news-article-files-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.news-file {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 1px solid var(--color-border-soft, #D3DEEF);
  border-radius: 10px;
  background: var(--color-bg, #FFFFFF);
  font-size: 13px;
  font-weight: 500;
  color: var(--color-text, #222A39);
  text-decoration: none;
  transition: border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}
.news-file i {
  color: var(--color-text-subtle, #758199);
}
.news-file:hover {
  border-color: var(--color-primary-strong, #BBB4FD);
  color: var(--color-primary, #6F61EA);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
  text-decoration: none;
}
.news-file:hover i {
  color: var(--color-primary, #6F61EA);
}

.news-others {
  margin-top: 48px;
  padding-top: 32px;
  border-top: 1px solid var(--color-border-soft, #D3DEEF);
}

.news-others-title {
  margin: 0 0 16px;
  font-size: 20px;
  font-weight: 600;
  color: var(--color-text-strong, #141D2D);
}

.news-others-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
}

.news-card-item {
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.news-card-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  text-decoration: none;
}
.news-card-item:hover .news-card-name {
  color: var(--color-primary, #6F61EA);
}

.news-card-media {
  overflow: hidden;
  aspect-ratio: 7/5;
}
.news-card-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.news-card-item:hover .news-card-media img {
  transform: scale(1.05);
}

.news-card-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1 1 auto;
  padding: 16px;
  box-shadow: 0 1px 12px 0 rgba(52, 66, 95, 0.04);
}

.news-card-date {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--color-text-subtle, #758199);
}

.news-card-name {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--color-text-strong, #141D2D);
  transition: color 0.15s ease;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.news-card-text {
  font-size: 13px;
  line-height: 1.55;
  color: var(--color-text-muted, #596476);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.news-card-text * {
  margin: 0;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}

.news-card-more {
  margin-top: auto;
  padding-top: 8px;
  font-size: 13px;
  font-weight: 500;
  color: var(--color-primary, #6F61EA);
}

.research-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
}

.research-card {
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.research-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  text-decoration: none;
}
.research-card:hover .research-card-name {
  color: var(--color-primary, #6F61EA);
}
.research-card:hover .research-card-media img {
  transform: scale(1.05);
}

.research-card-media {
  aspect-ratio: 16/9;
  overflow: hidden;
  background: var(--color-bg-soft, #F0F3FD);
}
.research-card-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.research-card-body {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 1 1 auto;
  padding: 16px;
}

.research-card-name {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.4;
  color: var(--color-text-strong, #141D2D);
  transition: color 0.15s ease;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.research-card-text {
  font-size: 13px;
  line-height: 1.6;
  color: var(--color-text-muted, #596476);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.research-card-text * {
  margin: 0;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}

.research-card-cta {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: auto;
  padding-top: 8px;
  font-size: 13px;
  font-weight: 500;
  color: var(--color-primary, #6F61EA);
}
.research-card-cta i {
  font-size: 14px;
  line-height: 1;
  transition: transform 0.15s ease;
}
.research-card:hover .research-card-cta i {
  transform: translateX(3px);
}

.user_block.consulting {
  margin: 0 auto 24px;
  padding: 24px;
  background: var(--color-bg-soft, #F0F3FD);
  border-radius: 20px;
  min-height: 460px;
}
.user_block.consulting .consulting-row {
  display: flex;
  align-items: flex-start;
  gap: 24px;
}
@media (max-width: 768px) {
  .user_block.consulting .consulting-row {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
}
.user_block.consulting .profile_private_value {
  flex: 0 0 auto;
}
.user_block.consulting .profile_private_value_div_3 {
  width: 120px;
  height: 120px;
  border-radius: 20px;
  overflow: hidden;
  background: var(--color-bg, #FFFFFF);
  box-shadow: 0 2px 30px 0 rgba(214, 217, 229, 0.3);
}
.user_block.consulting .profile_private_value_div_3 img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.user_block.consulting .consulting-text {
  flex: 1 1 auto;
  min-width: 0;
}
.user_block.consulting .profile_name {
  margin: 0 0 8px;
  margin-top: 10px;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.35;
  color: var(--color-text-strong, #141D2D);
}
.user_block.consulting .profile_position {
  margin: 0 0 12px;
  font-size: 14px;
  line-height: 1.7;
  color: var(--color-text, #222A39);
}
.user_block.consulting .profile_position:last-child {
  margin-bottom: 0;
}
.user_block.consulting .profile_position p {
  margin: 0 0 8px;
}
.user_block.consulting .profile_position p:last-child {
  margin-bottom: 0;
}
.user_block.consulting .profile_position strong, .user_block.consulting .profile_position b {
  color: var(--color-text-strong, #141D2D);
  font-weight: 600;
}
.user_block.consulting .profile_position a {
  color: var(--color-primary, #6F61EA);
  word-break: break-word;
}

#form-item-LOCAL_PHOTO .uploadblock {
  display: block;
  width: 170px;
  height: 170px;
  object-fit: cover;
  margin: auto;
}

.badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  min-height: 22px;
  padding: 2px 10px;
  border-radius: 999px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
  white-space: nowrap;
  background: #F0F3FD;
  color: #222A39;
}

.badge-primary {
  background: var(--color-primary-soft);
  color: var(--color-primary);
}

.badge-success {
  background: #D8F8EE;
  color: #128394;
}

.badge-danger {
  background: #FFE4F0;
  color: #EB267F;
}

.badge-accent {
  background: #F8E6FF;
  color: #CE0097;
}

.badge-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  margin-right: 6px;
}

.message,
.error_message,
.info_message {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 6px 16px 6px 10px;
  border-radius: 12px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  width: max-content;
}
@media (max-width: 767.98px) {
  .message,
  .error_message,
  .info_message {
    width: auto;
    margin: 5px !important;
  }
}
.message .bi,
.error_message .bi,
.info_message .bi {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  border-radius: 9999px;
  font-size: 12px;
  color: #FFFFFF;
}

.message {
  background: #D8F8EE;
  color: #128394;
}
.message .bi {
  background: #01B39E;
}

.error_message {
  background: #FFE4F0;
  color: #EB267F;
}
.error_message .bi {
  background: #FA3E93;
}

.info_message {
  background: #EAECFF;
  color: #6251E3;
}
.info_message .bi {
  background: #6F61EA;
}

.import-notes {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  margin-top: 12px;
  padding: 12px 16px;
}
.import-notes .error_message {
  justify-content: flex-start;
  text-align: left;
}

.avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--color-primary-soft);
  color: var(--color-primary);
  font-size: 14px;
  font-weight: 500;
  overflow: hidden;
}
.avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.avatar-group {
  display: inline-flex;
}
.avatar-group .avatar {
  border: 2px solid var(--color-bg);
  margin-left: -8px;
}
.avatar-group .avatar:first-child {
  margin-left: 0;
}

.avatar-initials {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--ai-bg, var(--color-primary-soft));
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  user-select: none;
  overflow: hidden;
}
.avatar-initials img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.avatar-xs {
  width: 24px;
  height: 24px;
  font-size: 11px;
}

.avatar-sm {
  width: 32px;
  height: 32px;
  font-size: 12px;
}

.avatar-md {
  width: 40px;
  height: 40px;
  font-size: 14px;
}

.avatar-lg {
  width: 56px;
  height: 56px;
  font-size: 18px;
}

.avatar-xl {
  width: 80px;
  height: 80px;
  font-size: 22px;
}

.avatar-xxl {
  width: 100px;
  height: 100px;
  font-size: 22px;
}

.workersinfo .avatar-initials {
  width: 50px;
  height: 50px;
  font-size: 16px;
}

body {
  padding: 0px;
}

.app-shell {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--color-bg-page);
  padding: 20px;
}
.app-shell::after {
  content: "";
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.01);
  z-index: calc(var(--z-dropdown) - 1);
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.25s ease;
}
.app-shell:has(.submenu.is-open)::after {
  opacity: 1;
}

.app-header {
  top: 0;
  height: 64px;
  background: var(--color-bg);
  border-radius: 16px;
  box-shadow: 0 2px 30px 0 rgba(214, 217, 229, 0.3);
  padding: 6px 24px;
}

.app-header-logo {
  padding-right: 31px;
  max-width: 206px;
  max-height: 52px;
  overflow: hidden;
}

.app-header-logo img, .site_logo img {
  width: auto;
  max-width: 100%;
  max-height: inherit;
  object-fit: contain;
}

.app-header-search {
  border-left: 2px solid rgba(34, 42, 57, 0.12);
  border-right: 2px solid rgba(34, 42, 57, 0.12);
}

.app-header-search .input {
  border-color: transparent;
  border-radius: 9999px;
  min-height: 40px;
}
.app-header-search .input :focus {
  box-shadow: none;
  outline: none;
}
.app-header-search .input :focus-visible {
  outline: 1px solid var(--color-primary, #6F61EA) !important;
}

.app-header-search .input:focus {
  box-shadow: none;
}

.app-header-search .input:focus-visible {
  outline: 1px solid var(--color-primary, #6F61EA) !important;
}

.app-header-search .input-group {
  padding-left: 20px;
  padding-right: 20px;
}
.app-header-search .input-group .input-addon {
  left: 30px;
}

.app-header-actions i {
  font-size: 18px;
}

.app-header-actions i.bi-chevron-down {
  font-size: 14px;
  margin-left: 5px;
}

.app-header-actions .btn-ghost {
  color: var(--color-text-muted);
}
.app-header-actions .btn-ghost:hover {
  color: var(--color-text);
  background: var(--color-bg-soft);
}

.notif-dot {
  position: absolute;
  top: 3px;
  right: 4px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--color-danger);
  border: 2px solid var(--color-bg);
}

.app-header-user {
  position: relative;
  cursor: pointer;
  padding: 4px 8px 4px 4px;
  border-radius: 16px;
  transition: background-color 0.2s ease;
}
.app-header-user:hover {
  background: var(--color-bg-soft);
}
.app-header-user.is-open .app-header-user-menu {
  display: block;
}
.app-header-user > div {
  gap: 3px;
}

.app-header-user-menu {
  display: none;
  position: absolute;
  top: calc(100% + 11px);
  right: -25px;
  min-width: 220px;
  background: var(--color-bg);
  border-radius: 16px;
  padding: 8px;
  list-style: none;
  margin: 0;
  z-index: var(--z-dropdown);
  box-shadow: 0 8px 48px 0 rgba(52, 66, 95, 0.2);
}
.app-header-user-menu li {
  padding: 8px 12px;
  font-size: 13px;
  border-radius: 8px;
}
.app-header-user-menu li:hover {
  background: var(--color-bg-soft);
}
.app-header-user-menu a {
  color: var(--color-text);
  text-decoration: none;
  display: block;
}
.app-header-user-menu .logout {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}
.app-header-user-menu .logout a {
  display: inline;
}

.filter-block {
  padding-bottom: 20px;
  margin-left: calc(var(--bs-gutter-x, 1.5rem) * -0.5);
  margin-right: calc(var(--bs-gutter-x, 1.5rem) * -0.5);
}
.filter-block.is-collapsed > * {
  display: none;
}
@media (min-width: 768px) {
  .filter-block.is-collapsed > :nth-child(-n+3):not(.filter-block-actions) {
    display: block;
  }
}
@media (min-width: 992px) {
  .filter-block.is-collapsed > :nth-child(-n+4):not(.filter-block-actions) {
    display: block;
  }
}

@media (max-width: 767.98px) {
  .filter-block {
    display: flex;
    flex-wrap: wrap;
  }
  .filter-block::before, .filter-block::after {
    display: none;
  }
  .filter-block > .filter-type-switch {
    width: 50%;
  }
}
.filter-block-actions {
  display: none;
}
@media (max-width: 767.98px) {
  .filter-block-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-top: 8px;
  }
}

.filter-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  padding-bottom: 20px;
}

.filter-actions-group {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.filter-actions-divider {
  flex-shrink: 0;
  width: 1px;
  height: 20px;
  background: var(--color-border-soft);
}

.filter-actions-divider + .filter-actions-divider {
  display: none;
}

.filter_reset_btn {
  color: var(--color-text-muted);
}

.filter-add-more .filter-add-more-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 8px;
  color: var(--color-primary);
}
.filter-add-more.is-active {
  background: var(--color-primary-soft);
}

.filter-configure,
.filter-sort {
  color: var(--color-text);
}
.filter-configure i,
.filter-sort i {
  font-size: 18px;
  color: var(--color-text-muted);
}

.app-shell:not(.is-dashboard) .toolbar.configurator {
  display: none;
}

.toolbar.configurator {
  margin-top: 20px;
}

.filter-view-toggle {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px;
  background: var(--color-bg-soft);
  border-radius: 12px;
}
.filter-view-toggle .btn {
  height: 30px;
  width: 30px;
  color: var(--color-text-muted);
  background: transparent;
  border-radius: 8px;
}
.filter-view-toggle .btn.is-active {
  background: var(--color-bg);
  color: var(--color-primary);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.page_manual_button {
  background: var(--color-primary-softer);
  color: var(--color-primary);
  padding: 3px;
  line-height: 0;
  width: 32px;
  height: 32px;
}
.page_manual_button:hover {
  background: var(--color-primary-soft);
}
.page_manual_button i,
.page_manual_button .bi {
  font-size: 20px;
  line-height: 1;
}

@media (max-width: 767.98px) {
  .filter-add-more {
    display: inline-flex !important;
  }
  .filter-actions-left > *:not(.filter-add-more) {
    display: none;
  }
  .filter-configure span {
    display: none;
  }
  .filter-actions-divider {
    display: none;
  }
  .filter-actions-right {
    margin-left: auto;
  }
}
.app-body {
  flex: 1;
  display: flex;
  align-items: flex-start;
  min-height: 0;
  margin-top: 18px;
}

.app-sidebar-col {
  position: sticky;
  top: 20px;
  align-self: flex-start;
  height: 100vh;
  max-height: calc(100vh - 120px);
  transition: max-height 0.2s ease, flex-basis 0.25s ease;
}
.is-scrolled .app-sidebar-col {
  max-height: calc(100vh - 44px);
}
.app-sidebar-col {
  z-index: var(--z-dropdown);
  display: flex;
  flex-direction: column;
  flex: 0 0 232px;
  min-width: 0;
}
.is-sidebar-collapsed .app-sidebar-col {
  flex-basis: 56px;
}
@media (max-width: 991.98px) {
  .app-sidebar-col {
    display: contents;
  }
}

.app-scroll-logo {
  display: none;
}

@media (min-width: 992px) {
  .app-header-logo {
    width: 206px;
    padding-right: 22px;
    justify-content: center;
  }
  .app-scroll-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    height: 0;
    margin-bottom: 0;
    opacity: 0;
    overflow: hidden;
    width: 100%;
    max-width: none;
    align-self: stretch;
    padding: 0 16px;
    background: var(--color-bg);
    box-shadow: 0 2px 30px 0 rgba(214, 217, 229, 0.3);
    border-radius: 12px;
    transition: height 0.2s ease, margin-bottom 0.2s ease, padding 0.2s ease, opacity 0.2s ease;
  }
  .app-scroll-logo img {
    max-width: 100%;
    max-height: 48px;
    width: auto;
    height: auto;
    object-fit: contain;
    transform: translateY(-100%);
    transition: transform 0.2s ease;
  }
  .is-scrolled .app-scroll-logo {
    height: 56px;
    margin-bottom: 20px;
    opacity: 1;
    padding: 4px 16px;
  }
  .is-scrolled .app-scroll-logo img {
    transform: none;
  }
  .is-scrolled.is-sidebar-collapsed .app-scroll-logo {
    justify-content: center;
    padding: 4px 8px;
  }
}
.app-sidebar {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  z-index: var(--z-dropdown);
  min-width: 0;
  background: var(--color-bg);
  display: flex;
  flex-direction: column;
  padding: 16px 0px;
  scrollbar-width: thin;
  box-shadow: 0 2px 30px 0 rgba(214, 217, 229, 0.3);
  border-radius: 12px;
}
@media (max-width: 991.98px) {
  .app-sidebar {
    display: none;
  }
}

.app-sidebar-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 8px 12px;
  margin-bottom: 8px;
}

.app-sidebar-toggle {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--color-bg-soft);
  color: var(--color-text-muted);
  border-radius: 12px;
  cursor: pointer;
  font-size: 18px;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.app-sidebar-toggle:hover {
  background: var(--color-primary-softer);
  color: var(--color-primary);
  border-color: var(--color-primary-soft);
}
.app-sidebar-toggle .sidebar-toggle-icon--closed {
  display: none;
}
.app-sidebar-toggle:hover .sidebar-toggle-icon--open {
  display: none;
}
.app-sidebar-toggle:hover .sidebar-toggle-icon--closed {
  display: inline-flex;
}
.is-sidebar-collapsed .app-sidebar-toggle .sidebar-toggle-icon--open {
  display: none;
}
.is-sidebar-collapsed .app-sidebar-toggle .sidebar-toggle-icon--closed {
  display: inline-flex;
}
.is-sidebar-collapsed .app-sidebar-toggle:hover .sidebar-toggle-icon--open {
  display: inline-flex;
}
.is-sidebar-collapsed .app-sidebar-toggle:hover .sidebar-toggle-icon--closed {
  display: none;
}

.app-sidebar-header-label {
  flex: 1;
  min-width: 0;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--color-text-subtle);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.is-sidebar-collapsed .app-sidebar-header-label {
  display: none;
}

.app-sidebar-nav {
  flex: 1;
  min-height: 0;
  padding-top: 4px;
  overflow-y: auto;
  scrollbar-width: thin;
}
.is-sidebar-collapsed .app-sidebar-nav {
  scrollbar-width: none;
}
.is-sidebar-collapsed .app-sidebar-nav::-webkit-scrollbar {
  width: 0;
  height: 0;
}
.app-sidebar-nav ul, .app-sidebar-nav .main_menu_left {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.app-sidebar-nav li {
  position: relative;
  list-style: none;
  padding-left: 8px;
  padding-right: 8px;
}
.app-sidebar-nav a {
  display: flex;
  align-items: center;
  width: 100%;
  height: 35px;
  padding: 0 8px;
  gap: 12px;
  border-radius: 12px;
  color: var(--GRAY-Gray-800, #222A39);
  text-decoration: none;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
}
.app-sidebar-nav .parent-bi {
  display: flex;
  align-items: center;
  gap: 7px;
  flex: 1;
  min-width: 0;
  transition: gap 0.25s ease;
}
.app-sidebar-nav .parent-bi > i,
.app-sidebar-nav .parent-bi > .bi {
  flex-shrink: 0;
  width: 24px;
  font-size: 16px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: inherit;
}
.app-sidebar-nav .menu_title {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: inherit;
  max-width: 200px;
  opacity: 1;
  transform: translateX(0);
  transition: opacity 0.2s ease, max-width 0.25s ease, transform 0.2s ease;
}
.app-sidebar-nav .menu-chevron {
  flex-shrink: 0;
  font-size: 12px;
  color: var(--color-text-muted);
  margin-left: auto;
}
.is-sidebar-collapsed .app-sidebar-nav .menu-chevron {
  display: none;
}
.app-sidebar-nav li:not(.menu_item_active) > a:hover,
.app-sidebar-nav li:not(.menu_item_active).submenu-parent-open > a {
  background: var(--color-primary-softer);
  color: var(--color-text-strong);
}
.app-sidebar-nav .menu_item_active > a,
.app-sidebar-nav a.active,
.app-sidebar-nav a.is-active {
  background: var(--PURPLE-Purple-100, #EAECFF);
  color: var(--PURPLE-Purple-800, #6F61EA);
}
.app-sidebar-nav .menu_item_active > a .parent-bi > i,
.app-sidebar-nav .menu_item_active > a .parent-bi > .bi,
.app-sidebar-nav .menu_item_active > a .menu_title,
.app-sidebar-nav a.active .parent-bi > i,
.app-sidebar-nav a.active .parent-bi > .bi,
.app-sidebar-nav a.active .menu_title,
.app-sidebar-nav a.is-active .parent-bi > i,
.app-sidebar-nav a.is-active .parent-bi > .bi,
.app-sidebar-nav a.is-active .menu_title {
  color: var(--PURPLE-Purple-800, #6F61EA);
}
.app-sidebar-nav .menu_item_active .menu-chevron {
  color: var(--PURPLE-Purple-800, #6F61EA);
}
.app-sidebar-nav .menu_group {
  padding-left: 0;
  padding-right: 0;
}
.app-sidebar-nav .menu_group > .menu_group_toggle {
  width: auto;
  margin: 0 8px;
  cursor: pointer;
}
.app-sidebar-nav .menu_group_caret {
  flex-shrink: 0;
  margin-left: auto;
  font-size: 12px;
  color: var(--color-text-muted);
  transform: rotate(-90deg);
  transition: transform 0.2s ease;
}
.app-sidebar-nav .menu_group.is-open > .menu_group_toggle .menu_group_caret {
  transform: rotate(0deg);
}
.app-sidebar-nav .menu_group_wrap {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.2s ease;
}
.app-sidebar-nav .menu_group.is-open > .menu_group_wrap {
  grid-template-rows: 1fr;
}
.app-sidebar-nav .menu_group_items {
  overflow: hidden;
  min-height: 0;
  padding-left: 31px;
}
.is-sidebar-collapsed .app-sidebar-nav .menu_group_caret {
  display: none;
}
.is-sidebar-collapsed .app-sidebar-nav .menu_group_items {
  padding-left: 0;
}
.app-sidebar-nav .submenu {
  position: fixed;
  z-index: var(--z-dropdown);
  display: none;
  flex-direction: column;
  gap: 2px;
  min-width: 268px;
  background: var(--color-bg);
  border-left: 8px solid transparent;
  background-clip: padding-box;
  border-radius: 0 24px 24px 0;
  box-shadow: 8px 4px 24px 0px rgba(89, 97, 125, 0.15);
  padding: 12px 0;
  overflow-y: auto;
  overflow-x: hidden;
}
.app-sidebar-nav .submenu li {
  padding-left: 0px;
}
.app-sidebar-nav .submenu.is-open {
  display: flex;
}
.app-sidebar-nav .submenu_item > .submenu_a {
  display: flex;
  align-items: center;
  padding: 0 32px 0 22px;
  height: 35px;
  font-size: 12px;
  font-weight: 500;
  color: var(--GRAY-Gray-700, #3D4451);
  opacity: 0.8;
  text-decoration: none;
  white-space: nowrap;
  border-radius: 0 14px 14px 0;
  justify-content: flex-start;
}
.app-sidebar-nav .submenu_item > .submenu_a:hover {
  background: var(--color-primary-softer);
  color: var(--color-primary);
  opacity: 1;
  border-radius: 0 12px 12px 0;
}
.app-sidebar-nav .menu_item:has(.submenu:hover) {
  padding-right: 0;
}
.app-sidebar-nav .menu_item:has(.submenu:hover) > a {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}
.app-sidebar-nav .submenu_item.menu_subitem_active > .submenu_a {
  color: var(--color-primary);
  background: var(--color-primary-softer);
  font-weight: 600;
  opacity: 1;
  border-radius: 0 12px 12px 0;
}
.is-sidebar-collapsed .app-sidebar-nav .parent-bi {
  gap: 0;
}
.is-sidebar-collapsed .app-sidebar-nav .menu_title {
  opacity: 0;
  max-width: 0;
  transform: translateX(-4px);
  pointer-events: none;
}

.submenu_title {
  padding: 7px 16px 6px;
  font-size: 11px;
  font-family: var(--font-body);
  color: var(--sidebar-muted, #9aa0a6);
  letter-spacing: 0.02em;
  pointer-events: none;
  user-select: none;
  padding-left: 22px !important;
  display: none;
}

.is-sidebar-collapsed .submenu_title {
  display: block;
}

.is-sidebar-collapsed .submenu {
  padding-top: 0px;
}

.app-sidebar-footer {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--color-border-soft);
}

.app-sidebar-footer-link {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  height: 44px;
  padding: 0 12px;
  border-radius: 12px;
  color: var(--color-text-muted);
  text-decoration: none;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.app-sidebar-footer-link > i,
.app-sidebar-footer-link > .bi {
  flex-shrink: 0;
  width: 24px;
  font-size: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.app-sidebar-footer-link:hover {
  background: var(--color-primary-softer);
  color: var(--color-primary);
}
.is-sidebar-collapsed .app-sidebar-footer-link {
  width: 40px;
  height: 40px;
  padding: 0;
  justify-content: center;
  gap: 0;
  margin: 0 auto;
}
.is-sidebar-collapsed .app-sidebar-footer-link .app-sidebar-footer-label {
  display: none;
}

.app-main {
  flex: 1;
  min-width: 0;
  padding: 24px;
  align-self: stretch;
  display: flex;
  flex-direction: column;
}
@media (max-width: 767.98px) {
  .app-main {
    padding: 16px;
  }
}

.app-main .content-container {
  margin: 0 auto;
  width: 100%;
  flex: 1;
}

.app-main .app-footer {
  flex-shrink: 0;
}

.app-footer img {
  height: 24px;
  width: auto;
}
.app-footer a {
  color: inherit;
  text-decoration: none;
}
.app-footer a:hover {
  color: var(--color-primary);
}

.leave-card {
  height: 340px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.leave-card .select {
  border-radius: 40px;
}

.leave-row {
  animation: leave-fade-in 0.25s ease;
}

@keyframes leave-fade-in {
  from {
    opacity: 0;
    transform: translateY(4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  .leave-row {
    animation: none;
  }
}
.leave-nav-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  padding: 4px;
  border-radius: 9999px;
  border: 1px solid var(--color-gray-300);
  color: var(--color-gray-300);
  background: transparent;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.leave-nav-btn.is-active {
  border-color: var(--color-primary, #6F61EA);
  background: var(--color-primary, #6F61EA);
  color: #fff;
}
.leave-nav-btn.is-active:hover {
  background-color: var(--color-primary-hover, #6251E3);
}

.leave-ring {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 85px;
  height: 85px;
}

.leave-ring__svg {
  position: absolute;
  inset: 0;
  transform: rotate(-90deg);
}

.leave-ring__track {
  fill: none;
  stroke: var(--color-primary-softer, #EAECFF);
  stroke-width: 5;
}

.leave-ring__arc {
  fill: none;
  stroke: var(--color-primary, #6F61EA);
  stroke-width: 5;
  stroke-linecap: round;
}

.leave-ring--accent .leave-ring__track {
  stroke: var(--color-accent-soft, #F8E6FF);
}
.leave-ring--accent .leave-ring__arc {
  stroke: var(--color-accent, #DA1BBE);
}

.leave-ring__value {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  line-height: 1;
  color: var(--color-text, #222A39);
}

.leave-ring__number {
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 2px;
}

.leave-ring__label {
  font-size: 11px;
  font-weight: 400;
  color: var(--color-text-subtle, #758199);
}

.leave-items {
  height: 195px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.dashboard-tab {
  position: relative;
  display: inline-block;
  padding: 8px 0;
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  color: var(--color-text-subtle);
  text-decoration: none;
  transition: color 0.2s ease;
}
.dashboard-tab:hover {
  color: var(--color-text);
}
.dashboard-tab.is-active {
  color: var(--color-primary);
}
.dashboard-tab.is-active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  height: 3px;
  background: var(--color-primary);
  border-radius: 9999px;
}

.workday-card {
  height: 340px;
  display: flex;
  flex-direction: column;
}
.workday-card .workday-control {
  width: 85%;
  margin: auto;
  text-align: center;
}
.workday-card {
  justify-content: space-between;
}

.workday-timer-box {
  min-height: 160px;
  /* Default name link styling (restores original layout look) */
}
.workday-timer-box .profile-name-link {
  text-decoration: none;
  transition: color 0.2s ease-in-out;
}
.workday-timer-box .profile-photo-wrapper {
  position: relative;
  border-radius: 50%;
  text-decoration: none;
  color: inherit;
  overflow: hidden; /* Ensures the overlay stays inside the circular avatar bounds */
  /* 1. Setup the invisible overlay layer */
}
.workday-timer-box .profile-photo-wrapper::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  /* Uses CSS variable color with alpha opacity */
  background-color: var(--color-purple-800);
  opacity: 0;
  transition: opacity 0.2s ease-in-out;
  pointer-events: none; /* Allows clicks to go right through to the link */
}
.workday-timer-box .profile-photo-wrapper {
  /* 2. Activate border and overlay color on hover */
}
.workday-timer-box .profile-photo-wrapper:hover {
  border-color: var(--color-purple-800);
}
.workday-timer-box .profile-photo-wrapper:hover::after {
  opacity: 0.3;
}
.workday-timer-box .profile-name-link:hover {
  color: var(--color-purple-800) !important;
}
.workday-timer-box .profile-photo-wrapper:hover ~ div .profile-name-link {
  color: var(--color-purple-800) !important;
}

.workday-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin-top: 6px;
}

.dashboard-work-mode {
  margin: 0;
  font-size: 12px;
  line-height: 1.3;
  color: var(--color-text-subtle);
  text-align: center;
}
.dashboard-work-mode > span {
  color: var(--color-yellow-600);
  font-weight: 500;
}

.workday-card:has(.dashboard-work-mode) .workday-timer-box {
  min-height: 0;
  padding-top: 12px;
  padding-bottom: 8px;
}
.workday-card:has(.dashboard-work-mode) .profile-photo-wrapper {
  margin-bottom: 8px;
}
.workday-card:has(.dashboard-work-mode) .workday-timer-box > .my-12 {
  margin-top: 8px;
  margin-bottom: 8px;
}

.birthdays-card {
  min-height: 340px;
  display: flex;
  flex-direction: column;
}

.birthdays-card .birthdays-banner {
  position: absolute;
  top: -11px;
  right: 0;
  width: 160px;
  height: 100px;
  pointer-events: none;
  opacity: 0.9;
}

.birthdays-card .birthdays-banner img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.no-cake-card > div {
  transform: translateY(45px);
}

.dg-dropdown {
  position: relative;
  width: fit-content;
}

.dg-dropdown__trigger {
  cursor: pointer;
  max-width: 160px;
  background: transparent;
  font: inherit;
  transition: border-color 0.15s ease, background-color 0.15s ease;
}
.dg-dropdown__trigger .dg-dropdown__label {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.dg-dropdown__trigger .bi-chevron-down {
  transition: transform 0.15s ease, color 0.15s ease;
}
.dg-dropdown__trigger:hover {
  border-color: var(--color-primary-soft, #C7C0F5);
  background-color: var(--color-primary-softer, #F0EEFB);
}
.dg-dropdown__trigger:focus-visible {
  outline: none;
  border-color: var(--color-primary, #6F61EA);
}

.dg-dropdown .dg-dropdown__menu {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  left: auto;
  min-width: 160px;
  margin: 0;
  padding: 6px;
  list-style: none;
  background: var(--color-bg, #fff);
  border: 1px solid var(--color-border-soft, #D3DEEF);
  border-radius: 12px;
  box-shadow: 0 18px 44px rgba(52, 66, 95, 0.1);
  z-index: var(--z-dropdown);
}
.dg-dropdown .dg-dropdown__menu.show {
  display: block;
}
.dg-dropdown .dg-dropdown__menu.dg-dropdown__menu--align-left {
  left: 0;
  right: auto;
}
.dg-dropdown .dg-dropdown__menu li {
  margin: 0;
}
.dg-dropdown .dg-dropdown__menu li + li {
  margin-top: 2px;
}
.dg-dropdown .dg-dropdown__menu .dropdown-item {
  display: block;
  width: 100%;
  padding: 8px 12px;
  border: 0;
  background: transparent;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 500;
  line-height: normal;
  color: var(--color-text, #344054);
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
}
.dg-dropdown .dg-dropdown__menu .dropdown-item:hover {
  background: var(--color-bg-soft, #F0F3FD);
}
.dg-dropdown .dg-dropdown__menu .dropdown-item.is-selected {
  background: var(--color-primary-softer, #F0EEFB);
  color: var(--color-primary, #6F61EA);
}

.dg-dropdown:has(.dg-dropdown__menu.show) .dg-dropdown__trigger {
  border-color: var(--color-primary, #6F61EA);
  background-color: var(--color-primary-softer, #F0EEFB);
}
.dg-dropdown:has(.dg-dropdown__menu.show) .dg-dropdown__trigger .bi-chevron-down {
  transform: rotate(180deg);
  color: var(--color-primary, #6F61EA);
}

.no-celebration-container {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 150px;
}

.promo-card {
  background: linear-gradient(135deg, #6F61EA 0%, #6251E3 100%);
  border: none;
}
.promo-card .promo-thumb {
  flex-shrink: 0;
}

.news-card {
  display: flex;
  gap: 20px;
  padding: 16px 0;
}
.news-card:not(:last-child) {
  border-bottom: 1px solid var(--color-border-soft);
}
.news-card .news-thumb {
  flex-shrink: 0;
  align-self: flex-start;
  width: 140px;
  height: 100px;
  background-size: cover;
  background-position: center;
  overflow: hidden;
}
.news-card .news-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.news-card .news-body {
  flex: 1;
  min-width: 0;
  min-height: 100px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.news-list {
  min-height: 132px;
}

.dashboard-row {
  text-decoration: none;
  transition: background 0.15s;
}
.dashboard-row:hover {
  background: var(--color-bg-soft);
}
.dashboard-row:hover p {
  color: var(--color-primary);
}

.dashboard-chevron {
  display: inline-block;
  width: 5px;
  height: 8px;
  background-color: var(--color-primary);
  mask: url("/design/images/newDesign/chevron-right.svg") no-repeat center/contain;
  -webkit-mask: url("/design/images/newDesign/chevron-right.svg") no-repeat center/contain;
  flex-shrink: 0;
  position: relative;
  top: 1px;
  margin: 0 8px;
}

.action-row:hover .action-row-icon {
  background: var(--color-primary-soft);
}
.action-row:hover .action-row-type {
  color: var(--color-gray-700);
}

@media (max-width: 575.98px) {
  .action-row-type, .birthdays-showall__count {
    display: block;
    max-width: 90px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .birthdays-showall__count {
    max-width: 140px;
  }
}
.border-top {
  border-top: 1px solid var(--color-border-soft);
}

.border-bottom {
  border-bottom: 1px solid var(--color-border-soft);
}

.floating-chat-btn {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: none;
  background: var(--color-primary);
  color: var(--color-text-inverse);
  font-size: 24px;
  cursor: pointer;
  box-shadow: 0 8px 48px rgba(52, 66, 95, 0.2);
  overflow: hidden;
  flex-shrink: 0;
  transition: transform 0.2s ease, background-color 0.2s ease, opacity 0.2s ease, box-shadow 0.2s ease;
}
.floating-chat-btn i {
  display: inline-block;
  transition: transform 0.3s ease;
}
.floating-chat-btn:hover {
  background: var(--color-primary-hover);
  transform: translateY(-2px);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.12), 0 8px 24px rgba(0, 0, 0, 0.25);
}
.floating-chat-btn:hover i {
  transform: rotate(10deg) scale(1.1);
}

.scroll-top-btn {
  position: fixed;
  right: 28px;
  bottom: 138px;
  z-index: var(--z-popover, 1030);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid var(--color-border, #BCC9DF);
  background: var(--color-bg, #fff);
  color: var(--color-primary);
  box-shadow: 0 8px 24px rgba(52, 66, 95, 0.2);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px) scale(0.85);
  pointer-events: none;
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}
.scroll-top-btn i,
.scroll-top-btn .bi {
  font-size: 22px;
  line-height: 1;
}
.scroll-top-btn.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
.scroll-top-btn:hover {
  background: var(--color-primary-softer, #F0F3FD);
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(52, 66, 95, 0.28);
}

.scroll-top-btn:hover > .my_tip {
  display: block;
  left: auto;
  right: 0;
  transform: none;
}

.scroll-top-btn > .my_tip::after {
  left: auto;
  right: 18px;
}

.dashboard-motion-banner {
  width: 100%;
  height: 110px;
  background: #E4E4FC;
  border-radius: 22px;
  margin-bottom: 24px;
  overflow: hidden;
  position: relative;
}
.dashboard-motion-banner__inner {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 36px;
  height: 100%;
  padding: 0 27px;
}
.dashboard-motion-banner__text {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  z-index: 1;
  text-transform: uppercase;
}
.dashboard-motion-banner__title {
  font-size: 18px;
  font-weight: 700;
  color: #3b3b8e;
  line-height: 1.2;
}
.dashboard-motion-banner__subtitle {
  font-size: 13px;
  color: #6b6bbd;
  font-weight: 400;
}
.dashboard-motion-banner__shapes {
  position: absolute;
  right: 0;
  top: 0;
  width: 260px;
  height: 100%;
  pointer-events: none;
}
.dashboard-motion-banner__shapes .shape {
  position: absolute;
  border-radius: 50%;
  opacity: 0.35;
}
.dashboard-motion-banner__shapes .shape--1 {
  width: 90px;
  height: 90px;
  background: #a5a5f0;
  top: -20px;
  right: 60px;
  animation: banner-float 4s ease-in-out infinite;
}
.dashboard-motion-banner__shapes .shape--2 {
  width: 60px;
  height: 60px;
  background: #c4c4f8;
  bottom: -15px;
  right: 20px;
  animation: banner-float 5s ease-in-out infinite reverse;
}
.dashboard-motion-banner__shapes .shape--3 {
  width: 40px;
  height: 40px;
  background: #7b7be8;
  top: 10px;
  right: 150px;
  animation: banner-float 6s ease-in-out infinite 1s;
}
.dashboard-motion-banner__icon {
  position: relative;
  flex-shrink: 0;
  width: 96px;
  height: 96px;
  z-index: 1;
}

.dashboard-banner-close {
  position: absolute;
  top: 10px;
  right: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #3b3b8e;
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
  opacity: 0.55;
  transition: opacity 0.2s ease, background-color 0.2s ease;
  z-index: 3;
}
.dashboard-banner-close:hover, .dashboard-banner-close:focus-visible {
  opacity: 1;
  background: rgba(123, 123, 232, 0.18);
}

.dashboard-motion-banner__name {
  font-size: 18px;
  font-weight: 700;
  color: #3b3b8e;
  line-height: 1.2;
}

.dashboard-motion-banner.dashboard-banner-slider .dashboard-banner-track {
  position: relative;
  height: 100%;
}
.dashboard-motion-banner.dashboard-banner-slider .dashboard-banner-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transform: translateY(-100%);
  transition: transform 0.5s ease, opacity 0.5s ease;
  pointer-events: none;
}
.dashboard-motion-banner.dashboard-banner-slider .dashboard-banner-slide.is-active {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.dashboard-motion-banner.dashboard-banner-slider .dashboard-banner-slide.is-leaving {
  opacity: 0;
  transform: translateY(100%);
}
.dashboard-motion-banner.dashboard-banner-slider .dashboard-motion-banner__title {
  font-size: 15px;
  font-weight: 600;
}
.dashboard-motion-banner.dashboard-banner-slider .dashboard-banner-dots {
  position: absolute;
  right: 18px;
  bottom: 12px;
  display: flex;
  gap: 6px;
  z-index: 2;
}
.dashboard-motion-banner.dashboard-banner-slider .dashboard-banner-dot {
  position: relative;
  width: 18px;
  height: 6px;
  border-radius: 3px;
  background: #7b7be8;
  opacity: 0.4;
  cursor: pointer;
  transition: opacity 0.2s ease, width 0.2s ease;
}
.dashboard-motion-banner.dashboard-banner-slider .dashboard-banner-dot::after {
  content: "";
  position: absolute;
  inset: -9px -3px;
}
.dashboard-motion-banner.dashboard-banner-slider .dashboard-banner-dot.is-active {
  opacity: 1;
  width: 32px;
}

@media (prefers-reduced-motion: reduce) {
  .dashboard-motion-banner.dashboard-banner-slider .dashboard-banner-slide {
    transition: none;
  }
}
@media (max-width: 768px) {
  .dashboard-motion-banner {
    height: 120px;
    border-radius: 18px;
    margin-bottom: 16px;
  }
  .dashboard-motion-banner__inner {
    padding: 0 16px;
  }
  .dashboard-motion-banner__text {
    max-width: none;
  }
  .dashboard-motion-banner__name, .dashboard-motion-banner__title {
    font-size: 14px;
  }
  .dashboard-motion-banner__subtitle {
    font-size: 12px;
  }
  .dashboard-motion-banner__icon {
    width: 68px;
    height: 68px;
  }
  .dashboard-motion-banner__shapes {
    width: 160px;
  }
  .dashboard-motion-banner__shapes .shape--3 {
    display: none;
  }
  .dashboard-motion-banner.dashboard-banner-slider .dashboard-motion-banner__title {
    font-size: 13px;
  }
  .dashboard-motion-banner.dashboard-banner-slider .dashboard-banner-dots {
    right: 14px;
    bottom: 10px;
  }
  .dashboard-banner-close {
    top: 8px;
    right: 10px;
    width: 24px;
    height: 24px;
  }
}
@media (max-width: 480px) {
  .dashboard-motion-banner__text {
    max-width: none;
  }
  .dashboard-motion-banner__icon {
    width: 56px;
    height: 56px;
  }
}
@keyframes banner-float {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-8px);
  }
}
.vacancy-row:hover .vacancy-badge {
  background: #E4E5FF;
  color: #6251E3;
}

.vacancy-badge {
  flex-shrink: 0;
  width: 46px;
  height: 46px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: #EAECFF;
  color: #6F61EA;
  transition: background 0.15s, color 0.15s;
}
.vacancy-badge i {
  font-size: 20px;
}

.offers-widget {
  background: #E4E5FF;
  padding: 24px;
}
.offers-widget .offers-track {
  position: relative;
  height: 163px;
}
.offers-widget .offers-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.6s ease;
}
.offers-widget .offers-slide.is-active {
  opacity: 1;
  pointer-events: auto;
}
.offers-widget .offers-row {
  display: flex;
  align-items: center;
  gap: 24px;
  height: 163px;
}
.offers-widget .offers-thumb {
  flex-shrink: 0;
  width: 162px;
  height: 163px;
  border-radius: 16px;
  overflow: hidden;
  background: #EBF2FA;
}
.offers-widget .offers-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: bottom;
  display: block;
}
.offers-widget .offers-body {
  flex: 1;
  min-width: 0;
  align-self: stretch;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.offers-widget .offers-top {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
  min-width: 0;
}
.offers-widget .offers-segments {
  display: flex;
  gap: 4px;
  width: 100%;
}
.offers-widget .offers-segment {
  flex: 1;
  height: 2px;
  border-radius: 20px;
  background: #BCC9DF;
  cursor: pointer;
}
.offers-widget .offers-segment.is-active {
  background: #6F61EA;
}
.offers-widget .offers-title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  text-transform: uppercase;
  color: #222A39;
}
.offers-widget .offers-subtitle {
  font-size: 14px;
  color: #3D4451;
}
.offers-widget .offers-details {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 32px;
  padding: 0 16px;
  border-radius: 24px;
  background: #6F61EA;
  color: #FFFFFF;
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  text-decoration: none;
}
.offers-widget .offers-details i {
  font-size: 20px;
}
.offers-widget .offers-details:hover {
  background: #6251E3;
}

.passrestore-widget.is-busy {
  opacity: 0.6;
  pointer-events: none;
}

.passrestore-action {
  width: 26px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 24px;
  cursor: pointer;
  font-size: 14px;
}
.passrestore-action--reject {
  background: #FFE4F0;
  color: #FA3E93;
}
.passrestore-action--confirm {
  background: #D8F8EE;
  color: #0C9B99;
}

.research-banner {
  display: block;
  width: 100%;
  aspect-ratio: 5/3;
  border-radius: 14px;
  overflow: hidden;
  background: #EAECFF;
  margin-bottom: 12px;
  flex-shrink: 0;
}
.research-banner img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.research-link-row {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 0;
}
.research-link-row:not(:last-child) {
  border-bottom: 1px solid var(--color-border-soft);
}

.research-link-thumb {
  flex-shrink: 0;
  width: 64px;
  aspect-ratio: 4/3;
  border-radius: 10px;
  overflow: hidden;
  background: #EAECFF;
  display: flex;
  align-items: center;
  justify-content: center;
}
.research-link-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.research-link-thumb i {
  font-size: 20px;
  color: var(--color-primary);
}

.research-link-hidden {
  display: none;
}

@media (max-width: 768px) {
  .app-main {
    padding: 0px;
  }
}
@media (max-width: 575.98px) {
  .x-tabs__bar {
    flex-direction: column-reverse;
    align-items: stretch;
  }
  .x-tabs__bar > div:last-child {
    margin-left: auto;
  }
  .app-shell:not(.is-dashboard) {
    padding: 0;
  }
  .app-shell:not(.is-dashboard) .app-header {
    border-radius: 0;
  }
  .page_content:not(.is-dashboard) {
    padding-top: 0;
  }
  .offers-widget .offers-details {
    padding: 0px 5px;
  }
  .rec-vacancies-tab .card {
    padding: 7px;
  }
  footer {
    margin-top: 30px;
    padding-bottom: 100px;
  }
}
.spinner {
  display: inline-block;
  width: 1em;
  height: 1em;
  border: 0.12em solid var(--color-primary-softer, #EAECFF);
  border-top-color: var(--color-primary, #6F61EA);
  border-radius: 9999px;
  animation: spinner-spin 0.65s linear infinite;
  flex-shrink: 0;
}

@keyframes spinner-spin {
  to {
    transform: rotate(360deg);
  }
}
.cal-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 0px;
}
.cal-nav__title {
  font-size: 18px;
  font-weight: 600;
  color: var(--color-text);
  margin: 0;
}
.cal-nav__btns {
  display: flex;
  gap: 8px;
}
.cal-nav__actions {
  display: flex;
  align-items: center;
  gap: 12px;
}
.cal-nav__views {
  display: flex;
  gap: 4px;
  padding: 3px;
  background: var(--color-bg-soft);
  border-radius: 9999px;
}
.cal-nav__views .btn.is-active {
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
}
.cal-nav__views .btn.is-active:hover {
  background: var(--color-primary);
}

.cal-grid-wrap {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--color-border, #BCC9DF) transparent;
}
.cal-grid-wrap::-webkit-scrollbar {
  height: 6px;
}
.cal-grid-wrap::-webkit-scrollbar-track {
  background: transparent;
}
.cal-grid-wrap::-webkit-scrollbar-thumb {
  background: #BCC9DF;
  border-radius: 9999px;
}
.cal-grid-wrap::-webkit-scrollbar-thumb:hover {
  background: #A5B3C9;
}
@media (max-width: 575.98px) {
  .cal-grid-wrap {
    overflow-x: scroll;
  }
}

.cal-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(110px, 1fr));
  border-top: 1px solid var(--color-border-soft);
  border-left: 1px solid var(--color-border-soft);
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  min-width: 770px;
}

.cal-day-header {
  border-right: 1px solid var(--color-border-soft);
  border-bottom: 1px solid var(--color-border-soft);
  padding: 10px 12px;
  font-size: 11px;
  font-weight: 600;
  color: var(--color-text-muted);
  text-align: center;
  background: var(--color-bg-soft);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.cal-day-header:first-child {
  border-top-left-radius: 8px;
}
.cal-day-header:nth-child(7) {
  border-top-right-radius: 8px;
}

.cal-day {
  position: relative;
  border-right: 1px solid var(--color-border-soft);
  border-bottom: 1px solid var(--color-border-soft);
  min-width: 0;
  min-height: 110px;
  padding: 6px 8px 8px;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.cal-day:hover {
  z-index: 10;
}
.cal-day--faded {
  background: #f4f5fa;
}
.cal-day--faded .cal-day__num {
  color: var(--color-text-subtle);
  opacity: 0.5;
}
.cal-day--weekend {
  background: #e7edff;
}
.cal-day--holiday {
  background: #dce5fe;
}
.cal-day--today .cal-day__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 23px;
  height: 23px;
  padding: 0 4px;
  border-radius: 9999px;
  background: var(--color-primary);
  color: #fff;
  align-self: flex-start;
}
.cal-day__num {
  display: block;
  text-align: left;
  font-size: 16px;
  font-weight: bold;
  color: var(--color-text-muted);
  line-height: 1;
  margin-bottom: 2px;
  flex-shrink: 0;
  height: 23px;
}
.cal-day__events {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.cal-day__events .my_tooltip {
  width: 100%;
}
.cal-day__events .my_tooltip > span {
  width: 100%;
  display: block;
}

.cal-event {
  --event-color: var(--color-primary);
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 3px 6px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--event-color) 7%, #fff);
  cursor: pointer;
  transition: background 0.15s;
  width: 100%;
}
.cal-event:hover {
  background: color-mix(in srgb, var(--event-color) 10%, #fff);
}
.cal-event__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  overflow: hidden;
  background: color-mix(in srgb, var(--event-color) 25%, #fff);
  color: var(--event-color);
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  text-transform: uppercase;
}
.cal-event__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cal-event__avatar .avatar-initials {
  width: 100%;
  height: 100%;
  font-size: 13px;
}
.cal-event__body {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1;
}
.cal-event__worker {
  display: block;
  font-size: 11px;
  font-weight: 500;
  color: var(--color-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cal-event__type {
  display: block;
  font-size: 10px;
  color: var(--event-color);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cal-event__icon {
  flex-shrink: 0;
  font-size: 12px;
  line-height: 1;
}
.cal-event--public {
  border-left-color: var(--event-color);
  background: color-mix(in srgb, var(--event-color) 7%, #fff);
}
.cal-event--public:hover {
  background: color-mix(in srgb, var(--event-color) 12%, #fff);
}
.cal-event--public .cal-event__icon,
.cal-event--public .cal-event__worker {
  color: var(--event-color);
}

.cal-event--compact {
  gap: 4px;
  padding: 1px 5px;
  border-radius: 4px;
}
.cal-event--compact .cal-event__worker {
  font-size: 12px;
  font-weight: 500;
}
.cal-event--compact {
  border-left: 3px solid var(--event-color);
}

.cal-months {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 20px;
}
@media (max-width: 767.98px) {
  .cal-months {
    grid-template-columns: minmax(0, 1fr);
  }
}
.cal-months__item {
  display: flex;
  flex-direction: column;
}
.cal-months__item .cal-grid-wrap {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.cal-months__title {
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text);
  margin-bottom: 8px;
  text-transform: capitalize;
}

.cal-grid--compact {
  grid-template-columns: repeat(7, minmax(0, 1fr));
  min-width: 420px;
  flex: 1;
  grid-template-rows: auto;
  grid-auto-rows: minmax(min-content, 1fr);
}
.cal-grid--compact .cal-day-header {
  padding: 6px 4px;
  font-size: 10px;
}
.cal-grid--compact .cal-day {
  min-height: 76px;
  padding: 4px 4px 6px;
  gap: 2px;
}
.cal-grid--compact .cal-day__num {
  font-size: 12px;
  height: 18px;
}
.cal-grid--compact .cal-day--today .cal-day__num {
  width: 18px;
  height: 18px;
}

.cal-emp-wrap {
  border: 1px solid var(--color-border-soft);
  border-radius: 8px;
  overflow: hidden;
}

.cal-emp {
  --emp-month-h: 28px;
  --emp-day-h: 46px;
  --emp-lane-h: 34px;
  --emp-lane-gap: 4px;
  --emp-track-pad: 6px;
  --emp-row-min: 60px;
  --lanes: 1;
  display: flex;
  align-items: flex-start;
}
.cal-emp__names {
  flex: 0 0 220px;
  width: 220px;
  border-right: 1px solid var(--color-border-soft);
}
.cal-emp__scroll {
  flex: 1;
  min-width: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--color-border, #BCC9DF) transparent;
}
.cal-emp__scroll::-webkit-scrollbar {
  height: 6px;
}
.cal-emp__scroll::-webkit-scrollbar-track {
  background: transparent;
}
.cal-emp__scroll::-webkit-scrollbar-thumb {
  background: #BCC9DF;
  border-radius: 9999px;
}
.cal-emp__scroll::-webkit-scrollbar-thumb:hover {
  background: #A5B3C9;
}
.cal-emp__head, .cal-emp__track {
  width: var(--emp-track-w);
}
.cal-emp__head {
  background: var(--color-bg-soft);
  border-bottom: 1px solid var(--color-border-soft);
}
.cal-emp__months {
  display: grid;
  box-sizing: border-box;
  height: var(--emp-month-h);
  border-bottom: 1px solid var(--color-border-soft);
}
.cal-emp__monthcol {
  display: flex;
  align-items: center;
  justify-content: center;
  border-right: 1px solid var(--color-border-soft);
}
.cal-emp__monthcol:last-child {
  border-right: 0;
}
.cal-emp__monthlabel {
  position: sticky;
  left: 8px;
  font-size: 11px;
  font-weight: bold;
  text-transform: uppercase;
  color: var(--color-text-muted);
}
.cal-emp__days {
  display: grid;
  box-sizing: border-box;
  height: var(--emp-day-h);
}
.cal-emp__daycol {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-right: 1px solid var(--color-border-soft);
  font-size: 11px;
  color: var(--color-text-muted);
}
.cal-emp__daycol--weekend {
  background: #e7edff;
}
.cal-emp__daycol--weekend-last {
  border-right-color: #adc6ed;
}
.cal-emp__daycol--weekstart:first-child {
  border-left: 1px solid #adc6ed;
}
.cal-emp__daycol--today .cal-emp__daynum {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 9999px;
  background: var(--color-primary);
  color: #fff;
}
.cal-emp__daynum {
  font-weight: bold;
  color: var(--color-text);
  line-height: 1.4;
}
.cal-emp__dayname {
  font-size: 10px;
  text-transform: uppercase;
}
.cal-emp__name, .cal-emp__track {
  box-sizing: border-box;
  height: max(var(--emp-row-min), var(--lanes) * var(--emp-lane-h) + (var(--lanes) - 1) * var(--emp-lane-gap) + 2 * var(--emp-track-pad) + 1px);
  border-bottom: 1px solid var(--color-border-soft);
}
.cal-emp__name:last-child, .cal-emp__track:last-child {
  border-bottom: 0;
}
.cal-emp__name {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  background: #fff;
}
.cal-emp__name--head {
  height: calc(var(--emp-month-h) + var(--emp-day-h) + 1px);
  padding: 0;
  background: var(--color-bg-soft);
}
.cal-emp__name:not(.cal-emp__name--head):hover {
  background: var(--color-bg-soft);
}
.cal-emp__avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--color-bg-soft);
  font-size: 13px;
  font-weight: 600;
}
.cal-emp__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cal-emp__avatar .avatar-initials {
  width: 100%;
  height: 100%;
  font-size: 13px;
}
.cal-emp__meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.cal-emp__worker {
  font-size: 13px;
  font-weight: 600;
  color: var(--color-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cal-emp__org {
  font-size: 11px;
  color: var(--color-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cal-emp__track {
  display: grid;
  grid-auto-rows: var(--emp-lane-h);
  row-gap: var(--emp-lane-gap);
  padding: var(--emp-track-pad) 0;
  background-image: linear-gradient(to right, #adc6ed 1px, transparent 1px), linear-gradient(to right, var(--color-border-soft) 1px, transparent 1px);
  background-position-x: var(--week-x), -1px;
}
.cal-emp__track:hover {
  background-color: var(--color-bg-soft);
}
.cal-emp__empty {
  padding: 20px;
  text-align: center;
  color: var(--color-text-muted);
  font-size: 13px;
}

.cal-emp-slot {
  min-width: 0;
  display: block;
}
.cal-emp-slot > span {
  display: flex;
  width: 100%;
  height: 100%;
}

.cal-emp-bar {
  display: flex;
  align-items: center;
  gap: 2px;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 100%;
  padding: 6px 8px;
  border-radius: 20px;
  background: color-mix(in srgb, var(--event-color, var(--color-primary)) 14%, #fff);
  color: var(--event-color, var(--color-primary));
  cursor: pointer;
  overflow: hidden;
}
.cal-emp-bar:hover {
  background: color-mix(in srgb, var(--event-color, var(--color-primary)) 22%, #fff);
}
.cal-emp-bar__label {
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cal-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  padding: 12px 20px;
  border-top: 1px solid var(--color-border-soft);
  font-size: 13px;
  color: var(--color-text-muted);
}
.cal-summary strong {
  color: var(--color-text);
}

.list_header, .list_header_x {
  color: var(--GRAY-Gray-500, #758199);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

.table_header_sort_link {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  width: 100%;
}

.table_header_sort_icon {
  font-size: 18px;
  opacity: 0;
  transition: opacity 0.1s ease-in-out;
}

.table_header_sort_icon-active {
  display: block;
  color: var(--color-purple-800);
  font-weight: 700;
  opacity: 1;
}

.table_header_sort_link:hover .table_header_sort_icon {
  opacity: 1;
}

.table_header_title {
  text-align: left;
}

.rownum-check {
  position: relative;
}
.rownum-check__num {
  display: inline-block;
  min-width: 17px;
  text-align: center;
}
.rownum-check__box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  visibility: hidden;
}

tr:hover .rownum-check__num,
.rownum-check:has(input:checked) .rownum-check__num,
table:has(th .rownum-check__box:hover) .rownum-check__num {
  visibility: hidden;
}

tr:hover .rownum-check__box,
.rownum-check:has(input:checked) .rownum-check__box,
table:has(th .rownum-check__box:hover) .rownum-check__box {
  visibility: visible;
}

@media (max-width: 575.98px) {
  thead:first-of-type .rownum-check__num {
    visibility: hidden;
  }
  thead:first-of-type .rownum-check__box {
    visibility: visible;
  }
}
.approvein-must {
  position: relative;
  align-items: center;
  margin: 0;
}
.approvein-must .input-group-addon {
  position: absolute;
  top: -17px;
  left: -3px;
  z-index: 3;
  padding: 0;
  border: 0;
  background: transparent;
  pointer-events: none;
}
.approvein-must .form-control {
  padding-left: 12px;
}

td .radiodiv {
  background-color: #e8ecfa;
}

.menurole_no_checkbox > label::before {
  position: absolute;
  content: "- ";
  color: black;
  width: unset;
  height: unset;
  left: unset;
  border-radius: unset;
  margin-left: -1em;
  border: none;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  cursor: default;
  text-align: center;
  font-size: 1em;
  display: inline-flex;
  flex-direction: column;
  align-content: center;
  justify-content: center;
  line-height: 1;
}

.menurole_no_checkbox {
  padding-top: 0 !important;
  padding-bottom: 5px;
}

.menurole_no_checkbox > label {
  cursor: default;
  padding-left: 0;
  margin-left: 0 !important;
  position: relative;
}

.global-search {
  position: relative;
}

.global-search-panel {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  z-index: 1050;
  max-height: 60vh;
  overflow-y: auto;
  padding: 8px;
  background: var(--color-gray-0, #ffffff);
  border: 1px solid var(--color-gray-200, #d3deef);
  border-radius: 16px;
  box-shadow: 0 12px 32px rgba(20, 29, 45, 0.12);
}
.global-search-panel[hidden] {
  display: none;
}

.global-search-group + .global-search-group {
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px solid var(--color-gray-100, #f0f3fd);
}

.global-search-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 10px;
  color: var(--color-gray-800, #222a39);
  cursor: pointer;
  transition: background-color 0.12s ease;
}
.global-search-item:hover, .global-search-item.is-active {
  background: var(--color-purple-50, #f3f5ff);
}

.global-search-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  flex-shrink: 0;
  color: var(--color-purple-800, #6f61ea);
  font-size: 16px;
}

.global-search-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.global-search-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.global-search-subtitle {
  margin-top: 2px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.3;
  color: var(--color-gray-500, #758199);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.global-search-component {
  font-weight: 600;
}

.global-search-action {
  padding-left: 28px;
  font-weight: 400;
  color: var(--color-gray-600, #596476);
}

.global-search-empty {
  padding: 14px 10px;
  text-align: center;
  color: var(--color-gray-500, #758199);
}

.global-search-manual {
  align-items: flex-start;
}
.global-search-manual .global-search-icon {
  margin-top: 2px;
}

.global-search-snippet {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-height: 2.8em;
  white-space: normal;
  overflow-wrap: anywhere;
  margin-top: 2px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  color: var(--color-gray-500, #758199);
}
.global-search-snippet mark {
  padding: 0 1px;
  border-radius: 2px;
  background: var(--color-yellow-100, #fef7dc);
  color: inherit;
}

.notif-center, .ChatIcon {
  position: relative;
}
.notif-center .notif-badge, .notif-center .chat-badge, .ChatIcon .notif-badge, .ChatIcon .chat-badge {
  position: absolute;
  top: -7px;
  right: -4px;
  min-width: 20px;
  width: auto;
  height: 20px;
  max-width: 25px;
  padding: 0 2px;
  margin: 0;
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  line-height: 1;
  border-radius: 16px;
}
.notif-center .notif-badge[hidden], .notif-center .chat-badge[hidden], .ChatIcon .notif-badge[hidden], .ChatIcon .chat-badge[hidden] {
  display: none;
}

.notif-panel {
  position: absolute;
  top: calc(100% + 11px);
  right: -25px;
  width: 360px;
  max-width: calc(100vw - 32px);
  display: flex;
  flex-direction: column;
  background: var(--color-bg);
  border-radius: 16px;
  padding: 8px;
  z-index: var(--z-dropdown);
  box-shadow: 0 8px 48px 0 rgba(52, 66, 95, 0.2);
}
.notif-panel[hidden] {
  display: none;
}

.notif-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 12px;
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text);
}

.notif-panel-btn {
  font-size: 11.5px;
}
.notif-panel-btn:hover {
  text-decoration: underline;
  text-decoration-skip-ink: none;
  text-underline-offset: 3px;
}

.notif-panel-list {
  display: flex;
  flex-direction: column;
  max-height: 60vh;
  overflow-y: auto;
}
.notif-panel-list[hidden] {
  display: none;
}

.notif-item {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 8px;
  cursor: pointer;
}
.notif-item:hover {
  background: var(--color-bg-soft);
}
.notif-item.is-unread .notif-item-title {
  font-weight: 600;
}
.notif-item.is-unread::before {
  content: "";
  position: absolute;
  top: 16px;
  left: 3px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--color-danger);
}

.notif-item-main {
  flex: 1;
  min-width: 0;
}

.notif-item-title {
  font-size: 13px;
  color: var(--color-text);
  margin-bottom: 2px;
}

.notif-item-body {
  font-size: 12px;
  color: var(--color-text-muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.notif-item.is-expanded .notif-item-body {
  display: block;
  overflow: visible;
}

.notif-item-date {
  margin-top: 4px;
  font-size: 11px;
  color: var(--color-text-subtle);
}

.notif-kebab {
  flex-shrink: 0;
  border: 0;
  background: transparent;
  padding: 4px;
  line-height: 1;
  color: var(--color-text-muted);
  cursor: pointer;
  border-radius: 8px;
}
.notif-kebab:hover {
  background: var(--color-bg-soft);
  color: var(--color-text);
}

.notif-kebab-menu {
  display: none;
  width: 200px;
  padding: 4px;
  background: var(--color-bg);
  border-radius: 12px;
  box-shadow: 0 8px 48px 0 rgba(52, 66, 95, 0.2);
  z-index: var(--z-popover);
}
.notif-kebab-menu[data-show] {
  display: block;
}
.notif-kebab-menu button {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  text-align: left;
  border: 0;
  background: transparent;
  padding: 6px 10px;
  font-size: 11px;
  color: var(--color-text);
  border-radius: 8px;
  cursor: pointer;
}
.notif-kebab-menu button:hover {
  background: var(--color-bg-soft);
}
.notif-kebab-menu button i {
  font-size: 13px;
  color: var(--color-text-muted);
}

.notif-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.notif-more {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px;
}

.notif-panel-empty {
  padding: 24px 12px;
  text-align: center;
  font-size: 13px;
  color: var(--color-text-muted);
}
.notif-panel-empty[hidden] {
  display: none;
}

.notif-panel-all {
  margin-top: 4px;
  padding: 10px 12px;
  text-align: center;
  font-size: 13px;
  color: var(--color-text-muted);
  text-decoration: none;
  border-radius: 8px;
}
.notif-panel-all:hover {
  background: var(--color-bg-soft);
  color: var(--color-text);
}

.mobile-tabbar {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1100;
  align-items: stretch;
  padding: 8px 16px max(8px, env(safe-area-inset-bottom));
  background: var(--color-bg, #FFFFFF);
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
  box-shadow: 0 8px 48px rgba(52, 66, 95, 0.2);
}
@media (max-width: 991.98px) {
  .mobile-tabbar {
    display: flex;
  }
}

@media (max-width: 991.98px) {
  .app-main {
    padding-bottom: calc(80px + env(safe-area-inset-bottom));
  }
}
.mobile-tab {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.mobile-tab:hover, .mobile-tab:focus, .mobile-tab:focus-visible {
  text-decoration: none;
  outline: none;
}

.mobile-tab-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 4px 10px;
  border-radius: 16px;
  transition: background-color 0.15s ease;
}
.mobile-tab-icon i {
  font-size: 22px;
  line-height: 1;
  color: #596476;
  transition: color 0.15s ease;
}

.mobile-tab-label {
  font-family: "Poppins", "Noto Sans Georgian", system-ui, -apple-system, sans-serif;
  font-size: 12px;
  font-weight: 500;
  line-height: 20px;
  color: #596476;
  transition: color 0.15s ease;
}

.mobile-tab.is-active .mobile-tab-icon {
  background: #EAECFF;
}
.mobile-tab.is-active .mobile-tab-icon i {
  color: #6F61EA;
}
.mobile-tab.is-active .mobile-tab-label {
  color: #6F61EA;
}

.app-sidebar-logo {
  display: none;
  align-items: center;
}
.app-sidebar-logo img {
  max-height: 50px;
  width: auto;
}

.mobile-menu-close {
  display: none;
  margin-left: auto;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 9999px;
  background: none;
  cursor: pointer;
  color: #596476;
}
.mobile-menu-close i {
  font-size: 18px;
  line-height: 1;
}
.mobile-menu-close:hover, .mobile-menu-close:focus-visible {
  background: #EAECFF;
  color: #6F61EA;
  outline: none;
}

@media (max-width: 991.98px) {
  .is-mobile-menu-open {
    overflow: hidden;
  }
  .is-mobile-menu-open .app-sidebar {
    display: flex;
    position: fixed;
    inset: 0;
    z-index: 9999999;
    width: 100%;
    max-width: none;
    max-height: none;
    flex-basis: auto;
    margin: 0;
    padding: 0;
    border-radius: 0;
    overflow-y: auto;
    background: var(--color-bg, #FFFFFF);
  }
  .is-mobile-menu-open .app-sidebar-header {
    position: sticky;
    top: 0;
    z-index: 1;
    gap: 12px;
    padding: 16px;
    background: var(--color-bg, #FFFFFF);
  }
  .is-mobile-menu-open .app-sidebar-logo {
    display: flex;
  }
  .is-mobile-menu-open .app-sidebar-toggle {
    display: none;
  }
  .is-mobile-menu-open .mobile-menu-close {
    display: flex;
  }
  .is-mobile-menu-open .app-sidebar-nav a {
    height: auto;
    min-height: 44px;
    padding: 10px 12px;
    font-size: 16px;
    font-weight: 400;
  }
  .is-mobile-menu-open .app-sidebar-nav .parent-bi {
    gap: 8px;
  }
  .is-mobile-menu-open .app-sidebar-nav .parent-bi > i,
  .is-mobile-menu-open .app-sidebar-nav .parent-bi > .bi {
    width: 24px;
    font-size: 22px;
  }
  .is-mobile-menu-open .app-sidebar-nav .menu_title {
    max-width: none;
  }
  .is-mobile-menu-open .app-sidebar-nav .menu_item.has-submenu > a::after {
    content: "\f285";
    font-family: "bootstrap-icons";
    font-size: 16px;
    line-height: 1;
    margin-left: 8px;
    color: #596476;
    transition: transform 0.2s ease;
  }
  .is-mobile-menu-open .app-sidebar-nav .menu_item.mobile-open > a::after {
    transform: rotate(90deg);
  }
  .is-mobile-menu-open .app-sidebar-nav .submenu,
  .is-mobile-menu-open .app-sidebar-nav .submenu.is-open {
    position: static;
    display: none;
    margin: 2px 0 6px;
    padding: 0;
    min-width: 0;
    background: transparent;
    box-shadow: none;
    border-radius: 0;
  }
  .is-mobile-menu-open .app-sidebar-nav .menu_item.mobile-open > .submenu {
    display: flex;
  }
  .is-mobile-menu-open .app-sidebar-nav .menu_group_items {
    padding-left: 32px;
  }
  .is-mobile-menu-open .app-sidebar-nav .submenu li {
    padding: 0;
  }
  .is-mobile-menu-open .app-sidebar-nav .submenu_item > .submenu_a {
    height: auto;
    min-height: 44px;
    padding: 10px 12px 10px 46px;
    font-size: 16px;
    font-weight: 400;
    border-radius: 12px;
    opacity: 1;
    white-space: normal;
  }
}
.toolbar-float {
  position: fixed;
  left: 50%;
  bottom: 24px;
  z-index: 1200;
  display: flex;
  align-items: center;
  gap: 16px;
  max-width: calc(100vw - 24px);
  padding: 4px 16px;
  background: var(--color-bg, #FFFFFF);
  border: 1px solid var(--color-border-soft, #D3DEEF);
  border-radius: 16px;
  box-shadow: 0 4px 16px rgba(52, 66, 95, 0.16), 0 16px 48px rgba(52, 66, 95, 0.28);
  transform: translateX(-50%) translateY(calc(100% + 24px));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.3s ease, visibility 0.3s;
}
.toolbar-float.is-visible {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.toolbar-float__count {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}

.toolbar-float__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 4px;
  border-radius: 9999px;
  background: #6251E3;
  color: #FFFFFF;
  font-size: 14px;
  line-height: 1;
}

.toolbar-float__count-label {
  color: #222A39;
  font-size: 12px;
  white-space: nowrap;
}

.toolbar-float__divider {
  flex: 0 0 auto;
  align-self: center;
  width: 1px;
  height: 36px;
  background: var(--color-border-soft, #D3DEEF);
}

.toolbar-float__actions {
  display: flex;
  align-items: stretch;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.toolbar-float__actions .toolbar_item {
  display: flex;
  flex: 0 0 auto;
  width: auto;
}
.toolbar-float__actions .toolbar_divider {
  display: none;
}

.toolbar-float .toolbar_btn {
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  height: auto;
  min-width: 56px;
  max-width: 240px;
  padding: 8px;
  border-radius: 8px;
  background-color: transparent;
  color: #222A39;
  white-space: normal;
}
.toolbar-float .toolbar_btn .toolbar_btn_icon {
  font-size: 20px;
}
.toolbar-float .toolbar_btn .toolbar_btn_label_text {
  font-size: 12px;
  white-space: normal;
  line-height: 1.25;
  text-align: center;
}
.toolbar-float .toolbar_btn .toolbar_btn_caret {
  display: none;
}
.toolbar-float .toolbar_btn:hover {
  background-color: #F3F5FF;
  color: #6F61EA;
}

.toolbar-float .toolbar_item .toolbar_btn {
  flex-direction: column;
  gap: 6px;
}
.toolbar-float .toolbar_item .toolbar_btn .toolbar_btn_label {
  display: block;
  max-width: none;
  overflow: visible;
  white-space: normal;
  margin: 0;
  text-align: center;
}

.toolbar-float__close {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #596476;
  cursor: pointer;
  transition: background-color 0.12s linear;
}
.toolbar-float__close i {
  font-size: 18px;
  line-height: 0;
}
.toolbar-float__close:hover {
  background: #F8F9FC;
}

.toolbar-float .multi_href_button,
.toolbar-float .btn-group {
  position: relative;
}
.toolbar-float .dropdown-menu,
.toolbar-float .multi_href_button_elements {
  position: absolute;
  top: auto;
  bottom: calc(100% + 8px);
  left: 50%;
  right: auto;
  transform: translateX(-50%);
  min-width: 200px;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--color-border-soft, #D3DEEF);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(52, 66, 95, 0.2);
  z-index: 50;
}
.toolbar-float .dropdown-menu .dropdown-item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin: 0;
  padding: 8px 12px;
  border-radius: 8px;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 500;
  line-height: normal;
  color: #222A39;
  white-space: nowrap;
  cursor: pointer;
}
.toolbar-float .dropdown-menu .dropdown-item + .dropdown-item {
  margin-top: 2px;
}
.toolbar-float .dropdown-menu .dropdown-item:hover, .toolbar-float .dropdown-menu .dropdown-item.is-selected {
  background: #F8F9FC;
  color: #6F61EA;
}

.toolbar-float-menu {
  z-index: 1400;
  min-width: 200px;
  padding: 6px;
  background: #fff;
  border: 1px solid var(--color-border-soft, #D3DEEF);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(52, 66, 95, 0.28);
}
.toolbar-float-menu .dropdown-item,
.toolbar-float-menu .multi_href_button_element button,
.toolbar-float-menu .multi_href_button_element a,
.toolbar-float-menu .multi_href_button_element .href_multi_toolbar_link {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin: 0;
  padding: 8px 12px;
  border-radius: 8px;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 500;
  line-height: normal;
  color: #222A39;
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
}
.toolbar-float-menu .dropdown-item + .dropdown-item,
.toolbar-float-menu .multi_href_button_element + .multi_href_button_element {
  margin-top: 2px;
}
.toolbar-float-menu .dropdown-item:hover,
.toolbar-float-menu .dropdown-item.is-selected,
.toolbar-float-menu .multi_href_button_element button:hover,
.toolbar-float-menu .multi_href_button_element a:hover {
  background: #F8F9FC;
  color: #6F61EA;
}

@media (max-width: 991.98px) {
  .toolbar-float {
    left: 12px;
    right: 12px;
    bottom: calc(88px + env(safe-area-inset-bottom));
    max-width: none;
    gap: 8px;
    justify-content: space-between;
    transform: translateY(calc(100% + 96px));
  }
  .toolbar-float.is-visible {
    transform: translateY(0);
  }
}
@media (max-width: 767.98px) {
  .toolbar-float__count-label {
    display: none;
  }
}
.toolbar_more_toggle {
  display: none;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  order: 10000;
  width: 40px;
  height: 33px;
  padding: 0;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: var(--PURPLE-Purple-800, #6F61EA);
  cursor: pointer;
  transition: background-color 0.12s linear;
}
.toolbar_more_toggle i {
  font-size: 20px;
  line-height: 0;
}
.toolbar_more_toggle.is-expanded {
  background: var(--color-primary-soft, #E4E5FF);
}
@media (max-width: 767.98px) {
  .toolbar_more_toggle:not(.is-hidden) {
    display: inline-flex;
  }
}

.toolbar_more {
  display: none;
  flex: 0 0 100%;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 8px;
}
@media (max-width: 767.98px) {
  .toolbar_more:not(.is-hidden) {
    display: flex;
  }
}
.toolbar_more .toolbar_item {
  flex: 0 0 auto;
  width: auto;
}
.toolbar_more .toolbar_divider {
  display: none;
}

@media (max-width: 767.98px) {
  .dv-page-header .dv-page-actions {
    flex: 1 1 100%;
    max-width: 100%;
    flex-wrap: nowrap;
    overflow: hidden;
    justify-content: flex-start;
  }
  .dv-page-header .dv-page-actions::before,
  .page_title > .toolbar::before {
    content: "";
    margin-left: auto;
  }
  .page_title > .toolbar .toolbar_item .toolbar_btn_label,
  .page_title > .toolbar .toolbar_item .toolbar_btn_caret,
  .dv-page-actions .toolbar_item .toolbar_btn_label,
  .dv-page-actions .toolbar_item .toolbar_btn_caret {
    display: none;
  }
  .page_title > .toolbar .toolbar_btn,
  .dv-page-actions .toolbar_btn {
    gap: 0;
  }
  .toolbar_more .toolbar_item .toolbar_btn {
    flex-direction: row;
    gap: 8px;
  }
  .toolbar_more .toolbar_item .toolbar_btn_label {
    display: grid;
    grid-template-columns: 1fr;
    max-width: none;
    margin: 0;
  }
  .toolbar_more .toolbar_item .toolbar_btn_caret {
    display: inline-flex;
  }
}
body.session-modal-open {
  overflow: hidden;
}

.session-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999999;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.session-modal.is-open {
  display: flex;
}
.session-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(34, 42, 57, 0.45);
}
.session-modal__dialog {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 24px;
  width: 100%;
  max-width: 480px;
  padding: 40px;
  background: #FFFFFF;
  border-radius: 24px;
  box-shadow: 0 4px 54px rgba(46, 53, 75, 0.12);
  box-sizing: border-box;
}
.session-modal__header {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.session-modal__title {
  margin: 0;
  color: #222A39;
  font-family: var(--font-body);
  font-size: 18px;
  font-weight: 500;
  line-height: 1.4;
}
.session-modal__body {
  color: #596476;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
}
.session-modal__body p {
  margin: 0 0 8px;
}
.session-modal__body p:last-child {
  margin-bottom: 0;
}
.session-modal__progress {
  margin-top: 8px;
  height: 6px;
  background: #F0F3FD;
  border-radius: 4px;
  overflow: hidden;
}
.session-modal__progress-bar {
  height: 100%;
  background: #6F61EA;
  border-radius: 4px;
  transition: width 1s linear;
}
.session-modal__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex-wrap: wrap;
}

.tour-invite {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  overflow-y: auto;
  background: rgba(20, 29, 45, 0.55);
}

@media (max-height: 480px) {
  .tour-invite {
    align-items: flex-start;
  }
  .tour-invite-icon {
    display: none;
  }
  .tour-invite-dialog {
    padding: 20px;
  }
  .tour-invite-text {
    margin-bottom: 16px;
  }
}
.tour-invite-dialog {
  width: 100%;
  max-width: 400px;
  padding: 32px 24px 24px 24px;
  text-align: center;
  background: var(--color-bg);
  border-radius: 24px;
  box-shadow: 0 8px 48px 0 rgba(52, 66, 95, 0.2);
}

.tour-invite-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin-bottom: 16px;
  font-size: 24px;
  color: var(--color-primary);
  background: var(--color-purple-50);
  border-radius: 9999px;
}

.tour-invite-title {
  margin: 0 0 8px 0;
  font-size: 18px;
  font-weight: 600;
  color: var(--color-text-strong);
}

.tour-invite-text {
  margin: 0 0 24px 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--color-text-subtle);
}

.tour-invite-actions {
  display: flex;
  gap: 12px;
}
.tour-invite-actions > .btn {
  flex: 1 1 0;
}

.tg-backdrop {
  z-index: var(--z-modal);
  border-radius: 16px;
  box-shadow: 0 0 0 2px var(--color-purple-400), 0 0 0 1000vh rgba(20, 29, 45, 0.55);
  border: 0;
}

.tg-dialog {
  max-width: 360px;
  padding: 4px;
  font-family: var(--font-body);
  font-size: 13px;
  color: var(--color-text);
  background: var(--color-bg);
  border-radius: 16px;
  box-shadow: 0 8px 48px 0 rgba(52, 66, 95, 0.2);
}
.tg-dialog .tg-dialog-header {
  padding: 20px 20px 0 20px;
}
.tg-dialog .tg-dialog-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--color-text-strong);
}
.tg-dialog .tg-dialog-close-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--color-text-subtle);
  border-radius: 8px;
  opacity: 1;
}
.tg-dialog .tg-dialog-close-btn:hover {
  color: var(--color-text-strong);
  background: var(--color-gray-100);
  opacity: 1;
}
.tg-dialog .tg-dialog-body {
  padding: 8px 20px 16px 20px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--color-text-subtle);
}
.tg-dialog .tg-dialog-body .tour-more {
  display: inline-block;
  margin-top: 8px;
  font-weight: 500;
  color: var(--color-primary);
  text-decoration: none;
}
.tg-dialog .tg-dialog-body .tour-more:hover {
  text-decoration: underline;
}
.tg-dialog .tg-dialog-footer {
  gap: 8px;
  padding: 0 20px 20px 20px;
}
.tg-dialog .tg-dialog-footer .tg-dialog-footer-sup .tg-step-progress {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0;
  color: var(--color-text-subtle);
  opacity: 1;
}
.tg-dialog .tg-dialog-footer button.tg-dialog-btn {
  height: 32px;
  padding: 0 14px;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--color-text-subtle);
  background: transparent;
  border: 1px solid var(--color-gray-200);
  border-radius: 26px;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.tg-dialog .tg-dialog-footer button.tg-dialog-btn:hover {
  color: var(--color-text-strong);
  background: var(--color-gray-50);
  border-color: var(--color-gray-300);
}
.tg-dialog .tg-dialog-footer button.tg-dialog-btn:active {
  color: var(--color-primary);
  background: var(--color-purple-50);
  border-color: var(--color-primary);
}
.tg-dialog .tg-dialog-footer button.tg-dialog-btn.disabled {
  opacity: 0.4;
}
.tg-dialog .tg-dialog-footer button.tg-dialog-btn:last-child {
  color: var(--color-gray-0);
  background: var(--color-primary);
  border-color: var(--color-primary);
}
.tg-dialog .tg-dialog-footer button.tg-dialog-btn:last-child:hover {
  background: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
  color: var(--color-gray-0);
}
.tg-dialog .tg-dialog-dots > span.tg-dot {
  background: var(--color-gray-200);
}
.tg-dialog .tg-dialog-dots > span.tg-dot.tg-dot-active {
  background: var(--color-primary);
}
.tg-dialog .tg-arrow {
  background: var(--color-bg);
}

body.tour-reveal-select .rownum-check__num {
  visibility: hidden;
}
body.tour-reveal-select .rownum-check__box {
  visibility: visible;
}

.ai-waiting {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  padding: 40px;
}
.ai-waiting__state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.ai-waiting__spinner {
  width: 48px;
  height: 48px;
  border-width: 4px;
}
.ai-waiting__label {
  color: #596476;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
}
.ai-waiting__ref {
  color: #758199;
  font-family: var(--font-body);
  font-size: 12px;
  text-align: center;
}
.ai-waiting .error_message {
  margin: 0;
}

.template-preview {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-height: 200px;
  padding: 24px;
}

body.nd-alert-open {
  overflow: hidden;
}

.nd-alert {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999999;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.nd-alert.is-open {
  display: flex;
}
.nd-alert__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(34, 42, 57, 0.45);
}
.nd-alert__dialog {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 20px;
  width: 100%;
  max-width: 420px;
  padding: 32px;
  background: #FFFFFF;
  border-radius: 24px;
  box-shadow: 0 4px 54px rgba(46, 53, 75, 0.12);
  box-sizing: border-box;
  animation: nd-alert-in 0.18s ease;
}
.nd-alert__body {
  color: #3D4451;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  white-space: pre-wrap;
  word-break: break-word;
}
.nd-alert__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}

@keyframes nd-alert-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.detail-icons-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
}
.detail-icons-cell .my_tooltip {
  display: inline-flex;
}

.detail-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: transparent;
  color: var(--color-text, #222A39);
  font-size: 18px;
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}
.detail-icon-btn i {
  font-size: 18px;
  line-height: 1;
}
.detail-icon-btn:hover {
  color: var(--color-text, #222A39);
  text-decoration: none;
}

.chosen-container-multi li.chosen-badge-li {
  float: none;
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
}
.chosen-container-multi.chosen-has-badge .chosen-choices {
  max-height: none;
  overflow: visible;
  flex-wrap: nowrap;
}
.chosen-container-multi.chosen-has-badge .chosen-choices li.search-field {
  width: auto;
  flex: 1 1 auto;
  min-width: 40px;
}

.chosen-badge {
  display: inline;
  color: var(--color-text);
  font-size: 14px;
  line-height: 22px;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
}
.chosen-badge__count {
  font-weight: 500;
}

.chosen-disabled .chosen-badge {
  color: #758199;
  cursor: not-allowed;
}

.chosen-badge-tip {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9000;
  min-width: 200px;
  max-width: 340px;
  padding: 4px;
  background: var(--color-bg);
  border: 1px solid var(--color-border-soft);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.14);
  font-family: var(--font-body);
}
.chosen-badge-tip[data-show] {
  display: block;
}
.chosen-badge-tip__edit {
  position: absolute;
  top: 8px;
  right: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: var(--color-text-subtle);
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.chosen-badge-tip__edit svg {
  width: 13px;
  height: 13px;
  fill: currentColor;
  pointer-events: none;
}
.chosen-badge-tip__edit:hover, .chosen-badge-tip__edit:focus-visible {
  background: var(--color-primary-softer);
  color: var(--color-primary);
}
.chosen-badge-tip__edit.is-hidden {
  display: none;
}
.chosen-badge-tip__head {
  padding: 4px 30px 6px 8px;
  margin-bottom: 4px;
  border-bottom: 1px solid var(--color-border-soft);
  color: var(--color-text-subtle);
  font-size: 11px;
  font-weight: 500;
}
.chosen-badge-tip__list {
  margin: 0;
  padding: 0;
  max-height: 260px;
  overflow-y: auto;
  list-style: none;
  scrollbar-width: thin;
}
.chosen-badge-tip__list::-webkit-scrollbar {
  width: 8px;
}
.chosen-badge-tip__list::-webkit-scrollbar-thumb {
  background: var(--color-border);
  border: 2px solid transparent;
  border-radius: 999px;
  background-clip: padding-box;
}

.chosen-badge-row {
  --chosen-badge-depth: 0;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 6px 8px;
  padding-left: calc(8px + var(--chosen-badge-depth) * 18px);
  border-radius: 8px;
  font-size: 14px;
  line-height: 20px;
  color: var(--color-text);
}
.chosen-badge-row__img.chosen_img {
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
}
.chosen-badge-row__label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.chosen-badge-row.is-nested {
  position: relative;
}
.chosen-badge-row.is-nested::before {
  content: "";
  position: absolute;
  top: 50%;
  left: calc(var(--chosen-badge-depth) * 18px - 6px);
  width: 8px;
  height: 1px;
  background: var(--color-border);
}
.chosen-badge-row--more {
  justify-content: center;
  color: var(--color-text-subtle);
  font-size: 13px;
}

.chosen-container-multi.chosen-checkbox-results .chosen-results li.active-result,
.chosen-container-multi.chosen-checkbox-results .chosen-results li.result-selected,
.chosen-container-multi.chosen-checkbox-results .chosen-results li.disabled-result {
  --chosen-cb-size: 18px;
  --chosen-cb-left: calc(12px + var(--chosen-badge-depth, 0) * 18px);
  position: relative;
  padding-left: calc(var(--chosen-cb-left) + var(--chosen-cb-size) + 10px);
}
.chosen-container-multi.chosen-checkbox-results .chosen-results li.active-result::before,
.chosen-container-multi.chosen-checkbox-results .chosen-results li.result-selected::before,
.chosen-container-multi.chosen-checkbox-results .chosen-results li.disabled-result::before {
  content: "";
  position: absolute;
  top: 50%;
  left: var(--chosen-cb-left);
  width: var(--chosen-cb-size);
  height: var(--chosen-cb-size);
  margin-top: calc(var(--chosen-cb-size) / -2);
  box-sizing: border-box;
  background: var(--color-bg);
  border: 1.5px solid var(--color-border-strong);
  border-radius: 50%;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.chosen-container-multi.chosen-checkbox-results .chosen-results li.active-result:hover::before {
  border-color: var(--color-primary);
}
.chosen-container-multi.chosen-checkbox-results .chosen-results li.result-selected {
  color: var(--color-text);
  background: transparent;
  font-weight: 400;
  cursor: pointer;
}
.chosen-container-multi.chosen-checkbox-results .chosen-results li.result-selected::before {
  background: var(--color-primary);
  border-color: var(--color-primary);
}
.chosen-container-multi.chosen-checkbox-results .chosen-results li.result-selected::after {
  content: "";
  position: absolute;
  top: 50%;
  left: calc(var(--chosen-cb-left) + 6px);
  width: 5px;
  height: 9px;
  margin-top: -6px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.chosen-container-multi.chosen-checkbox-results .chosen-results li.result-selected:hover {
  background: var(--color-primary-softer);
}
.chosen-container-multi.chosen-checkbox-results .chosen-results li.disabled-result::before {
  background: var(--color-bg-soft);
  border-color: var(--color-border);
}
.chosen-container-multi.chosen-checkbox-results .chosen-results li.group-result,
.chosen-container-multi.chosen-checkbox-results .chosen-results li.no-results {
  padding-left: 12px;
}
.chosen-container-multi.chosen-checkbox-results .chosen-results li.group-result::before, .chosen-container-multi.chosen-checkbox-results .chosen-results li.group-result::after,
.chosen-container-multi.chosen-checkbox-results .chosen-results li.no-results::before,
.chosen-container-multi.chosen-checkbox-results .chosen-results li.no-results::after {
  content: none;
}

@media (max-width: 576px) {
  .chosen-container-multi.chosen-checkbox-results .chosen-results li.active-result,
  .chosen-container-multi.chosen-checkbox-results .chosen-results li.result-selected {
    --chosen-cb-size: 20px;
    min-height: 44px;
    touch-action: manipulation;
  }
  .chosen-badge-tip {
    max-width: calc(100vw - 16px);
  }
  .chosen-badge-tip__edit {
    width: 32px;
    height: 32px;
    top: 4px;
    right: 4px;
  }
  .chosen-badge-tip__edit svg {
    width: 15px;
    height: 15px;
  }
  .chosen-badge-tip__head {
    padding-right: 38px;
  }
}
.doa-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(17, 24, 39, 0.45);
}
.doa-overlay--inline {
  position: static;
  z-index: auto;
  min-height: 60vh;
  padding: 32px 0;
  border-radius: 12px;
  background: rgba(17, 24, 39, 0.06);
}

.doa-dialog {
  position: relative;
  width: 400px;
  max-width: calc(100% - 32px);
  padding: 28px 24px;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(17, 24, 39, 0.22);
  text-align: center;
}

.doa-title {
  margin: 0 0 18px;
  font-size: 15px;
  line-height: 1.5;
  color: #111827;
}

.doa-code {
  width: 100%;
  height: 42px;
  padding: 0 12px;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  font-size: 18px;
  text-align: center;
  box-sizing: border-box;
}
.doa-code:focus {
  outline: none;
  border-color: #0070d3;
}

.doa-error {
  min-height: 18px;
  margin: 8px 0 0;
  font-size: 12px;
  color: #dc2626;
}

.doa-resend {
  margin-top: 10px;
  padding: 0;
  border: 0;
  background: none;
  font-size: 13px;
  color: #0070d3;
  cursor: pointer;
}
.doa-resend[disabled] {
  color: #9ca3af;
  cursor: default;
}

.doa-close {
  position: absolute;
  top: 10px;
  right: 12px;
  padding: 4px;
  border: 0;
  background: none;
  font-size: 14px;
  line-height: 1;
  color: #9ca3af;
  cursor: pointer;
}
.doa-close:hover {
  color: #111827;
}

.switch_grid_wrapper img {
  display: inline;
}

.doc_signers {
  display: block;
  width: 100%;
  padding: 16px;
  border: 1px solid var(--color-border, #BCC9DF);
  border-radius: 12px;
  background: var(--color-bg, #FFFFFF);
}

.doc_signers_inner {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.doc_signers_switch {
  position: relative;
  flex: 0 0 auto;
  display: inline-block;
  width: 35px;
  height: 22px;
  margin-top: 2px;
  padding: 0;
  border: 1px solid var(--color-border, #BCC9DF);
  border-radius: 9999px;
  background: var(--color-bg-soft, #F0F3FD);
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.doc_signers_switch.is-on {
  border-color: #bbb6ea;
  background: #E4E5FF;
}
.doc_signers_switch.is-on .doc_signers_switch_knob {
  background: var(--color-primary, #6F61EA);
  transform: translate(13px, -50%);
}
.doc_signers_switch:focus-visible {
  outline: none;
  box-shadow: 0 0 0 3px rgba(111, 97, 234, 0.2);
}

.doc_signers_switch_knob {
  position: absolute;
  top: 50%;
  left: 6px;
  width: 10px;
  height: 10px;
  border-radius: 9999px;
  background: #758199;
  transform: translate(0, -50%);
  transition: transform 0.18s ease, background-color 0.18s ease;
}

.doc_signers_switch_sm {
  width: 28px;
  height: 17px;
  margin-top: 0;
}
.doc_signers_switch_sm .doc_signers_switch_knob {
  left: 4px;
  width: 8px;
  height: 8px;
}
.doc_signers_switch_sm.is-on .doc_signers_switch_knob {
  transform: translate(11px, -50%);
}

.doc_signers_phase {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 500;
  line-height: 14px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #A5B3C9;
}
.doc_signers_phase::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: var(--color-border-soft, #D3DEEF);
}
.doc_signers_phase.is-break {
  margin-top: 12px;
}
.doc_signers_phase .bi {
  font-size: 11px;
  color: #A5B3C9;
}

.doc_signers_list {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.doc_signers_list[hidden] {
  display: none;
}
.doc_signers_list > .doc_signers_phase,
.doc_signers_list > .doc_signers_placeholder {
  margin-right: -9px;
  margin-left: -9px;
}
.doc_signers_list > .doc_signers_element {
  width: calc(100% + 18px);
  margin: 0 -9px;
  padding-left: 21px;
}
.doc_signers_list > .doc_signers_element::before {
  left: 50px;
}

.doc_signers_element {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  padding: 12px;
  border: 1px solid transparent;
  border-radius: 12px;
  background-color: var(--color-bg-page, #F4F7FF);
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.doc_signers_element:hover {
  border-color: var(--color-border-soft, #D3DEEF);
}
.doc_signers_element::before {
  content: "";
  position: absolute;
  top: 40px;
  bottom: -8px;
  left: 41px;
  width: 2px;
  border-radius: 1px;
  background: var(--color-border-soft, #D3DEEF);
  pointer-events: none;
}
.doc_signers_element.is-tail::before, .doc_signers_element.is-dragged::before {
  display: none;
}
.doc_signers_element.is-dragged {
  position: absolute;
  left: 0;
  z-index: 5;
  border-color: var(--color-primary, #6F61EA);
  box-shadow: 0 18px 44px rgba(52, 66, 95, 0.1);
  pointer-events: none;
}
.doc_signers_element.is-rejected {
  border-color: var(--color-danger, #FA3E93);
  animation: doc-signers-reject 0.4s ease;
}
.doc_signers_element.is-duplicate {
  border-color: var(--color-danger, #FA3E93);
}

@keyframes doc-signers-reject {
  0%, 100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-4px);
  }
  75% {
    transform: translateX(4px);
  }
}
.doc_signers_placeholder {
  border: 1px dashed var(--color-primary-strong, #BBB4FD);
  border-radius: 12px;
  background: var(--color-secondary-softer, #F3F5FF);
}

.doc_signers_element_handle {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  padding-top: 8px;
  cursor: grab;
  touch-action: none;
  user-select: none;
}
.doc_signers_element.is-dragged .doc_signers_element_handle {
  cursor: grabbing;
}
.doc_signers_element_handle .bi {
  width: 16px;
  height: 16px;
  font-size: 14px;
  line-height: 16px;
  text-align: center;
  color: #A5B3C9;
}
.doc_signers_element_handle:hover .bi {
  color: var(--color-primary, #6F61EA);
}
.doc_signers:not(.is-ordered) .doc_signers_element_handle {
  cursor: default;
}
.doc_signers:not(.is-ordered) .doc_signers_element_handle .bi {
  visibility: hidden;
}

.doc_signers_element_order {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  border: 1px solid var(--color-border, #BCC9DF);
  border-radius: 9999px;
  background: var(--color-bg, #FFFFFF);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  line-height: 1;
  color: #596476;
}
.doc_signers_element_order:empty {
  width: 8px;
  height: 8px;
  margin: 6px;
  border-color: transparent;
  background: #A5B3C9;
}

.doc_signers_element_inputs {
  display: grid;
  flex: 1 1 auto;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px 12px;
  min-width: 0;
}
@media (max-width: 768px) {
  .doc_signers_element_inputs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 576px) {
  .doc_signers_element_inputs {
    grid-template-columns: minmax(0, 1fr);
  }
}

.doc_signers_field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.doc_signers_field[hidden] {
  display: none;
}

.doc_signers_field_wide {
  grid-column: 1/-1;
}

.doc_signers_label {
  margin: 0;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  line-height: 16px;
  color: #758199;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.doc_signers_label .label-must {
  height: 16px;
}
.doc_signers_label .label-must[hidden] {
  display: none;
}

.doc_signers input.form-control,
.doc_signers select.form-control:not([multiple]) {
  width: 100%;
  min-width: 0;
  height: 36px;
  min-height: 36px;
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 12px;
  line-height: 18px;
}
.doc_signers select.form-control:not([multiple]) {
  padding-left: 12px;
  padding-right: 32px;
  background-position: right 10px center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.doc_signers select.form-control.is-locked {
  background-color: var(--color-bg-soft, #F0F3FD);
  color: #758199;
  cursor: not-allowed;
}
.doc_signers .doc_signers_field_select {
  position: relative;
}
.doc_signers .doc_signers_field_select select.form-control:not([multiple]) {
  background-image: none;
}
.doc_signers .doc_signers_field_select::after {
  content: "";
  position: absolute;
  right: 1px;
  bottom: 1px;
  width: 32px;
  height: 34px;
  border-radius: 0 8px 8px 0;
  background-color: var(--color-bg, #FFFFFF);
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23758199' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 16px 12px;
  pointer-events: none;
}
.doc_signers .doc_signers_field_select:focus-within::after {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%236251E3' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 11 6-6 6 6'/%3e%3c/svg%3e");
}

.doc_signers_person {
  position: relative;
}
.doc_signers_person input.form-control {
  padding-right: 30px;
}

.doc_signers_person_clear {
  position: absolute;
  top: 50%;
  right: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 0;
  border-radius: 9999px;
  background: transparent;
  color: #A5B3C9;
  font-size: 12px;
  line-height: 1;
  transform: translateY(-50%);
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.doc_signers_person_clear:hover {
  background: var(--color-bg-soft, #F0F3FD);
  color: var(--color-danger, #FA3E93);
}

.doc_signers_element_remove {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin-top: 24px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #A5B3C9;
  font-size: 12px;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.doc_signers_element_remove:hover {
  background: var(--color-danger-soft, #FFE4F0);
  color: var(--color-danger, #FA3E93);
}

.doc_signers_add_button {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.doc_signers_empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 24px 16px;
  border: 1px dashed var(--color-border-soft, #D3DEEF);
  border-radius: 12px;
  color: #758199;
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 18px;
  text-align: center;
}
.doc_signers_empty[hidden] {
  display: none;
}
.doc_signers_empty .bi {
  font-size: 20px;
  color: #A5B3C9;
}

.doc_signers_group {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0 -9px;
  padding: 8px;
  border: 1px solid var(--color-border-soft, #D3DEEF);
  border-radius: 12px;
  background: var(--color-bg, #FFFFFF);
}
.doc_signers_group::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: -8px;
  left: 50px;
  width: 2px;
  border-radius: 1px;
  background: var(--color-border-soft, #D3DEEF);
  pointer-events: none;
}
.doc_signers_group.is-tail::before {
  bottom: 24px;
}
.doc_signers_group > .doc_signers_element::before {
  display: none;
}
.doc_signers_group > .doc_signers_element:not(.doc_signers_member) {
  background: transparent;
}
.doc_signers_group > .doc_signers_element:not(.doc_signers_member):hover {
  border-color: transparent;
}
.doc_signers_group > .doc_signers_element:not(.doc_signers_member) .doc_signers_element_order {
  visibility: hidden;
}
.doc_signers_group.is-dragged {
  position: absolute;
  left: 0;
  z-index: 5;
  border-color: var(--color-primary, #6F61EA);
  box-shadow: 0 18px 44px rgba(52, 66, 95, 0.1);
  pointer-events: none;
}

.doc_signers_group_ordering {
  flex-direction: row;
  align-items: center;
  gap: 8px;
}
.doc_signers_group_ordering .doc_signers_label {
  order: 2;
  white-space: normal;
}
.doc_signers_group_ordering[hidden] {
  display: none;
}

.doc_signers_group_state {
  padding-left: 64px;
  font-family: var(--font-body);
  font-size: 11px;
  line-height: 16px;
  color: #758199;
}
.doc_signers_group_state[hidden] {
  display: none;
}

.doc_signers_member {
  align-items: center;
  padding-top: 6px;
  padding-bottom: 6px;
}
.doc_signers_member .doc_signers_element_handle {
  padding-top: 0;
}
.doc_signers_member .doc_signers_element_remove {
  margin-top: 0;
}
.doc_signers:not(.is-ordered) .doc_signers_member .doc_signers_element_handle, .doc_signers_group:not([data-group-ordered="1"]) .doc_signers_member .doc_signers_element_handle {
  cursor: default;
}
.doc_signers:not(.is-ordered) .doc_signers_member .doc_signers_element_handle .bi, .doc_signers_group:not([data-group-ordered="1"]) .doc_signers_member .doc_signers_element_handle .bi {
  visibility: hidden;
}

.doc_signers_member_body {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.doc_signers_member_body .bi {
  flex: 0 0 auto;
  font-size: 12px;
  color: #A5B3C9;
}

.doc_signers_member_name {
  flex: 1 1 auto;
  min-width: 0;
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 18px;
  color: var(--color-text, #3D4451);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.doc_signers_notice {
  position: absolute;
  top: -10px;
  left: 40px;
  z-index: 6;
  max-width: calc(100% - 56px);
  padding: 4px 8px;
  border-radius: 8px;
  background: #222A39;
  color: #FFFFFF;
  font-family: var(--font-body);
  font-size: 11px;
  line-height: 16px;
  box-shadow: 0 18px 44px rgba(52, 66, 95, 0.1);
}
.doc_signers_notice[hidden] {
  display: none;
}

.sign_fields {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.sign_fields_document {
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 70vh;
  border: 1px solid var(--color-border, #BCC9DF);
  border-radius: 12px;
  background: var(--color-bg, #FFFFFF);
  overflow: hidden;
}

.sign_fields_bar {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding: 8px 12px;
  border-bottom: 1px solid var(--color-border-soft, #D3DEEF);
  background: var(--color-bg, #FFFFFF);
}

.sign_fields_progress {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 18px;
  color: #596476;
}

.sign_fields_progress_bar {
  display: block;
  width: 96px;
  height: 4px;
  border-radius: 9999px;
  background: var(--color-border-soft, #D3DEEF);
  overflow: hidden;
}
.sign_fields_progress_bar i {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: var(--color-primary, #6F61EA);
  transition: width 0.2s ease;
}
.sign_fields.is-complete .sign_fields_progress_bar i {
  background: var(--color-success, #0C9B99);
}

.sign_fields_zoom {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  padding: 2px;
  border: 1px solid var(--color-border, #BCC9DF);
  border-radius: 8px;
  background: var(--color-bg, #FFFFFF);
}
.sign_fields_zoom button {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  min-width: 26px;
  padding: 0 6px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #596476;
  font-family: var(--font-body);
  font-size: 11px;
  line-height: 1;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.sign_fields_zoom button:hover {
  background: var(--color-bg-soft, #F0F3FD);
  color: var(--color-primary, #6F61EA);
}

.sign_fields_zoom_value {
  min-width: 46px !important;
  font-weight: 500;
}

.sign_fields_body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 260px;
  gap: 12px;
  align-items: stretch;
}

.sign_fields_viewer {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  scrollbar-gutter: stable;
  padding: 16px;
  background: var(--color-bg-page, #F4F7FF);
  overflow: auto;
  overscroll-behavior: contain;
}

.sign_fields_pages {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0 auto;
}

.sign_fields_file {
  position: sticky;
  top: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 4px;
  background: var(--color-bg, #FFFFFF);
  box-shadow: 0 18px 44px rgba(52, 66, 95, 0.1);
}

.sign_fields_file_no {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  border-radius: 4px;
  background: var(--color-bg-page, #F4F7FF);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 600;
  color: #596476;
}

.sign_fields_file_name {
  flex: 1 1 auto;
  overflow: hidden;
  font-family: var(--font-body);
  font-size: 13px;
  font-weight: 600;
  color: var(--color-text, #3D4451);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sign_fields_file_pages {
  flex: 0 0 auto;
  font-family: var(--font-body);
  font-size: 11px;
  color: #758199;
}

.sign_fields_page {
  position: relative;
  flex: 0 0 auto;
  border-radius: 4px;
  background: var(--color-bg, #FFFFFF);
  box-shadow: 0 18px 44px rgba(52, 66, 95, 0.1);
  overflow: hidden;
}
.sign_fields_page img {
  display: block;
  width: 100%;
  height: 100%;
  user-select: none;
  pointer-events: none;
}
.sign_fields_page.is-drop-target {
  outline: 2px dashed var(--color-primary, #6F61EA);
}

.sign_fields_page_number {
  position: absolute;
  top: 6px;
  right: 6px;
  padding: 2px 6px;
  border-radius: 9999px;
  background: rgba(34, 42, 57, 0.6);
  color: #FFFFFF;
  font-family: var(--font-body);
  font-size: 10px;
  line-height: 14px;
  pointer-events: none;
}

.sign_fields_box {
  position: absolute;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 2px 6px;
  border: 1.5px solid var(--signer-color, #6F61EA);
  border-radius: 4px;
  background: var(--signer-tint, #EAECFF);
  cursor: move;
  touch-action: none;
  overflow: hidden;
}
.sign_fields_box.is-selected {
  box-shadow: 0 0 0 2px var(--signer-glow, #BBB4FD);
}

.sign_fields_box_name {
  flex: 1 1 auto;
  min-width: 0;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 500;
  line-height: 14px;
  color: var(--signer-ink, #6F61EA);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  pointer-events: none;
}

.sign_fields_box_remove {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  padding: 0;
  border: 0;
  border-radius: 9999px;
  background: transparent;
  color: var(--signer-ink, #6F61EA);
  font-size: 10px;
  line-height: 1;
}
.sign_fields_box_remove:hover {
  background: var(--color-danger, #FA3E93);
  color: #FFFFFF;
}

.sign_fields_ghost {
  position: fixed;
  z-index: 1600;
  padding: 4px 8px;
  border: 1.5px solid var(--signer-color, #6F61EA);
  border-radius: 4px;
  background: var(--signer-tint, #EAECFF);
  color: var(--signer-ink, #6F61EA);
  font-family: var(--font-body);
  font-size: 10px;
  line-height: 14px;
  white-space: nowrap;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.sign_fields_panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 0;
  height: 100%;
  padding: 12px;
  border: 1px solid var(--color-border, #BCC9DF);
  border-radius: 12px;
  background: var(--color-bg, #FFFFFF);
}

.sign_fields_panel_title {
  flex: 0 0 auto;
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  line-height: 16px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #758199;
}

.sign_fields_panel_list {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 6px;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.sign_fields_panel_hint {
  flex: 0 0 auto;
  margin: 0;
  padding-top: 8px;
  border-top: 1px solid var(--color-border-soft, #D3DEEF);
  font-family: var(--font-body);
  font-size: 11px;
  line-height: 16px;
  color: #758199;
}

.sign_fields_signer {
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px;
  border: 1px solid var(--color-border-soft, #D3DEEF);
  border-left: 3px solid var(--signer-color, #6F61EA);
  border-radius: 8px;
  background: var(--color-bg-page, #F4F7FF);
  cursor: grab;
  touch-action: none;
  user-select: none;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.sign_fields_signer:hover {
  border-color: var(--color-border, #BCC9DF);
  background: var(--color-bg-soft, #F0F3FD);
}
.sign_fields.is-placing .sign_fields_signer {
  cursor: grabbing;
}
.sign_fields_signer.is-frozen {
  cursor: default;
  opacity: 0.55;
}
.sign_fields_signer.is-frozen:hover {
  border-color: var(--color-border-soft, #D3DEEF);
  background: var(--color-bg-page, #F4F7FF);
}
.sign_fields_panel_list > .sign_fields_signer, .sign_fields_group > .sign_fields_signer {
  padding-left: 17px;
}
.sign_fields_panel_list > .sign_fields_signer::before {
  content: "";
  position: absolute;
  top: 27px;
  bottom: -6px;
  left: 25px;
  width: 2px;
  border-radius: 1px;
  background: var(--color-border-soft, #D3DEEF);
  pointer-events: none;
}
.sign_fields_panel_list > .sign_fields_signer:last-child::before, .sign_fields_panel_list > .sign_fields_signer:has(+ .sign_fields_phase)::before {
  display: none;
}

.sign_fields_phase {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 500;
  line-height: 14px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #A5B3C9;
}
.sign_fields_phase::after {
  content: "";
  flex: 1 1 auto;
  height: 1px;
  background: var(--color-border-soft, #D3DEEF);
}
.sign_fields_phase:not(:first-child) {
  margin-top: 4px;
}

.sign_fields_group {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-bottom: 10px;
  border: 0;
  border-bottom: 1px dashed var(--color-border, #BCC9DF);
}
.sign_fields_group:not(:first-child) {
  margin-top: 8px;
}
.sign_fields_group::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: -6px;
  left: 25px;
  width: 2px;
  border-radius: 1px;
  background: var(--color-border-soft, #D3DEEF);
  pointer-events: none;
}
.sign_fields_group:last-child::before {
  bottom: 10px;
}

.sign_fields_group_title {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 0;
  background: var(--color-bg, #FFFFFF);
  font-family: var(--font-body);
  font-size: 11px;
  font-weight: 500;
  line-height: 16px;
  color: #596476;
  white-space: nowrap;
}
.sign_fields_group_title > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sign_fields_group_title::before {
  content: "\f4d0";
  flex: 0 0 auto;
  font-family: "bootstrap-icons";
  font-weight: normal;
  color: #A5B3C9;
}
.sign_fields_group_title::after {
  content: "";
  flex: 1 1 auto;
  min-width: 8px;
  height: 1px;
  margin-left: 4px;
  border-top: 1px dashed var(--color-border, #BCC9DF);
}

.sign_fields_signer_order {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  border: 1px solid var(--color-border, #BCC9DF);
  border-radius: 9999px;
  background: var(--color-bg, #FFFFFF);
  color: #596476;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 500;
  line-height: 1;
}
.sign_fields_signer_order:empty {
  width: 8px;
  height: 8px;
  margin: 5px;
  border-color: transparent;
  background: #A5B3C9;
}

.sign_fields_signer_name {
  flex: 1 1 auto;
  min-width: 0;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
  line-height: 18px;
  color: var(--color-text, #3D4451);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sign_fields_signer_count {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  height: 18px;
  min-width: 20px;
  padding: 0 4px;
  border: 1px solid var(--color-border, #BCC9DF);
  border-radius: 4px;
  background: var(--color-bg, #FFFFFF);
  color: #596476;
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 500;
  line-height: 1;
}
.sign_fields_signer.is-placed .sign_fields_signer_count {
  border-color: var(--color-border-strong, #A5B3C9);
  color: var(--color-text, #3D4451);
}
.sign_fields_signer.is-partial .sign_fields_signer_count {
  border-color: #FDAF42;
  color: #FDAF42;
}

.sign_fields_state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 320px;
  padding: 24px;
  border: 1px dashed var(--color-border, #BCC9DF);
  border-radius: 12px;
  background: var(--color-bg-page, #F4F7FF);
  color: #758199;
  font-family: var(--font-body);
  font-size: 12px;
  line-height: 18px;
  text-align: center;
}
.sign_fields_state p {
  margin: 0;
}
.sign_fields_state .bi {
  font-size: 24px;
  color: #A5B3C9;
}

.sign_fields_mobile {
  display: none;
}

@media (max-width: 992px) {
  .sign_fields_body {
    display: none;
  }
  .sign_fields_mobile {
    display: flex;
  }
}
@media (min-width: 993px) {
  .form-horizontal.form-single.has-wizard:has(.sign_fields) {
    max-width: none;
  }
  .form-horizontal.form-single.has-wizard:has(.sign_fields) .form-wizard__content {
    max-width: none;
  }
  .page_content:has(> form.has-wizard .sign_fields) {
    padding-inline: 12px;
  }
}
.qes-sign__dialog {
  max-width: 460px;
}
.qes-sign__body {
  text-align: center;
}
.qes-sign__state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 12px 0;
}
.qes-sign__spinner {
  width: 40px;
  height: 40px;
}
.qes-sign__icon {
  font-size: 32px;
  color: #758199;
}
.qes-sign__icon--done {
  color: #01B39E;
}
.qes-sign__label {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: #3D4451;
}
.qes-sign__hint {
  margin: 0;
  font-size: 13px;
  color: #758199;
  max-width: 34ch;
}
.qes-sign__cancel {
  margin-top: 4px;
  color: #596476;
}
.qes-sign__relaunch {
  height: auto;
  min-height: 0;
  padding: 0;
  font-size: 13px;
  text-decoration: underline;
}

.es-body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  margin: 0;
  background: #F0F3FD;
}

.es-header {
  display: flex;
  align-items: center;
  height: 64px;
  padding: 0 24px;
  background: #fff;
  border-bottom: 1px solid #D3DEEF;
}
.es-header__logo img {
  max-height: 36px;
  width: auto;
}

.es-main {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  padding: 16px 24px;
}

.es-footer {
  padding: 16px 24px;
  background: #fff;
  border-top: 1px solid #D3DEEF;
}

.es-layout {
  display: flex;
  align-items: stretch;
  flex: 1 1 auto;
  gap: 16px;
  min-height: 0;
  width: 100%;
}
@media (max-width: 767.98px) {
  .es-layout {
    flex-direction: column;
    min-height: 480px;
  }
}

.es-thumbs {
  flex: 0 0 10%;
  min-width: 120px;
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  transition: flex-basis 0.2s ease, min-width 0.2s ease;
}
.es-thumbs__rail {
  display: flex;
  justify-content: flex-end;
  padding: 8px;
}
.es-thumbs__rail-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: #F0F3FD;
  color: #758199;
  cursor: pointer;
}
.es-thumbs__rail-toggle i {
  transition: transform 0.2s ease;
}
.es-thumbs__rail-toggle:hover {
  color: #6F61EA;
}
.es-thumbs__rail-toggle[aria-expanded=false] i {
  transform: rotate(180deg);
}
.es-thumbs.is-collapsed {
  flex: 0 0 44px;
  min-width: 44px;
}
.es-thumbs.is-collapsed .es-thumbs__rail {
  justify-content: center;
  padding: 8px 0;
}
.es-thumbs.is-collapsed .es-thumbs__groups {
  display: none;
}
.es-thumbs__groups {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}
.es-thumbs__group {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.es-thumbs__group + .es-thumbs__group {
  border-top: 1px solid #D3DEEF;
}
.es-thumbs__head {
  position: sticky;
  top: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 10px 8px;
  background: #fff;
  border-bottom: 1px solid #D3DEEF;
}
.es-thumbs__toggle {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 1 1 auto;
  min-width: 0;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}
.es-thumbs__toggle[aria-expanded=false] .bi-chevron-down {
  transform: rotate(-90deg);
}
.es-thumbs__name {
  overflow: hidden;
  font-size: 12px;
  font-weight: 500;
  color: #222A39;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.es-thumbs__download {
  color: #758199;
}
.es-thumbs__download:hover {
  color: #6F61EA;
}
.es-thumbs__list {
  padding: 8px;
}
.es-thumbs__list.is-collapsed {
  display: none;
}

.es-thumb {
  display: block;
  width: 100%;
  margin-bottom: 8px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}
.es-thumb__frame {
  display: block;
  border: 2px solid transparent;
  border-radius: 4px;
  overflow: hidden;
}
.es-thumb__frame img {
  display: block;
  width: 100%;
  height: auto;
}
.es-thumb__no {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  color: #758199;
}
.es-thumb.is-active .es-thumb__frame {
  border-color: #6F61EA;
}
.es-thumb.is-active .es-thumb__no {
  color: #6F61EA;
  font-weight: 600;
}

.es-doc {
  position: relative;
  flex: 1 1 70%;
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
}
.es-doc__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid #D3DEEF;
}
.es-doc__title {
  overflow: hidden;
  font-size: 14px;
  font-weight: 600;
  color: #222A39;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.es-doc__zoom {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}
.es-doc__zoombtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 1px solid #D3DEEF;
  border-radius: 6px;
  background: #fff;
  color: #758199;
  cursor: pointer;
}
.es-doc__zoombtn:hover {
  border-color: #6F61EA;
  color: #6F61EA;
}
.es-doc__zoomval {
  min-width: 44px;
  font-size: 12px;
  color: #758199;
  text-align: center;
}
.es-doc__scroll {
  flex: 1 1 auto;
  overflow: auto;
  padding: 16px 16px 80px;
  background: #F2F8FF;
}
.es-doc__pages {
  width: 100%;
  margin: 0 auto;
  transition: width 0.15s ease;
}

.es-page img {
  display: block;
  width: 100%;
  height: auto;
}

.es-file-band {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 16px 0 8px;
  padding: 8px 12px;
  background: #fff;
  border-radius: 8px;
  border: 1px solid #D3DEEF;
}
.es-file-band:first-child {
  margin-top: 0;
}
.es-file-band__no {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  border-radius: 6px;
  background: #F0F3FD;
  font-size: 11px;
  font-weight: 600;
  color: #758199;
}
.es-file-band__name {
  flex: 1 1 auto;
  overflow: hidden;
  font-size: 13px;
  font-weight: 600;
  color: #222A39;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.es-file-band__dl {
  flex: 0 0 auto;
  color: #758199;
}
.es-file-band__dl:hover {
  color: #6F61EA;
}

.es-side {
  flex: 0 0 20%;
  min-width: 220px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-height: 0;
  overflow-y: auto;
}

.es-card {
  padding: 16px;
  background: #fff;
  border-radius: 12px;
}
.es-card__label {
  margin: 0 0 8px;
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #758199;
}
.es-card__title {
  margin: 0 0 4px;
  font-size: 16px;
  font-weight: 500;
  color: #222A39;
}

.es-files {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.es-files__item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border-radius: 8px;
  background: #F0F3FD;
  font-size: 13px;
  color: #222A39;
  text-decoration: none;
}
.es-files__item span {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.es-files__item:hover {
  color: #6F61EA;
}
.es-files__dl {
  flex: 0 0 auto;
  color: #758199;
}

.es-details {
  margin: 12px 0 0;
  padding: 0;
}
.es-details__row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
}
.es-details__row dt {
  flex: 0 0 auto;
  margin: 0;
  font-size: 13px;
  font-weight: 500;
  color: #758199;
}
.es-details__row dd {
  margin: 0;
  font-size: 13px;
  color: #222A39;
  text-align: right;
}

.es-floatbar {
  position: absolute;
  left: 50%;
  bottom: 16px;
  transform: translateX(-50%);
  z-index: 5;
}
.es-floatbar__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 48px;
  padding: 0 28px;
  border-radius: 24px;
  box-shadow: 0 12px 32px rgba(17, 24, 39, 0.22);
}

.es-notice {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  max-width: 520px;
  margin: auto;
  padding: 32px;
  background: #fff;
  border-radius: 12px;
  text-align: center;
}
.es-notice__icon {
  font-size: 32px;
  color: #758199;
}
.es-notice__text {
  margin: 0;
  font-size: 16px;
  color: #222A39;
}

.sign-rail {
  margin: 12px 0;
  text-align: left;
}
.sign-rail.is-hidden {
  display: none;
}
.sign-rail__list {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.sign-rail__row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 8px;
  background: #F0F3FD;
  color: #758199;
  font-size: 12px;
}
.sign-rail__row.is-active {
  background: rgba(111, 97, 234, 0.1);
  color: #6F61EA;
  font-weight: 600;
}
.sign-rail__row.is-signed {
  color: #0C9B99;
}
.sign-rail__row.is-failed {
  color: #FA3E93;
}
.sign-rail__icon {
  flex: 0 0 auto;
}
.sign-rail__name {
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.ps-popup-open {
  overflow: hidden;
}

.ps-popup .control-label {
  font-size: 12px;
  font-weight: 500;
  color: #758199;
}

.ps-popup {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999999;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.ps-popup.is-open {
  display: flex;
}
.ps-popup__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(34, 42, 57, 0.45);
}
.ps-popup__dialog {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 680px;
  max-height: 88vh;
  background: #FFFFFF;
  border-radius: 24px;
  box-shadow: 0 4px 54px rgba(46, 53, 75, 0.12);
  box-sizing: border-box;
  overflow: hidden;
}
.ps-popup__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 24px 28px;
  border-bottom: 1px solid var(--color-border-soft, #D3DEEF);
}
.ps-popup__title {
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  color: #3D4451;
}
.ps-popup__close {
  border: 0;
  background: transparent;
  cursor: pointer;
  color: #758199;
}
.ps-popup__body {
  padding: 24px 28px;
  overflow-y: auto;
}
.ps-popup__state {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 96px;
  color: #758199;
  font-size: 14px;
}
.ps-popup__list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ps-popup__row {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 12px;
  border: 1px solid var(--color-border-soft, #D3DEEF);
  border-radius: 12px;
}
.ps-popup__preview {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 120px;
  height: 56px;
  flex-shrink: 0;
  overflow: hidden;
}
.ps-popup__preview img {
  max-width: 100%;
  max-height: 100%;
}
.ps-popup__row-title {
  flex: 1;
  min-width: 0;
  font-size: 14px;
  color: #3D4451;
  word-break: break-word;
}
.ps-popup__row-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.ps-popup__icon {
  border: 0;
  background: transparent;
  cursor: pointer;
  color: #758199;
}
.ps-popup__icon--danger {
  color: var(--color-danger, #E5484D);
}
.ps-popup__form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.ps-popup__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ps-popup__field-label {
  font-size: 12px;
  font-weight: 500;
  color: #758199;
}
.ps-popup__input {
  width: 100%;
}
.ps-popup__block {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ps-popup__canvas {
  width: 100%;
  height: 220px;
  border: 1px dashed var(--color-border, #BCC9DF);
  border-radius: 12px;
  background: #FFFFFF;
  touch-action: none;
  cursor: crosshair;
}
.ps-popup__block-actions {
  display: flex;
  justify-content: flex-end;
}
.ps-popup__seal-preview {
  max-width: 100%;
  max-height: 180px;
  align-self: flex-start;
}
.ps-popup__pick {
  align-self: flex-start;
}
.ps-popup__footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  padding-top: 20px;
}
.ps-popup__footer--form {
  flex-wrap: wrap;
}

.ps-profile-box {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ps-profile-box__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.ps-profile-box__title {
  font-size: 14px;
  font-weight: 600;
  color: #3D4451;
}
.ps-profile-box__list {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.ps-profile-box__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 8px;
  border: 1px solid var(--color-border-soft, #D3DEEF);
  border-radius: 12px;
}
.ps-profile-box__item img {
  max-width: 140px;
  max-height: 64px;
}
.ps-profile-box__item figcaption {
  font-size: 12px;
  color: #758199;
  text-align: center;
  word-break: break-word;
}
.ps-profile-box__empty {
  font-size: 12px;
  color: #758199;
}

.ds-popup__list {
  margin-bottom: 12px;
}
.ds-popup__choice {
  width: 100%;
  text-align: left;
  background: transparent;
  cursor: pointer;
}
.ds-popup__choice.is-selected {
  border-color: var(--color-primary, #6F61EA);
  box-shadow: 0 0 0 1px var(--color-primary, #6F61EA);
}
.ds-popup__choice:disabled {
  opacity: 0.6;
  cursor: default;
}
.ds-popup__create {
  margin-bottom: 16px;
}
.ds-popup__sms {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.ds-popup__error {
  display: none;
  margin: 0 0 12px;
  color: #FA3E93;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 500;
}
.ds-popup__error.is-visible {
  display: block;
}
.ds-popup__busy {
  display: none;
  position: absolute;
  inset: 0;
  z-index: 1;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  background: #FFFFFF;
}
.ds-popup__busy-spinner {
  width: 48px;
  height: 48px;
  border-width: 4px;
}
.ds-popup__busy-label {
  margin: 0;
  color: #596476;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 500;
}
.ds-popup.is-busy .ps-popup__backdrop {
  cursor: progress;
}
.ds-popup.is-busy .ds-popup__busy {
  display: flex;
}

.access-rule__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 24px;
  align-items: stretch;
}
@media (max-width: 991.98px) {
  .access-rule__layout {
    grid-template-columns: minmax(0, 1fr);
  }
}
.access-rule__criteria {
  padding: 16px;
  border: 1px solid #D3DEEF;
  border-radius: 12px;
  background: #FFFFFF;
}
.access-rule__conditions {
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #D3DEEF;
}
.access-rule__conditions-title {
  margin-bottom: 12px;
  font-weight: 600;
}
.access-rule__workers {
  display: flex;
  flex-direction: column;
  padding: 16px;
  border-radius: 12px;
  background: #f4f7ff;
}
.access-rule__workers-head {
  display: flex;
  align-items: center;
  margin-bottom: 12px;
  gap: 10px;
}
.access-rule__workers-list {
  flex: 1 1 auto;
  min-height: 420px;
  height: 0;
  margin-top: 12px;
  padding-right: 12px;
  overflow-y: auto;
}
.access-rule__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid #A5B3C9;
}
.access-rule__row:last-child {
  border-bottom: 0;
}
.access-rule__row-name {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1 1 auto;
}
.access-rule__row-index {
  min-width: 28px;
  color: var(--color-text-subtle);
}
.access-rule__row-details {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--color-text-muted);
}
.access-rule__row-details .my_tooltip {
  display: block;
  min-width: 0;
}
.access-rule__row-details .my_tooltip > span {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.access-rule__drop {
  color: var(--color-text-subtle);
  cursor: pointer;
}
.access-rule__drop:hover {
  color: var(--color-danger);
}
.access-rule__more {
  display: none;
  padding: 12px;
  font-size: 20px;
  text-align: center;
}
.access-rule .is-muted {
  opacity: 0.45;
}

.access-rule-field__count {
  margin-top: 8px;
  color: var(--color-text-muted);
}

.access-orgs {
  padding: 8px 12px;
  border: 1px solid #D3DEEF;
  border-radius: 12px;
  background: #FFFFFF;
}
.access-orgs__item {
  padding: 8px 0;
}
.access-orgs__item:last-child {
  border-bottom: 0;
}
.access-orgs__head {
  display: flex;
  align-items: center;
  gap: 8px;
}
.access-orgs__toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  color: #758199;
  cursor: pointer;
  transition: transform 0.15s;
}
.access-orgs__item.is-expanded .access-orgs__toggle {
  transform: rotate(180deg);
}
.access-orgs__title {
  margin: 0;
  cursor: pointer;
}
.access-orgs__body {
  display: none;
  flex-direction: column;
  gap: 12px;
  padding: 12px 0 0 24px;
}
.access-orgs__body.is-open {
  display: flex;
}
.access-orgs__body .form-group {
  margin-bottom: 0;
}
.access-orgs__body.is-frozen {
  opacity: 0.45;
  pointer-events: none;
}

.container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 16px;
  padding-right: 16px;
}
@media (min-width: 576px) {
  .container {
    max-width: 576px;
  }
}
@media (min-width: 768px) {
  .container {
    max-width: 768px;
  }
}
@media (min-width: 992px) {
  .container {
    max-width: 992px;
  }
}
@media (min-width: 1200px) {
  .container {
    max-width: 1200px;
  }
}
@media (min-width: 1440px) {
  .container {
    max-width: 1440px;
  }
}

.section {
  width: 100%;
  padding-left: 16px;
  padding-right: 16px;
}
@media (min-width: 768px) {
  .section {
    padding-left: 24px;
    padding-right: 24px;
  }
}
@media (min-width: 1200px) {
  .section {
    padding-left: 32px;
    padding-right: 32px;
  }
}

.block {
  display: block;
}

.inline-block {
  display: inline-block;
}

.inline {
  display: inline;
}

.flex {
  display: flex;
}

.inline-flex {
  display: inline-flex;
}

.grid {
  display: grid;
}

.inline-grid {
  display: inline-grid;
}

.table {
  display: table;
}

.table-row {
  display: table-row;
}

.table-cell {
  display: table-cell;
}

.hidden {
  display: none;
}

@media (min-width: 576px) {
  .sm\:block {
    display: block;
  }
  .sm\:inline-block {
    display: inline-block;
  }
  .sm\:inline {
    display: inline;
  }
  .sm\:flex {
    display: flex;
  }
  .sm\:inline-flex {
    display: inline-flex;
  }
  .sm\:grid {
    display: grid;
  }
  .sm\:inline-grid {
    display: inline-grid;
  }
  .sm\:table {
    display: table;
  }
  .sm\:table-row {
    display: table-row;
  }
  .sm\:table-cell {
    display: table-cell;
  }
  .sm\:hidden {
    display: none;
  }
}
@media (min-width: 768px) {
  .md\:block {
    display: block;
  }
  .md\:inline-block {
    display: inline-block;
  }
  .md\:inline {
    display: inline;
  }
  .md\:flex {
    display: flex;
  }
  .md\:inline-flex {
    display: inline-flex;
  }
  .md\:grid {
    display: grid;
  }
  .md\:inline-grid {
    display: inline-grid;
  }
  .md\:table {
    display: table;
  }
  .md\:table-row {
    display: table-row;
  }
  .md\:table-cell {
    display: table-cell;
  }
  .md\:hidden {
    display: none;
  }
}
@media (min-width: 992px) {
  .lg\:block {
    display: block;
  }
  .lg\:inline-block {
    display: inline-block;
  }
  .lg\:inline {
    display: inline;
  }
  .lg\:flex {
    display: flex;
  }
  .lg\:inline-flex {
    display: inline-flex;
  }
  .lg\:grid {
    display: grid;
  }
  .lg\:inline-grid {
    display: inline-grid;
  }
  .lg\:table {
    display: table;
  }
  .lg\:table-row {
    display: table-row;
  }
  .lg\:table-cell {
    display: table-cell;
  }
  .lg\:hidden {
    display: none;
  }
}
@media (min-width: 1200px) {
  .xl\:block {
    display: block;
  }
  .xl\:inline-block {
    display: inline-block;
  }
  .xl\:inline {
    display: inline;
  }
  .xl\:flex {
    display: flex;
  }
  .xl\:inline-flex {
    display: inline-flex;
  }
  .xl\:grid {
    display: grid;
  }
  .xl\:inline-grid {
    display: inline-grid;
  }
  .xl\:table {
    display: table;
  }
  .xl\:table-row {
    display: table-row;
  }
  .xl\:table-cell {
    display: table-cell;
  }
  .xl\:hidden {
    display: none;
  }
}
@media (min-width: 1440px) {
  .xxl\:block {
    display: block;
  }
  .xxl\:inline-block {
    display: inline-block;
  }
  .xxl\:inline {
    display: inline;
  }
  .xxl\:flex {
    display: flex;
  }
  .xxl\:inline-flex {
    display: inline-flex;
  }
  .xxl\:grid {
    display: grid;
  }
  .xxl\:inline-grid {
    display: inline-grid;
  }
  .xxl\:table {
    display: table;
  }
  .xxl\:table-row {
    display: table-row;
  }
  .xxl\:table-cell {
    display: table-cell;
  }
  .xxl\:hidden {
    display: none;
  }
}
.overflow-auto {
  overflow: auto;
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-visible {
  overflow: visible;
}

.overflow-scroll {
  overflow: scroll;
}

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

.overflow-y-auto {
  overflow-y: auto;
}

.overflow-x-hidden {
  overflow-x: hidden;
}

.overflow-y-hidden {
  overflow-y: hidden;
}

@media (min-width: 576px) {
  .sm\:overflow-auto {
    overflow: auto;
  }
  .sm\:overflow-hidden {
    overflow: hidden;
  }
  .sm\:overflow-visible {
    overflow: visible;
  }
  .sm\:overflow-scroll {
    overflow: scroll;
  }
  .sm\:overflow-x-auto {
    overflow-x: auto;
  }
  .sm\:overflow-y-auto {
    overflow-y: auto;
  }
  .sm\:overflow-x-hidden {
    overflow-x: hidden;
  }
  .sm\:overflow-y-hidden {
    overflow-y: hidden;
  }
}
@media (min-width: 768px) {
  .md\:overflow-auto {
    overflow: auto;
  }
  .md\:overflow-hidden {
    overflow: hidden;
  }
  .md\:overflow-visible {
    overflow: visible;
  }
  .md\:overflow-scroll {
    overflow: scroll;
  }
  .md\:overflow-x-auto {
    overflow-x: auto;
  }
  .md\:overflow-y-auto {
    overflow-y: auto;
  }
  .md\:overflow-x-hidden {
    overflow-x: hidden;
  }
  .md\:overflow-y-hidden {
    overflow-y: hidden;
  }
}
@media (min-width: 992px) {
  .lg\:overflow-auto {
    overflow: auto;
  }
  .lg\:overflow-hidden {
    overflow: hidden;
  }
  .lg\:overflow-visible {
    overflow: visible;
  }
  .lg\:overflow-scroll {
    overflow: scroll;
  }
  .lg\:overflow-x-auto {
    overflow-x: auto;
  }
  .lg\:overflow-y-auto {
    overflow-y: auto;
  }
  .lg\:overflow-x-hidden {
    overflow-x: hidden;
  }
  .lg\:overflow-y-hidden {
    overflow-y: hidden;
  }
}
@media (min-width: 1200px) {
  .xl\:overflow-auto {
    overflow: auto;
  }
  .xl\:overflow-hidden {
    overflow: hidden;
  }
  .xl\:overflow-visible {
    overflow: visible;
  }
  .xl\:overflow-scroll {
    overflow: scroll;
  }
  .xl\:overflow-x-auto {
    overflow-x: auto;
  }
  .xl\:overflow-y-auto {
    overflow-y: auto;
  }
  .xl\:overflow-x-hidden {
    overflow-x: hidden;
  }
  .xl\:overflow-y-hidden {
    overflow-y: hidden;
  }
}
@media (min-width: 1440px) {
  .xxl\:overflow-auto {
    overflow: auto;
  }
  .xxl\:overflow-hidden {
    overflow: hidden;
  }
  .xxl\:overflow-visible {
    overflow: visible;
  }
  .xxl\:overflow-scroll {
    overflow: scroll;
  }
  .xxl\:overflow-x-auto {
    overflow-x: auto;
  }
  .xxl\:overflow-y-auto {
    overflow-y: auto;
  }
  .xxl\:overflow-x-hidden {
    overflow-x: hidden;
  }
  .xxl\:overflow-y-hidden {
    overflow-y: hidden;
  }
}
.visible {
  visibility: visible;
}

.invisible {
  visibility: hidden;
}

.cursor-pointer {
  cursor: pointer;
}

.cursor-default {
  cursor: default;
}

.cursor-not-allowed {
  cursor: not-allowed;
}

.cursor-text {
  cursor: text;
}

.cursor-grab {
  cursor: grab;
}

.pointer-events-none {
  pointer-events: none;
}

.pointer-events-auto {
  pointer-events: auto;
}

.select-none {
  user-select: none;
}

.select-text {
  user-select: text;
}

.select-auto {
  user-select: auto;
}

.select-all {
  user-select: all;
}

.flex-row {
  flex-direction: row;
}

.flex-row-reverse {
  flex-direction: row-reverse;
}

.flex-col {
  flex-direction: column;
}

.flex-col-reverse {
  flex-direction: column-reverse;
}

@media (min-width: 576px) {
  .sm\:flex-row {
    flex-direction: row;
  }
  .sm\:flex-row-reverse {
    flex-direction: row-reverse;
  }
  .sm\:flex-col {
    flex-direction: column;
  }
  .sm\:flex-col-reverse {
    flex-direction: column-reverse;
  }
}
@media (min-width: 768px) {
  .md\:flex-row {
    flex-direction: row;
  }
  .md\:flex-row-reverse {
    flex-direction: row-reverse;
  }
  .md\:flex-col {
    flex-direction: column;
  }
  .md\:flex-col-reverse {
    flex-direction: column-reverse;
  }
}
@media (min-width: 992px) {
  .lg\:flex-row {
    flex-direction: row;
  }
  .lg\:flex-row-reverse {
    flex-direction: row-reverse;
  }
  .lg\:flex-col {
    flex-direction: column;
  }
  .lg\:flex-col-reverse {
    flex-direction: column-reverse;
  }
}
@media (min-width: 1200px) {
  .xl\:flex-row {
    flex-direction: row;
  }
  .xl\:flex-row-reverse {
    flex-direction: row-reverse;
  }
  .xl\:flex-col {
    flex-direction: column;
  }
  .xl\:flex-col-reverse {
    flex-direction: column-reverse;
  }
}
@media (min-width: 1440px) {
  .xxl\:flex-row {
    flex-direction: row;
  }
  .xxl\:flex-row-reverse {
    flex-direction: row-reverse;
  }
  .xxl\:flex-col {
    flex-direction: column;
  }
  .xxl\:flex-col-reverse {
    flex-direction: column-reverse;
  }
}
.flex-wrap {
  flex-wrap: wrap;
}

.flex-wrap-reverse {
  flex-wrap: wrap-reverse;
}

.flex-nowrap {
  flex-wrap: nowrap;
}

@media (min-width: 576px) {
  .sm\:flex-wrap {
    flex-wrap: wrap;
  }
  .sm\:flex-wrap-reverse {
    flex-wrap: wrap-reverse;
  }
  .sm\:flex-nowrap {
    flex-wrap: nowrap;
  }
}
@media (min-width: 768px) {
  .md\:flex-wrap {
    flex-wrap: wrap;
  }
  .md\:flex-wrap-reverse {
    flex-wrap: wrap-reverse;
  }
  .md\:flex-nowrap {
    flex-wrap: nowrap;
  }
}
@media (min-width: 992px) {
  .lg\:flex-wrap {
    flex-wrap: wrap;
  }
  .lg\:flex-wrap-reverse {
    flex-wrap: wrap-reverse;
  }
  .lg\:flex-nowrap {
    flex-wrap: nowrap;
  }
}
@media (min-width: 1200px) {
  .xl\:flex-wrap {
    flex-wrap: wrap;
  }
  .xl\:flex-wrap-reverse {
    flex-wrap: wrap-reverse;
  }
  .xl\:flex-nowrap {
    flex-wrap: nowrap;
  }
}
@media (min-width: 1440px) {
  .xxl\:flex-wrap {
    flex-wrap: wrap;
  }
  .xxl\:flex-wrap-reverse {
    flex-wrap: wrap-reverse;
  }
  .xxl\:flex-nowrap {
    flex-wrap: nowrap;
  }
}
.justify-start {
  justify-content: flex-start;
}

.justify-end {
  justify-content: flex-end;
}

.justify-center {
  justify-content: center;
}

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

.justify-around {
  justify-content: space-around;
}

.justify-evenly {
  justify-content: space-evenly;
}

@media (min-width: 576px) {
  .sm\:justify-start {
    justify-content: flex-start;
  }
  .sm\:justify-end {
    justify-content: flex-end;
  }
  .sm\:justify-center {
    justify-content: center;
  }
  .sm\:justify-between {
    justify-content: space-between;
  }
  .sm\:justify-around {
    justify-content: space-around;
  }
  .sm\:justify-evenly {
    justify-content: space-evenly;
  }
}
@media (min-width: 768px) {
  .md\:justify-start {
    justify-content: flex-start;
  }
  .md\:justify-end {
    justify-content: flex-end;
  }
  .md\:justify-center {
    justify-content: center;
  }
  .md\:justify-between {
    justify-content: space-between;
  }
  .md\:justify-around {
    justify-content: space-around;
  }
  .md\:justify-evenly {
    justify-content: space-evenly;
  }
}
@media (min-width: 992px) {
  .lg\:justify-start {
    justify-content: flex-start;
  }
  .lg\:justify-end {
    justify-content: flex-end;
  }
  .lg\:justify-center {
    justify-content: center;
  }
  .lg\:justify-between {
    justify-content: space-between;
  }
  .lg\:justify-around {
    justify-content: space-around;
  }
  .lg\:justify-evenly {
    justify-content: space-evenly;
  }
}
@media (min-width: 1200px) {
  .xl\:justify-start {
    justify-content: flex-start;
  }
  .xl\:justify-end {
    justify-content: flex-end;
  }
  .xl\:justify-center {
    justify-content: center;
  }
  .xl\:justify-between {
    justify-content: space-between;
  }
  .xl\:justify-around {
    justify-content: space-around;
  }
  .xl\:justify-evenly {
    justify-content: space-evenly;
  }
}
@media (min-width: 1440px) {
  .xxl\:justify-start {
    justify-content: flex-start;
  }
  .xxl\:justify-end {
    justify-content: flex-end;
  }
  .xxl\:justify-center {
    justify-content: center;
  }
  .xxl\:justify-between {
    justify-content: space-between;
  }
  .xxl\:justify-around {
    justify-content: space-around;
  }
  .xxl\:justify-evenly {
    justify-content: space-evenly;
  }
}
.items-start {
  align-items: flex-start;
}

.items-end {
  align-items: flex-end;
}

.items-center {
  align-items: center;
}

.items-baseline {
  align-items: baseline;
}

.items-stretch {
  align-items: stretch;
}

@media (min-width: 576px) {
  .sm\:items-start {
    align-items: flex-start;
  }
  .sm\:items-end {
    align-items: flex-end;
  }
  .sm\:items-center {
    align-items: center;
  }
  .sm\:items-baseline {
    align-items: baseline;
  }
  .sm\:items-stretch {
    align-items: stretch;
  }
}
@media (min-width: 768px) {
  .md\:items-start {
    align-items: flex-start;
  }
  .md\:items-end {
    align-items: flex-end;
  }
  .md\:items-center {
    align-items: center;
  }
  .md\:items-baseline {
    align-items: baseline;
  }
  .md\:items-stretch {
    align-items: stretch;
  }
}
@media (min-width: 992px) {
  .lg\:items-start {
    align-items: flex-start;
  }
  .lg\:items-end {
    align-items: flex-end;
  }
  .lg\:items-center {
    align-items: center;
  }
  .lg\:items-baseline {
    align-items: baseline;
  }
  .lg\:items-stretch {
    align-items: stretch;
  }
}
@media (min-width: 1200px) {
  .xl\:items-start {
    align-items: flex-start;
  }
  .xl\:items-end {
    align-items: flex-end;
  }
  .xl\:items-center {
    align-items: center;
  }
  .xl\:items-baseline {
    align-items: baseline;
  }
  .xl\:items-stretch {
    align-items: stretch;
  }
}
@media (min-width: 1440px) {
  .xxl\:items-start {
    align-items: flex-start;
  }
  .xxl\:items-end {
    align-items: flex-end;
  }
  .xxl\:items-center {
    align-items: center;
  }
  .xxl\:items-baseline {
    align-items: baseline;
  }
  .xxl\:items-stretch {
    align-items: stretch;
  }
}
.self-auto {
  align-self: auto;
}

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

.self-end {
  align-self: flex-end;
}

.self-center {
  align-self: center;
}

.self-stretch {
  align-self: stretch;
}

@media (min-width: 576px) {
  .sm\:self-auto {
    align-self: auto;
  }
  .sm\:self-start {
    align-self: flex-start;
  }
  .sm\:self-end {
    align-self: flex-end;
  }
  .sm\:self-center {
    align-self: center;
  }
  .sm\:self-stretch {
    align-self: stretch;
  }
}
@media (min-width: 768px) {
  .md\:self-auto {
    align-self: auto;
  }
  .md\:self-start {
    align-self: flex-start;
  }
  .md\:self-end {
    align-self: flex-end;
  }
  .md\:self-center {
    align-self: center;
  }
  .md\:self-stretch {
    align-self: stretch;
  }
}
@media (min-width: 992px) {
  .lg\:self-auto {
    align-self: auto;
  }
  .lg\:self-start {
    align-self: flex-start;
  }
  .lg\:self-end {
    align-self: flex-end;
  }
  .lg\:self-center {
    align-self: center;
  }
  .lg\:self-stretch {
    align-self: stretch;
  }
}
@media (min-width: 1200px) {
  .xl\:self-auto {
    align-self: auto;
  }
  .xl\:self-start {
    align-self: flex-start;
  }
  .xl\:self-end {
    align-self: flex-end;
  }
  .xl\:self-center {
    align-self: center;
  }
  .xl\:self-stretch {
    align-self: stretch;
  }
}
@media (min-width: 1440px) {
  .xxl\:self-auto {
    align-self: auto;
  }
  .xxl\:self-start {
    align-self: flex-start;
  }
  .xxl\:self-end {
    align-self: flex-end;
  }
  .xxl\:self-center {
    align-self: center;
  }
  .xxl\:self-stretch {
    align-self: stretch;
  }
}
.content-start {
  align-content: flex-start;
}

.content-end {
  align-content: flex-end;
}

.content-center {
  align-content: center;
}

.content-between {
  align-content: space-between;
}

.content-around {
  align-content: space-around;
}

.content-stretch {
  align-content: stretch;
}

@media (min-width: 576px) {
  .sm\:content-start {
    align-content: flex-start;
  }
  .sm\:content-end {
    align-content: flex-end;
  }
  .sm\:content-center {
    align-content: center;
  }
  .sm\:content-between {
    align-content: space-between;
  }
  .sm\:content-around {
    align-content: space-around;
  }
  .sm\:content-stretch {
    align-content: stretch;
  }
}
@media (min-width: 768px) {
  .md\:content-start {
    align-content: flex-start;
  }
  .md\:content-end {
    align-content: flex-end;
  }
  .md\:content-center {
    align-content: center;
  }
  .md\:content-between {
    align-content: space-between;
  }
  .md\:content-around {
    align-content: space-around;
  }
  .md\:content-stretch {
    align-content: stretch;
  }
}
@media (min-width: 992px) {
  .lg\:content-start {
    align-content: flex-start;
  }
  .lg\:content-end {
    align-content: flex-end;
  }
  .lg\:content-center {
    align-content: center;
  }
  .lg\:content-between {
    align-content: space-between;
  }
  .lg\:content-around {
    align-content: space-around;
  }
  .lg\:content-stretch {
    align-content: stretch;
  }
}
@media (min-width: 1200px) {
  .xl\:content-start {
    align-content: flex-start;
  }
  .xl\:content-end {
    align-content: flex-end;
  }
  .xl\:content-center {
    align-content: center;
  }
  .xl\:content-between {
    align-content: space-between;
  }
  .xl\:content-around {
    align-content: space-around;
  }
  .xl\:content-stretch {
    align-content: stretch;
  }
}
@media (min-width: 1440px) {
  .xxl\:content-start {
    align-content: flex-start;
  }
  .xxl\:content-end {
    align-content: flex-end;
  }
  .xxl\:content-center {
    align-content: center;
  }
  .xxl\:content-between {
    align-content: space-between;
  }
  .xxl\:content-around {
    align-content: space-around;
  }
  .xxl\:content-stretch {
    align-content: stretch;
  }
}
.flex-1 {
  flex: 1 1 0%;
}

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

.flex-initial {
  flex: 0 1 auto;
}

.flex-none {
  flex: none;
}

.grow {
  flex-grow: 1;
}

.grow-0 {
  flex-grow: 0;
}

.shrink {
  flex-shrink: 1;
}

.shrink-0 {
  flex-shrink: 0;
}

@media (min-width: 576px) {
  .sm\:flex-1 {
    flex: 1 1 0%;
  }
  .sm\:flex-auto {
    flex: 1 1 auto;
  }
  .sm\:flex-initial {
    flex: 0 1 auto;
  }
  .sm\:flex-none {
    flex: none;
  }
  .sm\:grow {
    flex-grow: 1;
  }
  .sm\:grow-0 {
    flex-grow: 0;
  }
  .sm\:shrink {
    flex-shrink: 1;
  }
  .sm\:shrink-0 {
    flex-shrink: 0;
  }
}
@media (min-width: 768px) {
  .md\:flex-1 {
    flex: 1 1 0%;
  }
  .md\:flex-auto {
    flex: 1 1 auto;
  }
  .md\:flex-initial {
    flex: 0 1 auto;
  }
  .md\:flex-none {
    flex: none;
  }
  .md\:grow {
    flex-grow: 1;
  }
  .md\:grow-0 {
    flex-grow: 0;
  }
  .md\:shrink {
    flex-shrink: 1;
  }
  .md\:shrink-0 {
    flex-shrink: 0;
  }
}
@media (min-width: 992px) {
  .lg\:flex-1 {
    flex: 1 1 0%;
  }
  .lg\:flex-auto {
    flex: 1 1 auto;
  }
  .lg\:flex-initial {
    flex: 0 1 auto;
  }
  .lg\:flex-none {
    flex: none;
  }
  .lg\:grow {
    flex-grow: 1;
  }
  .lg\:grow-0 {
    flex-grow: 0;
  }
  .lg\:shrink {
    flex-shrink: 1;
  }
  .lg\:shrink-0 {
    flex-shrink: 0;
  }
}
@media (min-width: 1200px) {
  .xl\:flex-1 {
    flex: 1 1 0%;
  }
  .xl\:flex-auto {
    flex: 1 1 auto;
  }
  .xl\:flex-initial {
    flex: 0 1 auto;
  }
  .xl\:flex-none {
    flex: none;
  }
  .xl\:grow {
    flex-grow: 1;
  }
  .xl\:grow-0 {
    flex-grow: 0;
  }
  .xl\:shrink {
    flex-shrink: 1;
  }
  .xl\:shrink-0 {
    flex-shrink: 0;
  }
}
@media (min-width: 1440px) {
  .xxl\:flex-1 {
    flex: 1 1 0%;
  }
  .xxl\:flex-auto {
    flex: 1 1 auto;
  }
  .xxl\:flex-initial {
    flex: 0 1 auto;
  }
  .xxl\:flex-none {
    flex: none;
  }
  .xxl\:grow {
    flex-grow: 1;
  }
  .xxl\:grow-0 {
    flex-grow: 0;
  }
  .xxl\:shrink {
    flex-shrink: 1;
  }
  .xxl\:shrink-0 {
    flex-shrink: 0;
  }
}
.order-0 {
  order: 0;
}

.order-1 {
  order: 1;
}

.order-2 {
  order: 2;
}

.order-3 {
  order: 3;
}

.order-4 {
  order: 4;
}

.order-5 {
  order: 5;
}

.order-6 {
  order: 6;
}

.order-first {
  order: -9999;
}

.order-last {
  order: 9999;
}

.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.grid-cols-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid-cols-4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.grid-cols-5 {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.grid-cols-6 {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.grid-cols-7 {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.grid-cols-8 {
  grid-template-columns: repeat(8, minmax(0, 1fr));
}

.grid-cols-9 {
  grid-template-columns: repeat(9, minmax(0, 1fr));
}

.grid-cols-10 {
  grid-template-columns: repeat(10, minmax(0, 1fr));
}

.grid-cols-11 {
  grid-template-columns: repeat(11, minmax(0, 1fr));
}

.grid-cols-12 {
  grid-template-columns: repeat(12, minmax(0, 1fr));
}

@media (min-width: 576px) {
  .sm\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .sm\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .sm\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .sm\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .sm\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .sm\:grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .sm\:grid-cols-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .sm\:grid-cols-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .sm\:grid-cols-9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .sm\:grid-cols-10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .sm\:grid-cols-11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .sm\:grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
}
@media (min-width: 768px) {
  .md\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .md\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .md\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .md\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .md\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .md\:grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .md\:grid-cols-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .md\:grid-cols-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .md\:grid-cols-9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .md\:grid-cols-10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .md\:grid-cols-11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .md\:grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
}
@media (min-width: 992px) {
  .lg\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .lg\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .lg\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .lg\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .lg\:grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .lg\:grid-cols-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .lg\:grid-cols-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .lg\:grid-cols-9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .lg\:grid-cols-10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .lg\:grid-cols-11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .lg\:grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
}
@media (min-width: 1200px) {
  .xl\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .xl\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .xl\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xl\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .xl\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .xl\:grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .xl\:grid-cols-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .xl\:grid-cols-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .xl\:grid-cols-9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .xl\:grid-cols-10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .xl\:grid-cols-11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .xl\:grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
}
@media (min-width: 1440px) {
  .xxl\:grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }
  .xxl\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .xxl\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .xxl\:grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .xxl\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .xxl\:grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
  .xxl\:grid-cols-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .xxl\:grid-cols-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
  }
  .xxl\:grid-cols-9 {
    grid-template-columns: repeat(9, minmax(0, 1fr));
  }
  .xxl\:grid-cols-10 {
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }
  .xxl\:grid-cols-11 {
    grid-template-columns: repeat(11, minmax(0, 1fr));
  }
  .xxl\:grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr));
  }
}
.grid-rows-1 {
  grid-template-rows: repeat(1, minmax(0, 1fr));
}

.grid-rows-2 {
  grid-template-rows: repeat(2, minmax(0, 1fr));
}

.grid-rows-3 {
  grid-template-rows: repeat(3, minmax(0, 1fr));
}

.grid-rows-4 {
  grid-template-rows: repeat(4, minmax(0, 1fr));
}

.grid-rows-5 {
  grid-template-rows: repeat(5, minmax(0, 1fr));
}

.grid-rows-6 {
  grid-template-rows: repeat(6, minmax(0, 1fr));
}

@media (min-width: 576px) {
  .sm\:grid-rows-1 {
    grid-template-rows: repeat(1, minmax(0, 1fr));
  }
  .sm\:grid-rows-2 {
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }
  .sm\:grid-rows-3 {
    grid-template-rows: repeat(3, minmax(0, 1fr));
  }
  .sm\:grid-rows-4 {
    grid-template-rows: repeat(4, minmax(0, 1fr));
  }
  .sm\:grid-rows-5 {
    grid-template-rows: repeat(5, minmax(0, 1fr));
  }
  .sm\:grid-rows-6 {
    grid-template-rows: repeat(6, minmax(0, 1fr));
  }
}
@media (min-width: 768px) {
  .md\:grid-rows-1 {
    grid-template-rows: repeat(1, minmax(0, 1fr));
  }
  .md\:grid-rows-2 {
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }
  .md\:grid-rows-3 {
    grid-template-rows: repeat(3, minmax(0, 1fr));
  }
  .md\:grid-rows-4 {
    grid-template-rows: repeat(4, minmax(0, 1fr));
  }
  .md\:grid-rows-5 {
    grid-template-rows: repeat(5, minmax(0, 1fr));
  }
  .md\:grid-rows-6 {
    grid-template-rows: repeat(6, minmax(0, 1fr));
  }
}
@media (min-width: 992px) {
  .lg\:grid-rows-1 {
    grid-template-rows: repeat(1, minmax(0, 1fr));
  }
  .lg\:grid-rows-2 {
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }
  .lg\:grid-rows-3 {
    grid-template-rows: repeat(3, minmax(0, 1fr));
  }
  .lg\:grid-rows-4 {
    grid-template-rows: repeat(4, minmax(0, 1fr));
  }
  .lg\:grid-rows-5 {
    grid-template-rows: repeat(5, minmax(0, 1fr));
  }
  .lg\:grid-rows-6 {
    grid-template-rows: repeat(6, minmax(0, 1fr));
  }
}
@media (min-width: 1200px) {
  .xl\:grid-rows-1 {
    grid-template-rows: repeat(1, minmax(0, 1fr));
  }
  .xl\:grid-rows-2 {
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }
  .xl\:grid-rows-3 {
    grid-template-rows: repeat(3, minmax(0, 1fr));
  }
  .xl\:grid-rows-4 {
    grid-template-rows: repeat(4, minmax(0, 1fr));
  }
  .xl\:grid-rows-5 {
    grid-template-rows: repeat(5, minmax(0, 1fr));
  }
  .xl\:grid-rows-6 {
    grid-template-rows: repeat(6, minmax(0, 1fr));
  }
}
@media (min-width: 1440px) {
  .xxl\:grid-rows-1 {
    grid-template-rows: repeat(1, minmax(0, 1fr));
  }
  .xxl\:grid-rows-2 {
    grid-template-rows: repeat(2, minmax(0, 1fr));
  }
  .xxl\:grid-rows-3 {
    grid-template-rows: repeat(3, minmax(0, 1fr));
  }
  .xxl\:grid-rows-4 {
    grid-template-rows: repeat(4, minmax(0, 1fr));
  }
  .xxl\:grid-rows-5 {
    grid-template-rows: repeat(5, minmax(0, 1fr));
  }
  .xxl\:grid-rows-6 {
    grid-template-rows: repeat(6, minmax(0, 1fr));
  }
}
.col-span-full {
  grid-column: 1 / -1;
}

.col-span-1 {
  grid-column: span 1 / span 1;
}

.col-span-2 {
  grid-column: span 2 / span 2;
}

.col-span-3 {
  grid-column: span 3 / span 3;
}

.col-span-4 {
  grid-column: span 4 / span 4;
}

.col-span-5 {
  grid-column: span 5 / span 5;
}

.col-span-6 {
  grid-column: span 6 / span 6;
}

.col-span-7 {
  grid-column: span 7 / span 7;
}

.col-span-8 {
  grid-column: span 8 / span 8;
}

.col-span-9 {
  grid-column: span 9 / span 9;
}

.col-span-10 {
  grid-column: span 10 / span 10;
}

.col-span-11 {
  grid-column: span 11 / span 11;
}

.col-span-12 {
  grid-column: span 12 / span 12;
}

@media (min-width: 576px) {
  .sm\:col-span-full {
    grid-column: 1 / -1;
  }
  .sm\:col-span-1 {
    grid-column: span 1 / span 1;
  }
  .sm\:col-span-2 {
    grid-column: span 2 / span 2;
  }
  .sm\:col-span-3 {
    grid-column: span 3 / span 3;
  }
  .sm\:col-span-4 {
    grid-column: span 4 / span 4;
  }
  .sm\:col-span-5 {
    grid-column: span 5 / span 5;
  }
  .sm\:col-span-6 {
    grid-column: span 6 / span 6;
  }
  .sm\:col-span-7 {
    grid-column: span 7 / span 7;
  }
  .sm\:col-span-8 {
    grid-column: span 8 / span 8;
  }
  .sm\:col-span-9 {
    grid-column: span 9 / span 9;
  }
  .sm\:col-span-10 {
    grid-column: span 10 / span 10;
  }
  .sm\:col-span-11 {
    grid-column: span 11 / span 11;
  }
  .sm\:col-span-12 {
    grid-column: span 12 / span 12;
  }
}
@media (min-width: 768px) {
  .md\:col-span-full {
    grid-column: 1 / -1;
  }
  .md\:col-span-1 {
    grid-column: span 1 / span 1;
  }
  .md\:col-span-2 {
    grid-column: span 2 / span 2;
  }
  .md\:col-span-3 {
    grid-column: span 3 / span 3;
  }
  .md\:col-span-4 {
    grid-column: span 4 / span 4;
  }
  .md\:col-span-5 {
    grid-column: span 5 / span 5;
  }
  .md\:col-span-6 {
    grid-column: span 6 / span 6;
  }
  .md\:col-span-7 {
    grid-column: span 7 / span 7;
  }
  .md\:col-span-8 {
    grid-column: span 8 / span 8;
  }
  .md\:col-span-9 {
    grid-column: span 9 / span 9;
  }
  .md\:col-span-10 {
    grid-column: span 10 / span 10;
  }
  .md\:col-span-11 {
    grid-column: span 11 / span 11;
  }
  .md\:col-span-12 {
    grid-column: span 12 / span 12;
  }
}
@media (min-width: 992px) {
  .lg\:col-span-full {
    grid-column: 1 / -1;
  }
  .lg\:col-span-1 {
    grid-column: span 1 / span 1;
  }
  .lg\:col-span-2 {
    grid-column: span 2 / span 2;
  }
  .lg\:col-span-3 {
    grid-column: span 3 / span 3;
  }
  .lg\:col-span-4 {
    grid-column: span 4 / span 4;
  }
  .lg\:col-span-5 {
    grid-column: span 5 / span 5;
  }
  .lg\:col-span-6 {
    grid-column: span 6 / span 6;
  }
  .lg\:col-span-7 {
    grid-column: span 7 / span 7;
  }
  .lg\:col-span-8 {
    grid-column: span 8 / span 8;
  }
  .lg\:col-span-9 {
    grid-column: span 9 / span 9;
  }
  .lg\:col-span-10 {
    grid-column: span 10 / span 10;
  }
  .lg\:col-span-11 {
    grid-column: span 11 / span 11;
  }
  .lg\:col-span-12 {
    grid-column: span 12 / span 12;
  }
}
@media (min-width: 1200px) {
  .xl\:col-span-full {
    grid-column: 1 / -1;
  }
  .xl\:col-span-1 {
    grid-column: span 1 / span 1;
  }
  .xl\:col-span-2 {
    grid-column: span 2 / span 2;
  }
  .xl\:col-span-3 {
    grid-column: span 3 / span 3;
  }
  .xl\:col-span-4 {
    grid-column: span 4 / span 4;
  }
  .xl\:col-span-5 {
    grid-column: span 5 / span 5;
  }
  .xl\:col-span-6 {
    grid-column: span 6 / span 6;
  }
  .xl\:col-span-7 {
    grid-column: span 7 / span 7;
  }
  .xl\:col-span-8 {
    grid-column: span 8 / span 8;
  }
  .xl\:col-span-9 {
    grid-column: span 9 / span 9;
  }
  .xl\:col-span-10 {
    grid-column: span 10 / span 10;
  }
  .xl\:col-span-11 {
    grid-column: span 11 / span 11;
  }
  .xl\:col-span-12 {
    grid-column: span 12 / span 12;
  }
}
@media (min-width: 1440px) {
  .xxl\:col-span-full {
    grid-column: 1 / -1;
  }
  .xxl\:col-span-1 {
    grid-column: span 1 / span 1;
  }
  .xxl\:col-span-2 {
    grid-column: span 2 / span 2;
  }
  .xxl\:col-span-3 {
    grid-column: span 3 / span 3;
  }
  .xxl\:col-span-4 {
    grid-column: span 4 / span 4;
  }
  .xxl\:col-span-5 {
    grid-column: span 5 / span 5;
  }
  .xxl\:col-span-6 {
    grid-column: span 6 / span 6;
  }
  .xxl\:col-span-7 {
    grid-column: span 7 / span 7;
  }
  .xxl\:col-span-8 {
    grid-column: span 8 / span 8;
  }
  .xxl\:col-span-9 {
    grid-column: span 9 / span 9;
  }
  .xxl\:col-span-10 {
    grid-column: span 10 / span 10;
  }
  .xxl\:col-span-11 {
    grid-column: span 11 / span 11;
  }
  .xxl\:col-span-12 {
    grid-column: span 12 / span 12;
  }
}
.row-span-full {
  grid-row: 1 / -1;
}

.row-span-1 {
  grid-row: span 1 / span 1;
}

.row-span-2 {
  grid-row: span 2 / span 2;
}

.row-span-3 {
  grid-row: span 3 / span 3;
}

.row-span-4 {
  grid-row: span 4 / span 4;
}

.row-span-5 {
  grid-row: span 5 / span 5;
}

.row-span-6 {
  grid-row: span 6 / span 6;
}

@media (min-width: 576px) {
  .sm\:row-span-full {
    grid-row: 1 / -1;
  }
  .sm\:row-span-1 {
    grid-row: span 1 / span 1;
  }
  .sm\:row-span-2 {
    grid-row: span 2 / span 2;
  }
  .sm\:row-span-3 {
    grid-row: span 3 / span 3;
  }
  .sm\:row-span-4 {
    grid-row: span 4 / span 4;
  }
  .sm\:row-span-5 {
    grid-row: span 5 / span 5;
  }
  .sm\:row-span-6 {
    grid-row: span 6 / span 6;
  }
}
@media (min-width: 768px) {
  .md\:row-span-full {
    grid-row: 1 / -1;
  }
  .md\:row-span-1 {
    grid-row: span 1 / span 1;
  }
  .md\:row-span-2 {
    grid-row: span 2 / span 2;
  }
  .md\:row-span-3 {
    grid-row: span 3 / span 3;
  }
  .md\:row-span-4 {
    grid-row: span 4 / span 4;
  }
  .md\:row-span-5 {
    grid-row: span 5 / span 5;
  }
  .md\:row-span-6 {
    grid-row: span 6 / span 6;
  }
}
@media (min-width: 992px) {
  .lg\:row-span-full {
    grid-row: 1 / -1;
  }
  .lg\:row-span-1 {
    grid-row: span 1 / span 1;
  }
  .lg\:row-span-2 {
    grid-row: span 2 / span 2;
  }
  .lg\:row-span-3 {
    grid-row: span 3 / span 3;
  }
  .lg\:row-span-4 {
    grid-row: span 4 / span 4;
  }
  .lg\:row-span-5 {
    grid-row: span 5 / span 5;
  }
  .lg\:row-span-6 {
    grid-row: span 6 / span 6;
  }
}
@media (min-width: 1200px) {
  .xl\:row-span-full {
    grid-row: 1 / -1;
  }
  .xl\:row-span-1 {
    grid-row: span 1 / span 1;
  }
  .xl\:row-span-2 {
    grid-row: span 2 / span 2;
  }
  .xl\:row-span-3 {
    grid-row: span 3 / span 3;
  }
  .xl\:row-span-4 {
    grid-row: span 4 / span 4;
  }
  .xl\:row-span-5 {
    grid-row: span 5 / span 5;
  }
  .xl\:row-span-6 {
    grid-row: span 6 / span 6;
  }
}
@media (min-width: 1440px) {
  .xxl\:row-span-full {
    grid-row: 1 / -1;
  }
  .xxl\:row-span-1 {
    grid-row: span 1 / span 1;
  }
  .xxl\:row-span-2 {
    grid-row: span 2 / span 2;
  }
  .xxl\:row-span-3 {
    grid-row: span 3 / span 3;
  }
  .xxl\:row-span-4 {
    grid-row: span 4 / span 4;
  }
  .xxl\:row-span-5 {
    grid-row: span 5 / span 5;
  }
  .xxl\:row-span-6 {
    grid-row: span 6 / span 6;
  }
}
.grid-auto-200 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}

.grid-auto-240 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.grid-auto-320 {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}

.grid-flow-row {
  grid-auto-flow: row;
}

.grid-flow-col {
  grid-auto-flow: column;
}

.grid-flow-row-dense {
  grid-auto-flow: row dense;
}

.grid-flow-col-dense {
  grid-auto-flow: column dense;
}

@media (min-width: 576px) {
  .sm\:grid-flow-row {
    grid-auto-flow: row;
  }
  .sm\:grid-flow-col {
    grid-auto-flow: column;
  }
  .sm\:grid-flow-row-dense {
    grid-auto-flow: row dense;
  }
  .sm\:grid-flow-col-dense {
    grid-auto-flow: column dense;
  }
}
@media (min-width: 768px) {
  .md\:grid-flow-row {
    grid-auto-flow: row;
  }
  .md\:grid-flow-col {
    grid-auto-flow: column;
  }
  .md\:grid-flow-row-dense {
    grid-auto-flow: row dense;
  }
  .md\:grid-flow-col-dense {
    grid-auto-flow: column dense;
  }
}
@media (min-width: 992px) {
  .lg\:grid-flow-row {
    grid-auto-flow: row;
  }
  .lg\:grid-flow-col {
    grid-auto-flow: column;
  }
  .lg\:grid-flow-row-dense {
    grid-auto-flow: row dense;
  }
  .lg\:grid-flow-col-dense {
    grid-auto-flow: column dense;
  }
}
@media (min-width: 1200px) {
  .xl\:grid-flow-row {
    grid-auto-flow: row;
  }
  .xl\:grid-flow-col {
    grid-auto-flow: column;
  }
  .xl\:grid-flow-row-dense {
    grid-auto-flow: row dense;
  }
  .xl\:grid-flow-col-dense {
    grid-auto-flow: column dense;
  }
}
@media (min-width: 1440px) {
  .xxl\:grid-flow-row {
    grid-auto-flow: row;
  }
  .xxl\:grid-flow-col {
    grid-auto-flow: column;
  }
  .xxl\:grid-flow-row-dense {
    grid-auto-flow: row dense;
  }
  .xxl\:grid-flow-col-dense {
    grid-auto-flow: column dense;
  }
}
.place-items-center {
  place-items: center;
}

.place-items-start {
  place-items: start;
}

.place-items-end {
  place-items: end;
}

.place-items-stretch {
  place-items: stretch;
}

@media (min-width: 576px) {
  .sm\:place-items-center {
    place-items: center;
  }
  .sm\:place-items-start {
    place-items: start;
  }
  .sm\:place-items-end {
    place-items: end;
  }
  .sm\:place-items-stretch {
    place-items: stretch;
  }
}
@media (min-width: 768px) {
  .md\:place-items-center {
    place-items: center;
  }
  .md\:place-items-start {
    place-items: start;
  }
  .md\:place-items-end {
    place-items: end;
  }
  .md\:place-items-stretch {
    place-items: stretch;
  }
}
@media (min-width: 992px) {
  .lg\:place-items-center {
    place-items: center;
  }
  .lg\:place-items-start {
    place-items: start;
  }
  .lg\:place-items-end {
    place-items: end;
  }
  .lg\:place-items-stretch {
    place-items: stretch;
  }
}
@media (min-width: 1200px) {
  .xl\:place-items-center {
    place-items: center;
  }
  .xl\:place-items-start {
    place-items: start;
  }
  .xl\:place-items-end {
    place-items: end;
  }
  .xl\:place-items-stretch {
    place-items: stretch;
  }
}
@media (min-width: 1440px) {
  .xxl\:place-items-center {
    place-items: center;
  }
  .xxl\:place-items-start {
    place-items: start;
  }
  .xxl\:place-items-end {
    place-items: end;
  }
  .xxl\:place-items-stretch {
    place-items: stretch;
  }
}
.p-0 {
  padding: 0;
}

.p-2 {
  padding: 2px;
}

.p-4 {
  padding: 4px;
}

.p-6 {
  padding: 6px;
}

.p-8 {
  padding: 8px;
}

.p-10 {
  padding: 10px;
}

.p-12 {
  padding: 12px;
}

.p-14 {
  padding: 14px;
}

.p-16 {
  padding: 16px;
}

.p-20 {
  padding: 20px;
}

.p-24 {
  padding: 24px;
}

.p-28 {
  padding: 28px;
}

.p-30 {
  padding: 30px;
}

.p-32 {
  padding: 32px;
}

.p-40 {
  padding: 40px;
}

.p-48 {
  padding: 48px;
}

.p-56 {
  padding: 56px;
}

.p-64 {
  padding: 64px;
}

.p-80 {
  padding: 80px;
}

.p-96 {
  padding: 96px;
}

.p-120 {
  padding: 120px;
}

.p-auto {
  padding: auto;
}

@media (min-width: 576px) {
  .sm\:p-0 {
    padding: 0;
  }
  .sm\:p-2 {
    padding: 2px;
  }
  .sm\:p-4 {
    padding: 4px;
  }
  .sm\:p-6 {
    padding: 6px;
  }
  .sm\:p-8 {
    padding: 8px;
  }
  .sm\:p-10 {
    padding: 10px;
  }
  .sm\:p-12 {
    padding: 12px;
  }
  .sm\:p-14 {
    padding: 14px;
  }
  .sm\:p-16 {
    padding: 16px;
  }
  .sm\:p-20 {
    padding: 20px;
  }
  .sm\:p-24 {
    padding: 24px;
  }
  .sm\:p-28 {
    padding: 28px;
  }
  .sm\:p-30 {
    padding: 30px;
  }
  .sm\:p-32 {
    padding: 32px;
  }
  .sm\:p-40 {
    padding: 40px;
  }
  .sm\:p-48 {
    padding: 48px;
  }
  .sm\:p-56 {
    padding: 56px;
  }
  .sm\:p-64 {
    padding: 64px;
  }
  .sm\:p-80 {
    padding: 80px;
  }
  .sm\:p-96 {
    padding: 96px;
  }
  .sm\:p-120 {
    padding: 120px;
  }
  .sm\:p-auto {
    padding: auto;
  }
}
@media (min-width: 768px) {
  .md\:p-0 {
    padding: 0;
  }
  .md\:p-2 {
    padding: 2px;
  }
  .md\:p-4 {
    padding: 4px;
  }
  .md\:p-6 {
    padding: 6px;
  }
  .md\:p-8 {
    padding: 8px;
  }
  .md\:p-10 {
    padding: 10px;
  }
  .md\:p-12 {
    padding: 12px;
  }
  .md\:p-14 {
    padding: 14px;
  }
  .md\:p-16 {
    padding: 16px;
  }
  .md\:p-20 {
    padding: 20px;
  }
  .md\:p-24 {
    padding: 24px;
  }
  .md\:p-28 {
    padding: 28px;
  }
  .md\:p-30 {
    padding: 30px;
  }
  .md\:p-32 {
    padding: 32px;
  }
  .md\:p-40 {
    padding: 40px;
  }
  .md\:p-48 {
    padding: 48px;
  }
  .md\:p-56 {
    padding: 56px;
  }
  .md\:p-64 {
    padding: 64px;
  }
  .md\:p-80 {
    padding: 80px;
  }
  .md\:p-96 {
    padding: 96px;
  }
  .md\:p-120 {
    padding: 120px;
  }
  .md\:p-auto {
    padding: auto;
  }
}
@media (min-width: 992px) {
  .lg\:p-0 {
    padding: 0;
  }
  .lg\:p-2 {
    padding: 2px;
  }
  .lg\:p-4 {
    padding: 4px;
  }
  .lg\:p-6 {
    padding: 6px;
  }
  .lg\:p-8 {
    padding: 8px;
  }
  .lg\:p-10 {
    padding: 10px;
  }
  .lg\:p-12 {
    padding: 12px;
  }
  .lg\:p-14 {
    padding: 14px;
  }
  .lg\:p-16 {
    padding: 16px;
  }
  .lg\:p-20 {
    padding: 20px;
  }
  .lg\:p-24 {
    padding: 24px;
  }
  .lg\:p-28 {
    padding: 28px;
  }
  .lg\:p-30 {
    padding: 30px;
  }
  .lg\:p-32 {
    padding: 32px;
  }
  .lg\:p-40 {
    padding: 40px;
  }
  .lg\:p-48 {
    padding: 48px;
  }
  .lg\:p-56 {
    padding: 56px;
  }
  .lg\:p-64 {
    padding: 64px;
  }
  .lg\:p-80 {
    padding: 80px;
  }
  .lg\:p-96 {
    padding: 96px;
  }
  .lg\:p-120 {
    padding: 120px;
  }
  .lg\:p-auto {
    padding: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:p-0 {
    padding: 0;
  }
  .xl\:p-2 {
    padding: 2px;
  }
  .xl\:p-4 {
    padding: 4px;
  }
  .xl\:p-6 {
    padding: 6px;
  }
  .xl\:p-8 {
    padding: 8px;
  }
  .xl\:p-10 {
    padding: 10px;
  }
  .xl\:p-12 {
    padding: 12px;
  }
  .xl\:p-14 {
    padding: 14px;
  }
  .xl\:p-16 {
    padding: 16px;
  }
  .xl\:p-20 {
    padding: 20px;
  }
  .xl\:p-24 {
    padding: 24px;
  }
  .xl\:p-28 {
    padding: 28px;
  }
  .xl\:p-30 {
    padding: 30px;
  }
  .xl\:p-32 {
    padding: 32px;
  }
  .xl\:p-40 {
    padding: 40px;
  }
  .xl\:p-48 {
    padding: 48px;
  }
  .xl\:p-56 {
    padding: 56px;
  }
  .xl\:p-64 {
    padding: 64px;
  }
  .xl\:p-80 {
    padding: 80px;
  }
  .xl\:p-96 {
    padding: 96px;
  }
  .xl\:p-120 {
    padding: 120px;
  }
  .xl\:p-auto {
    padding: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:p-0 {
    padding: 0;
  }
  .xxl\:p-2 {
    padding: 2px;
  }
  .xxl\:p-4 {
    padding: 4px;
  }
  .xxl\:p-6 {
    padding: 6px;
  }
  .xxl\:p-8 {
    padding: 8px;
  }
  .xxl\:p-10 {
    padding: 10px;
  }
  .xxl\:p-12 {
    padding: 12px;
  }
  .xxl\:p-14 {
    padding: 14px;
  }
  .xxl\:p-16 {
    padding: 16px;
  }
  .xxl\:p-20 {
    padding: 20px;
  }
  .xxl\:p-24 {
    padding: 24px;
  }
  .xxl\:p-28 {
    padding: 28px;
  }
  .xxl\:p-30 {
    padding: 30px;
  }
  .xxl\:p-32 {
    padding: 32px;
  }
  .xxl\:p-40 {
    padding: 40px;
  }
  .xxl\:p-48 {
    padding: 48px;
  }
  .xxl\:p-56 {
    padding: 56px;
  }
  .xxl\:p-64 {
    padding: 64px;
  }
  .xxl\:p-80 {
    padding: 80px;
  }
  .xxl\:p-96 {
    padding: 96px;
  }
  .xxl\:p-120 {
    padding: 120px;
  }
  .xxl\:p-auto {
    padding: auto;
  }
}
.pt-0 {
  padding-top: 0;
}

.pt-2 {
  padding-top: 2px;
}

.pt-4 {
  padding-top: 4px;
}

.pt-6 {
  padding-top: 6px;
}

.pt-8 {
  padding-top: 8px;
}

.pt-10 {
  padding-top: 10px;
}

.pt-12 {
  padding-top: 12px;
}

.pt-14 {
  padding-top: 14px;
}

.pt-16 {
  padding-top: 16px;
}

.pt-20 {
  padding-top: 20px;
}

.pt-24 {
  padding-top: 24px;
}

.pt-28 {
  padding-top: 28px;
}

.pt-30 {
  padding-top: 30px;
}

.pt-32 {
  padding-top: 32px;
}

.pt-40 {
  padding-top: 40px;
}

.pt-48 {
  padding-top: 48px;
}

.pt-56 {
  padding-top: 56px;
}

.pt-64 {
  padding-top: 64px;
}

.pt-80 {
  padding-top: 80px;
}

.pt-96 {
  padding-top: 96px;
}

.pt-120 {
  padding-top: 120px;
}

.pt-auto {
  padding-top: auto;
}

@media (min-width: 576px) {
  .sm\:pt-0 {
    padding-top: 0;
  }
  .sm\:pt-2 {
    padding-top: 2px;
  }
  .sm\:pt-4 {
    padding-top: 4px;
  }
  .sm\:pt-6 {
    padding-top: 6px;
  }
  .sm\:pt-8 {
    padding-top: 8px;
  }
  .sm\:pt-10 {
    padding-top: 10px;
  }
  .sm\:pt-12 {
    padding-top: 12px;
  }
  .sm\:pt-14 {
    padding-top: 14px;
  }
  .sm\:pt-16 {
    padding-top: 16px;
  }
  .sm\:pt-20 {
    padding-top: 20px;
  }
  .sm\:pt-24 {
    padding-top: 24px;
  }
  .sm\:pt-28 {
    padding-top: 28px;
  }
  .sm\:pt-30 {
    padding-top: 30px;
  }
  .sm\:pt-32 {
    padding-top: 32px;
  }
  .sm\:pt-40 {
    padding-top: 40px;
  }
  .sm\:pt-48 {
    padding-top: 48px;
  }
  .sm\:pt-56 {
    padding-top: 56px;
  }
  .sm\:pt-64 {
    padding-top: 64px;
  }
  .sm\:pt-80 {
    padding-top: 80px;
  }
  .sm\:pt-96 {
    padding-top: 96px;
  }
  .sm\:pt-120 {
    padding-top: 120px;
  }
  .sm\:pt-auto {
    padding-top: auto;
  }
}
@media (min-width: 768px) {
  .md\:pt-0 {
    padding-top: 0;
  }
  .md\:pt-2 {
    padding-top: 2px;
  }
  .md\:pt-4 {
    padding-top: 4px;
  }
  .md\:pt-6 {
    padding-top: 6px;
  }
  .md\:pt-8 {
    padding-top: 8px;
  }
  .md\:pt-10 {
    padding-top: 10px;
  }
  .md\:pt-12 {
    padding-top: 12px;
  }
  .md\:pt-14 {
    padding-top: 14px;
  }
  .md\:pt-16 {
    padding-top: 16px;
  }
  .md\:pt-20 {
    padding-top: 20px;
  }
  .md\:pt-24 {
    padding-top: 24px;
  }
  .md\:pt-28 {
    padding-top: 28px;
  }
  .md\:pt-30 {
    padding-top: 30px;
  }
  .md\:pt-32 {
    padding-top: 32px;
  }
  .md\:pt-40 {
    padding-top: 40px;
  }
  .md\:pt-48 {
    padding-top: 48px;
  }
  .md\:pt-56 {
    padding-top: 56px;
  }
  .md\:pt-64 {
    padding-top: 64px;
  }
  .md\:pt-80 {
    padding-top: 80px;
  }
  .md\:pt-96 {
    padding-top: 96px;
  }
  .md\:pt-120 {
    padding-top: 120px;
  }
  .md\:pt-auto {
    padding-top: auto;
  }
}
@media (min-width: 992px) {
  .lg\:pt-0 {
    padding-top: 0;
  }
  .lg\:pt-2 {
    padding-top: 2px;
  }
  .lg\:pt-4 {
    padding-top: 4px;
  }
  .lg\:pt-6 {
    padding-top: 6px;
  }
  .lg\:pt-8 {
    padding-top: 8px;
  }
  .lg\:pt-10 {
    padding-top: 10px;
  }
  .lg\:pt-12 {
    padding-top: 12px;
  }
  .lg\:pt-14 {
    padding-top: 14px;
  }
  .lg\:pt-16 {
    padding-top: 16px;
  }
  .lg\:pt-20 {
    padding-top: 20px;
  }
  .lg\:pt-24 {
    padding-top: 24px;
  }
  .lg\:pt-28 {
    padding-top: 28px;
  }
  .lg\:pt-30 {
    padding-top: 30px;
  }
  .lg\:pt-32 {
    padding-top: 32px;
  }
  .lg\:pt-40 {
    padding-top: 40px;
  }
  .lg\:pt-48 {
    padding-top: 48px;
  }
  .lg\:pt-56 {
    padding-top: 56px;
  }
  .lg\:pt-64 {
    padding-top: 64px;
  }
  .lg\:pt-80 {
    padding-top: 80px;
  }
  .lg\:pt-96 {
    padding-top: 96px;
  }
  .lg\:pt-120 {
    padding-top: 120px;
  }
  .lg\:pt-auto {
    padding-top: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:pt-0 {
    padding-top: 0;
  }
  .xl\:pt-2 {
    padding-top: 2px;
  }
  .xl\:pt-4 {
    padding-top: 4px;
  }
  .xl\:pt-6 {
    padding-top: 6px;
  }
  .xl\:pt-8 {
    padding-top: 8px;
  }
  .xl\:pt-10 {
    padding-top: 10px;
  }
  .xl\:pt-12 {
    padding-top: 12px;
  }
  .xl\:pt-14 {
    padding-top: 14px;
  }
  .xl\:pt-16 {
    padding-top: 16px;
  }
  .xl\:pt-20 {
    padding-top: 20px;
  }
  .xl\:pt-24 {
    padding-top: 24px;
  }
  .xl\:pt-28 {
    padding-top: 28px;
  }
  .xl\:pt-30 {
    padding-top: 30px;
  }
  .xl\:pt-32 {
    padding-top: 32px;
  }
  .xl\:pt-40 {
    padding-top: 40px;
  }
  .xl\:pt-48 {
    padding-top: 48px;
  }
  .xl\:pt-56 {
    padding-top: 56px;
  }
  .xl\:pt-64 {
    padding-top: 64px;
  }
  .xl\:pt-80 {
    padding-top: 80px;
  }
  .xl\:pt-96 {
    padding-top: 96px;
  }
  .xl\:pt-120 {
    padding-top: 120px;
  }
  .xl\:pt-auto {
    padding-top: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:pt-0 {
    padding-top: 0;
  }
  .xxl\:pt-2 {
    padding-top: 2px;
  }
  .xxl\:pt-4 {
    padding-top: 4px;
  }
  .xxl\:pt-6 {
    padding-top: 6px;
  }
  .xxl\:pt-8 {
    padding-top: 8px;
  }
  .xxl\:pt-10 {
    padding-top: 10px;
  }
  .xxl\:pt-12 {
    padding-top: 12px;
  }
  .xxl\:pt-14 {
    padding-top: 14px;
  }
  .xxl\:pt-16 {
    padding-top: 16px;
  }
  .xxl\:pt-20 {
    padding-top: 20px;
  }
  .xxl\:pt-24 {
    padding-top: 24px;
  }
  .xxl\:pt-28 {
    padding-top: 28px;
  }
  .xxl\:pt-30 {
    padding-top: 30px;
  }
  .xxl\:pt-32 {
    padding-top: 32px;
  }
  .xxl\:pt-40 {
    padding-top: 40px;
  }
  .xxl\:pt-48 {
    padding-top: 48px;
  }
  .xxl\:pt-56 {
    padding-top: 56px;
  }
  .xxl\:pt-64 {
    padding-top: 64px;
  }
  .xxl\:pt-80 {
    padding-top: 80px;
  }
  .xxl\:pt-96 {
    padding-top: 96px;
  }
  .xxl\:pt-120 {
    padding-top: 120px;
  }
  .xxl\:pt-auto {
    padding-top: auto;
  }
}
.pr-0 {
  padding-right: 0;
}

.pr-2 {
  padding-right: 2px;
}

.pr-4 {
  padding-right: 4px;
}

.pr-6 {
  padding-right: 6px;
}

.pr-8 {
  padding-right: 8px;
}

.pr-10 {
  padding-right: 10px;
}

.pr-12 {
  padding-right: 12px;
}

.pr-14 {
  padding-right: 14px;
}

.pr-16 {
  padding-right: 16px;
}

.pr-20 {
  padding-right: 20px;
}

.pr-24 {
  padding-right: 24px;
}

.pr-28 {
  padding-right: 28px;
}

.pr-30 {
  padding-right: 30px;
}

.pr-32 {
  padding-right: 32px;
}

.pr-40 {
  padding-right: 40px;
}

.pr-48 {
  padding-right: 48px;
}

.pr-56 {
  padding-right: 56px;
}

.pr-64 {
  padding-right: 64px;
}

.pr-80 {
  padding-right: 80px;
}

.pr-96 {
  padding-right: 96px;
}

.pr-120 {
  padding-right: 120px;
}

.pr-auto {
  padding-right: auto;
}

@media (min-width: 576px) {
  .sm\:pr-0 {
    padding-right: 0;
  }
  .sm\:pr-2 {
    padding-right: 2px;
  }
  .sm\:pr-4 {
    padding-right: 4px;
  }
  .sm\:pr-6 {
    padding-right: 6px;
  }
  .sm\:pr-8 {
    padding-right: 8px;
  }
  .sm\:pr-10 {
    padding-right: 10px;
  }
  .sm\:pr-12 {
    padding-right: 12px;
  }
  .sm\:pr-14 {
    padding-right: 14px;
  }
  .sm\:pr-16 {
    padding-right: 16px;
  }
  .sm\:pr-20 {
    padding-right: 20px;
  }
  .sm\:pr-24 {
    padding-right: 24px;
  }
  .sm\:pr-28 {
    padding-right: 28px;
  }
  .sm\:pr-30 {
    padding-right: 30px;
  }
  .sm\:pr-32 {
    padding-right: 32px;
  }
  .sm\:pr-40 {
    padding-right: 40px;
  }
  .sm\:pr-48 {
    padding-right: 48px;
  }
  .sm\:pr-56 {
    padding-right: 56px;
  }
  .sm\:pr-64 {
    padding-right: 64px;
  }
  .sm\:pr-80 {
    padding-right: 80px;
  }
  .sm\:pr-96 {
    padding-right: 96px;
  }
  .sm\:pr-120 {
    padding-right: 120px;
  }
  .sm\:pr-auto {
    padding-right: auto;
  }
}
@media (min-width: 768px) {
  .md\:pr-0 {
    padding-right: 0;
  }
  .md\:pr-2 {
    padding-right: 2px;
  }
  .md\:pr-4 {
    padding-right: 4px;
  }
  .md\:pr-6 {
    padding-right: 6px;
  }
  .md\:pr-8 {
    padding-right: 8px;
  }
  .md\:pr-10 {
    padding-right: 10px;
  }
  .md\:pr-12 {
    padding-right: 12px;
  }
  .md\:pr-14 {
    padding-right: 14px;
  }
  .md\:pr-16 {
    padding-right: 16px;
  }
  .md\:pr-20 {
    padding-right: 20px;
  }
  .md\:pr-24 {
    padding-right: 24px;
  }
  .md\:pr-28 {
    padding-right: 28px;
  }
  .md\:pr-30 {
    padding-right: 30px;
  }
  .md\:pr-32 {
    padding-right: 32px;
  }
  .md\:pr-40 {
    padding-right: 40px;
  }
  .md\:pr-48 {
    padding-right: 48px;
  }
  .md\:pr-56 {
    padding-right: 56px;
  }
  .md\:pr-64 {
    padding-right: 64px;
  }
  .md\:pr-80 {
    padding-right: 80px;
  }
  .md\:pr-96 {
    padding-right: 96px;
  }
  .md\:pr-120 {
    padding-right: 120px;
  }
  .md\:pr-auto {
    padding-right: auto;
  }
}
@media (min-width: 992px) {
  .lg\:pr-0 {
    padding-right: 0;
  }
  .lg\:pr-2 {
    padding-right: 2px;
  }
  .lg\:pr-4 {
    padding-right: 4px;
  }
  .lg\:pr-6 {
    padding-right: 6px;
  }
  .lg\:pr-8 {
    padding-right: 8px;
  }
  .lg\:pr-10 {
    padding-right: 10px;
  }
  .lg\:pr-12 {
    padding-right: 12px;
  }
  .lg\:pr-14 {
    padding-right: 14px;
  }
  .lg\:pr-16 {
    padding-right: 16px;
  }
  .lg\:pr-20 {
    padding-right: 20px;
  }
  .lg\:pr-24 {
    padding-right: 24px;
  }
  .lg\:pr-28 {
    padding-right: 28px;
  }
  .lg\:pr-30 {
    padding-right: 30px;
  }
  .lg\:pr-32 {
    padding-right: 32px;
  }
  .lg\:pr-40 {
    padding-right: 40px;
  }
  .lg\:pr-48 {
    padding-right: 48px;
  }
  .lg\:pr-56 {
    padding-right: 56px;
  }
  .lg\:pr-64 {
    padding-right: 64px;
  }
  .lg\:pr-80 {
    padding-right: 80px;
  }
  .lg\:pr-96 {
    padding-right: 96px;
  }
  .lg\:pr-120 {
    padding-right: 120px;
  }
  .lg\:pr-auto {
    padding-right: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:pr-0 {
    padding-right: 0;
  }
  .xl\:pr-2 {
    padding-right: 2px;
  }
  .xl\:pr-4 {
    padding-right: 4px;
  }
  .xl\:pr-6 {
    padding-right: 6px;
  }
  .xl\:pr-8 {
    padding-right: 8px;
  }
  .xl\:pr-10 {
    padding-right: 10px;
  }
  .xl\:pr-12 {
    padding-right: 12px;
  }
  .xl\:pr-14 {
    padding-right: 14px;
  }
  .xl\:pr-16 {
    padding-right: 16px;
  }
  .xl\:pr-20 {
    padding-right: 20px;
  }
  .xl\:pr-24 {
    padding-right: 24px;
  }
  .xl\:pr-28 {
    padding-right: 28px;
  }
  .xl\:pr-30 {
    padding-right: 30px;
  }
  .xl\:pr-32 {
    padding-right: 32px;
  }
  .xl\:pr-40 {
    padding-right: 40px;
  }
  .xl\:pr-48 {
    padding-right: 48px;
  }
  .xl\:pr-56 {
    padding-right: 56px;
  }
  .xl\:pr-64 {
    padding-right: 64px;
  }
  .xl\:pr-80 {
    padding-right: 80px;
  }
  .xl\:pr-96 {
    padding-right: 96px;
  }
  .xl\:pr-120 {
    padding-right: 120px;
  }
  .xl\:pr-auto {
    padding-right: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:pr-0 {
    padding-right: 0;
  }
  .xxl\:pr-2 {
    padding-right: 2px;
  }
  .xxl\:pr-4 {
    padding-right: 4px;
  }
  .xxl\:pr-6 {
    padding-right: 6px;
  }
  .xxl\:pr-8 {
    padding-right: 8px;
  }
  .xxl\:pr-10 {
    padding-right: 10px;
  }
  .xxl\:pr-12 {
    padding-right: 12px;
  }
  .xxl\:pr-14 {
    padding-right: 14px;
  }
  .xxl\:pr-16 {
    padding-right: 16px;
  }
  .xxl\:pr-20 {
    padding-right: 20px;
  }
  .xxl\:pr-24 {
    padding-right: 24px;
  }
  .xxl\:pr-28 {
    padding-right: 28px;
  }
  .xxl\:pr-30 {
    padding-right: 30px;
  }
  .xxl\:pr-32 {
    padding-right: 32px;
  }
  .xxl\:pr-40 {
    padding-right: 40px;
  }
  .xxl\:pr-48 {
    padding-right: 48px;
  }
  .xxl\:pr-56 {
    padding-right: 56px;
  }
  .xxl\:pr-64 {
    padding-right: 64px;
  }
  .xxl\:pr-80 {
    padding-right: 80px;
  }
  .xxl\:pr-96 {
    padding-right: 96px;
  }
  .xxl\:pr-120 {
    padding-right: 120px;
  }
  .xxl\:pr-auto {
    padding-right: auto;
  }
}
.pb-0 {
  padding-bottom: 0;
}

.pb-2 {
  padding-bottom: 2px;
}

.pb-4 {
  padding-bottom: 4px;
}

.pb-6 {
  padding-bottom: 6px;
}

.pb-8 {
  padding-bottom: 8px;
}

.pb-10 {
  padding-bottom: 10px;
}

.pb-12 {
  padding-bottom: 12px;
}

.pb-14 {
  padding-bottom: 14px;
}

.pb-16 {
  padding-bottom: 16px;
}

.pb-20 {
  padding-bottom: 20px;
}

.pb-24 {
  padding-bottom: 24px;
}

.pb-28 {
  padding-bottom: 28px;
}

.pb-30 {
  padding-bottom: 30px;
}

.pb-32 {
  padding-bottom: 32px;
}

.pb-40 {
  padding-bottom: 40px;
}

.pb-48 {
  padding-bottom: 48px;
}

.pb-56 {
  padding-bottom: 56px;
}

.pb-64 {
  padding-bottom: 64px;
}

.pb-80 {
  padding-bottom: 80px;
}

.pb-96 {
  padding-bottom: 96px;
}

.pb-120 {
  padding-bottom: 120px;
}

.pb-auto {
  padding-bottom: auto;
}

@media (min-width: 576px) {
  .sm\:pb-0 {
    padding-bottom: 0;
  }
  .sm\:pb-2 {
    padding-bottom: 2px;
  }
  .sm\:pb-4 {
    padding-bottom: 4px;
  }
  .sm\:pb-6 {
    padding-bottom: 6px;
  }
  .sm\:pb-8 {
    padding-bottom: 8px;
  }
  .sm\:pb-10 {
    padding-bottom: 10px;
  }
  .sm\:pb-12 {
    padding-bottom: 12px;
  }
  .sm\:pb-14 {
    padding-bottom: 14px;
  }
  .sm\:pb-16 {
    padding-bottom: 16px;
  }
  .sm\:pb-20 {
    padding-bottom: 20px;
  }
  .sm\:pb-24 {
    padding-bottom: 24px;
  }
  .sm\:pb-28 {
    padding-bottom: 28px;
  }
  .sm\:pb-30 {
    padding-bottom: 30px;
  }
  .sm\:pb-32 {
    padding-bottom: 32px;
  }
  .sm\:pb-40 {
    padding-bottom: 40px;
  }
  .sm\:pb-48 {
    padding-bottom: 48px;
  }
  .sm\:pb-56 {
    padding-bottom: 56px;
  }
  .sm\:pb-64 {
    padding-bottom: 64px;
  }
  .sm\:pb-80 {
    padding-bottom: 80px;
  }
  .sm\:pb-96 {
    padding-bottom: 96px;
  }
  .sm\:pb-120 {
    padding-bottom: 120px;
  }
  .sm\:pb-auto {
    padding-bottom: auto;
  }
}
@media (min-width: 768px) {
  .md\:pb-0 {
    padding-bottom: 0;
  }
  .md\:pb-2 {
    padding-bottom: 2px;
  }
  .md\:pb-4 {
    padding-bottom: 4px;
  }
  .md\:pb-6 {
    padding-bottom: 6px;
  }
  .md\:pb-8 {
    padding-bottom: 8px;
  }
  .md\:pb-10 {
    padding-bottom: 10px;
  }
  .md\:pb-12 {
    padding-bottom: 12px;
  }
  .md\:pb-14 {
    padding-bottom: 14px;
  }
  .md\:pb-16 {
    padding-bottom: 16px;
  }
  .md\:pb-20 {
    padding-bottom: 20px;
  }
  .md\:pb-24 {
    padding-bottom: 24px;
  }
  .md\:pb-28 {
    padding-bottom: 28px;
  }
  .md\:pb-30 {
    padding-bottom: 30px;
  }
  .md\:pb-32 {
    padding-bottom: 32px;
  }
  .md\:pb-40 {
    padding-bottom: 40px;
  }
  .md\:pb-48 {
    padding-bottom: 48px;
  }
  .md\:pb-56 {
    padding-bottom: 56px;
  }
  .md\:pb-64 {
    padding-bottom: 64px;
  }
  .md\:pb-80 {
    padding-bottom: 80px;
  }
  .md\:pb-96 {
    padding-bottom: 96px;
  }
  .md\:pb-120 {
    padding-bottom: 120px;
  }
  .md\:pb-auto {
    padding-bottom: auto;
  }
}
@media (min-width: 992px) {
  .lg\:pb-0 {
    padding-bottom: 0;
  }
  .lg\:pb-2 {
    padding-bottom: 2px;
  }
  .lg\:pb-4 {
    padding-bottom: 4px;
  }
  .lg\:pb-6 {
    padding-bottom: 6px;
  }
  .lg\:pb-8 {
    padding-bottom: 8px;
  }
  .lg\:pb-10 {
    padding-bottom: 10px;
  }
  .lg\:pb-12 {
    padding-bottom: 12px;
  }
  .lg\:pb-14 {
    padding-bottom: 14px;
  }
  .lg\:pb-16 {
    padding-bottom: 16px;
  }
  .lg\:pb-20 {
    padding-bottom: 20px;
  }
  .lg\:pb-24 {
    padding-bottom: 24px;
  }
  .lg\:pb-28 {
    padding-bottom: 28px;
  }
  .lg\:pb-30 {
    padding-bottom: 30px;
  }
  .lg\:pb-32 {
    padding-bottom: 32px;
  }
  .lg\:pb-40 {
    padding-bottom: 40px;
  }
  .lg\:pb-48 {
    padding-bottom: 48px;
  }
  .lg\:pb-56 {
    padding-bottom: 56px;
  }
  .lg\:pb-64 {
    padding-bottom: 64px;
  }
  .lg\:pb-80 {
    padding-bottom: 80px;
  }
  .lg\:pb-96 {
    padding-bottom: 96px;
  }
  .lg\:pb-120 {
    padding-bottom: 120px;
  }
  .lg\:pb-auto {
    padding-bottom: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:pb-0 {
    padding-bottom: 0;
  }
  .xl\:pb-2 {
    padding-bottom: 2px;
  }
  .xl\:pb-4 {
    padding-bottom: 4px;
  }
  .xl\:pb-6 {
    padding-bottom: 6px;
  }
  .xl\:pb-8 {
    padding-bottom: 8px;
  }
  .xl\:pb-10 {
    padding-bottom: 10px;
  }
  .xl\:pb-12 {
    padding-bottom: 12px;
  }
  .xl\:pb-14 {
    padding-bottom: 14px;
  }
  .xl\:pb-16 {
    padding-bottom: 16px;
  }
  .xl\:pb-20 {
    padding-bottom: 20px;
  }
  .xl\:pb-24 {
    padding-bottom: 24px;
  }
  .xl\:pb-28 {
    padding-bottom: 28px;
  }
  .xl\:pb-30 {
    padding-bottom: 30px;
  }
  .xl\:pb-32 {
    padding-bottom: 32px;
  }
  .xl\:pb-40 {
    padding-bottom: 40px;
  }
  .xl\:pb-48 {
    padding-bottom: 48px;
  }
  .xl\:pb-56 {
    padding-bottom: 56px;
  }
  .xl\:pb-64 {
    padding-bottom: 64px;
  }
  .xl\:pb-80 {
    padding-bottom: 80px;
  }
  .xl\:pb-96 {
    padding-bottom: 96px;
  }
  .xl\:pb-120 {
    padding-bottom: 120px;
  }
  .xl\:pb-auto {
    padding-bottom: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:pb-0 {
    padding-bottom: 0;
  }
  .xxl\:pb-2 {
    padding-bottom: 2px;
  }
  .xxl\:pb-4 {
    padding-bottom: 4px;
  }
  .xxl\:pb-6 {
    padding-bottom: 6px;
  }
  .xxl\:pb-8 {
    padding-bottom: 8px;
  }
  .xxl\:pb-10 {
    padding-bottom: 10px;
  }
  .xxl\:pb-12 {
    padding-bottom: 12px;
  }
  .xxl\:pb-14 {
    padding-bottom: 14px;
  }
  .xxl\:pb-16 {
    padding-bottom: 16px;
  }
  .xxl\:pb-20 {
    padding-bottom: 20px;
  }
  .xxl\:pb-24 {
    padding-bottom: 24px;
  }
  .xxl\:pb-28 {
    padding-bottom: 28px;
  }
  .xxl\:pb-30 {
    padding-bottom: 30px;
  }
  .xxl\:pb-32 {
    padding-bottom: 32px;
  }
  .xxl\:pb-40 {
    padding-bottom: 40px;
  }
  .xxl\:pb-48 {
    padding-bottom: 48px;
  }
  .xxl\:pb-56 {
    padding-bottom: 56px;
  }
  .xxl\:pb-64 {
    padding-bottom: 64px;
  }
  .xxl\:pb-80 {
    padding-bottom: 80px;
  }
  .xxl\:pb-96 {
    padding-bottom: 96px;
  }
  .xxl\:pb-120 {
    padding-bottom: 120px;
  }
  .xxl\:pb-auto {
    padding-bottom: auto;
  }
}
.pl-0 {
  padding-left: 0;
}

.pl-2 {
  padding-left: 2px;
}

.pl-4 {
  padding-left: 4px;
}

.pl-6 {
  padding-left: 6px;
}

.pl-8 {
  padding-left: 8px;
}

.pl-10 {
  padding-left: 10px;
}

.pl-12 {
  padding-left: 12px;
}

.pl-14 {
  padding-left: 14px;
}

.pl-16 {
  padding-left: 16px;
}

.pl-20 {
  padding-left: 20px;
}

.pl-24 {
  padding-left: 24px;
}

.pl-28 {
  padding-left: 28px;
}

.pl-30 {
  padding-left: 30px;
}

.pl-32 {
  padding-left: 32px;
}

.pl-40 {
  padding-left: 40px;
}

.pl-48 {
  padding-left: 48px;
}

.pl-56 {
  padding-left: 56px;
}

.pl-64 {
  padding-left: 64px;
}

.pl-80 {
  padding-left: 80px;
}

.pl-96 {
  padding-left: 96px;
}

.pl-120 {
  padding-left: 120px;
}

.pl-auto {
  padding-left: auto;
}

@media (min-width: 576px) {
  .sm\:pl-0 {
    padding-left: 0;
  }
  .sm\:pl-2 {
    padding-left: 2px;
  }
  .sm\:pl-4 {
    padding-left: 4px;
  }
  .sm\:pl-6 {
    padding-left: 6px;
  }
  .sm\:pl-8 {
    padding-left: 8px;
  }
  .sm\:pl-10 {
    padding-left: 10px;
  }
  .sm\:pl-12 {
    padding-left: 12px;
  }
  .sm\:pl-14 {
    padding-left: 14px;
  }
  .sm\:pl-16 {
    padding-left: 16px;
  }
  .sm\:pl-20 {
    padding-left: 20px;
  }
  .sm\:pl-24 {
    padding-left: 24px;
  }
  .sm\:pl-28 {
    padding-left: 28px;
  }
  .sm\:pl-30 {
    padding-left: 30px;
  }
  .sm\:pl-32 {
    padding-left: 32px;
  }
  .sm\:pl-40 {
    padding-left: 40px;
  }
  .sm\:pl-48 {
    padding-left: 48px;
  }
  .sm\:pl-56 {
    padding-left: 56px;
  }
  .sm\:pl-64 {
    padding-left: 64px;
  }
  .sm\:pl-80 {
    padding-left: 80px;
  }
  .sm\:pl-96 {
    padding-left: 96px;
  }
  .sm\:pl-120 {
    padding-left: 120px;
  }
  .sm\:pl-auto {
    padding-left: auto;
  }
}
@media (min-width: 768px) {
  .md\:pl-0 {
    padding-left: 0;
  }
  .md\:pl-2 {
    padding-left: 2px;
  }
  .md\:pl-4 {
    padding-left: 4px;
  }
  .md\:pl-6 {
    padding-left: 6px;
  }
  .md\:pl-8 {
    padding-left: 8px;
  }
  .md\:pl-10 {
    padding-left: 10px;
  }
  .md\:pl-12 {
    padding-left: 12px;
  }
  .md\:pl-14 {
    padding-left: 14px;
  }
  .md\:pl-16 {
    padding-left: 16px;
  }
  .md\:pl-20 {
    padding-left: 20px;
  }
  .md\:pl-24 {
    padding-left: 24px;
  }
  .md\:pl-28 {
    padding-left: 28px;
  }
  .md\:pl-30 {
    padding-left: 30px;
  }
  .md\:pl-32 {
    padding-left: 32px;
  }
  .md\:pl-40 {
    padding-left: 40px;
  }
  .md\:pl-48 {
    padding-left: 48px;
  }
  .md\:pl-56 {
    padding-left: 56px;
  }
  .md\:pl-64 {
    padding-left: 64px;
  }
  .md\:pl-80 {
    padding-left: 80px;
  }
  .md\:pl-96 {
    padding-left: 96px;
  }
  .md\:pl-120 {
    padding-left: 120px;
  }
  .md\:pl-auto {
    padding-left: auto;
  }
}
@media (min-width: 992px) {
  .lg\:pl-0 {
    padding-left: 0;
  }
  .lg\:pl-2 {
    padding-left: 2px;
  }
  .lg\:pl-4 {
    padding-left: 4px;
  }
  .lg\:pl-6 {
    padding-left: 6px;
  }
  .lg\:pl-8 {
    padding-left: 8px;
  }
  .lg\:pl-10 {
    padding-left: 10px;
  }
  .lg\:pl-12 {
    padding-left: 12px;
  }
  .lg\:pl-14 {
    padding-left: 14px;
  }
  .lg\:pl-16 {
    padding-left: 16px;
  }
  .lg\:pl-20 {
    padding-left: 20px;
  }
  .lg\:pl-24 {
    padding-left: 24px;
  }
  .lg\:pl-28 {
    padding-left: 28px;
  }
  .lg\:pl-30 {
    padding-left: 30px;
  }
  .lg\:pl-32 {
    padding-left: 32px;
  }
  .lg\:pl-40 {
    padding-left: 40px;
  }
  .lg\:pl-48 {
    padding-left: 48px;
  }
  .lg\:pl-56 {
    padding-left: 56px;
  }
  .lg\:pl-64 {
    padding-left: 64px;
  }
  .lg\:pl-80 {
    padding-left: 80px;
  }
  .lg\:pl-96 {
    padding-left: 96px;
  }
  .lg\:pl-120 {
    padding-left: 120px;
  }
  .lg\:pl-auto {
    padding-left: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:pl-0 {
    padding-left: 0;
  }
  .xl\:pl-2 {
    padding-left: 2px;
  }
  .xl\:pl-4 {
    padding-left: 4px;
  }
  .xl\:pl-6 {
    padding-left: 6px;
  }
  .xl\:pl-8 {
    padding-left: 8px;
  }
  .xl\:pl-10 {
    padding-left: 10px;
  }
  .xl\:pl-12 {
    padding-left: 12px;
  }
  .xl\:pl-14 {
    padding-left: 14px;
  }
  .xl\:pl-16 {
    padding-left: 16px;
  }
  .xl\:pl-20 {
    padding-left: 20px;
  }
  .xl\:pl-24 {
    padding-left: 24px;
  }
  .xl\:pl-28 {
    padding-left: 28px;
  }
  .xl\:pl-30 {
    padding-left: 30px;
  }
  .xl\:pl-32 {
    padding-left: 32px;
  }
  .xl\:pl-40 {
    padding-left: 40px;
  }
  .xl\:pl-48 {
    padding-left: 48px;
  }
  .xl\:pl-56 {
    padding-left: 56px;
  }
  .xl\:pl-64 {
    padding-left: 64px;
  }
  .xl\:pl-80 {
    padding-left: 80px;
  }
  .xl\:pl-96 {
    padding-left: 96px;
  }
  .xl\:pl-120 {
    padding-left: 120px;
  }
  .xl\:pl-auto {
    padding-left: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:pl-0 {
    padding-left: 0;
  }
  .xxl\:pl-2 {
    padding-left: 2px;
  }
  .xxl\:pl-4 {
    padding-left: 4px;
  }
  .xxl\:pl-6 {
    padding-left: 6px;
  }
  .xxl\:pl-8 {
    padding-left: 8px;
  }
  .xxl\:pl-10 {
    padding-left: 10px;
  }
  .xxl\:pl-12 {
    padding-left: 12px;
  }
  .xxl\:pl-14 {
    padding-left: 14px;
  }
  .xxl\:pl-16 {
    padding-left: 16px;
  }
  .xxl\:pl-20 {
    padding-left: 20px;
  }
  .xxl\:pl-24 {
    padding-left: 24px;
  }
  .xxl\:pl-28 {
    padding-left: 28px;
  }
  .xxl\:pl-30 {
    padding-left: 30px;
  }
  .xxl\:pl-32 {
    padding-left: 32px;
  }
  .xxl\:pl-40 {
    padding-left: 40px;
  }
  .xxl\:pl-48 {
    padding-left: 48px;
  }
  .xxl\:pl-56 {
    padding-left: 56px;
  }
  .xxl\:pl-64 {
    padding-left: 64px;
  }
  .xxl\:pl-80 {
    padding-left: 80px;
  }
  .xxl\:pl-96 {
    padding-left: 96px;
  }
  .xxl\:pl-120 {
    padding-left: 120px;
  }
  .xxl\:pl-auto {
    padding-left: auto;
  }
}
.px-0 {
  padding-left: 0;
  padding-right: 0;
}

.py-0 {
  padding-top: 0;
  padding-bottom: 0;
}

.px-2 {
  padding-left: 2px;
  padding-right: 2px;
}

.py-2 {
  padding-top: 2px;
  padding-bottom: 2px;
}

.px-4 {
  padding-left: 4px;
  padding-right: 4px;
}

.py-4 {
  padding-top: 4px;
  padding-bottom: 4px;
}

.px-6 {
  padding-left: 6px;
  padding-right: 6px;
}

.py-6 {
  padding-top: 6px;
  padding-bottom: 6px;
}

.px-8 {
  padding-left: 8px;
  padding-right: 8px;
}

.py-8 {
  padding-top: 8px;
  padding-bottom: 8px;
}

.px-10 {
  padding-left: 10px;
  padding-right: 10px;
}

.py-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}

.px-12 {
  padding-left: 12px;
  padding-right: 12px;
}

.py-12 {
  padding-top: 12px;
  padding-bottom: 12px;
}

.px-14 {
  padding-left: 14px;
  padding-right: 14px;
}

.py-14 {
  padding-top: 14px;
  padding-bottom: 14px;
}

.px-16 {
  padding-left: 16px;
  padding-right: 16px;
}

.py-16 {
  padding-top: 16px;
  padding-bottom: 16px;
}

.px-20 {
  padding-left: 20px;
  padding-right: 20px;
}

.py-20 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.px-24 {
  padding-left: 24px;
  padding-right: 24px;
}

.py-24 {
  padding-top: 24px;
  padding-bottom: 24px;
}

.px-28 {
  padding-left: 28px;
  padding-right: 28px;
}

.py-28 {
  padding-top: 28px;
  padding-bottom: 28px;
}

.px-30 {
  padding-left: 30px;
  padding-right: 30px;
}

.py-30 {
  padding-top: 30px;
  padding-bottom: 30px;
}

.px-32 {
  padding-left: 32px;
  padding-right: 32px;
}

.py-32 {
  padding-top: 32px;
  padding-bottom: 32px;
}

.px-40 {
  padding-left: 40px;
  padding-right: 40px;
}

.py-40 {
  padding-top: 40px;
  padding-bottom: 40px;
}

.px-48 {
  padding-left: 48px;
  padding-right: 48px;
}

.py-48 {
  padding-top: 48px;
  padding-bottom: 48px;
}

.px-56 {
  padding-left: 56px;
  padding-right: 56px;
}

.py-56 {
  padding-top: 56px;
  padding-bottom: 56px;
}

.px-64 {
  padding-left: 64px;
  padding-right: 64px;
}

.py-64 {
  padding-top: 64px;
  padding-bottom: 64px;
}

.px-80 {
  padding-left: 80px;
  padding-right: 80px;
}

.py-80 {
  padding-top: 80px;
  padding-bottom: 80px;
}

.px-96 {
  padding-left: 96px;
  padding-right: 96px;
}

.py-96 {
  padding-top: 96px;
  padding-bottom: 96px;
}

.px-120 {
  padding-left: 120px;
  padding-right: 120px;
}

.py-120 {
  padding-top: 120px;
  padding-bottom: 120px;
}

.px-auto {
  padding-left: auto;
  padding-right: auto;
}

.py-auto {
  padding-top: auto;
  padding-bottom: auto;
}

@media (min-width: 576px) {
  .sm\:px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .sm\:py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .sm\:px-2 {
    padding-left: 2px;
    padding-right: 2px;
  }
  .sm\:py-2 {
    padding-top: 2px;
    padding-bottom: 2px;
  }
  .sm\:px-4 {
    padding-left: 4px;
    padding-right: 4px;
  }
  .sm\:py-4 {
    padding-top: 4px;
    padding-bottom: 4px;
  }
  .sm\:px-6 {
    padding-left: 6px;
    padding-right: 6px;
  }
  .sm\:py-6 {
    padding-top: 6px;
    padding-bottom: 6px;
  }
  .sm\:px-8 {
    padding-left: 8px;
    padding-right: 8px;
  }
  .sm\:py-8 {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .sm\:px-10 {
    padding-left: 10px;
    padding-right: 10px;
  }
  .sm\:py-10 {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .sm\:px-12 {
    padding-left: 12px;
    padding-right: 12px;
  }
  .sm\:py-12 {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .sm\:px-14 {
    padding-left: 14px;
    padding-right: 14px;
  }
  .sm\:py-14 {
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .sm\:px-16 {
    padding-left: 16px;
    padding-right: 16px;
  }
  .sm\:py-16 {
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .sm\:px-20 {
    padding-left: 20px;
    padding-right: 20px;
  }
  .sm\:py-20 {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .sm\:px-24 {
    padding-left: 24px;
    padding-right: 24px;
  }
  .sm\:py-24 {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .sm\:px-28 {
    padding-left: 28px;
    padding-right: 28px;
  }
  .sm\:py-28 {
    padding-top: 28px;
    padding-bottom: 28px;
  }
  .sm\:px-30 {
    padding-left: 30px;
    padding-right: 30px;
  }
  .sm\:py-30 {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .sm\:px-32 {
    padding-left: 32px;
    padding-right: 32px;
  }
  .sm\:py-32 {
    padding-top: 32px;
    padding-bottom: 32px;
  }
  .sm\:px-40 {
    padding-left: 40px;
    padding-right: 40px;
  }
  .sm\:py-40 {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .sm\:px-48 {
    padding-left: 48px;
    padding-right: 48px;
  }
  .sm\:py-48 {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .sm\:px-56 {
    padding-left: 56px;
    padding-right: 56px;
  }
  .sm\:py-56 {
    padding-top: 56px;
    padding-bottom: 56px;
  }
  .sm\:px-64 {
    padding-left: 64px;
    padding-right: 64px;
  }
  .sm\:py-64 {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .sm\:px-80 {
    padding-left: 80px;
    padding-right: 80px;
  }
  .sm\:py-80 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .sm\:px-96 {
    padding-left: 96px;
    padding-right: 96px;
  }
  .sm\:py-96 {
    padding-top: 96px;
    padding-bottom: 96px;
  }
  .sm\:px-120 {
    padding-left: 120px;
    padding-right: 120px;
  }
  .sm\:py-120 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .sm\:px-auto {
    padding-left: auto;
    padding-right: auto;
  }
  .sm\:py-auto {
    padding-top: auto;
    padding-bottom: auto;
  }
}
@media (min-width: 768px) {
  .md\:px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .md\:py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .md\:px-2 {
    padding-left: 2px;
    padding-right: 2px;
  }
  .md\:py-2 {
    padding-top: 2px;
    padding-bottom: 2px;
  }
  .md\:px-4 {
    padding-left: 4px;
    padding-right: 4px;
  }
  .md\:py-4 {
    padding-top: 4px;
    padding-bottom: 4px;
  }
  .md\:px-6 {
    padding-left: 6px;
    padding-right: 6px;
  }
  .md\:py-6 {
    padding-top: 6px;
    padding-bottom: 6px;
  }
  .md\:px-8 {
    padding-left: 8px;
    padding-right: 8px;
  }
  .md\:py-8 {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .md\:px-10 {
    padding-left: 10px;
    padding-right: 10px;
  }
  .md\:py-10 {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .md\:px-12 {
    padding-left: 12px;
    padding-right: 12px;
  }
  .md\:py-12 {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .md\:px-14 {
    padding-left: 14px;
    padding-right: 14px;
  }
  .md\:py-14 {
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .md\:px-16 {
    padding-left: 16px;
    padding-right: 16px;
  }
  .md\:py-16 {
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .md\:px-20 {
    padding-left: 20px;
    padding-right: 20px;
  }
  .md\:py-20 {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .md\:px-24 {
    padding-left: 24px;
    padding-right: 24px;
  }
  .md\:py-24 {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .md\:px-28 {
    padding-left: 28px;
    padding-right: 28px;
  }
  .md\:py-28 {
    padding-top: 28px;
    padding-bottom: 28px;
  }
  .md\:px-30 {
    padding-left: 30px;
    padding-right: 30px;
  }
  .md\:py-30 {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .md\:px-32 {
    padding-left: 32px;
    padding-right: 32px;
  }
  .md\:py-32 {
    padding-top: 32px;
    padding-bottom: 32px;
  }
  .md\:px-40 {
    padding-left: 40px;
    padding-right: 40px;
  }
  .md\:py-40 {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .md\:px-48 {
    padding-left: 48px;
    padding-right: 48px;
  }
  .md\:py-48 {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .md\:px-56 {
    padding-left: 56px;
    padding-right: 56px;
  }
  .md\:py-56 {
    padding-top: 56px;
    padding-bottom: 56px;
  }
  .md\:px-64 {
    padding-left: 64px;
    padding-right: 64px;
  }
  .md\:py-64 {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .md\:px-80 {
    padding-left: 80px;
    padding-right: 80px;
  }
  .md\:py-80 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .md\:px-96 {
    padding-left: 96px;
    padding-right: 96px;
  }
  .md\:py-96 {
    padding-top: 96px;
    padding-bottom: 96px;
  }
  .md\:px-120 {
    padding-left: 120px;
    padding-right: 120px;
  }
  .md\:py-120 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .md\:px-auto {
    padding-left: auto;
    padding-right: auto;
  }
  .md\:py-auto {
    padding-top: auto;
    padding-bottom: auto;
  }
}
@media (min-width: 992px) {
  .lg\:px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .lg\:py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .lg\:px-2 {
    padding-left: 2px;
    padding-right: 2px;
  }
  .lg\:py-2 {
    padding-top: 2px;
    padding-bottom: 2px;
  }
  .lg\:px-4 {
    padding-left: 4px;
    padding-right: 4px;
  }
  .lg\:py-4 {
    padding-top: 4px;
    padding-bottom: 4px;
  }
  .lg\:px-6 {
    padding-left: 6px;
    padding-right: 6px;
  }
  .lg\:py-6 {
    padding-top: 6px;
    padding-bottom: 6px;
  }
  .lg\:px-8 {
    padding-left: 8px;
    padding-right: 8px;
  }
  .lg\:py-8 {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .lg\:px-10 {
    padding-left: 10px;
    padding-right: 10px;
  }
  .lg\:py-10 {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .lg\:px-12 {
    padding-left: 12px;
    padding-right: 12px;
  }
  .lg\:py-12 {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .lg\:px-14 {
    padding-left: 14px;
    padding-right: 14px;
  }
  .lg\:py-14 {
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .lg\:px-16 {
    padding-left: 16px;
    padding-right: 16px;
  }
  .lg\:py-16 {
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .lg\:px-20 {
    padding-left: 20px;
    padding-right: 20px;
  }
  .lg\:py-20 {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .lg\:px-24 {
    padding-left: 24px;
    padding-right: 24px;
  }
  .lg\:py-24 {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .lg\:px-28 {
    padding-left: 28px;
    padding-right: 28px;
  }
  .lg\:py-28 {
    padding-top: 28px;
    padding-bottom: 28px;
  }
  .lg\:px-30 {
    padding-left: 30px;
    padding-right: 30px;
  }
  .lg\:py-30 {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .lg\:px-32 {
    padding-left: 32px;
    padding-right: 32px;
  }
  .lg\:py-32 {
    padding-top: 32px;
    padding-bottom: 32px;
  }
  .lg\:px-40 {
    padding-left: 40px;
    padding-right: 40px;
  }
  .lg\:py-40 {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .lg\:px-48 {
    padding-left: 48px;
    padding-right: 48px;
  }
  .lg\:py-48 {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .lg\:px-56 {
    padding-left: 56px;
    padding-right: 56px;
  }
  .lg\:py-56 {
    padding-top: 56px;
    padding-bottom: 56px;
  }
  .lg\:px-64 {
    padding-left: 64px;
    padding-right: 64px;
  }
  .lg\:py-64 {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .lg\:px-80 {
    padding-left: 80px;
    padding-right: 80px;
  }
  .lg\:py-80 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .lg\:px-96 {
    padding-left: 96px;
    padding-right: 96px;
  }
  .lg\:py-96 {
    padding-top: 96px;
    padding-bottom: 96px;
  }
  .lg\:px-120 {
    padding-left: 120px;
    padding-right: 120px;
  }
  .lg\:py-120 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .lg\:px-auto {
    padding-left: auto;
    padding-right: auto;
  }
  .lg\:py-auto {
    padding-top: auto;
    padding-bottom: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .xl\:py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .xl\:px-2 {
    padding-left: 2px;
    padding-right: 2px;
  }
  .xl\:py-2 {
    padding-top: 2px;
    padding-bottom: 2px;
  }
  .xl\:px-4 {
    padding-left: 4px;
    padding-right: 4px;
  }
  .xl\:py-4 {
    padding-top: 4px;
    padding-bottom: 4px;
  }
  .xl\:px-6 {
    padding-left: 6px;
    padding-right: 6px;
  }
  .xl\:py-6 {
    padding-top: 6px;
    padding-bottom: 6px;
  }
  .xl\:px-8 {
    padding-left: 8px;
    padding-right: 8px;
  }
  .xl\:py-8 {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .xl\:px-10 {
    padding-left: 10px;
    padding-right: 10px;
  }
  .xl\:py-10 {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .xl\:px-12 {
    padding-left: 12px;
    padding-right: 12px;
  }
  .xl\:py-12 {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .xl\:px-14 {
    padding-left: 14px;
    padding-right: 14px;
  }
  .xl\:py-14 {
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .xl\:px-16 {
    padding-left: 16px;
    padding-right: 16px;
  }
  .xl\:py-16 {
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .xl\:px-20 {
    padding-left: 20px;
    padding-right: 20px;
  }
  .xl\:py-20 {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .xl\:px-24 {
    padding-left: 24px;
    padding-right: 24px;
  }
  .xl\:py-24 {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .xl\:px-28 {
    padding-left: 28px;
    padding-right: 28px;
  }
  .xl\:py-28 {
    padding-top: 28px;
    padding-bottom: 28px;
  }
  .xl\:px-30 {
    padding-left: 30px;
    padding-right: 30px;
  }
  .xl\:py-30 {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .xl\:px-32 {
    padding-left: 32px;
    padding-right: 32px;
  }
  .xl\:py-32 {
    padding-top: 32px;
    padding-bottom: 32px;
  }
  .xl\:px-40 {
    padding-left: 40px;
    padding-right: 40px;
  }
  .xl\:py-40 {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .xl\:px-48 {
    padding-left: 48px;
    padding-right: 48px;
  }
  .xl\:py-48 {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .xl\:px-56 {
    padding-left: 56px;
    padding-right: 56px;
  }
  .xl\:py-56 {
    padding-top: 56px;
    padding-bottom: 56px;
  }
  .xl\:px-64 {
    padding-left: 64px;
    padding-right: 64px;
  }
  .xl\:py-64 {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .xl\:px-80 {
    padding-left: 80px;
    padding-right: 80px;
  }
  .xl\:py-80 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .xl\:px-96 {
    padding-left: 96px;
    padding-right: 96px;
  }
  .xl\:py-96 {
    padding-top: 96px;
    padding-bottom: 96px;
  }
  .xl\:px-120 {
    padding-left: 120px;
    padding-right: 120px;
  }
  .xl\:py-120 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .xl\:px-auto {
    padding-left: auto;
    padding-right: auto;
  }
  .xl\:py-auto {
    padding-top: auto;
    padding-bottom: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .xxl\:py-0 {
    padding-top: 0;
    padding-bottom: 0;
  }
  .xxl\:px-2 {
    padding-left: 2px;
    padding-right: 2px;
  }
  .xxl\:py-2 {
    padding-top: 2px;
    padding-bottom: 2px;
  }
  .xxl\:px-4 {
    padding-left: 4px;
    padding-right: 4px;
  }
  .xxl\:py-4 {
    padding-top: 4px;
    padding-bottom: 4px;
  }
  .xxl\:px-6 {
    padding-left: 6px;
    padding-right: 6px;
  }
  .xxl\:py-6 {
    padding-top: 6px;
    padding-bottom: 6px;
  }
  .xxl\:px-8 {
    padding-left: 8px;
    padding-right: 8px;
  }
  .xxl\:py-8 {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .xxl\:px-10 {
    padding-left: 10px;
    padding-right: 10px;
  }
  .xxl\:py-10 {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .xxl\:px-12 {
    padding-left: 12px;
    padding-right: 12px;
  }
  .xxl\:py-12 {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .xxl\:px-14 {
    padding-left: 14px;
    padding-right: 14px;
  }
  .xxl\:py-14 {
    padding-top: 14px;
    padding-bottom: 14px;
  }
  .xxl\:px-16 {
    padding-left: 16px;
    padding-right: 16px;
  }
  .xxl\:py-16 {
    padding-top: 16px;
    padding-bottom: 16px;
  }
  .xxl\:px-20 {
    padding-left: 20px;
    padding-right: 20px;
  }
  .xxl\:py-20 {
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .xxl\:px-24 {
    padding-left: 24px;
    padding-right: 24px;
  }
  .xxl\:py-24 {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .xxl\:px-28 {
    padding-left: 28px;
    padding-right: 28px;
  }
  .xxl\:py-28 {
    padding-top: 28px;
    padding-bottom: 28px;
  }
  .xxl\:px-30 {
    padding-left: 30px;
    padding-right: 30px;
  }
  .xxl\:py-30 {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .xxl\:px-32 {
    padding-left: 32px;
    padding-right: 32px;
  }
  .xxl\:py-32 {
    padding-top: 32px;
    padding-bottom: 32px;
  }
  .xxl\:px-40 {
    padding-left: 40px;
    padding-right: 40px;
  }
  .xxl\:py-40 {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .xxl\:px-48 {
    padding-left: 48px;
    padding-right: 48px;
  }
  .xxl\:py-48 {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .xxl\:px-56 {
    padding-left: 56px;
    padding-right: 56px;
  }
  .xxl\:py-56 {
    padding-top: 56px;
    padding-bottom: 56px;
  }
  .xxl\:px-64 {
    padding-left: 64px;
    padding-right: 64px;
  }
  .xxl\:py-64 {
    padding-top: 64px;
    padding-bottom: 64px;
  }
  .xxl\:px-80 {
    padding-left: 80px;
    padding-right: 80px;
  }
  .xxl\:py-80 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
  .xxl\:px-96 {
    padding-left: 96px;
    padding-right: 96px;
  }
  .xxl\:py-96 {
    padding-top: 96px;
    padding-bottom: 96px;
  }
  .xxl\:px-120 {
    padding-left: 120px;
    padding-right: 120px;
  }
  .xxl\:py-120 {
    padding-top: 120px;
    padding-bottom: 120px;
  }
  .xxl\:px-auto {
    padding-left: auto;
    padding-right: auto;
  }
  .xxl\:py-auto {
    padding-top: auto;
    padding-bottom: auto;
  }
}
.m-0 {
  margin: 0;
}

.m-2 {
  margin: 2px;
}

.m-4 {
  margin: 4px;
}

.m-6 {
  margin: 6px;
}

.m-8 {
  margin: 8px;
}

.m-10 {
  margin: 10px;
}

.m-12 {
  margin: 12px;
}

.m-14 {
  margin: 14px;
}

.m-16 {
  margin: 16px;
}

.m-20 {
  margin: 20px;
}

.m-24 {
  margin: 24px;
}

.m-28 {
  margin: 28px;
}

.m-30 {
  margin: 30px;
}

.m-32 {
  margin: 32px;
}

.m-40 {
  margin: 40px;
}

.m-48 {
  margin: 48px;
}

.m-56 {
  margin: 56px;
}

.m-64 {
  margin: 64px;
}

.m-80 {
  margin: 80px;
}

.m-96 {
  margin: 96px;
}

.m-120 {
  margin: 120px;
}

.m-auto {
  margin: auto;
}

@media (min-width: 576px) {
  .sm\:m-0 {
    margin: 0;
  }
  .sm\:m-2 {
    margin: 2px;
  }
  .sm\:m-4 {
    margin: 4px;
  }
  .sm\:m-6 {
    margin: 6px;
  }
  .sm\:m-8 {
    margin: 8px;
  }
  .sm\:m-10 {
    margin: 10px;
  }
  .sm\:m-12 {
    margin: 12px;
  }
  .sm\:m-14 {
    margin: 14px;
  }
  .sm\:m-16 {
    margin: 16px;
  }
  .sm\:m-20 {
    margin: 20px;
  }
  .sm\:m-24 {
    margin: 24px;
  }
  .sm\:m-28 {
    margin: 28px;
  }
  .sm\:m-30 {
    margin: 30px;
  }
  .sm\:m-32 {
    margin: 32px;
  }
  .sm\:m-40 {
    margin: 40px;
  }
  .sm\:m-48 {
    margin: 48px;
  }
  .sm\:m-56 {
    margin: 56px;
  }
  .sm\:m-64 {
    margin: 64px;
  }
  .sm\:m-80 {
    margin: 80px;
  }
  .sm\:m-96 {
    margin: 96px;
  }
  .sm\:m-120 {
    margin: 120px;
  }
  .sm\:m-auto {
    margin: auto;
  }
}
@media (min-width: 768px) {
  .md\:m-0 {
    margin: 0;
  }
  .md\:m-2 {
    margin: 2px;
  }
  .md\:m-4 {
    margin: 4px;
  }
  .md\:m-6 {
    margin: 6px;
  }
  .md\:m-8 {
    margin: 8px;
  }
  .md\:m-10 {
    margin: 10px;
  }
  .md\:m-12 {
    margin: 12px;
  }
  .md\:m-14 {
    margin: 14px;
  }
  .md\:m-16 {
    margin: 16px;
  }
  .md\:m-20 {
    margin: 20px;
  }
  .md\:m-24 {
    margin: 24px;
  }
  .md\:m-28 {
    margin: 28px;
  }
  .md\:m-30 {
    margin: 30px;
  }
  .md\:m-32 {
    margin: 32px;
  }
  .md\:m-40 {
    margin: 40px;
  }
  .md\:m-48 {
    margin: 48px;
  }
  .md\:m-56 {
    margin: 56px;
  }
  .md\:m-64 {
    margin: 64px;
  }
  .md\:m-80 {
    margin: 80px;
  }
  .md\:m-96 {
    margin: 96px;
  }
  .md\:m-120 {
    margin: 120px;
  }
  .md\:m-auto {
    margin: auto;
  }
}
@media (min-width: 992px) {
  .lg\:m-0 {
    margin: 0;
  }
  .lg\:m-2 {
    margin: 2px;
  }
  .lg\:m-4 {
    margin: 4px;
  }
  .lg\:m-6 {
    margin: 6px;
  }
  .lg\:m-8 {
    margin: 8px;
  }
  .lg\:m-10 {
    margin: 10px;
  }
  .lg\:m-12 {
    margin: 12px;
  }
  .lg\:m-14 {
    margin: 14px;
  }
  .lg\:m-16 {
    margin: 16px;
  }
  .lg\:m-20 {
    margin: 20px;
  }
  .lg\:m-24 {
    margin: 24px;
  }
  .lg\:m-28 {
    margin: 28px;
  }
  .lg\:m-30 {
    margin: 30px;
  }
  .lg\:m-32 {
    margin: 32px;
  }
  .lg\:m-40 {
    margin: 40px;
  }
  .lg\:m-48 {
    margin: 48px;
  }
  .lg\:m-56 {
    margin: 56px;
  }
  .lg\:m-64 {
    margin: 64px;
  }
  .lg\:m-80 {
    margin: 80px;
  }
  .lg\:m-96 {
    margin: 96px;
  }
  .lg\:m-120 {
    margin: 120px;
  }
  .lg\:m-auto {
    margin: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:m-0 {
    margin: 0;
  }
  .xl\:m-2 {
    margin: 2px;
  }
  .xl\:m-4 {
    margin: 4px;
  }
  .xl\:m-6 {
    margin: 6px;
  }
  .xl\:m-8 {
    margin: 8px;
  }
  .xl\:m-10 {
    margin: 10px;
  }
  .xl\:m-12 {
    margin: 12px;
  }
  .xl\:m-14 {
    margin: 14px;
  }
  .xl\:m-16 {
    margin: 16px;
  }
  .xl\:m-20 {
    margin: 20px;
  }
  .xl\:m-24 {
    margin: 24px;
  }
  .xl\:m-28 {
    margin: 28px;
  }
  .xl\:m-30 {
    margin: 30px;
  }
  .xl\:m-32 {
    margin: 32px;
  }
  .xl\:m-40 {
    margin: 40px;
  }
  .xl\:m-48 {
    margin: 48px;
  }
  .xl\:m-56 {
    margin: 56px;
  }
  .xl\:m-64 {
    margin: 64px;
  }
  .xl\:m-80 {
    margin: 80px;
  }
  .xl\:m-96 {
    margin: 96px;
  }
  .xl\:m-120 {
    margin: 120px;
  }
  .xl\:m-auto {
    margin: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:m-0 {
    margin: 0;
  }
  .xxl\:m-2 {
    margin: 2px;
  }
  .xxl\:m-4 {
    margin: 4px;
  }
  .xxl\:m-6 {
    margin: 6px;
  }
  .xxl\:m-8 {
    margin: 8px;
  }
  .xxl\:m-10 {
    margin: 10px;
  }
  .xxl\:m-12 {
    margin: 12px;
  }
  .xxl\:m-14 {
    margin: 14px;
  }
  .xxl\:m-16 {
    margin: 16px;
  }
  .xxl\:m-20 {
    margin: 20px;
  }
  .xxl\:m-24 {
    margin: 24px;
  }
  .xxl\:m-28 {
    margin: 28px;
  }
  .xxl\:m-30 {
    margin: 30px;
  }
  .xxl\:m-32 {
    margin: 32px;
  }
  .xxl\:m-40 {
    margin: 40px;
  }
  .xxl\:m-48 {
    margin: 48px;
  }
  .xxl\:m-56 {
    margin: 56px;
  }
  .xxl\:m-64 {
    margin: 64px;
  }
  .xxl\:m-80 {
    margin: 80px;
  }
  .xxl\:m-96 {
    margin: 96px;
  }
  .xxl\:m-120 {
    margin: 120px;
  }
  .xxl\:m-auto {
    margin: auto;
  }
}
.mt-0 {
  margin-top: 0;
}

.mt-2 {
  margin-top: 2px;
}

.mt-4 {
  margin-top: 4px;
}

.mt-6 {
  margin-top: 6px;
}

.mt-8 {
  margin-top: 8px;
}

.mt-10 {
  margin-top: 10px;
}

.mt-12 {
  margin-top: 12px;
}

.mt-14 {
  margin-top: 14px;
}

.mt-16 {
  margin-top: 16px;
}

.mt-20 {
  margin-top: 20px;
}

.mt-24 {
  margin-top: 24px;
}

.mt-28 {
  margin-top: 28px;
}

.mt-30 {
  margin-top: 30px;
}

.mt-32 {
  margin-top: 32px;
}

.mt-40 {
  margin-top: 40px;
}

.mt-48 {
  margin-top: 48px;
}

.mt-56 {
  margin-top: 56px;
}

.mt-64 {
  margin-top: 64px;
}

.mt-80 {
  margin-top: 80px;
}

.mt-96 {
  margin-top: 96px;
}

.mt-120 {
  margin-top: 120px;
}

.mt-auto {
  margin-top: auto;
}

@media (min-width: 576px) {
  .sm\:mt-0 {
    margin-top: 0;
  }
  .sm\:mt-2 {
    margin-top: 2px;
  }
  .sm\:mt-4 {
    margin-top: 4px;
  }
  .sm\:mt-6 {
    margin-top: 6px;
  }
  .sm\:mt-8 {
    margin-top: 8px;
  }
  .sm\:mt-10 {
    margin-top: 10px;
  }
  .sm\:mt-12 {
    margin-top: 12px;
  }
  .sm\:mt-14 {
    margin-top: 14px;
  }
  .sm\:mt-16 {
    margin-top: 16px;
  }
  .sm\:mt-20 {
    margin-top: 20px;
  }
  .sm\:mt-24 {
    margin-top: 24px;
  }
  .sm\:mt-28 {
    margin-top: 28px;
  }
  .sm\:mt-30 {
    margin-top: 30px;
  }
  .sm\:mt-32 {
    margin-top: 32px;
  }
  .sm\:mt-40 {
    margin-top: 40px;
  }
  .sm\:mt-48 {
    margin-top: 48px;
  }
  .sm\:mt-56 {
    margin-top: 56px;
  }
  .sm\:mt-64 {
    margin-top: 64px;
  }
  .sm\:mt-80 {
    margin-top: 80px;
  }
  .sm\:mt-96 {
    margin-top: 96px;
  }
  .sm\:mt-120 {
    margin-top: 120px;
  }
  .sm\:mt-auto {
    margin-top: auto;
  }
}
@media (min-width: 768px) {
  .md\:mt-0 {
    margin-top: 0;
  }
  .md\:mt-2 {
    margin-top: 2px;
  }
  .md\:mt-4 {
    margin-top: 4px;
  }
  .md\:mt-6 {
    margin-top: 6px;
  }
  .md\:mt-8 {
    margin-top: 8px;
  }
  .md\:mt-10 {
    margin-top: 10px;
  }
  .md\:mt-12 {
    margin-top: 12px;
  }
  .md\:mt-14 {
    margin-top: 14px;
  }
  .md\:mt-16 {
    margin-top: 16px;
  }
  .md\:mt-20 {
    margin-top: 20px;
  }
  .md\:mt-24 {
    margin-top: 24px;
  }
  .md\:mt-28 {
    margin-top: 28px;
  }
  .md\:mt-30 {
    margin-top: 30px;
  }
  .md\:mt-32 {
    margin-top: 32px;
  }
  .md\:mt-40 {
    margin-top: 40px;
  }
  .md\:mt-48 {
    margin-top: 48px;
  }
  .md\:mt-56 {
    margin-top: 56px;
  }
  .md\:mt-64 {
    margin-top: 64px;
  }
  .md\:mt-80 {
    margin-top: 80px;
  }
  .md\:mt-96 {
    margin-top: 96px;
  }
  .md\:mt-120 {
    margin-top: 120px;
  }
  .md\:mt-auto {
    margin-top: auto;
  }
}
@media (min-width: 992px) {
  .lg\:mt-0 {
    margin-top: 0;
  }
  .lg\:mt-2 {
    margin-top: 2px;
  }
  .lg\:mt-4 {
    margin-top: 4px;
  }
  .lg\:mt-6 {
    margin-top: 6px;
  }
  .lg\:mt-8 {
    margin-top: 8px;
  }
  .lg\:mt-10 {
    margin-top: 10px;
  }
  .lg\:mt-12 {
    margin-top: 12px;
  }
  .lg\:mt-14 {
    margin-top: 14px;
  }
  .lg\:mt-16 {
    margin-top: 16px;
  }
  .lg\:mt-20 {
    margin-top: 20px;
  }
  .lg\:mt-24 {
    margin-top: 24px;
  }
  .lg\:mt-28 {
    margin-top: 28px;
  }
  .lg\:mt-30 {
    margin-top: 30px;
  }
  .lg\:mt-32 {
    margin-top: 32px;
  }
  .lg\:mt-40 {
    margin-top: 40px;
  }
  .lg\:mt-48 {
    margin-top: 48px;
  }
  .lg\:mt-56 {
    margin-top: 56px;
  }
  .lg\:mt-64 {
    margin-top: 64px;
  }
  .lg\:mt-80 {
    margin-top: 80px;
  }
  .lg\:mt-96 {
    margin-top: 96px;
  }
  .lg\:mt-120 {
    margin-top: 120px;
  }
  .lg\:mt-auto {
    margin-top: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:mt-0 {
    margin-top: 0;
  }
  .xl\:mt-2 {
    margin-top: 2px;
  }
  .xl\:mt-4 {
    margin-top: 4px;
  }
  .xl\:mt-6 {
    margin-top: 6px;
  }
  .xl\:mt-8 {
    margin-top: 8px;
  }
  .xl\:mt-10 {
    margin-top: 10px;
  }
  .xl\:mt-12 {
    margin-top: 12px;
  }
  .xl\:mt-14 {
    margin-top: 14px;
  }
  .xl\:mt-16 {
    margin-top: 16px;
  }
  .xl\:mt-20 {
    margin-top: 20px;
  }
  .xl\:mt-24 {
    margin-top: 24px;
  }
  .xl\:mt-28 {
    margin-top: 28px;
  }
  .xl\:mt-30 {
    margin-top: 30px;
  }
  .xl\:mt-32 {
    margin-top: 32px;
  }
  .xl\:mt-40 {
    margin-top: 40px;
  }
  .xl\:mt-48 {
    margin-top: 48px;
  }
  .xl\:mt-56 {
    margin-top: 56px;
  }
  .xl\:mt-64 {
    margin-top: 64px;
  }
  .xl\:mt-80 {
    margin-top: 80px;
  }
  .xl\:mt-96 {
    margin-top: 96px;
  }
  .xl\:mt-120 {
    margin-top: 120px;
  }
  .xl\:mt-auto {
    margin-top: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:mt-0 {
    margin-top: 0;
  }
  .xxl\:mt-2 {
    margin-top: 2px;
  }
  .xxl\:mt-4 {
    margin-top: 4px;
  }
  .xxl\:mt-6 {
    margin-top: 6px;
  }
  .xxl\:mt-8 {
    margin-top: 8px;
  }
  .xxl\:mt-10 {
    margin-top: 10px;
  }
  .xxl\:mt-12 {
    margin-top: 12px;
  }
  .xxl\:mt-14 {
    margin-top: 14px;
  }
  .xxl\:mt-16 {
    margin-top: 16px;
  }
  .xxl\:mt-20 {
    margin-top: 20px;
  }
  .xxl\:mt-24 {
    margin-top: 24px;
  }
  .xxl\:mt-28 {
    margin-top: 28px;
  }
  .xxl\:mt-30 {
    margin-top: 30px;
  }
  .xxl\:mt-32 {
    margin-top: 32px;
  }
  .xxl\:mt-40 {
    margin-top: 40px;
  }
  .xxl\:mt-48 {
    margin-top: 48px;
  }
  .xxl\:mt-56 {
    margin-top: 56px;
  }
  .xxl\:mt-64 {
    margin-top: 64px;
  }
  .xxl\:mt-80 {
    margin-top: 80px;
  }
  .xxl\:mt-96 {
    margin-top: 96px;
  }
  .xxl\:mt-120 {
    margin-top: 120px;
  }
  .xxl\:mt-auto {
    margin-top: auto;
  }
}
.mr-0 {
  margin-right: 0;
}

.mr-2 {
  margin-right: 2px;
}

.mr-4 {
  margin-right: 4px;
}

.mr-6 {
  margin-right: 6px;
}

.mr-8 {
  margin-right: 8px;
}

.mr-10 {
  margin-right: 10px;
}

.mr-12 {
  margin-right: 12px;
}

.mr-14 {
  margin-right: 14px;
}

.mr-16 {
  margin-right: 16px;
}

.mr-20 {
  margin-right: 20px;
}

.mr-24 {
  margin-right: 24px;
}

.mr-28 {
  margin-right: 28px;
}

.mr-30 {
  margin-right: 30px;
}

.mr-32 {
  margin-right: 32px;
}

.mr-40 {
  margin-right: 40px;
}

.mr-48 {
  margin-right: 48px;
}

.mr-56 {
  margin-right: 56px;
}

.mr-64 {
  margin-right: 64px;
}

.mr-80 {
  margin-right: 80px;
}

.mr-96 {
  margin-right: 96px;
}

.mr-120 {
  margin-right: 120px;
}

.mr-auto {
  margin-right: auto;
}

@media (min-width: 576px) {
  .sm\:mr-0 {
    margin-right: 0;
  }
  .sm\:mr-2 {
    margin-right: 2px;
  }
  .sm\:mr-4 {
    margin-right: 4px;
  }
  .sm\:mr-6 {
    margin-right: 6px;
  }
  .sm\:mr-8 {
    margin-right: 8px;
  }
  .sm\:mr-10 {
    margin-right: 10px;
  }
  .sm\:mr-12 {
    margin-right: 12px;
  }
  .sm\:mr-14 {
    margin-right: 14px;
  }
  .sm\:mr-16 {
    margin-right: 16px;
  }
  .sm\:mr-20 {
    margin-right: 20px;
  }
  .sm\:mr-24 {
    margin-right: 24px;
  }
  .sm\:mr-28 {
    margin-right: 28px;
  }
  .sm\:mr-30 {
    margin-right: 30px;
  }
  .sm\:mr-32 {
    margin-right: 32px;
  }
  .sm\:mr-40 {
    margin-right: 40px;
  }
  .sm\:mr-48 {
    margin-right: 48px;
  }
  .sm\:mr-56 {
    margin-right: 56px;
  }
  .sm\:mr-64 {
    margin-right: 64px;
  }
  .sm\:mr-80 {
    margin-right: 80px;
  }
  .sm\:mr-96 {
    margin-right: 96px;
  }
  .sm\:mr-120 {
    margin-right: 120px;
  }
  .sm\:mr-auto {
    margin-right: auto;
  }
}
@media (min-width: 768px) {
  .md\:mr-0 {
    margin-right: 0;
  }
  .md\:mr-2 {
    margin-right: 2px;
  }
  .md\:mr-4 {
    margin-right: 4px;
  }
  .md\:mr-6 {
    margin-right: 6px;
  }
  .md\:mr-8 {
    margin-right: 8px;
  }
  .md\:mr-10 {
    margin-right: 10px;
  }
  .md\:mr-12 {
    margin-right: 12px;
  }
  .md\:mr-14 {
    margin-right: 14px;
  }
  .md\:mr-16 {
    margin-right: 16px;
  }
  .md\:mr-20 {
    margin-right: 20px;
  }
  .md\:mr-24 {
    margin-right: 24px;
  }
  .md\:mr-28 {
    margin-right: 28px;
  }
  .md\:mr-30 {
    margin-right: 30px;
  }
  .md\:mr-32 {
    margin-right: 32px;
  }
  .md\:mr-40 {
    margin-right: 40px;
  }
  .md\:mr-48 {
    margin-right: 48px;
  }
  .md\:mr-56 {
    margin-right: 56px;
  }
  .md\:mr-64 {
    margin-right: 64px;
  }
  .md\:mr-80 {
    margin-right: 80px;
  }
  .md\:mr-96 {
    margin-right: 96px;
  }
  .md\:mr-120 {
    margin-right: 120px;
  }
  .md\:mr-auto {
    margin-right: auto;
  }
}
@media (min-width: 992px) {
  .lg\:mr-0 {
    margin-right: 0;
  }
  .lg\:mr-2 {
    margin-right: 2px;
  }
  .lg\:mr-4 {
    margin-right: 4px;
  }
  .lg\:mr-6 {
    margin-right: 6px;
  }
  .lg\:mr-8 {
    margin-right: 8px;
  }
  .lg\:mr-10 {
    margin-right: 10px;
  }
  .lg\:mr-12 {
    margin-right: 12px;
  }
  .lg\:mr-14 {
    margin-right: 14px;
  }
  .lg\:mr-16 {
    margin-right: 16px;
  }
  .lg\:mr-20 {
    margin-right: 20px;
  }
  .lg\:mr-24 {
    margin-right: 24px;
  }
  .lg\:mr-28 {
    margin-right: 28px;
  }
  .lg\:mr-30 {
    margin-right: 30px;
  }
  .lg\:mr-32 {
    margin-right: 32px;
  }
  .lg\:mr-40 {
    margin-right: 40px;
  }
  .lg\:mr-48 {
    margin-right: 48px;
  }
  .lg\:mr-56 {
    margin-right: 56px;
  }
  .lg\:mr-64 {
    margin-right: 64px;
  }
  .lg\:mr-80 {
    margin-right: 80px;
  }
  .lg\:mr-96 {
    margin-right: 96px;
  }
  .lg\:mr-120 {
    margin-right: 120px;
  }
  .lg\:mr-auto {
    margin-right: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:mr-0 {
    margin-right: 0;
  }
  .xl\:mr-2 {
    margin-right: 2px;
  }
  .xl\:mr-4 {
    margin-right: 4px;
  }
  .xl\:mr-6 {
    margin-right: 6px;
  }
  .xl\:mr-8 {
    margin-right: 8px;
  }
  .xl\:mr-10 {
    margin-right: 10px;
  }
  .xl\:mr-12 {
    margin-right: 12px;
  }
  .xl\:mr-14 {
    margin-right: 14px;
  }
  .xl\:mr-16 {
    margin-right: 16px;
  }
  .xl\:mr-20 {
    margin-right: 20px;
  }
  .xl\:mr-24 {
    margin-right: 24px;
  }
  .xl\:mr-28 {
    margin-right: 28px;
  }
  .xl\:mr-30 {
    margin-right: 30px;
  }
  .xl\:mr-32 {
    margin-right: 32px;
  }
  .xl\:mr-40 {
    margin-right: 40px;
  }
  .xl\:mr-48 {
    margin-right: 48px;
  }
  .xl\:mr-56 {
    margin-right: 56px;
  }
  .xl\:mr-64 {
    margin-right: 64px;
  }
  .xl\:mr-80 {
    margin-right: 80px;
  }
  .xl\:mr-96 {
    margin-right: 96px;
  }
  .xl\:mr-120 {
    margin-right: 120px;
  }
  .xl\:mr-auto {
    margin-right: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:mr-0 {
    margin-right: 0;
  }
  .xxl\:mr-2 {
    margin-right: 2px;
  }
  .xxl\:mr-4 {
    margin-right: 4px;
  }
  .xxl\:mr-6 {
    margin-right: 6px;
  }
  .xxl\:mr-8 {
    margin-right: 8px;
  }
  .xxl\:mr-10 {
    margin-right: 10px;
  }
  .xxl\:mr-12 {
    margin-right: 12px;
  }
  .xxl\:mr-14 {
    margin-right: 14px;
  }
  .xxl\:mr-16 {
    margin-right: 16px;
  }
  .xxl\:mr-20 {
    margin-right: 20px;
  }
  .xxl\:mr-24 {
    margin-right: 24px;
  }
  .xxl\:mr-28 {
    margin-right: 28px;
  }
  .xxl\:mr-30 {
    margin-right: 30px;
  }
  .xxl\:mr-32 {
    margin-right: 32px;
  }
  .xxl\:mr-40 {
    margin-right: 40px;
  }
  .xxl\:mr-48 {
    margin-right: 48px;
  }
  .xxl\:mr-56 {
    margin-right: 56px;
  }
  .xxl\:mr-64 {
    margin-right: 64px;
  }
  .xxl\:mr-80 {
    margin-right: 80px;
  }
  .xxl\:mr-96 {
    margin-right: 96px;
  }
  .xxl\:mr-120 {
    margin-right: 120px;
  }
  .xxl\:mr-auto {
    margin-right: auto;
  }
}
.mb-0 {
  margin-bottom: 0;
}

.mb-2 {
  margin-bottom: 2px;
}

.mb-4 {
  margin-bottom: 4px;
}

.mb-6 {
  margin-bottom: 6px;
}

.mb-8 {
  margin-bottom: 8px;
}

.mb-10 {
  margin-bottom: 10px;
}

.mb-12 {
  margin-bottom: 12px;
}

.mb-14 {
  margin-bottom: 14px;
}

.mb-16 {
  margin-bottom: 16px;
}

.mb-20 {
  margin-bottom: 20px;
}

.mb-24 {
  margin-bottom: 24px;
}

.mb-28 {
  margin-bottom: 28px;
}

.mb-30 {
  margin-bottom: 30px;
}

.mb-32 {
  margin-bottom: 32px;
}

.mb-40 {
  margin-bottom: 40px;
}

.mb-48 {
  margin-bottom: 48px;
}

.mb-56 {
  margin-bottom: 56px;
}

.mb-64 {
  margin-bottom: 64px;
}

.mb-80 {
  margin-bottom: 80px;
}

.mb-96 {
  margin-bottom: 96px;
}

.mb-120 {
  margin-bottom: 120px;
}

.mb-auto {
  margin-bottom: auto;
}

@media (min-width: 576px) {
  .sm\:mb-0 {
    margin-bottom: 0;
  }
  .sm\:mb-2 {
    margin-bottom: 2px;
  }
  .sm\:mb-4 {
    margin-bottom: 4px;
  }
  .sm\:mb-6 {
    margin-bottom: 6px;
  }
  .sm\:mb-8 {
    margin-bottom: 8px;
  }
  .sm\:mb-10 {
    margin-bottom: 10px;
  }
  .sm\:mb-12 {
    margin-bottom: 12px;
  }
  .sm\:mb-14 {
    margin-bottom: 14px;
  }
  .sm\:mb-16 {
    margin-bottom: 16px;
  }
  .sm\:mb-20 {
    margin-bottom: 20px;
  }
  .sm\:mb-24 {
    margin-bottom: 24px;
  }
  .sm\:mb-28 {
    margin-bottom: 28px;
  }
  .sm\:mb-30 {
    margin-bottom: 30px;
  }
  .sm\:mb-32 {
    margin-bottom: 32px;
  }
  .sm\:mb-40 {
    margin-bottom: 40px;
  }
  .sm\:mb-48 {
    margin-bottom: 48px;
  }
  .sm\:mb-56 {
    margin-bottom: 56px;
  }
  .sm\:mb-64 {
    margin-bottom: 64px;
  }
  .sm\:mb-80 {
    margin-bottom: 80px;
  }
  .sm\:mb-96 {
    margin-bottom: 96px;
  }
  .sm\:mb-120 {
    margin-bottom: 120px;
  }
  .sm\:mb-auto {
    margin-bottom: auto;
  }
}
@media (min-width: 768px) {
  .md\:mb-0 {
    margin-bottom: 0;
  }
  .md\:mb-2 {
    margin-bottom: 2px;
  }
  .md\:mb-4 {
    margin-bottom: 4px;
  }
  .md\:mb-6 {
    margin-bottom: 6px;
  }
  .md\:mb-8 {
    margin-bottom: 8px;
  }
  .md\:mb-10 {
    margin-bottom: 10px;
  }
  .md\:mb-12 {
    margin-bottom: 12px;
  }
  .md\:mb-14 {
    margin-bottom: 14px;
  }
  .md\:mb-16 {
    margin-bottom: 16px;
  }
  .md\:mb-20 {
    margin-bottom: 20px;
  }
  .md\:mb-24 {
    margin-bottom: 24px;
  }
  .md\:mb-28 {
    margin-bottom: 28px;
  }
  .md\:mb-30 {
    margin-bottom: 30px;
  }
  .md\:mb-32 {
    margin-bottom: 32px;
  }
  .md\:mb-40 {
    margin-bottom: 40px;
  }
  .md\:mb-48 {
    margin-bottom: 48px;
  }
  .md\:mb-56 {
    margin-bottom: 56px;
  }
  .md\:mb-64 {
    margin-bottom: 64px;
  }
  .md\:mb-80 {
    margin-bottom: 80px;
  }
  .md\:mb-96 {
    margin-bottom: 96px;
  }
  .md\:mb-120 {
    margin-bottom: 120px;
  }
  .md\:mb-auto {
    margin-bottom: auto;
  }
}
@media (min-width: 992px) {
  .lg\:mb-0 {
    margin-bottom: 0;
  }
  .lg\:mb-2 {
    margin-bottom: 2px;
  }
  .lg\:mb-4 {
    margin-bottom: 4px;
  }
  .lg\:mb-6 {
    margin-bottom: 6px;
  }
  .lg\:mb-8 {
    margin-bottom: 8px;
  }
  .lg\:mb-10 {
    margin-bottom: 10px;
  }
  .lg\:mb-12 {
    margin-bottom: 12px;
  }
  .lg\:mb-14 {
    margin-bottom: 14px;
  }
  .lg\:mb-16 {
    margin-bottom: 16px;
  }
  .lg\:mb-20 {
    margin-bottom: 20px;
  }
  .lg\:mb-24 {
    margin-bottom: 24px;
  }
  .lg\:mb-28 {
    margin-bottom: 28px;
  }
  .lg\:mb-30 {
    margin-bottom: 30px;
  }
  .lg\:mb-32 {
    margin-bottom: 32px;
  }
  .lg\:mb-40 {
    margin-bottom: 40px;
  }
  .lg\:mb-48 {
    margin-bottom: 48px;
  }
  .lg\:mb-56 {
    margin-bottom: 56px;
  }
  .lg\:mb-64 {
    margin-bottom: 64px;
  }
  .lg\:mb-80 {
    margin-bottom: 80px;
  }
  .lg\:mb-96 {
    margin-bottom: 96px;
  }
  .lg\:mb-120 {
    margin-bottom: 120px;
  }
  .lg\:mb-auto {
    margin-bottom: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:mb-0 {
    margin-bottom: 0;
  }
  .xl\:mb-2 {
    margin-bottom: 2px;
  }
  .xl\:mb-4 {
    margin-bottom: 4px;
  }
  .xl\:mb-6 {
    margin-bottom: 6px;
  }
  .xl\:mb-8 {
    margin-bottom: 8px;
  }
  .xl\:mb-10 {
    margin-bottom: 10px;
  }
  .xl\:mb-12 {
    margin-bottom: 12px;
  }
  .xl\:mb-14 {
    margin-bottom: 14px;
  }
  .xl\:mb-16 {
    margin-bottom: 16px;
  }
  .xl\:mb-20 {
    margin-bottom: 20px;
  }
  .xl\:mb-24 {
    margin-bottom: 24px;
  }
  .xl\:mb-28 {
    margin-bottom: 28px;
  }
  .xl\:mb-30 {
    margin-bottom: 30px;
  }
  .xl\:mb-32 {
    margin-bottom: 32px;
  }
  .xl\:mb-40 {
    margin-bottom: 40px;
  }
  .xl\:mb-48 {
    margin-bottom: 48px;
  }
  .xl\:mb-56 {
    margin-bottom: 56px;
  }
  .xl\:mb-64 {
    margin-bottom: 64px;
  }
  .xl\:mb-80 {
    margin-bottom: 80px;
  }
  .xl\:mb-96 {
    margin-bottom: 96px;
  }
  .xl\:mb-120 {
    margin-bottom: 120px;
  }
  .xl\:mb-auto {
    margin-bottom: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:mb-0 {
    margin-bottom: 0;
  }
  .xxl\:mb-2 {
    margin-bottom: 2px;
  }
  .xxl\:mb-4 {
    margin-bottom: 4px;
  }
  .xxl\:mb-6 {
    margin-bottom: 6px;
  }
  .xxl\:mb-8 {
    margin-bottom: 8px;
  }
  .xxl\:mb-10 {
    margin-bottom: 10px;
  }
  .xxl\:mb-12 {
    margin-bottom: 12px;
  }
  .xxl\:mb-14 {
    margin-bottom: 14px;
  }
  .xxl\:mb-16 {
    margin-bottom: 16px;
  }
  .xxl\:mb-20 {
    margin-bottom: 20px;
  }
  .xxl\:mb-24 {
    margin-bottom: 24px;
  }
  .xxl\:mb-28 {
    margin-bottom: 28px;
  }
  .xxl\:mb-30 {
    margin-bottom: 30px;
  }
  .xxl\:mb-32 {
    margin-bottom: 32px;
  }
  .xxl\:mb-40 {
    margin-bottom: 40px;
  }
  .xxl\:mb-48 {
    margin-bottom: 48px;
  }
  .xxl\:mb-56 {
    margin-bottom: 56px;
  }
  .xxl\:mb-64 {
    margin-bottom: 64px;
  }
  .xxl\:mb-80 {
    margin-bottom: 80px;
  }
  .xxl\:mb-96 {
    margin-bottom: 96px;
  }
  .xxl\:mb-120 {
    margin-bottom: 120px;
  }
  .xxl\:mb-auto {
    margin-bottom: auto;
  }
}
.ml-0 {
  margin-left: 0;
}

.ml-2 {
  margin-left: 2px;
}

.ml-4 {
  margin-left: 4px;
}

.ml-6 {
  margin-left: 6px;
}

.ml-8 {
  margin-left: 8px;
}

.ml-10 {
  margin-left: 10px;
}

.ml-12 {
  margin-left: 12px;
}

.ml-14 {
  margin-left: 14px;
}

.ml-16 {
  margin-left: 16px;
}

.ml-20 {
  margin-left: 20px;
}

.ml-24 {
  margin-left: 24px;
}

.ml-28 {
  margin-left: 28px;
}

.ml-30 {
  margin-left: 30px;
}

.ml-32 {
  margin-left: 32px;
}

.ml-40 {
  margin-left: 40px;
}

.ml-48 {
  margin-left: 48px;
}

.ml-56 {
  margin-left: 56px;
}

.ml-64 {
  margin-left: 64px;
}

.ml-80 {
  margin-left: 80px;
}

.ml-96 {
  margin-left: 96px;
}

.ml-120 {
  margin-left: 120px;
}

.ml-auto {
  margin-left: auto;
}

@media (min-width: 576px) {
  .sm\:ml-0 {
    margin-left: 0;
  }
  .sm\:ml-2 {
    margin-left: 2px;
  }
  .sm\:ml-4 {
    margin-left: 4px;
  }
  .sm\:ml-6 {
    margin-left: 6px;
  }
  .sm\:ml-8 {
    margin-left: 8px;
  }
  .sm\:ml-10 {
    margin-left: 10px;
  }
  .sm\:ml-12 {
    margin-left: 12px;
  }
  .sm\:ml-14 {
    margin-left: 14px;
  }
  .sm\:ml-16 {
    margin-left: 16px;
  }
  .sm\:ml-20 {
    margin-left: 20px;
  }
  .sm\:ml-24 {
    margin-left: 24px;
  }
  .sm\:ml-28 {
    margin-left: 28px;
  }
  .sm\:ml-30 {
    margin-left: 30px;
  }
  .sm\:ml-32 {
    margin-left: 32px;
  }
  .sm\:ml-40 {
    margin-left: 40px;
  }
  .sm\:ml-48 {
    margin-left: 48px;
  }
  .sm\:ml-56 {
    margin-left: 56px;
  }
  .sm\:ml-64 {
    margin-left: 64px;
  }
  .sm\:ml-80 {
    margin-left: 80px;
  }
  .sm\:ml-96 {
    margin-left: 96px;
  }
  .sm\:ml-120 {
    margin-left: 120px;
  }
  .sm\:ml-auto {
    margin-left: auto;
  }
}
@media (min-width: 768px) {
  .md\:ml-0 {
    margin-left: 0;
  }
  .md\:ml-2 {
    margin-left: 2px;
  }
  .md\:ml-4 {
    margin-left: 4px;
  }
  .md\:ml-6 {
    margin-left: 6px;
  }
  .md\:ml-8 {
    margin-left: 8px;
  }
  .md\:ml-10 {
    margin-left: 10px;
  }
  .md\:ml-12 {
    margin-left: 12px;
  }
  .md\:ml-14 {
    margin-left: 14px;
  }
  .md\:ml-16 {
    margin-left: 16px;
  }
  .md\:ml-20 {
    margin-left: 20px;
  }
  .md\:ml-24 {
    margin-left: 24px;
  }
  .md\:ml-28 {
    margin-left: 28px;
  }
  .md\:ml-30 {
    margin-left: 30px;
  }
  .md\:ml-32 {
    margin-left: 32px;
  }
  .md\:ml-40 {
    margin-left: 40px;
  }
  .md\:ml-48 {
    margin-left: 48px;
  }
  .md\:ml-56 {
    margin-left: 56px;
  }
  .md\:ml-64 {
    margin-left: 64px;
  }
  .md\:ml-80 {
    margin-left: 80px;
  }
  .md\:ml-96 {
    margin-left: 96px;
  }
  .md\:ml-120 {
    margin-left: 120px;
  }
  .md\:ml-auto {
    margin-left: auto;
  }
}
@media (min-width: 992px) {
  .lg\:ml-0 {
    margin-left: 0;
  }
  .lg\:ml-2 {
    margin-left: 2px;
  }
  .lg\:ml-4 {
    margin-left: 4px;
  }
  .lg\:ml-6 {
    margin-left: 6px;
  }
  .lg\:ml-8 {
    margin-left: 8px;
  }
  .lg\:ml-10 {
    margin-left: 10px;
  }
  .lg\:ml-12 {
    margin-left: 12px;
  }
  .lg\:ml-14 {
    margin-left: 14px;
  }
  .lg\:ml-16 {
    margin-left: 16px;
  }
  .lg\:ml-20 {
    margin-left: 20px;
  }
  .lg\:ml-24 {
    margin-left: 24px;
  }
  .lg\:ml-28 {
    margin-left: 28px;
  }
  .lg\:ml-30 {
    margin-left: 30px;
  }
  .lg\:ml-32 {
    margin-left: 32px;
  }
  .lg\:ml-40 {
    margin-left: 40px;
  }
  .lg\:ml-48 {
    margin-left: 48px;
  }
  .lg\:ml-56 {
    margin-left: 56px;
  }
  .lg\:ml-64 {
    margin-left: 64px;
  }
  .lg\:ml-80 {
    margin-left: 80px;
  }
  .lg\:ml-96 {
    margin-left: 96px;
  }
  .lg\:ml-120 {
    margin-left: 120px;
  }
  .lg\:ml-auto {
    margin-left: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:ml-0 {
    margin-left: 0;
  }
  .xl\:ml-2 {
    margin-left: 2px;
  }
  .xl\:ml-4 {
    margin-left: 4px;
  }
  .xl\:ml-6 {
    margin-left: 6px;
  }
  .xl\:ml-8 {
    margin-left: 8px;
  }
  .xl\:ml-10 {
    margin-left: 10px;
  }
  .xl\:ml-12 {
    margin-left: 12px;
  }
  .xl\:ml-14 {
    margin-left: 14px;
  }
  .xl\:ml-16 {
    margin-left: 16px;
  }
  .xl\:ml-20 {
    margin-left: 20px;
  }
  .xl\:ml-24 {
    margin-left: 24px;
  }
  .xl\:ml-28 {
    margin-left: 28px;
  }
  .xl\:ml-30 {
    margin-left: 30px;
  }
  .xl\:ml-32 {
    margin-left: 32px;
  }
  .xl\:ml-40 {
    margin-left: 40px;
  }
  .xl\:ml-48 {
    margin-left: 48px;
  }
  .xl\:ml-56 {
    margin-left: 56px;
  }
  .xl\:ml-64 {
    margin-left: 64px;
  }
  .xl\:ml-80 {
    margin-left: 80px;
  }
  .xl\:ml-96 {
    margin-left: 96px;
  }
  .xl\:ml-120 {
    margin-left: 120px;
  }
  .xl\:ml-auto {
    margin-left: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:ml-0 {
    margin-left: 0;
  }
  .xxl\:ml-2 {
    margin-left: 2px;
  }
  .xxl\:ml-4 {
    margin-left: 4px;
  }
  .xxl\:ml-6 {
    margin-left: 6px;
  }
  .xxl\:ml-8 {
    margin-left: 8px;
  }
  .xxl\:ml-10 {
    margin-left: 10px;
  }
  .xxl\:ml-12 {
    margin-left: 12px;
  }
  .xxl\:ml-14 {
    margin-left: 14px;
  }
  .xxl\:ml-16 {
    margin-left: 16px;
  }
  .xxl\:ml-20 {
    margin-left: 20px;
  }
  .xxl\:ml-24 {
    margin-left: 24px;
  }
  .xxl\:ml-28 {
    margin-left: 28px;
  }
  .xxl\:ml-30 {
    margin-left: 30px;
  }
  .xxl\:ml-32 {
    margin-left: 32px;
  }
  .xxl\:ml-40 {
    margin-left: 40px;
  }
  .xxl\:ml-48 {
    margin-left: 48px;
  }
  .xxl\:ml-56 {
    margin-left: 56px;
  }
  .xxl\:ml-64 {
    margin-left: 64px;
  }
  .xxl\:ml-80 {
    margin-left: 80px;
  }
  .xxl\:ml-96 {
    margin-left: 96px;
  }
  .xxl\:ml-120 {
    margin-left: 120px;
  }
  .xxl\:ml-auto {
    margin-left: auto;
  }
}
.mx-0 {
  margin-left: 0;
  margin-right: 0;
}

.my-0 {
  margin-top: 0;
  margin-bottom: 0;
}

.mx-2 {
  margin-left: 2px;
  margin-right: 2px;
}

.my-2 {
  margin-top: 2px;
  margin-bottom: 2px;
}

.mx-4 {
  margin-left: 4px;
  margin-right: 4px;
}

.my-4 {
  margin-top: 4px;
  margin-bottom: 4px;
}

.mx-6 {
  margin-left: 6px;
  margin-right: 6px;
}

.my-6 {
  margin-top: 6px;
  margin-bottom: 6px;
}

.mx-8 {
  margin-left: 8px;
  margin-right: 8px;
}

.my-8 {
  margin-top: 8px;
  margin-bottom: 8px;
}

.mx-10 {
  margin-left: 10px;
  margin-right: 10px;
}

.my-10 {
  margin-top: 10px;
  margin-bottom: 10px;
}

.mx-12 {
  margin-left: 12px;
  margin-right: 12px;
}

.my-12 {
  margin-top: 12px;
  margin-bottom: 12px;
}

.mx-14 {
  margin-left: 14px;
  margin-right: 14px;
}

.my-14 {
  margin-top: 14px;
  margin-bottom: 14px;
}

.mx-16 {
  margin-left: 16px;
  margin-right: 16px;
}

.my-16 {
  margin-top: 16px;
  margin-bottom: 16px;
}

.mx-20 {
  margin-left: 20px;
  margin-right: 20px;
}

.my-20 {
  margin-top: 20px;
  margin-bottom: 20px;
}

.mx-24 {
  margin-left: 24px;
  margin-right: 24px;
}

.my-24 {
  margin-top: 24px;
  margin-bottom: 24px;
}

.mx-28 {
  margin-left: 28px;
  margin-right: 28px;
}

.my-28 {
  margin-top: 28px;
  margin-bottom: 28px;
}

.mx-30 {
  margin-left: 30px;
  margin-right: 30px;
}

.my-30 {
  margin-top: 30px;
  margin-bottom: 30px;
}

.mx-32 {
  margin-left: 32px;
  margin-right: 32px;
}

.my-32 {
  margin-top: 32px;
  margin-bottom: 32px;
}

.mx-40 {
  margin-left: 40px;
  margin-right: 40px;
}

.my-40 {
  margin-top: 40px;
  margin-bottom: 40px;
}

.mx-48 {
  margin-left: 48px;
  margin-right: 48px;
}

.my-48 {
  margin-top: 48px;
  margin-bottom: 48px;
}

.mx-56 {
  margin-left: 56px;
  margin-right: 56px;
}

.my-56 {
  margin-top: 56px;
  margin-bottom: 56px;
}

.mx-64 {
  margin-left: 64px;
  margin-right: 64px;
}

.my-64 {
  margin-top: 64px;
  margin-bottom: 64px;
}

.mx-80 {
  margin-left: 80px;
  margin-right: 80px;
}

.my-80 {
  margin-top: 80px;
  margin-bottom: 80px;
}

.mx-96 {
  margin-left: 96px;
  margin-right: 96px;
}

.my-96 {
  margin-top: 96px;
  margin-bottom: 96px;
}

.mx-120 {
  margin-left: 120px;
  margin-right: 120px;
}

.my-120 {
  margin-top: 120px;
  margin-bottom: 120px;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.my-auto {
  margin-top: auto;
  margin-bottom: auto;
}

@media (min-width: 576px) {
  .sm\:mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .sm\:my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .sm\:mx-2 {
    margin-left: 2px;
    margin-right: 2px;
  }
  .sm\:my-2 {
    margin-top: 2px;
    margin-bottom: 2px;
  }
  .sm\:mx-4 {
    margin-left: 4px;
    margin-right: 4px;
  }
  .sm\:my-4 {
    margin-top: 4px;
    margin-bottom: 4px;
  }
  .sm\:mx-6 {
    margin-left: 6px;
    margin-right: 6px;
  }
  .sm\:my-6 {
    margin-top: 6px;
    margin-bottom: 6px;
  }
  .sm\:mx-8 {
    margin-left: 8px;
    margin-right: 8px;
  }
  .sm\:my-8 {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .sm\:mx-10 {
    margin-left: 10px;
    margin-right: 10px;
  }
  .sm\:my-10 {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .sm\:mx-12 {
    margin-left: 12px;
    margin-right: 12px;
  }
  .sm\:my-12 {
    margin-top: 12px;
    margin-bottom: 12px;
  }
  .sm\:mx-14 {
    margin-left: 14px;
    margin-right: 14px;
  }
  .sm\:my-14 {
    margin-top: 14px;
    margin-bottom: 14px;
  }
  .sm\:mx-16 {
    margin-left: 16px;
    margin-right: 16px;
  }
  .sm\:my-16 {
    margin-top: 16px;
    margin-bottom: 16px;
  }
  .sm\:mx-20 {
    margin-left: 20px;
    margin-right: 20px;
  }
  .sm\:my-20 {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .sm\:mx-24 {
    margin-left: 24px;
    margin-right: 24px;
  }
  .sm\:my-24 {
    margin-top: 24px;
    margin-bottom: 24px;
  }
  .sm\:mx-28 {
    margin-left: 28px;
    margin-right: 28px;
  }
  .sm\:my-28 {
    margin-top: 28px;
    margin-bottom: 28px;
  }
  .sm\:mx-30 {
    margin-left: 30px;
    margin-right: 30px;
  }
  .sm\:my-30 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .sm\:mx-32 {
    margin-left: 32px;
    margin-right: 32px;
  }
  .sm\:my-32 {
    margin-top: 32px;
    margin-bottom: 32px;
  }
  .sm\:mx-40 {
    margin-left: 40px;
    margin-right: 40px;
  }
  .sm\:my-40 {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .sm\:mx-48 {
    margin-left: 48px;
    margin-right: 48px;
  }
  .sm\:my-48 {
    margin-top: 48px;
    margin-bottom: 48px;
  }
  .sm\:mx-56 {
    margin-left: 56px;
    margin-right: 56px;
  }
  .sm\:my-56 {
    margin-top: 56px;
    margin-bottom: 56px;
  }
  .sm\:mx-64 {
    margin-left: 64px;
    margin-right: 64px;
  }
  .sm\:my-64 {
    margin-top: 64px;
    margin-bottom: 64px;
  }
  .sm\:mx-80 {
    margin-left: 80px;
    margin-right: 80px;
  }
  .sm\:my-80 {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .sm\:mx-96 {
    margin-left: 96px;
    margin-right: 96px;
  }
  .sm\:my-96 {
    margin-top: 96px;
    margin-bottom: 96px;
  }
  .sm\:mx-120 {
    margin-left: 120px;
    margin-right: 120px;
  }
  .sm\:my-120 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .sm\:mx-auto {
    margin-left: auto;
    margin-right: auto;
  }
  .sm\:my-auto {
    margin-top: auto;
    margin-bottom: auto;
  }
}
@media (min-width: 768px) {
  .md\:mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .md\:my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .md\:mx-2 {
    margin-left: 2px;
    margin-right: 2px;
  }
  .md\:my-2 {
    margin-top: 2px;
    margin-bottom: 2px;
  }
  .md\:mx-4 {
    margin-left: 4px;
    margin-right: 4px;
  }
  .md\:my-4 {
    margin-top: 4px;
    margin-bottom: 4px;
  }
  .md\:mx-6 {
    margin-left: 6px;
    margin-right: 6px;
  }
  .md\:my-6 {
    margin-top: 6px;
    margin-bottom: 6px;
  }
  .md\:mx-8 {
    margin-left: 8px;
    margin-right: 8px;
  }
  .md\:my-8 {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .md\:mx-10 {
    margin-left: 10px;
    margin-right: 10px;
  }
  .md\:my-10 {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .md\:mx-12 {
    margin-left: 12px;
    margin-right: 12px;
  }
  .md\:my-12 {
    margin-top: 12px;
    margin-bottom: 12px;
  }
  .md\:mx-14 {
    margin-left: 14px;
    margin-right: 14px;
  }
  .md\:my-14 {
    margin-top: 14px;
    margin-bottom: 14px;
  }
  .md\:mx-16 {
    margin-left: 16px;
    margin-right: 16px;
  }
  .md\:my-16 {
    margin-top: 16px;
    margin-bottom: 16px;
  }
  .md\:mx-20 {
    margin-left: 20px;
    margin-right: 20px;
  }
  .md\:my-20 {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .md\:mx-24 {
    margin-left: 24px;
    margin-right: 24px;
  }
  .md\:my-24 {
    margin-top: 24px;
    margin-bottom: 24px;
  }
  .md\:mx-28 {
    margin-left: 28px;
    margin-right: 28px;
  }
  .md\:my-28 {
    margin-top: 28px;
    margin-bottom: 28px;
  }
  .md\:mx-30 {
    margin-left: 30px;
    margin-right: 30px;
  }
  .md\:my-30 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .md\:mx-32 {
    margin-left: 32px;
    margin-right: 32px;
  }
  .md\:my-32 {
    margin-top: 32px;
    margin-bottom: 32px;
  }
  .md\:mx-40 {
    margin-left: 40px;
    margin-right: 40px;
  }
  .md\:my-40 {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .md\:mx-48 {
    margin-left: 48px;
    margin-right: 48px;
  }
  .md\:my-48 {
    margin-top: 48px;
    margin-bottom: 48px;
  }
  .md\:mx-56 {
    margin-left: 56px;
    margin-right: 56px;
  }
  .md\:my-56 {
    margin-top: 56px;
    margin-bottom: 56px;
  }
  .md\:mx-64 {
    margin-left: 64px;
    margin-right: 64px;
  }
  .md\:my-64 {
    margin-top: 64px;
    margin-bottom: 64px;
  }
  .md\:mx-80 {
    margin-left: 80px;
    margin-right: 80px;
  }
  .md\:my-80 {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .md\:mx-96 {
    margin-left: 96px;
    margin-right: 96px;
  }
  .md\:my-96 {
    margin-top: 96px;
    margin-bottom: 96px;
  }
  .md\:mx-120 {
    margin-left: 120px;
    margin-right: 120px;
  }
  .md\:my-120 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .md\:mx-auto {
    margin-left: auto;
    margin-right: auto;
  }
  .md\:my-auto {
    margin-top: auto;
    margin-bottom: auto;
  }
}
@media (min-width: 992px) {
  .lg\:mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .lg\:my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .lg\:mx-2 {
    margin-left: 2px;
    margin-right: 2px;
  }
  .lg\:my-2 {
    margin-top: 2px;
    margin-bottom: 2px;
  }
  .lg\:mx-4 {
    margin-left: 4px;
    margin-right: 4px;
  }
  .lg\:my-4 {
    margin-top: 4px;
    margin-bottom: 4px;
  }
  .lg\:mx-6 {
    margin-left: 6px;
    margin-right: 6px;
  }
  .lg\:my-6 {
    margin-top: 6px;
    margin-bottom: 6px;
  }
  .lg\:mx-8 {
    margin-left: 8px;
    margin-right: 8px;
  }
  .lg\:my-8 {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .lg\:mx-10 {
    margin-left: 10px;
    margin-right: 10px;
  }
  .lg\:my-10 {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .lg\:mx-12 {
    margin-left: 12px;
    margin-right: 12px;
  }
  .lg\:my-12 {
    margin-top: 12px;
    margin-bottom: 12px;
  }
  .lg\:mx-14 {
    margin-left: 14px;
    margin-right: 14px;
  }
  .lg\:my-14 {
    margin-top: 14px;
    margin-bottom: 14px;
  }
  .lg\:mx-16 {
    margin-left: 16px;
    margin-right: 16px;
  }
  .lg\:my-16 {
    margin-top: 16px;
    margin-bottom: 16px;
  }
  .lg\:mx-20 {
    margin-left: 20px;
    margin-right: 20px;
  }
  .lg\:my-20 {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .lg\:mx-24 {
    margin-left: 24px;
    margin-right: 24px;
  }
  .lg\:my-24 {
    margin-top: 24px;
    margin-bottom: 24px;
  }
  .lg\:mx-28 {
    margin-left: 28px;
    margin-right: 28px;
  }
  .lg\:my-28 {
    margin-top: 28px;
    margin-bottom: 28px;
  }
  .lg\:mx-30 {
    margin-left: 30px;
    margin-right: 30px;
  }
  .lg\:my-30 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .lg\:mx-32 {
    margin-left: 32px;
    margin-right: 32px;
  }
  .lg\:my-32 {
    margin-top: 32px;
    margin-bottom: 32px;
  }
  .lg\:mx-40 {
    margin-left: 40px;
    margin-right: 40px;
  }
  .lg\:my-40 {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .lg\:mx-48 {
    margin-left: 48px;
    margin-right: 48px;
  }
  .lg\:my-48 {
    margin-top: 48px;
    margin-bottom: 48px;
  }
  .lg\:mx-56 {
    margin-left: 56px;
    margin-right: 56px;
  }
  .lg\:my-56 {
    margin-top: 56px;
    margin-bottom: 56px;
  }
  .lg\:mx-64 {
    margin-left: 64px;
    margin-right: 64px;
  }
  .lg\:my-64 {
    margin-top: 64px;
    margin-bottom: 64px;
  }
  .lg\:mx-80 {
    margin-left: 80px;
    margin-right: 80px;
  }
  .lg\:my-80 {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .lg\:mx-96 {
    margin-left: 96px;
    margin-right: 96px;
  }
  .lg\:my-96 {
    margin-top: 96px;
    margin-bottom: 96px;
  }
  .lg\:mx-120 {
    margin-left: 120px;
    margin-right: 120px;
  }
  .lg\:my-120 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .lg\:mx-auto {
    margin-left: auto;
    margin-right: auto;
  }
  .lg\:my-auto {
    margin-top: auto;
    margin-bottom: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .xl\:my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .xl\:mx-2 {
    margin-left: 2px;
    margin-right: 2px;
  }
  .xl\:my-2 {
    margin-top: 2px;
    margin-bottom: 2px;
  }
  .xl\:mx-4 {
    margin-left: 4px;
    margin-right: 4px;
  }
  .xl\:my-4 {
    margin-top: 4px;
    margin-bottom: 4px;
  }
  .xl\:mx-6 {
    margin-left: 6px;
    margin-right: 6px;
  }
  .xl\:my-6 {
    margin-top: 6px;
    margin-bottom: 6px;
  }
  .xl\:mx-8 {
    margin-left: 8px;
    margin-right: 8px;
  }
  .xl\:my-8 {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .xl\:mx-10 {
    margin-left: 10px;
    margin-right: 10px;
  }
  .xl\:my-10 {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .xl\:mx-12 {
    margin-left: 12px;
    margin-right: 12px;
  }
  .xl\:my-12 {
    margin-top: 12px;
    margin-bottom: 12px;
  }
  .xl\:mx-14 {
    margin-left: 14px;
    margin-right: 14px;
  }
  .xl\:my-14 {
    margin-top: 14px;
    margin-bottom: 14px;
  }
  .xl\:mx-16 {
    margin-left: 16px;
    margin-right: 16px;
  }
  .xl\:my-16 {
    margin-top: 16px;
    margin-bottom: 16px;
  }
  .xl\:mx-20 {
    margin-left: 20px;
    margin-right: 20px;
  }
  .xl\:my-20 {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .xl\:mx-24 {
    margin-left: 24px;
    margin-right: 24px;
  }
  .xl\:my-24 {
    margin-top: 24px;
    margin-bottom: 24px;
  }
  .xl\:mx-28 {
    margin-left: 28px;
    margin-right: 28px;
  }
  .xl\:my-28 {
    margin-top: 28px;
    margin-bottom: 28px;
  }
  .xl\:mx-30 {
    margin-left: 30px;
    margin-right: 30px;
  }
  .xl\:my-30 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .xl\:mx-32 {
    margin-left: 32px;
    margin-right: 32px;
  }
  .xl\:my-32 {
    margin-top: 32px;
    margin-bottom: 32px;
  }
  .xl\:mx-40 {
    margin-left: 40px;
    margin-right: 40px;
  }
  .xl\:my-40 {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .xl\:mx-48 {
    margin-left: 48px;
    margin-right: 48px;
  }
  .xl\:my-48 {
    margin-top: 48px;
    margin-bottom: 48px;
  }
  .xl\:mx-56 {
    margin-left: 56px;
    margin-right: 56px;
  }
  .xl\:my-56 {
    margin-top: 56px;
    margin-bottom: 56px;
  }
  .xl\:mx-64 {
    margin-left: 64px;
    margin-right: 64px;
  }
  .xl\:my-64 {
    margin-top: 64px;
    margin-bottom: 64px;
  }
  .xl\:mx-80 {
    margin-left: 80px;
    margin-right: 80px;
  }
  .xl\:my-80 {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .xl\:mx-96 {
    margin-left: 96px;
    margin-right: 96px;
  }
  .xl\:my-96 {
    margin-top: 96px;
    margin-bottom: 96px;
  }
  .xl\:mx-120 {
    margin-left: 120px;
    margin-right: 120px;
  }
  .xl\:my-120 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .xl\:mx-auto {
    margin-left: auto;
    margin-right: auto;
  }
  .xl\:my-auto {
    margin-top: auto;
    margin-bottom: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:mx-0 {
    margin-left: 0;
    margin-right: 0;
  }
  .xxl\:my-0 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .xxl\:mx-2 {
    margin-left: 2px;
    margin-right: 2px;
  }
  .xxl\:my-2 {
    margin-top: 2px;
    margin-bottom: 2px;
  }
  .xxl\:mx-4 {
    margin-left: 4px;
    margin-right: 4px;
  }
  .xxl\:my-4 {
    margin-top: 4px;
    margin-bottom: 4px;
  }
  .xxl\:mx-6 {
    margin-left: 6px;
    margin-right: 6px;
  }
  .xxl\:my-6 {
    margin-top: 6px;
    margin-bottom: 6px;
  }
  .xxl\:mx-8 {
    margin-left: 8px;
    margin-right: 8px;
  }
  .xxl\:my-8 {
    margin-top: 8px;
    margin-bottom: 8px;
  }
  .xxl\:mx-10 {
    margin-left: 10px;
    margin-right: 10px;
  }
  .xxl\:my-10 {
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .xxl\:mx-12 {
    margin-left: 12px;
    margin-right: 12px;
  }
  .xxl\:my-12 {
    margin-top: 12px;
    margin-bottom: 12px;
  }
  .xxl\:mx-14 {
    margin-left: 14px;
    margin-right: 14px;
  }
  .xxl\:my-14 {
    margin-top: 14px;
    margin-bottom: 14px;
  }
  .xxl\:mx-16 {
    margin-left: 16px;
    margin-right: 16px;
  }
  .xxl\:my-16 {
    margin-top: 16px;
    margin-bottom: 16px;
  }
  .xxl\:mx-20 {
    margin-left: 20px;
    margin-right: 20px;
  }
  .xxl\:my-20 {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .xxl\:mx-24 {
    margin-left: 24px;
    margin-right: 24px;
  }
  .xxl\:my-24 {
    margin-top: 24px;
    margin-bottom: 24px;
  }
  .xxl\:mx-28 {
    margin-left: 28px;
    margin-right: 28px;
  }
  .xxl\:my-28 {
    margin-top: 28px;
    margin-bottom: 28px;
  }
  .xxl\:mx-30 {
    margin-left: 30px;
    margin-right: 30px;
  }
  .xxl\:my-30 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .xxl\:mx-32 {
    margin-left: 32px;
    margin-right: 32px;
  }
  .xxl\:my-32 {
    margin-top: 32px;
    margin-bottom: 32px;
  }
  .xxl\:mx-40 {
    margin-left: 40px;
    margin-right: 40px;
  }
  .xxl\:my-40 {
    margin-top: 40px;
    margin-bottom: 40px;
  }
  .xxl\:mx-48 {
    margin-left: 48px;
    margin-right: 48px;
  }
  .xxl\:my-48 {
    margin-top: 48px;
    margin-bottom: 48px;
  }
  .xxl\:mx-56 {
    margin-left: 56px;
    margin-right: 56px;
  }
  .xxl\:my-56 {
    margin-top: 56px;
    margin-bottom: 56px;
  }
  .xxl\:mx-64 {
    margin-left: 64px;
    margin-right: 64px;
  }
  .xxl\:my-64 {
    margin-top: 64px;
    margin-bottom: 64px;
  }
  .xxl\:mx-80 {
    margin-left: 80px;
    margin-right: 80px;
  }
  .xxl\:my-80 {
    margin-top: 80px;
    margin-bottom: 80px;
  }
  .xxl\:mx-96 {
    margin-left: 96px;
    margin-right: 96px;
  }
  .xxl\:my-96 {
    margin-top: 96px;
    margin-bottom: 96px;
  }
  .xxl\:mx-120 {
    margin-left: 120px;
    margin-right: 120px;
  }
  .xxl\:my-120 {
    margin-top: 120px;
    margin-bottom: 120px;
  }
  .xxl\:mx-auto {
    margin-left: auto;
    margin-right: auto;
  }
  .xxl\:my-auto {
    margin-top: auto;
    margin-bottom: auto;
  }
}
.gap-0 {
  gap: 0;
}

.gap-2 {
  gap: 2px;
}

.gap-4 {
  gap: 4px;
}

.gap-6 {
  gap: 6px;
}

.gap-8 {
  gap: 8px;
}

.gap-10 {
  gap: 10px;
}

.gap-12 {
  gap: 12px;
}

.gap-14 {
  gap: 14px;
}

.gap-16 {
  gap: 16px;
}

.gap-20 {
  gap: 20px;
}

.gap-24 {
  gap: 24px;
}

.gap-28 {
  gap: 28px;
}

.gap-30 {
  gap: 30px;
}

.gap-32 {
  gap: 32px;
}

.gap-40 {
  gap: 40px;
}

.gap-48 {
  gap: 48px;
}

.gap-56 {
  gap: 56px;
}

.gap-64 {
  gap: 64px;
}

.gap-80 {
  gap: 80px;
}

.gap-96 {
  gap: 96px;
}

.gap-120 {
  gap: 120px;
}

.gap-auto {
  gap: auto;
}

@media (min-width: 576px) {
  .sm\:gap-0 {
    gap: 0;
  }
  .sm\:gap-2 {
    gap: 2px;
  }
  .sm\:gap-4 {
    gap: 4px;
  }
  .sm\:gap-6 {
    gap: 6px;
  }
  .sm\:gap-8 {
    gap: 8px;
  }
  .sm\:gap-10 {
    gap: 10px;
  }
  .sm\:gap-12 {
    gap: 12px;
  }
  .sm\:gap-14 {
    gap: 14px;
  }
  .sm\:gap-16 {
    gap: 16px;
  }
  .sm\:gap-20 {
    gap: 20px;
  }
  .sm\:gap-24 {
    gap: 24px;
  }
  .sm\:gap-28 {
    gap: 28px;
  }
  .sm\:gap-30 {
    gap: 30px;
  }
  .sm\:gap-32 {
    gap: 32px;
  }
  .sm\:gap-40 {
    gap: 40px;
  }
  .sm\:gap-48 {
    gap: 48px;
  }
  .sm\:gap-56 {
    gap: 56px;
  }
  .sm\:gap-64 {
    gap: 64px;
  }
  .sm\:gap-80 {
    gap: 80px;
  }
  .sm\:gap-96 {
    gap: 96px;
  }
  .sm\:gap-120 {
    gap: 120px;
  }
  .sm\:gap-auto {
    gap: auto;
  }
}
@media (min-width: 768px) {
  .md\:gap-0 {
    gap: 0;
  }
  .md\:gap-2 {
    gap: 2px;
  }
  .md\:gap-4 {
    gap: 4px;
  }
  .md\:gap-6 {
    gap: 6px;
  }
  .md\:gap-8 {
    gap: 8px;
  }
  .md\:gap-10 {
    gap: 10px;
  }
  .md\:gap-12 {
    gap: 12px;
  }
  .md\:gap-14 {
    gap: 14px;
  }
  .md\:gap-16 {
    gap: 16px;
  }
  .md\:gap-20 {
    gap: 20px;
  }
  .md\:gap-24 {
    gap: 24px;
  }
  .md\:gap-28 {
    gap: 28px;
  }
  .md\:gap-30 {
    gap: 30px;
  }
  .md\:gap-32 {
    gap: 32px;
  }
  .md\:gap-40 {
    gap: 40px;
  }
  .md\:gap-48 {
    gap: 48px;
  }
  .md\:gap-56 {
    gap: 56px;
  }
  .md\:gap-64 {
    gap: 64px;
  }
  .md\:gap-80 {
    gap: 80px;
  }
  .md\:gap-96 {
    gap: 96px;
  }
  .md\:gap-120 {
    gap: 120px;
  }
  .md\:gap-auto {
    gap: auto;
  }
}
@media (min-width: 992px) {
  .lg\:gap-0 {
    gap: 0;
  }
  .lg\:gap-2 {
    gap: 2px;
  }
  .lg\:gap-4 {
    gap: 4px;
  }
  .lg\:gap-6 {
    gap: 6px;
  }
  .lg\:gap-8 {
    gap: 8px;
  }
  .lg\:gap-10 {
    gap: 10px;
  }
  .lg\:gap-12 {
    gap: 12px;
  }
  .lg\:gap-14 {
    gap: 14px;
  }
  .lg\:gap-16 {
    gap: 16px;
  }
  .lg\:gap-20 {
    gap: 20px;
  }
  .lg\:gap-24 {
    gap: 24px;
  }
  .lg\:gap-28 {
    gap: 28px;
  }
  .lg\:gap-30 {
    gap: 30px;
  }
  .lg\:gap-32 {
    gap: 32px;
  }
  .lg\:gap-40 {
    gap: 40px;
  }
  .lg\:gap-48 {
    gap: 48px;
  }
  .lg\:gap-56 {
    gap: 56px;
  }
  .lg\:gap-64 {
    gap: 64px;
  }
  .lg\:gap-80 {
    gap: 80px;
  }
  .lg\:gap-96 {
    gap: 96px;
  }
  .lg\:gap-120 {
    gap: 120px;
  }
  .lg\:gap-auto {
    gap: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:gap-0 {
    gap: 0;
  }
  .xl\:gap-2 {
    gap: 2px;
  }
  .xl\:gap-4 {
    gap: 4px;
  }
  .xl\:gap-6 {
    gap: 6px;
  }
  .xl\:gap-8 {
    gap: 8px;
  }
  .xl\:gap-10 {
    gap: 10px;
  }
  .xl\:gap-12 {
    gap: 12px;
  }
  .xl\:gap-14 {
    gap: 14px;
  }
  .xl\:gap-16 {
    gap: 16px;
  }
  .xl\:gap-20 {
    gap: 20px;
  }
  .xl\:gap-24 {
    gap: 24px;
  }
  .xl\:gap-28 {
    gap: 28px;
  }
  .xl\:gap-30 {
    gap: 30px;
  }
  .xl\:gap-32 {
    gap: 32px;
  }
  .xl\:gap-40 {
    gap: 40px;
  }
  .xl\:gap-48 {
    gap: 48px;
  }
  .xl\:gap-56 {
    gap: 56px;
  }
  .xl\:gap-64 {
    gap: 64px;
  }
  .xl\:gap-80 {
    gap: 80px;
  }
  .xl\:gap-96 {
    gap: 96px;
  }
  .xl\:gap-120 {
    gap: 120px;
  }
  .xl\:gap-auto {
    gap: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:gap-0 {
    gap: 0;
  }
  .xxl\:gap-2 {
    gap: 2px;
  }
  .xxl\:gap-4 {
    gap: 4px;
  }
  .xxl\:gap-6 {
    gap: 6px;
  }
  .xxl\:gap-8 {
    gap: 8px;
  }
  .xxl\:gap-10 {
    gap: 10px;
  }
  .xxl\:gap-12 {
    gap: 12px;
  }
  .xxl\:gap-14 {
    gap: 14px;
  }
  .xxl\:gap-16 {
    gap: 16px;
  }
  .xxl\:gap-20 {
    gap: 20px;
  }
  .xxl\:gap-24 {
    gap: 24px;
  }
  .xxl\:gap-28 {
    gap: 28px;
  }
  .xxl\:gap-30 {
    gap: 30px;
  }
  .xxl\:gap-32 {
    gap: 32px;
  }
  .xxl\:gap-40 {
    gap: 40px;
  }
  .xxl\:gap-48 {
    gap: 48px;
  }
  .xxl\:gap-56 {
    gap: 56px;
  }
  .xxl\:gap-64 {
    gap: 64px;
  }
  .xxl\:gap-80 {
    gap: 80px;
  }
  .xxl\:gap-96 {
    gap: 96px;
  }
  .xxl\:gap-120 {
    gap: 120px;
  }
  .xxl\:gap-auto {
    gap: auto;
  }
}
.gap-x-0 {
  column-gap: 0;
}

.gap-x-2 {
  column-gap: 2px;
}

.gap-x-4 {
  column-gap: 4px;
}

.gap-x-6 {
  column-gap: 6px;
}

.gap-x-8 {
  column-gap: 8px;
}

.gap-x-10 {
  column-gap: 10px;
}

.gap-x-12 {
  column-gap: 12px;
}

.gap-x-14 {
  column-gap: 14px;
}

.gap-x-16 {
  column-gap: 16px;
}

.gap-x-20 {
  column-gap: 20px;
}

.gap-x-24 {
  column-gap: 24px;
}

.gap-x-28 {
  column-gap: 28px;
}

.gap-x-30 {
  column-gap: 30px;
}

.gap-x-32 {
  column-gap: 32px;
}

.gap-x-40 {
  column-gap: 40px;
}

.gap-x-48 {
  column-gap: 48px;
}

.gap-x-56 {
  column-gap: 56px;
}

.gap-x-64 {
  column-gap: 64px;
}

.gap-x-80 {
  column-gap: 80px;
}

.gap-x-96 {
  column-gap: 96px;
}

.gap-x-120 {
  column-gap: 120px;
}

.gap-x-auto {
  column-gap: auto;
}

@media (min-width: 576px) {
  .sm\:gap-x-0 {
    column-gap: 0;
  }
  .sm\:gap-x-2 {
    column-gap: 2px;
  }
  .sm\:gap-x-4 {
    column-gap: 4px;
  }
  .sm\:gap-x-6 {
    column-gap: 6px;
  }
  .sm\:gap-x-8 {
    column-gap: 8px;
  }
  .sm\:gap-x-10 {
    column-gap: 10px;
  }
  .sm\:gap-x-12 {
    column-gap: 12px;
  }
  .sm\:gap-x-14 {
    column-gap: 14px;
  }
  .sm\:gap-x-16 {
    column-gap: 16px;
  }
  .sm\:gap-x-20 {
    column-gap: 20px;
  }
  .sm\:gap-x-24 {
    column-gap: 24px;
  }
  .sm\:gap-x-28 {
    column-gap: 28px;
  }
  .sm\:gap-x-30 {
    column-gap: 30px;
  }
  .sm\:gap-x-32 {
    column-gap: 32px;
  }
  .sm\:gap-x-40 {
    column-gap: 40px;
  }
  .sm\:gap-x-48 {
    column-gap: 48px;
  }
  .sm\:gap-x-56 {
    column-gap: 56px;
  }
  .sm\:gap-x-64 {
    column-gap: 64px;
  }
  .sm\:gap-x-80 {
    column-gap: 80px;
  }
  .sm\:gap-x-96 {
    column-gap: 96px;
  }
  .sm\:gap-x-120 {
    column-gap: 120px;
  }
  .sm\:gap-x-auto {
    column-gap: auto;
  }
}
@media (min-width: 768px) {
  .md\:gap-x-0 {
    column-gap: 0;
  }
  .md\:gap-x-2 {
    column-gap: 2px;
  }
  .md\:gap-x-4 {
    column-gap: 4px;
  }
  .md\:gap-x-6 {
    column-gap: 6px;
  }
  .md\:gap-x-8 {
    column-gap: 8px;
  }
  .md\:gap-x-10 {
    column-gap: 10px;
  }
  .md\:gap-x-12 {
    column-gap: 12px;
  }
  .md\:gap-x-14 {
    column-gap: 14px;
  }
  .md\:gap-x-16 {
    column-gap: 16px;
  }
  .md\:gap-x-20 {
    column-gap: 20px;
  }
  .md\:gap-x-24 {
    column-gap: 24px;
  }
  .md\:gap-x-28 {
    column-gap: 28px;
  }
  .md\:gap-x-30 {
    column-gap: 30px;
  }
  .md\:gap-x-32 {
    column-gap: 32px;
  }
  .md\:gap-x-40 {
    column-gap: 40px;
  }
  .md\:gap-x-48 {
    column-gap: 48px;
  }
  .md\:gap-x-56 {
    column-gap: 56px;
  }
  .md\:gap-x-64 {
    column-gap: 64px;
  }
  .md\:gap-x-80 {
    column-gap: 80px;
  }
  .md\:gap-x-96 {
    column-gap: 96px;
  }
  .md\:gap-x-120 {
    column-gap: 120px;
  }
  .md\:gap-x-auto {
    column-gap: auto;
  }
}
@media (min-width: 992px) {
  .lg\:gap-x-0 {
    column-gap: 0;
  }
  .lg\:gap-x-2 {
    column-gap: 2px;
  }
  .lg\:gap-x-4 {
    column-gap: 4px;
  }
  .lg\:gap-x-6 {
    column-gap: 6px;
  }
  .lg\:gap-x-8 {
    column-gap: 8px;
  }
  .lg\:gap-x-10 {
    column-gap: 10px;
  }
  .lg\:gap-x-12 {
    column-gap: 12px;
  }
  .lg\:gap-x-14 {
    column-gap: 14px;
  }
  .lg\:gap-x-16 {
    column-gap: 16px;
  }
  .lg\:gap-x-20 {
    column-gap: 20px;
  }
  .lg\:gap-x-24 {
    column-gap: 24px;
  }
  .lg\:gap-x-28 {
    column-gap: 28px;
  }
  .lg\:gap-x-30 {
    column-gap: 30px;
  }
  .lg\:gap-x-32 {
    column-gap: 32px;
  }
  .lg\:gap-x-40 {
    column-gap: 40px;
  }
  .lg\:gap-x-48 {
    column-gap: 48px;
  }
  .lg\:gap-x-56 {
    column-gap: 56px;
  }
  .lg\:gap-x-64 {
    column-gap: 64px;
  }
  .lg\:gap-x-80 {
    column-gap: 80px;
  }
  .lg\:gap-x-96 {
    column-gap: 96px;
  }
  .lg\:gap-x-120 {
    column-gap: 120px;
  }
  .lg\:gap-x-auto {
    column-gap: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:gap-x-0 {
    column-gap: 0;
  }
  .xl\:gap-x-2 {
    column-gap: 2px;
  }
  .xl\:gap-x-4 {
    column-gap: 4px;
  }
  .xl\:gap-x-6 {
    column-gap: 6px;
  }
  .xl\:gap-x-8 {
    column-gap: 8px;
  }
  .xl\:gap-x-10 {
    column-gap: 10px;
  }
  .xl\:gap-x-12 {
    column-gap: 12px;
  }
  .xl\:gap-x-14 {
    column-gap: 14px;
  }
  .xl\:gap-x-16 {
    column-gap: 16px;
  }
  .xl\:gap-x-20 {
    column-gap: 20px;
  }
  .xl\:gap-x-24 {
    column-gap: 24px;
  }
  .xl\:gap-x-28 {
    column-gap: 28px;
  }
  .xl\:gap-x-30 {
    column-gap: 30px;
  }
  .xl\:gap-x-32 {
    column-gap: 32px;
  }
  .xl\:gap-x-40 {
    column-gap: 40px;
  }
  .xl\:gap-x-48 {
    column-gap: 48px;
  }
  .xl\:gap-x-56 {
    column-gap: 56px;
  }
  .xl\:gap-x-64 {
    column-gap: 64px;
  }
  .xl\:gap-x-80 {
    column-gap: 80px;
  }
  .xl\:gap-x-96 {
    column-gap: 96px;
  }
  .xl\:gap-x-120 {
    column-gap: 120px;
  }
  .xl\:gap-x-auto {
    column-gap: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:gap-x-0 {
    column-gap: 0;
  }
  .xxl\:gap-x-2 {
    column-gap: 2px;
  }
  .xxl\:gap-x-4 {
    column-gap: 4px;
  }
  .xxl\:gap-x-6 {
    column-gap: 6px;
  }
  .xxl\:gap-x-8 {
    column-gap: 8px;
  }
  .xxl\:gap-x-10 {
    column-gap: 10px;
  }
  .xxl\:gap-x-12 {
    column-gap: 12px;
  }
  .xxl\:gap-x-14 {
    column-gap: 14px;
  }
  .xxl\:gap-x-16 {
    column-gap: 16px;
  }
  .xxl\:gap-x-20 {
    column-gap: 20px;
  }
  .xxl\:gap-x-24 {
    column-gap: 24px;
  }
  .xxl\:gap-x-28 {
    column-gap: 28px;
  }
  .xxl\:gap-x-30 {
    column-gap: 30px;
  }
  .xxl\:gap-x-32 {
    column-gap: 32px;
  }
  .xxl\:gap-x-40 {
    column-gap: 40px;
  }
  .xxl\:gap-x-48 {
    column-gap: 48px;
  }
  .xxl\:gap-x-56 {
    column-gap: 56px;
  }
  .xxl\:gap-x-64 {
    column-gap: 64px;
  }
  .xxl\:gap-x-80 {
    column-gap: 80px;
  }
  .xxl\:gap-x-96 {
    column-gap: 96px;
  }
  .xxl\:gap-x-120 {
    column-gap: 120px;
  }
  .xxl\:gap-x-auto {
    column-gap: auto;
  }
}
.gap-y-0 {
  row-gap: 0;
}

.gap-y-2 {
  row-gap: 2px;
}

.gap-y-4 {
  row-gap: 4px;
}

.gap-y-6 {
  row-gap: 6px;
}

.gap-y-8 {
  row-gap: 8px;
}

.gap-y-10 {
  row-gap: 10px;
}

.gap-y-12 {
  row-gap: 12px;
}

.gap-y-14 {
  row-gap: 14px;
}

.gap-y-16 {
  row-gap: 16px;
}

.gap-y-20 {
  row-gap: 20px;
}

.gap-y-24 {
  row-gap: 24px;
}

.gap-y-28 {
  row-gap: 28px;
}

.gap-y-30 {
  row-gap: 30px;
}

.gap-y-32 {
  row-gap: 32px;
}

.gap-y-40 {
  row-gap: 40px;
}

.gap-y-48 {
  row-gap: 48px;
}

.gap-y-56 {
  row-gap: 56px;
}

.gap-y-64 {
  row-gap: 64px;
}

.gap-y-80 {
  row-gap: 80px;
}

.gap-y-96 {
  row-gap: 96px;
}

.gap-y-120 {
  row-gap: 120px;
}

.gap-y-auto {
  row-gap: auto;
}

@media (min-width: 576px) {
  .sm\:gap-y-0 {
    row-gap: 0;
  }
  .sm\:gap-y-2 {
    row-gap: 2px;
  }
  .sm\:gap-y-4 {
    row-gap: 4px;
  }
  .sm\:gap-y-6 {
    row-gap: 6px;
  }
  .sm\:gap-y-8 {
    row-gap: 8px;
  }
  .sm\:gap-y-10 {
    row-gap: 10px;
  }
  .sm\:gap-y-12 {
    row-gap: 12px;
  }
  .sm\:gap-y-14 {
    row-gap: 14px;
  }
  .sm\:gap-y-16 {
    row-gap: 16px;
  }
  .sm\:gap-y-20 {
    row-gap: 20px;
  }
  .sm\:gap-y-24 {
    row-gap: 24px;
  }
  .sm\:gap-y-28 {
    row-gap: 28px;
  }
  .sm\:gap-y-30 {
    row-gap: 30px;
  }
  .sm\:gap-y-32 {
    row-gap: 32px;
  }
  .sm\:gap-y-40 {
    row-gap: 40px;
  }
  .sm\:gap-y-48 {
    row-gap: 48px;
  }
  .sm\:gap-y-56 {
    row-gap: 56px;
  }
  .sm\:gap-y-64 {
    row-gap: 64px;
  }
  .sm\:gap-y-80 {
    row-gap: 80px;
  }
  .sm\:gap-y-96 {
    row-gap: 96px;
  }
  .sm\:gap-y-120 {
    row-gap: 120px;
  }
  .sm\:gap-y-auto {
    row-gap: auto;
  }
}
@media (min-width: 768px) {
  .md\:gap-y-0 {
    row-gap: 0;
  }
  .md\:gap-y-2 {
    row-gap: 2px;
  }
  .md\:gap-y-4 {
    row-gap: 4px;
  }
  .md\:gap-y-6 {
    row-gap: 6px;
  }
  .md\:gap-y-8 {
    row-gap: 8px;
  }
  .md\:gap-y-10 {
    row-gap: 10px;
  }
  .md\:gap-y-12 {
    row-gap: 12px;
  }
  .md\:gap-y-14 {
    row-gap: 14px;
  }
  .md\:gap-y-16 {
    row-gap: 16px;
  }
  .md\:gap-y-20 {
    row-gap: 20px;
  }
  .md\:gap-y-24 {
    row-gap: 24px;
  }
  .md\:gap-y-28 {
    row-gap: 28px;
  }
  .md\:gap-y-30 {
    row-gap: 30px;
  }
  .md\:gap-y-32 {
    row-gap: 32px;
  }
  .md\:gap-y-40 {
    row-gap: 40px;
  }
  .md\:gap-y-48 {
    row-gap: 48px;
  }
  .md\:gap-y-56 {
    row-gap: 56px;
  }
  .md\:gap-y-64 {
    row-gap: 64px;
  }
  .md\:gap-y-80 {
    row-gap: 80px;
  }
  .md\:gap-y-96 {
    row-gap: 96px;
  }
  .md\:gap-y-120 {
    row-gap: 120px;
  }
  .md\:gap-y-auto {
    row-gap: auto;
  }
}
@media (min-width: 992px) {
  .lg\:gap-y-0 {
    row-gap: 0;
  }
  .lg\:gap-y-2 {
    row-gap: 2px;
  }
  .lg\:gap-y-4 {
    row-gap: 4px;
  }
  .lg\:gap-y-6 {
    row-gap: 6px;
  }
  .lg\:gap-y-8 {
    row-gap: 8px;
  }
  .lg\:gap-y-10 {
    row-gap: 10px;
  }
  .lg\:gap-y-12 {
    row-gap: 12px;
  }
  .lg\:gap-y-14 {
    row-gap: 14px;
  }
  .lg\:gap-y-16 {
    row-gap: 16px;
  }
  .lg\:gap-y-20 {
    row-gap: 20px;
  }
  .lg\:gap-y-24 {
    row-gap: 24px;
  }
  .lg\:gap-y-28 {
    row-gap: 28px;
  }
  .lg\:gap-y-30 {
    row-gap: 30px;
  }
  .lg\:gap-y-32 {
    row-gap: 32px;
  }
  .lg\:gap-y-40 {
    row-gap: 40px;
  }
  .lg\:gap-y-48 {
    row-gap: 48px;
  }
  .lg\:gap-y-56 {
    row-gap: 56px;
  }
  .lg\:gap-y-64 {
    row-gap: 64px;
  }
  .lg\:gap-y-80 {
    row-gap: 80px;
  }
  .lg\:gap-y-96 {
    row-gap: 96px;
  }
  .lg\:gap-y-120 {
    row-gap: 120px;
  }
  .lg\:gap-y-auto {
    row-gap: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:gap-y-0 {
    row-gap: 0;
  }
  .xl\:gap-y-2 {
    row-gap: 2px;
  }
  .xl\:gap-y-4 {
    row-gap: 4px;
  }
  .xl\:gap-y-6 {
    row-gap: 6px;
  }
  .xl\:gap-y-8 {
    row-gap: 8px;
  }
  .xl\:gap-y-10 {
    row-gap: 10px;
  }
  .xl\:gap-y-12 {
    row-gap: 12px;
  }
  .xl\:gap-y-14 {
    row-gap: 14px;
  }
  .xl\:gap-y-16 {
    row-gap: 16px;
  }
  .xl\:gap-y-20 {
    row-gap: 20px;
  }
  .xl\:gap-y-24 {
    row-gap: 24px;
  }
  .xl\:gap-y-28 {
    row-gap: 28px;
  }
  .xl\:gap-y-30 {
    row-gap: 30px;
  }
  .xl\:gap-y-32 {
    row-gap: 32px;
  }
  .xl\:gap-y-40 {
    row-gap: 40px;
  }
  .xl\:gap-y-48 {
    row-gap: 48px;
  }
  .xl\:gap-y-56 {
    row-gap: 56px;
  }
  .xl\:gap-y-64 {
    row-gap: 64px;
  }
  .xl\:gap-y-80 {
    row-gap: 80px;
  }
  .xl\:gap-y-96 {
    row-gap: 96px;
  }
  .xl\:gap-y-120 {
    row-gap: 120px;
  }
  .xl\:gap-y-auto {
    row-gap: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:gap-y-0 {
    row-gap: 0;
  }
  .xxl\:gap-y-2 {
    row-gap: 2px;
  }
  .xxl\:gap-y-4 {
    row-gap: 4px;
  }
  .xxl\:gap-y-6 {
    row-gap: 6px;
  }
  .xxl\:gap-y-8 {
    row-gap: 8px;
  }
  .xxl\:gap-y-10 {
    row-gap: 10px;
  }
  .xxl\:gap-y-12 {
    row-gap: 12px;
  }
  .xxl\:gap-y-14 {
    row-gap: 14px;
  }
  .xxl\:gap-y-16 {
    row-gap: 16px;
  }
  .xxl\:gap-y-20 {
    row-gap: 20px;
  }
  .xxl\:gap-y-24 {
    row-gap: 24px;
  }
  .xxl\:gap-y-28 {
    row-gap: 28px;
  }
  .xxl\:gap-y-30 {
    row-gap: 30px;
  }
  .xxl\:gap-y-32 {
    row-gap: 32px;
  }
  .xxl\:gap-y-40 {
    row-gap: 40px;
  }
  .xxl\:gap-y-48 {
    row-gap: 48px;
  }
  .xxl\:gap-y-56 {
    row-gap: 56px;
  }
  .xxl\:gap-y-64 {
    row-gap: 64px;
  }
  .xxl\:gap-y-80 {
    row-gap: 80px;
  }
  .xxl\:gap-y-96 {
    row-gap: 96px;
  }
  .xxl\:gap-y-120 {
    row-gap: 120px;
  }
  .xxl\:gap-y-auto {
    row-gap: auto;
  }
}
.w-0 {
  width: 0;
}

.w-px {
  width: 1px;
}

.w-2 {
  width: 2px;
}

.w-4 {
  width: 4px;
}

.w-8 {
  width: 8px;
}

.w-16 {
  width: 16px;
}

.w-24 {
  width: 24px;
}

.w-32 {
  width: 32px;
}

.w-40 {
  width: 40px;
}

.w-48 {
  width: 48px;
}

.w-56 {
  width: 56px;
}

.w-64 {
  width: 64px;
}

.w-80 {
  width: 80px;
}

.w-96 {
  width: 96px;
}

.w-120 {
  width: 120px;
}

.w-160 {
  width: 160px;
}

.w-200 {
  width: 200px;
}

.w-240 {
  width: 240px;
}

.w-320 {
  width: 320px;
}

.w-400 {
  width: 400px;
}

.w-480 {
  width: 480px;
}

.w-full {
  width: 100%;
}

.w-screen {
  width: 100vh;
}

.w-auto {
  width: auto;
}

@media (min-width: 576px) {
  .sm\:w-0 {
    width: 0;
  }
  .sm\:w-px {
    width: 1px;
  }
  .sm\:w-2 {
    width: 2px;
  }
  .sm\:w-4 {
    width: 4px;
  }
  .sm\:w-8 {
    width: 8px;
  }
  .sm\:w-16 {
    width: 16px;
  }
  .sm\:w-24 {
    width: 24px;
  }
  .sm\:w-32 {
    width: 32px;
  }
  .sm\:w-40 {
    width: 40px;
  }
  .sm\:w-48 {
    width: 48px;
  }
  .sm\:w-56 {
    width: 56px;
  }
  .sm\:w-64 {
    width: 64px;
  }
  .sm\:w-80 {
    width: 80px;
  }
  .sm\:w-96 {
    width: 96px;
  }
  .sm\:w-120 {
    width: 120px;
  }
  .sm\:w-160 {
    width: 160px;
  }
  .sm\:w-200 {
    width: 200px;
  }
  .sm\:w-240 {
    width: 240px;
  }
  .sm\:w-320 {
    width: 320px;
  }
  .sm\:w-400 {
    width: 400px;
  }
  .sm\:w-480 {
    width: 480px;
  }
  .sm\:w-full {
    width: 100%;
  }
  .sm\:w-screen {
    width: 100vh;
  }
  .sm\:w-auto {
    width: auto;
  }
}
@media (min-width: 768px) {
  .md\:w-0 {
    width: 0;
  }
  .md\:w-px {
    width: 1px;
  }
  .md\:w-2 {
    width: 2px;
  }
  .md\:w-4 {
    width: 4px;
  }
  .md\:w-8 {
    width: 8px;
  }
  .md\:w-16 {
    width: 16px;
  }
  .md\:w-24 {
    width: 24px;
  }
  .md\:w-32 {
    width: 32px;
  }
  .md\:w-40 {
    width: 40px;
  }
  .md\:w-48 {
    width: 48px;
  }
  .md\:w-56 {
    width: 56px;
  }
  .md\:w-64 {
    width: 64px;
  }
  .md\:w-80 {
    width: 80px;
  }
  .md\:w-96 {
    width: 96px;
  }
  .md\:w-120 {
    width: 120px;
  }
  .md\:w-160 {
    width: 160px;
  }
  .md\:w-200 {
    width: 200px;
  }
  .md\:w-240 {
    width: 240px;
  }
  .md\:w-320 {
    width: 320px;
  }
  .md\:w-400 {
    width: 400px;
  }
  .md\:w-480 {
    width: 480px;
  }
  .md\:w-full {
    width: 100%;
  }
  .md\:w-screen {
    width: 100vh;
  }
  .md\:w-auto {
    width: auto;
  }
}
@media (min-width: 992px) {
  .lg\:w-0 {
    width: 0;
  }
  .lg\:w-px {
    width: 1px;
  }
  .lg\:w-2 {
    width: 2px;
  }
  .lg\:w-4 {
    width: 4px;
  }
  .lg\:w-8 {
    width: 8px;
  }
  .lg\:w-16 {
    width: 16px;
  }
  .lg\:w-24 {
    width: 24px;
  }
  .lg\:w-32 {
    width: 32px;
  }
  .lg\:w-40 {
    width: 40px;
  }
  .lg\:w-48 {
    width: 48px;
  }
  .lg\:w-56 {
    width: 56px;
  }
  .lg\:w-64 {
    width: 64px;
  }
  .lg\:w-80 {
    width: 80px;
  }
  .lg\:w-96 {
    width: 96px;
  }
  .lg\:w-120 {
    width: 120px;
  }
  .lg\:w-160 {
    width: 160px;
  }
  .lg\:w-200 {
    width: 200px;
  }
  .lg\:w-240 {
    width: 240px;
  }
  .lg\:w-320 {
    width: 320px;
  }
  .lg\:w-400 {
    width: 400px;
  }
  .lg\:w-480 {
    width: 480px;
  }
  .lg\:w-full {
    width: 100%;
  }
  .lg\:w-screen {
    width: 100vh;
  }
  .lg\:w-auto {
    width: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:w-0 {
    width: 0;
  }
  .xl\:w-px {
    width: 1px;
  }
  .xl\:w-2 {
    width: 2px;
  }
  .xl\:w-4 {
    width: 4px;
  }
  .xl\:w-8 {
    width: 8px;
  }
  .xl\:w-16 {
    width: 16px;
  }
  .xl\:w-24 {
    width: 24px;
  }
  .xl\:w-32 {
    width: 32px;
  }
  .xl\:w-40 {
    width: 40px;
  }
  .xl\:w-48 {
    width: 48px;
  }
  .xl\:w-56 {
    width: 56px;
  }
  .xl\:w-64 {
    width: 64px;
  }
  .xl\:w-80 {
    width: 80px;
  }
  .xl\:w-96 {
    width: 96px;
  }
  .xl\:w-120 {
    width: 120px;
  }
  .xl\:w-160 {
    width: 160px;
  }
  .xl\:w-200 {
    width: 200px;
  }
  .xl\:w-240 {
    width: 240px;
  }
  .xl\:w-320 {
    width: 320px;
  }
  .xl\:w-400 {
    width: 400px;
  }
  .xl\:w-480 {
    width: 480px;
  }
  .xl\:w-full {
    width: 100%;
  }
  .xl\:w-screen {
    width: 100vh;
  }
  .xl\:w-auto {
    width: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:w-0 {
    width: 0;
  }
  .xxl\:w-px {
    width: 1px;
  }
  .xxl\:w-2 {
    width: 2px;
  }
  .xxl\:w-4 {
    width: 4px;
  }
  .xxl\:w-8 {
    width: 8px;
  }
  .xxl\:w-16 {
    width: 16px;
  }
  .xxl\:w-24 {
    width: 24px;
  }
  .xxl\:w-32 {
    width: 32px;
  }
  .xxl\:w-40 {
    width: 40px;
  }
  .xxl\:w-48 {
    width: 48px;
  }
  .xxl\:w-56 {
    width: 56px;
  }
  .xxl\:w-64 {
    width: 64px;
  }
  .xxl\:w-80 {
    width: 80px;
  }
  .xxl\:w-96 {
    width: 96px;
  }
  .xxl\:w-120 {
    width: 120px;
  }
  .xxl\:w-160 {
    width: 160px;
  }
  .xxl\:w-200 {
    width: 200px;
  }
  .xxl\:w-240 {
    width: 240px;
  }
  .xxl\:w-320 {
    width: 320px;
  }
  .xxl\:w-400 {
    width: 400px;
  }
  .xxl\:w-480 {
    width: 480px;
  }
  .xxl\:w-full {
    width: 100%;
  }
  .xxl\:w-screen {
    width: 100vh;
  }
  .xxl\:w-auto {
    width: auto;
  }
}
.h-0 {
  height: 0;
}

.h-px {
  height: 1px;
}

.h-2 {
  height: 2px;
}

.h-4 {
  height: 4px;
}

.h-8 {
  height: 8px;
}

.h-16 {
  height: 16px;
}

.h-24 {
  height: 24px;
}

.h-32 {
  height: 32px;
}

.h-40 {
  height: 40px;
}

.h-48 {
  height: 48px;
}

.h-56 {
  height: 56px;
}

.h-64 {
  height: 64px;
}

.h-80 {
  height: 80px;
}

.h-96 {
  height: 96px;
}

.h-120 {
  height: 120px;
}

.h-160 {
  height: 160px;
}

.h-200 {
  height: 200px;
}

.h-240 {
  height: 240px;
}

.h-320 {
  height: 320px;
}

.h-400 {
  height: 400px;
}

.h-480 {
  height: 480px;
}

.h-full {
  height: 100%;
}

.h-screen {
  height: 100vh;
}

.h-auto {
  height: auto;
}

@media (min-width: 576px) {
  .sm\:h-0 {
    height: 0;
  }
  .sm\:h-px {
    height: 1px;
  }
  .sm\:h-2 {
    height: 2px;
  }
  .sm\:h-4 {
    height: 4px;
  }
  .sm\:h-8 {
    height: 8px;
  }
  .sm\:h-16 {
    height: 16px;
  }
  .sm\:h-24 {
    height: 24px;
  }
  .sm\:h-32 {
    height: 32px;
  }
  .sm\:h-40 {
    height: 40px;
  }
  .sm\:h-48 {
    height: 48px;
  }
  .sm\:h-56 {
    height: 56px;
  }
  .sm\:h-64 {
    height: 64px;
  }
  .sm\:h-80 {
    height: 80px;
  }
  .sm\:h-96 {
    height: 96px;
  }
  .sm\:h-120 {
    height: 120px;
  }
  .sm\:h-160 {
    height: 160px;
  }
  .sm\:h-200 {
    height: 200px;
  }
  .sm\:h-240 {
    height: 240px;
  }
  .sm\:h-320 {
    height: 320px;
  }
  .sm\:h-400 {
    height: 400px;
  }
  .sm\:h-480 {
    height: 480px;
  }
  .sm\:h-full {
    height: 100%;
  }
  .sm\:h-screen {
    height: 100vh;
  }
  .sm\:h-auto {
    height: auto;
  }
}
@media (min-width: 768px) {
  .md\:h-0 {
    height: 0;
  }
  .md\:h-px {
    height: 1px;
  }
  .md\:h-2 {
    height: 2px;
  }
  .md\:h-4 {
    height: 4px;
  }
  .md\:h-8 {
    height: 8px;
  }
  .md\:h-16 {
    height: 16px;
  }
  .md\:h-24 {
    height: 24px;
  }
  .md\:h-32 {
    height: 32px;
  }
  .md\:h-40 {
    height: 40px;
  }
  .md\:h-48 {
    height: 48px;
  }
  .md\:h-56 {
    height: 56px;
  }
  .md\:h-64 {
    height: 64px;
  }
  .md\:h-80 {
    height: 80px;
  }
  .md\:h-96 {
    height: 96px;
  }
  .md\:h-120 {
    height: 120px;
  }
  .md\:h-160 {
    height: 160px;
  }
  .md\:h-200 {
    height: 200px;
  }
  .md\:h-240 {
    height: 240px;
  }
  .md\:h-320 {
    height: 320px;
  }
  .md\:h-400 {
    height: 400px;
  }
  .md\:h-480 {
    height: 480px;
  }
  .md\:h-full {
    height: 100%;
  }
  .md\:h-screen {
    height: 100vh;
  }
  .md\:h-auto {
    height: auto;
  }
}
@media (min-width: 992px) {
  .lg\:h-0 {
    height: 0;
  }
  .lg\:h-px {
    height: 1px;
  }
  .lg\:h-2 {
    height: 2px;
  }
  .lg\:h-4 {
    height: 4px;
  }
  .lg\:h-8 {
    height: 8px;
  }
  .lg\:h-16 {
    height: 16px;
  }
  .lg\:h-24 {
    height: 24px;
  }
  .lg\:h-32 {
    height: 32px;
  }
  .lg\:h-40 {
    height: 40px;
  }
  .lg\:h-48 {
    height: 48px;
  }
  .lg\:h-56 {
    height: 56px;
  }
  .lg\:h-64 {
    height: 64px;
  }
  .lg\:h-80 {
    height: 80px;
  }
  .lg\:h-96 {
    height: 96px;
  }
  .lg\:h-120 {
    height: 120px;
  }
  .lg\:h-160 {
    height: 160px;
  }
  .lg\:h-200 {
    height: 200px;
  }
  .lg\:h-240 {
    height: 240px;
  }
  .lg\:h-320 {
    height: 320px;
  }
  .lg\:h-400 {
    height: 400px;
  }
  .lg\:h-480 {
    height: 480px;
  }
  .lg\:h-full {
    height: 100%;
  }
  .lg\:h-screen {
    height: 100vh;
  }
  .lg\:h-auto {
    height: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:h-0 {
    height: 0;
  }
  .xl\:h-px {
    height: 1px;
  }
  .xl\:h-2 {
    height: 2px;
  }
  .xl\:h-4 {
    height: 4px;
  }
  .xl\:h-8 {
    height: 8px;
  }
  .xl\:h-16 {
    height: 16px;
  }
  .xl\:h-24 {
    height: 24px;
  }
  .xl\:h-32 {
    height: 32px;
  }
  .xl\:h-40 {
    height: 40px;
  }
  .xl\:h-48 {
    height: 48px;
  }
  .xl\:h-56 {
    height: 56px;
  }
  .xl\:h-64 {
    height: 64px;
  }
  .xl\:h-80 {
    height: 80px;
  }
  .xl\:h-96 {
    height: 96px;
  }
  .xl\:h-120 {
    height: 120px;
  }
  .xl\:h-160 {
    height: 160px;
  }
  .xl\:h-200 {
    height: 200px;
  }
  .xl\:h-240 {
    height: 240px;
  }
  .xl\:h-320 {
    height: 320px;
  }
  .xl\:h-400 {
    height: 400px;
  }
  .xl\:h-480 {
    height: 480px;
  }
  .xl\:h-full {
    height: 100%;
  }
  .xl\:h-screen {
    height: 100vh;
  }
  .xl\:h-auto {
    height: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:h-0 {
    height: 0;
  }
  .xxl\:h-px {
    height: 1px;
  }
  .xxl\:h-2 {
    height: 2px;
  }
  .xxl\:h-4 {
    height: 4px;
  }
  .xxl\:h-8 {
    height: 8px;
  }
  .xxl\:h-16 {
    height: 16px;
  }
  .xxl\:h-24 {
    height: 24px;
  }
  .xxl\:h-32 {
    height: 32px;
  }
  .xxl\:h-40 {
    height: 40px;
  }
  .xxl\:h-48 {
    height: 48px;
  }
  .xxl\:h-56 {
    height: 56px;
  }
  .xxl\:h-64 {
    height: 64px;
  }
  .xxl\:h-80 {
    height: 80px;
  }
  .xxl\:h-96 {
    height: 96px;
  }
  .xxl\:h-120 {
    height: 120px;
  }
  .xxl\:h-160 {
    height: 160px;
  }
  .xxl\:h-200 {
    height: 200px;
  }
  .xxl\:h-240 {
    height: 240px;
  }
  .xxl\:h-320 {
    height: 320px;
  }
  .xxl\:h-400 {
    height: 400px;
  }
  .xxl\:h-480 {
    height: 480px;
  }
  .xxl\:h-full {
    height: 100%;
  }
  .xxl\:h-screen {
    height: 100vh;
  }
  .xxl\:h-auto {
    height: auto;
  }
}
.min-w-0 {
  min-width: 0;
}

.min-w-px {
  min-width: 1px;
}

.min-w-2 {
  min-width: 2px;
}

.min-w-4 {
  min-width: 4px;
}

.min-w-8 {
  min-width: 8px;
}

.min-w-16 {
  min-width: 16px;
}

.min-w-24 {
  min-width: 24px;
}

.min-w-32 {
  min-width: 32px;
}

.min-w-40 {
  min-width: 40px;
}

.min-w-48 {
  min-width: 48px;
}

.min-w-56 {
  min-width: 56px;
}

.min-w-64 {
  min-width: 64px;
}

.min-w-80 {
  min-width: 80px;
}

.min-w-96 {
  min-width: 96px;
}

.min-w-120 {
  min-width: 120px;
}

.min-w-160 {
  min-width: 160px;
}

.min-w-200 {
  min-width: 200px;
}

.min-w-240 {
  min-width: 240px;
}

.min-w-320 {
  min-width: 320px;
}

.min-w-400 {
  min-width: 400px;
}

.min-w-480 {
  min-width: 480px;
}

.min-w-full {
  min-width: 100%;
}

.min-w-screen {
  min-width: 100vh;
}

.min-w-auto {
  min-width: auto;
}

@media (min-width: 576px) {
  .sm\:min-w-0 {
    min-width: 0;
  }
  .sm\:min-w-px {
    min-width: 1px;
  }
  .sm\:min-w-2 {
    min-width: 2px;
  }
  .sm\:min-w-4 {
    min-width: 4px;
  }
  .sm\:min-w-8 {
    min-width: 8px;
  }
  .sm\:min-w-16 {
    min-width: 16px;
  }
  .sm\:min-w-24 {
    min-width: 24px;
  }
  .sm\:min-w-32 {
    min-width: 32px;
  }
  .sm\:min-w-40 {
    min-width: 40px;
  }
  .sm\:min-w-48 {
    min-width: 48px;
  }
  .sm\:min-w-56 {
    min-width: 56px;
  }
  .sm\:min-w-64 {
    min-width: 64px;
  }
  .sm\:min-w-80 {
    min-width: 80px;
  }
  .sm\:min-w-96 {
    min-width: 96px;
  }
  .sm\:min-w-120 {
    min-width: 120px;
  }
  .sm\:min-w-160 {
    min-width: 160px;
  }
  .sm\:min-w-200 {
    min-width: 200px;
  }
  .sm\:min-w-240 {
    min-width: 240px;
  }
  .sm\:min-w-320 {
    min-width: 320px;
  }
  .sm\:min-w-400 {
    min-width: 400px;
  }
  .sm\:min-w-480 {
    min-width: 480px;
  }
  .sm\:min-w-full {
    min-width: 100%;
  }
  .sm\:min-w-screen {
    min-width: 100vh;
  }
  .sm\:min-w-auto {
    min-width: auto;
  }
}
@media (min-width: 768px) {
  .md\:min-w-0 {
    min-width: 0;
  }
  .md\:min-w-px {
    min-width: 1px;
  }
  .md\:min-w-2 {
    min-width: 2px;
  }
  .md\:min-w-4 {
    min-width: 4px;
  }
  .md\:min-w-8 {
    min-width: 8px;
  }
  .md\:min-w-16 {
    min-width: 16px;
  }
  .md\:min-w-24 {
    min-width: 24px;
  }
  .md\:min-w-32 {
    min-width: 32px;
  }
  .md\:min-w-40 {
    min-width: 40px;
  }
  .md\:min-w-48 {
    min-width: 48px;
  }
  .md\:min-w-56 {
    min-width: 56px;
  }
  .md\:min-w-64 {
    min-width: 64px;
  }
  .md\:min-w-80 {
    min-width: 80px;
  }
  .md\:min-w-96 {
    min-width: 96px;
  }
  .md\:min-w-120 {
    min-width: 120px;
  }
  .md\:min-w-160 {
    min-width: 160px;
  }
  .md\:min-w-200 {
    min-width: 200px;
  }
  .md\:min-w-240 {
    min-width: 240px;
  }
  .md\:min-w-320 {
    min-width: 320px;
  }
  .md\:min-w-400 {
    min-width: 400px;
  }
  .md\:min-w-480 {
    min-width: 480px;
  }
  .md\:min-w-full {
    min-width: 100%;
  }
  .md\:min-w-screen {
    min-width: 100vh;
  }
  .md\:min-w-auto {
    min-width: auto;
  }
}
@media (min-width: 992px) {
  .lg\:min-w-0 {
    min-width: 0;
  }
  .lg\:min-w-px {
    min-width: 1px;
  }
  .lg\:min-w-2 {
    min-width: 2px;
  }
  .lg\:min-w-4 {
    min-width: 4px;
  }
  .lg\:min-w-8 {
    min-width: 8px;
  }
  .lg\:min-w-16 {
    min-width: 16px;
  }
  .lg\:min-w-24 {
    min-width: 24px;
  }
  .lg\:min-w-32 {
    min-width: 32px;
  }
  .lg\:min-w-40 {
    min-width: 40px;
  }
  .lg\:min-w-48 {
    min-width: 48px;
  }
  .lg\:min-w-56 {
    min-width: 56px;
  }
  .lg\:min-w-64 {
    min-width: 64px;
  }
  .lg\:min-w-80 {
    min-width: 80px;
  }
  .lg\:min-w-96 {
    min-width: 96px;
  }
  .lg\:min-w-120 {
    min-width: 120px;
  }
  .lg\:min-w-160 {
    min-width: 160px;
  }
  .lg\:min-w-200 {
    min-width: 200px;
  }
  .lg\:min-w-240 {
    min-width: 240px;
  }
  .lg\:min-w-320 {
    min-width: 320px;
  }
  .lg\:min-w-400 {
    min-width: 400px;
  }
  .lg\:min-w-480 {
    min-width: 480px;
  }
  .lg\:min-w-full {
    min-width: 100%;
  }
  .lg\:min-w-screen {
    min-width: 100vh;
  }
  .lg\:min-w-auto {
    min-width: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:min-w-0 {
    min-width: 0;
  }
  .xl\:min-w-px {
    min-width: 1px;
  }
  .xl\:min-w-2 {
    min-width: 2px;
  }
  .xl\:min-w-4 {
    min-width: 4px;
  }
  .xl\:min-w-8 {
    min-width: 8px;
  }
  .xl\:min-w-16 {
    min-width: 16px;
  }
  .xl\:min-w-24 {
    min-width: 24px;
  }
  .xl\:min-w-32 {
    min-width: 32px;
  }
  .xl\:min-w-40 {
    min-width: 40px;
  }
  .xl\:min-w-48 {
    min-width: 48px;
  }
  .xl\:min-w-56 {
    min-width: 56px;
  }
  .xl\:min-w-64 {
    min-width: 64px;
  }
  .xl\:min-w-80 {
    min-width: 80px;
  }
  .xl\:min-w-96 {
    min-width: 96px;
  }
  .xl\:min-w-120 {
    min-width: 120px;
  }
  .xl\:min-w-160 {
    min-width: 160px;
  }
  .xl\:min-w-200 {
    min-width: 200px;
  }
  .xl\:min-w-240 {
    min-width: 240px;
  }
  .xl\:min-w-320 {
    min-width: 320px;
  }
  .xl\:min-w-400 {
    min-width: 400px;
  }
  .xl\:min-w-480 {
    min-width: 480px;
  }
  .xl\:min-w-full {
    min-width: 100%;
  }
  .xl\:min-w-screen {
    min-width: 100vh;
  }
  .xl\:min-w-auto {
    min-width: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:min-w-0 {
    min-width: 0;
  }
  .xxl\:min-w-px {
    min-width: 1px;
  }
  .xxl\:min-w-2 {
    min-width: 2px;
  }
  .xxl\:min-w-4 {
    min-width: 4px;
  }
  .xxl\:min-w-8 {
    min-width: 8px;
  }
  .xxl\:min-w-16 {
    min-width: 16px;
  }
  .xxl\:min-w-24 {
    min-width: 24px;
  }
  .xxl\:min-w-32 {
    min-width: 32px;
  }
  .xxl\:min-w-40 {
    min-width: 40px;
  }
  .xxl\:min-w-48 {
    min-width: 48px;
  }
  .xxl\:min-w-56 {
    min-width: 56px;
  }
  .xxl\:min-w-64 {
    min-width: 64px;
  }
  .xxl\:min-w-80 {
    min-width: 80px;
  }
  .xxl\:min-w-96 {
    min-width: 96px;
  }
  .xxl\:min-w-120 {
    min-width: 120px;
  }
  .xxl\:min-w-160 {
    min-width: 160px;
  }
  .xxl\:min-w-200 {
    min-width: 200px;
  }
  .xxl\:min-w-240 {
    min-width: 240px;
  }
  .xxl\:min-w-320 {
    min-width: 320px;
  }
  .xxl\:min-w-400 {
    min-width: 400px;
  }
  .xxl\:min-w-480 {
    min-width: 480px;
  }
  .xxl\:min-w-full {
    min-width: 100%;
  }
  .xxl\:min-w-screen {
    min-width: 100vh;
  }
  .xxl\:min-w-auto {
    min-width: auto;
  }
}
.min-h-0 {
  min-height: 0;
}

.min-h-px {
  min-height: 1px;
}

.min-h-2 {
  min-height: 2px;
}

.min-h-4 {
  min-height: 4px;
}

.min-h-8 {
  min-height: 8px;
}

.min-h-16 {
  min-height: 16px;
}

.min-h-24 {
  min-height: 24px;
}

.min-h-32 {
  min-height: 32px;
}

.min-h-40 {
  min-height: 40px;
}

.min-h-48 {
  min-height: 48px;
}

.min-h-56 {
  min-height: 56px;
}

.min-h-64 {
  min-height: 64px;
}

.min-h-80 {
  min-height: 80px;
}

.min-h-96 {
  min-height: 96px;
}

.min-h-120 {
  min-height: 120px;
}

.min-h-160 {
  min-height: 160px;
}

.min-h-200 {
  min-height: 200px;
}

.min-h-240 {
  min-height: 240px;
}

.min-h-320 {
  min-height: 320px;
}

.min-h-400 {
  min-height: 400px;
}

.min-h-480 {
  min-height: 480px;
}

.min-h-full {
  min-height: 100%;
}

.min-h-screen {
  min-height: 100vh;
}

.min-h-auto {
  min-height: auto;
}

@media (min-width: 576px) {
  .sm\:min-h-0 {
    min-height: 0;
  }
  .sm\:min-h-px {
    min-height: 1px;
  }
  .sm\:min-h-2 {
    min-height: 2px;
  }
  .sm\:min-h-4 {
    min-height: 4px;
  }
  .sm\:min-h-8 {
    min-height: 8px;
  }
  .sm\:min-h-16 {
    min-height: 16px;
  }
  .sm\:min-h-24 {
    min-height: 24px;
  }
  .sm\:min-h-32 {
    min-height: 32px;
  }
  .sm\:min-h-40 {
    min-height: 40px;
  }
  .sm\:min-h-48 {
    min-height: 48px;
  }
  .sm\:min-h-56 {
    min-height: 56px;
  }
  .sm\:min-h-64 {
    min-height: 64px;
  }
  .sm\:min-h-80 {
    min-height: 80px;
  }
  .sm\:min-h-96 {
    min-height: 96px;
  }
  .sm\:min-h-120 {
    min-height: 120px;
  }
  .sm\:min-h-160 {
    min-height: 160px;
  }
  .sm\:min-h-200 {
    min-height: 200px;
  }
  .sm\:min-h-240 {
    min-height: 240px;
  }
  .sm\:min-h-320 {
    min-height: 320px;
  }
  .sm\:min-h-400 {
    min-height: 400px;
  }
  .sm\:min-h-480 {
    min-height: 480px;
  }
  .sm\:min-h-full {
    min-height: 100%;
  }
  .sm\:min-h-screen {
    min-height: 100vh;
  }
  .sm\:min-h-auto {
    min-height: auto;
  }
}
@media (min-width: 768px) {
  .md\:min-h-0 {
    min-height: 0;
  }
  .md\:min-h-px {
    min-height: 1px;
  }
  .md\:min-h-2 {
    min-height: 2px;
  }
  .md\:min-h-4 {
    min-height: 4px;
  }
  .md\:min-h-8 {
    min-height: 8px;
  }
  .md\:min-h-16 {
    min-height: 16px;
  }
  .md\:min-h-24 {
    min-height: 24px;
  }
  .md\:min-h-32 {
    min-height: 32px;
  }
  .md\:min-h-40 {
    min-height: 40px;
  }
  .md\:min-h-48 {
    min-height: 48px;
  }
  .md\:min-h-56 {
    min-height: 56px;
  }
  .md\:min-h-64 {
    min-height: 64px;
  }
  .md\:min-h-80 {
    min-height: 80px;
  }
  .md\:min-h-96 {
    min-height: 96px;
  }
  .md\:min-h-120 {
    min-height: 120px;
  }
  .md\:min-h-160 {
    min-height: 160px;
  }
  .md\:min-h-200 {
    min-height: 200px;
  }
  .md\:min-h-240 {
    min-height: 240px;
  }
  .md\:min-h-320 {
    min-height: 320px;
  }
  .md\:min-h-400 {
    min-height: 400px;
  }
  .md\:min-h-480 {
    min-height: 480px;
  }
  .md\:min-h-full {
    min-height: 100%;
  }
  .md\:min-h-screen {
    min-height: 100vh;
  }
  .md\:min-h-auto {
    min-height: auto;
  }
}
@media (min-width: 992px) {
  .lg\:min-h-0 {
    min-height: 0;
  }
  .lg\:min-h-px {
    min-height: 1px;
  }
  .lg\:min-h-2 {
    min-height: 2px;
  }
  .lg\:min-h-4 {
    min-height: 4px;
  }
  .lg\:min-h-8 {
    min-height: 8px;
  }
  .lg\:min-h-16 {
    min-height: 16px;
  }
  .lg\:min-h-24 {
    min-height: 24px;
  }
  .lg\:min-h-32 {
    min-height: 32px;
  }
  .lg\:min-h-40 {
    min-height: 40px;
  }
  .lg\:min-h-48 {
    min-height: 48px;
  }
  .lg\:min-h-56 {
    min-height: 56px;
  }
  .lg\:min-h-64 {
    min-height: 64px;
  }
  .lg\:min-h-80 {
    min-height: 80px;
  }
  .lg\:min-h-96 {
    min-height: 96px;
  }
  .lg\:min-h-120 {
    min-height: 120px;
  }
  .lg\:min-h-160 {
    min-height: 160px;
  }
  .lg\:min-h-200 {
    min-height: 200px;
  }
  .lg\:min-h-240 {
    min-height: 240px;
  }
  .lg\:min-h-320 {
    min-height: 320px;
  }
  .lg\:min-h-400 {
    min-height: 400px;
  }
  .lg\:min-h-480 {
    min-height: 480px;
  }
  .lg\:min-h-full {
    min-height: 100%;
  }
  .lg\:min-h-screen {
    min-height: 100vh;
  }
  .lg\:min-h-auto {
    min-height: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:min-h-0 {
    min-height: 0;
  }
  .xl\:min-h-px {
    min-height: 1px;
  }
  .xl\:min-h-2 {
    min-height: 2px;
  }
  .xl\:min-h-4 {
    min-height: 4px;
  }
  .xl\:min-h-8 {
    min-height: 8px;
  }
  .xl\:min-h-16 {
    min-height: 16px;
  }
  .xl\:min-h-24 {
    min-height: 24px;
  }
  .xl\:min-h-32 {
    min-height: 32px;
  }
  .xl\:min-h-40 {
    min-height: 40px;
  }
  .xl\:min-h-48 {
    min-height: 48px;
  }
  .xl\:min-h-56 {
    min-height: 56px;
  }
  .xl\:min-h-64 {
    min-height: 64px;
  }
  .xl\:min-h-80 {
    min-height: 80px;
  }
  .xl\:min-h-96 {
    min-height: 96px;
  }
  .xl\:min-h-120 {
    min-height: 120px;
  }
  .xl\:min-h-160 {
    min-height: 160px;
  }
  .xl\:min-h-200 {
    min-height: 200px;
  }
  .xl\:min-h-240 {
    min-height: 240px;
  }
  .xl\:min-h-320 {
    min-height: 320px;
  }
  .xl\:min-h-400 {
    min-height: 400px;
  }
  .xl\:min-h-480 {
    min-height: 480px;
  }
  .xl\:min-h-full {
    min-height: 100%;
  }
  .xl\:min-h-screen {
    min-height: 100vh;
  }
  .xl\:min-h-auto {
    min-height: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:min-h-0 {
    min-height: 0;
  }
  .xxl\:min-h-px {
    min-height: 1px;
  }
  .xxl\:min-h-2 {
    min-height: 2px;
  }
  .xxl\:min-h-4 {
    min-height: 4px;
  }
  .xxl\:min-h-8 {
    min-height: 8px;
  }
  .xxl\:min-h-16 {
    min-height: 16px;
  }
  .xxl\:min-h-24 {
    min-height: 24px;
  }
  .xxl\:min-h-32 {
    min-height: 32px;
  }
  .xxl\:min-h-40 {
    min-height: 40px;
  }
  .xxl\:min-h-48 {
    min-height: 48px;
  }
  .xxl\:min-h-56 {
    min-height: 56px;
  }
  .xxl\:min-h-64 {
    min-height: 64px;
  }
  .xxl\:min-h-80 {
    min-height: 80px;
  }
  .xxl\:min-h-96 {
    min-height: 96px;
  }
  .xxl\:min-h-120 {
    min-height: 120px;
  }
  .xxl\:min-h-160 {
    min-height: 160px;
  }
  .xxl\:min-h-200 {
    min-height: 200px;
  }
  .xxl\:min-h-240 {
    min-height: 240px;
  }
  .xxl\:min-h-320 {
    min-height: 320px;
  }
  .xxl\:min-h-400 {
    min-height: 400px;
  }
  .xxl\:min-h-480 {
    min-height: 480px;
  }
  .xxl\:min-h-full {
    min-height: 100%;
  }
  .xxl\:min-h-screen {
    min-height: 100vh;
  }
  .xxl\:min-h-auto {
    min-height: auto;
  }
}
.max-w-0 {
  max-width: 0;
}

.max-w-px {
  max-width: 1px;
}

.max-w-2 {
  max-width: 2px;
}

.max-w-4 {
  max-width: 4px;
}

.max-w-8 {
  max-width: 8px;
}

.max-w-16 {
  max-width: 16px;
}

.max-w-24 {
  max-width: 24px;
}

.max-w-32 {
  max-width: 32px;
}

.max-w-40 {
  max-width: 40px;
}

.max-w-48 {
  max-width: 48px;
}

.max-w-56 {
  max-width: 56px;
}

.max-w-64 {
  max-width: 64px;
}

.max-w-80 {
  max-width: 80px;
}

.max-w-96 {
  max-width: 96px;
}

.max-w-120 {
  max-width: 120px;
}

.max-w-160 {
  max-width: 160px;
}

.max-w-200 {
  max-width: 200px;
}

.max-w-240 {
  max-width: 240px;
}

.max-w-320 {
  max-width: 320px;
}

.max-w-400 {
  max-width: 400px;
}

.max-w-480 {
  max-width: 480px;
}

.max-w-full {
  max-width: 100%;
}

.max-w-screen {
  max-width: 100vh;
}

.max-w-auto {
  max-width: auto;
}

@media (min-width: 576px) {
  .sm\:max-w-0 {
    max-width: 0;
  }
  .sm\:max-w-px {
    max-width: 1px;
  }
  .sm\:max-w-2 {
    max-width: 2px;
  }
  .sm\:max-w-4 {
    max-width: 4px;
  }
  .sm\:max-w-8 {
    max-width: 8px;
  }
  .sm\:max-w-16 {
    max-width: 16px;
  }
  .sm\:max-w-24 {
    max-width: 24px;
  }
  .sm\:max-w-32 {
    max-width: 32px;
  }
  .sm\:max-w-40 {
    max-width: 40px;
  }
  .sm\:max-w-48 {
    max-width: 48px;
  }
  .sm\:max-w-56 {
    max-width: 56px;
  }
  .sm\:max-w-64 {
    max-width: 64px;
  }
  .sm\:max-w-80 {
    max-width: 80px;
  }
  .sm\:max-w-96 {
    max-width: 96px;
  }
  .sm\:max-w-120 {
    max-width: 120px;
  }
  .sm\:max-w-160 {
    max-width: 160px;
  }
  .sm\:max-w-200 {
    max-width: 200px;
  }
  .sm\:max-w-240 {
    max-width: 240px;
  }
  .sm\:max-w-320 {
    max-width: 320px;
  }
  .sm\:max-w-400 {
    max-width: 400px;
  }
  .sm\:max-w-480 {
    max-width: 480px;
  }
  .sm\:max-w-full {
    max-width: 100%;
  }
  .sm\:max-w-screen {
    max-width: 100vh;
  }
  .sm\:max-w-auto {
    max-width: auto;
  }
}
@media (min-width: 768px) {
  .md\:max-w-0 {
    max-width: 0;
  }
  .md\:max-w-px {
    max-width: 1px;
  }
  .md\:max-w-2 {
    max-width: 2px;
  }
  .md\:max-w-4 {
    max-width: 4px;
  }
  .md\:max-w-8 {
    max-width: 8px;
  }
  .md\:max-w-16 {
    max-width: 16px;
  }
  .md\:max-w-24 {
    max-width: 24px;
  }
  .md\:max-w-32 {
    max-width: 32px;
  }
  .md\:max-w-40 {
    max-width: 40px;
  }
  .md\:max-w-48 {
    max-width: 48px;
  }
  .md\:max-w-56 {
    max-width: 56px;
  }
  .md\:max-w-64 {
    max-width: 64px;
  }
  .md\:max-w-80 {
    max-width: 80px;
  }
  .md\:max-w-96 {
    max-width: 96px;
  }
  .md\:max-w-120 {
    max-width: 120px;
  }
  .md\:max-w-160 {
    max-width: 160px;
  }
  .md\:max-w-200 {
    max-width: 200px;
  }
  .md\:max-w-240 {
    max-width: 240px;
  }
  .md\:max-w-320 {
    max-width: 320px;
  }
  .md\:max-w-400 {
    max-width: 400px;
  }
  .md\:max-w-480 {
    max-width: 480px;
  }
  .md\:max-w-full {
    max-width: 100%;
  }
  .md\:max-w-screen {
    max-width: 100vh;
  }
  .md\:max-w-auto {
    max-width: auto;
  }
}
@media (min-width: 992px) {
  .lg\:max-w-0 {
    max-width: 0;
  }
  .lg\:max-w-px {
    max-width: 1px;
  }
  .lg\:max-w-2 {
    max-width: 2px;
  }
  .lg\:max-w-4 {
    max-width: 4px;
  }
  .lg\:max-w-8 {
    max-width: 8px;
  }
  .lg\:max-w-16 {
    max-width: 16px;
  }
  .lg\:max-w-24 {
    max-width: 24px;
  }
  .lg\:max-w-32 {
    max-width: 32px;
  }
  .lg\:max-w-40 {
    max-width: 40px;
  }
  .lg\:max-w-48 {
    max-width: 48px;
  }
  .lg\:max-w-56 {
    max-width: 56px;
  }
  .lg\:max-w-64 {
    max-width: 64px;
  }
  .lg\:max-w-80 {
    max-width: 80px;
  }
  .lg\:max-w-96 {
    max-width: 96px;
  }
  .lg\:max-w-120 {
    max-width: 120px;
  }
  .lg\:max-w-160 {
    max-width: 160px;
  }
  .lg\:max-w-200 {
    max-width: 200px;
  }
  .lg\:max-w-240 {
    max-width: 240px;
  }
  .lg\:max-w-320 {
    max-width: 320px;
  }
  .lg\:max-w-400 {
    max-width: 400px;
  }
  .lg\:max-w-480 {
    max-width: 480px;
  }
  .lg\:max-w-full {
    max-width: 100%;
  }
  .lg\:max-w-screen {
    max-width: 100vh;
  }
  .lg\:max-w-auto {
    max-width: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:max-w-0 {
    max-width: 0;
  }
  .xl\:max-w-px {
    max-width: 1px;
  }
  .xl\:max-w-2 {
    max-width: 2px;
  }
  .xl\:max-w-4 {
    max-width: 4px;
  }
  .xl\:max-w-8 {
    max-width: 8px;
  }
  .xl\:max-w-16 {
    max-width: 16px;
  }
  .xl\:max-w-24 {
    max-width: 24px;
  }
  .xl\:max-w-32 {
    max-width: 32px;
  }
  .xl\:max-w-40 {
    max-width: 40px;
  }
  .xl\:max-w-48 {
    max-width: 48px;
  }
  .xl\:max-w-56 {
    max-width: 56px;
  }
  .xl\:max-w-64 {
    max-width: 64px;
  }
  .xl\:max-w-80 {
    max-width: 80px;
  }
  .xl\:max-w-96 {
    max-width: 96px;
  }
  .xl\:max-w-120 {
    max-width: 120px;
  }
  .xl\:max-w-160 {
    max-width: 160px;
  }
  .xl\:max-w-200 {
    max-width: 200px;
  }
  .xl\:max-w-240 {
    max-width: 240px;
  }
  .xl\:max-w-320 {
    max-width: 320px;
  }
  .xl\:max-w-400 {
    max-width: 400px;
  }
  .xl\:max-w-480 {
    max-width: 480px;
  }
  .xl\:max-w-full {
    max-width: 100%;
  }
  .xl\:max-w-screen {
    max-width: 100vh;
  }
  .xl\:max-w-auto {
    max-width: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:max-w-0 {
    max-width: 0;
  }
  .xxl\:max-w-px {
    max-width: 1px;
  }
  .xxl\:max-w-2 {
    max-width: 2px;
  }
  .xxl\:max-w-4 {
    max-width: 4px;
  }
  .xxl\:max-w-8 {
    max-width: 8px;
  }
  .xxl\:max-w-16 {
    max-width: 16px;
  }
  .xxl\:max-w-24 {
    max-width: 24px;
  }
  .xxl\:max-w-32 {
    max-width: 32px;
  }
  .xxl\:max-w-40 {
    max-width: 40px;
  }
  .xxl\:max-w-48 {
    max-width: 48px;
  }
  .xxl\:max-w-56 {
    max-width: 56px;
  }
  .xxl\:max-w-64 {
    max-width: 64px;
  }
  .xxl\:max-w-80 {
    max-width: 80px;
  }
  .xxl\:max-w-96 {
    max-width: 96px;
  }
  .xxl\:max-w-120 {
    max-width: 120px;
  }
  .xxl\:max-w-160 {
    max-width: 160px;
  }
  .xxl\:max-w-200 {
    max-width: 200px;
  }
  .xxl\:max-w-240 {
    max-width: 240px;
  }
  .xxl\:max-w-320 {
    max-width: 320px;
  }
  .xxl\:max-w-400 {
    max-width: 400px;
  }
  .xxl\:max-w-480 {
    max-width: 480px;
  }
  .xxl\:max-w-full {
    max-width: 100%;
  }
  .xxl\:max-w-screen {
    max-width: 100vh;
  }
  .xxl\:max-w-auto {
    max-width: auto;
  }
}
.max-h-0 {
  max-height: 0;
}

.max-h-px {
  max-height: 1px;
}

.max-h-2 {
  max-height: 2px;
}

.max-h-4 {
  max-height: 4px;
}

.max-h-8 {
  max-height: 8px;
}

.max-h-16 {
  max-height: 16px;
}

.max-h-24 {
  max-height: 24px;
}

.max-h-32 {
  max-height: 32px;
}

.max-h-40 {
  max-height: 40px;
}

.max-h-48 {
  max-height: 48px;
}

.max-h-56 {
  max-height: 56px;
}

.max-h-64 {
  max-height: 64px;
}

.max-h-80 {
  max-height: 80px;
}

.max-h-96 {
  max-height: 96px;
}

.max-h-120 {
  max-height: 120px;
}

.max-h-160 {
  max-height: 160px;
}

.max-h-200 {
  max-height: 200px;
}

.max-h-240 {
  max-height: 240px;
}

.max-h-320 {
  max-height: 320px;
}

.max-h-400 {
  max-height: 400px;
}

.max-h-480 {
  max-height: 480px;
}

.max-h-full {
  max-height: 100%;
}

.max-h-screen {
  max-height: 100vh;
}

.max-h-auto {
  max-height: auto;
}

@media (min-width: 576px) {
  .sm\:max-h-0 {
    max-height: 0;
  }
  .sm\:max-h-px {
    max-height: 1px;
  }
  .sm\:max-h-2 {
    max-height: 2px;
  }
  .sm\:max-h-4 {
    max-height: 4px;
  }
  .sm\:max-h-8 {
    max-height: 8px;
  }
  .sm\:max-h-16 {
    max-height: 16px;
  }
  .sm\:max-h-24 {
    max-height: 24px;
  }
  .sm\:max-h-32 {
    max-height: 32px;
  }
  .sm\:max-h-40 {
    max-height: 40px;
  }
  .sm\:max-h-48 {
    max-height: 48px;
  }
  .sm\:max-h-56 {
    max-height: 56px;
  }
  .sm\:max-h-64 {
    max-height: 64px;
  }
  .sm\:max-h-80 {
    max-height: 80px;
  }
  .sm\:max-h-96 {
    max-height: 96px;
  }
  .sm\:max-h-120 {
    max-height: 120px;
  }
  .sm\:max-h-160 {
    max-height: 160px;
  }
  .sm\:max-h-200 {
    max-height: 200px;
  }
  .sm\:max-h-240 {
    max-height: 240px;
  }
  .sm\:max-h-320 {
    max-height: 320px;
  }
  .sm\:max-h-400 {
    max-height: 400px;
  }
  .sm\:max-h-480 {
    max-height: 480px;
  }
  .sm\:max-h-full {
    max-height: 100%;
  }
  .sm\:max-h-screen {
    max-height: 100vh;
  }
  .sm\:max-h-auto {
    max-height: auto;
  }
}
@media (min-width: 768px) {
  .md\:max-h-0 {
    max-height: 0;
  }
  .md\:max-h-px {
    max-height: 1px;
  }
  .md\:max-h-2 {
    max-height: 2px;
  }
  .md\:max-h-4 {
    max-height: 4px;
  }
  .md\:max-h-8 {
    max-height: 8px;
  }
  .md\:max-h-16 {
    max-height: 16px;
  }
  .md\:max-h-24 {
    max-height: 24px;
  }
  .md\:max-h-32 {
    max-height: 32px;
  }
  .md\:max-h-40 {
    max-height: 40px;
  }
  .md\:max-h-48 {
    max-height: 48px;
  }
  .md\:max-h-56 {
    max-height: 56px;
  }
  .md\:max-h-64 {
    max-height: 64px;
  }
  .md\:max-h-80 {
    max-height: 80px;
  }
  .md\:max-h-96 {
    max-height: 96px;
  }
  .md\:max-h-120 {
    max-height: 120px;
  }
  .md\:max-h-160 {
    max-height: 160px;
  }
  .md\:max-h-200 {
    max-height: 200px;
  }
  .md\:max-h-240 {
    max-height: 240px;
  }
  .md\:max-h-320 {
    max-height: 320px;
  }
  .md\:max-h-400 {
    max-height: 400px;
  }
  .md\:max-h-480 {
    max-height: 480px;
  }
  .md\:max-h-full {
    max-height: 100%;
  }
  .md\:max-h-screen {
    max-height: 100vh;
  }
  .md\:max-h-auto {
    max-height: auto;
  }
}
@media (min-width: 992px) {
  .lg\:max-h-0 {
    max-height: 0;
  }
  .lg\:max-h-px {
    max-height: 1px;
  }
  .lg\:max-h-2 {
    max-height: 2px;
  }
  .lg\:max-h-4 {
    max-height: 4px;
  }
  .lg\:max-h-8 {
    max-height: 8px;
  }
  .lg\:max-h-16 {
    max-height: 16px;
  }
  .lg\:max-h-24 {
    max-height: 24px;
  }
  .lg\:max-h-32 {
    max-height: 32px;
  }
  .lg\:max-h-40 {
    max-height: 40px;
  }
  .lg\:max-h-48 {
    max-height: 48px;
  }
  .lg\:max-h-56 {
    max-height: 56px;
  }
  .lg\:max-h-64 {
    max-height: 64px;
  }
  .lg\:max-h-80 {
    max-height: 80px;
  }
  .lg\:max-h-96 {
    max-height: 96px;
  }
  .lg\:max-h-120 {
    max-height: 120px;
  }
  .lg\:max-h-160 {
    max-height: 160px;
  }
  .lg\:max-h-200 {
    max-height: 200px;
  }
  .lg\:max-h-240 {
    max-height: 240px;
  }
  .lg\:max-h-320 {
    max-height: 320px;
  }
  .lg\:max-h-400 {
    max-height: 400px;
  }
  .lg\:max-h-480 {
    max-height: 480px;
  }
  .lg\:max-h-full {
    max-height: 100%;
  }
  .lg\:max-h-screen {
    max-height: 100vh;
  }
  .lg\:max-h-auto {
    max-height: auto;
  }
}
@media (min-width: 1200px) {
  .xl\:max-h-0 {
    max-height: 0;
  }
  .xl\:max-h-px {
    max-height: 1px;
  }
  .xl\:max-h-2 {
    max-height: 2px;
  }
  .xl\:max-h-4 {
    max-height: 4px;
  }
  .xl\:max-h-8 {
    max-height: 8px;
  }
  .xl\:max-h-16 {
    max-height: 16px;
  }
  .xl\:max-h-24 {
    max-height: 24px;
  }
  .xl\:max-h-32 {
    max-height: 32px;
  }
  .xl\:max-h-40 {
    max-height: 40px;
  }
  .xl\:max-h-48 {
    max-height: 48px;
  }
  .xl\:max-h-56 {
    max-height: 56px;
  }
  .xl\:max-h-64 {
    max-height: 64px;
  }
  .xl\:max-h-80 {
    max-height: 80px;
  }
  .xl\:max-h-96 {
    max-height: 96px;
  }
  .xl\:max-h-120 {
    max-height: 120px;
  }
  .xl\:max-h-160 {
    max-height: 160px;
  }
  .xl\:max-h-200 {
    max-height: 200px;
  }
  .xl\:max-h-240 {
    max-height: 240px;
  }
  .xl\:max-h-320 {
    max-height: 320px;
  }
  .xl\:max-h-400 {
    max-height: 400px;
  }
  .xl\:max-h-480 {
    max-height: 480px;
  }
  .xl\:max-h-full {
    max-height: 100%;
  }
  .xl\:max-h-screen {
    max-height: 100vh;
  }
  .xl\:max-h-auto {
    max-height: auto;
  }
}
@media (min-width: 1440px) {
  .xxl\:max-h-0 {
    max-height: 0;
  }
  .xxl\:max-h-px {
    max-height: 1px;
  }
  .xxl\:max-h-2 {
    max-height: 2px;
  }
  .xxl\:max-h-4 {
    max-height: 4px;
  }
  .xxl\:max-h-8 {
    max-height: 8px;
  }
  .xxl\:max-h-16 {
    max-height: 16px;
  }
  .xxl\:max-h-24 {
    max-height: 24px;
  }
  .xxl\:max-h-32 {
    max-height: 32px;
  }
  .xxl\:max-h-40 {
    max-height: 40px;
  }
  .xxl\:max-h-48 {
    max-height: 48px;
  }
  .xxl\:max-h-56 {
    max-height: 56px;
  }
  .xxl\:max-h-64 {
    max-height: 64px;
  }
  .xxl\:max-h-80 {
    max-height: 80px;
  }
  .xxl\:max-h-96 {
    max-height: 96px;
  }
  .xxl\:max-h-120 {
    max-height: 120px;
  }
  .xxl\:max-h-160 {
    max-height: 160px;
  }
  .xxl\:max-h-200 {
    max-height: 200px;
  }
  .xxl\:max-h-240 {
    max-height: 240px;
  }
  .xxl\:max-h-320 {
    max-height: 320px;
  }
  .xxl\:max-h-400 {
    max-height: 400px;
  }
  .xxl\:max-h-480 {
    max-height: 480px;
  }
  .xxl\:max-h-full {
    max-height: 100%;
  }
  .xxl\:max-h-screen {
    max-height: 100vh;
  }
  .xxl\:max-h-auto {
    max-height: auto;
  }
}
.w-25 {
  width: 25%;
}

.h-25 {
  height: 25%;
}

.w-33 {
  width: 33.3333%;
}

.h-33 {
  height: 33.3333%;
}

.w-50 {
  width: 50%;
}

.h-50 {
  height: 50%;
}

.w-66 {
  width: 66.6667%;
}

.h-66 {
  height: 66.6667%;
}

.w-75 {
  width: 75%;
}

.h-75 {
  height: 75%;
}

.w-100 {
  width: 100%;
}

.h-100 {
  height: 100%;
}

@media (min-width: 576px) {
  .sm\:w-25 {
    width: 25%;
  }
  .sm\:h-25 {
    height: 25%;
  }
  .sm\:w-33 {
    width: 33.3333%;
  }
  .sm\:h-33 {
    height: 33.3333%;
  }
  .sm\:w-50 {
    width: 50%;
  }
  .sm\:h-50 {
    height: 50%;
  }
  .sm\:w-66 {
    width: 66.6667%;
  }
  .sm\:h-66 {
    height: 66.6667%;
  }
  .sm\:w-75 {
    width: 75%;
  }
  .sm\:h-75 {
    height: 75%;
  }
  .sm\:w-100 {
    width: 100%;
  }
  .sm\:h-100 {
    height: 100%;
  }
}
@media (min-width: 768px) {
  .md\:w-25 {
    width: 25%;
  }
  .md\:h-25 {
    height: 25%;
  }
  .md\:w-33 {
    width: 33.3333%;
  }
  .md\:h-33 {
    height: 33.3333%;
  }
  .md\:w-50 {
    width: 50%;
  }
  .md\:h-50 {
    height: 50%;
  }
  .md\:w-66 {
    width: 66.6667%;
  }
  .md\:h-66 {
    height: 66.6667%;
  }
  .md\:w-75 {
    width: 75%;
  }
  .md\:h-75 {
    height: 75%;
  }
  .md\:w-100 {
    width: 100%;
  }
  .md\:h-100 {
    height: 100%;
  }
}
@media (min-width: 992px) {
  .lg\:w-25 {
    width: 25%;
  }
  .lg\:h-25 {
    height: 25%;
  }
  .lg\:w-33 {
    width: 33.3333%;
  }
  .lg\:h-33 {
    height: 33.3333%;
  }
  .lg\:w-50 {
    width: 50%;
  }
  .lg\:h-50 {
    height: 50%;
  }
  .lg\:w-66 {
    width: 66.6667%;
  }
  .lg\:h-66 {
    height: 66.6667%;
  }
  .lg\:w-75 {
    width: 75%;
  }
  .lg\:h-75 {
    height: 75%;
  }
  .lg\:w-100 {
    width: 100%;
  }
  .lg\:h-100 {
    height: 100%;
  }
}
@media (min-width: 1200px) {
  .xl\:w-25 {
    width: 25%;
  }
  .xl\:h-25 {
    height: 25%;
  }
  .xl\:w-33 {
    width: 33.3333%;
  }
  .xl\:h-33 {
    height: 33.3333%;
  }
  .xl\:w-50 {
    width: 50%;
  }
  .xl\:h-50 {
    height: 50%;
  }
  .xl\:w-66 {
    width: 66.6667%;
  }
  .xl\:h-66 {
    height: 66.6667%;
  }
  .xl\:w-75 {
    width: 75%;
  }
  .xl\:h-75 {
    height: 75%;
  }
  .xl\:w-100 {
    width: 100%;
  }
  .xl\:h-100 {
    height: 100%;
  }
}
@media (min-width: 1440px) {
  .xxl\:w-25 {
    width: 25%;
  }
  .xxl\:h-25 {
    height: 25%;
  }
  .xxl\:w-33 {
    width: 33.3333%;
  }
  .xxl\:h-33 {
    height: 33.3333%;
  }
  .xxl\:w-50 {
    width: 50%;
  }
  .xxl\:h-50 {
    height: 50%;
  }
  .xxl\:w-66 {
    width: 66.6667%;
  }
  .xxl\:h-66 {
    height: 66.6667%;
  }
  .xxl\:w-75 {
    width: 75%;
  }
  .xxl\:h-75 {
    height: 75%;
  }
  .xxl\:w-100 {
    width: 100%;
  }
  .xxl\:h-100 {
    height: 100%;
  }
}
.aspect-square {
  aspect-ratio: 1/1;
}

.aspect-video {
  aspect-ratio: 16/9;
}

.aspect-4-3 {
  aspect-ratio: 4/3;
}

.aspect-3-2 {
  aspect-ratio: 3/2;
}

.text-10 {
  font-size: 10px;
}

.text-11 {
  font-size: 11px;
}

.text-12 {
  font-size: 12px;
}

.text-13 {
  font-size: 13px;
}

.text-14 {
  font-size: 14px;
}

.text-16 {
  font-size: 16px;
}

.text-18 {
  font-size: 18px;
}

.text-20 {
  font-size: 20px;
}

.text-22 {
  font-size: 22px;
}

.text-24 {
  font-size: 24px;
}

.text-28 {
  font-size: 28px;
}

.text-32 {
  font-size: 32px;
}

.text-40 {
  font-size: 40px;
}

.text-48 {
  font-size: 48px;
}

.text-56 {
  font-size: 56px;
}

@media (min-width: 576px) {
  .sm\:text-10 {
    font-size: 10px;
  }
  .sm\:text-11 {
    font-size: 11px;
  }
  .sm\:text-12 {
    font-size: 12px;
  }
  .sm\:text-13 {
    font-size: 13px;
  }
  .sm\:text-14 {
    font-size: 14px;
  }
  .sm\:text-16 {
    font-size: 16px;
  }
  .sm\:text-18 {
    font-size: 18px;
  }
  .sm\:text-20 {
    font-size: 20px;
  }
  .sm\:text-22 {
    font-size: 22px;
  }
  .sm\:text-24 {
    font-size: 24px;
  }
  .sm\:text-28 {
    font-size: 28px;
  }
  .sm\:text-32 {
    font-size: 32px;
  }
  .sm\:text-40 {
    font-size: 40px;
  }
  .sm\:text-48 {
    font-size: 48px;
  }
  .sm\:text-56 {
    font-size: 56px;
  }
}
@media (min-width: 768px) {
  .md\:text-10 {
    font-size: 10px;
  }
  .md\:text-11 {
    font-size: 11px;
  }
  .md\:text-12 {
    font-size: 12px;
  }
  .md\:text-13 {
    font-size: 13px;
  }
  .md\:text-14 {
    font-size: 14px;
  }
  .md\:text-16 {
    font-size: 16px;
  }
  .md\:text-18 {
    font-size: 18px;
  }
  .md\:text-20 {
    font-size: 20px;
  }
  .md\:text-22 {
    font-size: 22px;
  }
  .md\:text-24 {
    font-size: 24px;
  }
  .md\:text-28 {
    font-size: 28px;
  }
  .md\:text-32 {
    font-size: 32px;
  }
  .md\:text-40 {
    font-size: 40px;
  }
  .md\:text-48 {
    font-size: 48px;
  }
  .md\:text-56 {
    font-size: 56px;
  }
}
@media (min-width: 992px) {
  .lg\:text-10 {
    font-size: 10px;
  }
  .lg\:text-11 {
    font-size: 11px;
  }
  .lg\:text-12 {
    font-size: 12px;
  }
  .lg\:text-13 {
    font-size: 13px;
  }
  .lg\:text-14 {
    font-size: 14px;
  }
  .lg\:text-16 {
    font-size: 16px;
  }
  .lg\:text-18 {
    font-size: 18px;
  }
  .lg\:text-20 {
    font-size: 20px;
  }
  .lg\:text-22 {
    font-size: 22px;
  }
  .lg\:text-24 {
    font-size: 24px;
  }
  .lg\:text-28 {
    font-size: 28px;
  }
  .lg\:text-32 {
    font-size: 32px;
  }
  .lg\:text-40 {
    font-size: 40px;
  }
  .lg\:text-48 {
    font-size: 48px;
  }
  .lg\:text-56 {
    font-size: 56px;
  }
}
@media (min-width: 1200px) {
  .xl\:text-10 {
    font-size: 10px;
  }
  .xl\:text-11 {
    font-size: 11px;
  }
  .xl\:text-12 {
    font-size: 12px;
  }
  .xl\:text-13 {
    font-size: 13px;
  }
  .xl\:text-14 {
    font-size: 14px;
  }
  .xl\:text-16 {
    font-size: 16px;
  }
  .xl\:text-18 {
    font-size: 18px;
  }
  .xl\:text-20 {
    font-size: 20px;
  }
  .xl\:text-22 {
    font-size: 22px;
  }
  .xl\:text-24 {
    font-size: 24px;
  }
  .xl\:text-28 {
    font-size: 28px;
  }
  .xl\:text-32 {
    font-size: 32px;
  }
  .xl\:text-40 {
    font-size: 40px;
  }
  .xl\:text-48 {
    font-size: 48px;
  }
  .xl\:text-56 {
    font-size: 56px;
  }
}
@media (min-width: 1440px) {
  .xxl\:text-10 {
    font-size: 10px;
  }
  .xxl\:text-11 {
    font-size: 11px;
  }
  .xxl\:text-12 {
    font-size: 12px;
  }
  .xxl\:text-13 {
    font-size: 13px;
  }
  .xxl\:text-14 {
    font-size: 14px;
  }
  .xxl\:text-16 {
    font-size: 16px;
  }
  .xxl\:text-18 {
    font-size: 18px;
  }
  .xxl\:text-20 {
    font-size: 20px;
  }
  .xxl\:text-22 {
    font-size: 22px;
  }
  .xxl\:text-24 {
    font-size: 24px;
  }
  .xxl\:text-28 {
    font-size: 28px;
  }
  .xxl\:text-32 {
    font-size: 32px;
  }
  .xxl\:text-40 {
    font-size: 40px;
  }
  .xxl\:text-48 {
    font-size: 48px;
  }
  .xxl\:text-56 {
    font-size: 56px;
  }
}
.fw-light {
  font-weight: 300;
}

.fw-regular {
  font-weight: 400;
}

.fw-medium {
  font-weight: 500;
}

.fw-semibold {
  font-weight: 600;
}

.fw-bold {
  font-weight: 700;
}

.fw-extrabold {
  font-weight: 800;
}

.leading-none {
  line-height: 1;
}

.leading-tight {
  line-height: 1.2;
}

.leading-snug {
  line-height: 1.35;
}

.leading-normal {
  line-height: 1.5;
}

.leading-relaxed {
  line-height: 1.65;
}

.leading-loose {
  line-height: 2;
}

.text-10 {
  font-size: var(--font-size-10, 10px);
}

.text-11 {
  font-size: var(--font-size-11, 11px);
}

.text-12 {
  font-size: var(--font-size-12, 12px);
}

.text-13 {
  font-size: var(--font-size-13, 13px);
}

.text-14 {
  font-size: var(--font-size-14, 14px);
}

.text-16 {
  font-size: var(--font-size-16, 16px);
}

.text-18 {
  font-size: var(--font-size-18, 18px);
}

.text-20 {
  font-size: var(--font-size-20, 20px);
}

.text-22 {
  font-size: var(--font-size-22, 22px);
}

.text-24 {
  font-size: var(--font-size-24, 24px);
}

.text-28 {
  font-size: var(--font-size-28, 28px);
}

.text-32 {
  font-size: var(--font-size-32, 32px);
}

.text-40 {
  font-size: var(--font-size-40, 40px);
}

.text-48 {
  font-size: var(--font-size-48, 48px);
}

.text-56 {
  font-size: var(--font-size-56, 56px);
}

.font-light {
  font-weight: var(--font-weight-light, 300);
}

.font-regular {
  font-weight: var(--font-weight-regular, 400);
}

.font-medium {
  font-weight: var(--font-weight-medium, 500);
}

.font-semibold {
  font-weight: var(--font-weight-semibold, 600);
}

.font-bold {
  font-weight: var(--font-weight-bold, 700);
}

.font-extrabold {
  font-weight: var(--font-weight-extrabold, 800);
}

.leading-none {
  line-height: var(--line-height-none, 1);
}

.leading-tight {
  line-height: var(--line-height-tight, 1.2);
}

.leading-snug {
  line-height: var(--line-height-snug, 1.35);
}

.leading-normal {
  line-height: var(--line-height-normal, 1.5);
}

.leading-relaxed {
  line-height: var(--line-height-relaxed, 1.65);
}

.leading-loose {
  line-height: var(--line-height-loose, 2);
}

.tracking-tight {
  letter-spacing: -0.02em;
}

.tracking-normal {
  letter-spacing: 0;
}

.tracking-wide {
  letter-spacing: 0.02em;
}

.tracking-wider {
  letter-spacing: 0.05em;
}

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-justify {
  text-align: justify;
}

@media (min-width: 576px) {
  .sm\:text-left {
    text-align: left;
  }
  .sm\:text-center {
    text-align: center;
  }
  .sm\:text-right {
    text-align: right;
  }
  .sm\:text-justify {
    text-align: justify;
  }
}
@media (min-width: 768px) {
  .md\:text-left {
    text-align: left;
  }
  .md\:text-center {
    text-align: center;
  }
  .md\:text-right {
    text-align: right;
  }
  .md\:text-justify {
    text-align: justify;
  }
}
@media (min-width: 992px) {
  .lg\:text-left {
    text-align: left;
  }
  .lg\:text-center {
    text-align: center;
  }
  .lg\:text-right {
    text-align: right;
  }
  .lg\:text-justify {
    text-align: justify;
  }
}
@media (min-width: 1200px) {
  .xl\:text-left {
    text-align: left;
  }
  .xl\:text-center {
    text-align: center;
  }
  .xl\:text-right {
    text-align: right;
  }
  .xl\:text-justify {
    text-align: justify;
  }
}
@media (min-width: 1440px) {
  .xxl\:text-left {
    text-align: left;
  }
  .xxl\:text-center {
    text-align: center;
  }
  .xxl\:text-right {
    text-align: right;
  }
  .xxl\:text-justify {
    text-align: justify;
  }
}
.uppercase {
  text-transform: uppercase;
}

.lowercase {
  text-transform: lowercase;
}

.capitalize {
  text-transform: capitalize;
}

.normal-case {
  text-transform: none;
}

.underline {
  text-decoration: underline;
}

.line-through {
  text-decoration: line-through;
}

.no-underline {
  text-decoration: none;
}

.whitespace-normal {
  white-space: normal;
}

.whitespace-nowrap {
  white-space: nowrap;
}

.whitespace-pre {
  white-space: pre;
}

.whitespace-pre-line {
  white-space: pre-line;
}

.whitespace-pre-wrap {
  white-space: pre-wrap;
}

.break-words {
  overflow-wrap: break-word;
}

.break-all {
  word-break: break-all;
}

.truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.clamp-4 {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.clamp-7 {
  display: -webkit-box;
  -webkit-line-clamp: 7;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.font-sans {
  font-family: var(--font-sans);
}

.font-display {
  font-family: var(--font-display);
}

.font-mono {
  font-family: var(--font-mono);
}

.italic {
  font-style: italic;
}

.not-italic {
  font-style: normal;
}

.bg-gray-0 {
  background-color: var(--color-gray-0, #FFFFFF);
}

.bg-gray-10 {
  background-color: var(--color-gray-10, #F4F7FF);
}

.bg-gray-50 {
  background-color: var(--color-gray-50, #F8F9FC);
}

.bg-gray-100 {
  background-color: var(--color-gray-100, #F0F3FD);
}

.bg-gray-150 {
  background-color: var(--color-gray-150, #f4f5fa);
}

.bg-gray-200 {
  background-color: var(--color-gray-200, #D3DEEF);
}

.bg-gray-300 {
  background-color: var(--color-gray-300, #BCC9DF);
}

.bg-gray-400 {
  background-color: var(--color-gray-400, #A5B3C9);
}

.bg-gray-500 {
  background-color: var(--color-gray-500, #758199);
}

.bg-gray-600 {
  background-color: var(--color-gray-600, #596476);
}

.bg-gray-700 {
  background-color: var(--color-gray-700, #3D4451);
}

.bg-gray-800 {
  background-color: var(--color-gray-800, #222A39);
}

.bg-gray-900 {
  background-color: var(--color-gray-900, #141D2D);
}

.bg-purple-50 {
  background-color: var(--color-purple-50, #F3F5FF);
}

.bg-purple-100 {
  background-color: var(--color-purple-100, #EAECFF);
}

.bg-purple-150 {
  background-color: var(--color-purple-150, #e4e6fc);
}

.bg-purple-200 {
  background-color: var(--color-purple-200, #E4E5FF);
}

.bg-purple-300 {
  background-color: var(--color-purple-300, #E8E6FC);
}

.bg-purple-400 {
  background-color: var(--color-purple-400, #BBB4FD);
}

.bg-purple-800 {
  background-color: var(--color-purple-800, #6F61EA);
}

.bg-purple-900 {
  background-color: var(--color-purple-900, #6251E3);
}

.bg-pink-200 {
  background-color: var(--color-pink-200, #F8E6FF);
}

.bg-pink-400 {
  background-color: var(--color-pink-400, #F5C5F1);
}

.bg-pink-700 {
  background-color: var(--color-pink-700, #E82ED9);
}

.bg-pink-800 {
  background-color: var(--color-pink-800, #DA1BBE);
}

.bg-pink-900 {
  background-color: var(--color-pink-900, #CE0097);
}

.bg-red-200 {
  background-color: var(--color-red-200, #FFE4F0);
}

.bg-red-400 {
  background-color: var(--color-red-400, #FFCFEA);
}

.bg-red-500 {
  background-color: var(--color-red-500, #f7a9d5);
}

.bg-red-800 {
  background-color: var(--color-red-800, #FA3E93);
}

.bg-red-900 {
  background-color: var(--color-red-900, #EB267F);
}

.bg-green-50 {
  background-color: var(--color-green-50, #e8faf4);
}

.bg-green-100 {
  background-color: var(--color-green-100, #D8F8EE);
}

.bg-green-200 {
  background-color: var(--color-green-200, #B8EAE0);
}

.bg-green-600 {
  background-color: var(--color-green-600, #01B39E);
}

.bg-green-700 {
  background-color: var(--color-green-700, #0C9B99);
}

.bg-green-800 {
  background-color: var(--color-green-800, #128394);
}

.bg-yellow-100 {
  background-color: var(--color-yellow-100, #FEF7DC);
}

.bg-yellow-200 {
  background-color: var(--color-yellow-200, #EEE2D1);
}

.bg-yellow-300 {
  background-color: var(--color-yellow-300, #F7E08A);
}

.bg-yellow-600 {
  background-color: var(--color-yellow-600, #FDAF42);
}

.bg-yellow-900 {
  background-color: var(--color-yellow-900, #7A5B00);
}

.bg-blue-50 {
  background-color: var(--color-blue-50, #EFF6FF);
}

.bg-blue-100 {
  background-color: var(--color-blue-100, #DBEAFE);
}

.bg-blue-200 {
  background-color: var(--color-blue-200, #BFDBFE);
}

.bg-blue-400 {
  background-color: var(--color-blue-400, #60A5FA);
}

.bg-blue-600 {
  background-color: var(--color-blue-600, #2563EB);
}

.bg-blue-700 {
  background-color: var(--color-blue-700, #1D4ED8);
}

.bg-blue-800 {
  background-color: var(--color-blue-800, #1E40AF);
}

.bg-cyan-100 {
  background-color: var(--color-cyan-100, #CFFAFE);
}

.bg-cyan-200 {
  background-color: var(--color-cyan-200, #A5F3FC);
}

.bg-cyan-600 {
  background-color: var(--color-cyan-600, #0891B2);
}

.bg-cyan-900 {
  background-color: var(--color-cyan-900, #164E63);
}

.bg-black {
  background-color: var(--color-black, #000000);
}

.bg-transparent {
  background-color: var(--color-transparent, transparent);
}

.bg-primary {
  background-color: var(--color-primary, #6F61EA);
}

.bg-primary-hover {
  background-color: var(--color-primary-hover, #6251E3);
}

.bg-primary-soft {
  background-color: var(--color-primary-soft, #E4E5FF);
}

.bg-primary-soft-hover {
  background-color: var(--color-primary-soft-hover, #E8E6FC);
}

.bg-primary-softer {
  background-color: var(--color-primary-softer, #EAECFF);
}

.bg-primary-strong {
  background-color: var(--color-primary-strong, #BBB4FD);
}

.bg-secondary-softer {
  background-color: var(--color-secondary-softer, #F3F5FF);
}

.bg-text {
  background-color: var(--color-text, #222A39);
}

.bg-text-strong {
  background-color: var(--color-text-strong, #141D2D);
}

.bg-text-muted {
  background-color: var(--color-text-muted, #596476);
}

.bg-text-subtle {
  background-color: var(--color-text-subtle, #758199);
}

.bg-text-inverse {
  background-color: var(--color-text-inverse, #FFFFFF);
}

.bg-border {
  background-color: var(--color-border, #BCC9DF);
}

.bg-border-soft {
  background-color: var(--color-border-soft, #D3DEEF);
}

.bg-border-strong {
  background-color: var(--color-border-strong, #A5B3C9);
}

.bg-bg {
  background-color: var(--color-bg, #FFFFFF);
}

.bg-bg-soft {
  background-color: var(--color-bg-soft, #F0F3FD);
}

.bg-bg-page {
  background-color: var(--color-bg-page, #F4F7FF);
}

.bg-danger {
  background-color: var(--color-danger, #FA3E93);
}

.bg-danger-soft {
  background-color: var(--color-danger-soft, #FFE4F0);
}

.bg-danger-strong {
  background-color: var(--color-danger-strong, #EB267F);
}

.bg-info {
  background-color: var(--color-info, #2563EB);
}

.bg-info-soft {
  background-color: var(--color-info-soft, #DBEAFE);
}

.bg-info-strong {
  background-color: var(--color-info-strong, #1D4ED8);
}

.bg-success {
  background-color: var(--color-success, #0C9B99);
}

.bg-success-soft {
  background-color: var(--color-success-soft, #D8F8EE);
}

.bg-success-strong {
  background-color: var(--color-success-strong, #128394);
}

.bg-accent {
  background-color: var(--color-accent, #DA1BBE);
}

.bg-accent-soft {
  background-color: var(--color-accent-soft, #F8E6FF);
}

.text-gray-0 {
  color: var(--color-gray-0, #FFFFFF);
}

.text-gray-10 {
  color: var(--color-gray-10, #F4F7FF);
}

.text-gray-50 {
  color: var(--color-gray-50, #F8F9FC);
}

.text-gray-100 {
  color: var(--color-gray-100, #F0F3FD);
}

.text-gray-150 {
  color: var(--color-gray-150, #f4f5fa);
}

.text-gray-200 {
  color: var(--color-gray-200, #D3DEEF);
}

.text-gray-300 {
  color: var(--color-gray-300, #BCC9DF);
}

.text-gray-400 {
  color: var(--color-gray-400, #A5B3C9);
}

.text-gray-500 {
  color: var(--color-gray-500, #758199);
}

.text-gray-600 {
  color: var(--color-gray-600, #596476);
}

.text-gray-700 {
  color: var(--color-gray-700, #3D4451);
}

.text-gray-800 {
  color: var(--color-gray-800, #222A39);
}

.text-gray-900 {
  color: var(--color-gray-900, #141D2D);
}

.text-purple-50 {
  color: var(--color-purple-50, #F3F5FF);
}

.text-purple-100 {
  color: var(--color-purple-100, #EAECFF);
}

.text-purple-150 {
  color: var(--color-purple-150, #e4e6fc);
}

.text-purple-200 {
  color: var(--color-purple-200, #E4E5FF);
}

.text-purple-300 {
  color: var(--color-purple-300, #E8E6FC);
}

.text-purple-400 {
  color: var(--color-purple-400, #BBB4FD);
}

.text-purple-800 {
  color: var(--color-purple-800, #6F61EA);
}

.text-purple-900 {
  color: var(--color-purple-900, #6251E3);
}

.text-pink-200 {
  color: var(--color-pink-200, #F8E6FF);
}

.text-pink-400 {
  color: var(--color-pink-400, #F5C5F1);
}

.text-pink-700 {
  color: var(--color-pink-700, #E82ED9);
}

.text-pink-800 {
  color: var(--color-pink-800, #DA1BBE);
}

.text-pink-900 {
  color: var(--color-pink-900, #CE0097);
}

.text-red-200 {
  color: var(--color-red-200, #FFE4F0);
}

.text-red-400 {
  color: var(--color-red-400, #FFCFEA);
}

.text-red-500 {
  color: var(--color-red-500, #f7a9d5);
}

.text-red-800 {
  color: var(--color-red-800, #FA3E93);
}

.text-red-900 {
  color: var(--color-red-900, #EB267F);
}

.text-green-50 {
  color: var(--color-green-50, #e8faf4);
}

.text-green-100 {
  color: var(--color-green-100, #D8F8EE);
}

.text-green-200 {
  color: var(--color-green-200, #B8EAE0);
}

.text-green-600 {
  color: var(--color-green-600, #01B39E);
}

.text-green-700 {
  color: var(--color-green-700, #0C9B99);
}

.text-green-800 {
  color: var(--color-green-800, #128394);
}

.text-yellow-100 {
  color: var(--color-yellow-100, #FEF7DC);
}

.text-yellow-200 {
  color: var(--color-yellow-200, #EEE2D1);
}

.text-yellow-300 {
  color: var(--color-yellow-300, #F7E08A);
}

.text-yellow-600 {
  color: var(--color-yellow-600, #FDAF42);
}

.text-yellow-900 {
  color: var(--color-yellow-900, #7A5B00);
}

.text-blue-50 {
  color: var(--color-blue-50, #EFF6FF);
}

.text-blue-100 {
  color: var(--color-blue-100, #DBEAFE);
}

.text-blue-200 {
  color: var(--color-blue-200, #BFDBFE);
}

.text-blue-400 {
  color: var(--color-blue-400, #60A5FA);
}

.text-blue-600 {
  color: var(--color-blue-600, #2563EB);
}

.text-blue-700 {
  color: var(--color-blue-700, #1D4ED8);
}

.text-blue-800 {
  color: var(--color-blue-800, #1E40AF);
}

.text-cyan-100 {
  color: var(--color-cyan-100, #CFFAFE);
}

.text-cyan-200 {
  color: var(--color-cyan-200, #A5F3FC);
}

.text-cyan-600 {
  color: var(--color-cyan-600, #0891B2);
}

.text-cyan-900 {
  color: var(--color-cyan-900, #164E63);
}

.text-black {
  color: var(--color-black, #000000);
}

.text-transparent {
  color: var(--color-transparent, transparent);
}

.text-primary {
  color: var(--color-primary, #6F61EA);
}

.text-primary-hover {
  color: var(--color-primary-hover, #6251E3);
}

.text-primary-soft {
  color: var(--color-primary-soft, #E4E5FF);
}

.text-primary-soft-hover {
  color: var(--color-primary-soft-hover, #E8E6FC);
}

.text-primary-softer {
  color: var(--color-primary-softer, #EAECFF);
}

.text-primary-strong {
  color: var(--color-primary-strong, #BBB4FD);
}

.text-secondary-softer {
  color: var(--color-secondary-softer, #F3F5FF);
}

.text-text {
  color: var(--color-text, #222A39);
}

.text-text-strong {
  color: var(--color-text-strong, #141D2D);
}

.text-text-muted {
  color: var(--color-text-muted, #596476);
}

.text-text-subtle {
  color: var(--color-text-subtle, #758199);
}

.text-text-inverse {
  color: var(--color-text-inverse, #FFFFFF);
}

.text-border {
  color: var(--color-border, #BCC9DF);
}

.text-border-soft {
  color: var(--color-border-soft, #D3DEEF);
}

.text-border-strong {
  color: var(--color-border-strong, #A5B3C9);
}

.text-bg {
  color: var(--color-bg, #FFFFFF);
}

.text-bg-soft {
  color: var(--color-bg-soft, #F0F3FD);
}

.text-bg-page {
  color: var(--color-bg-page, #F4F7FF);
}

.text-danger {
  color: var(--color-danger, #FA3E93);
}

.text-danger-soft {
  color: var(--color-danger-soft, #FFE4F0);
}

.text-danger-strong {
  color: var(--color-danger-strong, #EB267F);
}

.text-info {
  color: var(--color-info, #2563EB);
}

.text-info-soft {
  color: var(--color-info-soft, #DBEAFE);
}

.text-info-strong {
  color: var(--color-info-strong, #1D4ED8);
}

.text-success {
  color: var(--color-success, #0C9B99);
}

.text-success-soft {
  color: var(--color-success-soft, #D8F8EE);
}

.text-success-strong {
  color: var(--color-success-strong, #128394);
}

.text-accent {
  color: var(--color-accent, #DA1BBE);
}

.text-accent-soft {
  color: var(--color-accent-soft, #F8E6FF);
}

.border-gray-0 {
  border-color: var(--color-gray-0, #FFFFFF);
}

.border-gray-10 {
  border-color: var(--color-gray-10, #F4F7FF);
}

.border-gray-50 {
  border-color: var(--color-gray-50, #F8F9FC);
}

.border-gray-100 {
  border-color: var(--color-gray-100, #F0F3FD);
}

.border-gray-150 {
  border-color: var(--color-gray-150, #f4f5fa);
}

.border-gray-200 {
  border-color: var(--color-gray-200, #D3DEEF);
}

.border-gray-300 {
  border-color: var(--color-gray-300, #BCC9DF);
}

.border-gray-400 {
  border-color: var(--color-gray-400, #A5B3C9);
}

.border-gray-500 {
  border-color: var(--color-gray-500, #758199);
}

.border-gray-600 {
  border-color: var(--color-gray-600, #596476);
}

.border-gray-700 {
  border-color: var(--color-gray-700, #3D4451);
}

.border-gray-800 {
  border-color: var(--color-gray-800, #222A39);
}

.border-gray-900 {
  border-color: var(--color-gray-900, #141D2D);
}

.border-purple-50 {
  border-color: var(--color-purple-50, #F3F5FF);
}

.border-purple-100 {
  border-color: var(--color-purple-100, #EAECFF);
}

.border-purple-150 {
  border-color: var(--color-purple-150, #e4e6fc);
}

.border-purple-200 {
  border-color: var(--color-purple-200, #E4E5FF);
}

.border-purple-300 {
  border-color: var(--color-purple-300, #E8E6FC);
}

.border-purple-400 {
  border-color: var(--color-purple-400, #BBB4FD);
}

.border-purple-800 {
  border-color: var(--color-purple-800, #6F61EA);
}

.border-purple-900 {
  border-color: var(--color-purple-900, #6251E3);
}

.border-pink-200 {
  border-color: var(--color-pink-200, #F8E6FF);
}

.border-pink-400 {
  border-color: var(--color-pink-400, #F5C5F1);
}

.border-pink-700 {
  border-color: var(--color-pink-700, #E82ED9);
}

.border-pink-800 {
  border-color: var(--color-pink-800, #DA1BBE);
}

.border-pink-900 {
  border-color: var(--color-pink-900, #CE0097);
}

.border-red-200 {
  border-color: var(--color-red-200, #FFE4F0);
}

.border-red-400 {
  border-color: var(--color-red-400, #FFCFEA);
}

.border-red-500 {
  border-color: var(--color-red-500, #f7a9d5);
}

.border-red-800 {
  border-color: var(--color-red-800, #FA3E93);
}

.border-red-900 {
  border-color: var(--color-red-900, #EB267F);
}

.border-green-50 {
  border-color: var(--color-green-50, #e8faf4);
}

.border-green-100 {
  border-color: var(--color-green-100, #D8F8EE);
}

.border-green-200 {
  border-color: var(--color-green-200, #B8EAE0);
}

.border-green-600 {
  border-color: var(--color-green-600, #01B39E);
}

.border-green-700 {
  border-color: var(--color-green-700, #0C9B99);
}

.border-green-800 {
  border-color: var(--color-green-800, #128394);
}

.border-yellow-100 {
  border-color: var(--color-yellow-100, #FEF7DC);
}

.border-yellow-200 {
  border-color: var(--color-yellow-200, #EEE2D1);
}

.border-yellow-300 {
  border-color: var(--color-yellow-300, #F7E08A);
}

.border-yellow-600 {
  border-color: var(--color-yellow-600, #FDAF42);
}

.border-yellow-900 {
  border-color: var(--color-yellow-900, #7A5B00);
}

.border-blue-50 {
  border-color: var(--color-blue-50, #EFF6FF);
}

.border-blue-100 {
  border-color: var(--color-blue-100, #DBEAFE);
}

.border-blue-200 {
  border-color: var(--color-blue-200, #BFDBFE);
}

.border-blue-400 {
  border-color: var(--color-blue-400, #60A5FA);
}

.border-blue-600 {
  border-color: var(--color-blue-600, #2563EB);
}

.border-blue-700 {
  border-color: var(--color-blue-700, #1D4ED8);
}

.border-blue-800 {
  border-color: var(--color-blue-800, #1E40AF);
}

.border-cyan-100 {
  border-color: var(--color-cyan-100, #CFFAFE);
}

.border-cyan-200 {
  border-color: var(--color-cyan-200, #A5F3FC);
}

.border-cyan-600 {
  border-color: var(--color-cyan-600, #0891B2);
}

.border-cyan-900 {
  border-color: var(--color-cyan-900, #164E63);
}

.border-black {
  border-color: var(--color-black, #000000);
}

.border-transparent {
  border-color: var(--color-transparent, transparent);
}

.border-primary {
  border-color: var(--color-primary, #6F61EA);
}

.border-primary-hover {
  border-color: var(--color-primary-hover, #6251E3);
}

.border-primary-soft {
  border-color: var(--color-primary-soft, #E4E5FF);
}

.border-primary-soft-hover {
  border-color: var(--color-primary-soft-hover, #E8E6FC);
}

.border-primary-softer {
  border-color: var(--color-primary-softer, #EAECFF);
}

.border-primary-strong {
  border-color: var(--color-primary-strong, #BBB4FD);
}

.border-secondary-softer {
  border-color: var(--color-secondary-softer, #F3F5FF);
}

.border-text {
  border-color: var(--color-text, #222A39);
}

.border-text-strong {
  border-color: var(--color-text-strong, #141D2D);
}

.border-text-muted {
  border-color: var(--color-text-muted, #596476);
}

.border-text-subtle {
  border-color: var(--color-text-subtle, #758199);
}

.border-text-inverse {
  border-color: var(--color-text-inverse, #FFFFFF);
}

.border-border {
  border-color: var(--color-border, #BCC9DF);
}

.border-border-soft {
  border-color: var(--color-border-soft, #D3DEEF);
}

.border-border-strong {
  border-color: var(--color-border-strong, #A5B3C9);
}

.border-bg {
  border-color: var(--color-bg, #FFFFFF);
}

.border-bg-soft {
  border-color: var(--color-bg-soft, #F0F3FD);
}

.border-bg-page {
  border-color: var(--color-bg-page, #F4F7FF);
}

.border-danger {
  border-color: var(--color-danger, #FA3E93);
}

.border-danger-soft {
  border-color: var(--color-danger-soft, #FFE4F0);
}

.border-danger-strong {
  border-color: var(--color-danger-strong, #EB267F);
}

.border-info {
  border-color: var(--color-info, #2563EB);
}

.border-info-soft {
  border-color: var(--color-info-soft, #DBEAFE);
}

.border-info-strong {
  border-color: var(--color-info-strong, #1D4ED8);
}

.border-success {
  border-color: var(--color-success, #0C9B99);
}

.border-success-soft {
  border-color: var(--color-success-soft, #D8F8EE);
}

.border-success-strong {
  border-color: var(--color-success-strong, #128394);
}

.border-accent {
  border-color: var(--color-accent, #DA1BBE);
}

.border-accent-soft {
  border-color: var(--color-accent-soft, #F8E6FF);
}

.opacity-0 {
  opacity: 0;
}

.opacity-10 {
  opacity: 0.1;
}

.opacity-20 {
  opacity: 0.2;
}

.opacity-30 {
  opacity: 0.3;
}

.opacity-40 {
  opacity: 0.4;
}

.opacity-50 {
  opacity: 0.5;
}

.opacity-60 {
  opacity: 0.6;
}

.opacity-70 {
  opacity: 0.7;
}

.opacity-80 {
  opacity: 0.8;
}

.opacity-90 {
  opacity: 0.9;
}

.opacity-100 {
  opacity: 1;
}

.red {
  color: var(--color-red-900);
}

.yellow {
  color: var(--color-yellow-600);
}

.green {
  color: var(--color-green-800);
}

.blue {
  color: var(--color-purple-900);
}

.purple {
  color: var(--color-red-800);
}

.black {
  color: var(--color-gray-900);
}

.d_green {
  color: var(--color-green-600);
}

.d_gray {
  background: var(--color-gray-500);
}

.gray {
  color: var(--color-gray-500);
}

.default_green {
  background: var(--color-green-600);
}

.default_pink {
  background: var(--color-red-800);
}

.rounded-0 {
  border-radius: 0;
}

.rounded-t-0 {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.rounded-r-0 {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.rounded-b-0 {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.rounded-l-0 {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.rounded-tl-0 {
  border-top-left-radius: 0;
}

.rounded-tr-0 {
  border-top-right-radius: 0;
}

.rounded-bl-0 {
  border-bottom-left-radius: 0;
}

.rounded-br-0 {
  border-bottom-right-radius: 0;
}

.rounded-4 {
  border-radius: 4px;
}

.rounded-t-4 {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.rounded-r-4 {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.rounded-b-4 {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.rounded-l-4 {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.rounded-tl-4 {
  border-top-left-radius: 4px;
}

.rounded-tr-4 {
  border-top-right-radius: 4px;
}

.rounded-bl-4 {
  border-bottom-left-radius: 4px;
}

.rounded-br-4 {
  border-bottom-right-radius: 4px;
}

.rounded-8 {
  border-radius: 8px;
}

.rounded-t-8 {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.rounded-r-8 {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}

.rounded-b-8 {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

.rounded-l-8 {
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}

.rounded-tl-8 {
  border-top-left-radius: 8px;
}

.rounded-tr-8 {
  border-top-right-radius: 8px;
}

.rounded-bl-8 {
  border-bottom-left-radius: 8px;
}

.rounded-br-8 {
  border-bottom-right-radius: 8px;
}

.rounded-10 {
  border-radius: 10px;
}

.rounded-t-10 {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.rounded-r-10 {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

.rounded-b-10 {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.rounded-l-10 {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}

.rounded-tl-10 {
  border-top-left-radius: 10px;
}

.rounded-tr-10 {
  border-top-right-radius: 10px;
}

.rounded-bl-10 {
  border-bottom-left-radius: 10px;
}

.rounded-br-10 {
  border-bottom-right-radius: 10px;
}

.rounded-12 {
  border-radius: 12px;
}

.rounded-t-12 {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.rounded-r-12 {
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
}

.rounded-b-12 {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.rounded-l-12 {
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}

.rounded-tl-12 {
  border-top-left-radius: 12px;
}

.rounded-tr-12 {
  border-top-right-radius: 12px;
}

.rounded-bl-12 {
  border-bottom-left-radius: 12px;
}

.rounded-br-12 {
  border-bottom-right-radius: 12px;
}

.rounded-14 {
  border-radius: 14px;
}

.rounded-t-14 {
  border-top-left-radius: 14px;
  border-top-right-radius: 14px;
}

.rounded-r-14 {
  border-top-right-radius: 14px;
  border-bottom-right-radius: 14px;
}

.rounded-b-14 {
  border-bottom-left-radius: 14px;
  border-bottom-right-radius: 14px;
}

.rounded-l-14 {
  border-top-left-radius: 14px;
  border-bottom-left-radius: 14px;
}

.rounded-tl-14 {
  border-top-left-radius: 14px;
}

.rounded-tr-14 {
  border-top-right-radius: 14px;
}

.rounded-bl-14 {
  border-bottom-left-radius: 14px;
}

.rounded-br-14 {
  border-bottom-right-radius: 14px;
}

.rounded-16 {
  border-radius: 16px;
}

.rounded-t-16 {
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
}

.rounded-r-16 {
  border-top-right-radius: 16px;
  border-bottom-right-radius: 16px;
}

.rounded-b-16 {
  border-bottom-left-radius: 16px;
  border-bottom-right-radius: 16px;
}

.rounded-l-16 {
  border-top-left-radius: 16px;
  border-bottom-left-radius: 16px;
}

.rounded-tl-16 {
  border-top-left-radius: 16px;
}

.rounded-tr-16 {
  border-top-right-radius: 16px;
}

.rounded-bl-16 {
  border-bottom-left-radius: 16px;
}

.rounded-br-16 {
  border-bottom-right-radius: 16px;
}

.rounded-20 {
  border-radius: 20px;
}

.rounded-t-20 {
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
}

.rounded-r-20 {
  border-top-right-radius: 20px;
  border-bottom-right-radius: 20px;
}

.rounded-b-20 {
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
}

.rounded-l-20 {
  border-top-left-radius: 20px;
  border-bottom-left-radius: 20px;
}

.rounded-tl-20 {
  border-top-left-radius: 20px;
}

.rounded-tr-20 {
  border-top-right-radius: 20px;
}

.rounded-bl-20 {
  border-bottom-left-radius: 20px;
}

.rounded-br-20 {
  border-bottom-right-radius: 20px;
}

.rounded-24 {
  border-radius: 24px;
}

.rounded-t-24 {
  border-top-left-radius: 24px;
  border-top-right-radius: 24px;
}

.rounded-r-24 {
  border-top-right-radius: 24px;
  border-bottom-right-radius: 24px;
}

.rounded-b-24 {
  border-bottom-left-radius: 24px;
  border-bottom-right-radius: 24px;
}

.rounded-l-24 {
  border-top-left-radius: 24px;
  border-bottom-left-radius: 24px;
}

.rounded-tl-24 {
  border-top-left-radius: 24px;
}

.rounded-tr-24 {
  border-top-right-radius: 24px;
}

.rounded-bl-24 {
  border-bottom-left-radius: 24px;
}

.rounded-br-24 {
  border-bottom-right-radius: 24px;
}

.rounded-26 {
  border-radius: 26px;
}

.rounded-t-26 {
  border-top-left-radius: 26px;
  border-top-right-radius: 26px;
}

.rounded-r-26 {
  border-top-right-radius: 26px;
  border-bottom-right-radius: 26px;
}

.rounded-b-26 {
  border-bottom-left-radius: 26px;
  border-bottom-right-radius: 26px;
}

.rounded-l-26 {
  border-top-left-radius: 26px;
  border-bottom-left-radius: 26px;
}

.rounded-tl-26 {
  border-top-left-radius: 26px;
}

.rounded-tr-26 {
  border-top-right-radius: 26px;
}

.rounded-bl-26 {
  border-bottom-left-radius: 26px;
}

.rounded-br-26 {
  border-bottom-right-radius: 26px;
}

.rounded-30 {
  border-radius: 30px;
}

.rounded-t-30 {
  border-top-left-radius: 30px;
  border-top-right-radius: 30px;
}

.rounded-r-30 {
  border-top-right-radius: 30px;
  border-bottom-right-radius: 30px;
}

.rounded-b-30 {
  border-bottom-left-radius: 30px;
  border-bottom-right-radius: 30px;
}

.rounded-l-30 {
  border-top-left-radius: 30px;
  border-bottom-left-radius: 30px;
}

.rounded-tl-30 {
  border-top-left-radius: 30px;
}

.rounded-tr-30 {
  border-top-right-radius: 30px;
}

.rounded-bl-30 {
  border-bottom-left-radius: 30px;
}

.rounded-br-30 {
  border-bottom-right-radius: 30px;
}

.rounded-40 {
  border-radius: 40px;
}

.rounded-t-40 {
  border-top-left-radius: 40px;
  border-top-right-radius: 40px;
}

.rounded-r-40 {
  border-top-right-radius: 40px;
  border-bottom-right-radius: 40px;
}

.rounded-b-40 {
  border-bottom-left-radius: 40px;
  border-bottom-right-radius: 40px;
}

.rounded-l-40 {
  border-top-left-radius: 40px;
  border-bottom-left-radius: 40px;
}

.rounded-tl-40 {
  border-top-left-radius: 40px;
}

.rounded-tr-40 {
  border-top-right-radius: 40px;
}

.rounded-bl-40 {
  border-bottom-left-radius: 40px;
}

.rounded-br-40 {
  border-bottom-right-radius: 40px;
}

.rounded-50 {
  border-radius: 50px;
}

.rounded-t-50 {
  border-top-left-radius: 50px;
  border-top-right-radius: 50px;
}

.rounded-r-50 {
  border-top-right-radius: 50px;
  border-bottom-right-radius: 50px;
}

.rounded-b-50 {
  border-bottom-left-radius: 50px;
  border-bottom-right-radius: 50px;
}

.rounded-l-50 {
  border-top-left-radius: 50px;
  border-bottom-left-radius: 50px;
}

.rounded-tl-50 {
  border-top-left-radius: 50px;
}

.rounded-tr-50 {
  border-top-right-radius: 50px;
}

.rounded-bl-50 {
  border-bottom-left-radius: 50px;
}

.rounded-br-50 {
  border-bottom-right-radius: 50px;
}

.rounded-full {
  border-radius: 9999px;
}

.rounded-t-full {
  border-top-left-radius: 9999px;
  border-top-right-radius: 9999px;
}

.rounded-r-full {
  border-top-right-radius: 9999px;
  border-bottom-right-radius: 9999px;
}

.rounded-b-full {
  border-bottom-left-radius: 9999px;
  border-bottom-right-radius: 9999px;
}

.rounded-l-full {
  border-top-left-radius: 9999px;
  border-bottom-left-radius: 9999px;
}

.rounded-tl-full {
  border-top-left-radius: 9999px;
}

.rounded-tr-full {
  border-top-right-radius: 9999px;
}

.rounded-bl-full {
  border-bottom-left-radius: 9999px;
}

.rounded-br-full {
  border-bottom-right-radius: 9999px;
}

.rounded {
  border-radius: var(--radius-12, 12px);
}

.border {
  border: 1px solid var(--color-border);
}

.border-w-0 {
  border-width: 0;
  border-style: solid;
}

.border-t-0 {
  border-top-width: 0;
  border-top-style: solid;
}

.border-r-0 {
  border-right-width: 0;
  border-right-style: solid;
}

.border-b-0 {
  border-bottom-width: 0;
  border-bottom-style: solid;
}

.border-l-0 {
  border-left-width: 0;
  border-left-style: solid;
}

.border-w-1 {
  border-width: 1px;
  border-style: solid;
}

.border-t-1 {
  border-top-width: 1px;
  border-top-style: solid;
}

.border-r-1 {
  border-right-width: 1px;
  border-right-style: solid;
}

.border-b-1 {
  border-bottom-width: 1px;
  border-bottom-style: solid;
}

.border-l-1 {
  border-left-width: 1px;
  border-left-style: solid;
}

.border-w-2 {
  border-width: 2px;
  border-style: solid;
}

.border-t-2 {
  border-top-width: 2px;
  border-top-style: solid;
}

.border-r-2 {
  border-right-width: 2px;
  border-right-style: solid;
}

.border-b-2 {
  border-bottom-width: 2px;
  border-bottom-style: solid;
}

.border-l-2 {
  border-left-width: 2px;
  border-left-style: solid;
}

.border-w-3 {
  border-width: 3px;
  border-style: solid;
}

.border-t-3 {
  border-top-width: 3px;
  border-top-style: solid;
}

.border-r-3 {
  border-right-width: 3px;
  border-right-style: solid;
}

.border-b-3 {
  border-bottom-width: 3px;
  border-bottom-style: solid;
}

.border-l-3 {
  border-left-width: 3px;
  border-left-style: solid;
}

.border-w-4 {
  border-width: 4px;
  border-style: solid;
}

.border-t-4 {
  border-top-width: 4px;
  border-top-style: solid;
}

.border-r-4 {
  border-right-width: 4px;
  border-right-style: solid;
}

.border-b-4 {
  border-bottom-width: 4px;
  border-bottom-style: solid;
}

.border-l-4 {
  border-left-width: 4px;
  border-left-style: solid;
}

.border-solid {
  border-style: solid;
}

.border-dashed {
  border-style: dashed;
}

.border-dotted {
  border-style: dotted;
}

.border-none {
  border-style: none;
}

.shadow-none {
  box-shadow: none;
}

.shadow-xs {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.shadow-sm {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06);
}

.shadow-md {
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}

.shadow-lg {
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

.shadow-xl {
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.12);
}

.shadow-dropdown {
  box-shadow: 0 18px 44px rgba(52, 66, 95, 0.1);
}

.shadow-hint {
  box-shadow: 0 8px 48px rgba(52, 66, 95, 0.2);
}

.shadow-focus {
  box-shadow: 0 0 0 3px rgba(111, 97, 234, 0.2);
}

.transition-fast {
  transition: all 0.15s ease;
}

.transition-base {
  transition: all 0.2s ease;
}

.transition-slow {
  transition: all 0.3s ease;
}

.transition-colors {
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.hover-scale {
  transition: transform 0.2s ease;
}

.hover-scale:hover {
  transform: scale(1.02);
}

.rotate-45 {
  transform: rotate(45deg);
}

.rotate-90 {
  transform: rotate(90deg);
}

.rotate-180 {
  transform: rotate(180deg);
}

.-rotate-45 {
  transform: rotate(-45deg);
}

.-rotate-90 {
  transform: rotate(-90deg);
}

.backdrop-blur-sm {
  backdrop-filter: blur(4px);
}

.backdrop-blur-md {
  backdrop-filter: blur(8px);
}

.backdrop-blur-lg {
  backdrop-filter: blur(16px);
}

.static {
  position: static;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.fixed {
  position: fixed;
}

.sticky {
  position: sticky;
}

@media (min-width: 576px) {
  .sm\:static {
    position: static;
  }
  .sm\:relative {
    position: relative;
  }
  .sm\:absolute {
    position: absolute;
  }
  .sm\:fixed {
    position: fixed;
  }
  .sm\:sticky {
    position: sticky;
  }
}
@media (min-width: 768px) {
  .md\:static {
    position: static;
  }
  .md\:relative {
    position: relative;
  }
  .md\:absolute {
    position: absolute;
  }
  .md\:fixed {
    position: fixed;
  }
  .md\:sticky {
    position: sticky;
  }
}
@media (min-width: 992px) {
  .lg\:static {
    position: static;
  }
  .lg\:relative {
    position: relative;
  }
  .lg\:absolute {
    position: absolute;
  }
  .lg\:fixed {
    position: fixed;
  }
  .lg\:sticky {
    position: sticky;
  }
}
@media (min-width: 1200px) {
  .xl\:static {
    position: static;
  }
  .xl\:relative {
    position: relative;
  }
  .xl\:absolute {
    position: absolute;
  }
  .xl\:fixed {
    position: fixed;
  }
  .xl\:sticky {
    position: sticky;
  }
}
@media (min-width: 1440px) {
  .xxl\:static {
    position: static;
  }
  .xxl\:relative {
    position: relative;
  }
  .xxl\:absolute {
    position: absolute;
  }
  .xxl\:fixed {
    position: fixed;
  }
  .xxl\:sticky {
    position: sticky;
  }
}
.top-0 {
  top: 0;
}

.right-0 {
  right: 0;
}

.bottom-0 {
  bottom: 0;
}

.left-0 {
  left: 0;
}

.top-2 {
  top: 2px;
}

.right-2 {
  right: 2px;
}

.bottom-2 {
  bottom: 2px;
}

.left-2 {
  left: 2px;
}

.top-4 {
  top: 4px;
}

.right-4 {
  right: 4px;
}

.bottom-4 {
  bottom: 4px;
}

.left-4 {
  left: 4px;
}

.top-6 {
  top: 6px;
}

.right-6 {
  right: 6px;
}

.bottom-6 {
  bottom: 6px;
}

.left-6 {
  left: 6px;
}

.top-8 {
  top: 8px;
}

.right-8 {
  right: 8px;
}

.bottom-8 {
  bottom: 8px;
}

.left-8 {
  left: 8px;
}

.top-10 {
  top: 10px;
}

.right-10 {
  right: 10px;
}

.bottom-10 {
  bottom: 10px;
}

.left-10 {
  left: 10px;
}

.top-12 {
  top: 12px;
}

.right-12 {
  right: 12px;
}

.bottom-12 {
  bottom: 12px;
}

.left-12 {
  left: 12px;
}

.top-14 {
  top: 14px;
}

.right-14 {
  right: 14px;
}

.bottom-14 {
  bottom: 14px;
}

.left-14 {
  left: 14px;
}

.top-16 {
  top: 16px;
}

.right-16 {
  right: 16px;
}

.bottom-16 {
  bottom: 16px;
}

.left-16 {
  left: 16px;
}

.top-20 {
  top: 20px;
}

.right-20 {
  right: 20px;
}

.bottom-20 {
  bottom: 20px;
}

.left-20 {
  left: 20px;
}

.top-24 {
  top: 24px;
}

.right-24 {
  right: 24px;
}

.bottom-24 {
  bottom: 24px;
}

.left-24 {
  left: 24px;
}

.top-28 {
  top: 28px;
}

.right-28 {
  right: 28px;
}

.bottom-28 {
  bottom: 28px;
}

.left-28 {
  left: 28px;
}

.top-30 {
  top: 30px;
}

.right-30 {
  right: 30px;
}

.bottom-30 {
  bottom: 30px;
}

.left-30 {
  left: 30px;
}

.top-32 {
  top: 32px;
}

.right-32 {
  right: 32px;
}

.bottom-32 {
  bottom: 32px;
}

.left-32 {
  left: 32px;
}

.top-40 {
  top: 40px;
}

.right-40 {
  right: 40px;
}

.bottom-40 {
  bottom: 40px;
}

.left-40 {
  left: 40px;
}

.top-48 {
  top: 48px;
}

.right-48 {
  right: 48px;
}

.bottom-48 {
  bottom: 48px;
}

.left-48 {
  left: 48px;
}

.top-56 {
  top: 56px;
}

.right-56 {
  right: 56px;
}

.bottom-56 {
  bottom: 56px;
}

.left-56 {
  left: 56px;
}

.top-64 {
  top: 64px;
}

.right-64 {
  right: 64px;
}

.bottom-64 {
  bottom: 64px;
}

.left-64 {
  left: 64px;
}

.top-80 {
  top: 80px;
}

.right-80 {
  right: 80px;
}

.bottom-80 {
  bottom: 80px;
}

.left-80 {
  left: 80px;
}

.top-96 {
  top: 96px;
}

.right-96 {
  right: 96px;
}

.bottom-96 {
  bottom: 96px;
}

.left-96 {
  left: 96px;
}

.top-120 {
  top: 120px;
}

.right-120 {
  right: 120px;
}

.bottom-120 {
  bottom: 120px;
}

.left-120 {
  left: 120px;
}

.top-auto {
  top: auto;
}

.right-auto {
  right: auto;
}

.bottom-auto {
  bottom: auto;
}

.left-auto {
  left: auto;
}

.inset-0 {
  inset: 0;
}

.inset-auto {
  inset: auto;
}

.z-hide {
  z-index: -1;
}

.z-base {
  z-index: 0;
}

.z-docked {
  z-index: 10;
}

.z-dropdown {
  z-index: 1000;
}

.z-sticky {
  z-index: 1100;
}

.z-overlay {
  z-index: 1200;
}

.z-modal {
  z-index: 9999999;
}

.z-popover {
  z-index: 1400;
}

.z-toast {
  z-index: 1500;
}

.z-tooltip {
  z-index: 1600;
}

/* end file: dist/main.css */