/* ═══════════════════════════════════════════════════════════════
   LCC — CAM GÖRÜNÜMÜ  (lcc_glass.css)   — iOS 26 "Liquid Glass" esinli
   ───────────────────────────────────────────────────────────────
   GERİ ALMA: bu dosya tamamen EKLENTİ. Kaldırmak için
     1) bu dosyayı sil,
     2) sayfalardaki  <link rel="stylesheet" href="lcc_glass.css">
        satırlarını sil  (grep -l lcc_glass.css webapp/*.html),
     3) sw.js önbellek listesinden '/lcc_glass.css' satırını sil.
   Başka hiçbir dosyada cam için kod yok.

   Nasıl çalışıyor: modüllerin hepsi ortak renk değişkenlerini
   (--bg2, --bg3, --card-bg-grad, --card-border ...) kullanıyor. Bu dosya
   HER SAYFADA EN SON yüklenir ve o değişkenleri yarı saydam yapar;
   arkaya renkli bir zemin (aura) koyar; yüzeylere bulanıklık ekler.
   ═══════════════════════════════════════════════════════════════ */

/* ── 1) Yarı saydam yüzey değişkenleri ── */
body.ecam-dark{
  --bg2:rgba(28,42,66,.74);
  --bg3:rgba(38,56,86,.72);
  --border:rgba(140,190,255,.16);
  --border2:rgba(140,190,255,.26);
  --detail-bg:rgba(14,22,38,.86);
  --card-bg-grad:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.01) 65%),rgba(26,38,60,.72);
  --card-border:rgba(255,255,255,.10);
  --card-shadow:0 1px 0 rgba(255,255,255,.14) inset,0 -1px 0 rgba(255,255,255,.03) inset,0 4px 16px rgba(0,0,0,.28);
  --ctl-bg:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.05));
  --ctl-bd:rgba(255,255,255,.14);
  --ctl-sh:0 1px 0 rgba(255,255,255,.16) inset,0 2px 8px rgba(0,0,0,.25);
  --glass-float:rgba(16,24,40,.80);
  --aura:
    radial-gradient(65% 45% at 10% 6%,rgba(0,190,255,.26),transparent 72%),
    radial-gradient(60% 45% at 95% 32%,rgba(140,90,255,.24),transparent 72%),
    radial-gradient(75% 50% at 25% 100%,rgba(0,120,220,.24),transparent 72%),
    radial-gradient(55% 40% at 90% 92%,rgba(0,210,170,.14),transparent 72%);
}
body.ecam-light{
  --bg2:rgba(255,255,255,.74);
  --bg3:rgba(255,255,255,.60);
  --border:rgba(255,255,255,.75);
  --border2:rgba(120,150,180,.35);
  --detail-bg:rgba(246,249,252,.86);
  --card-bg-grad:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.70));
  --card-border:rgba(255,255,255,.85);
  --card-shadow:0 1px 0 rgba(255,255,255,.95) inset,0 4px 16px rgba(30,60,100,.10);
  --ctl-bg:linear-gradient(180deg,rgba(255,255,255,.80),rgba(255,255,255,.50));
  --ctl-bd:rgba(255,255,255,.9);
  --glass-float:rgba(250,252,255,.82);
  --aura:
    radial-gradient(60% 45% at 12% 8%,rgba(0,170,240,.20),transparent 70%),
    radial-gradient(55% 45% at 92% 30%,rgba(160,120,255,.18),transparent 70%),
    radial-gradient(70% 50% at 30% 100%,rgba(80,170,255,.18),transparent 70%),
    radial-gradient(50% 40% at 85% 95%,rgba(0,210,170,.12),transparent 70%);
}
/* lcc_theme.css'teki mobil dark bloğu aynı seçiciyle bg2/kart değerlerini
   yeniden yazıyor; o blok ondan sonra gelmediği için burada tekrar. */
@media (max-width:768px){
  body.ecam-dark{
    --bg2:rgba(28,42,66,.74);
    --bg3:rgba(38,56,86,.72);
    --card-bg-grad:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.01) 65%),rgba(26,38,60,.72);
    --card-border:rgba(255,255,255,.10);
    --card-shadow:0 1px 0 rgba(255,255,255,.14) inset,0 4px 14px rgba(0,0,0,.26);
  }
}

