:root{
  --atx-bg:#0b1220;
  --atx-bg2:#0f1b33;
  --atx-card:#0f1a2f;
  --atx-card2:#0d172a;
  --atx-line:rgba(255,255,255,.08);
  --atx-line2:rgba(255,255,255,.12);
  --atx-text:#e9eefc;
  --atx-muted:rgba(233,238,252,.72);
  --atx-dim:rgba(233,238,252,.55);
  --atx-soft:rgba(233,238,252,.14);
  --atx-shadow:0 18px 45px rgba(0,0,0,.42);
  --atx-shadow2:0 12px 28px rgba(0,0,0,.35);
  --atx-radius:18px;
  --atx-radius2:22px;
  --atx-gap:14px;
  --atx-gap2:18px;
  --atx-green:#34d399;
  --atx-yellow:#fbbf24;
  --atx-red:#fb7185;
  --atx-blue:#60a5fa;
  --atx-purple:#a78bfa;
  --atx-cyan:#22d3ee;
}

div:where(.swal2-container) .swal2-select,
div:where(.swal2-container) .swal2-select option {
  background-color: #0b1220;
  color: white;
}

/* Firefox */
html{
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.22) rgba(255,255,255,.06);
}

/* Chrome/Edge/Safari */
*::-webkit-scrollbar{
  width: 10px;
  height: 10px;
}

*::-webkit-scrollbar-track{
  background: rgba(255,255,255,.05);
  border-radius: 999px;
}

*::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, rgba(96,165,250,.55), rgba(167,139,250,.55));
  border-radius: 999px;
  border: 2px solid rgba(11,18,32,.85);
}

*::-webkit-scrollbar-thumb:hover{
  background: linear-gradient(180deg, rgba(96,165,250,.75), rgba(167,139,250,.75));
}

*::-webkit-scrollbar-corner{
  background: transparent;
}


*{ box-sizing:border-box; }
/* html,body{ height:100%; } */
body.atx-body{
  margin:0;
  font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background: radial-gradient(900px 700px at 18% 8%, rgba(96,165,250,.18), transparent 60%),
              radial-gradient(900px 700px at 88% 22%, rgba(167,139,250,.16), transparent 60%),
              radial-gradient(900px 700px at 70% 90%, rgba(34,211,238,.10), transparent 55%),
              var(--atx-bg);
  color:var(--atx-text);
}

.atx-shell{
  display:grid;
  grid-template-columns: 308px 1fr;
  min-height:100vh;
}

.atx-side{
  position: sticky;
  top: 0;
  height: 100vh;
  padding: 18px 14px;
  background: linear-gradient(180deg, rgba(15,27,51,.92), rgba(11,18,32,.92));
  border-right: 1px solid var(--atx-line);
  backdrop-filter: blur(10px);

  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.atx-nav{
  flex: 1 1 auto;
  overflow-y: auto;
  min-height: 0;
  padding-right: 6px;
}

/* istersen foot sabit kalsın */
.atx-sideFoot{
  flex: 0 0 auto;
}


.atx-sideTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}

.atx-brand{
  display:flex;
  align-items:center;
  gap:10px;
}
.atx-brandMark{
  width:30px;height:30px;
  box-shadow: var(--atx-shadow2);
}
.atx-brandName{ font-weight:900; letter-spacing:.2px; }
.atx-brandSub{ font-size:12px; color:var(--atx-muted); margin-top:2px; }

.atx-sideToggle{
  border:1px solid var(--atx-line);
  background: rgba(255,255,255,.04);
  color: var(--atx-text);
  border-radius:14px;
  padding:9px 10px;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:8px;
}
.atx-ico{ font-size:14px; opacity:.9; }
.atx-sideToggleText{ font-weight:800; font-size:12px; opacity:.9; }

