/* ============================================================
     ÖDEME — sakin, minimal, premium tek-sayfa checkout
     Sade. Bol boşluk. Numara rozeti / scroll panel / sticky bar YOK.
  ============================================================ */

 /* ── Sayfa başlığı (mini, sakin) ── */
 .co-head {
     position: relative;
     overflow: hidden;
     background: var(--bb-grad-hero);
     color: var(--bb-on-dark)
 }

 .co-head::before {
     content: "";
     position: absolute;
     width: 480px;
     height: 480px;
     border-radius: 50%;
     background: radial-gradient(circle, rgba(63, 180, 180, .14), transparent 70%);
     top: -260px;
     right: -120px;
     filter: blur(20px);
     pointer-events: none
 }

 .co-head__inner {
     position: relative;
     max-width: var(--bb-container);
     margin-inline: auto;
     padding: clamp(28px, 5vh, 52px) var(--bb-pad-x) clamp(24px, 4vh, 40px)
 }

 .co-head__eyebrow {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     font-size: var(--bb-text-xs);
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: var(--bb-ls-label);
     color: var(--bb-gold-300)
 }

 .co-head h1 {
     font-family: var(--bb-font-display);
     font-weight: var(--bb-fw-display);
     font-size: clamp(30px, 4.4vw, 52px);
     line-height: var(--bb-lh-tight);
     letter-spacing: var(--bb-ls-display);
     margin: var(--bb-3) 0 var(--bb-3)
 }

 .co-head h1 .teal {
     color: var(--bb-teal-300)
 }

 .co-head__sub {
     font-size: var(--bb-text-l);
     color: var(--bb-on-dark-dim);
     max-width: 48ch
 }

 /* ── Gövde: iki kolon (airy) ── */
 .co-wrap {
     padding-block: clamp(40px, 6vh, 72px)
 }

 .co-grid {
     display: grid;
     grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
     gap: clamp(28px, 4vw, 64px);
     align-items: start
 }

 .co-main {
     min-width: 0;
     display: flex;
     flex-direction: column;
     gap: clamp(36px, 5vh, 56px)
 }

 /* ── Bölüm (numarasız, temiz başlık) ── */
 .co-sec {
     min-width: 0
 }

 .co-sec__lbl {
     display: block;
     font-size: var(--bb-text-xs);
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: var(--bb-ls-label);
     color: var(--bb-teal-700)
 }

 .co-sec__title {
     font-family: var(--bb-font-display);
     font-size: var(--bb-display-s);
     letter-spacing: .01em;
     color: var(--bb-cacao-700);
     line-height: var(--bb-lh-tight);
     margin: 6px 0 4px
 }

 .co-sec__desc {
     font-size: var(--bb-text-s);
     color: var(--bb-on-light-dim);
     line-height: var(--bb-lh-snug);
     max-width: 54ch;
     margin-bottom: var(--bb-5)
 }

 .co-opt {
     display: inline-block;
     vertical-align: middle;
     margin-left: 8px;
     font-family: var(--bb-font-body);
     font-size: 11px;
     font-weight: 800;
     letter-spacing: .02em;
     text-transform: none;
     color: var(--bb-teal-700);
     background: rgba(63, 180, 180, .10);
     border: 1px solid var(--bb-border);
     border-radius: var(--bb-r-pill);
     padding: 2px 10px
 }

 .co-req {
     display: inline-block;
     vertical-align: middle;
     margin-left: 8px;
     font-family: var(--bb-font-body);
     font-size: 11px;
     font-weight: 800;
     letter-spacing: .02em;
     text-transform: none;
     color: #8a2f28;
     background: rgba(160, 50, 40, .1);
     border: 1px solid rgba(160, 50, 40, .28);
     border-radius: var(--bb-r-pill);
     padding: 2px 10px
 }

 /* ── Form alanları ── */
 .co-fields {
     display: grid;
     grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
     gap: 0 var(--bb-5)
 }

 .co-fields .full {
     grid-column: 1 / -1
 }

 .co-fields .bb-field {
     margin-bottom: var(--bb-5)
 }

 .odm-field-err {
     font-size: var(--bb-text-xs);
     font-weight: 700;
     color: var(--bb-error);
     margin-top: -16px;
     margin-bottom: var(--bb-5);
     display: none
 }

 .bb-input.is-error {
     border-color: var(--bb-error);
     box-shadow: 0 0 0 4px rgba(192, 57, 43, .14)
 }

 textarea.bb-input {
     resize: vertical;
     min-height: 92px;
     font-family: var(--bb-font-body)
 }

 .co-optional {
     text-transform: none;
     font-weight: 600;
     color: var(--bb-ink-300)
 }

 /* ── Ödeme yöntemi — sade segment kartlar ── */
 .odm-pay {
     display: grid;
     grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
     gap: var(--bb-3)
 }

 .odm-pay__opt {
     position: relative;
     display: flex;
     flex-direction: column;
     gap: 6px;
     cursor: pointer;
     border: 1.5px solid var(--bb-border);
     border-radius: var(--bb-r-lg);
     padding: var(--bb-5) var(--bb-5) var(--bb-4);
     background: var(--bb-surface-raised);
     transition: border-color var(--bb-dur-fast) var(--bb-ease-standard), box-shadow var(--bb-dur-base) var(--bb-ease-standard)
 }

 .odm-pay__opt:hover {
     border-color: var(--bb-border-gold)
 }

 .odm-pay__opt input {
     position: absolute;
     opacity: 0;
     pointer-events: none
 }

 .odm-pay__top {
     display: flex;
     align-items: center;
     gap: 11px
 }

 .odm-pay__ic {
     width: 40px;
     height: 40px;
     flex: none;
     border-radius: var(--bb-r-md);
     display: grid;
     place-items: center;
     font-size: 20px;
     background: var(--bb-grad-ivory);
     box-shadow: var(--bb-e1);
     transition: background var(--bb-dur-base) var(--bb-ease-standard), color var(--bb-dur-base) var(--bb-ease-standard)
 }

 .odm-pay__opt b {
     font-family: var(--bb-font-display);
     font-size: var(--bb-text-l);
     letter-spacing: .02em;
     color: var(--bb-cacao-700);
     line-height: 1
 }

 .odm-pay__opt small {
     display: block;
     font-size: 11px;
     color: var(--bb-on-light-dim);
     font-weight: 700;
     margin-top: 3px
 }

 .odm-pay__desc {
     font-size: var(--bb-text-xs);
     color: var(--bb-on-light-dim);
     line-height: var(--bb-lh-snug)
 }

 .odm-pay__check {
     position: absolute;
     top: 13px;
     right: 13px;
     width: 22px;
     height: 22px;
     border-radius: var(--bb-r-pill);
     border: 2px solid var(--bb-border);
     display: grid;
     place-items: center;
     color: #fff;
     font-size: 12px;
     background: transparent;
     transition: background var(--bb-dur-fast), border-color var(--bb-dur-fast), transform var(--bb-dur-base) var(--bb-ease-emphasized)
 }

 .odm-pay__opt.sel {
     border-color: var(--bb-teal-500);
     box-shadow: 0 0 0 3px rgba(63, 180, 180, .14)
 }

 .odm-pay__opt.sel .odm-pay__check {
     background: var(--bb-teal-500);
     border-color: var(--bb-teal-500);
     transform: scale(1.04)
 }

 .odm-pay__opt.sel .odm-pay__ic {
     background: var(--bb-grad-teal);
     color: #fff
 }

 .odm-pay__save {
     display: inline-flex;
     align-items: center;
     align-self: flex-start;
     gap: 5px;
     margin-top: 2px;
     background: rgba(201, 162, 75, .16);
     color: var(--bb-gold-700);
     font-size: 11px;
     font-weight: 900;
     padding: 3px 10px;
     border-radius: var(--bb-r-pill);
     letter-spacing: .02em
 }

 /* ── Ödeme detayı (havale / kripto) ── */
 .odm-detail {
     margin-top: var(--bb-5);
     display: none
 }

 .odm-detail.show {
     display: block;
     animation: bb-modal-in var(--bb-dur-base) var(--bb-ease-standard)
 }

 .odm-detail__note {
     display: flex;
     gap: 10px;
     align-items: flex-start;
     background: var(--bb-surface-2);
     border-radius: var(--bb-r-md);
     padding: 12px 15px;
     font-size: var(--bb-text-xs);
     color: var(--bb-ink-700);
     line-height: var(--bb-lh-snug);
     margin-bottom: var(--bb-4)
 }

 .odm-detail__note .ic {
     color: var(--bb-teal-600);
     font-size: 15px;
     flex: none;
     line-height: 1.3
 }

 /* Kopyalanabilir kutu (IBAN / cüzdan) — sade açık kart */
 .odm-copy {
     display: flex;
     flex-direction: column;
     gap: var(--bb-3);
     overflow: hidden;
     background: var(--bb-surface-raised);
     border: 1px solid var(--bb-border);
     border-radius: var(--bb-r-lg);
     padding: 16px 18px;
     margin-bottom: var(--bb-3);
     box-shadow: var(--bb-e1)
 }

 .odm-copy__head {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: var(--bb-3)
 }

 .odm-copy__ic {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     font-family: var(--bb-font-display);
     font-size: 15px;
     letter-spacing: .03em;
     color: var(--bb-cacao-700)
 }

 .odm-copy__net {
     font-size: 11px;
     font-weight: 900;
     letter-spacing: .06em;
     text-transform: uppercase;
     color: var(--bb-teal-700);
     background: rgba(63, 180, 180, .10);
     border: 1px solid var(--bb-border);
     padding: 3px 10px;
     border-radius: var(--bb-r-pill)
 }

 .odm-copy__body {
     min-width: 0
 }

 .odm-copy__lbl {
     font-size: 11px;
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: .08em;
     color: var(--bb-ink-500)
 }

 .odm-copy__val {
     font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
     font-weight: 700;
     font-size: var(--bb-text-m);
     color: var(--bb-cacao-700);
     word-break: break-all;
     line-height: 1.45;
     margin-top: 4px
 }

 .odm-copy__btn {
     flex: none;
     min-height: 44px;
     width: 100%;
     display: inline-flex;
     align-items: center;
     justify-content: center
 }

 /* ── Dekont (makbuz) yükleme — sade ── */
 .odm-dropz {
     position: relative;
     display: flex;
     flex-direction: column;
     align-items: center;
     gap: 6px;
     text-align: center;
     border: 1.5px dashed var(--bb-border-gold);
     border-radius: var(--bb-r-lg);
     padding: var(--bb-6) var(--bb-5);
     background: var(--bb-surface-2);
     cursor: pointer;
     transition: border-color var(--bb-dur-fast) var(--bb-ease-standard), background var(--bb-dur-fast) var(--bb-ease-standard)
 }

 .odm-dropz:hover {
     border-color: var(--bb-teal-500);
     background: var(--bb-surface-raised)
 }

 .odm-dropz.drag {
     border-color: var(--bb-teal-500);
     background: rgba(63, 180, 180, .08)
 }

 .odm-dropz.is-error {
     border-color: rgba(160, 50, 40, .55);
     background: rgba(160, 50, 40, .06);
     box-shadow: 0 0 0 3px rgba(160, 50, 40, .12)
 }

 .odm-dropz input[type=file] {
     position: absolute;
     inset: 0;
     opacity: 0;
     cursor: pointer
 }

 .odm-dropz__ic {
     font-size: 30px;
     line-height: 1
 }

 .odm-dropz__t {
     font-family: var(--bb-font-display);
     font-size: var(--bb-text-l);
     letter-spacing: .02em;
     color: var(--bb-cacao-700)
 }

 .odm-dropz__s {
     font-size: var(--bb-text-xs);
     color: var(--bb-on-light-dim);
     line-height: var(--bb-lh-snug);
     max-width: 38ch
 }

 .odm-dekont-prev {
     display: none;
     align-items: center;
     gap: var(--bb-4);
     margin-top: var(--bb-4);
     padding: var(--bb-4);
     border: 1px solid var(--bb-border);
     border-radius: var(--bb-r-md);
     background: var(--bb-surface-raised)
 }

 .odm-dekont-prev.show {
     display: flex
 }

 .odm-dekont-prev__media {
     width: 52px;
     height: 52px;
     flex: none;
     border-radius: var(--bb-r-sm);
     overflow: hidden;
     background: var(--bb-grad-ivory);
     display: grid;
     place-items: center
 }

 .odm-dekont-prev__media img {
     width: 100%;
     height: 100%;
     object-fit: cover
 }

 .odm-dekont-prev__media .pdf {
     font-family: var(--bb-font-display);
     font-size: 16px;
     color: var(--bb-cacao-700)
 }

 .odm-dekont-prev__info {
     min-width: 0;
     flex: 1
 }

 .odm-dekont-prev__info b {
     display: block;
     font-size: var(--bb-text-s);
     color: var(--bb-cacao-700);
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis
 }

 .odm-dekont-prev__info span {
     font-size: var(--bb-text-xs);
     color: var(--bb-on-light-dim)
 }

 .odm-dekont-prev__rm {
     flex: none
 }

 .odm-dekont-hint {
     font-size: var(--bb-text-xs);
     color: var(--bb-on-light-dim);
     line-height: var(--bb-lh-snug);
     margin-top: var(--bb-3)
 }

 .odm-dekont-hint b {
     color: var(--bb-cacao-700)
 }

 /* ── Spinner ara-ekran ── */
 .odm-spinner {
     display: none;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     gap: var(--bb-4);
     text-align: center;
     padding: var(--bb-8) var(--bb-4)
 }

 .odm-spinner.show {
     display: flex
 }

 .odm-spinner__ring {
     width: 60px;
     height: 60px;
     border-radius: 50%;
     border: 4px solid rgba(63, 180, 180, .18);
     border-top-color: var(--bb-teal-500);
     animation: odm-spin .9s linear infinite
 }

 .odm-spinner h2 {
     font-family: var(--bb-font-display);
     font-size: var(--bb-display-s);
     letter-spacing: .02em;
     color: var(--bb-cacao-700)
 }

 .odm-spinner p {
     font-size: var(--bb-text-m);
     color: var(--bb-on-light-dim);
     max-width: 36ch
 }

 @keyframes odm-spin {
     to {
         transform: rotate(360deg)
     }
 }

 @media (prefers-reduced-motion:reduce) {
     .odm-spinner__ring {
         animation-duration: 1.8s
     }
 }

 /* Spinner aktifken yalnız o görünür (form bölümleri gizlenir) */
 #odmFormCol.busy .co-sec {
     display: none
 }

 /* ── Sağ: sipariş özeti (sabit-yükseklik DEĞİL, scroll YOK) ── */
 .co-summary {
     position: relative;
     background: var(--bb-surface-raised);
     border: 1px solid var(--bb-border);
     border-radius: var(--bb-r-xl);
     padding: clamp(20px, 2.4vw, 28px);
     box-shadow: var(--bb-e1)
 }

 .co-summary__top {
     display: flex;
     align-items: baseline;
     justify-content: space-between;
     gap: var(--bb-3);
     margin-bottom: var(--bb-4);
     padding-bottom: var(--bb-4);
     border-bottom: 1px solid var(--bb-border)
 }

 .co-summary__top h2 {
     font-family: var(--bb-font-display);
     font-size: var(--bb-text-xl);
     letter-spacing: .02em;
     color: var(--bb-cacao-700)
 }

 .co-summary__count {
     font-size: var(--bb-text-xs);
     font-weight: 700;
     color: var(--bb-on-light-dim)
 }

 /* Kalem listesi — içerikle büyür, scroll/clip YOK */
 .odm-mini {
     display: flex;
     flex-direction: column;
     gap: var(--bb-4);
     margin-bottom: var(--bb-5)
 }

 .odm-mini-line {
     display: grid;
     grid-template-columns: 44px minmax(0, 1fr) auto;
     gap: var(--bb-3);
     align-items: center
 }

 .odm-mini-line__media {
     width: 44px;
     height: 44px;
     border-radius: var(--bb-r-sm);
     background: var(--bb-grad-ivory);
     display: grid;
     place-items: center;
     overflow: hidden;
     position: relative
 }

 .odm-mini-line__media img {
     width: 84%;
     height: 84%;
     object-fit: contain;
     filter: drop-shadow(0 4px 7px rgba(46, 20, 6, .18))
 }

 .odm-mini-line__media .qb {
     position: absolute;
     top: -6px;
     right: -6px;
     min-width: 18px;
     height: 18px;
     padding: 0 5px;
     border-radius: var(--bb-r-pill);
     background: var(--bb-cacao-700);
     color: #fff;
     font-size: 10px;
     font-weight: 900;
     display: grid;
     place-items: center
 }

 .odm-mini-line__info {
     min-width: 0
 }

 .odm-mini-line__info b {
     display: block;
     font-size: var(--bb-text-s);
     color: var(--bb-cacao-700);
     font-weight: 700;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis
 }

 .odm-mini-line__info span {
     font-size: var(--bb-text-xs);
     color: var(--bb-on-light-dim)
 }

 .odm-mini-line__price {
     font-weight: 800;
     font-size: var(--bb-text-s);
     color: var(--bb-cacao-700);
     text-align: right;
     white-space: nowrap
 }

 .odm-row {
     display: flex;
     justify-content: space-between;
     align-items: baseline;
     gap: var(--bb-3);
     padding: var(--bb-2) 0;
     font-size: var(--bb-text-s);
     color: var(--bb-ink-700)
 }

 .odm-row span:last-child {
     font-weight: 800;
     color: var(--bb-cacao-700)
 }

 .odm-row--free span:last-child {
     color: var(--bb-success)
 }

 .odm-row--save {
     color: var(--bb-success)
 }

 .odm-row--save span:last-child {
     color: var(--bb-success)
 }

 .odm-row.odm-total {
     border-top: 1px solid var(--bb-border);
     margin-top: var(--bb-3);
     padding: var(--bb-4) 0 0
 }

 .odm-row.odm-total .lbl {
     font-weight: 800;
     font-size: var(--bb-text-m);
     color: var(--bb-cacao-700)
 }

 .odm-row.odm-total .val {
     font-family: var(--bb-font-display);
     font-size: var(--bb-display-s);
     color: var(--bb-cacao-700);
     line-height: 1
 }

 /* Kupon — sade satır */
 .odm-kupon {
     margin-top: var(--bb-4);
     padding-top: var(--bb-4);
     border-top: 1px dashed var(--bb-border)
 }

 .odm-kupon__lbl {
     display: block;
     font-size: 11px;
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: .06em;
     color: var(--bb-ink-500);
     margin-bottom: 8px
 }

 .odm-kupon__row {
     display: flex;
     gap: var(--bb-2)
 }

 .odm-kupon__row .bb-input {
     flex: 1;
     min-width: 0;
     text-transform: uppercase;
     padding: 11px 14px
 }

 .odm-kupon__row .bb-btn {
     flex: none
 }

 .odm-kupon__hint {
     font-size: var(--bb-text-xs);
     color: var(--bb-on-light-dim);
     margin-top: 8px;
     line-height: var(--bb-lh-snug)
 }

 .odm-kupon__hint b {
     color: var(--bb-cacao-700)
 }

 .odm-kupon__hint.ok {
     color: var(--bb-success)
 }

 .odm-kupon__hint.ok b {
     color: var(--bb-success)
 }

 .odm-kupon__hint.no {
     color: var(--bb-error)
 }

 .odm-kupon__hint.no b {
     color: var(--bb-error)
 }

 /* Onaylar */
 .odm-onay {
     display: grid;
     gap: var(--bb-3);
     margin: var(--bb-5) 0 var(--bb-4)
 }

 .odm-onay label {
     display: flex;
     gap: 10px;
     align-items: flex-start;
     font-size: var(--bb-text-xs);
     color: var(--bb-on-light-dim);
     line-height: var(--bb-lh-snug);
     cursor: pointer
 }

 .odm-onay input[type=checkbox] {
     margin-top: 2px;
     flex: 0 0 auto;
     width: 16px;
     height: 16px;
     accent-color: var(--bb-teal-600)
 }

 .odm-onay a {
     color: var(--bb-teal-700);
     font-weight: 700
 }

 /* Son CTA — özetin doğal sonunda (sticky bar YOK) */
 .co-summary__cta .bb-btn {
     min-height: 54px
 }

 .odm-secure {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 7px;
     margin-top: var(--bb-3);
     font-size: var(--bb-text-xs);
     color: var(--bb-on-light-dim);
     font-weight: 700
 }

 .odm-secure .ic {
     color: var(--bb-teal-600)
 }

 .odm-back {
     display: block;
     text-align: center;
     margin-top: var(--bb-4);
     font-size: var(--bb-text-s);
     font-weight: 700;
     color: var(--bb-cacao-600)
 }

 .odm-back:hover {
     color: var(--bb-teal-700)
 }

 /* ── Tek satır güven (tek kalan trust öğesi) ── */
 .co-trust {
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     gap: var(--bb-3) var(--bb-6);
     margin-top: clamp(40px, 6vh, 72px);
     padding-top: var(--bb-6);
     border-top: 1px solid var(--bb-border)
 }

 .co-trust span {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     font-size: var(--bb-text-s);
     font-weight: 700;
     color: var(--bb-on-light-dim)
 }

 .co-trust span .ic {
     color: var(--bb-teal-600)
 }

 /* ── Boş durum ── */
 .odm-empty {
     text-align: center;
     max-width: 480px;
     margin-inline: auto;
     padding: var(--bb-7) var(--bb-4)
 }

 .odm-empty .em {
     width: 96px;
     height: 96px;
     border-radius: var(--bb-r-pill);
     margin: 0 auto var(--bb-5);
     display: grid;
     place-items: center;
     font-size: 46px;
     background: var(--bb-grad-ivory);
     box-shadow: var(--bb-e1);
     border: 1px solid var(--bb-border-gold)
 }

 .odm-empty h2 {
     font-family: var(--bb-font-display);
     font-size: var(--bb-display-s);
     color: var(--bb-cacao-700);
     letter-spacing: .02em;
     margin-bottom: var(--bb-3)
 }

 .odm-empty p {
     color: var(--bb-on-light-dim);
     font-size: var(--bb-text-l);
     margin-bottom: var(--bb-5);
     line-height: var(--bb-lh-snug)
 }

 /* ── Başarı modalı — sakin & premium ── */
 .odm-success {
     text-align: center
 }

 .odm-success__badge {
     width: 76px;
     height: 76px;
     border-radius: var(--bb-r-pill);
     margin: 0 auto var(--bb-5);
     display: grid;
     place-items: center;
     color: #fff;
     background: var(--bb-grad-teal);
     box-shadow: var(--bb-glow-teal);
     animation: bb-pop var(--bb-dur-base) var(--bb-ease-emphasized)
 }

 .odm-success__badge svg {
     width: 34px;
     height: 34px;
     display: block
 }

 .odm-success__badge svg path {
     stroke-dasharray: 30;
     stroke-dashoffset: 30;
     animation: odm-tick var(--bb-dur-slow) var(--bb-ease-standard) .12s forwards
 }

 @keyframes odm-tick {
     to {
         stroke-dashoffset: 0
     }
 }

 .odm-success__eyebrow {
     display: block;
     font-size: var(--bb-text-xs);
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: var(--bb-ls-label);
     color: var(--bb-teal-700);
     margin-bottom: var(--bb-2)
 }

 .odm-success h2 {
     font-family: var(--bb-font-display);
     font-size: var(--bb-display-s);
     letter-spacing: .01em;
     color: var(--bb-cacao-700);
     margin-bottom: var(--bb-3);
     line-height: var(--bb-lh-tight)
 }

 .odm-success p {
     color: var(--bb-on-light-dim);
     font-size: var(--bb-text-m);
     line-height: var(--bb-lh-snug);
     max-width: 40ch;
     margin: 0 auto var(--bb-5)
 }

 .odm-success__code {
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: var(--bb-4);
     background: var(--bb-surface-2);
     border: 1px solid var(--bb-border-gold);
     border-radius: var(--bb-r-lg);
     padding: var(--bb-4) var(--bb-4) var(--bb-4) var(--bb-5);
     margin-bottom: var(--bb-5);
     text-align: left
 }

 .odm-success__code-l {
     display: flex;
     flex-direction: column;
     gap: 3px;
     min-width: 0
 }

 .odm-success__code small {
     font-size: 11px;
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: .08em;
     color: var(--bb-ink-500)
 }

 .odm-success__code b {
     font-family: var(--bb-font-display);
     font-size: var(--bb-display-s);
     letter-spacing: .06em;
     color: var(--bb-cacao-700);
     line-height: 1
 }

 .odm-success__copy {
     flex: none
 }

 .odm-success__cta {
     display: flex;
     flex-wrap: wrap;
     gap: var(--bb-3);
     justify-content: center
 }

 @keyframes bb-pop {
     0% {
         transform: scale(.4);
         opacity: 0
     }

     60% {
         transform: scale(1.08)
     }

     100% {
         transform: scale(1);
         opacity: 1
     }
 }

 @media (prefers-reduced-motion:reduce) {
     .odm-success__badge svg path {
         animation: none;
         stroke-dashoffset: 0
     }
 }

 /* ── İl / İlçe select (input görünümü) ── */
 select.odm-select {
     appearance: none;
     -webkit-appearance: none;
     -moz-appearance: none;
     font-family: var(--bb-font-body);
     color: var(--bb-on-light);
     cursor: pointer;
     padding-right: 42px;
     background-color: var(--bb-surface-raised);
     background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%235C2A10' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
     background-repeat: no-repeat;
     background-position: right 16px center
 }

 select.odm-select:disabled {
     opacity: .6;
     cursor: not-allowed;
     color: var(--bb-on-light-dim);
     background-color: var(--bb-surface-2)
 }

 select.odm-select option {
     color: var(--bb-on-light)
 }

 /* ── Havale: banka kartı ── */
 .odm-bankcard {
     position: relative;
     overflow: hidden;
     min-width: 0;
     border-radius: var(--bb-r-xl);
     padding: clamp(18px, 3vw, 24px);
     margin-bottom: var(--bb-4);
     color: #fff;
     box-shadow: var(--bb-e2);
     background: linear-gradient(135deg, var(--bb-cacao-700) 0%, var(--bb-cacao-800) 56%, var(--bb-cacao-900) 100%);
     border: 1px solid var(--bb-border-gold)
 }

 .odm-bankcard__sheen {
     position: absolute;
     inset: 0;
     pointer-events: none;
     background: radial-gradient(120% 90% at 88% -10%, rgba(227, 30, 36, .40), transparent 60%),
         linear-gradient(115deg, transparent 32%, rgba(255, 255, 255, .10) 50%, transparent 68%)
 }

 .odm-bankcard__top {
     position: relative;
     display: flex;
     align-items: center;
     justify-content: space-between;
     gap: var(--bb-3);
     margin-bottom: clamp(18px, 3vw, 26px)
 }

 .odm-bankcard__brand {
     font-family: var(--bb-font-display);
     font-weight: 900;
     font-size: clamp(20px, 3.4vw, 26px);
     letter-spacing: .01em;
     color: #fff;
     line-height: 1;
     text-shadow: 0 1px 0 rgba(0, 0, 0, .35)
 }

 .odm-bankcard__chip {
     flex: none;
     width: 40px;
     height: 30px;
     border-radius: 6px;
     background: linear-gradient(135deg, var(--bb-gold-300), var(--bb-gold-700));
     box-shadow: inset 0 1px 2px rgba(255, 255, 255, .5), inset 0 -2px 3px rgba(0, 0, 0, .25);
     position: relative
 }

 .odm-bankcard__chip::after {
     content: "";
     position: absolute;
     inset: 6px 8px;
     border-radius: 3px;
     border: 1px solid rgba(46, 20, 6, .5)
 }

 .odm-bankcard__row {
     position: relative;
     margin-bottom: clamp(16px, 3vw, 22px);
     min-width: 0
 }

 .odm-bankcard__lbl {
     display: block;
     font-size: 10px;
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: .12em;
     color: rgba(251, 247, 238, .62);
     margin-bottom: 5px
 }

 .odm-bankcard__iban {
     display: block;
     font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
     font-weight: 700;
     font-size: clamp(15px, 2.6vw, 19px);
     letter-spacing: .03em;
     color: #fff;
     line-height: 1.4;
     word-break: break-all;
     overflow-wrap: anywhere
 }

 .odm-bankcard__bottom {
     position: relative;
     display: flex;
     align-items: flex-end;
     justify-content: space-between;
     gap: var(--bb-4);
     flex-wrap: wrap
 }

 .odm-bankcard__person,
 .odm-bankcard__ref {
     min-width: 0
 }

 .odm-bankcard__ref {
     text-align: right
 }

 .odm-bankcard__name {
     display: block;
     font-family: var(--bb-font-display);
     font-weight: 800;
     font-size: var(--bb-text-m);
     letter-spacing: .02em;
     color: #fff;
     line-height: 1.2;
     overflow-wrap: anywhere
 }

 .odm-bankcard__code {
     display: block;
     font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
     font-weight: 800;
     font-size: var(--bb-text-m);
     letter-spacing: .06em;
     color: var(--bb-gold-300);
     line-height: 1.2;
     overflow-wrap: anywhere
 }

 .odm-cpbtns {
     display: grid;
     grid-template-columns: repeat(3, minmax(0, 1fr));
     gap: var(--bb-2)
 }

 .odm-cpbtn {
     min-height: 44px;
     min-width: 0;
     padding-inline: 10px;
     font-size: var(--bb-text-xs)
 }

 /* ── Kripto: coin kartları ── */
 .odm-coins {
     display: grid;
     grid-template-columns: repeat(2, minmax(0, 1fr));
     gap: var(--bb-3);
     margin-bottom: var(--bb-4)
 }

 .odm-coin {
     position: relative;
     min-width: 0;
     display: flex;
     flex-direction: column;
     gap: var(--bb-2);
     background: var(--bb-surface-raised);
     border: 1px solid var(--bb-border);
     border-top: 3px solid var(--bb-border);
     border-radius: var(--bb-r-lg);
     padding: 16px 16px 14px;
     box-shadow: var(--bb-e1)
 }

 /* coin marka aksanları — logo istisnası */
 .odm-coin--btc {
     border-top-color: #F7931A
 }

 .odm-coin--eth {
     border-top-color: #627EEA
 }

 .odm-coin--usdt {
     border-top-color: #26A17B
 }

 .odm-coin__head {
     display: flex;
     align-items: center;
     gap: 9px;
     min-width: 0
 }

 .odm-coin__mark {
     flex: none;
     width: 30px;
     height: 30px;
     border-radius: var(--bb-r-pill);
     display: grid;
     place-items: center;
     font-size: 16px;
     font-weight: 900;
     color: #fff;
     line-height: 1
 }

 .odm-coin--btc .odm-coin__mark {
     background: #F7931A
 }

 .odm-coin--eth .odm-coin__mark {
     background: #627EEA
 }

 .odm-coin--usdt .odm-coin__mark {
     background: #26A17B
 }

 .odm-coin__name {
     display: flex;
     align-items: baseline;
     gap: 6px;
     min-width: 0;
     flex: 1;
     font-family: var(--bb-font-display);
     font-weight: 800;
     font-size: var(--bb-text-m);
     color: var(--bb-cacao-700);
     line-height: 1
 }

 .odm-coin__name small {
     font-size: 11px;
     font-weight: 800;
     color: var(--bb-on-light-dim);
     letter-spacing: .04em
 }

 .odm-coin__net {
     flex: none;
     font-size: 10px;
     font-weight: 900;
     letter-spacing: .05em;
     text-transform: uppercase;
     color: var(--bb-teal-700);
     background: rgba(63, 180, 180, .10);
     border: 1px solid var(--bb-border);
     padding: 3px 8px;
     border-radius: var(--bb-r-pill)
 }

 .odm-coin__lbl {
     font-size: 10px;
     font-weight: 800;
     text-transform: uppercase;
     letter-spacing: .09em;
     color: var(--bb-ink-500)
 }

 .odm-coin__addr {
     font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
     font-weight: 700;
     font-size: var(--bb-text-s);
     color: var(--bb-cacao-700);
     line-height: 1.45;
     word-break: break-all;
     overflow-wrap: anywhere
 }

 .odm-coin__btn {
     margin-top: auto;
     min-height: 44px;
     width: 100%
 }

 /* ── Kırılımlar ── */
 @media (max-width:980px) {
     .co-grid {
         grid-template-columns: 1fr;
         gap: clamp(28px, 5vh, 44px)
     }
 }

 @media (max-width:560px) {
     .co-fields {
         grid-template-columns: 1fr
     }

     .odm-pay {
         grid-template-columns: 1fr
     }

     .odm-field-err {
         margin-top: -16px
     }

     .odm-kupon__row {
         flex-wrap: wrap
     }

     .odm-kupon__row .bb-btn {
         width: 100%
     }

     .odm-copy__btn {
         width: 100%
     }

     .odm-success__cta .bb-btn {
         width: 100%
     }

     .odm-coins {
         grid-template-columns: 1fr
     }

     .odm-cpbtns {
         grid-template-columns: 1fr
     }
 }

 @media (max-width:480px) {
     .odm-copy__val {
         word-break: break-all;
         overflow-wrap: anywhere
     }

     .odm-success__code {
         flex-wrap: wrap;
         justify-content: center;
         text-align: center
     }

     .odm-success__code-l {
         align-items: center;
         flex: 1 1 100%
     }

     .odm-success__copy {
         flex: 1 1 100%
     }
 }