/* ============================================================
   ATMOSSCHOOL — ortak (school-page, sc-*), Genel Bakış (sd-*), Ayarlar (ss-*), Öğrenciler (sst-*), Araçlar ve Personel (sf-*), Rotalar (sr-*), Seferler (tp-*), Şoför Uygulaması (sdr-*)
   Ortak bileşenler AtmosCafe ile aynı: cf-* (27-cafe.css). Views/Modules/School/*.cshtml, js/pages/school-*.js
   ============================================================ */

/* ---- Ortak ---- */
.school-page { display: flex; flex-direction: column; gap: 14px; }
.school-page [hidden], .modal-overlay[data-school] [hidden] { display: none !important; }   /* display:flex/grid verilen öğelerde hidden niteliği geçerli kalsın */
.school-page .btn-sm, .modal-overlay[data-school] .btn-sm { width: auto; }   /* genel .btn-sm { width:100% } kuralını ez (modallar body'de) */
.school-page .cf-tr[data-id], .school-page .sf-row, .school-page .sst-row { cursor: pointer; }
.school-page .cf-tr[data-id]:hover { background: var(--bg-elevated); }
.modal.sc-wide { max-width: 760px; }
.modal-overlay[data-school] .cf-tabs { margin-bottom: 12px; }
.modal-overlay[data-school] .cf-tab:disabled { cursor: not-allowed; }
.cf-tab.off { opacity: .45; }
.sc-due { white-space: nowrap; }
.sc-due.warn { color: #b45309; font-weight: 700; }
.sc-due.bad { color: #e5484d; font-weight: 700; }
.cf-chip svg { width: 12px; height: 12px; }

/* ---- Genel Bakış ---- */
.sd-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px; }
.sd-kpi { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 14px 16px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-surface); }
.sd-kpi > svg { width: 26px; height: 26px; flex-shrink: 0; color: var(--accent); }
.sd-kpi > div { display: flex; flex-direction: column; min-width: 0; }
.sd-kpi b { font-family: var(--font-display); font-size: 22px; color: var(--text-primary); }
.sd-kpi span { font-size: 12.5px; color: var(--text-secondary); font-weight: 600; }
.sd-kpi small { font-size: 12px; color: var(--text-muted); }
.sd-kpi.warn { border-color: rgba(245, 158, 11, .5); background: rgba(245, 158, 11, .06); }
.sd-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 14px; align-items: start; }
.sd-card { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-surface); min-width: 0; }
.sd-card-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.sd-steps { display: flex; flex-direction: column; gap: 4px; }
.sd-step { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; color: var(--text-primary); text-decoration: none; font-size: 13.5px; }
.sd-step > svg { width: 18px; height: 18px; flex-shrink: 0; color: var(--text-muted); }
.sd-step.done > svg:first-child { color: #16a34a; }
.sd-step.done span { color: var(--text-muted); }
.sd-step .sd-go { margin-left: auto; width: 16px; height: 16px; }
a.sd-step:hover { background: var(--bg-elevated); }
.sd-due-row { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--border); font-size: 13px; }
.sd-due-row:last-child { border-bottom: 0; }
.sd-due-row > svg { width: 16px; height: 16px; color: var(--text-muted); flex-shrink: 0; }
.sd-due-row > span:nth-child(2) { flex: 1; min-width: 0; }

