/* =====================================================================
   Tarifhanem — ziyaretçi teması
   Bootstrap 5 üzerine kurulu; renkler ve bileşenler burada tanımlanır.
   Mobil öncelikli, koyu kırmızı ana renk, sıcak nötr zeminler.
   ===================================================================== */

:root {
    /* Ana renk: koyu kırmızı (nar) */
    --kirmizi: #c62026;
    --kirmizi-koyu: #9d161c;
    --kirmizi-acik: #e8524f;
    --kirmizi-rgb: 198, 32, 38;
    --kirmizi-tint: #fdeeed;
    --kirmizi-tint-2: #fbdedd;

    /* Vurgu: safran sarısı (puan yıldızları, rozetler) */
    --safran: #e0a12c;

    --metin: #221513;
    --metin-soluk: #6d5b58;
    --zemin: #fffaf9;
    --yuzey: #ffffff;
    --cizgi: #f2e3e1;
    --golge: 0 10px 30px rgba(120, 30, 30, .07);
    --golge-guclu: 0 18px 40px rgba(120, 30, 30, .14);
    --radius: 18px;
    --radius-sm: 12px;

    --bs-primary: var(--kirmizi);
    --bs-primary-rgb: var(--kirmizi-rgb);
    --bs-link-color: var(--kirmizi);
    --bs-link-color-rgb: var(--kirmizi-rgb);
    --bs-link-hover-color: var(--kirmizi-koyu);
    --bs-body-color: var(--metin);
    --bs-body-bg: var(--zemin);
    --bs-border-color: var(--cizgi);
    --bs-body-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --bs-border-radius: var(--radius-sm);
}

body { background: var(--zemin); color: var(--metin); }

h1, h2, h3, .h1, .h2, .h3 { font-weight: 800; letter-spacing: -.02em; }
h1, .h1 { font-size: clamp(1.9rem, 1.2rem + 2.4vw, 3rem); line-height: 1.12; }
h2, .h2 { font-size: clamp(1.45rem, 1.1rem + 1.2vw, 2rem); }
.lead-tr { font-size: 1.06rem; color: var(--metin-soluk); max-width: 62ch; }

a { text-decoration: none; }
a:hover { text-decoration: underline; }

.btn { border-radius: 999px; font-weight: 600; }
.btn-lg { padding-inline: 1.6rem; }
.btn-primary {
    --bs-btn-bg: var(--kirmizi); --bs-btn-border-color: var(--kirmizi);
    --bs-btn-hover-bg: var(--kirmizi-koyu); --bs-btn-hover-border-color: var(--kirmizi-koyu);
    --bs-btn-active-bg: var(--kirmizi-koyu); --bs-btn-active-border-color: var(--kirmizi-koyu);
    box-shadow: 0 6px 18px rgba(var(--kirmizi-rgb), .25);
}
.btn-outline-primary {
    --bs-btn-color: var(--kirmizi); --bs-btn-border-color: var(--kirmizi);
    --bs-btn-hover-bg: var(--kirmizi); --bs-btn-hover-border-color: var(--kirmizi);
}
.btn-soft {
    background: var(--kirmizi-tint); color: var(--kirmizi-koyu); border: 1px solid var(--kirmizi-tint-2);
}
.btn-soft:hover { background: var(--kirmizi-tint-2); color: var(--kirmizi-koyu); }
.form-control:focus, .form-select:focus {
    border-color: rgba(var(--kirmizi-rgb), .45);
    box-shadow: 0 0 0 .22rem rgba(var(--kirmizi-rgb), .15);
}
:focus-visible { outline: 3px solid rgba(var(--kirmizi-rgb), .35); outline-offset: 2px; }

/* ---------------------------------------------------------------- Başlık */
.site-header {
    position: sticky; top: 0; z-index: 1030; background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(10px); border-bottom: 1px solid var(--cizgi);
}
.site-brand { font-weight: 800; font-size: 1.4rem; color: var(--kirmizi); letter-spacing: -.03em; }
.site-brand:hover { color: var(--kirmizi-koyu); text-decoration: none; }
.site-brand .bi { font-size: 1.2rem; }
.site-nav .nav-link { font-weight: 600; color: var(--metin); border-radius: 999px; padding: .4rem .85rem; }
.site-nav .nav-link:hover, .site-nav .nav-link.active { background: var(--kirmizi-tint); color: var(--kirmizi-koyu); }
.site-search .form-control { border-radius: 999px 0 0 999px; border-right: 0; }
.site-search .btn { border-radius: 0 999px 999px 0; }
.dropdown-menu { border-color: var(--cizgi); box-shadow: var(--golge); border-radius: var(--radius-sm); }
.dropdown-item:active { background: var(--kirmizi); }

