/* NextShift — mobile-first marketplace UI */
:root{
  /* NextShift CI v1.0 */
  --ns-forest:#1E2A24; --ns-forest-2:#2A3A32; --ns-charcoal:#161A19;
  --ns-orange:#F97316; --ns-orange-dk:#DC5F0B; --ns-orange-soft:#FEF0E6;
  --ns-warm:#F9F7F2; --ns-cream:#F9F7F2; --ns-white:#fff;
  --ns-slate:#6B7280; --ns-sand:#D6D1C7; --ns-highlight:#E8EEF2;
  --ns-ink:#1E2A24; --ns-muted:#6B7280; --ns-line:#D6D1C7;
  --ns-good:#1E8A5F; --ns-good-soft:#E6F4EE; --ns-warn:#B4690E; --ns-warn-soft:#FDF1DF;
  --ns-bad:#B3261E; --ns-bad-soft:#FCEBEA;
  --ns-font:"Montserrat",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --ns-r:14px; --ns-r-sm:10px;
  --ns-shadow:0 1px 2px rgba(30,42,36,.06),0 6px 18px rgba(30,42,36,.07);
}
.ns{ font-family:var(--ns-font); color:var(--ns-ink); line-height:1.55; -webkit-font-smoothing:antialiased; }
.ns *,.ns *::before,.ns *::after{ box-sizing:border-box; }
.ns-wrap{ width:100%; max-width:760px; margin:0 auto; padding:20px 16px 72px; }
.ns-wrap--wide{ max-width:1100px; }
/* CI typography: H1 bold uppercase, H2 bold, H3 semibold, body regular */
.ns h1,.ns h2,.ns h3,.ns h4{ margin:0 0 .45em; line-height:1.15; font-family:var(--ns-font); color:var(--ns-ink); }
.ns h1{ font-size:1.7rem; font-weight:800; text-transform:uppercase; letter-spacing:-.01em; }
.ns h1.ns-h1--plain{ text-transform:none; letter-spacing:-.02em; }
.ns-more{ margin-top:10px; }
.ns-more > summary{ cursor:pointer; font-weight:700; font-size:.9rem; color:var(--ns-forest);
  list-style:none; padding:10px 0; display:flex; align-items:center; gap:6px; }
