/* ==========================================================================
   Biletstore — Hesap sayfaları (account)
   Tasarım referansı: profil.html, favoriler.html, odeme-yontemleri.html,
   destek-talep.html. Yalnızca token kullanır (dark + light).

   Bağlama:
   @push('styles')
     <link rel="stylesheet" href="{{ site_asset('css/pages/account.css') }}">
   @endpush
   ========================================================================== */


/* ==========================================================================
   1) ORTAK HESAP YERLEŞİMİ  (tüm hesap sayfaları — account-b de kullanır)
   --------------------------------------------------------------------------
   <section class="container-xxl py-4 bb-account" id="profile-page">
     <div class="row g-4">
       @include("layouts.front.profile-sidebar", ["menu" => "..."])      → aside.col-12.col-lg-3
       <div class="col-12 col-lg-9 bb-account-main" id="profile-content">
         @include("layouts.front.mobile-fast-menu", ["menu" => "..."])   → yalnızca lg altı
         <div class="bb-account-head">
           <div class="bb-account-head-text">
             <h1 class="h2 mb-1">Başlık</h1>
             <p class="text-sm text-secondary-2 mb-0">Alt başlık (varsa)</p>
           </div>
           <div class="bb-account-head-actions"> ...btn-primary / btn-secondary... </div>
         </div>
         <div class="bb-card bb-account-card"> <h5 class="mb-3">Bölüm</h5> ... </div>
       </div>
     </div>
   </section>
   ========================================================================== */

/* Eski style.css: `section { padding: 2rem 0 }` ve `#profile-page { padding: 0 }` container'ın yan
   boşluğunu sıfırlıyor; `.col-lg-3 { max-width: 50% }` (≤1199px) yan menüyü bozuyor. Nötralize et. */
.bb-account { min-height: 50vh; }
section.bb-account,
#profile-page.bb-account {
  padding-left: calc(var(--bs-gutter-x, 1.5rem) * .5);
  padding-right: calc(var(--bs-gutter-x, 1.5rem) * .5);
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .bb-account-aside.col-lg-3 { flex: 0 0 auto; width: 25%; max-width: 25%; }
}

/* --- Yan menü (profile-sidebar) --- */
@media (min-width: 992px) {
  .bb-account-aside-inner { position: sticky; top: 1rem; }
}
.bb-account .min-w-0, .bb-account-aside .min-w-0 { min-width: 0; }
.bb-account-avatar {
  width: 44px; height: 44px; flex: 0 0 auto; object-fit: cover;
  border-radius: var(--radius-full); border: 1px solid var(--border-subtle);
  background: var(--surface-overlay);
}
.bb-account-user-edit {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 32px; height: 32px; border-radius: var(--radius-full);
  color: var(--text-muted); text-decoration: none;
}
.bb-account-user-edit:hover { color: var(--text-primary); background: var(--surface-overlay); }
.bb-account-nav .bb-side-link .bb-ico,
.bb-account-aside .bb-side-link.bb-muted .bb-ico { color: var(--text-muted); }
.bb-account-nav .bb-side-link.active .bb-ico { color: var(--text-accent); }
.bb-account-aside .bb-side-link.bb-muted:hover { color: var(--text-primary); }

/* --- Mobil hızlı menü (mobile-fast-menu) ---
   Eski style.css #mobileFastMenu'yü 568px üstünde gizliyordu; lg altında hep göster. */
#mobileFastMenu.bb-fastmenu { display: block; margin-top: 0; }
.bb-fastmenu-toggle {
  display: flex; align-items: center; gap: .75rem; width: 100%;
  padding: .75rem 1rem; font: inherit; font-size: .9375rem; text-align: left;
  color: var(--text-primary); background: var(--surface-raised);
  border: 1px solid var(--border-subtle); border-radius: var(--radius-lg);
}
.bb-fastmenu-toggle:hover { border-color: var(--border-default); }
.bb-fastmenu-toggle:focus-visible { outline: 2px solid var(--accent-solid); outline-offset: 2px; }
.bb-fastmenu-chevron { color: var(--text-muted); transition: transform .2s ease; }
.bb-fastmenu-toggle:not(.collapsed) .bb-fastmenu-chevron { transform: rotate(180deg); }
.bb-fastmenu-list {
  margin-top: .5rem; padding: .5rem;
  background: var(--surface-raised); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg);
}

