/* ═══════════════════════════════════════════════════
   Yeni tasarım "A" (kullanıcı, 04.11.2026: "A yapısı güzel, menünün solda olması iyi").
   style.css'in üstüne yüklenir: düzen (solda gruplu menü, üstte başlık + ekip + ay, telefonda alt menü),
   sade yüzeyler (cam efekti, degrade ve parlama yok), açık tema varsayılan, koyu tema isteğe bağlı.
   Renkler değişkenlerle: sayfalardaki satır içi stiller (var(--…)) iki temada da doğru renge döner.
   ═══════════════════════════════════════════════════ */

/* ─── Renkler: açık (varsayılan) ─── */
[data-theme="light"] {
    --ink: 17, 24, 39;
    --shade: 91, 100, 114;
    --header-bg: #f5f6f8;

    --bg-primary: #f5f6f8;
    --bg-secondary: #ffffff;
    --bg-card: #ffffff;
    --bg-card-hover: #ffffff;
    --bg-glass: #f8f9fb;
    --bg-glass-hover: #f1f3f6;

    --border-color: #e3e6eb;
    --border-light: #d5dae1;
    --border-accent: rgba(36, 66, 201, 0.35);
    --cizgi-satir: #eef0f3;

    --text-primary: #111827;
    --text-secondary: #374151;
    --text-muted: #5b6472;
    --text-accent: #2442c9;

    --accent-indigo: #2442c9;
    --accent-indigo-light: #2442c9;
    --accent-violet: #6d3fc4;
    --accent-violet-light: #6d3fc4;
    --accent-emerald: #0f7a45;
    --accent-emerald-light: #0f7a45;
    --accent-rose: #b42318;
    --accent-rose-light: #b42318;
    --accent-amber: #a15c00;
    --accent-amber-light: #a15c00;
    --accent-cyan: #0b5f73;
    --accent-sky: #0b5f73;

    --gradient-primary: linear-gradient(#2442c9, #2442c9);
    --gradient-success: linear-gradient(#0f7a45, #0f7a45);
    --gradient-warning: linear-gradient(#a15c00, #a15c00);
    --gradient-danger: linear-gradient(#b42318, #b42318);
    --gradient-bg: #f5f6f8;

    --shadow-sm: 0 1px 2px rgba(17, 24, 39, 0.06);
    --shadow-md: 0 2px 6px rgba(17, 24, 39, 0.08);
    --shadow-lg: 0 8px 20px rgba(17, 24, 39, 0.10);
    --shadow-xl: 0 16px 40px rgba(17, 24, 39, 0.16);
    --shadow-glow: none;

    --secili-zemin: #eef2ff;
    --uzerinde-zemin: #f1f3f6;
    --dugme-grubu-zemin: #e9ecf1;
    --birincil-koyu: #1a3299;

    --rozet-gri-zemin: #f1f3f6;   --rozet-gri: #374151;
    --rozet-mavi-zemin: #eaf0ff;  --rozet-mavi: #2440b3;
    --rozet-yesil-zemin: #e6f6ee; --rozet-yesil: #0f6b3e;
    --rozet-sari-zemin: #fff4e0;  --rozet-sari: #7a4300;
    --rozet-kirmizi-zemin: #fdecec; --rozet-kirmizi: #a12121;
    --rozet-camgobegi-zemin: #e6f4f8; --rozet-camgobegi: #0b5f73;
}

/* ─── Renkler: koyu ─── */
[data-theme="dark"] {
    --ink: 230, 234, 240;
    --shade: 0, 0, 0;
    --header-bg: #0f141c;

    --bg-primary: #0f141c;
    --bg-secondary: #161c26;
    --bg-card: #161c26;
    --bg-card-hover: #1b2230;
    --bg-glass: #1b2230;
    --bg-glass-hover: #212938;

    --border-color: #273041;
    --border-light: #323d52;
    --border-accent: rgba(124, 147, 255, 0.4);
    --cizgi-satir: #1f2735;

    --text-primary: #e6eaf0;
    --text-secondary: #c2cad6;
    --text-muted: #9aa4b5;
    --text-accent: #9db0ff;

    --accent-indigo: #3b5bdb;
    --accent-indigo-light: #9db0ff;
    --accent-violet: #8b6ee8;
    --accent-violet-light: #b9a5ff;
    --accent-emerald: #34c47c;
    --accent-emerald-light: #5ad69a;
    --accent-rose: #f26d6d;
    --accent-rose-light: #ff8f8f;
    --accent-amber: #e0a43a;
    --accent-amber-light: #f5bf5f;
    --accent-cyan: #4fc3dc;
    --accent-sky: #4fc3dc;

    --gradient-primary: linear-gradient(#3b5bdb, #3b5bdb);
    --gradient-success: linear-gradient(#1f8f57, #1f8f57);
    --gradient-warning: linear-gradient(#b7791f, #b7791f);
    --gradient-danger: linear-gradient(#c53030, #c53030);
    --gradient-bg: #0f141c;

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 2px 6px rgba(0, 0, 0, 0.45);
    --shadow-lg: 0 8px 20px rgba(0, 0, 0, 0.5);
    --shadow-xl: 0 16px 40px rgba(0, 0, 0, 0.6);
    --shadow-glow: none;

    --secili-zemin: rgba(124, 147, 255, 0.14);
    --uzerinde-zemin: #1b2230;
    --dugme-grubu-zemin: #0b1017;
    --birincil-koyu: #3150c8;

    --rozet-gri-zemin: #232b3a;   --rozet-gri: #c2cad6;
    --rozet-mavi-zemin: rgba(124, 147, 255, 0.16);  --rozet-mavi: #a9bbff;
    --rozet-yesil-zemin: rgba(52, 196, 124, 0.16); --rozet-yesil: #6fdca5;
    --rozet-sari-zemin: rgba(224, 164, 58, 0.16);  --rozet-sari: #f5c46b;
    --rozet-kirmizi-zemin: rgba(242, 109, 109, 0.16); --rozet-kirmizi: #ff9b9b;
    --rozet-camgobegi-zemin: rgba(79, 195, 220, 0.16); --rozet-camgobegi: #7fd6e8;
}

/* ─── Zemin ─── */
body {
    background: var(--bg-primary);
    line-height: 1.5;
}

body::before {
    display: none;
}

.ikon {
    width: 18px;
    height: 18px;
    flex: none;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.gizli-etiket {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* ─── Düzen: solda menü, sağda sayfa ─── */
/* z-index verilmez: telefonda açılan menü alttaki kısa menünün üstünde kalabilsin */
.uygulama {
    display: flex;
    min-height: 100vh;
    position: relative;
}

.uygulama-govde {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.yan-menu {
    flex: 0 0 240px;
    width: 240px;
    box-sizing: border-box;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    padding: 20px 14px 16px;
    background: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    gap: 22px;
    z-index: 120;
}

.yan-menu .logo {
    padding: 0 8px;
    gap: 10px;
}

.yan-menu .logo-icon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: var(--accent-indigo);
    color: #ffffff;
    font-weight: 700;
    font-size: 15px;
    box-shadow: none;
}

.logo-yazi {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}

[data-theme] .yan-menu .logo-text {
    display: block;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.02em;
    background: none;
    -webkit-text-fill-color: currentColor;
    color: var(--text-primary);
}

.logo-alt {
    font-size: 11px;
    color: var(--text-muted);
}

/* order: style.css dar pencerede eski sekme şeridini order: 3 ile alta itiyordu */
.yan-menu .nav-tabs {
    order: 0;
    display: flex;
    flex-direction: column;
    flex: none;
    gap: 2px;
    padding: 0;
    background: none;
    border: 0;
    border-radius: 0;
    overflow: visible;
    max-width: none;
    width: auto;
}

.menu-grup {
    font-size: 11px;
    font-weight: 600;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 16px 10px 6px;
}

.menu-grup:first-child {
    padding-top: 0;
}

[data-theme] .yan-menu .nav-tab,
[data-theme] .yan-menu .tool-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border-radius: 8px;
    color: var(--text-secondary);
    font-size: 14px;
    font-weight: 500;
    text-align: left;
    text-decoration: none;
    box-shadow: none;
    background: transparent;
}

[data-theme] .yan-menu .nav-tab .ikon,
[data-theme] .yan-menu .tool-btn .ikon {
    color: var(--text-muted);
}

[data-theme] .yan-menu .nav-tab:hover,
[data-theme] .yan-menu .tool-btn:hover {
    background: var(--uzerinde-zemin);
    color: var(--text-primary);
}

[data-theme] .yan-menu .nav-tab.active {
    background: var(--secili-zemin);
    color: var(--text-accent);
    font-weight: 600;
}

[data-theme] .yan-menu .nav-tab.active .ikon {
    color: var(--text-accent);
}

.yan-menu .tool-label {
    display: inline;
}

#alertsCountBadge {
    margin-left: auto;
    background: var(--accent-rose);
    color: #ffffff;
    border: 0;
    border-radius: 10px;
    padding: 1px 7px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0;
}

.yan-araclar {
    order: 1;
    margin-top: auto;
    margin-left: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    padding: 12px 0 0;
    background: none;
    border: 0;
    border-top: 1px solid var(--border-color);
    border-radius: 0;
}

.menu-perde {
    display: none;
}

/* ─── Üst bar: sayfa başlığı, ekip, ay, tema ─── */
.app-header.ust-bar {
    position: sticky;
    top: 0;
    z-index: 100;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px 16px;
    padding: 22px 32px 14px;
    background: var(--bg-primary);
    border-bottom: 0;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.sayfa-basligi {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.sayfa-basligi h1 {
    margin: 0;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--text-primary);
    line-height: 1.2;
}

#sayfaAltBaslik {
    color: var(--text-muted);
    font-size: 14px;
    min-height: 1.4em;
}

.ust-bar .header-actions {
    flex: 0 1 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.ust-bar .team-filter-wrapper,
.ust-bar .month-filter-wrapper {
    flex: 0 0 auto;
    padding: 0;
    background: none;
    border: 0;
}

body.ekipsiz-sayfa .ust-bar .team-filter-wrapper {
    display: none;
}

.ekip-dugmeleri {
    display: flex;
    gap: 2px;
    padding: 3px;
    border-radius: 10px;
    background: var(--dugme-grubu-zemin);
}

.ekip-dugmeleri button {
    border: 0;
    border-radius: 8px;
    min-height: 36px;
    padding: 0 14px;
    background: transparent;
    color: var(--text-secondary);
    font: inherit;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
}

.ekip-dugmeleri button:hover {
    color: var(--text-primary);
}

.ekip-dugmeleri button.secili {
    background: var(--bg-secondary);
    color: var(--text-primary);
    font-weight: 600;
    box-shadow: var(--shadow-sm);
}

.ekip-secim {
    display: none;
}

.ust-bar .month-filter-wrapper {
    display: flex;
    align-items: center;
    gap: 6px;
    min-height: 42px;
    padding: 0 4px 0 12px;
    border: 1px solid var(--border-light);
    border-radius: 10px;
    background: var(--bg-secondary);
    color: var(--text-secondary);
    cursor: pointer;
}

.ust-bar select.form-control {
    border: 0;
    background-color: transparent;
    box-shadow: none;
    min-height: 38px;
    padding: 0 28px 0 2px;
    font-weight: 500;
    color: var(--text-primary);
    max-width: none;
}

.ust-bar select.form-control:focus {
    box-shadow: none;
}

[data-theme] .tema-dugmesi {
    width: 44px;
    height: 44px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border-light);
    border-radius: 10px;
    background: var(--bg-secondary);
    color: var(--text-secondary);
}

[data-theme="light"] .tema-gunes,
[data-theme="dark"] .tema-ay {
    display: none;
}

/* ─── Sayfa alanı ─── */
.main-content {
    max-width: none;
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: 6px 32px 48px;
}

.tab-panel {
    animation: none;
}

/* Sayfanın adı artık üst barda; şirket özetinin kendi büyük başlığı tekrar olmasın */
#panel-dashboard > h1:first-child {
    display: none;
}

/* ─── Özet kutuları ─── */
.stats-grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 14px;
    margin-bottom: 20px;
}

.stat-card {
    background: var(--bg-card);
    backdrop-filter: none;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    padding: 16px 18px;
    box-shadow: none;
}

.stat-card::before {
    display: none;
}

.stat-card:hover {
    transform: none;
    box-shadow: none;
    border-color: var(--border-color);
}

.stat-label {
    font-size: 13px;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    color: var(--text-muted);
    margin-bottom: 6px;
}

.stat-value {
    font-size: 26px;
    font-weight: 700;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
}

.stat-card.indigo .stat-value,
.stat-card.cyan .stat-value,
.stat-card.violet .stat-value,
#stat-total-volume {
    color: var(--text-primary);
}

.stat-card.emerald .stat-value,
#stat-total-moneyIn {
    color: var(--accent-emerald);
}

.stat-card.rose .stat-value {
    color: var(--accent-rose);
}

.stat-card.amber .stat-value {
    color: var(--accent-amber);
}

/* ─── Kartlar ─── */
.card {
    background: var(--bg-card);
    backdrop-filter: none;
    border: 1px solid var(--border-color);
    border-radius: 12px;
    box-shadow: none;
    margin-bottom: 20px;
}

.card-header {
    padding: 14px 18px;
    border-bottom: 1px solid var(--border-color);
}

.card-title {
    font-size: 15px;
    font-weight: 600;
    color: var(--text-primary);
}

.card-title .icon {
    display: none;
}

.card-body {
    padding: 16px 18px;
}

.hakedis-person-card,
.dist-item {
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    box-shadow: none;
}

.hakedis-person-card:hover {
    transform: none;
    box-shadow: var(--shadow-md);
}

/* ─── Düğmeler ─── */
.btn {
    border-radius: 10px;
    min-height: 40px;
    padding: 0 16px;
    font-size: 14px;
    font-weight: 600;
    box-shadow: none;
}

.btn:hover {
    transform: none;
}

.btn-primary {
    background: var(--accent-indigo);
    color: #ffffff;
    box-shadow: none;
}

.btn-primary:hover {
    background: var(--birincil-koyu);
    box-shadow: none;
}

.btn-success {
    background: var(--accent-emerald);
    color: #ffffff;
    box-shadow: none;
}

[data-theme="dark"] .btn-success {
    background: #1f8f57;
}

.btn-success:hover {
    box-shadow: none;
    filter: brightness(0.94);
}

/* Liste üstündeki Excel düğmesi ikincil iş: çerçeveli */
.action-row .btn-success {
    background: var(--bg-secondary);
    color: var(--text-primary);
    border: 1px solid var(--border-light);
}

.action-row .btn-success:hover {
    background: var(--uzerinde-zemin);
    filter: none;
}

.btn-secondary,
.btn-ghost {
    background: var(--bg-secondary);
    color: var(--text-primary);
    border: 1px solid var(--border-light);
    box-shadow: none;
}

.btn-secondary:hover,
.btn-ghost:hover {
    background: var(--uzerinde-zemin);
    color: var(--text-primary);
}

.btn-danger {
    background: transparent;
    color: var(--accent-rose);
    border: 1px solid var(--border-light);
    min-height: 36px;
    padding: 0 12px;
}

.btn-danger:hover {
    background: var(--rozet-kirmizi-zemin);
    border-color: var(--accent-rose);
}

/* Satırlardaki küçük simge düğmeleri: çerçevesiz */
.btn-icon,
.btn-ghost.btn-icon,
.btn-danger.btn-icon {
    width: 36px;
    height: 36px;
    min-height: 36px;
    padding: 0;
    border: 0;
    background: transparent;
    border-radius: 8px;
}

.btn-icon:hover {
    background: var(--uzerinde-zemin);
}

.btn-danger.btn-icon:hover {
    background: var(--rozet-kirmizi-zemin);
}

.pulse {
    animation: none;
}

/* ─── Form alanları ─── */
.form-control {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: 10px;
    color: var(--text-primary);
    min-height: 40px;
    box-shadow: none;
}

.form-control:focus {
    border-color: var(--accent-indigo);
    box-shadow: 0 0 0 3px rgba(36, 66, 201, 0.15);
}

[data-theme="dark"] .form-control:focus {
    box-shadow: 0 0 0 3px rgba(124, 147, 255, 0.2);
}

.form-label {
    color: var(--text-secondary);
    font-weight: 500;
}

select.form-control option {
    background: var(--bg-secondary);
    color: var(--text-primary);
}

/* Liste üstündeki "Alt Ekip" / "Durum" kutuları satır içi stilleriyle saydamdı: çerçeveli kutu olsun */
.action-row .team-filter-wrapper,
.action-row .status-filter-wrapper {
    background: var(--bg-secondary) !important;
    border: 1px solid var(--border-light) !important;
    border-radius: 10px !important;
    min-height: 40px;
}

.action-row .team-filter-wrapper > span,
.action-row .status-filter-wrapper > span {
    white-space: nowrap;
}

/* ─── Tablolar ─── */
.table-wrapper {
    border-radius: 0;
}

table {
    font-size: 13px;
    font-variant-numeric: tabular-nums;
}

thead th {
    background: transparent;
    color: var(--text-muted);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    padding: 11px 8px;
    border-bottom: 1px solid var(--border-color);
}

tbody td {
    padding: 10px 8px;
    border-bottom: 1px solid var(--cizgi-satir);
    color: var(--text-secondary);
}

thead th:first-child,
tbody td:first-child {
    padding-left: 18px;
}

thead th:last-child,
tbody td:last-child {
    padding-right: 14px;
}

/* Satır sonundaki düğmeler sığsın: sıkı dizilsin */
td.k-butonlar .btn-icon,
td .btn-icon {
    width: 32px;
    height: 32px;
    min-height: 32px;
}

tbody tr:hover {
    background: var(--bg-glass);
}

.amount {
    color: var(--text-primary);
}

.amount.positive {
    color: var(--accent-emerald);
}

.amount.negative {
    color: var(--accent-rose);
}

/* ─── Rozetler: düz, yumuşak zeminli ─── */
.badge,
[data-theme="light"] .badge {
    border: 0;
    border-radius: 6px;
    padding: 3px 8px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    white-space: nowrap;
}

.badge-indigo { background: var(--rozet-mavi-zemin); color: var(--rozet-mavi); }
.badge-emerald { background: var(--rozet-yesil-zemin); color: var(--rozet-yesil); }
.badge-amber { background: var(--rozet-sari-zemin); color: var(--rozet-sari); }
.badge-rose { background: var(--rozet-kirmizi-zemin); color: var(--rozet-kirmizi); }
.badge-cyan { background: var(--rozet-camgobegi-zemin); color: var(--rozet-camgobegi); }
.badge-gri { background: var(--rozet-gri-zemin); color: var(--rozet-gri); }

/* Satış listesi: sözleşme no düz yazı, işlem türü gri, ödeme türü türüne göre renkli (app.js odemeRozetSinifi) */
.kart-satis .k-sozlesme .badge {
    background: none;
    color: var(--text-secondary);
    padding: 0;
    font-weight: 500;
}

.kart-satis .k-islem .badge {
    background: var(--rozet-gri-zemin);
    color: var(--rozet-gri);
    font-weight: 500;
}

/* ─── Pencereler ─── */
.modal-overlay {
    background: rgba(17, 24, 39, 0.45);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
}

.modal {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 14px;
    box-shadow: var(--shadow-xl);
}

.modal-header {
    border-bottom: 1px solid var(--border-color);
}

.modal-footer {
    border-top: 1px solid var(--border-color);
}

.modal-title {
    font-weight: 700;
    color: var(--text-primary);
}

/* ─── Arama kutusu ─── */
.search-box input {
    background-color: var(--bg-secondary);
    border-color: var(--border-light);
}

/* ─── Ay seçimi menünün en üstünde (geniş ekran; tasarim.js taşır) ─── */
.yan-ay-yeri:empty {
    display: none;
}

.yan-ay-yeri .month-filter-wrapper {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    box-sizing: border-box;
    min-height: 42px;
    padding: 0 4px 0 12px;
    border: 1px solid var(--border-light);
    border-radius: 10px;
    background: var(--bg-primary);
    color: var(--text-secondary);
    cursor: pointer;
}

.yan-ay-yeri select.form-control {
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    border: 0;
    background-color: transparent;
    box-shadow: none;
    min-height: 38px;
    padding: 0 24px 0 2px;
    font-weight: 600;
    color: var(--text-primary);
}

.yan-ay-yeri select.form-control:focus {
    box-shadow: none;
}

/* Sekmeler artık bağlantı: altı çizili olmasın */
a.nav-tab,
.alt-menu a {
    text-decoration: none;
}

/* ─── Üye bağlantısı (satış / tahsilat listesindeki ad) ─── */
.uye-baglanti {
    color: inherit;
    text-decoration: none;
}

.uye-baglanti:hover {
    color: var(--text-accent);
    text-decoration: underline;
}

/* ─── Ana sayfada üye arama ─── */
.uye-arama {
    position: relative;
    margin-bottom: 20px;
}

.uye-arama-kutu {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 56px;
    padding: 0 18px;
    background: var(--bg-secondary);
    border: 1px solid var(--border-light);
    border-radius: 14px;
    color: var(--text-muted);
    box-shadow: var(--shadow-sm);
}

.uye-arama-kutu:focus-within {
    border-color: var(--accent-indigo);
    box-shadow: 0 0 0 3px rgba(36, 66, 201, 0.15);
}

.uye-arama-kutu .ikon {
    width: 20px;
    height: 20px;
}

.uye-arama-kutu input {
    flex: 1 1 auto;
    min-width: 0;
    border: 0;
    outline: none;
    background: transparent;
    color: var(--text-primary);
    font: inherit;
    font-size: 16px;
}

.uye-arama-sonuc {
    margin-top: 8px;
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
}

.uye-sonuc {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 12px 18px;
    border-top: 1px solid var(--cizgi-satir);
    color: var(--text-primary);
    text-decoration: none;
}

.uye-sonuc:first-child {
    border-top: 0;
}

.uye-sonuc:hover,
.uye-sonuc:focus-visible {
    background: var(--uzerinde-zemin);
    outline: none;
}

.uye-sonuc-sol,
.uye-sonuc-sag {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.uye-sonuc-sag {
    align-items: flex-end;
    flex: none;
    text-align: right;
}

.uye-sonuc-ad {
    font-weight: 600;
}

.uye-sonuc-alt,
.uye-sonuc-kalan {
    font-size: 12px;
    color: var(--text-muted);
}

.uye-sonuc-tutar {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.uye-arama-bos {
    padding: 12px 18px;
    color: var(--text-muted);
    font-size: 13px;
}

/* ─── Üye sayfası ─── */
.uye-yukleniyor {
    padding: 40px 0;
    text-align: center;
    color: var(--text-muted);
}

.uye-ust-satir {
    margin-bottom: 12px;
}

.uye-kimlik {
    padding: 18px 20px;
}

.uye-kimlik-ust {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 14px;
}

.uye-rozetler {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.uye-eylemler {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.uye-bilgi {
    margin: 16px 0 0;
    padding-top: 14px;
    border-top: 1px solid var(--border-color);
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 12px 18px;
}

.uye-bilgi-oge dt {
    font-size: 12px;
    color: var(--text-muted);
}

.uye-bilgi-oge dd {
    margin: 2px 0 0;
    font-weight: 600;
    color: var(--text-primary);
}

.uye-ilerleme {
    height: 10px;
    border-radius: 5px;
    background: var(--dugme-grubu-zemin);
    overflow: hidden;
    margin-bottom: 10px;
}

.uye-ilerleme > div {
    height: 100%;
    background: var(--accent-emerald);
    border-radius: 5px;
}

.uye-not {
    margin: 0 0 6px;
    color: var(--text-secondary);
}

.uye-not:last-child {
    margin-bottom: 0;
}

.uye-uyari {
    margin-top: 10px;
    padding: 10px 12px;
    border-radius: 10px;
    background: var(--rozet-sari-zemin);
    color: var(--rozet-sari);
}

.uye-uyari-bag {
    color: inherit;
    font-weight: 600;
    margin-left: 4px;
}

.uye-tablo tfoot td {
    padding: 11px 8px;
    font-weight: 700;
    color: var(--text-primary);
    background: var(--bg-glass);
    border-top: 1px solid var(--border-color);
}

.uye-tablo tfoot td:first-child {
    padding-left: 18px;
}

.uye-kalem {
    font-weight: 600;
    color: var(--text-primary);
}

.uye-inhouse td {
    color: var(--text-accent);
    font-weight: 700;
    background: var(--secili-zemin);
}

.uye-yeni-gun td {
    border-top: 1px solid var(--border-color);
}

.uye-soluk {
    color: var(--text-muted);
    font-weight: 400;
}

.uye-dipnot {
    margin: 0;
    padding: 10px 18px 14px;
    font-size: 12px;
    color: var(--text-muted);
}

.uye-dokum summary {
    cursor: pointer;
    padding: 12px 18px;
    border-top: 1px solid var(--border-color);
    color: var(--text-accent);
    font-weight: 600;
}

/* ─── Masaüstünde alt menü yok ─── */
.alt-menu {
    display: none;
}

/* ─── Orta genişlik: tablolar (satış listesi ~1100px) sığsın diye menü daralır ─── */
@media (min-width: 1366px) and (max-width: 1599px) {
    .yan-menu {
        flex-basis: 204px;
        width: 204px;
        padding-left: 12px;
        padding-right: 12px;
    }

    .app-header.ust-bar {
        padding-left: 24px;
        padding-right: 24px;
    }

    .main-content {
        padding-left: 24px;
        padding-right: 24px;
    }
}

/* 769–1365px: menüde yalnız simgeler; ad, üzerine gelince (title) ve ekran okuyucuda kalır */
@media (min-width: 769px) and (max-width: 1365px) {
    .yan-menu {
        flex-basis: 68px;
        width: 68px;
        padding: 16px 10px;
        gap: 14px;
    }

    .yan-menu .logo {
        justify-content: center;
        padding: 0;
    }

    .logo-yazi {
        display: none;
    }

    .menu-grup {
        height: 1px;
        padding: 0;
        margin: 8px 6px;
        overflow: hidden;
        font-size: 0;
        background: var(--border-color);
    }

    .menu-grup:first-child {
        display: none;
    }

    [data-theme] .yan-menu .nav-tab,
    [data-theme] .yan-menu .tool-btn {
        position: relative;
        justify-content: center;
        padding: 10px 0;
    }

    .yan-menu .tab-ad,
    .yan-menu .tool-label {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }

    #alertsCountBadge {
        position: absolute;
        top: 2px;
        right: 4px;
        margin: 0;
        padding: 0 5px;
        font-size: 10px;
        line-height: 16px;
    }

    .app-header.ust-bar {
        padding-left: 20px;
        padding-right: 20px;
    }

    .main-content {
        padding-left: 20px;
        padding-right: 20px;
    }
}

/* ─── Telefon ─── */
@media (max-width: 768px) {
    .yan-menu {
        position: fixed;
        left: 0;
        top: 0;
        bottom: 0;
        height: auto;
        width: 280px;
        max-width: 86vw;
        transform: translateX(-102%);
        transition: transform 200ms ease;
        box-shadow: var(--shadow-xl);
        z-index: 300;
    }

    body.menu-acik .yan-menu {
        transform: none;
    }

    .menu-perde {
        position: fixed;
        inset: 0;
        background: rgba(17, 24, 39, 0.45);
        z-index: 290;
    }

    body.menu-acik .menu-perde {
        display: block;
    }

    .app-header.ust-bar {
        padding: 12px 14px 10px;
        align-items: stretch;
        flex-direction: column;
        gap: 10px;
        background: var(--bg-secondary);
        border-bottom: 1px solid var(--border-color);
    }

    .sayfa-basligi h1 {
        font-size: 20px;
    }

    #sayfaAltBaslik {
        display: none;
    }

    .ust-bar .header-actions {
        width: 100%;
        flex-wrap: nowrap;
        justify-content: stretch;
        gap: 8px;
    }

    .ust-bar .team-filter-wrapper,
    .ust-bar .month-filter-wrapper {
        flex: 1 1 0;
        min-width: 0;
    }

    .ekip-dugmeleri {
        display: none;
    }

    .ekip-secim {
        display: flex;
        align-items: center;
        min-height: 44px;
        padding: 0 4px 0 10px;
        border: 1px solid var(--border-light);
        border-radius: 10px;
        background: var(--bg-secondary);
    }

    .ekip-secim select.form-control,
    .ust-bar .month-filter-wrapper select.form-control {
        width: 100%;
        min-width: 0;
        font-weight: 600;
    }

    .ust-bar .month-filter-wrapper {
        min-height: 44px;
        padding-left: 10px;
    }

    .ust-bar .month-filter-wrapper .ikon {
        display: none;
    }

    .main-content {
        padding: 12px 12px calc(84px + env(safe-area-inset-bottom));
    }

    /* Özet kutuları telefonda ikişer yan yana (A tasarımı): eski tek sütunlu satır düzeninin yerine */
    .tab-panel > .stats-grid,
    #uyeIcerik > .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px;
        margin-bottom: 14px;
    }

    .tab-panel > .stats-grid > .stat-card,
    #uyeIcerik > .stats-grid > .stat-card {
        display: block;
        padding: 12px;
    }

    .tab-panel > .stats-grid > .stat-card .stat-label,
    #uyeIcerik > .stats-grid > .stat-card .stat-label {
        margin: 0 0 4px;
        font-size: 12px;
    }

    .tab-panel > .stats-grid > .stat-card .stat-value,
    #uyeIcerik > .stats-grid > .stat-card .stat-value {
        font-size: 18px !important;
        text-align: left;
    }

    .alt-menu {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 250;
        padding-bottom: env(safe-area-inset-bottom);
        background: var(--bg-secondary);
        border-top: 1px solid var(--border-color);
    }

    .alt-menu button,
    .alt-menu a {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 3px;
        min-height: 60px;
        border: 0;
        background: transparent;
        color: var(--text-muted);
        font: inherit;
        font-size: 11px;
        font-weight: 500;
        cursor: pointer;
    }

    .alt-menu button .ikon,
    .alt-menu a .ikon {
        width: 20px;
        height: 20px;
    }

    .alt-menu button.aktif,
    .alt-menu a.aktif {
        color: var(--text-accent);
        font-weight: 700;
    }

    .alt-menu-rozet {
        position: absolute;
        top: 6px;
        left: calc(50% + 6px);
        min-width: 16px;
        padding: 0 4px;
        border-radius: 8px;
        background: var(--accent-rose);
        color: #ffffff;
        font-size: 10px;
        font-weight: 700;
        line-height: 16px;
        text-align: center;
    }

    .toast-container {
        bottom: calc(76px + env(safe-area-inset-bottom));
    }

    /* Üye sayfası: tablolar sağa kaymasın (kullanıcı telefonda yatay kaydırmak istemiyor) */
    .uye-kimlik {
        padding: 14px;
    }

    .uye-eylemler .btn {
        flex: 1 1 auto;
    }

    .uye-bilgi {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .uye-tablo {
        font-size: 12px;
    }

    .uye-tablo th,
    .uye-tablo td,
    .uye-tablo tfoot td {
        padding: 8px 6px !important;
    }

    .uye-tablo th:first-child,
    .uye-tablo td:first-child {
        padding-left: 12px !important;
    }

    .uye-tablo .durum-sutun {
        display: none;
    }

    .uye-tablo.kartli,
    .uye-tablo.kartli tbody,
    .uye-tablo.kartli tfoot {
        display: block;
    }

    .uye-tablo.kartli thead {
        display: none;
    }

    .uye-tablo.kartli tbody tr {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px 12px;
        padding: 10px 12px;
        border-bottom: 1px solid var(--cizgi-satir);
    }

    .uye-tablo.kartli tbody td {
        padding: 0 !important;
        border: 0;
        text-align: left !important;
    }

    .uye-tablo.kartli tbody td::before {
        content: attr(data-label);
        display: block;
        font-size: 11px;
        font-weight: 500;
        color: var(--text-muted);
    }

    .uye-tablo.kartli tfoot tr {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        gap: 4px 12px;
        background: var(--bg-glass);
    }

    .uye-tablo.kartli tfoot td {
        background: none;
        border: 0;
        padding: 10px 12px !important;
    }

    .uye-tablo.kartli tfoot td.bos-hucre {
        display: none;
    }
}

/* ─── İcmal (kullanıcı, 04.11.2026): ekip satırı tıklayınca üyeler açılır; departman ve ekstra ödemeler tablo,
   yazıldığı anda kaydedilir (app.js renderIcmal / loadIcmalEkstra) ─── */
.gorunmez {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.icmal-kart-ust {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px 12px;
    flex-wrap: wrap;
}

.icmal-ipucu {
    margin-top: 2px;
    font-size: 12px;
    color: var(--text-muted);
}

.icmal-kayit {
    margin-left: auto;
    font-size: 12px;
    color: var(--text-muted);
}

.icmal-kayit:empty {
    display: none;
}

.icmal-kayit[data-tur="tamam"] { color: var(--accent-emerald); }
.icmal-kayit[data-tur="hata"] { color: var(--accent-rose); font-weight: 600; }

tr.icmal-ekip {
    cursor: pointer;
    background: var(--bg-glass);
}

tr.icmal-ekip:hover {
    background: var(--uzerinde-zemin);
}

tr.icmal-ekip td {
    font-weight: 700;
    border-bottom: 1px solid var(--border-color);
}

.icmal-ac {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    border: 0;
    background: none;
    font: inherit;
    font-weight: 700;
    color: var(--text-primary);
    cursor: pointer;
}

.icmal-ac:focus-visible {
    outline: 2px solid var(--accent-indigo);
    outline-offset: 3px;
    border-radius: 4px;
}

.icmal-ok {
    color: var(--text-muted);
    transition: transform 0.15s ease;
}

tr.icmal-ekip.acik .icmal-ok {
    transform: rotate(90deg);
}

.icmal-adet {
    font-size: 12px;
    font-weight: 500;
    color: var(--text-muted);
}

tr.icmal-uye td:first-child {
    padding-left: 44px;   /* üyeler ekibin altında, içeride */
}

.icmal-not {
    margin-top: 4px;
    padding: 10px 14px;
    border-radius: 10px;
    background: var(--rozet-sari-zemin);
    color: var(--rozet-sari);
    font-size: 13px;
    font-weight: 500;
}

.icmal-not[hidden] {
    display: none;
}

.icmal-moduller {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 620px), 1fr));   /* yan yana yalnız çok geniş ekranda */
    gap: 20px;
    margin-top: 20px;
    align-items: start;
}

.icmal-moduller > .card {
    margin-bottom: 0;
}

.icmal-dep-tablo,
.icmal-ekstra-tablo {
    width: 100%;
}

.icmal-dep-tablo td {
    vertical-align: middle;
}

.icmal-dep-tablo .dep-ad {
    font-weight: 600;
    color: var(--text-primary);
}

.icmal-dep-tablo .dep-ad small {
    display: block;
    font-size: 11px;
    font-weight: 400;
    color: var(--text-muted);
}

.icmal-dep-tablo .dep-girdi {
    width: 150px;
}

.icmal-dep-tablo .form-control,
.icmal-ekstra-tablo .form-control {
    height: 34px;
    min-height: 34px;
    padding: 4px 10px;
    font-size: 13px;
    text-align: right;
}

.icmal-dep-tablo .form-control,
.icmal-ekstra-tablo .form-control {
    width: 100%;
    min-width: 0;
}

.icmal-ekstra-tablo .extra-row-aciklama {
    text-align: left;
}

.dep-oran {
    display: block;
    font-size: 11px;
    font-weight: 400;
    color: var(--text-muted);
}

tr.dep-bagli td {
    background: var(--bg-glass);
    font-size: 12px;
}

tr.dep-bagli .dep-ad {
    padding-left: 32px;
    font-weight: 500;
}

.icmal-dep-tablo tfoot td,
.icmal-ekstra-tablo tfoot td {
    padding: 11px 8px;
    font-weight: 700;
    color: var(--text-primary);
    background: var(--bg-glass);
    border-top: 1px solid var(--border-color);
}

.icmal-dep-tablo tfoot td:first-child,
.icmal-ekstra-tablo tfoot td:first-child {
    padding-left: 18px;
}

.icmal-ekstra-tablo tfoot td:nth-child(2) {
    text-align: right;
    padding-right: 20px;
}

.icmal-ekstra-bos {
    padding: 14px 18px;
    font-size: 13px;
    color: var(--text-muted);
}

#panel-icmal .form-control:disabled {
    background: var(--bg-glass);
    color: var(--text-primary);
    opacity: 1;
    cursor: default;
}

