/* ═══════════════════════════════════════════════════════════
   CEM Knowledge Management Portal — Portal Styles
   ═══════════════════════════════════════════════════════════ */

/* ─── Reset & Base ─────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;scroll-behavior:smooth}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:#1f2937;background:#f3f4f6;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:#B3261E;text-decoration:none}
a:hover{color:#8B1A13}
img{max-width:100%;height:auto}
button{cursor:pointer;font-family:inherit}
input,select,textarea{font-family:inherit;font-size:inherit}

/* ─── CSS Variables ────────────────────────────────────── */
:root{
  --primary:#B3261E;--primary-dark:#8B1A13;--primary-light:#fef2f2;
  --success:#059669;--success-light:#ecfdf5;
  --warning:#d97706;--warning-light:#fffbeb;
  --info:#0284c7;--info-light:#f0f9ff;
  --danger:#dc2626;--danger-light:#fef2f2;
  --gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;
  --gray-300:#d1d5db;--gray-400:#9ca3af;--gray-500:#6b7280;
  --gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2937;--gray-900:#111827;
  --sidebar-width:260px;--sidebar-collapsed:72px;
  --topbar-height:64px;--radius:8px;--radius-lg:12px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.05);
  --shadow:0 1px 3px rgba(0,0,0,.1),0 1px 2px rgba(0,0,0,.06);
  --shadow-md:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);
  --shadow-lg:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);
}

/* ─── Login Page — Split-Screen ────────────────────────── */
.login-body{
  min-height:100vh;display:flex;background:#f3f4f6;overflow:hidden;
}
.login-split{
  display:flex;width:100%;min-height:100vh;
}

