/* =========================================================
   StorkHSE • Aksiyon — UI Kit v1.1 (Kurumsal Tema)
   Amaç: tek dosyadan tutarlı, ferah, okunaklı arayüz
   Not: Tasarım aynı — renk paleti ve okunurluk iyileştirildi.
   ========================================================= */

:root{
  /* Surface & Typography */
  --aks-bg: #f6f7fb;
  --aks-surface: #ffffff;
  --aks-surface-2: #f8fafc;
  --aks-text: #0f172a;
  --aks-muted: #64748b;

  /* Accent Palette (güncellendi) */
  --aks-primary: #4f46e5;      /* indigo */
  --aks-primary-600: #4338ca;
  --aks-accent: #06b6d4;       /* cyan */

  /* Radii */
  --aks-card-radius: 18px;
  --aks-btn-radius: 14px;

  /* Effects */
  --aks-shadow: 0 12px 30px rgba(2, 6, 23, .08);
  --aks-shadow-2: 0 10px 24px rgba(2, 6, 23, .12);
  --aks-border: rgba(15, 23, 42, .10);
  --aks-border-2: rgba(15, 23, 42, .14);
  --aks-ring: rgba(79, 70, 229, .18);

  /* Bootstrap uyum (CDN kullanımı için) */
  --bs-body-bg: var(--aks-bg);
  --bs-body-color: var(--aks-text);
  --bs-primary: var(--aks-primary);
  --bs-primary-rgb: 79,70,229;
}

/* Base */
html,body{height:100%}
body{
  background: var(--aks-bg) !important;
  color: var(--aks-text);
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji";
}

/* Auth page (login) */
body.aks-auth{
  background: radial-gradient(1200px 600px at 18% 12%, rgba(79,70,229,.30), transparent 55%),
              radial-gradient(900px 450px at 84% 18%, rgba(6,182,212,.18), transparent 60%),
              radial-gradient(900px 600px at 60% 88%, rgba(34,197,94,.12), transparent 55%),
              #0b1220 !important;
}

