/* ../../common/ui-vue3/base.css */
@font-face {
  font-family: TTNorms;
  font-weight: bold;
  font-display: fallback;
  src:
    url("./TTNormsProBd-R42QQ3EW.woff2") format("woff2"),
    url("./TTNormsProBd-BZ4LE3QP.woff") format("woff"),
    url("./TTNormsProBd-FCA67RE6.ttf") format("truetype");
}
@font-face {
  font-family: TTNorms;
  font-weight: normal;
  font-display: fallback;
  src:
    url("./TTNormsProRg-PURETJVR.woff2") format("woff2"),
    url("./TTNormsProRg-6ATABX3A.woff") format("woff"),
    url("./TTNormsProRg-BJRDZDNK.ttf") format("truetype");
}
:root {
  --bg-color: #ffffff;
  --sidebar-bg: #707487;
  --sidebar-active-bg: rgba(255, 255, 255, 0.1);
  --text-primary: #1C1C1C;
  --text-secondary: #999BA8;
  --brand-color: #84C840;
  --border-color: #F0F0F0;
  --font-heading: TTNorms, sans-serif;
  --font-body: TTNorms, sans-serif;
  --bg: #FFFFFF;
  --bg-100: #FAFBFC;
  --bg-200: #F3F5F6;
  --black: #20222C;
  --grey-100: #F8F8F9;
  --grey-200: #F1F1F3;
  --grey-300: #E2E3E7;
  --grey-400: #C6C7CF;
  --grey-500: #A9ABB7;
  --grey-600: #8D909F;
  --grey-800: #6B6F81;
  --grey-900: #20222C;
  --green-300: #D3E4C1;
  --green-400: #9DC772;
  --green-500: #84C840;
  --green-600: #6AA033;
  --green-700: #507927;
  --green-800: #3F601F;
  --green-900: #304817;
  --orange-100: #FFFAF2;
  --orange-200: #FFECCE;
  --orange-300: #FFD491;
  --orange-400: #FFB647;
  --orange-500: #EB9005;
  --red-100: #FFF0EB;
  --red-500: #FF6A38;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  font-family: var(--font-body);
  background: var(--bg-color);
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
}

