@charset "UTF-8";
/* pa-build: 20260912-1434 */
/* ==========================================================================
   ParçaApp — geçiş katmanı (Aşama 32)

   BU DOSYA EN SON YÜKLENİR VE BUNUN BİR SEBEBİ VAR.

   Tasarım sistemini kurarken eski sınıf adlarını (`pa-btn-primary`,
   `pa-stat-card`, `pa-chip--ok`) yeni sisteme takma ad olarak
   bağlamıştım — 198 view'a dokunmadan görsel dili birleştirmek için.

   Ama o kuralları `components.css` içine yazmıştım ve `app.css` ondan
   SONRA yükleniyor. Yani takma adların hiçbiri çalışmıyordu: kural
   oradaydı, sessizce eziliyordu. Hiçbir yerde hata çıkmadı; buton
   birleştirmesi aylarca yapılmamış gibi durabilirdi.

   `tools/css-conflicts.php` bunu buldu. Aynı tuzağa üç kez düştük:
   pa-cat-tile, pa-garage-card, pa-compare-grid.

   Bu dosya geçicidir. Eski sınıf adları view'lardan kademeli olarak
   temizlendikçe küçülmeli ve sonunda silinmeli.
   ========================================================================== */

/* -- Geriye dönük takma adlar ---------------------------------------------
   Mevcut kod bu adları kullanıyor; yeni sisteme bağlanıyorlar. */

.pa-btn-primary,
.btn.pa-btn-primary {
    background: var(--pa-orange-600);
    border-color: var(--pa-orange-600);
    color: #fff;
    font-weight: var(--pa-weight-semibold);
    border-radius: var(--pa-radius-md);
}
.pa-btn-primary:hover,
.btn.pa-btn-primary:hover { background: var(--pa-orange-700); border-color: var(--pa-orange-700); color: #fff; }

.pa-btn-ghost,
.btn.pa-btn-ghost {
    background: transparent;
    border-color: var(--pa-border);
    color: var(--pa-text);
    font-weight: var(--pa-weight-medium);
    border-radius: var(--pa-radius-md);
}
.pa-btn-ghost:hover,
.btn.pa-btn-ghost:hover { background: var(--pa-surface-2); border-color: var(--pa-border-strong); }

/*
   Bootstrap sınıfları da tek dile çekiliyor.

   Kodda 44 yerde `btn-outline-secondary` var ve Bootstrap'in gri
   çerçevesiyle geliyordu; artık lacivert ikincil butonla aynı
   görünüyor.
*/
.btn-outline-secondary {
    border-color: var(--pa-navy-900);
    color: var(--pa-navy-900);
}
.btn-outline-secondary:hover {
    background: var(--pa-navy-900);
    border-color: var(--pa-navy-900);
    color: #fff;
}

.btn-outline-danger {
    border-color: var(--pa-danger);
    color: var(--pa-danger);
}
.btn-outline-danger:hover { background: var(--pa-danger); border-color: var(--pa-danger); color: #fff; }

/* -- Eski kart adları ortak tabana bağlanıyor ------------------------------ */
.pa-stat-card,
.pa-panel-card,
.pa-record-card,
.pa-report-card,
.pa-garage-box,
.pa-local-card,
.pa-dup-card,
.pa-account-block {
    border-radius: var(--pa-radius-md);
    border-color: var(--pa-border);
}

/* -- Eski rozet adları ----------------------------------------------------- */
.pa-chip--ok    { background: var(--pa-success-050); color: #0b6b35; }
.pa-chip--warn  { background: var(--pa-warning-050); color: #8a6100; }
.pa-chip--muted { background: var(--pa-navy-050); color: var(--pa-muted); }



/* --------------------------------------------------------------------------
   app.css'te de tanimli olan bilesenler.

   Bunlar components.css icindeydi ama app.css sonra yuklendigi icin
   hicbiri calismiyordu. Tasarim sisteminin form, tablo ve bos durum
   kurallari sessizce yok sayiliyordu.
   -------------------------------------------------------------------------- */

.pa-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--pa-space-1);
    padding: 3px var(--pa-space-2);
    border-radius: var(--pa-radius-pill);
    font-size: var(--pa-text-xs);
    font-weight: var(--pa-weight-semibold);
    line-height: 1.4;
    white-space: nowrap;
}
.pa-garage-box-head .pa-badge { margin-left: auto; }
.pa-empty { color: var(--pa-muted); font-size: var(--pa-text-sm); }
.pa-empty-state {
    padding: var(--pa-space-10) var(--pa-space-5);
    text-align: center;
    color: var(--pa-muted);
}
.pa-empty-state i {
    display: block;
    margin-bottom: var(--pa-space-3);
    font-size: 34px;
    color: var(--pa-muted-2);
}
.pa-empty-state strong {
    display: block;
    margin-bottom: var(--pa-space-1);
    font-size: var(--pa-text-md);
    color: var(--pa-text);
}
.pa-empty-state p { margin: 0 auto var(--pa-space-4); max-width: 42ch; font-size: var(--pa-text-sm); }
.pa-form-grid { display: grid; gap: var(--pa-space-4); grid-template-columns: 1fr; }
    .pa-form-grid { grid-template-columns: 1fr 1fr; }
.pa-form-row { margin-bottom: var(--pa-space-4); }
.pa-form-row label {
    display: block;
    margin-bottom: var(--pa-space-1);
    font-size: var(--pa-text-sm);
    font-weight: var(--pa-weight-medium);
    color: var(--pa-text);
}
.pa-form-row textarea {
    width: 100%;
    min-height: var(--pa-tap);
    padding: var(--pa-space-2) var(--pa-space-3);
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-radius-md);
    background: var(--pa-surface);
    font-family: var(--pa-font);
    font-size: var(--pa-text-base);
    color: var(--pa-text);
}
.pa-form-row textarea { min-height: 80px; resize: vertical; }
.pa-form-row textarea:focus {
    outline: none;
    border-color: var(--pa-orange-600);
    box-shadow: 0 0 0 3px var(--pa-orange-050);
}
.pa-form-row small {
    display: block;
    margin-top: var(--pa-space-1);
    font-size: var(--pa-text-xs);
    color: var(--pa-muted);
}
.pa-form-row.has-error textarea { border-color: var(--pa-danger); }
.pa-small { font-size: var(--pa-text-sm); }
.pa-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--pa-border);
    border-radius: var(--pa-radius-md);
    background: var(--pa-surface);
}