/* Navbar */
.navbar{
  position: sticky; top:0; z-index: 1030;
  backdrop-filter: blur(10px);
  box-shadow: 0 8px 18px rgba(2,6,23,.16);
}
.navbar.bg-dark{
  background: linear-gradient(90deg, #0b1220 0%, #141a2e 45%, #0b1220 100%) !important;
}
.navbar .navbar-brand{font-weight: 900; letter-spacing: .2px}
.navbar .btn{border-radius: 999px}

/* Containers */
.container{max-width: 1200px}

/* Cards */
.card{
  background: var(--aks-surface) !important;
  border: 1px solid rgba(15, 23, 42, .08) !important;
  border-radius: var(--aks-card-radius) !important;
  box-shadow: var(--aks-shadow) !important;
}

/* Buttons */
.btn{
  border-radius: var(--aks-btn-radius) !important;
  font-weight: 700;
}
.btn-primary{
  background: var(--aks-primary) !important;
  border-color: var(--aks-primary) !important;
}
.btn-primary:hover{background: var(--aks-primary-600) !important;border-color: var(--aks-primary-600) !important}

.btn-dark{
  background: var(--aks-primary) !important;
  border-color: var(--aks-primary) !important;
}
.btn-dark:hover{background: var(--aks-primary-600) !important;border-color: var(--aks-primary-600) !important}

/* Outline primary (daha canlı) */
.btn-outline-primary{
  border-color: rgba(79,70,229,.55) !important;
}
.btn-outline-primary:hover{
  background: rgba(79,70,229,.08) !important;
}

/* Outline buttons inside dark navbar (daha okunaklı) */
.navbar .btn-outline-dark,
.navbar .btn-outline-light{
  border-color: rgba(255,255,255,.28) !important;
  color: #fff !important;
}
.navbar .btn-outline-dark:hover,
.navbar .btn-outline-light:hover{
  background: rgba(255,255,255,.10) !important;
}

/* Forms */
.form-control, .form-select{
  border-radius: 12px !important;
  border-color: rgba(15,23,42,.14) !important;
}
.form-control:focus, .form-select:focus{
  border-color: rgba(79,70,229,.55) !important;
  box-shadow: 0 0 0 .25rem var(--aks-ring) !important;
}

/* Tables */
.table thead th{
  background: var(--aks-surface-2) !important;
  color: #334155 !important;
  font-weight: 800;
  border-bottom: 1px solid rgba(15,23,42,.10) !important;
}
.table tbody tr:hover{background: rgba(79,70,229,.05) !important}
.table td, .table th{vertical-align: middle}

/* Badges */
.badge{
  border-radius: 999px !important;
  font-weight: 800;
  padding: .45em .70em;
}

/* Alerts */
.alert{border-radius: 16px !important; border: 1px solid rgba(15,23,42,.08) !important}

/* Small helpers */
.text-muted{color: var(--aks-muted) !important}

/* KPI helpers (dashboard) */
.aks-kpi-card{position:relative; overflow:hidden}
.aks-kpi-card:before{
  content:"";
  position:absolute;
  right:-60px;
  top:-60px;
  width:180px;
  height:180px;
  background: radial-gradient(circle at 30% 30%, rgba(79,70,229,.18), transparent 60%),
              radial-gradient(circle at 70% 70%, rgba(6,182,212,.14), transparent 55%);
  transform: rotate(18deg);
  pointer-events:none;
}
.aks-kpi-label{font-size:12px; text-transform:uppercase; letter-spacing:.08em; color:var(--aks-muted); font-weight:800}
.aks-kpi-value{font-size:32px; font-weight:900; letter-spacing:-.6px; line-height:1.05}
.aks-kpi-icon{font-size:22px; opacity:.9}

/* Soft pills / panels */
.aks-soft-panel{
  background: rgba(79,70,229,.05);
  border: 1px solid rgba(79,70,229,.12);
  border-radius: 16px;
}
/* =====================================================
   AKS_UI_FINAL_V1 (Kurumsal okunurluk override)
   ===================================================== */
:root{
  --aks-bg:#f6f7fb;
  --aks-card:#ffffff;
  --aks-dark:#0b1220;
}
body{background:var(--aks-bg);}
.navbar.bg-dark{
  background: linear-gradient(90deg,#0b1220,#141a2e) !important;
}
.navbar .navbar-brand{font-weight:900;letter-spacing:.2px}
.navbar .btn-outline-light{
  border-color:rgba(255,255,255,.35)!important;
  color:#fff!important;
}
.navbar .btn-outline-light:hover{
  background:rgba(255,255,255,.12)!important;
}
.btn{border-radius:999px;font-weight:700}
.card{border-radius:16px}
.badge{border-radius:999px}
.table thead th{white-space:nowrap}
/* =====================================================
   AKS_UI_FINAL_V101 (Kurumsal okunurluk + buton standardı)
   ===================================================== */
:root{
  --aks-bg:#f6f7fb;
  --aks-card:#ffffff;
  --aks-dark:#0b1220;
  --aks-dark-2:#141a2e;
}
body{background:var(--aks-bg);}
.card{border-radius:16px}
.btn{border-radius:999px;font-weight:700}
.badge{border-radius:999px}
.navbar.bg-dark{
  background: linear-gradient(90deg,var(--aks-dark),var(--aks-dark-2)) !important;
}
.navbar .navbar-brand{font-weight:900;letter-spacing:.2px}
.navbar .btn-outline-light{
  border-color:rgba(255,255,255,.35)!important;
  color:#fff!important;
}
.navbar .btn-outline-light:hover{
  background:rgba(255,255,255,.12)!important;
}
.table thead th{white-space:nowrap}


/* =====================================================
   AKS_SIDEBAR_LAYOUT_V1.0 (Topbar + Sidebar Shell)
   - Tasarım aynı kalsın, panel hissi yükselsin.
   - Responsive: mobilde offcanvas, desktopta daraltılabilir.
   ===================================================== */

.aks-shell{
  display:flex;
  min-height:100vh;
}

/* Sidebar */
.aks-sidebar{
  width: 264px;
  background: linear-gradient(180deg, var(--aks-dark,#0b1220) 0%, var(--aks-dark-2,#141a2e) 100%);
  color:#fff;
  position: sticky;
  top:0;
  height:100vh;
  overflow-y:auto;
  overflow-x:hidden;
  box-shadow: 10px 0 26px rgba(2,6,23,.18);
  z-index: 1040;
}

.aks-side-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 14px 14px 10px 14px;
  border-bottom: 1px solid rgba(255,255,255,.10);
}

.aks-side-brand{
  display:flex;
  align-items:center;
  gap:10px;
  color:#fff;
  text-decoration:none;
  min-width:0;
}

.aks-side-logo{
  width:34px;height:34px;border-radius:12px;
  background: radial-gradient(circle at 30% 30%, rgba(79,70,229,.9), rgba(6,182,212,.65));
  display:flex;align-items:center;justify-content:center;
  font-weight:900;
  box-shadow: 0 10px 22px rgba(0,0,0,.25);
  flex:0 0 auto;
}

.aks-side-title{
  font-weight:900;
  letter-spacing:-.2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  opacity:.95;
}

.aks-side-toggle{
  border:1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.06);
  color:#fff;
  width:36px;height:36px;
  border-radius: 12px;
  display:flex;align-items:center;justify-content:center;
}
.aks-side-toggle:hover{background: rgba(255,255,255,.12);}

.aks-side-nav{
  padding: 10px;
  display:flex;
  flex-direction:column;
  gap: 6px;
}

.aks-side-link{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 10px 12px;
  border-radius: 14px;
  text-decoration:none;
  color: rgba(255,255,255,.88);
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.03);
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}

.aks-side-link i{font-size:18px; width:22px; text-align:center; opacity:.95}
.aks-side-label{font-weight:800; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}

.aks-side-link:hover{
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.12);
  transform: translateY(-1px);
  color:#fff;
}
.aks-side-link.active{
  background: rgba(79,70,229,.22);
  border-color: rgba(79,70,229,.35);
  color:#fff;
  box-shadow: 0 10px 22px rgba(2,6,23,.22);
}

