*{box-sizing:border-box}body{margin:0;background:#f3f5f9;color:#172033;font-family:"Segoe UI",Arial,sans-serif}.wrap{max-width:1900px;margin:auto;padding:22px}header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px}h1{margin:0;font-size:28px}header p{margin:6px 0;color:#667085}.actions{display:flex;gap:8px;flex-wrap:wrap}.btn{border:0;border-radius:9px;padding:11px 15px;background:#e4e7ec;color:#172033;text-decoration:none;cursor:pointer;font-weight:700}.btn.primary{background:#246bfd;color:#fff}.btn.danger{background:#fee4e2;color:#b42318}.cards{display:grid;grid-template-columns:repeat(6,minmax(160px,1fr));gap:12px;margin-bottom:14px}.cards article{background:#fff;border:1px solid #e7eaf0;border-radius:14px;padding:16px;box-shadow:0 4px 16px #1018280a}.cards small,.cards span{display:block;color:#667085}.cards strong{display:block;font-size:25px;margin:8px 0}.toolbar{background:#fff;padding:12px;border-radius:12px;display:flex;gap:9px;align-items:center;margin-bottom:12px;border:1px solid #e7eaf0}.toolbar input{flex:1;min-width:240px}.toolbar input,.toolbar select{padding:10px;border:1px solid #d0d5dd;border-radius:8px;background:#fff}.check{white-space:nowrap;color:#475467}.loading,.alert,.empty{background:#fff;padding:18px;border-radius:12px;margin:12px 0}.alert{color:#b42318}.tablebox{overflow:auto;background:#fff;border-radius:12px;border:1px solid #e7eaf0;max-height:68vh}table{border-collapse:collapse;width:100%;min-width:1750px}th,td{padding:11px;border-bottom:1px solid #eaecf0;text-align:right;white-space:nowrap;font-size:13px}th:nth-child(2),td:nth-child(2),th:nth-child(3),td:nth-child(3),th:last-child,td:last-child{text-align:left}th{background:#f8fafc;color:#475467;position:sticky;top:0;z-index:2;font-size:11px;text-transform:uppercase}tbody tr{cursor:pointer}tbody tr:hover{background:#f8fbff}td small{display:block;color:#98a2b3;margin-top:4px}.pill{padding:5px 9px;border-radius:99px;font-size:11px;font-weight:800}.pill.ok{background:#dcfae6;color:#067647}.pill.warning{background:#fff3cd;color:#9a6700}.pill.zero{background:#fef0c7;color:#b54708}.pill.error{background:#fee4e2;color:#b42318}.down{color:#d92d20;font-weight:800}.up{color:#079455;font-weight:800}.star{border:0;background:transparent;color:#cbd5e1;font-size:20px;cursor:pointer}.star.on{color:#f59e0b}.error-detail{display:block;max-width:280px;color:#b42318;white-space:normal;line-height:1.3}.foot{display:flex;justify-content:space-between;color:#667085;font-size:12px;padding:10px 2px}.overlay{position:fixed;inset:0;background:#10182880;opacity:0;pointer-events:none;transition:.2s;z-index:10}.overlay.show{opacity:1;pointer-events:auto}.drawer{position:fixed;right:-1100px;top:0;width:min(1050px,95vw);height:100vh;background:#f6f8fb;z-index:11;transition:.25s;overflow:auto;box-shadow:-10px 0 30px #10182833;padding:18px}.drawer.open{right:0}.drawer-head{display:flex;justify-content:space-between;align-items:center;position:sticky;top:-18px;background:#f6f8fb;padding:18px 0 12px;z-index:3}.drawer-head h2{margin:0}.drawer-head button{border:0;background:#fff;border-radius:50%;width:38px;height:38px;font-size:25px;cursor:pointer}.detail-card{background:#fff;border:1px solid #e7eaf0;border-radius:13px;padding:15px;margin-bottom:12px;overflow:auto}.detail-card h3{margin:0 0 12px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.mini{min-width:100%}.mini th,.mini td{font-size:12px;padding:8px}.mini th:first-child,.mini td:first-child{text-align:left}.mini th{position:static}.empty{text-align:center;padding:60px}@media(max-width:1100px){.cards{grid-template-columns:repeat(3,1fr)}.detail-grid{grid-template-columns:1fr}}@media(max-width:700px){.wrap{padding:10px}header{align-items:flex-start;flex-direction:column}.cards{grid-template-columns:1fr 1fr}.toolbar{align-items:stretch;flex-direction:column}.toolbar input{min-width:0}.foot{flex-direction:column;gap:5px}}

/* Tıklanabilir sütun sıralama */
th.sortable{cursor:pointer;user-select:none;transition:background .15s,color .15s}
th.sortable:hover{background:#eef4ff;color:#175cd3}
th.sortable.active-sort{background:#eaf2ff;color:#175cd3}
.sort-icon{display:inline-block;min-width:12px;margin-left:4px;font-size:12px;font-weight:900;vertical-align:middle}