/* ── 2) Renkli zemin (aura) — sabit, hareketsiz (boya maliyeti bir kez) ──
   z-index:-1 → içeriğin ALTINDA, gövde renginin ÜSTÜNDE. */
body.ecam-dark::after,body.ecam-light::after{
  content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:var(--aura);
}
/* Modül zemini (02'nin panelleri --bg kullanıyor) → cam olsun */
body .panel{background:var(--bg2)}

/* ── 3) Bulanıklık: yüzeyler ──
   Liste kartlarında (.task-item, .task-card, .item ...) gerçek bulanıklık
   BİLEREK YOK: Görevler'de 80 kartla ölçüldü (17.09.2026), kaydırmada
   karelerin ~%6'sı 50ms'ye çıkıyordu; kapatınca 0. Arkadaki aura yumuşak
   bir degrade olduğu için kart bulanıklığı gözle fark edilmiyor — cam
   görünümünü kartlarda saydamlık + ışık çizgisi taşıyor (bkz. 1). */
.panel,.topbar,.oc,.ozet-card,.week-panel,.place-detail-box,
.dp,.detail-panel,.det-col,.task-detail-col,.modal,.rp,.np,
#lcc-sidebar,#lcc-mobile-header,#lcc-date-bar,#lcc-bottom-nav{
  -webkit-backdrop-filter:blur(12px) saturate(150%);
  backdrop-filter:blur(12px) saturate(150%);
}

/* Mobilde DEV liste kaplarında bulanıklık YOK. Rutinler gibi modüllerde tüm
   liste tek bir .panel içinde (80 satırda ~10.000px). iOS WebKit, katman
   sınırını aşan backdrop-filter'lı öğeyi hızlı kaydırmada tam boyayamıyor:
   ekranın altı boş (zemin) görünüp sonra doluyordu. Arkadaki aura yumuşak
   bir degrade olduğundan kapta bulanıklık gözle fark edilmiyor (bkz. kart
   notu yukarıda). Küçük yüzeyler (.oc, üst/alt çubuk, pencereler) aynen kalır. */
@media (max-width:768px){
  .panel,.week-panel,.rp,.np,.topbar,.task-detail-col{
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
  /* Dashboard'un tam ekran detayı (#detail-col.open): saydam zemin + tam ekran
     bulanıklık, kayarak açılış/kapanışta arkadaki uzun listeyi HER KAREDE
     yeniden bulanıklaştırtıyordu → iOS'ta görev açarken/ertelerken kasma.
     Modüllerin tam ekranı (.lcc-fp) zaten opak. Aynı görünüm opak katmanla:
     zemin rengi + aura + %86 detay rengi (altındaki liste zaten seçilmiyordu). */
  body .task-detail-col.open{
    background:linear-gradient(var(--detail-bg),var(--detail-bg)),var(--aura,none),var(--bg)!important;
  }
}

/* Yüzen katmanlar (üst/alt çubuk, menü, pencere): daha dolu cam */
#lcc-mobile-header,#lcc-date-bar,#lcc-bottom-nav,#lcc-sidebar,
.modal,.dp,.detail-panel{
  background:var(--glass-float)!important;
}
#lcc-bottom-nav{border-top:1px solid var(--card-border)!important}

/* Tam ekran detay: düz zemin yerine aura */
.lcc-fp,#lcc-task-fp{background:var(--aura),var(--bg)!important}
.lcc-fp-head,#lcc-fp-head{
  background:var(--glass-float)!important;
  -webkit-backdrop-filter:blur(12px) saturate(150%);
  backdrop-filter:blur(12px) saturate(150%);
}

/* Kabuk: sayfa alanı zemini saydam → aura görünsün */
#lcc-page{background:transparent!important}

