/* ============================================================
   SMSVAR — Panel Modern Overrides
   Layout değişmez; görsel polish: shadow, hover, renk, border-radius
   ============================================================ */

/* ── Arka plan ── */
#kt_wrapper { background: #f5f7fa !important; }


/* ══════════════════════════════════════
   HEADER  (Mavi orijinal renk korunuyor)
══════════════════════════════════════ */
/* Header arka planına dokunmuyoruz — orijinal #2563eb mavi kalıyor */
#kt_header {
    box-shadow: 0 2px 16px rgba(0,0,0,0.18) !important;
}

/* Header ikonları — dil seçiciyle aynı görsel dilde: border + şeffaf bg */
#kt_header .btn-icon.btn-custom {
    border: 1px solid rgba(255,255,255,0.22) !important;
    background: rgba(255,255,255,0.1) !important;
    border-radius: 9px !important;
    transition: background 0.15s, border-color 0.15s !important;
}
#kt_header .btn-icon.btn-custom:hover {
    background: rgba(255,255,255,0.18) !important;
    border-color: rgba(255,255,255,0.38) !important;
}

/* Bakiye Butonu — mavi header'da koyu yeşil daha iyi durur */
#kt_header a.btn-success {
    background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
    border: none !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.25) !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    padding: 0.45rem 0.9rem !important;
    line-height: 1.5 !important;
    transition: transform 0.15s, box-shadow 0.15s !important;
}
#kt_header a.btn-success:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 5px 16px rgba(0,0,0,0.3) !important;
}

/* Admin Butonu — mor accent mavi üstünde kontrast yaratıyor */
#kt_header a.btn-info {
    background: linear-gradient(135deg, #7c3aed 0%, #5b21b6 100%) !important;
    border: none !important;
    border-radius: 10px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,0.25) !important;
    font-weight: 600 !important;
    transition: transform 0.15s, box-shadow 0.15s !important;
}
#kt_header a.btn-info:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 5px 16px rgba(0,0,0,0.3) !important;
}

/* Mobile header — logo beyaz zeminde görünmeli */
.header-mobile {
    background: #ffffff !important;
    border-bottom: 1px solid #eef0f5 !important;
    box-shadow: 0 1px 8px rgba(0,0,0,0.06) !important;
}


/* ══════════════════════════════════════
   SIDEBAR
══════════════════════════════════════ */
.aside {
    background: #ffffff !important;
    border-right: 1px solid #f1f3f8 !important;
    box-shadow: 1px 0 12px rgba(0,0,0,0.04) !important;
}

/* Menü öğesi hover — çok hafif arka plan, ikon rengi değişiyor */
#kt_aside_menu .menu-item .menu-link:hover {
    background: rgba(37,99,235,0.06) !important;
    border-radius: 8px !important;
}
#kt_aside_menu .menu-item .menu-link:hover .menu-title {
    color: #2563eb !important;
}

/* Aktif menü öğesi */
#kt_aside_menu .menu-item.hover > .menu-link,
#kt_aside_menu .menu-item.show > .menu-link,
#kt_aside_menu .menu-link.active {
    background: rgba(37,99,235,0.08) !important;
    border-radius: 8px !important;
}
#kt_aside_menu .menu-item.show > .menu-link .menu-title,
#kt_aside_menu .menu-link.active .menu-title {
    color: #2563eb !important;
}

/* Menü alt yazı — boyutu temaya bırakıyoruz */
.aside .menu-title {
    font-weight: 600 !important;
    color: #64748b !important;
}

/* Logo alanı — çizgi yok */
.aside-logo,
#kt_aside_logo {
    background: #ffffff !important;
}


/* ══════════════════════════════════════
   SERVİS KARTLARI (buy.php)
══════════════════════════════════════ */
.card.servisler {
    border: 1.5px solid #e8ecf3 !important;
    border-radius: 13px !important;
    box-shadow: 0 1px 4px rgba(15,23,42,0.05) !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
    background: #ffffff !important;
    cursor: pointer;
}

.card.servisler:hover {
    border-color: #bfdbfe !important;
    box-shadow: 0 6px 22px rgba(37,99,235,0.11), 0 1px 4px rgba(37,99,235,0.06) !important;
    transform: translateY(-2px) !important;
}

.card.servisler:active {
    transform: translateY(0px) !important;
    box-shadow: 0 2px 8px rgba(37,99,235,0.09) !important;
}

/* Kart başlığı */
.card.servisler .card-header {
    padding: 0.95rem 1.1rem !important;
    min-height: unset !important;
    background: transparent !important;
    border-bottom: none !important;
    position: relative;
}

/* Sağ ok (chevron) — pseudo ile eklendi */
.card.servisler .card-header::after {
    content: '';
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 6l6 6-6 6' stroke='%23c7d0dc' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transition: transform 0.18s ease, background-image 0.18s ease;
}

.card.servisler:hover .card-header::after {
    transform: translateY(-50%) translateX(2px);
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 6l6 6-6 6' stroke='%232563eb' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* İkon arka planı */
.card.servisler .symbol,
.card.servisler .symbol.bg-light {
    background: #f1f5f9 !important;
    border-radius: 10px !important;
    transition: background 0.18s ease;
}

.card.servisler:hover .symbol,
.card.servisler:hover .symbol.bg-light {
    background: #dbeafe !important;
}

/* Servis adı metni */
.card.servisler .card-title p {
    font-size: 0.88rem !important;
    font-weight: 600 !important;
    color: #374151 !important;
    padding-right: 1.4rem; /* ok için alan */
    margin: 0 !important;
    line-height: 1.4 !important;
    transition: color 0.15s;
}

.card.servisler:hover .card-title p {
    color: #1d4ed8 !important;
}


/* ══════════════════════════════════════
   ARAMA KUTUSU
══════════════════════════════════════ */
.row.m-1.mb-3 { position: relative; }

.row.m-1.mb-3::before {
    content: '';
    position: absolute;
    left: 1.4rem;
    top: 50%;
    transform: translateY(-50%);
    width: 17px;
    height: 17px;
    pointer-events: none;
    z-index: 5;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='11' cy='11' r='8' stroke='%2394a3b8' stroke-width='2'/%3E%3Cpath d='M21 21l-4.35-4.35' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

#search {
    border-radius: 12px !important;
    border: 1.5px solid #e2e8f0 !important;
    padding: 0.75rem 1rem 0.75rem 2.8rem !important;
    font-size: 0.93rem !important;
    background: #ffffff !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.04) !important;
    transition: border-color 0.2s, box-shadow 0.2s !important;
    color: #1e293b !important;
}

#search::placeholder { color: #94a3b8 !important; }

#search:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59,130,246,0.12), 0 1px 4px rgba(0,0,0,0.04) !important;
    outline: none !important;
}


