/* Free4U panel - Tasarim C (sade ve kompakt, antrasit zemin, kartlar). Dis kaynak yok, Tabler'siz. */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: #1c1f24; color: #d7dce3;
  font: 16px/1.3 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-variant-numeric: tabular-nums;
}
.tc { max-width: 480px; margin: 0 auto; padding: 10px 12px 14px; }
.tc svg, .icon { width: 1.05em; height: 1.05em; vertical-align: -.17em; flex: none; }

.ust { display: flex; justify-content: space-between; align-items: center; padding: 2px 2px 10px; }
.marka { font-weight: 700; font-size: 1.05rem; color: #eef1f5; }
.sag { display: inline-flex; gap: 14px; align-items: center; }
.soluk { color: #8a93a0; font-size: .78rem; }
.cikis { color: #8a93a0; font-size: .85rem; text-decoration: none; padding: 6px 2px; }

/* kartlar: ana zeminden bir ton acik, hafif kenarlik, yuvarlak kose */
.kart { background: #262a31; border: 1px solid #323842; border-radius: 12px; padding: 10px 14px 4px; margin: 0 0 14px; }
.baslik { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 4px; }
h2 { display: inline-flex; align-items: center; gap: 7px; margin: 0; font-size: .84rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: #58a6ff; } /* giris sayfasinda eski mavi kalir */
/* kart basliklari: uc ayri renk (sari / kirmizimsi turuncu / fistik yesili), antrasit zeminde birbirine karismaz */
.k-free4u h2 { color: #ffea00; }
.k-teet h2 { color: #ff6a2b; }
.k-lokka h2 { color: #a6d96a; }
.yer-tutucu { margin: 0; padding: 26px 0 30px; text-align: center; font-size: .85rem; letter-spacing: .14em; color: #666e7a; }
.tarih { font: inherit; font-size: .85rem; color: #d7dce3; background: #1c1f24; border: 1px solid #3a404a; border-radius: 7px; padding: 5px 9px; min-height: 34px; max-width: 100%; }

.satirlar { list-style: none; margin: 0; padding: 0; }
/* Her satir: etiket | adet | tutar. Adet ve tutar AYNI boyut, kalinlik ve renk; iki hizali sutun. */
.satir { display: grid; grid-template-columns: minmax(0, 1fr) 5.6em 6.6em; column-gap: 6px; align-items: center; padding: 11px 0; border-top: 1px solid #333943; }
.ad { grid-column: 1; font-size: .9rem; color: #a3abb7; overflow-wrap: anywhere; }
.adet, .tutar { grid-row: 1; font-size: 1.05rem; font-weight: 700; color: #eef1f5; text-align: right; white-space: nowrap; }
/* birim kelimeleri (TL, satis, siparis, fatura): rakamin ~0,6 boyu, soluk gri; rakamlar one cikar. Adet ve tutar RAKAMLARI ayni boyut/kalinlik/renk. */
.birim { font-size: .6em; font-weight: 500; color: #747c89; }
.adet { grid-column: 2; }
.tutar { grid-column: 3; }
.kasa { border-top: 1px solid #3f4651; }
.kasa .tutar { color: #86b394; }   /* Nakit Kasa tutari: silik yesil; birim (TL) yine kucuk soluk gri */
.kasa .ad { display: inline-flex; align-items: center; gap: 6px; }
.etiket { grid-row: 1; grid-column: 2; justify-self: end; font-size: .75rem; color: #8a93a0; white-space: nowrap; }

.hata { display: none; color: #ff8b82; font-size: .88rem; padding: 4px 0 8px; }
.hata.acik { display: block; }
.yukleniyor { opacity: .55; }

.alt { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 2px 2px 0; }
.dugme { display: inline-flex; gap: 6px; align-items: center; justify-content: center; font: inherit; font-size: .88rem; font-weight: 600; color: #58a6ff; background: transparent; border: 1px solid #3a404a; border-radius: 8px; padding: 8px 14px; min-height: 40px; cursor: pointer; }
.dugme:active { background: #262a31; }
.alt .dugme { color: #b4bcc8; } /* Yenile: mavi yerine sade notr */

/* gun etiketi baglantisi (Mağaza kartinda gunun on detayina) */
.gun { color: inherit; text-decoration: underline; text-decoration-color: #4b5361; text-underline-offset: 3px; }
.gun::after { content: " \203A"; color: #6a7380; }
.gun:hover, .gun:focus-visible { color: #d7dce3; }

/* on detay sayfasi */
.baslik-baglanti { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 7px; }
.baslik-baglanti::before { content: "\2039"; font-size: 1.3em; line-height: 1; margin-right: 1px; opacity: .8; }
.baslik-baglanti:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; border-radius: 4px; }
.detay-kart { margin-top: 10px; }
.ozet { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; padding: 10px 0 12px; border-top: 1px solid #333943; }
.ozet .deger { font-size: 1.05rem; font-weight: 700; color: #eef1f5; white-space: nowrap; }
.liste-bos { padding: 22px 0 26px; text-align: center; color: #666e7a; font-size: .9rem; border-top: 1px solid #333943; }
/* on detay satiri (7g): Satis | parca | tutar | odeme ikonu | saat (saat en sagda); satira dokununca fis icerigi satir ici acilir */
.detay-satirlar > .fis { border-top: 1px solid #333943; }
.detay-satirlar > .fis:first-child { border-top: 0; }
.fis-satir { display: grid; grid-template-columns: 3.5em minmax(0, 1fr) 5.7em 2.5em 2.9em; column-gap: 4px; align-items: center; padding: 11px 0; cursor: pointer; -webkit-tap-highlight-color: transparent; user-select: none; }
.fis-satir:focus-visible { outline: 2px solid #5b6472; outline-offset: 2px; border-radius: 6px; }
.satis { grid-row: 1; grid-column: 1; font-size: .86rem; color: #a3abb7; white-space: nowrap; text-decoration: underline dotted #4b5361; text-underline-offset: 3px; }
.fis-satir[aria-expanded="true"] .satis::after { content: " \25B4"; font-size: .8em; color: #8a93a0; }
.fis-satir.yukleniyor-satir { opacity: .6; }
.fis-satir.yukleniyor-satir .satis::after { content: " \2026"; color: #8a93a0; }
.fis-satir .adet { grid-column: 2; }
.fis-satir .tutar { grid-column: 3; }
.fis-satir .odeme { grid-row: 1; grid-column: 4; display: inline-flex; align-items: center; justify-content: center; gap: 2px; }
.fis-satir .saat { grid-row: 1; grid-column: 5; text-align: right; font-size: .85rem; color: #a3abb7; }

/* odeme turu renk kurali (her sayfada): kredi karti MOR, nakit YESIL; karisik = ikisi yan yana, kendi renkleriyle */
.i-nakit { color: #34c97a; }
.i-kart { color: #8b5cf6; }
.odeme svg { width: 1.15em; height: 1.15em; flex: none; }
.odeme.o-karisik svg { width: .92em; height: .92em; }
.odeme .soru { width: 1.25em; height: 1.25em; border: 1.5px solid #6a7380; border-radius: 50%; font-size: .72rem; line-height: 1.1; text-align: center; color: #7f8794; }

/* fis icerigi: yumusak acilma (grid-template-rows 0fr -> 1fr) */
.fis-icerik { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .26s ease; }
.fis-icerik.acik { grid-template-rows: 1fr; }
.fis-ic { overflow: hidden; min-height: 0; }
.fis-govde { padding: 0 0 12px; }
.urunler { list-style: none; margin: 0; padding: 0; }
.urun { display: grid; grid-template-columns: minmax(0, 1fr) 4.2em 5.6em; column-gap: 6px; align-items: start; padding: 7px 0; border-top: 1px dashed #30363f; }
.urun:first-child { border-top: 0; }
.urun-ad { font-size: .86rem; line-height: 1.3; color: #d7dce3; overflow-wrap: anywhere; }
.urun-ad .varyant { display: block; font-size: .78rem; color: #7f8794; }
.urun .adet, .urun .tutar { grid-row: auto; grid-column: auto; font-size: .95rem; text-align: right; white-space: nowrap; }
.fis-toplamlar { border-top: 1px solid #3a404a; margin-top: 4px; padding-top: 4px; }
.fis-toplam { display: grid; grid-template-columns: minmax(0, 1fr) 7em; column-gap: 6px; align-items: baseline; padding: 4px 0; }
.fis-toplam .et { font-size: .85rem; color: #a3abb7; }
.fis-toplam .deger { font-size: 1rem; font-weight: 700; color: #eef1f5; text-align: right; white-space: nowrap; }
.fis-toplam.iskonto .deger { font-size: .95rem; color: #9aa5b3; font-weight: 600; }
.fis-toplam.toplam .deger { font-size: .95rem; color: #c3cad4; font-weight: 600; }
.fis-toplam.odenen { border-top: 1px solid #3a404a; margin-top: 3px; padding-top: 7px; }
.fis-toplam.odenen .et { color: #d7dce3; font-weight: 600; }
.fis-toplam.odenen .deger { font-size: 1.12rem; color: #fff; }
.fis-durum { color: #7f8794; font-size: .85rem; padding: 4px 0 10px; }
.fis-durum.hata-satir { color: #ff8b82; }
@media (prefers-reduced-motion: reduce) { .fis-icerik { transition: none; } }
.kirilim { display: flex; flex-wrap: wrap; gap: 4px 16px; padding: 0 0 10px; color: #7f8794; font-size: .85rem; align-items: center; }
.kirilim .grup { display: inline-flex; align-items: center; gap: 4px; }
.kirilim svg { width: 1.15em; height: 1.15em; }
.kirilim .odeme { display: inline-flex; align-items: center; gap: 2px; }
.kirilim .sayi, .kirilim .deger { color: #a3abb7; font-weight: 600; }
.kirilim .ayrac { color: #5d6572; }
.kirilim .grup .birim { font-size: .7em; }

/* giris sayfasi */
.giris { max-width: 380px; margin: 0 auto; padding: 24px 12px; }
.giris .kart { padding: 14px 16px 16px; }
.giris label { display: block; font-size: .85rem; color: #a3abb7; margin: 12px 0 6px; }
.giris input[type=password] { width: 100%; font: inherit; font-size: 1.05rem; color: #eef1f5; background: #1c1f24; border: 1px solid #3a404a; border-radius: 8px; padding: 11px 12px; }
.giris input[type=password]:focus { outline: 2px solid #58a6ff; outline-offset: 0; }
.giris-hata { color: #ff8b82; font-size: .88rem; margin: 10px 0 0; min-height: 1.2em; }
.giris .dugme { width: 100%; margin-top: 10px; min-height: 44px; font-size: .95rem; }

/* dar ekran: sutunlari biraz daralt */
@media (max-width: 380px) {
  .tc { padding-left: 10px; padding-right: 10px; }
  .kart { padding-left: 12px; padding-right: 12px; }
  .satir { grid-template-columns: minmax(0, 1fr) 5.4em 6.4em; }
}

/* 7i: acilan fis, listeden net ayrilsin. Satis satiri + icerik tek bir acik zeminli (kart #262a31 -> #30353d), yuvarlak kose blok olur. */
.fis-satir { margin: 0 -8px; padding: 11px 8px; }
.fis-satir[aria-expanded="true"] { background: #30353d; border-radius: 10px 10px 0 0; }
.fis-icerik { margin: 0 -8px; }   /* satirla ayni genislik (overflow:hidden govdeyi kirpmasin diye negatif kenar burada) */
.fis-govde { margin: 0 0 8px; padding: 4px 8px 10px; background: #30353d; border-radius: 0 0 10px 10px; }
.fis-govde .urun { border-top-color: #424955; }
.fis-toplamlar { border-top-color: #4b525e; }
.fis-toplam.odenen { border-top-color: #4b525e; }

/* 7j: sol sutun gunluk fis numarasi (00001...), numara atlamasi isareti */
.fis-satir { grid-template-columns: 4em minmax(0, 1fr) 5.5em 2.4em 2.8em; }
.satis { font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.atlama { list-style: none; text-align: center; font-size: .8rem; color: #cf8a62; padding: 6px 0; border-top: 1px dashed #5b4539; }
.detay-satirlar > .atlama:first-child { border-top: 0; }

/* 7l: veresiye (tur 173) - mavi. Renk kurali: kart MOR, nakit YESIL, veresiye MAVI */
.i-veresiye { color: #6ea8fe; }
.veresiye-satir { list-style: none; display: flex; align-items: baseline; gap: 6px; margin: -7px 0 0; padding: 0 0 10px; font-size: .82rem; color: #6ea8fe; }
.veresiye-satir .v-et { color: #6ea8fe; }
.veresiye-satir .v-sayi, .veresiye-satir .v-tl { font-weight: 600; color: #86b3f2; white-space: nowrap; }
.veresiye-satir .v-ayrac { color: #4f6c99; }
.veresiye-satir .birim { font-size: .72em; }
.satis.sp { font-size: .72rem; }
.satis .onek { color: #7f8794; margin-right: 1px; }
.fis-satir.sp-satir { grid-template-columns: 4.9em minmax(0, 1fr) 5em 2.7em 2.7em; }
.odeme.o-veresiye { gap: 1px; }
.odeme.o-veresiye svg { width: .95em; height: .95em; }
.odeme.o-v3 svg { width: .78em; height: .78em; }
.kirilim .grup .pesinat { color: #6f7886; font-size: .9em; margin-left: 2px; }
.fis-toplam.pesinat { border-top: 1px dashed #4a515c; margin-top: 6px; padding-top: 7px; }
.fis-toplam.pesinat .et, .fis-toplam.cari .et { color: #8a93a0; font-size: .82rem; }
.fis-toplam.pesinat .deger { font-size: .95rem; color: #c3cad4; font-weight: 600; }
.fis-toplam.cari .deger { font-size: .95rem; color: #6ea8fe; font-weight: 600; }
.fis-toplam .odeme.mini { margin-left: 6px; vertical-align: -.12em; display: inline-flex; gap: 2px; }
.fis-toplam .odeme.mini svg { width: 1em; height: 1em; }

/* 7m: veresiye fis icerigi - musteri adi (yalniz panelde; uzun adlar sarilir) */
.fis-musteri { padding: 6px 0 8px; font-size: .9rem; line-height: 1.3; color: #d7dce3; overflow-wrap: anywhere; border-bottom: 1px dashed #424955; margin-bottom: 4px; }
.fis-musteri .et { color: #8a93a0; font-size: .82rem; margin-right: 6px; }
.fis-musteri .ad-metin { font-weight: 600; color: #86b3f2; }

/* ---- 7n: Nakit Kasa hareketleri (/kasa) ---- */
.kasa .ad a.kasa-baglanti { color: inherit; }
/* tek satir ozet: Devreden | Giris | Cikis | Gun sonu */
.kasa-ozet { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; padding: 10px 0 12px; border-top: 1px solid #333943; }
.kasa-ozet .ok { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kasa-ozet .ok-et { font-size: .68rem; color: #8a93a0; letter-spacing: .02em; white-space: nowrap; }
.kasa-ozet .ok-deger { font-size: 1rem; font-weight: 700; color: #eef1f5; white-space: nowrap; }
.kasa-ozet .gir .ok-deger { color: #3ddc84; }
.kasa-ozet .cik .ok-deger { color: #ff7a70; }
.kasa-ozet .son .ok-deger { color: #86b394; }
.kasa-ozet .ok-uyari { grid-column: 1 / -1; font-size: .8rem; color: #ff8b82; padding-top: 4px; }
@media (max-width: 380px) { .kasa-ozet .ok-deger { font-size: .92rem; } }
/* hareket listesi: satir 1 = Islem | Evrak | Giris | Cikis | Saat ; satir 2 = Unvani | Aciklama (kisaltilir, dokununca tamami) */
.kasa-liste .liste-bos { border-top: 1px solid #333943; }
.kh-bas { display: grid; grid-template-columns: minmax(0, 1fr) 3.9em 4.4em 4.4em 2.8em; column-gap: 4px; margin: 0 -8px; padding: 6px 8px 4px; border-top: 1px solid #333943; font-size: .66rem; color: #6f7886; letter-spacing: .03em; text-transform: uppercase; list-style: none; }
.kh-bas .b2, .kh-bas .b3, .kh-bas .b4 { text-align: right; }
.kh { border-top: 1px solid #333943; list-style: none; }
.kh-bas + .kh { border-top-color: #3a404a; }
.kh-satir { display: grid; grid-template-columns: minmax(0, 1fr) 3.9em 4.4em 4.4em 2.8em; column-gap: 4px; row-gap: 3px; align-items: baseline; margin: 0 -8px; padding: 9px 8px; -webkit-tap-highlight-color: transparent; user-select: none; }
.kh-satir[role="button"] { cursor: pointer; }
.kh-satir:focus-visible { outline: 2px solid #5b6472; outline-offset: 2px; border-radius: 6px; }
.kh-satir[aria-expanded="true"] { background: #30353d; border-radius: 10px; }
.kh-satir.kh-fis[aria-expanded="true"] { border-radius: 10px 10px 0 0; }
.kh-satir.yukleniyor-satir { opacity: .6; }
.kh-tur { font-size: .85rem; line-height: 1.2; color: #d7dce3; overflow-wrap: anywhere; }
.kh-kod { margin-left: 5px; font-size: .72rem; color: #747c89; }
.kh-fis .kh-tur { text-decoration: underline dotted #4b5361; text-underline-offset: 3px; }
.kh-satir.kh-fis[aria-expanded="true"] .kh-tur::after { content: " \25B4"; font-size: .8em; color: #8a93a0; }
.kh-no { font-size: .8rem; color: #a3abb7; white-space: nowrap; letter-spacing: .02em; overflow: hidden; text-overflow: ellipsis; }
.kh-no.sp { font-size: .66rem; }
.kh-no .onek { color: #7f8794; }
.kh-tutar { font-size: .98rem; font-weight: 700; text-align: right; white-space: nowrap; }
.kh-tutar.gir { color: #3ddc84; }
.kh-tutar.cik { color: #ff7a70; }
.kh-saat { font-size: .8rem; color: #a3abb7; text-align: right; white-space: nowrap; }
.kh-saat .geri { color: #d9a441; font-size: .55rem; margin-right: 2px; vertical-align: .18em; }
.kh-alt { grid-column: 1 / -1; display: flex; gap: 10px; min-width: 0; font-size: .78rem; line-height: 1.3; color: #8a93a0; }
.kh-unvan, .kh-acik { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kh-unvan { flex: 0 1 46%; color: #b4bcc8; }
.kh-acik { flex: 1 1 0; }
.kh-satir.genis .kh-alt { display: block; }
.kh-satir.genis .kh-unvan, .kh-satir.genis .kh-acik { display: block; white-space: normal; overflow: visible; overflow-wrap: anywhere; }
.kh-satir.genis .kh-acik { margin-top: 2px; }
@media (max-width: 380px) {
  .kh-bas, .kh-satir { grid-template-columns: minmax(0, 1fr) 3.7em 4.1em 4.1em 2.7em; }
}

.alt-baslik { margin: -2px 0 8px; color: #8a93a0; font-size: .78rem; }

/* ---- 7o (c12): giris/cikis renk ayrimi. Yon, Giris/Cikis tutar sutunundan belirlenir. Silik = tutar renginin acik, dusuk doygunluklu tonu. ---- */
.kh-satir.yon-gir .kh-tur { color: #8fc2a3; }
.kh-satir.yon-cik .kh-tur { color: #d6a09b; }
.kh-satir.yon-gir .kh-kod, .kh-satir.yon-cik .kh-kod { color: #747c89; }
.kh-bas .b2, .kasa-ozet .gir .ok-et { color: #8fc2a3; }
.kh-bas .b3, .kasa-ozet .cik .ok-et { color: #d6a09b; }
.kh-fis .kh-tur { text-decoration: underline dotted currentColor; text-underline-offset: 3px; }   /* link: renk degisse de ince noktali alt cizgi, rengin kendisiyle */

/* ---- 7p (c13): ana sayfa Nakit Kasa satiri: rakam "Nakit Kasa" linkinin hemen arkasinda (saga dayali degil, tutar sutunuyla hizali degil) ---- */
.satir.kasa { display: flex; align-items: center; gap: 0; }
.satir.kasa .tutar { margin-left: .5em; text-align: left; }
.satir.kasa .etiket { margin-left: .6em; justify-self: auto; }
.satir.kasa .etiket:empty { display: none; }
.satir.kasa .tutar { order: 1; }
.satir.kasa .etiket { order: 2; }

/* ---- 7s (c16): ana sayfa altinda "Bugun" butonu (saat yazisinin solunda) ---- */
.alt-sol { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.dugme.kucuk { font-size: .8rem; font-weight: 600; padding: 4px 11px; min-height: 30px; color: #b4bcc8; text-decoration: none; flex: none; }
.alt-sol .soluk { white-space: nowrap; }