/* ../../common/ui-vue3/icons.css */
@font-face {
  font-family: DeskMeIcons2;
  font-weight: normal;
  font-display: block;
  font-style: normal;
  src:
    url("./DeskMeIcons2-BX7JIMWR.woff2") format("woff2"),
    url("./DeskMeIcons2-Q66TGERV.woff") format("woff"),
    url("./DeskMeIcons2-L4CDP26Q.ttf") format("truetype");
}
.icon {
  font-family: "DeskMeIcons2" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-user-s:before {
  content: "\f000";
}
.icon-user-m:before {
  content: "\f001";
}
.icon-table-s:before {
  content: "\f002";
}
.icon-table-m:before {
  content: "\f003";
}
.icon-sun-s:before {
  content: "\f004";
}
.icon-sun-m:before {
  content: "\f005";
}
.icon-sort-asc-s:before {
  content: "\f006";
}
.icon-sort-asc-m:before {
  content: "\f007";
}
.icon-settings-s:before {
  content: "\f008";
}
.icon-settings-m:before {
  content: "\f009";
}
.icon-search-s:before {
  content: "\f00a";
}
.icon-search-m:before {
  content: "\f00b";
}
.icon-refresh-s:before {
  content: "\f00c";
}
.icon-refresh-m:before {
  content: "\f00d";
}
.icon-question-s:before {
  content: "\f00e";
}
.icon-question-m:before {
  content: "\f00f";
}
.icon-previous-s:before {
  content: "\f010";
}
.icon-previous-m:before {
  content: "\f011";
}
.icon-chart-s:before {
  content: "\f012";
}
.icon-chart-m:before {
  content: "\f013";
}
.icon-plus-circle-s:before {
  content: "\f014";
}
.icon-plus-circle-m:before {
  content: "\f015";
}
.icon-plus-s:before {
  content: "\f016";
}
.icon-plus-m:before {
  content: "\f017";
}
.icon-place-s:before {
  content: "\f018";
}
.icon-place-m:before {
  content: "\f019";
}
.icon-office-s:before {
  content: "\f01a";
}
.icon-office-m:before {
  content: "\f01b";
}
.icon-notification-s:before {
  content: "\f01c";
}
.icon-notification-m:before {
  content: "\f01d";
}
.icon-notification-new-s:before {
  content: "\f01e";
}
.icon-notification-new-m:before {
  content: "\f01f";
}
.icon-next-s:before {
  content: "\f020";
}
.icon-next-m:before {
  content: "\f021";
}
.icon-more-s:before {
  content: "\f022";
}
.icon-more-m:before {
  content: "\f023";
}
.icon-menu-s:before {
  content: "\f024";
}
.icon-menu-m:before {
  content: "\f025";
}
.icon-logo-s:before {
  content: "\f026";
}
.icon-logo-m:before {
  content: "\f027";
}
.icon-lock-s:before {
  content: "\f028";
}
.icon-lock-m:before {
  content: "\f029";
}
.icon-group-s:before {
  content: "\f02a";
}
.icon-group-m:before {
  content: "\f02b";
}
.icon-forward-s:before {
  content: "\f02c";
}
.icon-forward-m:before {
  content: "\f02d";
}
.icon-floor-s:before {
  content: "\f02e";
}
.icon-floor-m:before {
  content: "\f02f";
}
.icon-first-aid-s:before {
  content: "\f030";
}
.icon-first-aid-m:before {
  content: "\f031";
}
.icon-filter-s:before {
  content: "\f032";
}
.icon-filter-m:before {
  content: "\f033";
}
.icon-external-link-s:before {
  content: "\f034";
}
.icon-external-link-m:before {
  content: "\f035";
}
.icon-export-s:before {
  content: "\f036";
}
.icon-export-m:before {
  content: "\f037";
}
.icon-envelope-s:before {
  content: "\f038";
}
.icon-envelope-m:before {
  content: "\f039";
}
.icon-edit-s:before {
  content: "\f03a";
}
.icon-edit-m:before {
  content: "\f03b";
}
.icon-disable-s:before {
  content: "\f03c";
}
.icon-disable-m:before {
  content: "\f03d";
}
.icon-delete-s:before {
  content: "\f03e";
}
.icon-delete-m:before {
  content: "\f03f";
}
.icon-cross-s:before {
  content: "\f040";
}
.icon-cross-m:before {
  content: "\f041";
}
.icon-copy-s:before {
  content: "\f042";
}
.icon-copy-m:before {
  content: "\f043";
}
.icon-cookie-s:before {
  content: "\f044";
}
.icon-cookie-m:before {
  content: "\f045";
}
.icon-coffee-s:before {
  content: "\f046";
}
.icon-coffee-m:before {
  content: "\f047";
}
.icon-chevron-up-s:before {
  content: "\f048";
}
.icon-chevron-up-m:before {
  content: "\f049";
}
.icon-chevron-down-s:before {
  content: "\f04a";
}
.icon-chevron-down-m:before {
  content: "\f04b";
}
.icon-check-s:before {
  content: "\f04c";
}
.icon-check-m:before {
  content: "\f04d";
}
.icon-calendar-s:before {
  content: "\f04e";
}
.icon-calendar-m:before {
  content: "\f04f";
}
.icon-cake-s:before {
  content: "\f050";
}
.icon-cake-m:before {
  content: "\f051";
}
.icon-button-s:before {
  content: "\f052";
}
.icon-button-m:before {
  content: "\f053";
}
.icon-back-s:before {
  content: "\f054";
}
.icon-back-m:before {
  content: "\f055";
}
.icon-back2-s:before {
  content: "\f056";
}
.icon-back2-m:before {
  content: "\f057";
}
.icon-dropdown-s:before {
  content: "\f058";
}
.icon-dropdown-m:before {
  content: "\f059";
}
.icon-sort-s:before {
  content: "\f05a";
}
.icon-sort-m:before {
  content: "\f05b";
}
.icon-right-s:before {
  content: "\f05c";
}
.icon-right-m:before {
  content: "\f05d";
}
.icon-left-s:before {
  content: "\f05e";
}
.icon-left-m:before {
  content: "\f05f";
}
.icon-add-s:before {
  content: "\f060";
}
.icon-add-m:before {
  content: "\f061";
}

/* client/global.css */
* {
  margin: 0;
  padding: 0;
}
#app {
  width: 100%;
  min-height: 100vh;
}
.app-container {
  width: 100%;
  min-height: 100vh;
}

