/* A-029 Active supply card (loaded after a027.css). New host id and classes so the legacy
   #dashboard-active-vials rules do not apply. Desktop: tile grid. Phones: one item at a time (swipe). */
.supply-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;}
.supply-card-head .mini-chart-title{margin:0;}
#dashboard-active-supply{min-width:0;}
.supply-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;}
.supply-tile{display:flex;flex-direction:column;min-width:0;background:var(--surface-1,var(--panel));border:1px solid var(--border);border-radius:14px;padding:14px;cursor:pointer;color:var(--text);text-align:left;}
.supply-tile:hover{border-color:var(--border-strong,var(--primary-dim,var(--border)));}
.supply-hit{display:flex;align-items:flex-start;gap:14px;min-width:0;border-radius:10px;}
.supply-tile-actions{padding-left:54px;min-width:0;}
.supply-hit:focus-visible{outline:2px solid var(--primary,#1f9d74);outline-offset:2px;}
.supply-tile.is-out{border-color:var(--border-strong,var(--text-dim));}
.supply-tags .pill.neutral{background:var(--surface-2);color:var(--text);border:1px solid var(--border);}
.supply-tile.is-low{border-color:var(--amber,#c98a12);}
.supply-tile.is-unlinked{border-style:dashed;}
.supply-icon{flex:0 0 40px;display:flex;justify-content:center;padding-top:2px;}
.supply-icon svg{width:30px;height:auto;}
.supply-icon-empty{display:block;width:26px;height:34px;border:2px dashed var(--border-strong,var(--border));border-radius:6px;}
.supply-body{flex:1;min-width:0;}
.supply-head{display:flex;align-items:center;gap:7px;font-weight:700;font-size:15px;line-height:1.25;margin-bottom:6px;}
.supply-head .vial-dot{flex:0 0 8px;width:8px;height:8px;border-radius:50%;}
.supply-name{min-width:0;overflow-wrap:anywhere;}
.supply-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:8px;}
.supply-tags .pill{font-size:11px;}
.supply-bar{height:6px;border-radius:999px;background:var(--surface-2,var(--track,var(--border)));overflow:hidden;margin-bottom:7px;}
.supply-bar span{display:block;height:100%;border-radius:999px;}
.supply-main{font-size:14px;line-height:1.35;margin-bottom:3px;}
.supply-sub{font-size:13px;line-height:1.35;color:var(--text-dim);margin-top:2px;}
.supply-dup-hint{display:block;margin:8px 0 0;padding:0;border:0;background:none;font:inherit;font-size:13px;line-height:1.35;text-align:left;color:var(--text);text-decoration:underline;text-underline-offset:2px;cursor:pointer;width:auto;}
.supply-dup-hint:focus-visible{outline:2px solid var(--primary,#1f9d74);outline-offset:2px;}
.supply-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.supply-counter{display:none;}
.supply-foot{font-size:12px;color:var(--text-dim);margin-top:10px;}
.supply-empty{display:flex;flex-direction:column;align-items:flex-start;gap:10px;}
.supply-empty .empty{margin:0;}
.supply-picker-list{display:flex;flex-direction:column;gap:8px;margin-top:12px;max-height:55vh;overflow:auto;}
.supply-picker-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border:1px solid var(--border);border-radius:10px;}
.supply-picker-row span{display:block;font-size:12px;color:var(--text-dim);}
@media(max-width:700px){
  .supply-card-head .btn{display:none;}
  .supply-grid{display:flex;gap:0;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain;scrollbar-width:none;}
  .supply-grid::-webkit-scrollbar{display:none;}
  .supply-tile{flex:0 0 100%;max-width:100%;scroll-snap-align:start;scroll-snap-stop:always;box-sizing:border-box;}
  .supply-counter{display:block;text-align:center;font-size:12px;color:var(--text-dim);margin-top:8px;}
  .supply-foot{text-align:center;}
  /* Phone card header: keep "Manage inventory" on one line (the title/subtitle column takes the wrap). */
  .mobile-home-card:has(#dashboard-active-supply) .mobile-card-head{margin-bottom:9px!important;}
  .mobile-home-card:has(#dashboard-active-supply) .mobile-card-head>div{min-width:0;flex:1 1 auto;}
  .mobile-home-card:has(#dashboard-active-supply) .mobile-card-link{white-space:nowrap!important;flex:0 0 auto!important;}
}
/* Ref S6: light-theme amber tag text darkened for >=4.5:1 at 11px bold (dark theme already 6.9:1). */
html[data-theme="light"] .supply-tags .pill.warn{color:#7a4e06;}