@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;600;700;800&family=Inter:wght@400;500;600&display=swap";@import "https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;500;600;700;800&display=swap";:root{--primary-blue:#2563eb;--primary-purple:#7c3aed;--primary-pink:#ec4899;--gradient-main:linear-gradient(135deg, #2563eb 0%, #7c3aed 50%, #ec4899 100%);--gradient-light:linear-gradient(135deg, #eff6ff 0%, #f5f3ff 50%, #fdf2f8 100%);--gradient-text:linear-gradient(135deg, #2563eb, #ec4899);--bg-white:#fff;--bg-soft:#f8fafc;--bg-card:#fff;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#94a3b8;--border-color:#e2e8f0;--shadow-sm:0 1px 3px #0000000f;--shadow-md:0 4px 16px #2563eb1a;--shadow-lg:0 8px 32px #2563eb26;--radius-sm:8px;--radius-md:12px;--radius-lg:20px;--radius-xl:32px}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text-primary);background:var(--bg-white);font-family:Inter,sans-serif;font-size:16px;line-height:1.7}h1,h2,h3,h4{font-family:Plus Jakarta Sans,sans-serif}h1{font-size:clamp(34px,5vw,52px);font-weight:800;line-height:1.15}h2{font-size:clamp(28px,4vw,38px);font-weight:700;line-height:1.25}h3{font-size:clamp(20px,3vw,24px);font-weight:600}.gradient-text{background:var(--gradient-text);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.section{padding:80px 0}.container{max-width:1200px;margin:0 auto;padding:0 24px}.btn-primary{background:var(--gradient-main);color:#fff;cursor:pointer;z-index:1;border:none;border-radius:50px;align-items:center;gap:8px;padding:14px 32px;font-size:15px;font-weight:600;text-decoration:none;transition:all .4s cubic-bezier(.16,1,.3,1);display:inline-flex;position:relative;overflow:hidden;box-shadow:0 4px 14px #2563eb26}.btn-primary:after{content:"";z-index:-1;background:linear-gradient(90deg,#0000,#ffffff40,#0000);width:100%;height:100%;transition:all .6s;position:absolute;top:0;left:-100%}.btn-primary:hover{transform:translateY(-2px)scale(1.02);box-shadow:0 12px 24px #7c3aed4d}.btn-primary:hover:after{left:100%}.btn-secondary{color:var(--primary-blue);border:2px solid var(--primary-blue);cursor:pointer;background:0 0;border-radius:50px;align-items:center;gap:8px;padding:12px 30px;font-size:15px;font-weight:600;text-decoration:none;transition:all .4s cubic-bezier(.16,1,.3,1);display:inline-flex}.btn-secondary:hover{background:var(--gradient-main);color:#fff;border-color:#0000;transform:translateY(-2px)scale(1.02);box-shadow:0 12px 24px #2563eb33}.card{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:28px;transition:all .4s cubic-bezier(.16,1,.3,1);position:relative}.card:hover{border-color:#7c3aed40;transform:translateY(-6px);box-shadow:0 20px 40px #2563eb1f,0 0 0 1px #2563eb14}.link-modern-hover{text-decoration:none;transition:color .3s;position:relative}.link-modern-hover:after{content:"";background:var(--gradient-text);transform-origin:100% 100%;width:100%;height:2px;transition:transform .3s cubic-bezier(.16,1,.3,1);position:absolute;bottom:-2px;left:0;transform:scaleX(0)}.link-modern-hover:hover{color:var(--primary-blue)!important}.link-modern-hover:hover:after{transform-origin:0 100%;transform:scaleX(1)}.text-glow-hover{transition:all .3s}.text-glow-hover:hover{text-shadow:0 0 15px #2563eb26;transform:scale(1.01)}.grid-3{grid-template-columns:repeat(3,1fr);gap:30px;display:grid}@media (width<=991px){.grid-3{grid-template-columns:repeat(2,1fr)}}@media (width<=767px){.grid-3{grid-template-columns:1fr}}.grid-2{grid-template-columns:repeat(2,1fr);gap:40px;display:grid}@media (width<=767px){.grid-2{grid-template-columns:1fr}}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-10px)}to{transform:translateY(0)}}.float-animation{animation:3s ease-in-out infinite alternate float}@keyframes floatGlow{0%{transform:translate(0)scale(1)}50%{transform:translate(30px,-20px)scale(1.08)}to{transform:translate(-20px,40px)scale(.95)}}html{scroll-behavior:smooth}input:focus,select:focus,textarea:focus{outline:2px solid var(--primary-blue)!important;outline-offset:1px!important;border-color:#0000!important}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-soft);border-radius:4px}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px;transition:background .3s}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}:root{--font-family:"Nunito", sans-serif;--font-xs:.72rem;--font-sm:.85rem;--font-md:1rem;--font-lg:1.15rem;--font-xl:1.35rem;--font-2xl:1.65rem;--font-3xl:2.1rem;--clr-primary:#0f4c81;--clr-primary-dark:#0a3560;--clr-primary-light:#1a6ab5;--clr-accent:#f59e0b;--clr-success:#10b981;--clr-danger:#ef4444;--clr-bg:#f0f4f8;--clr-white:#fff;--clr-text:#1a2b42;--clr-text-body:#3d5168;--clr-text-muted:#7a90a8;--clr-border:#d8e4f0;--shadow-sm:0 2px 10px #0f4c8117;--shadow-md:0 6px 28px #0f4c811f;--radius-sm:8px;--radius-md:12px;--radius-lg:18px;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:36px;--space-2xl:56px;--sidebar-w:260px;--transition:all .25s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px}body{font-family:var(--font-family);background:var(--clr-bg);color:var(--clr-text-body);min-height:100vh}button{font-family:var(--font-family);cursor:pointer;border:none}input,select,textarea{font-family:var(--font-family)}.login-page{min-height:100vh;padding:var(--space-lg);background:linear-gradient(135deg,#0a3560 0%,#0f4c81 50%,#1a6ab5 100%);justify-content:center;align-items:center;display:flex}.login-card{border-radius:var(--radius-lg);padding:var(--space-2xl);width:100%;max-width:420px;box-shadow:var(--shadow-md);background:#fff}.login-logo{margin-bottom:var(--space-xl);align-items:center;gap:12px;display:flex}.login-logo-mark{background:var(--clr-primary);color:#fff;border-radius:var(--radius-sm);width:46px;height:46px;font-weight:900;font-size:var(--font-md);justify-content:center;align-items:center;display:flex}.login-brand{font-size:var(--font-lg);color:var(--clr-text);font-weight:800;line-height:1.2}.login-sub{font-size:var(--font-xs);color:var(--clr-text-muted);font-weight:600}.login-title{font-size:var(--font-xl);color:var(--clr-text);margin-bottom:var(--space-lg);font-weight:800}.login-error{color:#991b1b;border-radius:var(--radius-sm);font-size:var(--font-sm);margin-bottom:var(--space-md);background:#ef44441a;border:1px solid #ef44444d;padding:10px 14px;font-weight:600}.form-group{margin-bottom:var(--space-md);flex-direction:column;gap:6px;display:flex}.form-group label{font-size:var(--font-sm);color:var(--clr-text);font-weight:700}.form-group input,.form-group select,.form-group textarea{border:1.5px solid var(--clr-border);border-radius:var(--radius-sm);font-size:var(--font-md);color:var(--clr-text);transition:var(--transition);background:#f8fafd;outline:none;padding:11px 14px}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--clr-primary);background:#fff;box-shadow:0 0 0 3px #0f4c811a}.form-group textarea{resize:vertical}.form-row{gap:var(--space-md);grid-template-columns:1fr 1fr;display:grid}.btn-login{background:var(--clr-primary);color:#fff;width:100%;font-size:var(--font-md);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);margin-bottom:var(--space-md);border:none;padding:13px;font-weight:700}.btn-login:hover{background:var(--clr-primary-dark)}.login-back{text-align:center;font-size:var(--font-sm);color:var(--clr-text-muted);transition:var(--transition);font-weight:600;text-decoration:none;display:block}.login-back:hover{color:var(--clr-primary)}.admin-app{min-height:100vh;display:flex}.admin-sidebar{width:var(--sidebar-w);z-index:100;min-height:100vh;padding:var(--space-lg) 0;background:#0a1f35;flex-direction:column;display:flex;position:fixed;top:0;bottom:0;left:0}.sidebar-logo{padding:0 var(--space-lg) var(--space-lg);margin-bottom:var(--space-md);border-bottom:1px solid #ffffff14;align-items:center;gap:12px;display:flex}.sl-mark{background:var(--clr-primary);color:#fff;border-radius:var(--radius-sm);width:40px;height:40px;font-weight:900;font-size:var(--font-md);flex-shrink:0;justify-content:center;align-items:center;display:flex}.sl-brand{font-size:var(--font-md);color:#fff;font-weight:800;line-height:1.2}.sl-sub{font-size:var(--font-xs);color:#ffffff73;font-weight:500}.sidebar-nav{padding:0 var(--space-sm);flex-direction:column;flex:1;gap:4px;display:flex}.sn-item{border-radius:var(--radius-sm);font-size:var(--font-sm);color:#fff9;transition:var(--transition);align-items:center;gap:12px;padding:11px 14px;font-weight:600;text-decoration:none;display:flex}.sn-item:hover{color:#ffffffe6;background:#ffffff12}.sn-item.active{background:var(--clr-primary);color:#fff}.sn-icon{font-size:var(--font-md)}.sidebar-footer{padding:var(--space-lg);border-top:1px solid #ffffff14;flex-direction:column;gap:8px;display:flex}.sidebar-logout{color:#fca5a5;width:100%;font-size:var(--font-sm);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);background:#ef444426;border:none;padding:10px;font-weight:700}.sidebar-logout:hover{background:#ef44444d}.sidebar-visit{text-align:center;font-size:var(--font-xs);color:#fff6;transition:var(--transition);font-weight:600;text-decoration:none;display:block}.sidebar-visit:hover{color:#fffc}.admin-main{margin-left:var(--sidebar-w);padding:var(--space-xl);flex:1;min-height:100vh}.admin-tab{display:none}.admin-tab.active{display:block}.tab-header{justify-content:space-between;align-items:flex-start;gap:var(--space-md);margin-bottom:var(--space-xl);padding-bottom:var(--space-lg);border-bottom:1px solid var(--clr-border);display:flex}.tab-header h1{font-size:var(--font-2xl);color:var(--clr-text);font-weight:800}.tab-header p{font-size:var(--font-sm);color:var(--clr-text-muted);margin-top:2px;font-weight:500}.btn-add{background:var(--clr-primary);color:#fff;font-size:var(--font-sm);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);white-space:nowrap;border:none;flex-shrink:0;padding:10px 20px;font-weight:700}.btn-add:hover{background:var(--clr-primary-dark)}.dash-cards{gap:var(--space-md);margin-bottom:var(--space-xl);grid-template-columns:repeat(4,1fr);display:grid}.dash-card{border-radius:var(--radius-md);padding:var(--space-lg);border:1px solid var(--clr-border);box-shadow:var(--shadow-sm);text-align:center;background:#fff}.dash-card-icon{margin-bottom:var(--space-sm);font-size:2rem}.dash-card-num{font-size:var(--font-3xl);color:var(--clr-primary);font-weight:900;line-height:1}.dash-card-lbl{font-size:var(--font-sm);color:var(--clr-text-muted);margin-top:4px;font-weight:600}.dash-quick h3{font-size:var(--font-xl);margin-bottom:var(--space-md);color:var(--clr-text);font-weight:800}.dash-actions{gap:var(--space-md);flex-wrap:wrap;display:flex}.btn-dash-action{border:1.5px solid var(--clr-primary);color:var(--clr-primary);font-size:var(--font-sm);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);background:#fff;padding:12px 20px;font-weight:700}.btn-dash-action:hover{background:var(--clr-primary);color:#fff}.content-list{gap:var(--space-md);flex-direction:column;display:flex}.empty-state{text-align:center;padding:var(--space-2xl) var(--space-xl);border-radius:var(--radius-md);border:2px dashed var(--clr-border);color:var(--clr-text-muted);font-size:var(--font-lg);background:#fff;font-weight:500}.list-item{border:1px solid var(--clr-border);border-radius:var(--radius-md);padding:var(--space-lg);justify-content:space-between;align-items:flex-start;gap:var(--space-md);box-shadow:var(--shadow-sm);transition:var(--transition);background:#fff;display:flex}.list-item:hover{box-shadow:var(--shadow-md);border-color:#0f4c8133}.list-item-info{flex:1}.list-item-title{font-size:var(--font-md);color:var(--clr-text);margin-bottom:4px;font-weight:800}.list-item-meta{font-size:var(--font-xs);color:var(--clr-text-muted);margin-bottom:var(--space-sm);gap:var(--space-sm);flex-wrap:wrap;font-weight:500;display:flex}.list-item-badge{color:var(--clr-primary);font-size:var(--font-xs);background:#0f4c8114;border-radius:100px;padding:2px 10px;font-weight:700;display:inline-block}.list-item-desc{font-size:var(--font-sm);color:var(--clr-text-muted);max-width:600px;line-height:1.6}.list-item-actions{flex-shrink:0;gap:8px;display:flex}.btn-edit,.btn-delete{font-size:var(--font-xs);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);border:none;padding:7px 14px;font-weight:700}.btn-edit{color:var(--clr-primary);background:#0f4c811a}.btn-edit:hover{background:var(--clr-primary);color:#fff}.btn-delete{color:var(--clr-danger);background:#ef44441a}.btn-delete:hover{background:var(--clr-danger);color:#fff}.modal-overlay{z-index:9999;padding:var(--space-lg);background:#0a1f35b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{border-radius:var(--radius-lg);width:100%;max-width:620px;max-height:90vh;box-shadow:var(--shadow-md);background:#fff;overflow-y:auto}.modal-header{padding:var(--space-lg) var(--space-xl);border-bottom:1px solid var(--clr-border);justify-content:space-between;align-items:center;display:flex}.modal-header h3{font-size:var(--font-xl);color:var(--clr-text);font-weight:800}.modal-close{width:32px;height:32px;font-size:var(--font-md);cursor:pointer;color:var(--clr-text-muted);transition:var(--transition);background:#f0f4f8;border:none;border-radius:50%;justify-content:center;align-items:center;font-weight:700;display:flex}.modal-close:hover{color:var(--clr-text);background:#e0e8f0}.modal-body{padding:var(--space-xl)}.modal-footer{justify-content:flex-end;gap:var(--space-sm);padding:var(--space-lg) var(--space-xl);border-top:1px solid var(--clr-border);border-radius:0 0 var(--radius-lg) var(--radius-lg);background:#f8fafd;display:flex}.btn-cancel{border:1.5px solid var(--clr-border);color:var(--clr-text-muted);font-size:var(--font-sm);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);background:#fff;padding:10px 20px;font-weight:700}.btn-cancel:hover{border-color:var(--clr-text-muted);color:var(--clr-text)}.btn-save{background:var(--clr-primary);color:#fff;font-size:var(--font-sm);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);border:none;padding:10px 24px;font-weight:700}.btn-save:hover{background:var(--clr-primary-dark)}.compliance-info-banner{color:#92400e;border-radius:var(--radius-sm);font-size:var(--font-sm);margin-bottom:var(--space-lg);background:#f59e0b1a;border:1px solid #f59e0b4d;align-items:flex-start;gap:10px;padding:12px 16px;font-weight:600;line-height:1.5;display:flex}.cib-icon{font-size:var(--font-md);flex-shrink:0}.label-hint{font-size:var(--font-xs);color:var(--clr-text-muted);margin-left:6px;font-weight:500}.pdf-upload-area{border:2px dashed var(--clr-border);border-radius:var(--radius-md);padding:var(--space-lg);align-items:center;gap:var(--space-md);cursor:pointer;transition:var(--transition);background:var(--clr-bg);display:flex}.pdf-upload-area:hover,.pdf-upload-area.has-file{border-color:var(--clr-primary);background:#0f4c810a}.pua-icon{flex-shrink:0;font-size:2rem}.pua-title{font-size:var(--font-md);color:var(--clr-text);font-weight:700}.pua-sub{font-size:var(--font-xs);color:var(--clr-text-muted);margin-top:3px;font-weight:500}.course-img-upload{border:2px dashed var(--clr-border);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition);background:var(--clr-bg);overflow:hidden}.course-img-upload:hover{border-color:var(--clr-primary)}.course-img-preview{justify-content:center;align-items:center;width:100%;height:180px;display:flex;position:relative;overflow:hidden}.course-img-preview img{object-fit:cover;width:100%;height:100%;display:block}.cip-placeholder{color:var(--clr-text-muted);font-size:var(--font-sm);flex-direction:column;align-items:center;gap:8px;font-weight:600;display:flex}.cip-placeholder span:first-child{font-size:2rem}.cip-sub{font-size:var(--font-xs);color:var(--clr-text-muted);font-weight:500}.btn-img-clear{color:var(--clr-danger);font-size:var(--font-xs);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);background:#ef44441a;border:none;padding:5px 12px;font-weight:700}.btn-img-clear:hover{background:#ef444433}.profile-editor{max-width:560px}.profile-photo-section h3{font-size:var(--font-xl);color:var(--clr-text);margin-bottom:6px;font-weight:800}.profile-hint{font-size:var(--font-sm);color:var(--clr-text-muted);margin-bottom:var(--space-lg);line-height:1.6}.profile-upload-area{border:2px dashed var(--clr-border);border-radius:var(--radius-lg);padding:var(--space-xl);align-items:center;gap:var(--space-xl);cursor:pointer;transition:var(--transition);background:var(--clr-bg);margin-bottom:var(--space-md);display:flex}.profile-upload-area:hover{border-color:var(--clr-primary);background:#0f4c8108}.profile-preview{border:3px solid var(--clr-border);background:var(--clr-bg);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:100px;height:100px;display:flex;overflow:hidden}.profile-preview img{object-fit:cover;width:100%;height:100%;display:block}.profile-preview-placeholder{font-size:var(--font-2xl);color:var(--clr-primary);opacity:.3;font-weight:900}.put-title{font-size:var(--font-md);color:var(--clr-text);margin-bottom:4px;font-weight:700}.put-sub{font-size:var(--font-sm);color:var(--clr-text-muted)}.profile-photo-actions{margin-top:var(--space-sm)}.profile-save-note{color:#065f46;padding:var(--space-md);border-radius:var(--radius-sm);font-size:var(--font-sm);margin-top:var(--space-lg);background:#10b9811a;border:1px solid #10b9814d;font-weight:700}.list-item-status{font-size:var(--font-xs);border-radius:100px;align-items:center;gap:5px;padding:3px 10px;font-weight:700;display:inline-flex}.status-pdf{color:#b91c1c;background:#ef44441a}.status-link{color:var(--clr-primary);background:#0f4c811a}@keyframes pulse{0%{opacity:.6}50%{opacity:.3}to{opacity:.6}}.skeleton-pulse{background-color:#e2e8f0;animation:1.5s ease-in-out infinite pulse}@media (width<=992px){.admin-sidebar{transition:left .3s cubic-bezier(.4,0,.2,1);box-shadow:4px 0 24px #0f172a26;left:-260px!important}.admin-sidebar.open{left:0!important}.admin-main{margin-left:0!important;padding:24px 16px!important}.admin-mobile-header,.admin-sidebar-close-btn{display:flex!important}.dash-cards{grid-template-columns:repeat(2,1fr)!important}.list-item{flex-direction:column;align-items:stretch}.list-item-actions{align-self:flex-end;margin-top:12px}}@media (width<=640px){.dash-cards{grid-template-columns:1fr!important}.tab-header{flex-direction:column;align-items:stretch;gap:12px}.btn-add{align-self:flex-start}.form-row{grid-template-columns:1fr;gap:12px}table th:nth-child(3),table td:nth-child(3){display:none}}
