/* Greenphils — "Order a Bin" journey. One continuous, rounded, shop-style
   ordering experience across Find → Cart → Checkout → Payment → Confirmation.
   Loaded ONLY on the skip bin ordering pages; the rest of the site keeps its
   square blueprint look. Presentation only — no pricing or ordering logic. */
.oj{--oj-g:#142720;--oj-g2:#2E7D32;--oj-gold:#b8860b;--oj-r:10px;--oj-line:#dfe3e1;--oj-tint:#eef5ef;margin:0 0 26px}
.oj-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 18px;margin:0 0 14px}
.oj-title{font-family:var(--font-heading);font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:13px;color:var(--oj-g);display:flex;align-items:center;gap:10px;margin:0}
.oj-title::before{content:"";width:26px;height:3px;background:var(--oj-g2);border-radius:2px}
.oj-links{display:flex;flex-wrap:wrap;gap:8px}
.oj-chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--oj-line);background:#fff;color:var(--oj-g);font-weight:600;font-size:14px;text-decoration:none}
.oj-chip:hover{border-color:var(--oj-g2);background:var(--oj-tint)}
.oj-chip:focus-visible{outline:2px solid var(--oj-gold);outline-offset:2px}
.oj-chip svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.6}
.oj-count{min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--oj-g2);color:#fff;font-size:12.5px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.oj-count[data-zero]{background:#c9d1cc;color:var(--oj-g)}
.oj-steps{list-style:none;margin:0;padding:10px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;background:#fff;border:1px solid var(--oj-line);border-radius:var(--oj-r);box-shadow:0 1px 2px rgba(20,39,32,.05)}
.oj-step{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:6px;min-width:0;color:color-mix(in srgb,var(--color-text) 52%,transparent);font-size:14px;font-weight:600}
.oj-step a{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;min-width:0;width:100%}
.oj-num{flex:0 0 auto;width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid currentColor;font-size:13px;font-weight:700}
.oj-lbl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oj-lbl-s{display:none}
.oj-step.is-done{color:var(--oj-g2)}
.oj-step.is-done .oj-num{background:var(--oj-g2);border-color:var(--oj-g2);color:#fff}
.oj-step.is-done a:hover .oj-lbl{text-decoration:underline}
.oj-step.is-cur{background:var(--oj-g);color:#fff}
.oj-step.is-cur .oj-num{background:#fff;border-color:#fff;color:var(--oj-g)}
@media (max-width:760px){
  .oj-steps{padding:6px;gap:4px}
  .oj-step{flex-direction:column;gap:4px;padding:8px 2px;font-size:12px;text-align:center}
  .oj-step a{flex-direction:column;gap:4px}
  .oj-lbl{display:none}.oj-lbl-s{display:block}
  .oj-num{width:26px;height:26px}
}
/* ---- rounded, shop-style surfaces inside the ordering pages ---- */
.oj-page .co-box,.oj-page .sb-card,.oj-page .sb-help,.oj-page .sb-empty{border-radius:var(--oj-r,10px);background:#fff;border-color:#dfe3e1;box-shadow:0 1px 2px rgba(20,39,32,.05),0 6px 18px -10px rgba(20,39,32,.18);overflow:hidden}
.oj-page .co-box .corner,.oj-page .sb-card .corner,.oj-page .sb-help .corner{display:none}
.oj-page .sb-img{border-bottom-color:#e8ebe9}
.oj-page .sb-card:hover{border-color:#2E7D32;box-shadow:0 2px 4px rgba(20,39,32,.06),0 14px 28px -14px rgba(20,39,32,.3)}
.oj-page .sb-results-head{border-radius:10px}
.oj-page .co-sec .btn,.oj-page .sb-finder .btn,.oj-page .sb-select{border-radius:6px}
.oj-page .co-sec .input,.oj-page .sb-finder .input,.oj-page .sb-pc .input{border-radius:6px}
.oj-page .co-alert,.oj-page #sb-cart-note,.oj-page .sb-help-pick{border-radius:8px}
.oj-page .co-pay{border-radius:8px;border-color:#dfe3e1;background:#fff;cursor:pointer;transition:border-color .15s,background .15s}
.oj-page .co-pay:hover{border-color:#2E7D32}
.oj-page .co-pay:has(input:checked){border-color:#2E7D32;border-width:2px;background:#eef5ef}
.oj-page .co-line{border-top-color:#e8ebe9}
.oj-page .co-steps{display:none}
.oj-added{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px}
.oj-added b{display:inline-flex;align-items:center;gap:8px;color:#2E7D32;font-family:var(--font-heading);text-transform:uppercase;letter-spacing:.06em;font-size:16px}
.oj-added b::before{content:"\2713";width:24px;height:24px;border-radius:50%;background:#2E7D32;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:14px}
.oj-added .btn{border-radius:6px;min-height:42px;text-decoration:none}
#sb-cart-note{background:#fff}
