*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:15px;scroll-behavior:smooth}
body{font-family:'Inter',sans-serif;background:#F1F5F1;color:#1E2E1E;min-height:100vh;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer;border:none;background:none}
::selection{background:#0AF32A;color:#0D1A10}
::-webkit-scrollbar{width:5px}
::-webkit-scrollbar-track{background:#F1F5F1}
::-webkit-scrollbar-thumb{background:#07C820;border-radius:9999px}

/* ── Login ── */
.login-screen{
  min-height:100vh;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#0D1A10 0%,#1E3A22 100%);
  padding:1.5rem;
}
.login-card{
  background:#fff;border-radius:20px;padding:2.5rem;
  width:100%;max-width:420px;box-shadow:0 24px 80px rgba(0,0,0,.4);
}
.login-logo{margin-bottom:1.75rem}
.login-card h1{font-family:'Space Grotesk',sans-serif;font-size:1.5rem;font-weight:800;color:#111A11;margin-bottom:.375rem}
.login-sub{font-size:.875rem;color:#8FA48F;margin-bottom:1.75rem;line-height:1.6}
.login-help{font-size:.8125rem;color:#8FA48F;text-align:center;margin-top:1rem}
.login-help a{color:#059918;font-weight:600}

/* ── Form fields ── */
.pfield{margin-bottom:1.125rem}
.pfield label{display:block;font-size:.8125rem;font-weight:700;color:#1E2E1E;margin-bottom:.375rem}
.pfield input,.pfield select,.pfield textarea{
  width:100%;padding:.75rem 1rem;
  background:#F6F8F6;border:1.5px solid #E0E6E0;border-radius:10px;
  font-size:.9375rem;color:#111A11;outline:none;
  transition:border-color .2s,box-shadow .2s;font-family:'Inter',sans-serif;
}
.pfield input:focus,.pfield select:focus,.pfield textarea:focus{border-color:#07C820;background:#fff;box-shadow:0 0 0 3px rgba(10,200,34,.1)}
.pfield textarea{resize:vertical;min-height:100px}
.pfield select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%238FA48F' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:14px;padding-right:2rem;background-color:#F6F8F6;cursor:pointer}
.pform-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}

/* ── Buttons ── */
.pbtn{
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  padding:.6875rem 1.375rem;font-size:.875rem;font-weight:700;
  border-radius:9999px;cursor:pointer;transition:all .25s;border:none;
}
.pbtn-primary{background:#0AF32A;color:#0D1A10}
.pbtn-primary:hover{background:#07C820;transform:translateY(-1px);box-shadow:0 6px 20px rgba(10,200,34,.3)}
.pbtn-outline{background:transparent;color:#1E2E1E;border:1.5px solid #E0E6E0}
.pbtn-outline:hover{background:#F6F8F6;border-color:#C2CEC2}
.pbtn-danger{background:transparent;color:#DC2626;border:1.5px solid #FECACA}
.pbtn-danger:hover{background:#FEF2F2}
.pbtn-sm{padding:.4rem .875rem;font-size:.78rem}
.pbtn-full{width:100%}

/* ── Spinner ── */
.pspinner{
  display:inline-block;width:16px;height:16px;
  border:2px solid rgba(0,0,0,.15);border-top-color:#0D1A10;
  border-radius:50%;animation:pspin .6s linear infinite;vertical-align:middle;
}
@keyframes pspin{to{transform:rotate(360deg)}}
.pload{display:flex;align-items:center;justify-content:center;min-height:200px}

/* ── Alert ── */
.alert{padding:.75rem 1rem;border-radius:10px;font-size:.875rem;margin-bottom:1rem}
.alert-error{background:#FEF2F2;color:#DC2626;border:1px solid #FECACA}
.alert-success{background:#E2FCE8;color:#036B10;border:1px solid rgba(10,200,34,.25)}

/* ── Portal layout ── */
#portalApp{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
.psidebar{
  background:#0D1A10;display:flex;flex-direction:column;
  position:sticky;top:0;height:100vh;overflow-y:auto;
}
.psidebar-logo{padding:1.375rem 1.25rem;border-bottom:1px solid rgba(255,255,255,.07)}
.psidebar-logo img{height:30px;width:auto}
.psidenav{flex:1;padding:.875rem .75rem;display:flex;flex-direction:column;gap:2px}
.pnav-item{
  display:flex;align-items:center;gap:.625rem;
  padding:.625rem .875rem;border-radius:8px;
  font-size:.875rem;font-weight:500;color:rgba(255,255,255,.45);
  cursor:pointer;transition:all .2s;width:100%;text-align:left;
}
.pnav-item::before{content:attr(data-icon);font-size:.875rem;width:18px;text-align:center;flex-shrink:0}
.pnav-item:hover{color:#fff;background:rgba(255,255,255,.07)}
.pnav-item.active{color:#0AF32A;background:rgba(10,243,42,.1)}
.plogout{color:rgba(255,255,255,.3)}
.plogout:hover{color:#ff6b6b;background:rgba(255,107,107,.1)}
.psidebar-footer{padding:.75rem;border-top:1px solid rgba(255,255,255,.07)}

.pmain{display:flex;flex-direction:column;min-height:100vh;overflow:hidden}
.ptopbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:.875rem 1.75rem;
  background:#fff;border-bottom:1px solid #E0E6E0;
  position:sticky;top:0;z-index:10;
}
.ptopbar-title{font-family:'Space Grotesk',sans-serif;font-size:1.0625rem;font-weight:700;color:#111A11}
.ptopbar-right{display:flex;align-items:center;gap:1rem}
.pclient-info{font-size:.8125rem;font-weight:600;color:#8FA48F}
.pmobile-menu-btn{display:none;font-size:1.25rem;color:#1E2E1E;padding:.25rem}
.pcontent{flex:1;padding:1.75rem;overflow-y:auto}

/* ── Cards ── */
.pcard{background:#fff;border:1.5px solid #E0E6E0;border-radius:14px;padding:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.pcard-title{font-family:'Space Grotesk',sans-serif;font-size:.9375rem;font-weight:700;color:#111A11;margin-bottom:1.125rem}

/* ── Stats ── */
.pstats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.75rem}
.pstat{background:#fff;border:1.5px solid #E0E6E0;border-radius:14px;padding:1.375rem;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.pstat-label{font-size:.75rem;font-weight:600;color:#8FA48F;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.5rem}
.pstat-val{font-family:'Space Grotesk',sans-serif;font-size:2rem;font-weight:900;line-height:1}
.pstat-sub{font-size:.78rem;color:#C2CEC2;margin-top:.25rem}

/* ── Table ── */
.ptable-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse}
thead th{padding:.625rem 1rem;text-align:left;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#8FA48F;border-bottom:2px solid #E0E6E0;white-space:nowrap}
tbody td{padding:.875rem 1rem;font-size:.875rem;color:#1E2E1E;border-bottom:1px solid #F1F5F1;vertical-align:middle}
tbody tr:hover{background:#F6F8F6}
tbody tr:last-child td{border-bottom:none}

/* ── Badges ── */
.pbadge{display:inline-block;padding:.2rem .6rem;border-radius:999px;font-size:.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.pb-open{background:#EFF6FF;color:#1D4ED8}
.pb-progress{background:#FFF7ED;color:#C2410C}
.pb-resolved{background:#E2FCE8;color:#036B10}
.pb-closed{background:#F1F5F1;color:#8FA48F}
.pb-low{background:#F1F5F1;color:#8FA48F}
.pb-medium{background:#FFF7ED;color:#C2410C}
.pb-high{background:#FEF2F2;color:#DC2626}
.pb-critical{background:#DC2626;color:#fff}

/* ── Empty state ── */
.pempty{text-align:center;padding:3rem 1rem;color:#C2CEC2}
.pempty p{font-size:.9375rem;margin-top:.5rem}

/* ── Ticket form ── */
.pmodal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:100;display:flex;align-items:center;justify-content:center;padding:1rem}
.pmodal{background:#fff;border-radius:18px;padding:2rem;width:100%;max-width:540px;box-shadow:0 24px 60px rgba(0,0,0,.25)}
.pmodal-title{font-family:'Space Grotesk',sans-serif;font-size:1.25rem;font-weight:800;color:#111A11;margin-bottom:1.5rem}

/* ── Report detail ── */
.report-score-ring{
  width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;
  font-family:'Space Grotesk',sans-serif;font-size:1.5rem;font-weight:900;
}
.rcheck{display:flex;align-items:flex-start;gap:.625rem;padding:.5rem 0;border-bottom:1px solid #F1F5F1;font-size:.875rem}
.rcheck:last-child{border-bottom:none}
.rcheck-icon{flex-shrink:0;margin-top:2px}

/* ── Account ── */
.account-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}

/* ── Toolbar ── */
.ptoolbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.25rem;gap:1rem;flex-wrap:wrap}

/* ── Responsive ── */
@media(max-width:768px){
  #portalApp{grid-template-columns:1fr}
  .psidebar{display:none;position:fixed;inset:0;z-index:200;height:100vh;width:240px}
  .psidebar.mobile-open{display:flex}
  .pmobile-menu-btn{display:block}
  .pstats{grid-template-columns:1fr 1fr}
  .pform-row,.account-grid{grid-template-columns:1fr}
  .pcontent{padding:1rem}
  .ptopbar{padding:.75rem 1rem}
}
@media(max-width:480px){
  .pstats{grid-template-columns:1fr}
  .login-card{padding:1.75rem 1.25rem}
}