/*
 * Send Listy Core 0.355 — Unified UI & UX Pass 1
 * ------------------------------------------------
 * A single product-facing design layer for:
 * Home → Create → Add Items → Save → View → Share → Public Link → Interaction → Done
 *
 * Scope: visual hierarchy, spacing, touch targets, forms, cards, modals,
 * responsive behavior, focus states and consistent surface treatment.
 *
 * Out of scope: workflow logic, save/sync logic, notifications, data model,
 * share destinations, public interaction semantics and Hub admin screens.
 */

.send-list-app.sl-ux-v0355{
  --sl-ux-bg:#f5f8f5;
  --sl-ux-surface:#ffffff;
  --sl-ux-surface-soft:#f8fbf8;
  --sl-ux-surface-green:#f2faf2;
  --sl-ux-text:#18231c;
  --sl-ux-text-soft:#5f6e64;
  --sl-ux-border:#dfe7e1;
  --sl-ux-border-strong:#ced9d0;
  --sl-ux-green:var(--sl-green,#2f9e2f);
  --sl-ux-orange:var(--sl-orange,#ff8a00);
  --sl-ux-danger:#c83b32;
  --sl-ux-radius-sm:10px;
  --sl-ux-radius-md:14px;
  --sl-ux-radius-lg:18px;
  --sl-ux-radius-xl:22px;
  --sl-ux-shadow-sm:0 3px 10px rgba(24,55,31,.055);
  --sl-ux-shadow-md:0 8px 24px rgba(24,55,31,.075);
  --sl-ux-shadow-lg:0 18px 48px rgba(20,45,27,.15);
  --sl-ux-focus:0 0 0 3px rgba(47,158,47,.18);
  --sl-ux-content:760px;
  --sl-ux-control-h:44px;
  color:var(--sl-ux-text);
  background:var(--sl-ux-bg);
}

/* Global interaction consistency */
.send-list-app.sl-ux-v0355 button,
.send-list-app.sl-ux-v0355 input,
.send-list-app.sl-ux-v0355 select,
.send-list-app.sl-ux-v0355 textarea{
  font-family:inherit;
}
.send-list-app.sl-ux-v0355 button{
  -webkit-tap-highlight-color:transparent;
}
.send-list-app.sl-ux-v0355 button:focus-visible,
.send-list-app.sl-ux-v0355 a:focus-visible,
.send-list-app.sl-ux-v0355 input:focus-visible,
.send-list-app.sl-ux-v0355 select:focus-visible,
.send-list-app.sl-ux-v0355 textarea:focus-visible,
.send-list-app.sl-ux-v0355 summary:focus-visible{
  outline:0;
  box-shadow:var(--sl-ux-focus);
}
.send-list-app.sl-ux-v0355 button:disabled{
  cursor:not-allowed;
}
.send-list-app.sl-ux-v0355 .sl-main{
  width:100%;
  max-width:var(--sl-ux-content);
  margin-inline:auto;
}
.send-list-app.sl-ux-v0355 .sl-section{
  scroll-margin-top:86px;
}

/* Header */
.send-list-app.sl-ux-v0355 .sl-topbar{
  background:rgba(255,255,255,.96);
  border-bottom:1px solid var(--sl-ux-border);
  box-shadow:0 4px 14px rgba(29,63,36,.04);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.send-list-app.sl-ux-v0355 .sl-compact-select{
  min-height:38px;
  border-color:var(--sl-ux-border);
  background:#f6f8f6;
  box-shadow:none;
}
.send-list-app.sl-ux-v0355 .sl-icon-button,
.send-list-app.sl-ux-v0355 .sl-topbar button{
  min-width:40px;
  min-height:40px;
}

/* Section hierarchy */
.send-list-app.sl-ux-v0355 .sl-section-head,
.send-list-app.sl-ux-v0355 .sl-shopping-title,
.send-list-app.sl-ux-v0355 .sl-all-lists-head{
  align-items:center;
}
.send-list-app.sl-ux-v0355 .sl-section h2,
.send-list-app.sl-ux-v0355 .sl-shopping-title h2,
.send-list-app.sl-ux-v0355 .sl-all-lists-head h2{
  color:var(--sl-ux-text);
  letter-spacing:-.015em;
}
.send-list-app.sl-ux-v0355 .sl-text-button{
  color:#267c32;
  min-height:40px;
  border-radius:999px;
  padding-inline:13px;
}
.send-list-app.sl-ux-v0355 .sl-light-button{
  min-height:40px;
  border:1px solid var(--sl-ux-border);
  box-shadow:none;
}

/* Home: search, cards, templates, quick actions */
.send-list-app.sl-ux-v0355 .sl-home-search input{
  height:50px;
  border-color:var(--sl-ux-border);
  border-radius:var(--sl-ux-radius-md);
  box-shadow:var(--sl-ux-shadow-sm);
}
.send-list-app.sl-ux-v0355 .sl-type-card,
.send-list-app.sl-ux-v0355 .sl-shopping-panel,
.send-list-app.sl-ux-v0355 .sl-list-card{
  border-color:var(--sl-ux-border);
  box-shadow:var(--sl-ux-shadow-sm);
}
.send-list-app.sl-ux-v0355 .sl-type-card{
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
@media (hover:hover){
  .send-list-app.sl-ux-v0355 .sl-type-card:hover,
  .send-list-app.sl-ux-v0355 .sl-list-card:hover{
    transform:translateY(-2px);
    border-color:#c9d9cc;
    box-shadow:var(--sl-ux-shadow-md);
  }
}
.send-list-app.sl-ux-v0355 .sl-type-card:active,
.send-list-app.sl-ux-v0355 .sl-list-card:active{
  transform:translateY(0);
}
.send-list-app.sl-ux-v0355 .sl-primary-actions button,
.send-list-app.sl-ux-v0355 .sl-quick-actions button{
  min-height:48px;
  border-radius:var(--sl-ux-radius-md);
}
.send-list-app.sl-ux-v0355 .sl-outline-button{
  border-width:1px;
  border-color:#9fc7a4;
  background:#fff;
}
.send-list-app.sl-ux-v0355 .sl-primary-button{
  box-shadow:0 6px 16px rgba(47,158,47,.16);
}

/* Unified modal system */
.send-list-app.sl-ux-v0355 .sl-modal-backdrop{
  background:rgba(12,24,16,.48);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
}
.send-list-app.sl-ux-v0355 .sl-modal-card{
  width:min(720px,calc(100vw - 28px));
  max-height:min(88dvh,880px);
  border:1px solid var(--sl-ux-border);
  border-radius:var(--sl-ux-radius-xl);
  background:var(--sl-ux-surface);
  box-shadow:var(--sl-ux-shadow-lg);
  scrollbar-gutter:stable;
}
.send-list-app.sl-ux-v0355 .sl-modal-back,
.send-list-app.sl-ux-v0355 .sl-modal-close{
  min-width:40px;
  min-height:40px;
  border-radius:50%;
}
.send-list-app.sl-ux-v0355 .sl-modal-back:hover,
.send-list-app.sl-ux-v0355 .sl-modal-close:hover{
  background:#f0f4f1;
}

/* Forms */
.send-list-app.sl-ux-v0355 .sl-field{
  gap:7px;
}
.send-list-app.sl-ux-v0355 .sl-field label{
  color:#314038;
  font-size:13px;
  line-height:1.3;
}
.send-list-app.sl-ux-v0355 .sl-field input,
.send-list-app.sl-ux-v0355 .sl-field select,
.send-list-app.sl-ux-v0355 .sl-field textarea,
.send-list-app.sl-ux-v0355 .sl-create-type input{
  min-height:var(--sl-ux-control-h);
  border:1px solid var(--sl-ux-border-strong);
  border-radius:12px;
  background:#fff;
  color:var(--sl-ux-text);
  box-shadow:inset 0 1px 1px rgba(26,51,31,.025);
}
.send-list-app.sl-ux-v0355 .sl-field textarea{
  min-height:92px;
  line-height:1.45;
  resize:vertical;
}
.send-list-app.sl-ux-v0355 .sl-field input:hover,
.send-list-app.sl-ux-v0355 .sl-field select:hover,
.send-list-app.sl-ux-v0355 .sl-field textarea:hover{
  border-color:#bccbbf;
}

/* Create hub & templates */
.send-list-app.sl-ux-v0355 .sl-create-hub{
  gap:0;
}
.send-list-app.sl-ux-v0355 .sl-hub-tabs{
  border-bottom-color:var(--sl-ux-border);
}
.send-list-app.sl-ux-v0355 .sl-hub-tab{
  min-height:44px;
}
.send-list-app.sl-ux-v0355 .sl-template-search input{
  min-height:44px;
  border-color:var(--sl-ux-border-strong);
}
.send-list-app.sl-ux-v0355 .sl-template-option,
.send-list-app.sl-ux-v0355 .sl-template-picker-card{
  border-color:var(--sl-ux-border);
  border-radius:var(--sl-ux-radius-md);
  box-shadow:none;
}
.send-list-app.sl-ux-v0355 .sl-template-option button{
  min-height:40px;
  border-radius:10px;
}

/* Editor */
.send-list-app.sl-ux-v0355 .sl-editor{
  color:var(--sl-ux-text);
}
.send-list-app.sl-ux-v0355 .sl-editor-head{
  padding-bottom:14px;
  border-bottom:1px solid var(--sl-ux-border);
}
.send-list-app.sl-ux-v0355 .sl-editor-head h2{
  letter-spacing:-.018em;
}
.send-list-app.sl-ux-v0355 .sl-summary-card,
.send-list-app.sl-ux-v0355 .sl-team-box,
.send-list-app.sl-ux-v0355 .sl-group-panel{
  border:1px solid var(--sl-ux-border);
  background:var(--sl-ux-surface-soft);
  box-shadow:none;
}
.send-list-app.sl-ux-v0355 .sl-summary-card{
  border-radius:12px;
}
.send-list-app.sl-ux-v0355 .sl-items{
  gap:12px;
}
.send-list-app.sl-ux-v0355 .sl-editor .sl-item-row{
  border-color:var(--sl-ux-border);
  border-radius:var(--sl-ux-radius-md);
  background:#fff;
  box-shadow:var(--sl-ux-shadow-sm);
}
.send-list-app.sl-ux-v0355 .sl-editor .sl-item-card-header{
  border-radius:var(--sl-ux-radius-md) var(--sl-ux-radius-md) 0 0;
}
.send-list-app.sl-ux-v0355 .sl-editor .sl-item-card-body{
  background:#fff;
}
.send-list-app.sl-ux-v0355 .sl-editor input,
.send-list-app.sl-ux-v0355 .sl-editor select,
.send-list-app.sl-ux-v0355 .sl-editor textarea{
  border-color:var(--sl-ux-border-strong);
}
.send-list-app.sl-ux-v0355 .sl-editor-actions{
  gap:8px;
}
.send-list-app.sl-ux-v0355 .sl-editor-actions button,
.send-list-app.sl-ux-v0355 .sl-add-item-wide,
.send-list-app.sl-ux-v0355 .sl-delete-list-wide{
  min-height:44px;
  border-radius:12px;
}
.send-list-app.sl-ux-v0355 .sl-save{
  box-shadow:0 5px 14px rgba(47,158,47,.17);
}
.send-list-app.sl-ux-v0355 .sl-secondary{
  background:#eef2ef;
  color:#334139;
}
.send-list-app.sl-ux-v0355 .sl-danger,
.send-list-app.sl-ux-v0355 .sl-delete-list-wide{
  color:var(--sl-ux-danger);
}

/* View */
.send-list-app.sl-ux-v0355 .sl-list-view{
  color:var(--sl-ux-text);
}
.send-list-app.sl-ux-v0355 .sl-view-item{
  border-color:var(--sl-ux-border);
  background:#fff;
}
.send-list-app.sl-ux-v0355 .sl-view-item-icon{
  background:var(--sl-ux-surface-green);
}
.send-list-app.sl-ux-v0355 .sl-view-item-copy strong{
  letter-spacing:-.006em;
}
.send-list-app.sl-ux-v0355 .sl-view-footer,
.send-list-app.sl-ux-v0355 .sl-view-footer-compact{
  border-color:var(--sl-ux-border);
}

/* Share */
.send-list-app.sl-ux-v0355 .sl-share-center{
  color:var(--sl-ux-text);
}
.send-list-app.sl-ux-v0355 .sl-share-success{
  box-shadow:0 8px 18px rgba(22,135,60,.10);
}
.send-list-app.sl-ux-v0355 .sl-share-url input{
  min-height:44px;
  border-color:var(--sl-ux-border-strong);
}
.send-list-app.sl-ux-v0355 .sl-inline-sharing,
.send-list-app.sl-ux-v0355 .sl-inline-link-settings{
  border-color:var(--sl-ux-border);
  box-shadow:none;
}
.send-list-app.sl-ux-v0355 .sl-inline-share-primary>button,
.send-list-app.sl-ux-v0355 .sl-inline-other-grid button{
  border-radius:12px;
}

/* Public interactive list inside Core */
.send-list-app.sl-ux-v0355 .sl-public-checklist{
  color:var(--sl-ux-text);
  background:var(--sl-ux-bg);
}
.send-list-app.sl-ux-v0355 .sl-public-header{
  background:linear-gradient(180deg,#f7fff5 0,#fff 100%);
}
.send-list-app.sl-ux-v0355 .sl-public-title-row h1{
  letter-spacing:-.018em;
}
.send-list-app.sl-ux-v0355 .sl-public-progress-sticky{
  border-color:var(--sl-ux-border);
}
.send-list-app.sl-ux-v0355 .sl-public-item{
  border-color:var(--sl-ux-border);
  background:#fff;
}
.send-list-app.sl-ux-v0355 .sl-public-item-icon{
  background:var(--sl-ux-surface-green);
}
.send-list-app.sl-ux-v0355 .sl-public-more,
.send-list-app.sl-ux-v0355 .sl-public-checkbox{
  min-width:40px;
  min-height:40px;
}
.send-list-app.sl-ux-v0355 .sl-public-notes{
  border-radius:var(--sl-ux-radius-md);
}

/* Sticky navigation + workflow: visual normalization only; positions remain unchanged. */
.send-list-app.sl-ux-v0355 .sl-bottom-nav{
  background:rgba(255,255,255,.97);
  border-top-color:var(--sl-ux-border);
  box-shadow:0 -7px 22px rgba(26,58,32,.075);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.send-list-app.sl-ux-v0355 .sl-bottom-nav button:not(.sl-floating-add){
  min-height:54px;
}
.send-list-app.sl-ux-v0355 .sl-workflow-bar{
  border-color:var(--sl-ux-border);
  box-shadow:0 7px 18px rgba(24,57,31,.07);
}
.send-list-app.sl-ux-v0355 .sl-workflow-bar button{
  min-height:38px;
}

/* Dialogs */
.send-list-app.sl-ux-v0355 .sl-brand-dialog{
  border-color:var(--sl-ux-border);
  border-radius:var(--sl-ux-radius-xl);
  box-shadow:var(--sl-ux-shadow-lg);
}
.send-list-app.sl-ux-v0355 .sl-brand-dialog-actions button{
  min-height:44px;
  border-radius:12px;
}

/* Mobile */
@media(max-width:650px){
  .send-list-app.sl-ux-v0355{
    --sl-ux-radius-xl:18px;
  }
  .send-list-app.sl-ux-v0355 .sl-main{
    padding-inline:14px;
  }
  .send-list-app.sl-ux-v0355 .sl-topbar{
    padding-inline:10px;
  }
  .send-list-app.sl-ux-v0355 .sl-modal-card{
    width:calc(100vw - 12px);
    max-height:calc(100dvh - 14px);
    border-radius:18px;
  }
  .send-list-app.sl-ux-v0355 .sl-modal.is-action-sheet .sl-modal-card{
    width:100%;
    max-height:86dvh;
    border-radius:20px 20px 0 0;
    border-bottom:0;
  }
  .send-list-app.sl-ux-v0355 .sl-form-grid{
    gap:10px;
  }
  .send-list-app.sl-ux-v0355 .sl-field input,
  .send-list-app.sl-ux-v0355 .sl-field select,
  .send-list-app.sl-ux-v0355 .sl-create-type input{
    min-height:46px;
    font-size:16px; /* avoids iOS auto-zoom */
  }
  .send-list-app.sl-ux-v0355 .sl-editor .sl-item-row{
    border-radius:13px;
  }
  .send-list-app.sl-ux-v0355 .sl-template-option{
    gap:10px;
  }
  .send-list-app.sl-ux-v0355 .sl-template-actions button{
    min-height:42px;
  }
  .send-list-app.sl-ux-v0355 .sl-public-item{
    min-height:64px;
  }
}

/* Desktop: keep product compact and focused instead of stretching endlessly. */
@media(min-width:900px){
  .send-list-app.sl-ux-v0355{
    border-inline:1px solid rgba(213,226,216,.72);
    box-shadow:0 0 0 1px rgba(255,255,255,.55),0 16px 48px rgba(28,63,35,.055);
  }
  .send-list-app.sl-ux-v0355 .sl-modal-card{
    padding:26px;
  }
}

/* Accessibility */
@media(prefers-reduced-motion:reduce){
  .send-list-app.sl-ux-v0355 *,
  .send-list-app.sl-ux-v0355 *::before,
  .send-list-app.sl-ux-v0355 *::after{
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
  }
}
