/* ============================================================
   RateTheWork Glass Utilities
   backdrop-filter: blur — with @supports fallback

   KATMANLAMA (TECH-5868):
   Tümü `@layer components` içinde. Katmansızken bu sınıflar — specificity'den
   BAĞIMSIZ olarak — birlikte yazıldıkları Tailwind utility'lerini eziyordu:
   `.glass` + `rounded-*` 88 yerde, + `border-*` 77 yerde ölüydü
   (`.glass` shorthand `border:` ve `border-radius: 0.75rem` dayatıyor).
   `shadow-*` etkilenmiyordu — `.glass` box-shadow set etmez.

   Artık buradaki değerler yalnızca VARSAYILAN; markup'taki utility kazanır.

   ÖLÜ KOD TEMİZLİĞİ (2026-07-28):
   `.glass-card` ve `.glass-panel` KALDIRILDI — markup'ta 0 kullanım
   (ölçüldü: `class="… glass-card …"` araması iki sınıf için de 0 .razor
   dosyası döndü; `.glass` 18 dosyada kullanılıyor ve KALIYOR).
   Silinen bloklar: temel tanım, @supports blur, @supports-not fallback,
   .dark varyantı ve reduced-motion listesi.

   `.glass` NEDEN PROTOTİPE DEVREDİLMEDİ: prototipin `.glass`'ı yalnız
   `.landing-proto` kapsamında tanımlı (landing/styles/tokens.css). Global
   karşılığı YOK, yani bu dosya ikiz değil — 18 kullanımın tek dayanağı.
   ============================================================ */

@layer components {

/* ---- Glass Base ---- */
.glass {
    background: var(--ds-glass-bg, rgba(255, 255, 255, 0.70));
    border: 1px solid var(--ds-glass-border, rgba(52, 82, 227, 0.12));
    border-radius: 0.75rem;
}

/* ---- Backdrop blur — progressive enhancement ---- */
@supports (backdrop-filter: blur(1px)) {
    .glass {
        backdrop-filter: blur(12px) saturate(1.4);
        -webkit-backdrop-filter: blur(12px) saturate(1.4);
    }
}

/* ---- Safari < 15 fallback (no @supports backdrop-filter) ---- */
@supports not (backdrop-filter: blur(1px)) {
    .glass {
        background: var(--ds-bg-elevated, rgba(255, 255, 255, 0.95));
    }

    .dark .glass {
        background: rgba(27, 26, 22, 0.97);
    }
}

/* ---- Dark mode adjustments ---- */
.dark .glass {
    background: var(--ds-glass-bg, rgba(27, 26, 22, 0.70));
    border-color: var(--ds-glass-border, rgba(52, 82, 227, 0.18));
}

/* ---- Reduced motion ---- */
@media (prefers-reduced-motion: reduce) {
    .glass {
        transition: none !important;
    }
}

} /* @layer components */