:root {
  --tk-black: #050505;
  --tk-topbar-control: #242424;
  --tk-topbar-border: #3b3b3b;
  --tk-app-bg: #f1f1f1;
  --tk-sidebar-bg: #ebebeb;
  --tk-surface: #ffffff;
  --tk-surface-soft: #f7f7f7;
  --tk-border: #dcdcdc;
  --tk-border-strong: #c7c7c7;
  --tk-text: #303030;
  --tk-muted: #616161;
  --tk-subtle: #8a8a8a;
  --tk-green: #abefc6;
  --tk-yellow: #ffeb78;
  --tk-blue: #2eb7d5;
  --tk-purple: #3f13a4;
  --tk-radius-sm: 8px;
  --tk-radius: 12px;
  --tk-shadow-card: 0 1px 0 rgba(0, 0, 0, .08), 0 1px 2px rgba(0, 0, 0, .06);
  --tk-font: Inter, -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.tk-dashboard-pos-help {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  margin-bottom: 14px;
  border-color: #e2c768;
  background: #fffaf0;
}
.tk-dashboard-pos-help > div:nth-child(2) { flex: 1; }
.tk-dashboard-pos-help strong,
.tk-dashboard-pos-help span { display: block; }
.tk-dashboard-pos-help span { color: var(--tk-muted); }

* {
  box-sizing: border-box;
}

body {
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  background: var(--tk-app-bg);
  color: var(--tk-text);
  font-family: var(--tk-font);
  font-size: 13px;
  line-height: 1.45;
}

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

.tk-topbar {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 40;
  display: grid;
  grid-template-columns: 240px minmax(240px, 640px) 1fr;
  align-items: center;
  height: 56px;
  padding: 0 8px 0 20px;
  background: var(--tk-black);
  color: #f7f7f7;
  gap: 16px;
}

.tk-brand,
.tk-top-actions,
.tk-user-btn,
.tk-search,
.tk-icon-btn {
  display: flex;
  align-items: center;
}

.tk-brand {
  gap: 8px;
  font-size: 21px;
  font-style: italic;
  letter-spacing: 0;
}

.tk-bag {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 0;
  border-radius: 9px;
  background: var(--tk-purple);
  color: #ffffff;
  padding: 0;
  font: inherit;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  line-height: 1;
}

.tk-bag:hover,
.tk-bag:focus-visible {
  background: #4a18bd;
  color: #ffffff;
}

.tk-bag:focus-visible {
  outline: 2px solid #b9a4ff;
  outline-offset: 2px;
}

.tk-search-shell {
  position: absolute;
  left: 50%;
  width: min(640px, calc(100vw - 560px));
  transform: translateX(-50%);
}

.tk-search {
  width: 100%;
  justify-content: space-between;
  height: 36px;
  padding: 0 10px 0 13px;
  border: 1px solid var(--tk-topbar-border);
  border-radius: var(--tk-radius);
  background: var(--tk-topbar-control);
  color: #dcdcdc;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}

.tk-search input {
  flex: 1;
  min-width: 0;
  height: 34px;
  margin-left: 8px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #f1f1f1;
  text-align: left;
}

.tk-search input::placeholder {
  color: #dcdcdc;
}

.tk-search button {
  display: grid;
  flex: 0 0 28px;
  height: 28px;
  place-items: center;
  border: 0;
  background: transparent;
  color: #b5b5b5;
}

.tk-search kbd {
  padding: 1px 5px;
  border-radius: 6px;
  background: #303030;
  color: #b5b5b5;
  font-size: 12px;
}

.tk-top-actions {
  grid-column: 3;
  justify-content: flex-end;
  gap: 8px;
}

.tk-icon-btn {
  height: 36px;
  border: 0;
  border-radius: var(--tk-radius);
  background: transparent;
  color: #dcdcdc;
}

.tk-icon-btn {
  justify-content: center;
  width: 36px;
  font-size: 16px;
}

.tk-icon-btn:hover {
  background: #1c1c1c;
}
.tk-pos-help-top { position: relative; }
.tk-pos-help-top > span { position: absolute; top: 1px; right: 0; min-width: 16px; height: 16px; padding: 0 4px; display: grid; place-items: center; border: 2px solid var(--tk-black); border-radius: 999px; background: #e5484d; color: #fff; font-size: 9px; font-weight: 750; line-height: 1; }
.tk-pos-help-top > span[hidden] { display: none; }
.tk-pos-help-top.has-pending > span { animation: tk-pos-help-pulse 1.35s ease-in-out infinite; }
@keyframes tk-pos-help-pulse {
  0%,100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(229,72,77,.5); }
  50% { transform: scale(1.08); box-shadow: 0 0 0 5px rgba(229,72,77,0); }
}
@media (prefers-reduced-motion: reduce) { .tk-pos-help-top.has-pending > span { animation: none; } }

.tk-user-menu {
  position: relative;
}

.tk-user-btn {
  max-width: 240px;
  height: 36px;
  gap: 8px;
  padding: 0 9px 0 4px;
  border: 0;
  border-radius: var(--tk-radius);
  background: transparent;
  color: #f3f3f3;
}

.tk-user-btn:hover,
.tk-user-btn[aria-expanded="true"] {
  background: #1c1c1c;
}

.tk-user-btn span,
.tk-user-dropdown-head > span,
.tk-profile-avatar {
  display: grid;
  place-items: center;
  border-radius: 9px;
  background: var(--tk-purple);
  color: #ffffff;
  font-weight: 800;
}

.tk-user-btn span {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  font-size: 12px;
}

.tk-user-btn strong {
  max-width: 158px;
  overflow: hidden;
  font-size: 13px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-user-btn i {
  color: #b8b8b8;
  font-size: 11px;
}

.tk-user-dropdown {
  width: 286px;
  padding: 6px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .22);
}

.tk-user-dropdown-head {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 8px;
}

.tk-user-dropdown-head > span {
  width: 36px;
  height: 36px;
  font-size: 13px;
}

.tk-user-dropdown-head div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.tk-user-dropdown-head strong,
.tk-user-dropdown-head small,
.tk-user-context strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-user-dropdown-head strong {
  color: var(--tk-text);
  font-size: 13px;
}

.tk-user-dropdown-head small,
.tk-user-context small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-user-context {
  display: grid;
  gap: 2px;
  margin: 2px 4px 6px;
  padding: 8px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #f7f7f7;
}

.tk-user-context strong {
  color: var(--tk-text);
  font-size: 13px;
}

.tk-user-dropdown .dropdown-item {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  border-radius: var(--tk-radius-sm);
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 650;
}

.tk-user-dropdown .dropdown-item:hover {
  background: #f1f1f1;
}

.tk-user-dropdown .dropdown-item.danger {
  color: #b42318;
}

.tk-profile-card {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  gap: 16px;
  max-width: 720px;
  padding: 18px;
}

.tk-profile-avatar {
  width: 56px;
  height: 56px;
  font-size: 20px;
}

.tk-profile-info h2 {
  margin: 0;
  color: var(--tk-text);
  font-size: 18px;
  font-weight: 800;
}

.tk-profile-info p {
  margin: 3px 0 14px;
  color: var(--tk-muted);
}

.tk-profile-info dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.tk-profile-info dl div {
  padding: 10px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #fafafa;
}

.tk-profile-info dt {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-profile-info dd {
  margin: 2px 0 0;
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 700;
}

.tk-sidebar {
  position: fixed;
  z-index: 30;
  inset: 56px auto 0 0;
  display: flex;
  flex-direction: column;
  width: 240px;
  padding: 10px 10px 14px;
  background: var(--tk-sidebar-bg);
  color: var(--tk-text);
}

.tk-sidebar {
  overflow-y: auto;
  transition: width .18s ease, padding .18s ease, transform .18s ease;
}

.tk-sidebar-backdrop {
  display: none;
}

.tk-nav,
.tk-nav-section {
  display: grid;
}

.tk-nav-section {
  margin-top: 10px;
}

.tk-nav-item {
  display: grid;
  grid-template-columns: 22px 1fr auto;
  align-items: center;
  min-height: 26px;
  padding: 2px 8px;
  border-radius: var(--tk-radius-sm);
  color: var(--tk-text);
  font-weight: 500;
  gap: 4px;
}

.tk-nav-item i {
  color: #505050;
  font-size: 15px;
}

.tk-nav-item.active,
.tk-nav-item:hover {
  background: #ffffff;
}

.tk-nav-entry {
  position: relative;
}

.tk-nav-entry.has-children > .tk-nav-item {
  padding-right: 30px;
}

.tk-nav-expander {
  position: absolute;
  top: 0;
  right: 2px;
  display: grid;
  width: 26px;
  height: 26px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #616161;
}

.tk-nav-expander:hover {
  background: #e5e5e5;
}

.tk-nav-expander i {
  font-size: 11px;
  transition: transform .16s ease;
}

.tk-nav-entry.is-open > .tk-nav-expander i {
  transform: rotate(90deg);
}

.tk-nav-children {
  position: relative;
  display: grid;
  max-height: 0;
  margin-left: 19px;
  overflow: hidden;
  opacity: 0;
  transition: max-height .2s ease, opacity .15s ease;
}

.tk-nav-children::before {
  position: absolute;
  top: 0;
  bottom: 13px;
  left: 2px;
  width: 1px;
  background: #c7c7c7;
  content: '';
}

.tk-nav-entry.is-open > .tk-nav-children {
  max-height: 180px;
  opacity: 1;
}

.tk-nav-child {
  position: relative;
  min-height: 26px;
  padding: 4px 8px 4px 20px;
  border-radius: var(--tk-radius-sm);
  color: #616161;
  font-size: 13px;
  font-weight: 500;
}

.tk-nav-child::before {
  position: absolute;
  top: 0;
  left: 2px;
  width: 12px;
  height: 14px;
  border-bottom: 1px solid #c7c7c7;
  border-left: 1px solid #c7c7c7;
  border-radius: 0 0 0 7px;
  content: '';
}

.tk-nav-child:hover,
.tk-nav-child.active {
  background: #ffffff;
  color: var(--tk-text);
}

.tk-count {
  min-width: 22px;
  padding: 1px 7px;
  border-radius: 999px;
  background: #dedede;
  color: var(--tk-muted);
  text-align: center;
}

.tk-section-title {
  display: block;
  height: 24px;
  padding: 6px 8px 3px;
  color: var(--tk-muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
}

.tk-sidebar-collapse {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 0;
  border-radius: var(--tk-radius-sm);
  background: transparent;
  color: var(--tk-muted);
  transition: background .15s ease, color .15s ease, transform .18s ease;
}

.tk-sidebar-collapse:hover {
  background: #ffffff;
}

.tk-sidebar-collapse i {
  transition: transform .18s ease;
}

.tk-settings {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: auto;
  min-height: 30px;
  padding: 4px 8px;
  border-radius: var(--tk-radius-sm);
  font-weight: 600;
}

.tk-settings:hover {
  background: #ffffff;
}

.tk-main {
  min-height: 100vh;
  padding: 72px 24px 32px 264px;
  transition: padding-left .18s ease;
}

body.tk-sidebar-collapsed .tk-sidebar {
  width: 68px;
  padding-right: 8px;
  padding-left: 8px;
}

body.tk-sidebar-collapsed .tk-sidebar .sidebar-top {
  gap: 4px !important;
}

body.tk-sidebar-collapsed .tk-sidebar .tk-nav-item {
  grid-template-columns: 1fr;
  justify-items: center;
  padding-right: 0;
  padding-left: 0;
}

body.tk-sidebar-collapsed .tk-sidebar .tk-nav-item span,
body.tk-sidebar-collapsed .tk-sidebar .tk-section-title,
body.tk-sidebar-collapsed .tk-sidebar .tk-settings span,
body.tk-sidebar-collapsed .tk-sidebar .tk-count,
body.tk-sidebar-collapsed .tk-sidebar .tk-nav-expander,
body.tk-sidebar-collapsed .tk-sidebar .tk-nav-children {
  display: none;
}

body.tk-sidebar-collapsed .tk-sidebar .tk-settings {
  justify-content: center;
  padding-right: 0;
  padding-left: 0;
}

body.tk-sidebar-collapsed .tk-sidebar-collapse {
  background: #ffffff;
}

body.tk-sidebar-collapsed .tk-sidebar-collapse i {
  transform: rotate(180deg);
}

body.tk-sidebar-collapsed .tk-main {
  padding-left: 92px;
}

.tk-page-narrow {
  width: min(100%, 796px);
  margin: 0 auto;
}

.tk-page-wide {
  width: 100%;
  margin: 0 auto;
}

.tk-page-wide .tk-table-card {
  width: 100%;
}

.tk-dashboard .tk-page-header {
  align-items: flex-end;
  margin-bottom: 16px;
}

.tk-dashboard .tk-page-header p {
  margin: 4px 0 0;
  color: var(--tk-muted);
}

.tk-dashboard-toolbar .tk-dashboard-store {
  flex: 0 0 260px;
  width: 260px;
  min-width: 0;
}

.tk-dashboard-store-input {
  display: grid;
  align-items: center;
  grid-template-columns: 18px 1fr 14px;
  min-height: 36px;
  gap: 8px;
  padding: 0 10px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #fff;
  box-shadow: var(--tk-shadow-card);
}

.tk-dashboard-store-input input {
  min-width: 0;
  border: 0;
  outline: 0;
}

.tk-dashboard-toolbar {
  display: flex;
  align-items: center;
  min-height: 38px;
  gap: 10px;
  margin-bottom: 12px;
}

.tk-dashboard-toolbar .tk-filter-popover {
  flex: 0 0 auto;
}

.tk-dashboard-toolbar .tk-filter-popover > summary {
  min-width: 210px;
  white-space: nowrap;
}

.tk-dashboard-toolbar > strong { font-size: 14px; }
.tk-dashboard-range-caption {
  margin-left: auto;
  color: var(--tk-muted);
  white-space: nowrap;
}

.tk-dashboard-sales {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 16px;
  overflow: hidden;
}

.tk-dashboard-sales article {
  display: flex;
  align-items: center;
  min-height: 88px;
  gap: 12px;
  padding: 16px 18px;
  border-right: 1px solid var(--tk-border);
}

.tk-dashboard-sales article:last-child { border-right: 0; }
.tk-dashboard-icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 9px; background: #f1f1f1; font-size: 16px; }
.tk-dashboard-sales article div { display: grid; gap: 5px; min-width: 0; }
.tk-dashboard-sales article span { color: var(--tk-muted); }
.tk-dashboard-sales article strong { color: var(--tk-text); font-size: 20px; line-height: 1; }

.tk-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr);
  gap: 16px;
}

.tk-dashboard-panel { min-width: 0; padding: 18px; }
.tk-dashboard-panel > header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.tk-dashboard-panel > header span { color: var(--tk-muted); font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: .04em; }
.tk-dashboard-panel > header h2 { margin: 2px 0 0; font-size: 17px; }
.tk-dashboard-panel > header > i { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 9px; background: #f1f1f1; font-size: 17px; }
.tk-dashboard-customers { grid-column: 1 / -1; }

.tk-dashboard-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.tk-dashboard-stat-grid.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tk-dashboard-stat-grid.is-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tk-dashboard-stat-grid article { display: grid; align-content: start; min-height: 92px; gap: 8px; padding: 14px; border: 1px solid var(--tk-border); border-radius: var(--tk-radius-sm); background: #fafafa; }
.tk-dashboard-stat-grid strong { font-size: 20px; line-height: 1; }
.tk-dashboard-stat-grid span { color: var(--tk-muted); line-height: 1.3; }
.tk-dashboard-stat-grid .is-warning { background: #fff8db; border-color: #eadb9b; }
.tk-dashboard-stat-grid .is-info { background: #eef6ff; border-color: #c9ddf5; }
.tk-dashboard-stat-grid .is-danger { background: #fff1f0; border-color: #efc8c4; }

.tk-dashboard-margin { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--tk-border); }
.tk-dashboard-margin > label { color: var(--tk-muted); }
.tk-dashboard-margin > div { display: flex; align-items: center; gap: 6px; }
.tk-dashboard-margin input { width: 64px; height: 32px; border: 1px solid var(--tk-border-strong); border-radius: 6px; text-align: right; }
.tk-dashboard-margin button, .tk-dashboard-link { min-height: 32px; padding: 6px 10px; border: 1px solid var(--tk-border-strong); border-radius: 7px; background: #fff; color: var(--tk-text); font-weight: 650; text-decoration: none; }
.tk-dashboard-link { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; }

@media (max-width: 980px) {
  .tk-dashboard-sales { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tk-dashboard-sales article:nth-child(2) { border-right: 0; }
  .tk-dashboard-sales article:nth-child(-n+2) { border-bottom: 1px solid var(--tk-border); }
  .tk-dashboard-grid { grid-template-columns: 1fr; }
  .tk-dashboard-customers { grid-column: auto; }
  .tk-dashboard-stat-grid, .tk-dashboard-stat-grid.is-three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 640px) {
  .tk-dashboard-toolbar .tk-dashboard-store {
    flex-basis: 100%;
    width: 100%;
  }
  .tk-dashboard-toolbar .tk-filter-popover > summary {
    min-width: 0;
  }
  .tk-dashboard-sales, .tk-dashboard-stat-grid, .tk-dashboard-stat-grid.is-two, .tk-dashboard-stat-grid.is-three { grid-template-columns: 1fr; }
  .tk-dashboard-sales article { border-right: 0; border-bottom: 1px solid var(--tk-border); }
  .tk-dashboard-sales article:last-child { border-bottom: 0; }
  .tk-dashboard-toolbar { flex-wrap: wrap; }
  .tk-dashboard-range-caption { margin-left: 0; }
  .tk-dashboard-margin { align-items: flex-start; flex-direction: column; }
}

.tk-filter-row,
.tk-action-grid,
.tk-page-header,
.tk-header-actions,
.tk-table-toolbar {
  display: flex;
  align-items: center;
}

.tk-filter-row {
  gap: 8px;
  margin-bottom: 14px;
}

.tk-filter-btn,
.tk-live-pill,
.tk-mini-card {
  height: 32px;
  padding: 0 12px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  box-shadow: var(--tk-shadow-card);
  color: var(--tk-text);
}

.tk-filter-btn,
.tk-mini-card {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.tk-live-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.tk-live-pill span {
  width: 10px;
  height: 10px;
  border-radius: 99px;
  background: #23e268;
  box-shadow: 0 0 0 4px rgba(35, 226, 104, .12);
}

.tk-card {
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius);
  background: var(--tk-surface);
  box-shadow: var(--tk-shadow-card);
}

.tk-metrics {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-bottom: 14px;
  overflow: hidden;
}

.tk-metrics article {
  display: grid;
  grid-template-columns: 1fr 92px;
  padding: 15px 18px;
  border-right: 1px solid #eeeeee;
  gap: 2px 12px;
}

.tk-metrics article:last-child {
  border-right: 0;
}

.tk-metric-label {
  color: var(--tk-text);
  font-weight: 650;
  text-decoration: underline dotted #a0a0a0;
  text-underline-offset: 4px;
}

.tk-metric-value {
  grid-column: 1;
  color: #1f1f1f;
  font-size: 15px;
  font-weight: 650;
}

.tk-metric-value small {
  color: var(--tk-subtle);
  font-weight: 500;
}

.tk-metrics svg {
  grid-row: 1 / span 2;
  grid-column: 2;
  align-self: end;
}

.tk-metrics path {
  fill: none;
  stroke: var(--tk-blue);
  stroke-width: 2;
}

.tk-action-grid {
  gap: 8px;
  margin-bottom: 28px;
}

.tk-mini-card {
  width: 260px;
  font-weight: 650;
}

.tk-greeting {
  margin: 0 0 10px 12px;
  font-size: 20px;
  font-weight: 750;
}

.tk-ai-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 78px;
  margin-bottom: 28px;
  padding: 16px 14px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius);
  background: #ffffff;
  box-shadow: var(--tk-shadow-card);
  color: var(--tk-muted);
  font-size: 14px;
}

.tk-ai-box button {
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 999px;
  background: #f1f1f1;
  color: var(--tk-muted);
}

.tk-guide-card {
  display: grid;
  grid-template-columns: 1fr 200px;
  gap: 18px;
  margin-bottom: 14px;
  padding: 16px;
}

.tk-guide-copy h2 {
  margin: 14px 0 8px;
  font-size: 15px;
  font-weight: 750;
}

.tk-guide-copy p {
  margin: 0;
  max-width: 590px;
}

.tk-progress-dot {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 8px;
  border: 2px solid #dedede;
  border-radius: 99px;
  vertical-align: middle;
}

.tk-spin-icon {
  margin-right: 8px;
  font-size: 18px;
}

.tk-illustration {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: center;
  justify-items: center;
  min-height: 100px;
  border-radius: 10px;
  font-size: 32px;
}

.tk-green {
  background: #c8ff73;
}

.tk-orange {
  background: #ffd99a;
}

.tk-guide-card footer {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  min-height: 46px;
  padding: 8px 10px 8px 16px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: var(--tk-surface-soft);
  gap: 4px;
}

.tk-guide-card footer button {
  margin-left: auto;
  padding: 5px 12px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
}

.tk-page-header {
  justify-content: space-between;
  margin-bottom: 14px;
}

.tk-page-header h1 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-size: 20px;
  font-weight: 750;
}

.tk-header-actions {
  gap: 8px;
}

.tk-cfd-header-total {
  display: flex;
  min-height: 32px;
  align-items: center;
  gap: 8px;
  padding: 0 11px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-muted);
  font-size: 12px;
  white-space: nowrap;
}

.tk-cfd-header-total strong {
  color: var(--tk-text);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.tk-soft-btn,
.tk-primary-btn {
  height: 32px;
  border-radius: var(--tk-radius-sm);
  font-size: 13px;
  font-weight: 650;
}

.tk-soft-btn {
  border: 0;
  background: #e7e7e7;
  color: var(--tk-text);
}

.tk-soft-btn:hover {
  background: #dedede;
}

.tk-header-actions .tk-soft-btn.active {
  background: #303030;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18);
  color: #ffffff;
}

.tk-header-actions .tk-soft-btn.active:hover {
  background: #1f1f1f;
  color: #ffffff;
}

.tk-primary-btn {
  border: 1px solid #000000;
  background: #303030;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18);
  color: #ffffff;
}

.tk-primary-btn:hover {
  background: #1f1f1f;
  color: #ffffff;
}

.tk-table-card {
  overflow: hidden;
}

.tk-table-toolbar {
  height: 46px;
  padding: 0 14px;
  border-bottom: 1px solid var(--tk-border);
  gap: 10px;
}

.tk-table-toolbar input {
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--tk-text);
}

.tk-table-toolbar button {
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: var(--tk-radius-sm);
  background: transparent;
  color: var(--tk-muted);
}

.tk-table-toolbar a {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border-radius: var(--tk-radius-sm);
  color: var(--tk-muted);
}

.tk-table-toolbar a:hover {
  background: #efefef;
}

.tk-row-link {
  color: var(--tk-text);
  font-weight: 700;
}

.tk-row-link:hover {
  text-decoration: underline;
}

.tk-migration-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 430px;
  gap: 18px;
  margin-bottom: 14px;
  padding: 18px;
}

.tk-migration-hero h2 {
  margin: 10px 0 7px;
  font-size: 18px;
  font-weight: 750;
}

.tk-migration-hero p {
  max-width: 720px;
  margin: 0;
  color: var(--tk-muted);
  font-size: 14px;
}

.tk-migration-counts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.tk-migration-counts article {
  min-height: 74px;
  padding: 12px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: var(--tk-surface-soft);
}

.tk-migration-counts strong {
  display: block;
  color: #1f1f1f;
  font-size: 22px;
  line-height: 1;
}

.tk-migration-counts span,
.tk-section-head span,
.tk-list-stack span {
  color: var(--tk-muted);
}

.tk-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 48px;
  padding: 0 14px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-section-head h2 {
  margin: 0;
  font-size: 14px;
  font-weight: 750;
}

.tk-status-pill {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 2px 9px;
  border: 1px solid var(--tk-border);
  border-radius: 999px;
  background: #f6f6f6;
  color: var(--tk-text);
  font-size: 12px;
  font-weight: 700;
}

.tk-status-pill.partial {
  border-color: #c5deff;
  background: #eaf3ff;
}

.tk-status-pill.planned,
.tk-status-pill.pending {
  border-color: #eadca9;
  background: #fff6d8;
}

.tk-status-pill.ready {
  border-color: #a9e8bd;
  background: #e5f8eb;
}

.tk-migration-table td {
  max-width: 360px;
  vertical-align: top;
}

.tk-migration-table code {
  color: #303030;
  white-space: normal;
}

.tk-migration-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 14px;
}

.tk-list-stack {
  display: grid;
}

.tk-list-stack article {
  display: grid;
  grid-template-columns: 180px minmax(0, 1fr);
  gap: 14px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-list-stack article:last-child {
  border-bottom: 0;
}

.tk-process-note,
.tk-form-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  padding: 12px 14px;
  color: var(--tk-muted);
}

.tk-form-alert.danger {
  border-color: #f2b8b5;
  background: #fff0ef;
  color: #8a1f18;
}

.tk-form-alert.success {
  border-color: #a9e8bd;
  background: #e9f8ee;
  color: #14532d;
}

.tk-form-card {
  overflow: hidden;
}

.tk-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding: 16px;
}

.tk-field {
  display: grid;
  gap: 6px;
  min-width: 0;
  margin: 0;
}

.tk-field.wide {
  grid-column: 1 / -1;
}

.tk-field span {
  color: var(--tk-text);
  font-weight: 650;
}

.tk-field input,
.tk-field select,
.tk-field textarea {
  width: 100%;
  min-width: 0;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  font: inherit;
}

.tk-field textarea {
  min-height: 110px;
  resize: vertical;
}

.tk-field input:focus,
.tk-field select:focus,
.tk-field textarea:focus {
  border-color: #8a8a8a;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, .08);
  outline: 0;
}

.tk-autocomplete,
.tk-rich-select {
  position: relative;
  width: 100%;
  min-width: 0;
}

.tk-native-select-hidden {
  display: none !important;
}

.tk-rich-select-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 34px;
  gap: 10px;
  padding: 6px 10px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  font: inherit;
  text-align: left;
}

.tk-rich-select-button:hover {
  background: #fafafa;
}

.tk-rich-select.is-disabled .tk-rich-select-button,
.tk-rich-select-button:disabled {
  background: #f7f7f7;
  color: #8a8a8a;
  cursor: not-allowed;
}

.tk-rich-select-button:focus {
  border-color: #8a8a8a;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, .08);
  outline: 0;
}

.tk-rich-select-value {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-rich-select-button i {
  flex: 0 0 auto;
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-autocomplete-menu,
.tk-rich-select-menu {
  position: absolute;
  z-index: 80;
  top: calc(100% + 6px);
  left: 0;
  width: min(420px, 100%);
  max-height: 280px;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
}

.tk-autocomplete-menu[hidden] {
  display: none;
}

.tk-rich-select-menu[hidden] {
  display: none;
}

.tk-autocomplete-option,
.tk-rich-select-option {
  display: grid;
  width: 100%;
  gap: 2px;
  min-height: 50px;
  padding: 8px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--tk-text);
  text-align: left;
}

.tk-autocomplete-option:hover,
.tk-autocomplete-option.active,
.tk-rich-select-option:hover,
.tk-rich-select-option.active {
  background: #f1f1f1;
}

.tk-autocomplete-option strong,
.tk-rich-select-option strong {
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.2;
}

.tk-autocomplete-option span,
.tk-rich-select-option span,
.tk-autocomplete-empty {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-autocomplete-empty {
  padding: 10px;
}

.tk-product-autocomplete-option {
  align-items: center;
  grid-template-columns: 42px minmax(0, 1fr);
  min-height: 58px;
  gap: 10px;
}

.tk-autocomplete-thumb {
  align-items: center;
  background: #ffffff;
  border: 1px solid var(--tk-border);
  border-radius: 7px;
  display: flex;
  height: 40px;
  justify-content: center;
  overflow: hidden;
  width: 40px;
}

.tk-autocomplete-thumb img {
  height: 100%;
  object-fit: contain;
  width: 100%;
}

.tk-autocomplete-thumb.missing {
  background: #f7f7f7;
  color: var(--tk-muted);
}

.tk-autocomplete-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.tk-autocomplete-copy strong,
.tk-autocomplete-copy span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-fx-client-field .tk-autocomplete-menu {
  width: 100%;
  max-height: 320px;
}

.tk-fx-client-option {
  min-height: 64px;
}

.tk-fx-client-address {
  white-space: normal;
}

.tk-fx-client-warning {
  color: #8a6116 !important;
  font-weight: 650;
}

.tk-field input[readonly],
.tk-field textarea[readonly] {
  background: #f6f6f6;
  color: var(--tk-muted);
}

.tk-checkline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
}

.tk-checkline input {
  width: 16px;
  min-height: 16px;
}

.tk-checkline em {
  color: var(--tk-muted);
  font-style: normal;
}

.tk-switchline input,
.tk-switch-field input[type="checkbox"] {
  position: relative;
  flex: 0 0 auto;
  width: 34px;
  height: 20px;
  min-height: 20px;
  margin: 0;
  border: 1px solid #b5b5b5;
  border-radius: 999px;
  background: #d8d8d8;
  appearance: none;
  cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease;
}

.tk-switchline input::after,
.tk-switch-field input[type="checkbox"]::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .25);
  transition: transform .15s ease;
}

.tk-switchline input:checked,
.tk-switch-field input[type="checkbox"]:checked {
  border-color: #303030;
  background: #303030;
}

.tk-switchline input:checked::after,
.tk-switch-field input[type="checkbox"]:checked::after {
  transform: translateX(14px);
}

.tk-switchline input:focus-visible,
.tk-switch-field input[type="checkbox"]:focus-visible {
  outline: 2px solid rgba(48, 48, 48, .25);
  outline-offset: 2px;
}

.tk-form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 12px 16px;
  border-top: 1px solid var(--tk-border);
  background: var(--tk-surface-soft);
}

.tk-table-toolbar .tk-inline-select {
  width: auto;
  min-width: 44px;
  color: var(--tk-text);
  font-weight: 650;
  gap: 6px;
}

.tk-table-toolbar button:hover {
  background: #efefef;
}

.tk-table {
  --bs-table-bg: #ffffff;
  --bs-table-color: var(--tk-text);
  font-size: 13px;
}

.tk-table th {
  height: 36px;
  border-bottom-color: var(--tk-border);
  background: #f7f7f7;
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 650;
}

.tk-table td {
  height: 32px;
  border-bottom-color: #e5e5e5;
  color: var(--tk-text);
}

.tk-table tbody tr:hover td {
  background: #f8f8f8;
}

.tk-table tbody tr[data-row-href] {
  cursor: pointer;
}

.tk-table tbody tr[data-row-href]:focus-visible {
  outline: 2px solid #005bd3;
  outline-offset: -2px;
}

.form-check-input {
  width: 16px;
  height: 16px;
  border-color: var(--tk-border-strong);
  border-radius: 4px;
  box-shadow: none;
}

.form-check-input:checked,
.form-check-input:indeterminate {
  background-color: #303030;
  border-color: #303030;
}

.form-check-input:focus-visible {
  border-color: #303030;
  box-shadow: 0 0 0 3px rgba(48, 48, 48, .16);
  outline: 0;
}

.tk-badge {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 1px 9px;
  border-radius: 8px;
  color: #26502f;
  font-weight: 650;
  line-height: 18px;
}

.tk-badge.suscrito {
  background: var(--tk-green);
}

.tk-badge.no-suscrito {
  background: #e3e3e3;
  color: #5f5f5f;
}

.tk-badge.success {
  background: var(--tk-green);
  color: #26502f;
}

.tk-badge.warning {
  background: #f5e8a3;
  color: #4f3f00;
}

.tk-row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  white-space: nowrap;
}

.tk-icon-action {
  display: inline-grid;
  width: 28px;
  height: 28px;
  place-items: center;
  padding: 0;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
}

.tk-icon-action:hover {
  background: #f1f1f1;
}

.tk-icon-action.danger {
  border-color: #f0b8b8;
  background: #fff6f6;
  color: #b42318;
}

.tk-icon-action.danger:hover {
  border-color: #e58d8d;
  background: #ffe7e7;
  color: #8a1f16;
}

.tk-settings-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  align-items: start;
  gap: 14px;
}

.tk-template-editor-layout {
  grid-template-columns: minmax(0, 1fr) 360px;
}

.tk-template-fields {
  display: grid;
  gap: 16px;
  padding: 16px;
}

.tk-template-fields textarea {
  min-height: 390px;
  resize: vertical;
}

.tk-master-fields {
  display: grid;
}

.tk-master-section {
  display: grid;
  gap: 14px;
  padding: 18px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-master-section:last-child {
  border-bottom: 0;
}

.tk-master-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.tk-master-section-head h3 {
  margin: 0 0 3px;
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 750;
}

.tk-master-section-head p {
  margin: 0;
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-master-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

.tk-master-control {
  display: grid;
  align-content: start;
  gap: 10px;
}

.tk-field-label {
  color: var(--tk-text);
  font-size: 12px;
  font-weight: 650;
}

.tk-segmented-control {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 3px;
  border: 1px solid var(--tk-border);
  border-radius: 9px;
  background: #f1f1f1;
}

.tk-segmented-control label {
  margin: 0;
  cursor: pointer;
}

.tk-segmented-control input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.tk-segmented-control span {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 30px;
  padding: 5px 7px;
  border-radius: 6px;
  color: var(--tk-muted);
  font-size: 11px;
}

.tk-segmented-control input:checked + span {
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .12);
  color: var(--tk-text);
  font-weight: 700;
}

.tk-color-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

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

.tk-color-field {
  display: grid;
  gap: 6px;
  color: var(--tk-text);
  font-size: 12px;
  font-weight: 650;
}

.tk-color-field > span:last-child {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 5px 8px;
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  background: #ffffff;
}

.tk-color-field input[type="color"] {
  width: 24px;
  height: 24px;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 5px;
  background: transparent;
  cursor: pointer;
}

.tk-color-field code {
  color: var(--tk-muted);
  font-size: 11px;
  text-transform: uppercase;
}

.tk-email-preview-stage {
  padding: 28px;
  transition: background-color .15s ease;
}

.tk-email-preview {
  width: min(100%, 620px);
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, .09);
  border-radius: 10px;
  background: #ffffff;
  box-shadow: 0 4px 18px rgba(0, 0, 0, .08);
}

.tk-email-preview header {
  display: grid;
  gap: 8px;
  padding: 24px 30px 20px;
  transition: background-color .15s ease, color .15s ease;
}

.tk-email-preview header img {
  display: inline-block;
  max-width: 150px;
  max-height: 58px;
  object-fit: contain;
}

.tk-email-preview header > strong {
  font-size: 16px;
}

.tk-email-preview header p,
.tk-email-preview footer p {
  margin: 0;
  font-size: 11px;
  line-height: 1.55;
  white-space: pre-line;
}

.tk-email-preview-body {
  padding: 30px;
}

.tk-email-preview-body > span {
  color: var(--tk-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.tk-email-preview-body h3 {
  margin: 5px 0 16px;
  color: var(--tk-text);
  font-size: 18px;
}

.tk-email-preview-body p {
  margin: 0 0 22px;
  color: #4a4a4a;
  font-size: 13px;
  line-height: 1.6;
  white-space: pre-line;
}

.tk-email-preview-body a {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  padding: 7px 14px;
  border-radius: 7px;
  background: #202223;
  color: #ffffff;
  font-size: 12px;
  font-weight: 700;
}

.tk-email-preview footer {
  padding: 18px 30px;
  text-align: center;
  transition: background-color .15s ease, color .15s ease;
}

.tk-template-picker {
  display: grid;
  gap: 14px;
  max-height: 460px;
  overflow-y: auto;
}

.tk-template-group {
  display: grid;
  gap: 4px;
}

.tk-template-group > strong {
  padding: 4px 8px;
  color: var(--tk-muted);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .03em;
  text-transform: uppercase;
}

.tk-template-option,
.tk-variable-list button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--tk-text);
  text-align: left;
}

.tk-template-option {
  min-height: 34px;
  padding: 7px 8px;
  font-size: 12px;
}

.tk-template-option:hover,
.tk-template-option.active {
  background: #f1f1f1;
}

.tk-template-option.active {
  font-weight: 700;
}

.tk-template-option span > i {
  margin-right: 5px;
  color: var(--tk-muted);
}

.tk-template-option i {
  color: var(--tk-muted);
  font-size: 10px;
}

.tk-variable-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.tk-variable-list button {
  min-height: 32px;
  padding: 6px 8px;
  border: 1px solid var(--tk-border);
  background: #ffffff;
}

.tk-variable-list button:hover {
  background: #f7f7f7;
}

.tk-variable-list code {
  color: #005bd3;
  font-size: 11px;
}

.tk-variable-list i {
  color: var(--tk-muted);
}

@media (max-width: 760px) {
  .tk-master-grid,
  .tk-color-grid,
  .tk-color-grid-wide {
    grid-template-columns: 1fr;
  }

  .tk-email-preview-stage {
    padding: 14px;
  }
}

.tk-settings-main,
.tk-settings-side {
  display: grid;
  align-content: start;
  gap: 14px;
}

.tk-panel {
  overflow: hidden;
}

.tk-skill-uploader {
  display: grid;
  align-items: start;
  gap: 10px;
}

.tk-skill-file-zone {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
}

.tk-skill-hint {
  margin: 0;
  color: var(--tk-muted);
  font-size: 12px;
  line-height: 1.35;
}

.tk-skill-list {
  display: grid;
  gap: 8px;
}

.tk-logo-card {
  gap: 10px;
}

.tk-logo-card p {
  margin: 0;
  color: var(--tk-muted);
  font-size: 12px;
  line-height: 1.35;
}

.tk-logo-preview {
  display: grid;
  min-height: 86px;
  place-items: center;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #fbfbfb;
  overflow: hidden;
}

