/*
 * servis-form.css - Servis kaydi sorgulama ekraninin stilleri.
 * Kullananlar: servis-sorgulama.php (canli, woodmart temasi icinde) ve
 *              sorgu2.php (bos sayfa, test ekrani).
 *
 * ONEMLI: Tum kurallar ".s2-wrap" ya da ".sv-lb" altina kapatildi. Sayfa
 * woodmart temasinin icinde yayinlaniyor ve temanin su kurallari bizim
 * siniflarimizdan DAHA GUCLU (bu yuzden ciplak eleman secici kullanilmiyor):
 *   input[type='text']{height:var(--wd-form-height);padding:0 15px}  -> (0,1,1)
 *   a:hover{color:var(--wd-link-color-hover)}                        -> (0,1,1)
 *   :is(.btn,.button,button,[type=button]):hover{...}                -> (0,2,0)
 * ".s2-wrap .xxx" (0,2,0) ve ".sv-lb .xxx:hover" (0,2,1) bunlari gecer.
 * Ayrica bu dosya sayfada TEMA CSS'lerinden SONRA yuklenmeli.
 *
 * Belge duzeni: TEK cerceve (.sv-doc). Icerideki bolumler kutu degil, ince
 * cizgiyle ayrilir; boylece ic ice cerceve ve bos izgara hucresi olusmaz.
 */

:root {
    --sv-brand:#eb0029; --sv-brand-dark:#c00022; --sv-ink:#0f172a;
    --sv-muted:#64748b; --sv-line:#e6e8ec; --sv-bg:#f1f3f6;
    --sv-radius:16px; --sv-shadow:0 1px 2px rgba(16,24,40,.04), 0 8px 24px rgba(16,24,40,.06);
}

.s2-wrap, .s2-wrap *, .s2-wrap *::before, .s2-wrap *::after,
.sv-lb, .sv-lb *, .sv-lb *::before, .sv-lb *::after { box-sizing:border-box; }

.s2-wrap {
    max-width:880px; margin:0 auto; color:var(--sv-ink); text-align:left;
    font:15px/1.65 'Lexend Deca', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
    -webkit-font-smoothing:antialiased;
}