.icmal-odenenler {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
    gap: 16px;
    margin-bottom: 20px;
}

.icmal-odenenler .badge {
    margin-left: 6px;
    vertical-align: 1px;
}

#icmal-acentaya-odenen[readonly] {
    background: var(--bg-glass);
}

@media (max-width: 768px) {
    table.kart-icmal tbody tr.icmal-ekip {
        grid-template-areas:
            "musteri musteri musteri"
            "yatan firma inhouse";
    }

    table.kart-icmal tbody tr.icmal-uye {
        padding-left: 30px;
    }

    table.kart-icmal tbody tr.icmal-uye td:first-child {
        padding-left: 0;
    }

    .icmal-dep-tablo thead {
        display: none;
    }

    .icmal-dep-tablo,
    .icmal-dep-tablo tbody,
    .icmal-dep-tablo tfoot {
        display: block;
        width: 100%;
    }

    .icmal-dep-tablo tr {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px 12px;
        padding: 12px 14px;
        border-bottom: 1px solid var(--border-light);
    }

    .icmal-dep-tablo td,
    .icmal-dep-tablo tfoot td {
        padding: 0 !important;
        border: 0;
        background: none;
        text-align: left !important;
        min-width: 0;
    }

    .icmal-dep-tablo .dep-ad {
        grid-column: 1 / -1;
    }

    .icmal-dep-tablo .dep-girdi {
        width: auto;
    }

    .icmal-dep-tablo .form-control {
        padding: 4px 8px;
    }

    .icmal-dep-tablo td[data-label]::before {
        content: attr(data-label);
        display: block;
        margin-bottom: 2px;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        color: var(--text-muted);
    }

    .icmal-dep-tablo .dep-oran,
    .icmal-dep-tablo .bos-hucre {
        display: none;
    }

    tr.dep-bagli {
        background: var(--bg-glass);
    }

    tr.dep-bagli .dep-ad {
        padding-left: 0 !important;
    }

    .icmal-dep-tablo tfoot tr {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        background: var(--bg-glass);
    }

    .icmal-dep-tablo tfoot td:first-child {
        grid-column: 1 / -1;
    }

    .icmal-ekstra-tablo tfoot {
        display: block;
    }

    .icmal-ekstra-tablo tfoot tr {
        display: flex;
        justify-content: space-between;
        background: var(--bg-glass);
    }

    .icmal-ekstra-tablo tfoot td {
        background: none;
        border: 0;
        padding: 12px 14px !important;
    }

    .icmal-ekstra-tablo tfoot td:last-child {
        display: none;
    }
}

