/* ============================================================================
   PttemKart Backoffice — Marka Teması (redesign)
   Mevcut Color Admin + Bootstrap 4 yapısının ÜZERİNE biner (yapı/ID'ler korunur,
   yalnızca görsel katman değişir). Navy #132d57 + Sarı #ffc72c + geometrik sans.
   ============================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');

:root {
    --pk-navy: #132d57;
    --pk-navy-700: #1b3a6e;
    --pk-navy-900: #0e2244;
    --pk-yellow: #ffc72c;
    --pk-yellow-600: #ebb728;
    --pk-blue: #3674d8;
    --pk-bg: #f4f5f7;
    --pk-card: #ffffff;
    --pk-border: #e5e7eb;
    --pk-grey: #666668;
    --pk-grey-200: #c8c8c8;
    --pk-text: #1f2937;
    --pk-radius: 12px;
    --pk-shadow: 0 1px 3px rgba(19,45,87,.06), 0 6px 20px rgba(19,45,87,.06);
    --pk-head: 'Outfit','Plus Jakarta Sans',sans-serif;
    --pk-body: 'Plus Jakarta Sans','Outfit',sans-serif;
}

/* ---------- Base ---------- */
body {
    font-family: var(--pk-body) !important;
    background: var(--pk-bg) !important;
    color: var(--pk-text);
    font-size: 13px;
}
h1,h2,h3,h4,h5,h6,.panel-title { font-family: var(--pk-head) !important; color: var(--pk-navy); font-weight: 700; }
a { color: var(--pk-blue); }
a:hover { color: var(--pk-navy); }
.page-header { color: var(--pk-navy); font-family: var(--pk-head); font-weight: 800; letter-spacing:-.02em; }

