html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

/* =====================================================================
   2.3 Aktarım Ayarları — ortak arayüz sistemi (AfSection · AfPanel · af-grid)
   Not: bölüm/panel bileşenleri ayrı dosyalarda olduğu için bu stiller
   sayfa bazlı (scoped) değil, GLOBAL tutulur.
   ===================================================================== */

/* Durum şeridi: sayfa üstünde yapışkan kalır */
.af-sticky-alert {
    position: sticky;
    top: .5rem;
    z-index: 1030;
    box-shadow: 0 .25rem .6rem rgba(0, 0, 0, .08);
}

/* 2.3 alt adım sekmeleri (2.3.1 · 2.3.2 · 2.3.3) */
.af-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.af-tab {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .3rem .7rem;
    border: 1px solid #dee2e6;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 600;
    text-decoration: none;
    color: #495057;
    background: #fff;
}

.af-tab:hover {
    background: #f1f3f5;
    color: #212529;
}

.af-tab.active {
    background: #0d6efd;
    border-color: #0d6efd;
    color: #fff;
    box-shadow: 0 .15rem .4rem rgba(13, 110, 253, .3);
}

/* Ana bölüm başlık tonları: bölümler birbirine girmiş görünmesin */
.af-head-primary { background: #eef3ff !important; }
.af-head-info    { background: #e9f8fb !important; }
.af-head-warning { background: #fff7e6 !important; }
.af-head-success { background: #ecfaf1 !important; }

/* ---- Alt bölüm (panel) zeminleri: hangi bölümde olduğunuz belli olsun ---- */

.af-sub {
    border: 1px solid rgba(0, 0, 0, .07);
    border-radius: .6rem;
    padding: .85rem .95rem;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .35);
}

.af-sub-head {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    font-weight: 700;
    font-size: .95rem;
    margin-bottom: .6rem;
    padding-bottom: .45rem;
    border-bottom: 1px dashed rgba(0, 0, 0, .12);
}

.af-sub-head:hover {
    filter: brightness(.985);
}

.af-sub-head .af-step {
    font-size: .72rem;
}

/* Öğrenme Atölyesi alt bölümleri */
.af-sub-sql  { background: #eef4ff; border-color: #c9dcff; }
.af-sub-json { background: #fff8e6; border-color: #ffe6ad; }
.af-sub-live { background: #ecfaf1; border-color: #c3eed5; }
.af-sub-csv  { background: #f5f0ff; border-color: #ddd0ff; }
.af-sub-xml  { background: #ebf7fb; border-color: #c4e5f2; }

/* Düzenleyici alt bölümleri */
.af-sub-kunye  { background: #f6f8fb; border-color: #dbe4f0; }
.af-sub-esleme { background: #fffaf0; border-color: #ffe9c2; }
.af-sub-param  { background: #f4f1fb; border-color: #ded4f5; }
.af-sub-alan   { background: #eefaf5; border-color: #c6ebdd; }

/* Panel içindeki ızgara/kart kutuları zemini bozmasın */
.af-sub .af-grid-wrap,
.af-sub .card {
    background: rgba(255, 255, 255, .75);
}

/* ---- Ortak bölüm paneli (AfSection) ------------------------------------- */

.af-section-header {
    border-bottom: 1px solid rgba(0, 0, 0, .075);
}

.af-clickable {
    cursor: pointer;
}

/* Başlık: numara rozeti + renkli vurgu */
.af-step {
    min-width: 1.9rem;
    font-size: .78rem;
}

.af-section-body {
    padding-top: .9rem;
}

/* ---- Izgara sistemi: tek satır, gerekirse YATAY kaydırma (responsive) ---- */

.af-grid-wrap {
    overflow-x: auto;
    overflow-y: hidden;
    border: 1px solid rgba(0, 0, 0, .075);
    border-radius: .5rem;
    background: #fff;
}

.af-grid {
    margin-bottom: 0;
    width: 100%;
}

.af-grid > :not(caption) > * > * {
    padding: .35rem .4rem;
    vertical-align: middle;
    white-space: nowrap;
}

.af-grid thead th {
    font-size: .78rem;
    font-weight: 600;
    color: #6c757d;
    background: #f8f9fa;
    border-bottom: 1px solid rgba(0, 0, 0, .125);
    position: sticky;
    top: 0;
    z-index: 2;
}

.af-grid tbody tr:hover {
    background: #fffdf5;
}

.af-grid td .form-control,
.af-grid td .form-select {
    min-width: 6.5rem;
}

/* Alan (kolon) genişlikleri: satır tek satırda kalır */
.af-col-xs { min-width: 5rem; }
.af-col-sm { min-width: 8.5rem; }
.af-col-md { min-width: 12rem; }
.af-col-lg { min-width: 16rem; }
.af-col-actions { min-width: 3.2rem; }

/* Şema alan ızgarası çok geniş: dar ekranda yatay kaydırılır */
.af-grid-wrap .af-grid {
    min-width: 60rem;
}

/* Alanlar ızgarası 13 kolon; yatay kaydırma eşiği daha yüksek */
.af-grid-wrap:has(table.af-grid thead th:nth-child(13)) .af-grid {
    min-width: 92rem;
}

/* =====================================================================
   Bekleme (kum saati) göstergesi — 2.1 / 2.2 sınamaları
   Kural: uzun süren işlemlerde arka plan KARARTILMAZ ve BLUR EDİLMEZ
   (backdrop-filter kullanılmaz). Yalnız imleç kum saatine döner ve
   satır içi spinner (spinner-border) gösterilir; sayfa okunabilir kalır.
   ===================================================================== */

.af-busy,
.af-busy * {
    cursor: wait !important;
}

/* 2.2 «Servis Komutları» tablosu: uzun adres/ayrıntı metinleri satırı bozmasın */
.af-cmd-table {
    table-layout: auto;
}

    .af-cmd-table td,
    .af-cmd-table th {
        vertical-align: middle;
    }

    .af-cmd-table td .badge {
        font-weight: 500;
    }

/* =====================================================================
   Asena / AsFlow marka kimliği — 3D logo, zemin dokusu ve açılış ekranı
   Palet: lacivert #0A1230 / #132A6B · mavi #2A63FF · kırmızı #E81C12
   ===================================================================== */
:root {
    --af-navy-900: #050A1F;
    --af-navy-800: #0A1230;
    --af-navy-700: #16265C;
    --af-blue: #2A63FF;
    --af-blue-soft: #9FC3FF;
    --af-red: #E81C12;
    --af-ice: #DCE9FF;
}

/* 1) Marka logoları (kare ölçülü 3D amblem) */
.af-login-logo {
    width: 96px;
    height: 96px;
    object-fit: contain;
    margin-bottom: 0.35rem;
    /* Açık kart üzerinde sade, nötr zemin gölgesi (renkli hale kullanılmaz) */
    filter: drop-shadow(0 10px 20px rgba(5, 10, 31, 0.30));
    animation: afLogoRise 900ms cubic-bezier(0.2, 0.9, 0.25, 1) both;
}

@keyframes afLogoRise {
    from {
        opacity: 0;
        transform: translateY(14px) scale(0.94);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

/* 2) Ana ekran (dashboard) zemini: açık metalik yüzey + ince devre ızgarası + marka parıltıları */
.af-main-bg {
    position: relative;
    background-color: #f3f5fb;
    background-image:
        repeating-linear-gradient(0deg, rgba(19, 42, 107, 0.035) 0 1px, transparent 1px 46px),
        repeating-linear-gradient(90deg, rgba(19, 42, 107, 0.035) 0 1px, transparent 1px 46px),
        radial-gradient(780px 420px at 88% -10%, rgba(42, 99, 255, 0.14), transparent 70%),
        radial-gradient(620px 380px at -8% 110%, rgba(232, 28, 18, 0.10), transparent 72%),
        linear-gradient(180deg, #fbfcff 0%, #eef1f9 55%, #e8ecf7 100%);
    background-attachment: fixed;
}

/* 3) Giriş (login) ekranı zemini: koyu metalik VIP yüzeyi */
.af-login-bg {
    position: relative;
    overflow: hidden;
    background-color: var(--af-navy-900);
    background-image:
        repeating-linear-gradient(0deg, rgba(220, 233, 255, 0.055) 0 1px, transparent 1px 54px),
        repeating-linear-gradient(90deg, rgba(220, 233, 255, 0.055) 0 1px, transparent 1px 54px),
        radial-gradient(900px 520px at 12% 6%, rgba(42, 99, 255, 0.30), transparent 68%),
        radial-gradient(760px 520px at 88% 96%, rgba(232, 28, 18, 0.24), transparent 70%),
        linear-gradient(150deg, #16265C 0%, #0A1230 46%, #050A1F 100%);
    background-attachment: fixed;
}

/* 4) Zemin kabartması (watermark): 3D logo, yavaş nefes alma */
.asena-bg-container {
    position: relative;
    min-height: 100%;
    overflow: hidden;
}

.asena-watermark {
    position: fixed;
    top: 56%;
    left: 62%;
    transform: translate(-50%, -50%);
    /* Marka zeminde büyük dursun: eskiden 430px (40vw) idi, kart içeriğinden
       çok küçük görünüyordu. Kartlar tam opak olduğu için okunabilirlik bozulmaz. */
    width: min(720px, 58vw);
    height: auto;
    pointer-events: none;
    user-select: none;
    z-index: 0;
    opacity: 0.07;
    /* açık zeminde oyulmuş/kabartma hissi */
    mix-blend-mode: multiply;
    animation: asenaBreathe 11s ease-in-out infinite;
}

/* Giriş (login) ekranı: koyu zeminde ışıklı filigran */
.asena-watermark-login {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: min(420px, 62vw);
    height: auto;
    pointer-events: none;
    user-select: none;
    z-index: 0;
    opacity: 0.16;
    filter: drop-shadow(0 26px 52px rgba(0, 0, 0, 0.55));
    animation: asenaBreatheLogin 12s ease-in-out infinite;
}

@keyframes asenaBreathe {
    0%, 100% {
        transform: translate(-50%, -50%) scale(1) translateY(0px);
        opacity: 0.06;
    }

    50% {
        transform: translate(-50%, -50%) scale(1.015) translateY(-6px);
        opacity: 0.10;
    }
}

@keyframes asenaBreatheLogin {
    0%, 100% {
        transform: translate(-50%, -50%) scale(1) translateY(0px);
        opacity: 0.13;
    }

    50% {
        transform: translate(-50%, -50%) scale(1.02) translateY(-8px);
        opacity: 0.21;
    }
}

.content-relative {
    position: relative;
    z-index: 1;
}

/* =====================================================================
   Açılış (splash) ekranı — App.razor içindeki #af-splash
   Animasyon bitince kendiliğinden söner; JS kaydı temizler.
   ===================================================================== */
#af-splash {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background-color: var(--af-navy-900);
    background-image:
        repeating-linear-gradient(0deg, rgba(220, 233, 255, 0.05) 0 1px, transparent 1px 52px),
        repeating-linear-gradient(90deg, rgba(220, 233, 255, 0.05) 0 1px, transparent 1px 52px),
        radial-gradient(820px 520px at 22% 12%, rgba(42, 99, 255, 0.34), transparent 66%),
        radial-gradient(680px 480px at 82% 92%, rgba(232, 28, 18, 0.26), transparent 70%),
        linear-gradient(155deg, #16265C 0%, #0A1230 48%, #04081B 100%);
    animation: afSplashOut 620ms ease 1700ms forwards;
}

#af-splash.af-splash-hide {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 600ms ease, visibility 0s linear 600ms;
}

.af-splash-glow {
    position: absolute;
    width: min(780px, 92vw);
    height: min(780px, 92vw);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(42, 99, 255, 0.30), rgba(232, 28, 18, 0.10) 58%, transparent 74%);
    animation: afSplashGlow 2.8s ease-in-out infinite;
}

.af-splash-inner {
    position: relative;
    z-index: 1;
    text-align: center;
    padding: 0 1rem;
}

.af-splash-logo {
    width: min(184px, 36vw);
    height: auto;
    filter: drop-shadow(0 22px 42px rgba(0, 0, 0, 0.62)) drop-shadow(0 0 28px rgba(42, 99, 255, 0.45));
    animation: afSplashLogo 1100ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.af-splash-brand {
    margin-top: 0.85rem;
    font-size: 2.15rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    line-height: 1.1;
    background: linear-gradient(92deg, #ffffff 10%, var(--af-blue-soft) 46%, #ffffff 82%);
    -webkit-background-clip: text;
    background-clip: text;
    color: #fff;
    -webkit-text-fill-color: transparent;
    animation: afSplashBrand 1200ms ease 140ms both;
}

.af-splash-sub {
    margin-top: 0.4rem;
    font-size: 0.8rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: rgba(220, 233, 255, 0.72);
    animation: afSplashBrand 1200ms ease 280ms both;
}

.af-splash-bar {
    position: relative;
    width: min(210px, 52vw);
    height: 3px;
    margin: 1.5rem auto 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.14);
    overflow: hidden;
}

    .af-splash-bar span {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        width: 0;
        border-radius: 999px;
        background: linear-gradient(90deg, var(--af-blue), var(--af-blue-soft) 55%, var(--af-red));
        box-shadow: 0 0 14px rgba(42, 99, 255, 0.75);
        animation: afSplashBar 1450ms ease-out 150ms forwards;
    }

@keyframes afSplashLogo {
    from {
        opacity: 0;
        transform: translateY(26px) scale(0.82);
        filter: blur(6px);
    }

    to {
        opacity: 1;
        transform: none;
        filter: blur(0);
    }
}

@keyframes afSplashBrand {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes afSplashBar {
    from {
        width: 0;
    }

    to {
        width: 100%;
    }
}

@keyframes afSplashGlow {
    0%, 100% {
        transform: scale(1);
        opacity: 0.8;
    }

    50% {
        transform: scale(1.06);
        opacity: 1;
    }
}

@keyframes afSplashOut {
    to {
        opacity: 0;
        visibility: hidden;
    }
}

/* Hareket azaltma tercihinde tüm marka animasyonları durur */
@media (prefers-reduced-motion: reduce) {
    #af-splash,
    .asena-watermark,
    .asena-watermark-login,
    .af-login-logo,
    .af-splash-logo,
    .af-splash-brand,
    .af-splash-sub,
    .af-splash-bar span,
    .af-splash-glow {
        animation: none !important;
    }
}


/* ============================================================================
   GENEL DURUM — ENTEGRASYON LİSTESİ (satır bazlı aktarım + aktarım bandı)
   Bileşen: Components/Common/AfEntegrasyonListesi.razor
   ========================================================================== */

.af-liste-ust {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

/* Veri tipi grup şeridi: satırlar sıkışmasın, gruplar belirgin olsun */
.af-grup {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 1rem 0 0.5rem;
    padding: 0.35rem 0.75rem;
    background: linear-gradient(90deg, #101b3a, #1d2b52 70%, #26365f);
    color: #e9eefb;
    border-radius: 8px;
    font-size: 0.82rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.af-grup-ad { font-weight: 700; }

.af-grup-adet {
    background: rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    padding: 0 0.5rem;
    font-size: 0.75rem;
}

/* Tek entegrasyon satırı: iki katmanlı, rahat okunur kart */
.af-kopru {
    background: #ffffff;
    border: 1px solid #e3e8f2;
    border-left: 4px solid #4f7cf7;
    border-radius: 10px;
    padding: 0.75rem 0.9rem;
    margin-bottom: 0.6rem;
    box-shadow: 0 1px 3px rgba(16, 27, 58, 0.07);
    transition: box-shadow 0.15s ease;
}

.af-kopru:hover { box-shadow: 0 4px 14px rgba(16, 27, 58, 0.12); }

/* Aktarım süren satır vurgulanır */
.af-kopru-aktif {
    border-left-color: #12b886;
    background: #f6fffb;
    animation: afKopruNefes 2.4s ease-in-out infinite;
}

@keyframes afKopruNefes {
    0%, 100% { box-shadow: 0 0 0 0 rgba(18, 184, 134, 0.35); }
    50%      { box-shadow: 0 0 0 6px rgba(18, 184, 134, 0.06); }
}

.af-kopru-ust {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.af-kopru-kunye { min-width: 0; }

.af-kopru-ad {
    font-weight: 700;
    color: #101b3a;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.af-kopru-kod {
    font-family: Consolas, monospace;
    font-size: 0.75rem;
    color: #5a6b8c;
    background: #f1f4fb;
    border-radius: 5px;
    padding: 0.05rem 0.35rem;
}

.af-kopru-yol {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.3rem;
    font-size: 0.82rem;
}

.af-kopru-ok { color: #8b99b5; }

.af-kopru-son {
    margin-top: 0.4rem;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
    font-size: 0.78rem;
}

.af-son-mesaj { color: #5a6b8c; }

.af-kopru-aksiyon {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
}

/* Künye rozetleri */
.af-chip,
.af-chip-src,
.af-chip-dst,
.af-chip-tip {
    border-radius: 999px;
    padding: 0.08rem 0.5rem;
    font-size: 0.74rem;
    border: 1px solid #dbe2f0;
    background: #f7f9fd;
    color: #33415c;
}

.af-chip-src { background: #eef4ff; border-color: #c9dcff; }
.af-chip-dst { background: #fff3e6; border-color: #ffd9ad; }
.af-chip-tip { background: #eafaf4; border-color: #c2ecdc; }
.af-chip-aktif { background: #e8fbf1; border-color: #b9ebd2; color: #0b7a4b; }
.af-chip-pasif { background: #f3f4f6; border-color: #dcdfe6; color: #6b7280; }

.af-log-badge {
    border-radius: 6px;
    padding: 0.08rem 0.45rem;
    font-size: 0.74rem;
    border: 1px solid transparent;
    text-decoration: none;
}

.af-log-ok   { background: #e8fbf1; color: #0b7a4b; border-color: #b9ebd2; }
.af-log-hata { background: #fdecec; color: #a52121; border-color: #f5c2c2; }
.af-log-bos  { background: #f3f4f6; color: #6b7280; border-color: #dcdfe6; }
.af-log-bekle { background: #fff7e6; color: #8a5a00; border-color: #ffe2ad; }

/* ⋯ popup menüsü */
.af-menu-kap { position: relative; }

.af-menu-panel {
    position: absolute;
    right: 0;
    top: calc(100% + 4px);
    z-index: 30;
    min-width: 15rem;
    background: #ffffff;
    border: 1px solid #dbe2f0;
    border-radius: 8px;
    box-shadow: 0 10px 28px rgba(16, 27, 58, 0.18);
    padding: 0.3rem;
    display: flex;
    flex-direction: column;
}

.af-menu-item {
    border: 0;
    background: transparent;
    text-align: left;
    padding: 0.4rem 0.55rem;
    border-radius: 6px;
    font-size: 0.85rem;
    color: #22314f;
    white-space: nowrap;
}

.af-menu-item:hover { background: #eef3ff; }


/* ---- Aktarım bandı: entegrasyon "akarken" satırın altında belge akışı gösterir ---- */
.af-bant {
    position: relative;
    margin-top: 0.6rem;
    border-radius: 8px;
    overflow: hidden;
    background: #0f2f4f;
    border: 1px solid #0b2540;
}

/* Akan çizgili zemin: belgelerin aktığını görsel olarak anlatır */
.af-bant-akan {
    position: absolute;
    inset: 0;
    background-image: repeating-linear-gradient(
        115deg,
        rgba(255, 255, 255, 0.10) 0px,
        rgba(255, 255, 255, 0.10) 14px,
        rgba(255, 255, 255, 0.02) 14px,
        rgba(255, 255, 255, 0.02) 28px);
    background-size: 200% 100%;
    animation: afBantAkis 0.9s linear infinite;
    pointer-events: none;
}

@keyframes afBantAkis {
    from { background-position: 0 0; }
    to   { background-position: 120px 0; }
}

.af-bant-icerik {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.45rem 0.7rem;
    color: #e6f1ff;
    font-size: 0.82rem;
}

.af-bant-mod {
    font-weight: 700;
    letter-spacing: 0.08em;
    background: #12b886;
    color: #04231a;
    border-radius: 4px;
    padding: 0.05rem 0.4rem;
    font-size: 0.72rem;
}

.af-bant-sayac {
    background: rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    padding: 0.05rem 0.5rem;
    font-size: 0.76rem;
    white-space: nowrap;
}

.af-bant-son {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #cfe3ff;
    font-family: Consolas, monospace;
    font-size: 0.78rem;
}

.af-bant-ozet {
    margin-top: 0.55rem;
    border-radius: 8px;
    padding: 0.4rem 0.7rem;
    font-size: 0.82rem;
}

.af-ozet-ok   { background: #e8fbf1; border: 1px solid #b9ebd2; color: #0b7a4b; }
.af-ozet-hata { background: #fdecec; border: 1px solid #f5c2c2; color: #a52121; }

/* Bu oturumda akan günlük satırları */
.af-canli-log {
    margin-top: 0.5rem;
    max-height: 220px;
    overflow-y: auto;
    background: #0f172a;
    color: #e2e8f0;
    border-radius: 8px;
    padding: 0.6rem 0.8rem;
    font-family: Consolas, "Courier New", monospace;
    font-size: 0.76rem;
    line-height: 1.45;
    white-space: pre-wrap;
}

/* ---- Parametre popup'ı (satır üstünde ortalı, kaydırılabilir) ---- */
.af-popup-arka {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: rgba(10, 18, 48, 0.55);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 3rem 1rem;
    overflow-y: auto;
}

.af-popup {
    width: 100%;
    max-width: 900px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 24px 60px rgba(6, 14, 36, 0.45);
    border: 1px solid #dbe2f0;
    overflow: hidden;
}

.af-popup-ust {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: 0.9rem 1.1rem;
    background: linear-gradient(90deg, #101b3a, #22335e);
    color: #eaf0ff;
}

.af-popup-baslik { font-weight: 700; }

.af-popup-alt {
    font-size: 0.78rem;
    color: #b9c7e6;
}

.af-popup-govde {
    padding: 1rem 1.1rem;
    max-height: 62vh;
    overflow-y: auto;
}

.af-popup-subeler {
    margin-top: 0.4rem;
    max-height: 160px;
    overflow-y: auto;
    border: 1px solid #e6eaf3;
    border-radius: 8px;
    padding: 0.5rem 0.7rem;
    background: #fafbff;
}

.af-popup-alt-panel {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.1rem;
    border-top: 1px solid #e6eaf3;
    background: #f7f9fd;
}

/* Hareket azaltma tercihinde bant/menü animasyonları durur */
@media (prefers-reduced-motion: reduce) {
    .af-bant-akan,
    .af-kopru-aktif {
        animation: none !important;
    }
}