/*
  SaloCart V5.2.30 — Shopper Shortcut Action Hub
  Purpose: turn the dashboard shortcuts into a spacious, status-aware action hub.
  Eight primary shopper tasks are deliberately arranged in a comfortable grid so
  labels, helper copy, badges, and touch targets never compete for the same space.
*/

.shopper-shortcut-menu.shopper-shortcut-menu--smart{
  position:relative;
  margin-top:18px;
  padding:18px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--sc-line) 88%,transparent);
  border-radius:26px;
  background:
    radial-gradient(circle at 94% 6%,color-mix(in srgb,var(--sc-lime-soft) 78%,transparent),transparent 34%),
    linear-gradient(145deg,color-mix(in srgb,var(--sc-surface) 98%,#fff),color-mix(in srgb,var(--sc-mint) 20%,var(--sc-surface)));
  box-shadow:0 16px 34px rgba(17,58,39,.055);
}
.shopper-shortcut-menu--smart::after{
  position:absolute;
  right:-46px;
  bottom:-66px;
  width:156px;
  height:156px;
  border:1px solid color-mix(in srgb,var(--sc-green) 10%,transparent);
  border-radius:50%;
  content:"";
  pointer-events:none;
}
.shopper-shortcut-menu--smart .shopper-shortcut-menu__heading{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:18px;
  padding:1px 2px 15px;
}
.shopper-shortcut-menu--smart .shopper-shortcut-menu__heading .section-kicker{margin:0 0 4px;}
.shopper-shortcut-menu--smart .shopper-shortcut-menu__heading h2{
  margin:0;
  color:var(--sc-ink);
  font-family:var(--font-display);
  font-size:1.14rem;
  font-weight:850;
  letter-spacing:-.045em;
}
.shopper-shortcut-menu--smart .shopper-shortcut-menu__heading p{
  max-width:none;
  margin:4px 0 0;
  color:var(--sc-muted);
  font-size:.73rem;
  font-weight:650;
  line-height:1.35;
  text-align:left;
}
.shopper-shortcut-menu--smart .shopper-shortcut-menu__pulse{
  display:flex;
  min-width:min(310px,36vw);
  max-width:340px;
  align-items:center;
  gap:10px;
  padding:10px 12px 10px 10px;
  border:1px solid color-mix(in srgb,var(--sc-green) 18%,var(--sc-line));
  border-radius:17px;
  background:color-mix(in srgb,var(--sc-surface) 92%,transparent);
  box-shadow:0 7px 18px rgba(16,92,49,.045);
}
.shopper-shortcut-menu--smart .shopper-shortcut-menu__pulse > span{
  display:grid;
  width:32px;
  height:32px;
  flex:0 0 32px;
  place-items:center;
  border-radius:11px;
  background:var(--sc-mint);
  color:var(--sc-green);
  font-size:1rem;
}
.shopper-shortcut-menu--smart .shopper-shortcut-menu__pulse div{min-width:0;}
.shopper-shortcut-menu--smart .shopper-shortcut-menu__pulse small{
  display:block;
  margin:0 0 1px;
  color:var(--sc-muted);
  font-size:.58rem;
  font-weight:800;
  letter-spacing:.055em;
  line-height:1.2;
  text-transform:uppercase;
}
.shopper-shortcut-menu--smart .shopper-shortcut-menu__pulse strong{
  display:block;
  color:var(--sc-ink);
  font-size:.75rem;
  font-weight:820;
  line-height:1.25;
  overflow-wrap:anywhere;
}

/* Four wide cards on large screens; the layout intentionally becomes two columns
   before any icon or label can become cramped. */
.shopper-shortcut-menu--smart .shopper-command-nav{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  width:100%;
  margin:0;
  padding:0;
  overflow:visible;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.shopper-shortcut-menu--smart .shopper-command-item{
  position:relative;
  display:grid;
  min-width:0;
  min-height:124px;
  grid-template-columns:48px minmax(0,1fr);
  align-items:start;
  gap:12px;
  padding:14px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--sc-line) 90%,transparent);
  border-radius:20px;
  background:color-mix(in srgb,var(--sc-surface) 97%,transparent);
  box-shadow:0 9px 22px rgba(18,45,33,.042);
  color:var(--sc-ink-soft);
  font-family:var(--font-ui);
  text-align:left;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.shopper-shortcut-menu--smart .shopper-command-item::before{
  position:absolute;
  top:0;
  right:0;
  left:0;
  height:3px;
  border-radius:20px 20px 0 0;
  background:currentColor;
  content:"";
  opacity:.16;
}
.shopper-shortcut-menu--smart .shopper-command-item:hover,
.shopper-shortcut-menu--smart .shopper-command-item:focus-visible{
  z-index:1;
  border-color:color-mix(in srgb,var(--sc-green) 38%,var(--sc-line));
  background:color-mix(in srgb,var(--sc-mint) 42%,var(--sc-surface));
  box-shadow:0 15px 28px color-mix(in srgb,var(--sc-green) 13%,transparent);
  outline:none;
  transform:translateY(-3px);
}
.shopper-shortcut-menu--smart .shopper-command-item:active{transform:translateY(0) scale(.985);}
.shopper-shortcut-menu--smart .shopper-command-item__icon{
  position:relative;
  display:grid;
  width:48px;
  height:48px;
  place-items:center;
  border-radius:16px;
  background:var(--sc-surface-alt);
  color:var(--sc-blue);
  font-size:1.22rem;
  line-height:1;
}
.shopper-shortcut-menu--smart .shopper-command-item__icon b{
  position:absolute;
  right:-9px;
  top:-8px;
  display:grid;
  min-width:19px;
  height:19px;
  place-items:center;
  padding:0 5px;
  border:2px solid var(--sc-surface);
  border-radius:999px;
  background:var(--sc-coral);
  color:#fff;
  font-size:.56rem;
  font-style:normal;
  font-variant-numeric:tabular-nums;
  font-weight:850;
  line-height:1;
  box-shadow:0 4px 9px rgba(196,73,94,.22);
}
.shopper-shortcut-menu--smart .shopper-command-item__copy{
  display:flex;
  min-width:0;
  min-height:100%;
  flex-direction:column;
  align-items:stretch;
}
.shopper-shortcut-menu--smart .shopper-command-item__title-row{
  display:flex;
  min-width:0;
  align-items:flex-start;
  justify-content:space-between;
  gap:6px;
}
.shopper-shortcut-menu--smart .shopper-command-item strong{
  display:block;
  min-width:0;
  color:currentColor;
  font-family:var(--font-ui);
  font-size:.86rem;
  font-weight:850;
  line-height:1.15;
  overflow-wrap:anywhere;
}
.shopper-shortcut-menu--smart .shopper-command-item__chevron{
  flex:0 0 auto;
  margin-top:1px;
  color:color-mix(in srgb,currentColor 56%,transparent);
  font-size:.75rem;
}
.shopper-shortcut-menu--smart .shopper-command-item__hint{
  display:block;
  margin:4px 0 0;
  color:var(--sc-muted);
  font-size:.65rem;
  font-weight:650;
  line-height:1.28;
  overflow-wrap:anywhere;
}
.shopper-shortcut-menu--smart .shopper-command-item__footer{
  display:flex;
  min-width:0;
  align-items:center;
  gap:5px;
  margin-top:auto;
  padding-top:9px;
}
.shopper-shortcut-menu--smart .shopper-command-item__footer em{
  display:inline-flex;
  max-width:100%;
  align-items:center;
  gap:4px;
  padding:4px 7px;
  border-radius:999px;
  background:color-mix(in srgb,currentColor 8%,transparent);
  color:currentColor;
  font-size:.59rem;
  font-style:normal;
  font-weight:790;
  line-height:1.14;
  overflow-wrap:anywhere;
}
.shopper-shortcut-menu--smart .shopper-command-item__footer em::before{
  width:5px;
  height:5px;
  flex:0 0 5px;
  border-radius:50%;
  background:currentColor;
  content:"";
  opacity:.65;
}
.shopper-shortcut-menu--smart .shopper-command-item.is-attention .shopper-command-item__footer em{
  background:color-mix(in srgb,var(--sc-orange) 16%,transparent);
  color:#A65A10;
}
.shopper-shortcut-menu--smart .shopper-command-item.is-attention::after{
  position:absolute;
  right:12px;
  bottom:12px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--sc-coral);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--sc-coral) 17%,transparent);
  content:"";
}