/* "Saydamlığı Azalt" açık olan kullanıcıda bulanıklık yok */
@media (prefers-reduced-transparency:reduce){
  *{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
}

/* ── 4) Yan menü — gerçek cam (web + mobil çekmece) ──
   Eski hali: %82 beyaz cam, mobilde arkasında %60 siyah perde → cam siyahı
   bulanıklaştırıp GRİ görünüyordu ("soluk"). Perde hafifletildi ki
   arkadaki renkli sayfa + aura camdan süzülsün; cama kendi aura ışığı,
   daha güçlü bulanıklık/doygunluk ve sağ kenarda ışık çizgisi verildi. */
body.ecam-light #lcc-sidebar{
  background:
    linear-gradient(165deg,rgba(255,255,255,.80),rgba(240,246,253,.64) 60%,rgba(232,242,252,.70)),
    var(--aura) !important;
  -webkit-backdrop-filter:blur(30px) saturate(190%);
  backdrop-filter:blur(30px) saturate(190%);
  box-shadow:inset -1px 0 0 rgba(255,255,255,.95);
}
body.ecam-dark #lcc-sidebar{
  background:
    linear-gradient(165deg,rgba(44,64,98,.70),rgba(18,28,46,.76) 60%,rgba(14,22,38,.82)),
    var(--aura) !important;
  -webkit-backdrop-filter:blur(30px) saturate(170%);
  backdrop-filter:blur(30px) saturate(170%);
  box-shadow:inset -1px 0 0 rgba(255,255,255,.12);
}
/* Seçili satır camda biraz daha dolgun */
#lcc-sidebar .nav-item.active{
  background:color-mix(in srgb,var(--accent2) 16%,rgba(255,255,255,.10));
  box-shadow:0 1px 0 rgba(255,255,255,.18) inset;
}
@media (max-width:768px){
  body.ecam-light #lcc-sidebar.mobile-open{
    box-shadow:inset -1px 0 0 rgba(255,255,255,.95),12px 0 40px rgba(20,45,80,.22);
  }
  body.ecam-dark #lcc-sidebar.mobile-open{
    box-shadow:inset -1px 0 0 rgba(255,255,255,.14),12px 0 44px rgba(0,0,0,.55);
  }
  body.ecam-light #lcc-overlay{background:rgba(16,32,56,.22)}
  body.ecam-dark #lcc-overlay{background:rgba(2,6,14,.45)}
}

/* ── 5) Kilit + kasa parolası ekranı — cam ──
   Düz koyu zemin yerine aura; tuşlar yarı saydam, bulanık cam kutucuk.
   (Kasa ekranının zemini inline stilde → !important şart.) */
#lcc-lock-ov,#lcc-vault-ov{background:var(--aura),var(--bg)!important}
#lcc-lock-ov .lpk:not(.ghost){
  -webkit-backdrop-filter:blur(16px) saturate(160%);
  backdrop-filter:blur(16px) saturate(160%);
}
body.ecam-dark #lcc-lock-ov .lpk:not(.ghost){
  background:linear-gradient(180deg,rgba(255,255,255,.11),rgba(255,255,255,.03)),rgba(26,38,60,.55);
  border-color:rgba(255,255,255,.12);
  box-shadow:0 1px 0 rgba(255,255,255,.16) inset,0 6px 18px rgba(0,0,0,.28);
}
body.ecam-light #lcc-lock-ov .lpk:not(.ghost){
  background:linear-gradient(180deg,rgba(255,255,255,.92),rgba(255,255,255,.62));
  border-color:rgba(255,255,255,.9);
  box-shadow:0 1px 0 rgba(255,255,255,1) inset,0 6px 18px rgba(30,60,100,.12);
}
/* Basış: cam kalır, index.html'deki ışık (::before) + vurgu kenarı görünür */
body #lcc-lock-ov .lpk:not(.ghost):active,body #lcc-lock-ov .lpk.pressed:not(.ghost){
  border-color:color-mix(in srgb,var(--accent,#00d4ff) 70%,transparent);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--accent,#00d4ff) 35%,transparent),0 0 22px color-mix(in srgb,var(--accent,#00d4ff) 30%,transparent);
}
body.ecam-dark #lcc-vault-ov .vault-inp,body.ecam-dark #lcc-lock-ov .lock-lensel{
  background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12);
}
body.ecam-light #lcc-vault-ov .vault-inp,body.ecam-light #lcc-lock-ov .lock-lensel{
  background:rgba(255,255,255,.75);border-color:rgba(255,255,255,.9);
}

