/* SaloCart V3.7 — Community invitation controls for Shopper dashboards. */
.community-invite-card{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 238px;
  gap:24px;
  align-items:center;
  overflow:hidden;
  margin-top:18px;
  padding:23px 24px;
  border:1px solid color-mix(in srgb,var(--sc-green) 22%,var(--sc-line));
  border-radius:24px;
  background:
    radial-gradient(circle at 96% 5%,rgba(199,233,112,.42),transparent 11rem),
    radial-gradient(circle at 4% 115%,rgba(47,105,231,.11),transparent 19rem),
    linear-gradient(135deg,var(--sc-surface) 0%,var(--sc-mint) 150%);
  box-shadow:var(--sc-shadow-sm);
}
.community-invite-card:before{
  content:"";
  position:absolute;
  top:-118px;
  right:146px;
  width:235px;
  height:235px;
  border:28px solid color-mix(in srgb,var(--sc-green) 12%,transparent);
  border-radius:50%;
  pointer-events:none;
}
.community-invite-copy{position:relative;z-index:1;min-width:0}
.community-invite-kicker{
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin:0 0 8px;
  color:var(--sc-green);
  font-family:var(--font-ui);
  font-size:.64rem;
  font-weight:850;
  letter-spacing:.10em;
  line-height:1.2;
  text-transform:uppercase;
}
.community-invite-kicker i{font-size:.82rem;color:var(--sc-blue)}
.community-invite-card h2{
  margin:0;
  color:var(--sc-ink);
  font-family:var(--font-display);
  font-size:clamp(1.28rem,2.2vw,1.7rem);
  font-weight:800;
  letter-spacing:-.055em;
  line-height:1.12;
}
.community-invite-card p{
  max-width:640px;
  margin:7px 0 15px;
  color:var(--sc-ink-soft);
  font-size:.79rem;
  line-height:1.58;
}
.community-link-group{display:grid;gap:9px;max-width:690px}
.community-link-field{
  display:flex;
  align-items:center;
  min-width:0;
  min-height:50px;
  padding:4px 4px 4px 13px;
  border:1px solid var(--sc-line-strong);
  border-radius:15px;
  background:color-mix(in srgb,var(--sc-surface) 92%,transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
.community-link-field>i{flex:0 0 auto;color:var(--sc-blue);font-size:1.06rem}
.community-link-field input{
  width:100%;
  min-width:0;
  padding:0 10px;
  border:0;
  outline:0;
  background:transparent;
  color:var(--sc-ink);
  font-family:var(--font-ui);
  font-size:.72rem;
  font-variant-numeric:tabular-nums;
  line-height:1.2;
}
.community-link-field input:focus{box-shadow:none}
.community-copy-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  flex:0 0 auto;
  min-height:40px;
  padding:0 12px;
  border:1px solid color-mix(in srgb,var(--sc-blue) 15%,var(--sc-line));
  border-radius:11px;
  background:var(--sc-blue-soft);
  color:var(--sc-blue);
  font-family:var(--font-ui);
  font-size:.70rem;
  font-weight:850;
}
.community-copy-button:hover{filter:brightness(.98);transform:translateY(-1px)}
.community-invite-actions{display:flex;flex-wrap:wrap;gap:8px}
.community-invite-actions .btn-sc,.community-invite-actions .btn-sc-light{min-width:142px}
.community-invite-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.community-invite-meta span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:29px;
  padding:5px 9px;
  border:1px solid var(--sc-line);
  border-radius:999px;
  background:color-mix(in srgb,var(--sc-surface) 82%,transparent);
  color:var(--sc-ink-soft);
  font-size:.65rem;
  font-weight:700;
}
.community-invite-meta i{color:var(--sc-green)}
.community-invite-meta b{color:var(--sc-ink);font-variant-numeric:tabular-nums}
.community-qr-panel{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-width:0;
  padding:14px;
  border:1px solid color-mix(in srgb,var(--sc-green) 16%,var(--sc-line));
  border-radius:20px;
  background:color-mix(in srgb,var(--sc-surface) 88%,transparent);
  box-shadow:0 12px 25px rgba(14,55,42,.085);
  text-align:center;
}
.community-qr-frame{
  display:grid;
  width:147px;
  height:147px;
  padding:8px;
  border:1px solid #DDE9E3;
  border-radius:16px;
  background:#fff;
  box-shadow:0 8px 18px rgba(14,55,42,.09);
}
.community-qr-image,.invite-qr-large{display:block;width:100%;height:100%;object-fit:contain}
.invite-qr-unavailable{display:grid;place-items:center;background:var(--sc-surface-alt);color:var(--sc-blue);font-size:2rem}
.community-qr-panel strong{margin-top:10px;color:var(--sc-ink);font-family:var(--font-display);font-size:.78rem;letter-spacing:-.025em}
.community-qr-panel small{max-width:175px;margin-top:3px;color:var(--sc-muted);font-size:.60rem;line-height:1.4}
.community-qr-open{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:33px;
  margin-top:9px;
  padding:0 9px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:var(--sc-blue);
  font-family:var(--font-ui);
  font-size:.65rem;
  font-weight:850;
}
.community-qr-open:hover{background:var(--sc-blue-soft)}

