/* settings-ia — Settings information architecture (proposal 2026-10-20). Look = the current new Settings style; only layout of the nav changes. */

/* ── quick-jump box ── */
#page-settings .wfs-find{position:relative;padding:0 2px 10px}
#page-settings .wfs-find-in{width:100%;min-height:42px;box-sizing:border-box;padding:0 14px 0 38px;font:400 15px var(--font-body);color:var(--white);background:var(--bg-raised) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a94a3' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m16 16 4 4'/%3E%3C/svg%3E") no-repeat 12px 50%/18px;border:1px solid var(--border);border-radius:10px;-webkit-appearance:none;appearance:none}
#page-settings .wfs-find-in:focus{outline:2px solid var(--accent);outline-offset:1px}
#page-settings .wfs-find-in::-webkit-search-cancel-button{-webkit-appearance:none}
#page-settings .wfs-find-res{position:absolute;z-index:30;left:2px;right:2px;top:46px;max-height:340px;overflow:auto;background:var(--bg-raised);border:1px solid var(--border);border-radius:12px;box-shadow:0 10px 30px rgba(15,24,34,.16);padding:4px}
#page-settings .wfs-find-res[hidden]{display:none}
#page-settings .wfs-find-item{display:flex;flex-direction:column;align-items:flex-start;gap:1px;width:100%;min-height:44px;padding:7px 12px;text-align:left;background:transparent;border:0;border-radius:8px;cursor:pointer;font-family:var(--font-body)}
#page-settings .wfs-find-item:hover,#page-settings .wfs-find-item.is-sel{background:var(--bg-hover)}
#page-settings .wfs-find-t{font-size:14.5px;font-weight:600;color:var(--white)}
#page-settings .wfs-find-w{font-size:12.5px;color:var(--muted)}
#page-settings .wfs-find-none{padding:12px;font-size:14px;color:var(--muted)}
#page-settings .wfs-ia-empty{margin:0;padding:18px 0;font-size:14px;color:var(--muted)}
#page-settings .wfs-ia-empty[hidden]{display:none}

/* ── desktop: nine groups fit one tall column; it sticks while the section scrolls ── */
@media (min-width:769px){
  html #page-settings .settings-tab-bar.wfs-nav{align-self:start;position:sticky;top:8px;max-height:calc(100vh - 16px);overflow-y:auto;border-right:0;padding:18px 12px 20px;gap:1px;scrollbar-width:thin}
  #page-settings .wfs-content{border-left:1px solid var(--border)}
  #page-settings .wfs-nav .wfs-nav-label{padding:16px 14px 6px}
  #page-settings .wfs-nav .wfs-find + .wfs-nav-label{padding-top:8px}
  html #page-settings .wfs-nav .settings-tab-btn{min-height:40px}
}

/* ── phone: the grouped list + Back is the existing wfms-home mode; only the search box and the new group labels need room ── */
@media (max-width:768px){
  #page-settings .wfs-find{padding:0 0 2px}
  #page-settings .wfs-find-res{top:48px}
  #page-settings.wfms-home .wfs-nav .wfs-find + .wfs-nav-label.wfms-ng{padding-top:14px}
}
#page-settings .wfs-nav .wfs-nav-label[hidden]{display:none!important}