.aks-side-footer{
  position: sticky;
  bottom:0;
  padding: 12px 12px 14px 12px;
  border-top: 1px solid rgba(255,255,255,.10);
  background: rgba(11,18,32,.72);
  backdrop-filter: blur(10px);
}

.aks-side-user-name{font-weight:900; font-size:13px; line-height:1.2}
.aks-side-user-role{font-size:12px; color: rgba(255,255,255,.70)}
.aks-side-actions{
  display:flex;
  gap:8px;
  margin-top:10px;
}
.aks-side-actions .btn{border-radius: 12px !important}

/* Main */
.aks-main{
  flex:1;
  min-width:0;
  background: var(--aks-bg);
}
.aks-topbar{
  position: sticky;
  top:0;
  z-index: 1030;
}
.aks-content{min-height: calc(100vh - 64px);}

/* Desktop collapsed */
body.aks-sidebar-collapsed .aks-sidebar{width: 86px}
body.aks-sidebar-collapsed .aks-side-title,
body.aks-sidebar-collapsed .aks-side-label,
body.aks-sidebar-collapsed .aks-side-user{display:none}
body.aks-sidebar-collapsed .aks-side-link{justify-content:center}
body.aks-sidebar-collapsed .aks-side-link i{width:auto}

/* Mobile: offcanvas */
@media (max-width: 991.98px){
  .aks-sidebar{
    position: fixed;
    left:0; top:0;
    transform: translateX(-110%);
    transition: transform .18s ease;
  }
  body.aks-sidebar-open .aks-sidebar{transform: translateX(0)}
  .aks-shell{display:block}
  .aks-main{padding-left:0}
  /* overlay */
  body.aks-sidebar-open:before{
    content:"";
    position: fixed;
    inset:0;
    background: rgba(2,6,23,.55);
    z-index:1035;
  }
  body.aks-sidebar-open .aks-sidebar{z-index:1040}
}
/* =====================================================
   ISG UI v2 — Sidebar grup etiketleri
   ===================================================== */
.aks-side-group-label {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.40);
  padding: 14px 14px 4px 14px;
}
.aks-side-nav .aks-side-group-label:first-child { padding-top: 8px; }