/*
  EDUVENTURE tanitim sitesi — platforma baglarken gereken eklemeler.

  styles.css karsi tarafin deposundan BIREBIR kopyalandi; oraya dokunulmuyor ki
  sonraki surumleriyle farki okunabilir kalsin. Bizim eklerimiz yalnizca burada.

  1. Dil secici: statik sitede iki bag (<a>) yan yana sigiyordu. Bizde bes dil var
     ve yenisi yonetim panelinden aciliyor, bu yuzden acilir liste. Yeri birincil
     eylemin ardi: "Basvur" dugmesinin sagi.
  2. Giris bagi: statik sitede portal yoktu; burada var.
*/

/* ---------------------------------------------------------------- dil secici */
.langm {
  position: relative;
  flex: none;
}

/*
  Acma dugmesi "Basvur" ile ayni olculerde: .btn--sm gibi 40 px yuksek, 2 px
  kenarlikli, ayni yazi boyu. Boylece ikisi ayni taban cizgisinde oturuyor ve
  dolu yesil dugmenin yanindaki cizgili kutu ikincil eylem olarak okunuyor.
*/
.langm > summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  min-height: 40px;
  padding: .45rem .85rem;
  font: 600 .9375rem/1.2 var(--sans);
  color: var(--navy);
  background: transparent;
  border: 2px solid var(--navy);
  border-radius: 2px;
  cursor: pointer;
  list-style: none;
  white-space: nowrap;
  transition: background-color .15s, color .15s, border-color .15s;
}

/* Safari'nin kendi ucgenini kaldirir. */
.langm > summary::-webkit-details-marker { display: none; }

/* Kendi ucgenimiz: acilinca doner. */
.langm > summary::after {
  content: "";
  width: 0;
  height: 0;
  border: .25rem solid transparent;
  border-top-color: currentColor;
  margin-top: .25rem;
  transition: transform .15s;
}

.langm[open] > summary::after { transform: rotate(180deg); margin-top: -.25rem; }

.langm > summary:hover {
  background: var(--navy);
  color: #fff;
}

.langm > summary:focus-visible {
  outline: 2px solid var(--green-ink);
  outline-offset: 2px;
}

.langm__panel {
  position: absolute;
  top: calc(100% + .35rem);
  right: 0;
  z-index: 40;
  min-width: 11rem;
  padding: .25rem;
  background: #fff;
  border: 1px solid var(--rule-ink);
  border-radius: 2px;
  box-shadow: 0 10px 28px rgba(14, 38, 69, .22);
}

.langm__panel button {
  display: flex;
  align-items: baseline;
  gap: .55rem;
  width: 100%;
  padding: .45rem .55rem;
  font: 500 .9375rem/1.2 var(--sans);
  color: var(--ink);
  text-align: left;
  background: none;
  border: 0;
  border-radius: 2px;
  cursor: pointer;
}

.langm__panel button:hover { background: var(--paper-2); color: var(--green-ink); }

.langm__panel button:focus-visible {
  outline: 2px solid var(--green-ink);
  outline-offset: -2px;
}

.langm__panel button[aria-current="true"] {
  font-weight: 700;
  color: var(--navy);
  background: var(--paper-2);
}

.langm__code {
  min-width: 1.85rem;
  font: 650 .75rem/1 var(--sans);
  letter-spacing: .04em;
  color: var(--green-ink);
}

/*
  Koyu baslik (ana sayfa). .btn--ghost ile ayni dil: beyazimsi kenarlik, hover'da
  dolu beyaz. Panel beyaz kalir; uzerindeki metnin okunakli olmasi gerekiyor.
*/
.hdr--night .langm > summary {
  color: #fff;
  border-color: rgba(255, 255, 255, .75);
}

.hdr--night .langm > summary:hover {
  background: #fff;
  color: var(--night-top);
}

/* Altlik da koyu zemin; orada liste yukari acilir, altinda sayfa bitiyor. */
.langm--ftr > summary {
  min-height: 32px;
  padding: .25rem .55rem;
  font-size: .8125rem;
  color: #fff;
  border-width: 1px;
  border-color: var(--on-dark);
}

