/* ===== AHRIS Design System (Emerald) ===== */
:root{
  --brand:#10b981; --brand-dark:#047857; --gold:#e0a92e;
}
*{ -webkit-tap-highlight-color: transparent; }
body{ background:
  radial-gradient(1200px 600px at 100% -10%, rgba(16,185,129,.08), transparent 60%),
  radial-gradient(900px 500px at -10% 110%, rgba(224,169,46,.06), transparent 55%),
  #f1f5f9; }
.font-display{ font-family:'Plus Jakarta Sans',sans-serif; }

/* Scrollbar */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:transparent; }
::-webkit-scrollbar-thumb{ background:#cbd5e1; border-radius:10px; border:2px solid transparent; background-clip:content-box; }
::-webkit-scrollbar-thumb:hover{ background:#94a3b8; background-clip:content-box; }

/* Glass card */
.glass{ background:rgba(255,255,255,.72); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.card{ background:#fff; border:1px solid #eef2f7; border-radius:18px; box-shadow:0 1px 2px rgba(16,24,40,.04), 0 8px 24px -12px rgba(16,24,40,.12); }
.card-hover{ transition:transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s; }
.card-hover:hover{ transform:translateY(-3px); box-shadow:0 18px 40px -18px rgba(27,54,171,.35); }

/* Sidebar link */
.nav-link{ display:flex; align-items:center; gap:.75rem; padding:.7rem .9rem; border-radius:12px; color:#cbd5e1; font-weight:500; font-size:.92rem; transition:all .2s; position:relative; }
.nav-link i{ width:20px; text-align:center; font-size:1rem; }
.nav-link:hover{ background:rgba(255,255,255,.08); color:#fff; }
.nav-link.active{ background:linear-gradient(135deg, #10b981, #047857); color:#fff; box-shadow:0 8px 20px -8px rgba(16,185,129,.8); }
.nav-link.active::before{ content:''; position:absolute; left:-12px; top:50%; transform:translateY(-50%); width:4px; height:60%; background:var(--gold); border-radius:4px; }

/* Buttons */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem; font-weight:600; border-radius:11px; padding:.6rem 1.1rem; font-size:.9rem; transition:all .18s; cursor:pointer; border:1px solid transparent; white-space:nowrap; }
.btn:active{ transform:scale(.97); }
.btn-primary{ background:linear-gradient(135deg,#10b981,#047857); color:#fff; box-shadow:0 8px 18px -8px rgba(16,185,129,.7); }
.btn-primary:hover{ filter:brightness(1.07); }
.btn-ghost{ background:#fff; color:#334155; border-color:#e2e8f0; }
.btn-ghost:hover{ background:#f8fafc; border-color:#cbd5e1; }
.btn-danger{ background:#ef4444; color:#fff; }
.btn-danger:hover{ background:#dc2626; }
.btn-success{ background:#16a34a; color:#fff; }
.btn-gold{ background:linear-gradient(135deg,#f5c451,#e0a92e); color:#553b00; }
.btn-sm{ padding:.4rem .75rem; font-size:.82rem; border-radius:9px; }

/* Inputs */
.input, .select, textarea.input{ width:100%; padding:.62rem .85rem; border:1px solid #e2e8f0; border-radius:11px; font-size:.9rem; background:#fff; transition:all .18s; color:#1e293b; }
.input:focus, .select:focus, textarea.input:focus{ outline:none; border-color:#10b981; box-shadow:0 0 0 4px rgba(16,185,129,.12); }
.label{ display:block; font-size:.8rem; font-weight:600; color:#475569; margin-bottom:.35rem; }

/* Badges */
.badge{ display:inline-flex; align-items:center; gap:.3rem; font-size:.72rem; font-weight:700; padding:.22rem .6rem; border-radius:999px; letter-spacing:.02em; }
.badge-green{ background:#dcfce7; color:#15803d; }
.badge-red{ background:#fee2e2; color:#b91c1c; }
.badge-yellow{ background:#fef3c7; color:#b45309; }
.badge-blue{ background:#dbeafe; color:#1d4ed8; }
.badge-gray{ background:#f1f5f9; color:#475569; }
.badge-purple{ background:#ede9fe; color:#6d28d9; }

/* Table */
.tbl{ width:100%; border-collapse:separate; border-spacing:0; }
.tbl th{ text-align:left; font-size:.74rem; text-transform:uppercase; letter-spacing:.05em; color:#94a3b8; font-weight:700; padding:.75rem 1rem; border-bottom:1px solid #eef2f7; }
.tbl td{ padding:.85rem 1rem; border-bottom:1px solid #f1f5f9; font-size:.88rem; }
.tbl tbody tr{ transition:background .15s; }
.tbl tbody tr:hover{ background:#f8fafc; }

/* Avatar */
.avatar{ width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; color:#fff; font-size:.85rem; flex-shrink:0; }

/* Animations */
@keyframes fadeUp{ from{ opacity:0; transform:translateY(12px);} to{ opacity:1; transform:none;} }
@keyframes fadeIn{ from{opacity:0} to{opacity:1} }
@keyframes spin{ to{ transform:rotate(360deg);} }
@keyframes pop{ 0%{transform:scale(.9); opacity:0} 100%{transform:scale(1); opacity:1} }
.animate-fadeup{ animation:fadeUp .5s cubic-bezier(.2,.8,.2,1) both; }
.animate-fadein{ animation:fadeIn .4s ease both; }
.animate-pop{ animation:pop .25s cubic-bezier(.2,.9,.3,1.3) both; }
.stagger > *{ animation:fadeUp .5s cubic-bezier(.2,.8,.2,1) both; }
.stagger > *:nth-child(1){animation-delay:.04s}
.stagger > *:nth-child(2){animation-delay:.09s}
.stagger > *:nth-child(3){animation-delay:.14s}
.stagger > *:nth-child(4){animation-delay:.19s}
.stagger > *:nth-child(5){animation-delay:.24s}
.stagger > *:nth-child(6){animation-delay:.29s}

.spinner{ width:18px; height:18px; border:2.5px solid rgba(255,255,255,.4); border-top-color:#fff; border-radius:50%; animation:spin .7s linear infinite; }
.spinner-dark{ border-color:rgba(16,185,129,.2); border-top-color:#10b981; }

/* Skeleton */
.skel{ background:linear-gradient(90deg,#eef2f7 25%,#f8fafc 37%,#eef2f7 63%); background-size:400% 100%; animation:shimmer 1.4s infinite; border-radius:8px; }
@keyframes shimmer{ 0%{background-position:100% 0} 100%{background-position:-100% 0} }

/* Modal */
.modal-backdrop{ position:fixed; inset:0; background:rgba(15,23,42,.55); backdrop-filter:blur(4px); z-index:60; display:flex; align-items:flex-start; justify-content:center; padding:5vh 1rem; overflow-y:auto; animation:fadeIn .2s ease; }
.modal-box{ background:#fff; border-radius:20px; width:100%; max-width:560px; box-shadow:0 30px 60px -20px rgba(2,6,23,.5); animation:pop .28s cubic-bezier(.2,.9,.3,1.2); }

/* PDF signing workspace */
.pdfsign-box{ background:#fff; border-radius:18px; width:100%; max-width:980px; height:88vh; display:flex; flex-direction:column; overflow:hidden; box-shadow:0 30px 60px -20px rgba(2,6,23,.5); animation:pop .28s cubic-bezier(.2,.9,.3,1.2); }
.pdf-scroll{ scrollbar-width:thin; }
.pdf-page{ border-radius:4px; }
.sig-stamp{ transition:box-shadow .15s; }
.sig-stamp:hover{ box-shadow:0 0 0 2px rgba(16,185,129,.4); }

/* Toast */
.toast{ display:flex; align-items:center; gap:.7rem; padding:.85rem 1.1rem; border-radius:13px; box-shadow:0 12px 30px -10px rgba(2,6,23,.35); font-size:.88rem; font-weight:500; min-width:280px; animation:slideIn .3s cubic-bezier(.2,.8,.2,1) both; }
@keyframes slideIn{ from{ transform:translateX(120%); opacity:0;} to{ transform:none; opacity:1;} }
.toast-success{ background:#fff; color:#166534; border-left:4px solid #16a34a; }
.toast-error{ background:#fff; color:#b91c1c; border-left:4px solid #ef4444; }
.toast-info{ background:#fff; color:#047857; border-left:4px solid #10b981; }

/* Login bg */
.login-bg{ background:
  radial-gradient(900px 500px at 80% -10%, rgba(16,185,129,.45), transparent 60%),
  radial-gradient(700px 500px at -10% 100%, rgba(224,169,46,.30), transparent 55%),
  linear-gradient(135deg,#022c22,#047857); }
.login-pattern{ background-image:radial-gradient(rgba(255,255,255,.07) 1px, transparent 1px); background-size:22px 22px; }

/* Stat icon */
.stat-icon{ width:52px; height:52px; border-radius:15px; display:flex; align-items:center; justify-content:center; font-size:1.35rem; }

/* signature pad */
.sig-pad{ border:2px dashed #cbd5e1; border-radius:14px; background:#fff; touch-action:none; cursor:crosshair; }

/* utility */
.clickable{ cursor:pointer; }
.line-clamp-2{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.gradient-text{ background:linear-gradient(135deg,#10b981,#047857); -webkit-background-clip:text; background-clip:text; color:transparent; }
.scroll-hide::-webkit-scrollbar{ display:none; }