/* --------------------------------------------------------------------------
   BAŞLIK EYLEMLERİ: YATAY, YAZI AĞIRLIKLI

   Önceden her eylem dikey bir kutuydu: simge üstte, yazı altta, ayrı
   çerçeve içinde. Dört kutu yan yana durunca başlık ağırlaşıyordu ve
   arama kutusuna kalan yer daralıyordu.

   Artık simge yazının yanında ve çerçeve yok. Hem daha az yer
   kaplıyor hem de göz doğrudan yazıya gidiyor.

   `app.css`'teki kural burada eziliyor; bu dosya en son yükleniyor.
   -------------------------------------------------------------------------- */
.pa-action {
    flex-direction: row;
    align-items: center;
    gap: var(--pa-space-2);
    max-width: none;
    padding: var(--pa-space-2) var(--pa-space-3);
    font-size: var(--pa-text-sm);
    font-weight: var(--pa-weight-medium);
    color: var(--pa-navy-800);
}
.pa-action i { font-size: 17px; color: var(--pa-muted); }
.pa-action:hover { background: var(--pa-orange-050); color: var(--pa-orange-700); }
.pa-action:hover i { color: var(--pa-orange-600); }

/* Araç seçiliyse iki satır: üstte etiket, altta araç adı */
.pa-action--vehicle span { display: flex; flex-direction: column; line-height: 1.25; }
.pa-action-sub { font-size: var(--pa-text-xs); color: var(--pa-muted); }
.pa-action--vehicle strong { font-size: var(--pa-text-sm); }

.pa-header-actions { gap: var(--pa-space-1); }

