/* ============================================================================
 *  Pınar Ticaret — Yönetim Paneli teması
 *
 *  Bootstrap 5.0.2'nin ÜZERİNE yüklenir (her panel sayfasında bootstrap.min.css
 *  sonrasında çağrılır), bu yüzden burada yazılanlar Bootstrap'i ezer.
 *  Amaç: daha yoğun/kompakt bir arayüz — varsayılan Bootstrap ölçüleri panelde
 *  gereğinden iri duruyordu. Hem masaüstü hem mobil için ölçeklenir.
 *
 *  Sayfalarda işaretleme değişikliği gerekmez; tüm panel sayfaları etkilenir.
 * ========================================================================== */

:root {
    --pnl-accent: #0d6efd;
    --pnl-ink: #0f172a;
    --pnl-muted: #64748b;
    --pnl-soft: #f1f5f9;
    --pnl-line: #e7eaf0;
    --pnl-bg: #f6f8fb;
    --pnl-radius: 12px;
    --pnl-shadow: 0 4px 16px rgba(2, 8, 23, .06);

    --pnl-font: 14px;          /* panel taban ölçüsü (Bootstrap 16px) */
}

/* ---------------------------------------------------------------- Taban */

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: var(--pnl-font);
    color: var(--pnl-ink);
    background: var(--pnl-bg) !important;
    -webkit-font-smoothing: antialiased;
}

/* ---------------------------------------------------------------- Yerleşim */

#wrapper {
    display: flex;
    flex-wrap: nowrap;
    min-height: 100vh;
}
#sidebar-wrapper {
    min-height: 100vh;
    width: 232px;
    flex-shrink: 0;
    transition: margin-left .25s ease;
}
#page-content-wrapper {
    flex: 1;
    /* min-width:0 olmadan flex öğesi içeriğinden dar olamaz; geniş tablolarda
       sayfanın tamamı yatay kayıyordu. Artık tablo kendi kabında kayar. */
    min-width: 0;
}
#wrapper.toggled #sidebar-wrapper { margin-left: -232px; }

/* Sayfa gövdesi: kenar boşlukları Bootstrap'ten daha derli toplu */
#page-content-wrapper > .container-fluid { padding: 18px 22px 32px; }
#page-content-wrapper > .container-fluid.mt-4 { margin-top: 0 !important; }

/* ---------------------------------------------------------------- Kenar çubuğu */

.sidebar-heading { padding: 18px 12px !important; }
.sidebar-heading img { max-height: 42px !important; }

#sidebar-wrapper .list-group-item {
    padding: 10px 18px;
    font-size: 13.5px;
    font-weight: 500;
    border: 0;
    border-radius: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: background .15s ease, color .15s ease;
}
#sidebar-wrapper .list-group-item i { font-size: 15px; opacity: .85; }
#sidebar-wrapper .list-group-item:hover,
#sidebar-wrapper .list-group-item:focus {
    background: rgba(255, 255, 255, .08) !important;
    color: #fff !important;
}
#sidebar-wrapper .list-group-item.aktif {
    background: rgba(255, 255, 255, .13) !important;
    box-shadow: inset 3px 0 0 var(--pnl-accent);
}

/* Üst çubuk */
#page-content-wrapper > .navbar { padding: 8px 18px; min-height: 48px; }
#page-content-wrapper > .navbar .text-uppercase { font-size: 12.5px; letter-spacing: .03em; }
#page-content-wrapper > .navbar .bi-person-circle { font-size: 1.05rem !important; }

/* ---------------------------------------------------------------- Tipografi */

h1, .h1 { font-size: 1.5rem; }
h2, .h2 { font-size: 1.3rem; }
h3, .h3 { font-size: 1.15rem; }
h4, .h4 { font-size: 1.05rem; font-weight: 600; }
h5, .h5 { font-size: .95rem; font-weight: 600; }
h6, .h6 { font-size: .82rem; font-weight: 600; }
small, .small { font-size: 12px; }
.text-muted { color: var(--pnl-muted) !important; }

/* ---------------------------------------------------------------- Kartlar */

.card {
    border: 1px solid var(--pnl-line);
    border-radius: var(--pnl-radius);
    box-shadow: var(--pnl-shadow);
}
.card-body { padding: 14px 16px; }
.card-title { font-size: 1rem; }

/* Özet/istatistik kartları: ikon ve değer ölçüsü küçültülür */
.card-body > .bi.fs-2 { font-size: 1.35rem !important; }
.card-body > h6 { font-size: .78rem; letter-spacing: .03em; text-transform: uppercase; opacity: .92; margin-bottom: 2px; }
.card-body > h4 { font-size: 1.25rem; font-weight: 700; margin-bottom: 0; }