/* ../../node_modules/@deskme/ui-vue3/components/button.css */
button {
  color: var(--bg);
  background: var(--green-500);
  border: none;
  cursor: pointer;
}
button:hover {
  background: var(--green-600);
}
button:disabled {
  color: var(--grey-600);
  background: var(--grey-200);
  cursor: not-allowed;
}
button.L {
  padding: 16px;
  font-size: 18px;
  line-height: 24px;
  border-radius: 12px;
}
button.M {
  padding: 14px;
  font-size: 16px;
  line-height: 20px;
  border-radius: 10px;
}
button.S {
  padding: 8px 12px;
  font-size: 14px;
  line-height: 20px;
  border-radius: 8px;
}
button:focus {
  outline: none;
  border: none;
  box-shadow: 0px 0px 0px 3px rgba(132, 200, 64, 0.1);
}
button.block {
  display: block;
  width: 100%;
}
button.inline {
  display: inline-block;
}

/* ../../node_modules/@deskme/ui-vue3/components/card.css */
.card {
  background: white;
  border: 1px solid var(--border-color);
  border-radius: 16px;
  padding: 20px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}
.card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 20px;
}
.card-title-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.card-name {
  font-size: 18px;
}
.card .card-name {
  font-weight: bold;
  color: var(--text-primary);
  display: flex;
  align-items: center;
  gap: 8px;
}
.card-subtitle {
  font-size: 14px;
  color: var(--text-secondary);
}
.card-action {
  color: var(--text-secondary);
  cursor: pointer;
  padding: 4px;
  font-size: 18px;
}
.card-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.card-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  font-size: 15px;
  line-height: 1.4;
}
.card-label {
  color: var(--text-secondary);
  flex-shrink: 0;
  width: 120px;
}
.card-value {
  font-weight: 500;
  color: var(--text-primary);
  text-align: right;
  word-break: break-word;
}
.card-divider {
  height: 1px;
  background: #F5F5F7;
  margin: 8px 0;
}

