/* ================= Öğrenci Taşıma Sözleşmesi ================= */
* { box-sizing: border-box; }

:root {
    --mavi: #1f5fbf;
    --mavi-koyu: #17478f;
    --gri: #6b7280;
    --kenar: #d5dae2;
    --zemin: #eef1f5;
    --kart: #ffffff;
    --metin: #1f2937;
    --kirmizi: #c0392b;
    --yesil: #1e9e5a;
}

body {
    margin: 0;
    background: var(--zemin);
    color: var(--metin);
    font-family: "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 15px;
    line-height: 1.45;
}

.wrap { max-width: 920px; margin: 0 auto; padding: 22px 16px 48px; }
.wrap-dar { max-width: 420px; }

/* ---------- Firma başlığı ---------- */
.firma-header {
    background: var(--kart); border: 1px solid var(--kenar); border-radius: 12px;
    padding: 18px 20px; display: flex; gap: 20px; align-items: center;
    justify-content: center; flex-wrap: wrap;
}
.firma-logo { display: block; height: 54px; width: auto; max-width: 100%; }
.firma-unvan { font-size: 22px; font-weight: 800; color: var(--mavi); }
.firma-alt { font-size: 11px; color: var(--gri); margin-top: 6px; }
.firma-iletisim { font-size: 11.5px; color: #4b5563; line-height: 1.6; margin-left: auto; text-align: right; }
.firma-iletisim a { color: var(--mavi); text-decoration: none; }
.firma-iletisim a:hover { text-decoration: underline; }

.sayfa-baslik {
    text-align: center; font-size: 22px; margin: 24px 0 4px; letter-spacing: .3px;
}
.aciklama { text-align: center; color: var(--gri); font-size: 13px; margin: 0 0 20px; }
.zorunlu { color: var(--kirmizi); font-weight: 700; }

/* ---------- Form ---------- */
.sozlesme-form fieldset {
    background: var(--kart); border: 1px solid var(--kenar); border-radius: 12px;
    padding: 10px 20px 20px; margin: 0 0 18px;
}
.sozlesme-form legend {
    font-weight: 700; color: var(--mavi-koyu); padding: 0 8px; font-size: 15px;
}
.satir { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 12px; }
.alan { flex: 1 1 180px; display: flex; flex-direction: column; min-width: 0; }
.alan.buyuk { flex: 2 1 260px; }
.alan.tam { flex: 1 1 100%; }
.alan label { font-size: 12.5px; font-weight: 600; color: #374151; margin-bottom: 5px; }

input[type=text], input[type=email], input[type=tel], input[type=number],
input[type=password], input[type=date], textarea, select {
    width: 100%; padding: 9px 11px; border: 1px solid var(--kenar); border-radius: 8px;
    font-size: 14px; font-family: inherit; background: #fff; color: var(--metin);
}
input:focus, textarea:focus {
    outline: none; border-color: var(--mavi); box-shadow: 0 0 0 3px rgba(31,95,191,.15);
}
textarea { resize: vertical; }

.ders-yili { display: flex; align-items: center; gap: 8px; }
.ders-yili input { text-align: center; }
.ders-yili select { text-align: center; text-align-last: center; }
.ders-yili input[readonly] { background: #eef1f5; color: #6b7280; cursor: default; border-style: dashed; }
.ders-yili span { color: var(--gri); font-weight: 700; }

.form-alt { text-align: center; margin-top: 8px; }

/* Sözleşme şartları */
.sartlar { margin: 4px 0 0; padding-left: 22px; font-size: 13px; line-height: 1.55; color: #374151; }
.sartlar li { margin-bottom: 8px; text-align: justify; }
.sartlar li::marker { font-weight: 700; color: var(--mavi-koyu); }
#ders-yili-gosterim { font-weight: 700; color: var(--mavi-koyu); }
.kabul-satir {
    display: flex; gap: 11px; align-items: center; margin-top: 16px;
    padding: 13px 15px; background: #eef4ff; border: 1px solid #cfe0ff;
    border-radius: 9px; cursor: pointer; font-size: 14px; font-weight: 600;
}
.kabul-satir input { margin: 0; width: 19px; height: 19px; flex: 0 0 auto; cursor: pointer; }
.kabul-satir span { line-height: 1.35; }

/* ---------- Butonlar ---------- */
.btn {
    display: inline-block; border: 0; cursor: pointer; text-decoration: none;
    background: var(--mavi); color: #fff; padding: 10px 18px; border-radius: 8px;
    font-size: 14px; font-weight: 600; font-family: inherit; transition: opacity .15s;
}
.btn:hover { opacity: .92; }
.btn-buyuk { padding: 13px 34px; font-size: 16px; }
.btn-kucuk { padding: 7px 13px; font-size: 13px; }
.btn-mini { padding: 5px 10px; font-size: 12px; border-radius: 6px; }
.btn-gri { background: var(--gri); }
.btn-sil { background: var(--kirmizi); }

/* ---------- Kutular ---------- */
.hata-kutu {
    background: #fdecea; border: 1px solid #f5c6cb; color: #922; border-radius: 10px;
    padding: 12px 16px; margin-bottom: 18px; font-size: 14px;
}
.hata-kutu ul { margin: 6px 0 0; padding-left: 20px; }

.tesekkur-kutu {
    background: var(--kart); border: 1px solid var(--kenar); border-radius: 14px;
    padding: 44px 30px; text-align: center; max-width: 520px; margin: 40px auto;
}
.tesekkur-ikon {
    width: 64px; height: 64px; border-radius: 50%; background: var(--yesil); color: #fff;
    font-size: 36px; line-height: 64px; margin: 0 auto 14px;
}
.tesekkur-kutu h1 { margin: 0 0 10px; font-size: 24px; }
.tesekkur-kutu p { color: #4b5563; }
.referans { margin: 16px 0 22px !important; font-size: 15px; }

/* ---------- Giriş ---------- */
.giris-kutu {
    background: var(--kart); border: 1px solid var(--kenar); border-radius: 14px;
    padding: 32px 28px; margin-top: 60px; text-align: center;
}
.giris-kutu h1 { color: var(--mavi); font-size: 22px; margin: 0 0 2px; }
.giris-logo { display: block; height: 50px; width: auto; max-width: 100%; margin: 0 auto 12px; }
.giris-alt { color: var(--gri); margin: 0 0 20px; font-size: 13px; }
.giris-kutu form { text-align: left; }
.giris-kutu label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.giris-kutu .btn { width: 100%; margin-top: 16px; }

/* ---------- Panel ---------- */
.panel-wrap { max-width: 1200px; margin: 0 auto; padding: 18px 16px 48px; }
.panel-header {
    display: flex; justify-content: space-between; align-items: center; gap: 16px;
    background: var(--kart); border: 1px solid var(--kenar); border-radius: 12px;
    padding: 14px 20px; margin-bottom: 16px; flex-wrap: wrap;
}
.panel-header strong { font-size: 17px; color: var(--mavi-koyu); }
.panel-baslik { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.panel-logo { height: 30px; width: auto; }
.panel-alt { color: var(--gri); font-size: 13px; }
.panel-header-sag { display: flex; gap: 8px; }

.arama-form { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.arama-form input { flex: 1 1 260px; }

.tablo-sarmal { overflow-x: auto; background: var(--kart); border: 1px solid var(--kenar); border-radius: 12px; }
.liste-tablo { width: 100%; border-collapse: collapse; font-size: 13.5px; white-space: nowrap; }
.liste-tablo th, .liste-tablo td { padding: 10px 12px; text-align: left; border-bottom: 1px solid #eef0f3; }
.liste-tablo thead th { background: #f6f8fb; color: #4b5563; font-size: 12px; text-transform: uppercase; letter-spacing: .3px; }
.liste-tablo tbody tr:hover { background: #f9fafc; }
.liste-tablo .vurgu { font-weight: 700; }
.liste-tablo .sag { text-align: right; }
.liste-tablo .kucuk-tarih { color: var(--gri); font-size: 12px; }
.islem-sutun { white-space: nowrap; }
.islem-sutun .btn-mini { margin-right: 4px; }
.satir-sil { display: inline; }

.bos-durum {
    background: var(--kart); border: 1px dashed var(--kenar); border-radius: 12px;
    padding: 40px; text-align: center; color: var(--gri);
}

.sayfalama { display: flex; gap: 6px; margin-top: 16px; flex-wrap: wrap; }
.sayfalama a {
    display: inline-block; padding: 7px 12px; border: 1px solid var(--kenar); border-radius: 8px;
    text-decoration: none; color: var(--metin); background: #fff; font-size: 14px;
}
.sayfalama a.aktif { background: var(--mavi); color: #fff; border-color: var(--mavi); }

.sayfa-footer {
    text-align: center; color: var(--gri); font-size: 12.5px; margin-top: 34px;
    padding-top: 18px; border-top: 1px solid var(--kenar); line-height: 1.75;
}
.sayfa-footer .footer-firma { font-weight: 700; color: #4b5563; font-size: 14px; margin-bottom: 4px; }
.sayfa-footer a { color: var(--mavi); text-decoration: none; }
.sayfa-footer a:hover { text-decoration: underline; }

/* ---------- Mobil ---------- */
@media (max-width: 640px) {
    .firma-iletisim { margin-left: 0; text-align: left; }
    .satir { gap: 12px; }
    .alan, .alan.buyuk { flex: 1 1 100%; }
}