/* ═══════════════════════════════════════
   كليفا شاين — Link Tree Page Styles
═══════════════════════════════════════ */

:root {
  --primary:      #1a2e4a;
  --accent:       #2dd4a0;
  --accent-dark:  #22b589;
  --radius:       18px;
  --transition:   all .3s cubic-bezier(.4,0,.2,1);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { font-size:16px; }
body {
  font-family:'Cairo',sans-serif; direction:rtl;
  min-height:100vh; color:#fff; position:relative; overflow-x:hidden;
  background:linear-gradient(160deg, var(--primary) 0%, #0a2b20 100%);
}

/* Decorative blobs */
.lt-bg { position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.lt-blob { position:absolute; border-radius:50%; filter:blur(90px); opacity:.35; }
.lt-blob-1 { width:420px; height:420px; background:var(--accent); top:-140px; right:-120px; }
.lt-blob-2 { width:380px; height:380px; background:#3b82f6; bottom:-160px; left:-120px; }

/* Layout */
.lt-wrap {
  position:relative; z-index:1;
  max-width:520px; margin:0 auto;
  padding:64px 20px 40px;
  display:flex; flex-direction:column; align-items:center; text-align:center;
  min-height:100vh;
}

.lt-avatar {
  width:96px; height:96px; border-radius:28px;
  background:linear-gradient(135deg, var(--accent), var(--accent-dark));
  display:flex; align-items:center; justify-content:center;
  font-size:38px; color:#fff;
  box-shadow:0 10px 30px rgba(45,212,160,.4);
  margin-bottom:20px; overflow:hidden; flex-shrink:0;
}
.lt-avatar.has-img { background:#fff; }
.lt-avatar img { width:100%; height:100%; object-fit:contain; padding:8px; }

.lt-name { font-size:26px; font-weight:900; margin-bottom:8px; }
.lt-bio {
  font-size:14px; color:rgba(255,255,255,.72); line-height:1.8;
  max-width:400px; display:none;
}
.lt-bio.show { display:block; margin-bottom:6px; }

/* Links */
.lt-links { width:100%; display:flex; flex-direction:column; gap:14px; margin-top:32px; }
.lt-link {
  display:flex; align-items:center; gap:14px;
  background:rgba(255,255,255,.08);
  border:1.5px solid rgba(255,255,255,.14);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-radius:16px; padding:16px 20px;
  color:#fff; text-decoration:none; font-weight:700; font-size:15px;
  transition:var(--transition);
}
.lt-link:hover {
  background:var(--accent); border-color:var(--accent);
  transform:translateY(-3px); box-shadow:0 12px 28px rgba(45,212,160,.35);
}
.lt-link-icon {
  width:38px; height:38px; flex-shrink:0; border-radius:10px;
  background:rgba(255,255,255,.12);
  display:flex; align-items:center; justify-content:center; font-size:16px;
  transition:var(--transition);
}
.lt-link:hover .lt-link-icon { background:rgba(255,255,255,.25); }
.lt-link-title { flex:1; text-align:center; }
.lt-link-arrow { font-size:13px; opacity:.55; }

.lt-empty { color:rgba(255,255,255,.5); font-size:14px; margin-top:8px; }

.lt-home-link {
  margin-top:auto; padding-top:36px;
  color:rgba(255,255,255,.6); font-size:13px;
  display:inline-flex; align-items:center; gap:8px; text-decoration:none;
  transition:.2s;
}
.lt-home-link:hover { color:#fff; }

.lt-footer {
  position:relative; z-index:1; text-align:center;
  padding:20px; color:rgba(255,255,255,.4); font-size:12px;
}

@media (max-width:480px) {
  .lt-wrap  { padding:48px 16px 32px; }
  .lt-avatar{ width:80px; height:80px; font-size:32px; border-radius:22px; }
  .lt-name  { font-size:22px; }
  .lt-link  { padding:14px 16px; font-size:14px; }
}