/* --------------------------------------------------------------------------
   K-03 · ADMIN KENAR MENÜSÜ OKUNMUYORDU

   Menü koyu lacivert zemin için tasarlanmış: yazı rengi #c9d9ec, logo
   beyaz sürüm. Ama zemin beyaz kalıyordu — kontrast 1.33:1, yazılar
   neredeyse görünmez, logo beyaz üstünde kayboluyordu.

   KÖK NEDEN: `<aside class="pa-sidebar offcanvas-lg">`. Bootstrap 5.3,
   992 px ve üzerinde `.offcanvas-lg` için
   `background-color: transparent !important` uyguluyor ve
   `.pa-sidebar { background: var(--pa-navy) }` kuralını eziyor.

   `!important` ancak `!important` ile yenilir; bu yüzden burada
   kullanılıyor. Normalde kaçınılması gereken bir şey.
   -------------------------------------------------------------------------- */
@media (min-width: 992px) {
    .pa-sidebar.offcanvas-lg {
        background: var(--pa-navy-900) !important;
        color: #fff;
    }
}

/* --------------------------------------------------------------------------
   O-09 · ÇİFT KAYDIRMA ÇUBUĞU

   Hem `.pa-sidebar` hem içindeki `.pa-sidebar-nav` kaydırılabilir
   olunca menünün sağında iki çubuk beliriyor ve öğeleri daraltıyordu.

   Kaydırma yalnızca nav'da kalsın: başlıktaki logo sabit duruyor,
   liste kayıyor. Zaten tasarlanan davranış buydu.
   -------------------------------------------------------------------------- */
.pa-sidebar { overflow: hidden; }

/* --------------------------------------------------------------------------
   Y-05 · KOYU YÜZEYDE GÖRÜNMEYEN BUTON

   Karşılaştırma tepsisi koyu lacivert; içinde ham Bootstrap
   `btn-outline-secondary` sınıfı kullanılmış. O sınıf koyu lacivert
   metin üretiyor — koyu üstünde koyu, kontrast 1.12:1.

   Ham Bootstrap buton sınıfları koyu yüzeylerde çalışmıyor; koyu blok
   içindeki bütün butonlar açık renge çevriliyor.
   -------------------------------------------------------------------------- */
.pa-compare-tray .btn,
.pa-compare-tray .pa-btn,
.pa-promo--dark .btn-outline-secondary {
    color: #fff;
    border-color: rgba(255, 255, 255, .35);
    background: transparent;
}
.pa-compare-tray .btn:hover,
.pa-compare-tray .pa-btn:hover,
.pa-promo--dark .btn-outline-secondary:hover {
    background: rgba(255, 255, 255, .12);
    border-color: rgba(255, 255, 255, .6);
    color: #fff;
}
/* Birincil eylem koyu zeminde de turuncu kalır */
.pa-compare-tray .pa-btn--primary,
.pa-compare-tray .pa-btn-primary {
    background: var(--pa-orange-600);
    border-color: var(--pa-orange-600);
}

/* --------------------------------------------------------------------------
   D-01 · PASİF BUTON TIKLANABİLİR GÖRÜNÜYOR

   Buton gerçekten `disabled` ama yalnızca soluklaştırılmış ve imleç
   hâlâ el işareti. Kullanıcı basıyor, hiçbir şey olmuyor, sebebini
   anlamıyor.
   -------------------------------------------------------------------------- */
.btn:disabled,
.pa-btn:disabled,
.btn.disabled,
.pa-btn.is-disabled { cursor: not-allowed; }

/* --------------------------------------------------------------------------
   D-03 · KÜÇÜK DOKUNMA HEDEFLERİ

   Altbilgi bağlantıları 18 px, grafik dönem düğmeleri 32 px. Mobilde
   alt sınır 44 px; mobil bu ürünün ana kullanım senaryosu (yol
   kenarında parça arayan kullanıcı).
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {
    .pa-footer a,
    .pa-footer-links a {
        display: inline-block;
        min-height: var(--pa-tap);
        line-height: var(--pa-tap);
    }

    .pa-range-buttons .btn,
    .pa-range-buttons button { min-height: var(--pa-tap); }
}