/*
 * Bileşen: Kartlar (Temel Stiller)
 * Amaç: Kartların ana yapısını, yerleşimini ve temel metin stillerini yönetir.
 */

.bfwt-card { 
    display: flex; 
    background-color: var(--color-background); 
    border-radius: var(--border-radius-base); 
    box-shadow: 0 2px 8px rgba(34, 56, 101, 0.06); 
    overflow: hidden; 
    text-decoration: none; 
    transition: transform 0.2s ease, box-shadow 0.2s ease; 
    border: none;
    position: relative; 
    color: inherit; 
    height: 100%; 
}
.bfwt-card:hover { transform: translateY(-2px); box-shadow: var(--box-shadow-hover); }

/* YERLEŞİM */
.bfwt-card--horizontal { flex-direction: row; align-items: flex-start; }
.bfwt-card--vertical { flex-direction: column; }

/* MEDYA (GÖRSEL) ALANI */
.bfwt-card__media { 
    flex-shrink: 0; 
    position: relative; 
    overflow: hidden; 
    background-color: var(--color-background-soft); 
    display: flex; 
    align-items: center; 
    justify-content: center; 
}
.bfwt-card--horizontal .bfwt-card__media { border-radius: var(--border-radius-small); }
.bfwt-card--vertical .bfwt-card__media { border-radius: 0; }
.bfwt-card__image, .bfwt-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* İÇERİK ALANI */
.bfwt-card__content { flex-grow: 1; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.bfwt-card__title { font-weight: 700; color: var(--color-text-base); margin: 0; line-height: 1.3; }
.bfwt-card .bfwt-card__title { margin-block-end: 0; }
.bfwt-card__primary-line { color: var(--color-text-muted); font-weight: 500; margin: 0; }
.bfwt-card__secondary-line { color: var(--color-text-subtle); margin: 0; line-height: 1.4; font-style: italic; }
.clamp-2 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

/* KART BOYUTLARI */
.bfwt-card--small.bfwt-card--horizontal { padding: 12px; gap: 16px; }
.bfwt-card--small.bfwt-card--horizontal .bfwt-card__media { width: 72px; aspect-ratio: 4 / 3; }
.bfwt-card--small.bfwt-card--vertical .bfwt-card__media { width: 100%; aspect-ratio: 4 / 3; }
.bfwt-card--small .bfwt-card__content { padding: 12px; }
.bfwt-card--small.bfwt-card--horizontal .bfwt-card__content { padding: 0; }
.bfwt-card--small .bfwt-card__title { font-size: var(--font-size-md); }
.bfwt-card--small .bfwt-card__primary-line { font-size: var(--font-size-sm); }
.bfwt-card--small .bfwt-card__secondary-line { font-size: var(--font-size-xs); }

.bfwt-card--large.bfwt-card--horizontal { padding: 16px; gap: 20px; }
.bfwt-card--large.bfwt-card--horizontal .bfwt-card__media { width: 120px; aspect-ratio: 4 / 3; }
.bfwt-card--large.bfwt-card--vertical .bfwt-card__media { width: 100%; aspect-ratio: 4 / 3; }
.bfwt-card--large .bfwt-card__content { padding: 16px; }
.bfwt-card--large.bfwt-card--horizontal .bfwt-card__content { padding: 0; }
.bfwt-card--large .bfwt-card__title { font-size: var(--font-size-lg); }
.bfwt-card--large .bfwt-card__primary-line { font-size: var(--font-size-base); }
.bfwt-card--large .bfwt-card__secondary-line { font-size: var(--font-size-sm); }

/* ALT BİLGİ (FOOTER) & CTA */
.bfwt-card--vertical .bfwt-card__footer { margin-top: auto; padding-top: 12px; }
.bfwt-card__cta { display: inline-flex; align-items: center; gap: 0.4em; padding: 0; background-color: transparent; border: none; color: var(--color-primary); font-size: var(--font-size-sm); font-weight: 700; text-decoration: none; transition: all 0.2s ease; }
.bfwt-card__cta::after { content: 'arrow_forward'; font-family: 'Material Symbols Rounded'; font-weight: normal; font-style: normal; font-size: var(--icon-size-md); line-height: 1; transition: transform 0.2s ease; }
.bfwt-card__cta:hover { color: var(--color-text-base); }
.bfwt-card__cta:hover::after { transform: translateX(4px); }

/* GRID YERLEŞİMİ */
.bfwt-results-grid .bfwt-grid-inner { display: grid; gap: 1.5rem; grid-template-columns: repeat(var(--grid-cols-mobile, 1), 1fr); }
.bfwt-results-grid .bfwt-grid-item { min-width: 0; }
@media (min-width: 768px) { .bfwt-results-grid .bfwt-grid-inner { grid-template-columns: repeat(var(--grid-cols-tablet, 2), 1fr); } }
@media (min-width: 1024px) { .bfwt-results-grid .bfwt-grid-inner { grid-template-columns: repeat(var(--grid-cols-desktop, 3), 1fr); } }