:root {
    --tepe: 68px;
    --yesil: #059669;
    --yesil-koyu: #047857;
    --yesil-derin: #064e3b;
    --yesil-canli: #10b981;
    --yesil-soluk: #d1fae5;
    --yesil-zemin: #ecf8f3;
    --kagit: #f2f7f4;
    --yuzey: #ffffff;
    --murekkep: #10261c;
    --soluk: #5d7368;
    --cizgi: #d5e5dc;
    --kirmizi: #be123c;
    --sari: #a16207;
    --golge: 0 10px 30px rgba(6, 78, 59, 0.06);
    --yazi: "Manrope", "Avenir Next", "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; color: var(--murekkep); background: var(--kagit); font-family: var(--yazi); font-size: 15.5px; line-height: 1.5; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
h1, h2, h3 { font-weight: 700; letter-spacing: -0.03em; margin: 0; }
p { margin: 0; }

.tepe {
    position: relative;
    z-index: 50;
    min-height: var(--tepe);
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 16px 0 8px;
    background: #000;
    color: white;
}
.tepe-sol { display: flex; align-items: center; gap: 4px; min-width: 0; flex: none; }
.menu-ac {
    width: 40px;
    height: 40px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    padding: 0;
    cursor: pointer;
}
.menu-ac:hover { background: rgba(255, 255, 255, 0.08); }
.menu-ac span { display: block; width: 18px; height: 2px; border-radius: 2px; background: white; transition: transform 0.18s ease, opacity 0.18s ease; }
html:not(.menu-kapali) .menu-ac span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
html:not(.menu-kapali) .menu-ac span:nth-child(2) { opacity: 0; }
html:not(.menu-kapali) .menu-ac span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.marka { display: flex; align-items: center; text-decoration: none; min-width: 0; }
.marka img { height: 44px; width: auto; max-width: 100%; display: block; object-fit: contain; object-position: left center; }
.tepe-gezinti { display: flex; align-items: center; gap: 4px; }
.tepe-gezinti a { text-decoration: none; color: #d4d4d4; font-weight: 700; font-size: 14px; padding: 6px 12px; border-radius: 999px; }
.tepe-gezinti a:hover { background: rgba(255, 255, 255, 0.08); color: white; }
.tepe-gezinti a.aktif { background: var(--yesil); color: white; }
.tepe-baslik { margin-left: auto; color: #a3a3a3; font-weight: 700; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 280px; }
.hesap { display: flex; align-items: center; gap: 12px; margin-left: 16px; }
.hesap-ad { display: inline-flex; align-items: center; gap: 8px; color: white; font-weight: 700; font-size: 14px; }
.hesap-ad i { width: 28px; height: 28px; border-radius: 99px; background: var(--yesil); display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: 13px; }

.kabuk { min-height: calc(100vh - var(--tepe)); display: grid; grid-template-columns: 232px minmax(0, 1fr); transition: grid-template-columns 0.2s ease; }
html.menu-kapali .kabuk { grid-template-columns: 0 1fr; }
.yan { background: white; border-right: 1px solid var(--cizgi); padding: 18px 12px; overflow: hidden; }
html.menu-kapali .yan { padding: 0; border-right-color: transparent; visibility: hidden; }
.menu { display: flex; flex-direction: column; gap: 18px; }
.grup { display: flex; flex-direction: column; gap: 2px; }
.grup span { color: var(--yesil); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700; padding: 0 10px 6px; }
.grup a { text-decoration: none; padding: 8px 10px; border-radius: 8px; color: var(--murekkep); }
.grup a.aktif { background: var(--yesil-soluk); color: var(--yesil-derin); font-weight: 700; }
.grup a:hover { background: var(--yesil-zemin); }
.ana { min-width: 0; }
.icerik > *, .iki > *, .kart, .kazan, .tablo-kapsam, .ozet-serit, .kalan { min-width: 0; }
.ust { padding: 26px 28px 0; display: flex; justify-content: space-between; gap: 16px; align-items: flex-end; flex-wrap: wrap; }
.ust h1 { font-size: 30px; }
.ust p, .aciklama { color: var(--soluk); }
.icerik { padding: 18px 28px 48px; display: flex; flex-direction: column; gap: 16px; }

.izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 14px; }
.iki { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 14px; }
.kart, .kazan { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 12px; padding: 16px 18px; box-shadow: var(--golge); }
.kazan { border-top: 3px solid var(--yesil); }
.kart h2, .kazan h2 { font-size: 16px; }
.ust-satir, .satir-arasi { display: flex; justify-content: space-between; gap: 12px; align-items: center; flex-wrap: wrap; }
.sayi { font-size: 40px; line-height: 1; letter-spacing: -0.04em; color: var(--yesil-derin); font-weight: 800; }
.sayi small { font-size: 15px; color: var(--soluk); margin-left: 4px; font-weight: 600; }
.doluluk { height: 8px; background: var(--yesil-zemin); border-radius: 99px; overflow: hidden; margin: 12px 0; }
.doluluk span { display: block; height: 100%; background: linear-gradient(90deg, var(--yesil), var(--yesil-canli)); }
.hammadde-satir { display: flex; justify-content: space-between; gap: 8px; padding: 8px 0; border-top: 1px solid var(--cizgi); font-size: 14px; flex-wrap: wrap; align-items: center; }
.sekmeler { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.kart > .sekmeler { margin-top: 0; margin-bottom: 16px; }
.sekme-panel { display: flex; flex-direction: column; gap: 14px; }
.satir-eylem { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; }
.hammadde-satir .buton { width: auto; flex: none; }
.sekme { border: 1px solid var(--cizgi); background: white; color: var(--soluk); border-radius: 999px; padding: 6px 14px; font-weight: 700; cursor: pointer; transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease; }
.sekme.aktif { background: var(--yesil); border-color: var(--yesil); color: white; }
.sekme-panel.giriyor { animation: sekme-gir 0.22s ease; }
@keyframes sekme-gir {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    .sekme, .sekme-panel.giriyor { transition: none; animation: none; }
}
.sekme-panel[hidden] { display: none; }
.fatura-kagit { background: white; border: 1px solid var(--cizgi); border-radius: 12px; padding: 22px; }
.fatura-ust, .fatura-alici { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.fatura-ust h2, .fatura-alici h3 { margin: 0 0 6px; font-size: 16px; }
.fatura-kagit p { margin: 0 0 4px; }
.fatura-alici { margin-top: 18px; }
.fatura-kagit table { width: 100%; border-collapse: collapse; margin-top: 16px; }
.fatura-kagit th, .fatura-kagit td { text-align: left; padding: 8px 6px; border-bottom: 1px solid var(--cizgi); }
.fatura-kagit .sag, .fatura-toplam .sag { text-align: right; }
.fatura-toplam { width: min(280px, 100%); margin-left: auto; }
.fatura-not { margin-top: 14px; color: var(--soluk); }
.fatura-kontrol { display: grid; grid-template-columns: minmax(220px, 1fr) auto auto; gap: 14px; align-items: end; margin-bottom: 22px; }
.fatura-kontrol label { display: flex; flex-direction: column; gap: 6px; font-weight: 700; }
.durum-yongalar { display: flex; gap: 8px; }
.durum-yonga { border-radius: 10px; padding: 10px 16px; font-weight: 700; background: #f3f4f6; color: #6b7280; }
.durum-yonga.kirmizi { background: #fecaca; color: #9f1239; }
.durum-yonga.mor { background: #ddd6fe; color: #5b21b6; }
.fatura-kontrol-eylem form { margin: 0; }
.nusha-serit { display: flex; gap: 16px; overflow-x: auto; padding: 16px; background: #f3f4f6; border-radius: 12px; }
.nusha { width: 820px; height: 1120px; flex: none; border: 0; background: white; box-shadow: 0 8px 24px rgba(15, 23, 42, .08); }
@media (max-width: 980px) {
    .fatura-kontrol { grid-template-columns: 1fr; }
}
@media print {
    .tepe, .yan, .menu-perde, .ust, .mesaj, .eylemler, .fatura-kontrol { display: none !important; }
    .kabuk, .ana, .icerik { display: block; width: auto; margin: 0; padding: 0; }
    .fatura-kagit { border: 0; padding: 0; }
    .nusha-serit { display: block; padding: 0; background: white; }
    .nusha { width: 100%; height: 1400px; box-shadow: none; }
}
.etiket { color: var(--soluk); font-size: 13px; }

.adimlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px; }
.agac { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.agac-dal { display: flex; flex-direction: column; align-items: flex-start; max-width: 100%; }
.agac-satir { display: flex; align-items: center; gap: 14px; width: 100%; max-width: 100%; padding: 8px 12px; border-radius: 10px; flex-wrap: wrap; }
.agac-satir:hover { background: var(--yesil-zemin); }
.agac-kimlik { display: flex; align-items: center; gap: 8px; min-width: 0; flex-wrap: wrap; }
.agac-alt { margin: 2px 0 2px 20px; padding: 4px 0 2px 16px; border-left: 2px solid #86efac; }
.agac-ac, .agac-nokta { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; border-radius: 8px; }
.agac-ac { border: 1px solid #b7d8c8; background: var(--yesil-zemin); color: var(--yesil-derin); cursor: pointer; padding: 0; }
.agac-ac::before { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translate(-1px, -1px); }
.agac-dal.kapali > .agac-satir .agac-ac::before { transform: rotate(-45deg) translate(-1px, 1px); }
.agac-dal.kapali > .agac-alt { display: none; }
.agac-nokta::before { content: ""; width: 8px; height: 8px; border-radius: 99px; background: #86efac; }
.buton.kucuk { padding: 6px 10px; font-size: 13px; }
.adim { display: flex; flex-direction: column; gap: 2px; text-decoration: none; background: white; border: 1px solid var(--cizgi); border-radius: 10px; padding: 12px; }
.adim.tamam { border-color: #a7f3d0; background: #f0fdf7; }
.adim strong { font-size: 14px; }
.adim span { color: var(--soluk); font-size: 12px; }

.akim { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; color: var(--soluk); font-size: 14px; background: white; border: 1px solid var(--cizgi); border-radius: 999px; padding: 8px 14px; width: fit-content; }
.akim b { color: var(--yesil-derin); font-weight: 700; }

.tablo-kapsam { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
.tablo-kapsam table { min-width: 560px; }
.alanlar.filtreler { grid-template-columns: 1fr 1.4fr 1fr auto; align-items: end; margin-bottom: 14px; }
.alanlar.filtreler.uc { grid-template-columns: 1.2fr 0.8fr auto; }
.tablo-blok { display: flex; flex-direction: column; gap: 8px; }
.tablo-blok + .tablo-blok { margin-top: 22px; }
.pencere.dar { width: min(440px, calc(100% - 32px)); }
#personel-tablosu, #bekleyen-tablosu, #alinan-tablosu { width: 100% !important; }
.filtre-temizle { display: flex; align-items: flex-end; }
.dt-container { font-family: inherit; color: var(--murekkep); }
.dt-container .dt-layout-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 12px; }
.dt-container .dt-length { display: flex; align-items: center; gap: 8px; }
.dt-container label { display: inline; flex-direction: row; width: auto; }
.dt-container .dt-length select { width: auto; padding: 6px 10px; }
.dt-container .dt-info { color: var(--soluk); }
.dt-container .dt-paging { display: flex; gap: 4px; }
.dt-container .dt-paging .dt-paging-button { border: 0; background: transparent; border-radius: 8px; padding: 6px 10px; font-weight: 700; color: var(--yesil-koyu); cursor: pointer; }
.dt-container .dt-paging .dt-paging-button.current,
.dt-container .dt-paging .dt-paging-button.current:hover { background: var(--yesil); color: white; }
.dt-container .dt-paging .dt-paging-button:hover { background: var(--yesil-zemin); }
.dt-container .dt-paging .dt-paging-button.disabled,
.dt-container .dt-paging .dt-paging-button.disabled:hover { color: #b7c4be; background: transparent; cursor: default; }
#urun-tablosu { width: 100% !important; }
#urun-tablosu td.islemler { white-space: nowrap; }
#urun-tablosu td .rozet { margin-left: 8px; }
.pencere { width: min(760px, calc(100% - 32px)); max-height: calc(100% - 32px); margin: auto; border: 0; border-radius: 16px; padding: 0; background: white; color: var(--murekkep); box-shadow: 0 24px 60px rgba(6, 78, 59, 0.22); }
.pencere.fatura-modu { width: min(1080px, calc(100% - 24px)); }
.fatura-pdf { width: 100%; height: min(72vh, 640px); border: 0; background: #eef2f1; display: block; margin-top: 14px; }
.fatura-kes { margin-top: 16px; }
button:disabled { opacity: .65; cursor: wait; }
.pencere::backdrop { background: rgba(6, 78, 59, 0.45); }
.pencere-ust { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 20px 22px 0; }
.pencere-ust p { margin-top: 6px; }
.pencere-icerik { padding: 14px 22px 22px; overflow: auto; max-height: calc(100vh - 140px); }
.pencere-kapat { border: 0; background: transparent; color: var(--soluk); font-weight: 700; cursor: pointer; padding: 4px 0; }
table { width: 100%; border-collapse: collapse; }
th { text-align: left; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--yesil-koyu); font-weight: 700; padding: 8px; }
td { padding: 10px 8px; border-top: 1px solid var(--cizgi); vertical-align: top; }
tbody tr:nth-child(even) td { background: #f4faf7; }
.islemler form { margin: 0; }
.rozet { display: inline-flex; align-items: center; flex: none; white-space: nowrap; border-radius: 99px; padding: 3px 10px; font-size: 12px; font-weight: 700; line-height: 1.3; background: #e8eeeb; color: var(--murekkep); }
.rozet.aktif { background: var(--yesil-soluk); color: var(--yesil-derin); }
.rozet.bakim { background: #fef3c7; color: var(--sari); }
.rozet.pasif { background: #ffe4e6; color: var(--kirmizi); }
.rozet.calisiyor { background: var(--yesil-soluk); color: var(--yesil-derin); }
.rozet.bos, .rozet.durdu { background: #e8eeeb; color: var(--murekkep); padding: 3px 10px; }

.ozet-serit { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.ozet-kart { background: white; border: 1px solid var(--cizgi); border-radius: 12px; padding: 16px 18px; box-shadow: var(--golge); }
.ozet-kart span { display: block; color: var(--yesil-koyu); font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 700; }
.ozet-kart strong { display: block; margin-top: 6px; font-size: 32px; line-height: 1; color: var(--yesil-derin); }
.ozet-kart strong small { display: inline; margin: 0; font-size: 16px; font-weight: 700; }
.kart-baslik { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 8px; flex-wrap: wrap; }
.cip { display: inline-flex; margin: 2px 6px 2px 0; padding: 3px 8px; border-radius: 99px; background: var(--yesil-zemin); color: var(--yesil-derin); font-size: 13px; font-weight: 700; }
.karisim-ust { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.kalan { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; }
.mini-form { display: flex; flex-direction: column; gap: 10px; }
.mini-form .alanlar { gap: 8px; }
.ozet-kart small { display: block; margin-top: 8px; color: var(--soluk); }
.makine-kart { display: flex; flex-direction: column; gap: 10px; }
.makine-kart form { margin: 0; }
.makine-bilgi { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.makine-baslik { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.islem-satir { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--cizgi); }
.islem-yazi { min-width: 0; }
.islem-satir time { color: var(--soluk); font-size: 13px; font-weight: 700; white-space: nowrap; }

.form { display: flex; flex-direction: column; gap: 14px; }
.alanlar { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.tam { grid-column: 1 / -1; }
label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; }
#sase-gramaj-alan[hidden], #sase-secim-alan[hidden], #efatura-pk-alan[hidden], .alan-grup[hidden] { display: none; }
.alan-grup { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.alan-grup h2 { margin: 8px 0 0; font-size: 15px; }
.kontrol-satir { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.kontrol-satir > span { font-size: 14px; font-weight: 650; }
label span { color: var(--soluk); font-weight: 600; }
input, select, textarea { width: 100%; min-width: 0; max-width: 100%; background: white; border: 1px solid #c5ddd2; border-radius: 8px; padding: 10px 12px; }
.alanlar > * { min-width: 0; }
textarea { min-height: 88px; resize: vertical; }
input:focus, select:focus, textarea:focus { outline: 3px solid rgba(16, 185, 129, 0.25); border-color: var(--yesil); }
.kontrol { display: flex; align-items: center; gap: 8px; flex-direction: row; }
.kontrol input { width: auto; }
.secici { display: flex; flex-direction: column; gap: 10px; border: 1px solid var(--cizgi); border-radius: 12px; padding: 12px; background: #f8fbf9; }
.secici-ust { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
.secici-ara { flex: 1 1 200px; }
.secici-sayac { font-size: 13px; font-weight: 700; color: var(--yesil-derin); white-space: nowrap; padding-bottom: 10px; }
.secici-secilen { display: flex; flex-wrap: wrap; gap: 6px; }
.secici-secilen:empty { display: none; }
.secici-cip { border: 0; cursor: pointer; border-radius: 99px; padding: 4px 10px; background: var(--yesil-zemin); color: var(--yesil-derin); font-weight: 700; font-size: 13px; }
.secici-cip::after { content: " ×"; }
.secici-liste { max-height: 320px; overflow: auto; display: flex; flex-direction: column; gap: 8px; background: white; border: 1px solid var(--cizgi); border-radius: 10px; padding: 8px 10px; }
.secici-grup-bas { display: flex; justify-content: space-between; align-items: center; gap: 8px; position: sticky; top: -8px; z-index: 1; background: white; padding: 6px 0; }
.secici-grup-bas strong { font-size: 13px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--yesil-koyu); }
.secici-oge { display: flex; align-items: flex-start; gap: 8px; flex-direction: row; padding: 6px 2px; }
.secici-oge input { width: auto; margin-top: 3px; }
.secici-oge span { color: var(--murekkep); font-weight: 650; }
.secici-oge small { display: block; color: var(--soluk); font-weight: 600; font-size: 12px; }
.secici-grup[hidden], .secici-oge[hidden], [data-secici-bos][hidden] { display: none; }
.cip-ozet { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
small.hata { color: var(--kirmizi); }

.buton { border: 0; background: var(--yesil); color: white; border-radius: 8px; padding: 10px 14px; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-weight: 700; }
.buton:hover { background: var(--yesil-koyu); }
.buton.ikincil { background: white; color: var(--yesil-derin); border: 1px solid #b7d8c8; }
.buton.ikincil:hover { background: var(--yesil-zemin); }
.buton.acik { background: transparent; color: white; border-color: rgba(255, 255, 255, 0.35); }
.buton.acik:hover { background: rgba(255, 255, 255, 0.1); }
.buton.yazi { background: transparent; color: var(--yesil-koyu); padding: 0; }
.buton.tehlike { background: transparent; color: var(--kirmizi); padding: 0; }
.islemler { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.eylemler { display: flex; gap: 8px; flex-wrap: wrap; }

.tekrar { display: flex; flex-direction: column; gap: 8px; }
.tekrar-satir { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(88px, 0.8fr) auto; gap: 8px; align-items: center; }
.tekrar-satir.fatura-kalem { grid-template-columns: minmax(0, 1.5fr) 92px 110px 110px auto; }
.alindi-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.alindi-form input { width: 84px; padding: 6px 8px; }
.alindi-form .buton { width: auto; white-space: nowrap; }
.mesaj { border-radius: 10px; padding: 12px 14px; }
.mesaj.basari { background: var(--yesil-soluk); color: var(--yesil-derin); }
.mesaj.hata { background: #ffe4e6; color: #9f1239; }
.bos:not(.rozet) { color: var(--soluk); padding: 8px 0 2px; }
.onizleme { background: var(--yesil-zemin); border: 1px solid #b7e4cf; border-radius: 10px; padding: 12px 14px; }
.onizleme strong { display: block; margin-bottom: 6px; color: var(--yesil-derin); }
.onizleme.uyari { background: #fff4e5; border-color: #f0c48a; }
.onizleme.uyari strong { color: #9a3412; }
.sayfalama { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.sayfalama a { color: var(--yesil-koyu); font-weight: 700; }

.giris-govde {
    min-height: 100vh;
    background:
        radial-gradient(circle at 12% 18%, rgba(16, 185, 129, 0.45), transparent 28%),
        radial-gradient(circle at 88% 82%, rgba(167, 243, 208, 0.18), transparent 26%),
        linear-gradient(165deg, #022c22 0%, #064e3b 48%, #047857 100%);
}
.giris-sahne { min-height: 100vh; display: grid; place-items: center; padding: 28px 16px; }
.giris-kart {
    width: min(920px, 100%);
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    background: white;
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 30px 80px rgba(2, 44, 34, 0.45);
}
.giris-sol {
    position: relative;
    min-height: 520px;
    padding: 48px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 22px;
    color: white;
    background:
        radial-gradient(circle at 70% 20%, rgba(110, 231, 183, 0.35), transparent 32%),
        linear-gradient(160deg, #059669 0%, #047857 42%, #064e3b 100%);
}
.giris-sol::before {
    content: "";
    position: absolute;
    width: 220px;
    height: 220px;
    right: -50px;
    top: -60px;
    border-radius: 50%;
    border: 18px solid rgba(255, 255, 255, 0.08);
}
.giris-logo { width: min(280px, 100%); height: auto; position: relative; }
.giris-alt { position: relative; margin: 0; letter-spacing: 0.22em; text-transform: uppercase; font-size: 12px; font-weight: 700; color: #d1fae5; }
.giris-adimlar { position: relative; display: flex; gap: 8px; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; }
.giris-adimlar li { border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 999px; padding: 6px 12px; font-size: 13px; }
.giris-kutu { display: flex; flex-direction: column; gap: 14px; padding: 48px 40px; }
.giris-kicker { margin: 0; color: var(--yesil); font-size: 12px; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase; }
.giris-kutu h1 { font-size: 34px; }
.giris-buton { width: 100%; min-height: 46px; margin-top: 4px; }

.dt-container .dt-search { max-width: 100%; }
.dt-container .dt-search input { width: auto; min-width: 0; }
.menu-perde { display: none; }

@media (max-width: 980px) {
    .kabuk, html.menu-kapali .kabuk, .giris-kart { display: block; }
    .iki { display: flex; flex-direction: column; gap: 14px; }
    .ana { overflow-x: clip; }
    .tepe { flex-wrap: nowrap; height: var(--tepe); overflow: hidden; padding: 0 10px 0 4px; gap: 6px; }
    .tepe-baslik, .hesap-ad span { display: none; }
    .tepe-gezinti { display: none; }
    .hesap { margin-left: auto; flex: none; gap: 8px; }
    .marka { flex: 1 1 auto; }
    .marka img { height: 36px; max-width: 100%; }
    .yan {
        position: fixed;
        z-index: 40;
        top: var(--tepe);
        left: 0;
        bottom: 0;
        width: min(280px, 86vw);
        display: block;
        padding: 18px 12px 28px;
        overflow: auto;
        border-right: 1px solid var(--cizgi);
        border-bottom: 0;
        box-shadow: 12px 0 32px rgba(0, 0, 0, 0.18);
        transform: translateX(0);
        visibility: visible;
        transition: transform 0.22s ease;
    }
    html.menu-kapali .yan {
        transform: translateX(-105%);
        visibility: hidden;
        padding: 18px 12px 28px;
        transition: transform 0.22s ease, visibility 0s linear 0.22s;
    }
    html:not(.menu-kapali) .menu-perde {
        display: block;
        position: fixed;
        z-index: 30;
        inset: var(--tepe) 0 0 0;
        border: 0;
        padding: 0;
        background: rgba(0, 0, 0, 0.45);
    }
    .menu { flex-direction: column; flex-wrap: nowrap; gap: 18px; }
    .grup { flex-direction: column; align-items: stretch; min-width: 0; gap: 2px; }
    .grup span { display: block; }
    .grup a { white-space: normal; }
    .ust, .icerik { padding-left: 16px; padding-right: 16px; }
    .ust h1, .giris-kutu h1 { font-size: 28px; }
    .sayi { font-size: 32px; }
    .giris-sol { min-height: 0; padding: 32px 24px 24px; }
    .giris-kutu { padding: 28px 24px 32px; }
    .giris-logo { width: min(220px, 78%); }
    .islem-satir { grid-template-columns: minmax(0, 1fr) auto; }
    .alanlar, .alanlar.filtreler, .alanlar.filtreler.uc { grid-template-columns: 1fr; }
    .secici-sayac { padding-bottom: 0; }
}

@media (max-width: 720px) {
    :root { --tepe: 56px; }
    .marka img { height: 32px; }
    .buton.acik { padding: 8px 10px; }
    .ust { align-items: stretch; }
    .ust h1 { font-size: 24px; }
    .eylemler .buton { flex: 1 1 auto; }
    .icerik { padding-left: 12px; padding-right: 12px; }
    .kart, .kazan, .ozet-kart { padding: 14px; }
    .ozet-kart strong { font-size: 26px; }
    .tekrar-satir, .tekrar-satir.fatura-kalem { grid-template-columns: minmax(0, 1fr) minmax(72px, 96px) auto; }
    .islem-satir { grid-template-columns: minmax(0, 1fr); }
    .islem-satir time { justify-self: start; }
    .pencere { width: calc(100% - 16px); border-radius: 14px; }
    .pencere-ust, .pencere-icerik { padding-left: 16px; padding-right: 16px; }
    .dt-container .dt-search, .dt-container .dt-search input { width: 100%; }
    input, select, textarea { font-size: 16px; }
    .agac-alt { margin-left: 8px; padding-left: 10px; }
}