/* ===== AtmosService (Views/Modules/Service/*, js/pages/service-*.js) =====
   Ortak parçalar (cf-*, sd-*, rt-in, rp-filters, sf-invite) AtmosCafe / AtmosSchool / AtmosRetail ile aynı (27-cafe.css, 28-school.css,
   31-retail.css); servise özgüler sv-*. */

.service-page { display: flex; flex-direction: column; gap: 14px; }
.service-page [hidden], .modal-overlay[data-service] [hidden] { display: none !important; }   /* display:flex/grid verilen öğelerde hidden geçerli kalsın */
.service-page .btn-sm, .modal-overlay[data-service] .btn-sm { width: auto; }
.service-page .cf-tr[data-id], .modal-overlay[data-service] .cf-tr[data-asset] { cursor: pointer; }
.service-page .cf-tr[data-id]:hover, .modal-overlay[data-service] .cf-tr[data-asset]:hover { background: var(--bg-elevated); }
.service-page .cf-tr > span, .modal-overlay[data-service] .cf-tr > span { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.service-page .cf-tr > span:last-child svg, .modal-overlay[data-service] .cf-tr > span:last-child svg { width: 16px; height: 16px; color: var(--text-muted); }
.service-page .cf-tr > span > .cf-chip, .modal-overlay[data-service] .cf-tr > span > .cf-chip { align-self: flex-start; }
.service-page .cf-tr.off, .modal-overlay[data-service] .cf-tr.off { opacity: .55; }
.service-page a.sd-kpi { color: inherit; text-decoration: none; }
.service-page a.sd-kpi:hover { border-color: var(--accent); }
.modal-overlay[data-service] .modal { max-height: 92vh; overflow-y: auto; }
.modal.sv-wide { max-width: 860px; }
.modal-overlay[data-service] input[type="color"] { height: 40px; padding: 3px; cursor: pointer; }

.sv-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; vertical-align: middle; margin-right: 2px; }
.sv-vip { width: 14px; height: 14px; color: #f59e0b; vertical-align: -2px; }
.sv-mini-list { display: flex; flex-direction: column; gap: 6px; }
.sv-mini { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 10px; background: var(--bg-elevated); color: inherit; text-decoration: none; font-size: 13px; }
.sv-mini > svg:first-child { width: 16px; height: 16px; color: var(--accent); flex: none; }
.sv-mini > span { flex: 1; }
a.sv-mini:hover { outline: 1px solid var(--accent); }

/* ---- Ayarlar ---- */
.sv-days { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.sv-day { padding: 6px 12px; border: 1px solid var(--border-strong); border-radius: 999px; background: var(--bg-surface); color: var(--text-secondary); font: inherit; font-size: 13px; cursor: pointer; }
.sv-day.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.sv-sla-table .cf-tr { grid-template-columns: 1.4fr 1fr 1fr; }
.sv-prio { display: inline-block; width: 10px; height: 10px; border-radius: 3px; vertical-align: middle; background: var(--text-muted); }
.sv-prio.normal { background: #3b82f6; }
.sv-prio.high { background: #f59e0b; }
.sv-prio.critical { background: #ef4444; }
.sv-skill-table .cf-tr { grid-template-columns: 2fr 1fr 24px; }
.sv-job-table .cf-tr { grid-template-columns: 2fr 1.2fr .8fr 1fr 24px; }
.sv-seq-table .cf-tr { grid-template-columns: 1.4fr 1fr 1fr .7fr 1fr; }

/* ---- Ekip ---- */
.sv-tech-table .cf-tr { grid-template-columns: 1.6fr 2fr 1.2fr 1fr 24px; }
.sv-team-table .cf-tr { grid-template-columns: 2fr 1.5fr 1fr 24px; }
.sv-veh-table .cf-tr { grid-template-columns: 1fr 1.4fr 2fr 1.4fr 24px; }
.sv-skill-pick { display: flex; flex-wrap: wrap; gap: 6px; }
.sv-skill { display: inline-flex; align-items: baseline; gap: 4px; padding: 6px 12px; border: 1px dashed var(--border-strong); border-radius: 999px; background: var(--bg-surface); color: var(--text-secondary); font: inherit; font-size: 13px; cursor: pointer; }
.sv-skill small { font-size: 11px; opacity: .85; }
.sv-skill.on { border-style: solid; color: #fff; }
.sv-skill.l1 { background: #64748b; border-color: #64748b; }
.sv-skill.l2 { background: #0ea5e9; border-color: #0ea5e9; }
.sv-skill.l3 { background: var(--accent); border-color: var(--accent); }

/* ---- Müşteriler ---- */
.svc-page .sv-search { min-width: 240px; flex: 1; width: auto; }
.svc-page select.sv-filter { width: auto; max-width: 260px; }
.sv-cust-table .cf-tr { grid-template-columns: 2fr 1.4fr 1fr 1.1fr 24px; }
.sv-asset-table .cf-tr { grid-template-columns: 1.8fr 1.3fr 1.3fr 1.4fr 24px; }
.sv-card-info { display: flex; flex-direction: column; gap: 10px; }
.sv-info-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px 16px; }
.sv-info-grid > div { display: flex; flex-direction: column; gap: 2px; font-size: 13.5px; }
.sv-card-acts { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sv-sec-h { margin-top: 16px; }
.sv-locs { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 8px; }
.sv-loc { 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: inherit; font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.sv-loc:disabled { cursor: default; }
.sv-loc:not(:disabled):hover { border-color: var(--accent); }
.sv-loc.off { opacity: .55; }
.sv-loc small svg { width: 12px; height: 12px; vertical-align: -2px; }
.sv-seg { display: inline-flex; border: 1px solid var(--border-strong); border-radius: 10px; overflow: hidden; margin-bottom: 10px; }
.sv-seg button { padding: 7px 16px; border: 0; background: var(--bg-surface); color: var(--text-secondary); font: inherit; font-size: 13px; cursor: pointer; }
.sv-seg button.on { background: var(--accent); color: #fff; }
.sv-map-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px 12px; margin: 8px 0; }
.sv-map-grid .field { margin: 0; display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; }
.sv-preview { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; }
.sv-preview table { border-collapse: collapse; font-size: 12px; min-width: 100%; }
.sv-preview th, .sv-preview td { padding: 5px 8px; border-bottom: 1px solid var(--border); text-align: left; white-space: nowrap; }
.sv-preview th { background: var(--bg-elevated); }
.sv-import-res { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px; border-radius: 10px; background: var(--bg-elevated); }
.sv-errors { margin: 0; padding-left: 18px; font-size: 12.5px; color: var(--text-secondary); max-height: 160px; overflow-y: auto; }

/* ---- İş emirleri ---- */
.cf-chip.info { background: var(--accent2-soft); color: var(--accent2); }
.service-page .cf-tr[data-wo], .modal-overlay[data-service] .cf-tr[data-wo] { cursor: pointer; }
.service-page .cf-tr[data-wo]:hover, .modal-overlay[data-service] .cf-tr[data-wo]:hover { background: var(--bg-elevated); }
.sv-inline { display: inline-flex; margin: 0; white-space: nowrap; }
.sv-wo-table .cf-tr { grid-template-columns: 1.8fr 1.6fr 1.3fr 1.4fr 24px; }
.sv-req-table .cf-tr { grid-template-columns: 1.8fr 1.6fr 1fr 1.4fr 24px; }
.sv-prio-chip { background: var(--bg-elevated); color: var(--text-secondary); }
.sv-prio-chip.high { background: rgba(245, 158, 11, .16); color: #b45309; }
.sv-prio-chip.critical { background: rgba(229, 72, 77, .14); color: #c2262c; }
.sv-pick-wrap { position: relative; }
.sv-pick-list { position: absolute; left: 0; right: 0; top: 100%; z-index: 30; display: flex; flex-direction: column; max-height: 280px; overflow-y: auto; margin-top: 2px;
    border: 1px solid var(--border-strong); border-radius: 10px; background: var(--bg-surface); box-shadow: 0 10px 28px rgba(0, 0, 0, .18); }
.sv-pick { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; padding: 8px 12px; border: 0; border-bottom: 1px solid var(--border); background: none; color: inherit; font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.sv-pick:hover { background: var(--bg-elevated); }
.sv-pick small { color: var(--text-muted); font-size: 12px; }
.sv-pick-none { padding: 8px 12px; }
.sv-wo-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 8px; }
.sv-wo-acts { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.sv-wo-desc { margin-top: 10px; padding: 10px 12px; border-radius: 10px; background: var(--bg-elevated); white-space: pre-wrap; font-size: 13.5px; }
.sv-checklist { display: flex; flex-direction: column; gap: 4px; }
.sv-check { display: flex; align-items: flex-start; gap: 8px; padding: 7px 10px; border-radius: 10px; background: var(--bg-elevated); font-size: 13.5px; cursor: pointer; }
.sv-check input { margin-top: 3px; }
.sv-check.done > span { text-decoration: line-through; text-decoration-color: var(--text-muted); }
.sv-check small { display: inline-block; margin-left: 6px; }
.sv-note-row { display: flex; gap: 6px; margin-bottom: 10px; }
.sv-note-row input { flex: 1; }
.sv-timeline { display: flex; flex-direction: column; border-left: 2px solid var(--border); margin-left: 6px; padding-left: 14px; }
.sv-ev { position: relative; padding: 6px 0; font-size: 13px; }
.sv-ev > i { position: absolute; left: -21px; top: 11px; width: 12px; height: 12px; border-radius: 50%; background: var(--bg-surface); border: 2px solid var(--border-strong); }
.sv-ev.status > i, .sv-ev.created > i { border-color: var(--accent); }
.sv-ev.note > i { border-color: var(--accent2); }
.sv-ev > div { display: flex; flex-direction: column; gap: 2px; }
.sv-suggest { display: flex; flex-direction: column; gap: 4px; margin: -4px 0 10px; }
.sv-sug { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 7px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-surface); color: inherit; font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.sv-sug.on, .sv-sug:hover { border-color: var(--accent); }

/* ---- Servis takvimi ---- */
.svk-bar { align-items: center; }
.svk-nav { display: inline-flex; align-items: center; gap: 4px; }
.svk-nav input { width: auto; }
.svk-view { margin: 0; }
.svk-main { display: grid; grid-template-columns: 1fr 280px; gap: 12px; align-items: start; }
.svk-board { overflow-x: auto; padding: 10px; }
.svk-day { min-width: 720px; display: flex; flex-direction: column; }
.svk-row { display: grid; grid-template-columns: 170px 1fr; min-height: 54px; border-bottom: 1px solid var(--border); }
.svk-row.off .svk-track { background: repeating-linear-gradient(135deg, transparent 0 8px, rgba(148, 163, 184, .08) 8px 16px); }
.svk-head { min-height: 26px; border-bottom: 1px solid var(--border-strong); }
.svk-name { display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 4px 8px 4px 0; font-size: 13px; min-width: 0; }
.svk-name small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.svk-track { position: relative; }
.svk-head .svk-track span { position: absolute; top: 4px; transform: translateX(-50%); font-size: 11px; color: var(--text-muted); }
.svk-work { position: absolute; top: 0; bottom: 0; background: var(--accent-soft); opacity: .45; }
.svk-now { position: absolute; top: 0; bottom: 0; width: 2px; background: #ef4444; z-index: 3; }
.svk-off { position: absolute; top: 6px; bottom: 6px; z-index: 1; border: 1px dashed var(--border-strong); border-radius: 8px; color: var(--text-muted); font: inherit; font-size: 11.5px; cursor: pointer;
    background: repeating-linear-gradient(135deg, var(--bg-surface) 0 6px, var(--bg-elevated) 6px 12px); }
.svk-job { --jc: var(--accent2); position: absolute; top: 5px; bottom: 5px; z-index: 2; display: flex; flex-direction: column; justify-content: center; padding: 2px 6px; overflow: hidden;
    border: 0; border-left: 4px solid var(--jc); border-radius: 8px; background: var(--bg-elevated); color: inherit; font: inherit; font-size: 11.5px; text-align: left; cursor: pointer;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.svk-job b, .svk-job small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.svk-job small { color: var(--text-muted); }
.svk-job:hover { outline: 2px solid var(--jc); }
.svk-job.st-en_route, .svk-job.st-in_progress { background: rgba(245, 158, 11, .16); }
.svk-job.st-completed, .svk-job.st-closed { background: rgba(22, 163, 74, .12); opacity: .8; }
.svk-job.st-waiting_parts, .svk-job.st-on_hold { background: rgba(229, 72, 77, .12); }
.svk-week { overflow-x: auto; }
.svk-week table { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 12.5px; }
.svk-week th, .svk-week td { border: 1px solid var(--border); padding: 4px; vertical-align: top; text-align: left; }
.svk-week th { background: var(--bg-elevated); white-space: nowrap; font-weight: 600; }
.svk-week th.today { color: var(--accent); }
.svk-week td { min-width: 96px; height: 54px; }
.svk-week td.off { background: repeating-linear-gradient(135deg, transparent 0 8px, rgba(148, 163, 184, .08) 8px 16px); }
.svk-dayhead { border: 0; background: none; color: inherit; font: inherit; cursor: pointer; padding: 0; }
.svk-pill { --jc: var(--accent2); display: block; width: 100%; margin-bottom: 3px; padding: 3px 6px; border: 0; border-left: 3px solid var(--jc); border-radius: 6px; background: var(--bg-elevated);
    color: inherit; font: inherit; font-size: 11.5px; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.svk-pill.st-completed, .svk-pill.st-closed { opacity: .65; }
.svk-pill-off { border-left-color: var(--text-muted); color: var(--text-muted); background: repeating-linear-gradient(135deg, var(--bg-surface) 0 6px, var(--bg-elevated) 6px 12px); }
.svk-side { position: sticky; top: 12px; max-height: 80vh; overflow-y: auto; }
.svk-un { width: 100%; border: 0; font: inherit; text-align: left; cursor: pointer; justify-content: space-between; }

/* ---- Saha operasyonu ---- */
.svo-main { display: grid; grid-template-columns: 1fr 340px; gap: 12px; align-items: start; }
.svo-map { height: calc(100vh - 260px); min-height: 420px; border: 1px solid var(--border); border-radius: 16px; overflow: hidden; z-index: 0; }
.svo-map.picking, .svo-map.picking .leaflet-container { cursor: crosshair; }
.svo-side { display: flex; flex-direction: column; gap: 12px; max-height: calc(100vh - 260px); min-height: 420px; overflow-y: auto; }
.svo-routes { display: flex; flex-direction: column; gap: 6px; }
.svo-tech { display: flex; align-items: center; gap: 8px; padding: 6px 4px; font-size: 13px; }
.svo-tech > div { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.svo-tech.off { opacity: .55; }
.svo-compare { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 10px; }
.svo-compare > div { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px; border-radius: 10px; background: var(--bg-elevated); }
.svo-compare b { font-size: 17px; }
.svo-plan-route { border-top: 1px solid var(--border); padding-top: 6px; }
.svo-stop { display: flex; gap: 8px; align-items: flex-start; padding: 4px 4px 4px 10px; font-size: 12.5px; border-radius: 8px; }
.svo-stop.changed { background: var(--accent-soft); }
.svo-seq { flex: none; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; color: #fff; font-size: 11px; font-weight: 800; }
.svo-techpick { display: flex; flex-direction: column; gap: 2px; }

@media (max-width: 960px) {
    .svo-main { grid-template-columns: 1fr; }
    .svo-map { height: 60vh; }
    .svo-side { max-height: none; min-height: 0; }
    .svk-main { grid-template-columns: 1fr; }
    .svk-side { position: static; max-height: none; }
}

@media (max-width: 760px) {
    .sv-wo-table .cf-tr, .sv-req-table .cf-tr { grid-template-columns: 2fr 1.3fr 24px; }
    .sv-wo-table .cf-tr > span:nth-child(2), .sv-wo-table .cf-tr > span:nth-child(3),
    .sv-req-table .cf-tr > span:nth-child(2), .sv-req-table .cf-tr > span:nth-child(3) { display: none; }
    .svk-row { grid-template-columns: 110px 1fr; }
    .sv-job-table .cf-tr { grid-template-columns: 2fr 1fr 24px; }
    .sv-job-table .cf-tr > span:nth-child(2), .sv-job-table .cf-tr > span:nth-child(4) { display: none; }
    .sv-seq-table .cf-tr { grid-template-columns: 1.2fr 1fr 1fr; }
    .sv-seq-table .cf-tr > span:nth-child(4), .sv-seq-table .cf-tr > span:nth-child(5) { display: none; }
    .sv-tech-table .cf-tr { grid-template-columns: 1.6fr 1fr 24px; }
    .sv-tech-table .cf-tr > span:nth-child(2), .sv-tech-table .cf-tr > span:nth-child(3) { display: none; }
    .sv-veh-table .cf-tr { grid-template-columns: 1fr 1.6fr 24px; }
    .sv-veh-table .cf-tr > span:nth-child(2), .sv-veh-table .cf-tr > span:nth-child(4) { display: none; }
    .sv-cust-table .cf-tr { grid-template-columns: 2fr 1.2fr 24px; }
    .sv-cust-table .cf-tr > span:nth-child(3), .sv-cust-table .cf-tr > span:nth-child(4) { display: none; }
    .sv-asset-table .cf-tr { grid-template-columns: 2fr 1.3fr 24px; }
    .sv-asset-table .cf-tr > span:nth-child(2), .sv-asset-table .cf-tr > span:nth-child(3) { display: none; }
    .svc-page .sv-search { min-width: 0; width: 100%; }
}

/* ---- Yedek parça ve stok ---- */
.sv-part-table .cf-tr { grid-template-columns: 2fr 1.3fr 1.1fr 1fr 24px; }
.sv-stock-table .cf-tr { grid-template-columns: 2fr 1.5fr 1fr 1fr; }
.sv-doc-table .cf-tr { grid-template-columns: 1.4fr 2fr .8fr 1.2fr 24px; }
.sv-move-table .cf-tr { grid-template-columns: 1.1fr 2fr 1.6fr .8fr; }
.sv-wh-table .cf-tr { grid-template-columns: 2fr 1.6fr 1.2fr 24px; }
.sv-docline-table .cf-tr { grid-template-columns: 2fr 1fr 1.2fr 28px; }
.sv-wopart-table .cf-tr { grid-template-columns: 2fr .9fr 1fr 28px; }
.sv-neg { color: #c2262c; }
.sv-pos { color: #15803d; }
.sv-part-add { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 6px; }
.sv-part-name { flex: 1 1 220px; }
.sv-part-qty { width: 70px; }
.sv-part-price { width: 100px; }
.sv-pick.on { background: var(--bg-elevated); }

@media (max-width: 760px) {
    .sv-part-table .cf-tr { grid-template-columns: 2fr 1fr 24px; }
    .sv-part-table .cf-tr > span:nth-child(2), .sv-part-table .cf-tr > span:nth-child(4) { display: none; }
    .sv-doc-table .cf-tr { grid-template-columns: 1.4fr 1.6fr 24px; }
    .sv-doc-table .cf-tr > span:nth-child(3), .sv-doc-table .cf-tr > span:nth-child(4) { display: none; }
    .sv-move-table .cf-tr { grid-template-columns: 2fr 1.4fr .8fr; }
    .sv-move-table .cf-tr > span:nth-child(1) { display: none; }
}

/* ---- Teknisyen uygulaması (Görevlerim) ---- */
.svt-page { display: flex; flex-direction: column; gap: 12px; }
.svt-page #svtListView, .svt-page #svtJobView { display: flex; flex-direction: column; gap: 12px; }
.svt-page [hidden] { display: none !important; }
.svt-job.on { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft); }
.svt-job .sdr-trip-m svg { width: 13px; height: 13px; vertical-align: -2px; }
.svt-done summary { cursor: pointer; font-weight: 600; padding: 6px 0; }
.svt-done .sdr-trips { margin-top: 8px; }
.svt-second { background: var(--bg-elevated); color: var(--text-primary); border: 1px solid var(--border-strong); }
.svt-acts-row { display: flex; gap: 8px; flex-wrap: wrap; }
.svt-acts-row:empty { display: none; }
.svt-card { display: flex; flex-direction: column; gap: 8px; padding: 14px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-surface); }
.svt-card-h { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.svt-links { display: flex; gap: 8px; flex-wrap: wrap; }
.svt-row { display: flex; flex-direction: column; gap: 1px; font-size: 14px; }
.svt-line { flex-direction: row; justify-content: space-between; gap: 10px; padding: 6px 0; border-top: 1px solid var(--border); }
.svt-checks { display: flex; flex-direction: column; gap: 4px; }
.svt-check { padding: 10px 4px; font-size: 15px; }
.svt-check input { width: 22px; height: 22px; }
.svt-part-add { display: flex; flex-direction: column; gap: 6px; }
.svt-part-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.svt-part-row .rt-in { flex: 1 1 160px; }
.svt-part-row .svt-qty { flex: 0 0 70px; }
.svt-file { cursor: pointer; }
.svt-photos { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
.svt-photo { position: relative; display: block; border-radius: 10px; overflow: hidden; border: 1px solid var(--border); aspect-ratio: 1; background: var(--bg-elevated); }
.svt-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.svt-photo small { position: absolute; left: 0; right: 0; bottom: 0; padding: 2px 6px; font-size: 11px; color: #fff; background: rgba(0, 0, 0, .55); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.svt-photo.wait { opacity: .7; }
.svt-pad { width: 100%; height: auto; aspect-ratio: 600 / 220; border: 1px dashed var(--border-strong); border-radius: 12px; background: #fff; touch-action: none; }
.svt-sig { display: block; max-width: 240px; margin-top: 6px; border: 1px solid var(--border); border-radius: 8px; background: #fff; }

/* İş emri penceresi: fotoğraf ve imza */
.sv-files { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 8px; }
.sv-file { position: relative; display: block; border-radius: 10px; overflow: hidden; border: 1px solid var(--border); aspect-ratio: 1; background: var(--bg-elevated); }
.sv-file img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sv-file button { position: absolute; top: 4px; right: 4px; }
.sv-sign-img { max-width: 220px; border: 1px solid var(--border); border-radius: 8px; background: #fff; display: block; margin-top: 4px; }
/* Saha operasyonu: teknisyenin canlı konumu */
.sr-pin.live { background: #2563eb; border: 3px solid #fff; box-shadow: 0 0 0 3px rgba(37, 99, 235, .35); border-radius: 50%; }
.sr-pin.live.stale { background: #94a3b8; box-shadow: 0 0 0 3px rgba(148, 163, 184, .35); }

/* ---- Teklif ve faturalar ---- */
.svf-page .sd-kpi { border: 1px solid var(--border); background: var(--bg-surface); color: var(--text-primary); font: inherit; text-align: left; cursor: pointer; }
.svf-quote-table .cf-tr { grid-template-columns: 1.1fr 2.4fr 1.1fr 1fr; }
.svf-inv-table .cf-tr { grid-template-columns: 1.3fr 2fr 1.6fr 1.1fr; }
.svf-un-table .cf-tr { grid-template-columns: 1.2fr 2.4fr 1.2fr 1fr; cursor: pointer; }
.svf-un-table .cf-tr.off { opacity: .5; }
.svf-pay-table .cf-tr { grid-template-columns: 1.1fr 2fr 1.2fr 1fr 28px; }
.svf-pay-table .cf-tr.off, .svf-exp-table .cf-tr.off { opacity: .6; }
.svf-rec-table .cf-tr { grid-template-columns: 2fr 1.1fr 2.4fr 24px; cursor: pointer; }
.svf-exp-table .cf-tr { grid-template-columns: 1.2fr 2fr 1.2fr 1fr 28px; }
.svf-item-table .cf-tr { grid-template-columns: 2fr 1fr 1.4fr 24px; cursor: pointer; }
.svf-st-table .cf-tr { grid-template-columns: 1fr 2.2fr 1fr 1fr 1.1fr; }
.svf-st-table [data-openinv] { cursor: pointer; }
.svf-doc { max-width: 980px; }
.svf-line-table .cf-tr { grid-template-columns: 3fr 1.3fr 1fr .7fr .7fr 1fr 28px; align-items: start; }
.svf-line-table .rt-in { width: 100%; min-width: 0; padding: 6px 8px; }
.svf-line-table .svf-qty { display: flex; gap: 4px; }
.svf-line-table .svf-qty .svf-unit { max-width: 64px; }
.svf-line-add { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 8px 0; }
.svf-line-add select { max-width: 260px; }
.svf-totals { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; margin: 6px 0 10px; }
.svf-totals div { display: flex; gap: 18px; min-width: 260px; justify-content: space-between; }
.svf-totals .grand { font-size: 16px; border-top: 1px solid var(--border-strong); padding-top: 4px; }

@media (max-width: 760px) {
    .svf-quote-table .cf-tr, .svf-inv-table .cf-tr { grid-template-columns: 1.2fr 2fr 1fr; }
    .svf-quote-table .cf-tr > span:nth-child(3), .svf-inv-table .cf-tr > span:nth-child(3) { display: none; }
    .svf-pay-table .cf-tr, .svf-exp-table .cf-tr { grid-template-columns: 1.2fr 1.8fr 1fr 28px; }
    .svf-pay-table .cf-tr > span:nth-child(3), .svf-exp-table .cf-tr > span:nth-child(3) { display: none; }
    .svf-rec-table .cf-tr { grid-template-columns: 2fr 1.2fr 24px; }
    .svf-rec-table .cf-tr > span:nth-child(3) { display: none; }
    .svf-line-table .cf-tr { grid-template-columns: 1fr 1fr; }
    .svf-line-table .cf-th { display: none; }
    .svf-line-table .cf-tr > span:first-child { grid-column: 1 / -1; }
}
.svi-page { display: flex; flex-direction: column; gap: 12px; }
.svi-einv-table .cf-tr { grid-template-columns: 1.6fr 1.6fr 1fr 1.8fr 64px; }
@media (max-width: 760px) {
    .svi-einv-table .cf-tr { grid-template-columns: 1.6fr 1.4fr 64px; }
    .svi-einv-table .cf-tr > span:nth-child(3), .svi-einv-table .cf-tr > span:nth-child(4) { display: none; }
}

/* ---- Sözleşmeler ve bakım ---- */
.scc-table .cf-tr { grid-template-columns: 1.6fr 1.8fr 1.6fr 1fr; cursor: pointer; }
.scp-table .cf-tr { grid-template-columns: 2.2fr 1.3fr 1.4fr .8fr; cursor: pointer; }
.scp-table .cf-tr.off { opacity: .55; }
.scc-cover { display: flex; flex-direction: column; gap: 2px; max-height: 260px; overflow: auto; padding: 6px; border: 1px solid var(--border); border-radius: 10px; }
.scc-cover .scc-asset { padding-left: 26px; font-size: 13px; }
@media (max-width: 760px) {
    .scc-table .cf-tr, .scp-table .cf-tr { grid-template-columns: 1.6fr 1.2fr; }
    .scc-table .cf-tr > span:nth-child(n+3), .scp-table .cf-tr > span:nth-child(n+3) { display: none; }
}
/* ---- Ayarlar → müşteri portalı ---- */
.sptl-link { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 6px 0; }
.sptl-link .rt-in { flex: 1 1 320px; }
.sptl-events { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 6px 0; }
.sptl-test { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.sptl-table .cf-tr { grid-template-columns: 1.2fr 2.6fr 1fr; }

/* ---- Müşteri sayfaları (talep formu, takip) ---- */
.spub-page { min-height: 100vh; display: flex; justify-content: center; padding: 28px 16px 60px; background: var(--bg-app, var(--bg-elevated)); }
.spub-card { width: 100%; max-width: 640px; display: flex; flex-direction: column; gap: 12px; padding: 22px; border: 1px solid var(--border); border-radius: 18px; background: var(--bg-surface); height: fit-content; }
.spub-card h1 { font-family: var(--font-display); font-size: 21px; margin: 0; }
.spub-card h3 { font-size: 15px; margin: 10px 0 0; }
.spub-head { display: flex; gap: 12px; align-items: center; }
.spub-head > svg { width: 38px; height: 38px; color: var(--accent); }
.spub-intro { margin: 0; }
.spub-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.spub-time { display: flex; gap: 6px; align-items: center; }
.spub-submit { width: 100%; justify-content: center; padding: 12px; }
.spub-ok { display: flex; gap: 8px; align-items: center; color: #15803d; font-weight: 600; }
.spub-status { font-size: 16px; font-weight: 600; margin: 0; }
.spub-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; }
.spub-steps li { font-size: 11.5px; text-align: center; padding-top: 10px; border-top: 4px solid var(--border); color: var(--text-muted); }
.spub-steps li.done { border-color: var(--accent); color: var(--text-secondary); }
.spub-steps li.on { border-color: var(--accent); color: var(--text-primary); font-weight: 700; }
.spub-info { display: flex; gap: 8px; align-items: center; font-size: 14px; }
.spub-info svg { width: 16px; height: 16px; color: var(--accent); }
.spub-quote { border: 1px solid var(--border); border-radius: 12px; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.spub-quote-h { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.spub-quote-h .cf-chip { margin-left: auto; }
.spub-lines { width: 100%; border-collapse: collapse; font-size: 13px; }
.spub-lines td { padding: 4px 4px 4px 0; border-bottom: 1px solid var(--border); }
.spub-lines td:last-child { text-align: right; white-space: nowrap; }
.spub-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.spub-parts { margin: 0; padding-left: 18px; font-size: 14px; }
.spub-stars { display: flex; gap: 4px; }
.spub-stars button { font-size: 30px; line-height: 1; background: none; border: 0; color: var(--border-strong); cursor: pointer; padding: 0 2px; }
.spub-stars button.on { color: #f59e0b; }
.spub-timeline { list-style: none; margin: 0; padding: 0; font-size: 13.5px; display: flex; flex-direction: column; gap: 4px; }
.spub-timeline small { color: var(--text-muted); margin-right: 6px; }
.spub-call { justify-content: center; }

/* ---- Raporlar ---- */
.svr-page { display: flex; flex-direction: column; gap: 12px; }
.svr-page .cd-chart { position: relative; height: 240px; }
.svr-table .cf-tr { grid-template-columns: 2fr repeat(5, 1fr); }
@media (max-width: 760px) { .svr-table .cf-tr { grid-template-columns: 1.6fr repeat(5, 1fr); font-size: 12px; } }
.sia-table .cf-tr { grid-template-columns: 2fr 1.3fr 2fr; cursor: pointer; }
.sia-secret { word-break: break-all; font-family: ui-monospace, monospace; }
@media (max-width: 760px) { .sia-table .cf-tr { grid-template-columns: 1.6fr 1fr; } .sia-table .cf-tr > span:nth-child(3) { display: none; } }