body.tema-karaman {
    --murekkep: #163024;
    --kagit: #f3f7f4;
    --kart: #ffffff;
    --cizgi: #d5e4da;
    --bakir: #1b6b3a;
    --bakir-koyu: #145230;
    --pirinc: #1f8a8a;
    --zeytin: #1b6b3a;
    --soluk: #5e6f64;
    --golge: 0 10px 30px rgba(22, 48, 36, 0.06);
    --yazi: "Outfit", "Avenir Next", "Segoe UI", sans-serif;
    --baslik: "Outfit", "Avenir Next", sans-serif;
    background:
        radial-gradient(900px 420px at 100% -10%, rgba(31, 138, 138, 0.08), transparent 60%),
        var(--kagit);
}

body.tema-karaman .menu-perde { display: none !important; }
body.tema-karaman .sidebar {
    position: sticky;
    top: 0;
    z-index: 5;
    transform: none;
    height: 100vh;
    width: 248px;
    padding: 18px 16px 20px;
    overflow: auto;
    flex: none;
    background: linear-gradient(180deg, #123524 0%, #0e2a1c 100%);
}
body.tema-karaman .cari-islem { flex-wrap: nowrap; }
body.tema-karaman .btn-sil {
    background: #b42318;
    border-color: #b42318;
    color: #fff;
}
body.tema-karaman .btn-sil:hover { background: #8e1b13; color: #fff; }

body.tema-karaman .marka-logo {
    margin: 0 6px 22px;
    padding: 10px;
    background: #fff;
    border-radius: 14px;
}

body.tema-karaman .marka-logo img {
    display: block;
    width: 100%;
    height: auto;
}

body.tema-karaman .sidebar nav a.active {
    background: rgba(126, 196, 140, 0.18);
    box-shadow: inset 3px 0 0 #7ec48c;
}

body.tema-karaman .ust {
    background: rgba(243, 247, 244, 0.92);
    align-items: center;
}

body.tema-karaman .ust-baslik {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

body.tema-karaman .ust h1,
body.tema-karaman .h5 {
    font-family: var(--baslik);
    font-weight: 650;
}

body.tema-karaman .kicker { color: #1f8a8a; letter-spacing: 0.08em; }

body.tema-karaman .btn-bakir {
    background: #1b6b3a;
    border-color: #1b6b3a;
    color: #fff;
}

body.tema-karaman .btn-bakir:hover { background: #145230; color: #fff; }

body.tema-karaman .btn-koyu {
    background: #123524;
    border-color: #123524;
    color: #fff;
}

body.tema-karaman .kart { border-radius: 16px; }

body.tema-karaman button.olcu {
    width: 100%;
    text-align: left;
    cursor: pointer;
    border: 0;
    font: inherit;
    color: inherit;
}

body.tema-karaman table.data th {
    color: #3d5c49;
    border-bottom-color: #d5e4da;
}

body.tema-karaman .sayfa-ust { flex-wrap: wrap; }
body.tema-karaman .sayfa-ust > div:first-child { min-width: 0; }

body.tema-karaman .sayfa-araclar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}

body.tema-karaman .cari-sekmeler {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
}
body.tema-karaman .cari-sekmeler button {
    border: 1px solid #d5e4da;
    background: #fff;
    color: #145230;
    border-radius: 999px;
    padding: 8px 16px;
    font-weight: 650;
}
body.tema-karaman .cari-sekmeler button.aktif {
    background: #1b6b3a;
    border-color: #1b6b3a;
    color: #fff;
}

body.tema-karaman,
body.tema-karaman .shell,
body.tema-karaman .alan { max-width: 100%; min-width: 0; }
body.tema-karaman .alan,
body.tema-karaman main { overflow-x: hidden; }
body.tema-karaman main { max-width: 100%; }
body.tema-karaman .kart { max-width: 100%; }
body.tema-karaman .alan { container-type: inline-size; }
body.tema-karaman .tablo-kaydir { overflow: visible; max-width: 100%; }
body.tema-karaman .cari-tablo {
    width: 100%;
    min-width: 0;
    table-layout: auto;
}
body.tema-karaman .cari-tablo th,
body.tema-karaman .cari-tablo td {
    overflow: visible;
    white-space: normal;
    vertical-align: middle;
}
body.tema-karaman table.data .sayi,
body.tema-karaman .cari-tablo .sayi {
    white-space: nowrap;
    overflow: visible;
}
body.tema-karaman .cari-tablo td:first-child { white-space: normal; }
body.tema-karaman .cari-tablo .cari-islem { flex-wrap: wrap; justify-content: flex-end; }
body.tema-karaman .cari-tablo td .ikon-btn { width: 32px; height: 32px; margin-left: 6px; vertical-align: middle; }
body.tema-karaman .cari-tablo td:last-child,
body.tema-karaman .cari-tablo th:last-child {
    width: auto;
    overflow: visible;
}
body.tema-karaman .cari-tablo .cari-islem .ikon-btn { width: 32px; height: 32px; margin: 0; }

body.tema-karaman .cari-ozet {
    display: grid;
    grid-template-columns: minmax(160px, 1.2fr) auto auto;
    gap: 12px 20px;
    align-items: center;
}

body.tema-karaman .cari-ozet > div:first-child {
    min-width: 0;
}

body.tema-karaman .cari-ad-satir {
    display: flex;
    align-items: center;
    gap: 8px;
}

body.tema-karaman .cari-ad {
    font-size: 18px;
    font-weight: 650;
    color: #145230;
}

body.tema-karaman .ikon-btn {
    width: 38px;
    height: 38px;
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    border: 1px solid #d5e4da;
    background: #fff;
    color: #145230;
    padding: 0;
}

body.tema-karaman .ikon-btn svg { width: 20px; height: 20px; }
body.tema-karaman .ekstre-ac {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
body.tema-karaman .ekstre-ac svg { width: 18px; height: 18px; flex: 0 0 auto; }
body.tema-karaman .belge-no { display: flex; align-items: center; gap: 6px; }
body.tema-karaman .belge-no .tara { flex: 0 0 auto; width: 38px; height: 38px; }
body.tema-karaman .belge-no .tara svg { width: 18px; height: 18px; }
body.tema-karaman .foto-liste { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
body.tema-karaman .foto-liste li { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 14px; }
body.tema-karaman .fis-islem { display: flex; flex-wrap: nowrap; gap: 6px; justify-content: flex-end; align-items: center; white-space: nowrap; }
body.tema-karaman .ikon-btn:hover { background: #e7f3ea; color: #145230; }

body.tema-karaman .cari-alt-bilgi {
    margin: 4px 0 0;
    color: var(--soluk);
    font-size: 13px;
}

body.tema-karaman .cari-rakamlar {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px 18px;
}

body.tema-karaman .cari-rakamlar span {
    display: flex;
    flex-direction: column;
    font-weight: 650;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

body.tema-karaman .cari-islem {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-end;
    gap: 8px;
}

body.tema-karaman .cari-rakamlar small {
    font-weight: 500;
    color: var(--soluk);
    font-size: 11px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.tema-karaman #fis-detay-modal { z-index: 90; }
body.tema-karaman .modal-kutu { width: min(720px, 100%); margin-top: 24px; }
body.tema-karaman .ekstre-kutu { width: min(1100px, 100%); max-width: 100%; min-width: 0; }

body.tema-karaman .cari-islem a {
    display: inline-flex;
    align-items: center;
    padding: 6px 10px;
    border-radius: 999px;
    background: #e7f3ea;
    color: #145230;
    font-weight: 600;
    font-size: 13px;
}

body.tema-karaman .foto-video {
    width: min(100%, 360px);
    max-height: 240px;
    border-radius: 12px;
    background: #0e2a1c;
}

body.tema-karaman.giris-govde {
    background:
        linear-gradient(160deg, rgba(14, 42, 28, 0.88), rgba(31, 138, 138, 0.55)),
        #0e2a1c;
}

body.tema-karaman .giris-kart {
    border-radius: 20px;
    padding: 28px 28px 32px;
}

body.tema-karaman .giris-logo {
    display: block;
    width: min(100%, 320px);
    height: auto;
    margin: 0 auto;
}

body.tema-karaman .giris-kart .btn-bakir { width: 100%; }

@media (max-width: 1100px) {
    body.tema-karaman .uc,
    body.tema-karaman .iki { grid-template-columns: 1fr; }
    body.tema-karaman .ust,
    body.tema-karaman main { padding-left: 16px; padding-right: 16px; }
    body.tema-karaman .fis-baslik { flex-wrap: wrap; }
    body.tema-karaman .fis-islem { flex-wrap: wrap; white-space: normal; }
}

@media (max-width: 900px) {
    body.tema-karaman .cari-ozet { grid-template-columns: 1fr; }
    body.tema-karaman .cari-rakamlar,
    body.tema-karaman .cari-islem { justify-content: flex-start; }
}

body.tema-karaman .menu-ikon { display: none; }

@media (max-width: 860px) {
    body.tema-karaman .modal-perde {
        z-index: 80;
        align-items: end;
        padding: 12px 12px calc(88px + env(safe-area-inset-bottom));
    }
    body.tema-karaman .modal-kutu {
        width: 100%;
        max-height: calc(100vh - 120px);
        border-radius: 18px 18px 0 0;
    }
    body.tema-karaman button.olcu { touch-action: manipulation; }
    body.tema-karaman .shell { flex-direction: column; }
    body.tema-karaman .alan { padding-bottom: 92px; }
    body.tema-karaman .sidebar {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        top: auto;
        width: 100%;
        height: auto;
        z-index: 40;
        padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
        border-radius: 18px 18px 0 0;
        box-shadow: 0 -10px 28px rgba(8, 24, 16, 0.28);
        overflow: visible;
    }
    body.tema-karaman .marka-logo { display: none; }
    body.tema-karaman .sidebar nav {
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: flex-end;
        justify-content: space-between;
        gap: 0;
        overflow: visible;
    }
    body.tema-karaman .menu-ikon {
        display: block;
        width: 22px;
        height: 22px;
        margin: 0 auto 3px;
    }
    body.tema-karaman .sidebar nav > a,
    body.tema-karaman .sidebar .menu-baslik {
        flex: 1 1 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        font-size: 0;
        line-height: 1;
        padding: 6px 2px 4px;
        border-radius: 12px;
        min-width: 0;
        white-space: nowrap;
    }
    body.tema-karaman .sidebar nav a.active,
    body.tema-karaman .menu-grup.acik > .menu-baslik {
        box-shadow: none;
        background: rgba(126, 196, 140, 0.22);
        color: #fff;
    }
    body.tema-karaman .sidebar .menu-baslik::after { display: none; }
    body.tema-karaman .menu-grup { position: relative; flex: 1 1 0; min-width: 0; }
    body.tema-karaman .menu-grup.acik > .menu-alt {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    body.tema-karaman .menu-alt {
        position: absolute;
        bottom: calc(100% + 12px);
        left: 50%;
        transform: translateX(-50%);
        min-width: 160px;
        padding: 8px;
        border-radius: 14px;
        background: #123524;
        box-shadow: 0 12px 28px rgba(8, 24, 16, 0.32);
        z-index: 50;
    }
    body.tema-karaman .menu-alt a {
        font-size: 14px;
        padding: 10px 12px;
        white-space: nowrap;
    }
    body.tema-karaman .ust h1 { font-size: 22px; }
    body.tema-karaman .cari-islem { justify-content: flex-start; }
    body.tema-karaman table.data tbody { grid-template-columns: 1fr; }
}

@container (max-width: 760px) {
    .cari-tablo,
    .cari-tablo tbody,
    .cari-tablo tr,
    .cari-tablo td { display: block; width: 100%; }
    .cari-tablo { min-width: 0; }
    .cari-tablo thead { display: none; }
    .cari-tablo tr {
        padding: 8px 0 10px;
        border-bottom: 1px solid #d5e4da;
    }
    .cari-tablo td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        border: 0;
        padding: 4px 0;
        text-align: right;
    }
    .cari-tablo td::before {
        content: attr(data-etiket);
        color: #5e6f64;
        font-size: 11px;
        font-weight: 650;
        letter-spacing: 0.04em;
        text-transform: uppercase;
    }
    .cari-tablo td[data-etiket=""]::before,
    .cari-tablo td:first-child::before { content: none; }
    .cari-tablo td:first-child { text-align: left; }
    .cari-tablo .sayi { white-space: nowrap; }
    .cari-tablo td:last-child { width: auto; justify-content: flex-end; }
}

@media (max-width: 520px) {
    body.tema-karaman .ust { align-items: flex-start; }
    body.tema-karaman .oturum { margin-left: auto; }
    body.tema-karaman .giris-kart { padding: 20px 16px 24px; }
}