/* --- Başlık satırı --- */
.bb-account-head {
  display: flex; flex-wrap: wrap; align-items: flex-start; gap: .75rem 1rem; margin-bottom: 1.5rem;
}
.bb-account-head-text { flex: 1 1 16rem; min-width: 0; }
.bb-account-head-text h1 { overflow-wrap: anywhere; }
.bb-account-head-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }

/* --- Bölüm kartı --- */
.bb-account-card { padding: 1rem; margin-bottom: 1rem; }
@media (min-width: 768px) { .bb-account-card { padding: 1.25rem; } }
.bb-account-card > h5, .bb-account-card .bb-card-title { font-weight: 500; }
.bb-account-main .form-label .text-danger,
.bb-req { color: var(--text-accent) !important; }
.bb-account-main textarea.form-control { min-height: 120px; }

/* Form alt aksiyon çubuğu */
.bb-account-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
@media (max-width: 575.98px) {
  .bb-account-actions .btn { flex: 1 1 100%; }
  .bb-account-head-actions { width: 100%; }
  .bb-account-head-actions .btn { flex: 1 1 auto; }
}

/* Liste satırı (kart / adres / talep) — bb-card p-0 içinde */
.bb-acc-item { display: flex; align-items: flex-start; gap: .875rem 1rem; padding: 1rem; }
.bb-acc-item + .bb-acc-item { border-top: 1px solid var(--border-subtle); }
@media (min-width: 768px) { .bb-acc-item { padding: 1rem 1.25rem; } }
.bb-acc-head { padding: 1rem; }
@media (min-width: 768px) { .bb-acc-head { padding: 1rem 1.25rem; } }
.bb-acc-item-ico {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 40px; height: 40px; border-radius: var(--radius-full);
  background: var(--accent-soft); color: var(--text-accent);
}
.bb-acc-item-main { flex: 1 1 auto; min-width: 0; }
.bb-acc-item-title { font-size: .9375rem; font-weight: 500; color: var(--text-primary); overflow-wrap: anywhere; }
.bb-acc-item-meta { font-size: .8125rem; color: var(--text-secondary); overflow-wrap: anywhere; }
.bb-acc-item-meta .bb-ico { color: var(--text-muted); vertical-align: -2px; margin-right: .375rem; }
.bb-acc-item-actions { display: flex; align-items: center; gap: .25rem; flex: 0 0 auto; }
.bb-acc-item-actions form { display: inline-flex; margin: 0; }
@media (max-width: 575.98px) {
  .bb-acc-item { flex-wrap: wrap; }
  .bb-acc-item-main { flex-basis: calc(100% - 56px); }
  .bb-acc-item-actions { width: 100%; justify-content: flex-end; }
}
.bb-icon-btn.bb-danger:hover { color: var(--text-accent); background: var(--accent-soft); }

/* Boş durum */
.bb-empty { text-align: center; padding: 2.5rem 1rem; }
.bb-empty-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 56px; height: 56px; margin-bottom: 1rem; border-radius: var(--radius-full);
  background: var(--surface-overlay); color: var(--text-muted);
}
.bb-empty-ico .bb-ico { width: 1.5rem; height: 1.5rem; }
.bb-empty h5 { font-size: 1.0625rem; font-weight: 500; margin-bottom: .375rem; }
.bb-empty p { font-size: .875rem; color: var(--text-secondary); max-width: 44ch; margin: 0 auto 1.25rem; }