@media (min-width: 769px) {
    #panel-icmal table.kart-icmal tfoot td {
        padding: 11px 8px;
        color: var(--text-primary);
        border-top: 1px solid var(--border-color);
    }

    #panel-icmal table.kart-icmal tfoot td:first-child {
        padding-left: 18px;
    }

    #panel-icmal table.kart-icmal tfoot td:last-child {
        padding-right: 14px;
    }
}

#panel-icmal td.icmal-bos-satir {
    padding: 14px 18px;
    font-size: 13px;
    color: var(--text-muted);
}

/* Gizlenen düğmeler (.btn display'i hidden özniteliğini ezmesin) */
#panel-icmal [hidden] {
    display: none !important;
}

/* ═══ Renk (kullanıcı, 04.11.2026: "program çok beyaz oldu, bazı yerlere farklı renkler koyabiliriz") ═══
   Yan menü koyu lacivert; sayfa zemini mavimsi gri, kartlar beyaz kalır; renkli özet kutuları açık tonlu zemin;
   tablo başlıkları hafif tonlu. Ekip renkleri sabit (İNHOUSE 1 mavi, İNHOUSE 2 turuncu, FOLLOW UP yeşil, CUBES sarı),
   renk körlüğü denetiminden geçti; her yerde yanında adı yazılı. */