/* Şifreyle açılan kartlar — kartın tamamı tıklanabilir (göz butonu yerine) */
.kart-gizli { cursor: pointer; transition: filter .15s ease, transform .15s ease; }
.kart-gizli:hover { filter: brightness(1.1); transform: translateY(-2px); }
.kart-gizli:focus-visible { outline: 3px solid rgba(255, 255, 255, .75); outline-offset: 2px; }

/* ---------------------------------------------------------------- Düğmeler */

.btn {
    font-size: 13.5px;
    font-weight: 600;
    padding: 7px 14px;
    border-radius: 9px;
    line-height: 1.35;
}
.btn-sm { font-size: 12.5px; padding: 5px 10px; border-radius: 8px; }
.btn-lg { font-size: 15px; padding: 10px 20px; border-radius: 11px; }
.btn i { font-size: 1em; }

/* ---------------------------------------------------------------- Formlar */

.form-label {
    font-size: 12.5px;
    font-weight: 600;
    color: #334155;
    margin-bottom: 4px;
}
.form-control, .form-select {
    font-size: 13.5px;
    padding: 7px 11px;
    border-radius: 9px;
    border-color: var(--pnl-line);
}
.form-control:focus, .form-select:focus {
    border-color: var(--pnl-accent);
    box-shadow: 0 0 0 3px rgba(13, 110, 253, .12);
}
.form-control-sm, .form-select-sm { font-size: 12.5px; padding: 5px 9px; }
.form-text { font-size: 11.5px; }
.input-group-text { font-size: 13.5px; padding: 7px 11px; background: var(--pnl-soft); border-color: var(--pnl-line); }
textarea.form-control { min-height: 70px; }

/* ---------------------------------------------------------------- Tablolar (Bootstrap .table)
   Not: yeni gelişmiş tablolar `table.tbl` + table.css kullanır. Buradaki
   kurallar henüz dönüştürülmemiş sayfalardaki .table'lar içindir. */

.table { font-size: 13.5px; margin-bottom: 0; }
.table > :not(caption) > * > * { padding: 9px 12px; }
.table > thead th {
    font-size: 11.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--pnl-muted);
    background: var(--pnl-soft);
    border-bottom-color: var(--pnl-line);
    white-space: nowrap;
}
.table-responsive { border-radius: var(--pnl-radius); }

/* ---------------------------------------------------------------- Rozet / uyarı / modal */

.badge { font-size: 11.5px; font-weight: 600; padding: .38em .62em; }

.alert {
    font-size: 13.5px;
    padding: 10px 14px;
    border-radius: var(--pnl-radius);
    border: 1px solid transparent;
}
.alert .btn-close { padding: 12px; }

.modal-content { border: 0; border-radius: 14px; }
.modal-header { padding: 13px 18px; border-bottom-color: var(--pnl-line); }
.modal-title { font-size: 1rem; font-weight: 600; }
.modal-body { padding: 16px 18px; }
.modal-footer { padding: 11px 18px; border-top-color: var(--pnl-line); }

.dropdown-menu { font-size: 13.5px; border-color: var(--pnl-line); border-radius: 10px; }
.nav-link { font-size: 13.5px; }
.nav-tabs .nav-link { padding: 7px 14px; }

/* ---------------------------------------------------------------- text-bg-* yardımcıları
   Panel Bootstrap 5.0.2 kullanıyor; bu sınıflar Bootstrap 5.2 ile geldi.
   Kartlar bu sınıfları kullandığı için tanımsız kalıp beyaz görünüyorlardı. */

