/* yz-kodlama — Ada Cam eşlemesi (Medya Okuryazarlığı -ada.css kalıbı, D116). Yalnız html[data-tema="ada"].canli altında; v2 yz-kodlama.css değişmez.
   Ders paketi sayfalarıyla (robot-atolyesi, zeka-oyunlari, dijital-guvenlik, medya-okuryazarligi) aynı kurallar:
   renk = sınıf/tema (sayfanın --yzk-renk değişkeni), yalnız ince ray, yumuşak zemin ve karo tonunda; metin hep koyu. */

/* ---- Kahraman: kalın alt çizgi yok; başlık Nunito 900; görsel cam çerçevede ---- */
html[data-tema="ada"].canli .yzk-hero { border-bottom: 0; }
html[data-tema="ada"].canli .yzk-hero__text h1 { font-family: var(--ac-font-baslik); font-weight: 900; letter-spacing: -.02em; color: var(--ac-metin); text-wrap: balance; }
html[data-tema="ada"].canli :is(.yzk-hero__lead, .yzk-ust, .yzk-hero__not) { color: var(--ac-metin-2); }
html[data-tema="ada"].canli .yzk-hero__adimlar li {
  border: 1px solid rgba(255,255,255,.95); color: var(--ac-metin);
  background: color-mix(in srgb, var(--yzk-adim, #7B5CFF) 20%, rgba(255,255,255,.82));
  box-shadow: 0 0 0 1px var(--ac-cizgi), 0 4px 12px -8px rgba(var(--ac-golge-r), .35);
}
html[data-tema="ada"].canli .yzk-sahne {
  background: linear-gradient(160deg, color-mix(in srgb, var(--yzk-renk) 12%, #FFFFFF), rgba(255,255,255,.7));
  border: 1px solid var(--ac-kenar); border-radius: 28px;
  box-shadow: 0 0 0 1px var(--ac-cizgi), var(--ac-golge-ust), inset 0 1px 0 #FFFFFF;
}
/* İlerleme: ince ray; girişsiz ziyaretçide (kilit uyarısı varken) boş çubuk gösterilmez */
html[data-tema="ada"].canli .yzk-hero__ilerleme .v2-progress { height: 8px; }
html[data-tema="ada"].canli body:has(.v2-notice--lock) .yzk-hero__ilerleme:has([aria-valuenow="0"]) { display: none; }

/* ---- Üst uyarı: tek ince cam şerit (sayfadaki ikinci kilit notu bunun altında sade kalır) ---- */
html[data-tema="ada"].canli .yzk-ust-not .v2-notice {
  min-height: 0; padding: 10px 16px; border-radius: 16px; font-size: var(--v2-text-sm);
  background: rgba(255,255,255,.62); box-shadow: 0 0 0 1px var(--ac-cizgi);
}
html[data-tema="ada"].canli .yzk-ust-not .v2-notice > .v2-icon { width: 20px; height: 20px; color: var(--ac-metin-2); }

/* ---- Sınıf seçici: cam sekme, sol renk rayı ince degrade; seçili = lavanta → mavi ---- */
html[data-tema="ada"].canli .yzk-secici { gap: 12px; }
html[data-tema="ada"].canli .yzk-sinif-btn {
  min-height: 68px; padding-left: 26px; border: 1px solid var(--ac-kenar); border-radius: 20px; outline: 0;
  background: var(--ac-cam); color: var(--ac-metin);
  box-shadow: 0 0 0 1px var(--ac-cizgi), var(--ac-golge), inset 0 1px 0 #FFFFFF;
  -webkit-backdrop-filter: var(--ac-blur); backdrop-filter: var(--ac-blur);
  transition: transform .25s var(--ac-ease), box-shadow .25s var(--ac-ease), background-color .2s;
}
html[data-tema="ada"].canli .yzk-sinif-btn::before {
  left: 11px; top: 14px; bottom: 14px; width: 4px; border-radius: 4px;
  background: linear-gradient(180deg, var(--yzk-renk), color-mix(in srgb, var(--yzk-renk) 25%, transparent));
}
html[data-tema="ada"].canli .yzk-sinif-btn:hover { background: rgba(255,255,255,.94); transform: translateY(-2px); box-shadow: 0 0 0 1px var(--ac-cizgi), var(--ac-golge-ust); }
html[data-tema="ada"].canli .yzk-sinif-btn:active { transform: translateY(0); }
html[data-tema="ada"].canli .yzk-sinif-btn__ad { font-family: var(--ac-font-baslik); font-weight: 900; }
html[data-tema="ada"].canli .yzk-sinif-btn__alt { color: var(--ac-metin-2); }
html[data-tema="ada"].canli .yzk-sinif-btn[aria-pressed="true"] {
  color: #FFFFFF; border-color: transparent; outline: 0; background: var(--ac-birincil);
  box-shadow: 0 16px 32px -14px rgba(91,72,255,.75), inset 0 1px 0 rgba(255,255,255,.35);
}
html[data-tema="ada"].canli .yzk-sinif-btn[aria-pressed="true"] .yzk-sinif-btn__alt { color: #FFFFFF; opacity: .95; }
html[data-tema="ada"].canli .yzk-sinif-btn[aria-pressed="true"]::before { background: rgba(255,255,255,.75); }
html[data-tema="ada"].canli .yzk-sinif-btn:focus-visible { outline: none; box-shadow: var(--ac-odak), var(--ac-golge-ust); }

/* ---- Sınıf özet kartı + sayı kutuları ---- */
html[data-tema="ada"].canli .yzk-kbas {
  position: relative; isolation: isolate; padding: 24px; border: 1px solid var(--ac-kenar); border-radius: 28px; background: var(--ac-cam);
  box-shadow: 0 0 0 1px var(--ac-cizgi), var(--ac-golge), inset 0 1px 0 #FFFFFF;
  -webkit-backdrop-filter: var(--ac-blur); backdrop-filter: var(--ac-blur);
}
html[data-tema="ada"].canli .yzk-kbas::after {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: radial-gradient(90% 120% at 0% 0%, color-mix(in srgb, var(--yzk-renk) 16%, transparent), transparent 60%);
}
html[data-tema="ada"].canli .yzk-kbas h2 { font-weight: 900; letter-spacing: -.02em; }
html[data-tema="ada"].canli .yzk-kbas__kisa { color: var(--ac-metin-2); }
html[data-tema="ada"].canli .yzk-olgu { gap: 10px; }
html[data-tema="ada"].canli .yzk-olgu li {
  padding: 10px 14px; border: 1px solid var(--ac-kenar); border-radius: 16px; background: rgba(255,255,255,.74);
  box-shadow: 0 0 0 1px var(--ac-cizgi), 0 6px 16px -12px rgba(var(--ac-golge-r), .45);
}
html[data-tema="ada"].canli .yzk-olgu b { font-family: var(--ac-font-baslik); font-weight: 900; color: var(--ac-metin); }
html[data-tema="ada"].canli .yzk-olgu span { color: var(--ac-metin-2); }

/* ---- Tema başlıkları: kalın sol şerit → ince degrade ray (renk = tema) ---- */
html[data-tema="ada"].canli .yzk-tema { position: relative; border-left: 0; padding-left: 20px; }
html[data-tema="ada"].canli .yzk-tema::before {
  content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 4px; border-radius: 4px;
  background: linear-gradient(180deg, var(--yzk-renk) 0%, color-mix(in srgb, var(--yzk-renk) 35%, transparent) 70%, transparent 100%);
}
html[data-tema="ada"].canli .yzk-tema__bas h3 { font-weight: 900; letter-spacing: -.01em; }
html[data-tema="ada"].canli .yzk-tema__bas p { color: var(--ac-metin-2); }

/* ---- Ünite kartları: cam kart, hafta etiketi kartın içinde hap ---- */
html[data-tema="ada"].canli .yzk-uniteler { gap: 16px; }
/* Yetim kart yok: temadaki ünite sayısı kadar sütun (en çok 3), kartlar satırı doldurur */
@media (min-width: 640px) { html[data-tema="ada"].canli .yzk-uniteler { grid-template-columns: repeat(auto-fit, minmax(min(100%, 330px), 1fr)); } }
html[data-tema="ada"].canli .yzk-ukart {
  isolation: isolate; padding: 48px 16px 16px; border: 1px solid var(--ac-kenar); border-radius: 22px; background: var(--ac-cam); color: var(--ac-metin);
  box-shadow: 0 0 0 1px var(--ac-cizgi), var(--ac-golge), inset 0 1px 0 #FFFFFF;
  -webkit-backdrop-filter: var(--ac-blur); backdrop-filter: var(--ac-blur);
  transition: transform .3s var(--ac-ease), box-shadow .3s var(--ac-ease);
}
html[data-tema="ada"].canli .yzk-ukart::after {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: radial-gradient(110% 80% at 0% 0%, color-mix(in srgb, var(--yzk-renk) 11%, transparent), transparent 55%);
}
html[data-tema="ada"].canli .yzk-ukart:hover {
  background: var(--ac-cam); transform: translateY(-4px);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--yzk-renk) 30%, transparent), var(--ac-golge-ust), inset 0 1px 0 #FFFFFF;
}
html[data-tema="ada"].canli .yzk-ukart:active { transform: translateY(-1px) scale(.995); }
html[data-tema="ada"].canli .yzk-ukart:focus-visible { outline: none; box-shadow: var(--ac-odak), var(--ac-golge-ust); }
html[data-tema="ada"].canli .yzk-ukart__hafta {
  left: 14px; top: 14px; display: inline-flex; align-items: center; min-height: 26px; padding: 2px 11px; border: 0; border-radius: 999px;
  color: var(--ac-metin); font-family: var(--v2-font-body); font-weight: 800; letter-spacing: .01em;
  background: color-mix(in srgb, var(--yzk-renk) 16%, rgba(255,255,255,.9));
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--yzk-renk) 28%, transparent);
}
html[data-tema="ada"].canli .yzk-ukart__ad { font-family: var(--ac-font-baslik); font-weight: 800; color: var(--ac-metin); }
html[data-tema="ada"].canli :is(.yzk-ukart__no, .yzk-ukart__saat) { color: var(--ac-metin-2); }
html[data-tema="ada"].canli .yzk-ukart__kavram { color: var(--ac-metin-2); }

/* ---- Görsel kutuları: çerçevesiz, tema renginde yumuşak karo ---- */
html[data-tema="ada"].canli .yzk-gorsel {
  border: 0; border-radius: 18px;
  background: linear-gradient(150deg, color-mix(in srgb, var(--yzk-renk) 20%, #FFFFFF), color-mix(in srgb, var(--yzk-renk) 6%, #FFFFFF));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.9), 0 8px 18px -12px color-mix(in srgb, var(--yzk-renk) 70%, transparent);
}
html[data-tema="ada"].canli .yzk-gorsel--tema { border-radius: 18px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.9), 0 10px 20px -12px color-mix(in srgb, var(--yzk-renk) 80%, transparent); }
html[data-tema="ada"].canli .yzk-gorsel--buyuk { border-radius: 24px; }

/* ---- Rozet / etiket hapları ---- */
html[data-tema="ada"].canli :is(.yzk-rozet, .yzk-etiket) { border: 1px solid rgba(91,72,200,.14); color: var(--ac-metin); }
html[data-tema="ada"].canli .yzk-etiket { background: rgba(255,255,255,.82); }
html[data-tema="ada"].canli .yzk-rozet--dijital { background: rgba(52,217,176,.16); border-color: rgba(11,110,102,.22); }
html[data-tema="ada"].canli .yzk-rozet--kagit { background: rgba(255,154,31,.16); border-color: rgba(138,75,0,.2); }

/* ---- Sınıf hazır değil kutusu ---- */
html[data-tema="ada"].canli .yzk-hazir {
  border: 1.5px dashed rgba(123,92,255,.35); border-radius: var(--ac-r); background: rgba(255,255,255,.6);
}

/* ---- Ünite görünümü ---- */
html[data-tema="ada"].canli :is(.yzk-ubas, .yzk-onot, .yzk-eylem) {
  position: relative; isolation: isolate; border: 1px solid var(--ac-kenar); border-radius: 28px; background: var(--ac-cam);
  box-shadow: 0 0 0 1px var(--ac-cizgi), var(--ac-golge), inset 0 1px 0 #FFFFFF;
  -webkit-backdrop-filter: var(--ac-blur); backdrop-filter: var(--ac-blur);
}
html[data-tema="ada"].canli .yzk-ubas::after {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: radial-gradient(80% 120% at 0% 0%, color-mix(in srgb, var(--yzk-renk) 16%, transparent), transparent 60%);
}
html[data-tema="ada"].canli :is(.yzk-ubas h2, .yzk-eylem__bas, .yzk-blok > h3) { font-family: var(--ac-font-baslik); font-weight: 900; letter-spacing: -.015em; color: var(--ac-metin); }
html[data-tema="ada"].canli :is(.yzk-hedefler li, .yzk-dersi, .yzk-adim__govde, .yzk-onot__kutu, .yzk-veli__kutu, .yzk-kkart, .yzk-oyun) {
  border: 1px solid var(--ac-kenar); background: rgba(255,255,255,.78);
  box-shadow: 0 0 0 1px var(--ac-cizgi), 0 6px 16px -12px rgba(var(--ac-golge-r), .4);
}
html[data-tema="ada"].canli :is(.yzk-hedefler li, .yzk-dersi, .yzk-adim__govde, .yzk-onot__kutu, .yzk-veli__kutu, .yzk-oyun) { border-radius: 18px; }
html[data-tema="ada"].canli .yzk-hedefler li::before { border: 0; background: linear-gradient(140deg, color-mix(in srgb, var(--yzk-renk) 60%, #FFFFFF), var(--yzk-renk)); }
html[data-tema="ada"].canli .yzk-adim::before { border-left-width: 3px; opacity: .45; }
html[data-tema="ada"].canli .yzk-adim__ic {
  border: 0; color: #FFFFFF; background: linear-gradient(140deg, color-mix(in srgb, var(--yzk-renk) 55%, #FFFFFF), var(--yzk-renk));
  box-shadow: 0 8px 16px -8px color-mix(in srgb, var(--yzk-renk) 85%, transparent), inset 0 1px 0 rgba(255,255,255,.45);
}
html[data-tema="ada"].canli .yzk-adim__ic .v2-icon { color: #FFFFFF; --v2-icon-fill: rgba(255,255,255,.3); }
html[data-tema="ada"].canli .yzk-oyun { background: rgba(255,255,255,.78); }
html[data-tema="ada"].canli .yzk-kkart { border-radius: 16px; }
html[data-tema="ada"].canli .yzk-kkart__simge { background: linear-gradient(150deg, rgba(255,210,74,.32), rgba(255,154,31,.14)); }
html[data-tema="ada"].canli .yzk-cikis__harf { border-color: rgba(91,72,200,.3); }
html[data-tema="ada"].canli .yzk-onot { background: linear-gradient(165deg, rgba(227,234,255,.9), rgba(255,255,255,.7)); }
html[data-tema="ada"].canli .yzk-eylem { background: linear-gradient(165deg, rgba(255,246,222,.92), rgba(255,255,255,.72)); }
html[data-tema="ada"].canli .yzk-eylem__bas { color: var(--ac-metin); }
html[data-tema="ada"].canli .yzk-eylem__adim {
  border: 1px solid var(--ac-kenar); border-radius: 22px; color: var(--ac-metin);
  background: color-mix(in srgb, var(--yzk-adim) 18%, rgba(255,255,255,.88));
  box-shadow: 0 0 0 1px var(--ac-cizgi), 0 8px 20px -14px rgba(var(--ac-golge-r), .45);
}
html[data-tema="ada"].canli .yzk-eylem__ic {
  border: 0; background: linear-gradient(140deg, color-mix(in srgb, var(--yzk-adim) 55%, #FFFFFF), var(--yzk-adim));
  box-shadow: 0 8px 16px -8px color-mix(in srgb, var(--yzk-adim) 85%, transparent), inset 0 1px 0 rgba(255,255,255,.5);
}
html[data-tema="ada"].canli .yzk-eylem__no { border: 0; color: var(--ac-metin); background: rgba(255,255,255,.9); box-shadow: 0 0 0 1px var(--ac-cizgi); }
html[data-tema="ada"].canli .yzk-eylem__ad { font-family: var(--ac-font-baslik); font-weight: 900; }
html[data-tema="ada"].canli .yzk-eylem__dip { color: var(--ac-metin-2); }

/* ---- Hareket azaltma ve zayıf cihaz ---- */
@media (prefers-reduced-motion: reduce) {
  html[data-tema="ada"].canli :is(.yzk-ukart, .yzk-sinif-btn) { transition: none; }
  html[data-tema="ada"].canli :is(.yzk-ukart, .yzk-sinif-btn):hover { transform: none; }
}
html:is(.efekt-az, .a11y-calm)[data-tema="ada"].canli :is(.yzk-ukart, .yzk-sinif-btn, .yzk-kbas, .yzk-ubas, .yzk-onot, .yzk-eylem) {
  -webkit-backdrop-filter: none; backdrop-filter: none; transform: none; transition: none;
}