/* ── 6) Tek başına sayfalar — body.lcc-std ──
   Giriş, karşılama, gizlilik, şartlar, hakkında, SSS, şifre sıfırlama,
   dışa/içe aktarma. Bu sayfalar html ve body'ye opak zemin veriyordu;
   aura (body::after, z-index:-1) body zemininin ALTINDA kalıp görünmüyordu.
   Zemin html'e alınır, body saydam olur. (Açık tema yalnız dışa aktarmada.) */
html:has(> body.lcc-std){background:#060b17!important}
html:has(> body.lcc-std.ecam-light){background:#e9eef4!important}
body.lcc-std{background:transparent!important}
/* Bu sayfalar kart zemini için --panel de kullanıyor (giriş, SSS, tanıtım) */
body.lcc-std.ecam-dark{--panel:rgba(26,38,60,.62)}
body.lcc-std .q,body.lcc-std .card,body.lcc-std .sec,body.lcc-std .hero,
body.lcc-std .ob-card,body.lcc-std .panel{
  -webkit-backdrop-filter:blur(14px) saturate(150%);
  backdrop-filter:blur(14px) saturate(150%);
  box-shadow:0 1px 0 rgba(255,255,255,.10) inset,0 6px 22px rgba(0,0,0,.25);
}

/* ── 7) Kabuk pencereleri — güvenlik, modüller, hesap, veri güvenliği,
   hikayemiz, ayarlar menüsü, onay/soru kutuları ──
   --bg2 (%74) bulanıklıksız kalınca arkadaki liste pencerenin içinden
   okunuyordu. Daha dolu cam + güçlü bulanıklık; perde hafifler ki cam
   renkli zemini süzsün. (Hesap/onay kutularının stili inline → !important.) */
.sec-modal,.prv-modal,.story-modal,.set-panel,#lcc-profile-ov>div,
#lcc-prompt-overlay>div,#lcc-confirm-overlay>div,#lcc-ask-overlay>div,
.lccqn-box{
  background:var(--glass-float)!important;
  -webkit-backdrop-filter:blur(26px) saturate(170%);
  backdrop-filter:blur(26px) saturate(170%);
}
body.ecam-dark .sec-modal,body.ecam-dark .prv-modal,body.ecam-dark .story-modal,
body.ecam-dark .set-panel,body.ecam-dark #lcc-profile-ov>div,body.ecam-dark .lccqn-box{
  border-color:rgba(255,255,255,.12)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 24px 64px rgba(0,0,0,.55)!important;
}
body.ecam-light .sec-modal,body.ecam-light .prv-modal,body.ecam-light .story-modal,
body.ecam-light .set-panel,body.ecam-light #lcc-profile-ov>div,body.ecam-light .lccqn-box{
  border-color:rgba(255,255,255,.9)!important;
  box-shadow:0 1px 0 #fff inset,0 24px 64px rgba(20,45,80,.20)!important;
}
body.ecam-dark #lcc-sec-ov,body.ecam-dark #lcc-mods-ov,body.ecam-dark #lcc-privacy-ov,
body.ecam-dark #lcc-story-ov,body.ecam-dark #lcc-profile-ov{background:rgba(2,6,14,.50)!important}
body.ecam-light #lcc-sec-ov,body.ecam-light #lcc-mods-ov,body.ecam-light #lcc-privacy-ov,
body.ecam-light #lcc-story-ov,body.ecam-light #lcc-profile-ov{background:rgba(16,32,56,.26)!important}
/* Hızlı not perdesi: kutunun kendisi camlaştığı için perde de aynı dile
   geçer — aksi hâlde düz rgba(0,0,0,.55) perde camın arkasını "bulanık
   siyah" yapıp metni okunmaz karartıyordu. */
body.ecam-dark #lccqn-ov{background:rgba(2,6,14,.50)!important}
body.ecam-light #lccqn-ov{background:rgba(16,32,56,.26)!important}

/* ── 8) Modüllerin asıl çalışma alanı — liste taşıyıcıları ──
   Bu kutular zemini --bg'den alıyor; cam yalnız --bg2/--bg3'ü saydam
   yaptığı için ortadaki alan SİYAH/opak kalıyor, çerçeve camlı olduğu
   hâlde "eski tasarım" gibi duruyordu. Taşıyıcı kartlardan daha saydam
   (kart %72, taşıyıcı ~%38) → kart/taşıyıcı ayrımı korunur.
   Bulanıklık BİLEREK yok: içinde uzun kaydırılan liste var (bkz. 3). */
