/* vpn-setup.css — Platform/uygulama kurulum kartları (web app + website ortak)
   Koyu tema için kendine yeten stiller; dış değişkenlere bağımlı değil. */
.vs-wrap{--vs-accent:#7c6aff;--vs-accent2:#00d4ff;--vs-card:rgba(255,255,255,.04);
  --vs-border:rgba(255,255,255,.10);--vs-text:#e6e8f0;--vs-text2:#9aa3b2;
  margin-top:18px;color:var(--vs-text);font-family:inherit}
.vs-head{margin-bottom:12px}
.vs-title{font-size:16px;font-weight:800;letter-spacing:.2px}
.vs-sub{font-size:12px;color:var(--vs-text2);margin-top:2px}

/* Platform sekmeleri */
.vs-tabs{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.vs-tabs::-webkit-scrollbar{display:none}
.vs-tab{flex:0 0 auto;display:inline-flex;align-items:center;white-space:nowrap;
  padding:8px 14px;border-radius:999px;cursor:pointer;font-size:13px;font-weight:600;
  background:var(--vs-card);border:1px solid var(--vs-border);color:var(--vs-text2);
  transition:.15s}
.vs-tab:hover{color:var(--vs-text)}
.vs-tab.active{color:#fff;border-color:transparent;
  background:linear-gradient(135deg,var(--vs-accent),var(--vs-accent2));
  box-shadow:0 4px 14px rgba(124,106,255,.35)}

/* Paneller / kartlar */
.vs-panel{display:none;margin-top:12px}
.vs-panel.active{display:grid;gap:12px}
@media(min-width:560px){.vs-panel.active{grid-template-columns:1fr 1fr}}

.vs-card{background:var(--vs-card);border:1px solid var(--vs-border);border-radius:14px;
  padding:14px;display:flex;flex-direction:column;gap:10px}
.vs-card-head{display:flex;align-items:center;gap:11px}
.vs-card-meta{min-width:0}
.vs-card-name{font-size:14px;font-weight:700;color:#fff}
.vs-card-desc{font-size:11.5px;color:var(--vs-text2);line-height:1.45;margin-top:2px}

.vs-links{display:flex;flex-wrap:wrap;gap:6px}
.vs-link{font-size:11.5px;font-weight:600;text-decoration:none;color:var(--vs-text);
  padding:6px 10px;border-radius:9px;background:rgba(255,255,255,.05);
  border:1px solid var(--vs-border);transition:.15s}
.vs-link:hover{background:rgba(255,255,255,.10);border-color:var(--vs-accent)}

.vs-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.vs-btn{font-size:12px;font-weight:700;cursor:pointer;text-decoration:none;
  padding:9px 13px;border-radius:10px;border:1px solid var(--vs-border);
  display:inline-flex;align-items:center;gap:5px;transition:.15s}
.vs-btn-primary{color:#fff;border-color:transparent;
  background:linear-gradient(135deg,var(--vs-accent),var(--vs-accent2));
  box-shadow:0 4px 14px rgba(124,106,255,.30)}
.vs-btn-primary:hover{filter:brightness(1.08)}
.vs-btn-ghost{color:var(--vs-text);background:rgba(255,255,255,.05)}
.vs-btn-ghost:hover{background:rgba(255,255,255,.10)}

.vs-note{font-size:11.5px;color:var(--vs-text2);line-height:1.5;
  padding:9px 11px;border-radius:10px;background:rgba(124,106,255,.10);
  border-left:3px solid var(--vs-accent)}

/* RTL (ar/fa) */
[dir="rtl"] .vs-note{border-left:0;border-right:3px solid var(--vs-accent)}