.atx-nav{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:10px 6px;
}
.atx-navItem{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color: var(--atx-text);
  padding:10px 12px;
  border-radius:14px;
  border:1px solid transparent;
  background: transparent;
  transition: .18s ease;
}
.atx-navDot{
  width:10px;height:10px;border-radius:999px;
  background: rgba(255,255,255,.14);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
.atx-navLabel{ font-weight:800; font-size:13px; color:rgba(233,238,252,.88); }
.atx-navItem:hover{
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.08);
}
.atx-navItem.atx-navActive{
  background: linear-gradient(135deg, rgba(96,165,250,.16), rgba(167,139,250,.14));
  border-color: rgba(96,165,250,.26);
}
.atx-navItem.atx-navActive .atx-navDot{
  background: linear-gradient(135deg, var(--atx-blue), var(--atx-purple));
}

.atx-sideFoot{
  position:absolute;
  left:14px; right:14px;
  bottom:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.atx-miniCard{
  border:1px solid var(--atx-line);
  background: rgba(255,255,255,.04);
  border-radius: var(--atx-radius);
  padding:12px 12px;
}
.atx-miniTitle{ font-weight:900; font-size:12px; color:rgba(233,238,252,.92); }
.atx-miniText{ margin-top:6px; font-size:12px; color: rgba(255, 255, 255, 0.5); line-height:1.45; }
.atx-sideMeta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  border:1px solid var(--atx-line);
  background: rgba(255,255,255,.03);
  border-radius: 14px;
  padding:10px 12px;
}
.atx-sideMetaKey{ font-size:12px; color:var(--atx-muted); font-weight:800; }
.atx-sideMetaVal{ font-size:12px; color:rgba(233,238,252,.92); font-weight:900; }

.atx-main{
  padding:16px 18px 22px 18px;
}

.atx-topbar{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:14px 14px;
  border:1px solid var(--atx-line);
  border-radius: var(--atx-radius2);
  background: rgba(255,255,255,.03);
  backdrop-filter: blur(10px);
  box-shadow: var(--atx-shadow2);
}

.atx-pageTitle{ font-size:18px; font-weight:900; letter-spacing:.2px; }
.atx-pageSub{ margin-top:4px; font-size:12px; color:var(--atx-muted); font-weight:700; }

