/* =====================================================================
   OG Çocuk notu kartı (Views/Shared/_OgCocukNotu.cshtml), 2026-10-23. Oyun sayfasının kenar sütununda
   (.ogk .ogp-box içinde, og-kit + og-profil değişkenleriyle). OG Çocuk sarısı yalnız üst şerit, yazı
   logosu ve yaş rozetinde; kartın geri kalanı sayfanın kendi teması. Yaş renkleri og-cocuk.css ile aynı.
   Gece modu tuzakları (site.css): Renkler iki sınıflı seçiciyle, gerekince !important.
   ===================================================================== */
.ogk .ogc-note { position: relative; overflow: hidden; border-top: 0; }
.ogc-note::before {
    content: ""; position: absolute; left: 0; right: 0; top: 0; height: .45rem;
    background: linear-gradient(90deg, #ffd23f 0%, #ffd23f 60%, #2f9e44 60%, #2f9e44 80%, #ff7a59 80%);
}
.ogc-note__head { display: flex; align-items: flex-start; justify-content: space-between; gap: .6rem; margin-top: .25rem; }
.ogk .ogc-note__mark {
    display: inline-flex; flex-shrink: 0; font-family: 'Oswald', sans-serif; font-weight: 700; font-size: .78rem; letter-spacing: .04em;
    line-height: 1; text-decoration: none !important; margin-top: .2rem;
}
.ogk .ogc-note__mark span { padding: .3rem .45rem; }
.ogk .ogc-note__mark span:first-child { background: #e30a17; color: #fff !important; }
.ogk .ogc-note__mark span:last-child { background: #ffd23f; color: #0f0f1a !important; }

.ogc-note__age { display: flex; gap: .85rem; align-items: center; margin-bottom: .85rem; }
.ogc-note__badge {
    flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: 3.4rem; height: 3.4rem; border-radius: 50%;
    font-family: 'Oswald', sans-serif; font-weight: 700; font-size: 1.25rem; line-height: 1; box-shadow: 0 .55rem 0 -.3rem rgba(15, 15, 26, .25);
}
.ogc-note__badge.a3 { background: #ffd23f; color: #0f0f1a; }
.ogc-note__badge.a7 { background: #8fd14f; color: #0f0f1a; }
.ogc-note__badge.a12 { background: #ff7a59; color: #0f0f1a; }
.ogc-note__badge.a16 { background: #4dabf7; color: #0f0f1a; }
.ogc-note__badge.a18 { background: #0f0f1a; color: #fff; }
[data-theme="dark"] .ogc-note__badge.a18 { background: #fff; color: #0f0f1a; }
.ogc-note__age b { display: block; font-family: 'Oswald', sans-serif; font-size: 1.15rem; line-height: 1.15; color: var(--k-text); }
.ogc-note__age small { display: block; font-size: .8rem; color: var(--k-muted); margin-top: .15rem; }

.ogk .ogc-note__text { margin: 0 0 .4rem; font-size: .92rem; line-height: 1.6; color: var(--k-text); }

.ogc-note__row { padding: .75rem 0 .1rem; border-top: 1px dashed var(--k-line); }
.ogc-note__row:first-of-type { margin-top: .4rem; }
.ogc-note__row > .ogk-label { margin-bottom: .45rem; }
.ogc-note__line { display: flex; align-items: center; gap: .5rem; font-weight: 700; font-size: .9rem; color: var(--k-text); }
.ogc-note__line i { width: 1.1rem; text-align: center; color: var(--k-icon); }
.ogc-note__line.is-good i { color: #2f9e44; }
[data-theme="dark"] .ogc-note__line.is-good i { color: #8ce99a; }
.ogc-note__chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.ogc-note__chips > span {
    display: inline-flex; align-items: center; gap: .35rem; border-radius: 999px; padding: .26rem .7rem;
    background: var(--k-paper); color: var(--k-text); font-size: .8rem; font-weight: 700;
}
.ogc-note__chips > span i { color: var(--k-icon); font-size: .9em; }
.ogc-note__chips > span.is-good { background: #e3f5e6; color: #1e6b2e; }
.ogc-note__chips > span.is-good i { color: inherit; }
[data-theme="dark"] .ogc-note__chips > span.is-good { background: rgba(64, 192, 87, .18); color: #b2f2bb; }
.ogk .ogc-note__sub { margin: .4rem 0 0; font-size: .84rem; line-height: 1.5; color: var(--k-muted); }

.ogc-note__foot {
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .4rem .8rem;
    margin-top: .9rem; padding-top: .75rem; border-top: 1px dashed var(--k-line); font-size: .78rem; color: var(--k-muted);
}
.ogk .ogc-note__foot a { font-weight: 700; font-size: .84rem; color: var(--k-icon) !important; text-decoration: none !important; }
.ogk .ogc-note__foot a:hover { text-decoration: underline !important; }