/* m-history — FanatikBet birebir mobil katmanı (bocekbet-lobby.css sonrası yüklenir)
   Sayfalar: /wallet, /withdrawals, /notifications, /call-request, /feedback, /game-times, /delete-account, /receipt
   Ölçüm: FB 375px (getComputedStyle). Ortak önek: .hx-* */

/* ---------- masaüstü: mobil-özel parçalar gizli ---------- */
.hx-filter-btn,.hx-range,.hx-filter,.hx-search,.hx-list,.hx-m-only{display:none}

/* ---------- boş durum kutusu (FB: #2e3137 r8 p16/32, başlık 16/600 beyaz, alt 14/600 #ababab) — tüm genişlikler ---------- */
.hx-empty{background:#2e3137;border:1px solid #2e3137;border-radius:8px;padding:16px 32px;text-align:center}
.hx-empty[hidden]{display:none}
.hx-empty p{margin:0}
.hx-empty-t{color:#fff;font-size:16px;font-weight:600;line-height:24px}
.hx-empty-s{margin-top:4px !important;color:#ababab;font-size:14px;font-weight:600;line-height:20px}

@media (max-width:760px){
  .hx-m-hide,.hx .hx-head-actions{display:none !important}
  .hx .hx-table{display:none !important}

  /* başlık kartı içindeki küçük gri buton (FB "Filtrele": 28h #2e3137 r6 p4/14 14/700) */
  .hx-filter-btn{display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;height:28px;padding:4px 14px;border:0;border-radius:6px;background:#2e3137;color:#fff;font:700 14px/24.5px Outfit,sans-serif;cursor:pointer;white-space:nowrap}
  .hx-filter-btn i{font-size:12px}
  .hx-filter-btn.on{background:#ff003a}

  /* başlık kartı altındaki gövde: FB p16/8 */
  .bb-account-wrap>.content.hx{gap:0 !important;row-gap:0 !important}
  .hx .slot-head{flex-wrap:nowrap !important}
  .hx .slot-head .catalog-intro{flex:1 1 auto;min-width:0}
  .hx .hx-body{display:block;padding:16px 8px 0;margin:0}

  .hx-range{display:block;margin:0 0 16px;color:#fff;font-size:20px;font-weight:700;line-height:28px}

  .hx-filter:not([hidden]){display:flex;flex-wrap:wrap;gap:8px;margin:0 0 12px}
  .hx-chip{height:32px;padding:0 14px;border:0;border-radius:8px;background:#2e3137;color:#fff;font:600 13px/1 Outfit,sans-serif;cursor:pointer}
  .hx-chip.on{background:#ff003a}

  /* arama: 42h, 1px #2e3137 r8, ikon 16 + ayraç + 13px input */
  .hx-search{display:flex;align-items:center;height:42px;margin:0 0 8px;padding:0 16px;border:.5px solid #2e3137;border-radius:8px;background:transparent;cursor:text}
  .hx-search>i{flex:0 0 16px;font-size:15px;color:#fff;text-align:center}
  .hx-search-sep{flex:0 0 1px;width:1px;height:20px;margin:0 12px 0 11px;background:#3a3d44}
  .hx-search input{flex:1;min-width:0;height:100%;padding:0;border:0;outline:0;background:transparent;color:#fff;font:400 13px Outfit,sans-serif;-webkit-appearance:none;appearance:none}
  .hx-search input::placeholder{color:#ababab;opacity:1}
  .hx-search input::-webkit-search-cancel-button{display:none}

  /* ---------- işlem kartı (FB: #2e3137, 1px rgba(255,255,255,.1), r8, aralık 8) ---------- */
  .hx-list{display:flex;flex-direction:column;gap:8px}
  .hx-card{display:flex;flex-direction:column;background:#2e3137;border:.5px solid rgba(255,255,255,.1);border-radius:8px;overflow:hidden}
  .hx-card[hidden]{display:none}
  .hx-card p{margin:0}
  .hx-card-top{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:.5px solid rgba(255,255,255,.1)}
  .hx-dir{flex:0 0 8px;width:8px;display:grid;place-items:center;font-size:12px;line-height:1}
  .hx-dir.down{color:#ff003a}.hx-dir.up{color:#16c784}
  .hx-card-id{flex:1;min-width:0}
  .hx-card-title{color:#fff;font-size:12px;font-weight:700;line-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hx-card-date{margin-top:3px !important;color:#828690;font-size:12px;font-weight:500;line-height:16px}
  .hx-copy{display:inline-flex;align-items:center;gap:8px;max-width:100%;margin-top:4px;padding:0;border:0;background:none;color:#828690;font:600 14px/20px Outfit,sans-serif;cursor:pointer}
  .hx-copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .hx-copy i{font-size:12px;color:#ff003a}
  .hx-card-kind{flex:0 0 auto;max-width:44%;min-width:80px;text-align:left}
  .hx-card-kind p{color:#fff;font-size:14px;font-weight:700;line-height:20px}
  .hx-card-kind small{display:block;margin-top:5px;color:#fff;font-size:12.8px;font-weight:400;line-height:19.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hx-card-mid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px 16px}
  .hx-col{min-width:0;text-align:center}
  .hx-lbl{color:#828690;font-size:14px;font-weight:600;line-height:20px}
  .hx-val{display:flex;align-items:center;justify-content:center;gap:4px;margin-top:6px !important;color:#fff;font-size:14px;font-weight:700;line-height:20px;word-break:break-word}
  .hx-val.hx-desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-align:center}
  .hx-amt{color:#ffb020}
  .hx-coin{flex:0 0 20px;width:20px;height:20px;border-radius:50%;background:#41b1ad;color:#fff;display:inline-grid;place-items:center;font-size:11px;font-weight:800;line-height:1}
  .hx-card-foot{padding:12px 16px;border-top:.5px solid rgba(255,255,255,.1);text-align:center}
  .hx-foot-h{color:#828690;font-size:16px;font-weight:400;line-height:24px;text-transform:uppercase}
  .hx-foot-t{color:#fff;font-size:12px;font-weight:500;line-height:16px;word-break:break-word}

  /* ---------- boş durum kutusu (FB: #2e3137 r8 p16/32, başlık 16/600, alt 14/600 #ababab) ---------- */

  /* sayfalama: FB gri yüzeyler */
  .hx .wallet-pagination{margin-top:16px}
  .hx .pg-btn{height:36px;min-width:36px;border:0;border-radius:8px;background:#2e3137;color:#fff;font-size:13px}
  .hx .pg-btn.on{background:#ff003a;color:#fff;border:0}
  .hx .wallet-pagination-meta{color:#ababab}
}

/* =========================== /withdrawals — Geçmiş İşlemler =========================== */
@media (max-width:760px){
  .hx-m-only{display:block}
  .hx-wd .wtrack{gap:0 !important;max-width:none}
  .hx-wd .wtrack>.slot-head{order:0}
  .hx-wd .hx-wd-body{order:1}
  .hx-wd .hx-pages{order:2;margin:16px 8px 0}
  .hx-wd .hx-sec-h{order:3}
  .hx-wd .wt-wallet{order:4}
  .hx-wd .wt-progress{order:5}
  .hx-wd .wt-stats{order:6}
  .hx-wd .sla-badge{order:7}

  /* bölüm başlığı (FB h1 20/700 lh28) */
  .hx-sec-h{margin:24px 8px 12px;color:#fff;font-size:20px;font-weight:700;line-height:28px}

  /* bakiye/çevrim özetleri → FB stat kartları (#24262b r8 p16) */
  .hx-wd .wt-wallet{grid-template-columns:1fr 1fr !important;gap:8px;margin:0 8px 8px}
  .hx-wd .wt-wallet .wt-stat.main{grid-column:1/-1}
  .hx-wd .wt-stat{background:#24262b !important;border:0 !important;border-radius:8px !important;padding:16px !important;box-shadow:none !important}
  .hx-wd .wt-stat .l{color:#ababab;font-size:12px;font-weight:600;line-height:16px;margin:0 0 4px}
  .hx-wd .wt-stat .v{color:#fff;font-size:18px;font-weight:700;line-height:28px}
  .hx-wd .wt-stat .v.g{color:#16c784}
  .hx-wd .wt-stat .v+.l{margin:4px 0 0}
  .hx-wd .wt-progress{margin:0 8px 8px;padding:16px;border-radius:8px}
  .hx-wd .wt-stats{grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:8px;margin:0 8px 8px}
  .hx-wd .wt-stats .wt-stat .v{font-size:15px;line-height:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hx-wd .sla-badge{margin:0 8px 8px}

  /* kart başı: 34px ikon + başlık/tarih/no + durum rozeti + aç/kapa */
  .hx-ic{flex:0 0 34px;width:34px;height:34px;border-radius:8px;background:rgba(255,255,255,.1);display:grid;place-items:center;color:#fff;font-size:15px}
  .hx-badge{flex:0 0 auto;height:40px;display:inline-flex;align-items:center;justify-content:center;padding:0 16px;border:1.6px solid rgba(171,171,171,.32);border-radius:8px;background:transparent;color:#ababab;font-size:14px;font-weight:800;line-height:21px;white-space:nowrap}
  .hx-badge>span{padding:0 12px}
  .hx-badge.pending{color:#ababab;border-color:rgba(171,171,171,.32)}
  .hx-badge.processing{color:#ffb020;border-color:rgba(255,176,32,.32)}
  .hx-badge.approved{color:#16c784;border-color:rgba(22,199,132,.32)}
  .hx-badge.rejected{color:#ff3146;border-color:rgba(255,49,70,.32)}
  .hx-more{flex:0 0 32px;width:32px;height:32px;margin-left:-9px;padding:0;display:grid;place-items:center;border:1.6px solid #2e3137;border-radius:8px;background:#1a1c20;color:#fff;font-size:12px;cursor:pointer}
  .hx-more i{transition:transform .2s}
  .hx-more.on i{transform:rotate(180deg)}
  .hx-ok{color:#16c784 !important}.hx-bad{color:#ff3146 !important}.hx-muted{color:#ababab !important}

  /* açılır ayrıntı: adımlar + hesap/zincir notları */
  .hx-card-more{padding:12px 16px;border-top:.5px solid rgba(255,255,255,.1)}
  .hx-card-more[hidden]{display:none}
  .hx-card .wt-step .ic{width:30px;height:30px;font-size:12px;background:#2e3137;border:2px solid #3a3d44;color:#ababab}
  .hx-card .wt-step::before{top:14px;background:#3a3d44}
  .hx-card .wt-step.done .ic{background:#2e3137;border-color:#16c784;color:#16c784}
  .hx-card .wt-step.done::before{background:#16c784}
  .hx-card .wt-step.active .ic{background:#2e3137;border-color:#ffb020;color:#ffb020;box-shadow:none}
  .hx-card .wt-step.active::before{background:#ffb020}
  .hx-card .wt-step.fail .ic{background:#2e3137;border-color:#ff3146;color:#ff3146}
  .hx-card .wt-step.fail::before{background:#ff3146}
  .hx-card .wt-step .lb{color:#fff;font-size:12px;font-weight:600}
  .hx-card .wt-step .dt{color:#828690;font-size:11px}
  .hx-more-meta{margin:10px 0 0 !important;color:#ababab;font-size:12px;font-weight:500;line-height:16px;text-align:center}
  .hx-card .wt-note{margin-top:10px;font-size:12px;border-radius:8px}
}
@media (max-width:760px){
  .hx-wd .wt-wallet .wt-stat:last-child{grid-column:1/-1}
  .hx-wd .wt-stats .wt-stat{padding:12px !important}
  .hx-wd .wt-stats .wt-stat .l{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hx .wtp-action,.hx .hx-primary{height:48px;border-radius:12px !important;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center}
}

/* =========================== /notifications — Bildirimler =========================== */
/* tüm genişlikler: yeni sekme/buton/satır parçaları (FB paleti) */
.hx-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.hx-tab{height:48px;padding:0 8px;border:0;border-radius:12px;background:#2e3137;color:#fff;font:700 14px/24px Outfit,sans-serif;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hx-tab.on{background:#ff003a}
.hx-wide-btn{width:100%;height:48px;margin-top:12px;padding:0 24px;display:flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:12px;background:#2e3137;color:#fff;font:700 14px/24px Outfit,sans-serif;cursor:pointer}
.hx-wide-btn i{color:#ababab;font-size:13px}
.hx-list-head{display:flex;align-items:center;justify-content:space-between;margin:24px 0 12px}
.hx-list-head h2{margin:0;color:#fff;font-size:16px;font-weight:700;line-height:24px}
.hx-count{display:inline-grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:4px;background:#ff003a;color:#fff;font-size:14px;font-weight:700;line-height:1;flex:0 0 auto}
.hx-count[hidden]{display:none !important}
.hx-notif .hx-notif-list{display:flex;flex-direction:column;gap:0;border:.5px solid rgba(255,255,255,.1);border-radius:8px;overflow:hidden}
.hx-notif .hx-notif-list:has(>.hx-empty:only-child),.hx-notif .hx-notif-list:has(>.acc-empty){border:0;border-radius:0;overflow:visible}
.hx-notif .acc-notif{position:relative;display:flex;align-items:center;gap:12px;padding:16px 16px 29px;border:0;border-bottom:.5px solid rgba(255,255,255,.1);border-radius:0;background:#24262b}
.hx-notif .acc-notif[hidden]{display:none}
.hx-notif .acc-notif.unread{border-color:rgba(255,255,255,.1);background:#24262b}
.hx-notif .acc-notif:last-of-type{border-bottom:0}
.acc-notif-dot{display:none}
.hx-notif .acc-notif.unread .acc-notif-dot{display:block;position:absolute;left:6px;top:16px;width:8px;height:8px;border-radius:50%;background:#16c784}
.hx-notif .acc-notif-ic{flex:0 0 40px;width:40px;height:40px;border-radius:12px;background:#ff3361;color:#fff;font-size:17px}
.hx-notif .acc-notif-body{flex:1;min-width:0}
.hx-notif .acc-notif-body strong{display:block;color:#fff;font-size:14px;font-weight:600;line-height:24px;word-break:break-word}
.hx-notif .acc-notif-body small{display:block;margin-top:4px;color:#ababab;font-size:12px;font-weight:600;line-height:16px}
.hx-notif .acc-notif-body span{display:block;margin-top:8px;color:#ababab;font-size:13px;line-height:19px}
.hx-notif .acc-notif-body span[hidden]{display:none}
.acc-notif-open{flex:0 0 auto;height:40px;margin-left:-12px;padding:0 24px;border:0;border-radius:8px;background:#24262b;color:#fff;font:600 12px/16px Outfit,sans-serif;cursor:pointer}
.acc-notif-open:hover{background:#2e3137}
.hx-notif .acc-empty{background:#2e3137;border-radius:8px;color:#ababab;font-weight:600}

@media (max-width:760px){
  .hx .prf-card.hx-body{background:none !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;padding:16px 8px 0 !important;margin:0 !important}
  .hx-notif .page-title .hx-count{margin-left:-2px}
}

/* =========================== Form sayfaları (/call-request, /feedback, /delete-account, /receipt) =========================== */
/* tüm genişlikler: FB alanı = etiket 12/600 üstte, 42px #24262b r8 kutu, solda ikon + 1px ayraç, 13px metin */
.hx-form form{display:flex;flex-direction:column;gap:12px;margin:0}
.hx-field{display:flex;flex-direction:column;gap:8px;margin:0;min-width:0}
.hx-field>label{margin:0;color:#fff;font-size:12px;font-weight:600;line-height:16px}
.hx-field>label em{margin-left:3px;color:#ff003a;font-style:normal}
.hx-inp{position:relative;display:flex;align-items:center;min-height:42px;padding:0 14px 0 12px;border:.5px solid transparent;border-radius:8px;background:#24262b;transition:border-color .15s}
.hx-inp:focus-within{border-color:rgba(255,0,58,.6)}
.hx-inp>i:first-child{flex:0 0 24px;width:24px;text-align:center;color:#ababab;font-size:15px}
.hx-inp>i:first-child::after{content:"";position:absolute;left:44px;top:11px;width:1px;height:20px;background:#3a3d44}
.hx .hx-inp input:not([type=checkbox]):not([type=radio]),.hx .hx-inp select,.hx .hx-inp textarea{flex:1;min-width:0;width:auto;height:40px;margin:0 0 0 19px;padding:0 !important;border:0 !important;border-radius:0 !important;outline:0;background:transparent !important;box-shadow:none !important;color:#fff;font:400 13px/19px Outfit,sans-serif}
.hx .hx-inp input[readonly]{color:#fff;cursor:default}
.hx .hx-inp input::placeholder,.hx .hx-inp textarea::placeholder{color:#ababab;opacity:1}
.hx .hx-inp select{-webkit-appearance:none;appearance:none;padding-right:24px !important;cursor:pointer;color-scheme:dark}
.hx .hx-inp select option{background:#24262b;color:#fff}
.hx-inp .hx-caret{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:12px;color:#828690;pointer-events:none}
.hx-inp.hx-ta{align-items:flex-start;min-height:98px;padding-top:16.5px;padding-bottom:16.5px}
.hx-inp.hx-ta>i:first-child{margin-top:1px}
.hx-inp.hx-ta>i:first-child::after{top:16px}
.hx .hx-inp.hx-ta textarea{height:auto;min-height:64px;resize:vertical}
.hx-inp.hx-ta-lg{min-height:130px;padding-left:14px}
.hx .hx-inp.hx-ta-lg textarea{margin-left:0;min-height:96px}
.hx .hx-submit{width:100%;height:48px;margin:0;padding:0 18px;display:flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:8px !important;background:#24262b;background-image:none;box-shadow:none;color:#fff;font:600 14px/20px Outfit,sans-serif;cursor:pointer;transition:background .15s}
.hx .hx-submit.is-ready{background:#ff003a}
.hx .hx-submit.is-ready:hover{background:#e50035;box-shadow:none}
.hx .hx-submit[disabled]{opacity:.6}
.hx .hx-hint{margin:12px 0 0;color:#828690;font-size:12px;line-height:18px}
.hx-lead{margin:0 0 16px;color:#828690;font-size:14px;font-weight:600;line-height:20px}
.hx-h3{display:flex;align-items:center;gap:8px;margin:0 0 8px;color:#fff;font-size:20px;font-weight:700;line-height:28px}
.hx-h3 i{font-size:16px}
.hx-p{margin:0 0 16px;color:#fff;font-size:14px;font-weight:600;line-height:20px}
.hx-ol{margin:0 0 16px;padding:0;list-style:decimal inside;color:#fff;font-size:14px;font-weight:600;line-height:20px}
.hx-fb .acc-rating{gap:6px}
.hx-fb .acc-star{font-size:24px;color:#3a3d44}
.hx-fb .acc-star.on,.hx-fb .acc-star:hover{color:#ffb020}
.hx-call .hx-field>label{color:#ababab}

@media (max-width:760px){
  .hx-form .acc-card-head{display:none !important}
}
.hx-form form>.hx-submit{margin-top:4px !important}
.hx-fb form>.hx-submit{margin-top:-3px !important}

/* =========================== /game-times — Oyun Süreleri =========================== */
/* tüm genişlikler: FB stat kartı (48px yuvarlak ikon + 14/400 etiket + 18/700 değer) */
.prf-sc.hx-stat{display:flex;align-items:center;gap:16px;min-height:80px;padding:16px;border:0;border-radius:8px;background:#24262b}
.hx-stat .hx-stat-ic{flex:0 0 48px;width:48px;height:48px;margin:0;border-radius:50%;background:#2e3137;display:grid;place-items:center;font-size:18px}
.hx-stat .hx-stat-tx{min-width:0}
.hx-stat .hx-stat-tx span{display:block;margin:0;color:#fff;font-size:14px;font-weight:400;line-height:20px}
.hx-stat .hx-stat-tx b{display:block;color:#fff;font-size:18px;font-weight:700;line-height:28px;font-variant-numeric:tabular-nums}

@media (max-width:760px){
  .hx-gt .hx-stats{display:flex !important;flex-direction:column;gap:16px}
  .hx-gt .prf-sc.hx-stat{border-radius:8px !important}
  .hx .hx-rg-card{margin:16px 0 0 !important;padding:16px !important;border:0 !important;border-radius:8px !important;background:#24262b !important;box-shadow:none !important}
  .hx .hx-rg-card .acc-card-head{margin:0 0 8px}
  .hx .hx-rg-card .acc-card-head h3{font-size:16px;font-weight:700;line-height:24px;color:#fff}
  .hx .hx-rg-card .acc-card-head h3 i{color:#ff3361}
  .hx .hx-rg-card .prf-hint{color:#ababab;font-size:14px;font-weight:400;line-height:20px;margin:0 0 16px !important}
  .hx .hx-rg-actions{display:grid !important;grid-template-columns:1fr 1fr;gap:8px !important}
  .hx .hx-rg-actions .btn{height:48px;justify-content:center;border-radius:8px !important;font-size:14px;font-weight:700;padding:0 12px}
  .hx .hx-rg-actions .btn-primary{grid-column:1/-1;background:#ff003a}
  .hx .hx-rg-actions .btn-ghost{background:#2e3137 !important;border:0 !important;color:#fff !important}
}

/* =========================== /delete-account — Hesabı Sil =========================== */
.hx-seg{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:0 0 16px}
.hx-seg-btn{height:48px;padding:10px 24px;border:0;border-radius:8px;background:#2e3137;color:#fff;font:700 14px/20px Outfit,sans-serif;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hx-seg-btn.on{background:#ff003a}
.hx-seg-pane[hidden]{display:none}
.hx-pane-label{margin:0 0 8px;color:#fff;font-size:12px;font-weight:600;line-height:16px}
.hx-del .hx-info{margin:0;padding:16px 16px 16px 34px;border-radius:8px;background:#24262b;color:#ababab;font-size:13px;line-height:19px;gap:8px}
.hx-del .hx-info b{color:#fff}

@media (max-width:760px){
  .hx .acc-danger-card.hx-body{border:0 !important}
  .hx-del .hx-pane-actions{display:block !important;margin-top:16px !important}
  .hx-del .hx-pane-actions .hx-submit{width:100%}
  .hx-del .btn-danger.hx-submit{background:#ff003a;color:#fff;border:0}
}
.hx .prf-card .hx-h3{display:flex;align-items:center;gap:8px;margin:0 0 8px;color:#fff;font-size:20px;font-weight:700;line-height:28px}
body.bb-shell .hx .hx-submit{background:#24262b;background-image:none;box-shadow:none;color:#fff}
body.bb-shell .hx .hx-submit.is-ready{background:#ff003a}
body.bb-shell .hx .hx-submit.is-ready:hover{background:#e50035}
@media (min-width:761px){
  .hx-del .hx-pane-actions{align-items:stretch}
  .hx-del .hx-pane-actions .hx-submit{flex:1 1 auto;width:auto}
  .hx-del .hx-pane-actions .btn-ghost{height:48px;display:inline-flex;align-items:center}
}