.tk-logo-preview img {
  display: block;
  max-width: 100%;
  max-height: 78px;
  object-fit: contain;
}

.tk-logo-empty {
  display: grid;
  gap: 4px;
  place-items: center;
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-logo-empty i {
  color: #4d4d4d;
  font-size: 22px;
}

.tk-service-grid {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.tk-service-block {
  display: grid;
  gap: 0;
  padding: 0;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
}

.tk-service-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 58px;
  padding: 10px 12px;
}

.tk-service-summary {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  min-width: 0;
  gap: 10px;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
}

.tk-service-summary > i {
  flex: 0 0 auto;
  color: var(--tk-muted);
  font-size: 12px;
  transition: transform 160ms ease;
}

.tk-service-summary[aria-expanded="true"] > i {
  transform: rotate(90deg);
}

.tk-service-summary:focus-visible {
  border-radius: 6px;
  outline: 2px solid #005bd3;
  outline-offset: 3px;
}

.tk-service-content {
  display: grid;
  gap: 12px;
  padding: 4px 12px 12px 34px;
  border-top: 1px solid var(--tk-border);
}

.tk-service-content[hidden] {
  display: none;
}

.tk-service-title {
  display: grid;
  flex: 1 1 auto;
  min-width: 0;
  gap: 2px;
}

.tk-service-head strong {
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 750;
}

.tk-service-head span {
  color: var(--tk-muted);
  font-size: 12px;
  line-height: 1.35;
}

.tk-service-status {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-left: auto;
}

.tk-service-status .tk-badge {
  color: #26502f;
  white-space: nowrap;
}

.tk-service-status .tk-badge.warning {
  color: #4f3f00;
}

.tk-service-fields {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.tk-service-footer {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-start;
  padding-top: 2px;
}

.tk-service-help {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid #dfe3e8;
  border-radius: var(--tk-radius-sm);
  background: #f7f7f7;
  color: var(--tk-text);
  font-size: 12px;
  line-height: 1.4;
}

.tk-service-help strong {
  font-size: 12px;
  font-weight: 750;
}

.tk-service-help ol {
  display: grid;
  gap: 4px;
  margin: 0;
  padding-left: 18px;
}

.tk-service-help p {
  margin: 0;
  color: var(--tk-muted);
}

.tk-service-help code {
  display: inline-block;
  max-width: 100%;
  padding: 1px 4px;
  border-radius: 4px;
  background: #ffffff;
  color: #303030;
  font-size: 11px;
  overflow-wrap: anywhere;
}

.tk-service-test-result {
  display: inline-flex;
  align-items: flex-start;
  gap: 8px;
  width: fit-content;
  max-width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #f7f7f7;
  color: var(--tk-text);
  font-size: 12px;
  line-height: 1.35;
}

.tk-service-test-result[hidden] {
  display: none;
}

.tk-service-test-result.success {
  border-color: #b7e4c7;
  background: #effaf3;
  color: #26502f;
}

.tk-service-test-result.danger {
  border-color: #f3c6c6;
  background: #fff4f4;
  color: #8a2f2f;
}

.tk-service-toggle {
  flex: 0 0 auto;
  align-items: center;
  min-height: 24px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.tk-shipping-config {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.tk-shipping-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 14px;
}

.tk-shipping-list-card {
  overflow: hidden;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
}

.tk-shipping-list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-shipping-list-head strong {
  font-size: 13px;
  font-weight: 750;
}

.tk-shipping-list {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.tk-shipping-row {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #fbfbfb;
}

.tk-shipping-row-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.tk-shipping-row-head strong {
  font-size: 13px;
  font-weight: 750;
}

.tk-shipping-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.tk-shipping-ecommerce-note,
.tk-shortcut-card p {
  margin: 0;
  color: var(--tk-muted);
  font-size: 13px;
  line-height: 1.4;
}

.tk-shortcut-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.tk-shortcut-head h2 {
  margin: 0;
}

.tk-shortcut-card p {
  margin-top: 10px;
}

.tk-shipping-online-switch,
.tk-shipping-active-switch {
  white-space: nowrap;
}

.tk-shipping-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.tk-shipping-fields.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tk-shipping-states {
  min-height: 88px;
}

@media (max-width: 900px) {
  .tk-shipping-columns,
  .tk-shipping-fields,
  .tk-shipping-fields.three {
    grid-template-columns: 1fr;
  }
}

.tk-skill-item {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 64px;
  padding: 10px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
}

.tk-skill-icon {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 8px;
  background: #f1f1f1;
  color: var(--tk-text);
}

.tk-skill-copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.tk-skill-copy strong,
.tk-skill-copy code,
.tk-skill-copy span,
.tk-skill-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-skill-copy strong {
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 750;
}

.tk-skill-copy code {
  color: #005bd3;
  font-size: 12px;
}

.tk-skill-copy span,
.tk-skill-copy small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 46px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--tk-border);
  background: #f7f7f7;
}

.tk-panel-head h2 {
  margin: 0;
  color: var(--tk-text);
  font-size: 14px;
  font-weight: 750;
}

.tk-panel-head span {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-toggle-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 16px 16px 0;
}

.tk-switch-field {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 28px;
  padding: 3px 0;
  color: var(--tk-text);
  font-weight: 650;
}

.tk-side-card .tk-switch-field {
  display: flex;
}

.tk-switch-list {
  display: grid;
}

.tk-switch-field span {
  order: -1;
}

.tk-info-note,
.tk-code-note {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 16px 16px;
  padding: 10px 12px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #f7f7f7;
  color: var(--tk-muted);
  font-size: 12px;
  line-height: 1.35;
}

.tk-info-note strong {
  color: var(--tk-text);
}

.tk-code-note {
  align-items: flex-start;
  flex-direction: column;
}

.tk-code-note span {
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 650;
}

.tk-code-note code {
  width: 100%;
  overflow-wrap: anywhere;
  color: var(--tk-text);
  font-size: 12px;
}

.tk-stat-list {
  display: grid;
  gap: 0;
}

.tk-stat-list div,
.tk-record-list div {
  display: grid;
  gap: 3px;
  padding: 10px 0;
  border-bottom: 1px solid var(--tk-border);
}

.tk-stat-list div:last-child,
.tk-record-list div:last-child {
  border-bottom: 0;
}

.tk-stat-list span,
.tk-record-list dt {
  margin: 0;
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 650;
}

.tk-stat-list strong,
.tk-record-list dd {
  margin: 0;
  color: var(--tk-text);
  font-size: 18px;
  font-weight: 800;
}

.tk-stat-list small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-savebar {
  position: sticky;
  bottom: 0;
  z-index: 4;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 14px;
  padding: 12px 16px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius);
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 -4px 18px rgba(0, 0, 0, .08);
  backdrop-filter: blur(12px);
}

.tk-channel-summary {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1.5fr auto;
  gap: 16px;
  padding: 16px;
}

.tk-channel-summary div {
  display: grid;
  gap: 4px;
}

.tk-channel-summary strong {
  font-size: 14px;
}

.tk-soft-btn.danger {
  color: #8a1f18;
}

.tk-empty-inline {
  padding: 16px;
  color: var(--tk-muted);
  font-size: 13px;
}

.tk-switch-field.compact {
  align-items: center;
  gap: 8px;
  min-height: 24px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.tk-type-setting-switch {
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  grid-column: span 1;
}

.tk-type-setting-switch > div {
  display: grid;
  gap: 3px;
}

.tk-type-setting-switch strong {
  color: #303030;
  font-size: 13px;
  font-weight: 600;
}

.tk-type-setting-switch small {
  color: #616161;
  font-size: 12px;
}

.tk-type-setting-switch .tk-switch-field {
  flex: 0 0 auto;
  margin-left: auto;
}

.tk-switch-field.compact.tk-service-toggle {
  flex: 0 0 auto;
  justify-content: flex-end;
}

.tk-switch-field.compact strong {
  font-size: 13px;
}

.tk-tool-result {
  display: grid;
  gap: 12px;
  margin-top: 14px;
}

.tk-shopify-tools {
  overflow: visible;
}

.tk-shopify-tool-list {
  display: grid;
  gap: 0;
}

.tk-shopify-tool-card {
  display: grid;
  gap: 14px;
  padding: 16px;
  border-top: 1px solid var(--tk-border);
  background: #ffffff;
}

.tk-shopify-tool-card:first-child {
  border-top: 0;
}

.tk-shopify-tool-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.tk-shopify-tool-title {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 12px;
  min-width: 0;
}

.tk-shopify-tool-title > i {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #f6f6f6;
  color: var(--tk-text);
  font-size: 17px;
}

.tk-shopify-tool-title strong {
  display: block;
  color: var(--tk-text);
  font-size: 14px;
  line-height: 1.25;
}

.tk-shopify-tool-title span,
.tk-tool-help {
  display: block;
  max-width: 78ch;
  margin: 2px 0 0;
  color: var(--tk-muted);
  font-size: 13px;
  line-height: 1.35;
}

.tk-tool-head-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
}

.tk-tool-checklist {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tk-service-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 28px;
  padding: 0 10px;
  border: 1px solid var(--tk-border);
  border-radius: 999px;
  background: #f7f7f7;
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 750;
  line-height: 1;
}

.tk-service-chip.is-ready {
  border-color: #b7ebce;
  background: #d9f7e7;
  color: #0f5132;
}

.tk-service-chip.is-missing {
  border-color: #f3c4c1;
  background: #fff1f0;
  color: #8a1f18;
}

.tk-service-chip.is-optional {
  border-color: #eadf9d;
  background: #fff8db;
  color: #6b4e00;
}

.tk-tool-config-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  align-items: end;
}

.tk-tool-config-grid .wide,
.tk-tool-run-row .wide {
  grid-column: 1 / -1;
}

.tk-tool-run-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 12px;
  align-items: end;
}

.tk-tool-run-row.no-file {
  grid-template-columns: minmax(180px, 220px);
  justify-content: end;
}

.tk-tool-mode-field {
  max-width: 220px;
}

.tk-tool-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 2px;
}

.tk-tool-result.is-inline {
  margin: 0;
}

.tk-js-toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 2000;
  display: grid;
  min-width: 280px;
  max-width: min(420px, calc(100vw - 36px));
  gap: 4px;
  padding: 13px 14px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius);
  background: #ffffff;
  box-shadow: 0 14px 38px rgba(0, 0, 0, .18);
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease;
}

.tk-js-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.tk-js-toast strong {
  color: var(--tk-text);
  font-size: 13px;
}

.tk-js-toast span {
  color: var(--tk-muted);
  font-size: 13px;
  line-height: 1.35;
}

.tk-js-toast.tone-success {
  border-color: #b7ebce;
}

.tk-js-toast.tone-danger {
  border-color: #f3c4c1;
}

.tk-tool-preview-note {
  padding: 10px 12px;
  border: 1px solid #b7d4f8;
  border-radius: var(--tk-radius-sm);
  background: #eef6ff;
  color: #1f4e79;
  font-size: 13px;
  font-weight: 650;
}

.tk-tool-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
}

.tk-tool-summary div {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border-right: 1px solid var(--tk-border);
}

.tk-tool-summary div:last-child {
  border-right: 0;
}

.tk-tool-summary span {
  color: var(--tk-muted);
  font-size: 11px;
  text-transform: uppercase;
}

.tk-tool-summary strong {
  color: var(--tk-text);
  font-size: 13px;
}

.tk-spin {
  animation: tk-spin .8s linear infinite;
}

@keyframes tk-spin {
  to {
    transform: rotate(360deg);
  }
}

@media (max-width: 900px) {
  .tk-shopify-tool-head {
    display: grid;
  }

  .tk-tool-head-actions {
    justify-content: space-between;
  }

  .tk-tool-config-grid,
  .tk-tool-run-row,
  .tk-tool-run-row.no-file {
    grid-template-columns: 1fr;
  }

  .tk-tool-mode-field {
    max-width: none;
  }

  .tk-tool-actions {
    flex-wrap: wrap;
    justify-content: stretch;
  }

  .tk-tool-actions .btn {
    flex: 1 1 160px;
  }
}

.tk-table-total {
  white-space: nowrap;
  color: var(--tk-text);
  font-size: 12px;
}

.tk-document-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  align-items: start;
  gap: 14px;
}

.tk-fx-document-stack {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.tk-fx-top-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: start;
  gap: 14px;
  min-width: 0;
}

.tk-fx-top-row.is-stretched {
  align-items: stretch;
}

.tk-fx-top-row.is-aside-narrow {
  grid-template-columns: minmax(0, 1fr) minmax(360px, .72fr);
}

.tk-fx-top-row.is-aside-wide {
  grid-template-columns: minmax(0, 1fr) minmax(430px, .9fr);
}

.tk-fx-document-stack .tk-fx-lines {
  margin-top: 0 !important;
}

.tk-document-main,
.tk-document-side {
  overflow: hidden;
}

.tk-document-title {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-document-title > div {
  display: grid;
  gap: 3px;
}

.tk-document-title strong {
  font-size: 18px;
}

.tk-document-title small {
  color: var(--tk-muted);
}

.tk-fact-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 16px;
}

.tk-fact-grid div,
.tk-money-list div {
  display: grid;
  gap: 3px;
}

.tk-fact-grid span,
.tk-money-list span {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-side-actions,
.tk-money-list {
  display: grid;
  gap: 8px;
  padding: 16px;
}

.tk-money-list div {
  grid-template-columns: 1fr auto;
  align-items: center;
}

.tk-cell-input {
  width: 100%;
  min-width: 80px;
  height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  font: inherit;
}

.tk-cell-action {
  position: relative;
  display: block;
  min-width: 150px;
}

.tk-cell-action .tk-cell-input {
  padding-right: 38px;
}

.tk-cell-action .tk-icon-btn {
  position: absolute;
  top: 3px;
  right: 3px;
  width: 28px;
  height: 28px;
  min-height: 28px;
  border: 0;
  background: transparent;
  color: var(--tk-muted);
}

.tk-cell-action .tk-icon-btn:hover {
  background: #f1f1f1;
  color: var(--tk-text);
}

.tk-description-action {
  min-width: 220px;
}

.tk-description-action .tk-cell-input {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-unit-cell {
  display: block;
  min-width: 92px;
}

.tk-unit-cell .tk-unit-code {
  color: var(--tk-text);
  font-size: inherit;
  text-transform: uppercase;
}

.tk-table-autocomplete-menu {
  position: fixed;
  z-index: 1080;
  max-height: 280px;
}

.tk-table-autocomplete-menu .tk-autocomplete-option {
  min-height: 44px;
}

.tk-fx-table tbody tr.fx-description-editor-row,
.tk-fx-table tbody tr.fx-description-editor-row:hover {
  background: #ffffff;
}

.tk-fx-table tbody tr.fx-description-open td {
  padding-bottom: 5px;
}

.tk-fx-table tbody tr.fx-description-editor-row td {
  padding: 0 12px 8px;
}

.tk-description-editor-panel {
  position: relative;
  width: min(620px, calc(100% - 174px));
  margin-left: 174px;
  padding: 6px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .14);
}

.tk-description-editor-panel .fx-description-close {
  position: absolute;
  top: 9px;
  right: 9px;
  z-index: 1;
  width: 26px;
  height: 26px;
  min-height: 26px;
  border: 0;
  background: transparent;
  color: var(--tk-subtle);
}

.tk-description-editor-panel .fx-description-close:hover {
  background: #f1f1f1;
  color: var(--tk-text);
}

.tk-description-editor {
  width: 100%;
  min-height: 82px;
  padding: 8px 38px 8px 10px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  font: inherit;
  line-height: 1.4;
  resize: vertical;
}

.tk-description-editor:focus {
  border-color: #8a8a8a;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, .08);
  outline: 0;
}

.tk-screen-alerts {
  display: grid;
  gap: 8px;
  margin-bottom: 12px;
}

.tk-screen-alert {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 28px;
  align-items: start;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  box-shadow: var(--tk-shadow-card);
}

.tk-screen-alert > i,
.tk-toast-icon,
.tk-feedback-icon {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 8px;
  background: #f1f1f1;
  color: var(--tk-text);
}

.tk-screen-alert div,
.tk-toast-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.tk-screen-alert strong,
.tk-toast-copy strong {
  font-size: 13px;
  font-weight: 750;
  line-height: 1.2;
}

.tk-screen-alert span,
.tk-toast-copy span {
  color: var(--tk-muted);
  font-size: 13px;
  line-height: 1.35;
}

.tk-screen-alert .tk-icon-btn,
.tk-toast .tk-icon-btn {
  width: 28px;
  height: 28px;
  min-height: 28px;
  border: 0;
  background: transparent;
  color: var(--tk-muted);
}

.tk-screen-alert .tk-icon-btn:hover,
.tk-toast .tk-icon-btn:hover {
  background: #f1f1f1;
  color: var(--tk-text);
}

.tk-toast-region {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 1090;
  display: grid;
  width: min(380px, calc(100vw - 24px));
  gap: 8px;
  pointer-events: none;
}

.tk-toast {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 28px;
  align-items: start;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .14);
  opacity: 0;
  pointer-events: auto;
  transform: translateY(8px);
  transition: opacity .18s ease, transform .18s ease;
}

.tk-toast.show {
  opacity: 1;
  transform: translateY(0);
}

.tk-feedback-modal .modal-header {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  padding: 18px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-feedback-modal {
  overflow: hidden;
  background: #ffffff;
}

.tk-feedback-modal .modal-title {
  margin: 0;
  color: var(--tk-text);
  font-size: 16px;
  font-weight: 750;
  letter-spacing: 0;
}

.tk-feedback-modal p {
  margin: 4px 0 0;
  color: var(--tk-muted);
  font-size: 13px;
  line-height: 1.4;
}

.tk-feedback-modal .modal-footer {
  gap: 8px;
  padding: 12px 18px;
  border-top: 0;
}

.tk-modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
}

.tk-modal-heading {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.tk-modal-heading-icon {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 8px;
  background: #f1f1f1;
  color: var(--tk-text);
  font-size: 15px;
}

.tk-modal-heading .modal-title {
  margin: 0;
  color: var(--tk-text);
  font-size: 16px;
  font-weight: 750;
  line-height: 1.2;
  letter-spacing: 0;
}

.tk-modal-heading p {
  margin: 3px 0 0;
  color: var(--tk-muted);
  font-size: 12px;
  line-height: 1.35;
}

.tk-modal-header > .tk-icon-btn {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  min-height: 28px;
  border: 0;
  background: transparent;
}

.tk-list-header p {
  margin: 4px 0 0;
  color: var(--tk-muted);
  font-size: 13px;
}

.tk-list-card {
  border-radius: var(--tk-radius);
  overflow: visible;
}

.tk-list-toolbar {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) auto auto;
  gap: 8px;
  align-items: center;
  padding: 12px;
  border-bottom: 1px solid var(--tk-border);
  border-radius: calc(var(--tk-radius) - 1px) calc(var(--tk-radius) - 1px) 0 0;
  background: #ffffff;
}

.tk-list-toolbar.has-filter-toggle {
  grid-template-columns: minmax(280px, 1fr) auto;
}

.tk-list-toolbar.has-filter-toggle.has-export-action {
  grid-template-columns: minmax(280px, 1fr) auto auto;
}

.tk-list-search {
  position: relative;
  min-width: 0;
  margin: 0;
}

.tk-list-search > i {
  position: absolute;
  top: 50%;
  left: 12px;
  color: var(--tk-muted);
  transform: translateY(-50%);
}

.tk-list-search input,
.tk-list-search select {
  width: 100%;
  min-height: 36px;
  padding: 7px 10px 7px 34px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  font: inherit;
}

.tk-list-search.has-clear input {
  padding-right: 40px;
}

.tk-list-search-clear {
  position: absolute;
  top: 50%;
  right: 5px;
  display: inline-flex;
  width: 28px;
  height: 28px;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 6px;
  color: var(--tk-muted);
  transform: translateY(-50%);
}

.tk-list-search-clear:hover {
  background: var(--tk-surface-muted);
  color: var(--tk-text);
}

.tk-list-search-clear i {
  position: static;
  transform: none;
}

.tk-list-filter-toggle i:last-child {
  font-size: 10px;
  transition: transform 180ms ease;
}

.tk-list-filter-toggle[aria-expanded="true"] i:last-child {
  transform: rotate(180deg);
}

.tk-list-filters,
.tk-list-active-filters {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--tk-border);
  background: #fafafa;
}

.tk-list-filters {
  z-index: 4;
}

.tk-list-active-filters {
  z-index: 3;
}

.tk-list-filters.is-collapsible,
.tk-list-active-filters.is-collapsible {
  max-height: 0;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
  border-bottom-width: 0;
  opacity: 0;
  transform: translateY(-6px);
  transition: max-height 220ms ease, padding 220ms ease, border-width 220ms ease, opacity 160ms ease, transform 220ms ease;
}

.tk-list-filters.is-collapsible.is-open,
.tk-list-active-filters.is-collapsible.is-open {
  max-height: 480px;
  padding-top: 10px;
  padding-bottom: 10px;
  overflow: visible;
  border-bottom-width: 1px;
  opacity: 1;
  transform: translateY(0);
}

.tk-list-active-filters a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 26px;
  padding: 4px 8px;
  border: 1px solid var(--tk-border);
  border-radius: 999px;
  background: #ffffff;
  color: var(--tk-text);
  font-size: 12px;
  font-weight: 650;
}

.tk-filter-popover {
  position: relative;
}

.tk-filter-popover summary {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  cursor: pointer;
  font-size: 13px;
  font-weight: 650;
  list-style: none;
}

.tk-filter-popover summary::-webkit-details-marker {
  display: none;
}

.tk-filter-popover summary::after {
  color: var(--tk-muted);
  content: "\F282";
  font-family: bootstrap-icons;
  font-size: 11px;
}

.tk-filter-popover summary.active {
  border-color: #9c9c9c;
  background: #f6f6f6;
}

.tk-filter-popover summary strong {
  max-width: 140px;
  overflow: hidden;
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-filter-menu {
  position: absolute;
  z-index: 90;
  top: calc(100% + 6px);
  left: 0;
  display: grid;
  width: 260px;
  max-height: 320px;
  overflow: auto;
  padding: 6px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
}

.tk-filter-menu.compact {
  width: 180px;
}

.tk-mp-date-menu {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  width: 360px;
  max-height: none;
  overflow: visible;
  padding: 10px;
}

.tk-mp-date-menu label {
  display: grid;
  gap: 6px;
  margin: 0;
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 700;
}

.tk-mp-date-menu input {
  min-height: 36px;
  padding: 7px 9px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  font: inherit;
}

.tk-mp-date-actions {
  display: flex;
  grid-column: 1 / -1;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 4px;
}

.tk-mp-store-menu,
.tk-mp-order-menu {
  z-index: 1065;
  width: 100%;
}

.tk-mp-order-menu {
  max-height: 300px;
}

.tk-mp-order-option strong,
.tk-mp-order-option span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-date-filter-menu {
  grid-template-columns: 190px 320px;
  align-items: start;
  width: 510px;
  max-height: none;
  overflow: hidden;
  padding: 0;
}

.tk-date-filter-presets {
  display: grid;
  gap: 3px;
  height: 100%;
  padding: 10px 8px;
  border-right: 1px solid var(--tk-border);
  background: #fbfbfb;
}

.tk-date-filter-presets > strong {
  padding: 4px 8px 6px;
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 750;
}

.tk-filter-menu a,
.tk-filter-menu button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 18px;
  gap: 8px;
  align-items: center;
  min-height: 34px;
  padding: 7px 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--tk-text);
  font-size: 13px;
  text-align: left;
}

.tk-date-filter-presets a span {
  display: grid;
  gap: 2px;
}

.tk-filter-menu a:hover,
.tk-filter-menu a.selected,
.tk-filter-menu button:hover,
.tk-filter-menu button.selected {
  background: #f1f1f1;
}

.tk-filter-menu a i,
.tk-filter-menu button i {
  color: var(--tk-text);
  opacity: 0;
}

.tk-filter-menu a.selected i,
.tk-filter-menu button.selected i {
  opacity: 1;
}

.tk-date-filter-custom {
  display: grid;
  grid-column: auto;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  height: 100%;
  padding: 12px;
}

.tk-date-filter-custom .btn {
  justify-content: center;
  min-height: 32px;
}

.tk-date-filter-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--tk-border);
}

.tk-date-calendar {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.tk-date-calendar-meta {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.tk-date-calendar-meta div {
  display: grid;
  gap: 2px;
  min-height: 48px;
  padding: 8px 10px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #fbfbfb;
}

.tk-date-calendar-meta span {
  color: var(--tk-muted);
  font-size: 11px;
  font-weight: 750;
}

.tk-date-calendar-meta strong {
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 750;
}

.tk-date-calendar-head {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) 28px;
  align-items: center;
  min-height: 32px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #f7f7f7;
}

.tk-date-calendar-head strong {
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 750;
  text-align: center;
  text-transform: capitalize;
}

.tk-date-nav {
  width: 28px;
  height: 30px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--tk-muted);
}

.tk-date-nav:hover {
  background: #ececec;
  color: var(--tk-text);
}

.tk-date-weekdays,
.tk-date-days {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 3px;
}

.tk-date-weekdays span {
  color: var(--tk-muted);
  font-size: 11px;
  font-weight: 750;
  text-align: center;
}

.tk-date-day,
.tk-date-day-empty {
  display: grid;
  min-width: 0;
  height: 28px;
  place-items: center;
  border-radius: 6px;
  font-size: 12px;
}

.tk-date-day {
  border: 0;
  background: transparent;
  color: var(--tk-text);
  font-weight: 650;
}

.tk-date-day:hover {
  background: #eeeeee;
}

.tk-date-day.in-range {
  background: #f1f1f1;
}

.tk-date-day.preview-end {
  background: #e8e8e8;
}

.tk-date-day.today {
  box-shadow: inset 0 0 0 1px #9c9c9c;
}

.tk-date-day.selected {
  background: #303030;
  color: #ffffff;
  box-shadow: none;
}

.tk-date-day.disabled,
.tk-date-day.disabled:hover {
  background: transparent;
  color: #b5b5b5;
  cursor: not-allowed;
  font-weight: 450;
}

.tk-date-calendar small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-date-day-empty {
  color: transparent;
}

.tk-date-single-picker {
  position: relative;
  min-width: 0;
}

.tk-date-single-trigger {
  align-items: center;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 18px;
  gap: 8px;
  width: 100%;
  height: 36px;
  padding: 0 10px;
  border: 1px solid #c9c9c9;
  border-radius: 8px;
  background: #ffffff;
  color: #303030;
  font: inherit;
  font-size: 13px;
  text-align: left;
}

.tk-date-single-trigger:hover {
  border-color: #9c9c9c;
  background: #fbfbfb;
}

.tk-date-single-trigger:focus {
  border-color: #303030;
  box-shadow: 0 0 0 2px rgba(48, 48, 48, .12);
  outline: 0;
}

.tk-date-single-trigger span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-date-single-trigger i {
  color: #5c5f62;
  font-size: 14px;
  justify-self: end;
}

.tk-date-single-popover {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  left: 0;
  width: 320px;
  padding: 12px;
  border: 1px solid var(--tk-border-strong);
  border-radius: 8px;
  background: #ffffff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
}

.tk-date-single-popover[hidden] {
  display: none;
}

.tk-date-single-popover .tk-date-filter-actions {
  margin-top: 10px;
}

.tk-issue-date-picker {
  width: 100%;
}

.tk-issue-date-trigger {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  font: inherit;
  font-size: 13px;
  font-weight: 650;
  width: 100%;
}

.tk-issue-date-trigger:hover,
.tk-issue-date-trigger[aria-expanded="true"] {
  border-color: #9c9c9c;
  background: #f6f6f6;
}

.tk-issue-date-trigger strong {
  margin-left: auto;
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 650;
}

.tk-issue-date-trigger i {
  color: var(--tk-muted);
  font-size: 11px;
}

.tk-bulk-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid #d8d8d8;
  background: #f7f7f7;
}

.tk-bulk-bar strong {
  margin-right: 4px;
  font-size: 13px;
}

.tk-bulk-check.form-check-input {
  border-color: #616161;
  height: 20px;
  margin: 0 2px 0 0;
  width: 20px;
}

.tk-bulk-check.form-check-input:checked,
.tk-bulk-check.form-check-input:indeterminate {
  background-color: #303030;
  border-color: #303030;
}

.tk-product-check-wrap {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  vertical-align: middle;
}

.tk-product-check-wrap.is-header {
  border-radius: 9px;
  padding: 5px;
  transition: background .14s ease, box-shadow .14s ease;
}

.tk-product-check-wrap.is-header:has(.tk-product-check:checked),
.tk-product-check-wrap.is-header:has(.tk-product-check:indeterminate) {
  background: #e8e8e8;
  box-shadow: 0 0 0 1px rgba(48, 48, 48, .08);
}

.tk-product-check.form-check-input {
  background-position: center;
  background-size: 14px 14px;
  border: 1px solid #8c9196;
  border-radius: 6px;
  box-shadow: none;
  cursor: pointer;
  height: 22px;
  margin: 0;
  transition: background-color .12s ease, border-color .12s ease, box-shadow .12s ease;
  width: 22px;
}

.tk-product-check.form-check-input:checked,
.tk-product-check.form-check-input:indeterminate {
  background-color: #303030;
  border-color: #303030;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08);
}

.tk-product-check.form-check-input:focus-visible {
  border-color: #303030;
  box-shadow: 0 0 0 3px rgba(48, 48, 48, .16);
  outline: none;
}

.tk-bulk-scope-picker {
  position: relative;
}

.tk-bulk-scope-picker summary {
  align-items: center;
  background: #e8e8e8;
  border-radius: 10px;
  color: #303030;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 650;
  gap: 7px;
  height: 32px;
  list-style: none;
  padding: 0 11px;
}

.tk-bulk-scope-picker summary::-webkit-details-marker {
  display: none;
}

.tk-bulk-scope-picker summary i {
  font-size: 11px;
  transition: transform .14s ease;
}

.tk-bulk-scope-picker[open] summary i {
  transform: rotate(180deg);
}

.tk-bulk-scope-menu {
  background: #fff;
  border: 1px solid #d7d7d7;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
  left: 0;
  min-width: 310px;
  padding: 7px;
  position: absolute;
  top: calc(100% + 7px);
  z-index: 80;
}

.tk-bulk-scope-menu button {
  background: transparent;
  border: 0;
  border-radius: 8px;
  color: #303030;
  display: block;
  font-size: 13px;
  padding: 9px 10px;
  text-align: left;
  width: 100%;
}

.tk-bulk-scope-menu button:hover,
.tk-bulk-scope-menu button:focus-visible {
  background: #f1f1f1;
  outline: none;
}

.tk-bulk-scope-menu button[hidden] {
  display: none;
}

.tk-danger-btn {
  border-color: #f1c9c9;
  color: #8a1f11;
}

.tk-danger-btn:hover,
.tk-danger-btn:focus {
  border-color: #e4aaa5;
  background: #fff1f0;
  color: #6f160c;
}

.tk-list-table-wrap {
  position: relative;
  z-index: 1;
  background: #ffffff;
}

.tk-list-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-top: 1px solid var(--tk-border);
  border-radius: 0 0 calc(var(--tk-radius) - 1px) calc(var(--tk-radius) - 1px);
  background: #ffffff;
  color: var(--tk-muted);
  font-size: 13px;
}

.tk-list-pagination nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

.tk-page-btn,
.tk-page-number,
.tk-page-gap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  border-radius: var(--tk-radius-sm);
  font-size: 13px;
  font-weight: 650;
}

.tk-page-btn,
.tk-page-number {
  border: 1px solid var(--tk-border);
  background: #ffffff;
  color: var(--tk-text);
}

.tk-page-btn {
  gap: 5px;
  padding: 5px 10px;
}

.tk-page-number {
  min-width: 32px;
  padding: 5px 8px;
}

.tk-page-number.current {
  border-color: #303030;
  background: #303030;
  color: #ffffff;
}

.tk-page-btn:hover,
.tk-page-number:hover {
  background: #f6f6f7;
  color: var(--tk-text);
}

.tk-page-number.current:hover {
  background: #303030;
  color: #ffffff;
}

.tk-page-btn.disabled {
  border-color: #eeeeee;
  background: #f7f7f7;
  color: #a0a0a0;
  cursor: default;
}

.tk-page-gap {
  min-width: 18px;
  color: var(--tk-muted);
}

.tk-screen-alert {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  padding: 10px 12px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  font-size: 13px;
}

.tk-screen-alert.success {
  border-color: #b7e3c4;
  background: #f1fbf4;
}

.tk-screen-alert.danger {
  border-color: #f2b8b5;
  background: #fff4f4;
}

.tk-screen-alert.warning {
  border-color: #e8d48a;
  background: #fff9df;
}

.tk-inventory-page .tk-muted-line {
  max-width: none;
}

.tk-inventory-config-list tbody tr[data-config-row] {
  cursor: pointer;
}

.tk-inventory-config-list tbody tr[data-config-row]:focus-visible {
  outline: 2px solid #303030;
  outline-offset: -2px;
}

.tk-config-modal {
  border: 1px solid var(--tk-border);
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .22);
}

.tk-config-modal .modal-header {
  align-items: flex-start;
  padding: 16px 18px 12px;
}

.tk-config-modal .modal-header h2 {
  margin: 0;
  color: var(--tk-text);
  font-size: 17px;
  font-weight: 700;
}

.tk-config-modal .modal-header p {
  margin: 3px 0 0;
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-config-modal .modal-body {
  padding: 16px 18px;
}

.tk-config-form-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}

.tk-config-form-row.single {
  grid-template-columns: minmax(0, 1fr);
}

.tk-config-status-field {
  display: flex;
  align-items: flex-end;
}

.tk-config-status-field .tk-switch-field.compact {
  width: 100%;
}

.tk-config-modal .tk-switch-field.compact {
  display: flex;
  min-height: 36px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 0;
}

.tk-config-modal .tk-switch-field.compact > span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 650;
}

.tk-config-modal .tk-switch-field.compact > span strong {
  font: inherit;
}

.tk-config-modal .tk-switch-field.compact > span small {
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 550;
}

.tk-config-modal .tk-switch-field.compact > input[type="checkbox"] {
  flex: 0 0 34px;
  margin-left: auto;
}

.tk-config-modal .modal-footer {
  gap: 8px;
  padding: 12px 18px;
}

.tk-inventory-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}

.tk-inventory-metrics article {
  display: grid;
  gap: 3px;
  padding: 12px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  box-shadow: var(--tk-shadow-card);
}

.tk-inventory-metrics span {
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 650;
}

.tk-inventory-metrics strong {
  color: var(--tk-text);
  font-size: 18px;
}

.tk-summary-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 14px;
}

.tk-summary-metrics article {
  display: grid;
  align-content: center;
  min-height: 76px;
  gap: 4px;
  padding: 12px 14px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius);
  background: var(--tk-surface);
  box-shadow: var(--tk-shadow-card);
}

.tk-summary-metrics span {
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 650;
}

.tk-summary-metrics strong {
  color: var(--tk-text);
  font-size: 19px;
  font-weight: 750;
  line-height: 1.15;
}

.tk-summary-metrics strong.is-negative {
  color: #b3261e;
}

.tk-progress-track {
  width: 100%;
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: #e7e7e7;
}

.tk-progress-track span {
  display: block;
  width: var(--tk-progress, 0%);
  height: 100%;
  border-radius: inherit;
  background: #303030;
}

.tk-order-price-progress {
  margin: 0 14px 12px;
  padding: 10px 14px;
  border: 1px solid #e3e3e3;
  border-radius: 10px;
  background: #f7f7f7;
}

.tk-order-price-progress-copy {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 6px;
}

.tk-order-price-progress-copy div {
  display: grid;
  gap: 1px;
}

.tk-order-price-progress-copy span,
.tk-order-price-progress small {
  color: #616161;
  font-size: 12px;
}

.tk-order-price-progress-copy strong {
  font-size: 14px;
}

.tk-order-price-progress > small {
  display: block;
  margin-top: 6px;
}

.tk-inventory-form-card {
  margin-bottom: 12px;
  padding: 0;
  overflow: visible;
}

.tk-inventory-config-menu {
  min-width: 210px;
  padding: 6px;
  border: 1px solid var(--tk-border);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}

.tk-inventory-config-menu .dropdown-item {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 34px;
  padding: 7px 9px;
  border-radius: 7px;
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 600;
}

.tk-inventory-config-menu .dropdown-item.active,
.tk-inventory-config-menu .dropdown-item:active {
  background: #303030;
  color: #ffffff;
}

.tk-inventory-focus-body {
  min-height: 100vh;
  margin: 0;
  overflow-x: clip;
  background: var(--tk-bg);
  color: var(--tk-text);
}

.tk-inventory-focus-main {
  min-height: 100vh;
}

.tk-inventory-focus-shell {
  width: min(100%, 1480px);
  min-height: 100vh;
  margin: 0 auto;
  padding: 0 24px 40px;
}

.tk-inventory-focus-header {
  position: sticky;
  z-index: 50;
  top: 0;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  width: 100vw;
  min-height: 56px;
  margin: 0 calc(50% - 50vw) 24px;
  padding: 0 20px;
  border-bottom: 0;
  background: var(--tk-black);
  color: #f7f7f7;
}

.tk-inventory-focus-header > .tk-header-actions {
  justify-self: end;
}

.tk-inventory-focus-header > .btn {
  width: auto;
  justify-self: end;
}

.tk-inventory-focus-header .tk-soft-btn {
  min-height: 32px;
  padding: 5px 10px;
  border-color: var(--tk-topbar-border);
  border-radius: 7px;
  background: var(--tk-topbar-control);
  color: #f2f2f2;
  box-shadow: none;
}

.tk-inventory-focus-header .tk-soft-btn:hover {
  border-color: #686868;
  background: #383838;
  color: #ffffff;
}

.tk-inventory-focus-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 21px;
  font-style: italic;
}

