/*
 * Horizon V11 — final visual consistency layer.
 * Reference tokens: horizon-builderkit-full-clone/src/app/globals.css
 * Goals: system-theme fidelity, balanced forms/icons, semantic compact actions,
 * modern subtle scrollbars, no visual form nesting, predictable responsive layout.
 */

:root,
html[data-theme="light"] {
  --hz-bg: oklch(1 0 0);
  --hz-text: oklch(0.145 0 0);
  --hz-surface: oklch(1 0 0);
  --hz-card: oklch(0.97 0 0);
  --hz-muted: oklch(0.556 0 0);
  --hz-faint: oklch(0.556 0 0 / .76);
  --hz-primary: var(--ui-accent, #2563eb);
  --hz-primary-foreground: var(--ui-accent-foreground, #fff);
  --hz-secondary: oklch(0.97 0 0);
  --hz-secondary-foreground: oklch(0.205 0 0);
  --hz-border: oklch(0.922 0 0);
  --hz-input: oklch(0.922 0 0);
  --hz-ring: oklch(0.708 0 0);
  --hz-shadow: oklch(0.145 0 0 / .075);
  --hz-scroll-thumb: oklch(0.145 0 0 / .17);
  --hz-scroll-hover: oklch(0.145 0 0 / .29);
  --hz-info: oklch(0.59 0.16 250);
  --hz-info-soft: oklch(0.95 0.035 250);
  --hz-success: oklch(0.59 0.15 155);
  --hz-success-soft: oklch(0.95 0.04 155);
  --hz-warning: oklch(0.68 0.16 75);
  --hz-warning-soft: oklch(0.96 0.045 80);
  --hz-danger: oklch(0.59 0.22 27);
  --hz-danger-soft: oklch(0.96 0.035 27);
  --hz-purple: oklch(0.56 0.18 300);
  --hz-purple-soft: oklch(0.95 0.035 300);
  color-scheme: light;
}
html.dark,
html[data-theme="dark"] {
  --hz-bg: oklch(0.145 0 0);
  --hz-text: oklch(0.985 0 0);
  --hz-surface: oklch(0.205 0 0);
  --hz-card: oklch(0.269 0 0);
  --hz-muted: oklch(0.708 0 0);
  --hz-faint: oklch(0.708 0 0 / .78);
  --hz-primary: var(--ui-accent, #2563eb);
  --hz-primary-foreground: var(--ui-accent-foreground, #fff);
  --hz-secondary: oklch(0.269 0 0);
  --hz-secondary-foreground: oklch(0.985 0 0);
  --hz-border: oklch(1 0 0 / 10%);
  --hz-input: oklch(1 0 0 / 15%);
  --hz-ring: oklch(0.556 0 0);
  --hz-shadow: oklch(0 0 0 / .30);
  --hz-scroll-thumb: oklch(1 0 0 / .16);
  --hz-scroll-hover: oklch(1 0 0 / .30);
  --hz-info: oklch(0.73 0.13 250);
  --hz-info-soft: oklch(0.31 0.055 250);
  --hz-success: oklch(0.75 0.14 155);
  --hz-success-soft: oklch(0.31 0.055 155);
  --hz-warning: oklch(0.82 0.13 80);
  --hz-warning-soft: oklch(0.32 0.055 80);
  --hz-danger: oklch(0.72 0.18 27);
  --hz-danger-soft: oklch(0.31 0.06 27);
  --hz-purple: oklch(0.74 0.13 300);
  --hz-purple-soft: oklch(0.31 0.055 300);
  color-scheme: dark;
}

/* One visual language for client + admin. */
body.horizon {
  background: var(--hz-bg) !important;
  color: var(--hz-text) !important;
}
body.horizon :is(.content-wrapper,.admin-content-wrapper,.main-content-wrapper,.dashboard-container,.dash-container,.hz-main,.hz-panel) {
  background-color: var(--hz-bg) !important;
  color: var(--hz-text) !important;
}
body.horizon :is(h1,h2,h3,h4,h5,h6,.page-title,.dashboard-title,.admin-title,.admin-page-title,.card-title,.modal-title,strong,b,.fw-bold,.font-weight-bold) {
  color: var(--hz-text) !important;
}
body.horizon :is(p,small,.small,.text-muted,.admin-subtitle,.dashboard-subtitle,.form-text,.help-block,.description,.subtitle) {
  color: var(--hz-muted) !important;
}
body.horizon :is(.text-dark,.text-body,.text-secondary) { color: var(--hz-text) !important; }
body.horizon :is(hr,.dropdown-divider) { border-color: var(--hz-border) !important; }

/* Surfaces: preserve one boundary per meaningful component. */
body.horizon :is(.card,.admin-card,.admin-panel,.glass-card,.data-card,.modern-card,.custom-card,.modal-content,.dropdown-menu,.popover,.list-group-item,.info-box,.small-box,.bank-card-glass,.tcb-card,.captcha-card,.hz-tool-card,.hz-feature-card) {
  background: var(--hz-surface) !important;
  color: var(--hz-text) !important;
  border-color: var(--hz-border) !important;
}
body.horizon :is(.card-header,.card-footer,.modal-header,.modal-footer,.table thead th,.modern-table thead th,.admin-clean-table thead th,.bg-light,.bg-white) {
  background: var(--hz-card) !important;
  color: var(--hz-text) !important;
  border-color: var(--hz-border) !important;
}
body.horizon :is(.table,.modern-table,.admin-clean-table) { color: var(--hz-text) !important; }
body.horizon :is(.table td,.table th,.modern-table td,.modern-table th,.admin-clean-table td,.admin-clean-table th) {
  color: var(--hz-text) !important;
  border-color: var(--hz-border) !important;
}
body.horizon :is(.table tbody tr,.modern-table tbody tr,.admin-clean-table tbody tr) { background: transparent !important; }
body.horizon :is(.table tbody tr:hover,.modern-table tbody tr:hover,.admin-clean-table tbody tr:hover) { background: var(--hz-card) !important; }

/* Admin settings: remove the visual card-inside-card effect. */
body.admin-basic.horizon .admin-card > .tabs-modern { background: transparent !important; }
body.admin-basic.horizon :is(.tabs-nav,.tabs-content,.tab-pane,.setting-section,.section-heading) { color: var(--hz-text) !important; }
body.admin-basic.horizon .tabs-nav {
  background: var(--hz-surface) !important;
  border-color: var(--hz-border) !important;
  gap: 4px !important;
}
body.admin-basic.horizon .tab-link {
  color: var(--hz-muted) !important;
  border-bottom-color: transparent !important;
}
body.admin-basic.horizon .tab-link:is(:hover,.active) {
  color: var(--hz-text) !important;
  border-bottom-color: var(--hz-text) !important;
}
body.admin-basic.horizon .tabs-content { background: var(--hz-surface) !important; }
body.admin-basic.horizon .setting-section {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.admin-basic.horizon .setting-section + .setting-section { margin-top: 24px !important; }
body.admin-basic.horizon .section-heading { margin: 0 0 20px !important; padding: 0 !important; border: 0 !important; background: transparent !important; }
body.admin-basic.horizon .section-heading h3 { margin: 0 0 6px !important; font-size: 1.18rem !important; line-height: 1.35 !important; }
body.admin-basic.horizon .section-heading p { margin: 0 !important; color: var(--hz-muted) !important; }
body.admin-basic.horizon form.hz-form {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Balanced form grid and fields. */
body.horizon :is(.form-grid,.profile-form-grid-v3) {
  align-items: start !important;
}
body.horizon .form-grid {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 18px 20px !important;
}
body.horizon :is(.form-group,.form-field,.admin-form-group,.hz-auth-field,.profile-form-field-v3,.tcb-field,.captcha-field) {
  min-width: 0 !important;
  max-width: 100% !important;
}
body.horizon form :is(.form-group,.form-field,.admin-form-group,.hz-auth-field,.profile-form-field-v3,.tcb-field,.captcha-field) {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
body.horizon :is(.form-group,.form-field,.admin-form-group,.hz-auth-field,.profile-form-field-v3,.tcb-field,.captcha-field) > label,
body.horizon label.form-label {
  display: flex !important;
  align-items: center !important;
  min-height: 20px !important;
  margin: 0 0 7px !important;
  color: var(--hz-text) !important;
  font-size: .82rem !important;
  font-weight: 650 !important;
  line-height: 1.35 !important;
}
body.horizon :is(.form-group,.form-field,.admin-form-group,.hz-auth-field,.profile-form-field-v3,.tcb-field,.captcha-field) > :is(small,.form-text,.help-block) {
  margin-top: 6px !important;
  color: var(--hz-muted) !important;
  line-height: 1.45 !important;
}
body.horizon form :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]),select,.form-control,.form-select,.custom-select,.dataTable-input,.dataTable-selector) {
  min-height: 42px !important;
  height: 42px !important;
  padding: 9px 12px !important;
  line-height: 22px !important;
  border: 1px solid var(--hz-input) !important;
  border-radius: 9px !important;
  background: var(--hz-surface) !important;
  color: var(--hz-text) !important;
  -webkit-text-fill-color: var(--hz-text) !important;
  box-shadow: 0 1px 2px var(--hz-shadow) !important;
}
body.horizon form textarea,
body.horizon textarea.form-control { min-height: 100px !important; height: auto !important; padding: 10px 12px !important; line-height: 1.5 !important; }
body.horizon form :is(input,textarea)::placeholder { color: var(--hz-faint) !important; opacity: 1 !important; }
body.horizon form :is(input,select,textarea,.form-control,.form-select):focus {
  outline: 0 !important;
  border-color: var(--hz-ring) !important;
  box-shadow: 0 0 0 3px color-mix(in srgb,var(--hz-ring) 22%,transparent) !important;
}
body.horizon form :is(input,textarea,.form-control)[readonly],
body.horizon form :is(input,select,textarea,.form-control,.form-select):disabled {
  background: var(--hz-card) !important;
  color: var(--hz-muted) !important;
  -webkit-text-fill-color: var(--hz-muted) !important;
  opacity: 1 !important;
}
body.horizon :is(.form-check,.hz-auth-check) { display: flex !important; align-items: center !important; gap: 8px !important; min-height: 22px !important; }
body.horizon :is(.form-check-input,input[type=checkbox],input[type=radio]) { flex: 0 0 auto; }
body.horizon .form-check-label { margin: 0 !important; }

/* Input groups: true cells, never overlay each other. */
body.horizon .input-group {
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) auto !important;
  align-items: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  gap: 0 !important;
  border: 1px solid var(--hz-input) !important;
  border-radius: 9px !important;
  background: var(--hz-surface) !important;
  box-shadow: 0 1px 2px var(--hz-shadow) !important;
  overflow: hidden !important;
}
body.horizon .input-group > * {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body.horizon .input-group > :is(input,.form-control,.form-select,select) {
  grid-column: auto !important;
  min-width: 0 !important;
  width: 100% !important;
  border: 0 !important;
  background: transparent !important;
}
body.horizon .input-group > :is(.input-group-prepend,.input-group-append) { display: contents !important; }
body.horizon .input-group > :is(.input-group-text,.btn),
body.horizon .input-group > :is(.input-group-prepend,.input-group-append) > :is(.input-group-text,.btn) {
  width: auto !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  display: inline-grid !important;
  place-items: center !important;
  padding: 0 11px !important;
  border: 0 !important;
  border-right: 1px solid var(--hz-input) !important;
  background: var(--hz-card) !important;
  color: var(--hz-muted) !important;
}
body.horizon .input-group > :last-child,
body.horizon .input-group > .input-group-append:last-child > :last-child { border-right: 0 !important; border-left: 1px solid var(--hz-input) !important; }

/* Auth/profile icon fields: icon, value, action are separate grid cells. */
body.horizon :is(.hz-auth-control,.profile-input-v3) {
  display: grid !important;
  grid-template-columns: 40px minmax(0,1fr) auto !important;
  align-items: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  overflow: hidden !important;
  border: 1px solid var(--hz-input) !important;
  border-radius: 9px !important;
  background: var(--hz-surface) !important;
  box-shadow: 0 1px 2px var(--hz-shadow) !important;
}
body.horizon :is(.hz-auth-control,.profile-input-v3):focus-within { border-color: var(--hz-ring) !important; box-shadow: 0 0 0 3px color-mix(in srgb,var(--hz-ring) 22%,transparent) !important; }
body.horizon :is(.hz-auth-control,.profile-input-v3) > i:first-child {
  position: static !important;
  inset: auto !important;
  grid-column: 1 !important;
  display: grid !important;
  place-items: center !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  margin: 0 !important;
  transform: none !important;
  border-right: 1px solid var(--hz-input) !important;
  background: var(--hz-card) !important;
  color: var(--hz-muted) !important;
  line-height: 1 !important;
  pointer-events: none !important;
}
body.horizon :is(.hz-auth-control,.profile-input-v3) > input {
  position: static !important;
  inset: auto !important;
  grid-column: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 8px 11px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.horizon :is(.hz-auth-control-action,.profile-password-toggle-v3) {
  position: static !important;
  inset: auto !important;
  grid-column: 3 !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  border: 0 !important;
  border-left: 1px solid var(--hz-input) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--hz-muted) !important;
  box-shadow: none !important;
}
body.horizon :is(.hz-auth-control-action,.profile-password-toggle-v3):hover { background: var(--hz-card) !important; color: var(--hz-text) !important; }

/* Generic icons: stable geometry and spacing, no text collision. */
body.horizon :is(.btn,.hz-button,.hz-small-button,.hz-primary-button,.profile-btn-v3,.tcb-btn,.captcha-btn,.action-btn,.admin-action-btn,.table-action-btn,.btn-save,.btn-gradient,.btn-gradient-sm):not(.btn-icon):not(.hz-icon-button):not(.action-icon) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  vertical-align: middle !important;
}
body.horizon :is(.btn,.hz-button,.hz-small-button,.hz-primary-button,.profile-btn-v3,.tcb-btn,.captcha-btn,.action-btn,.admin-action-btn,.table-action-btn,.btn-save,.btn-gradient,.btn-gradient-sm):not(.btn-icon):not(.hz-icon-button):not(.action-icon) > :is(i,svg) {
  position: static !important;
  inset: auto !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  transform: none !important;
  line-height: 16px !important;
  text-align: center !important;
  color: currentColor !important;
}
body.horizon :is(.btn-icon,.hz-icon-button,.action-icon,.captcha-copy-action,.tcb-icon-btn) {
  display: inline-grid !important;
  place-items: center !important;
  flex: 0 0 auto !important;
  min-width: 36px !important;
  width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  line-height: 1 !important;
}
body.horizon :is(.btn-icon,.hz-icon-button,.action-icon,.captcha-copy-action,.tcb-icon-btn) > :is(i,svg) {
  position: static !important;
  inset: auto !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  transform: none !important;
  line-height: 16px !important;
}

/* Main actions follow system theme. */
body.horizon :is(.btn-primary,.btn-save,.save-btn,.submit-btn,.add-btn,.hz-primary-button,.profile-btn-v3--primary,.tcb-btn-primary,.captcha-btn--primary,.captcha-primary-action,.renew-pay-button) {
  background: var(--hz-primary) !important;
  background-image: none !important;
  border-color: var(--hz-primary) !important;
  color: var(--hz-primary-foreground) !important;
  -webkit-text-fill-color: var(--hz-primary-foreground) !important;
  box-shadow: none !important;
}
body.horizon :is(.btn-primary,.btn-save,.save-btn,.submit-btn,.add-btn,.hz-primary-button,.profile-btn-v3--primary,.tcb-btn-primary,.captcha-btn--primary,.captcha-primary-action,.renew-pay-button):is(:hover,:focus-visible,:active) {
  filter: brightness(.96);
  color: var(--hz-primary-foreground) !important;
}
body.horizon :is(.btn-secondary,.btn-light,.btn-outline-secondary,.btn-default,.btn-outline-dark,.hz-button,.hz-small-button,.btn-outline-glass,.profile-btn-v3:not(.profile-btn-v3--primary),.btn-back,.btn-cancel-edit) {
  background: var(--hz-surface) !important;
  border-color: var(--hz-border) !important;
  color: var(--hz-text) !important;
  -webkit-text-fill-color: var(--hz-text) !important;
  box-shadow: none !important;
}
body.horizon :is(.btn-secondary,.btn-light,.btn-outline-secondary,.btn-default,.btn-outline-dark,.hz-button,.hz-small-button,.btn-outline-glass,.profile-btn-v3:not(.profile-btn-v3--primary),.btn-back,.btn-cancel-edit):is(:hover,:focus-visible) { background: var(--hz-card) !important; }

/* Compact Admin/table actions: diverse semantic colours, still mode-aware. */
body.horizon :is(.btn-sm,.action-icon,.admin-action-btn,.table-action-btn,.btn-gradient-sm) { border-width: 1px !important; box-shadow: none !important; }
body.horizon :is(.btn-info,.btn-view,.view-btn,.action-view-token,.action-icon.bg-primary) {
  background: var(--hz-info-soft) !important; border-color: color-mix(in srgb,var(--hz-info) 38%,transparent) !important; color: var(--hz-info) !important; -webkit-text-fill-color: var(--hz-info) !important;
}
body.horizon :is(.btn-success,.success-btn,.action-icon.bg-success,.btn-activate) {
  background: var(--hz-success-soft) !important; border-color: color-mix(in srgb,var(--hz-success) 38%,transparent) !important; color: var(--hz-success) !important; -webkit-text-fill-color: var(--hz-success) !important;
}
body.horizon :is(.btn-warning,.btn-edit,.edit-btn,.action-icon.bg-warning) {
  background: var(--hz-warning-soft) !important; border-color: color-mix(in srgb,var(--hz-warning) 40%,transparent) !important; color: var(--hz-warning) !important; -webkit-text-fill-color: var(--hz-warning) !important;
}
body.horizon :is(.btn-danger,.btn-delete,.delete-btn,.danger-btn,.action-icon.bg-danger,.btn-deactivate) {
  background: var(--hz-danger-soft) !important; border-color: color-mix(in srgb,var(--hz-danger) 38%,transparent) !important; color: var(--hz-danger) !important; -webkit-text-fill-color: var(--hz-danger) !important;
}
body.horizon :is(.btn-copy,.copy-btn,.captcha-copy-btn,.js-copy-token,.action-icon.bg-dark) {
  background: var(--hz-purple-soft) !important; border-color: color-mix(in srgb,var(--hz-purple) 38%,transparent) !important; color: var(--hz-purple) !important; -webkit-text-fill-color: var(--hz-purple) !important;
}
body.horizon :is(.btn-info,.btn-view,.view-btn,.action-view-token,.btn-success,.success-btn,.btn-warning,.btn-edit,.edit-btn,.btn-danger,.btn-delete,.delete-btn,.danger-btn,.btn-copy,.copy-btn,.captcha-copy-btn,.js-copy-token):is(:hover,:focus-visible) { filter: brightness(.96); }

/* Badges/alerts keep semantics but use readable foregrounds. */
body.horizon :is(.alert,.tcb-notice,.captcha-notice) { border-color: var(--hz-border) !important; }
body.horizon .alert:not(.alert-danger):not(.alert-success):not(.alert-warning):not(.alert-info) { background: var(--hz-card) !important; color: var(--hz-text) !important; }
body.horizon .alert-info { background: var(--hz-info-soft) !important; color: var(--hz-info) !important; border-color: color-mix(in srgb,var(--hz-info) 32%,transparent) !important; }
body.horizon .alert-success { background: var(--hz-success-soft) !important; color: var(--hz-success) !important; border-color: color-mix(in srgb,var(--hz-success) 32%,transparent) !important; }
body.horizon .alert-warning { background: var(--hz-warning-soft) !important; color: var(--hz-warning) !important; border-color: color-mix(in srgb,var(--hz-warning) 32%,transparent) !important; }
body.horizon .alert-danger { background: var(--hz-danger-soft) !important; color: var(--hz-danger) !important; border-color: color-mix(in srgb,var(--hz-danger) 32%,transparent) !important; }

/* Third-party widgets follow the same tokens. */
body.horizon :is(.select2-container--default .select2-selection--single,.select2-container--default .select2-selection--multiple,.select2-dropdown,.choices__inner,.choices__list--dropdown,.note-editor.note-frame,.note-toolbar,.note-editing-area,.note-editable,.dataTables_wrapper input,.dataTables_wrapper select) {
  background: var(--hz-surface) !important;
  color: var(--hz-text) !important;
  border-color: var(--hz-input) !important;
}
body.horizon :is(.select2-results__option,.choices__item,.note-editable) { color: var(--hz-text) !important; }
body.horizon :is(.select2-results__option--highlighted,.choices__item--choice.is-highlighted) { background: var(--hz-card) !important; color: var(--hz-text) !important; }

/* System search: real input, visually identical to Horizon sidebar controls. */
body.horizon .hz-search-box {
  display: grid !important;
  grid-template-columns: 18px minmax(0,1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 38px !important;
  padding: 0 9px !important;
  border: 1px solid var(--hz-border) !important;
  border-radius: 8px !important;
  background: var(--hz-surface) !important;
  color: var(--hz-text) !important;
  box-shadow: none !important;
}
body.horizon .hz-search-box:focus-within { border-color: var(--hz-ring) !important; box-shadow: 0 0 0 3px color-mix(in srgb,var(--hz-ring) 18%,transparent) !important; }
body.horizon .hz-search-box > i { position: static !important; width: 18px !important; height: 18px !important; line-height: 18px !important; color: var(--hz-muted) !important; }
body.horizon .hz-search-input {
  width: 100% !important;
  min-width: 0 !important;
  height: 34px !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: var(--hz-text) !important;
  font: inherit !important;
  box-shadow: none !important;
}
body.horizon .hz-search-input::placeholder { color: var(--hz-muted) !important; opacity: 1 !important; }
body.horizon .hz-search-box kbd { border: 1px solid var(--hz-border) !important; background: var(--hz-card) !important; color: var(--hz-muted) !important; }
body.horizon .hz-nav-row.is-search-hidden,
body.horizon .hz-nav-dropdown.is-search-hidden,
body.horizon .hz-nav-group.is-search-empty { display: none !important; }
body.horizon .hz-search-empty { margin: 10px 4px 0; padding: 10px; border: 1px dashed var(--hz-border); border-radius: 8px; color: var(--hz-muted); font-size: 12px; }

/* Money and stat typography: large values cannot break the card. */
body.horizon :is(.stat-value,.bank-count,.summary-value,.balance-value,.wallet-balance,.money-value,.amount-value,.plan-value,.dashboard-balance) {
  min-width: 0 !important;
  max-width: 100% !important;
  font-size: clamp(1rem,1.45vw,1.45rem) !important;
  line-height: 1.12 !important;
  letter-spacing: -.02em !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

/* Modern, quiet scrollbars everywhere scroll is possible. */
html { scrollbar-width: thin; scrollbar-color: var(--hz-scroll-thumb) transparent; }
body.horizon :is(*,.table-responsive,.data-table-wrapper,.tabs-nav,.hz-sidebar-body,.modal-body,.dropdown-menu,.note-editable) { scrollbar-width: thin; scrollbar-color: var(--hz-scroll-thumb) transparent; }
body.horizon ::-webkit-scrollbar { width: 5px; height: 5px; }
body.horizon ::-webkit-scrollbar-track { background: transparent; }
body.horizon ::-webkit-scrollbar-thumb { background: var(--hz-scroll-thumb); border-radius: 999px; border: 1px solid transparent; background-clip: padding-box; }
body.horizon ::-webkit-scrollbar-thumb:hover { background: var(--hz-scroll-hover); background-clip: padding-box; }
body.horizon ::-webkit-scrollbar-corner { background: transparent; }

/* Keep footer and action areas in normal flow. */
body.horizon :is(.hz-site-footer,.hz-landing-footer,.main-footer,.profile-form-v3__footer,.form-actions,.card-footer) {
  position: static !important;
  inset: auto !important;
  transform: none !important;
}
body.horizon .form-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 24px !important;
  padding-top: 18px !important;
  border-top: 1px solid var(--hz-border) !important;
  background: transparent !important;
}

/* Responsive balance. */
@media (max-width: 991.98px) {
  body.horizon .form-grid { grid-template-columns: 1fr !important; gap: 16px !important; }
  body.horizon .form-group.full-width { grid-column: 1 !important; }
  body.admin-basic.horizon .tabs-content { padding: 20px 16px !important; }
}
@media (max-width: 575.98px) {
  body.horizon :is(.btn,.hz-button,.hz-small-button,.profile-btn-v3,.tcb-btn,.captcha-btn):not(.btn-icon):not(.hz-icon-button):not(.action-icon) { min-height: 38px; }
  body.horizon .form-actions > * { max-width: 100% !important; }
  body.horizon .tabs-nav { overflow-x: auto !important; white-space: nowrap !important; padding-inline: 8px !important; }
  body.horizon .tab-link { flex: 0 0 auto !important; padding: 12px 10px !important; }
}

/* High-specificity auth reset: older auth styles used absolute/relative offsets. */
body.horizon .hz-auth-control,
body.horizon .hz-auth-control.has-action {
  position: static !important;
  grid-template-columns: 40px minmax(0,1fr) 40px !important;
}
body.horizon .hz-auth-control:not(.has-action) { grid-template-columns: 40px minmax(0,1fr) !important; }
body.horizon .hz-auth-control > i:first-child {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  width: 40px !important;
  height: 40px !important;
  border: 0 !important;
  border-right: 1px solid var(--hz-input) !important;
  border-radius: 0 !important;
}
body.horizon form .hz-auth-control > input,
body.horizon .hz-auth-control > input.form-control,
body.horizon .hz-auth-control > input {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin: 0 !important;
  width: 100% !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 8px 11px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.horizon .hz-auth-control > button.hz-auth-control-action {
  position: static !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin: 0 !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  border: 0 !important;
  border-left: 1px solid var(--hz-input) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Captcha cards: one card surface, no alternating white/grey strips. */
body.client-app.horizon .captcha-plan-page .captcha-service-card {
  padding: 16px !important;
  border: 1px solid var(--hz-border) !important;
  border-radius: 12px !important;
  background: var(--hz-surface) !important;
  color: var(--hz-text) !important;
  box-shadow: 0 1px 2px var(--hz-shadow) !important;
  overflow: hidden !important;
}
body.client-app.horizon .captcha-plan-page .captcha-service-card > *,
body.client-app.horizon .captcha-plan-page :is(.captcha-service-card__top,.captcha-service-card__price,.captcha-service-card__desc,.captcha-feature-list,.captcha-feature-list li) {
  background: transparent !important;
  color: inherit !important;
  border-color: var(--hz-border) !important;
}
body.client-app.horizon .captcha-plan-page .captcha-service-card__name { color: var(--hz-text) !important; }
body.client-app.horizon .captcha-plan-page :is(.captcha-service-card__type,.captcha-service-card__desc,.captcha-service-card__price small,.captcha-feature-list li) { color: var(--hz-muted) !important; }
body.client-app.horizon .captcha-plan-page .captcha-service-card__price strong { color: var(--hz-text) !important; font-size: clamp(1.25rem,2vw,1.65rem) !important; }
body.client-app.horizon .captcha-plan-page .captcha-service-card__price > span { color: var(--hz-warning) !important; }
body.client-app.horizon .captcha-plan-page .captcha-primary-action { margin-top: 18px !important; }

/* Dense statistics: keep very large amounts within the card. */
body.horizon .stat-info h3,
body.horizon .fs-2xl,
body.horizon .profile-metric-v3 strong,
body.horizon .admin-kpi strong,
body.horizon .summary-card strong {
  font-size: clamp(1rem,1.55vw,1.45rem) !important;
  line-height: 1.15 !important;
  letter-spacing: -.025em !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: break-word !important;
}

/* Context colours for small stat/icon tiles remain intentionally varied. */
body.horizon :is(.stat-icon.bg-primary,.badge.bg-primary) { background: var(--hz-info-soft) !important; color: var(--hz-info) !important; }
body.horizon :is(.stat-icon.bg-success,.badge.bg-success) { background: var(--hz-success-soft) !important; color: var(--hz-success) !important; }
body.horizon :is(.stat-icon.bg-warning,.badge.bg-warning) { background: var(--hz-warning-soft) !important; color: var(--hz-warning) !important; }
body.horizon :is(.stat-icon.bg-danger,.badge.bg-danger) { background: var(--hz-danger-soft) !important; color: var(--hz-danger) !important; }

/* Theme-mode authority for controls. Legacy pages contain high-specificity white inputs. */
html[data-theme="light"] body.horizon form :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]),select,textarea,.form-control,.form-select,.custom-select,.dataTable-input,.dataTable-selector),
html:not([data-theme="dark"]) body.horizon form :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]),select,textarea,.form-control,.form-select,.custom-select,.dataTable-input,.dataTable-selector) {
  background-color: var(--hz-surface) !important;
  color: var(--hz-text) !important;
  -webkit-text-fill-color: var(--hz-text) !important;
  border-color: var(--hz-input) !important;
}
html[data-theme="dark"] body.horizon form :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]),select,textarea,.form-control,.form-select,.custom-select,.dataTable-input,.dataTable-selector),
html.dark body.horizon form :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]),select,textarea,.form-control,.form-select,.custom-select,.dataTable-input,.dataTable-selector) {
  background-color: var(--hz-surface) !important;
  color: var(--hz-text) !important;
  -webkit-text-fill-color: var(--hz-text) !important;
  border-color: var(--hz-input) !important;
}
html[data-theme="dark"] body.horizon form :is(input,textarea)::placeholder,
html.dark body.horizon form :is(input,textarea)::placeholder { color: var(--hz-muted) !important; opacity: .82 !important; }
html[data-theme="dark"] body.horizon option,
html.dark body.horizon option { background: var(--hz-surface) !important; color: var(--hz-text) !important; }