/* ── search results: the plain one-line description + a short highlight on the place we jumped to ── */
#page-settings .wfs-find-d{font-size:12.5px;line-height:1.35;color:var(--muted);font-weight:400}
#page-settings .wfs-find-w{font-weight:500}
#page-settings .wfs-find-res{max-height:min(460px,70vh)}
#page-settings .wfs-hit{animation:wfsHit 2.2s ease-out 1;border-radius:14px}
@keyframes wfsHit{0%,55%{box-shadow:0 0 0 3px var(--accent);background-color:rgba(37,99,235,.09)}100%{box-shadow:0 0 0 3px transparent}}
@media (prefers-reduced-motion:reduce){#page-settings .wfs-hit{animation:none;box-shadow:0 0 0 3px var(--accent)}}

/* ── Money > Inventory payment methods: heading, plain summary, default for new purchases ── */
#page-settings .wfc-pm-head{margin:0 0 16px;padding:4px 0 6px}
#page-settings .wfc-pm-head[hidden]{display:none}
#page-settings .wfc-pm-title{margin:0;font:600 22px/1.2 var(--font-body);color:var(--white);letter-spacing:-.01em}
#page-settings .wfc-pm-sum{margin:0;max-width:62ch;font-size:14px;line-height:1.5;color:var(--muted)}
#page-settings .wfc-pm-def{margin-top:14px}
#page-settings .wfc-pm-def-l{font-size:13px;font-weight:600;color:var(--white);margin-bottom:8px}
#page-settings .wfc-pm-chips{display:flex;flex-wrap:wrap;gap:8px}
#page-settings .wfc-pm-chip{min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--border);background:var(--bg-raised);color:var(--white);font:500 14px var(--font-body);cursor:pointer;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#page-settings .wfc-pm-chip:hover{background:var(--bg-hover)}
#page-settings .wfc-pm-chip.is-on{border-color:var(--accent);background:rgba(37,99,235,.09);color:var(--accent);font-weight:600}
#page-settings .wfc-pm-none{margin:0;font-size:13.5px;color:var(--muted)}
/* the list's own old heading + paragraph give way to the heading above (the list block itself is untouched) */
#page-settings #settings-panel-money .wfc-settings > .wfs-row-label{display:none}

/* ── Settings > Inventory: five sub-sections; the chips say what each holds right now ── */
#page-settings .wfs-inv-sub{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0 0 20px}
#page-settings .wfs-inv-chip{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;min-height:58px;padding:8px 14px;text-align:left;border:1px solid var(--border);border-radius:14px;background:var(--bg-raised);color:var(--white);cursor:pointer;font-family:var(--font-body);min-width:0}
#page-settings .wfs-inv-chip:hover{background:var(--bg-hover)}
#page-settings .wfs-inv-chip.is-on{border-color:var(--accent);background:rgba(37,99,235,.08)}
#page-settings .wfs-inv-chip-t{font-size:14.5px;font-weight:600;color:var(--white)}
#page-settings .wfs-inv-chip.is-on .wfs-inv-chip-t{color:var(--accent)}
#page-settings .wfs-inv-chip-s{font-size:12px;line-height:1.3;color:var(--muted);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:768px){
  #page-settings .wfs-inv-sub{display:flex;overflow-x:auto;scroll-snap-type:x proximity;gap:8px;margin:0 0 14px;padding:0 0 4px;scrollbar-width:none}
  #page-settings .wfs-inv-sub::-webkit-scrollbar{display:none}
  #page-settings .wfs-inv-chip{flex:0 0 auto;min-width:132px;max-width:220px;scroll-snap-align:start}
}
#page-settings #settings-panel-inventory .wfs-hub{display:none}
#page-settings #settings-panel-inventory[data-inv-sub="defaults"] #jjiv-track,
#page-settings #settings-panel-inventory[data-inv-sub="defaults"] section[aria-labelledby="wfs-row-pref-stages"],
#page-settings #settings-panel-inventory[data-inv-sub="defaults"] #jjiv-hl,
#page-settings #settings-panel-inventory[data-inv-sub="defaults"] #settings-missing-data-card:not(.is-open),
#page-settings #settings-panel-inventory[data-inv-sub="defaults"] #settings-locations-card:not(.is-open){display:none!important}
#page-settings #settings-panel-inventory[data-inv-sub="stages"] #jjiv-defaults,
#page-settings #settings-panel-inventory[data-inv-sub="stages"] section[aria-labelledby="wfs-row-pref-sku"],
#page-settings #settings-panel-inventory[data-inv-sub="stages"] #jjiv-hl,
#page-settings #settings-panel-inventory[data-inv-sub="stages"] #settings-missing-data-card:not(.is-open),
#page-settings #settings-panel-inventory[data-inv-sub="stages"] #settings-locations-card:not(.is-open){display:none!important}
#page-settings #settings-panel-inventory[data-inv-sub="highlights"] #jjiv-defaults,
#page-settings #settings-panel-inventory[data-inv-sub="highlights"] section[aria-labelledby="wfs-row-pref-sku"],
#page-settings #settings-panel-inventory[data-inv-sub="highlights"] #jjiv-track,
#page-settings #settings-panel-inventory[data-inv-sub="highlights"] section[aria-labelledby="wfs-row-pref-stages"],
#page-settings #settings-panel-inventory[data-inv-sub="highlights"] #settings-missing-data-card:not(.is-open),
#page-settings #settings-panel-inventory[data-inv-sub="highlights"] #settings-locations-card:not(.is-open){display:none!important}
#page-settings #settings-panel-inventory[data-inv-sub="alerts"] #jjiv-defaults,
#page-settings #settings-panel-inventory[data-inv-sub="alerts"] section[aria-labelledby="wfs-row-pref-sku"],
#page-settings #settings-panel-inventory[data-inv-sub="alerts"] #jjiv-track,
#page-settings #settings-panel-inventory[data-inv-sub="alerts"] section[aria-labelledby="wfs-row-pref-stages"],
#page-settings #settings-panel-inventory[data-inv-sub="alerts"] #jjiv-hl,
#page-settings #settings-panel-inventory[data-inv-sub="alerts"] #settings-locations-card:not(.is-open){display:none!important}
#page-settings #settings-panel-inventory[data-inv-sub="locations"] #jjiv-defaults,
#page-settings #settings-panel-inventory[data-inv-sub="locations"] section[aria-labelledby="wfs-row-pref-sku"],
#page-settings #settings-panel-inventory[data-inv-sub="locations"] #jjiv-track,
#page-settings #settings-panel-inventory[data-inv-sub="locations"] section[aria-labelledby="wfs-row-pref-stages"],
#page-settings #settings-panel-inventory[data-inv-sub="locations"] #jjiv-hl,
#page-settings #settings-panel-inventory[data-inv-sub="locations"] #settings-missing-data-card:not(.is-open){display:none!important}
#page-settings #settings-panel-inventory[data-inv-sub="alerts"] .jjiv-foot,#page-settings #settings-panel-inventory[data-inv-sub="alerts"] .jjiv-ro{display:none!important}
#page-settings #settings-panel-inventory[data-inv-sub="locations"] .jjiv-foot,#page-settings #settings-panel-inventory[data-inv-sub="locations"] .jjiv-ro{display:none!important}
/* phone: while Alerts / Locations are open as their own screen, the chips and the page above step aside */
#page-settings.wfs-sub-open #settings-panel-inventory .wfs-inv-sub,
#page-settings.wfs-sub-open #settings-panel-inventory #jjiv-root{display:none!important}

/* Hal 10-21: Currency, Close the month, Caption tone and Danger zone are for the team owner / admin only (the server refuses everyone else too) */
#page-settings.wfs-nonadmin [data-wfs-admin]{display:none!important}