[data-theme="light"] {
    --bg-primary: #eef1f6;
    --header-bg: #eef1f6;
    --tablo-baslik: #f5f7fb;

    --menu-zemin: #17214a;
    --menu-yazi: #c9d0ea;
    --menu-soluk: #8f99c4;
    --menu-uzerinde: rgba(255, 255, 255, 0.07);
    --menu-secili: rgba(255, 255, 255, 0.15);
    --menu-cizgi: rgba(255, 255, 255, 0.12);

    --rozet-mor-zemin: #f1ecfd;   --rozet-mor: #5b3aa8;

    --ekip-1: #2a78d6;
    --ekip-2: #eb6834;
    --ekip-3: #1baf7a;
    --ekip-4: #eda100;
}

[data-theme="dark"] {
    --tablo-baslik: #1a2130;

    --menu-zemin: #111833;
    --menu-yazi: #c3cbe6;
    --menu-soluk: #8a94bd;
    --menu-uzerinde: rgba(255, 255, 255, 0.06);
    --menu-secili: rgba(124, 147, 255, 0.2);
    --menu-cizgi: rgba(255, 255, 255, 0.1);

    --rozet-mor-zemin: rgba(139, 110, 232, 0.18);   --rozet-mor: #c4b5ff;

    --ekip-1: #3987e5;
    --ekip-2: #d95926;
    --ekip-3: #199e70;
    --ekip-4: #c98500;
}