.langm--ftr > summary:hover { background: #fff; color: var(--night); }

/*
  Altlikta liste yukari acilir: altinda sayfa bitiyor. Saga hizali kalir — secici
  altlik satirinin sag ucunda duruyor, sola acilsaydi panel ekranin disina tasardi.
*/
.langm--ftr .langm__panel {
  top: auto;
  bottom: calc(100% + .35rem);
}

/* ---------------------------------------------------------------- giris bagi */
/*
  Basvuru dugmesinin solundaki ikincil eylem. Ayri bir dugme degil, bag gorunumunde:
  ziyaretcilerin cogu katilimci degil ve birincil eylem basvuru.
*/
.hdr__signin {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  font: 600 .9375rem/1 var(--sans);
  color: var(--navy);
  text-decoration: none;
  white-space: nowrap;
  box-shadow: inset 0 -2px 0 transparent;
}

.hdr__signin:hover { box-shadow: inset 0 -2px 0 var(--rule-ink); color: var(--green-ink); }

.hdr--night .hdr__signin { color: #fff; }
.hdr--night .hdr__signin:hover { color: var(--mint); box-shadow: inset 0 -2px 0 var(--mint); }

/* ---------------------------------------------------------------- dar ekran */
/*
  1100 px altinda bu satir acilan menunun son satiri. Giris solda kalir, birincil
  eylem ve dil secici sagda bir arada durur; aralarindaki bosluk .hdr__acts'in
  space-between'ini bozmadan "Basvur + dil" ikilisini birlestirir.
*/
@media (max-width: 1099.98px) {
  .js .hdr__nav.is-open .hdr__acts { gap: .75rem; }
  .js .hdr__nav.is-open .hdr__signin { margin-right: auto; }
}

/* ---------------------------------------------------------------- belge kutuphanesi */
/*
  /Files sayfasinin tanitim sitesi yuzu. Oturum acmis kullanici ayni sayfayi calisma
  alani kabuguyla ve Tailwind isaretlemesiyle goruyor (Views/FileLibrary/Index.cshtml);
  burasi yalnizca disaridan gelenin gordugu surum.

  Dil sitenin geri kalaniyla ayni: ikon yok, cizgiyle ayrilmis satirlar, turu kendi
  adiyla soyleyen bir etiket. Kart kullanilmadi -- .res gibi kurallarla ayrilan liste
  sayfanin "teknik veri sayfasi" tonuna oturuyor.
*/
.docs {
  border-top: 2px solid var(--ink);
  margin: 0;
  padding: 0;
  list-style: none;
}

.docs > li {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .35rem 1.5rem;
  align-items: start;
  padding: 1.4rem 0;
  border-bottom: 1px solid var(--rule);
}

.docs__t { font: 650 1.125rem/1.35 var(--sans); margin: 0; }
.docs__t a { text-decoration-thickness: 1px; }

.docs__d {
  grid-column: 1;
  margin: 0;
  color: var(--muted);
  font-size: .9375rem;
  max-width: 44rem;
}

/*
  Tur / boyut / tarih. Turu buyuk harf yazip once koymak, uzantiyi dosya adina
  bakmadan okunur kiliyor; boyut ve tarih ayni satirda, ayni tonda.
*/
.docs__meta {
  grid-column: 1;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem .6rem;
  font: 500 .8125rem/1.4 var(--sans);
  color: var(--rule-ink);
  font-variant-numeric: tabular-nums;
}

.docs__type {
  font-weight: 650;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--green-ink);
}

/* Disa acik rozeti: bag paylasilmadan once gorunurlugun bilinmesi gerekiyor. */
.docs__open {
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-size: .75rem;
  color: var(--navy);
  border: 1px solid var(--rule);
  border-radius: 2px;
  padding: .05rem .4rem;
}

.docs__act { grid-column: 2; grid-row: 1 / span 3; margin: 0; }

@media (max-width: 599.98px) {
  .docs > li { grid-template-columns: minmax(0, 1fr); }
  .docs__act { grid-column: 1; grid-row: auto; margin-top: .5rem; }
}

/* ---------------------------------------------------------------- arama satiri */
/*
  Sitenin kendi girdi stili yok: kayit formununkiler .appform altinda kapali.
  Burada tek bir alan var, o yuzden dugmelerle ayni olcude kucuk bir tanim yeterli.
*/
.docs__find {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: center;
  margin-bottom: 2rem;
}

.docs__q {
  flex: 1 1 18rem;
  min-width: 0;
  min-height: 48px;
  padding: .6rem .9rem;
  font: 400 1rem/1.2 var(--sans);
  color: var(--ink);
  background: #fff;
  border: 2px solid var(--rule-ink);
  border-radius: 2px;
  appearance: none;
}

.docs__q::placeholder { color: var(--muted); }
.docs__q:focus-visible { outline: 2px solid var(--green-ink); outline-offset: 2px; border-color: var(--navy); }

.docs__empty {
  margin: 0;
  padding: 2.5rem 0;
  border-top: 2px solid var(--ink);
  border-bottom: 1px solid var(--rule);
  color: var(--muted);
}

/* Oturum acmamis ziyaretciye listenin tamami olmadigini soyleyen satir. */
.docs__note {
  margin: 1.75rem 0 0;
  font-size: .9375rem;
  color: var(--muted);
  max-width: 44rem;
}
