.ft-panel { position:relative; text-align:center; }

.ft-durum {
  position:absolute; top:14px; right:16px;
  font-size:.66rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ucuz-sonuk2); border:1px solid var(--ucuz-border); border-radius:20px; padding:3px 12px;
}
.ft-durum.is-run { color:var(--ucuz-green); border-color:rgba(58,208,125,.4); background:rgba(58,208,125,.08); }
.ft-durum.is-pause { color:var(--ucuz-gold); border-color:rgba(242,179,61,.4); background:rgba(242,179,61,.08); }
.ft-durum.is-done { color:var(--ucuz-sonuk); }

.ft-sonraki { padding:22px 8px 6px; }
.ft-etiket { font-size:.66rem; text-transform:uppercase; letter-spacing:.14em; color:var(--ucuz-sonuk2); }
.ft-mob {
  margin-top:6px; font-size:1.8rem; font-weight:800; line-height:1.15; color:var(--ucuz-metin);
  text-wrap:balance; min-height:2.1rem;
}
.ft-kalan {
  margin-top:6px; font-size:3.6rem; font-weight:800; line-height:1;
  font-variant-numeric:tabular-nums; color:var(--ucuz-gold);
}
.ft-kalan.is-soon { color:var(--ucuz-red); animation:ftPulse .5s ease-in-out infinite alternate; }
@keyframes ftPulse { from { opacity:1; } to { opacity:.45; } }
.ft-alt { margin-top:6px; font-size:.8rem; color:var(--ucuz-sonuk); min-height:1.2rem; }

.ft-bar { height:6px; border-radius:3px; background:var(--ucuz-dark); border:1px solid var(--ucuz-border); overflow:hidden; margin-top:16px; }
.ft-bar i { display:block; height:100%; width:0; background:var(--ucuz-gold); transition:width .25s linear; }

.ft-gecen { margin-top:10px; font-size:.82rem; color:var(--ucuz-sonuk); }
.ft-gecen strong { color:var(--ucuz-metin); font-variant-numeric:tabular-nums; margin:0 4px; }
.ft-gecen span { margin-left:8px; }

.ft-liste { flex:1; min-height:0; max-height:460px; overflow-y:auto; border:1px solid var(--ucuz-border); border-radius:10px; }
.ft-liste::-webkit-scrollbar { width:8px; }
.ft-liste::-webkit-scrollbar-track { background:transparent; }
.ft-liste::-webkit-scrollbar-thumb { background:rgba(113,113,122,.55); border-radius:9999px; }

.ft-satir {
  display:flex; align-items:center; gap:12px; width:100%; text-align:left;
  padding:8px 12px; border:0; border-bottom:1px solid rgba(36,44,59,.5);
  background:transparent; color:var(--ucuz-metin2); cursor:pointer; transition:.12s;
}
.ft-satir:last-child { border-bottom:0; }
.ft-satir:hover { background:rgba(255,255,255,.03); }
.ft-satir .no { width:26px; flex-shrink:0; font-size:.7rem; color:var(--ucuz-sonuk3); font-variant-numeric:tabular-nums; }
.ft-satir .zm { width:52px; flex-shrink:0; font-size:.82rem; font-weight:700; color:var(--ucuz-sonuk); font-variant-numeric:tabular-nums; }
.ft-satir .ad { flex:1; min-width:0; font-size:.85rem; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ft-satir.is-past { opacity:.4; }
.ft-satir.is-next { background:rgba(242,179,61,.1); }
.ft-satir.is-next .zm, .ft-satir.is-next .ad { color:var(--ucuz-gold); }

@media (max-width:575.98px) {
  .ft-mob { font-size:1.4rem; }
  .ft-kalan { font-size:2.8rem; }
  .ft-durum { position:static; display:inline-block; margin-bottom:4px; }
}