/* Pagination hizası */
.bb-account-main .pagination { flex-wrap: wrap; margin-bottom: 0; }


/* ==========================================================================
   2) HESAP BİLGİLERİM (profile/information)
   ========================================================================== */
.bb-avatar-edit { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; }
.bb-avatar-lg {
  position: relative; width: 80px; height: 80px; flex: 0 0 auto;
}
.bb-avatar-lg .avatar-img,
.bb-avatar-lg .bb-avatar-initials {
  width: 80px; height: 80px; border-radius: var(--radius-full);
}
.bb-avatar-lg .avatar-img { object-fit: cover; border: 1px solid var(--border-subtle); background: var(--surface-overlay); }
.bb-avatar-lg .bb-avatar-initials {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--accent-soft); color: var(--text-accent); font-size: 1.375rem; font-weight: 500;
}
.bb-avatar-lg .avatar-preview-hidden { display: none; }
.bb-avatar-lg .avatar-edit-btn {
  position: absolute; right: -2px; bottom: -2px; width: 30px; height: 30px; margin: 0; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--radius-full); background: var(--surface-raised);
  border: 1px solid var(--border-default); color: var(--text-primary);
}
.bb-avatar-lg .avatar-edit-btn:hover { background: var(--surface-overlay); }
.avatar-file-input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }


/* ==========================================================================
   3) DESTEK TALEPLERİ (support)
   ========================================================================== */
.bb-stat { display: flex; align-items: center; gap: .875rem; height: 100%; padding: 1rem; }
.bb-stat-ico {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 40px; height: 40px; border-radius: var(--radius-full);
}
.bb-stat-ico.is-total    { background: var(--accent-soft);         color: var(--text-accent); }
.bb-stat-ico.is-pending  { background: var(--status-warning-soft); color: var(--status-warning); }
.bb-stat-ico.is-resolved { background: var(--status-success-soft); color: var(--status-success); }
.bb-stat-label { display: block; font-size: .75rem; color: var(--text-muted); }
.bb-stat-value { display: block; font-size: 1.125rem; font-weight: 500; color: var(--text-primary); }
@media (max-width: 575.98px) {
  .bb-stat { flex-direction: column; align-items: flex-start; gap: .5rem; padding: .75rem; }
  .bb-stat-ico { width: 32px; height: 32px; }
}