/* Composite fields own their surface; their inner value cell must stay transparent. */
html[data-theme] body.horizon form .hz-auth-control > input,
html[data-theme] body.horizon form .profile-input-v3 > input,
html[data-theme] body.horizon form .input-group > :is(input,.form-control,.form-select,select),
html.dark body.horizon form .hz-auth-control > input,
html.dark body.horizon form .profile-input-v3 > input,
html.dark body.horizon form .input-group > :is(input,.form-control,.form-select,select) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* V11.1 precision: variable-length input groups must never misplace controls. */
body.horizon .input-group {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  gap: 0 !important;
}
body.horizon .input-group > :is(input,.form-control,.form-select,select,.custom-file) {
  flex: 1 1 0 !important;
  width: auto !important;
  min-width: 0 !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.horizon .input-group > .custom-file {
  display: flex !important;
  align-items: stretch !important;
  position: relative !important;
  overflow: hidden !important;
}
body.horizon .input-group > .custom-file :is(.custom-file-input,.custom-file-label) {
  min-width: 0 !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
}
body.horizon .input-group > :is(button,.btn,.input-group-text),
body.horizon .input-group > :is(.input-group-prepend,.input-group-append) {
  flex: 0 0 auto !important;
}
body.horizon .input-group > :is(.input-group-prepend,.input-group-append) {
  display: flex !important;
  align-items: stretch !important;
  margin: 0 !important;
}
body.horizon .input-group :is(button,.btn,.input-group-text) {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  height: 40px !important;
  margin: 0 !important;
  padding: 0 11px !important;
  border-top: 0 !important;
  border-bottom: 0 !important;
  border-right: 0 !important;
  border-left: 1px solid var(--hz-input) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body.horizon .input-group :is(button,.btn,.input-group-text) :is(i,svg) {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  line-height: 16px !important;
  color: currentColor !important;
}

/* Suffix/prefix fields are also real cells, not overlays. */
body.horizon .admin-input-suffix {
  display: flex !important;
  align-items: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 42px !important;
  overflow: hidden !important;
  border: 1px solid var(--hz-input) !important;
  border-radius: 9px !important;
  background: var(--hz-surface) !important;
  box-shadow: 0 1px 2px var(--hz-shadow) !important;
}
body.horizon .admin-input-suffix > :is(input,.form-control) {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  width: auto !important;
  height: 40px !important;
  min-height: 40px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.horizon .admin-input-suffix > span {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  min-width: 52px !important;
  padding: 0 11px !important;
  border-left: 1px solid var(--hz-input) !important;
  background: var(--hz-card) !important;
  color: var(--hz-muted) !important;
  font-size: .78rem !important;
  font-weight: 650 !important;
  line-height: 1 !important;
}

/* Equal rhythm for legacy filters and admin grids. */
body.horizon :is(.admin-form-grid,.filter-row,.tcb-form-grid,.captcha-form-grid) {
  align-items: end !important;
  gap: 18px 20px !important;
}
body.horizon :is(.filter-item,.admin-form-grid > .form-group,.admin-bank-row > .form-group) {
  min-width: 0 !important;
}
body.horizon .filter-item > label {
  display: flex !important;
  align-items: center !important;
  min-height: 20px !important;
  margin: 0 0 7px !important;
  color: var(--hz-text) !important;
  font-size: .82rem !important;
  font-weight: 650 !important;
}
body.horizon :is(.date-input,.readonly-input) {
  min-height: 42px !important;
  height: 42px !important;
  width: 100% !important;
  padding: 9px 12px !important;
  border: 1px solid var(--hz-input) !important;
  border-radius: 9px !important;
  background: var(--hz-surface) !important;
  color: var(--hz-text) !important;
  -webkit-text-fill-color: var(--hz-text) !important;
  box-shadow: 0 1px 2px var(--hz-shadow) !important;
}

/* Buttons and inline icons use one baseline everywhere. */
body.horizon :is(a,button,span,strong,label,p,h1,h2,h3,h4,h5,h6) > :is(i.ti,i.fa,i.fas,i.far,i.fab,svg):not(:only-child) {
  vertical-align: -0.125em !important;
}
body.horizon .hz-inline-icon {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  display: inline-block !important;
  width: 1em !important;
  min-width: 1em !important;
  height: 1em !important;
  margin: 0 .32em 0 0 !important;
  line-height: 1 !important;
  vertical-align: -.12em !important;
}
body.horizon :is(.btn-dark,.btn-gradient):not(.btn-sm):not(.action-icon) {
  background: var(--hz-primary) !important;
  background-image: none !important;
  border-color: var(--hz-primary) !important;
  color: var(--hz-primary-foreground) !important;
  -webkit-text-fill-color: var(--hz-primary-foreground) !important;
}

/* Grid rows must not distort one field relative to its neighbour. */
body.horizon .admin-bank-row {
  align-items: end !important;
}
body.horizon .admin-bank-row :is(.form-group,.admin-bank-identity) {
  min-width: 0 !important;
  margin-bottom: 0 !important;
}
body.horizon :is(.form-group,.form-field,.admin-form-group,.hz-auth-field,.profile-form-field-v3,.tcb-field,.captcha-field) {
  margin-top: 0 !important;
}

/* Mobile: preserve control geometry while allowing action groups to scroll rather than overlap. */
@media (max-width: 575.98px) {
  body.horizon .account-token-control {
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }
  body.horizon .account-token-control > input { min-width: 120px !important; }
  body.horizon .account-token-control > :is(button,.btn) {
    flex: 0 0 40px !important;
    width: 40px !important;
    padding: 0 !important;
  }
  body.horizon .admin-input-suffix > span { min-width: 48px !important; }
}