/* ==========================================================
   Öğrenci tercih sorgulama sayfası
   ========================================================== */

.tl-sarmal { max-width: 760px; margin: 0 auto; padding: 44px 20px 70px; }

.tl-giris { text-align: center; }
.tl-giris h1 {
    font-family: var(--display); font-weight: 600; font-size: clamp(26px, 4vw, 34px);
    color: var(--lacivert); margin: 0 0 10px; letter-spacing: -.02em;
}
.tl-giris > p {
    font-size: 15.5px; color: var(--gri-koyu); line-height: 1.6;
    max-width: 52ch; margin: 0 auto 26px;
}

.tl-form { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.tl-alan {
    position: relative; display: flex; align-items: center;
    flex: 1 1 320px; max-width: 400px;
}
.tl-alan svg { position: absolute; left: 16px; color: var(--gri-acik); pointer-events: none; }
.tl-alan input {
    width: 100%; font-family: var(--govde); font-size: 15.5px;
    padding: 14px 18px 14px 46px;
    color: var(--lacivert); background: #fff;
    border: 1.5px solid var(--cizgi); border-radius: 999px; box-shadow: var(--golge-yumusak);
}
.tl-alan input:focus {
    outline: none; border-color: var(--teal); box-shadow: 0 0 0 4px var(--teal-soluk);
}
.tl-form .btn { padding: 14px 24px; }

#tlMesaj { max-width: 460px; margin: 16px auto 0; text-align: left; }
.tl-not { font-size: 13px; color: var(--gri); margin-top: 18px; }

/* Sonuç kartı */
.tl-kart {
    background: var(--kart); border: 1px solid var(--cizgi);
    border-radius: var(--r); box-shadow: var(--golge); overflow: hidden;
}
.tl-ust {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
    padding: 22px 24px; flex-wrap: wrap;
    background: linear-gradient(135deg, var(--teal-soluk), var(--buz));
    border-bottom: 1px solid var(--cizgi);
}
.tl-ad { font-family: var(--display); font-weight: 600; font-size: 21px; color: var(--lacivert); }
.tl-bilgi { font-size: 13.5px; color: var(--gri-koyu); margin-top: 3px; }
.tl-ogretmen { font-size: 12.5px; color: var(--gri); margin-top: 5px; }

.tl-liste { list-style: none; margin: 0; padding: 0; }
.tl-liste li {
    display: grid; grid-template-columns: 34px 1fr auto; gap: 14px; align-items: center;
    padding: 14px 24px; border-bottom: 1px solid var(--cizgi);
}
.tl-liste li:last-child { border-bottom: 0; }
.tl-liste li:hover { background: var(--duman); }

.tl-no {
    display: grid; place-items: center; width: 30px; height: 30px;
    font-family: var(--veri); font-size: 13px; font-weight: 600; color: #fff;
    background: linear-gradient(135deg, var(--teal), var(--teal-koyu)); border-radius: 9px;
}
.tl-govde { min-width: 0; }
.tl-program { font-family: var(--display); font-weight: 600; font-size: 15px; color: var(--lacivert); line-height: 1.25; }
.tl-uni { font-size: 13px; color: var(--gri); margin-top: 2px; }
.tl-etiket { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 7px; }

.tl-olcum { text-align: right; }
.tl-olcum .d { font-family: var(--veri); font-size: 15px; color: var(--teal-koyu); font-weight: 500; }
.tl-olcum .a { font-size: 9.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--gri-acik); }

.tl-alt {
    display: flex; align-items: center; justify-content: space-between; gap: 14px;
    padding: 16px 24px; background: var(--buz); border-top: 1px solid var(--cizgi); flex-wrap: wrap;
}
.tl-uyari { font-size: 12px; color: var(--gri); max-width: 46ch; }

@media (max-width: 560px) {
    .tl-liste li { grid-template-columns: 30px 1fr; }
    .tl-olcum { grid-column: 2; text-align: left; margin-top: 4px; }
}
.tl-araclar{display:flex;gap:10px;flex-wrap:wrap;margin:20px 0}.tl-liste li{cursor:grab;display:grid;grid-template-columns:48px minmax(0,1fr) 130px 28px;align-items:center;min-height:72px}.tl-liste li.surukleniyor{opacity:.45}.tl-tut{font-size:20px;color:#7b8b9d}.mperde{position:fixed;inset:0;background:rgba(12,25,39,.55);display:grid;place-items:center;z-index:99999}.mperde[hidden]{display:none}.mpencere{position:relative;width:min(520px,calc(100% - 28px));background:#fff;border-radius:18px;padding:28px;box-shadow:0 30px 80px rgba(0,0,0,.25)}.mpencere input{width:100%;height:48px;border:1px solid #ccd5df;border-radius:10px;padding:0 14px;margin:10px 0 16px}.mkapat{position:absolute;right:14px;top:12px;border:0;background:none;font-size:26px}@media(max-width:700px){.tl-liste li{grid-template-columns:42px minmax(0,1fr) 28px}.tl-olcum{display:none}}