/* =========================================================
   GS SPORTİF PROJELER — Yönetim Paneli stili
   (Vitrin sitesiyle aynı marka dili: koyu gri zemin, altın/kırmızı vurgu)
   ========================================================= */
:root{
  --red:#c23b34; --red-dark:#8f2b26; --red-glow:rgba(194,59,52,.22);
  --black:#141416; --black-soft:#1a1a1c; --black-card:#202023; --black-elev:#28282c;
  --yellow:#dba84e; --yellow-soft:#e8bd72; --yellow-glow:rgba(219,168,78,.2);
  --white:#ececea; --muted:#9a9994; --border:rgba(255,255,255,.08);
  --ff-display:'Inter',sans-serif; --ff-body:'Inter',sans-serif;
  --ok:#4caf7a; --info:#5a8cdc; --warn:#dba84e;
}
*{box-sizing:border-box;}
body{margin:0; background:var(--black); color:var(--white); font-family:var(--ff-body);
  background-image:radial-gradient(circle at 0% 0%, rgba(194,59,52,.14), transparent 42%),
                    radial-gradient(circle at 100% 100%, rgba(219,168,78,.14), transparent 42%);
  background-attachment:fixed;}
h1,h2,h3,h4{font-family:var(--ff-display); font-weight:600; margin:0 0 .4em;}
a{color:inherit;}
::-webkit-scrollbar{width:8px;height:8px;}
::-webkit-scrollbar-thumb{background:var(--black-elev); border-radius:8px;}

/* ---------- Login ---------- */
.login-wrap{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;
  background-image:radial-gradient(circle at 80% 20%, rgba(219,168,78,.08), transparent 40%);}
.login-card{width:100%; max-width:420px; background:var(--black-card); border:1px solid var(--border); border-radius:10px;
  padding:40px 36px; box-shadow:0 20px 60px rgba(0,0,0,.5);}
.login-logo{display:flex; flex-direction:column; align-items:center; gap:10px; margin-bottom:28px;}
.login-logo .mark{width:76px;height:76px; object-fit:contain;}
.login-logo b{font-family:var(--ff-display); letter-spacing:.5px;}
.login-logo span{font-size:.72rem; color:var(--yellow); letter-spacing:2px; font-weight:600;}
.login-title{text-align:center; font-size:1.3rem; margin-bottom:4px; font-weight:500;}
.login-sub{text-align:center; color:var(--muted); font-size:.85rem; margin-bottom:28px;}
.form-group{margin-bottom:18px;}
.form-group label{display:block; font-size:.8rem; color:var(--muted); margin-bottom:6px; font-weight:600;}
.form-group input, .form-group select, .form-group textarea{
  width:100%; padding:12px 14px; border-radius:6px; border:1px solid var(--border);
  background:#0d0d0f; color:var(--white); font-family:var(--ff-body); font-size:.92rem; outline:none;}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus{border-color:var(--yellow); box-shadow:0 0 0 3px rgba(219,168,78,.12);}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 22px; border-radius:6px;
  font-weight:600; cursor:pointer; border:none; font-family:var(--ff-body); font-size:.88rem; transition:.2s;}
.btn-primary{background:var(--yellow); color:#161616;}
.btn-primary:hover{background:var(--yellow-soft);}
.btn-outline{background:transparent; border:1.5px solid var(--red); color:var(--white);}
.btn-outline:hover{background:var(--red);}
.btn-dark{background:var(--black-elev); color:var(--white); border:1px solid var(--border);}
.btn-dark:hover{border-color:var(--yellow); color:var(--yellow);}
.btn-danger{background:rgba(194,59,52,.15); color:#ff9891; border:1px solid rgba(194,59,52,.4);}
.btn-danger:hover{background:var(--red); color:#fff;}
.btn-block{width:100%;}
.btn-sm{padding:7px 14px; font-size:.76rem; border-radius:5px;}
.login-error{background:rgba(194,59,52,.15); border:1px solid var(--red); color:#ff9891; padding:12px 14px; border-radius:6px; font-size:.85rem; margin-bottom:16px; display:none;}
.login-hint{margin-top:22px; text-align:center; font-size:.76rem; color:var(--muted); border-top:1px solid var(--border); padding-top:16px;}
.login-hint code{background:var(--black-elev); padding:2px 6px; border-radius:4px; color:var(--yellow);}
.back-link{display:block; text-align:center; margin-top:18px; font-size:.82rem; color:var(--muted);}
.back-link:hover{color:var(--yellow);}

/* ---------- Layout ---------- */
.admin-layout{display:flex; min-height:100vh;}
.sidebar{width:260px; flex-shrink:0; background:var(--black-soft); border-right:1px solid var(--border);
  display:flex; flex-direction:column; position:sticky; top:0; height:100vh;}
.sidebar-brand{display:flex; align-items:center; gap:10px; padding:22px 20px; border-bottom:1px solid var(--border);}
.sidebar-brand .mark{width:44px;height:44px; object-fit:contain;}
.sidebar-brand b{font-family:var(--ff-display); font-size:.95rem; font-weight:600;}
.sidebar-brand span{display:block; font-size:.6rem; color:var(--yellow); letter-spacing:1.5px; font-weight:600;}
.sidebar-nav{flex:1; overflow-y:auto; padding:16px 12px;}
.sidebar-nav .group-label{font-size:.68rem; text-transform:uppercase; letter-spacing:1px; color:var(--muted); padding:14px 12px 6px;}
.nav-item{display:flex; align-items:center; gap:12px; padding:11px 14px; border-radius:6px; cursor:pointer;
  font-size:.87rem; font-weight:500; color:var(--muted); margin-bottom:2px; transition:.15s; border:1px solid transparent;}
.nav-item:hover{background:var(--black-elev); color:var(--white);}
.nav-item.active{background:rgba(219,168,78,.1); color:var(--yellow); border-color:rgba(219,168,78,.3);}
.nav-item .badge-count{margin-left:auto; background:var(--red); color:#fff; font-size:.68rem; padding:1px 7px; border-radius:999px; font-weight:700;}
.sidebar-foot{padding:16px; border-top:1px solid var(--border);}
.user-chip{display:flex; align-items:center; gap:10px; margin-bottom:12px;}
.user-chip .av{width:34px;height:34px;border-radius:50%; background:var(--black-elev); display:flex; align-items:center; justify-content:center; font-weight:700; color:var(--yellow); border:1px solid var(--border);}
.user-chip b{font-size:.82rem; display:block; font-weight:500;}
.user-chip span{font-size:.7rem; color:var(--muted);}

.main{flex:1; min-width:0;}
.topbar-admin{height:70px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between;
  padding:0 28px; position:sticky; top:0; background:rgba(20,20,22,.9); backdrop-filter:blur(10px); z-index:10;}
.topbar-admin h2{font-size:1.05rem; margin:0; font-weight:500;}
.topbar-admin .sub{font-size:.78rem; color:var(--muted); margin-top:2px;}
.topbar-right{display:flex; align-items:center; gap:14px;}
.pill-live{display:flex; align-items:center; gap:6px; background:rgba(76,175,122,.12); border:1px solid rgba(76,175,122,.35); color:var(--ok); font-size:.72rem; font-weight:600; padding:5px 12px; border-radius:999px;}
.pill-live .dot{width:7px;height:7px;border-radius:50%; background:var(--ok);}
.content{padding:28px;}
.section-page{display:none;}
.section-page.active{display:block;}

/* ---------- Stat cards ---------- */
.stat-row{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-bottom:26px;}
.stat-box{background:var(--black-card); border:1px solid var(--border); border-radius:8px; padding:20px; position:relative; overflow:hidden;}
.stat-box .ic{width:40px;height:40px;border-radius:8px; display:flex; align-items:center; justify-content:center; font-size:1.15rem; margin-bottom:14px;}
.stat-box.c1 .ic{background:rgba(194,59,52,.16); color:#e28a84;}
.stat-box.c2 .ic{background:rgba(219,168,78,.16); color:var(--yellow);}
.stat-box.c3 .ic{background:rgba(90,140,220,.16); color:#8fb4ea;}
.stat-box.c4 .ic{background:rgba(76,175,122,.16); color:#7fcf9f;}
.stat-box b{display:block; font-family:var(--ff-display); font-size:1.7rem; font-weight:500;}
.stat-box span{font-size:.78rem; color:var(--muted);}

/* ---------- Panel / card ---------- */
.panel{background:var(--black-card); border:1px solid var(--border); border-radius:8px; padding:24px; margin-bottom:22px;}
.panel-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; flex-wrap:wrap; gap:10px;}
.panel-head h3{margin:0; font-size:1rem; font-weight:500;}
.two-col{display:grid; grid-template-columns:1.4fr 1fr; gap:20px;}
@media(max-width:1000px){.two-col{grid-template-columns:1fr;} .stat-row{grid-template-columns:1fr 1fr;}}

/* ---------- Table ---------- */
.table-wrap{overflow-x:auto;}
table.data{width:100%; border-collapse:collapse; font-size:.87rem;}
table.data th{text-align:left; color:var(--muted); font-weight:600; padding:10px 12px; border-bottom:1px solid var(--border); font-size:.76rem; text-transform:uppercase; letter-spacing:.4px;}
table.data td{padding:12px; border-bottom:1px solid var(--border); vertical-align:middle;}
table.data tr:hover td{background:rgba(255,255,255,.02);}
.row-actions{display:flex; gap:6px;}
.icon-mini{width:30px;height:30px;border-radius:6px; border:1px solid var(--border); background:var(--black-elev); display:flex; align-items:center; justify-content:center; cursor:pointer; font-size:.85rem;}
.icon-mini:hover{border-color:var(--yellow); color:var(--yellow);}
.icon-mini.danger:hover{border-color:var(--red); color:#e28a84;}
.empty-state{text-align:center; padding:40px 20px; color:var(--muted); font-size:.88rem;}

.badge{padding:4px 11px; border-radius:999px; font-size:.7rem; font-weight:700; text-transform:uppercase; display:inline-block;}
.badge.hazirlaniyor, .badge.acik{background:rgba(219,168,78,.16); color:var(--yellow);}
.badge.kargoda, .badge.inceleniyor{background:rgba(90,140,220,.16); color:#8fb4ea;}
.badge.teslim, .badge.cozuldu{background:rgba(76,175,122,.16); color:#7fcf9f;}
.badge.role{background:rgba(194,59,52,.16); color:#e28a84;}
.badge.unread{background:rgba(194,59,52,.22); color:#eda19c;}
.badge.read{background:rgba(255,255,255,.08); color:var(--muted);}

/* ---------- Bars ---------- */
.bar-chart{display:flex; align-items:flex-end; gap:14px; height:170px; padding-top:10px;}
.bar-chart .bar-col{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; gap:8px;}
.bar-chart .bar{width:100%; border-radius:4px 4px 0 0; background:linear-gradient(180deg,var(--yellow),var(--red)); min-height:6px;}
.bar-chart .bar-label{font-size:.72rem; color:var(--muted); text-align:center;}
.bar-chart .bar-val{font-size:.78rem; font-weight:700; color:var(--yellow);}

/* ---------- Activity feed ---------- */
.activity-item{display:flex; gap:12px; padding:12px 0; border-bottom:1px solid var(--border); font-size:.85rem;}
.activity-item:last-child{border-bottom:none;}
.activity-dot{width:8px;height:8px;border-radius:50%; background:var(--yellow); margin-top:6px; flex-shrink:0;}
.activity-item .t{color:var(--muted); font-size:.72rem;}

/* ---------- Modal ---------- */
.modal-overlay{position:fixed; inset:0; background:rgba(0,0,0,.65); backdrop-filter:blur(3px); display:none; align-items:center; justify-content:center; z-index:1000; padding:20px;}
.modal-overlay.open{display:flex;}
.modal-box{background:var(--black-card); border:1px solid var(--border); border-radius:10px; padding:28px; width:100%; max-width:480px; max-height:90vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,.6);}
.modal-box h3{margin-bottom:18px; font-weight:500;}
.modal-close{float:right; cursor:pointer; color:var(--muted); font-size:1.2rem;}
.modal-close:hover{color:var(--yellow);}
.form-row2{display:grid; grid-template-columns:1fr 1fr; gap:14px;}

/* ---------- Sürükle-bırak görsel yükleme ---------- */
.image-dropzone{
  display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap;
  border:1.5px dashed var(--border); border-radius:8px; padding:22px 16px; text-align:center;
  transition:.15s; background:#0d0d0f;
}
.image-dropzone.dragover{border-color:var(--yellow); background:rgba(219,168,78,.08);}
.image-dropzone-text{font-size:.82rem; color:var(--muted);}

/* ---------- Ürün görsel önizleme ---------- */
.image-thumb-grid{display:flex; flex-wrap:wrap; gap:10px; margin-top:12px;}
.image-thumb{position:relative; width:64px; height:64px; border-radius:6px; overflow:hidden; border:1px solid var(--border);}
.image-thumb img{width:100%; height:100%; object-fit:cover; display:block;}
.image-thumb-remove{
  position:absolute; top:2px; right:2px; width:18px; height:18px; border-radius:50%;
  background:rgba(0,0,0,.7); color:#fff; font-size:.65rem; display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.image-thumb-remove:hover{background:var(--red);}

/* ---------- Toast ---------- */
.toast{position:fixed; bottom:24px; right:24px; background:var(--black-card); border:1px solid var(--yellow); color:var(--white);
  padding:14px 20px; border-radius:8px; font-size:.85rem; box-shadow:0 10px 30px rgba(0,0,0,.5); z-index:2000;
  display:flex; align-items:center; gap:10px; transform:translateY(20px); opacity:0; transition:.25s; pointer-events:none;}
.toast.show{transform:translateY(0); opacity:1;}

/* ---------- Toggle switch ---------- */
.switch{position:relative; display:inline-block; width:46px; height:26px;}
.switch input{opacity:0; width:0; height:0;}
.slider{position:absolute; cursor:pointer; inset:0; background:var(--black-elev); border:1px solid var(--border); border-radius:999px; transition:.2s;}
.slider::before{content:""; position:absolute; height:18px; width:18px; left:3px; bottom:3px; background:var(--muted); border-radius:50%; transition:.2s;}
input:checked + .slider{background:rgba(219,168,78,.22); border-color:var(--yellow);}
input:checked + .slider::before{transform:translateX(20px); background:var(--yellow);}

/* ---------- Mobile ---------- */
.menu-toggle{display:none;}
@media(max-width:960px){
  .sidebar{position:fixed; left:0; top:0; z-index:200; transform:translateX(-100%); transition:.25s;}
  .sidebar.open{transform:translateX(0);}
  .menu-toggle{display:flex;}
  .stat-row{grid-template-columns:1fr 1fr;}
}