html {
    font-size: 14px;
    background-color: #f8f9fa;
}

body {
    margin: 0;
    overflow-x: hidden; /* Yatay taşma önle */
}

/* ── Placeholder metni site genelinde SOLUK görünsün (2026-08-09,
   kullanıcı isteği) — açıklayıcı bir placeholder yerine dolu bir alan
   girildiği izlenimi veriyordu. Firefox varsayılan olarak placeholder'a
   ekstra opacity uyguluyor, Chrome/Safari uygulamıyor — ikisinde de AYNI
   soluk tonu görmek için opacity'yi 1'e sabitleyip rengi açıkça set
   ediyoruz. Daha spesifik ::placeholder kuralları (.gg-input, .au-input
   vb.) zaten aynı tonu kullanıyor, üzerine yazmaya devam ederler. */
input::placeholder,
textarea::placeholder {
    color: #a3abb8;
    opacity: 1;
}

.clear {
    clear: both;
}

.hidden {
    display: none;
}

.text-underline {
    text-decoration: underline;
}


.popup-t {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.popup-t-bg {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #000;
    opacity: 0;
    transition: opacity 0.2s;
}

.popup-t-move-area {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.popup-t-move {
    position: relative;
    width: fit-content;
    max-width: min(90vw, 1200px);
    min-width: 300px;
    margin: 0 auto;
    transition: margin-top 0.2s;
}

.popup-t-content-area {
    overflow: hidden;
    /* overflow-y: auto; */
    margin: 20px;
    max-height: 90vh;
}

.popup-t-content {
    background-color: #fff;
    border-radius: 10px;
    max-height: 90vh;
    overflow: hidden;
}
.popup-t-content-i {
    max-height: calc(90vh - 50px);
    overflow-y: auto;
}
.popup-t-content-header{
    height: 50px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #0000002d;
}
.popup-t-content-header-title{
    padding-left: 20px;
    font-size: 18px;
    font-weight: 500;
    line-height: 20px;
}

/* 2026-08-31 (kullanıcı isteği: "işletme id bilgisini yaz ve yanına
   kopyalama butonu koy") — İşletme Bilgileri başlığının sağında. */
.isletme-company-id-box {
    display: flex;
    align-items: center;
    gap: 6px;
    padding-right: 20px;
    font-size: 12.5px;
    color: #888;
}
.isletme-company-id-label { font-weight: 500; white-space: nowrap; }
.isletme-company-id-value {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    color: #555;
    background: #f4f6f8;
    border-radius: 5px;
    padding: 3px 7px;
}
.isletme-company-id-copy {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 13px;
    padding: 3px 5px;
    border-radius: 5px;
    line-height: 1;
}
.isletme-company-id-copy:hover { background: #f4f6f8; }

/* ── Üyeler sayfası başlık aksiyonları (2026-08-28, kullanıcı isteği: "buton
   tasarımları hoşuma gitmedi... bu 2 butonu en güzel görünecek şekilde
   yerleştir") — iki buton TEK bir grupta, `.popup-t-content-header`'ın
   `justify-content:space-between`'i header'ı yine SADECE 2 elemanlı görüyor
   (başlık + bu grup), bu yüzden grup düzgünce sağa yaslanıyor; grubun İÇİNDE
   ise kendi (küçük, sabit) boşluğuyla dizilirler — üçüncü bir elemanın
   araya girip eşit-aralık dağıtımını bozması artık mümkün değil. Görsel
   hiyerarşi: "Yeni Üye Ekle" dolu/birincil (asıl, en sık kullanılan aksiyon),
   "Hızlı Kayıt" daha soluk/ikincil bir "ghost" buton (bkz. .es-btn-ghost'taki
   AYNI ghost-buton dili, bu sayfaya özel skorlanmış hâli) — ikisi eşit
   ağırlıkta olunca (eski hâl) "hangisi asıl aksiyon" belirsizleşiyordu. */
.uyeler-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-right: 20px;
}
/* NOT: `.popup-t-content-header a` (site geneli, tek-buton varsayımıyla
   yazılmış dolu-mavi kural) bu ikisini de zaten eşleştiriyor ve (0,1,1)
   özgüllüğe sahip — sade `.uyeler-header-btn*` (0,1,0) ona karşı KAYBEDER.
   `.popup-t-content-header a.uyeler-header-btn*` (0,2,1) ile kasıtlı olarak
   daha özgül yazıldı, kaynak sırasından bağımsız kazanması garanti. */
.popup-t-content-header a.uyeler-header-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    margin: 0;
    padding: 0 14px;
    border-radius: 8px;
    font-size: 13.5px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
    transition: filter .12s, transform .08s, background-color .12s, border-color .12s;
}
.popup-t-content-header a.uyeler-header-btn:active { transform: scale(0.97); }
.popup-t-content-header a.uyeler-header-btn-primary {
    background: #0b6ffd;
    color: #fff;
}
.popup-t-content-header a.uyeler-header-btn-primary:hover { background: #0b5ed7; }
.popup-t-content-header a.uyeler-header-btn-secondary {
    background: #f0f4ff;
    color: #0b6ffd;
    border: 1px solid #d7e3ff;
}
.popup-t-content-header a.uyeler-header-btn-secondary:hover { background: #e3ecff; border-color: #b9cdff; }

.popup-t-close-btn {
    width: 50px;
    height: 50px;
    cursor:pointer;
    background-image: url('/img/xmark-solid.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 20px;
    filter: invert(37%) sepia(94%) saturate(3471%) hue-rotate(343deg) brightness(99%) contrast(93%);
}

.popup-ct-error-title {
    line-height: 50px;
    text-align: center;
    font-size: 20px;
    font-weight: 500;
    margin: 10px 0;
    color: #F44336;
}

.popup-ct-error-desc {
    margin: 0 50px;
    font-size: 20px;
    padding: 10px 0;
}
.popup-content-default-area {
    padding: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
/* Form tabanlı popup'lar (üye ekle/düzenle vb.) iki sütunlu düzeni için
   minimum genişlik — dar kart popup'larında (member-profile-card gibi) kullanma */
.popup-content-default-area:not(.member-profile-card) {
    min-width: min(80vw, 860px);
}
.popup-content-default-area-inside {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}.popup-editsession-area-1, .popup-editsession-area-2 {
    width: 100%;
    display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
}
/* ── Saat Seçimi grid kap ─────────────────────────────────────────── */
.hs-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 7px;
    padding: 16px;
    width: 304px;
    box-sizing: border-box;
}

/* ── Saat chip butonu ─────────────────────────────────────────────── */
.popup-t1-btn1 {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 11px 6px;
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    background: #f4f6f8;
    border: 1.5px solid #e5e9ef;
    border-radius: 9px;
    cursor: pointer;
    transition: background 0.12s, border-color 0.12s, color 0.12s, box-shadow 0.12s;
    letter-spacing: 0.3px;
}
.popup-t1-btn1:hover {
    background: #009687;
    border-color: #009687;
    color: #fff;
    box-shadow: 0 3px 10px rgba(0,150,135,.28);
}
/* === Scrollbar Styling === */
#popup-id-lang-selector::-webkit-scrollbar {
  width: 8px;
}
#popup-id-lang-selector::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 8px;
}
#popup-id-lang-selector::-webkit-scrollbar-thumb:hover {
  background-color: rgba(0, 0, 0, 0.35);
}
.popup-content-error{
    font-weight: bold;
    font-size: 17px;
    color: #F44336;
}


.form-t1-input-area{
    width: 100%;
    /* Esnek genişlik: minimum 300px, kullanılabilir alana göre büyür */
    flex: 1 0 300px;
    max-width: 420px;
    margin-bottom: 15px;
}
.form-t1-input-area label, .form-t1-input-area .form-t1-input-label{
    font-weight: 500;
    font-size: 15px;
}
.form-t1-hint {
    font-size: 12px;
    color: #9ca3af;
    margin-top: 4px;
    line-height: 1.4;
}
.form-t1-input-label span{
    font-size: 13px;
    font-weight: normal;
    font-style: italic;
    color: #7a7a7a;
}
.form-t1-input{
    width: 100%;
    margin-top: 5px;
}
.form-t1-input input:not(.form-t1-checkbox), .form-t1-input textarea, .form-t1-input select{
    width: 100%;
    height: 40px;
    display: block;
    padding: 5px 10px;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    appearance: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #dee2e6;
    border-radius: 5px;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.form-t1-input select{
    background-image: url('/img/chevron-down-solid-full.svg');
    background-repeat: no-repeat;
    background-position: center right 10px;
    background-size: 14px;
    padding-right: 32px;
    cursor: pointer;
}
.form-t1-input input:not(.form-t1-checkbox):focus,
.form-t1-input textarea:focus,
.form-t1-input select:focus{
    border-color: #009687;
    box-shadow: 0 0 0 3px rgba(0,150,135,0.12);
    outline: none;
}
.form-t1-input textarea{
    min-height: 70px;
    height: auto;
}
.form-t1-info-area{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    margin-bottom: 10px;
}
.form-t1-info-title{
    font-weight: bold;
}
.form-t1-info-content{
    margin-left: 5px;
}

.form-t1-listselector{
    width: 100%;
    height: 40px;
    display: block;
    padding: 5px 10px;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #dee2e6;
    border-radius: 5px;
    background-image: url('/img/chevron-down-solid-full.svg');
    background-repeat: no-repeat;
    background-position: center right 5px;
    background-size: 20px;
}
.form-t1-desc{
    font-size: 13px;
    color: #607D8B;
    text-indent: 5px;
}
/* ── form-t1-input-row: iki alanı yan yana gösterir ───────────────── */
.form-t1-input-row{
    display: flex;
    gap: 12px;
}
.form-t1-input-col{
    flex: 1;
    display: flex;
    flex-direction: column;
}
.form-t1-input-col label{
    font-size: 13px;
    color: #9aa8b5;
    margin-bottom: 6px;
}
/* ══════════════════════════════════════════════════════════════════════
   member-profile-card  (mpc-*)  — Üye bilgi popup'ı  (açık tema)
   ══════════════════════════════════════════════════════════════════════ */
.member-profile-card {
    flex-direction: column;
    gap: 0;
    padding: 0;
    /* Masaüstünde geniş alan kullan */
    min-width: min(82vw, 780px);
}

/* ── Profil başlığı ── */
.mpc-header {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 24px;
    border-bottom: 1px solid #e4e4e4;
}

/* ── İki kolonlu gövde ── */
/* 2026-08-18 (kullanıcı isteği): sabit 2 sütun (mpc-col) yerine akışkan
   kutu düzeni. Eski tasarımda bölümler DOM sırasına göre sabit sol/sağ
   sütuna atanıyordu — üyenin bilgileri eksikse (ör. telefon/e-posta/
   Instagram hiçbiri girilmemişse) sol sütun kısa kalıp altında büyük bir
   boşluk oluşuyor, sağ sütun ise bağımsız şekilde uzamaya devam ediyordu.
   flex-wrap + her .mpc-section kendi başına kenarlıklı bir "kutu" olacak
   şekilde: kutular soldan sağa dizilir, sığmayınca alt satıra geçer —
   hangi bölüm görünür/gizli olursa olsun boşluk kalmaz. CSS column-count
   (masonry) BİLİNÇLİ OLARAK kullanılmadı — o, içeriği yukarıdan aşağı
   sütun sütun doldurur ve DOM/okuma sırasını bozar. flex-wrap sırayı
   korur, sadece "kısa sütun + boşluk" sorununu çözer. */
.mpc-body {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: 14px;
    padding: 16px 24px;
    width: 100%;
    box-sizing: border-box;
}
/* Kompakt bilgi kutuları — iki tanesi yan yana sığar (min-width altına
   düşünce otomatik tam satıra geçer, mobilde de aynı mekanizma çalışır). */
.mpc-section {
    flex: 1 1 260px;
    min-width: 260px;
}
/* Değişken uzunluktaki liste bölümleri (Bekleyen Ödemeler/Dersler) her
   zaman tam satır — uzun bir listeyi yarım kutuya sıkıştırmak sorunu
   çözmek yerine kötüleştirir. */
.mpc-section-full {
    flex-basis: 100%;
}

/* ── 2 Takvim Paketi satırı (2026-08-19, kullanıcı isteği: "çok aşağılarda
   kalmış, Grup Dersi Paketi en önde olmalı, 2 takvim asla birbiriyle
   karıştırılmamalı, masaüstünde yan yana görünsün") ── */
.mpc-cal-row {
    flex-basis: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}
/* Karışmasınlar diye: farklı vurgu rengi (sol kenarlık) + ikon + alt yazı.
   Grup Dersi Paketi = indigo (sabit rostır), Genel Takvim = teal (self-servis). */
.mpc-cal-section {
    border-left-width: 3px !important;
    border-left-style: solid !important;
}
.mpc-cal-grup {
    border-left-color: #6366f1 !important;
    background: #f5f5ff !important;
}
.mpc-cal-genel {
    border-left-color: #0d9488 !important;
    background: #f0fbfa !important;
}
/* Öne çıkan bölümler için varsayılan küçük gri "eyebrow" başlık yerine
   gerçek bir başlık gibi — bkz. .mpc-section-title (10px, gri, uppercase). */
.mpc-cal-section .mpc-section-title {
    font-size: 13.5px;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0.01em;
    color: #2b2f36;
    margin-bottom: 3px;
    display: flex;
    align-items: center;
}
.mpc-cal-title-icon {
    margin-right: 6px;
    font-size: 16px;
}
.mpc-cal-grup .mpc-cal-title-icon { color: #6366f1; }
.mpc-cal-genel .mpc-cal-title-icon { color: #0d9488; }
.mpc-cal-subtitle {
    font-size: 11px;
    color: #8a8f98;
    margin: -4px 0 10px;
    text-transform: none;
    letter-spacing: 0;
}
.mpc-avatar{
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: #405468;
    color: #fff;
    font-size: 17px;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.mpc-header-meta{
    flex: 1;
}
/* 2026-08-05: askıda bireysel/grup ders sayacı ayrıldı — iki rozet yan yana */
.mpc-session-badges-row{
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.mpc-session-badge{
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    background: #e8f5e9;
    border: 1px solid #a5d6a7;
    border-radius: 20px;
    padding: 3px 12px;
}
.mpc-session-count{
    font-size: 16px;
    font-weight: 500;
    color: #2e7d32;
}
.mpc-session-label{
    font-size: 11px;
    color: #558b2f;
}

/* ── Bölümler ── kutu tasarımı, bkz. .mpc-body üstündeki not (2026-08-18) */
.mpc-section {
    padding: 14px 16px 12px;
    border: 1px solid #f0f0f0;
    border-radius: 10px;
    background: #fafbfc;
}
.mpc-section-title{
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .8px;
    text-transform: uppercase;
    color: #adb5bd;
    margin-bottom: 8px;
}

.mpc-section-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}
.mpc-section-title-row .mpc-section-title { margin-bottom: 0; }

.mpc-suspend-all-btn {
    background: #fff;
    color: #c62828;
    border: 1px solid #e57373;
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.12s, color 0.12s;
}
.mpc-suspend-all-btn:hover {
    background: #c62828;
    color: #fff;
    border-color: #c62828;
}

/* ── Satır (ikon + değer) ── */
.mpc-row{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 5px 0;
}
.mpc-row-icon{
    font-size: 16px;
    color: #adb5bd;
    width: 18px;
    text-align: center;
    flex-shrink: 0;
}
.mpc-row-value {
    font-size: 13px;
    color: #495057;
    /* break-all HER karakterde kırıyordu (kelime ortasında bile) — sadece
       tek bir kelime/token gerçekten sığmazsa kırılsın diye break-word'e
       geçildi; kısa alanlarda (telefon, e-posta) davranış değişmiyor. */
    overflow-wrap: break-word;
    flex: 1;
    min-width: 0;
}

/* ── Satır içi Düzenle/Sil (2026-08-18 — Genel Takvim Dersi Paketi) ── */
.mpc-row-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}
/* .hidden (site.css'in başındaki genel kural) !important İÇERMİYOR — bu
   kural dosyada .hidden'DAN SONRA geldiği için display:flex eşit
   özgüllükte onu eziyordu (2026-08-18, kullanıcı bildirdi: paket silinince
   Düzenle/Sil butonları görünür kalıyordu). Bileşik seçici .mpc-row-
   actions.hidden, tek sınıf .hidden'dan daha yüksek özgüllükte olduğu için
   sıra ne olursa olsun kazanır. */
.mpc-row-actions.hidden {
    display: none;
}
.mpc-row-action-btn {
    font-size: 12px;
    font-weight: 600;
    color: #009687;
    cursor: pointer;
}
.mpc-row-action-btn:hover { text-decoration: underline; }
.mpc-row-action-btn-danger { color: #dc3545; }

/* ── Motiva bağlantı durumu (2026-07-06) — kullanıcı işletmeye yetki
   vermediyse/iptal ettiyse bu partner panelinde net görünsün. ── */
.mvs-status {
    font-weight: 600;
}
.mvs-status-ok {
    color: #2e7d32;
}
.mvs-status-pending {
    color: #e65100;
}
.mvs-status-off {
    color: #c62828;
}
.mvs-icon-ok {
    color: #2e7d32 !important;
}
.mvs-icon-pending {
    color: #e65100 !important;
}
.mvs-icon-off {
    color: #c62828 !important;
}
.mvs-status-sub {
    font-size: 11px;
    color: #adb5bd;
    margin-top: 3px;
}

/* ── İletişim — tıklanabilir link ── */
.mpc-contact-link {
    font-size: 13px;
    color: #009687;
    text-decoration: none;
    flex: 1;
    word-break: break-all;
    transition: color 0.12s;
}
.mpc-contact-link:hover {
    color: #007d70;
    text-decoration: underline;
}

/* ── Motiva Verileri popup'ı (2026-07-06) ── */
/* .mpc-body varsayılanı akışkan kutu düzeni (üye-bilgi popup'ı için) — bu
   popup'ta TEK bölüm olduğu için display:block'a çevirip masaüstünde
   daha geniş bir alan kullanmasını sağlıyoruz (bkz. Index.cshtml notu). */
.mvd-popup-body {
    display: block;
    min-width: min(90vw, 1080px);
}
.mvd-loading, .mvd-empty {
    padding: 32px 16px;
    text-align: center;
    color: #adb5bd;
    font-size: 13px;
}
.mvd-day {
    padding: 12px 0;
    border-bottom: 1px solid #f0f0f0;
}
.mvd-day:last-child {
    border-bottom: none;
}
.mvd-day-header {
    font-size: 18px;
    font-weight: 700;
    color: #343a40;
    margin-bottom: 10px;
}
.mvd-summary {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 10px;
}
.mvd-summary-chip {
    font-size: 11px;
    color: #495057;
    background: #f8f9fa;
    border-radius: 12px;
    padding: 3px 10px;
}
.mvd-meal-row, .mvd-activity-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
}
.mvd-meal-thumb {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    object-fit: cover;
    background: #f0f0f0;
    cursor: pointer;
    flex-shrink: 0;
}
.mvd-meal-thumb-placeholder {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #adb5bd;
    font-size: 14px;
    flex-shrink: 0;
}
.mvd-meal-info {
    flex: 1;
    min-width: 0;
}
.mvd-meal-name {
    font-size: 13px;
    color: #343a40;
    font-weight: 500;
}
.mvd-meal-macro {
    font-size: 11px;
    color: #868e96;
}
.mvd-activity-icon {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: #e1f5ee;
    color: #009687;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    flex-shrink: 0;
}
.mvd-activity-count {
    font-size: 11px;
    color: #adb5bd;
    font-weight: 400;
}

/* ── Motiva Verileri: takvim + özet yeniden tasarımı (2026-07-06) ── */
/* Kullanıcı geri bildirimi: "masaüstünde ekranı tam kullanmıyorsun, takvim
   ile alttaki liste arasındaki ilişki net değil" — masaüstünde takvim SOL,
   seçili günün detayı SAĞ sütunda; dar ekranda (mobil/tablet popup'ı) alt
   alta düşer. */
.mvd-layout {
    display: flex;
    gap: 32px;
    align-items: flex-start;
}
.mvd-layout-left {
    flex: 0 0 340px;
}
.mvd-layout-right {
    flex: 1;
    min-width: 0;
    border-left: 1px solid #f0f0f0;
    padding-left: 32px;
}
/* 2026-08-27 (kullanıcı raporu: "eşimin daha büyük ekranlı telefonunda panel
   kötü görünüyor") — bu kural eskiden 720px'te kırılıyordu, sitenin genel
   mobil ayrım noktası (aşağıdaki ana "MOBİL UYUMLULUK" bloğu) 768px —
   aradaki 720-768px genişlik bandındaki telefonlarda BU bileşen hâlâ
   masaüstü (yan yana) düzeninde kalırken SAYFANIN GERİ KALANI zaten mobil
   görünüme geçmiş oluyordu. Tüm dağınık breakpoint'ler (600/640/720px)
   768px'e birleştirildi ki cihazdan cihaza tutarsız/karışık bir görünüm
   olmasın. */
@media (max-width: 768px) {
    .mvd-layout {
        flex-direction: column;
        gap: 20px;
    }
    .mvd-layout-left {
        flex: 1 1 auto;
        width: 100%;
    }
    .mvd-layout-right {
        border-left: none;
        padding-left: 0;
        border-top: 1px solid #f0f0f0;
        padding-top: 16px;
        width: 100%;
    }
}

.mvd-toolbar {
    display: flex;
    gap: 6px;
    margin-bottom: 12px;
}
.mvd-toggle-btn {
    border: 1px solid #dee2e6;
    background: #fff;
    color: #495057;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 14px;
    border-radius: 16px;
    cursor: pointer;
    transition: all 0.12s;
}
.mvd-toggle-btn:hover {
    border-color: #009687;
    color: #009687;
}
.mvd-toggle-btn-active {
    background: #009687;
    border-color: #009687;
    color: #fff;
}

.mvd-summary-bar {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}
.mvd-stat-chip {
    flex: 1;
    min-width: 90px;
    background: #f8f9fa;
    border-radius: 10px;
    padding: 8px 12px;
    text-align: center;
}
.mvd-stat-chip-ok {
    background: #e6f7f2;
}
.mvd-stat-chip-warn {
    background: #fdecea;
}
.mvd-stat-value {
    font-size: 16px;
    font-weight: 700;
    color: #343a40;
}
.mvd-stat-chip-warn .mvd-stat-value {
    color: #c62828;
}
.mvd-stat-label {
    font-size: 10px;
    color: #868e96;
    margin-top: 2px;
}

/* Kullanıcı geri bildirimi: "ilk defa kullanan diyetisyen takvime tıklayıp
   tarih seçilmesi gerektiğini anlayamayabilir" — takvimin hemen üstünde
   sabit, göz ardı edilmesi zor bir tıklama ipucu. */
.mvd-cal-hint {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: #009687;
    background: #e6f7f2;
    border-radius: 8px;
    padding: 6px 10px;
    margin-bottom: 10px;
}

.mvd-calendar {
    margin-bottom: 8px;
}
.mvd-calendar-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    margin-bottom: 4px;
}
.mvd-calendar-weekdays > div {
    text-align: center;
    font-size: 10px;
    font-weight: 600;
    color: #adb5bd;
}
.mvd-calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}
.mvd-cal-cell {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px 5px;
    border-radius: 10px;
    background: #f1f3f5;
    color: #868e96;
    font-size: 11px;
    cursor: pointer;
    position: relative;
    transition: transform 0.08s, box-shadow 0.08s;
}
.mvd-cal-cell:hover {
    transform: scale(1.07);
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.mvd-cal-cell-blank {
    background: transparent;
    cursor: default;
}
.mvd-cal-cell-blank:hover {
    transform: none;
}
.mvd-cal-cell-nodata {
    background: #f8f9fa;
    color: #ced4da;
    box-shadow: inset 0 0 0 1px #e9ecef;
}
.mvd-cal-cell-data {
    background: #e9ecef;
    color: #495057;
}
.mvd-cal-cell-ok {
    background: #d3f0e6;
    color: #00695c;
}
.mvd-cal-cell-over {
    background: #ffe3b3;
    color: #8a5300;
}
.mvd-cal-cell-selected {
    box-shadow: inset 0 0 0 2px #009687;
}
.mvd-cal-cell-today {
    font-weight: 700;
}
.mvd-cal-daynum {
    line-height: 1;
    font-size: 15px;
    font-weight: 600;
}
.mvd-cal-dot {
    position: absolute;
    bottom: 5px;
    left: 5px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #e53935;
}

.mvd-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 10px 0 14px;
}
.mvd-legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 11px;
    color: #868e96;
}
.mvd-legend-swatch {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 3px;
}
.mvd-legend-ok {
    background: #d3f0e6;
}
.mvd-legend-over {
    background: #ffe3b3;
}
.mvd-legend-nodata {
    background: #f1f3f5;
}
.mvd-legend-dot {
    position: static;
}

.mvd-day-eyebrow {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: #009687;
    margin-bottom: 2px;
}

/* ── Öğün/Aktivite grupları (2026-07-06) ── */
/* Kullanıcı geri bildirimi: "yemeklerle aktiviteler aynı listede
   gözükmesin, iki farklı alanda gruplansın — bu paneli sadece
   diyetisyenler değil pilatesçiler de kullanacak, kullanılmayan kısım yer
   kaplamasın". Her grup kendi kartı + katlanabilir başlığı ile ayrı; o gün
   için hiç kaydı olmayan grup HİÇ render edilmiyor (JS tarafında), açık
   kalan grup ihtiyaç duyulmadığında başlığa tıklanarak katlanabiliyor. */
.mvd-group {
    background: #f8f9fa;
    border-radius: 12px;
    margin-bottom: 10px;
    overflow: hidden;
}
.mvd-group-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    cursor: pointer;
    user-select: none;
}
.mvd-group-title {
    font-size: 13px;
    font-weight: 600;
    color: #343a40;
}
.mvd-group-count {
    font-size: 11px;
    font-weight: 600;
    color: #868e96;
    background: #e9ecef;
    border-radius: 10px;
    padding: 1px 7px;
    margin-left: 4px;
}
.mvd-group-chevron {
    color: #adb5bd;
    font-size: 14px;
}
.mvd-group-body {
    padding: 0 14px 10px;
}
.mvd-group-body .mvd-meal-row:first-child,
.mvd-group-body .mvd-activity-row:first-child {
    padding-top: 0;
}
.mvd-group-body .mvd-meal-row:last-child,
.mvd-group-body .mvd-activity-row:last-child {
    padding-bottom: 0;
}

/* ── Öğün fotoğrafı büyük önizleme (2026-07-06) — yeni sekme yerine ── */
.mvd-lightbox-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0, 0, 0, 0.82);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100000;
    cursor: zoom-out;
    animation: mvd-lightbox-fade-in 0.15s ease-out;
}
@keyframes mvd-lightbox-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}
.mvd-lightbox-img {
    max-width: min(90vw, 900px);
    max-height: 88vh;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
    cursor: default;
}
.mvd-lightbox-close {
    position: fixed;
    top: 22px;
    right: 28px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    cursor: pointer;
    transition: background 0.12s;
}
.mvd-lightbox-close:hover {
    background: rgba(255, 255, 255, 0.22);
}

/* ── Telefon bloku: numara + iki büyük buton ── */
.mpc-phone-block {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 4px 0 2px;
}

.mpc-phone-number {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 500;
    color: #1a202c;
}

.mpc-phone-number .ti {
    font-size: 16px;
    color: #6b7280;
    flex-shrink: 0;
}

.mpc-phone-btns {
    display: flex;
    gap: 10px;
}

.mpc-phone-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 42px;
    border-radius: 10px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    transition: filter 0.15s, transform 0.1s;
    user-select: none;
}

.mpc-phone-btn:active {
    transform: scale(0.97);
}

.mpc-phone-btn .ti {
    font-size: 18px;
}

.mpc-phone-btn-call {
    background: #e8f5e9;
    color: #2e7d32;
    border: 1.5px solid #c8e6c9;
}

.mpc-phone-btn-call:hover {
    filter: brightness(0.94);
    color: #1b5e20;
}

.mpc-phone-btn-wa {
    background: #e7f8ee;
    color: #128c7e;
    border: 1.5px solid #b7e4c7;
}

.mpc-phone-btn-wa:hover {
    filter: brightness(0.94);
    color: #075e54;
}

/* 2026-09-04 (kullanıcı isteği: "veli iletişim bilgileri de orada
   gözüksün... veli için bir de ad soyad") — birden fazla veli olabileceği
   için (bkz. members.gd) her veli kendi hafif ayrılmış kartında. */
.mpc-guardian-row {
    padding: 10px 0;
    border-top: 1px solid #f0f0f0;
}
.mpc-guardian-row:first-child { border-top: none; padding-top: 4px; }

.mpc-guardian-name {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: #4b5563;
    margin-bottom: 4px;
}
.mpc-guardian-name .ti {
    font-size: 16px;
    color: #9ca3af;
    flex-shrink: 0;
}

/* ── Ders hakkı düzenleme paneli ── */
.mpc-session-badge {
    align-items: center;   /* baseline yerine center — buton hizası için */
}

.mpc-credit-edit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border: 1px solid #a5d6a7;
    background: transparent;
    border-radius: 6px;
    cursor: pointer;
    color: #558b2f;
    opacity: 0.6;
    transition: opacity 0.15s, background 0.15s;
    margin-left: 4px;
    flex-shrink: 0;
    padding: 0;
}

.mpc-credit-edit-btn:hover {
    opacity: 1;
    background: #d7f0d8;
}

.mpc-credit-edit-btn .ti {
    font-size: 12px;
}

/* ── Motiva Bağlantısı: "Motiva'ya Bağla" (ikon + metin) ──
   .mpc-credit-edit-btn'in AYNI renk paleti, ama o sınıf 22x22px sabit
   ikon-only bir kutu (ders kredisi satırındaki küçük kalem ikonu için) —
   metinli bir buton için kullanılınca metin kutunun dışına taşıp ikonla
   üst üste biniyordu (2026-07-06, canlı hata düzeltmesi). */