/* Color is a secondary scan aid; text labels remain explicit. */
.shopper-shortcut-menu--smart .shopper-command-item.tone-today{color:var(--sc-green-deep);}
.shopper-shortcut-menu--smart .shopper-command-item.tone-today .shopper-command-item__icon{background:var(--sc-mint);color:var(--sc-green);}
.shopper-shortcut-menu--smart .shopper-command-item.tone-deals{color:var(--sc-blue);}
.shopper-shortcut-menu--smart .shopper-command-item.tone-deals .shopper-command-item__icon{background:var(--sc-blue-soft);color:var(--sc-blue);}
.shopper-shortcut-menu--smart .shopper-command-item.tone-cart{color:#B86B11;}
.shopper-shortcut-menu--smart .shopper-command-item.tone-cart .shopper-command-item__icon{background:#FFF1DA;color:#C77916;}
.shopper-shortcut-menu--smart .shopper-command-item.tone-orders{color:#526EAB;}
.shopper-shortcut-menu--smart .shopper-command-item.tone-orders .shopper-command-item__icon{background:#EDF2FF;color:#5072B8;}
.shopper-shortcut-menu--smart .shopper-command-item.tone-messages{color:#B44B61;}
.shopper-shortcut-menu--smart .shopper-command-item.tone-messages .shopper-command-item__icon{background:#FCECEF;color:#C94D63;}
.shopper-shortcut-menu--smart .shopper-command-item.tone-saved{color:#678319;}
.shopper-shortcut-menu--smart .shopper-command-item.tone-saved .shopper-command-item__icon{background:var(--sc-lime-soft);color:#6A851E;}
.shopper-shortcut-menu--smart .shopper-command-item.tone-rewards{color:#6750B8;}
.shopper-shortcut-menu--smart .shopper-command-item.tone-rewards .shopper-command-item__icon{background:#F0ECFF;color:#6A55B5;}
.shopper-shortcut-menu--smart .shopper-command-item.tone-more{color:#58727A;}
.shopper-shortcut-menu--smart .shopper-command-item.tone-more .shopper-command-item__icon{background:#EAF2F2;color:#58727A;}
.shopper-shortcut-menu--smart .shopper-command-item.is-featured{
  border-color:transparent;
  background:linear-gradient(145deg,var(--sc-green),var(--sc-green-deep));
  color:#fff;
  box-shadow:0 14px 29px color-mix(in srgb,var(--sc-green) 25%,transparent);
}
.shopper-shortcut-menu--smart .shopper-command-item.is-featured::before{background:#fff;opacity:.34;}
.shopper-shortcut-menu--smart .shopper-command-item.is-featured .shopper-command-item__icon{background:rgba(255,255,255,.16);color:#fff;}
.shopper-shortcut-menu--smart .shopper-command-item.is-featured .shopper-command-item__hint{color:rgba(255,255,255,.8);}
.shopper-shortcut-menu--smart .shopper-command-item.is-featured .shopper-command-item__chevron{color:rgba(255,255,255,.8);}
.shopper-shortcut-menu--smart .shopper-command-item.is-featured .shopper-command-item__footer em{background:rgba(255,255,255,.15);color:#fff;}
.shopper-shortcut-menu--smart .shopper-command-item.is-featured .shopper-command-item__icon b{border-color:var(--sc-green-deep);}
.shopper-shortcut-menu--smart .shopper-command-item.is-featured.is-attention .shopper-command-item__footer em{background:rgba(255,242,218,.18);color:#fff4dd;}

html[data-theme="dark"] .shopper-shortcut-menu.shopper-shortcut-menu--smart{
  border-color:var(--sc-line);
  background:linear-gradient(145deg,color-mix(in srgb,var(--sc-surface) 94%,#14382b),var(--sc-surface-alt));
}
html[data-theme="dark"] .shopper-shortcut-menu--smart .shopper-shortcut-menu__pulse{
  border-color:var(--sc-line);
  background:color-mix(in srgb,var(--sc-surface) 94%,transparent);
}
html[data-theme="dark"] .shopper-shortcut-menu--smart .shopper-command-item{
  border-color:var(--sc-line);
  background:color-mix(in srgb,var(--sc-surface) 96%,transparent);
}
html[data-theme="dark"] .shopper-shortcut-menu--smart .shopper-command-item:hover,
html[data-theme="dark"] .shopper-shortcut-menu--smart .shopper-command-item:focus-visible{background:color-mix(in srgb,var(--sc-mint) 26%,var(--sc-surface));}
html[data-theme="dark"] .shopper-shortcut-menu--smart .shopper-command-item.tone-cart .shopper-command-item__icon{background:#3B2A18;color:#FFC377;}
html[data-theme="dark"] .shopper-shortcut-menu--smart .shopper-command-item.tone-orders .shopper-command-item__icon{background:#252F4A;color:#ADC8FF;}
html[data-theme="dark"] .shopper-shortcut-menu--smart .shopper-command-item.tone-messages .shopper-command-item__icon{background:#392329;color:#FFACB5;}
html[data-theme="dark"] .shopper-shortcut-menu--smart .shopper-command-item.tone-rewards .shopper-command-item__icon{background:#30274A;color:#C3B5FF;}
html[data-theme="dark"] .shopper-shortcut-menu--smart .shopper-command-item.tone-more .shopper-command-item__icon{background:#203236;color:#AFC8CC;}

@media(max-width:1099.98px){
  .shopper-shortcut-menu--smart .shopper-command-nav{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;}
  .shopper-shortcut-menu--smart .shopper-command-item{min-height:120px;padding:12px;gap:10px;grid-template-columns:44px minmax(0,1fr);}
  .shopper-shortcut-menu--smart .shopper-command-item__icon{width:44px;height:44px;border-radius:15px;font-size:1.12rem;}
}
@media(max-width:839.98px){
  .shopper-shortcut-menu.shopper-shortcut-menu--smart{margin-top:13px;padding:14px;border-radius:22px;}
  .shopper-shortcut-menu--smart .shopper-shortcut-menu__heading{grid-template-columns:1fr;gap:11px;padding-bottom:12px;}
  .shopper-shortcut-menu--smart .shopper-shortcut-menu__pulse{min-width:0;max-width:none;width:100%;}
  .shopper-shortcut-menu--smart .shopper-command-nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .shopper-shortcut-menu--smart .shopper-command-item{min-height:112px;}
}
@media(max-width:519.98px){
  .shopper-shortcut-menu.shopper-shortcut-menu--smart{padding:11px;border-radius:20px;}
  .shopper-shortcut-menu--smart .shopper-shortcut-menu__heading{gap:9px;padding:1px 1px 10px;}
  .shopper-shortcut-menu--smart .shopper-shortcut-menu__heading h2{font-size:1rem;}
  .shopper-shortcut-menu--smart .shopper-shortcut-menu__heading p{font-size:.67rem;}
  .shopper-shortcut-menu--smart .shopper-shortcut-menu__pulse{padding:9px 10px;border-radius:15px;}
  .shopper-shortcut-menu--smart .shopper-shortcut-menu__pulse > span{width:30px;height:30px;flex-basis:30px;border-radius:10px;}
  .shopper-shortcut-menu--smart .shopper-shortcut-menu__pulse strong{font-size:.7rem;}
  .shopper-shortcut-menu--smart .shopper-command-nav{gap:8px;}
  .shopper-shortcut-menu--smart .shopper-command-item{min-height:104px;grid-template-columns:40px minmax(0,1fr);gap:9px;padding:11px 10px;border-radius:17px;}
  .shopper-shortcut-menu--smart .shopper-command-item__icon{width:40px;height:40px;border-radius:13px;font-size:1.03rem;}
  .shopper-shortcut-menu--smart .shopper-command-item__icon b{right:-8px;top:-7px;min-width:18px;height:18px;font-size:.52rem;}
  .shopper-shortcut-menu--smart .shopper-command-item strong{font-size:.77rem;}
  .shopper-shortcut-menu--smart .shopper-command-item__hint{font-size:.59rem;line-height:1.23;}
  .shopper-shortcut-menu--smart .shopper-command-item__footer{padding-top:7px;}
  .shopper-shortcut-menu--smart .shopper-command-item__footer em{padding:3px 6px;font-size:.54rem;}
}
@media(max-width:359.98px){
  .shopper-shortcut-menu.shopper-shortcut-menu--smart{padding:9px;}
  .shopper-shortcut-menu--smart .shopper-command-nav{gap:7px;}
  .shopper-shortcut-menu--smart .shopper-command-item{min-height:95px;grid-template-columns:36px minmax(0,1fr);gap:7px;padding:9px 8px;border-radius:15px;}
  .shopper-shortcut-menu--smart .shopper-command-item__icon{width:36px;height:36px;border-radius:12px;font-size:.95rem;}
  .shopper-shortcut-menu--smart .shopper-command-item strong{font-size:.69rem;line-height:1.12;}
  .shopper-shortcut-menu--smart .shopper-command-item__hint{display:none;}
  .shopper-shortcut-menu--smart .shopper-command-item__footer{padding-top:5px;}
  .shopper-shortcut-menu--smart .shopper-command-item__footer em{font-size:.51rem;}
}
@media(prefers-reduced-motion:reduce){
  .shopper-shortcut-menu--smart .shopper-command-item{transition:none!important;}
}
