/* [MERCHANT KAYIT SONRASI TANIŞMA, 2026-10-30] YALNIZ onboarding kapsamı (.onboarding-root / .ob-*). Giriş, kayıt yetkilendirme, başvuru ve panel ekranlarının kurallarına DOKUNMAZ.
   Tek render kaynağı: js/merchant-onboarding-view.js (Merchant + Admin önizlemesi aynı CSS'i yükler). Tasarım değerleri satır içi CSS değişkenleriyle gelir (--ob-*).
   --ob-k: masaüstünde "tek ekrana sığdırma" ölçeği (JS fit(); 1 = tam boyut). Mobil (<=860px): hero gizli, tek sütun, Geri/Devam yapışık alt çubuk. */
.onboarding-root{position:fixed;inset:0;background:#fff;overflow:auto;z-index:30}
.ob-shell{--ob-k:1;display:grid;grid-template-columns:minmax(0,1fr) calc(var(--ob-hero-pct) * 1%);height:100%;min-height:100%;background:#fff;color:var(--ink)}
.ob-main{display:flex;flex-direction:column;min-width:0;height:100%;overflow-x:hidden;overflow-y:auto;padding:calc(clamp(12px,3.2vh,36px) * var(--ob-k)) clamp(16px,2.6vw,44px) calc(clamp(12px,3.2vh,36px) * var(--ob-k)) clamp(24px,5.2vw,92px)}
.ob-head,.ob-body,.ob-actions,.ob-error{width:100%;max-width:880px}
.ob-head{flex:0 0 auto}
.ob-logo{background:none;border:0;padding:0;margin:0 0 calc(clamp(10px,2.2vh,22px) * var(--ob-k));cursor:pointer;display:inline-flex}
.ob-logo img{height:max(22px,calc(34px * var(--ob-k)));width:auto;display:block}
.ob-progress{display:flex;gap:8px;width:min(100%,280px);margin-bottom:calc(10px * var(--ob-k))}
.ob-seg{height:6px;flex:1;border-radius:99px;background:#e3e9e5}
.ob-seg.done,.ob-seg.active{background:var(--green2)}
.ob-count{font-size:13px;font-weight:700;color:var(--muted);margin-bottom:calc(clamp(6px,1.4vh,14px) * var(--ob-k))}
.ob-body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;justify-content:center}
.ob-title{margin:0 0 calc(10px * var(--ob-k));font-family:var(--ob-t-family);font-weight:var(--ob-t-weight);font-size:max(20px,calc(var(--ob-t-size) * var(--ob-k)));line-height:1.16;text-align:var(--ob-t-align);color:#10201a;overflow-wrap:anywhere}
.ob-desc{margin:0 0 calc(clamp(10px,2.4vh,24px) * var(--ob-k));font-family:var(--ob-d-family);font-weight:var(--ob-d-weight);font-size:max(13px,calc(var(--ob-d-size) * var(--ob-k)));line-height:1.45;text-align:var(--ob-d-align);color:var(--muted);overflow-wrap:anywhere}
.ob-body>.ob-options,.ob-body>.ob-field{margin-top:calc(clamp(6px,1.6vh,16px) * var(--ob-k))}
.ob-options{display:grid;grid-template-columns:repeat(var(--ob-cols),minmax(0,1fr));gap:calc(var(--ob-gap) * var(--ob-k));grid-auto-rows:minmax(min-content,1fr);flex:1 1 auto;min-height:0;max-height:560px}
.ob-options.ob-choice{max-height:320px}
.ob-card{position:relative;display:flex;flex-direction:column;justify-content:center;gap:calc(8px * var(--ob-k));min-width:0;width:100%;padding:calc(var(--ob-pad) * var(--ob-k));border:1.5px solid var(--line);border-radius:16px;background:#fff;color:var(--ink);text-align:center;cursor:pointer;transition:border-color .15s,box-shadow .15s,background .15s}
.ob-card:hover:not(:disabled){border-color:#9ccf9f;box-shadow:0 4px 14px rgba(20,40,25,.08)}
.ob-card:focus-visible{outline:3px solid var(--green2);outline-offset:2px}
.ob-card.selected{border-color:var(--green2);background:#f3fbf4;box-shadow:0 0 0 1px var(--green2)}
.ob-card:disabled{opacity:.55;cursor:not-allowed}
.ob-check{position:absolute;top:10px;right:10px;width:24px;height:24px;border-radius:50%;background:var(--green2);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;line-height:1}
.ob-icon{--i:40px;width:calc(var(--i) * var(--ob-k));height:calc(var(--i) * var(--ob-k));min-width:16px;min-height:16px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;align-self:var(--ob-icon-self);font-size:calc(var(--i) * .62 * var(--ob-k));line-height:1}
.ob-icon img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.ob-card-title{display:block;width:100%;font-family:var(--ob-ct-family);font-weight:var(--ob-ct-weight);font-size:max(12px,calc(var(--ob-ct-size) * var(--ob-k)));line-height:1.25;text-align:var(--ob-ct-align);overflow-wrap:anywhere}
.ob-card-desc{display:block;width:100%;font-family:var(--ob-cd-family);font-weight:var(--ob-cd-weight);font-size:max(11px,calc(var(--ob-cd-size) * var(--ob-k)));line-height:1.4;text-align:var(--ob-cd-align);color:var(--muted);overflow-wrap:anywhere}
.ob-choice .ob-card{min-height:calc(clamp(110px,18vh,200px) * var(--ob-k))}
.ob-field label{display:block;font-weight:700;font-size:14px;margin-bottom:8px}
.ob-field input{min-height:calc(54px * var(--ob-k));max-height:64px;border-radius:14px;font-size:16px;padding:0 16px}
.ob-field input:focus{border-color:var(--green2);box-shadow:0 0 0 3px rgba(49,132,58,.18)}
.ob-error{flex:0 0 auto;margin-top:12px;padding:10px 14px;border-radius:12px;background:#fdecec;color:#b42318;font-size:13px;font-weight:600;line-height:1.4}
.ob-error[hidden]{display:none}
.ob-actions{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:calc(clamp(10px,2.4vh,24px) * var(--ob-k))}
.ob-actions-right{display:flex;gap:10px;margin-left:auto;flex-wrap:wrap;justify-content:flex-end}
.ob-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:max(38px,calc(50px * var(--ob-k)));padding:0 calc(28px * var(--ob-k));border:1.5px solid transparent;border-radius:999px;font-size:15px;font-weight:700;line-height:1;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s}
.ob-btn:focus-visible{outline:3px solid var(--green2);outline-offset:2px}
.ob-btn-primary{background:var(--green2);border-color:var(--green2)}
.ob-btn-primary,.ob-btn-primary *{color:#fff}
.ob-btn-primary:hover:not(:disabled){background:#276d2f;border-color:#276d2f}
.ob-btn-ghost{background:transparent;color:var(--green2);padding-left:6px;padding-right:6px}
.ob-btn-ghost:hover:not(:disabled){text-decoration:underline}
.ob-btn-outline{background:#fff;border-color:#cfd9d3;color:var(--ink)}
.ob-btn-outline:hover:not(:disabled){border-color:var(--green2)}
.ob-btn:disabled{opacity:.45;cursor:not-allowed}
.ob-hero{align-self:center;position:relative;height:calc(100% - 2 * var(--ob-margin));margin:var(--ob-margin) var(--ob-margin) var(--ob-margin) 0;border-radius:28px;overflow:hidden;background:#fff;min-width:0}
.ob-hero-img{display:block;width:100%;height:100%;object-fit:var(--ob-fit);object-position:var(--ob-pos)}
.ob-hero-placeholder{width:100%;height:100%;background:var(--soft);display:flex;align-items:center;justify-content:center}
.ob-hero-placeholder img{width:34%;opacity:.5}
@media (max-width:860px){
  .ob-shell{display:block;height:auto;min-height:100%}
  .ob-main{height:auto;min-height:100dvh;overflow:visible;padding:18px 16px 0}
  .ob-hero{display:none}
  .ob-body{justify-content:flex-start}
  .ob-title{font-size:min(var(--ob-t-size),28px)}
  .ob-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ob-choice[style*="--ob-cols:3"]{grid-template-columns:minmax(0,1fr)}
  .ob-choice .ob-card{min-height:96px}
  .ob-actions{position:sticky;bottom:0;z-index:2;background:#fff;margin-top:16px;padding:12px 0 calc(12px + env(safe-area-inset-bottom,0px));box-shadow:0 -10px 12px -10px rgba(16,32,26,.12)}
  .ob-btn{min-height:46px}
}
@media (max-width:480px){
  .ob-grid,.ob-choice{grid-template-columns:minmax(0,1fr)!important}
  .ob-grid .ob-card{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"icon title" "icon desc";column-gap:12px;row-gap:2px;align-items:center;text-align:left;padding:12px 14px}
  .ob-grid .ob-icon{grid-area:icon;--i:34px;align-self:center}
  .ob-grid .ob-card-title{grid-area:title;text-align:left}
  .ob-grid .ob-card-desc{grid-area:desc;text-align:left}
  .ob-grid .ob-check{top:8px;right:8px}
}
@media (prefers-reduced-motion:reduce){.ob-card,.ob-btn{transition:none}}