/* ---- Ayarlar ---- */
.ss-grid { display: grid; grid-template-columns: 260px 1fr; gap: 14px; align-items: start; }
.ss-campuses, .ss-detail, .ss-general { display: flex; flex-direction: column; gap: 10px; padding: 14px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-surface); min-width: 0; }
.ss-general { max-width: 760px; }
.ss-campus-list { display: flex; flex-direction: column; gap: 6px; }
.ss-campus { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-elevated); color: var(--text-primary); font: inherit; text-align: left; cursor: pointer; }
.ss-campus span { font-size: 12px; color: var(--text-muted); }
.ss-campus.on { border-color: var(--accent); background: var(--accent-soft); }
.ss-campus.off, .ss-class.off { opacity: .55; }
.ss-campus:hover, .ss-class:hover { border-color: var(--accent); }
.ss-cname { font-family: var(--font-display); font-size: 17px; }
.ss-warn { display: flex; align-items: center; gap: 6px; color: #b45309; }
.ss-warn svg { width: 15px; height: 15px; flex-shrink: 0; }
.ss-classes-h { margin-top: 6px; }
.ss-classes { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
.ss-class { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 10px 6px; border: 1px solid var(--border-strong); border-radius: 12px; background: var(--bg-elevated); color: var(--text-primary); font: inherit; cursor: pointer; }
.ss-class span { font-size: 11.5px; color: var(--text-muted); }
.ss-radio { display: flex; flex-direction: column; gap: 6px; }
.ss-radio .wf-check { margin: 0; align-items: flex-start; }
.ss-key { display: flex; gap: 8px; align-items: center; }
.ss-key input { flex: 1; min-width: 0; }
.field.ss-short { max-width: 150px; }

/* ---- Öğrenciler ---- */
.sst-filters { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sst-filters .co-search { min-width: 220px; }
.sst-table .cf-tr { grid-template-columns: 2fr 1.1fr 1.7fr 1.3fr 24px; }
.sst-table .cf-tr > span:last-child svg { width: 16px; height: 16px; color: var(--text-muted); }
.sst-pager { display: flex; align-items: center; justify-content: center; gap: 10px; }
.sst-list { display: flex; flex-direction: column; gap: 6px; margin-bottom: 12px; }
.sst-item { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-elevated); font-size: 13.5px; }
.sst-item > svg { width: 17px; height: 17px; flex-shrink: 0; margin-top: 2px; color: var(--accent); }
.sst-item > div:nth-child(2) { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; align-items: flex-start; }
.sst-item.off { opacity: .55; }
.sst-item-h { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sst-subform { padding-top: 12px; border-top: 1px solid var(--border); }
.sst-geo { display: grid; gap: 8px; }
.sst-geo-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sst-geo-msg { font-size: 12.5px; color: var(--text-muted); flex: 1; min-width: 200px; }
.sst-geo-msg.ok { color: var(--success, #16a34a); }
.sst-geo-msg.warn { color: var(--warning, #d97706); }
.sst-geo-msg.bad { color: var(--danger, #dc2626); }
.sst-geo-map { height: 260px; border: 1px solid var(--border); border-radius: 14px; overflow: hidden; z-index: 0; }
.sst-drop { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 28px 16px; border: 2px dashed var(--border-strong); border-radius: 16px; text-align: center; color: var(--text-muted); cursor: pointer; }
.sst-drop:hover { border-color: var(--accent); }
.sst-drop svg { width: 30px; height: 30px; color: var(--accent); }
.sst-drop b { color: var(--text-primary); }
.sst-inline { align-self: flex-end; margin-bottom: 10px; }
.sst-map { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px 12px; }
.sst-mapf { display: flex; flex-direction: column; gap: 3px; font-size: 12px; font-weight: 700; color: var(--text-secondary); }
.sst-mapf select { padding: 7px 9px; border-radius: 9px; border: 1px solid var(--border); background: var(--bg-surface); color: var(--text-primary); font: inherit; font-size: 13px; font-weight: 500; }
.sst-sample { display: flex; flex-direction: column; gap: 4px; }
.sst-sample-t { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; }
.sst-sample-t table { border-collapse: collapse; font-size: 12px; white-space: nowrap; }
.sst-sample-t th, .sst-sample-t td { padding: 5px 9px; border-bottom: 1px solid var(--border); text-align: left; }
.sst-sample-t th { background: var(--bg-elevated); }
.sst-errors { font-size: 12.5px; color: var(--text-secondary); max-height: 220px; overflow-y: auto; }
.sst-errors ul { margin: 6px 0 0; padding-left: 18px; }

/* ---- Araçlar ve personel ---- */
.sf-table .cf-tr { grid-template-columns: 2fr .7fr 1.3fr 1.8fr 24px; }
.sf-table .cf-tr > span:last-child svg { width: 16px; height: 16px; color: var(--text-muted); }

@media (max-width: 900px) {
    .ss-grid, .sd-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .sd-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .sd-kpi { padding: 12px; gap: 8px; }
    .sd-kpi b { font-size: 19px; }
    .sst-table .cf-tr { grid-template-columns: 1fr auto; }
    .sst-table .cf-tr > span:nth-child(2), .sst-table .cf-tr > span:nth-child(3), .sst-table .cf-tr > span:last-child { display: none; }
    .sst-table .cf-th { display: none; }
    .sf-table .cf-tr { grid-template-columns: 1fr auto; }
    .sf-table .cf-tr > span:nth-child(2), .sf-table .cf-tr > span:nth-child(3), .sf-table .cf-tr > span:last-child { display: none; }
    .sf-table .cf-th { display: none; }
    .sst-table .cf-tr > span:nth-child(4), .sf-table .cf-tr > span:nth-child(4) { display: block; text-align: right; }   /* 27-cafe genel kuralı 4. sütunu gizliyor */
    .sst-filters { width: 100%; }
    .sst-filters .co-search { flex: 1 1 100%; min-width: 0; order: -1; }
    .field.ss-short { max-width: none; }
}

/* ---- Rotalar ---- */
.sr-grid { display: grid; grid-template-columns: 280px 1fr; gap: 14px; align-items: start; }
.sr-list { display: flex; flex-direction: column; gap: 6px; max-height: calc(100vh - 220px); overflow: auto; }
.sr-item { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-surface); color: var(--text-primary); font: inherit; text-align: left; cursor: pointer; }
.sr-item:hover { border-color: var(--accent); }
.sr-item.on { border-color: var(--accent); background: var(--accent-soft); }
.sr-item.off { opacity: .55; }
.sr-item-h { display: flex; align-items: center; gap: 8px; min-width: 0; }
.sr-item-m { font-size: 12px; color: var(--text-muted); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.sr-item-m svg { width: 13px; height: 13px; }
.sr-dot { width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0; display: inline-block; }
.sr-none { padding: 12px; }
.cf-chip.ok { background: rgba(22, 163, 74, .14); color: #15803d; }
.sr-main { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.sr-map { position: relative; height: 420px; border: 1px solid var(--border); border-radius: 16px; overflow: hidden; background: var(--bg-elevated); z-index: 0; }
.sr-map.adding, .sr-map.adding .leaflet-container { cursor: crosshair; }
.sr-map-msg { position: absolute; inset: 0; display: grid; place-items: center; color: var(--text-muted); font-size: 13px; }
.sr-pin { background: none; border: 0; }
.sr-pin b { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 800; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .35); }
.sr-pin.school { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: #0f172a; color: #fff; border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .35); }
.sr-pin.school svg { width: 16px; height: 16px; }
.sr-detail { display: flex; flex-direction: column; gap: 10px; padding: 14px 16px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-surface); }
.sr-dh { display: flex; flex-direction: column; gap: 6px; }
.sr-dtitle { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-family: var(--font-display); font-size: 18px; }
.sr-dmeta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12.5px; color: var(--text-secondary); }
.sr-dmeta span { display: inline-flex; align-items: center; gap: 4px; }
.sr-dmeta svg { width: 14px; height: 14px; color: var(--text-muted); }
/* Google Haritalar'da aç: telefonda Haritalar uygulamasında yol tarifi (uzun rota bölümlere ayrılır) */
.sr-gmaps { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; }
.sr-gmaps .cf-sub { font-size: 12px; }
.sr-dacts { display: flex; flex-wrap: wrap; gap: 6px; }
.sr-warns { list-style: none; margin: 0; padding: 8px 10px; display: flex; flex-direction: column; gap: 4px; border-radius: 10px; background: rgba(245, 158, 11, .08); border: 1px solid rgba(245, 158, 11, .35); font-size: 12.5px; color: #92400e; }
.sr-warns li { display: flex; gap: 6px; align-items: flex-start; }
.sr-warns svg { width: 14px; height: 14px; flex-shrink: 0; margin-top: 2px; }
.sr-stops-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.sr-stops-h h4, .sr-unplaced h4, .sr-geo-h { margin: 0; font-size: 14px; }
.sr-dirty { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sr-stops { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.sr-stop { display: flex; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--border); position: relative; }
.sr-stop:last-child { border-bottom: 0; }
.sr-num { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; color: #fff; font-size: 12px; font-weight: 800; flex-shrink: 0; }
.sr-num svg { width: 14px; height: 14px; }
.sr-stop.school .sr-num { border-radius: 8px; }
.sr-stop-b { display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 0; }
.sr-stop-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sr-stop-h b { flex: 1; min-width: 0; }
.sr-sname { flex: 1; min-width: 140px; padding: 5px 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-elevated); color: var(--text-primary); font: inherit; font-weight: 600; }
.sr-stime { width: 104px; padding: 5px 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-elevated); color: var(--text-primary); font: inherit; }
.sr-time { font-weight: 700; font-variant-numeric: tabular-nums; }
.sr-sacts { display: inline-flex; gap: 2px; }
.sr-sacts .icon-mini:disabled { opacity: .3; cursor: default; }
.sr-kids { display: flex; flex-wrap: wrap; gap: 5px; }
.sr-stu { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border: 1px solid var(--border); border-radius: 999px; background: var(--bg-elevated); color: var(--text-primary); font: inherit; font-size: 12.5px; cursor: pointer; }
.sr-stu:disabled { cursor: default; }
.sr-stu:not(:disabled):hover { border-color: var(--accent); }
.sr-stu small { color: var(--text-muted); }
.sr-stu svg { width: 12px; height: 12px; color: #e5484d; }
.sr-stu.warn { border-color: rgba(229, 72, 77, .5); }
.sr-move { padding: 3px 6px; border: 1px solid var(--accent); border-radius: 8px; background: var(--bg-surface); color: var(--text-primary); font: inherit; font-size: 12.5px; max-width: 240px; }
.sr-unplaced { display: flex; flex-direction: column; gap: 8px; padding-top: 6px; border-top: 1px dashed var(--border-strong); }
.sr-unplaced .btn-sm { align-self: flex-start; }
.sr-days, .sr-vlist { display: flex; flex-wrap: wrap; gap: 6px 12px; }
.sr-vlist { flex-direction: column; max-height: 240px; overflow: auto; }
.sr-day { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; cursor: pointer; }
#srRArchive { margin-right: auto; color: #e5484d; }
.sr-plan-res p { margin: 0 0 6px; font-size: 13px; }
.sr-pick { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sr-pick-col { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.sr-pick-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 30px; }
/* Yeni rota penceresi: öğrenci seçimi (school-routes.js loadNewCands) */
.sr-rmodal { max-width: 620px; }
.sr-rstu { display: flex; flex-direction: column; gap: 8px; margin-top: 4px; padding-top: 12px; border-top: 1px solid var(--border); }
.sr-rstu .sr-pick-h b { display: inline-flex; align-items: center; gap: 6px; }
.sr-rstu .sr-pick-h svg { width: 16px; height: 16px; color: var(--accent); }
.sr-pick-list.sr-rstu-list { height: auto; max-height: 260px; min-height: 80px; }
.sr-pick-list { display: flex; flex-direction: column; gap: 4px; height: 340px; overflow: auto; padding: 4px; border: 1px solid var(--border); border-radius: 12px; }
.sr-cand { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 8px; font-size: 13px; cursor: pointer; }
.sr-cand:hover { background: var(--bg-elevated); }
.sr-cand > span { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.sr-cand small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sr-cand > svg { width: 14px; height: 14px; color: #e5484d; flex-shrink: 0; }
.sr-cand.off { opacity: .5; cursor: default; }
.sr-cand.gone > span { text-decoration: line-through; opacity: .55; }
.sr-attn .cf-count { color: #b45309; }
.sr-geo-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.sr-geo-stat { display: flex; flex-direction: column; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-elevated); }
.sr-geo-stat b { font-family: var(--font-display); font-size: 20px; }
.sr-geo-stat span { font-size: 12px; color: var(--text-muted); }
.sr-geo-stat.warn b { color: #b45309; }
.sr-geo-stat.bad b { color: #e5484d; }
.sr-geo-stat.ok b { color: #15803d; }
.sr-geo-run { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sr-progress { flex: 1; min-width: 120px; height: 8px; border-radius: 999px; background: var(--bg-elevated); overflow: hidden; }
.sr-progress > div { width: 0; height: 100%; background: var(--accent); transition: width .3s; }
.sr-geo-pick { display: grid; grid-template-columns: 240px 1fr; gap: 10px; }
.sr-geo-list { display: flex; flex-direction: column; gap: 4px; height: 320px; overflow: auto; }
.sr-geo-item { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-elevated); color: var(--text-primary); font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.sr-geo-item b { display: inline-flex; align-items: center; gap: 4px; }
.sr-geo-item svg { width: 14px; height: 14px; }
.sr-geo-item.on { border-color: var(--accent); background: var(--accent-soft); }
.sr-geo-map { height: 320px; border: 1px solid var(--border); border-radius: 12px; overflow: hidden; z-index: 0; }
.sr-geo-sel { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 13px; }
.leaflet-container { font: inherit; }

@media (max-width: 900px) {
    .sr-grid { grid-template-columns: 1fr; }
    .sr-list { flex-direction: row; overflow-x: auto; max-height: none; padding-bottom: 4px; }
    .sr-item { min-width: 220px; }
    .sr-map { height: 300px; }
    .sr-pick, .sr-geo-pick { grid-template-columns: 1fr; }
    .sr-geo-stats { grid-template-columns: repeat(2, 1fr); }
    .sr-pick-list, .sr-geo-list { height: 220px; }
    .sr-geo-map { height: 260px; }
}

/* ---- Personel daveti (Araçlar) ---- */
.cf-chip.bad { background: rgba(229, 72, 77, .14); color: #c2262c; }
.sr-danger { color: #e5484d; margin-right: auto; }
.sf-invite { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px; border: 1px dashed var(--border-strong); border-radius: 12px; }
.sf-invite-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sf-invite-h > svg { width: 16px; height: 16px; color: var(--accent); }
.sf-invite-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.sf-invite-res { display: flex; flex-direction: column; gap: 8px; }
.sf-invite-code { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.sf-invite-code b { font-family: var(--font-display); font-size: 24px; letter-spacing: .08em; color: var(--accent); }
.sf-invite-link { display: flex; gap: 6px; flex-wrap: wrap; }
.sf-invite-link input { flex: 1; min-width: 180px; padding: 6px 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-elevated); color: var(--text-secondary); font: inherit; font-size: 12.5px; }

/* ---- Seferler ---- */
.tp-day { display: flex; align-items: center; gap: 4px; }
.tp-day input { padding: 6px 8px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-surface); color: var(--text-primary); font: inherit; }
.tp-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 10px; }
.tp-item { display: flex; flex-direction: column; align-items: stretch; gap: 6px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 14px; background: var(--bg-surface); color: var(--text-primary); font: inherit; text-align: left; cursor: pointer; }
.tp-item:hover { border-color: var(--accent); }
.tp-item.off { opacity: .55; }
.tp-item-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.tp-item-m { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; font-size: 12.5px; color: var(--text-muted); }
.tp-item-m svg { width: 13px; height: 13px; }
.tp-progress { height: 6px; border-radius: 999px; background: var(--bg-elevated); overflow: hidden; }
.tp-progress > span { display: block; height: 100%; background: var(--accent); }
.tp-assign { padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; }
.tp-kind { align-self: flex-start; }
.tp-kind[hidden] { display: none; }
.tp-plans-hint { flex: 1; min-width: 240px; margin: 0; }
#tpDayView, #tpPlansView { display: grid; gap: 12px; }
#tpDayView[hidden], #tpPlansView[hidden] { display: none; }
.tp-riders { display: flex; flex-direction: column; gap: 4px; }
.tp-rider { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; }
.tp-rider > span:first-child { flex: 1; min-width: 140px; }
.tp-tel { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; color: var(--accent); text-decoration: none; }
.tp-tel svg { width: 13px; height: 13px; }

/* ---- Şoför Uygulaması (telefon) ---- */
.sdr-page { max-width: 720px; }
.sdr-net { display: flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 10px; font-size: 12.5px; font-weight: 600; background: rgba(22, 163, 74, .1); color: #15803d; }
.sdr-net svg { width: 14px; height: 14px; }
.sdr-net.wait { background: rgba(245, 158, 11, .12); color: #b45309; }
.sdr-net.off { background: rgba(229, 72, 77, .12); color: #c2262c; }
.sdr-day { display: flex; align-items: center; justify-content: space-between; font-size: 15px; text-transform: capitalize; }
.sdr-trips { display: flex; flex-direction: column; gap: 10px; }
.sdr-trip { display: flex; flex-direction: column; align-items: stretch; gap: 6px; padding: 16px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-surface); color: var(--text-primary); font: inherit; text-align: left; cursor: pointer; }
.sdr-trip.off { opacity: .55; }
.sdr-trip-h { display: flex; align-items: center; gap: 8px; font-size: 16px; }
.sdr-trip-h .cf-chip { margin-left: auto; }
.sdr-trip-m { font-size: 13px; color: var(--text-muted); }
.sdr-head { display: flex; align-items: center; gap: 10px; }
.sdr-title { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.sdr-title b { font-family: var(--font-display); font-size: 18px; }
.sdr-title span { font-size: 12.5px; color: var(--text-muted); }
.sdr-gps { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--text-secondary); }
.sdr-gps svg { width: 14px; height: 14px; color: var(--accent); }
.sdr-gps.bad, .sdr-gps.bad svg { color: #c2262c; }
.sdr-main-act { display: flex; flex-direction: column; gap: 8px; }
.sdr-big { width: 100%; justify-content: center; padding: 14px; font-size: 16px; font-weight: 700; border-radius: 14px; display: inline-flex; align-items: center; gap: 8px; }
.sdr-finish { background: #0f172a; color: #fff; border: 0; }
.sdr-gmaps { margin-top: 8px; text-decoration: none; background: var(--bg-elevated); border: 1px solid var(--border); color: var(--text-primary); }
.sdr-gmaps[hidden] { display: none; }
.sdr-stops { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.sdr-stop { display: flex; gap: 10px; padding: 12px; border: 1px solid var(--border); border-radius: 14px; background: var(--bg-surface); }
.sdr-stop.next { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.sdr-stop.school .sr-num { border-radius: 8px; background: var(--text-primary); }
.sdr-stop-b { display: flex; flex-direction: column; gap: 8px; flex: 1; min-width: 0; }
.sdr-stop-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.sdr-stop-h b { flex: 1; min-width: 0; }
.sdr-rider { display: flex; flex-direction: column; gap: 6px; padding-top: 8px; border-top: 1px solid var(--border); }
.sdr-rider-n { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 14px; }
.sdr-rider-n .cf-chip { margin-left: auto; }
.sdr-acts { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: 6px; }
.sdr-btn { padding: 12px 8px; border-radius: 12px; border: 1px solid var(--border-strong); background: var(--bg-elevated); color: var(--text-primary); font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
.sdr-btn.ok { background: #16a34a; border-color: #16a34a; color: #fff; }
.sdr-btn.bad { background: rgba(229, 72, 77, .1); border-color: rgba(229, 72, 77, .45); color: #c2262c; }
.sdr-btn.ghost { font-weight: 600; font-size: 13px; padding: 8px; }
.sdr-btn:active { transform: scale(.98); }
/* ===== Canlı Takip (Views/Modules/School/Canli.cshtml) ===== */
.stk-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); gap: 12px; align-items: start; }
.stk-mapwrap { position: relative; }
.stk-map { height: 560px; border: 1px solid var(--border); border-radius: 16px; overflow: hidden; background: var(--bg-elevated); z-index: 0; }
.stk-msg { pointer-events: none; z-index: 500; }
.stk-list { display: flex; flex-direction: column; gap: 8px; max-height: 560px; overflow-y: auto; }
.stk-item.on { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.sr-pin b svg { width: 14px; height: 14px; }
.sr-pin.stale b { filter: grayscale(1); opacity: .65; }
@media (max-width: 860px) {
    .stk-grid { grid-template-columns: 1fr; }
    .stk-map { height: 380px; }
    .stk-list { max-height: none; }
}

/* ===== Veli Uygulaması (Views/Modules/School/Veli.cshtml) ===== */
.sgv-page { max-width: 720px; }
.sgv-preview { display: flex; align-items: flex-start; gap: 6px; padding: 10px 12px; border-radius: 12px; background: var(--accent-soft); }
.sgv-preview svg { width: 16px; height: 16px; flex-shrink: 0; color: var(--accent); }
.sgv-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.sgv-head > div { display: flex; flex-direction: column; }
.sgv-head b { font-family: var(--font-display); font-size: 18px; }
.sgv-head span { font-size: 12.5px; color: var(--text-muted); }
.sgv-push { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 12px; border: 1px dashed var(--border-strong); border-radius: 12px; font-size: 13px; color: var(--text-secondary); }
.sgv-push > svg { width: 16px; height: 16px; color: var(--accent); flex-shrink: 0; }
.sgv-push span { flex: 1; min-width: 180px; }
.sgv-kids { display: flex; flex-direction: column; gap: 12px; }
.sgv-kid { display: flex; flex-direction: column; gap: 10px; padding: 16px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-surface); }
.sgv-kid-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.sgv-kid-head > div { display: flex; flex-direction: column; min-width: 0; }
.sgv-kid-head b { font-family: var(--font-display); font-size: 17px; }
.sgv-kid-head span { font-size: 12.5px; color: var(--text-muted); }
.sgv-notify { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; color: var(--text-muted); }
.sgv-notify svg { width: 16px; height: 16px; }
.sgv-notify input:checked + svg { color: var(--accent); }
.sgv-trips { display: flex; flex-direction: column; gap: 8px; }
.sgv-trip { display: flex; flex-direction: column; gap: 4px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-elevated); font-size: 13px; color: var(--text-secondary); }
.sgv-trip > div { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sgv-trip > div svg { width: 14px; height: 14px; flex-shrink: 0; }
.sgv-trip a { color: var(--accent); font-weight: 600; }
.sgv-trip-head { font-size: 14px; color: var(--text-primary); }
.sgv-trip-head span:not(.cf-chip) { color: var(--text-muted); font-size: 12.5px; }
.sgv-trip-head .cf-chip:first-of-type { margin-left: auto; }
.sgv-delay { display: inline-flex; align-items: center; gap: 4px; color: #b45309; font-weight: 600; }
.sgv-live-btn { margin-top: 6px; justify-content: center; }
.sgv-abs { display: flex; flex-direction: column; gap: 6px; }
.sgv-abs-head { display: flex; align-items: center; justify-content: space-between; font-size: 13px; font-weight: 600; color: var(--text-secondary); }
.sgv-abs ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.sgv-abs li { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 10px; border-radius: 10px; background: var(--bg-elevated); font-size: 13px; }
.sgv-live-info { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 13.5px; }
.sgv-map { height: 380px; border: 1px solid var(--border); border-radius: 14px; overflow: hidden; background: var(--bg-elevated); z-index: 0; }
.sst-ginv { margin-top: 10px; }

/* ===== Genel Bakış: bugün (Views/Modules/School/Index.cshtml) ===== */
a.sd-kpi { color: inherit; text-decoration: none; }
a.sd-kpi:hover { border-color: var(--accent); }
.sd-trips { display: flex; flex-direction: column; gap: 6px; }
.sd-trip { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px; background: var(--bg-elevated); font-size: 13px; }
.sd-trip.off { opacity: .55; }
.sd-trip-n { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.sd-trip-n b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ===== Raporlar (Views/Modules/School/Raporlar.cshtml) ===== */
.srp-full { grid-column: 1 / -1; }
.srp-students { display: flex; flex-direction: column; gap: 4px; }
.srp-st { display: flex; align-items: center; gap: 6px; padding: 6px 8px; border-radius: 10px; background: var(--bg-elevated); font-size: 13px; }
.srp-st > span:first-child { flex: 1; min-width: 0; }
.srp-routes .cf-tr { grid-template-columns: 2.2fr .8fr .9fr .7fr .6fr 1fr; }
.srp-att .cf-tr { grid-template-columns: 1.6fr 1.5fr 1.3fr .9fr .5fr .5fr; }
.srp-routes .cf-tr > span, .srp-att .cf-tr > span { min-width: 0; }
.srp-empty { padding: 12px 14px; }
@media (max-width: 640px) {
    .srp-full { grid-column: auto; }
    .srp-routes .cf-tr { grid-template-columns: 1.6fr .7fr .7fr .8fr; }
    .srp-routes .cf-tr > span:nth-child(4) { display: block; }   /* 27-cafe genel kuralı 4. sütunu gizliyor */
    .srp-routes .cf-tr > span:nth-child(3), .srp-routes .cf-tr > span:nth-child(5) { display: none; }
    .srp-att .cf-tr { grid-template-columns: 1.6fr 1fr .6fr .6fr; }
    .srp-att .cf-tr > span:nth-child(2), .srp-att .cf-tr > span:nth-child(3) { display: none; }
    .srp-att .cf-tr > span:nth-child(4) { display: block; }
}

/* ===== Ayarlar → KVKK (Views/Modules/School/Ayarlar.cshtml) ===== */
.ss-privacy { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(0, 2fr); gap: 14px; align-items: start; }
.ss-policy { display: flex; flex-direction: column; gap: 6px; }
.ss-policy-row { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px; background: var(--bg-elevated); font-size: 13px; }
.ss-policy-row svg { width: 16px; height: 16px; color: var(--accent); flex-shrink: 0; }
.ss-policy-row span { flex: 1; min-width: 0; }
.ss-logs .cf-tr { grid-template-columns: 1fr 1.4fr 1.2fr 1.4fr; }
.ss-logs .cf-tr > span { min-width: 0; overflow-wrap: anywhere; }
.ss-privacy .sd-card-h select { margin-left: auto; }
@media (max-width: 900px) {
    .ss-privacy { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
    .ss-logs .cf-tr { grid-template-columns: 1fr 1.3fr; }
    .ss-logs .cf-tr > span:nth-child(3) { display: none; }
    .ss-logs .cf-tr > span:nth-child(4) { display: block; grid-column: 1 / -1; color: var(--text-muted); font-size: 12.5px; }
    .ss-logs .cf-th > span:nth-child(4) { display: none; }
}

/* Rotalar haritası: öğrenci açılır penceresi (Rotaya dahil et / Rotadan çıkar) */
.sr-mpop { display: grid; gap: 4px; min-width: 180px; font-size: 13px; }
.sr-mpop .cf-sub { font-size: 12px; }
.sr-mpop-note { font-size: 12px; color: var(--text-secondary, #64748b); }
.sr-mpop .btn-sm { justify-self: start; margin-top: 4px; }
.sr-mpop .danger-text { margin-right: 0; }
.sr-dacts .danger-text { margin-right: 0; margin-left: auto; }
.sr-mpop-kids { display: grid; gap: 2px; margin-top: 2px; }
.sr-mpop-kids > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; }

/* Rotalar listesi: öğrenci çipinde çıkar, durağa öğrenci ekle */
.sr-stuw { display: inline-flex; align-items: center; }
.sr-stuw .sr-stu { border-top-right-radius: 0; border-bottom-right-radius: 0; border-right: 0; }
.sr-stu-x { display: inline-grid; place-items: center; height: 100%; min-height: 26px; padding: 0 6px; border: 1px solid var(--border); border-radius: 0 999px 999px 0; background: var(--bg-elevated); color: var(--text-muted); cursor: pointer; }
.sr-stu-x:hover { color: #e5484d; border-color: rgba(229, 72, 77, .5); }
.sr-stu-x svg { width: 12px; height: 12px; }
.sr-stu.sr-stu-add { border-style: dashed; color: var(--accent); }
.sr-stu.sr-stu-add svg { color: var(--accent); }

/* Şoför uygulaması: takvim + sekmeler */
.sdr-cal { display: flex; flex-direction: column; gap: 8px; }
.sdr-cal-h { display: flex; align-items: center; gap: 6px; }
.sdr-cal-pick { position: relative; display: inline-flex; align-items: center; gap: 6px; flex: 1; min-width: 0; font-size: 15px; text-transform: capitalize; cursor: pointer; }
.sdr-cal-pick b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sdr-cal-pick svg { width: 18px; height: 18px; color: var(--accent); flex: none; }
.sdr-cal-pick input { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }
.sdr-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.sdr-wd { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 6px 0; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-surface); color: var(--text-primary); font: inherit; cursor: pointer; }
.sdr-wd small { font-size: 11px; color: var(--text-muted); text-transform: capitalize; }
.sdr-wd b { font-size: 15px; }
.sdr-wd.today { border-color: var(--accent); }
.sdr-wd.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.sdr-wd.on small { color: rgba(255, 255, 255, .85); }
.sdr-tabs { overflow-x: auto; }
.sdr-note { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 12px; background: rgba(245, 158, 11, .12); color: var(--text-primary); font-size: 13.5px; }
.sdr-note svg { width: 16px; height: 16px; color: #d97706; flex: none; }

/* Şablon indir satırı + toplu ekleme önizlemesi */
.sst-tpl { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.sf-bulk-t { max-height: 320px; overflow: auto; }
.sf-bulk-t tr.bad td { color: #e5484d; }
.sf-bulk-t tr.skip td { color: var(--text-muted); }
.sf-bulk-t td:last-child { white-space: normal; min-width: 160px; }

/* Sefer penceresi: rotaya bağlantı çipi */
.tp-route { text-decoration: none; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; }
.tp-route:hover { filter: brightness(0.94); text-decoration: none; }