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

body {
  min-width: 320px;
  overflow-x: hidden;
}

#root,
main {
  min-width: 0;
}

button,
a,
input,
select,
textarea,
[role="button"],
[tabindex]:not([tabindex="-1"]) {
  outline-offset: 2px;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
[tabindex]:not([tabindex="-1"]):focus-visible {
  outline: 2px solid #c084fc !important;
  outline-offset: 2px !important;
}

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

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

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

[role="dialog"],
[aria-modal="true"] {
  max-width: min(96vw, 1120px);
  max-height: min(92vh, 920px);
}

.kv-admin-route body {
  overflow-x: hidden;
}

.kv-admin-route .fixed.inset-0 {
  align-items: flex-start !important;
  justify-content: center !important;
  padding: 16px !important;
  overflow: auto !important;
  max-height: 100dvh !important;
}

.kv-admin-route .fixed.inset-0 > div {
  width: min(100%, 1180px) !important;
  max-width: calc(100vw - 32px) !important;
  max-height: calc(100dvh - 32px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

.kv-admin-route .fixed.inset-0 > div > div {
  min-height: 0 !important;
}

.kv-admin-route .fixed.inset-0 form,
.kv-admin-route .fixed.inset-0 [class*="overflow-y"],
.kv-admin-route .fixed.inset-0 [class*="overflow-auto"] {
  min-height: 0 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
}

.kv-admin-route .fixed.inset-0 > div > div:nth-last-child(2) {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  -webkit-overflow-scrolling: touch !important;
}

.kv-admin-route .fixed.inset-0 > div > div:last-child {
  flex: 0 0 auto !important;
  overflow: visible !important;
}

.kv-admin-route .fixed.inset-0 [class*="overflow-x"],
.kv-admin-route .fixed.inset-0 [class*="tabs"],
.kv-admin-route .fixed.inset-0 nav {
  overflow-x: auto !important;
  overscroll-behavior-x: contain !important;
  scrollbar-width: thin;
}

.kv-admin-route .fixed.inset-0 textarea {
  min-height: 120px !important;
  max-height: 32dvh !important;
  overflow-y: auto !important;
  resize: vertical !important;
}

.kv-admin-route .fixed.inset-0 button,
.kv-admin-route .fixed.inset-0 input,
.kv-admin-route .fixed.inset-0 select,
.kv-admin-route .fixed.inset-0 textarea {
  flex-shrink: 0;
}

.kv-pricing-route main {
  overflow-x: hidden;
}

.kv-pricing-route main [class*="grid"][class*="gap"] {
  align-items: stretch !important;
}

.kv-pricing-route main [class*="grid"][class*="gap"] > div {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.kv-pricing-route main [class*="grid"][class*="gap"] > div button,
.kv-pricing-route main [class*="grid"][class*="gap"] > div a {
  margin-top: auto;
}

@media (min-width: 1100px) {
  .kv-pricing-route main [class*="grid"][class*="gap"] {
    grid-template-columns: repeat(4, minmax(220px, 1fr)) !important;
  }
}

@media (min-width: 1380px) {
  .kv-pricing-route main [class*="grid"][class*="gap"] {
    grid-template-columns: repeat(5, minmax(210px, 1fr)) !important;
  }
}

[role="dialog"] form,
[aria-modal="true"] form {
  min-height: 0;
}

[role="dialog"] textarea,
[aria-modal="true"] textarea {
  max-height: 42vh;
}

.fixed.inset-0 {
  overflow-y: auto;
  overscroll-behavior: contain;
}

.overflow-hidden {
  min-height: 0;
}

.overflow-y-auto,
.overflow-auto {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

[class*="grid"] > *,
[class*="flex"] > * {
  min-width: 0;
}

/* Subscription/pricing surfaces: keep all visible cards comparable on desktop. */
main a[href*="subscription"] ~ *,
main:has(a[href*="subscription"]) {
  min-width: 0;
}

main:has(button) [class*="grid"][class*="gap"] {
  align-items: stretch;
}

main:has(button) [class*="grid"][class*="gap"] > div {
  min-height: 100%;
}

@media (min-width: 1024px) {
  main:has(a[href*="subscription"], button) [class*="grid"][class*="gap"] {
    grid-auto-rows: 1fr;
  }
}

@media (max-width: 767px) {
  [role="dialog"],
  [aria-modal="true"] {
    width: calc(100vw - 24px) !important;
    max-height: calc(100vh - 24px) !important;
  }

  .fixed.inset-0 {
    padding: 12px !important;
    align-items: flex-start !important;
  }

  .kv-admin-route .fixed.inset-0 {
    padding: 8px !important;
  }

  .kv-admin-route .fixed.inset-0 > div {
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
  }

  button,
  input,
  select,
  textarea {
    font-size: 16px;
  }
}

@media print {
  body {
    background: #fff !important;
    color: #111 !important;
  }

  .fixed,
  [role="dialog"],
  [aria-modal="true"] {
    position: static !important;
  }
}
