/* Tır / Konteyner ekranı — sınıflar arac- önekli; genel .dugme .mesaj .bos stil.css'ten */
#ekran-arac { padding: 0; }
.arac-duzen { display: grid; grid-template-columns: 380px minmax(0, 1fr); min-height: calc(100vh - 68px); }
.arac-yan { background: var(--kart); border-right: 1px solid var(--cizgi); padding: 18px; display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.arac-yan h2, .arac-plan-kap h2 { font: 600 20px/1.2 "Barlow Condensed", sans-serif; margin: 0 0 10px; }
.arac-blok { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.arac-etiket { font-size: 14px; color: var(--soluk); }
.arac-girdi { padding: 8px; border: 1px solid var(--cizgi); border-radius: 4px; background: var(--zemin); min-width: 0; width: 100%; min-height: 40px; }
.arac-girdi[aria-invalid="true"] { border-color: var(--kirmizi); box-shadow: inset 0 0 0 1px var(--kirmizi); }
.arac-not { font-size: 13px; color: var(--soluk); margin: 0; line-height: 1.4; }
.arac-not b { color: var(--murekkep); }
.arac-bag { background: none; border: 0; padding: 0; color: var(--murekkep); text-decoration: underline; text-underline-offset: 2px; cursor: pointer; font-size: 13px; font-weight: 600; }
.arac-gizli { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

.arac-olcu { display: grid; grid-template-columns: 1fr 150px; gap: 4px 10px; align-items: center; font-size: 14px; }
.arac-olcu small { color: var(--soluk); }
.arac-olcu .arac-alan-hata { grid-column: 1 / -1; }
.arac-birimli { display: flex; align-items: center; gap: 6px; min-width: 0; }
.arac-birimli input { text-align: right; }
.arac-birimli i { font-style: normal; color: var(--soluk); font-size: 13px; min-width: 20px; }
.arac-alan-hata { color: var(--kirmizi); font-size: 12px; font-weight: 600; min-height: 0; }
.arac-alan-hata:empty { display: none; }
.arac-kutu { display: flex; align-items: center; gap: 8px; font-size: 14px; cursor: pointer; min-height: 32px; }
.arac-kutu[hidden] { display: none; }
.arac-kutu input { width: 18px; height: 18px; accent-color: var(--sari); flex: none; }

/* yük kaynağı: üç büyük seçenek */
.arac-kaynak { border: 0; padding: 0; margin: 0 0 6px; display: flex; flex-direction: column; gap: 6px; }
.arac-kaynak label { display: flex; gap: 10px; align-items: flex-start; border: 2px solid var(--cizgi); border-radius: 4px; padding: 8px 10px; cursor: pointer; }
.arac-kaynak label:has(input:checked) { border-color: var(--murekkep); box-shadow: inset 6px 0 0 var(--sari); padding-left: 14px; }
.arac-kaynak input { margin-top: 4px; accent-color: var(--murekkep); }
.arac-kaynak span { display: flex; flex-direction: column; }
.arac-kaynak small { color: var(--soluk); font-size: 13px; }

.arac-yonlen { border: 2px dashed var(--soluk); border-radius: 6px; padding: 14px; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.arac-yonlen p { margin: 0; }

.arac-no { font: 700 22px/1 "Big Shoulders Stencil Display", "Barlow Condensed", sans-serif; letter-spacing: .02em; }
.arac-palet-bas { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; font-size: 13px; color: var(--soluk); margin-top: 6px; }
.arac-palet-liste { list-style: none; margin: 0; padding: 0; max-height: 360px; overflow: auto; border-top: 1px solid var(--cizgi); }
.arac-palet-liste li { display: grid; grid-template-columns: 48px 1fr; gap: 0 10px; align-items: center; padding: 6px 2px; border-bottom: 1px solid var(--cizgi); }
.arac-palet-liste .arac-no { grid-row: span 2; }
.arac-palet-olcu { font-size: 13px; color: var(--soluk); }
.arac-palet-liste .arac-kutu { min-height: 26px; }

.arac-satirlar { display: flex; flex-direction: column; gap: 10px; }
.arac-satir { border: 1px solid var(--cizgi); border-left: 4px solid var(--tahta); border-radius: 4px; padding: 8px 10px; display: flex; flex-direction: column; gap: 6px; background: var(--kart); }
.arac-satir-bas { display: grid; grid-template-columns: 28px 1fr 36px; gap: 8px; align-items: center; }
.arac-satir-alan { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 6px 8px; }
.arac-satir-alan label { display: flex; flex-direction: column; gap: 2px; font-size: 12px; color: var(--soluk); min-width: 0; }
.arac-satir-alan .arac-girdi { min-height: 36px; padding: 6px; }
.arac-sil { background: none; border: 1px solid transparent; border-radius: 4px; color: var(--soluk); cursor: pointer; font-size: 20px; min-height: 36px; }
.arac-sil:hover:not(:disabled) { border-color: var(--cizgi); color: var(--kirmizi); }
.arac-sil:disabled { opacity: .3; cursor: default; }
.arac-koli-ozet { display: flex; flex-direction: column; gap: 2px; border-left: 4px solid var(--sari); padding: 4px 10px; }
.arac-koli-ozet span { font-size: 14px; color: var(--soluk); }
.arac-uyar { color: var(--kirmizi) !important; font-weight: 600; }

/* ---------- sonuç ---------- */
.arac-sonuc { padding: 18px 22px; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
#arac-bos[hidden], #arac-dolu[hidden] { display: none; }
#arac-dolu { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.arac-bos-ic { margin-top: 12vh; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.arac-bos-ic p { margin: 0; }
.arac-bos-ic .mesajlar { text-align: left; width: 100%; }

.arac-ozet { display: flex; flex-wrap: wrap; gap: 12px 32px; align-items: center; }
.arac-buyuk { display: flex; align-items: center; gap: 12px; }
.arac-sayi { font: 700 64px/.9 "Big Shoulders Stencil Display", sans-serif; background: var(--sari); color: var(--sari-yazi); padding: 6px 14px 4px; border-radius: 4px; }
.arac-buyuk > span:last-child { font: 600 22px/1.1 "Barlow Condensed", sans-serif; display: flex; flex-direction: column; }
.arac-buyuk small { font: 400 14px "Barlow", sans-serif; color: var(--soluk); }
.arac-dl { display: flex; flex-wrap: wrap; gap: 6px 28px; margin: 0; }
.arac-dl div { min-width: 0; }
.arac-dl dt { font-size: 13px; color: var(--soluk); }
.arac-dl dd { margin: 0; font-weight: 600; }
.arac-dl dd small { font-weight: 400; color: var(--soluk); }
.arac-mesajlar ul { margin: 4px 0 0; padding-left: 18px; }
.arac-mesajlar:empty { display: none; }

.arac-sekmeler { display: flex; gap: 8px; flex-wrap: wrap; }
.arac-sekmeler:empty { display: none; }
.arac-sekme { border: 2px solid var(--murekkep); background: var(--kart); border-radius: 4px; padding: 6px 14px 8px; cursor: pointer; text-align: left; min-width: 130px; min-height: 44px; }
.arac-sekme[aria-selected="true"] { background: var(--sari); border-color: var(--sari); color: var(--sari-yazi); }
.arac-sekme .arac-no { font-size: 30px; display: block; }
.arac-sekme small { font-size: 13px; }

.arac-rakam { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 6px; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
.arac-rakam-bas { display: flex; align-items: center; gap: 10px; font: 600 18px "Barlow Condensed", sans-serif; }
.arac-no-buyuk { font-size: 34px; border: 2px solid var(--murekkep); border-radius: 3px; padding: 2px 8px 0; }
.arac-dl-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px 20px; }
.arac-cubuk { display: block; height: 6px; background: var(--zemin); border-radius: 3px; margin-top: 4px; overflow: hidden; }
.arac-cubuk i { display: block; height: 100%; background: var(--murekkep); }

.arac-sahne-kap { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 6px; overflow: hidden; }
.arac-sahne { height: min(52vh, 520px); min-height: 280px; position: relative; }
.arac-sahne canvas { display: block; touch-action: none; }
.arac-sahne-not { font-size: 13px; color: var(--soluk); padding: 8px 14px 10px; margin: 0; }

.arac-plan-kap { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 6px; padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.arac-plan-baslik { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.arac-plan-baslik h2 { margin: 0; }
.arac-svg { width: 100%; height: auto; display: block; color: var(--murekkep); }
.arac-taban { fill: var(--zemin); }
.arac-cerceve { fill: none; stroke: var(--murekkep); stroke-width: 1.2; }
.arac-duvar { fill: var(--murekkep); }
.arac-p { fill: #d9d4c7; stroke: #1c2226; stroke-width: .8; }
.arac-p-istif { fill: #f0b400; }
.arac-p-no { font-family: "Big Shoulders Stencil Display", "Barlow Condensed", sans-serif; font-weight: 700; fill: #1c2226; text-anchor: middle; dominant-baseline: middle; }
.arac-p-x { font-family: "Barlow Condensed", sans-serif; font-weight: 600; fill: #1c2226; text-anchor: middle; dominant-baseline: middle; }
.arac-k { stroke: #1c2226; stroke-width: .35; }
.arac-yon { font-family: "Big Shoulders Stencil Display", "Barlow Condensed", sans-serif; font-weight: 700; fill: currentColor; text-anchor: middle; dominant-baseline: middle; letter-spacing: .08em; }
.arac-olc { stroke: currentColor; stroke-width: .8; opacity: .6; }
.arac-olc-t { font-family: "Barlow", sans-serif; fill: currentColor; opacity: .75; text-anchor: middle; dominant-baseline: middle; }
.arac-gm path { fill: var(--kirmizi); }
.arac-gm line { stroke: var(--kirmizi); stroke-width: 1; stroke-dasharray: 4 3; }
.arac-gm text { font-family: "Barlow Condensed", sans-serif; fill: var(--kirmizi); text-anchor: middle; }

.arac-detay summary { cursor: pointer; font-weight: 600; min-height: 32px; display: flex; align-items: center; }
.arac-detay { overflow-x: auto; }
.arac-tablo { width: 100%; border-collapse: collapse; font-size: 14px; margin-top: 6px; }
.arac-tablo th { text-align: left; color: var(--soluk); font-weight: 600; border-bottom: 1px solid var(--cizgi); padding: 4px 6px; }
.arac-tablo td { border-bottom: 1px solid var(--cizgi); padding: 4px 6px; white-space: nowrap; }
.arac-urunler { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 16px; font-size: 14px; }
.arac-urunler li { display: flex; gap: 6px; align-items: baseline; }
.arac-urunler i { width: 10px; height: 10px; border-radius: 2px; flex: none; border: 1px solid rgba(0,0,0,.25); }
.arac-urunler small { color: var(--soluk); }

.arac-baski { display: none; }

@media (max-width: 1100px) {
  .arac-duzen { grid-template-columns: 330px minmax(0, 1fr); }
}
@media (max-width: 820px) {
  .arac-duzen { grid-template-columns: 1fr; }
  .arac-yan { border-right: 0; border-top: 1px solid var(--cizgi); order: 2; }  /* önce sonuç, sonra girdiler (Palet ekranıyla aynı) */
  .arac-sonuc { padding: 16px; }
  .arac-olcu { grid-template-columns: 1fr 130px; }
  .arac-sayi { font-size: 48px; }
  .arac-sahne { height: 46vh; }
}
@media (max-width: 420px) {
  .arac-yan { padding: 14px 16px; }
  .arac-olcu { grid-template-columns: 1fr; }
  .arac-sekme { min-width: 0; flex: 1 1 40%; }
}

/* yazdırma: yalnız "Şemayı yazdır" basılınca (body.arac-yazdiriyor) araç şemaları basılır */
@media print {
  body.arac-yazdiriyor .yazdir { display: none !important; }
  body.arac-yazdiriyor #ekran-arac { display: block !important; padding: 0; min-height: 0; }
  body.arac-yazdiriyor .arac-duzen { display: none !important; }
  body.arac-yazdiriyor .arac-baski { display: block; color: #000; }
  .arac-baski-sayfa { page-break-after: always; break-after: page; }
  .arac-baski-sayfa:last-child { page-break-after: auto; break-after: auto; }
  .arac-baski-bas { display: flex; gap: 14px; align-items: center; border-bottom: 3px solid #000; padding-bottom: 6px; margin-bottom: 10px; font-size: 13px; }
  .arac-baski-bas .arac-no { font-size: 44px; }
  .arac-baski .arac-svg { color: #000; margin-bottom: 10px; }
  .arac-baski .arac-taban { fill: #fff; }
  .arac-baski .arac-tablo { font-size: 11px; }
}

/* ---------- görünüm seçimi + tek araç kapasitesi ---------- */
.arac-gorunum { display: inline-flex; border: 2px solid var(--murekkep); border-radius: 4px; overflow: hidden; align-self: flex-start; max-width: 100%; }
.arac-gorunum button { border: 0; background: transparent; padding: 8px 14px; min-height: 40px; cursor: pointer; font: 600 16px/1 "Barlow Condensed", sans-serif; color: var(--murekkep); }
.arac-gorunum button + button { border-left: 2px solid var(--murekkep); }
.arac-gorunum button[aria-selected="true"] { background: var(--murekkep); color: var(--kart); }
.arac-bildirim:empty { display: none; }
#arac-yer-ust { display: flex; flex-direction: column; gap: 16px; }
#arac-yer-ust[hidden], #arac-kap[hidden] { display: none; }

.arac-kap { background: var(--kart); border: 1px solid var(--cizgi); border-top: 6px solid var(--sari); border-radius: 6px; padding: 14px 16px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.arac-kap-bekle { margin: 0; color: var(--soluk); }
.arac-kap-bas { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.arac-kap-yuzde { font: 700 64px/.9 "Big Shoulders Stencil Display", sans-serif; }
.arac-kap-bas b { font: 600 22px/1.15 "Barlow Condensed", sans-serif; display: block; }
.arac-kap-bas small { color: var(--soluk); font-size: 14px; }
.arac-sinir { margin: 0; padding: 8px 12px; border-left: 4px solid var(--cizgi); background: var(--zemin); }
.arac-sinir-agirlik { border-color: var(--kirmizi); }
.arac-sinir-taban, .arac-sinir-hacim { border-color: var(--sari); }
.arac-kap-yuk { display: grid; grid-template-columns: auto 170px; gap: 6px 12px; align-items: center; }
.arac-kap-yuk label { font-weight: 600; }
.arac-kap-yuk .arac-girdi { font-weight: 600; font-size: 18px; }
.arac-kap-yuk .arac-alan-hata, .arac-kap-yuk .arac-cubuk { grid-column: 1 / -1; }
.arac-cubuk-kalin { height: 10px; }
.arac-kap-bolum { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; border-top: 1px solid var(--cizgi); padding-top: 12px; min-width: 0; overflow-x: auto; }
.arac-kap-bolum h3 { margin: 0; font: 600 18px/1.2 "Barlow Condensed", sans-serif; }
.arac-kap-bolum .arac-tablo { width: auto; min-width: min(100%, 420px); }
.arac-tablo tfoot td { font-weight: 600; border-bottom: 0; }
.arac-tablo td small { color: var(--soluk); }
.arac-ek { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; width: 100%; }
.arac-ek .arac-girdi { flex: 1 1 220px; width: auto; }
.arac-ek-sonuc { margin: 0; }
.arac-ek-sonuc:empty { display: none; }
@media (max-width: 420px) {
  .arac-kap-yuk { grid-template-columns: 1fr; }
  .arac-kap-yuzde { font-size: 48px; }
  .arac-gorunum button { padding: 8px 10px; font-size: 15px; }
}