/* Yan menü */
.yan-menu {
    background: var(--menu-zemin);
    border-right-color: transparent;
}

[data-theme] .yan-menu .logo-text {
    color: #ffffff;
}

.yan-menu .logo-alt {
    color: var(--menu-soluk);
}

.yan-menu .logo-icon {
    background: #4c6ef5;
}

.yan-menu .menu-grup {
    color: var(--menu-soluk);
}

[data-theme] .yan-menu .nav-tab,
[data-theme] .yan-menu .tool-btn {
    color: var(--menu-yazi);
}

[data-theme] .yan-menu .nav-tab .ikon,
[data-theme] .yan-menu .tool-btn .ikon {
    color: var(--menu-soluk);
}

[data-theme] .yan-menu .nav-tab:hover,
[data-theme] .yan-menu .tool-btn:hover {
    background: var(--menu-uzerinde);
    color: #ffffff;
}

[data-theme] .yan-menu .nav-tab.active {
    background: var(--menu-secili);
    color: #ffffff;
}

[data-theme] .yan-menu .nav-tab.active .ikon {
    color: #ffffff;
}

.yan-menu .nav-tab:focus-visible,
.yan-menu .tool-btn:focus-visible {
    outline: 2px solid #9db0ff;
    outline-offset: 1px;
}