/* ── Sorgu formu ──────────────────────────────────────────────────────── */
.s2-wrap .s2-card {
    background:#fff; border:1px solid var(--sv-line); border-radius:var(--sv-radius);
    padding:28px; box-shadow:var(--sv-shadow); margin-bottom:20px;
}
.s2-wrap .s2-title {
    margin:0 0 4px; padding:0; font-size:21px; line-height:1.3; font-weight:700;
    letter-spacing:-.01em; color:var(--sv-ink); text-transform:none;
}
.s2-wrap .s2-sub { margin:0 0 22px; color:var(--sv-muted); font-size:13px; }
.s2-wrap .s2-sub code { background:#f1f5f9; padding:1px 6px; border-radius:5px; font-size:12px; }
.s2-wrap .s2-label {
    display:block; font-size:13px; font-weight:600; margin:0 0 7px; color:var(--sv-ink);
    text-transform:none; letter-spacing:0;
}
.s2-wrap .s2-input {
    width:100%; max-width:100%; height:auto; margin:0; padding:13px 15px;
    font:15px/1.5 inherit; color:var(--sv-ink); background:#fff;
    border:1.5px solid #dfe3e8; border-radius:11px; outline:none; box-shadow:none;
    transition:border-color .15s, box-shadow .15s;
}
.s2-wrap .s2-input:focus {
    border-color:var(--sv-brand); box-shadow:0 0 0 4px rgba(235,0,41,.10);
}
.s2-wrap .s2-btn {
    display:block; width:100%; height:auto; margin:18px 0 0; padding:14px;
    font:700 15px/1.2 inherit; letter-spacing:.02em; text-transform:uppercase; text-align:center;
    background:var(--sv-brand); color:#fff; border:0; border-radius:11px; cursor:pointer;
    box-shadow:none; transition:background .15s, transform .1s;
}
.s2-wrap .s2-btn:hover { background:var(--sv-brand-dark); color:#fff; border-color:transparent; }
.s2-wrap .s2-btn:active { transform:translateY(1px); }
.s2-wrap .s2-btn:disabled,
.s2-wrap .s2-btn:disabled:hover { background:#cbd5e1; color:#fff; cursor:not-allowed; transform:none; }
.s2-wrap .s2-hp { position:absolute; left:-9999px; opacity:0; }

/* KVKK onaylari */
.s2-wrap .s2-consent { margin:20px 0 0; font-size:13px; color:#475569; }
.s2-wrap .s2-consent label {
    display:flex; align-items:flex-start; gap:9px; margin:0 0 9px;
    font-size:13px; font-weight:500; line-height:1.55; cursor:pointer; text-transform:none;
}
.s2-wrap .s2-consent label:last-child { margin-bottom:0; }
.s2-wrap .s2-consent input[type=checkbox] {
    width:16px; height:16px; margin:3px 0 0; padding:0; flex:0 0 auto;
    accent-color:var(--sv-brand); cursor:pointer;
}
.s2-wrap .s2-consent a { color:var(--sv-brand); font-weight:600; text-decoration:none; }
.s2-wrap .s2-consent a:hover { color:var(--sv-brand-dark); text-decoration:underline; }

.s2-wrap .s2-alert { padding:15px 17px; border-radius:12px; font-size:14px; display:none; margin-bottom:20px; }
.s2-wrap .s2-alert-err { background:#fef2f2; color:#9f1239; border:1px solid #fecdd3; }
.s2-wrap .s2-warn {
    background:#fffbeb; border:1px solid #fde68a; color:#92400e;
    padding:13px 15px; border-radius:12px; font-size:13px; margin-bottom:20px;
}

/* ── Servis belgesi ───────────────────────────────────────────────────── */
/* Sonuc kutusu cercevesizdir: cerceveyi belgenin kendisi (.sv-doc) tasir. */
.s2-wrap .s2-result { margin-bottom:20px; }

.s2-wrap .sv-doc {
    background:#fff; border:1px solid var(--sv-line); border-radius:14px;
    box-shadow:0 1px 2px rgba(16,24,40,.05); overflow:hidden;
}

/* Ust bant: servis no + seri no | durum */
.s2-wrap .sv-head {
    display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between;
    padding:18px 22px; border-bottom:1px solid var(--sv-line); background:#fff;
}
.s2-wrap .sv-head-main { display:flex; flex-direction:column; min-width:0; }
.s2-wrap .sv-eyebrow {
    font-size:10.5px; font-weight:700; letter-spacing:.09em;
    text-transform:uppercase; color:var(--sv-muted);
}
.s2-wrap .sv-ref {
    font-size:22px; font-weight:800; line-height:1.25; letter-spacing:-.02em;
    font-variant-numeric:tabular-nums;
}
.s2-wrap .sv-serial { margin-top:3px; font-size:12.5px; color:var(--sv-muted); }
.s2-wrap .sv-serial b {
    font-weight:600; color:#334155; letter-spacing:.02em;
    font-family:ui-monospace, Menlo, Consolas, monospace;
}
/* Durum tek satir: "DURUM  İşlemde" */
.s2-wrap .sv-status {
    display:flex; align-items:baseline; gap:8px; position:relative;
    padding:8px 14px 8px 27px; border-radius:10px;
}
.s2-wrap .sv-status-label {
    font-size:10.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; opacity:.75;
}
.s2-wrap .sv-status strong { font-size:14.5px; font-weight:700; line-height:1.3; }
.s2-wrap .sv-status-dot {
    position:absolute; left:13px; top:50%; width:7px; height:7px; margin-top:-3px;
    border-radius:50%; background:currentColor;
}
.s2-wrap .s2-st-ok      { background:#ecfdf5; color:#047857; }
.s2-wrap .s2-st-work    { background:#fff7ed; color:#c2410c; }
.s2-wrap .s2-st-wait    { background:#eef2ff; color:#4338ca; }
.s2-wrap .s2-st-info    { background:#eff6ff; color:#1d4ed8; }
.s2-wrap .s2-st-default { background:#f3f4f6; color:#374151; }

/* Bolumler: kutu degil, ince cizgi */
.s2-wrap .sv-body { padding:0 22px; }
.s2-wrap .sv-sec { padding:16px 0; border-top:1px solid var(--sv-line); }
.s2-wrap .sv-sec:first-child { border-top:0; }
.s2-wrap .sv-sec-title {
    margin:0 0 12px; padding:0; font-size:11px; font-weight:800; line-height:1.4;
    letter-spacing:.08em; text-transform:uppercase; color:var(--sv-muted);
}

/* Tek akan tanim listesi: etiket sutunu icerige gore, en fazla 150px */
.s2-wrap .sv-list {
    display:grid; grid-template-columns:fit-content(150px) minmax(0,1fr);
    gap:9px 20px; margin:0; padding:0;
}
.s2-wrap .sv-list dt {
    margin:0; padding:1px 0 0; font-size:12.5px; font-weight:500;
    color:var(--sv-muted); white-space:nowrap;
}
.s2-wrap .sv-list dd {
    margin:0; padding:0; font-size:14.5px; font-weight:600;
    min-width:0; word-break:break-word; color:var(--sv-ink);
}
.s2-wrap .sv-mono { font-family:ui-monospace, Menlo, Consolas, monospace; font-size:13.5px; letter-spacing:.02em; padding:0; background:none; }
.s2-wrap .sv-date { font-weight:700; }
.s2-wrap .sv-tel { color:var(--sv-brand); text-decoration:none; }
.s2-wrap .sv-tel:hover { color:var(--sv-brand-dark); text-decoration:underline; }
.s2-wrap .sv-pill {
    display:inline-block; padding:2px 9px; border-radius:999px;
    font-size:11px; font-weight:700; vertical-align:1px; white-space:nowrap;
}
.s2-wrap .sv-pill-ok  { background:#ecfdf5; color:#047857; }
.s2-wrap .sv-pill-off { background:#fef2f2; color:#b91c1c; }

/* Uzun notlar */
.s2-wrap .sv-not-baslik { margin:0 0 5px; font-size:12.5px; font-weight:500; color:var(--sv-muted); }
.s2-wrap .sv-note {
    margin:0 0 14px; padding:11px 13px; font-size:14px; font-weight:400; line-height:1.65;
    color:#334155; background:#f8fafc; border:1px solid var(--sv-line); border-radius:8px;
}
.s2-wrap .sv-note:last-child { margin-bottom:0; }

/* Ucret detayi: servis formundaki kalemler */
.s2-wrap .sv-kalemler { border:1px solid var(--sv-line); border-radius:10px; overflow:hidden; }
.s2-wrap .sv-kalem {
    display:grid; grid-template-columns:minmax(0,1fr) 110px 60px 120px; gap:0 14px;
    align-items:baseline; padding:11px 14px; border-top:1px solid var(--sv-line);
    font-size:14px; color:var(--sv-ink);
}
.s2-wrap .sv-kalem:first-child { border-top:0; }
.s2-wrap .sv-kalem-bas {
    padding:8px 14px; background:#f8fafc; font-size:11px; font-weight:700;
    letter-spacing:.04em; text-transform:uppercase; color:var(--sv-muted);
}
.s2-wrap .sv-kalem > span:not(:first-child) { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.s2-wrap .sv-kalem-ad { font-weight:500; line-height:1.45; word-break:break-word; }
.s2-wrap .sv-kalem-ad small { display:block; margin-top:2px; font-size:11.5px; font-weight:400; color:var(--sv-muted); }
.s2-wrap .sv-kalem-birim, .s2-wrap .sv-kalem-adet { color:#334155; }
.s2-wrap .sv-kalem-tutar { font-weight:700; }
.s2-wrap .sv-toplamlar { margin:12px 0 0 auto; max-width:300px; font-variant-numeric:tabular-nums; }
.s2-wrap .sv-toplam-satir {
    display:flex; justify-content:space-between; gap:16px; padding:4px 14px;
    font-size:13.5px; color:#334155;
}
.s2-wrap .sv-toplam-satir b { font-weight:600; white-space:nowrap; }
.s2-wrap .sv-genel {
    margin-top:6px; padding-top:9px; border-top:1px solid var(--sv-line);
    font-size:15px; color:var(--sv-ink);
}
.s2-wrap .sv-genel b { font-weight:800; }

/* Yalniz debug: semada olmayan alanlar */
.s2-wrap .sv-extra { background:#fffdf7; margin:0 -22px; padding:16px 22px; }
.s2-wrap .sv-extra .sv-sec-title { color:#b45309; }

/* Fotograflar: servis fotograflari yatay (3:2) cekiliyor, kare kirpmiyoruz */
.s2-wrap .s2-files { display:flex; flex-wrap:wrap; gap:8px; }
.s2-wrap .s2-files a {
    display:block; border-radius:8px; overflow:hidden; border:1px solid var(--sv-line);
    transition:border-color .15s, box-shadow .15s;
}
.s2-wrap .s2-files a:hover { border-color:#cbd5e1; box-shadow:0 4px 12px rgba(16,24,40,.10); }
.s2-wrap .s2-files img { width:144px; height:96px; max-width:none; object-fit:cover; display:block; }
.s2-wrap .sv-thumb { cursor:zoom-in; }
/* Video ve PDF kutulari: fotografla ayni olcu, dosya acilana kadar indirilmez */
.s2-wrap .s2-files a.sv-kutu {
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
    width:144px; height:96px; font-size:12.5px; font-weight:600; line-height:1.2;
    text-decoration:none; cursor:pointer;
}
.s2-wrap .sv-kutu svg { width:26px; height:26px; }
.s2-wrap .s2-files a.sv-kutu-video,
.s2-wrap .s2-files a.sv-kutu-video:hover { background:#0f172a; color:#fff; }
.s2-wrap .s2-files a.sv-kutu-pdf,
.s2-wrap .s2-files a.sv-kutu-pdf:hover { background:#fff5f5; color:var(--sv-brand); }

/* Kunye: yetkili servis tek satirda */
.s2-wrap .sv-kunye {
    display:flex; flex-direction:column; gap:3px;
    padding:13px 22px; border-top:1px solid var(--sv-line); background:#fbfbfc;
    font-size:12.5px; line-height:1.5; color:var(--sv-muted);
}
.s2-wrap .sv-kunye-ust { color:#334155; font-weight:600; }
.s2-wrap .sv-ayrac { margin:0 7px; color:#cbd5e1; }

/* ── Dosya onizleme (Quick Look) - body'nin altinda, .s2-wrap DISINDA ─────── */
.sv-lb {
    position:fixed; inset:0; z-index:99999; display:flex; align-items:center; justify-content:center;
    background:rgba(8,10,16,.92); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
    opacity:0; visibility:hidden; touch-action:none; overscroll-behavior:contain;
    /* Kapanirken gorunurluk solma bitince kalkar... */
    transition:opacity .18s ease, visibility 0s linear .18s;
}
/* ...acilirken ANINDA gelir. Aksi halde gecisin ilk karesinde katman hala
   "hidden" sayiliyor ve Kapat butonuna odak verilemiyordu (yalnizca ikinci ve
   sonraki acilislarda; ilk acilista eleman yeni olusturuldugu icin gecis
   calismiyordu). */
.sv-lb.is-open { opacity:1; visibility:visible; transition:opacity .18s ease, visibility 0s; }
/* Butonlarda display:grid oldugu icin hidden ozniteligi tek basina yetmiyor */
.sv-lb [hidden] { display:none !important; }
.sv-lb .sv-lb-stage {
    position:relative; display:flex; align-items:center; justify-content:center;
    width:100%; height:100%; padding:64px 76px; overflow:hidden;
}
.sv-lb .sv-lb-img {
    max-width:100%; max-height:100%; width:auto; height:auto;
    border-radius:10px; box-shadow:0 24px 70px rgba(0,0,0,.55);
    opacity:0; transform:scale(.96); cursor:zoom-in; user-select:none; -webkit-user-drag:none;
    transition:opacity .16s ease, transform .22s ease;
}
.sv-lb.is-open .sv-lb-img.is-loaded { opacity:1; transform:scale(1); }
.sv-lb.is-open .sv-lb-img.is-zoomed { transform:scale(2.2); cursor:zoom-out; border-radius:0; }
.sv-lb .sv-lb-video {
    max-width:100%; max-height:100%; width:auto; height:auto; background:#000;
    border-radius:10px; box-shadow:0 24px 70px rgba(0,0,0,.55);
}
/* PDF: sayfalar alt alta kayar. Canli sayfa viewport'unda user-scalable=no var,
   parmakla yakinlastirma calismiyor; bu yuzden fotograftaki gibi dokununca buyur. */
.sv-lb .sv-lb-belge {
    width:100%; max-width:860px; height:100%; overflow:auto; outline:0;
    -webkit-overflow-scrolling:touch; overscroll-behavior:contain; touch-action:pan-x pan-y;
}
.sv-lb .sv-lb-sayfa {
    width:100%; margin:0 auto 12px; background:#fff; border-radius:4px; overflow:hidden; cursor:zoom-in;
}
.sv-lb .sv-lb-sayfa:last-child { margin-bottom:0; }
.sv-lb .sv-lb-sayfa canvas { display:block; width:100%; height:auto; }
.sv-lb .sv-lb-belge.is-zoomed .sv-lb-sayfa { width:200%; cursor:zoom-out; }
.sv-lb .sv-lb-btn {
    position:absolute; width:46px; height:46px; border-radius:50%; border:0; padding:0; margin:0;
    display:grid; place-items:center; cursor:pointer; color:#fff;
    background:rgba(255,255,255,.12); box-shadow:none; transition:background .15s, transform .1s;
}
.sv-lb .sv-lb-btn:hover { background:rgba(255,255,255,.24); color:#fff; border-color:transparent; }
.sv-lb .sv-lb-btn:active { transform:scale(.94); }
.sv-lb .sv-lb-btn:focus-visible { outline:2px solid #fff; outline-offset:2px; }
.sv-lb .sv-lb-btn svg { width:22px; height:22px; }
.sv-lb .sv-lb-close { top:14px; right:14px; }
.sv-lb .sv-lb-indir { top:14px; right:70px; }
.sv-lb .sv-lb-prev  { left:14px; top:50%; margin-top:-23px; }
.sv-lb .sv-lb-next  { right:14px; top:50%; margin-top:-23px; }
.sv-lb .sv-lb-count {
    position:absolute; top:26px; left:50%; transform:translateX(-50%);
    color:rgba(255,255,255,.8); font-size:13px; font-weight:600; letter-spacing:.04em;
    font-variant-numeric:tabular-nums; pointer-events:none;
}
.sv-lb .sv-lb-spin {
    position:absolute; top:50%; left:50%; width:34px; height:34px; margin:-17px 0 0 -17px;
    border:3px solid rgba(255,255,255,.2); border-top-color:#fff; border-radius:50%;
    animation:sv-spin .7s linear infinite;
}
@keyframes sv-spin { to { transform:rotate(360deg); } }
.sv-lb .sv-lb-err {
    position:absolute; display:flex; flex-direction:column; align-items:center; gap:12px;
    max-width:320px; padding:0 20px; color:#fecaca; font-size:14px; font-weight:600; text-align:center;
}
.sv-lb .sv-lb-err a,
.sv-lb .sv-lb-err a:hover {
    padding:10px 18px; border-radius:9px; background:rgba(255,255,255,.14);
    color:#fff; font-size:13px; text-decoration:none;
}
@media (prefers-reduced-motion: reduce) {
    .sv-lb, .sv-lb .sv-lb-img { transition:none; }
}

/* ── Aksiyonlar ───────────────────────────────────────────────────────── */
.s2-wrap .sv-actions {
    display:flex; flex-wrap:wrap; gap:10px; padding:14px 22px;
    border-top:1px solid var(--sv-line); background:#fff;
}
.s2-wrap .sv-btn {
    display:inline-flex; align-items:center; gap:8px; padding:11px 18px; border-radius:9px;
    text-decoration:none; font-weight:700; font-size:13px; line-height:1.2;
    transition:background .15s, transform .1s;
}
.s2-wrap .sv-btn svg { width:16px; height:16px; }
.s2-wrap .sv-btn:active { transform:translateY(1px); }
.s2-wrap .sv-btn-primary,
.s2-wrap .sv-btn-primary:hover { color:#fff; }
.s2-wrap .sv-btn-primary { background:var(--sv-brand); box-shadow:none; }
.s2-wrap .sv-btn-primary:hover { background:var(--sv-brand-dark); }
.s2-wrap .sv-btn-dark,
.s2-wrap .sv-btn-dark:hover { color:#fff; }
.s2-wrap .sv-btn-dark { background:#0f172a; }
.s2-wrap .sv-btn-dark:hover { background:#1e293b; }

/* ── Debug paneli (yalniz ?debug=<anahtar>) ───────────────────────────── */
.s2-wrap .s2-dbg { background:#0b1220; color:#e2e8f0; border-radius:var(--sv-radius); padding:20px; margin-top:20px; }
.s2-wrap .s2-dbg h2 { margin:0 0 12px; padding:0; font-size:11.5px; text-transform:uppercase; letter-spacing:.08em; color:#94a3b8; }
.s2-wrap .s2-dbg table { width:100%; border-collapse:collapse; font-size:12px; margin-bottom:16px; }
.s2-wrap .s2-dbg th, .s2-wrap .s2-dbg td { text-align:left; padding:6px 9px; border-bottom:1px solid #1e293b; background:none; color:inherit; }
.s2-wrap .s2-dbg th { color:#94a3b8; font-weight:600; }
.s2-wrap .s2-dbg pre {
    background:#020617; color:#e2e8f0; padding:13px; border:0; border-radius:10px; overflow-x:auto;
    font-size:11.5px; line-height:1.55; margin:0 0 14px; max-height:360px;
}

/* ── Mobil ────────────────────────────────────────────────────────────── */
@media (max-width:680px) {
    .s2-wrap .s2-card { padding:20px 18px; }
    .s2-wrap .sv-head, .s2-wrap .sv-kunye, .s2-wrap .sv-actions { padding-left:16px; padding-right:16px; }
    .s2-wrap .sv-body { padding:0 16px; }
    .s2-wrap .sv-extra { margin:0 -16px; padding-left:16px; padding-right:16px; }
    .s2-wrap .sv-list { grid-template-columns:1fr; gap:2px; }
    .s2-wrap .sv-list dt { font-size:11.5px; }
    .s2-wrap .sv-list dd { margin-bottom:11px; }
    .s2-wrap .sv-list dd:last-child { margin-bottom:0; }
    .s2-wrap .sv-ref { font-size:19px; }
    .s2-wrap .sv-status { width:100%; }
    .s2-wrap .sv-btn { flex:1 1 100%; justify-content:center; }
    .s2-wrap .s2-files img, .s2-wrap .s2-files a.sv-kutu { width:132px; height:88px; }
    /* Kalemler mobilde kart: aciklama ustte, altinda "1 x 899,00 TL ... 1.078,80 TL" */
    .s2-wrap .sv-kalem-bas { display:none; }
    .s2-wrap .sv-kalem:nth-child(2) { border-top:0; }
    .s2-wrap .sv-kalem { grid-template-columns:auto auto minmax(0,1fr); gap:6px 6px; padding:11px 12px; }
    .s2-wrap .sv-kalem-ad { grid-column:1 / -1; }
    .s2-wrap .sv-kalem-adet { order:2; text-align:left !important; font-size:13px; }
    .s2-wrap .sv-kalem-adet::after { content:" ×"; color:var(--sv-muted); }
    .s2-wrap .sv-kalem-birim { order:3; text-align:left !important; font-size:13px; }
    .s2-wrap .sv-kalem-tutar { order:4; }
    .s2-wrap .sv-toplamlar { max-width:none; }
    /* Mobilde oklar alta insin, fotograf tum genisligi kullansin */
    .sv-lb .sv-lb-stage { padding:60px 10px 92px; }
    .sv-lb .sv-lb-prev, .sv-lb .sv-lb-next { top:auto; bottom:22px; margin-top:0; }
    .sv-lb .sv-lb-prev { left:calc(50% - 62px); }
    .sv-lb .sv-lb-next { right:calc(50% - 62px); }
}

/* ── Yazdirma: yalnizca servis belgesi ciksin ─────────────────────────── */
@media print {
    .s2-wrap .s2-card, .s2-wrap .s2-dbg, .s2-wrap .sv-actions, .sv-lb { display:none !important; }
    .s2-wrap .sv-doc { box-shadow:none; border:none; }
}