/* ---------- Sidebar (navy) ---------- */
.sidebar, .sidebar-bg { background: var(--pk-navy) !important; }
.page-sidebar-fixed .sidebar { box-shadow: inset -1px 0 0 rgba(255,255,255,.04); }
.sidebar .nav > li > a {
    color: rgba(255,255,255,.72) !important;
    font-family: var(--pk-head);
    font-weight: 500;
    border-radius: 10px;
    margin: 2px 12px;
    padding: 10px 14px;
    transition: all .15s ease;
}
.sidebar .nav > li > a:hover,
.sidebar .nav > li > a:focus { background: rgba(255,255,255,.07) !important; color:#fff !important; }
.sidebar .nav > li.active > a,
.sidebar .nav > li.active > a:hover {
    background: rgba(255,199,44,.14) !important;
    color: #fff !important;
    box-shadow: inset 3px 0 0 var(--pk-yellow);
}
.sidebar .nav > li > a i {
    color: var(--pk-yellow);
    background: transparent !important;
    width: 22px; text-align:center; margin-right: 6px;
}
.sidebar .nav > li > a .badge { background: var(--pk-yellow); color: var(--pk-navy); }
.sidebar .sub-menu { background: rgba(0,0,0,.15) !important; border-radius: 8px; margin: 0 12px 4px; }
.sidebar .sub-menu > li > a { color: rgba(255,255,255,.62) !important; padding: 8px 14px 8px 40px; font-weight:400; }
.sidebar .sub-menu > li > a:hover { color:#fff !important; }
.sidebar .nav-header { color: rgba(255,255,255,.4) !important; padding-left: 26px; }
.sidebar .caret { color: rgba(255,255,255,.5); }
/* sidebar brand/logo alanı */
.sidebar .pk-brand { padding: 20px 22px 14px; }
.sidebar .pk-brand img { height: 30px; }

/* ---------- Header / Topbar (beyaz) ---------- */
.header.navbar-default {
    background: #fff !important;
    border-bottom: 1px solid var(--pk-border);
    box-shadow: 0 1px 2px rgba(19,45,87,.04);
}
.header .navbar-brand { color: var(--pk-navy) !important; font-family: var(--pk-head); font-weight: 800; display:flex; align-items:center; gap:8px; }
.header .navbar-brand img { height: 30px; }
.header .navbar-nav > li > a,
.header .navbar-user > a { color: var(--pk-navy) !important; font-family: var(--pk-head); font-weight:600; }
.header .navbar-user .caret { color: var(--pk-grey); }

/* ---------- Paneller / Kartlar ---------- */
.panel, .panel-inverse {
    background: var(--pk-card) !important;
    border: 1px solid var(--pk-border) !important;
    border-radius: var(--pk-radius) !important;
    box-shadow: var(--pk-shadow);
    overflow: hidden;
}
.panel > .panel-heading, .panel-inverse > .panel-heading {
    background: #fff !important;
    color: var(--pk-navy) !important;
    border-bottom: 1px solid var(--pk-border) !important;
    padding: 16px 18px;
}
.panel-title { color: var(--pk-navy) !important; font-size: 15px; font-weight: 700; }
.panel-heading .btn.btn-icon.btn-circle { background: var(--pk-bg); color: var(--pk-grey); border:none; }
.panel-heading .btn.btn-icon.btn-circle:hover { background: var(--pk-navy); color:#fff; }
.panel-body { padding: 18px; }

/* ---------- Butonlar ---------- */
.btn { font-family: var(--pk-head); font-weight: 600; border-radius: 10px; }
.btn-primary, .btn-success {
    background: var(--pk-yellow) !important;
    border-color: var(--pk-yellow) !important;
    color: var(--pk-navy) !important;
    font-weight: 700;
    box-shadow: 0 4px 12px rgba(255,199,44,.25);
}
.btn-primary:hover, .btn-success:hover { background: var(--pk-yellow-600) !important; border-color: var(--pk-yellow-600) !important; color: var(--pk-navy) !important; }
.btn-default { background:#fff !important; border:1px solid var(--pk-border) !important; color: var(--pk-navy) !important; }
.btn-default:hover { background: var(--pk-bg) !important; }
.btn-inverse, .btn-dark { background: var(--pk-navy) !important; border-color: var(--pk-navy) !important; color:#fff !important; }

/* ---------- Formlar ---------- */
label { color: var(--pk-navy); font-weight: 600; font-size: 12.5px; }
.form-control, .input-sm {
    border: 1px solid var(--pk-border);
    border-radius: 10px;
    color: var(--pk-text);
    background: #fff;
    box-shadow: none;
}
.form-control:focus {
    border-color: var(--pk-yellow);
    box-shadow: 0 0 0 3px rgba(255,199,44,.25);
}
.input-group-text, .input-daterange .input-group-addon { background: var(--pk-bg); border:1px solid var(--pk-border); color: var(--pk-grey); }

/* ---------- Tablolar ---------- */
.table { color: var(--pk-text); }
.table thead th {
    background: #eef1f6;
    color: var(--pk-navy);
    font-family: var(--pk-head);
    font-weight: 700;
    border-bottom: 2px solid var(--pk-border) !important;
    border-top: none !important;
    text-transform: none;
    font-size: 12px;
}
.table td, .table th { border-color: var(--pk-border) !important; vertical-align: middle; }
.table.table-striped tbody tr:nth-of-type(odd) { background: #fbfcfd; }
.table tbody tr:hover { background: #f4f7fc; }

/* ---------- Rozetler (badge) ---------- */
.badge { border-radius: 999px; padding: .4em .7em; font-family: var(--pk-head); font-weight: 600; }
.badge.bg-green, .badge-success { background:#e6f6ec !important; color:#1a7f45 !important; }
.badge.bg-red, .badge-danger { background:#fdeaea !important; color:#c0392b !important; }
.badge.bg-warning, .badge-warning { background:#fff6e0 !important; color:#a9791b !important; }

/* ---------- Uyarılar ---------- */
.alert-warning { background:#fff6e0; border:1px solid #ffe6a8; color:#8a6410; border-radius: 10px; }

/* ---------- Footer / page-loader ---------- */
.footer { color: var(--pk-grey); }
#page-loader { background: var(--pk-navy); }

/* ============================================================================
   LOGIN (Layout=null) — .pk-login-* sınıfları
   ============================================================================ */
.pk-login-wrap {
    min-height: 100vh; display:flex; align-items:center; justify-content:center;
    background: radial-gradient(1200px 600px at 70% -10%, #1b3a6e 0%, var(--pk-navy) 45%, var(--pk-navy-900) 100%);
    padding: 24px; font-family: var(--pk-body);
}
.pk-login-card {
    width: 100%; max-width: 420px; background:#fff; border-radius: 18px;
    box-shadow: 0 24px 60px rgba(0,0,0,.35); padding: 36px 34px 28px;
    border-top: 4px solid var(--pk-yellow);
}
.pk-login-logo { text-align:center; margin-bottom: 18px; }
.pk-login-logo img { height: 34px; }
.pk-login-card h1 { font-family: var(--pk-head); font-size: 22px; font-weight: 800; color: var(--pk-navy); text-align:center; margin: 6px 0 2px; }
.pk-login-card .pk-sub { text-align:center; color: var(--pk-grey); font-size: 13px; margin-bottom: 22px; }
.pk-field { margin-bottom: 16px; }
.pk-field label { display:block; margin-bottom: 6px; }
.pk-field .form-control { padding: 12px 14px; height:auto; }
.pk-login-btn { width:100%; padding: 13px; border:none; border-radius: 10px; background: var(--pk-yellow); color: var(--pk-navy); font-family: var(--pk-head); font-weight: 800; font-size: 14px; box-shadow: 0 8px 20px rgba(255,199,44,.3); transition: all .15s; }
.pk-login-btn:hover { background: var(--pk-yellow-600); }
.pk-login-foot { text-align:center; margin-top: 18px; color: var(--pk-grey); font-size: 12px; }
.pk-login-foot a { color: var(--pk-blue); font-weight:600; }
.pk-forgot { display:flex; justify-content:flex-end; margin: -8px 0 14px; }
.pk-forgot a { color: var(--pk-blue); font-size: 12px; font-weight:600; }

/* ============================================================================
   DASHBOARD (Main) — KPI kartları / duyuru / hızlı işlem (placeholder)
   ============================================================================ */
.pk-welcome { margin-bottom: 20px; }
.pk-welcome h2 { font-family: var(--pk-head); font-weight:800; color: var(--pk-navy); font-size: 22px; margin:0; }
.pk-welcome p { color: var(--pk-grey); margin: 4px 0 0; }
.pk-kpi-grid { display:grid; grid-template-columns: repeat(4,1fr); gap: 16px; margin-bottom: 20px; }
@media (max-width: 991px){ .pk-kpi-grid{ grid-template-columns: repeat(2,1fr);} }
.pk-kpi {
    background:#fff; border:1px solid var(--pk-border); border-radius: var(--pk-radius);
    padding: 18px; box-shadow: var(--pk-shadow); position:relative;
}
.pk-kpi .pk-kpi-ic { width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(19,45,87,.06);color:var(--pk-navy);font-size:18px;margin-bottom:12px; }
.pk-kpi .pk-kpi-label { color: var(--pk-grey); font-size: 12px; font-weight:600; }
.pk-kpi .pk-kpi-val { font-family: var(--pk-head); font-weight:800; color: var(--pk-navy); font-size: 24px; margin-top:2px; }
.pk-kpi.pk-accent { background: var(--pk-navy); }
.pk-kpi.pk-accent .pk-kpi-val, .pk-kpi.pk-accent .pk-kpi-label { color:#fff; }
.pk-kpi.pk-accent .pk-kpi-ic { background: rgba(255,199,44,.2); color: var(--pk-yellow); }