/* Larger sharing sheet with direct action buttons, including QR file share/download. */
.invite-modal-content{display:grid;grid-template-columns:214px minmax(0,1fr);gap:20px;align-items:center;padding-bottom:4px}
.invite-modal-qr{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  padding:14px;
  border:1px solid var(--sc-line);
  border-radius:20px;
  background:linear-gradient(145deg,var(--sc-surface-alt),var(--sc-mint));
  color:var(--sc-ink-soft);
  font-family:var(--font-ui);
  font-size:.67rem;
  font-weight:800;
}
.invite-modal-qr .invite-qr-large{
  display:block;
  width:174px;
  height:174px;
  padding:8px;
  border:1px solid #DDE9E3;
  border-radius:16px;
  background:#fff;
}
.invite-modal-copy h3{margin:0;color:var(--sc-ink);font-family:var(--font-display);font-size:1.24rem;letter-spacing:-.055em}
.invite-modal-copy>p{margin:7px 0 14px;color:var(--sc-ink-soft);font-size:.75rem;line-height:1.55}
.modal-link-field{min-height:48px}
.invite-code-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:11px 0;padding:9px 11px;border:1px dashed var(--sc-line-strong);border-radius:12px;background:var(--sc-surface-alt);color:var(--sc-muted);font-size:.66rem;font-weight:700}.invite-code-row b{color:var(--sc-ink);font-family:var(--font-display);font-size:.78rem;letter-spacing:.045em}
.invite-modal-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.invite-modal-actions .btn-sc,.invite-modal-actions .btn-sc-light{min-width:0;padding-inline:9px;font-size:.70rem!important}
.invite-modal-note{display:flex;align-items:flex-start;gap:6px;margin:12px 0 0!important;color:var(--sc-muted)!important;font-size:.63rem!important;line-height:1.45!important}.invite-modal-note i{color:var(--sc-green);font-size:.82rem}

html[data-theme="dark"] .community-invite-card{background:radial-gradient(circle at 96% 5%,rgba(199,233,112,.16),transparent 11rem),radial-gradient(circle at 4% 115%,rgba(139,178,255,.10),transparent 19rem),linear-gradient(135deg,var(--sc-surface) 0%,#123D2E 170%);border-color:var(--sc-line)}
html[data-theme="dark"] .community-link-field,html[data-theme="dark"] .community-qr-panel{background:color-mix(in srgb,var(--sc-surface) 90%,transparent)}
html[data-theme="dark"] .community-link-field input{color:var(--sc-ink)}
html[data-theme="dark"] .community-qr-frame,html[data-theme="dark"] .invite-modal-qr .invite-qr-large{border-color:#DDE9E3;background:#fff}
html[data-theme="dark"] .invite-modal-qr{background:linear-gradient(145deg,var(--sc-surface-alt),var(--sc-mint))}

@media(max-width:991.98px){
  .community-invite-card{grid-template-columns:minmax(0,1fr) 142px;gap:14px;margin-top:14px;padding:17px;border-radius:20px}
  .community-invite-card:before{right:72px;top:-140px;width:200px;height:200px;border-width:23px}
  .community-invite-card h2{font-size:1.35rem}.community-invite-card p{margin-top:6px;font-size:.73rem;line-height:1.53}
  .community-link-field{min-height:48px}.community-link-field input{font-size:.64rem;padding-inline:7px}.community-copy-button{min-height:38px;padding:0 9px;font-size:.64rem}
  .community-invite-actions{gap:7px}.community-invite-actions .btn-sc,.community-invite-actions .btn-sc-light{min-width:0;flex:1;font-size:.69rem!important;padding-inline:8px}
  .community-invite-meta{gap:6px;margin-top:11px}.community-invite-meta span{font-size:.59rem;padding:4px 7px}
  .community-qr-panel{padding:10px;border-radius:17px}.community-qr-frame{width:112px;height:112px;padding:6px;border-radius:14px}.community-qr-panel strong{margin-top:8px;font-size:.67rem}.community-qr-panel small{font-size:.53rem;line-height:1.35}.community-qr-open{margin-top:6px;font-size:.57rem;min-height:29px}
}
@media(max-width:620px){
  .community-invite-card{grid-template-columns:1fr;gap:13px;padding:16px}
  .community-invite-card:before{right:-74px;top:-125px}
  .community-qr-panel{display:grid;grid-template-columns:92px minmax(0,1fr);column-gap:12px;align-items:center;text-align:left;padding:10px 11px}.community-qr-frame{grid-row:span 3;width:92px;height:92px;padding:5px}.community-qr-panel strong{align-self:end;margin:0;font-size:.72rem}.community-qr-panel small{align-self:center;max-width:none;margin:2px 0;font-size:.58rem}.community-qr-open{justify-self:start;align-self:start;margin:0;padding:0 7px;min-height:28px}
  .invite-modal-content{grid-template-columns:1fr;gap:14px}.invite-modal-qr{display:grid;grid-template-columns:112px minmax(0,1fr);gap:12px;align-items:center;padding:11px;text-align:left}.invite-modal-qr .invite-qr-large{grid-row:span 2;width:112px;height:112px;padding:6px}.invite-modal-qr span{font-family:var(--font-display);font-size:.83rem;color:var(--sc-ink)}.invite-modal-qr:after{content:"Use your phone camera to scan this code and open your personal community link.";color:var(--sc-muted);font-size:.62rem;line-height:1.4}.invite-modal-actions{grid-template-columns:1fr}.invite-modal-actions .btn-sc,.invite-modal-actions .btn-sc-light{width:100%}
}
@media(max-width:390px){
  .community-invite-card{padding:14px}.community-invite-card h2{font-size:1.2rem}.community-invite-actions{flex-direction:column}.community-invite-actions .btn-sc,.community-invite-actions .btn-sc-light{width:100%}.community-link-field{padding-left:10px}.community-link-field input{font-size:.58rem}.community-copy-button span{display:none}.community-copy-button{width:38px;padding:0}.community-invite-meta{display:grid;grid-template-columns:1fr}.community-invite-meta span{width:max-content;max-width:100%}
}
@media(prefers-reduced-motion:reduce){.community-copy-button,.community-qr-open{transition:none!important;transform:none!important}}