html {
  min-width: 320px;
  scroll-behavior: smooth;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  color: var(--hdt-text);
  background: var(--hdt-page);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body.admin-bar .hdt-header {
  top: 32px;
}

.hdt-main {
  min-height: calc(100vh - 145px);
}

.hdt-header {
  z-index: 1030;
  background-color: rgba(255, 255, 255, .94) !important;
  backdrop-filter: blur(18px);
}

.hdt-header .navbar {
  min-height: 72px;
}

.hdt-brand {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  color: var(--hdt-text);
}

.hdt-brand:hover {
  color: var(--hdt-text);
}

.hdt-brand__mark {
  width: 2.625rem;
  height: 2.625rem;
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 800;
  border-radius: .875rem;
  background: var(--hdt-primary);
}

.hdt-brand__text {
  display: grid;
  line-height: 1.15;
}

.hdt-brand__text small {
  margin-top: .2rem;
  color: var(--hdt-muted);
  font-size: .72rem;
}

.custom-logo {
  width: auto;
  max-height: 48px;
}

.navbar-nav .nav-link {
  color: var(--hdt-muted);
  font-weight: 600;
}

.navbar-nav .current-menu-item > .nav-link,
.navbar-nav .current_page_item > .nav-link,
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus {
  color: var(--hdt-text);
}

.hdt-panel {
  padding: 1.5rem;
  background: var(--hdt-surface);
  border: 1px solid var(--hdt-border);
  border-radius: var(--hdt-radius-lg);
  box-shadow: var(--hdt-shadow-sm);
}

.hdt-eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 1.75rem;
  padding: .25rem .65rem;
  color: var(--hdt-primary-hover);
  background: var(--hdt-primary-soft);
  border-radius: 999px;
  font-size: .76rem;
  font-weight: 800;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.btn {
  --bs-btn-border-radius: 999px;
  --bs-btn-padding-x: 1.1rem;
  --bs-btn-padding-y: .62rem;
  font-weight: 700;
}

.btn-primary {
  --bs-btn-bg: var(--hdt-primary);
  --bs-btn-border-color: var(--hdt-primary);
  --bs-btn-hover-bg: var(--hdt-primary-hover);
  --bs-btn-hover-border-color: var(--hdt-primary-hover);
  --bs-btn-active-bg: var(--hdt-primary-hover);
  --bs-btn-active-border-color: var(--hdt-primary-hover);
  box-shadow: 0 .5rem 1.25rem rgba(103, 95, 232, .2);
}

.form-control,
.form-select {
  min-height: 46px;
  border-radius: var(--hdt-radius-sm);
}

.form-control:focus,
.form-select:focus,
#hdt-login-form input[type="text"]:focus,
#hdt-login-form input[type="password"]:focus {
  border-color: var(--hdt-primary);
  box-shadow: 0 0 0 .25rem rgba(103, 95, 232, .16);
}

.hdt-auth {
  display: grid;
  align-items: center;
  min-height: calc(100vh - 145px);
}

.hdt-login-card {
  padding: clamp(1.5rem, 4vw, 2.25rem);
}

#hdt-login-form p {
  margin-bottom: 1rem;
}

#hdt-login-form label {
  display: block;
  margin-bottom: .4rem;
  font-size: .875rem;
  font-weight: 700;
}

#hdt-login-form input[type="text"],
#hdt-login-form input[type="password"] {
  width: 100%;
  min-height: 46px;
  padding: .65rem .85rem;
  color: var(--hdt-text);
  background: #fff;
  border: 1px solid var(--hdt-border);
  border-radius: var(--hdt-radius-sm);
  outline: none;
}

#hdt-login-form .login-remember label {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-weight: 500;
}

#hdt-login-form .button-primary {
  width: 100%;
  min-height: 44px;
  color: #fff;
  background: var(--hdt-primary);
  border: 1px solid var(--hdt-primary);
  border-radius: 999px;
  font-weight: 700;
}

.hdt-stat {
  min-height: 132px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 1.25rem;
  background: #fff;
  border: 1px solid var(--hdt-border);
  border-radius: var(--hdt-radius);
}

.hdt-stat__label {
  color: var(--hdt-muted);
  font-size: .875rem;
  font-weight: 650;
}

.hdt-stat__value {
  margin-top: 1rem;
  font-size: clamp(2rem, 4vw, 2.55rem);
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1;
}

