/*
 * LibraHub global UI foundation.
 * Single source for tokens, accessibility, control sizing, wrapping and base overflow behavior.
 */
:root {
  --ui-text-xs: 12px;
  --ui-text-sm: 14px;
  --ui-text-base: 16px;
  --ui-touch: 44px;
  --ui-radius: 14px;
  --ui-line: #e2e8f0;

  --lh-primary: #4f46e5;
  --lh-primary-dark: #3730a3;
  --lh-accent: #06b6d4;
  --lh-success: #059669;
  --lh-warning: #d97706;
  --lh-danger: #dc2626;
  --lh-ink: #0f172a;
  --lh-muted: #64748b;
  --lh-bg: #f5f7fb;
  --lh-surface: #ffffff;
  --lh-surface-soft: #f8fafc;
  --lh-border: #e2e8f0;
  --lh-radius-sm: 12px;
  --lh-radius: 18px;
  --lh-radius-lg: 24px;
  --lh-shadow-sm: 0 8px 24px rgba(15, 23, 42, .06);
  --lh-shadow: 0 18px 48px rgba(15, 23, 42, .09);
  --lh-content: 1440px;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  max-width: 100%;
}

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

pre,
code,
:where(.card, .panel, .modal-content, td, th, p, a, span) {
  overflow-wrap: anywhere;
}

button,
input,
select,
textarea {
  max-width: 100%;
  font: inherit;
}

button,
a,
input,
select,
textarea,
[tabindex]:not([tabindex="-1"]) {
  -webkit-tap-highlight-color: transparent;
}

button,
[role="button"],
.btn,
.btnx,
.ho-btn,
.scan-btn,
.ui-button,
.topbar-icon-btn,
.menu-btn,
.dark-btn,
input[type="submit"],
input[type="button"] {
  min-height: var(--ui-touch);
  touch-action: manipulation;
}

button,
.btn,
.btnx,
.ho-btn,
.scan-btn,
.ui-button {
  white-space: normal;
}

input,
select,
textarea {
  min-height: 44px;
}

textarea {
  min-height: 96px;
  resize: vertical;
}

[hidden] {
  display: none !important;
}

[aria-disabled="true"] {
  cursor: not-allowed !important;
  opacity: .58;
}

body:not(.sidebar-open) {
  overflow-x: clip !important;
}

small,
.small,
.text-small,
.muted,
.panel-sub,
.stat-note,
.subtitle,
.form-text,
.help-text,
.hint,
.queue-meta,
.seat-zone,
.seat-label,
.management-nav-sublabel,
.management-nav-label {
  line-height: 1.45;
}

.ui-scroll-table,
.table-responsive,
.responsive-table,
.receipt-table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

.ui-scroll-table > table,
.table-responsive > table {
  min-width: 680px;
}

table {
  max-width: 100%;
}

td,
th {
  overflow-wrap: anywhere;
  word-break: normal;
}

.topbar-title,
.page-title,
.card-title,
.student-name,
.tenant-name,
.sidebar-brand,
.brand-copy,
.status-badge,
.badge,
label {
  overflow-wrap: anywhere;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid rgba(37, 99, 235, .38) !important;
  outline-offset: 2px;
}

@media (max-width: 680px) {
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea {
    font-size: 16px;
  }

  .modal,
  [role="dialog"] {
    max-width: 100vw;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:not(.lh-force-motion) {
    scroll-behavior: auto !important;
  }

  html:not(.lh-force-motion) *,
  html:not(.lh-force-motion) *::before,
  html:not(.lh-force-motion) *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}