.tk-inventory-focus-brand span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 9px;
  background: var(--tk-purple);
  color: #ffffff;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
}

.tk-inventory-focus-title {
  display: grid;
  justify-items: center;
  gap: 1px;
}

.tk-inventory-focus-title span {
  color: #a9a9ad;
  font-size: 11px;
}

.tk-inventory-focus-title strong {
  color: #ffffff;
  font-size: 13px;
}

.tk-inventory-focus-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 18px;
}

.tk-inventory-focus-intro.compact {
  margin-bottom: 12px;
}

.tk-inventory-focus-intro h1 {
  margin: 3px 0 4px;
  font-size: 22px;
}

.tk-inventory-focus-intro p {
  margin: 0;
  color: var(--tk-muted);
  font-size: 13px;
}

.tk-eyebrow {
  color: var(--tk-muted);
  font-size: 11px;
  font-weight: 750;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.tk-inventory-live {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 32px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #e4f5e9;
  color: #146c3a;
  font-size: 12px;
  font-weight: 700;
}

.tk-inventory-live i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #1a8f4c;
  box-shadow: 0 0 0 4px rgba(26, 143, 76, .12);
}

.tk-inventory-setup {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
  gap: 16px;
  align-items: start;
}

.tk-inventory-setup-card,
.tk-inventory-setup-side {
  overflow: visible;
}

.tk-inventory-setup-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 16px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-inventory-setup-card > header div {
  display: grid;
  gap: 3px;
}

.tk-inventory-setup-card > header strong {
  font-size: 14px;
}

.tk-inventory-setup-card > header span:not(.tk-badge) {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-inventory-setup-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding: 18px;
}

.tk-inventory-setup-fields .tk-field {
  display: grid;
  gap: 6px;
  margin: 0;
}

.tk-inventory-setup-fields .tk-field > span {
  font-size: 12px;
  font-weight: 700;
}

.tk-inventory-setup-fields .tk-field > small {
  color: var(--tk-muted);
  font-size: 11px;
  line-height: 1.4;
}

.tk-inventory-setup-fields input,
.tk-inventory-setup-fields select {
  width: 100%;
  min-height: 36px;
  padding: 7px 9px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  font: inherit;
}

.tk-inventory-setup-side {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.tk-inventory-setup-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 10px;
  background: #efefef;
  font-size: 20px;
}

.tk-inventory-setup-side strong {
  font-size: 14px;
}

.tk-inventory-setup-side p {
  margin: 4px 0 0;
  color: var(--tk-muted);
  font-size: 12px;
  line-height: 1.5;
}

.tk-inventory-setup-side ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 12px 0;
  border-top: 1px solid var(--tk-border);
  border-bottom: 1px solid var(--tk-border);
  list-style: none;
}

