/* =============================================================================
   MK — GÖMME YALITIMI (embed compatibility layer)
   -----------------------------------------------------------------------------
   WordPress eklentilerinin kısa kod çıktısı, içine konduğu MK bölümünün
   yazı ayarlarını MİRAS ALIR: dev başlık ölçeği, ortalama hiza, beyaz metin
   rengi, Anton fontu... Sonuç bozuk görünür (ör. takvim emojisi devleşir,
   liste satırları ortalanır, metin gökyüzünün üstünde okunmaz olur).

   Buradaki kurallar o mirası kesip eklentiye NORMAL bir belge bağlamı verir.

   Öncelik notu — bilerek düşük tutuldu:
   MK'un stilleri wp_head()'ten ÖNCE basılır, yani eklentinin kendi CSS'i
   daha sonra gelir. Aşağıdaki iç kurallar :where() ile 0 özgüllüğe indirildi;
   böylece MK'un genel kurallarını (img{display:block} gibi) ezerler ama
   eklentinin kendi sınıf kurallarına karışmazlar.
   ========================================================================== */

.mk-gomme {
  /* --- Miras alınan HER yazı özelliği burada durur ------------------------ */
  font-family: var(--font-arayuz);
  font-size: 16px;
  font-weight: var(--font-weight-regular);
  font-style: normal;
  font-variant: normal;
  font-feature-settings: normal;
  line-height: 1.55;
  letter-spacing: normal;
  word-spacing: normal;
  text-align: left;
  text-transform: none;
  text-indent: 0;
  text-shadow: none;
  white-space: normal;
  word-break: normal;
  overflow-wrap: break-word;
  hyphens: manual;
  list-style: disc outside;
  color: var(--color-ink);
  -webkit-text-fill-color: currentColor;   /* degrade başlıklardan sızmasın */
  -webkit-font-smoothing: auto;
  text-rendering: auto;
  tab-size: 8;
  cursor: auto;
  direction: ltr;
  position: relative;
  z-index: 1;
}

/* MK'un genel eleman kuralları gömme içinde tarayıcı varsayılanına döner.
   :where() sayesinde eklentinin kendi kuralları bunları rahatça ezer. */
.mk-gomme :where(img, svg, video, canvas, picture) {
  display: revert;
  max-width: 100%;
  height: revert;
  vertical-align: revert;
}
.mk-gomme :where(h1, h2, h3, h4, h5, h6) {
  font-family: inherit; font-weight: 700; text-transform: none;
  letter-spacing: normal; line-height: 1.25; margin: 1em 0 .5em;
}
.mk-gomme :where(h1) { font-size: 1.9em; }
.mk-gomme :where(h2) { font-size: 1.55em; }
.mk-gomme :where(h3) { font-size: 1.3em; }
.mk-gomme :where(h4, h5, h6) { font-size: 1.1em; }
.mk-gomme :where(p, ul, ol, dl, pre, blockquote, table, figure) { margin: 0 0 1em; }
.mk-gomme :where(ul, ol) { padding-left: 1.4em; }
.mk-gomme :where(li) { display: list-item; margin: 0 0 .35em; }
.mk-gomme :where(a) { color: revert; text-decoration: revert; }
.mk-gomme :where(button, input, select, textarea) {
  font-family: inherit; font-size: inherit; line-height: normal; color: revert;
}
.mk-gomme :where(table) { border-collapse: collapse; width: auto; }
.mk-gomme :where(hr) { border: 0; border-top: 1px solid currentColor; opacity: .2; }
.mk-gomme :where(*, *::before, *::after) { box-sizing: border-box; }

/* Eklenti içinde ekran okuyucu metni yeniden görünür olmasın */
.mk-gomme .screen-reader-text { position: absolute !important; width: 1px; height: 1px;
  overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }

/* --- Kutu yok: arkada kontrast yüzeyi olmadığı için renk bölümden gelir ---- */
.mk-gomme--kutusuz { color: inherit; }

/* --- Hafif yalıtım: yalnız ölçek ve hiza düzeltilir, renk dokunulmaz ------- */
.mk-gomme--hafif {
  color: inherit;
  -webkit-text-fill-color: currentColor;
}

/* --- Yalıtım kapalı: hiçbir şey sıfırlanmaz (eski davranış) ---------------- */
.mk-gomme--kapali { all: unset; display: block; }

/* =============================================================================
   KUTU (kart) görünümleri
   ========================================================================== */
.mk-gomme-kutu { border-radius: var(--radius-xl); padding: var(--spacing-24); }

.mk-gomme-kutu--beyaz {
  background: #ffffff; color: var(--color-ink);
  border: 1px solid rgba(0, 0, 0, .08);
  box-shadow: 0 8px 32px rgba(0, 0, 0, .12);
}
.mk-gomme-kutu--acik {
  background: var(--color-haze); color: var(--color-ink);
  border: 1px solid rgba(0, 0, 0, .06);
}
.mk-gomme-kutu--cam {
  background: var(--cam-zemin); color: var(--cam-metin);
  border: 1px solid var(--cam-kenar);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}
.mk-gomme-kutu--koyu {
  background: rgba(12, 20, 38, .82); color: #ffffff;
  border: 1px solid rgba(255, 255, 255, .14);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}
/* Kutunun rengi yalıtımın rengini geçersiz kılar */
.mk-gomme-kutu--cam  > .mk-gomme,
.mk-gomme-kutu--koyu > .mk-gomme { color: inherit; }

/* =============================================================================
   GENİŞLİK · TAŞMA · ÖLÇEK
   ========================================================================== */
