/* ════════════════════════════════════════════════════════════════════════════
 * bv-auth-web.css — Web uygulamalarının giriş sayfaları (Portal, Veteriner, Danışman → Views/Shared/_LayoutAuth.cshtml)
 *  Üç projede AYNI dosyadır. Kayıt sihirbazı tasarımı: sayfanın ortasında tek kart → solda koyu marka paneli
 *  (logo, adım listesi ya da tanıtım), sağda üst satır ("Adım x / y" + dil düğmesi), ince ilerleme çubuğu, başlık,
 *  alanlar ve en altta düğmeler. Alan, seçim, kod kutusu, düğme gibi bileşenler bv-signup.css'tedir (altı uygulamada
 *  aynı dosya); renkler [data-bvs-pf] değişkenlerinden gelir (--bvs-acc, --bvs-side …).
 *  Zemin platforma göre (body[data-bva-pf] = farm | vet | adv): açık tonlu degrade, sol üst açık → sağ alt koyu.
 *  Dar ekranda (< 900 px) sol panel gizlenir, kart ekranı kaplar; düğmeler ekranın altına yapışır (bv-signup.css).
 * ════════════════════════════════════════════════════════════════════════════ */

/* ── Zemin ── */
body.bva-body { margin: 0; min-height: 100vh; min-height: 100dvh; background-attachment: fixed; }
/* Çiftlik (Portal): buz beyazından camgöbeği-arduvaza */
body.bva-body[data-bva-pf="farm"] { background-color: #DCE7E6;
    background-image:
        radial-gradient(900px 620px at 0% 0%, rgba(250, 253, 253, .85), rgba(250, 253, 253, 0) 62%),
        radial-gradient(820px 600px at 100% 100%, rgba(46, 78, 84, .38), rgba(46, 78, 84, 0) 60%),
        radial-gradient(700px 480px at 70% 85%, rgba(0, 128, 128, .22), rgba(0, 128, 128, 0) 70%),
        linear-gradient(145deg, #F1F6F6 0%, #D9E6E5 50%, #A9C2C1 100%); }
/* Veteriner: kar beyazından çelik mavisine */
body.bva-body[data-bva-pf="vet"] { background-color: #DDE4EE;
    background-image:
        radial-gradient(900px 620px at 0% 0%, rgba(251, 252, 255, .85), rgba(251, 252, 255, 0) 62%),
        radial-gradient(820px 600px at 100% 100%, rgba(38, 53, 74, .36), rgba(38, 53, 74, 0) 60%),
        radial-gradient(700px 480px at 70% 85%, rgba(79, 101, 133, .3), rgba(79, 101, 133, 0) 70%),
        linear-gradient(145deg, #F2F5F9 0%, #DAE2EC 50%, #AEBDD1 100%); }
/* Danışman: sıcak kum tonları, karamelden zeytin ışığına */
body.bva-body[data-bva-pf="adv"] { background-color: #EDE4D8;
    background-image:
        radial-gradient(900px 620px at 0% 0%, rgba(255, 250, 242, .75), rgba(255, 250, 242, 0) 62%),
        radial-gradient(820px 600px at 100% 100%, rgba(112, 124, 88, .4), rgba(122, 132, 98, 0) 60%),
        radial-gradient(700px 480px at 70% 85%, rgba(150, 112, 70, .35), rgba(150, 112, 70, 0) 70%),
        linear-gradient(145deg, #F3EADF 0%, #E6D8C5 50%, #C9B496 100%); }
.bva { min-height: 100vh; min-height: 100dvh; display: flex; align-items: center; justify-content: center; padding: 32px 16px; }

/* ── Kart: sol panel + sağ alan ── */
.bva-card { width: 100%; max-width: 1080px; min-height: 640px; display: grid; grid-template-columns: 300px minmax(0, 1fr);
    background: var(--bvs-card); border: 0; border-radius: 18px; overflow: hidden;
    box-shadow: 0 0 0 1px rgba(20, 28, 36, .05), 0 8px 20px rgba(20, 28, 36, .10), 0 30px 70px rgba(20, 28, 36, .22); }

/* ── Sol panel ── */
.bva-side { background: linear-gradient(170deg, var(--bvs-side), var(--bvs-side-2)); color: #ECEFF1; padding: 28px 26px;
    display: flex; flex-direction: column; gap: 30px; min-width: 0; }
.bva-logo img { height: 34px; width: auto; display: block; }
.bva-intro h2 { font-size: 20px; font-weight: 600; line-height: 1.3; color: #FFF; margin: 0 0 8px; text-wrap: balance; }
.bva-intro > p { font-size: 13px; line-height: 1.55; opacity: .8; margin: 0; }
.bva-points { list-style: none; margin: 24px 0 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.bva-points li { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; align-items: start; }
.bva-points i { width: 34px; height: 34px; border-radius: 10px; background: rgba(255, 255, 255, .1); display: grid; place-items: center; font-size: 17px; color: #FFF; }
.bva-points b { display: block; font-size: 13.5px; font-weight: 600; color: #FFF; margin-bottom: 2px; }
.bva-points span { display: block; font-size: 12px; line-height: 1.45; opacity: .75; }
.bva-foot { margin-top: auto; font-size: 12px; opacity: .6; }
/* Sihirbazın adım listesi sol panelde (bv-signup.css → .bvs-stepper); başlık burada gösterildiği için sağdaki başlık gizlenir */
.bva-side .bvs-side-title { color: #FFF; }

/* ── Sağ alan ── */
.bva-main { padding: 24px 34px 30px; display: flex; flex-direction: column; min-width: 0; }
.bva-top { display: flex; align-items: center; gap: 12px; min-height: 36px; margin-bottom: 14px; }
.bva-top-step { font-size: 12.5px; color: var(--bvs-mute); letter-spacing: .02em; }
.bva-top-step:empty { display: none; }
.bva-logo-sm { display: none; }
.bva-logo-sm img { height: 28px; width: auto; display: block; }
.bva-lang { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 10px; border: 1.5px solid var(--bvs-line);
    border-radius: 9px; background: var(--bvs-card); color: var(--bvs-ink); font: inherit; font-size: 13px; cursor: pointer; transition: border-color .15s; }
.bva-lang:hover { border-color: var(--bvs-mute); }
.bva-lang:focus-visible { outline: 0; border-color: var(--bvs-acc); box-shadow: 0 0 0 3px rgba(var(--bvs-acc-rgb), .16); }
.bva-lang b { font-size: 11px; font-weight: 600; letter-spacing: .04em; border: 1px solid var(--bvs-line); border-radius: 5px; padding: 1px 5px; }
.bva-lang .mdi { font-size: 16px; color: var(--bvs-mute); }
.bva-content { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.bva-content > .bvs { flex: 1; display: flex; flex-direction: column; }
.bva-content form[data-bvs-wizard] { flex: 1; display: flex; flex-direction: column; }
.bva-content form[data-bvs-wizard] > .bvs-acts { margin-top: auto; padding-top: 24px; }

/* İlerleme: ince parçalı çubuk → adım başlığı → açıklama ("Adım x / y" üst satırda) */
.bva .bvs-progress { display: flex; flex-direction: column; gap: 4px; margin-bottom: 22px; }
.bva .bvs-prog-top { display: contents; }
.bva .bvs-prog-step { display: none; }
.bva .bvs-segs { order: -1; margin-bottom: 14px; }
.bva .bvs-prog-title { font-size: 20px; font-weight: 600; line-height: 1.3; }
.bva .bvs-prog-sub { display: block; font-size: 13.5px; color: var(--bvs-mute); line-height: 1.5; }

/* Kısa sayfalar: dar sütun, dikeyde ortada */
.bva-center .bva-content { justify-content: center; width: 100%; max-width: 420px; margin: 0 auto; padding: 12px 0 24px; }
.bva-title { font-size: 24px; font-weight: 600; line-height: 1.25; margin: 0 0 6px; text-wrap: balance; }
.bva-sub { font-size: 14px; color: var(--bvs-mute); line-height: 1.55; margin: 0 0 24px; }

/* Giriş formu */
.bva-form { display: flex; flex-direction: column; gap: 16px; }
.bva-label-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.bva-label-row label { font-size: 13px; font-weight: 500; color: var(--bvs-ink); margin: 0; }
.bva-link { font-size: 13px; color: var(--bvs-acc); font-weight: 500; text-decoration: none; }
.bva-link:hover { color: var(--bvs-acc-ink); text-decoration: underline; }
.bva-wide { width: 100%; }
.bva-note { margin-top: 22px; }

/* Sonuç sayfaları (başvuru alındı, hata) */
.bva-result-ic { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; font-size: 28px; margin-bottom: 18px; }
.bva-result-ic.ok { background: rgba(30, 123, 52, .12); color: #1E7B34; }
.bva-result-ic.bad { background: rgba(179, 38, 30, .1); color: #B3261E; }
.bva-result-ic.info { background: rgba(var(--bvs-acc-rgb), .1); color: var(--bvs-acc); }
.bva-track { list-style: none; margin: 0 0 26px; padding: 0; display: flex; flex-direction: column; gap: 0; }
.bva-track li { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 12px; align-items: start; position: relative; padding-bottom: 18px; font-size: 13.5px; line-height: 1.5; }
.bva-track li:last-child { padding-bottom: 0; }
.bva-track li:not(:last-child)::after { content: ""; position: absolute; left: 15px; top: 32px; bottom: 2px; width: 2px; background: var(--bvs-line); }
.bva-track i { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-size: 17px; border: 1.5px solid var(--bvs-line); color: var(--bvs-mute); background: var(--bvs-card); }
.bva-track li.done i { background: var(--bvs-acc); border-color: var(--bvs-acc); color: #FFF; }
.bva-track li.now i { border-color: var(--bvs-acc); color: var(--bvs-acc); }
.bva-track span { padding-top: 6px; }

/* Şifremi unuttum: kodun gittiği adres */
.bva-sent { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px; background: rgba(var(--bvs-acc-rgb), .08); margin-bottom: 18px; }
.bva-sent > i { font-size: 20px; color: var(--bvs-acc); }
.bva-sent b { display: block; font-weight: 600; overflow-wrap: anywhere; }
.bva-sent small { display: block; color: var(--bvs-mute); font-size: 12.5px; line-height: 1.5; }
.bva-code-links { display: flex; flex-wrap: wrap; gap: 6px 18px; margin-top: 14px; }
.bva-code-links button { border: 0; background: none; padding: 0; font: inherit; font-size: 13px; color: var(--bvs-acc); font-weight: 500; cursor: pointer; }
.bva-code-links button:disabled { color: var(--bvs-mute); cursor: default; }
.bva-code-links button:not(:disabled):hover { text-decoration: underline; }

/* Sonuç sayfasında birden çok düğme (ör. yetki yok: ana ekran · çıkış) */
.bva-btns { display: flex; flex-wrap: wrap; gap: 10px; }
.bva-btns > .bvs-btn { flex: 1 1 160px; }
.bva-ref { font-size: 12px; color: var(--bvs-mute); margin: -12px 0 20px; }
.bva-ref code { font-size: 12px; color: var(--bvs-ink); background: var(--bvs-fill); border-radius: 6px; padding: 2px 6px; }
/* Google ile giriş (Portal): formun altında "veya" ayıracı ve düğme */
.bva-form + .bvs-or { margin: 18px 0 14px; }
.bva-form ~ .bvs-google { width: 100%; }

/* ── Geniş ekranda sağdaki sayfa başlığı gizli (sol panel gösterir) ── */
@media (min-width: 900px) {
    .bva-card:has(.bvs-side) .bvs-head { display: none; }
}

/* ── Dar ekran: tek sütun, kart ekranı kaplar ── */
@media (max-width: 899.98px) {
    .bva { padding: 0; align-items: stretch; }
    body.bva-body { background: var(--bvs-card); }
    .bva-card { grid-template-columns: minmax(0, 1fr); max-width: none; min-height: 100vh; min-height: 100dvh; border: 0; border-radius: 0; box-shadow: none; }
    .bva-side { display: none; }
    .bva-logo-sm { display: block; }
    .bva-top-step { display: none; }
    .bva .bvs-prog-step { display: block; order: -2; margin-bottom: 6px; font-size: 12.5px; }
    .bva-main { padding: max(14px, env(safe-area-inset-top, 0px)) 16px 16px; }
    .bva-top { margin-bottom: 18px; }
    .bva .bvs-head h1 { font-size: 20px; }
    .bva .bvs-segs { margin-bottom: 10px; }
    .bva .bvs-prog-title { font-size: 18px; }
    .bva-center .bva-content { justify-content: flex-start; padding-top: 8px; }
}
@media (max-width: 899.98px) and (min-width: 768px) {
    .bva-main { padding: 22px 32px 28px; }
    .bva-content { max-width: 640px; width: 100%; margin: 0 auto; }
}
@media (max-width: 400px) {
    .bva-lang span { display: none; }
}