.hdt-stat[data-stat="active"] {
  border-color: rgba(103, 95, 232, .3);
  background: linear-gradient(145deg, #fff 0%, var(--hdt-primary-soft) 100%);
}

.hdt-ticket-table > :not(caption) > * > * {
  padding: 1rem 1.25rem;
  border-bottom-color: var(--hdt-border);
}

.hdt-ticket-table thead th {
  color: var(--hdt-muted);
  background: #fafbfe;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.hdt-status {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  min-height: 28px;
  padding: .25rem .65rem;
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 800;
  white-space: nowrap;
}

.hdt-status::before {
  width: .42rem;
  height: .42rem;
  content: "";
  border-radius: 50%;
  background: currentColor;
}

.hdt-status--new {
  color: var(--hdt-info);
  background: var(--hdt-info-soft);
}

.hdt-status--progress {
  color: var(--hdt-primary-hover);
  background: var(--hdt-primary-soft);
}

.hdt-status--waiting {
  color: var(--hdt-warning);
  background: var(--hdt-warning-soft);
}

.hdt-status--done {
  color: var(--hdt-success);
  background: var(--hdt-success-soft);
}

.hdt-status--cancelled {
  color: var(--hdt-danger);
  background: var(--hdt-danger-soft);
}

.hdt-status--neutral {
  color: var(--hdt-muted);
  background: var(--hdt-surface-soft);
}

.hdt-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  color: var(--hdt-text);
  background: #fff;
  border: 1px solid var(--hdt-border);
  border-radius: var(--hdt-radius);
  text-decoration: none;
  transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease;
}

.hdt-action:hover {
  color: var(--hdt-text);
  border-color: rgba(103, 95, 232, .45);
  transform: translateY(-2px);
  box-shadow: var(--hdt-shadow-sm);
}

.hdt-action strong,
.hdt-action small {
  display: block;
}

.hdt-action small {
  margin-top: .2rem;
  color: var(--hdt-muted);
  font-size: .78rem;
}

.hdt-empty-state__icon {
  width: 3rem;
  height: 3rem;
  display: grid;
  place-items: center;
  margin: 0 auto 1rem;
  color: var(--hdt-primary-hover);
  background: var(--hdt-primary-soft);
  border-radius: 1rem;
  font-size: 1.5rem;
}

.entry-content img,
.wp-post-image {
  height: auto;
  border-radius: var(--hdt-radius);
}

.entry-content > *:last-child {
  margin-bottom: 0;
}

.hdt-footer .menu-item a {
  display: block;
  padding: .25rem .5rem;
  color: var(--hdt-muted);
  text-decoration: none;
}

.hdt-footer .menu-item a:hover {
  color: var(--hdt-text);
}

.hdt-skip-link:focus {
  position: fixed;
  top: .75rem;
  left: .75rem;
  z-index: 10000;
  padding: .75rem 1rem;
  color: #fff;
  background: var(--hdt-text);
  border-radius: .5rem;
}

@media (min-width: 992px) {
  .py-lg-6 {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
  }

  .hdt-navbar-collapse {
    display: flex !important;
  }
}

@media (max-width: 991.98px) {
  body.admin-bar .hdt-header {
    top: 46px;
  }

  .hdt-navbar-collapse {
    display: none;
    width: 100%;
    padding: .75rem 0 .25rem;
  }

  .hdt-navbar-collapse.is-open {
    display: block;
  }

  .hdt-navbar-collapse .navbar-nav {
    padding-top: .5rem;
    border-top: 1px solid var(--hdt-border);
  }
}

@media (max-width: 782px) {
  body.admin-bar .hdt-header {
    top: 46px;
  }
}

@media (max-width: 767.98px) {
  .hdt-panel {
    padding: 1.125rem;
    border-radius: var(--hdt-radius);
  }

  .hdt-ticket-table thead {
    display: none;
  }

  .hdt-ticket-table,
  .hdt-ticket-table tbody,
  .hdt-ticket-table tr,
  .hdt-ticket-table td {
    display: block;
    width: 100%;
  }

  .hdt-ticket-table tbody tr {
    padding: .75rem 1rem;
    border-bottom: 1px solid var(--hdt-border);
  }

  .hdt-ticket-table tbody tr:last-child {
    border-bottom: 0;
  }

  .hdt-ticket-table > :not(caption) > * > * {
    padding: .35rem 0;
    border: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
  }
}

/* Hotline DEPO 0.6: notification bell and unread markers. */
.hdt-header-tools {
  align-items: center;
  display: flex;
  min-height: 42px;
}

.hdt-notification-bell {
  align-items: center;
  border: 1px solid var(--hdt-border);
  border-radius: 999px;
  color: var(--hdt-text);
  display: inline-flex;
  height: 42px;
  justify-content: center;
  position: relative;
  text-decoration: none;
  width: 42px;
}

.hdt-notification-bell:hover,
.hdt-notification-bell:focus-visible {
  background: var(--hdt-primary-soft);
  border-color: var(--hdt-primary);
  color: var(--hdt-primary-hover);
}

.hdt-notification-bell__icon {
  font-size: 1.08rem;
  line-height: 1;
}

.hdt-notification-bell__count {
  align-items: center;
  background: #c53535;
  border: 2px solid #fff;
  border-radius: 999px;
  color: #fff;
  display: flex;
  font-size: .65rem;
  font-weight: 800;
  height: 20px;
  justify-content: center;
  min-width: 20px;
  padding: 0 4px;
  position: absolute;
  right: -5px;
  top: -5px;
}

.hdt-unread-inline {
  background: var(--hdt-primary-soft);
  border-radius: 999px;
  color: var(--hdt-primary-hover);
  font-size: .7rem;
  font-weight: 800;
  padding: .12rem .45rem;
}
