:root{--maroon:#7d1730;--maroon-dark:#5e1025;--maroon-soft:#f6edf0;--green:#176b45;--ink:#25252b;--muted:#73757c;--line:#e8e8ec;--bg:#f5f6f8}
*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--ink);background:var(--bg)}a{text-decoration:none}.app-body{background:#f4f5f7}.app-shell{min-height:100vh;display:flex}.app-sidebar{width:250px;background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;z-index:20}.brand-block{height:86px;padding:20px 22px;display:flex;gap:12px;align-items:center;border-bottom:1px solid var(--line)}.brand-mark{width:42px;height:42px;border-radius:12px;background:var(--maroon);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:23px;font-weight:800}.brand-name{font-weight:800;letter-spacing:.08em;font-size:14px}.brand-subtitle{font-size:10px;color:var(--muted);letter-spacing:.16em;margin-top:2px}.sidebar-label{font-size:10px;letter-spacing:.15em;color:#999;padding:24px 22px 8px;font-weight:700}.sidebar-nav{padding:0 12px}.sidebar-link{display:flex;width:100%;align-items:center;gap:12px;padding:12px 12px;border:0;background:transparent;color:#555962;border-radius:10px;font-size:14px;font-weight:600;margin-bottom:5px}.sidebar-link:hover{background:var(--maroon-soft);color:var(--maroon)}.sidebar-link span{width:22px;text-align:center;font-size:18px}.sidebar-primary{background:var(--maroon);color:#fff!important}.sidebar-primary:hover{background:var(--maroon-dark)}.sidebar-bottom{margin-top:auto;padding-bottom:18px}.sidebar-logout{cursor:pointer;text-align:left}.app-main{margin-left:250px;min-width:0;min-height:100vh;display:flex;flex-direction:column;width:calc(100% - 250px)}.app-header{height:76px;background:var(--maroon);color:#fff;padding:0 30px;display:flex;align-items:center;justify-content:space-between}.header-title{display:flex;flex-direction:column}.eyebrow{font-size:9px;letter-spacing:.2em;opacity:.7}.header-page{font-size:19px;font-weight:700}.header-actions{display:flex;align-items:center;gap:12px}.social-link{color:#fff;width:32px;height:32px;border:1px solid rgba(255,255,255,.25);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:700}.profile-pill{display:flex;align-items:center;gap:8px;padding:7px 12px 7px 7px;border:1px solid rgba(255,255,255,.25);border-radius:30px;font-size:13px}.avatar{width:28px;height:28px;border-radius:50%;background:#fff;color:var(--maroon);display:inline-flex;align-items:center;justify-content:center;font-weight:800}.page-content{width:100%;max-width:1500px;margin:0 auto;padding:30px;flex:1}.app-footer{background:var(--green);color:#fff;overflow:hidden;height:38px;display:flex;align-items:center}.footer-track{display:flex;gap:45px;white-space:nowrap;animation:footerMove 25s linear infinite;padding-left:100%;font-size:12px;font-weight:600}.footer-track span{display:inline-block}@keyframes footerMove{to{transform:translateX(-100%)}}.card{border:1px solid var(--line);border-radius:16px;box-shadow:0 8px 25px rgba(25,25,35,.04)}.table{vertical-align:middle}.table thead th{background:#fafafa;color:#777;font-size:11px;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--line)}.table tbody td{padding:15px 12px;border-color:#f0f0f2}.btn-primary{background:var(--maroon);border-color:var(--maroon)}.btn-primary:hover{background:var(--maroon-dark);border-color:var(--maroon-dark)}.badge{padding:.5em .75em;border-radius:999px}.badge-status-Open{background:#edf0f2;color:#555}.badge-status-InProgress{background:#eee7f8;color:#5e2b83}.badge-status-Resolved{background:#e6f5ed;color:#176b45}.badge-status-Closed{background:#e9eaed;color:#333}.badge-priority-Low{background:#edf0f2;color:#555}.badge-priority-Medium{background:#e9f3f7;color:#126078}.badge-priority-High{background:#fff0e4;color:#a44c00}.badge-priority-Critical{background:#fce8ec;color:#a20f31}.stat-card{background:#fff;padding:20px!important;min-height:120px}.stat-card h2{font-size:30px;margin:7px 0 0;font-weight:800}.validation-box:empty{display:none}
/* Full-screen login */
.login-page{min-height:100vh;background:#fff;overflow-x:hidden}.login-topbar{height:76px;padding:0 5%;display:flex;justify-content:space-between;align-items:center;background:#fff;border-bottom:1px solid #eee}.login-brand{display:flex;align-items:center;gap:11px}.login-brand .brand-mark{width:38px;height:38px}.login-brand strong{display:block;font-size:13px;letter-spacing:.08em;color:var(--maroon)}.login-brand small{display:block;font-size:9px;letter-spacing:.14em;color:#888}.login-links{display:flex;gap:25px}.login-links a{font-size:12px;color:#62656b;font-weight:600}.login-layout{min-height:calc(100vh - 76px);display:grid;grid-template-columns:minmax(0,1.55fr) minmax(390px,.7fr)}.login-hero{background:linear-gradient(135deg,#5f1026 0%,#801a36 62%,#6c122d 100%);color:#fff;position:relative;overflow:hidden;padding:7vh 6vw 5vh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.85fr);gap:38px;align-items:center}.login-hero:before,.login-hero:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.12);border-radius:50%;pointer-events:none}.login-hero:before{width:650px;height:650px;right:-250px;top:-200px}.login-hero:after{width:420px;height:420px;left:-240px;bottom:-250px}.hero-copy{position:relative;z-index:2}.hero-kicker{font-size:13px;font-weight:800;letter-spacing:.18em;margin-bottom:24px;opacity:.9}.hero-copy h1{font-size:clamp(44px,4.5vw,78px);line-height:.98;letter-spacing:-.045em;margin:0 0 28px;font-weight:800}.hero-copy h1 span{font-weight:800}.hero-copy p{max-width:650px;font-size:18px;line-height:1.65;color:rgba(255,255,255,.84);margin-bottom:28px}.hero-pills{display:flex;gap:10px;flex-wrap:wrap}.hero-pills span{padding:12px 17px;border-radius:28px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);font-size:13px}.hero-gallery{position:relative;z-index:2;width:100%;height:360px;border-radius:26px;padding:16px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(4px);box-shadow:0 25px 55px rgba(0,0,0,.2)}.gallery-slide{position:absolute;inset:16px;opacity:0;transform:translateX(25px);transition:opacity .7s ease,transform .7s ease;pointer-events:none}.gallery-slide.active{opacity:1;transform:none}.gallery-slide img{width:100%;height:100%;object-fit:cover;border-radius:18px;display:block}.gallery-caption{position:absolute;left:28px;bottom:28px;background:rgba(58,8,23,.78);padding:11px 15px;border-radius:12px;display:flex;flex-direction:column;gap:2px}.gallery-caption b{font-size:11px;letter-spacing:.12em}.gallery-caption span{font-size:12px;color:rgba(255,255,255,.8)}.gallery-dots{position:absolute;right:28px;bottom:30px;display:flex;gap:7px;z-index:4}.gallery-dot{width:8px;height:8px;border:0;border-radius:50%;background:#fff;opacity:.4;padding:0}.gallery-dot.active{width:24px;border-radius:8px;opacity:1}.login-panel{background:#fff;display:flex;flex-direction:column;justify-content:center;padding:50px 5vw;position:relative}.login-card{max-width:460px;width:100%;margin:0 auto}.login-icon{width:54px;height:54px;border-radius:16px;background:var(--maroon-soft);display:flex;align-items:center;justify-content:center;font-size:23px;margin-bottom:24px}.login-heading span{font-size:10px;letter-spacing:.18em;font-weight:800;color:var(--maroon)}.login-heading h2{font-size:29px;margin:7px 0}.login-heading p{color:#777;margin-bottom:28px}.field{margin-bottom:18px}.field label{font-size:12px;font-weight:700;margin-bottom:7px;display:block;color:#46484e}.field .form-control{height:50px;border:1px solid #dfe1e6;border-radius:11px;box-shadow:none;padding:0 14px}.field .form-control:focus{border-color:var(--maroon);box-shadow:0 0 0 3px rgba(125,23,48,.1)}.login-options{display:flex;justify-content:space-between;margin:3px 0 20px}.remember{font-size:12px;color:#686a70}.remember input{accent-color:var(--maroon)}.login-submit{width:100%;height:52px;border:0;border-radius:11px;background:var(--maroon);color:#fff;font-weight:700;font-size:15px;display:flex;align-items:center;justify-content:center;gap:12px;box-shadow:0 10px 25px rgba(125,23,48,.22)}.login-submit:hover{background:var(--maroon-dark)}.login-note{margin-top:18px;padding:12px 14px;background:#faf7f8;border:1px solid #f0e1e6;border-radius:10px;color:#777;font-size:11px}.login-note span{color:var(--green)}.login-footer{position:absolute;bottom:20px;left:0;right:0;text-align:center;font-size:10px;color:#999}
/* dashboard polish */
.page-hero{background:#fff;border:1px solid var(--line);border-radius:20px;padding:28px 30px;margin-bottom:22px;display:flex;justify-content:space-between;align-items:center}.page-hero h1{font-size:27px;font-weight:800;margin:0}.page-hero p{color:var(--muted);margin:7px 0 0}.section-title{font-size:15px;font-weight:800;margin-bottom:14px}.toolbar{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:16px}.toolbar .form-control,.toolbar .form-select{border-radius:10px}.ticket-link{font-weight:800;color:var(--maroon)}.ticket-link:hover{text-decoration:underline}.empty-state{text-align:center;padding:55px 20px;color:var(--muted)}
@media(max-width:1100px){.login-layout{grid-template-columns:1fr}.login-hero{grid-template-columns:1fr;padding:55px 6vw}.hero-gallery{max-width:680px;height:330px}.login-panel{padding:55px 6vw}.login-footer{position:static;margin-top:35px}.app-sidebar{width:210px}.app-main{margin-left:210px;width:calc(100% - 210px)}}
@media(max-width:760px){.app-sidebar{position:static;width:100%;height:auto}.app-shell{display:block}.app-main{margin-left:0;width:100%}.sidebar-nav,.sidebar-bottom{display:none}.app-header{padding:0 16px}.header-actions .social-link{display:none}.profile-pill{font-size:11px}.page-content{padding:18px}.login-topbar{padding:0 18px}.login-links{display:none}.login-hero{padding:42px 20px}.hero-copy h1{font-size:48px}.hero-copy p{font-size:15px}.hero-gallery{height:260px}.login-panel{padding:40px 22px}.footer-track{animation-duration:18s}}
.som-logo {
    width: 75px;
    height: 75px;
    object-fit: contain;
    background: white;
    border-radius: 10px;
    padding: 5px;
    margin-right: 12px;
}

.brand-block {
    display: flex;
    align-items: center;
    gap: 10px;
}
.hero-logo {
    width: 120px;
    height: 90px;
    object-fit: contain;
    margin-bottom: 20px;
    display: block;
}

.hero {
    position: relative;
}

.hero-content {
    position: relative;
    z-index: 2;
}