/* Talep listesi: bb-list > a.bb-row */
.bb-ticket-row { align-items: flex-start; }
.bb-ticket-row .bb-row-main { display: flex; flex-direction: column; gap: .125rem; }
.bb-ticket-row .bb-ticket-excerpt {
  font-size: .8125rem; color: var(--text-muted); margin: .125rem 0 0;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.bb-ticket-aside { display: flex; flex-direction: column; align-items: flex-end; gap: .375rem; flex: 0 0 auto; text-align: right; }
.bb-ticket-aside .time { font-size: .75rem; color: var(--text-muted); white-space: nowrap; }
@media (max-width: 575.98px) {
  .bb-ticket-row { flex-wrap: wrap; }
  .bb-ticket-row .bb-row-main { flex-basis: 100%; }
  .bb-ticket-aside { flex-direction: row; align-items: center; width: 100%; justify-content: space-between; }
}

/* Talep detayı: meta şeridi */
.bb-meta-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.bb-meta-grid .label { display: block; font-size: .75rem; color: var(--text-muted); margin-bottom: .25rem; }
.bb-meta-grid .value { display: block; font-size: .875rem; color: var(--text-primary); overflow-wrap: anywhere; }
@media (max-width: 767.98px) { .bb-meta-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Mesaj akışı */
.bb-thread { display: flex; flex-direction: column; gap: .75rem; }
.bb-msg {
  max-width: min(640px, 88%); padding: .875rem 1rem;
  border: 1px solid var(--border-subtle); border-radius: var(--radius-lg);
  background: var(--surface-raised);
}
.bb-msg.is-user { align-self: flex-end; background: var(--accent-soft); border-color: transparent; }
.bb-msg.is-support { align-self: flex-start; }
.bb-msg-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .375rem; }
.bb-msg-head .author { font-size: .8125rem; font-weight: 500; color: var(--text-primary); }
.bb-msg.is-user .bb-msg-head .author { color: var(--text-accent); }
.bb-msg-head .time { font-size: .71875rem; color: var(--text-muted); white-space: nowrap; }
.bb-msg-body { font-size: .9375rem; color: var(--text-primary); white-space: pre-line; overflow-wrap: anywhere; margin: 0; }
.bb-msg .bb-chip { margin-top: .625rem; text-decoration: none; }
@media (max-width: 575.98px) { .bb-msg { max-width: 100%; } }

.bb-notice {
  display: flex; align-items: flex-start; gap: .625rem; padding: .875rem 1rem;
  border-radius: var(--radius-md); background: var(--surface-sunken);
  font-size: .875rem; color: var(--text-secondary);
}
.bb-notice .bb-ico { margin-top: .125rem; }
.bb-notice.is-success { background: var(--status-success-soft); color: var(--status-success); }


/* ==========================================================================
   4) FAVORİLER (favorites)
   ========================================================================== */
.bb-fav-tabs .bb-chip { display: inline-flex; align-items: center; gap: .5rem; text-decoration: none; white-space: nowrap; }
.bb-fav-count {
  display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 .375rem;
  font-size: .6875rem; border-radius: var(--radius-full); background: var(--surface-overlay); color: var(--text-secondary);
}
.bb-fav-tabs .bb-chip.active .bb-fav-count { background: var(--accent-solid); color: var(--text-on-accent); }

.bb-fav-row { position: relative; }
.bb-fav-row .bb-row-title a { color: inherit; text-decoration: none; }
.bb-fav-row .bb-row-title a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.bb-fav-row .heart-icon, .bb-fav-tile .heart-icon { position: relative; z-index: 2; color: var(--text-accent); }
.bb-fav-row .heart-icon .bb-ico, .bb-fav-tile .heart-icon .bb-ico { fill: currentColor; }
.bb-fav-row .bb-row-date small:last-child { text-transform: uppercase; }
.bb-fav-row .bb-fav-cta { position: relative; z-index: 2; flex: 0 0 auto; }

.bb-fav-tile { position: relative; }
.bb-fav-tile .bb-fav-link { color: inherit; text-decoration: none; }
.bb-fav-tile .bb-fav-link::after { content: ""; position: absolute; inset: 0; z-index: 1; border-radius: var(--radius-lg); }
.bb-fav-tile .bb-fav-img {
  width: 44px; height: 44px; flex: 0 0 auto; object-fit: cover; border-radius: var(--radius-full);
  background: var(--surface-overlay); border: 1px solid var(--border-subtle);
}
.bb-fav-tile .bb-fav-img.is-logo { object-fit: contain; padding: 4px; }
.bb-fav-tile .heart-icon { margin-left: auto; }
@media (max-width: 575.98px) {
  .bb-fav-row { flex-wrap: wrap; }
  .bb-fav-row .bb-row-main { flex-basis: calc(100% - 110px); }
}


/* ==========================================================================
   5) ŞİFRE SIFIRLAMA (profile/password-reset*)
   ========================================================================== */
.bb-auth-card { width: 100%; max-width: 460px; padding: 1.5rem; }
@media (min-width: 576px) { .bb-auth-card { padding: 2rem; } }
.bb-auth-crumb { width: 100%; max-width: 460px; }
.bb-auth-crumb .breadcrumb { margin-bottom: 0; }

/* Mobilde başlık ölçüsü */
@media (max-width: 575.98px) {
  .bb-account-head h1.h2 { font-size: 1.75rem; }
}