.tk-inventory-setup-side li {
  display: flex;
  gap: 8px;
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-inventory-setup-side li i {
  color: #0b6b3a;
}

.tk-inventory-wizard {
  width: min(100%, 560px);
  margin: 0 auto;
  padding: 28px 0 48px;
}

.tk-inventory-wizard-heading {
  margin-bottom: 22px;
}

.tk-inventory-wizard-heading h1 {
  margin: 4px 0;
  font-size: clamp(24px, 6vw, 32px);
  letter-spacing: -.035em;
}

.tk-inventory-wizard-heading p,
.tk-wizard-step-title p {
  margin: 0;
  color: var(--tk-muted);
  font-size: 13px;
}

.tk-wizard-progress {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: 22px 0 14px;
}

.tk-wizard-progress > div {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 5px;
  color: #8a8b90;
  font-size: 11px;
}

.tk-wizard-progress > div::before {
  position: absolute;
  top: 13px;
  right: 50%;
  left: -50%;
  height: 2px;
  background: #dedfe1;
  content: "";
}

.tk-wizard-progress > div:first-child::before {
  display: none;
}

.tk-wizard-progress span {
  z-index: 1;
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 2px solid #dedfe1;
  border-radius: 50%;
  background: #fff;
  font-weight: 800;
}

.tk-wizard-progress .is-active,
.tk-wizard-progress .is-complete {
  color: var(--tk-text);
  font-weight: 700;
}

.tk-wizard-progress .is-active span,
.tk-wizard-progress .is-complete span {
  border-color: #262626;
  background: #262626;
  color: #fff;
}

.tk-wizard-progress .is-complete::before {
  background: #262626;
}

.tk-wizard-step {
  display: grid;
  gap: 18px;
  padding: 20px;
  border: 1px solid var(--tk-border);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
}

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

.tk-wizard-step-title {
  display: grid;
  gap: 3px;
}

.tk-wizard-step-title > span {
  color: var(--tk-muted);
  font-size: 11px;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.tk-wizard-step-title h2 {
  margin: 0;
  font-size: 20px;
  letter-spacing: -.02em;
}

.tk-wizard-step .tk-field {
  display: grid;
  gap: 7px;
  margin: 0;
}

.tk-wizard-step .tk-field > span {
  font-size: 12px;
  font-weight: 750;
}

.tk-wizard-step input,
.tk-wizard-step select,
.tk-store-gate select {
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  border: 1px solid var(--tk-border-strong);
  border-radius: 10px;
  background: #fff;
  color: var(--tk-text);
  font: inherit;
}

.tk-count-methods {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.tk-count-methods label {
  cursor: pointer;
}

.tk-count-methods input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.tk-count-methods label > span {
  display: grid;
  min-height: 114px;
  align-content: start;
  gap: 4px;
  padding: 14px;
  border: 1px solid var(--tk-border);
  border-radius: 12px;
  background: #fff;
}

.tk-count-methods i {
  margin-bottom: 6px;
  font-size: 20px;
}

.tk-count-methods strong {
  font-size: 13px;
}

.tk-count-methods small {
  color: var(--tk-muted);
  font-size: 11px;
  line-height: 1.35;
}

.tk-count-methods input:checked + span {
  border-color: #242424;
  box-shadow: 0 0 0 1px #242424;
  background: #f7f7f7;
}

.tk-method-value {
  padding-top: 2px;
}

.tk-product-picker {
  display: grid;
  max-height: 280px;
  overflow-y: auto;
  border: 1px solid var(--tk-border);
  border-radius: 10px;
  background: #fff;
}

.tk-product-picker label {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 9px;
  align-items: center;
  min-height: 46px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--tk-border);
  cursor: pointer;
}

.tk-product-picker label:last-child {
  border-bottom: 0;
}

.tk-product-picker label[hidden] {
  display: none;
}

.tk-product-picker input {
  width: 18px;
  min-height: 18px;
  height: 18px;
  padding: 0;
  accent-color: #242424;
}

.tk-product-picker span {
  display: grid;
  gap: 2px;
  font-size: 12px;
  line-height: 1.35;
}

.tk-product-picker span strong {
  font-weight: 600;
}

.tk-product-picker span small {
  color: var(--tk-muted);
  font-size: 11px;
}

.tk-product-picker label:has(input:checked) {
  background: #f2f2f2;
}

.tk-wizard-actions {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
}

.tk-wizard-next,
.tk-wizard-start,
.tk-store-gate .tk-primary-btn {
  width: 100%;
  min-height: 48px;
}

.tk-wizard-summary {
  display: grid;
  gap: 0;
  margin: 0;
  border-top: 1px solid var(--tk-border);
}

.tk-wizard-summary > div {
  display: grid;
  grid-template-columns: 100px 1fr;
  gap: 12px;
  padding: 13px 0;
  border-bottom: 1px solid var(--tk-border);
}

.tk-wizard-summary dt {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-wizard-summary dd {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  text-align: right;
}

.tk-link-btn {
  border: 0;
  background: transparent;
  color: var(--tk-muted);
  text-decoration: none;
}

.tk-store-gate {
  position: fixed;
  z-index: 1100;
  inset: 56px 0 0;
  display: none;
  place-items: center;
  padding: 16px;
  background: rgba(247, 247, 248, .98);
}

.tk-store-gate.is-open {
  display: grid;
}

.tk-store-gate > div {
  display: grid;
  width: min(100%, 440px);
  gap: 16px;
  padding: 22px;
  border: 1px solid var(--tk-border);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .12);
}

.tk-store-gate h2 {
  margin: -8px 0 0;
  font-size: 22px;
}

.tk-store-gate p {
  margin: -10px 0 2px;
  color: var(--tk-muted);
  font-size: 13px;
}

.tk-store-gate .tk-field {
  display: grid;
  gap: 7px;
}

.tk-store-gate .tk-field span {
  font-size: 12px;
  font-weight: 750;
}

.tk-inventory-form-card header,
.tk-card-title-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-inventory-form-card header span,
.tk-card-title-row span {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-card-title-row > div {
  display: grid;
  gap: 2px;
}

.tk-inventory-form-grid,
.tk-inventory-stack {
  display: grid;
  gap: 12px;
  padding: 12px;
}

.tk-inventory-form-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) auto;
  align-items: end;
}

.tk-inventory-form-grid label,
.tk-inventory-stack label {
  display: grid;
  gap: 5px;
  margin: 0;
  color: var(--tk-text);
  font-size: 12px;
  font-weight: 700;
}

.tk-inventory-form-grid input,
.tk-inventory-form-grid select,
.tk-inventory-stack input,
.tk-inventory-stack select,
.tk-inventory-stack textarea {
  width: 100%;
  min-height: 36px;
  padding: 7px 9px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  font: inherit;
  font-weight: 500;
}

.tk-inventory-split {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(340px, .8fr);
  gap: 12px;
  align-items: start;
}

.tk-inventory-list {
  display: grid;
}

.tk-inventory-list article {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 12px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-inventory-list article:last-child {
  border-bottom: 0;
}

.tk-inventory-list article div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.tk-inventory-list article strong,
.tk-inventory-list article span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-inventory-list article span,
.tk-inventory-list aside small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-inventory-list aside {
  display: grid;
  justify-items: end;
  gap: 6px;
}

.tk-check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.tk-check-grid label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  padding: 7px 8px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
}

.tk-check-grid input[type="checkbox"] {
  flex: 0 0 16px;
  width: 16px;
  min-height: 16px;
  margin: 0;
  accent-color: #303030;
}

.tk-check-grid label span {
  min-width: 0;
  overflow: hidden;
  font-weight: 550;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-field-group {
  display: grid;
  gap: 7px;
}

.tk-field-label {
  color: var(--tk-text);
  font-size: 12px;
  font-weight: 700;
}

.tk-field-group > small {
  color: var(--tk-muted);
  font-size: 11px;
  line-height: 1.4;
}

.tk-context-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  padding: 9px 10px;
  border-radius: var(--tk-radius-sm);
  background: #f3f3f3;
  color: var(--tk-muted);
  font-size: 12px;
  line-height: 1.4;
}

.tk-context-note[hidden] {
  display: none;
}

.tk-switch-line {
  display: flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 8px;
}

.tk-switch-line input {
  width: 38px;
  min-height: 20px;
  accent-color: #303030;
}

.tk-inventory-count-table {
  min-width: 1060px;
}

.tk-count-heading {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  width: min(100%, 760px); margin: 14px auto;
}
.tk-count-heading > div { display: grid; gap: 2px; }
.tk-count-heading strong { font-size: 15px; }
.tk-count-heading span { color: var(--tk-muted); font-size: 11px; }
.tk-count-workspace { width: min(100%, 760px); margin: 0 auto; padding-bottom: 76px; }
.tk-count-scanner {
  position: sticky; z-index: 20; top: 62px;
  display: grid; grid-template-columns: 22px 1fr 32px; align-items: center;
  min-height: 54px; padding: 7px 10px; border: 1px solid var(--tk-border-strong);
  border-radius: 12px 12px 0 0; background: #fff; box-shadow: 0 4px 14px rgba(0,0,0,.06);
}
.tk-count-scanner > i { color: #606166; font-size: 18px; }
.tk-count-scanner input { min-width: 0; height: 38px; border: 0; outline: 0; background: transparent; font-size: 14px; }
.tk-count-scanner button {
  display: grid; width: 32px; height: 32px; place-items: center;
  border: 0; border-radius: 8px; background: #f1f1f2; color: #55565a;
}
.tk-count-scanner small { grid-column: 1 / -1; color: var(--tk-muted); font-size: 11px; }
.tk-count-scanner small:empty { display: none; }
.tk-count-scanner small.success { color: #08783e; }
.tk-count-scanner small.error { color: #b3261e; }

.tk-location-scanner-page { min-height: 100vh; }
.tk-location-scanner-workspace { width: min(100%, 680px); margin: 0 auto; padding: 28px 20px 48px; display: grid; gap: 18px; }
.tk-location-scanner-progress { display: flex; align-items: center; justify-content: center; gap: 10px; color: #8c9196; }
.tk-location-scanner-progress > div { display: flex; align-items: center; gap: 7px; font-size: 12px; }
.tk-location-scanner-progress span { width: 25px; height: 25px; border-radius: 50%; display: grid; place-items: center; background: #e1e3e5; font-weight: 700; }
.tk-location-scanner-progress .active { color: #202223; }
.tk-location-scanner-progress .active span { background: #303030; color: #fff; }
.tk-location-scanner-progress .complete span { background: #aee9d1; color: #006e52; }
.tk-location-scan-card { padding: 34px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.tk-location-scan-card[hidden] { display: none; }
.tk-location-scan-icon { width: 68px; height: 68px; border-radius: 18px; display: grid; place-items: center; background: #f1f2f3; color: #303030; font-size: 31px; margin-bottom: 18px; }
.tk-location-scan-card.success .tk-location-scan-icon { background: #aee9d1; color: #006e52; }
.tk-location-scan-kicker { color: #616a75; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.tk-location-scan-card h1 { font-size: 25px; margin: 6px 0 8px; }
.tk-location-scan-card > p { color: #616a75; max-width: 500px; margin: 0 0 24px; }
.tk-location-scan-input { width: 100%; min-height: 58px; border: 2px solid #8c9196; border-radius: 12px; padding: 0 16px; display: flex; align-items: center; gap: 12px; background: #fff; box-shadow: 0 0 0 4px rgba(48,48,48,.04); }
.tk-location-scan-input:focus-within { border-color: #303030; box-shadow: 0 0 0 4px rgba(48,48,48,.12); }
.tk-location-scan-input i { font-size: 22px; }
.tk-location-scan-input input { width: 100%; border: 0; outline: 0; font-size: 17px; background: transparent; }
.tk-location-scan-card > small { min-height: 20px; margin-top: 10px; color: #616a75; }
.tk-location-scan-card > small.error { color: #b3261e; font-weight: 650; }
.tk-location-selected-product { width: 100%; display: grid; grid-template-columns: 42px 1fr 34px; align-items: center; gap: 10px; text-align: left; padding: 12px; margin-bottom: 24px; background: #f6f6f7; border-radius: 10px; }
.tk-location-selected-product > div { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 8px; background: #fff; }
.tk-location-selected-product span { min-width: 0; display: flex; flex-direction: column; }
.tk-location-selected-product small,.tk-location-selected-product em { color: #616a75; font-size: 11px; font-style: normal; }
.tk-location-selected-product strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tk-location-scan-result { width: 100%; display: grid; gap: 5px; margin: 14px 0 24px; padding: 18px; border-radius: 10px; background: #f1f8f5; color: #006e52; }
.tk-location-scan-result strong { font-size: 21px; }
@media (max-width: 680px) {
  .tk-location-scanner-page .tk-inventory-focus-header { grid-template-columns: 1fr auto; }
  .tk-location-scanner-page .tk-inventory-focus-brand { display: none; }
  .tk-location-scanner-workspace { padding: 18px 12px 32px; }
  .tk-location-scan-card { padding: 26px 18px; }
  .tk-location-scanner-progress strong { display: none; }
  .tk-location-scanner-progress { justify-content: space-around; }
  .tk-location-scan-input { min-height: 64px; }
  .tk-location-scan-input input { font-size: 18px; }
}

.tk-seo-preview {
  margin-top: 12px;
  padding: 14px 16px;
  border: 1px solid #dedede;
  border-radius: 10px;
  background: #fff;
  display: grid;
  gap: 3px;
}

.tk-seo-preview small { color: #6d7175; font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: .04em; }
.tk-seo-preview strong { color: #1a0dab; font-size: 17px; font-weight: 500; line-height: 1.3; }
.tk-seo-preview span { color: #188038; font-size: 12px; overflow-wrap: anywhere; }
.tk-seo-preview p { margin: 2px 0 0; color: #4d5156; font-size: 13px; line-height: 1.45; }

.tk-qr-batch-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 16px; align-items: start; }
.tk-qr-batch-layout .tk-list-filters { display: none; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 12px 16px; }
.tk-qr-batch-layout .tk-list-filters.is-open { display: grid; }
.tk-qr-batch-layout .tk-list-toolbar .tk-list-search button { border: 0; background: transparent; color: #8c9196; padding: 4px 7px; }
.tk-qr-selection-bar { margin: 0; }
.tk-qr-batch-settings { position: sticky; top: 72px; padding: 18px; display: grid; gap: 18px; }
.tk-qr-format-list { display: grid; gap: 8px; }
.tk-qr-format-list label { cursor: pointer; }
.tk-qr-format-list input { position: absolute; opacity: 0; pointer-events: none; }
.tk-qr-format-list label > span { min-height: 60px; display: grid; grid-template-columns: 36px 1fr; column-gap: 10px; align-items: center; padding: 10px; border: 1px solid #c9cccf; border-radius: 9px; background: #fff; }
.tk-qr-format-list label > span i { grid-row: 1 / 3; font-size: 21px; color: #616a75; text-align: center; }
.tk-qr-format-list label > span strong { align-self: end; }
.tk-qr-format-list label > span small { align-self: start; color: #616a75; }
.tk-qr-format-list input:checked + span { border-color: #303030; box-shadow: 0 0 0 1px #303030; background: #f6f6f7; }
.tk-qr-format-list input:focus-visible + span { outline: 2px solid #005bd3; outline-offset: 2px; }
@media (max-width: 980px) {
  .tk-qr-batch-layout { grid-template-columns: 1fr; }
  .tk-qr-batch-settings { position: static; order: -1; }
}
@media (max-width: 680px) {
  .tk-qr-batch-layout .tk-list-filters.is-open { grid-template-columns: 1fr; }
  .tk-qr-batch-page .tk-header-actions { width: 100%; }
  .tk-qr-batch-page .tk-header-actions .btn { width: 100%; }
}
.tk-count-list {
  overflow: hidden; border: 1px solid var(--tk-border); border-top: 0;
  border-radius: 0 0 12px 12px; background: #fff;
}
.tk-count-product {
  border-bottom: 1px solid #d9dade; background: #fff;
  transition: background-color .18s ease, box-shadow .18s ease;
}
.tk-count-product:last-of-type { border-bottom: 0; }
.tk-count-product[hidden] { display: none; }
.tk-count-product.is-counted { box-shadow: inset 3px 0 #228b55; }
.tk-count-product.is-scanned { background: #eaf8f0; }
.tk-count-product.is-missing .tk-count-product-info h2 { color: #b3261e; }
.tk-count-product.is-missing { box-shadow: inset 3px 0 #d82c20; }
.tk-count-product-info { display: grid; gap: 5px; padding: 11px 12px 9px; }
.tk-count-identifiers {
  display: flex; gap: 8px; overflow: hidden; color: #717277;
  font-size: 10px; white-space: nowrap;
}
.tk-count-identifiers strong { color: #303136; }
.tk-count-identifiers span { overflow: hidden; text-overflow: ellipsis; }
.tk-count-identifiers span + span { padding-left: 8px; border-left: 1px solid var(--tk-border); }
.tk-count-product-info h2 { margin: 0; font-size: 13px; font-weight: 720; line-height: 1.35; }
.tk-count-product-controls {
  display: grid; grid-template-columns: 1.15fr .9fr .9fr 64px;
  min-height: 68px; border-top: 1px solid #ececef;
}
.tk-count-product-controls > * { border-right: 1px solid #dedfe2; }
.tk-count-product-controls > *:last-child { border-right: 0; }

.tk-receipt-count-workspace { max-width: 880px; }
.tk-receipt-sticky-tools {
  display: grid;
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--tk-border);
  border-radius: 12px 12px 0 0;
  background: #fff;
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
}
.tk-receipt-sticky-tools .tk-count-scanner { border: 0; border-bottom: 1px solid var(--tk-border); border-radius: 0; }
.tk-receipt-tools {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--tk-border);
  background: #fff;
}
.tk-receipt-xml-state { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid #b8dfca; border-radius: 10px; background: #edf9f2; color: #174f32; font-size: 12px; }
.tk-receipt-xml-state > i { font-size: 20px; }
.tk-receipt-xml-state span { display: flex; flex-wrap: wrap; gap: 6px; }
.tk-receipt-controls { grid-template-columns: 1.15fr .85fr 1fr 1fr 1.05fr 52px; }
.tk-receipt-line-actions {
  position: absolute;
  right: 10px;
  bottom: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.tk-receipt-line-actions .tk-count-incident { position: static; }
.tk-receipt-line-actions [data-receipt-fill] {
  border-color: #b8dfca;
  background: #edf9f2;
  color: #08783e;
}
.tk-receipt-line-actions button:disabled { opacity: .62; }
.tk-receipt-list .tk-count-product-info h2 { padding-right: 190px; }
.tk-receipt-list .tk-count-product.is-complete {
  background: #eaf8f0;
  box-shadow: inset 3px 0 #08783e;
}
.tk-receipt-list .tk-count-product.is-complete .tk-counted-stat,
.tk-receipt-list .tk-count-product.is-complete .tk-receipt-state {
  background: #dff3e8;
  color: #08783e;
}
.tk-count-product.is-omitted { background: #f6f6f7; box-shadow: inset 3px 0 #8c9196; opacity: .78; }
.tk-count-product.is-omitted .tk-counted-stat input { color: #6d7175; }
.tk-receipt-notes { display: grid; gap: 6px; margin: 12px 0 142px; padding: 14px; border: 1px solid #dedfe2; border-radius: 12px; background: #fff; font-weight: 650; font-size: 12px; }
.tk-receipt-notes textarea { width: 100%; resize: vertical; border: 1px solid #c9cccf; border-radius: 8px; padding: 9px 11px; font: inherit; font-weight: 450; }
.tk-receipt-unmatched { display: grid; gap: 9px; }
.tk-receipt-unmatched-row { display: grid; grid-template-columns: minmax(0,1fr) minmax(220px,.8fr); gap: 12px; align-items: center; padding: 10px; border: 1px solid #dedfe2; border-radius: 9px; }
.tk-receipt-unmatched-row div { display: grid; gap: 3px; min-width: 0; }
.tk-receipt-unmatched-row span { color: #6d7175; font-size: 12px; }
.tk-receipt-unmatched-row select { width: 100%; min-height: 38px; border: 1px solid #c9cccf; border-radius: 8px; padding: 0 9px; background: #fff; }
@media (max-width: 760px) {
  .tk-receipt-tools { justify-content: stretch; }
  .tk-receipt-tools .btn { flex: 1; }
  .tk-receipt-controls { grid-template-columns: 1fr 1fr; }
  .tk-receipt-controls .tk-receipt-state { display: none; }
  .tk-receipt-unmatched-row { grid-template-columns: 1fr; }
}
.tk-count-stepper { display: grid; grid-template-rows: repeat(2, 1fr); }
.tk-count-stepper button {
  display: grid; min-width: 52px; place-items: center; border: 0;
  background: #f6f6f7; color: #303136; font-size: 16px;
}
.tk-count-stepper button:first-child { border-bottom: 1px solid #dedfe2; }
.tk-count-stepper button:active { background: #e4e4e6; }
.tk-count-stat { display: grid; place-content: center; gap: 3px; padding: 5px; text-align: center; }
.tk-count-stat span { color: var(--tk-muted); font-size: 9px; font-weight: 700; text-transform: uppercase; }
.tk-count-stat strong { font-size: 15px; }
.tk-counted-stat { background: #fafafa; }
.tk-counted-stat .tk-count-input {
  width: 100%; min-width: 0; height: 30px; min-height: 0; padding: 0 2px;
  border: 0; background: transparent; font-size: 17px; font-weight: 800; text-align: center;
}
.tk-receipt-cost-stat .tk-count-input {
  width: 100%;
  min-width: 0;
  height: 30px;
  min-height: 0;
  padding: 0 3px;
  border: 0;
  background: transparent;
  font-size: 13px;
  font-weight: 750;
  text-align: center;
}
.tk-receipt-confirm-total {
  display: grid;
  grid-template-columns: 1fr 1fr;
  overflow: hidden;
  margin-bottom: 16px;
  border: 1px solid var(--tk-border);
  border-radius: 9px;
}
.tk-receipt-confirm-total > div { display: grid; gap: 2px; padding: 12px; }
.tk-receipt-confirm-total > div + div { border-left: 1px solid var(--tk-border); background: #303030; color: #fff; text-align: right; }
.tk-receipt-confirm-total span { color: var(--tk-muted); font-size: 10px; font-weight: 700; text-transform: uppercase; }
.tk-receipt-confirm-total > div + div span { color: #d8d8d8; }
.tk-receipt-confirm-total strong { font-size: 20px; }
.tk-receipt-update-costs-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 16px;
  padding: 10px 0;
  border-top: 1px solid var(--tk-border);
  border-bottom: 1px solid var(--tk-border);
}
.tk-receipt-update-costs-row div { display: grid; gap: 2px; }
.tk-receipt-update-costs-row span { color: var(--tk-muted); font-size: 12px; }
.tk-count-photo {
  position: relative; display: grid; overflow: hidden; place-items: center;
  background: #f4f4f5; color: #a0a1a5; font-size: 18px;
}
.tk-count-photo img { position: absolute; width: 100%; height: 100%; object-fit: contain; background: #fff; }
.tk-count-photo img + i { display: none; }
.tk-count-empty { display: grid; justify-items: center; gap: 4px; padding: 34px 18px; text-align: center; }
.tk-count-empty[hidden] { display: none; }
.tk-count-empty i { color: #94959a; font-size: 24px; }
.tk-count-empty strong { font-size: 13px; }
.tk-count-empty span { color: var(--tk-muted); font-size: 11px; }
.tk-count-bottom-actions {
  position: fixed; z-index: 30; right: 0; bottom: 0; left: 0;
  display: grid; grid-template-columns: minmax(110px,.55fr) minmax(180px,1fr); gap: 8px;
  width: min(100%,760px); margin: auto; padding: 10px 12px;
  border: 1px solid var(--tk-border); border-bottom: 0; border-radius: 14px 14px 0 0;
  background: rgba(255,255,255,.96); box-shadow: 0 -8px 24px rgba(0,0,0,.09);
  backdrop-filter: blur(12px);
}
.tk-count-bottom-actions .btn { min-height: 46px; }
.tk-count-bottom-actions.tk-receipt-bottom-actions {
  grid-template-columns: minmax(110px,.65fr) minmax(150px,1fr) minmax(190px,1fr);
  width: min(100%,880px);
}
.tk-receipt-capture-summary {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  overflow: hidden;
  margin: -2px 0 2px;
  border: 1px solid var(--tk-border);
  border-radius: 9px;
  background: #f7f7f7;
}
.tk-receipt-capture-summary > div {
  display: grid;
  gap: 1px;
  padding: 8px 12px;
}
.tk-receipt-capture-summary > div + div { border-left: 1px solid var(--tk-border); }
.tk-receipt-capture-summary span,
.tk-receipt-capture-summary small { color: var(--tk-muted); font-size: 10px; }
.tk-receipt-capture-summary span { font-weight: 700; text-transform: uppercase; }
.tk-receipt-capture-summary strong { font-size: 16px; }
.tk-receipt-capture-summary .grand {
  background: #303030;
  color: #fff;
  text-align: right;
}
.tk-receipt-capture-summary .grand span,
.tk-receipt-capture-summary .grand small { color: #d8d8d8; }
.tk-receipt-capture-summary .grand strong { font-size: 20px; }
.tk-count-review-page { width: min(100%, 760px); margin: 0 auto; padding-bottom: 92px; }
.tk-count-review-page > header { display: grid; gap: 4px; margin: 18px 0 14px; }
.tk-count-review-page h1 { margin: 0; font-size: 24px; }
.tk-count-review-page > header p { margin: 0; color: var(--tk-muted); font-size: 12px; }
.tk-count-review-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.tk-count-review-metrics > div,
.tk-count-review-total {
  display: grid; gap: 5px; padding: 12px; border: 1px solid var(--tk-border);
  border-radius: 10px; background: #fff;
}
.tk-count-review-metrics span,
.tk-count-review-total span { color: var(--tk-muted); font-size: 10px; font-weight: 700; text-transform: uppercase; }
.tk-count-review-metrics strong,
.tk-count-review-total strong { font-size: 20px; }
.tk-count-review-metrics .danger { background: #fff5f4; color: #b3261e; }
.tk-count-review-metrics .warning { background: #fff8e6; color: #7a5200; }
.tk-count-review-total { grid-template-columns: 1fr auto; align-items: center; margin-top: 8px; }
.tk-count-review-list {
  overflow: hidden; margin-top: 12px; border: 1px solid var(--tk-border);
  border-radius: 12px; background: #fff;
}
.tk-count-review-list article {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px;
  padding: 11px 12px; border-bottom: 1px solid var(--tk-border);
}
.tk-count-review-list article:last-child { border-bottom: 0; }
.tk-count-review-list article > div { display: grid; gap: 2px; min-width: 0; }
.tk-count-review-list article > div span,
.tk-count-review-list article > div small { color: var(--tk-muted); font-size: 10px; }
.tk-count-review-list article > div strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.tk-count-review-list article.is-missing { box-shadow: inset 3px 0 #d82c20; }
.tk-count-review-list article.is-missing > div strong,
.tk-count-review-list article.is-missing > div small { color: #b3261e; }
.tk-count-review-list dl { display: grid; grid-template-columns: repeat(3, minmax(58px, auto)); margin: 0; }
.tk-count-review-list dl div { display: grid; gap: 2px; padding: 0 8px; border-left: 1px solid var(--tk-border); text-align: right; }
.tk-count-review-list dt { color: var(--tk-muted); font-size: 9px; text-transform: uppercase; }
.tk-count-review-list dd { margin: 0; font-size: 12px; font-weight: 750; }
.tk-count-review-list dd.negative { color: #b3261e; }
.tk-count-review-list dd.positive { color: #08783e; }
.tk-count-review-actions {
  position: fixed; z-index: 30; right: 0; bottom: 0; left: 0;
  display: grid; grid-template-columns: minmax(140px, .6fr) minmax(220px, 1fr); gap: 8px;
  width: min(100%, 760px); margin: auto; padding: 10px 12px;
  border: 1px solid var(--tk-border); border-bottom: 0; border-radius: 14px 14px 0 0;
  background: rgba(255,255,255,.96); box-shadow: 0 -8px 24px rgba(0,0,0,.09);
}
.tk-count-review-actions form { margin: 0; }
.tk-count-review-actions .btn { width: 100%; min-height: 46px; }

.tk-inventory-review-summary {
  display: grid;
  grid-template-columns: 1.25fr repeat(4, 1fr);
  gap: 8px;
  margin-bottom: 12px;
}
.tk-inventory-review-summary article {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid var(--tk-border);
  border-radius: 10px;
  background: #fff;
}
.tk-inventory-review-summary span {
  color: var(--tk-muted);
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
}
.tk-inventory-review-summary strong { font-size: 16px; }
.tk-inventory-review-summary article.danger { background: #fff5f4; color: #b3261e; }
.tk-inventory-review-summary article.warning { background: #fff8e6; color: #7a5200; }
.tk-review-missing-row td:nth-child(6) strong { color: #b3261e; }

.tk-inventory-detail-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid var(--tk-border);
  background: #ffffff;
}

.tk-inventory-detail-toolbar label {
  position: relative;
  margin: 0;
}

.tk-inventory-detail-toolbar i {
  position: absolute;
  top: 50%;
  left: 12px;
  color: var(--tk-muted);
  transform: translateY(-50%);
}

.tk-inventory-detail-toolbar input {
  width: 100%;
  min-height: 36px;
  padding: 7px 10px 7px 34px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
}

.tk-count-input {
  width: 108px;
  min-height: 34px;
  padding: 6px 8px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  text-align: right;
}

.tk-diff-value.positive {
  color: #14532d;
  font-weight: 750;
}

.tk-diff-value.negative {
  color: #b3261e;
  font-weight: 750;
}

@media (max-width: 1100px) {
  .tk-inventory-form-grid,
  .tk-inventory-split,
  .tk-inventory-setup,
  .tk-inventory-metrics,
  .tk-summary-metrics {
    grid-template-columns: 1fr;
  }

  .tk-inventory-setup-fields {
    grid-template-columns: 1fr;
  }
}

/* Shipping workflow */
.tk-shipping-header {
  margin-bottom: 14px;
}

.tk-shipping-steps {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
  padding: 12px 16px;
  border: 1px solid #dedede;
  border-radius: 12px;
  background: #fff;
}

.tk-shipping-steps > div {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  color: #797979;
}

.tk-shipping-steps > div > span {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  place-items: center;
  border: 1px solid #c9c9c9;
  border-radius: 50%;
  background: #f7f7f7;
  color: #616161;
  font-size: 12px;
  font-weight: 700;
}

.tk-shipping-steps > div > div {
  display: grid;
  line-height: 1.2;
}

.tk-shipping-steps strong {
  color: inherit;
  font-size: 13px;
}

.tk-shipping-steps small {
  margin-top: 3px;
  color: #8a8a8a;
  font-size: 11px;
}

.tk-shipping-steps > i {
  color: #b8b8b8;
  font-size: 11px;
}

.tk-shipping-steps > div.is-active {
  color: #202223;
}

.tk-shipping-steps > div.is-active > span {
  border-color: #303030;
  background: #303030;
  color: #fff;
}

.tk-shipping-steps > div.is-done > span {
  border-color: #95c9a5;
  background: #eaf6ed;
  color: #207a3c;
}

.tk-shipping-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 300px;
  gap: 16px;
  align-items: start;
}

.tk-shipping-main form {
  display: grid;
  gap: 16px;
}

.tk-shipping-section {
  overflow: visible;
}

.tk-shipping-section .tk-card-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 66px;
  padding: 12px 16px;
  border-bottom: 1px solid #e5e5e5;
  box-sizing: border-box;
}

.tk-section-heading {
  display: flex;
  align-items: center;
  gap: 11px;
}

.tk-section-heading > span,
.tk-shipping-summary-head > span {
  display: grid;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  place-items: center;
  border-radius: 8px;
  background: #f1f1f1;
  color: #303030;
}

.tk-section-heading h2 {
  margin: 0;
  color: #202223;
  font-size: 14px;
  font-weight: 700;
}

.tk-section-heading p {
  margin: 2px 0 0;
  color: #6d6d6d;
  font-size: 12px;
}

.tk-shipping-section > .tk-form-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 18px;
}

.tk-shipping-route-section > .tk-form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tk-shipping-package-grid {
  display: grid;
  gap: 14px;
  padding: 18px;
}

.tk-shipping-measures-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.tk-shipping-content-row {
  display: grid;
  grid-template-columns: minmax(200px, 0.72fr) minmax(0, 1.28fr);
  gap: 14px;
}

.tk-shipping-content-row .tk-autocomplete {
  width: 100%;
}

.tk-shipping-content-row .tk-autocomplete-menu {
  max-height: 280px;
  overflow-y: auto;
}

.tk-shipping-section .tk-card-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
  padding: 14px 18px;
  border-top: 1px solid #e5e5e5;
  background: #fafafa;
  border-radius: 0 0 12px 12px;
}

.tk-shipping-quote-actions .tk-switch-field {
  margin: 0;
}

.tk-shipping-summary {
  position: sticky;
  top: 72px;
  overflow: hidden;
  border: 1px solid #d8d8d8;
  border-radius: 12px;
  background: #fff;
}

.tk-shipping-summary-head {
  display: flex;
  align-items: center;
  gap: 10px;
  height: 66px;
  padding: 12px 16px;
  border-bottom: 1px solid #e5e5e5;
  box-sizing: border-box;
}

.tk-shipping-summary-head > div {
  display: grid;
}

.tk-shipping-summary-head strong {
  color: #202223;
  font-size: 13px;
}

.tk-shipping-summary-head small {
  color: #777;
  font-size: 11px;
}

.tk-shipping-summary dl {
  margin: 0;
  padding: 4px 16px;
}

.tk-shipping-summary dl > div {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 10px;
  padding: 11px 0;
  border-bottom: 1px solid #ececec;
}

.tk-shipping-summary dt {
  color: #727272;
  font-size: 11px;
  font-weight: 500;
}

.tk-shipping-summary dd {
  margin: 0;
  color: #303030;
  font-size: 12px;
  font-weight: 650;
  text-align: right;
  overflow-wrap: anywhere;
}

.tk-shipping-summary-total {
  display: grid;
  gap: 2px;
  padding: 16px;
  background: #f5f5f5;
}

.tk-shipping-summary-total span,
.tk-shipping-summary-total small {
  color: #6d6d6d;
  font-size: 11px;
}

.tk-shipping-summary-total strong {
  color: #202223;
  font-size: 24px;
  line-height: 1.15;
  letter-spacing: -.02em;
}

.tk-shipping-summary-note {
  display: flex;
  gap: 7px;
  margin: 0;
  padding: 12px 16px;
  color: #676767;
  font-size: 11px;
  line-height: 1.45;
}

.tk-shipping-rates {
  display: grid;
  gap: 8px;
  padding: 12px;
}

.tk-shipping-rate {
  display: grid;
  grid-template-columns: 26px minmax(160px, 1fr) minmax(130px, .65fr) minmax(120px, auto);
  align-items: center;
  gap: 12px;
  min-height: 64px;
  padding: 10px 12px;
  border: 1px solid #dedede;
  border-radius: 9px;
  background: #fff;
  cursor: pointer;
  transition: border-color 160ms ease, background-color 160ms ease;
}

.tk-shipping-rate:hover {
  border-color: #a9a9a9;
  background: #fafafa;
}

.tk-shipping-rate-carrier {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.tk-shipping-rate-carrier > span:last-child {
  display: grid;
  min-width: 0;
}

.tk-shipping-carrier-mark {
  width: 5px;
  height: 34px;
  flex: 0 0 5px;
  border-radius: 999px;
  background: #8a8a8a;
}

.tk-shipping-carrier-mark.is-dhl {
  background: linear-gradient(180deg, #ffcc00 0 55%, #d40511 55%);
}

.tk-shipping-carrier-mark.is-estafeta {
  background: #e2231a;
}

.tk-shipping-carrier-mark.is-fedex {
  background: linear-gradient(180deg, #4d148c 0 55%, #ff6600 55%);
}

.tk-shipping-carrier-mark.is-paquetexpress {
  background: #0878c9;
}

.tk-shipping-carrier-mark.is-ups {
  background: #351c15;
}

.tk-shipping-rate.is-selected {
  border-color: #303030;
  background: #f4f4f4;
}

.tk-shipping-rate > input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.tk-shipping-rate-check {
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border: 1px solid #b9b9b9;
  border-radius: 50%;
  background: #fff;
  color: transparent;
  font-size: 12px;
}

.tk-shipping-rate.is-selected .tk-shipping-rate-check {
  border-color: #303030;
  background: #303030;
  color: #fff;
}

.tk-shipping-rate-price {
  display: grid;
  gap: 2px;
}

.tk-shipping-change-rate {
  min-height: 32px;
}

.tk-shipping-address-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  padding: 18px;
}

.tk-shipping-address-group {
  min-width: 0;
}

.tk-shipping-address-group + .tk-shipping-address-group {
  padding-left: 24px;
  border-left: 1px solid #e5e5e5;
}

.tk-shipping-address-title {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 14px;
}

.tk-shipping-address-title > span {
  display: grid;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  place-items: center;
  border-radius: 8px;
  background: #f1f1f1;
  color: #303030;
}

.tk-shipping-address-title h3 {
  margin: 0;
  color: #202223;
  font-size: 13px;
  font-weight: 700;
}

.tk-shipping-address-title p {
  margin: 1px 0 0;
  color: #777;
  font-size: 11px;
}

.tk-shipping-address-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.tk-shipping-address-fields .tk-field:last-child:nth-child(odd) {
  grid-column: 1 / -1;
}

.tk-shipping-confirm-modal .modal-header {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 12px;
  padding: 18px;
  border-bottom: 1px solid #e5e5e5;
}

.tk-shipping-confirm-modal .modal-title {
  margin: 0;
  color: #202223;
  font-size: 16px;
  font-weight: 750;
}

.tk-shipping-confirm-modal .modal-header p {
  margin: 3px 0 0;
  color: #6d6d6d;
  font-size: 12px;
}

.tk-shipping-confirm-modal .modal-body {
  padding: 8px 18px;
}

.tk-shipping-confirm-summary {
  margin: 0;
}

.tk-shipping-confirm-summary > div {
  display: grid;
  grid-template-columns: 130px minmax(0, 1fr);
  gap: 16px;
  padding: 10px 0;
  border-bottom: 1px solid #ececec;
}

.tk-shipping-confirm-summary dt {
  color: #727272;
  font-size: 12px;
  font-weight: 500;
}

.tk-shipping-confirm-summary dd {
  margin: 0;
  color: #303030;
  font-size: 12px;
  font-weight: 650;
  text-align: right;
  overflow-wrap: anywhere;
}

.tk-shipping-confirm-summary .is-total {
  border-bottom: 0;
}

.tk-shipping-confirm-summary .is-total dd {
  color: #202223;
  font-size: 18px;
  font-weight: 750;
}

.tk-shipping-confirm-modal .modal-footer {
  gap: 8px;
  padding: 12px 18px;
  border-top: 1px solid #e5e5e5;
}

.tk-import-modal.tk-order-shipping-modal .modal-body {
  display: grid;
  gap: 0;
  padding: 0;
  background: #fff;
}

.tk-order-shipping-modal {
  overflow: visible;
  border: 0;
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .22);
}

.tk-order-shipping-modal .modal-header {
  border-radius: 16px 16px 0 0;
}

.tk-order-shipping-modal .modal-footer {
  border-radius: 0 0 16px 16px;
  background: #fff;
}

.tk-order-shipping-modal .tk-rich-select-menu {
  z-index: 120;
}

.tk-order-shipping-modal form {
  display: block;
}

.tk-order-shipping-layout {
  display: grid !important;
  grid-template-columns: minmax(0, 1.55fr) minmax(290px, .7fr);
}

.tk-order-shipping-main {
  display: grid;
  align-content: start;
  gap: 14px;
  min-width: 0;
  padding: 16px 20px;
}

.tk-order-shipping-sidebar {
  min-width: 0;
  padding: 16px;
  border-left: 1px solid #e5e5e5;
  background: #f7f7f7;
}

.tk-order-shipping-sidebar-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.tk-order-shipping-sidebar-title > div {
  display: flex;
  align-items: center;
  gap: 8px;
}

.tk-order-shipping-sidebar-title strong {
  color: #202223;
  font-size: 14px;
}

.tk-order-shipping-package-head {
  margin-bottom: 18px;
}

.tk-order-shipping-ready {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #177245;
  font-size: 11px;
  font-weight: 650;
}

.tk-order-shipping-route {
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  gap: 5px;
  margin-top: 12px;
}

.tk-order-shipping-address {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 8px 10px;
  border: 1px solid #dedede;
  border-radius: 12px;
  background: #fff;
}

.tk-order-shipping-address > div {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.tk-order-shipping-address-icon {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 9px;
  color: #4a4a4a;
  background: #f1f1f1;
  font-size: 15px;
}

.tk-order-shipping-route span,
.tk-order-shipping-route small {
  color: #717171;
  font-size: 11px;
}

.tk-order-shipping-route strong {
  color: #202223;
  font-size: 14px;
}

.tk-order-shipping-direction {
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border: 1px solid #dedede;
  border-radius: 50%;
  color: #616161 !important;
  background: #fff;
  font-size: 12px !important;
  margin: -1px auto;
}

.tk-order-shipping-weight-summary {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid #dedede;
}

.tk-order-shipping-weight-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}

.tk-order-shipping-weight-title strong {
  color: #202223;
  font-size: 13px;
}

.tk-order-shipping-weight-summary dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
}

.tk-order-shipping-weight-summary dl > div {
  display: grid;
  gap: 2px;
  padding: 8px 9px;
  border: 1px solid #e1e1e1;
  border-radius: 8px;
  background: #fff;
}

.tk-order-shipping-weight-summary dt {
  color: #616161;
  font-size: 12px;
  font-weight: 500;
}

.tk-order-shipping-weight-summary dd {
  margin: 0;
  color: #202223;
  font-size: 14px;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}

.tk-order-shipping-measures {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  padding: 0;
}

.tk-order-shipping-content {
  padding: 16px 0 0;
}

.tk-order-shipping-footer {
  min-height: 64px;
}

.tk-order-shipping-footer-actions > .tk-switch-field {
  margin-right: 4px;
}

.tk-order-shipping-declared {
  width: 190px;
}

.tk-order-shipping-declared input {
  width: 100%;
  min-width: 0;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #fff;
  color: var(--tk-text);
  font: inherit;
}

.tk-order-shipping-declared input:focus {
  border-color: #8a8a8a;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, .08);
  outline: 0;
}

.tk-order-shipping-declared input::placeholder {
  color: #777;
  opacity: 1;
}

.tk-order-shipping-footer-actions {
  display: flex;
  gap: 8px;
  margin-left: auto;
}

.tk-order-shipping-rates {
  display: grid;
  gap: 8px;
}

.tk-order-shipping-error > div {
  display: grid;
  gap: 2px;
}

.tk-order-shipping-error strong {
  color: #8e1f0b;
  font-size: 12px;
}

.tk-order-shipping-error span {
  line-height: 1.4;
}

.tk-order-shipping-rate {
  position: relative;
  display: grid;
  grid-template-columns: 5px minmax(0, 1fr) 120px 120px;
  align-items: center;
  gap: 12px;
  min-height: 54px;
  padding: 9px 12px;
  border: 1px solid #dedede;
  border-radius: 9px;
  background: #fff;
  cursor: pointer;
  transition: border-color 140ms ease, background-color 140ms ease, box-shadow 140ms ease;
}

.tk-order-shipping-rate:hover {
  border-color: #a9a9a9;
}

.tk-order-shipping-rate > input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.tk-order-shipping-rate-check {
  position: absolute;
  top: 50%;
  right: 10px;
  display: grid;
  width: 20px;
  height: 20px;
  place-items: center;
  border-radius: 50%;
  background: #303030;
  color: #fff;
  font-size: 13px;
  opacity: 0;
  transform: translateY(-50%);
}

.tk-order-shipping-rate.is-selected {
  border-color: #303030;
  background: #f4f4f4;
  box-shadow: 0 0 0 1px #303030;
}

.tk-order-shipping-rate.is-selected > strong:last-child {
  padding-right: 28px;
}

.tk-order-shipping-rate.is-selected .tk-order-shipping-rate-check {
  opacity: 1;
}

.tk-shipping-rate.is-cheapest,
.tk-order-shipping-rate.is-cheapest {
  border-color: #8fc3a8;
  background: #f1faf5;
  box-shadow: inset 3px 0 0 #168a52;
}

.tk-shipping-best-badge {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  margin-left: 8px;
  padding: 2px 7px;
  border-radius: 999px;
  background: #dff3e8;
  color: #176a43;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
  vertical-align: middle;
}

@media (max-width: 767.98px) {
  .tk-order-shipping-modal .modal-body {
    padding: 0;
  }

  .tk-order-shipping-layout {
    grid-template-columns: 1fr;
  }

  .tk-order-shipping-main {
    padding: 16px;
  }

  .tk-order-shipping-sidebar {
    border-top: 1px solid #e5e5e5;
    border-left: 0;
  }

  .tk-order-shipping-measures {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tk-order-shipping-declared {
    width: 100%;
  }

  .tk-order-shipping-footer {
    align-items: stretch !important;
    flex-direction: column;
  }

  .tk-order-shipping-footer-actions {
    margin-left: 0;
  }

  .tk-order-shipping-footer-actions .btn {
    flex: 1;
  }

  .tk-order-shipping-submit {
    width: 100%;
  }
}

.tk-order-shipping-rate > span:nth-child(2) {
  display: grid;
}

.tk-order-shipping-rate small {
  color: #777;
  font-size: 11px;
}

.tk-order-shipping-rate > span:nth-child(3),
.tk-order-shipping-rate > strong:last-child {
  text-align: right;
}

.tk-shipping-rate-carrier strong,
.tk-shipping-rate-price strong {
  color: #202223;
  font-size: 13px;
}

.tk-shipping-rate-carrier small,
.tk-shipping-rate-price small {
  color: #777;
  font-size: 11px;
}

.tk-shipping-rate-days {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #616161;
  font-size: 12px;
}

.tk-shipping-rate-price {
  justify-items: end;
  text-align: right;
}

.tk-shipping-rate-price strong {
  font-size: 16px;
}

.tk-shipping-rates-loading {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 70px;
  padding: 12px;
}

.tk-shipping-rates-loading > span {
  width: 30px;
  height: 30px;
  border: 3px solid #dedede;
  border-top-color: #303030;
  border-radius: 50%;
  animation: tk-shipping-spin 800ms linear infinite;
}

.tk-shipping-rates-loading > div {
  display: grid;
}

.tk-shipping-rates-loading strong {
  font-size: 13px;
}

.tk-shipping-rates-loading small {
  color: #777;
  font-size: 11px;
}

.tk-shipping-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 180px;
  padding: 30px;
  color: #303030;
}

.tk-shipping-empty > span {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  border-radius: 10px;
  background: #f1f1f1;
  font-size: 18px;
}

.tk-shipping-empty > div {
  display: grid;
  gap: 3px;
  max-width: 360px;
}

.tk-shipping-empty h2 {
  margin: 0;
  font-size: 14px;
}

.tk-shipping-empty p {
  margin: 0;
  color: #6d6d6d;
  font-size: 12px;
}

@keyframes tk-shipping-spin {
  to { transform: rotate(360deg); }
}

@media (max-width: 1100px) {
  .tk-shipping-workspace {
    grid-template-columns: 1fr;
  }

  .tk-shipping-summary {
    position: static;
    order: -1;
  }

  .tk-shipping-summary dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0 18px;
  }
}

@media (max-width: 760px) {
  .tk-shipping-steps {
    align-items: flex-start;
    gap: 8px;
    overflow-x: auto;
  }

  .tk-shipping-steps small,
  .tk-shipping-steps > i {
    display: none;
  }

  .tk-shipping-steps > div {
    min-width: max-content;
  }

  .tk-shipping-section > .tk-form-grid,
  .tk-shipping-measures-row,
  .tk-shipping-content-row,
  .tk-shipping-address-columns,
  .tk-shipping-address-fields,
  .tk-shipping-summary dl {
    grid-template-columns: 1fr;
  }

  .tk-shipping-address-group + .tk-shipping-address-group {
    padding-top: 18px;
    padding-left: 0;
    border-top: 1px solid #e5e5e5;
    border-left: 0;
  }

  .tk-shipping-rate {
    grid-template-columns: 26px minmax(0, 1fr) auto;
  }

  .tk-shipping-rate-days {
    grid-column: 2 / -1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tk-shipping-rate {
    transition: none;
  }

  .tk-shipping-rates-loading > span {
    animation: none;
  }
}

.tk-kardex-modal {
  overflow: hidden;
}

.tk-kardex-modal .modal-header,
.tk-stock-modal .modal-header {
  align-items: flex-start;
  border-bottom: 1px solid var(--tk-border);
  padding: 18px 20px;
}

.tk-kardex-modal .modal-header > .tk-icon-btn,
.tk-stock-modal .modal-header > .tk-icon-btn {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  margin-left: auto;
  color: #616161;
}

.tk-kardex-heading {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 12px;
}

.tk-kardex-heading > .tk-kardex-icon {
  display: grid;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  place-items: center;
  border-radius: 9px;
  background: #f1f1f1;
  color: #303030;
  font-size: 18px;
}

.tk-kardex-modal .modal-title,
.tk-stock-modal .modal-title {
  color: #202223;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
  margin: 0;
}

.tk-kardex-modal .modal-header p,
.tk-stock-modal .modal-header p {
  max-width: 760px;
  margin: 4px 0 0;
  overflow: hidden;
  color: #616161;
  font-size: 13px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-stock-detail-btn {
  display: inline-grid;
  width: 32px;
  height: 32px;
  place-items: center;
  padding: 0;
  border: 1px solid #c9c9c9;
  border-radius: 7px;
  background: #fff;
  color: #303030;
  font-size: 17px;
  font-weight: 800;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .04);
}

.tk-stock-detail-btn:hover,
.tk-stock-detail-btn:focus-visible {
  border-color: #303030;
  background: #f1f1f1;
  color: #202223;
}

.tk-stock-group {
  display: inline-flex;
  align-items: stretch;
  overflow: hidden;
  min-width: 74px;
  height: 30px;
  padding: 0;
  border: 1px solid #c9c9c9;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .04);
  cursor: pointer;
}

.tk-stock-group-value {
  display: grid;
  min-width: 40px;
  padding: 0 9px;
  place-items: center;
  font-size: 12px;
  font-weight: 750;
}

.tk-stock-group-icon {
  display: grid;
  width: 32px;
  place-items: center;
  border-left: 1px solid rgba(0, 0, 0, .1);
  background: rgba(255, 255, 255, .58);
  color: #303030;
  font-size: 15px;
}

.tk-stock-group:hover,
.tk-stock-group:focus-visible {
  border-color: #303030;
  outline: 0;
  box-shadow: 0 0 0 1px #303030;
}

.tk-stock-group:hover .tk-stock-group-icon,
.tk-stock-group:focus-visible .tk-stock-group-icon {
  background: rgba(255, 255, 255, .9);
}

.tk-stock-group.success {
  border-color: #9bdcb5;
  background: #eaf7ed;
  color: #176c31;
}

.tk-stock-group.warning {
  border-color: #eadb88;
  background: #fff7cc;
  color: #6b4e00;
}

.tk-stock-group.danger {
  border-color: #efcbc8;
  background: #fff0ef;
  color: #8a1f18;
}

.tk-stock-modal {
  overflow: hidden;
}

.tk-stock-modal .modal-body {
  display: grid;
  gap: 14px;
  min-height: 390px;
  padding: 18px 20px 0;
}

.tk-stock-summary {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid var(--tk-border);
  border-radius: 10px;
  background: #f7f7f7;
}

.tk-stock-summary > div {
  display: grid;
  gap: 3px;
  min-height: 72px;
  align-content: center;
  padding: 12px 14px;
  border-right: 1px solid var(--tk-border);
}

.tk-stock-summary > div:last-child {
  border-right: 0;
}

.tk-stock-summary > div.is-primary {
  background: #eaf7ed;
}

.tk-stock-summary span {
  color: #616161;
  font-size: 12px;
}

.tk-stock-summary strong {
  color: #303030;
  font-size: 20px;
  line-height: 1.15;
}

.tk-stock-summary .is-primary strong {
  color: #176c31;
}

.tk-stock-formula {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  color: #616161;
  font-size: 12px;
  line-height: 1.4;
}

.tk-stock-detail-table-wrap {
  margin: 0 -20px;
  border-top: 1px solid var(--tk-border);
}

.tk-stock-detail-table {
  min-width: 960px;
  font-size: 13px;
}

.tk-stock-detail-table thead th {
  padding: 10px 12px;
  background: #f7f7f7;
  color: #616161;
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}

.tk-stock-detail-table tbody td {
  padding: 12px;
  border-color: #ececec;
}

.tk-stock-available-value {
  display: inline-flex;
  min-width: 40px;
  justify-content: flex-end;
  padding: 3px 7px;
  border-radius: 6px;
  background: #eaf7ed;
  color: #176c31;
}

.tk-stock-modal .modal-footer {
  justify-content: space-between;
  min-height: 58px;
  padding: 12px 20px;
  border-top: 1px solid var(--tk-border);
}

.tk-kardex-modal .modal-body {
  display: grid;
  gap: 12px;
  min-height: 410px;
  padding: 16px 20px 0;
}

.tk-kardex-help {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: #616161;
  font-size: 12px;
  line-height: 1.4;
}

.tk-kardex-help i {
  color: #6d6d6d;
}

.tk-kardex-search {
  display: flex;
  align-items: center;
  width: 100%;
  height: 36px;
  padding: 0 8px 0 11px;
  border: 1px solid #c9c9c9;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .03);
  color: #616161;
}

.tk-kardex-search:focus-within {
  border-color: #303030;
  box-shadow: 0 0 0 1px #303030;
}

.tk-kardex-search input {
  flex: 1;
  min-width: 0;
  height: 34px;
  padding: 0 9px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #303030;
  font-size: 13px;
}

.tk-kardex-search button {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #616161;
}

.tk-kardex-search button:hover {
  background: #f1f1f1;
}

.tk-kardex-table-wrap {
  margin: 0 -20px;
  border-top: 1px solid var(--tk-border);
}

.tk-kardex-table {
  min-width: 980px;
  font-size: 13px;
}

.tk-kardex-table thead th {
  padding: 10px 12px;
  background: #f7f7f7;
  color: #616161;
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}

.tk-kardex-table tbody td {
  padding: 11px 12px;
  border-color: #ececec;
  color: #303030;
}

.tk-kardex-date,
.tk-kardex-number,
.tk-kardex-reference {
  white-space: nowrap;
}

.tk-kardex-concept {
  font-weight: 600;
}

.tk-kardex-reference {
  display: inline-flex;
  padding: 2px 6px;
  border-radius: 5px;
  background: #f1f1f1;
  color: #4a4a4a;
  font-size: 12px;
}

.tk-kardex-movement {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 7px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}

.tk-kardex-movement.is-entry {
  background: #eaf7ed;
  color: #176c31;
}

.tk-kardex-movement.is-exit {
  background: #fff0ef;
  color: #8a1f11;
}

.tk-kardex-movement.is-adjustment {
  background: #f1f1f1;
  color: #4a4a4a;
}

.tk-kardex-number.is-positive {
  color: #176c31;
  font-weight: 700;
}

.tk-kardex-number.is-negative {
  color: #8a1f11;
  font-weight: 700;
}

.tk-kardex-empty {
  display: grid;
  min-height: 210px;
  place-content: center;
  justify-items: center;
  padding: 32px;
  color: #616161;
  text-align: center;
}

.tk-kardex-empty[hidden] {
  display: none;
}

.tk-kardex-empty > span {
  display: grid;
  width: 42px;
  height: 42px;
  margin-bottom: 10px;
  place-items: center;
  border-radius: 10px;
  background: #f1f1f1;
  color: #616161;
  font-size: 20px;
}

.tk-kardex-empty strong {
  color: #303030;
  font-size: 14px;
}

.tk-kardex-empty p {
  margin: 4px 0 0;
  font-size: 13px;
}

.tk-kardex-modal .modal-footer {
  min-height: 58px;
  padding: 12px 20px;
  border-top: 1px solid var(--tk-border);
}

.tk-kardex-pagination {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}

.tk-kardex-pagination .btn {
  min-height: 32px;
}

@media (max-width: 680px) {
  .tk-kardex-modal .modal-header p {
    white-space: normal;
  }

  .tk-kardex-modal .modal-body {
    min-height: 360px;
  }

  .tk-kardex-modal .modal-footer {
    align-items: stretch;
    flex-direction: column;
  }

  .tk-kardex-pagination {
    justify-content: space-between;
  }

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

  .tk-stock-summary > div {
    border-bottom: 1px solid var(--tk-border);
  }

  .tk-stock-modal .modal-footer {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Surtido de pedidos */
.tk-order-supply-lock {
  position: fixed;
  z-index: 1095;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(24, 24, 24, .58);
  backdrop-filter: blur(3px);
}

.tk-order-supply-lock-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  width: min(720px, 100%);
  padding: 20px;
  border: 1px solid #d8d8d8;
  border-radius: 14px;
  background: #fff;
  color: #303030;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
}

.tk-order-supply-lock-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: #303030;
  color: #fff;
  font-size: 22px;
}

.tk-order-supply-lock-card small {
  color: #707070;
  font-size: 12px;
  font-weight: 700;
}

.tk-order-supply-lock-card h2 {
  margin: 2px 0 4px;
  font-size: 20px;
}

.tk-order-supply-lock-card p {
  margin: 0;
  color: #616161;
  font-size: 13px;
}

.tk-order-supply-lock-actions {
  display: flex;
  gap: 8px;
}

.tk-order-share-modal {
  z-index: 1110;
}

.tk-order-share-options {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 18px;
  min-height: 38px;
}

.tk-modal-form-grid .tk-order-share-options .tk-switch-field {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  flex: 0 0 auto;
  min-width: 0;
}

.tk-modal-form-grid .tk-order-share-options .tk-switch-field > input {
  margin: 0;
}

.tk-order-share-footer {
  flex-wrap: wrap;
}

.tk-supply-grid {
  display: grid;
  gap: 18px;
  min-width: 0;
}

.tk-supply-lane {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.tk-supply-lane-header,
.tk-supply-lane-header > div {
  display: flex;
  align-items: center;
}

.tk-supply-lane-header {
  justify-content: space-between;
  gap: 12px;
}

.tk-supply-lane-header > div {
  gap: 8px;
}

.tk-supply-lane-header h2 {
  margin: 0;
  font-size: 14px;
}

.tk-supply-lane-controls .btn {
  width: 30px;
  min-width: 30px;
  height: 30px;
  padding: 0;
}

.tk-supply-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(280px, 310px);
  gap: 12px;
  min-width: 0;
  padding: 1px 1px 10px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: inline proximity;
  scrollbar-width: thin;
}

.tk-supply-track > * {
  scroll-snap-align: start;
}

.tk-supply-card {
  position: relative;
  display: grid;
  gap: 7px;
  padding: 16px;
  overflow: hidden;
  border: 1px solid #d8d8d8;
  color: #303030;
  text-decoration: none;
  text-align: left;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.tk-supply-lane-empty {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 100px;
  color: #6d6d6d;
  font-size: 12px;
}

.tk-supply-card.is-actionable:hover {
  border-color: #8f8f8f;
  color: #303030;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .08);
  transform: translateY(-1px);
}

.tk-supply-card:not(.is-actionable) {
  cursor: not-allowed;
}

.tk-supply-card-open {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.tk-supply-card-actions {
  position: absolute;
  z-index: 4;
  top: 9px;
  right: 9px;
  display: flex;
  gap: 5px;
}

.tk-supply-card-actions > a,
.tk-supply-card-actions > button {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  padding: 0;
  border: 1px solid #c9c9c9;
  border-radius: 7px;
  background: #fff;
  color: #303030;
  text-decoration: none;
}

.tk-supply-card-actions > a:hover,
.tk-supply-card-actions > button:hover {
  border-color: #303030;
  background: #303030;
  color: #fff;
}

.tk-supply-card-top {
  padding-right: 62px;
}

.tk-supply-card-lock {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  padding: 12px;
  background: rgba(245, 245, 245, .82);
  backdrop-filter: blur(1.5px);
}

.tk-supply-card-lock > span {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1px 7px;
  align-items: center;
  max-width: 230px;
  padding: 10px 12px;
  border: 1px solid #d1d1d1;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 5px 18px rgba(0, 0, 0, .08);
}

.tk-supply-card-lock > span > i {
  grid-row: 1 / 3;
  color: #6d6d6d;
  font-size: 17px;
}

.tk-supply-card-lock strong,
.tk-supply-card-lock small {
  line-height: 1.2;
}

.tk-supply-card-lock strong {
  font-size: 12px;
}

.tk-supply-card-lock small {
  color: #6d6d6d;
  font-size: 10px;
}

.tk-supply-card-lock a,
.tk-supply-card-lock button {
  grid-column: 1 / -1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  margin-top: 6px;
  padding: 6px 9px;
  border-radius: 7px;
  background: #303030;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
}

.tk-supply-card-lock button {
  margin-top: 0;
  border: 1px solid #d1d1d1;
  background: #fff;
  color: #303030;
}

.tk-supply-card-lock a + button {
  margin-top: 6px;
}

.tk-supply-card-lock a:hover {
  background: #1f1f1f;
  color: #fff;
}

.tk-supply-quick-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.tk-supply-quick-summary > span {
  display: grid;
  gap: 2px;
  padding: 9px 10px;
  border: 1px solid #e1e1e1;
  border-radius: 8px;
  background: #f7f7f7;
}

.tk-supply-quick-summary small,
.tk-supply-quick-table td small {
  display: block;
  color: #6d6d6d;
  font-size: 10px;
}

.tk-supply-quick-summary strong {
  font-size: 12px;
}

.tk-supply-quick-table {
  width: 100%;
  min-width: 680px;
  margin: 0;
  font-size: 12px;
  table-layout: fixed;
}

.tk-supply-quick-table th:nth-child(1),
.tk-supply-quick-table td:nth-child(1) {
  width: 17%;
}

.tk-supply-quick-table th:nth-child(2),
.tk-supply-quick-table td:nth-child(2) {
  width: 49%;
}

.tk-supply-quick-table th:nth-child(3),
.tk-supply-quick-table td:nth-child(3),
.tk-supply-quick-table th:nth-child(4),
.tk-supply-quick-table td:nth-child(4) {
  width: 10%;
}

.tk-supply-quick-table th:nth-child(5),
.tk-supply-quick-table td:nth-child(5) {
  width: 14%;
}

.tk-supply-quick-table td:nth-child(2) {
  overflow-wrap: anywhere;
}

.tk-supply-card-top,
.tk-supply-card-meta,
.tk-supply-progress-copy {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.tk-supply-card-top strong {
  font-size: 18px;
}

.tk-supply-card-top span,
.tk-supply-card p,
.tk-supply-card-meta {
  color: #6d6d6d;
  font-size: 12px;
}

.tk-supply-card h2 {
  margin: 2px 0 0;
  font-size: 14px;
}

.tk-supply-card p {
  margin: 0;
}

.tk-supply-ready,
.tk-supply-owner {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 5px;
  padding-top: 10px;
  border-top: 1px solid #e5e5e5;
  font-size: 12px;
  font-weight: 700;
}

.tk-supply-owner {
  color: #8a5b00;
}

.tk-supply-status,
.tk-supply-empty {
  padding: 14px;
  color: #606060;
}

.tk-supply-status.danger {
  color: #a12622;
}

.tk-supply-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 150px;
  grid-column: 1 / -1;
}

.tk-supply-empty span {
  color: #777;
}

.tk-supply-work-card {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 12px;
  padding: 14px;
  min-height: calc(100vh - 190px);
}

.tk-supply-scan-block {
  display: grid;
  gap: 10px;
}

.tk-supply-count-workspace {
  padding-bottom: 78px;
}

.tk-supply-sticky-tools {
  position: sticky;
  z-index: 40;
  top: 56px;
}

.tk-supply-sticky-tools .tk-count-scanner {
  position: static;
}

.tk-supply-count-progress {
  display: grid;
  gap: 7px;
  padding: 10px 12px;
  border-right: 1px solid var(--tk-border);
  border-left: 1px solid var(--tk-border);
  background: #fff;
}

.tk-supply-count-progress > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 11px;
}

.tk-supply-count-list {
  border-radius: 0 0 12px 12px;
}

.tk-supply-count-list .tk-count-product.is-complete {
  background: #eaf8f0;
  box-shadow: inset 3px 0 #08783e;
}

.tk-supply-state {
  color: #77787d;
}

.tk-supply-count-list .tk-count-product.is-complete .tk-supply-state {
  background: #dff3e8;
  color: #08783e;
}

.tk-supply-bottom-actions {
  z-index: 45;
  grid-template-columns: minmax(100px, .45fr) minmax(100px, .45fr) minmax(180px, 1fr);
}

.tk-supply-bottom-actions.has-ferrex {
  grid-template-columns: minmax(100px, .45fr) minmax(100px, .45fr) minmax(120px, .55fr) minmax(180px, 1fr);
  width: min(100%, 900px);
}

.tk-count-bottom-actions .tk-ferrex-btn {
  min-width: 120px;
  min-height: 46px;
  padding: 9px 18px;
  white-space: nowrap;
}

.tk-phone-input-group {
  display: grid;
  grid-template-columns: minmax(180px, .85fr) minmax(180px, 1fr);
  gap: 8px;
}

.tk-phone-input-group > select,
.tk-phone-input-group > input,
.tk-phone-input-group .tk-rich-select {
  width: 100%;
}

@media (max-width: 575.98px) {
  .tk-phone-input-group {
    grid-template-columns: 1fr;
  }
}

.tk-supply-save-state {
  color: #a9a9ad;
  font-size: 10px;
}

.tk-count-product-info {
  position: relative;
}

.tk-count-incident {
  position: absolute;
  right: 10px;
  bottom: 8px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 7px;
  border: 1px solid #d4d4d4;
  border-radius: 7px;
  background: #fff;
  color: #6d6d6d;
  font-size: 10px;
}

.tk-count-product-info h2 {
  padding-right: 82px;
}

.tk-supply-work-actions {
  position: sticky;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin: auto -14px -14px;
  padding: 12px 14px;
  border-top: 1px solid #dedede;
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(8px);
}

.tk-supply-scanner {
  width: 100%;
  min-height: 46px;
}

.tk-supply-progress-copy {
  font-size: 13px;
}

.tk-supply-lines {
  display: grid;
  align-content: start;
  gap: 6px;
}

.tk-supply-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 90px;
  align-items: center;
  gap: 12px;
  min-height: 66px;
  padding: 9px 11px;
  border: 1px solid #dedede;
  border-radius: 9px;
  background: #fff;
}

.tk-supply-line.is-complete {
  border-color: #8e8e8e;
  background: #f5f5f5;
}

.tk-supply-product {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.tk-supply-product strong {
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-supply-product span,
.tk-supply-goal span {
  color: #6d6d6d;
  font-size: 11px;
}

.tk-supply-counter {
  display: grid;
  grid-template-columns: 38px 58px 38px;
  overflow: hidden;
  border: 1px solid #bfbfbf;
  border-radius: 8px;
}

.tk-supply-counter button,
.tk-supply-counter input {
  min-height: 40px;
  border: 0;
  background: #fff;
  color: #303030;
  text-align: center;
}

.tk-supply-counter button {
  font-size: 17px;
}

.tk-supply-counter input {
  border-right: 1px solid #d5d5d5;
  border-left: 1px solid #d5d5d5;
  font-weight: 700;
  appearance: textfield;
}

.tk-supply-counter input::-webkit-inner-spin-button {
  appearance: none;
}

.tk-supply-goal {
  display: grid;
  justify-items: end;
}

.tk-supply-goal strong {
  font-size: 14px;
}

@media (max-width: 680px) {
  .tk-order-supply-lock {
    align-items: end;
    padding: 10px;
  }

  .tk-order-supply-lock-card {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    padding: 16px;
    border-radius: 14px;
  }

  .tk-order-supply-lock-card .btn {
    width: 100%;
    min-height: 46px;
  }

  .tk-order-supply-lock-actions {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .tk-order-share-options {
    align-items: stretch;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
  }

  .tk-order-share-options .tk-switch-field {
    width: auto;
  }

  .tk-order-share-footer {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .tk-order-share-footer .btn {
    width: 100%;
  }

  .tk-supply-page {
    padding: 0 8px 20px;
  }

  .tk-supply-grid {
    grid-template-columns: 1fr;
  }

  .tk-supply-card {
    min-height: 142px;
    padding: 14px;
  }

  .tk-supply-quick-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tk-supply-work-card {
    min-height: calc(100dvh - 175px);
    padding: 10px;
  }

  .tk-supply-count-workspace {
    width: 100%;
    padding-bottom: 78px;
  }

  .tk-supply-line {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    padding: 10px;
  }

  .tk-supply-product {
    grid-column: 1 / -1;
  }

  .tk-supply-product strong {
    white-space: normal;
  }

  .tk-supply-goal {
    min-width: 72px;
  }

  .tk-supply-counter {
    grid-template-columns: 44px 64px 44px;
  }

  .tk-supply-counter button,
  .tk-supply-counter input {
    min-height: 46px;
  }

  .tk-supply-work-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: auto -10px -10px;
    padding: 10px;
  }

  .tk-supply-work-actions .btn {
    width: 100%;
    min-height: 46px;
  }
}

@media (max-width: 720px) {
  .tk-inventory-focus-shell {
    padding-right: 12px;
    padding-left: 12px;
  }

  .tk-inventory-focus-header {
    grid-template-columns: 1fr auto;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    padding: 8px 12px;
  }

  .tk-inventory-focus-title {
    display: none;
  }

  .tk-inventory-wizard {
    padding-top: 20px;
  }

  .tk-inventory-wizard-heading {
    margin-bottom: 16px;
  }

  .tk-wizard-step {
    margin: 0 -4px;
    padding: 18px 16px;
    border-radius: 14px;
  }

  .tk-count-methods {
    grid-template-columns: 1fr;
  }

  .tk-count-methods label > span {
    min-height: 82px;
    grid-template-columns: 28px 1fr;
  }

  .tk-count-methods i {
    grid-row: 1 / span 2;
    margin: 1px 0 0;
  }
}

.tk-list-table {
  min-width: 1180px;
}

.tk-list-table thead th {
  padding: 8px 10px;
  background: #f6f6f7;
  color: #5f6065;
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
}

.tk-list-table thead a {
  color: inherit;
}

.tk-list-table tbody td {
  padding: 10px;
  border-top: 1px solid #eeeeee;
  font-size: 13px;
  vertical-align: middle;
}

.tk-list-table .tk-actions-cell {
  width: 76px;
  min-width: 76px;
  padding-left: 6px;
  padding-right: 10px;
  text-align: right;
  white-space: nowrap;
}

.tk-list-table .tk-actions-cell .tk-row-actions {
  width: 100%;
}

.tk-product-thumb {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  overflow: hidden;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #f6f6f7;
  color: var(--tk-muted);
}

.tk-product-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tk-product-thumb img + i {
  display: none;
}

.tk-customers-table {
  min-width: 1120px;
}

.tk-client-detail .tk-edit-layout {
  align-items: start;
}

.tk-supplier-detail .tk-edit-layout {
  align-items: start;
}

.tk-supplier-brand-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 20px;
}

.tk-supplier-brand-grid .tk-section-row {
  min-width: 0;
}

@media (max-width: 760px) {
  .tk-supplier-brand-grid {
    grid-template-columns: 1fr;
  }
}

.tk-client-form-grid,
.tk-client-address-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

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

.tk-client-form-grid label,
.tk-client-address-grid label,
.tk-side-card label {
  display: grid;
  gap: 6px;
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 650;
}

.tk-client-form-grid input,
.tk-client-form-grid select,
.tk-client-address-grid input,
.tk-client-address-grid select,
.tk-side-card input,
.tk-side-card select {
  width: 100%;
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  font: inherit;
}

.tk-client-address-grid .span-2 {
  grid-column: span 2;
}

.tk-address-type-field {
  display: grid;
  gap: 6px;
  align-content: start;
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 650;
}

.tk-address-type-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(90px, 120px));
  gap: 8px;
}

.tk-address-type-option {
  display: flex;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 7px 12px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
  font: inherit;
  font-weight: 650;
  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease, box-shadow 120ms ease;
}

.tk-address-type-option:hover {
  background: #f1f1f1;
}

.tk-address-type-option:focus-visible {
  outline: 2px solid #005bd3;
  outline-offset: 2px;
}

.tk-address-type-option.is-selected {
  border-color: #303030;
  background: #303030;
  color: #ffffff;
  box-shadow: inset 0 0 0 1px #303030;
}

.tk-address-type-option.is-selected:hover {
  background: #1f1f1f;
}

.tk-address-type-option:disabled {
  border-color: var(--tk-border);
  background: #f3f3f3;
  color: #8a8a8a;
  cursor: not-allowed;
  opacity: .72;
}

.tk-client-address-row {
  display: grid;
  gap: 12px;
}

.tk-address-contact-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 2px;
  padding-bottom: 2px;
  border-bottom: 1px solid var(--tk-border);
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 750;
}

.tk-address-copy-customer {
  display: inline-grid;
  width: 28px;
  height: 28px;
  place-items: center;
  padding: 0;
  border: 1px solid var(--tk-border-strong);
  border-radius: 7px;
  background: #ffffff;
  color: var(--tk-text);
}

.tk-address-copy-customer:hover {
  background: #f1f1f1;
}

.tk-address-copy-customer:focus-visible {
  outline: 2px solid #005bd3;
  outline-offset: 2px;
}

.tk-client-address-name-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tk-client-address-contact-row {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tk-client-address-location-row {
  grid-template-columns: minmax(80px, 100px) minmax(100px, 120px) minmax(0, 1fr) minmax(0, 1fr);
}

.tk-client-address-line {
  grid-template-columns: minmax(0, 1fr) minmax(100px, 140px) minmax(100px, 140px);
}

.tk-client-address-list {
  display: grid;
  gap: 8px;
}

.tk-client-address-section > .tk-section-row {
  margin-bottom: 14px;
}

.tk-client-address-section > .tk-section-row .tk-soft-btn {
  padding-right: 14px;
  padding-left: 14px;
}

.tk-address-card {
  position: relative;
  display: grid;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  overflow: hidden;
}

.tk-address-card:focus-within {
  z-index: 5;
  overflow: visible;
}

.tk-address-card > .tk-client-address-grid {
  padding: 12px;
}

.tk-address-summary {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  width: 100%;
  padding: 12px;
  border: 0;
  background: #ffffff;
  color: var(--tk-text);
  text-align: left;
  cursor: pointer;
}

.tk-address-summary:hover {
  background: #f7f7f7;
}

.tk-address-summary:focus-visible {
  outline: 2px solid var(--tk-text);
  outline-offset: -2px;
}

.tk-address-type-icon {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border-radius: 8px;
  font-size: 16px;
}

.tk-address-type-icon.is-shipping {
  background: #eaf4ff;
  color: #1769aa;
}

.tk-address-type-icon.is-fiscal {
  background: #f1edff;
  color: #5b3db5;
}

.tk-address-summary-copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.tk-address-summary-topline {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 8px;
}

.tk-address-summary-topline strong {
  overflow: hidden;
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-address-summary-address,
.tk-address-summary-place {
  overflow: hidden;
  color: var(--tk-muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-address-summary-action {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 650;
}

.tk-address-summary-action i {
  transition: transform 150ms ease;
}

.tk-address-summary[aria-expanded="true"] .tk-address-summary-action i {
  transform: rotate(180deg);
}

.tk-address-editor {
  padding: 12px;
  border-top: 1px solid var(--tk-border);
  background: #fbfbfb;
}

.tk-address-editor-actions {
  display: flex;
  justify-content: flex-end;
  gap: 6px;
  margin-bottom: 12px;
}

.tk-address-new-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-address-new-head span {
  display: grid;
  gap: 2px;
}

.tk-address-new-head small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-client-activity-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.tk-client-activity-grid h3 {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 750;
}

.tk-client-stats {
  gap: 10px;
}

.tk-client-stats div,
.tk-side-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--tk-muted);
  font-size: 13px;
}

.tk-client-stats strong,
.tk-side-meta strong {
  color: var(--tk-text);
}

.tk-side-select {
  margin-top: 12px;
}

@media (max-width: 1180px) {
  .tk-client-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tk-client-activity-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .tk-client-form-grid,
  .tk-client-address-grid {
    grid-template-columns: 1fr;
  }

  .tk-client-address-grid .span-2 {
    grid-column: auto;
  }

  .tk-client-address-row {
    grid-template-columns: 1fr;
  }

  .tk-address-summary {
    grid-template-columns: 36px minmax(0, 1fr);
  }

  .tk-address-summary-action {
    grid-column: 2;
    justify-self: start;
  }

  .tk-address-new-head {
    align-items: stretch;
    flex-direction: column;
  }
}

.tk-product-thumb.missing i {
  display: block;
}

.tk-product-cell {
  display: grid;
  min-width: 260px;
  gap: 2px;
}

.tk-product-cell strong {
  overflow: hidden;
  color: var(--tk-text);
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-product-cell span,
.tk-muted-line {
  display: block;
  max-width: 280px;
  overflow: hidden;
  color: var(--tk-muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-stock-pill {
  display: inline-flex;
  min-width: 48px;
  justify-content: center;
  padding: 3px 7px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 750;
}

.tk-stock-pill.success {
  background: #e9f8ee;
  color: #14532d;
}

.tk-stock-pill.warning {
  background: #fff7cc;
  color: #6b4e00;
}

.tk-stock-pill.danger {
  background: #fff0ef;
  color: #8a1f18;
}

.tk-status-stack {
  display: inline-flex;
  gap: 4px;
}

.tk-status-icons {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  white-space: nowrap;
}

.tk-status-icon {
  display: inline-grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 8px;
  font-size: 15px;
  font-weight: 800;
}

.tk-status-icon.is-positive {
  background: #b5f4cf;
  color: #174f2f;
}

.tk-status-icon.is-negative {
  background: #ffe1df;
  color: #8a1f11;
}

.tk-status-icon.is-warning {
  background: #fff0a8;
  color: #6b4e00;
}

.tk-status-icon.is-info {
  background: #e4f0ff;
  color: #245a8d;
}

.tone-success .tk-toast-icon,
.tone-success.tk-screen-alert > i,
.tone-success .tk-feedback-icon {
  background: #e9f8ee;
  color: #14532d;
}

.tone-warning .tk-toast-icon,
.tone-warning.tk-screen-alert > i,
.tone-warning .tk-feedback-icon {
  background: #fff7cc;
  color: #6b4e00;
}

.tone-danger .tk-toast-icon,
.tone-danger.tk-screen-alert > i,
.tone-danger .tk-feedback-icon {
  background: #fff0ef;
  color: #8a1f18;
}

@media (prefers-reduced-motion: reduce) {
  .tk-toast {
    transition: none;
  }
}

.tk-section-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
}

.tk-section-actions .btn {
  min-height: 32px;
  padding: 6px 10px;
  font-size: 13px;
}

.tk-section-actions .tk-primary-btn {
  padding-inline: 12px;
}

.tk-fx-lines {
  overflow: hidden;
  border-color: var(--tk-border-strong);
}

.tk-fx-lines .tk-section-head > div:first-child {
  display: grid;
  gap: 2px;
}

.tk-fx-lines .tk-section-head span {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-fx-table-shell {
  border-bottom: 1px solid var(--tk-border);
  background: #ffffff;
}

.tk-fx-table {
  table-layout: fixed;
  min-width: 1080px;
}

.tk-fx-table thead th {
  height: 36px;
  padding: 8px 12px;
  border-bottom: 1px solid #e4e4e4;
  background: #f6f6f7;
  color: #5f6065;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.tk-fx-table tbody td {
  padding: 12px;
  border-bottom: 0;
  vertical-align: middle;
}

.tk-fx-table tbody tr {
  background: #ffffff;
}

.tk-fx-table tbody tr:hover {
  background: #fbfbfb;
}

.tk-fx-table .fx-row-total {
  padding-right: 14px;
  color: var(--tk-text);
  font-weight: 750;
  white-space: nowrap;
}

.tk-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 56px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--tk-border);
  background: #ffffff;
}

.tk-fx-store-summary {
  display: grid;
  place-items: center start;
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #f7f7f7;
}

.tk-fx-receptor-card {
  align-self: start;
  overflow: visible;
}

.tk-fx-receptor-card .tk-panel-head,
.tk-fx-comprobante-card .tk-panel-head {
  border-radius: calc(var(--tk-radius) - 1px) calc(var(--tk-radius) - 1px) 0 0;
}

.tk-fx-comprobante-card,
.tk-fx-comprobante-card .tk-fx-comprobante-grid,
.tk-fx-comprobante-card .tk-field {
  overflow: visible;
}

.tk-fx-comprobante-card:focus-within {
  position: relative;
  z-index: 120;
}

.tk-fx-comprobante-card .tk-rich-select-menu {
  z-index: 130;
}

.tk-fx-receptor-grid {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 12px;
  padding: 16px;
}

.tk-fx-receptor-grid .tk-field:nth-child(1) {
  grid-column: 1 / -1;
}

.tk-fx-receptor-grid .tk-field:nth-child(2) {
  grid-column: span 5;
}

.tk-fx-receptor-grid .tk-field:nth-child(3) {
  grid-column: span 4;
}

.tk-fx-receptor-grid .tk-field:nth-child(4) {
  grid-column: span 3;
}

.tk-fx-receptor-grid .tk-field:nth-child(5),
.tk-fx-receptor-grid .tk-field:nth-child(6) {
  grid-column: span 6;
}

.tk-fx-comprobante-grid {
  grid-template-columns: minmax(220px, 1.15fr) repeat(4, minmax(150px, 1fr));
  align-items: end;
  gap: 12px;
}

.tk-fx-comprobante-grid .tk-fx-store-summary,
.tk-fx-comprobante-grid .tk-field {
  min-width: 0;
}

.tk-fx-comprobante-grid .tk-fx-store-summary {
  min-height: 59px;
}

.tk-fx-top-row .tk-fx-receptor-grid,
.tk-fx-top-row .tk-fx-comprobante-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tk-fx-top-row .tk-fx-receptor-grid .tk-field,
.tk-fx-top-row .tk-fx-comprobante-grid .tk-field,
.tk-fx-top-row .tk-fx-comprobante-grid .tk-fx-store-summary {
  grid-column: auto;
}

.tk-fx-top-row .tk-fx-receptor-grid .tk-field:nth-child(5),
.tk-fx-top-row .tk-fx-receptor-grid .tk-field:nth-child(6) {
  grid-column: auto;
}

.tk-fx-top-row .tk-fx-comprobante-grid .tk-fx-payment-method {
  grid-column: 1;
}

.tk-fx-top-row .tk-fx-comprobante-grid .tk-fx-cfdi-use {
  grid-column: 2;
}

@media (max-width: 1180px) {
  .tk-fx-top-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .tk-fx-receptor-grid .tk-field {
    grid-column: span 6;
  }

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

}

@media (max-width: 680px) {
  .tk-fx-receptor-grid .tk-field {
    grid-column: 1 / -1;
  }

  .tk-fx-comprobante-grid {
    grid-template-columns: 1fr;
  }

  .tk-fx-top-row .tk-fx-comprobante-grid .tk-fx-payment-method,
  .tk-fx-top-row .tk-fx-comprobante-grid .tk-fx-cfdi-use {
    grid-column: 1;
  }
}

.tk-fx-store-summary strong {
  color: var(--tk-text);
  font-size: 13px;
}

.tk-fx-store-summary span,
.tk-fx-store-summary small {
  color: var(--tk-muted);
  font-size: 12px;
  line-height: 1.35;
}

.tk-required-modal .modal-header,
.tk-required-modal .modal-footer {
  border-color: var(--tk-border);
}

.tk-required-modal .modal-header {
  align-items: flex-start;
  padding: 18px 18px 12px;
}

.tk-required-modal .modal-title {
  margin: 0;
  color: var(--tk-text);
  font-size: 18px;
  font-weight: 750;
  letter-spacing: 0;
}

.tk-required-modal p {
  margin: 5px 0 0;
  color: var(--tk-muted);
  font-size: 13px;
  line-height: 1.4;
}

.tk-required-modal .modal-body {
  padding: 16px 18px;
}

.tk-required-modal select {
  width: 100%;
  height: 38px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  color: var(--tk-text);
}

.tk-fx-table th:first-child,
.tk-fx-table td:first-child {
  width: 42px;
}

.tk-fx-table th:nth-child(2),
.tk-fx-table td:nth-child(2) {
  width: 132px;
}

.tk-fx-table th:nth-child(3),
.tk-fx-table td:nth-child(3) {
  width: 236px;
}

.tk-fx-table th:nth-child(4),
.tk-fx-table td:nth-child(4) {
  width: 148px;
}

.tk-fx-table th:nth-child(5),
.tk-fx-table td:nth-child(5) {
  width: 126px;
}

.tk-fx-table th:nth-child(6),
.tk-fx-table td:nth-child(6),
.tk-fx-table th:nth-child(8),
.tk-fx-table td:nth-child(8),
.tk-fx-table th:nth-child(9),
.tk-fx-table td:nth-child(9) {
  width: 104px;
}

.tk-fx-table th:nth-child(7),
.tk-fx-table td:nth-child(7) {
  width: 168px;
}

.tk-price-action {
  min-width: 144px;
}

.tk-fx-table th:last-child,
.tk-fx-table td:last-child {
  width: 48px;
}

.tk-fx-bottom {
  display: grid;
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: 12px;
  padding: 14px 16px;
  background: #fafafa;
}

.tk-fx-totals {
  display: grid;
  grid-template-columns: repeat(4, minmax(88px, 1fr));
  align-items: stretch;
  overflow: hidden;
  width: 100%;
  min-width: 0;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
}

.tk-fx-totals div {
  display: grid;
  gap: 2px;
  min-height: 54px;
  padding: 9px 12px;
  border-right: 1px solid var(--tk-border);
  text-align: right;
}

.tk-fx-totals div:last-child {
  border-right: 0;
}

.tk-fx-totals span {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-fx-totals strong {
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 750;
}

.tk-fx-totals .grand {
  background: #303030;
  color: #ffffff;
}

.tk-fx-totals .grand strong {
  color: #ffffff;
  font-size: 18px;
}

.tk-fx-totals .grand span {
  color: rgba(255, 255, 255, .72);
}

@media (max-width: 1200px) {
  .tk-page-wide .tk-document-layout {
    grid-template-columns: 1fr;
  }

  .tk-page-wide .tk-fx-bottom {
    grid-template-columns: 1fr;
  }

  .tk-page-wide .tk-fx-totals {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.tk-form-grid.one {
  grid-template-columns: 1fr;
}

.tk-badge.dado-de-baja,
.tk-badge.por-preparar {
  background: var(--tk-yellow);
  color: #594900;
}

.tk-report-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 14px;
  padding: 14px;
}

.tk-report-grid article {
  padding: 14px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: var(--tk-surface-soft);
}

.tk-report-grid small,
.tk-muted {
  color: var(--tk-muted);
}

.tk-report-grid strong {
  display: block;
  margin-top: 4px;
  font-size: 22px;
}

.tk-report-bar {
  height: 6px;
  margin-top: 16px;
  overflow: hidden;
  border-radius: 999px;
  background: #dedede;
}

.tk-report-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--tk-blue);
}

.tk-report-bar span.is-flat {
  width: 38%;
}

.tk-report-bar span.is-strong {
  width: 72%;
}

.tk-section-heading {
  margin: 0 0 8px;
  font-size: 15px;
  font-weight: 750;
}

.tk-empty-state {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 150px;
  padding: 20px;
}

.tk-empty-state h2 {
  margin: 0 0 8px;
  font-size: 16px;
  font-weight: 750;
}

.tk-empty-state p {
  max-width: 560px;
  margin: 0;
  color: var(--tk-muted);
}

.tk-empty-state.tk-table-empty {
  display: grid;
  place-items: center;
  align-content: center;
  justify-content: center;
  gap: 6px;
  min-height: 190px;
  text-align: center;
}

.tk-table-empty > i {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  margin-bottom: 4px;
  border-radius: 12px;
  background: var(--tk-surface-subtle);
  color: var(--tk-muted);
  font-size: 20px;
}

.tk-table-empty > strong {
  font-size: 14px;
  font-weight: 750;
}

.tk-more-info {
  margin-top: 26px;
  color: var(--tk-text);
  font-weight: 550;
}

.tk-detail-card {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  overflow: hidden;
}

.tk-detail-card div {
  min-height: 68px;
  padding: 14px 16px;
  border-right: 1px solid var(--tk-border);
  border-bottom: 1px solid var(--tk-border);
}

.tk-detail-card small {
  display: block;
  margin-bottom: 4px;
  color: var(--tk-muted);
  font-weight: 650;
  text-transform: uppercase;
}

.tk-detail-card strong {
  font-weight: 650;
}

.tk-edit-page {
  width: 100%;
  margin: 0;
}

.tk-edit-top {
  position: sticky;
  top: 56px;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 56px;
  margin: -16px 0 8px;
  padding: 10px 0;
  background: var(--tk-app-bg);
  gap: 12px;
}

.tk-edit-titlebar,
.tk-edit-actions,
.tk-editor-toolbar,
.tk-section-row {
  display: flex;
  align-items: center;
}

.tk-edit-titlebar {
  min-width: 0;
  gap: 8px;
}

.tk-edit-titlebar h1 {
  max-width: 590px;
  margin: 0;
  overflow: hidden;
  color: var(--tk-text);
  font-size: 18px;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-back-link {
  display: grid;
  place-items: center;
  border: 0;
  border-radius: var(--tk-radius-sm);
  background: #e7e7e7;
  color: var(--tk-text);
}

.tk-back-link {
  width: 32px;
  height: 32px;
}

.tk-title-icon {
  color: var(--tk-muted);
  font-size: 16px;
}

.tk-edit-actions {
  position: relative;
  flex-shrink: 0;
  gap: 8px;
}

.tk-stock-action {
  position: relative;
}

.tk-stock-popover {
  position: absolute;
  z-index: 85;
  top: calc(100% + 8px);
  right: 0;
  width: min(620px, calc(100vw - 300px));
  padding: 10px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .16);
}

.tk-stock-popover[hidden] {
  display: none;
}

.tk-stock-popover::before {
  position: absolute;
  top: -7px;
  right: 34px;
  width: 12px;
  height: 12px;
  border-top: 1px solid var(--tk-border-strong);
  border-left: 1px solid var(--tk-border-strong);
  background: #ffffff;
  content: "";
  transform: rotate(45deg);
}

.tk-stock-popover-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2px 2px 10px;
  gap: 12px;
}

.tk-stock-popover-head strong {
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 750;
}

.tk-stock-popover-head a {
  color: #005bd3;
  font-size: 12px;
  font-weight: 650;
  text-decoration: none;
}

.tk-quick-popover {
  position: fixed;
  z-index: 95;
  max-height: min(430px, calc(100vh - 24px));
  overflow: auto;
  padding: 10px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: var(--tk-surface);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .16);
}

.tk-quick-popover[hidden] {
  display: none;
}

.tk-quick-popover-head,
.tk-quick-popover-foot,
.tk-quick-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.tk-quick-popover-head {
  padding: 0 0 8px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-quick-popover-head > strong {
  font-size: 13px;
}

.tk-quick-items {
  display: grid;
}

.tk-quick-item {
  padding: 10px 2px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-quick-item > div {
  min-width: 0;
}

.tk-quick-item > div strong,
.tk-quick-item > div span {
  display: block;
}

.tk-quick-item > div strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-quick-item span,
.tk-quick-popover-foot span {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-quick-popover-foot {
  padding: 10px 2px 0;
}

.tk-quick-popover-foot a {
  color: #005bd3;
  font-size: 12px;
  font-weight: 700;
}

.tk-quick-popover-empty {
  padding: 18px 4px 8px;
  color: var(--tk-muted);
  text-align: center;
}

.tk-quick-popover-empty.danger {
  color: #8a1f1f;
}

.tk-edit-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 14px;
}

.tk-edit-main,
.tk-edit-side {
  display: grid;
  align-content: start;
  gap: 14px;
}

.tk-edit-card,
.tk-side-card {
  padding: 16px;
}

.tk-edit-card h2,
.tk-side-card h2 {
  margin: 0 0 12px;
  color: var(--tk-text);
  font-size: 14px;
  font-weight: 750;
}

.tk-side-card {
  display: grid;
  gap: 12px;
}

.tk-side-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.tk-side-card-head h2 {
  margin-bottom: 0;
}

.tk-side-card p {
  margin: 0;
}

.tk-side-card a {
  color: #005bd3;
  font-weight: 550;
}

.tk-side-card label {
  display: grid;
  gap: 6px;
  color: var(--tk-text);
  font-weight: 550;
}

.tk-side-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.tk-product-locations-card {
  gap: 10px;
}

.tk-location-code-list {
  display: grid;
  gap: 8px;
}

.tk-product-location-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #f7f7f8;
}

.tk-product-location-row strong {
  display: block;
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 750;
}

.tk-product-location-row span,
.tk-product-location-row small {
  display: block;
  overflow: hidden;
  color: var(--tk-muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-product-location-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.tk-product-location-actions form {
  margin: 0;
}

.tk-product-location-actions .tk-icon-btn {
  width: 28px;
  height: 28px;
  border: 1px solid var(--tk-border);
  background: #ffffff;
  color: #8e1f0b;
  font-size: 12px;
}

.tk-location-code-form {
  display: grid;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--tk-border);
}

.tk-location-segments {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.tk-location-segments input {
  text-align: center;
  text-transform: uppercase;
}

.tk-location-code-footer {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.tk-location-code-footer .tk-switch-field {
  margin: 0;
}

.tk-inventory-products-page .tk-location-products-card {
  overflow: visible;
}

.tk-location-bulk-bar {
  align-items: flex-start;
}

.tk-location-bulk-form {
  display: grid;
  flex: 1 1 720px;
  grid-template-columns: minmax(140px, 1.2fr) minmax(140px, 1.2fr) repeat(4, minmax(66px, .55fr)) auto;
  gap: 8px;
  align-items: center;
  min-width: 0;
}

.tk-location-bulk-form .tk-control {
  min-width: 0;
}

.tk-location-products-table > tbody > tr.tk-location-product-row {
  cursor: pointer;
}

.tk-location-products-table > tbody > tr.tk-location-product-row:hover > td {
  background: #f8f8f8;
}

.tk-location-products-table > tbody > tr.tk-location-detail-row > td {
  padding: 0 12px 14px 52px;
  border-top: 0;
  background: #ffffff;
}

.tk-location-detail-panel {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--tk-border);
  border-top: 0;
  border-radius: 0 0 var(--tk-radius-sm) var(--tk-radius-sm);
  background: #fbfbfb;
}

.tk-location-chip-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 8px;
}

.tk-location-chip,
.tk-location-empty {
  display: grid;
  min-width: 0;
  min-height: 58px;
  padding: 10px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
}

.tk-location-chip {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px;
}

.tk-location-chip strong {
  display: block;
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 800;
}

.tk-location-chip span,
.tk-location-chip small {
  display: block;
  overflow: hidden;
  color: var(--tk-muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-location-empty {
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  color: var(--tk-muted);
  font-size: 13px;
  font-weight: 650;
}

.tk-location-quick-form {
  display: grid;
  grid-template-columns: minmax(150px, 1.1fr) minmax(150px, 1.1fr) minmax(220px, 1.3fr) auto;
  gap: 8px;
  align-items: center;
  padding-top: 10px;
  border-top: 1px solid var(--tk-border);
}

.tk-location-segments.compact {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}

.tk-location-segments.compact input {
  min-width: 0;
  text-align: center;
  text-transform: uppercase;
}

@media (max-width: 1180px) {
  .tk-location-bulk-form,
  .tk-location-quick-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tk-location-bulk-form .tk-primary-btn,
  .tk-location-quick-form .tk-soft-btn {
    justify-content: center;
  }
}

@media (max-width: 760px) {
  .tk-location-products-table > tbody > tr.tk-location-detail-row > td {
    padding-left: 12px;
  }

  .tk-location-bulk-form,
  .tk-location-quick-form {
    grid-template-columns: minmax(0, 1fr);
  }
}

.tk-field-label {
  display: block;
  margin-bottom: 6px;
  color: var(--tk-text);
  font-weight: 650;
}

.tk-control {
  min-height: 34px;
  border-color: var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  color: var(--tk-text);
  font-size: 13px;
}

.tk-control:focus {
  border-color: #303030;
  box-shadow: 0 0 0 2px rgba(48, 48, 48, .15);
}

.tk-ai-control {
  position: relative;
  display: block;
}

.tk-ai-control .tk-control {
  padding-right: 38px;
}

.tk-ai-control-textarea .tk-control {
  min-height: 76px;
  padding-right: 42px;
}

.tk-ai-field-btn {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 6px;
  display: grid;
  width: 26px;
  height: 26px;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 7px;
  background: #f1f1f1;
  color: var(--tk-muted);
  transform: translateY(-50%);
}

.tk-ai-control-textarea .tk-ai-field-btn {
  top: 7px;
  transform: none;
}

.tk-ai-field-btn:hover,
.tk-ai-field-btn:focus {
  background: #e7e7e7;
  color: var(--tk-text);
}

.tk-ai-field-btn:disabled,
.tk-ai-field-btn.is-loading {
  opacity: .65;
  pointer-events: none;
}

.tk-ai-field-btn.is-loading i,
.tk-editor-toolbar button.is-loading i,
[data-ai-complete].is-loading i {
  display: inline-block;
  animation: tk-spin .8s linear infinite;
}

@keyframes tk-spin {
  to {
    transform: rotate(360deg);
  }
}

.tk-rich-editor {
  overflow: hidden;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #fff;
}

.tk-editor-toolbar {
  min-height: 42px;
  padding: 5px 8px;
  border-bottom: 1px solid var(--tk-border);
  background: #fbfbfb;
  gap: 4px;
}

.tk-editor-divider {
  width: 1px;
  height: 24px;
  margin: 0 6px;
  background: var(--tk-border);
}

.tk-editor-toolbar button {
  min-width: 30px;
  height: 30px;
  padding: 0 8px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--tk-text);
}

.tk-editor-toolbar button:hover {
  background: #efefef;
}

.tk-editor-toolbar button:disabled {
  opacity: .45;
  pointer-events: none;
}

.tk-editor-mode-toggle {
  display: inline-flex;
  align-items: center;
  padding: 2px;
  border: 1px solid var(--tk-border);
  border-radius: 7px;
  background: #ececec;
  gap: 2px;
}

.tk-editor-mode-toggle button {
  min-width: 58px;
  height: 26px;
  padding: 0 10px;
  border-radius: 5px;
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 700;
}

.tk-editor-mode-toggle button.is-active {
  background: #ffffff;
  color: var(--tk-text);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .12);
}

.tk-rich-visual {
  min-height: 230px;
  padding: 12px 14px;
  outline: 0;
  color: var(--tk-text);
  font-size: 14px;
  line-height: 1.55;
}

.tk-rich-visual:focus {
  box-shadow: inset 0 0 0 2px rgba(48, 48, 48, .14);
}

.tk-rich-visual h1,
.tk-rich-visual h2,
.tk-rich-visual h3,
.tk-rich-visual h4,
.tk-rich-visual p,
.tk-rich-visual ul,
.tk-rich-visual ol {
  margin-top: 0;
}

.tk-rich-visual p,
.tk-rich-visual ul,
.tk-rich-visual ol {
  margin-bottom: 10px;
}

.tk-rich-editor textarea,
.tk-rich-code {
  min-height: 210px;
  border: 0;
  border-radius: 0;
  resize: vertical;
  font-size: 14px;
  line-height: 1.45;
}

.tk-rich-code {
  display: none;
  width: 100%;
  padding: 12px 14px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

.tk-rich-editor.is-code .tk-rich-visual {
  display: none;
}

.tk-rich-editor.is-code .tk-rich-code {
  display: block;
}

.tk-rich-editor.is-code [data-rich-command] {
  opacity: .45;
  pointer-events: none;
}

.tk-field-grid,
.tk-price-grid {
  display: grid;
  gap: 12px;
}

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

.tk-field-grid.three,
.tk-price-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

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

.tk-page-builder-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.tk-edit-main > form {
  display: grid;
  gap: 14px;
}

.tk-edit-main > form > .tk-card {
  padding: 16px;
}

.tk-page-builder-grid > article {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--tk-border);
  border-radius: 10px;
  background: var(--tk-surface-soft, #f7f7f7);
}

.tk-page-builder-grid > article > strong {
  font-size: 13px;
  font-weight: 750;
}

.tk-page-image-preview {
  width: 100%;
  max-height: 260px;
  margin-top: 8px;
  object-fit: cover;
  border: 1px solid var(--tk-border);
  border-radius: 10px;
  background: #f4f4f4;
}

.tk-edit-main .tk-theme-image {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px dashed var(--tk-border);
  border-radius: 10px;
  background: #fafafa;
}

.tk-edit-main .tk-theme-image > div:first-child {
  display: grid;
  gap: 3px;
}

.tk-edit-main .tk-theme-image > div:first-child small {
  color: var(--tk-muted);
  font-weight: 450;
}

.tk-edit-main .tk-theme-image > [data-page-image-preview] {
  grid-column: 1 / -1;
}

@media (max-width: 900px) {
  .tk-page-builder-grid { grid-template-columns: 1fr; }
}

.tk-label-config-grid > .tk-field {
  align-content: start;
}

.tk-field-grid label,
.tk-price-grid label {
  display: grid;
  gap: 6px;
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 650;
}

.tk-media-uploader {
  overflow: visible;
}

.tk-media-strip {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
  gap: 10px;
}

.tk-media-image-tile,
.tk-media-dropzone {
  position: relative;
  display: grid;
  min-height: 128px;
  place-items: center;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #fbfbfb;
  color: var(--tk-muted);
}

.tk-media-image-tile {
  overflow: hidden;
  padding: 8px;
}

.tk-media-delete-action,
.tk-media-catalog-action {
  position: absolute;
  top: 8px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: rgba(255, 255, 255, .94);
  color: #303030;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .10);
  transition: background .16s ease, border-color .16s ease, transform .16s ease;
}

.tk-media-delete-action {
  left: 8px;
  color: #8e1f0b;
}

.tk-media-catalog-action {
  right: 8px;
}

.tk-media-delete-action:hover,
.tk-media-catalog-action:hover {
  border-color: #303030;
  background: #fff;
  transform: translateY(-1px);
}

.tk-media-delete-action:hover {
  border-color: #8e1f0b;
  background: #fff4f1;
}

.tk-media-catalog-action.is-processing i {
  animation: tk-spin .8s linear infinite;
}

.tk-media-preview-trigger {
  display: grid;
  width: 100%;
  height: 112px;
  place-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}

.tk-media-preview-trigger img {
  width: 100%;
  height: 112px;
  object-fit: contain;
}

.tk-media-preview-dialog {
  width: min(92vw, calc(100vh - 96px), 840px);
  max-width: 840px;
}

.tk-media-preview-modal .modal-header {
  padding: 14px 16px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-media-preview-modal .modal-title {
  font-size: 15px;
  font-weight: 700;
}

.tk-media-preview-modal .modal-body {
  display: grid;
  aspect-ratio: 1 / 1;
  min-height: 0;
  place-items: center;
  padding: 16px;
  background: #f7f7f7;
}

.tk-media-preview-modal img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: var(--tk-radius-sm);
  background: #fff;
}

.tk-media-dropzone {
  gap: 2px;
  padding: 12px;
  border-style: dashed;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.tk-media-dropzone i {
  color: #4d4d4d;
  font-size: 26px;
}

.tk-media-dropzone span {
  color: var(--tk-text);
  font-size: 13px;
  font-weight: 700;
}

.tk-media-dropzone small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-media-dropzone:hover,
.tk-media-dropzone.is-dragging,
.tk-media-dropzone.is-uploading {
  border-color: #303030;
  background: #f3f3f3;
  box-shadow: 0 0 0 2px rgba(48, 48, 48, .08);
}

.tk-price-card.tk-collapsible-card {
  padding-bottom: 24px;
}

.tk-price-card .tk-price-grid {
  margin-bottom: 2px;
}

.tk-section-row {
  justify-content: space-between;
  gap: 12px;
}

.tk-section-row h2 {
  margin-bottom: 0;
}

.tk-collapsible-card {
  padding-bottom: 0;
}

.tk-stock-table {
  overflow: hidden;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
}

.tk-stock-head,
.tk-stock-row {
  display: grid;
  grid-template-columns: minmax(120px, 1.1fr) minmax(160px, 1.5fr) repeat(3, minmax(82px, .7fr));
  align-items: center;
  gap: 10px;
}

.tk-stock-head {
  min-height: 36px;
  padding: 0 12px;
  background: #f7f7f7;
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 750;
}

.tk-stock-row {
  min-height: 44px;
  padding: 8px 12px;
  border-top: 1px solid var(--tk-border);
  color: var(--tk-text);
  font-size: 13px;
}

.tk-stock-row span {
  color: var(--tk-muted);
}

.tk-stock-table-compact .tk-stock-head,
.tk-stock-table-compact .tk-stock-row {
  grid-template-columns: minmax(110px, 1.1fr) minmax(130px, 1.2fr) repeat(3, minmax(62px, .6fr));
  gap: 8px;
}

.tk-stock-table-compact .tk-stock-head {
  min-height: 32px;
  padding: 0 10px;
}

.tk-stock-table-compact .tk-stock-row {
  min-height: 38px;
  padding: 7px 10px;
  font-size: 12px;
}

.tk-empty-inline {
  padding: 18px 12px;
  color: var(--tk-muted);
  font-size: 13px;
}

.tk-combo-editor {
  position: relative;
  display: grid;
  gap: 6px;
}

.tk-combo-input {
  display: flex;
  flex-wrap: wrap;
  min-height: 40px;
  padding: 5px;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, .02);
  gap: 5px;
}

.tk-combo-input:focus-within {
  border-color: #303030;
  box-shadow: 0 0 0 2px rgba(48, 48, 48, .15);
}

.tk-combo-input button {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  min-height: 28px;
  padding: 0 7px 0 9px;
  border: 0;
  border-radius: 6px;
  background: #e7e7e7;
  color: var(--tk-text);
  font-size: 12px;
  font-weight: 650;
  gap: 5px;
}

.tk-combo-input button:hover {
  background: #dedede;
}

[data-combo-editor="tags"] [data-combo-chip] {
  cursor: grab;
}

[data-combo-editor="tags"] [data-combo-chip]:active {
  cursor: grabbing;
}

[data-combo-editor="tags"] [data-combo-chip].is-dragging {
  opacity: .45;
}

.tk-search-terms-dropzone {
  border-radius: var(--tk-radius-sm);
  transition: background-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.tk-search-terms-dropzone.is-drop-ready .tk-combo-input {
  border-style: dashed;
}

.tk-search-terms-dropzone.is-drag-over {
  background: #f3f3f3;
  box-shadow: 0 0 0 3px rgba(48, 48, 48, .12);
  transform: translateY(-1px);
}

.tk-search-terms-dropzone.is-drag-over .tk-combo-input {
  border-color: #303030;
}

.tk-search-terms-dropzone.is-drop-success .tk-combo-input {
  border-color: #29845a;
  box-shadow: 0 0 0 2px rgba(41, 132, 90, .14);
}

.tk-combo-input input {
  flex: 1 0 86px;
  min-width: 72px;
  min-height: 28px;
  border: 0;
  outline: 0;
  color: var(--tk-text);
  font-size: 13px;
}

.tk-combo-menu {
  display: none;
  overflow: auto;
  max-height: 190px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #ffffff;
  box-shadow: 0 8px 18px rgba(0, 0, 0, .12);
}

.tk-combo-editor.open .tk-combo-menu {
  display: block;
}

.tk-combo-menu button {
  display: grid;
  width: 100%;
  min-height: 48px;
  height: auto;
  padding: 7px 10px 8px;
  border: 0;
  border-bottom: 1px solid var(--tk-border);
  background: #ffffff;
  color: var(--tk-text);
  text-align: left;
  line-height: 1.25;
  gap: 1px;
}

.tk-combo-menu button:last-child {
  border-bottom: 0;
}

.tk-combo-menu button:hover {
  background: #f1f1f1;
}

.tk-combo-menu button[hidden] {
  display: none;
}

.tk-combo-menu strong {
  display: block;
  min-width: 0;
  overflow: hidden;
  font-size: 13px;
  line-height: 17px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-combo-menu span {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: var(--tk-muted);
  font-size: 11px;
  line-height: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-metafield-list {
  display: grid;
  gap: 8px;
}

.tk-metafield-row {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) minmax(190px, 1.2fr) minmax(130px, .75fr) minmax(180px, 1.4fr);
  align-items: end;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: #fafafa;
}

.tk-metafield-row.is-new {
  grid-template-columns: minmax(130px, 1fr) minmax(100px, .7fr) minmax(120px, .8fr) minmax(130px, .8fr) minmax(160px, 1.2fr) auto;
}

.tk-metafield-row label {
  min-width: 0;
  margin: 0;
  font-size: 12px;
  font-weight: 650;
}

.tk-metafield-row .tk-control {
  margin-top: 5px;
}

@media (max-width: 1100px) {
  .tk-metafield-row,
  .tk-metafield-row.is-new {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.tk-toggle {
  position: relative;
  display: inline-block;
  width: 34px;
  height: 18px;
  border-radius: 999px;
  background: #d6d6d6;
  box-shadow: inset 0 0 0 1px #b9b9b9;
}

.tk-toggle::after {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.2);
  content: "";
}

.tk-toggle.on {
  background: #303030;
}

.tk-toggle.on::after {
  left: 18px;
}

@media (max-width: 1180px) {
  .tk-settings-layout,
  .tk-edit-layout {
    grid-template-columns: 1fr;
  }

  .tk-settings-side,
  .tk-edit-side {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .tk-settings-side {
    grid-template-columns: 1fr;
  }

  .tk-service-fields {
    grid-template-columns: 1fr;
  }

  .tk-skill-file-zone {
    grid-template-columns: 1fr;
  }

  .tk-edit-top {
    position: static;
    align-items: stretch;
    flex-direction: column;
  }

  .tk-edit-titlebar h1 {
    max-width: 100%;
    white-space: normal;
  }

  .tk-edit-actions {
    flex-wrap: wrap;
  }

  .tk-edit-side {
    grid-template-columns: 1fr;
  }

  .tk-field-grid.two,
  .tk-field-grid.three,
  .tk-field-grid.four,
  .tk-price-grid,
  .tk-stock-head,
  .tk-stock-row {
    grid-template-columns: 1fr;
  }
}

.tk-modal {
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius);
  box-shadow: 0 24px 80px rgba(0, 0, 0, .28);
}

.tk-import-modal .modal-header {
  align-items: flex-start;
  border-bottom: 1px solid #e5e5e5;
  padding: 18px 20px 14px;
}

.tk-import-modal .modal-header > .tk-icon-btn {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  margin-left: auto;
  color: #6d6d6d;
}

.tk-import-modal .modal-title {
  color: #202223;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
  margin: 0;
}

.tk-import-modal .modal-header p {
  color: #616161;
  font-size: 13px;
  line-height: 1.35;
  margin: 5px 0 0;
}

.tk-import-modal .modal-body {
  display: grid;
  gap: 14px;
  padding: 18px 20px;
}

.tk-import-modal .modal-footer {
  align-items: center;
  border-top: 1px solid #e5e5e5;
  display: flex;
  gap: 8px;
  padding: 14px 20px;
}

.tk-import-sample {
  color: #005bd3;
  display: inline-flex;
  font-size: 13px;
  font-weight: 600;
  gap: 6px;
  margin-right: auto;
  text-decoration: none;
}

.tk-import-sample:hover {
  color: #004299;
  text-decoration: underline;
}

.tk-import-dropzone {
  align-items: center;
  background: #fafafa;
  border: 1.5px dashed #babfc3;
  border-radius: 8px;
  color: #303030;
  display: grid;
  gap: 6px;
  justify-items: center;
  min-height: 132px;
  padding: 24px;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
  width: 100%;
}

.tk-import-dropzone:hover,
.tk-import-dropzone.dragging {
  background: #f6f6f7;
  border-color: #8c9196;
  box-shadow: inset 0 0 0 1px #8c9196;
}

.tk-import-dropzone i {
  font-size: 22px;
}

.tk-import-dropzone strong {
  font-size: 13px;
  font-weight: 700;
}

.tk-import-dropzone span {
  color: #616161;
  font-size: 12px;
}

.tk-fx-receptor-grid .tk-fiscal-upload-field,
.tk-fx-top-row .tk-fx-receptor-card .tk-fx-receptor-grid .tk-fiscal-upload-field {
  grid-column: 1 / -1;
  width: 100%;
}

.tk-import-dropzone.tk-fiscal-dropzone {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  min-height: 52px;
  padding: 9px 14px;
  text-align: left;
}

.tk-fiscal-dropzone > i {
  flex: 0 0 24px;
  text-align: center;
}

.tk-fiscal-dropzone > span {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.tk-fiscal-dropzone small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-fiscal-dropzone.is-uploading i {
  animation: tk-spin .7s linear infinite;
}

.tk-import-file {
  align-items: center;
  border: 1px solid #e3e3e3;
  border-radius: 8px;
  display: grid;
  gap: 14px;
  grid-template-columns: 54px 1fr auto;
  min-height: 72px;
  overflow: hidden;
}

.tk-import-file > div {
  align-items: center;
  align-self: stretch;
  background: #f6f6f7;
  border-right: 1px solid #e3e3e3;
  display: flex;
  justify-content: center;
}

.tk-import-file strong {
  font-size: 13px;
  font-weight: 700;
}

.tk-import-file .btn {
  margin-right: 12px;
}

.tk-import-options {
  display: grid;
  gap: 10px;
}

.tk-check-row {
  align-items: flex-start;
  display: grid;
  gap: 10px;
  grid-template-columns: 18px 1fr;
  margin: 0;
}

.tk-check-row strong {
  color: #303030;
  display: block;
  font-size: 13px;
  font-weight: 650;
  line-height: 1.35;
}

.tk-check-row small {
  color: #616161;
  display: block;
  font-size: 12px;
  line-height: 1.35;
  margin-top: 3px;
}

.tk-import-note {
  align-items: center;
  background: #f7f7f7;
  border: 1px solid #e3e3e3;
  border-radius: 8px;
  color: #616161;
  display: flex;
  font-size: 12px;
  gap: 8px;
  line-height: 1.35;
  padding: 10px 12px;
}

.tk-import-note i {
  color: #303030;
  font-size: 14px;
}

.tk-import-preview {
  border: 1px solid #e3e3e3;
  border-radius: 8px;
  overflow: hidden;
}

.tk-import-summary {
  background: #f6f6f7;
  border-bottom: 1px solid #e3e3e3;
  display: flex;
  flex-wrap: wrap;
}

.tk-import-summary span {
  border-right: 1px solid #e3e3e3;
  color: #616161;
  font-size: 12px;
  min-width: 128px;
  padding: 10px 12px;
}

.tk-import-summary strong {
  color: #202223;
  display: block;
  font-size: 15px;
}

.tk-import-preview .tk-table th,
.tk-import-preview .tk-table td {
  font-size: 12px;
  padding: 10px 12px;
}

.tk-import-preview tr.has-error {
  background: #fff4f4;
}

.tk-import-messages {
  display: grid;
  gap: 6px;
  padding: 10px 12px;
}

.tk-import-messages:empty {
  display: none;
}

.tk-import-messages div {
  align-items: flex-start;
  border-radius: 6px;
  display: flex;
  font-size: 12px;
  gap: 8px;
  line-height: 1.35;
  padding: 8px 10px;
}

.tk-import-messages .tone-danger {
  background: #fff4f4;
  color: #8e1f0b;
}

.tk-import-messages .tone-warning {
  background: #fff8db;
  color: #5f370e;
}

.tk-primary-btn.is-loading i,
.tk-soft-btn.is-loading i {
  animation: tk-spin .8s linear infinite;
}

@keyframes tk-spin {
  to {
    transform: rotate(360deg);
  }
}

.tk-command-input {
  height: 44px;
  border-radius: var(--tk-radius-sm);
  font-size: 14px;
}

.tk-global-search {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  left: 0;
  z-index: 60;
  max-height: calc(100vh - 70px);
  overflow: hidden;
  border: 1px solid #d8d8d8;
  border-radius: 10px;
  background: #f7f7f7;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .28);
}

.tk-search button:focus-visible,
.tk-global-search-item:focus-visible,
.tk-global-search-tab:focus-visible {
  outline: 2px solid #5c6ac4;
  outline-offset: -2px;
}

.tk-global-search-tabs {
  display: flex;
  gap: 6px;
  padding: 10px 12px 8px;
  overflow-x: auto;
}

.tk-global-search-tab {
  flex: 0 0 auto;
  padding: 3px 8px;
  border: 0;
  border-radius: 7px;
  background: #e5e5e5;
  color: #303030;
  font-size: 12px;
  line-height: 1.25;
}

.tk-global-search-tab.active {
  background: #303030;
  color: #fff;
}

.tk-global-search-results {
  min-height: 180px;
  max-height: min(530px, calc(100vh - 150px));
  overflow-y: auto;
  padding: 0 10px 10px;
}

.tk-global-search-empty,
.tk-global-search-loading {
  display: grid;
  justify-items: center;
  gap: 6px;
  padding: 56px 20px;
  color: #616161;
  text-align: center;
}

.tk-global-search-empty > i {
  font-size: 24px;
}

.tk-global-search-empty span {
  font-size: 12px;
}

.tk-global-search-group + .tk-global-search-group {
  margin-top: 9px;
  padding-top: 9px;
  border-top: 1px solid #e3e3e3;
}

.tk-global-search-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 8px 6px;
  color: #616161;
  font-size: 12px;
  font-weight: 650;
}

.tk-global-search-group-head a {
  color: #005bd3;
  font-weight: 500;
}

.tk-global-search-item {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 54px;
  padding: 6px 8px;
  border-radius: 9px;
}

.tk-global-search-item:hover,
.tk-global-search-item.active {
  background: #ebebeb;
}

.tk-global-search-thumb {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  overflow: hidden;
  border: 1px solid #e3e3e3;
  border-radius: 7px;
  background: #fff;
  color: #616161;
}

.tk-global-search-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.tk-global-search-copy {
  display: grid;
  min-width: 0;
}

.tk-global-search-copy strong,
.tk-global-search-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-global-search-copy strong {
  color: #303030;
  font-size: 13px;
  font-weight: 550;
}

.tk-global-search-copy small {
  color: #616161;
  font-size: 12px;
}

.tk-global-search-status {
  padding: 2px 7px;
  border-radius: 9px;
  background: #aee9d1;
  color: #0c5132;
  font-size: 11px;
  white-space: nowrap;
}

.tk-global-search-foot {
  display: flex;
  gap: 15px;
  padding: 8px 14px;
  border-top: 1px solid #dedede;
  background: #f1f1f1;
  color: #6d6d6d;
  font-size: 11px;
}

.tk-global-search-foot kbd {
  margin-right: 2px;
  padding: 1px 4px;
  border: 1px solid #d1d1d1;
  border-radius: 4px;
  background: #fff;
  color: #505050;
  box-shadow: none;
}

@media (max-width: 680px) {
  .tk-global-search-foot {
    display: none;
  }
}

.tk-auth-body {
  min-height: 100vh;
  background: #f1f1f1;
  color: var(--tk-ink);
}

.tk-auth-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
}

.tk-auth-panel {
  width: min(420px, 100%);
}

.tk-auth-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}

.tk-auth-brand div {
  display: grid;
  gap: 1px;
}

.tk-auth-brand strong {
  font-size: 18px;
  line-height: 1;
}

.tk-auth-brand span:not(.tk-bag) {
  color: var(--tk-muted);
  font-size: 13px;
}

.tk-auth-card {
  display: grid;
  gap: 14px;
  padding: 22px;
  background: #ffffff;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius);
  box-shadow: 0 18px 55px rgba(0, 0, 0, .10);
}

.tk-auth-card h1 {
  margin: 0 0 4px;
  font-size: 22px;
  font-weight: 650;
  letter-spacing: 0;
}

.tk-auth-head {
  display: grid;
  gap: 2px;
}

.tk-auth-head p {
  color: var(--tk-muted);
  font-size: 13px;
  margin: 0;
}

.tk-auth-card label {
  display: grid;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
}

.tk-auth-card label small {
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
}

.tk-auth-account-input {
  text-transform: lowercase;
}

.tk-auth-tenant {
  display: grid;
  gap: 2px;
  padding: 10px 12px;
  background: #f7f7f7;
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
}

.tk-auth-tenant span,
.tk-auth-tenant small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-auth-tenant strong {
  font-size: 15px;
  font-weight: 650;
}

.tk-auth-alert {
  margin: 0;
  padding: 10px 12px;
}

.tk-google-btn {
  align-items: center;
  background: #ffffff;
  border: 1px solid #c9c9c9;
  border-radius: 8px;
  color: #303030;
  display: inline-flex;
  font-size: 13px;
  font-weight: 650;
  gap: 8px;
  height: 36px;
  justify-content: center;
}

.tk-google-btn:hover,
.tk-google-btn:focus {
  background: #f7f7f7;
  border-color: #8a8a8a;
  color: #202020;
}

.tk-auth-divider {
  align-items: center;
  color: var(--tk-muted);
  display: grid;
  font-size: 12px;
  grid-template-columns: 1fr auto 1fr;
  gap: 10px;
}

.tk-auth-divider::before,
.tk-auth-divider::after {
  background: var(--tk-border);
  content: "";
  height: 1px;
}

.tk-auth-label-row {
  align-items: center;
  display: flex;
  gap: 10px;
  justify-content: space-between;
}

.tk-auth-label-row a {
  color: #616161;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
}

.tk-auth-note {
  align-items: start;
  background: #f7f7f7;
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  color: #616161;
  display: grid;
  font-size: 12px;
  gap: 8px;
  grid-template-columns: auto 1fr;
  padding: 10px 12px;
}

.tk-auth-note code {
  color: #303030;
  font-size: 11px;
}

@media (max-width: 980px) {
  .tk-topbar {
    grid-template-columns: 42px 1fr auto;
    padding-left: 10px;
  }

  .tk-search-shell {
    position: relative;
    left: auto;
    width: 100%;
    transform: none;
  }

  .tk-search {
    width: 100%;
  }

  .tk-top-actions {
    grid-column: auto;
  }

  .tk-brand strong {
    display: none;
  }

  .tk-sidebar {
    width: 68px;
  }

  .tk-nav-item {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .tk-nav-item span,
  .tk-section-title,
  .tk-settings span {
    display: none;
  }

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

  .tk-main {
    padding-left: 92px;
  }

  .tk-metrics,
  .tk-report-grid,
  .tk-migration-hero,
  .tk-migration-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .tk-migration-hero {
    grid-template-columns: 1fr;
  }

  .tk-toggle-grid,
  .tk-channel-summary,
  .tk-document-layout {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tk-document-layout {
    grid-template-columns: 1fr;
  }

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

  .tk-list-stack article {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .tk-guide-card {
    grid-template-columns: 1fr;
  }
}


@media (max-width: 680px) {
  .tk-topbar {
    grid-template-columns: 34px 1fr 76px;
    gap: 8px;
    z-index: 80;
  }

  .tk-top-actions .tk-icon-btn:first-child {
    display: none;
  }
  .tk-top-actions .tk-icon-btn.tk-pos-help-top { display: inline-flex; }

  .tk-sidebar,
  body.tk-sidebar-collapsed .tk-sidebar {
    z-index: 90;
    display: flex;
    width: min(82vw, 292px);
    padding: 12px 12px 16px;
    box-shadow: 0 18px 42px rgba(0, 0, 0, .28);
    transform: translateX(-104%);
    transition: transform .2s ease;
  }

  .tk-sidebar .sidebar-top,
  body.tk-sidebar-collapsed .tk-sidebar .sidebar-top {
    gap: 8px !important;
  }

  .tk-sidebar .tk-nav-item,
  body.tk-sidebar-collapsed .tk-sidebar .tk-nav-item {
    grid-template-columns: 22px 1fr auto;
    justify-items: stretch;
    padding: 4px 8px;
  }

  .tk-sidebar .tk-nav-item span,
  .tk-sidebar .tk-section-title,
  .tk-sidebar .tk-settings span,
  .tk-sidebar .tk-count,
  body.tk-sidebar-collapsed .tk-sidebar .tk-nav-item span,
  body.tk-sidebar-collapsed .tk-sidebar .tk-section-title,
  body.tk-sidebar-collapsed .tk-sidebar .tk-settings span,
  body.tk-sidebar-collapsed .tk-sidebar .tk-count {
    display: block;
  }

  .tk-sidebar .tk-settings,
  body.tk-sidebar-collapsed .tk-sidebar .tk-settings {
    justify-content: flex-start;
    padding: 4px 8px;
  }

  body.tk-sidebar-mobile-open .tk-sidebar,
  body.tk-sidebar-mobile-open.tk-sidebar-collapsed .tk-sidebar {
    transform: translateX(0);
  }

  .tk-sidebar-backdrop {
    position: fixed;
    inset: 56px 0 0;
    z-index: 85;
    display: block;
    background: rgba(0, 0, 0, .32);
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
  }

  body.tk-sidebar-mobile-open .tk-sidebar-backdrop {
    opacity: 1;
    pointer-events: auto;
  }

  body.tk-sidebar-mobile-open {
    overflow: hidden;
  }

  .tk-main,
  body.tk-sidebar-collapsed .tk-main {
    padding: 72px 12px 26px;
  }

  .tk-filter-row,
  .tk-action-grid,
  .tk-page-header {
    align-items: stretch;
    flex-direction: column;
  }

  .tk-filter-btn,
  .tk-mini-card,
  .tk-live-pill {
    width: 100%;
  }

  .tk-metrics,
  .tk-report-grid,
  .tk-migration-counts,
  .tk-migration-grid,
  .tk-toggle-grid,
  .tk-channel-summary,
  .tk-tool-summary,
  .tk-document-layout,
  .tk-fx-bottom,
  .tk-fact-grid {
    grid-template-columns: 1fr;
  }

  .tk-page-wide .tk-fx-totals {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-width: 0;
    width: 100%;
  }

  .tk-metrics article {
    border-right: 0;
    border-bottom: 1px solid #eeeeee;
  }

  .tk-guide-card footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .tk-guide-card footer button {
    margin-left: 0;
  }
}

.tk-orders-page .tk-list-table td {
  white-space: nowrap;
}

.tk-orders-page .tk-orders-table th,
.tk-orders-page .tk-orders-table td {
  padding-left: 4px;
  padding-right: 4px;
}

.tk-orders-page .tk-product-cell {
  min-width: 220px;
}

.tk-orders-page .tk-orders-payment-col {
  width: 112px;
  min-width: 112px;
  max-width: 112px;
}

.tk-orders-page .tk-orders-payment-col .tk-muted-line {
  max-width: 88px;
}

.tk-orders-page .tk-orders-delivery-col {
  width: 68px;
  min-width: 68px;
  text-align: center;
}

.tk-orders-page .tk-delivery-icon {
  display: inline-grid;
  width: 30px;
  height: 30px;
  place-items: center;
  color: #303030;
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
}

.tk-orders-page .tk-delivery-icon .bi {
  -webkit-text-stroke: 0.35px currentColor;
}

.tk-orders-page .tk-actions-cell {
  width: 138px;
  min-width: 138px;
}

.tk-order-detail {
  padding-bottom: 0;
}

.tk-order-detail .tk-edit-top {
  position: sticky;
  top: 56px;
  z-index: 38;
}

.tk-order-detail .tk-fx-document-stack {
  align-items: start;
  grid-template-columns: minmax(240px, 1fr) minmax(0, 3fr);
}

.tk-order-detail .tk-fx-top-row {
  display: contents;
}

.tk-order-detail .tk-fx-top-row > .tk-panel:first-child {
  position: relative;
  z-index: 30;
  align-self: start;
  grid-column: 1;
  grid-row: 1 / span 3;
  overflow: visible;
  border-radius: var(--tk-radius);
  background-clip: padding-box;
}

.tk-order-detail .tk-fx-top-row > .tk-panel:last-child {
  position: relative;
  z-index: 30;
  grid-column: 2;
  grid-row: 1;
  overflow: visible;
  border-radius: var(--tk-radius);
  background-clip: padding-box;
}

.tk-order-detail .tk-order-lines-card {
  position: relative;
  z-index: 20;
  grid-column: 2;
  grid-row: 2;
  overflow: visible;
  border-radius: var(--tk-radius);
  background-clip: padding-box;
}

.tk-order-detail .tk-fx-document-stack > .tk-table-card:last-child {
  grid-column: 2;
  grid-row: 3;
  border-radius: var(--tk-radius);
  background-clip: padding-box;
}

.tk-order-detail .tk-panel > .tk-panel-head,
.tk-order-detail .tk-order-lines-card > .tk-section-head,
.tk-order-detail .tk-fx-document-stack > .tk-table-card:last-child > .tk-section-head {
  border-radius: calc(var(--tk-radius) - 1px) calc(var(--tk-radius) - 1px) 0 0;
}

.tk-order-detail .tk-order-lines-card > .tk-fx-bottom {
  overflow: hidden;
  border-radius: 0 0 calc(var(--tk-radius) - 1px) calc(var(--tk-radius) - 1px);
}

.tk-order-client-grid {
  grid-template-columns: 1fr;
}

.tk-order-client-head-actions {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 8px;
}

.tk-order-client-head-actions > span {
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-order-client-head-actions > .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  min-height: 30px;
  padding: 5px 9px;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
}

.tk-order-client-head-actions > .btn i {
  line-height: 1;
}

.tk-order-client-grid .tk-order-comments-field {
  grid-column: auto;
}

.tk-order-delivery-address {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--tk-border);
  border-radius: 10px;
  background: #fafafa;
}

.tk-order-delivery-address-head {
  display: flex;
  align-items: center;
  gap: 9px;
}

.tk-order-delivery-address-icon {
  display: inline-grid;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  place-items: center;
  border-radius: 8px;
  background: #ededed;
  color: #616161;
}

.tk-order-delivery-address-head > div,
.tk-order-delivery-address-copy,
.tk-order-delivery-address-empty {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.tk-order-delivery-address-change {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 28px;
  margin-left: auto;
  padding: 4px 8px;
  font-size: 11px;
  line-height: 1;
}

.tk-order-delivery-address-head strong,
.tk-order-delivery-address-copy strong,
.tk-order-delivery-address-empty strong {
  color: #303030;
  font-size: 12px;
  line-height: 1.25;
}

.tk-order-delivery-address-head small,
.tk-order-delivery-address-copy span,
.tk-order-delivery-address-copy small,
.tk-order-delivery-address-empty span {
  color: var(--tk-muted);
  font-size: 11px;
  line-height: 1.35;
}

.tk-order-delivery-address-copy {
  padding-left: 39px;
}

.tk-order-delivery-address-copy span,
.tk-order-delivery-address-copy small {
  overflow-wrap: anywhere;
}

.tk-order-address-options {
  display: grid;
  gap: 8px;
}

.tk-order-address-option {
  position: relative;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 20px;
  align-items: center;
  gap: 10px;
  min-height: 76px;
  padding: 12px;
  border: 1px solid var(--tk-border);
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
}

.tk-order-address-option:hover {
  background: #fafafa;
}

.tk-order-address-option:has(input:checked) {
  border-color: #303030;
  box-shadow: 0 0 0 1px #303030;
}

.tk-order-address-option > input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.tk-order-address-option-icon {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 8px;
  background: #f1f1f1;
  color: #616161;
}

.tk-order-address-option-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.tk-order-address-option-copy strong {
  color: #303030;
  font-size: 13px;
}

.tk-order-address-option-copy span,
.tk-order-address-option-copy small {
  overflow: hidden;
  color: var(--tk-muted);
  font-size: 12px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-order-address-option-check {
  color: #303030;
  opacity: 0;
}

.tk-order-address-option:has(input:checked) .tk-order-address-option-check {
  opacity: 1;
}

.tk-order-store-display[readonly] {
  background: #f7f7f7;
  color: #303030;
  cursor: default;
}

.tk-order-client-grid .tk-autocomplete-menu {
  width: min(520px, 100%);
}

.tk-order-product-combobox .tk-autocomplete-menu {
  width: min(720px, 100%);
}

.tk-autocomplete.tk-list-search > input {
  padding-left: 34px;
}

.tk-order-summary-grid {
  display: grid;
  column-gap: 36px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 6px 16px 8px;
}

.tk-order-summary-column {
  align-content: start;
  display: grid;
  gap: 0;
  min-width: 0;
}

.tk-order-summary-column > div {
  align-items: baseline;
  display: flex;
  gap: 12px;
  min-width: 0;
  padding: 2px 0;
}

.tk-order-summary-column.is-customer > div {
  justify-content: flex-start;
}

.tk-order-summary-column.is-order > div {
  justify-content: flex-end;
  text-align: right;
}

.tk-order-summary-select {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: auto minmax(132px, 168px);
  justify-content: end;
  padding: 2px 0;
}

.tk-order-summary-select .tk-rich-select {
  text-align: left;
}

.tk-order-summary-column span {
  color: #6d7175;
  font-size: 12px;
  line-height: 16px;
  white-space: nowrap;
}

.tk-order-summary-column strong {
  color: #202223;
  font-size: 13px;
  font-weight: 700;
  line-height: 16px;
  min-width: 0;
}

.tk-order-price-type-field {
  padding-top: 2px;
}

.tk-order-detail .tk-section-actions,
.tk-order-detail .tk-edit-actions {
  display: flex;
  gap: 8px;
}

.tk-modal-form-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tk-modal-form-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tk-modal-form-grid.one-column {
  grid-template-columns: 1fr;
}

.tk-modal-form-grid .span-3 {
  grid-column: span 3;
}

.tk-modal-form-grid .span-all {
  grid-column: 1 / -1;
}

.tk-modal-form-grid label,
.tk-order-add-row label {
  color: #303030;
  display: grid;
  font-size: 13px;
  font-weight: 650;
  gap: 6px;
}

.tk-modal-form-grid input,
.tk-modal-form-grid select,
.tk-modal-form-grid textarea,
.tk-order-add-row input,
.tk-order-add-row select,
.tk-order-lines-table input:not(.form-check-input) {
  background: #ffffff;
  border: 1px solid #c9cccf;
  border-radius: 8px;
  color: #303030;
  font-size: 13px;
  min-height: 36px;
  padding: 8px 10px;
  width: 100%;
}

.tk-modal-form-grid textarea {
  resize: vertical;
}

.tk-checkout-modal .modal-dialog {
  max-width: 920px;
}

.tk-checkout-layout {
  display: grid;
  gap: 0;
  grid-template-columns: minmax(0, 1.55fr) minmax(280px, .85fr);
  padding: 0 !important;
}

.tk-checkout-entry {
  padding: 20px;
}

.tk-checkout-section-head {
  align-items: center;
  display: flex;
  margin-bottom: 16px;
}

.tk-checkout-section-head div {
  display: grid;
  gap: 2px;
}

.tk-checkout-section-head strong,
.tk-checkout-summary-title strong {
  color: #202223;
  font-size: 14px;
}

.tk-checkout-section-head span,
.tk-checkout-payment span {
  color: #6d7175;
  font-size: 12px;
}

.tk-payment-methods {
  display: flex;
  gap: 8px;
  margin: -2px 0 16px;
  overflow-x: auto;
  padding: 2px 2px 5px;
  scrollbar-width: thin;
}

.tk-payment-method-card {
  align-items: center;
  background: #ffffff;
  border: 1px solid #d1d1d1;
  border-radius: 10px;
  color: #303030;
  display: grid;
  flex: 1 0 126px;
  gap: 5px;
  grid-template-columns: auto minmax(0, 1fr) auto;
  min-height: 58px;
  padding: 9px 10px;
  text-align: left;
  transition: background .14s ease, border-color .14s ease, box-shadow .14s ease, transform .14s ease;
}

.tk-payment-method-card:hover {
  border-color: #8a8a8a;
  transform: translateY(-1px);
}

.tk-payment-method-card:focus-visible {
  box-shadow: 0 0 0 2px #303030;
  outline: 0;
}

.tk-payment-method-card.is-selected {
  background: #303030;
  border-color: #303030;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .16);
  color: #ffffff;
}

.tk-payment-method-card > i:first-child {
  font-size: 17px;
}

.tk-payment-method-card > span {
  display: -webkit-box;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.22;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.tk-payment-method-check {
  font-size: 13px;
  opacity: 0;
}

.tk-payment-method-card.is-selected .tk-payment-method-check {
  opacity: 1;
}

.tk-checkout-primary-row {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tk-modal-form-grid .tk-checkout-amount-field {
  align-content: start;
  gap: 5px;
}

.tk-checkout-primary-row .tk-checkout-amount-field {
  align-content: start;
  display: grid;
  gap: 5px;
}

.tk-checkout-amount-field > span:first-child {
  color: #616161;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.tk-money-input {
  align-items: baseline;
  background: #ffffff;
  border: 1px solid #8a8a8a;
  border-radius: 12px;
  display: flex;
  min-height: 62px;
  overflow: hidden;
  padding: 10px 14px;
  transition: border-color .14s ease, box-shadow .14s ease, background .14s ease;
}

.tk-money-input:focus-within {
  border-color: #303030;
  box-shadow: 0 0 0 2px #303030;
}

.tk-money-input-symbol {
  color: #202223;
  flex: 0 0 auto;
  font-size: 24px;
  font-weight: 750;
  line-height: 1;
  margin-right: 3px;
}

.tk-money-input input {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: #111111;
  font-size: clamp(26px, 2.4vw, 34px);
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  letter-spacing: -.035em;
  line-height: 1;
  min-height: 40px;
  outline: 0;
  padding: 0;
  width: 100%;
}

.tk-reference-input {
  align-items: center;
  background: #ffffff;
  border: 1px solid #8a8a8a;
  border-radius: 12px;
  display: flex;
  min-height: 62px;
  overflow: hidden;
  padding: 10px 14px;
  transition: border-color .14s ease, box-shadow .14s ease;
}

.tk-reference-input:focus-within {
  border-color: #303030;
  box-shadow: 0 0 0 2px #303030;
}

.tk-reference-input input {
  background: transparent;
  border: 0;
  box-shadow: none;
  color: #202223;
  font-size: 17px;
  font-weight: 600;
  min-height: 40px;
  outline: 0;
  padding: 0;
  width: 100%;
}

.tk-checkout-amount-field small {
  color: #6d7175;
  font-size: 11px;
  font-weight: 500;
}

.tk-checkout-add {
  align-items: center;
  display: inline-flex;
  font-size: 14px;
  font-weight: 700;
  justify-content: center;
  margin-top: 14px;
  min-height: 46px;
  width: 100%;
}

.tk-checkout-payments {
  border-top: 1px solid #e5e5e5;
  margin-top: 18px;
  padding-top: 10px;
}

.tk-checkout-empty {
  align-items: center;
  color: #6d7175;
  display: flex;
  font-size: 13px;
  gap: 8px;
  padding: 16px 4px;
}

.tk-checkout-payment-head {
  color: #6d7175;
  display: grid;
  font-size: 10px;
  font-weight: 700;
  gap: 14px;
  grid-template-columns: minmax(145px, 1.35fr) minmax(80px, .7fr) minmax(135px, 1fr) 30px;
  letter-spacing: .045em;
  padding: 5px 0 7px;
  text-transform: uppercase;
}

.tk-checkout-payment-head > span:nth-child(3) {
  text-align: right;
}

.tk-checkout-payment {
  align-items: start;
  border-bottom: 1px solid #eeeeee;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(145px, 1.35fr) minmax(80px, .7fr) minmax(135px, 1fr) 30px;
  min-height: 44px;
  padding: 8px 0;
}

.tk-checkout-payment-method,
.tk-checkout-payment-amount {
  display: grid;
}

.tk-checkout-payment-method {
  align-items: center;
  gap: 7px;
  grid-template-columns: 18px minmax(0, 1fr);
}

.tk-checkout-payment-method > i {
  color: #616161;
  font-size: 14px;
}

.tk-checkout-payment-method strong,
.tk-checkout-payment-amount strong {
  font-size: 13px;
  line-height: 1.3;
}

.tk-checkout-payment-reference {
  color: #616161;
  font-size: 12px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-checkout-payment-amount {
  justify-items: end;
  min-width: 0;
  text-align: right;
}

.tk-checkout-payment-amount span {
  color: #008060;
  font-size: 10px;
  line-height: 1.3;
  margin-top: 2px;
  max-width: 100%;
  overflow-wrap: anywhere;
  white-space: normal;
}

.tk-checkout-payment-remove {
  align-self: center;
  color: #616161;
  height: 30px;
  width: 30px;
}

.tk-checkout-payment-remove:hover {
  background: #f1f1f1;
  color: #202223;
}

.tk-payment-confirm-body {
  display: grid !important;
  gap: 16px !important;
}

.tk-payment-confirm-summary {
  background: #f7f7f7;
  border: 1px solid #e5e5e5;
  border-radius: 10px;
  padding: 4px 14px;
}

.tk-payment-confirm-summary > div {
  align-items: center;
  border-bottom: 1px solid #e5e5e5;
  display: flex;
  font-size: 13px;
  justify-content: space-between;
  padding: 10px 0;
}

.tk-payment-confirm-summary > div:last-child {
  border-bottom: 0;
}

.tk-payment-confirm-summary strong {
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}

.tk-money-input.is-invalid {
  background: #fff4f4;
  border-color: #c70a24;
  box-shadow: 0 0 0 1px #c70a24;
}

.tk-checkout-summary {
  background: #f7f7f7;
  border-left: 1px solid #e5e5e5;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 20px;
}

.tk-checkout-summary-title {
  align-items: center;
  display: flex;
  gap: 8px;
  margin-bottom: 13px;
}

.tk-checkout-summary > div:not(.tk-checkout-summary-title) {
  align-items: center;
  border-bottom: 1px solid #e5e5e5;
  display: flex;
  font-size: 13px;
  justify-content: space-between;
  padding: 10px 0;
}

.tk-checkout-summary .is-balance {
  border-bottom: 0 !important;
  font-size: 15px !important;
  padding-top: 16px !important;
}

.tk-checkout-summary .is-balance strong {
  font-size: 20px;
}

.tk-checkout-summary .is-change strong {
  color: #008060;
}

.tk-checkout-summary .is-short strong {
  color: #9a5b00;
}

.tk-checkout-summary .is-exact strong {
  color: #303030;
}

.tk-checkout-notice {
  align-items: flex-start;
  background: #eef7f3;
  border-radius: 8px;
  color: #315c4e;
  display: flex;
  font-size: 12px;
  gap: 8px;
  line-height: 1.4;
  margin: 12px 0 0;
  padding: 10px;
}

@media (max-width: 767px) {
  .tk-checkout-layout {
    grid-template-columns: 1fr;
  }

  .tk-checkout-primary-row {
    grid-template-columns: 1fr;
  }

  .tk-checkout-payment-head {
    display: none;
  }

  .tk-checkout-payment {
    grid-template-columns: minmax(0, 1fr) auto 32px;
  }

  .tk-checkout-payment-reference {
    display: none;
  }

  .tk-checkout-summary {
    border-left: 0;
    border-top: 1px solid #e5e5e5;
  }
}

.tk-order-add-row {
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(360px, 1fr) 120px 140px;
  padding: 14px 16px;
}

.tk-order-shopify-adjustment {
  align-items: center;
  background: #fff8e6;
  border: 1px solid #ead9a6;
  border-radius: 8px;
  color: #5c4813;
  display: flex;
  gap: 10px;
  margin: 0 16px 12px;
  padding: 9px 11px;
}

.tk-order-shopify-adjustment > i {
  font-size: 17px;
}

.tk-order-shopify-adjustment > div {
  display: grid;
  gap: 1px;
}

.tk-order-shopify-adjustment strong {
  font-size: 12px;
}

.tk-order-shopify-adjustment span {
  font-size: 11px;
}

.tk-order-lines-card .tk-fx-table-shell {
  border: 1px solid #e1e3e5;
  border-radius: 8px;
  margin: 0 16px;
}

.tk-order-expanded-column {
  display: none;
}

.tk-order-detail .tk-order-lines-card.is-maximized .tk-order-compact-column {
  display: none;
}

.tk-order-detail .tk-order-lines-card.is-maximized .tk-order-expanded-column {
  display: table-cell;
}

.tk-order-detail .tk-order-lines-card.is-maximized .tk-order-lines-table {
  min-width: 1960px;
}

.tk-order-detail .tk-order-lines-card.is-maximized .tk-order-lines-table thead {
  position: sticky;
  top: 0;
  z-index: 2;
}

.tk-order-line-image {
  align-items: center;
  background: var(--tk-surface-soft);
  border: 1px solid var(--tk-border);
  border-radius: 6px;
  color: var(--tk-muted);
  display: inline-flex;
  height: 42px;
  justify-content: center;
  overflow: hidden;
  width: 42px;
}

.tk-order-line-image img {
  height: 100%;
  object-fit: contain;
  width: 100%;
}

body.tk-order-lines-maximized {
  overflow: hidden;
}

.tk-order-detail .tk-order-lines-card.is-maximized {
  background: var(--tk-surface);
  border: 0;
  border-radius: 0;
  display: flex;
  flex-direction: column;
  height: 100dvh;
  inset: 0;
  margin: 0;
  position: fixed;
  width: 100vw;
  z-index: 1040;
}

.tk-order-detail .tk-order-lines-card.is-maximized > .tk-section-head {
  border-radius: 0;
  flex: 0 0 auto;
}

.tk-order-detail .tk-order-lines-card.is-maximized .tk-order-add-row,
.tk-order-detail .tk-order-lines-card.is-maximized .tk-order-price-progress,
.tk-order-detail .tk-order-lines-card.is-maximized > .tk-fx-bottom {
  flex: 0 0 auto;
}

.tk-order-detail .tk-order-lines-card.is-maximized .tk-fx-table-shell {
  flex: 1 1 auto;
  margin-bottom: 14px;
  min-height: 0;
  overflow: auto;
}

.tk-order-detail .tk-order-lines-card.is-maximized > .tk-fx-bottom {
  border-radius: 0;
}

.tk-order-line-edit {
  background: #ffffff;
  border: 1px solid var(--tk-border-strong);
  border-radius: 6px;
  font: inherit;
  min-height: 32px;
  min-width: 76px;
  padding: 5px 7px;
  width: 100%;
}

.tk-order-line-edit[data-line-name] {
  min-width: 260px;
}

.tk-order-line-edit[data-line-read-description] {
  min-width: 260px;
}

.tk-order-line-edit[data-line-unit],
.tk-order-line-edit[data-line-reference],
.tk-order-line-edit[data-line-brand],
.tk-order-line-edit[data-line-model] {
  min-width: 120px;
}

.tk-order-line-edit:focus {
  border-color: #303030;
  box-shadow: 0 0 0 2px rgba(48, 48, 48, .08);
  outline: 0;
}

.tk-order-lines-card.is-editing-items .tk-order-description-more {
  display: none;
}

.tk-order-item-workspace[hidden] {
  display: none;
}

.tk-order-item-workspace {
  display: grid;
  flex: 1 1 auto;
  grid-template-columns: minmax(240px, 300px) minmax(0, 1fr);
  margin: 0 16px 14px;
  min-height: 0;
  overflow: hidden;
}

.tk-order-lines-card.is-workspace-open .tk-fx-table-shell {
  display: none;
}

.tk-order-item-list-panel {
  background: var(--tk-surface-soft);
  border: 1px solid var(--tk-border);
  border-radius: 8px 0 0 8px;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

.tk-order-item-list-head {
  align-items: center;
  border-bottom: 1px solid var(--tk-border);
  display: flex;
  justify-content: space-between;
  padding: 12px;
}

.tk-order-item-list-head div {
  display: grid;
  gap: 2px;
}

.tk-order-item-list-head small {
  color: var(--tk-muted);
  font-size: 11px;
}

.tk-order-item-list {
  display: grid;
  overflow: auto;
}

.tk-order-item-list-row {
  align-items: center;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--tk-border);
  color: var(--tk-text);
  display: grid;
  gap: 9px;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  min-height: 62px;
  padding: 9px 11px;
  text-align: left;
}

.tk-order-item-list-row:hover,
.tk-order-item-list-row.active {
  background: #ffffff;
}

.tk-order-item-list-row.active {
  box-shadow: inset 3px 0 0 #303030;
}

.tk-order-item-list-row > span {
  align-items: center;
  background: #e8e8e8;
  border-radius: 50%;
  display: inline-flex;
  font-size: 11px;
  height: 24px;
  justify-content: center;
  width: 24px;
}

.tk-order-item-list-row div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.tk-order-item-list-row strong,
.tk-order-item-list-row small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-order-item-list-row small {
  color: var(--tk-muted);
  font-size: 11px;
}

.tk-order-item-list-row b {
  font-size: 12px;
}

.tk-order-item-editor {
  border: 1px solid var(--tk-border);
  border-left: 0;
  border-radius: 0 8px 8px 0;
  min-width: 0;
  overflow: auto;
}

.tk-order-item-editor-head {
  align-items: center;
  border-bottom: 1px solid var(--tk-border);
  display: flex;
  justify-content: space-between;
  padding: 10px 14px;
  position: sticky;
  top: 0;
  background: #ffffff;
  z-index: 1;
}

.tk-order-item-editor-identity {
  align-items: center;
  display: flex;
  gap: 10px;
}

.tk-order-item-editor-identity > strong {
  color: var(--tk-text);
  font-size: 34px;
  font-weight: 760;
  letter-spacing: -.04em;
  line-height: 1;
  min-width: 30px;
}

.tk-order-item-editor-identity > div {
  display: grid;
  gap: 1px;
}

.tk-order-item-editor-identity b {
  font-size: 12px;
  line-height: 1.1;
}

.tk-order-item-editor-head span {
  color: var(--tk-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .06em;
}

.tk-order-item-navigation {
  display: flex;
  gap: 6px;
}

.tk-order-item-editor-grid {
  display: grid;
  gap: 11px 14px;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  padding: 14px 16px;
}

.tk-order-item-editor-descriptions {
  display: grid;
  gap: 14px;
  grid-column: span 5;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tk-order-item-editor-primary {
  display: grid;
  gap: 14px;
  grid-column: span 5;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.tk-order-item-editor-description textarea {
  min-height: 62px;
  resize: vertical;
}

.tk-order-item-editor-grid [data-order-editor-field="brand"],
.tk-order-item-editor-grid [data-order-editor-field="model"],
.tk-order-item-editor-grid [data-order-editor-field="base-price"],
.tk-order-item-editor-grid [data-order-editor-field="iva"],
.tk-order-model-lookup {
  height: 34px;
  min-height: 34px;
  max-height: 34px;
  align-self: start;
}

.tk-order-item-editor-image-field {
  align-self: stretch;
  display: flex;
  grid-row: span 2;
  min-height: 0;
}

.tk-order-item-editor-image-drop {
  border-radius: 8px;
  display: flex;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  position: relative;
}

.tk-order-item-editor-image {
  align-items: center;
  background: var(--tk-surface-soft);
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  color: var(--tk-muted);
  display: flex;
  flex: 1 1 auto;
  height: 100%;
  justify-content: center;
  overflow: hidden;
}

.tk-order-item-image-hint {
  align-items: center;
  color: var(--tk-muted);
  display: flex;
  flex-direction: column;
  font-size: 11px;
  gap: 5px;
  inset: 0;
  justify-content: center;
  padding: 12px;
  pointer-events: none;
  position: absolute;
  text-align: center;
}

.tk-order-item-image-hint i {
  font-size: 19px;
}

.tk-order-item-editor-image-drop.has-image .tk-order-item-image-hint {
  display: none;
}

.tk-order-item-image-actions {
  display: flex;
  gap: 4px;
  position: absolute;
  right: 7px;
  top: 7px;
}

.tk-order-item-image-actions .tk-icon-btn {
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 1px 3px rgba(0, 0, 0, .12);
}

.tk-order-item-editor-image-drop.is-disabled .tk-order-item-image-actions {
  display: none;
}

.tk-order-item-editor-image-drop.is-dragging {
  box-shadow: 0 0 0 3px rgba(48, 48, 48, .18);
}

.tk-order-item-editor-image-drop.is-uploading::after {
  align-items: center;
  background: rgba(255, 255, 255, .82);
  content: "Guardando JPG…";
  display: flex;
  font-size: 12px;
  font-weight: 700;
  inset: 0;
  justify-content: center;
  position: absolute;
  z-index: 3;
}

.tk-order-item-editor-image img {
  height: 100%;
  object-fit: contain;
  width: 100%;
}

.tk-order-item-calculated {
  align-self: stretch;
  background: var(--tk-surface-soft);
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  display: grid;
  gap: 2px;
  grid-column: span 2;
  min-height: 58px;
  padding: 8px 11px;
  text-align: right;
}

.tk-order-item-calculated span {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-order-item-calculated input {
  background: transparent;
  border: 0;
  color: var(--tk-text);
  font-size: 15px;
  font-weight: 750;
  min-height: 22px;
  padding: 0;
  text-align: right;
}

.tk-order-item-calculated input:focus {
  box-shadow: none;
  outline: 0;
}

.tk-order-item-calculated.is-total {
  background: var(--tk-surface-soft);
  border-color: var(--tk-border);
}

.tk-order-item-calculated.is-total span {
  color: var(--tk-muted);
}

.tk-order-item-calculated.is-total input {
  color: var(--tk-text);
  font-size: 15px;
}

@media (max-width: 900px) {
  .tk-order-item-workspace {
    grid-template-columns: 210px minmax(520px, 1fr);
    overflow: auto;
  }

  .tk-order-item-editor-grid {
    grid-template-columns: repeat(3, minmax(140px, 1fr));
  }

  .tk-order-item-editor-descriptions {
    grid-column: span 3;
  }

  .tk-order-item-editor-primary {
    grid-column: span 3;
  }
}

.tk-purchase-order-detail .tk-order-lines-card {
  border-radius: var(--tk-radius);
  overflow: hidden;
}

.tk-purchase-order-detail .tk-fx-top-row > .tk-panel:first-child,
.tk-purchase-order-detail .tk-fx-top-row > .tk-panel:last-child {
  border-radius: var(--tk-radius);
  overflow: hidden;
}

.tk-order-detail .tk-fx-document-stack > .tk-purchase-receipts-card {
  grid-column: 2;
  grid-row: 3;
  min-width: 0;
  border-radius: var(--tk-radius);
}

.tk-order-detail .tk-fx-document-stack > .tk-table-card.tk-purchase-sources-card:last-child {
  grid-column: 2;
  grid-row: 4;
  min-width: 0;
  border-radius: var(--tk-radius);
}

.tk-purchase-receipts-table th:first-child,
.tk-purchase-receipts-table td:first-child { width: 150px; }
.tk-purchase-receipts-table th:nth-child(2),
.tk-purchase-receipts-table td:nth-child(2) { width: 170px; white-space: nowrap; }
.tk-purchase-receipts-table th:nth-child(3),
.tk-purchase-receipts-table td:nth-child(3) { width: 120px; }
.tk-purchase-receipts-table th:nth-child(5),
.tk-purchase-receipts-table td:nth-child(5),
.tk-purchase-receipts-table th:nth-child(6),
.tk-purchase-receipts-table td:nth-child(6) { width: 90px; }
.tk-purchase-receipts-table th:nth-child(7),
.tk-purchase-receipts-table td:nth-child(7) { width: 140px; white-space: nowrap; }

.tk-purchase-order-detail .tk-order-lines-card .tk-fx-table-shell {
  overflow-x: auto;
  overflow-y: hidden;
}

.tk-purchase-order-detail .tk-order-lines-card .tk-fx-bottom {
  border-radius: 0 0 var(--tk-radius) var(--tk-radius);
}

.tk-purchase-order-detail .tk-order-lines-card .tk-fx-totals {
  border-radius: 10px;
}

.tk-purchase-close-modal .modal-header p {
  margin: 3px 0 0;
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-purchase-settlement-summary {
  display: grid;
  gap: 2px;
  margin-bottom: 18px;
  padding: 16px;
  border: 1px solid #b7dfcf;
  border-radius: 10px;
  background: #eef8f3;
}

.tk-purchase-settlement-summary span,
.tk-purchase-settlement-summary small {
  color: #4a675b;
}

.tk-purchase-settlement-summary strong {
  font-size: 28px;
  line-height: 1.2;
  letter-spacing: -.02em;
}

.tk-settlement-options {
  display: grid;
  gap: 8px;
  margin: 0 0 16px;
  padding: 0;
  border: 0;
}

.tk-settlement-options legend {
  margin-bottom: 7px;
  font-size: 13px;
  font-weight: 650;
}

.tk-settlement-option {
  position: relative;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 12px;
  border: 1px solid var(--tk-border);
  border-radius: 9px;
  background: #fff;
  cursor: pointer;
}

.tk-settlement-option:has(input:checked) {
  border-color: #303030;
  box-shadow: 0 0 0 1px #303030;
}

.tk-settlement-option input {
  position: absolute;
  opacity: 0;
}

.tk-settlement-option-icon {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 8px;
  background: #f1f1f1;
}

.tk-settlement-option:has(input:checked) .tk-settlement-option-icon {
  background: #303030;
  color: #fff;
}

.tk-settlement-option strong,
.tk-settlement-option small {
  display: block;
}

.tk-settlement-option small {
  margin-top: 2px;
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-purchase-close-warning {
  display: flex;
  gap: 8px;
  margin: 14px 0 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: #f6f6f6;
  color: #616161;
  font-size: 12px;
}

.tk-order-lines-table th,
.tk-order-lines-table td {
  padding-left: 2px;
  padding-right: 2px;
  vertical-align: middle;
  white-space: nowrap;
}

.tk-order-lines-table {
  min-width: 900px;
  table-layout: fixed;
  width: 100%;
}

.tk-order-lines-table th:nth-child(1),
.tk-order-lines-table td:nth-child(1) {
  min-width: 84px;
  width: 84px;
}

.tk-order-lines-table th:nth-child(2),
.tk-order-lines-table td:nth-child(2) {
  min-width: 360px;
  width: 60%;
}

.tk-order-lines-table tbody td {
  font-size: 11px;
  padding: 2px;
}

.tk-order-lines-table thead th {
  font-size: 11px;
}

.tk-order-product-key,
.tk-order-product-copy {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.tk-order-product-key strong {
  display: block;
  font-size: 11px;
  font-weight: 650;
  line-height: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-order-product-key small,
.tk-order-product-copy small {
  color: var(--tk-muted);
  font-size: 10px;
  line-height: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-order-description-cell {
  align-items: center;
  display: flex;
  gap: 4px;
  min-width: 0;
}

.tk-order-line-description {
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  display: block;
  flex: 0 1 calc(100% - 24px);
  line-height: 14px;
  max-width: calc(100% - 24px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-order-product-copy:not(.has-secondary) .tk-order-line-description {
  -webkit-line-clamp: 2;
  display: -webkit-box;
  white-space: normal;
}

.tk-order-description-more {
  align-items: center;
  background: transparent;
  border: 0;
  color: var(--tk-muted);
  display: inline-flex;
  flex: 0 0 20px;
  height: 20px;
  justify-content: center;
  padding: 0;
  width: 20px;
}

.tk-order-description-more:hover,
.tk-order-description-more:focus-visible {
  color: var(--tk-text);
  outline: 0;
}

.tk-order-description-tooltip .tooltip-inner {
  background: #ffffff;
  border: 1px solid var(--tk-border-strong);
  border-radius: var(--tk-radius-sm);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
  color: var(--tk-text);
  font-size: 12px;
  line-height: 1.4;
  max-width: 360px;
  padding: 9px 11px;
  text-align: left;
}

.tk-order-description-tooltip.bs-tooltip-top .tooltip-arrow::before {
  border-top-color: var(--tk-border-strong);
}

.tk-order-lines-table [data-line-remove] {
  height: 24px;
  min-height: 24px;
  padding: 0;
  width: 24px;
}

.tk-order-lines-table th:nth-child(3),
.tk-order-lines-table td:nth-child(3) {
  width: 36px;
}

.tk-order-lines-table th:nth-child(4),
.tk-order-lines-table td:nth-child(4) {
  width: 44px;
}

.tk-order-lines-table th:nth-child(5),
.tk-order-lines-table td:nth-child(5) {
  width: 56px;
}

.tk-order-lines-table th:nth-child(6),
.tk-order-lines-table td:nth-child(6) {
  width: 36px;
}

.tk-order-lines-table th:nth-child(7),
.tk-order-lines-table td:nth-child(7) {
  min-width: 92px;
  width: 92px;
}

.tk-order-lines-table th:last-child,
.tk-order-lines-table td:last-child {
  width: 24px;
}

.tk-purchase-lines-table th:nth-child(3),
.tk-purchase-lines-table td:nth-child(3) {
  width: 76px;
}

.tk-purchase-lines-table th:nth-child(4),
.tk-purchase-lines-table td:nth-child(4) {
  width: 88px;
}

.tk-purchase-lines-table th:nth-child(5),
.tk-purchase-lines-table td:nth-child(5),
.tk-purchase-lines-table th:nth-child(6),
.tk-purchase-lines-table td:nth-child(6) {
  width: 72px;
}

.tk-purchase-lines-table th:nth-child(7),
.tk-purchase-lines-table td:nth-child(7) {
  min-width: 104px;
  width: 104px;
}

.tk-purchase-order-detail .tk-order-add-row {
  align-items: end;
  grid-template-columns: minmax(360px, 1fr) 120px 140px auto;
}

.tk-purchase-add-button {
  min-height: 36px;
  white-space: nowrap;
}

.tk-purchase-confirm-row {
  align-items: end;
  border-top: 1px solid var(--tk-border);
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(220px, 1fr) auto;
  padding: 12px 16px;
}

.tk-purchase-confirm-row .btn {
  min-height: 36px;
  white-space: nowrap;
}

@media (max-width: 1180px) {
  .tk-order-detail .tk-fx-document-stack {
    grid-template-columns: 1fr;
  }

  .tk-order-detail .tk-fx-top-row {
    display: grid;
    grid-column: auto;
    grid-row: auto;
    grid-template-columns: 1fr;
  }

  .tk-order-detail .tk-fx-top-row > .tk-panel:first-child,
  .tk-order-detail .tk-fx-top-row > .tk-panel:last-child,
  .tk-order-detail .tk-order-lines-card,
  .tk-order-detail .tk-fx-document-stack > .tk-table-card:last-child {
    grid-column: auto;
    grid-row: auto;
  }
}

@media (max-width: 980px) {
  .tk-fx-top-row.is-aside-narrow,
  .tk-order-client-grid {
    grid-template-columns: 1fr;
  }

  .tk-modal-form-grid,
  .tk-order-add-row,
  .tk-purchase-order-detail .tk-order-add-row,
  .tk-purchase-confirm-row {
    grid-template-columns: 1fr;
  }

  .tk-modal-form-grid .span-3 {
    grid-column: auto;
  }

}

@media (max-width: 680px) {
  .tk-order-detail .tk-edit-top,
  .tk-order-detail .tk-edit-titlebar,
  .tk-order-detail .tk-edit-actions {
    min-width: 0;
    width: 100%;
  }

  .tk-order-detail .tk-edit-actions {
    flex-wrap: wrap;
  }

  .tk-order-detail .tk-edit-actions .btn {
    flex: 1 1 auto;
  }

  .tk-order-summary-grid {
    grid-template-columns: 1fr;
    row-gap: 8px;
  }

  .tk-order-summary-column.is-order > div {
    justify-content: flex-start;
    text-align: left;
  }

  .tk-order-summary-select {
    justify-content: start;
  }

  .tk-order-add-row,
  .tk-order-lines-card .tk-fx-table-shell {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
  }

}

.tk-ai-scenes-page {
  display: grid;
  gap: 16px;
}

.tk-ai-scenes-header p {
  color: var(--tk-muted);
  margin: 2px 0 0;
}

.tk-ai-scenes-layout {
  align-items: start;
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) minmax(340px, 420px);
}

.tk-ai-scenes-main,
.tk-ai-scenes-side {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.tk-ai-panel {
  background: #ffffff;
  border: 1px solid var(--tk-border);
  border-radius: 12px;
  box-shadow: var(--tk-shadow-card);
  overflow: hidden;
}

.tk-ai-builder-card {
  overflow: visible;
}

.tk-ai-panel > .tk-section-head {
  background: #ffffff;
  border-radius: 11px 11px 0 0;
  padding-left: 16px;
  padding-right: 16px;
}

.tk-ai-store-grid {
  align-items: end;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
  padding: 16px;
}

.tk-ai-store-field input[readonly] {
  background: #f7f7f7;
  border-color: #d4d4d4;
  color: #303030;
  font-weight: 650;
}

.tk-ai-social-switch {
  align-items: center;
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  display: flex;
  justify-content: space-between;
  min-height: 58px;
  padding: 10px 12px;
}

.tk-ai-social-switch span {
  display: grid;
  gap: 2px;
}

.tk-ai-social-switch small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-ai-product-picker {
  display: grid;
  gap: 10px;
  padding: 0 16px 14px;
}

.tk-ai-product-combobox {
  position: relative;
}

.tk-ai-product-menu {
  max-height: 330px;
  overflow: auto;
}

.tk-ai-product-option {
  align-items: center;
  gap: 10px;
  grid-template-columns: 42px minmax(0, 1fr);
  min-height: 58px;
}

.tk-ai-selected-products {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  min-height: 34px;
  padding: 2px 0;
}

.tk-ai-product-card {
  background: #ffffff;
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px;
}

.tk-ai-product-card-head {
  align-items: start;
  display: flex;
  gap: 8px;
  justify-content: space-between;
  min-width: 0;
}

.tk-ai-product-card-head span {
  display: grid;
  gap: 1px;
  min-width: 0;
}

.tk-ai-product-card-head small,
.tk-ai-product-card-head strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-ai-product-card-head small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-ai-product-card-head strong {
  color: #303030;
  font-size: 13px;
  font-weight: 650;
}

.tk-ai-product-warning {
  align-items: center;
  background: #fff8db;
  border: 1px solid #e4c850;
  border-radius: 8px;
  color: #5f4b00;
  display: flex;
  gap: 8px;
  min-height: 36px;
  padding: 8px 10px;
}

.tk-ai-product-warning.neutral {
  background: #f1f8ff;
  border-color: #b5d4f2;
  color: #1f4767;
}

.tk-ai-product-warning span {
  font-size: 12px;
  line-height: 1.3;
}

.tk-ai-product-single {
  align-items: center;
  display: flex;
  gap: 8px;
}

.tk-ai-product-single img {
  background: #f7f7f7;
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  height: 48px;
  object-fit: cover;
  width: 48px;
}

.tk-ai-product-single span {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-ai-product-image-choices {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tk-ai-product-image-choice {
  background: #ffffff;
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  height: 62px;
  overflow: hidden;
  padding: 3px;
  width: 62px;
}

.tk-ai-product-image-choice:hover {
  border-color: #8a8a8a;
}

.tk-ai-product-image-choice.selected {
  border-color: #303030;
  box-shadow: 0 0 0 1px #303030;
}

.tk-ai-product-image-choice img {
  border-radius: 6px;
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.tk-ai-control-grid {
  grid-template-columns: minmax(0, 1.4fr) minmax(140px, 0.8fr) minmax(110px, 0.5fr);
  padding: 0 16px 16px;
}

.tk-ai-social-options {
  border-top: 1px solid var(--tk-border);
  margin: 0 16px 16px;
  padding-top: 14px;
}

.tk-ai-social-options .tk-form-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.tk-ai-prompt-field {
  display: grid;
  padding: 0 16px 16px;
}

.tk-ai-prompt-field textarea {
  min-height: 154px;
  resize: vertical;
}

.tk-ai-prompt-field.is-social-note textarea {
  min-height: 82px;
}

.tk-ai-run-status {
  border-top: 1px solid var(--tk-border);
  display: grid;
  gap: 10px;
  padding: 14px 16px;
}

.tk-ai-run-status-head {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.tk-ai-run-status-head > div {
  display: grid;
  gap: 2px;
}

.tk-ai-run-status-head strong {
  font-size: 13px;
  font-weight: 700;
}

.tk-ai-run-status-head span,
.tk-ai-run-status > small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-ai-run-failures {
  display: grid;
  gap: 8px;
}

.tk-ai-run-failures article {
  background: #fff8db;
  border: 1px solid #e6d28a;
  border-radius: 8px;
  display: grid;
  gap: 3px;
  padding: 10px 12px;
}

.tk-ai-run-failures strong {
  color: #303030;
  font-size: 13px;
}

.tk-ai-run-failures span,
.tk-ai-run-failures p {
  color: #5c4f12;
  font-size: 12px;
  margin: 0;
}

.tk-ai-actions {
  align-items: center;
  background: #ffffff;
  border-top: 1px solid var(--tk-border);
  border-radius: 0 0 11px 11px;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin: 0;
  padding: 12px 16px;
}

.tk-ai-dropzone {
  align-items: center;
  aspect-ratio: 1 / 1;
  border: 1px dashed #babfc3;
  border-radius: 8px;
  color: #303030;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 3px;
  justify-content: center;
  min-height: 0;
  padding: 10px;
  position: relative;
  text-align: center;
}

.tk-ai-dropzone i {
  color: #6d7175;
  font-size: 22px;
}

.tk-ai-dropzone strong {
  font-size: 13px;
}

.tk-ai-dropzone span {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-ai-dropzone.is-dragging {
  background: #f1f8ff;
  border-color: #2c6ecb;
}

.tk-order-parts-dropzone {
  min-height: 128px;
  width: 100%;
}

.tk-order-parts-files {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.tk-order-parts-file {
  align-items: center;
  background: var(--tk-surface-soft);
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: 20px minmax(0, 180px) 24px;
  padding: 7px 8px;
}

.tk-order-parts-file strong,
.tk-order-parts-file small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-order-parts-file strong {
  font-size: 12px;
}

.tk-order-parts-file small {
  color: var(--tk-muted);
  font-size: 11px;
}

.tk-order-parts-file button {
  background: transparent;
  border: 0;
  color: var(--tk-muted);
  padding: 2px;
}

.tk-order-parts-review {
  border: 1px solid var(--tk-border);
  border-radius: 8px;
}

.tk-order-parts-review-head {
  align-items: center;
  background: #ffffff;
  border-bottom: 1px solid var(--tk-border);
  display: flex;
  justify-content: space-between;
  left: 0;
  min-width: min(100%, 720px);
  padding: 8px 10px;
  position: sticky;
  z-index: 3;
}

.tk-order-parts-review-head > span {
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 650;
}

.tk-order-parts-review th:last-child,
.tk-order-parts-review td:last-child {
  background: #ffffff;
  box-shadow: -1px 0 0 var(--tk-border);
  min-width: 44px;
  position: sticky;
  right: 0;
  text-align: center;
  width: 44px;
  z-index: 2;
}

.tk-order-parts-review th:last-child {
  background: var(--tk-surface-soft);
}

.tk-order-import-cell {
  background: #ffffff;
  border: 1px solid transparent;
  border-radius: 6px;
  font: inherit;
  min-width: 90px;
  padding: 6px 8px;
  width: 100%;
}

.tk-order-import-cell:focus {
  border-color: #303030;
  box-shadow: 0 0 0 2px rgba(48, 48, 48, .08);
  outline: 0;
}

.tk-ai-reference-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  padding: 12px 16px 16px;
}

.tk-ai-reference {
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  display: grid;
  gap: 6px;
  min-width: 0;
  padding: 8px;
  position: relative;
}

.tk-ai-reference > .tk-icon-btn {
  position: absolute;
  right: 6px;
  top: 6px;
  z-index: 2;
}

.tk-ai-reference-img {
  align-items: center;
  background: #f7f7f7;
  border-radius: 6px;
  display: flex;
  justify-content: center;
  overflow: hidden;
  position: relative;
}

.tk-ai-reference-img::before {
  content: "";
  display: block;
  padding-top: 100%;
}

.tk-ai-reference-img img,
.tk-ai-reference-img i {
  position: absolute;
}

.tk-ai-reference-img img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.tk-ai-reference strong,
.tk-ai-reference span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-ai-reference span {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-ai-history-card {
  max-height: calc(100vh - 150px);
  overflow: hidden;
}

.tk-ai-gallery {
  display: grid;
  gap: 12px;
  max-height: calc(100vh - 220px);
  overflow: auto;
  padding: 16px;
}

.tk-ai-history-card > .tk-empty-inline {
  margin: 16px;
}

.tk-ai-history-item {
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  padding: 10px;
}

.tk-ai-history-image {
  background: #f7f7f7;
  border-radius: 7px;
  overflow: hidden;
  position: relative;
}

.tk-ai-history-image img {
  aspect-ratio: 1 / 1;
  display: block;
  object-fit: cover;
  width: 100%;
}

.tk-ai-history-image .tk-icon-btn {
  background: #ffffff;
  position: absolute;
  right: 8px;
  top: 8px;
}

.tk-ai-history-copy {
  display: grid;
  gap: 7px;
  min-width: 0;
}

.tk-ai-history-title {
  align-items: center;
  display: flex;
  gap: 8px;
  justify-content: space-between;
}

.tk-ai-history-copy p {
  color: #303030;
  font-size: 12px;
  margin: 0;
  white-space: pre-line;
}

.tk-ai-history-copy span,
.tk-ai-history-copy small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-ai-history-copy > .tk-soft-btn {
  justify-self: start;
}

.tk-ai-history-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tk-ai-remake-form {
  background: #f7f7f7;
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto auto;
  padding: 10px;
}

.tk-ai-remake-form[hidden] {
  display: none;
}

.tk-ai-remake-form input {
  background: #ffffff;
  border: 1px solid #c9c9c9;
  border-radius: 8px;
  color: #303030;
  font-size: 13px;
  height: 34px;
  min-width: 0;
  padding: 0 10px;
}

.tk-ai-remake-form input:focus {
  border-color: #303030;
  box-shadow: 0 0 0 2px rgba(48, 48, 48, .12);
  outline: 0;
}

@media (max-width: 1180px) {
  .tk-ai-scenes-layout {
    grid-template-columns: 1fr;
  }

  .tk-ai-social-options .tk-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tk-ai-history-card {
    max-height: none;
  }

  .tk-ai-gallery {
    max-height: none;
  }
}

@media (max-width: 720px) {
  .tk-ai-store-grid,
  .tk-ai-control-grid,
  .tk-ai-social-options .tk-form-grid,
  .tk-ai-remake-form {
    grid-template-columns: 1fr;
  }
}

.tk-services-page .tk-table td,
.tk-services-page .tk-table th {
  vertical-align: middle;
}

.tk-service-history {
  display: grid;
  gap: 10px;
}

.tk-service-history article {
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  display: grid;
  gap: 2px;
  padding: 10px;
}

.tk-service-history span,
.tk-service-history small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-services-catalog-layout {
  align-items: start;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 420px);
}

.tk-link-button {
  background: transparent;
  border: 0;
  color: #303030;
  cursor: pointer;
  font: inherit;
  padding: 0;
  text-align: left;
}

.tk-link-button:hover {
  text-decoration: underline;
}

.tk-service-catalog-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.tk-service-status-switch {
  width: 100%;
}

.tk-service-status-switch > span {
  display: grid;
  gap: 2px;
}

.tk-service-status-switch > span strong {
  color: #303030;
  font-size: 12px;
  font-weight: 700;
}

.tk-service-status-switch > span small {
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 500;
}

.tk-badge.warning {
  background: #ffef9d;
  color: #4f4700;
}

.tk-icon-btn.danger {
  color: #8e1f0b;
}

.tk-icon-btn.danger:hover {
  background: #fff4f4;
  color: #8e1f0b;
}

@media (max-width: 1180px) {
  .tk-services-catalog-layout {
    grid-template-columns: 1fr;
  }
}

.tk-service-detail {
  padding-bottom: 0;
}

.tk-wh-page {
  display: grid;
  gap: 14px;
  grid-template-rows: auto auto minmax(0, 1fr);
  height: calc(100vh - 104px);
  max-height: calc(100vh - 104px);
  min-height: 0;
  overflow: hidden;
}

.tk-wh-layout {
  align-items: stretch;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(330px, 380px) minmax(0, 1fr);
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.tk-wh-sidebar,
.tk-wh-thread,
.tk-wh-setup,
.tk-wh-empty-state {
  overflow: hidden;
}

.tk-wh-setup,
.tk-wh-empty-state {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 16px;
}

.tk-wh-empty-state {
  justify-content: flex-start;
}

.tk-wh-empty-state > i,
.tk-wh-setup > i {
  color: var(--tk-muted);
  font-size: 22px;
}

.tk-wh-setup strong,
.tk-wh-empty-state strong {
  display: block;
  font-size: 14px;
}

.tk-wh-setup span,
.tk-wh-empty-state span {
  color: var(--tk-muted);
  display: block;
  font-size: 12px;
}

.tk-wh-sidebar {
  display: grid;
  grid-template-rows: auto auto auto minmax(0, 1fr);
  min-height: 0;
}

.tk-wh-sidebar-head,
.tk-wh-thread-head {
  align-items: center;
  border-bottom: 1px solid var(--tk-border);
  display: flex;
  justify-content: space-between;
  min-height: 56px;
  padding: 12px 16px;
}

.tk-wh-sidebar-head strong,
.tk-wh-thread-title strong {
  display: block;
  font-size: 14px;
}

.tk-wh-sidebar-head span,
.tk-wh-thread-title span {
  color: var(--tk-muted);
  display: block;
  font-size: 12px;
}

.tk-wh-store-strip {
  border-bottom: 1px solid var(--tk-border);
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 10px 12px;
}

.tk-wh-store-pill {
  align-items: center;
  background: #f7f7f7;
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  color: #303030;
  display: flex;
  flex: 0 0 auto;
  gap: 7px;
  height: 38px;
  max-width: 180px;
  padding: 0 10px 0 6px;
}

.tk-wh-store-pill.active {
  background: #303030;
  border-color: #303030;
  color: #ffffff;
}

.tk-wh-store-pill.muted {
  opacity: .7;
}

.tk-wh-store-pill span {
  display: grid;
  flex: 0 0 26px;
  height: 26px;
  place-items: center;
  width: 26px;
  border-radius: 7px;
  background: var(--tk-purple);
  color: #ffffff;
  font-size: 11px;
  font-weight: 800;
}

.tk-wh-store-pill strong,
.tk-wh-store-pill small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-wh-store-pill strong {
  font-size: 12px;
  max-width: 92px;
}

.tk-wh-store-pill small {
  color: inherit;
  font-size: 11px;
  opacity: .78;
}

.tk-wh-search {
  border-bottom: 1px solid var(--tk-border);
  display: grid;
  gap: 8px;
  padding: 12px;
}

.tk-wh-search label:first-child {
  align-items: center;
  background: #ffffff;
  border: 1px solid #c9c9c9;
  border-radius: 8px;
  display: flex;
  gap: 8px;
  height: 38px;
  padding: 0 10px;
}

.tk-wh-search input[type="search"] {
  border: 0;
  flex: 1;
  min-width: 0;
  outline: 0;
}

.tk-wh-search label:first-child:focus-within {
  border-color: #303030;
  box-shadow: 0 0 0 2px rgba(48, 48, 48, .12);
}

.tk-wh-check {
  align-items: center;
  display: flex;
  gap: 8px;
  margin: 0;
}

.tk-wh-check span {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-wh-chat-list {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}

.tk-wh-chat {
  align-items: start;
  background: #ffffff;
  border: 0;
  border-bottom: 1px solid var(--tk-border);
  display: grid;
  gap: 10px;
  grid-template-columns: 36px minmax(0, 1fr) auto;
  padding: 12px;
  text-align: left;
  width: 100%;
}

.tk-wh-chat:hover,
.tk-wh-chat.active {
  background: #f4f4f4;
}

.tk-wh-chat.active {
  box-shadow: inset 3px 0 0 #303030;
}

.tk-wh-avatar {
  align-items: center;
  background: #e8f5ed;
  border-radius: 10px;
  color: #0d4d22;
  display: grid;
  font-size: 12px;
  font-weight: 800;
  height: 36px;
  line-height: 1;
  place-items: center;
  text-align: center;
  width: 36px;
}

.tk-wh-chat-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.tk-wh-chat-copy strong,
.tk-wh-chat-copy small,
.tk-wh-chat-copy em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-wh-chat-copy strong {
  font-size: 13px;
}

.tk-wh-chat-copy small,
.tk-wh-chat-meta small {
  color: var(--tk-muted);
  font-size: 11px;
  font-style: normal;
}

.tk-wh-chat-copy em {
  color: #303030;
  font-size: 12px;
  font-style: normal;
}

.tk-wh-chat-meta {
  align-items: end;
  display: grid;
  gap: 6px;
  justify-items: end;
}

.tk-wh-chat-meta b {
  background: #303030;
  border-radius: 999px;
  color: #ffffff;
  font-size: 11px;
  line-height: 1;
  min-width: 20px;
  padding: 4px 6px;
  text-align: center;
}

.tk-wh-thread {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-height: 0;
}

.tk-wh-thread-title {
  align-items: center;
  display: flex;
  gap: 10px;
  min-width: 0;
}

.tk-wh-thread-actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.tk-wh-switch {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  height: 28px;
  justify-content: center;
  margin: 0;
}

.tk-wh-switch input[type="checkbox"] {
  position: relative;
  width: 34px;
  height: 20px;
  min-height: 20px;
  margin: 0;
  border: 1px solid #b5b5b5;
  border-radius: 999px;
  background: #d8d8d8;
  appearance: none;
  cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease;
}

.tk-wh-switch input[type="checkbox"]::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .25);
  transition: transform .15s ease;
}

.tk-wh-switch input[type="checkbox"]:checked {
  border-color: #303030;
  background: #303030;
}

.tk-wh-switch input[type="checkbox"]:checked::after {
  transform: translateX(14px);
}

.tk-wh-switch input[type="checkbox"]:focus-visible {
  outline: 2px solid rgba(48, 48, 48, .25);
  outline-offset: 2px;
}

.tk-wh-messages {
  background: #f7f7f7;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
  padding: 16px;
}

.tk-wh-thread-empty,
.tk-wh-empty-inline,
.tk-wh-loading {
  align-items: center;
  color: var(--tk-muted);
  display: grid;
  gap: 5px;
  justify-items: center;
  min-height: 160px;
  padding: 18px;
  text-align: center;
}

.tk-wh-empty-inline {
  min-height: 120px;
}

.tk-wh-empty-inline.danger strong {
  color: #8e1f0b;
}

.tk-wh-thread-empty i {
  font-size: 24px;
}

.tk-wh-thread-empty strong,
.tk-wh-empty-inline strong {
  color: #303030;
}

.tk-wh-message {
  display: flex;
}

.tk-wh-day-badge {
  align-self: center;
  background: #ffffff;
  border: 1px solid var(--tk-border);
  border-radius: 999px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .04);
  color: var(--tk-muted);
  font-size: 11px;
  font-weight: 650;
  line-height: 1;
  margin: 3px 0;
  padding: 6px 10px;
}

.tk-wh-message.out {
  justify-content: flex-end;
}

.tk-wh-message > div {
  background: #ffffff;
  border: 1px solid var(--tk-border);
  border-radius: 10px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .03);
  max-width: min(560px, 74%);
  padding: 9px 11px 7px;
}

.tk-wh-message.out > div {
  background: #303030;
  border-color: #303030;
  color: #ffffff;
}

.tk-wh-message p {
  margin: 0;
  white-space: normal;
}

.tk-wh-message time {
  color: var(--tk-muted);
  display: block;
  font-size: 11px;
  margin-top: 5px;
  text-align: right;
}

.tk-wh-message.out time {
  color: rgba(255, 255, 255, .72);
}

.tk-wh-message .tk-wh-bubble-media {
  background: transparent;
  border: 0;
  box-shadow: none;
  max-width: min(180px, 62%);
  padding: 0;
  position: relative;
}

.tk-wh-message .tk-wh-bubble-media time {
  background: rgba(0, 0, 0, .62);
  border-radius: 999px;
  bottom: 6px;
  color: #ffffff;
  font-size: 10px;
  line-height: 1;
  margin: 0;
  padding: 4px 6px;
  position: absolute;
  right: 6px;
}

.tk-wh-media-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 8px;
}

.tk-wh-media {
  border-radius: 8px;
  overflow: hidden;
}

.tk-wh-media.image {
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, .12);
  display: block;
  width: 126px;
}

.tk-wh-bubble-media .tk-wh-media-row {
  gap: 6px;
  margin: 0;
}

.tk-wh-bubble-media .tk-wh-media.image {
  border: 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .16);
  width: 154px;
}

.tk-wh-media.image img {
  aspect-ratio: 1 / 1;
  display: block;
  object-fit: cover;
  width: 100%;
}

.tk-wh-media.file {
  align-items: center;
  background: rgba(255, 255, 255, .16);
  border: 1px solid rgba(0, 0, 0, .12);
  display: flex;
  gap: 7px;
  max-width: 260px;
  padding: 8px 10px;
}

.tk-wh-composer {
  border-top: 1px solid var(--tk-border);
  display: grid;
  gap: 10px;
  padding: 12px 16px 16px;
}

.tk-wh-composer[hidden] {
  display: none;
}

.tk-wh-message-input textarea {
  border: 1px solid #c9c9c9;
  border-radius: 8px;
  min-height: 58px;
  resize: vertical;
  width: 100%;
  padding: 10px;
}

.tk-wh-message-input textarea:focus {
  border-color: #303030;
  box-shadow: 0 0 0 2px rgba(48, 48, 48, .12);
  outline: 0;
}

.tk-wh-composer-actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.tk-wh-attachment {
  align-items: center;
  background: #f7f7f7;
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  display: flex;
  gap: 8px;
  min-height: 36px;
  padding: 6px 8px;
}

.tk-wh-attachment[hidden] {
  display: none;
}

.tk-wh-attachment span {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 1100px) {
  .tk-wh-page {
    height: auto;
    max-height: none;
    overflow: visible;
  }

  .tk-wh-layout {
    grid-template-columns: 1fr;
    height: auto;
    overflow: visible;
  }

  .tk-wh-sidebar {
    max-height: 480px;
  }

  .tk-wh-thread {
    min-height: 680px;
  }
}

@media (max-width: 720px) {
  .tk-wh-setup,
  .tk-wh-empty-state,
  .tk-wh-thread-head {
    align-items: stretch;
    flex-direction: column;
  }

  .tk-wh-message > div {
    max-width: 92%;
  }
}

.tk-service-detail .tk-fx-document-stack {
  grid-template-columns: minmax(250px, 1fr) minmax(0, 3fr);
}

.tk-service-detail .tk-fx-top-row {
  display: contents;
}

.tk-service-detail .tk-fx-top-row > .tk-panel:first-child {
  grid-column: 2;
  grid-row: 1;
}

.tk-service-detail .tk-fx-top-row > .tk-panel:last-child {
  grid-column: 1;
  grid-row: 1 / span 3;
}

.tk-service-detail .tk-service-lines-card {
  grid-column: 2;
  grid-row: 2;
}

.tk-service-detail .tk-service-lower-grid {
  grid-column: 2;
  grid-row: 3;
}

.tk-service-detail .tk-panel {
  overflow: hidden;
  padding: 0;
}

.tk-service-detail .tk-panel-head {
  background: #f7f7f7;
  border-bottom: 1px solid var(--tk-border);
  padding: 13px 16px;
}

.tk-service-detail .tk-panel-head h2,
.tk-service-detail .tk-section-head h2 {
  color: #303030;
  font-size: 14px;
  font-weight: 750;
  line-height: 1.2;
  margin: 0;
}

.tk-service-detail .tk-form-grid,
.tk-service-status-grid {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.tk-service-work-grid {
  grid-template-columns: minmax(220px, .72fr) minmax(320px, 1.28fr);
}

.tk-service-schedule-grid {
  grid-template-columns: minmax(0, 1fr);
}

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

.tk-service-full {
  grid-column: 1 / -1;
}

.tk-service-detail .tk-field,
.tk-service-detail .tk-service-status-grid label {
  color: #303030;
  display: grid;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  letter-spacing: 0;
  min-width: 0;
}

.tk-service-detail input,
.tk-service-detail select,
.tk-service-detail textarea,
.tk-service-lines-table input,
.tk-service-lines-table select,
.tk-service-expenses-table input {
  background: #ffffff;
  border: 1px solid #c9c9c9;
  border-radius: 8px;
  color: #303030;
  font-size: 13px;
  line-height: 1.35;
  min-width: 0;
  width: 100%;
}

.tk-service-detail input,
.tk-service-detail select,
.tk-service-lines-table input,
.tk-service-lines-table select,
.tk-service-expenses-table input {
  height: 36px;
  padding: 0 10px;
}

.tk-service-detail textarea {
  min-height: 72px;
  padding: 9px 10px;
  resize: vertical;
}

.tk-service-detail input:focus,
.tk-service-detail select:focus,
.tk-service-detail textarea:focus {
  border-color: #303030;
  box-shadow: 0 0 0 2px rgba(48, 48, 48, .12);
  outline: 0;
}

.tk-service-store-display[readonly] {
  background: #f7f7f7;
  color: #303030;
  cursor: default;
}

.tk-service-lines-card,
.tk-service-expenses-card {
  overflow: hidden;
  border-radius: var(--tk-radius);
  background-clip: padding-box;
}

.tk-service-add-row {
  align-items: end;
  background: #fafafa;
  border-bottom: 1px solid var(--tk-border);
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(260px, 2fr) minmax(145px, 1fr) minmax(115px, .8fr) minmax(90px, .55fr) minmax(110px, .65fr);
  padding: 12px 16px;
}

.tk-service-add-row label {
  color: #303030;
  display: grid;
  font-size: 12px;
  font-weight: 700;
  gap: 6px;
  min-width: 0;
}

.tk-service-item-combobox {
  position: relative;
}

.tk-service-item-combobox > .bi {
  color: var(--tk-muted);
  left: 11px;
  pointer-events: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
}

.tk-service-item-combobox > input {
  padding-left: 34px;
}

.tk-service-item-combobox .tk-autocomplete-menu {
  min-width: min(520px, calc(100vw - 64px));
}

.tk-service-detail .tk-section-head {
  align-items: center;
  background: #f7f7f7;
  border-bottom: 1px solid var(--tk-border);
  display: flex;
  justify-content: space-between;
  min-height: 56px;
  padding: 12px 16px;
}

.tk-service-detail .tk-section-head span {
  color: var(--tk-muted);
  display: block;
  font-size: 12px;
  line-height: 1.35;
  margin-top: 2px;
}

.tk-service-table-shell {
  min-width: 0;
  overflow-x: auto;
  padding: 0;
}

.tk-service-lines-table {
  min-width: 0;
  table-layout: fixed;
  width: 100%;
}

.tk-service-expenses-table {
  min-width: 760px;
}

.tk-service-lines-table input[type="hidden"] {
  display: none;
}

.tk-service-lines-table tbody td {
  font-size: 11px;
  height: 36px;
  line-height: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-service-line-concept {
  color: #303030;
  display: block;
  font-size: 11px;
  font-weight: 650;
  line-height: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-service-lines-table thead th,
.tk-service-expenses-table thead th {
  background: #f7f7f7;
  border-bottom: 1px solid var(--tk-border);
  color: #616161;
  font-size: 12px;
  font-weight: 700;
  height: 38px;
  padding: 8px 12px;
  white-space: nowrap;
}

.tk-service-lines-table tbody td,
.tk-service-expenses-table tbody td {
  border-bottom: 1px solid #ececec;
  padding: 4px 12px;
  vertical-align: middle;
}

.tk-service-lines-table [data-service-remove-row] {
  height: 24px;
  min-height: 24px;
  padding: 0;
  width: 24px;
}

.tk-service-lines-table tbody tr:last-child td,
.tk-service-expenses-table tbody tr:last-child td {
  border-bottom: 0;
}

.tk-service-lines-table th:first-child,
.tk-service-lines-table td:first-child {
  min-width: 0;
  width: 31%;
}

.tk-service-lines-table th:nth-child(2),
.tk-service-lines-table td:nth-child(2) {
  min-width: 0;
  width: 15%;
}

.tk-service-lines-table th:nth-child(3),
.tk-service-lines-table td:nth-child(3) {
  min-width: 0;
  width: 13%;
}

.tk-service-lines-table th:nth-child(4),
.tk-service-lines-table td:nth-child(4) {
  min-width: 0;
  width: 9%;
}

.tk-service-lines-table th:nth-child(5),
.tk-service-lines-table td:nth-child(5) {
  min-width: 0;
  width: 11%;
}

.tk-service-lines-table th:nth-child(6),
.tk-service-lines-table td:nth-child(6) {
  min-width: 0;
  width: 8%;
}

.tk-service-lines-table th:nth-child(7),
.tk-service-lines-table td:nth-child(7) {
  min-width: 0;
  width: 11%;
}

.tk-service-lines-table th:last-child,
.tk-service-lines-table td:last-child {
  min-width: 36px;
  width: 36px;
}

.tk-service-expenses-table th:first-child,
.tk-service-expenses-table td:first-child {
  min-width: 220px;
}

.tk-service-expenses-table th:nth-child(2),
.tk-service-expenses-table td:nth-child(2) {
  min-width: 140px;
}

.tk-service-expenses-table th:nth-child(3),
.tk-service-expenses-table td:nth-child(3) {
  min-width: 260px;
}

.tk-service-totals {
  border: 0;
  border-radius: 0;
  border-top: 1px solid var(--tk-border);
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  margin: 0;
  min-width: 0;
  padding: 0;
}

.tk-service-totals div {
  border-radius: 0;
  min-height: 58px;
}

.tk-service-totals .grand {
  border-radius: 0;
}

.tk-service-lower-grid {
  align-items: start;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr);
}

.tk-service-status-card,
.tk-service-history-card {
  min-width: 0;
}

.tk-service-history {
  display: grid;
  gap: 0;
  padding: 8px 16px 16px;
}

.tk-service-history article {
  border: 0;
  border-bottom: 1px solid var(--tk-border);
  border-radius: 0;
  display: grid;
  gap: 3px;
  padding: 10px 0;
}

.tk-service-history article:last-child {
  border-bottom: 0;
}

.tk-service-history strong {
  color: #303030;
  font-size: 13px;
}

.tk-service-history span,
.tk-service-history small {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-service-history-card .tk-muted-line {
  margin: 16px;
}

.tk-ml-page .tk-list-toolbar.has-store-filter {
  grid-template-columns: minmax(240px, 360px) minmax(280px, 1fr) auto;
}

.tk-ml-page .tk-list-toolbar.no-store-filter {
  grid-template-columns: minmax(280px, 1fr) auto;
}

.tk-ml-store-filter summary {
  width: 100%;
  min-height: 38px;
  justify-content: flex-start;
  padding: 8px 11px;
}

.tk-ml-store-filter summary strong {
  max-width: 190px;
}

.tk-ml-store-filter .tk-filter-menu {
  width: 280px;
}

.tk-ml-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-bottom: 1px solid var(--tk-border);
  background: #ffffff;
}

.tk-ml-kpis article {
  min-height: 70px;
  padding: 12px 16px;
  border-right: 1px solid var(--tk-border);
}

.tk-ml-kpis article:last-child {
  border-right: 0;
}

.tk-ml-kpis span {
  display: block;
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 650;
}

.tk-ml-kpis strong {
  display: block;
  margin-top: 4px;
  color: var(--tk-text);
  font-size: 20px;
  line-height: 1.1;
}

.tk-ml-tabs {
  display: flex;
  gap: 4px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--tk-border);
  background: var(--tk-surface-soft);
}

.tk-ml-tabs button {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: var(--tk-text);
  font: inherit;
  font-weight: 650;
}

.tk-ml-tabs button:hover {
  background: #ffffff;
}

.tk-ml-tabs button.active {
  border-color: var(--tk-border);
  background: #ffffff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, .06);
}

.tk-ml-panel {
  display: none;
}

.tk-ml-panel.active {
  display: block;
}

.tk-ml-publication-cell {
  display: flex;
  min-width: 320px;
  align-items: center;
  gap: 10px;
}

.tk-ml-publication-cell img,
.tk-ml-thumb-empty {
  display: grid;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  place-items: center;
  border: 1px solid var(--tk-border);
  border-radius: 7px;
  background: var(--tk-surface-soft);
  color: var(--tk-muted);
  object-fit: cover;
}

.tk-ml-publication-cell small {
  display: block;
  max-width: 360px;
  overflow: hidden;
  color: var(--tk-muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-inline-number-action,
.tk-row-actions {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.tk-inline-number-action .form-control {
  width: 82px;
  height: 32px;
  text-align: right;
}

.tk-inline-number-action .tk-icon-btn,
.tk-row-actions .tk-icon-btn {
  width: 32px;
  height: 32px;
  border: 1px solid var(--tk-border);
  background: #ffffff;
  color: var(--tk-text);
}

.tk-inline-number-action .tk-icon-btn:hover,
.tk-row-actions .tk-icon-btn:hover {
  background: var(--tk-surface-soft);
}

.tk-inline-number-action .tk-icon-btn:disabled {
  opacity: .38;
}

.tk-inline-number-action .tk-icon-btn.is-loading i {
  display: inline-block;
  animation: tk-spin .7s linear infinite;
}

.tk-ml-detail-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.tk-ml-detail-grid article,
.tk-ml-address,
.tk-ml-question-box {
  border: 1px solid var(--tk-border);
  border-radius: var(--tk-radius-sm);
  background: var(--tk-surface-soft);
}

.tk-ml-detail-grid article {
  min-width: 0;
  padding: 10px;
}

.tk-ml-detail-grid span {
  display: block;
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-ml-detail-grid strong {
  display: block;
  overflow: hidden;
  color: var(--tk-text);
  font-size: 15px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-ml-detail-grid small {
  display: block;
  overflow: hidden;
  color: var(--tk-muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-ml-address,
.tk-ml-question-box {
  margin-top: 10px;
  padding: 10px;
  color: var(--tk-text);
  font-size: 13px;
}

@media (max-width: 900px) {
  .tk-ml-page .tk-list-toolbar,
  .tk-ml-kpis,
  .tk-ml-detail-grid {
    grid-template-columns: 1fr;
  }

  .tk-ml-kpis article {
    border-right: 0;
    border-bottom: 1px solid var(--tk-border);
  }

  .tk-ml-tabs {
    overflow-x: auto;
  }
}

@media (max-width: 1240px) {
  .tk-service-detail .tk-fx-document-stack {
    grid-template-columns: 1fr;
  }

  .tk-service-detail .tk-fx-top-row {
    display: grid;
    grid-column: auto;
    grid-row: auto;
    grid-template-columns: 1fr;
  }

  .tk-service-detail .tk-fx-top-row > .tk-panel:first-child,
  .tk-service-detail .tk-fx-top-row > .tk-panel:last-child,
  .tk-service-detail .tk-service-lines-card,
  .tk-service-detail .tk-service-lower-grid {
    grid-column: auto;
    grid-row: auto;
  }
}

@media (max-width: 760px) {
  .tk-service-work-grid,
  .tk-service-schedule-grid,
  .tk-service-status-grid,
  .tk-service-totals {
    grid-template-columns: 1fr;
  }

  .tk-service-add-row {
    grid-template-columns: 1fr 1fr;
  }

  .tk-service-detail .tk-section-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }

  .tk-service-detail .tk-section-actions,
  .tk-service-detail .tk-section-actions .btn {
    width: 100%;
  }

}

/* CFD preview shell */
.tk-cfd-preview-body {
  min-width: 320px;
  margin: 0;
  background: var(--tk-app-bg);
  color: var(--tk-text);
  font: 13px/1.45 var(--tk-font);
}

.tk-cfd-preview-body * {
  box-sizing: border-box;
}

.tk-cfd-preview-body .toolbar {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 18px;
  background: var(--tk-surface);
  border-bottom: 1px solid var(--tk-border);
  box-shadow: var(--tk-shadow-soft);
}

.tk-cfd-preview-body .toolbar strong {
  font-size: 14px;
}

.tk-cfd-preview-body .toolbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.tk-cfd-preview-body button,
.tk-cfd-preview-body .button-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid var(--tk-border-strong);
  border-radius: 6px;
  background: var(--tk-surface-soft);
  color: var(--tk-text);
  font: inherit;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}

.tk-cfd-preview-body button.primary,
.tk-cfd-preview-body .button-link.primary {
  border-color: var(--tk-black);
  background: var(--tk-black);
  color: #fff;
}

.tk-cfd-preview-body button:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.tk-cfd-preview-body .preview-shell {
  width: min(1120px, calc(100% - 32px));
  height: calc(100vh - 86px);
  margin: 16px auto;
  overflow: hidden;
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  background: var(--tk-surface);
  box-shadow: var(--tk-shadow-card);
}

.tk-cfd-preview-body .preview-frame {
  width: 100%;
  height: 100%;
  border: 0;
  background: var(--tk-surface);
}

.tk-cfd-preview-body .alert {
  width: min(960px, calc(100% - 32px));
  margin: 16px auto 0;
  padding: 12px 14px;
  border: 1px solid #f2c3c3;
  border-radius: 8px;
  background: #fff5f5;
  color: #8a1f1f;
  font-weight: 700;
}

.tk-cfd-preview-body .empty-preview {
  width: min(760px, calc(100% - 32px));
  margin: 28px auto;
  padding: 22px;
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  background: var(--tk-surface);
  box-shadow: var(--tk-shadow-card);
}

.tk-cfd-preview-body .empty-preview h1 {
  margin: 0 0 8px;
  font-size: 20px;
}

.tk-cfd-preview-body .empty-preview p {
  margin: 0;
  color: var(--tk-muted);
}

.tk-cfd-preview-body .result-backdrop {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: none;
  place-items: center;
  padding: 20px;
  background: rgba(0, 0, 0, .42);
}

.tk-cfd-preview-body .result-backdrop.is-open {
  display: grid;
}

.tk-cfd-preview-body .result-modal {
  width: min(620px, 100%);
  max-height: calc(100vh - 40px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border-radius: 10px;
  background: var(--tk-surface);
  box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
}

.tk-cfd-preview-body .result-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--tk-border);
  background: var(--tk-surface-soft);
}

.tk-cfd-preview-body .result-head h2 {
  margin: 0;
  font-size: 16px;
}

.tk-cfd-preview-body .result-head p {
  margin: 3px 0 0;
  color: var(--tk-muted);
}

.tk-cfd-preview-body .result-close {
  width: 32px;
  min-height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 20px;
}

.tk-cfd-preview-body .result-body {
  padding: 18px;
  overflow-y: auto;
}

.tk-cfd-preview-body .result-message {
  margin: 0 0 14px;
  font-weight: 700;
}

.tk-cfd-preview-body .result-uuid {
  display: none;
  margin: 0 0 14px;
  padding: 10px;
  border: 1px solid #b7e7c8;
  border-radius: 8px;
  background: #effaf3;
  color: #0f5132;
  font-size: 12px;
  overflow-wrap: anywhere;
}

.tk-cfd-preview-body .result-actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
}

.tk-cfd-preview-body .result-actions .result-download {
  min-width: 82px;
  gap: 6px;
}

@media (max-width: 680px) {
  .tk-cfd-preview-body .toolbar {
    align-items: stretch;
    padding: 10px 12px;
  }

  .tk-cfd-preview-body .toolbar > strong,
  .tk-cfd-preview-body .toolbar-actions {
    width: 100%;
  }

  .tk-cfd-preview-body .toolbar-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .tk-cfd-preview-body .toolbar-actions button {
    width: 100%;
    padding-inline: 8px;
  }

  .tk-cfd-preview-body .preview-shell {
    width: calc(100% - 20px);
    height: calc(100vh - 126px);
    margin: 10px auto;
  }

  .tk-cfd-preview-body .result-actions {
    overflow-x: auto;
    padding-bottom: 2px;
  }

  .tk-cfd-preview-body .result-actions > * {
    flex: 0 0 auto;
    width: auto;
  }
}

@media print {
  .tk-cfd-preview-body {
    background: #fff;
  }

  .tk-cfd-preview-body .toolbar,
  .tk-cfd-preview-body .alert,
  .tk-cfd-preview-body .result-backdrop {
    display: none !important;
  }

  .tk-cfd-preview-body .preview-shell {
    width: 100%;
    height: 100vh;
    margin: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
}
/* User access and profile permissions */
.tk-user-detail .tk-section-head,
.tk-permissions-page .tk-section-head {
  margin-bottom: 18px;
}

.tk-user-identity {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: -2px 0 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--tk-border);
}

.tk-user-avatar {
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  place-items: center;
  border-radius: 12px;
  background: #303030;
  color: #fff;
  font-size: 14px;
  font-weight: 750;
  letter-spacing: .03em;
}

.tk-user-identity-copy {
  display: grid;
  min-width: 0;
  gap: 2px;
}

.tk-user-identity-copy strong,
.tk-user-identity-copy span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tk-user-identity-copy strong {
  font-size: 14px;
}

.tk-user-identity-copy span,
.tk-user-password p,
.tk-user-detail .tk-side-card-head span {
  margin: 0;
  color: var(--tk-muted);
  font-size: 12px;
  font-weight: 450;
}

.tk-user-role {
  margin-left: auto;
  padding: 5px 9px;
  border-radius: 999px;
  background: #f1f1f1;
  color: #4a4a4a;
  font-size: 11px;
  font-weight: 700;
}

.tk-user-password {
  display: grid;
  grid-template-columns: minmax(180px, .7fr) minmax(260px, 1.3fr);
  align-items: end;
  gap: 18px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--tk-border);
}

.tk-user-password .tk-field {
  margin-bottom: 3px;
}

.tk-user-password input {
  width: 100%;
  min-height: 36px;
  padding: 7px 10px;
  border: 1px solid var(--tk-border-strong);
  border-radius: 8px;
  background: #fff;
  color: var(--tk-text);
  outline: none;
}

.tk-user-password input:focus {
  border-color: #303030;
  box-shadow: 0 0 0 1px #303030;
}

.tk-user-detail .tk-field small {
  color: var(--tk-muted);
  font-size: 11px;
  font-weight: 450;
}

.tk-assignment-list {
  border: 1px solid var(--tk-border);
  border-radius: 10px;
  overflow: hidden;
}

.tk-assignment-row {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 58px;
  padding: 10px 14px;
  background: #fff;
  cursor: pointer;
}

.tk-assignment-row + .tk-assignment-row {
  border-top: 1px solid var(--tk-border);
}

.tk-assignment-row:hover {
  background: #fafafa;
}

.tk-assignment-copy {
  display: flex;
  flex: 1;
  min-width: 0;
  flex-direction: column;
}

.tk-assignment-copy strong {
  font-size: 13px;
  font-weight: 650;
}

.tk-assignment-copy small,
.tk-default-choice {
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-default-choice {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.tk-profile-access-summary {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px;
  border-radius: 9px;
  background: #f6f6f7;
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-profile-access-summary strong {
  color: var(--tk-text);
  font-size: 14px;
}

.tk-record-meta {
  margin: 0;
}

.tk-record-meta > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 9px 0;
  border-top: 1px solid var(--tk-border);
}

.tk-record-meta > div:first-child {
  border-top: 0;
}

.tk-record-meta dt,
.tk-record-meta dd {
  margin: 0;
  font-size: 12px;
}

.tk-record-meta dt {
  color: var(--tk-muted);
  font-weight: 500;
}

@media (max-width: 680px) {
  .tk-user-role {
    display: none;
  }

  .tk-user-password {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}

.tk-permissions-layout {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.tk-permissions-sidebar {
  position: sticky;
  top: 72px;
}

.tk-panel-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 10px 12px;
  border-bottom: 1px solid var(--tk-border);
  margin-bottom: 4px;
}

.tk-panel-heading > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.tk-panel-heading span:first-child {
  color: var(--tk-text);
  font-size: 12px;
  font-weight: 700;
}

.tk-panel-heading small {
  margin-top: 1px;
  color: var(--tk-muted);
  font-size: 10px;
}

.tk-panel-heading > .tk-count {
  display: grid;
  min-width: 24px;
  height: 22px;
  padding: 0 6px;
  place-items: center;
  border-radius: 999px;
  background: #ededed;
  color: var(--tk-muted);
  font-size: 10px;
  font-weight: 700;
}

.tk-profile-nav {
  display: grid;
  gap: 2px;
}

.tk-profile-nav-item {
  position: relative;
  display: grid;
  grid-template-columns: 32px 1fr 16px;
  align-items: center;
  gap: 9px;
  min-height: 50px;
  padding: 7px 10px;
  border-radius: 8px;
  color: var(--tk-text);
  text-decoration: none;
}

.tk-profile-nav-item:hover {
  background: #f3f3f3;
  color: var(--tk-text);
}

.tk-profile-nav-item.active {
  background: #f0f0f0;
  box-shadow: inset 3px 0 0 #303030;
}

.tk-profile-nav-icon {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid var(--tk-border);
  border-radius: 8px;
  background: #fff;
  color: var(--tk-muted);
  font-size: 11px;
  font-weight: 750;
}

.tk-profile-nav-item.active .tk-profile-nav-icon {
  border-color: #303030;
  background: #303030;
  color: #fff;
}

.tk-profile-nav-item > span:nth-child(2) {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.tk-profile-nav-item strong {
  font-size: 13px;
  font-weight: 650;
}

.tk-profile-nav-item small,
.tk-profile-nav-item > .bi {
  color: var(--tk-muted);
  font-size: 11px;
}

.tk-permissions-content,
.tk-permission-groups {
  display: grid;
  gap: 12px;
}

.tk-permissions-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  min-height: 96px;
  padding: 16px 18px;
}

.tk-selected-profile {
  display: flex;
  align-items: center;
  gap: 12px;
}

.tk-selected-profile-icon {
  display: grid;
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  place-items: center;
  border-radius: 10px;
  background: #ededed;
  color: #4a4a4a;
  font-size: 17px;
}

.tk-eyebrow {
  color: var(--tk-muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.tk-permissions-summary h2 {
  margin: 1px 0 1px;
  font-size: 17px;
  font-weight: 650;
}

.tk-permissions-summary p {
  margin: 0;
  color: var(--tk-muted);
  font-size: 12px;
}

.tk-permission-stats {
  display: flex;
  gap: 8px;
}

.tk-permission-stats > span {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 110px;
  padding: 8px 11px;
  border-radius: 8px;
  background: #f1f1f1;
  color: var(--tk-muted);
  font-size: 11px;
}

.tk-permission-stats > span.is-allowed {
  background: #eaf7ef;
  color: #27633b;
}

.tk-permission-stats > span > i {
  color: #8a8a8a;
  font-size: 15px;
}

.tk-permission-stats > span.is-allowed > i {
  color: #298246;
}

.tk-permission-stats > span > span {
  display: block;
  min-width: 0;
  padding: 0;
  background: transparent;
}

.tk-permission-stats strong {
  display: block;
  color: inherit;
  font-size: 16px;
}

.tk-permissions-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 58px;
  padding: 10px 12px;
  border-top: 1px solid var(--tk-border);
  background: #fafafa;
}

.tk-permissions-search {
  display: flex;
  min-width: 240px;
  height: 36px;
  align-items: center;
  gap: 8px;
  flex: 1;
  padding: 0 10px;
  border: 1px solid var(--tk-border-strong);
  border-radius: 8px;
  background: #fff;
  color: var(--tk-muted);
  box-shadow: 0 1px 0 rgba(0, 0, 0, .03);
}

.tk-permissions-search:focus-within {
  border-color: #616161;
  box-shadow: 0 0 0 1px #616161;
}

.tk-permissions-search input {
  min-width: 0;
  height: 100%;
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--tk-text);
  font: inherit;
}

.tk-permissions-search button {
  display: grid;
  width: 24px;
  height: 24px;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--tk-muted);
}

.tk-permissions-search button:hover {
  background: #ededed;
}

.tk-permissions-bulk-actions {
  display: flex;
  gap: 8px;
  flex: 0 0 auto;
}

.tk-permissions-bulk-actions .btn {
  height: 36px;
}

.tk-permission-group {
  overflow: hidden;
}

.tk-permission-group-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 13px 16px;
  border-bottom: 1px solid var(--tk-border);
  background: #f7f7f7;
}

.tk-permission-group-head h3 {
  margin: 0;
  font-size: 14px;
  font-weight: 650;
}

.tk-permission-group-head span {
  color: var(--tk-muted);
  font-size: 11px;
}

.tk-permission-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  min-height: 56px;
  padding: 10px 16px;
}

.tk-permission-row + .tk-permission-row {
  border-top: 1px solid var(--tk-border);
}

.tk-permission-row:hover {
  background: #fcfcfc;
}

.tk-permission-row label {
  display: flex;
  flex: 1;
  min-width: 0;
  cursor: pointer;
  flex-direction: column;
}

.tk-permission-row strong {
  font-size: 13px;
  font-weight: 600;
}

.tk-permission-row span {
  margin-top: 2px;
  color: var(--tk-muted);
  font-size: 11px;
}

.tk-permission-row[hidden],
.tk-permission-group[hidden] {
  display: none;
}

@media (max-width: 991.98px) {
  .tk-permissions-layout {
    grid-template-columns: 1fr;
  }

  .tk-permissions-sidebar {
    position: static;
  }

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

  .tk-permissions-sidebar {
    top: auto;
  }
}

@media (max-width: 767.98px) {
  .tk-assignment-row,
  .tk-permissions-summary,
  .tk-permissions-toolbar,
  .tk-permission-group-head {
    align-items: stretch;
    flex-direction: column;
  }

  .tk-default-choice {
    padding-left: 28px;
  }

  .tk-profile-nav {
    grid-template-columns: 1fr;
  }

  .tk-permission-stats,
  .tk-permissions-bulk-actions,
  .tk-permissions-bulk-actions .btn {
    width: 100%;
  }

.tk-permission-stats > span {
    flex: 1;
  }

  .tk-permissions-search {
    width: 100%;
    min-width: 0;
  }

  .tk-permissions-bulk-actions .btn {
    flex: 1;
  }
}
.tk-pos-help-desk .tk-list-header { margin-bottom: 16px; }
.tk-pos-help-refresh { display: inline-flex; align-items: center; gap: 6px; color: var(--tk-muted, #6d7175); font-size: 12px; white-space: nowrap; }
.tk-pos-help-queue { display: grid; gap: 12px; }
.tk-pos-help-ticket { padding: 16px; }
.tk-pos-help-ticket > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 13px; border-bottom: 1px solid #e1e3e5; }
.tk-pos-help-ticket-title,.tk-pos-help-ticket-actions { display: flex; align-items: center; gap: 8px; }
.tk-pos-help-time { color: #6d7175; font-size: 12px; }
.tk-pos-help-ticket-grid { display: grid; grid-template-columns: minmax(150px,.8fr) minmax(140px,.7fr) minmax(240px,1.7fr) minmax(190px,1fr); gap: 22px; padding: 15px 0; }
.tk-pos-help-ticket-grid > div { min-width: 0; }
.tk-pos-help-ticket-grid span,.tk-pos-help-reason span { display: block; margin-bottom: 3px; color: #6d7175; font-size: 11px; font-weight: 650; text-transform: uppercase; letter-spacing: .035em; }
.tk-pos-help-ticket-grid strong,.tk-pos-help-ticket-grid small { display: block; overflow-wrap: anywhere; }
.tk-pos-help-ticket-grid strong { font-size: 13px; }
.tk-pos-help-ticket-grid small { margin-top: 2px; color: #6d7175; }
.tk-pos-help-stock > div { display: flex; align-items: center; gap: 8px; }
.tk-pos-help-stock b { padding: 5px 8px; border-radius: 7px; background: #f3f3f3; font-size: 12px; }
.tk-pos-help-reason { display: flex; gap: 9px; padding: 11px 12px; border-radius: 8px; background: #f7f7f7; }
.tk-pos-help-reason > i { margin-top: 2px; color: #6d7175; }
.tk-pos-help-reason p { margin: 0; color: #303030; }
#posHelpResolveModal .tk-field { display: grid; gap: 6px; margin-bottom: 14px; }
#posHelpResolveModal .tk-field > span { font-weight: 650; }
#posHelpResolveModal .tk-field select,#posHelpResolveModal .tk-field input,#posHelpResolveModal .tk-field textarea { width: 100%; border: 1px solid #8a8a8a; border-radius: 8px; padding: 9px 10px; background: #fff; }
#posHelpResolveModal .tk-field small { color: #6d7175; }
.tk-money-input { height: 38px; display: flex; align-items: center; gap: 7px; padding: 0 10px; border: 1px solid #8a8a8a; border-radius: 8px; background: #fff; }
.tk-money-input > span { flex: 0 0 auto; color: #6d7175; font-weight: 650; }
#posHelpResolveModal .tk-money-input input { min-width: 0; padding: 0; border: 0; outline: 0; }
.tk-pos-help-result-options { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
.tk-pos-help-result-options:has([data-discount-type]) { grid-template-columns: repeat(2,minmax(0,1fr)); }
.tk-pos-help-result-options .btn { min-height: 54px; padding: 7px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; white-space: normal; }
.tk-pos-help-result-options .btn.active { color: #fff; background: #303030; border-color: #303030; }
.tk-pos-help-result-options.tk-resolution-presets { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
.tk-pos-help-result-options.tk-resolution-presets .btn { height: 36px; min-height: 36px; padding: 0 10px; justify-content: flex-start; gap: 7px; text-align: left; white-space: nowrap; font-size: 12px; line-height: 1; }
.tk-pos-help-result-options.tk-resolution-presets .btn i { flex: 0 0 auto; font-size: 13px; color: #6d7175; }
.tk-pos-help-result-options.tk-resolution-presets .btn.active i { color: #fff; }
@media (max-width: 640px) { .tk-pos-help-result-options.tk-resolution-presets { grid-template-columns: 1fr; } }
.tk-audit-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid var(--tk-border);background:var(--tk-surface-muted)}.tk-audit-summary article{padding:11px 16px;border-right:1px solid var(--tk-border)}.tk-audit-summary article:last-child{border-right:0}.tk-audit-summary span{display:block;color:#616161;font-size:12px}.tk-audit-summary strong{display:block;margin-top:2px;font-size:18px;letter-spacing:-.01em}
.tk-audit-state,.tk-audit-severity{display:inline-flex;align-items:center;width:max-content;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:650;background:#eee;color:#4a4a4a}.tk-audit-state.state-a{background:#fff1cc;color:#6d4d00}.tk-audit-state.state-r{background:#e4f0ff;color:#174b86}.tk-audit-state.state-s{background:#e4f5ed;color:#006b4f}.tk-audit-state.state-c{background:#e8e8e8;color:#4a4a4a}.tk-audit-severity.severity-a,.tk-audit-severity.severity-c{background:#ffe7e5;color:#8e1f16}.tk-audit-severity.severity-b{background:#e4f5ed;color:#006b4f}
.tk-audit-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px}.tk-audit-detail-grid>main,.tk-audit-detail-grid>aside{display:grid;align-content:start;gap:16px}.tk-audit-case-card,.tk-audit-timeline{padding:18px}.tk-audit-case-card h2{margin:8px 0 0;font-size:20px}.tk-audit-case-card>p{margin:14px 0;color:#4a4a4a}.tk-audit-resolution{margin-top:14px;padding:12px;border-radius:9px;background:#f4f4f4}.tk-audit-resolution.is-closed{background:#eaf6f1}.tk-audit-resolution p{margin:4px 0 0}
.tk-audit-timeline article{position:relative;display:grid;grid-template-columns:18px 1fr;gap:10px;padding:12px 0}.tk-audit-timeline article:not(:last-child):before{content:"";position:absolute;left:7px;top:28px;bottom:-8px;width:1px;background:#dedede}.tk-audit-event-dot{position:relative;z-index:1;width:15px;height:15px;border:4px solid #303030;border-radius:50%;background:#fff;margin-top:2px}.tk-audit-timeline p{margin:3px 0;color:#4a4a4a}.tk-audit-timeline small{color:#6d7175}
@media(max-width:900px){.tk-audit-summary{grid-template-columns:repeat(2,1fr)}.tk-audit-detail-grid{grid-template-columns:1fr}}@media(max-width:560px){.tk-audit-summary{grid-template-columns:1fr}}
@media (max-width: 1100px) {
  .tk-pos-help-ticket-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 720px) {
  .tk-pos-help-ticket > header,.tk-pos-help-ticket-actions { align-items: stretch; flex-direction: column; }
  .tk-pos-help-ticket-grid { grid-template-columns: 1fr; }
  .tk-pos-help-ticket-actions .btn { width: 100%; }
  .tk-pos-help-refresh { display: none; }
}
.tk-transfer-document-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 16px;
  align-items: start;
}

.tk-transfer-document-main {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.tk-transfer-route-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
}

.tk-transfer-route-block {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--tk-border, #dedede);
  border-radius: 10px;
  background: #fafafa;
}

.tk-transfer-route-block > strong {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
}

.tk-transfer-route-arrow {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #303030;
  color: #fff;
}

.tk-transfer-add-row {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) 140px auto;
  gap: 10px;
  align-items: end;
  padding: 12px 14px;
  border-top: 1px solid var(--tk-border, #dedede);
  border-bottom: 1px solid var(--tk-border, #dedede);
}

.tk-transfer-items-card .tk-section-row h2 {
  margin: 0;
  font-size: 14px;
  line-height: 1.25;
}

.tk-transfer-product-combo {
  position: relative;
  min-width: 0;
}

.tk-transfer-product-combo .tk-list-search {
  width: 100%;
}

.tk-transfer-product-menu {
  position: absolute;
  z-index: 1080;
  top: calc(100% + 5px);
  left: 0;
  right: 0;
  max-height: 340px;
  overflow-y: auto;
  padding: 5px;
  border: 1px solid #cfcfcf;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .14);
}

.tk-transfer-product-option {
  display: grid;
  gap: 2px;
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #303030;
  text-align: left;
}

.tk-transfer-product-option:hover,
.tk-transfer-product-option:focus-visible {
  background: #f1f1f1;
  outline: none;
}

.tk-transfer-product-option strong {
  font-size: 13px;
}

.tk-transfer-product-option span,
.tk-transfer-product-no-results {
  color: #6d6d6d;
  font-size: 12px;
}

.tk-transfer-product-no-results {
  padding: 12px;
}

.tk-transfer-line-quantity {
  width: 110px;
  height: 34px;
  padding: 5px 9px;
  border: 1px solid #c9c9c9;
  border-radius: 7px;
  text-align: right;
}

.tk-transfer-document-aside {
  position: sticky;
  top: 84px;
}

.tk-transfer-summary {
  display: grid;
  gap: 14px;
}

.tk-transfer-summary-list {
  display: grid;
  gap: 0;
  margin: 0;
}

.tk-transfer-summary-list > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 38px;
  border-bottom: 1px solid #e4e4e4;
}

.tk-transfer-summary-list dt {
  color: #616161;
  font-weight: 500;
}

.tk-transfer-summary-list dd {
  margin: 0;
  color: #303030;
  font-weight: 700;
}

@media (max-width: 980px) {
  .tk-transfer-document-grid {
    grid-template-columns: 1fr;
  }

  .tk-transfer-document-aside {
    position: static;
  }
}

@media (max-width: 680px) {
  .tk-transfer-route-grid,
  .tk-transfer-add-row {
    grid-template-columns: 1fr;
  }

  .tk-transfer-route-arrow {
    margin: -2px auto;
    transform: rotate(90deg);
  }
}