/* dersler — Ada Cam eşlemesi (D116). Yalnız html[data-tema="ada"].canli altında; v2 dersler.css değişmez.
   Renk = paket (kart, ikon karosu, hap düğme aynı aileden). Sayfada sarı birincil düğme yok: her kartın eylemi
   paket renginde hap; göz, renkli ikon karosu ve başlıkla karta gider. */

/* -- paket renk aileleri (dersler.css'teki v2 adları → ada-cam aileleri) -- */
html[data-tema="ada"].canli .ds-kart[data-renk="yellow"] { --ra: #FFD24A; --rb: #FF9A1F; --rr: 255, 170, 40; --ri: #8A4B00; }
html[data-tema="ada"].canli .ds-kart[data-renk="blue"]   { --ra: #38BDF8; --rb: #3B6CFF; --rr: 56, 140, 255; --ri: #1D4FC4; }
html[data-tema="ada"].canli .ds-kart[data-renk="green"]  { --ra: #8BE36B; --rb: #22B07D; --rr: 50, 190, 120; --ri: #19704A; }
html[data-tema="ada"].canli .ds-kart[data-renk="tomato"] { --ra: #FF9A6B; --rb: #FF5C7A; --rr: 255, 110, 110; --ri: #B0302E; }
html[data-tema="ada"].canli .ds-kart[data-renk="teal"]   { --ra: #34D9B0; --rb: #14B8C8; --rr: 20, 190, 170; --ri: #0B6E66; }
html[data-tema="ada"].canli .ds-kart[data-renk="purple"] { --ra: #C08BFF; --rb: #8A5CFF; --rr: 150, 100, 255; --ri: #5B2BB8; }

/* -- kahraman: kalın alt çizgi ve kareli zemin yok -- */
html[data-tema="ada"].canli .ds-bas { border-bottom: 0; background: transparent; background-image: none; }
html[data-tema="ada"].canli .ds-bas .v2-container { padding-block: var(--v2-space-6) var(--v2-space-3); }
html[data-tema="ada"].canli .ds-bas h1 { font-family: var(--ac-font-baslik); font-weight: 900; letter-spacing: -.02em; }
html[data-tema="ada"].canli .ds-bas__lead { color: var(--ac-metin-2); }

/* -- paket ızgarası -- */
html[data-tema="ada"].canli .ds-paketler { padding-block: var(--v2-space-4) var(--v2-space-8); }
html[data-tema="ada"].canli .ds-izgara { gap: 20px; }

/* -- paket kartı: cam + paket renginde yumuşak yıkama -- */
html[data-tema="ada"].canli .ds-kart {
  isolation: isolate; overflow: visible; gap: 14px 18px; padding: 24px 24px 20px; color: var(--ac-metin);
  border: 1px solid var(--ac-kenar); border-radius: var(--ac-r); 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);
  transition: transform .3s var(--ac-ease), box-shadow .3s var(--ac-ease);
}
/* v2'nin üst renk şeridi yerine köşeden yayılan paket tonu */
html[data-tema="ada"].canli .ds-kart::before {
  inset: 0; height: auto; z-index: -1; border-radius: inherit; pointer-events: none;
  background: radial-gradient(120% 95% at 0% 0%, rgba(var(--rr), .18), transparent 56%),
              radial-gradient(80% 70% at 100% 100%, rgba(var(--rr), .08), transparent 60%);
}
html[data-tema="ada"].canli .ds-kart:hover {
  transform: translateY(-4px);
  box-shadow: 0 0 0 1px rgba(var(--rr), .25), var(--ac-golge-ust), 0 22px 44px -24px rgba(var(--rr), .7), inset 0 1px 0 #FFFFFF;
}
html[data-tema="ada"].canli .ds-kart:focus-within { box-shadow: 0 0 0 1px rgba(var(--rr), .3), var(--ac-golge-ust), inset 0 1px 0 #FFFFFF; }

/* İkon karosu: paket degradesi + beyaz ikon */
html[data-tema="ada"].canli .ds-kart__ikon {
  width: 60px; height: 60px; border: 0; border-radius: 18px; color: #FFFFFF;
  background: linear-gradient(140deg, var(--ra), var(--rb));
  box-shadow: 0 10px 20px -8px rgba(var(--rr), .8), inset 0 1px 0 rgba(255,255,255,.45), inset 0 -2px 0 rgba(0,0,0,.08);
}
html[data-tema="ada"].canli .ds-kart__ikon .v2-icon { width: 30px; height: 30px; color: #FFFFFF; --v2-icon-fill: rgba(255,255,255,.3); }

/* Metin */
html[data-tema="ada"].canli .ds-kart__metin { gap: 6px; }
html[data-tema="ada"].canli .ds-kart__ust {
  justify-self: start; display: inline-block; min-height: 26px; padding: 4px 11px 3px; border-radius: var(--ac-r-pill); white-space: pre-wrap;
  font-family: var(--v2-font-body); font-weight: 800; font-size: var(--v2-text-xs); letter-spacing: .01em;
  color: var(--ri); background: rgba(var(--rr), .12);
}
html[data-tema="ada"].canli .ds-kart h2 { font-family: var(--ac-font-baslik); font-weight: 900; font-size: 1.4rem; line-height: 1.15; letter-spacing: -.015em; color: var(--ac-metin); }
html[data-tema="ada"].canli .ds-kart__metin > p:last-child { color: var(--ac-metin-2); font-size: var(--v2-text-md, 1rem); line-height: 1.5; }

/* Alt satır: hap düğme + öğretmen bağlantısı */
html[data-tema="ada"].canli .ds-kart__alt { gap: 8px 16px; padding-top: 4px; }

/* "Derslere başla": tek birincil kuralı → sarı düğme değil, paket renginde hap */
html[data-tema="ada"].canli .ds-kart .v2-btn--primary {
  min-height: 48px; padding: 0 20px; border: 0; border-radius: var(--ac-r-pill);
  color: var(--ri); background: rgba(var(--rr), .14);
  box-shadow: inset 0 0 0 1px rgba(var(--rr), .28);
  font-family: var(--v2-font-body); font-weight: 800;
  transition: background-color .2s, color .2s, box-shadow .25s, transform .2s var(--ac-ease);
}
html[data-tema="ada"].canli .ds-kart .v2-btn--primary .v2-icon { color: currentColor; transition: transform .25s var(--ac-ease); }
html[data-tema="ada"].canli .ds-kart .v2-btn--primary:hover {
  transform: translateY(-1px); filter: none; color: #FFFFFF;
  background: linear-gradient(135deg, var(--ra), var(--rb));
  box-shadow: 0 10px 22px -10px rgba(var(--rr), .9), inset 0 1px 0 rgba(255,255,255,.4);
}
html[data-tema="ada"].canli .ds-kart .v2-btn--primary:hover .v2-icon { transform: translateX(3px); }
/* Açık aileler (güneş, yaprak, nane): degrade üstünde beyaz yazı AA değil → koyu yazı */
html[data-tema="ada"].canli .ds-kart:is([data-renk="yellow"], [data-renk="green"], [data-renk="teal"]) .v2-btn--primary:hover { color: #1B1846; }
html[data-tema="ada"].canli .ds-kart .v2-btn--primary:focus-visible { outline: none; box-shadow: var(--ac-odak); }
/* canli.css'in ışık süpürmesi hapta gereksiz */
html[data-tema="ada"].canli .ds-kart .v2-btn--primary::after { content: none; }

html[data-tema="ada"].canli .ds-kart__plan {
  color: var(--ac-metin-2); font-weight: 700; text-decoration: underline; text-decoration-color: rgba(91,72,200,.3);
  text-underline-offset: 4px; text-decoration-thickness: 1.5px; border-radius: 8px; padding-inline: 4px;
}
html[data-tema="ada"].canli .ds-kart__plan:hover { color: var(--ac-metin); text-decoration-color: currentColor; }
html[data-tema="ada"].canli .ds-kart__plan:focus-visible { outline: none; box-shadow: var(--ac-odak); }

/* -- mobil -- */
@media (max-width: 760px) {
  html[data-tema="ada"].canli .ds-bas .v2-container { padding-block: var(--v2-space-5) var(--v2-space-2); }
  html[data-tema="ada"].canli .ds-izgara { gap: 14px; }
  html[data-tema="ada"].canli .ds-kart { padding: 18px 18px 16px; gap: 12px 14px; }
  html[data-tema="ada"].canli .ds-kart__ikon { width: 52px; height: 52px; border-radius: 16px; }
  html[data-tema="ada"].canli .ds-kart__ikon .v2-icon { width: 26px; height: 26px; }
  html[data-tema="ada"].canli .ds-kart h2 { font-size: 1.22rem; }
}

/* -- hareket azaltma / sakin mod -- */
@media (prefers-reduced-motion: reduce) {
  html[data-tema="ada"].canli :is(.ds-kart, .ds-kart .v2-btn--primary, .ds-kart .v2-btn--primary .v2-icon) { transition: none; }
  html[data-tema="ada"].canli :is(.ds-kart, .ds-kart .v2-btn--primary):hover, html[data-tema="ada"].canli .ds-kart .v2-btn--primary:hover .v2-icon { transform: none; }
}
html.efekt-az[data-tema="ada"].canli .ds-kart, html.a11y-calm[data-tema="ada"].canli .ds-kart {
  transition: none; transform: none; -webkit-backdrop-filter: none; backdrop-filter: none; background: #FFFFFF;
}
html.efekt-az[data-tema="ada"].canli .ds-kart .v2-btn--primary, html.a11y-calm[data-tema="ada"].canli .ds-kart .v2-btn--primary { transition: none; transform: none; }
@media print {
  html[data-tema="ada"].canli .ds-kart { box-shadow: none; border: 1px solid #C9C6E0; background: #FFFFFF; -webkit-backdrop-filter: none; backdrop-filter: none; }
}


/* -- Sahneli paket kartları (2026-10-27 sahip: Oyunlar kartlarıyla aynı tarz; ikon ve açıklama yok).
   Üstte paketin yüzen ada sahnesi (assets/dersler/sahne/<paket>.webp; Higgsfield, KAYNAKLAR §11.3 #33; yoksa paket degradesi),
   sol üstte sınıf · ders sayısı hapı + cam başlık; altta beyaz şeritte "Derslere başla" ve öğretmen bağlantısı. -- */
html[data-tema="ada"].canli .ds-kart[data-renk="yellow"] { --ds-sahne: url("../../assets/dersler/sahne/yz.webp?v=4"); }
html[data-tema="ada"].canli .ds-kart[data-renk="blue"]   { --ds-sahne: url("../../assets/dersler/sahne/robotik.webp?v=4"); }
html[data-tema="ada"].canli .ds-kart[data-renk="green"]  { --ds-sahne: url("../../assets/dersler/sahne/dg.webp?v=4"); }
html[data-tema="ada"].canli .ds-kart[data-renk="tomato"] { --ds-sahne: url("../../assets/dersler/sahne/mo.webp?v=4"); }
html[data-tema="ada"].canli .ds-kart[data-renk="teal"]   { --ds-sahne: url("../../assets/dersler/sahne/zo.webp?v=4"); }
html[data-tema="ada"].canli .ds-kart[data-renk="purple"] { --ds-sahne: url("../../assets/dersler/sahne/pa.webp?v=4"); }
html[data-tema="ada"].canli .ds-izgara { gap: 24px; }
html[data-tema="ada"].canli .ds-kart { position: relative; display: block; padding: 0; overflow: hidden; border-radius: 30px; background: rgba(255,255,255,.92); }
html[data-tema="ada"].canli .ds-kart::before { content: none; }
html[data-tema="ada"].canli .ds-kart__sahne {
  display: block; position: relative; overflow: hidden; aspect-ratio: 16 / 9;
  background: linear-gradient(150deg, rgba(var(--rr), .35), rgba(var(--rr), .12));
}
html[data-tema="ada"].canli .ds-kart__sahne::before {
  content: ""; position: absolute; inset: 0; background: var(--ds-sahne, none) center / cover no-repeat; transition: transform .7s var(--ac-ease);
}
html[data-tema="ada"].canli .ds-kart:hover .ds-kart__sahne::before { transform: scale(1.05); }
html[data-tema="ada"].canli .ds-kart__metin { position: absolute; top: 18px; left: 22px; right: 22px; z-index: 1; display: grid; gap: 8px; justify-items: start; }
html[data-tema="ada"].canli .ds-kart__ust { background: rgba(255,255,255,.88); box-shadow: 0 4px 12px -6px rgba(var(--ac-golge-r), .5); white-space: nowrap; }
html[data-tema="ada"].canli .ds-kart h2 {
  padding: 8px 16px 9px; border-radius: 18px; font-size: clamp(1.25rem, 2.2vw, 1.7rem); line-height: 1.12;
  background: rgba(255,255,255,.84); box-shadow: 0 10px 24px -14px rgba(var(--ac-golge-r), .7), inset 0 1px 0 #FFFFFF;
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
html[data-tema="ada"].canli .ds-kart__alt { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 16px 22px 20px; }
@media (max-width: 760px) {
  html[data-tema="ada"].canli .ds-kart__metin { top: 14px; left: 16px; right: 16px; }
  html[data-tema="ada"].canli .ds-kart__alt { padding: 14px 16px 16px; }
}
@media (prefers-reduced-motion: reduce) { html[data-tema="ada"].canli .ds-kart:hover .ds-kart__sahne::before { transform: none; } }
html:is(.efekt-az, .a11y-calm)[data-tema="ada"].canli .ds-kart { background: #FFFFFF; }
/* "Derslere başla": paket renginde hap yerine sitenin moru (2026-10-27 sahip: sarı düğme yok) */
html[data-tema="ada"].canli .ds-kart .v2-btn--primary { color: #FFFFFF; background: var(--ac-birincil); box-shadow: 0 10px 22px -10px rgba(91,72,255,.75), inset 0 1px 0 rgba(255,255,255,.35); }
html[data-tema="ada"].canli .ds-kart .v2-btn--primary .v2-icon { color: #FFFFFF; }
html[data-tema="ada"].canli .ds-kart .v2-btn--primary:hover, html[data-tema="ada"].canli .ds-kart:is([data-renk="yellow"], [data-renk="green"], [data-renk="teal"]) .v2-btn--primary:hover { color: #FFFFFF; background: var(--ac-birincil); box-shadow: 0 14px 26px -10px rgba(91,72,255,.9), inset 0 1px 0 rgba(255,255,255,.35); }

/* ---- Stüdyo görselleri (2026-10-28 sahip örneği): başlık solda büyük ve yalın, sınıf · ders hapı gri. Eski görseller assets/yedek/kart-ada-2026-10-27/. */
html[data-tema="ada"].canli .ds-kart__metin { top: 26px; left: 30px; right: auto; max-width: 52%; gap: 14px; }
html[data-tema="ada"].canli .ds-kart__ust { background: rgba(123,92,255,.10); color: var(--ac-metin-2); box-shadow: none; }
html[data-tema="ada"].canli .ds-kart h2 {
  padding: 0; background: none; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none;
  font-size: clamp(1.7rem, 3.2vw, 2.7rem); line-height: 1.04; letter-spacing: -.025em; color: #0F0E1A;
}
html[data-tema="ada"].canli .ds-kart__alt { border-top: 1px solid rgba(91,72,200,.10); padding: 16px 30px 22px; }
@media (max-width: 760px) { html[data-tema="ada"].canli .ds-kart__metin { top: 16px; left: 18px; max-width: 56%; } }
/* 2026-10-28 sahip: kartın sol üstündeki "sınıf · ders sayısı" hapı görünmesin (ekran okuyucu için metin kalır) */
html[data-tema="ada"].canli .ds-kart .ds-kart__ust { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }