:root{
  --wq-bg:#f4f7fb;
  --wq-surface:#ffffff;
  --wq-surface-2:#f8fafc;
  --wq-border:#e6ebf2;
  --wq-text:#172033;
  --wq-muted:#667085;
  --wq-primary:#3157d5;
  --wq-primary-dark:#2545b5;
  --wq-success:#16856a;
  --wq-warning:#c27a05;
  --wq-danger:#d14343;
  --wq-shadow:0 10px 30px rgba(20,33,61,.07);
  --wq-shadow-sm:0 4px 14px rgba(20,33,61,.05);
  --wq-radius:18px;
}

*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  background:var(--wq-bg);
}

body{
  margin:0 !important;
  min-height:100vh;
  background:
    radial-gradient(circle at top right, rgba(49,87,213,.07), transparent 28%),
    var(--wq-bg) !important;
  color:var(--wq-text) !important;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif !important;
  font-size:14px !important;
  line-height:1.5 !important;
  letter-spacing:0 !important;
}

/* SIDEBAR */
.side{
  width:272px !important;
  min-width:272px !important;
  background:linear-gradient(180deg,#111a2d 0%,#18243b 100%) !important;
  color:#fff !important;
  border-right:0 !important;
  box-shadow:12px 0 32px rgba(13,24,45,.10) !important;
  padding:20px 16px !important;
}

.side a{
  color:#d8dfed !important;
  text-decoration:none !important;
}

#warehouse-nav{
  display:flex !important;
  flex-direction:column !important;
  gap:5px !important;
}

#warehouse-nav a{
  display:flex !important;
  align-items:center !important;
  min-height:44px !important;
  padding:10px 13px !important;
  border-radius:11px !important;
  font-size:13px !important;
  font-weight:600 !important;
  color:#c8d1e2 !important;
  transition:.18s ease !important;
}

#warehouse-nav a:hover{
  background:rgba(255,255,255,.08) !important;
  color:#fff !important;
  transform:translateX(2px);
}

#warehouse-nav a.active,
#warehouse-nav a[aria-current="page"],
#warehouse-nav a[aria-current="location"]{
  background:linear-gradient(135deg,rgba(73,104,218,.95),rgba(49,87,213,.82)) !important;
  color:#fff !important;
  box-shadow:0 8px 20px rgba(49,87,213,.28) !important;
}

/* MAIN */
.main{
  min-width:0 !important;
  background:transparent !important;
  padding:30px 34px 70px !important;
}

main{
  min-width:0;
}

/* TYPOGRAPHY */
h1{
  margin:0 0 8px !important;
  font-size:clamp(30px,3vw,42px) !important;
  line-height:1.08 !important;
  font-weight:800 !important;
  letter-spacing:-1.1px !important;
  color:#101828 !important;
}

h2{
  margin:0 !important;
  font-size:21px !important;
  line-height:1.2 !important;
  font-weight:750 !important;
  letter-spacing:-.3px !important;
  color:#172033 !important;
}

h3{
  font-size:16px !important;
  font-weight:700 !important;
  color:#172033 !important;
}

p{
  color:var(--wq-muted);
}

/* GENERIC HEADER / HERO */
header,
.page-header,
.content-header,
.topbar,
.title-bar{
  border:0 !important;
  background:transparent !important;
}

header{
  margin-bottom:24px;
}

header p{
  margin:6px 0 0 !important;
  font-size:14px !important;
}

/* KPI AREA */
.kpis,
.kpi-grid,
.metrics,
.stats-grid{
  display:grid !important;
  grid-template-columns:repeat(6,minmax(0,1fr)) !important;
  gap:14px !important;
  margin:0 0 24px !important;
}

.kpi,
.kpi-card,
.metric-card,
.stat-card{
  min-height:128px !important;
  padding:18px 18px 16px !important;
  background:var(--wq-surface) !important;
  border:1px solid var(--wq-border) !important;
  border-radius:16px !important;
  box-shadow:var(--wq-shadow-sm) !important;
}

.kpi:hover,
.kpi-card:hover,
.metric-card:hover,
.stat-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--wq-shadow) !important;
}

.kpi .value,
.kpi-card .value,
.metric-card .value,
.stat-card .value,
.kpi strong,
.kpi-card strong{
  display:block !important;
  margin-top:8px !important;
  font-size:30px !important;
  line-height:1 !important;
  font-weight:800 !important;
  color:#111827 !important;
}

.kpi .label,
.kpi-card .label,
.metric-card .label,
.stat-card .label{
  color:#667085 !important;
  font-size:12px !important;
  font-weight:700 !important;
  text-transform:none !important;
}

/* PANELS / MODULES */
.panel,
.card,
.module,
.section-card,
.operation-card{
  background:var(--wq-surface) !important;
  border:1px solid var(--wq-border) !important;
  border-radius:var(--wq-radius) !important;
  box-shadow:var(--wq-shadow-sm) !important;
  margin-bottom:18px !important;
  padding:22px !important;
}

.panel > header,
.card > header,
.module > header,
.section-card > header{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:16px !important;
  margin:0 0 18px !important;
  padding:0 0 14px !important;
  border-bottom:1px solid #edf0f5 !important;
}

.panel > header h2,
.card > header h2,
.module > header h2{
  font-size:19px !important;
}

/* OPERATIONS */
.process,
.process-bar,
.operation-flow,
.workflow{
  background:#f7f9fc !important;
  border:1px solid #e9edf4 !important;
  border-radius:14px !important;
}

.process-bar{
  min-height:92px !important;
  padding:15px !important;
}

.process-bar strong,
.operation-flow strong{
  font-size:19px !important;
  font-weight:800 !important;
  color:#172033 !important;
}

/* FORMS */
input,
select,
textarea{
  width:100%;
  min-height:44px !important;
  padding:10px 12px !important;
  border:1px solid #d6dce7 !important;
  border-radius:10px !important;
  background:#fff !important;
  color:#172033 !important;
  font:inherit !important;
  font-size:14px !important;
  outline:none !important;
}

input:focus,
select:focus,
textarea:focus{
  border-color:#6d86df !important;
  box-shadow:0 0 0 3px rgba(49,87,213,.10) !important;
}

label{
  display:block !important;
  margin:0 0 6px !important;
  color:#344054 !important;
  font-size:12px !important;
  font-weight:700 !important;
}

/* BUTTONS */
button,
.btn,
.action-button{
  min-height:42px !important;
  padding:10px 15px !important;
  border-radius:10px !important;
  border:1px solid #d6dce7 !important;
  background:#fff !important;
  color:#24304a !important;
  font-size:13px !important;
  font-weight:700 !important;
  cursor:pointer !important;
  box-shadow:none !important;
  transition:.16s ease !important;
}

button:hover,
.btn:hover,
.action-button:hover{
  transform:translateY(-1px);
  border-color:#bcc7dc !important;
  box-shadow:0 6px 14px rgba(20,33,61,.07) !important;
}

button[type="submit"],
.btn-primary,
.primary,
.action-primary{
  background:linear-gradient(135deg,var(--wq-primary),var(--wq-primary-dark)) !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 7px 18px rgba(49,87,213,.22) !important;
}

/* TABLES */
table{
  width:100% !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
  overflow:hidden !important;
  background:#fff !important;
}

thead th{
  padding:12px 14px !important;
  background:#f7f9fc !important;
  border-bottom:1px solid #e6eaf1 !important;
  color:#667085 !important;
  font-size:11px !important;
  font-weight:800 !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
}

tbody td{
  padding:13px 14px !important;
  border-bottom:1px solid #eef1f5 !important;
  color:#344054 !important;
  font-size:13px !important;
}

tbody tr:hover td{
  background:#fafbfe !important;
}

/* STATUS */
.status,
.badge,
.chip,
.pill{
  display:inline-flex !important;
  align-items:center !important;
  min-height:28px !important;
  padding:4px 9px !important;
  border-radius:999px !important;
  font-size:11px !important;
  font-weight:800 !important;
}

/* COPILOT */
#copilot{
  background:
    linear-gradient(135deg,#111a2d 0%,#1d2b4b 100%) !important;
  border:0 !important;
  color:#fff !important;
  box-shadow:0 16px 35px rgba(17,26,45,.18) !important;
}

#copilot h2,
#copilot h3,
#copilot strong{
  color:#fff !important;
}

#copilot p,
#copilot small{
  color:#c8d1e2 !important;
}

/* ALERTS */
#uyarilar{
  border-left:4px solid var(--wq-warning) !important;
}

#aksiyonlar{
  background:linear-gradient(180deg,#fff,#fbfcff) !important;
}

/* LINKS */
a{
  color:var(--wq-primary);
}

a:hover{
  color:var(--wq-primary-dark);
}

/* MOBILE */
@media (max-width:1200px){
  .kpis,
  .kpi-grid,
  .metrics,
  .stats-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

@media (max-width:900px){
  .side{
    width:240px !important;
    min-width:240px !important;
  }

  .main{
    padding:24px 20px 70px !important;
  }

  .kpis,
  .kpi-grid,
  .metrics,
  .stats-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:640px){
  .side{
    width:100% !important;
    min-width:0 !important;
  }

  .main{
    padding:18px 14px 90px !important;
  }

  h1{
    font-size:30px !important;
  }

  .kpis,
  .kpi-grid,
  .metrics,
  .stats-grid{
    grid-template-columns:1fr 1fr !important;
  }

  .panel,
  .card,
  .module,
  .section-card,
  .operation-card{
    padding:16px !important;
    border-radius:14px !important;
  }
}