/* ══════════════════════════════════════
   SAĞ PANEL KARTI (buy.php — "Jet Hızında" kutusu)
══════════════════════════════════════ */
.col-xl-3 > .card,
.col-xl-3 > .card.card-flush {
    border: none !important;
    border-radius: 16px !important;
    box-shadow: 0 2px 18px rgba(0,0,0,0.07) !important;
}


/* ══════════════════════════════════════
   GENEL KART (diğer sayfalar)
══════════════════════════════════════ */
.card:not(.servisler) {
    border-radius: 13px !important;
}

/* Kartlarda genel hafif shadow (existing override'lara ekleme) */
.card-flush { box-shadow: 0 1px 4px rgba(15,23,42,0.05) !important; }


/* ══════════════════════════════════════
   MİNİMAL FORM/INPUT İYİLEŞTİRMESİ
══════════════════════════════════════ */
.form-control:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59,130,246,0.10) !important;
}

.form-select:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59,130,246,0.10) !important;
}


/* ══════════════════════════════════════
   BADGE (tablo durum rozeti)
══════════════════════════════════════ */
.badge {
    font-weight: 600 !important;
    letter-spacing: 0.01em !important;
    border-radius: 6px !important;
}

/* Light badge renkleri — ticket durumları, sipariş durumları */
.badge.badge-light-success { background: #f0fdf4 !important; color: #166534 !important; }
.badge.badge-light-warning { background: #fffbeb !important; color: #92400e !important; }
.badge.badge-light-danger  { background: #fef2f2 !important; color: #991b1b !important; }
.badge.badge-light-primary { background: #eff6ff !important; color: #1e40af !important; }
.badge.badge-light-info    { background: #f0f9ff !important; color: #0c4a6e !important; }
.badge.badge-light-dark    { background: #f1f5f9 !important; color: #374151 !important; }
.badge.badge-success:not(.badge-light-success) { background: linear-gradient(135deg, #059669 0%, #047857 100%) !important; color: #fff !important; }
.badge.badge-warning:not(.badge-light-warning) { background: linear-gradient(135deg, #d97706 0%, #b45309 100%) !important; color: #fff !important; }
.badge.badge-danger:not(.badge-light-danger)   { background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%) !important; color: #fff !important; }
.badge.badge-primary:not(.badge-light-primary) { background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important; color: #fff !important; }
.badge.badge-info:not(.badge-light-info)       { background: linear-gradient(135deg, #0284c7 0%, #0369a1 100%) !important; color: #fff !important; }

/* Numbers — DataTable expand/collapse ikonu mavi */
#numbersTable tbody td.dtr-control:before { background-color: #2563eb !important; }
#numbersTable tbody tr.dt-hasChild td.dtr-control:before { background-color: #dc2626 !important; }
#numbersTable tbody tr.child td { background: #f8fafc !important; }
#numbersTable tbody tr.child ul.dtr-details li { border-bottom: 1px solid #f1f5f9 !important; }
#numbersTable tbody tr.child ul.dtr-details .dtr-title { color: #6b7280 !important; font-weight: 600 !important; font-size: 0.8rem !important; text-transform: uppercase !important; letter-spacing: 0.04em !important; }


/* ══════════════════════════════════════
   ANİMASYON SINIFLARIMIZI KORUYORUZ
   (buy modal başlığı, balance sekmeleri vb.)
══════════════════════════════════════ */
.modal-content {
    border: none !important;
    box-shadow: 0 20px 60px rgba(0,0,0,0.15) !important;
}

.modal-header { border-bottom: none !important; }
.modal-footer { border-top: 1px solid #f1f3f8 !important; }


/* ══════════════════════════════════════
   BUTONLAR — Genel
══════════════════════════════════════ */
.btn {
    border-radius: 9px !important;
    font-weight: 600 !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}
.btn-primary:not(.btn-light-primary):not(.btn-active-light-primary):not(.btn-outline) {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(37,99,235,0.25) !important;
}
.btn-primary:not(.btn-light-primary):not(.btn-active-light-primary):not(.btn-outline):hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 5px 16px rgba(37,99,235,0.35) !important;
}
.btn-success:not(.btn-light-success):not(.btn-active-light-success) {
    background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(5,150,105,0.22) !important;
}
.btn-success:not(.btn-light-success):not(.btn-active-light-success):hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 5px 14px rgba(5,150,105,0.32) !important;
}
.btn-warning:not(.btn-light-warning) {
    box-shadow: 0 2px 8px rgba(245,158,11,0.2) !important;
}
.btn-warning:not(.btn-light-warning):hover {
    transform: translateY(-1px) !important;
}
.btn-light, .btn-light-primary, .btn-active-light-primary {
    border: 1.5px solid #e5e7eb !important;
}


/* ══════════════════════════════════════
   FORM ALANLARI — Tüm sayfalar
══════════════════════════════════════ */
.form-control,
.form-control-lg,
.form-control-sm {
    border-radius: 9px !important;
    border: 1.5px solid #e5e7eb !important;
    transition: border-color 0.18s, box-shadow 0.18s !important;
}
.form-control-lg { padding: 0.7rem 1rem !important; font-size: 0.95rem !important; }

.form-control:focus,
.form-control-lg:focus {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59,130,246,0.1) !important;
    outline: none !important;
}
/* Disabled / salt okunur alanlar */
.form-control-solid,
.form-control:disabled,
.form-control[readonly] {
    background: #f8fafc !important;
    border-color: #f1f3f8 !important;
    color: #6b7280 !important;
}
.form-select {
    border-radius: 9px !important;
    border: 1.5px solid #e5e7eb !important;
}
/* Input group */
.input-group .input-group-text {
    border-radius: 9px 0 0 9px !important;
    border: 1.5px solid #e5e7eb !important;
    border-right: none !important;
    background: #f8fafc !important;
    color: #6b7280 !important;
}
.input-group .form-control {
    border-left: none !important;
    border-radius: 0 9px 9px 0 !important;
}
.input-group .form-control:focus { z-index: 1; }
/* Form labels */
.col-form-label.fw-bold, label.fw-bold {
    color: #374151 !important;
    font-size: 0.88rem !important;
    font-weight: 600 !important;
}


/* ══════════════════════════════════════
   TABLO & DATATABLE — Tüm sayfalar
══════════════════════════════════════ */
.table thead th {
    font-size: 0.8rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    color: #9ca3af !important;
    border-bottom: 1.5px solid #f1f5f9 !important;
    padding: 0.8rem 0.9rem !important;
    white-space: nowrap;
    background: #fafbfc !important;
}
.table tbody td {
    padding: 0.78rem 0.9rem !important;
    vertical-align: middle !important;
    color: #374151 !important;
    border-bottom: 1px solid #f5f7fb !important;
    font-size: 0.875rem !important;
}
.table tbody tr:hover td {
    background: #f8faff !important;
}
.table-striped > tbody > tr:nth-of-type(odd) > td {
    background: #fafbfc !important;
}
.table-striped > tbody > tr:nth-of-type(odd):hover > td {
    background: #f8faff !important;
}
/* DataTable pagination */
.dataTables_wrapper .dataTables_paginate .paginate_button {
    border-radius: 7px !important;
    padding: 0.3rem 0.65rem !important;
    font-size: 0.82rem !important;
    font-weight: 600 !important;
    margin: 0 2px !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: #2563eb !important;
    border-color: #2563eb !important;
    color: #fff !important;
    box-shadow: 0 2px 8px rgba(37,99,235,0.3) !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover:not(.current) {
    background: #f1f5f9 !important;
    border-color: #e2e8f0 !important;
    color: #374151 !important;
}
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_length label,
.dataTables_wrapper .dataTables_filter label {
    font-size: 0.82rem !important;
    color: #9ca3af !important;
}


/* ══════════════════════════════════════
   ALERTS — Tüm sayfalar
══════════════════════════════════════ */
.alert {
    border-radius: 10px !important;
    border: none !important;
    font-size: 0.875rem !important;
}
.alert-info    { background: #eff6ff !important; color: #1e40af !important; border-left: 3px solid #3b82f6 !important; }
.alert-success { background: #f0fdf4 !important; color: #166534 !important; border-left: 3px solid #22c55e !important; }
.alert-warning { background: #fffbeb !important; color: #92400e !important; border-left: 3px solid #f59e0b !important; }
.alert-danger  { background: #fef2f2 !important; color: #991b1b !important; border-left: 3px solid #ef4444 !important; }
.alert-primary { background: #eff6ff !important; color: #1e40af !important; border-left: 3px solid #2563eb !important; }


/* ══════════════════════════════════════
   PROGRESS BARS — bonuses.php
   inline style="height:6px" → !important override gerekli
══════════════════════════════════════ */
.progress {
    border-radius: 20px !important;
    background: #f1f5f9 !important;
    /* inline height override */
    min-height: 8px !important;
    overflow: hidden !important;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.06) !important;
}
.progress-bar {
    border-radius: 20px !important;
    background: linear-gradient(90deg, #2563eb 0%, #3b82f6 100%) !important;
    box-shadow: 0 2px 6px rgba(37,99,235,0.35) !important;
    transition: width 0.8s cubic-bezier(0.4,0,0.2,1) !important;
    min-height: 8px !important;
}
.progress-bar.bg-warning { background: linear-gradient(90deg, #d97706 0%, #f59e0b 100%) !important; box-shadow: 0 2px 6px rgba(245,158,11,0.35) !important; }
.progress-bar.bg-info    { background: linear-gradient(90deg, #0284c7 0%, #38bdf8 100%) !important; box-shadow: 0 2px 6px rgba(2,132,199,0.35) !important; }
.progress-bar.bg-primary { background: linear-gradient(90deg, #6d28d9 0%, #8b5cf6 100%) !important; box-shadow: 0 2px 6px rgba(109,40,217,0.35) !important; }


/* ══════════════════════════════════════
   PROFİL SAYFASI — profile.php
══════════════════════════════════════ */
/* Form satır ayracı — her row arasına hafif çizgi */
.card-body .row.mb-6 {
    border-bottom: 1px solid #f5f7fb !important;
    padding-bottom: 1.2rem !important;
}
.card-body .row.mb-6:last-of-type { border-bottom: none !important; }
/* Card footer — profil güncelle butonları */
.card-footer.d-flex {
    background: transparent !important;
    border-top: 1px solid #f1f5f9 !important;
    padding-top: 1rem !important;
    margin-top: 0.5rem !important;
}
/* API key ve açıklama metni */
.ms-2.fs-7.mt-1 { font-size: 0.79rem !important; }
/* Form açıklama rengi */
.fv-plugins-message-container { font-size: 0.78rem !important; }


/* ══════════════════════════════════════
   RANK KARTLARI — bonuses.php
══════════════════════════════════════ */
.col-md-6.col-xl-4 > .card {
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    box-shadow: 0 1px 4px rgba(15,23,42,0.06) !important;
}
.col-md-6.col-xl-4 > .card:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 28px rgba(0,0,0,0.1) !important;
}
.col-md-6.col-xl-4 > .card.border-3 {
    box-shadow: 0 4px 18px rgba(37,99,235,0.12) !important;
}


/* ══════════════════════════════════════
   DASHBOARD KARTLARI — index.php
══════════════════════════════════════ */
/* Bakiye büyük rakam */
.fs-2hx.fw-bolder {
    letter-spacing: -0.02em !important;
}
/* Mavi engage kartı */
.card[style*="background: #2563eb"],
.card[style*="background:#2563eb"] {
    border-radius: 16px !important;
    border: none !important;
    box-shadow: 0 8px 32px rgba(37,99,235,0.28) !important;
}
/* Dashboard destek tablosu kartı */
.card.card-flush {
    border: 1px solid #f1f5f9 !important;
    box-shadow: 0 1px 6px rgba(15,23,42,0.05) !important;
}
.card-header {
    border-bottom: 1px solid #f5f7fb !important;
}
.card-label.fw-bolder { color: #111827 !important; font-size: 1.05rem !important; }


/* ══════════════════════════════════════
   ACCORDION — support modal
══════════════════════════════════════ */
.accordion-item {
    border: 1px solid #f1f5f9 !important;
    border-radius: 9px !important;
    margin-bottom: 0.5rem !important;
    overflow: hidden;
}
.accordion-button {
    border-radius: 9px !important;
    font-size: 0.88rem !important;
    font-weight: 600 !important;
    color: #374151 !important;
    background: #fafbfc !important;
    padding: 0.85rem 1rem !important;
}
.accordion-button:not(.collapsed) {
    background: #eff6ff !important;
    color: #1d4ed8 !important;
    box-shadow: none !important;
}
.accordion-button::after {
    filter: none !important;
}
.accordion-body {
    font-size: 0.875rem !important;
    color: #4b5563 !important;
    padding: 0.75rem 1rem 1rem !important;
}


/* ══════════════════════════════════════
   FOOTER — panel footer
══════════════════════════════════════ */
#kt_footer {
    background: #ffffff !important;
    border-top: 1px solid #f1f5f9 !important;
    font-size: 0.82rem !important;
}
#kt_footer .text-gray-400 { color: #9ca3af !important; }
#kt_footer .menu-link { color: #6b7280 !important; font-weight: 500 !important; }
#kt_footer .menu-link:hover { color: #2563eb !important; }


/* ══════════════════════════════════════
   SCROLLTOP BUTONU
══════════════════════════════════════ */
.scrolltop {
    background: #2563eb !important;
    box-shadow: 0 4px 16px rgba(37,99,235,0.35) !important;
    border-radius: 10px !important;
    width: 38px !important;
    height: 38px !important;
}
.scrolltop:hover {
    background: #1d4ed8 !important;
    box-shadow: 0 6px 20px rgba(37,99,235,0.45) !important;
}


/* ══════════════════════════════════════
   SAYFA BAŞLIĞI — tüm sayfalar
══════════════════════════════════════ */
.fs-2x.text-dark, h1.fs-2x {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em !important;
    color: #111827 !important;
}
.fs-2x.fw-bolder { font-size: 1.7rem !important; letter-spacing: -0.015em !important; }


/* ══════════════════════════════════════
   DESTEK TALEBİ — support_ticket.php
══════════════════════════════════════ */
/* Kart sınırı */
.card.card-bordered {
    border: 1.5px solid #f1f5f9 !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 4px rgba(15,23,42,0.05) !important;
    transition: box-shadow 0.2s !important;
}
.card.card-bordered:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.07) !important;
}
/* Symbol avatar arka plan */
.symbol .symbol-label { border-radius: 10px !important; }
.bg-light-success { background: #f0fdf4 !important; }
.bg-light-primary { background: #eff6ff !important; }
.text-success { color: #166534 !important; }
/* text-primary: marka rengi */
.text-primary { color: #2563eb !important; }


/* ══════════════════════════════════════
   MOBİL UYUMLULUK
══════════════════════════════════════ */
@media (max-width: 991px) {
    .card.servisler .card-header { padding: 0.85rem 0.9rem !important; }
    .card.servisler .card-title p { font-size: 0.82rem !important; }
    .table thead th { font-size: 0.76rem !important; padding: 0.65rem 0.6rem !important; }
    .table tbody td { padding: 0.65rem 0.6rem !important; font-size: 0.875rem !important; }
    #kt_footer { display: none !important; }          /* mobilde footer gizle */
    .scrolltop { bottom: calc(62px + 0.85rem) !important; right: 0.75rem !important; }
}

@media (max-width: 575px) {
    .btn { font-size: 0.85rem !important; }
    .fs-2x.text-dark, h1.fs-2x { font-size: 1.3rem !important; }
}


/* ══════════════════════════════════════════════════════════
   MOBİL DASHBOARD  (index.php — .d-lg-none bloku)
   ══════════════════════════════════════════════════════════ */

/* İçerik alt boşluğu: bottom-nav için padding */
@media (max-width: 991px) {
    #kt_content { padding-bottom: 76px !important; }
}

/* ─── HERO ─────────────────────────────────────────── */
.mobile-hero {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 60%, #1e40af 100%);
    border-radius: 20px;
    padding: 1.1rem 1.1rem;
    margin: 0 0 1rem;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 155px;
}
.mobile-hero__top {
    padding-right: 7rem; /* ikonlar için alan bırak */
}
.mobile-hero__top-icons {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 0.4rem;
    z-index: 2;
}
.mobile-hero__icon-pair {
    display: flex;
    gap: 0.4rem;
}
.mobile-hero__title {
    font-size: 1rem;
    font-weight: 700;
    color: #fff;
    margin: 0 0 0.2rem;
    letter-spacing: -0.01em;
    line-height: 1.35;
}
.mobile-hero__sub {
    font-size: 0.78rem;
    color: rgba(255,255,255,0.70);
    margin: 0;
}
.mobile-hero__actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.mobile-hero__icon-btn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(255,255,255,0.15);
    color: #fff;
    border: 1px solid rgba(255,255,255,0.2);
    text-decoration: none !important;
    transition: background 0.15s;
}
.mobile-hero__icon-btn:hover { background: rgba(255,255,255,0.25); color: #fff; }
.mobile-hero__dot {
    position: absolute;
    top: 5px; right: 5px;
    width: 7px; height: 7px;
    border-radius: 50%;
    background: #fb923c;
    border: 1.5px solid #2563eb;
}
.mobile-hero__balance-btn {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    padding: 0.4rem 0.75rem;
    background: #16a34a;
    border-radius: 10px;
    color: #fff !important;
    text-decoration: none !important;
    transition: background 0.15s;
    border: none;
    line-height: 1.3;
}
.mobile-hero__balance-btn:hover { background: #15803d; }
.hero-balance {
    font-size: 0.95rem;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
}
.hero-bonus {
    font-size: 0.76rem;
    color: rgba(255,255,255,0.85);
    white-space: nowrap;
}
.mobile-hero__admin-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;
    padding: 0.4rem 0.75rem;
    background: #7c3aed;
    border-radius: 10px;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 0.8rem;
    font-weight: 600;
    transition: background 0.15s;
    flex: 0 0 100%;   /* tek başına ikinci satıra geçer */
}
.mobile-hero__admin-btn:hover { background: #6d28d9; }

/* ─── Sayfa ikonu (sağ alt köşe dekoratif SVG) ──────────── */
.mobile-hero__page-icon {
    position: absolute;
    bottom: 0.65rem;
    right: 0.8rem;
    width: 5rem;
    height: 5rem;
    pointer-events: none;
    user-select: none;
    overflow: visible;
}

/* ─── KART SARMALAYI ────────────────────────────────── */
.mobile-cards-wrap {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* ─── STAT KARTLARI ─────────────────────────────────── */
.mobile-stat-card {
    background: #fff;
    border-radius: 16px;
    padding: 1.1rem 1.1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0 1px 6px rgba(15,23,42,0.06);
    border: 1px solid #f1f5f9;
}
.mobile-stat-card__left { flex: 1; min-width: 0; }
.mobile-stat-card__amount {
    font-size: 1.45rem;
    font-weight: 800;
    color: #111827;
    letter-spacing: -0.02em;
    display: block;
    line-height: 1.2;
}
.mobile-stat-card__amount--bonus { color: #7c3aed; }
.mobile-stat-card__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.55rem;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 600;
    text-decoration: none !important;
    margin-top: 0.3rem;
}
.mobile-stat-card__badge--green {
    background: #dcfce7;
    color: #166534;
}
.mobile-stat-card__badge--green:hover { background: #bbf7d0; color: #166534; }
.mobile-stat-card__badge--orange {
    background: #ede9fe;
    color: #5b21b6;
}
.mobile-stat-card__sub {
    font-size: 0.78rem;
    color: #6b7280;
    line-height: 1.4;
}
.mobile-stat-card__icon {
    width: 44px; height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-left: 0.75rem;
}
.mobile-stat-card__icon--green {
    background: #dcfce7;
    color: #16a34a;
}
.mobile-stat-card__icon--orange {
    background: #2563eb;
    color: #fff;
}

/* ─── ENGAGE CARD ────────────────────────────────────── */
.mobile-engage-card {
    background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 100%);
    border-radius: 16px;
    overflow: hidden;
    display: flex;
    align-items: stretch;
    min-height: 140px;
    box-shadow: 0 4px 16px rgba(37,99,235,0.22);
}
.mobile-engage-card__content {
    flex: 1;
    padding: 1.1rem 0 1.1rem 1.15rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.mobile-engage-card__sup {
    font-size: 0.7rem;
    font-weight: 600;
    color: rgba(255,255,255,0.65);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin: 0 0 0.2rem;
}
.mobile-engage-card__title {
    font-size: 1.05rem;
    font-weight: 800;
    color: #fff;
    margin: 0 0 0.45rem;
    letter-spacing: -0.01em;
    line-height: 1.25;
}
.mobile-engage-card__checks {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    margin-bottom: 0.75rem;
}
.mobile-engage-card__check {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    color: rgba(255,255,255,0.82);
}
.mobile-engage-card__check::before {
    content: '';
    display: inline-block;
    width: 14px; height: 14px;
    border-radius: 50%;
    background: rgba(255,255,255,0.18);
    flex-shrink: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6L5 9L10 3' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
    background-size: 10px;
    background-repeat: no-repeat;
    background-position: center;
}
.mobile-engage-card__btn {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.85rem;
    background: #fff;
    color: #1d4ed8 !important;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 700;
    text-decoration: none !important;
    transition: background 0.15s;
    align-self: flex-start;
}
.mobile-engage-card__btn:hover { background: #eff6ff; }
.mobile-engage-card__img {
    width: 105px;
    flex-shrink: 0;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    overflow: hidden;
    padding: 0.4rem 0.4rem 0 0;
    opacity: 0.90;
}

/* ─── SON İŞLEMLER ───────────────────────────────────── */
.mobile-transactions-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 1px 6px rgba(15,23,42,0.06);
    border: 1px solid #f1f5f9;
}
.mobile-transactions-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.1rem 0.75rem;
    border-bottom: 1px solid #f8fafc;
}
.mobile-transactions-card__title {
    font-size: 0.9rem;
    font-weight: 700;
    color: #111827;
}
.mobile-transactions-card__sub {
    font-size: 0.74rem;
    color: #9ca3af;
    margin-top: 0.1rem;
}
.mobile-transactions-card__all {
    font-size: 0.78rem;
    font-weight: 600;
    color: #2563eb;
    text-decoration: none !important;
    white-space: nowrap;
    padding: 0.2rem 0.6rem;
    background: #eff6ff;
    border-radius: 6px;
}
.mobile-transactions-card__all:hover { background: #dbeafe; }

/* İşlem satırı */
.mobile-tx-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.1rem;
    border-bottom: 1px solid #f8fafc;
    transition: background 0.12s;
}
.mobile-tx-item:last-child { border-bottom: none; }
.mobile-tx-item:hover { background: #fafafa; }
.mobile-tx-icon {
    width: 38px; height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.mobile-tx-icon--load   { background: #dbeafe; color: #2563eb; }
.mobile-tx-icon--bonus  { background: #2563eb; color: #fff; }
.mobile-tx-icon--coupon { background: #f3e8ff; color: #7c3aed; }
.mobile-tx-icon--other  { background: #f1f5f9; color: #475569; }
.mobile-tx-info { flex: 1; min-width: 0; }
.mobile-tx-name {
    font-size: 0.85rem;
    font-weight: 600;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mobile-tx-sub {
    font-size: 0.74rem;
    color: #9ca3af;
    margin-top: 0.1rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mobile-tx-amount {
    font-size: 0.875rem;
    font-weight: 700;
    white-space: nowrap;
    flex-shrink: 0;
}
.mobile-tx-amount--plus  { color: #16a34a; }
.mobile-tx-amount--minus { color: #dc2626; }

/* ─── BAKİYE YÜKLE SAYFASI MOBİL ───────────────────────── */
@media (max-width: 991px) {

    /* Tab listesi: 3 eşit sütun */
    #myTab {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 0.5rem !important;
        flex-wrap: nowrap !important;
        margin-bottom: 0 !important;
        padding: 0 0.25rem !important;
    }
    #myTab .nav-item {
        margin: 0 !important;
        flex: none !important;
        min-width: 0 !important;
        max-width: none !important;
    }
    /* Ödeme sekmeleri: ikon üstte, yazı altta */
    #myTab .balance-tab {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        padding: 0.75rem 0.4rem !important;
        border: 2px solid #e2e8f0 !important;
        border-radius: 14px !important;
        background: #fff !important;
        color: #64748b !important;
        font-size: 0.72rem !important;
        font-weight: 600 !important;
        gap: 0.35rem !important;
        min-height: 72px !important;
        transition: border-color 0.15s, color 0.15s !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
    #myTab .balance-tab .svg-icon,
    #myTab .balance-tab .fab {
        display: block !important;
        margin: 0 auto !important;
    }
    #myTab .balance-tab .d-flex.flex-column {
        display: contents !important;
    }
    #myTab .balance-tab .fs-4 {
        font-size: 0.72rem !important;
        font-weight: 600 !important;
        text-align: center !important;
        white-space: normal !important;
        line-height: 1.2 !important;
    }
    #myTab .balance-tab.active {
        border-color: #2563eb !important;
        color: #2563eb !important;
        background: #eff6ff !important;
    }
    #myTab .balance-tab.active .svg-icon svg path,
    #myTab .balance-tab.active .svg-icon svg rect {
        fill: #2563eb !important;
    }

    /* Form alanları */
    .pay-input-group,
    #kt_content_container .input-group.mb-4 {
        border-radius: 12px !important;
        overflow: hidden !important;
        border: 1.5px solid #e2e8f0 !important;
        box-shadow: none !important;
    }
    .pay-input-group .form-control,
    .pay-input-group .input-group-text {
        border: none !important;
        border-radius: 0 !important;
    }
    .pay-input-group:focus-within {
        border-color: #2563eb !important;
        box-shadow: 0 0 0 3px rgba(37,99,235,0.1) !important;
    }

    /* Hızlı seçim ızgarası */
    .quick-amounts {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 0.5rem !important;
    }
    .quick-amounts .btn {
        border-radius: 12px !important;
        font-weight: 600 !important;
        font-size: 0.9rem !important;
        padding: 0.75rem 0.25rem !important;
        border: 1.5px solid #e2e8f0 !important;
        background: #fff !important;
        color: #374151 !important;
        position: relative !important;
    }
    .quick-amounts .btn:active,
    .quick-amounts .btn.selected {
        border-color: #2563eb !important;
        background: #eff6ff !important;
        color: #2563eb !important;
    }
    /* Popüler badge */
    .popular-badge {
        position: absolute !important;
        top: -8px !important; right: -4px !important;
        background: #2563eb !important;
        color: #fff !important;
        font-size: 0.6rem !important;
        font-weight: 700 !important;
        padding: 2px 6px !important;
        border-radius: 20px !important;
        white-space: nowrap !important;
    }

    /* Ödeme butonu */
    #kt_content_container .btn.btn-primary.btn-lg.w-100 {
        border-radius: 14px !important;
        font-size: 1rem !important;
        font-weight: 700 !important;
        padding: 0.95rem !important;
        background: linear-gradient(135deg,#2563eb 0%,#1d4ed8 100%) !important;
        border: none !important;
        margin-top: 0.5rem !important;
    }

    /* SSL notu */
    #kt_content_container .tab-pane .fs-7.text-gray-500,
    #kt_content_container .tab-pane .text-center.mt-3 {
        text-align: center !important;
        font-size: 0.75rem !important;
        color: #9ca3af !important;
        margin-top: 0.75rem !important;
    }

    /* Tab content padding */
    #myTabContent {
        padding: 0 0.25rem !important;
    }
    .tab-pane {
        padding-top: 1rem !important;
    }

    /* Rank strip mobil */
    .rank-strip {
        margin: 0 0.25rem 1rem !important;
    }
}

/* ─── NUMARA AL SAYFASI MOBİL ───────────────────────────── */

/* Hero illüstrasyonu (telefon SVG) */
.mobile-hero__illustration {
    flex-shrink: 0;
    margin-left: 0.5rem;
    opacity: 0.9;
    align-self: center;
}
.mobile-hero--buy .mobile-hero__top {
    align-items: flex-start;
}

/* Arama çubuğu */
.buy-search-wrap {
    padding: 0 0 0.75rem;
}
.buy-search-inner {
    display: flex;
    align-items: center;
    background: #fff;
    border: 1.5px solid #e2e8f0;
    border-radius: 12px;
    padding: 0 0.9rem;
    height: 46px;
    gap: 0.6rem;
    box-shadow: 0 1px 4px rgba(15,23,42,0.05);
    transition: border-color 0.15s;
}
.buy-search-inner:focus-within {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37,99,235,0.1);
}
.buy-search-icon { flex-shrink: 0; }
.buy-search-input {
    flex: 1;
    border: none;
    outline: none;
    font-size: 0.875rem;
    color: #374151;
    background: transparent;
}
.buy-search-input::placeholder { color: #94a3b8; }
.buy-search-filter {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    opacity: 0.6;
    transition: opacity 0.15s;
}
.buy-search-filter:hover { opacity: 1; }

/* Kategori sekmeleri */
.buy-tabs-wrap {
    margin-bottom: 0.5rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.buy-tabs-wrap::-webkit-scrollbar { display: none; }
.buy-tabs {
    display: flex;
    gap: 0.5rem;
    padding-bottom: 0.25rem;
    width: max-content;
}
.buy-tab {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.45rem 0.9rem;
    border-radius: 20px;
    border: 1.5px solid #e2e8f0;
    background: #fff;
    color: #64748b;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.15s;
}
.buy-tab:hover { border-color: #2563eb; color: #2563eb; }
.buy-tab.active {
    background: #2563eb;
    border-color: #2563eb;
    color: #fff;
}

/* Servis listesi */
.buy-service-list {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 1px 6px rgba(15,23,42,0.06);
    border: 1px solid #f1f5f9;
}
.buy-service-item {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid #f8fafc;
    cursor: pointer;
    transition: background 0.12s;
    text-decoration: none !important;
}
.buy-service-item:last-child { border-bottom: none; }
.buy-service-item:hover { background: #f8fafc; }
.buy-service-item:active { background: #f1f5f9; }
.buy-service-item__icon {
    width: 44px; height: 44px;
    border-radius: 12px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}
.buy-service-item__icon img {
    width: 40px;
    height: 40px;
    object-fit: contain;
    border-radius: 8px;
}
.buy-service-item__info {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.buy-service-item__name {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 180px;
}
.buy-service-item__badge {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    border-radius: 20px;
    background: #eff6ff;
    color: #2563eb;
    font-size: 0.68rem;
    font-weight: 700;
    flex-shrink: 0;
    white-space: nowrap;
}
.buy-service-item__arrow {
    flex-shrink: 0;
    margin-left: auto;
}

/* ─── MOBİL HERO: DROPDOWN RENK KALITIM DÜZELTMESİ ──── */
/* .mobile-hero { color:#fff } tüm çocuklara yayılır;
   dropdown div'leri beyaz arka plana karşı görünmez olur. */
.mobile-hero .menu-sub-dropdown {
    color: #1e293b !important;
}
.mobile-hero .menu-sub-dropdown .fw-bolder,
.mobile-hero .menu-sub-dropdown .fw-bold {
    color: #1e293b !important;
}
.mobile-hero .menu-sub-dropdown .menu-link {
    color: #1e293b !important;
}
.mobile-hero .menu-sub-dropdown .text-gray-800 {
    color: #1e293b !important;
}
.mobile-hero .menu-sub-dropdown .text-gray-400,
.mobile-hero .menu-sub-dropdown .text-muted {
    color: #64748b !important;
}
/* Dropdown başlık bölümündeki beyaz yazıyı koru */
.mobile-hero .menu-sub-dropdown .text-white {
    color: #fff !important;
}

/* ─── MOBİL ALT NAV ──────────────────────────────────── */
.mobile-bottom-nav {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    z-index: 1060;
    background: #fff;
    border-top: 1px solid #f1f5f9;
    box-shadow: 0 -2px 16px rgba(15,23,42,0.07);
    height: 62px;
    padding: 0;
    align-items: stretch;
}
.mobile-bottom-nav__item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    text-decoration: none !important;
    color: #94a3b8;
    font-size: 0.62rem;
    font-weight: 500;
    padding: 0.25rem 0;
    transition: color 0.15s;
    border-top: 2px solid transparent;
}
.mobile-bottom-nav__item svg {
    width: 22px; height: 22px;
    opacity: 0.55;
    transition: opacity 0.15s;
}
.mobile-bottom-nav__item span {
    font-size: 0.58rem;
    font-weight: 600;
    letter-spacing: 0.01em;
}
.mobile-bottom-nav__item.active {
    color: #2563eb;
    border-top-color: #2563eb;
}
.mobile-bottom-nav__item.active svg { opacity: 1; }
.mobile-bottom-nav__item:hover:not(.active) {
    color: #2563eb;
}
.mobile-bottom-nav__item:hover:not(.active) svg { opacity: 0.8; }

/* ─── DESTEK SAYFASI MOBİL ───────────────────────────── */

/* Başlık kartı */
.support-header-card {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    background: #fff;
    border-radius: 16px;
    padding: 1rem 1.1rem;
    margin: 0.75rem 0 0.6rem;
    box-shadow: 0 1px 6px rgba(15,23,42,0.06);
    border: 1px solid #f1f5f9;
}
.support-header-card__icon {
    width: 44px; height: 44px;
    border-radius: 12px;
    background: #eff6ff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.support-header-card__title {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.3;
}
.support-header-card__sub {
    font-size: 0.75rem;
    color: #94a3b8;
    margin-top: 0.1rem;
    line-height: 1.4;
}

/* Bilgi çubuğu */
.support-info-bar {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #eff6ff;
    border: 1px solid #dbeafe;
    border-radius: 10px;
    padding: 0.65rem 0.9rem;
    font-size: 0.8rem;
    color: #1d4ed8;
    font-weight: 500;
    margin-bottom: 0.6rem;
}

/* Destek talebi oluştur butonu */
.support-create-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.85rem 1rem;
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    color: #fff !important;
    border-radius: 14px;
    font-size: 0.92rem;
    font-weight: 700;
    text-decoration: none !important;
    border: none;
    cursor: pointer;
    margin-bottom: 0.85rem;
    box-shadow: 0 4px 14px rgba(37,99,235,0.25);
    transition: box-shadow 0.15s, transform 0.1s;
}
.support-create-btn:active { transform: scale(0.98); }
.support-create-btn--disabled {
    background: #e2e8f0 !important;
    color: #94a3b8 !important;
    box-shadow: none !important;
    cursor: not-allowed;
}

/* Durum sekmeleri */
.support-status-tabs {
    display: flex;
    gap: 0.4rem;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 0.25rem;
    margin-bottom: 0.75rem;
}
.support-status-tabs::-webkit-scrollbar { display: none; }
.support-status-tab {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.4rem 0.85rem;
    border-radius: 20px;
    border: 1.5px solid #e2e8f0;
    background: #fff;
    color: #64748b;
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.15s;
    flex-shrink: 0;
}
.support-status-tab:hover { border-color: #2563eb; color: #2563eb; }
.support-status-tab.active {
    background: #2563eb;
    border-color: #2563eb;
    color: #fff;
}
.support-status-dot {
    width: 7px; height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

/* Boş durum */
.support-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1rem 1.5rem;
    text-align: center;
    background: #fff;
    border-radius: 16px;
    border: 1px solid #f1f5f9;
    box-shadow: 0 1px 6px rgba(15,23,42,0.05);
    margin-bottom: 1rem;
}
.support-empty-illustration { margin-bottom: 1rem; }
.support-empty-title {
    font-size: 1rem;
    font-weight: 700;
    color: #1e293b;
    margin-bottom: 0.4rem;
}
.support-empty-sub {
    font-size: 0.8rem;
    color: #94a3b8;
    max-width: 260px;
    line-height: 1.5;
    margin-bottom: 1rem;
}
.support-empty-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: #2563eb !important;
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none !important;
}
.support-empty-link:hover { text-decoration: underline !important; }

/* Bilet listesi */
.support-ticket-list {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 1px 6px rgba(15,23,42,0.06);
    border: 1px solid #f1f5f9;
    margin-bottom: 1rem;
}
.support-ticket-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1rem;
    border-bottom: 1px solid #f8fafc;
    text-decoration: none !important;
    cursor: pointer;
    transition: background 0.12s;
}
.support-ticket-item:last-child { border-bottom: none; }
.support-ticket-item:hover { background: #f8fafc; }
.support-ticket-item:active { background: #f1f5f9; }
.support-ticket-item__left {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}
.support-ticket-item__id {
    font-size: 0.72rem;
    color: #94a3b8;
    font-weight: 600;
}
.support-ticket-item__name {
    font-size: 0.88rem;
    font-weight: 700;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
}
.support-ticket-item__date {
    font-size: 0.72rem;
    color: #94a3b8;
}
.support-ticket-item__status {
    display: inline-block;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 700;
    white-space: nowrap;
    flex-shrink: 0;
}
.support-ticket-item__status--open   { background: #dcfce7; color: #16a34a; }
.support-ticket-item__status--waiting { background: #fef9c3; color: #b45309; }
.support-ticket-item__status--closed  { background: #f1f5f9; color: #64748b; }

/* ─── PROFİL SAYFASI MOBİL ──────────────────────────── */

/* Hero dekoratif avatar */
.profile-hero-avatar {
    position: absolute;
    top: -10px;
    right: -10px;
    opacity: 0.85;
    pointer-events: none;
}
.mobile-hero { position: relative; overflow: hidden; }

/* Kart */
.profile-mobile-card {
    background: #fff;
    border-radius: 16px;
    padding: 1.1rem 1.1rem 0.5rem;
    margin-bottom: 0.85rem;
    box-shadow: 0 1px 6px rgba(15,23,42,0.06);
    border: 1px solid #f1f5f9;
    color: #1e293b !important;
}

/* Bölüm başlığı */
.profile-section-header {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin-bottom: 0.6rem;
}
.profile-section-icon {
    width: 42px; height: 42px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.profile-section-title {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.3;
}
.profile-section-sub {
    font-size: 0.74rem;
    color: #94a3b8;
    margin-top: 0.1rem;
    line-height: 1.4;
}
.profile-divider {
    height: 1px;
    background: #f1f5f9;
    margin: 0 -1.1rem 0.75rem;
}

/* Form alanı grubu */
.profile-field-group {
    margin-bottom: 0.85rem;
}
.profile-field-label {
    font-size: 0.78rem;
    font-weight: 600;
    color: #374151;
    margin-bottom: 0.35rem;
}
.profile-field-wrap {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    background: #f8fafc;
    border: 1.5px solid #e2e8f0;
    border-radius: 12px;
    padding: 0 0.9rem;
    height: 46px;
    transition: border-color 0.15s;
}
.profile-field-wrap:focus-within {
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba(37,99,235,0.08);
    background: #fff;
}
.profile-field-icon { flex-shrink: 0; }
.profile-field-input {
    flex: 1;
    border: none;
    outline: none;
    font-size: 0.88rem;
    color: #1e293b !important;
    font-weight: 500;
    background: transparent;
    min-width: 0;
}
.profile-field-input--disabled {
    color: #94a3b8 !important;
    cursor: not-allowed;
}
.profile-field-text {
    font-size: 0.88rem;
    color: #1e293b !important;
    font-weight: 500;
}
/* Yüksek özgünlük ile renk güvencesi */
#kt_content_container .profile-mobile-card { color: #1e293b !important; }
#kt_content_container .profile-section-title { color: #1e293b !important; }
#kt_content_container .profile-section-sub { color: #64748b !important; }
#kt_content_container .profile-field-label { color: #374151 !important; }
#kt_content_container .profile-field-input { color: #1e293b !important; }
#kt_content_container .profile-field-input--disabled { color: #94a3b8 !important; }
#kt_content_container .profile-field-text { color: #1e293b !important; }
#kt_content_container .profile-rank-name { color: #1e293b !important; }
#kt_content_container .profile-info-row__title { color: #1e293b !important; }
#kt_content_container .profile-info-row__sub { color: #64748b !important; }
#kt_content_container .profile-info-row__val { color: #64748b !important; }
#kt_content_container .profile-api-link { color: #2563eb !important; }

/* Üyelik seviyesi satırı */
.profile-rank-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
    background: #f8fafc;
    border: 1.5px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.65rem 0.9rem;
}
.profile-rank-icon { font-size: 1.3rem; }
.profile-rank-name {
    font-size: 0.88rem;
    font-weight: 700;
    color: #1e293b;
}
.profile-rank-badge {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 20px;
    background: #eff6ff;
    color: #2563eb;
    font-size: 0.7rem;
    font-weight: 700;
    white-space: nowrap;
}
.profile-rank-badge--green {
    background: #dcfce7;
    color: #16a34a;
}

/* Info satırları (API, şifre, dil) */
.profile-info-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.8rem 0;
    border-bottom: 1px solid #f8fafc;
}
.profile-info-row:last-child { border-bottom: none; }
.profile-info-row--clickable:hover { background: #f8fafc; border-radius: 10px; padding-left: 0.5rem; padding-right: 0.5rem; }
.profile-info-row--link { cursor: pointer; color: inherit; }
.profile-info-row__left {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    min-width: 0;
    flex: 1;
}
.profile-info-row__icon {
    width: 34px; height: 34px;
    border-radius: 9px;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.profile-info-row__title {
    font-size: 0.88rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.3;
}
.profile-info-row__sub {
    font-size: 0.73rem;
    color: #94a3b8;
    margin-top: 0.1rem;
}
.profile-info-row__val {
    font-size: 0.8rem;
    color: #64748b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 160px;
    display: block;
}

/* API linki */
.profile-api-link {
    font-size: 0.73rem;
    color: #2563eb;
    font-weight: 600;
    text-decoration: none;
    display: block;
    margin-top: 0.2rem;
}
.profile-api-link:hover { text-decoration: underline; }

/* Kopyala butonu */
.profile-copy-btn {
    background: #f1f5f9;
    border: none;
    border-radius: 8px;
    padding: 0.45rem 0.6rem;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.15s;
}
.profile-copy-btn:hover { background: #e2e8f0; }

/* Aksiyon butonları */
.profile-action-btns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.6rem;
    margin-bottom: 5.5rem;
}
.profile-action-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    padding: 0.8rem 0.5rem;
    border-radius: 14px;
    font-size: 0.85rem;
    font-weight: 700;
    border: none;
    cursor: pointer;
    text-decoration: none !important;
    transition: box-shadow 0.15s, transform 0.1s;
    white-space: nowrap;
}
.profile-action-btn:active { transform: scale(0.97); }
.profile-action-btn--light {
    background: #fff;
    color: #374151 !important;
    border: 1.5px solid #e2e8f0;
    box-shadow: 0 1px 4px rgba(15,23,42,0.05);
}
.profile-action-btn--primary {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%);
    color: #fff !important;
    box-shadow: 0 4px 14px rgba(37,99,235,0.25);
}

/* ═══════════════════════════════════════════════════════════════
   NUMARALARIM SAYFASI  (numbers.php)
   ═══════════════════════════════════════════════════════════════ */

/* Bilgi kartı */
.numbers-info-card {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 16px;
    padding: 0.9rem 1rem;
    margin-bottom: 1rem;
}
.numbers-info-card__icon {
    flex-shrink: 0;
    margin-top: 0.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}
.numbers-info-card__text {
    font-size: 0.8rem;
    line-height: 1.55;
    color: #1e40af;
    font-weight: 500;
}

/* ── Özel arama satırı ─────────────────────────────────────────── */
.numbers-search-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}
.numbers-search-wrap {
    flex: 1;
    position: relative;
    min-width: 0;
}
.numbers-search-icon {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    flex-shrink: 0;
}
.numbers-search-input {
    width: 100%;
    padding: 0.7rem 0.75rem 0.7rem 2.35rem;
    border: 1.5px solid #e2e8f0;
    border-radius: 12px;
    font-size: 0.9rem;
    color: #1e293b;
    background: #fff;
    outline: none;
    transition: border-color 0.15s;
    box-sizing: border-box;
}
.numbers-search-input::placeholder { color: #94a3b8; }
.numbers-search-input:focus { border-color: #2563eb; }
.numbers-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.68rem 1rem;
    background: #f8fafc;
    border: 1.5px solid #e2e8f0;
    border-radius: 12px;
    font-size: 0.88rem;
    font-weight: 600;
    color: #374151;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.15s, border-color 0.15s;
}
.numbers-filter-btn:active { background: #e2e8f0; }

/* ── Show entries satırı ───────────────────────────────────────── */
.numbers-entries-row {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.6rem;
}
.numbers-entries-label {
    font-size: 0.88rem;
    color: #374151;
    font-weight: 500;
}
.numbers-entries-select {
    border: 1.5px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.35rem 1.7rem 0.35rem 0.6rem;
    font-size: 0.88rem;
    color: #1e293b;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9l6 6 6-6' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 0.4rem center;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
    cursor: pointer;
}

/* ── Mobil kart listesi ────────────────────────────────────────── */
.numbers-mob-cards-list { /* wrapper sınıfı — gerekirse */ }

/* Tekil kart */
.numbers-mob-card {
    background: #fff;
    border: 1px solid #eef2f7;
    border-radius: 14px;
    margin-bottom: 10px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(15,23,42,0.04);
    color: #1e293b;
}

/* Kart baş: ID + aksiyon/durum */
.numbers-mob-card__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 14px;
    background: #f8fafc;
    border-bottom: 1px solid #f1f5f9;
    gap: 0.5rem;
}
.numbers-mob-card__id {
    font-size: 0.8rem;
    font-weight: 700;
    color: #94a3b8;
    letter-spacing: 0.03em;
}
.numbers-mob-card__action { display: flex; align-items: center; gap: 0.35rem; flex-wrap: wrap; }
/* İptal butonu (aktif numaralar için) */
.numbers-mob-card__action .btn { font-size: 0.78rem !important; padding: 0.3rem 0.75rem !important; border-radius: 8px !important; }

/* Kart gövde: numara + servis */
.numbers-mob-card__body {
    padding: 11px 14px 9px;
    border-bottom: 1px solid #f1f5f9;
}
.numbers-mob-card__phone {
    font-size: 0.97rem;
    font-weight: 700;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 3px;
}
/* Kopyala butonları (panel.numbers.js tarafından eklenen) */
.numbers-mob-card__phone button,
.numbers-mob-card__code button {
    background: #f1f5f9 !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 4px 6px !important;
    cursor: pointer;
    line-height: 1;
    display: inline-flex;
    align-items: center;
}
.numbers-mob-card__service {
    font-size: 0.84rem;
    color: #64748b;
    line-height: 1.45;
}

/* Kart alt: onay kodu + süre */
.numbers-mob-card__footer {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 14px 11px;
}
.numbers-mob-card__code {
    flex: 1;
    font-size: 0.88rem;
    color: #374151;
    line-height: 1.75;
}
.numbers-mob-card__timer {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.88rem;
    font-weight: 700;
    color: #64748b;
    white-space: nowrap;
    flex-shrink: 0;
    padding-top: 3px;
}

/* Boş durum */
.numbers-mob-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    color: #94a3b8;
}

/* DataTable kart wrapper — mobilde arka plan şeffaf, çerçevesiz */
@media (max-width: 991px) {
    .numbers-dt-wrap > .card {
        box-shadow: none !important;
        border: none !important;
        background: transparent !important;
    }
}