.text-bg-primary   { color: #fff !important; background-color: #0d6efd !important; }
.text-bg-secondary { color: #fff !important; background-color: #6c757d !important; }
.text-bg-success   { color: #fff !important; background-color: #198754 !important; }
.text-bg-danger    { color: #fff !important; background-color: #dc3545 !important; }
.text-bg-warning   { color: #000 !important; background-color: #ffc107 !important; }
.text-bg-info      { color: #000 !important; background-color: #0dcaf0 !important; }
.text-bg-light     { color: #000 !important; background-color: #f8f9fa !important; }
.text-bg-dark      { color: #fff !important; background-color: #212529 !important; }

/* ---------------------------------------------------------------- Bildirimler (toast)
   Sağ üstte sabit katman. Sayfa akışına girmedikleri için içeriği itip
   kaldırmazlar — eski satır içi .alert bloklarının sorunu buydu. */

.bildirim-katmani {
    position: fixed;
    top: 14px;
    right: 14px;
    z-index: 1085;              /* modalların (1055) üzerinde */
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 360px;
    max-width: calc(100vw - 28px);
    pointer-events: none;       /* boşken altındaki içerik tıklanabilir kalsın */
}

.bildirim {
    pointer-events: auto;
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 11px;
    padding: 12px 34px 12px 13px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid var(--pnl-line);
    border-left: 4px solid var(--pnl-muted);
    box-shadow: 0 10px 30px rgba(2, 8, 23, .16);
    overflow: hidden;
    animation: bildirimGir .26s cubic-bezier(.21, 1.02, .73, 1);
}
.bildirim.gidiyor { animation: bildirimCik .25s ease forwards; }

@keyframes bildirimGir { from { opacity: 0; transform: translateX(24px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes bildirimCik { to { opacity: 0; transform: translateX(24px) scale(.98); } }

.bildirim-ikon   { font-size: 17px; line-height: 1.3; flex: none; }
.bildirim-govde  { min-width: 0; }
.bildirim-baslik { font-size: 12px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; margin-bottom: 1px; }
.bildirim-metin  { font-size: 13.5px; color: #334155; line-height: 1.45; word-break: break-word; }

.bildirim-kapat {
    position: absolute; top: 6px; right: 8px;
    background: none; border: 0; padding: 0 4px;
    font-size: 19px; line-height: 1; cursor: pointer;
    color: #94a3b8;
}
.bildirim-kapat:hover { color: #0f172a; }

/* Kalan süre çubuğu */
.bildirim-sure {
    position: absolute; left: 0; bottom: 0; height: 3px; width: 100%;
    transform-origin: left;
    animation: bildirimSure 5s linear forwards;
    opacity: .55;
}
.bildirim.duraklat .bildirim-sure { animation-play-state: paused; }
@keyframes bildirimSure { from { transform: scaleX(1); } to { transform: scaleX(0); } }

.bildirim-success { border-left-color: #16a34a; }
.bildirim-success .bildirim-ikon, .bildirim-success .bildirim-baslik { color: #16a34a; }
.bildirim-success .bildirim-sure { background: #16a34a; }

.bildirim-danger { border-left-color: #dc2626; }
.bildirim-danger .bildirim-ikon, .bildirim-danger .bildirim-baslik { color: #dc2626; }
.bildirim-danger .bildirim-sure { background: #dc2626; }

.bildirim-warning { border-left-color: #d97706; }
.bildirim-warning .bildirim-ikon, .bildirim-warning .bildirim-baslik { color: #d97706; }
.bildirim-warning .bildirim-sure { background: #d97706; }

.bildirim-info { border-left-color: #2563eb; }
.bildirim-info .bildirim-ikon, .bildirim-info .bildirim-baslik { color: #2563eb; }
.bildirim-info .bildirim-sure { background: #2563eb; }

@media (max-width: 575.98px) {
    .bildirim-katmani { top: 10px; right: 10px; left: 10px; width: auto; }
}

/* ---------------------------------------------------------------- Yazdırma */

@media print {
    #sidebar-wrapper, #page-content-wrapper > .navbar, .sayfa-dugme, .tbl-arac, .tbl-alt { display: none !important; }
    #page-content-wrapper > .container-fluid { padding: 0; }
}

/* ---------------------------------------------------------------- Tablet */

@media (max-width: 991.98px) {
    #page-content-wrapper > .container-fluid { padding: 14px 16px 28px; }
    .card-body { padding: 12px 14px; }
    .card-body > h4 { font-size: 1.1rem; }
}

/* ---------------------------------------------------------------- Mobil */

@media (max-width: 767.98px) {
    :root { --pnl-font: 13.5px; }

    /* Kenar çubuğu varsayılan gizli; #menu-toggle ile açılır */
    #sidebar-wrapper {
        margin-left: -232px;
        position: fixed;
        z-index: 1045;
        top: 0;
        bottom: 0;
        overflow-y: auto;
    }
    #wrapper.toggled #sidebar-wrapper {
        margin-left: 0;
        box-shadow: 0 0 40px rgba(2, 8, 23, .35);
    }

    #page-content-wrapper > .container-fluid { padding: 12px 12px 26px; }
    #page-content-wrapper > .navbar { padding: 6px 12px; }

    h4, .h4 { font-size: 1rem; }
    .card-body { padding: 12px; }
    .card-body > .bi.fs-2 { font-size: 1.2rem !important; }
    .card-body > h6 { font-size: .72rem; }
    .card-body > h4 { font-size: 1.02rem; }

    /* Kart ızgarası mobilde daha sıkı */
    .row.g-4 { --bs-gutter-x: .75rem; --bs-gutter-y: .75rem; }

    .btn { padding: 7px 12px; }
    .modal-dialog { margin: .5rem; }
    .modal-body { padding: 14px; }

    /* Tablolar mobilde yatay kayar; hücreler daralır */
    .table > :not(caption) > * > * { padding: 8px 10px; }
}

@media (max-width: 575.98px) {
    #page-content-wrapper > .container-fluid { padding: 10px 10px 24px; }
    .card-body > h4 { font-size: .95rem; }
}