/* ================================================================
   ReSource Exchange — shared design system
   Reuses the WSE Waste Exchange token names/values so these screens
   sit naturally alongside the existing dashboard.
================================================================= */

:root{
  --wse-navy:#0e3b2c;
  --wse-navy-deep:#082017;
  --wse-purple:#2f6b45;
  --wse-orange:#e2a53a;
  --wse-orange-light:#f2c874;
  --wse-green:#1f9d55;
  --wse-red:#d64545;
  --wse-bg:#f5f7f1;
  --wse-card:#ffffff;
  --wse-line:#e2e7dc;
  --wse-text:#1a241d;
  --wse-text-soft:#5c6b5f;
  --shadow-sm:0 2px 10px rgba(14,59,44,.08);
  --shadow-md:0 10px 30px rgba(14,59,44,.12);
  --shadow-lg:0 20px 50px rgba(14,59,44,.18);
  --radius:16px;
  font-size:16px;
}
*{box-sizing:border-box;}
body{
  font-family:'Manrope',sans-serif;
  background:var(--wse-bg);
  color:var(--wse-text);
}
h1,h2,h3,h4,.display-font{font-family:'Space Grotesk',sans-serif;}
a{text-decoration:none;color:inherit;}
::selection{background:var(--wse-orange);color:#fff;}
::-webkit-scrollbar{height:6px;width:6px;}
::-webkit-scrollbar-thumb{background:var(--wse-purple);border-radius:10px;}

/* ===== Top utility strip ===== */
.rx-utilbar{background:var(--wse-navy-deep);color:#c8d6c9;font-size:.78rem;padding:7px 0;}
.rx-utilbar a{color:#c8d6c9;transition:.2s;}
.rx-utilbar a:hover{color:#fff;}

/* ===== Header / brand ===== */
.rx-header{background:#fff;padding:14px 0;border-bottom:1px solid var(--wse-line);position:sticky;top:0;z-index:1000;box-shadow:var(--shadow-sm);}
.rx-logo{display:flex;align-items:center;gap:10px;}
.rx-logo .mark{
  width:38px;height:38px;border-radius:10px;
  background:linear-gradient(135deg,var(--wse-navy),var(--wse-green));
  display:flex;align-items:center;justify-content:center;
  font-family:'Space Grotesk';font-weight:700;color:#fff;font-size:1.1rem;
  flex-shrink:0;
}
.rx-logo .txt{font-family:'Space Grotesk';font-weight:700;font-size:1.25rem;color:var(--wse-navy);line-height:1.1;}
.rx-logo .txt small{display:block;font-family:'Manrope';font-weight:600;font-size:.62rem;letter-spacing:.5px;color:var(--wse-text-soft);text-transform:uppercase;}

.rx-nav{display:flex;align-items:center;gap:6px;}
.rx-nav a{
  color:var(--wse-text-soft);font-weight:600;font-size:.88rem;padding:10px 14px;border-radius:8px;transition:.2s;
}
.rx-nav a:hover{color:var(--wse-navy);background:var(--wse-bg);}
.rx-nav a.active{color:var(--wse-navy);background:#eef3e9;}

.btn-rx{
  border:none;border-radius:10px;font-weight:700;font-size:.88rem;padding:10px 20px;transition:.2s;display:inline-flex;align-items:center;gap:8px;justify-content:center;
}
.btn-rx-primary{background:var(--wse-green);color:#fff;}
.btn-rx-primary:hover{background:#188243;color:#fff;transform:translateY(-1px);box-shadow:var(--shadow-sm);}
.btn-rx-outline{background:#fff;border:1.5px solid var(--wse-line);color:var(--wse-navy);}
.btn-rx-outline:hover{border-color:var(--wse-green);color:var(--wse-green);}
.btn-rx-navy{background:var(--wse-navy);color:#fff;}
.btn-rx-navy:hover{background:#0a2e22;color:#fff;}
.btn-rx-danger{background:#fff;border:1.5px solid var(--wse-red);color:var(--wse-red);}
.btn-rx-danger:hover{background:var(--wse-red);color:#fff;}
.btn-rx-ghost{background:transparent;border:1.5px solid var(--wse-line);color:var(--wse-text-soft);}
.btn-rx-ghost:hover{border-color:var(--wse-navy);color:var(--wse-navy);}
.btn-rx.w-100{width:100%;}
.btn-rx:disabled{opacity:.5;cursor:not-allowed;}

/* ===== Cards ===== */
.rx-card{background:var(--wse-card);border:1px solid var(--wse-line);border-radius:var(--radius);box-shadow:var(--shadow-sm);}
.rx-card-pad{padding:24px;}
.rx-card-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px;}
.rx-card-head h2,.rx-card-head h3{margin:0;font-weight:700;}
.rx-eyebrow{font-size:.72rem;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--wse-green);}

/* ===== Badges ===== */
.rx-badge{display:inline-flex;align-items:center;gap:5px;padding:4px 12px;border-radius:20px;font-size:.72rem;font-weight:700;letter-spacing:.2px;}
.rx-badge-green{background:#e6f6ea;color:var(--wse-green);}
.rx-badge-orange{background:#fdf1de;color:#b5791f;}
.rx-badge-red{background:#fbe9e9;color:var(--wse-red);}
.rx-badge-navy{background:#e9eeec;color:var(--wse-navy);}

/* ===== Forms ===== */
.rx-form-label{font-weight:700;font-size:.82rem;color:var(--wse-text);margin-bottom:6px;display:block;}
.rx-input,.form-select.rx-input,textarea.rx-input{
  width:100%;border:1.5px solid var(--wse-line);border-radius:10px;padding:11px 14px;font-size:.92rem;
  background:#fbfcf9;transition:.2s;color:var(--wse-text);
}
.rx-input:focus{outline:none;border-color:var(--wse-green);box-shadow:0 0 0 4px rgba(31,157,85,.12);background:#fff;}
.rx-upload-row{
  display:flex;align-items:center;justify-content:space-between;
  border:1.5px dashed var(--wse-line);border-radius:10px;padding:12px 16px;margin-bottom:10px;background:#fbfcf9;transition:.2s;
}
.rx-upload-row:hover{border-color:var(--wse-green);}
.rx-upload-row .name{font-weight:600;font-size:.88rem;}
.rx-upload-row .status{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.8rem;}
.rx-upload-row .status.pending{border:1.5px dashed var(--wse-line);color:var(--wse-text-soft);}
.rx-upload-row .status.done{background:var(--wse-green);color:#fff;}

/* Account-type selector (register page) */
.rx-type-card{
  border:1.5px solid var(--wse-line);border-radius:14px;padding:18px 14px;text-align:center;cursor:pointer;transition:.2s;background:#fff;height:100%;
}
.rx-type-card:hover{border-color:var(--wse-green);transform:translateY(-2px);box-shadow:var(--shadow-sm);}
.rx-type-card.selected{border-color:var(--wse-green);background:#f2faf4;box-shadow:0 0 0 3px rgba(31,157,85,.12);}
.rx-type-card i{font-size:1.6rem;color:var(--wse-green);margin-bottom:8px;display:block;}
.rx-type-card .lbl{font-weight:700;font-size:.85rem;}

/* ===== Sidebar shell (dashboard pages) ===== */
.rx-shell{display:flex;min-height:calc(100vh - 64px);}
.rx-sidebar{
  width:236px;flex-shrink:0;background:var(--wse-navy-deep);color:#cfe0d1;padding:20px 14px;
}
.rx-sidebar .rx-side-link{
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;font-weight:600;font-size:.86rem;color:#b9cdba;margin-bottom:2px;transition:.2s;
}
.rx-sidebar .rx-side-link i{font-size:1rem;width:18px;text-align:center;}
.rx-sidebar .rx-side-link:hover{background:rgba(255,255,255,.06);color:#fff;}
.rx-sidebar .rx-side-link.active{background:var(--wse-green);color:#fff;}
.rx-sidebar .rx-side-section{font-size:.65rem;text-transform:uppercase;letter-spacing:.8px;color:#6f8971;font-weight:700;margin:18px 0 6px 12px;}
.rx-main{flex:1;padding:26px 30px;min-width:0;}

/* ===== Stat tiles ===== */
.rx-stat{background:var(--wse-card);border:1px solid var(--wse-line);border-radius:14px;padding:18px 20px;height:100%;}
.rx-stat .lbl{font-size:.78rem;color:var(--wse-text-soft);font-weight:600;margin-bottom:8px;}
.rx-stat .val{font-family:'Space Grotesk';font-weight:800;font-size:1.55rem;color:var(--wse-navy);}
.rx-stat .sub{font-size:.78rem;font-weight:700;margin-top:6px;}
.rx-stat .sub.up{color:var(--wse-green);}
.rx-stat .sub.down{color:var(--wse-red);}

/* ===== Tables ===== */
.rx-table{width:100%;border-collapse:collapse;font-size:.87rem;}
.rx-table thead th{
  text-align:left;padding:12px 16px;background:#f3f6f0;color:var(--wse-text-soft);font-weight:700;font-size:.72rem;
  text-transform:uppercase;letter-spacing:.4px;white-space:nowrap;border-bottom:1px solid var(--wse-line);
}
.rx-table tbody td{padding:13px 16px;border-bottom:1px solid var(--wse-line);vertical-align:middle;}
.rx-table tbody tr:hover td{background:#fbfcf9;}
.rx-table tbody tr:last-child td{border-bottom:none;}

/* ===== Status timeline (logistics) — reflects real tracked states, not decorative numbering ===== */
.rx-timeline{list-style:none;margin:0;padding:0;}
.rx-timeline li{display:flex;gap:14px;padding-bottom:22px;position:relative;}
.rx-timeline li:last-child{padding-bottom:0;}
.rx-timeline li::before{
  content:'';position:absolute;left:11px;top:26px;bottom:0;width:2px;background:var(--wse-line);
}
.rx-timeline li:last-child::before{display:none;}
.rx-timeline .dot{
  width:24px;height:24px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:.7rem;z-index:1;
}
.rx-timeline li.done .dot{background:var(--wse-green);color:#fff;}
.rx-timeline li.current .dot{background:#fff;border:2.5px solid var(--wse-orange);color:var(--wse-orange);}
.rx-timeline li.upcoming .dot{background:#fff;border:2px solid var(--wse-line);color:var(--wse-line);}
.rx-timeline .t-title{font-weight:700;font-size:.9rem;}
.rx-timeline .t-time{font-size:.78rem;color:var(--wse-text-soft);}
.rx-timeline li.upcoming .t-title{color:var(--wse-text-soft);}

/* ===== Footer ===== */
.rx-footer{background:var(--wse-navy-deep);color:#a9c2ab;padding:30px 0 16px;font-size:.84rem;margin-top:40px;}
.rx-footer a{color:#a9c2ab;}
.rx-footer a:hover{color:var(--wse-orange-light);}

/* ===== Utility ===== */
.text-green{color:var(--wse-green);}
.text-navy{color:var(--wse-navy);}
.text-soft{color:var(--wse-text-soft);}
.bg-soft{background:var(--wse-bg);}

@media (max-width:991px){
  .rx-sidebar{display:none;}
  .rx-main{padding:20px 16px;}
}