/* Left Hero Panel (70%) */
.login-hero{
  flex:0 0 70%;position:relative;overflow:hidden;
  background:linear-gradient(135deg,#B3261E 0%,#1A1A1A 100%);
  display:flex;align-items:center;justify-content:center;
}
.login-hero-bg{
  position:absolute;inset:0;
  background-image:
    radial-gradient(ellipse at 20% 50%, rgba(255,255,255,.06) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 20%, rgba(255,255,255,.04) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 80%, rgba(255,255,255,.03) 0%, transparent 50%);
}
.login-hero-content{
  position:relative;z-index:2;max-width:560px;padding:60px 40px;width:100%;
}
.login-hero-brand{
  text-align:center;margin-bottom:32px;
}
.login-hero-brand h1{
  font-size:28px;font-weight:700;color:#fff;letter-spacing:-.5px;line-height:1.2;
}
.login-hero-brand p{
  font-size:13px;color:rgba(255,255,255,.6);letter-spacing:.3px;
}
.login-hero-text{margin-bottom:40px}
.login-hero-text h2{
  font-size:36px;font-weight:700;color:#fff;line-height:1.2;margin-bottom:16px;
  letter-spacing:-.5px;
}
.login-hero-text p{
  font-size:16px;color:rgba(255,255,255,.7);line-height:1.7;max-width:420px;
}

.login-hero-features{
  display:grid;grid-template-columns:1fr 1fr;gap:16px;
}
.lhf-item{
  display:flex;align-items:center;gap:12px;
  padding:14px 16px;border-radius:10px;
  background:rgba(255,255,255,.08);backdrop-filter:blur(4px);
  color:rgba(255,255,255,.9);font-size:14px;font-weight:500;
  transition:background .2s;
}
.lhf-item:hover{background:rgba(255,255,255,.14)}
.lhf-item svg{flex-shrink:0}

.login-hero-footer{
  position:absolute;bottom:24px;left:40px;z-index:2;
}
.login-hero-footer p{font-size:12px;color:rgba(255,255,255,.35)}

/* Decorative Shapes */
.login-hero-shapes{
  position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;
}
.floating-icons{position:absolute;top:0;left:0;right:0;bottom:0;overflow:hidden;z-index:1}
.floating-icon{position:absolute;color:rgba(255,255,255,.08);animation:float 6s ease-in-out infinite}
.floating-icon:nth-child(1){top:10%;left:10%;font-size:3rem;animation-delay:0s}
.floating-icon:nth-child(2){top:20%;right:15%;font-size:2.5rem;animation-delay:1s}
.floating-icon:nth-child(3){bottom:30%;left:20%;font-size:4rem;animation-delay:2s}
.floating-icon:nth-child(4){bottom:15%;right:10%;font-size:3.5rem;animation-delay:3s}
@keyframes float{
  0%,100%{transform:translateY(0px) rotate(0deg)}
  25%{transform:translateY(-10px) rotate(2deg)}
  50%{transform:translateY(-20px) rotate(0deg)}
  75%{transform:translateY(-10px) rotate(-2deg)}
}
.hero-logo{width:100%;max-width:700px;height:auto;display:block;margin:0 auto}
.hero-logo-wrapper{
  display:inline-block;background:#fff;border-radius:12px;
  padding:18px 36px;box-shadow:0 4px 24px rgba(0,0,0,.2);
  animation:logoEntrance .8s cubic-bezier(.16,1,.3,1) forwards;
  opacity:0;transform:translateY(24px);
}
@keyframes logoEntrance{
  to{opacity:1;transform:translateY(0)}
}
.card-logo{width:48px;height:auto;flex-shrink:0}
.shape{
  position:absolute;border-radius:50%;opacity:.1;
}
.shape-1{
  width:500px;height:500px;background:radial-gradient(circle,#ef4444,transparent 70%);
  top:-120px;right:-80px;animation:shapeFloat1 12s ease-in-out infinite;
}
.shape-2{
  width:300px;height:300px;background:radial-gradient(circle,#dc2626,transparent 70%);
  bottom:-60px;left:-60px;animation:shapeFloat2 10s ease-in-out infinite;
}
.shape-3{
  width:180px;height:180px;background:radial-gradient(circle,#b91c1c,transparent 70%);
  top:40%;right:10%;animation:shapeFloat3 8s ease-in-out infinite;
}
.shape-4{
  width:120px;height:120px;background:radial-gradient(circle,#991b1b,transparent 70%);
  bottom:30%;left:15%;animation:shapeFloat4 14s ease-in-out infinite;
}
@keyframes shapeFloat1{
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(20px,-30px) scale(1.05)}
}
@keyframes shapeFloat2{
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(-15px,20px) scale(1.08)}
}
@keyframes shapeFloat3{
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(10px,15px) scale(1.1)}
}
@keyframes shapeFloat4{
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(-10px,-10px) scale(1.06)}
}

/* ─── Right Login Panel (30%) ──────────────────────── */
.login-panel{
  flex:0 0 30%;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#f8f9fb 0%,#ffffff 100%);padding:40px;
  position:relative;overflow:hidden;
}
.login-panel::before{
  content:'';position:absolute;top:-50%;right:-30%;width:500px;height:500px;
  background:radial-gradient(circle,rgba(179,38,30,.04) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.login-panel::after{
  content:'';position:absolute;bottom:-30%;left:-20%;width:300px;height:300px;
  background:radial-gradient(circle,rgba(26,26,26,.03) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.login-card{
  width:100%;max-width:400px;position:relative;z-index:1;
  animation:cardSlideIn .6s cubic-bezier(.16,1,.3,1) forwards;
  opacity:0;transform:translateY(24px);
}
@keyframes cardSlideIn{to{opacity:1;transform:translateY(0)}}

/* ─── Login Card Brand ───────────────────────────── */
.login-card-brand{
  display:flex;align-items:center;gap:14px;margin-bottom:28px;
  padding-bottom:24px;border-bottom:1px solid #f1f5f9;
}
.login-card-brand svg{flex-shrink:0}
.login-card-brand strong{
  display:block;font-size:17px;font-weight:700;color:#111827;line-height:1.3;
}
.login-card-brand span{
  display:block;font-size:13px;color:#6b7280;margin-top:3px;
}

/* ─── Login Form ─────────────────────────────────── */
.login-form .form-group{margin-bottom:22px}
.login-form label{
  display:block;font-size:13px;font-weight:600;color:#374151;margin-bottom:7px;
  transition:color .2s;
}
.login-form .form-group:focus-within label{color:#B3261E}

.input-wrapper{
  position:relative;display:flex;align-items:center;gap:10px;
  border:1.5px solid #d1d5db;border-radius:10px;
  transition:border-color .25s,box-shadow .25s,background .25s,transform .2s;
  background:#f9fafb;padding:0 14px;
}
.input-wrapper:hover{border-color:#9ca3af;background:#fff}
.input-wrapper:focus-within{
  border-color:#B3261E;background:#fff;
  box-shadow:0 0 0 4px rgba(179,38,30,.1);
  transform:translateY(-1px);
}
.input-icon{
  flex-shrink:0;color:#9ca3af;display:flex;line-height:0;
  pointer-events:none;transition:color .3s,transform .3s;
}
.input-wrapper:focus-within .input-icon{
  color:#B3261E;transform:scale(1.08);
}
.input-wrapper input{
  flex:1;min-width:0;display:block;
  padding:14px 0;border:none;background:transparent;
  outline:none;font-size:14px;color:#1f2937;line-height:1.4;
}
.input-wrapper input::placeholder{color:#9ca3af}
.toggle-password{
  flex-shrink:0;background:none;border:none;padding:6px;
  color:#9ca3af;display:flex;border-radius:6px;transition:color .2s,background .2s;
  line-height:0;cursor:pointer;
}
.toggle-password:hover{color:#4b5563;background:#f3f4f6}

/* Autofill override */
.input-wrapper input:-webkit-autofill,
.input-wrapper input:-webkit-autofill:hover,
.input-wrapper input:-webkit-autofill:focus{
  -webkit-box-shadow:0 0 0 1000px #f9fafb inset!important;
  -webkit-text-fill-color:#1f2937!important;
}

/* ─── Form Actions Row ──────────────────────────── */
.form-row-actions{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:18px;margin-top:-4px;
}

/* Custom checkbox */
.checkbox-custom{
  display:inline-flex;align-items:center;gap:8px;
  cursor:pointer;font-size:13px;color:#6b7280;user-select:none;
  position:relative;transition:color .2s;
}
.checkbox-custom:hover{color:#374151}
.checkbox-custom input[type="checkbox"]{
  position:absolute;opacity:0;width:0;height:0;
}
.checkbox-check{
  width:18px;height:18px;border:2px solid #d1d5db;border-radius:5px;
  display:flex;align-items:center;justify-content:center;
  transition:all .2s;flex-shrink:0;
}
.checkbox-custom:hover .checkbox-check{border-color:#B3261E}
.checkbox-custom input:checked + .checkbox-check{
  background:#B3261E;border-color:#B3261E;
}
.checkbox-check::after{
  content:'';width:5px;height:9px;border:solid #fff;
  border-width:0 2px 2px 0;transform:rotate(45deg);
  opacity:0;transition:opacity .15s;margin-top:-1px;
}
.checkbox-custom input:checked + .checkbox-check::after{opacity:1}

/* Forgot password link */
.forgot-link{
  font-size:13px;font-weight:500;color:#B3261E;
  transition:color .2s;
}
.forgot-link:hover{color:#8B1A13;text-decoration:underline}

/* ─── Shake Animation ───────────────────────────── */
@keyframes shake{
  0%,100%{transform:translateX(0)}
  10%,30%,50%,70%,90%{transform:translateX(-4px)}
  20%,40%,60%,80%{transform:translateX(4px)}
}
.login-form.shake{animation:shake .5s ease}

/* ─── Login Progress Bar ────────────────────────── */
.login-progress{
  height:3px;background:#f1f5f9;border-radius:3px;margin-bottom:6px;
  overflow:hidden;opacity:0;transition:opacity .3s;
}
.login-progress.active{opacity:1}
.login-progress-bar{
  height:100%;width:0%;background:linear-gradient(90deg,#B3261E,#1A1A1A);
  border-radius:3px;transition:width .3s ease;
}

/* ─── Sign In Button ────────────────────────────── */
#loginBtn{
  position:relative;overflow:hidden;
  margin-top:2px;padding:14px 20px;border-radius:10px;font-size:15px;font-weight:600;
  background:linear-gradient(135deg,#B3261E,#1A1A1A);
  box-shadow:0 4px 14px rgba(179,38,30,.25);
  transition:all .25s;letter-spacing:.3px;
}
#loginBtn:hover{
  background:linear-gradient(135deg,#8B1A13,#000000);
  box-shadow:0 6px 24px rgba(179,38,30,.4);
  transform:translateY(-2px);
}
#loginBtn:active{transform:translateY(0);box-shadow:0 2px 8px rgba(179,38,30,.2)}
#loginBtn:disabled{
  opacity:.7;transform:none;
  box-shadow:0 2px 8px rgba(179,38,30,.15);
}
.btn-ripple{
  position:absolute;border-radius:50%;
  background:rgba(255,255,255,.35);pointer-events:none;
  transform:scale(0);
}

.login-card-footer{
  text-align:center;margin-top:28px;
  color:#9ca3af;font-size:12px;border-top:1px solid #f1f5f9;padding-top:20px;
}

/* ─── Login Responsive ──────────────────────────── */
@media(max-width:960px){
  .login-split{flex-direction:column}
  .login-hero{flex:1;padding:40px 24px;min-height:45vh}
  .login-hero-content{max-width:100%;padding:0}
  .login-hero-brand{margin-bottom:28px}
  .login-hero-text h2{font-size:28px}
  .login-hero-text p{max-width:100%}
  .login-hero-features{grid-template-columns:1fr}
  .login-hero-footer{position:static;margin-top:24px;padding:0}
  .login-panel{flex:1;padding:40px 24px}
  .login-card{max-width:420px}
}
@media(max-width:480px){
  .login-hero{padding:24px 16px;min-height:35vh}
  .login-hero-text h2{font-size:22px}
  .login-panel{padding:28px 16px}
  .login-card-brand strong{font-size:15px}
  .input-wrapper{padding:0 12px;gap:8px}
  .input-wrapper input{padding:12px 0;font-size:13px}
  #loginBtn{padding:12px 16px;font-size:14px}
}

/* ─── Buttons ──────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 20px;border-radius:8px;font-size:14px;font-weight:600;
  border:1.5px solid transparent;transition:all .2s;cursor:pointer;
  text-decoration:none;white-space:nowrap;
}
.btn-primary{background:#B3261E;color:#fff;border-color:#B3261E}
.btn-primary:hover{background:#8B1A13;border-color:#8B1A13}
.btn-primary:disabled{opacity:.6;cursor:not-allowed}
.btn-outline{background:transparent;color:#B3261E;border-color:#B3261E}
.btn-outline:hover{background:#fef2f2}
.btn-ghost{background:transparent;color:#6b7280;border-color:transparent}
.btn-ghost:hover{background:#f3f4f6;color:#374151}
.btn-block{width:100%}
.btn-sm{padding:7px 14px;font-size:13px}
.btn-lg{padding:14px 28px;font-size:16px}
.btn-text{display:inline-flex;align-items:center;gap:6px}
.btn-loader{display:inline-flex;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.spinner{animation:spin 1s linear infinite;transform-origin:center}
.spinner-lg{width:36px;height:36px;border:3px solid #e5e7eb;border-top-color:#B3261E;border-radius:50%;animation:spin .8s linear infinite;margin:0 auto}

/* ─── Alerts ───────────────────────────────────────────── */
.alert{padding:12px 16px;border-radius:8px;font-size:13px;margin-bottom:16px}
.alert-error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}

/* ─── App Layout ───────────────────────────────────────── */
.app-layout{display:flex;min-height:100vh}

/* ─── Sidebar ──────────────────────────────────────────── */
.sidebar{
  width:var(--sidebar-width);background:#fff;border-right:1px solid #e5e7eb;
  display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;
  z-index:100;transition:width .25s ease;overflow:hidden;
}
.sidebar.collapsed{width:var(--sidebar-collapsed)}
.sidebar-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px;height:var(--topbar-height);border-bottom:1px solid #e5e7eb;
}
.sidebar-logo{display:flex;align-items:center;gap:10px;min-width:0}
.sidebar-logo-img{width:32px;height:32px;border-radius:8px;flex-shrink:0;object-fit:cover}
.sidebar-brand-text{display:flex;flex-direction:column;white-space:nowrap;overflow:hidden}
.sidebar-brand-text strong{font-size:14px;color:#1f2937;line-height:1.2}
.sidebar-brand-text span{font-size:11px;color:#6b7280;line-height:1.2}
.sidebar.collapsed .sidebar-brand-text{display:none}
.sidebar-toggle{
  background:none;border:none;padding:4px;color:#9ca3af;border-radius:4px;
  display:flex;transition:color .2s,transform .25s;
}
.sidebar-toggle:hover{color:#374151}
.sidebar.collapsed .sidebar-toggle{transform:rotate(180deg)}

.sidebar-nav{flex:1;padding:12px 8px;overflow-y:auto}
.nav-item{
  display:flex;align-items:center;gap:12px;padding:10px 12px;
  border-radius:8px;color:#6b7280;font-size:14px;font-weight:500;
  transition:all .15s;margin-bottom:2px;white-space:nowrap;
}
.nav-item:hover{background:#f3f4f6;color:#374151}
.nav-item.active{background:#fef2f2;color:#B3261E;font-weight:600}
.sidebar.collapsed .nav-item span{display:none}

.nav-divider{height:1px;background:#e5e7eb;margin:8px 12px}
.sidebar.collapsed .nav-divider{display:none}

/* ─── Nav Accordion Groups ────────────────────── */
.nav-group{margin-bottom:2px}
.nav-group-header{
  display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:8px;
  color:#9ca3af;font-size:11px;font-weight:600;text-transform:uppercase;
  letter-spacing:.5px;cursor:pointer;transition:color .15s;user-select:none;
  white-space:nowrap;
}
.nav-group-header:hover{color:#6b7280}
.nav-group-header .nav-chevron{flex-shrink:0;margin-left:auto;transition:transform .2s}
.nav-group.expanded .nav-group-header .nav-chevron{transform:rotate(90deg)}
.nav-group-items{display:none;margin:2px 0 2px 8px}
.nav-group.expanded .nav-group-items{display:block}
.sidebar.collapsed .nav-group-header{display:none}
.sidebar.collapsed .nav-group-items{display:block;margin-left:0}

.sidebar-footer{
  padding:12px 8px;border-top:1px solid #e5e7eb;
}
.user-info-mini{display:flex;align-items:center;gap:10px;padding:8px 12px;margin-bottom:8px}
.user-avatar{
  width:36px;height:36px;border-radius:50%;background:#B3261E;color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-weight:600;font-size:14px;flex-shrink:0;
}
.user-details{overflow:hidden}
.user-details strong{display:block;font-size:13px;color:#1f2937;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-details span{font-size:11px;color:#6b7280}
.sidebar.collapsed .user-details{display:none}
.btn-logout{width:100%;justify-content:center}
.sidebar.collapsed .btn-logout span{display:none}

/* ─── Main Content ─────────────────────────────────────── */
.main-content{
  flex:1;margin-left:var(--sidebar-width);display:flex;flex-direction:column;
  min-height:100vh;transition:margin-left .25s ease;
}
.main-content.expanded{margin-left:var(--sidebar-collapsed)}

/* ─── Top Bar ───────────────────────────────────────────── */
.topbar{
  display:flex;align-items:center;gap:16px;padding:0 24px;
  height:var(--topbar-height);background:#fff;border-bottom:1px solid #e5e7eb;
  position:sticky;top:0;z-index:50;
}
.mobile-menu-btn{display:none;background:none;border:none;padding:4px;color:#6b7280}
.topbar-title h2{font-size:18px;font-weight:600;color:#1f2937}
.topbar-actions{margin-left:auto}
.topbar-search{
  display:flex;align-items:center;gap:8px;background:#f3f4f6;
  border:1px solid transparent;border-radius:8px;padding:8px 14px;
  transition:all .2s;min-width:280px;
}
.topbar-search:focus-within{background:#fff;border-color:#B3261E;box-shadow:0 0 0 3px rgba(179,38,30,.1)}
.topbar-search .search-icon{color:#9ca3af;flex-shrink:0}
.topbar-search input{border:none;background:transparent;outline:none;width:100%;font-size:14px;color:#1f2937}
.topbar-search input::placeholder{color:#9ca3af}

/* ─── Content Area ─────────────────────────────────────── */
.content-area{flex:1;padding:24px}
.app-footer{
  display:flex;justify-content:space-between;align-items:center;
  padding:16px 24px;border-top:1px solid #e5e7eb;font-size:12px;color:#9ca3af;
}
.social-links{display:flex;gap:8px;margin-top:6px}
.social-link{color:#9ca3af;padding:4px;border-radius:4px;display:flex;transition:color .2s}
.social-link:hover{color:#B3261E}

/* ─── Dashboard ─────────────────────────────────────────── */
/* ═══════════════════════════════════════════════════════════
   Dashboard — Modern Design
   ═══════════════════════════════════════════════════════════ */

/* ─── Hero ─────────────────────────────────────────────── */
.dash-hero{
  background:linear-gradient(135deg,#1A1A1A 0%,#B3261E 50%,#C62828 100%);
  border-radius:16px;padding:32px 36px;margin-bottom:28px;position:relative;overflow:hidden;
}
.dash-hero::before{
  content:'';position:absolute;top:-50%;right:-20%;width:400px;height:400px;
  background:radial-gradient(circle,rgba(255,255,255,.06) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.dash-hero::after{
  content:'';position:absolute;bottom:-30%;left:60%;width:300px;height:300px;
  background:radial-gradient(circle,rgba(255,255,255,.04) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.dash-hero-content{display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative;z-index:1}
.dash-hero-text{flex:1}
.dash-hero-text h1{font-size:24px;font-weight:700;color:#fff;margin-bottom:8px;line-height:1.3}
.dash-hero-text p{color:rgba(255,255,255,.75);font-size:15px;margin-bottom:20px;max-width:520px}
.dash-hero-actions{display:flex;gap:10px;flex-wrap:wrap}
.dash-hero-actions .btn-primary{background:#fff;color:#B3261E;border:none}
.dash-hero-actions .btn-primary:hover{background:#f0f4ff}
.btn-hero-ghost{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;border-radius:10px;font-size:14px;font-weight:600;color:rgba(255,255,255,.85);background:rgba(255,255,255,.12);border:none;text-decoration:none;transition:all .2s}
.btn-hero-ghost:hover{background:rgba(255,255,255,.2);color:#fff}
.dash-hero-visual{flex-shrink:0;color:rgba(255,255,255,.5)}
.dash-hero-visual svg{display:block}
@media(max-width:768px){.dash-hero-visual{display:none}}

/* ─── Sections ─────────────────────────────────────────── */
.dash-section{margin-bottom:28px}
.dash-section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.dash-section-header h2{font-size:17px;font-weight:600;color:#1f2937}
.dash-section-header p{font-size:13px;margin-top:2px}
.dash-section-link{font-size:13px;font-weight:500;color:#B3261E;text-decoration:none}
.dash-section-link:hover{text-decoration:underline}
.dash-split{display:grid;grid-template-columns:1fr 1fr;gap:24px}
@media(max-width:1024px){.dash-split{grid-template-columns:1fr}}
@media(max-width:768px){
  .dash-stats{grid-template-columns:repeat(2,1fr)}
  .dash-categories{grid-template-columns:repeat(2,1fr)}
  .dash-quicklinks{grid-template-columns:1fr}
  .dash-hero-text h1{font-size:20px}
}
@media(max-width:480px){
  .dash-stats{grid-template-columns:1fr}
  .dash-categories{grid-template-columns:1fr}
}

/* ─── Stat Cards (global modern design) ────────────────── */
.dash-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}
.dash-stat{
  background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:20px;
  display:flex;align-items:center;gap:16px;position:relative;overflow:hidden;
  transition:box-shadow .2s,transform .2s;
}
.dash-stat:hover{box-shadow:0 4px 16px rgba(0,0,0,.06);transform:translateY(-1px)}
.dash-stat-bg{
  position:absolute;top:0;right:0;width:100px;height:100px;
  background:var(--stat-bg);border-radius:50%;transform:translate(30%,-30%);
  opacity:.4;pointer-events:none;transition:all .3s;
}
.dash-stat:hover .dash-stat-bg{transform:translate(20%,-20%) scale(1.2);opacity:.6}
.dash-stat-icon-wrap{flex-shrink:0}
.dash-stat-icon{
  width:48px;height:48px;border-radius:14px;
  background:var(--stat-bg);color:var(--stat-color);
  display:flex;align-items:center;justify-content:center;
}
.dash-stat-body{flex:1;position:relative;z-index:1}
.dash-stat-value{font-size:26px;font-weight:700;color:#1f2937;line-height:1.2;margin-bottom:2px}
.dash-stat-label{font-size:13px;color:#6b7280;font-weight:500}

/* ─── Category Cards ───────────────────────────────────── */
.dash-categories{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.dash-cat{
  background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:22px 18px;
  text-align:center;transition:all .25s;cursor:pointer;display:block;color:inherit;
  position:relative;overflow:hidden;
}
.dash-cat::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:var(--cat-color);opacity:.6;
}
.dash-cat:hover{
  border-color:var(--cat-color);box-shadow:0 6px 20px rgba(0,0,0,.07);transform:translateY(-3px);
}
.dash-cat-icon-wrap{margin-bottom:10px}
.dash-cat-icon{
  width:48px;height:48px;border-radius:14px;
  background:var(--cat-bg);color:var(--cat-color);
  display:inline-flex;align-items:center;justify-content:center;
}
.dash-cat-name{font-size:14px;font-weight:600;color:#1f2937;margin-bottom:4px}
.dash-cat-count{font-size:12px;color:#9ca3af;font-weight:500}

/* ─── Quick Links ──────────────────────────────────────── */
.dash-quicklinks{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.dash-qlink{
  display:flex;align-items:center;gap:14px;background:#fff;
  border:1px solid #e5e7eb;border-radius:12px;padding:16px 18px;
  transition:all .2s;color:inherit;text-decoration:none;
}
.dash-qlink:hover{
  border-color:var(--ql-color);box-shadow:0 4px 14px rgba(0,0,0,.06);transform:translateY(-2px);
}
.dash-qlink-icon{
  width:44px;height:44px;border-radius:12px;
  background:var(--ql-bg);color:var(--ql-color);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.dash-qlink-text{flex:1;min-width:0}
.dash-qlink-text strong{display:block;font-size:14px;color:#1f2937;margin-bottom:2px}
.dash-qlink-text span{display:block;font-size:12px;color:#9ca3af;line-height:1.3}
.dash-qlink-arrow{color:#d1d5db;flex-shrink:0;transition:transform .2s}
.dash-qlink:hover .dash-qlink-arrow{transform:translateX(3px);color:var(--ql-color)}

/* ─── Featured / Recent Articles ────────────────────────── */
.dash-featured,.dash-recent{display:flex;flex-direction:column;gap:10px}
.dash-article{
  display:block;background:#fff;border:1px solid #e5e7eb;border-radius:11px;
  padding:16px;transition:all .2s;color:inherit;text-decoration:none;
}
.dash-article:hover{border-color:#d1d5db;box-shadow:0 3px 12px rgba(0,0,0,.05);transform:translateY(-1px)}
.dash-article-badge{
  display:inline-block;font-size:11px;font-weight:600;padding:3px 10px;border-radius:5px;margin-bottom:8px;
}
.dash-article-title{font-size:14px;font-weight:600;color:#1f2937;margin-bottom:3px;line-height:1.4}
.dash-article-desc{font-size:13px;color:#6b7280;margin-bottom:8px;line-height:1.5}
.dash-article-meta{display:flex;gap:14px;font-size:12px;color:#9ca3af}
.dash-article-meta svg{vertical-align:middle;margin-right:2px}

/* ─── Admin List Items ──────────────────────────────────── */
.dash-list{display:flex;flex-direction:column;gap:2px;background:#fff;border:1px solid #e5e7eb;border-radius:11px;overflow:hidden}
.dash-list-item{
  display:flex;align-items:center;gap:12px;padding:12px 16px;color:inherit;text-decoration:none;
  border-bottom:1px solid #f3f4f6;transition:background .15s;
}
.dash-list-item:last-child{border-bottom:none}
.dash-list-item:hover{background:#f9fafb}
.dash-list-rank{
  width:28px;height:28px;border-radius:8px;background:var(--stat-bg,#fef2f2);color:var(--stat-color,#B3261E);
  display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0;
}
.dash-list-text{flex:1;font-size:14px;color:#1f2937;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dash-list-stat{font-size:12px;color:#9ca3af;font-weight:500;white-space:nowrap}

/* ─── Legacy stat-card (used in analytics, governance, etc) ─ */
.stat-card{
  background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:22px 24px;
  position:relative;overflow:hidden;transition:all .25s;
}
.stat-card:hover{
  box-shadow:0 4px 16px rgba(0,0,0,.06);transform:translateY(-1px);
  border-color:#d1d5db;
}
.stat-card-primary{border-left:4px solid #B3261E}
.stat-card-success{border-left:4px solid #059669}
.stat-card-warning{border-left:4px solid #d97706}
.stat-card-info{border-left:4px solid #0284c7}
.stat-card-danger{border-left:4px solid #dc2626}
.stat-value{font-size:28px;font-weight:700;color:#1f2937;margin-bottom:4px}
.stat-label{font-size:13px;color:#6b7280}

/* ─── Skeleton (preserved from old design) ──────────────── */
.dash-stat.skeleton .dash-stat-icon-wrap{width:48px;height:48px;border-radius:14px;background:linear-gradient(90deg,#f3f4f6 25%,#e5e7eb 50%,#f3f4f6 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}
.dash-stat.skeleton .dash-stat-value{height:24px;width:50%;margin-bottom:4px;background:linear-gradient(90deg,#f3f4f6 25%,#e5e7eb 50%,#f3f4f6 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px}
.dash-stat.skeleton .dash-stat-label{height:14px;width:60%;background:linear-gradient(90deg,#f3f4f6 25%,#e5e7eb 50%,#f3f4f6 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px}
.dash-cat.skeleton .dash-cat-icon-wrap{width:48px;height:48px;border-radius:14px;margin:0 auto 10px;background:linear-gradient(90deg,#f3f4f6 25%,#e5e7eb 50%,#f3f4f6 75%);background-size:200% 100%;animation:shimmer 1.5s infinite}
.dash-cat.skeleton .dash-cat-name{height:14px;width:55%;margin:0 auto 4px;background:linear-gradient(90deg,#f3f4f6 25%,#e5e7eb 50%,#f3f4f6 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px}
.dash-cat.skeleton .dash-cat-count{height:12px;width:35%;margin:0 auto;background:linear-gradient(90deg,#f3f4f6 25%,#e5e7eb 50%,#f3f4f6 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px}
.dash-article.skeleton .dash-article-badge{height:18px;width:60px;margin-bottom:8px;background:linear-gradient(90deg,#f3f4f6 25%,#e5e7eb 50%,#f3f4f6 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px}
.dash-article.skeleton .dash-article-title{height:16px;width:70%;margin-bottom:6px;background:linear-gradient(90deg,#f3f4f6 25%,#e5e7eb 50%,#f3f4f6 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px}
.dash-article.skeleton .dash-article-desc{height:12px;width:85%;background:linear-gradient(90deg,#f3f4f6 25%,#e5e7eb 50%,#f3f4f6 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px}

/* ─── Help Center / FAQ ─────────────────────────────────── */
.help-hero{background:linear-gradient(135deg,#1A1A1A 0%,#B3261E 100%);border-radius:12px;padding:32px;margin-bottom:24px;color:#fff}
.help-hero h1{font-size:24px;font-weight:700;margin-bottom:6px}
.help-hero p{font-size:14px;opacity:.85;margin-bottom:20px}
.help-search-box{display:flex;align-items:center;gap:8px;background:#fff;border-radius:10px;padding:4px 4px 4px 16px;max-width:480px}
.help-search-box svg{color:#9ca3af;flex-shrink:0}
.help-search-box input{flex:1;border:none;outline:none;font-size:15px;padding:10px 0;color:#1f2937}
.help-search-box input::placeholder{color:#9ca3af}
.help-quick-links{display:flex;gap:12px;margin-bottom:28px;flex-wrap:wrap}
.help-quick-link{display:flex;align-items:center;gap:8px;padding:12px 18px;background:#fff;border:1px solid #e5e7eb;border-radius:10px;color:#6b7280;font-size:13px;font-weight:500;transition:all .2s}
.help-quick-link:hover{border-color:#B3261E;color:#B3261E;box-shadow:0 2px 8px rgba(179,38,30,.08)}
.help-section{margin-bottom:32px}
.help-section h2{font-size:18px;font-weight:600;color:#1f2937;margin-bottom:16px}
.faq-list{display:flex;flex-direction:column;gap:8px}
.faq-item{background:#fff;border:1px solid #e5e7eb;border-radius:10px;overflow:hidden;transition:border-color .2s}
.faq-item:hover{border-color:#d1d5db}
.faq-question{display:flex;justify-content:space-between;align-items:center;width:100%;padding:16px 20px;background:none;border:none;font-size:14px;font-weight:500;color:#1f2937;text-align:left;cursor:pointer}
.faq-question svg{flex-shrink:0;transition:transform .25s;color:#9ca3af}
.faq-item.open .faq-question svg{transform:rotate(180deg);color:#B3261E}
.faq-answer{max-height:0;overflow:hidden;transition:max-height .3s ease,padding .3s ease}
.faq-item.open .faq-answer{max-height:800px}
.faq-answer-content{padding:0 20px 16px;font-size:14px;color:#6b7280;line-height:1.7}
.faq-answer-content h1,.faq-answer-content h2{font-size:16px;font-weight:600;color:#1f2937;margin:16px 0 8px}
.faq-answer-content h3{font-size:14px;font-weight:600;color:#374151;margin:12px 0 6px}
.faq-answer-content p{margin-bottom:8px}
.faq-answer-content ul,.faq-answer-content ol{padding-left:20px;margin-bottom:8px}
.faq-answer-content li{margin-bottom:4px}
.faq-answer-content strong{color:#374151}
.faq-answer-content code{background:#f3f4f6;padding:2px 6px;border-radius:4px;font-size:12px}
.faq-answer-content blockquote{border-left:3px solid #B3261E;padding:8px 12px;margin:12px 0;background:#f9fafb;border-radius:4px;font-size:13px}
.support-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.support-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:24px;text-align:center}
.support-card-icon{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;margin:0 auto 12px}
.support-card h3{font-size:15px;font-weight:600;color:#1f2937;margin-bottom:4px}
.support-card p{font-size:13px;color:#6b7280;margin-bottom:12px}

/* ─── Institutional Calendar ──────────────────────────── */
.calendar-hero{
  background:linear-gradient(135deg,#1A1A1A 0%,#B3261E 50%,#C62828 100%);
  border-radius:16px;padding:32px 36px;margin-bottom:28px;position:relative;overflow:hidden;color:#fff;
}
.calendar-hero::before{
  content:'';position:absolute;top:-50%;right:-20%;width:400px;height:400px;
  background:radial-gradient(circle,rgba(255,255,255,.06) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.calendar-hero::after{
  content:'';position:absolute;bottom:-30%;left:60%;width:300px;height:300px;
  background:radial-gradient(circle,rgba(255,255,255,.04) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.calendar-hero-content{position:relative;z-index:1}
.calendar-hero h1{font-size:24px;font-weight:700;margin-bottom:8px;line-height:1.3}
.calendar-hero p{font-size:15px;opacity:.85;margin:0;max-width:520px}
.calendar-layout{display:grid;grid-template-columns:1fr 280px;gap:24px}
@media(max-width:768px){.calendar-layout{grid-template-columns:1fr}}
.calendar-main{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:24px}
.calendar-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}
.calendar-nav h2{font-size:18px;font-weight:600;color:#1f2937}
.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.cal-day-header{text-align:center;font-size:11px;font-weight:600;color:#6b7280;padding:8px 4px;text-transform:uppercase}
.cal-day{min-height:80px;padding:6px;border-radius:6px;background:#f9fafb;cursor:pointer;transition:background .15s;position:relative}
.cal-day:hover{background:#fef2f2}
.cal-day-empty{background:transparent;cursor:default}
.cal-day-today{background:#fef2f2;outline:2px solid #B3261E;outline-offset:-2px}
.cal-day-num{font-size:13px;font-weight:600;color:#374151;display:block;margin-bottom:4px}
.cal-day-today .cal-day-num{color:#B3261E}
.cal-day-events{display:flex;flex-wrap:wrap;gap:2px}
.cal-dot{width:7px;height:7px;border-radius:50%;display:inline-block}
.cal-more{font-size:9px;color:#9ca3af;font-weight:600}
.calendar-sidebar{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:20px;height:fit-content}
.calendar-sidebar h3{font-size:15px;font-weight:600;color:#1f2937;margin-bottom:12px}
.calendar-sidebar h4{font-size:12px;font-weight:600;color:#6b7280;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;margin-top:16px}
.upcoming-list{display:flex;flex-direction:column;gap:8px}
.upcoming-item{display:flex;gap:10px;padding:10px 12px;border-radius:8px;background:#f9fafb}
.upcoming-date{font-size:12px;font-weight:700;color:#B3261E;text-align:center;min-width:40px;padding-top:2px}
.upcoming-info{flex:1;min-width:0}
.upcoming-info strong{display:block;font-size:13px;color:#1f2937;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.upcoming-info span{font-size:11px;color:#9ca3af}
.calendar-legend{margin-top:16px;padding-top:16px;border-top:1px solid #e5e7eb}
.legend-item{display:flex;align-items:center;gap:8px;font-size:12px;color:#6b7280;margin-bottom:4px}
.legend-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.event-count{font-size:13px;color:#6b7280;margin-bottom:12px}
.event-detail-card{padding:14px;border-radius:8px;background:#f9fafb;margin-bottom:10px}
.event-detail-card h4{font-size:14px;font-weight:600;color:#1f2937;margin-bottom:4px}
.event-time,.event-loc{font-size:12px;color:#6b7280;margin-bottom:2px}
.event-desc{font-size:13px;color:#6b7280;margin:6px 0}
.event-badge{display:inline-block;font-size:11px;font-weight:600;padding:2px 10px;border-radius:4px}

/* ─── Fullscreen Background Override ──────────────────── */
#kmFileViewerModal:fullscreen,
#fileViewerModal:fullscreen {
  background: transparent !important;
}
#kmFileViewerModal:-webkit-full-screen,
#fileViewerModal:-webkit-full-screen {
  background: transparent !important;
}
#kmFileViewerModal:fullscreen .modal-body,
#fileViewerModal:fullscreen .modal-body {
  background: #0a0a0a !important;
}
#kmFileViewerModal:-webkit-full-screen .modal-body,
#fileViewerModal:-webkit-full-screen .modal-body {
  background: #0a0a0a !important;
}
#kmFileViewerModal::backdrop,
#fileViewerModal::backdrop {
  background: transparent;
}
#kmFileViewerModal::-webkit-backdrop,
#fileViewerModal::-webkit-backdrop {
  background: transparent;
}

/* ─── Modal ───────────────────────────────────────────── */
.modal-overlay{
  position:fixed;top:0;left:0;right:0;bottom:0;
  background:rgba(15,23,42,.55);z-index:200;
  display:flex;align-items:center;justify-content:center;padding:20px;
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
  animation:modalFadeIn .2s ease;
}
@keyframes modalFadeIn{from{opacity:0}to{opacity:1}}
.modal-content{
  background:#fff;border-radius:16px;
  max-width:480px;width:100%;max-height:85vh;
  display:flex;flex-direction:column;
  box-shadow:0 25px 50px -12px rgba(0,0,0,.3);
  animation:modalSlideIn .25s cubic-bezier(.16,1,.3,1);
  overflow:hidden;
}
.modal-content form{display:flex;flex-direction:column;flex:1;min-height:0}
@keyframes modalSlideIn{
  from{opacity:0;transform:translateY(-24px) scale(.97)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.modal-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 24px 0;flex-shrink:0;gap:16px;
}
.modal-header h3{
  font-size:18px;font-weight:600;color:#111827;margin:0;line-height:1.3;
}
.modal-close{
  display:flex;align-items:center;justify-content:center;
  width:32px;height:32px;border-radius:8px;
  background:transparent;border:none;font-size:22px;
  color:#9ca3af;cursor:pointer;transition:all .2s;line-height:1;flex-shrink:0;
}
.modal-close:hover{background:#f3f4f6;color:#374151}
.modal-close svg{display:block}
.modal-body{
  padding:20px 24px;overflow-y:auto;flex:1;
}
.modal-body:first-child{padding-top:24px}
.modal-footer{
  display:flex;align-items:center;justify-content:flex-end;gap:10px;
  padding:16px 24px;border-top:1px solid #f3f4f6;flex-shrink:0;
}
.modal-footer .form-actions{margin:0;padding:0;border:none;width:100%}

/* ─── Modal Form Enhancements ─────────────────────── */
.modal-body .form-group{margin-bottom:18px}
.modal-body .form-group:last-child{margin-bottom:0}
.modal-body .form-grid{margin-bottom:0}
.modal-body .form-grid .form-group{margin-bottom:0}
.modal-body .form-group label{font-size:13px;font-weight:600;color:#374151;margin-bottom:6px}
.modal-body .form-group .form-checkbox{padding-top:0}
.modal-body .form-hint{font-size:11px;color:#94a3b8;margin-top:4px}
.modal-body .file-upload-label{padding:12px 16px;font-size:13px}
.modal-body textarea{font-size:14px}
.modal-body select{font-size:14px}

.modal-lg{max-width:640px}
.modal-xl{max-width:780px}
@media(max-width:640px){
  .modal-overlay{padding:12px;align-items:flex-end}
  .modal-content{border-radius:16px 16px 0 0;max-height:90vh}
  .modal-header{padding:16px 18px 0}
  .modal-body{padding:16px 18px}
  .modal-footer{padding:14px 18px}
}

/* ─── Knowledge Search ─────────────────────────────────── */
.search-hero{
  background:linear-gradient(135deg,#1A1A1A 0%,#B3261E 100%);
  border-radius:12px;padding:32px;margin-bottom:24px;color:#fff;
}
.search-hero h1{font-size:24px;font-weight:700;margin-bottom:6px}
.search-hero p{font-size:14px;opacity:.85;margin-bottom:20px}
.search-bar-large{
  display:flex;align-items:center;gap:8px;background:#fff;border-radius:10px;
  padding:4px 4px 4px 16px;max-width:640px;
}
.search-bar-large svg{color:#9ca3af;flex-shrink:0}
.search-bar-large input{flex:1;border:none;outline:none;font-size:15px;padding:10px 0;color:#1f2937}
.search-bar-large input::placeholder{color:#9ca3af}

.search-layout{display:grid;grid-template-columns:240px 1fr;gap:24px}
@media(max-width:768px){.search-layout{grid-template-columns:1fr}}
.search-filters{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:20px;height:fit-content;position:sticky;top:88px}
.filter-section{margin-bottom:20px}
.filter-section:last-child{margin-bottom:0}
.filter-section h3{font-size:13px;font-weight:600;color:#374151;margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}
.filter-options{display:flex;flex-direction:column;gap:4px}
.filter-option{
  display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:6px;
  font-size:13px;color:#6b7280;cursor:pointer;transition:all .15s;
}
.filter-option:hover{background:#f3f4f6}
.filter-option.active{background:#fef2f2;color:#B3261E;font-weight:500}
.filter-option input[type="radio"]{display:none}
.filter-option small{margin-left:auto;color:#9ca3af;font-size:11px}
.filter-option-child{padding-left:28px}

.filter-select{
  width:100%;padding:8px 10px;border:1.5px solid #d1d5db;border-radius:6px;
  font-size:13px;color:#374151;background:#fff;outline:none;cursor:pointer;
}
.filter-select:focus{border-color:#B3261E;box-shadow:0 0 0 3px rgba(179,38,30,.1)}

.results-header{margin-bottom:16px;font-size:13px;color:#6b7280}
.results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;margin-bottom:24px}
.result-card{
  display:block;background:#fff;border:1px solid #e5e7eb;border-radius:10px;
  padding:20px;transition:all .2s;color:inherit;
}
.result-card:hover{border-color:#B3261E;box-shadow:0 4px 12px rgba(179,38,30,.08);transform:translateY(-2px)}
.result-badge{font-size:11px;font-weight:600;color:#B3261E;background:#fef2f2;padding:2px 10px;border-radius:4px;display:inline-block;margin-bottom:8px}
.result-title{font-size:16px;font-weight:600;color:#1f2937;margin-bottom:6px}
.result-desc{font-size:13px;color:#6b7280;margin-bottom:12px;line-height:1.5}
.result-meta{display:flex;gap:12px;flex-wrap:wrap;font-size:11px;color:#9ca3af}

/* ─── Pagination ───────────────────────────────────────── */
.pagination{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin-top:4px}
.page-btn{
  padding:8px 16px;border:1.5px solid #e5e7eb;border-radius:8px;background:#fff;
  color:#374151;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s;
  min-width:36px;text-align:center;
}
.page-btn:hover:not(:disabled):not(.active){background:#f8fafc;border-color:#94a3b8;color:#1f2937}
.page-btn.active{background:#B3261E;color:#fff;border-color:#B3261E;box-shadow:0 2px 8px rgba(179,38,30,.2)}
.page-btn:disabled{opacity:.4;cursor:not-allowed}

/* ─── Knowledge View ───────────────────────────────────── */
.knowledge-view{max-width:860px;margin:0 auto}
.kv-loading{text-align:center;padding:60px 20px;color:#6b7280}
.kv-loading p{margin-top:16px}
.kv-breadcrumb{display:flex;align-items:center;gap:6px;font-size:13px;color:#9ca3af;margin-bottom:24px;flex-wrap:wrap}
.kv-breadcrumb a{color:#6b7280}
.kv-breadcrumb a:hover{color:#B3261E}
.kv-breadcrumb span{color:#374151}
.kv-header{margin-bottom:32px}
.kv-meta-top{display:flex;gap:16px;font-size:13px;color:#6b7280;margin-bottom:12px;flex-wrap:wrap}
.kv-category{font-weight:600;color:#B3261E;background:#fef2f2;padding:2px 10px;border-radius:4px}
.kv-title{font-size:28px;font-weight:700;color:#1f2937;line-height:1.3;margin-bottom:16px}
.kv-tags{display:flex;gap:6px;flex-wrap:wrap}
.tag{font-size:12px;color:#B3261E;background:#fef2f2;padding:3px 10px;border-radius:12px}
.kv-body{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:32px;margin-bottom:24px}
.kv-description{font-size:16px;color:#6b7280;margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid #e5e7eb;overflow-wrap:break-word}
.markdown-content{font-size:15px;color:#374151;line-height:1.8;overflow-wrap:break-word}
.markdown-content h1,.markdown-content h2,.markdown-content h3{margin-top:24px;margin-bottom:12px;color:#1f2937;font-weight:600}
.markdown-content h1{font-size:22px}
.markdown-content h2{font-size:18px;padding-bottom:6px;border-bottom:1px solid #e5e7eb}
.markdown-content h3{font-size:16px}
.markdown-content p{margin-bottom:12px;overflow-wrap:break-word}
.markdown-content ul,.markdown-content ol{padding-left:24px;margin-bottom:12px}
.markdown-content li{margin-bottom:4px}
.markdown-content code{background:#f3f4f6;padding:2px 6px;border-radius:4px;font-size:13px;color:#1f2937}
.markdown-content pre{background:#1f2937;color:#f3f4f6;padding:16px;border-radius:8px;overflow-x:auto;margin-bottom:16px;font-size:13px}
.markdown-content pre code{background:transparent;padding:0;color:inherit}
.markdown-content strong{font-weight:600;color:#1f2937}
.markdown-content input[type="checkbox"]{margin-right:8px;accent-color:#B3261E}
.kv-footer{display:flex;justify-content:space-between;align-items:center;padding-top:16px;border-top:1px solid #e5e7eb}
.kv-author{font-size:13px;color:#6b7280}
.kv-author strong{color:#374151}
.kv-actions{display:flex;gap:8px}

/* ─── Templates ────────────────────────────────────────── */
.templates-hero{
  background:linear-gradient(135deg,#1A1A1A 0%,#B3261E 100%);
  border-radius:12px;padding:32px;margin-bottom:24px;color:#fff;
}
.templates-hero h1{font-size:24px;font-weight:700;margin-bottom:6px}
.templates-hero p{font-size:14px;opacity:.85}
.templates-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-bottom:24px}
.template-card{
  background:#fff;border:1px solid #e5e7eb;border-radius:12px;
  padding:20px;display:flex;flex-direction:column;transition:all .2s;
}
.template-card:hover{border-color:#B3261E;box-shadow:0 4px 12px rgba(179,38,30,.08)}
.template-icon{margin-bottom:12px}
.template-title{font-size:15px;font-weight:600;color:#1f2937;margin-bottom:6px}
.template-desc{font-size:13px;color:#6b7280;margin-bottom:16px;flex:1;line-height:1.5}
.template-meta{display:flex;gap:12px;font-size:11px;color:#9ca3af;margin-bottom:16px}

/* ─── Loading States ───────────────────────────────────── */
.skeleton{background:linear-gradient(90deg,#f3f4f6 25%,#e5e7eb 50%,#f3f4f6 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:6px}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.stat-card.skeleton .stat-value{height:32px;width:60%;margin-bottom:8px}
.stat-card.skeleton .stat-label{height:14px;width:40%}
.category-card.skeleton .cat-icon{height:32px;width:32px;margin:0 auto 8px;border-radius:50%}
.category-card.skeleton .cat-name{height:14px;width:60%;margin:0 auto 6px}
.category-card.skeleton .cat-count{height:12px;width:40%;margin:0 auto}
.knowledge-card.skeleton .kc-title{height:16px;width:70%;margin-bottom:8px}
.knowledge-card.skeleton .kc-desc{height:12px;width:90%}

/* ─── Empty & Error States ─────────────────────────────── */
.empty-state,.error-state,.loading-state{
  text-align:center;padding:48px 20px;color:#6b7280;
}
.empty-state h3,.error-state h2{font-size:18px;color:#374151;margin:12px 0 6px}
.error-state p,.empty-state p{font-size:14px;color:#9ca3af}

/* ─── Toast Notifications ──────────────────────────────── */
.toast-container{position:fixed;top:20px;right:20px;z-index:1000;display:flex;flex-direction:column;gap:8px}
.toast{
  background:#1f2937;color:#fff;padding:12px 20px;border-radius:8px;
  font-size:13px;box-shadow:0 4px 12px rgba(0,0,0,.15);animation:toastIn .3s ease;
  max-width:360px;
}
.toast-success{background:#059669}
.toast-error{background:#dc2626}
@keyframes toastIn{from{opacity:0;transform:translateX(100%)}to{opacity:1;transform:translateX(0)}}

/* ─── Utilities ────────────────────────────────────────── */
.text-muted{color:#9ca3af}
.text-center{text-align:center}

/* ─── Responsive ───────────────────────────────────────── */
@media(max-width:1024px){
  .sidebar{width:var(--sidebar-collapsed)}
  .sidebar .sidebar-brand-text,.sidebar .nav-item span,.sidebar .user-details,.sidebar .btn-logout span{display:none}
  .main-content{margin-left:var(--sidebar-collapsed)}
  .sidebar.expanded{width:var(--sidebar-width);box-shadow:0 0 0 9999px rgba(0,0,0,.3)}
  .sidebar.expanded .sidebar-brand-text,.sidebar.expanded .nav-item span,.sidebar.expanded .user-details,.sidebar.expanded .btn-logout span{display:flex}
}
@media(max-width:768px){
  .topbar-search{min-width:auto}
  .mobile-menu-btn{display:block}
  .sidebar{transform:translateX(-100%);width:var(--sidebar-width);transition:transform .25s ease}
  .sidebar.open{transform:translateX(0);box-shadow:4px 0 20px rgba(0,0,0,.1)}
  .main-content,.main-content.expanded{margin-left:0}
  .stats-grid{grid-template-columns:repeat(2,1fr)}
  .categories-grid{grid-template-columns:repeat(2,1fr)}
  .results-grid{grid-template-columns:1fr}
  .templates-grid{grid-template-columns:1fr}
}

/* ─── Print Styles ─────────────────────────────────────── */
@media print{
  .sidebar,.topbar,.app-footer,.kv-actions,.kv-breadcrumb{display:none!important}
  .main-content{margin-left:0!important}
  .kv-body{box-shadow:none;border:none;padding:0}
}

/* ═══════════════════════════════════════════════════════════
   Admin Panel Styles — Modern Dashboard Design
   ═══════════════════════════════════════════════════════════ */

.admin-page{padding:0}

/* ─── Admin Header ────────────────────────────────── */
.admin-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:28px;gap:16px}
.admin-header h1{font-size:24px;font-weight:700;color:#111827;margin-bottom:6px;letter-spacing:-.3px}
.admin-header p{font-size:13px;color:#6b7280;line-height:1.5}
.admin-header-actions{display:flex;align-items:center;gap:8px;flex-shrink:0;flex-wrap:wrap}

/* ─── Admin Stats Cards ───────────────────────────── */
.admin-stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;margin-bottom:28px}

/* ─── Admin Quick Actions ─────────────────────────── */
.admin-quick-actions{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-bottom:32px}
.admin-action-card{display:flex;flex-direction:column;align-items:center;text-align:center;background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:20px 16px;transition:all .25s;color:inherit;gap:8px}
.admin-action-card:hover{border-color:#B3261E;box-shadow:0 4px 16px rgba(179,38,30,.12);transform:translateY(-2px)}
.action-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center}
.admin-action-card strong{font-size:14px;color:#1f2937}
.admin-action-card span{font-size:12px;color:#9ca3af;line-height:1.3}

/* ─── Admin Toolbar ───────────────────────────────── */
.admin-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.toolbar-search{display:flex;align-items:center;gap:8px;background:#fff;border:1.5px solid #d1d5db;border-radius:10px;padding:9px 14px;flex:1;min-width:200px;max-width:400px;transition:all .2s}
.toolbar-search:hover{border-color:#9ca3af}
.toolbar-search:focus-within{border-color:#B3261E;box-shadow:0 0 0 4px rgba(179,38,30,.1)}
.toolbar-search input{border:none;background:transparent;outline:none;width:100%;font-size:14px;color:#1f2937}
.toolbar-search input::placeholder{color:#9ca3af}
.toolbar-search svg{color:#9ca3af;flex-shrink:0}

/* ─── Admin Table — Premium Card Style ────────────── */
.admin-table-container{
  background:#fff;border:1px solid #e5e7eb;border-radius:14px;overflow:hidden;
  margin-bottom:20px;box-shadow:0 1px 3px rgba(0,0,0,.04);transition:box-shadow .2s;
}
.admin-table-container:hover{box-shadow:0 4px 16px rgba(0,0,0,.06)}
.admin-table{width:100%;border-collapse:collapse}
.admin-table thead{background:#f8fafc}
.admin-table th{
  padding:14px 18px;font-size:11px;font-weight:600;color:#64748b;
  text-transform:uppercase;letter-spacing:.6px;text-align:left;
  border-bottom:1px solid #e5e7eb;white-space:nowrap;
}
.admin-table td{
  padding:13px 18px;font-size:13px;color:#334155;
  border-bottom:1px solid #f1f5f9;transition:background .15s;
}
.admin-table tr:last-child td{border-bottom:none}
.admin-table tbody tr{cursor:default;transition:background .15s}
.admin-table tbody tr:hover td{background:#f8fafc}
.admin-table tbody tr:active td{background:#f1f5f9}
.table-title{color:#B3261E;font-weight:600;text-decoration:none}
.table-title:hover{text-decoration:underline}
.actions-cell{white-space:nowrap;text-align:right}

/* ─── Badges ──────────────────────────────────────── */
.badge{display:inline-block;font-size:11px;font-weight:600;padding:3px 10px;border-radius:6px}
.badge-outline{color:#B3261E;background:#fef2f2}
.badge-published{color:#059669;background:#ecfdf5}
.badge-draft{color:#d97706;background:#fffbeb}
.badge-archived{color:#6b7280;background:#f3f4f6}

/* ─── Admin List ──────────────────────────────────── */
.admin-list{display:flex;flex-direction:column;gap:8px}
.admin-list-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#fff;border:1px solid #e5e7eb;border-radius:10px;font-size:13px;transition:all .15s}
.admin-list-item:hover{border-color:#d1d5db;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.admin-list-item a{color:#B3261E;font-weight:500}

/* ─── Admin Form ──────────────────────────────────── */
.admin-form{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:28px;max-width:900px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.form-group-full{grid-column:1/-1}
.form-group{margin-bottom:20px}
.form-group label{display:block;font-size:13px;font-weight:600;color:#374151;margin-bottom:7px}
.form-group input[type="text"],.form-group input[type="number"],.form-group input[type="email"],.form-group input[type="password"],.form-group select,.form-group textarea{
  width:100%;padding:10px 13px;border:1.5px solid #d1d5db;border-radius:10px;
  font-size:14px;color:#1f2937;background:#fafafa;outline:none;
  transition:border-color .2s,box-shadow .2s,background .2s;
}
.form-group input:hover,.form-group select:hover,.form-group textarea:hover{background:#fff;border-color:#9ca3af}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:#B3261E;box-shadow:0 0 0 4px rgba(179,38,30,.1);background:#fff}
.form-group textarea{resize:vertical;font-family:inherit}
.form-hint{display:block;font-size:12px;color:#94a3b8;margin-top:4px}
.required{color:#dc2626}
.form-checkbox{display:flex;align-items:center;gap:8px;padding-top:24px}
.form-checkbox input[type="checkbox"]{width:18px;height:18px;accent-color:#B3261E;cursor:pointer}
.form-checkbox label{margin-bottom:0;cursor:pointer}
.file-upload{position:relative}
.file-upload input[type="file"]{position:absolute;opacity:0;width:100%;height:100%;cursor:pointer;top:0;left:0}
.file-upload-label{display:flex;align-items:center;gap:10px;padding:14px 18px;border:2px dashed #d1d5db;border-radius:10px;color:#6b7280;font-size:14px;transition:all .2s}
.file-upload:hover .file-upload-label{border-color:#B3261E;color:#B3261E;background:#fef2f2}
.file-upload-label svg{flex-shrink:0}
.form-actions{display:flex;gap:12px;margin-top:28px;padding-top:20px;border-top:1px solid #e5e7eb}

/* ─── Filter Select ───────────────────────────────── */
.admin-toolbar select{
  padding:9px 32px 9px 12px;border:1.5px solid #d1d5db;border-radius:10px;
  font-size:13px;color:#374151;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 5l3 3 3-3' stroke='%236b7280' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 10px center;
  appearance:none;cursor:pointer;transition:all .2s;min-width:140px;
}
.admin-toolbar select:hover{border-color:#9ca3af}
.admin-toolbar select:focus{border-color:#B3261E;box-shadow:0 0 0 4px rgba(179,38,30,.1);outline:none}

.nav-label{padding:10px 12px 4px;font-size:11px;font-weight:600;color:#9ca3af;text-transform:uppercase;letter-spacing:.5px}
.sidebar.collapsed .nav-label{display:none}

.error-page{text-align:center;padding:80px 20px}
.error-page h1{font-size:72px;font-weight:700;color:#1f2937;margin-bottom:8px}
.error-page p{font-size:16px;color:#6b7280;margin-bottom:24px}

/* ═══════════════════════════════════════════════════════════
   Submission & Approval Workflow Styles
   ═══════════════════════════════════════════════════════════ */

.submissions-page .page-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:24px}
.submissions-page .page-header h1{font-size:22px;font-weight:700;color:#1f2937;margin-bottom:4px}
.submissions-page .page-header p{font-size:13px;color:#6b7280}

/* ── Hero Banner ────────────────────────────────────────── */
.sub-hero{
  background:linear-gradient(135deg,#1A1A1A 0%,#B3261E 50%,#C62828 100%);
  border-radius:16px;padding:32px 36px;margin-bottom:28px;position:relative;overflow:hidden;
}
.sub-hero::before{
  content:'';position:absolute;top:-50%;right:-20%;width:400px;height:400px;
  background:radial-gradient(circle,rgba(255,255,255,.06) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.sub-hero::after{
  content:'';position:absolute;bottom:-30%;left:60%;width:300px;height:300px;
  background:radial-gradient(circle,rgba(255,255,255,.04) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.sub-hero-content{display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative;z-index:1}
.sub-hero-text{flex:1}
.sub-hero-text h1{font-size:24px;font-weight:700;color:#fff;margin-bottom:8px;line-height:1.3}
.sub-hero-text p{color:rgba(255,255,255,.75);font-size:15px;margin-bottom:20px;max-width:520px}
.sub-hero-actions .btn-primary{background:#fff;color:#B3261E;border:none;font-weight:600}
.sub-hero-actions .btn-primary:hover{background:#f0f4ff}
.sub-hero-visual{flex-shrink:0;color:rgba(255,255,255,.5)}
.sub-hero-visual svg{display:block}
@media(max-width:768px){.sub-hero-visual{display:none}}

/* ── Toolbar ────────────────────────────────────────────── */
.submission-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:20px;flex-wrap:wrap}
.sub-filter-group{
  display:flex;align-items:center;gap:8px;padding:4px 12px;
  background:#fff;border:1.5px solid #d1d5db;border-radius:8px;transition:all .2s;
}
.sub-filter-group:focus-within{border-color:#B3261E;box-shadow:0 0 0 3px rgba(179,38,30,.1)}
.sub-filter-group svg{color:#9ca3af;flex-shrink:0}
.sub-filter-group select{
  padding:7px 4px;border:none;outline:none;font-size:13px;color:#374151;
  background:transparent;cursor:pointer;min-width:130px;
}
.sub-count{font-size:13px;color:#9ca3af;margin-left:auto}

/* ── List ───────────────────────────────────────────────── */
.submission-list{display:flex;flex-direction:column;gap:10px;margin-bottom:20px}
.submission-card{
  display:flex;align-items:center;gap:16px;padding:16px 18px;
  background:#fff;border:1px solid #e5e7eb;border-radius:12px;
  transition:all .2s;color:inherit;position:relative;
  border-left:4px solid var(--sub-color,#e5e7eb);
  box-shadow:0 1px 2px rgba(0,0,0,.04);
}
.submission-card:hover{
  border-color:var(--sub-color,#fca5a5);
  box-shadow:0 4px 16px rgba(179,38,30,.08);
  transform:translateY(-2px);text-decoration:none;
}
.submission-icon-wrap{flex-shrink:0}
.submission-icon{
  width:44px;height:44px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
}
.submission-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.submission-title{font-size:15px;font-weight:600;color:#111827;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.submission-title:hover{color:var(--sub-color,#B3261E)}
.submission-meta-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:12px}
.submission-meta-row .text-muted{color:#9ca3af}
.sub-reviewer{display:inline-flex;align-items:center;gap:3px}
.sub-reviewer svg{color:#9ca3af;flex-shrink:0}
.submission-arrow{color:#d1d5db;flex-shrink:0;transition:all .15s}
.submission-card:hover .submission-arrow{color:var(--sub-color,#B3261E);transform:translateX(3px)}

.sub-status{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:3px 10px;border-radius:5px;white-space:nowrap}
.status-pending_review{color:#d97706;background:#fffbeb}
.status-in_review{color:#B3261E;background:#fef2f2}
.status-approved{color:#059669;background:#ecfdf5}
.status-rejected{color:#dc2626;background:#fef2f2}
.status-revision_requested{color:#8b5cf6;background:#f5f3ff}
.status-shelved{color:#6b7280;background:#f3f4f6}
.status-withdrawn{color:#9ca3af;background:#f9fafb}

.submission-detail .detail-header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:28px;flex-wrap:wrap}
.submission-detail .detail-header h1{font-size:22px;font-weight:700;color:#1f2937;margin-bottom:8px}
.back-link{font-size:13px;color:#6b7280;display:inline-block;margin-bottom:8px}
.back-link:hover{color:#B3261E}
.detail-meta{display:flex;gap:12px;flex-wrap:wrap;font-size:13px;color:#6b7280;align-items:center}
.detail-actions{display:flex;gap:8px;flex-wrap:wrap;flex-shrink:0}

.detail-grid{display:grid;grid-template-columns:1fr 280px;gap:24px}
@media(max-width:768px){.detail-grid{grid-template-columns:1fr}}
.detail-main{min-width:0}
.detail-section{margin-bottom:28px}
.detail-section h3{font-size:15px;font-weight:600;color:#1f2937;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid #e5e7eb}
.detail-section p{font-size:14px;color:#6b7280;line-height:1.7}

.reviewer-comment{background:#fffbeb;border:1px solid #fde68a;border-radius:8px;padding:14px 18px;font-size:14px;color:#92400e;line-height:1.6}

.comment-thread{display:flex;flex-direction:column;gap:12px}
.comment-item{background:#f9fafb;border-radius:8px;padding:12px 16px}
.comment-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:12px}
.comment-header strong{color:#374151}
.comment-item p{font-size:13px;color:#6b7280;margin:0}

.history-list{display:flex;flex-direction:column;gap:6px}
.history-item{display:flex;align-items:center;gap:12px;padding:8px 12px;background:#f9fafb;border-radius:6px;font-size:13px}
.history-info{display:flex;gap:10px;color:#6b7280;font-size:12px}

.info-card{background:#f9fafb;border:1px solid #e5e7eb;border-radius:10px;padding:18px}
.info-card h4{font-size:14px;font-weight:600;color:#1f2937;margin-bottom:12px}
.info-row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;font-size:13px;border-bottom:1px solid #e5e7eb}
.info-row:last-child{border-bottom:none}
.info-row span:first-child{color:#6b7280}
.info-row span:last-child{color:#374151;font-weight:500;text-align:right}

.btn-success{background:#059669;color:#fff;border-color:#059669}
.btn-success:hover{background:#047857;border-color:#047857}

.badge-pending{color:#d97706;background:#fffbeb}

/* ─── Governance Page ──────────────────────────────────── */
.governance-page{padding:0}
.gov-tabs{display:flex;gap:4px;margin:20px 0;background:#fff;border-radius:8px;padding:4px;border:1px solid #e5e7eb}
.gov-tab{padding:8px 18px;border:none;border-radius:6px;background:transparent;color:#6b7280;font-size:13px;font-weight:500;cursor:pointer;transition:all .15s}
.gov-tab:hover{color:#374151;background:#f3f4f6}
.gov-tab.active{color:#B3261E;background:#fef2f2;font-weight:600}
.gov-panel{display:none}
.gov-panel.active{display:block}
.gov-panel h2{font-size:16px;font-weight:600;color:#1f2937}
.toolbar-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:12px;flex-wrap:wrap}
.toolbar-row select{
  padding:9px 32px 9px 12px;border:1.5px solid #d1d5db;border-radius:10px;
  font-size:13px;color:#374151;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 5l3 3 3-3' stroke='%236b7280' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 10px center;
  appearance:none;cursor:pointer;transition:all .2s;min-width:140px;
}
.toolbar-row select:hover{border-color:#9ca3af}
.toolbar-row select:focus{border-color:#B3261E;box-shadow:0 0 0 4px rgba(179,38,30,.1);outline:none}
.toolbar-row h2{font-size:16px;font-weight:600;color:#1f2937}
.gov-table-wrap{
  background:#fff;border-radius:12px;border:1px solid #e5e7eb;overflow-x:auto;
  box-shadow:0 1px 3px rgba(0,0,0,.04);transition:box-shadow .2s;
}
.gov-table-wrap:hover{box-shadow:0 4px 16px rgba(0,0,0,.06)}
.gov-table{width:100%;border-collapse:collapse;font-size:13px}
.gov-table th{background:#f8fafc;padding:12px 16px;text-align:left;font-weight:600;color:#64748b;font-size:11px;text-transform:uppercase;letter-spacing:.6px;border-bottom:1px solid #e5e7eb;white-space:nowrap}
.gov-table td{padding:12px 16px;border-bottom:1px solid #f1f5f9;color:#334155;transition:background .15s}
.gov-table tr:last-child td{border-bottom:none}
.gov-table tbody tr:hover{background:#f8fafc}
.gov-table tr.row-overdue{background:#fef2f2}
.gov-table .badge-role{display:inline-block;padding:2px 10px;border-radius:10px;font-size:11px;font-weight:600;text-transform:capitalize}
.gov-table .badge-owner{background:#fef2f2;color:#B3261E}
.gov-table .badge-steward{background:#ecfdf5;color:#059669}
.gov-table .badge-reviewer{background:#fffbeb;color:#d97706}
.gov-table .badge-author{background:#f0f9ff;color:#0284c7}
.gov-table .badge-approver{background:#fef2f2;color:#dc2626}
.gov-table .badge-editor{background:#f0fdf4;color:#16a34a}
.gov-table .badge-publisher{background:#f5f3ff;color:#7c3aed}
.gov-table .badge-status{display:inline-block;padding:2px 10px;border-radius:10px;font-size:11px;font-weight:600;text-transform:capitalize}
.gov-table .badge-active{background:#ecfdf5;color:#059669}
.gov-table .badge-completed{background:#f3f4f6;color:#6b7280}
.gov-table .badge-cancelled{background:#fef2f2;color:#dc2626}
.gov-table .badge-danger{background:#fef2f2;color:#dc2626;border-radius:10px;padding:2px 10px;font-size:11px;font-weight:600}
.gov-table .badge-warning{background:#fffbeb;color:#d97706;border-radius:10px;padding:2px 10px;font-size:11px;font-weight:600}
.text-danger{color:#dc2626;font-weight:600}
.orphan-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.orphan-list{display:flex;flex-direction:column;gap:6px;margin-top:10px;max-height:400px;overflow-y:auto}
.orphan-item{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;background:#f9fafb;border-radius:6px;font-size:13px}
.orphan-item a{color:#B3261E;font-weight:500}
.orphan-item a:hover{text-decoration:underline}

/* ─── Metadata Tab ─────────────────────────────────────── */
.metadata-dashboard{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:20px}
.metadata-tools{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-bottom:20px}
.form-row{display:flex;gap:10px;align-items:center}
.form-row select,.form-row input{flex:1;padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:13px;background:#fff}
.checkbox-inline input[type="checkbox"]{width:16px;height:16px;accent-color:#B3261E;cursor:pointer}
.badge-access{display:inline-block;padding:2px 10px;border-radius:10px;font-size:11px;font-weight:600;text-transform:capitalize}
.badge-public{background:#ecfdf5;color:#059669}
.badge-restricted{background:#fffbeb;color:#d97706}
.badge-confidential{background:#fef2f2;color:#dc2626}

/* ═══════════════════════════════════════════════════════════
   Feedback & Surveys
   ═══════════════════════════════════════════════════════════ */

/* ── Hero Banner ────────────────────────────────────────── */
.fb-hero{
  background:linear-gradient(135deg,#1A1A1A 0%,#B3261E 50%,#C62828 100%);
  border-radius:16px;padding:32px 36px;margin-bottom:28px;position:relative;overflow:hidden;
}
.fb-hero::before{
  content:'';position:absolute;top:-50%;right:-20%;width:400px;height:400px;
  background:radial-gradient(circle,rgba(255,255,255,.06) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.fb-hero::after{
  content:'';position:absolute;bottom:-30%;left:60%;width:300px;height:300px;
  background:radial-gradient(circle,rgba(255,255,255,.04) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.fb-hero-content{display:flex;align-items:center;justify-content:space-between;gap:24px;position:relative;z-index:1}
.fb-hero-text{flex:1}
.fb-hero-text h1{font-size:24px;font-weight:700;color:#fff;margin-bottom:8px;line-height:1.3}
.fb-hero-text>p{color:rgba(255,255,255,.75);font-size:15px;margin-bottom:20px;max-width:520px}
.fb-hero-quick{display:flex;gap:8px;flex-wrap:wrap}
.fb-hero-type{
  display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:8px;
  background:rgba(255,255,255,.12);color:rgba(255,255,255,.9);font-size:12px;font-weight:500;
  cursor:pointer;transition:all .15s;border:1px solid rgba(255,255,255,.1);
}
.fb-hero-type:hover{background:rgba(255,255,255,.22);color:#fff}
.fb-hero-type svg{flex-shrink:0}
.fb-hero-visual{flex-shrink:0;color:rgba(255,255,255,.5)}
.fb-hero-visual svg{display:block}
@media(max-width:768px){.fb-hero-visual{display:none}}

/* ── Layout ─────────────────────────────────────────────── */
.feedback-layout{display:grid;grid-template-columns:1fr 300px;gap:24px;margin-bottom:24px}
@media(max-width:768px){.feedback-layout{grid-template-columns:1fr}}

/* ── Form Card ──────────────────────────────────────────── */
.feedback-form-card{
  background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:28px;
  box-shadow:0 1px 3px rgba(0,0,0,.04);
}
.fb-form-header{
  display:flex;align-items:center;gap:8px;margin-bottom:22px;
  padding-bottom:16px;border-bottom:1px solid #f3f4f6;
}
.fb-form-header svg{color:#7c3aed;flex-shrink:0}
.fb-form-header span{font-size:15px;font-weight:600;color:#111827}
.feedback-form-card .form-group{margin-bottom:20px}
.feedback-form-card label{
  display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;
  color:#374151;margin-bottom:7px;
}
.feedback-form-card label svg{color:#9ca3af;flex-shrink:0}
.feedback-form-card textarea{
  width:100%;padding:10px 12px;border:1.5px solid #d1d5db;border-radius:8px;
  font-size:14px;color:#1f2937;outline:none;resize:vertical;font-family:inherit;
  transition:all .15s;
}
.feedback-form-card textarea:focus{border-color:#7c3aed;box-shadow:0 0 0 3px rgba(124,58,237,.12)}
.feedback-form-card select{
  width:100%;padding:10px 12px;border:1.5px solid #d1d5db;border-radius:8px;
  font-size:14px;color:#1f2937;background:#fff;outline:none;transition:all .15s;
}
.feedback-form-card select:focus{border-color:#7c3aed;box-shadow:0 0 0 3px rgba(124,58,237,.12)}
.feedback-form-card input[type="text"]{
  width:100%;padding:10px 12px;border:1.5px solid #d1d5db;border-radius:8px;
  font-size:14px;color:#1f2937;outline:none;transition:all .15s;
}
.feedback-form-card input[type="text"]:focus{border-color:#7c3aed;box-shadow:0 0 0 3px rgba(124,58,237,.12)}
.fb-submit-btn{
  display:inline-flex;align-items:center;gap:6px;margin-top:6px;
}

/* ── Star Rating ────────────────────────────────────────── */
.star-rating{display:flex;gap:6px;margin-top:4px}
.star-rating .star{font-size:28px;color:#d1d5db;cursor:pointer;transition:color .12s;line-height:1}
.star-rating .star:hover{color:#d97706}

/* ── Sidebar ────────────────────────────────────────────── */
.fb-sidebar-card{
  background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:18px;
  margin-bottom:16px;
}
.fb-sidebar-card:last-child{margin-bottom:0}
.fb-sidebar-header{
  display:flex;align-items:center;gap:8px;margin-bottom:14px;
  padding-bottom:12px;border-bottom:1px solid #f3f4f6;
}
.fb-sidebar-header svg{color:#7c3aed;flex-shrink:0}
.fb-sidebar-header h4{font-size:13px;font-weight:600;color:#111827;margin:0;text-transform:uppercase;letter-spacing:.4px}
.fb-item{padding:10px 0;border-bottom:1px solid #f9fafb}
.fb-item:last-child{border-bottom:none;padding-bottom:0}
.fb-item-header{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-bottom:5px}
.fb-item-type,.fb-item-status{
  display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:600;
  padding:2px 8px;border-radius:4px;white-space:nowrap;
}
.fb-item-type svg{flex-shrink:0}
.fb-item-text{font-size:13px;color:#374151;margin:0 0 4px;line-height:1.4}
.fb-item-date{font-size:11px;color:#9ca3af}
.fb-empty{text-align:center;padding:24px 12px;color:#9ca3af}
.fb-empty svg{color:#d1d5db;margin-bottom:8px}
.fb-empty p{margin:0;font-size:13px}

/* ── Surveys Section ────────────────────────────────────── */
.surveys-section{margin-top:36px;margin-bottom:24px}
.surveys-header{
  display:flex;align-items:center;gap:12px;margin-bottom:18px;
}
.surveys-header svg{color:#059669;flex-shrink:0}
.surveys-header h2{font-size:18px;font-weight:600;color:#111827;margin:0}
.surveys-header p{font-size:13px;color:#6b7280;margin:2px 0 0}
.survey-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.survey-card{
  display:flex;align-items:center;gap:14px;background:#fff;border:1px solid #e5e7eb;
  border-radius:12px;padding:18px;cursor:pointer;transition:all .2s;position:relative;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
}
.survey-card:hover{
  border-color:#6ee7b7;box-shadow:0 4px 16px rgba(5,150,105,.1);transform:translateY(-2px);
}
.survey-card-icon{
  width:44px;height:44px;border-radius:12px;background:#ecfdf5;color:#059669;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.survey-card-body{flex:1;min-width:0}
.survey-card-body h4{font-size:15px;font-weight:600;color:#111827;margin:0 0 3px}
.survey-card-body p{font-size:13px;color:#6b7280;margin:0 0 4px;line-height:1.4}
.survey-card-meta{font-size:12px;color:#9ca3af}
.survey-card-arrow{color:#d1d5db;flex-shrink:0;transition:all .15s}
.survey-card:hover .survey-card-arrow{color:#059669;transform:translateX(3px)}

/* ─── Knowledge View Ratings & Comments ────────────────── */
.kv-rating{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:20px 24px}
.kv-rating-header{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.kv-rating-header span:first-child{font-size:14px;font-weight:500;color:#374151}
.kv-rating .star-rating .star{font-size:28px}
.kv-comments{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:24px}
.kv-comments h3{font-size:16px;font-weight:600;color:#1f2937;margin-bottom:16px}
.kv-comments .comment-list{display:flex;flex-direction:column;gap:12px}
.kv-comments .comment-item{background:#f9fafb;border-radius:8px;padding:14px 16px}
.kv-comments .comment-item .comment-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:12px}
.kv-comments .comment-item .comment-header strong{color:#374151}
.kv-comments .comment-item p{font-size:13px;color:#6b7280;line-height:1.5}
.kv-comments .comment-replies{border-left:2px solid #e5e7eb;padding-left:12px}
.kv-comments .comment-form-wrapper h4{font-size:14px;font-weight:600;color:#374151;margin-bottom:8px}

/* ─── Feedback Status Badges ────────────────────────────── */
.badge-new{color:#B3261E;background:#fef2f2}
.badge-acknowledged{color:#d97706;background:#fffbeb}
.badge-in_progress{color:#0284c7;background:#f0f9ff}
.badge-resolved{color:#059669;background:#ecfdf5}
.badge-closed{color:#6b7280;background:#f3f4f6}
.badge-pending{color:#d97706;background:#fffbeb}
.badge-approved{color:#059669;background:#ecfdf5}
.badge-rejected{color:#dc2626;background:#fef2f2}
.badge-spam{color:#6b7280;background:#f3f4f6}
.badge-general{color:#6b7280;background:#f3f4f6}
.badge-bug{color:#dc2626;background:#fef2f2}
.badge-feature_request{color:#8b5cf6;background:#f5f3ff}
.badge-content_issue{color:#d97706;background:#fffbeb}
.badge-ux{color:#0284c7;background:#f0f9ff}
.badge-survey{color:#059669;background:#ecfdf5}
.badge-status{display:inline-block;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600}

/* ═══════════════════════════════════════════════════════════
   Analytics & Reporting
   ═══════════════════════════════════════════════════════════ */
.analytics-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px;margin-bottom:20px}
.analytics-stats-row{display:flex;gap:14px;margin-bottom:20px}
.analytics-split{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:20px}
@media(max-width:768px){.analytics-split{grid-template-columns:1fr}}
.analytics-charts{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:20px}
@media(max-width:768px){.analytics-charts{grid-template-columns:1fr}}
.chart-card{background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:18px}
.chart-card h3{font-size:14px;font-weight:600;color:#1f2937;margin-bottom:12px}
.report-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.report-card{display:flex;flex-direction:column;align-items:center;text-align:center;background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:24px 16px;cursor:pointer;transition:all .2s;gap:8px}
.report-card:hover{border-color:#B3261E;box-shadow:0 4px 12px rgba(179,38,30,.1);transform:translateY(-2px)}
.report-card strong{font-size:14px;color:#1f2937}
.report-card span{font-size:12px;color:#9ca3af;line-height:1.3}
.report-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center}
.stat-card-danger .stat-value{color:#dc2626}

/* ═══════════════════════════════════════════════════════════
   Role Manager
   ═══════════════════════════════════════════════════════════ */
.role-layout{display:grid;grid-template-columns:220px 1fr;gap:20px;min-height:400px}
@media(max-width:768px){.role-layout{grid-template-columns:1fr}}
.role-list-panel{background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:16px}
.role-list-panel h3{font-size:14px;font-weight:600;color:#1f2937;margin-bottom:12px}
.role-list{display:flex;flex-direction:column;gap:6px}
.role-card{padding:12px 14px;border:1px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .15s}
.role-card:hover{border-color:#B3261E;background:#f9fafb}
.role-card.active{border-color:#B3261E;background:#fef2f2}
.role-card strong{display:block;font-size:13px;color:#1f2937}
.role-card span{font-size:11px}
.role-perm-panel{background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:20px;overflow-y:auto;max-height:600px}
.role-perm-panel h3{font-size:15px;font-weight:600;color:#1f2937;margin-bottom:12px}
.perm-group{margin-bottom:20px}
.perm-group h4{font-size:13px;font-weight:600;color:#374151;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid #e5e7eb}
.perm-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px}
.perm-item{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:6px;cursor:pointer;font-size:13px;transition:background .15s}
.perm-item:hover{background:#f9fafb}
.perm-item input[type="checkbox"]{width:16px;height:16px;accent-color:#B3261E;cursor:pointer;flex-shrink:0}
.perm-item span{color:#374151}
.perm-item small{font-size:11px;margin-left:auto}

/* ─── Alert Variants ───────────────────────────────────── */
.alert-success{background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0}
.alert-info{background:#f0f9ff;color:#075985;border:1px solid #bae6fd}
.alert-warning{background:#fffbeb;color:#92400e;border:1px solid #fde68a}

/* ═══════════════════════════════════════════════════════════
   Data Tables
   ═══════════════════════════════════════════════════════════ */
.table-container{
  overflow-x:auto;background:#fff;border:1px solid #e5e7eb;border-radius:12px;
  box-shadow:0 1px 3px rgba(0,0,0,.04);transition:box-shadow .2s;
}
.table-container:hover{box-shadow:0 4px 16px rgba(0,0,0,.06)}
.data-table{width:100%;border-collapse:collapse;font-size:14px}
.data-table th,.data-table td{padding:13px 18px;text-align:left;border-bottom:1px solid #f1f5f9}
.data-table th{background:#f8fafc;font-size:11px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.6px;white-space:nowrap}
.data-table tr:last-child td{border-bottom:none}
.data-table tbody tr:hover td{background:#f8fafc}
.data-table .badge-role{display:inline-block;padding:3px 10px;border-radius:10px;font-size:11px;font-weight:600;text-transform:capitalize;background:#fef2f2;color:#B3261E}
.form-control-sm{padding:6px 10px;font-size:13px}
.full-width{grid-column:1/-1}
.btn-danger-text{color:#dc2626}
.btn-danger-text:hover{background:#fef2f2}

/* ═══════════════════════════════════════════════════════════
   Member Directory
   ═══════════════════════════════════════════════════════════ */

/* ── Hero Banner ────────────────────────────────────────── */
.member-hero{
  background:linear-gradient(135deg,#1A1A1A 0%,#B3261E 50%,#C62828 100%);
  border-radius:16px;padding:32px 36px;margin-bottom:28px;position:relative;overflow:hidden;
}
.member-hero::before{
  content:'';position:absolute;top:-50%;right:-20%;width:400px;height:400px;
  background:radial-gradient(circle,rgba(255,255,255,.06) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.member-hero::after{
  content:'';position:absolute;bottom:-30%;left:60%;width:300px;height:300px;
  background:radial-gradient(circle,rgba(255,255,255,.04) 0%,transparent 70%);
  border-radius:50%;pointer-events:none;
}
.member-hero-content{position:relative;z-index:1}
.member-hero h1{font-size:24px;font-weight:700;color:#fff;margin-bottom:8px;line-height:1.3}
.member-hero p{color:rgba(255,255,255,.75);font-size:15px;margin-bottom:20px;max-width:520px}
.member-hero-search{
  display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.15);
  backdrop-filter:blur(4px);border-radius:12px;padding:4px 4px 4px 16px;max-width:480px;
  border:1px solid rgba(255,255,255,.12);
}
.member-hero-search:focus-within{border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.2)}
.member-hero-search svg{color:rgba(255,255,255,.5);flex-shrink:0}
.member-hero-search input{
  flex:1;border:none;outline:none;font-size:14px;padding:10px 0;color:#fff;background:transparent;
}
.member-hero-search input::placeholder{color:rgba(255,255,255,.45)}
.member-hero-search .btn{
  background:rgba(255,255,255,.95);color:#1A1A1A;border:none;border-radius:8px;
  padding:8px 18px;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s;
}
.member-hero-search .btn:hover{background:#fff}

/* ── Layout ─────────────────────────────────────────────── */
.member-layout{display:grid;grid-template-columns:260px 1fr;gap:24px;align-items:start}
@media(max-width:768px){.member-layout{grid-template-columns:1fr}}

/* ── Filters ────────────────────────────────────────────── */
.member-filters{
  background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:20px;
  position:sticky;top:88px;box-shadow:0 1px 3px rgba(0,0,0,.04);
}
.member-filters .filter-section{margin-bottom:22px}
.member-filters .filter-section:last-child{margin-bottom:0}
.member-filters .filter-section-header{
  display:flex;align-items:center;gap:8px;margin-bottom:10px;
}
.member-filters .filter-section-header svg{color:#B3261E;flex-shrink:0}
.member-filters .filter-section-header h3{font-size:12px;font-weight:600;color:#374151;text-transform:uppercase;letter-spacing:.6px;margin:0}
.member-filters .filter-section .form-control{
  width:100%;padding:9px 12px;border:1.5px solid #d1d5db;border-radius:8px;
  font-size:13px;color:#374151;outline:none;transition:all .15s;background:#fff;
}
.member-filters .filter-section .form-control:focus{border-color:#B3261E;box-shadow:0 0 0 3px rgba(179,38,30,.1)}
.member-filters .filter-group{margin-bottom:10px;background:#f9fafb;border-radius:8px;padding:10px 12px}
.member-filters .filter-group:last-child{margin-bottom:0}
.member-filters .filter-group strong{display:block;font-size:11px;color:#6b7280;margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}
.member-filters .filter-checkbox{
  display:flex;align-items:center;gap:8px;padding:5px 0;cursor:pointer;font-size:13px;
  transition:color .15s;
}
.member-filters .filter-checkbox:hover{color:#B3261E}
.member-filters .filter-checkbox input{accent-color:#B3261E;width:16px;height:16px;flex-shrink:0}
.member-filters .filter-checkbox span{color:#374151}
.member-filters .filter-checkbox small{color:#9ca3af;margin-left:auto}

/* ── Results ────────────────────────────────────────────── */
.member-results{min-height:300px}
.member-results-header{
  display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;
}
.member-results-header h2{font-size:18px;font-weight:600;color:#111827;margin:0}
.member-count{font-size:13px;color:#6b7280}

.member-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;
}
.member-card{
  display:flex;gap:14px;background:#fff;border:1px solid #e5e7eb;border-radius:12px;
  padding:18px;cursor:pointer;transition:all .2s;position:relative;
  box-shadow:0 1px 2px rgba(0,0,0,.04);
}
.member-card:hover{
  border-color:#fca5a5;box-shadow:0 8px 24px rgba(179,38,30,.1);transform:translateY(-3px)
}
.member-card::after{
  content:'';position:absolute;inset:0;border-radius:12px;
  background:linear-gradient(135deg,transparent 60%,rgba(179,38,30,.03));
  pointer-events:none;
}

.member-avatar-lg{
  width:48px;height:48px;border-radius:12px;color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:20px;font-weight:600;flex-shrink:0;
  box-shadow:0 2px 8px rgba(0,0,0,.08);
}

.member-info{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.member-info strong{font-size:15px;color:#111827;font-weight:600}
.member-info .text-muted{font-size:12px;color:#6b7280}
.member-dept-badge{
  display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:500;
  padding:2px 8px;border-radius:5px;background:#f3f4f6;color:#6b7280;width:fit-content;
}
.expertise-tags{
  display:flex;flex-wrap:wrap;gap:4px;margin-top:4px;
}
.expertise-tag{
  font-size:10px;font-weight:500;padding:2px 8px;border-radius:4px;
  background:#fef2f2;color:#B3261E;
}

/* ── Pagination ─────────────────────────────────────────── */
.member-pagination{
  display:flex;justify-content:center;align-items:center;gap:4px;
  margin-top:28px;padding-top:20px;border-top:1px solid #f3f4f6;
}
.member-pagination .page-btn{
  padding:8px 14px;border:1.5px solid #e5e7eb;border-radius:8px;background:#fff;
  color:#374151;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s;
  min-width:38px;text-align:center;
}
.member-pagination .page-btn:hover:not(.active):not(:disabled){
  background:#f8fafc;border-color:#fca5a5;color:#B3261E;
}
.member-pagination .page-btn.active{
  background:#B3261E;color:#fff;border-color:#B3261E;box-shadow:0 2px 8px rgba(179,38,30,.25);
}
.member-pagination .page-btn:disabled{opacity:.4;cursor:not-allowed}

/* ── Modal Profile ──────────────────────────────────────── */
.member-profile{padding:4px 0}
.profile-header{
  display:flex;gap:20px;margin-bottom:24px;align-items:flex-start;
  padding-bottom:20px;border-bottom:1px solid #f3f4f6;
}
.member-avatar-xl{
  width:72px;height:72px;border-radius:16px;color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:30px;font-weight:600;flex-shrink:0;
  box-shadow:0 4px 12px rgba(0,0,0,.1);
}
.profile-info{flex:1}
.profile-info h2{font-size:22px;font-weight:700;color:#111827;margin:0 0 4px}
.profile-info .profile-role{font-size:14px;color:#6b7280;margin:0 0 8px}
.profile-meta{display:flex;flex-wrap:wrap;gap:12px}
.profile-meta-item{
  display:inline-flex;align-items:center;gap:5px;font-size:13px;color:#6b7280;
  padding:4px 10px;border-radius:6px;background:#f9fafb;
}
.profile-meta-item svg{color:#9ca3af;flex-shrink:0}
.profile-meta-item a{color:#B3261E;text-decoration:none}
.profile-meta-item a:hover{text-decoration:underline}
.profile-section{margin-bottom:24px}
.profile-section:last-child{margin-bottom:0}
.profile-section h3{
  font-size:14px;font-weight:600;color:#111827;margin-bottom:12px;
  display:flex;align-items:center;gap:8px;
}
.profile-section h3 svg{color:#B3261E}
.expertise-badges{display:flex;flex-wrap:wrap;gap:8px}
.badge-expertise{
  display:inline-flex;align-items:center;gap:6px;padding:6px 14px;border-radius:20px;
  font-size:12px;font-weight:500;background:#fef2f2;color:#B3261E;border:1px solid #f5b7b1;
  transition:all .15s;
}
.badge-expertise:hover{background:#fee2e2;border-color:#fca5a5}
.badge-expertise small{font-size:10px;opacity:.7;margin-left:2px}
.cop-list{display:flex;flex-direction:column;gap:8px}
.cop-mini-card{
  background:#f9fafb;border:1px solid #e5e7eb;border-radius:10px;padding:14px;
  display:flex;flex-direction:column;gap:6px;transition:box-shadow .15s;
}
.cop-mini-card:hover{box-shadow:0 2px 8px rgba(0,0,0,.04)}
.cop-mini-card strong{font-size:14px;color:#1f2937}
.cop-mini-card .text-muted{font-size:12px;color:#6b7280}
.member-grid .empty-state{padding:60px 20px}
.empty-state svg{color:#d1d5db;margin-bottom:12px}

/* ── Card entrance animation ────────────────────────────── */
@keyframes cardIn{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:translateY(0)}
}
.member-card{animation:cardIn .3s ease forwards}
.member-card:nth-child(2){animation-delay:.04s}
.member-card:nth-child(3){animation-delay:.08s}
.member-card:nth-child(4){animation-delay:.12s}
.member-card:nth-child(5){animation-delay:.16s}
.member-card:nth-child(6){animation-delay:.2s}
.member-card:nth-child(7){animation-delay:.24s}
.member-card:nth-child(8){animation-delay:.28s}

/* ═══════════════════════════════════════════════════════════
   Admin Member Management
   ═══════════════════════════════════════════════════════════ */
.cop-admin-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}
.cop-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:10px;transition:box-shadow .15s}
.cop-card:hover{box-shadow:0 4px 12px rgba(0,0,0,.06)}
.cop-card-header{display:flex;align-items:center;gap:12px}
.cop-icon{width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,#B3261E,#C62828);color:#fff;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:600;flex-shrink:0}
.cop-card-info{display:flex;flex-direction:column;gap:2px}
.cop-card-info strong{font-size:14px;color:#1f2937}
.cop-desc{font-size:13px;line-height:1.4;flex:1}
.cop-meta{display:flex;justify-content:space-between;font-size:12px;color:#6b7280}
.cop-actions{display:flex;gap:6px;flex-wrap:wrap}
.add-member-form{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.add-member-form .form-control{flex:1;min-width:200px}