/**
 * BSO Onboarding — mobil / dokunmatik (≤768px ve küçük telefonlar)
 * Modal, akış, sonuç, Sunucu Oluştur, launcher (nav mount).
 */

@media (max-width: 1024px) {
  .bso-onboarding-wp-root #bso-onboarding-modal .bso-modal-body {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
}

@media (max-width: 768px) {
  .bso-onboarding-scope button,
  .bso-onboarding-scope .bso-opt-card,
  .bso-onboarding-scope .kaart-secenek,
  .bso-onboarding-scope .bso-sb-line-card,
  .bso-onboarding-scope .bso-sb-pkg,
  .bso-onboarding-scope .bso-sb-os-card,
  .bso-onboarding-scope .bso-sb-bill-card {
    touch-action: manipulation;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal.modal {
    padding: max(6px, env(safe-area-inset-top, 0px)) max(6px, env(safe-area-inset-right, 0px))
      max(6px, env(safe-area-inset-bottom, 0px)) max(6px, env(safe-area-inset-left, 0px));
    align-items: stretch;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .modal-dialog {
    width: 100%;
    max-width: 100%;
    margin: 0;
    height: calc(100dvh - 12px);
    max-height: calc(100dvh - 12px);
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .modal-dialog.bso-onboarding-dialog--sb {
    height: calc(100dvh - 12px);
    max-height: calc(100dvh - 12px);
    display: flex;
    flex-direction: column;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .modal-dialog.bso-onboarding-dialog--sb .modal-content {
    height: 100%;
    flex: 1 1 auto;
    min-height: 0;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .modal-dialog.bso-onboarding-dialog--sb .bso-onb-stage,
  .bso-onboarding-wp-root #bso-onboarding-modal .modal-dialog.bso-onboarding-dialog--sb .bso-onb-wizard-shell {
    height: 100%;
    flex: 1 1 auto;
    min-height: 0;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .modal-dialog.bso-onboarding-dialog--sb .bso-modal-body {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .modal-content,
  .bso-onboarding-wp-root #bso-onboarding-modal .bso-modal-wrapper {
    border-radius: 14px;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .bso-modal-header {
    padding: 14px 16px 0 16px;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .bso-header-top {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 12px;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .bso-progress-container {
    align-items: flex-start;
    width: 100%;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .bso-progress-track {
    width: min(100%, 180px);
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .bso-header-content {
    margin-bottom: 14px;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .bso-main-title {
    font-size: 1.125rem;
    line-height: 1.35;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .bso-main-desc {
    font-size: 0.8125rem;
    line-height: 1.45;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .bso-modal-body {
    padding: 0 16px 16px 16px;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    overflow-x: hidden;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .bso-modal-footer {
    flex-direction: column-reverse;
    align-items: stretch;
    gap: 10px;
    padding: 12px 16px max(12px, env(safe-area-inset-bottom, 0px)) 16px;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .bso-footer-back,
  .bso-onboarding-wp-root #bso-onboarding-modal .bso-onboarding-back-btn,
  .bso-onboarding-wp-root #bso-onboarding-modal .bso-footer-close {
    width: 100%;
    justify-content: center;
    min-height: var(--bso-touch-min, 44px);
  }

  .bso-onboarding-scope .bso-bento-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .bso-onboarding-scope .bso-q {
    font-size: 1.0625rem;
    line-height: 1.35;
    margin-bottom: 10px;
  }

  .bso-onboarding-scope .bso-info {
    padding: 12px 14px;
    font-size: 0.875rem;
    margin-bottom: 14px;
  }

  .bso-onboarding-scope .bso-options--flow-cards {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .bso-onboarding-scope .bso-opt-card {
    min-height: var(--bso-touch-min, 44px);
    padding: 14px 16px;
  }

  .bso-onboarding-scope .kaart-secenek {
    min-height: var(--bso-touch-min, 44px);
    padding: 16px;
  }

  .bso-onboarding-scope .bso-onb-intro {
    padding: 24px 20px;
  }

  .bso-onboarding-scope .bso-onb-intro__title {
    font-size: 1.125rem;
    max-width: none;
  }

  .bso-onboarding-scope .bso-onb-intro__desc {
    font-size: 0.8125rem;
    max-width: none;
  }

  .bso-onboarding-scope .bso-thinking-card {
    padding: 22px 18px 20px;
    max-width: none;
  }

  .bso-onboarding-scope .bso-result-pick-card {
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    padding: 18px 16px;
    gap: 16px;
  }

  .bso-onboarding-scope .bso-result-pick-card__ico {
    width: 56px;
    min-width: 56px;
    height: 56px;
    min-height: 56px;
    font-size: 28px;
  }

  .bso-onboarding-scope .bso-result-pick-card__title {
    font-size: 1.125rem;
  }

  .bso-onboarding-scope .bso-result-hosting-card__row {
    flex-wrap: wrap;
    padding: 14px 16px;
    gap: 12px;
  }

  .bso-onboarding-scope .bso-result-hosting-card__title {
    font-size: 1rem;
  }

  .bso-onboarding-scope .bso-result-hosting-card__footer {
    padding: 12px 16px;
    text-align: left;
    font-size: 0.8125rem;
  }

  .bso-onboarding-scope .bso-checkout-card {
    padding: 0;
    margin-top: 24px;
  }

  .bso-onboarding-scope .bso-btn-checkout {
    width: 100%;
    box-sizing: border-box;
    padding: 14px 20px;
    font-size: 0.9375rem;
  }

  .bso-onboarding-scope .bso-suggest-row {
    flex-direction: column;
    align-items: stretch;
    padding: 14px 16px;
    gap: 12px;
  }

  .bso-onboarding-scope .bso-suggest-row__actions {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .bso-onboarding-scope .bso-suggest-row__price-tag {
    text-align: left;
  }

  .bso-onboarding-scope .bso-suggest-row__cta .bso-btn-checkout {
    width: 100%;
  }

  .bso-onboarding-scope .bso-sb-pkg-grid {
    grid-template-columns: 1fr;
  }

  .bso-onboarding-scope .bso-sb-bill-cards {
    flex-direction: column;
  }

  .bso-onboarding-scope .bso-sb-bill-card {
    min-width: 0;
    width: 100%;
  }

  .bso-onboarding-scope .bso-sb-os-card {
    flex: 1 1 calc(50% - 6px);
    min-width: calc(50% - 6px);
    box-sizing: border-box;
  }

  .bso-onboarding-scope .bso-sb-os-cards {
    gap: 10px;
  }

  .bso-onboarding-scope .bso-sb-slider__input {
    min-height: 28px;
  }

  .bso-onboarding-scope .bso-onb-os-go {
    width: 100%;
    box-sizing: border-box;
    min-height: var(--bso-touch-min, 44px);
  }

  .bso-onboarding-scope #bso-sb-cta .bso-btn-checkout {
    min-height: var(--bso-touch-min, 44px);
  }

  #bso-onboarding-launcher-mount .bso-fab-pill__shell,
  .bso-onboarding-launcher--in-nav .bso-fab-pill__shell {
    min-height: var(--bso-touch-min, 44px);
    padding: 8px 12px 8px 8px;
    border-radius: 6px;
  }

  #bso-onboarding-launcher-mount .bso-onboarding-launcher.bso-fab-pill.bso-onboarding-scope,
  .bso-onboarding-launcher.bso-fab-pill.bso-onboarding-launcher--in-nav.bso-onboarding-scope {
    width: 100%;
    padding: 0;
  }

  .bs-mobile-cta #bso-onboarding-launcher-mount .bso-onboarding-launcher.bso-fab-pill.bso-onboarding-scope {
    width: 100%;
    max-width: none;
    padding: 0;
    margin: 0;
    justify-content: stretch;
    min-height: 0;
    font-size: inherit;
  }

  .bso-onboarding-launcher.bso-fab-pill.bso-onboarding-scope:not(.bso-onboarding-launcher--in-nav) {
    bottom: max(16px, env(safe-area-inset-bottom, 0px));
    left: max(16px, env(safe-area-inset-left, 0px));
    max-width: calc(100vw - 32px);
  }
}

@media (max-width: 380px) {
  .bso-onboarding-scope .bso-sb-os-card {
    flex: 1 1 100%;
    min-width: 100%;
  }

  .bso-onboarding-scope .bso-fab-pill__kicker,
  .bso-onboarding-scope .bso-onboarding-launcher__kicker {
    font-size: 9px;
  }

  .bso-onboarding-scope .bso-fab-pill__label,
  .bso-onboarding-scope .bso-onboarding-launcher__title {
    font-size: 13px;
  }

  .bso-onboarding-wp-root #bso-onboarding-modal .bso-brand-eyebrow {
    font-size: 10px;
  }
}

@media (max-width: 768px) and (pointer: coarse) {
  .bso-onboarding-scope .bso-opt-card:hover:not(:disabled),
  .bso-onboarding-scope .kaart-secenek:hover,
  .bso-onboarding-scope .bso-suggest-row:hover {
    box-shadow: none;
  }

  .bso-onboarding-scope .bso-opt-card:active:not(:disabled) {
    border-color: #10b981;
    background: #f0fdf4;
  }
}