.yan-menu .yan-araclar {
    border-top-color: var(--menu-cizgi);
}

.yan-menu .tool-btn.yedek-hatirlat::after {
    box-shadow: 0 0 0 2px var(--menu-zemin);
}

.yan-ay-yeri .month-filter-wrapper {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.16);
    color: var(--menu-yazi);
}

.yan-ay-yeri select.form-control {
    color: #ffffff;
}

.yan-ay-yeri select.form-control option {
    color: var(--text-primary);
    background: var(--bg-secondary);
}

@media (min-width: 769px) and (max-width: 1365px) {
    .yan-menu .menu-grup {
        background: var(--menu-cizgi);
    }
}

/* Tablo başlıkları hafif tonlu */
thead th {
    background: var(--tablo-baslik);
}

/* Renkli özet kutuları: açık tonlu zemin, etiket ve değer kutunun renginde */
.stat-card.indigo  { background: var(--rozet-mavi-zemin);       border-color: transparent; }
.stat-card.cyan    { background: var(--rozet-camgobegi-zemin);  border-color: transparent; }
.stat-card.emerald { background: var(--rozet-yesil-zemin);      border-color: transparent; }
.stat-card.rose    { background: var(--rozet-kirmizi-zemin);    border-color: transparent; }
.stat-card.amber   { background: var(--rozet-sari-zemin);       border-color: transparent; }
.stat-card.violet  { background: var(--rozet-mor-zemin);        border-color: transparent; }

.stat-card.indigo .stat-label  { color: var(--rozet-mavi); }
.stat-card.cyan .stat-label    { color: var(--rozet-camgobegi); }
.stat-card.emerald .stat-label { color: var(--rozet-yesil); }
.stat-card.rose .stat-label    { color: var(--rozet-kirmizi); }
.stat-card.amber .stat-label   { color: var(--rozet-sari); }
.stat-card.violet .stat-label  { color: var(--rozet-mor); }

.stat-card.indigo .stat-value  { color: var(--rozet-mavi); }
.stat-card.cyan .stat-value    { color: var(--rozet-camgobegi); }
.stat-card.violet .stat-value  { color: var(--rozet-mor); }

.stat-card.indigo:hover,
.stat-card.cyan:hover,
.stat-card.emerald:hover,
.stat-card.rose:hover,
.stat-card.amber:hover,
.stat-card.violet:hover {
    border-color: transparent;
}

/* ─── Şirket Özeti: Ekipler (app.js loadDashboard) ─── */
.ekip-pano {
    margin-top: 4px;
}

.ekip-pano .card-header .icmal-ipucu {
    margin-top: 2px;
}

