/* ui.css — Ofisin Burada ortak bileşenler (arama, sepet, rıza, güven şeridi, iç sayfalar) */
html,body{overflow-x:hidden}
/* ---------- mobil menü (tüm header'larda ortak: .nav-l/.nav-r/.wordmark) ---------- */
.ui-hamburger,.ui-mobmenu,.ui-mobdim{display:none}
@media(max-width:760px){
  header,.ui-header{display:flex !important; justify-content:space-between !important; align-items:center; gap:8px}
  header .nav-l,.ui-header .nav-l{display:none !important}
  header .nav-r,.ui-header .nav-r{gap:14px !important}
  header,.ui-header{padding-left:16px !important; padding-right:16px !important}
  .nav-r a[href*="hesap"]{display:none}
  .brand-name{font-size:18px}
  .brand-mark{height:26px}
  .ui-hamburger{display:inline-flex; align-items:center; background:none; border:0; cursor:pointer; font-size:21px; line-height:1; color:inherit; padding:2px 4px}
  .ui-mobmenu{display:block; position:fixed; top:0; left:0; right:0; z-index:250; background:var(--paper); border-bottom:1px solid var(--line); padding:64px 24px 26px; transform:translateY(-102%); transition:transform .38s cubic-bezier(.2,.7,.3,1); box-shadow:0 22px 44px rgba(34,22,25,.14)}
  .ui-mobmenu.open{transform:none}
  .ui-mobmenu a{display:block; padding:15px 0; font-family:var(--serif); font-size:19px; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line)}
  .ui-mobmenu a:last-child{border-bottom:0}
  .ui-mobdim{display:block; position:fixed; inset:0; z-index:240; background:rgba(34,22,25,.42); opacity:0; visibility:hidden; transition:opacity .3s,visibility .3s}
  .ui-mobdim.open{opacity:1; visibility:visible}
}
:root{
  --paper:#F8F8F9; --paper-deep:#ECEDEF; --paper-3:#E0E2E6;
  --ink:#221619; --ink-70:rgba(34,22,25,.72); --ink-45:rgba(34,22,25,.46);
  --wine:#5A1622; --wine-2:#40101A; --wine-3:#2A0A11;
  --bordo:#8A2436; --silver:#D9DEE5; --line:rgba(34,22,25,.15);
  /* 2026-08-18, kullanıcı: "genel yazı fontunu header kategorileriyle aynı tarzda yap".
     Header şeridi (.hs-track a) kendi font'unu tanımlamaz, body'den miras alır = Hanken Grotesk.
     Tüm site tek sese insin diye --serif de oraya bağlandı.
     ⤺ GERİ ALMAK TEK SATIR: --serif'i --serif-fraunces'ın değeriyle değiştir. 122 kullanım
       (78 CSS kuralı + 10 PHP dosyasında 44 satır içi) bu değişkenden geçiyor, başka yere dokunma.
     ⚠ Hanken Grotesk'in İTALİK kesimi yok (yalnız 300/400/500 normal): serif+italic kullanan
       13 küçük "idx" etiketi tarayıcı eğimine (sentetik oblik) düşer. */
  --serif-fraunces:"Fraunces",Georgia,serif;   /* eski görünüm — referans, kullanımda değil */
  --serif:"Hanken Grotesk",system-ui,sans-serif; --sans:"Hanken Grotesk",system-ui,sans-serif;
}

/* ---------- iç sayfa iskeleti (data-chrome) ---------- */
body[data-chrome]{font-family:var(--sans); background:var(--paper); color:var(--ink); -webkit-font-smoothing:antialiased; margin:0}
body[data-chrome] *{box-sizing:border-box}
.ui-header{position:sticky; top:0; z-index:100; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:16px 44px; background:rgba(248,248,249,.9); backdrop-filter:blur(14px); border-bottom:1px solid var(--line)}
.ui-header nav{display:flex; gap:30px; align-items:center}
.ui-header .nav-r{justify-content:flex-end}
.ui-header a{color:inherit; text-decoration:none; font-size:12.5px; letter-spacing:.06em; opacity:.85; cursor:pointer}
.ui-header a:hover{opacity:1}
.ui-header .wordmark{display:inline-flex; align-items:center; gap:10px; text-decoration:none; color:inherit}
.brand-mark{height:30px; width:auto; display:block}
.brand-name{font-family:var(--serif); font-weight:400; font-size:22px; letter-spacing:.005em; white-space:nowrap}
.brand-name b{font-weight:500}
.cart-dot span{display:inline-grid; place-items:center; min-width:18px; height:18px; border:1px solid currentColor; border-radius:50%; font-size:10px; margin-left:6px; padding:0 3px}
.cart-dot span.empty{display:none}
/* breadcrumb (tüm sayfalarda ortak; ürün + iç sayfalar) */
.crumb{max-width:1360px; margin:0 auto; padding:22px 44px 0; font-size:12px; letter-spacing:.04em; color:var(--ink-45)}
.crumb a{color:inherit; text-decoration:none}
.crumb a:hover{color:var(--ink)}
/* dil switcher gizli: EN çevirisi yarım, tam çeviri turuna kadar site tek-dil (TR). Geri açmak için bu kuralı sil. (#hdr = i18n plugin'in inline .ofb-lang kuralını yenmek için) */
#hdr .ofb-lang{display:none}

.pg{max-width:1080px; margin:0 auto; padding:56px 44px 90px; min-height:52vh}
.pg-kick{font-size:11px; font-weight:500; letter-spacing:.28em; text-transform:uppercase; color:var(--bordo); margin-bottom:14px}
.pg h1{font-family:var(--serif); font-weight:300; font-size:clamp(34px,4vw,54px); line-height:1.02; letter-spacing:-.015em; margin:0 0 14px}
.pg-lede{color:var(--ink-70); font-size:16px; line-height:1.65; max-width:640px; font-weight:300; margin:0 0 40px}
.pg h2{font-family:var(--serif); font-weight:400; font-size:24px; margin:38px 0 12px}
.pg h3{font-family:var(--serif); font-weight:500; font-size:18px; margin:26px 0 8px}
.pg p, .pg li{font-size:14.5px; line-height:1.75; color:var(--ink-70)}
.pg ul{padding-left:20px}
.pg .rule{height:1px; background:var(--line); margin:34px 0}

