/* style.css — modern dokunuşlar */

:root{
  --bg:#f6f7f9;
  --card:#ffffff;
  --muted:#6b7280;
  --line:#e5e7eb;
  --primary:#059669; /* emerald-600 */
  --primary-700:#047857;
  --chip:#f3f4f6;
  --danger:#dc2626;
}
html,body{background:var(--bg);}

.container{padding-left:1rem;padding-right:1rem;}
.card{background:var(--card);border-radius:16px;box-shadow:0 8px 24px rgba(17,24,39,.06);border:1px solid var(--line);}
.card-alt{background:#fff;border:1px solid var(--line);border-radius:16px;}

.h1{font-size:1.625rem;line-height:1.2;font-weight:800;}
.h2{font-size:1.375rem;line-height:1.3;font-weight:700;}
.h3{font-size:1.125rem;line-height:1.35;font-weight:700;}
.h4{font-size:1rem;line-height:1.35;font-weight:700;}

.badge{background:var(--chip);border:1px solid var(--line);padding:.2rem .5rem;border-radius:10px;font-size:.825rem;}

.muted{color:var(--muted);}
.link{color:#065f46;text-decoration:underline;text-decoration-color:rgba(16,185,129,.35);text-underline-offset:4px;}
.link:hover{text-decoration-color:rgba(16,185,129,.6);}

.stat{border:1px solid var(--line);border-radius:14px;padding:1rem;background:#fff;}
.stat-label{color:var(--muted);font-size:.9rem;margin-bottom:.25rem}
.stat-value{font-size:1.5rem;font-weight:700}
.stat-hint{font-size:.8rem;color:var(--muted);margin-top:.3rem}
.pill{background:#f9fafb;border:1px solid var(--line);border-radius:10px;padding:.5rem .75rem}

.input{border:1px solid var(--line);border-radius:10px;height:42px;padding:.5rem .75rem;background:#fff}
.input:focus{outline:2px solid rgba(16,185,129,.25);border-color:var(--primary)}

.btn{height:40px;padding:0 14px;border-radius:10px;border:1px solid var(--line);background:#fff;font-weight:600}
.btn:hover{background:#f9fafb}
.btn-primary{background:var(--primary);color:#fff;border-color:var(--primary)}
.btn-primary:hover{background:var(--primary-700)}
.btn-ghost{background:#fff;border:1px solid var(--line)}
.btn-chip{background:#fff;border:1px solid var(--line)}
.btn-chip.active{background:var(--primary);color:#fff;border-color:var(--primary)}

.chip{background:var(--chip);border:1px solid var(--line);border-radius:999px;padding:.2rem .5rem;font-size:.75rem;color:#374151}

.card-link{display:flex;align-items:center;justify-content:space-between;gap:.75rem;border:1px solid var(--line);border-radius:12px;padding:.65rem .8rem;background:#fff;transition:.15s}
.card-link .title{font-weight:600;color:#111827}
.card-link .hint{font-size:.8rem;color:var(--muted)}
.card-link i{opacity:.8;transform:translateX(0);transition:transform .15s}
.card-link:hover{border-color:#a7f3d0;background:#f0fdf4}
.card-link:hover i{transform:translateX(3px)}
.card-link.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.card-link.active .hint{color:#fff}
.card-link.active i{opacity:1}

.alert{background:#fffbeb;border:1px solid #f59e0b;color:#92400e;padding:12px 14px;border-radius:10px}

.list{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.item{padding:14px 16px;border-top:1px solid var(--line);background:#fff}
.list .item:first-child{border-top:0}
.item .row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.item .title{font-weight:600;color:#111827;line-height:1.3}
.item .meta{font-size:.78rem;color:var(--muted);margin-top:4px}
.item .value{font-weight:700;white-space:nowrap}

.item.error{background:#fef2f2;border-color:#fecaca;color:#b91c1c}
.item.muted{color:var(--muted)}

.news{display:flex;gap:12px;padding:12px 16px;align-items:center;text-decoration:none;color:inherit;border-top:1px solid var(--line);background:#fff;transition:background .15s,border-color .15s}
.news:first-child{border-top:0}
.news:hover{background:#f9fafb;border-color:#d1fae5}
.news .thumb{width:80px;height:56px;object-fit:cover;border-radius:10px;flex-shrink:0}
.news .title{font-weight:600;color:#111827;line-height:1.35}
.news .meta{font-size:.8rem;color:var(--muted);margin-top:4px}

.prose h2{font-size:1.25rem;line-height:1.3;font-weight:700;margin:.5rem 0  .25rem}
.prose h3{font-size:1.05rem;line-height:1.35;font-weight:700;margin:.75rem 0 .35rem}
.prose p{margin:.5rem 0;color:#374151}
.prose ul{margin:.5rem 0 .75rem 1.25rem;list-style:disc}
.prose li{margin:.25rem 0}

#tvchart{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}

/* odak görünürlüğü */
.card-link:focus-visible,
.btn:focus-visible,
.input:focus-visible{outline:2px solid rgba(16,185,129,.35);outline-offset:2px}

/* küçük ekranlar */
@media (max-width: 640px){
  .h1{font-size:1.35rem}
  .h2{font-size:1.2rem}
  .stat-value{font-size:1.3rem}
  .item .row{flex-direction:column;align-items:flex-start;gap:6px}
  .item .value{width:100%}
  .news .thumb{width:72px;height:52px}
  
/* Mobil kripto kartları */
.mobile-coin-card{
  border-radius:12px;
  transition:all 0.2s ease;
}
.mobile-coin-card:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 25px rgba(0,0,0,0.1);
}
.mobile-coin-card .coin-icon{
  width:32px;
  height:32px;
  border-radius:50%;
  flex-shrink:0;
}
.mobile-coin-card .price-section{
  text-align:right;
  flex-shrink:0;
}
.mobile-coin-card .stats-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:12px 0;
}
.mobile-coin-card .change-row{
  display:flex;
  justify-content:space-between;
  font-size:11px;
  margin-top:8px;
}

/* Altcoinler mobil kartları için özel stiller */
#altMobileCards .mobile-coin-card{
  margin-bottom:12px;
}
#altMobileCards .mobile-coin-card .grid{
  gap:8px;
}
#altMobileCards .mobile-coin-card .rounded-lg{
  padding:8px;
  min-height:60px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
#altMobileCards .mobile-coin-card .truncate{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:100%;
}
#altMobileCards .mobile-coin-card .text-xs{
  line-height:1.2;
}

/* orta ekranlar */
@media (min-width: 641px) and (max-width: 1024px){
  .h1{font-size:1.5rem}
  .stat-value{font-size:1.4rem}
}

/* yardımcı spacing */
.mt-3{margin-top:.75rem}
.mt-6{margin-top:1.5rem}

/* kart içi ayırıcı (opsiyonel) */
.divide-y > * + *{border-top:1px solid var(--line)}

/* minimal scrollbar (webkit) */
*::-webkit-scrollbar{height:10px;width:10px}
*::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:8px;border:2px solid #f3f4f6}
*::-webkit-scrollbar-thumb:hover{background:#9ca3af}