body.ecam-dark .lw,body.ecam-dark .left-wrapper,body.ecam-dark .tasks-wrapper,
body.ecam-dark .muh-list,body.ecam-dark .pf-col,body.ecam-dark .pf-extra{
  background:rgba(14,22,38,.38)!important;
  border-color:rgba(255,255,255,.08)!important;
}
body.ecam-light .lw,body.ecam-light .left-wrapper,body.ecam-light .tasks-wrapper,
body.ecam-light .muh-list,body.ecam-light .pf-col,body.ecam-light .pf-extra{
  background:rgba(255,255,255,.34)!important;
  border-color:rgba(255,255,255,.7)!important;
}
/* Koyu temada aura ışıkları köşelerde toplanıyordu; asıl çalışma alanının
   (ekranın ortası) altı neredeyse düz siyah kalıyordu. Aynı dört ışık +
   ortada yumuşak bir mavi hâle. */
body.ecam-dark{
  --aura:
    radial-gradient(70% 55% at 55% 52%,rgba(40,95,180,.20),transparent 76%),
    radial-gradient(65% 45% at 10% 6%,rgba(0,190,255,.26),transparent 72%),
    radial-gradient(60% 45% at 95% 32%,rgba(140,90,255,.24),transparent 72%),
    radial-gradient(75% 50% at 25% 100%,rgba(0,120,220,.24),transparent 72%),
    radial-gradient(55% 40% at 90% 92%,rgba(0,210,170,.14),transparent 72%);
}

/* ── 9) Açılır menüler — tarih/bildirim seçici, sağ tık menüleri, hızlı
   tarih, hedef bağlama, listeye taşıma ──
   --bg2 (%74) bulanıklıksız kalınca arkadaki satırlar ("Yinele",
   "Bildirim") menünün içinden okunuyordu. .gp-dd/.lm-dd ise sabit koyu
   renkliydi (açık temada da siyah). Hepsi dolu cam + güçlü bulanıklık. */
#lcc-dp,#lcc-np,#lcc-ctx-menu,.ctx-menu,.due-qp,.gp-dd,.lm-dd{
  background:var(--glass-float)!important;
  -webkit-backdrop-filter:blur(26px) saturate(170%);
  backdrop-filter:blur(26px) saturate(170%);
  border-radius:6px!important;
}
body.ecam-dark #lcc-dp,body.ecam-dark #lcc-np,body.ecam-dark #lcc-ctx-menu,body.ecam-dark .ctx-menu,
body.ecam-dark .due-qp,body.ecam-dark .gp-dd,body.ecam-dark .lm-dd{
  border-color:rgba(255,255,255,.12)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 16px 44px rgba(0,0,0,.55)!important;
}
body.ecam-light #lcc-dp,body.ecam-light #lcc-np,body.ecam-light #lcc-ctx-menu,body.ecam-light .ctx-menu,
body.ecam-light .due-qp{
  border-color:rgba(255,255,255,.9)!important;
  box-shadow:0 1px 0 #fff inset,0 16px 44px rgba(20,45,80,.18)!important;
}
/* .gp-dd/.lm-dd yazı renkleri sabit AÇIK (lcc_goal_links.js / lcc_list_move.js)
   → açık temada da koyu cam kalır, yoksa beyaz camda okunmaz. */
body.ecam-light .gp-dd,body.ecam-light .lm-dd{
  background:rgba(16,24,40,.86)!important;
  border-color:rgba(255,255,255,.14)!important;
  box-shadow:0 1px 0 rgba(255,255,255,.12) inset,0 16px 44px rgba(20,45,80,.28)!important;
}

/* ── 10) Seyahat haritası — ülke dolgusu --border'dan geliyor (lcc_09);
   açık camda --border yarı saydam BEYAZ → beyaz zeminde ülkeler kayboluyordu. */
body.ecam-light .country-path.c-none{fill:#c7d3df;stroke:#fff}
body.ecam-light .country-path.c-none:hover{fill:var(--text3)}