/* form */
.f-grid{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.f-grid .full{grid-column:1/-1}
.f-field label{display:block; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink-45); margin-bottom:8px}
.f-field input,.f-field textarea,.f-field select{width:100%; padding:14px 16px; border:1px solid var(--line); border-radius:10px; background:#fff; font-family:var(--sans); font-size:14.5px; color:var(--ink); outline:none; transition:border .3s}
.f-field input:focus,.f-field textarea:focus{border-color:var(--bordo)}
.f-field textarea{min-height:130px; resize:vertical}
.f-err{color:var(--bordo); font-size:12.5px; margin-top:10px; display:none}

/* butonlar (iç sayfalar) */
.btn{font-family:var(--sans); font-size:12.5px; letter-spacing:.16em; text-transform:uppercase; font-weight:500; padding:16px 30px; border-radius:100px; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; gap:10px; transition:all .4s cubic-bezier(.2,.7,.3,1); cursor:pointer; border:1px solid transparent}
.btn-solid{background:var(--bordo); color:#fff}
.btn-solid:hover{background:var(--wine)}
.btn-ghost{color:var(--ink); border-color:rgba(34,22,25,.3); background:transparent}
.btn-ghost:hover{border-color:var(--ink)}
.btn[disabled]{opacity:.45; pointer-events:none}

/* akordiyon */
details.acc{border-bottom:1px solid var(--line); padding:4px 0}
details.acc summary{cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; padding:18px 0; font-family:var(--serif); font-size:17px}
details.acc summary::-webkit-details-marker{display:none}
details.acc summary::after{content:"+"; font-size:20px; color:var(--bordo); transition:transform .3s}
details.acc[open] summary::after{transform:rotate(45deg)}
details.acc .acc-body{padding:0 0 20px; font-size:14.5px; line-height:1.7; color:var(--ink-70); max-width:720px}

/* sekmeler */
.tabs{display:flex; gap:8px; border:1px solid var(--line); border-radius:100px; padding:5px; width:max-content; margin-bottom:34px}
.tabs button{border:0; background:transparent; padding:11px 26px; border-radius:100px; font-family:var(--sans); font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-70); cursor:pointer; transition:.3s}
.tabs button.active{background:var(--bordo); color:#fff}

/* kart */
.panelcard{background:#fff; border:1px solid var(--line); border-radius:16px; padding:34px}
.panelgrid{display:grid; grid-template-columns:280px 1fr; gap:24px; align-items:start}
.sidemenu{background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden}
.sidemenu a{display:block; padding:15px 22px; font-size:13.5px; color:var(--ink-70); text-decoration:none; border-bottom:1px solid var(--line); cursor:pointer}
.sidemenu a:last-child{border-bottom:0}
.sidemenu a.active{background:var(--paper-deep); color:var(--ink); font-weight:500}

/* ---------- güven şeridi ---------- */
.ui-trust{border-top:1px solid var(--line); background:var(--paper)}
.ui-trust .tin{max-width:1560px; margin:0 auto; padding:34px 44px; display:grid; grid-template-columns:repeat(4,1fr); gap:24px}
.ui-trust .t{text-align:center}
.ui-trust .t .h{font-family:var(--serif); font-size:16.5px; margin-bottom:5px}
.ui-trust .t .s{font-size:12.5px; color:var(--ink-45); letter-spacing:.02em}

/* ---------- footer (inject) ---------- */
.ui-footer{background:var(--wine-3); color:rgba(248,248,249,.8); padding:70px 44px 36px; font-family:var(--sans)}
.ui-footer .foot-top{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; max-width:1560px; margin:0 auto; padding-bottom:50px; border-bottom:1px solid rgba(217,222,229,.14)}
.ui-footer .wm{font-family:var(--serif); font-size:24px; letter-spacing:.12em; color:var(--paper)}
.ui-footer .foot-brand p{margin-top:16px; font-size:13px; line-height:1.7; color:rgba(248,248,249,.6); max-width:280px; font-weight:300}
.ui-footer h4{font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--silver); margin:0 0 16px}
.ui-footer .foot-col a{display:block; color:rgba(248,248,249,.7); text-decoration:none; font-size:13.5px; margin-bottom:10px}
.ui-footer .foot-col a:hover{color:var(--silver)}
.ui-footer .foot-bot{max-width:1560px; margin:0 auto; padding-top:24px; display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; font-size:12px; color:rgba(248,248,249,.45)}
.ui-footer .pay{font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:rgba(248,248,249,.5)}
.ui-footer .pay b{color:rgba(248,248,249,.75); font-weight:500}

/* ---------- arama overlay (fade + slide efektli) ---------- */
.ui-ovl{position:fixed; inset:0; z-index:300; background:rgba(34,22,25,.45); backdrop-filter:blur(6px); display:flex; align-items:flex-start; justify-content:center; padding:9vh 20px 20px;
  opacity:0; visibility:hidden; transition:opacity .32s ease, visibility .32s ease}
.ui-ovl.open{opacity:1; visibility:visible}
.ui-ovl .box{width:min(680px,100%); max-width:calc(100vw - 40px); min-width:0; background:#fff; border-radius:18px; box-shadow:0 40px 90px rgba(34,22,25,.35); overflow:hidden;
  transform:translateY(-16px) scale(.97); opacity:.4; transition:transform .4s cubic-bezier(.2,.7,.3,1), opacity .4s ease}
.ui-ovl.open .box{transform:none; opacity:1}
.ui-ovl input{width:100%; min-width:0; border:0; outline:none; padding:22px 24px; font-family:var(--serif); font-size:20px; color:var(--ink); background:transparent}
.ui-ovl input::placeholder{color:var(--ink-45)}
.ui-ovl .res{max-height:52vh; overflow:auto; border-top:1px solid var(--line)}
.ui-ovl .r{display:flex; align-items:center; gap:16px; padding:12px 22px; text-decoration:none; color:var(--ink); transition:background .2s}
.ui-ovl .r:hover{background:var(--paper-deep)}
.ui-ovl .r img{width:54px; height:54px; object-fit:contain}
.ui-ovl .r .m{font-family:var(--serif); font-size:16px}
.ui-ovl .r .c{font-size:12px; color:var(--ink-45)}
.ui-ovl .r .p{margin-left:auto; font-family:var(--serif); font-size:15px}
.ui-ovl .none{padding:22px 28px; font-size:14px; color:var(--ink-45)}

/* ---------- sepet drawer ---------- */
.ui-dim{position:fixed; inset:0; z-index:290; background:rgba(34,22,25,.4); display:none}
.ui-dim.open{display:block}
.ui-drawer{position:fixed; top:0; right:0; width:min(440px,94vw); height:100%; z-index:295; background:var(--paper); box-shadow:-30px 0 70px rgba(34,22,25,.25); opacity:0; visibility:hidden; transition:opacity .4s ease, visibility .4s ease; display:flex; flex-direction:column}
.ui-drawer.open{opacity:1; visibility:visible}
.ui-drawer .dh{display:flex; justify-content:space-between; align-items:center; padding:22px 26px; border-bottom:1px solid var(--line)}
.ui-drawer .dh .t{font-family:var(--serif); font-size:20px}
.ui-drawer .dh button{border:0; background:transparent; font-size:22px; cursor:pointer; color:var(--ink)}
.ui-drawer .dl{flex:1; overflow:auto; padding:10px 26px}
.ui-drawer .di{display:flex; gap:14px; padding:16px 0; border-bottom:1px solid var(--line); align-items:center}
.ui-drawer .di img{width:64px; height:64px; object-fit:contain; background:#fff; border-radius:10px; border:1px solid var(--line)}
.ui-drawer .di .m{font-family:var(--serif); font-size:15.5px}
.ui-drawer .di .c{font-size:12px; color:var(--ink-45); margin-top:2px}
.ui-drawer .di .p{font-family:var(--serif); font-size:14.5px; margin-top:6px}
.ui-drawer .q{display:flex; align-items:center; gap:10px; margin-left:auto}
.ui-drawer .q button{width:26px; height:26px; border-radius:50%; border:1px solid var(--line); background:#fff; cursor:pointer; font-size:13px; line-height:1}
.ui-drawer .q .x{border:0; background:transparent; color:var(--ink-45); font-size:16px; margin-left:2px}
.ui-drawer .df{padding:20px 26px 26px; border-top:1px solid var(--line); background:#fff}
.ui-drawer .tot{display:flex; justify-content:space-between; font-family:var(--serif); font-size:19px; margin-bottom:6px}
.ui-drawer .not{font-size:11.5px; color:var(--ink-45); margin-bottom:16px}
.ui-drawer .df .btn{width:100%; margin-bottom:10px}
.ui-drawer .empty{padding:44px 0; text-align:center; color:var(--ink-45); font-size:14px}

/* ---------- çerez/rıza ---------- */
.ui-consent{position:fixed; left:22px; bottom:22px; z-index:280; width:min(380px,calc(100vw - 44px)); background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:0 24px 60px rgba(34,22,25,.22); padding:22px; display:none}
.ui-consent.open{display:block}
.ui-consent .t{font-family:var(--serif); font-size:17px; margin-bottom:8px}
.ui-consent p{font-size:12.5px; line-height:1.6; color:var(--ink-70); margin:0 0 14px}
.ui-consent p a{color:var(--bordo)}
.ui-consent .row{display:flex; gap:10px}
.ui-consent .row .btn{padding:11px 18px; font-size:11px; flex:1}

/* checkout */
.co-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:start}
.co-sum{background:#fff; border:1px solid var(--line); border-radius:16px; padding:26px; position:sticky; top:96px}
.co-sum .di{display:flex; gap:12px; padding:12px 0; border-bottom:1px solid var(--line); align-items:center; font-size:13.5px}
.co-sum .di img{width:48px; height:48px; object-fit:contain}
.co-sum .row{display:flex; justify-content:space-between; padding:8px 0; font-size:14px; color:var(--ink-70)}
.co-sum .row.tot{font-family:var(--serif); font-size:19px; color:var(--ink); border-top:1px solid var(--line); margin-top:8px; padding-top:14px}
.payopt{display:block; border:1px solid var(--line); border-radius:12px; padding:16px 18px; margin-bottom:12px; cursor:pointer; background:#fff; transition:border .3s}
.payopt.sel{border-color:var(--bordo); box-shadow:0 0 0 1px var(--bordo)}
.payopt .t{font-size:14.5px; font-weight:500; display:flex; align-items:center; gap:10px}
.payopt .s{font-size:12.5px; color:var(--ink-45); margin-top:5px; line-height:1.55}
.payopt.dis{opacity:.55; cursor:not-allowed}
.payopt input{accent-color:var(--bordo)}
.badge-soon{font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; background:var(--paper-3); border-radius:100px; padding:4px 10px; color:var(--ink-70)}

/* başarı ekranı */
.success{max-width:560px; margin:40px auto; text-align:center; background:#fff; border:1px solid var(--line); border-radius:18px; padding:54px 40px}
.success .no{font-family:var(--serif); font-size:30px; color:var(--bordo); margin:10px 0 4px}

/* ürün mini kart (hesap-favoriler) */
.mini-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.mini{background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px; text-decoration:none; color:var(--ink); text-align:center}
.mini img{width:80%; aspect-ratio:1; object-fit:contain}
.mini .m{font-family:var(--serif); font-size:14.5px}
.mini .p{font-size:12.5px; color:var(--ink-45)}

@media(max-width:900px){
  .ui-header{padding:14px 20px} .pg{padding:40px 20px 70px}
  .f-grid{grid-template-columns:1fr} .co-grid{grid-template-columns:1fr}
  .ui-trust .tin{grid-template-columns:1fr 1fr; padding:26px 20px}
  .ui-footer .foot-top{grid-template-columns:1fr 1fr}
  .panelgrid{grid-template-columns:1fr} .mini-grid{grid-template-columns:1fr 1fr}
}

/* ---------- header mega menü (kategori + o kategorinin en pahalı ürünü) ---------- */
.mega-panel{position:absolute; top:100%; left:0; right:0; background:var(--paper); border-bottom:1px solid var(--line); box-shadow:0 26px 50px -30px rgba(34,22,25,.38); padding:24px 44px; opacity:0; visibility:hidden; transform:translateY(-10px); transition:opacity .3s ease, transform .3s ease, visibility .3s; z-index:90}
.mega-panel.open{opacity:1; visibility:visible; transform:none}
#hdr.mega-swap .mega-panel{transition:none}
.mega-grid{display:flex; justify-content:center; align-items:flex-start; gap:26px; flex-wrap:wrap}
.mega-card{display:flex; flex-direction:column; gap:9px; width:168px; text-decoration:none; color:inherit}
.mega-thumb{display:block; width:168px; height:150px; background:#ececed; border-radius:10px; overflow:hidden}
.mega-thumb img{width:100%; height:100%; object-fit:contain; display:block; mix-blend-mode:multiply; transition:transform .35s var(--ease,ease)}
.mega-card:hover .mega-thumb img{transform:scale(1.05)}
.mega-name{font-family:var(--serif); font-size:16px; line-height:1.2; font-weight:400}
.mega-sub{font-size:12px; color:var(--ink-70); letter-spacing:.02em}
.mega-all{flex:0 0 100%; text-align:center; font-size:13.5px; color:var(--bordo); text-decoration:none}
.mega-all:hover{text-decoration:underline}
.mega-empty{width:100%; text-align:center; color:var(--ink-45); font-size:12.5px; letter-spacing:.16em; text-transform:uppercase; padding:8px 0}
.mega-brands{display:flex; justify-content:center; align-items:center; gap:38px; flex-wrap:wrap; padding:8px 0}
.mega-brand{font-family:var(--serif); font-size:20px; font-weight:400; color:var(--ink); text-decoration:none; letter-spacing:.01em; transition:color .25s}
.mega-brand:hover{color:var(--bordo)}
.mega-brand.soon{cursor:default; color:var(--ink-70)}
.mega-brand.soon::after{content:"yakında"; display:inline-block; font-family:var(--sans); font-size:8.5px; font-weight:500; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-45); border:1px solid var(--line); border-radius:100px; padding:2px 7px; margin-left:8px; vertical-align:middle}
@media(max-width:760px){.mega-panel{display:none}}

/* ============================================================
   HESAP — giriş / üye-ol ekranı (my-account, oturum AÇILMAMIŞ)
   Canlı OTP mu-plugin'i "Giriş yap" kartını (.ofb-otp) beyaz karta
   çeviriyor ama "Üye Ol" kolonunu (.u-column2) ÇIPLAK bırakıyor.
   Aşağısı: Üye Ol'a AYNI kart kimliği + iki kartı YAN YANA (desktop,
   mobilde alt alta) + dark modda hesap ekranı AÇIK tema kalır.
   Değerler OTP kartıyla BİREBİR (beyaz #fff, çizgi .14, bordo #8A2436).
   Scope :not(.logged-in) → oturum-AÇIK panel (#ofb-acc-panel) ETKİLENMEZ.
   ============================================================ */
body.woocommerce-account:not(.logged-in) .pgwrap{max-width:940px}
body.woocommerce-account:not(.logged-in) .pgwrap > h1{text-align:center; margin-bottom:22px}

/* iki kart YAN YANA: .woocommerce satır-flex; .ofb-otp (Giriş yap) + #customer_login
   (Üye Ol) iki kolon. Bildirimler order:-1 ile üstte tam-genişlik (araya girip
   kartları alt alta itmesin), boşken gizli. Mobilde tam-genişlik → alt alta. */
body.woocommerce-account:not(.logged-in) .woocommerce{
  display:flex; flex-wrap:wrap; gap:26px; align-items:flex-start; justify-content:center}
body.woocommerce-account:not(.logged-in) .ofb-otp,
body.woocommerce-account:not(.logged-in) #customer_login{
  flex:1 1 360px; max-width:440px; margin:0; box-sizing:border-box; color:#221619}
body.woocommerce-account:not(.logged-in) #customer_login .u-columns{display:block; margin:0}
body.woocommerce-account:not(.logged-in) .woocommerce-notices-wrapper{flex-basis:100%; order:-1; margin:0}
body.woocommerce-account:not(.logged-in) .woocommerce-notices-wrapper:empty{display:none}
@media(max-width:760px){
  body.woocommerce-account:not(.logged-in) .ofb-otp,
  body.woocommerce-account:not(.logged-in) #customer_login{flex-basis:100%; max-width:460px}
}

/* ÜYE OL kolonuna OTP kartıyla birebir kart kaplaması. color:#221619 → kart her iki
   temada BEYAZ olduğundan renk verilmemiş metin (KVKK/gizlilik notu) kaybolmasın. */
body.woocommerce-account:not(.logged-in) #customer_login .u-column2.col-2{
  width:100%; max-width:none; margin:0; box-sizing:border-box; color:#221619}
/* ÜYE OL kolonuna OTP kartıyla birebir kart kaplaması */
body.woocommerce-account:not(.logged-in) #customer_login .u-column2.col-2{
  background:#fff; border:1px solid rgba(34,22,25,.14); border-radius:14px; padding:26px 28px}
/* register FORM'unun kendi WC-default kutusunu sıfırla → kart-içinde-kart olmasın */
body.woocommerce-account:not(.logged-in) #customer_login .u-column2 form.register{
  border:0; padding:0; margin:0; background:none}

/* kart başlıkları — "Hesabım" ile aynı serif kimliği */
body.woocommerce-account:not(.logged-in) .ofb-otp h2,
body.woocommerce-account:not(.logged-in) #customer_login .u-column2 h2{
  font-family:var(--serif); font-size:22px; color:#221619; margin:0 0 8px; line-height:1.15}

/* ÜYE OL alanları — OTP input'larıyla aynı görünüm
   (panel CSS input kuralı yalnız .woocommerce-MyAccount-content içini kapsadığından
    register alanları stilsiz kalıyordu) */
body.woocommerce-account:not(.logged-in) #customer_login .u-column2 input[type=email],
body.woocommerce-account:not(.logged-in) #customer_login .u-column2 input[type=text]{
  width:100%; border:1px solid rgba(34,22,25,.26); border-radius:9px; padding:12px 14px;
  font-size:15px; box-sizing:border-box; background:#fff; color:#221619}
body.woocommerce-account:not(.logged-in) #customer_login .u-column2 input:focus{
  border-color:#8A2436; outline:none}
body.woocommerce-account:not(.logged-in) #customer_login .u-column2 label[for]{
  display:block; font-size:13.5px; font-weight:600; color:#221619; margin-bottom:6px}
body.woocommerce-account:not(.logged-in) #customer_login .u-column2 form > p{margin:0 0 12px}

/* birincil butonlar — iki kartta da tam-genişlik, aynı ritim (bordo panel CSS'ten gelir) */
body.woocommerce-account:not(.logged-in) .ofb-otp .btn,
body.woocommerce-account:not(.logged-in) #customer_login .u-column2 .woocommerce-form-register__submit{
  width:100%; margin-top:14px}
/* OTP kartındaki ikincil "Zaten kodum var →" — buton değil bağlantı gibi dursun */
body.woocommerce-account:not(.logged-in) .ofb-otp .degistir{display:block; width:100%; text-align:center; margin:12px 0 0}