.ns-more > summary::-webkit-details-marker{ display:none; }
.ns-more > summary::after{ content:"▾"; color:var(--ns-orange); }
.ns-more[open] > summary::after{ content:"▴"; }
.ns-consent{ display:flex; gap:10px; align-items:flex-start; font-size:.85rem; color:var(--ns-muted); margin:4px 0 16px; }
.ns-consent input{ width:22px; height:22px; margin-top:1px; flex:0 0 auto; }
.ns h2{ font-size:1.28rem; font-weight:700; letter-spacing:-.01em; text-transform:none; }
.ns h3{ font-size:1.03rem; font-weight:600; text-transform:none; }
.ns h4{ font-size:.95rem; font-weight:600; }
.ns-eyebrow{ font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--ns-slate); margin:0 0 8px; }
.ns-rule{ display:block; width:64px; height:4px; background:var(--ns-orange); border-radius:2px; margin:12px 0 16px; }
.ns p{ margin:0 0 1em; }
.ns a{ color:var(--ns-forest); }
.ns-muted{ color:var(--ns-muted); }
.ns-small{ font-size:.86rem; }
.ns-tiny{ font-size:.78rem; }
.ns-center{ text-align:center; }
.ns-mt{ margin-top:18px; } .ns-mt-s{ margin-top:10px; } .ns-mb{ margin-bottom:18px; }
.ns-row{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.ns-row--tight{ gap:6px; }
.ns-spread{ display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }
.ns-grow{ flex:1 1 auto; min-width:0; }

/* buttons */
.ns-btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:52px; padding:14px 20px; border-radius:var(--ns-r); border:0; cursor:pointer;
  font-size:.95rem; font-weight:700; text-decoration:none; text-align:center;
  text-transform:uppercase; letter-spacing:.06em;
  background:var(--ns-orange); color:#fff; transition:.15s; width:auto; font-family:inherit; }
.ns-btn:hover{ background:var(--ns-orange-dk); color:#fff; }
.ns-btn:focus-visible{ outline:3px solid var(--ns-forest); outline-offset:2px; }
.ns-btn--block{ width:100%; }
.ns-btn--dark{ background:var(--ns-forest); } .ns-btn--dark:hover{ background:var(--ns-forest-2); }
.ns-btn--ghost{ background:transparent; color:var(--ns-forest); border:2px solid var(--ns-line); }
.ns-btn--ghost:hover{ background:var(--ns-cream); color:var(--ns-forest); border-color:var(--ns-forest); }
.ns-btn--sm{ min-height:42px; padding:9px 14px; font-size:.78rem; border-radius:var(--ns-r-sm); letter-spacing:.05em; }
.ns-btn--danger{ background:var(--ns-bad); } .ns-btn--danger:hover{ background:#8f1e17; }
.ns-btn[disabled]{ opacity:.45; pointer-events:none; }
.ns-btn--yes{ background:var(--ns-good); } .ns-btn--yes:hover{ background:#16694a; }

/* cards */
.ns-card{ background:#fff; border:1px solid var(--ns-line); border-radius:var(--ns-r);
  padding:18px; margin-bottom:14px; box-shadow:var(--ns-shadow); }
.ns-card--flat{ box-shadow:none; }
.ns-card--dark{ background:var(--ns-forest); color:#fff; border-color:var(--ns-forest); }
.ns-card--dark h1,.ns-card--dark h2,.ns-card--dark h3{ color:#fff; }
.ns-card--dark .ns-muted{ color:#B9C9C2; }
.ns-card--accent{ border-left:5px solid var(--ns-orange); }
.ns-card__head{ display:flex; justify-content:space-between; gap:12px; align-items:flex-start; margin-bottom:10px; }

/* forms */
.ns-field{ margin-bottom:18px; }
.ns-label{ display:block; font-weight:700; margin-bottom:7px; font-size:1rem; }
.ns-hint{ display:block; color:var(--ns-muted); font-size:.85rem; margin:-3px 0 8px; font-weight:400; }
.ns input[type=text],.ns input[type=tel],.ns input[type=email],.ns input[type=password],
.ns input[type=number],.ns input[type=date],.ns input[type=time],.ns input[type=search],
.ns select,.ns textarea{
  width:100%; min-height:52px; padding:13px 14px; font-size:16px; font-family:inherit;
  border:2px solid var(--ns-line); border-radius:var(--ns-r-sm); background:#fff; color:var(--ns-ink); }
.ns textarea{ min-height:110px; resize:vertical; }
.ns select{ appearance:none; background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235F6D68' stroke-width='2'%3e%3cpath d='M6 9l6 6 6-6'/%3e%3c/svg%3e");
  background-repeat:no-repeat; background-position:right 12px center; background-size:20px; padding-right:42px; }
.ns input:focus,.ns select:focus,.ns textarea:focus{ outline:0; border-color:var(--ns-orange); }
.ns input[type=file]{ width:100%; font-size:.95rem; padding:10px 0; }

/* chip pickers — the core mobile input */
.ns-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.ns-chip{ position:relative; }
.ns-chip input{ position:absolute; opacity:0; width:1px; height:1px; }
.ns-chip span{ display:inline-flex; align-items:center; gap:6px; min-height:46px; padding:10px 15px;
  border:2px solid var(--ns-line); border-radius:999px; background:#fff; cursor:pointer;
  font-size:.95rem; font-weight:600; transition:.12s; user-select:none; }
.ns-chip input:checked + span{ background:var(--ns-forest); border-color:var(--ns-forest); color:#fff; }
.ns-chip input:focus-visible + span{ outline:3px solid var(--ns-orange); outline-offset:2px; }
.ns-chip--orange input:checked + span{ background:var(--ns-orange); border-color:var(--ns-orange); }

/* progress */
.ns-steps{ display:flex; gap:5px; margin-bottom:20px; }
.ns-steps i{ height:6px; flex:1; border-radius:4px; background:var(--ns-line); }
.ns-steps i.on{ background:var(--ns-orange); }
.ns-progress{ height:9px; background:var(--ns-line); border-radius:6px; overflow:hidden; }
.ns-progress b{ display:block; height:100%; background:var(--ns-good); border-radius:6px; }

/* badges */
.ns-badge{ display:inline-flex; align-items:center; gap:5px; padding:4px 10px; border-radius:999px;
  font-size:.76rem; font-weight:750; letter-spacing:.01em; background:var(--ns-cream); color:var(--ns-muted); white-space:nowrap; }
.ns-badge--verified{ background:var(--ns-good-soft); color:var(--ns-good); }
.ns-badge--live{ background:var(--ns-good-soft); color:var(--ns-good); }
.ns-badge--off{ background:#EFEFEC; color:var(--ns-muted); }
.ns-badge--warn{ background:var(--ns-warn-soft); color:var(--ns-warn); }
.ns-badge--bad{ background:var(--ns-bad-soft); color:var(--ns-bad); }
.ns-badge--orange{ background:var(--ns-orange-soft); color:var(--ns-orange-dk); }
.ns-dot{ width:9px; height:9px; border-radius:50%; display:inline-block; background:var(--ns-muted); }
.ns-dot--on{ background:var(--ns-good); box-shadow:0 0 0 3px var(--ns-good-soft); }

/* alerts */
.ns-alert{ padding:13px 15px; border-radius:var(--ns-r-sm); margin-bottom:16px; font-weight:600; font-size:.95rem; }
.ns-alert--ok{ background:var(--ns-good-soft); color:#12523a; }
.ns-alert--err{ background:var(--ns-bad-soft); color:#8f1e17; }
.ns-alert--info{ background:var(--ns-orange-soft); color:#8a3d08; }

/* availability switch */
.ns-switch{ display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:18px; border-radius:var(--ns-r); background:var(--ns-forest); color:#fff; }
.ns-switch__t{ font-size:1.1rem; font-weight:750; }
.ns-switch button{ border:0; cursor:pointer; width:76px; height:42px; border-radius:999px;
  background:rgba(255,255,255,.22); position:relative; transition:.18s; flex:0 0 auto; }
.ns-switch button::after{ content:""; position:absolute; top:4px; left:4px; width:34px; height:34px;
  border-radius:50%; background:#fff; transition:.18s; }
.ns-switch button[aria-pressed=true]{ background:#3DD68C; }
.ns-switch button[aria-pressed=true]::after{ transform:translateX(34px); }

/* worker card */
.ns-wcard{ display:flex; gap:14px; align-items:flex-start; }
.ns-avatar{ width:56px; height:56px; border-radius:50%; object-fit:cover; background:var(--ns-cream);
  flex:0 0 auto; display:flex; align-items:center; justify-content:center; font-weight:800; color:var(--ns-forest); font-size:1.15rem; }
.ns-avatar--lg{ width:84px; height:84px; font-size:1.6rem; }
.ns-facts{ display:flex; flex-wrap:wrap; gap:6px 14px; color:var(--ns-muted); font-size:.87rem; margin:6px 0; }
.ns-score{ display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-width:60px; padding:6px 8px; border-radius:var(--ns-r-sm); background:var(--ns-cream); }
.ns-score b{ font-size:1.3rem; line-height:1; color:var(--ns-forest); }
.ns-score i{ font-style:normal; font-size:.62rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ns-muted); }

/* shift card */
.ns-shift__when{ font-size:1.05rem; font-weight:750; }
.ns-shift__pay{ font-weight:800; color:var(--ns-forest); font-size:1.1rem; }
.ns-meta{ display:flex; flex-wrap:wrap; gap:6px 12px; font-size:.88rem; color:var(--ns-muted); }
.ns-meta b{ color:var(--ns-ink); font-weight:650; }

/* commitment screen */
.ns-commit{ border:3px solid var(--ns-orange); border-radius:var(--ns-r); padding:20px; background:#fff; }
.ns-commit h2{ text-transform:uppercase; letter-spacing:.03em; font-size:1.05rem; color:var(--ns-orange-dk); }
.ns-commit dl{ margin:14px 0; display:grid; grid-template-columns:auto 1fr; gap:8px 16px; }
.ns-commit dt{ color:var(--ns-muted); font-size:.85rem; }
.ns-commit dd{ margin:0; font-weight:700; }

/* tables */
.ns-table{ width:100%; border-collapse:collapse; font-size:.9rem; }
.ns-table th,.ns-table td{ text-align:left; padding:10px 8px; border-bottom:1px solid var(--ns-line); vertical-align:top; }
.ns-table th{ font-size:.74rem; text-transform:uppercase; letter-spacing:.06em; color:var(--ns-muted); }
.ns-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }

/* empty states */
.ns-empty{ text-align:center; padding:28px 18px; border:2px dashed var(--ns-line);
  border-radius:var(--ns-r); background:var(--ns-cream); }
.ns-empty h3{ margin-bottom:6px; }

/* tabs */
.ns-tabs{ display:flex; gap:4px; overflow-x:auto; margin-bottom:16px; border-bottom:2px solid var(--ns-line); }
.ns-tabs a{ padding:11px 14px; text-decoration:none; font-weight:700; color:var(--ns-muted);
  border-bottom:3px solid transparent; margin-bottom:-2px; white-space:nowrap; font-size:.94rem; }
.ns-tabs a.on{ color:var(--ns-forest); border-color:var(--ns-orange); }

/* stat grid */
.ns-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; }
.ns-stat{ background:#fff; border:1px solid var(--ns-line); border-radius:var(--ns-r-sm); padding:14px; }
.ns-stat b{ display:block; font-size:1.6rem; line-height:1.1; color:var(--ns-forest); }
.ns-stat span{ font-size:.78rem; color:var(--ns-muted); text-transform:uppercase; letter-spacing:.05em; }

/* home */
.ns-hero{ background:var(--ns-forest); color:#fff; padding:44px 16px 40px; }
.ns-hero__in{ max-width:760px; margin:0 auto; }
.ns-hero h1{ font-size:2rem; color:#fff; margin-bottom:10px; letter-spacing:-.005em; }
.ns-hero .ns-eyebrow{ color:#9FB3AA; }
.ns-hero > .ns-hero__in > p{ font-size:1.05rem; color:#C7D8D1; margin-bottom:24px; }
.ns-lane__label{ font-size:.68rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--ns-orange); margin-bottom:6px; }
.ns-lane__note{ font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#9FB3AA; margin:10px 0 0; }
.ns-split{ display:grid; gap:12px; }
.ns-lane{ background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.16);
  border-radius:var(--ns-r); padding:20px; }
.ns-lane h2{ color:#fff; font-size:1.15rem; margin-bottom:4px; }
.ns-lane p{ font-size:.95rem; color:#B9C9C2; margin-bottom:14px; }
.ns-band{ background:var(--ns-cream); padding:34px 16px; }
.ns-band__in{ max-width:1100px; margin:0 auto; }
.ns-roles{ display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:10px; }
.ns-role{ display:flex; align-items:center; gap:9px; padding:15px 14px; background:#fff; border:1px solid var(--ns-line);
  border-radius:var(--ns-r-sm); text-decoration:none; color:var(--ns-ink); font-weight:600; font-size:.92rem; }
.ns-role svg{ flex:0 0 auto; }
.ns-role:hover{ border-color:var(--ns-orange); color:var(--ns-forest); }

.ns-sticky{ position:sticky; bottom:0; background:linear-gradient(to top,#fff 72%,rgba(255,255,255,0));
  padding:14px 0 10px; margin-top:8px; z-index:5; }

@media (min-width:640px){
  .ns-wrap{ padding:28px 22px 80px; }
  .ns h1{ font-size:2.1rem; }
  .ns-hero h1{ font-size:2.7rem; }
  .ns-split{ grid-template-columns:1fr 1fr; }
  .ns-btn--auto{ width:auto; }
}


/* ---- theme integration: NextShift pages own the whole screen ---- */
body.ns-page #titlebar,body.ns-page div#titlebar.single{ display:none !important; }
body.ns-page .margin-top-45{ margin-top:0 !important; }
body.ns-page .container.full-width{ padding-left:0; padding-right:0; }
body.ns-page article.sixteen.columns{ padding:0; }
body.ns-page #titlebar,body.ns-page .page-title{ display:none !important; }
body.ns-page #footer .footer-widget:not(:first-child){ display:none; }
.ns-hero{ border-radius:0; }
@media (min-width:900px){
  .ns-hero{ border-radius:18px; margin:18px auto 0; max-width:1100px; padding:56px 40px; }
  .ns-band{ border-radius:18px; max-width:1100px; margin:18px auto; }
}
.ns-hero .ns-btn{ width:100%; }


/* CI icon set — line icons, orange accents */
.ns-ico{ width:1em; height:1em; vertical-align:-.13em; flex:0 0 auto; }
.ns-ico--orange{ color:var(--ns-orange); }
.ns-facts span{ display:inline-flex; align-items:center; gap:5px; }
.ns-star{ color:var(--ns-orange); }
.ns-band h2{ margin-bottom:2px; }
.ns-lane .ns-btn{ text-transform:uppercase; }

/* work gallery */
.ns-gallery{ display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:8px; margin:12px 0; }
.ns-gallery figure{ margin:0; position:relative; }
.ns-gallery img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:var(--ns-r-sm);
  border:1px solid var(--ns-line); display:block; max-width:100%; }
.ns-gallery form{ position:absolute; top:6px; right:6px; }
.ns-gallery__x{ width:28px; height:28px; border-radius:50%; border:0; cursor:pointer;
  background:rgba(30,42,36,.82); color:#fff; font-size:17px; line-height:1; }
.ns-gallery__x:hover{ background:var(--ns-bad); }


/* chip state clarity: tick when selected, muted when off */
.ns-chip input:checked + span::before{content:"\2713";font-weight:800;line-height:1}
.ns-chip input:not(:checked) + span{color:var(--ns-slate)}