.mpc-connect-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #a5d6a7;
    background: transparent;
    border-radius: 7px;
    padding: 6px 12px;
    cursor: pointer;
    color: #558b2f;
    font-size: 13px;
    font-weight: 500;
    opacity: 0.85;
    transition: opacity 0.15s, background 0.15s;
}

.mpc-connect-btn:hover {
    opacity: 1;
    background: #d7f0d8;
}

.mpc-connect-btn .ti {
    font-size: 14px;
}

/* 2026-08-17 (kullanıcı isteği): buton gizlenip sonradan belirmek yerine
   (bu da ekranı kaydırıyordu) baştan yerini koruyup sadece pasif görünür —
   gerçek durum gelince aktif hâle geçer. */
.mpc-connect-btn:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    pointer-events: none;
}

/* Kayıt Bağlantısı onay/red butonları — .mpc-connect-btn'in renk varyantları */
.mpc-connect-btn-success { border-color: #9ae6b4; color: #276749; }
.mpc-connect-btn-success:hover { background: #f0faf4; }
.mpc-connect-btn-danger { border-color: #e57373; color: #c62828; }
.mpc-connect-btn-danger:hover { background: #fff5f5; }

/* Genel Takvim occurrence — tüm başvuruları reddet (2026-08-19) */
.gtk-occ-cancel-row { margin-top: 10px; }
.gtk-occ-cancel-btn {
    width: 100%; padding: 10px; border: 1.5px solid #e57373; border-radius: 8px;
    background: #fff; color: #c62828; font-weight: 600; cursor: pointer;
}
.gtk-occ-cancel-btn:hover { background: #fff5f5; }

/* Genel Takvim occurrence — dersi elle tamamlandı işaretle (2026-09-02,
   bkz. HomeController.post_CompleteGroupOccurrence) */
.gtk-occ-complete-row { margin-top: 10px; }
.gtk-occ-complete-btn {
    width: 100%; padding: 10px; border: 1.5px solid #66bb6a; border-radius: 8px;
    background: #fff; color: #2e7d32; font-weight: 600; cursor: pointer;
}
.gtk-occ-complete-btn:hover { background: #f1f9f1; }

/* Fiyatlandırma Şablonu (2026-09-02) — eksen değer listesi + fiyat matrisi
   editörü. Değer satırları küçük, yan yana input+sil düzeni; matris tablosu
   yatayda taşarsa kaydırılabilir. */
.isletme-pt-axis-values { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.isletme-pt-axis-value-row { display: flex; align-items: center; gap: 4px; background: #f4f6f8; border-radius: 8px; padding: 4px 6px; }
.isletme-pt-axis-value-row input { width: 64px; border: 1px solid #e5e9ef; border-radius: 6px; padding: 4px 6px; font-size: 13px; }
.isletme-pt-axis-value-remove { color: #c62828; text-decoration: none; font-weight: 700; padding: 0 3px; }
.isletme-pt-matrix-wrap { overflow-x: auto; margin-top: 8px; }
.isletme-pt-matrix-table { border-collapse: collapse; width: 100%; }
.isletme-pt-matrix-table th, .isletme-pt-matrix-table td { border: 1px solid #eef1f4; padding: 6px; text-align: center; font-size: 13px; }
.isletme-pt-matrix-table thead th { background: #f4f6f8; font-weight: 700; white-space: nowrap; }
.isletme-pt-matrix-table tbody th { background: #f4f6f8; font-weight: 700; white-space: nowrap; }
.isletme-pt-matrix-table td input { width: 72px; border: 1px solid #e5e9ef; border-radius: 6px; padding: 4px 6px; font-size: 13px; text-align: center; }

/* Kayıt Bağlantısı — onay bekleyen gönderim alanları */
.mpc-reglink-pending-row {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    padding: 6px 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 13px;
}
.mpc-reglink-pending-row:last-child { border-bottom: none; }
.mpc-reglink-pending-label { color: #9ba4b0; flex-shrink: 0; }
.mpc-reglink-pending-value { color: #1a2332; font-weight: 500; text-align: right; word-break: break-word; }

.mpc-credit-edit-panel {
    margin-top: 8px;
    background: #f4f6f8;
    border: 1px solid #dde3e9;
    border-radius: 10px;
    padding: 10px 12px;
    animation: mpc-credit-in 0.18s ease;
}

@keyframes mpc-credit-in {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.mpc-credit-edit-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
}

.mpc-credit-step {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid #d0d7de;
    background: #fff;
    color: #3a4655;
    font-size: 15px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.12s, border-color 0.12s;
}

.mpc-credit-step:hover {
    background: #e8f0fe;
    border-color: #9ab0d0;
}

.mpc-credit-delta-input {
    flex: 1;
    min-width: 0;
    text-align: center;
    height: 34px;
    border-radius: 8px;
    border: 1px solid #d0d7de;
    background: #fff;
    color: #1a202c;
    font-size: 18px;
    font-weight: 700;
    padding: 0 8px;
    outline: none;
    transition: border-color 0.13s, box-shadow 0.13s;
}

.mpc-credit-delta-input:focus {
    border-color: #009687;
    box-shadow: 0 0 0 2px rgba(0,150,135,0.15);
}

/* Chrome number input okleri gizle */
.mpc-credit-delta-input::-webkit-inner-spin-button,
.mpc-credit-delta-input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.mpc-credit-delta-input[type=number] { -moz-appearance: textfield; }

.mpc-credit-preview {
    font-size: 12px;
    color: #8a96a3;
    text-align: center;
    min-height: 15px;
    margin-bottom: 8px;
    letter-spacing: 0.01em;
}

.mpc-credit-preview-result {
    color: #009687;
    font-weight: 700;
}

/* ── Büyük Grup Dersi Paketi formu (2026-08-06) ─────────────────────── */
.mpc-gp-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 8px;
}
.mpc-gp-field label {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
}
.mpc-gp-input {
    height: 34px;
    border-radius: 8px;
    border: 1px solid #d0d7de;
    background: #fff;
    color: #1a202c;
    font-size: 14px;
    padding: 0 10px;
    outline: none;
    transition: border-color 0.13s, box-shadow 0.13s;
}
.mpc-gp-input:focus {
    border-color: #009687;
    box-shadow: 0 0 0 2px rgba(0,150,135,0.15);
}
.mpc-gp-hint {
    font-size: 11px;
    color: #9ca3af;
    margin-top: 2px;
}
/* 2026-08-24 (kullanıcı isteği: "küçük bir buton ile paket tutarını alınan
   tutara kopyalayabiliriz, ödemesini yapan kişi için 2 kez tutar girilmemiş
   olur") — Toplam Tutar'ı Ödenen Tutar'a kopyalayan kompakt ikon buton. */
.mpc-gp-copy-btn {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    border: 1px solid #d0d7de;
    background: #fff;
    color: #6b7280;
    cursor: pointer;
    transition: background 0.12s, color 0.12s, border-color 0.12s;
}
.mpc-gp-copy-btn:hover {
    background: #f0fdfb;
    color: #009687;
    border-color: #009687;
}

.mpc-credit-edit-actions {
    display: flex;
    gap: 8px;
}

.mpc-credit-cancel,
.mpc-credit-save {
    flex: 1;
    height: 32px;
    border-radius: 7px;
    border: none;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: filter 0.13s, transform 0.1s;
}

.mpc-credit-cancel:active,
.mpc-credit-save:active {
    transform: scale(0.97);
}

.mpc-credit-cancel {
    background: #e8ecef;
    color: #4a5568;
    border: 1px solid #d0d7de;
}

.mpc-credit-cancel:hover {
    background: #dde3e9;
}

.mpc-credit-save {
    background: #009687;
    color: #fff;
}

.mpc-credit-save:hover:not(:disabled) {
    filter: brightness(0.92);
}

.mpc-credit-save:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

/* ── Ders satırı inline silme onayı ── */
.mpc-srow-confirm {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 12px;
    background: #fff5f5;
    border-radius: 8px;
    animation: mpc-srow-confirm-in 0.18s ease;
}

/* Tüm bireysel dersleri askıya al onayı — mesaj daha uzun olduğu için
   (tek satırlık ders-silme onayının aksine) metin üstte, butonlar altta
   dikey düzende gösterilir. */
#uyeler-suspend-all-confirm {
    flex-direction: column;
    align-items: stretch;
}
#uyeler-suspend-all-confirm .mpc-srow-confirm-btns {
    justify-content: flex-end;
}

@keyframes mpc-srow-confirm-in {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

.mpc-srow-confirm-msg {
    font-size: 13px;
    color: #c0392b;
    flex: 1;
    min-width: 0;
}

.mpc-srow-confirm-btns {
    display: flex;
    gap: 8px;
    flex-shrink: 0;
}

.mpc-srow-confirm-cancel,
.mpc-srow-confirm-ok {
    height: 34px;
    padding: 0 14px;
    border-radius: 7px;
    border: none;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: filter 0.13s, transform 0.1s;
}

.mpc-srow-confirm-cancel:active,
.mpc-srow-confirm-ok:active {
    transform: scale(0.96);
}

.mpc-srow-confirm-cancel {
    background: #f0f0f0;
    color: #444;
}

.mpc-srow-confirm-cancel:hover {
    filter: brightness(0.93);
}

.mpc-srow-confirm-ok {
    background: #e74c3c;
    color: #fff;
}

.mpc-srow-confirm-ok:hover {
    filter: brightness(0.9);
}

.mpc-srow-confirm-complete {
    background: #f0faf4;
}

.mpc-srow-confirm-complete .mpc-srow-confirm-msg {
    color: #276749;
}

.mpc-srow-confirm-ok-complete {
    background: #27ae60;
}

.mpc-srow-confirm-ok-complete:hover {
    filter: brightness(0.9);
}

/* ── Boy / Kilo / VKİ istatistik kutuları ── */
.mpc-stats{
    display: flex;
    background: #f8f9fa;
    border-radius: 8px;
    overflow: hidden;
    margin-top: 10px;
    border: 1px solid #e9ecef;
}
.mpc-stat{
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12px 0;
}
.mpc-stat-value{
    font-size: 18px;
    font-weight: 500;
    color: #212529;
}
.mpc-stat-label{
    font-size: 10px;
    color: #adb5bd;
    margin-top: 2px;
}
.mpc-stat-divider{
    width: 1px;
    background: #e9ecef;
    align-self: stretch;
}

/* ── Üye bilgi popup: bekleyen ödemeler ── */
.mpc-bill-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid #f5f5f5;
}
.mpc-bill-row:last-child {
    border-bottom: none;
}
.mpc-bill-meta {
    flex: 1;
    min-width: 0;
}
.mpc-bill-date {
    font-size: 12px;
    color: #adb5bd;
}
.mpc-bill-amounts {
    font-size: 12px;
    color: #6c757d;
    margin-top: 1px;
}
.mpc-bill-remaining {
    font-size: 13px;
    font-weight: 700;
    color: #e53935;
    white-space: nowrap;
    flex-shrink: 0;
}
.mpc-bill-pay-btn {
    background: #e53935;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.15s;
}
.mpc-bill-pay-btn:hover {
    background: #c62828;
}

/* ── Üye detay: inline ödeme formu ── */
.mpc-bill-pay-form {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 4px 0;
    animation: mpc-credit-in 0.15s ease;
}

.mpc-bill-pay-input {
    width: 100%;
    height: 36px;
    border: 1px solid #d0d7de;
    border-radius: 8px;
    padding: 0 10px;
    font-size: 14px;
    outline: none;
    transition: border-color 0.13s, box-shadow 0.13s;
    box-sizing: border-box;
}

.mpc-bill-pay-input:focus {
    border-color: #009687;
    box-shadow: 0 0 0 2px rgba(0,150,135,0.15);
}

.mpc-bill-pay-actions {
    display: flex;
    gap: 8px;
}

.mpc-bill-pay-cancel,
.mpc-bill-pay-save {
    flex: 1;
    height: 32px;
    border-radius: 7px;
    border: none;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: filter 0.13s, transform 0.1s;
}

.mpc-bill-pay-cancel:active,
.mpc-bill-pay-save:active { transform: scale(0.97); }

.mpc-bill-pay-cancel {
    background: #e8ecef;
    color: #4a5568;
    border: 1px solid #d0d7de;
}

.mpc-bill-pay-cancel:hover { background: #dde3e9; }

.mpc-bill-pay-save {
    background: #009687;
    color: #fff;
}

.mpc-bill-pay-save:hover { filter: brightness(0.92); }

/* ── Takvim: Üye / Grup seçici ─────────────────────────────── */
.tms-wrapper {
    width: 320px;
    display: flex;
    flex-direction: column;
    gap: 0;
}
.tms-search-bar {
    padding: 12px 14px 8px;
}
.tms-search-bar input {
    width: 100%;
    box-sizing: border-box;
    padding: 8px 12px;
    border: 1.5px solid var(--border-color, #e0e0e0);
    border-radius: 8px;
    font-size: 13px;
    outline: none;
    background: var(--bg-secondary, #f8f8f8);
    color: var(--text-primary, #212121);
    transition: border-color 0.15s;
}
.tms-search-bar input:focus {
    border-color: #1976d2;
    background: #fff;
}
.takvim-member-list-content {
    max-height: 360px;
    overflow-y: auto;
    padding: 0 8px 4px;
}
.tms-card {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 8px;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.12s;
}
.tms-card:hover {
    background: var(--bg-secondary, #f0f4ff);
}
.tms-avatar {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    flex-shrink: 0;
}
.tms-avatar-group {
    border-radius: 10px;
}
.tms-card-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.tms-card-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--text-primary, #212121);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tms-card-meta {
    font-size: 11px;
    color: var(--text-secondary, #757575);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tms-empty {
    padding: 24px;
    text-align: center;
    color: var(--text-secondary, #9e9e9e);
    font-size: 13px;
}
.tms-footer {
    display: flex;
    justify-content: space-between;
    padding: 8px 14px 12px;
    border-top: 1px solid var(--border-color, #eee);
    margin-top: 4px;
}
.tms-footer a {
    font-size: 12px;
    color: #1976d2;
    text-decoration: none;
}
.tms-footer a:hover {
    text-decoration: underline;
}

/* ── Dersi Güncelle popup — modern tasarım ──────────────────── */
/* Renk paleti: uygulamanın mevcut açık temasıyla uyumlu
   metin: #343a41 | label: #7a7a7a | border: #e8ecef | bg-hover: #f5f7fa
   birincil: #0b6ffd | arka plan: #fff */
.es-wrapper {
    width: 340px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* Area-1: column layout zorla
   display kasıtlı olarak !important DEĞİL — JS inline style ile
   display:none / flex yapar, !important bunu ezer */
.es-wrapper .popup-editsession-area-1 {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    width: 100%;
    padding: 0;
}

/* Bölüm */
.es-section {
    padding: 10px 16px;
    border-bottom: 1px solid #e8ecef;
}
.es-section-label {
    font-size: 10px;
    font-weight: 700;
    color: #7a7a7a;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 5px;
}

/* 2026-08-31 (kullanıcı isteği: ders detayında durum görünsün) — takvim
   pill'lerindeki .state_0/.state_1/.state_-2 ile AYNI palet, tutarlılık için. */
.es-status-badge {
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 6px;
}
.es-status-badge.es-status-pending {
    background-color: #e3f2fd;
    color: #1565c0;
}
.es-status-badge.es-status-cancelled {
    background-color: #f5d5d2;
    color: #7b3a36;
}
.es-status-badge.es-status-completed {
    background-color: #c8f5ce;
    color: #1b5e20;
}
.es-status-badge.es-status-suspended {
    background-color: #f3eefc;
    color: #6c3483;
}

/* Üye / Grup — orijinal .class-session-select-member-edit yeşil buton
   stilini geçersiz kıl; tıklanabilir link gibi görünsün.
   2026-08-19 (kullanıcı isteği: "grubun ismi ile üyelerin ismini yan yana
   yazıyor, okumayı zorlaştırıyor") — eskiden HER satır `inline-flex` idi,
   yani grup adı + tüm üye adları metin gibi yan yana akıp satır sonunda
   sarılıyordu. Artık HER satır kendi genişliğinde (BLOK), grup başlığı
   ikon+kalın+alt çizgiyle üye listesinden görsel olarak ayrılıyor, üyeler
   girintili+ikonlu gerçek bir liste gibi alt alta diziliyor. */
.es-member-value .class-session-select-member-edit {
    background: none !important;
    background-color: transparent !important;
    height: auto !important;
    padding: 3px 0 !important;
    margin: 0 !important;
    border: none !important;
    width: 100% !important;
    display: flex !important;
    align-items: center;
    gap: 6px;
    cursor: pointer;
}
.es-member-value .class-session-select-member-edit span:first-child {
    font-size: 13.5px;
    font-weight: 600;
    color: #0b6ffd !important;
    text-decoration: none;
    font-style: normal;
}
.es-member-value .class-session-select-member-edit:hover span:first-child {
    text-decoration: underline;
}
/* Satır başı ikonu (ti-users / ti-user, JS'te eklendi) */
.es-member-value .class-session-select-member-edit > i {
    flex-shrink: 0;
    font-size: 15px;
    color: #0b6ffd;
    opacity: 0.75;
}
/* Dış bağlantı ikonu (↗) — ayrı SVG dosyası gerektirmez */
.es-member-value .class-session-select-member-edit::after {
    content: '';
    display: inline-block;
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    margin-left: auto;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b6ffd' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.5;
}
.es-member-value .class-session-select-member-edit:hover::after {
    opacity: 1;
}
.es-member-value .class-session-select-member-edit .info {
    display: none; /* eski .info span'ı gizli kalır, ikon ::after ile gelir */
}
/* Grup başlık satırı — üye listesinden AYRIK bir "başlık" gibi görünsün:
   daha büyük/kalın yazı + alt çizgi ile ayraç. */
.es-member-value .class-session-select-membergroup-edit {
    padding-bottom: 6px !important;
    margin-bottom: 4px !important;
    border-bottom: 1px solid #eef1f5 !important;
}
.es-member-value .class-session-select-membergroup-edit span:first-child {
    font-size: 14.5px;
    font-weight: 700;
    color: #0b6ffd !important;
    letter-spacing: 0.02em;
}
.es-member-value .class-session-select-membergroup-edit > i {
    font-size: 16px;
}
/* Üye listesi — grup başlığının ALTINDA, hafif girintili */
.es-member-value .es-member-list {
    display: flex;
    flex-direction: column;
    padding-left: 8px;
}
/* 2026-08-24 (kullanıcı isteği: "bir üyenin ders başı ücreti belirlenmeden
   ders tamamlanırsa eğitmen hakedişi hatalı kayıt oluyor") — grup ders
   düzenleme popup'ındaki üye listesinde ders başı ücret/uyarı. */
.es-member-price {
    font-size: 0.82em;
    color: #888;
    font-weight: 400;
}
.es-member-price-missing {
    font-size: 0.82em;
    color: #fff;
    font-weight: 700;
    background: #e53935;
    border-radius: 4px;
    padding: 1px 6px;
    margin-left: 2px;
}

/* Tarih & Saat */
.es-datetime-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.es-date-nav {
    display: flex !important;
    align-items: center;
    justify-content: flex-start !important;
    gap: 6px;
}
.es-date-text {
    font-size: 14px;
    font-weight: 600;
    color: #343a41;
    min-width: 130px;
}
.es-nav-btn {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid #dee2e6;
    background: #fff;
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    color: #6c757d;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.12s, color 0.12s, border-color 0.12s;
    flex-shrink: 0;
    padding: 0;
}
.es-nav-btn:hover {
    background: #eef3ff;
    color: #0b6ffd;
    border-color: #0b6ffd;
}

/* Gizli flatpickr input — görünmez, sadece takvim açmak için */
.es-edit-date-input {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
    pointer-events: none;
    border: none;
    padding: 0;
}

/* Tarih metni üzerine hover → takvim ikonu belirginleşir */
.es-date-text {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: color 0.12s;
}
.es-date-text:hover { color: #0b6ffd; }
/* Takvim ikonu — font değil SVG (Tabler Icons yüklü değil) */
.es-date-pick-icon {
    display: inline-block;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b6ffd' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.55;
    transition: opacity 0.12s;
}
.es-date-text:hover .es-date-pick-icon { opacity: 1; }

/* Saat yanındaki kalem ikonu — font değil SVG */
.es-time-edit-icon {
    display: inline-block;
    width: 11px;
    height: 11px;
    margin-left: 4px;
    vertical-align: middle;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23009687' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5L17 3z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.5;
    transition: opacity 0.12s;
}
.es-time-chip.class-session-selected-time span:hover .es-time-edit-icon { opacity: 1; }

/* Saat chip */
.es-time-chip.class-session-selected-time {
    font-size: 13px;
    font-weight: 600;
    text-align: right;
    flex-shrink: 0;
}
.es-time-chip.class-session-selected-time span {
    font-size: 13px;
    color: #009687;
    margin-left: 0;
    cursor: pointer;
    padding: 3px 10px;
    border-radius: 12px;
    background: #e8f7f5;
    border: 1px solid #b2dfdb;
    transition: background 0.12s;
    display: inline-block;
}
.es-time-chip.class-session-selected-time span:hover {
    background: #c8ebe8;
    color: #00695c;
}

/* Eğitmen satırı — .es-resource-section (Kaynak, isteğe bağlı) AYNI görsel
   yapıyı paylaşır, ama "boş" uyarı stilini (es-coach-empty) almaz — kaynak
   seçilmemiş olması eğitmensiz olmak gibi bir sorun değil. */
.es-coach-section, .es-resource-section {
    cursor: pointer;
    transition: background 0.12s;
    user-select: none;
}
.es-coach-section:hover, .es-resource-section:hover { background: #f5f7fa; }
/* Eğitmen seçilmemiş — belirgin uyarı */
.es-coach-section.es-coach-empty {
    background: #fff8f0;
    border-left: 3px solid #fd7e14;
    border-radius: 0 6px 6px 0;
}
.es-coach-section.es-coach-empty:hover { background: #fff1e0; }
.es-coach-section.es-coach-empty .es-coach-name {
    color: #c85a00;
    font-weight: 600;
}
.es-coach-section.es-coach-empty .es-coach-name::before {
    content: '';
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 6px;
    vertical-align: -2px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c85a00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E") center/contain no-repeat;
}
.es-coach-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.es-coach-name {
    font-size: 14px;
    font-weight: 500;
    color: #343a41;
}
.es-coach-arrow {
    font-size: 20px;
    color: #ced4da;
    line-height: 1;
}

/* Eylem butonları
   display kasıtlı olarak !important DEĞİL */
.es-actions {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 16px;
    border-bottom: 1px solid #e8ecef;
    justify-content: flex-start;
    margin: 0;
}
.es-btn {
    display: none; /* JS inline-flex yapar */
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 7px 14px;
    border-radius: 6px;
    border: none;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: filter 0.12s, transform 0.08s;
    white-space: nowrap;
    line-height: 1.3;
}
.es-btn:active { transform: scale(0.97); }
.es-btn:hover  { filter: brightness(0.92); }

.es-btn-primary { background: #0b6ffd; color: #fff; }
.es-btn-done    { background: #198754; color: #fff; }
.es-btn-cancel  { background: #dc3545; color: #fff; }
.es-btn-suspend { background: #fd7e14; color: #fff; }
.es-btn-undo    { background: #6c757d; color: #fff; }
.es-btn-danger  { background: #dc3545; color: #fff; }
.es-btn-ghost   { background: #fff; color: #495057; border: 1px solid #dee2e6; }
/* Eğitmensiz: buton görünür ama etkisiz görünür */
.es-btn-needs-coach { opacity: 0.35; cursor: default !important; }
/* Kaydet: değişiklik yoksa pasif */
.es-btn-save-unchanged { opacity: 0.35; cursor: default !important; pointer-events: none; }
/* es-btn-save-sep artık kullanılmıyor (Kaydet es-save-bar'a taşındı) */

/* ── Kaydet + Sil alt çubuğu ── */
.es-save-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px 14px;
    border-top: 1px solid #e8ecef;
}

.es-save-bar .update {
    flex: 1;
    height: 42px;
    font-size: 14px;
    border-radius: 8px;
    min-width: 0;
}

/* Kaydet görünür olduğunda flex item olarak davransın */
.es-save-bar .update[style*="inline-flex"],
.es-save-bar .update[style*="flex"] {
    display: flex !important;
}

.es-save-bar .takvim-delete-session-wrap {
    flex-shrink: 0;
    margin: 0;
    padding: 0;
    border: none;
    text-align: unset;
}

/* Tamamlanmış / İptal edilmiş seans — düzenleme kilidi */
.es-edit-locked .es-datetime-section,
.es-edit-locked .es-coach-section,
.es-edit-locked .es-resource-section {
    pointer-events: none;
    opacity: 0.45;
}
.es-edit-locked .es-nav-btn { visibility: hidden; }
.es-edit-locked .es-date-pick-icon,
.es-edit-locked .es-time-edit-icon { display: none; }
.es-edit-locked .es-coach-section,
.es-edit-locked .es-resource-section { cursor: default; }
.es-edit-locked .takvim-delete-session-wrap { display: none !important; }
.es-edit-locked .es-save-bar .takvim-delete-session-wrap { display: none !important; }

/* İptal / Askı türü */
.es-cancel-area { padding: 16px; box-sizing: border-box; }
.es-cancel-title {
    font-size: 11px;
    font-weight: 700;
    color: #7a7a7a;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 12px;
}
.es-cancel-options {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 4px;
}
.es-cancel-option {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 11px 13px;
    border: 1.5px solid #dee2e6;
    border-radius: 7px;
    cursor: pointer;
    transition: border-color 0.12s, background 0.12s;
}
.es-cancel-option:hover {
    border-color: #0b6ffd;
    background: #f0f5ff;
}
.es-cancel-option input[type="radio"] {
    margin-top: 3px;
    flex-shrink: 0;
    accent-color: #0b6ffd;
}
.es-cancel-option-title {
    font-size: 13px;
    font-weight: 600;
    color: #343a41;
    margin-bottom: 2px;
}
.es-cancel-option-desc {
    font-size: 11px;
    color: #7a7a7a;
}
.es-cancel-area .es-actions { border-bottom: none; }

/* Silme onay alanı */
.es-delete-area { padding: 16px; box-sizing: border-box; }
.es-delete-area .es-actions { border-bottom: none; }

/* Düşük ders uyarısı */
/* ── Hata toast bildirimi ────────────────────────────────────────── */
.app-error-toast {
    position: fixed;
    bottom: 24px;
    right: 24px;
    max-width: 340px;
    background: #1e293b;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    padding: 12px 18px;
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.22);
    z-index: 99999;
    opacity: 0;
    transform: translateY(12px);
    transition: opacity 0.22s, transform 0.22s;
    pointer-events: none;
}
.app-error-toast-show {
    opacity: 1;
    transform: translateY(0);
}

/* ── Modern onay penceresi (2026-07-07) — native confirm() yerine ── */
.app-confirm-overlay {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(15, 23, 42, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100001;
    padding: 20px;
    box-sizing: border-box;
    animation: app-confirm-fade-in 0.15s ease-out;
}
@keyframes app-confirm-fade-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.app-confirm-box {
    background: #fff;
    border-radius: 14px;
    padding: 24px;
    max-width: 380px;
    width: 100%;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
    animation: app-confirm-pop-in 0.16s ease-out;
}
@keyframes app-confirm-pop-in {
    from { opacity: 0; transform: scale(0.94); }
    to   { opacity: 1; transform: scale(1); }
}
.app-confirm-title {
    font-size: 16px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 8px;
}
.app-confirm-message {
    font-size: 14px;
    color: #495057;
    line-height: 1.5;
}
.app-confirm-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 20px;
}
.app-confirm-cancel,
.app-confirm-ok {
    height: 38px;
    padding: 0 18px;
    border-radius: 8px;
    border: none;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: filter 0.13s, transform 0.1s;
}
.app-confirm-cancel:active,
.app-confirm-ok:active {
    transform: scale(0.96);
}
.app-confirm-cancel {
    background: #f0f0f0;
    color: #444;
}
.app-confirm-cancel:hover {
    filter: brightness(0.93);
}
.app-confirm-ok {
    background: #009687;
    color: #fff;
}
.app-confirm-ok:hover {
    filter: brightness(0.92);
}
.app-confirm-ok-danger {
    background: #e74c3c;
}
.app-confirm-ok-danger:hover {
    filter: brightness(0.9);
}

.es-low-alert {
    margin: 12px 16px 0;
    border-radius: 8px;
    background: #fff3cd;
    border: 1px solid #ffc107;
    padding: 10px 16px;
    box-sizing: border-box;
    font-size: 13px;
    font-weight: 500;
    color: #856404;
    /* Flex özellikleri JS display:flex koyunca devreye girer */
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
}
.es-low-alert > div {
    flex: 1;
    min-width: 0;
}

.es-low-alert button {
    flex-shrink: 0;
    background: #ffc107;
    color: #4a3000;
    border: none;
    border-radius: 6px;
    padding: 5px 12px;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}
.es-low-alert button:hover { filter: brightness(0.92); }

/* Grup tamamlama onayı */
.es-confirm-done {
    margin: 12px 16px 0;
    border-radius: 7px;
    background: #fff9e6;
    border: 1.5px solid #ffd666;
    padding: 12px 14px;
}
.es-confirm-done .desc {
    color: #b45309;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 10px;
}
.es-confirm-done .buttons {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}
.es-confirm-done .button {
    padding: 7px 14px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 6px;
    margin-right: 0 !important;
}

/* ── Takvim: Eğitmen seçici ─────────────────────────────────── */
.tus-wrapper {
    width: 300px;
    display: flex;
    flex-direction: column;
    gap: 0;
}
.tus-avatar-none {
    background: #bdbdbd;
    font-size: 16px;
    font-weight: 400;
    color: #fff;
}
.tus-none-card {
    border-bottom: 1px solid var(--border-color, #eee);
    margin-bottom: 4px;
    padding-bottom: 4px;
}

/* ── Üye: Düzenle satırı (en altta, border yok) ─────────────── */
.mpc-edit-row {
    display: flex;
    justify-content: stretch;
    padding: 12px 16px 16px;
}
.mpc-edit-btn {
    flex: 1;
    background: #f5f7fa;
    color: #343a41;
    border: 1px solid #dee2e6;
    border-radius: 7px;
    padding: 9px 16px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s;
    text-align: center;
}
.mpc-edit-btn:hover {
    background: #e8ecf0;
}

/* ── Üye: Bekleyen dersler ──────────────────────────────────── */
.mpc-session-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px solid var(--border-color, #eee);
}
.mpc-session-row:last-child {
    border-bottom: none;
}
.mpc-session-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 0;
}
.mpc-session-date {
    font-size: 13px;
    font-weight: 500;
    color: var(--text-primary, #212121);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mpc-session-coach {
    font-size: 12px;
    color: var(--text-secondary, #757575);
}
/* Geçmiş tarihli ders satırı */
.mpc-session-past {
    background: #fff8e1;
    border-radius: 6px;
    padding-left: 8px;
    margin-left: -8px;
    border-left: 3px solid #ffa000;
}
.mpc-session-past-badge {
    display: inline-block;
    margin-left: 6px;
    background: #ffa000;
    color: #fff;
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 10px;
    font-weight: 600;
    vertical-align: middle;
    line-height: 1.6;
}

.mpc-session-actions {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-shrink: 0;
}
.mpc-session-complete-btn {
    background: #fff;
    color: #2e7d32;
    border: 1px solid #81c784;
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s, color 0.15s;
}
.mpc-session-complete-btn:hover {
    background: #2e7d32;
    color: #fff;
    border-color: #2e7d32;
}
.mpc-session-delete-btn {
    background: #fff;
    color: #c62828;
    border: 1px solid #e57373;
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.15s, color 0.15s;
}
.mpc-session-delete-btn:hover {
    background: #c62828;
    color: #fff;
    border-color: #c62828;
}
.mpc-session-group-badge {
    background: #e3f2fd;
    color: #1565c0;
    border-radius: 6px;
    padding: 3px 8px;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
}

/* ── Düzenle butonu boşluğu ── */
.member-profile-card .page-top-right-button {
    padding-right: 14px;
    padding-bottom: 14px;
}

/* ── Notlar ── */
.mpc-notes{
    margin-top: 8px;
}
.mpc-notes-label{
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .8px;
    text-transform: uppercase;
    color: #adb5bd;
    margin-bottom: 6px;
}
.mpc-notes-value{
    font-size: 13px;
    color: #6c757d;
    line-height: 1.6;
    white-space: pre-wrap;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
    padding: 10px 14px;
}

/* ── form-t1-tab-group: mod seçici buton grubu ─────────────────────── */
.form-t1-tab-group{
    display: flex;
    gap: 6px;
    margin-bottom: 4px;
}
.form-t1-tab{
    flex: 1;
    padding: 8px 0;
    border: 1px solid #dee2e6;
    border-radius: 6px;
    background: #fff;
    color: #6c757d;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
}
.form-t1-tab:hover{
    background: #f8f9fa;
    color: #343a40;
}
.form-t1-tab.active{
    background: #405468;
    border-color: #405468;
    color: #fff;
}
.form-t1-radio1{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    height: 30px;
}
.form-t1-radio1-title{
    width: 150px;
}
.form-t1-radio1-radio{
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}
.form-t1-radio1-radio input{
    margin-right: 3px;
}

.form-t1-radio1-radio.category, .form-t1-radio1-radio.state{
    flex-direction: column;
    align-items: flex-start;
}

.form-t1-radio2{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
}
.form-t1-radio2-radio{
    width: 100%;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
}
.form-t1-radio2-radio label{
    height: 30px;
}
.form-t1-radio2-radio span{
    color: #009687;
}

.form-t2-input-area{
    width: 100%;
    margin-bottom: 15px;
}
.form-t2-input-area label{
    font-weight: 500;
    font-size: 15px;
    min-width: 100px;
}

/* 2026-08-24 (kullanıcı: "çok kötü görünüyor" — İşletme Yönetimi'ndeki
   "İptal edilen derslerde de komisyon öde" seçeneği) — uzun metinli bir
   checkbox+etiket çifti, .form-t1-input-area/.form-t2-input-area label'a
   uygulanan 500/15px "alan başlığı" stilini miras alınca metin sarıldığında
   checkbox'la hizası bozuluyordu. Bu satır kendi hizalamasını/tipografisini
   taşıyor — ana form alanları (Grup Dersi Ücreti vb.) gibi DEĞİL, ikincil/
   isteğe bağlı bir ayar gibi görünsün diye bilerek daha sade. Kaskad
   sırası bilerek burada — yukarıdaki .form-t1-input-area/.form-t2-input-area
   label kurallarını override etmesi için AYNI özgüllükte ama SONRA gelmeli. */
.form-checkbox-row {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    cursor: pointer;
}
.form-checkbox-row input[type="checkbox"] {
    margin-top: 3px;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    cursor: pointer;
}
.form-checkbox-row label {
    font-weight: 400 !important;
    font-size: 13px !important;
    min-width: 0 !important;
    color: #607D8B;
    line-height: 1.4;
    cursor: pointer;
}

.form-t2-content-full{
    background-color: #405467;
    width: 100%;
}
.form-t2-color-selector{
    width: 100%;
    line-height: 40px;
    text-align: center;
    color: #fff;
    cursor: pointer;
}



.loading {
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.2s;
}

.loading-bg {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #000;
    opacity: 0.7;
}

.loading-c {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    text-align: center;
    height: 100vh;
    color: #fff;
    font-size: 20px;
}

.loading-tout{
        background-color: #F44336;
    font-size: 16px;
    padding: 5px 15px;
    margin-top: 25px;
    border-radius: 10px;
    display: none;
    text-align: center;
    cursor: pointer;
}

.app{
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-x: hidden;
    min-height: 100dvh;
    align-items: stretch;
}
.app-menu{
    width: 250px;
    background-color: #343a41;
    overflow-y: auto;
    color: #fff;
    flex: 0 0 auto;
    transition: width 0.3s ease;
}
.app-menu-title{
    width: 230px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border-bottom: 1px solid #495057;
    color: #d6d7d8;
    height: 60px;
    font-size: 20px;
    margin-bottom: 0;
    cursor: pointer;
    user-select: none;
    transition: color 0.15s;
}
.app-menu-title:hover { color: #fff; }
.app-menu-title-txt{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 190px;
}
.app-menu-title-arrow{
    font-size: 18px;
    opacity: 0.75;
    flex-shrink: 0;
    line-height: 1;
    transition: transform 0.2s, opacity 0.15s;
}
.app-menu-title:hover .app-menu-title-arrow {
    opacity: 1;
}

/* Şirket switcher dropdown */
.app-menu-company-list{
    margin: 0 10px;
    border-radius: 8px;
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.25s ease, margin-top 0.25s ease, margin-bottom 0.25s ease;
    background-color: #2b3036;
    margin-top: 0;
    margin-bottom: 20px; /* Dropdown kapalıyken menü öğelerine boşluk */
}
.app-menu-company-list.open{
    max-height: 300px;
    margin-top: 6px;
}
.company-switcher-item{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    font-size: 14px;
    color: #c8cacc;
    cursor: pointer;
    transition: background 0.15s;
}
.company-switcher-item:hover{ background-color: #3a4149; color: #fff; }
.company-switcher-item.current{ color: #fff; font-weight: 600; }
.company-switcher-check{ color: #6fcf97; font-size: 13px; }
.company-switcher-loading,
.company-switcher-empty,
.company-switcher-error{
    padding: 12px 14px;
    font-size: 13px;
    color: #888;
    text-align: center;
}
.app-menu-item{
    display: flex;
    height: 40px;
    margin: 10px 10px 0 10px;
    color: #fff;
    text-decoration: none;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    cursor: pointer;
    border-radius: 5px;
}
.app-menu-item:hover{
    background-color: #494e54;
}
.app-menu-item-selected{
    background-color: #40454b;
}
.app-menu-item-selected{
    margin-right: 0;
    border-right: 5px solid #1cbb9d;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    background-color: #40454b;
}
.app-menu-item-selected .app-menu-item-subicon{
    transform: rotate(90deg);
}
.app-menu-subitem{
    height: 0;
    overflow: hidden;
    border-right: 5px solid #1cbb9d;
    transition: height 0.3s ease;
}
.app-menu-subitem-selected{
    height: fit-content;
}
.app-menu-subitem .app-menu-subitem-item:last-child{
    border-bottom-left-radius: 5px;
}
.app-menu-subitem-item{
    display: flex;
    height: 40px;
    margin: 0 0 0 10px;
    color: #fff;
    text-decoration: none;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    cursor: pointer;
    background-color: #40454b;
}
.app-menu-subitem-item:hover{
    background-color: #494e54;
}
.app-menu-subitem-item-selected{
    background-color: #494e54;
}
.app-menu-subitem-item-icon{
    width: 40px;
    height: 40px;
    display: inline-block;
    background-image: url('/img/circle-regular-full.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 15px;
    filter: invert(96%) sepia(3%) saturate(1917%) hue-rotate(184deg) brightness(83%) contrast(94%);
}


.app-menu-item-icon{
    width: 40px;
    height: 40px;
    display: inline-block;
    background-image: url('/img/users-solid-full.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 20px;
    filter: invert(96%) sepia(3%) saturate(1917%) hue-rotate(184deg) brightness(83%) contrast(94%);
}.app-menu-item-icon-dashboard {
    background-image: url('/img/chart-line-solid-full.svg');
}.app-menu-item-icon-calendar {
    background-image: url('/img/calendar-days-solid-full.svg');
}
.app-menu-item-icon-user{
    background-image: url('/img/user-solid-full.svg');
}
.app-menu-item-icon-users{
    background-image: url('/img/users-solid-full.svg');
}
.app-menu-item-icon-company{
    background-image: url('/img/briefcase-solid-full.svg');
}
.app-menu-item-icon-payment{
    background-image: url('/img/credit-card-solid-full.svg');
}
.app-menu-item-icon-instructor{
    background-image: url('/img/circle-user-regular-full.svg');
}
.app-menu-item-icon-expense {
    background-image: url('/img/briefcase-solid-full.svg');
    /* Ayrı ikon yoksa şimdilik briefcase kullanılır */
}

.app-menu-item-txt{
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.app-menu-item-badge-dot{
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #ef4444;
    flex-shrink: 0;
    margin-right: 10px;
    box-shadow: 0 0 0 2px #2f3338;
}
.app-menu-item-subicon{
    width: 40px;
    height: 40px;
    display: inline-block;
    background-image: url('/img/chevron-right-solid-full.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 20px;
    filter: invert(96%) sepia(3%) saturate(1917%) hue-rotate(184deg) brightness(83%) contrast(94%);
    transition: transform 0.3s ease;
}

.app-content{
    width: calc(100% - 250px);
    min-width: calc(100% - 250px);
    flex: 0 0 auto;
    height: 100%;
    overflow-y: auto;
    transition: min-width 0.3s ease;
}
.app-content-menublock{
    display: none;
    position: absolute;
    top:0;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: #000;
    opacity: 0;
    transition: opacity 0.3s ease, left 0.3s ease;
}

.app-content-header{
    height: 50px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    border-bottom: 1px solid #dee2e6;
}
.app-content-header-left{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}
.app-content-header-menu{
    width: 50px;
    height: 50px;
    background-image: url('/img/bars-solid-full.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 20px;
    filter: invert(34%) sepia(9%) saturate(0%) hue-rotate(181deg) brightness(104%) contrast(88%);
    margin-left: 10px;
    cursor: pointer;
}
.app-content-header-right{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
}
.app-content-header-name{
    margin-right: 20px;
    cursor: pointer;
}
.app-content-header-profil{
    margin-right: 20px;
    width: 30px;
    height: 30px;
    border-radius: 15px;
    background-image: url('/img/user-solid-full.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 20px;
    cursor: pointer;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

.page-top-right-button{
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
}
.page-top-right-button-left{
    justify-content: flex-start;
}
.page-top-right-button a, .page-top-right-button .page-top-right-button-btn, .popup-t-content-header a{
    display: flex;
    text-decoration: none;
    color: #fff;
    background-color: #0b6ffd;
    height: 40px;
    padding: 0 15px;
    margin-top: 20px;
    margin-right: 20px;
    border-radius: 7px;
    cursor: pointer;
    align-items: center;
    text-align: center;
    line-height: 16px;
}
.popup-t-content-header a{
    margin-top: 0;
    margin-right: 5px;
}
.page-top-right-button a:hover, .page-top-right-button .page-top-right-button-btn:hover, .popup-t-content-header a:hover{
    background-color: #0b5ed7;
}
.popup-content-default-area .page-top-right-button a, .popup-content-default-area .page-top-right-button .page-top-right-button-btn{
    background-color: #198754;
    margin-right: 0;
}
.popup-content-default-area .page-top-right-button a:hover, .popup-content-default-area .page-top-right-button .page-top-right-button-btn:hover{
    background-color: #309c69;
}
.page-top-right-button-delete{
    display: none;
    background-color: #F44336 !important;
}
.page-top-right-button-delete:hover{
    background-color: #ff1100 !important;
}

.session-editsession-buttons {
    width: 100%;
    display: flex;
    flex-direction: column;
}.session-editsession-buttons .page-top-right-button-btn {
    text-decoration: none;
    color: #fff;
    background-color: #0b6ffd;
    line-height: 40px;
    padding: 0 15px;
    margin-top: 20px;
    margin-right: 20px;
    border-radius: 7px;
    cursor: pointer;
}.session-editsession-buttons .page-top-right-button-btn.set_change_-1 {
    background-color: #F44336;
}.session-editsession-buttons .page-top-right-button-btn.set_change_-2 {
    background-color: #F44336;
}.session-editsession-buttons .page-top-right-button-btn.set_change_1{
    background-color: #4CAF50;
}.session-editsession-buttons .page-top-right-button-btn.set_change_0 {
    background-color: #F44336;
}.session-editsession-buttons .page-top-right-button-btn:last-child {
    margin-left: auto;
}

.content-area{
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
}

.home-day-branch-area{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-top: 15px;
}
.home-day-selectedday{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}.home-day-selectedday-txt {
    display: flex;
    font-size: 23px;
    /* 2026-08-31 (kullanıcı raporu: "gün isminin uzunluğuna göre oklar yer
       değiştiriyor") — min-width DEĞİL sabit width: "Pazartesi"/"Cumartesi"
       gibi uzun gün isimleriyle "Salı" gibi kısa isimler arasında kutu
       genişliği artık DEĞİŞMİYOR, ok butonlarının konumu sabit kalıyor. */
    width: 230px;
    text-align: center;
    font-weight: 500;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}.home-day-selectedday-txt span {
    font-size: 12px;
    color: #347cff;
    font-weight: normal;
}
.home-day-selectedday-btn{
    width: 30px;
    height: 30px;
    padding: 0 20px;
    background-image: url('/img/chevron-right-solid-full.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 20px;
    cursor: pointer;
}
.home-day-selectedday-btn:hover{
    filter: invert(58%) sepia(84%) saturate(401%) hue-rotate(119deg) brightness(88%) contrast(91%);
}
.home-day-selectedday .home-day-selectedday-btn:first-child{
    transform: rotate(180deg);
}

/* 2026-08-31 (kullanıcı isteği: "iki buton alt alta görünsün, mobilde de
   yan tarafa sığsın, tasarımı daha şık yap") — dikey/kompakt ikili pill;
   dar olduğu için mobilde bile gün seçicinin YANINDA kalabiliyor, alta
   düşmüyor (bkz. aşağıdaki mobil medya sorgusundaki :has() override'ı). */
/* 2026-09-11 (kullanıcı isteği: "alt alta 4 buton oldu, onları yan yana 2
   buton olarak yapalım") — dış kapsayıcı artık 2 sütunu YATAY diziyor,
   her sütun kendi içinde dikey (bkz. .takvim-quick-jump-col). */
.takvim-quick-jump {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 10px;
    flex-shrink: 0;
    margin-right: 20px;
}
.takvim-quick-jump-col {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 5px;
}
.takvim-quick-jump-btn {
    padding: 4px 14px;
    border-radius: 999px;
    background-color: transparent;
    border: 1.5px solid #347cff;
    color: #347cff;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.15s, color 0.15s;
}
.takvim-quick-jump-btn:hover {
    background-color: #347cff;
    color: #fff;
}
.takvim-fullscreen-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}
/* 2026-09-11 (kullanıcı isteği: "takvim ve tam ekran butonlarını biraz
   büyütelim") — ikon-only oldukları için metin pill'lerinden daha küçük
   görünüyorlardı, iç boşluk + ikon boyutu artırıldı. */
.takvim-datepicker-btn,
.takvim-fullscreen-btn {
    padding: 7px 16px;
}
.takvim-datepicker-btn i,
.takvim-fullscreen-btn i {
    font-size: 15px;
}

/* 2026-09-11 (kullanıcı isteği: "doğrudan bir güne veya haftaya
   götürecek bir takvim seçicimiz yok") — ikon-only buton, .takvim-fullscreen-btn
   ile AYNI desen; flatpickr'ın bağlandığı gerçek input tamamen görünmez
   (buton kendisi tıklama hedefi, bkz. _partner-takvim.js). */
.takvim-datepicker-btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.takvim-date-jump-input {
    position: absolute;
    top: 100%;
    left: 0;
    width: 1px;
    height: 1px;
    padding: 0;
    border: none;
    opacity: 0;
    pointer-events: none;
}
/* 2026-09-11 (kullanıcı isteği: "haftalık görünümdeyse takvimde haftalık
   seçim düzeni görünsün, bir günün üzerine geldiğimde o haftanın tüm
   günleri seçili görünsün") — flatpickr'ın kendi "hafta seçimi" modu/eklentisi
   YOK, ama onDayCreate ile fare üzerine gelindiğinde o haftanın 7 gününe
   bu class eklenip/kaldırılarak AYNI görsel etki taklit ediliyor (bkz.
   _partner-takvim.js: _initTakvimDatePicker). Sadece haftalık görünümde
   aktif — günlükte normal tek-gün flatpickr hover'ı kullanılır. */
.flatpickr-day.takvim-week-hover {
    background: #e3ecff;
    border-color: #c7d9ff;
}

/* 2026-09-10 (kullanıcı isteği: "üye takvimi ekranda tamamen sığacak
   şekilde, sağa sola kaydırma olmasın, sadece yukarı aşağı") — SAYFA İÇİ
   tam ekran modu: kenar menü + üst bar gizlenir, takvim tablosu
   table-layout:fixed ile sütunları otomatik sıkıştırıp yatay taşmayı
   engeller (bkz. _partner-takvim.js: window.takvimToggleFullscreen). */
body.takvim-fullscreen .app-menu {
    width: 0 !important;
    overflow: hidden !important;
}
body.takvim-fullscreen .app-content-menublock {
    display: none !important;
    opacity: 0 !important;
}
body.takvim-fullscreen .app-content {
    width: 100% !important;
    min-width: 100% !important;
}
body.takvim-fullscreen .app-content-header {
    display: none !important;
}
body.takvim-fullscreen .home-branch-lessons {
    overflow-x: hidden !important;
}
body.takvim-fullscreen .home-today-program table {
    table-layout: fixed;
    width: 100%;
    min-width: 0 !important;
}
body.takvim-fullscreen .home-today-program th,
body.takvim-fullscreen .home-today-program td {
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}
body.takvim-fullscreen .home-today-program th:first-child,
body.takvim-fullscreen .home-today-program td:first-child {
    width: 56px;
}

/* 2026-08-31 (kullanıcı isteği) — takvimde o gün gösteriliyorken (hangi
   navigasyonla ulaşıldığına bakılmaksızın) kalıcı "seçili" görünüm. */
.takvim-quick-jump-btn-active {
    background-color: #347cff;
    color: #fff;
}

.home-branches-button{
    margin-left: 20px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}
.home-branches-button div{
    text-decoration: none;
    color: #fff;
    background-color: #607D8B;
    line-height: 40px;
    padding: 0 20px;
    margin-right: 10px;
    cursor: pointer;
}
.home-branches-button-selected{
    background-color: #1cbb9d !important;
}

.home-branch-lessons-area{
    width: 100%;
}
.home-branch-lessons{
    display: block;
    width: 100%;
    margin-top: 20px;
        overflow-x: auto;
}

/* 2026-08-27 (kullanıcı raporu: "takvimdeki içerikler saat bilgisinin
   üzerinde görünüyor") — kök neden: `.home-today-program-class-session`
   kendi `::before` rozetini (1:1/GRUP) konumlandırmak için `position:
   relative` taşıyor; bu, tabloyu YATAY KAYDIRIP saat sütunu sticky ile
   sabitlenince, boyama sırasında (CSS2.1 Ek E) hem sticky saat hücresi HEM
   DE ders kartı "positioned, z-index:auto" aynı adıma düşüyor — o adım
   içinde sıralama DOM ağaç sırasına göre olduğu için, saat hücresinin
   İÇİNDE OLMAYAN (bir sonraki gün sütunundaki) kart, hücre içindeyken bile
   sticky saat hücresinin ÜSTÜNDE boyanıyordu. `isolation: isolate` bu
   tabloyu KENDİ stacking bağlamına alır — böylece aşağıdaki mobil
   kuraldaki sticky hücreye eklenecek küçük bir z-index ASLA dışarı (ör.
   `.popup-t`'ye, bkz. 2026-08-24'teki AYNI konudaki DAHA ÖNCEKİ hata) sızamaz. */
.home-today-program {
    isolation: isolate;
}

.home-today-program table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    min-width: 600px;
}

.home-today-program thead {
    color: #fff;
}

.home-today-program th {
    text-align: center;
    white-space: nowrap;
    padding: 10px 12px;
    font-weight: 600;
    border-right: 1px solid rgba(255,255,255,0.2);
}
.takvim-th-date {
    font-size: 0.72em;
    font-weight: 400;
    color: rgba(255,255,255,0.45);
    margin-top: 2px;
    letter-spacing: 0.01em;
}

.takvim-th-clickable {
    cursor: pointer;
    transition: filter 0.12s;
}
.takvim-th-clickable:hover {
    filter: brightness(1.2);
}

/* 2026-09-01 (kullanıcı isteği: "masaüstü versiyonunda eğer takvim ekrana
   sığmazsa sağa sola kaydırma açılıyor aynı mantıkla saat alanını sabit
   tutalım mobil tarafta yaptığımız gibi") — bu kural eskiden SADECE mobil
   media query'sindeydi (bkz. aşağıdaki 2026-08-24/27 notları — sticky +
   yatay kaydırmada ders kartlarının üstte boyanma hatası ve köşe
   yuvarlamasının bozulması, ikisi de `isolation: isolate` ve
   `border-radius: 0` ile zaten çözülmüştü). `.home-branch-lessons`'ın
   `overflow-x: auto`'su masaüstünde de HER ZAMAN aktifti (dar pencere/çok
   sütunlu haftalık görünüm) — mobildeki AYNI sabit saat sütunu davranışı
   artık ekran boyutundan bağımsız, temel kural. */
.home-today-program th:first-child,
.home-today-program td:first-child {
    position: sticky;
    left: 0;
    z-index: 1;
}
.home-today-program th:first-child {
    /* 2026-09-01 (kullanıcı isteği: "saatlerin üstünde bulunan boş hücrenin
       sol üstündeki border-radius'ını 0 yapmanı istemiştim") — masaüstünde
       "nadiren kaydırılıyor, yuvarlak köşe kalsın" diye 12px bırakılmıştı
       (bkz. mobil media query'deki 2026-08-24 notu — orada AYNI sebeple
       zaten 0'lanmıştı); kullanıcı masaüstünde de sıfır istiyor, iki ekran
       boyutu artık tutarlı. */
    border-radius: 0;
    /* Header hücresinin (grup ikonları/boş köşe) önceden arka planı yoktu —
       sticky olunca ALTINDAN kayan renkli sütunlar görünmesin diye body'deki
       td:first-child ile AYNI nötr rengi veriyoruz (bkz. üstteki not). */
    background: #f1f3f5;
    /* 2026-09-01 (kullanıcı isteği: "saat alanının en üstündeki boş
       hücrenin sağ üst kısmındaki border'ı iptal edelim") — `.home-today-
       program th`'nin genel `border-right: 1px solid rgba(255,255,255,0.2)`
       kuralı koyu (renkli) gün başlıklarına göre tasarlanmıştı; bu hücre
       artık açık gri (#f1f3f5) olduğu için aynı yarı saydam beyaz çizgi
       burada uyumsuz/donuk bir çizgi gibi görünüyordu. */
    border-right: none;
}
.home-today-program th:last-child {
    border-radius: 0 12px 0 0;
    border-right: none;
}

.home-today-program td {
    min-width: 200px;
    /* 2026-09-10 (kullanıcı raporu: "çok üyeli grup dersleri çok geniş
       durduğu için takvim sütunları geniş kalıyor") — üye listesi artık alt
       satırlara taşabildiği (bkz. .cs-member-names) için sütun genişliği
       burada tavana bağlanır, tek satırda sıkıştırıp sütunu genişletmek
       yerine kartın kendisi dikeyde büyür. */
    max-width: 240px;
    text-align: center;
    padding: 5px 10px;
    min-height: 70px;
    border-bottom: 1px solid #dee2e6;
    border-right: 1px solid #f1f3f5;
    /* transition: background-color 0.2s; */
    cursor: pointer;
}

.home-today-program tr {
    height: 70px;
    vertical-align: middle;
}

.home-today-program td:first-child {
    min-width: unset;
    font-weight: 600;
    color: #343a42;
    background: #f1f3f5;
    border-right: 1px solid #dee2e6;
    font-size: 14px;
}

.home-today-program tbody tr:nth-child(even) td {
    background: #fdfdfd;
}

.home-today-program tbody tr:hover td {
    background: #edf2ff;
}
.home-today-program tbody tr td:hover {
    background: #dde7ff;
}
.home-today-program tbody tr td{
    vertical-align: top;
    text-align: center;
}



.home-today-program table thead tr th:first-child {
    width: 70px;
}
.home-today-program table thead tr th:last-child {
    width: 100%;
}

.content-full{
    width: 96%;
    margin: 30px auto;
    background-color: #fff;
    border-top: 3px solid #343a42;
    border-radius: 5px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}
.content-full-inside{
    padding: 15px 10px;
}

/* 2026-09-08 (kullanıcı isteği: "işletme yönetimi sayfası artık çok uzun
   oldu, o başlıkları açılır kapanır yapalım") — panel-isletme'deki HER
   .content-full bölümü başlığa tıklanınca aç/kapa; başlık içindeki link/
   butonlar (ör. "+ Yeni Şube Ekle") tıklaması toggle'ı TETİKLEMEZ — bkz.
   _partner-isletme.js: _isletmeInitCollapsibleSections. */
#panel-isletme .popup-t-content-header {
    cursor: pointer;
}
.isletme-collapse-chevron {
    display: inline-block;
    margin-right: 8px;
    font-size: 13px;
    color: #888;
    transition: transform .15s ease;
}
.content-full.isletme-section-collapsed .isletme-collapse-chevron {
    transform: rotate(-90deg);
}
.content-full.isletme-section-collapsed > .content-full-inside {
    display: none;
}
/* 2026-09-08 (kullanıcı isteği: "bir alan kapalıysa sağ üstteki ekleme
   butonları da görünmesin, sadece alan açıldığında görünsün") — başlıktaki
   TITLE dışındaki her şey (ör. "+ Yeni Şube Ekle" linki, şirket ID kutusu)
   sadece bölüm açıkken görünür. */
.content-full.isletme-section-collapsed > .popup-t-content-header > *:not(.popup-t-content-header-title) {
    display: none;
}
/* 2026-09-08 (kullanıcı isteği: "alanlar arası boşluk çok fazla onu da
   azalt") — kart aralığı çok sayıda kapalı bölümle üst üste toplanınca
   gereksiz uzun bir sayfa yaratıyordu, 30px'ten düşürüldü. */
#panel-isletme .content-full {
    margin: 14px auto;
}

.content-list-row{
    height: 45px;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    border: 1px solid #e4e4e4;
    border-top: 0;
}
.content-list-rows .content-list-row:nth-child(even){
    background-color: #f2f2f2;
}
.content-list-rows .content-list-row:hover{
    background-color: #f1faf8;
}
.content-list-row-pay0{
    background-color: #ffbfba;
}
.content-list-rows .content-list-row-pay0:nth-child(even){
    background-color: #ff9d94;
}
.content-list-row-pay1{
    background-color: #c6f8cd;
}
.content-list-rows .content-list-row-pay1:nth-child(even){
    background-color: #90ff9f;
}
.content-list-main-title{
    background-color: #405468;
    border: 0;
    color: #ECF0F1;
    /* padding: 0 10px; */
    font-weight: bold;
}
.content-list-title{
    flex: 1;
    margin-left: 10px;
    line-height: 45px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
}
.content-list-title-subs{
    color: #7e95ac;
    font-size: 13px;
    font-style: italic;
}
.content-list-info1 {
    width: 100px;
    margin-left: 10px;
    line-height: 17px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    text-align: center;
}
.content-list-buttons{
    display: flex;
    min-width: 45px;
    min-height: 45px;
    justify-content: flex-end;
}
.content-list-buttons div{
    width: 45px;
    height: 45px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 20px;
    cursor: pointer;
    filter: invert(17%) sepia(27%) saturate(306%) hue-rotate(172deg) brightness(96%) contrast(85%);
}
.content-list-buttons div:hover{
    filter: invert(30%) sepia(81%) saturate(5484%) hue-rotate(209deg) brightness(106%) contrast(98%);
}
.content-list-buttons-edit{
    background-image: url('/img/pen-to-square-solid-full.svg');
}
.content-list-buttons-info{
    background-image: url('/img/circle-info-solid-full.svg');
}
.content-list-buttons-delete{
    background-image: url('/img/square-minus-regular-full.svg');
    filter: invert(37%) sepia(94%) saturate(3471%) hue-rotate(343deg) brightness(99%) contrast(93%) !important;
}.content-list-buttons-confirm {
    background-image: url('/img/check-solid-full.svg');
    filter: invert(67%) sepia(11%) saturate(3015%) hue-rotate(73deg) brightness(90%) contrast(63%) !important;
}.content-list-buttons-openurl {
    background-image: url('/img/right-from-bracket-solid-full.svg');
    filter: invert(73%) sepia(62%) saturate(6929%) hue-rotate(185deg) brightness(99%) contrast(92%) !important;
}
.content-list-empty{
    width: 100%;
    text-align: center;
    color: #405567;
    font-weight: bold;
    margin: 10px 0;
}

/* Üye listesi wrapper'ının kendi padding'i yok — kart listesi kendi boşluğunu ayarlıyor */
#uyeler-member-list {
    padding: 0;
}

/* ── Onay Bekleyen Kayıt Formu Gönderimleri (2026-08-24) ─────────────── */
.uye-pending-approvals {
    margin: 14px 12px 0;
    background: #fff8ec;
    border: 1px solid #f5deb0;
    border-radius: 10px;
    padding: 10px 12px;
}
.uye-pending-title {
    font-size: 12.5px;
    font-weight: 700;
    color: #9a6400;
    margin-bottom: 8px;
}
.uye-pending-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 6px;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.12s;
}
.uye-pending-row:hover { background: rgba(255,255,255,.6); }
.uye-pending-row .uye-avatar { width: 32px; height: 32px; font-size: 12px; }
.uye-pending-name { flex: 1; font-size: 13.5px; font-weight: 600; color: #4a3418; }
.uye-pending-cta { font-size: 12.5px; font-weight: 600; color: #9a6400; }

/* ── Üye Listesi — Kart Tasarımı ──────────────────────────────────── */
.uye-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px;
}
.uye-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 14px 10px 10px;
    background: #fff;
    border: 1px solid #eaecf0;
    border-radius: 10px;
    transition: box-shadow 0.15s, border-color 0.15s;
    cursor: default;
}
.uye-card:hover {
    border-color: #c7d0dd;
    box-shadow: 0 2px 8px rgba(0,0,0,0.07);
}
/* Avatar */
.uye-avatar {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    cursor: pointer;
    user-select: none;
    letter-spacing: 0.02em;
}
/* İsim + meta */
.uye-info {
    flex: 1;
    min-width: 0;
    cursor: pointer;
}
.uye-name {
    font-size: 14px;
    font-weight: 600;
    color: #111827;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.uye-meta {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-top: 2px;
    font-size: 12px;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.uye-sep {
    color: #d1d5db;
    font-size: 10px;
}
.uye-contact {
    color: #6b7280;
}
.uye-last {
    color: #9ca3af;
    font-style: italic;
}
/* Ders hakkı badge */
.uye-badge {
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 12px;
    border-radius: 20px;
    cursor: pointer;
    white-space: nowrap;
}
.uye-badge-green {
    background: #dcfce7;
    color: #15803d;
}
.uye-badge-orange {
    background: #ffedd5;
    color: #c2410c;
}
.uye-badge-red {
    background: #fee2e2;
    color: #b91c1c;
}
.uye-badge-blue {
    background: #dbeafe;
    color: #1d4ed8;
}
.uye-badge-group {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
    cursor: pointer;
}
/* Detay / Düzenle butonları */
.uye-actions {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    gap: 2px;
}
.uye-actions .content-list-buttons-edit,
.uye-actions .content-list-buttons-info {
    width: 34px;
    height: 34px;
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: center center;
    border-radius: 6px;
    transition: background-color 0.12s, filter 0.12s;
}
.uye-actions .content-list-buttons-edit:hover,
.uye-actions .content-list-buttons-info:hover {
    background-color: #f0f4ff;
}

/* ══════════════════════════════════════════════════════════════════
   Üye Düzenleme Formu  (uye-edit-*)
   ══════════════════════════════════════════════════════════════════ */
.uye-edit-form {
    min-width: min(82vw, 840px);
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
}

/* ── Başlık: koyu zemin, avatar + isim önizleme ── */
.uye-edit-header {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 22px 24px 20px;
    background: linear-gradient(135deg, #1a3d29 0%, #236040 100%);
}

.uye-edit-header-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: rgba(255,255,255,0.15);
    border: 2px solid rgba(255,255,255,0.25);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 700;
    flex-shrink: 0;
    letter-spacing: 0.5px;
    transition: background 0.2s;
}

.uye-edit-header-info {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.uye-edit-header-name {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.uye-edit-header-sub {
    font-size: 13px;
    color: rgba(255,255,255,0.55);
}

/* ── Gövde: 2 sütun section kartları ── */
.uye-edit-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    padding: 20px 20px 8px;
    background: #f4f6f8;
}

/* ── Section kart ── */
.uye-edit-section {
    background: #fff;
    border: 1px solid #e4e8ee;
    border-radius: 10px;
    overflow: hidden;
}

.uye-edit-section-wide {
    grid-column: 1 / -1;
}

.uye-edit-section-title {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: #8a94a6;
    padding: 10px 16px 9px;
    background: #fafbfc;
    border-bottom: 1px solid #e4e8ee;
}

.uye-edit-section-body {
    padding: 14px 16px;
    display: flex;
    flex-direction: column;
    gap: 11px;
}

.uye-edit-section-body-row {
    flex-direction: row;
    align-items: flex-start;
    gap: 14px;
}

/* ── Alan ── */
.uye-edit-field {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.uye-edit-field-grow {
    flex: 1;
}

/* 2026-08-28 — .au-field-hint ile AYNI desen (bkz. o kuralın üzerindeki
   2026-08-24 tarihli not: ipucu metni etiketin içinde değil, girdinin
   altında ayrı bir satır olmalı, aksi halde etiketler farklı hizalanır). */
.uye-edit-field-hint {
    font-size: 11px;
    color: #9ba4b0;
    line-height: 1.4;
}

.uye-edit-field label {
    font-size: 12.5px;
    font-weight: 600;
    color: #4a5568;
    letter-spacing: 0.1px;
}

.uye-edit-field input:not([type="checkbox"]),
.uye-edit-field select,
.uye-edit-field textarea {
    width: 100%;
    height: 38px;
    padding: 0 11px;
    font-size: 14px;
    color: #1a202c;
    background: #fff;
    border: 1.5px solid #dce1ea;
    border-radius: 7px;
    box-sizing: border-box;
    transition: border-color 0.15s, box-shadow 0.15s;
    outline: none;
    appearance: none;
}

.uye-edit-field input:not([type="checkbox"]):focus,
.uye-edit-field select:focus,
.uye-edit-field textarea:focus {
    border-color: #009687;
    box-shadow: 0 0 0 3px rgba(0,150,135,0.12);
}

.uye-edit-field select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236b7280' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 11px center;
    padding-right: 32px;
    cursor: pointer;
}

/* ── Veli / Ebeveyn satırları (2026-08-04) ───────────────────────────── */
.uye-guardian-row {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}
.uye-guardian-row input {
    height: 38px;
    padding: 0 11px;
    font-size: 14px;
    color: #1a202c;
    background: #fff;
    border: 1.5px solid #dce1ea;
    border-radius: 7px;
    box-sizing: border-box;
    outline: none;
}
.uye-guardian-name       { flex: 1.2; }
.uye-guardian-phone-wrap { flex: 1; }
.uye-guardian-remove {
    width: 38px;
    height: 38px;
    border: 1.5px solid #dce1ea;
    border-radius: 7px;
    background: #fff;
    color: #dc3545;
    cursor: pointer;
    font-size: 14px;
    flex-shrink: 0;
}
.uye-guardian-remove:hover { background: #fff5f5; }

/* ── intl-tel-input (telefon ülke kodu seçici + formatlı numara) ──────── */
.iti-wrapper .iti { width: 100%; }
.iti-wrapper .iti input[type=tel] {
    width: 100%;
    padding-left: 90px !important;
}
.iti__flag-container { height: 100%; }
.iti__selected-flag  { height: 100%; background: transparent; }

.uye-edit-checkbox-label {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    margin-top: 22px; /* diğer alanlardaki label yüksekliğiyle hizalanması için */
    cursor: pointer;
}

.uye-edit-checkbox-label input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: #009687;
    cursor: pointer;
}

.uye-edit-field textarea {
    height: 68px;
    padding: 8px 11px;
    resize: vertical;
    line-height: 1.5;
}

/* ── Prefix'li input (ör. @ instagram) ── */
.uye-input-prefix-wrap {
    display: flex;
    align-items: stretch;
    border: 1.5px solid #dce1ea;
    border-radius: 7px;
    overflow: hidden;
    transition: border-color 0.15s, box-shadow 0.15s;
    background: #fff;
}

.uye-input-prefix-wrap:focus-within {
    border-color: #009687;
    box-shadow: 0 0 0 3px rgba(0,150,135,0.12);
}

.uye-input-prefix {
    display: flex;
    align-items: center;
    padding: 0 10px;
    background: #f4f6f8;
    border-right: 1.5px solid #dce1ea;
    color: #6b7280;
    font-size: 14px;
    font-weight: 600;
    user-select: none;
    white-space: nowrap;
}

.uye-input-prefix-wrap input {
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    flex: 1;
    min-width: 0;
}

/* ── İki alan yan yana ── */
.uye-edit-row {
    display: flex;
    gap: 10px;
}

.uye-edit-row .uye-edit-field {
    flex: 1;
    min-width: 0;
}

/* ── Alt buton çubuğu ── */
.uye-edit-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    padding: 14px 20px 18px;
    background: #f4f6f8;
    border-top: 1px solid #e4e8ee;
}

.uye-edit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 22px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, box-shadow 0.15s;
    user-select: none;
}

.uye-edit-btn-save {
    background: #198754;
    color: #fff;
}

.uye-edit-btn-save:hover {
    background: #157347;
    box-shadow: 0 2px 8px rgba(21,115,71,0.25);
}

.uye-edit-btn-delete {
    background: #fff;
    color: #dc3545;
    border: 1.5px solid #f5c2c7;
}

.uye-edit-btn-delete:hover {
    background: #fff5f5;
    border-color: #dc3545;
}

/* ── Mobil (2026-08-27: eskiden 640px, cihazlar arası tutarsızlığı önlemek
   için sitenin genel 768px mobil ayrım noktasına birleştirildi — bkz.
   .mvd-layout üzerindeki geniş not) ── */
@media (max-width: 768px) {
    .uye-edit-form {
        min-width: unset;
        width: 94vw;
    }
    .uye-edit-body {
        grid-template-columns: 1fr;
    }
    .uye-edit-section-wide {
        grid-column: 1;
    }
    .uye-edit-section-body-row {
        flex-direction: column;
        /* 2026-08-27 (kullanıcı raporu: "notlar alanı tam genişlikte
           görünmüyor") — bu oturumda AYNI kök nedenle daha önce iki kez
           bulunan hata: `.uye-edit-section-body-row`'un masaüstü kuralı
           (`align-items: flex-start`, satır modunda dikey hizalama içindi)
           `flex-direction: column`'a geçilince sessizce YATAY ekseni
           kontrol etmeye başlıyor, `.uye-edit-field-grow` içerik genişliğine
           küçülüp sağda boşluk bırakıyordu. */
        align-items: stretch;
    }
}

.content-search-area{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-end;
    align-items: center;
    height: 50px;
}
/* 2026-08-25 (kullanıcı bildirdi: "filtreleme yazısı ve kutusu tasarımı
   kötü görünüyor") — .content-full'a DOĞRUDAN bağlı (popup İÇİNDE
   OLMAYAN) kullanımlara 20px yatay boşluk veriyoruz — panelin geri kalanı
   (başlık, sekmeler) zaten bu boşluğu kullanıyor, arama kutusu tek
   istisnaydı, kenarlara yapışık duruyordu. `>` seçici BİLEREK: popup
   içindeki 3 kullanım (ör. gruba üye ekle seçici) zaten kendi popup
   padding'ine sahip, üstüne ikinci bir boşluk binmesin diye onlara
   dokunmuyor. */
.content-full > .content-search-area {
    padding: 0 20px;
}

/* 2026-08-28 (kullanıcı isteği: "isme göre ve eklenme tarihine göre
   sıralama butonları") — küçük, ikili bir "segmented toggle" — seçili olan
   dolu-mavi, diğeri nötr. `.content-search-area`'nın `justify-content:
   flex-end`'i tüm çocukları paket hâlinde sağa yasladığı için (header'daki
   `space-between` sorunundan FARKLI olarak) burada ekstra bir sarmalayıcıya
   gerek yok, sade bir margin yeterli. */
.uyeler-sort-group {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-right: 16px;
}
.uyeler-sort-label {
    font-size: 13px;
    color: #73879C;
    margin-right: 2px;
}
.uyeler-sort-btn {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 0 12px;
    border-radius: 7px;
    border: 1.5px solid #dfe3e8;
    background: #fff;
    color: #4a5568;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .12s, border-color .12s, color .12s;
}
.uyeler-sort-btn:hover { background: #f4f6f8; }
.uyeler-sort-btn.active {
    background: #0b6ffd;
    border-color: #0b6ffd;
    color: #fff;
}
/* 2026-09-09 (kullanıcı isteği: "gün üzerinden filtreleme yap, üste mesai
   günlerini yaz") — .uyeler-sort-group/.uyeler-sort-btn'daki AYNI segmented-
   toggle deseni, Gruplar sayfasının gün filtresi için. */
.gruplar-day-filter-group {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-right: 16px;
}
.gruplar-day-filter-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    min-width: 32px;
    padding: 0 10px;
    border-radius: 7px;
    border: 1.5px solid #dfe3e8;
    background: #fff;
    color: #4a5568;
    font-size: 12.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .12s, border-color .12s, color .12s;
}
.gruplar-day-filter-btn:hover { background: #f4f6f8; }
.gruplar-day-filter-btn.active {
    background: #0b6ffd;
    border-color: #0b6ffd;
    color: #fff;
}
.content-search-title{
    color: #73879C;
    margin-right: 7px;
}
.content-search-area input{
    width: 200px;
    padding: 0 12px;
    height: 36px;
    border: 1.5px solid #dfe3e8;
    border-radius: 8px;
    outline: none;
    font-size: 14px;
    transition: border-color .15s, box-shadow .15s;
}
.content-search-area input:focus {
    border-color: #009687;
    box-shadow: 0 0 0 3px rgba(0,150,135,.12);
}

.motiva-admin-page .content-full-inside {
    padding: 18px;
}

.motiva-admin-search {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
}

.motiva-admin-search label,
.motiva-admin-form label {
    font-weight: 600;
    color: #405468;
}

.motiva-admin-search input,
.motiva-admin-form input,
.motiva-admin-form select {
    height: 38px;
    border: 1px solid #cfd8dc;
    border-radius: 5px;
    padding: 0 10px;
    min-width: 220px;
}

.motiva-admin-search button,
.motiva-admin-search a,
.motiva-admin-form button {
    border: 0;
    border-radius: 5px;
    background-color: #0b6ffd;
    color: #fff;
    min-height: 38px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
}

.motiva-admin-search a {
    background-color: #6c757d;
}

.motiva-admin-alert {
    border-left: 4px solid #F44336;
    background-color: #fff1f0;
    color: #7f1d1d;
    padding: 10px 12px;
    margin-bottom: 14px;
}

.motiva-admin-alert-success {
    border-left-color: #198754;
    background-color: #eefaf3;
    color: #165f3b;
}

.motiva-admin-list .content-list-row {
    min-height: 45px;
    height: auto;
}

.motiva-admin-uid {
    color: #0b6ffd;
    text-decoration: none;
}

.motiva-admin-wide {
    width: 190px;
}

.motiva-admin-date {
    width: 135px;
}

.motiva-admin-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 12px;
}

.motiva-admin-summary div,
.motiva-admin-quota div {
    border: 1px solid #e3e8ed;
    border-radius: 6px;
    padding: 12px;
    background-color: #f9fbfc;
}

.motiva-admin-summary span,
.motiva-admin-quota span {
    display: block;
    color: #73879C;
    font-size: 12px;
    margin-bottom: 6px;
}

.motiva-admin-summary strong,
.motiva-admin-quota strong {
    display: block;
    color: #343a42;
    overflow-wrap: anywhere;
}

.motiva-admin-grid {
    width: 96%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 18px;
}

.motiva-admin-panel {
    width: 100%;
    margin: 0;
}

.motiva-admin-form {
    display: grid;
    grid-template-columns: minmax(130px, 170px) minmax(180px, 1fr);
    align-items: center;
    gap: 10px 14px;
}

.motiva-admin-form button {
    grid-column: 2;
    justify-content: center;
}

.motiva-admin-danger-form {
    margin-top: 18px;
}

.motiva-admin-danger-form button {
    background-color: #F44336;
}

.motiva-admin-quota {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.motiva-admin-quota small {
    display: block;
    margin-top: 6px;
    color: #73879C;
}

.motiva-admin-data-blocks {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.motiva-admin-data-block {
    border: 1px solid #e3e8ed;
    border-radius: 6px;
    overflow: hidden;
}

.motiva-admin-data-title {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    background-color: #405468;
    color: #fff;
}

.motiva-admin-data-title span {
    color: #d8e2ea;
    overflow-wrap: anywhere;
}

.motiva-admin-data-block pre {
    margin: 0;
    padding: 12px;
    max-height: 360px;
    overflow: auto;
    background-color: #f8fafc;
    color: #263238;
    font-size: 13px;
}

.member_group_member_list_new{
    display: none;
    width: 100%;
    text-align: center;
    background-color: #405567;
    color: #fff;
    padding: 10px 0;
    font-weight: 700;
}
.class-session-selected-datetime-add {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    text-align: center;
    width: 100%;
    font-size: 20px;
    margin-bottom: 20px;
    color: #343a41;
    margin-bottom: 20px;
}.class-session-selected-datetime-edit {
    display: flex;
        flex-direction: column;
            flex-wrap: nowrap;
            justify-content: flex-start;
    align-items: center;
    font-weight: bold;
    text-align: center;
    width: 100%;
    font-size: 20px;
    margin-bottom: 20px;
    color: #343a41;
    margin-bottom: 20px;
}
.class-session-selected-time{
    font-weight: bold;
    text-align: center;
    font-size: 20px;
    color: #343a41;
}.class-session-selected-time span {
    font-size: 30px;
    color: #009688;
    margin-left: 10px;
    cursor: pointer;
}.class-session-selected-time span:hover {
    color: #12ab9c;
}
.class-session-selected-date{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: center;
}
.class-session-selected-date .btn{
    width: 30px;
    height: 30px;
    padding: 0 20px;
    background-image: url(/img/chevron-right-solid-full.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 20px;
    cursor: pointer;
}
.class-session-selected-date .btn:hover {
    filter: invert(58%) sepia(84%) saturate(401%) hue-rotate(119deg) brightness(88%) contrast(91%);
}
.class-session-selected-date .previous {
    transform: rotate(180deg);
}

.class-session-select-member{
    font-style: italic;
    width: 100%;
}
.class-session-select-member button{
    text-align: center;
    margin: 0 auto;
    border: 0;
    background-color: #009687;
    color: #fff;
    padding: 0 20px;
    height: 35px;
}
.class-session-select-member button:hover{
    background-color: #13b9a8;
}
.class-session-select-member span{
    color: #2196F3;
    font-style: normal;
    text-decoration: underline;
    cursor: pointer;
}
.class-session-select-member-edit{
    display: flex;
    cursor: pointer;
    width: 100%;
    height: 40px;
    padding-right: 5px;
    padding-left: 10px;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    background-color: #009687;
    margin-bottom: 5px;
}
.class-session-select-member-edit span:first-child{
    font-style: normal;
    text-decoration: none;
    color: #fff;
}
.class-session-select-member-edit .info{
    width: 40px;
    height: 40px;
    background-image: url(/img/circle-info-solid-full.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 20px;
    margin-left: 20px;
    filter: invert(86%) sepia(100%) saturate(2%) hue-rotate(191deg) brightness(110%) contrast(97%);
}
.class-session-select-member-edit-alert{
    color: #ffffff;
    background-color: #00756a;
    margin-bottom: 10px;
    margin-top: -5px;
    padding: 3px 10px;
    font-size: 12px;
    width: 100%;
}
.class-session-select-membergroup-edit{
    font-weight: bold;
    background-color: #F44336;
}
.class-session-select-membergroup-edit .info{
    background-image: url(/img/pen-to-square-solid-full.svg);
}

.home-member-membergroup-selector-button{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    margin-top: 15px;
}
.home-member-membergroup-selector-button button{
    text-align: center;
    border: 0;
    background-color: #7f7f7f;
    color: #fff;
    padding: 0 20px;
    height: 35px;
    transition: background-color 0.2s;
}
.home-member-membergroup-selector-button .selected{
    background-color: #009687;
}
.home-member-membergroup-selector-button button:first-child{
    margin-right: 15px;
}

.home-session-selected-days label{
    min-width: unset;
    margin-right: 5px;
}#amount_remaining, #amount_paid, #amount_total {
    color: #009686;
    font-style: italic;
    font-size: 14px;
}.popup-content-default-area #amount_total, .popup-content-default-area #amount_paid {
    font-size: 16px;
        font-weight: bold;
        line-height: 36px;
}

.home-session-day-group{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
}
.home-session-day-group label{
    margin-left: 5px;
}
.home-session-day-group .home-session-day-hour{
    visibility: hidden;
    flex: 1;
    text-align: right;
}
.home-session-day-group .home-session-day-hour span{
    color: #2196F3;
    font-style: normal;
    text-decoration: underline;
    cursor: pointer;
}

/* Günlük takvimde eğitmen/kaynak gruplama seçici (2026-08-22, kullanıcı
   isteği) — saat sütununun başlık hücresinde, sadece simge (yer kaplamasın
   diye metin yok). Sadece _calendarType===1 iken _createCalendar() bu
   hücreyi doldurur. */
.takvim-group-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}
.takvim-group-toggle i {
    cursor: pointer;
    font-size: 19px;
    line-height: 1;
    color: #6c7684;
    background: #eef1f4;
    padding: 8px;
    border-radius: 7px;
    transition: background 0.12s, color 0.12s;
}
.takvim-group-toggle i:hover { background: #dde3ea; color: #495057; }
.takvim-group-toggle i.takvim-group-toggle-active {
    color: #fff;
    background: #2196F3;
}
.takvim-group-toggle i.takvim-group-toggle-active:hover { background: #1e88e5; }

.home-today-program-class-session {
    display: block;
    position: relative;
    color: #fff;
    border-radius: 8px;
    margin-bottom: 4px;
    padding: 7px 10px;
    width: 100%;
    box-sizing: border-box;
    font-size: 0.8em;
    font-weight: 600;
    cursor: pointer;
    border-left: 3px solid rgba(0,0,0,0.18);
    background-image: linear-gradient(160deg, rgba(255,255,255,0.12) 0%, rgba(0,0,0,0.06) 100%);
    box-shadow: 0 2px 8px rgba(0,0,0,0.18), inset 0 1px 0 rgba(255,255,255,0.12);
    transition: transform 0.12s ease, box-shadow 0.12s ease;
    overflow: hidden;
}

/* ── Bireysel ders (1:1) — eğitmen rengi korunur ── */
.home-today-program-class-session.cs-type-member {
    border-left: 3px solid rgba(0,0,0,0.20);
    border-radius: 6px;
}
.home-today-program-class-session.cs-type-member .cs-member-name {
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 28px; /* rozet için yer */
}
/* 2026-08-31 (kullanıcı isteği: "üyenin son dersi ise bunu bariz şekilde
   görebilmem gerekiyor... İşletme Yönetimi'ndeki Ders Hakkı Azaldı eşiğini
   burada da kullan") — sol üstte, arka plan/kenar renklerine (durum anlamı
   taşıyorlar) dokunmayan ayrı bir köşe rozeti. Pilin KENDİSİ overflow:hidden
   olduğu için (1:1/GRUP rozetlerinin köşe kesimi için gerekli) rozet AYRI
   bir .cs-pill-wrapper içine konup pilin KÖŞESİNDEN TEMİZCE TAŞIYOR —
   ilk versiyon rozeti pilin İÇİNE (overflow:hidden sınırına) sıkıştırmıştı,
   köşenin border-radius'uyla çakışıp "kesik/garip" görünüyordu (canlı
   kullanıcı raporuyla bulundu). */
.cs-pill-wrapper {
    display: block;
    position: relative;
}
.cs-low-credit-badge {
    /* BİLEREK z-index YOK — bkz. yukarıdaki geniş not (_renderSessionMember)
       ve site.css'teki "4b. Saat sütunu sabit" notu: sticky saat sütunu
       z-index:1 taşıyor, rozetin DOM'da pilden SONRA gelmesi z-index'e
       gerek kalmadan yerel olarak üstte görünmesini sağlıyor, sütunla
       ASLA yarışmıyor. */
    position: absolute;
    top: -6px;
    left: -6px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.35);
}
.cs-low-credit-badge.cs-low-credit-warn {
    background: #ef9f27;
    color: #2c1c02;
}
.cs-low-credit-badge.cs-low-credit-last {
    background: #e53935;
    color: #fff;
}
.cs-low-credit-badge.cs-low-credit-last i {
    font-size: 11px;
}

/* Sol üstte küçük "1:1" rozeti */
.home-today-program-class-session.cs-type-member::before {
    content: '1:1';
    position: absolute;
    top: 5px;
    right: 7px;
    font-size: 0.60em;
    font-weight: 800;
    letter-spacing: 0.05em;
    color: rgba(255,255,255,0.55);
    pointer-events: none;
}

/* ── Grup ders — eğitmen rengi korunur, şekille ayrışır ── */
.home-today-program-class-session.cs-type-group {
    border-left: 4px solid rgba(255,255,255,0.40);
    border-radius: 6px;
}
/* Sol üstte belirgin "GRUP" rozeti */
.home-today-program-class-session.cs-type-group::before {
    content: 'GRUP';
    position: absolute;
    top: 5px;
    right: 7px;
    font-size: 0.56em;
    font-weight: 800;
    letter-spacing: 0.08em;
    background: rgba(0,0,0,0.22);
    color: rgba(255,255,255,0.92);
    border-radius: 3px;
    padding: 1px 5px;
    pointer-events: none;
}
/* grup hover — genel hover kuralı yeterli, teal'e özel shadow kaldırıldı */
.home-today-program-class-session:hover {
    transform: translateY(-1px);
    box-shadow: 0 5px 16px rgba(0,0,0,0.26), inset 0 1px 0 rgba(255,255,255,0.12);
}

/* ── Takvim günlük özet ────────────────────────────────────────────────── */
#takvim-summary {
    margin-top: 14px;
}
.takvim-summary-inner {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 14px;
    background: rgba(0,0,0,0.03);
    border: 1px solid rgba(0,0,0,0.07);
    border-radius: 8px;
    font-size: 12px;
    line-height: 1.6;
}
/* Bloklar yan yana */
.tsm-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 24px;
}
.tsm-coach-block {
    min-width: 120px;
}
/* Koç adı + kopyala butonu */
.tsm-coach-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
}
.tsm-coach-name {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}
.tsm-copy-btn {
    width: 20px;
    height: 20px;
    border: 1px solid rgba(0,0,0,0.13);
    border-radius: 4px;
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: #888;
    transition: background 0.15s, color 0.15s;
    padding: 0;
    line-height: 1;
    flex-shrink: 0;
}
.tsm-copy-btn::before        { content: '⎘'; }
.tsm-copy-btn.copied::before { content: '✓'; color: #00897b; }
.tsm-copy-btn:hover          { background: #f0f0f0; }
/* Seans satırları */
.tsm-row {
    display: flex;
    gap: 6px;
    margin-bottom: 1px;
    color: #222;
}
.tsm-time {
    font-weight: 600;
    color: #888;
    font-size: 11px;
    min-width: 34px;
    flex-shrink: 0;
}
.tsm-label {
    font-weight: 500;
}
.tsm-group-badge {
    display: inline-block;
    font-size: 0.70em;
    font-weight: 800;
    letter-spacing: 0.06em;
    background: rgba(0,0,0,0.10);
    color: #444;
    border-radius: 3px;
    padding: 0 4px;
    vertical-align: middle;
    line-height: 1.6;
}
.home-today-program-class-session .cs-group-name {
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* 2026-09-10 (kullanıcı raporu: "çok üyeli grup dersleri çok geniş
   durduğu için takvim sütunları geniş kalıyor... ikinci hatta üçüncü
   satıra da taşabilir sorun olmaz dikeyde") — tek satırda sıkıştırıp
   kartı/sütunu genişletmek yerine artık normal şekilde satır kırıyor;
   sütun genişliği .home-today-program td'deki max-width ile sınırlı. */
.home-today-program-class-session .cs-member-names {
    font-size: 0.88em;
    font-weight: 400;
    opacity: 0.88;
    white-space: normal;
    overflow-wrap: break-word;
    margin-top: 2px;
}
.home-today-program-class-session.state_0 {
    background-color: #f5d5d2 !important;
    background-image: none;
    color: #7b3a36;
    border-left-color: #e57373;
    box-shadow: none;
    opacity: 0.72;
    text-decoration: line-through;
}
.home-today-program-class-session.state_0::after,
.home-today-program-class-session.state_1::after {
    background: rgba(0,0,0,0.08);
    color: inherit;
    opacity: 0.45;
}
.home-today-program-class-session.state_1 {
    background-color: #c8f5ce !important;
    background-image: none;
    color: #1b5e20;
    border-left-color: #43a047;
    box-shadow: 0 2px 6px rgba(46,125,50,0.15);
    opacity: 0.88;
}
/* 2026-08-24 (canlı hata düzeltmesi — kullanıcı: "renk bozulması olmuş,
   askıya alınan ders ile alakalı") — Askıda (s===-2) için hiç özel bir sınıf
   YOKTU; ne inline renk (userColor SADECE s===-1 için hesaplanıyor) ne de
   .state_0/.state_1 gibi bir CSS kuralı uygulanıyordu, bu yüzden ders taban
   .home-today-program-class-session'ın varsayılan beyaz metin rengine
   (color:#fff) + arka plansız (background-color hiç set edilmemiş) haliyle
   kalıyor, neredeyse görünmez oluyordu. .badge-suspended ile AYNI mor palet
   kullanılıyor (bkz. o kural), .state_0 ile AYNI "artık gerçekleşmiyor"
   görsel dili (üstü çizili, düşük opaklık) — sadece renk farklı, İptal'den
   (pembe/yanmış hak) ayırt edilsin diye. */
.home-today-program-class-session.state_-2 {
    background-color: #f3eefc !important;
    background-image: none;
    color: #6c3483;
    border-left-color: #b389d1;
    box-shadow: none;
    opacity: 0.72;
    text-decoration: line-through;
}
.home-today-program-class-session.state_-2::after {
    background: rgba(0,0,0,0.08);
    color: inherit;
    opacity: 0.45;
}

/* 2026-08-31 (kullanıcı isteği: "hangi renk hangi anlama geliyor belirt,
   eğitmen renklerini belirtmene gerek yok") — takvim pill'lerindeki sabit
   durum renklerinin (state_0/state_1/state_-2 + eğitmensiz-uyarı kırmızısı)
   AÇIKLAMASI. Eğitmen renkleri kişiye özel/keyfi olduğu için BİLEREK dahil
   edilmiyor. */
.takvim-color-legend {
    display: flex;
    /* 2026-09-08 (kullanıcı isteği: "bunlar 2 satır yer kaplıyor, her zaman
       tek satırda kalsın, gerekirse satır kendi içinde sağa sola
       kayabilsin") — wrap yerine nowrap + yatay kaydırma. */
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 4px 16px;
    margin: 10px 0;
    padding-right: 16px;
    font-size: 12px;
    color: #666;
    /* Kaydırma çalışsın ama çubuk görünmesin (kullanıcı isteği). */
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.takvim-color-legend::-webkit-scrollbar {
    display: none;
}
.tcl-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    white-space: nowrap;
}
.tcl-dot {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* 2026-09-11 (kullanıcı isteği: "hangi dersin onaylanmadığını gün saat ve
   üye/grup ismiyle yazalım"; düzeltme: "'1 onaylanmamış ders var!' yanıltıcı
   olur, tek cümle içinde şu ders onaylanmadı desek yeterli") — ayrı bir
   sayaç/başlık YOK, her ders kendi tam cümlesiyle ayrı satır (bkz.
   Views/Partner/Index.cshtml, _partner-takvim.js). */
.home-unapproved-sessions{
    display: none;
    background-color: #F44336;
    color: #fff;
    margin: 10px 15px;
    padding: 10px 15px;
    border-radius: 6px;
}
.tuw-list {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.7;
}
.tuw-item {
    display: block;
}

.popup-editsession-area-2 .form-t1-radio1-radio{
    flex-direction: column;
    align-items: flex-start;
}

/* ── Ödemeler popup: inline hata mesajı ── */
.odemeler-error-msg {
    width: 100%;
    background: #fde8e8;
    border: 1.5px solid #f44336;
    color: #b71c1c;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 0.88em;
    font-weight: 500;
    margin-bottom: 10px;
}

/* ── Ödemeler popup: toplam + ödenen yan yana ── */
.odemeler-totals-row {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 0 6px;
    border-top: 1px solid #f0f0f0;
    margin-top: 4px;
}
.odemeler-totals-item {
    flex: 1;
    text-align: center;
}
.odemeler-totals-label {
    font-size: 0.72em;
    color: #adb5bd;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 2px;
}
.odemeler-totals-value {
    font-size: 1em;
    font-weight: 600;
    color: #212529;
}
.odemeler-totals-total {
    color: #495057;
}
.odemeler-totals-divider {
    color: #dee2e6;
    font-size: 1.2em;
    font-weight: 300;
    flex-shrink: 0;
}

/* ════════════════════════════════════════════════════════
   YENİ ÖDEMELER PANELİ
   ════════════════════════════════════════════════════════ */

/* Üst kontrol çubuğu */
.odm-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px 0;
    flex-wrap: wrap;
    gap: 8px;
}
.odm-status-tabs,
.odm-period-tabs {
    display: flex;
    gap: 4px;
}
.odm-status-tab {
    border: none;
    background: #f0f0f0;
    color: #666;
    padding: 7px 18px;
    border-radius: 20px;
    font-size: 0.85em;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.odm-status-tab.active { background: #009687; color: #fff; }
.odm-status-tab:hover:not(.active) { background: #e4e4e4; }

.odm-period-tab {
    border: 1.5px solid #e0e0e0;
    background: #fff;
    color: #888;
    padding: 5px 13px;
    border-radius: 6px;
    font-size: 0.8em;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
}
.odm-period-tab.active { background: #f0faf9; border-color: #009687; color: #009687; }
.odm-period-tab:hover:not(.active) { background: #f8f8f8; color: #555; }

/* Özet kartları */
.odm-summary {
    display: flex;
    gap: 10px;
    padding: 14px 16px 6px;
    flex-wrap: wrap;
}
.odm-card {
    flex: 1;
    min-width: 110px;
    background: #fff;
    border: 1.5px solid #ebebeb;
    border-radius: 12px;
    padding: 12px 14px;
    display: flex;
    align-items: flex-start;
    gap: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04);
}
.odm-card-icon { font-size: 1.4em; line-height: 1; margin-top: 1px; }
.odm-card-label {
    font-size: 0.72em;
    color: #999;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-bottom: 3px;
}
.odm-card-value { font-size: 1.0em; font-weight: 700; color: #222; }
.odm-card-sub   { font-size: 0.75em; color: #aaa; margin-top: 2px; }
.odm-card-pending   { border-left: 3px solid #e74c3c; }
.odm-card-collected { border-left: 3px solid #009687; }
.odm-card-total     { border-left: 3px solid #3498db; }
.odm-card-done      { border-left: 3px solid #2ecc71; }

/* Arama */
.odm-search-bar {
    padding: 8px 16px;
}
.odm-search-bar input {
    width: 100%;
    border: 1.5px solid #e8e8e8;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 0.88em;
    background: #fafafa;
    box-sizing: border-box;
    outline: none;
    transition: border-color 0.15s;
}
.odm-search-bar input:focus { border-color: #009687; background: #fff; }

/* Split layout */
.odm-split {
    display: flex;
    gap: 0;
    height: calc(100vh - 280px);
    min-height: 300px;
    overflow: hidden;
    padding: 0 16px 16px;
    gap: 12px;
    box-sizing: border-box;
}
.odm-list-pane {
    flex: 0 0 42%;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-right: 4px;
}
.odm-detail-pane {
    flex: 1;
    background: #fff;
    border: 1.5px solid #ebebeb;
    border-radius: 14px;
    overflow-y: auto;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

/* Masaüstünde geri dönüş bağlantısı hiç gösterilmez — sadece mobilde
   (bkz. aşağıdaki @media (max-width: 768px) bloğundaki .odm-detail-back kuralı). */
.odm-detail-back { display: none; }

/* Boş liste */
.odm-empty {
    padding: 32px 16px;
    text-align: center;
    color: #bbb;
}

/* Bill kartları */
.odm-bill-card {
    background: #fff;
    border: 1.5px solid #ebebeb;
    border-radius: 12px;
    padding: 12px 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s;
    flex-shrink: 0;
}
.odm-bill-card:hover { border-color: #c5e8e5; box-shadow: 0 2px 8px rgba(0,150,135,0.08); }
.odm-bill-card-active { border-color: #009687 !important; box-shadow: 0 2px 12px rgba(0,150,135,0.15) !important; background: #f0faf9; }

.odm-bill-card-avatar {
    width: 40px; height: 40px; border-radius: 50%;
    background: #009687; color: #fff;
    font-weight: 700; font-size: 0.95em;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.odm-bill-card-body { flex: 1; min-width: 0; }
.odm-bill-card-name { font-weight: 600; color: #222; font-size: 0.92em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.odm-bill-card-meta { font-size: 0.78em; color: #aaa; margin: 2px 0 6px; }
.odm-bill-card-dot  { margin: 0 4px; }

.odm-bill-progress-wrap {
    height: 4px; background: #f0f0f0; border-radius: 4px; overflow: hidden;
}
.odm-bill-progress-bar {
    height: 100%; background: #009687; border-radius: 4px;
    transition: width 0.3s;
}
.odm-bill-card-right { flex-shrink: 0; text-align: right; }
.odm-bill-card-rem     { font-weight: 700; font-size: 0.9em; color: #e74c3c; }
.odm-bill-card-rem-lbl { font-size: 0.72em; color: #bbb; }
.odm-bill-card-paid-badge {
    background: #e8f8f5; color: #009687;
    font-size: 0.75em; font-weight: 700;
    padding: 4px 10px; border-radius: 20px;
}

/* Detay pane boş durum */
.odm-detail-empty {
    display: flex; flex-direction: column;
    align-items: center; justify-content: center;
    height: 100%; gap: 10px;
}
.odm-detail-empty-icon { font-size: 2.5em; opacity: 0.25; }
.odm-detail-empty-txt  { font-size: 0.9em; color: #ccc; }

/* Detay içerik */
.odm-detail-header {
    display: flex; align-items: center; gap: 14px;
    padding: 20px 20px 16px;
    border-bottom: 1px solid #f5f5f5;
}
.odm-detail-avatar {
    width: 52px; height: 52px; border-radius: 50%;
    background: #009687; color: #fff;
    font-weight: 700; font-size: 1.15em;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.odm-detail-name { font-size: 1.1em; font-weight: 700; color: #222; }
.odm-detail-meta { font-size: 0.82em; color: #aaa; margin-top: 3px; }

/* İlerleme */
.odm-detail-progress-section { padding: 16px 20px; border-bottom: 1px solid #f5f5f5; }
.odm-detail-amounts {
    display: flex; gap: 0; margin-bottom: 12px;
}
.odm-da-item {
    flex: 1; text-align: center;
    padding: 8px 4px;
    border-right: 1px solid #f0f0f0;
}
.odm-da-item:last-child { border-right: none; }
.odm-da-lbl { display: block; font-size: 0.72em; color: #aaa; text-transform: uppercase; letter-spacing: 0.4px; margin-bottom: 4px; }
.odm-da-val { display: block; font-size: 0.95em; font-weight: 700; color: #333; }
.odm-da-paid { color: #009687; }
.odm-da-rem  { color: #e74c3c; }
.odm-da-done { color: #2ecc71; }

.odm-detail-progress-wrap {
    height: 10px; background: #f0f0f0; border-radius: 6px; overflow: hidden;
}
.odm-detail-progress-bar {
    height: 100%; background: linear-gradient(90deg, #009687, #00bfa5);
    border-radius: 6px; transition: width 0.4s; position: relative;
    display: flex; align-items: center; justify-content: flex-end;
    min-width: 32px;
}
.odm-detail-progress-pct {
    font-size: 0.68em; font-weight: 700; color: #fff;
    padding-right: 6px; white-space: nowrap;
}

/* Ödeme ekleme */
.odm-add-payment { padding: 14px 20px; border-bottom: 1px solid #f5f5f5; }
.odm-detail-section-title {
    font-size: 0.75em; font-weight: 700; color: #aaa;
    text-transform: uppercase; letter-spacing: 0.4px; margin-bottom: 10px;
}
.odm-add-payment-row { display: flex; align-items: flex-end; gap: 10px; }
.odm-add-payment-field { flex: 1; }
.odm-add-payment-field label { display: block; font-size: 0.8em; color: #777; margin-bottom: 4px; }
.odm-add-payment-field input {
    width: 100%; border: 1.5px solid #ddd; border-radius: 8px;
    padding: 8px 10px; font-size: 0.92em; box-sizing: border-box;
}
.odm-add-payment-field input:focus { outline: none; border-color: #009687; }
.odm-pay-btn {
    background: #009687; color: #fff; border: none; border-radius: 8px;
    padding: 9px 20px; font-weight: 700; font-size: 0.88em; cursor: pointer;
    flex-shrink: 0;
}
.odm-pay-btn:hover { background: #007a6e; }
.odm-pay-error { font-size: 0.82em; color: #e74c3c; margin-top: 6px; }

/* Son ödeme tarihi düzenleme (2026-08-28) — Ödeme Ekle ile AYNI görsel dil */
.odm-due-date-section { padding: 14px 20px; border-bottom: 1px solid #f5f5f5; }

/* Ödeme geçmişi */
.odm-payment-history { padding: 0 20px 16px; }
.odm-detail-section-title { padding: 14px 20px 0; display: block; }
.odm-ph-item {
    display: flex; align-items: center; gap: 12px;
    padding: 10px 0; border-bottom: 1px solid #f5f5f5;
}
.odm-ph-item:last-child { border-bottom: none; }
.odm-ph-icon { font-size: 1.1em; }
.odm-ph-amount { font-weight: 700; color: #222; font-size: 0.92em; }
.odm-ph-date   { font-size: 0.78em; color: #aaa; margin-top: 1px; }
.odm-ph-empty  { padding: 8px 20px 16px; font-size: 0.85em; color: #ccc; }

/* ── Ödenen Tutar + Kalan satırı ── */
.takvim-amount-paid-row {
    display: flex;
    align-items: center;
    gap: 10px;
}
.takvim-amount-paid-row .au-input {
    flex: 1;
    width: auto;
}
/* 2026-08-24 (kullanıcı bildirdi: "ekrana güzel yayılmamışlar") — "Kalan"
   rozeti önceden girdi+kopyala butonuyla AYNI satırdaydı; dar bir sütuna
   (mobilde yarı genişlik) sığdığında kart kenarından taşıyordu. Artık
   ayrı, kendi satırında (bkz. Index.cshtml — .takvim-amount-paid-row'un
   DIŞINDA) — genişliği ne olursa olsun taşma riski yok. */
.takvim-amount-remaining-badge {
    display: block;
    width: fit-content;
    white-space: nowrap;
    font-size: 0.88em;
    font-weight: 700;
    color: #fff;
    background: #e53935;
    border-radius: 6px;
    padding: 5px 12px;
    line-height: 1.4;
    letter-spacing: 0.01em;
    margin-top: 8px;
}

/* ── Ders Silme Butonu ── */
.takvim-delete-session-wrap {
    text-align: center;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #f0f0f0;
}
.takvim-delete-session-btn {
    background: none;
    border: none;
    color: #c0392b;
    font-size: 0.78em;
    font-weight: 600;
    cursor: pointer;
    opacity: 0.7;
    padding: 4px 10px;
    border-radius: 4px;
    transition: opacity 0.15s, background 0.15s;
    letter-spacing: 0.02em;
}
.takvim-delete-session-btn:hover {
    opacity: 1;
    background: rgba(192,57,43,0.08);
}
/* ── Silme Onay Alanı ── */
.takvim-delete-confirm-msg {
    background: #fff5f5;
    border: 1.5px solid #fca5a5;
    border-radius: 8px;
    padding: 14px 16px;
    font-size: 0.88em;
    line-height: 1.6;
    color: #7f1d1d;
    margin-bottom: 4px;
}
.takvim-delete-confirm-msg strong {
    color: #991b1b;
}
.takvim-delete-confirm-btn {
    background: #c0392b !important;
    color: #fff !important;
}

.content-edit-image{
    width: 100%;
    height: 300px;
    background-color: red;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.content-edit-image-name{
    font-style: italic;
    font-size: 11px;
}
.content-edit-image-change {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: flex-start;
    width: 100%;
    text-align: right;
    margin-bottom: 20px;
    font-style: italic;
}
.content-edit-image-change span:first-child {
    text-align: left;
}.content-edit-image-change span:last-child {
    color: #3F51B5;
    font-size: 14px;
    text-decoration: underline;
    cursor: pointer;
}
.content-edit-space{
    width: 100%;
    height: 20px;
}
.content-edit-alert{
    width: 100%;
    background-color: #F44336;
    color: #fff;
    border-radius: 5px;
}
.content-edit-alert li:first-child{
    margin-top: 10px;
}
.content-edit-alert li:last-child{
    margin-bottom: 10px;
}

.popup-editsession-low-sessioncount-alert{
    /* Eski tasarım es-low-alert ile değiştirildi.
       Burada sadece display:none kalıyor; tüm stiller es-low-alert'tan gelir. */
    display: none;
}
.popup-editsession-low-sessioncount-alert div{
    font-size: 13px;
    font-weight: 500;
}
.popup-editsession-low-sessioncount-alert button{
    color: #4a3000;
    background-color: #ffc107;
    line-height: normal;
    padding: 5px 12px;
    margin-top: 0;
    border-radius: 7px;
    border: 0;
}

.session-editsession-confirmation-completed-area{
    display: none;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    padding: 20px;
    margin-bottom: 15px;
    background-color: #ffd1d1;
    border-radius: 10px;
}
.session-editsession-confirmation-completed-area .desc{
    color: #F44336;
    font-weight: bold;
    font-size: 17px;
}
.session-editsession-confirmation-completed-area .buttons{
    display: flex;
        flex-direction: row;
    align-items: center;
}
.session-editsession-confirmation-completed-area .button{
    text-decoration: none;
    color: #fff;
    background-color: #0b6ffd;
    line-height: 40px;
    padding: 0 15px;
    margin-top: 20px;
    margin-right: 20px;
    border-radius: 7px;
    cursor: pointer;
}.session-editsession-confirmation-completed-area .buttons .set_change_1{
    background-color: #4CAF50;
}.session-editsession-confirmation-completed-area .buttons .set_change_0 {
    background-color: #FF9800;
}

/* ═══════════════════════════════════════════════════════════
   ESKİ MENÜ ÖĞELERİ
   ═══════════════════════════════════════════════════════════ */
.app-menu-item-legacy {
    opacity: 0.55;
}
.app-menu-item-legacy:hover {
    opacity: 0.85;
}
.app-menu-item-legacy-tag {
    font-size: 10px;
    font-weight: 400;
    letter-spacing: 0;
    opacity: 0.8;
}

/* ═══════════════════════════════════════════════════════════
   SPA — Sayfa içi tab çubuğu
   ═══════════════════════════════════════════════════════════ */
.spa-wrapper {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.spa-topbar {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 4px;
    padding: 10px 16px 0;
    border-bottom: 2px solid #e9ecef;
    flex-shrink: 0;
    overflow-x: auto;
}
.spa-tab {
    padding: 8px 16px 10px;
    font-size: 13px;
    font-weight: 500;
    color: #6c757d;
    text-decoration: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    white-space: nowrap;
    transition: color 0.15s, border-color 0.15s;
    border-radius: 6px 6px 0 0;
}
.spa-tab:hover { color: #343a40; }
.spa-tab-active {
    color: #1cbb9d;
    border-bottom-color: #1cbb9d;
}
.spa-panels {
    flex: 1;
    overflow: hidden;
    position: relative;
}
.spa-panel {
    display: none;
    height: 100%;
    overflow-y: auto;
    box-sizing: border-box;
}
.spa-panel-active {
    display: block;
}

/* Placeholder içerik */
.spa-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 300px;
    color: #adb5bd;
    gap: 10px;
}
.spa-placeholder-icon { font-size: 48px; }
.spa-placeholder-title {
    font-size: 18px;
    font-weight: 600;
    color: #6c757d;
}
.spa-placeholder-desc { font-size: 14px; }

/* ═══════════════════════════════════════════════════════════
   YENİ ŞİRKET OLUŞTUR — Switcher "Yeni Şirket" butonu
   ═══════════════════════════════════════════════════════════ */
.company-switcher-new{
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    font-size: 13px;
    color: #1cbb9d;
    cursor: pointer;
    border-top: 1px solid rgba(255,255,255,0.08);
    margin-top: 2px;
    transition: background 0.15s;
}
.company-switcher-new:hover{ background-color: rgba(28,187,157,0.12); }
.company-switcher-new-icon{
    font-size: 17px;
    line-height: 1;
    font-weight: 300;
}

/* ═══════════════════════════════════════════════════════════
   YENİ ŞİRKET OLUŞTUR — Popup / Overlay
   ═══════════════════════════════════════════════════════════ */
/* hidden sınıfı display:flex tarafından ezilmesin */
.nc-overlay.hidden,
.nc-popup.hidden { display: none; }

.nc-overlay{
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.45);
    z-index: 1000;
}
.nc-popup{
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1001;
    background: #fff;
    border-radius: 12px;
    width: 420px;
    max-width: calc(100vw - 32px);
    box-shadow: 0 8px 32px rgba(0,0,0,0.22);
    display: flex;
    flex-direction: column;
}
.nc-popup-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px 14px;
    border-bottom: 1px solid #e9ecef;
}
.nc-popup-title{
    font-size: 16px;
    font-weight: 600;
    color: #212529;
}
.nc-popup-close{
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    color: #6c757d;
    transition: background 0.15s;
}
.nc-popup-close:hover{ background: #f0f0f0; color: #212529; }
.nc-popup-body{
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.nc-field{
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.nc-label{
    font-size: 13px;
    font-weight: 500;
    color: #495057;
}
.nc-input{
    height: 40px;
    padding: 0 12px;
    border: 1px solid #ced4da;
    border-radius: 7px;
    font-size: 14px;
    color: #212529;
    background: #fff;
    outline: none;
    box-sizing: border-box;
    width: 100%;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.nc-input:focus{
    border-color: #1cbb9d;
    box-shadow: 0 0 0 3px rgba(28,187,157,0.15);
}
.nc-select{
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236c757d' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 34px;
    cursor: pointer;
}
.nc-checkbox-option{
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 13px;
    color: #495057;
    cursor: pointer;
    margin-top: 4px;
}
.nc-checkbox-option input[type="checkbox"]{
    margin-top: 2px;
    width: 15px;
    height: 15px;
    accent-color: #1cbb9d;
    flex-shrink: 0;
}
.nc-error{
    font-size: 13px;
    color: #dc3545;
    background: #fff5f5;
    border: 1px solid #f5c2c7;
    border-radius: 6px;
    padding: 9px 12px;
}
.nc-popup-footer{
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 14px 20px 18px;
    border-top: 1px solid #e9ecef;
}
.nc-btn-cancel{
    height: 38px;
    padding: 0 18px;
    border: 1px solid #ced4da;
    border-radius: 7px;
    background: #fff;
    color: #495057;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.15s;
}
.nc-btn-cancel:hover{ background: #f8f9fa; }
.nc-btn-submit{
    height: 38px;
    padding: 0 22px;
    border: none;
    border-radius: 7px;
    background: #1cbb9d;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, opacity 0.15s;
}
.nc-btn-submit:hover:not(:disabled){ background: #17a589; }
.nc-btn-submit:disabled{ opacity: 0.6; cursor: not-allowed; }

/* ── Eğitmenler paneli ───────────────────────────────────────────────── */
.egitmenler-list {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0 16px 40px;
}

/* Eğitmen kart satırı */
.egitmen-card {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 12px;
    border-bottom: 1px solid #f0f0f0;
    cursor: pointer;
    transition: background 0.12s;
    border-radius: 8px;
}
.egitmen-card:hover { background: #f7fffe; }

/* Avatar daire */
.egitmen-card-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #009687;
    color: #fff;
    font-weight: 700;
    font-size: 1em;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    letter-spacing: 0.5px;
}

.egitmen-card-body { flex: 1; min-width: 0; }
.egitmen-card-name {
    font-weight: 600;
    font-size: 0.97em;
    color: #222;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.egitmen-card-meta {
    font-size: 0.82em;
    color: #999;
    margin-top: 2px;
}

/* Ok ikonu */
.egitmen-card-arrow {
    width: 18px;
    height: 18px;
    background: url('/img/chevron-right-solid-full.svg') center/contain no-repeat;
    opacity: 0.3;
    flex-shrink: 0;
}
.egitmen-card:hover .egitmen-card-arrow { opacity: 0.6; }

/* ── Eğitmen detay popup: ders listesi ─────────────────────────────── */
.egitmen-sessions-list {
    padding: 0;
}

.egitmen-session-date-group {
    margin-bottom: 6px;
}

.egitmen-session-date-label {
    font-size: 0.8em;
    font-weight: 700;
    color: #009687;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 10px 0 4px;
    border-bottom: 1px solid #e8f5f3;
    margin-bottom: 2px;
}

.egitmen-session-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 4px;
    border-bottom: 1px solid #f5f5f5;
    font-size: 0.9em;
}
.egitmen-session-row:last-child { border-bottom: none; }
.egitmen-session-row-done  { opacity: 0.55; }
.egitmen-session-row-cancel { opacity: 0.4; }

.egitmen-session-time {
    font-weight: 700;
    color: #333;
    min-width: 44px;
    font-size: 0.95em;
}

.egitmen-session-info {
    flex: 1;
    color: #555;
}
.egitmen-session-sn {
    font-size: 0.88em;
    color: #888;
}

/* ── Eğitmen detay sayfası ──────────────────────────────────────────── */
.egitmen-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 60vh;
    color: #bbb;
    gap: 14px;
}
.egitmen-empty-icon {
    width: 64px;
    height: 64px;
    background: url('/img/circle-user-regular-full.svg') center/contain no-repeat;
    opacity: 0.18;
}
.egitmen-empty-text {
    font-size: 0.95em;
    color: #bbb;
}

/* Profil başlığı */
.egitmen-detail-header {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 24px 20px 20px;
    border-bottom: 1px solid #f0f0f0;
}
.egitmen-detail-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: #009687;
    color: #fff;
    font-size: 1.2em;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    letter-spacing: 0.5px;
}
.egitmen-detail-name {
    font-size: 1.2em;
    font-weight: 700;
    color: #222;
    display: flex;
    align-items: center;
    gap: 8px;
}
/* 2026-08-24 (kullanıcı isteği: "eğitmen isminin yanına bir düzenleme
   simgesi ekleyelim ve eğitmenin düzenleme pop-up'ını açsın") — İşletme
   Yönetimi'ndeki "Kullanıcı Düzenle" popup'ını açan, isme bitişik küçük
   simge buton. */
.egitmen-name-edit-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 6px;
    border: none;
    background: transparent;
    color: #9ca3af;
    font-size: 15px;
    cursor: pointer;
    transition: background 0.12s, color 0.12s;
}
.egitmen-name-edit-btn:hover { background: #f0f0f0; color: #555; }
.egitmen-detail-stats {
    font-size: 0.83em;
    color: #999;
    margin-top: 4px;
}
.egitmen-detail-sub {
    font-size: 0.83em;
    color: #999;
    margin-top: 3px;
}
.egitmen-detail-info {
    flex: 1;
}
.egitmen-header-actions {
    margin-left: auto;
    flex-shrink: 0;
}

/* Bakiye kartı */
.egitmen-balance-card {
    border-radius: 10px;
    padding: 10px 18px;
    min-width: 130px;
    text-align: center;
}
.egitmen-balance-pos {
    background: #e8f8f5;
    border: 1.5px solid #c3ece7;
}
.egitmen-balance-neg {
    background: #fff5f5;
    border: 1.5px solid #ffd4d4;
}
.egitmen-balance-na {
    background: #f5f5f5;
    border: 1.5px solid #e0e0e0;
}
.egitmen-balance-label {
    font-size: 0.72em;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.egitmen-balance-value {
    font-size: 1.1em;
    font-weight: 700;
    margin-top: 3px;
}
.egitmen-balance-pos .egitmen-balance-value  { color: #009687; }
.egitmen-balance-neg .egitmen-balance-value  { color: #e74c3c; }
.egitmen-balance-na  .egitmen-balance-value  { color: #aaa; }
.egitmen-balance-neg-txt { color: #e74c3c !important; }

/* Komisyon satırı */
.egitmen-info-row {
    padding: 10px 20px;
    border-bottom: 1px solid #f0f0f0;
    background: #fafafa;
}
.egitmen-commission-view,
.egitmen-commission-edit {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.egitmen-commission-label {
    font-size: 0.85em;
    color: #777;
    font-weight: 500;
}
.egitmen-commission-value {
    font-size: 0.95em;
    font-weight: 700;
    color: #333;
}
.egitmen-commission-edit-label {
    font-size: 0.85em;
    color: #777;
}
.egitmen-commission-edit-pct {
    font-size: 0.9em;
    color: #555;
}
.egitmen-commission-edit input[type=number] {
    width: 72px;
    border: 1.5px solid #ccc;
    border-radius: 6px;
    padding: 5px 8px;
    font-size: 0.95em;
}

/* Ödeme tipi (komisyon / aylık maaş) düzenleme */
.egitmen-pt-edit {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
}
.egitmen-pt-toggle {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    font-size: 0.85em;
    color: #444;
}
.egitmen-pt-toggle label {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    font-weight: 500;
}
.egitmen-pt-fields {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.egitmen-pt-fields input[type=date] {
    border: 1.5px solid #ccc;
    border-radius: 6px;
    padding: 5px 8px;
    font-size: 0.9em;
}
.egitmen-ss-label {
    margin-left: 6px;
}

/* Butonlar */
.egitmen-edit-btn,
.egitmen-save-btn,
.egitmen-cancel-btn {
    border: none;
    border-radius: 6px;
    padding: 5px 14px;
    font-size: 0.83em;
    cursor: pointer;
    font-weight: 600;
}
.egitmen-edit-btn   { background: #f0f0f0; color: #555; }
.egitmen-save-btn   { background: #009687; color: #fff; }
.egitmen-cancel-btn { background: #eee;    color: #777; }
.egitmen-edit-btn:hover   { background: #e4e4e4; }
.egitmen-save-btn:hover   { background: #007a6e; }
.egitmen-cancel-btn:hover { background: #e4e4e4; }

/* Sekmeler */
.egitmen-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid #ebebeb;
    margin: 0 20px;
    margin-top: 16px;
}
.egitmen-tab-btn {
    background: none;
    border: none;
    border-bottom: 2.5px solid transparent;
    padding: 8px 18px;
    font-size: 0.88em;
    font-weight: 600;
    color: #aaa;
    cursor: pointer;
    margin-bottom: -2px;
    transition: color 0.15s, border-color 0.15s;
}
.egitmen-tab-btn.active {
    color: #009687;
    border-bottom-color: #009687;
}
.egitmen-tab-btn:hover:not(.active) { color: #555; }

.egitmen-tab-panel {
    padding: 12px 20px 24px;
}

/* Kazanç Raporu sekmesi (2026-09-01) — Raporlar/Performans.cshtml'in
   .perf-* kontrol/bar-chart deseninin AYNISI, teal (#009687) vurgu rengiyle
   bu panelin geri kalanına uyumlu. */
.egitmen-earn-controls {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}
.egitmen-earn-mode-toggle {
    display: flex;
    background: #f0f2f5;
    border-radius: 8px;
    padding: 3px;
}
.egitmen-earn-mode-btn {
    padding: 6px 16px;
    border: none;
    background: none;
    border-radius: 6px;
    font-size: 0.85em;
    font-weight: 500;
    color: #666;
    cursor: pointer;
    transition: all .15s;
    white-space: nowrap;
}
.egitmen-earn-mode-btn.active {
    background: #fff;
    color: #009687;
    font-weight: 700;
    box-shadow: 0 1px 4px rgba(0,0,0,.12);
}
.egitmen-earn-nav {
    display: flex;
    align-items: center;
    gap: 4px;
}
.egitmen-earn-nav-btn {
    width: 30px;
    height: 30px;
    border: 1px solid #ddd;
    background: #fff;
    border-radius: 8px;
    font-size: 1.05em;
    cursor: pointer;
    color: #555;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    user-select: none;
}
.egitmen-earn-nav-btn:hover { background: #f5f5f5; }
.egitmen-earn-period-label {
    font-size: 0.88em;
    font-weight: 600;
    color: #222;
    min-width: 170px;
    text-align: center;
    padding: 0 6px;
}
.egitmen-earn-today-btn {
    padding: 5px 12px;
    font-size: 0.78em;
    font-weight: 600;
    border: 1.5px solid #009687;
    color: #009687;
    background: none;
    border-radius: 7px;
    cursor: pointer;
    white-space: nowrap;
}
.egitmen-earn-today-btn:hover { background: #e6f7f5; }
.egitmen-earn-note {
    background: #fff8e6;
    border: 1px solid #f5d98a;
    border-radius: 8px;
    padding: 10px 14px;
    font-size: 0.82em;
    color: #7a5c00;
    line-height: 1.5;
    margin-bottom: 14px;
}
.egitmen-earn-total {
    font-size: 1.7em;
    font-weight: 800;
    color: #009687;
    margin-bottom: 16px;
}
.egitmen-earn-bar-chart {
    display: flex;
    align-items: flex-end;
    height: 170px;
    gap: 8px;
    padding: 0 2px 4px;
}
.egitmen-earn-bar-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    height: 100%;
    justify-content: flex-end;
    min-width: 0;
}
.egitmen-earn-bar-count {
    font-size: 0.66em;
    font-weight: 700;
    color: #444;
    min-height: 15px;
    line-height: 15px;
    white-space: nowrap;
}
.egitmen-earn-bar {
    width: 100%;
    border-radius: 5px 5px 0 0;
    background: #009687;
}
.egitmen-earn-bar-empty {
    width: 100%;
    height: 3px;
    background: #eee;
    border-radius: 2px;
}
.egitmen-earn-bar-label {
    font-size: 0.72em;
    color: #888;
    text-align: center;
    white-space: nowrap;
}

/* Ders satırları (yenilendi) */
.egitmen-session-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 6px;
    border-bottom: 1px solid #f5f5f5;
    font-size: 0.88em;
    flex-wrap: wrap;
}
.egitmen-session-row:last-child { border-bottom: none; }
.egitmen-session-row-done      { background: #f9fefd; }
.egitmen-session-row-cancel,
.egitmen-session-row-suspended { opacity: 0.45; }
.egitmen-session-time {
    font-weight: 700;
    color: #333;
    min-width: 44px;
    font-size: 0.93em;
    flex-shrink: 0;
}
.egitmen-session-member {
    flex: 1;
    color: #333;
    font-weight: 500;
    min-width: 100px;
}
.egitmen-session-price,
.egitmen-session-earn {
    font-size: 0.83em;
    color: #777;
}
.egitmen-session-price-val,
.egitmen-session-earn-val {
    font-weight: 600;
    color: #333;
}
.egitmen-session-earn-val { color: #009687; }
.egitmen-session-status { margin-left: auto; }
.egitmen-session-badge {
    font-size: 0.75em;
    font-weight: 700;
    padding: 2px 9px;
    border-radius: 20px;
    letter-spacing: 0.2px;
}
.badge-done      { background: #e8f8f5; color: #009687; }
.badge-cancel    { background: #fff0f0; color: #e74c3c; }
.badge-suspended { background: #f3eefc; color: #8e44ad; }
.badge-waiting   { background: #fff8e6; color: #e67e22; }

/* Ödeme özet */
.egitmen-payment-summary {
    background: #f8fffe;
    border: 1px solid #e0f5f2;
    border-radius: 10px;
    padding: 14px 18px;
    margin-bottom: 18px;
}
.egitmen-payment-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
    font-size: 0.9em;
    border-bottom: 1px solid #edf9f7;
}
.egitmen-payment-summary-row:last-child { border-bottom: none; }
.egitmen-payment-summary-balance .egitmen-payment-summary-lbl,
.egitmen-payment-summary-balance .egitmen-payment-summary-val {
    font-weight: 700;
    font-size: 1.0em;
}
.egitmen-payment-summary-lbl { color: #666; }
.egitmen-payment-summary-val { color: #222; font-weight: 600; }

/* Ödeme ekleme formu */
.egitmen-add-payment-form {
    background: #fafafa;
    border: 1px solid #ebebeb;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 20px;
}
.egitmen-add-payment-title {
    font-size: 0.85em;
    font-weight: 700;
    color: #555;
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}
.egitmen-add-payment-fields {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: flex-end;
}
.egitmen-add-payment-field {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.egitmen-add-payment-field label {
    font-size: 0.8em;
    color: #777;
    font-weight: 500;
}
.egitmen-add-payment-field input {
    border: 1.5px solid #ddd;
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 0.9em;
    background: #fff;
}
.egitmen-add-payment-field-wide { flex: 1; min-width: 160px; }
.egitmen-add-payment-field-wide input { width: 100%; }
.egitmen-pay-submit-btn { margin-top: 12px; padding: 7px 20px; }
.egitmen-pay-error {
    font-size: 0.83em;
    color: #e74c3c;
    margin-top: 6px;
}

/* Ödeme geçmişi */
.egitmen-payment-history-title {
    font-size: 0.83em;
    font-weight: 700;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin-bottom: 8px;
}
.egitmen-payment-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 8px 4px;
    border-bottom: 1px solid #f3f3f3;
    font-size: 0.88em;
}
.egitmen-payment-item:last-child { border-bottom: none; }
.egitmen-payment-item-date   { color: #888; min-width: 90px; }
.egitmen-payment-item-amount { font-weight: 700; color: #333; }
.egitmen-payment-item-note   { color: #aaa; font-size: 0.9em; flex: 1; }
/* 2026-08-24 (kullanıcı isteği: takvim dışı hizmetler için "Ek Kazanç"
   kaydı) — bakiyeyi ARTIRAN (normal ödemenin tersi) kayıtlar ayırt edilsin. */
.egitmen-payment-item-amount-bonus { color: #009687; }
.egitmen-payment-item-bonus-badge {
    display: inline-block;
    font-size: 0.72em;
    font-weight: 700;
    letter-spacing: 0.2px;
    background: #e6f7f5;
    color: #009687;
    border-radius: 4px;
    padding: 1px 6px;
    vertical-align: middle;
    margin-left: 2px;
}

/* ════════════════════════════════════════════════════════════════════
   GRUP POPUP  (gg-*)
   İki sütunlu modern tasarım — Sol: form, Sağ: üye listesi
   ════════════════════════════════════════════════════════════════════ */

/* Kap: popup-content-default-area davranışını override et */
.gg-popup {
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    align-items: stretch !important;
    min-width: min(92vw, 760px) !important;
}

/* 2026-09-09 (kullanıcı isteği: "üyeler alanını komple alta al") — tek
   sütun akışı, önceki iki sütunlu (.gg-left/.gg-right yan yana) tasarım
   TAMAMEN kaldırıldı. */
.gg-body {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.gg-left {
    padding: 24px 24px 20px;
    min-width: 0;
}

/* Üyeler kutusu — eskiden .gg-right'ın sağdaki ayrı sütun olması sağladığı
   görsel ayrımı artık kendi çerçevesiyle sağlıyor. */
.gg-member-list-box {
    border: 1px solid #f0f0f0;
    border-radius: 10px;
    overflow: hidden;
}

/* Alt çubuk: tehlike alanı + butonlar */
.gg-bottom {
    border-top: 1px solid #f0f0f0;
    background: #fafafa;
    display: flex;
    flex-direction: column;
}

/* ── Form alanları ──────────────────────────────────────────────── */
.gg-field { margin-bottom: 20px; }

.gg-label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    color: #9ba4b0;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 7px;
}
.gg-label span {
    font-size: 11px;
    font-weight: 400;
    text-transform: none;
    color: #c4cad2;
    letter-spacing: 0;
}

.gg-input {
    width: 100%;
    height: 44px;
    padding: 0 14px;
    font-size: 16px;
    font-weight: 500;
    color: #1a2332;
    background: #fff;
    border: 1.5px solid #e5e9ef;
    border-radius: 8px;
    outline: none;
    box-sizing: border-box;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.gg-input:focus {
    border-color: #009687;
    box-shadow: 0 0 0 3px rgba(0,150,135,.10);
}
.gg-input::placeholder { color: #c4cad2; }

.gg-textarea {
    width: 100%;
    min-height: 76px;
    padding: 10px 14px;
    font-size: 14px;
    color: #374151;
    background: #fff;
    border: 1.5px solid #e5e9ef;
    border-radius: 8px;
    resize: vertical;
    outline: none;
    box-sizing: border-box;
    line-height: 1.5;
    font-family: inherit;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.gg-textarea:focus {
    border-color: #009687;
    box-shadow: 0 0 0 3px rgba(0,150,135,.10);
}
.gg-textarea::placeholder { color: #c4cad2; }

/* ── Gün seçici ─────────────────────────────────────────────────── */
.gg-section { margin-bottom: 20px; }

.gg-section-title {
    font-size: 11px;
    font-weight: 700;
    color: #9ba4b0;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 10px;
}

.gg-days {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.gg-day-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

/* Checkbox tamamen gizle ama işlevini koru */
.gg-day-item .form-t1-checkbox {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.gg-day-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 40px;
    font-size: 12px;
    font-weight: 600;
    color: #7b8795;
    background: #f4f6f8;
    border: 1.5px solid #e5e9ef;
    border-radius: 9px;
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
}
.gg-day-pill:hover {
    background: #e6f5f3;
    border-color: #009687;
    color: #009687;
}
/* Seçili durum — CSS :checked + label selector */
.gg-day-item .form-t1-checkbox:checked + .gg-day-pill {
    background: #009687;
    border-color: #009687;
    color: #fff;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(0,150,135,.30);
}

.gg-day-hour {
    font-size: 11px;
    color: #009687;
    font-weight: 600;
    text-align: center;
    min-height: 18px;
    visibility: hidden;
    white-space: nowrap;
}
.gg-day-hour span {
    display: block;
    font-size: 10px;
    font-weight: 400;
    color: #b0b8c4;
    cursor: pointer;
    text-decoration: underline;
    text-decoration-style: dotted;
}
.gg-day-hour span:hover { color: #009687; }

/* ── Üye paneli (sağ sütun) ─────────────────────────────────────── */
.gg-members-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px 12px;
    border-bottom: 1px solid #f0f0f0;
}
.gg-members-title {
    font-size: 12px;
    font-weight: 700;
    color: #9ba4b0;
    text-transform: uppercase;
    letter-spacing: 0.6px;
}
.gg-add-btn {
    font-size: 12px;
    font-weight: 600;
    color: #009687;
    background: #e6f5f3;
    border: none;
    border-radius: 6px;
    padding: 5px 11px;
    cursor: pointer;
    transition: all 0.15s;
}
.gg-add-btn:hover { background: #009687; color: #fff; }

.gg-member-rows { overflow-y: auto; max-height: 340px; }

/* 2026-09-09 (kullanıcı isteği: üyeler alanı sağ dar sütundan sol form
   akışına, tam genişliğe taşınınca — "tek satırda görünsün") — dar-sütun
   nedeniyle önce ikinci satıra bölünmüştü (bkz. eski not), artık tam
   genişlik olduğu için tek satıra geri alındı. */
.gg-member-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 14px;
    border-bottom: 1px solid #f7f7f7;
    transition: background 0.1s;
}
.gg-member-row:last-child { border-bottom: none; }
.gg-member-row:hover { background: #f4fcfb; }
.gg-member-row-top {
    display: contents;
}
.gg-member-row-bottom {
    display: contents;
}

.gg-member-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #009687 0%, #00b5a3 100%);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.gg-member-name {
    flex: 1;
    font-size: 13px;
    font-weight: 500;
    color: #1a2332;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.gg-member-name:hover { color: #009687; }

/* 2026-08-24 (kullanıcı isteği: aynı sebep — bkz. .es-member-price'daki
   geniş not) — flex-shrink:0 ile isim uzun olsa da (name kısalır) rozet
   ASLA gizlenmiyor/kesilmiyor. */
.gg-member-price {
    flex-shrink: 0;
    font-size: 12px;
    color: #999;
}
.gg-member-price-missing {
    flex-shrink: 0;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    background: #e53935;
    border-radius: 4px;
    padding: 2px 7px;
    white-space: nowrap;
}

.gg-member-remove {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    cursor: pointer;
    color: #d0d5dd;
    font-size: 13px;
    transition: all 0.15s;
    flex-shrink: 0;
}
.gg-member-remove:hover { background: #fee2e2; color: #ef4444; }

/* 2026-09-03 (kullanıcı raporu: "hocaların müsaitliği çakıştığı için bir
   üyeyi iki farklı gruba eklemek zorunda kalıyoruz") — roster satırındaki
   katılım günü özeti + düzenle butonu, .gg-member-price ile AYNI desen. */
.gg-member-days {
    flex-shrink: 0;
    font-size: 11px;
    font-weight: 600;
    color: #009687;
    background: #e6f7f5;
    border-radius: 4px;
    padding: 2px 7px;
    white-space: nowrap;
}
.gg-member-days-empty {
    color: #fff;
    background: #f59e0b;
}
.gg-member-days-edit {
    width: 26px;
    height: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    cursor: pointer;
    color: #d0d5dd;
    font-size: 13px;
    transition: all 0.15s;
    flex-shrink: 0;
}
.gg-member-days-edit:hover { background: #e6f7f5; color: #009687; }

/* 2026-09-03: "Katılım Günleri" popup'ı — .gg-day-pill (dar sabit-genişlik
   kısa etiket) İÇİN DEĞİL, burada tam gün adı + saat gösteren dikey liste
   satırları kullanılıyor (bkz. gruplarEditMemberDaysAsk). */
.gg-member-days-popup { min-width: min(92vw, 360px) !important; }
.gg-member-days-name {
    font-size: 15px;
    font-weight: 700;
    color: #1a2332;
    margin-bottom: 14px;
}
.gg-member-days-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 20px;
}
.gg-member-day-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border: 1.5px solid #e5e9ef;
    border-radius: 8px;
    transition: all 0.15s ease;
}
.gg-member-day-row:has(.form-t1-checkbox:checked) {
    background: #e6f5f3;
    border-color: #009687;
}
.gg-member-day-row label {
    font-size: 14px;
    font-weight: 600;
    color: #1a2332;
    cursor: pointer;
    flex: 1;
}
.gg-member-day-row label span {
    font-weight: 400;
    color: #7b8795;
    margin-left: 6px;
}

.gg-members-empty {
    text-align: center;
    color: #b0b8c4;
    font-size: 13px;
    padding: 32px 16px;
    line-height: 1.6;
}

/* Üye Seç popup'ı (gruba üye ekleme) — gg-member-* ile aynı görsel dil */
.gmp-row {
    display: flex;
    align-items: center;
    padding: 10px 16px;
    gap: 12px;
    border-bottom: 1px solid #f7f7f7;
    cursor: pointer;
    transition: background 0.1s;
}
.gmp-row:last-child { border-bottom: none; }
.gmp-row:hover { background: #f4fcfb; }
.gmp-row:hover .gmp-add { background: #009687; color: #fff; }

.gmp-name {
    flex: 1;
    font-size: 13px;
    font-weight: 500;
    color: #1a2332;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gmp-add {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 600;
    color: #009687;
    background: #e6f7f5;
    flex-shrink: 0;
    transition: background 0.1s, color 0.1s;
}

/* "Önce kaydet" mesajı */
.gg-save-first {
    padding: 24px 20px;
    text-align: center;
    color: #9ba4b0;
    font-size: 13px;
    line-height: 1.6;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ── Tehlike alanı ──────────────────────────────────────────────── */
.gg-danger {
    margin: 12px 20px 0;
    padding: 11px 14px;
    background: #fff5f5;
    border: 1px dashed #fca5a5;
    border-radius: 8px;
    font-size: 13px;
    color: #991b1b;
}
.gg-danger label {
    cursor: pointer;
    user-select: none;
    margin-left: 6px;
}

/* ── Alt buton satırı ───────────────────────────────────────────── */
.gg-bottom .page-top-right-button { padding: 4px 16px 16px; }

/* ════════════════════════════════════════════════════════════════════
   YENİ DERS KAYDET POPUP  (au-*)
   ════════════════════════════════════════════════════════════════════ */

.au-popup {
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    align-items: stretch !important;
    min-width: min(92vw, 680px) !important;
}

/* ── Tarih/Saat başlık şeridi ──────────────────────────────────── */
.au-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 22px;
    background: linear-gradient(135deg, #007d72 0%, #009687 60%, #00b5a3 100%);
    color: #fff;
}

/* Tarih metni */
.au-header .class-session-selected-date { display: flex; align-items: center; }
.au-header .au-date-text {
    font-size: 17px;
    font-weight: 700;
    color: rgba(255,255,255,.92);
    letter-spacing: 0.2px;
}

/* Saat chip */
.au-header .au-time-chip { font-size: 0; }
.au-header .au-time-chip span {
    display: inline-flex;
    align-items: center;
    padding: 6px 16px;
    background: rgba(255,255,255,.18);
    border: 1.5px solid rgba(255,255,255,.35);
    border-radius: 20px;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    cursor: pointer;
    transition: background 0.15s;
    letter-spacing: 1px;
}
.au-header .au-time-chip span:hover {
    background: rgba(255,255,255,.30);
}

/* ── Gövde ──────────────────────────────────────────────────────── */
.au-body {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
}

.au-left {
    flex: 1 1 0;
    padding: 20px 20px 16px;
    border-right: 1px solid #f0f0f0;
    min-width: 0;
}

.au-right {
    flex: 0 0 260px;
    padding: 20px 20px 16px;
    min-width: 0;
}

/* ── Form elemanları ─────────────────────────────────────────────── */
.au-field { margin-bottom: 16px; }

.au-field-row {
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
}
.au-field-row .au-field { margin-bottom: 0; }
.au-field-sm { flex: 0 0 80px; }
.au-field-row > .au-field:not(.au-field-sm) { flex: 1; }

.au-label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    color: #9ba4b0;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 6px;
}
.au-label span {
    font-size: 11px;
    font-weight: 400;
    text-transform: none;
    color: #c4cad2;
    letter-spacing: 0;
}

.au-input {
    width: 100%;
    height: 40px;
    padding: 0 12px;
    font-size: 14px;
    font-weight: 500;
    color: #1a2332;
    background: #fff;
    border: 1.5px solid #e5e9ef;
    border-radius: 8px;
    outline: none;
    box-sizing: border-box;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.au-input:focus {
    border-color: #009687;
    box-shadow: 0 0 0 3px rgba(0,150,135,.10);
}
.au-input::placeholder { color: #c4cad2; }

/* Ders sayısı hızlı seçim butonları (2026-08-17) */
.au-quick-counts {
    display: flex;
    gap: 6px;
    margin-top: 8px;
}
.au-quick-counts .popup-t1-btn1 {
    flex: 1;
    padding: 7px 4px;
    font-size: 13px;
}

/* ── Üye / Eğitmen seçici ───────────────────────────────────────── */
.au-selector-wrap { cursor: pointer; }

/* Başlangıç butonu (seçim yapılmadan önce) */
.au-popup .au-selector button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 40px;
    border: 1.5px dashed #c8d0da;
    border-radius: 8px;
    background: #fafbfc;
    color: #009687;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
    font-family: inherit;
}
.au-popup .au-selector button:hover {
    background: #e6f5f3;
    border-color: #009687;
    border-style: solid;
}

/* Seçili durum — class-session-select-member-edit override */
.au-popup .class-session-select-member-edit {
    display: flex;
    align-items: center;
    width: 100%;
    height: 40px;
    padding: 0 12px;
    background: #e6f5f3;
    border: 1.5px solid #009687;
    border-radius: 8px;
    margin-bottom: 4px;
    box-sizing: border-box;
    cursor: pointer;
}
.au-popup .class-session-select-member-edit span:first-child {
    flex: 1;
    font-size: 13px;
    font-weight: 600;
    color: #009687;
    text-decoration: none;
    font-style: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.au-popup .class-session-select-member-edit .info {
    width: 20px;
    height: 20px;
    background-size: 14px;
    margin-left: 6px;
    filter: invert(41%) sepia(71%) saturate(400%) hue-rotate(133deg) brightness(90%);
}

/* Grup seçili (kırmızı yerine amber) */
.au-popup .class-session-select-membergroup-edit {
    background: #fff8e6;
    border-color: #f59e0b;
}
.au-popup .class-session-select-membergroup-edit span:first-child {
    color: #92400e;
}
.au-popup .class-session-select-membergroup-edit .info {
    filter: invert(37%) sepia(90%) saturate(800%) hue-rotate(20deg) brightness(95%);
}

/* Düşük ders hakkı uyarısı */
.au-popup .class-session-select-member-edit-alert {
    border-radius: 0 0 8px 8px;
    margin-top: -4px;
    background: #fffbeb;
    color: #92400e;
    font-size: 11px;
    border: 1px solid #fde68a;
    border-top: none;
}

/* ── Ücretlendirme bölümü ────────────────────────────────────────── */
.au-pricing-section {
    padding: 16px 20px 14px;
    border-top: 1px solid #f0f0f0;
    background: #fafafa;
}

.au-pricing-chips {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 8px;
    margin-bottom: 16px;
}

.au-pricing-chip { display: inline-flex; cursor: pointer; }
.au-pricing-chip input[type="radio"] { display: none; }
.au-pricing-chip span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 14px;
    border-radius: 20px;
    border: 1.5px solid #e5e9ef;
    background: #f4f6f8;
    font-size: 13px;
    color: #6b7280;
    font-weight: 500;
    transition: all 0.15s;
    white-space: nowrap;
}
.au-pricing-chip:hover span {
    border-color: #009687;
    color: #009687;
    background: #e6f5f3;
}
.au-pricing-chip input[type="radio"]:checked + span {
    background: #009687;
    border-color: #009687;
    color: #fff;
    font-weight: 600;
}
.au-pricing-chip input[type="radio"]:disabled + span {
    opacity: 0.45;
    cursor: not-allowed;
    pointer-events: none;
}
.au-pricing-chip em.session_count {
    font-style: normal;
    font-size: 11px;
    opacity: 0.8;
}

/* Tutar alanları */
.au-amount-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.au-amount-field { flex: 1; min-width: 140px; }
.au-amount-field .takvim-amount-paid-row { margin-top: 0; }
/* 2026-08-24 (kullanıcı bildirdi: "tutar alanları düzensiz görünüyor") —
   ipucu metni artık etiketin İÇİNDE değil, girdinin ALTINDA ayrı bir
   satır (.au-field-hint) — böylece "Toplam Tutar"/"Ödenen Tutar" etiketleri
   ikisi de tek satır kalıp doğal olarak aynı hizada başlıyor. */
.au-field-hint {
    font-size: 11px;
    color: #9ba4b0;
    line-height: 1.4;
    margin-top: 6px;
}

/* ── Alt buton ───────────────────────────────────────────────────── */
.au-footer {
    border-top: 1px solid #f0f0f0;
    background: #fafafa;
}
.au-footer .page-top-right-button { padding: 4px 16px 16px; }

/* ── İşletme Bilgileri — Form Grupları ────────────────────────────── */
.isletme-form-body {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(400px, 2fr);
    /* 2026-08-11: dense packing — dar (wide olmayan) bölümler DOM sırasına
       bakılmaksızın önceki boş hücreleri doldurur. Önceden "sparse" (varsayılan)
       akışta, araya bir "wide" bölüm girince (ör. Aktif Takvimler) ondan
       ÖNCEKİ dar bölüm (Temel Bilgiler) yanında boş bir hücre kalıyor, SONRAKİ
       dar bölüm (İşletme Logosu) de kendi satırında yalnız kalıp aynı sorunu
       tekrarlıyordu — kullanıcı ekran görüntüsündeki "tasarım kötü" şikayeti
       buydu. dense, bu tür kombinasyonlarda (hangi sıraya eklenirse eklensin)
       dar bölümleri otomatik eşleştirir, elle sıralama/kırılganlık kalmaz. */
    grid-auto-flow: dense;
    gap: 16px;
    padding: 20px;
}
/* Kaydet butonu her zaman altta tam genişlik */
.isletme-form-body > .isletme-form-footer {
    grid-column: 1 / -1;
}
.isletme-section-wide {
    grid-column: 1 / -1;
}
.isletme-section {
    background: #f8f9fb;
    border: 1px solid #e8eaed;
    border-radius: 10px;
    overflow: hidden;
    /* Kartlar kendi sütunlarında tam yükseklik */
    display: flex;
    flex-direction: column;
}
.isletme-section-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 16px;
    background: #f0f2f5;
    border-bottom: 1px solid #e8eaed;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: #6b7280;
    flex-shrink: 0;
}
.isletme-section-body {
    padding: 18px 16px;
    display: flex;
    flex-wrap: wrap;
    gap: 14px 20px;
    flex: 1;
    align-content: flex-start;
}
.isletme-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    /* 2026-08-05: flex-grow KAPALI — "Çalışma Takvimi" tam genişliğe
       yayılınca (bkz. .isletme-section-wide), grow:1 her alanı satırın
       kalan tüm boşluğuna eşit dağıtıp Mesai Başlangıcı/Bitişi gibi dar
       alanlarda kutunun içi boş, aralarında dev bir açıklık bırakıyordu.
       Artık alanlar kendi doğal genişliğinde duruyor. */
    flex: 0 1 200px;
    min-width: 0;
}
.isletme-field.isletme-field-full {
    flex-basis: 100%;
}
.isletme-field label {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    letter-spacing: 0.02em;
}
.isletme-field .nc-input {
    height: 38px;
    font-size: 14px;
    border-radius: 7px;
    width: 100%;
}
.isletme-field input[type="text"] {
    width: 100%;
    height: 38px;
    font-size: 14px;
    border: 1px solid #d1d5db;
    border-radius: 7px;
    padding: 0 10px;
    background: #fff;
    outline: none;
    transition: border-color 0.15s;
    box-sizing: border-box;
}
.isletme-field input[type="text"]:focus {
    border-color: #009687;
}
.isletme-checkbox-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #1a202c;
    cursor: pointer;
}
.isletme-checkbox-label input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: #009687;
    cursor: pointer;
}
/* 2026-08-11 (kullanıcı isteği): iki takvim seçeneği artık yan yana —
   dikey yer kaplamak yerine kartın sağındaki boşluk değerlendiriliyor.
   min-width sayesinde dar ekranda otomatik alt alta düşer (flex-wrap
   zaten .isletme-section-body'de var). */
.isletme-cal-option {
    flex: 1 1 320px;
    min-width: 280px;
}
.isletme-cal-footnote {
    flex-basis: 100%;
    margin-top: 10px;
    padding-top: 12px;
    border-top: 1px dashed #e4e8ee;
}
.isletme-checkbox-hint {
    font-size: 12.5px;
    color: #6b7280;
    margin: 3px 0 0 24px;
    line-height: 1.6;
}
.isletme-checkbox-hint ul {
    margin: 6px 0 0;
    padding-left: 18px;
}
.isletme-checkbox-hint li {
    margin-bottom: 4px;
}
.isletme-checkbox-hint li:last-child {
    margin-bottom: 0;
}
/* 2026-08-29 (canlı hata: aktif şubede branch-level "Genel Takvimi Aç"
   işaretlenmemişse üyeler hiç ders göremiyordu, iki ayrı "Genel Takvim"
   anahtarı karıştırılıyordu) — şirket-düzeyi Genel Takvim checkbox'ının
   hemen altında, sadece gerektiğinde görünen uyarı kutusu. */
.isletme-cal-branch-warning {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 12.5px;
    color: #9a6400;
    background: #fff4e0;
    border: 1px solid #ffe2ad;
    border-radius: 8px;
    padding: 10px 12px;
    line-height: 1.6;
    margin: 10px 0 0 24px;
}
/* .hidden (site.css üstü) `display:none` — aynı özgüllükte (0-1-0) ve
   sonradan tanımlanan .isletme-cal-branch-warning'in `display:flex`'i onu
   eziyordu (kaynak sırası kazanıyordu). Bu proje için bilinen desen — bkz.
   .popup-t-content-header a örneği — daha özgül birleşik seçici ile çözülür. */
.isletme-cal-branch-warning.hidden {
    display: none;
}
.isletme-cal-branch-warning i {
    font-size: 15px;
    margin-top: 1px;
    flex-shrink: 0;
}

/* Ana checkbox'a (ör. "Genel Takvim") bağlı, girintili alt-seçenek —
   2026-08-24, "online rezervasyona açık" ayarı. */
.isletme-checkbox-sub {
    margin: 12px 0 0 24px;
    padding-left: 12px;
    border-left: 2px solid #e4e8ee;
}
.isletme-checkbox-sub .isletme-checkbox-label {
    font-size: 13px;
    font-weight: 500;
    color: #37474f;
}
.isletme-checkbox-sub .isletme-checkbox-hint {
    margin-left: 24px;
}
.isletme-save-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 32px;
    background: #009687;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    border: none;
    transition: background 0.15s, box-shadow 0.15s;
}
.isletme-save-btn:hover {
    background: #007d70;
    box-shadow: 0 3px 10px rgba(0,150,135,.28);
}

/* ── Tehlikeli Bölge (2026-08-11) ─────────────────────────────────────── */
.isletme-danger-card {
    border: 1.5px solid #f5c2c7;
    border-radius: 10px;
    overflow: hidden;
}
.isletme-danger-title {
    color: #b02a37;
}
.isletme-danger-desc {
    font-size: 13px;
    color: #6b7280;
    line-height: 1.6;
    margin-bottom: 14px;
}
.isletme-danger-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 24px;
    background: #dc3545;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    border: none;
    transition: background 0.15s, opacity 0.15s;
}
.isletme-danger-btn:hover { background: #b02a37; }
.isletme-danger-btn:disabled {
    background: #e9a0a8;
    cursor: default;
    opacity: 0.7;
}
.isletme-danger-warning {
    font-size: 13px;
    color: #842029;
    background: #fff5f5;
    border: 1px solid #f5c2c7;
    border-radius: 8px;
    padding: 12px 14px;
    line-height: 1.6;
    margin-bottom: 16px;
}
.isletme-danger-checklist {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}
.isletme-danger-check-row {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #1a202c;
    cursor: pointer;
}
.isletme-danger-check-row input[type="checkbox"] {
    width: 16px;
    height: 16px;
    accent-color: #dc3545;
    cursor: pointer;
    flex-shrink: 0;
}
.isletme-danger-count {
    font-size: 12px;
    color: #9ca3af;
    font-weight: 500;
}
.isletme-danger-member-balance {
    border-top: 1px dashed #e4e8ee;
    padding-top: 14px;
    margin-bottom: 16px;
}
.isletme-danger-hint {
    font-size: 11px;
    color: #9ca3af;
    margin: 4px 0 0 26px;
    line-height: 1.5;
}

/* ── İşletme Bilgileri — Logo (2026-07-06) ─────────────────────────── */
.isletme-logo-row {
    display: flex;
    align-items: center;
    gap: 18px;
}
.isletme-logo-preview {
    width: 84px;
    height: 84px;
    flex-shrink: 0;
    border-radius: 14px;
    border: 1px dashed #d1d5db;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.isletme-logo-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.isletme-logo-preview span {
    font-size: 11px;
    color: #9ca3af;
    text-align: center;
}
.isletme-logo-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-start;
}
.isletme-logo-select-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 18px;
    background: #fff;
    color: #009687;
    font-size: 13px;
    font-weight: 600;
    border-radius: 7px;
    cursor: pointer;
    border: 1.5px solid #009687;
    transition: background 0.15s;
}
.isletme-logo-select-btn:hover {
    background: #e7f7f5;
}
.isletme-logo-hint {
    font-size: 11px;
    color: #9ca3af;
}
.isletme-logo-status {
    font-size: 12px;
    font-weight: 600;
}
.isletme-logo-status.success { color: #2e7d32; }
.isletme-logo-status.error { color: #c62828; }

/* ── İşletme Bilgileri — Mesai Saatleri ──────────────────────────── */
.isletme-workhours-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.isletme-workhours-field {
    display: flex;
    align-items: center;
    gap: 6px;
}
.isletme-workhours-lbl {
    font-size: 13px;
    color: #6b7280;
    white-space: nowrap;
}
.isletme-workhours-select {
    width: 90px !important;
    padding: 6px 8px !important;
}
.isletme-workhours-sep {
    font-size: 18px;
    color: #9ca3af;
    line-height: 1;
}

/* ── İşletme Bilgileri — Standart Randevu Süresi pilleri ─────────── */
/* ── Çalışma Günleri ─────────────────────────────────────────── */
.isletme-workdays-row {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}
.isletme-workday-pill {
    cursor: pointer;
    user-select: none;
}
.isletme-workday-pill input[type="checkbox"] {
    display: none;
}
.isletme-workday-pill span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    padding: 6px 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: #374151;
    background: #f4f6f8;
    border: 1.5px solid #e5e9ef;
    border-radius: 8px;
    transition: background 0.12s, border-color 0.12s, color 0.12s;
}
.isletme-workday-pill input[type="checkbox"]:checked + span {
    background: #009687;
    border-color: #009687;
    color: #fff;
}
.isletme-workday-pill span:hover {
    background: #e8f7f6;
    border-color: #009687;
    color: #009687;
}

.isletme-duration-pills {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.isletme-duration-pill {
    cursor: pointer;
    user-select: none;
}
.isletme-duration-pill input[type="radio"] {
    display: none;
}
.isletme-duration-pill span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 7px 20px;
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    background: #f4f6f8;
    border: 1.5px solid #e5e9ef;
    border-radius: 9px;
    transition: background 0.12s, border-color 0.12s, color 0.12s, box-shadow 0.12s;
}
.isletme-duration-pill input[type="radio"]:checked + span {
    background: #009687;
    border-color: #009687;
    color: #fff;
    box-shadow: 0 3px 10px rgba(0,150,135,.28);
}
.isletme-duration-pill span:hover {
    background: #e8f7f6;
    border-color: #009687;
    color: #009687;
}

/* ── Mesai Başlangıcı/Bitişi + Randevu Süresi — yan yana satır (2026-08-05,
   kullanıcı isteği). Masaüstünde üç alan tek satırda, mobilde Randevu
   Süresi kendi satırına düşer. ─────────────────────────────────────── */
.isletme-workrow {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: flex-start;
}
.isletme-workrow-item {
    flex: 0 0 auto;
}
.isletme-workrow-duration {
    flex: 1 1 240px;
}

/* ════════════════════════════════════════════════════════════════════
   MASAÜSTÜ GENİŞLEMESİ  —  @media (min-width: 769px)
   Geniş ekranlarda popup'lar daha fazla alan kullanır.
   ════════════════════════════════════════════════════════════════════ */
@media (min-width: 769px) {

    /* ── 1. Dersi Düzenle: es-wrapper tam genişlik ── */
    .es-wrapper {
        width: 100%;
        min-width: 500px;
    }

    /* ── 2. Alan-1: 2 kolonlu CSS Grid
            Sol  → bilgi bölümleri (üye, tarih, eğitmen)
            Sağ  → eylem butonları + sil butonu           ── */
    .es-wrapper .popup-editsession-area-1 {
        display: grid !important;
        grid-template-columns: 1fr 220px;
        align-items: start;
    }

    /* Uyarı ve onay panelleri tam genişlik kaplar */
    .es-wrapper .popup-editsession-area-1 > .es-low-alert,
    .es-wrapper .popup-editsession-area-1 > .es-confirm-done {
        grid-column: 1 / -1;
    }

    /* Bilgi bölümleri → sol kolon */
    .es-wrapper .popup-editsession-area-1 > .es-section {
        grid-column: 1;
        padding: 14px 20px;
    }

    /* Durum butonları → sağ kolon, dikey sıralı */
    .es-wrapper .popup-editsession-area-1 > .session-editsession-buttons {
        grid-column: 2;
        flex-direction: column;
        align-items: stretch;
        border-bottom: none;
        border-left: 1px solid #e8ecef;
        padding: 16px 14px;
        gap: 8px;
    }

    /* Durum butonları sağ kolonu tamamen kaplasın */
    .es-wrapper .popup-editsession-area-1 > .session-editsession-buttons .es-btn {
        width: 100%;
        justify-content: flex-start;
        padding: 10px 14px;
    }

    /* Kaydet + Sil çubuğu → iki kolonun altında tam genişlik */
    .es-wrapper .popup-editsession-area-1 > .es-save-bar {
        grid-column: 1 / -1;
        border-top: 1px solid #e8ecef;
        padding: 12px 20px 16px;
    }

    /* 2026-08-24 (kullanıcı: "sağ tarafın bu şekilde boş kalması kötü
       görünüyor") — hiçbir durum butonu görünür değilse (ör. ileri tarihli
       bekleyen bir ders) sağ 220px'lik buton kolonu tamamen kaldırılır, tek
       sütuna düşülür — bkz. _showStateButtons'taki es-no-actions kararı. */
    .es-wrapper.es-no-actions .popup-editsession-area-1 {
        grid-template-columns: 1fr;
    }
    .es-wrapper.es-no-actions .popup-editsession-area-1 > .session-editsession-buttons {
        display: none;
    }

    /* ── 3. İptal / Silme onay alanları tam genişlik ── */
    .es-wrapper .popup-editsession-area-2,
    .es-wrapper .popup-editsession-area-3 {
        padding: 20px;
    }

    /* ── 4. Bekleyen Dersler listesi (2026-08-18, kullanıcı isteği) —
       masaüstünde artık tam genişlik olan bu bölümde tek sütun uzun bir
       liste yerine 2 sütun kullanılıyor, listenin dikey yüksekliği yarıya
       iniyor. Mobilde (bu media query dışında) tek sütun kalır. ── */
    .mpc-session-list {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 24px;
    }
}

/* ════════════════════════════════════════════════════════════════════
   MOBİL UYUMLULUK  —  @media (max-width: 768px)
   Tüm sabit genişlik ve overflow sorunlarını responsive hale getirir.
   ════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {

    /* ── 1. Sidebar başlangıçta kapalı (JS ile toggle edilir) ──
       2026-08-20 (canlı hata düzeltmesi: "mobil görünümde menü açılmıyor") —
       `!important` burada site.js:leftMenu()'nün açarken yazdığı inline
       `style.width = '250px'`i de eziyordu (inline stil normalde kazanır,
       ama stylesheet'teki !important HER ZAMAN kazanır) — menü teknik olarak
       "açılıyordu" ama genişliği hep 0'da kalıyordu. `!important` GEREKSİZDİ:
       bu kural zaten masaüstü `.app-menu{width:250px}` kuralından SONRA
       geliyor, eşit özgüllükte SONRAKİ kural zaten kazanır — kaldırılması
       başlangıçtaki "kapalı" durumu bozmuyor, sadece JS'in inline stille
       açabilmesini engelleyen kilidi kaldırıyor. */
    .app-menu {
        width: 0;
        overflow: hidden;
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        z-index: 1000;
    }
    .app-content {
        width: 100% !important;
        min-width: 100% !important;
    }
    /* Menü açıkken overlay: fixed olmalı çünkü sidebar fixed */
    .app-content-menublock {
        position: fixed;
        z-index: 999;
        left: 0;
        top: 0;
        bottom: 0;
        right: 0;
    }

    /* ── 2. Genel içerik padding küçült ── */
    .content-area {
        padding: 12px;
    }
    .content-full {
        width: 100%;
        margin: 10px 0;
        border-radius: 0;
    }
    .content-full-inside {
        padding: 10px 8px;
    }

    /* ── 3. Takvim başlık alanı: gün seçici + şube butonları ── */
    .home-day-branch-area {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    /* 2026-08-31 (kullanıcı isteği: "bugün/yarın butonları mobilde de yan
       tarafa sığabilir") — Bugün/Yarın dikey/dar bir çift olduğu için (bkz.
       .takvim-quick-jump), gün seçicinin YANINDA kalabiliyor; bu yüzden
       SADECE bu ikiliyi içeren örnekte satır düzenini koruyoruz. Diğer
       .home-day-branch-area kullanımları (ör. şube butonlu Genel Takvim)
       yukarıdaki column davranışını olduğu gibi korur.
       :has() burada seçiciyi (.0-2-0) yukarıdaki kuraldan (0-1-0) daha
       spesifik yapıyor, sıralamadan bağımsız kazanır. */
    .home-day-branch-area:has(.takvim-quick-jump) {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }
    /* Mobilde masaüstündeki 20px sağ boşluk fazla yer kaplıyor — daha dar */
    .takvim-quick-jump {
        margin-right: 6px;
    }
    .home-day-selectedday-txt {
        /* aynı sebep — mobilde de sabit genişlik, aksi halde ok butonları
           dar ekranda daha da belirgin şekilde zıplıyordu */
        width: 145px;
        font-size: 18px;
    }
    .home-branches-button {
        flex-wrap: wrap;
        margin-left: 0;
        gap: 6px;
    }
    .home-branches-button div {
        padding: 0 12px;
        font-size: 13px;
    }

    /* ── 4. Takvim tablosu: yatay scroll — küçülmesin ── */
    .home-branch-lessons {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .home-today-program td {
        min-width: 130px;
        padding: 4px 6px;
        font-size: 12px;
    }
    .home-today-program th {
        padding: 8px 6px;
        font-size: 12px;
    }

    /* ── 4b. Saat sütunu sabit — 2026-09-01'de masaüstüne de taşındığı için
       (bkz. yukarıdaki `.home-today-program th:first-child`/`td:first-child`
       temel kuralı) sticky/z-index/arka plan/border-radius:0 burada TEKRAR
       YAZILMIYOR, hepsi zaten oradan miras alınıyor — eskiden burada sadece
       mobile'a özgü bir `border-radius: 0` override'ı vardı, artık temel
       kural aynı değeri taşıdığı için gereksizdi, kaldırıldı. ── */

    /* ── 4c. Yeni Ders Kaydet/Güncelle popup'ı — sağ sütun sabit 260px
       genişlikte olduğu için mobilde sol sütunla sıkışıyordu (2026-08-24,
       kullanıcı bildirdi) — alt alta geçsin diye tek sütuna indirildi.
       `align-items: stretch` ŞART — masaüstü kuralı (.au-body{align-items:
       flex-start}) row modunda "sütunlar farklı yükseklikte kalsın" için
       vardı, ama column moduna geçince ÇAPRAZ EKSEN yataya döner ve aynı
       kural sütunları TAM GENİŞLİĞE yaymak yerine kendi içeriği kadar
       daraltıyordu (kullanıcı ekran görüntüsü: sağda büyük boş alan). ── */
    .au-body {
        flex-direction: column;
        align-items: stretch;
    }
    .au-left {
        border-right: none;
        border-bottom: 1px solid #f0f0f0;
        padding: 16px 16px 12px;
    }
    .au-right {
        flex: 1 1 auto;
        padding: 16px 16px 12px;
    }

    /* ── 4d. Tutar kutuları taşıyordu (2026-08-24, kullanıcı bildirdi) —
       flex öğeleri (ve <input>'lar) varsayılan olarak min-width:auto alır,
       bu da içerik genişliği kadar KÜÇÜLMEYİ REDDETMELERİNE (flex-shrink
       çalışmaz hale gelmesine) yol açar — width:100% verilmiş olması bile
       bunu çözmez. min-width:0 ile gerçek küçülme serbest bırakılıyor,
       ayrıca kutular biraz daraltılıyor. ── */
    .au-amount-field,
    .au-input,
    .takvim-amount-paid-row {
        min-width: 0;
    }
    .au-input {
        height: 36px;
        padding: 0 8px;
        font-size: 13px;
    }
    .mpc-gp-copy-btn {
        padding: 0 8px;
    }

    /* ── 4e. Genel Takvim — saat sütunu sabit (2026-08-24, kullanıcı isteği:
       Üye Takvimi'ndeki AYNI düzeltme burada da yapılsın). Burada th/td
       arka planları zaten sabit (#fafafa) olduğu için ayrıca eklemeye
       gerek yok. BİLEREK z-index YOK — bkz. 4b'deki geniş not (popup'ın
       kendi z-index'i olmadığı için pozitif bir z-index popup'ı geçip önüne
       geçebiliyordu). ── */
    .gtk-grid thead th:first-child,
    .gtk-grid tbody th {
        position: sticky;
        left: 0;
    }

    /* ── 4f. Ödemeler — liste+detay yan yana sıkışıyordu (2026-08-24,
       kullanıcı bildirdi: üye isimleri "C..." gibi kısalıyordu). Mobilde
       tek sütuna indiriliyor; bir kayıt seçilene kadar sadece liste, kayıt
       seçilince (bkz. _partner-odemeler.js: odemelerSelectBill/
       odemelerBackToList'in eklediği/kaldırdığı .odm-detail-active sınıfı)
       sadece detay tam genişlik gösterilir — "Bir kayıt seçin" boş kutusu
       listenin altında yer kaplamasın diye. ── */
    .odm-split {
        flex-direction: column;
        height: auto;
        min-height: 0;
    }
    .odm-list-pane { flex: 1 1 auto; }
    .odm-detail-pane { display: none; }
    .odm-split.odm-detail-active .odm-list-pane { display: none; }
    .odm-split.odm-detail-active .odm-detail-pane { display: block; }
    .odm-detail-back {
        display: block;
        padding: 12px 16px;
        font-size: 13px;
        font-weight: 600;
        color: #009687;
        border-bottom: 1px solid #f0f0f0;
        cursor: pointer;
    }

    /* ── 4g. Grubu Düzenle/Ekle popup'ı — 2026-09-09'da tek sütuna
       geçildiği için masaüstüyle mobil aynı akışı kullanıyor, burada
       SADECE iç boşluk daraltılıyor. ── */
    .gg-left { padding: 16px 16px 12px; }

    /* ── 5. İçerik liste satırları ── */
    .content-list-row {
        height: auto;
        min-height: 45px;
        flex-wrap: wrap;
        padding: 4px 0;
    }
    .content-list-title {
        line-height: 1.4;
        white-space: normal;
        padding: 6px 0;
    }
    .content-list-info1 {
        width: auto;
        min-width: 60px;
        font-size: 12px;
    }

    /* ── 6. Popup genel: sağ/sol %1 boşluk ── */
    .popup-t-move {
        min-width: 0 !important;
        max-width: 98vw !important;
        width: 98vw !important;
        margin: 0 auto;
    }
    .popup-t-content-area {
        margin: 0;
        max-height: 100dvh;
        border-radius: 0;
    }
    .popup-t-content {
        border-radius: 8px;
        max-height: calc(100dvh - 16px);
        margin-top: 8px;
        overflow: hidden;
    }
    .popup-t-content-i {
        max-height: calc(100dvh - 74px);
    }

    /* ── 7. Form popup'ları: tek sütun, tam genişlik ── */
    .popup-content-default-area,
    .popup-content-default-area:not(.member-profile-card) {
        min-width: 0 !important;
        padding: 12px;
        flex-direction: column;
    }
    .form-t1-input-area {
        width: 100%;
        max-width: 100%;
        flex: 0 0 100%;
        margin-bottom: 12px;
    }
    .form-t1-input-row {
        flex-direction: column;
        gap: 0;
    }
    .form-t1-input-col {
        width: 100%;
    }
    /* Kullanıcı Ekle/Düzenle popup'unun 2 sütunu mobilde tek sütuna düşer. */
    #popup [data-old-id="#popup-id-isletme-user"] .isletme-user-col {
        flex: 1 0 100%;
        max-width: 100%;
        min-width: 0;
    }

    /* ── 8. Üye / Grup edit session wrapper'ları — tam genişlik ── */
    .es-wrapper {
        width: 100%;
    }
    .tus-wrapper {
        width: 100%;
    }

    /* ── 9. Popup buton alanları ── */
    .es-actions {
        gap: 6px;
        padding: 10px 12px;
    }
    .es-btn {
        padding: 8px 10px;
        font-size: 12px;
    }

    /* ── 10. Ödemeler paneli üst çubuk ── */
    .odm-topbar {
        flex-direction: column;
        align-items: flex-start;
    }
    .odm-status-tabs,
    .odm-period-tabs {
        flex-wrap: wrap;
    }
    .odm-status-tab {
        padding: 6px 12px;
        font-size: 0.8em;
    }
    .odm-period-tab {
        padding: 5px 10px;
        font-size: 0.75em;
    }
    .odm-summary {
        padding: 10px 12px 4px;
        gap: 8px;
    }

    /* ── 11. Popup: sayfa üstü butonlar (Kaydet, Sil vb.) ── */
    .page-top-right-button a,
    .page-top-right-button .page-top-right-button-btn {
        margin-top: 10px;
        margin-right: 10px;
        height: 36px;
        padding: 0 12px;
        font-size: 13px;
    }
    .popup-t-content-header a {
        margin-right: 10px;
    }
    /* Dar ekranlarda "Şirket ID:" etiketi yer kaplamasın, sadece değer+kopyala kalsın */
    .isletme-company-id-box {
        padding-right: 10px;
        font-size: 11px;
    }
    .isletme-company-id-label { display: none; }
    .isletme-company-id-value { padding: 2px 5px; }
    /* 2026-08-28 — Üyeler başlık butonları artık kendi grubunda (bkz.
       .uyeler-header-actions), kendi `gap`'i zaten aralarındaki boşluğu
       veriyor — yukarıdaki genel kural üzerine BİNMESİN diye sıfırlanıyor.
       Dar ekranlarda 2 buton + başlık tek satıra sığmayabileceği için grup
       da küçültülüyor ("(QR)" ibaresi kısaltılıp metin küçültülerek). */
    .uyeler-header-actions {
        gap: 6px;
        margin-right: 10px;
    }
    .popup-t-content-header a.uyeler-header-btn {
        margin-right: 0;
        height: 32px;
        padding: 0 10px;
        font-size: 12px;
    }
    .uyeler-header-btn-secondary .uyeler-header-btn-qr-suffix {
        display: none;
    }

    /* ── 12. Üye detay kartı (member-profile-card) ── */
    .member-profile-card {
        width: 100%;
    }
    .mpc-stats {
        gap: 0;
    }

    /* ── 13. Eğitmen detay sayfası ── */
    .egitmen-info-header {
        flex-direction: column;
        align-items: flex-start;
    }
    .egitmen-stats {
        flex-wrap: wrap;
    }

    /* ── 14. İçerik arama satırı ── */
    .content-search-area {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
        height: auto;
        margin: 12px 0;
    }
    .content-search-title {
        font-size: 12px;
        font-weight: 700;
        color: #9ba4b0;
        text-transform: uppercase;
        letter-spacing: .4px;
        margin-right: 0;
    }
    .content-search-area input {
        width: 100%;
        box-sizing: border-box;
    }
    .uyeler-sort-group {
        margin-right: 0;
        flex-wrap: wrap;
    }

    /* ── 15. Popup header başlık küçük ekranda kısalt ── */
    .popup-t-content-header-title {
        font-size: 15px;
        padding-left: 12px;
    }

    /* ── 16. İşletme formu — mobilde tek sütun ── */
    .isletme-form-body {
        grid-template-columns: 1fr;
    }

    /* ── 16b. Standart Randevu Süresi — mobilde kendi satırına düşer
       (2026-08-05, kullanıcı isteği) ── */
    .isletme-workrow-duration {
        flex-basis: 100%;
    }

    /* ── 17. Üye detay popup — mobilde tek sütun ── */
    .member-profile-card {
        min-width: unset;
    }
    .mpc-body {
        padding: 12px 16px;
    }
    .mpc-section {
        flex-basis: 100%;
        min-width: unset;
    }
}

/* ════════════════════════════════════════════════════════════════════
   GİDERLER PANELİ
   ════════════════════════════════════════════════════════════════════ */

/* ── Üst bar ── */
.gdr-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px 10px;
    gap: 12px;
}

.gdr-month-nav {
    display: flex;
    align-items: center;
    gap: 4px;
}

.gdr-month-btn {
    width: 32px;
    height: 32px;
    border: 1px solid #d8dee4;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #4a5568;
    transition: background 0.13s;
}

.gdr-month-btn:hover { background: #f0f4f8; }

.gdr-month-btn .ti { font-size: 16px; }

.gdr-month-label {
    min-width: 140px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #1a202c;
}

.gdr-add-btn {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 16px;
    border-radius: 9px;
    border: none;
    background: #009687;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: filter 0.13s;
    white-space: nowrap;
}

.gdr-add-btn:hover { filter: brightness(0.92); }
.gdr-add-btn .ti { font-size: 15px; }

/* ── Özet kartları ── */
.gdr-summary {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    padding: 0 20px 16px;
}

.gdr-card {
    background: #fff;
    border: 1px solid #e8ecef;
    border-radius: 12px;
    padding: 14px 16px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.gdr-card-icon {
    font-size: 22px;
    line-height: 1;
    flex-shrink: 0;
    margin-top: 2px;
}

.gdr-card-label {
    font-size: 11px;
    font-weight: 500;
    color: #8a96a3;
    text-transform: uppercase;
    letter-spacing: .5px;
    margin-bottom: 4px;
}

.gdr-card-value {
    font-size: 17px;
    font-weight: 700;
    color: #1a202c;
    line-height: 1.2;
}

.gdr-card-sub {
    font-size: 11px;
    color: #adb5bd;
    margin-top: 2px;
}

/* ── Bölüm başlıkları ── */
.gdr-section-title {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .6px;
    text-transform: uppercase;
    color: #6b7280;
    padding: 0 20px 8px;
}

.gdr-section-title .ti { font-size: 14px; }

.gdr-section-title-draft { color: #b45309; }
/* ── Onay bekleyenler üst wrapper ── */
.gdr-pending-area {
    border: 2px dashed #fbbf24;
    border-radius: 14px;
    margin: 0 20px 16px;
    background: #fffbeb;
    overflow: hidden;
}

/* pending-area içindeki bölüm başlığı */
.gdr-pending-area .gdr-section-title {
    padding: 10px 20px 6px;
    margin: 0;
    border-bottom: 1px solid #fde68a;
    background: #fef9ec;
}

/* Gider taslakları alt bölümü — wrapper kenarlığı pending-area'dan geliyor */
#gdr-drafts-section {
    padding: 6px 0;
    border-bottom: none;
    background: transparent;
}

.gdr-empty-note {
    padding: 10px 16px;
    color: #94a3b8;
    font-size: 13px;
    font-style: italic;
}

/* ── Taslak satırları (pending-area içinde kullanılır) ── */
.gdr-drafts-section {
    background: transparent;
    padding: 0;
    overflow: hidden;
}

.gdr-draft-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 16px;
    border-bottom: 1px solid #fde68a;
}

.gdr-draft-row:last-child { border-bottom: none; }

.gdr-draft-info { flex: 1; min-width: 0; }

.gdr-draft-ct {
    font-size: 11px;
    color: #92400e;
    margin-bottom: 2px;
}

.gdr-draft-nm {
    font-size: 14px;
    font-weight: 500;
    color: #1a202c;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gdr-draft-amount-wrap {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.gdr-draft-amount-input {
    width: 80px;
    height: 32px;
    border: 1px solid #d0d7de;
    border-radius: 7px;
    text-align: right;
    padding: 0 8px;
    font-size: 14px;
    font-weight: 600;
    color: #1a202c;
    outline: none;
}

.gdr-draft-amount-input:focus {
    border-color: #009687;
    box-shadow: 0 0 0 2px rgba(0,150,135,0.15);
}

.gdr-draft-tl {
    font-size: 13px;
    color: #6b7280;
    flex-shrink: 0;
}

.gdr-draft-actions {
    display: flex;
    gap: 6px;
    flex-shrink: 0;
}

.gdr-draft-btn-confirm,
.gdr-draft-btn-dismiss {
    height: 30px;
    border-radius: 7px;
    border: none;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: filter 0.12s;
}

.gdr-draft-btn-confirm {
    padding: 0 12px;
    background: #009687;
    color: #fff;
}

.gdr-draft-btn-confirm:hover { filter: brightness(0.9); }


.gdr-draft-btn-dismiss {
    width: 30px;
    background: #f0f0f0;
    color: #666;
    padding: 0;
}

.gdr-draft-btn-dismiss:hover { background: #e0e0e0; }

/* Taslak satırı — not ve tarih bilgisi */
.gdr-draft-nt {
    font-size: 12px;
    color: #92400e;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


.gdr-draft-date {
    font-size: 11px;
    color: #9ca3af;
    margin-top: 2px;
}

/* Taslak satırı — salt okunur tutar */
.gdr-draft-amount {
    font-size: 14px;
    font-weight: 700;
    color: #1a202c;
    flex-shrink: 0;
    white-space: nowrap;
}

/* ── Onaylı giderler grupları ── */
.gdr-confirmed-section,
.gdr-instructor-section {
    margin: 0 20px 16px;
}

.gdr-empty {
    padding: 24px;
    text-align: center;
    font-size: 13px;
    color: #adb5bd;
    background: #f8fafc;
    border-radius: 10px;
    border: 1px dashed #d8dee4;
}

.gdr-group {
    margin-bottom: 10px;
    border: 1px solid #e8ecef;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}

.gdr-group-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 14px;
    background: #f8fafc;
    border-bottom: 1px solid #e8ecef;
}

.gdr-group-label {
    font-size: 12px;
    font-weight: 600;
    color: #4a5568;
}

.gdr-group-subtotal {
    font-size: 12px;
    font-weight: 700;
    color: #009687;
}

/* ── Gider satırı ── */
.gdr-expense-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-bottom: 1px solid #f0f2f5;
}

.gdr-expense-row:last-child { border-bottom: none; }


.gdr-expense-info { flex: 1; min-width: 0; }

.gdr-expense-nm {
    font-size: 14px;
    font-weight: 500;
    color: #1a202c;
    display: flex;
    align-items: center;
    gap: 6px;
}

.gdr-expense-nt {
    font-size: 12px;
    color: #8a96a3;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gdr-badge-rc {
    font-size: 11px;
    color: #009687;
    background: #e6f7f5;
    border-radius: 4px;
    padding: 1px 5px;
    font-weight: 700;
}

.gdr-expense-amount {
    font-size: 14px;
    font-weight: 700;
    color: #1a202c;
    white-space: nowrap;
    flex-shrink: 0;
}

.gdr-expense-date {
    font-size: 12px;
    color: #8a96a3;
    flex-shrink: 0;
    min-width: 48px;
    text-align: right;
}

.gdr-expense-edit-btn {
    width: 28px;
    height: 28px;
    border: 1px solid #d8dee4;
    border-radius: 7px;
    background: transparent;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6b7280;
    flex-shrink: 0;
    transition: background 0.12s, color 0.12s;
}

.gdr-expense-edit-btn:hover {
    background: #f0f4f8;
    color: #1a202c;
}

.gdr-expense-edit-btn .ti { font-size: 13px; }

/* ── Gider formu (popup içi) ── */
.gdr-form {
    padding: 16px 20px 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 320px;
}

.gdr-form-field {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.gdr-form-label {
    font-size: 12px;
    font-weight: 600;
    color: #4a5568;
    letter-spacing: .3px;
}

.gdr-form-opt {
    font-weight: 400;
    color: #adb5bd;
}

.gdr-form-input {
    height: 38px;
    border: 1px solid #d0d7de;
    border-radius: 8px;
    padding: 0 10px;
    font-size: 14px;
    color: #1a202c;
    outline: none;
    transition: border-color 0.13s, box-shadow 0.13s;
    width: 100%;
    box-sizing: border-box;
}

.gdr-form-input:focus {
    border-color: #009687;
    box-shadow: 0 0 0 2px rgba(0,150,135,0.15);
}

.gdr-form-select { cursor: pointer; }

.gdr-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.gdr-form-check {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #4a5568;
    cursor: pointer;
}

.gdr-form-check input[type="checkbox"] {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: #009687;
}

.gdr-form-actions {
    display: flex;
    gap: 10px;
    padding-top: 4px;
}

.gdr-form-btn-save {
    flex: 1;
    height: 40px;
    border-radius: 9px;
    border: none;
    background: #009687;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: filter 0.13s;
}

.gdr-form-btn-save:hover { filter: brightness(0.92); }

.gdr-form-btn-delete {
    height: 40px;
    padding: 0 16px;
    border-radius: 9px;
    border: 1.5px solid #e74c3c;
    background: transparent;
    color: #e74c3c;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.13s, color 0.13s;
    white-space: nowrap;
}

.gdr-form-btn-delete:hover {
    background: #e74c3c;
    color: #fff;
}

/* ── Mobil düzeni (2026-08-27: eskiden 600px, sitenin genel 768px mobil
   ayrım noktasına birleştirildi — bkz. .mvd-layout üzerindeki geniş not) ── */
@media (max-width: 768px) {
    .gdr-summary {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        padding: 0 12px 12px;
    }
    .gdr-topbar { padding: 10px 12px 8px; }
    .gdr-confirmed-section,
    .gdr-instructor-section,
    .gdr-pending-area { margin: 0 12px 12px; }
    .gdr-month-label { min-width: 110px; font-size: 14px; }
    .gdr-form-row { grid-template-columns: 1fr; }
}

/* ── Abonelik paneli ─────────────────────────────────────────────────── */
.abn-plan-card {
    background: #fff; border: 1px solid #f0f0f0; border-radius: 10px;
    padding: 16px 20px; margin: 0 20px 16px;
}
.abn-plan-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.abn-plan-name { font-size: 1.2em; font-weight: 700; color: #222; }
.abn-plan-status { font-size: 0.85em; color: #aaa; margin-top: 2px; }
.abn-upgrade-btn {
    background: #009687; color: #fff; border: none; border-radius: 8px;
    padding: 10px 16px; font-weight: 600; font-size: 0.88em; cursor: pointer;
    white-space: nowrap;
}
.abn-upgrade-btn:hover { background: #00a894; }
.abn-upgrade-btn-disabled,
.abn-upgrade-btn-disabled:hover {
    background: #e0e0e0; color: #aaa; cursor: not-allowed;
}
.abn-credit-note {
    font-size: 0.8em; color: #aaa; margin-top: 12px;
    padding-top: 12px; border-top: 1px solid #f5f5f5;
}

.abn-plans-grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
    padding: 0 20px 20px;
}
.abn-plan-option {
    position: relative;
    background: #fff; border: 1px solid #f0f0f0; border-radius: 10px;
    padding: 18px 16px; display: flex; flex-direction: column; gap: 10px;
}
.abn-plan-option-current { border-color: #009687; box-shadow: 0 2px 12px rgba(0,150,135,0.12); }
.abn-plan-option-badge {
    position: absolute; top: -10px; left: 16px;
    background: #009687; color: #fff; font-size: 0.7em; font-weight: 700;
    padding: 3px 10px; border-radius: 20px;
}
.abn-plan-option-name { font-size: 1.05em; font-weight: 700; color: #222; }
.abn-plan-option-price { font-size: 1.4em; font-weight: 700; color: #009687; }
.abn-plan-option-price span { font-size: 0.5em; font-weight: 600; color: #aaa; }
.abn-plan-option-features { display: flex; flex-direction: column; gap: 4px; flex: 1; }
.abn-plan-feature { font-size: 0.85em; color: #666; }
.abn-plan-feature strong { color: #333; }

.abn-usage-grid {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px;
    padding: 0 20px 20px;
}
.abn-usage-card {
    background: #fff; border: 1px solid #f0f0f0; border-radius: 10px; padding: 14px 16px;
}
.abn-usage-label { font-size: 0.78em; color: #aaa; text-transform: uppercase; letter-spacing: 0.4px; margin-bottom: 6px; }
.abn-usage-value { font-size: 1.05em; font-weight: 700; color: #333; margin-bottom: 8px; }
.abn-usage-progress-wrap { height: 8px; background: #f0f0f0; border-radius: 5px; overflow: hidden; }
.abn-usage-progress-bar { height: 100%; background: #009687; border-radius: 5px; transition: width 0.3s; }
.abn-usage-bar-warning { background: #f39c12; }
.abn-usage-bar-danger  { background: #e74c3c; }
.abn-usage-limit-msg   { font-size: 0.75em; color: #e74c3c; margin-top: 6px; font-weight: 600; }

.abn-broadcast-form { padding: 0 20px 20px; }
.abn-broadcast-title { font-weight: 700; color: #222; margin-bottom: 4px; }
.abn-broadcast-desc  { font-size: 0.82em; color: #aaa; margin-bottom: 12px; }
.abn-broadcast-row { display: flex; gap: 10px; flex-wrap: wrap; }
.abn-broadcast-row input {
    flex: 1; min-width: 220px; padding: 10px 12px; border: 1px solid #e0e0e0; border-radius: 8px; font-size: 0.9em;
}
.abn-broadcast-row select {
    padding: 10px 12px; border: 1px solid #e0e0e0; border-radius: 8px; font-size: 0.9em;
}
#abn-broadcast-result { margin-top: 10px; font-size: 0.85em; color: #555; }

/* ── Motiva Yönetimi ile Mesajlaşma (2026-08-17) ─────────────────────── */
.mym-thread {
    max-height: 320px;
    overflow-y: auto;
    padding: 4px 20px 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.mym-empty {
    font-size: 0.85em;
    color: #aaa;
    padding: 20px 0;
    text-align: center;
}
.mym-bubble {
    max-width: 78%;
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 0.9em;
    line-height: 1.5;
}
.mym-bubble-partner {
    align-self: flex-end;
    background: #009687;
    color: #fff;
    border-bottom-right-radius: 3px;
}
.mym-bubble-platform {
    align-self: flex-start;
    background: #f0f2f5;
    color: #222;
    border-bottom-left-radius: 3px;
}
.mym-bubble-label {
    font-size: 0.72em;
    font-weight: 700;
    opacity: 0.7;
    margin-bottom: 3px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}
.mym-bubble-text { white-space: pre-wrap; word-break: break-word; }

.mym-composer { padding: 0 20px 20px; }
.mym-input {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    font-size: 0.9em;
    font-family: inherit;
    resize: vertical;
    box-sizing: border-box;
}
.mym-composer-row { display: flex; justify-content: flex-end; margin-top: 10px; }
.mym-composer-hint { font-size: 0.78em; color: #aaa; margin-top: 6px; line-height: 1.5; }

.mym-btn {
    border: none;
    border-radius: 8px;
    padding: 10px 16px;
    font-weight: 600;
    font-size: 0.88em;
    cursor: pointer;
    white-space: nowrap;
}
/* 2026-09-06 (kullanıcı raporu: "mesaj gönderme butonu ile gönderilen
   mesajlar aynı renklerde görünüyor") — bu butonlar eskiden mesaj
   balonlarıyla (mym-bubble-partner: #009687 dolgu, mym-bubble-platform:
   #f0f2f5 dolgu) BİREBİR aynı renkleri kullanıyordu, bu yüzden "Bize İlet"
   butonu gönderdiğiniz mesajla, "Teşekkürler..." butonu da karşı taraftan
   gelen mesajla görsel olarak karışıyordu. Artık panelin GENEL aksiyon
   rengini (#0b6ffd, bkz. session-editsession-buttons) kullanıyor — sohbet
   balonlarının renkleri (kim gönderdi) ile buton renkleri (aksiyon) artık
   tamamen ayrı. */
.mym-btn-primary { background: #0b6ffd; color: #fff; }
.mym-btn-primary:hover { background: #0b5ed7; }
.mym-btn-primary:disabled { background: #b7c0c9; cursor: default; }
.mym-btn-ghost { background: #fff; color: #555; border: 1.5px solid #e2e5ea; }
.mym-btn-ghost:hover { background: #f4f6f8; }

.mym-ai-answer {
    margin-top: 12px;
    background: #f5fbfa;
    border: 1px solid #c9ede8;
    border-radius: 10px;
    padding: 14px 16px;
}
.mym-ai-answer-label {
    font-size: 0.78em;
    font-weight: 700;
    color: #009687;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 6px;
}
.mym-ai-answer-text { font-size: 0.9em; color: #222; line-height: 1.6; white-space: pre-wrap; }
.mym-ai-answer-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 12px;
}

/* 2026-08-27: eskiden 600px, sitenin genel 768px mobil ayrım noktasına
   birleştirildi — bkz. .mvd-layout üzerindeki geniş not. */
@media (max-width: 768px) {
    .mym-thread, .mym-composer { padding-left: 12px; padding-right: 12px; }
    .mym-bubble { max-width: 90%; }
    .mym-ai-answer-actions { flex-direction: column; }
}

/* ── Test Mesajı Gönder (2026-08-04) ─────────────────────────────────── */
.abn-test-form { padding: 0 20px 20px; }
.abn-test-grid {
    display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0 16px;
}
.abn-test-field { margin-bottom: 12px; }
.abn-test-field label { display: block; font-size: 0.82em; color: #666; margin-bottom: 4px; }
.abn-test-field input,
.abn-test-field select {
    width: 100%; padding: 10px 12px; border: 1px solid #e0e0e0; border-radius: 8px; font-size: 0.9em;
    background: #fff; color: #1a202c; box-sizing: border-box;
}
.abn-test-hint { font-size: 0.78em; color: #aaa; margin: -4px 0 12px; line-height: 1.5; grid-column: 1 / -1; }
.abn-test-params-row { display: grid; grid-template-columns: 1fr; gap: 8px; grid-column: 1 / -1; }
#abn-test-result {
    margin: 10px 0; padding: 10px 14px; border-radius: 8px; font-size: 0.85em; line-height: 1.6; word-break: break-all;
}
#abn-test-result.abn-test-result-success { background: #f0faf4; border: 1px solid #9ae6b4; color: #276749; }
#abn-test-result.abn-test-result-error   { background: #fff5f5; border: 1px solid #feb2b2; color: #c53030; }

/* 2026-08-27: eskiden 600px, sitenin genel 768px mobil ayrım noktasına
   birleştirildi — bkz. .mvd-layout üzerindeki geniş not. */
@media (max-width: 768px) {
    .abn-test-form  { padding: 0 12px 16px; }
    .abn-test-grid  { grid-template-columns: 1fr; }
}

/* ── Grup Dersi Şablonları — gün/saat listesi (2026-08-04) ───────────── */
.isletme-tmpl-days { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.isletme-tmpl-day-row { display: flex; align-items: center; gap: 12px; }
.isletme-tmpl-day-row label { display: flex; align-items: center; gap: 6px; width: 60px; font-size: 0.88em; color: #444; }
.isletme-tmpl-day-row input[type="time"] {
    padding: 6px 8px; border: 1px solid #e0e0e0; border-radius: 6px; font-size: 0.85em;
}

/* ── Kaynak/Hizmet/Grup Dersi Şablonu popup'ları — az alanlı, dar form
   (2026-08-05). Genel .popup-content-default-area kuralı 860px min-width +
   space-between dayatıyor; birkaç alanlık kısa formlarda bu, alanları
   birbirinden koparıp aralarında büyük boşluk bırakıyordu. Bu popup'lar
   için dar, dikey istifli bir düzene geçiliyor.
   DÜZELTME (2026-08-18): bu üç kural `#popup-id-isletme-resource` gibi
   LİTERAL id'lerle hedefliyordu — ama popupOpen() (site.js) her açılan
   popup'a rastgele artan bir id (#popup-id-N) atıyor, orijinal şablon id'si
   sadece data-old-id özniteliğinde kalıyor. Yani bu üç kural ŞİMDİYE KADAR
   HİÇ EŞLEŞMEDİ, ölü CSS'ti — Üye Seç popup'larında olduğu gibi
   [data-old-id=...] ile düzeltildi. Aynı ölü-kural düzeni Genel Takvim'in
   occurrence popup'unda da fark edildi (kullanıcı ekran görüntüsüyle
   bildirdi: üye listesi/boş-durum yazısı ile "+ Üye Ekle" butonu yan yana
   diziliyordu) — o da aynı düzeltmeyle buraya eklendi. ───────────────── */
#popup [data-old-id="#popup-id-isletme-resource"] .popup-content-default-area,
#popup [data-old-id="#popup-id-isletme-service"] .popup-content-default-area,
#popup [data-old-id="#popup-id-isletme-class-template"] .popup-content-default-area {
    min-width: min(90vw, 460px);
    max-width: 460px;
    display: block;
}
#popup [data-old-id="#popup-id-isletme-resource"] .form-t1-input-area,
#popup [data-old-id="#popup-id-isletme-service"] .form-t1-input-area,
#popup [data-old-id="#popup-id-isletme-class-template"] .form-t1-input-area {
    max-width: none;
    width: 100%;
}

/* Üye Seç (gruba/oturuma üye ekleme) — kısa liste, geniş popup gereksiz. */
#popup [data-old-id="#popup-id-gruplar-add-member-ask"] .popup-content-default-area,
#popup [data-old-id="#popup-id-grup-takvimi-add-member-ask"] .popup-content-default-area {
    min-width: min(90vw, 520px);
    max-width: 520px;
    display: block;
}

/* Genel Takvim occurrence detayı — üye listesi/boş-durum, sonra "+ Üye
   Ekle" butonu ALT ALTA (dikey) sıralanmalı; varsayılan flex-row +
   space-between bunları yan yana diziyordu (2026-08-18, kullanıcı bildirdi). */
#popup [data-old-id="#popup-id-grup-takvimi-occurrence"] .popup-content-default-area {
    min-width: min(90vw, 460px);
    max-width: 460px;
    display: block;
}

/* Kullanıcı Ekle/Düzenle popup'u — bilinçli 2 sütunlu düzen (2026-08-24,
   kullanıcı: "çok karmaşık görünüyor... basit bir müdahale ile çözmeye
   çalışma, tasarımı baştan ayarla"). Önceki deneme, tekil .form-t1/t2-
   input-area alanlarını genel flex-wrap akışına bırakıp kendi genişliklerine
   göre organik olarak dizilmelerine güveniyordu — farklı yükseklikteki
   kutular yüzünden düzensiz/kopuk bir ızgara oluştu. Bunun yerine alanlar
   iki AÇIK, kasıtlı sütuna gruplanıyor (bkz. Index.cshtml: .isletme-user-col
   x2 — sol: kimlik/yetki/renk, sağ: eğitmen ödeme ayarları TEK blok halinde,
   checkbox'ın altında kalıyor çünkü ona bağlı/koşullu görünürlüğe sahip).
   .isletme-user-fullrow: mod seçici ve kaydet/kaldır butonları sütunların
   DIŞINDA, tam genişlikte kalır. */
#popup [data-old-id="#popup-id-isletme-user"] .popup-content-default-area {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 0 32px;
}
#popup [data-old-id="#popup-id-isletme-user"] .isletme-user-fullrow {
    flex: 1 0 100%;
    max-width: 100%;
}
#popup [data-old-id="#popup-id-isletme-user"] .isletme-user-col {
    flex: 1 1 320px;
    min-width: 280px;
    max-width: 460px;
}
/* Sütun içindeki alanlar artık kendi genişliğine karar vermiyor — sütunun
   tamamını kaplıyor, dikey olarak istifleniyor. */
#popup [data-old-id="#popup-id-isletme-user"] .isletme-user-col .form-t1-input-area,
#popup [data-old-id="#popup-id-isletme-user"] .isletme-user-col .form-t2-input-area {
    width: 100%;
    max-width: 100%;
    flex: none;
}
/* "Kullanıcıyı Kaldır"/"Güncelle" bitişik görünüyordu (2026-08-24, kullanıcı
   ekran görüntüsüyle bildirdi) — .popup-content-default-area .page-top-
   right-button .page-top-right-button-btn kuralı margin-right:0 veriyor
   (genel formlarda TEK buton olduğu için sorun etmiyor), burada 2 buton
   olduğu için aralarında boşluk kalmıyordu. */
#popup [data-old-id="#popup-id-isletme-user"] .page-top-right-button .page-top-right-button-btn:not(:last-child) {
    margin-right: 12px;
}

/* ── Grup Takvimi (2026-08-05) — şablon×gün ızgarası + occurrence popup ── */
.gtk-grid-wrap { width: 100%; overflow-x: auto; }
.gtk-grid { width: 100%; border-collapse: collapse; }
.gtk-grid th, .gtk-grid td {
    border: 1px solid #f0f0f0; padding: 10px 8px; text-align: center; font-size: 0.85em;
}
.gtk-grid thead th {
    background: #fafafa; color: #666; font-weight: 700; white-space: nowrap;
}
.gtk-grid thead th.gtk-today { color: #009687; }
.gtk-grid tbody th {
    text-align: center; font-weight: 700; color: #222; white-space: nowrap; min-width: 56px;
    background: #fafafa;
}
.gtk-cell-empty { color: #ddd; }
.gtk-cell-slot {
    cursor: pointer; border-radius: 8px; padding: 6px 8px; display: flex;
    flex-direction: column; gap: 2px; min-width: 90px;
    background: #e6f7f4; border: 1px solid #b9e8e0;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
    transition: background 0.15s, box-shadow 0.15s, transform 0.1s;
}
.gtk-cell-slot + .gtk-cell-slot { margin-top: 4px; }
.gtk-cell-slot:hover {
    background: #d3f0ea; box-shadow: 0 2px 6px rgba(0,150,135,0.18); transform: translateY(-1px);
}
.gtk-cell-name { font-weight: 700; color: #00695c; font-size: 0.9em; }
.gtk-cell-fill { font-size: 0.85em; color: #4a8f85; }
.gtk-cell-slot.gtk-cell-near { background: #fff3e0; border-color: #ffd8a8; }
.gtk-cell-slot.gtk-cell-near:hover { background: #ffe9c6; }
.gtk-cell-slot.gtk-cell-near .gtk-cell-name { color: #9a6400; }
.gtk-cell-slot.gtk-cell-full { background: #fdecea; border-color: #f5c6c0; }
.gtk-cell-slot.gtk-cell-full:hover { background: #fbdcd8; }
.gtk-cell-slot.gtk-cell-full .gtk-cell-name { color: #b71c1c; }
.gtk-cell-slot.gtk-cell-full .gtk-cell-fill { color: #e74c3c; font-weight: 700; }
.gtk-cell-slot.gtk-cell-near .gtk-cell-fill { color: #f39c12; font-weight: 700; }

/* 2026-09-07 (kullanıcı raporu: "tamamlanan ve iptal edilen dersler
   anlaşılmıyor") — dolulukla karışmasın diye doluluk renkleri (near/full)
   ile birlikte hiç uygulanmaz (bkz. renderGrid: statusClass varsa fillClass
   boş bırakılır), bu üç durum kendi başına yeter. */
.gtk-cell-status { font-size: 0.85em; font-weight: 700; }
.gtk-cell-slot.gtk-cell-completed { background: #e3f6e6; border-color: #a8e0b0; }
.gtk-cell-slot.gtk-cell-completed:hover { background: #d2f0d8; }
.gtk-cell-slot.gtk-cell-completed .gtk-cell-name { color: #1f7a37; }
.gtk-cell-slot.gtk-cell-completed .gtk-cell-status { color: #1f7a37; }
.gtk-cell-slot.gtk-cell-cancelled { background: #f2f2f2; border-color: #dcdcdc; opacity: 0.75; }
.gtk-cell-slot.gtk-cell-cancelled:hover { background: #e9e9e9; }
.gtk-cell-slot.gtk-cell-cancelled .gtk-cell-name { color: #8a8a8a; text-decoration: line-through; }
.gtk-cell-slot.gtk-cell-cancelled .gtk-cell-status { color: #b71c1c; }
.gtk-cell-slot.gtk-cell-suspended .gtk-cell-status { color: #9a6400; }
.gtk-empty { padding: 24px 20px; color: #aaa; font-size: 0.9em; text-align: center; }

/* 2026-08-28 — herkese açık program bağlantısı (schedule.html), Genel Takvim
   ızgarasının hemen altında. Kredi düzenleme panelinin (.mpc-credit-edit-panel)
   AYNI kart görünümü, ama bu panele özgü sınıf isimleriyle. */
.gtk-public-link {
    margin-top: 16px;
    padding: 14px;
    background: #f7f8fa;
    border: 1px solid #eee;
    border-radius: 10px;
}
.gtk-public-link-label { font-weight: 700; font-size: 0.92em; color: #333; }
.gtk-public-link-hint { font-size: 0.82em; color: #888; margin-top: 4px; line-height: 1.4; }

.gtk-occ-header {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    margin-bottom: 14px; padding-bottom: 12px; border-bottom: 1px solid #f0f0f0;
}
.gtk-occ-title { font-size: 1.1em; font-weight: 700; color: #222; }
.gtk-occ-capacity { font-size: 0.9em; color: #666; font-weight: 600; white-space: nowrap; }
.gtk-occ-instructor {
    display: flex; align-items: center; gap: 6px;
    font-size: 0.88em; color: #555; margin: -6px 0 12px;
}
.gtk-occ-instructor-dot {
    display: inline-block; width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
}
.gtk-occ-members { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; max-height: 260px; overflow-y: auto; }
.gtk-occ-member-row {
    display: flex; align-items: center; justify-content: space-between;
    padding: 8px 10px; background: #fafafa; border-radius: 8px; font-size: 0.9em;
}
.gtk-occ-member-remove {
    cursor: pointer; color: #dc3545; font-size: 0.85em; border: none; background: none;
}
.gtk-occ-empty { color: #aaa; font-size: 0.85em; padding: 8px 0; }
.gtk-occ-add-row { margin-top: 10px; }

/* ── Otomatik WhatsApp Mesajları (2026-07-08) ────────────────────────── */
/* 2026-09-07 — genel WhatsApp aç/kapa anahtarı (bkz. renderAutomation) */
.abn-wa-master-row {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
    padding: 12px 14px; margin-bottom: 10px;
    background: #f7f4ff; border: 1px solid #e2d9ff; border-radius: 10px;
}
.abn-wa-master-info { flex: 1; min-width: 0; }
.abn-wa-master-title { font-weight: 700; color: #222; }
.abn-wa-master-desc { font-size: 0.82em; color: #777; margin-top: 3px; }

.abn-automation-row {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
    padding: 14px 0; border-bottom: 1px solid #f0f0f0;
}
.abn-automation-row:last-child { border-bottom: none; }
.abn-automation-info { flex: 1; min-width: 0; }
.abn-automation-name { font-weight: 700; color: #222; display: flex; align-items: center; gap: 8px; }
.abn-automation-soon {
    font-size: 0.7em; font-weight: 700; color: #9a6400; background: #fff4e0;
    border-radius: 10px; padding: 2px 8px; white-space: nowrap;
}
.abn-automation-desc { font-size: 0.82em; color: #888; margin-top: 3px; }
.abn-automation-cfg { margin-top: 8px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.abn-automation-cfg label { font-size: 0.82em; color: #555; }
.abn-automation-cfg input {
    width: 70px; padding: 6px 8px; border: 1px solid #e0e0e0; border-radius: 6px; font-size: 0.85em;
}
/* 2026-08-31 (kullanıcı isteği: gidecek mesaj önizlemesi) */
.abn-automation-preview {
    margin-top: 8px; padding: 8px 10px; background: #f4f6f8; border-radius: 8px;
    border-left: 3px solid #1cbb9d;
}
.abn-automation-preview-label { font-size: 0.72em; font-weight: 700; color: #667; text-transform: uppercase; letter-spacing: 0.03em; }
.abn-automation-preview-body { font-size: 0.82em; color: #555; margin-top: 2px; line-height: 1.4; }
/* 2026-09-01 (kullanıcı isteği: WhatsApp şablon metnine geçiş) — 6-11
   numaralı senaryolar Meta onayı beklediği için gösterilen uyarı notu. */
.abn-automation-preview-draft-note { font-size: 0.74em; color: #a06a00; margin-top: 6px; font-style: italic; }
.abn-automation-switch { flex-shrink: 0; margin-top: 2px; }
.abn-automation-switch input[type="checkbox"] {
    width: 20px; height: 20px; accent-color: #009687; cursor: pointer;
}

/* ── İki kanallı anahtar (Motiva + WhatsApp) — 2026-08-19 ────────────── */
.abn-automation-switches { flex-shrink: 0; display: flex; gap: 18px; margin-top: 2px; }
.abn-automation-switch-item { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.abn-automation-switch-item.abn-automation-disabled { opacity: 0.55; }
.abn-automation-switch-label { font-size: 0.7em; font-weight: 600; color: #888; white-space: nowrap; }
.abn-automation-switch-item input[type="checkbox"] {
    width: 20px; height: 20px; accent-color: #009687; cursor: pointer;
}

/* ── Yetkilendirme: Müdür/Personel grup bazlı sayfa erişimi (2026-09-07) ── */
.rp-row {
    display: flex; align-items: center; gap: 16px;
    padding: 10px 0; border-bottom: 1px solid #f0f0f0;
}
.rp-row:last-child { border-bottom: none; }
.rp-row-head { padding-bottom: 8px; font-size: 0.78em; font-weight: 700; color: #888; text-transform: uppercase; letter-spacing: 0.3px; }
.rp-section-col { flex: 1; min-width: 0; font-weight: 600; color: #222; }
.rp-row-head .rp-section-col { font-weight: 700; color: #888; }
.rp-toggle-col { flex: 0 0 70px; text-align: center; }
.rp-toggle-col input[type="checkbox"] { width: 20px; height: 20px; accent-color: #009687; cursor: pointer; }
.rp-toggle-col input[type="checkbox"]:disabled { cursor: not-allowed; opacity: 0.35; accent-color: #999; }
.rp-hint { font-size: 0.78em; color: #999; font-weight: 400; margin-top: 2px; }

/* ── Test Bildirimi Gönder (Motiva Uygulaması): üye seçici — 2026-08-19 ── */
.abnapp-member-picker { display: flex; align-items: center; gap: 10px; margin-top: 4px; }
.abnapp-member-placeholder { color: #aaa; font-size: 0.9em; }
#abnapp-test-member-name:not(.abnapp-member-placeholder) { font-weight: 600; color: #222; }
.abnapp-member-pick-btn { padding: 6px 14px; font-size: 0.85em; white-space: nowrap; }

/* 2026-08-27: eskiden 600px, sitenin genel 768px mobil ayrım noktasına
   birleştirildi — bkz. .mvd-layout üzerindeki geniş not. */
@media (max-width: 768px) {
    .abn-usage-grid { grid-template-columns: 1fr; padding: 0 12px 16px; }
    .abn-plans-grid { grid-template-columns: 1fr; padding: 0 12px 16px; }
    .abn-plan-card { margin: 0 12px 12px; }
    .abn-broadcast-form { padding: 0 12px 16px; }
}

/* ── Takvim sayfası abonelik uyarı banner'ı ─────────────────────────── */
.tsb-banner {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    padding: 10px 16px; margin: 0 0 10px; font-size: 0.88em; font-weight: 600;
}
.tsb-banner-warning { background: #fff4e0; color: #9a6400; border-bottom: 1px solid #ffe2ad; }
.tsb-banner-locked  { background: #fde8e8; color: #a12a2a; border-bottom: 1px solid #f8c9c9; }
.tsb-banner-link {
    color: inherit; text-decoration: underline; white-space: nowrap; flex-shrink: 0;
}

/* ── Üye Kayıt Bağlantısı QR popup'ı ─────────────────────────────────── */
.uye-reglink-qr-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 20px;
    text-align: center;
}
.uye-reglink-qr-box {
    display: inline-flex;
    padding: 12px;
    background: #fff;
    border: 1px solid #ebebeb;
    border-radius: 8px;
}
.uye-reglink-qr-url {
    font-size: 12px;
    color: #73879C;
    word-break: break-all;
}
/* 2026-08-31 (kullanıcı isteği: "linkin yanına kopyalama butonu lazım") */
.uye-reglink-qr-url-row {
    display: flex;
    align-items: center;
    gap: 8px;
    max-width: 100%;
}
.uye-reglink-qr-copy-btn {
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    border: 1px solid #ebebeb;
    border-radius: 6px;
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    color: #73879C;
    transition: background 0.15s, color 0.15s;
}
.uye-reglink-qr-copy-btn:hover {
    background: #f4f6f8;
    color: #347cff;
}
.uye-reglink-qr-hint {
    font-size: 12.5px;
    color: #8a8a8a;
}