/*
Theme Name: WorkFlow Attendance & Payroll
Author: Custom Development
Description: Standalone frontend attendance, advances and payroll management system for WordPress.
Version: 1.3.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: workflow-attendance-payroll
*/

:root{
    --wf-bg:#f4f7fb;
    --wf-surface:#ffffff;
    --wf-ink:#0f172a;
    --wf-muted:#64748b;
    --wf-border:#e2e8f0;
    --wf-blue:#2563eb;
    --wf-blue-dark:#1d4ed8;
    --wf-violet:#7c3aed;
    --wf-teal:#0f766e;
    --wf-amber:#d97706;
    --wf-rose:#e11d48;
    --wf-green:#059669;
    --wf-shadow:0 10px 30px rgba(15,23,42,.06);
}
html,body{background:var(--wf-bg);color:var(--wf-ink);}
body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;}
button,input,select,textarea{font:inherit;color:var(--wf-ink);}
input,select,textarea{background:#fff!important;color:#0f172a!important;}
input::placeholder,textarea::placeholder{color:#94a3b8!important;opacity:1;}
.text-slate-900{color:#0f172a!important}.text-slate-800{color:#1e293b!important}.text-slate-700{color:#334155!important}.text-slate-600{color:#475569!important}.text-slate-500{color:#64748b!important}.text-slate-400{color:#94a3b8!important}.text-white{color:#fff!important}
.bg-white{background:#fff!important}.bg-slate-50{background:#f8fafc!important}.bg-slate-100{background:#f1f5f9!important}.bg-slate-900{background:#0f172a!important}
.bg-brand-600{background:#2563eb!important}.bg-brand-700{background:#1d4ed8!important}.hover\:bg-brand-700:hover{background:#1d4ed8!important}
.border-slate-200{border-color:#e2e8f0!important}.border-slate-300{border-color:#cbd5e1!important}

#wfap-app{background:var(--wf-bg);}
.wfap-topbar{box-shadow:0 1px 0 rgba(15,23,42,.05),0 8px 24px rgba(15,23,42,.04);}
.wfap-brand-mark{background:linear-gradient(135deg,#2563eb,#7c3aed);box-shadow:0 8px 20px rgba(37,99,235,.22);}
.wfap-sidebar{background:rgba(255,255,255,.96);box-shadow:12px 0 30px rgba(15,23,42,.04);}
.wfap-nav{position:relative;width:100%;text-align:left;padding:11px 12px;border-radius:12px;font-size:13px;font-weight:700;color:#64748b!important;background:transparent!important;transition:.18s;}
.wfap-nav:hover{background:#f8fafc!important;color:#334155!important;transform:translateX(1px);}
.wfap-nav.active{background:linear-gradient(90deg,#eff6ff,#f5f3ff)!important;color:#1d4ed8!important;box-shadow:inset 3px 0 0 #2563eb;}
.wfap-nav.active:before{content:"";position:absolute;right:10px;top:50%;width:6px;height:6px;border-radius:50%;background:#7c3aed;transform:translateY(-50%);}
.wfap-section-head{display:flex;align-items:center;justify-content:space-between;gap:16px;}
.wfap-panel{background:#fff;border:1px solid #e2e8f0;border-radius:20px;box-shadow:var(--wf-shadow);}
.wfap-kicker{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#94a3b8;}
.wfap-title{font-weight:850;letter-spacing:-.025em;color:#0f172a;}
.wfap-subtitle{color:#64748b;}
.wfap-stat{position:relative;overflow:hidden;border-radius:18px;border:1px solid rgba(226,232,240,.95);box-shadow:var(--wf-shadow);min-height:132px;}
.wfap-stat:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-28px;top:-28px;background:rgba(255,255,255,.12);}
.wfap-stat.blue{background:linear-gradient(135deg,#2563eb,#3b82f6);color:#fff;}
.wfap-stat.violet{background:linear-gradient(135deg,#6d28d9,#8b5cf6);color:#fff;}
.wfap-stat.teal{background:linear-gradient(135deg,#0f766e,#14b8a6);color:#fff;}
.wfap-stat.amber{background:linear-gradient(135deg,#b45309,#f59e0b);color:#fff;}
.wfap-stat .label{font-size:12px;font-weight:700;opacity:.84}.wfap-stat .value{font-size:26px;font-weight:900;letter-spacing:-.03em;margin-top:6px}.wfap-stat .hint{font-size:11px;opacity:.72;margin-top:4px}
.wfap-action{border:1px solid #e2e8f0;background:#fff;border-radius:16px;padding:15px;transition:.18s;box-shadow:0 4px 14px rgba(15,23,42,.03);}
.wfap-action:hover{transform:translateY(-2px);border-color:#cbd5e1;box-shadow:0 10px 24px rgba(15,23,42,.08);}
.wfap-action .icon{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-weight:900;margin-bottom:10px;}
.wfap-label{display:block;font-size:12px;font-weight:800;color:#475569;margin-bottom:6px;}
.wfap-input{width:100%;min-height:45px;border:1px solid #cbd5e1;border-radius:12px;padding:9px 12px;outline:none;box-shadow:0 1px 2px rgba(15,23,42,.02);transition:.15s;}
.wfap-input:focus{border-color:#60a5fa;box-shadow:0 0 0 4px rgba(37,99,235,.10);}
.wfap-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:7px;border:0;border-radius:12px;background:linear-gradient(135deg,#2563eb,#4f46e5);color:#fff!important;font-weight:800;padding:11px 16px;min-height:44px;box-shadow:0 7px 18px rgba(37,99,235,.20);transition:.18s;}
.wfap-btn-primary:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(37,99,235,.25);}
.wfap-btn-dark{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:12px;background:#0f172a;color:#fff!important;font-weight:800;padding:11px 16px;min-height:44px;}
.wfap-btn-soft{display:inline-flex;align-items:center;justify-content:center;border:1px solid #e2e8f0;border-radius:12px;background:#fff;color:#334155!important;font-weight:800;padding:10px 14px;min-height:44px;}
.wfap-btn-soft:hover{background:#f8fafc;}
.wfap-mobile-card{border:1px solid #e2e8f0;border-radius:17px;background:#fff;box-shadow:0 5px 18px rgba(15,23,42,.04);}
.wfap-chip{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:800;}
.wfap-table-wrap{border:1px solid #e2e8f0;border-radius:16px;overflow:auto;background:#fff;}
.wfap-table-wrap table{min-width:600px;}
.wfap-table-wrap th{position:sticky;top:0;background:#f8fafc;color:#475569;font-size:11px;text-transform:uppercase;letter-spacing:.05em;z-index:1;}
.wfap-table-wrap td{color:#475569;}
.wfap-empty{border:1px dashed #cbd5e1;background:#fff;border-radius:16px;padding:28px;text-align:center;color:#64748b;}
.wfap-login-card{background:#fff!important;color:#0f172a!important;border:1px solid #dbe3ee!important;box-shadow:0 20px 45px rgba(15,23,42,.08);}
.wfap-login-button{display:flex!important;align-items:center;justify-content:center;width:100%;min-height:52px;border:0!important;border-radius:12px;background:#0f172a!important;color:#fff!important;font-weight:800;cursor:pointer;}
.wfap-login-button:hover{background:#1e293b!important;}
#wfap-toast{transition:opacity .2s;}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(37,99,235,.18);outline-offset:1px;}
@media(max-width:1023px){.wfap-sidebar{box-shadow:18px 0 40px rgba(15,23,42,.16);}}
@media(max-width:767px){button,a,input,select{min-height:44px}.wfap-panel{border-radius:17px}.wfap-stat{min-height:118px}.wfap-stat .value{font-size:23px}}