/* VFM_UI_V2 (29 Eki 2026): ortak arayuz sistemi - kompakt. style.css'ten sonra yuklenir. */
:root{--vf-r:12px;--vf-r-sm:8px;--vf-soft:rgba(15,23,42,.05);--vf-acc-soft:rgba(26,138,79,.12);--vf-shadow:0 1px 2px rgba(15,23,42,.06)}
html.dark{--vf-soft:rgba(255,255,255,.06);--vf-acc-soft:rgba(37,163,95,.17);--vf-shadow:0 1px 2px rgba(0,0,0,.3)}

/* ---------- BUTONLAR ---------- */
:root body :is(.btn,.apv-btn,.loan-btn,.lp-btn,.login-btn,.co-cta,.mp-btn,.vf-btn){
  display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:34px;padding:6px 12px;
  border-radius:var(--vf-r-sm);border:1px solid transparent;font-family:inherit;font-size:13px;font-weight:600;line-height:1.2;
  text-align:center;text-decoration:none;cursor:pointer;white-space:nowrap;box-shadow:none;
  transition:background .15s,border-color .15s,color .15s,filter .15s,transform .06s;-webkit-tap-highlight-color:transparent;
  background:var(--navy);color:#fff;border-color:var(--navy)
}
:root body :is(.btn,.apv-btn,.loan-btn,.lp-btn,.login-btn,.co-cta,.mp-btn,.vf-btn):hover{filter:brightness(1.12);color:#fff}
:root body :is(.btn,.apv-btn,.loan-btn,.lp-btn,.login-btn,.co-cta,.mp-btn,.vf-btn):active{transform:scale(.97)}
:root body :is(.btn,.apv-btn,.loan-btn,.lp-btn,.login-btn,.co-cta,.mp-btn,.vf-btn):focus-visible{outline:2px solid var(--accent);outline-offset:2px}
:root body :is(.btn-primary,.apv-btn-buy,.loan-btn,.lp-btn,.lp-btn-primary,.login-btn,.co-cta,.mp-btn-go,.btn-friend,.vf-btn-primary){background:var(--green);border-color:var(--green);color:#fff}
:root body :is(.btn-secondary,.loan-btn.alt,.lp-btn.alt,.mp-btn-no,.vf-btn-secondary){background:var(--card);border-color:var(--border);color:var(--text)}
:root body :is(.btn-secondary,.loan-btn.alt,.lp-btn.alt,.mp-btn-no,.vf-btn-secondary):hover{filter:none;border-color:var(--navy);background:var(--vf-soft);color:var(--text)}
:root body :is(.btn-ghost,.lp-btn-ghost,.btn-watch,.vf-btn-ghost){background:transparent;border-color:var(--border);color:var(--muted)}
:root body :is(.btn-ghost,.lp-btn-ghost,.btn-watch,.vf-btn-ghost):hover{filter:none;color:var(--text);border-color:var(--muted)}
:root body :is(.btn-watch-on){background:var(--vf-acc-soft);border-color:var(--green);color:var(--green)}
:root body :is(.btn-danger-outline,.vf-btn-danger){background:transparent;border-color:var(--danger);color:var(--danger)}
:root body :is(.btn-danger-outline,.vf-btn-danger):hover{filter:none;background:var(--danger);color:#fff}
:root body :is(.btn-sm,.apv-btn-xs,.vf-btn-sm){min-height:30px;padding:4px 10px;font-size:12px}
:root body :is(.btn-xs,.vf-btn-xs){min-height:26px;padding:3px 8px;font-size:11.5px;border-radius:7px}
:root body :is(.btn-lg,.vf-btn-lg){min-height:42px;padding:9px 22px;font-size:15px}
:root body :is(.btn-block,.vf-btn-block){display:flex;width:100%}
:root body :is(.btn,.apv-btn,.loan-btn,.lp-btn,.login-btn,.co-cta,.mp-btn,.vf-btn):disabled,
:root body :is(.btn,.apv-btn,.loan-btn,.lp-btn,.login-btn,.co-cta,.mp-btn,.vf-btn).disabled{opacity:.45;cursor:not-allowed;pointer-events:none;filter:none;transform:none}

/* ---------- BILESENLER ---------- */
.vf-wrap{max-width:900px;margin:0 auto;padding:10px 10px 28px}
.vf-wrap *{box-sizing:border-box}
.vf-head{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;margin:2px 0 10px}
.vf-head h1{font-size:19px;margin:0;line-height:1.2;color:var(--text)}
.vf-sub{color:var(--muted);font-size:12px;margin:3px 0 0;line-height:1.4}
.vf-pill{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;background:var(--vf-acc-soft);color:var(--text);font-size:12px;font-weight:600;text-decoration:none;white-space:nowrap}
.vf-pill.neutral{background:var(--vf-soft)}
.vf-card{background:var(--card);border:1px solid var(--border);border-radius:var(--vf-r);padding:10px;box-shadow:var(--vf-shadow);color:var(--text)}
.vf-tabs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:3px;background:var(--vf-soft);padding:3px;border-radius:10px;margin-bottom:10px}
.vf-tabs a{text-align:center;padding:6px 4px;border-radius:8px;text-decoration:none;color:var(--text);font-size:12.5px;font-weight:600;line-height:1.2;-webkit-tap-highlight-color:transparent}
.vf-tabs a.on{background:var(--card);box-shadow:0 1px 2px rgba(0,0,0,.14)}
.vf-tabs a i{font-style:normal;display:inline-block;min-width:18px;padding:0 5px;margin-left:4px;border-radius:999px;background:var(--vf-soft);font-size:10.5px;line-height:16px}
.vf-tabs a.on i{background:var(--green);color:#fff}
.vf-tabs a i.alert{background:var(--danger);color:#fff}
.vf-flash{padding:8px 10px;border-radius:8px;margin-bottom:8px;font-size:13px;font-weight:500;color:var(--text)}
.vf-flash.ok{background:rgba(26,138,79,.15)}
.vf-flash.err{background:var(--danger-bg);color:var(--danger)}
.vf-chips{display:flex;gap:5px;overflow-x:auto;padding-bottom:3px;margin-bottom:6px;scrollbar-width:none;align-items:center}
.vf-chips::-webkit-scrollbar{display:none}
.vf-chips-lbl{flex:0 0 auto;font-size:11px;font-weight:700;color:var(--muted)}
.vf-chip{position:relative;flex:0 0 auto;display:inline-flex;align-items:center;border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:999px;padding:3px 10px;font-size:12px;line-height:1.3;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent}
.vf-chip.on{background:var(--green);border-color:var(--green);color:#fff}
.vf-chip input{position:absolute;opacity:0;width:0;height:0}
.vf-chip.good.on{background:rgba(46,204,113,.16);border-color:#2ecc71;color:#1e8449}
.vf-chip.bad.on{background:rgba(231,76,60,.15);border-color:#e74c3c;color:#c0392b}
html.dark .vf-chip.good.on{color:#7ee2a8}
html.dark .vf-chip.bad.on{color:#ff9a8f}
.vf-input{min-height:34px;padding:5px 10px;border-radius:8px;border:1px solid var(--border);background:var(--card);color:var(--text);font-family:inherit;font-size:13px;max-width:100%}
.vf-input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 2px var(--vf-acc-soft)}
@media(max-width:600px){.vf-input{font-size:16px}}
.vf-switch{display:flex;align-items:center;gap:7px;font-size:12px;cursor:pointer;margin:2px 0 6px;color:var(--text)}
.vf-switch input{width:16px;height:16px;accent-color:var(--green)}
.vf-switch small{color:var(--muted)}
.vf-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.vf-stats>div{background:var(--vf-soft);border-radius:8px;padding:5px 7px;min-width:0}
.vf-stats span{display:block;font-size:10px;color:var(--muted);line-height:1.25}
.vf-stats b{display:block;font-size:12.5px;line-height:1.3;overflow-wrap:anywhere}
.vf-stats>div.acc{background:var(--vf-acc-soft)}
.vf-stats>div.off b{color:var(--muted);font-weight:500}
.vf-badge{display:inline-flex;align-items:center;gap:3px;padding:1px 7px;border-radius:999px;font-size:10.5px;font-weight:700;line-height:1.4;white-space:nowrap}
.vf-badge.ok{background:var(--vf-acc-soft);color:var(--green)}
.vf-badge.bad{background:var(--danger-bg);color:var(--danger)}
.vf-badge.warn{background:rgba(217,119,6,.15);color:#b45309}
html.dark .vf-badge.warn{color:#fbbf24}
.vf-pos{display:inline-flex;align-items:center;justify-content:center;padding:0 5px;border-radius:4px;font-size:10px;font-weight:800;color:#fff;background:#64748b;line-height:16px;letter-spacing:.02em}
.vf-pos.gk{background:#d97706}.vf-pos.def{background:#2563eb}.vf-pos.mf{background:#16a34a}.vf-pos.wg{background:#0d9488}.vf-pos.fw{background:#dc2626}
.vf-empty{background:var(--card);border:1px dashed var(--border);border-radius:var(--vf-r);padding:22px 14px;text-align:center;color:var(--muted);font-size:13px}
.vf-pager{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;margin-top:12px}
.vf-pager a,.vf-pager span{min-width:32px;min-height:32px;display:inline-flex;align-items:center;justify-content:center;padding:0 8px;border-radius:8px;border:1px solid var(--border);background:var(--card);color:var(--text);text-decoration:none;font-size:12.5px;font-weight:600}
.vf-pager span.on{background:var(--green);border-color:var(--green);color:#fff}
/* satir listesi */
.vf-list{background:var(--card);border:1px solid var(--border);border-radius:var(--vf-r);overflow:hidden;box-shadow:var(--vf-shadow)}
.vf-row{padding:8px 10px;border-top:1px solid var(--border);color:var(--text)}
.vf-row:first-child{border-top:0}
.vf-pill b.full{color:var(--danger)}
/* HIDDEN_FIX_V1: hidden ozniteligi sinif display kurallarini ezsin */
[hidden]{display:none !important}
/* STAR_COMPACT_V1 */
.vf-star{color:#e8a317;font-weight:700;white-space:nowrap;flex:0 0 auto}
html.dark .vf-star{color:#f5b942}