/* Yan panel: kasa durumu ve en çok satanlar (app.js anaSayfaYanPaneli). Dar ekranda tablonun altında. */
.ekip-yan {
    display: grid;
    gap: 22px;
    align-content: start;
    padding: 16px 18px 18px;
    border-top: 1px solid var(--border-color);
}

.yan-baslik {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 4px 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--text-primary);
}

.yan-baslik b {
    font-size: 15px;
    font-variant-numeric: tabular-nums;
}

.yan-baslik small {
    font-size: 12px;
    font-weight: 500;
    color: var(--text-muted);
}

.yan-ipucu {
    margin: 2px 0 10px;
    font-size: 12px;
    color: var(--text-muted);
}

.yan-cubuk {
    display: flex;
    gap: 2px;
    height: 12px;
    margin-bottom: 10px;
    border-radius: 4px;
    overflow: hidden;
    background: var(--bg-card);
}

.yan-cubuk span {
    min-width: 4px;
    flex-basis: 0;
}

.yan-liste {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 13px;
}

.yan-liste li {
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 8px;
}

.yan-ad {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-secondary);
}

.yan-yuzde {
    font-size: 12px;
    color: var(--text-muted);
}

.yan-tutar {
    min-width: 92px;
    text-align: right;
    font-weight: 600;
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
}

.yan-tutar.eksi {
    color: var(--accent-rose);
}

.yan-liste li.yan-alt {
    font-size: 12px;
}

.yan-alt .yan-tutar {
    font-weight: 500;
    color: var(--text-secondary);
}

.yan-dokum {
    margin-top: 8px;
    font-size: 12px;
}

.yan-dokum summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--text-accent);
}

.yan-dokum .yan-liste {
    margin-top: 6px;
}

.yan-bos {
    margin: 6px 0 0;
    font-size: 13px;
    color: var(--text-muted);
}

.yan-siralar {
    display: grid;
    gap: 14px;
    margin-top: 10px;
}

.yan-sira-baslik {
    margin-bottom: 2px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--text-muted);
}

.yan-sira {
    margin: 0;
    padding: 0;
    list-style: none;
}

.yan-sira li {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
    border-bottom: 1px solid var(--cizgi-satir);
}

.yan-sira li:last-child {
    border-bottom: 0;
}

.yan-sira-no {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 6px;
    background: var(--bg-glass);
    color: var(--text-secondary);
    font-size: 12px;
    font-weight: 700;
}

.yan-sira li:first-child .yan-sira-no {
    background: var(--rozet-sari-zemin);
    color: var(--rozet-sari);
}

.yan-sira-ad {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary);
}

.yan-sira-ad small,
.yan-sira-deger small {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    font-weight: 500;
    color: var(--text-muted);
}

.yan-sira-ad small .ekip-nokta {
    width: 8px;
    height: 8px;
}

.yan-sira-deger {
    text-align: right;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary);
    font-variant-numeric: tabular-nums;
}

.yan-sira-deger small {
    justify-content: flex-end;
}

/* Tablet genişliği: panel tablonun altında, iki bölüm yan yana */
@media (min-width: 769px) and (max-width: 1279px) {
    .ekip-yan {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Çok geniş ekranda Rep ve T/O listeleri yan yana */
@media (min-width: 1700px) {
    .yan-siralar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px;
    }
}

.ekip-nokta {
    flex: none;
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 3px;
}

.ekip-tablo {
    width: 100%;
}

.ekip-tablo td {
    vertical-align: middle;
}

.ekip-bag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    color: var(--text-primary);
    text-decoration: none;
}

.ekip-bag:hover {
    color: var(--text-accent);
    text-decoration: underline;
}

tr.ekip-ana td {
    color: var(--text-primary);
    font-weight: 600;
    border-top: 1px solid var(--border-color);
}

tr.ekip-ana:first-child td {
    border-top: 0;
}

tr.ekip-bos td {
    color: var(--text-muted);
    font-weight: 500;
}

tr.ekip-alt td {
    font-size: 12px;
    color: var(--text-secondary);
    padding-top: 7px;
    padding-bottom: 7px;
}

tr.ekip-alt td.ekip-ad-hucre {
    padding-left: 36px;
}

.ekip-alt-ad {
    padding-left: 10px;
    border-left: 3px solid var(--ekip-renk, var(--border-light));
}

tr.ekip-not td {
    padding: 4px 18px 10px 36px;
    font-size: 12px;
    color: var(--accent-rose);
}

/* Tutarlar: hepsi sağa yaslı, rakamlar alt alta hizalı; ana satırda kalın, alt ekipte ince */
.ekip-tablo td,
.ekip-tablo th {
    white-space: nowrap;
}

.ekip-tablo td.text-right {
    font-variant-numeric: tabular-nums;
}

/* Geniş ekranda tablo içeriği kadar yer kaplar (tutarlar birbirinden kopmasın); boşalan sağ tarafta yan panel */
@media (min-width: 1280px) {
    .ekip-pano-govde {
        display: grid;
        grid-template-columns: auto minmax(280px, 1fr);
        align-items: stretch;
    }

    .ekip-pano-govde > .table-wrapper {
        grid-column: 1;
        grid-row: 1;
    }

    .ekip-pano-govde > .ekip-yan {
        grid-column: 2;
        grid-row: 1;
        padding: 18px 22px;
        border-top: 0;
        border-left: 1px solid var(--border-color);
    }

    .ekip-tablo {
        width: auto;
    }

    .ekip-tablo th.text-right:not(.ekip-sayi-hucre),
    .ekip-tablo td.text-right:not(.ekip-sayi-hucre) {
        padding-left: 36px;
    }
}

@media (max-width: 768px) {
    .ekip-tablo thead {
        display: none;
    }

    .ekip-tablo,
    .ekip-tablo tbody {
        display: block;
        width: 100%;
    }

    .ekip-tablo tr {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        grid-auto-flow: dense;   /* satış · volume · kalan, altında tahsil (2 sütun) · dönem içi giren */
        gap: 8px 10px;
        padding: 12px 14px;
    }

    .ekip-tablo td {
        padding: 0 !important;
        border: 0 !important;
        min-width: 0;
        text-align: left !important;
    }

    .ekip-tablo td[data-label]::before {
        content: attr(data-label);
        display: block;
        margin-bottom: 2px;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        color: var(--text-muted);
    }

    .ekip-tablo .ekip-ad-hucre,
    tr.ekip-not td {
        grid-column: 1 / -1;
    }

    tr.ekip-ana {
        border-top: 1px solid var(--border-color);
        background: var(--bg-glass);
    }

    tr.ekip-ana:first-child {
        border-top: 0;
    }

    tr.ekip-alt {
        margin-left: 14px;
        padding-left: 12px;
        border-left: 3px solid var(--ekip-renk, var(--border-light));
    }

    .ekip-alt-ad {
        padding-left: 0;
        border-left: 0;
        font-weight: 700;
        color: var(--text-primary);
    }

    tr.ekip-not {
        display: block;
        padding-top: 0;
    }
}

/* Şirket Özeti kutuları: Tüm Zamanlar'daki büyük rakamlar (112.826.531,43₺) beş kutuya sığsın */
@media (min-width: 769px) {
    #dashboard-global-stats .stat-value {
        font-size: clamp(19px, 1.45vw, 26px);
        white-space: nowrap;
    }
}

/* ─── Kasa: harcama girişi (kullanıcı, 04.11.2026: "ekiplere harcama girmekte zorlanıyorum, aşağılara kaydırıp butona
   basmam gerekiyor"). Masaüstünde en üstte ekip ekip "Harcama gir"; telefonda ekip sekmeleri (bir seferde bir ekip) ve
   sağ altta sabit "Harcama" düğmesi. app.js kasaEkibiSec / kasaHizliHarcama ─── */
