/* ==========================================================================
    Geldi Gidiyo – Register
    (Desktop: 2 sütun %50 | %50 — sol=form (scroll), sağ=mor panel.
    Mobile ≤760px: tek sütun. Linklerde satır kayması yok, şifre hint rengi dinamik.)
    ========================================================================== */

:root{
    --purple:#6c3db1;
    --purple-700:#532c8a;
    --red:#e63946;
    --ink:#0f1220;
    --muted:#6b7280;
    --white:#ffffff;
    --radius:28px;
    --shadow:0 22px 60px rgba(20,10,61,.22);
    --field:#f4f6fa;
    --field-b:#e6e7ee;
}

/* Base */
*{ box-sizing:border-box }
html,body{ height:100% }
html{ overflow:hidden } /* sayfa scroll kapalı, sol panel iç-scroll */
.auth-body{
    margin:0; background:#fff; color:var(--ink);
    -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
    font-family:"Plus Jakarta Sans", Manrope, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial;

    display:flex; justify-content:center; align-items:center;
    min-height:100vh; padding:20px;
    overflow:hidden; /* büyük ekranlarda dış scroll istemiyoruz */
}

/* Küçük yüksekliklerde sayfa scroll aç */
@media (max-height:700px){
    html,.auth-body{ overflow:auto }
}

/* Arka plan glow */
.auth-body::before{
    content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
    background:
        radial-gradient(40% 30% at 15% 10%, rgba(108,61,177,.10), transparent 60%),
        radial-gradient(35% 28% at 85% 85%, rgba(230,57,70,.08), transparent 60%);
}

/* Kart (Desktop: 2 sütun sabit 60/40) */
.card{
    width:100%;
    max-width:1200px;
    height:90vh; max-height:90vh;
    background:var(--white);
    border-radius:var(--radius);
    box-shadow:var(--shadow);
    display:grid;
    grid-template-columns: 60% 40%; /* sol geniş, sağ dar */
    grid-template-areas: "left right";
    align-items:stretch;
    overflow:hidden; position:relative;
}

/* Sol panel (form) */
.left{
    grid-area:left;
    padding:48px 44px;
    overflow-y:auto;           /* sol içerik scroll */
    min-width:0;
}

.form-inner{
    width:100%;
    max-width:680px;   /* satırların yatay genişliği arttı */
    margin:0 auto;
    display:flex; flex-direction:column; text-align:center;
}

.logo-left{ height:64px; width:auto; margin:0 auto 12px; display:block; filter:drop-shadow(0 6px 12px rgba(0,0,0,.18)) }
.title{
    margin:0 0 2px; color:#1d1930;
    font-family:"Plus Jakarta Sans", Manrope, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial;
    font-weight:800; font-size:32px; letter-spacing:.1px;
}
.subtitle{ color:var(--muted); margin:0 0 14px; font-weight:500 }

/* Grid satırları */
/* Varsayılan 2 kolon */
.row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:10px 0; }

/* Email + Telefon satırında email geniş, tel dar */
.row.email-phone{ grid-template-columns:1.7fr 1fr; }
@media (max-width:820px){ .row.email-phone{ grid-template-columns:1fr; } }

/* 3 kolon satırlar (şehir-ilçe-semt) */
.row-3{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px; margin:10px 0; }

/* Mobilde tek sütun */
@media (max-width:820px){
    .row, .row-3, .row.email-phone{ grid-template-columns:1fr; }
}