/* client/pages/redirect-page.css */
.redirect-page-container {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 20px;
  background: var(--bg-100);
}
.redirect-card {
  width: 100%;
  max-width: 450px;
}
.animate-in {
  animation: slideUp 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes slideUp {
  from {
    transform: translateY(40px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
.loading-content {
  display: flex;
  justify-content: center;
  padding: 40px 0;
}
.spinner {
  width: 32px;
  height: 32px;
  border: 3px solid var(--grey-200);
  border-top: 3px solid var(--brand-color);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.code-options {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-bottom: 24px;
}
.hint {
  font-size: 14px;
  color: var(--text-secondary);
  line-height: 1.6;
  text-align: center;
}
.badge {
  background: var(--border-color);
  color: var(--text-primary);
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  margin-right: 4px;
}
.error-content {
  text-align: center;
}
.error-icon {
  font-size: 48px;
  color: var(--red-500);
  margin-bottom: 24px;
  display: block;
}
.error-message {
  color: var(--text-secondary);
  margin-bottom: 32px;
  font-size: 16px;
}
.actions {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.return-link {
  display: inline-block;
  color: var(--text-secondary);
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  transition: color 0.2s;
  margin-top: 8px;
}
.return-link:hover {
  color: var(--text-primary);
}
.success-content {
  text-align: center;
  padding: 20px 0;
}
.success-icon {
  font-size: 48px;
  color: var(--green-500);
  margin-bottom: 24px;
  display: block;
}
.success-content p {
  color: var(--text-secondary);
  margin-bottom: 32px;
  font-size: 16px;
  line-height: 1.5;
}

/* ../../node_modules/@deskme/ui-vue3/components/textbox.css */
.input {
  padding: 18px 24px 18px 16px;
  border-radius: 12px;
  margin-bottom: 12px;
  border: 1px solid var(--grey-300);
  background: var(--bg);
}
.with-label {
  position: relative;
}
.input:not(:placeholder-shown),
.input:focus {
  padding-top: 28px;
  padding-bottom: 8px;
}
.input:not(:placeholder-shown) + label,
.input:focus + label {
  display: block;
  position: absolute;
  top: 8px;
  left: 16px;
  color: #999999;
  font-size: 12px;
  line-height: 16px;
}
.input:focus {
  outline: none;
  border-color: var(--green-500);
}
.input:focus + label {
  color: var(--grey-600);
}
::placeholder {
  color: var(--grey-600);
}
.input:focus::placeholder {
  color: transparent;
}
.input:not(:focus):not(:placeholder-shown):invalid {
  border-color: #FFE1D7;
}

/* ../../node_modules/@deskme/ui-vue3/components/checkbox.css */
.form-control.checkbox {
  position: relative;
  margin-left: 24px;
}
input[type=checkbox] {
  -webkit-appearance: none;
  appearance: none;
  background: var(--bg);
  border: 1px solid var(--grey-500);
  height: 14px;
  width: 14px;
  display: inline-block;
  border-radius: 4px;
  vertical-align: top;
  position: absolute;
  margin-left: -20px;
}
input[type=checkbox]:before {
  content: "";
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  overflow: hidden;
}
input[type=checkbox]:checked {
  background: var(--green-500);
  border: 1px solid var(--green-500);
}
input[type=checkbox]:checked::before {
  border-right: 1px solid var(--bg);
  border-bottom: 1px solid var(--bg);
  height: 50%;
  width: 25%;
  transform: rotate(40deg) translateY(-20%) translateX(-15%);
}
input[type=checkbox]:not(:checked) + label {
  color: var(--grey-800);
}

/* ../../node_modules/@deskme/ui-vue3/components/deskme-logo.css */
a.logo {
  text-decoration: none;
  color: #040404;
  line-height: 42px;
}
.logo img {
  display: inline-block;
  vertical-align: middle;
}
.logo span {
  display: inline-block;
  vertical-align: middle;
  font-size: 18px;
  line-height: 18px;
  letter-spacing: -1px;
  margin-left: 8px;
  padding-top: 7px;
  padding-bottom: 7px;
}

/* client/pages/login-page.css */
.login-page-container {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 20px;
  background: var(--grey-100);
}
.api-login-card {
  width: 100%;
  max-width: 400px;
  border: none !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.05) !important;
}
.api-login-card .card-action {
  display: none;
}
.api-login-card .card-name {
  font-size: 18px;
  font-weight: 700;
  color: var(--text-primary);
}
.login-content {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding: 8px 0;
}
.logo-wrapper {
  display: flex;
  justify-content: center;
  margin-bottom: 12px;
}
.logo-wrapper .logo {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: var(--text-primary);
  font-size: 24px;
  font-weight: 700;
}
.login-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.social-login {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.social-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 16px;
  border: none;
  border-radius: 12px;
  background: var(--grey-100);
  color: var(--black);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s;
  width: 100%;
}
.social-btn:hover {
  background: var(--grey-200);
}
.social-icon {
  flex-shrink: 0;
  object-fit: contain;
}
.login-separator {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 4px 0;
}
.login-separator .text {
  color: var(--grey-800);
  font-size: 16px;
}
.email-login-section {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.email-login-section .with-label .input {
  margin-bottom: 0;
  width: 100%;
  border-radius: 12px;
  padding: 18px 16px;
}
.status-message {
  text-align: center;
  padding: 16px;
  border-radius: 8px;
}
.status-message.error {
  background: var(--red-100);
  color: var(--red-500);
}
.status-message.success {
  background: var(--green-300);
  color: var(--green-900);
}
.verification-code {
  font-size: 32px;
  font-weight: 700;
  margin: 16px 0;
  letter-spacing: 4px;
  color: var(--text-primary);
}
.small-hint {
  font-size: 14px;
  color: var(--text-secondary);
  margin-bottom: 16px;
}
.login-consent-wrapper {
  margin-top: 12px;
  padding: 16px;
  background: var(--grey-100);
  border-radius: 8px;
  font-size: 14px;
}
.login-consent-wrapper.flash {
  outline: 2px solid var(--red-500);
  animation: flash-shake 0.4s ease-in-out;
}
@keyframes flash-shake {
  0%, 100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-4px);
  }
  75% {
    transform: translateX(4px);
  }
}
@keyframes slideUp {
  from {
    transform: translateY(40px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
.animate-in {
  animation: slideUp 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.subdomain-entry {
  display: flex;
  flex-direction: column;
  gap: 16px;
  text-align: center;
}
.subdomain-entry h3 {
  font-size: 18px;
  margin: 0;
  color: var(--text-primary);
}
.subdomain-input-wrapper {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--grey-100);
  padding: 8px 16px;
  border-radius: 12px;
}
.subdomain-input-wrapper .input {
  margin-bottom: 0;
}
.subdomain-input-wrapper span {
  font-size: 16px;
  color: var(--text-secondary);
  font-weight: 600;
}

/* client/pages/logout-page.css */
.logout-page-container {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 20px;
  background: var(--bg-100);
}
.logout-card {
  width: 100%;
  max-width: 450px;
}
.animate-in {
  animation: slideUp 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes slideUp {
  from {
    transform: translateY(40px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}
.logout-content {
  text-align: center;
  padding: 20px 0;
}
.logout-icon {
  font-size: 48px;
  color: var(--green-500);
  margin-bottom: 24px;
  display: block;
}
.logout-content p {
  color: var(--text-secondary);
  margin-bottom: 32px;
  font-size: 16px;
  line-height: 1.5;
}