.kasa-ust {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    margin-bottom: 16px;
}

.kasa-hizli {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.kasa-hizli-baslik {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-muted);
    margin-right: 2px;
}

.kasa-hizli-ekip {
    gap: 8px;
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    font-weight: 600;
}

.kasa-hizli-ekip::before {
    content: '+';
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    color: var(--text-accent);
}

.kasa-sekmeler,
.kasa-hizli-yuzen {
    display: none;
}

/* Harcama penceresi: ekip ve tür düğme düğme */
.secim-grubu {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.secim-grubu button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 6px 14px;
    border: 1px solid var(--border-light);
    border-radius: 10px;
    background: var(--bg-secondary);
    color: var(--text-secondary);
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.secim-grubu button:hover {
    background: var(--uzerinde-zemin);
}

.secim-grubu button.secili {
    background: var(--secili-zemin);
    border-color: var(--accent-indigo);
    color: var(--text-accent);
    box-shadow: inset 0 0 0 1px var(--accent-indigo);
}

.secim-grubu button:focus-visible {
    outline: 2px solid var(--accent-indigo);
    outline-offset: 2px;
}

.secim-ipucu {
    margin-top: 6px;
    font-size: 12px;
    color: var(--text-muted);
}

.secim-ipucu:empty {
    display: none;
}

#expenseModal .modal-footer {
    flex-wrap: wrap;
    gap: 8px;
}

#expense-kaydet-yeni[hidden] {
    display: none;
}

@media (max-width: 768px) {
    .kasa-ust {
        justify-content: flex-end;
    }

    .kasa-hizli {
        display: none;
    }

    .kasa-sekmeler {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 4px;
        margin-bottom: 14px;
        padding: 4px;
        border-radius: 12px;
        background: var(--dugme-grubu-zemin);
    }

    .kasa-sekmeler button {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        min-height: 48px;
        padding: 6px 2px;
        border: 0;
        border-radius: 9px;
        background: transparent;
        color: var(--text-secondary);
        font: inherit;
        font-size: 11px;
        font-weight: 600;
        line-height: 1.2;
        text-align: center;
        cursor: pointer;
    }

    .kasa-sekmeler button.secili {
        background: var(--bg-card);
        color: var(--text-primary);
        font-weight: 700;
        box-shadow: var(--shadow-sm);
    }

    #panel-kasa .kasa-grid > .card[data-kasa-ekip]:not(.kasa-secili) {
        display: none;
    }

    .kasa-hizli-yuzen {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        position: fixed;
        right: 16px;
        bottom: calc(72px + env(safe-area-inset-bottom));
        z-index: 245;
        min-height: 52px;
        padding: 0 20px 0 16px;
        border: 0;
        border-radius: 26px;
        background: var(--accent-indigo);
        color: #ffffff;
        font: inherit;
        font-size: 15px;
        font-weight: 700;
        box-shadow: var(--shadow-lg);
        cursor: pointer;
    }

    .kasa-hizli-yuzen .ikon {
        width: 20px;
        height: 20px;
    }

    #panel-kasa {
        padding-bottom: 72px;   /* sabit düğme son satırın üstünü örtmesin */
    }

    .secim-grubu[data-secim="expense-ekip"] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .secim-grubu[data-secim="expense-tur"] button {
        flex: 1 1 0;
        padding: 6px 8px;
    }

    #expenseModal .modal-footer .btn {
        flex: 1 1 auto;
    }
}

/* Menüdeki logo resim (static/ikon/logo.svg): kutunun zemin rengi ve harf ayarları uygulanmaz */
.yan-menu .logo-icon.logo-resim {
    display: block;
    flex: none;
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 8px;
    background: none;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.14);
}

/* Ekipler tablosu: ekip adı ve satış sayısı yan yana, dar (kullanıcı, 04.11.2026: "satış sayısı ekip isminden çok
   uzakta"); kalan genişlik tutar sütunlarına */
@media (min-width: 769px) {
    .ekip-tablo .ekip-ad-hucre,
    .ekip-tablo .ekip-sayi-hucre {
        width: 1%;
        white-space: nowrap;
        padding-right: 32px;
    }
}

/* Üye sayfası: ödeme durumu ile tahsilatlar geniş ekranda yan yana (kullanıcı, 04.11.2026: "yan yana koyabilecek
   alanımız var"); dar ekranda ve telefonda alt alta */
@media (min-width: 1280px) {
    .uye-ikili {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
        align-items: start;
        margin-bottom: 20px;
    }

    .uye-ikili > .card {
        margin-bottom: 0;
    }
}

/* ── Oran tabloları (app.js renderRatesTable, oranGecisiniCiz, oranTablosuPenceresi) ── */
#panel-rates [hidden],
#oranTabloModal [hidden] {
    display: none !important;
}

.oran-baslik {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.oran-araclar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.oran-araclar .btn {
    padding: 0.3rem 0.75rem;
    font-size: 0.85rem;
}

.oran-tablo-secim {
    width: auto;
    min-width: 220px;
    max-width: 100%;
    padding: 0.3rem 0.5rem;
    font-weight: 600;
}

.oran-tablo-bilgi {
    padding: 10px 16px;
    border-bottom: 1px solid var(--border-color);
    background: var(--rozet-mavi-zemin);
    color: var(--text-secondary);
    font-size: 13px;
    line-height: 1.5;
}

.oran-tablo-bilgi:empty {
    display: none;
}

.oran-tablo-bilgi b {
    color: var(--text-primary);
}

.oran-kilitli .oran-islem {
    color: var(--text-secondary);
}

.oran-kilit {
    margin-right: 6px;
    font-size: 12px;
    cursor: help;
}

#ratesTableBody .form-control:disabled {
    opacity: 0.75;
    cursor: not-allowed;
    background: transparent;
}

.oran-tablo-not {
    margin: 4px 0 0;
    color: var(--text-secondary);
    font-size: 13px;
    line-height: 1.5;
}

.oran-tablo-modal .modal-footer .oran-tablo-sil {
    margin-right: auto;
}

.oran-gecis-kart {
    margin-bottom: 1.5rem;
    border-color: var(--rozet-sari);
}

.oran-gecis-kart .card-header {
    background: var(--rozet-sari-zemin);
}

.oran-gecis-aciklama {
    margin: 0 0 12px;
    color: var(--text-secondary);
    font-size: 13px;
    line-height: 1.5;
}

.oran-gecis-kart .card-header {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 6px 12px;
}

.oran-gecis-sayi {
    font-size: 13px;
    font-weight: 600;
    color: var(--rozet-sari);
}

.oran-gecis-tablo td {
    vertical-align: top;
}

.oran-gecis-arasi {
    color: var(--text-secondary);
    font-weight: 600;
}

.oran-gecis-farksiz td {
    color: var(--text-muted);
}

.oran-gecis-alt,
.oran-gecis-kisiler {
    margin-top: 2px;
    color: var(--text-muted);
    font-size: 12px;
    font-weight: 400;
}

.oran-gecis-dugmeler {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

@media (max-width: 768px) {
    .oran-araclar {
        width: 100%;
    }

    .oran-tablo-secim {
        flex: 1 1 100%;
        min-width: 0;
    }

    .oran-gecis-dugmeler .btn {
        flex: 1 1 100%;
    }
}

/* Kasa durumu şeridinin renkleri: nakit yeşil, Nevresta mor (ekip renklerinden ayrı; renk körlüğü denetimi geçti) */
[data-theme="light"] {
    --kasa-nakit: #008300;
    --kasa-nevresta: #6250d6;
}

[data-theme="dark"] {
    --kasa-nakit: #0ca30c;
    --kasa-nevresta: #9085e9;
}