:root{--ho-navy:#0b1f3a;--ho-blue:#0d6efd;--ho-green:#18b47e;--ho-bg:#f4f7fb;--ho-text:#172033;--ho-card:#fff}
*{box-sizing:border-box}body{margin:0;background:var(--ho-bg);color:var(--ho-text);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}
a{text-decoration:none}.ho-app{min-height:100vh}.ho-sidebar{position:fixed;left:0;top:0;bottom:0;width:250px;background:linear-gradient(180deg,var(--ho-navy),#102c50);color:#fff;z-index:1030;padding:18px 14px;box-shadow:8px 0 25px #07172b20}
.ho-brand{display:flex;align-items:center;gap:10px;padding:8px 8px 24px}.brand-mark{width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,var(--ho-green),var(--ho-blue));display:grid;place-items:center;font-size:22px;font-weight:800}.ho-brand b{display:block;font-size:14px}.ho-brand small{display:block;color:#b8c7db;font-size:10px;margin-top:2px}
.ho-sidebar nav a{display:flex;align-items:center;gap:12px;color:#dbe6f3;padding:11px 12px;border-radius:10px;margin:4px 0;transition:.2s}.ho-sidebar nav a:hover{background:#ffffff12;color:#fff;transform:translateX(2px)}
.ho-topbar{height:68px;margin-left:250px;background:#fff;border-bottom:1px solid #e7edf5;display:flex;align-items:center;padding:0 24px;position:sticky;top:0;z-index:1020}.ho-online{font-size:12px;color:#65748b}.ho-online i{color:var(--ho-green);font-size:8px}
.ho-main{margin-left:250px;padding:26px}.ho-card{background:var(--ho-card);border:1px solid #e6edf5;border-radius:16px;box-shadow:0 10px 35px #102c5010;padding:20px}.ho-stat{position:relative;overflow:hidden}.ho-stat:after{content:"";position:absolute;width:100px;height:100px;border-radius:50%;background:#18b47e15;right:-30px;top:-30px}.ho-stat .icon{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:#0d6efd12;color:var(--ho-blue);font-size:19px}
.ho-title{font-weight:800;color:var(--ho-navy)}.ho-muted{color:#718096}.table>:not(caption)>*>*{padding:13px 12px;vertical-align:middle}
.ho-login{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top right,#18b47e25,transparent 35%),linear-gradient(135deg,#081a32,#12375a)}
.ho-login-card{width:min(460px,94vw);background:#fff;border-radius:22px;padding:34px;box-shadow:0 25px 80px #0005}.ho-login-logo{text-align:center;margin-bottom:20px}.ho-login-logo .brand-mark{margin:auto}
#hoPreloader{position:fixed;inset:0;background:#081a32;z-index:99999;display:grid;place-items:center;transition:.35s}.ho-loader{text-align:center;color:#fff}.ho-ring{width:54px;height:54px;border:4px solid #ffffff25;border-top-color:var(--ho-green);border-right-color:var(--ho-blue);border-radius:50%;animation:spin .8s linear infinite;margin:auto auto 12px}.ho-loader-text{font-weight:800;letter-spacing:3px;font-size:12px}.hide{opacity:0;visibility:hidden}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:991px){.ho-sidebar{transform:translateX(-100%);transition:.25s}.ho-sidebar.open{transform:translateX(0)}.ho-topbar,.ho-main{margin-left:0}.ho-main{padding:18px}}

/* Standalone authentication pages */
.ho-login .form-control{min-height:46px;border-radius:10px;border:1px solid #d8e1ec;padding:.65rem .8rem}.ho-login .form-control:focus{border-color:var(--ho-blue);box-shadow:0 0 0 .2rem #0d6efd18}.ho-login .btn{min-height:46px;border-radius:10px;font-weight:700}.ho-login-card a{color:var(--ho-blue);font-weight:600}.ho-login-card a:hover{color:var(--ho-green)}
