/* Shared mobile-first usability layer. Desktop styles stay in app.css. */
.wizard-current-step {
  display: none;
}

main,
main > *,
main .card,
main [class*="card"],
main form,
main fieldset,
main dl,
main dt,
main dd {
  min-width: 0;
}

main h1,
main h2,
main h3,
main [role="alert"],
main dt,
main dd,
.mobile-dynamic-copy,
.mobile-package-copy,
.mobile-footer-link,
.mobile-inline-action {
  overflow-wrap: anywhere;
  word-break: normal;
}

main p,
main li {
  overflow-wrap: break-word;
  word-break: normal;
}

main summary {
  overflow-wrap: anywhere;
  word-break: normal;
}

.btn-primary,
.btn-secondary,
.btn-ghost,
.btn-sm,
.btn-lg {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
}

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

.mobile-footer-link,
.mobile-inline-action {
  max-width: 100%;
}

.mobile-long-title {
  line-height: 1.15;
}

.mobile-section-title {
  line-height: 1.22;
}

.mobile-success-page:has(#order-status[data-order-status="generation_failed"])
  .order-followup-content {
  display: none;
}

.mobile-footer-link {
  min-width: 44px;
}

.tippy-box[data-theme~="dogovor"] {
  max-width: min(350px, calc(100vw - 24px)) !important;
  overflow-wrap: anywhere;
}

@media (min-width: 1024px) {
  .mobile-footer-grid {
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
  }
}

@media (max-width: 1023px) {
  main h1 {
    line-height: 1.15;
  }

  main h2,
  main h3 {
    line-height: 1.22;
  }

  main .text-\[14px\],
  main .text-\[13\.5px\],
  main .text-\[13px\],
  main .text-\[12\.5px\],
  main .text-\[12px\],
  main .text-\[11\.5px\],
  main .text-\[11px\],
  main .text-\[10px\],
  main .text-\[9px\],
  .mobile-footer .text-\[13px\],
  .mobile-footer .text-sm,
  .eyebrow,
  .chip,
  .chip-neutral {
    font-size: 14px;
  }

  .btn-primary,
  .btn-secondary,
  .btn-ghost,
  .input {
    min-height: 44px;
  }

  .btn-sm {
    min-height: 44px;
  }

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

  .mobile-header-logo {
    min-height: 44px;
  }

  .mobile-menu-toggle {
    width: 44px;
    height: 44px;
  }

  .mobile-nav-link,
  .mobile-footer-link {
    display: flex;
    align-items: center;
    min-height: 44px;
  }

  .mobile-inline-action {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  .mobile-nav-link {
    min-height: 48px;
    font-size: 16px;
  }

  .wizard-tip {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
  }

  .catalog-search__help,
  .catalog-breadcrumbs ol,
  .catalog-category-hero__count,
  .catalog-category-heading > span,
  .catalog-category-search__status {
    font-size: 14px;
  }

  .catalog-popular__links a {
    min-height: 44px;
    font-size: 14px;
  }

  .catalog-all__list a {
    min-height: 44px;
    font-size: 14px;
  }

  .catalog-all__list small {
    font-size: 14px;
  }

  .catalog-breadcrumbs a,
  .mobile-breadcrumbs a,
  .mobile-wizard-back {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  .mobile-breadcrumbs {
    flex-wrap: wrap;
    gap: 0.25rem 0.5rem;
  }

  .mobile-footer a.group {
    min-height: 44px;
  }

  .mobile-consent-control {
    display: flex;
    align-items: flex-start;
    min-height: 44px;
    padding-block: 0.375rem;
  }
}

@media (max-width: 767px) {
  html {
    scroll-padding-top: 5rem;
  }

  body {
    font-size: 16px;
  }

  main h1,
  main h2,
  main h3 {
    overflow-wrap: anywhere;
    text-wrap: balance;
  }

  main h1 {
    line-height: 1.15;
  }

  main h2,
  main h3 {
    line-height: 1.22;
  }

  main p,
  main li {
    max-width: 70ch;
  }

  main .text-\[15px\],
  main .prose-legal,
  .mobile-nav-link {
    font-size: 16px;
  }

  main .text-\[14px\],
  main .text-\[13\.5px\],
  main .text-\[13px\],
  main .text-\[12\.5px\],
  main .text-\[12px\],
  main .text-\[11\.5px\],
  main .text-\[11px\],
  main .text-\[10px\],
  main .text-\[9px\],
  .mobile-footer .text-\[13px\],
  .mobile-footer .text-sm,
  .eyebrow,
  .chip,
  .chip-neutral {
    font-size: 14px;
  }

  .btn-primary,
  .btn-secondary,
  .btn-ghost,
  .input {
    min-height: 44px;
    font-size: 16px;
  }

  .btn-sm {
    min-height: 44px;
    font-size: 14px;
  }

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

  textarea.input {
    min-height: 7rem;
  }

  .mobile-header-logo {
    min-height: 44px;
  }

  .mobile-menu-toggle {
    width: 44px;
    height: 44px;
  }

  .mobile-nav-link {
    display: flex;
    align-items: center;
    min-height: 48px;
  }

  .mobile-footer {
    margin-top: 4rem;
  }

  .mobile-footer .max-w-7xl {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  .mobile-footer .grid {
    gap: 1.5rem;
  }

  .mobile-footer ul {
    margin-top: 0.5rem;
  }

  .mobile-footer-link {
    display: flex;
    align-items: center;
    min-height: 44px;
    margin-block: -0.25rem;
  }

  .mobile-footer a.group {
    min-height: 44px;
  }

  .mobile-inline-action {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  main nav[aria-label="Хлебные крошки"] a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  .catalog-search__help,
  .catalog-breadcrumbs ol,
  .catalog-category-hero__count,
  .catalog-category-heading > span,
  .catalog-category-search__status {
    font-size: 14px;
  }

  .mobile-wizard-page {
    padding-top: 2rem;
    padding-bottom: 0;
  }

  .mobile-wizard-back {
    min-height: 44px;
  }

  .mobile-wizard-page[x-cloak] {
    display: block !important;
    visibility: hidden;
  }

  .mobile-wizard-page[x-cloak] form section:not(:first-of-type) {
    display: none;
  }

  .mobile-wizard-page > div {
    gap: 2rem;
  }

  .mobile-wizard-page .wizard-step-card {
    padding: 1.125rem;
  }

  .mobile-wizard-page .wizard-form {
    padding-bottom: calc(6rem + env(safe-area-inset-bottom));
  }

  .wizard-step-list {
    display: none;
  }

  .wizard-current-step {
    display: block;
    font-size: 14px;
  }

  .wizard-tip {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    margin-block: -12px;
    margin-inline: 0;
  }

  .wizard-field-heading {
    min-width: 0;
    align-items: flex-start;
  }

  .wizard-field-heading .label {
    min-width: 0;
    padding-top: 0.65rem;
    overflow-wrap: break-word;
  }

  .wizard-step-card label.relative {
    min-height: 52px;
    font-size: 16px;
  }

  [data-benefit-tile] {
    align-items: flex-start;
    flex-direction: column;
  }

  .wizard-step-card .space-y-6 > :not([hidden]) ~ :not([hidden]) {
    margin-top: 1.375rem;
  }

  .wizard-actions {
    position: sticky;
    z-index: 30;
    bottom: 0;
    margin-inline: 0;
    padding: 0.75rem 0 calc(0.75rem + env(safe-area-inset-bottom));
    border-top: 1px solid #eaecf0;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 -10px 24px rgba(16, 24, 40, 0.08);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
  }

  .wizard-actions > button,
  .wizard-actions > div {
    flex: 1;
  }

  .wizard-actions button {
    width: 100%;
    min-height: 52px;
  }

  .wizard-summary {
    display: none;
  }

  .mobile-consent-control {
    min-height: 52px;
    padding-block: 0.375rem;
    font-size: 14px;
  }

  .mobile-consent-control input {
    width: 20px;
    height: 20px;
  }

  .mobile-package-form {
    padding-bottom: calc(6.75rem + env(safe-area-inset-bottom));
  }

  .mobile-package-card {
    min-height: 0;
    padding: 1.25rem;
  }

  .mobile-package-actions {
    position: fixed;
    z-index: 35;
    right: 0;
    bottom: 0;
    left: 0;
    max-width: none;
    margin: 0;
    padding: 0.75rem 1.25rem calc(0.75rem + env(safe-area-inset-bottom));
    border-top: 1px solid #eaecf0;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 -10px 24px rgba(16, 24, 40, 0.1);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
  }

  .mobile-package-actions p {
    display: none;
  }

  .mobile-success-page {
    padding-top: 2.5rem;
    padding-bottom: 3rem;
  }

  .mobile-success-page dl > div {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.25rem;
  }

  .mobile-success-page dd {
    text-align: left;
  }

  .mobile-preview-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.625rem;
  }

  .mobile-preview-heading > * {
    min-width: 0;
  }

  .mobile-disclosure-summary {
    flex-wrap: wrap;
    align-items: center;
    row-gap: 0.5rem;
  }

  .mobile-disclosure-summary > span {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .mobile-summary-list > div {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.25rem;
  }

  .mobile-summary-list dt,
  .mobile-summary-list dd {
    width: 100%;
    flex: none;
    text-align: left;
  }

  .mobile-package-card > span:first-of-type > span:first-of-type {
    min-width: 0;
  }

  #order-status > div {
    padding: 1.5rem;
  }

  :focus-visible {
    scroll-margin-bottom: calc(7rem + env(safe-area-inset-bottom));
  }
}