/* ---------------------------------------------------------------- Hero */
.hero {
    background:
        radial-gradient(900px 400px at 15% -10%, var(--kirmizi-tint) 0%, transparent 60%),
        radial-gradient(700px 380px at 90% 0%, #fff3e8 0%, transparent 55%);
    padding: clamp(2.5rem, 6vw, 4.5rem) 0 clamp(2rem, 4vw, 3rem);
}
.hero h1 span { color: var(--kirmizi); }
.hero-search {
    max-width: 560px; background: var(--yuzey); border: 1px solid var(--cizgi);
    border-radius: 999px; padding: .35rem .35rem .35rem 1.1rem; box-shadow: var(--golge);
    display: flex; align-items: center; gap: .5rem;
}
.hero-search input { border: 0; box-shadow: none !important; padding: .55rem 0; background: transparent; flex: 1; min-width: 0; }
.hero-chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.chip {
    display: inline-flex; align-items: center; gap: .35rem; padding: .4rem .9rem; border-radius: 999px;
    background: var(--yuzey); border: 1px solid var(--cizgi); color: var(--metin); font-size: .92rem; font-weight: 600;
}
.chip:hover { border-color: var(--kirmizi); color: var(--kirmizi-koyu); text-decoration: none; }
.chip.active { background: var(--kirmizi); border-color: var(--kirmizi); color: #fff; }

/* ---------------------------------------------------------------- Bölümler */
.section { padding: clamp(2rem, 4vw, 3rem) 0; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.section-head p { margin: .2rem 0 0; color: var(--metin-soluk); }
.section-head .more { font-weight: 600; white-space: nowrap; }
.section-alt { background: var(--yuzey); border-block: 1px solid var(--cizgi); }

/* ---------------------------------------------------------------- Tarif kartı */
.recipe-card {
    background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--radius);
    overflow: hidden; height: 100%; display: flex; flex-direction: column;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.recipe-card:hover, .recipe-card:focus-within { transform: translateY(-4px); box-shadow: var(--golge-guclu); border-color: var(--kirmizi-tint-2); }
.recipe-card__media { position: relative; aspect-ratio: 4 / 3; background: var(--kirmizi-tint); overflow: hidden; }
.recipe-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.recipe-card:hover .recipe-card__media img { transform: scale(1.04); }
.recipe-card__media .placeholder-icon { position: absolute; inset: 0; display: grid; place-items: center; font-size: 2rem; color: var(--kirmizi-acik); }
.recipe-card__badges { position: absolute; top: .6rem; left: .6rem; display: flex; gap: .35rem; flex-wrap: wrap; }
.recipe-card__body { padding: .9rem 1rem 1.1rem; display: flex; flex-direction: column; gap: .5rem; flex: 1; }
.recipe-card__title { font-size: 1.05rem; font-weight: 700; line-height: 1.3; margin: 0; }
.recipe-card__title a { color: var(--metin); }
.recipe-card__title a:hover { color: var(--kirmizi); text-decoration: none; }
.recipe-card__summary { color: var(--metin-soluk); font-size: .92rem; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.recipe-card__meta { margin-top: auto; display: flex; flex-wrap: wrap; gap: .75rem; font-size: .85rem; color: var(--metin-soluk); }
.recipe-card__meta .bi { color: var(--kirmizi); }
.recipe-card--wide { flex-direction: row; }
@media (max-width: 575px) { .recipe-card--wide { flex-direction: column; } }
.recipe-card--wide .recipe-card__media { aspect-ratio: 1 / 1; flex: 0 0 40%; }

.badge-soft { background: rgba(255, 255, 255, .92); color: var(--kirmizi-koyu); font-weight: 700; border-radius: 999px; padding: .3rem .6rem; font-size: .72rem; }
.badge-kirmizi { background: var(--kirmizi); color: #fff; font-weight: 700; border-radius: 999px; padding: .3rem .6rem; font-size: .72rem; }

/* Puan yıldızları */
.rating { display: inline-flex; align-items: center; gap: .22rem; color: var(--safran); font-size: .85rem; }
.rating .bi { font-size: .82rem; }
.rating__count { color: var(--metin-soluk); }

/* ---------------------------------------------------------------- Kategori kutuları */
.category-tile {
    position: relative; display: block; border-radius: var(--radius); overflow: hidden;
    aspect-ratio: 3 / 2; background: linear-gradient(135deg, var(--kirmizi) 0%, var(--kirmizi-acik) 100%);
    color: #fff; box-shadow: var(--golge);
}
.category-tile img { width: 100%; height: 100%; object-fit: cover; }
.category-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.05) 35%, rgba(60,10,10,.75) 100%); }
.category-tile__text { position: absolute; inset: auto 0 0 0; padding: .9rem 1rem; z-index: 1; }
.category-tile__text strong { display: block; font-size: 1.05rem; }
.category-tile__text span { font-size: .85rem; opacity: .9; }
.category-tile:hover { text-decoration: none; color: #fff; transform: translateY(-3px); transition: transform .18s ease; }

/* ---------------------------------------------------------------- Günün tarifi */
.daily {
    background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: calc(var(--radius) + 6px);
    overflow: hidden; box-shadow: var(--golge);
}
.daily__media { aspect-ratio: 16 / 10; background: var(--kirmizi-tint); }
.daily__media img { width: 100%; height: 100%; object-fit: cover; }
.daily__body { padding: clamp(1.25rem, 3vw, 2.25rem); }

/* ---------------------------------------------------------------- Tarif detayı */
.recipe-hero { padding-top: 1.5rem; }
.recipe-hero__media { border-radius: var(--radius); overflow: hidden; box-shadow: var(--golge); background: var(--kirmizi-tint); }
.recipe-hero__media img { width: 100%; height: auto; display: block; }
.recipe-meta { display: flex; flex-wrap: wrap; gap: .6rem; }
.meta-pill {
    display: inline-flex; align-items: center; gap: .45rem; background: var(--yuzey); border: 1px solid var(--cizgi);
    border-radius: 999px; padding: .5rem .9rem; font-size: .9rem; font-weight: 600;
}
.meta-pill .bi { color: var(--kirmizi); font-size: 1rem; }
.meta-pill small { display: block; font-weight: 500; color: var(--metin-soluk); font-size: .74rem; }

.panel { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--radius); padding: clamp(1.1rem, 2.5vw, 1.6rem); }
.panel + .panel { margin-top: 1.25rem; }
.panel__title { font-size: 1.15rem; font-weight: 800; margin-bottom: 1rem; }
.panel--danger { border-color: rgba(var(--bs-danger-rgb), .35); }

/* Porsiyon ayarı */
.servings { display: flex; align-items: center; gap: .6rem; background: var(--kirmizi-tint); border-radius: 999px; padding: .3rem; }
.servings button {
    width: 40px; height: 40px; border-radius: 50%; border: 0; background: var(--yuzey); color: var(--kirmizi);
    font-size: 1.2rem; font-weight: 700; display: grid; place-items: center; box-shadow: 0 2px 6px rgba(0,0,0,.08);
}
.servings button:hover:not(:disabled) { background: var(--kirmizi); color: #fff; }
.servings button:disabled { opacity: .45; }
.servings output { font-weight: 700; min-width: 4.5rem; text-align: center; }

.ingredient-list { list-style: none; margin: 0; padding: 0; }
.ingredient-list li { display: flex; gap: .75rem; padding: .6rem 0; border-bottom: 1px dashed var(--cizgi); align-items: baseline; }
.ingredient-list li:last-child { border-bottom: 0; }
.ingredient-list .amount { font-weight: 700; color: var(--kirmizi-koyu); white-space: nowrap; min-width: 5.5rem; }
.ingredient-list .note { color: var(--metin-soluk); font-size: .9rem; }
.ingredient-group + .ingredient-group { margin-top: 1.1rem; }
.ingredient-group h3 { font-size: .95rem; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: var(--kirmizi); margin-bottom: .4rem; }

/* Adımlar */
.steps { list-style: none; counter-reset: adim; margin: 0; padding: 0; }
.steps li { counter-increment: adim; display: grid; grid-template-columns: 2.6rem 1fr; gap: 1rem; padding-bottom: 1.5rem; position: relative; }
.steps li::before {
    content: counter(adim); width: 2.6rem; height: 2.6rem; border-radius: 50%; background: var(--kirmizi); color: #fff;
    display: grid; place-items: center; font-weight: 800; box-shadow: 0 4px 12px rgba(var(--kirmizi-rgb), .3);
}
.steps li:not(:last-child)::after {
    content: ""; position: absolute; left: 1.3rem; top: 2.9rem; bottom: .4rem; width: 2px; background: var(--kirmizi-tint-2);
}
.steps h3 { font-size: 1rem; font-weight: 700; margin-bottom: .25rem; }
.steps img { border-radius: var(--radius-sm); margin-top: .7rem; max-width: 420px; width: 100%; height: auto; }

/* İpuçları */
.tip-card { border-left: 4px solid var(--kirmizi); background: var(--kirmizi-tint); border-radius: var(--radius-sm); padding: .9rem 1.1rem; }
.tip-card + .tip-card { margin-top: .75rem; }
.tip-card strong { display: block; font-size: .85rem; text-transform: uppercase; letter-spacing: .04em; color: var(--kirmizi-koyu); }

/* Besin değerleri */
.nutrition-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: .75rem; }
.nutrition-grid div { background: var(--kirmizi-tint); border-radius: var(--radius-sm); padding: .75rem; text-align: center; }
.nutrition-grid strong { display: block; font-size: 1.15rem; color: var(--kirmizi-koyu); }
.nutrition-grid span { font-size: .8rem; color: var(--metin-soluk); }

/* Paylaşım ve etiketler */
.share-list { display: flex; gap: .5rem; flex-wrap: wrap; }
.share-list a, .share-list button {
    width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center;
    background: var(--kirmizi-tint); color: var(--kirmizi-koyu); border: 0; font-size: 1.05rem;
}
.share-list a:hover, .share-list button:hover { background: var(--kirmizi); color: #fff; }
.tag-list { display: flex; flex-wrap: wrap; gap: .4rem; }

@media (min-width: 992px) {
    .sticky-panel { position: sticky; top: 90px; }
}

/* ---------------------------------------------------------------- Boş durum */
.empty-state { text-align: center; padding: clamp(2rem, 6vw, 4rem) 1rem; }
.empty-state .bi { font-size: 2.6rem; color: var(--kirmizi-acik); }
.empty-state h2 { margin: .75rem 0 .35rem; font-size: 1.3rem; }
.empty-state p { color: var(--metin-soluk); max-width: 46ch; margin-inline: auto; }

/* ---------------------------------------------------------------- Alt bilgi */
.site-footer { background: #2a1513; color: #f6e9e7; margin-top: 3rem; padding: 3rem 0 1.5rem; }
.site-footer a { color: #f6e9e7; opacity: .85; }
.site-footer a:hover { opacity: 1; color: #fff; }
.site-footer h2 { font-size: .95rem; text-transform: uppercase; letter-spacing: .06em; color: #f0b3b0; margin-bottom: .8rem; }
.site-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.site-footer .brand { font-size: 1.35rem; font-weight: 800; color: #fff; }
.footer-bottom { border-top: 1px solid rgba(255, 255, 255, .12); margin-top: 2rem; padding-top: 1.25rem; font-size: .85rem; opacity: .8; }

/* ---------------------------------------------------------------- Yardımcılar */
.skip-link { position: absolute; left: -9999px; z-index: 2000; }
.skip-link:focus { left: 1rem; top: .5rem; background: #fff; padding: .6rem 1rem; border-radius: 999px; box-shadow: var(--golge); }
.breadcrumb { --bs-breadcrumb-divider-color: var(--metin-soluk); font-size: .88rem; }
.breadcrumb a { color: var(--metin-soluk); }
.breadcrumb a:hover { color: var(--kirmizi); }
.page-link { color: var(--kirmizi); border-radius: 999px !important; margin: 0 .15rem; border-color: var(--cizgi); }
.page-item.active .page-link { background: var(--kirmizi); border-color: var(--kirmizi); }
.text-kirmizi { color: var(--kirmizi) !important; }
.bg-tint { background: var(--kirmizi-tint); }

/* ---------------------------------------------------------------- Yazdırma */
@media print {
    .site-header, .site-footer, .no-print, .share-list, .servings button, .breadcrumb { display: none !important; }
    body { background: #fff; font-size: 12pt; }
    .panel, .recipe-card { border: 1px solid #ddd; box-shadow: none; break-inside: avoid; }
    .steps li::before { background: #000 !important; color: #fff !important; box-shadow: none; }
    .recipe-hero__media img { max-height: 8cm; object-fit: cover; }
    a[href]::after { content: ""; }
    .container { max-width: 100%; }
}

/* ---------------------------------------------------------------- Giriş / kayıt / hesap */
.auth-wrap { display: flex; justify-content: center; padding: clamp(1.5rem, 5vw, 3rem) 0; }
.auth-card {
    width: 100%; max-width: 470px; background: var(--yuzey); border: 1px solid var(--cizgi);
    border-radius: var(--radius); padding: clamp(1.3rem, 4vw, 2.1rem); box-shadow: var(--golge);
}
.auth-card h1 { font-size: 1.55rem; margin-bottom: .6rem; }
.auth-intro, .muted { color: var(--metin-soluk); }
.auth-switch { text-align: center; margin: 1.25rem 0 0; }
.btn-block { display: block; width: 100%; text-align: center; }
.form-row-between { display: flex; justify-content: space-between; align-items: center; gap: .75rem; flex-wrap: wrap; margin-bottom: 1rem; }
.form-row-between .field { margin-bottom: 0; }

/* Form alanları (components/form-field, form-check) */
.form fieldset { border: 0; padding: 0; margin: 0 0 1.25rem; }
.form legend { font-weight: 700; font-size: 1.05rem; margin-bottom: .75rem; padding: 0; }
.field { margin-bottom: 1rem; min-width: 0; }
.field label { display: block; font-weight: 600; margin-bottom: .35rem; }
.field .required { color: var(--kirmizi); }
.field input {
    width: 100%; font: inherit; padding: .65rem .85rem; border-radius: var(--radius-sm);
    border: 1px solid #e3d3d1; background: #fff; color: var(--metin); min-height: 46px;
}
.field input:focus { outline: none; border-color: var(--kirmizi); box-shadow: 0 0 0 .22rem rgba(var(--kirmizi-rgb), .15); }
.field .help { margin: .35rem 0 0; font-size: .875rem; color: var(--metin-soluk); }
.field .error-text { margin: .35rem 0 0; font-size: .9rem; color: #b3261e; font-weight: 600; }
.field.has-error input { border-color: #d0453b; background: #fffafa; }
.field-check { display: grid; grid-template-columns: auto 1fr; gap: .15rem .6rem; align-items: start; }
.field-check input { width: 1.2rem; height: 1.2rem; margin: .2rem 0 0; accent-color: var(--kirmizi); min-height: 0; }
.field-check label { font-weight: 400; margin: 0; }
.field-check .error-text { grid-column: 1 / -1; }
.field-row { display: grid; grid-template-columns: 1fr; gap: 0 1rem; }
@media (min-width: 560px) { .field-row { grid-template-columns: 1fr 1fr; } }
.hp-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Hesap sayfası bilgi listesi */
.info-list { display: grid; grid-template-columns: max-content 1fr; gap: .5rem 1.25rem; margin: 1rem 0 1.5rem; }
.info-list dt { font-weight: 600; color: var(--metin-soluk); }
.info-list dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 480px) { .info-list { grid-template-columns: 1fr; gap: .1rem; } .info-list dd { margin-bottom: .6rem; } }
.badge-ok { background: #e3f2e6; color: #2e6b3a; border-radius: 999px; padding: .12rem .6rem; font-size: .78rem; font-weight: 700; }
.badge-warn { background: #fff3d6; color: #8a5a00; border-radius: 999px; padding: .12rem .6rem; font-size: .78rem; font-weight: 700; }

/* Hata sayfaları */
.error-page { text-align: center; padding: clamp(2.5rem, 8vw, 5rem) 0; }
.error-code { color: var(--metin-soluk); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: .85rem; }
.error-page .actions { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; margin-top: 1.5rem; }

/* ---------------------------------------------------------------- Süzgeç paneli */
.filter-panel { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--radius); }
@media (min-width: 992px) {
    .filter-panel { position: sticky; top: 88px; }
    .filter-panel .offcanvas-body { padding: 1.1rem; }
}
@media (max-width: 991.98px) { .filter-panel { border: 0; border-radius: 0; } }
.filter-group { padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid var(--cizgi); }
.filter-group:last-of-type { border-bottom: 0; margin-bottom: 0; }
.filter-title { display: block; font-weight: 700; font-size: .92rem; margin-bottom: .5rem; float: none; width: auto; }
.filter-help { font-size: .82rem; color: var(--metin-soluk); margin: -.25rem 0 .5rem; }
.chip-remove {
    display: inline-grid; place-items: center; width: 1.15rem; height: 1.15rem; border-radius: 50%;
    background: var(--kirmizi-tint-2); color: var(--kirmizi-koyu); border: 0; font-size: .95rem; line-height: 1;
    text-decoration: none; padding: 0;
}
.chip-remove:hover { background: var(--kirmizi); color: #fff; text-decoration: none; }
.ingredient-suggestions {
    margin-top: .35rem; border: 1px solid var(--cizgi); border-radius: var(--radius-sm); overflow: hidden;
    background: var(--yuzey); max-height: 260px; overflow-y: auto;
}
.ingredient-suggestion {
    display: flex; justify-content: space-between; gap: .75rem; width: 100%; text-align: left;
    padding: .5rem .75rem; border: 0; background: transparent; font-size: .9rem; border-bottom: 1px solid var(--cizgi);
}
.ingredient-suggestion:last-child { border-bottom: 0; }
.ingredient-suggestion:hover, .ingredient-suggestion:focus-visible { background: var(--kirmizi-tint); color: var(--kirmizi-koyu); }
.ingredient-suggestion span { color: var(--metin-soluk); font-size: .8rem; }

/* ---------------------------------------------------------------- Topluluk (favori, puan, yorum) */
.interaction-bar {
    display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1rem; margin-top: 1.25rem;
    padding-top: 1.25rem; border-top: 1px solid var(--cizgi);
}
.btn-fav, .btn-soft-action {
    display: inline-flex; align-items: center; gap: .5rem; font-weight: 700; font-size: .92rem;
    border: 1px solid var(--cizgi); background: var(--yuzey); color: var(--metin);
    border-radius: 999px; padding: .5rem .95rem; text-decoration: none; transition: all .15s ease;
}
.btn-fav:hover, .btn-soft-action:hover { border-color: var(--kirmizi); color: var(--kirmizi-koyu); text-decoration: none; }
.btn-fav .bi, .btn-soft-action .bi { font-size: 1.05rem; color: var(--kirmizi); }
.btn-fav .count { background: var(--kirmizi-tint); color: var(--kirmizi-koyu); border-radius: 999px; padding: .05rem .5rem; font-size: .82rem; }
.btn-fav.is-on { background: var(--kirmizi); border-color: var(--kirmizi); color: #fff; }
.btn-fav.is-on .bi { color: #fff; }
.btn-fav.is-on .count { background: rgba(255, 255, 255, .22); color: #fff; }
.btn-fav:disabled { opacity: .6; }

.collection-menu { min-width: 280px; }
.collection-menu__list { max-height: 220px; overflow-y: auto; display: grid; gap: .15rem; }
.collection-menu__item {
    display: flex; align-items: center; gap: .5rem; width: 100%; text-align: left; border: 0;
    background: transparent; border-radius: var(--radius-sm); padding: .4rem .5rem; font-size: .92rem;
}
.collection-menu__item:hover { background: var(--kirmizi-tint); }
.collection-menu__item .bi { color: var(--kirmizi); }
.collection-menu__item.is-in { font-weight: 700; }
.collection-menu__item small { margin-left: auto; font-size: .72rem; }

.rate-box { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .6rem; }
.rate-box__label { font-weight: 600; font-size: .9rem; color: var(--metin-soluk); width: 100%; }
.rate-box__score { font-size: .88rem; color: var(--metin-soluk); }
.rate-box__note { font-size: .85rem; color: var(--metin-soluk); width: 100%; }
/* Yildizlar ters sirada basilir: birine gelindiginde solundakiler de dolu gorunsun */
.rate-stars { display: inline-flex; flex-direction: row-reverse; gap: .1rem; }
.rate-star { border: 0; background: transparent; color: #d9c8c6; font-size: 1.4rem; line-height: 1; padding: .1rem; cursor: pointer; }
.rate-star.is-on { color: var(--safran); }
.rate-stars:hover .rate-star { color: #d9c8c6; }
.rate-star:hover, .rate-star:hover ~ .rate-star, .rate-star:focus-visible, .rate-star:focus-visible ~ .rate-star { color: var(--safran); }
.rate-stars--guest { color: #d9c8c6; font-size: 1.4rem; text-decoration: none; }
.rate-stars--guest:hover { color: var(--safran); }

.comment-form { background: var(--kirmizi-tint); border-radius: var(--radius); padding: 1rem 1.1rem; }
.comment-form textarea { background: #fff; }
.comment-form__reply-to { font-size: .9rem; background: #fff; border-radius: var(--radius-sm); padding: .45rem .7rem; margin-bottom: .75rem; }
.comment-login { background: var(--kirmizi-tint); border-radius: var(--radius); padding: 1.25rem; text-align: center; }
.comment-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.25rem; }
.comment { display: flex; gap: .85rem; }
.comment__avatar {
    flex: 0 0 auto; width: 2.6rem; height: 2.6rem; border-radius: 50%; display: grid; place-items: center;
    background: var(--kirmizi-tint-2); color: var(--kirmizi-koyu); font-weight: 800;
}
.comment__body { min-width: 0; flex: 1; }
.comment__head { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0 0 .25rem; font-size: .88rem; color: var(--metin-soluk); }
.comment__author { font-weight: 700; color: var(--metin); }
.comment__author:hover { color: var(--kirmizi); }
.comment__text { margin: 0; overflow-wrap: anywhere; }
.comment__reply { display: inline-block; margin-top: .4rem; font-size: .85rem; font-weight: 600; }
.comment-list--replies { margin-top: 1rem; padding-left: 1rem; border-left: 2px solid var(--cizgi); gap: 1rem; }
.comment-list--replies .comment__avatar { width: 2.1rem; height: 2.1rem; font-size: .85rem; }

/* ---------------------------------------------------------------- Üye paneli */
.section-sm { padding: clamp(1.25rem, 3vw, 2rem) 0; }
.account-nav { display: flex; flex-wrap: wrap; gap: .4rem; border-bottom: 1px solid var(--cizgi); padding-bottom: .75rem; }
.account-nav__item {
    display: inline-flex; align-items: center; gap: .45rem; padding: .45rem .9rem; border-radius: 999px;
    font-weight: 600; color: var(--metin); text-decoration: none; font-size: .93rem;
}
.account-nav__item:hover { background: var(--kirmizi-tint); color: var(--kirmizi-koyu); text-decoration: none; }
.account-nav__item.is-active { background: var(--kirmizi); color: #fff; }
.account-nav__item.is-active .bi { color: #fff; }

.stat-card {
    display: flex; flex-direction: column; gap: .15rem; height: 100%; text-decoration: none; color: var(--metin);
    background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--radius); padding: 1rem 1.1rem;
}
a.stat-card:hover { border-color: var(--kirmizi); text-decoration: none; box-shadow: var(--golge); }
.stat-card__value { font-size: 1.8rem; font-weight: 800; color: var(--kirmizi-koyu); line-height: 1.1; }
.stat-card__label { font-size: .9rem; color: var(--metin-soluk); font-weight: 600; }
.stat-card__note { font-size: .8rem; color: var(--metin-soluk); }

.simple-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.simple-list li { padding-bottom: 1rem; border-bottom: 1px dashed var(--cizgi); }
.simple-list li:last-child { border-bottom: 0; padding-bottom: 0; }

.collection-card {
    display: flex; gap: .9rem; align-items: center; background: var(--yuzey); border: 1px solid var(--cizgi);
    border-radius: var(--radius); padding: .6rem; text-decoration: none; color: var(--metin); height: 100%;
}
.collection-card:hover { border-color: var(--kirmizi); text-decoration: none; box-shadow: var(--golge); }
.collection-card__media {
    flex: 0 0 auto; width: 84px; height: 84px; border-radius: var(--radius-sm); overflow: hidden;
    background: var(--kirmizi-tint); display: grid; place-items: center; color: var(--kirmizi-acik); font-size: 1.5rem;
}
.collection-card__media img { width: 100%; height: 100%; object-fit: cover; }
.collection-card__body { display: grid; gap: .15rem; min-width: 0; }
.collection-card__body strong { overflow-wrap: anywhere; }

.submission-list { display: grid; gap: 1rem; }
.submission { display: flex; gap: 1rem; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--radius); padding: .9rem; }
.submission__media {
    flex: 0 0 auto; width: 150px; aspect-ratio: 4 / 3; border-radius: var(--radius-sm); overflow: hidden;
    background: var(--kirmizi-tint); display: grid; place-items: center; color: var(--kirmizi-acik); font-size: 1.6rem;
}
.submission__media img { width: 100%; height: 100%; object-fit: cover; }
.submission__body { min-width: 0; flex: 1; }
.submission__reason { background: var(--kirmizi-tint); border-left: 3px solid var(--kirmizi); border-radius: var(--radius-sm); padding: .6rem .8rem; font-size: .92rem; }
.submission__stats { display: flex; flex-wrap: wrap; gap: .85rem; font-size: .86rem; color: var(--metin-soluk); margin-bottom: .6rem; }
.submission__stats .bi { color: var(--kirmizi); }
@media (max-width: 575.98px) { .submission { flex-direction: column; } .submission__media { width: 100%; } }

.badge-danger { background: #fbe4e2; color: #9d161c; border-radius: 999px; padding: .12rem .6rem; font-size: .78rem; font-weight: 700; }
.filter-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.filter-chips .chip span { color: var(--metin-soluk); font-size: .8rem; margin-left: .25rem; }
.filter-chips .chip.is-active { background: var(--kirmizi); border-color: var(--kirmizi); color: #fff; }
.filter-chips .chip.is-active span { color: rgba(255, 255, 255, .85); }

.repeat-item { border: 1px solid var(--cizgi); border-radius: var(--radius-sm); padding: .75rem; margin-bottom: .6rem; background: #fff; }

.profile-head { background: var(--kirmizi-tint); padding: clamp(1.5rem, 4vw, 2.5rem) 0; border-bottom: 1px solid var(--cizgi); }
.profile-avatar {
    width: 4.5rem; height: 4.5rem; border-radius: 50%; display: grid; place-items: center;
    background: var(--kirmizi); color: #fff; font-size: 2rem; font-weight: 800;
}

/* Sayfa yenilenmeden yapılan işlemlerin bildirimi (favori, puan) */
.toast-flash {
    position: fixed; left: 50%; bottom: 1.25rem; transform: translate(-50%, 1.5rem);
    background: var(--metin); color: #fff; border-radius: 999px; padding: .6rem 1.2rem;
    font-weight: 600; font-size: .92rem; box-shadow: var(--golge-guclu); z-index: 1080;
    opacity: 0; pointer-events: none; transition: opacity .2s ease, transform .2s ease; max-width: min(92vw, 34rem);
}
.toast-flash.is-on { opacity: 1; transform: translate(-50%, 0); }
.toast-flash--error { background: var(--kirmizi-koyu); }
@media (prefers-reduced-motion: reduce) { .toast-flash { transition: none; } }

/* Panelden yüklenen logo ve sosyal medya bağlantıları */
.site-logo { max-height: 40px; width: auto; display: block; }
.footer-social { display: flex; gap: .6rem; flex-wrap: wrap; }
.footer-social a {
    display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 50%;
    background: rgba(255, 255, 255, .1); color: #f6e9e7; font-size: 1.05rem; opacity: 1;
}
.footer-social a:hover { background: var(--kirmizi); color: #fff; }

/* ---------------------------------------------------------------- Reklam alanları */
/* Alan yalnızca reklam gerçekten yüklenecekse görünür (body.ads-on); boş kutu gösterilmez */
.ad-slot { display: none; }
body.ads-on .ad-slot {
    display: block; margin: 1.75rem auto; text-align: center; min-height: 120px;
    max-width: 970px; clear: both;
}
.ad-slot__label {
    display: block; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase;
    color: var(--metin-soluk); margin-bottom: .35rem;
}
ins.adsbygoogle { display: block; }
/* AdSense doldurulamayan alanları işaretler; boş kutu kalmasın */
body.ads-on .ad-slot:has(ins.adsbygoogle[data-ad-status="unfilled"]) { display: none; }
.ad-slot--recipe_middle { margin: .5rem 0 1.5rem; }
@media print { .ad-slot { display: none !important; } }

/* ---------------------------------------------------------------- Çerez bildirimi */
.cookie-consent {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 1070; padding: 0 0 1rem;
    pointer-events: none;
}
.cookie-consent__box {
    pointer-events: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem;
    background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: var(--radius);
    box-shadow: var(--golge-guclu); padding: 1rem 1.25rem;
}
.cookie-consent__box > div:first-child { flex: 1 1 420px; }
.cookie-consent__title { font-size: 1rem; font-weight: 800; margin: 0 0 .3rem; }
.cookie-consent__text { font-size: .9rem; color: var(--metin-soluk); margin: 0; }
.cookie-consent__actions { display: flex; gap: .5rem; flex-wrap: wrap; }
@media (max-width: 575.98px) {
    .cookie-consent__actions { width: 100%; }
    .cookie-consent__actions .btn { flex: 1; }
}
.footer-link-button {
    background: none; border: 0; padding: 0; color: inherit; opacity: .85; text-decoration: underline;
    font: inherit; cursor: pointer;
}
.footer-link-button:hover { opacity: 1; }

/* ---------------------------------------------------------------- Bülten formu */
.newsletter-form__note { font-size: .82rem; color: var(--metin-soluk); margin: .5rem 0 0; }
.site-footer .newsletter-form__note { color: #f6e9e7; opacity: .75; }
.site-footer .newsletter-form__note a { text-decoration: underline; }
.site-footer .newsletter-form .form-control { background: rgba(255, 255, 255, .95); }
.newsletter-block {
    background: linear-gradient(135deg, var(--kirmizi) 0%, var(--kirmizi-koyu) 100%);
    color: #fff; border-radius: var(--radius); padding: clamp(1.5rem, 4vw, 2.5rem);
}
.newsletter-block h2 { color: #fff; }
.newsletter-block p { opacity: .92; }
.newsletter-block .newsletter-form__note, .newsletter-block .newsletter-form__note a { color: #fff; opacity: .85; }
.newsletter-block .form-label { color: #fff; }
.newsletter-block .btn-primary { background: #2a1513; border-color: #2a1513; }

/* ---------------------------------------------------------------- Sabit sayfalar ve iletişim */
.page-content { max-width: 760px; }
.page-content h2 { font-size: 1.25rem; font-weight: 800; margin: 1.75rem 0 .6rem; }
.page-content ul { padding-left: 1.2rem; }
.page-content li + li { margin-top: .35rem; }
.contact-aside { background: var(--kirmizi-tint); border-radius: var(--radius); padding: 1.25rem; }

/* Adımların arasındaki reklam alanı adım numarası almaz */
.steps li.steps__ad { counter-increment: none; display: block; padding-bottom: 0; }
.steps li.steps__ad::before, .steps li.steps__ad::after { content: none; display: none; }

/* Satır içi stil kullanılmaz (CSP); yardımcı sınıflar */
.site-search { max-width: 320px; }
.footer-about { max-width: 38ch; opacity: .85; }
.print-container { max-width: 820px; }
