body { background: #f2f4f8; -webkit-tap-highlight-color: transparent; overscroll-behavior-y: none; }
.ust-bant { background: linear-gradient(160deg, var(--p-bant-1, #0d6efd), var(--p-bant-2, #0a58ca)); color: #fff; padding: calc(env(safe-area-inset-top) + 1rem) 1.25rem 1rem; }
.saat { font-size: 3.5rem; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.durum-nokta { width: 14px; height: 14px; border-radius: 50%; flex: none; box-shadow: 0 0 0 4px rgba(0,0,0,.06); }
.btn-okut { display: flex; flex-direction: column; align-items: center; padding: 1.4rem; border-radius: 1.25rem; font-size: 1.6rem; font-weight: 700; letter-spacing: .05em; }
.btn-okut i { font-size: 3.2rem; line-height: 1; }
.btn-okut small { font-size: .8rem; font-weight: 400; letter-spacing: 0; opacity: .85; }
/* Okuyucu 960 px genişlikte çalışır ve ekrana küçültülerek gösterilir: kamera görüntüsü telefon ekranı genişliğine (≈390 px)
   indirilmeden taranır, uzaktaki / küçük QR de okunur. Yükseklik app.js'te görüntünün oranına göre verilir. */
#okuyucu { position: absolute; top: 0; left: 0; transform-origin: 0 0; }
#okuyucu #qr-shaded-region { display: none; }
/* Okuyucu çerçevesi yalnız yön gösterir: görüntünün tamamı taranır, QR çerçevenin dışındayken de okunur. */
.okuyucu-kap { position: relative; overflow: hidden; border-radius: 1rem; aspect-ratio: 4 / 3; background: #000; width: calc(100% - 2rem); }
.okuyucu-cerceve { position: absolute; inset: 14%; pointer-events: none; }
.okuyucu-cerceve i { position: absolute; width: 2.2rem; height: 2.2rem; border: 4px solid #fff; opacity: .9; }
.okuyucu-cerceve i:nth-child(1) { top: 0; left: 0; border-right: 0; border-bottom: 0; border-top-left-radius: .6rem; }
.okuyucu-cerceve i:nth-child(2) { top: 0; right: 0; border-left: 0; border-bottom: 0; border-top-right-radius: .6rem; }
.okuyucu-cerceve i:nth-child(3) { bottom: 0; left: 0; border-right: 0; border-top: 0; border-bottom-left-radius: .6rem; }
.okuyucu-cerceve i:nth-child(4) { bottom: 0; right: 0; border-left: 0; border-top: 0; border-bottom-right-radius: .6rem; }
.okuyucu-cerceve b { position: absolute; left: 6%; right: 6%; height: 2px; background: rgba(34, 197, 94, .9); box-shadow: 0 0 10px rgba(34, 197, 94, .9); animation: okuyucu-tarama 1.6s ease-in-out infinite alternate; }
@keyframes okuyucu-tarama { from { top: 4%; } to { top: 96%; } }
@media (prefers-reduced-motion: reduce) { .okuyucu-cerceve b { animation: none; top: 50%; } }
.sonuc-basarili { background: #198754; color: #fff; }
.sonuc-hata { background: #dc3545; color: #fff; }
.sonuc-bekle { background: var(--p-ana, #0d6efd); color: #fff; }
.sonuc-saat { font-size: 4.5rem; font-weight: 800; font-variant-numeric: tabular-nums; }
/* Alt menü (sekme çubuğu) */
body.alt-menulu { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
body.alt-menu-gizli { padding-bottom: 0; }
body.alt-menu-gizli .alt-menu { display: none; }
.alt-menu { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1030; display: flex; background: #fff; border-top: 1px solid #e3e6ec;
    padding-bottom: env(safe-area-inset-bottom); box-shadow: 0 -2px 12px rgba(0,0,0,.05); }
.alt-menu a { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 0 6px; color: #6c757d; text-decoration: none; font-size: .72rem; min-width: 0; }
.alt-menu a span:not(.alt-rozet) { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 2px; }
.alt-menu a i { font-size: 1.35rem; line-height: 1; }
.alt-menu a.active { color: var(--p-vurgu, #0d6efd); font-weight: 600; }
.alt-rozet, .zil-rozet { position: absolute; top: 2px; left: 55%; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: #dc3545; color: #fff;
    font-size: .65rem; line-height: 18px; text-align: center; font-weight: 700; }
.zil-rozet { top: -4px; left: 60%; border: 2px solid var(--p-bant-2, #0a58ca); height: 20px; line-height: 16px; }
/* Kartlar ve listeler */
.kutu-ikon { width: 42px; height: 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-size: 1.25rem; flex: none; }
.hizli-islem { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; }
.hizli-islem a { display: flex; flex-direction: column; align-items: center; gap: .35rem; padding: .7rem .2rem; background: #fff; border-radius: 14px;
    text-decoration: none; color: #212529; font-size: .72rem; text-align: center; box-shadow: 0 1px 3px rgba(0,0,0,.06); }
.bakiye-kart .kalan { font-size: 1.8rem; font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.bakiye-cubuk { height: 6px; border-radius: 3px; background: #e9ecef; overflow: hidden; }
.bakiye-cubuk > span { display: block; height: 100%; background: var(--p-ana, #0d6efd); }
.liste-satir { display: flex; align-items: center; gap: .75rem; padding: .75rem 1rem; text-decoration: none; color: inherit; border-bottom: 1px solid #eef0f4; }
.liste-satir:last-child { border-bottom: 0; }
.okunmamis { background: var(--p-ana-acik, #f1f6ff); }
.onemli-serit { border-left: 4px solid #dc3545; }
.zaman-cizgisi { list-style: none; padding-left: 1.25rem; border-left: 2px solid #dee2e6; margin: 0; }
.zaman-cizgisi li { position: relative; padding: 0 0 1rem .5rem; }
.zaman-cizgisi li::before { content: ""; position: absolute; left: -1.62rem; top: .25rem; width: 12px; height: 12px; border-radius: 50%; background: var(--nokta, #adb5bd); border: 2px solid #fff; }
.fis-onizleme { max-height: 220px; border-radius: 10px; object-fit: contain; background: #f8f9fa; }
.duyuru-metni { white-space: pre-wrap; }
/* Görüntüleme tercihleri: yazı boyutu ve koyu tema */
body.yazi-buyuk { font-size: 1.12rem; }
body.yazi-cok-buyuk { font-size: 1.25rem; }
body.yazi-buyuk .small, body.yazi-buyuk small { font-size: .92em; }
body.yazi-cok-buyuk .small, body.yazi-cok-buyuk small { font-size: .95em; }
[data-bs-theme=dark] body { background: #12151b; }
[data-bs-theme=dark] .alt-menu { background: #1b1f27; border-top-color: #2b313c; }
[data-bs-theme=dark] .hizli-islem a { background: #1b1f27; color: #e9ecef; }
[data-bs-theme=dark] .liste-satir { border-bottom-color: #2b313c; }
[data-bs-theme=dark] .bg-white { background-color: var(--bs-tertiary-bg) !important; color: var(--bs-body-color); }
/* Raporlarım */
.sabit-p { position: sticky; top: 0; z-index: 5; background: var(--bs-body-bg, #f2f4f8); margin: -1rem -12px .5rem; padding: .75rem 12px .25rem; box-shadow: 0 6px 8px -8px rgba(0,0,0,.25); }
body:not([data-tema=koyu]) .sabit-p { background: #f2f4f8; }
[data-bs-theme=dark] .sabit-p { background: #12151b; }
/* Mağaza uygulaması ve iPhone ana ekran uygulaması: sayfa durum çubuğunun altına uzanır (viewport-fit=cover). Yapışkan başlık
   çentiğin altında durur, üstteki boşluk zemin rengiyle kapanır; tam ekranlar çentik payı kadar aşağıdan başlar. */
.sabit-p { top: env(safe-area-inset-top, 0px); box-shadow: 0 calc(-1 * env(safe-area-inset-top, 0px)) 0 0 #f2f4f8, 0 6px 8px -8px rgba(0,0,0,.25); }
[data-bs-theme=dark] .sabit-p { box-shadow: 0 calc(-1 * env(safe-area-inset-top, 0px)) 0 0 #12151b, 0 6px 8px -8px rgba(0,0,0,.25); }
#tarayiciEkrani > div:first-child { padding-top: calc(env(safe-area-inset-top, 0px) + 1rem) !important; }
#sonucEkrani, #molaEkrani { padding-top: calc(env(safe-area-inset-top, 0px) + 1.5rem) !important; padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 1.5rem) !important; }
.rapor-alanlar { display: flex; flex-wrap: wrap; gap: .15rem 1rem; font-size: .9em; }
.rapor-alanlar small { margin-right: .2rem; }
.p-zebra-kart > .rapor-kart:nth-child(even) { background: rgba(var(--p-ana-rgb, 13, 110, 253), .06); }
.p-renkli-kart > .rapor-kart:nth-child(6n+1) { border-left: 4px solid var(--p-ana, #0d6efd); }
.p-renkli-kart > .rapor-kart:nth-child(6n+2) { border-left: 4px solid #198754; }
.p-renkli-kart > .rapor-kart:nth-child(6n+3) { border-left: 4px solid #fd7e14; }
.p-renkli-kart > .rapor-kart:nth-child(6n+4) { border-left: 4px solid #6f42c1; }
.p-renkli-kart > .rapor-kart:nth-child(6n+5) { border-left: 4px solid #d63384; }
.p-renkli-kart > .rapor-kart:nth-child(6n) { border-left: 4px solid #20c997; }
table.p-renkli > tbody > tr:nth-child(6n+1) > td { --bs-table-bg-type: rgba(13,110,253,.07); }
table.p-renkli > tbody > tr:nth-child(6n+2) > td { --bs-table-bg-type: rgba(25,135,84,.07); }
table.p-renkli > tbody > tr:nth-child(6n+3) > td { --bs-table-bg-type: rgba(253,126,20,.08); }
table.p-renkli > tbody > tr:nth-child(6n+4) > td { --bs-table-bg-type: rgba(111,66,193,.07); }
table.p-renkli > tbody > tr:nth-child(6n+5) > td { --bs-table-bg-type: rgba(214,51,132,.07); }
table.p-renkli > tbody > tr:nth-child(6n) > td { --bs-table-bg-type: rgba(32,201,151,.08); }
/* Sayfa ortasındaki süzgeç formu (ör. İzinlerim): kaydırınca üstte sabit kalır */
.sabit-suzgec-p { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 5; box-shadow: 0 6px 10px -8px rgba(0,0,0,.3) !important; }
@media print { .sabit-suzgec-p { position: static; } }
@media print { .alt-menu, .ust-bant a, .sabit-p form, .rapor-sekmeler, .sabit-p .d-flex { display: none !important; } .sabit-p { position: static; box-shadow: none; } body.alt-menulu { padding-bottom: 0; } }
/* Özlük Bilgilerim: şirket logosu, evrak sayfaları ve yükleme göstergesi */
/* Logonun kenar boşluğu sunucuda kırpılır (/p/logo?kirp=1); kutu iç boşluksuzdur ve logonun kendi en / boy oranını alır,
   logo alanı kenardan kenara doldurur. Beyaz zemin yalnız saydam logolar mavi bantta okunsun diyedir. */
.p-logo { display: inline-block; flex: none; background: #fff; border-radius: 8px; overflow: hidden; line-height: 0; box-shadow: 0 1px 4px rgba(0,0,0,.18); padding: 3px 5px; }
.p-logo img { display: block; width: auto; height: 56px; max-width: min(260px, 60vw); }
.p-logo-buyuk { border-radius: 12px; padding: 6px 9px; }
.p-logo-buyuk img { height: 100px; max-width: min(340px, 84vw); }
.evrak-sayfalar { display: flex; flex-wrap: wrap; gap: .5rem; }
.evrak-sayfa { position: relative; width: 84px; height: 84px; border-radius: 10px; overflow: hidden; background: #f1f3f5; border: 1px solid #e3e6ec; }
.evrak-sayfa img { width: 100%; height: 100%; object-fit: cover; display: block; }
.evrak-sayfa form { position: absolute; top: 3px; right: 3px; margin: 0; }
.evrak-sil { width: 24px; height: 24px; border-radius: 50%; border: 0; background: rgba(220,53,69,.92); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1rem; padding: 0; }
.evrak-pdf { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #dc3545; text-decoration: none; }
.evrak-pdf i { font-size: 2rem; line-height: 1; }
.evrak-sayfa .evrak-ad { position: absolute; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,.6); color: #fff; font-size: .62rem; line-height: 1.2;
    padding: 2px 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.evrak-bekleyen { margin-top: .6rem; padding: .5rem; border: 1px dashed var(--p-vurgu, #0d6efd); border-radius: 10px; background: rgba(var(--p-ana-rgb, 13, 110, 253), .04); }
.evrak-bekleyen-satir { display: flex; gap: .6rem; align-items: center; margin-top: .4rem; min-width: 0; }
.evrak-bekleyen-satir .evrak-sayfa { width: 64px; height: 64px; flex: 0 0 64px; }
.evrak-bekleyen-satir .flex-fill { min-width: 0; }
.evrak-sil-ust { position: absolute; top: 3px; right: 3px; }
.askerlik-kutu { border: 1px solid #e3e6ec; border-radius: 10px; padding: .6rem .75rem; }
.askerlik-kutu legend { float: none; width: auto; font-size: .85rem; }
.askerlik-secenek { display: flex; flex-wrap: wrap; gap: .35rem; }
.askerlik-secenek .btn { flex: 1 1 auto; }
.evrak-gonder-cubuk { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1035; background: #fff; border-top: 1px solid #e3e6ec;
    box-shadow: 0 -4px 16px rgba(0,0,0,.08); padding: .6rem 0 calc(.6rem + env(safe-area-inset-bottom)); }
body.alt-menulu .evrak-gonder-cubuk { bottom: calc(60px + env(safe-area-inset-bottom)); padding-bottom: .6rem; }
body.evrak-gonderilecek { padding-bottom: calc(70px + env(safe-area-inset-bottom)); }
body.alt-menulu.evrak-gonderilecek { padding-bottom: calc(132px + env(safe-area-inset-bottom)); }
[data-bs-theme=dark] .evrak-gonder-cubuk { background: #1b1f27; border-top-color: #2b313c; }
[data-bs-theme=dark] .askerlik-kutu { border-color: #2b313c; }
.evrak-yukleniyor { position: fixed; inset: 0; z-index: 1100; background: rgba(0,0,0,.45); display: flex; align-items: center; justify-content: center; }
.evrak-yukleniyor.d-none { display: none !important; }
[data-bs-theme=dark] .evrak-sayfa { background: #1b1f27; border-color: #2b313c; }

/* İlk açılış: kamera ve konum izni */
.izin-ikon { width: 2.5rem; height: 2.5rem; flex: 0 0 2.5rem; border-radius: .75rem; display: grid; place-items: center; font-size: 1.25rem;
    background: rgba(var(--p-ana-rgb, 13, 110, 253), .12); color: var(--p-vurgu, #0d6efd); }
.izin-durum:empty { display: none; }

/* Uzun çevirilerde (Rusça, Almanca) izin durumu rozeti alt satıra geçer, metin kartın dışına taşmaz. */
.izin-listesi li > .flex-grow-1 { min-width: 0; }
.izin-listesi li > .flex-grow-1 > .d-flex { flex-wrap: wrap; }
.izin-durum { white-space: normal; text-align: left; }

/* Renk teması (Diğer › Görüntüleme Ayarları › Renk teması): değişkenler _PersonelLayout'ta PersonelTemasi.Css ile yazılır. */
.btn-primary {
    --bs-btn-bg: var(--p-ana); --bs-btn-border-color: var(--p-ana);
    --bs-btn-hover-bg: var(--p-ana-koyu); --bs-btn-hover-border-color: var(--p-ana-koyu);
    --bs-btn-active-bg: var(--p-ana-koyu); --bs-btn-active-border-color: var(--p-ana-koyu);
    --bs-btn-disabled-bg: var(--p-ana); --bs-btn-disabled-border-color: var(--p-ana);
    --bs-btn-focus-shadow-rgb: var(--p-ana-rgb);
}
.btn-outline-primary {
    --bs-btn-color: var(--p-vurgu); --bs-btn-border-color: var(--p-vurgu);
    --bs-btn-hover-bg: var(--p-ana); --bs-btn-hover-border-color: var(--p-ana);
    --bs-btn-active-bg: var(--p-ana); --bs-btn-active-border-color: var(--p-ana);
    --bs-btn-disabled-color: var(--p-vurgu); --bs-btn-disabled-border-color: var(--p-vurgu);
    --bs-btn-focus-shadow-rgb: var(--p-ana-rgb);
}
.text-bg-primary, .bg-primary { background-color: var(--p-ana) !important; }
.text-primary { color: var(--p-vurgu) !important; }
.border-primary { border-color: var(--p-vurgu) !important; }
.form-check-input:checked { background-color: var(--p-ana); border-color: var(--p-ana); }
.form-control:focus, .form-select:focus, .form-check-input:focus { border-color: var(--p-vurgu); box-shadow: 0 0 0 .2rem rgba(var(--p-ana-rgb), .2); }
.nav-pills { --bs-nav-pills-link-active-bg: var(--p-ana); }
.pagination { --bs-pagination-active-bg: var(--p-ana); --bs-pagination-active-border-color: var(--p-ana); --bs-pagination-color: var(--p-vurgu); }
.progress, .progress-stacked { --bs-progress-bar-bg: var(--p-ana); }
/* Renk teması önizlemesi */
.renk-secim { display: grid; grid-template-columns: repeat(auto-fill, minmax(5.4rem, 1fr)); gap: .4rem; }
.renk-secim label { display: flex; flex-direction: column; align-items: center; gap: .25rem; padding: .45rem .25rem; border: 2px solid var(--bs-border-color); border-radius: .75rem;
    font-size: .74rem; text-align: center; cursor: pointer; line-height: 1.15; background: var(--bs-body-bg); }
.renk-secim .renk-ornek { width: 2rem; height: 2rem; border-radius: 50%; box-shadow: inset 0 0 0 2px rgba(255,255,255,.6), 0 1px 3px rgba(0,0,0,.25); }
.renk-secim input:checked + label { border-color: var(--p-vurgu); box-shadow: 0 0 0 2px rgba(var(--p-ana-rgb), .25); font-weight: 600; }
.renk-secim input:disabled + label { opacity: .6; cursor: default; }
.tema-mod { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; }
.tema-mod label { display: flex; flex-direction: column; align-items: center; gap: .2rem; padding: .55rem .25rem; font-size: .8rem; }
.tema-mod label i { font-size: 1.3rem; }
/* Koyu tema: açık renkli Bootstrap öğeleri */
[data-bs-theme=dark] .btn-light { --bs-btn-bg: #1f242d; --bs-btn-border-color: #2b313c; --bs-btn-color: #e9ecef; --bs-btn-hover-bg: #272d38; --bs-btn-hover-border-color: #343b48;
    --bs-btn-hover-color: #fff; --bs-btn-active-bg: #2b313c; --bs-btn-active-color: #fff; }
[data-bs-theme=dark] .table-light, [data-bs-theme=dark] thead.table-light th { --bs-table-bg: #1f242d; --bs-table-color: #dee2e6; --bs-table-border-color: #2b313c; }
[data-bs-theme=dark] .bakiye-cubuk { background: #2b313c; }
[data-bs-theme=dark] .text-bg-light { background-color: #2b313c !important; color: #e9ecef !important; }
[data-bs-theme=dark] .zaman-cizgisi li::before { border-color: #12151b; }
[data-bs-theme=dark] .fis-onizleme { background: #1b1f27; }
[data-bs-theme=dark] .p-logo { box-shadow: 0 1px 4px rgba(0,0,0,.5); }

/* Telefona ve web tarayıcısına uyum (v30) */
.aralik-satir { display: flex; gap: .25rem; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.aralik-satir::-webkit-scrollbar { display: none; }
.aralik-satir .btn { flex: none; white-space: nowrap; }
.aralik-satir .btn { min-height: 2.1rem; display: inline-flex; align-items: center; gap: .3rem; }
/* Geniş tablolarda ilk sütun (tarih / ad) kaydırırken yerinde kalır. */
.p-ilk-sabit th:first-child, .p-ilk-sabit td:first-child { position: sticky; left: 0; z-index: 1; box-shadow: 1px 0 0 var(--bs-border-color); }
.p-ilk-sabit thead th:first-child { z-index: 2; }
.p-kap-rapor { max-width: 820px; }
/* Özlük evrakı: dar ekranda "Fotoğraf çek" ve "Dosya seç" iki satıra bölünmez, gerekirse alt alta tam genişlik olur. */
.evrak-dugmeler > .btn { flex: 1 1 10.5rem; white-space: nowrap; }
@media (min-width: 768px) {
    /* Bilgisayarda aralık düğmeleri satıra sığmazsa alt satıra geçer (yatay kaydırma fareyle zor). */
    .aralik-satir { flex-wrap: wrap; overflow: visible; }
    /* Alt menü geniş ekranda ortada, içerik genişliğinde durur. */
    .alt-menu { left: 50%; right: auto; transform: translateX(-50%); width: min(100%, 720px); border: 1px solid #e3e6ec; border-bottom: 0; border-radius: 16px 16px 0 0; }
    [data-bs-theme=dark] .alt-menu { border-color: #2b313c; }
}
@media (min-width: 992px) { .p-kap-rapor { max-width: 1140px; } }

/* v40: elle girilen ya da düzeltilen hareket (unutulan okutma bildirimi) */
:root { --elle-renk: #6f42c1; --elle-zemin: rgba(111, 66, 193, .10); }
[data-bs-theme=dark] { --elle-renk: #b197fc; --elle-zemin: rgba(177, 151, 252, .14); }
.hareket-elle { background-color: var(--elle-zemin) !important; box-shadow: inset 3px 0 0 var(--elle-renk); }
.hareket-elle-metin { color: var(--elle-renk); font-weight: 600; }
/* v56: sayfanın başına dön (wwwroot/js/gezinti.js): uzun sayfada aşağı kaydırınca sağ altta, alt menünün ve evrak gönderme çubuğunun üstünde */
.sayfa-basi-dugmesi { position: fixed; right: 14px; bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 1032; width: 44px; height: 44px;
    display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 50%;
    background: linear-gradient(160deg, var(--p-bant-1, #0d6efd), var(--p-bant-2, #0a58ca)); color: #fff; font-size: 1.25rem;
    box-shadow: 0 6px 16px rgba(0,0,0,.25); opacity: 0; transform: translateY(10px); pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.sayfa-basi-dugmesi.acik { opacity: .95; transform: none; pointer-events: auto; }
.sayfa-basi-dugmesi:focus-visible { outline: 3px solid rgba(var(--p-ana-rgb, 13, 110, 253), .45); outline-offset: 2px; }
body.alt-menulu .sayfa-basi-dugmesi { bottom: calc(76px + env(safe-area-inset-bottom)); }
body.evrak-gonderilecek .sayfa-basi-dugmesi { bottom: calc(84px + env(safe-area-inset-bottom)); }
body.alt-menulu.evrak-gonderilecek .sayfa-basi-dugmesi { bottom: calc(146px + env(safe-area-inset-bottom)); }
@media (prefers-reduced-motion: reduce) { .sayfa-basi-dugmesi { transition: none; } }
@media print { .sayfa-basi-dugmesi { display: none !important; } }

/* v5.10: üst bant (Geri · başlık · Ana menü · Bildirimler, _PUstBant) uzun sayfada kaydırırken üstte kalır; aşağı inince incelir
   (app.js: body.p-kaydirildi). Bandın yüksekliği app.js'te --p-ust-h olarak yazılır; sayfanın üstündeki seçenekler bandın hemen altına
   yapışır: .sabit-p (Raporlarım ve Bordrom: rapor sekmeleri, tarih aralığı), .p-sabit-bolum (İzinlerim yılı, Taleplerim süzgeçleri,
   Geçmiş Kayıtlarım ayı), .sabit-suzgec-p (İzinlerim listesi süzgeci). */
.p-ust { position: sticky; top: 0; z-index: 1020; padding: calc(env(safe-area-inset-top) + .55rem) .6rem .55rem; transition: padding .15s ease; }
.p-ust .ub-baslik { min-width: 0; padding: 0 .3rem; }
.p-ust .h5 { font-size: 1.1rem; line-height: 1.2; overflow-wrap: anywhere; }
.ub-dugme { flex: none; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: .15rem;
    min-width: 2.9rem; min-height: 2.75rem; padding: .15rem .3rem; border-radius: .75rem; color: #fff; text-decoration: none; line-height: 1; }
.ub-dugme i { font-size: 1.35rem; line-height: 1; }
.ub-dugme > span:not(.zil-rozet) { font-size: .62rem; font-weight: 600; opacity: .92; white-space: nowrap; }
.ub-dugme:hover, .ub-dugme:focus-visible { color: #fff; background: rgba(255, 255, 255, .16); }
.ub-dugme:active { background: rgba(255, 255, 255, .26); }
.ub-zil .zil-rozet { top: 2px; left: 55%; }
body.p-kaydirildi .p-ust { padding-top: calc(env(safe-area-inset-top) + .25rem); padding-bottom: .25rem; box-shadow: 0 4px 10px rgba(0, 0, 0, .2); }
body.p-kaydirildi .p-ust .ub-alt, body.p-kaydirildi .p-ust .ub-dugme > span:not(.zil-rozet) { display: none; }
body.p-kaydirildi .p-ust .h5 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sabit-p, .sabit-suzgec-p { top: var(--p-ust-h, env(safe-area-inset-top, 0px)); }
.p-sabit-bolum { position: sticky; top: var(--p-ust-h, env(safe-area-inset-top, 0px)); z-index: 5; margin: 0 -12px .5rem; padding: .5rem 12px .35rem;
    background: #f2f4f8; box-shadow: 0 6px 8px -8px rgba(0, 0, 0, .25); }
.container > .p-sabit-bolum:first-child { margin-top: -1rem; padding-top: .75rem; }
[data-bs-theme=dark] .p-sabit-bolum { background: #12151b; }
/* Özlük Bilgilerim: üst satır yapışkan, logo ve firma adı altında kayan bölümde; iki parça tek bant gibi görünür. */
.p-ust.ozluk-ust { background: var(--p-bant-1, #0d6efd); }
.ozluk-hero { background: linear-gradient(180deg, var(--p-bant-1, #0d6efd), var(--p-bant-2, #0a58ca)); padding-top: .35rem; }
@media (prefers-reduced-motion: reduce) { .p-ust { transition: none; } }
@media print { .p-ust, .p-sabit-bolum { position: static; box-shadow: none; } .ub-dugme { display: none !important; } }

/* v5.10: Raporlarım sekmeleri tek ekrana sığar, sağa sola kaydırılmaz: eşit hücreli ızgara, simge üstte ad altta. Telefonda en çok
   iki satır (sütun sayısı sunucuda yazılır: --rs-sutun; 10 rapor 5 + 5), bilgisayarda tek satır (--rs-adet). */
.rapor-sekmeler { display: grid; grid-template-columns: repeat(var(--rs-sutun, 5), minmax(0, 1fr)); gap: .3rem; }
.rapor-sekmeler .btn { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .2rem; min-width: 0; min-height: 3.3rem;
    padding: .35rem .15rem; font-size: .68rem; line-height: 1.12; white-space: normal; text-align: center; }
.rapor-sekmeler .btn i { font-size: 1.15rem; line-height: 1; }
/* Yazı hücreden uzunsa taşmaz, satıra bölünür; Almanca ve Rusçanın uzun sözcükleri hecelenir. Dar telefonlarda (360-399 px) yazı ve
   boşluklar biraz küçülür: Türkçe ve İngilizce adlar bölünmeden sığar. */
.rapor-sekmeler .btn span { max-width: 100%; overflow-wrap: anywhere; }
html:lang(de) .rapor-sekmeler .btn, html:lang(ru) .rapor-sekmeler .btn { hyphens: auto; -webkit-hyphens: auto; }
@media (max-width: 399.98px) { .rapor-sekmeler { gap: .2rem; } .rapor-sekmeler .btn { font-size: .62rem; padding: .3rem .05rem; } }
@media (max-width: 349.98px) { .rapor-sekmeler { grid-template-columns: repeat(auto-fill, minmax(3.6rem, 1fr)); } }
@media (min-width: 992px) { .rapor-sekmeler { grid-template-columns: repeat(var(--rs-adet, 10), minmax(0, 1fr)); } .rapor-sekmeler .btn { font-size: .78rem; } }