:root{
  --primary:#0A3D91; --secondary:#00AEEF; --accent:#FF9800; --bg:#F8FAFC; --text:#212529;
}
*{box-sizing:border-box;}
body{font-family:'Inter',sans-serif; background:var(--bg); color:var(--text); margin:0;}
h1,h2,h3,h4,h5,h6{font-family:'Poppins',sans-serif;}

.portal-wrapper{display:flex; min-height:100vh;}

.portal-sidebar{
  width:250px; background:#08213e; color:#c7d6ea; flex-shrink:0; position:sticky; top:0; height:100vh;
  overflow-y:auto; display:flex; flex-direction:column;
}
.portal-brand{font-family:'Poppins',sans-serif; font-weight:800; font-size:1.2rem; color:#fff; padding:22px 20px; border-bottom:1px solid rgba(255,255,255,.08);}
.portal-brand span{color:var(--accent);}
.portal-brand img{max-height:36px;}
.portal-nav{padding:14px 0; flex-grow:1;}
.portal-nav a{
  display:flex; align-items:center; gap:10px; padding:12px 22px; color:#a9bcd6; text-decoration:none; font-size:.92rem; font-weight:500;
}
.portal-nav a:hover, .portal-nav a.active{background:rgba(255,255,255,.06); color:#fff; border-left:3px solid var(--accent);}
.badge-count{background:var(--accent); color:#fff; border-radius:20px; font-size:.7rem; padding:1px 8px; margin-left:auto;}
.portal-sidebar-footer{padding:16px 22px; border-top:1px solid rgba(255,255,255,.08);}
.portal-sidebar-footer a{display:flex; align-items:center; gap:8px; color:#a9bcd6; text-decoration:none; font-size:.85rem; padding:6px 0;}
.portal-sidebar-footer a:hover{color:#fff;}

.portal-main{flex:1; min-width:0;}
.portal-topbar{
  background:#fff; padding:14px 26px; display:flex; align-items:center; justify-content:space-between;
  box-shadow:0 2px 8px rgba(0,0,0,.04); position:sticky; top:0; z-index:10;
}
.sidebar-toggle{border:none; background:none; font-size:1.4rem; margin-right:10px;}
.topbar-user{font-size:.9rem; font-weight:600;}
.portal-content{padding:26px;}

.portal-card{background:#fff; border-radius:10px; padding:24px; box-shadow:0 4px 16px rgba(0,0,0,.05); margin-bottom:22px;}
.portal-stat{background:#fff; border-radius:10px; padding:20px; box-shadow:0 4px 16px rgba(0,0,0,.05); border-left:4px solid var(--primary); height:100%;}
.portal-stat h3{font-size:1.7rem; margin:0; color:var(--primary);}
.portal-stat p{margin:0; color:#6c7a89; font-size:.82rem;}

.progress{height:8px; border-radius:20px;}
.progress-bar{background:var(--secondary);}

.ticket-thread{max-height:420px; overflow-y:auto; padding-right:6px;}
.ticket-msg{border-radius:10px; padding:14px 16px; margin-bottom:12px; max-width:80%;}
.ticket-msg.from-customer{background:#eef4fd; margin-left:auto;}
.ticket-msg.from-admin{background:#f1f3f6;}
.ticket-msg .meta{font-size:.72rem; color:#6c7a89; margin-top:4px;}

.btn-brand{background:var(--primary); color:#fff; border:none;}
.btn-brand:hover{background:#072a66; color:#fff;}
table.table thead{background:#f1f5fb;}
.table thead th{font-size:.78rem; text-transform:uppercase; letter-spacing:.4px; color:#6c7a89; border-bottom:2px solid #e5ebf3;}

/* Login/forgot-password screens */
.portal-auth-wrap{min-height:100vh; display:flex; align-items:center; background:linear-gradient(120deg,#0A3D91,#00AEEF);}
.portal-auth-card{background:#fff; border-radius:14px; padding:44px; max-width:420px; margin:auto; box-shadow:0 20px 50px rgba(0,0,0,.2);}
.portal-auth-brand{font-family:'Poppins',sans-serif; font-weight:800; font-size:1.5rem; color:#0A3D91; text-align:center; margin-bottom:6px;}
.portal-auth-brand span{color:#FF9800;}

@media(max-width:991px){
  .portal-sidebar{position:fixed; left:-250px; z-index:1000; transition:.25s;}
  .portal-wrapper.sidebar-open .portal-sidebar{left:0;}
}