/* Kontroller */
.control{
    width:100%;
    padding:10px 14px;            /* ↓ yükseklik azaldı */
    border-radius:12px;
    margin:8px 0;
    border:1px solid var(--field-b);
    background:var(--field);
    font-size:15px;
    line-height:1.4;
    min-width:0;
}
.control::placeholder{ color:#8088a2; font-size:14px; }
.control:focus{ border-color:#9d84d1; background:#fff; box-shadow:0 0 0 3px rgba(157,132,209,.22); }

/* Select oku */
.select{
    appearance:none;
    background-image:
        linear-gradient(45deg,transparent 50%,#8c92a3 50%),
        linear-gradient(135deg,#8c92a3 50%,transparent 50%);
    background-position:calc(100% - 22px) 18px, calc(100% - 16px) 18px;
    background-size:6px 6px, 6px 6px;
    background-repeat:no-repeat;
    padding-right:40px;
}

/* Telefon chip */
.phone-wrap{ position:relative }
.prefix-chip{
    position:absolute; left:14px; top:50%; transform:translateY(-50%);
    background:#eef0f7; border:1px solid #e2e5f0; border-radius:8px; padding:4px 8px;
    font-weight:700; font-size:13px; color:#535a6f;
}
.with-prefix{ padding-left:76px }

/* Göz butonu */
.input-wrap{ position:relative }
/* Göz butonu için sağ boşluk: ikon yazının üstüne binmesin */
.input-wrap .control{ padding-right:46px; }

.eye{
    position:absolute; right:10px; top:50%; transform:translateY(-50%);
    background:transparent; border:0; cursor:pointer; opacity:.75; padding:6px; border-radius:10px;
}
.eye:hover{ opacity:1 }
.eye:focus-visible{ outline:2px solid #9d84d1; outline-offset:2px }
.eye svg{ width:20px; height:20px; stroke:#4b2f89; }

/* Şifre gücü */
.pw-box{ margin-top:4px }
.meter{ height:6px; background:#eef0f6; border-radius:999px; overflow:hidden }
.meter>i{
    display:block; height:100%; width:0;
    /* JS bar rengini set ediyor → düz renk bırakıyoruz */
    background:#6c3db1;
    transition:width .25s, background-color .15s;
    border-radius:999px;
}
.hintline{ margin-top:6px; font-size:13px; color:#6b7280; font-weight:500 }
.hintline.ok  { color:#16a34a; font-weight:600; }  /* yeşil */
.hintline.bad { color:#dc2626; font-weight:600; }  /* kırmızı */

/* Şifre kuralları – 2 sütun, ✓/✗ renkli */
.pw-rules{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px 18px;
    margin-top:10px;
    font-size:14px;
}
.pw-rules div{ display:flex; align-items:center; gap:6px }
.pw-rules span{ font-weight:700; width:18px; text-align:center }
.pw-rules .ok{ color:#16a34a }    /* yeşil */
.pw-rules .bad{ color:#dc2626 }  /* kırmızı */

/* Onaylar – checkbox metnini hizala */
.consents{ margin:6px 0 2px; text-align:left }
.consent{
    display:flex; align-items:flex-start; gap:8px;
    font-size:14px; color:var(--ink); line-height:1.55; margin:8px 2px;
}
.consent input{ accent-color:#6b2ce0; margin-top:3px }
.consents a{
    color:#4b2f89; text-decoration:underline; text-underline-offset:3px; font-weight:600;
}
.consents a:hover{ opacity:.9 }
/* Link gruplarını aynı satırda tut */
.consents .nowrap{ white-space:nowrap; }

/* CTA */
.cta{ width:220px; white-space:nowrap; margin:8px auto 0 }
.btn-cta{
    display:inline-flex; align-items:center; justify-content:center;
    padding:12px 22px; border-radius:12px; font-weight:800; text-decoration:none;
    transition:background .15s ease, color .15s ease, transform .06s ease, box-shadow .15s ease;
    font-family:"Plus Jakarta Sans", Manrope, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial;
    letter-spacing:.2px;
    min-width:220px; height:48px;
}
.btn-cta:active{ transform:translateY(1px) }
.btn-cta.purple{ border:2px solid var(--purple); color:var(--purple); background:transparent }
.btn-cta.purple:hover{ background:var(--purple); color:#fff; box-shadow:0 10px 22px rgba(108,61,177,.25) }
.btn-cta.white{ border:2px solid #fff; color:#fff; background:transparent }
.btn-cta.white:hover{ background:#fff; color:#4b2f89; box-shadow:0 10px 22px rgba(0,0,0,.22) }

/* Hata kutusu */
.error{
    background:#fee2e2; border:1px solid #fecaca; color:#8d1a22;
    padding:10px 12px; border-radius:12px; font-size:13px; font-weight:700; margin:10px 0;
    text-align:left;
}

/* Sağ mor panel */
.right{
    grid-area:right; min-width:0;
    position:relative; color:#fff; text-align:center;
    padding:54px 44px; display:flex; align-items:center; justify-content:center;
}
.right::before{
    content:""; position:absolute; inset:4px;
    background:linear-gradient(135deg,var(--purple-700),var(--purple));
    border:4px solid var(--red);
    border-radius:46px 36px 46px 150px; z-index:0;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);
}
.right::after{
    content:""; position:absolute; inset:4px; border-radius:46px 36px 46px 150px; z-index:0;
    background:linear-gradient(120deg, rgba(255,255,255,.18), rgba(255,255,255,0) 40% 60%, rgba(0,0,0,0));
    mix-blend-mode:screen; pointer-events:none; animation:shine 6s linear infinite;
}
@keyframes shine{0%{background-position:-200% 0;background-size:200% 100%}100%{background-position:200% 0;background-size:200% 100%}}

/* Sağ panel içi */
.inner{ position:relative; z-index:1; max-width:420px }
.welcome{
    font-family:"Plus Jakarta Sans", Manrope, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial;
    font-weight:800; font-size:28px; margin:8px 0 4px; letter-spacing:.2px;
}
.desc{ color:#e7e8ff; font-weight:500 }

/* Mobile: tek sütun — panel altta */
@media (max-width:760px){
    .card{
        display:block;           /* grid yerine blok düzen */
        height:auto;
        max-height:none;
    }
    .left{  padding:36px 20px; overflow-y:visible; }
    .right{ padding:36px 20px; }
}


/* Reduced motion */
@media (prefers-reduced-motion: reduce){
    .right::after{ animation:none }
    .btn-cta{ transition:none }
}

/* Form pasifken görsel ipucu */
#regForm :disabled{
    opacity:.6;
    cursor:not-allowed;
}

/* TELEFON NUMARASI İÇİN YÖN KONTROLÜ - EKLENEN KISIM */
#telefon {
  direction: ltr !important;
}
