/* WeldMark Pro — Global Styles */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#080808;--p1:#101010;--p2:#181818;--p3:#222;
  --b1:#252525;--b2:#333;
  --orange:#ff6b1a;--amber:#ffb800;--green:#22c55e;--blue:#3b9eff;--red:#ef4444;--purple:#a855f7;
  --text:#e0e0e0;--m1:#666;--m2:#888;
  --fh:'Rajdhani',sans-serif;--fm:'JetBrains Mono',monospace;
  --radius:6px;
}
html,body{height:100%;background:var(--bg);color:var(--text);font-family:var(--fm);font-size:13px}
a{color:var(--orange);text-decoration:none}
a:hover{color:var(--amber)}
input,select,textarea{background:var(--p2);border:1px solid var(--b1);border-radius:4px;padding:9px 12px;font-family:var(--fm);font-size:12px;color:var(--text);outline:none;transition:border-color .15s;width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--orange)}
input::placeholder,textarea::placeholder{color:#333}
select option{background:var(--p2)}
textarea{resize:vertical}
label{font-size:9px;color:var(--m1);letter-spacing:2px;text-transform:uppercase;display:block;margin-bottom:5px}
.fg{margin-bottom:14px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}

/* Buttons */
.btn{font-family:var(--fh);font-size:13px;font-weight:600;letter-spacing:1px;text-transform:uppercase;padding:9px 18px;border:1px solid var(--b1);border-radius:4px;background:var(--p2);color:var(--text);cursor:pointer;transition:all .15s;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.btn:hover{border-color:var(--orange);color:var(--orange)}
.btn-primary{background:var(--orange);color:#000;border-color:var(--orange)}
.btn-primary:hover{background:#e05500;border-color:#e05500;color:#000}
.btn-danger{background:var(--red);color:#fff;border-color:var(--red)}
.btn-danger:hover{background:#c00;border-color:#c00;color:#fff}
.btn-sm{font-size:11px;padding:5px 10px;letter-spacing:.5px}
.btn-icon{padding:6px 8px}

/* Cards */
.card{background:var(--p1);border:1px solid var(--b1);border-radius:var(--radius);padding:20px}
.card-title{font-family:var(--fh);font-size:15px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--orange);margin-bottom:16px}

/* Table */
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th{font-family:var(--fh);font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--m1);padding:10px 12px;text-align:left;border-bottom:1px solid var(--b1);background:var(--p2)}
td{padding:10px 12px;border-bottom:1px solid #141414;font-size:12px;vertical-align:middle}
tr:last-child td{border-bottom:none}
tr:hover td{background:rgba(255,255,255,.02)}

/* Badges */
.badge{font-family:var(--fh);font-size:9px;font-weight:700;padding:3px 8px;border-radius:100px;text-transform:uppercase;letter-spacing:.5px;display:inline-block}
.badge-pending{background:#2a2000;color:var(--amber)}
.badge-progress{background:#001830;color:var(--blue)}
.badge-done{background:#001a08;color:var(--green)}
.badge-superadmin{background:#2a0040;color:var(--purple)}
.badge-admin{background:#1a0f00;color:var(--orange)}
.badge-user{background:#1a1a1a;color:var(--m2)}
.badge-active{background:#001a08;color:var(--green)}
.badge-blocked{background:#1a0000;color:var(--red)}

/* Alert */
.alert{padding:10px 14px;border-radius:4px;font-size:12px;margin-bottom:12px;line-height:1.6}
.alert-err{background:#1a0000;border:1px solid var(--red);color:var(--red)}
.alert-ok{background:#001a08;border:1px solid var(--green);color:var(--green)}
.alert-info{background:#001830;border:1px solid var(--blue);color:var(--blue)}

/* Layout */
.page-wrap{display:flex;min-height:100vh}
.sidebar{width:240px;min-width:240px;background:var(--p1);border-right:1px solid var(--b1);display:flex;flex-direction:column}
.sidebar-head{padding:18px 16px 14px;border-bottom:1px solid var(--b1)}
.logo{font-family:var(--fh);font-size:20px;font-weight:700;letter-spacing:2px;color:var(--orange)}
.logo b{color:var(--text)}
.logo-sub{font-size:8px;color:var(--m1);letter-spacing:3px;text-transform:uppercase;margin-top:2px}
.sidebar-nav{flex:1;padding:10px 8px;display:flex;flex-direction:column;gap:2px}
.nav-label{font-size:9px;color:var(--m1);letter-spacing:2px;text-transform:uppercase;padding:10px 8px 4px;font-family:var(--fh);font-weight:600}
.nav-link{font-family:var(--fh);font-size:13px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;padding:9px 12px;border-radius:4px;color:var(--m2);display:flex;align-items:center;gap:8px;transition:all .15s;cursor:pointer;border:none;background:none;width:100%;text-align:left;text-decoration:none}
.nav-link:hover{background:var(--p2);color:var(--text)}
.nav-link.active{background:rgba(255,107,26,.12);color:var(--orange)}
.nav-link svg{width:14px;height:14px;flex-shrink:0}
.sidebar-foot{padding:12px;border-top:1px solid var(--b1)}
.user-block{font-size:11px;color:var(--m1);padding:8px;background:var(--p2);border-radius:4px;display:flex;align-items:center;gap:8px}
.user-block strong{color:var(--text);font-size:12px;display:block}
.main{flex:1;overflow:auto;display:flex;flex-direction:column}
.topbar{padding:12px 24px;border-bottom:1px solid var(--b1);background:var(--p1);display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;top:0;z-index:10}
.page-title{font-family:var(--fh);font-size:18px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--text)}
.content{padding:24px;flex:1}

/* Modal */
.modal-ov{position:fixed;inset:0;background:rgba(0,0,0,.75);display:flex;align-items:center;justify-content:center;z-index:1000;opacity:0;pointer-events:none;transition:opacity .2s}
.modal-ov.open{opacity:1;pointer-events:all}
.modal{background:var(--p1);border:1px solid var(--b2);border-radius:8px;width:480px;max-width:95vw;box-shadow:0 32px 80px rgba(0,0,0,.9);transform:scale(.95);transition:transform .2s}
.modal-ov.open .modal{transform:scale(1)}
.modal-head{padding:16px 20px;border-bottom:1px solid var(--b1);display:flex;align-items:center;justify-content:space-between}
.modal-title{font-family:var(--fh);font-size:15px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--orange)}
.modal-close{background:none;border:none;color:var(--m1);cursor:pointer;font-size:18px;padding:2px 6px;border-radius:3px;line-height:1}
.modal-close:hover{color:var(--red)}
.modal-body{padding:20px;max-height:70vh;overflow-y:auto}
.modal-foot{padding:14px 20px;border-top:1px solid var(--b1);display:flex;gap:8px;justify-content:flex-end}

/* Status select */
.ssel{display:flex;gap:5px}
.sopt{flex:1;text-align:center;font-family:var(--fh);font-size:10px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;padding:8px;border-radius:4px;border:1px solid var(--b1);cursor:pointer;transition:all .15s;background:var(--p2);color:var(--m1)}
.sopt.active[data-v=pending]{background:#2a2000;border-color:var(--amber);color:var(--amber)}
.sopt.active[data-v=progress]{background:#001830;border-color:var(--blue);color:var(--blue)}
.sopt.active[data-v=done]{background:#001a08;border-color:var(--green);color:var(--green)}

/* Login */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg);padding:20px}
.login-box{width:100%;max-width:380px}
.login-logo{font-family:var(--fh);font-size:30px;font-weight:700;letter-spacing:2px;color:var(--orange);margin-bottom:2px}
.login-logo b{color:var(--text)}
.login-sub{font-size:9px;color:var(--m1);letter-spacing:3px;text-transform:uppercase;margin-bottom:28px}

/* Item search */
.item-search{display:flex;gap:8px;margin-bottom:20px}
.item-search input{flex:1;font-size:14px;padding:11px 14px;letter-spacing:1px}
.item-search .btn{font-size:13px}

/* Stats row */
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}
.stat-card{background:var(--p1);border:1px solid var(--b1);border-radius:var(--radius);padding:14px;text-align:center}
.stat-val{font-family:var(--fh);font-size:26px;font-weight:700;line-height:1}
.stat-lbl{font-size:9px;color:var(--m1);letter-spacing:1px;text-transform:uppercase;margin-top:2px}

/* Factory badge */
.factory-tag{background:rgba(168,85,247,.12);border:1px solid rgba(168,85,247,.3);color:var(--purple);padding:2px 8px;border-radius:3px;font-size:10px;font-family:var(--fh);font-weight:600;letter-spacing:.5px}

/* Toggle */
.toggle{position:relative;display:inline-block;width:38px;height:20px;cursor:pointer}
.toggle input{opacity:0;width:0;height:0}
.toggle-slider{position:absolute;inset:0;background:#333;border-radius:20px;transition:.2s}
.toggle-slider:before{content:'';position:absolute;height:14px;width:14px;left:3px;bottom:3px;background:#888;border-radius:50%;transition:.2s}
.toggle input:checked + .toggle-slider{background:var(--green)}
.toggle input:checked + .toggle-slider:before{transform:translateX(18px);background:#fff}

/* Tabs */
.tabs{display:flex;border-bottom:1px solid var(--b1);margin-bottom:20px}
.tab{font-family:var(--fh);font-size:12px;font-weight:600;letter-spacing:1px;text-transform:uppercase;padding:10px 16px;cursor:pointer;color:var(--m1);border-bottom:2px solid transparent;transition:all .15s;background:none;border-top:none;border-left:none;border-right:none}
.tab.active{color:var(--orange);border-bottom-color:var(--orange)}

/* ── MOBILE ADMIN RESPONSIVE ── */
@media (max-width: 700px) {
  body { font-size: 13px; }
  
  /* Table: horizontal scroll */
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  table { min-width: 500px; }
  th, td { padding: 8px 10px; font-size: 11px; white-space: nowrap; }
  
  /* Content padding */
  .content { padding: 12px; }
  
  /* Cards */
  .card { border-radius: 6px; margin-bottom: 12px; }
  
  /* Stats row - wrap on mobile */
  .stats-row { flex-wrap: wrap; gap: 8px; }
  .stats-card { min-width: calc(50% - 8px); flex: 1; }
  
  /* Buttons */
  .btn { font-size: 11px; padding: 6px 12px; }
  .btn-sm { font-size: 10px; padding: 4px 8px; }
  
  /* Action bar */
  .action-bar { flex-wrap: wrap; }
  .si { width: 100% !important; box-sizing: border-box; }
  
  /* Modal full-width on mobile */
  .modal { width: calc(100vw - 20px) !important; max-height: 90vh; }
  .modal-body { max-height: 60vh; }
  
  /* Topbar */
  .topbar { padding: 8px 10px; }
  .topbar-right .btn { font-size: 10px; padding: 5px 8px; }
  
  /* Hide some table columns on very small screens */
  .col-hide-mob { display: none; }
}