/* BRTL ERP — authentication & portal hub */
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body.auth{font-family:'Source Sans 3','Segoe UI',Arial,sans-serif;color:#1f2937;background:#f3f6f8;-webkit-font-smoothing:antialiased}
a{color:#00875a;text-decoration:none}a:hover{text-decoration:underline}
.auth-shell{display:grid;grid-template-columns:minmax(380px,46%) 1fr;min-height:100vh}
.auth-brand{position:relative;overflow:hidden;color:#fff;padding:44px 56px;display:flex;flex-direction:column;justify-content:space-between;
  background:radial-gradient(circle at 15% 10%,rgba(255,255,255,.12),transparent 40%),linear-gradient(150deg,#00a65a 0%,#00876f 45%,#1f5f8b 100%)}
.accent-tracking .auth-brand{background:radial-gradient(circle at 15% 10%,rgba(255,255,255,.12),transparent 40%),linear-gradient(150deg,#2c6e8f 0%,#22566f 50%,#00876f 100%)}
.accent-greenflow .auth-brand{background:radial-gradient(circle at 15% 10%,rgba(255,255,255,.14),transparent 40%),linear-gradient(150deg,#5cb85c 0%,#00a65a 50%,#00796b 100%)}
.auth-brand:after{content:"";position:absolute;right:-140px;bottom:-140px;width:420px;height:420px;border-radius:50%;
  background:url("../../img/sdg-watermark.jpg") center/cover;opacity:.12;mix-blend-mode:screen}
.brand-top{display:flex;align-items:center;gap:14px;position:relative;z-index:1}
.brand-logo{height:44px;width:auto}
.brand-name{font-size:22px;font-weight:700;letter-spacing:.5px;border-left:1px solid rgba(255,255,255,.4);padding-left:14px}
.brand-copy{position:relative;z-index:1;max-width:520px}
.brand-copy h1{font-size:40px;line-height:1.15;margin:0 0 16px;font-weight:700}
.brand-copy h1 span{color:#c8f7dc}
.brand-copy p{font-size:17px;opacity:.92;margin:0 0 22px}
.brand-points{list-style:none;margin:0;padding:0}
.brand-points li{font-size:16px;margin:10px 0;display:flex;gap:10px;align-items:center}
.brand-points .fa{color:#c8f7dc;font-size:18px}
.brand-partners{position:relative;z-index:1}
.brand-partners span{font-size:12px;letter-spacing:.12em;text-transform:uppercase;opacity:.8}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.chips img{height:46px;width:auto;max-width:120px;object-fit:contain;background:#fff;border-radius:8px;padding:5px 8px}
.auth-main{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px}
.auth-card{width:100%;max-width:470px;background:#fff;border-radius:16px;box-shadow:0 12px 40px rgba(16,40,60,.12);padding:34px 36px}
.portal-badge{display:inline-flex;align-items:center;gap:8px;background:#e6f6ee;color:#00804f;font-weight:700;font-size:13px;border-radius:99px;padding:6px 14px;margin-bottom:14px}
.accent-tracking .portal-badge{background:#e3eef5;color:#22566f}
.auth-card h2{margin:0 0 4px;font-size:28px;color:#111827}
.muted{color:#6b7280}.small{font-size:13px}
.auth-card>.muted{margin:0 0 22px}
.fld{display:block;margin-bottom:16px}
.fld>span{display:block;font-weight:600;font-size:14px;margin-bottom:6px;color:#374151}
.inp{position:relative;display:flex;align-items:center;border:1.5px solid #d6dde3;border-radius:10px;background:#fff;transition:border-color .15s,box-shadow .15s}
.inp:focus-within{border-color:#00a65a;box-shadow:0 0 0 4px rgba(0,166,90,.12)}
.accent-tracking .inp:focus-within{border-color:#2c6e8f;box-shadow:0 0 0 4px rgba(44,110,143,.14)}
.inp>.fa{width:42px;text-align:center;color:#9aa5b1;font-size:16px}
.inp input{flex:1;border:0;outline:0;padding:13px 12px 13px 0;font-size:16px;background:transparent;font-family:inherit;min-width:0}
.eye{border:0;background:none;color:#6b7280;cursor:pointer;padding:0 14px;font-size:16px}
.row-between{display:flex;justify-content:space-between;align-items:center;margin:4px 0 20px}
.check{display:flex;gap:8px;align-items:center;font-size:15px;color:#374151}
.btn-auth{width:100%;border:0;border-radius:10px;padding:14px;font-size:17px;font-weight:700;color:#fff;cursor:pointer;
  background:linear-gradient(90deg,#00a65a,#00897b);box-shadow:0 6px 16px rgba(0,166,90,.25);font-family:inherit}
.accent-tracking .btn-auth{background:linear-gradient(90deg,#2c6e8f,#00897b);box-shadow:0 6px 16px rgba(44,110,143,.25)}
.btn-auth:hover{filter:brightness(.96)}
.switch{text-align:center;margin:18px 0 0;font-size:15px}
.demo{background:#f6f8fa;border-radius:10px;padding:10px 14px;font-size:13px;color:#6b7280;margin:16px 0 0}
.alert{border-radius:10px;padding:10px 14px;margin-bottom:14px;font-size:14.5px}
.alert.error{background:#fdecea;color:#a12a1b}.alert.success{background:#e6f6ee;color:#00653f}
.alert.info,.alert.warning{background:#fff6e0;color:#8a5a00}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.auth-foot{margin-top:18px;font-size:13px;color:#6b7280}
/* hub */
.auth-card:has(.hub){max-width:560px}
.continue{display:flex;align-items:center;justify-content:center;gap:8px;background:#e6f6ee;border-radius:10px;padding:11px;font-weight:700;margin-bottom:16px}
.hub{display:flex;flex-direction:column;gap:14px}
.hub-group{border:1px solid #e5eaee;border-radius:12px;overflow:hidden}
.hub-head{display:flex;gap:12px;align-items:center;padding:12px 14px;background:#f8fafb}
.hub-head small{display:block;color:#6b7280;font-size:13px}
.dot{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:17px;flex:none}
.dot.green{background:#00a65a}.dot.teal{background:#00897b}.dot.blue{background:#2c6e8f}
.hub-links{display:grid;grid-template-columns:1fr 1fr}
.hub-link{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-top:1px solid #eef2f4;color:#1f2937;font-weight:600}
.hub-link+.hub-link{border-left:1px solid #eef2f4}
.hub-link:hover{background:#f2fbf6;text-decoration:none}
.hub-link em{font-style:normal;background:#2563eb;color:#fff;border-radius:6px;padding:3px 12px;font-size:14px}
.hub-link .fa{color:#00a65a;width:18px}
@media (max-width:960px){
  .auth-shell{grid-template-columns:1fr}
  .auth-brand{padding:26px 24px}
  .brand-copy h1{font-size:28px}.brand-copy p,.brand-points{display:none}
  .chips img{height:36px}
  .auth-main{padding:24px 14px}
  .auth-card{padding:26px 20px}
}
@media (max-width:520px){.grid2,.hub-links{grid-template-columns:1fr}.hub-link+.hub-link{border-left:0}}
.hub-link:only-child{grid-column:1/-1}
.quick{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:14px}
.quick a{background:#f2f7f4;border-radius:20px;padding:6px 14px;font-size:14px;font-weight:600}