/* Real Master marka kilavuzu: lacivert #13233E, kirmizi #B23A2E (seyrek), mercan #E0665A, kirik beyaz #F4F3EF,
   antrasit #3B3B38; baslik Gelasio, govde Inter. */
:root {
  --lacivert: #13233E;
  --lacivert-2: #1C3358;
  --kirmizi: #B23A2E;
  --mercan: #E0665A;
  --kirik-beyaz: #F4F3EF;
  --antrasit: #3B3B38;
  --soluk: #6B6A64;
  --cizgi: #DAD8D0;
  --serif: "Gelasio", Georgia, "Times New Roman", serif;
  --sans: "Inter", "Segoe UI", Arial, sans-serif;
  color-scheme: light;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { font-family: var(--sans); color: var(--antrasit); background: var(--kirik-beyaz); display: flex; flex-direction: column; min-height: 100dvh; }

.ust-bar { background: var(--lacivert); color: var(--kirik-beyaz); display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 20px; border-bottom: 3px solid var(--kirmizi); }
.wm { font-family: var(--serif); font-weight: 700; letter-spacing: .07em; font-size: 20px; white-space: nowrap; }
.wm i { font-style: normal; color: var(--mercan); }
.wm small { font-family: var(--sans); font-weight: 500; letter-spacing: .14em; text-transform: uppercase; font-size: 11px; color: #C9CED8; margin-left: 12px; }
.mod-etiketi { margin: 0; font-size: 12.5px; color: #C9CED8; text-align: right; }
.mod-etiketi.uyari { color: #F6C5BD; }

.duzen { flex: 1; display: grid; grid-template-columns: minmax(300px, 380px) 1fr; min-height: 0; }
.panel { overflow-y: auto; padding: 18px; display: grid; align-content: start; gap: 16px; border-right: 1px solid var(--cizgi); background: #FBFAF7; }
.kutu { background: #fff; border: 1px solid var(--cizgi); border-radius: 6px; padding: 16px; display: grid; gap: 12px; }
.kutu h2 { margin: 0; font-family: var(--serif); font-size: 19px; color: var(--lacivert); display: flex; align-items: center; gap: 10px; }
.adim { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--lacivert); color: #fff; font: 600 13px var(--sans); }

form { display: grid; gap: 10px; }
.alan { display: grid; gap: 4px; font-size: 13px; font-weight: 600; color: var(--antrasit); }
.alan select, .alan input { font: 500 15px var(--sans); padding: 9px 10px; border: 1px solid #C9C6BC; border-radius: 5px; background: #fff; color: var(--antrasit); min-width: 0; width: 100%; }
.alan select:disabled { background: #F1F0EC; color: #9A988F; }
:focus-visible { outline: 3px solid color-mix(in srgb, var(--mercan) 60%, transparent); outline-offset: 1px; }
.iki-sutun { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }

.birincil { font: 600 15px var(--sans); background: var(--lacivert); color: #fff; border: 0; border-radius: 5px; padding: 11px 14px; cursor: pointer; }
.birincil:hover:not(:disabled) { background: var(--lacivert-2); }
.birincil:disabled { opacity: .45; cursor: not-allowed; }
.ikincil-dugme { font: 600 13px var(--sans); background: transparent; color: var(--kirmizi); border: 1px solid currentColor; border-radius: 5px; padding: 6px 12px; cursor: pointer; justify-self: start; }
.ikincil-yol { margin: 0; font-size: 12.5px; color: var(--soluk); }
.baglanti { color: var(--lacivert); text-decoration: underline; cursor: pointer; font-weight: 600; }
.gizli-dosya { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.gizli-dosya:focus-visible + * { outline: none; }

/* KML yukleme: birincil giris yolu (TKGM otomatik sorgu tarayicidan calismadigi icin). */
.kml-adim { margin: 0; padding-left: 20px; display: grid; gap: 3px; font-size: 13px; color: var(--antrasit); }
.kml-adim a { color: var(--lacivert); font-weight: 600; }
.birakma { display: block; border: 2px dashed #B9C1CE; border-radius: 6px; background: var(--kirik-beyaz); padding: 20px 14px; text-align: center; cursor: pointer; transition: border-color .12s, background .12s; }
.birakma:hover { border-color: var(--lacivert); }
.birakma.uzerinde { border-color: var(--mercan); background: #FBEFEC; }
.birakma:focus-within { outline: 3px solid color-mix(in srgb, var(--mercan) 60%, transparent); outline-offset: 2px; }
.birakma-ic { display: grid; gap: 3px; }
.birakma-ic b { color: var(--lacivert); font-size: 14.5px; }
.birakma-ic small { color: var(--soluk); font-size: 12.5px; }
/* Opsiyonel gercek fotograflar (video sonuna slayt). */
.birakma.kucuk { padding: 12px; }
.fotolar { display: grid; gap: 8px; margin-top: 4px; }
.foto-onizleme { display: flex; flex-wrap: wrap; gap: 8px; }
.foto-onizleme:empty { display: none; }
.foto-kutu { position: relative; margin: 0; width: 84px; height: 84px; border-radius: 6px; overflow: hidden; border: 1px solid #D4DAE3; }
.foto-kutu img, .foto-kutu video { width: 100%; height: 100%; object-fit: cover; display: block; }
.foto-sil { position: absolute; top: 3px; right: 3px; width: 22px; height: 22px; border: 0; border-radius: 50%; background: rgba(19, 35, 62, .82); color: #fff; font-size: 15px; line-height: 1; cursor: pointer; display: grid; place-items: center; }
.foto-sil:hover { background: var(--kirmizi); }

/* Ortak giris (opsiyonel; standalone'da gizli). Danisman adi + hak metni + ek istek formu. */
.giris-kutu { gap: 10px; border-left: 4px solid var(--lacivert); background: #F3F6FB; }
.giris-kim { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.giris-ad { font-weight: 700; color: var(--lacivert); font-size: 15px; }
.giris-rol { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #fff; background: var(--lacivert-2); border-radius: 999px; padding: 2px 9px; }
.giris-hak { margin: 0; font-size: 13px; line-height: 1.45; color: var(--antrasit); }
.istek-form { display: grid; gap: 8px; margin-top: 2px; padding-top: 10px; border-top: 1px solid var(--cizgi); }
.istek-form textarea { font: 400 14px/1.4 var(--sans); padding: 8px 10px; border: 1px solid #C9C6BC; border-radius: 5px; resize: vertical; min-height: 58px; color: var(--antrasit); }
.istek-form .ikincil-dugme { color: var(--lacivert); }

.durum { margin: 0; font-size: 13px; color: var(--soluk); }
.durum:empty { display: none; }
.hata { margin: 0; font-size: 13px; color: var(--kirmizi); background: #FBEDEA; border-radius: 5px; padding: 8px 10px; }
.parsel-kart { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 5px 12px; font-size: 13px; padding: 10px 12px; background: var(--kirik-beyaz); border-radius: 5px; border-left: 4px solid var(--kirmizi); }
.parsel-kart dt { color: var(--soluk); }
.cevre { display: grid; gap: 6px; margin-top: 4px; }
.cevre-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.cevre-liste label { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: 8px; font-size: 13px; padding: 4px 6px; border-radius: 4px; cursor: pointer; }
.cevre-liste label:hover { background: var(--kirik-beyaz); }
.cevre-liste input { width: 15px; height: 15px; accent-color: var(--lacivert); align-self: center; }
.cevre-liste .cevre-ad { font-weight: 600; color: var(--lacivert); overflow-wrap: anywhere; }
.cevre-liste .cevre-ad small { font-weight: 400; color: var(--soluk); }
.cevre-liste .cevre-mesafe { font-weight: 700; color: var(--kirmizi); white-space: nowrap; }
.parsel-kart dd { margin: 0; font-weight: 600; color: var(--lacivert); overflow-wrap: anywhere; }

.sureler { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.sureler legend { font-size: 13px; font-weight: 600; margin-bottom: 6px; padding: 0; }
.ipucu { font-weight: 500; color: var(--soluk); font-size: 12px; margin-left: 6px; }
.cip { position: relative; }
.cip input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.cip span { display: inline-block; padding: 8px 14px; border: 1px solid #C9C6BC; border-radius: 999px; font-weight: 600; font-size: 14px; background: #fff; }
.cip input:checked + span { background: var(--lacivert); color: #fff; border-color: var(--lacivert); }
.cip input:focus-visible + span { outline: 3px solid color-mix(in srgb, var(--mercan) 60%, transparent); outline-offset: 1px; }
.cip input:disabled + span { opacity: .5; }
.not { margin: 0; font-size: 12.5px; color: var(--soluk); }
.yazilar summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--lacivert); }
.yazilar[open] { display: grid; gap: 8px; }

.seslendirme { display: grid; gap: 6px; }
.ilan-bilgisi { display: grid; gap: 10px; }
.paylasim { display: grid; gap: 8px; margin-top: 14px; }
.paylasim textarea { font: 400 14px/1.5 var(--sans); padding: 10px 12px; border: 1px solid #C9C6BC; border-radius: 5px; resize: vertical; min-height: 180px; color: var(--antrasit); background: #FBFAF7; width: 100%; }
.paylasim-alt { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.paylasim-uyari { margin: 0; padding-left: 18px; color: var(--kirmizi); font-size: 13.5px; display: grid; gap: 4px; }
.paylasim-uyari:empty { display: none; }
.ilan-bilgisi textarea { font: 400 14.5px/1.45 var(--sans); padding: 9px 10px; border: 1px solid #C9C6BC; border-radius: 5px; resize: vertical; min-height: 64px; color: var(--antrasit); width: 100%; }
.seslendirme textarea { font: 400 14.5px/1.45 var(--sans); padding: 9px 10px; border: 1px solid #C9C6BC; border-radius: 5px; resize: vertical; min-height: 96px; color: var(--antrasit); }
.seslendirme-alt { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.seslendirme-alt .not.asim { color: var(--kirmizi); font-weight: 600; }
.ses-satir { display: flex; align-items: flex-end; gap: 8px; }
.ses-satir .alan { flex: 1; }
.ses-satir .ikincil-dugme { white-space: nowrap; }
.muzik-satir { display: flex; align-items: center; gap: 10px; }
.muzik-satir select { flex: 1; min-width: 0; font: 500 14px var(--sans); padding: 7px 9px; border: 1px solid #C9C6BC; border-radius: 5px; background: #fff; color: var(--antrasit); }
.muzik-satir select:disabled { background: #F1F0EC; color: #9A988F; }
.onay { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; white-space: nowrap; cursor: pointer; }
.onay input { width: 16px; height: 16px; accent-color: var(--lacivert); }
.ilerleme { display: grid; gap: 6px; }
.ilerleme p { margin: 0; font-size: 13px; }
progress { width: 100%; height: 10px; accent-color: var(--kirmizi); }
.sonuclar { display: grid; gap: 14px; }
.sonuc { margin: 0; display: grid; gap: 6px; }
.sonuc video { width: 100%; max-height: 340px; background: #0B1424; border-radius: 5px; }
.sonuc.dikey video { max-height: 440px; }
.foto-sonuclar { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.foto-sonuc { margin: 0; display: grid; gap: 4px; }
.foto-sonuc img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 5px; background: #0B1424; display: block; }
.foto-sonuc figcaption { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 12.5px; color: var(--soluk); }
.foto-sonuc figcaption b { color: var(--lacivert); flex-basis: 100%; }
.foto-sonuc a { color: var(--kirmizi); font-weight: 600; }
.sonuc figcaption { display: flex; justify-content: space-between; align-items: center; font-size: 12.5px; color: var(--soluk); gap: 8px; }
.indir { font: 600 13px var(--sans); color: #fff; background: var(--kirmizi); padding: 6px 14px; border-radius: 5px; text-decoration: none; }

.sahne-alani { position: relative; overflow: hidden; background: #0B1424; min-height: 420px; }
.sahne { position: absolute; inset: 0; }
/* Kayitta kap tam W x H CSS px (1080x1920 ya da 1920x1080); gorunmez, ustunu kayit tuvali kaplar. */
.sahne.kayitta { inset: auto; left: 0; top: 0; }
.kaplama { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.kayit-tuvali { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: #0B1424; z-index: 2; }
.sahne-mesaji { position: absolute; left: 50%; top: 18px; transform: translateX(-50%); margin: 0; padding: 8px 14px; border-radius: 999px; background: rgba(19, 35, 62, .85); color: var(--kirik-beyaz); font-size: 13px; z-index: 3; pointer-events: none; max-width: calc(100% - 32px); text-align: center; }
.krediler { position: absolute; left: 8px; bottom: 6px; z-index: 1; font-size: 11px; color: #DDE2EA; max-width: calc(100% - 16px); }
.krediler a { color: inherit; }

@media (max-width: 860px) {
  .duzen { grid-template-columns: 1fr; }
  .sahne-alani { order: -1; min-height: 52vh; }
  .panel { border-right: 0; }
}
[hidden] { display: none !important; }
