/* 7 · Yönetim kolaylıkları (DILIM-7.md §7): İmparatorluk (kod/sayfalar/imparatorluk.js), plan çipi (kod/sira.js), sen yokken şeridi (sayfalar/genel-bakis.js),
   dönüş saatini seç (sayfalar/filo.js). Tek DOM, iki görünüm: İmparatorluk listesi container sorgusuyla geniş sütunda ızgara tablo, dar sütunda (telefon)
   gezegen başına sıkı kart. Renkler mevcut değişkenlerden. */

/* ——— İmparatorluk ——— */
.sayfa-imparatorluk .sayfa-adi.gorunur { display: flex; align-items: center; gap: 6px; }
.ym-kap { container-type: inline-size; container-name: ym; }
.ym-liste { display: flex; flex-direction: column; gap: 4px; }
.ym-satir {
  display: grid; align-items: center; gap: 3px;
  grid-template-columns: minmax(92px, 1.3fr) repeat(3, minmax(52px, 1fr)) minmax(40px, .6fr) minmax(42px, .6fr) minmax(68px, 1.2fr) minmax(56px, .9fr) minmax(38px, .5fr) minmax(56px, .85fr);
  padding: 5px 6px;
  background: linear-gradient(180deg, rgba(21, 28, 38, .92), rgba(11, 15, 21, .92));
  border: 1px solid var(--kenar); border-radius: var(--yuvarlak);
  font-size: 12px;
}
.ym-liste.akkorlu .ym-satir {
  grid-template-columns: minmax(88px, 1.3fr) repeat(4, minmax(48px, 1fr)) minmax(38px, .6fr) minmax(40px, .6fr) minmax(64px, 1.2fr) minmax(52px, .9fr) minmax(36px, .5fr) minmax(52px, .85fr);
}
.ym-satir.secili { border-color: var(--kenar-acik); box-shadow: inset 2px 0 0 var(--bag); }
.ym-satir.ay { margin-left: 10px; padding-top: 3px; padding-bottom: 3px; font-size: 11.5px; background: rgba(10, 14, 20, .88); }
.ym-basliklar { background: none; border-color: transparent; padding-top: 0; padding-bottom: 0; color: var(--soluk); font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.ym-toplam { background: linear-gradient(180deg, var(--serit-ust), var(--serit-alt)); }
.ym-h { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ym-h b { color: #fff; font-weight: 600; }
.ym-et { display: none; }
.ym-yer { display: flex; align-items: center; gap: 7px; }
.ym-resim { width: 30px; height: 30px; flex: none; border-radius: 50%; }
.ym-ay-resim { width: 20px; height: 20px; flex: none; }
.ym-yer-yazi { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.ym-yer-ad { overflow: hidden; color: #fff; font-weight: 600; text-overflow: ellipsis; }
.ym-yer-ad:hover { color: var(--bag); }
.ym-konum { color: var(--soluk); font-size: 11px; }
.ym-konum:hover { color: var(--bag); }
.ym-k { display: flex; flex-direction: column; line-height: 1.2; }
.ym-sayi { font-size: 12.5px; }
.ym-depo { display: block; height: 3px; margin: 2px 0 1px; background: #0b1016; border-radius: 2px; overflow: hidden; }
.ym-depo > span { display: block; height: 100%; background: var(--zumrut); }
.ym-depo.dolu > span { background: var(--kirmizi); }
.ym-uretim { color: var(--yesil); font-size: 10.5px; }
.ym-kaynak-simge { display: inline-block; width: 15px; height: 15px; vertical-align: -3px; }
.ym-enerji.eksik b { color: var(--kirmizi); }
.ym-alan.dolu b { color: var(--kehribar); }
.ym-bina, .ym-tersane { display: flex; flex-direction: column; line-height: 1.25; }
.ym-is-ad { overflow: hidden; text-overflow: ellipsis; color: var(--yazi); }
.ym-kuyruk { color: var(--soluk); }
.ym-zaman { display: block; overflow: hidden; color: var(--yazi-2); font-size: 10.5px; text-overflow: ellipsis; }
.ym-zaman b { color: var(--yesil); font-weight: 600; }
.ym-zaman .simge { width: 11px; height: 11px; margin-right: 2px; color: var(--kehribar); }
.ym-bitis { color: var(--soluk); }
.ym-bina.bekliyor .ym-is-ad { color: var(--kehribar); }
.ym-ilerleme { display: block; height: 2px; margin-top: 2px; }
.ym-filo-dugme { display: inline-flex; align-items: center; gap: 4px; min-height: 28px; padding: 2px 6px; background: rgba(255, 255, 255, .03); border: 1px solid var(--kenar); border-radius: 4px; }
.ym-filo-dugme.acik, .ym-filo-dugme:hover { border-color: var(--kenar-acik); }
.ym-yolda { display: inline-flex; align-items: center; gap: 1px; color: var(--bag); font-size: 10.5px; }
.ym-yolda .simge { width: 11px; height: 11px; }
.ym-cip {
  display: inline-flex; align-items: center; gap: 4px; max-width: 100%; min-height: 28px; padding: 2px 7px;
  background: rgba(255, 255, 255, .03); border: 1px solid var(--kenar); border-radius: 14px; color: var(--soluk); font-size: 11px;
}
.ym-cip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ym-cip .simge { display: none; width: 12px; height: 12px; }   /* tabloda yer dar: renk yeter; kartta görünür */
.ym-cip.plan-acik { border-color: rgba(147, 211, 86, .55); color: var(--yesil); }
.ym-cip.plan-durdu { border-color: rgba(240, 168, 67, .55); color: var(--kehribar); }
.ym-cip.plan-bitti { color: var(--yazi-2); }
.ym-cip.acik, .ym-cip:hover { background: rgba(255, 255, 255, .07); }
/* 7 düzeltici: dar tablo hücresinde kesmek yerine alt satıra in (gezegen adı, iş adı, plan durumu; bitiş saati kendi satırında). Kartta da zararsız */
.ym-yer-ad, .ym-is-ad { white-space: normal; overflow-wrap: anywhere; }
.ym-zaman { white-space: normal; }
.ym-bitis { display: inline-block; white-space: nowrap; }
.ym-cip span { white-space: normal; }
.ym-acilir { margin: -2px 0 2px 18px; padding: 9px 11px; background: var(--panel-koyu); border: 1px solid var(--kenar); border-radius: 0 0 var(--yuvarlak) var(--yuvarlak); font-size: 12.5px; }
.ym-acilir p { margin: 0 0 6px; }
.ym-gemiler { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 3px 14px; margin: 0; padding: 0; list-style: none; }
.ym-gemiler li { display: flex; justify-content: space-between; gap: 8px; }
.ym-gemiler li span { overflow: hidden; color: var(--yazi-2); text-overflow: ellipsis; white-space: nowrap; }
.ym-not { color: var(--yazi-2); }
.ym-plan-secim { display: flex; flex-wrap: wrap; gap: 6px 10px; margin-bottom: 8px; }
.ym-plan-oge { display: inline-flex; align-items: center; }
.ym-plan-sec { min-height: 32px; padding: 4px 12px; background: #121922; border: 1px solid var(--kenar-acik); border-radius: 4px; color: var(--yazi-2); }
.ym-plan-sec.secili { background: #24364b; color: #fff; }
.ym-plan-durum { color: var(--yazi-2); }
.ym-plan-bilgi { display: flex; flex-wrap: wrap; gap: 2px 16px; margin: 0; }
.ym-plan-bilgi div { display: flex; gap: 5px; }
.ym-plan-bilgi dt { color: var(--soluk); }
.ym-plan-bilgi dd { margin: 0; }
.ym-plan-kutu .dugme-sirasi { margin-top: 8px; }
.ym-soru p { max-width: 340px; white-space: normal; }
.ym-acilir .ym-soru[open], .sayfa-adi .ym-soru[open] { display: block; }

/* Kaynak topla (kapalı kutu) */
.ym-toplama { margin-top: 12px; }
.ym-toplama > summary { cursor: pointer; list-style: none; }
.ym-toplama > summary::-webkit-details-marker { display: none; }
.ym-toplama > summary .simge { width: 15px; height: 15px; }
.ym-toplama[open] .ym-ok { transform: rotate(180deg); }
.ym-toplama-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.ym-toplama-soru { order: 9; }
.ym-hedef { display: inline-flex; align-items: center; gap: 6px; min-width: 0; max-width: 100%; color: var(--yazi-2); }
.ym-hedef select { min-width: 0; max-width: 100%; min-height: 32px; padding: 3px 6px; background: #0d131b; border: 1px solid var(--kenar-acik); border-radius: 4px; color: var(--yazi); font: inherit; }
.ym-kaynak-sec { display: inline-flex; flex-wrap: wrap; gap: 4px 10px; }
.ym-onay { display: inline-flex; align-items: center; gap: 4px; min-height: 32px; cursor: pointer; }
.ym-onay input { width: 16px; height: 16px; margin: 0; accent-color: var(--zumrut); }
.ym-onizleme { margin-top: 10px; }
.ym-parcalar { display: flex; flex-direction: column; gap: 3px; margin: 0; padding: 0; list-style: none; }
.ym-parca {
  display: grid; align-items: center; gap: 4px 10px; padding: 5px 8px;
  grid-template-columns: minmax(110px, 1.6fr) minmax(70px, 1fr) minmax(54px, .7fr) minmax(54px, .7fr) minmax(90px, 1fr);
  background: rgba(255, 255, 255, .025); border: 1px solid var(--kenar); border-radius: 4px; font-size: 12px;
}
.ym-parca > * { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ym-parca.atlandi { grid-template-columns: minmax(110px, 1.6fr) minmax(0, 3.4fr); opacity: .75; }
.ym-parca-neden { color: var(--kehribar); }
.ym-parca-yuk { color: #fff; font-weight: 600; }
.ym-parca-varis { color: var(--yazi-2); }
.ym-onizleme-alt { margin: 8px 0 0; color: var(--yazi-2); }

/* Dar sütun (telefon ve olağan masa): gezegen başına sıkı kart. 12 sütun: yer | plan · kaynaklar · Enerji Alan Bina Tersane Filo.
   Eşik 849 px (7 düzeltici, ölçüldü): orta sütun clamp(670px, 46vw, 880px); 670-850 px'te on sütunlu tabloda gezegen adı, iş, bitiş saati ve plan durumu
   kesiliyordu (1280/1440 px masada). Tablo yalnız ~1850 px ve üstü ekranlarda (sütun ≥ 850 px). */
@container ym (max-width: 849px) {
  .ym-basliklar { display: none; }
  .ym-satir, .ym-liste.akkorlu .ym-satir { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 4px 6px; padding: 7px 8px; }
  .ym-et { display: block; color: var(--soluk); font-size: 9.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
  .ym-k .ym-et { display: inline; margin-right: 3px; }
  .ym-k { flex-direction: column; }
  .ym-yer { grid-column: 1 / 9; grid-row: 1; }
  .ym-plan { grid-column: 9 / 13; grid-row: 1; justify-self: end; max-width: 100%; text-align: right; }
  .ym-k { grid-row: 2; grid-column: span 4; }
  .ym-liste.akkorlu .ym-k { grid-column: span 3; }
  .ym-enerji { grid-row: 3; grid-column: 1 / 3; }
  .ym-alan { grid-row: 3; grid-column: 3 / 5; }
  .ym-bina { grid-row: 3; grid-column: 5 / 9; }
  .ym-tersane { grid-row: 3; grid-column: 9 / 11; }
  .ym-filo { grid-row: 3; grid-column: 11 / 13; }
  .ym-bos { display: none; }
  .ym-satir.ay { margin-left: 12px; }
  .ym-satir.ay .ym-yer { grid-column: 1 / 13; }
  .ym-satir.ay .ym-bina { grid-column: 5 / 11; }
  .ym-cip .simge { display: inline-block; }
  .ym-acilir { margin-left: 8px; }
  .ym-resim { width: 26px; height: 26px; }
  .ym-uretim, .ym-zaman { font-size: 10px; }
  .ym-tersane .ym-bitis, .ym-tersane .ym-kuyruk { display: none; }
}
@media (max-width: 759px) {
  .ym-parca { grid-template-columns: minmax(0, 1fr) auto auto; }
  .ym-parca-yer { grid-column: 1 / -1; }
  .ym-parca-gemi { grid-column: 1 / 2; }
  .ym-parca-varis { grid-column: 1 / -1; }
  .ym-parca.atlandi { grid-template-columns: minmax(0, 1fr); }
}

/* ——— Plan çipi (sayfadaki bina sırası kutusu) ——— */
.plan-cipi {
  display: flex; align-items: center; gap: 6px; margin-top: 9px; padding: 5px 9px; min-height: 32px;
  background: rgba(255, 255, 255, .03); border: 1px solid var(--kenar); border-radius: 14px; color: var(--yazi-2); font-size: 12px;
}
.plan-cipi span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plan-cipi .simge { width: 13px; height: 13px; }
.plan-cipi.plan-acik { border-color: rgba(147, 211, 86, .45); }
.plan-cipi.plan-acik .simge { color: var(--yesil); }
.plan-cipi.plan-durdu { border-color: rgba(240, 168, 67, .5); }
.plan-cipi.plan-durdu .simge { color: var(--kehribar); }
.plan-cipi:hover { color: #fff; border-color: var(--kenar-acik); }

/* ——— Sen yokken şeridi (Genel Bakış'ın başı) ——— */
.sen-yokken { margin-bottom: 10px; }
.sy-serit { display: flex; align-items: center; gap: 6px; padding: 4px 6px 4px 4px; }
.sy-ac { display: flex; flex: 1; align-items: center; gap: 8px; min-width: 0; min-height: 34px; padding: 3px 6px; background: none; border: 0; color: var(--yazi); text-align: left; }
.sy-ac > b { flex: none; color: var(--baslik-mavi); font-weight: 700; }
.sy-ac > .simge { color: var(--baslik-mavi); }
.sy-sayilar { display: flex; flex: 1; flex-wrap: wrap; gap: 2px 10px; min-width: 0; color: var(--yazi-2); font-size: 12px; }
.sy-sayi { display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; }
.sy-sayi .simge { width: 13px; height: 13px; color: var(--soluk); }
.sy-ok { margin-left: auto; color: var(--soluk); }
.sy-kapat { flex: none; }
.sy-onemli { margin: 0; padding: 4px 14px 10px 36px; list-style: none; font-size: 12.5px; }
.sy-onemli li { padding: 3px 0; border-top: 1px solid rgba(33, 44, 58, .6); }
.sy-onemli li:first-child { border-top: 0; }
@media (max-width: 759px) {
  .sy-ac { flex-wrap: wrap; gap: 2px 8px; }
  .sy-ad { display: none; }
  .sy-onemli { padding-left: 12px; }
}

/* ——— Filo 3. adım: dönüş saatini seç ——— */
.donus-kutusu { margin-top: 8px; }
.donus-kutusu > summary { display: flex; align-items: center; gap: 6px; min-height: 32px; color: var(--bag); cursor: pointer; list-style: none; }
.donus-kutusu > summary::-webkit-details-marker { display: none; }
.donus-satiri { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 4px; }
.donus-satiri input[type="time"] { min-height: 32px; padding: 3px 6px; background: #0d131b; border: 1px solid var(--kenar-acik); border-radius: 4px; color: var(--yazi); color-scheme: dark; }
.donus-not { display: block; margin-top: 6px; color: var(--yesil); font-size: 12px; }
