/* ===========================================================================
   PayStore modern layout kabuğu — koyu sol menü + beyaz header + açık içerik,
   turuncu vurgu. Responsive (mobilde off-canvas + hamburger).
   Bootstrap bileşenlerini (panel/tablo/form) DEĞİŞTİRMEZ; sadece kabuk + polish.
   header.php'de en son yüklenir (eski style.css kurallarını override eder).
   =========================================================================== */
:root{
  --accent:#f6821f;
  --accent-dark:#e0740f;
  --header-h:56px;
  --sidebar-w:240px;
  --sidebar-bg:#1e2530;
  --sidebar-bg2:#2a3342;
  --sidebar-text:#c2c8d0;
  --sidebar-muted:#828b99;
  --content-bg:#f4f6f8;
}

/* Body reset (app + login ortak header.php ile yüklenir) */
body{margin:0;padding-top:0 !important;padding-bottom:0 !important;background:var(--content-bg);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}
.container .form-signin{margin-top:64px;}  /* login: body padding kaldırıldı, üst boşluk ver */

/* ---------- Header ---------- */
.app-header{position:fixed;top:0;left:0;right:0;height:var(--header-h);z-index:1030;
  background:#fff;border-bottom:1px solid #e4e8ec;display:flex;align-items:center;
  padding:0 16px;box-shadow:0 1px 3px rgba(20,30,45,.05);}
.app-brand{font-size:19px;font-weight:700;color:#1d2733;text-decoration:none;letter-spacing:.3px;}
.app-brand:hover{color:#1d2733;text-decoration:none;}
.app-brand .app-brand-accent{color:var(--accent);}
.app-header-spacer{flex:1;}
.app-header-nav{display:flex;align-items:center;gap:2px;}
.app-header-nav a{color:#54606d;text-decoration:none;font-size:13.5px;font-weight:600;padding:8px 12px;border-radius:7px;white-space:nowrap;}
.app-header-nav a:hover{background:#f2f4f7;color:#1d2733;text-decoration:none;}
.app-header-nav a.app-logout{color:#c0392b;}
.app-header-nav a.app-logout:hover{background:#fdecea;}

/* Hamburger (mobilde görünür) */
.app-burger{display:none;background:none;border:0;width:40px;height:40px;margin-right:6px;cursor:pointer;
  border-radius:7px;flex-direction:column;justify-content:center;gap:5px;padding:0 9px;}
.app-burger:hover{background:#f2f4f7;}
.app-burger span{display:block;height:2px;background:#38434f;border-radius:2px;}

/* ---------- Sidebar ---------- */
.app-sidebar{position:fixed;top:var(--header-h);left:0;bottom:0;width:var(--sidebar-w);z-index:1025;
  background:var(--sidebar-bg);overflow-y:auto;overflow-x:hidden;transition:transform .22s ease;
  -webkit-overflow-scrolling:touch;display:flex;flex-direction:column;}
.app-menu{padding:8px 0 16px;flex:1;}
.app-menu-group{padding:15px 20px 6px;font-size:11px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--sidebar-muted);}
.app-menu-item{display:flex;align-items:center;gap:11px;padding:9px 18px;color:var(--sidebar-text);
  text-decoration:none;font-size:14px;border-left:3px solid transparent;transition:background .12s,color .12s;}
.app-menu-item:hover{background:var(--sidebar-bg2);color:#fff;text-decoration:none;}
.app-menu-item.active{background:var(--sidebar-bg2);color:#fff;border-left-color:var(--accent);font-weight:600;}
.app-menu-item span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.app-menu-item .icon{width:20px;height:20px;float:none;top:0;position:static;flex:0 0 20px;
  background-size:contain;background-repeat:no-repeat;background-position:center;opacity:.95;}
.app-sidebar-foot{padding:12px 20px;color:var(--sidebar-muted);font-size:11px;border-top:1px solid rgba(255,255,255,.06);}

/* ---------- Main içerik ---------- */
.app-main{margin-left:var(--sidebar-w);margin-top:var(--header-h);padding:22px 24px 60px;
  min-height:calc(100vh - var(--header-h));}

/* Backdrop (mobil menü açıkken) */
.app-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(15,20,28,.45);z-index:1024;
  opacity:0;visibility:hidden;transition:opacity .22s;}

/* pageTitle'ı normal akışa al (eski absolute yerleşimi + flash örtüşmesi düzelir) */
.pageTitle{position:static;width:auto;left:auto;top:auto;background:transparent;
  border-bottom:1px solid #e4e8ec;padding:0 0 12px;margin:0 0 20px;font-size:22px;font-weight:600;color:#1d2733;}
.pageTitle .icon{float:right;opacity:.9;}

/* ---------- Responsive: mobilde off-canvas ---------- */
@media (max-width:991px){
  .app-burger{display:flex;}
  .app-sidebar{transform:translateX(-100%);box-shadow:2px 0 18px rgba(0,0,0,.25);}
  .app.nav-open .app-sidebar{transform:translateX(0);}
  .app.nav-open .app-backdrop{opacity:1;visibility:visible;}
  .app-main{margin-left:0;padding:16px 14px 50px;}
}