.mk-gomme-yuva { width: 100%; margin-inline: auto; }
.mk-gomme-yuva--dar    { max-width: var(--okuma-genislik); }
.mk-gomme-yuva--normal { max-width: var(--page-max-width); }
.mk-gomme-yuva--genis  { max-width: 1400px; }
.mk-gomme-yuva--tam    { max-width: none; }

/* Sığmayan içerik sayfayı yana kaydırmasın; kendi içinde kaysın. */
.mk-gomme--kaydir { overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
.mk-gomme--kaydir::-webkit-scrollbar { height: 8px; }
.mk-gomme--kaydir::-webkit-scrollbar-thumb { background: currentColor; opacity: .25; border-radius: 4px; }

/* Gömülen içerik genişliğini kendi yönetiyorsa onu saramayız.
   overflow-x:auto bir KAYDIRMA KUTUSU yaratır; içindeki her position:sticky
   öğe o kutuya hapsolur ve sayfayla birlikte kayar (yapışkan süzgeç sütunları
   üst menünün altına giriyordu). Kutu, içerik taşmasa bile oluşur.

   Bunu bir sözleşme olarak açıyoruz: kök öğesine data-mk-kendi-genisligi
   koyan eklenti çıktısı sarmalanmaz. */
.mk-gomme--kaydir:has([data-mk-kendi-genisligi]),
.mk-gomme--sinirli:has([data-mk-kendi-genisligi]),
/* Eski adla yazılmış eklentiler de tanınsın */
.mk-gomme--kaydir:has([data-uf-kendi-genisligi]),
.mk-gomme--sinirli:has([data-uf-kendi-genisligi]) {
  overflow: visible;
  max-height: none;
}

/* Geniş tabloları/ızgaraları küçülterek sığdır */
.mk-gomme--olcek-90 { zoom: .9; }
.mk-gomme--olcek-80 { zoom: .8; }
.mk-gomme--olcek-70 { zoom: .7; }

/* Yüksekliği sınırla, içeride kaydır */
.mk-gomme--sinirli { overflow-y: auto; }

@media (max-width: 640px) {
  .mk-gomme-kutu { padding: var(--spacing-20); border-radius: var(--radius-l, 12px); }
}

/* =============================================================================
   ZEMİNSİZ — eklentinin kendi kart zeminini kaldır
   -----------------------------------------------------------------------------
   Bazı eklentiler (tazminat/makbuz hesaplayıcıları gibi) çıktılarını kendi
   beyaz kartlarının içine koyar. MK'un cam paneline konduğunda kart içinde
   kart görünür. Burada YALNIZ kapsayıcıların zemini, gölgesi ve metin rengi
   devralınır; düğmeler, bağlantılar ve görseller eklentinin kendi renginde
   kalır — yoksa arayüz kullanılamaz hâle gelir.

   !important bilerek kullanıldı: bu kurallar eklentinin kendi zeminini ezmek
   için var ve yalnız panelden bu kutu işaretlenince devreye giriyor.
   ========================================================================== */
.mk-gomme--zeminsiz,
.mk-gomme--zeminsiz :is(div, section, article, aside, header, footer, main,
                        form, fieldset, legend, label, p, ul, ol, li, dl, dt, dd,
                        table, thead, tbody, tfoot, tr, th, td, span, strong, em, small,
                        h1, h2, h3, h4, h5, h6):not(:is(button, a, [role="button"],
                        [class*="button"], [class*="btn"], [class*="dugme"])) {
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: inherit !important;
}

/* Kenarlıklar sabit gri kalmasın, zemine uysun */
.mk-gomme--zeminsiz :is(div, section, article, table, th, td, li, hr) {
  border-color: color-mix(in srgb, currentColor 22%, transparent);
}

/* Form kutuları görünür kalmalı — saydam ama okunur bir yüzey.
   Düğme görünümlü input'lar (submit/button) bunun dışında tutulur. */
.mk-gomme--zeminsiz :is(input, select, textarea):not([type="submit"]):not([type="button"]):not([type="reset"]) {
  background-color: color-mix(in srgb, currentColor 10%, transparent) !important;
  background-image: none !important;
  border-color: color-mix(in srgb, currentColor 32%, transparent) !important;
  color: inherit !important;
  box-shadow: none !important;
}
.mk-gomme--zeminsiz :is(input, select, textarea)::placeholder { color: inherit; opacity: .55; }
.mk-gomme--zeminsiz :is(input, select, textarea):focus {
  outline: 2px solid color-mix(in srgb, currentColor 45%, transparent); outline-offset: 1px;
}

/* Onay kutuları ve tarih seçici simgesi koyu panelde kaybolmasın.
   Ters çevirme kararı vakte değil, panelin gerçek metin rengine bağlı:
   --cam-simge-ters her gökyüzü paletiyle birlikte belirtec.css'te tanımlanır. */
.mk-gomme--zeminsiz :is(input[type="checkbox"], input[type="radio"]) {
  accent-color: currentColor;
  width: 16px; height: 16px;
}
.mk-gomme--zeminsiz ::-webkit-calendar-picker-indicator,
.mk-gomme--zeminsiz ::-webkit-inner-spin-button,
.mk-gomme--zeminsiz ::-webkit-search-cancel-button {
  filter: invert(var(--gomme-simge-ters, 0));
}
.mk-gomme-kutu--cam  .mk-gomme--zeminsiz { --gomme-simge-ters: var(--cam-simge-ters, 0); }
.mk-gomme-kutu--koyu .mk-gomme--zeminsiz { --gomme-simge-ters: 1; }
