/* Responsive base for Aya design system surfaces */
.aya-root {
  box-sizing: border-box;
  color: var(--aya-body);
  font-family: var(--aya-font-app);
  font-size: var(--aya-text-body-app);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

.aya-root *,
.aya-root *::before,
.aya-root *::after {
  box-sizing: border-box;
}

.aya-root--marketing {
  font-family: var(--aya-font-marketing-body);
  font-size: var(--aya-text-body-marketing);
}

.aya-tabular {
  font-variant-numeric: tabular-nums;
}

.aya-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 767px) {
  .aya-side-panel {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 0 !important;
  }

  .aya-modal__dialog {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 100vh;
    margin: 0 !important;
    border-radius: 0 !important;
  }

  .aya-btn--block-sm {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 1023px) {
  .aya-app-layout__sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 1040;
    transform: translateX(-100%);
    transition: transform 0.2s ease;
  }

  .aya-app-layout.is-sidebar-open .aya-app-layout__sidebar {
    transform: translateX(0);
  }

  .aya-app-layout__backdrop {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1035;
    background: rgba(15, 42, 42, 0.45);
  }

  .aya-app-layout.is-sidebar-open .aya-app-layout__backdrop {
    display: block;
  }
}
