/* ============================================================
   EC ADMIN PANEL — DESIGN TOKENS
   ============================================================ */
:root{

  --navy-soft:   #eef1fb;
  --ink:         #1c2333;
  --muted:       #6b7280;
  --line:        #e6e9f2;
  --bg:          #f3f5fb;
  --card:        #ffffff;

  --c-documents: #3350c9;
  --c-report:    #1f8a55;
  --c-gis:       #7a52a8;
  --c-upload:    #d97e1e;
  --c-parivesh:  #c22568;
  --c-file:      #12968a;

  --ok:          #1f8a55;
  --ok-tint:     #e5f5ec;
  --warn:        #d97e1e;
  --warn-tint:   #fdf1e2;
  --danger:      #d13b3b;
  --danger-tint: #fbe6e6;

  --radius:      14px;
  --radius-sm:   9px;
  --shadow:      0 2px 4px rgba(15,29,77,.04), 0 10px 24px -12px rgba(15,29,77,.12);
  --font-ui:     'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}



/* ================= APP SHELL ================= */
.admin-shell{ display:flex; min-height:100vh; }



/* ---------------- Main area ---------------- */
.admin-main{
  margin-left:264px;
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
}

/* ---------------- Topbar ---------------- */
.admin-topbar{
  background:#fff;
  border-bottom:1px solid var(--line);
  padding:.85rem 1.6rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  position:sticky; top:0; z-index:1020;
}
.admin-topbar .crumbs{ font-size:.78rem; color:var(--muted); }
.admin-topbar .crumbs b{ color:var(--ink); font-weight:700; }
.admin-topbar h1{ font-size:1.15rem; font-weight:800; margin:0; }
.topbar-search{
  background:var(--bg); border:1px solid var(--line); border-radius:10px;
  padding:.5rem .8rem; display:flex; align-items:center; gap:.5rem;
  font-size:.82rem; color:var(--muted); min-width:230px;
}
.topbar-search input{ border:none; background:transparent; outline:none; width:100%; font-size:.82rem; }
.icon-btn{
  width:38px;height:38px;border-radius:10px;border:1px solid var(--line);
  background:#fff; display:flex; align-items:center; justify-content:center;
  color:var(--muted); position:relative; cursor:pointer;
}
.icon-btn .dot{
  position:absolute; top:6px; right:7px; width:7px; height:7px; border-radius:50%;
  background:#d13b3b; border:1.5px solid #fff;
}
.avatar-chip{
  display:flex; align-items:center; gap:.6rem; cursor:pointer;
  padding:.3rem .5rem .3rem .3rem; border-radius:10px;
}
.avatar-chip:hover{ background:var(--bg); }
.avatar-chip .av{
  width:34px;height:34px;border-radius:50%;
  background:linear-gradient(135deg,#3350c9,#7a52a8);
  color:#fff; display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:.8rem;
}
.avatar-chip .nm{ font-size:.8rem; font-weight:700; line-height:1.1; }
.avatar-chip .rl{ font-size:.68rem; color:var(--muted); }

.admin-content{ padding:1.6rem; flex:1; }

/* ---------------- Stat cards ---------------- */
.stat-card{
  background:var(--card); border:1px solid var(--line); border-radius:16px;
  padding:1.2rem 1.3rem; box-shadow:var(--shadow); height:100%;
}
.stat-card .top-row{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.7rem; }
.stat-card .ic{
  width:40px;height:40px;border-radius:11px;
  display:flex;align-items:center;justify-content:center;font-size:1.05rem;color:#fff;
}
.stat-card .trend{ font-size:.72rem; font-weight:800; padding:.2rem .5rem; border-radius:999px; }
.stat-card .trend.up{ background:var(--ok-tint); color:var(--ok); }
.stat-card .trend.down{ background:var(--danger-tint); color:var(--danger); }
.stat-card .value{ font-size:1.65rem; font-weight:800; line-height:1; margin-bottom:.2rem; }
.stat-card .lbl{ font-size:.8rem; color:var(--muted); font-weight:600; }

/* ---------------- Panel / card ---------------- */
.admin-panel{
  background:var(--card); border:1px solid var(--line); border-radius:16px;
  box-shadow:var(--shadow); overflow:hidden;
}
.admin-panel .panel-head{
  padding:1.1rem 1.4rem; border-bottom:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between;
}
.admin-panel .panel-head h5{ font-size:19px; font-weight:800; margin:0; }
.admin-panel .panel-head .sub{ font-size:14px; color:var(--muted); margin:0; }
.panel-link{ font-size:15px; font-weight:700; color:var(--c-documents); }

/* ---------------- Data table ---------------- */
.table-admin{ margin:0; }
.table-admin thead th{
  background:var(--bg); color:var(--muted);
  font-size:.68rem; text-transform:uppercase; letter-spacing:.06em; font-weight:800;
  border:none; padding:.75rem 1.1rem; white-space:nowrap;
}
.table-admin tbody td{
  padding:.75rem 1.1rem; font-size:.84rem; vertical-align:middle;
  border-color:var(--line);
}
.table-admin tbody tr:hover{ background:#fafbff; }
.doc-name{ font-weight:700; color:var(--ink); }
.doc-hint{ font-size:.72rem; color:var(--muted); }
.row-mod-dot{
  width:8px;height:8px;border-radius:50%;display:inline-block;margin-right:.5rem;flex-shrink:0;
}

.badge-status{
  font-size:.68rem; font-weight:800; letter-spacing:.02em;
  padding:.28rem .6rem; border-radius:999px; text-transform:uppercase;
  display:inline-flex; align-items:center; gap:.35rem;
}
.badge-status.pending{ background:var(--warn-tint); color:var(--warn); }
.badge-status.uploaded{ background:#e8ecfb; color:var(--c-documents); }
.badge-status.approved{ background:var(--ok-tint); color:var(--ok); }
.badge-status.rejected{ background:var(--danger-tint); color:var(--danger); }

.row-action-btn{
  border:1px solid var(--line); background:#fff; color:var(--muted);
  width:32px;height:32px;border-radius:8px; display:inline-flex; align-items:center; justify-content:center;
  font-size:.85rem;
}
.row-action-btn:hover{ border-color:var(--c-documents); color:var(--c-documents); }

/* ---------------- Folder tabs (inside category pages) ---------------- */
.admin-tabs{ display:flex; gap:.4rem; flex-wrap:wrap; margin-bottom:1.2rem; }
.admin-tab{
  border:1px solid var(--line); background:#fff; border-radius:10px;
  padding:.55rem .9rem; font-size:.82rem; font-weight:700; color:var(--muted);
  cursor:pointer; display:flex; align-items:center; gap:.5rem;
}
.admin-tab .badge-num{
  width:22px;height:22px;border-radius:50%; color:#fff; font-size:.7rem; font-weight:800;
  display:flex;align-items:center;justify-content:center;
}
.admin-tab.active{ border-color:var(--tab-color); color:var(--ink); background:var(--tab-tint); }
.admin-tab .cnt{ font-size:.7rem; color:var(--muted); font-weight:700; }

/* ---------------- Mini stepper (compact process flow) ---------------- */
.mini-stepper{ display:flex; align-items:flex-start; overflow-x:auto; padding:.2rem 0; }
.mini-step{ display:flex; flex-direction:column; align-items:center; min-width:110px; text-align:center; cursor:pointer; }
.mini-step .c{
  width:34px;height:34px;border-radius:50%; background:var(--bg); border:2px solid var(--line);
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.82rem;color:var(--navy-2);
  margin-bottom:.4rem;
}
.mini-step.done .c{ background:var(--ok); border-color:var(--ok); color:#fff; }
.mini-step.current .c{ background:var(--navy-2); border-color:var(--navy-2); color:#fff; box-shadow:0 0 0 4px rgba(23,39,95,.14); }
.mini-step .t{ font-size:.72rem; font-weight:700; }
.mini-connector{ flex:1; height:2px; background:var(--line); margin-top:17px; min-width:16px; }
.mini-connector.done{ background:var(--ok); }

/* ---------------- Progress bar ---------------- */
.progress-slim{ height:6px; border-radius:999px; background:var(--line); overflow:hidden; }
.progress-slim .bar{ height:100%; border-radius:999px; }

/* ---------------- Filters row ---------------- */
.filter-bar{ display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; }
.filter-select{
  border:1px solid var(--line); border-radius:8px; padding:.4rem .7rem; font-size:.8rem;
  background:#fff; color:var(--ink);
}