.atx-topRight{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.atx-pillGroup{
  display:flex;
  gap:10px;
  align-items:center;
}
.atx-pillBtn{
  display:flex;
  align-items:center;
  gap:10px;
  border-radius:16px;
  padding:10px 12px;
  border:1px solid var(--atx-line);
  background: rgba(255,255,255,.04);
  cursor:pointer;
}
.atx-pillKey{ font-size:12px; color:var(--atx-muted); font-weight:900; }
.atx-pillVal{ font-size:12px; color:rgba(233,238,252,.92); font-weight:900; }
.atx-pillPrimary{
  border-color: rgba(96,165,250,.28);
  background: linear-gradient(135deg, rgba(96,165,250,.16), rgba(167,139,250,.14));
}

.atx-searchWrap{
  display:flex;
  align-items:center;
  gap:8px;
  border-radius: 16px;
  padding:8px;
  border:1px solid var(--atx-line);
  background: rgba(0,0,0,.18);
}
.atx-search{
  width:260px;
  padding:10px 10px;
  border:0;
  outline:none;
  background: transparent;
  color: var(--atx-text);
  font-weight:800;
  font-size:12px;
}
.atx-search::placeholder{ color: rgba(233,238,252,.45); font-weight:800; }
.atx-searchBtn{
  border-radius: 14px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(233,238,252,.92);
  cursor:pointer;
  font-weight:900;
  font-size:12px;
}

.atx-userBtn{
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  border-radius: 16px;
  border:1px solid var(--atx-line);
  background: rgba(255,255,255,.04);
  cursor:pointer;
}
.atx-userAvatar{
  width:34px;height:34px;
  border-radius: 14px;
  display:grid; place-items:center;
  font-weight:900;
  background: rgba(96,165,250,.16);
  border:1px solid rgba(96,165,250,.20);
}
.atx-userText{ display:flex; flex-direction:column; align-items:flex-start; line-height:1.1; }
.atx-userName{ font-size:12px; font-weight:900; color: wheat;}
.atx-userRole{ font-size:11px; color:var(--atx-muted); font-weight:800; margin-top:2px; }

.panel-section .panel-title {
  display: flex;
  align-items: center;
  gap: 6px;
}

.panel-section{
  background:rgba(255,255,255,.02);
  border:1px solid var(--border);
  border-radius:var(--r2);
  padding:14px;
  box-shadow:var(--shadow);
  margin-top: 20px;
}

.panel-section + .panel-section{margin-top:14px}

.panel-title {
  text-decoration: none;
  color: white;
  opacity: 0.5;
  font-size: 0.8em;
  cursor: pointer;
  transition: all 1s ease;
}

.panel-title:hover {
  opacity: 1;
} 

.atx-content{ margin-top:14px; }
.atx-grid{ display:grid; gap: var(--atx-gap2); }
.atx-gridKpis{ grid-template-columns: repeat(6, 1fr); }
.atx-grid2{ grid-template-columns: 1.35fr 1fr; margin-top: 10px;}
.atx-grid3{ grid-template-columns: repeat(3, 1fr); margin-top: 10px; }
.atx-grid2tight{ grid-template-columns: 220px 1fr; gap:14px; }

.atx-card{
  border-radius: var(--atx-radius2);
  border:1px solid var(--atx-line);
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  box-shadow: var(--atx-shadow2);
  overflow:hidden;
}
.atx-cardHead{
  padding:14px 14px 0 14px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.atx-cardTitle{ font-size:13px; font-weight:900; }
.atx-cardSub{ font-size:12px; color:var(--atx-muted); margin-top:4px; font-weight:700; }
.atx-cardBody{ padding:12px 14px 14px 14px; height: calc(100% - 50px);}

.atx-chipRow{ display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.atx-chipBtn{
  border:1px solid var(--atx-line);
  background: rgba(255,255,255,.04);
  color: rgba(233,238,252,.92);
  border-radius: 999px;
  padding:8px 10px;
  cursor:pointer;
  font-weight:900;
  font-size:12px;
}
.atx-chipBtn:hover{ background: rgba(255,255,255,.06); }

.atx-btn{
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  color: rgba(233,238,252,.92);
  border-radius: 14px;
  padding:10px 12px;
  cursor:pointer;
  font-weight:900;
  font-size:12px;
}
.atx-btn:hover{ background: rgba(255,255,255,.07); }
.atx-linkBtn{
  border:0;
  background: transparent;
  color: rgba(96,165,250,.95);
  font-weight:900;
  cursor:pointer;
  font-size:12px;
  padding:8px 10px;
  border-radius: 12px;
}
.atx-linkBtn:hover{ background: rgba(96,165,250,.10); }

.atx-divider{
  height:1px;
  background: var(--atx-line);
  margin:12px 0;
}

.atx-chart{ min-height:260px; }
.atx-map{
  height: 560px;
  border-radius: 18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
}

.atx-kpi{
  border-radius: 20px;
  border:1px solid var(--atx-line);
  background: linear-gradient(135deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  padding:12px 12px;
  box-shadow: var(--atx-shadow2);
}
.atx-kpiTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.atx-kpiLabel{
  font-weight:900;
  font-size:12px;
  color: rgba(233,238,252,.78);
}
.atx-kpiBadge{
  font-weight:900;
  font-size:11px;
  padding:6px 10px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
}
.atx-kpiVal{
  margin-top:10px;
  font-weight:900;
  font-size:22px;
  letter-spacing:.2px;
}
.atx-kpiSub{
  margin-top:6px;
  font-size:12px;
  color: var(--atx-muted);
  font-weight:700;
}
.atx-bGood{ color: var(--atx-green); border-color: rgba(52,211,153,.28); background: rgba(52,211,153,.10); }
.atx-bWarn{ color: var(--atx-yellow); border-color: rgba(251,191,36,.30); background: rgba(251,191,36,.10); }
.atx-bBad{ color: var(--atx-red); border-color: rgba(251,113,133,.28); background: rgba(251,113,133,.10); }
.atx-bInfo{ color: var(--atx-blue); border-color: rgba(96,165,250,.28); background: rgba(96,165,250,.10); }

.atx-summaryText{
  font-size:13px;
  line-height:1.6;
  color: rgba(233,238,252,.86);
  font-weight:700;
}

.atx-tableWrap{
  border-radius: 18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.14);
}
.atx-table{
  width:100%;
  border-collapse: collapse;
  font-size:12px;
}
.atx-table thead th{
  text-align:left;
  padding:12px 12px;
  background: rgba(255,255,255,.04);
  color: rgba(233,238,252,.72);
  font-weight:900;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.atx-table tbody td{
  padding:12px 12px;
  border-bottom:1px solid rgba(255,255,255,.06);
  color: rgba(233,238,252,.88);
  font-weight:700;
}
.atx-table tbody tr:hover{ background: rgba(255,255,255,.03); }

.atx-tag{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius: 999px;
  font-size:12px;
  font-weight:900;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
}
.atx-tagDot{
  width:8px;height:8px;border-radius:999px;
  background: rgba(255,255,255,.24);
}
.atx-tagGood .atx-tagDot{ background: var(--atx-green); }
.atx-tagWarn .atx-tagDot{ background: var(--atx-yellow); }
.atx-tagBad .atx-tagDot{ background: var(--atx-red); }
.atx-tagInfo .atx-tagDot{ background: var(--atx-blue); }

.atx-storeList{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.atx-storeItem{
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  border-radius: 18px;
  padding:12px 12px;
  cursor:pointer;
  transition:.18s ease;
}
.atx-storeItem:hover{ background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.12); }
.atx-storeTop{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.atx-storeName{ font-weight:900; font-size:13px; }
.atx-storeCity{ margin-top:4px; font-size:12px; color: var(--atx-muted); font-weight:800; }
.atx-storeMeta{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:10px;
}
.atx-miniPill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 10px;
  border-radius: 999px;
  font-weight:900;
  font-size:11px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.14);
  color: rgba(233,238,252,.88);
}
.atx-miniPill strong{ font-weight:900; }
.atx-miniPill.atx-miniGood{ border-color: rgba(52,211,153,.26); background: rgba(52,211,153,.10); color: var(--atx-green); }
.atx-miniPill.atx-miniWarn{ border-color: rgba(251,191,36,.28); background: rgba(251,191,36,.10); color: var(--atx-yellow); }
.atx-miniPill.atx-miniBad{ border-color: rgba(251,113,133,.26); background: rgba(251,113,133,.10); color: var(--atx-red); }

.atx-compareHero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 12px;
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.16);
}
.atx-compareTitle{ font-size:13px; font-weight:900; }
.atx-compareSub{ font-size:12px; color: var(--atx-muted); margin-top:4px; font-weight:800; }
.atx-compareControls{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; justify-content:flex-end; }

.apexcharts-legend-group {
  flex-direction: row !important;
}

.atx-select{
  border:1px solid rgba(255,255,255,.12);
  /* background: rgba(255,255,255,.04); */
  /* color: rgba(233,238,252,.92); */
  background-color: #0b1220;
  color: white;
  border-radius: 14px;
  padding:10px 12px;
  font-weight:900;
  font-size:12px;
  outline:none;
}

.atx-compareCard{
  border-radius: 20px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  padding:12px 12px;
}
.atx-compareCardTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.atx-compareCardTitle{ font-weight:900; font-size:12px; color: rgba(233,238,252,.86); }
.atx-compareCardVal{ font-weight:900; font-size:18px; }
.atx-compareCardSub{ margin-top:6px; font-size:12px; color: var(--atx-muted); font-weight:800; }

.atx-cardMini{
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  padding:12px 12px;
}
.atx-cardMiniTitle{ font-weight:900; font-size:12px; }
.atx-cardMiniText{ margin-top:6px; font-size:12px; color: var(--atx-muted); font-weight:800; line-height:1.5; }

.atx-alertList{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.atx-alertItem{
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  padding:12px 12px;
  cursor:pointer;
}
.atx-alertItem:hover{ background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.12); }
.atx-alertTop{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.atx-alertTitle{ font-weight:900; font-size:13px; }
.atx-alertSub{ margin-top:4px; font-size:12px; color: var(--atx-muted); font-weight:800; }
.atx-alertBadges{ display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }

.atx-reportBox{
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(0,0,0,.14);
  padding:12px 12px;
}
.atx-reportRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 8px;
}
.atx-reportLabel{ font-weight:900; font-size:12px; color: rgba(233,238,252,.78); }
.atx-reportBtns{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.atx-reportPreview{
  border-radius: 18px;
  border:1px dashed rgba(255,255,255,.16);
  background: rgba(255,255,255,.03);
  padding:12px 12px;
  min-height: 360px;
}

.atx-tagCloud{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.atx-tagCloud .atx-tag{ cursor:pointer; }

.atx-metricBig{
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  padding:12px 12px;
  min-height: 260px;
}
.atx-metricBig .atx-mbTitle{ font-weight:900; font-size:12px; color: rgba(233,238,252,.78); }
.atx-metricBig .atx-mbVal{ margin-top:10px; font-weight:900; font-size:26px; }
.atx-metricBig .atx-mbSub{ margin-top:6px; font-size:12px; color: var(--atx-muted); font-weight:800; }
.atx-metricBig .atx-mbRow{ margin-top:12px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.atx-metricBig .atx-mbKey{ font-size:12px; color: var(--atx-muted); font-weight:900; }
.atx-metricBig .atx-mbNum{ font-size:12px; font-weight:900; }

.atx-jobList{ display:flex; flex-direction:column; gap:10px; }
.atx-jobItem{
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
  padding:12px 12px;
}
.atx-jobTitle{ font-weight:900; font-size:13px; }
.atx-jobMeta{ margin-top:6px; font-size:12px; color: var(--atx-muted); font-weight:800; display:flex; gap:10px; flex-wrap:wrap; }

.atx-footer{
  margin-top:16px;
  border:1px solid var(--atx-line);
  border-radius: var(--atx-radius2);
  background: rgba(255,255,255,.03);
  padding:14px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.atx-footerBrand{ font-weight:900; }
.atx-footerSub{ margin-top:4px; font-size:12px; color: var(--atx-muted); font-weight:800; }
.atx-footerRight{ display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.atx-footerLink{
  text-decoration:none;
  color: rgba(233,238,252,.86);
  font-size:12px;
  font-weight:900;
  padding:8px 10px;
  border-radius: 12px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.03);
}
.atx-footerLink:hover{ background: rgba(255,255,255,.05); }

.atx-route{ display:none; }
.atx-route.atx-routeActive{ display:block; }

@media (max-width: 1320px){
  .atx-gridKpis{ grid-template-columns: repeat(3, 1fr); }
  .atx-grid2{ grid-template-columns: 1fr; }
  .atx-grid3{ grid-template-columns: 1fr; }
  .atx-grid2tight{ grid-template-columns: 1fr; }
  .atx-search{ width:200px; }
}

@media (max-width: 980px){
  .atx-shell{ grid-template-columns: 1fr; }
  .atx-side{
    position:fixed;
    z-index:50;
    left:0; top:0;
    transform: translateX(-104%);
    transition: .22s ease;
    width: 320px;
  }
  .atx-side.atx-sideOpen{ transform: translateX(0); }
  .atx-main{ padding:12px 12px 18px 12px; }
  .atx-topbar{ flex-direction:column; align-items:stretch; }
  .atx-topRight{ justify-content:flex-start; }
  .atx-search{ width:100%; }
}

.atx-side{
  position: sticky;
  top: 0;
  height: 100dvh;
  padding: 18px 14px;
  background: linear-gradient(180deg, rgba(15,27,51,.92), rgba(11,18,32,.92));
  border-right: 1px solid var(--atx-line);
  backdrop-filter: blur(10px);

  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
}

.atx-nav{
  flex: 0 0 auto;
  overflow: visible;
  min-height: auto;
  padding-right: 6px;
}

.atx-sideFoot{
  position: static;
  left: auto;
  right: auto;
  bottom: auto;
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.atx-miniText a {
  text-decoration: none;
  color: wheat;
}
