/*
* Uygulama görünümü. Yalnızca iken etki eder: site telefona
* yüklenmiş uygulama olarak (ya da Play Store uygulamasından) açıldığında ya da
* ?uygulama=onizleme ile. Tarayıcıda (mobil/masaüstü) site bugünkü gibi kalır.
* Sınıfı 'deki satır içi betik ekler (functions.php → kd_uygulama_modu_betigi).
*/
/* Uygulamaya özel parçalar tarayıcıda gizli */
.geri-btn, .ust-baslik, .alt-nav, .uyg-yalniz { display: none; }
/* Uygulama olarak açılınca sayfa geçişleri yumuşak (Chrome) */
@media (display-mode: standalone) {
@view-transition { navigation: auto; }
}
/* ============ Genel ============ */
.uygulama body { padding-bottom: calc(4.9rem + env(safe-area-inset-bottom)); -webkit-tap-highlight-color: transparent; }
.uygulama .uyg-yalniz { display: block; }
.uygulama .uyg-gizle,
.uygulama .site-footer,
.uygulama .drawer,
.uygulama #kd-menu-dugmesi,
.uygulama .site-header .gunun-btn,
.uygulama .site-header .nav-kap,
.uygulama .crumbs { display: none !important; }
/* ============ Üst çubuk ============ */
.uygulama .site-header {
background: var(--green-deep); border-bottom: 0; color: #F4EEDF;
-webkit-backdrop-filter: none; backdrop-filter: none;
padding-top: env(safe-area-inset-top);
}
.uygulama .site-header .bar { height: 3.5rem; padding: 0 .35rem 0 .75rem; gap: .35rem; }
.uygulama .site-header .logo { color: #F4EEDF; font-size: 1.3rem; }
.uygulama .site-header .logo .mark { width: 2rem; height: 2rem; }
.uygulama .site-header .logo .mark rect { fill: rgba(233, 221, 191, .12); }
.uygulama .site-header .dualarim-btn,
.uygulama .site-header .ara-btn { color: #F4EEDF; }
.uygulama .site-header .dualarim-btn:hover,
.uygulama .site-header .ara-btn:hover,
.uygulama .site-header .ara-btn[aria-expanded="true"] { background: rgba(255, 255, 255, .1); color: #fff; }
.uygulama .site-header .ara-btn { margin-left: 0; }
.uygulama .site-header .sag { margin-left: auto; display: flex; align-items: center; }
.uygulama .dualarim-btn .sayac { background: var(--gold-bright); color: var(--baslik); }
/* Anasayfa dışında: geri oku + sayfa adı (logo gizli) */
.uygulama body:not(.home) .site-header .logo { display: none; }
.uygulama .geri-btn {
display: grid; place-items: center; flex: none; width: 2.75rem; height: 2.75rem; margin-left: -.35rem;
border: 0; border-radius: 50%; background: none; color: #F4EEDF; cursor: pointer;
}
.uygulama .geri-btn:hover { background: rgba(255, 255, 255, .1); }
.uygulama .geri-btn .i { width: 1.45rem; height: 1.45rem; }
.uygulama .ust-baslik {
display: block; flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
font-family: var(--display); font-weight: 600; font-size: 1.15rem; color: #F4EEDF;
}
.uygulama .arama-seridi { background: var(--green-deep); border-top-color: rgba(255, 255, 255, .08); }
/* ============ Sekme çubuğu ============ */
.uygulama .alt-nav {
position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
display: grid; grid-template-columns: repeat(5, 1fr);
padding: .45rem .25rem calc(.5rem + env(safe-area-inset-bottom));
background: var(--card); border-top: 1px solid var(--line); box-shadow: 0 -6px 20px rgba(12, 46, 41, .06);
}
.alt-nav a {
display: flex; flex-direction: column; align-items: center; gap: .22rem; min-height: 3.2rem;
font-size: .7rem; font-weight: 600; color: var(--muted); text-decoration: none;
}
.alt-nav .kap { width: 3.5rem; height: 2rem; border-radius: 999px; display: grid; place-items: center; transition: background .2s; }
.alt-nav .i { width: 1.4rem; height: 1.4rem; }
.alt-nav a[aria-current="page"] { color: var(--baslik); }
.alt-nav a[aria-current="page"] .kap { background: var(--gold-tint); color: var(--gold-text); }
/* Altta sabit duran öğeler sekme çubuğunun üstüne */
.uygulama .toast { bottom: calc(5.8rem + env(safe-area-inset-bottom)); }
/* Dua ve Günün ekranında alttaki işlem çubuğunun üstünde dursun */
.uygulama body:is(.single-dua, .page-template-gunun-duasi) .toast { bottom: calc(10rem + env(safe-area-inset-bottom)); z-index: 40; }
.uygulama .audio { bottom: calc(5.4rem + env(safe-area-inset-bottom)); }
.uygulama .cerez-bandi { bottom: calc(5.4rem + env(safe-area-inset-bottom)); }
/* ============ Sayfa gövdesi ============ */
.uygulama .sayfa { padding-top: 1rem; }
/* ============ Uygulama sayfa bileşenleri (Keşfet, Daha, uygulama anasayfası) ============
Bu sayfalar tarayıcıda da açılabildiği için stiller sınıfa bağlı değil. */
.uyg-sayfa { max-width: 40rem; }
.uyg-h1 { margin: .25rem 0 1rem; font-size: 1.9rem; }
.uygulama .uyg-sayfa .uyg-h1 { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; } /* uygulamada başlık üst çubukta; ekran okuyucu için yerinde */
.uyg-bolum-b { display: flex; justify-content: space-between; align-items: baseline; margin: 1.6rem 0 .7rem; }
.uyg-bolum-b h2 { margin: 0; font-size: 1.3rem; color: var(--baslik); }
.uyg-bolum-b a { font-size: .82rem; font-weight: 600; color: var(--gold-text); text-decoration: none; }
.uyg-grup-b { margin: 1.4rem .3rem .5rem; font-family: var(--sans); font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.uyg-grup-b:first-of-type { margin-top: .4rem; }
.uyg-bosluk { margin-top: .8rem; }
.uyg-kutular { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.uyg-kutu {
display: flex; flex-direction: column; gap: .5rem; padding: .95rem; border-radius: 16px;
background: var(--card); box-shadow: var(--shadow); text-decoration: none;
}
.uyg-kutu .s, .uyg-satir .s {
display: grid; place-items: center; flex: none; width: 2.4rem; height: 2.4rem;
border-radius: 12px; background: var(--gold-tint); color: var(--gold-text);
}
.uyg-satir .s { border-radius: 50%; width: 2.3rem; height: 2.3rem; }
.uyg-kutu .s .i, .uyg-satir .s .i { width: 1.25rem; height: 1.25rem; }
.uyg-kutu b { font-size: .95rem; color: var(--baslik); line-height: 1.25; }
.uyg-kutu small { margin-top: -.3rem; font-size: .76rem; line-height: 1.35; color: var(--muted); }
.uyg-liste { background: var(--card); border-radius: 16px; box-shadow: var(--shadow); overflow: hidden; }
.uyg-satir {
display: flex; align-items: center; gap: .8rem; width: 100%; min-height: 3.4rem; padding: .75rem 1rem;
border: 0; background: none; font: inherit; text-align: left; text-decoration: none; color: inherit; cursor: pointer;
}
.uyg-satir[hidden] { display: none; }
.uyg-satir + .uyg-satir, .uyg-ayar + .uyg-satir { border-top: 1px solid var(--line); }
.uyg-satir:hover { background: var(--hover); }
.uyg-satir .m { flex: 1; min-width: 0; }
.uyg-satir b { display: block; font-size: .95rem; color: var(--baslik); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.uyg-satir small { display: block; font-size: .78rem; color: var(--muted); }
.uyg-satir > .i { width: 1.1rem; height: 1.1rem; flex: none; color: var(--muted); }
.uyg-ayar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 1rem; }
.uyg-ayar[hidden] { display: none; }
.uyg-ayar b { font-size: .95rem; color: var(--baslik); }
.uyg-ayar .boy { display: flex; gap: .4rem; }
.uyg-ayar .boy button {
min-width: 2.75rem; height: 2.4rem; border: 1px solid var(--line); border-radius: 10px; background: var(--card);
font-family: var(--display); font-size: 1.05rem; font-weight: 600; color: var(--ink-2); cursor: pointer;
}
.uyg-ayar .boy button[aria-pressed="true"] { background: var(--gold-tint); border-color: var(--gold-soft); color: var(--baslik); }
.uyg-ayar .boy button:disabled { opacity: .4; cursor: default; }
.uyg-cipler { display: flex; flex-wrap: wrap; gap: .5rem; }
.uyg-cip {
display: inline-flex; align-items: center; min-height: 2.5rem; padding: 0 .95rem; border-radius: 999px;
background: var(--card); border: 1px solid var(--line); font-size: .86rem; font-weight: 600; color: var(--ink-2); text-decoration: none;
}
.uyg-cip:hover { border-color: var(--gold); }
.uyg-kunye { margin: 1.6rem .3rem 0; font-size: .78rem; line-height: 1.6; color: var(--muted); text-align: center; }
/* Sekme sayfalarında başlık solda (geri oku yok) */
.uygulama .ust-baslik-sekme { padding-left: .25rem; font-size: 1.3rem; }
/* ============ Uygulama anasayfası ============ */
.uygulama .ana > :not(.uyg-ana):not(.hero-c) { display: none !important; }
/* Karşılama bölümü görsel olarak gizli; sayfanın asıl başlığı (h1) ekran okuyucular için kalır */
.uygulama .ana > .hero-c { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.uygulama .ana { padding: 0; }
.uyg-karsilama { padding: .2rem 1.1rem 1.4rem; background: linear-gradient(180deg, var(--green-deep), #0F3832); color: #F4EEDF; }
.uyg-karsilama .selam { margin: 0; min-height: 1.2em; font-size: .85rem; color: #B7C6C0; }
.uyg-karsilama .soru { margin: .15rem 0 0; font-family: var(--display); font-weight: 600; font-size: 1.7rem; line-height: 1.2; }
.uyg-arama {
display: flex; align-items: center; gap: .6rem; margin-top: 1rem; padding: 0 1rem; min-height: 3.1rem;
background: var(--card); border-radius: 14px; color: var(--muted); box-shadow: 0 6px 20px rgba(0, 0, 0, .12);
}
.uyg-arama .i { width: 1.2rem; height: 1.2rem; flex: none; }
.uyg-arama input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: inherit; font-size: 1rem; color: var(--ink); height: 3rem; }
.uyg-ic { padding: 0 1rem 1rem; }
.uyg-gunun {
display: block; margin-top: 1.2rem; border-radius: 20px; overflow: hidden; background: var(--card);
box-shadow: 0 8px 28px rgba(12, 46, 41, .14); text-decoration: none; color: inherit;
}
.uyg-gunun .panel { display: block; padding: 1.1rem 1rem .9rem; text-align: center; color: #F4EEDF; background: radial-gradient(ellipse at 50% 30%, #15463E 0, var(--green-deep) 75%); }
.uyg-gunun .etiket { display: inline-flex; align-items: center; gap: .35rem; font-size: .66rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-bright); }
.uyg-gunun .etiket .i { width: .95rem; height: .95rem; }
.uyg-gunun .ar { display: block; margin-top: .35rem; font-family: var(--arabic); font-size: calc(1.75rem * var(--kd-olcek, 1)); line-height: 1.9; direction: rtl; text-wrap: balance; }
.uyg-gunun .alt { display: flex; align-items: center; gap: .8rem; padding: .9rem 1rem 1rem; }
.uyg-gunun .m { flex: 1; min-width: 0; }
.uyg-gunun b { display: block; font-size: 1.05rem; color: var(--baslik); }
.uyg-gunun small { font-size: .8rem; color: var(--muted); }
.uyg-gunun .oku { flex: none; padding: .6rem 1.15rem; border-radius: 999px; background: var(--green-deep); color: #fff; font-size: .85rem; font-weight: 700; }
.uyg-ana .uyg-cipler { flex-wrap: nowrap; overflow-x: auto; margin: 0 -1rem; padding: 0 1rem .2rem; scrollbar-width: none; }
.uyg-ana .uyg-cip { flex: none; }
/* ============ Dua ekranı ============ */
.uygulama .kd-dua h1 { font-size: 1.75rem; }
.uygulama .kd-dua .sub { font-size: .92rem; }
.uygulama .kd-dua .dua { margin-left: -1rem; margin-right: -1rem; border-radius: 0; box-shadow: none; }
.uygulama .kd-dua .dua .ar-panel { padding: 1.8rem 1.1rem 1.5rem; }
.uygulama .kd-dua .dua .ar-panel::after { display: none; }
/* Alttaki işlem çubuğu: Kopyala · Paylaş · A− · A+ · Kaydet */
.uygulama body:is(.single-dua, .page-template-gunun-duasi) { padding-bottom: calc(10rem + env(safe-area-inset-bottom)); }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools {
position: fixed; left: .7rem; right: .7rem; bottom: calc(5.2rem + env(safe-area-inset-bottom)); z-index: 35;
display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 0; padding: .35rem .25rem;
background: var(--green-deep); border: 0; border-radius: 18px; box-shadow: 0 10px 28px rgba(12, 46, 41, .35);
}
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .tbtn,
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .kaydet-btn {
flex-direction: column; gap: .15rem; min-height: 3.1rem; min-width: 0; margin: 0; padding: .2rem .1rem;
border: 0; border-radius: 12px; background: transparent; color: #E9E4D6;
font-family: var(--sans); font-size: .66rem; font-weight: 600; line-height: 1.15; text-align: center;
}
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .tbtn:hover,
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .kaydet-btn:hover { background: rgba(255, 255, 255, .08); }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .tbtn .i,
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .kaydet-btn .i { width: 1.3rem; height: 1.3rem; }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .boyut .tbtn { font-family: var(--display); font-size: 1.1rem; }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .boyut .tbtn:disabled { opacity: .35; }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .tbtn.primary { background: rgba(255, 255, 255, .1); }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .kaydet-btn[aria-pressed="true"] { color: var(--gold-bright); }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .kaydet-btn[aria-pressed="true"] .i { fill: var(--gold-bright); }
/* Düzeltmeler: işlem çubuğunda A−/A+ tek satır, kaydet düğmesi kısa etiket */
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .boyut .tbtn { flex-direction: row; gap: .05rem; }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .kaydet-btn span { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; } /* erişilebilir ad kalır */
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .kaydet-btn::after { content: "Kaydet"; }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .kaydet-btn[aria-pressed="true"]::after { content: "Kaydedildi"; }
/* Ezberle: basılıyken altın renk (koyu yeşil çubukta) */
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .ezber-btn[aria-pressed="true"] { background: rgba(255, 255, 255, .1); color: var(--gold-bright); }
/* Başlık üst çubukta olduğu için sayfa içindeki büyük başlık gizli */
.uygulama .kd-yazi .yazi-baslik,
.uygulama .kd-gunun > h1 { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
/* ============ Beğenilen örneğe göre düzen (v2) ============ */
/* Dua ekranı: Arapça panel en üstte, dua adı altında, okunuş ve anlam ayrı kartlarda */
.uygulama .kd-dua { padding-top: 0; }
.uygulama .kd-dua > .uyg-dua-ust { margin: 0 -1rem 0; background: none; border-radius: 0; box-shadow: none; overflow: visible; }
.uygulama .uyg-dua-ust .ar-panel { padding: 1.3rem 1.1rem 1.6rem; }
.uygulama .uyg-dua-ust .ar-panel::after { display: none; }
.uygulama .uyg-dua-ust .kicker {
display: block; margin: 0 0 .35rem; position: relative; z-index: 1; text-align: center; text-decoration: none;
font-size: .66rem; letter-spacing: .12em; color: var(--gold-bright);
}
.uygulama .kd-dua > h1 { margin-top: 1.1rem; font-size: 1.6rem; }
.uygulama .kd-dua .sub { font-size: .85rem; color: var(--muted); }
.uygulama .kd-dua .dua:not(.uyg-dua-ust) { margin: .9rem 0 0; background: none; box-shadow: none; border-radius: 0; overflow: visible; }
.uygulama .kd-dua .dua .block { margin-top: .8rem; padding: 1rem 1.1rem; background: var(--card); border-radius: 18px; box-shadow: var(--shadow); }
.uygulama .kd-dua .dua .block + .block { border-top: 0; }
.uygulama .kd-dua .dua .reading { font-size: calc(1.3rem * var(--kd-olcek, 1)); }
.uygulama .kd-dua .dua .meaning { font-size: calc(1rem * var(--kd-olcek, 1)); line-height: 1.65; }
/* İşlem çubuğu: Kopyala · Paylaş · Yazı boyutu · Kaydet; A−/A+ "Yazı boyutu"na dokununca açılır */
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .boyut {
position: absolute; right: 25%; bottom: calc(100% + .55rem); display: none; gap: .4rem; margin: 0; padding: .4rem;
background: var(--card); border-radius: 14px; box-shadow: 0 8px 24px rgba(12, 46, 41, .22);
}
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools.boyut-acik .boyut { display: flex; }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .boyut .tbtn {
flex-direction: row; min-width: 3rem; min-height: 2.6rem; background: var(--paper); color: var(--baslik);
border: 1px solid var(--line); border-radius: 10px; font-family: var(--display); font-size: 1.1rem;
}
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .boyut .tbtn:hover { background: var(--gold-tint); }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .boyut-ac[aria-expanded="true"] { background: rgba(255, 255, 255, .12); }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .kaydet-btn::after { content: "Kaydet"; }
.uygulama :is(.single-dua, .page-template-gunun-duasi) .dua .tools .kaydet-btn[aria-pressed="true"]::after { content: "Kaydedildi"; }
/* Dualarım: üstte "internetsiz" kartı, "Kaydettiklerin · Düzenle", kalp simgeli satırlar */
.uygulama .kd-dualarim .prose,
.uygulama .kd-dualarim .dualarim-not { display: none; }
.uygulama .cevrimdisi-bolum {
margin-top: .3rem; padding: .95rem 1rem; background: var(--gold-tint); border: 1px solid var(--gold-soft); box-shadow: none; border-radius: 16px;
}
.uygulama .cevrimdisi-bolum h2 { font-family: var(--sans); font-size: .95rem; font-weight: 700; margin: 0 0 .2rem; color: var(--baslik); }
.uygulama .cevrimdisi-bolum > p:not(.cevrimdisi-durum) { display: none; }
.uygulama .cevrimdisi-durum { margin: 0 0 .5rem !important; font-size: .8rem !important; color: var(--ink-2) !important; }
.uygulama .cevrimdisi-dugmeler .tbtn { min-height: 2.4rem; font-size: .82rem; }
.cevrimdisi-cubuk { height: 6px; margin-top: .7rem; border-radius: 6px; background: var(--card); overflow: hidden; }
.cevrimdisi-cubuk i { display: block; width: 0; height: 100%; background: var(--green); transition: width .3s; }
.uyg-dualarim-b { display: none; }
.uygulama .uyg-dualarim-b:not([hidden]) { display: flex; }
.uyg-dualarim-b button { border: 0; background: none; padding: .4rem 0 .4rem .6rem; font: inherit; font-size: .82rem; font-weight: 600; color: var(--gold-text); cursor: pointer; }
.uygulama .kd-dualarim .dualarim-liste { margin-top: 0; border-radius: 16px; }
.uygulama .kd-dualarim .dualarim-liste .card {
grid-template-columns: auto 1fr auto; column-gap: .85rem; align-items: center; padding: .85rem 1rem;
}
.uygulama .kd-dualarim .dualarim-liste .card::before {
content: ""; grid-row: 1 / span 2; width: 2.3rem; height: 2.3rem; border-radius: 50%;
background: var(--gold-tint) no-repeat center / 1.1rem url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A5C1F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7.5-4.6-7.5-10.2A4.3 4.3 0 0 1 12 7a4.3 4.3 0 0 1 7.5 2.8C19.5 15.4 12 20 12 20z'/%3E%3C/svg%3E");
}
.uygulama .kd-dualarim .dualarim-liste .card::after {
content: ""; grid-row: 1 / span 2; grid-column: 3; width: .5rem; height: .5rem; margin-right: .2rem;
border-top: 1.8px solid var(--muted); border-right: 1.8px solid var(--muted); transform: rotate(45deg);
}
.uygulama .kd-dualarim .dualarim-liste .card > span:first-child { grid-column: 2; min-width: 0; }
.uygulama .kd-dualarim .dualarim-liste .card .t { font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.uygulama .kd-dualarim .dualarim-liste .card .m { display: none; }
.uygulama .kd-dualarim .dualarim-liste .card .r { grid-row: 2; grid-column: 2; margin-top: .1rem; padding: 0; background: none; font-weight: 500; font-size: .78rem; color: var(--muted); }
.uygulama .kd-dualarim .dualarim-liste .cikar { display: none; }
.uygulama .kd-dualarim .dualarim-liste.duzenle .cikar { display: block; color: var(--hata); }
.uygulama .kd-dualarim .dualarim-liste.duzenle .card::after { display: none; }
/* Dualarım "internetsiz" kartı (örnekteki gibi): solda simge; başlık, durum, çubuk; altta küçük düğmeler */
.uygulama .cevrimdisi-bolum { display: grid; grid-template-columns: 2.4rem 1fr; column-gap: .85rem; align-items: center; }
.uygulama .cevrimdisi-bolum::before {
content: ""; grid-row: 1 / span 3; align-self: center; width: 2.4rem; height: 2.4rem; border-radius: 50%;
background: var(--card) no-repeat center / 1.2rem url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A5C1F' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11M7 10l5 5 5-5'/%3E%3Cpath d='M5 19h14'/%3E%3C/svg%3E");
}
.uygulama .cevrimdisi-bolum h2 { grid-column: 2; grid-row: 1; }
.uygulama .cevrimdisi-durum { grid-column: 2; grid-row: 2; margin: 0 !important; }
.uygulama .cevrimdisi-cubuk { grid-column: 2; grid-row: 3; margin-top: .45rem; }
.uygulama .cevrimdisi-dugmeler { grid-column: 1 / -1; grid-row: 4; flex-wrap: nowrap; margin-top: .75rem; }
.uygulama .cevrimdisi-dugmeler .tbtn { flex: 1; min-height: 2.3rem; padding: 0 .6rem; font-size: .8rem; }
.uygulama .cevrimdisi-bolum.tamam #kd-hepsini-indir { display: none; }
.uygulama .cevrimdisi-bolum.tamam .cevrimdisi-dugmeler .tbtn { flex: none; background: none; border: 0; padding: 0; min-height: 2rem; color: var(--gold-text); text-decoration: underline; text-underline-offset: 3px; }
/* Dualarım: listeni taşı ve içe aktarma (uygulamada kompakt kart) */
.uygulama .tasi-bolum { margin-top: 1rem; padding: .95rem 1rem; border: 1px solid var(--line); box-shadow: none; border-radius: 16px; }
.uygulama .tasi-bolum h2 { font-family: var(--sans); font-size: .95rem; font-weight: 700; margin: 0 0 .25rem; color: var(--baslik); }
.uygulama .tasi-bolum p { font-size: .8rem; margin-bottom: .7rem; }
.uygulama .tasi-bolum .cevrimdisi-dugmeler .tbtn { flex: none; }
.uygulama .aktar-kutu { margin-top: 0; margin-bottom: 1rem; padding: .95rem 1rem; border-radius: 16px; }
.uygulama .aktar-kutu p { font-size: .9rem; }
/* ============ Keşfet: arama + Kişiler · Durumlar · Sureler sekmeleri + kısa yollar ============ */
.kesfet .uyg-arama { margin-top: 0; border: 1px solid var(--line); box-shadow: none; }
.uygulama .kesfet { padding-top: 0; }
.uygulama .kesfet-bas { margin: 0 -1rem; padding: .2rem 1rem 1rem; background: var(--green-deep); }
.uygulama .kesfet .uyg-arama { border: 0; }
.kesfet-sekmeler {
position: sticky; top: var(--header-h); z-index: 10; display: grid; grid-template-columns: repeat(3, 1fr); gap: .25rem;
margin: .9rem 0 .2rem; padding: .3rem; background: var(--zemin-2); border-radius: 14px;
}
.uygulama .kesfet-sekmeler { top: calc(3.5rem + env(safe-area-inset-top)); box-shadow: 0 0 0 .6rem var(--paper); }
.kesfet-sekmeler[hidden] { display: none; }
.kesfet-sekmeler button {
min-height: 2.6rem; border: 0; border-radius: 11px; background: transparent; cursor: pointer;
font: inherit; font-size: .9rem; font-weight: 600; color: var(--ink-2);
}
.kesfet-sekmeler button[aria-selected="true"] { background: var(--card); color: var(--baslik); box-shadow: 0 1px 4px rgba(12, 46, 41, .14); }
.kesfet-panel { margin-top: .6rem; }
.kesfet-panel[hidden] { display: none; }
.kesfet-panel-b { margin: 1.4rem 0 .6rem; font-size: 1.3rem; }
.kesfet-sekmeli .kesfet-panel-b { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.kesfet-panel .uyg-bolum-b { margin: 1rem .2rem .5rem; }
.kesfet-panel .uyg-bolum-b h3 { margin: 0; font-family: var(--display); font-weight: 600; font-size: 1.25rem; line-height: 1.2; }
.kesfet-panel .uyg-bolum-b h3 a { font-size: inherit; font-weight: inherit; color: var(--baslik); text-decoration: none; }
.kesfet-panel .uyg-bolum-b span { font-size: .8rem; font-weight: 600; color: var(--gold-text); }
.kesfet-panel .uyg-liste + .uyg-bolum-b { margin-top: 1.4rem; }
.uyg-satir .sayi { flex: none; font-size: .8rem; color: var(--muted); }
.uyg-satir .s .no { font-size: .8rem; font-weight: 700; }
.kesfet-kisa { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.kesfet-kisa a {
display: flex; align-items: center; gap: .6rem; min-height: 3.6rem; padding: .7rem .8rem; border-radius: 14px;
background: var(--card); box-shadow: var(--shadow); font-size: .88rem; font-weight: 700; color: var(--baslik); text-decoration: none;
}
.kesfet-kisa .s { display: grid; place-items: center; flex: none; width: 2.1rem; height: 2.1rem; border-radius: 10px; background: var(--gold-tint); color: var(--gold-text); }
.kesfet-kisa .i { width: 1.1rem; height: 1.1rem; }
/* Anasayfa düzeltmeleri: Günün duası kartında okunuş; kısa Keşfet kutucukları */
.uyg-gunun .okunus {
display: block; padding: .8rem 1rem 0; font-family: var(--display); font-style: italic; font-weight: 500;
font-size: calc(1.12rem * var(--kd-olcek, 1)); line-height: 1.4; color: var(--vurgu);
}
.uyg-gunun .okunus + .alt { padding-top: .5rem; }
.uyg-ana .uyg-kutu { flex-direction: row; align-items: center; gap: .65rem; padding: .75rem .8rem; }
.uyg-ana .uyg-kutu b { font-size: .88rem; }
.uyg-ana .uyg-kutu .s { width: 2.2rem; height: 2.2rem; }
/* ============ Günün sayfası (uygulama): tarih şeridi, dua ekranı düzeni, "Geçen günler" ============ */
.uyg-gunun-devam, .uyg-gecen { display: none; }
.uygulama .kd-gunun { padding-top: 0; }
.uygulama .kd-gunun > .kicker {
display: block; margin: 0 -1rem; padding: .3rem 1rem .9rem; background: var(--green-deep);
font-size: .72rem; letter-spacing: .12em; color: var(--gold-bright);
}
.uygulama .kd-gunun > .sub,
.uygulama .kd-gunun > .gunun-not,
.uygulama .kd-gunun .onceki,
.uygulama .kd-gunun .dua .tools .tbtn.primary { display: none !important; }
.uygulama .kd-gunun > .uyg-dua-ust { margin-top: 0; }
.uygulama .kd-gunun .gunun-bas { display: block; margin-top: 1.1rem; }
.uygulama .kd-gunun .gunun-bas h2 { font-size: 1.6rem; line-height: 1.2; }
.uygulama .kd-gunun .gunun-bas .r { display: inline-block; margin-top: .45rem; }
.uygulama .kd-gunun .dua:not(.uyg-dua-ust) { margin-top: .4rem; }
.uygulama .uyg-gunun-devam {
display: inline-flex; align-items: center; gap: .3rem; margin: 1rem .2rem 0;
font-size: .9rem; font-weight: 600; color: var(--gold-text); text-decoration: none;
}
.uygulama .uyg-gecen { display: block; margin-top: 1.4rem; }
.uyg-satir .tarih {
display: flex; flex-direction: column; align-items: center; justify-content: center; flex: none;
width: 2.7rem; height: 2.9rem; border-radius: 12px; background: var(--gold-tint); color: var(--gold-text);
font-size: .62rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; line-height: 1.1;
}
.uyg-satir .tarih b { display: block; font-family: var(--display); font-size: 1.2rem; font-weight: 600; letter-spacing: 0; color: var(--baslik); }
/* Günün sayfasındaki Kaydet yalnızca uygulamada (sitede sayfa değişmesin) */
html:not(.uygulama) .uyg-gunun-kaydet { display: none !important; }
/* ============ Dualarım (uygulama) v3: önce kaydedilenler, internetsiz okuma kartı en altta ve sade ============ */
.uygulama .page-template-dualarim .dualarim-btn { display: none; } /* zaten bu sayfadayız */
.uyg-dualarim-b .adet { font-family: var(--sans); font-size: .82rem; font-weight: 600; color: var(--muted); }
.uyg-dualarim-b .adet:not(:empty)::before { content: "· "; }
/* Boş hal */
.uyg-bos { display: none; }
.uygulama .kd-dualarim .dualarim-bos { margin-top: 2.5rem; padding: 0; background: none; box-shadow: none; text-align: center; }
.uygulama .kd-dualarim .dualarim-bos > p { display: none; }
.uygulama .uyg-bos { display: flex; flex-direction: column; align-items: center; gap: .55rem; padding: 0 1rem; }
.uyg-bos .s { display: grid; place-items: center; width: 4.2rem; height: 4.2rem; margin-bottom: .3rem; border-radius: 50%; background: var(--gold-tint); color: var(--gold-text); }
.uyg-bos .s .i { width: 2rem; height: 2rem; }
.uyg-bos b { font-family: var(--display); font-size: 1.4rem; font-weight: 600; color: var(--baslik); }
.uyg-bos small { max-width: 18rem; font-size: .9rem; line-height: 1.5; color: var(--muted); }
.uyg-bos .tbtn { margin-top: .6rem; padding: 0 1.4rem; min-height: 2.9rem; border-radius: 999px; }
/* İnternetsiz okuma kartı: tek satır — simge | başlık + durum + çubuk | İndir; altında "Kopyaları sil" bağlantısı */
.uygulama .cevrimdisi-bolum { margin-top: 1.6rem; grid-template-columns: 2.4rem 1fr auto; padding: .85rem 1rem; }
.uygulama .cevrimdisi-bolum .cevrimdisi-dugmeler { display: contents; }
.uygulama .cevrimdisi-bolum h2 { font-size: .92rem; margin: 0; }
.uygulama .cevrimdisi-cubuk { grid-column: 2 / -1; }
.uygulama #kd-hepsini-indir { grid-column: 3; grid-row: 1 / span 2; align-self: center; flex: none; min-height: 2.3rem; padding: 0 1rem; border-radius: 999px; font-size: .82rem; }
.uygulama #kd-kopyalari-sil {
grid-column: 2 / -1; grid-row: 4; justify-self: start; flex: none; min-height: 2rem; margin-top: .35rem; padding: 0;
border: 0; background: none; font-size: .8rem; font-weight: 600; color: var(--gold-text); text-decoration: underline; text-underline-offset: 3px;
}
.uygulama #kd-kopyalari-sil[hidden] { display: none; }
.uygulama .cevrimdisi-bolum.tamam #kd-kopyalari-sil { padding: 0; }
.uygulama .cevrimdisi-bolum.tamam h2::after { content: " ✓"; color: var(--vurgu); }
/* İnternetsiz okuma uygulamada Daha sayfasında (Okuma grubu); Dualarım yalnızca kişinin kendi listesi */
.uygulama .kd-dualarim .cevrimdisi-bolum { display: none !important; }
.uygulama .uyg-sayfa .cevrimdisi-bolum { margin-top: .6rem; }
/* İnternet yok şeridi uygulamada üst çubuğun altında */
.uygulama .baglanti-serit { top: calc(3.5rem + env(safe-area-inset-top)); }
/* Koyu mod: resim olarak gömülü simgelerin rengi (koyu altın → açık altın) */
@media (prefers-color-scheme: dark) {
:root:not([data-tema="acik"]) .kd-dualarim .dualarim-liste .card::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D9BD7C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7.5-4.6-7.5-10.2A4.3 4.3 0 0 1 12 7a4.3 4.3 0 0 1 7.5 2.8C19.5 15.4 12 20 12 20z'/%3E%3C/svg%3E");
}
:root:not([data-tema="acik"]) .cevrimdisi-bolum::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D9BD7C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11M7 10l5 5 5-5'/%3E%3Cpath d='M5 19h14'/%3E%3C/svg%3E");
}
}
:root[data-tema="koyu"] .kd-dualarim .dualarim-liste .card::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D9BD7C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20s-7.5-4.6-7.5-10.2A4.3 4.3 0 0 1 12 7a4.3 4.3 0 0 1 7.5 2.8C19.5 15.4 12 20 12 20z'/%3E%3C/svg%3E");
}
:root[data-tema="koyu"] .cevrimdisi-bolum::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D9BD7C' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v11M7 10l5 5 5-5'/%3E%3Cpath d='M5 19h14'/%3E%3C/svg%3E");
}
/* Koyu mod: anasayfa "Ara" düğmesi açık altın zeminde koyu yazı (beyaz yazı okunmaz) */
@media (prefers-color-scheme: dark) {
:root:not([data-tema="acik"]) .hero-c .big-search button { color: var(--green-deep); }
:root:not([data-tema="acik"]) .hero-c .big-search button:hover { background: var(--gold-bright); filter: brightness(1.08); }
}
:root[data-tema="koyu"] .hero-c .big-search button { color: var(--green-deep); }
:root[data-tema="koyu"] .hero-c .big-search button:hover { background: var(--gold-bright); filter: brightness(1.08); }
/* Daha → Görünüm: Otomatik · Açık · Koyu */
.uyg-ayar + .uyg-ayar { border-top: 1px solid var(--line); }
.uyg-tema { flex-wrap: wrap; row-gap: .5rem; }
.tema-sec { display: inline-grid; grid-template-columns: repeat(3, auto); gap: .2rem; padding: .2rem; border-radius: 11px; background: var(--zemin-2); }
.tema-sec button {
min-height: 2.3rem; padding: 0 .75rem; border: 0; border-radius: 9px; background: transparent; cursor: pointer;
font: inherit; font-size: .82rem; font-weight: 600; color: var(--ink-2);
}
.tema-sec button[aria-checked="true"] { background: var(--card); color: var(--baslik); box-shadow: 0 1px 3px rgba(0, 0, 0, .15); }
/* Üst çubuktaki ay/güneş uygulamada da (diğer simgeler gibi krem) */
.uygulama .site-header .tema-ikon { color: #F4EEDF; }
.uygulama .site-header .tema-ikon:hover { background: rgba(255, 255, 255, .1); color: #fff; }
/* ============ Sayfalar arası yumuşak geçiş (Chrome "View Transitions") ============ */
/* Yalnızca yüklü uygulamada (tam ekran) ve "hareketleri azalt" kapalıyken: beyaz yanıp sönme
yerine kısa bir solma; üst çubuk ve alttaki sekmeler yerinde sabit kalır. */
@media (display-mode: standalone) and (prefers-reduced-motion: no-preference) {
@view-transition { navigation: auto; }
}
.uygulama .site-header { view-transition-name: kd-ust-cubuk; }
.uygulama .alt-nav { view-transition-name: kd-alt-menu; }
::view-transition-old(root),
::view-transition-new(root) { animation-duration: .16s; }
::view-transition-group(kd-alt-menu),
::view-transition-old(kd-alt-menu),
::view-transition-new(kd-alt-menu) { animation-duration: 0s; }
/* Dualarım notu (dua sayfası): uygulamada ayrı kart */
.uygulama .dua .dua-notum { margin-top: .9rem; padding: .95rem 1.1rem 1.05rem; border: 0; border-radius: 16px; background: var(--card); box-shadow: var(--shadow); }
/* Uygulamada çift dokunmayla yakınlaştırma kapalı (düğmelere hızlı dokunuşta sayfa büyümesin);
iki parmakla yakınlaştırma erişilebilirlik için açık kalır. */
html.uygulama, html.uygulama body { touch-action: manipulation; }
/* iOS (ana ekrana eklenmiş uygulama): en üstte aşağı çekince sayfanın esnemesi (rubber-band) kapalı;
aksi halde yapışkan başlık da içerikle birlikte aşağı kayıyordu. -webkit-touch-callout yalnızca iOS
Safari'de tanınır; Android'de aşağı çekip yenileme etkilenmez. */
@supports (-webkit-touch-callout: none) {
html.uygulama, html.uygulama body { overscroll-behavior-y: none; }
}